<style>
.jz_MyOrder {
  height: 100vh;
  background-color: #ecf1f4;
}

.jz_OrderList {
  width: 100%;
  min-height: 334rpx;
  background-color: #fff;
  border-radius: 20px;
  padding: 30px;
  margin-bottom: 15px;
  position: relative;
}

.jz_OrderList:first-child {
  border-top-left-radius: 0;
  border-top-right-radius: 0;
}

.jz_OrderTop {
  display: flex;
  align-items: center;
  position: relative;
  padding-bottom: 27rpx;
  border-bottom: 1px solid #e6e6e6;
}

.jz_Oleft {
  color: #111111;
  font-size: 32rpx;
  font-weight: bold;
  width: 70%;
  height: 40rpx;
  overflow: hidden;
}

.jz-Oright {
  color: #111111;
  font-size: 24rpx;
  position: absolute;
  right: 0;
}

.jz_MyOrder_img {
  width: 100rpx;
  height: 100rpx;
  margin-top: 20px;
  border-radius: 20rpx;
  overflow: hidden;
  background:rgba(0,0,0,.05)
}

.jz_MyOrder_img img {
  width: 100%;
  height: 100%;
}

.jz_XiaDan {
  margin-left: 25rpx;
  color: #333333;
  font-size: 24rpx;
  margin-top: 20px;
}

.jz_Zailai {
  background-color: #111111;
  border-radius: 16px;
  width: 150rpx;
  height: 60rpx;
  text-align: center;
  color: #fff;
  line-height: 60rpx;
  font-size: 24rpx;
}

.isShowAll {
  height: auto;
}
.jz_BtnContent {
  margin-top: 15px;
  display: flex;
  align-items: center;
}
</style>
<template>
  <view class="jz_MyOrder">
    <u-tabs
      :list="list"
      :is-scroll="false"
      :current="current"
      :active-color="mainColor"
      :show-bar="showBar"
      @change="change"
      bar-height="4"
      height="100"
    ></u-tabs>
    <u-empty v-if="dataList.length == 0" text="暂无数据" mode="data"></u-empty>
    <template v-else>
      <view
        class="jz_MyOrderMain"
        style="height: calc(100vh - 140px); overflow: hidden"
      >
        <scroll-view
          :scroll-y="true"
          :enable-back-to-top="true"
          :enable-flex="true"
          @scrolltolower="lower"
          :style="{ height: '100%' }"
        >
          <view
            class="jz_OrderList"
            v-for="(item, index) in dataList"
            :key="index"
            @click="goOrderDetail(item)"
          >
            <view class="jz_OrderTop">
              <view class="jz_Oleft" :class="{ isShowAll: !item.isShowHalf }">
                {{ item.title }}
              </view>
              <view style="margin-left: 10px">
                <u-icon
                  name="arrow-down"
                  @click.native.stop="getShow(item)"
                  v-if="item.isShowHalf"
                  color="#2979ff"
                  size="28"
                ></u-icon>
                <u-icon
                  name="arrow-up"
                  @click.native.stop="getShow(item)"
                  v-else
                  color="#2979ff"
                  size="28"
                ></u-icon>
              </view>
              <view class="jz-Oright">
                {{
                  list.find(x=>x.Id==item.orderState||(x.Id==1&&item.orderState==2)).name
                }}
              </view>
            </view>
            <view style="display: flex">
              <view class="jz_MyOrder_img">
                <img
                  mode="aspectFill"
				  v-if="item.imgCover && item.imgCover.length>0"
                  :src="item.imgCover[0].url"
                  alt=""
                />
              </view>
              <view class="jz_XiaDan">
                <view>下单时间：{{ item.createDate }}</view>
                <view style="margin-top: 22rpx"
                  >订单总额：¥{{ item.preferPrice }},
					<text style="margin-left: 15px;">已付款金额：￥<text style="color:indianred">{{item.customerPayMoney?item.customerPayMoney:0}}</text></text>
				  </view
                >
              </view>
            </view>
            <view
              v-if="item.isApplyForCancel == 1"
              style="color: red; font-size: 24rpx; margin-left: 122rpx"
              >订单取消，正在确认中！</view
            >
            <view class="jz_BtnContent">
				<view style="width: 1px;flex: 1;">
					<u-tag mode="plain" border-color="#DFBE6E" color="#DFBE6E" text="待发放优惠券" size="mini" v-if="item.autoCouponId==0"></u-tag>
					<u-tag mode="plain" border-color="#1d1d1d" color="#1d1d1d" text="已发放优惠券" size="mini" v-else-if="item.autoCouponId==1"></u-tag>
				</view>
              <view
                class="jz_Zailai"
                style="margin-right: 10rpx"
                @click.stop="gojz_List"
                >再来一单</view
              >
              <!-- #ifdef MP-WEIXIN -->
              <!-- <view
                v-if="item.orderState == 2"
                class="jz_Zailai"
                style="width: 110rpx; margin-right: 10rpx"
                @click.stop="goZhifu(item)"
                >付款</view
              > -->
              <button
                v-if="item.orderState == 2"
                class="jz_Zailai"
                @click.stop="goZhifu(item)"
                style="width: 110rpx; margin-right: 10rpx; margin-left: 0rpx"
              >
                付款
              </button>
              <!-- #endif -->
              <!-- #ifdef MP-ALIPAY -->
              <view
                v-if="item.orderState == 2"
                class="jz_Zailai"
                style="width: 110rpx; margin-right: 10rpx"
                @click.stop="goZhifuAli(item)"
                >付款</view
              >
              <!-- #endif -->
              <view
                v-if="item.isApplyForCancel != 1 && item.orderState != 4 && item.customerPayMoney==0"
                class="jz_Zailai"
                style="width: 110rpx"
                @click.stop="goCancel(item)"
                >取消</view
              >
            </view>
          </view>
        </scroll-view>
      </view>
    </template>
    <!-- #ifdef MP-ALIPAY -->
    <subscribe-msg />
    <!-- #endif -->
	<tabbars></tabbars>
  </view>
</template>
<script>
import tabbars from "@/components/tabbar/index";
export default {
  components: {
	  tabbars
  },
  data() {
    return {
      pageTitle: "线路订单",
      msg: {
        pageIndex: 1,
        pageSize: 15,
        //MiniAppUserId: 0,
		orderType:-1,
        orderState: 0,
		GroupType:1,//线路订单
		queryDays:0,
		pageCount:0
      },
      mainColor: "",
      list: [
        {
          name: "全部",
          Id: 0,
        },
        {
          name: "待付款",
          Id: 1,
        },
        {
          name: "待发团",
          Id: 3,
        },
		{
		  name: "已完成",
		  Id: 5,
		},
        {
          name: "已取消",
          Id: 4,
        },
      ],
      current: 0,
      dataList: [],
      page_count: 0,
      loadText: {
        loadmore: "轻轻上拉，加载更多",
        loading: "努力加载中",
        nomore: "没有更多了",
      },
      status: "加载中",
      price: 0,
      showBar: true,
	  b2b_user_info:{}
    };
  },
  created() {
	this.b2b_user_info= uni.getStorageSync('b2b_user')
	if(!this.b2b_user_info || !this.b2b_user_info.token){
		uni.redirectTo({
			url:'/pages/jiuzhai/login'
		})
	}
    // #ifdef MP-ALIPAY
    this.showBar = false;
    // #endif
    this.getOrderInfo();
  },
  onLoad(option) {
    this.current = option.status || 0;
    this.mainColor = this.$uiConfig.mainColor;

    let currentPages = getCurrentPages();
    let u = "/" + currentPages[currentPages.length - 1].route;
    let pages = wx.getStorageSync("basedata")
      ? wx.getStorageSync("basedata").bar_title
      : [];
    pages.forEach((x) => {
      if (x.value == u) {
        this.pageTitle = x.new_name ? x.new_name : x.name;
      }
    });
    uni.setNavigationBarTitle({
      title: this.pageTitle,
    });
  },
  methods: {
    goOrderDetail(item) {
      console.log(item);
      uni.navigateTo({
        url: "/pages/jiuzhai/jz_SureOrder?orderId=" + item.orderId,
      });
    },
    change(i) {
      this.current = i;
      this.msg.orderState = this.list[i].Id;
      this.research();
    },
    //获取第一张图
    getFirstImg(obj) {
      if (obj) {
        let objArr = JSON.parse(obj);
        return objArr[0].Url;
      }
    },
    getShow(item) {
      item.isShowHalf = !item.isShowHalf;
      this.$forceUpdate();
    },
    //跳转
    gojz_List() {
      uni.navigateTo({
        url: "/pages/jiuzhai/jz_Line",
      });
    },
    lower(e) {
      if (this.msg.pageIndex < this.page_count) {
        this.msg.pageIndex++;
        this.status = "loading";
        this.getOrderInfo();
      } else {
        this.status = "nomore";
      }
    },
    research() {
      this.msg.pageIndex = 1;
      this.getOrderInfo(1);
    },
    getOrderInfo(type) {
      uni.showLoading({
        title: "加载中",
        icon: "none",
      });
      if (type == 1) {
        this.dataList = [];
      }
      this.userInfo = uni.getStorageSync("mall_UserInfo");
      //this.msg.MiniAppUserId = this.userInfo.UserId;
	  this.msg.CustomerId = this.b2b_user_info.customerId
      this.apipost(
        "sellorder_post_GetTravelOrderAppletList",// sellorder_post_GetTravelOrderB2BList  "sellorder_post_GetMiniAppTravelOrderList",
        this.msg,
        (res) => {
          uni.hideLoading();
          if (res.resultCode == 1) {
            if (type == 1) {
              this.dataList = res.data.pageData;
            } else {
              this.dataList = this.dataList.concat(res.data.pageData);
            }

            this.dataList.forEach((x) => {
              x.isShowHalf = true;
            });
            this.page_count = res.data.pageCount;
          } else {
          }
        },
        null
      );
    },
    //取消订单
    goCancel(item) {
      //未付款-调用后台取消
      if (
        (item.paymentTime == null || item.paymentTime == "") &&
        item.orderState == 2
      ) {
        this.apipost(
          "sellorder_post_B2BRemoveOrder",
          {
            ID: item.orderId,
          },
          (res) => {
            if (res.resultCode == 1) {
              uni.showToast({
                title: "操作成功",
                icon: "success",
              });
              this.research();
            }
          },
          (err) => {}
        );
      } else {
        let msg = {
          OrderId: item.orderId,
          UserId: uni.getStorageSync("mall_UserInfo").UserId,
        };
        //已付款取消申请
        this.apipost(
          "sellorder_post_AppletUserCancelOrder",
          msg,
          (res) => {
            if (res.resultCode == 1) {
              uni.showToast({
                title: "操作成功",
                icon: "success",
              });
              this.research();
            } else {
            }
          },
          null
        );
      }
    },
    //付款
    // #ifdef MP-WEIXIN
    goZhifu(item) {
      console.log(item, "item");
      let url = "/api/WeChatPay/GetTravlePayInfo";
      let GoodsName = item.title;
      GoodsName = GoodsName.slice(0, 10);
      this.price = item.preferPrice;
      this.request2(
        {
          url: url,
          data: {
            OrderId: item.orderId,
            GoodsName: GoodsName,
            OrderPayType: 1,
            OpenId: uni.getStorageSync("mall_UserInfo").OpenId,
          },
        },
        (res) => {
		  try{
		  	let orderInfo = JSON.parse(res.data);
		  	// this.goPay(orderInfo);
		  	this.subscribeMsg(orderInfo);
		  }catch(e){
		  	uni.showToast({
		  		title:'无法正常拉取微信支付，你可以稍后重试或联系销售人员线下转款',
		  		icon:'none'
		  	})
		  }
        }
      );
    },
    subscribeMsg(orderInfo) {
      const that = this;
      let tempObj = uni.getStorageSync("basedata")?.mall?.wechatmessage ?? [];
      let tmplIds = [];
      if (tempObj && tempObj.length > 0) {
        tempObj.forEach((x) => {
          if (x.Name == "下单成功提醒" || x.Name == "订单取消提醒") {
            tmplIds.push(x.MessageId);
          }
        });
      }
      uni.requestSubscribeMessage({
        tmplIds: tmplIds,
        complete(res) {
          that.goPay(orderInfo);
        },
      });
    },
    goPay(orderInfo) {
      let that = this;
      uni.requestPayment({
        provider: "wxpay",
        timeStamp: orderInfo.timeStamp,
        nonceStr: orderInfo.nonceStr,
        package: orderInfo.package,
        signType: orderInfo.signType,
        paySign: orderInfo.sign,
        success: function (res) {
          console.log("success", res);
          uni.showToast({
            title: "支付成功",
          });
          //todo
          uni.redirectTo({
            url:
              "/pages/jiuzhai/paysuccess?PreferPrice=" +
              that.price +
              "&isFrom=1",
          });
        },
        fail: function (err) {
          console.log("fail:", err);
          uni.showToast({
            title: "支付失败",
          });
        },
      });
    },
    // #endif
    // #ifdef MP-ALIPAY
    goZhifuAli(item) {
      let that = this;
      uni.showLoading({
        title: "支付中",
      });
      console.log(item, "item");
      let url = "/api/WeChatPay/GetTravlePayInfo";
      this.price = item.preferPrice;
      this.request2(
        {
          url: url,
          data: {
            OrderId: item.orderId,
            GoodsName: item.title,
            OrderPayType: 2,
            OpenId: uni.getStorageSync("mall_UserInfo").OpenId,
          },
        },
        (res) => {
          if (res.data) {
            this.$utils.SubscribeMsgAli(() => {
              that.goPayAli(res.data, item);
            });
          } else {
            uni.hideLoading();
            uni.showToast({
              title: "获取交易号失败",
              duration: 2000,
            });
          }
        }
      );
    },
    goPayAli(tradeNO, item) {
      let that = this;
      my.tradePay({
        tradeNO: tradeNO,
        success: function (res) {
          console.log("success", res);
          const list = ["9000"];
          if (list.includes(res.resultCode)) {
            let obj = {
              TradeNo: tradeNO,
              OrderNo: item.orderNo,
              OrderId: item.orderId,
              preferPrice: item.preferPrice,
            };
            that.payAliCallback(obj);
          } else {
            uni.hideLoading();
            uni.showToast({
              title: "支付失败",
              icon: "none",
            });
          }
        },
        fail: function (err) {
          console.log("fail:", err);
          uni.hideLoading();
          uni.showToast({
            title: "支付失败",
            icon: "none",
          });
        },
      });
    },
    payAliCallback(obj) {
      this.request2(
        {
          url: "/api/AliPay/ALiPayCallBackDmcNotify",
          data: {
            OrderNo: obj.OrderNo,
            OrderId: obj.OrderId,
            UserId: uni.getStorageSync("mall_UserInfo").UserId,
            TradeNo: obj.TradeNo,
            ProjectType: 2,
            PreferPrice: obj.preferPrice,
          },
        },
        (res) => {
          console.log("cb", res);
          uni.redirectTo({
            url:
              "/pages/jiuzhai/paysuccess?PreferPrice=" +
              obj.preferPrice +
              "&isFrom=1",
          });
          uni.hideLoading();
        },
        (err) => {
          console.log("cb2", err);
          uni.hideLoading();
          uni.showToast({
            title: "支付失败",
            icon: "none",
          });
        }
      );
    },
    // #endif
  },
};
</script>
