From 9ff66017debadfc89bc0c1b796684a4d1dbe2bc3 Mon Sep 17 00:00:00 2001 From: fangyuan <527392886@qq.com> Date: 星期五, 16 十二月 2022 10:00:02 +0800 Subject: [PATCH] 已上报到市批量操作按钮隐藏 --- src/views/systemSetting/device/grid/components/main/index.vue | 335 ++++++++++++++++++------------------------------------- 1 files changed, 109 insertions(+), 226 deletions(-) diff --git a/src/views/systemSetting/device/grid/components/main/index.vue b/src/views/systemSetting/device/grid/components/main/index.vue index 9f53242..0ee4496 100644 --- a/src/views/systemSetting/device/grid/components/main/index.vue +++ b/src/views/systemSetting/device/grid/components/main/index.vue @@ -1,106 +1,85 @@ <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" - @selection-change="tableChange"> - <el-table-column type="selection" min-width="5"> - </el-table-column> - <el-table-column label="鐢ㄦ埛ID" min-width="6"> - <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="8"> - </el-table-column> - <el-table-column prop="mobile" label="鑱旂郴鏂瑰紡" min-width="7"> - </el-table-column> - <el-table-column prop="note" label="鎵�灞炶鑹�" min-width="8"> - <template slot-scope="scope"> - <span>{{filterRole(scope.row.roles)}}</span> - </template> - </el-table-column> - <!-- <el-table-column prop="departName" label="鎵�灞為儴闂�" min-width="8"> - </el-table-column> --> - <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"> - <!-- @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="20"> - <!-- <template slot-scope="scope"> - <div class="operation"> - <span @click="handleChangeRole(scope.row,'role')">淇敼瑙掕壊</span> - <span class="line">|</span> - <span @click="handleFind(scope.row)">鏌ョ湅</span> - <span class="line">|</span> - <span @click="handleChangeRole(scope.row,'password')">淇敼瀵嗙爜</span> - <span class="line">|</span> - <span @click="handleDelete(scope.row)">鍒犻櫎</span> - <span class="line">|</span> - <span @click="handleChangeRole(scope.row,'depart')">淇敼閮ㄩ棬</span> - </div> - </template> --> - </el-table-column> - </el-table> - <!-- 鏌ョ湅椤甸潰 --> - <el-dialog :visible.sync="dialogView" width="45%" v-if="dialogView" - title="鏌ョ湅鐢ㄦ埛淇℃伅"> - <MyView :userInfo=userInfo></MyView> - </el-dialog> - <!-- 淇敼椤甸潰 --> - <el-dialog :visible.sync="dialogUpdate" width="45%" v-if="dialogUpdate" - :title="updateFlag ? flag.role ? '淇敼鐢ㄦ埛瑙掕壊淇℃伅' : flag.depart ? '淇敼鐢ㄦ埛閮ㄩ棬淇℃伅': '淇敼鐢ㄦ埛瀵嗙爜' :''" - :before-close="handleClose"> - <updateUser :updateFlag="updateFlag" :userInfo=userInfo :flag=flag @closeDialog="closeDialog" - :getUserList="getUserList" v-if="!flag.password" /> - <MyPwd v-else :userInfo=userInfo @closeDialog="closeDialog"></MyPwd> - </el-dialog> - <!-- tools --> - <div class="tools"> - <div class="funs"> - <div class="funsItem funs-sp"> - <el-checkbox v-model="all" @change="selectAll()">鍏ㄩ��</el-checkbox> - </div> - <div class="funsItem funs-sp"> - <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> + <div class="mainContent"> + <!-- <div class="aside"> + <department-aside /> + </div> --> + <div class="grid-content"> + <!-- 鏁版嵁灞曠ず --> + <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" + @selection-change="tableChange"> + <el-table-column type="selection" min-width="5"> + </el-table-column> + <el-table-column label="鐢ㄦ埛ID" min-width="6"> + <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="8"> + </el-table-column> + <el-table-column prop="mobile" label="鑱旂郴鏂瑰紡" min-width="7"> + </el-table-column> + <el-table-column prop="note" label="鎵�灞炶鑹�" min-width="8"> + <template slot-scope="scope"> + <span>{{filterRole(scope.row.roles)}}</span> + </template> + </el-table-column> + <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"> + <!-- @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="20"> + </el-table-column> + </el-table> + <!-- 鏌ョ湅椤甸潰 --> + <el-dialog :visible.sync="dialogView" width="45%" v-if="dialogView" + title="鏌ョ湅鐢ㄦ埛淇℃伅"> + <MyView :userInfo=userInfo></MyView> + </el-dialog> + <!-- 淇敼椤甸潰 --> + <el-dialog :visible.sync="dialogUpdate" width="45%" v-if="dialogUpdate" + :title="updateFlag ? flag.role ? '淇敼鐢ㄦ埛瑙掕壊淇℃伅' : flag.depart ? '淇敼鐢ㄦ埛閮ㄩ棬淇℃伅': '淇敼鐢ㄦ埛瀵嗙爜' :''" + :before-close="handleClose"> + <updateUser :updateFlag="updateFlag" :userInfo=userInfo :flag=flag @closeDialog="closeDialog" + :getUserList="getUserList" v-if="!flag.password" /> + <MyPwd v-else :userInfo=userInfo @closeDialog="closeDialog"></MyPwd> + </el-dialog> + <!-- tools --> + <div class="tools"> + <div class="funs"> + <el-checkbox v-model="all" @change="selectAll()">鍏ㄩ��</el-checkbox> + <el-checkbox v-model="unsame" @change="disSame(tableData)">鍙嶉��</el-checkbox> + <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> + <el-pagination class="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> - </main> + </div> + </div> </template> <script> import helper from '@/utils/mydate' +import departmentAside from "@/views/operate/fivepack/threepack/components/aside"; export default { - components: { - - }, + components: { departmentAside }, data() { return { tableData: [], @@ -149,7 +128,6 @@ }, methods: { async selectChange(list) { - console.log(this.tempList); if (this.tempList.length !== 0) { this.preMyIdx = list; if (list === 3) { @@ -173,15 +151,10 @@ list.forEach(item => { this.tempList.push(item.id); }) - if (list.length === this.tableData.length) { - this.all = true; - } else { - this.all = false - } + this.all = list.length === this.tableData.length; }, // 鎵归噺鍒犻櫎鐢ㄦ埛淇℃伅 mulDelte(idArr) { - console.log(idArr); this.$confirm("鎮ㄧ‘瀹氳杩涜鎵归噺鍒犻櫎鐢ㄦ埛鍚�?") .then(_ => { this.$axios({ @@ -203,11 +176,10 @@ } }) }) - .catch(err => { console.log(err) }) + .catch(err => { }) }, // 鎵归噺淇敼璐﹀彿 mulUpdateStatus(idArr, flag) { - console.log(flag); this.$confirm(flag === 1 ? "鎮ㄧ‘瀹氳杩涜鎵归噺鍚敤鐢ㄦ埛鍚�?" : '鎮ㄧ‘瀹氳杩涜鎵归噺绂佺敤鐢ㄦ埛鍚�?') .then(_ => { this.$axios({ @@ -229,7 +201,7 @@ } }) }) - .catch(err => { console.log(err) }) + .catch(err => { }) }, changeTime({ createTime }) { return helper(createTime); @@ -294,7 +266,7 @@ this.dialogUpdate = true; this.updateFlag = true; for (let key in this.flag) { - if (key == mykey) { + if (key === mykey) { this.flag[key] = true; } else { this.flag[key] = false; @@ -305,7 +277,7 @@ // 淇敼鐢ㄦ埛鐘舵�� handleChangeStatus(obj) { let { id, status } = obj; - status == true ? status = 1 : status = 0; + status === true ? status = 1 : status = 0; this.$axios.post(`sccg/admin/updateStatus/` + id + '?status=' + status).then(res => { }) }, @@ -317,7 +289,7 @@ this.$axios.get(`sccg/admin/list?keyword=${search}¤t=${currentPage}&pageSize=${pageSize}`).then(res => { if (res.code === 200) { res.data.records.forEach(item => { - item.status == 1 ? item.status = true : item.status = false; + item.status === 1 ? item.status = true : item.status = false; }) that.totalNum = res.data.total; that.tableData = res.data.records; @@ -332,12 +304,11 @@ }, // 璁剧疆琛ㄦ牸鏂戦┈绾� tableRowClassName({ row, rowIndex }) { - if ((rowIndex + 1) % 2 == 0) { + if ((rowIndex + 1) % 2 === 0) { return 'warning-row'; } else { return 'success-row'; } - return ''; }, // 澶勭悊鐢ㄦ埛鎵�灞炶鑹� filterRole(arr){ @@ -361,9 +332,9 @@ watch: { refresh: { handler(newValue, oldValue) { - if (newValue == true) { + if (newValue) { this.search = ''; - if (this.keyword != '') { + if (this.keyword !== '') { this.search = this.keyword; } this.currentPage = 1; @@ -377,125 +348,37 @@ } </script> <style lang="scss" scoped> -main { - background-color: #09152f; - margin-top: 20px; - padding-bottom: 50px; - border: 1pox solid #fff; +.mainContent { + display: flex; + justify-content: flex-start; + flex-wrap: nowrap; - .mainTitle { - line-height:60px; - } - + .grid-content { + margin-left: 10px; + flex: 1; .tools { - display : flex; - justify-content: space-between; - align-items: center; - padding: 0 20px; + display: flex; + justify-content: space-between; + flex-wrap: nowrap; - .funs { - display: flex; - .funs-sp{ - border: 1px solid #17324c; - } - .funsItem { - line-height: 28px; - display: flex; - align-items: center; - border-radius: 4px; - font-size: 12px; - margin-left: 10px; + .pagination { + margin-top: 55px; + } - .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; - } - } - + .el-pagination { + &::v-deep li, + &::v-deep .btn-prev, + &::v-deep .btn-next { + background-color: #071f39; + 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 .active { + background-color: #409eff; + color: #fff; } + } } - - .el-table { - color: #4b9bb7; - font-size: 10px; - .operation { - display: flex; - font-size: 10px; - .line { - padding: 0 1px; - } - - span:hover { - cursor: pointer; - } - } - } - // &::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: 56px !important; - // } + } } </style> \ No newline at end of file -- Gitblit v1.8.0