<template>
	<view class="page">
		<HazardDetailPanel :detail="detailData" :loading="loading" />
	</view>
</template>

<script setup>
import { ref } from 'vue';
import { onLoad } from '@dcloudio/uni-app';
import HazardDetailPanel from '@/components/hazardDetail/HazardDetailPanel.vue';
import { getHazardDetail } from '@/request/api.js';

const detailData = ref({});
const loading = ref(false);

const loadDetail = async (hazardId) => {
	loading.value = true;
	try {
		const res = await getHazardDetail(hazardId);
		if (res.code === 0 && res.data) {
			detailData.value = res.data;
		} else {
			uni.showToast({ title: res.msg || '获取详情失败', icon: 'none' });
		}
	} catch (error) {
		console.error('获取隐患详情失败:', error);
	} finally {
		loading.value = false;
	}
};

onLoad((options) => {
	if (options.hazardId) {
		loadDetail(options.hazardId);
		return;
	}

	uni.showToast({ title: '缺少隐患ID', icon: 'none' });
	setTimeout(() => {
		uni.navigateBack();
	}, 1500);
});
</script>

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