<template>
	<view class="padding page">
		<view class="padding bg-white radius">
			<view class="flex margin-bottom">
				<view class="text-gray">隐患</view>
			</view>
			<up-input v-model="formData.hazardTitle" placeholder="" disabled></up-input>
			<view class="text-gray margin-bottom margin-top">隐患日期</view>
			<up-input v-model="formData.hazardCreatedAt" placeholder="" disabled></up-input>
			<view class="text-gray margin-bottom margin-top">隐患治理责任单位</view>
			<up-input v-model="formData.responsibleDeptName" placeholder="请输入" :disabled="!canEdit"></up-input>
			<view class="text-gray margin-bottom margin-top">主要负责人</view>
			<up-input v-model="formData.responsiblePerson" placeholder="请输入" :disabled="!canEdit"></up-input>
			<view class="text-gray margin-bottom margin-top">创建时间</view>
			<up-input v-model="formData.createdAt" placeholder="" disabled></up-input>
			<view class="text-gray margin-bottom margin-top">状态</view>
			<up-input v-model="formData.statusName" placeholder="" disabled></up-input>
			<view class="flex justify-center margin-top-xl" style="gap: 30rpx;">
				<button class="round cu-btn lg" @click="handleCancel">返回</button>
				<!-- <button v-if="canEdit" class="bg-blue round cu-btn lg" @click="handleSubmit">保存</button> -->
			</view>
		</view>
	</view>
</template>

<script setup>
	import { ref, reactive, onMounted } from 'vue'
	import { onLoad } from '@dcloudio/uni-app'
	import {getMyWriteOffList } from '@/request/api.js';
	
	// 获取页面参数的方法
	const getPageOptions = () => {
		const pages = getCurrentPages();
		const currentPage = pages[pages.length - 1];
		return currentPage?.options || {};
	};
	
	// 页面参数
	const pageId = ref('');
	const canEdit = ref(false); // 是否可编辑（待审核状态可编辑）
	
	// 表单数据
	const formData = reactive({
		id: '',
		hazardId: '',
		hazardTitle: '', // 隐患标题
		hazardCreatedAt: '', // 隐患日期
		responsibleDeptName: '', // 隐患治理责任单位
		responsiblePerson: '', // 主要负责人
		createdAt: '', // 创建时间
		statusName: '' // 状态
	});
	
	// 获取详情
	const fetchDetail = async (id) => {
		console.log('=== fetchDetail 被调用 ===, id:', id);
		try {
			const res = await getMyWriteOffList();
			console.log('接口返回:', res);
			if (res.code === 0 && res.data && res.data.length > 0) {
				const list = res.data;
				// 如果有 id 就按 id 找，否则取第一条
				let data = null;
				if (id) {
					data = list.find(item => item.id == id);
				}
				// 如果没找到，取第一条
				if (!data) {
					data = list[0];
				}
				
				console.log('绑定数据:', data);
				// 绑定数据
				formData.id = data.id;
				formData.hazardId = data.hazardId;
				formData.hazardTitle = data.hazardTitle || '';
				formData.hazardCreatedAt = data.hazardCreatedAt || '';
				formData.responsibleDeptName = data.responsibleDeptName || '';
				formData.responsiblePerson = data.responsiblePerson || '';
				formData.createdAt = data.createdAt || '';
				formData.statusName = data.statusName || '';
				
				// 根据返回数据的状态判断是否可编辑（待审核 status=1 可编辑）
				if (data.status == 1 || data.statusName === '待审核') {
					canEdit.value = true;
					console.log('状态为待审核，可以编辑');
				} else {
					canEdit.value = false;
					console.log('状态为已审核，不可编辑');
				}
			}
		} catch (error) {
			console.error('获取详情失败:', error);
		}
	};
	
	// 返回
	const handleCancel = () => {
		uni.navigateBack();
	};
	
	// 保存
	const handleSubmit = async () => {
		console.log('保存数据:', formData);
		// TODO: 调用更新接口
		uni.showToast({ title: '保存成功', icon: 'success' });
		setTimeout(() => {
			uni.navigateBack();
		}, 1500);
	};
	
	// 页面加载
	onLoad((options) => {
		console.log('=== onLoad 触发 ===');
		console.log('options:', options);
		pageId.value = options?.id || '';
		fetchDetail(pageId.value);
	});
	
	// 备用：onMounted
	onMounted(() => {
		console.log('=== onMounted 触发 ===');
		if (!pageId.value) {
			const options = getPageOptions();
			console.log('备用获取参数:', options);
			pageId.value = options?.id || '';
			fetchDetail(pageId.value);
		}
	});
</script>

<style lang="scss" scoped>
	.page {
		min-height: 100vh;
		background: #EBF2FC;
	}
	
</style>