路由修改

src/api/systerm.ts

@@ -0,0 +1,11 @@
+import createAxios from '@/utils/request'
+
+// 菜单修改
+export function updateMenu(params:anyObj) {
+    return createAxios({
+        url: '/user-boot/function/update',
+        method: 'PUT',
+        data:params
+    })
+}
+

src/components/table/header/index.vue

@@ -148,7 +148,7 @@ const dateChange = () => {
     font-size: 14px;
 }
 
-.table-com-search-form{
+.table-com-search-form {
     display: grid;
     grid-gap: 20px;
     grid-template-columns: repeat(5, 1fr);

src/layouts/admin/components/navBar/classic.vue

@@ -1,14 +1,15 @@
 <template>
-    <div class="nav-bar">
+    <div class='nav-bar'>
-        <div v-if="config.layout.shrink && config.layout.menuCollapse" class="unfold">
+        <div v-if='config.layout.shrink && config.layout.menuCollapse' class='unfold'>
-            <Icon @click="onMenuCollapse" name="fa fa-indent" :color="config.getColorVal('menuActiveColor')" size="18" />
+            <Icon @click='onMenuCollapse' name='fa fa-indent' :color="config.getColorVal('menuActiveColor')"
+                  size='18' />
         </div>
-        <span style='color: #FFF;font-size: 24px;margin-left: 10px;font-weight: 700'>电能质量数据监测云平台</span>
+        <span class='nav-bar-title'>电能质量数据监测云平台</span>
         <NavMenus />
     </div>
 </template>
 
-<script setup lang="ts">
+<script setup lang='ts'>
 import { useConfig } from '@/stores/config'
 import NavTabs from '@/layouts/admin/components/navBar/tabs.vue'
 import NavMenus from '../navMenus.vue'
@@ -24,17 +25,26 @@ const onMenuCollapse = () => {
 }
 </script>
 
-<style scoped lang="scss">
+<style scoped lang='scss'>
 .nav-bar {
     display: flex;
     align-items: center;
     height: 60px;
     width: 100%;
     background-color: v-bind('config.getColorVal("headerBarBackground")');
+
+    .nav-bar-title {
+        color: v-bind('config.getColorVal("headerBarTabColor")');
+        font-size: 24px;
+        margin-left: 10px;
+        font-weight: 700
+    }
+
     :deep(.nav-tabs) {
         display: flex;
         height: 100%;
         position: relative;
+
         .ba-nav-tab {
             display: flex;
             align-items: center;
@@ -47,25 +57,31 @@ const onMenuCollapse = () => {
             color: v-bind('config.getColorVal("headerBarTabColor")');
             transition: all 0.2s;
             -webkit-transition: all 0.2s;
+
             .close-icon {
                 padding: 2px;
                 margin: 2px 0 0 4px;
                 color: v-bind('config.getColorVal("headerBarTabColor")') !important;
             }
+
             &.active {
                 color: v-bind('config.getColorVal("headerBarTabActiveColor")');
+
                 .close-icon {
                     color: v-bind('config.getColorVal("headerBarTabActiveColor")') !important;;
                 }
             }
+
             &:hover {
                 color: v-bind('config.getColorVal("headerBarTabActiveColor")');
                 background-color: v-bind('config.getColorVal("headerBarHoverBackground")');
+
                 .close-icon {
                     color: v-bind('config.getColorVal("headerBarTabActiveColor")') !important;;
                 }
             }
         }
+
         .nav-tabs-active-box {
             position: absolute;
             height: 50px;
@@ -75,6 +91,7 @@ const onMenuCollapse = () => {
         }
     }
 }
+
 .unfold {
     align-self: center;
     padding-left: var(--ba-main-space);

src/layouts/admin/components/navMenus.vue

@@ -5,14 +5,14 @@
                 :color="configStore.getColorVal('headerBarTabColor')"
                 class="nav-menu-icon"
                 v-if="state.isFullScreen"
-                name="local-full-screen-cancel"
+                name="fa-solid fa-minimize"
                 size="18"
             />
             <Icon
                 :color="configStore.getColorVal('headerBarTabColor')"
                 class="nav-menu-icon"
                 v-else
-                name="el-icon-FullScreen"
+                name="fa-solid fa-expand"
                 size="18"
             />
         </div>

src/layouts/admin/index.vue

@@ -274,6 +274,7 @@ const init = async () => {
 
         const handlerMenu = (data: any) => {
             data.forEach((item: any) => {
+
                 item.path = item.routeName || item.title
                 item.name = item.title
                 item.component = '/src/views/dashboard/index.vue'
@@ -285,8 +286,9 @@ const init = async () => {
             })
         }
         handlerMenu(res.data)
-        handleAdminRoute(arr)
+        // handleAdminRoute(arr)
-        // handleAdminRoute([...arr, ...res.data])
+        // handleAdminRoute(res.data)
+        handleAdminRoute([...arr, ...res.data])
 
         // 预跳转到上次路径
         if (route.params.to) {

src/utils/router.ts

@@ -99,7 +99,6 @@ export const handleAdminRoute = (routes: any) => {
     const viewsComponent = import.meta.glob('/src/views/**/*.vue')
     addRouteAll(viewsComponent, routes, adminBaseRoute.name as string)
     const menuAdminBaseRoute = (adminBaseRoute.path as string) + '/'
-
     // 更新stores中的路由菜单数据
     const navTabs = useNavTabs()
     navTabs.setTabsViewRoutes(handleMenuRule(routes, menuAdminBaseRoute))
@@ -154,6 +153,7 @@ const handleMenuRule = (routes: any, pathPrefix = '/', type = ['menu', 'menu_dir
             name: routes[key].name,
             component: routes[key].component,
             meta: {
+                ...routes[key],
                 id: routes[key].id,
                 title: routes[key].title,
                 icon: routes[key].icon,
@@ -261,6 +261,7 @@ export const addRouteItem = (
         name: route.name,
         component: component,
         meta: {
+            ...route,
             title: route.title,
             extend: route.extend,
             icon: route.icon,

src/views/auth/menu/index.vue

@@ -80,12 +80,7 @@ onMounted(() => {
             if (item.children && item.children.length > 0) {
                 item.children = handlerRouter(item.children)
             }
-            return {
+            return item.meta
-                ...item,
-                title: item.meta.title,
-                icon: item.meta.icon,
-                id: index
-            }
         })
     }
     tableStore.table.data = handlerRouter(navTabs.state.tabsViewRoutes)

src/views/auth/menu/popupForm.vue

@@ -1,49 +1,51 @@
 <template>
-    <el-dialog class="ba-operate-dialog" v-model="dialogVisible" :title="title">
+    <el-dialog class='ba-operate-dialog' v-model='dialogVisible' :title='title'>
         <el-scrollbar>
-            <el-form :inline="false" :model="form" label-width="120px">
+            <el-form :inline='false' :model='form' label-width='120px'>
-                <el-form-item label="上级菜单">
+                <el-form-item label='上级菜单'>
                     <el-cascader
-                        v-model="form.pid"
+                        v-model='form.pid'
-                        :options="tableStore.table.data"
+                        :options='tableStore.table.data'
-                        :props="cascaderProps"
+                        :props='cascaderProps'
-                        style="width: 100%"
+                        style='width: 100%'
                     />
                 </el-form-item>
-                <el-form-item label="菜单名称">
+                <el-form-item label='菜单名称'>
-                    <el-input v-model="form.name" placeholder="请输入菜单名称" />
+                    <el-input v-model='form.name' placeholder='请输入菜单名称' />
                 </el-form-item>
-                <el-form-item label="图标">
+                <el-form-item label='图标'>
-                    <IconSelector v-model="form.icon" placeholder="请选择图标" />
+                    <IconSelector v-model='form.icon' placeholder='请选择图标' />
                 </el-form-item>
-                <el-form-item label="菜单路由">
+                <el-form-item label='菜单路由'>
-                    <el-input v-model="form.path" placeholder="请输入菜单名称" />
+                    <el-input v-model='form.path' placeholder='请输入菜单名称' />
                 </el-form-item>
-                <el-form-item label="组件路径">
+                <el-form-item label='组件路径'>
-                    <el-input v-model="form.routeName" placeholder="请输入组件路径，如/src/views/dashboard/index.vue" />
+                    <el-input v-model='form.routeName' placeholder='请输入组件路径，如/src/views/dashboard/index.vue' />
                 </el-form-item>
-                <el-form-item label="排序">
+                <el-form-item label='排序'>
-                    <el-input-number v-model="form.sort" :min="0" />
+                    <el-input-number v-model='form.sort' :min='0' />
                 </el-form-item>
-                <el-form-item label="菜单描述">
+                <el-form-item label='菜单描述'>
-                    <el-input v-model="form.remark" :rows="2" type="textarea" placeholder="请输入描述" />
+                    <el-input v-model='form.remark' :rows='2' type='textarea' placeholder='请输入描述' />
                 </el-form-item>
             </el-form>
         </el-scrollbar>
 
         <template #footer>
-            <span class="dialog-footer">
+            <span class='dialog-footer'>
-                <el-button @click="dialogVisible = false">取消</el-button>
+                <el-button @click='dialogVisible = false'>取消</el-button>
-                <el-button type="primary" @click="submit">确认</el-button>
+                <el-button type='primary' @click='submit'>确认</el-button>
             </span>
         </template>
     </el-dialog>
 </template>
-<script lang="ts" setup>
+<script lang='ts' setup>
 import { ref, inject } from 'vue'
 import { reactive } from 'vue'
 import TableStore from '@/utils/tableStore'
 import IconSelector from '@/components/baInput/components/iconSelector.vue'
+import { updateMenu } from '@/api/systerm'
+
 const tableStore = inject('tableStore') as TableStore
 const cascaderProps = {
     label: 'title',
@@ -51,13 +53,13 @@ const cascaderProps = {
 }
 // do not use same name with ref
 const form = reactive({
-    code: 'menu',
+    code: '',
-    icon: '设备月保_设备日保',
+    icon: '',
-    id: '88c61dfd02fbdab02e3bf0753d487444',
+    id: '',
-    name: '系统配置',
+    name: '',
-    path: '/app/setting',
+    path: '',
-    pid: 'f517484e241c2fdd7f11a9c3fcaaa109',
+    pid: '0',
-    remark: '系统配置',
+    remark: '',
     routeName: null,
     sort: 0,
     type: 0
@@ -67,10 +69,14 @@ const dialogVisible = ref(false)
 const title = ref('新增菜单')
 const open = (text: string, data?: anyObj) => {
     title.value = text
+    Object.assign(form, data)
     dialogVisible.value = true
 }
 const submit = () => {
-    dialogVisible.value = false
+    updateMenu(form).then(res => {
+        tableStore.index()
+        dialogVisible.value = false
+    })
 }
 
 defineExpose({ open })

vite.config.ts

@@ -9,13 +9,8 @@ export default defineConfig({
     server: {
         proxy: {
             '/api': {
-                // target: "http://192.168.1.115:10215", //黄正剑
+                // target: 'http://192.168.1.81:10215', //数据中心
-                // target: "http://192.168.1.22:10215", //超高压
+                target: 'https://pqmcn.com:8092/api', //数据中心
-                target: 'http://192.168.1.81:10215', //数据中心
-                // target: "http://192.168.1.13:10215", //治理
-                // target: 'http://192.168.1.24:10215', // 河北
-                // target: "http://192.168.1.31:10215", // 海南
-                // target: "http://192.168.1.29:10215", // 冀北
                 changeOrigin: true,
                 rewrite: path => path.replace(/^\/api/, '') //路径重写，把'/api'替换为''
             }