src/main.js

@@ -381,7 +381,7 @@ async function VueInit() {
       zzSessionStorage.removeItem('isLock')
       router.push("/login")
     }).then(() => {
-      _vm.$alert(lang === 'zh' ? '由于您长时间未操作，为保护您的数据安全已强制将您下线，如果需要继续操作请重新登录！' : 'No operation for a long time non-operation, you have been forced logout to protect data security. If continue to operate, please login again!', {
+      _vm.$alert(lang === 'zh' ? '由于您长时间未操作，为保护您的数据安全已强制将您下线，如果需要继续操作请重新登陆！' : 'No operation for a long time non-operation, you have been forced logout to protect data security. If continue to operate, please login again!', {
         type: 'warning',
       })
     })

src/views/system/role/components/RoleForm.vue

@@ -16,17 +16,13 @@
         <el-form-item label="Shortname: " prop="UserTypeShortName">
           <el-input v-model="form.UserTypeShortName" />
         </el-form-item>
-        <el-form-item
-          :label="$t('system:role:form:isInternal')"
-          prop="IsInternal"
-        >
+        <el-form-item label="是否内部角色: " prop="IsInternal">
           <el-radio-group v-model="form.IsInternal">
             <el-radio
               v-for="item of $d.YesOrNo"
               :key="`IsInternal${item.value}`"
               :label="item.value"
-              >{{ item.label }}</el-radio
-            >
+            >{{ item.label }}</el-radio>
           </el-radio-group>
         </el-form-item>
 
@@ -42,11 +38,7 @@
         </el-form-item>
 
         <el-form-item label="Order: ">
-          <el-input-number
-            v-model="form.Order"
-            controls-position="right"
-            :min="0"
-          />
+          <el-input-number v-model="form.Order" controls-position="right" :min="0" />
         </el-form-item>
         <el-form-item label="PermissionStr: " prop="PermissionStr">
           <el-input v-model="form.PermissionStr" />
@@ -66,23 +58,9 @@
           <el-input v-model="form.Description" type="textarea" :rows="5" />
         </el-form-item>
         <el-form-item label="role: ">
-          <el-checkbox
-            v-model="menuExpand"
-            @change="handleCheckedTreeExpand($event)"
-            >{{ $t("system:role:form:checkbox:menuExpand") }}</el-checkbox
-          >
-          <el-checkbox
-            v-model="menuNodeAll"
-            @change="handleCheckedTreeNodeAll($event)"
-            >{{ $t("system:role:form:checkbox:menuNodeAll") }}</el-checkbox
-          >
-          <el-checkbox
-            v-model="form.menuCheckStrictly"
-            @change="handleCheckedTreeConnect($event)"
-            >{{
-              $t("system:role:form:checkbox:menuCheckStrictly")
-            }}</el-checkbox
-          >
+          <el-checkbox v-model="menuExpand" @change="handleCheckedTreeExpand($event)">展开/折叠</el-checkbox>
+          <el-checkbox v-model="menuNodeAll" @change="handleCheckedTreeNodeAll($event)">全选/全不选</el-checkbox>
+          <el-checkbox v-model="form.menuCheckStrictly" @change="handleCheckedTreeConnect($event)">父子联动</el-checkbox>
           <el-tree
             ref="menu"
             class="tree-border"
@@ -98,186 +76,155 @@
       </el-form>
     </template>
     <template slot="dialog-footer">
-      <el-button
-        :disabled="btnLoading"
-        size="small"
-        type="primary"
-        @click="model_cfg.visible = false"
-        >Cancel
+      <el-button :disabled="btnLoading" size="small" type="primary" @click="model_cfg.visible = false">Cancel
       </el-button>
-      <el-button
-        size="small"
-        type="primary"
-        :loading="btnLoading"
-        @click="handleSave"
-        >Save</el-button
-      >
+      <el-button size="small" type="primary" :loading="btnLoading" @click="handleSave">Save</el-button>
     </template>
   </base-model>
 </template>
 <script>
-import { addOrUpdateUserType } from "@/api/admin";
+import { addOrUpdateUserType } from '@/api/admin'
 // import { addOrUpdateUserType } from '@/api/system/role'
 // import { getMenuList } from '@/api/system/menu'
-import { getMenuList } from "@/api/system/menu";
-import { model_cfg } from "../role";
-import BaseModel from "@/components/BaseModel";
+import { getMenuList } from '@/api/system/menu'
+import { model_cfg } from '../role'
+import BaseModel from '@/components/BaseModel'
 
 export default {
   components: { BaseModel },
-  dicts: ["UserTypeGroup"],
+  dicts: ['UserTypeGroup'],
   props: {
     data: {
       type: Object,
       default() {
         return {
-          Id: "",
-          UserTypeName: "",
+          Id: '',
+          UserTypeName: '',
           IsInternal: true,
-          UserTypeShortName: "",
-          Order: "",
-          Description: "",
-          PermissionStr: "",
-          UserTypeEnum: null,
-        };
-      },
-    },
+          UserTypeShortName: '',
+          Order: '',
+          Description: '',
+          PermissionStr: '',
+          UserTypeEnum: null
+        }
+      }
+    }
   },
   data() {
     return {
       menuExpand: false,
       menuNodeAll: false,
-      userTypeGroupOptions: [
-        { value: 1, label: "Trial" },
-        { value: 2, label: "Reviewer" },
-        { value: 3, label: "Other" },
-      ],
+      userTypeGroupOptions: [{ value: 1, label: 'Trial' }, { value: 2, label: 'Reviewer' }, { value: 3, label: 'Other' }],
       model_cfg,
       defaultProps: {
-        children: "Children",
-        label: "MenuName",
+        children: 'Children',
+        label: 'MenuName'
       },
       form: {
-        Id: "",
-        UserType: "",
+        Id: '',
+        UserType: '',
         IsInternal: true,
-        UserTypeShortName: "",
+        UserTypeShortName: '',
         Type: null,
-        Description: "",
+        Description: '',
         UserTypeGroupIdList: [],
-        menuCheckStrictly: true,
+        menuCheckStrictly: true
       },
       rules: {
-        UserTypeName: [
-          { required: true, message: "Please specify", trigger: "blur" },
-          {
-            max: 50,
-            message: "The maximum length is 50",
-          },
-        ],
-        UserTypeShortName: [
-          { required: true, message: "Please specify", trigger: "blur" },
-          {
-            max: 50,
-            message: "The maximum length is 50",
-            trigger: "blur",
-          },
-        ],
-        Description: [{ max: 500, message: "The maximum length is 500" }],
-        UserTypeGroupIdList: [
-          { required: true, message: "Please specify", trigger: "blur" },
-        ],
-        UserTypeEnum: [
-          { required: true, message: "Please select", trigger: "blur" },
-        ],
+        UserTypeName: [{ required: true, message: 'Please specify', trigger: 'blur' }, {
+          max: 50,
+          message: 'The maximum length is 50'
+        }],
+        UserTypeShortName: [{ required: true, message: 'Please specify', trigger: 'blur' }, {
+          max: 50,
+          message: 'The maximum length is 50',
+          trigger: 'blur'
+        }],
+        Description: [{ max: 500, message: 'The maximum length is 500' }],
+        UserTypeGroupIdList: [{ required: true, message: 'Please specify', trigger: 'blur' }],
+        UserTypeEnum: [{ required: true, message: 'Please select', trigger: 'blur' }]
       },
       menuOptions: [],
-      btnLoading: false,
-    };
+      btnLoading: false
+    }
   },
   mounted() {
-    this.getMenuList();
+    this.getMenuList()
     if (Object.keys(this.data).length && this.data.Id) {
-      this.form = { ...this.data };
+      this.form = { ...this.data }
     }
   },
   methods: {
     handleCheckedTreeConnect(value) {
-      this.form.menuCheckStrictly = !!value;
+      this.form.menuCheckStrictly = !!value
     },
     getMenuAllCheckedKeys() {
       // 目前被选中的菜单节点
-      const checkedKeys = this.$refs.menu.getCheckedKeys();
+      const checkedKeys = this.$refs.menu.getCheckedKeys()
       // 半选中的菜单节点
-      const halfCheckedKeys = this.$refs.menu.getHalfCheckedKeys();
-      checkedKeys.unshift.apply(checkedKeys, halfCheckedKeys);
-      return checkedKeys;
+      const halfCheckedKeys = this.$refs.menu.getHalfCheckedKeys()
+      checkedKeys.unshift.apply(checkedKeys, halfCheckedKeys)
+      return checkedKeys
     },
 
     handleCheckedTreeExpand(value) {
-      const treeList = this.menuOptions;
+      const treeList = this.menuOptions
       for (let i = 0; i < treeList.length; i++) {
-        this.$refs.menu.store.nodesMap[treeList[i].MenuId].expanded = value;
+        this.$refs.menu.store.nodesMap[treeList[i].MenuId].expanded = value
       }
     },
     handleCheckedTreeNodeAll(value, type) {
-      this.$refs.menu.setCheckedNodes(value ? this.menuOptions : []);
+      this.$refs.menu.setCheckedNodes(value ? this.menuOptions : [])
     },
     toTree(arr, ParentId) {
       function loop(ParentId) {
-        const res = [];
+        const res = []
         for (let i = 0; i < arr.length; i++) {
-          const item = arr[i];
-          item.hasChildren = false;
+          const item = arr[i]
+          item.hasChildren = false
           if (item.ParentId !== ParentId) {
-            continue;
+            continue
           }
-          item.Children = loop(item.MenuId);
-          res.push(item);
+          item.Children = loop(item.MenuId)
+          res.push(item)
         }
-        return res;
+        return res
       }
 
-      return loop(ParentId);
+      return loop(ParentId)
     },
     getMenuList() {
-      getMenuList({})
-        .then((res) => {
-          const menu = this.toTree(
-            res.Result,
-            "00000000-0000-0000-0000-000000000000"
-          );
-          this.menuOptions = menu;
-          console.log(this.menuOptions);
-          this.$nextTick(() => {
-            this.form.MenuIds.forEach((v) => {
-              this.$refs.menu.setChecked(v, true, false);
-            });
-          });
+      getMenuList({}).then(res => {
+        const menu = this.toTree(res.Result, '00000000-0000-0000-0000-000000000000')
+        this.menuOptions = menu
+        console.log(this.menuOptions)
+        this.$nextTick(() => {
+          this.form.MenuIds.forEach(v => {
+            this.$refs.menu.setChecked(v, true, false)
+          })
         })
-        .catch(function () {});
+      }).catch(function() {
+      })
     },
     handleSave() {
-      this.$refs.roleForm.validate((valid) => {
-        if (!valid) return;
-        this.btnLoading = true;
-        this.model_cfg.showClose = false;
-        this.form.MenuIds = this.getMenuAllCheckedKeys();
-        console.log(this.form.MenuIds);
-        addOrUpdateUserType(this.form)
-          .then((res) => {
-            this.btnLoading = false;
-            this.$refs["roleForm"].resetFields();
-            this.$emit("close");
-            this.model_cfg.showClose = true;
-            this.$message.success("Saved successfully!");
-          })
-          .catch(() => {
-            this.btnLoading = false;
-            this.model_cfg.showClose = true;
-          });
-      });
-    },
-  },
-};
+      this.$refs.roleForm.validate(valid => {
+        if (!valid) return
+        this.btnLoading = true
+        this.model_cfg.showClose = false
+        this.form.MenuIds = this.getMenuAllCheckedKeys()
+        console.log(this.form.MenuIds)
+        addOrUpdateUserType(this.form).then(res => {
+          this.btnLoading = false
+          this.$refs['roleForm'].resetFields()
+          this.$emit('close')
+          this.model_cfg.showClose = true
+          this.$message.success('Saved successfully!')
+        }).catch(() => {
+          this.btnLoading = false
+          this.model_cfg.showClose = true
+        })
+      })
+    }
+  }
+}
 </script>