From 1f08c596a4ff1582ae0e8a3972df5daa8b4a6100 Mon Sep 17 00:00:00 2001
From: kuaifan <aipaw@live.cn>
Date: Sun, 6 Jun 2021 12:52:42 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96vuex=20mutations?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 resources/assets/js/pages/login.vue           |  7 ++-
 resources/assets/js/pages/manage.vue          |  7 +--
 .../pages/manage/components/DialogWrapper.vue | 11 ++---
 .../pages/manage/components/ProjectList.vue   | 43 ++++++++++++-------
 .../js/pages/manage/setting/password.vue      |  7 ++-
 .../js/pages/manage/setting/personal.vue      |  5 ++-
 resources/assets/js/store/mutations.js        |  8 ++--
 7 files changed, 56 insertions(+), 32 deletions(-)

diff --git a/resources/assets/js/pages/login.vue b/resources/assets/js/pages/login.vue
index 501e80fb..010e38bb 100644
--- a/resources/assets/js/pages/login.vue
+++ b/resources/assets/js/pages/login.vue
@@ -113,6 +113,8 @@
 </style>
 
 <script>
+import {mapMutations} from "vuex";
+
 export default {
     data() {
         return {
@@ -127,6 +129,9 @@ export default {
             code: '',
         }
     },
+    computed: {
+        ...mapMutations(['setUserInfo']),
+    },
     methods: {
         reCode() {
             this.codeUrl = $A.apiUrl('users/login/codeimg?_=' + Math.random())
@@ -173,7 +178,7 @@ export default {
                 },
                 success: ({ret, data, msg}) => {
                     if (ret === 1) {
-                        this.$store.commit('setUserInfo', data);
+                        this.setUserInfo(data);
                         //
                         this.goNext();
                     } else {
diff --git a/resources/assets/js/pages/manage.vue b/resources/assets/js/pages/manage.vue
index af1cab5b..46b81dc0 100644
--- a/resources/assets/js/pages/manage.vue
+++ b/resources/assets/js/pages/manage.vue
@@ -231,7 +231,7 @@
 </style>
 
 <script>
-import { mapState } from 'vuex'
+import {mapMutations, mapState} from 'vuex'
 
 export default {
     data() {
@@ -252,13 +252,14 @@ export default {
         }
     },
     mounted() {
-        this.$store.commit('getUserInfo');
+        this.$store.commit("getUserInfo");
     },
     deactivated() {
         this.addShow = false;
     },
     computed: {
         ...mapState(['projectList']),
+        ...mapMutations(['getProjectList']),
     },
     watch: {
         '$route' (route) {
@@ -352,7 +353,7 @@ export default {
                                 this.$set(this.addData, 'template', 0);
                                 //
                                 this.loadIng++;
-                                this.$store.commit('getProjectList', () => {
+                                this.getProjectList(() => {
                                     this.loadIng--;
                                 });
                             } else {
diff --git a/resources/assets/js/pages/manage/components/DialogWrapper.vue b/resources/assets/js/pages/manage/components/DialogWrapper.vue
index 6522eff2..956fc260 100644
--- a/resources/assets/js/pages/manage/components/DialogWrapper.vue
+++ b/resources/assets/js/pages/manage/components/DialogWrapper.vue
@@ -43,7 +43,7 @@
 <script>
 import DragInput from "../../../components/DragInput";
 import ScrollerY from "../../../components/ScrollerY";
-import {mapState} from "vuex";
+import {mapMutations, mapState} from "vuex";
 import DialogView from "./DialogView";
 import DialogUpload from "./DialogUpload";
 
@@ -67,6 +67,7 @@ export default {
 
     computed: {
         ...mapState(['userId', 'dialogId', 'dialogDetail', 'dialogMsgLoad', 'dialogMsgList']),
+        ...mapMutations(["spliceDialogMsg"]),
 
         peopleNum() {
             return this.dialogDetail.type === 'group' ? $A.runNum(this.dialogDetail.people) : 0;
@@ -107,7 +108,7 @@ export default {
                     text: this.msgText,
                 },
                 error:() => {
-                    this.$store.commit('spliceDialogMsg', {id: tempId});
+                    this.spliceDialogMsg({id: tempId});
                 },
                 success: ({ret, data, msg}) => {
                     if (ret !== 1) {
@@ -116,7 +117,7 @@ export default {
                             content: msg
                         });
                     }
-                    this.$store.commit('spliceDialogMsg', {
+                    this.spliceDialogMsg({
                         id: tempId,
                         data: ret === 1 ? data : null
                     });
@@ -184,11 +185,11 @@ export default {
                     break;
 
                 case 'error':
-                    this.$store.commit('spliceDialogMsg', {id: file.tempId});
+                    this.spliceDialogMsg({id: file.tempId});
                     break;
 
                 case 'success':
-                    this.$store.commit('spliceDialogMsg', {id: file.tempId, data: file.data});
+                    this.spliceDialogMsg({id: file.tempId, data: file.data});
                     break;
             }
         },
diff --git a/resources/assets/js/pages/manage/components/ProjectList.vue b/resources/assets/js/pages/manage/components/ProjectList.vue
index 6d11abb6..5bba0eec 100644
--- a/resources/assets/js/pages/manage/components/ProjectList.vue
+++ b/resources/assets/js/pages/manage/components/ProjectList.vue
@@ -24,7 +24,7 @@
                             </div>
                         </Tooltip>
                     </li>
-                    <li :class="['project-icon', $store.state.projectChatShow ? 'active' : '']" @click="$store.commit('toggleBoolean', 'projectChatShow')">
+                    <li :class="['project-icon', projectChatShow ? 'active' : '']" @click="toggleBoolean('projectChatShow')">
                         <Icon type="ios-chatbubbles" />
                         <Badge :count="projectMsgUnread"></Badge>
                     </li>
@@ -45,14 +45,14 @@
                     </li>
                 </ul>
                 <div class="project-switch">
-                    <div :class="['project-switch-button', !$store.state.projectListPanel ? 'menu' : '']" @click="$store.commit('toggleBoolean', 'projectListPanel')">
+                    <div :class="['project-switch-button', !projectListPanel ? 'menu' : '']" @click="toggleBoolean('projectListPanel')">
                         <div><i class="iconfont">&#xe60c;</i></div>
                         <div><i class="iconfont">&#xe66a;</i></div>
                     </div>
                 </div>
             </div>
         </div>
-        <div v-if="$store.state.projectListPanel" class="project-column">
+        <div v-if="projectListPanel" class="project-column">
             <ul>
                 <li v-for="column in projectDetail.project_column">
                     <div class="column-head">
@@ -107,8 +107,8 @@
                 </Row>
             </div>
             <!--我的任务-->
-            <div :class="['project-table-body', !$store.state.taskMyShow ? 'project-table-hide' : '']">
-                <div @click="$store.commit('toggleBoolean', 'taskMyShow')">
+            <div :class="['project-table-body', !taskMyShow ? 'project-table-hide' : '']">
+                <div @click="toggleBoolean('taskMyShow')">
                     <Row class="project-row">
                         <Col span="12" class="row-title">
                             <i class="iconfont">&#xe689;</i>
@@ -165,8 +165,8 @@
                 </div>
             </div>
             <!--未完成任务-->
-            <div :class="['project-table-body', !$store.state.taskUndoneShow ? 'project-table-hide' : '']">
-                <div @click="$store.commit('toggleBoolean', 'taskUndoneShow')">
+            <div :class="['project-table-body', !taskUndoneShow ? 'project-table-hide' : '']">
+                <div @click="toggleBoolean('taskUndoneShow')">
                     <Row class="project-row">
                         <Col span="12" class="row-title">
                             <i class="iconfont">&#xe689;</i>
@@ -212,8 +212,8 @@
                 </div>
             </div>
             <!--已完成任务-->
-            <div :class="['project-table-body', !$store.state.taskCompletedShow ? 'project-table-hide' : '']">
-                <div @click="$store.commit('toggleBoolean', 'taskCompletedShow')">
+            <div :class="['project-table-body', !taskCompletedShow ? 'project-table-hide' : '']">
+                <div @click="toggleBoolean('taskCompletedShow')">
                     <Row class="project-row">
                         <Col span="12" class="row-title">
                             <i class="iconfont">&#xe689;</i>
@@ -828,7 +828,7 @@
 <script>
 import TaskPriority from "./TaskPriority";
 import TaskAdd from "./TaskAdd";
-import {mapState} from "vuex";
+import {mapState, mapMutations} from "vuex";
 import UserInput from "../../../components/UserInput";
 export default {
     name: "ProjectList",
@@ -869,7 +869,18 @@ export default {
         }, 1000)
     },
     computed: {
-        ...mapState(['userId', 'projectDetail', 'projectLoad', 'projectMsgUnread']),
+        ...mapState([
+            'userId',
+            'projectDetail',
+            'projectLoad',
+            'projectMsgUnread',
+            'projectChatShow',
+            'projectListPanel',
+            'taskMyShow',
+            'taskUndoneShow',
+            'taskCompletedShow'
+        ]),
+        ...mapMutations(['toggleBoolean', 'getProjectList', 'getProjectDetail']),
 
         panelTask() {
             const {searchText} = this;
@@ -973,7 +984,7 @@ export default {
                 success: ({ret, data, msg}) => {
                     if (ret === 1) {
                         $A.messageSuccess(msg);
-                        this.$store.commit('getProjectDetail', this.addData.project_id);
+                        this.getProjectDetail(this.addData.project_id);
                         this.addShow = false;
                         this.addData = {
                             owner: 0,
@@ -1026,7 +1037,7 @@ export default {
                 success: ({ret, data, msg}) => {
                     if (ret === 1) {
                         $A.messageSuccess(msg);
-                        this.$store.commit('getProjectDetail', this.userData.project_id);
+                        this.getProjectDetail(this.userData.project_id);
                         this.userShow = false;
                     } else {
                         $A.modalError(msg);
@@ -1049,7 +1060,7 @@ export default {
                 success: ({ret, data, msg}) => {
                     if (ret === 1) {
                         $A.messageSuccess(msg);
-                        this.$store.commit('getProjectDetail', this.transferData.project_id);
+                        this.getProjectDetail(this.transferData.project_id);
                         this.transferShow = false;
                     } else {
                         $A.modalError(msg);
@@ -1077,7 +1088,7 @@ export default {
                             this.$Modal.remove();
                             if (ret === 1) {
                                 $A.messageSuccess(msg);
-                                this.$store.commit('getProjectList');
+                                this.getProjectList();
                                 this.goForward({path: '/manage/dashboard'}, true);
                             }else{
                                 $A.modalError(msg, 301);
@@ -1107,7 +1118,7 @@ export default {
                             this.$Modal.remove();
                             if (ret === 1) {
                                 $A.messageSuccess(msg);
-                                this.$store.commit('getProjectList');
+                                this.getProjectList();
                                 this.goForward({path: '/manage/dashboard'}, true);
                             }else{
                                 $A.modalError(msg, 301);
diff --git a/resources/assets/js/pages/manage/setting/password.vue b/resources/assets/js/pages/manage/setting/password.vue
index 75a70926..7d7b9003 100644
--- a/resources/assets/js/pages/manage/setting/password.vue
+++ b/resources/assets/js/pages/manage/setting/password.vue
@@ -19,6 +19,8 @@
 </template>
 
 <script>
+import {mapMutations} from "vuex";
+
 export default {
     data() {
         return {
@@ -33,6 +35,9 @@ export default {
             ruleDatum: { },
         }
     },
+    computed: {
+        ...mapMutations(['setUserInfo']),
+    },
     methods: {
         initLanguage() {
             this.ruleDatum = {
@@ -88,7 +93,7 @@ export default {
                         success: ({ret, data, msg}) => {
                             if (ret === 1) {
                                 $A.messageSuccess('修改成功！');
-                                this.$store.commit('setUserInfo', data);
+                                this.setUserInfo(data);
                                 this.$refs.formDatum.resetFields();
                             } else {
                                 $A.modalError(msg);
diff --git a/resources/assets/js/pages/manage/setting/personal.vue b/resources/assets/js/pages/manage/setting/personal.vue
index 2971f32c..768629ac 100644
--- a/resources/assets/js/pages/manage/setting/personal.vue
+++ b/resources/assets/js/pages/manage/setting/personal.vue
@@ -24,7 +24,7 @@
 
 <script>
 import ImgUpload from "../../../components/ImgUpload";
-import {mapState} from "vuex";
+import {mapMutations, mapState} from "vuex";
 export default {
     components: {ImgUpload},
     data() {
@@ -45,6 +45,7 @@ export default {
     },
     computed: {
         ...mapState(['userInfo']),
+        ...mapMutations(['getUserInfo']),
     },
     watch: {
         userInfo() {
@@ -81,7 +82,7 @@ export default {
                         success: ({ret, data, msg}) => {
                             if (ret === 1) {
                                 $A.messageSuccess('修改成功');
-                                this.$store.commit('getUserInfo');
+                                this.getUserInfo();
                             } else {
                                 $A.modalError(msg);
                             }
diff --git a/resources/assets/js/store/mutations.js b/resources/assets/js/store/mutations.js
index e17965f6..2d778fbb 100644
--- a/resources/assets/js/store/mutations.js
+++ b/resources/assets/js/store/mutations.js
@@ -152,7 +152,7 @@ export default {
     /**
      * 获取用户基本信息
      * @param state
-     * @param params {userid, success, complete}
+     * @param params // {userid, success, complete}
      */
     getUserBasic(state, params) {
         if (!state.method.isJson(params)) {
@@ -274,7 +274,7 @@ export default {
     /**
      * 根据消息ID 删除 或 替换 对话数据
      * @param state
-     * @param params {id, data}
+     * @param params // {id, data}
      */
     spliceDialogMsg(state, params) {
         let {id, data} = params;
@@ -388,7 +388,7 @@ export default {
     /**
      * 发送 websocket 消息
      * @param state
-     * @param params {type, data, callback, msgId}
+     * @param params // {type, data, callback, msgId}
      */
     wsSend(state, params) {
         if (!state.method.isJson(params)) {
@@ -418,7 +418,7 @@ export default {
     /**
      * 监听消息
      * @param state
-     * @param params {name, callback}
+     * @param params // {name, callback}
      */
     wsMsgListener(state, params) {
         const {name, callback} = params;