首页修改

src/components/home/MainFrame.vue

@@ -10,7 +10,7 @@
         </el-aside>
         <el-container>
           <el-main>
-            <test></test>
+           <router-view></router-view>
           </el-main>
         </el-container>
       </el-container>
@@ -20,73 +20,46 @@
 
 <script>
 import navbar from '@/layout/Navbar'
-import sidebar from '@/layout/Sidebar'
-import userManagement from '@/views/userManagement/index'
-import test from '@/views/permissionManagement/index'
+import sidebar from '@/layout/sidebar/Sidebar'
 export default {
-  components:{navbar,sidebar,userManagement,test},
+  components: { navbar, sidebar },
   data() {
     return {}
-    },
-  }
+  },
+}
 </script>
 
 <style lang="less" scoped>
-
 .mainFrame {
   width: 100%;
   height: 100%;
 }
 
-.el-container {
-  height: 100%;
-}
-.el-header {
-  background-color: #B3C0D1;
-  color: #333;
-  height: 60px;
-}
-
-.el-aside {
-  background-color: #D3DCE6;
-  color: #333;
-  height: 100%;
-}
-
-.el-container {
-  height: 100%;
-}
 .el-container {
   height: 100%;
   overflow: hidden;
 }
-
 .el-header {
   left: 0px;
   top: 0px;
   height: 64px !important;
   line-height: 20px;
-  background-color: #3a8ee6;
+  background-image: url('@/assets/images/background@3x.png');
   text-align: center;
   box-shadow: 0px 1px 6px 0px rgba(0, 0, 0, 0.15);
 }
 
 .el-aside {
   left: 0px;
-  top: 63px;
-
-  width: 200px !important;
-  line-height: 20px;
-  background-color: rgba(32, 55, 73, 1);
+  top: 64px;
   color: rgba(16, 16, 16, 1);
-  font-size: 14px;
-  text-align: center;
   line-height: 20px;
   width: 200px !important;
-  background-color: #3a8ee6;
+  background-color: #104986;
   color: rgba(16, 16, 16, 1);
   font-size: 14px;
   text-align: center;
+  overflow-x: hidden;
 }
 
 .el-main {
@@ -94,5 +67,4 @@ export default {
   color: #333;
   height: 100%;
 }
-
 </style>

src/icons/svg/at-sign.svg

@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="feather feather-at-sign"><circle cx="12" cy="12" r="4"></circle><path d="M16 8v5a3 3 0 0 0 6 0v-1a10 10 0 1 0-3.92 7.94"></path></svg>

src/layout/Navbar.vue

@@ -3,11 +3,10 @@
     <div class="left-menu">
       <hamburger class="hamburger-container" :is-active="opened" @toggleClick="toggleSideBar" />
       <div>
-        <el-image class="img" :src="src" alt=""></el-image>
+        <!-- <el-image class="img" :src="src" alt=""></el-image> -->
       </div>
       <div class="title">
-        <div class="tit">智慧运营管理中心</div>
-        <div class="tit2">Intelligent operation and managenemnt center</div>
+        <p style="margin-top:15px">智慧运营管理中心</p>
       </div>
       <el-select class="select-btn" v-model="value" placeholder="主语国际3号楼">
         <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
@@ -15,9 +14,10 @@
       </el-select>
     </div>
     <div class="right-menu">
-      <el-image class="phone" :src="src" alt=""></el-image>
-      <el-image class="help" :src="src" alt=""></el-image>
-      <el-image class="notification" :src="src" alt="" ></el-image>
+      <el-image class="labtap" :src="require('@/assets/images/diannao@3x.png')"></el-image>
+      <el-image class="phone" :src="require('@/assets/images/shouji-4@3x.png')"></el-image>
+      <el-image class="help" :src="require('@/assets/images/help@3x.png')"></el-image>
+      <el-image class="notification" :src="require('@/assets/images/tongzhi@3x.png')"></el-image>
       <div class="avatar"><el-avatar :size="50" :src="circleUrl"></el-avatar></div>
       <div class="info">
         <i class="el-icon-user"></i>
@@ -34,21 +34,20 @@ export default {
   name: "Navbar",
   data() {
     return {
-      value:'test',
+      value: '主语国际3号楼',
       options: {
 
       },
-      opened:true,
+      opened: false,
       name: "test",
-      src:"https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png",
       circleUrl: "https://cube.elemecdn.com/0/88/03b0d39583f48206768a7534e55bcpng.png",
       isCollapse: true
     }
   },
 
   methods: {
-    toggleSideBar(){
-      
+    toggleSideBar() {
+
     }
   }
 }
@@ -65,11 +64,13 @@ export default {
     position: absolute;
     line-height: 64px;
     left: 0;
-    width:64px;
+    width: 64px;
     float: left;
     cursor: pointer;
     transition: background .3s;
-    -webkit-tap-highlight-color:transparent;
+    background-color: #104986;
+    ;
+    -webkit-tap-highlight-color: transparent;
 
     &:hover {
       background: rgba(0, 0, 0, .025)
@@ -85,63 +86,38 @@ export default {
   .img {
     display: flex;
     position: absolute;
-    left: 70px;
-    top: 3px;
-    width: 58px;
-    height: 57px;
-    bottom: 4px;
+    left: 64px;
+    width: 64px;
+    height: 64px;
   }
 
   .title {
     position: absolute;
-    // margin-top: 4px;
-    // margin-bottom: 4px;
     left: 130px;
-    // top: 4px;
-    width: 302px;
+    width: 320px;
     height: 64px;
     color: rgba(255, 255, 255, 1);
-    // font-size: 18px;
-    text-align: left;
-
-    .tit {
-      left: 130px;
-      margin-top: 4px;
-      width: 302px;
-      height: 29px;
-      color: rgba(255, 255, 255, 1);
-      font-size: 18px;
-      text-align: left;
-    }
-
-    .tit2 {
-      left: 130px;
-      top: 33px;
-      width: 302px;
-      height: 29px;
-      color: rgba(255, 255, 255, 1);
-      font-size: 14px;
-      text-align: left;
-      align-content: center;
-    }
+    text-align: center;
+    letter-spacing: 15px;
+    font-size: 25px;
   }
 
   .select-btn {
     position: absolute;
-    left: 442px;
+    left: 480px;
     top: 15px;
     width: 205px;
     height: 36px;
     line-height: 23px;
-    border-radius: 4px;
     color: rgba(226, 229, 231, 1);
     font-size: 16px;
     text-align: center;
 
     /deep/.el-input__inner {
-      background-color: #045bb8;
+      background-color: #5186be;
       color: rgba(226, 229, 231, 1);
-      border: 1px solid #3a8ee6;
+      border: 1px solid #5186be;
+      border-radius: 20px;
     }
   }
 }
@@ -156,31 +132,40 @@ export default {
     outline: none;
   }
 
+  .labtap {
+    position: absolute;
+    float: right;
+    right: 355px;
+    top: 20px;
+    width: 20px;
+    height: 20px;
+  }
+
   .phone {
     position: absolute;
     float: right;
     right: 320px;
     top: 20px;
-    width: 24px;
-    height: 24px;
+    width: 20px;
+    height: 20px;
   }
 
   .help {
     position: absolute;
     float: right;
-    right: 278px;
+    right: 285px;
     top: 20px;
-    width: 24px;
-    height: 24px;
+    width: 20px;
+    height: 20px;
   }
 
   .notification {
     position: absolute;
     float: right;
-    right: 236px;
+    right: 250px;
     top: 20px;
-    width: 24px;
-    height: 24px;
+    width: 20px;
+    height: 20px;
   }
 
   .avatar {

src/layout/Sidebar.vue

@@ -1,70 +0,0 @@
-<template>
-  <div>
-    <el-menu mode="vertical" @open="handOpen" @close="handClose" background-color="#203749"
-      text-color="rgba(255, 255, 255, 1)" active-text-color="#ffd04b">
-      <el-submenu index="1">
-        <span slot="title">用户管理</span>
-        <el-menu-item index="1-1">人员管理</el-menu-item>
-        <el-menu-item index="1-2">组织管理</el-menu-item>
-      </el-submenu>
-      <el-submenu index="2">
-        <span slot="title">角色管理</span>
-      </el-submenu>
-      <el-submenu index="3">
-        <span slot="title">权限管理</span>
-      </el-submenu>
-      <el-submenu index="4">
-        <span slot="title">系统配置</span>
-        <el-menu-item index="4-1">策略配置</el-menu-item>
-        <el-menu-item index="4-2">消息配置</el-menu-item>
-        <el-menu-item index="4-3">信息配置</el-menu-item>
-        <el-menu-item index="4-4">指标配置</el-menu-item>
-      </el-submenu>
-      <el-submenu index="5">
-        <span slot="title">设备管理</span>
-        <el-menu-item index="5-1">设备配置</el-menu-item>
-        <el-menu-item index="5-2">设备告警</el-menu-item>
-      </el-submenu>
-      <el-submenu index="6">
-        <span slot="title">数据管理</span>
-        <el-menu-item index="6-1">报表配置</el-menu-item>
-        <el-menu-item index="6-2">报告配置</el-menu-item>
-        <el-menu-item index="6-3">基础信息</el-menu-item>
-      </el-submenu>
-      <el-submenu index="7">
-        <span slot="title">服务管理</span>
-        <el-menu-item index="7-1">全部服务</el-menu-item>
-        <el-menu-item index="7-2">已安装服务</el-menu-item>
-        <el-menu-item index="7-3">未安装服务</el-menu-item>
-      </el-submenu>
-      <el-submenu index="8">
-        <span slot="title">安全管理</span>
-        <el-menu-item index="8-1">日志监控</el-menu-item>
-        <el-menu-item index="8-2">系统监控</el-menu-item>
-      </el-submenu>
-    </el-menu>
-  </div>
-</template>
-  
-<script>
-
-export default {
-  name: "sidebar",
-  methods: {
-
-
-  }
-}
-</script>
-  
-<style lang="less" scoped>
-.el-menu {
-  width: 200px;
-  border: 0;
-
-  /deep/.el-submenu__icon-arrow {
-    display: none;
-  }
-}
-</style>
-  

src/layout/sidebar/Sidebar.vue

@@ -1,8 +1,8 @@
 <template>
   <div>
-    <el-menu background-color="#3a8ee6" text-color="rgba(255, 255, 255, 1)" active-text-color="#ffd04b" 
-    :collapse="isCollapse" :collapse-transition="false" router mode="vertical" :unique-opened="true" >
-    <sidebarItem></sidebarItem>
+    <el-menu style="border: 0;" background-color="#104986" text-color="rgba(255, 255, 255, 1)" active-text-color="#ffd04b" :collapse="isCollapse"
+      :collapse-transition="false" router mode="vertical" :unique-opened="true">
+      <sidebarItem></sidebarItem>
     </el-menu>
   </div>
 </template>
@@ -10,13 +10,13 @@
 <script>
 import sidebarItem from './sidebarItem'
 export default {
-  components:{
+  components: {
     sidebarItem
   },
   name: "sidebar",
   data() {
     return {
-      isCollapse:false,
+      isCollapse: false,
     }
   },
 
@@ -24,9 +24,6 @@ export default {
 </script>
   
 <style lang="less" scoped>
-.el-menu {
-  border: 0;
-}
 
 /deep/.el-submenu__icon-arrow {
   display: none;

src/layout/sidebar/sidebarItem.vue

@@ -1,156 +1,74 @@
 <template>
     <div>
-        <div v-for="(menu, index) in menus" :key="index">
-        <el-submenu :index="String(index)" v-if="menu.submenus != null">
-            <template slot="title">
-                <icon :icon-class="menu.icon"></icon>
-                <span>{{ menu.name }}</span>
-            </template>
-            <el-menu-item-group v-for="(submenu, index2) in menu.submenus" :key="index2">
-                <el-menu-item :index="submenu.path">
-                    <span>{{ submenu.name }}</span>
-                </el-menu-item>
-            </el-menu-item-group>
-        </el-submenu>
-        <el-menu-item v-if="menu.submenus == null" :key="menu.path" :index="menu.path">
-            <icon :icon-class="menu.icon"></icon>
-            <span slot="title">
-                {{ menu.name }}
-            </span>
-        </el-menu-item>
+        <div v-for="(menu, index) in $store.state.menus" :key="index">
+            <el-submenu :index="String(index)" v-if="menu.submenus != null">
+                <template slot="title">
+                    <el-image :src="menu.url"></el-image>
+                    <span>{{ menu.name }}</span>
+                </template>
+                <el-menu-item-group v-for="(submenu, index2) in menu.submenus" :key="index2">
+                    <el-menu-item :index="submenu.path">
+                        <span class="subMenu">{{ submenu.name }}</span>
+                    </el-menu-item>
+                </el-menu-item-group>
+            </el-submenu>
+            <el-menu-item v-if="menu.submenus == null" :key="menu.path" :index="menu.path">
+                <el-image :src="menu.url"></el-image>
+                <span slot="title">
+                    {{ menu.name }}
+                </span>
+            </el-menu-item>
+        </div>
     </div>
-</div>
 </template>
 <script>
-import icon from '@/components/SvgIcon/index'
 export default {
-    components: {
-        icon
-    },
     data() {
         return {
-            menus: [
-                {
-                    icon: '',
-                    name: '用户管理',
-                    path: '/',
-                    submenus: [
-                        {
-                            name: '人员管理',
-                            path: '/'
-                        },
-                        {
-                            name: '组织管理',
-                            path: '/'
-                        }
-                    ]
-                },
-                {
-                    icon: '',
-                    name: '角色管理',
-                    path: '/'
-                },
-                {
-                    icon: '',
-                    name: '权限管理',
-                    path: '/'
-                },
-                {
-                    icon: '',
-                    name: '系统配置',
-                    path: '/',
-                    submenus: [
-                        {
-                            name: '策略配置',
-                            path: '/'
-                        },
-                        {
-                            name: '消息配置',
-                            path: '/'
-                        },
-                        {
-                            name: '信息配置',
-                            path: '/'
-                        },
-                        {
-                            name: '指标配置',
-                            path: '/'
-                        }
-                    ]
-                },
-                {
-                    icon: '',
-                    name: '设备管理',
-                    path: '/',
-                    submenus: [
-                        {
-                            name: '设备配置',
-                            path: '/'
-                        },
-                        {
-                            name: '设备告警',
-                            path: '/'
-                        }
-                    ]
-                },
-                {
-                    icon: '',
-                    name: '数据管理',
-                    path: '/',
-                    submenus: [
-                        {
-                            name: '报表配置',
-                            path: '/'
-                        },
-                        {
-                            name: '报告配置',
-                            path: '/'
-                        },
-                        {
-                            name: '基础信息',
-                            path: '/'
-                        }
-                    ]
-                },
-                {
-                    icon: '',
-                    name: '服务管理',
-                    path: '/',
-                    submenus: [
-                        {
-                            name: '全部服务',
-                            path: '/'
-                        },
-                        {
-                            name: '已安装服务',
-                            path: '/'
-                        },
-                        {
-                            name: '未安装服务',
-                            path: '/'
-                        },
-                    ]
-                },
-                {
-                    icon: '',
-                    name: '安全管理',
-                    path: '/',
-                    submenus: [
-                        {
-                            name: '日志监控',
-                            path: '/'
-                        },
-                        {
-                            name: '系统监控',
-                            path: '/'
-                        },
-                    ]
-                }
-            ]
+
         }
     },
     methods: {
 
     }
 }
-</script>
+</script>
+
+<style lang="less" scoped>
+.subMenu {
+    margin-left: 70px;
+}
+
+.el-image {
+    position: absolute;
+    display: flex;
+    overflow: hidden;
+    top: 13px;
+
+    /deep/.el-image__inner {
+        vertical-align: middle;
+    }
+}
+
+.el-menu-item {
+    padding: 0 0 0 15px !important;
+    font-size: 18px;
+}
+
+/deep/.el-submenu__title {
+    padding: 0 0 0 15px !important;
+    font-size: 18px;
+}
+
+/deep/.el-menu-item-group__title {
+    padding: 0;
+}
+
+.el-menu-item-group>.span {
+    margin-left: 70px;
+}
+
+/deep/.el-menu--inline> {
+    border: none;
+    text-align: left;
+}</style>

src/main.js

@@ -9,12 +9,6 @@ Vue.config.productionTip = false
 import ElementUI from 'element-ui';
 import 'element-ui/lib/theme-chalk/index.css';
 import locale from 'element-ui/lib/locale/lang/zh-CN'
-
-import '@/icons'
-
-
-import '@/icons'
-
 Vue.use(ElementUI, { locale });
 
 import '@/icons'
@@ -25,6 +19,28 @@ import './utils/directive'
 Vue.use(ElementUI, { locale });
 Vue.prototype.axios = axios;
 
+router.afterEach((to, from, next) => {
+  let stateName = []; //保存 遍历已保存的name
+  let dict = {} ;
+  const name = to.name;
+  const path = to.path;
+
+  if(name){
+    dict.name = name;
+    dict.path = path;
+
+    let stateRouterMenuMessage = store.state.routerMenuMessage;
+    for(let item of stateRouterMenuMessage){
+      stateName.push(item.name);
+    }
+    let isExist = stateName.indexOf(name);
+    if(isExist){
+      stateRouterMenuMessage.push(dict);
+    }
+  }
+  next();
+})
+
 
 new Vue({
   router,

src/router/index.js

@@ -6,18 +6,156 @@ Vue.use(VueRouter)
 const routes = [
   {
     path: '/',
-    redirect: '/home',
+    redirect: '/login'
   },
   {
     path: '/login',
     name: 'login',
-    component: () => import(/* webpackChunkName: "about" */ '../views/login/index.vue')
+
+    component: () => import('../views/login/index.vue')
   },
   {
     path: '/home',
     name: 'home',
-    component: () => import(/* webpackChunkName: "about" */ '../views/HomeView.vue'),
-  }
+    redirect: '/home/user',
+    component: () => import('../views/HomeView.vue'),
+    children: [
+      {
+        path: 'user',
+        name: 'user',
+        component: () => import('../views/userManagement/index.vue'),
+        children: [
+          {
+            path: 'person',
+            name: 'person',
+            component: () => import('../views/userManagement/personManagement/index.vue'),
+          },
+          {
+            path: 'group',
+            name: 'group',
+            component: () => import('../views/userManagement/groupManagement/index.vue'),
+          },
+        ]
+      },
+      {
+        path: 'role',
+        name: 'role',
+        component: () => import('../views/permissionManagement/index.vue')
+      },
+
+      {
+        path: 'permission',
+        name: 'permission',
+        component: () => import('../views/permissionManagement/index.vue')
+      },
+      {
+        path: 'system',
+        name: 'system',
+        component: () => import('../views/systemManagement/index.vue'),
+        children: [
+          {
+            path: 'strategy',
+            name: 'strategy',
+            component: () => import('../views/systemManagement/strategyConfiguration/index.vue')
+          },
+          {
+            path: 'message',
+            name: 'message',
+            component: () => import('../views/systemManagement/messageConfiguration/commonMessage.vue')
+          },
+          {
+            path: 'info',
+            name: 'info',
+            component: () => import('../views/systemManagement/infoConfiguration/index.vue')
+          },
+          {
+            path: 'index',
+            name: 'index',
+            component: () => import('../views/systemManagement/indexConfiguration/index.vue')
+          },
+        ]
+      },
+      {
+        path: 'device',
+        name: 'device',
+        component: () => import('../views/deviceManagement/index.vue'),
+        children: [
+          {
+            path: 'config',
+            name: 'config',
+            component: () => import('../views/deviceManagement/deviceConfig.vue'),
+          },
+          {
+            path: 'warning',
+            name: 'warning',
+            component: () => import('../views/deviceManagement/deviceWarning.vue'),
+          }
+        ]
+      },
+      {
+        path: 'data',
+        name: 'data',
+        component: () => import('../views/dataManagement/index.vue'),
+        children: [
+          {
+            path: 'statement',
+            name: 'statement',
+            component: () => import('../views/dataManagement/statementConfig.vue'),
+          },
+          {
+            path: 'report',
+            name: 'report',
+            component: () => import('../views/dataManagement/reportConfig.vue'),
+          },
+          {
+            path: 'basicInfo',
+            name: 'basicInfo',
+            component: () => import('../views/dataManagement/basicInfo/index.vue'),
+          }
+        ]
+      },
+      {
+        path: 'service',
+        name: 'service',
+        component: () => import('../views/servicesManagement/index.vue'),
+        children: [
+          {
+            path: 'all',
+            name: 'allServices',
+            component: () => import('../views/servicesManagement/allServices.vue'),
+          },
+          {
+            path: 'installed',
+            name: 'installed',
+            component: () => import('../views/servicesManagement/allServices.vue'),
+          },
+          {
+            path: 'uninstall',
+            name: 'uninstall',
+            component: () => import('../views/servicesManagement/allServices.vue'),
+          }
+        ]
+      },
+      {
+        path: 'security',
+        name: 'security',
+        redirect: '/home/security/logMonitor',
+        component: () => import('../views/securityManagement/index.vue'),
+        children: [
+          {
+            path: 'logMonitor',
+            name: 'logMonitor',
+            component: () => import('../views/securityManagement/logMonitor.vue'),
+          },
+          {
+            path: 'systemMonitor',
+            name: 'systemMonitor',
+            component: () => import('../views/securityManagement/systemMonitor/index.vue'),
+          },
+        ]
+      }
+    ]
+  },
 ]
 
 const router = new VueRouter({

src/store/index.js

@@ -8,8 +8,134 @@ Vue.use(Vuex)
 export default new Vuex.Store({
   modules: {
     getters,
-    modules:{
+    modules: {
       user
     }
+  },
+  state: {
+    routerMenuMessage: [
+      {
+        name:'首页',
+        path:'/home'
+      }
+    ],
+    menus: [
+      {
+        url: require('@/assets/images/userManagement@3x.png'),
+        name: '用户管理',
+        path: '/home/user',
+        submenus: [
+          {
+            name: '人员管理',
+            path: '/home/user/person'
+          },
+          {
+            name: '组织管理',
+            path: '/home/user/group'
+          },
+        ]
+      },
+      {
+        url: require('@/assets/images/roleManagement@3x.png'),
+        name: '角色管理',
+        path: '/home/role'
+      },
+      {
+        url: require('@/assets/images/permissionManagement@3x.png'),
+        name: '权限管理',
+        path: '/home/permission'
+      },
+      {
+        url: require('@/assets/images/systemConfiguration@3x.png'),
+        name: '系统配置',
+        path: '/home/system',
+        submenus: [
+          {
+            name: '策略配置',
+            path: '/home/system/strategy'
+          },
+          {
+            name: '消息配置',
+            path: '/home/system/message'
+          },
+          {
+            name: '信息配置',
+            path: '/home/system/info'
+          },
+          {
+            name: '指标配置',
+            path: '/home/system/index'
+          }
+        ]
+      },
+      {
+        url: require('@/assets/images/deviceManagement@3x.png'),
+        name: '设备管理',
+        path: '/home/device',
+        submenus: [
+          {
+            name: '设备配置',
+            path: '/home/device/config'
+          },
+          {
+            name: '设备告警',
+            path: '/home/device/warning'
+          }
+        ]
+      },
+      {
+        url: require('@/assets/images/dataManagement@3x.png'),
+        name: '数据管理',
+        path: '/home/data',
+        submenus: [
+          {
+            name: '报表配置',
+            path: '/home/data/statement'
+          },
+          {
+            name: '报告配置',
+            path: '/home/data/report'
+          },
+          {
+            name: '基础信息',
+            path: '/home/data/basicInfo'
+          }
+        ]
+      },
+      {
+        url: require('@/assets/images/serviceManagement@3x.png'),
+        name: '服务管理',
+        path: '/home/service',
+        submenus: [
+          {
+            name: '全部服务',
+            path: '/home/service/all'
+          },
+          {
+            name: '已安装服务',
+            path: '/home/service/installed'
+          },
+          {
+            name: '未安装服务',
+            path: '/home/service/uninstall'
+          },
+        ]
+      },
+      {
+        url: require('@/assets/images/securityManagement@3x.png'),
+        name: '安全管理',
+        path: '/home/security',
+        submenus: [
+          {
+            name: '日志监控',
+            path: '/home/security/logMonitor'
+          },
+          {
+            name: '系统监控',
+            path: '/home/security/systemMonitor'
+          },
+        ]
+      }
+    ],
   }
 })

src/views/dataManagement/basicInfo/index.vue

@@ -1,25 +1,50 @@
 <template>
     <div class="container">
         <div class="header">
-            <el-button>公司基本信息</el-button>
-            <el-button>楼宇基本信息</el-button>
-            <el-button>底层系统信息</el-button>
+            <el-button @click="Show1()">公司基本信息</el-button>
+            <el-button @click="Show2()">楼宇基本信息</el-button>
+            <el-button @click="Show3()">底层系统信息</el-button>
         </div>
-        <test></test>
+        <corporation-info v-show="show1"></corporation-info>
+        <building-info v-show="show2"></building-info>
+        <accessedSystem v-show="show3"></accessedSystem>
     </div>
 </template>
 
 <script>
-import test from './accessedSystem'
+import CorporationInfo from './corporationInfo'
+import buildingInfo from './buildingInfo'
+import accessedSystem from './accessedSystem'
 export default {
-    components:{test},
+    components: { CorporationInfo ,buildingInfo,accessedSystem},
     data() {
-        return {}
+        return {
+            show1:true,
+            show2:false,
+            show3:false
+        }
+    },
+    methods:{
+        Show1(){
+            this.show1 = true;
+            this.show2 = false;
+            this.show3 = false;
+        },
+        Show2(){
+            this.show1 = false;
+            this.show2 = true;
+            this.show3 = false;
+        },
+        Show3(){
+            this.show1 = false;
+            this.show2 = false;
+            this.show3 = true;
+        },
     }
 }
 </script>
 <style lang="less" scoped>
-.container{
+.container {
     position: absolute;
     left: 218px;
     right: 16px;
@@ -30,6 +55,7 @@ export default {
     text-align: center;
     box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.15);
 }
+
 .header {
     text-align: left;
     padding: 15px;

src/views/dataManagement/index.vue

@@ -2,22 +2,20 @@
     <div>
         <div class="el-tab">
             <el-tabs v-model="activeName" @tab-click="handleClick">
-                <el-tab-pane label="报表配置" name="tableConfig"></el-tab-pane>
+                <el-tab-pane label="报表配置" name="statementConfig"></el-tab-pane>
                 <el-tab-pane label="报告配置" name="reportConfig"></el-tab-pane>
                 <el-tab-pane label="基础信息" name="basicInfo"></el-tab-pane>
             </el-tabs>
         </div>
-        <test></test>
+       <router-view></router-view>
     </div>
 </template>
 
 <script >
-import test from './reportConfig'
 export default {
-    components: { test },
     data() {
         return {
-            activeName: 'basicInfo',
+            activeName: 'statementConfig',
         }
     },
     methods: {

src/views/deviceManagement/index.vue

@@ -6,14 +6,12 @@
                 <el-tab-pane label="设备告警" name="deviceWarning"></el-tab-pane>
             </el-tabs>
         </div>
-        <test></test>
+        <router-view></router-view>
     </div>
 </template>
 
 <script >
-import test from './deviceConfig'
 export default {
-    components: { test },
     data() {
         return {
             activeName: 'deviceConfig',

src/views/groupManagement/forms/corporationdetailEdit.vue

@@ -1,113 +0,0 @@
-<template>
-    <div>
-        <p class="info">企业详情</p>
-        <img class="img" src="" alt="">
-        <div class="form">
-            <el-form :model="form" label-position="left" label-width="130px">
-                <el-form-item :model="form.fullName" label="公司全称：">
-                    <el-input placeholder="test" type="text"></el-input>
-                </el-form-item>
-                <el-form-item :model="form.abbreviateName" label="公司简称：">
-                    <el-input placeholder="test" type="text"></el-input>
-                </el-form-item>
-                <el-form-item :model="form.parentCorporation" label="上级公司：">
-                    <el-select style="width:400px">
-                        <el-option label=""></el-option>
-                    </el-select>
-                </el-form-item>
-                <el-form-item :model="form.sccide" label="统一社会信用代码：">
-                    <el-select style="width:400px">
-                        <el-option label=""></el-option>
-                    </el-select>
-                </el-form-item>
-                <el-form-item :model="form.registeredAddress" label="注册地址：">
-                    <el-select style="width:160px">
-                        <el-option label=""></el-option>
-                    </el-select><span><el-input style="margin-left: 10px; width: 230px;"
-                            placeholder="test"></el-input></span>
-                </el-form-item>
-                <el-form-item :model="form.businessAddress" label="经营地址：">
-                    <el-select style="width:160px">
-                        <el-option label=""></el-option>
-                    </el-select><span><el-input style="margin-left: 10px; width: 230px;"
-                            placeholder="test"></el-input></span>
-                </el-form-item>
-                <el-form-item :model="form.legalName" label="法人姓名：">
-                    <el-input placeholder="test" type="text"></el-input>
-                </el-form-item>
-                <el-form-item :model="form.copporationCode" label="公司编码：">
-                    <el-input placeholder="test" type="text"></el-input>
-                </el-form-item>
-                <el-form-item :model="form.complementCount" label="编制人数：">
-                    <el-input placeholder="test" type="text"></el-input>
-                </el-form-item>
-                <el-form-item :model="form.staffCount" label="在岗人数：">
-                    <el-input placeholder="test" type="text"></el-input>
-                </el-form-item>
-            </el-form>
-        </div>
-        <div>
-            <el-button>删除</el-button>
-            <el-button style="background-color: rgb(131, 208, 243);">编辑</el-button>
-        </div>
-    </div>
-</template>
-
-<script>
-export default {
-    data() {
-        return {
-            form: {
-
-            }
-        }
-    },
-    methods: {
-
-    }
-
-}
-</script>
-<style lang="less" scoped>
-.info {
-    text-align: left;
-    padding: 20px;
-    font-size: 25px;
-}
-
-.img {
-    width: 1300px;
-    height: 150px;
-}
-
-.form {
-    margin-left: 350px;
-
-    .el-form {
-        //margin: 40px 0 0 0;
-
-        .el-form-item {
-            padding-top: 10px;
-            margin-inline: 20px;
-            margin-bottom: 0;
-        }
-
-        /deep/.el-form-item__label {
-            padding: 0;
-            text-align: left;
-        }
-
-        /deep/.el-form-item__content {
-            display: flex;
-            width: 400px;
-        }
-    }
-}
-
-.el-button {
-    width: 100px;
-    height: 30px;
-    padding: 5px;
-    margin: 10px;
-}
-</style>

src/views/groupManagement/forms/corporationdetailStore.vue

@@ -1,113 +0,0 @@
-<template>
-    <div>
-        <p class="info">企业详情</p>
-        <img class="img" src="" alt="">
-        <div class="form">
-            <el-form :model="form" label-position="left" label-width="130px">
-                <el-form-item :model="form.fullName" label="公司全称：">
-                    <el-input placeholder="test" type="text"></el-input>
-                </el-form-item>
-                <el-form-item :model="form.abbreviateName" label="公司简称：">
-                    <el-input placeholder="test" type="text"></el-input>
-                </el-form-item>
-                <el-form-item :model="form.parentCorporation" label="上级公司：">
-                    <el-select style="width:400px">
-                        <el-option label=""></el-option>
-                    </el-select>
-                </el-form-item>
-                <el-form-item :model="form.sccide" label="统一社会信用代码：">
-                    <el-select style="width:400px">
-                        <el-option label=""></el-option>
-                    </el-select>
-                </el-form-item>
-                <el-form-item :model="form.registeredAddress" label="注册地址：">
-                    <el-select style="width:160px">
-                        <el-option label=""></el-option>
-                    </el-select><span><el-input style="margin-left: 10px; width: 230px;"
-                            placeholder="test"></el-input></span>
-                </el-form-item>
-                <el-form-item :model="form.businessAddress" label="经营地址：">
-                    <el-select style="width:160px">
-                        <el-option label=""></el-option>
-                    </el-select><span><el-input style="margin-left: 10px; width: 230px;"
-                            placeholder="test"></el-input></span>
-                </el-form-item>
-                <el-form-item :model="form.legalName" label="法人姓名：">
-                    <el-input placeholder="test" type="text"></el-input>
-                </el-form-item>
-                <el-form-item :model="form.copporationCode" label="公司编码：">
-                    <el-input placeholder="test" type="text"></el-input>
-                </el-form-item>
-                <el-form-item :model="form.complementCount" label="编制人数：">
-                    <el-input placeholder="test" type="text"></el-input>
-                </el-form-item>
-                <el-form-item :model="form.staffCount" label="在岗人数：">
-                    <el-input placeholder="test" type="text"></el-input>
-                </el-form-item>
-            </el-form>
-        </div>
-        <div>
-            <el-button>重置</el-button>
-            <el-button style="background-color: rgb(131, 208, 243);">保存</el-button>
-        </div>
-    </div>
-</template>
-
-<script>
-export default {
-    data() {
-        return {
-            form: {
-
-            }
-        }
-    },
-    methods: {
-
-    }
-
-}
-</script>
-<style lang="less" scoped>
-.info {
-    text-align: left;
-    padding: 20px;
-    font-size: 25px;
-}
-
-.img {
-    width: 1300px;
-    height: 150px;
-}
-
-.form {
-    margin-left: 350px;
-
-    .el-form {
-        //margin: 40px 0 0 0;
-
-        .el-form-item {
-            padding-top: 10px;
-            margin-inline: 20px;
-            margin-bottom: 0;
-        }
-
-        /deep/.el-form-item__label {
-            padding: 0;
-            text-align: left;
-        }
-
-        /deep/.el-form-item__content {
-            display: flex;
-            width: 400px;
-        }
-    }
-}
-
-.el-button {
-    width: 100px;
-    height: 30px;
-    padding: 5px;
-    margin: 10px;
-}
-</style>

src/views/groupManagement/forms/departmentdetailEdit.vue

@@ -1,122 +0,0 @@
-<template>
-    <div>
-        <p class="info">部门详情</p>
-        <img class="img" src="" alt=""><el-button class="alter">更换</el-button>
-        <div class="form">
-            <el-form :model="form" label-position="left" label-width="130px">
-                <el-form-item :model="form.fullName" label="部门级别：">
-                    <el-select style="width:400px">
-                        <el-option label=""></el-option>
-                    </el-select>
-                </el-form-item>
-                <el-form-item :model="form.abbreviateName" label="上级部门：">
-                    <el-select style="width:400px">
-                        <el-option label=""></el-option>
-                    </el-select>
-                </el-form-item>
-                <el-form-item :model="form.parentCorporation" label="部门负责人：">
-                    <el-select style="width:400px">
-                        <el-option label=""></el-option>
-                    </el-select>
-                </el-form-item>
-                <el-form-item :model="form.sccide" label="部门接口人：">
-                    <el-select style="width:400px">
-                        <el-option label=""></el-option>
-                    </el-select>
-                </el-form-item>
-                <el-form-item :model="form.registeredAddress" label="排重名：">
-                    <el-input placeholder="test" type="text"></el-input>
-                </el-form-item>
-                <el-form-item :model="form.businessAddress" label="在岗人数：">
-                    <el-input-number v-model="num" @change="handleChange" :min="1" :max="100"></el-input-number>
-                </el-form-item>
-                <el-form-item :model="form.legalName" label="自由员工：">
-                    <el-input placeholder="test" type="text"></el-input>
-                </el-form-item>
-                <el-form-item :model="form.copporationCode" label="协作员工：">
-                    <el-input placeholder="test" type="text"></el-input>
-                </el-form-item>
-                <el-form-item :model="form.complementCount" label="第三方员工：">
-                    <el-input placeholder="test" type="text"></el-input>
-                </el-form-item>
-                <el-form-item :model="form.staffCount" label="部门职责：">
-                    <el-input type="textarea" placeholder="请输入" v-model="textarea" maxlength="200"
-                        show-word-limit></el-input>
-                </el-form-item>
-            </el-form>
-        </div>
-        <div>
-            <el-button>删除</el-button>
-            <el-button style="background-color: rgb(131, 208, 243);">编辑</el-button>
-        </div>
-    </div>
-</template>
-
-<script>
-export default {
-    data() {
-        return {
-            form: {
-
-            },
-            num: 100,
-            textarea:''
-        }
-    },
-    methods: {
-        handleChange() {
-            //
-        }
-    }
-
-}
-</script>
-<style lang="less" scoped>
-.info {
-    text-align: left;
-    padding: 20px;
-    font-size: 25px;
-}
-
-.img {
-    width: 1300px;
-    height: 150px;
-}
-
-.alter{
-    position: absolute;
-    right:30px;
-    top: 155px;
-    background-color:rgb(131, 208, 243);
-}
-.form {
-    margin-left: 350px;
-
-    .el-form {
-        //margin: 40px 0 0 0;
-
-        .el-form-item {
-            padding-top: 10px;
-            margin-inline: 20px;
-            margin-bottom: 0;
-        }
-
-        /deep/.el-form-item__label {
-            padding: 0;
-            text-align: left;
-        }
-
-        /deep/.el-form-item__content {
-            display: flex;
-            width: 400px;
-        }
-    }
-}
-
-.el-button {
-    width: 100px;
-    height: 30px;
-    padding: 5px;
-    margin: 10px;
-}
-</style>

src/views/groupManagement/index.vue

@@ -1,99 +0,0 @@
-<template>
-    <div class="container">
-        <div class="left-pane">
-            <el-input placeholder="请输入关键字" suffix-icon="el-icon-search" v-model="filterText"></el-input>
-            <el-tree ref="tree" :data="data" :props="defaultProps" node-key="id" default-expand-all
-                :filter-node-method="filterNode" @node-click="handleNodeClick">
-            </el-tree>
-            <el-button><i class="el-icon-s-order"></i>添加公司</el-button>
-        </div>
-        <div class="right-pane">
-            <test></test>
-        </div>
-    </div>
-</template>
-
-<script>
-import test from './forms/departmentdetailEdit.vue'
-export default {
-    components: { test },
-    data() {
-        return {
-            filterText: '',
-            data: [{
-                label: '中讯邮电咨询设计院',
-                children: [{
-                    label: '北京电信规划设计院',
-                    children: [{
-                        label: '天津办事处'
-                    }]
-                }]
-            }],
-            defaultProps: {
-                children: 'children',
-                label: 'label'
-            }
-        }
-    },
-    watch: {
-        filterText(val) {
-            this.$refs.tree.filter(val);
-        }
-    },
-    methods: {
-        handleNodeClick() {
-            //
-        },
-        filterNode(value, data) {
-            if (!value) return true;
-            return data.label.indexOf(value) !== -1;
-        }
-    }
-}
-</script>
-
-<style lang="less" scoped>
-.container {
-    position: fixed;
-    left: 218px;
-    top: 140px;
-    right: 16px;
-    height: -webkit-fill-available;
-    margin-bottom: 20px;
-    line-height: 20px;
-    background-color: rgba(255, 255, 255, 1);
-    color: rgba(16, 16, 16, 1);
-    font-size: 14px;
-    text-align: center;
-    box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.15);
-
-    .left-pane {
-        width: 300px;
-        padding: 15px;
-
-        .el-tree {
-            height: 700px;
-            margin-top: 15px;
-            background-color: rgb(247, 245, 243);
-        }
-
-        .el-button {
-            position: absolute;
-            left: 35px;
-            bottom: 40px;
-            width: 250px;
-            background-color: rgb(131, 208, 243);
-            text-align: center;
-            font-size: 16px;
-        }
-    }
-
-    .right-pane {
-        width: 1340px;
-        position: absolute;
-        margin-left: 330px;
-        top: 0;
-        margin-right: 20px;
-    }
-}
-</style>

src/views/groupManagement/messageDialog/corporationAdd.vue

@@ -1,138 +0,0 @@
-<template>
-    <div class="info">
-        <el-tabs>
-            <el-tab-pane style="height: 40px; padding: 10px; text-align: left; margin-left:10px; font-size: 16px;">添加公司
-                <span><i class="el-icon-close" @click="close"></i></span>
-            </el-tab-pane>
-        </el-tabs>
-        <div style="display: flex;">
-            <img class="img" src="" alt=""><span><el-button style="width: 60px; margin-left: -160px;
-            margin-top: 60px; background-color:rgb(131, 208, 243);">更换</el-button></span>
-        </div>
-        <div class="form">
-            <el-form :model="form" label-position="left" label-width="130px">
-                <el-form-item :model="form.fullName" label="公司全称：">
-                    <el-input placeholder="test" type="text"></el-input>
-                </el-form-item>
-                <el-form-item :model="form.abbreviateName" label="公司简称：">
-                    <el-input placeholder="test" type="text"></el-input>
-                </el-form-item>
-                <el-form-item :model="form.parentCorporation" label="上级公司：">
-                    <el-select style="width:400px">
-                        <el-option label=""></el-option>
-                    </el-select>
-                </el-form-item>
-                <el-form-item :model="form.sccide" label="统一社会信用代码：">
-                    <el-select style="width:400px">
-                        <el-option label=""></el-option>
-                    </el-select>
-                </el-form-item>
-                <el-form-item :model="form.registeredAddress" label="注册地址：">
-                    <el-select style="width:160px">
-                        <el-option label=""></el-option>
-                    </el-select><span><el-input style="margin-left: 10px; width: 230px;"
-                            placeholder="test"></el-input></span>
-                </el-form-item>
-                <el-form-item :model="form.businessAddress" label="经营地址：">
-                    <el-select style="width:160px">
-                        <el-option label=""></el-option>
-                    </el-select><span><el-input style="margin-left: 10px; width: 230px;"
-                            placeholder="test"></el-input></span>
-                </el-form-item>
-                <el-form-item :model="form.legalName" label="法人姓名：">
-                    <el-input placeholder="test" type="text"></el-input>
-                </el-form-item>
-                <el-form-item :model="form.copporationCode" label="公司编码：">
-                    <el-input placeholder="test" type="text"></el-input>
-                </el-form-item>
-                <el-form-item :model="form.complementCount" label="编制人数：">
-                    <el-input placeholder="test" type="text"></el-input>
-                </el-form-item>
-                <el-form-item :model="form.staffCount" label="在岗人数：">
-                    <el-input placeholder="test" type="text"></el-input>
-                </el-form-item>
-            </el-form>
-        </div>
-        <div style="margin-top: 30px;">
-            <el-button style="background-color:rgb(131, 208, 243);">下一个</el-button>
-            <el-button>重置</el-button>
-            <el-button style="background-color:rgb(131, 208, 243);">更新</el-button>
-        </div>
-    </div>
-</template>
-
-<script>
-export default {
-    data() {
-        return {
-            form: {
-
-            },
-        }
-    },
-    methods: {
-        close() {
-
-        }
-    }
-
-}
-</script>
-<style lang="less" scoped>
-.info {
-    margin-top: 10px;
-    margin-left: 300px;
-    left: 350px;
-    width: 600px;
-    height: 750px;
-    box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.15);
-
-    .img {
-        margin: 15px 50px 0 50px;
-        width: 500px;
-        height: 80px;
-    }
-
-
-    .el-icon-close {
-        margin-left: 480px;
-    }
-
-    /deep/.el-tabs__header {
-        height: 0;
-        margin-bottom: 0;
-    }
-
-
-    .form {
-        //margin-left: 350px;
-
-        .el-form {
-            //margin: 40px 0 0 0;
-
-            .el-form-item {
-                padding-top: 10px;
-                margin-inline: 20px;
-                margin-bottom: 0;
-            }
-
-            /deep/.el-form-item__label {
-                padding: 0;
-                text-align: left;
-            }
-
-            /deep/.el-form-item__content {
-                display: flex;
-                width: 400px;
-            }
-        }
-    }
-
-    .el-button {
-        width: 100px;
-        height: 30px;
-        padding: 5px;
-        margin: 10px;
-    }
-}
-</style>

src/views/groupManagement/messageDialog/departmentNew.vue

@@ -1,130 +0,0 @@
-<template>
-    <div class="info">
-        <el-tabs>
-            <el-tab-pane style="height: 40px; padding: 10px; text-align: left; margin-left:10px; font-size: 16px;">新建部门
-                <span><i class="el-icon-close" @click="close"></i></span>
-            </el-tab-pane>
-        </el-tabs>
-        <div style="display: flex;">
-            <img class="img" src="" alt=""><span><el-button style="width: 60px; margin-left: -160px;
-            margin-top: 60px; background-color:rgb(131, 208, 243);">更换</el-button></span>
-        </div>
-        <div class="form">
-            <el-form :model="form" label-position="left" label-width="130px">
-                <el-form-item :model="form.fullName" label="部门级别：">
-                    <el-select style="width:400px">
-                        <el-option label=""></el-option>
-                    </el-select>
-                </el-form-item>
-                <el-form-item :model="form.abbreviateName" label="上级部门：">
-                    <el-select style="width:400px">
-                        <el-option label=""></el-option>
-                    </el-select>
-                </el-form-item>
-                <el-form-item :model="form.registeredAddress" label="部门名称：">
-                    <el-input placeholder="test" type="text"></el-input>
-                </el-form-item>
-                <el-form-item :model="form.registeredAddress" label="排重名：">
-                    <el-input placeholder="test" type="text"></el-input>
-                </el-form-item>
-                <el-form-item :model="form.parentCorporation" label="部门负责人：">
-                    <el-select style="width:400px">
-                        <el-option label=""></el-option>
-                    </el-select>
-                </el-form-item>
-                <el-form-item :model="form.sccide" label="部门接口人：">
-                    <el-select style="width:400px">
-                        <el-option label=""></el-option>
-                    </el-select>
-                </el-form-item>
-                <el-form-item :model="form.businessAddress" label="在岗人数：">
-                    <el-input-number v-model="num" @change="handleChange" :min="1" :max="100"></el-input-number>
-                </el-form-item>
-                <el-form-item :model="form.staffCount" label="部门职责：">
-                    <el-input type="textarea" placeholder="请输入" v-model="textarea" maxlength="200"
-                        show-word-limit></el-input>
-                </el-form-item>
-            </el-form>
-        </div>
-        <div style="margin-top: 30px;">
-            <el-button style="background-color:rgb(131, 208, 243);">下一个</el-button>
-            <el-button>重置</el-button>
-            <el-button style="background-color:rgb(131, 208, 243);">更新</el-button>
-        </div>
-    </div>
-</template>
-
-<script>
-export default {
-    data() {
-        return {
-            form: {
-
-            },
-            num: 100,
-            textarea:''
-        }
-    },
-    methods: {
-        close() {
-
-        }
-    }
-
-}
-</script>
-<style lang="less" scoped>
-.info {
-    margin-top: 10px;
-    margin-left: 300px;
-    left: 350px;
-    width: 600px;
-    height: 750px;
-    box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.15);
-
-    .img {
-        margin: 15px 50px 0 50px;
-        width: 500px;
-        height: 80px;
-    }
-
-
-    .el-icon-close {
-        margin-left: 480px;
-    }
-
-    /deep/.el-tabs__header {
-        height: 0;
-        margin-bottom: 0;
-    }
-
-
-    .form {
-        .el-form {
-
-            .el-form-item {
-                padding-top: 10px;
-                margin-inline: 20px;
-                margin-bottom: 0;
-            }
-
-            /deep/.el-form-item__label {
-                padding: 0;
-                text-align: left;
-            }
-
-            /deep/.el-form-item__content {
-                display: flex;
-                width: 400px;
-            }
-        }
-    }
-
-    .el-button {
-        width: 100px;
-        height: 30px;
-        padding: 5px;
-        margin: 10px;
-    }
-}
-</style>

src/views/groupManagement/messageDialog/update.vue

@@ -1,22 +0,0 @@
-<template>
-    <el-dialog :visible.sync="centerDialogVisible" width="30%" center style="display: flex;">
-        <div>/////</div>
-        <span slot="footer" class="dialog-footer">
-            <el-button @click="centerDialogVisible = false">取 消</el-button>
-            <el-button type="primary" @click="centerDialogVisible = false">确 认</el-button>
-        </span>
-    </el-dialog>
-</template>
-
-<script>
-export default {
-    data() {
-        return {
-            centerDialogVisible: false
-        };
-    }
-};
-</script>
-
-<script lang="less" scoped>
-</script>

src/views/groupManagement/tables/corporationOverview.vue

@@ -1,147 +0,0 @@
-<template>
-    <div>
-        <p class="info">公司总览</p>
-        <el-table ref="multipleTable" border :data="tableData" tooltip-effect="dark"
-            :header-cell-style="{ textAlign: 'center' }" :cell-style="{ textAlign: 'center' }" style="width: 100%"
-            @selection-change="handleSelectionChange">
-            <el-table-column type="selection" width="50">
-            </el-table-column>
-            <el-table-column prop="corporation_name" label="公司名称">
-            </el-table-column>
-            <el-table-column prop="Sccode" label="社会信用代码">
-            </el-table-column>
-            <el-table-column prop="legal_person" label="公司法人">
-            </el-table-column>
-            <el-table-column prop="contact_person" label="联系人">
-            </el-table-column>
-            <el-table-column prop="contact_phone" label="联系电话">
-            </el-table-column>
-            <el-table-column prop="operation" label="操作">
-                <el-button size="mini" type="text">查看</el-button>
-                <el-button size="mini" type="text">编辑</el-button>
-                <el-button size="mini" type="text">删除</el-button>
-            </el-table-column>
-        </el-table>
-        <div class="bottom">
-            <div>
-                <checkbox class="checkbox"></checkbox>
-                <el-button class="check-cancel" size="mini" type="text" @click="cancleChecked">取消</el-button>
-            </div>
-            <div class="bottom_button" v-show="show">
-                <el-button class="delete" type="text">批量删除</el-button>
-            </div>
-            <page class="page"></page>
-        </div>
-    </div>
-</template>
-
-<script>
-import checkbox from '@/components/Checkbox/index'
-import page from '@/components/pagination/index'
-export default {
-    components: { checkbox, page },
-    data() {
-        return {
-            tableData: [{
-                corporation_name: '中讯邮电咨询设计院有限公司',
-                Sccode: '4032',
-                legal_person: '张三',
-                contact_person: '张三',
-                contact_phone: '12345678901',
-            }, {
-                corporation_name: '北京电信规划院有限公司',
-                Sccode: '9416',
-                legal_person: '李四',
-                contact_person: '李四',
-                contact_phone: '12345678901',
-            }, {
-                corporation_name: '北京电信规划院有限公司',
-                Sccode: '9416',
-                legal_person: '李四',
-                contact_person: '李四',
-                contact_phone: '12345678901',
-            }],
-            multipleSelection: [],
-            show: true
-        }
-    },
-    methods: {
-        cancleChecked() {
-            //
-        },
-        handleClick() {
-            //
-        }
-    }
-}
-</script>
-<style lang="less" scoped>
-.info {
-    text-align: left;
-    padding: 0px;
-    font-size: 25px;
-}
-
-.bottom {
-    position: relative;
-    left: 20px;
-    top: 420px;
-    height: 50px;
-    line-height: 20px;
-    background-color: rgba(255, 255, 255, 1);
-    text-align: center;
-
-    .checkbox {
-        position: absolute;
-        left: 29px;
-        top: 15px;
-        font-size: 14px;
-    }
-
-    .check-cancel {
-        position: absolute;
-        // line-height: 20px;
-        font-size: 14px;
-        text-align: center;
-        left: 140px;
-        top: 10px;
-    }
-
-    .bottom_button {
-        position: absolute;
-        left: 200px;
-        top: 7px;
-
-        .delete {
-            width: 95px;
-            height: 30px;
-            font-size: 14px;
-            text-align: center;
-            padding: 1px;
-        }
-
-        .disabled {
-            width: 95px;
-            height: 30px;
-            font-size: 14px;
-            text-align: center;
-            padding: 1px;
-        }
-
-        .el-dropdown {
-            margin-left: 15px;
-
-            /deep/.el-button--primary {
-                height: 30px;
-                //background-color: rgba(255, 255, 255, 1);
-            }
-        }
-    }
-
-    .page {
-        position: absolute;
-        top: -10px;
-        right: 30px;
-    }
-}
-</style>

src/views/login/index.vue

@@ -122,24 +122,34 @@ export default {
     //     }
     // },
     methods: {
+        // handleLogin() {
+        //     if (this.loginForm.vertification.toLowerCase() != this.identifyCode.toLowerCase()) {
+        //         this.$message.error('请输入正确的验证码!');
+        //         this.refreshCode();
+        //     } else {
+        //         this.$refs.loginForm.validate(valid => {
+        //             if (valid) {
+        //                 this.loading = true;
+        //                 this.$store.dispatch('user/login', this.loginForm).then(() => {
+        //                     this.$router.push({ path: '/home' });
+        //                     this.loading = false;
+        //                 }).catch(() => {
+        //                     this.loading = false;
+        //                 })
+        //             } else {
+        //                 return false;
+        //             }
+        //         })
+        //     }
+        // },
         handleLogin() {
             if (this.loginForm.vertification.toLowerCase() != this.identifyCode.toLowerCase()) {
                 this.$message.error('请输入正确的验证码!');
                 this.refreshCode();
             } else {
-                this.$refs.loginForm.validate(valid => {
-                    if (valid) {
-                        this.loading = true;
-                        this.$store.dispatch('user/login', this.loginForm).then(() => {
-                            this.$router.push({ path: '/home' });
-                            this.loading = false;
-                        }).catch(() => {
-                            this.loading = false;
-                        })
-                    } else {
-                        return false;
-                    }
-                })
+                if (this.loginForm.username === 'admin' && this.loginForm.password === '123456') {
+                    this.$router.push('/home');
+                }
             }
         },
         refreshCode() {
@@ -154,8 +164,8 @@ export default {
         randomNum(min, max) {
             return Math.floor(Math.random() * (max - min) + min);
         },
-        getVetifiedCode(){
-            
+        getVetifiedCode() {
+
         }
     },
     mounted() {

src/views/permissionManagement/roleOverview.vue

@@ -94,8 +94,18 @@ export default {
         cancleChecked() {
             //
         },
+        filterNode(value, data) {
+            if (!value) return true;
+            return data.label.indexOf(value) !== -1;
+        },
         handleClick() {
             //
+        },
+         handleNodeClick() {
+
+        },
+        handleSelectionChange(){
+            
         }
     }
 }
@@ -151,53 +161,53 @@ export default {
 }
 
 .bottom {
+    position: absolute;
+    top: 700px;
+    //left: 330px;
+    height: 50px;
+    width: 1340px;
+    line-height: 20px;
+    background-color: rgba(255, 255, 255, 1);
+    text-align: center;
+
+    .checkbox {
         position: absolute;
-        top: 700px;
-        //left: 330px;
-        height: 50px;
-        width: 1340px;
-        line-height: 20px;
-        background-color: rgba(255, 255, 255, 1);
+        left: 29px;
+        top: 15px;
+        font-size: 14px;
+    }
+
+    .check-cancel {
+        position: absolute;
+        // line-height: 20px;
+        font-size: 14px;
         text-align: center;
+        left: 140px;
+        top: 10px;
+    }
 
-        .checkbox {
-            position: absolute;
-            left: 29px;
-            top: 15px;
+    .bottom_button {
+        position: absolute;
+        left: 200px;
+        margin-top: 15px;
+
+        .delete {
             font-size: 14px;
+            text-align: center;
+            padding: 1px;
         }
 
-        .check-cancel {
-            position: absolute;
-            // line-height: 20px;
+        .disabled {
             font-size: 14px;
             text-align: center;
-            left: 140px;
-            top: 10px;
+            padding: 1px;
         }
 
-        .bottom_button {
-            position: absolute;
-            left: 200px;
-            margin-top: 15px;
-
-            .delete {
-                font-size: 14px;
-                text-align: center;
-                padding: 1px;
-            }
-
-            .disabled {
-                font-size: 14px;
-                text-align: center;
-                padding: 1px;
-            }
-
-            .export {
-                font-size: 14px;
-                text-align: center;
-                padding: 1px;
-            }
+        .export {
+            font-size: 14px;
+            text-align: center;
+            padding: 1px;
         }
     }
+}
 </style>

src/views/securityManagement/index.vue

@@ -1,28 +1,25 @@
 <template>
     <div>
         <div class="el-tab">
-            <el-tabs v-model="activeName" @tab-click="handleClick">
-                <el-tab-pane label="日志监控" name="logMonitor"></el-tab-pane>
-                <el-tab-pane label="系统监控" name="systemMonitor"></el-tab-pane>
+            <el-tabs v-model="activeName">
+                <el-tab-pane label="日志监控" name="logMonitor">
+                </el-tab-pane>
+                <el-tab-pane label="系统监控" name="systemMonitor">
+                </el-tab-pane>
             </el-tabs>
         </div>
-        <test></test>
+        <router-view></router-view>
     </div>
 </template>
 
 <script >
-import test from './systemMonitor/index'
 export default {
-    components:{test},
     data() {
         return {
             activeName: 'logMonitor',
         }
     },
     methods: {
-        handleClick() {
-            //
-        }
     }
 };
 </script>

src/views/securityManagement/systemMonitor/index.vue

@@ -1,19 +1,34 @@
 <template>
     <div class="container">
         <div class="header">
-            <el-button>定时任务</el-button>
-            <el-button>加密方法</el-button>
+            <el-button @click="Show1()">定时任务</el-button>
+            <el-button @click="Show2()">加密方法</el-button>
         </div>
-        <test></test>
+        <periodic-task v-show="show1"></periodic-task>
+        <encryption-method v-show="show2"></encryption-method>
     </div>
 </template>
 
 <script>
-import test from './periodicTask'
+import EncryptionMethod from './encryptionMethod'
+import periodicTask from './periodicTask'
 export default {
-    components:{test},
+  components: { periodicTask,EncryptionMethod },
     data() {
-        return {}
+        return {
+            show1:true,
+            show2:false
+        }
+    },
+    methods:{
+        Show1(){
+            this.show1 = true;
+            this.show2 = false;
+        },
+        Show2(){
+            this.show1 = false;
+            this.show2 = true;
+        },
     }
 }
 </script>

src/views/servicesManagement/index.vue

@@ -7,14 +7,12 @@
                 <el-tab-pane label="未安装服务" name="uninstall"></el-tab-pane>
             </el-tabs>
         </div>
-        <test></test>
+        <router-view></router-view>
     </div>
 </template>
 
 <script >
-import test from './allServices'
 export default {
-    components:{test},
     data() {
         return {
             activeName: 'allServices',

src/views/systemManagement/index.vue

@@ -8,17 +8,15 @@
                 <el-tab-pane label="指标配置" name="index"></el-tab-pane>
             </el-tabs>
         </div>
-        <test></test>
+        <router-view></router-view>
     </div>
 </template>
 
 <script>
-import test from './messageConfiguration/commonMessage'
 export default {
-    components: { test },
     data() {
         return {
-            activeName: 'information',
+            activeName: 'strategy',
         }
     },
     methods: {

src/views/systemManagement/indexConfiguration/index.vue

@@ -7,14 +7,14 @@
             <el-button>数智双碳</el-button>
             <el-button>智慧安防</el-button>
         </div>
-        <test></test>
+        <smart-board></smart-board>
     </div>
 </template>
 
 <script>
-import test from './smartBoard'
+import SmartBoard from './smartBoard'
 export default {
-    components:{test},
+    components:{SmartBoard},
     data() {
         return {}
     }

src/views/userManagement/groupManagement/forms/departmentdetailEdit.vue

@@ -4,43 +4,43 @@
         <img class="img" src="" alt=""><el-button class="alter">更换</el-button>
         <div class="form">
             <el-form :model="form" label-position="left" label-width="130px">
-                <el-form-item :model="form.fullName" label="部门级别：">
-                    <el-select style="width:400px">
-                        <el-option label=""></el-option>
+                <el-form-item  label="部门级别：">
+                    <el-select v-model="form.fullName" style="width:400px">
+                        <el-option value="test"></el-option>
                     </el-select>
                 </el-form-item>
-                <el-form-item :model="form.abbreviateName" label="上级部门：">
-                    <el-select style="width:400px">
-                        <el-option label=""></el-option>
+                <el-form-item label="上级部门：">
+                    <el-select v-model="form.abbreviateName" style="width:400px">
+                        <el-option value="test"></el-option>
                     </el-select>
                 </el-form-item>
-                <el-form-item :model="form.parentCorporation" label="部门负责人：">
-                    <el-select style="width:400px">
-                        <el-option label=""></el-option>
+                <el-form-item label="部门负责人：">
+                    <el-select v-model="form.parentCorporation" style="width:400px">
+                        <el-option value="test"></el-option>
                     </el-select>
                 </el-form-item>
-                <el-form-item :model="form.sccide" label="部门接口人：">
-                    <el-select style="width:400px">
-                        <el-option label=""></el-option>
+                <el-form-item  label="部门接口人：">
+                    <el-select v-model="form.sccide"  style="width:400px">
+                        <el-option value="test"></el-option>
                     </el-select>
                 </el-form-item>
-                <el-form-item :model="form.registeredAddress" label="排重名：">
-                    <el-input placeholder="test" type="text"></el-input>
+                <el-form-item label="排重名：">
+                    <el-input v-model="form.registeredAddress" placeholder="test" type="text"></el-input>
                 </el-form-item>
-                <el-form-item :model="form.businessAddress" label="在岗人数：">
-                    <el-input-number v-model="num" @change="handleChange" :min="1" :max="100"></el-input-number>
+                <el-form-item  label="在岗人数：">
+                    <el-input-number :model="form.businessAddress" v-model="num" @change="handleChange" :min="1" :max="100"></el-input-number>
                 </el-form-item>
-                <el-form-item :model="form.legalName" label="自由员工：">
-                    <el-input placeholder="test" type="text"></el-input>
+                <el-form-item  label="自由员工：">
+                    <el-input v-model="form.legalName" placeholder="test" type="text"></el-input>
                 </el-form-item>
-                <el-form-item :model="form.copporationCode" label="协作员工：">
-                    <el-input placeholder="test" type="text"></el-input>
+                <el-form-item  label="协作员工：">
+                    <el-input v-model="form.copporationCode" placeholder="test" type="text"></el-input>
                 </el-form-item>
-                <el-form-item :model="form.complementCount" label="第三方员工：">
-                    <el-input placeholder="test" type="text"></el-input>
+                <el-form-item  label="第三方员工：">
+                    <el-input v-model="form.complementCount" placeholder="test" type="text"></el-input>
                 </el-form-item>
-                <el-form-item :model="form.staffCount" label="部门职责：">
-                    <el-input type="textarea" placeholder="请输入" v-model="textarea" maxlength="200"
+                <el-form-item  label="部门职责：">
+                    <el-input  type="textarea" placeholder="请输入" v-model="textarea" maxlength="200"
                         show-word-limit></el-input>
                 </el-form-item>
             </el-form>

src/views/userManagement/groupManagement/index.vue

@@ -1,25 +1,27 @@
 <template>
-    <div class="container">
-        <div class="left-pane">
-            <el-input placeholder="请输入关键字" suffix-icon="el-icon-search" v-model="filterText"></el-input>
-            <el-tree ref="tree" :data="data" :props="defaultProps" node-key="id" default-expand-all
-                :filter-node-method="filterNode" @node-click="handleNodeClick">
-            </el-tree>
-            <el-button><i class="el-icon-s-order"></i>添加公司</el-button>
-        </div>
-        <div class="right-pane">
-            <test></test>
+    <div>
+        <div class="container">
+            <div class="left-pane">
+                <el-input placeholder="请输入关键字" suffix-icon="el-icon-search" v-model="filterText"></el-input>
+                <el-tree ref="tree" :data="data" :props="defaultProps" node-key="id" default-expand-all
+                    :filter-node-method="filterNode" @node-click="handleNodeClick">
+                </el-tree>
+                <el-button><i class="el-icon-s-order"></i>添加公司</el-button>
+            </div>
+            <div class="right-pane">
+                <DepartmentdetailEdit></DepartmentdetailEdit>
+            </div>
         </div>
     </div>
 </template>
-
 <script>
-import test from './messageDialog/departmentNew'
+import DepartmentdetailEdit from './forms/departmentdetailEdit';
 export default {
-    components: { test },
+    components: { DepartmentdetailEdit, },
     data() {
         return {
             filterText: '',
+            activeName: 'group',
             data: [{
                 label: '中讯邮电咨询设计院',
                 children: [{
@@ -47,18 +49,42 @@ export default {
         filterNode(value, data) {
             if (!value) return true;
             return data.label.indexOf(value) !== -1;
+        },
+        handleClick() {
+
         }
     }
 }
 </script>
 
 <style lang="less" scoped>
-.container {
+.el-tab {
     position: absolute;
     left: 218px;
+    right: 16px;
+    top: 77px;
+    height: 51px;
+    line-height: 20px;
+    background-color: rgba(255, 255, 255, 1);
+    text-align: center;
+    box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.15);
+
+    /deep/.el-tabs__nav {
+        left: 25px;
+    }
+
+    /deep/.el-tabs__nav-wrap::after {
+        height: 0;
+    }
+}
+
+.container {
+    position: fixed;
+    left: 218px;
     top: 140px;
     right: 16px;
-    //height: 800px;
+    height: -webkit-fill-available;
+    margin-bottom: 20px;
     line-height: 20px;
     background-color: rgba(255, 255, 255, 1);
     color: rgba(16, 16, 16, 1);

src/views/userManagement/index.vue

@@ -1,33 +1,30 @@
 <template>
     <div>
         <div class="el-tab">
-            <el-tabs v-model="activeName" @tab-click="handleClick">
+            <el-tabs v-model="activeName">
                 <el-tab-pane label="人员管理" name="person">
                     <personManagement></personManagement>
                 </el-tab-pane>
                 <el-tab-pane label="组织管理" name="group">
-                    <groupManagement></groupManagement>
                 </el-tab-pane>
             </el-tabs>
         </div>
+        <router-view></router-view>
     </div>
 </template>
 
 <script >
-import groupManagement from '../groupManagement/index';
-import personManagement from './personManagement/index';
+import personManagement from './personManagement/index'
 export default {
     name: 'userManagement',
-    components: { personManagement,groupManagement },
+    components: { personManagement },
     data() {
         return {
             activeName: 'person',
         }
     },
-    methods:{
-        handleClick(tab){
-           
-        }
+    methods: {
+
     }
 };
 </script>

src/views/userManagement/personManagement/tables/activeUser.vue

@@ -25,7 +25,7 @@
                 </template>
             </el-table-column>
             <el-table-column prop="operation" label="操作">
-                <el-button size="mini" type="text" @click="view">查看</el-button>
+                <el-button size="mini" type="text">查看</el-button>
                 <el-button size="mini" type="text">编辑</el-button>
                 <el-button size="mini" type="text">删除</el-button>
             </el-table-column>
@@ -92,12 +92,16 @@ export default {
                 status: false
             },],
             multipleSelection: [],
-            show: true
+            show: true,
+            total:0
         }
     },
     methods: {
         cancleChecked() {
             //
+        },
+        handleSelectionChange(){
+
         },
         handleClick() {
             //

src/views/userManagement/personManagement/tables/deactiveUser.vue

@@ -94,7 +94,12 @@ export default {
         }
     },
     methods: {
+        cancleChecked(){
 
+        },
+        handleSelectionChange(){
+            
+        }
     }
 }
 </script>