<template>
	<view class="Order-settlement">
		<view class="Order-settlement-left">
			<view class="Order-settlement-left-item">
				原价: ￥{{RetainDecimalPoint(InforData['original_price'])}}
			</view>
			<view class="Order-settlement-left-item">
				消费补贴卡抵扣：￥{{RetainDecimalPoint(InforData['deduction_amount_total'])}}
			</view>
			<view class="Order-settlement-left-item">
				预估佣金：￥{{InforData['self_commission']}}
			</view>
		</view>
		<view class="Order-settlement-btn-price">
			<view class="Order-settlement-btn-price-pay-price">
				<text class="text1">{{InforData['status'] | OrderStateText}}：</text>
				<text class="text2" :style="{color:Brand()['ThemeColor']}">￥{{RetainDecimalPoint(InforData['pay_price'])}}</text>
			</view>
			<view class="Order-settlement-btn-price-operate">
				<template
					v-for="(item,index) in Brand()['customStyle']['OrderBtnStyle'][`orderbtn_${InforData['status']}`]">
					<view class="btn" :style="item['style']" :key="index" @tap.stop="orderclcik(item)">
						{{item['text']}}
					</view>
				</template>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		RXSERVICE
	} from '@/static/js/serviceurl.js'
	import mixin from '@/static/js/mixin/mixin.js';
	import restaurantmixins from '@/static/js/mixin/restaurantmixins.js';
	import config from '@/static/js/config.js'
	export default {
		name: 'b-order-item-settlement',
		mixins: [mixin, restaurantmixins],
		props: {
			index: {
				type: Number,
				default: 0
			},
			infor: {
				type: Object,
				default: () => {}
			}
		},
		computed: {
			InforData() {
				return this['infor']
			},
		},

		data() {
			return {
				config
			}
		},
		methods: {
			
			orderclcik(item) {
				uni.showLoading({
					title: '加载中'
				});
				// 取消订单
				if (item['state'] == 'cancel') {
					uni.hideLoading();
					this.$emit('cancel', this['index']);

				} else if (item['state'] == 'pay') {
					uni.hideLoading();
					// console.log(this['InforData']['order_sn']);
					// return
					// 立即支付
					// this.againpayment(this['InforData']['order_sn'],this['InforData']['pay_price']);
					let redirect_url;
					// 肯德基
					if (this['BrandInfor']['brand_id'] == 1 || this['BrandInfor']['brand_id'] == 5) {
						redirect_url = `/pages/restaurant/order/order-status/order-status?order_sn=${this['InforData']['order_sn']}`;
					}else{
						redirect_url = `/pages/restaurant/order/order-details/details?order_sn=${this['InforData']['order_sn']}`
					}
					this.$Payment.Repayment({
						order_sn:this['InforData']['order_sn'],
						// 点餐订单类型为4直接写死
						type:4,
						redirect_url,
						// 不需要关闭当前页面
						redirect:false
					});
				} else if (item['state'] == 'again') {
					uni.hideLoading();
					let arr = [];
					
					// 重新下单arr
					console.log('新');
					arr = this['InforData']['goods'].map(item => {
						item['restaurant_id'] = this['InforData']['restaurant_id'];
						// 以下数据用于重新下单时保存当前店铺信息
						item['restaurant_address'] = this['InforData']['restaurant_address'];
						item['restaurant_name'] = this['InforData']['restaurant_name'];
						item['latitude'] = this['InforData']['lat'];
						item['longitude'] = this['InforData']['lng'];
						// 因为前端记录商品数量使用的是num,而重新加入购物车时后台代表数量的则是amount
						item['num'] = item['amount'];
						// 使用单个商品价格(包含加料价格)和数量以及加料价格计算出商品单价价格(未加料价格)
						// item['adj_pay'] = (item['original_price'] - (item['add_price'] * item['amount'])) / item['amount'];
						item['add_price'] = item['add_price'];
						return item;
					});
					// else{
					// 	arr = this['InforData']['goods'].map(item => {
					// 		item['restaurant_id'] = this['InforData']['restaurant_id'];
					// 		// 以下数据用于重新下单时保存当前店铺信息
					// 		item['restaurant_address'] = this['InforData']['restaurant_address'];
					// 		item['restaurant_name'] = this['InforData']['restaurant_name'];
					// 		item['latitude'] = this['InforData']['lat'];
					// 		item['longitude'] = this['InforData']['lng'];
					// 		// 因为前端记录商品数量使用的是num,而重新加入购物车时后台代表数量的则是amount
					// 		item['num'] = item['amount'];
					// 		item['pay'] = item['original_price'] / item['amount'];
					// 		// item['pay_price'] = item['original_price'];
					// 		return item;
					// 	});
					// };
					console.log(arr,'重新下单');
					// return
					this.Reorder(arr);
				} else if (item['state'] == 'service') {
					uni.hideLoading();
					// 联系客服
					let service = this.Brand();
					service.service();

				} else if (item['state'] == 'code') {
					uni.hideLoading();
					uni.navigateTo({
						url: `/pages/restaurant/order/order-details/details?order=${this['InforData']['order_sn']}`
					})
					// let url;
					// // 麦当劳/肯德基
					// if (this['InforData']['brand_id'] == 1 || this['InforData']['brand_id'] == 5) {
					// 	uni.navigateTo({
					// 		url: `/pages/restaurant/order/order-details/details?order=${this['InforData']['order_sn']}`
					// 	})
					// }

				};
				
			},
			// 重新下单前数据重构
			OrderReorder() {

			},

			// 取消订单
			cancel() {

			},

			// 进入订单详情查看取餐码
			OrderDetails() {

			},

			/**
			 * @跳转客服
			 * */
			service() {
				uni.openCustomerServiceChat({
					extInfo: {
						url: RXSERVICE,
					},
					corpId: 'ww4f46b491a045158c',

					success(e) {
						console.log(e)
					},
					fail(e) {
						console.log(e)
					}
				})
			},
		}
	}
</script>

<style lang="scss">
	.Order-settlement {
		padding: 0 32rpx 21rpx 32rpx;
		margin-top: 48rpx;
		display: flex;
		justify-content: space-between;

		&-left {
			color: #333333;
			font-size: $FONTSIZE24;

			&-item:nth-of-type(1) {
				margin-bottom: 12rpx;
			}

			&-item:nth-of-type(2) {
				margin-bottom: 12rpx;
			}
		}

		&-btn-price {
			display: flex;
			align-items: flex-end;
			flex-direction: column;
			justify-content: space-between;

			&-pay-price {
				.text1 {
					color: #333333;
					font-size: $FONTSIZE24;
				}

				.text2 {
					// color: #CE211F;
					font-size: $FONTSIZE36;
				}
			}

			&-operate {
				display: flex;

				.btn {
					width: 160rpx;
					height: 58rpx;
					font-size: 22rpx;
					text-align: center;
					// line-height: 58rpx;
					display: flex;
					align-items: center;
					justify-content: center;
					border-radius: 50rpx;
					margin-left: 16rpx;
				}

				// .btn1 {
				// 	border: 2rpx solid #E3E3E3;
				// 	border-radius: 50rpx;
				// 	color: #666666;
				// }

				// .btn2 {
				// 	// border: 2rpx solid #C63836;
				// 	border-radius: 50rpx;
				// 	// color: #C63836;
				// 	margin-left: 20rpx;
				// }
			}
		}
	}
</style>
