<route lang="json5" type="page">
	{
	layout: 'default',
	style: {
	navigationStyle: 'custom',
	navigationBarTitleText: '干部值班',
	},
	}
</route>
<template>
	<view :class="{'gray': appStore.isGray == 1 }">
		<wd-navbar left-text="返回" left-arrow
			custom-style="padding-top: var(--status-bar-height, 0); background-image: linear-gradient(to right, #1890ff, #096dd9); color: #fff;"
			@click-left="handleClickLeft">
		</wd-navbar>
		<wd-datetime-picker type="year-month" v-model="dataValue" label="年月" @confirm="getList" />
		<wd-table :data="dataSource">
			<wd-table-col prop="date" label="日期" width="60" align="center"></wd-table-col>
			<wd-table-col prop="dbld_dictText" label="带班领导" width="73" align="center"></wd-table-col>
			<wd-table-col prop="zbld_dictText" label="值班领导" width="73" align="center"></wd-table-col>
			<wd-table-col prop="zbgbrealname" label="值班干部" width="153" align="center"></wd-table-col>
		</wd-table>
	</view>
</template>

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

	const dataValue = ref(Date.now())
	const dataSource = ref([])
	const appStore = useAppStore();
	const handleClickLeft = () => {
		uni.navigateBack();
	};

	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); // 去除前导 0
		const formattedDay = parseInt(day, 10); // 去除前导 0
		return `${formattedMonth}.${formattedDay}`;
	};

	onLoad(() => {
		getList()
	})
</script>

<style>
</style>