'菜单'

Your Name

2022-06-28 043265de0da38fcc727bcc60d7c88da4c3c3513f

 src/views/system/menu/index.vue

@@ -2,8 +2,16 @@
   <div class="system-menu-container">
      <el-card shadow="hover">
         <div class="system-menu-search mb15">
            <el-input size="default" placeholder="请输入菜单名称" style="max-width: 180px"> </el-input>
            <el-button size="default" type="primary" class="ml10">
            <el-select size="default" v-model="projectId" placeholder="请选择项目名称" style="max-width: 180px" @change="getMenuList()">
               <el-option
                     v-for="item in projectList"
                     :key="item.key"
                     :value="item.id"
                     :label="item.name"
               >
               </el-option>
            </el-select>
            <el-button size="default" type="primary" class="ml10" @click="getMenuList">
               <el-icon>
                  <ele-Search />
               </el-icon>
@@ -48,7 +56,7 @@
               <template #default="scope">
                  <el-button size="small" text type="primary" @click="onOpenMenuDialog('新增')">新增</el-button>
                  <el-button size="small" text type="primary" @click="onOpenMenuDialog('修改',scope.row)">修改</el-button>
                  <el-button size="small" text type="primary" @click="onTabelRowDel(scope.row)">删除</el-button>
<!--                  <el-button size="small" text type="primary" @click="onTabelRowDel(scope.row)">删除</el-button>-->
               </template>
            </el-table-column>
         </el-table>
@@ -68,25 +76,36 @@
import {Session} from "/@/utils/storage";
import pinia from "/@/stores";
import {dynamicRoutes} from "/@/router/route";
   import {useUserInfo} from "/@/stores/userInfo";

export default defineComponent({
   name: 'systemMenu',
   components: { menuDialog },
   setup() {
      const stores = useRoutesList();
      const { routesList } = storeToRefs(stores);
      const menuDialog = ref();
      const state = reactive({
            projectId:'1',
         menuData:[],
            menuTableData:[],
            projectList:[
               {id:'1',name:'基础数据权限管理系统',key:0},
               {id:'2',name:'双重预防系统',key:1},
               {id:'3',name:'系统2',key:2},
               {id:'4',name:'系统3',key:3},
               {id:'5',name:'系统4',key:4},
               {id:'6',name:'应急管理系统',key:5},
               {id:'7',name:'目标责任管理系统',key:6},
               {id:'8',name:'事故管理系统',key:7},
               {id:'9',name:'设备综合管控系统',key:8},
            ],
      });
      // 获取 vuex 中的路由
      const menuTableData = computed(() => {
         return routesList.value;
      });
         // // 获取 vuex 中的路由
         // const menuTableData = computed(() => {
         //    return routesList.value;
         // });
      // 打开新增菜单弹窗
      const onOpenMenuDialog = (type: string,value: any) => {
         debugger
         menuDialog.value.openDialog(type,value);
            menuDialog.value.openDialog(type,value,state.projectList,state.projectId);
      };
      // 打开编辑菜单弹窗
      // 删除当前行
@@ -100,11 +119,11 @@
         }).catch(() => {});
      };
      const getMenuList = async () => {
         let res = await useMenuApi().getMenuAdmin(Session.get('projectId'))
            let res = await useMenuApi().getMenuAdmin(state.projectId)
         if(res.data.code === '200'){
            // state.menuData = res.data.data
            const storesRoutesList = useRoutesList(pinia);
            storesRoutesList.setRoutesList(res.data.data);
               state.menuTableData = res.data.data
               // const storesRoutesList = useRoutesList(pinia);
               // storesRoutesList.setRoutesList(res.data.data);
         }else{
            ElMessage({
               type:'warning',
@@ -119,7 +138,6 @@
         getMenuList,
         menuDialog,
         onOpenMenuDialog,
         menuTableData,
         onTabelRowDel,
         ...toRefs(state),
      };