epmet-work-pc-chengyang/src/views/dataBoard/renfang/resi/analyze.vue

<template>
  <div class="g-pgi">
    <!-- 组织路由 -->
    <cpt-bread
        :breadList="breadList"
        :separator="'/'"
        @tap="handleClickBreadItem"
    ></cpt-bread>
    <div class="m-title">
      <img alt class="title_img" src="@/assets/images/index/list-logo.png"/>
      <div class="tip_title">{{ tableTitle }}</div>
      <div class="title_line"></div>
    </div>

    <div class="g-listbox">
      <cpt-tb
          :col-list="colList"
          :header="header"
          :list="list"
          :loading="loading"
          :total="total"
          @handlePageNoChange="handlePageNoChange"
          @handleSizeChange="handleSizeChange"
          @operate="showInfo"
      ></cpt-tb>
    </div>

    <resi-details
        v-if="displayedResiId"
        :popupShow="popupShow"
        :resi-id="displayedResiId"
        @close="displayedResiId = ''"
    />
  </div>
</template>

<script>
import cptTb from "@/views/dataBoard/cpts/tb";
import cptBread from "@/views/dataBoard/renfang/cpts/bread";
import resiDetails from "@/views/dataBoard/cpts/resi-details";
import {requestPost} from "@/js/dai/request";
import getQueryPara from "dai-js/modules/getQueryPara";

export default {
  name: "resi-list",

  components: {
    cptTb,
    cptBread,
    resiDetails,
  },

  data() {
    return {
      breadList: [
        {
          type: "back",
          meta: {
            title: "人房总览",
          },
        },
        {
          meta: {
            title: "居民列表",
          },
        },
      ],

      tableTitle: "居民列表",
      searchName: "",

      orgLevel: "",
      org_id: "",
      resiType: "", // 流动 常驻 全部

      loading: true,
      pageSize: parseInt(localStorage.getItem("dataBoard_PageSize")) || 20,
      pageNo: 1,
      total: 0,
      srcTableData: [],
      list: [],

      query: {},

      colList: [
        {
          align: "left",
          width: "5%",
        },
        {
          align: "left",
          width: "10%",
        },
        {
          align: "left",
          width: "20%",
        },
        {
          align: "left",
          width: "20%",
        },
        {
          align: "left",
          width: "15%",
        },
        {
          align: "left",
          width: "10%",
        },
        {
          align: "left",
          width: "5%",
        },
        {
          align: "left",
          width: "10%",
        },
        {
          align: "left",
          width: "10%",
        },
      ],

      header: [
        "序号",
        "姓名",
        "所属网格",
        "所属房屋",
        "联系电话",
        "证件号",
        "性别",
        "出生日期",
        "操作",
      ],

      displayedResiId: "",
      popupShow: false,
      key: 'type'
    };
  },

  activated() {
    this.org_id = getQueryPara("org_id");
    this.resiType = getQueryPara("type");
    const type_name = getQueryPara("type_name");
    const type_category = getQueryPara("type_category");
    this.breadList[1].meta.title = type_name + "居民列表";
    this.tableTitle = type_name + "居民列表";
    if(type_category === '年龄') {
      this.key = 'ageType'
    } else if(type_category === '志愿者类别') {
      this.key = 'volunteerType'
    } else {
      this.key = 'type'
    }


    this.pageNo = 1;
    this.getList();
  },

  methods: {
    handleClickBreadItem({item}) {
      if (item.type == "back") {
        this.$router.back();
      }
    },

    handleSearch() {
    },

    showInfo(index) {
      // this.popupShow = true
      let item = this.srcTableData[index];
      this.$router.push('/dataBoard/renfang/resident?user_id='+item.resiId)
      // this.displayedResiId = item.resiId;
    },

    handlePageNoChange(pageNo) {
      this.pageNo = pageNo;
      this.getList();
    },

    handleSizeChange(pageSize) {
      localStorage.setItem("dataBoard_PageSize", pageSize);
      this.pageSize = pageSize;
      this.getList();
    },

    async getList() {
      const {org_id, resiType, pageNo, pageSize} = this;
      this.loading = true;

      const url = "/actual/base/residentBaseInfo/page";

      //通过resiType判断要查询的条件
      this.getQueryByResiType(resiType);

      this.query = {
        ...this.query,
        [this.key]: this.resiType,
        agencyId: org_id,
        pageNo,
        pageSize,
      };

      const {data, code, msg} = await requestPost(
          url, this.query,
          {
            // mockId: 60069169,
          }
      );

      this.loading = false;

      if (code === 0) {
        this.srcTableData = data.list;
        this.total = data.total;

        this.list = data.list.map((item, index) => {
          return [
            index + 1,
            item.name ? item.name : "--",
            item.gridName ? item.gridName : "--",
            item.homeName ? item.homeName : "--",
            item.mobile ? item.mobile : "--",
            item.idNum ? item.idNum : "--",
            item.gender === "1" ? "男" : (item.gender === "2" ? "女" : "--"),
            item.birthday ? item.birthday : "--",
            {type: "operate", list: ["查看"]},
          ];
        });
      } else {
        this.$message.error(msg);
      }
    },

    getQueryByResiType(resiType) {
      if (resiType == "male_count") {
        this.query = {gender: "1"};
      } else if (resiType == "female_count") {
        this.query = {gender: "2"};
      } else if (resiType == "local_count") {
        this.query = {localResidenceFlag: "1"};
      } else if (resiType == "field_count") {
        this.query = {localResidenceFlag: "0"};
      } else if (resiType == "resi_y_house_y_count") {
        this.query = {householdSituation: "rhyz"};
      } else if (resiType == "resi_y_house_n_count") {
        this.query = {householdSituation: "rzhbz"};
      } else if (resiType == "resi_n_house_y_count") {
        this.query = {householdSituation: "hzrbz"};
      }
      /* else if (resiType == "age50_count") {
        this.query = {gender: "2"};
      } else if (resiType == "age5059_count") {
        this.query = {gender: "2"};
      } else if (resiType == "age6069_count") {
        this.query = {gender: "2"};
      } else if (resiType == "age7079_count") {
        this.query = {gender: "2"};
      } else if (resiType == "age80_count") {
        this.query = {gender: "2"};
      } else if (resiType == "culture_count") {
        this.query = {gender: "2"};
      } else if (resiType == "committee_count") {
        this.query = {gender: "2"};
      } else if (resiType == "capable_count") {
        this.query = {gender: "2"};
      } else if (resiType == "friend_count") {
        this.query = {gender: "2"};
      } else if (resiType == "agent_count") {
        this.query = {gender: "2"};
      } else if (resiType == "mediator_count") {
        this.query = {gender: "2"};
      } else if (resiType == "collector_count") {
        this.query = {gender: "2"};
      } else if (resiType == "security_count") {
        this.query = {gender: "2"};
      } else if (resiType == "party_mem_count") {
        this.query = {gender: "2"};
      }*/
      else if (resiType == "primary_count") {
        this.query = {cultureLevel: "0", categoryKey: "PARTY_FLAG"};
      } else if (resiType == "junior_high_count") {
        this.query = {cultureLevel: "1", categoryKey: "PARTY_FLAG"};
      } else if (resiType == "second_speci_count") {
        this.query = {cultureLevel: "2", categoryKey: "PARTY_FLAG"};
      } else if (resiType == "high_school_count") {
        this.query = {cultureLevel: "3", categoryKey: "PARTY_FLAG"};
      } else if (resiType == "junior_college_count") {
        this.query = {cultureLevel: "4", categoryKey: "PARTY_FLAG"};
      } else if (resiType == "undergrad_count") {
        this.query = {cultureLevel: "5", categoryKey: "PARTY_FLAG"};
      } else if (resiType == "master_count") {
        this.query = {cultureLevel: "6", categoryKey: "PARTY_FLAG"};
      } else if (resiType == "doctor_count") {
        this.query = {cultureLevel: "7", categoryKey: "PARTY_FLAG"};
      } else {
        this.query = {}
      }
    },
  },

  destroyed() {
    console.log("我已经离开了！");
  },
};
</script>

<style lang="scss" scoped src="@/assets/scss/dataBoard/listBox.scss"></style>