component 값 변경 체크에 따른 저장버튼 활성화 > disabled

components/form/MultiLineTextInput.vue

@@ -67,7 +67,10 @@ export default {
   },
   methods: {
     emitAdd() {
-      this.canAddLine && this.$emit('addClicked')
+      // this.canAddLine && this.$emit('addClicked')
+      if (this.canAddLine || this.lines.length === 0) {
+        this.$emit('addClicked')
+      }
     },
     emitRemove(index) {
       this.canDeleteLine && this.$emit('removeClicked', index)

pages/instructor/course/_id/manage.vue

@@ -7,6 +7,7 @@
         <div class="full-page-takeover-header-button">
           <button
             @click="updateCourse"
+            :disabled="!canUpdateCourse"
             class="button is-primary is-inverted is-medium is-outlined">
             Save
           </button>
@@ -114,7 +115,8 @@ export default {
   },
   computed: {
     ...mapState({
-      course: ({instructor}) => instructor.course.item
+      course: ({instructor}) => instructor.course.item,
+      canUpdateCourse: ({instructor}) => instructor.course.canUpdateCourse
     })
   },
   methods: {

store/instructor/course.js

@@ -1,7 +1,8 @@
 
 export const state = () => ({
   items : [],
-  item : []
+  item : [],
+  canUpdateCourse: false
 })
 
 export const actions = {
@@ -43,9 +44,13 @@ export const actions = {
   updateLine({commit}, {index, value, field}) {
     commit('setLineValue', {index, value, field})
     // Surprise commit for next lectures (:
+    commit('setCanUpdateCourse', true)
+
   },
   updateCourseValue({commit}, {value, field}) {
     commit('setCourseValue', {value, field})
+    commit('setCanUpdateCourse', true)
+
   },
   async updateCourse({state, commit}) {
     try {
@@ -55,6 +60,7 @@ export const actions = {
       console.log('courses.js mutations call setCourse')
       commit('setCourse', course)
       console.log('courses.js mutations done setCourse')
+      commit('setCanUpdateCourse', false)
       return state.item
     } catch (error) {
       return error
@@ -86,5 +92,8 @@ export const mutations = {
   },
   setCourseValue(state, {value, field}){
     state.item[field] = value
-  }
+  },
+  setCanUpdateCourse(state, canUpdate) {
+    state.canUpdateCourse = canUpdate
+  },
 }