feat: 我的订单入口处增加待处理徽标

src/api/order.ts

@@ -83,3 +83,11 @@ export function orderCancel(data: any) {
 export function bindingAddress(data: any) {
   return http.put<any>(`${pre}/app/order/binding/address`, data)
 }
+
+/**
+ * 订单待处理红点标识
+ * @returns
+ */
+export function pendingRedDots() {
+  return http.get<any>(`${pre}/app/order/pendingRedDots`)
+}

src/pages/index/index.vue

@@ -182,11 +182,13 @@ onShow(() => {
       >
         <image src="/static/header-logo.png" class="h-44rpx w-275rpx" />
         <view class="flex items-center">
-          <image
-            src="/static/icons/search.png"
-            class="mr-20rpx h-36rpx w-36rpx"
-            @click="toPage('/pages/search/search')"
-          />
+          <wd-badge :model-value="0">
+            <image
+              src="/static/icons/search.png"
+              class="mr-20rpx h-36rpx w-36rpx"
+              @click="toPage('/pages/search/search')"
+            />
+          </wd-badge>
           <wd-badge :model-value="unread" :max="99">
             <image
               src="/static/icons/notifications.png"

src/pages/mine/mine.vue

@@ -9,6 +9,7 @@
   </route>
 
 <script lang="ts" setup>
+import { pendingRedDots } from '@/api/order'
 import { getWalletAccountInfo } from '@/api/wallet'
 import { t } from '@/locale'
 import { useUserStore } from '@/store/user'
@@ -33,10 +34,10 @@ const isLoggedIn = computed(() => !!userStore.token)
 const userInfo = computed(() => userStore.userInfo)
 
 const groupList = ref([
-  { name: t('mine.group.toPay'), url: `/pages/myOrders/myOrders`, type: 1, icon: '/static/icons/to-pay.png' },
-  { name: t('mine.group.success'), url: `/pages/myOrders/myOrders`, type: 2, icon: '/static/icons/success.png' },
-  { name: t('mine.group.failed'), url: `/pages/myOrders/myOrders`, type: 3, icon: '/static/icons/failed.png' },
-  { name: t('mine.group.reward'), url: `/pages/myOrders/myOrders`, type: 4, icon: '/static/icons/reward.png' },
+  { name: t('mine.group.toPay'), url: `/pages/myOrders/myOrders`, dotName: 'toPayNum', type: 1, icon: '/static/icons/to-pay.png' },
+  { name: t('mine.group.success'), url: `/pages/myOrders/myOrders`, type: 2, dotName: 'successNum', icon: '/static/icons/success.png' },
+  { name: t('mine.group.failed'), url: `/pages/myOrders/myOrders`, type: 3, dotName: 'failedNum', icon: '/static/icons/failed.png' },
+  { name: t('mine.group.reward'), url: `/pages/myOrders/myOrders`, type: 4, dotName: 'rewardNum', icon: '/static/icons/reward.png' },
 ])
 
 const menuList = ref([
@@ -108,8 +109,21 @@ async function getWalletInfo() {
   console.log(res)
   walletInfo.value = res?.data
 }
+
+const pendingRedDotsData = ref<any>({})
+async function getPendingRedDots() {
+  try {
+    const res = await pendingRedDots()
+    if (res.code === '200') {
+      console.log(res)
+      pendingRedDotsData.value = res?.data
+    }
+  }
+  catch {}
+}
 onShow(() => {
   getWalletInfo()
+  getPendingRedDots()
 })
 onLoad(() => {
   // 页面加载时的逻辑
@@ -184,7 +198,9 @@ onLoad(() => {
     </view>
     <view class="grid grid-cols-4 gap-24rpx">
       <view v-for="(item, index) in groupList" :key="index" class="flex flex-col items-center" @click="toPage(item.url, { type: item.type })">
-        <wd-img width="48rpx" height="48rpx" :src="item.icon" />
+        <wd-badge :model-value="item.type === 3 ? 0 : pendingRedDotsData[item.dotName]" :max="99">
+          <wd-img width="48rpx" height="48rpx" :src="item.icon" />
+        </wd-badge>
         <view class="mt-24rpx text-22rpx text-#3A444C">
           {{ item.name }}
         </view>