<template>
	<view class="page-detail">
		<!-- 信息列表 -->
		<view class="info-group">
			<view class="info-item">
				<text class="info-label">管线</text>
				<text class="info-value">{{ form.PipelineCode || '--' }}</text>
			</view>
			<view class="info-item">
				<text class="info-label">焊口</text>
				<text class="info-value">{{ form.WeldJointCode || '--' }}</text>
			</view>
			<view class="info-item info-link" @click="handleShowLocationSelect">
				<text class="info-label">焊口位置</text>
				<text
					class="info-value">{{ form.WeldingLocationCode?`${form.WeldingLocationCode}(${form.WeldingLocationName})` : '请选择' }}</text>
				<u-icon name="arrow-right" :size="28" color="#ccc"></u-icon>
			</view>
			<view class="info-item">
				<text class="info-label">焊接日期</text>
				<text class="info-value">{{ form.WeldingDate || '--' }}</text>
			</view>
			<view class="info-item info-link" @click="showTypePicker = true">
				<text class="info-label">焊工类型</text>
				<text class="info-value">{{ form.welderTypeName || '请选择' }}</text>
				<u-icon name="arrow-right" :size="28" color="#ccc"></u-icon>
			</view>
			<view class="info-item">
				<text class="info-label">焊工</text>
				<text class="info-value">{{ form.welderName || '--' }}</text>
			</view>
			<view class="info-item">
				<text class="info-label">材质1</text>
				<text class="info-value">{{ form.Material1Code || '--' }}</text>
			</view>
			<view class="info-item">
				<text class="info-label">材质2</text>
				<text class="info-value">{{ form.Material2Code || '--' }}</text>
			</view>
			<view class="info-item">
				<text class="info-label">达因</text>
				<text class="info-value">{{ form.Size || '--' }}</text>
			</view>
			<view class="info-item">
				<text class="info-label">外径</text>
				<text class="info-value">{{ form.Dia || '--' }}</text>
			</view>
			<view class="info-item">
				<text class="info-label">DN公称直径</text>
				<text class="info-value">{{ form.DNDia || '--' }}</text>
			</view>
			<view class="info-item">
				<text class="info-label">壁厚</text>
				<text class="info-value">{{ form.Thickness || '--' }}</text>
			</view>
			<view class="info-item">
				<text class="info-label">规格</text>
				<text class="info-value">{{ form.Specification || '--' }}</text>
			</view>
			<view class="info-item">
				<text class="info-label">焊接方法</text>
				<text class="info-value">{{ form.WeldingMethodCode || '--' }}</text>
			</view>
			<view class="info-item">
				<text class="info-label">焊缝类型</text>
				<text class="info-value">{{ form.WeldTypeCode || '--' }}</text>
			</view>
		</view>

		<!-- 底部按钮 -->
		<view class="bottom-btns">
			<u-button v-if="!form.WeldingDate" class="btn-submit" size="medium" type="primary"
				@click="handleReport">填报</u-button>
			<u-button v-if="form.WeldingDailyId" class="btn-point" size="medium" type="primary"
				@click="handlePoint">点口</u-button>
			<u-button class="btn-cancel" size="medium" @click="handleClose">取消</u-button>
		</view>

		<!-- 焊口位置选择弹窗 -->
		<nbd-select v-model="showLocationPicker" :show-search="true" title="选择焊口位置" :list="locationList"
			label-key="BaseInfoCode" value-key="BaseInfoId" @confirm="handleConfirmLocation" />

		<!-- 焊工类型选择弹窗 -->
		<nbd-select v-model="showTypePicker" title="选择焊工类型" :list="welderTypeList" label-key="BaseInfoName"
			value-key="BaseInfoCode" @confirm="handleConfirmType" />
	</view>
</template>

<script setup>
	import {
		ref
	} from 'vue'
	import {
		onLoad
	} from '@dcloudio/uni-app'
	import {
		reqGetWeldJointByWeldJointId,
		reqSaveWeldingDailyByWeldJointId,
		reqGetManualPointSave
	} from '@/api/hj.js'
	import {
		reqWeldingLocation
	} from '@/api/base.js'
	import { useUserStore } from '@/store'
	const userStroe = useUserStore()
	const {userInfo} = userStroe
	// ===== 表单数据 =====
	const form = ref({})

	// ===== 弹窗 =====
	const showLocationPicker = ref(false)
	const showTypePicker = ref(false)
	const locationList = ref([])
	const welderTypeList = ref([{
			BaseInfoName: '打底/盖面',
			BaseInfoCode: 0
		},
		{
			BaseInfoName: '打底',
			BaseInfoCode: 1
		},
		{
			BaseInfoName: '盖面',
			BaseInfoCode: 2
		},
	])

	// ===== 弹窗 ========
	// 焊口位置弹窗
	const handleShowLocationSelect = () => {
		reqWeldingLocation().then(res => {
			locationList.value = res.data
			showLocationPicker.value = true
		})
	}

	// ===== 选择回调 =====
	const handleConfirmLocation = (item) => {
		form.value.WeldingLocationCode = item.BaseInfoCode
		form.value.WeldingLocationName = item.BaseInfoName
		form.value.WeldingLocationId = item.BaseInfoId
		showLocationPicker.value = false
	}

	const handleConfirmType = (item) => {
		form.value.welderType = item.BaseInfoCode
		form.value.welderTypeName = item.BaseInfoName
		showTypePicker.value = false
	}

	// ===== 操作 =====
	const handlePoint = async () => {
		// TODO: 调用点口 API
		const res = await reqGetManualPointSave(form.value.WeldJointId)
		uni.showToast({
			title: '点口成功',
			icon: 'none'
		})
		setTimeout(() => {
			uni.navigateBack()
		}, 1500)
	}
	// 填报事件
	const handleReport = async () => {
		uni.showModal({
			title: '信息提示',
			content: '确定要填报吗？',
			success: async (res) => {
				if (res.confirm) {
					// TODO: 调用填报 API
					const result = await reqSaveWeldingDailyByWeldJointId(
						form.value.WeldJointId,
						userInfo.value.PersonId,
						$u.timeFormat(new Date().getTime(), 'yyyy-mm-dd'),
						form.value.WeldingLocationId,
						form.value.welderType
					)
					uni.showToast({
						title: '保存成功',
						icon: 'none'
					})
					setTimeout(() => {
						uni.navigateBack()
					}, 1500)
				}
			}
		})
	}

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

	// ===== 生命周期 =====
	onLoad((opt) => {
		reqGetWeldJointByWeldJointId(opt.id).then(res => {
			form.value = res.data || {}
			if (form.value.CoverWelderName) {
				form.value.welderName = form.value.CoverWelderName
			}
			if (form.value.BackingWelderName) {
				form.value.welderName += '/' + form.value.BackingWelderName
			}
			form.value.welderType = 0
			form.value.welderTypeName = "打底/盖面"
		})
	})
</script>