From 49a93d0188a94de6d56a9fa3ace8cd983630e128 Mon Sep 17 00:00:00 2001
From: wangxiaoshuang <825034831@qq.com>
Date: Mon, 8 Jul 2024 13:55:05 +0800
Subject: [PATCH] =?UTF-8?q?=E7=AE=A1=E7=90=86=E5=90=8E=E5=8F=B0=E8=A7=92?=
 =?UTF-8?q?=E8=89=B2=E6=B7=BB=E5=8A=A0=E5=9B=BD=E9=99=85=E5=8C=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/main.js                                   |   2 +-
 src/views/system/role/components/RoleForm.vue | 239 +++++++++++-------
 2 files changed, 147 insertions(+), 94 deletions(-)

diff --git a/src/main.js b/src/main.js
index ae280b4c..276927e4 100644
--- a/src/main.js
+++ b/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',
       })
     })
diff --git a/src/views/system/role/components/RoleForm.vue b/src/views/system/role/components/RoleForm.vue
index 46aa2bc0..bd79682a 100644
--- a/src/views/system/role/components/RoleForm.vue
+++ b/src/views/system/role/components/RoleForm.vue
@@ -16,13 +16,17 @@
         <el-form-item label="Shortname: " prop="UserTypeShortName">
           <el-input v-model="form.UserTypeShortName" />
         </el-form-item>
-        <el-form-item label="是否内部角色: " prop="IsInternal">
+        <el-form-item
+          :label="$t('system:role:form:isInternal')"
+          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>
 
@@ -38,7 +42,11 @@
         </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" />
@@ -58,9 +66,23 @@
           <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)">展开/折叠</el-checkbox>
-          <el-checkbox v-model="menuNodeAll" @change="handleCheckedTreeNodeAll($event)">全选/全不选</el-checkbox>
-          <el-checkbox v-model="form.menuCheckStrictly" @change="handleCheckedTreeConnect($event)">父子联动</el-checkbox>
+          <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-tree
             ref="menu"
             class="tree-border"
@@ -76,155 +98,186 @@
       </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>