<!-- 自动考核及输出 -->
<template>
	<div class="pricemoitorrecord">
		<a-card :bordered="false">
			<a-space class="search">
				<div class="silt-title">
					<span style="width: 70px; margin-right: 8px; text-align: right; display: block; line-height: 30px">{{
						'市 (州)'
					}}</span>
					<!-- <a-input style="width: 220px" v-model:value="SearchFormDel.zcdzCityName" placeholder="请输入" /> -->
					<a-select style="width: 220px" v-model:value="SearchFormDel.zcdzCityName">
						<a-select-option v-for="item in optionsGender" :key="item.id" :value="item.dictLabel">{{
							item.dictLabel
						}}</a-select-option>
					</a-select>
				</div>
				<div class="silt-title">
					<span style="width: 70px; margin-right: 8px; text-align: right; display: block; line-height: 30px">
						年份
					</span>
					<a-date-picker
						style="width: 220px"
						picker="year"
						valueFormat="YYYY"
						v-model:value="SearchFormDel.year"
						placeholder="请输入"
					/>
				</div>
				<div class="silt-title">
					<span style="width: 70px; margin-right: 8px; text-align: right; display: block; line-height: 30px">{{
						'季度'
					}}</span>
					<a-select style="width: 220px" v-model:value="SearchFormDel.quarter">
						<a-select-option :value="1">一季度</a-select-option>
						<a-select-option :value="2">二季度</a-select-option>
						<a-select-option :value="3">三季度</a-select-option>
						<a-select-option :value="4">四季度</a-select-option>
					</a-select>
				</div>
				<div class="silt-title">
					<span style="width: 70px; margin-right: 8px; text-align: right; display: block; line-height: 30px">{{
						'月份'
					}}</span>
					<a-date-picker
						:disabled-date="disabledDate"
						picker="month"
						valueFormat="MM"
						style="width: 220px"
						v-model:value="SearchFormDel.month"
						placeholder="请输入"
					/>
				</div>
			</a-space>
			<div class="btnBox">
				<a-button type="primary" class="primarySele" @click="Search"> 查询 </a-button>
				<a-button class="primarySele snowy-buttom-left" @click="onReset"> 重置 </a-button>
				<a-button type="primary" class="primarySele" @click="DaoChu"> 导出 </a-button>
			</div>
		</a-card>

		<div class="list" style="margin-top: 10px">
			<a-table :dataSource="tableData" :pagination="pagination" :columns="tableColumns">
				<template #bodyCell="{ column, record }">
					<template v-if="column.key === '操作'">
						<a-button type="link" @click="onView('view', record)">查看</a-button>
					</template>
				</template>
			</a-table>
		</div>
	</div>

	<a-modal v-model:visible="AddEditDialog.open" :title="AddEditDialog.title" @ok="onDialogOk" width="900px">
		<div class="acc_del">
			<a-table
				:dataSource="tableDataDin"
				:pagination="paginationDin"
				:current="1"
				:pageSize="5"
				:columns="tableColumnsDia"
			>
			</a-table>
		</div>
	</a-modal>
</template>
<script setup name="sharing">
	import business from '@/api/basic.info/verifyQuery.js'
	import { listPagination } from '@/hook/listlistPagination.js'
	import { reactive, ref, onMounted } from 'vue'
	import { useRouter } from 'vue-router'
	import { defineComponent } from 'vue'
	import service from '@/utils/request'
	const formRef = ref(null)
	const router = useRouter()

	const handlePageChangeDin = (current, size) => {
		console.log(typeof size, typeof current, typeof paginationDin.current, typeof paginationDin.pageSize)
		paginationDin.current = current
		paginationDin.pageSize = size
		onSearchDin({ current: +paginationDin.current, size: +paginationDin.pageSize })
	}
	const paginationDin = reactive({
		current: 1,
		pageSize: 5,
		total: 0,
		showSizeChanger: true,
		showQuickJumper: true,
		pageSizeOptions: ['5', '10', '30', '40'],
		showTotal: (total, range) => `共 ${total} 条`,
		onChange: handlePageChangeDin
	})
	const tableColumnsDia = [
		{
			title: '序号',
			dataIndex: 'Index',
			align: 'center',
			customRender: ({ text, record, index }) => {
				return `${index + 1}`
			}
		},
		{ title: '接口名称', align: 'center', dataIndex: 'interfaceName' },
		{ title: '数据条数', align: 'center', dataIndex: 'dataRecordCount' }
	]
	const AddEditDialog = ref({
		open: false,
		title: ''
	})
	const onDialogOk = () => {
		AddEditDialog.value.open = false
		unitName.value.unitName = ''
		console.log(333)
	}
	const unitName = ref({ unitName: '' })
	const options = (row) => {
		unitName.value.unitName = ''
		paginationDin.current = 1
		paginationDin.size = 5
		AddEditDialog.value.open = true
		AddEditDialog.value.title = row.unitName || '查看'
		unitName.value.unitName = row.unitName
		onSearchDin({ unitName: row.unitName })
	}

	const tableDataDin = ref([])
	const onSearchDin = async (T) => {
		const res = await business.KAOHEview({ unitName: unitName.value.unitName, current: 1, size: 5, ...T })

		tableDataDin.value = []
		tableDataDin.value = res.records || res
		paginationDin.total = +res.total
	}

	// ---------------------

	const disabledDate = (current) => {
		return current.year() !== 2024
	}
	const tableColumns = [
		{
			title: '序号',
			dataIndex: 'Index',
			align: 'center',
			customRender: ({ text, record, index }) => {
				return `${index + 1}`
			}
		},
		{ title: '市 (州)', align: 'center', dataIndex: 'zcdzCityName' },
		{ title: '单位名称', align: 'center', dataIndex: 'unitName' },
		{ title: '空数据接口数', align: 'center', dataIndex: 'noDataCount' },
		{ title: '数据总条数', align: 'center', dataIndex: 'dataRecordCount' },
		{ title: '更新时间', align: 'center', dataIndex: 'lastUpdateTime' },
		{ title: '操作', align: 'center', key: '操作' }
	]

	const { DEl, change, tableData, onSearch, handlePageChange, pagination, Search, onReset, SearchFormDel } =
		listPagination(
			{ zcdzCityName: '', year: '', quarter: '', month: '' },
			business.KAOHElist,
			{},
			{ sortOrder: 'ASCEND' }
		)

	// 查看表单数据
	const onView = (record, row) => {
		switch (record) {
			case 'add':
				router.push('/business/personnelDel?add')
				break
			case 'del':
				DEl(row)
				break
			case 'view':
				options(row)
				break
			case 'edit':
				router.push(`/business/personnelDel?code=1&id=${row.id}`)
				break
			default:
				// router.push('/business/personnelDel')
				break
		}
	}

	const DaoChu = async () => {
		// const res = await business.DAOCHUa({
		// 	current: pagination.current,
		// 	size: pagination.pageSize,
		// 	...SearchFormDel.value
		// })

		service({
			method: 'POST',
			url: '/dataQualityAssessmen.info/dqaDataAnalysis/exportByEntity',
			data: {
				current: pagination.current,
				size: pagination.pageSize,
				...SearchFormDel.value
			},
			responseType: 'blob'
		}).then(({ data }) => {
			const blob = new Blob([data], {
				type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
			})
			const BlobURL = window.URL.createObjectURL(blob)
			const link = document.createElement('a')
			link.href = BlobURL
			link.download = 'tableData.xlsx'
			link.click()
			window.URL.revokeObjectURL(BlobURL)
		})
	}
	onMounted(() => {
		DQlist()
	})
	const optionsGender = ref([])

	const DQlist = async () => {
		const res = await business.TJFXDQ({ parentId: '1781535965870915586' })
		optionsGender.value = res
	}
</script>
<style lang="less" scoped>
	.search {
		padding-top: 20px;
		// padding-left: 50px;
		margin-bottom: 32px;
	}
	.btnBox {
		width: 100%;
		// display: inline-block;
		text-align: right;
		// display: flex;
		// justify-content: space-between;
		align-items: center;
		margin-right: 40px;
		.primarySele {
			margin-left: 20px;
			margin-right: 20px;
		}
	}
	.silt-title {
		display: flex;
	}
</style>
