From 2bb0e066fdc522beb51dd13f6a72cd67bd5d6a58 Mon Sep 17 00:00:00 2001 From: “dzb” <2632970487@qq.com> Date: 星期日, 09 十月 2022 18:06:46 +0800 Subject: [PATCH] 修改bug,店铺管理新增、查询 --- src/views/systemSetting/baseSetting/department/index.vue | 314 +++++++++++++++++++++++++++++++++++++++++++++------- 1 files changed, 271 insertions(+), 43 deletions(-) diff --git a/src/views/systemSetting/baseSetting/department/index.vue b/src/views/systemSetting/baseSetting/department/index.vue index da38e74..f716b60 100644 --- a/src/views/systemSetting/baseSetting/department/index.vue +++ b/src/views/systemSetting/baseSetting/department/index.vue @@ -6,13 +6,14 @@ <span>绛涢�夋潯浠�:</span> <el-input v-model="context" placeholder="璇疯緭鍏ュ唴瀹�"></el-input> <div class="findBtn"> - <el-button type="primary" @click="search()" >鏌ヨ</el-button> + <el-button 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" width="45%" v-if="dialogCreate"> - <createUser :refresh="getUserList" /> + <el-dialog :visible.sync="dialogCreate" title="鏂板閮ㄩ棬淇℃伅" width="45%" v-if="dialogCreate" + :before-close="handleClose2"> + <createUser :refresh="context==='' ? getUserList : search " @changMyDialog="changMyDialog" /> </el-dialog> </div> </div> @@ -22,10 +23,11 @@ <!-- 鏁版嵁灞曠ず --> <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"> + <el-table-column prop="id" label="閮ㄩ棬ID" min-width="5"> <!-- <template slot-scope="scope">{{ scope.row.id }}</template> --> </el-table-column> <el-table-column prop="departName" label="閮ㄩ棬鍚嶇О" min-width="10"> @@ -34,8 +36,8 @@ </el-table-column> <el-table-column prop="departDes" label="閮ㄩ棬鎻忚堪" min-width="10"> </el-table-column> - <el-table-column prop="createTime" 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="鍏�" @@ -46,26 +48,44 @@ <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 @click="handleUpdate(scope.row)">淇敼</span> + <span class="line">|</span> + <span @click="handleDelete(scope.row)">鍒犻櫎</span> </div> </template> </el-table-column> </el-table> <!-- 鏌ョ湅淇敼椤甸潰 --> - <el-dialog :visible.sync="dialogUpdate" width="45%" v-if="dialogUpdate"> - <updateUser :updateFlag="updateFlag" :userInfo=userInfo /> + <el-dialog :visible.sync="dialogUpdate" width="45%" :title="updateFlag ? '淇敼閮ㄩ棬淇℃伅' :'鏌ョ湅閮ㄩ棬淇℃伅'" + 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> @@ -89,26 +109,134 @@ totalNum: 200, pageSize: 10, currentPage: 1, - context:'' + context: '', + 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: { - // 淇敼瑙掕壊 - handleChangeRole(obj) { - this.dialogUpdate = true - this.user = obj; - // console.log(obj) + selectChange(list) { + console.log(this.tempList); + if (this.tempList.length !== 0) { + if (list === 3) { + this.preMyIdx = list; + this.mulDelete(this.tempList); + } + } else { + this.myIdx = this.preMyIdx; + this.$message({ + type: 'warning', + message: '鎮ㄨ繕娌¢�変腑浠讳綍鏁版嵁', + }) + } + }, + // 澶氭潯鏁版嵁鍒犻櫎 + mulDelete(idArr) { + this.$confirm('鎮ㄧ‘瀹氳鎵归噺鍒犻櫎閮ㄩ棬鍚�?') + .then(_ => { + this.$axios({ + method: 'post', + url: 'sccg/depart/batch_deletion?ids=' + idArr, + }) + .then(res => { + if (res.code === 200) { + this.$message({ + type: 'success', + message: '鎵归噺鍒犻櫎閮ㄩ棬鎴愬姛', + }) + this.getUserList(); + } else { + this.$message({ + type: 'error', + message: res.message + }) + } + }) + }) + .catch(err => { console.log(err) }); + }, + 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 + } + }, + 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(_ => { + this.$axios({ + method: 'post', + url: 'sccg/depart/delete', + data: { + id + } + }) + .then(res => { + console.log(res); + this.$message({ + type: res.code === 404 ? 'warning' : 'success', + message: res.message + }) + + this.getUserList(); + }) + }) + .catch(_ => { }); }, // 淇敼鐢ㄦ埛鐘舵�� handleChangeStatus(obj) { let { id, status } = obj; status == true ? status = 1 : status = 0; console.log(id, status); - this.$axios.post(`sccg/depart/status` ,{id:id,status:status}).then(res => { - console.log(res); + this.$axios.post(`sccg/depart/status`, { id: id, status: status }).then(res => { + if (res.code == 200) { + this.getUserList(); + } }) }, // 鑾峰彇鐢ㄦ埛鍒楄〃 @@ -123,7 +251,7 @@ item.status == 1 ? item.status = true : item.status = false; }) that.totalNum = res.data.records.length; - that.tableData = res.data.records.slice((that.currentPage - 1) * 10, that.currentPage * 10) + that.tableData = res.data.records.slice((that.currentPage - 1) * that.pageSize, that.currentPage * that.pageSize) } }) }, @@ -131,14 +259,14 @@ const that = this; this.dialogCreate = false; // 鑾峰彇鎵�鏈夌敤鎴蜂俊鎭� - this.$axios.get('sccg/depart/page',{params:{currentPage:this.currentPage,pageSize:this.pageSize,departName:this.context}}).then(res => { + this.$axios.get('sccg/depart/page', { params: { currentPage: this.currentPage, pageSize: this.pageSize, departName: this.context } }).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)*10,that.currentPage*10) + that.tableData = res.data.records.slice((that.currentPage - 1) * this.pageSize, that.currentPage * this.pageSize) } }) }, @@ -164,20 +292,46 @@ this.userInfo = rowData }, // 褰撳墠椤垫敼鍙樿Е鍙戜簨浠� - changeCurrentPage(page){ + changeCurrentPage(page) { this.currentPage = page; this.search(); }, // 涓婁竴椤电偣鍑讳簨浠� - handlePrev(page){ + handlePrev(page) { this.currentPage = page; this.search(); }, // 涓嬩竴椤电偣鍑讳簨浠� - handleNext(page){ + handleNext(page) { this.currentPage = page; this.search(); - }} + }, + // 鍏抽棴dialog + changMyDialog({ flag }) { + this.dialogUpdate = flag; + this.dialogCreate = flag; + }, + handleClose(done) { + if (this.updateFlag) { + this.$confirm('纭鍏抽棴锛�') + .then(_ => { + this.dialogUpdate = false; + this.dialogCreate = false; + done(); + }) + .catch(_ => { }); + } else { + done(); + } + }, + handleClose2(done) { + this.$confirm('纭鍏抽棴锛�') + .then(_ => { + done(); + }) + .catch(_ => { }); + } + }, } </script> <style lang="scss" scoped> @@ -249,17 +403,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; + } + } } } @@ -330,5 +536,27 @@ &::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 -- Gitblit v1.8.0