<template>
	<view class="page-detail">
		<!-- 基本信息 -->
		<view class="info-group">
			<view class="info-item">
				<text class="info-label">组件编号</text>
				<text class="info-value">{{ info.PipelineComponentCode || '--' }}</text>
			</view>
			<view class="info-item">
				<text class="info-label">预制图纸名称</text>
				<text class="info-value">{{ info.DrawingName || '--' }}</text>
			</view>
			<view class="info-item">
				<text class="info-label">物流箱号</text>
				<text class="info-value">{{ info.BoxNumber || '--' }}</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 v-if="info.State == -1 || info.State == -2" class="info-item">
				<text class="info-label">验收意见</text>
				<text class="info-value">{{ info.Remark || '--' }}</text>
			</view>
			<view class="info-item">
				<text class="info-label">计划安装日期</text>
				<text class="info-value">{{ info.PlanStartDate || '--' }}</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>

		<!-- 验收操作 -->
		<view v-if="isShow && info.State == 0" class="info-group">
			<view class="info-item">
				<text class="info-label">是否通过</text>
				<u-radio-group v-model="isPass" @change="onPassChange">
					<u-radio :name="1" label="通过" active-color="#3577FF"></u-radio>
					<u-radio :name="0" label="不通过" active-color="#3577FF" style="margin-left: 32rpx;"></u-radio>
				</u-radio-group>
			</view>
			<view v-if="isPass == 0" class="info-item">
				<text class="info-label">验收意见</text>
				<u-input 
					type="select" 
					:value="idea || '请选择验收意见'" 
					readonly 
					@click="onShowIdea"
					placeholder="请选择验收意见"
				></u-input>
			</view>
		</view>

		<!-- 底部按钮 -->
		<view v-if="isShow && info.State == 0" class="bottom-btns">
			<u-button size="medium" type="primary" @click="saveModel">验收</u-button>
		</view>

		<!-- 验收意见选择弹窗 -->
		<nbd-select v-model="showIdea" v-model:model="selectedIdea" title="选择验收意见" :list="ideaList"
			label-key="label" value-key="value" @confirm="onIdeaConfirm" />
	</view>
</template>

<script setup>
	import { ref } from 'vue'
	import { onLoad } from '@dcloudio/uni-app'
	import { storeToRefs } from 'pinia'
	import { useUserStore } from '@/store'
	import { reqPipelineComponentById, reqPipelineComponentAccept } from '@/api/hj.js'

	// ==== 状态库 ====
	const userStore = useUserStore()
	const { currentProject, userInfo } = storeToRefs(userStore)

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

	// 验收相关
	const isPass = ref(1)
	const showIdea = ref(false)
	const selectedIdea = ref({ label: '', value: '' })
	const idea = ref('')
	const ideaList = ref([
		{ label: '焊缝外观成形差', value: '焊缝外观成形差' },
		{ label: '未酸洗', value: '未酸洗' },
		{ label: '标识不全', value: '标识不全' },
		{ label: '污迹', value: '污迹' },
		{ label: '未进行成品保护', value: '未进行成品保护' }
	])

	// ===== 状态文本 =====
	const getStatus = (val) => {
		const map = {
			'0': '未验收',
			'1': '已验收',
			'2': '已出库',
			'-2': '待整改',
			'-1': '已整改'
		}
		return map[String(val)] || '--'
	}

	// ===== 获取详情 =====
	const getInfo = async (id) => {
		try {
			const params = {
				projectId: currentProject.value?.ProjectId,
				personId: userInfo.value?.PersonId,
				PipelineComponentId: id
			}
			const res = await reqPipelineComponentById(params)
			if (res.code === 1) {
				info.value = res.data.pipelineComponentItem
				if (from.value === '0' && res.data.isPower) {
					isShow.value = true
				}
			}
		} catch (error) {
			console.error('获取预制组件详情失败:', error)
			uni.showToast({
				title: '加载失败',
				icon: 'none'
			})
		}
	}

	// ===== 验收相关操作 =====
	const onPassChange = (val) => {
		isPass.value = val
		// 切换为"通过"时清空验收意见
		if (val === 1) {
			idea.value = ''
			selectedIdea.value = { label: '', value: '' }
		}
	}

	const onShowIdea = () => {
		showIdea.value = true
	}

	const onIdeaConfirm = (item) => {
		idea.value = item.label
		selectedIdea.value = item
		showIdea.value = false
	}

	const saveModel = () => {
		if (isPass.value === 0 && !idea.value) {
			uni.showToast({
				title: '请选择验收意见',
				icon: 'none'
			})
			return
		}

		uni.showModal({
			title: '确认验收',
			content: `确定要验收该组件吗？`,
			success: async (modalRes) => {
				if (modalRes.confirm) {
					try {
						const params = {
							PipelineComponentId: id.value,
							PersonId: userInfo.value?.PersonId,
							Message: isPass.value === 1 ? '' : idea.value
						}
						const res = await reqPipelineComponentAccept(params)
						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'
						})
					}
				}
			}
		})
	}

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