feat(subPack-djk): 添加空状态提示组件

- 在福利列表组件中添加 StatusTip 组件显示暂无内容提示
- 在商品列表组件中添加 StatusTip 组件显示暂无内容提示

feat(subPack-smqjh): 订单列表添加骨架屏加载效果

- 引入 SkeletonRowCol 类型定义
- 实现订单列表骨架屏加载动画
- 优化数据加载逻辑，添加加载状态控制
- 在切换分类和状态时显示骨架屏

src/subPack-djk/commonTab/components/fl.vue

@@ -60,6 +60,7 @@ async function handleGo(item: Api.DjkWelfareVO) {
           </view>
         </view>
         <view class="h40rpx" />
+        <StatusTip v-if="!flList.length" tip="暂无内容" />
       </view>
     </scroll-view>
   </view>

src/subPack-djk/commonTab/components/index.vue

@@ -25,8 +25,8 @@ function handleBottom() {
   <view>
     <wd-navbar
       title="大健康"
-      :bordered="false" :z-index="99" safe-area-inset-top
-      left-arrow placeholder fixed @click-left="router.back()"
+      :bordered="false" :z-index="99"
+      safe-area-inset-top placeholder left-arrow fixed @click-left="router.back()"
     />
     <scroll-view scroll-y :style="{ height: `calc(100vh - ${(statusBarHeight + MenuButtonHeight) * 4}rpx)` }" @scrolltolower="handleBottom">
       <view class="px24rpx">
@@ -69,6 +69,7 @@ function handleBottom() {
       <template v-if="goodsList.length > 10">
         <wd-loadmore :state="state" :loading-props="{ color: '#9ED605', size: 20 }" @reload="reload" />
       </template>
+      <StatusTip v-if="!goodsList.length" tip="暂无内容" />
     </scroll-view>
   </view>
 </template>

src/subPack-smqjh/order/index.vue

@@ -1,7 +1,6 @@
 <script setup lang="ts">
 import OrderRenderer from './components/OrderRenderer.vue'
 import { navTabTypeList, orderStatusList } from './order-data'
-import { createGlobalLoadingMiddleware } from '@/api/core/middleware'
 
 definePage({
   name: 'smqjh-order',
@@ -10,11 +9,12 @@ definePage({
     navigationBarTitleText: '订单列表',
   },
 })
+const skelet = ref(true)
 
 const navActiveTab = ref('all')
 const scrollViewId = ref()
 const orderStatusActive = ref('all')
-const { data: orderList, refresh, isLastPage, page, reload } = usePagination((pageNum, pageSize) => Apis.xsb.orderList({
+const { data: orderList, isLastPage, page, reload } = usePagination((pageNum, pageSize) => Apis.xsb.orderList({
   data: {
     businessType: unref(navActiveTab) === 'all' ? '' : unref(navActiveTab),
     orderStatus: unref(orderStatusActive),
@@ -28,10 +28,10 @@ const { data: orderList, refresh, isLastPage, page, reload } = usePagination((pa
   initialData: [],
   data: res => res.data?.list,
   append: true,
-  middleware: createGlobalLoadingMiddleware(),
-})
+}).onSuccess(() => skelet.value = false)
 
 function handleChangeTypeNav(value: string) {
+  skelet.value = true
   navActiveTab.value = value
   scrollViewId.value = null
   orderList.value = []
@@ -39,8 +39,8 @@ function handleChangeTypeNav(value: string) {
   reload()
 }
 onShow(() => {
-  orderList.value = []
-  refresh()
+  // orderList.value = []
+  reload()
 })
 onReachBottom(() => {
   if (!isLastPage.value) {
@@ -48,6 +48,7 @@ onReachBottom(() => {
   }
 })
 function handleChangeStatus(value: string) {
+  skelet.value = true
   orderStatusActive.value = value
   orderList.value = []
   reload()
@@ -88,13 +89,56 @@ function handleChangeStatus(value: string) {
       </view>
     </view>
     <view class="p-24rpx">
-      <template v-for="item in orderList" :key="item.orderNumber">
-        <OrderRenderer
-          :order-list="item"
-          @refresh="reload"
-        />
-      </template>
-      <StatusTip v-if="!orderList.length" tip="暂无内容" />
+      <templat v-if="skelet">
+        <view v-for="item in 10" :key="item" class="mb20rpx rounded-16rpx bg-white p24rpx">
+          <wd-skeleton
+            animation="gradient"
+            theme="text"
+            :row-col="[{ width: '100%' }]"
+          />
+          <view class="mt20rpx flex">
+            <wd-skeleton
+              animation="gradient"
+              theme="image"
+              :row-col="[{ width: '160rpx', height: '160rpx' }]"
+            />
+            <view class="ml20rpx flex-1">
+              <wd-skeleton
+                animation="gradient"
+                theme="text"
+                :row-col="[{ width: '100%' }]"
+              />
+              <wd-skeleton
+                animation="gradient"
+                theme="text"
+                :row-col="[{ width: '90%' }]"
+                :custom-style="{ marginTop: '20rpx' }"
+              />
+              <wd-skeleton
+                animation="gradient"
+                theme="text"
+                :row-col="[{ width: '80%' }]"
+                :custom-style="{ marginTop: '20rpx' }"
+              />
+            </view>
+          </view>
+          <wd-skeleton
+            animation="gradient"
+            theme="text"
+            :custom-style="{ marginTop: '20rpx' }"
+            :row-col="[{ width: '100%', height: '60rpx' }]"
+          />
+        </view>
+      </templat>
+      <view v-else>
+        <template v-for="item in orderList" :key="item.orderNumber">
+          <OrderRenderer
+            :order-list="item"
+            @refresh="reload"
+          />
+        </template>
+        <StatusTip v-if="!orderList.length" tip="暂无内容" />
+      </view>
     </view>
     <view class="h-20rpx" />
   </view>