<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 class="tabitem flex1" @tap="taggletab(2)" >
				<view class="title" :class="{active:tabactive==2}">退款售后</view>
			</view> -->
		</view>
		
		<!-- v-if="tabactive==1" -->
		<view class="listorder" >
			<view class="orderItem" v-for="(item,index) in order" :key="index">
				<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>
					<!-- 列表 -->
					<view class="order_body  flex  " v-for="(product,index) in item.products" :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 isprice">{{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>
				<view class="pricebox flex ali-c jus-b">
					<!-- 剩余时间 只有待支付的时候有 未付款的时候才有 -->
					<view class="titme oneline flex1" @tap="totkxq(item.refund_details)" 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">
					
					<!-- 已发货 -->
					<!-- <view class="btnitem">查看订单</view>
					<view class="btnitem bg">查看物流</view> -->
					
					<block  v-for="(action,index) in item.order_operation"  :key="index">
						  <view class='btnitem ' :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,
			}
		},
		computed: {
			staticUrl () {//静态资源地址
				return this.$store.state.staticUrl;
			}
		},
		//下拉刷新
		onPullDownRefresh(){
			
			this.is_loading_done=false;
			this.pageNum = 0;
			this.order = [];
			this.initializedata();
			// uni.stopPullDownRefresh();//结束下拉刷新
		},
		//监听滚动
		onPageScroll(e){
			//console.log(e.scrollTop);
			//处理返回顶部
			if(e.scrollTop>400){
				this.isshowtop = true;
			}else{
				this.isshowtop = false;
			}
		},
		//滚动到最底部
		onReachBottom(){
			console.log("11");
			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;
			  }
			})
			
		},
		onShow() {
			this.is_loading_done=false;
			this.pageNum = 0;
			this.order = [];
			this.initializedata();
		},
		methods:{
			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){
				// this.$api.msg("点击了");
				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();//结束加载
			      console.log(res);
			      if (res.data == null || res.data.length == 0) {
			       this.is_loading_done= true;
				   this.$api.msg("没有更多了~");
			      } else {

					this.order = [...this.order,...res.data]

			      }
			      uni.hideLoading();
			    })
			},
			 /**
			 * 订单操作
			 */
			operation (event) {
			    let that = this;
			    let action = event.currentTarget.dataset.action;
			    let order_id = event.currentTarget.dataset.orderid;
			    switch (action) {
			      case 'oneKeyCancel': //一键核销 OK
			        that.requestOrder(order_id, action);
					// oneKeyCancel
					console.info("一键核销");
			        break;
			      case 'oneKeyShipments': //一键发货 OK
					console.info("一键发货");
			        that.express(order_id, action);
			        break;
			      case 'checkLogistics': //查看物流
			        that.logistics(order_id, action);
					// this.$api.msg("开发中,敬请期待~");
					console.info("查看物流");
			        break;
			      case 'orderDetails':  //订单详情
				  console.info("订单详情");
			        that.orderDetails(order_id,order_id);
			        break;
				  case 'consentRefund'://同意退款
					  this.clrefund(1,order_id);
					  break;
				  case 'refuseRefund'://拒绝退款
					  this.clrefund(2,order_id);
					  break;
			      default:
			        //其他的 退款啥的 处理ok了
					console.info("1111",action);
			        break;
			    }
			},
			//处理退款
			async clrefund(type,orderid){
				let res = {}
				
				if(type==1){
					//同意
					res = await consentRefund({
						order_id:orderid
					});
				}else if(type==2){
					//拒绝
					res = await refuseRefund({
						order_id:orderid
					});
				}
				
				if(res.code==0){
					this.$api.msg(res.msg);
					setTimeout(()=>{
						uni.redirectTo({
						  url: '/pages/order/shopOrder?status=' + this.status + "&current=" + this.statusTab,
						})
					},1000)
				}else{
					this.$api.msg(res.msg);
				}
			},
			//查看物流
			logistics: function (order_id, action) {
			    uni.navigateTo({
			      url: '/pages/ViewLogistics/ViewLogistics?order_id=' + order_id + '&action=' + action
			    })
			},
			  //跳转订单详情 商家查看店铺的订单详情
			orderDetails: function (order_id) {
			    uni.navigateTo({//？
			      //url: '/pages/shopOrderDetails/shopOrderDetails?order_id=' + order_id,
				  url:`/pages/order/shoporderdetail/shoporderdetail?order_id=${order_id}`,
			    })
			},
			  // 跳转发快递订单 ok 发货
			express (order_id, action) {
			    uni.redirectTo({
			      url: '/pages/order/delivery/delivery?order_id=' + order_id + '&action=' + action
			    })
			},
			  //请求后台操作订单 一键核销
			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>
