window.onload = function() {


	// 原 JavaScript 代码保持不变
	const checkData = [{
			id: 1,
			title: '消防安全检查',
			checkList: [{
				id: 1,
				title: '检查项目 1',
				selected: 'no',
				subChecks: [{
						id: 1,
						checked: false
					},
					{
						id: 2,
						checked: false
					},
					{
						id: 3,
						checked: false
					},
					{
						id: 4,
						checked: false
					}
				],
				description: '',
				photos: [],
				deadlineDays: '',
				deadlineDate: ''
			}, {
				id: 1,
				title: '检查项目 2',
				selected: null,
				subChecks: [{
						id: 1,
						checked: false
					},
					{
						id: 2,
						checked: false
					},
					{
						id: 3,
						checked: false
					},
					{
						id: 4,
						checked: false
					}
				],
				description: '',
				photos: [],
				deadlineDays: '',
				deadlineDate: ''
			}],
		},
		{
			id: 2,
			title: '用电安全检查',
			checkList: [{
				id: 1,
				title: '检查项目 1',
				selected: null,
				subChecks: [{
						id: 1,
						checked: false
					},
					{
						id: 2,
						checked: false
					},
					{
						id: 3,
						checked: false
					},
					{
						id: 4,
						checked: false
					}
				],
				description: '',
				photos: [],
				deadlineDays: '',
				deadlineDate: ''
			}],
		},
		{
			id: 3,
			title: '用电安全检查2',
			checkList: [{
				id: 1,
				title: '检查项目 1',
				selected: null,
				subChecks: [{
						id: 1,
						checked: false
					},
					{
						id: 2,
						checked: false
					},
					{
						id: 3,
						checked: false
					},
					{
						id: 4,
						checked: false
					}
				],
				description: '',
				photos: [],
				deadlineDays: '',
				deadlineDate: ''
			}],
		},
		{
			id: 4,
			title: '用电安全检查4',
			checkList: [{
				id: 1,
				title: '检查项目 1',
				selected: null,
				subChecks: [{
						id: 1,
						checked: false
					},
					{
						id: 2,
						checked: false
					},
					{
						id: 3,
						checked: false
					},
					{
						id: 4,
						checked: false
					}
				],
				description: '',
				photos: [],
				deadlineDays: '',
				deadlineDate: ''
			}],
		},
	];

	function countSelectedNo(result) {
		// 获取 checkList 中 selected 为 'no' 的对象个数
		return result.reduce((total, category) => {
			return total + category.checkList.filter(item => item.selected === 'no').length;
		}, 0);
	}

	function getTotalCheckListItems(result) {
		// 获取所有 checkList 子元素的总数
		return result.reduce((total, category) => {
			console.log(category, 'category');
			return total + category.checkList.length;
		}, 0);
	}

	function countSelectedNotNull(result) {
		// 获取 checkList 中 selected 不为 null 的个数
		return result.reduce((total, category) => {
			return total + category.checkList.filter(item => item.selected !== null).length;
		}, 0);
	}

	// 统计各个状态数量
	const noCount = countSelectedNo(checkData); // selected=no 的个数
	const totalItems = getTotalCheckListItems(checkData); // checkList 子元素总数
	const notNullCount = countSelectedNotNull(checkData); // selected 不为 null 的个数

	// 初始化检查项数据结构
	function createCheckItem(id) {
		return {
			id: id,
			title: `检查项目 ${id}`,
			selected: null,
			subChecks: Array.from({
				length: 10
			}, (_, i) => ({
				id: i + 1,
				checked: false
			})),
			description: '',
			photos: [],
			deadlineDays: '',
			deadlineDate: ''
		};
	}

	new Vue({
		el: '#app',
		data: {
			flag: 'ZG_XQ', // 值为ADD新增、JC_XQ检查详情、ZG_XQ整改详情、YH_XQ隐患详情
			// flag: 'ADD', 
			// flag: 'JC_XQ', 
			// flag: 'YH_XQ', 
			checkPerson: 'xxxx李先生',
			checkDate: '2025-3-29',
			showDeadlinePicker: false,
			deadlineOptions: ['1', '3', '5', '7'],
			currentEditingItem: null,
			checkList: Array.from({
				length: 40
			}, (_, i) => createCheckItem(i + 1)),
			checkData, // 提交给后端，图片使用vant结构，base64，后端处理，不走爱山东中台。（数据量大！）
			checkPageIndex: 0,
			currentItem: null,
			noCount,
			totalItems,
			notNullCount
		},
		watch: {
			checkData: {
				handler(newVal) {
					const snapshot = JSON.parse(JSON.stringify(newVal));
					console.log('全量变化:', snapshot);
					this.noCount = countSelectedNo(newVal); // selected=no 的个数
					this.totalItems = getTotalCheckListItems(newVal); // checkList 子元素总数
					this.notNullCount = countSelectedNotNull(newVal); // selected 不为 null 的个数
				},
				deep: true
			}
		},
		methods: {
			navTo1() {
				lightAppJssdk.navigation.show({
					url: '_shanghu_detail.html',
					title: '高区应急扫描',
					isgoback: '0',
					success: function(data) {
						// 成功回调
					},
					fail: function(data) {
						// 错误返回
					}
				});
			},
			// 处理单选变化
			handleSelectionChange(item) {
				if (item.selected !== 'no') {
					this.$set(item, 'description', '');
					this.$set(item, 'photos', []);
					this.$set(item, 'deadlineDays', '');
					this.$set(item, 'deadlineDate', '');
				}
			},
			// 文件上传处理
			handleFileUpload(file) {
				console.log('上传文件:', file);
				// 此处可添加实际文件上传逻辑
			},
			// 整改天数确认
			handleDeadlineConfirm(event, item) {
				console.log('select选择', event.target.value)
				const value = event.target.value;
				if (value) {
					const days = parseInt(value);
					item.deadlineDays = days;
					const deadlineDate = new Date();
					deadlineDate.setDate(deadlineDate.getDate() + days);
					item.deadlineDate = this.formatDate(deadlineDate);
				}
				// this.showDeadlinePicker = false;
			},
			// 日期格式化
			formatDate(date) {
				return `${date.getFullYear()}-${(date.getMonth() + 1).toString().padStart(2, '0')}-${date.getDate().toString().padStart(2, '0')}`;
			}
		}
	});
}