<route lang="json5" type="page">
	{
	layout: 'default',
	style: {
	navigationStyle: 'custom',
	navigationBarTitleText: '干部值班',
	},
	}
</route>
<template>
	<PageLayout navTitle="干部值班">
		<wd-datetime-picker type="year-month" v-model="dataValue" label="年月" @confirm="getList" id="top1" />
		<wd-table :data="dataSource" :height="tableHeight">
			<wd-table-col prop="date" label="日期" :width="screenWidth / 7" align="center"></wd-table-col>
			<wd-table-col prop="dbld_dictText" label="带班领导" :width="screenWidth * 7 / 32" align="center"></wd-table-col>
			<wd-table-col prop="zbld_dictText" label="值班领导" :width="screenWidth * 7 / 32" align="center"></wd-table-col>
			<wd-table-col prop="zbgbrealname" label="值班干部" :width="screenWidth * (47 / 112)"
				align="center"></wd-table-col>
		</wd-table>
	</PageLayout>
</template>

<script setup>
	import {
		getListApi
	} from '@/api/pages/duty'

	const dataValue = ref(Date.now())
	const dataSource = ref([])
	const tableHeight = ref(0)
	const screenWidth = ref(0)
	const getList = () => {
		const date = new Date(dataValue.value);
		const year = date.getFullYear();
		const month = date.getMonth() + 1;
		getListApi({
			year: year,
			month: month
		}).then(res => {
			dataSource.value = res.result.records.map(item => {
				return {
					...item,
					date: formatDate(item.date)
				}
			})
		})
	}

	const formatDate = (dateStr) => {
		if (!dateStr) return '';
		const [year, month, day] = dateStr.split('-');
		const formattedMonth = parseInt(month, 10);
		const formattedDay = parseInt(day, 10);
		return `${formattedMonth}.${formattedDay}`;
	};

	const calculateTableHeight = () => {
		const systemInfo = uni.getSystemInfoSync();
		screenWidth.value = systemInfo.screenWidth;
		const screenHeight = systemInfo.screenHeight;
		// 获取页面顶部元素高度（导航栏+日期选择器）
		const query = uni.createSelectorQuery();
		query.select('#top1').boundingClientRect(data => {
			const topHeight = data ? data.height : 0;
			const navHeight = 44; // 导航栏高度
			const margin = 20; // 上下边距
			// 计算表格可用高度
			tableHeight.value = screenHeight - topHeight - navHeight - margin;
		}).exec();
	}

	onMounted(() => {
		getList();
		calculateTableHeight();

		// 监听屏幕旋转变化
		uni.onWindowResize(() => {
			calculateTableHeight();
		});
	})
</script>