<template>
	<view class="page-detail">
		<!-- 基本信息 -->
		<view class="info-group">
			<view class="info-item">
				<text class="info-label">包装编号</text>
				<text class="info-value">{{ info.PackagingCode || '--' }}</text>
			</view>
			<view class="info-item">
				<text class="info-label">预制工作包</text>
				<text class="info-value">{{ info.StackingPosition || '--' }}</text>
			</view>
			<view class="info-item">
				<text class="info-label">到场状态</text>
				<text class="card-tag" :class="'status-' + info.State">{{ getStatus(info.State) }}</text>
			</view>
			<view class="info-item">
				<text class="info-label">签收人</text>
				<text class="info-value">{{ info.ReceiveMan || '--' }}</text>
			</view>
			<view class="info-item">
				<text class="info-label">签收时间</text>
				<text class="info-value">{{ info.ReceiveDate || '--' }}</text>
			</view>
			<view class="info-item">
				<text class="info-label">车次</text>
				<text class="info-value">{{ info.TrainNumber || '--' }}</text>
			</view>
			<view v-if="info.State == 0" class="info-item info-link" @click="onScan">
				<text class="info-label">扫码添加</text>
				<view class="scan-icon">
					<u-icon name="scan" :size="36" color="#3577FF"></u-icon>
				</view>
			</view>
		</view>

		<!-- 预制组件列表 -->
		<view class="package-group">
			<view class="section-title">
				<text>预制组件</text>
				<text class="section-count">({{ packages.length }})</text>
			</view>
			<view v-for="(item, index) in packages" :key="index" class="package-card">
				<view class="card-header">
					<text class="card-title">{{ item.PipelineComponentCode || '--' }}</text>
					<view class="del-btn" @click="handleDelPackage(item)" v-if="info.State == 0">
						<u-icon name="trash" :size="36" color="#ffffff"></u-icon>
					</view>
				</view>
				<view class="card-body">
					<view class="card-row">
						<text class="row-label">数量/单位</text>
						<text class="row-value">{{ item.PreUnit || '--' }}</text>
					</view>
					<view class="card-row">
						<text class="row-label">所属主项</text>
						<text class="row-value">{{ item.UnitWorkName || '--' }}</text>
					</view>
				</view>
			</view>
		</view>

		<!-- 底部按钮 -->
		<view v-if="isShow" class="bottom-btns">
			<u-button size="medium" type="primary" @click="saveModel">确定到场</u-button>
		</view>
		<view v-if="info.State == 0" class="bottom-btns">
			<u-button size="medium" type="primary" @click="savePacks">确定</u-button>
		</view>
	</view>
</template>

<script setup>
	import {
		ref
	} from 'vue'
	import {
		onLoad,
	} from '@dcloudio/uni-app'
	import {
		storeToRefs
	} from 'pinia'
	import {
		useUserStore
	} from '@/store'
	import {
		reqPackagingInformationById,
		reqPipelineComponentById,
		reqSavePipelineComponentToPackaging,
		reqDeletePipelineComponentFromPackaging,
		reqPackingInfoConfirmArrival
	} from '@/api/hj.js'
	// ==== 状态库 ====
	const userStore = useUserStore()
	const {
		currentProject,
		userInfo
	} = storeToRefs(userStore)

	// ===== 数据 =====
	const info = ref({})
	const packages = ref([])
	const setTime = ref('')
	const from = ref('1')
	const isShow = ref(false)
	const id = ref(null)

	// ===== 生命周期 =====
	onLoad((query) => {
		id.value = query.id
		from.value = query.from
		getInfo(query.id)
	})


	// ===== 方法 =====
	const getStatus = (val) => {
		const map = {
			'0': '未到场',
			'1': '已发货',
			'2': '已到场'
		}
		return map[String(val)] || '--'
	}

	const getInfo = async (id) => {
		try {
			// TODO: 调用查看详情接口
			let params = {
				projectId: currentProject.value?.ProjectId,
				personId: userInfo.value?.PersonId,
				packagingManageId: id
			}
			let res = await reqPackagingInformationById(params)
			if (res.code === 1) {
				info.value = res.data.packagingManageDetailItem
				packages.value = res.data.packagingPrepipeItems
				if (res.data.packagingPrepipeItems.length > 0) {
					setTime.value = res.data.packagingPrepipeItems[0].PlanStartDate || ''
				}
				if (from.value === '0' && res.data.isPower) {
					isShow.value = true
				}
			}


		} catch (error) {
			console.error('获取详情失败:', error)
			uni.showToast({
				title: '加载失败',
				icon: 'none'
			})
		}
	}

	const savePacks = () => {
		uni.navigateBack()
	}

	const onScan = async () => {
		// 1. 启动加载提示
		uni.showLoading({
			title: '扫码识别中...',
			mask: true
		})

		try {
			// 2. 调用扫码 API
			const scanRes = await uni.scanCode()
			const result = scanRes.result

			// 3. 校验二维码格式
			if (!result.includes('PrePipeline$')) {
				uni.hideLoading()
				return uni.showToast({
					title: '不是预制组件二维码',
					icon: 'none'
				})
			}

			// 4. 解析 ID
			const packageId = result.split('$')[1]
			if (!packageId) {
				uni.hideLoading()
				return uni.showToast({
					title: '二维码格式错误',
					icon: 'none'
				})
			}

			// 5. 校验是否已存在
			if (packages.value.some(e => e.PipelineComponentId === packageId)) {
				uni.hideLoading()
				return uni.showToast({
					title: '预制组件已存在',
					icon: 'none'
				})
			}

			// 6. 获取组件详情 
			const detailRes = await reqPipelineComponentById({
				projectId: currentProject.value?.ProjectId,
				personId: userInfo.value?.PersonId,
				PipelineComponentId: packageId
			})

			if (detailRes.code !== 1 || !detailRes.data?.pipelineComponentItem) {
				throw new Error(detailRes.msg || '获取组件详情失败')
			}

			const componentData = detailRes.data.pipelineComponentItem

			// 7. 添加到包装包
			const saveRes = await reqSavePipelineComponentToPackaging({
				packagingManageId: info.value?.PackagingManageId,
				pipelineComponentId: componentData.PipelineComponentId
			})

			if (saveRes.code === 1) {
				uni.showToast({
					title: '添加成功',
					icon: 'success'
				})
				// 8. 刷新列表
				await getInfo(id.value)
			} else {
				throw new Error(saveRes.msg || '添加失败')
			}

		} catch (error) {
			console.error('扫码添加失败:', error)
			// 区分是用户取消扫码还是其他错误
			if (error.errMsg && error.errMsg.includes('cancel')) {
				// 用户取消扫码
			} else {
				uni.showToast({
					title: error.message || '操作失败，请重试',
					icon: 'none'
				})
			}
		} finally {
			// 9. 关闭加载提示
			uni.hideLoading()
		}
	}
	const handleDelPackage = (item) => {
		uni.showModal({
			title: '确认删除',
			content: '确定要删除该预制组件吗？',
			success: async (res) => {
				if (res.confirm) {
					// TODO 调用删除接口
					try {
						let delRes = await reqDeletePipelineComponentFromPackaging(item
							?.PipelineComponentId)
						if (delRes.code == 1) {
							await getInfo(id.value)
							uni.showToast({
								title: '删除成功',
								icon: 'none'
							})
						}
					} catch (error) {
						//TODO handle the exception
					}

				}
			}
		})
	}
	const saveModel = () => {
		uni.showModal({
			title: '确认到场',
			content: '确定要确认该包装信息已到场吗？',
			success: (res) => {
				if (res.confirm) {
					reqPackingInfoConfirmArrival({
						packagingManageId: id.value,
						personId: userInfo.value.PersonId
					}).then(res => {
						if (res.code === 1) {
							uni.showToast({
								title: '验证成功',
								icon: 'success',
								duration: 3000
							})
							setTimeout(() => {
								uni.reLaunch({
									url: '/pages/index/index'
								})
							}, 2000)
						} else {
							uni.showToast({
								title: res.msg || '网络异常',
								icon: 'none'
							})
						}
					}).catch(error => {
						console.error('到场确认失败:', error)
						uni.showToast({
							title: '网络异常',
							icon: 'none'
						})
					})
				}
			}
		})
	}
</script>