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©鏉窞瓒呴┈绉戞妧鏈夐檺鍏徃</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