代码提交

pages/orderList/orderList.vue

@@ -1,98 +1,134 @@
 <template>
-  <layout>
-    <uv-sticky
-      bgColor="#fff"
-      customNavHeight="0"
-    >
-      <uv-navbar
-        :fixed="false"
-        title="全部订单"
-        @leftClick="$onClickLeft"
-      />
-      <uv-tabs
-        :list="navList"
-        @click="click"
-        lineColor="#f56c6c"
-        :current="actionType"
+  <view>
+    <layout>
+      <uv-sticky
+          bgColor="#fff"
+          customNavHeight="0"
       >
-        ></uv-tabs>
-    </uv-sticky>
-    <view class="orderList">
-      <order
-        :data="item"
-        v-for="(item, index) in orderListData"
-        :key="actionType + '_' + index"
-        @refresh="handleRefresh"
-      />
-    </view>
-  </layout>
+        <uv-navbar
+            :fixed="false"
+            title="全部订单"
+            @leftClick="goBack"
+        />
+        <uv-tabs
+            :list="navList"
+            @click="click"
+            lineColor="#f56c6c"
+            :current="actionType"
+        >
+        </uv-tabs>
+      </uv-sticky>
+      <view class="orderList">
+        <template v-if="!listEmpty">
+          <order
+              :data="item"
+              v-for="(item, index) in dataList"
+              :key="actionType + '_' + index"
+              @refresh="handleRefresh"
+              @pay="openPay"
+          />
+        </template>
+        <Empty
+            :iconSrc="emptyIcon"
+            v-else
+        >
+          您还没有相关订单~
+        </Empty>
+        <!-- 加载中 -->
+        <ListLoadLoading v-if="loading" />
+        <!-- 加载完毕-->
+        <ListLoadOver v-if="loadend" />
+      </view>
+    </layout>
+  </view>
+  <!-- 支付弹窗 -->
+  <PayPopup
+      ref="payPopupRef"
+      @confirm="paySuccess"
+  />
 </template>
 
 <script setup>
-import { ref } from 'vue'
-import { navigateTo, back } from '@/utils/router'
+import { ref, unref } from 'vue'
 import { onLoad } from '@dcloudio/uni-app'
-import { useMainStore } from '@/store/store'
 import { orderList } from '@/api/order'
+import { useRouter } from "@/hooks/useRouter";
+import Empty from '@/components/Empty/index.vue'
+import emptyIcon from '@/static/icon/empty/订单.png'
+import PayPopup from '@/components/PayPopup/index.vue'
+import { usePage } from "@/hooks";
+import { getProductList } from "@/api/product";
+
+const {type, refresh, dataList, loadend, loading, listEmpty} = usePage(orderList)
+
+const {getParams, goBack, push} = useRouter()
 
-const orderListData = ref([])
 const actionType = ref(0)
 
 
 const navList = ref([
-  { name: "全部", value: -1, },
-  { name: "未支付", value: 0, },
-  { name: "待发货", value: 1, },
-  { name: "待收货", value: 2, },
-  { name: "待评价", value: 3, },
-  { name: "已完成", value: 4, },
+  {name: "全部", value: -1,},
+  {name: "未支付", value: 0,},
+  {name: "待发货", value: 1,},
+  {name: "待收货", value: 2,},
+  {name: "待评价", value: 3,},
+  {name: "已完成", value: 4,},
   // { name: "退款中", value: 5, },
   // { name: "已退款", value: 6, },
   // { name: "退款", value: 7, },
 ])
 
 
-const handleOrderList = async (option) => {
-  orderListData.value = []
-  let res = await orderList(option)
-  orderListData.value = res
-  console.log("gxs --> % data:\n", res)
-}
+// const handleOrderList = async (option) => {
+//   orderListData.value = []
+//   orderListData.value = await orderList(option)
+//   orderListData.value.forEach(item => {
+//     item.status = item.paid === 1 && item.status === 0 ? 99 : item.status
+//   })
+// }
 
 const handleRefresh = () => {
-  handleOrderList({
-    type: navList.value[actionType.value].value + 1
-  })
+  // 确认收货
+  if (actionType.value === 2) {
+    actionType.value++
+    type.value++
+  }
+  refresh()
 }
 
 
 const click = (data) => {
-  handleOrderList({
-    type: data.value
-  })
-  console.log("--> % click % data:\n", data)
-
+  type.value = data.value
+  refresh()
 }
 
-onLoad(({ type }) => {
-  handleOrderList({
-    type
-  })
-  if (type < 0 || !type) {
+// ============================== 支付相关 ===============================
+const payPopupRef = ref()
+
+function openPay(orderId) {
+  unref(payPopupRef).show(orderId)
+}
+
+function paySuccess() {
+  // push({url: '/pages/payStatus/index?type=1'})
+}
+
+
+onLoad((options) => {
+  const params = getParams(options)
+  type.value = params.type
+  refresh()
+  if (Number(type.value < 0)) {
     actionType.value = 0
-  } else {
-    actionType.value = Number(type) + 1
+    return
   }
-  console.log("--> % onLoad % actionType.value:\n", actionType.value)
-  console.log("--> % onLoad % type:\n", type)
-
+  actionType.value = type.value + 1
 })
 
 
-
 </script>
 
-<style lang="less">
+<style lang="scss">
 .orderList {
   padding: 20rpx 0;
 }