qd_81fang/pages/intergalShop/orderDetail.vue

<template>
	<block>
		<!-- <login @onLoginBack="onLoginBack"></login> -->

		<view class="content">
			<view class="orderStatus">
				<image :src="
                        info.order_status == 1
                            ? 'https://ymyun-oss.oss-cn-hangzhou.aliyuncs.com/yidu_tc/public/upload/12/8/f05de1ad262ae8a303f5b38ca2419eae.png'
                            : info.order_status == 2
                            ? 'https://ymyun-oss.oss-cn-hangzhou.aliyuncs.com/yidu_tc/public/upload/12/8/f05de1ad262ae8a303f5b38ca2419eae.png'
                            : info.order_status == 3
                            ? 'https://ymyun-oss.oss-cn-hangzhou.aliyuncs.com/yidu_tc/public/upload/12/8/74354f7d56ad4043e279760e09307bef.png'
                            : info.order_status == 4
                            ? 'https://ymyun-oss.oss-cn-hangzhou.aliyuncs.com/yidu_tc/public/upload/12/8/f05de1ad262ae8a303f5b38ca2419eae.png'
                            : info.order_status == 5
                            ? 'https://ymyun-oss.oss-cn-hangzhou.aliyuncs.com/yidu_tc/public/upload/12/8/cb6d9cec19387616fa955f95d8470bc5.png'
                            : info.order_status == 6
                            ? 'https://ymyun-oss.oss-cn-hangzhou.aliyuncs.com/yidu_tc/public/upload/12/8/f05de1ad262ae8a303f5b38ca2419eae.png'
                            : info.order_status == 0 && info.receive_type == 2
                            ? 'https://ymyun-oss.oss-cn-hangzhou.aliyuncs.com/yidu_tc/public/upload/12/8/74354f7d56ad4043e279760e09307bef.png'
                            : info.order_status == 0 && info.receive_type == 1
                            ? 'https://ymyun-oss.oss-cn-hangzhou.aliyuncs.com/yidu_tc/public/upload/12/8/74354f7d56ad4043e279760e09307bef.png'
                            : ''
                    "></image>
				<view>
					{{
                        info.order_status == 1
                            ? '审核通过'
                            : info.order_status == 2
                            ? '已退款'
                            : info.order_status == 3
                            ? '拒绝退款'
                            : info.order_status == 4
                            ? '已核销'
                            : info.order_status == 5
                            ? '已发货'
                            : info.order_status == 6
                            ? '已完成'
                            : info.order_status == 0 && info.receive_type == 2
                            ? '待发货'
                            : info.order_status == 0 && info.receive_type == 1
                            ? '待核销'
                            : ''
                    }}
				</view>
			</view>

			<!-- <view class="p-common iflexC">
	<text>订单号：{{info.order_no}}</text>

	<text class="p-con" wx:if="{{info.order_status==0&&info.receive_type==2}}">待发货</text>
	<text class="p-con" wx:if="{{info.order_status==0&&info.receive_type==1}}">待核销</text>
	<text class="p-con" wx:elif="{{info.order_status==1}}">审核通过</text>
	<text class="p-con" wx:elif="{{info.order_status== 2}}">已退款</text>
	<text class="p-con" wx:elif="{{info.order_status== 3}}">拒绝退款</text>
	<text class="p-con" wx:elif="{{info.order_status== 4}}">已核销</text>
	<text class="p-con" wx:elif="{{info.order_status== 5}}">已发货</text>
	<text class="p-con" wx:elif="{{info.order_status== 6}}">已完成</text>

</view> -->

			<view class="p-common ibetween" v-if="info.receive_type == 1">
				<text>手机号码 : {{ info.receiver_mobile }}</text>
				<view class="hxCode" @tap="showHxcode">
					<image mode="widthFix"
						src="https://ymyun-oss.oss-cn-hangzhou.aliyuncs.com/yidu_tc/public/upload/12/8/6c8fc754eba8870fb95b18baaedff277.png">
					</image>
					<view>核销码</view>
				</view>
			</view>

			<view class="p-common" v-if="info.receive_type == 2">
				<view class="p-list icenterY">
					<text>手机号码</text>
					<text class="cPhone">{{ info.receiver_mobile }}</text>
				</view>
				<view class="p-list">
					<text>收货地址</text>
					<text class="cArea">{{ info.receiver_area }}</text>
					<view class="cDetailAddress">{{ info.receiver_address }}</view>
				</view>
			</view>

			<!--           <view class="p-common iflexC" v-if="info.receive_type == 2">
                <text>物流信息</text>
                <text class="p-con">快递单号：{{ info.deliver_no || '暂无物流信息' }}</text>
                <view class="p-con">
                    <text>快递名称：{{ info.send_comp || '暂无物流信息' }}</text>
                </view>
            </view> -->

			<view class="shopInfo bgfff" v-if="info.hexiao_center">
				<view class="ibetween">
					<view class="shopTop-name over_2">{{ info.hexiao_center.name }}</view>
				</view>

				<!--           <view class="shopBot ifend">
                    <view class="flex1 iflexC">
                        <view class="l-shopTime">时间：{{ info.hexiao_center.job_time }}</view>
                        <view class="l-shopAddress over_1">地址：{{ info.hexiao_center.address }}</view>
                    </view>

                    <view class="iflex">
                        <view
                            class="shoploc iflexC aliCen"
                            :data-address="info.hexiao_center.address"
                            @tap="toPage"
                            :data-url="'location:' + info.hexiao_center.lat + ', ' + info.hexiao_center.lng + ', ' + info.hexiao_center.name"
                        >
                            <image src="https://ymyun-oss.oss-cn-hangzhou.aliyuncs.com/yidu_tc/public/upload/12/8/b5d708429fd9e35f4d1c164d1147a7fb.png" mode="widthFix"></image>
                        </view>
                        <view class="shopSu"></view>
                        <view class="shoploc iflexC aliCen" @tap="toPage" :data-url="'tel:' + info.hexiao_center.phone">
                            <image src="https://ymyun-oss.oss-cn-hangzhou.aliyuncs.com/yidu_tc/public/upload/12/8/05d336706e46151d602e4287863b9d3a.png" mode="widthFix"></image>
                        </view>
                    </view>
                </view> -->
			</view>

			<!-- <msg status="99" xmdata="{{info.hexiao_center}}" wx:if="{{info.hexiao_center.id}}" styles='margin:0rpx 0px 20rpx 0px;background:#fff;' /> -->

			<view class="p-common iflex radiuBot">
				<image class="p-goodsImg" :src="info.goods_pic"></image>
				<view class="p-goods">
					<text class="p-goodsName bold">{{ info.goods_name }}</text>
					<text class="p-goodsTips">{{ info.good_info ? info.good_info : '' }}</text>
					<view class="p-sku ibetween">
						<!-- <text class="p-red"><text wx:if="{{info.pay_money}}">￥{{info.pay_money}} +</text> {{info.integral}}{{unit}}</text> -->
						<text class="p-con">×1</text>
					</view>
				</view>
			</view>

			<view class="p-common radiuTop">
				<view class="ibetween p-list icenterY">
					<text>商品价格：</text>
					<text class="p-con">￥{{ info.pay_money ? info.pay_money : 0 }}</text>
				</view>
				<view class="ibetween p-list">
					<text>商品{{ unit }}：</text>
					<text class="p-con">{{ info.integral }} {{ unit }}</text>
				</view>
				<view class="ibetween p-list">
					<text>运费：</text>
					<text class="p-con">￥{{ info.freight ? info.freight : 0 }}</text>
				</view>
				<view class="ibetween p-list icenterY">
					<text>支付方式：</text>
					<text class="p-con">
						<text v-if="info.freight || info.pay_money">现金+</text>
						{{ unit }}支付
					</text>
				</view>
				<view class="ibetween p-list">
					<text>实际支付：</text>
					<text class="p-con colorActive">
						<text class="p-red">
							<text v-if="info.pay_money">￥{{ info.pay_money }}+</text>
							{{ info.integral }}
						</text>
						{{ unit }}
					</text>
				</view>
			</view>

			<view class="p-common iflex">
				<text class="message">买家留言：</text>
				<text>{{ info.user_mark ? info.user_mark : '暂无留言' }}</text>
			</view>

			<view class="p-common" v-if="info.is_comment == 1">
				<view class="p-list icenterY">
					<text>买家评价：</text>
					<text class="p-con">{{ info.inorder_comment ? info.inorder_comment.content : '暂无评价' }}</text>
				</view>
				<!-- <view class="p-list icenterY">
    <text>商家回复：</text>
    <text class="p-con">{{info.reply ? info.reply : '暂无回复'}}</text>
  </view> -->
			</view>

			<view class="orderInfo">
				<view class="orderInfoTip">订单信息</view>

				<view class="orderItem">
					<view>下单编号:</view>
					<view>{{ info.order_no }}</view>
					<view @tap="copy" :data-on="info.order_no">复制</view>
				</view>

				<view class="orderItem">
					<view>下单时间:</view>
					<view>{{ info.create_time }}</view>
				</view>
			</view>
		</view>

		<view class="p-footer iflex isFixed icenterY"
			v-if="info.order_status == 0 || info.order_status == 4 || info.order_status == 6 || info.order_status == 5">
			<!-- <button wx:if="{{info.integral_money}}" bindtap="backMoney">申请退款</button> -->
			<button @tap="toPage" data-url="/yidu_tc/pages/comment/index?itype=1" :data-order_id="info.order_no"
				class="activeBtn1" v-if="(info.order_status == 6 || info.order_status == 4) && info.is_comment == 0">
				去评论
			</button>
			<!-- <button class="p-btn1" wx:if="{{!info.integral_money && info.is_deliver == 3 && info.is_comment == 1}}" style="opacity: 0.5">订单已完成</button> -->
			<button @tap="confirm" v-if="info.receive_type == 2 && info.order_status == 5"
				class="activeBtn1">确认收货</button>

			<button @tap="lookOrder" v-if="info.receive_type == 2 && info.order_status == 5"
				class="activeBtn2">查看物流</button>

			<button @tap="hx_btn" v-if="info.receive_type == 1 && info.order_status == 0 && info.is_hexiao"
				class="activeBtn1">确认核销</button>

			<button @tap="getMovie" v-if="info.order_status == 0 && info.is_film == 1" class="activeBtn1">立即领取</button>

			<button v-if="info.order_status == 0 && info.receive_type == 2" class="activeBtn2">待发货</button>

			<button v-if="info.order_status == 0 && info.receive_type == 1 && !info.is_hexiao"
				class="activeBtn1">待核销</button>

			<button v-if="info.order_status == 2">已退款</button>
		</view>

<!-- 		<imask :show="showCode" :zindex="30"> -->
			<view class="mengban" v-if="showCode">
				<view class="allBox">
					<view class="boxWrap">
						<view class="codeInfo">
							<image :src="info.goods_pic"></image>
							<view class="goodBoxInfo">
								<view>{{ info.hexiao_center.name }}</view>
								<view>{{ info.goods_name }}</view>
							</view>
						</view>

						<view class="codeWrap">
							<view class="code1">
								<view></view>
								<view>核销码</view>
								<view></view>
							</view>
							<image :src="hxcode" class="hxcodeImg"></image>
							<view class="codeTip">请把核销码出示给商家</view>
						</view>
					</view>

					<view class="download" @tap="download">
						<view>下载保存图片</view>
						<image
							src="https://ymyun-oss.oss-cn-hangzhou.aliyuncs.com/yidu_tc/public/upload/12/8/fb053b002967d127bde32a542c5a9794.png">
						</image>
					</view>

					<image @tap="closeBox" class="closeBox"
						src="https://ymyun-oss.oss-cn-hangzhou.aliyuncs.com/yidu_tc/public/upload/12/8/b9fd3c42c6e5116ecced6ed92864221a.png">
					</image>
				</view>
			</view>
		<!-- </imask> -->
	</block>
</template>

<script>
	var app = getApp();


	export default {
		data() {
			return {
				info: {
					admin_id: 0,
					create_time: "2022-03-26 15:45:59",
					deliver_no: "",
					deliver_time: null,
					freight: "0.00",
					goods_id: 1520,
					goods_name: "寒铁10件套美容工具IRON-0100 IRON-0100",
					goods_pic: "https://ymyun-oss.oss-cn-hangzhou.aliyuncs.com/yidu_tc/public/upload/12/2487/f04456f1d7360742a070f36b0901e0a7.png",
					hexiao_center: [],
					id: 1182,
					inorder_comment: null,
					integral: "0.00",
					is_comment: 0,
					is_deliver: 0,
					is_film: 0,
					is_hexiao: false,
					order_no: "31038957705405027625933",
					order_status: 0,
					pay_money: "0.00",
					pay_time: "2022-03-26 15:45:59",
					receive_type: 2,
					receiver_address: "水南镇长征大道赣州商会大厦(章贡区长征大道31号)27楼",
					receiver_area: "江西省赣州市章贡区",
					receiver_mobile: "18779615160",
					receiver_name: "李路根",
					region_id: 159,
					send_comp: "",
					sku: "中号型",
					ssq_code: "360702",
					user_mark: "",
					showCode:true
				},

				// 订单详情
				unit: '积分',

				inorder_comment: '',
				showCode: false,
				hxcode: '',
				order_id: '',
				uid: '',
				show_login: false
			};
		}
		/**
		 * 生命周期函数--监听页面加载
		 */
		,
		onLoad: function(options) {
			// if (options.scene) {
			//     this.setData({
			//         order_id: options.scene
			//     });
			// } else {
			//     this.setData({
			//         order_id: options.order_id
			//     });
			// }

			// let that = this;
			// let td = that;
			// let u = app.globalData.getCache('userinfo').uid;
			// if (u) {
			//     console.log('有uid');
			//     that.setData({
			//         uid: u
			//     });
			//     that.getInfo();
			// } else {
			//     that.setData({
			//         show_login: true
			//     });
			// }
		},
		/**
		 * 生命周期函数--监听页面初次渲染完成
		 */
		onReady: function() {},
		/**
		 * 生命周期函数--监听页面显示
		 */
		onShow: function() {},
		/**
		 * 生命周期函数--监听页面隐藏
		 */
		onHide: function() {},
		/**
		 * 生命周期函数--监听页面卸载
		 */
		onUnload: function() {},
		/**
		 * 页面相关事件处理函数--监听用户下拉动作
		 */
		onPullDownRefresh: function() {
			this.getInfo();
		},
		/**
		 * 页面上拉触底事件的处理函数
		 */
		onReachBottom: function() {},
		/**
		 * 用户点击右上角分享
		 */
		onShareAppMessage: function() {},
		methods: {
			download() {
				saveImgs(this.hxcode, function() {
					console.log('保存成功');
				});
			},

			closeBox() {
				this.setData({
					showCode: false
				});
			},

			copy(e) {
				uni.setClipboardData({
					data: e.currentTarget.dataset.on,
					success: function(res) {
						uni.showToast({
							title: '复制成功',
							icon: 'none'
						});
					}
				});
			},

			lookOrder() {
				uni.navigateTo({
					url: `/pages/other/logistics/logistics?phone=${this.info.receiver_mobile}&no=${this.info.deliver_no}`
				});
			},

			onLoginBack: function(e) {
				var u = app.globalData.getCache('userinfo').uid;

				if (u && this.show_login) {
					this.setData({
						uid: u,
						show_login: false
					});
					this.getInfo();
				}
			},

			getMovie() {
				uni.navigateTo({
					url: `/pages/movie/pages/receive/index?id=${this.order_id}&channel=integral`
				});
			},

			hx_btn() {
				var that = this;
				uni.showModal({
					title: '提示',
					content: '确认核销？',

					success(res) {
						if (res.confirm) {
							console.log('用户点击确定');
							a.get(
								'regionintegral/hexiao', {
									uid: app.globalData.getCache('userinfo').uid,
									order_id: that.order_id
								},
								function(r) {
									if (r.code) {
										a.alert(r.msg);
									} else {
										uni.showToast({
											title: '核销成功'
										});
										setTimeout(function() {
											uni.redirectTo({
												url: '/pages/operate/logs/logs'
											});
										}, 1500);
									}
								}
							);
						} else {
							if (res.cancel) {
								console.log('用户点击取消');
							}
						}
					}
				});
			},

			confirm() {
				// 确认收货
				const that = this;
				a.get(
					'Integral/confirm_order', {
						uid: app.globalData.getCache('userinfo').uid,
						order_id: this.order_id
					},
					function(res) {
						if (res.code == 0) {
							uni.showToast({
								title: '确认成功'
							});
							setTimeout(function() {
								uni.redirectTo({
									url: '/pages/operate/logs/logs'
								});
							}, 1500);
						} else {
							a.alert(res.msg);
						}
					}
				);
			},

			backMoney() {
				// 申请退款
				var that = this;
				a.confirm('是否确定申请退款？', function(res) {
					a.get(
						'', {
							uid: app.globalData.getCache('userinfo').uid,
							id: this.order_id
						},
						function(res) {
							console.log(12122);
						}
					);
				});
			},

			showHxcode() {
				uni.showLoading({
					title: '正在加载'
				});
				const that = this;
				a.get(
					'regionintegral/qrcode', {
						uid: app.globalData.getCache('userinfo').uid,
						order_id: this.order_id
					},
					function(res) {
						uni.hideLoading();
						that.setData({
							hxcode: res.info,
							showCode: true
						});
					}
				);
			},

			getInfo() {
				const that = this;
				a.get(
					'regionintegral/orderDetail', {
						uid: app.globalData.getCache('userinfo').uid,
						order_id: this.order_id
					},
					function(res) {
						let data = res.info.data;
						uni.stopPullDownRefresh();
						console.log(data);
						data.freight = Number(data.freight);
						data.integral_money = Number(data.integral_money);
						data.pay_money = Number(data.pay_money);
						that.setData({
							info: data
						}); // that.getComment(data.goods_id)
					}
				);
			},

			// getComment(goods_id){
			//   const that = this
			//   a.get('regionintegral/comment', {
			//     uid: app.getCache('userinfo').uid,
			//     goods_id: goods_id
			//   }, function (res) {
			//     that.setData({
			//      inorder_comment: res.info
			//     })
			//   })
			// },
			toPage(e) {
				app.globalData.toPage(e);
			}
		}
	};
</script>
<style>
	/* yidu_tc/pages/jifen/integral/orderDetail/orderDetail.wxss */
	page {
		background: #f4f4f4;
	}

	.content {
		width: 100%;
		box-sizing: border-box;
		padding: 20rpx 20rpx 120rpx;
	}

	.p-common {
		border-radius: 20rpx;
		padding: 26rpx 30rpx;
		margin-bottom: 20rpx;
		background: white;
		/* width: calc(100% - 132rpx); */
		position: relative;
	}

	.p-common input {
		width: 74%;
	}

	.p-img {
		height: 44rpx;
		width: 44rpx;
		margin-right: 8rpx;
		color: #333;
		vertical-align: top;
	}

	.shareicon {
		position: absolute;
		right: 30rpx;
		top: calc(50% - 8px);
	}

	.p-goods {
		width: 72%;
	}

	.p-goodsImg {
		height: 128rpx;
		width: 128rpx;
		margin-right: 18rpx;
		flex-shrink: 0;
	}

	.p-goodsName {
		text-overflow: ellipsis;
		white-space: nowrap;
		overflow: hidden;
		display: block;
		font-size: 32rpx;
	}

	.p-goodsTips {
		color: #666;
		font-size: 24rpx;
	}

	.p-con {
		font-size: 24rpx;
		color: #666;
	}

	.p-list {
		border-bottom: 1px solid #f2f2f2;
		padding: 26rpx 0;
	}

	.p-list:first-child {
		padding-top: 0;
	}

	.p-list:last-child {
		border: none;
		padding-bottom: 0;
	}

	.p-red {
		color: #fe6000;
		font-size: 28rpx;
		font-weight: 700;
	}

	.isFixed {
		position: fixed;
		bottom: 32rpx;
	}

	.p-total {
		width: 50%;
		text-align: center;
	}

	.p-btn {
		border: none;
		background: #f62e2e;
		color: white;
		height: 100%;
		border-radius: 0 20rpx 20rpx 0;
		width: 50%;
	}

	.p-common:last-child {
		padding: 0;
		width: calc(100% - 72rpx);
		margin-bottom: 0;
	}

	.bold {
		font-weight: bold;
	}

	input {
		margin-top: -4rpx;
	}

	.p-icon {
		height: 30rpx;
		width: 30rpx;
		margin-right: 8rpx;
		vertical-align: center;
	}

	.p-sku {
		position: absolute;
		bottom: 20rpx;
		width: calc(72% - 30rpx);
	}

	.message {
		flex-shrink: 0;
	}

	.p-footer {
		position: fixed;
		bottom: 0;
		width: 100%;
		left: 0;
		background: white;
		height: 100rpx;
		display: flex;
		flex-direction: row-reverse !important;
	}

	button {
		width: 188rpx;
		border-radius: 40rpx;
		border: 1px solid #999;
		background: none;
		color: #666;
		font-size: 28rpx;
		margin-right: 22rpx;
		margin-left: 0;
	}

	button::after {
		border: none;
	}

	.p-common:last-child {
		padding: 26rpx 30rpx !important;
		width: calc(100% - 60rpx);
		margin-bottom: 0;
	}

	.orderStatus {
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 12rpx 0 30rpx;
	}

	.orderStatus>image {
		width: 46rpx;
		height: 46rpx;
		margin-top: 8rpx;
	}

	.orderStatus>view {
		font-size: 35rpx;
		font-weight: 700;
		color: #333333;
		margin-left: 16rpx;
	}

	.hxCode {
		display: flex;
		align-items: center;
	}

	.hxCode>view {
		color: #fe6b05;
		font-size: 28rpx;
	}

	.hxCode>image {
		width: 28rpx;
		margin-right: 10rpx;
		margin-top: 4rpx;
	}

	.cPhone {
		font-size: 28rpx;
		color: #333333;
		margin-left: 30rpx;
	}

	.cArea {
		font-size: 28rpx;
		color: #333333;
		margin-left: 30rpx;
	}

	.cDetailAddress {
		color: #666666;
		margin-top: 12rpx;
	}

	.shopInfo {
		padding: 24rpx 24rpx 30rpx 24rpx;
		margin: 18rpx 0rpx;
		border-radius: 20rpx;
	}

	.shopTop-name {
		font-size: 28rpx;
		width: 500rpx;
		color: #000;
	}

	.shopTop-btn {
		width: 83rpx;
		height: 35rpx;
		display: flex;
		justify-content: center;
		align-items: center;
		color: #fd6000;
		border: 1px solid #fd6000;
		border-radius: 30rpx;
		font-size: 25rpx;
	}

	.shopBot {
		margin-top: 30rpx;
	}

	.shopTD {
		flex: 1;
		display: flex;
		flex-direction: column;
	}

	.l-shopTime,
	.l-shopAddress {
		font-size: 25rpx;
		color: #666;
		line-height: 1;
	}

	.l-shopAddress {
		width: 410rpx;
		margin-top: 18rpx;
	}

	.shoploc:first-of-type {
		max-width: 104rpx;
	}

	.shoploc {
		font-size: 20rpx;
		color: #999;
		line-height: 1;
	}

	.shoploc image {
		width: 42rpx;
		height: 42rpx;
		margin-bottom: 12rpx;
	}

	.shopSu {
		height: 48rpx;
		width: 1rpx;
		background: #999999;
		margin: 0 38rpx;
	}

	.radiuBot {
		border-radius: 20rpx 20rpx 0 0 !important;
		margin-bottom: 0;
	}

	.radiuTop {
		border-radius: 0 0 20rpx 20rpx !important;
	}

	.colorActive {
		color: #fe6000;
	}

	.orderInfo {
		margin-top: 20rpx;
		background: #fff;
		border-radius: 20rpx;
		padding-bottom: 20rpx;
	}

	.iflexC {
		display: flex;
		flex-direction: column
	}

	.orderInfoTip {
		padding: 30rpx 30rpx 26rpx 30rpx;
		box-sizing: border-box;
		font-weight: 700;
		font-size: 28rpx;
		color: #333333;
		border-bottom: 1px solid #dcdcdc;
		margin-bottom: 30rpx;
	}

	.orderItem {
		padding: 0rpx 0 0rpx 30rpx;
		display: flex;
		align-items: center;
		margin: 20rpx 0;
	}

	.orderItem>view:nth-child(1) {
		font-size: 26rpx;
		color: #999999;
	}

	.orderItem>view:nth-child(2) {
		font-size: 26rpx;
		color: #333;
		margin-left: 8rpx;
	}

	.orderItem>view:nth-child(3) {
		width: 72rpx;
		height: 34rpx;
		line-height: 34rpx;
		text-align: center;
		border-radius: 12rpx;
		font-size: 25rpx;
		color: #000;
		border: 1px solid #898989;
		margin-left: 22rpx;
	}

	.activeBtn1 {
		background: linear-gradient(to right, #fda401, #fe6b05);
		color: #fff !important;
		border: none;
	}

	.activeBtn2 {
		color: #fe6b00 !important;
		border: 1px solid #fe6b00;
	}

	.boxWrap {
		width: 524rpx;
		border-radius: 30rpx;
		background: #fff;
	}

	.codeInfo {
		box-sizing: border-box;
		display: flex;
		align-items: center;
		background: linear-gradient(to right, #fda401, #fe6b05);
		padding: 35rpx 53rpx 27rpx 17rpx;
		border-radius: 12rpx 12rpx 0 0;
	}

	.codeInfo>image {
		width: 86rpx;
		height: 86rpx;
		border-radius: 12rpx;
	}

	.goodBoxInfo {
		color: #fff;
		margin-left: 18rpx;
	}

	.goodBoxInfo>view:nth-child(1) {
		font-size: 28rpx;
		color: #ffffff;
		font-weight: 700;
	}

	.goodBoxInfo>view:nth-child(2) {
		font-size: 28rpx;
		color: #ffffff;
		overflow: hidden;
		text-overflow: ellipsis;
		display: -webkit-box;
		-webkit-line-clamp: 2;
		-webkit-box-orient: vertical;
	}

	.codeWrap {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		padding: 33rpx 0;
	}

	.code1 {
		display: flex;
		align-items: center;
	}

	.code1>view:nth-child(1),
	.code1>view:nth-child(3) {
		width: 74rpx;
		height: 1px;
		background: #333333;
	}

	.code1>view:nth-child(2) {
		font-size: 24rpx;
		color: #333;
		font-weight: 700;
		margin: 0 20rpx;
	}

	.hxcodeImg {
		width: 340rpx;
		height: 340rpx;
		margin: 20rpx 0;
	}

	.codeTip {
		font-size: 24rpx;
		color: #333;
	}

	.download {
		width: 351rpx;
		height: 82rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		background: linear-gradient(to right, #fda401, #fe6b05);
		border-radius: 40rpx;
		margin-top: 20rpx;
	}

	.download>view {
		font-size: 31rpx;
		color: #fff;
	}

	.download>image {
		width: 30rpx;
		height: 30rpx;
		margin-left: 24rpx;
	}

	.allBox {
		display: flex;
		flex-direction: column;
		align-items: center;
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%,-50%);
		}

	.closeBox {
		width: 50rpx;
		height: 50rpx;
		margin-top: 30rpx;
	}

	.iflex {
		display: flex;
	}

	.icentery,
	.icenterY {
		display: flex;
		align-items: center;
		flex-direction: row;
	}

	.ibetween {
		display: flex;
		justify-content: space-between
	}
		
	.mengban{
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background: rgba(0,0,0,0.7);
	}
</style>