zhywpt-h5/pages/mailingAddress/mailingAddress.vue

<template>
	<div>
		<custom-header :back="false" title="邮寄"></custom-header>
		<div style="padding-top: 20rpx" v-if='isShow'>
			<form-builder-vue :formData="formData" :config="config" @radioChange="radioChange" @submit="submit">
			</form-builder-vue>
		</div>
	</div>
</template>
<script setup lang='ts'>
	import {
		unifyTemplate
	} from '@/hooks/unifyTemplate'
	import {
		TypeData,
		Index
	} from '@/components/form-builder/tools'
	import {
		ref,
	} from 'vue'
	import {
		onLoad
	} from '@dcloudio/uni-app';
	import {
		request
	} from '@/utils/network/request'
	import fromData from './fromData.js'
	let config = ref < any > ({
		submitName: '提交',
		titleWidth: 160
	})
	let formData = ref(fromData)
	const {
		formBuilderVue, //组件
		CustomHeader, //头部组件
		initData, //初始化数据
		isShow, //是否展示formBuilderVue组件
		qdOrderVal //qdOrder中数据 ref
	} = unifyTemplate() //初始化数据
	//获取页面配置
	onLoad((opin) => {
		initData(opin, 0).then(data => {
			formData.value = JSON.parse(data.config.tableConfig)
			isShow.value = true
			delete data.config.tableConfig
			config.value = Object.assign(data.config, config.value)
		})
	})



	//单项选择器
	function radioChange(e: any, item: TypeData) {
		if (item.title === '是否邮寄') {
			if (e.detail.value == '1') {
				formData.value[Index('收件人', formData.value)].show = true
				formData.value[Index('收件人手机号', formData.value)].show = true
				formData.value[Index('省市区', formData.value)].show = true
				formData.value[Index('详细地址', formData.value)].show = true
				formData.value[Index('邮政编码', formData.value)].show = true
			} else {
				formData.value[Index('收件人', formData.value)].show = false
				formData.value[Index('收件人手机号', formData.value)].show = false
				formData.value[Index('省市区', formData.value)].show = false
				formData.value[Index('详细地址', formData.value)].show = false
				formData.value[Index('邮政编码', formData.value)].show = false
			}
		}
	}
	/**
	 * 请求函数，e为处理后的value
	 * */
	function submit(e: any) {
		// qdorder数据
		let {
			userType,
			vanType,
			vehicleColor,
			vehiclePlate,
			qdOrderNo
		} = qdOrderVal.value
		// 客货类型
		qdOrderVal.value.type = vanType > 3 ? 2 : vanType
		const data = {
			userType,
			qdOrderNo,
			vehiclePlate,
			vehiclePlateColor: vehicleColor,
			type: vanType > 3 ? 2 : vanType,
			orderSource: 'H5',
			...e
		}
		let {
			commitInterface,
			jumpPage
		} = config.value
		console.log(data);
		request(commitInterface || '3dc2df0ba7004fffbd97192cbaa66b6f', {
			data,
		}).then((res) => {
			if (res.statusCode === 0) {
				// 通过orderId关联产品
				relatedProducts(qdOrderVal.value.productCode || qdOrderVal.value.promoteId, JSON.parse(res
					.bizContent).orderId)
				uni.navigateTo({
					url: '/' + jumpPage,
					animationType: 'pop-in',
					animationDuration: 500
				})
			}
		})

	}
	/**
	 * 关联产品
	 * */
	function relatedProducts(promoteId: string, orderId: string) {
		const data = {
			promoteId,
			orderId
		}
		request('198172b1858d474fa8e35225d65014d7', {
			showLoading: true,
			data,
		}).then((res) => {
			console.log('关联成功', res)
		})
	}
</script>
<style lang='scss' scoped>

</style>