From 797cc9c1a5c90f413d46c5cb88e1ee5e3a84b071 Mon Sep 17 00:00:00 2001 From: “dzb” <2632970487@qq.com> Date: 星期二, 04 十月 2022 11:51:05 +0800 Subject: [PATCH] 修改用户只能分配单一角色 --- src/views/systemSetting/baseSetting/user/components/main/index.vue | 225 ++++++++++++++++++++++++++++++++++++++++++++++++-------- 1 files changed, 192 insertions(+), 33 deletions(-) diff --git a/src/views/systemSetting/baseSetting/user/components/main/index.vue b/src/views/systemSetting/baseSetting/user/components/main/index.vue index 394c7d4..cdf66b5 100644 --- a/src/views/systemSetting/baseSetting/user/components/main/index.vue +++ b/src/views/systemSetting/baseSetting/user/components/main/index.vue @@ -4,7 +4,8 @@ <!-- 鏁版嵁灞曠ず --> <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"> + :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="4"> @@ -23,6 +24,9 @@ <el-table-column prop="jobTitle" label="鎵�灞炶亴鍔�" min-width="8"> </el-table-column> <el-table-column prop="createTime" label="鍒涘缓鏃堕棿" min-width="10"> + <template slot-scope="scope"> + <span>{{changeTime(scope.row)}}</span> + </template> </el-table-column> <el-table-column prop="status" label="鍚敤" min-width="5"> <template slot-scope="scope"> @@ -52,40 +56,43 @@ :title="updateFlag ? flag.role ? '淇敼鐢ㄦ埛瑙掕壊淇℃伅' : flag.depart ? '淇敼鐢ㄦ埛閮ㄩ棬淇℃伅': '淇敼鐢ㄦ埛瀵嗙爜' :'鏌ョ湅鐢ㄦ埛淇℃伅'" :before-close="handleClose"> <updateUser :updateFlag="updateFlag" :userInfo=userInfo :flag=flag @closeDialog="closeDialog" - :getUserList="getUserList" /> + :getUserList="getUserList" v-if="!flag.password" /> + <MyPwd v-else :userInfo=userInfo @closeDialog="closeDialog"></MyPwd> </el-dialog> <!-- tools --> - <div class="pagination"> + <div class="tools"> + <div class="funs"> + <div class="funsItem"> + <el-checkbox v-model="all" @change="selectAll()">鍏ㄩ��</el-checkbox> + </div> + <div class="funsItem"> + <el-checkbox v-model="unsame" @change="disSame(tableData)">鍙嶉��</el-checkbox> + </div> + <div class="funsItem"> + <el-select v-model="myIdx" placeholder="鎵归噺鎿嶄綔" @change="selectChange"> + <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value" + :disabled="item.disabled"> + </el-option> + </el-select> + </div> + </div> + <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 class="tools"> - <div class="funs"> - <div class="funsItem" > - <el-checkbox v-model="all" @change="selectAll()">鍏ㄩ��</el-checkbox> - </div> - <div class="funsItem" > - <el-checkbox v-model="unsame" @change="disSame(tableData)">鍙嶉��</el-checkbox> - </div> - </div> --> - <!-- <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> --> + </div> </div> </main> </template> <script> import helper from '@/utils/mydate' import updateUser from '../updateUser'; +import MyPwd from '../password' export default { components: { - updateUser + updateUser, MyPwd }, data() { return { @@ -103,20 +110,130 @@ password: false, depart: false, }, - all:false, - unsame:false, + all: false, + unsame: false, + myIdx: 0, + preMyIdx: 0, + options: [ + { + value: 0, + label: '鎵归噺鎿嶄綔', + disabled: true, + }, + { + value: 1, + label: '鎵归噺鍚敤', + }, + { + value: 2, + label: '鎵归噺绂佺敤', + }, + { + value: 3, + label: '鎵归噺鍒犻櫎', + } + ], + tempList: [] } }, created() { this.getUserList(); }, methods: { + async selectChange(list) { + console.log(this.tempList); + if (this.tempList.length !== 0) { + this.preMyIdx = list; + if (list === 3) { + await this.mulDelte(this.tempList); + } else if (list === 2) { + await this.mulUpdateStatus(this.tempList,0); + } else { + await this.mulUpdateStatus(this.tempList,1); + } + this.myIdx = 0; + } else { + this.myIdx = this.preMyIdx; + this.$message({ + type: 'warning', + message: '鎮ㄨ繕娌¢�変腑浠讳綍鏁版嵁', + }) + } + }, + tableChange(list) { + this.tempList = []; + list.forEach(item => { + this.tempList.push(item.id); + }) + if (list.length === this.tableData.length) { + this.all = true; + } else { + this.all = false + } + }, + // 鎵归噺鍒犻櫎鐢ㄦ埛淇℃伅 + mulDelte(idArr) { + console.log(idArr); + this.$confirm("鎮ㄧ‘瀹氳杩涜鎵归噺鍒犻櫎鐢ㄦ埛鍚�?") + .then(_ => { + this.$axios({ + method: 'post', + url: 'sccg/admin/deleteBatch?ids=' + idArr, + }) + .then(res => { + if (res.code === 200) { + this.$message({ + type: 'success', + message: '鍒犻櫎鐢ㄦ埛淇℃伅鎴愬姛', + }) + this.getUserList(); + } else { + this.$message({ + type: 'error', + message: res.message + }) + } + console.log(res); + }) + }) + .catch(err => { console.log(err) }) + }, + // 鎵归噺淇敼璐﹀彿 + mulUpdateStatus(idArr,flag) { + console.log(flag); + this.$confirm( flag === 1 ? "鎮ㄧ‘瀹氳杩涜鎵归噺鍚敤鐢ㄦ埛鍚�?" :'鎮ㄧ‘瀹氳杩涜鎵归噺绂佺敤鐢ㄦ埛鍚�?' ) + .then(_ => { + this.$axios({ + method: 'post', + url: 'sccg/admin/updateStatusBatch?ids=' + idArr + '&status='+flag, + }) + .then(res => { + if (res.code === 200) { + this.$message({ + type: 'success', + message: '鏇存敼鐢ㄦ埛鐘舵�佹垚鍔�', + }) + this.getUserList(); + } else { + this.$message({ + type: 'error', + message: res.message + }) + } + console.log(res); + }) + }) + .catch(err => { console.log(err) }) + }, + changeTime({ createTime }) { + return helper(createTime); + }, selectAll() { this.$refs.multipleTable.toggleAllSelection(); }, - disSame(list){ - console.log(this.$refs.multipleTable); + disSame(list) { + // console.log(this.$refs.multipleTable); // const row = this.$refs.table.data list.forEach(row => { this.$refs.multipleTable.toggleRowSelection(row) @@ -191,12 +308,12 @@ const that = this; const { currentPage, pageSize, search } = this; // 鑾峰彇鎵�鏈夌敤鎴蜂俊鎭�佺敤鎴锋煡璇�(鏆傛椂鏀寔鐢佃瘽鍙风爜) - this.$axios.get(`sccg/admin/list?mobile=${search}¤t=${currentPage}&pageSize=${pageSize}`).then(res => { + this.$axios.get(`sccg/admin/list?keyword=${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; - // }) + 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; @@ -232,6 +349,7 @@ if (this.keyword != '') { this.search = this.keyword; } + this.currentPage = 1; this.getUserList(); this.$emit('resetFresh', { flag: false }) } @@ -255,12 +373,47 @@ .tools { display: flex; justify-content: space-between; + align-items: center; + padding: 0 20px; - // .funs {} + .funs { + display: flex; - - } - .pagination { + .funsItem { + line-height: 28px; + display: flex; + align-items: center; + border: 1px solid #17324c; + border-radius: 4px; + font-size: 12px; + margin-left: 10px; + + .el-checkbox { + 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; + } + } + + } + + .pagination { margin-top: 50px; display: flex; line-height: 50px; @@ -274,8 +427,14 @@ background-color: #071f39; color: #4b9bb7; } + + &::v-deep .active { + background-color: #409eff; + color: #fff; + } } } + } .el-table { color: #4b9bb7; -- Gitblit v1.8.0