modify Modal component

ximumukang · Aug 23, 2017 · aa74781 · aa74781
1 parent 3239871
commit aa74781
Show file tree

Hide file tree

Showing 6 changed files with 191 additions and 207 deletions.
diff --git a/.idea/workspace.xml b/.idea/workspace.xml
diff --git a/src/App.vue b/src/App.vue
@@ -9,11 +9,40 @@
         <router-view></router-view>
       </div>
     </main>
+    <Modal :isOpenModal="isOpenModal"
+           :hasCancel="hasCancel"
+           :message="message"
+           :isToIndex="isToIndex"
+           :confirm="confirm"
+           :closeModal="closeModal">
+    </Modal>
   </div>
+
 </template>
 
 <script type="text/ecmascript-6">
+  import Modal from './components/Modal.vue'
+  import {mapState,mapActions, mapMutations} from 'vuex'
   export default {
+    components:{
+      Modal
+    },
+    computed:{
+      ...mapState([
+        'isOpenModal',
+        'hasCancel',
+        'message',
+        'isToIndex'
+      ])
+    },
+    methods:{
+      ...mapMutations([
+        'closeModal'
+      ]),
+      ...mapActions([
+        'confirm'
+      ])
+    }
 
   }
 </script>

diff --git a/src/components/Edit.vue b/src/components/Edit.vue
@@ -63,15 +63,11 @@
         <button class="btn" id="submit-question" @click="submitQuestion">发布问卷</button>
       </span>
     </div>
-    <Modal></Modal>
   </div>
 </template>
 
 <script type="text/ecmascript-6">
-  import Modal from './Modal.vue'
-  import {mapState} from 'vuex'
-  import {mapMutations} from 'vuex'
-  import {mapGetters} from 'vuex'
+  import {mapState,mapMutations,} from 'vuex'
   export default {
     name: 'EditQuestionnaire',
     data: function () {
@@ -83,8 +79,6 @@
       ...mapState([
         'isAddQuestion',
         'survey',
-        'isOpenModal',
-        'message',
         'savedIndex'
       ]),
     },
@@ -113,9 +107,6 @@
         }
       }
     },
-    components: {
-      Modal
-    },
     beforeRouteLeave (to, from, next) {
       // 导航离开该组件的对应路由时调用
       // 可以访问组件实例 `this`

diff --git a/src/components/Home.vue b/src/components/Home.vue
@@ -34,17 +34,12 @@
         </td>
       </tr>
     </table>
-    <Modal></Modal>
   </div>
 </template>
 <script type="text/ecmascript-6">
-  import {mapState, mapMutations} from 'vuex'
-  import Modal from './Modal.vue'
+  import {mapState,mapActions, mapMutations} from 'vuex'
   export default {
     name: 'Home',
-    components:{
-      Modal
-    },
     data: function () {
       return {
         isShowTable: false,
@@ -66,7 +61,7 @@
         'isDeleteSaved',
         'isDeleteSubmit',
         'savedQuestionnaire',
-        'submitQuestionnaire'
+        'submitQuestionnaire',
       ]),
 
     },
@@ -92,8 +87,8 @@
         'toView',
         'deleteSaved',
         'deleteSubmit',
-        'updateSurveyList'
-      ])
+        'updateSurveyList',
+      ]),
     },
     beforeRouteEnter(to,from,next){
         next(vm => {

diff --git a/src/components/Modal.vue b/src/components/Modal.vue
@@ -22,25 +22,17 @@
 
   export default {
     name: 'Modal',
+    props: [
+      'isOpenModal',
+      'hasCancel',
+      'message',
+      'isToIndex',
+      'closeModal',
+      'confirm'
+    ],
     data: function () {
       return {}
     },
-    computed: {
-      ...mapState([
-        'isOpenModal',
-        'hasCancel',
-        'message',
-        'isToIndex'
-      ])
-    },
-    methods: {
-      ...mapMutations([
-        'closeModal'
-      ]),
-      ...mapActions([
-        'confirm'
-      ])
-    }
   }
 </script>
 

diff --git a/src/vuex/store.js b/src/vuex/store.js
@@ -80,7 +80,7 @@ export default new Vuex.Store({
     confirmDeleteSubmit(state){
       let submitQuestionnaire=JSON.parse(localStorage.submitQuestionnaire);
       submitQuestionnaire.splice(state.deleteIndex,1);
-      localStorage.savedQuestionnaire=JSON.stringify(submitQuestionnaire);
+      localStorage.submitQuestionnaire=JSON.stringify(submitQuestionnaire);
     },
 
     updateSurveyList(state){
@@ -179,6 +179,7 @@ export default new Vuex.Store({
         savedQuestionnaire.splice(state.savedIndex,1,state.survey);
       }else {
         savedQuestionnaire.push(state.survey);
+        state.savedIndex=savedQuestionnaire.length-1;
       }
       localStorage.savedQuestionnaire=JSON.stringify(savedQuestionnaire);
     },
@@ -275,7 +276,7 @@ export default new Vuex.Store({
     //确定提交填完的问卷
     confirmFill(state){
       let submitQuestionnaire = JSON.parse(localStorage.submitQuestionnaire);
-      let answer = submitQuestionnaire[state.submitIndex].answer ;
+      let answer = submitQuestionnaire[state.submitIndex].answer;
       if(!answer.length){
 
         for(let i=0,len=state.survey.questionList.length;i<len;i++){
@@ -316,7 +317,8 @@ export default new Vuex.Store({
       state.survey={
         questionList: [],
         title: '这里是标题',
-        date: ''
+        date: '',
+        answer:[]
       };
     }
   },