zhywpt-h5/pages/basicInformation/basicInformation.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 :back="false" title="基本信息"></custom-header>
			<view style="padding-top: 20rpx" v-if="isShow">
				<form-builder-vue :formData="formData" :config="config" @submit="submit" :vanType="vanTypes"></form-builder-vue>
			</view>
		</view>
	</view>
</template>
<script setup lang="ts">
	import { unifyTemplate } from '@/hooks/unifyTemplate';
	import { TypeData, Index } from '@/components/form-builder/tools';
	import { nextTick, ref } from 'vue';
	import { onLoad } from '@dcloudio/uni-app';
	import { request } from '@/utils/network/request';
	import fromDatas from './fromData.js';

	let config = ref<any>({
		submitName: '下一步',
		titleWidth: 160
	});
	let formData = ref(fromDatas);
	const {
		formBuilderVue, //组件
		CustomHeader, //头部组件
		initData, //初始化数据
		isShow, //是否展示formBuilderVue组件
		qdOrderVal, //qdOrder中数据 ref
		cusQdOrderVal
	} = unifyTemplate(); //初始化数据
	let vanTypes = ref('all');

	//获取页面配置
	onLoad((opin) => {
		initData(opin, -1).then((data) => {
			formData.value = JSON.parse(data.config.tableConfig);
			if (!isSkip(qdOrderVal.value, formData.value)) {
				if (qdOrderVal.value.vanType == 1) {
					// 客车
					vanTypes.value = 'passengerCar';
				} else {
					// 货车
					vanTypes.value = 'truck';
				}
				isShow.value = true;
				delete data.config.tableConfig;
				config.value = Object.assign(data.config, config.value);
				nextTick(() => {
					handleHide();
				});
			} else {
				uni.navigateTo({
					url: '/' + data.config.jumpPage,
					animationType: 'pop-in',
					animationDuration: 500
				});
			}
		});
	});
	// let options = {
	// 	userType: '用户类型',
	// 	vehicleColor: '车牌颜色',
	// 	vehiclePlate: '车牌号'
	// }
	let hideArr = ref<any>([]);

	function isSkip(qdOrder, formData) {
		let formLen = formData.length;
		for (let item of formData) {
			if (qdOrder[item.value] !== undefined) {
				console.log(item);
				hideArr.value.push(item.title);
				formLen--;
			}
		}
		return !formLen;
	}
	//有哪些字段隐藏哪些字段
	function handleHide() {
		hideArr.value.forEach((item) => {
			console.log(item);
			formData.value[Index(item, formData.value)].show = true;
		});
	}
	/**
	 * 请求函数，e为处理后的value
	 * */
	function submit(e : any) {
		// qdorder数据
		cusQdOrderVal.value = {
			...cusQdOrderVal.value,
			...e
		};
		let data = {
			vehiclePlate: e.vehiclePlate,
			vehiclePlateColor: e.vehicleColor
		};
		console.log('车牌校验请求接口', data, cusQdOrderVal.value);
		request('147', {
			data
		}).then((res) => {
			if (res.statusCode === 0) {
				console.log(res);
				let { jumpPage } = config.value;
				uni.navigateTo({
					url: '/' + jumpPage,
					animationType: 'pop-in',
					animationDuration: 500
				});
			}
		});

		// let key = cusQdOrderVal.value.vehiclePlate.search('贵Z')
		// if (key === -1) {
		// 	uni.showModal({
		// 		title: '提示',
		// 		content: '当前功能正在内测中，敬请期待！',
		// 		success: function(res) {
		// 			if (res.confirm) {} else if (res.cancel) {}
		// 		}
		// 	});
		// 	return
		// }
	}
</script>
<style lang="scss" scoped></style>