From c13c622eac5551c6f099f148feb5256711ca34de Mon Sep 17 00:00:00 2001
From: 疯狂的狮子Li <15040126243@163.com>
Date: 星期二, 11 七月 2023 21:03:01 +0800
Subject: [PATCH] !25 部分优化以及新增功能 Merge pull request !25 from ahaos/tspr

---
 src/views/system/role/index.vue |  430 +++++++++++++++++++++++++++--------------------------
 1 files changed, 219 insertions(+), 211 deletions(-)

diff --git a/src/views/system/role/index.vue b/src/views/system/role/index.vue
index 33189cd..bcc893f 100644
--- a/src/views/system/role/index.vue
+++ b/src/views/system/role/index.vue
@@ -1,40 +1,42 @@
 <template>
   <div class="p-2">
     <transition :enter-active-class="proxy?.animate.searchAnimate.enter" :leave-active-class="proxy?.animate.searchAnimate.leave">
-      <div class="search" v-show="showSearch">
-        <el-form ref="queryFormRef" :model="queryParams" :inline="true" label-width="68px">
-          <el-form-item label="瑙掕壊鍚嶇О" prop="roleName">
-            <el-input v-model="queryParams.roleName" placeholder="璇疯緭鍏ヨ鑹插悕绉�" clearable style="width: 240px" @keyup.enter="handleQuery" />
-          </el-form-item>
-          <el-form-item label="鏉冮檺瀛楃" prop="roleKey">
-            <el-input v-model="queryParams.roleKey" placeholder="璇疯緭鍏ユ潈闄愬瓧绗�" clearable style="width: 240px" @keyup.enter="handleQuery" />
-          </el-form-item>
-          <el-form-item label="鐘舵��" prop="status">
-            <el-select v-model="queryParams.status" placeholder="瑙掕壊鐘舵��" clearable style="width: 240px">
-              <el-option v-for="dict in sys_normal_disable" :key="dict.value" :label="dict.label" :value="dict.value" />
-            </el-select>
-          </el-form-item>
-          <el-form-item label="鍒涘缓鏃堕棿" style="width: 308px">
-            <el-date-picker
-              v-model="dateRange"
-              value-format="YYYY-MM-DD"
-              type="daterange"
-              range-separator="-"
-              start-placeholder="寮�濮嬫棩鏈�"
-              end-placeholder="缁撴潫鏃ユ湡"
-              :default-time="[new Date(2000, 1, 1, 0, 0, 0), new Date(2000, 1, 1, 23, 59, 59)]"
-            ></el-date-picker>
-          </el-form-item>
+      <div class="mb-[10px]" v-show="showSearch">
+        <el-card shadow="hover">
+          <el-form ref="queryFormRef" :model="queryParams" :inline="true" label-width="68px">
+            <el-form-item label="瑙掕壊鍚嶇О" prop="roleName">
+              <el-input v-model="queryParams.roleName" placeholder="璇疯緭鍏ヨ鑹插悕绉�" clearable style="width: 240px" @keyup.enter="handleQuery" />
+            </el-form-item>
+            <el-form-item label="鏉冮檺瀛楃" prop="roleKey">
+              <el-input v-model="queryParams.roleKey" placeholder="璇疯緭鍏ユ潈闄愬瓧绗�" clearable style="width: 240px" @keyup.enter="handleQuery" />
+            </el-form-item>
+            <el-form-item label="鐘舵��" prop="status">
+              <el-select v-model="queryParams.status" placeholder="瑙掕壊鐘舵��" clearable style="width: 240px">
+                <el-option v-for="dict in sys_normal_disable" :key="dict.value" :label="dict.label" :value="dict.value" />
+              </el-select>
+            </el-form-item>
+            <el-form-item label="鍒涘缓鏃堕棿" style="width: 308px">
+              <el-date-picker
+                v-model="dateRange"
+                value-format="YYYY-MM-DD"
+                type="daterange"
+                range-separator="-"
+                start-placeholder="寮�濮嬫棩鏈�"
+                end-placeholder="缁撴潫鏃ユ湡"
+                :default-time="[new Date(2000, 1, 1, 0, 0, 0), new Date(2000, 1, 1, 23, 59, 59)]"
+              ></el-date-picker>
+            </el-form-item>
 
-          <el-form-item>
-            <el-button type="primary" @click="handleQuery" icon="Search">鎼滅储</el-button>
-            <el-button @click="resetQuery" icon="Refresh">閲嶇疆</el-button>
-          </el-form-item>
-        </el-form>
+            <el-form-item>
+              <el-button type="primary" @click="handleQuery" icon="Search">鎼滅储</el-button>
+              <el-button @click="resetQuery" icon="Refresh">閲嶇疆</el-button>
+            </el-form-item>
+          </el-form>
+        </el-card>
       </div>
     </transition>
 
-    <el-card shadow="never">
+    <el-card shadow="hover">
       <template #header>
         <el-row :gutter="10">
           <el-col :span="1.5">
@@ -119,7 +121,7 @@
         <el-form-item label="鐘舵��">
           <el-radio-group v-model="form.status">
             <el-radio v-for="dict in sys_normal_disable" :key="dict.value" :label="dict.value">{{
-                dict.label
+              dict.label
             }}</el-radio>
           </el-radio-group>
         </el-form-item>
@@ -196,8 +198,6 @@
 import { roleMenuTreeselect, treeselect as menuTreeselect } from '@/api/system/menu/index';
 import { RoleVO, RoleForm, RoleQuery, DeptTreeOption } from '@/api/system/role/types';
 import { MenuTreeOption, RoleMenuTree } from '@/api/system/menu/types';
-import { ComponentInternalInstance } from 'vue';
-import { ElTree, ElForm, DateModelType } from 'element-plus';
 
 const router = useRouter();
 const { proxy } = getCurrentInstance() as ComponentInternalInstance;
@@ -221,54 +221,54 @@
 
 /** 鏁版嵁鑼冨洿閫夐」*/
 const dataScopeOptions = ref([
-    { value: "1", label: "鍏ㄩ儴鏁版嵁鏉冮檺" },
-    { value: "2", label: "鑷畾鏁版嵁鏉冮檺" },
-    { value: "3", label: "鏈儴闂ㄦ暟鎹潈闄�" },
-    { value: "4", label: "鏈儴闂ㄥ強浠ヤ笅鏁版嵁鏉冮檺" },
-    { value: "5", label: "浠呮湰浜烘暟鎹潈闄�" }
+  { value: "1", label: "鍏ㄩ儴鏁版嵁鏉冮檺" },
+  { value: "2", label: "鑷畾鏁版嵁鏉冮檺" },
+  { value: "3", label: "鏈儴闂ㄦ暟鎹潈闄�" },
+  { value: "4", label: "鏈儴闂ㄥ強浠ヤ笅鏁版嵁鏉冮檺" },
+  { value: "5", label: "浠呮湰浜烘暟鎹潈闄�" }
 ])
 
-const queryFormRef = ref(ElForm);
-const roleFormRef = ref(ElForm);
-const dataScopeRef = ref(ElForm);
-const menuRef = ref(ElTree);
-const deptRef = ref(ElTree);
+const queryFormRef = ref<ElFormInstance>();
+const roleFormRef = ref<ElFormInstance>();
+const dataScopeRef = ref<ElFormInstance>();
+const menuRef = ref<ElTreeInstance>();
+const deptRef = ref<ElTreeInstance>();
 
 const initForm: RoleForm = {
-    roleId: undefined,
-    roleSort: 1,
-    status: '0',
-    roleName: '',
-    roleKey: '',
-    menuCheckStrictly: true,
-    deptCheckStrictly: true,
-    remark: '',
-    dataScope: '1',
-    menuIds: [],
-    deptIds: [],
+  roleId: undefined,
+  roleSort: 1,
+  status: '0',
+  roleName: '',
+  roleKey: '',
+  menuCheckStrictly: true,
+  deptCheckStrictly: true,
+  remark: '',
+  dataScope: '1',
+  menuIds: [],
+  deptIds: [],
 }
 
 const data = reactive<PageData<RoleForm, RoleQuery>>({
-    form: {...initForm},
-    queryParams: {
-        pageNum: 1,
-        pageSize: 10,
-        roleName: '',
-        roleKey: '',
-        status: '',
-    },
-    rules: {
-        roleName: [{ required: true, message: "瑙掕壊鍚嶇О涓嶈兘涓虹┖", trigger: "blur" }],
-        roleKey: [{ required: true, message: "鏉冮檺瀛楃涓嶈兘涓虹┖", trigger: "blur" }],
-        roleSort: [{ required: true, message: "瑙掕壊椤哄簭涓嶈兘涓虹┖", trigger: "blur" }]
-    }
+  form: { ...initForm },
+  queryParams: {
+    pageNum: 1,
+    pageSize: 10,
+    roleName: '',
+    roleKey: '',
+    status: '',
+  },
+  rules: {
+    roleName: [{ required: true, message: "瑙掕壊鍚嶇О涓嶈兘涓虹┖", trigger: "blur" }],
+    roleKey: [{ required: true, message: "鏉冮檺瀛楃涓嶈兘涓虹┖", trigger: "blur" }],
+    roleSort: [{ required: true, message: "瑙掕壊椤哄簭涓嶈兘涓虹┖", trigger: "blur" }]
+  }
 })
 const { form, queryParams, rules } = toRefs(data)
 
 
 const dialog = reactive<DialogOption>({
-    visible: false,
-    title: ''
+  visible: false,
+  title: ''
 });
 
 
@@ -276,233 +276,241 @@
  * 鏌ヨ瑙掕壊鍒楄〃
  */
 const getList = () => {
-    loading.value = true
-    listRole(proxy?.addDateRange(queryParams.value, dateRange.value)).then(res => {
-        roleList.value = res.rows
-        total.value = res.total
-        loading.value = false
-    })
+  loading.value = true
+  listRole(proxy?.addDateRange(queryParams.value, dateRange.value)).then(res => {
+    roleList.value = res.rows
+    total.value = res.total
+    loading.value = false
+  })
 }
 
 /**
  * 鎼滅储鎸夐挳鎿嶄綔
  */
 const handleQuery = () => {
-    queryParams.value.pageNum = 1;
-    getList();
+  queryParams.value.pageNum = 1;
+  getList();
 }
 
 /** 閲嶇疆 */
 const resetQuery = () => {
-    dateRange.value = ['', '']
-    queryFormRef.value.resetFields();
-    handleQuery();
+  dateRange.value = ['', '']
+  queryFormRef.value?.resetFields();
+  handleQuery();
 }
 /**鍒犻櫎鎸夐挳鎿嶄綔 */
 const handleDelete = async (row?: RoleVO) => {
-    const roleids = row?.roleId || ids.value;
-    await proxy?.$modal.confirm('鏄惁纭鍒犻櫎瑙掕壊缂栧彿涓�' + roleids + '鏁版嵁椤圭洰');
-    await delRole(roleids);
-    getList();
-    proxy?.$modal.msgSuccess('鍒犻櫎鎴愬姛');
+  const roleids = row?.roleId || ids.value;
+  await proxy?.$modal.confirm('鏄惁纭鍒犻櫎瑙掕壊缂栧彿涓�' + roleids + '鏁版嵁椤圭洰');
+  await delRole(roleids);
+  getList();
+  proxy?.$modal.msgSuccess('鍒犻櫎鎴愬姛');
 }
 
 /** 瀵煎嚭鎸夐挳鎿嶄綔 */
 const handleExport = () => {
-    proxy?.download("system/role/export", {
-        ...queryParams.value,
-    }, `role_${new Date().getTime()}.xlsx`)
+  proxy?.download("system/role/export", {
+    ...queryParams.value,
+  }, `role_${new Date().getTime()}.xlsx`)
 }
 /** 澶氶�夋閫変腑鏁版嵁 */
 const handleSelectionChange = (selection: RoleVO[]) => {
-    ids.value = selection.map((item: RoleVO) => item.roleId);
-    single.value = selection.length != 1;
-    multiple.value = !selection.length;
+  ids.value = selection.map((item: RoleVO) => item.roleId);
+  single.value = selection.length != 1;
+  multiple.value = !selection.length;
 }
 
 /** 瑙掕壊鐘舵�佷慨鏀� */
 const handleStatusChange = async (row: RoleVO) => {
-    let text = row.status === "0" ? "鍚敤" : "鍋滅敤";
-    try {
-        await proxy?.$modal.confirm('纭瑕�"' + text + '""' + row.roleName + '"瑙掕壊鍚�?');
-        await changeRoleStatus(row.roleId, row.status);
-        proxy?.$modal.msgSuccess(text + "鎴愬姛");
-    } catch {
-        row.status = row.status === "0" ? "1" : "0";
-    }
+  let text = row.status === "0" ? "鍚敤" : "鍋滅敤";
+  try {
+    await proxy?.$modal.confirm('纭瑕�"' + text + '""' + row.roleName + '"瑙掕壊鍚�?');
+    await changeRoleStatus(row.roleId, row.status);
+    proxy?.$modal.msgSuccess(text + "鎴愬姛");
+  } catch {
+    row.status = row.status === "0" ? "1" : "0";
+  }
 }
 
 /** 鍒嗛厤鐢ㄦ埛 */
 const handleAuthUser = (row: RoleVO) => {
-    router.push("/system/role-auth/user/" + row.roleId);
+  router.push("/system/role-auth/user/" + row.roleId);
 }
 
 /** 鏌ヨ鑿滃崟鏍戠粨鏋� */
 const getMenuTreeselect = async () => {
-    const res = await menuTreeselect();
-    menuOptions.value = res.data;
+  const res = await menuTreeselect();
+  menuOptions.value = res.data;
 }
 /** 鎵�鏈夐儴闂ㄨ妭鐐规暟鎹� */
-const getDeptAllCheckedKeys = () => {
-    // 鐩墠琚�変腑鐨勯儴闂ㄨ妭鐐�
-    let checkedKeys = deptRef.value.getCheckedKeys();
-    // 鍗婇�変腑鐨勯儴闂ㄨ妭鐐�
-    let halfCheckedKeys = deptRef.value.getHalfCheckedKeys();
-    checkedKeys.unshift.apply(checkedKeys, halfCheckedKeys);
-    return checkedKeys
+const getDeptAllCheckedKeys = (): any => {
+  // 鐩墠琚�変腑鐨勯儴闂ㄨ妭鐐�
+  let checkedKeys = deptRef.value?.getCheckedKeys();
+  // 鍗婇�変腑鐨勯儴闂ㄨ妭鐐�
+  let halfCheckedKeys = deptRef.value?.getHalfCheckedKeys();
+  if (halfCheckedKeys) {
+    checkedKeys?.unshift.apply(checkedKeys, halfCheckedKeys);
+  }
+  return checkedKeys
 }
 /** 閲嶇疆鏂板鐨勮〃鍗曚互鍙婂叾浠栨暟鎹�  */
 const reset = () => {
-    menuRef.value.setCheckedKeys([]);
-    menuExpand.value = false
-    menuNodeAll.value = false
-    deptExpand.value = true
-    deptNodeAll.value = false
-    form.value = { ...initForm };
-    roleFormRef.value.resetFields();
+  menuRef.value?.setCheckedKeys([]);
+  menuExpand.value = false
+  menuNodeAll.value = false
+  deptExpand.value = true
+  deptNodeAll.value = false
+  form.value = { ...initForm };
+  roleFormRef.value?.resetFields();
 
 }
 
 /** 娣诲姞瑙掕壊 */
 const handleAdd = () => {
-    dialog.visible = true;
-    dialog.title = "娣诲姞瑙掕壊";
-    nextTick(() => {
-        reset();
-        getMenuTreeselect();
-    })
+  dialog.visible = true;
+  dialog.title = "娣诲姞瑙掕壊";
+  nextTick(() => {
+    reset();
+    getMenuTreeselect();
+  })
 }
 /** 淇敼瑙掕壊 */
 const handleUpdate = async (row?: RoleVO) => {
-    const roleId = row?.roleId || ids.value[0]
-    const roleMenu = getRoleMenuTreeselect(roleId)
-    const { data } = await getRole(roleId);
-    dialog.visible = true;
-    dialog.title = "淇敼瑙掕壊";
-    nextTick(() => {
-        reset();
-        Object.assign(form.value, data);
-        form.value.roleSort = Number(form.value.roleSort);
-        nextTick(async () => {
-            const res = await roleMenu;
-            let checkedKeys = res.checkedKeys;
-            checkedKeys.forEach((v) => {
-                nextTick(() => {
-                    menuRef.value.setChecked(v, true, false);
-                })
-            })
+  const roleId = row?.roleId || ids.value[0]
+  const roleMenu = getRoleMenuTreeselect(roleId)
+  const { data } = await getRole(roleId);
+  dialog.visible = true;
+  dialog.title = "淇敼瑙掕壊";
+  await nextTick(() => {
+    reset();
+    Object.assign(form.value, data);
+    form.value.roleSort = Number(form.value.roleSort);
+    nextTick(async () => {
+      const res = await roleMenu;
+      let checkedKeys = res.checkedKeys;
+      checkedKeys.forEach((v) => {
+        nextTick(() => {
+          menuRef.value?.setChecked(v, true, false);
         })
+      })
     })
+  })
 }
 /** 鏍规嵁瑙掕壊ID鏌ヨ鑿滃崟鏍戠粨鏋� */
 const getRoleMenuTreeselect = (roleId: string | number) => {
-    return roleMenuTreeselect(roleId).then((res): RoleMenuTree => {
-        menuOptions.value = res.data.menus;
-        return res.data;
-    })
+  return roleMenuTreeselect(roleId).then((res): RoleMenuTree => {
+    menuOptions.value = res.data.menus;
+    return res.data;
+  })
 }
 /** 鏍规嵁瑙掕壊ID鏌ヨ閮ㄩ棬鏍戠粨鏋� */
 const getRoleDeptTreeSelect = async (roleId: string | number) => {
-    const res = await deptTreeSelect(roleId);
-    deptOptions.value = res.data.depts;
-    return res.data;
+  const res = await deptTreeSelect(roleId);
+  deptOptions.value = res.data.depts;
+  return res.data;
 }
 /** 鏍戞潈闄愶紙灞曞紑/鎶樺彔锛�*/
-const handleCheckedTreeExpand = (value: any, type: string) => {
-    if (type == "menu") {
-        let treeList = menuOptions.value;
-        for (let i = 0; i < treeList.length; i++) {
-            menuRef.value.store.nodesMap[treeList[i].id].expanded = value;
-        }
-    } else if (type == "dept") {
-        let treeList = deptOptions.value;
-        for (let i = 0; i < treeList.length; i++) {
-            deptRef.value.store.nodesMap[treeList[i].id].expanded = value;
-        }
+const handleCheckedTreeExpand = (value: boolean, type: string) => {
+  if (type == "menu") {
+    let treeList = menuOptions.value;
+    for (let i = 0; i < treeList.length; i++) {
+      if (menuRef.value) {
+        menuRef.value.store.nodesMap[treeList[i].id].expanded = value;
+      }
     }
+  } else if (type == "dept") {
+    let treeList = deptOptions.value;
+    for (let i = 0; i < treeList.length; i++) {
+      if (deptRef.value) {
+        deptRef.value.store.nodesMap[treeList[i].id].expanded = value;
+      }
+    }
+  }
 }
 /** 鏍戞潈闄愶紙鍏ㄩ��/鍏ㄤ笉閫夛級 */
 const handleCheckedTreeNodeAll = (value: any, type: string) => {
-    if (type == "menu") {
-        menuRef.value.setCheckedNodes(value ? menuOptions.value : []);
-    } else if (type == "dept") {
-        deptRef.value.setCheckedNodes(value ? deptOptions.value : []);
-    }
+  if (type == "menu") {
+    menuRef.value?.setCheckedNodes(value ? menuOptions.value as any : []);
+  } else if (type == "dept") {
+    deptRef.value?.setCheckedNodes(value ? deptOptions.value as any : []);
+  }
 }
 /** 鏍戞潈闄愶紙鐖跺瓙鑱斿姩锛� */
 const handleCheckedTreeConnect = (value: any, type: string) => {
-    if (type == "menu") {
-        form.value.menuCheckStrictly = value;
-    } else if (type == "dept") {
-        form.value.deptCheckStrictly = value;
-    }
+  if (type == "menu") {
+    form.value.menuCheckStrictly = value;
+  } else if (type == "dept") {
+    form.value.deptCheckStrictly = value;
+  }
 }
 /** 鎵�鏈夎彍鍗曡妭鐐规暟鎹� */
-const getMenuAllCheckedKeys = () => {
-    // 鐩墠琚�変腑鐨勮彍鍗曡妭鐐�
-    let checkedKeys = menuRef.value.getCheckedKeys();
-    // 鍗婇�変腑鐨勮彍鍗曡妭鐐�
-    let halfCheckedKeys = menuRef.value.getHalfCheckedKeys();
-    checkedKeys.unshift.apply(checkedKeys, halfCheckedKeys);
-    return checkedKeys;
+const getMenuAllCheckedKeys = (): any => {
+  // 鐩墠琚�変腑鐨勮彍鍗曡妭鐐�
+  let checkedKeys = menuRef.value?.getCheckedKeys();
+  // 鍗婇�変腑鐨勮彍鍗曡妭鐐�
+  let halfCheckedKeys = menuRef.value?.getHalfCheckedKeys();
+  if (halfCheckedKeys) {
+    checkedKeys?.unshift.apply(checkedKeys, halfCheckedKeys);
+  }
+  return checkedKeys;
 }
 /** 鎻愪氦鎸夐挳 */
 const submitForm = () => {
-    roleFormRef.value.validate(async (valid: boolean) => {
-        if (valid) {
-            form.value.menuIds = getMenuAllCheckedKeys()
-            form.value.roleId ? await updateRole(form.value) : await addRole(form.value);
-            proxy?.$modal.msgSuccess("鎿嶄綔鎴愬姛")
-            dialog.visible = false
-            getList()
-        }
-    })
+  roleFormRef.value?.validate(async (valid: boolean) => {
+    if (valid) {
+      form.value.menuIds = getMenuAllCheckedKeys()
+      form.value.roleId ? await updateRole(form.value) : await addRole(form.value);
+      proxy?.$modal.msgSuccess("鎿嶄綔鎴愬姛")
+      dialog.visible = false
+      getList()
+    }
+  })
 }
 /** 鍙栨秷鎸夐挳 */
 const cancel = () => {
-    reset()
-    dialog.visible = false;
+  reset()
+  dialog.visible = false;
 }
 /** 閫夋嫨瑙掕壊鏉冮檺鑼冨洿瑙﹀彂 */
 const dataScopeSelectChange = (value: string) => {
-    if (value !== "2") {
-        deptRef.value.setCheckedKeys([])
-    }
+  if (value !== "2") {
+    deptRef.value?.setCheckedKeys([])
+  }
 }
 /** 鍒嗛厤鏁版嵁鏉冮檺鎿嶄綔 */
 const handleDataScope = async (row: RoleVO) => {
-    const roleDeptTreeselect = getRoleDeptTreeSelect(row.roleId);
-    const response = await getRole(row.roleId);
-    Object.assign(form.value, response.data);
-    openDataScope.value = true;
-    dialog.title = "鍒嗛厤鏁版嵁鏉冮檺";
-    nextTick(async () => {
-        const res = await roleDeptTreeselect;
-        nextTick(() => {
-            if (deptRef.value) {
-                deptRef.value.setCheckedKeys(res.checkedKeys);
-            }
-        })
+  const roleDeptTreeselect = getRoleDeptTreeSelect(row.roleId);
+  const response = await getRole(row.roleId);
+  Object.assign(form.value, response.data);
+  openDataScope.value = true;
+  dialog.title = "鍒嗛厤鏁版嵁鏉冮檺";
+  await nextTick(async () => {
+    const res = await roleDeptTreeselect;
+    await nextTick(() => {
+      if (deptRef.value) {
+        deptRef.value.setCheckedKeys(res.checkedKeys);
+      }
     })
+  })
 }
 /** 鎻愪氦鎸夐挳锛堟暟鎹潈闄愶級 */
 const submitDataScope = async () => {
-    if (form.value.roleId) {
-        form.value.deptIds = getDeptAllCheckedKeys();
-        await dataScope(form.value);
-        proxy?.$modal.msgSuccess("淇敼鎴愬姛");
-        openDataScope.value = false;
-        getList();
-    }
+  if (form.value.roleId) {
+    form.value.deptIds = getDeptAllCheckedKeys();
+    await dataScope(form.value);
+    proxy?.$modal.msgSuccess("淇敼鎴愬姛");
+    openDataScope.value = false;
+    getList();
+  }
 }
 /** 鍙栨秷鎸夐挳锛堟暟鎹潈闄愶級*/
 const cancelDataScope = () => {
-    dataScopeRef.value.resetFields();
-    form.value = {...initForm};
-    openDataScope.value = false;
+  dataScopeRef.value?.resetFields();
+  form.value = { ...initForm };
+  openDataScope.value = false;
 }
 
 onMounted(() => {
-    getList();
+  getList();
 });
 </script>

--
Gitblit v1.9.3