From 65cf29e0e28e60e8264cd66826aa23d3ae986f37 Mon Sep 17 00:00:00 2001 From: “dzb” <2632970487@qq.com> Date: 星期四, 22 九月 2022 15:52:34 +0800 Subject: [PATCH] 完成部分案件池静态页面 --- src/views/operate/shop/components/updateUser/index.vue | 0 public/index.html | 3 src/views/operate/disposal/casepool/pool/compenents/checkIn/index.vue | 0 src/views/operate/disposal/index.vue | 16 src/views/systemSetting/baseSetting/user/components/main/index.vue | 259 ++++++++ src/views/operate/disposal/casepool/escalation/index.vue | 58 +- src/views/operate/shop/components/main/index.vue | 259 ++++++++ src/views/operate/shop/components/header/index.vue | 101 +++ src/views/operate/shop/index.vue | 91 +++ src/router/index.js | 25 src/views/layout/components/Menu/index.vue | 8 src/views/operate/disposal/casepool/dispatch/index.vue | 62 +- src/views/operate/disposal/casepool/pool/index.vue | 95 +- /dev/null | 0 src/views/systemSetting/baseSetting/user/components/header/index.vue | 101 +++ src/views/operate/shop/components/createUser/index.vue | 8 src/views/operate/disposal/casepool/notDeal/index.vue | 261 +++++++++ src/assets/icons/微信图片_20220922154214.png | 0 src/views/systemSetting/baseSetting/user/components/updateUser/index.vue | 0 public/favicon.ico | 0 src/views/systemSetting/baseSetting/user/components/createUser/index.vue | 8 src/views/systemSetting/baseSetting/user/index.vue | 356 +----------- src/App.vue | 4 23 files changed, 1,245 insertions(+), 470 deletions(-) diff --git a/public/favicon.ico b/public/favicon.ico index df36fcf..367614e 100644 --- a/public/favicon.ico +++ b/public/favicon.ico Binary files differ diff --git a/public/index.html b/public/index.html index 3e5a139..6127cfe 100644 --- a/public/index.html +++ b/public/index.html @@ -5,7 +5,8 @@ <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width,initial-scale=1.0"> <link rel="icon" href="<%= BASE_URL %>favicon.ico"> - <title><%= htmlWebpackPlugin.options.title %></title> + <!-- <title><%= htmlWebpackPlugin.options.title %></title> --> + <title>閬傛槍鎵ф硶骞冲彴</title> </head> <body> <noscript> diff --git a/src/App.vue b/src/App.vue index e5cd210..71c8728 100644 --- a/src/App.vue +++ b/src/App.vue @@ -1,6 +1,6 @@ <template> <div id="app"> - <router-view/> + <router-view /> </div> </template> @@ -11,4 +11,4 @@ export default { }; -</script> +</script> \ No newline at end of file diff --git "a/src/assets/icons/\345\276\256\344\277\241\345\233\276\347\211\207_20220922154214.png" "b/src/assets/icons/\345\276\256\344\277\241\345\233\276\347\211\207_20220922154214.png" new file mode 100644 index 0000000..367614e --- /dev/null +++ "b/src/assets/icons/\345\276\256\344\277\241\345\233\276\347\211\207_20220922154214.png" Binary files differ diff --git a/src/router/index.js b/src/router/index.js index c6f1fe1..7247ac6 100644 --- a/src/router/index.js +++ b/src/router/index.js @@ -67,15 +67,30 @@ { path: 'casepool', name: 'casepool', - component: () => import('@/views/operate/disposal/casepool'), - children: [ + component: () => import('@/views/operate/disposal'), + children:[ + { + path: 'pool', + name: 'pool', + component: () => import('@/views/operate/disposal/casepool/pool'), + }, { path: 'escalation', name: 'escalation', - component: () => import('@/views/operate/disposal/escalation'), - } + component: () => import('@/views/operate/disposal/casepool/escalation'), + }, + { + path: 'dispatch', + name: 'dispatch', + component: () => import('@/views/operate/disposal/casepool/dispatch'), + }, + { + path: 'notDeal', + name: 'notDeal', + component: () => import('@/views/operate/disposal/casepool/notDeal'), + }, ] - } + }, ] }, { diff --git a/src/views/layout/components/Menu/index.vue b/src/views/layout/components/Menu/index.vue index 05c0210..55aa1a5 100644 --- a/src/views/layout/components/Menu/index.vue +++ b/src/views/layout/components/Menu/index.vue @@ -76,11 +76,11 @@ <template slot="title"> <span class="secondSpan">浜嬮」澶勭悊绠$悊</span> </template> - <el-menu-item index="/home/operate/casepool">妗堜欢姹�</el-menu-item> - <el-menu-item index="/home/operate/casepool">涓婃姤绠$悊</el-menu-item> - <el-menu-item index="/home/operate/casepool">璋冨害绠$悊</el-menu-item> + <el-menu-item index="/home/operate/casepool/pool">妗堜欢姹�</el-menu-item> + <el-menu-item index="/home/operate/casepool/escalation">涓婃姤绠$悊</el-menu-item> + <el-menu-item index="/home/operate/casepool/dispatch">璋冨害绠$悊</el-menu-item> <!-- <el-menu-item index="/home/operate/casepool">鍐嶅涔犵鐞�</el-menu-item> --> - <el-menu-item index="/home/operate/casepool">鏆備笉澶勭悊</el-menu-item> + <el-menu-item index="/home/operate/casepool/notDeal">鏆備笉澶勭悊</el-menu-item> </el-submenu> <el-menu-item index="/home/operate/myWait">鎴戠殑寰呭姙</el-menu-item> <el-menu-item index="/home/operate/rectification">涓撻」鏁存不</el-menu-item> diff --git a/src/views/operate/disposal/escalation/index.vue b/src/views/operate/disposal/casepool/dispatch/index.vue similarity index 87% copy from src/views/operate/disposal/escalation/index.vue copy to src/views/operate/disposal/casepool/dispatch/index.vue index b741941..f2ebdf3 100644 --- a/src/views/operate/disposal/escalation/index.vue +++ b/src/views/operate/disposal/casepool/dispatch/index.vue @@ -6,9 +6,9 @@ <span>鏉ユ簮鏌ヨ锛�</span> <el-input placeholder="璇疯緭鍏ラ棶棰樻潵婧�"></el-input> </div> - <div class="add"> + <!-- <div class="add"> <el-button type="primary" icon="el-icon-plus" @click="handleOpenDialog">娣诲姞</el-button> - </div> + </div> --> </header> <!-- 涓讳綋灞曠ず --> <main> @@ -17,8 +17,10 @@ <div class="nav"> <el-tabs type="border-card"> <el-tab-pane :label="item.name" v-for="item in tagList" :key="item.name"> - <!-- 鏁版嵁娓叉煋 --> - <el-table ref="multipleTable" + </el-tab-pane> + </el-tabs> + <!-- 鏁版嵁娓叉煋 --> + <el-table ref="multipleTable" :header-cell-style="{background:'#06122c','font-size':'12px',color:'#4b9bb7','font-weight':'650','line-height':'45px'}" :data="tableData" style="width: 100%" :row-class-name="tableRowClassName"> <el-table-column type="selection" min-width="5"> @@ -45,19 +47,13 @@ <el-table-column prop="operation" label="鎿嶄綔" min-width="15"> <template slot-scope="scope"> <div class="operation"> - <span @click="handleFind(scope.row)">涓婃姤</span> + <span @click="handleFind(scope.row)">璋冨害</span> <span class="line">|</span> - <span @click="handleUpdate(scope.row)">璋冨害</span> - <span class="line">|</span> - <span>鍐嶅涔�</span> - <span class="line">|</span> - <span>鏆備笉澶勭悊</span> + <span @click="handleUpdate(scope.row)">涓婁紶澶勭疆缁撴灉</span> </div> </template> </el-table-column> </el-table> - </el-tab-pane> - </el-tabs> </div> </div> </main> @@ -73,31 +69,31 @@ // import checkIn from './compenents/checkIn'; export default { components: { - checkIn, + // checkIn, }, data() { return { tagList: [ - { - name: '寰呭鐞�', - value: 0, - }, - { - name: '宸蹭笂鎶�', - value: 0, - }, - { - name: '宸茶皟搴�', - value: 0, - }, - { - name: '鍦ㄥ涔�', - value: 0, - }, - { - name: '鏆備笉澶勭悊', - value: 0, - }, + // { + // name: '寰呭鐞�', + // value: 0, + // }, + // { + // name: '宸蹭笂鎶�', + // value: 0, + // }, + // { + // name: '宸茶皟搴�', + // value: 0, + // }, + // { + // name: '鍦ㄥ涔�', + // value: 0, + // }, + // { + // name: '鏆備笉澶勭悊', + // value: 0, + // }, { name: '杩濊', value: 0, diff --git a/src/views/operate/disposal/escalation/index.vue b/src/views/operate/disposal/casepool/escalation/index.vue similarity index 89% rename from src/views/operate/disposal/escalation/index.vue rename to src/views/operate/disposal/casepool/escalation/index.vue index b741941..6915f9b 100644 --- a/src/views/operate/disposal/escalation/index.vue +++ b/src/views/operate/disposal/casepool/escalation/index.vue @@ -6,9 +6,9 @@ <span>鏉ユ簮鏌ヨ锛�</span> <el-input placeholder="璇疯緭鍏ラ棶棰樻潵婧�"></el-input> </div> - <div class="add"> + <!-- <div class="add"> <el-button type="primary" icon="el-icon-plus" @click="handleOpenDialog">娣诲姞</el-button> - </div> + </div> --> </header> <!-- 涓讳綋灞曠ず --> <main> @@ -17,8 +17,10 @@ <div class="nav"> <el-tabs type="border-card"> <el-tab-pane :label="item.name" v-for="item in tagList" :key="item.name"> - <!-- 鏁版嵁娓叉煋 --> - <el-table ref="multipleTable" + </el-tab-pane> + </el-tabs> + <!-- 鏁版嵁娓叉煋 --> + <el-table ref="multipleTable" :header-cell-style="{background:'#06122c','font-size':'12px',color:'#4b9bb7','font-weight':'650','line-height':'45px'}" :data="tableData" style="width: 100%" :row-class-name="tableRowClassName"> <el-table-column type="selection" min-width="5"> @@ -43,7 +45,7 @@ <el-table-column prop="duration" label="鎸佺画鏃堕棿" min-width="6"> </el-table-column> <el-table-column prop="operation" label="鎿嶄綔" min-width="15"> - <template slot-scope="scope"> + <!-- <template slot-scope="scope"> <div class="operation"> <span @click="handleFind(scope.row)">涓婃姤</span> <span class="line">|</span> @@ -53,11 +55,9 @@ <span class="line">|</span> <span>鏆備笉澶勭悊</span> </div> - </template> + </template> --> </el-table-column> </el-table> - </el-tab-pane> - </el-tabs> </div> </div> </main> @@ -73,31 +73,31 @@ // import checkIn from './compenents/checkIn'; export default { components: { - checkIn, + // checkIn, }, data() { return { tagList: [ - { - name: '寰呭鐞�', - value: 0, - }, - { - name: '宸蹭笂鎶�', - value: 0, - }, - { - name: '宸茶皟搴�', - value: 0, - }, - { - name: '鍦ㄥ涔�', - value: 0, - }, - { - name: '鏆備笉澶勭悊', - value: 0, - }, + // { + // name: '寰呭鐞�', + // value: 0, + // }, + // { + // name: '宸蹭笂鎶�', + // value: 0, + // }, + // { + // name: '宸茶皟搴�', + // value: 0, + // }, + // { + // name: '鍦ㄥ涔�', + // value: 0, + // }, + // { + // name: '鏆備笉澶勭悊', + // value: 0, + // }, { name: '杩濊', value: 0, diff --git a/src/views/operate/disposal/casepool/notDeal/index.vue b/src/views/operate/disposal/casepool/notDeal/index.vue new file mode 100644 index 0000000..5209fd5 --- /dev/null +++ b/src/views/operate/disposal/casepool/notDeal/index.vue @@ -0,0 +1,261 @@ +<template> + <div class="casepool"> + <!-- 鏌ヨ娣诲姞 --> + <header> + <div class="search"> + <span>鏉ユ簮鏌ヨ锛�</span> + <el-input placeholder="璇疯緭鍏ラ棶棰樻潵婧�"></el-input> + </div> + <!-- <div class="add"> + <el-button type="primary" icon="el-icon-plus" @click="handleOpenDialog">娣诲姞</el-button> + </div> --> + </header> + <!-- 涓讳綋灞曠ず --> + <main> + <div class="mainContent"> + <!-- 瀵艰埅鐘舵�佹爣绛� --> + <div class="nav"> + <el-tabs type="border-card"> + <el-tab-pane :label="item.name" v-for="item in tagList" :key="item.name"> + </el-tab-pane> + </el-tabs> + <!-- 鏁版嵁娓叉煋 --> + <el-table ref="multipleTable" + :header-cell-style="{background:'#06122c','font-size':'12px',color:'#4b9bb7','font-weight':'650','line-height':'45px'}" + :data="tableData" style="width: 100%" :row-class-name="tableRowClassName"> + <el-table-column type="selection" min-width="5"> + </el-table-column> + <el-table-column label="浜嬩欢缂栧彿" min-width="6"> + <template slot-scope="scope">{{ scope.row.id }}</template> + </el-table-column> + <el-table-column prop="source" label="闂鏉ユ簮" min-width="10"> + </el-table-column> + <el-table-column prop="bigKind" label="澶х被鍚嶇О" min-width="6"> + </el-table-column> + <el-table-column prop="samllKind" label="灏忕被鍚嶇О" min-width="6"> + </el-table-column> + <el-table-column prop="reson" label="妗堢敱" min-width="10"> + </el-table-column> + <el-table-column prop="location" label="鎶ヨ鐐逛綅" min-width="10"> + </el-table-column> + <el-table-column prop="area" label="鎵�灞炲尯鍩�" min-width="10"> + </el-table-column> + <el-table-column prop="appendTime" label="鎶ヨ鏃堕棿" min-width="10"> + </el-table-column> + <el-table-column prop="duration" label="鎸佺画鏃堕棿" min-width="6"> + </el-table-column> + <el-table-column prop="operation" label="鎿嶄綔" min-width="15"> + <template slot-scope="scope"> + <div class="operation"> + <span @click="handleFind(scope.row)">閲嶆柊澶勭疆</span> + </div> + </template> + </el-table-column> + </el-table> + </div> + </div> + </main> + <!-- 缁勪欢鍖� --> + <footer> + <!-- <el-dialog v-if="visible" :visible.async="visible" title="闂鐧昏" width="60%" :before-close="handleClose"> + <checkIn></checkIn> + </el-dialog> --> + </footer> + </div> +</template> +<script> +// import checkIn from './compenents/checkIn'; +export default { + components: { + // checkIn, + }, + data() { + return { + tagList: [ + // { + // name: '寰呭鐞�', + // value: 0, + // }, + // { + // name: '宸蹭笂鎶�', + // value: 0, + // }, + // { + // name: '宸茶皟搴�', + // value: 0, + // }, + // { + // name: '鍦ㄥ涔�', + // value: 0, + // }, + // { + // name: '鏆備笉澶勭悊', + // value: 0, + // }, + { + name: '杩濊', + value: 0, + }, + { + name: '杩濆缓', + value: 0, + }, + ], + tableData: [ + { + id: 13413114, + source: '浜哄伐涓婃姤/瑙嗛宸℃煡', + appendTime: '2022-01-09 14:52' + } + ], + visible: false, + } + }, + methods: { + // 璁剧疆琛ㄦ牸鏂戦┈绾� + tableRowClassName({ row, rowIndex }) { + if ((rowIndex + 1) % 2 == 0) { + return 'warning-row'; + } else { + return 'success-row'; + } + return ''; + }, + // 鎵撳紑娣诲姞椤� + handleOpenDialog() { + this.visible = true; + }, + // 鍏抽棴瀵硅瘽妗� + handleClose(done) { + this.$confirm('纭鍏抽棴锛�') + .then(_ => { + this.visible = false; + done(); + }) + .catch(_ => { }); + } + } +} +</script> +<style lang="scss" scoped> +.casepool { + text-align: left; + color: #4b9bb7; + + header { + display: flex; + justify-content: space-between; + padding: 0 20px; + line-height: 60px; + + .search { + display: flex; + + span { + flex: 2; + } + + .el-input { + flex: 5; + + &::v-deep .el-input__inner { + background-color: #09152f; + border: 1px solid #17324c; + } + } + } + + .add { + .el-button { + background-color: #eb5d01; + border: none; + border-radius: 20px; + } + } + } + + main { + .mainContent { + .nav { + &::v-deep .el-tabs--border-card { + border: none; + } + + &::v-deep .el-tabs--border-card>.el-tabs__content { + background-color: #09152f; + } + + &::v-deep .el-tabs__nav-scroll { + background-color: #09152f; + } + + &::v-deep .el-tabs__header { + line-height: 60px; + } + + &::v-deep .el-tabs--border-card>.el-tabs__header .el-tabs__item { + color: #fff; + } + + &::v-deep .el-tabs--border-card>.el-tabs__header .el-tabs__item.is-active { + color: #4b9bb7; + background-color: #071f39; + border: none; + } + + .el-table { + font-size: 12px; + color: #4b9bb7; + + .line { + padding: 0 5px; + } + } + + &::v-deep .el-table__empty-block { + background-color: #09152f; + color: #4b9bb7; + } + + .el-table::v-deep .warning-row { + background: #06122c; + } + + .el-table::v-deep .success-row { + background: #071f39; + } + } + } + } + + footer { + + &::v-deep .el-dialog__header, + &::v-deep .el-dialog__body { + background-color: #06122c; + } + + &::v-deep .el-dialog__header { + display: flex; + align-items: center; + background-color: #fff; + padding: 20px; + line-height: 60px; + } + + &::v-deep .el-dialog__title { + color: #4b9bb7; + } + + &::v-deep .el-dialog__close { + width: 20px; + height: 20px; + // color: #fff; + } + + &::v-deep .el-dialog__body { + padding: 0; + } + } +} +</style> \ No newline at end of file diff --git a/src/views/operate/disposal/casepool/compenents/checkIn/index.vue b/src/views/operate/disposal/casepool/pool/compenents/checkIn/index.vue similarity index 100% rename from src/views/operate/disposal/casepool/compenents/checkIn/index.vue rename to src/views/operate/disposal/casepool/pool/compenents/checkIn/index.vue diff --git a/src/views/operate/disposal/casepool/index.vue b/src/views/operate/disposal/casepool/pool/index.vue similarity index 63% rename from src/views/operate/disposal/casepool/index.vue rename to src/views/operate/disposal/casepool/pool/index.vue index 0b5e614..880b410 100644 --- a/src/views/operate/disposal/casepool/index.vue +++ b/src/views/operate/disposal/casepool/pool/index.vue @@ -16,48 +16,47 @@ <!-- 瀵艰埅鐘舵�佹爣绛� --> <div class="nav"> <el-tabs type="border-card"> - <el-tab-pane :label="item.name" v-for="item in tagList" :key="item.name"> - <!-- 鏁版嵁娓叉煋 --> - <el-table ref="multipleTable" - :header-cell-style="{background:'#06122c','font-size':'12px',color:'#4b9bb7','font-weight':'650','line-height':'45px'}" - :data="tableData" style="width: 100%" :row-class-name="tableRowClassName"> - <el-table-column type="selection" min-width="5"> - </el-table-column> - <el-table-column label="浜嬩欢缂栧彿" min-width="6"> - <template slot-scope="scope">{{ scope.row.id }}</template> - </el-table-column> - <el-table-column prop="source" label="闂鏉ユ簮" min-width="10"> - </el-table-column> - <el-table-column prop="bigKind" label="澶х被鍚嶇О" min-width="6"> - </el-table-column> - <el-table-column prop="samllKind" label="灏忕被鍚嶇О" min-width="6"> - </el-table-column> - <el-table-column prop="reson" label="妗堢敱" min-width="10"> - </el-table-column> - <el-table-column prop="location" label="鎶ヨ鐐逛綅" min-width="10"> - </el-table-column> - <el-table-column prop="area" label="鎵�灞炲尯鍩�" min-width="10"> - </el-table-column> - <el-table-column prop="appendTime" label="鎶ヨ鏃堕棿" min-width="10"> - </el-table-column> - <el-table-column prop="duration" label="鎸佺画鏃堕棿" min-width="6"> - </el-table-column> - <el-table-column prop="operation" label="鎿嶄綔" min-width="15"> - <template slot-scope="scope"> - <div class="operation"> - <span @click="handleFind(scope.row)">涓婃姤</span> - <span class="line">|</span> - <span @click="handleUpdate(scope.row)">璋冨害</span> - <span class="line">|</span> - <span>鍐嶅涔�</span> - <span class="line">|</span> - <span>鏆備笉澶勭悊</span> - </div> - </template> - </el-table-column> - </el-table> - </el-tab-pane> + <el-tab-pane :label="item.name" v-for="item in tagList" :key="item.name"></el-tab-pane> </el-tabs> + <!-- 鏁版嵁娓叉煋 --> + <el-table ref="multipleTable" + :header-cell-style="{background:'#06122c','font-size':'12px',color:'#4b9bb7','font-weight':'650','line-height':'45px'}" + :data="tableData" style="width: 100%" :row-class-name="tableRowClassName"> + <el-table-column type="selection" min-width="5"> + </el-table-column> + <el-table-column label="浜嬩欢缂栧彿" min-width="6"> + <template slot-scope="scope">{{ scope.row.id }}</template> + </el-table-column> + <el-table-column prop="source" label="闂鏉ユ簮" min-width="10"> + </el-table-column> + <el-table-column prop="bigKind" label="澶х被鍚嶇О" min-width="6"> + </el-table-column> + <el-table-column prop="samllKind" label="灏忕被鍚嶇О" min-width="6"> + </el-table-column> + <el-table-column prop="reson" label="妗堢敱" min-width="10"> + </el-table-column> + <el-table-column prop="location" label="鎶ヨ鐐逛綅" min-width="10"> + </el-table-column> + <el-table-column prop="area" label="鎵�灞炲尯鍩�" min-width="10"> + </el-table-column> + <el-table-column prop="appendTime" label="鎶ヨ鏃堕棿" min-width="10"> + </el-table-column> + <el-table-column prop="duration" label="鎸佺画鏃堕棿" min-width="6"> + </el-table-column> + <el-table-column prop="operation" label="鎿嶄綔" min-width="15"> + <template slot-scope="scope"> + <div class="operation"> + <span @click="handleFind(scope.row)">涓婃姤</span> + <span class="line">|</span> + <span @click="handleUpdate(scope.row)">璋冨害</span> + <span class="line">|</span> + <span>鍐嶅涔�</span> + <span class="line">|</span> + <span>鏆備笉澶勭悊</span> + </div> + </template> + </el-table-column> + </el-table> </div> </div> </main> @@ -133,13 +132,13 @@ }, // 鍏抽棴瀵硅瘽妗� handleClose(done) { - this.$confirm('纭鍏抽棴锛�') - .then(_ => { - this.visible = false; - done(); - }) - .catch(_ => {}); - } + this.$confirm('纭鍏抽棴锛�') + .then(_ => { + this.visible = false; + done(); + }) + .catch(_ => { }); + } } } </script> diff --git a/src/views/operate/disposal/index.vue b/src/views/operate/disposal/index.vue index 75ba792..e3bc8ac 100644 --- a/src/views/operate/disposal/index.vue +++ b/src/views/operate/disposal/index.vue @@ -1,15 +1,3 @@ <template> - <div class="disposal"> - <router-view></router-view> - </div> -</template> -<script> - export default { - data(){ - return{ - - } - } - } -</script> -<style lang="scss" scoped></style> \ No newline at end of file + <router-view></router-view> +</template> \ No newline at end of file diff --git a/src/views/systemSetting/baseSetting/user/createUser/index.vue b/src/views/operate/shop/components/createUser/index.vue similarity index 98% rename from src/views/systemSetting/baseSetting/user/createUser/index.vue rename to src/views/operate/shop/components/createUser/index.vue index 3c36297..833990f 100644 --- a/src/views/systemSetting/baseSetting/user/createUser/index.vue +++ b/src/views/operate/shop/components/createUser/index.vue @@ -280,7 +280,6 @@ methods: { handleUser() { const { user } = this; - console.log(user); this.$axios.post('sccg/admin/register', { departmentId: user.departmentId, email: user.email, @@ -293,12 +292,13 @@ username: user.username, }).then(res => { if (res.code === 200) { - this.refresh(); + console.log(1); + this.$emit('sendDialog',{flag:false}); } }) - } + }, }, - props: ['refresh'] + props: ['sendDialog'] } </script> <style lang="scss" scoped> diff --git a/src/views/operate/shop/components/header/index.vue b/src/views/operate/shop/components/header/index.vue new file mode 100644 index 0000000..67dcb8d --- /dev/null +++ b/src/views/operate/shop/components/header/index.vue @@ -0,0 +1,101 @@ +<template> + <header> + <div class="headerContent"> + <div class="search"> + <span>绛涢�夋潯浠�:</span> + <el-input placeholder="璇疯緭鍏ュ唴瀹�" v-model="search"></el-input> + <div class="findBtn"> + <el-button type="primary" @click="setSearch">鏌ヨ</el-button> + </div> + </div> + <div class="addUser"> + <!-- :before-close="handleClose" --> + <el-button class="addBtn" type="primary" @click="dialogCreate = true">娣诲姞鐢ㄦ埛</el-button> + <el-dialog :visible.sync="dialogCreate" title="鏂板璐︽埛" width="45%" v-if="dialogCreate"> + <createUser @sendDialog="sendDialog" /> + </el-dialog> + </div> + </div> + </header> +</template> +<script> +import createUser from "../createUser"; +export default { + components: { + createUser, + }, + data() { + return { + dialogCreate: false, + search: '', + } + }, + methods: { + setSearch() { + this.$emit('getSearch', { text: this.search }) + }, + sendDialog(flag) { + console.log(flag); + this.dialogCreate = flag.flag; + this.$emit('setDialog', { flag:true }) + } + }, + props: ['setDialog', 'getSearch', 'flag'], +} +</script> +<style lang="scss" scoped> +header { + background-color: #09152f; + border: 1pox solid #fff; + + .headerContent { + padding: 0 40px; + display: flex; + line-height: 100px; + justify-content: space-between; + align-items: center; + + .search { + display: flex; + justify-content: flex-start; + + span { + flex: 1; + } + + .el-input { + flex: 2; + color: #1d3f57; + + &::v-deep .el-input__inner { + background-color: #09152f; + border: 1px solid #17324c; + } + } + + } + + .findBtn { + line-height: 100px; + margin-left: 15px; + display: flex; + align-items: center; + margin-top: -2px; + + .el-button { + padding: 12px 25px; + border-radius: 20px; + } + } + + .addBtn { + background-color: #eb5d01; + border: none; + border-radius: 20px; + padding: 12px 30px; + } + + + } +} +</style> \ No newline at end of file diff --git a/src/views/operate/shop/components/main/index.vue b/src/views/operate/shop/components/main/index.vue new file mode 100644 index 0000000..4ff7c0f --- /dev/null +++ b/src/views/operate/shop/components/main/index.vue @@ -0,0 +1,259 @@ +<template> + <main> + <div class="mainContent"> + <!-- 鏁版嵁灞曠ず --> + <el-table ref="multipleTable" + :header-cell-style="{background:'#06122c','font-size':'12px',color:'#4b9bb7','font-weight':'650','line-height':'45px'}" + :data="tableData" style="width: 100%" :row-class-name="tableRowClassName"> + <el-table-column type="selection" min-width="5"> + </el-table-column> + <el-table-column label="鐢ㄦ埛ID" min-width="5"> + <template slot-scope="scope">{{ scope.row.id }}</template> + </el-table-column> + <el-table-column prop="nickName" label="鐢ㄦ埛鍚嶇О" min-width="10"> + </el-table-column> + <el-table-column prop="username" label="鎵�灞炲鍚�" min-width="10"> + </el-table-column> + <el-table-column prop="mobile" label="鑱旂郴鏂瑰紡" min-width="10"> + </el-table-column> + <el-table-column prop="note" label="鎵�灞炶鑹�" min-width="10"> + </el-table-column> + <el-table-column prop="departName" label="鎵�灞為儴闂�" min-width="10"> + </el-table-column> + <el-table-column prop="jobTitle" label="鎵�灞炶亴鍔�" min-width="10"> + </el-table-column> + <el-table-column prop="createTime" label="鍒涘缓鏃堕棿" min-width="10"> + </el-table-column> + <el-table-column prop="status" label="鍚敤" min-width="5"> + <template slot-scope="scope"> + <el-switch class="switchStyle" v-model="scope.row.status" active-text="寮�" inactive-text="鍏�" + active-color="#3fef9a" inactive-color="#000212" @change="handleChangeStatus(scope.row)"> + </el-switch> + </template> + </el-table-column> + <el-table-column prop="operation" label="鎿嶄綔" min-width="15"> + <template slot-scope="scope"> + <div class="operation"> + <!-- <span @click="handleChangeRole(scope.row)">淇敼瑙掕壊</span> --> + <span @click="handleFind(scope.row)">鏌ョ湅</span> + <span class="line">|</span> + <!-- <span>淇敼瀵嗙爜</span> --> + <!-- <span>鍒犻櫎</span> --> + <span @click="handleUpdate(scope.row)">淇敼閮ㄩ棬</span> + </div> + </template> + </el-table-column> + </el-table> + <!-- 鏌ョ湅淇敼椤甸潰 --> + <el-dialog :visible.sync="dialogUpdate" width="45%" v-if="dialogUpdate" + :title="updateFlag ? '淇敼鐢ㄦ埛閮ㄩ棬淇℃伅' :'鏌ョ湅鐢ㄦ埛淇℃伅'"> + <updateUser :updateFlag="updateFlag" :userInfo=userInfo /> + </el-dialog> + <!-- 鍒嗛〉 --> + <div class="pagination"> + <el-pagination background :current-page="currentPage" layout="prev, pager, next" :total="totalNum" + :page-size="pageSize" @current-change="changeCurrentPage" @prev-click="handlePrev" + @next-click="handleNext"> + </el-pagination> + </div> + </div> + </main> +</template> +<script> +import helper from '@/utils/mydate' +import updateUser from '../updateUser'; +export default { + components: { + updateUser + }, + data() { + return { + tableData: [], + search: "", + dialogUpdate: false, + updateFlag: false, + userInfo: '', + totalNum: 200, + pageSize: 10, + currentPage: 1, + renderFlag: false, + } + }, + created() { + this.getUserList(); + }, + methods: { + // 褰撳墠椤垫敼鍙樿Е鍙戜簨浠� + changeCurrentPage(page) { + this.currentPage = page; + this.getUserList(); + }, + // 涓婁竴椤电偣鍑讳簨浠� + handlePrev(page) { + this.currentPage = page; + this.getUserList(); + }, + // 涓嬩竴椤电偣鍑讳簨浠� + handleNext(page) { + this.currentPage = page; + this.getUserList(); + }, + // 淇敼瑙掕壊 + handleChangeRole(obj) { + this.dialogUpdate = true + this.user = obj; + // console.log(obj) + }, + // 淇敼鐢ㄦ埛鐘舵�� + handleChangeStatus(obj) { + let { id, status } = obj; + status == true ? status = 1 : status = 0; + this.$axios.post(`sccg/admin/updateStatus/` + id + '?status=' + status).then(res => { + console.log(res); + }) + }, + // 鑾峰彇鐢ㄦ埛鍒楄〃 + getUserList() { + const that = this; + const { currentPage, pageSize, search } = this; + // 鑾峰彇鎵�鏈夌敤鎴蜂俊鎭�佺敤鎴锋煡璇�(鏆傛椂鏀寔鐢佃瘽鍙风爜) + this.$axios.get(`sccg/admin/list?mobile=${search}¤t=${currentPage}&pageSize=${pageSize}`).then(res => { + if (res.code === 200) { + res.data.records.forEach(item => { + item.createTime = helper(item.createTime); + item.status == 1 ? item.status = true : item.status = false; + }) + that.totalNum = res.data.pages * pageSize; + that.tableData = res.data.records; + this.renderFlag = true; + } + }) + }, + // 鏌ョ湅鐢ㄦ埛淇℃伅(涓嶅彲淇敼) + handleFind(rowData) { + this.dialogUpdate = true; + this.updateFlag = false; + this.userInfo = rowData; + }, + // 淇敼鐢ㄦ埛閮ㄩ棬淇℃伅 + handleUpdate(rowData) { + this.dialogUpdate = true; + this.updateFlag = true; + this.userInfo = rowData + }, + // 璁剧疆琛ㄦ牸鏂戦┈绾� + tableRowClassName({ row, rowIndex }) { + if ((rowIndex + 1) % 2 == 0) { + return 'warning-row'; + } else { + return 'success-row'; + } + return ''; + }, + }, + props: ['refresh', 'keyword', 'resetFresh'], + watch: { + refresh: { + handler(newValue, oldValue) { + if (newValue == true) { + this.search = ''; + if (this.keyword != '') { + this.search = this.keyword; + } + this.getUserList(); + this.$emit('resetFresh', { flag: false }) + } + }, + immediate: true + } + } +} +</script> +<style lang="scss" scoped> +main { + background-color: #09152f; + margin-top: 20px; + padding-bottom: 50px; + border: 1pox solid #fff; + + .mainTitle { + line-height: 60px; + } + + .pagination { + margin-top: 50px; + display: flex; + line-height: 50px; + justify-content: center; + + .el-pagination { + + &::v-deep li, + &::v-deep .btn-prev, + &::v-deep .btn-next { + background-color: #071f39; + color: #4b9bb7; + } + } + } + + .el-table { + color: #4b9bb7; + font-size: 10px; + + &::v-deep .el-table__empty-block { + background-color: #09152f; + color: #4b9bb7; + } + + .operation { + display: flex; + + .line { + padding: 0 5px; + } + + span:hover { + cursor: pointer; + } + } + } + + .el-table::v-deep .warning-row { + background: #06122c; + } + + .el-table::v-deep .success-row { + background: #071f39; + } + + &::v-deep .switchStyle .el-switch__label { + position: absolute; + display: none; + color: #fff; + } + + &::v-deep .el-switch__core { + background-color: rgba(166, 166, 166, 1); + } + + &::v-deep .switchStyle .el-switch__label--left { + z-index: 9; + left: 20px; + } + + &::v-deep .switchStyle .el-switch__label--right { + z-index: 9; + left: 4px; + } + + &::v-deep .switchStyle .el-switch__label.is-active { + display: block; + } + + &::v-deep .switchStyle.el-switch .el-switch__core, + &::v-deep .el-switch .el-switch__label { + width: 50px !important; + } +} +</style> \ No newline at end of file diff --git a/src/views/systemSetting/baseSetting/user/updateUser/index.vue b/src/views/operate/shop/components/updateUser/index.vue similarity index 100% copy from src/views/systemSetting/baseSetting/user/updateUser/index.vue copy to src/views/operate/shop/components/updateUser/index.vue diff --git a/src/views/operate/shop/index.vue b/src/views/operate/shop/index.vue new file mode 100644 index 0000000..d4cac15 --- /dev/null +++ b/src/views/operate/shop/index.vue @@ -0,0 +1,91 @@ +<template> + <div class="userList"> + <!-- <header> + <div class="headerContent"> + <div class="search"> + <span>绛涢�夋潯浠�:</span> + <el-input placeholder="璇疯緭鍏ュ唴瀹�" v-model="search"></el-input> + <div class="findBtn"> + <el-button type="primary" @click="getUserList">鏌ヨ</el-button> + </div> + </div> + <div class="addUser"> + <el-button class="addBtn" type="primary" @click="dialogCreate = true">娣诲姞鐢ㄦ埛</el-button> + <el-dialog :visible.sync="dialogCreate" title="鏂板璐︽埛" width="45%" v-if="dialogCreate" + :before-close="handleClose1"> + <createUser :refresh="getUserList" /> + </el-dialog> + </div> + </div> + </header> --> + <myHeader @setDialog="changeDialog" @getSearch="getSearch"></myHeader> + <myMain :refresh="isFresh" :keyword="keyword" @resetFresh="resetFresh" /> + </div> +</template> +<script> +import myHeader from "./components/header" +import myMain from "./components/main" +export default { + components: { + myHeader, + myMain + }, + data() { + return { + isFresh: false, + keyword: '', + } + }, + methods: { + // 鑾峰彇鎼滅储杩斿洖缁撴灉 + getSearch({ text }) { + this.keyword = text; + this.isFresh = true; + }, + // 鑾峰彇鍒锋柊缁撴灉 + changeDialog({ flag }) { + console.log(flag); + this.isFresh = flag; + }, + // 閲嶇疆isFresh + resetFresh({ flag }) { + this.isFresh = flag; + console.log(this.isFresh); + } + } +} +</script> +<style lang="scss" scoped> +.userList { + text-align: left; + margin: 10px 20px; + color: #4b9bb7; + + &::v-deep .el-dialog__header, + &::v-deep .el-dialog__body { + background-color: #06122c; + } + + &::v-deep .el-dialog__header { + display: flex; + align-items: center; + background-color: #fff; + padding: 20px; + line-height: 60px; + } + + &::v-deep .el-dialog__title { + color: #4b9bb7; + } + + &::v-deep .el-dialog__close { + width: 20px; + height: 20px; + // color: #fff; + } + + &::v-deep .el-dialog__body { + padding: 0; + } +} +</style> \ No newline at end of file diff --git "a/src/views/operate/\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" deleted file mode 100644 index e69de29..0000000 --- "a/src/views/operate/\345\272\227\351\223\272\347\256\241\347\220\206" +++ /dev/null diff --git a/src/views/systemSetting/baseSetting/user/createUser/index.vue b/src/views/systemSetting/baseSetting/user/components/createUser/index.vue similarity index 98% copy from src/views/systemSetting/baseSetting/user/createUser/index.vue copy to src/views/systemSetting/baseSetting/user/components/createUser/index.vue index 3c36297..833990f 100644 --- a/src/views/systemSetting/baseSetting/user/createUser/index.vue +++ b/src/views/systemSetting/baseSetting/user/components/createUser/index.vue @@ -280,7 +280,6 @@ methods: { handleUser() { const { user } = this; - console.log(user); this.$axios.post('sccg/admin/register', { departmentId: user.departmentId, email: user.email, @@ -293,12 +292,13 @@ username: user.username, }).then(res => { if (res.code === 200) { - this.refresh(); + console.log(1); + this.$emit('sendDialog',{flag:false}); } }) - } + }, }, - props: ['refresh'] + props: ['sendDialog'] } </script> <style lang="scss" scoped> diff --git a/src/views/systemSetting/baseSetting/user/components/header/index.vue b/src/views/systemSetting/baseSetting/user/components/header/index.vue new file mode 100644 index 0000000..67dcb8d --- /dev/null +++ b/src/views/systemSetting/baseSetting/user/components/header/index.vue @@ -0,0 +1,101 @@ +<template> + <header> + <div class="headerContent"> + <div class="search"> + <span>绛涢�夋潯浠�:</span> + <el-input placeholder="璇疯緭鍏ュ唴瀹�" v-model="search"></el-input> + <div class="findBtn"> + <el-button type="primary" @click="setSearch">鏌ヨ</el-button> + </div> + </div> + <div class="addUser"> + <!-- :before-close="handleClose" --> + <el-button class="addBtn" type="primary" @click="dialogCreate = true">娣诲姞鐢ㄦ埛</el-button> + <el-dialog :visible.sync="dialogCreate" title="鏂板璐︽埛" width="45%" v-if="dialogCreate"> + <createUser @sendDialog="sendDialog" /> + </el-dialog> + </div> + </div> + </header> +</template> +<script> +import createUser from "../createUser"; +export default { + components: { + createUser, + }, + data() { + return { + dialogCreate: false, + search: '', + } + }, + methods: { + setSearch() { + this.$emit('getSearch', { text: this.search }) + }, + sendDialog(flag) { + console.log(flag); + this.dialogCreate = flag.flag; + this.$emit('setDialog', { flag:true }) + } + }, + props: ['setDialog', 'getSearch', 'flag'], +} +</script> +<style lang="scss" scoped> +header { + background-color: #09152f; + border: 1pox solid #fff; + + .headerContent { + padding: 0 40px; + display: flex; + line-height: 100px; + justify-content: space-between; + align-items: center; + + .search { + display: flex; + justify-content: flex-start; + + span { + flex: 1; + } + + .el-input { + flex: 2; + color: #1d3f57; + + &::v-deep .el-input__inner { + background-color: #09152f; + border: 1px solid #17324c; + } + } + + } + + .findBtn { + line-height: 100px; + margin-left: 15px; + display: flex; + align-items: center; + margin-top: -2px; + + .el-button { + padding: 12px 25px; + border-radius: 20px; + } + } + + .addBtn { + background-color: #eb5d01; + border: none; + border-radius: 20px; + padding: 12px 30px; + } + + + } +} +</style> \ No newline at end of file diff --git a/src/views/systemSetting/baseSetting/user/components/main/index.vue b/src/views/systemSetting/baseSetting/user/components/main/index.vue new file mode 100644 index 0000000..4ff7c0f --- /dev/null +++ b/src/views/systemSetting/baseSetting/user/components/main/index.vue @@ -0,0 +1,259 @@ +<template> + <main> + <div class="mainContent"> + <!-- 鏁版嵁灞曠ず --> + <el-table ref="multipleTable" + :header-cell-style="{background:'#06122c','font-size':'12px',color:'#4b9bb7','font-weight':'650','line-height':'45px'}" + :data="tableData" style="width: 100%" :row-class-name="tableRowClassName"> + <el-table-column type="selection" min-width="5"> + </el-table-column> + <el-table-column label="鐢ㄦ埛ID" min-width="5"> + <template slot-scope="scope">{{ scope.row.id }}</template> + </el-table-column> + <el-table-column prop="nickName" label="鐢ㄦ埛鍚嶇О" min-width="10"> + </el-table-column> + <el-table-column prop="username" label="鎵�灞炲鍚�" min-width="10"> + </el-table-column> + <el-table-column prop="mobile" label="鑱旂郴鏂瑰紡" min-width="10"> + </el-table-column> + <el-table-column prop="note" label="鎵�灞炶鑹�" min-width="10"> + </el-table-column> + <el-table-column prop="departName" label="鎵�灞為儴闂�" min-width="10"> + </el-table-column> + <el-table-column prop="jobTitle" label="鎵�灞炶亴鍔�" min-width="10"> + </el-table-column> + <el-table-column prop="createTime" label="鍒涘缓鏃堕棿" min-width="10"> + </el-table-column> + <el-table-column prop="status" label="鍚敤" min-width="5"> + <template slot-scope="scope"> + <el-switch class="switchStyle" v-model="scope.row.status" active-text="寮�" inactive-text="鍏�" + active-color="#3fef9a" inactive-color="#000212" @change="handleChangeStatus(scope.row)"> + </el-switch> + </template> + </el-table-column> + <el-table-column prop="operation" label="鎿嶄綔" min-width="15"> + <template slot-scope="scope"> + <div class="operation"> + <!-- <span @click="handleChangeRole(scope.row)">淇敼瑙掕壊</span> --> + <span @click="handleFind(scope.row)">鏌ョ湅</span> + <span class="line">|</span> + <!-- <span>淇敼瀵嗙爜</span> --> + <!-- <span>鍒犻櫎</span> --> + <span @click="handleUpdate(scope.row)">淇敼閮ㄩ棬</span> + </div> + </template> + </el-table-column> + </el-table> + <!-- 鏌ョ湅淇敼椤甸潰 --> + <el-dialog :visible.sync="dialogUpdate" width="45%" v-if="dialogUpdate" + :title="updateFlag ? '淇敼鐢ㄦ埛閮ㄩ棬淇℃伅' :'鏌ョ湅鐢ㄦ埛淇℃伅'"> + <updateUser :updateFlag="updateFlag" :userInfo=userInfo /> + </el-dialog> + <!-- 鍒嗛〉 --> + <div class="pagination"> + <el-pagination background :current-page="currentPage" layout="prev, pager, next" :total="totalNum" + :page-size="pageSize" @current-change="changeCurrentPage" @prev-click="handlePrev" + @next-click="handleNext"> + </el-pagination> + </div> + </div> + </main> +</template> +<script> +import helper from '@/utils/mydate' +import updateUser from '../updateUser'; +export default { + components: { + updateUser + }, + data() { + return { + tableData: [], + search: "", + dialogUpdate: false, + updateFlag: false, + userInfo: '', + totalNum: 200, + pageSize: 10, + currentPage: 1, + renderFlag: false, + } + }, + created() { + this.getUserList(); + }, + methods: { + // 褰撳墠椤垫敼鍙樿Е鍙戜簨浠� + changeCurrentPage(page) { + this.currentPage = page; + this.getUserList(); + }, + // 涓婁竴椤电偣鍑讳簨浠� + handlePrev(page) { + this.currentPage = page; + this.getUserList(); + }, + // 涓嬩竴椤电偣鍑讳簨浠� + handleNext(page) { + this.currentPage = page; + this.getUserList(); + }, + // 淇敼瑙掕壊 + handleChangeRole(obj) { + this.dialogUpdate = true + this.user = obj; + // console.log(obj) + }, + // 淇敼鐢ㄦ埛鐘舵�� + handleChangeStatus(obj) { + let { id, status } = obj; + status == true ? status = 1 : status = 0; + this.$axios.post(`sccg/admin/updateStatus/` + id + '?status=' + status).then(res => { + console.log(res); + }) + }, + // 鑾峰彇鐢ㄦ埛鍒楄〃 + getUserList() { + const that = this; + const { currentPage, pageSize, search } = this; + // 鑾峰彇鎵�鏈夌敤鎴蜂俊鎭�佺敤鎴锋煡璇�(鏆傛椂鏀寔鐢佃瘽鍙风爜) + this.$axios.get(`sccg/admin/list?mobile=${search}¤t=${currentPage}&pageSize=${pageSize}`).then(res => { + if (res.code === 200) { + res.data.records.forEach(item => { + item.createTime = helper(item.createTime); + item.status == 1 ? item.status = true : item.status = false; + }) + that.totalNum = res.data.pages * pageSize; + that.tableData = res.data.records; + this.renderFlag = true; + } + }) + }, + // 鏌ョ湅鐢ㄦ埛淇℃伅(涓嶅彲淇敼) + handleFind(rowData) { + this.dialogUpdate = true; + this.updateFlag = false; + this.userInfo = rowData; + }, + // 淇敼鐢ㄦ埛閮ㄩ棬淇℃伅 + handleUpdate(rowData) { + this.dialogUpdate = true; + this.updateFlag = true; + this.userInfo = rowData + }, + // 璁剧疆琛ㄦ牸鏂戦┈绾� + tableRowClassName({ row, rowIndex }) { + if ((rowIndex + 1) % 2 == 0) { + return 'warning-row'; + } else { + return 'success-row'; + } + return ''; + }, + }, + props: ['refresh', 'keyword', 'resetFresh'], + watch: { + refresh: { + handler(newValue, oldValue) { + if (newValue == true) { + this.search = ''; + if (this.keyword != '') { + this.search = this.keyword; + } + this.getUserList(); + this.$emit('resetFresh', { flag: false }) + } + }, + immediate: true + } + } +} +</script> +<style lang="scss" scoped> +main { + background-color: #09152f; + margin-top: 20px; + padding-bottom: 50px; + border: 1pox solid #fff; + + .mainTitle { + line-height: 60px; + } + + .pagination { + margin-top: 50px; + display: flex; + line-height: 50px; + justify-content: center; + + .el-pagination { + + &::v-deep li, + &::v-deep .btn-prev, + &::v-deep .btn-next { + background-color: #071f39; + color: #4b9bb7; + } + } + } + + .el-table { + color: #4b9bb7; + font-size: 10px; + + &::v-deep .el-table__empty-block { + background-color: #09152f; + color: #4b9bb7; + } + + .operation { + display: flex; + + .line { + padding: 0 5px; + } + + span:hover { + cursor: pointer; + } + } + } + + .el-table::v-deep .warning-row { + background: #06122c; + } + + .el-table::v-deep .success-row { + background: #071f39; + } + + &::v-deep .switchStyle .el-switch__label { + position: absolute; + display: none; + color: #fff; + } + + &::v-deep .el-switch__core { + background-color: rgba(166, 166, 166, 1); + } + + &::v-deep .switchStyle .el-switch__label--left { + z-index: 9; + left: 20px; + } + + &::v-deep .switchStyle .el-switch__label--right { + z-index: 9; + left: 4px; + } + + &::v-deep .switchStyle .el-switch__label.is-active { + display: block; + } + + &::v-deep .switchStyle.el-switch .el-switch__core, + &::v-deep .el-switch .el-switch__label { + width: 50px !important; + } +} +</style> \ No newline at end of file diff --git a/src/views/systemSetting/baseSetting/user/updateUser/index.vue b/src/views/systemSetting/baseSetting/user/components/updateUser/index.vue similarity index 100% rename from src/views/systemSetting/baseSetting/user/updateUser/index.vue rename to src/views/systemSetting/baseSetting/user/components/updateUser/index.vue diff --git a/src/views/systemSetting/baseSetting/user/index.vue b/src/views/systemSetting/baseSetting/user/index.vue index 6660c22..d4cac15 100644 --- a/src/views/systemSetting/baseSetting/user/index.vue +++ b/src/views/systemSetting/baseSetting/user/index.vue @@ -1,6 +1,6 @@ <template> <div class="userList"> - <header> + <!-- <header> <div class="headerContent"> <div class="search"> <span>绛涢�夋潯浠�:</span> @@ -17,205 +17,41 @@ </el-dialog> </div> </div> - </header> - <main> - <div class="mainContent"> - <!-- 鏁版嵁灞曠ず --> - <el-table ref="multipleTable" - :header-cell-style="{background:'#06122c','font-size':'12px',color:'#4b9bb7','font-weight':'650','line-height':'45px'}" - :data="tableData" style="width: 100%" :row-class-name="tableRowClassName"> - <el-table-column type="selection" min-width="5"> - </el-table-column> - <el-table-column label="鐢ㄦ埛ID" min-width="5"> - <template slot-scope="scope">{{ scope.row.id }}</template> - </el-table-column> - <el-table-column prop="nickName" label="鐢ㄦ埛鍚嶇О" min-width="10"> - </el-table-column> - <el-table-column prop="username" label="鎵�灞炲鍚�" min-width="10"> - </el-table-column> - <el-table-column prop="mobile" label="鑱旂郴鏂瑰紡" min-width="10"> - </el-table-column> - <el-table-column prop="note" label="鎵�灞炶鑹�" min-width="10"> - </el-table-column> - <el-table-column prop="departName" label="鎵�灞為儴闂�" min-width="10"> - </el-table-column> - <el-table-column prop="jobTitle" label="鎵�灞炶亴鍔�" min-width="10"> - </el-table-column> - <el-table-column prop="createTime" label="鍒涘缓鏃堕棿" min-width="10"> - </el-table-column> - <el-table-column prop="status" label="鍚敤" min-width="5"> - <template slot-scope="scope"> - <el-switch class="switchStyle" v-model="scope.row.status" active-text="寮�" inactive-text="鍏�" - active-color="#3fef9a" inactive-color="#000212" @change="handleChangeStatus(scope.row)"> - </el-switch> - </template> - </el-table-column> - <el-table-column prop="operation" label="鎿嶄綔" min-width="15"> - <template slot-scope="scope"> - <div class="operation"> - <!-- <span @click="handleChangeRole(scope.row)">淇敼瑙掕壊</span> --> - <span @click="handleFind(scope.row)">鏌ョ湅</span> - <span class="line">|</span> - <!-- <span>淇敼瀵嗙爜</span> --> - <!-- <span>鍒犻櫎</span> --> - <span @click="handleUpdate(scope.row)">淇敼閮ㄩ棬</span> - </div> - </template> - </el-table-column> - </el-table> - <!-- 鏌ョ湅淇敼椤甸潰 --> - <el-dialog :visible.sync="dialogUpdate" width="45%" v-if="dialogUpdate" - :before-close="handleClose2" :title="updateFlag ? '淇敼鐢ㄦ埛閮ㄩ棬淇℃伅' :'鏌ョ湅鐢ㄦ埛淇℃伅'"> - <updateUser :updateFlag="updateFlag" :userInfo=userInfo /> - </el-dialog> - <!-- 鍒嗛〉 --> - <div class="pagination"> - <el-pagination background :current-page="currentPage" layout="prev, pager, next" :total="totalNum" - :page-size="pageSize" @current-change="changeCurrentPage" @prev-click="handlePrev" - @next-click="handleNext"> - </el-pagination> - </div> - </div> - </main> + </header> --> + <myHeader @setDialog="changeDialog" @getSearch="getSearch"></myHeader> + <myMain :refresh="isFresh" :keyword="keyword" @resetFresh="resetFresh" /> </div> </template> <script> -import createUser from "./createUser" -import updateUser from "./updateUser" -import helper from "@/utils/mydate.js" +import myHeader from "./components/header" +import myMain from "./components/main" export default { components: { - createUser, updateUser + myHeader, + myMain }, data() { return { - tableData: [], - search: "", - dialogCreate: false, - dialogUpdate: false, - updateFlag: false, - userInfo: '', - totalNum: 200, - pageSize: 10, - currentPage: 1, + isFresh: false, + keyword: '', } - }, - created() { - this.getUserList(); }, methods: { - // 淇敼瑙掕壊 - handleChangeRole(obj) { - this.dialogUpdate = true - this.user = obj; - // console.log(obj) + // 鑾峰彇鎼滅储杩斿洖缁撴灉 + getSearch({ text }) { + this.keyword = text; + this.isFresh = true; }, - // 淇敼鐢ㄦ埛鐘舵�� - handleChangeStatus(obj) { - let { id, status } = obj; - status == true ? status = 1 : status = 0; - console.log(id, status); - this.$axios.post(`sccg/admin/updateStatus/` + id + '?status=' + status).then(res => { - console.log(res); - }) + // 鑾峰彇鍒锋柊缁撴灉 + changeDialog({ flag }) { + console.log(flag); + this.isFresh = flag; }, - // 鑾峰彇鐢ㄦ埛鍒楄〃 - getUserList() { - const that = this; - const { currentPage, pageSize, search } = this; - this.dialogCreate = false; - // 鑾峰彇鎵�鏈夌敤鎴蜂俊鎭�佺敤鎴锋煡璇�(鏆傛椂鏀寔鐢佃瘽鍙风爜) - this.$axios.get(`sccg/admin/list?mobile=${search}¤t=${currentPage}&pageSize=${pageSize}`).then(res => { - if (res.code === 200) { - res.data.records.forEach(item => { - item.createTime = helper(item.createTime); - item.status == 1 ? item.status = true : item.status = false; - }) - that.totalNum = res.data.pages * pageSize; - that.tableData = res.data.records; - } - }) - }, - // 璁剧疆琛ㄦ牸鏂戦┈绾� - tableRowClassName({ row, rowIndex }) { - if ((rowIndex + 1) % 2 == 0) { - return 'warning-row'; - } else { - return 'success-row'; - } - return ''; - }, - // 鏌ョ湅鐢ㄦ埛淇℃伅(涓嶅彲淇敼) - handleFind(rowData) { - this.dialogUpdate = true; - this.updateFlag = false; - this.userInfo = rowData; - }, - // 淇敼鐢ㄦ埛閮ㄩ棬淇℃伅 - handleUpdate(rowData) { - this.dialogUpdate = true; - this.updateFlag = true; - this.userInfo = rowData - }, - // 褰撳墠椤垫敼鍙樿Е鍙戜簨浠� - changeCurrentPage(page) { - this.currentPage = page; - this.getUserList(); - }, - // 涓婁竴椤电偣鍑讳簨浠� - handlePrev(page) { - this.currentPage = page; - this.getUserList(); - }, - // 涓嬩竴椤电偣鍑讳簨浠� - handleNext(page) { - this.currentPage = page; - this.getUserList(); - }, - // 鍒涘缓寮圭獥鍏抽棴 - handleClose1(done) { - const that = this; - this.$confirm('纭鍏抽棴锛�') - .then(_ => { - that.dialogCreate = false; - done(); - }) - .catch(_ => { }); - }, - // 鏌ョ湅寮圭獥鍏抽棴 - handleClose2(done) { - const that = this; - this.$confirm('纭鍏抽棴锛�') - .then(_ => { - this.dialogUpdate = false; - done(); - }) - .catch(_ => { }); + // 閲嶇疆isFresh + resetFresh({ flag }) { + this.isFresh = flag; + console.log(this.isFresh); } - // 鐢ㄦ埛鏌ヨ(鏆傛椂鏀寔鐢佃瘽鍙风爜) - // handlePhone() { - // const { search, getUserList } = this; - // if (search == '') { - // getUserList(); - // return; - // } - // this.handlePhoneSearch(search); - // }, - // handlePhoneSearch(search){ - // this.dialogCreate = false; - // const that = this; - // // 鑾峰彇鎵嬫満鍙风敤鎴蜂俊鎭� - // this.$axios.get(`sccg/admin/list?mobile=${search}`).then(res => { - // if (res.code === 200) { - // res.data.records.forEach(item => { - // item.createTime = helper(item.createTime); - // item.status == 1 ? item.status = true : item.status = false; - // }) - // that.totalNum = res.data.records.length; - // that.tableData = res.data.records.slice((that.currentPage - 1) * that.pageSize, that.currentPage * that.pageSize) - // } - // }) - // } } } </script> @@ -225,162 +61,30 @@ margin: 10px 20px; color: #4b9bb7; - header { - background-color: #09152f; - border: 1pox solid #fff; - - .headerContent { - padding: 0 40px; - display: flex; - line-height: 100px; - justify-content: space-between; - align-items: center; - - .search { - display: flex; - justify-content: flex-start; - - span { - flex: 1; - } - - .el-input { - flex: 2; - color: #1d3f57; - - &::v-deep .el-input__inner { - background-color: #09152f; - border: 1px solid #17324c; - } - } - - } - - .findBtn { - line-height: 100px; - margin-left: 15px; - display: flex; - align-items: center; - margin-top: -2px; - - .el-button { - padding: 12px 25px; - border-radius: 20px; - } - } - - .addBtn { - background-color: #eb5d01; - border: none; - border-radius: 20px; - padding: 12px 30px; - } - } - } - - main { - background-color: #09152f; - margin-top: 20px; - padding-bottom: 50px; - border: 1pox solid #fff; - - .mainTitle { - line-height: 60px; - } - - .pagination { - margin-top: 50px; - display: flex; - line-height: 50px; - justify-content: center; - - &::v-deep li, - &::v-deep .btn-prev, - &::v-deep .btn-next { - background-color: #071f39; - color: #4b9bb7; - } - } - - .el-table { - color: #4b9bb7; - font-size: 10px; - - &::v-deep .el-table__empty-block { - background-color: #09152f; - color: #4b9bb7; - } - .operation { - display: flex; - - .line { - padding: 0 5px; - } - - span:hover { - cursor: pointer; - } - } - } - - .el-table::v-deep .warning-row { - background: #06122c; - } - - .el-table::v-deep .success-row { - background: #071f39; - } - - &::v-deep .switchStyle .el-switch__label { - position: absolute; - display: none; - color: #fff; - } - - &::v-deep .el-switch__core { - background-color: rgba(166, 166, 166, 1); - } - - &::v-deep .switchStyle .el-switch__label--left { - z-index: 9; - left: 20px; - } - - &::v-deep .switchStyle .el-switch__label--right { - z-index: 9; - left: 4px; - } - - &::v-deep .switchStyle .el-switch__label.is-active { - display: block; - } - - &::v-deep .switchStyle.el-switch .el-switch__core, - &::v-deep .el-switch .el-switch__label { - width: 50px !important; - } - } - &::v-deep .el-dialog__header, &::v-deep .el-dialog__body { background-color: #06122c; } - &::v-deep .el-dialog__header{ + + &::v-deep .el-dialog__header { display: flex; align-items: center; background-color: #fff; padding: 20px; line-height: 60px; } - &::v-deep .el-dialog__title{ + + &::v-deep .el-dialog__title { color: #4b9bb7; } - &::v-deep .el-dialog__close{ + + &::v-deep .el-dialog__close { width: 20px; height: 20px; // color: #fff; } - &::v-deep .el-dialog__body{ + + &::v-deep .el-dialog__body { padding: 0; } } -- Gitblit v1.8.0