From 9c385c412cdf6db77e643f32a4fbf50f281f07da Mon Sep 17 00:00:00 2001
From: ColorWhiteDeveloper <2632970487@qq.com>
Date: 星期一, 19 九月 2022 11:25:49 +0800
Subject: [PATCH] 系统设置侧边栏路由搭建
---
src/views/systemSetting/baseSetting/department/index.vue | 124 +++++++++++++++++
src/views/layout/components/AsideBar/index.vue | 11 +
src/views/systemSetting/baseSetting/authority/index.vue | 124 +++++++++++++++++
src/views/layout/components/Header/index.vue | 4
src/router/index.js | 15 ++
src/views/systemSetting/baseSetting/role/index.vue | 116 ++++++++++++++++
6 files changed, 392 insertions(+), 2 deletions(-)
diff --git a/src/router/index.js b/src/router/index.js
index bd70fcf..7d3de8d 100644
--- a/src/router/index.js
+++ b/src/router/index.js
@@ -26,6 +26,21 @@
path: 'userList',
name: 'userList',
component: () => import('@/views/systemSetting/baseSetting/user/userList')
+ },
+ {
+ path:'role',
+ name:'role',
+ component: () => import('@/views/systemSetting/baseSetting/role')
+ },
+ {
+ path:'authority',
+ name:'authority',
+ component: () => import('@/views/systemSetting/baseSetting/authority')
+ },
+ {
+ path:'department',
+ name:'department',
+ component: () => import('@/views/systemSetting/baseSetting/department')
}
]
},
diff --git a/src/views/layout/components/AsideBar/index.vue b/src/views/layout/components/AsideBar/index.vue
index cb972c5..e40732e 100644
--- a/src/views/layout/components/AsideBar/index.vue
+++ b/src/views/layout/components/AsideBar/index.vue
@@ -30,7 +30,16 @@
name: '鐢ㄦ埛绠＄悊', index: '/home/system/userList',
},
{
- name: '鏂板鐢ㄦ埛', index: '/home/system/createUser'
+ name: '鏂板鐢ㄦ埛', index: '/home/system/createUser',
+ },
+ {
+ name:'瑙掕壊绠＄悊', index:'/home/system/role',
+ },
+ {
+ name:'鏉冮檺绠＄悊',index:'/home/system/authority',
+ },
+ {
+ name:'閮ㄩ棬绠＄悊',index:'/home/system/department',
}
]
},
diff --git a/src/views/layout/components/Header/index.vue b/src/views/layout/components/Header/index.vue
index 57e97b0..c2255db 100644
--- a/src/views/layout/components/Header/index.vue
+++ b/src/views/layout/components/Header/index.vue
@@ -60,7 +60,9 @@
},
methods: {
loginout() {
- this.$router.push({ path: "/login" })
+ // 娓呴櫎token
+ localStorage.clear();
+ this.$router.push({ path: "/login" });
},
handleChange(idx){
// 璁剧疆nav婵�娲�
diff --git a/src/views/systemSetting/baseSetting/authority/index.vue b/src/views/systemSetting/baseSetting/authority/index.vue
new file mode 100644
index 0000000..1a3b79f
--- /dev/null
+++ b/src/views/systemSetting/baseSetting/authority/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/baseSetting/department/index.vue b/src/views/systemSetting/baseSetting/department/index.vue
new file mode 100644
index 0000000..1a3b79f
--- /dev/null
+++ b/src/views/systemSetting/baseSetting/department/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/baseSetting/role/index.vue b/src/views/systemSetting/baseSetting/role/index.vue
new file mode 100644
index 0000000..5e9e096
--- /dev/null
+++ b/src/views/systemSetting/baseSetting/role/index.vue
@@ -0,0 +1,116 @@
+<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 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="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" class="operation">
+ <template slot-scope="scope">
+ <span>鏌ョ湅</span>
+ <span>鏉冮檺璁剧疆</span>
+ <span>鍋滅敤</span>
+ </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
--
Gitblit v1.8.0