hwnc/pagesB/pages/creatorder/creatorder.vue

<template>
	<view :class="[AppTheme]" class="container">
		<view class="central_information">
			<view class="modular_setion">
				<!-- 土地标题 -->
				<view class="package_title">
					<view class="package_dtitle_p1">
						<view class="package_dtitle_p1_1"> {{ordermess.soil_name }}</view>
						<view class="dtitle_text_p2 text-primary">{{ordermess.selelanditemtext.alias }}</view>
					</view>
					<image class="package_thumbnail" mode="aspectFit"
						:src="settingFile.root_img+'/static/app/imgs/land.png'"></image>
				</view>
				<view class="border_nn"></view>
				<view class="package_item">
					<view class="package_item_tp1">地块编号</view>
					<view class="package_item_tp2">
						<view class="pa_title_selt">{{ ordermess.selelanditemtext.name }} </view>
					</view>
				</view>
				<view class="border_nn"></view>
				<view class="package_item">
					<view class="package_item_tp1">地块面积</view>
					<view class="package_item_tp2">
						<view class="pa_title_selt">{{ ordermess.selelanditemtext.area + 'm²' }}</view>
					</view>
				</view>
				<view class="border_nn"></view>
				<!-- 服务类型 -->
				<view class="package_item">
					<view class="package_item_tp1">服务类型</view>
					<view class="package_item_tp2" @click="hostifshow = true">
						<view class="pa_title_selt">{{ ordermess.cutlysetagetext.serve_name }}</view>
						<u-icon size="20" color="#999" name="arrow-right"></u-icon>
					</view>
				</view>
				<view class="border_nn"></view>
				<!-- 租赁周期 -->
				<view class="package_item">
					<view class="package_item_tp1">租赁周期</view>
					<view class="package_item_tp2" @click="hiepackshow = true">
						<view class="pa_title_selt">{{ ordermess.hirecycle.label }}</view>
						<u-icon size="20" color="#999" name="arrow-right"></u-icon>
					</view>
				</view>
			</view>
			<!-- 种子管理 -->
			<view class="seedmodular" v-if="ordermess.cutlysetagetext.serve_name !== '无托管'">
				<view class="seedmodular_p1" @click="chooseseed()">
					<view class="seedlar_text1 text-primary">种子管理</view>
					<view class="seedlar_text2">
						<view class="">选择种子</view>
						<u-icon name="arrow-right" color="#999" size="20"></u-icon>
					</view>
				</view>
				<view class="border_nn"></view>
				<view class="seedmodular_p2" v-if="ordermess.seedordermy">
					<view class="seleedseed_item" v-for="(item, index) in ordermess.seedordermy.orderseedlist"
						:key="index">
						<view class="seleedseed_item_p1">
							<image class="seditem_thumbnail" mode="aspectFill" :src="item.seeditem.ripe_pic"></image>
							<view class="seditem_title">{{ item.seeditem.seed_name }}</view>
						</view>
						<!-- <view class="seleedseed_item_p2">预估产量:{{ item.seeditem.seed_yield * item.seednum }}kg</view> -->
						<view class="seleedseed_item_p3">{{item.seednum}}m²</view>
					</view>
				</view>
				<view class="seedmodular_p3 text-primary border-primary" v-if="!ordermess.seedordermy"
					@click="chooseseed()">+添加种子</view>
				<!-- <view style="height: 10rpx;"></view> -->
				<view class="read-more">
					<u-read-more :toggle="true" :shadowStyle="shadowStyle" :showHeight="0" closeText="详情" color="#999"
						fontSize="26rpx" textIndent="0">
						<view class="read-more_1">
							<view class="read-more_1_1">种子详情</view>
							<view class="read-more_1_2">
								<view>名称</view>
								<!-- <view>数量</view> -->
								<view>预估产量</view>
								<view>播种面积</view>
							</view>
							<view v-if="ordermess.seedordermy">
								<view class="read-more_1_3" v-for="(item, index) in ordermess.seedordermy.orderseedlist"
									:key="index">
									<view class="view1">{{ item.seeditem.seed_name }}</view>
									<!-- <view class="view1">{{ item.seednum }}/份</view> -->
									<view class="view1">{{ item.seeditem.seed_yield * item.seednum }}kg</view>
									<view class="view1">{{item.seednum}}m²</view>
								</view>
							</view>
							<view v-else class="read-more_1_4">暂无种子</view>
						</view>

						<view class="read-more_2">
							<view class="read-more_2_1">土地详情</view>
							<view class="read-more_2_2">
								<view>租地总面积</view>
								<view>播种面积</view>
								<view>剩余面积</view>
							</view>
							<view class="read-more_2_3">
								<view class="view2">{{ ordermess.selelanditemtext.area + 'm²' }}</view>
								<view class="view2">{{ordermess.seednumber}}m²</view>
								<view class="view2">{{ordermess.selelanditemtext.area-ordermess.seednumber}}m²</view>
							</view>
						</view>
					</u-read-more>
				</view>

			</view>

			<!-- 配送信息 -->
			<view class="seedmodular">
				<view class="seedmodular_p1">
					<view class="seedlar_text1 text-primary">配送信息</view>
					<navigator class="seedlar_text2" url="/pagesD/pages/address/address?source=1">
						<view class="">
							更换地址
						</view>
						<u-icon name="arrow-right" color="#999" size="20"></u-icon>
					</navigator>
				</view>
				<view class="border_nn"></view>
				<navigator class="seedmodular_p3 text-primary border-primary"
					v-if="addressData === null || addressData === undefined"
					url="/pagesD/pages/address/address?source=1">+请选择地址</navigator>
				<navigator class="address_delti" v-if="addressData !== null"
					url="/pagesD/pages/address/address?source=1">
					<view class="detaed_addrss">
						<u-icon name="phone-fill" :color="primary" size="25"></u-icon>
						<view class="addr_text">{{ addressData.name }}-{{ addressData.mobile }}</view>
					</view>
					<view class="detaed_addrss">
						<u-icon name="map-fill" :color="primary" size="25"></u-icon>
						<view class="addr_text">{{ addressData.address }}</view>
					</view>
				</navigator>
				<view v-if="!addressData" style="height: 40rpx;"></view>
			</view>
			<!-- 自主采摘 -->
			<!-- <view class="seedmodular" v-if="ordermess.cutlysetagetext.serve_name === '半托管'">
				<view class="seedlar_text1 text-primary">自主采摘</view>
				<view class="border_nn"></view>
				<view class="feed_moudel" @click="map">
					<view class="feed_modetitle">
						<u-icon name="map" :color="primary" size="25"></u-icon>
						<view class="feed_modetext">采摘地址</view>
					</view>
					<view class="feed_modetitle2">
						<view class="feed_modnnsnt">{{pickingaddress||"请选择采摘地址"}}</view>
						<u-icon name="arrow-right" color="#cacaca" size="20"></u-icon>
					</view>
				</view>
				<view class="feed_moudel">
					<view class="feed_modetitle">
						<u-icon name="phone-fill" color="#56AB2F" size="25"></u-icon>
						<view class="feed_modetext">采摘说明</view>
					</view>
					<view class="feed_modetitle2">
						<view class="feed_modnnsnt">请提前打电话预约</view>
						<u-icon name="arrow-right" color="#cacaca" size="20"></u-icon>
					</view>
				</view>
			</view> -->
			<!-- 租赁人信息 -->
			<view class="seedmodular_info">
				<view class="seedlar_text1">租赁人信息</view>
				<view class="border_nn"></view>
				<view class="leation_suject">姓名</view>
				<input type="text" class="brodnn" placeholder-style="color:#cacaca" v-model="leasename"
					placeholder="请输入租赁人姓名" />
				<view class="border_nn"></view>
				<view class="leation_suject">电话</view>
				<input type="number" class="brodnn" :value="addressData != null ? addressData.mobile : ''"
					placeholder-style="color:#cacaca" placeholder="请输入租赁人电话" />
				<view class="border_nn"></view>
				<view class="leation_suject">备注</view>
				<input type="text" class="brodnn" placeholder-style="color:#cacaca" v-model="remarks"
					placeholder="有问题请告诉我" />
				<view class="border_nn"></view>
			</view>
		</view>
		<!-- 底部结算和价格计算 -->
		<view class="page-bottom">
			<view class="page-bottom_1">
				<view class="p-b-btn">
					<view class="setnt_inion_p1">总计:</view>
					<view class="setnt_inion_p2 text-neutral">￥{{ parseFloat(totalpricenum).toFixed(2) }}</view>
					<view class="setnt_inion_p3" @click="detailed = true">明细</view>
				</view>
				<view class="page-bottom_2">
					<view>
						<u-checkbox-group size='35rpx' active-color="green" @change="changetarpty(tarp)">
							<u-checkbox v-model="tarpty" shape="circle" :checked="tarptys"></u-checkbox>
						</u-checkbox-group>
					</view>

					<view @click="yuedutarpty()">
						阅读并同意
						<text class="text-primary">《租赁协议》</text>
					</view>
				</view>
			</view>

			<view class="action-btn-group"><button type="primary"
					class=" bg-linear-gradient action-btn no-border buy-now-btn" @click="settlement">立即支付</button>
			</view>
		</view>
		<!-- 托管套餐和日期选择器 -->
		<u-picker :show="hostifshow" :columns="[hostingpackage]" @confirm="confirmpa" @cancel="cancel" keyName="label">
		</u-picker>
		<u-picker :show="hiepackshow" :columns="[hirepackagelist]" @confirm="confirmdate" @cancel="cancel"
			keyName="label"></u-picker>
		<payment ref="payment" :channel="4" :alipay="true" :weixinpay="true" :zhtpay="true"></payment>
		<tarpty :list='parttext' :tarptyshow="tarptyshow" @tarptycolse='tarptycolse' :type='1'></tarpty>
		<!-- 账单明细 -->
		<u-popup :show="detailed" mode="bottom" @close="close" :closeOnClickOverlay="true" round="12">
			<view class="bill_item">
				<view class="bill_text_p1">土地租赁费用</view>
				<view class="bill_text_p2">￥{{ ordermess.landexpenss }}</view>
			</view>
			<view class="bill_item">
				<view class="bill_text_p1">土地服务费用</view>
				<view class="bill_text_p2">￥{{ ordermess.servlandexpenss }}</view>
			</view>
			<view class="bill_item">
				<view class="bill_text_p1">种子费用</view>
				<view class="bill_text_p2">￥{{ ordermess.seedexpenses }}</view>
			</view>
			<view class="bill_item">
				<view class="bill_text_p1">优惠卷抵用</view>
				<view class="bill_text_p2">-￥{{ ordermess.coupon }}</view>
			</view>
			<view class="bill_item">
				<view class="bill_text_p1">会员折扣</view>
				<view class="bill_text_p2">-￥{{ ordermess.vipdiscount }}</view>
			</view>
			<view class="bill_item">
				<view class="bill_text_p1">总计</view>
				<view class="bill_text_p2 text-neutral">￥{{ parseFloat(ordermess.totalprice).toFixed(2) }}</view>
			</view>
		</u-popup>
	</view>
</template>
<script>
	import Landapi from '@/api/land/index.js';
	import api from '@/api/mall/index.js';
	import tarpty from '@/components/ui-tarpty/ui-tarpty.vue';
	export default {
		components: {
			tarpty
		},

		data() {
			return {
				shadowStyle: {
					backgroundImage: "none",
					paddingTop: "0",
					marginTop: "0rpx"
				},
				primary: this.$theme.primary,
				pickingaddress: '', //采摘地址
				settingFile: getApp().globalData.siteinfo,
				//支付方式
				items: [{
						value: 'weixinpay',
						name: '微信支付',
						iconsrc: '/static/imgs/icon/wxpay.png',
						checked: 'true'
					},
					{
						value: 'balancepay',
						iconsrc: '/static/imgs/icon/cacardpay.png',
						name: '余额支付'
					}
				],
				current: 0,
				// 订单信息
				ordermess: {
					totalprice: 0,
					landexpenss: 0,
					servlandexpenss: 0,
					seedexpenses: 0,
					coupon: 0,
					vipdiscount: 0
				},
				// 提交订单信息
				updaordermess: {},
				//总资费
				totalpricenum: 0,
				// 托管套餐选择器显隐
				hostifshow: false,
				// 托管周期选择器显隐
				hiepackshow: false,
				// 托管周期
				hirepackagelist: [],
				//订单资费详情弹出层
				detailed: false,
				// 收货地址
				addressData: null,
				// 租赁姓名
				leasename: '',
				// 备注
				remarks: '',
				//套餐集合
				hostingpackage: [],
				//数据库托管套餐
				longrangepackage: [],
				tarpty: false,
				tarptyshow: false,
				parttext: '',
				tarptys: false,
				tarp: 1,
				orderid: '',
				part_id: ''
			};
		},
		onLoad(options) {
			// 获取土地租赁协议列表

			this.orderid = options.soil_id
			this.part_id = options.id

			this.gethostingpackage(options.id, options.soil_id);
		},
		onUnload() {
			this.calprice();
		},
		onReady() {},
		onShow: function() {
			//传递选择的订单信息
			this.ordermess = this.$store.state.landleaseorder;

			console.log('this.ordermess', JSON.stringify(this.ordermess))
			// 获取土地租赁协议列表
			this.hirepackagelist = this.ordermess.hirepackagelist;

			this.calprice();
		},
		methods: {
			yuedutarpty() {
				if (!this.parttext) {
					this.$api.msg(`暂无租赁协议，联系客服添加`);
					return;
				} else {
					this.tarptyshow = true
				}

			},
			tarptycolse(show) {
				if (show.tap == 2) {
					this.tarptys = true
					this.tarpty = true
					this.tarp = 2
				}
				this.tarptyshow = show.show
			},
			changetarpty(e) {
				if (this.tarp == 1) {
					this.tarp = 2
					this.tarpty = true
				} else {
					this.tarpty = false
					this.tarp = 1
				}

			},
			close() {
				this.detailed = false
			},
			map() {
				let that = this
				uni.getLocation({
					success: function(res) {
						let that = this
						// #ifdef MP-WEIXIN || APP-PLUS
						that.$until.chooseLocation(function(res) {
							that.pickingaddress = ret.address
						});
						// #endif
					}
				})
			},
			// 获取土地租赁协议列表
			gethostingpackage(id, orderid) {
				var that = this;
				Landapi.getsecemist({
					id: id,
					soil_id: orderid
				}).then(res => {
					if (res.status == 1) {
						// 给套餐集合赋值
						that.longrangepackage = res.data.data;
						that.parttext = res.data.party;
						res.data.data.forEach(item => {
							let paitem = {
								label: item.serve_name,
								value: item.id
							};
							this.addressData = this.ordermess.vipaddress;

							that.hostingpackage.push(paitem);
						});
					} else {
						that.$api.msg(res.msg);
					}
				});
			},
			//更新整体套餐信息
			calprice() {
				var that = this;
				// 优惠卷抵用
				that.ordermess.coupon = 0;

				// 土地租赁费用
				if (that.ordermess.selelanditemtext) {
					that.ordermess.landexpenss = parseFloat(that.ordermess.selelanditemtext.price * (that.ordermess
						.level_radio / 100)).toFixed(2);
					that.ordermess.youhui1 = parseFloat(that.ordermess.selelanditemtext.price - that.ordermess
						.landexpenss);
				}
				// 土地服务费用
				if (that.ordermess.hirecycle) {
					that.ordermess.servlandexpenss = parseFloat(that.ordermess.hirecycle.value * that.ordermess
						.cutlysetagetext.serve_price * (that.ordermess.level_radio / 100)).toFixed(2);
					that.ordermess.youhui2 = parseFloat((that.ordermess.hirecycle.value * that.ordermess.cutlysetagetext
						.serve_price) - that.ordermess.servlandexpenss);
					that.ordermess.yuanjia1 = parseFloat(that.ordermess.hirecycle.value * that.ordermess.cutlysetagetext
						.serve_price).toFixed(2);
				} else {
					that.ordermess.servlandexpenss = 0;
					that.ordermess.youhui2 = 0;
					that.ordermess.yuanjia1 = 0;
				}
				// 种子费用
				if (that.ordermess.seedordermy !== undefined) {
					that.ordermess.seedexpenses = parseFloat(that.ordermess.seedordermy.seedtariff).toFixed(2);

				} else {
					that.ordermess.seedexpenses = 0;

				}
				// 会员折扣
				that.ordermess.vipdiscount = parseFloat(that.ordermess.youhui1) + parseFloat(that.ordermess.youhui2);

				//合计费用
				that.ordermess.totalprice =
					parseFloat(that.ordermess.landexpenss) +
					parseFloat(that.ordermess.servlandexpenss) +
					parseFloat(that.ordermess.seedexpenses);
				that.ordermess.totalprice = that.ordermess.totalprice.toFixed(2)
				that.totalpricenum = that.ordermess.totalprice;
				that.vipdiscount = that.ordermess.vipdiscount;
				that.ordermess.yuantotalprice = parseFloat(that.ordermess.selelanditemtext.price) + parseFloat(that
					.ordermess.servlandexpenss);
			},
			// 套餐选择器回调函数
			confirmpa(e) {
				let that = this;
				that.hostifshow = false;
				that.longrangepackage.some(function(item) {
					if (item.id === e.value[0].value) {
						that.ordermess.cutlysetagetext = item;
						return true;
					}
				});
				that.calprice();
			},
			//选择关闭
			cancel() {
				let that = this;
				that.hostifshow = false;
				that.hiepackshow = false;
			},
			// 日期选择器回调函数
			confirmdate(e) {
				this.hiepackshow = false;
				this.ordermess.hirecycle = this.hirepackagelist[e.value[0].extra];
				this.calprice();
			},
			//选择种子
			chooseseed() {
				uni.redirectTo({
					url: '/pagesB/pages/creatorder/addseed?orderid=' + this.orderid + '&id=' + this.part_id
				});
			},
			// 结算订单
			settlement() {
				var that = this;
				if (!that.tarpty) {
					that.$api.msg(`请同意《租赁协议》`);
					return;
				}
				//如果为全判断收货地址是否为空
				if (that.addressData === null) {
					that.$api.msg('请先选择配送地址');
				}
				let tmplIdsone = that.$config.temlist;
				if (tmplIdsone) {
					that.$until.requestSubscribeMessage([tmplIdsone['orderSuccess'], tmplIdsone['orderDelivery'],
						tmplIdsone['returnReminder']
					], tmplIdsone, function() {
						that.settlement2()
					});
				} else {
					that.settlement2()
				}
			},

			settlement2() {
				var that = this;
				// 判断租赁人姓名是否正确
				var re = /^[\u4e00-\u9fa5]+$/;
				if (re.test(that.leasename)) {
					// 用户id赋值
					// that.updaordermess.vip_id = that.addressData.vipid;
					//土地id赋值
					that.updaordermess.soil_id = that.ordermess.landid;
					// 选中地块id
					that.updaordermess.subdivision_id = that.ordermess.selelanditem;
					//订单金额
					that.updaordermess.order_money = that.totalpricenum;
					// 服务id
					that.updaordermess.service_id = that.ordermess.cutlysetagetext.id;
					// 服务名称
					// that.updaordermess.service_name = that.ordermess.cutlysetagetext.serve_name;
					// 租赁周期
					that.updaordermess.period_days = that.ordermess.hirecycle.value;
					// 选购种子,加一层判断
					if (that.ordermess.cutlysetagetext.serve_name !== '无托管') {
						if (that.ordermess.seedordermy === undefined || that.ordermess.seedordermy ===
							null) {
							that.$api.msg('当前订单未选择种子,请选择种子');
							that.updaordermess.seeds = [];
							return;
						} else {
							if (that.ordermess.seedordermy.orderseedlist === undefined || that.ordermess
								.seedordermy
								.orderseedlist === null) {
								that.$api.msg('当前订单未选择种子,请选择种子');
								that.updaordermess.seeds = [];
								return;
							} else {
								that.updaordermess.seeds = that.ordermess.seedordermy.orderseedlist;
							}
						}
					}

					//地址id
					that.updaordermess.address_id = that.addressData.id;
					//订单客户姓名
					that.updaordermess.order_name = that.leasename;
					//订单手机号
					that.updaordermess.order_mobile = that.addressData.mobile;
					//订单备注
					that.updaordermess.remark = that.remarks;
					//订单支付方式
					that.updaordermess.type_pay = that.current + 1;
					if (that.updaordermess.seeds != undefined || that.updaordermess.seeds != null) {
						if (that.updaordermess.seeds[0].seeditem !== null && that.updaordermess.seeds[0]
							.seeditem !==
							undefined) {
							let seeds = [];
							that.updaordermess.seeds.forEach(item => {
								let seeditem = {
									seed_id: 0,
									seed_num: 0,
									price: 0
								};
								seeditem.seed_id = item.seeditem.id;
								seeditem.seed_num = item.seednum;
								seeditem.price = item.seeditem.price;
								seeds.push(seeditem);
							});
							that.updaordermess.seeds = JSON.stringify(seeds);
						}
					} else {
						that.updaordermess.seeds = '';
					}
					console.log(that.updaordermess.seeds, '121121211222')
					that.updaordermess.payprice = that.ordermess.totalprice;
					that.updaordermess.money = that.ordermess.totalprice;
					that.updaordermess.yuantotalprice = that.ordermess.yuantotalprice;
					that.updaordermess.vipdiscount = that.ordermess.vipdiscount; //会员折扣
					console.log(that.updaordermess, 'that.updaordermessthat.updaordermess')
					if (that.updaordermess.id) {
						that.$refs.payment.payopen(that.updaordermess);
					} else {
						that.$paycenter.ct_soil_order(that.updaordermess).then(res => {
							if (res.status === 0) {
								uni.showToast({
									title: res.msg,
									icon: 'none'
								})
							} else {
								//已授权,跳转去支付页面
								that.updaordermess.id = res.data;
								that.$refs.payment.payopen(that.updaordermess);
							}
						})
					}
				} else {
					that.$api.msg('请输入正确的名字');
				}
			}
		}
	};
</script>
<style lang="scss">
	@import 'common/nowvue.scss';
</style>
<style lang="scss">
	.container {
		background: #f1f1f1;
	}

	::v-deep .u-read-more__toggle[data-v-459946da] {
		justify-content: flex-end;
	}

	.central_information {
		overflow-y: scroll;
		padding: 0 20rpx;
		height: calc(100vh - 90rpx - env(safe-area-inset-bottom));
	}

	.modular_setion {
		padding: 45rpx 30rpx;
		background: #ffffff;
		box-shadow: 2px 4px 12px rgba(0, 0, 0, 0.08);
		margin: 15rpx 0 25rpx 0;
		border-radius: 10rpx;
	}

	.package_title {
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.package_dtitle_p1 {
		width: auto;

		.package_dtitle_p1_1 {
			font-size: 35rpx;
			font-weight: 600;
		}
	}

	.dtitle_text_p1 {
		font-size: 34rpx;
		font-weight: 900;
	}

	.dtitle_text_p2 {
		font-size: 28rpx;
		margin-top: 30rpx;
	}

	.package_thumbnail {
		width: 60rpx;
		height: 47.5rpx;
	}

	.package_item {
		margin-top: 25rpx;
	}

	.package_item_tp1 {
		font-size: 26rpx;
		color: #999;
	}

	/* 底部操作菜单 */
	.page-bottom {
		position: fixed;
		left: 0;
		bottom: 0;
		z-index: 95;
		display: flex;
		// justify-content: center;
		justify-content: space-evenly;
		align-items: center;
		width: 100%;
		height: 140upx;
		background: rgba(255, 255, 255, 0.9);
		box-shadow: 0 0 20upx 0 rgba(0, 0, 0, 0.5);

		.page-bottom_1 {
			display: flex;
			flex-direction: column;

			.p-b-btn {
				display: flex;
				align-items: center;
				justify-content: flex-start;
				font-size: 28rpx;
				width: 100%;
				height: 80upx;

				.yticon {
					font-size: 40upx;
					line-height: 48upx;
					color: $font-color-light;
				}

				&.active,
				&.active .yticon {
					color: $tab-color-1;
				}

				.icon-fenxiang2 {
					font-size: 42upx;
					transform: translateY(-2upx);
				}

				.icon-shoucang {
					font-size: 46upx;
				}
			}

			.page-bottom_2 {
				display: flex;
				justify-content: flex-start;
				font-size: 29rpx;
			}
		}

		.action-btn-group {
			display: flex;
			height: 76upx;
			border-radius: 100px;
			overflow: hidden;
			box-shadow: 0 20upx 40upx -16upx #fa436a;
			box-shadow: 1px 2px 5px rgba(219, 63, 96, 0.4);
			margin-left: 20upx;
			position: relative;

			.action-btn {
				display: flex;
				align-items: center;
				justify-content: center;
				width: 300rpx;
				height: 100%;
				font-size: $font-base;
				padding: 0;
				border-radius: 0;
			}
		}
	}

	.package_item_tp2 {
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-top: 30rpx;
	}

	.pa_title_selt {
		color: #000;
		font-size: 30rpx;
	}

	.footer_payment {
		position: fixed;
		width: calc(100vw - 15rpx);
		margin: 0 7.5rpx;
		padding: 10rpx;
		bottom: calc(env(safe-area-inset-bottom) + 10rpx);
		background: rgba(255, 255, 255, 0.9);
		box-shadow: 2px 4px 12px rgba(0, 0, 0, 0.08);
		border-radius: 16rpx;
		display: flex;
		justify-content: space-between;
		align-items: center;
		z-index: 2;

		.button {
			color: #fff;
			margin-right: 30rpx;
			width: 50%;
			font-size: 32rpx;
		}
	}

	.settlement_information {
		display: flex;
		justify-content: flex-start;
		align-items: center;
		padding: 0 15rpx;
	}

	.setnt_inion_p1 {
		font-size: 34rpx;
		color: #000;
	}

	.setnt_inion_p2 {
		margin: 0 25rpx 0 10rpx;
		font-size: 34rpx;
		font-weight: 800;
	}

	.setnt_inion_p3 {
		font-size: 26rpx;
		color: #999;
	}

	.bill_item {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 25rpx;
	}

	.bill_text_p1 {
		font-size: 30rpx;
		color: #999;
	}

	.bill_text_p2 {
		font-size: 28rpx;
		// color: #000000;
	}

	.seedmodular {
		padding: 45rpx 30rpx 20rpx 30rpx;
		background: #ffffff;
		box-shadow: 2px 4px 12px rgba(0, 0, 0, 0.08);
		margin: 15rpx 0 25rpx 0;
		border-radius: 10rpx;
		max-height: 100%;
	}




	.read-more_1 {
		display: flex;
		flex-direction: column;
		// align-items: center;

		.read-more_1_1 {
			padding: 30rpx 0;
			font-size: 32rpx;
			color: #000;
			text-align: center;

		}

		.read-more_1_2 {
			display: flex;
			justify-content: space-between;

		}

		.read-more_1_3 {
			display: flex;
			justify-content: space-between;
			align-items: center;
			margin-top: 2vh;
			text-align: center;

			// margin-left: 2vw;
			.view1 {

				text-align: center;
				height: 45rpx;
				line-height: 45rpx;

				font-size: 28rpx;
			}

		}

		.read-more_1_4 {
			text-align: center;
			padding: 40rpx;
		}
	}

	.read-more_2 {
		display: flex;
		flex-direction: column;
		margin-top: 20rpx;
		margin-bottom: 20rpx;

		.read-more_2_1 {
			padding: 30rpx;
			font-size: 32rpx;
			color: #000;
			text-align: center;
		}

		.read-more_2_2 {
			display: flex;
			justify-content: space-between;
		}

		.read-more_2_3 {
			display: flex;
			justify-content: space-between;
			align-items: center;
			margin-top: 2vh;
			text-align: center;

			.view2 {

				text-align: center;
				height: 45rpx;
				line-height: 45rpx;

				font-size: 28rpx;
			}
		}
	}


	.seedmodular_info {
		padding: 45rpx 30rpx;
		background: #ffffff;
		box-shadow: 2px 4px 12px rgba(0, 0, 0, 0.08);
		margin: 15rpx 0 100rpx 0;
		border-radius: 10rpx;
	}

	.seedmodular_p1 {
		display: flex;
		justify-content: space-between;
		align-items: center;
	}

	.seedlar_text1 {
		font-size: 30rpx;
	}

	.seedlar_text2 {
		font-size: 26rpx;
		color: #999;
		display: flex;
		align-items: center;
	}

	.seedmodular_p2 {
		margin: 25rpx 0;
	}

	.seedmodular_p3 {
		background-color: #fff;
		font-size: 30rpx;
		height: 70rpx;
		line-height: 70rpx;
		text-align: center;
		border-width: 1px;
		border-style: solid;
		border-radius: 35rpx;
		width: 55%;
		margin: 25rpx 22.5%;
	}

	.seleedseed_item {
		display: flex;
		justify-content: space-between;
		// justify-content: space-evenly;
		align-items: center;
		margin: 10rpx 0;
	}

	.seleedseed_item_p1 {
		display: flex;
		justify-content: flex-start;
		align-items: center;
	}

	.seleedseed_item_p2 {
		display: flex;
		justify-content: left;
		font-size: 28rpx;
		color: #999;
	}

	.seleedseed_item_p3 {
		font-size: 28rpx;
		color: #999;
	}

	.seditem_thumbnail {
		width: 60rpx;
		height: 60rpx;
		border-radius: 10rpx;
	}

	.seditem_title {
		font-size: 26rpx;
		color: #999;
		margin-left: 15rpx;
	}

	.address_delti {
		width: auto;
		margin-top: 30rpx;
	}

	.detaed_addrss {
		display: flex;
		justify-content: flex-start;
		align-items: center;
		margin: 20rpx 0;
	}

	.addr_text {
		font-size: 26rpx;
		color: #000;
		margin-left: 15rpx;
		letter-spacing: 2rpx;
	}

	.feed_moudel {
		padding: 25rpx 0;
	}

	.border_nn {
		border-bottom: 1rpx solid #999;
		transform: scaleY(0.3);
		margin-top: 15rpx;
	}

	.feed_modetitle {
		display: flex;
		justify-content: flex-start;
		align-items: center;
	}

	.feed_modetext {
		color: #333;
		font-size: 26rpx;
		margin-left: 15rpx;
	}

	.feed_modetitle2 {
		display: flex;
		justify-content: space-between;
		align-items: center;
		margin-top: 15rpx;
		text-indent: 45rpx;
	}

	.feed_modnnsnt {
		font-size: 28rpx;
		line-height: 28rpx;
		color: #000;
	}

	.leation_suject {
		color: #666;
		font-size: 24rpx;
		margin: 15rpx 0;
	}

	.choosepay {
		margin: 20rpx 0;
	}

	.ann_fle {
		display: flex;
		justify-content: space-between;
		margin: 17.5rpx 0;
		align-items: center;
		color: #000;
		font-size: 28rpx;
	}

	.brodnn {
		margin: 20rpx 0;
		font-size: 24rpx;
		color: #000;
	}

	.unclas {
		width: 45rpx;
		height: 45rpx;
		margin-right: 25rpx;
	}

	.ann_nfjds {
		display: flex;
		justify-content: flex-start;
		align-items: center;
	}

	.unll_pd {
		margin: 15rpx 0;
	}

	.load_window {
		position: fixed;
		top: 50%;
		left: 50%;
		width: 100%;
		transform: translate(-50%, -50%);
		background-color: #ffffff;

		box-shadow: 2px 4px 12px rgba(0, 0, 0, 0.08);
	}
</style>