epmet-work-pc/src/views/dataBoard/renfang/warn/building.vue

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

		<div v-if="!displayedId">
			<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>
		</div>

		<resi-list :building_id="displayedId" :resident_type="type_id" v-if="displayedId" />
	</div>
</template>

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

export default {
	name: "house-list",

	components: {
		cptTb,
		cptBread,
		resiList,
	},

	data() {
		return {
			breadList: [
				{
					type: "back",
					meta: {
						title: "人房总览",
					},
				},
				{
					type: "building",
					meta: {
						title: "预警楼栋列表",
					},
				},
			],

			tableTitle: "预警楼栋列表",
			searchName: "",

			orgLevel: "",
			org_id: "",
			type_id: "",
			type_name: "",
			level: "",

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

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

			header: [
				"序号",
				"所属网格",
				"所属小区",
				"楼号",
				"预警人数",
				"操作",
			],

			displayedId: "",
		};
	},

	activated() {
		this.org_id = getQueryPara("org_id");
		this.level = getQueryPara("level");
		this.type_id = getQueryPara("type_id");
		const type_name = getQueryPara("type_name");
		this.tableTitle =
			type_name + (this.level == "red" ? "红色" : "黄色") + "预警楼栋";
		this.breadList[1].meta.title = this.tableTitle;
		this.pageNo = 1;
		this.getList();
		this.getCount();
	},

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

				const { breadList } = this;
				this.breadList = breadList.slice(0, 2);
			}
		},

		handleSearch() {},

		showInfo(index) {
			let item = this.srcTableData[index];
			this.displayedId = item.building_id;

			this.breadList.push({
				meta: {
					title: "预警人员列表",
				},
			});
		},

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

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

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

			const url = "resident_warn_building";

			const { data, code, msg } = await requestPostBi(
				url,
				{
					queryParam: {
						org_id,
						warn_type: level,
						resi_type: type_id,
						pageNo,
						pageSize,
					},
				},
				{
					// mockId: 60071540,
				}
			);

			this.loading = false;

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

				this.list = data.map((item, index) => {
					return [
						index + 1,
						item.grid ? item.grid : "--",
						item.village ? item.village : "--",
						item.building ? item.building : "--",
						item.warn_num ? item.warn_num : "--",

						{ type: "operate", list: ["查看人员"] },
					];
				});
			} else {
				this.$message.error(msg);
			}
		},

		async getCount() {
			const { org_id, type_id, level, pageNo, pageSize } = this;

			const url = "resident_warn_building_total";

			const { data, code, msg } = await requestPostBi(
				url,
				{
					queryParam: {
						org_id,
						warn_type: level,
						resi_type: type_id,
						pageNo,
						pageSize,
					},
				},
				{
					// mockId: 63071730,
				}
			);

			if (code === 0) {
				this.total = parseInt(data[0].count);
			} else {
				this.$message.error(msg);
			}
		},
	},

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

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