<template>
    <view class="container">
        <block v-if="orderInfo">
            <view class="head-block">
                <!-- 	<view class="">
				   {{orderInfo.state==3?'取单号:'+orderInfo.id:''}}
				</view> -->
				
                <view v-if="orderInfo.is_pay == 1 && orderInfo.state!=2" class="">
						<view class="pick_up flex-center" :style="{'background':setColor}">
							  <view style="display: inline-block;">
								<view class="title ft24">取单号</view>
								<view class="desc ft40">{{ orderInfo.number||orderInfo.id }}</view>
							  </view>
						</view>
                </view>
				
                <view class="order-status-block flex flex-nowarp flex-x-center flex-y-center">
                    <!-- <i class="iconfont icon-lujing order-status-icon" :style="{color:setColor}"></i> -->
                    <view>
                        <view class="status-name" :style="{color:setColor}">

                            <view v-if="orderInfo.is_send!=1">
                                {{
								orderInfo.order_status== 0?'待支付':orderInfo.order_status== 1?'待配送':
								orderInfo.order_status== 2?'配送中':orderInfo.order_status== 3?'已完成':
								orderInfo.order_status== 4?'已取消':
								orderInfo.order_status== 5?'已退款':
								orderInfo.order_status== 6?'部分退款':
								orderInfo.order_status== 7?'待自提':''
							}}
                            </view>

                            <block
                                v-if="orderInfo.is_pay == 1&&orderInfo.state==2&&orderInfo.cancel_status!=2&&orderInfo.is_dd==1&&orderInfo.is_send==1">
                                {{
								 dadaInfo.statusCode==1?'待接单':
								 dadaInfo.statusCode==2?'骑士前往商家取货':
								 dadaInfo.statusCode==3?'配送中':
								 dadaInfo.statusCode==4?'已完成':
								 dadaInfo.statusCode==5?'已取消':
								 dadaInfo.statusCode==8?'指派单':
								 dadaInfo.statusCode==9?'妥投异常之物品返回中':
								 dadaInfo.statusCode==10?'妥投异常之物品返回完成':
								 dadaInfo.statusCode==100?'骑士到店':
								 dadaInfo.statusCode==1000?'创建达达运单失败':''
								}}
                            </block>

                            <view @click="bindOpen"
                                v-if="orderInfo.is_pay == 1&&orderInfo.state==2&&orderInfo.cancel_status!=2&&orderInfo.is_dd==2&&orderInfo.is_send==1">
                                {{
									 juheInfo.status_desc
								}}
								<text class="iconfont icon-jiantou" style="margin-left: 15rpx;"></text>
							</view>

						</view>

						<view class="status-tips">感谢您的购买</view>
					</view>
				</view>

			<!-- 餐后付款使用优惠劵 -->
			    <navigator v-if="coupon_list.length>0 && orderInfo.is_pay == 0 && orderInfo.type==2&& 
					orderInfo.order_status!=4 && orderInfo.cancel_status!=2" hover-class="none"
					:url="`../use-coupon-list/use-coupon-list?total_price=${orderInfo.pay_price}&check_index=2`" class="Coupon">
					<view class="flex-center">
						<view class="Coupon-icon iconfont icon-youhuijuan-01"></view>
						<view class="flex-y-center" v-if="coupon_id">
							<text style="color: red;">优惠劵-￥{{coupon_price}}</text>
							<text class="iconfont icon-jiantou"></text>
						</view>
						<view class="flex-y-center" v-else>
							<text style="color: red;">您有未使用优惠劵{{coupon_list.length}}张</text>
							<text class="iconfont icon-jiantou"></text>
						</view>
					</view>
					<view class="flex-center" v-if="coupon_id" style="margin-top: 10rpx;">
						支付金额：<text
							style="font-size: 35rpx;color: red;">￥{{ (orderInfo.pay_price - Number(coupon_price)).toFixed(2)}}</text>
					</view>
				</navigator>

				<view class="btn-block flex flex-nowarp  flex-y-center">
					<navigator url="/pages/index/index" open-type="reLaunch" class="btn btn1"
						v-if="orderInfo.is_pay == 1 || orderInfo.order_status== 4 || orderInfo.cancel_status==2"
						:style="{'background-color':setColor}">继续下单</navigator>
					<view class="btn btn3" @click="onPrinterStatusChange" :style="{'background-color':setColor}" v-else>
						立即支付</view>
					<view @click="tel" class="btn btn2" :style="{'background-color':setColor}">
						联系商家
					</view>
				</view>
			</view>
			<view class="main">
				<view class="page-block">
					<view class="page-title  box-pack-between flex-y-center" @click="getNavigation"
						style="height: auto;line-height: 1;padding: 30rpx 0;">
						<view class="">
							<view> {{orderInfo.storename}}
							<!-- （{{orderInfo.type == 3 ?'自助结账':orderInfo.tablename}}） -->
							<block v-if="orderInfo.type == 3">
							  ({{orderInfo.type == 3?'自助结账':orderInfo.tablename||''}})
							</block>
							<block v-if="orderInfo.type != 3 && orderInfo.state!=2 && orderInfo.tablename">
							  ({{orderInfo.tablename}})
							</block>
							
							</view>
							<view style="padding-top: 15rpx;font-size: 26rpx;color: #999;">
								{{orderInfo.store.address}}
							</view>
						</view>
						<text class="iconfont icon-dizhi" :style="{'color':setColor}"></text>
					</view>

					<view class="goods-list" v-if="orderInfo.type!= 3">
						
						<block v-for="(goods,idx) in orderInfo.new_goods" :key="idx">
							
							<view class="flex-y-center carInfoHeader" @click="chooseBag(goods.pocket)">
								<view class="radio__inner"
									:style="'border: 6rpx solid' + setColor">
									<view :style="'background:#fff'"
										class="radio__inner-icon radio__inner-icon is-default-checked">
									</view>
								</view>
								购物口袋{{goods.pocket}}
								<block v-if="Number(orderInfo.box_fee)>0">
									（包装费 <text style="color: red;">￥{{goods.packing_fee}}</text>）
								</block>
							</view>
							
							<view class="item flex flex-nowarp" v-for="(item,index) in goods.list" :key="index">
								<image :src="getImgSrc(item.spec_image)" mode="aspectFill" class="img"></image>
								<view class="info flex flex-column">
									<view class="title">{{item.name}}</view>
									<view class="unit" v-if="item.spec">{{item.spec}}</view>
									<view class="unit">{{item.unit_price}}</view>
									 <view>
										<view class="rebate-info" v-if="item.user_rebate == 1">会员折扣
										</view>
									</view>
									<view class="num">× {{item.num}}</view>
								</view>
								<view class="price">
									<view class="">￥{{item.total_price}}</view>
									<view class="Count">
										{{item.is_refund==1?'已退款':''}}
									</view>
								</view>
							</view>
						
						</block>
					</view>

					<view class="box-pack-between ft26 orderInfo-item">
						<text>小计：</text>
						<text>￥{{orderInfo.total_price}}</text>
					</view>

					<!-- 就餐人数和费用 -->
					<view class="box-pack-between ft26 orderInfo-item"
						v-if="Number(orderInfo.eat_people)>0 && orderInfo.state == 1">
						<text>就餐人数</text>
						<text>{{orderInfo.eat_people}}人</text>
					</view>
					<view class="box-pack-between ft26 orderInfo-item"
						v-if="Number(choosePrise)>0 && orderInfo.state == 1">
						<text>就餐人数费用</text>
						<text>+￥{{choosePrise}}</text>
					</view>

					<view class="box-pack-between ft26 orderInfo-item" v-if="discount>0&Number(orderInfo.discount>0)">
						<text>会员折扣</text>
						<text>-￥{{discount}}</text>
					</view>

					<view class="box-pack-between ft26 orderInfo-item" v-if="Number(coupon_price)>0">
						<text>优惠劵</text>
						<text>-￥{{coupon_price}}</text>
					</view>

					<view class="box-pack-between ft26 orderInfo-item" v-if="Number(orderInfo.coupon_price)>0">
						<text>优惠劵</text>
						<text>-￥{{ orderInfo.coupon_price}}</text>
					</view>

					<view class="box-pack-between ft26 orderInfo-item" v-if="Number(orderInfo.box_fee)>0">
						<text>包装费</text>
						<text>+￥{{ orderInfo.box_fee}}</text>
					</view>

					<view class="box-pack-between ft26 orderInfo-item" v-if="Number(orderInfo.refund_price)>0">
						<text>退款金额</text>
						<text>-￥{{orderInfo.refund_price}}</text>
					</view>

					<view class="box-pack-between ft26 orderInfo-item" v-if="Number(orderInfo.delivery_price)>0">
						<text>配送费</text>
						<text>+￥{{orderInfo.delivery_price}}</text>
					</view>


					<view class="total-block">
						<block v-if="orderInfo.type != 3">共 {{orderInfo.count}} 件商品，</block>
						实付：￥{{orderInfo.pay_price- Number(coupon_price)-Number(orderInfo.refund_price)}}
					</view>
				</view>

				<view class="page-block" style="margin-bottom: 0;">
					<!-- 如果 is_send=1并且is_dd=1 就是达达配送  请求达达接口
					如果 is_send=1并且is_dd=2 就是商家配送 不需要请求达达接口
					如果 is_send=0 就是还没配送 -->
                    <view class="page-title box-pack-between">
                        <text>订单信息</text>
                        <block v-if="orderInfo.cancel_status!=2">
                            <block v-if="orderInfo.is_pay ==1&&orderInfo.state==2&&orderInfo.is_send==0">
                                <view class="flex-y-center red">
                                    <!-- 待配送 -->
                                    {{
										orderInfo.cancel_status==2 ?'订单已退款':orderInfo.order_status== 0?'待支付':orderInfo.order_status== 1?'待配送':
										orderInfo.order_status== 2?'配送中':orderInfo.order_status== 3?'已完成':
										orderInfo.order_status== 4?'已取消':
										orderInfo.order_status== 5?'已退款':
										orderInfo.order_status== 6?'部分退款':
										orderInfo.order_status== 7?'待自提':
										''
									}}
                                </view>
                            </block>
                            <!-- statusCode	Integer	订单状态(待接单＝1,待取货＝2,配送中＝3,已完成＝4,已取消＝5, 
								指派单=8,妥投异常之物品返回中=9, 妥投异常之物品返回完成=10, 骑士到店=100,创建达达运单失败=1000 
								可参考文末的状态说明） -->
                            <block v-else>
                                <block v-if="orderInfo.is_send==1&&orderInfo.is_dd==1">
                                    <navigator hover-class="none"
                                        :url="`../../menber/map?order_id=${orderInfo.id}&latitude=${latitude}&longitude=${longitude}&type=1`"
                                        class="flex-grow-1 flex-y-center red box-pack-between">
                                        <view></view>
                                        <view class="flex-y-center">
                                            <text>
                                                {{
												 dadaInfo.statusCode==0?'正在派送订单':
												 dadaInfo.statusCode==1?'待接单':
												 dadaInfo.statusCode==2?'骑士前往商家取货':
												 dadaInfo.statusCode==3?'正在配送':
												 dadaInfo.statusCode==4?'已完成':
												 dadaInfo.statusCode==5?'已取消':
												 dadaInfo.statusCode==8?'指派单':
												 dadaInfo.statusCode==9?'妥投异常之物品返回中':
												 dadaInfo.statusCode==10?'妥投异常之物品返回完成':
												 dadaInfo.statusCode==100?'骑士到店':
												 dadaInfo.statusCode==1000?'创建达达运单失败':''
												}}
                                            </text>
                                            <view class="arr-r"></view>
                                        </view>
                                    </navigator>
                                </block>
                                <block v-if="orderInfo.is_send==1&&orderInfo.is_dd==2">
                                    <navigator hover-class="none"
                                        :url="`../../menber/map?order_id=${orderInfo.id}&latitude=${latitude}&longitude=${longitude}&type=2`"
                                        class="flex-grow-1 flex-y-center red box-pack-between">
                                        <view></view>
                                        <view class="flex-y-center">
                                            <text>
                                                点击查看（{{
												 juheInfo.status_desc
												}}）
											</text>
											<view class="iconfont icon-jiantou" style="color: #000000;"></view>
										</view>
									</navigator>
								</block>
							</block>
						</block>
					</view>
					<view class="order-info-list">
						<view v-if="orderInfo.logistic" class="item flex flex-nowarp flex-x-between flex-y-center">
							<view class="title">平台</view>
							<view class="desc">{{orderInfo.logistic}}</view>
						</view>
						<block v-if="dadaInfo.transporterPhone">
							<view @click="getTel(dadaInfo.transporterPhone)"
								v-if="orderInfo.is_send==1&&orderInfo.is_dd==1&&dadaInfo.statusCode==2||dadaInfo.statusCode==3||dadaInfo.statusCode==4||dadaInfo.statusCode==5"
								class="item flex flex-nowarp flex-x-between flex-y-center">
								<view class="title">骑手</view>
								<view class="desc">{{dadaInfo.transporterName}}({{dadaInfo.transporterPhone}}) <text
										class="desc iconfont icon-dianhua"></text></view>
							</view>
						</block>
						<block v-if="juheInfo.rider_phone">
							<view @click="getTel(juheInfo.rider_phone)"
								v-if="orderInfo.is_send==1&&orderInfo.is_dd==2&&juheInfo.status!=10||juheInfo.status!=60"
								class="item flex flex-nowarp flex-x-between flex-y-center">
								<view class="title">骑手</view>
								<view class="desc">{{juheInfo.rider_name}}({{juheInfo.rider_phone}}) <text
										class="desc iconfont icon-dianhua"></text></view>
							</view>
						</block>

						<view v-if="orderInfo.is_pay == 1 && orderInfo.state!=2"
							class="item flex flex-nowarp flex-x-between flex-y-center">
							<view class="title">取单号</view>
							<view class="desc">{{orderInfo.number || orderInfo.id}}</view>
						</view>

						<block v-if="orderInfo.state==3">
							<view v-if="orderInfo.name" class="item flex flex-nowarp flex-x-between flex-y-center">
								<view class="title">自提人</view>
								<view class="desc">{{orderInfo.name}}</view>
							</view>
							<view v-if="orderInfo.mobile" class="item flex flex-nowarp flex-x-between flex-y-center">
								<view class="title">自提电话</view>
								<view class="desc">{{orderInfo.mobile}}</view>
							</view>
						</block>

						<block v-if="orderInfo.state==2">
							<view class="item flex flex-nowarp flex-x-between flex-y-center">
								<view class="title">联系人</view>
								<view class="desc">{{orderInfo.name}}</view>
							</view>
							<view class="item flex flex-nowarp flex-x-between flex-y-center">
								<view class="title">联系方式</view>
								<view class="desc">{{orderInfo.mobile}}</view>
							</view>
							<view class="item flex flex-nowarp flex-x-between flex-y-center">
								<view class="title">地址</view>
								<view class="desc">{{orderInfo.address}}</view>
							</view>
						</block>

						<view class="item flex flex-nowarp flex-x-between flex-y-center">
							<view class="title">订单号</view>
							<view class="desc">{{orderInfo.order_no}}</view>
						</view>

						<view class="item flex flex-nowarp flex-x-between flex-y-center">
							<view class="title">下单时间</view>
							<view class="desc">{{orderInfo.create_time}}</view>
						</view>

						<view class="item flex flex-nowarp flex-x-between flex-y-center">
							<view class="title">支付时间</view>
							<view class="desc">{{orderInfo.pay_time}}</view>
						</view>

						<view class="item flex flex-nowarp flex-x-between flex-y-center"
							v-if="Number(orderInfo.coupon_price)>0">
							<view class="title">优惠劵</view>
							<view class="desc">-{{orderInfo.coupon_price}}</view>
						</view>

						<view v-if="Number(orderInfo.discount)>0"
							class="item flex flex-nowarp flex-x-between flex-y-center">
							<view class="title">会员折扣</view>
							<view class="desc">{{orderInfo.discount}}折</view>
						</view>

						<view class="item flex flex-nowarp flex-x-between flex-y-center">
							<view class="title">支付方式</view>
							<!-- #ifdef MP-WEIXIN -->
							<view class="desc">{{orderInfo.pay_type==3?'余额支付':orderInfo.pay_type==4?'现金支付':orderInfo.pay_type==5?'充值免单':'微信支付'}}
							</view>
							<!-- #endif -->
							<!-- #ifdef MP-ALIPAY -->
							<view class="desc">{{orderInfo.pay_type==3?'余额支付':orderInfo.pay_type==4?'现金支付':orderInfo.pay_type==5?'充值免单':'支付宝支付'}}
							</view>
							<!-- #endif -->
						</view>

						<view class="item flex flex-nowarp flex-x-between flex-y-center">
							<view class="title">订单方式</view>
							<view class="desc">{{orderInfo.state==2?'配送订单':orderInfo.state==1?descOrder.food1:descOrder.food1}}</view>
						</view>

						<view class="item flex flex-nowarp flex-x-between flex-y-center" v-if="orderInfo.remark">
							<view class="title">备注</view>
							<view class="desc">{{orderInfo.remark || '无'}}</view>
						</view>
					</view>
				</view>
			</view>
			<view class="main" style="padding-top: 0;" @click="tel">
				<view class="page-block">
					<view class="order-info-list">
						<view class="item box-pack-between">
							<view class="title">联系商家</view>
							<view class="flex-y-center">
								<text class="iconfont icon-dianhua ft34"></text>
								<text class="desc iconfont icon-jiantou"></text>
							</view>
						</view>
					</view>
				</view>
			</view>
		</block>

		<!-- 纵向排列 -->
		<uni-popup ref="popup" type="bottom">
			<view class="model-content">
				<view class="flex-y-center model-content-title box-pack-between">
					<text style="width: 50rpx;"></text>
					订单跟踪
					<text @click="onClose" class="iconfont icon-guanbi"></text>
				</view>
				<scroll-view scroll-y="true" style="height: 700rpx;">
					<uni-steps :options="options" :active-color="setColor" direction="column"
						:active="Number(options.length)"></uni-steps>
				</scroll-view>
			</view>
		</uni-popup>

		<view class="is_popup flex-center" v-if="is_popup">
			<view class="get-phone-pop">
				<view class="content-block">
					<view class="content flex flex-y-center flex-x-center">提示</view>
				</view>
				<view class="flex-center content-tel">
					<text style="min-width: 130rpx;">订单处理成功</text>
				</view>
				<navigator open-type="redirect" url="../paySuccess/paySuccess"
					class="btm-block flex flex-nowarp flex-x-between">
					<view form-type="submit" class="btn sub-btn">确定</view>
				</navigator>
			</view>
		</view>


		<!-- #ifdef MP-ALIPAY -->
		<!-- <subscribe-msg /> -->
		<!-- #endif -->
	</view>
</template>


<script>
	import {
		mapState
	} from 'vuex'
	// #ifdef MP-ALIPAY
	// const {
	// 	requestSubscribeMessage
	// } = requirePlugin('subscribeMsg');
	// #endif
	export default {
		data() {
			return {
				userInfo: {},
				order_id: "",
				orderInfo: "",
				dadaInfo: {},
				menber_discount: {},
				systemInfo: {},
				latitude: "",
				longitude: "",
				setColor: "",
				juheInfo: {},
				options: [],
				discount: 0,
				coupon_list: [],
				store_id: '',
				coupon_price: 0,
				coupon_id: '',
			    activity:0,
				is_popup: false,
				choosePrise: 0, //选择的人数对应的价格
				
			}
		},
    	computed: {
			...mapState(['descOrder'])
		},
		onLoad(options) {
			this.userInfo = uni.getStorageSync('userInfo');
			this.systemInfo = uni.getStorageSync('systemInfo');
			this.store_id = uni.getStorageSync('store_id')
			this.order_id = options.order_id;
			this.getOrderInfo();
			uni.setNavigationBarColor({
				frontColor: '#ffffff',
				backgroundColor: this.$store.state.color,
			})
			this.setColor = this.$store.state.color;
			this.paycoupons();
		},

		methods: {
			//获取单个人数的价格
			peoplePrise(num) {
				// console.log(num, '我是计算的价格')
				this.$http.request('xcx/siteConfigFind', {
					store_id: this.store_id,
				}).then(res => {
					if (res.code == "200") {
						let eat_cover = res.data.eat_cover || 0;
						let priseA = num * (res.data.eat_cover);
						this.choosePrise = (Math.round(priseA * 100) / 100).toFixed(2);
					}
				}).catch((res) => {
					uni.showToast({
						title: res.message,
						icon: 'none'
					})
				});
			},

			// 打开地图
			getNavigation() {
				let {
					lat,
					lng
				} = this.orderInfo.store;
				uni.openLocation({
					latitude: Number(lat),
					longitude: Number(lng),
					name: this.orderInfo.store.title,
					address: this.orderInfo.store.address,
					success: function() {
						console.log('success');
					}
				});
			},
			paycoupons() {
				this.$http.request('xcx/paycoupons', {
					user_id: this.userInfo.id,
					store_id: this.store_id,
				   is_use:this.orderInfo.state,
				}, "", "", true).then(res => {
					console.log(res)
					this.coupon_list = res.data;
				}).catch(err => {
					console.log(err)
				})
			},

			bindOpen() {
				this.$refs.popup.open();
			},

			tel(e) {
				uni.makePhoneCall({
					phoneNumber: this.systemInfo.tel //仅为示例
				});
			},

			getTel(tel) {
				uni.makePhoneCall({
					phoneNumber: tel //仅为示例
				});
			},

			onClose() {
				this.$refs.popup.close();
			},

			onPrinterStatusChange() {
				if (this.systemInfo.is_vip == 1) {
					// #ifdef MP-WEIXIN
					let statusArr = ['微信支付', '余额支付']
					// #endif
					
					// #ifdef MP-ALIPAY
					let statusArr = this.activity==1? ['支付宝支付']:['支付宝支付', '余额支付']
					// #endif
					
					uni.showActionSheet({
						itemList: statusArr,
						success: (r) => {
							this.onPay(r.tapIndex)
						}
					})
					
					return
				}
				this.onPay(0);
			},

			//拼接图片全路径
			getImgSrc(src) {
				return this.$utils.getImgSrc(src)
			},

			getOrderInfo() {
				this.$http.request('xcx/orderdetail', {
					// store_id: uni.getStorageSync('store_id'),
					user_id: this.userInfo.id,
					order_id: this.order_id
				}).then(res => {
					this.orderInfo = res.data.detail
					// is_pay 已支付
					// 如果 is_send=1并且is_dd=1 就是达达配送  请求达达接口
					// 如果 is_send=1并且is_dd=2 就是商家配送 不需要请求达达接口
					// 如果 is_send=0 就是还没配送
					let orderInfo = res.data.detail;
					this.latitude = res.data.detail.lat;
					this.longitude = res.data.detail.lng;
					// type == 2餐后付款  is_pay==0未付款
					if (res.data.detail.type == 2 && res.data.detail.is_pay == 0) {
						this.discount = Number(orderInfo.member_discount)
					} else {
						this.discount = (Number(orderInfo.total_price) - (orderInfo.total_price * (orderInfo
							.discount * 0.1))).toFixed(2)
					}
					if (orderInfo.is_send == 1 && orderInfo.is_dd == 1) {
						this.GetDadaInfo();
					}
					if (orderInfo.is_send == 1 && orderInfo.is_dd == 2) {
						this.deliveryRoute();
					}

					//计算人数对应价格
					this.peoplePrise(res.data.detail.eat_people)

				})
			},
			// 达达配送
			GetDadaInfo(e) {
				this.$http.request('xcx/GetDadaInfo', {
					order_id: this.order_id,
				}).then(res => {
					this.dadaInfo = res.data;
				})
			},
			// 聚合配送
			deliveryRoute(e) {
				this.$http.request('xcx/delivery_route', {
					order_id: this.order_id,
					store_id: uni.getStorageSync('store_id'),
				}).then(res => {
					let options = [];
					this.juheInfo = res.data.info[0];

					function timestampToTime(timestamp) {
						var date = new Date(timestamp * 1000); //时间戳为10位需*1000，时间戳为13位的话不需乘1000
						var Y = date.getFullYear() + '-';
						var M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) +
							'-';
						var D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate()) + ' ';
						var h = (date.getHours() < 10 ? '0' + date.getHours() : date.getHours()) + ':';
						var m = (date.getMinutes() < 10 ? '0' + date.getMinutes() : date.getMinutes()) + ':';
						var s = date.getSeconds() < 10 ? '0' + date.getSeconds() : date.getSeconds();
						return Y + M + D + h + m + s;
					}
					for (let i of res.data.info) {
						options.push({
							title: i.status_desc,
							logistic: i.logistic,
							desc: timestampToTime(i.ctime),
							content: i.content,
						})
					}
					this.options = options
				})
			},

			onPay(pay_type) {
				let that = this;
				let subscribe = uni.getStorageSync('balance_subscribe');
				let state = this.orderInfo.state;
				// #ifdef MP-ALIPAY
				if (pay_type == 1) {
					let entityIds = [subscribe.alipay_balance];
					// 外卖没有取餐消息
					if (state != 2) {
						entityIds.push(subscribe.qucang_tid);
					}
					// 调用方法，唤起订阅组件
				 my.requestSubscribeMessage({
						thirdTypeAppId: that.systemInfo.alipay_appid, // 可选，isv接入场景下必填
						entityIds: entityIds, // 模板id列表，最多3个
						// 接收结果的回调方法
						 complete:(r) =>{
							console.log('订阅回调', r);
							that.yuePay()
						},
					});
				} else {
					let entityIds = [subscribe.alipay_pay_tid];
					// 外卖没有取餐消息
					if (state != 2) {
						entityIds.push(subscribe.qucang_tid);
					}
					// 调用方法，唤起订阅组件
				 my.requestSubscribeMessage({
						thirdTypeAppId: that.systemInfo.alipay_appid, // 可选，isv接入场景下必填
						entityIds: entityIds, // 模板id列表，最多3个
						// 接收结果的回调方法
						 complete:(r) =>{
							console.log('订阅回调', r);
							that.aliPay()
						},
					});
				}
				// #endif

				// #ifdef MP-WEIXIN
				if (pay_type == 1) {
					let tmplIds = [subscribe.balance_tid, subscribe.jf_tid];
					// 外卖没有取餐消息
					if (state != 2) {
						tmplIds.push(subscribe.wechat_qucang_tid);
					}
					uni.requestSubscribeMessage({
						tmplIds: tmplIds,
						success: (r) => {
							console.log(r, "success")
						},
						complete: (r) => {
							console.log(r, "complete")
							this.yuePay()
						}
					})
				} else {
					let tmplIds = [subscribe.pay_tid, subscribe.jf_tid];
					// 外卖没有取餐消息
					if (state != 2) {
						tmplIds.push(subscribe.wechat_qucang_tid);
					}
					uni.requestSubscribeMessage({
						tmplIds: tmplIds,
						success: (res) => {
							console.log(res, "success")
						},
						complete: (res) => {
							console.log(res, "complete")
							//先付后吃
							this.wxPay()
						}
					})
				}
				// #endif	
			},


			//余额支付
			yuePay() {
				let orderInfo = this.orderInfo,
					canhou = "";
				if (orderInfo.is_pay == 0 && orderInfo.type == 2) {
					canhou = 1
				}
				// #ifdef MP-WEIXIN
					var is_type=1;
				// #endif
				// #ifdef MP-ALIPAY
					var is_type=2;
				// #endif
				this.$http.request('xcx/yuer_pay', {
					user_id: this.userInfo.id,
					money: Number(this.orderInfo.pay_price) - Number(this.coupon_price),
					order_id: this.order_id,
					store_id: uni.getStorageSync('store_id'),
					canhou: canhou,
					coupon_price: this.coupon_price,
					coupon_id: this.coupon_id,
					is_type:is_type,
				}).then(res => {
					console.log(res)
					uni.showModal({
						content: '支付成功',
						showCancel: false,
						success: r => {
							this.getOrderInfo()
							let pages = getCurrentPages()
							if (pages.length > 1) {
								let prePage = pages[pages.length - 2]
								prePage.$vm.getMyOrderList(1)
							}
						}
					})
				}).catch(err => {
					console.log(err)
				})
			},


			//支付宝支付
			aliPay() {
				let orderInfo = this.orderInfo,
					canhou = "";
				if (orderInfo.is_pay == 0 && orderInfo.type == 2) {
					canhou = 1
				}
				this.$http.request('Xcxpay/getAliorderNo', {
					user_id: this.userInfo.user_id,
					money: Number(this.orderInfo.pay_price) - Number(this.coupon_price),
					order_id: this.order_id,
					store_id: uni.getStorageSync('store_id'),
					canhou: canhou,
					coupon_price: this.coupon_price,
					coupon_id: this.coupon_id,
                    

				}).then(res => {
					console.log(res)
					let out_trade_no = res.data.out_trade_no
					my.tradePay({
						// 调用统一收单交易创建接口（alipay.trade.create），获得返回字段支付宝交易号trade_no
						tradeNO: res.data.trade_no,
						success: (res) => {
							console.log(res)
							if (res.resultCode == 9000) {
								// this.is_popup = true;
								this.getOrderInfo();
								let pages = getCurrentPages()
								if (pages.length > 1) {
									let prePage = pages[pages.length - 2]
									prePage.$vm.getMyOrderList(1)
								}
								// this.$refs.popup.open();
								// my.alert({
								// 	content: "订单处理成功",
								// 	showCancle: false,
								// 	success: () => {
								// 		this.getOrderInfo()
								// 		let pages = getCurrentPages()
								// 		if (pages.length > 1) {
								// 			let prePage = pages[pages.length - 2]
								// 			prePage.$vm.getMyOrderList(1)
								// 		}
								// 	}
								// });
								// this.$http.request('Xcxpay/getAliOrderInfo', {
								// 	out_trade_no,
								// 	store_id: uni.getStorageSync('store_id'),
								// }).then(res => {
								// 	console.log(res)
								// }).catch(err => {
								// 	console.log(err)
								// })

							} else if (res.resultCode == 8000 || res.resultCode == 6004) {
								my.alert({
									content: "支付结果未知，请核对",
									showCancle: false,
									success: () => {
										this.getOrderInfo()
									}
								});
							}
						},
						fail: (res) => {
							my.alert({
								content: JSON.stringify(res),
							});
						}
					});
				}).catch(err => {
					console.log(err)
				})
			},

			wxPay() {
				let orderInfo = this.orderInfo,
					canhou = "";
				if (orderInfo.is_pay == 0 && orderInfo.type == 2) {
					canhou = 1
				}
				this.$http.request('Xcxweixinpay/pay', {
					order_id: this.order_id,
					money: Number(this.orderInfo.pay_price) - Number(this.coupon_price),
					openid: this.userInfo.openid,
					canhou: canhou,
					coupon_price: this.coupon_price,
					coupon_id: this.coupon_id,
				}).then(res => {
					console.log(res)
					wx.requestPayment({
						timeStamp: res.data.timeStamp,
						nonceStr: res.data.nonceStr,
						package: res.data.package,
						signType: res.data.signType,
						paySign: res.data.paySign,
						success: (res) => {
							uni.showModal({
								content: '支付成功',
								showCancel: false,
								success: r => {
									this.getOrderInfo()
									let pages = getCurrentPages()
									if (pages.length > 1) {
										let prePage = pages[pages.length - 2]
										prePage.$vm.getMyOrderList(1)
									}
								}
							})
						},
						fail: (res) => {
							uni.showToast({
								title: '支付失败',
								icon: 'none'
							})
						}
					})
				})
			}
		}
	}
</script>

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

    .pick_up {
        width: 190rpx;
        height: 190rpx;
        background: #3387FF;
        color: #FFFFFF;
        font-size: 28rpx;
        text-align: center;
        border-radius: 100px;
        padding-bottom: 20rpx;
        margin: 0 auto;
        box-shadow: 0rpx 0rpx 20rpx #ccc;
    }

    .round {
        font-size: 26rpx;
        width: 150rpx;
        height: 150rpx;
        background: #fb652e;
        color: #FFFFFF;
        border-radius: 100px;
    }

    .Coupon {
        text-align: center;
        font-size: 28rpx;
        padding-bottom: 30rpx;
    }

    .Coupon-icon {
        // padding: 4rpx 4rpx;
        // background-color: #C9271B;
        // color: #FFFFFF;
        font-size: 24rpx;
        display: inline-block;
        margin-right: 10rpx;
    }

    .icon-youhuijuan-01 {
        color: #FE8902;
        font-size: 42rpx;
    }

    .Coupon .icon-jiantou {
        font-size: 20rpx;
    }

    .orderInfo-item {
        margin-bottom: 20rpx;
    }

    .order-status-block {
        margin-bottom: 40rpx;
        text-align: center;
    }

    .model {
        width: 100%;
        height: 100%;
        position: fixed;
        top: 0;
        left: 0;
        background: rgba(0, 0, 0, .5);
    }

    .model-content {
        background: #FFFFFF;
        height: 800rpx;
    }

    .model-content-title {
        padding: 20rpx;
    }

    .head-block {
        padding: 40rpx 40rpx;
        background-color: #fff;
    }

    .head-block .order-status-icon {
        display: block;
        // width: 70rpx;
        // height: 70rpx;
        margin-right: 20rpx;
        font-size: 60rpx;
        color: $theme-color;
    }

    .head-block .status-name {
        font-size: 38rpx;
        font-weight: 600;
        color: $theme-color;
        padding: 20rpx 0;
    }

    .head-block .status-tips {
        font-size: 26rpx;
        color: #888;
    }

    .head-block .order-no {
        font-size: 32rpx;
        font-weight: bold;
        text-align: center;
        padding: 40rpx 0;
        color: #555;
    }

    .head-block .btn-block {
        justify-content: space-around;
    }

    .head-block .btn-block .btn {
        width: 45%;
        height: 70rpx;
        line-height: 70rpx;
        border-radius: 35rpx;
        background-color: $theme-color;
        text-align: center;
        font-weight: 500;
        font-size: 32rpx;
        color: #fff;
        box-shadow: 0 0 20rpx #ccc;
    }

    .head-block .btn-block .btn.btn1 {
        background-color: #99ccff;
    }

    .head-block .btn-block .btn.btn3 {
        background-color: #04BE02;
    }

    .main {
        padding: 30rpx;

    }

    .main .page-block {
        padding: 0 20rpx;
        background-color: #fff;
        border-radius: 20rpx;
        margin-bottom: 30rpx;
    }

    .main .page-block .page-title {
        height: 100rpx;
        line-height: 100rpx;
        font-size: 32rpx;
        font-weight: bold;
        color: #555;
    }

    .main .page-block .goods-list {
        padding: 0 20rpx;
        border-top: 1rpx solid #eee;
    }

    .main .page-block .goods-list .item {
        padding: 20rpx 0;
        color: #555;
    }

    .main .page-block .goods-list .item .info {
        padding: 0 20rpx;
        min-height: 126rpx;

    }

    .main .page-block .goods-list .item .img {
        display: block;
        width: 126rpx;
        height: 126rpx;
        border-radius: 10rpx;
        flex: none;
    }

    .main .page-block .goods-list .item .title {
        font-size: 30rpx;
        font-weight: 500;
    }

    .main .page-block .goods-list .item .unit {
        font-size: 24rpx;
        color: #a1a1a1;
    }

    .main .page-block .goods-list .item .rebate-info {
        display: inline-block;
        font-size: 24rpx;
        padding: 2rpx 10rpx;
        background: red;
        color: #fff;
        border-radius: 8rpx;
    }

    .main .page-block .goods-list .item .num {
        font-size: 24rpx;
        margin-top: auto;
    }

    .main .page-block .goods-list .item .price {
        margin-left: auto;
        flex: none;
        font-size: 26rpx;
    }

    .main .page-block .total-block {
        height: 80rpx;
        line-height: 80rpx;
        text-align: right;
        border-top: 1rpx solid #eee;
        font-size: 30rpx;
        font-weight: bold;
        color: #555;
        margin-top: 20rpx;
    }

    .main .order-info-list {
        padding: 20rpx 0;
    }

    .main .order-info-list .item {
        padding: 20rpx 0;
        font-size: 26rpx;
        color: #555;
    }

    .main .order-info-list .item .title {
        flex: none;
        min-width: 110rpx;
    }

    .main .order-info-list .item .desc {
        padding-left: 20rpx;
    }

    .icon-dizhi {
        font-size: 50rpx;
    }

    .is_popup {
        position: fixed;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.5);
    }

    .get-phone-pop {
        /* 成为会员 */
        width: 550rpx;
        background-color: #fff;
        border-radius: 14rpx;
        overflow: hidden;
    }

    .code-btn {
        flex: none;
        width: 170rpx;
        height: 60rpx;
        border-radius: 30rpx;
        background-color: #3387FF;
        text-align: center;
        line-height: 60rpx;
        color: #fff;
        font-size: 24rpx;
    }

    .get-phone-pop .content {
        // height: 180rpx;
        text-align: center;
        font-size: 35rpx;
        color: #000;
        // line-height: 60rpx;
        padding: 30rpx 0;
        padding-bottom: 0;
    }

    .content-tel {
        text-align: center;
        padding: 30rpx 0;
    }

    .get-phone-pop .btm-block {
        width: 100%;
        height: 100rpx;
        border-top: 1rpx solid #eef0ef;
        font-size: 28rpx;
    }

    .get-phone-pop .btm-block .btn {
        height: 100rpx;
        box-sizing: border-box;
        text-align: center;
        line-height: 100rpx;
        color: #010101;
        font-weight: bold;
        padding: 0;
        margin: 0;
        border: none;
        border-radius: 0;
        background-color: #fff;
        // font-size: 35rpx;
        margin: 0 auto;
    }
	.carInfoHeader{
		padding: 10rpx 0;
		font-size: 28rpx;
	}
	.radio {
		font-size: 28rpx;
		padding: 15rpx 0 10rpx 0;
	}
	
	.radio__inner {
		-webkit-flex-shrink: 0;
		flex-shrink: 0;
	
		display: -webkit-box;
		display: -webkit-flex;
		display: flex;
	
		-webkit-box-pack: center;
		-webkit-justify-content: center;
		justify-content: center;
		-webkit-box-align: center;
		-webkit-align-items: center;
		align-items: center;
		position: relative;
		border: 1px solid #DCDFE6;
		border-radius: 2px;
		box-sizing: border-box;
		width: 12px;
		height: 12px;
		border-radius: 16px;
		background-color: #fff;
		z-index: 1;
		-webkit-transition: border-color .3s;
		transition: border-color .3s;
		margin-right: 6rpx;
	}
	
	.radio__inner-icon {
		width: 4px;
		height: 4px;
		border-radius: 10px;
		opacity: 0;
		-webkit-transition: -webkit-transform .3s;
		transition: -webkit-transform .3s;
		transition: transform .3s;
		transition: transform .3s, -webkit-transform .3s;
	}
	
	.is-default-checked {
		opacity: 1;
		-webkit-transform: rotate(45deg) scaleY(1);
		transform: rotate(45deg) scaleY(1);
	}
</style>
