From 17792a8900da5a2dbdc32c1dd865a92c027a1ca6 Mon Sep 17 00:00:00 2001
From: ColorWhiteDeveloper <2632970487@qq.com>
Date: 星期一, 19 九月 2022 11:02:50 +0800
Subject: [PATCH] 系统框架重新搭建

---
 src/views/intellect/index.vue                                 |    3 
 src/views/systemSetting/index.vue                             |    3 
 src/views/login/index.vue                                     |    7 
 src/views/layout/components/Menu/index.vue                    |  127 +++++
 src/views/layout/components/NavBar/index.vue                  |  112 +--
 src/views/operate/图片管理                                        |    0 
 src/views/operate/日志管理                                        |    0 
 src/views/operate/调度管理                                        |    0 
 src/views/intellect/数据统计                                      |    0 
 src/views/operate/短信管理                                        |    0 
 src/views/operate/算法模型管理                                      |    0 
 src/views/systemSetting/baseSetting/user/createUser/index.vue |  295 +++++++++--
 src/views/intellect/趋势分析                                      |    0 
 src/views/layout/components/Header/index.vue                  |  164 +++++-
 src/views/operate/index.vue                                   |    3 
 src/views/law/index.vue                                       |    3 
 src/views/intellect/运行报告                                      |    0 
 src/router/index.js                                           |   57 ++
 src/views/lampblack/index.vue                                 |    3 
 src/utils/request.js                                          |   15 
 src/views/operate/消息管理                                        |    0 
 /dev/null                                                     |  232 ---------
 src/views/operate/店铺管理                                        |    0 
 src/views/systemSetting/baseSetting/user/userList/index.vue   |  124 +++++
 src/views/layout/components/AsideBar/index.vue                |  143 +++++
 src/views/layout/components/Footer/index.vue                  |   28 +
 src/main.js                                                   |   13 
 src/views/operate/车辆管理                                        |    0 
 src/views/info/index.vue                                      |    3 
 src/views/intellect/违规检索                                      |    0 
 src/views/layout/index.vue                                    |   44 +
 src/views/operate/执法管理                                        |    0 
 src/views/video/index.vue                                     |    5 
 src/views/layout/components/Main/index.vue                    |   27 
 src/views/operate/视频管理                                        |    0 
 src/views/intellect/预警研判                                      |    0 
 src/views/operate/审核管理                                        |    0 
 37 files changed, 980 insertions(+), 431 deletions(-)

diff --git a/src/main.js b/src/main.js
index 44c454e..18d7a16 100644
--- a/src/main.js
+++ b/src/main.js
@@ -12,8 +12,17 @@
 import './assets/icons' 
 // 寮曞叆鍏ㄥ眬鏍峰紡
 import '@/styles/index.scss' 
-import axios from "axios"
-Vue.prototype.$axios=axios
+import api from "axios"
+api.interceptors.request.use((config)=>{
+  console.log(config);
+  const token = localStorage.getItem('token');
+  const tokenHead = localStorage.getItem('tokenHead');
+    if(token){
+      config.headers.Authorization = tokenHead+token;
+    }
+  return config;
+})
+Vue.prototype.$axios=api
 console.log(process.env.VUE_APP_BASE_API);
 Vue.use(ElementUI)
 new Vue({
diff --git a/src/router/index.js b/src/router/index.js
index 230ad53..bd70fcf 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -3,20 +3,62 @@
 Vue.use(VueRouter)
 const routes = [
   {
+    path:"/",
+    name:'index',
+    redirect:'/home'
+  },
+  {
     path: '/home',
     name: 'home',
     component: () => import('@/views/layout'),
     children: [
+      {
+        path: 'system',
+        name: 'system',
+        component: () => import('@/views/systemSetting'),
+        children: [
+          {
+            path: "createUser",
+            name: "createUser",
+            component: () => import('@/views/systemSetting/baseSetting/user/createUser')
+          },
+          {
+            path: 'userList',
+            name: 'userList',
+            component: () => import('@/views/systemSetting/baseSetting/user/userList')
+          }
+        ]
+      },
+      {
+        path: "operate",
+        name: 'operate',
+        component: () => import('@/views/operate/index.vue')
+      },
       {
         path: "video",
         name: 'video',
         component: () => import('@/views/video')
       },
       {
-        path:"createUser",
-        name:"createUser",
-        component:()=> import('@/views/systemSetting/baseSetting/user/createUser')
-      }
+        path: "lampblack",
+        name: 'lampblack',
+        component: () => import('@/views/lampblack')
+      },
+      {
+        path: "law",
+        name: 'law',
+        component: () => import('@/views/law')
+      },
+      {
+        path: "intellect",
+        name: 'intellect',
+        component: () => import('@/views/intellect')
+      },
+      {
+        path: "info",
+        name: 'info',
+        component: () => import('@/views/info')
+      },
     ]
   },
   {
@@ -34,7 +76,7 @@
     name: "404",
     component: () => import('@/views/NotFound'),
   },
-  { path: '*', redirect: '/404' }
+  // { path: '*', redirect: '/404' }
 ]
 
 const router = new VueRouter({
@@ -42,5 +84,8 @@
   base: process.env.BASE_URL,
   routes
 })
-
+const originalPush = router.push
+router.push = function push(location) {
+	return originalPush.call(this, location).catch(err => err);
+}
 export default router
diff --git a/src/utils/request.js b/src/utils/request.js
index 3f3d342..78d1d8d 100644
--- a/src/utils/request.js
+++ b/src/utils/request.js
@@ -1,10 +1,16 @@
 import axios from 'axios';
+const service = axios.create({
+    baseURL: 'http://42.193.1.25:8082/', // 璇锋眰鐨勫叕鍏卞湴鍧�閮ㄥ垎
+})
 // 鎷︽埅鍣�
 // 璇锋眰
-axios.interceptors.request.use(
+service.interceptors.request.use(
   // 璇锋眰涔嬪墠鐨勫洖璋冨嚱鏁�
   function (config) {
-    config['baseURL'] = '/api';
+    const token = localStorage.getItem('token');
+    if(token){
+      config.headers.authentication = token;
+    }
     return config;
   },
   function (error) {
@@ -13,11 +19,12 @@
   }
 );
 // 鍝嶅簲
-axios.interceptors.response.use(
+service.interceptors.response.use(
   function (response) {
     return response.data;
   },
   function (error) {
     return Promise.reject(error);
   }
-);  
\ No newline at end of file
+);  
+export default service;
\ No newline at end of file
diff --git a/src/views/info/index.vue b/src/views/info/index.vue
new file mode 100644
index 0000000..2785996
--- /dev/null
+++ b/src/views/info/index.vue
@@ -0,0 +1,3 @@
+<template>
+    <router-view></router-view>
+</template>
diff --git a/src/views/intellect/index.vue b/src/views/intellect/index.vue
new file mode 100644
index 0000000..2785996
--- /dev/null
+++ b/src/views/intellect/index.vue
@@ -0,0 +1,3 @@
+<template>
+    <router-view></router-view>
+</template>
diff --git "a/src/views/\346\231\272\350\203\275\345\267\241\346\237\245/\346\225\260\346\215\256\347\273\237\350\256\241" "b/src/views/intellect/\346\225\260\346\215\256\347\273\237\350\256\241"
similarity index 100%
rename from "src/views/\346\231\272\350\203\275\345\267\241\346\237\245/\346\225\260\346\215\256\347\273\237\350\256\241"
rename to "src/views/intellect/\346\225\260\346\215\256\347\273\237\350\256\241"
diff --git "a/src/views/\346\231\272\350\203\275\345\267\241\346\237\245/\350\266\213\345\212\277\345\210\206\346\236\220" "b/src/views/intellect/\350\266\213\345\212\277\345\210\206\346\236\220"
similarity index 100%
rename from "src/views/\346\231\272\350\203\275\345\267\241\346\237\245/\350\266\213\345\212\277\345\210\206\346\236\220"
rename to "src/views/intellect/\350\266\213\345\212\277\345\210\206\346\236\220"
diff --git "a/src/views/\346\231\272\350\203\275\345\267\241\346\237\245/\350\277\220\350\241\214\346\212\245\345\221\212" "b/src/views/intellect/\350\277\220\350\241\214\346\212\245\345\221\212"
similarity index 100%
rename from "src/views/\346\231\272\350\203\275\345\267\241\346\237\245/\350\277\220\350\241\214\346\212\245\345\221\212"
rename to "src/views/intellect/\350\277\220\350\241\214\346\212\245\345\221\212"
diff --git "a/src/views/\346\231\272\350\203\275\345\267\241\346\237\245/\350\277\235\350\247\204\346\243\200\347\264\242" "b/src/views/intellect/\350\277\235\350\247\204\346\243\200\347\264\242"
similarity index 100%
rename from "src/views/\346\231\272\350\203\275\345\267\241\346\237\245/\350\277\235\350\247\204\346\243\200\347\264\242"
rename to "src/views/intellect/\350\277\235\350\247\204\346\243\200\347\264\242"
diff --git "a/src/views/\346\231\272\350\203\275\345\267\241\346\237\245/\351\242\204\350\255\246\347\240\224\345\210\244" "b/src/views/intellect/\351\242\204\350\255\246\347\240\224\345\210\244"
similarity index 100%
rename from "src/views/\346\231\272\350\203\275\345\267\241\346\237\245/\351\242\204\350\255\246\347\240\224\345\210\244"
rename to "src/views/intellect/\351\242\204\350\255\246\347\240\224\345\210\244"
diff --git a/src/views/lampblack/index.vue b/src/views/lampblack/index.vue
new file mode 100644
index 0000000..2785996
--- /dev/null
+++ b/src/views/lampblack/index.vue
@@ -0,0 +1,3 @@
+<template>
+    <router-view></router-view>
+</template>
diff --git a/src/views/law/index.vue b/src/views/law/index.vue
new file mode 100644
index 0000000..2785996
--- /dev/null
+++ b/src/views/law/index.vue
@@ -0,0 +1,3 @@
+<template>
+    <router-view></router-view>
+</template>
diff --git a/src/views/layout/components/AsideBar/index.vue b/src/views/layout/components/AsideBar/index.vue
new file mode 100644
index 0000000..cb972c5
--- /dev/null
+++ b/src/views/layout/components/AsideBar/index.vue
@@ -0,0 +1,143 @@
+<template>
+  <div class="AsideBar">
+    <!-- 浜岀骇渚ц竟鏍� -->
+    <el-aside width="200px" class="aside">
+      <el-scrollbar>
+        <el-menu class="el-menu-vertical" :default-active="$route.path">
+          <div v-for="item in asideList" :key="item.name">
+            <span class="AsideBarTitle">{{item.name}}</span>
+            <el-menu-item v-for="child in item.children" :key="child.name" :index="child.index" class="firstMenu"
+              @click="Jump(child.index)">
+              <span class="firstSpan">{{child.name}}</span>
+            </el-menu-item>
+          </div>
+        </el-menu>
+      </el-scrollbar>
+    </el-aside>
+  </div>
+</template>
+  
+<script>
+export default {
+  data() {
+    return {
+      menu: [
+        {
+          name: '/home/system', children: [
+            {
+              name: "鍩虹璁剧疆", index: '/home/system/base', children: [
+                {
+                  name: '鐢ㄦ埛绠$悊', index: '/home/system/userList',
+                },
+                {
+                  name: '鏂板鐢ㄦ埛', index: '/home/system/createUser'
+                }
+              ]
+            },
+            { name: "骞冲彴璁剧疆", index: "/home/system/plateform", children: [] },
+          ],
+        }
+      ],
+      asideList: null,
+    }
+  },
+  created() {
+    this.getAsideList(this.$route.path);
+  },
+  watch: {
+    $route(to, from) {
+      this.getAsideList(to.fullPath);
+    }
+  },
+  methods: {
+    getAsideList(path) {
+      let { menu } = this;
+      const that = this;
+      this.asideList = null;
+      menu.forEach(item => {
+        if (path.indexOf(item.name) !== -1) {
+          console.log(item.children);
+          that.asideList = item.children;
+        }
+      })
+      console.log(this.asideList);
+    },
+    Jump(path) {
+      this.$router.push(path);
+    }
+  }
+};
+</script>
+  
+<style lang="scss" scpoed>
+.icon-padding {
+  padding-right: 10px;
+}
+
+.aside {
+  background: #eaedf1;
+  color: black;
+  text-align: center;
+  box-sizing: border-box;
+  position: relative;
+  //    鍥哄畾鏍囬
+  .siderbar-title {
+    position: fixed;
+    text-align: center;
+    margin: 0;
+    font-size: 26px;
+    width: 200px;
+    line-height: 66px;
+    top: 0;
+    left: 0;
+    z-index: 999;
+    box-shadow: 0 -5px 5px #0ff inset;
+  }
+
+  .el-scrollbar {
+    height: calc(100vh - 66px);
+    box-sizing: border-box;
+
+    .el-menu {
+      border: 0;
+      .AsideBarTitle {
+        display: block;
+        line-height: 60px;
+        color: #999;
+        font-weight: 650;
+        background-color: #f2f2f2;
+        border-bottom: 1px solid #e4e4e4;
+      }
+
+      .firstMenu {
+        background: #eaedf1;
+        text-align: center;
+        height: 40px;
+        line-height: 40px;
+        background-color: #eaedf1;
+        color: #666666;
+        border-bottom: 1px solid #e4e4e4;
+
+        &:hover .firstSpan {
+          color: #1a87fe;
+        }
+
+        .el-menu-item {
+          &:hover {
+            color: #22d3eb;
+          }
+        }
+      }
+
+      .is-active {
+        background-color: #fff;
+        color: #1a87fe;
+      }
+    }
+
+    .el-scrollbar__wrap {
+      overflow-x: hidden;
+    }
+  }
+}
+</style>
\ No newline at end of file
diff --git a/src/views/layout/components/Footer/index.vue b/src/views/layout/components/Footer/index.vue
new file mode 100644
index 0000000..430dfba
--- /dev/null
+++ b/src/views/layout/components/Footer/index.vue
@@ -0,0 +1,28 @@
+<template>
+    <el-footer class="footer">
+      <div>Copyright&copy;鏉窞瓒呴┈绉戞妧鏈夐檺鍏徃</div>
+      <div>閬傛槍鍘挎墽娉曞眬</div>
+    </el-footer>
+</template>
+<script>
+export default {
+    
+}
+</script>
+<style lang="scss">
+  .el-footer{
+    padding: 0;
+    margin-top: 60px;
+    height: 100px;
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    align-items: center;
+    background-color:#f0f2f5;
+    div{
+      line-height: 24px;
+      font-size: 12px;
+      color: #cccfd8;
+    }
+  }
+</style>
\ No newline at end of file
diff --git a/src/views/layout/components/Header/index.vue b/src/views/layout/components/Header/index.vue
index 32a4177..57e97b0 100644
--- a/src/views/layout/components/Header/index.vue
+++ b/src/views/layout/components/Header/index.vue
@@ -2,83 +2,179 @@
   <div>
     <!-- 澶撮儴 -->
     <el-header>
+      <!-- 宸︿晶鑿滃崟 -->
+      <div class="menuLeft">
+        <div class="icon">
+          <img style="width:30px;height:30px"
+            src="https://axure-file.lanhuapp.com/90466432-c999-4bf0-80b8-ee3f96a2099e__155eeb2ceaac89ec717869a050964a36.svg"
+            alt="">
+        </div>
+        <div class="systemName">閬傛槍鏅烘収鎵ф硶骞冲彴</div>
+        <ul class="headerNav">
+          <li v-for="(item,index) in nav" :key="item.name" :class="item.checked?'activeIndex':''" @click="handleChange(index)">{{item.name}}</li>
+        </ul>
+      </div>
       <!-- 鍙充晶鑿滃崟 -->
-      <div class="header-title">
-        <div class="bell">
-          <el-icon class="el-icon-bell" style="color: white"></el-icon>
+      <div class="menuRight">
+        <div class="search">
+          <el-input placeholder="璇疯緭鍏ユ悳绱㈠唴瀹�" suffix-icon="el-icon-search" v-model="search">
+          </el-input>
         </div>
-        <div class="userinfo">
-          <div class="avatar"></div>
-          <span class="username">admin</span>
+        <div class="userinfo userItem">
+          <div class="userIcon"></div>
+          <span class="username">admin<i class="el-icon-arrow-down" style="margin-left:3px"></i></span>
         </div>
-        <div class="loginout" @click="loginout">閫�鍑虹櫥褰�</div>
+        <div class="userMessage userBtn"><i class="el-icon-message-solid"></i></div>
+        <div class="userSetting userBtn"><i class="el-icon-s-tools"></i></div>
+        <div class="userLoginout userBtn" @click="loginout"><i class="el-icon-switch-button"></i></div>
       </div>
     </el-header>
-    <!-- <NavBar /> -->
   </div>
 </template>
 
 <script>
 import hamburger from "@/components/hamburger";
-// import NavBar from "../NavBar";
 export default {
   data() {
     return {
       opened: false,
+      search:'',
+      nav:[
+        {
+          name:'椹鹃┒鑸�',
+          checked:true,
+        },
+        {
+          name:'瑙嗛鏌ヨ',
+          checked:false,
+        },
+        {
+          name:'鎵ф硶绠$悊',
+          checked:false,
+        }
+      ]
     };
   },
   components: {
     hamburger,
-    // NavBar,
   },
-  methods:{
-    loginout(){
-      this.$router.push({path:"/login"})
+  methods: {
+    loginout() {
+      this.$router.push({ path: "/login" })
+    },
+    handleChange(idx){
+      // 璁剧疆nav婵�娲�
+      this.nav.forEach((item,index)=>{
+        index==idx?item.checked = true:item.checked = false;
+      })
+      localStorage.setItem('navIdx',idx);
     }
-  }
+  },
+  mounted() {
+    const idx = localStorage.getItem("navIdx");
+    if(idx){
+      this.handleChange(idx);
+    }
+  },
 };
 </script>
 
-<style lang="scss" >
+<style lang="scss" scoped>
+* {
+  margin: 0;
+  padding: 0;
+}
+
 .el-header {
-  background-color: #071a38;
+  background-color: rgb(0, 121, 254);
   color: #333;
   text-align: center;
   line-height: 60px;
   display: flex;
   align-items: center;
-  justify-content: flex-end;
+  justify-content: space-between;
   padding: 0;
-  .header-title {
-    display: flex;
-    align-items: center;
-    width: 280px;
-    justify-content: space-evenly;
-    .bell {
-      background-color: #00d1fa;
-      width: 25px;
-      height: 25px;
-      border-radius: 5px;
-      text-align: center;
-      line-height: 25px;
+  position: fixed;
+  width: 100%;
+  top: 0px;
+  z-index: 9999;
+  .menuLeft {
+    color: #fff;
+
+    .icon {
+      margin: 0 20px;
     }
-    .userinfo {
-      width: 100xp;
+
+    .systemName {
+      width: 185px;
+      font-weight: 650;
+      font-size: 18px;
+    }
+
+    ul,
+    .icon {
       display: flex;
       align-items: center;
-      .avatar {
-        width: 25px;
-        height: 25px;
+    }
+
+    li {
+      list-style: none;
+      width: 100px;
+      &:hover{
+        cursor: pointer;
+      }
+    }
+
+    .activeIndex {
+      height: 30px;
+      line-height: 30px;
+      border-radius: 20px;
+      background-color: #53a5ff;
+    }
+
+    display: flex;
+  }
+
+  .menuRight {
+    display: flex;
+    align-items: center;
+    justify-content: space-evenly;
+    .search{
+      .el-input{
+        width: 200px;
+        margin: 0 10px;
+      }
+      .el-input__inner{
+        height: 30px;
+      }
+    }
+    .userItem{
+      width: 120px;
+    }
+    .userBtn{
+      width: 60px;
+      color: #fff;
+      font-size: 20px;
+    }
+    .userinfo {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      .userIcon {
+        width: 20px;
+        height: 20px;
         border-radius: 50%;
         background-image: url("@/assets/imgs/user/default-avatar.jpg");
         background-size: cover;
       }
+
       .username {
         margin: 0 5px;
         color: #22d3eb;
         font-size: 14px;
       }
     }
+
     .loginout {
       color: #22d3eb;
       font-size: 14px;
diff --git a/src/views/layout/components/Main/index.vue b/src/views/layout/components/Main/index.vue
index e7674a4..26fbaa5 100644
--- a/src/views/layout/components/Main/index.vue
+++ b/src/views/layout/components/Main/index.vue
@@ -1,15 +1,32 @@
 <template>
   <el-main>
-    <router-view></router-view>
+    <NavBar />
+    <div class="content">
+      <router-view></router-view>
+      <!-- 搴曢儴鍖哄煙 -->
+      <MyFooter/>
+    </div>
   </el-main>
 </template>
 
 <script>
-// import NavBar from "../NavBar"
+import MyFooter from "../Footer"
+import NavBar from "../NavBar"
 export default {
   name: "Main",
-  components:{
-    // NavBar
+  components: {
+    MyFooter,
+    NavBar
   }
 };
-</script>
\ No newline at end of file
+</script>
+<style lang="scss">
+.el-main {
+  min-width: 1024px;
+  padding: 0;
+  .content {
+    background-color: #f0f2f5;
+    padding: 20px 40px;
+  }
+}
+</style>
diff --git a/src/views/layout/components/Menu/index.vue b/src/views/layout/components/Menu/index.vue
new file mode 100644
index 0000000..60751bd
--- /dev/null
+++ b/src/views/layout/components/Menu/index.vue
@@ -0,0 +1,127 @@
+<template>
+  <div class="Menu">
+    <!-- 鑿滃崟鏍� -->
+    <el-aside width="160px" class="menu">
+      <el-scrollbar class="MenuScroll">
+        <!-- 璺敱 -->
+        <el-menu class="el-menu-vertical">
+          <el-menu-item v-for="item in menu" :key="item.name" class="firstMenu" @click="Jump(item.index)">
+            <template slot="title" class="firstSpan">
+              <span slot="prefix" class="icon-padding fisrtSpan">
+                <svg-icon :icon-class="item.icon"></svg-icon>
+              </span>
+              <span class="fisrtSpan">{{item.name}}</span>
+            </template>
+          </el-menu-item>
+        </el-menu>
+      </el-scrollbar>
+    </el-aside>
+  </div>
+</template>
+
+<script>
+export default {
+  data() {
+    return {
+      menu: [
+        {
+          name: "绯荤粺璁剧疆", icon: "system", index: "/home/system", 
+        },
+        {
+          name: "杩愯惀绠$悊", icon: "operate", index: "/home/operate",
+        },
+        {
+          name: "瑙嗛宸℃煡", icon: "video", index: "/home/video",
+        },
+        {
+          name: "娌圭儫淇℃伅鏌ヨ", icon: "intelligence", index: "/home/lampblack",
+        },
+        {
+          name: "鎵ф硶绠$悊", icon: "intelligence", index: "/home/law",
+        },
+        {
+          name: "鏅鸿兘宸℃煡", icon: "intelligence", index: "/home/intellect",
+        },
+        {
+          name: "骞冲彴鍩烘湰淇℃伅", icon: "intelligence", index: "/home/info",
+        }
+      ],
+    }
+  },
+  methods:{
+    Jump(url){
+      this.$router.push(url);
+    }
+  }
+};
+</script>
+
+<style lang="scss" scpoed>
+$bk:#333744;
+.icon-padding {
+  padding-right: 10px;
+}
+.menu {
+  background: $bk;
+  color: #e9eef3;
+  text-align: center;
+  box-sizing: border-box;
+  position: relative;
+  //    鍥哄畾鏍囬
+  .siderbar-title {
+    position: fixed;
+    text-align: center;
+    margin: 0;
+    font-size: 26px;
+    width: 200px;
+    line-height: 66px;
+    top: 0;
+    left: 0;
+    z-index: 999;
+    box-shadow: 0 -5px 5px #0ff inset;
+  }
+
+  .MenuScroll {
+    height: calc(100vh - 66px);
+    box-sizing: border-box;
+    .el-menu {
+      background: linear-gradient(#07162e, #0f2b56);
+      border: 0;
+
+      .firstMenu {
+        background: $bk;
+        text-align: left;
+        &:hover .fisrtSpan {
+          color: #fff;
+        }
+
+        span {
+          color: #e9eef3;
+        }
+
+        .el-menu-item {
+          color: #c3c3c4;
+          background-color: #333744;
+
+          &:hover {
+            color: #fff;
+          }
+        }
+
+        .is-active {
+          background-color: #07162e;
+          color: #22d3eb;
+        }
+      }
+
+      .is-active {
+        background-color: #092c4a;
+      }
+    }
+
+    .el-scrollbar__wrap {
+      overflow-x: hidden;
+    }
+  }
+}
+</style>
\ No newline at end of file
diff --git a/src/views/layout/components/NavBar/index.vue b/src/views/layout/components/NavBar/index.vue
index 5b0592c..312ed43 100644
--- a/src/views/layout/components/NavBar/index.vue
+++ b/src/views/layout/components/NavBar/index.vue
@@ -1,76 +1,56 @@
 <template>
-  <el-breadcrumb class="app-breadcrumb" separator="/">
-    <transition-group name="breadcrumb">
-      <el-breadcrumb-item v-for="(item,index) in levelList" :key="item.path">
-        <span v-if="item.redirect==='noRedirect'||index==levelList.length-1" class="no-redirect">{{ item.meta.title }}</span>
-        <a v-else @click.prevent="handleLink(item)">{{ item.meta.title }}</a>
-      </el-breadcrumb-item>
-    </transition-group>
-  </el-breadcrumb>
+    <div class="NavBar">
+        <div class="NavTitle">椤甸潰瀵艰埅</div>
+        <div class="NavRefresh">
+            <el-button icon="el-icon-refresh" @click="Refresh">鍒锋柊</el-button>
+        </div>
+    </div>
 </template>
-
 <script>
-import pathToRegexp from 'path-to-regexp'
-
 export default {
-  data() {
-    return {
-      levelList: null
-    }
-  },
-  watch: {
-    $route() {
-      this.getBreadcrumb()
-    }
-  },
-  created() {
-    this.getBreadcrumb()
-  },
-  methods: {
-    getBreadcrumb() {
-      // only show routes with meta.title
-      let matched = this.$route.matched.filter(item => item.meta && item.meta.title)
-      const first = matched[0]
+    data(){
+        return{
 
-      if (!this.isDashboard(first)) {
-        matched = [{ path: '/dashboard', meta: { title: 'Dashboard' }}].concat(matched)
-      }
-
-      this.levelList = matched.filter(item => item.meta && item.meta.title && item.meta.breadcrumb !== false)
+        }
     },
-    isDashboard(route) {
-      const name = route && route.name
-      if (!name) {
-        return false
-      }
-      return name.trim().toLocaleLowerCase() === 'Dashboard'.toLocaleLowerCase()
-    },
-    pathCompile(path) {
-      const { params } = this.$route
-      var toPath = pathToRegexp.compile(path)
-      return toPath(params)
-    },
-    handleLink(item) {
-      const { redirect, path } = item
-      if (redirect) {
-        this.$router.push(redirect)
-        return
-      }
-      this.$router.push(this.pathCompile(path))
+    methods:{
+        Refresh(){
+            window.location.href = "";
+        }
     }
-  }
 }
 </script>
-
 <style lang="scss" scoped>
-.app-breadcrumb.el-breadcrumb {
-  display: inline-block;
-  font-size: 14px;
-  line-height: 30px;
-  margin-left: 8px;
-  .no-redirect {
-    color: #97a8be;
-    cursor: text;
-  }
-}
-</style>
+    .NavBar{
+        display: flex;
+        color: #999999;
+        justify-content: space-between;
+        line-height: 60px;
+        width: 100%;
+        padding: 0 40px;
+        background-color: #fff;
+        .NavTitle{
+            display: flex;
+            align-items: center;
+            font-weight: 650;
+            font-size: 18px;
+            &::before{
+                content: "";
+                display: inline-block;
+                width: 5px;
+                height: 20px;
+                margin-right: 5px;
+                background-color: #0079fe;
+            }
+        }
+        .NavRefresh{
+            width: 70px;
+            height: 30px;
+            .el-button{
+                padding: 0;
+                width: 100%;
+                height: 100%;
+            }
+        }
+    }
+</style>
\ No newline at end of file
diff --git a/src/views/layout/components/SiderBar/index.vue b/src/views/layout/components/SiderBar/index.vue
deleted file mode 100644
index 1f2cb74..0000000
--- a/src/views/layout/components/SiderBar/index.vue
+++ /dev/null
@@ -1,232 +0,0 @@
-<template>
-  <div>
-    <!-- 渚ц竟瀵艰埅鏍� -->
-    <el-aside width="200px">
-      <h2 class="siderbar-title">閬傛槍鎵ф硶骞冲彴</h2>
-      <el-scrollbar>
-        <!-- 璺敱 -->
-        <el-menu router class="el-menu-vertical" :default-active="$route.path" >
-          <!-- 绯荤粺璁剧疆妯″潡 -->
-          <el-submenu index="/home/system" class="firstMenu">
-            <template slot="title" class="firstSpan">
-              <!-- <i class="el-icon-reading"></i> -->
-              <span  slot="prefix" class="icon-padding fisrtSpan">
-                <svg-icon icon-class="system"></svg-icon>
-              </span>
-              <span class="fisrtSpan">绯荤粺璁剧疆</span>
-            </template>
-            <!-- 鍩烘湰璁剧疆 -->
-            <el-submenu index="/admin/system/base" class="secondMenu">
-              <template slot="title">
-                <span class="secondSpan">鍩烘湰璁剧疆</span>
-              </template>
-              <!-- 鐢ㄦ埛绠$悊 -->
-              <el-submenu index="/admin/system/base/user" class="thirdMenu">
-                <template slot="title">
-                  <span class="thirdSpan">鐢ㄦ埛绠$悊</span>
-                </template>
-                <el-menu-item index="/home/createUser">鏂板缓鐢ㄦ埛(璐︽埛)</el-menu-item>
-                <el-menu-item index="/admin/system/base/userList">鐢ㄦ埛鍒楄〃</el-menu-item>
-              </el-submenu>
-              <!-- 瑙掕壊绠$悊 -->
-              <el-submenu index="/admin/system/base/role" class="thirdMenu">
-                <template slot="title">
-                  <span class="thirdSpan">瑙掕壊绠$悊</span>
-                </template>
-                <el-menu-item index="/admin/system/base/role/createRole">鏂板缓瑙掕壊</el-menu-item>
-                <el-menu-item index="/admin/system/base/roleList">瑙掕壊绠$悊鍒楄〃</el-menu-item>
-              </el-submenu>
-              <!-- 鏉冮檺绠$悊 -->
-              <el-submenu index="/admin/system/base/authority" class="thirdMenu">
-                <template slot="title">
-                  <span class="thirdSpan">鏉冮檺绠$悊</span>
-                </template>
-                <el-menu-item index="/admin/system/base/authority">璁剧疆鏉冮檺</el-menu-item>
-              </el-submenu>
-              <!-- 閮ㄩ棬绠$悊 -->
-              <el-submenu index="/admin/system/base/department" class="thirdMenu">
-                <template slot="title">
-                  <span class="thirdSpan">閮ㄩ棬绠$悊</span>
-                </template>
-                <el-menu-item index="/admin/system/base/department/createDepartment">鍒涘缓閮ㄩ棬</el-menu-item>
-                <el-menu-item index="/admin/system/base/department/controle">閮ㄩ棬绠$悊</el-menu-item>
-              </el-submenu>
-            </el-submenu>
-            <!-- 骞冲彴璁剧疆 -->
-            <el-submenu index="/admin/article/add" class="secondMenu">
-              <template slot="title">
-                <span class="secondSpan">骞冲彴璁剧疆</span>
-              </template>
-              <el-menu-item index="/admin/article">闂ㄦ埛璁剧疆</el-menu-item>
-              <el-menu-item index="/admin/article">绗笁鏂规帴鍙g鐞�</el-menu-item>
-            </el-submenu>
-          </el-submenu>
-          <!-- 杩愯惀绠$悊妯″潡 -->
-          <el-submenu index="/home/operate" class="firstMenu">
-            <template slot="title">
-              <span slot="prefix" class="icon-padding fisrtSpan">
-                <svg-icon icon-class="operate"></svg-icon>
-              </span>
-              <span class="fisrtSpan">杩愯惀绠$悊</span>
-            </template>
-            <el-menu-item index="/admin/article/add">鎵ф硶绠$悊</el-menu-item>
-            <el-menu-item index="/admin/article/add">璋冨害绠$悊</el-menu-item>
-            <el-menu-item index="/admin/article/add">搴楅摵绠$悊</el-menu-item>
-            <el-menu-item index="/admin/article/add">杞﹁締绠$悊</el-menu-item>
-            <el-menu-item index="/admin/article/add">鍥剧墖绠$悊</el-menu-item>
-            <el-menu-item index="/admin/article/add">瑙嗛绠$悊</el-menu-item>
-            <el-menu-item index="/admin/article/add">娑堟伅绠$悊</el-menu-item>
-            <el-menu-item index="/admin/article/add">瀹℃牳绠$悊</el-menu-item>
-            <el-menu-item index="/admin/article/add">鐭俊绠$悊</el-menu-item>
-            <el-menu-item index="/admin/article">绠楁硶妯″瀷绠$悊</el-menu-item>
-            <el-menu-item index="/admin/article">鏃ュ織绠$悊</el-menu-item>
-          </el-submenu>
-          <!-- 瑙嗛宸℃煡妯″潡 -->
-          <el-submenu index="/home/video" class="firstMenu">
-            <template slot="title">
-              <span slot="prefix" class="icon-padding fisrtSpan">
-                <svg-icon icon-class="video"></svg-icon>
-              </span>
-              <span slot="title" class="fisrtSpan">瑙嗛宸℃煡</span>
-            </template>
-            <el-menu-item index="/home/video">瑙嗛宸℃煡</el-menu-item>
-          </el-submenu>
-          <!-- 娌圭儫淇℃伅鏌ヨ妯″潡 -->
-          <el-submenu index="/home/lampblack" class="firstMenu">
-            <template slot="title">
-              <span slot="prefix" class="icon-padding fisrtSpan">
-                <svg-icon icon-class="intelligence"></svg-icon>
-              </span>
-              <span class="fisrtSpan">娌圭儫淇℃伅鏌ヨ</span>
-            </template>
-            <el-menu-item index="/admin/article/add">棰勮鐮斿垽</el-menu-item>
-            <el-menu-item index="/admin/article">杩濊妫�绱�</el-menu-item>
-            <el-menu-item index="/admin/article">瓒嬪娍鍒嗘瀽</el-menu-item>
-            <el-menu-item index="/admin/article">鏁版嵁缁熻</el-menu-item>
-            <el-menu-item index="/admin/article">杩愯鎶ュ憡</el-menu-item>
-          </el-submenu>
-          <!-- 鎵ф硶绠$悊妯″潡 -->
-          <el-submenu index="/home/law" class="firstMenu">
-            <template slot="title">
-              <span slot="prefix" class="icon-padding fisrtSpan">
-                <svg-icon icon-class="intelligence"></svg-icon>
-              </span>
-              <span class="fisrtSpan">鎵ф硶绠$悊</span>
-            </template>
-            <el-menu-item index="/admin/article/add">棰勮鐮斿垽</el-menu-item>
-            <el-menu-item index="/admin/article">杩濊妫�绱�</el-menu-item>
-            <el-menu-item index="/admin/article">瓒嬪娍鍒嗘瀽</el-menu-item>
-            <el-menu-item index="/admin/article">鏁版嵁缁熻</el-menu-item>
-            <el-menu-item index="/admin/article">杩愯鎶ュ憡</el-menu-item>
-          </el-submenu>
-          <!-- 鏅鸿兘宸℃煡妯″潡 -->
-          <el-submenu index="/admin/intellect" class="firstMenu">
-            <template slot="title">
-              <span slot="prefix" class="icon-padding fisrtSpan">
-                <svg-icon icon-class="intelligence"></svg-icon>
-              </span>
-              <span class="fisrtSpan">鏅鸿兘宸℃煡</span>
-            </template>
-            <el-menu-item index="/admin/article/add">棰勮鐮斿垽</el-menu-item>
-            <el-menu-item index="/admin/article">杩濊妫�绱�</el-menu-item>
-            <el-menu-item index="/admin/article">瓒嬪娍鍒嗘瀽</el-menu-item>
-            <el-menu-item index="/admin/article">鏁版嵁缁熻</el-menu-item>
-            <el-menu-item index="/admin/article">杩愯鎶ュ憡</el-menu-item>
-          </el-submenu>
-          <!-- 骞冲彴鍩烘湰淇℃伅 -->
-          <el-submenu index="/admin/info" class="firstMenu">
-            <template slot="title">
-              <span slot="prefix" class="icon-padding fisrtSpan">
-                <svg-icon icon-class="intelligence"></svg-icon>
-              </span>
-              <span class="fisrtSpan">骞冲彴鍩烘湰淇℃伅</span>
-            </template>
-            <el-menu-item index="/admin/article/add">棰勮鐮斿垽</el-menu-item>
-            <el-menu-item index="/admin/article">杩濊妫�绱�</el-menu-item>
-            <el-menu-item index="/admin/article">瓒嬪娍鍒嗘瀽</el-menu-item>
-            <el-menu-item index="/admin/article">鏁版嵁缁熻</el-menu-item>
-            <el-menu-item index="/admin/article">杩愯鎶ュ憡</el-menu-item>
-          </el-submenu>
-        </el-menu>
-      </el-scrollbar>
-    </el-aside>
-  </div>
-</template>
-
-<script>
-export default {
-
-};
-</script>
-
-<style lang="scss" scpoed>
-.icon-padding {
-  padding-right: 10px;
-}
-.el-aside {
-  background: #07162e;
-  color: #e9eef3;
-  text-align: center;
-  box-sizing: border-box;
-  position: relative;
-  //    鍥哄畾鏍囬
-  .siderbar-title {
-    position: fixed;
-    text-align: center;
-    margin: 0;
-    font-size: 26px;
-    width: 200px;
-    line-height: 66px;
-    top: 0;
-    left: 0;
-    z-index: 999;
-    box-shadow: 0 -5px 5px #0ff inset;
-  }
-  .el-scrollbar {
-    height: calc(100vh - 66px);
-    margin-top: 66px;
-    box-sizing: border-box;
-    .el-menu {
-      background: linear-gradient(#07162e, #0f2b56);
-      border: 0;
-      .firstMenu {
-        background: #07162e;
-        text-align: left;
-        &:hover .fisrtSpan{
-          color: #22d3eb;
-        }
-        span,span {
-          color: #e9eef3;
-        }
-        .el-menu-item {
-          color: #e9eef3;
-          background-color: #07162e;
-          &:hover {
-            color: #22d3eb;
-          }
-        }
-        .is-active {
-          background-color: #07162e;
-          color: #22d3eb;
-        }
-      }
-      .secondMenu{
-        &:hover .secondSpan{
-          color: #22d3eb;
-        }
-      }
-      .thirdMenu{
-        &:hover .thirdSpan{
-          color: #22d3eb;
-        }
-      }
-      .is-active {
-        background-color: #092c4a;
-      }
-    }
-    .el-scrollbar__wrap {
-      overflow-x: hidden;
-    }
-  }
-}
-</style>
\ No newline at end of file
diff --git a/src/views/layout/index.vue b/src/views/layout/index.vue
index 44b4ff0..0fd3103 100644
--- a/src/views/layout/index.vue
+++ b/src/views/layout/index.vue
@@ -1,42 +1,50 @@
 <template>
   <el-container id="body-wrapper">
-    <!-- 渚ц竟瀵艰埅鏍� -->
-    <SiderBar/>
-    <el-container>
-      <!-- 澶撮儴 -->
-      <Header/>
-      <!-- 鍐呭鍖哄煙 -->
-      <Main/>
+    <!-- 澶撮儴 -->
+    <Header />
+    <el-container class="my-el-content">
+      <!-- 渚ц竟瀵艰埅鏍� -->
+      <Menu />
+      <AsideBar />
+      <el-container class="my-el-container">
+        <!-- 鍐呭鍖哄煙 -->
+        <Main />
+      </el-container>
     </el-container>
   </el-container>
 </template>
 
 <script>
 import Main from "./components/Main";
-import NavBar from "./components/NavBar";
-import SiderBar from "./components/SiderBar";
+import Menu from "./components/Menu";
 import Header from "./components/Header";
-
+import AsideBar from "./components/AsideBar"
 export default {
   name: "layout",
   components: {
-    NavBar,
-    SiderBar,
+    Menu,
     Main,
-    Header
+    Header,
+    AsideBar
   },
 };
 </script>
 
 <style lang="scss" scoped>
-#body-wrapper{
+#body-wrapper {
   width: 100vw;
   height: 100vh;
-  display: flex;
-  .el-container{
-    flex-direction: column;
-  }
 }
+
+.my-el-content {
+  margin-top: 60px;
+}
+
+.my-el-container {
+  display: flex;
+  flex-direction: column;
+}
+
 .el-main {
   background-color: #f0f2f5;
   color: #333;
diff --git a/src/views/login/index.vue b/src/views/login/index.vue
index e028946..ee4f317 100644
--- a/src/views/login/index.vue
+++ b/src/views/login/index.vue
@@ -113,6 +113,11 @@
         })
         .then(function (response) {
           if (response.data.code === 200) {
+            // 淇濆瓨token
+            console.log(response);
+            localStorage.setItem('token',response.data.data.token);
+            // 淇濆瓨token
+            localStorage.setItem('tokenHead',response.data.data.tokenHead)
             // 璺宠浆鍒伴椤�
             that.$router.push("/home");
           }else{
@@ -122,7 +127,7 @@
               }
             })
           }
-          console.log(response);
+          // console.log(response);
         })
         .catch(function (error) {
           console.log(error);
diff --git a/src/views/operate/index.vue b/src/views/operate/index.vue
new file mode 100644
index 0000000..2785996
--- /dev/null
+++ b/src/views/operate/index.vue
@@ -0,0 +1,3 @@
+<template>
+    <router-view></router-view>
+</template>
diff --git "a/src/views/\350\277\220\350\220\245\347\256\241\347\220\206/\345\233\276\347\211\207\347\256\241\347\220\206" "b/src/views/operate/\345\233\276\347\211\207\347\256\241\347\220\206"
similarity index 100%
rename from "src/views/\350\277\220\350\220\245\347\256\241\347\220\206/\345\233\276\347\211\207\347\256\241\347\220\206"
rename to "src/views/operate/\345\233\276\347\211\207\347\256\241\347\220\206"
diff --git "a/src/views/\350\277\220\350\220\245\347\256\241\347\220\206/\345\256\241\346\240\270\347\256\241\347\220\206" "b/src/views/operate/\345\256\241\346\240\270\347\256\241\347\220\206"
similarity index 100%
rename from "src/views/\350\277\220\350\220\245\347\256\241\347\220\206/\345\256\241\346\240\270\347\256\241\347\220\206"
rename to "src/views/operate/\345\256\241\346\240\270\347\256\241\347\220\206"
diff --git "a/src/views/\350\277\220\350\220\245\347\256\241\347\220\206/\345\272\227\351\223\272\347\256\241\347\220\206" "b/src/views/operate/\345\272\227\351\223\272\347\256\241\347\220\206"
similarity index 100%
rename from "src/views/\350\277\220\350\220\245\347\256\241\347\220\206/\345\272\227\351\223\272\347\256\241\347\220\206"
rename to "src/views/operate/\345\272\227\351\223\272\347\256\241\347\220\206"
diff --git "a/src/views/\350\277\220\350\220\245\347\256\241\347\220\206/\346\211\247\346\263\225\347\256\241\347\220\206" "b/src/views/operate/\346\211\247\346\263\225\347\256\241\347\220\206"
similarity index 100%
rename from "src/views/\350\277\220\350\220\245\347\256\241\347\220\206/\346\211\247\346\263\225\347\256\241\347\220\206"
rename to "src/views/operate/\346\211\247\346\263\225\347\256\241\347\220\206"
diff --git "a/src/views/\350\277\220\350\220\245\347\256\241\347\220\206/\346\227\245\345\277\227\347\256\241\347\220\206" "b/src/views/operate/\346\227\245\345\277\227\347\256\241\347\220\206"
similarity index 100%
rename from "src/views/\350\277\220\350\220\245\347\256\241\347\220\206/\346\227\245\345\277\227\347\256\241\347\220\206"
rename to "src/views/operate/\346\227\245\345\277\227\347\256\241\347\220\206"
diff --git "a/src/views/\350\277\220\350\220\245\347\256\241\347\220\206/\346\266\210\346\201\257\347\256\241\347\220\206" "b/src/views/operate/\346\266\210\346\201\257\347\256\241\347\220\206"
similarity index 100%
rename from "src/views/\350\277\220\350\220\245\347\256\241\347\220\206/\346\266\210\346\201\257\347\256\241\347\220\206"
rename to "src/views/operate/\346\266\210\346\201\257\347\256\241\347\220\206"
diff --git "a/src/views/\350\277\220\350\220\245\347\256\241\347\220\206/\347\237\255\344\277\241\347\256\241\347\220\206" "b/src/views/operate/\347\237\255\344\277\241\347\256\241\347\220\206"
similarity index 100%
rename from "src/views/\350\277\220\350\220\245\347\256\241\347\220\206/\347\237\255\344\277\241\347\256\241\347\220\206"
rename to "src/views/operate/\347\237\255\344\277\241\347\256\241\347\220\206"
diff --git "a/src/views/\350\277\220\350\220\245\347\256\241\347\220\206/\347\256\227\346\263\225\346\250\241\345\236\213\347\256\241\347\220\206" "b/src/views/operate/\347\256\227\346\263\225\346\250\241\345\236\213\347\256\241\347\220\206"
similarity index 100%
rename from "src/views/\350\277\220\350\220\245\347\256\241\347\220\206/\347\256\227\346\263\225\346\250\241\345\236\213\347\256\241\347\220\206"
rename to "src/views/operate/\347\256\227\346\263\225\346\250\241\345\236\213\347\256\241\347\220\206"
diff --git "a/src/views/\350\277\220\350\220\245\347\256\241\347\220\206/\350\247\206\351\242\221\347\256\241\347\220\206" "b/src/views/operate/\350\247\206\351\242\221\347\256\241\347\220\206"
similarity index 100%
rename from "src/views/\350\277\220\350\220\245\347\256\241\347\220\206/\350\247\206\351\242\221\347\256\241\347\220\206"
rename to "src/views/operate/\350\247\206\351\242\221\347\256\241\347\220\206"
diff --git "a/src/views/\350\277\220\350\220\245\347\256\241\347\220\206/\350\260\203\345\272\246\347\256\241\347\220\206" "b/src/views/operate/\350\260\203\345\272\246\347\256\241\347\220\206"
similarity index 100%
rename from "src/views/\350\277\220\350\220\245\347\256\241\347\220\206/\350\260\203\345\272\246\347\256\241\347\220\206"
rename to "src/views/operate/\350\260\203\345\272\246\347\256\241\347\220\206"
diff --git "a/src/views/\350\277\220\350\220\245\347\256\241\347\220\206/\350\275\246\350\276\206\347\256\241\347\220\206" "b/src/views/operate/\350\275\246\350\276\206\347\256\241\347\220\206"
similarity index 100%
rename from "src/views/\350\277\220\350\220\245\347\256\241\347\220\206/\350\275\246\350\276\206\347\256\241\347\220\206"
rename to "src/views/operate/\350\275\246\350\276\206\347\256\241\347\220\206"
diff --git a/src/views/systemSetting/baseSetting/user/createUser/index.vue b/src/views/systemSetting/baseSetting/user/createUser/index.vue
index c67f1ca..c70b8e7 100644
--- a/src/views/systemSetting/baseSetting/user/createUser/index.vue
+++ b/src/views/systemSetting/baseSetting/user/createUser/index.vue
@@ -10,96 +10,99 @@
         <main>
             <div class="mainTitle">鍩虹淇℃伅</div>
             <div class="mainContent">
-                <el-form ref="form" :model="user">
+                <el-form ref="user" label-width="140px" autoComplete="on" :model="user" :rules="createUserRules"
+                    label-position="right">
                     <!-- 鐢ㄦ埛鍚嶇О -->
-                    <el-form-item class="optionItem">
-                        <div><span style="color: #ff3b6c;">*</span><label>鐢ㄦ埛鍚嶇О:</label></div>
-                        <div><el-input v-model="user.nick_name"></el-input></div>
+                    <el-form-item class="optionItem" label="鐢ㄦ埛鍚嶇О:" prop="nick_name">
+                        <el-input v-model="user.nick_name" placeholder="濉啓鐢ㄦ埛鍚嶇О"></el-input>
                     </el-form-item>
                     <!-- 鐢ㄦ埛瀵嗙爜 -->
-                    <el-form-item class="optionItem">
-                        <div><span style="color: #ff3b6c;">*</span><label>鐢ㄦ埛瀵嗙爜:</label></div>
-                        <div><el-input v-model="user.nick_name"></el-input></div>
+                    <el-form-item class="optionItems" label="鐢ㄦ埛瀵嗙爜:" prop="password">
+                        <el-input v-model="user.password" type="password" placeholder="璇疯緭鍏ョ敤鎴峰瘑鐮�"></el-input>
                     </el-form-item>
                     <!-- 鎵�灞炵敤鎴峰鍚� -->
-                    <el-form-item class="optionItem">
-                        <div><span style="color: #ff3b6c;">*</span><label>鎵�灞炵敤鎴峰鍚�:</label></div>
-                        <div><el-input v-model="user.nick_name"></el-input></div>
+                    <el-form-item class="optionItem" label="鎵�灞炵敤鎴峰鍚�:" prop="true_name">
+                        <el-input v-model="user.true_name" placeholder="璇峰~鍐欑敤鎴峰鍚�"></el-input>
                     </el-form-item>
                     <!-- 鎬у埆 -->
-                    <el-form-item class="optionItem">
-                        <div><span style="color: #ff3b6c;">*</span><label>鎬у埆:</label></div>
+                    <el-form-item class="optionItem" label="鎬у埆:" prop="gender">
                         <el-radio-group v-model="user.gender">
                             <el-radio :label="1">鐢�</el-radio>
                             <el-radio :label="2">濂�</el-radio>
                         </el-radio-group>
                     </el-form-item>
                     <!-- 鏄惁鍏氬憳 -->
-                    <el-form-item class="optionItem">
-                        <div><span style="color: #ff3b6c;">*</span><label>鏄惁鍏氬憳:</label></div>
+                    <el-form-item class="optionItem" label="鏄惁鍏氬憳:" prop="member">
                         <el-radio-group v-model="user.member">
                             <el-radio :label="1">鏄�</el-radio>
                             <el-radio :label="0">鍚�</el-radio>
                         </el-radio-group>
                     </el-form-item>
                     <!-- 鎵�灞炴墜鏈哄彿鐮� -->
-                    <el-form-item class="optionItem">
-                        <div><span style="color: #ff3b6c;">*</span><label>鎵�灞炴墜鏈哄彿鐮�:</label></div>
-                        <el-input v-model="user.phone"></el-input>
+                    <el-form-item class="optionItem" label="鎵�灞炴墜鏈哄彿鐮�:" prop="phone">
+                        <el-input v-model="user.phone" placeholder="璇峰~鍐欐墜鏈哄彿鐮�"></el-input>
                     </el-form-item>
                     <!-- 閭鍦板潃 -->
-                    <el-form-item class="optionItem">
-                        <div><label>閭鍦板潃:</label></div>
-                        <el-input v-model="user.mail"></el-input>
+                    <el-form-item class="optionItem" label="閭鍦板潃:" prop="mail">
+                        <el-input v-model="user.mail" placeholder="璇峰~鍐欓偖绠卞湴鍧�"></el-input>
                     </el-form-item>
                     <!-- 閫夋嫨瑙掕壊 -->
-                    <el-form-item class="optionItem">
-                        <div><span style="color: #ff3b6c;">*</span><label>閫夋嫨瑙掕壊:</label></div>
-                        <el-select v-model="user.role">
+                    <el-form-item class="optionItem" label="閫夋嫨瑙掕壊:" prop="role">
+                        <el-select v-model="user.role" placeholder="璇烽�夋嫨鎵�灞炶鑹�">
                             <el-option v-for="item in roleList" :key="item.name" :label="item.name" :value="item.value"
                                 :disabled="item.disabled">
                             </el-option>
                         </el-select>
                     </el-form-item>
                     <!-- 鐢ㄦ埛绫诲瀷 -->
-                    <el-form-item class="optionItem">
-                        <div><span style="color: #ff3b6c;">*</span><label>鐢ㄦ埛绫诲瀷:</label></div>
-                        <el-select v-model="user.type">
+                    <el-form-item class="optionItem" label="鐢ㄦ埛绫诲瀷:" prop="type">
+                        <el-select v-model="user.type" placeholder="璇烽�夋嫨鐢ㄦ埛绫诲瀷">
                             <el-option v-for="item in typeList" :key="item.name" :label="item.name" :value="item.value"
                                 :disabled="item.disabled">
                             </el-option>
                         </el-select>
                     </el-form-item>
                     <!-- 搴ф満/鍒嗘満 -->
-                    <el-form-item class="optionItem">
-                        <div><label>搴ф満/鍒嗘満:</label></div>
-                        <el-input v-model="user.nick_name"></el-input>
+                    <el-form-item class="optionItem" label="搴ф満/鍒嗘満:" prop="telPhone">
+                        <div class="optionHandleSp">
+                            <el-input class="areaNumber" v-model="user.telPhone.areaNumber" placeholder="鐢佃瘽鍖哄彿">
+                            </el-input>
+                            <el-input class="telNumber" v-model="user.telPhone.phoneNumber" placeholder="鐢佃瘽鍙风爜">
+                            </el-input>
+                            <el-input class="moreNumber" v-model="user.telPhone.moreNumber" placeholder="鍒嗘満鍙风爜">
+                            </el-input>
+                        </div>
                     </el-form-item>
                     <!-- 鎵�灞為儴闂� -->
-                    <el-form-item class="optionItem">
-                        <div><span style="color: #ff3b6c;">*</span><label>鎵�灞為儴闂�:</label></div>
-                        <el-input v-model="user.nick_name"></el-input>
+                    <el-form-item class="optionItem" label="鎵�灞為儴闂�:" prop="department">
+                        <el-select v-model="user.department" placeholder="璇烽�夋嫨鎵�灞為儴闂�">
+                            <el-option v-for="item in typeList" :key="item.name" :label="item.name" :value="item.value"
+                                :disabled="item.disabled">
+                            </el-option>
+                        </el-select>
                     </el-form-item>
                     <!-- 褰撳墠鑱屽姟 -->
-                    <el-form-item class="optionItem">
-                        <div><span style="color: #ff3b6c;">*</span><label>褰撳墠鑱屽姟:</label></div>
-                        <!-- <el-select v-model="value" placeholder="璇烽�夋嫨">
-                            <el-option v-for="item in options" :key="item.value" :label="item.label"
-                                :value="item.value">
+                    <el-form-item class="optionItem" label="褰撳墠鑱屽姟:" prop="work">
+                        <el-select v-model="user.work" placeholder="璇烽�夋嫨褰撳墠鑱屽姟">
+                            <el-option v-for="item in typeList" :key="item.name" :label="item.name" :value="item.value"
+                                :disabled="item.disabled">
                             </el-option>
-                        </el-select> -->
+                        </el-select>
                     </el-form-item>
                     <!-- 濉啓鎵�灞瀖ac鍦板潃 -->
-                    <el-form-item class="optionItem">
-                        <div><label>濉啓鎵�灞瀖ac鍦板潃:</label></div>
-                        <el-input v-model="user.nick_name"></el-input>
+                    <el-form-item class="optionItem" label="濉啓鎵�灞瀖ac鍦板潃:" prop="mac">
+                        <el-input v-model="user.mac" placeholder="璇峰~鍐欐墍灞瀖ac鍦板潃"></el-input>
                     </el-form-item>
                     <!-- 濉啓鎵�灞瀒p鍦板潃 -->
-                    <el-form-item class="optionItem">
-                        <div><label>濉啓鎵�灞瀒p鍦板潃:</label></div>
-                        <el-input v-model="user.nick_name"></el-input>
+                    <el-form-item class="optionItem" label="濉啓鎵�灞瀒p鍦板潃:" prop="ip">
+                        <el-input v-model="user.ip" placeholder="璇峰~鍐欐墍灞瀒p鍦板潃"></el-input>
+                    </el-form-item>
+                    <el-form-item class="optionBtn">
+                        <el-button type="primary" class="btn submit" @click="handleUser">鎻愪氦</el-button>
+                        <el-button class="btn reset">閲嶇疆</el-button>
                     </el-form-item>
                 </el-form>
+
             </div>
         </main>
     </div>
@@ -107,24 +110,172 @@
 <script>
 export default {
     data() {
+        const validateNickname = (rule, value, callback) => {
+            if (!value) {
+                callback(new Error("璇峰~鍐欑敤鎴峰悕绉�"));
+            }
+        };
+        const validatePass = (rule, value, callback) => {
+            if (!value) {
+                callback(new Error("璇峰~鍐欑櫥褰曞瘑鐮�"));
+            } else {
+                const rep = /^\w+$/;
+                if(!rep.test(value)){
+                    callback(new Error("瀵嗙爜鍙兘鏄互鏁板瓧銆�26涓嫳鏂囧瓧姣嶆垨鑰呬笅鍒掔嚎缁勬垚鐨勫瓧绗︿覆"));
+                }
+            }
+        };
+        const validateTruename = (rule, value, callback) => {
+            if (!value) {
+                callback(new Error("璇峰~鍐欑敤鎴峰鍚�"));
+            } else {
+                const rep = /^[\u4E00-\u9FA5]{2,4}$/;
+                if(!rep.test(value)){
+                    callback("璇疯緭鍏ユ纭殑鐢ㄦ埛濮撳悕");
+                }
+            }
+        };
+        const validatePhone = (rule, value, callback) => {
+            if (!value) {
+                callback(new Error("璇峰~鍐欐墜鏈哄彿鐮�"));
+            } else {
+                const rep = /(^1[3|4|5|7|8|9]\d{9}$)|(^09\d{8}$)/
+                if(!rep.test(value)){
+                    callback("璇疯緭鍏ユ纭殑鎵嬫満鍙风爜");
+                }
+            }
+        };
+        const validateMail = (rule, value, callback) => {
+            if (value) {
+                const rep = /^([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+@([a-zA-Z0-9]+[_|\_|\.]?)*[a-zA-Z0-9]+\.[a-zA-Z]{2,3}$/;
+                if(!rep.test(value)){
+                    callback(new Error("璇疯緭鍏ユ纭殑閭"))
+                }
+            }
+        };
+        const validateRole = (rule, value, callback) => {
+            if (!value) {
+                callback(new Error("璇峰~鍐欑櫥褰曞瘑鐮�"));
+            } else {
+                callback();
+            }
+        };
+        const validateType = (rule, value, callback) => {
+            if (!value) {
+                callback(new Error("璇峰~鍐欑櫥褰曞瘑鐮�"));
+            } else {
+                callback();
+            }
+        };
+        const validateDepartment = (rule, value, callback) => {
+            if (!value) {
+                callback(new Error("璇峰~鍐欑櫥褰曞瘑鐮�"));
+            } else {
+                callback();
+            }
+        };
+        const validateWork = (rule, value, callback) => {
+            if (!value) {
+                callback(new Error("璇峰~鍐欑櫥褰曞瘑鐮�"));
+            } else {
+                callback();
+            }
+        };
+        const validateMac = (rule, value, callback) => {
+            if (!value) {
+                callback(new Error("璇峰~鍐欑櫥褰曞瘑鐮�"));
+            } else {
+                callback();
+            }
+        };
+        const validateIp = (rule, value, callback) => {
+            if (!value) {
+                callback(new Error("璇峰~鍐欑櫥褰曞瘑鐮�"));
+            } else {
+                callback();
+            }
+        };
         return {
             user: {
                 nick_name: '',
                 password: '',
                 true_name: '',
                 gender: 1,
-                member: 0,
+                member: 1,
                 phone: '',
                 mail: '',
-                role: 0,
-                type: 0,
+                role: null,
+                type: null,
+                telPhone: {
+                    areaNumber: '',
+                    phoneNumber: "",
+                    moreNumber: "",
+                },
+                department: null,
+                work: null,
+                mac: '',
+                ip: '',
+            },
+            createUserRules: {
+                nick_name: [
+                    { required: true, trigger: "blur", validator: validateNickname },
+                ],
+                password: [
+                    { required: true, trigger: "blur", validator: validatePass },
+                ],
+                true_name: [
+                    { required: true, trigger: "blur", validator: validateTruename },
+                ],
+                gender: [
+                    { required: true, trigger: "blur" },
+                ],
+                member: [
+                    { required: true, trigger: "blur" },
+                ],
+                phone: [
+                    { required: true, trigger: "blur", validator: validatePhone },
+                ],
+                mail: [
+                    { required: false, trigger: "blur", validator: validateMail },
+                ],
+                role: [
+                    { required: true, trigger: "blur", validator: validateRole },
+                ],
+                type: [
+                    { required: true, trigger: "blur", validator: validateType },
+                ],
+                telPhone: [
+                    { required: false, trigger: "blur" },
+                ],
+                department: [
+                    { required: true, trigger: "blur", validator: validateDepartment },
+                ],
+                work: [
+                    { required: true, trigger: "blur", validator: validateWork },
+                ],
+                mac: [
+                    { required: false, trigger: "blur", validator: validateMac },
+                ],
+                ip: [
+                    { required: false, trigger: "blur", validator: validateIp },
+                ],
             },
             roleList: [
-                { name: '璇烽�夋嫨鎵�灞炶鑹�', value: 0, disabled: true }, { name: '瑙掕壊1', value: 1 }, { name: '瑙掕壊2', value: 2 }
+                { name: '瑙掕壊1', value: 1 }, { name: '瑙掕壊2', value: 2 }
             ],
             typeList: [
-                { name: '璇烽�夋嫨鐢ㄦ埛绫诲瀷', value: 0, disabled: true }, { name: '绫诲瀷1', value: 1 }, { name: '绫诲瀷2', value: 2 }
+                { name: '绫诲瀷1', value: 1 }, { name: '绫诲瀷2', value: 2 }
             ]
+        }
+    },
+    created() { 
+        this.$axios.get("http://42.193.1.25:8082/sccg/role/listAll").then(res=>{
+            console.log(res);
+        });
+    },
+    methods: {
+        handleUser() {
+            console.log(this.user);
         }
     },
 }
@@ -132,8 +283,11 @@
 <style lang="scss" scpoed>
 .createUser {
     border-radius: 1px;
+    // min-width: 1024px;
+    // min-height: 1450px;
+    background-color: #fff;
+
     header {
-        background-color: #fff;
         display: flex;
         justify-content: space-between;
         height: 60px;
@@ -143,33 +297,56 @@
             font-weight: 600;
             color: #666;
         }
+
         .headerTip span {
             color: #ff3b6c;
         }
+
         .headerTip label {
             color: #999999;
         }
     }
+
     main {
-        background-color: #fff;
-        margin-top: 1px;
+        border-top: 1px solid #f0f2f5;
         text-align: left;
+        padding: 0 55px;
         .mainTitle {
-            margin-left: 60px;
+            // margin-left: 60px;
             color: #666;
             font-weight: 600;
+            line-height: 100px;
             font-size: 14px;
         }
+
         .mainContent {
-            padding: 0px 100px;
+            display: flex;
+            justify-content: center;
             .el-form-item__content {
-                display: flex;
-                justify-content: center;
-                div{
-                    width: 160px;
-                    text-align: right;
+                width: 400px;
+
+                .el-select {
+                    width: 100%;
                 }
             }
+            .optionHandleSp{
+                display: flex;
+                .areaNumber,.moreNumber{
+                    flex: 1;
+                }
+                .telNumber{
+                    flex: 2;
+                }
+            }
+            .optionBtn{
+                display: flex;
+                justify-content: center;
+                margin-top: 80px;
+                .btn{
+                    padding: 12px 50px;
+                }
+            }
+
         }
     }
 }
diff --git a/src/views/systemSetting/baseSetting/user/userList/index.vue b/src/views/systemSetting/baseSetting/user/userList/index.vue
new file mode 100644
index 0000000..1a3b79f
--- /dev/null
+++ b/src/views/systemSetting/baseSetting/user/userList/index.vue
@@ -0,0 +1,124 @@
+<template>
+    <div class="userList">
+        <header>
+            <div class="headerTitle">鏁版嵁绛涢��</div>
+            <div class="headerContent">
+                <div class="search">
+                    <span>绛涢�夋潯浠�:</span>
+                    <el-input placeholder="璇疯緭鍏ュ唴瀹�"></el-input>
+                </div>
+                <div class="addUser">
+                    <el-button type="primary">娣诲姞鐢ㄦ埛</el-button>
+                </div>
+            </div>
+        </header>
+        <main>
+            <div class="mainTitle">鏁版嵁鍒楄〃</div>
+            <div class="mainContent">
+                <el-table border ref="multipleTable"
+                    :header-cell-style="{background:'#f5f5f5','font-size':'12px',color:'#666666','font-weight':'650','line-height':'45px'}"
+                    :data="tableData" tooltip-effect="dark" style="width: 100%">
+                    <el-table-column type="selection" width="55">
+                    </el-table-column>
+                    <el-table-column label="鐢ㄦ埛ID" width="67">
+                        <template slot-scope="scope">{{ scope.row.id }}</template>
+                    </el-table-column>
+                    <el-table-column prop="name" label="鐢ㄦ埛鍚嶇О" width="82">
+                    </el-table-column>
+                    <el-table-column prop="true_name" label="鎵�灞炲鍚�" width="76">
+                    </el-table-column>
+                    <el-table-column prop="phone" label="鑱旂郴鏂瑰紡" width="81">
+                    </el-table-column>
+                    <el-table-column prop="role" label="鎵�灞炶鑹�" width="87">
+                    </el-table-column>
+                    <el-table-column prop="department" label="鎵�灞為儴闂�" width="80">
+                    </el-table-column>
+                    <el-table-column prop="work" label="鎵�灞炶亴鍔�" width="83">
+                    </el-table-column>
+                    <el-table-column prop="createTime" label="鍒涘缓鏃堕棿" width="128">
+                    </el-table-column>
+                    <el-table-column prop="is_open" label="鍚敤" width="90">
+                        <template slot-scope="scope">
+                            <el-switch v-model="scope.row.is_open" active-color="##0079fe" inactive-color="#ff4949">
+                            </el-switch>
+                        </template>
+                    </el-table-column>
+                    <el-table-column prop="operation" label="鎿嶄綔" width="246">
+                        <template slot-scope="scope">
+                            <el-button size="mini">缂栬緫</el-button>
+                            <el-button size="mini" type="danger">鍒犻櫎</el-button>
+                        </template>
+                    </el-table-column>
+                </el-table>
+            </div>
+        </main>
+    </div>
+</template>
+<script>
+export default {
+    data() {
+        return {
+            tableData: [
+                {
+                    createTime: '2016-05-02',
+                    name: 'admin',
+                    address: '涓婃捣甯傛櫘闄�鍖洪噾娌欐睙璺� 1518 寮�',
+                    role: '瓒呯骇绠$悊鍛�',
+                    is_open: true,
+                }
+            ]
+        }
+    },
+}
+</script>
+<style lang="scss" scoped>
+.userList {
+    text-align: left;
+    margin: 10px 20px;
+
+    header {
+        background-color: #fff;
+
+        .headerTitle {
+            font-weight: 600;
+            padding: 0 20px;
+            color: #666;
+            line-height: 50px;
+            border-bottom: 1px solid #f0f2f5;
+        }
+
+        .headerContent {
+            padding: 0 40px;
+            display: flex;
+            line-height: 100px;
+            justify-content: space-between;
+
+            .search {
+                display: flex;
+                justify-content: flex-start;
+
+                span {
+                    flex: 1;
+                }
+
+                .el-input {
+                    flex: 2;
+                }
+            }
+        }
+    }
+
+    main {
+        background-color: #fff;
+        margin-top: 20px;
+        padding: 0 10px;
+
+        .mainTitle {
+            line-height: 60px;
+        }
+        .el-table{
+            font-size: 10px;
+        }
+    }
+}
+</style>
\ No newline at end of file
diff --git a/src/views/systemSetting/index.vue b/src/views/systemSetting/index.vue
new file mode 100644
index 0000000..2785996
--- /dev/null
+++ b/src/views/systemSetting/index.vue
@@ -0,0 +1,3 @@
+<template>
+    <router-view></router-view>
+</template>
diff --git a/src/views/video/index.vue b/src/views/video/index.vue
index 8cfe998..5cae3c2 100644
--- a/src/views/video/index.vue
+++ b/src/views/video/index.vue
@@ -8,8 +8,5 @@
 }
 </script>
 
-<style>
-div{
-    color: white;
-}
+<style lang="scss" scoped>
 </style>
\ No newline at end of file

--
Gitblit v1.8.0