zhywpt-h5/pages/userInfoUploading/userInfoUploading.vue

<template>
	<view>
		<image class='bg-image' mode="widthFix"
			src="https://qtzl.etcjz.cn/default-bucket/20240324/3eba2095f5204798a1f8101b_beijing.jpg"></image>
		<view class="content-re">
			<custom-header title="用户信息" :back="config.hasReturn === 'true'"></custom-header>
			<view v-if="isShow">
				<formBuilderVue :formData="formData" :config="config" @radioChange="radioChange" @submit="submit"
					@uploadImgOcr="uploadImg"></formBuilderVue>
			</view>
		</view>
	</view>
</template>

<script setup lang='ts'>
	import {
		unifyTemplate
	} from '@/hooks/unifyTemplate'
	import {
		TypeData,
		Index
	} from '@/components/form-builder/tools'
	import {
		ref,
		nextTick
	} from 'vue'
	import {
		onLoad
	} from '@dcloudio/uni-app';
	import {
		request
	} from '@/utils/network/request'
	import fromData from './fromData'
	import ocrHandle from './ocrHandle'
	import {
		setToken,
	} from '@/utils/storage'
	// import {
	// 	userInfoFormData
	// } from '@/utils/formDataHandle'
	let config = ref < any > ({
		hasReturn: 'true',
		submitName: '下一步',
		titleWidth: 160,
		isHeader: true,
	})
	let formData = ref < any > (fromData)

	const {
		formBuilderVue, //组件
		CustomHeader, //头部组件
		initData, //初始化数据
		isShow, //是否展示formBuilderVue组件
		qdOrderVal //qdOrder中数据 ref
	} = unifyTemplate() //初始化数据
	//获取页面配置
	onLoad((opin) => {
		// request('ac8756cc31eb4816b8eaeb71907ff9c1', {
		// 	data: {
		// 		qdOrderNo: 'qddd123456'
		// 	}
		// }).then((res) => {
		// 	let data = JSON.parse(res.bizContent)
		// 	formData.value = JSON.parse(data.config.tableConfig)
		// 	console.log('输出内容',formData.value)
		// 	start.value = false
		// 	nextTick(()=>{
		// 		start.value = true
		// 	})
		// })
		// 初始化数据
		initData(opin, 1).then(data => {
			// formData.value = userInfoFormData(data.order, JSON.parse(data.config.tableConfig))
			formData.value = JSON.parse(data.config.tableConfig)
			nextTick(() => {
				if (data.order.userType === 'PERSONAL_USER') {
					// 个人办理
					danChange(false)
				} else {
					// 单位办理
					danChange(true)
				}
			})
			isShow.value = true
			delete data.config.tableConfig
			config.value = Object.assign(data.config, config.value)
		})
	})
	//初始判断单位办理还是个人办理
	function danChange(key) {
		if (key) {
			// 单位办理
			businesses(false)
			handleDan(false)
			formData.value[Index('部门名称', formData.value)].department = '本部'
			submitCode = '20'

		} else {
			// 个人办理
			businesses(true)
			handleDan(true)
			submitCode = '22'
		}
	}
	//单项选择器
	function radioChange(e: any, item: TypeData) {
		if (item.title === '本人办理') {
			if (e.detail.value === '1') {
				businesses(true)
			} else {
				businesses(false)
			}
		}
	}
	//本人办理还是他人办理 ,true为本人办理
	function businesses(key: Boolean) {
		formData.value[Index('委托书', formData.value)].show = key
		formData.value[Index('本人办理', formData.value)].underline = key
		formData.value[Index('经办人姓名', formData.value)].show = key
		formData.value[Index('经办人证件号码', formData.value)].show = key
		formData.value[Index('经办人电话', formData.value)].show = key
		formData.value[Index('经办人证件识别信息如下', formData.value)].show = key
		formData.value[Index('经办人证件人像面', formData.value)].show = key
		formData.value[Index('经办人证件国徽面', formData.value)].show = key
	}
	// 个人办理还是单位办理 true为个人办理
	function handleDan(key) {
		formData.value[Index('营业执照', formData.value)].show = key
		formData.value[Index('委托书', formData.value)].show = key
		formData.value[Index('公司名称', formData.value)].show = key
		formData.value[Index('部门名称', formData.value)].show = key
		formData.value[Index('社会信用代码', formData.value)].show = key
		formData.value[Index('本人办理', formData.value)].show = !key
		formData.value[Index('人像面', formData.value)].show = !key
		formData.value[Index('国徽面', formData.value)].show = !key
		formData.value[Index('证件号码', formData.value)].show = !key
		formData.value[Index('住址', formData.value)].show = !key
		formData.value[Index('姓名', formData.value)].show = !key
		formData.value[Index('联系方式', formData.value)].show = !key
	}

	// 提交个人信息接口
	let submitCode = '22'
	// ocr图片处理和额外请求参数处理
	const {
		uploadImgHandle,
		submitQuery
	} = ocrHandle()

	function uploadImg(fileList, item) {
		uploadImgHandle(fileList, item, formData)
	}

	async function submit(item: any) {
		let data = {
			...submitQuery,
			orderId: qdOrderVal.value.qtOrderNo //订单id
		}
		// 处理参数，为空的不携带
		for (const key in item) {
			if (item[key]) {
				data[key] = item[key]
			}
		}
		const openId = await register(data)
		data.opId = openId //操作人id
		let {
			jumpPage
		} = config.value
		request(submitCode, {
			data,
		}).then((res) => {
			if (res.statusCode === 0) {
				uni.navigateTo({
					url: '/' + jumpPage,
					animationType: 'pop-in',
					animationDuration: 500
				})
			}
		})
	}
	// 无感注册拿到openId
	function register(data: any) {
		let params: any = {}
		params.idNum = data.userIdNum;
		params.idType = data.userIdType;
		params.mobile = data.tel || data.agentTel;
		params.userName = data.userName;
		params.gender = 'UNKOWN';
		params.certifyChannel = 'BAIDUOCR'; //实名渠道
		params.address = data.address;

		if (data.isSelf === '0' || submitCode === '20') {
			// 他人办理
			params.agentIdNum = data.agentIdNum;
			params.agentIdType = data.agentIdType;
			params.agentName = data.agentName;
		}
		if (submitCode === '20') {
			// 单位办理
			params.userType = 'ENTERPRISE'
			params.department = data.department;
		} else {
			params.userType = 'PERSONAL'
		}
		return request('52de4029940f4e03b18c3a0b8d64c2db', {
			data: params,
		}).then((res) => {
			if (res.statusCode === 0) {
				let bizContent = JSON.parse(res.bizContent)
				// 保存token
				setToken(bizContent.accessToken)
				return bizContent.openId
			}
		})
	}
</script>
<style lang='scss' scoped>

</style>