<template>
	<view class="wrap home">
		<u-navbar :is-back="false" title-color="#ffffff" :background="navbarBg" title="首页">
			<view class="slot-wrap">
				<u-input style="color: #ffffff;" v-model="currentProjectName" :clearable="false" type="select"
					placeholder="请选择项目" @click="handleShowProjectSelect" />
			</view>
		</u-navbar>
		<view class="home-icons">
			
			<view class="home-icon" @click="handleScan">
				<u-icon name="saoyisao" custom-prefix="nbd-icon" :size="68" color="#ffffff" />
				<text>扫一扫</text>
			</view>
			<view class="home-icon">
				<u-icon name="daiban" custom-prefix="nbd-icon" :size="68" color="#ffffff" />
				<text>待办</text>
			</view>
		</view>
		<view class="home-hj">
			<view class="hj-title">项目管道实时预制率</view>
			<view class="hj-content">
				<view class="hj-row">
					<view class="hj-cell">
						<text class="hj-label">工厂焊接一次合格率</text>
						<text class="hj-value">99.5%</text>
					</view>
					<view class="hj-cell">
						<text class="hj-label">现场焊接一次合格率</text>
						<text class="hj-value">0%</text>
					</view>
				</view>
				<view class="hj-row">
					<view class="hj-cell">
						<text class="hj-label">工厂预制进度</text>
						<text class="hj-value hj-sub">49229.500/286639.000 DIN</text>
					</view>
					<view class="hj-cell">
						<text class="hj-label">现场焊接进度</text>
						<text class="hj-value hj-sub">5906.500/84951.000 DIN</text>
					</view>
				</view>
				<view class="hj-row">
					<view class="hj-cell">
						<text class="hj-label">工厂焊工功效</text>
						<text class="hj-value">252 DIN/天</text>
					</view>
					<view class="hj-cell">
						<text class="hj-label">现场焊接功效</text>
						<text class="hj-value">95 DIN/天</text>
					</view>
				</view>
			</view>
			<view class="hj-footer">
				<text class="hj-footer-label">项目管道实时预制率 (包含工厂和现场的预制口)</text>
				<text class="hj-footer-value">13%</text>
			</view>
		</view>

		
		<nbd-select-project v-model="showProject" :select-id="currentProject?.ProjectId" :list="projectList"
			label-key="ProjectName" value-key="ProjectId" @confirm="handleConfirmProject" />
	</view>
</template>

<script setup>
	import {
		reqProjectByUserId
	} from '@/api/user.js'
	import {
		computed,
		reactive,
		ref
	} from 'vue'
	import {
		useUserStore
	} from '@/store';
	import {
		storeToRefs
	} from 'pinia';

	const userStore = useUserStore()
	const {
		setProjectList,
		setCurrentProject
	} = userStore
	const {
		userInfo,
		projectList,
		currentProject
	} = storeToRefs(userStore)
	const navbarBg = reactive({
		backgroundColor: "var(--u-type-primary)"
	})
	const showProject = ref(false)
	
	const currentProjectName = computed(()=>currentProject.value?.ProjectName||'')

	const handleShowProjectSelect = () => {
		reqProjectByUserId(userInfo.value.PersonId).then(res => {
			setProjectList(res.data)
			showProject.value = true
		})
	}
	/**
	 * 项目列表点击确认
	 */
	const handleConfirmProject = (item)=>{
		setCurrentProject(item)
		showProject.value = false
	}
	
	/**
	 * 扫一扫
	 */
	const handleScan = ()=>{
		uni.scanCode({
			onlyFromCamera: true,
			success (res) {
				console.log('条码类型：' + res.scanType);
				console.log('条码内容：' + res.result);
			},
			fail(err) {
				console.log("扫码失败了====>",err)
			}
		});
	}
</script>
