<template>
|
<div class="userList">
|
<myAside @selectedDepartment="selectedDepartment" />
|
<store-content :model="'three-pack'" />
|
</div>
|
</template>
|
<script>
|
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: { 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.parentId;
|
streetId = data.id;
|
}
|
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 }));
|
},
|
|
handleReset() {
|
this.storeCode = '';
|
this.storeStatus = null;
|
this.search();
|
},
|
|
handleView(row, type) {
|
this.dialogUpdate = true;
|
this.storeInfo = row;
|
this.updateFlag = type === 'update';
|
},
|
|
handleDelete(id) {
|
deleteStoreInfo(id)
|
.then(() => {
|
this.$message({ type: 'success', message });
|
this.search();
|
})
|
.catch(err => this.$message({ type: 'error', message: err }));
|
},
|
|
handleClose() {
|
this.dialogUpdate = false;
|
},
|
|
closeDialog() {
|
this.dialogUpdate = false;
|
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.search();
|
}
|
}
|
}
|
}
|
</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;
|
|
.headerContent {
|
display: flex;
|
line-height: 100px;
|
justify-content: space-between;
|
align-items: center;
|
|
.find {
|
display: flex;
|
}
|
|
.search-item {
|
display: flex;
|
padding: 10px;
|
}
|
|
.findBtn {
|
line-height: 100px;
|
margin-left: 15px;
|
display: flex;
|
align-items: center;
|
|
.el-button {
|
padding: 12px 25px;
|
}
|
}
|
|
.addBtn {
|
padding: 12px 30px;
|
margin-left: 20%;
|
}
|
}
|
|
main {
|
background-color: #09152f;
|
margin-top: 20px;
|
padding-bottom: 50px;
|
|
.mainTitle {
|
line-height: 60px;
|
}
|
|
.el-link {
|
color: #4b9bb7;
|
}
|
|
.leftPx {
|
margin-left: 10px;
|
}
|
|
.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;
|
}
|
}
|
}
|
|
.el-table {
|
color: #4b9bb7;
|
font-size: 10px;
|
|
&::v-deep .el-table__empty-block {
|
background-color: #09152f;
|
color: #4b9bb7;
|
}
|
|
.operation {
|
display: flex;
|
|
.el-button {
|
border: none;
|
}
|
|
span:hover {
|
cursor: pointer;
|
}
|
}
|
}
|
}
|
}
|
&::v-deep .el-dialog__header,
|
&::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>
|
