list.vue 5.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168
  1. <script setup>
  2. import { ref, computed } from 'vue'
  3. import { onShow } from '@dcloudio/uni-app'
  4. import { listWeighing } from '@/api/db'
  5. import {
  6. weighingPhase,
  7. dash,
  8. formatWeight,
  9. filterByKeyword,
  10. todayYmd
  11. } from '@/utils/dbLabels'
  12. import { PAGE_PATHS } from '@/config/api'
  13. const tabs = [
  14. { key: 'today', label: '今日' },
  15. { key: 'second', label: '待二次' },
  16. { key: 'all', label: '全部' }
  17. ]
  18. const activeTab = ref('today')
  19. const keyword = ref('')
  20. const rawList = ref([])
  21. const loading = ref(false)
  22. const stats = computed(() => {
  23. const today = todayYmd()
  24. const todayRows = rawList.value.filter((w) => {
  25. const t = String(w.grossWeightTime || w.createdAt || '')
  26. return t.startsWith(today) && Number(w.isVoided) !== 1
  27. })
  28. const needSecond = todayRows.filter((w) => weighingPhase(w).text === '一次过磅').length
  29. return {
  30. today: todayRows.length,
  31. needSecond
  32. }
  33. })
  34. const list = computed(() => {
  35. let rows = rawList.value
  36. const today = todayYmd()
  37. if (activeTab.value === 'today') {
  38. rows = rows.filter((w) => String(w.grossWeightTime || w.createdAt || '').startsWith(today))
  39. } else if (activeTab.value === 'second') {
  40. rows = rows.filter((w) => weighingPhase(w).text === '一次过磅')
  41. }
  42. return filterByKeyword(rows, keyword.value, [
  43. 'vehicleNo',
  44. 'cargoName',
  45. 'planNo',
  46. 'batchNo',
  47. 'supplier',
  48. 'consignee'
  49. ]).slice(0, 80)
  50. })
  51. const goBack = () => {
  52. uni.navigateBack({
  53. fail: () => uni.switchTab({ url: PAGE_PATHS.workbench })
  54. })
  55. }
  56. const goDetail = (row) =>
  57. uni.navigateTo({ url: `${PAGE_PATHS.dbWeighingDetail}?id=${row.id}` })
  58. const load = async () => {
  59. loading.value = true
  60. try {
  61. // 今日优先带日期参数;全部再拉全量(数据量大时可能慢)
  62. if (activeTab.value === 'all') {
  63. rawList.value = await listWeighing()
  64. } else {
  65. const today = todayYmd()
  66. rawList.value = await listWeighing({ dateFrom: today, dateTo: today })
  67. // 待二次若今日无,再尝试不带日期限制的一次过磅(限制体验:仅今日+已加载)
  68. if (activeTab.value === 'second' && !rawList.value.some((w) => weighingPhase(w).text === '一次过磅')) {
  69. const all = await listWeighing()
  70. rawList.value = all
  71. }
  72. }
  73. } catch (e) {
  74. uni.showToast({ title: e.message || '加载失败', icon: 'none' })
  75. } finally {
  76. loading.value = false
  77. }
  78. }
  79. const switchTab = (key) => {
  80. activeTab.value = key
  81. load()
  82. }
  83. onShow(() => load())
  84. </script>
  85. <template>
  86. <view class="mp-page mp-page--sub">
  87. <view class="mp-header mp-header--db">
  88. <text class="mp-subpage-back" @click="goBack">← 工作台</text>
  89. <text class="mp-header__title" style="margin-top: 16rpx">地磅单管理</text>
  90. <view class="mp-header__search">
  91. <view class="mp-header__search-dot" />
  92. <input
  93. v-model="keyword"
  94. class="mp-header__search-input"
  95. placeholder="车牌 / 货物 / 计划号"
  96. />
  97. </view>
  98. </view>
  99. <view class="mp-stats">
  100. <view class="mp-stat">
  101. <text class="mp-stat__num">{{ stats.today }}</text>
  102. <text class="mp-stat__label">今日过磅</text>
  103. </view>
  104. <view class="mp-stat">
  105. <text class="mp-stat__num">{{ stats.needSecond }}</text>
  106. <text class="mp-stat__label">待二次过磅</text>
  107. </view>
  108. <view class="mp-stat">
  109. <text class="mp-stat__num">{{ list.length }}</text>
  110. <text class="mp-stat__label">当前列表</text>
  111. </view>
  112. </view>
  113. <view class="mp-section" style="padding-bottom: 0; padding-top: 0">
  114. <scroll-view scroll-x class="mp-tabs">
  115. <view
  116. v-for="t in tabs"
  117. :key="t.key"
  118. class="mp-tab"
  119. :class="{ 'mp-tab--active': activeTab === t.key }"
  120. @click="switchTab(t.key)"
  121. >
  122. {{ t.label }}
  123. </view>
  124. </scroll-view>
  125. </view>
  126. <view class="mp-section">
  127. <mp-empty v-if="!list.length && !loading" title="暂无地磅单" />
  128. <view v-else class="mp-list">
  129. <view v-for="row in list" :key="row.id" class="mp-card" @click="goDetail(row)">
  130. <view class="mp-card__head">
  131. <view>
  132. <text class="mp-card__title">{{ dash(row.batchNo || row.id) }}</text>
  133. <text class="mp-card__sub">{{ dash(row.vehicleNo) }} · {{ dash(row.cargoName) }}</text>
  134. </view>
  135. <text class="mp-tag" :class="'mp-tag--' + weighingPhase(row).tag">
  136. {{ weighingPhase(row).text }}
  137. </text>
  138. </view>
  139. <view class="mp-card__row">
  140. <text>净重</text>
  141. <text class="mp-card__row-val">{{ formatWeight(row.netWeight) }}</text>
  142. </view>
  143. <view class="mp-card__row">
  144. <text>过磅时间</text>
  145. <text class="mp-card__row-val">{{ dash(row.grossWeightTime) }}</text>
  146. </view>
  147. <view v-if="weighingPhase(row).text === '一次过磅'" class="mp-card__foot">
  148. <view class="mp-btn mp-btn--primary mp-btn--sm">二次过磅</view>
  149. </view>
  150. </view>
  151. </view>
  152. <view v-if="loading" class="mp-list-loading">加载中…</view>
  153. </view>
  154. </view>
  155. </template>