<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 class="second-select" style="position:absolute;margin-left:300px;">
				<el-select v-model="type2" @change="init" :clearable="true">
					<el-option value="全部">全部</el-option>
					<el-option value="生产隐患">生产隐患</el-option>
					<el-option value="群租房">群租房</el-option>
					<el-option value="发现问题">发现问题</el-option>
				</el-select>

				<div class="m-search2 left10" style="display: inline-block;">
					<el-date-picker
						type="daterange"
						unlink-panels
						value-format="yyyy-MM-dd"
						@change="init"
						v-model="searchDate"
						range-separator="至"
						start-placeholder="开始日期"
						end-placeholder="结束日期"
					></el-date-picker>
				</div>
			</div>
		</div>
		<cpt-tb
			:col-list="colList"
			:loading="loading"
			:header="header"
			:list="list"
			:total="total"
			@handleSizeChange="handleSizeChange"
			@handlePageNoChange="handlePageNoChange"
			@operate="showInfo"
		></cpt-tb>

		<detail @close="detailId = ''" :detailId="detailId" :detailType="detailType" v-if="detailId != ''" />
	</div>
</template>

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

export default {
	name: 'event-list',

	components: {
		cptTb,
		cptBread,
		detail
	},

	data() {
		return {
			searchDate: [],
			detailId: '',
			searchDate: '',

			detailType: '',
			breadList: [
				{
					type: 'back',
					meta: {
						title: '四大清单'
					}
				},
				{
					meta: {
						title: '问题列表安全隐患'
					}
				}
			],
			type1: '',
			type2: '全部',
			tableTitle: '问题列表',
			searchName: '',

			orgLevel: '',
			org_id: '',
			listType: '', // 流动 常驻 全部

			loading: true,
			page_size: parseInt(localStorage.getItem('dataBoard_page_size')) || 20,

			page_num: 1,
			total: 0,
			srcTableData: [],
			list: [],

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

				{
					align: 'left',
					width: '10%'
				},
				{
					align: 'left',
					width: '10%'
				}
			],
			header: ['序号', '安全隐患', '隐患明细', '创建时间', '操作']
		};
	},

	activated() {
		this.org_id = getQueryPara('org_id');
		this.listType = getQueryPara('type');
		this.type2 = getQueryPara('type2');
		this.searchDate = [getQueryPara('start_date'), getQueryPara('end_date')];
		this.page_num = 1;
		// this.getDate();
		this.init();
	},

	methods: {
		init() {
			this.getList(), this.getCount();
		},
		getDate() {
			var nowDate = new Date();
			var year = nowDate.getFullYear();
			var month = nowDate.getMonth() + 1;
			var day = nowDate.getDate();
			this.searchDate = [`${year}-${1}-${1}`, `${year}-${month}-${day}`];
		},
		changList() {
			this.type2 = '全部';
			this.getList();
		},
		handleClickBreadItem({ item }) {
			if (item.type == 'back') {
				this.$router.back();
			}
		},

		handleSearch() {},

		showInfo(index) {
			
			let item = this.srcTableData[index];
			console.log("item",item)
			this.detailType = item.danger_name;
			this.detailId = item.hidden_danger_id;
		},

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

		handleSizeChange(page_size) {
			localStorage.setItem('dataBoard_page_size', page_size);
			this.page_size = page_size;
			this.getList();
		},

		async getList() {
			const { org_id, listType, page_num, page_size, searchDate } = this;
			const start_date = searchDate[0];
			const end_date = searchDate[1];

			let danger_name = this.type2;

			this.loading = true;
			const url = 'hidden_danger_list';
			const { data, code, msg } = await requestPostBi(
				url,
				{
					queryParam: {
						page_num,
						page_size,
						start_date,
						end_date,
						org_id,
						danger_name
					}
				},
				{
					// mockId: 60068051,
				}
			);

			this.loading = false;

			if (code === 0) {
				this.srcTableData = data;
				console.log('this.srcTableData ', this.srcTableData);
				// this.total = data.total;

				this.list = data.map((item, index) => {
					return [
						index + 1,
						item.danger_name ? item.danger_name : '--',
						item.detailed ? item.detailed : '--',

						item.created_time ? item.created_time : '--',
						{ type: 'operate', list: ['查看'] }
					];
				});

				console.log('this.list', this.list);
			} else {
				this.$message.error(msg);
			}
		},

		async getCount() {
			const { org_id, listType, page_num, page_size, searchDate } = this;
			const start_date = searchDate[0];
			const end_date = searchDate[1];
			const url = 'hidden_danger_list_num';
			let danger_name = this.type2;
			const { data, code, msg } = await requestPostBi(
				url,
				{
					queryParam: {
						org_id,
						start_date,
						end_date,
						danger_name
					}
				},
				{
					// mockId: 63070189,
				}
			);

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

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

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