From 9ddaf4f5bdfd6be9e191d876f29ed0011256ac14 Mon Sep 17 00:00:00 2001
From: Mrtangl <1807746833@qq.com>
Date: Tue, 19 Apr 2022 11:02:05 +0800
Subject: [PATCH] =?UTF-8?q?=E8=B0=83=E6=95=B4=E8=8F=9C=E5=8D=95=E7=BC=96?=
 =?UTF-8?q?=E8=BE=91=E9=A1=B5=E9=9D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 admin/src/views/permission/menu/edit.vue | 143 ++++++++++++++++-------
 1 file changed, 102 insertions(+), 41 deletions(-)

diff --git a/admin/src/views/permission/menu/edit.vue b/admin/src/views/permission/menu/edit.vue
index e03ac96b..4011ce8f 100644
--- a/admin/src/views/permission/menu/edit.vue
+++ b/admin/src/views/permission/menu/edit.vue
@@ -5,24 +5,6 @@
         </el-card>
 
         <el-card class="m-t-15" shadow="never">
-            <!-- <el-radio-group v-model="radio" class="m-l-60">
-                    <el-radio
-                        :label="menuDataType.CATALOG"
-                        @change="changeType(menuDataType.CATALOG)"
-                    >
-                        目录
-                    </el-radio>
-                    <el-radio :label="menuDataType.MENU" @change="changeType(menuDataType.MENU)">
-                        菜单
-                    </el-radio>
-                    <el-radio
-                        :label="menuDataType.BUTTON"
-                        @change="changeType(menuDataType.BUTTON)"
-                    >
-                        按钮
-                    </el-radio>
-                </el-radio-group> -->
-
             <div class="m-t-15">
                 <el-form
                     ref="formRefs"
@@ -31,8 +13,8 @@
                     size="small"
                     style="max-width: 460px"
                 >
-                    <!-- <el-form-item label="菜单类型">
-                        <el-radio-group v-model="radio">
+                    <el-form-item label="菜单类型">
+                        <el-radio-group v-model="formData.menuType">
                             <el-radio
                                 :label="menuDataType.CATALOG"
                                 @change="changeType(menuDataType.CATALOG)"
@@ -56,51 +38,126 @@
 
                     <el-form-item label="父级菜单">
                         <el-cascader
+                            v-model="formData.pid"
                             style="width: 340px"
                             :options="menuList"
                             :props="{
                                 checkStrictly: true,
                                 emitPath: false,
-                                label: 'title',
+                                label: 'menuName',
                                 value: 'id'
                             }"
                             clearable
                         ></el-cascader>
                     </el-form-item>
 
-                    <div v-if="(radio == menuDataType.BUTTON) == ''">
+                    <div v-if="(formData.menuType == menuDataType.BUTTON) == ''">
                         <el-form-item label="菜单图标">
-                            <el-input show-word-limit placeholder="请输入名称"></el-input>
+                            <el-input
+                                v-model="formData.menuIcon"
+                                show-word-limit
+                                placeholder="请输入图标"
+                            ></el-input>
                         </el-form-item>
                     </div>
 
                     <el-form-item label="菜单名称">
-                        <el-input show-word-limit placeholder="请输入名称"></el-input>
+                        <el-input
+                            v-model="formData.menuName"
+                            show-word-limit
+                            placeholder="请输入名称"
+                        ></el-input>
                     </el-form-item>
 
-                    <div v-if="(radio == menuDataType.BUTTON) == ''">
+                    <div v-if="formData.menuType == menuDataType.BUTTON">
+                        <el-form-item label="菜单权限字符">
+                            <el-input
+                                v-model="formData.perms"
+                                show-word-limit
+                                placeholder="请输入"
+                            ></el-input>
+                        </el-form-item>
+                    </div>
+
+                    <div v-if="(formData.menuType == menuDataType.BUTTON) == ''">
                         <el-form-item label="路由地址">
-                            <el-input show-word-limit placeholder="请输入名称"></el-input>
+                            <el-input
+                                v-model="formData.paths"
+                                show-word-limit
+                                placeholder="请输入"
+                            ></el-input>
                         </el-form-item>
                     </div>
 
-                    <div v-if="radio == menuDataType.MENU">
+                    <div v-if="formData.menuType == menuDataType.MENU">
                         <el-form-item label="组件路径">
-                            <el-input show-word-limit placeholder="请输入名称"></el-input>
+                            <el-input
+                                v-model="formData.component"
+                                show-word-limit
+                                placeholder="请输入"
+                            ></el-input>
                         </el-form-item>
-                        <el-form-item label="极限字符">
-                            <el-input show-word-limit placeholder="请输入名称"></el-input>
+
+                        <el-form-item label="菜单权限字符">
+                            <el-input
+                                v-model="formData.perms"
+                                show-word-limit
+                                placeholder="请输入"
+                            ></el-input>
                         </el-form-item>
+
                         <el-form-item label="路由参数">
-                            <el-input show-word-limit placeholder="请输入名称"></el-input>
+                            <el-input
+                                v-model="formData.params"
+                                show-word-limit
+                                placeholder="请输入"
+                            ></el-input>
+                        </el-form-item>
+
+                        <el-form-item label="选中菜单">
+                            <el-input
+                                v-model="formData.selected"
+                                show-word-limit
+                                placeholder="请输入选中菜单路径"
+                            ></el-input>
                         </el-form-item>
                     </div>
 
-                    <el-form-item label="排序">
-                        <el-input show-word-limit type="number" placeholder="请输入名称"></el-input>
-                    </el-form-item> -->
+                    <el-form-item label="菜单排序">
+                        <el-input
+                            v-model="formData.menuSort"
+                            show-word-limit
+                            type="number"
+                            placeholder="请输入排序"
+                        ></el-input>
+                    </el-form-item>
 
-                    <el-form-item label="父级菜单">
+                    <div v-if="formData.menuType == menuDataType.MENU">
+                        <el-form-item label="是否缓存">
+                            <el-radio-group v-model="formData.isCache">
+                                <el-radio :label="1">缓存</el-radio>
+                                <el-radio :label="0">不缓存</el-radio>
+                            </el-radio-group>
+                        </el-form-item>
+                    </div>
+
+                    <div v-if="(formData.menuType == menuDataType.BUTTON) == ''">
+                        <el-form-item label="显示状态">
+                            <el-radio-group v-model="formData.isShow">
+                                <el-radio :label="1">显示</el-radio>
+                                <el-radio :label="0">隐藏</el-radio>
+                            </el-radio-group>
+                        </el-form-item>
+
+                        <el-form-item label="菜单状态">
+                            <el-radio-group v-model="formData.isDisable">
+                                <el-radio :label="0">正常</el-radio>
+                                <el-radio :label="1">停用</el-radio>
+                            </el-radio-group>
+                        </el-form-item>
+                    </div>
+
+                    <!-- <el-form-item label="父级菜单">
                         <el-cascader
                             v-model="formData.pid"
                             style="width: 340px"
@@ -177,7 +234,7 @@
                             :active-value="0"
                             :inactive-value="1"
                         />
-                    </el-form-item>
+                    </el-form-item> -->
                 </el-form>
             </div>
         </el-card>
@@ -211,14 +268,18 @@ const menuList = ref<any>([])
 // 表单数据
 const formData = ref({
     pid: '', // 上级ID
-    menuType: '', // 菜单类型
+    menuType: 'M', // 菜单类型
     menuName: '', // 菜单名称
     menuIcon: '', // 菜单图标
     menuSort: '', // 菜单排序
     perms: '', // 菜单权限字符
     paths: '', // 路由路径
     component: '', // 前端组件
-    isDisable: '' // 是否禁用: 0=否， 1=是
+    selected: '', // 选中路径
+    params: '', // 路由参数
+    isShow: 1, // 是否显示：0=否， 1=是
+    isCache: 0, // 是否缓存：0=否， 1=是
+    isDisable: 0 // 是否禁用: 0=否， 1=是
 })
 
 // 获取详情
@@ -259,9 +320,9 @@ const onSubmit = () => {
 }
 
 // 切换
-// const changeType = (val: string) => {
-//     menuDataType.value = val
-// }
+const changeType = (val: string) => {
+    menuDataType.value = val
+}
 
 onMounted(() => {
     if (id) getMenuDetail(id)