epmet-work-pc/src/views/dataBoard/renfang/house/list.vue

<template>
	<div class="g-pgi" >
		<!-- 组织路由 -->
		<cpt-bread
			:separator="'/'"
			@tap="handleClickBreadItem"
			:breadList="breadList"
		></cpt-bread>

		<div class="m-title">
			<img
				class="title_img"
				src="@/assets/images/index/list-logo.png"
				alt
			/>
			<div class="tip_title">{{ tableTitle }}</div>
			<div class="title_line"></div>
		</div>

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

		<house-details
			@close="displayedHouseId = ''"
			:house-id="displayedHouseId"
			v-if="displayedHouseId"
		/>
	</div>
</template>

<script>
import cptTb from "@/views/dataBoard/cpts/tb";
import cptBread from "@/views/dataBoard/renfang/cpts/bread";
import houseDetails from "@/views/dataBoard/cpts/house-details";
import { requestPostBi } from "@/js/dai/request-bipass";
import getQueryPara from "dai-js/modules/getQueryPara";

export default {
	name: "house-list",

	components: {
		cptTb,
		cptBread,
		houseDetails,
	},

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

			tableTitle: "房屋列表",
			searchName: "",

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

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

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

			header: [
				"序号",
				"所属小区",
				"所属楼栋",
				"单元号",
				"门牌号",
				"房屋类型",
				"房屋用途",
				"房屋状态",
				"房主姓名",
				"联系电话",
				"证件号",
				"操作",
			],

			displayedHouseId: "",
		};
	},

	activated() {
		this.org_id = getQueryPara("org_id");
		this.houseType = getQueryPara("type");
		const type_name = getQueryPara("type_name");
		this.breadList[1].meta.title = type_name + "房屋列表";
		this.tableTitle = type_name + "房屋列表";
		this.pageNo = 1;
		this.getList();
		this.getCount();
	},
	methods: {
		handleRouter(){
				document.getElementById('g-scT').getElementsByClassName('g-bd')[0].scrollTop = 0
		},
		handleClickBreadItem({ item }) {
			if (item.type == "back") {
				this.$router.back();
			}
		},

		handleSearch() {},

		showInfo(index) {
			let item = this.srcTableData[index];
			this.displayedHouseId = item.house_id;
		},

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

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

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

			const url = "house_list";

			const { data, code, msg } = await requestPostBi(
				url,
				{
					queryParam: {
						org_id,
						type: houseType,
						pageNo,
						pageSize,
					},
				},
				{
					// mockId: 60068051,
				}
			);

			this.loading = false;

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

				this.list = data.map((item, index) => {
					return [
						index + 1,
						item.village ? item.village : "--",
						item.building ? item.building : "--",
						item.unit ? item.unit : "--",
						item.door ? item.door : "--",
						item.house_type ? item.house_type : "--",
						item.house_usage ? item.house_usage : "--",
						item.house_state ? item.house_state : "--",
						item.holder_name ? item.holder_name : "--",
						item.holder_phone ? item.holder_phone : "--",
						item.holder_idcard ? item.holder_idcard : "--",

						{ type: "operate", list: ["查看"] },
					];
				});
			} else {
				this.$message.error(msg);
			}
		},
		async getCount() {
			const { org_id, houseType, pageNo, pageSize } = this;
			const url = "house_list_total";

			const { data, code, msg } = await requestPostBi(
				url,
				{
					queryParam: {
						org_id,
						type: houseType,
						pageNo,
						pageSize,
					},
				},
				{
					// mockId: 63070189,
				}
			);

			if (code === 0) {
				this.total = parseInt(data[0].count);
			} else {
				this.$message.error(msg);
			}
		},
	},
	watch: {
        $route(to, from){
					this.handleRouter()
        },
    },

	destroyed() {
	},
};
</script>

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