wl
2023-01-03 e1ac04b42be89ca26ff5f94c17c4e2eebe52a0a2
src/views/operate/fivepack/threepack/index.vue
@@ -1,82 +1,149 @@
<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{
        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>