From 7c20fd15b7fbc2bd5756b39d5ab655cc849ffcc3 Mon Sep 17 00:00:00 2001 From: zhanghua <314079846@qq.com> Date: 星期三, 16 七月 2025 22:39:23 +0800 Subject: [PATCH] 添加时间筛选 --- src/views/systemSetting/baseSetting/role/index.vue | 278 +++++++++++++++++-------------------------------------- 1 files changed, 85 insertions(+), 193 deletions(-) diff --git a/src/views/systemSetting/baseSetting/role/index.vue b/src/views/systemSetting/baseSetting/role/index.vue index 9edcb79..93d1750 100644 --- a/src/views/systemSetting/baseSetting/role/index.vue +++ b/src/views/systemSetting/baseSetting/role/index.vue @@ -6,14 +6,14 @@ <span>绛涢�夋潯浠�:</span> <el-input placeholder="璇疯緭鍏ュ唴瀹�" v-model="context"></el-input> <div class="findBtn"> - <el-button type="primary" @click="search">鏌ヨ</el-button> + <el-button class="find-Btn" type="primary" @click="search">鏌ヨ</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="handleClose2"> - <createUser :refresh="context==='' ? getUserList : search" /> + <createUser :refresh="context==='' ? getRoleList : search" /> </el-dialog> </div> </div> @@ -21,41 +21,36 @@ <main> <div class="mainContent"> <!-- 鏁版嵁灞曠ず --> - <el-table ref="multipleTable" - :header-cell-style="{background:'#06122c','font-size':'12px',color:'#4b9bb7','font-weight':'650','line-height':'45px'}" + <el-table + border + stripe + ref="multipleTable" + :header-cell-style="{'font-size':'14px','font-weight':'650','line-height':'45px','background':'#F5F5F5',}" :data="tableData" style="width: 100%" :row-class-name="tableRowClassName" @selection-change="tableChange"> <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="name" label="瑙掕壊鍚嶇О" min-width="10"> </el-table-column> - <el-table-column prop="sort" label="瑙掕壊绫诲瀷" min-width="10"> - </el-table-column> - <el-table-column prop="adminCount" label="榛樿瑙掕壊" min-width="10"> + <el-table-column prop="typeText" label="瑙掕壊绫诲瀷" min-width="10"> </el-table-column> <el-table-column prop="description" 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 class="switchStyle" v-model="scope.row.status" + active-color="#3fef9a" inactive-color="#000212" disabled> </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> <span class="line">|</span> - <span @click="handleStop(scope.row)">鍋滅敤</span> + <span @click="handleChangeStatus(scope.row)">{{scope.row.status === true ?'鍋滅敤':'鍚敤' }}</span> <span class="line">|</span> <span @click="handleDelete([scope.row.id])">鍒犻櫎</span> </div> @@ -64,22 +59,22 @@ </el-table> <!-- 淇敼椤甸潰 --> <el-dialog :visible.sync="dialogUpdate" width="45%" :title="updateFlag ? '鏉冮檺璁剧疆' :'鏌ョ湅瑙掕壊淇℃伅'" - v-if="dialogUpdate" :before-close="handleClose"> + v-if="dialogUpdate" > <updateUser :updateFlag="updateFlag" :userInfo=userInfo - :getUserList=" context ? getUserList : getUserList" @changeDialog="changeDialog" /> + :getRoleList=" context ? getRoleList : getRoleList" @changeDialog="changeDialog" /> </el-dialog> <!-- 鏌ョ湅椤甸潰 --> - <el-dialog :visible.sync="dialogView" width="45%" title="鏌ョ湅瑙掕壊淇℃伅" - v-if="dialogView" :before-close="handleClose"> + <el-dialog :visible.sync="dialogView" width="45%" title="鏌ョ湅瑙掕壊淇℃伅" v-if="dialogView" + > <MyView :userInfo=userInfo @changeDialog="changeDialog" /> </el-dialog> <!-- tools --> <div class="tools"> <div class="funs"> - <!-- <div class="funsItem"> + <div class="funsItem funs-sp"> <el-checkbox v-model="all" @change="selectAll()">鍏ㄩ��</el-checkbox> </div> - <div class="funsItem"> + <div class="funsItem funs-sp"> <el-checkbox v-model="unsame" @change="disSame(tableData)">鍙嶉��</el-checkbox> </div> <div class="funsItem"> @@ -88,7 +83,7 @@ :value="item.value" :disabled="item.disabled"> </el-option> </el-select> - </div> --> + </div> </div> <div class="pagination"> <el-pagination background :current-page="currentPage" layout="prev, pager, next" @@ -106,9 +101,10 @@ import updateUser from "./updateUser" import helper from "@/utils/mydate.js" import MyView from './viewRole' +import MyTable from '@/components/Table' export default { components: { - createUser, updateUser,MyView + createUser, updateUser, MyView, MyTable }, data() { return { @@ -116,7 +112,7 @@ context: "", dialogCreate: false, dialogUpdate: false, - dialogView:false, + dialogView: false, updateFlag: false, userInfo: '', totalNum: null, @@ -145,11 +141,11 @@ label: '鎵归噺鍒犻櫎', } ], - tempList: [] + tempList: [], } }, created() { - this.getUserList(); + this.getRoleList(); }, methods: { async selectChange(list) { @@ -185,14 +181,13 @@ type: 'success', message: '鏇存敼鐢ㄦ埛鐘舵�佹垚鍔�', }) - this.getUserList(); + this.getRoleList(); } else { this.$message({ type: 'error', message: res.message }) } - console.log(res); }) }) .catch(err => { console.log(err) }) @@ -232,13 +227,12 @@ .then(res => { this.myIdx = 0; this.preMyIdx = 0; - console.log(res); this.$message({ type: 'success', message: res.message }) - this.getUserList(); + this.getRoleList(); }) }) .catch(_ => { }); @@ -252,23 +246,15 @@ // 淇敼鐢ㄦ埛鐘舵�� handleChangeStatus(obj) { let { id, status } = obj; - status == true ? status = 1 : status = 0; - console.log(id, status); + status == true ? status = 0 : status = 1; this.$axios.post(`/sccg/role/updateStatus/` + id + '?status=' + status).then(res => { - console.log(res); + if (res.code === 200) { + this.search(); + } }) }, - handleStop(obj) { - // let { id, status } = obj; - // status == true ? status = 1 : status = 0; - // console.log(id, status); - // this.$axios.post(`/sccg/role/updateStatus/` + id + '?status=' + status).then(res => { - // this.getUserList(); - // }) - }, // 鑾峰彇鐢ㄦ埛鍒楄〃 - getUserList() { - const that = this; + getRoleList() { this.dialogCreate = false; // 鑾峰彇鎵�鏈夌敤鎴蜂俊鎭� this.$axios.get('sccg/role/listAll').then(res => { @@ -284,7 +270,6 @@ if (context == '') { this.$axios.get('sccg/role/list?keyword=' + '&pageNum=' + currentPage + '&pageSize=' + pageSize).then(res => { if (res.code === 200) { - console.log(res); res.data.list.forEach(item => { // item.createTime = helper(item.createTime); item.status == 1 ? item.status = true : item.status = false; @@ -343,25 +328,26 @@ this.currentPage = page; this.search(); }, - changeDialog({flag}) { + changeDialog({ flag }) { this.dialogUpdate = flag; this.dialogCreate = flag; this.dialogView = flag; }, handleClose(done) { - if(this.updateFlag){ + if (this.updateFlag) { this.$confirm('纭鍏抽棴锛�') - .then(_ => { - this.dialogUpdate = false; - this.dialogCreate = false; - done(); - }) - .catch(_ => { }); - }else{ + .then(_ => { + this.dialogUpdate = false; + this.dialogCreate = false; + this.updateFlag = false; + done(); + }) + .catch(_ => { }); + } else { done(); } }, - handleClose2(done){ + handleClose2(done) { this.$confirm('纭鍏抽棴锛�') .then(_ => { done(); @@ -374,86 +360,76 @@ <style lang="scss" scoped> .userList { text-align: left; - margin: 10px 20px; - color: #4b9bb7; - + padding: 10px 20px; + // color: #4b9bb7; + //height: 100%; + border: 1px solid #ccc; header { - background-color: #09152f; - border: 1pox solid #fff; - + // background-color: #09152f; + // border: 1pox solid #fff; .headerContent { - padding: 0 40px; + padding: 0; 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; - + // color: #1d3f57; &::v-deep .el-input__inner { - background-color: #09152f; - border: 1px solid #17324c; + // 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; + //background-color: #eb5d01; border: none; - border-radius: 20px; + //border-radius: 20px; padding: 12px 30px; } } } - main { - background-color: #09152f; + // background-color: #09152f; margin-top: 20px; padding-bottom: 50px; - border: 1pox solid #fff; - + // border: 1pox solid #fff; .mainTitle { line-height: 60px; } - .tools { display: flex; justify-content: space-between; align-items: center; - padding: 0 20px; - + padding: 0; + .funs-sp{ + // border: 1px solid #17324c; + border: 1px solid #DCDFE6; + background-color: #fff; + } .funs { display: flex; - .funsItem { line-height: 28px; display: flex; align-items: center; - border: 1px solid #17324c; border-radius: 4px; font-size: 12px; margin-left: 10px; @@ -462,138 +438,54 @@ width: 80px; padding: 0 10px; } - .el-select { width: 120px; } - - &::v-deep .el-input__inner { - border: none; - background-color: #09152f; - } - - &:hover { - border: 1px solid #4b9bb7; - } - - &:hover .el-checkbox { - color: #4b9bb7; - } + // &::v-deep .el-input__inner { + // border: none; + // background-color: #09152f; + // } + // &:hover { + // border: 1px solid #4b9bb7; + // } + // &:hover .el-checkbox { + // color: #4b9bb7; + // } } - } - .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; - } - - &::v-deep .active { - background-color: #409eff; - color: #fff; - } + // &::v-deep li, + // &::v-deep .btn-prev, + // &::v-deep .btn-next { + // background-color: #071f39; + // color: #4b9bb7; + // } + // &::v-deep .active { + // background-color: #409eff; + // color: #fff; + // } } } } - .el-table { - color: #4b9bb7; - font-size: 10px; - - &::v-deep .el-table__empty-block { - background-color: #09152f; - } - - &::v-deep .el-table__empty-block { - color: #4b9bb7; - } - + // color: #4b9bb7; + // font-size: 10px; .operation { display: flex; - + color: var(--operation-color); .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 { - 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 +</style> -- Gitblit v1.8.0