| | |
| | | <template> |
| | | <div class="userList"> |
| | | <myAside /> |
| | | <div class="right"> |
| | | <myHeader @setDialog="changeDialog" @getSearch="getSearch"></myHeader> |
| | | <myMain :refresh="isFresh" :keyword="keyword" @resetFresh="resetFresh" /> |
| | | </div> |
| | | </div> |
| | | <el-container style="height: 100%"> |
| | | <el-aside heigth="100%" width="200px "> |
| | | <myAside @selectedDepartment="selectedDepartment" /> |
| | | </el-aside> |
| | | |
| | | <el-container> |
| | | <store-content :model="'three-pack'" /> |
| | | </el-container> |
| | | </el-container> |
| | | </template> |
| | | <script> |
| | | import myHeader from "./components/header" |
| | | import myAside from "./components/aside" |
| | | import myMain from "./components/main" |
| | | import myAside from "./components/aside"; |
| | | import updateUser from "@/views/operate/fivepack/threepack/components/updateUser"; |
| | | import storeContent from "@/views/operate/fivepack/threepack/components/content"; |
| | | import { |
| | | getStoreInfoList, |
| | | deleteStoreInfo, |
| | | } from "@/api/operate/storeManagement"; |
| | | |
| | | export default { |
| | | components: { |
| | | myHeader, |
| | | myMain, |
| | | myAside |
| | | components: { myAside, storeContent, updateUser }, |
| | | |
| | | created() { |
| | | this.search(); |
| | | }, |
| | | |
| | | data() { |
| | | return { |
| | | storeCode: null, |
| | | storeStatus: null, |
| | | options: [ |
| | | { label: "全部", value: 0 }, |
| | | { label: "经营", value: 1 }, |
| | | { label: "倒闭", value: 2 }, |
| | | ], |
| | | tableData: [], |
| | | dialogUpdate: false, |
| | | currentPage: 1, |
| | | totalNum: 0, |
| | | pageSize: 10, |
| | | userInfo: null, |
| | | updateFlag: false, |
| | | storeInfo: null, |
| | | }; |
| | | }, |
| | | |
| | | methods: { |
| | | search(data) { |
| | | let communityId, streetId; |
| | | if (data) { |
| | | communityId = data.id; |
| | | streetId = data.parentId; |
| | | } |
| | | getStoreInfoList({ keyword: this.storeCode, communityId, streetId }) |
| | | .then(({ list, pageSize, totalPage }) => { |
| | | this.tableData = list; |
| | | this.pageSize = pageSize; |
| | | this.totalNum = totalPage; |
| | | }) |
| | | .catch((err) => this.$message({ type: "error", message: err })); |
| | | }, |
| | | data() { |
| | | return { |
| | | isFresh: false, |
| | | keyword: '', |
| | | } |
| | | |
| | | handleReset() { |
| | | this.storeCode = ""; |
| | | this.storeStatus = null; |
| | | this.currentPage = 1; |
| | | this.search(); |
| | | }, |
| | | methods: { |
| | | // 获取搜索返回结果 |
| | | getSearch({ text }) { |
| | | this.keyword = text; |
| | | this.isFresh = true; |
| | | }, |
| | | // 获取刷新结果 |
| | | changeDialog({ flag }) { |
| | | console.log(flag); |
| | | this.isFresh = flag; |
| | | }, |
| | | // 重置isFresh |
| | | resetFresh({ flag }) { |
| | | this.isFresh = flag; |
| | | console.log(this.isFresh); |
| | | } |
| | | } |
| | | } |
| | | |
| | | handleView(row, type) { |
| | | this.dialogUpdate = true; |
| | | this.storeInfo = row; |
| | | this.updateFlag = type === "update"; |
| | | }, |
| | | |
| | | handleDelete(id) { |
| | | deleteStoreInfo(id) |
| | | .then(() => { |
| | | this.$message({ type: "success", message }); |
| | | this.currentPage = 1; |
| | | this.search(); |
| | | }) |
| | | .catch((err) => this.$message({ type: "error", message: err })); |
| | | }, |
| | | |
| | | handleClose() { |
| | | this.dialogUpdate = false; |
| | | }, |
| | | |
| | | closeDialog() { |
| | | this.dialogUpdate = false; |
| | | this.currentPage = 1; |
| | | this.search(); |
| | | }, |
| | | |
| | | changeCurrentPage(currentPage) { |
| | | this.currentPage = currentPage; |
| | | this.search(); |
| | | }, |
| | | |
| | | tableRowClassName({ row, rowIndex }) { |
| | | if ((rowIndex + 1) % 2 === 0) { |
| | | return "warning-row"; |
| | | } else { |
| | | return "success-row"; |
| | | } |
| | | }, |
| | | selectedDepartment(data) { |
| | | if (!data.children) { |
| | | this.searchData = data; |
| | | this.search(data); |
| | | } else { |
| | | data.parentId = data.id; |
| | | data.id = null; |
| | | this.searchData = data; |
| | | this.search(data); |
| | | } |
| | | this.currentPage = 1; |
| | | }, |
| | | }, |
| | | }; |
| | | </script> |
| | | <style lang="scss" scoped> |
| | | .userList { |
| | | text-align: left; |
| | | margin: 10px 20px; |
| | | color: #4b9bb7; |
| | | display: flex; |
| | | height: 100%; |
| | | .right{ |
| | | flex: 1; |
| | | height: 100%; |
| | | padding-left: 20px; |
| | | } |
| | | &::v-deep .el-dialog__header, |
| | | &::v-deep .el-dialog__body { |
| | | background-color: #06122c; |
| | | } |
| | | ::v-deep .el-header { |
| | | // background-color: #09152f; |
| | | color: #000; |
| | | line-height: 60px; |
| | | } |
| | | |
| | | &::v-deep .el-dialog__header { |
| | | display: flex; |
| | | align-items: center; |
| | | background-color: #fff; |
| | | padding: 20px; |
| | | line-height: 60px; |
| | | } |
| | | // ::v-deep .el-aside { |
| | | // background-color: #09152f; |
| | | // } |
| | | |
| | | &::v-deep .el-dialog__title { |
| | | color: #4b9bb7; |
| | | } |
| | | // ::v-deep .el-menu { |
| | | // background-color: #09152f; |
| | | // } |
| | | |
| | | &::v-deep .el-dialog__close { |
| | | width: 20px; |
| | | height: 20px; |
| | | // color: #fff; |
| | | } |
| | | // ::v-deep .el-main, |
| | | // ::v-deep .el-footer { |
| | | // background-color: #09152f; |
| | | // } |
| | | |
| | | &::v-deep .el-dialog__body { |
| | | padding: 0; |
| | | } |
| | | ::v-deep .el-tree-node__label { |
| | | line-height: 30px; |
| | | font-size: 14px; |
| | | // color: rgb(75, 155, 183); |
| | | } |
| | | </style> |