first commit

项目合集/电商App/shop_fontend/src/views/OrderStatus.vue

@@ -0,0 +1,83 @@
+<template>
+  <div class="orderstatus">
+    <NavbarComponents title="订单状态"></NavbarComponents>
+    <div class="content">
+      <van-tabs v-model="active" @click="changeTabs">
+        <van-tab title="全部订单">
+          <OrderCardComponents :list="OrderList"></OrderCardComponents>
+        </van-tab>
+        <van-tab title="待付款">
+          <OrderCardComponents :list="OrderList"></OrderCardComponents>
+        </van-tab>
+        <van-tab title="待发货">
+          <OrderCardComponents :list="OrderList"></OrderCardComponents>
+        </van-tab>
+        <van-tab title="待收货">
+          <OrderCardComponents :list="OrderList"></OrderCardComponents>
+        </van-tab>
+        <van-tab title="退款/售后">
+          <OrderCardComponents :list="OrderList"></OrderCardComponents>
+        </van-tab>
+      </van-tabs>
+    </div>
+  </div>
+</template>
+
+<script>
+import NavbarComponents from "@/components/Navbar";
+import OrderCardComponents from "@/components/OrderCard";
+export default {
+  data() {
+    return {
+      OrderList: [],
+      active: this.$route.query.active == undefined ? 0 : Number(this.$route.query.active),
+      list: [
+          { index: 0, key: -1 },
+          { index: 1, key: 0 },
+          { index: 2, key: 1 },
+          { index: 3, key: 2 },
+          { index: 4, key: 3 },
+      ]
+    };
+  },
+  created() {
+    this.getOrderStatus(this.list[this.active].key)
+  },
+  methods: {
+    changeTabs(index, title) {
+      this.getOrderStatus(this.list[index].key)
+    },
+    async getOrderStatus(status) {
+
+      var data = await this.$http.orderService.allOrder({
+        status: status
+      });
+      console.log(data)
+      if (JSON.stringify(data) == "{}") {
+        this.OrderList = []
+      } else {
+        data.forEach(val => val.wares_masterimg = JSON.parse(val.wares_masterimg)[0])
+        this.OrderList = data
+      }
+
+    }
+  },
+  components: {
+    OrderCardComponents,
+    NavbarComponents
+  },
+  inject: ["close", "open"],
+  beforeRouteEnter(to, from, next) {
+    next(vm => vm.close());
+  },
+  beforeRouteLeave(to, from, next) {
+    this.open();
+    next();
+  },
+};
+</script>
+
+<style lang="stylus" scoped>
+.content
+ margin-top 46px
+</style>