From 15079a363658567a62db46ccfe489f04af79a687 Mon Sep 17 00:00:00 2001 From: “dzb” <2632970487@qq.com> Date: 星期三, 28 九月 2022 18:41:45 +0800 Subject: [PATCH] 运营管理的基础设置和案件池首页 --- src/views/systemSetting/baseSetting/department/index.vue | 175 ++++++++++++++++++++++++++++++++++++++++++++++++++------- 1 files changed, 152 insertions(+), 23 deletions(-) diff --git a/src/views/systemSetting/baseSetting/department/index.vue b/src/views/systemSetting/baseSetting/department/index.vue index 9516994..169b284 100644 --- a/src/views/systemSetting/baseSetting/department/index.vue +++ b/src/views/systemSetting/baseSetting/department/index.vue @@ -11,7 +11,8 @@ </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"> + <el-dialog :visible.sync="dialogCreate" title="鏂板閮ㄩ棬淇℃伅" width="45%" v-if="dialogCreate" + :before-close="handleClose"> <createUser :refresh="context==='' ? getUserList : search " /> </el-dialog> </div> @@ -22,7 +23,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 prop="id" label="閮ㄩ棬ID" min-width="5"> @@ -60,16 +62,33 @@ </el-table> <!-- 鏌ョ湅淇敼椤甸潰 --> <el-dialog :visible.sync="dialogUpdate" width="45%" :title="updateFlag ? '淇敼閮ㄩ棬淇℃伅' :'鏌ョ湅閮ㄩ棬淇℃伅'" - v-if="dialogUpdate"> - <updateUser :updateFlag="updateFlag" :userInfo="userInfo" :getUserList="context==='' ? getUserList : search" - @changeDialog="changMyDialog" /> + v-if="dialogUpdate" :before-close="handleClose"> + <updateUser :updateFlag="updateFlag" :userInfo="userInfo" + :getUserList="context==='' ? getUserList : search" @changeDialog="changMyDialog" /> </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> + <!-- tools --> + <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> </div> </main> @@ -93,13 +112,62 @@ totalNum: 200, pageSize: 10, currentPage: 1, - context: '' + context: '', + all: false, + unsame: false, + myIdx: 0, + options: [ + { + value: 0, + label: '鎵归噺鎿嶄綔', + disabled: true, + }, + { + value: 1, + label: '鎵归噺鍚敤', + }, + { + value: 2, + label: '鎵归噺绂佺敤', + }, + { + value: 3, + label: '鎵归噺鍒犻櫎', + } + ], + tempList: [] } }, created() { this.getUserList(); }, methods: { + selectChange(list) { + console.log(list); + console.log(this.tempList); + }, + tableChange(list) { + this.tempList = list; + if (list.length === this.tableData.length) { + this.all = true; + } else { + this.all = false + } + }, + changeTime({ createTime }) { + return helper(createTime); + }, + selectAll() { + + this.$refs.multipleTable.toggleAllSelection(); + }, + disSame(list) { + // console.log(this.$refs.multipleTable); + // const row = this.$refs.table.data + list.forEach(row => { + this.$refs.multipleTable.toggleRowSelection(row) + }) + }, handleDelete({ id }) { this.$confirm('纭鍒犻櫎锛�') .then(_ => { @@ -113,14 +181,14 @@ .then(res => { console.log(res); this.$message({ - type: res.code===404 ? 'warning':'success', + type: res.code === 404 ? 'warning' : 'success', message: res.message }) this.getUserList(); }) }) - .catch(_ => {}); + .catch(_ => { }); }, // 淇敼瑙掕壊 handleChangeRole(obj) { @@ -207,6 +275,15 @@ // 鍏抽棴dialog changMyDialog(val) { this.dialogUpdate = val.dialogFlag; + }, + handleClose(done) { + this.$confirm('纭鍏抽棴锛�') + .then(_ => { + this.dialogUpdate = false; + this.dialogCreate = false; + done(); + }) + .catch(_ => { }); } }, } @@ -280,17 +357,69 @@ line-height: 60px; } - .pagination { - margin-top: 50px; + .tools { display: flex; - line-height: 50px; - justify-content: center; + justify-content: space-between; + align-items: center; + padding: 0 20px; - &::v-deep li, - &::v-deep .btn-prev, - &::v-deep .btn-next { - background-color: #071f39; - color: #4b9bb7; + .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; + + .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; + 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; + } + } } } -- Gitblit v1.8.0