zhapp/pages/quote/quoteInfo.vue

<template>
	<view class="page">
		<u-sticky zIndex="999" customNavHeight="0">
			<uni-NavBar headerTitle="完善报价信息" background="#fff" rightText="客服"
				iconImage="/static/icon/customerService.png" :isSlot="false" @share="getWechatCustomer"></uni-NavBar>
		</u-sticky>
		<view class="" style="padding: 20rpx 30rpx 0 ;">
			<uni-tab :tabList="tabList" :value="activeTab">
				<!-- 第一个标签内容 -->
				<template #content0>
					<view class=" dis f-c tabpadding">
						<view class="">
							<uni-documentPreview :images="carInfoImgViewList" v-if="carInfoImgViewList.length>0"
								@reupload="reupload" :key="'carInfo-' + carInfoImgViewList.length"
								Type="carInfo"></uni-documentPreview>
							<view class="upload dis a-c j-c mb-3" v-else @tap="upload('carInfo')">
								<u-icon name="plus" color="#1f1f1f" size="36rpx"></u-icon>
								<text>上传</text>
							</view>
							<view class="fromregion">
								<view class="fromheader dis a-c j-s">
									<text>车辆信息</text>
								</view>
								<CarInfoForm :carInfo="carInfo" ref="carForm" :carInfos="carInfo1"
									:currentPagePath="currentPagePath"
									:natureOfVehicleUseoptions="car_nature_codeoptions"
									:plateVehicleUseoptions="car_kind_codeoptions"
									:businessVehicleUseoptions="vehicle_use_code01options"
									:outOfBusinessVehicleUseoptions="vehicle_use_code02options" />
							</view>
						</view>

					</view>
				</template>
				<!-- 第二个标签内容 -->
				<template #content1>
					<view class=" dis f-c tabpadding">
						<view class="">
							<uni-documentPreview :images="ownerInfoImgViewList" v-if="ownerInfoImgViewList.length>0"
								:key="'ownerInfo-' + ownerInfoImgViewList.length" @reupload="reupload"
								Type="ownerInfo"></uni-documentPreview>
							<view class="upload dis a-c j-c mb-3" v-else @tap="upload('ownerInfo')">
								<u-icon name="plus" color="#1f1f1f" size="36rpx"></u-icon>
								<text>上传</text>
							</view>
							<view class="fromregion">
								<view class="fromheader dis a-c j-s">
									<text>车主信息</text>
								</view>
								<OwnerInfoForm :carInfo="carInfo" :ownerInfo="ownerInfo" ref="ownerForm"
									:ownerInfos="ownerInfo1" />
							</view>
						</view>
						<view class="line"></view>
						<view class="fromregion">
							<view class="fromheader dis a-c j-s">
								<text>投保人信息</text>
								<view class="dis a-c j-c">
									<u-radio-group placement="row" v-model="policyHolderholder"
										@change="policyHolderholderChange">
										<u-radio v-for="(item, index) in holderstatusList" :key="index"
											:label="item.label" :name="item.value" activeColor="#FDE935"
											iconColor='#333' labelColor="#333" style="margin-left: 10px">
										</u-radio>
									</u-radio-group>
								</view>
							</view>
							<view v-show="policyHolderholder=='99'" class="mt-4">
								<uni-documentPreview :images="policyHolderInfoImgViewList"
									v-if="policyHolderInfoImgViewList.length>0"
									:key="'policyHolderInfo-' + policyHolderInfoImgViewList.length" @reupload="reupload"
									Type="policyHolderInfo"></uni-documentPreview>
								<view class="upload dis a-c j-c mb-3" v-else @tap="upload('policyHolderInfo')">
									<u-icon name="plus" color="#1f1f1f" size="36rpx"></u-icon>
									<text>上传</text>
								</view>
								<ApplicantInfoForm :carInfo="carInfo" :policyHolderInfo="policyHolderInfo"
									ref="policyForm" :policyHolderInfos="policyHolderInfo1" />
							</view>
						</view>
						<view class="line"></view>
						<view class="fromregion">
							<view class="fromheader dis a-c j-s">
								<text>被保人信息</text>
								<view class="dis a-c j-c">
									<u-radio-group placement="row" v-model="Insuredholder"
										@change="InsuredholderChange">
										<u-radio v-for="(item, index) in insuredstatusList" :key="index"
											:label="item.label" :name="item.value" activeColor="#FDE935"
											iconColor='#333' labelColor="#333" style="margin-left: 10rpx;">
										</u-radio>
									</u-radio-group>
								</view>
							</view>
							<view v-show="Insuredholder=='99'" class="mt-4">
								<uni-documentPreview :images="insuredPersonInfoImgViewList"
									v-if="insuredPersonInfoImgViewList.length>0"
									:key="'insuredPersonInfo-' + insuredPersonInfoImgViewList.length"
									@reupload="reupload" Type="insuredPersonInfo"></uni-documentPreview>
								<view class="upload dis a-c j-c mb-3" v-else @tap="upload('insuredPersonInfo')">
									<u-icon name="plus" color="#1f1f1f" size="36rpx"></u-icon>
									<text>上传</text>
								</view>
								<InsuredInfoForm :carInfo="carInfo" :insuredPersonInfo="insuredPersonInfo"
									ref="insuredForm" :insuredPersonInfos="insuredPersonInfo1" />
							</view>
						</view>

					</view>
				</template>
			</uni-tab>
		</view>
		<view class="footerBtn dis a-c j-c mb-5 " @click="next">
			<text>下一步</text>
		</view>
		<uni-OCRUploadPopup :show="OCRUploadShow" :list='carPopuptablist' @close="OCRUploadShow=false"
			:checkType="checkType" @carCallback="carCallback" @ownerInfoCallback="ownerInfoCallback"
			@applicantInfoCallback="applicantInfoCallback" @InsuredInfoCallback="InsuredInfoCallback">
		</uni-OCRUploadPopup>
		<!-- 自定义加载动画 -->
		<global-loading :show="loadingShow" :text="loadingText"></global-loading>
	</view>
</template>

<script>
	import CarInfoForm from '@/components/commonFormItem/CarInfoForm.vue';
	import OwnerInfoForm from '@/components/commonFormItem/OwnerInfoForm.vue';
	import ApplicantInfoForm from '@/components/commonFormItem/ApplicantInfoForm.vue';
	import InsuredInfoForm from '@/components/commonFormItem/InsuredInfoForm.vue';
	export default {
		components: {
			CarInfoForm,
			OwnerInfoForm,
			ApplicantInfoForm,
			InsuredInfoForm,
		},
		data() {
			return {
				loadingShow: false, //加载
				loadingText: '加载中', //加载提示文字
				//图片识别
				OCRUploadShow: false,
				checkType: "carInfo", //信息类型
				carPopuptablist: [{
					name: '行车本正页',
				}, {
					name: '行车本副页',
				}],
				//车辆信息
				carInfo: {
					licenseNo: "", //车牌号
					brandName: "", //车辆品牌型号
					vinNo: "", //车架号
					engineNo: "", //发动机号
					modelCode: "", //车型编码
					seatCount: "", //核定载客量 核定载人数
					purchasePrice: "", //新车购置价最低，行业实际价值，协商价值
					carBrand: "", //车型品牌
					ciCarName: "", //行业车型名称
					ciModelCode: "", //行业车型编码
					completeKerbMass: "", //整备质量
					exhaustScale: "", //排量
					factory: "", //工厂名称
					factoryid: "", //工厂编码
					frameNo: "", //车架号
					licenseKindCode: "02", //号牌种类
					vehicleclass: "", //车辆类型
					familyName: "", //车型
					modelcname: "", //车型名称
					powertypecode: "", //燃料类型编码
					vehicleweight: "", //总质量
					limitLoad: "", //核定载质量
					carYear: "", //年款
					carKindCode: "A0", //车辆种类
					powertype: "汽油", //燃料类型
					energyTypeCode: "0", //能源种类
					displacement: "", //排量
					powerScale: "", //功率
					registerDate: "", //注册日期
					issueDate: "", //发证日期
					transfer: false, //过户标志
					biTransfer: false, //商业过户标志
					transferDate: "", //过户日期
					loanStatus: 0, //贷款标志
					firstBeneMan: "", //第一受益人
					noLicenseFlag: false, //是否新车
					carTypeCode: "K33", //客车A0 货车H0          
					carNatureCode: "02", //使用性质 			
					propertyCode: "1", //所属性质 1个人 2企业 3个人
					outOfInsurance: false, //脱保
					usedCar: false, //二手车
					vehicleUseCode: "05", //车辆用途
					property: "1", //所属性质
				},
				carInfo1: {
					property: "个人",
					carNatureCode: "非营业",
					energyTypeCode: "燃油",
					vehicleUseCode: "家庭自用",
					carTypeCode: "轿车",
					carKindCode: "客车",
				},
				ownerInfo: {
					name: "",
					identifyType: "01",
					identifyNumber: "",
					addr: "",
					gender: "", //性别
					email: "", //邮箱
					mobile: "",
					identifyValidDate: "", //有效期起期
					identifyValidEndDate: "", //有效期止期
					age: "", //年龄
					property: '1',
					organizationCode: "", //社会信用代码

				},
				ownerInfo1: {
					property: "个人",
					identifyType: "身份证",
				},
				policyHolderInfo1: {
					property: "个人",
					identifyType: "身份证",
				},
				insuredPersonInfo1: {
					property: "个人",
					identifyType: "身份证",
				},
				policyHolderInfo: {
					name: "",
					identifyType: "01",
					identifyNumber: "",
					addr: "",
					gender: "", //性别
					email: "",
					mobile: "",
					identifyValidDate: "", //有效期起期
					identifyValidEndDate: "", //有效期止期
					age: "", //年龄
					owner: false,
					property: '1',
				},
				insuredPersonInfo: {
					name: "",
					identifyType: "01",
					identifyNumber: "",
					addr: "",
					gender: "", //性别
					email: "",
					mobile: "",
					identifyValidDate: "", //有效期起期
					identifyValidEndDate: "", //有效期止期
					age: "", //年龄
					insuranceHolder: false,
					owner: false,
					property: '1',
				},
				activeTab: 0, //选项卡默认下标
				tabList: [{ //选项卡信息
						label: '车辆信息',
						id: 0
					},
					{
						label: '关系人信息',
						id: 1
					}
				],
				policyHolderholder: '1',
				Insuredholder: '1',
				holderstatusList: [{
						label: '同车主',
						value: "1",
					},
					{
						label: '其他',
						value: "99",
					},

				],
				insuredstatusList: [{
						label: '同车主',
						value: '1',
					},
					{
						label: '同投保人',
						value: '2',
					},
					{
						label: '其他',
						value: '99',
					},
				],
				riskList: [], //交强险和商业险的选择
				kindList: [], //商业险险种的选择
				//影像id
				carImageListId: [], //车辆
				ownerImageListId: [], //车主
				policyHolderImageListId: [], //投保人
				insuredPersonImageListId: [], //被保人
				//影像预览
				carInfoImgViewList: [],
				ownerInfoImgViewList: [],
				policyHolderInfoImgViewList: [],
				insuredPersonInfoImgViewList: [],
				currentPagePath: "", //页面路由
				// 字典集合
				car_nature_codeoptions: [], //使用性质
				car_kind_codeoptions: [], //车辆种类
				vehicle_use_code01options: [], //营业
				vehicle_use_code02options: [], //非营业
				productId: "",
				productName: "",
				quoteno: "",
			}
		},
		watch: {
			checkType: {
				handler(val) {
					switch (val) {
						case 'carInfo':
							this.carPopuptablist = [{
								name: '行车本正页',
							}, {
								name: '行车本副页',
							}]
							break;
						default:
							this.carPopuptablist = [{
								name: '身份证',
							}, {
								name: '营业执照',
							}]
							break;
					}
				},
				deep: true
			},
			//所属性质
			'carInfo.property': {
				handler(val) {
					switch (val) {
						case '1':
							//车辆所属性质为个人 修改车主信息
							this.ownerInfo.property = "1";
							this.policyHolderInfo.property = "1";
							this.insuredPersonInfo.property = "1";
							this.ownerInfo1.property = "个人";
							this.policyHolderInfo1.property = "个人";
							this.insuredPersonInfo1.property = "个人";
							this.ownerInfo.identifyType = "01";
							this.policyHolderInfo.identifyType = "01";
							this.insuredPersonInfo.identifyType = "01";
							this.ownerInfo1.identifyType = "身份证";
							this.policyHolderInfo1.identifyType = "身份证";
							this.insuredPersonInfo1.identifyType = "身份证";
							break;
						case '2':
							//车辆所属性质为企业  修改车主信息
							this.ownerInfo.property = "2"; //车主类型
							this.policyHolderInfo.property = "2";
							this.insuredPersonInfo.property = "2";
							this.ownerInfo1.property = "法人"; //车主类型
							this.policyHolderInfo1.property = "法人";
							this.insuredPersonInfo1.property = "法人";
							this.ownerInfo.identifyType = "10"; //证件类型
							this.policyHolderInfo.identifyType = "10";
							this.insuredPersonInfo.identifyType = "10";
							this.ownerInfo1.identifyType = "统一社会信用代码"; //证件类型
							this.policyHolderInfo1.identifyType = "统一社会信用代码";
							this.insuredPersonInfo1.identifyType = "统一社会信用代码";
							break;
						default:

					}
				},
				deep: true
			},
		},
		onShow() {

		},
		async onLoad(options) {
			this.loadingShow = true;
			try {
				if (options.info) {
					let info = JSON.parse(options.info)
					this.carInfo = info.carInfo;
					this.carInfoImgViewList = info.carInfoImgViewList;
					this.carImageListId = info.carImageListId;
				} else {
					const eventChannel = this.getOpenerEventChannel()
					// 监听acceptData事件，获取上一页面通过eventChannel传送到当前页面的数据
					await eventChannel.on('acceptData', (data) => {
						console.log(data);
						this.carInfo = data.carInfo;
						this.ownerInfo = data.ownerInfo;
						this.policyHolderInfo = data.policyHolderInfo;
						this.insuredPersonInfo = data.insuredPersonInfo;
						this.carImageListId = data.carImageListId; //车辆
						this.ownerImageListId = data.ownerImageListId; //车主
						this.policyHolderImageListId = data.policyHolderImageListId; //投保
						this.insuredPersonImageListId = data.insuredPersonImageListId; //被保人
						this.imageEcho(data.quoteno) // 影像获取完毕

					})

				}
				await this.getDicType("car_nature_code"); //使用性质
				await this.getDicType("car_kind_code"); //使用性质
				await this.getDicType("vehicle_use_code", "01"); //营业
				await this.getDicType("vehicle_use_code", "02"); //非营业
				const pages = getCurrentPages(); // 获取当前页面栈的数组，数组的第一项是首页，最后一项是当前页面
				const currentPage = pages[pages.length - 1]; // 当前页面实例
				const currentPagePath = currentPage.$page.path; // 当前页面的完整路径
				this.currentPagePath = currentPagePath;
				this.loadingShow = false;
			} catch (error) {
				this.loadingShow = false;
			}


		},
		methods: {
			//影像查询
			async imageEcho(quotenos) {
				let res = await this.$http.get('/order/taskImages/selectByQuoteNo?quoteNo=' + quotenos);
				if (res.code == "200") {
					res.data.images.forEach((keys) => {
						if (keys.downloadUrl) {
							switch (keys.imageType) {
								case 'C01':
								case 'D01':
									this.carInfoImgViewList.push({
										img: keys.downloadUrl,
										deg: 0,
									})
									break;
								case 'C02':
								case 'D02':
									this.ownerInfoImgViewList.push({
										img: keys.downloadUrl,
										deg: 0,
									})
									break;
								case 'C03':
								case 'D03':
									this.policyHolderInfoImgViewList.push({
										img: keys.downloadUrl,
										deg: 0,
									})
									break;
								case 'C04':
								case 'D04':
									this.insuredPersonInfoImgViewList.push({
										img: keys.downloadUrl,
										deg: 0,
									})
									break;
								default:
									break;
							}
						}
					});

				}
			},
			//跳转微信客服
			async getWechatCustomer() {
				let res = await this.$http.get('/organization/wechat/customerService/manage/find/link')
				if (res.code == 200) {
					if (plus) { // 确保在App环境下
						plus.runtime.openURL(res.data);
					}
				}
			},
			//数据字典
			async getDicType(type, vehicle) {
				if (vehicle) {
					let res = await this.$http.get(`/dict/get?dictCode=${type}&parentValue=${vehicle}`);
					this[type + vehicle + "options"] = [res.data];
				} else {
					let res = await this.$http.get('/dict/get?dictCode=' + type);
					this[type + "options"] = [res.data];
				}
			},
			//重新上传
			reupload(type) {
				this.checkType = type;
				this.OCRUploadShow = true;
			},
			//影像识别回调事件
			carCallback(obj) {
				console.log("🚀 ~ obj:", obj)
				this.carInfoImgViewList = [];
				if (obj.frontImg) {
					this.carInfoImgViewList.push({
						img: obj.frontImg,
						deg: 0,
					})
				}
				if (obj.backImg) {
					this.carInfoImgViewList.push({
						img: obj.backImg,
						deg: 0,
					})
				}
				this.carImageListId = obj.ImgList;
				Object.assign(this.carInfo, obj.Info);
				this.OCRUploadShow = false;
			},
			ownerInfoCallback(obj) {
				console.log(obj);
				this.ownerInfoImgViewList = [];
				if (obj.frontImg) {
					this.ownerInfoImgViewList.push({
						img: obj.frontImg,
						deg: 0,
					})
				}
				if (obj.backImg) {
					this.ownerInfoImgViewList.push({
						img: obj.backImg,
						deg: 0,
					})
				}
				//营业执照图片放入
				if (obj.businessLicenseImg) {
					this.ownerInfoImgViewList.push({
						img: obj.businessLicenseImg,
						deg: 0,
					})
				}
				this.ownerImageListId = obj.ImgList;
				Object.assign(this.ownerInfo, obj.Info);
				console.log(this.ownerInfo);
				this.OCRUploadShow = false;
			},
			applicantInfoCallback(obj) {
				this.policyHolderInfoImgViewList = [];
				if (obj.frontImg) {
					this.policyHolderInfoImgViewList.push({
						img: obj.frontImg,
						deg: 0,
					})
				}
				if (obj.backImg) {
					this.policyHolderInfoImgViewList.push({
						img: obj.backImg,
						deg: 0,
					})
				}
				//营业执照图片放入
				if (obj.businessLicenseImg) {
					this.policyHolderInfoImgViewList.push({
						img: obj.businessLicenseImg,
						deg: 0,
					})
				}
				this.policyHolderImageListId = obj.ImgList;
				Object.assign(this.policyHolderInfo, obj.Info);
				this.OCRUploadShow = false;
			},
			InsuredInfoCallback(obj) {
				this.insuredPersonInfoImgViewList = [];
				if (obj.frontImg) {
					this.insuredPersonInfoImgViewList.push({
						img: obj.frontImg,
						deg: 0,
					})
				}
				if (obj.backImg) {
					this.insuredPersonInfoImgViewList.push({
						img: obj.backImg,
						deg: 0,
					})
				}
				//营业执照图片放入
				if (obj.businessLicenseImg) {
					this.insuredPersonInfoImgViewList.push({
						img: obj.businessLicenseImg,
						deg: 0,
					})
				}
				this.insuredPersonImageListId = obj.ImgList;
				Object.assign(this.insuredPersonInfo, obj.Info);
				this.OCRUploadShow = false;
			},
			//上传按钮
			upload(type) {
				this.checkType = type;
				this.OCRUploadShow = true;
			},
			//投保人同车主
			async policyHolderholderChange(value) {
				console.log(value);
				this.policyHolderholder = value;
				if (value == '99') {
					for (let key in this.policyHolderInfo) {
						if (key !== 'identifyType') {
							this.policyHolderInfo[key] = '';
						}
					}
					this.policyHolderInfoImgViewList = []
				} else {
					await this.setPersonInfoAndImageType('owner',
						'policyHolder',
						"C03");
					this.policyHolderInfo.owner = true;
					this.policyHolderInfo = {
						...this.policyHolderInfo
					};
				}
			},
			//被保人同车主
			async InsuredholderChange(value) {
				this.Insuredholder = value;
				if (value == '99') {
					for (let key in this.insuredPersonInfo) {
						if (key !== 'identifyType') {
							this.insuredPersonInfo[key] = '';
						}
					}
					this.insuredPersonInfoImgViewList = [];
				} else if (value == '1') {
					await this.setPersonInfoAndImageType('owner',
						'insuredPerson',
						"C04");
					this.insuredPersonInfo.owner = true;
					this.insuredPersonInfo = {
						...this.insuredPersonInfo
					};
				} else {
					await this.setPersonInfoAndImageType('policyHolder',
						'insuredPerson', "C04");
					this.insuredPersonInfo.insuranceHolder = true;
					this.insuredPersonInfo = {
						...this.insuredPersonInfo
					};
				}
			},
			//图片预览重新上传事件
			reviewupload(types) {
				console.log(types);
			},
			//下一步跳转
			async next() {
				let _this = this;
				if (this.policyHolderholder == '1') {
					await this.setPersonInfoAndImageType('owner',
						'policyHolder',
						"C03");
					this.policyHolderInfo.owner = true;
					this.policyHolderInfo = {
						...this.policyHolderInfo
					};
				}
				if (this.Insuredholder == '1') {
					await this.setPersonInfoAndImageType('owner',
						'insuredPerson',
						"C04");
					this.insuredPersonInfo.owner = true;
					this.insuredPersonInfo = {
						...this.insuredPersonInfo
					};
				}
				if (this.Insuredholder == '2') {
					await this.setPersonInfoAndImageType('policyHolder',
						'insuredPerson', "C04");
					this.insuredPersonInfo.insuranceHolder = true;
					this.insuredPersonInfo = {
						...this.insuredPersonInfo
					};
				}
				this.$refs.carForm.validate(res => {
					if (!res.length) {
						if (this.activeTab == 0) this.activeTab = 1;
						this.$refs.ownerForm.validate(res => {
							if (!res.length) {
								this.$refs.policyForm.validate(res => {
									if (!res.length) {
										this.$refs.insuredForm.validate(res => {
											if (!res.length) {
												uni.navigateTo({
													url: '/pages/quote/selectInsuranceCompany',
													success: (
														res) => {
														res.eventChannel
															.emit(
																"acceptData", {
																	carInfo: _this
																		.carInfo,
																	ownerInfo: _this
																		.ownerInfo,
																	policyHolderInfo: _this
																		.policyHolderInfo,
																	insuredPersonInfo: _this
																		.insuredPersonInfo,
																	riskList: _this
																		.riskList,
																	kindList: _this
																		.kindList,
																	carImageListId: _this
																		.carImageListId, //车辆
																	ownerImageListId: _this
																		.ownerImageListId, //车主
																	policyHolderImageListId: _this
																		.policyHolderImageListId, //投保人
																	insuredPersonImageListId: _this
																		.insuredPersonImageListId, //被保人
																	productId: _this
																		.productId,
																	productName: _this
																		.productName,
																	quoteno: this
																		.quoteno
																}
															)
													}
												})
											} else {
												uni.$u.toast('被保人信息校验失败')
											}
										})
									} else {
										uni.$u.toast('投保人信息校验失败')
									}
								})
							} else {
								uni.$u.toast('车主信息校验失败')
							}
						})
					} else {
						uni.$u.toast('车辆信息校验失败')
					}
				})
			},
			//（同车主/同投保人）数据处理
			setPersonInfoAndImageType(sourceInfo, targetInfo, imageType) {
				let obj = JSON.parse(JSON.stringify(this[sourceInfo + 'Info']));
				this[targetInfo + 'Info'] = {
					...obj
				};
				if (this[sourceInfo + 'ImageListId'].length > 0) {
					this[targetInfo + 'ImageListId'] = JSON.parse(JSON.stringify(this[sourceInfo +
						'ImageListId']));
					if (this[targetInfo + 'ImageListId'].length == 1) {
						this[targetInfo + 'ImageListId'][0].imageCode = imageType;
					} else {
						this[targetInfo + 'ImageListId'][0].imageCode = imageType;
						this[targetInfo + 'ImageListId'][1].imageCode = `D${imageType.substr(1)}`;
					}
				}
			},
		}
	}
</script>

<style lang="scss" scoped>
	page {
		background-color: #f8f8f8;
	}

	.page {
		background-color: #f8f8f8;
		height: 100%;
	}

	.tabpadding {
		padding: 40rpx 30rpx;
		box-sizing: border-box;
	}

	.upload {
		height: 88rpx;
		border-radius: 58rpx;
		border: 2rpx solid #FDE935;
		font-size: 36rpx;
		color: #1F1F1F;

		text {
			margin-left: 12rpx;
		}

	}

	.fromregion {
		.fromheader {
			font-size: 30rpx;
			color: #333 !important;
			position: relative;
			margin-left: 12rpx;
			margin-bottom: 12rpx;

			text {
				font-weight: bold;
			}

			&::after {
				content: '';
				display: block;
				width: 6rpx;
				height: 30rpx;
				background: #FDE935;
				border-radius: 0rpx 6rpx 6rpx 0rpx;
				position: absolute;
				left: -12rpx;
				top: 50%;
				transform: translateY(-50%);
				/* 可选圆角 */
			}
		}
	}

	.footerBtn {
		height: 88rpx;
		background: #FDE935;
		border-radius: 58rpx 58rpx 58rpx 58rpx;
		margin: 30rpx 30rpx 100rpx;
		box-sizing: border-box;
		font-weight: bold;
		font-size: 36rpx;
		color: #1F1F1F;
	}

	::v-deep {
		.uni-input-input {
			text-align: right !important;
			font-weight: bold;
		}

		.uni-textarea-textarea {
			color: #303133;
			font-weight: bold;
		}
	}

	.search {
		width: 112rpx;
		height: 60rpx;
		background: #FDE935;
		border-radius: 100rpx 100rpx 100rpx 100rpx;
	}

	.line {
		width: 100%;
		height: 10rpx;
		background: #FAFAFA;
		border-radius: 0rpx 0rpx 0rpx 0rpx;
		margin: 24rpx 0;
	}
</style>