Browse Source

feat(hb): 优化自动红包配置与统计下钻

- 精简自动红包规则卡片,仅保留状态和配置入口
- 支持按红包类型统计列进入对应使用状态的明细列表
shizhongqi 20 hours ago
parent
commit
baf7348d3e
2 changed files with 13 additions and 83 deletions
  1. 2 74
      hdApp/src/admin/hb/autoSend/list.vue
  2. 11 9
      hdApp/src/admin/hb/stat.vue

+ 2 - 74
hdApp/src/admin/hb/autoSend/list.vue

@@ -1,5 +1,5 @@
 <!--
 <!--
-  自动发红包规则列表,供门店管理员查看四类自动红包的配置状态和摘要
+  自动发红包规则列表,供门店管理员查看四类自动红包的配置状态。
   固定展示全部业务类型,即使接口尚未生成规则也可直接进入配置。
   固定展示全部业务类型,即使接口尚未生成规则也可直接进入配置。
 -->
 -->
 <template>
 <template>
@@ -12,20 +12,6 @@
         </view>
         </view>
         <text class="status" :class="item.statusClass">{{ item.statusName }}</text>
         <text class="status" :class="item.statusClass">{{ item.statusName }}</text>
       </view>
       </view>
-      <view class="summary-row">
-        <view class="summary-item">
-          <text class="summary-value">¥{{ ruleValue(item, 'hbAmount', '0.00') }}</text>
-          <text class="summary-label">红包金额</text>
-        </view>
-        <view class="summary-item">
-          <text class="summary-value">¥{{ ruleValue(item, 'miniCost', '0.00') }}</text>
-          <text class="summary-label">最低消费</text>
-        </view>
-      </view>
-      <view class="scope-row">
-        <text class="scope-label">适用范围</text>
-        <text class="scope-value">{{ item.scopeText || formatScope(item) }}</text>
-      </view>
       <button class="config-btn" @click="goEdit(item.type)">去配置</button>
       <button class="config-btn" @click="goEdit(item.type)">去配置</button>
     </view>
     </view>
   </view>
   </view>
@@ -105,28 +91,6 @@ export default {
       if (Number(status) === 0) return 'disabled'
       if (Number(status) === 0) return 'disabled'
       return 'unconfigured'
       return 'unconfigured'
     },
     },
-    /**
-     * 从卡片或第一条红包规则读取摘要字段。
-     */
-    ruleValue(item, field, fallback) {
-      if (item[field] !== undefined && item[field] !== '') return item[field]
-      let rules = item.rules || []
-      if (typeof rules === 'string') {
-        try {
-          rules = JSON.parse(rules)
-        } catch (error) {
-          rules = []
-        }
-      }
-      return rules[0] && rules[0][field] !== undefined ? rules[0][field] : fallback
-    },
-    /**
-     * 接口未返回摘要时,根据范围类型生成兜底文本。
-     */
-    formatScope(item) {
-      const names = { 1: '全部商品适用', 2: '指定花束分类', 3: '指定花束商品' }
-      return names[Number(item.scopeType) || 1]
-    },
     /**
     /**
      * 进入指定类型的自动红包配置页。
      * 进入指定类型的自动红包配置页。
      */
      */
@@ -183,44 +147,8 @@ export default {
   background: #f2f3f5;
   background: #f2f3f5;
   color: #86909c;
   color: #86909c;
 }
 }
-.summary-row {
-  display: flex;
-  margin-top: 28upx;
-  padding: 24upx 0;
-  border-top: 1upx solid #f4f4f4;
-  border-bottom: 1upx solid #f4f4f4;
-}
-.summary-item {
-  display: flex;
-  flex: 1;
-  flex-direction: column;
-  align-items: center;
-}
-.summary-value {
-  color: #f53f3f;
-  font-size: 34upx;
-  font-weight: bold;
-}
-.summary-label {
-  margin-top: 8upx;
-  color: #999;
-  font-size: 23upx;
-}
-.scope-row {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  padding: 22upx 0;
-}
-.scope-label {
-  color: #666;
-  font-size: 26upx;
-}
-.scope-value {
-  color: #333;
-  font-size: 26upx;
-}
 .config-btn {
 .config-btn {
+  margin-top: 28upx;
   height: 72upx;
   height: 72upx;
   line-height: 72upx;
   line-height: 72upx;
   border-radius: 36upx;
   border-radius: 36upx;

+ 11 - 9
hdApp/src/admin/hb/stat.vue

@@ -134,12 +134,13 @@
         <text>未使用</text>
         <text>未使用</text>
         <text>已失效</text>
         <text>已失效</text>
       </view>
       </view>
-      <view v-for="item in typeStats" :key="item.getType" class="type-row" @click="goTypeList(item)">
-        <text class="type-name">{{ item.getTypeName || formatGetType(item.getType) }}</text>
-        <text>{{ typeTotal(item) }}</text>
-        <text class="used">{{ typeUsed(item) }}</text>
-        <text class="unused">{{ typeUnused(item) }}</text>
-        <text class="expired">{{ typeExpired(item) }}</text>
+      <!-- 按列下钻:发放→全部、已使用→已使用、未使用→待使用、已失效→已失效 -->
+      <view v-for="item in typeStats" :key="item.getType" class="type-row">
+        <text class="type-name" @click="goTypeStatusList(item, '')">{{ item.getTypeName || formatGetType(item.getType) }}</text>
+        <text @click="goTypeStatusList(item, '')">{{ typeTotal(item) }}</text>
+        <text class="used" @click="goTypeStatusList(item, '1')">{{ typeUsed(item) }}</text>
+        <text class="unused" @click="goTypeStatusList(item, '0')">{{ typeUnused(item) }}</text>
+        <text class="expired" @click="goTypeStatusList(item, '-1')">{{ typeExpired(item) }}</text>
       </view>
       </view>
       <view v-if="!typeStats.length" class="empty-text">暂无统计数据</view>
       <view v-if="!typeStats.length" class="empty-text">暂无统计数据</view>
     </view>
     </view>
@@ -356,10 +357,11 @@ export default {
       uni.navigateTo({ url: `/admin/hb/list?${query}` })
       uni.navigateTo({ url: `/admin/hb/list?${query}` })
     },
     },
     /**
     /**
-     * 点击类型统计行时进入该类型的全部红包明细。
+     * 点击类型统计某一列,按对应使用状态进入该类型明细。
+     * 发放/类型名对应全部,已使用、未使用、已失效分别对应列表 tabs。
      */
      */
-    goTypeList(item) {
-      this.goList('', item.getType)
+    goTypeStatusList(item, status) {
+      this.goList(status, item.getType)
     },
     },
     /**
     /**
      * 兜底格式化红包类型名称,接口未返回名称时仍可展示。
      * 兜底格式化红包类型名称,接口未返回名称时仍可展示。