更新

src/views/permission/permissionList/form.vue

@@ -2,12 +2,12 @@
 import { ref } from "vue";
 const ruleFormRef = ref();
 const formRules = ref({
-  ismenu:[{ required: true, message: "菜单为必填项", trigger: "change"}],
-  pid:[{ required: true, message: "所属父级为必填项", trigger: "change"}],
-  name:[{ required: true, message: "权限规则为必填项", trigger: "blur" }],
-  weigh:[{ required: true, message: "权重为必填项", trigger: "change"}],
-  status:[{ required: true, message: "状态为必填项", trigger: "change"}],
-  title: [{ required: true, message: "权限标题为必填项", trigger: "blur" },{ min: 1, max: 20, message: '长度在 1 到 20 个字符', trigger: 'blur' }]
+  ismenu: [{ required: true, message: "菜单为必填项", trigger: "change" }],
+  pid: [{ required: true, message: "所属父级为必填项", trigger: "change" }],
+  name: [{ required: true, message: "权限规则为必填项", trigger: "blur" }],
+  weigh: [{ required: true, message: "权重为必填项", trigger: "change" }],
+  status: [{ required: true, message: "状态为必填项", trigger: "change" }],
+  title: [{ required: true, message: "权限标题为必填项", trigger: "blur" }, { min: 1, max: 20, message: '长度在 1 到 20 个字符', trigger: 'blur' }]
 });
 const props = defineProps(["formInline", "higherMenuOptions"]);
 const newFormInline = ref(
@@ -15,15 +15,15 @@ const newFormInline = ref(
     ? props.formInline
     : {
       name: "",
-        title: "",
-        icon: "",
-        remark: "",
-        extend: "",
-        ismenu: 1,
-        status: 'normal',
-        weigh:1,
-        pid:''
-      }
+      title: "",
+      icon: "",
+      remark: "",
+      extend: "",
+      ismenu: 1,
+      status: 'normal',
+      weigh: 1,
+      pid: ''
+    }
 );
 
 function getRef() {
@@ -33,33 +33,21 @@ defineExpose({ getRef });
 </script>
 
 <template>
-  <el-form
-    ref="ruleFormRef"
-    :model="newFormInline"
-    :rules="formRules"
-    label-width="120px"
-  >
-  <el-form-item label="菜单" prop="ismenu">
+  <el-form ref="ruleFormRef" :model="newFormInline" :rules="formRules" label-width="120px">
+    <el-form-item label="菜单" prop="ismenu">
       <el-radio-group v-model="newFormInline.ismenu">
         <el-radio label="是" :value="1" />
         <el-radio label="否" :value="0" />
       </el-radio-group>
     </el-form-item>
     <el-form-item label="所属父级" prop="pid">
-      <el-cascader
-        v-model="newFormInline.pid"
-        class="w-full"
-        :options="higherMenuOptions"
+      <el-cascader v-model="newFormInline.pid" class="w-full" :options="higherMenuOptions" :show-all-levels="false"
         :props="{
           value: 'id',
           label: 'title',
-          emitPath: false,
-          checkStrictly: true
-        }"
-        clearable
-        filterable
-        placeholder="请选择上级菜单"
-      >
+          children: 'childlist',
+          emitPath: false, checkStrictly: true
+        }" clearable filterable placeholder="请选择上级菜单">
         <template #default="{ node, data }">
           <span>{{ data.title }}</span>
           <span v-if="!node.isLeaf"> ({{ data.childlist.length }}) </span>
@@ -67,39 +55,19 @@ defineExpose({ getRef });
       </el-cascader>
     </el-form-item>
     <el-form-item label="规则" prop="name">
-      <el-input
-        v-model="newFormInline.name"
-        clearable
-        placeholder="请输入权限规则"
-      />
+      <el-input v-model="newFormInline.name" clearable placeholder="请输入权限规则" />
     </el-form-item>
     <el-form-item label="标题" prop="title">
-      <el-input
-        v-model="newFormInline.title"
-        clearable
-        placeholder="请输入权限标题"
-      />
+      <el-input v-model="newFormInline.title" clearable placeholder="请输入权限标题" />
     </el-form-item>
     <el-form-item label="Url" prop="url">
-      <el-input
-        v-model="newFormInline.url"
-        clearable
-        placeholder="请输入权限url"
-      />
+      <el-input v-model="newFormInline.url" clearable placeholder="请输入权限url" />
     </el-form-item>
     <el-form-item label="图标" prop="icon">
-      <el-input
-        v-model="newFormInline.icon"
-        clearable
-        placeholder="请输入权限图标"
-      />
+      <el-input v-model="newFormInline.icon" clearable placeholder="请输入权限图标" />
     </el-form-item>
     <el-form-item label="扩展属性" prop="extend">
-      <el-input
-        v-model="newFormInline.extend"
-        clearable
-        placeholder="请输入权限扩展属性"
-      />
+      <el-input v-model="newFormInline.extend" clearable placeholder="请输入权限扩展属性" />
     </el-form-item>
     <el-form-item label="权重" prop="weigh">
       <el-input-number v-model="newFormInline.weigh" :min="1" :max="1000" label="请输入权限权重"></el-input-number>

src/views/permission/permissionList/hook.tsx

@@ -68,6 +68,7 @@ export function useData() {
   ]);
   const onSearch = async () => {
     loading.value = true;
+    tableList.value = []
     const { data, code } = await queryList();
     if (code) {
       tableList.value = data.rows.map(ele => {