zice

src/config.js

@@ -6,8 +6,8 @@ export let API_HOST;
 if (process.env.NODE_ENV === 'development') {
 	//API_HOST = '//10.10.95.74:7777';
 	//API_HOST = '//192.168.1.16:7777';
-	API_HOST = '//10.10.94.107:3000';
-	//API_HOST = '//192.168.0.105:7777';
+  API_HOST = '//10.10.95.89:3000';
+  //API_HOST = '//192.168.0.105:7777';
 	//API_HOST = '//localhost:3002';
 	//API_HOST = window.__data.apiHost;
 	//API_HOST = 'http://beacon.duiba.com.cn';

src/locales/zh-CN.json

@@ -226,7 +226,10 @@
 	"Store": "数据",
 	"Operate": "操作",
 	"Computed": "计算属性",
-	"Are you sure to close?": "确定关闭吗？",
+  "Are you sure to close?": "确定关闭吗？",
+  "Failed to update operator": "更新权限列表失败",
+  "Error delete self": "连自己都删？ 不可以！",
+  "No permission": "没有权限喔！",
 	"eventGroup": {
 		"in": "接收",
 		"out": "派发"

src/store/modules/project.js

@@ -126,10 +126,12 @@ export const projectStore = {
 
 		},
 		updateProject(state, project) {
-			const {id, name, creator, data} = project;
+			const {id, name, creator, data, operators, operator} = project;
 			state.id = id;
 			state.name = name;
 			state.creator = creator;
+			state.operators = operators;
+			state.operator = operator;
 
 			const localData = state.data;
 			if (data) {
@@ -183,6 +185,9 @@ export const projectStore = {
 		},
 		modifyDependencies(state, value) {
 			state.data.dependencies = value;
+    },
+    modifyOperators(state, value) {
+			state.operators = value;
 		},
 		/**
 		 * 激活组件

src/views/Editor.vue

@@ -85,7 +85,9 @@
 			...mapState({
 				codeSyncServeConfig(state) {
 					return state.editor.codeSyncServeConfig;
-				},
+        },
+        operators: (state) => state.project.operators,
+        currentOperator: (state) => state.editor.operator,
 			}),
 		},
 		async mounted() {
@@ -212,12 +214,23 @@
 				}
 
 				return cancel;
-			},
+      },
+      checkAuth() {
+        let checkStatus = this.operators.includes(this.currentOperator);
+        if(!checkStatus) {
+          this.$message({
+						message: this.$t('No permission'),
+						type: 'error',
+						duration: 1000,
+					});
+        }
+        return checkStatus;
+      },
 			async clickMenu(menuItem) {
 				switch (menuItem) {
 					case 'save':
 						try {
-							this.saveProject();
+							this.checkAuth() && this.saveProject();
 						} catch (e) {
 						}
 						break;
@@ -232,13 +245,13 @@
 						this.preview();
 						break;
 					case 'pack':
-						await this.pack();
+						this.checkAuth() && await this.pack();
 						break;
 					case 'pack-debug-mode':
-						await this.pack(true);
+						this.checkAuth() && await this.pack(true);
 						break;
 					case 'pack-manager':
-						this.$refs.packManagerDialog.show();
+						this.checkAuth() && this.$refs.packManagerDialog.show();
 						break;
 					case 'search':
 						await this.$refs.processSearchDialog.show();
@@ -253,7 +266,7 @@
 						this.$store.commit('undoRedo', -1);
 						break;
 					case 'px-skin-editor':
-						this.$refs.pxSkinEditorDialog.show();
+						this.checkAuth() && this.$refs.pxSkinEditorDialog.show();
 						break;
 					case 'exit':
 						const {projectID} = this.$route.params;

src/views/Editor/dialogs/DetailsDialog.vue

@@ -26,7 +26,7 @@
 				<projectx-config ref="projectxConfig"/>
 			</el-tab-pane>
       <el-tab-pane :label="$t('Auth manager')" name="authManagerEditor">
-				<auth-manager-editor></auth-manager-editor>
+				<auth-manager-editor ref="authManagerEditor"/>
 			</el-tab-pane>
 		</el-tabs>
 		<div slot="footer" class="dialog-footer">

src/views/Editor/dialogs/editors/AuthManagerEditor.vue

 <template>
   <div class="project-auth-manager">
     <el-card shadow="hover">
-      <h3 class="title">当前权限用户列表</h3>
-      <div class="user-list" v-if="operators.length > 0">
+      <h3 class="title">当前权限用户列表{{operatorsData.length}}</h3>
+      <div class="user-list" v-if="operatorsData.length > 0">
         <el-tag
           :key="tag"
-          v-for="tag in operators"
+          v-for="tag in operatorsData"
           closable
           :disable-transitions="false"
           @close="deleteAuth(tag)"
@@ -15,80 +15,97 @@
       </div>
       <p v-else>空</p>
       <el-divider></el-divider>
-      <el-button type="primary" size="small" @click="addDivShow = true">增加权限</el-button>
+      <el-button type="primary" size="small" @click="addDivShow = true"
+        >增加权限</el-button
+      >
     </el-card>
+    <br />
     <el-card shadow="hover" v-show="addDivShow">
       <p>请先勾选后，点击添加按钮</p>
       <el-checkbox-group v-model="checkList">
         <el-checkbox
           v-for="item in devPersons"
-          :key="'dev-' + item"
-          :label="item"
-          :disabled="operators.includes(item)"
+          :key="'dev-' + item.id"
+          :label="item.name"
+          :disabled="operatorsData.includes(item.name)"
         ></el-checkbox>
       </el-checkbox-group>
+      <br />
       <el-button type="primary" size="small" @click="onAdd">添加</el-button>
     </el-card>
   </div>
 </template>
 <script>
 import { mapState, mapGetters, mapMutations } from "vuex";
-import {playWaiting} from "../../../../utils";
-
-
+import { playWaiting } from "../../../../utils";
+import { getDevPersons } from "../../../../api/editor";
+import { updateOperators } from "../../../../api/project";
+// updateOperators
 export default {
   name: "AuthManagerEditor",
   data() {
     return {
-      authList: ["张超", "姜西西", "王竹君"],
-      checkList: ["张超"],
+      checkList: [],
       devPersons: [],
-      addDivShow: false
+      addDivShow: false,
     };
   },
   computed: {
     ...mapState({
-      operators: (state) =>
-        state.project.operators && state.project.operators.split(","),
+      operatorsData: (state) => state.project.operators && state.project.operators.split(","),
+      projectId: (state) => state.project.id,
+      currentOperator: (state) => state.editor.operator,
     }),
   },
-  mounted() {
-    // getDevPersons
-    this._getDevPersons()
-  },
   methods: {
-    async _getDevPersons() {
-      this.devPersons = await this.getDevPersons();
-    },
-    // edit() {
-    //   this.operators = clonePureObj(this.operators).split(",");
-    // },
-    save() {
-      // this.modifyEnv(this.editData);
+    ...mapMutations(["modifyOperators"]),
+    async edit() {
+      this.devPersons = await getDevPersons();
     },
     onAdd() {
-      this.checkList = [];
-      this.addDivShow = false;
-      // this.editData.push({
-      //   name: "",
-      //   value: "",
-      // });
+      if(!this.operatorsData.includes(this.currentOperator)) {
+        this.$message({ message: this.$t('No permission'), type: "error" });
+        return false;
+      }
+      let mergeData = [...this.operatorsData, ...this.checkList].join(",");
+      this.onUpdate(mergeData);
+    },
+    async onUpdate(mergeData) {
+      updateOperators(this.projectId, mergeData)
+        .then(() => {
+          this.$message({
+            message: this.$t("Operate success"),
+            type: "success",
+          });
+          this.modifyOperators(mergeData);
+          this.checkList = [];
+          this.addDivShow = false;
+        })
+        .catch((e) => {
+          this.$message({ message: e.message, type: "error" });
+        });
     },
     deleteAuth(tag) {
-      this.$confirm(
-        this.$t("Are you sure to delete this user auth") + tag,
-        // this.$t("Alert"),
-        {
-          confirmButtonText: this.$t("Confirm"),
-          cancelButtonText: this.$t("Cancel"),
-          type: "warning",
-        }
-      )
+      if(this.currentOperator === tag) {
+        this.$message({ message: this.$t('Error delete self'), type: "error" });
+        return false;
+      }
+      if(!this.operatorsData.includes(this.currentOperator)) {
+        this.$message({ message: this.$t('No permission'), type: "error" });
+        return false;
+      }
+      this.$confirm(this.$t("Are you sure to delete this user auth") + tag, {
+        confirmButtonText: this.$t("Confirm"),
+        cancelButtonText: this.$t("Cancel"),
+        type: "warning",
+      })
         .then(() => {
-          this.authList = this.authList.filter((item) => item !== tag);
+          let mergeData = this.operatorsData
+            .filter((item) => item !== tag)
+            .join(",");
+          this.onUpdate(mergeData);
         })
         .catch((e) => {});
-      console.log(tag);
     },
   },
 };