<template>
	<!-- 商城订单 -->
	<!-- 商家查看自己店铺的订单 -->
	<!-- order 订单 -->
	<view class="storeOrder yocode">
		<view class="ordertab flex ali-c">
			<view class="tabitem flex1" @tap="taggletab" v-for="(item,index) in order_status_list" :key="index" data-current="1" :data-statusTab="item.status_id"  :data-status="item.status" :data-is_dianping="item.is_dianping" :data-sale_status="item.sale_status"  >
				<view class="title" :class="{active:tabactive==item.status_id}" >{{item.status_name}}</view>
			</view>
		</view>
		
		<!-- v-if="tabactive==1" -->
		<view class="listorder" >
			<view class="orderItem" v-for="(item,indexMax) in order" :key="indexMax">
				<view class="order_head flex ali-c jus-b">
					<view class="headl flex ali-c">
						<image class="storeicon" src="/static/news/storeicon.png"  mode=""></image>
						<!-- <image class="storeicon" :src="staticUrl+item.photo" mode="" ></image> -->
						<view class="storename">{{item.shop_name}}</view>
					</view>
					<view class="headr">
						<!-- 订单状态 -->
						<view >{{item.order_status}}</view>
						
					</view>
				</view>
				<view class="cretime mt-10">
					下单时间：{{item.create_time}}
				</view>
				<view>
					<!-- 列表 -->
					<view class="order_body    " v-for="(productList,index1) in item.products" :key="index1" >

						<view class="flex mb-20"  v-for="(product,index) in productList.orderGoods" :key="index">

							<!-- <image class="imgs" src="" mode=""></image> -->
							<image class="imgs" :src="staticUrl+product.photo" v-if="product.photo" mode=""></image>
							<image class="imgs" :src="staticUrl+item.photo" mode="" v-else ></image>
							<view class="body_r flex1 ">
								<view class="title twoline">{{product.goods_name}}</view>
								<view class="prices">
									<text class="text">价格{{product.fprice}}元</text>
									<!-- <text class="text">充值价{{product.recprice}}元</text> -->
								</view>
								<view class="specs">
									<text class="text">规格:{{product.sku_name}}</text>
									<!-- <text class="text">包装:2袋装</text> -->
									<view>数量: x {{product.goodsnum}}</view>
								</view>
							</view>
						
						</view>
						<view v-if="productList.operation!=''" class="order_foot bodbod flex jus-e mb-20 mt-20">
								<block  v-for="(action,index) in productList.operation"   :key="index">
									  <view class='btnss' :data-index="indexMax"  :data-orderid='item.order_id' :data-vendor='index1' @tap.stop="operation" :data-action='action.way' :data-is_ld='item.buytype'>{{action.name}}</view>
								</block>
						</view>
					</view>
				</view>
				<view class="order_foot  flex jus-e mb-20 " >
					<view class="heji"><text class="fuhao">{{item.username_tel}}</text></view>
				</view>
				<view class="pricebox flex ali-c jus-b" style="margin-top: 20upx;">
					<!-- 剩余时间 只有待支付的时候有 未付款的时候才有 -->
					<view class="titme oneline flex1" v-if="item.status==4">退款原因:{{item.refund_details}}</view>
					<view v-else></view>
					<view class="heji">合计<text class="fuhao">¥</text><text class="shuzi">{{item.total}}</text></view>
				</view>
				<view class="order_foot flex jus-e">
					<!-- 已发货 -->
					<block  v-for="(action,index) in item.order_operation"  :key="index">

						  <view class='btnss' :data-index="indexMax" :data-orderid='item.order_id' @tap.stop="operation" :data-action='action.way' :data-is_ld='item.buytype'>{{action.name}}</view>
					</block>
				</view>
			</view>
			
		</view>
		
		<pageScrollTo v-if="isshowtop" ></pageScrollTo>
		<!-- 返回顶部 -->
		
	</view>
</template>

<script>
	// import { StoreorderStatus, orderGoodsList } from '@/utils/api/order.js';

	
	import {orderStatus,orderList,oneKeyCancel,consentRefund,refuseRefund} from "@/utils/api/api.js";
	
	import pageScrollTo from "@/components/pageScrollTo/pageScrollTo.vue"
	export default {
		components:{
			pageScrollTo,
		},
		data(){
			return{
				tabactive:"all",
				statusTab:"all",
				status:"",
				is_dianping:"",
				order_status_list:[],
				order:[],
				is_loading_done:false,
				pageNum:0,
				currentTab:0,
				sale_status:"",
				isshowtop:false,
				
				action:'',
			}
		},
		computed: {
			staticUrl () {//静态资源地址
				return this.$store.state.staticUrl;
			}
		},
		//下拉刷新
		onPullDownRefresh(){
			this.is_loading_done=false;
			this.pageNum = 0;
			this.order = [];
			this.initializedata();
		},
		onUnload(){  //页面卸载的时候
			uni.setStorageSync('obj',{order_id:'',index:-1});
			uni.$off('isDelorder'); //取消监听
			uni.setStorageSync('scrollTop',0);
		},
		onPageScroll(e){ //监听滚动
			uni.setStorageSync('scrollTop',e.scrollTop);
			//处理返回顶部
			if(e.scrollTop>400){
				this.isshowtop = true;
			}else{
				this.isshowtop = false;
			}
		},
		onReachBottom(){ //滚动到最底部
			if(!this.is_loading_done){
				this.initializedata();
			}
		},
		onLoad(options) {
			var that = this;
			this.statusTab=options.current ? options.current : "all";// 订单状态
			this.status= options.status ? options.status : "all";
			this.is_dianping= options.is_dianping ? options.is_dianping : 0;
			let params = {};
			orderStatus(params).then(res => {
			  if (res.code == 0) {
				let order_status_list = res.data;
				this.order_status_list = order_status_list;
			  }
			  
			})
			this.initializedata();
		},
		onShow() {
			this.action='';
			uni.$on("isDelorder", res => {
				let index=uni.getStorageSync('obj').index;
				let order=this.order;
				this.action=res.action;
				if(res.action=="oneKeyShipments"){  //确认发货
					if(this.status!='all'){ //只有不是在全部订单下才删除这一项
						order.splice(index,1);  //删除某项
						this.$set(this,'order',order);
					}else{
						this.listDeal();
					}
				}
				uni.$off('isDelorder'); //取消监听
			})
			
			if(this.action==''){
				this.listDeal();
			}
			
		},
		methods:{
			listDeal(){
				let order_id=uni.getStorageSync('obj').order_id;
				let index=uni.getStorageSync('obj').index;
				uni.showLoading({title:"请稍后..."});
				orderList({
					status: this.status,
					is_dianping: this.is_dianping,
					sale_status: this.sale_status,
					page:  Math.ceil((index+1)/10)
				}).then(res => {
					uni.hideLoading();
					for(let item of res.data){
						if(item.order_id==order_id){
							this.$set(this.order,index,item);
							break;
						}
					}
					
				})
			},
			totkxq(data){
				uni.showModal({
				    title: '退款原因',
				    content: data,
					showCancel:false,
					confirmText:"我知道了",
					confirmColor:"#ff6900",
				    success:  (res)=> {
				        if (res.confirm) {
				            console.log('用户点击确定');
				        } else if (res.cancel) {
				            console.log('用户点击取消');
				        }
				    }
				});
			},
			//点击切换
			taggletab(event){
				let that = this;
				let statusTab = event.currentTarget.dataset.statustab;
				let status = event.currentTarget.dataset.status;
				let is_dianping = event.currentTarget.dataset.is_dianping;
				let sale_status = event.currentTarget.dataset.sale_status;
				this.order= [];
				this.statusTab= statusTab;
				this.tabactive = statusTab;
				this.status = status;
				this.is_dianping= is_dianping;
				this.sale_status= sale_status;
				this.is_loading_done=false;
				this.currentTab=event.target.dataset.current;
				this.pageNum=0;
				this.initializedata();
			},
			  /**
			* 初始化数据
			*/
			  initializedata () {
				this.pageNum++;
			    var that = this;
			    let params = {
			      status: that.status,
			      is_dianping: that.is_dianping,
			      sale_status: that.sale_status,
			      page: this.pageNum,
			    };
				uni.showLoading({
					title: '加载中...'
				});
			    orderList(params).then(res => {
					uni.stopPullDownRefresh();
					uni.hideLoading();//结束加载
					if (res.data == null || res.data.length == 0) {
					   this.is_loading_done= true;
					   this.$api.msg("没有更多了~");
					} else {
						this.order = [...this.order,...res.data]
					}
					uni.pageScrollTo({
					    scrollTop: uni.getStorageSync('scrollTop'),
					    duration: 0
					});
			    })
			},
			 /**
			 * 订单操作
			 */
			operation (event) {
			    let that = this;
			    let action = event.currentTarget.dataset.action;
			    let order_id = event.currentTarget.dataset.orderid;
				let vendor = event.currentTarget.dataset.vendor;
				let index =  Number(event.currentTarget.dataset.index);;
				uni.setStorageSync('obj',{order_id,index});
			    switch (action) {
			      case 'oneKeyCancel': //一键核销 OK
			        that.requestOrder(order_id, action);
					console.info("一键核销");
			        break;
			      case 'oneKeyShipments': //一键发货 OK
					console.info("一键发货");
			        that.express(order_id, action,vendor);
			        break;
			      case 'checkLogistics': //查看物流
			        that.logistics(order_id, action,vendor);
					console.info("查看物流");
			        break;
			      case 'orderDetails':  //订单详情
					console.info("订单详情");
			        that.orderDetails(order_id,order_id);
			        break;
				  case 'consentRefund'://同意退款
					  this.clrefund(1,order_id,index);
					  break;
				  case 'refuseRefund'://拒绝退款
					  this.clrefund(2,order_id,index);
					  break;
			      default:
			        //其他的 退款啥的 处理ok了
					console.info("1111",action);
			        break;
			    }
			},
			//处理退款
			clrefund(type,orderid,index){
				uni.showModal({
					title: '提示',
					content:type==1?'是否确定退款？':'是否拒绝退款',
					success:(res)=> {
						if(res.confirm){
							new Promise((reslove, reject) =>{
								if(type==1){ //同意退款
									consentRefund({order_id:orderid}).then(res=>{
										reslove(res)
									}).catch(err=>{
										reject(err)
									})
								}else{ //拒绝退款
									refuseRefund({order_id:orderid}).then(res=>{
										reslove(res);
									}).catch(err=>{
										reject(err)
									})
								}
								
							}).then((res)=>{
								if(res.code==0){
									if(this.status!="all"){
										let order=this.order;
										order.splice(index,1);  //删除某项
										this.$set(this,'order',order);
									}else{
										this.listDeal();
									}
								}else{
									this.$api.msg(returnRes.msg);
								}
							}).catch((err)=>{
								console.log(err,'失败了');
								//this.$api.msg(err.msg)
							})
						}
					}
				})
			},
			//查看物流
			logistics: function (order_id, action,vendor) {
			    uni.navigateTo({
			      url: '/pages/ViewLogistics/ViewLogistics?order_id=' + order_id + '&action=' + action + '&vendor=' + vendor
			    })
			},
			  //跳转订单详情 商家查看店铺的订单详情
			orderDetails: function (order_id) {
			    uni.navigateTo({
				  url:`/pages/order/shoporderdetail/shoporderdetail?order_id=${order_id}`,
			    })
			},
			  // 跳转发快递订单 ok 发货
			express (order_id, action,vendor) {
			    uni.navigateTo({
			      url: '/pages/order/delivery/delivery?order_id=' + order_id + '&action=' + action + '&vendor=' + vendor
			    })
			},
			  //请求后台操作订单 一键核销
			requestOrder(order_id, action) {
			    var that = this;
			    let params = {
			      order_id: order_id,
			      //action: action,
			    };
				//一键核销方法
			    oneKeyCancel(params).then(res => {
			      if (res.code == 0) {
			        uni.showModal({
			          title: '提示',
			          content: res.msg,
			          showCancel: false,
			          success(res) {
			            uni.redirectTo({
			              url: '/pages/order/shopOrder?status=' + that.status + "&current=" + that.statusTab,
			            })
			          }
			        })
			      } else {
			        this.$api.msg(res.msg);
			      }
			    })
			},
			
		}
	}
</script>

<style lang="scss">
	@import  "./shopOrder.scss"
</style>
