Преглед изворни кода

fix: 补货操作页防止加载时空状态闪屏

- 加回loading标志控制内容可见性
- 数据加载期间仅显示轻量'加载中...'文字条
- 隐藏空状态和底部按钮直到数据就绪

Co-Authored-By: Claude <noreply@anthropic.com>
skyline пре 2 дана
родитељ
комит
bb2b453aeb
1 измењених фајлова са 7 додато и 2 уклоњено
  1. 7 2
      haha-admin-mp/src/pages/replenish/operation.vue

+ 7 - 2
haha-admin-mp/src/pages/replenish/operation.vue

@@ -3,6 +3,7 @@
     <NavBar title="补货操作" showBack />
 
     <template>
+      <view class="loading-bar" v-if="loading"><text>加载中...</text></view>
       <!-- 补货单选择器 -->
       <view class="order-selector" v-if="pendingOrders.length > 1">
         <text class="selector-label">补货单</text>
@@ -28,7 +29,7 @@
           </view>
         </view>
 
-        <view class="empty-state" v-if="inventoryList.length === 0">
+        <view class="empty-state" v-if="!loading && inventoryList.length === 0">
           <view class="empty-icon-box"><view class="empty-doc-icon"></view></view>
           <text class="empty-text">暂无商品库存数据</text>
         </view>
@@ -61,7 +62,7 @@
       </view>
 
       <!-- 补货员底部操作 -->
-      <view class="bottom-bar" v-if="inventoryList.length > 0 && isReplenisherUser">
+      <view class="bottom-bar" v-if="!loading && inventoryList.length > 0 && isReplenisherUser">
         <view class="bottom-btn secondary" @click="handleCancel"><text>终止任务</text></view>
         <view class="bottom-btn secondary" @click="handleReopen"><text>重新开门</text></view>
         <view class="bottom-btn primary" :class="{ disabled: submitting || totalReplenishCount === 0 }" @click="handleSubmit">
@@ -102,6 +103,7 @@ const inventoryList = ref<any[]>([]);
 const replenishItems = ref<ReplenishInput[]>([]);
 const submitting = ref(false);
 const isReplenisherUser = ref(false);
+const loading = ref(true);
 const orderId = ref('');
 const orderNo = ref('');
 const showOrderOnly = ref(false);
@@ -320,6 +322,7 @@ onMounted(async () => {
   } catch (e: any) {
     uni.showToast({ title: e.message || '加载失败', icon: 'none' });
   } finally {
+    loading.value = false;
     startDoorPolling();
   }
 });
@@ -332,6 +335,8 @@ onUnmounted(() => {
 <style lang="scss" scoped>
 .page { height: 100vh; background: $bg-color-page; display: flex; flex-direction: column; }
 
+.loading-bar { padding: 12rpx 24rpx; text { font-size: 24rpx; color: $text-color-muted; } }
+
 .order-selector { display: flex; align-items: center; gap: 12rpx; margin: 12rpx 24rpx; padding: 12rpx 20rpx; background: $primary-color-bg; border-radius: $radius-sm; }
 .selector-label { font-size: $font-size-sm; color: $text-color-muted; flex-shrink: 0; }
 .selector-value { display: flex; align-items: center; gap: 6rpx; padding: 4rpx 14rpx; background: $bg-color-card; border-radius: $radius-sm; border: 1rpx solid $border-color;