<template>
	<view class="page">
		<view class="sstouch-main-layout">
			<view class="top">
				<view   right-icon="scan" style="width: 80%;float:left;padding:20rpx;margin-left:20rpx;">
					<view class="input-view" style="width: 90%;">
						<input  style="font-size:26rpx;"  class="input" type="text" :value="chain_code" :placeholder="__('请输入提货码/服务码进行核销')" @input="setCode">
						<image class="false-image" src="/static/images/false.png" mode="aspectFill" @click="gocancel" />
					</view>
				</view>
				<view class="zc" id="scan_btn" @click="getscanCode">

				</view>
			 </view>
		    <form class="sstouch-inp-con">
				<view class="form-btn" @click="query" style="margin-top:0;    background-color: #f5f5f5;">
					<view class="btn J_search" :style="chain_code?'background: #f30213;color: #FFF!important;line-height:100rpx':'background: #EEE;line-height:100rpx'">{{__('查询订单/核销')}}</view>
				</view>
		    </form>
				<view v-for="(items, i) in orderlist"  :key="i" class="m-panel m-panel-access" style="margin-top:20rpx;">
					<view class="m-panel-hd">{{__('订单编号：')}}{{items.order_id}}
						<label>{{items.order_time_date}}</label>
					</view>
			
					<view class="m-product-list">
						<navigator :url="'/seller/order/detail?on=' + (items.order_id)" v-for="(item, ii) in items.items"
						 :key="ii" class="m-product-item">
							<view class="m-product-img">
								<image :src="(item.order_item_image)" mode="aspectFill" />
							</view>
							<view class="m-product-info">
								<view class="m-product-name">
									<!-- items.OrderType == 1 拼团 -->
									<label><text v-if="(item.activity_type_id==StateCode.ACTIVITY_TYPE_GROUPBOOKING)" class="u-tuan-label">{{__('拼团')}}</text>{{item.item_name}}</label>
									<label class="m-min-name" style="overflow:hiddentext-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1">{{item.activity_type_name==null?"":item.activity_type_name}}</label>
								</view>
								<view class="m-product-name" style="width:80%;height:35rpx;">
									<label class="m-min-name">{{__('买家')}}：{{items.buyer_user_name}}</label>
								</view>
			
								<view class="m-product-price">
									<block v-if="item.order_item_unit_price">
										<label>{{__('￥')}}</label>{{item.order_item_unit_price}}
									</block>
									<text style="float: right;margin-right: 60rpx;">x{{item.order_item_quantity}}</text>
								</view>
							</view>
						</navigator>
					</view>
			
			
					<view class="m-total-info">
						<text>{{__('合计')}}:</text>
						<block >
							<label class="m-total-price">{{__('￥')}}{{items.order_payment_amount}}</label>
						</block>
						<block >
							<label class="m-freight" style="color: #999;font-size:20rpx;">({{__('含运费')}}：{{items.order_shipping_fee}})</label>
						</block>
					</view>
					<view class="m-total-btn">
						<view :data-on="(items.order_id)" v-if="(items.order_lock_status)" class="u-link-btn">{{__('退款/退货中...')}}</view>
					<block v-if="(items.kind_id != 1203)">
						<label class="u-link-btn" style="color: #999;border: 1px solid #CCC;padding:4rpx">{{items.order_state_name}}</label>
					</block>
					<block v-if="(items.order_state_id == StateCode.ORDER_STATE_WAIT_SHIPPING)">
						<navigator :url="'/seller/order/deliver?on=' + (items.order_id)" class="u-link-btn">{{__('发货')}}</navigator>
					</block>
			
					<block v-if="(items.order_state_id == StateCode.ORDER_STATE_PICKING || items.kind_id == 1203) && items.chain_code_status == 0">
						<view :data-order_id="items.order_id" :data-buyer_name="items.buyer_user_name" :data-chaincode="items.chainCode" :data-index="i" class="u-link-btn" @click="doPickUp">{{__('确认提货')}}</view>
					</block>
			
					<block v-if="(items.order_state_id == StateCode.ORDER_STATE_WAIT_PAY)">
						<navigator :url="'/seller/order/pay?on=' + (items.order_id)"  class="u-link-btn">{{__('收款')}}</navigator>
						<view  class="u-link-btn" :data-id="items.order_id" @click="showbutton">{{__('取消订单')}}</view>
					</block>
					<block v-if="(items.order_state_id == StateCode.ORDER_STATE_WAIT_REVIEW)">
						<view :data-order_id="items.order_id" :data-buyer_name="items.buyer_user_name"  class="u-link-btn" @click="Orderaudit">{{__('待订单审核')}}</view>
					</block>
					<block v-if="(items.order_state_id == StateCode.ORDER_STATE_WAIT_FINANCE_REVIEW)">
						<view :data-order_id="items.order_id" :data-buyer_name="items.buyer_user_name" class="u-link-btn" @click="Financialaudit">{{__('待财务审核')}}</view>
					</block>
					</view>
				</view>
		    <!-- <view class="sstouch-order-list">
		        <view class="ul" id="order-detail"></view>
		    </view> -->
		</view>
	</view>
</template>

<script>
	import {
		mapState,
		mapMutations
	} from 'vuex'

	export default {
		data() {
			return {
				chain_code:'',
				orderlist: [],
			}
		},
		computed: mapState(['Config', 'StateCode', 'notice', 'plantformInfo', 'shopInfo', 'userInfo', 'hasLogin']),
		onLoad: function(options) {
			uni.setNavigationBarTitle({
				title: this.__('扫码核销')
			});
		},
		
		onShow() {
			var that = this;
			uni.$on('scanCode',function(data){
				that.setData({
					chain_code:data
				})
			})
		},

		methods: {
			...mapMutations(['login', 'logout', 'getPlantformInfo', 'forceUserInfo', 'getUserInfo']),
			//扫码
			getscanCode: function(){
				var that = this;
				// #ifdef H5
					this.$.navigateTo({
						url: "/seller/order/scan"
					})
				 // #endif
				 // #ifndef H5
				uni.scanCode({
				    success: function (res) {
						that.setData({
							chain_code:res.result
						})
				    }
				});
				// #endif
			},

			setCode: function(e) {
				this.setData({
					chain_code: e.detail.value
				})
			},
			
			gocancel: function(e) {
				this.setData({
					chain_code:''
				})
			},
			doPickUp: function(e){
				var that=this;
				let chaincode=e.currentTarget.dataset.chaincode;
				var params = {
					order_id: e.currentTarget.dataset.order_id,
					chain_code: chaincode
				}
				that.$.request({
					url: that.Config.URL.seller.do_pickup,
					method: 'POST',
					data: params,
					success: function(data, status, msg, code) {
						if(status ==  200){
							that.query();
						}else{
							that.$.alert(msg)
						}
					}
				})
			},
			query: function(){
				var that = this;
				if(that.chain_code){
					var params = {
						chain_code:that.chain_code
					}
					that.$.request({
						url: that.Config.URL.seller.order_get_by_pickupcode,
						data: params,
						success: function(data, status, msg, code) {
							if(status ==  200){
								that.orderlist = [];
								that.orderlist.push(data);
							}else{
								that.$.alert(msg);
								that.orderlist = [];
							}
						}
					})
				}else{
					that.$.alert(that.__('请输入查询数据'))
				}

			},
		}
	}
</script>

<style lang="scss">
	@import "../../styles/base.scss";
	@import "../../styles/sstouch_member.scss";
	@import "../../styles/sstouch_common.scss";


	.form-btn {
		// padding-top:50rpx;
	}

	.input-view {
		width: 100%;
		display: flex;
		background-color: #FFFFFF;
		height: 30px;
		border-radius: 15px;
		padding: 0 5%;
		flex-wrap: nowrap;
		margin: 7px 0;
		line-height: 30px;
	}

	.input-view .uni-icon {
		line-height: 30px !important;
	}

	.input-view .input {
		height: 30px;
		line-height: 30px;
		width: 94%;
		padding: 0 3%;
		border: 0;  // 去除未选中状态边框
		outline: none; // 去除选中状态边框
		background-color: rgba(0, 0, 0, 0);// 透明背景

	}


	input::placeholder{
			width:357rpx;
			height:25rpx;
			font-size:26rpx;
			font-family:Alibaba PuHuiTi;
			font-weight:400;
			color:#6DA62F;
		}

	.sstouch-order-search {
		height:70rpx;
	}

	.form-btn {
		background-color: #f5f5f5;
	}

	.inp {
		width:100%;
		margin-top:16rpx
	}

	.zc {
		width:50rpx;
		height: 80rpx;
		line-height: 70rpx;
		font-size: 40rpx;
		float: right;
		opacity: 0.6;
		padding:20rpx;
	}

	.false-image {
		width:36rpx;
		height:36rpx;
		float:left;
		margin:18rpx auto;
		z-index:18
	}
	
	.m-panel-hd {
		padding:20rpx;
	}
	.m-panel-hd label {
		float: right;
		color: $default-skin-bg;
		font-size: 26rpx;
	}
	
	.m-total-info {
		text-align: right;
		padding: 10rpx;
		font-size: 24rpx;
	}
	
	.m-total-info label {
		font-size: 32rpx;
		color: $default-skin-bg;
	}
	.m-total-info text {
		font-size: 24rpx;
		color: $default-skin-bg;
	}
	.m-total-btn {
		text-align: right;
		padding: 20rpx 20rpx 20rpx 20rpx;
		position: relative;
	}
	
	.m-total-btn::before {
		content: " ";
		position: absolute;
		left: 0;
		top: 0;
		right: 0;
		height: 1px;
		border-top: 1px solid #ebebe7;
		color: #ebebe7;
		-webkit-transform-origin: 0 0;
		transform-origin: 0 0;
		-webkit-transform:
				scaleY(0.5);
		transform: scaleY(0.5);
	}
	
	.m-total-btn .u-link-btn {
		margin: 0 10rpx;
		vertical-align: middle;
		display: inline-block;
		line-height: 40rpx;
		background-color: #fff;
	
		font-size: 24rpx;
	}
	
	.m-sort {
		position: relative
	}
	
	.m-sort image {
		width: 24rpx;
		height: 24rpx;
		position: absolute;
		/*top: 50%;*/
		margin-top: 10rpx;
		margin-left: 2rpx;
	}
	
	.m-product-price text {
		font-size: 24rpx;
		color: #999999;
		margin-left: 6rpx
	}
	 
	
	.m-freight {
		color: #999;
		font-size:20rpx;
	}
	
	.u-loadmore {
		width:100%;
	}
	
	
	.m-product-name{
		font-size: 24rpx;
	}
	
	.m-product-img {
		image {
			padding: 20rpx;
		}
	}
	
	.m-product-item {
		margin-top: 0rpx; 
	}

</style>
