功能完善

src/pages/mine/subs/order/index.vue

@@ -1,5 +1,5 @@
 <template>
-  <tabbar :titles="['全部', '进行中', '已结束']" @change='tabChange' />
+  <tabbar :titles="['全部', '未支付', '已支付']" :index='payStatus' @change='tabChange' />
   <u-list :list='orderList' :border='false' @scrolltolower='loadMore'>
     <u-list-item v-for='(item,index) in orderList' :key='index'>
       <order-item :item='item' @addShoppingCart='addShoppingCart' @pay='payment' />
@@ -13,12 +13,13 @@
 <script lang='ts' setup>
 
 import { ref } from 'vue';
+import { showToast } from '@/utils';
+import { isPending } from '@/utils/order';
 import { getOrderList } from '@/api/order';
 import OrderItem from '@/pages/mine/subs/order/components/order-item.vue';
 import { OrderBean } from '@/api/order/types';
 import SkuDialog from '@/components/sku-dialog.vue';
 import { GoodsBean, StockBean } from '@/api/goods/types';
-import { showToast } from '@/utils';
 import useShoppingCartStore from '@/store/modules/shoppingcart';
 
 const shoppingCartStore = useShoppingCartStore();
@@ -28,8 +29,15 @@ const orderList = ref<OrderBean[]>([]);
 const currentPageNum = ref(1);
 const payStatus = ref(0);
 
-onLoad((e) => {
-  fetchData();
+let currentInterval = 0;
+
+onLoad((e: any) => {
+  const index = Number(e.index) || 0;
+  tabChange(index);
+});
+
+onUnload(() => {
+  clearInterval(currentInterval);
 });
 
 const tabChange = (index: number) => {
@@ -51,8 +59,26 @@ const fetchData = async (refresh: boolean = true) => {
   } else {
     orderList.value = orderList.value.concat(list);
   }
+  handleCountdown(orderList.value.filter(item => item.payStatus == 1));
 };
 
+const handleCountdown = (items: OrderBean[]) => {
+  clearInterval(currentInterval);
+  let second = 30 * 60;
+  currentInterval = setInterval(() => {
+    items.forEach(item => {
+      if(isPending(item)) {
+        item.countdown = second;
+        if(item.countdown <= 0) {
+          item.countdown = 0;
+        }
+        second--;
+      }
+    });
+  }, 1000);
+};
+
+
 const loadMore = () => {
   fetchData(false);
 };