菜单

src/views/system/menu.vue

@@ -20,7 +20,7 @@
             <hc-table
                 :check-style="{ fixed: true, width: 29 }" :column="tableColumn" :datas="tableData"
                 :index-style="{ fixed: true, width: 60 }" :is-index="true" ui="no-border"
-                class="menu-page-table" has-children="hasChildren1" is-check lazy border :load="tableLoad"
+                class="menu-page-table" is-check lazy border :load="tableLoad"
                 @selection-change="tableSelectionChange"
             >
                 <template #category="{ row }">
@@ -42,8 +42,8 @@
         </hc-card>
     </div>
     <!-- 菜单新增编辑 -->
-    <hc-dialog v-model="menuDataModal" :title="isCopy ? '复制菜单数据' : formModel.id ? '编辑菜单' : '修改菜单'" widths="60rem" @close="menuDataModalClose" @save="menuDataModalSave">
-        <el-form ref="formRef" :model="formModel" :rules="formRules" label-position="left" label-width="auto" size="large">
+    <hc-dialog v-model="menuDataModal" :title="isCopy ? '复制菜单数据' : formModel.id ? '编辑菜单' : '修改菜单'" widths="46rem" @close="menuDataModalClose" @save="menuDataModalSave">
+        <el-form ref="formRef" :model="formModel" :rules="formRules" label-position="top" label-width="auto" size="large">
             <el-row :gutter="20">
                 <el-col :span="12">
                     <el-form-item label="菜单名称:" prop="name">
@@ -61,7 +61,10 @@
                 </el-col>
                 <el-col :span="12">
                     <el-form-item label="上级菜单:">
-                        <el-cascader v-model="formModel.parentId" :options="tableData" :props="topMenuoptions" clearable />
+                        <el-tree-select
+                            v-model="formModel.parentId" placeholder="选择上级菜单"
+                            :data="levelMenu" :props="levelMenuProps" clearable filterable check-strictly block :render-after-expand="false"
+                        />
                     </el-form-item>
                     <el-form-item label="菜单图标:">
                         <el-input v-model="formModel.source" clearable>
@@ -71,7 +74,7 @@
                         </el-input>
                     </el-form-item>
                     <el-form-item label="菜单排序:">
-                        <el-input-number v-model="formModel.sort" :max="10" :min="1" controls-position="right" />
+                        <el-input-number v-model="formModel.sort" :min="1" block controls-position="right" />
                     </el-form-item>
                     <el-form-item label="菜单类型:">
                         <el-radio-group v-model="formModel.category">
@@ -90,12 +93,12 @@
 <script setup>
 import { onMounted, ref } from 'vue'
 import { HcDelMsg } from 'hc-vue3-ui'
-import config from '~src/config/index'
 import mainApi from '~api/system/menu'
 import { getArrValue } from 'js-fast-way'
 
 onMounted(() => {
     getTableData()
+    getLevelMenuData()
 })
 
 //搜索表单
@@ -143,6 +146,17 @@ const tableSelectionChange = (rows) => {
     tableCheckedKeys.value = rows
 }
 
+//上级
+const levelMenuProps = {
+    label: 'title',
+}
+
+const levelMenu = ref([])
+const getLevelMenuData = async () => {
+    const { data } = await mainApi.getMenuTree()
+    levelMenu.value = getArrValue(data)
+}
+
 //菜单数据弹窗
 const isCopy = ref(false)
 const menuDataModal = ref(false)
@@ -153,12 +167,7 @@ const formRules = {
     path: { required: true, trigger: 'blur', message: '请输入路由地址' },
     code: { required: true, trigger: 'blur', message: '请输入菜单编号' },
 }
-const topMenuoptions = {
-    checkStrictly: true,
-    emitPath: false,
-    value: 'id',
-    label: 'name',
-}
+
 //编辑菜单
 const eidtMenu = (row) => {
     formModel.value = {
@@ -171,7 +180,6 @@ const eidtMenu = (row) => {
 //新增菜单
 const addMenu = () => {
     formModel.value = {
-        sysId: config.sysId,
         isOpen: 1,
         isLayout: 1,
         category: 1,
@@ -199,7 +207,6 @@ const rowDelClick = () => {
 //新增子级菜单
 const addChildren = (row) => {
     formModel.value = {
-        sysId: config.sysId,
         isOpen: 1,
         isLayout: 1,
         category: 1,