H5-Merchant/pages/ordermanagement/index.vue

<template>
  <view class="ordermanagement">
    <view class="ordermanagement-header">
      <view class="ordermanagement-header-text"> 订单管理 </view>
      <view class="ordermanagement-list">
        <view class="ordermanagement-list-yi">
          <view class="ordermanagement-list-yi-top">
            {{ orderSta.orderPayment == undefined ? 0 : orderSta.orderPayment }}
          </view>
          <view class="ordermanagement-list-yi-bottom"> 已支付订单数 </view>
        </view>
        <view class="ordermanagement-list-yi">
          <view class="ordermanagement-list-yi-top">
            {{ orderSta.payPrice == undefined ? 0 : orderSta.payPrice }}
          </view>
          <view class="ordermanagement-list-yi-bottom"> 实际支付金额 </view>
        </view>
        <view class="ordermanagement-list-yi">
          <view class="ordermanagement-list-yi-top">
            {{ orderSta.refundPrice == undefined ? 0 : orderSta.refundPrice }}
          </view>
          <view class="ordermanagement-list-yi-bottom"> 已退款金额 </view>
        </view>
      </view>
    </view>
    <view class="ordermanagement-ding">
      <view class="view-wrapper">
        <view class="ordermanagement-ding-text"> 我的订单 </view>
        <view class="view-all" @click="jiru('all', 0)">
          <text>查看全部</text>
          <image
            src="/static/images/new_ui/arrow-right.png"
            class="icon-img"
          ></image>
        </view>
      </view>
      <view class="ordermanagement-ding-nei">
        <view
          class="ordermanagement-yisdf"
          v-for="(item, index) in dingdan"
          :key="index + '__index__'"
          @click="jiru(item.status, index + 1)"
        >
          <view class="ordermanagement-img">
            <image :src="item.img" mode="widthFix"></image>
            <view class="ordermanagement-img-biao" v-if="item.num > 0">
              {{ item.num }}
            </view>
          </view>
          <view class="">
            {{ item.name }}
          </view>
        </view>
      </view>
    </view>

    <view class="ordermanagement-dingsss">
      <view class="view-wrapper">
        <view class="ordermanagement-ding-text"> 售后管理 </view>
        <view class="view-all" @click="afterSalesClick('all', 0)">
          <text>查看全部</text>
          <image
            src="/static/images/new_ui/arrow-right.png"
            class="icon-img"
          ></image>
        </view>
      </view>
      <view class="ordermanagement-ding-nei">
        <view
          class="ordermanagement-yisdf"
          v-for="(item, index) in dingdansss"
          :key="index + 'pp' + '__index__'"
          @click="afterSalesClick(item.status, index + 1)"
        >
          <view class="ordermanagement-img">
            <image :src="item.img" mode="widthFix"></image>
            <view class="ordermanagement-img-biao" v-if="item.num > 0">
              {{ item.num }}
            </view>
          </view>
          <view class="">
            {{ item.name }}
          </view>
        </view>
      </view>
    </view>

    <!-- <quickPickUpVue class="custom_pick-up"></quickPickUpVue> -->
  </view>
</template>

<script>
import {
  getOrderStatusNumber,
  getOrderList,
  getAfterSaleList,
} from "@/commit/order.js";
import quickPickUpVue from "./components/quickPickUp/quickPickUp.vue";
import { toQueryString } from "@/utils/index.js";
	import readAppInfo ,{getPhpToken}from '@/utils/readAppInfo.js';
export default {
  components: { quickPickUpVue },
  data() {
    return {
      orderSta: {
        orderPayment: "0",
        payPrice: "0",
        refundPrice: "0",
      },
      num: {}, //正向订单状态数
      mer_id: 264,
      dingdan: [
        {
          img: "https://cdn.bjtdba.com/vod/image/2022-08-12/20220812154736170.png",
          name: "待付款",
          status: 1,
        },
        {
          img: "https://cdn.bjtdba.com/vod/image/2022-08-12/20220812154723185.png",
          name: "待发货",
          status: 2,
        },
        {
          img: "https://cdn.bjtdba.com/vod/image/2022-08-12/20220812154804269.png",
          name: "待收货",
          status: 3,
        },
        {
          img: "https://cdn.bjtdba.com/vod/image/2022-08-12/20220812154750259.png",
          name: "待评价",
          status: 4,
        },
        // {
        // 	img: 'https://cdn.bjtdba.com/vod/image/2022-08-12/20220812154847886.png',
        // 	name: '已退款',
        //status:6
        // }
      ],
      dingdansss: [
        {
          img: "https://cdn.bjtdba.com/vod/image/2022-08-12/20220812154932244.png",
          name: "审核中",
          status: 0,
          num: 0,
        },
        {
          img: "https://cdn.bjtdba.com/vod/image/2022-08-12/20220812154949118.png",
          name: "处理中",
          num: 0,
          status: 2,
        },
        {
          img: "https://cdn.bjtdba.com/vod/image/2022-08-12/20220812155008586.png",
          name: "已完成",
          num: 0,
          status: 3,
        },
      ],
	  uid: "",
	  authorization: "",
    };
  },
  async onLoad() {

	
	
	console.log("进了我的页面了");

	
	await readAppInfo();
	await getPhpToken();
	return;
	let jurisdiction = uni.getStorageSync("jurisdiction") || [];
	console.log("jurisdiction", jurisdiction);
	let mnuList = this.mnu;
	if (jurisdiction) {
	  jurisdiction.forEach((res, index) => {
	    mnuList.forEach((result, i) => {
	      if (res == result.id) {
	        result.show = true;
	      }
	      return result;
	    });
	    return res;
	  });
	  this.mnu = mnuList;
	}
	
	console.log(this.mnu);
	
	setTimeout(function () {
	  uni.hideLoading();
	}, 700);
	
	console.log("我的show===>>>>>>");
	
	this.authorization = uni.getStorageSync("authorization");
	let userinfo = uni.getStorageSync("userinfo");
	this.uid = userinfo.uid;
	console.log("onshow");
	return;
	
	let authorization = uni.getStorageSync("authorization");
	// let userinfo = uni.getStorageSync('userinfo')
	let selectmerchant = uni.getStorageSync("selectmerchant");
	let uid = userinfo.uid;
	console.log(selectmerchant, authorization, userinfo);
	if (authorization && uid) {
	  if (selectmerchant.merId >= 0 && selectmerchant.status == -1) {
	    uni.redirectTo({
	      url: "/openmerchant/guide/index", //有或者没有商户 没有金额支付and激活码支付
	    });
	    return;
	  } else if (
	    selectmerchant.merId > 0 &&
	    (selectmerchant.status == 1 || selectmerchant.status == 5)
	  ) {
	    return;
	  } else if (
	    selectmerchant.merId >= 0 &&
	    (selectmerchant.status == 3 || selectmerchant.status == 4)
	  ) {
	    uni.redirectTo({
	      url: "/openmerchant/shopentry/process?mer_id=" + selectmerchant.merId, //已开通商户未填写资料
	    });
	    return;
	  } else if (selectmerchant.merId > 0 && selectmerchant.status == 0) {
	    uni.redirectTo({
	      url: "/openmerchant/shopentry/processaudit?submitCode=" + 3, //已开通商户待审核
	    });
	    return;
	  } else if (selectmerchant.merId > 0 && selectmerchant.status == 2) {
	    uni.redirectTo({
	      url: "/openmerchant/shopentry/processaudit?submitCode=" + 2, //已开通商户审核拒绝
	    });
	    return;
	  }
	}
  },
  async onShow() {
   
    let selectmerchant = uni.getStorageSync("selectmerchant");
    this.mer_id = selectmerchant.merId;
      uni.showLoading({
      title: "加载中",
    });
    try {
     
      await this.getOrderListData();
      await this.getOrderStatusNumberData();
      await this.getAfterSaleListData();
    } finally {
      uni.hideLoading();
    }
  },
  methods: {
    //售后管理
    afterSalesClick(status, index) {
      const params = {
        tabIndex: index,
        mer_id: this.mer_id,
        status: status,
      };
      uni.redirectTo({
        url: `../../shop/afterSalesManagement/index?${toQueryString(params)}`,
      });
    },
    // 订单金额
    async getOrderListData() {
      try {
        const res = await getOrderList({
          order_sn: "",
          order_type: -1,
          distribution_mode: -1,
          keywords: "",
          status: "",
          date: "",
          page: 1,
          limit: 20,
          type: 1,
          username: "",
          pay_type: -1,
          ylj_status: "",
          paid: "",
        });
        console.log(res, "resresresresres");
        if (res.data.status === 200) {
          const data = res.data.data.stat || [];

          let obj = {
            已支付订单数量: "orderPayment",
            实际支付金额: "payPrice",
            已退款金额: "refundPrice",
          };
          data.forEach((item) => {
            this.orderSta[obj[item.name]] = item.count || undefined;
          });
        }
      } catch (error) {
      } finally {
        // uni.hideLoading();
      }
    },

    // 正向订单状态数
    getOrderStatusNumberData() {
      getOrderStatusNumber({
        order_sn: "",
        order_type: "-1",
        distribution_mode: "-1",
        keywords: "",
        status: "",
        date: "",
        page: 1,
        limit: 10,
        type: 1,
        username: "",
        pay_type: -1,
        ylj_status: "",
        paid: "",
      }).then(
        (res) => {
          if (res.data.status == 200) {
            this.num = res.data.data;
            this.dingdan = [
              {
                img: "https://cdn.bjtdba.com/vod/image/2022-08-12/20220812154736170.png",
                name: "待付款",
                num: this.num.unpaid || 0,
                status: 1,
              },
              {
                img: "https://cdn.bjtdba.com/vod/image/2022-08-12/20220812154723185.png",
                name: "待发货",
                num: this.num.unshipped || 0,
                status: 2,
              },
              {
                img: "https://cdn.bjtdba.com/vod/image/2022-08-12/20220812154804269.png",
                name: "待收货",
                num: this.num.untake || 0,
                status: 3,
              },
              {
                img: "https://cdn.bjtdba.com/vod/image/2022-08-12/20220812154750259.png",
                name: "待评价",
                num: this.num.unevaluate || 0,
                status: 4,
              },
            ];
            // uni.hideLoading();
          }
        },
        (fail) => {
          // uni.hideLoading();
          console.log(fail);
        }
      );
    },
    //售后
    async getAfterSaleListData() {
      try {
        const res = await getAfterSaleList({
          refund_order_sn: "",
          status: "",
          date: "",
          page: 1,
          limit: 20,
          order_sn: "",
          refund_type: "",
        });

        if (res.data.status == 200) {
          const data = res.data.data.stat;
          var num = data.refuse;
          var num1 = data.end;
          var num2 = data.agree;

          let finishOrder = num + num1 + num2;
          this.dingdansss[0].num = data.audit || 0;
          this.dingdansss[1].num = data.backgood || 0;
          this.dingdansss[2].num = finishOrder || 0;
        }
        // uni.hideLoading();
      } catch (error) {
      } finally {
        // uni.hideLoading();
      }
    },
    jiru(e, i) {
      let authorization = uni.getStorageSync("authorization");
      let userinfo = uni.getStorageSync("userinfo");
      let selectmerchant = uni.getStorageSync("selectmerchant");
      let uid = userinfo.uid;
      uni.redirectTo({
        url: "../../shop/commodity/order?status=" + e + "&index=" + i,
      });
      return;
      if (authorization && uid) {
        if (selectmerchant.merId >= 0 && selectmerchant.status == -1) {
          uni.redirectTo({
            url: "/openmerchant/guide/index", //有或者没有商户 没有金额支付and激活码支付
          });
          return;
        } else if (
          selectmerchant.merId > 0 &&
          (selectmerchant.status == 1 || selectmerchant.status == 5)
        ) {
          uni.redirectTo({
            url: "../../shop/commodity/order?status=" + e + "&index=" + i,
          });
          return;
        } else if (
          selectmerchant.merId >= 0 &&
          (selectmerchant.status == 3 || selectmerchant.status == 4)
        ) {
          uni.redirectTo({
            url:
              "/openmerchant/shopentry/process?mer_id=" + selectmerchant.merId, //已开通商户未填写资料
          });
          return;
        } else if (selectmerchant.merId > 0 && selectmerchant.status == 0) {
          uni.redirectTo({
            url: "/openmerchant/shopentry/processaudit?submitCode=" + 3, //已开通商户待审核
          });
          return;
        } else if (selectmerchant.merId > 0 && selectmerchant.status == 2) {
          uni.redirectTo({
            url: "/openmerchant/shopentry/processaudit?submitCode=" + 2, //已开通商户审核拒绝
          });
          return;
        }
      } else {
        uni.navigateTo({
          url: "/pages/user/login/index?type=1",
        });
        return;
      }
    },
  },
};
</script>
<style>
page {
  background-color: #f7f8fc;
}
</style>
<style lang="scss" scoped>
.ordermanagement {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  padding-bottom: 50rpx;
  box-sizing: border-box;

  .ordermanagement-header {
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    height: 328rpx;
    background: linear-gradient(
      180deg,
      rgba(31, 124, 255, 0.22) 0%,
      rgba(255, 255, 255, 0.15) 100%
    );
    position: relative;
    display: flex;
    justify-content: center;

    .ordermanagement-header-text {
      position: absolute;
      font-size: 46rpx;
      font-weight: 500;
      color: #333333;
      top: 60rpx;
      left: 64rpx;
    }

    .ordermanagement-list {
      position: absolute;
      top: 160rpx;
      width: calc(100% - 54rpx);
      min-height: 150rpx;
      margin: 0 26rpx;
      background: #ffffff;
      border-radius: 16rpx;
      display: flex;
      justify-content: space-around;
      align-items: center;

      .ordermanagement-list-yi {
        height: 70rpx;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: center;

        .ordermanagement-list-yi-top {
          font-size: 36rpx;
          font-weight: bold;
          color: #333333;
        }

        .ordermanagement-list-yi-bottom {
          font-size: 26rpx;
          font-weight: 400;
          color: #333333;
        }
      }
    }
  }
  .view-wrapper {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
  }
  .view-all {
    display: flex;
    justify-content: center;
    align-items: center;
    font-family: PingFangSC, PingFang SC;
    font-weight: 400;
    font-size: 24rpx;
    > text:first-child {
      padding-right: 8rpx;
      color: #999999;
    }
    .icon-img {
      width: 26rpx;
      height: 26rpx;
    }
  }
  .ordermanagement-ding {
    width: calc(100% - 54rpx);
    min-height: 216rpx;
    margin: 20rpx 26rpx 32rpx 26rpx;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;

    .ordermanagement-ding-text {
      font-size: 30rpx;
      font-weight: 600;
      color: #333333;
    }

    .ordermanagement-ding-nei {
      width: 100%;
      height: 160rpx;
      background: #ffffff;
      border-radius: 16rpx;
      display: flex;
      justify-content: space-around;
      align-items: center;

      .ordermanagement-yisdf {
        height: 96rpx;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: center;
        font-size: 24rpx;
        font-weight: 400;
        color: #5f6060;
      }
    }
  }
  .ordermanagement-img {
    width: 48rpx;
    height: 48rpx;
    position: relative;

    image {
      width: 100%;
      height: 100%;
    }

    .ordermanagement-img-biao {
      position: absolute;
      left: 40rpx;
      bottom: 31rpx;
      width: 30rpx;
      height: 30rpx;
      border-radius: 50%;
      padding: 6rpx;
      background: #fe0032;
      font-size: 20rpx;
      font-weight: 400;
      color: #ffffff;
      display: flex;
      justify-content: center;
      align-items: center;
    }
  }
  .ordermanagement-dingsss {
    width: calc(100% - 52rpx);
    height: 216rpx;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: flex-start;

    .ordermanagement-ding-text {
      font-size: 30rpx;
      font-weight: 600;
      color: #333333;
    }

    .ordermanagement-ding-nei {
      width: 100%;
      height: 160rpx;
      background: #ffffff;
      border-radius: 16rpx;
      display: flex;
      justify-content: space-around;
      align-items: center;

      .ordermanagement-yisdf {
        height: 96rpx;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: center;
        font-size: 24rpx;
        font-weight: 400;
        color: #5f6060;

        .ordermanagement-img {
          width: 48rpx;
          height: 48rpx;

          image {
            width: 100%;
            height: 100%;
          }
        }
      }
    }
  }

  .custom_pick-up {
    width: calc(100% - 54rpx);
    margin: 0 26rpx;
  }
}
</style>