<template>
	<view class="container">
		<!-- 内容区域 -->
		<view class="content">
			<!-- 收货地址 -->
			<view class="address-section" @click="selectAddress">
				<view class="address-left">
					<image class="location-icon" :src="$baseUrl + 'homepage/Q3Res/settlementCenter_addressIcon.png'"
						mode="aspectFit"></image>
					<view class="address-info">
						<text class="address-text" v-if="hasAddress">{{ fullAddress }}</text>
						<text class="address-text no-address" v-else>请选择收货地址</text>
						<view class="recipient-info" v-if="hasAddress">
							<text class="recipient-name">{{ recipientName }}</text>
							<text class="recipient-phone">{{ recipientPhone }}</text>
						</view>
					</view>
				</view>
				<view class="arrow-icon">
					<image :src="$baseUrl + 'homepage/Q3Res/rightArrowBtn.png'" mode="aspectFill"></image>
				</view>
			</view>

			<!-- 订单信息模块 -->
			<view class="order-info-section">
				<!-- 商品信息 -->
				<view class="product-section">
					<view class="store-info">
						<image class="store-icon" :src="$baseUrl + 'homepage/Q3Res/settlementCenter_shopIcon.png'"
							mode="aspectFit"></image>
						<text class="store-name">飞鹤星妈会</text>
					</view>
					<view class="product-detail">
						<view class="product-image">
							<image v-if="goodsInfo.image" class="product-img" :src="goodsInfo.image" mode="aspectFill">
							</image>
							<image v-else class="product-img" :src="$baseUrl + 'homepage/Q3Res/defaultProductImage.png'"
								mode="aspectFill"></image>
						</view>
						<view class="product-info">
							<text class="product-name">{{ goodsInfo.name }}</text>
							<text class="product-spec" v-if="goodsInfo.spec">净含量 {{ goodsInfo.spec }}</text>
							<view class="price-quantity-row">
								<text class="product-price">{{ goodsInfo.points }}{{ goodsInfo.creditsTypeName }}</text>
								<text class="product-quantity">x{{ goodsInfo.quantity }}</text>
							</view>
						</view>
					</view>
				</view>

				<!-- 配送方式 -->
				<view class="delivery-section">
					<text class="delivery-label" style="font-weight: bold;">配送方式</text>
					<text class="delivery-method">快递邮寄</text>
				</view>

				<!-- 订单备注 -->
				<view class="notes-section">
					<text class="notes-label" style="font-weight: bold;">订单备注</text>
					<text class="notes-hint">选填:对本次交易的说明(最多40字)</text>
					<input class="notes-input" placeholder="请输入订单备注" maxlength="40" v-model="orderNotes" />
				</view>

				<!-- 订单汇总 -->
				<view class="summary-section">
					<text class="summary-label" style="font-weight: bold;">共{{ goodsInfo.quantity }}件</text>
					<text class="summary-price">小计:{{ goodsInfo.points * goodsInfo.quantity }}{{
						goodsInfo.creditsTypeName }}</text>
				</view>
			</view>
		</view>

		<!-- 客服按钮 -->
		<view class="service-btn" @click="handleServiceClick">
			<image class="service-icon" :src="$baseUrl + 'homepage/Q3Res/settlementCenter_serviceBtn.png'"
				mode="aspectFit"></image>
		</view>

		<!-- 底部提交栏 -->
		<view class="bottom-bar">
			<view class="total-info">
				<text class="total-label" style="font-weight: bold;">商品积分</text>
				<text class="total-price">{{ goodsInfo.points * goodsInfo.quantity }}{{ goodsInfo.creditsTypeName
				}}</text>
			</view>
			<button class="submit-btn" @click="submitOrder">提交订单</button>
		</view>
	</view>
	<!-- 兑换确认弹窗 -->
	<view class="modal-overlay" v-if="showConfirmModal" @click="closeModal">
		<view class="modal-content" @click.stop>
			<view class="modal-title">兑换确认</view>
			<view class="modal-message">本次兑换需要消耗{{ goodsInfo.points * goodsInfo.quantity }}{{ goodsInfo.creditsTypeName
				|| '积分' }}</view>
			<view class="modal-buttons">
				<view class="modal-btn cancel-btn" @click="closeModal">
					<image :src="$baseUrl + 'homepage/Q3Res/buyCancelBtn.png'" mode="aspectFill"></image>
				</view>
				<view class="modal-btn confirm-btn" @click="confirmExchange">
					<image :src="$baseUrl + 'homepage/Q3Res/buyComfirmBtn.png'" mode="aspectFill"></image>
				</view>
			</view>
			<view class="modal-disclaimer">{{ isPhysicalGoods() ? '已发货商品非质量问题不退不换' : '兑换完成后不退不换' }}</view>
		</view>
		<!-- 关闭按钮 -->
		<view class="modal-close-btn" @click="closeModal">
			<image :src="$baseUrl + 'homepage/Q3Res/commonCloseBtn1.png'" mode="aspectFit"></image>
		</view>
	</view>
	<!-- 地址添加确认弹窗 -->
	<view class="modal-overlay" v-if="showAddressModal" @click="closeAddressModal">
		<view class="modal-content" @click.stop>
			<view class="modal-title">提示</view>
			<view class="modal-message">您还没有收货地址，是否添加地址？</view>
			<view class="modal-buttons">
				<view class="modal-btn cancel-btn" @click="handleAddressCancel">
					<image :src="$baseUrl + 'homepage/Q3Res/buyCancelBtn.png'" mode="aspectFill"></image>
				</view>
				<view class="modal-btn confirm-btn" @click="confirmAddAddress">
					<image :src="$baseUrl + 'homepage/Q3Res/buyComfirmBtn.png'" mode="aspectFill"></image>
				</view>
			</view>
		</view>
		<!-- 关闭按钮 -->
		<view class="modal-close-btn" @click="closeAddressModal">
			<image :src="$baseUrl + 'homepage/Q3Res/commonCloseBtn1.png'" mode="aspectFit"></image>
		</view>
	</view>
	<!-- 选择地址提示弹窗 -->
	<view class="modal-overlay" v-if="showSelectAddressModal" @click="closeSelectAddressModal">
		<view class="modal-content" @click.stop>
			<view class="modal-title">提示</view>
			<view class="modal-message">请先选择收货地址</view>
			<view class="modal-buttons">
				<view class="modal-btn cancel-btn" @click="closeSelectAddressModal">
					<image :src="$baseUrl + 'homepage/Q3Res/buyCancelBtn.png'" mode="aspectFill"></image>
				</view>
				<view class="modal-btn confirm-btn" @click="handleGoSelectAddress">
					<image :src="$baseUrl + 'homepage/Q3Res/buyComfirmBtn.png'" mode="aspectFill"></image>
				</view>
			</view>
		</view>
		<!-- 关闭按钮 -->
		<view class="modal-close-btn" @click="closeSelectAddressModal">
			<image :src="$baseUrl + 'homepage/Q3Res/commonCloseBtn1.png'" mode="aspectFit"></image>
		</view>
	</view>
</template>

<script>
import { fetchTradeCredits } from '@/api/goods.js';
import { getAddressList } from '@/api/address.js';
import { useHomeStore } from '@/stores/home';
import { jump, JumpType } from '../../utils';

export default {
	data() {
		return {
			orderNotes: '',
			// 订单来源子渠道
			orderSubSource: '',
			// 订单参数
			orderParams: {},
			priceData: null,
			// 地址信息
			selectedAddress: null,
			hasAddress: false,
			fullAddress: '',
			recipientName: '',
			recipientPhone: '',
			// 商品信息
			goodsInfo: {
				name: '',
				spec: '',
				points: 0,
				quantity: 1
			},
			// 商店信息
			homeStore: null,
			// 弹窗状态
			showConfirmModal: false,
			showAddressModal: false,
			showSelectAddressModal: false,
			// 用于防连点
			isSubmitting: false
		}
	},
	onLoad(options) {
		console.log('结算页面参数:', options);

		// 初始化homeStore
		this.homeStore = useHomeStore();

		// 获取订单来源子渠道
		this.orderSubSource = options.orderSubSource || '';
		console.log('订单来源子渠道:', this.orderSubSource);

		// 解析页面参数
		this.parsePageParams(options);

		// 检查收货地址
		this.checkAddress();
	},

	onShow() {
		// 首先尝试从全局状态中获取选中的地址信息
		const selectedAddress = uni.getStorageSync('selectedAddressForSettlement');
		if (selectedAddress) {
			console.log('从全局状态获取选中的地址:', selectedAddress);
			this.selectedAddress = selectedAddress;
			this.hasAddress = true;
			this.orderParams.addressId = selectedAddress.id;
			this.updateAddressDisplay();
			// 清除全局状态中的选中标记，避免重复使用
			uni.removeStorageSync('selectedAddressForSettlement');
			return; // 已经有选中地址，不需要再调用checkAddress
		}

		// 同时也检查页面栈方式（兼容原有逻辑）
		const pages = getCurrentPages();
		if (pages.length >= 2) {
			const prevPage = pages[pages.length - 2];
			// 如果有选中的地址信息，直接使用
			if (prevPage && prevPage.data && prevPage.data.selectedAddressForSettlement) {
				const pageSelectedAddress = prevPage.data.selectedAddressForSettlement;
				console.log('从页面栈获取选中的地址:', pageSelectedAddress);
				this.selectedAddress = pageSelectedAddress;
				this.hasAddress = true;
				this.orderParams.addressId = pageSelectedAddress.id;
				this.updateAddressDisplay();
				// 清除上一页的选中标记，避免重复使用
				prevPage.data.selectedAddressForSettlement = null;
				return; // 已经有选中地址，不需要再调用checkAddress
			}
		}

		// 只有在没有选中地址的情况下才重新检查地址
		// 这样当用户从地址选择页返回但没有选择新地址时，会保留之前已有的地址
		if (!this.selectedAddress || !this.hasAddress) {
			this.checkAddress();
		}

		// 如果已经有地址了，关闭地址弹窗
		if (this.hasAddress && this.showAddressModal) {
			this.closeAddressModal();
		}
	},
	methods: {
		// 解析页面参数
		parsePageParams(options) {
			console.log('结算页面接收到的参数:', options);

			// 基础订单参数
			this.orderParams = {
				gid: options.gid || '',
				skuld: options.skuld || '',
				buy_num: parseInt(options.buy_num) || 1,
				phone: options.phone || '',
				amount: options.amount || '',
				couponId: options.couponId || '',
				remark: options.remark || '',
				addressId: options.addressId || '',
				storeId: options.storeId || '',
				projectId: options.projectId || ''
			};

			// 解析价格数据
			if (options.priceData) {
				try {
					this.priceData = JSON.parse(decodeURIComponent(options.priceData));
					console.log('解析的价格数据:', this.priceData);
				} catch (error) {
					console.error('解析价格数据失败:', error);
				}
			}

			// 设置商品信息
			this.goodsInfo = {
				name: options.goodsName ? decodeURIComponent(options.goodsName) : '',
				spec: options.goodsSpec || options.spec || '',
				points: parseInt(options.points ? decodeURIComponent(options.points) : options.points) || 0,
				quantity: parseInt(options.buy_num) || 1,
				image: options.goodsImage ? decodeURIComponent(options.goodsImage) : '',
				creditsTypeName: options.creditsTypeName ? decodeURIComponent(options.creditsTypeName) : '积分'
			};

			console.log('解析后的商品信息:', this.goodsInfo);
		},

		// 检查收货地址
		async checkAddress() {
			try {
				const response = await getAddressList();
				console.log('地址列表:', response);

				if (response.ok && response.success && response.data && response.data.length > 0) {
					// 查找默认地址
					const defaultAddress = response.data.find(addr => addr.current);
					if (defaultAddress) {
						this.selectedAddress = defaultAddress;
						this.hasAddress = true;
						this.orderParams.addressId = defaultAddress.id;
						this.updateAddressDisplay();
					} else {
						// 没有默认地址，但地址列表有地址
						this.hasAddress = true;
						this.selectedAddress = null;
						this.showAddressModal = true; // 显示选择地址弹窗
					}
				} else {
					// 没有地址，需要添加
					this.hasAddress = false;
					this.selectedAddress = null;
					this.showAddAddressModal();
				}
			} catch (error) {
				console.error('获取地址列表失败:', error);
				this.hasAddress = false;
				this.selectedAddress = null;
			}
		},

		// 更新地址显示
		updateAddressDisplay() {
			if (this.selectedAddress) {
				// 构建完整地址字符串
				const addressParts = [];
				if (this.selectedAddress.province) addressParts.push(this.selectedAddress.province);
				if (this.selectedAddress.city) addressParts.push(this.selectedAddress.city);
				if (this.selectedAddress.area) addressParts.push(this.selectedAddress.area);
				if (this.selectedAddress.detail) addressParts.push(this.selectedAddress.detail);

				this.fullAddress = addressParts.join('');
				this.recipientName = this.selectedAddress.name || '';
				this.recipientPhone = this.selectedAddress.mobile || '';
			}
		},

		// 显示添加地址弹窗
		showAddAddressModal() {
			this.showAddressModal = true;
		},

		// 关闭地址弹窗
		closeAddressModal() {
			this.showAddressModal = false;
		},

		// 关闭选择地址提示弹窗
		closeSelectAddressModal() {
			this.showSelectAddressModal = false;
		},

		// 处理选择地址
		handleGoSelectAddress() {
			this.closeSelectAddressModal();
			this.selectAddress();
		},

		// 处理地址弹窗取消
		handleAddressCancel() {
			this.closeAddressModal();
			// 用户取消，返回上一页
			uni.navigateBack();
		},

		// 确认添加地址
		confirmAddAddress() {
			this.closeAddressModal();
			// 根据是否有地址判断跳转路径
			if (this.hasAddress) {
				// 有地址但没有默认地址，跳转到地址列表选择
				uni.navigateTo({
					url: '/v3/addressList/addressList?from=settlement'
				});
			} else {
				// 没有地址，跳转到添加地址页面
				this.navigateToAddAddress();
			}
		},

		// 跳转到添加地址页面
		navigateToAddAddress() {
			uni.navigateTo({
				url: '/v3/addressList/addressEdit'
			});
		},

		// 选择地址
		selectAddress() {
			if (!this.hasAddress) {
				// 没有地址，跳转到添加地址页面
				this.navigateToAddAddress();
			} else {
				// 有地址，跳转到地址列表页面
				uni.navigateTo({
					url: '/v3/addressList/addressList?from=settlement'
				});
			}
		},

		// 提交订单
		async submitOrder() {
			try {
				// 检查是否有收货地址
				if (!this.hasAddress || !this.selectedAddress) {
					// 显示选择地址提示弹窗
					this.showSelectAddressModal = true;
					return;
				}

				// 显示确认兑换弹窗
				this.showExchangeConfirmModal();
			} catch (error) {
				console.error('提交订单失败:', error);
				uni.showToast({
					title: '提交失败，请重试',
					icon: 'none'
				});
			}
		},

		// 显示确认兑换弹窗
		showExchangeConfirmModal() {
			this.showConfirmModal = true;
		},

		// 关闭弹窗
		closeModal() {
			this.showConfirmModal = false;
		},

		// 确认兑换
		async confirmExchange() {
			// 防连点检查
			if (this.isSubmitting) return;
			this.isSubmitting = true;
			try {
				// 将用户填写的订单备注赋值给remark字段
				this.orderParams.remark = this.orderNotes;
				// 添加订单来源子渠道
				this.orderParams.orderSubSource = this.orderSubSource;
				this.closeModal();
				await this.createOrder();
			} finally {
				// isSubmitting由调用方重置
			}
		},

		// 判断是否为实物商品
		isPhysicalGoods() {
			// 默认返回true，实际应根据商品类型判断
			return true;
		},

		// 创建订单
		async createOrder() {
			try {
				uni.showLoading({
					title: '下单中...'
				});

				console.log('下单参数:', this.orderParams);
				const response = await fetchTradeCredits(this.orderParams);
				console.log('下单结果:', response);

				uni.hideLoading();

				if (response.ok && response.success) {
					// 下单成功，跳转到支付结果页面
					this.navigateToPayResult(true, response.data);
				} else {
					// 下单失败
					this.navigateToPayResult(false, null, response.msg);
				}
			} catch (error) {
				console.error('下单失败:', error);
				uni.hideLoading();
				this.navigateToPayResult(false, null, error.message);
			} finally {
				this.isSubmitting = false;
			}
		},

		// 跳转到支付结果页面
		navigateToPayResult(isSuccess, orderData = null, errorMsg = '') {
			// 添加详细日志，检查orderData的结构
			console.log('订单数据结构:', orderData);

			// 获取订单ID，支持多种可能的数据结构
			let orderId = '';
			if (orderData) {
				// 优先检查常用的订单ID字段
				orderId = orderData.orderNo || '';
			}

			console.log('最终订单ID:', orderId);

			const resultParams = {
				// 基础结果参数
				isSuccess: isSuccess,
				orderId: orderId,

				// 积分信息
				pointsValue: `${this.goodsInfo.points * this.goodsInfo.quantity}`,
				creditsTypeName: this.goodsInfo.creditsTypeName,

				// 商品信息
				goodsName: this.goodsInfo.name,
				goodsImage: this.goodsInfo.image || '',
				goodsSpec: this.goodsInfo.spec || '',
				quantity: this.goodsInfo.quantity,

				// 价格数据
				priceData: JSON.stringify(this.priceData),

				// 订单参数
				gid: this.orderParams.gid,
				skuld: this.orderParams.skuld,
				buy_num: this.orderParams.buy_num,
				// 订单来源子渠道
				orderSubSource: this.orderSubSource
			};

			if (!isSuccess) {
				resultParams.failureReason = errorMsg || '兑换失败，请重试';
			}

			console.log('结算页面跳转支付结果页面参数:', resultParams);

			uni.redirectTo({
				url: `/v3/payResultPage/payResultPage?${this.buildQueryString(resultParams)}`
			});
		},

		// 构建查询字符串
		buildQueryString(params) {
			return Object.keys(params)
				.map(key => `${key}=${encodeURIComponent(params[key])}`)
				.join('&');
		},

		// 处理客服按钮点击
		handleServiceClick() {
			console.log('客服点击');
			const homeStore = useHomeStore();
			const {
				memberId,
				mobile,
				openId,
				unionId
			} = homeStore.homeInfo;
			const customerUrl =
				`https://intelcc-user.icsoc.net/?channelKey=45839e0505554f8c8aea3c7b6259b049&init=1&crmld=${memberId}&mobile=${mobile}&openId=${openId}&unionId=${unionId}`;
			jump({
				type: JumpType.H5,
				url: customerUrl
			});
		}
	}
}
</script>

<style scoped>
/* 弹窗样式 */
.modal-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background-color: rgba(0, 0, 0, 0.5);
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 9999;
	flex-direction: column;
}

.modal-content {
	width: 546rpx;
	height: 418rpx;
	flex-shrink: 0;
	border-radius: 38rpx;
	background: linear-gradient(180deg, #FFE9C5 0%, #FFF 52.87%);
}

.modal-title {


	color: #D3A458;
	text-align: center;
	font-size: 40rpx;
	font-style: normal;
	font-weight: 600;
	line-height: normal;
	margin-top: 62rpx;
}

.modal-message {
	color: var(--B900, #000);
	text-align: center;
	font-size: 28rpx;
	font-style: normal;
	font-weight: 400;
	line-height: normal;
	margin-top: 22rpx;
}

.modal-buttons {
	display: flex;
	gap: 20rpx;
	margin-top: 60rpx;
	justify-content: center;
}

.modal-btn {
	width: 220rpx !important;
	height: 78rpx !important;
	position: relative;
}

.modal-btn image {
	width: 220rpx !important;
	height: 78rpx !important;
}

.cancel-btn {
	border: none;
}

.confirm-btn {
	border: none;
	margin-left: 20rpx;
}

.modal-disclaimer {
	font-size: 24rpx;
	color: #999;
	text-align: center;
	line-height: 1.4;
	margin-top: 40rpx;
}

.modal-close-btn {
	width: 56rpx;
	height: 56rpx;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-top: 80rpx;
}



.container {
	width: 100%;
	min-height: 100vh;
	background-color: #f5f5f5;
	box-sizing: border-box;
}

/* 内容区域 */
.content {
	padding: 30rpx 30rpx 160rpx;
	box-sizing: border-box;
}

/* 收货地址 */
.address-section {
	background-color: #fff;
	padding: 30rpx;
	border-radius: 20rpx;
	margin-bottom: 20rpx;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.address-left {
	display: flex;
	align-items: flex-start;
	flex: 1;
}

.location-icon {
	width: 32rpx;
	height: 32rpx;
	margin-right: 20rpx;
	margin-top: 5rpx;
}

.address-info {
	flex: 1;
	margin-right: 20rpx;
}

.address-text {
	font-size: 28rpx;
	color: #333;
	line-height: 40rpx;
	margin-bottom: 10rpx;
	display: block;
	overflow: hidden;
	font-weight: bold;
}

.address-text.no-address {
	color: #999;
	font-style: italic;
	font-weight: 500;
}

.recipient-info {
	display: flex;
	gap: 20rpx;
}

.recipient-name,
.recipient-phone {
	font-size: 26rpx;
	color: #666;
}

.arrow-icon {
	width: 20rpx;
	height: 32rpx;
}

.arrow-icon image {
	width: 100%;
	height: 100%;
}

/* 订单信息模块 */
.order-info-section {
	background-color: #FFFFFF;
	border-radius: 20rpx;
	margin-bottom: 20rpx;
	overflow: hidden;
}

/* 商品信息 */
.product-section {
	background-color: transparent;
	padding: 30rpx;
	border-radius: 0;
	margin-bottom: 0;
}

.store-info {
	display: flex;
	align-items: center;
	margin-bottom: 20rpx;
}

.store-icon {
	width: 28rpx;
	height: 28rpx;
	margin-right: 10rpx;
}

.store-name {
	font-size: 28rpx;
	color: #333;
	font-weight: 500;
}

.product-detail {
	display: flex;
	align-items: center;
}

.product-image {
	width: 180rpx;
	height: 180rpx;
	background-color: #f0e6d2;
	border-radius: 10rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-right: 20rpx;
	position: relative;
	overflow: hidden;
}

.image-placeholder {
	font-size: 20rpx;
	color: #8b7355;
	text-align: center;
	line-height: 1.2;
}

.product-info {
	flex: 1;
}

.product-name {
	font-size: 28rpx;
	color: #333;
	line-height: 1.4;
	margin-bottom: 12rpx;
	display: block;
	font-weight: 500;
}

.product-spec {
	font-size: 24rpx;
	color: #999;
	margin-bottom: 12rpx;
	display: block;
}

.product-price {
	font-size: 32rpx;
	color: #D3A458;
	font-weight: bold;
	display: inline-block;
	margin-right: 20rpx;
}

.price-quantity-row {
	display: flex;
	align-items: center;
	margin-top: 8rpx;
}

.product-quantity {
	margin-left: 240rpx;
	font-size: 24rpx;
	color: #999;
}

/* 配送方式 */
.delivery-section {
	background-color: transparent;
	padding: 0 30rpx 30rpx;
	border-radius: 0;
	margin-bottom: 0;
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.delivery-label {
	font-size: 28rpx;
	color: #A8A8A8;
}

.delivery-method {
	font-size: 28rpx;
	color: #666;
}

/* 订单备注 */
.notes-section {
	background-color: transparent;
	padding: 0 30rpx 30rpx;
	border-radius: 0;
	margin-bottom: 0;
}

.notes-label {
	font-size: 28rpx;
	color: #333;
	margin-bottom: 10rpx;
	display: inline-block;
}

.notes-hint {
	font-size: 24rpx;
	color: #A8A8A8;
	margin-bottom: 10rpx;
	margin-left: 20rpx;
	display: inline-block;
}

.notes-input {
	width: 100%;
	height: 92rpx;
	border: none;
	border-radius: 10rpx;
	padding: 0 20rpx;
	font-size: 28rpx;
	color: #333;
	box-sizing: border-box;
	background-color: #f8f8f8;
}

/* 订单汇总 */
.summary-section {
	background-color: transparent;
	padding: 0 30rpx 30rpx;
	border-radius: 0;
	margin-bottom: 0;
	display: flex;
	align-items: center;
	justify-content: flex-end;
}

.summary-label {
	font-size: 28rpx;
	color: #333;
	margin-right: 20rpx;
}

.summary-price {
	font-size: 28rpx;
	color: #D3A458;
	font-weight: bold;
}

/* 客服按钮 */
.service-btn {
	position: fixed;
	bottom: 220rpx;
	right: 30rpx;
	width: 96rpx;
	height: 96rpx;
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 100;
	box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.2);
}

.service-icon {
	width: 96rpx;
	height: 96rpx;
}

/* 底部提交栏 */
.bottom-bar {
	position: fixed;
	bottom: 0;
	left: 0;
	right: 0;
	background-color: #fff;
	padding: 40rpx 20rpx 60rpx 20rpx;
	box-sizing: border-box;
	box-shadow: 0 -2rpx 10rpx rgba(0, 0, 0, 0.1);
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: 100%;
}

.total-info {
	width: 60%;
	display: flex;
	flex-direction: row;
	margin-left: 20rpx;
	margin-right: 20rpx;
	align-items: center;
}

.total-label {
	font-size: 24rpx;
	color: #000;
	font-weight: bold;
}

.total-price {
	font-size: 32rpx;
	color: #D3A458;
	font-weight: bold;
	margin-left: 20rpx;
	display: block;
}

.submit-btn {
	width: 248rpx;
	height: 74rpx;
	background-color: #D3A458;
	color: #fff;
	font-size: 30rpx;
	border-radius: 37rpx;
	border: none;
	line-height: 74rpx;
	padding: 0;
	font-weight: bold;
}

.submit-btn:active {
	background-color: #d4902b;
}
</style>
