Răsfoiți Sursa

feat(shareDiscount): enhance metrics display and update UI components

- Improved the layout of metric cards to include tooltips for additional information.
- Updated titles and labels for clarity, including changes to "分享人数趋势" and "参与占比/活动参与浏览量".
- Adjusted the grid layout for metrics to accommodate additional data points.
- Refactored input handling logic in the priceWorkbench component for better user interaction.
ylong 2 zile în urmă
părinte
comite
c7659cad13

+ 19 - 11
src/views/marketing/shareDiscount/fission/index.vue

@@ -59,9 +59,16 @@
                         :span="4"
                     >
                         <el-card shadow="never" class="metric-card">
-                            <div class="text-gray-500 text-sm mb-2">{{
-                                item.title
-                            }}</div>
+                            <div class="text-gray-500 text-sm mb-2 flex items-center gap-1">
+                                <span>{{ item.title }}</span>
+                                <el-tooltip
+                                    v-if="item.tip"
+                                    :content="item.tip"
+                                    placement="top"
+                                >
+                                    <el-icon class="cursor-pointer"><QuestionFilled /></el-icon>
+                                </el-tooltip>
+                            </div>
                             <div class="text-xs text-gray-400 mb-2">{{
                                 displayDateRange
                             }}</div>
@@ -105,7 +112,7 @@
 
             <!-- Chart Section -->
             <div class="trend-chart-section">
-                <div class="text-lg font-bold mb-4">分享人数趋势</div>
+                <div class="text-lg font-bold mb-4">30日分享人数趋势</div>
                 <div class="h-80 w-full" ref="chartRef"></div>
             </div>
         </el-card>
@@ -117,6 +124,7 @@
     import * as echarts from 'echarts';
     import dayjs from 'dayjs';
     import { ElMessage } from 'element-plus';
+    import { QuestionFilled } from '@element-plus/icons-vue';
     import request from '@/utils/request';
 
     defineOptions({ name: 'ShareDiscountFission' });
@@ -167,17 +175,18 @@
                 change: formatComparison(data.reduceOrderNumComparison)
             },
             {
-                title: '今日活动订单浏览量',
+                title: '今日活动书单浏览量',
                 value: `${data.bookViewTimes ?? 0}次`,
                 change: formatComparison(data.bookViewTimesComparison)
             },
             {
-                title: '参与占比/活动参与浏览量',
+                title: '参与占比/活动书单浏览',
+                tip: '助力人数/浏览的裂变书籍数量',
                 value: formatPercent(data.viewJoinRate),
                 change: formatComparison(data.viewJoinRateComparison)
             },
             {
-                title: '今日助力使用产品占比',
+                title: '今日助力新用户占比',
                 value: formatPercent(data.helpNewUserRate),
                 change: formatComparison(data.helpNewUserRateComparison)
             },
@@ -196,9 +205,8 @@
             { label: '助力次数', value: data.reduceHelpTimes ?? 0 },
             { label: '订单总本数', value: data.orderBookNum ?? 0 },
             { label: '参与活动本数', value: data.reduceBookNum ?? 0 },
-            { label: '参与活动总金额', value: data.orderTotalMoney ?? 0 },
-            { label: '订单带收益金额', value: data.orderPayMoney ?? 0 },
-            { label: '降价带收益金额', value: data.reduceTotalMoney ?? 0 },
+            { label: '订单预估总金额', value: data.orderTotalMoney ?? 0 },
+            { label: '降价预估总金额', value: data.reduceTotalMoney ?? 0 },
             { label: '实际降价金额', value: data.actualReduceMoney ?? 0 },
             { label: '加购次数', value: data.reduceCartNum ?? 0 }
         ];
@@ -369,7 +377,7 @@
 
     .number-metrics {
         display: grid;
-        grid-template-columns: repeat(5, minmax(0, 1fr));
+        grid-template-columns: repeat(8, minmax(0, 1fr));
         gap: 12px;
     }
 

+ 2 - 2
src/views/priceWorkbench/taskPending/index.vue

@@ -40,12 +40,12 @@
                 <el-table-column prop="itemStatusName" label="状态" width="100" />
                 <el-table-column label="新售价" width="150">
                     <template #default="{ row }">
-                        <el-input-number v-model="row._newPrice" :min="0" :precision="2" :controls="false" :disabled="Number(row.itemStatus)===2 || itemTab===2" />
+                        <el-input-number v-model="row._newPrice" :min="0" :precision="2" :controls="false" :disabled="Number(row.itemStatus)!==2 || itemTab===2" />
                     </template>
                 </el-table-column>
                 <el-table-column label="操作" width="120" fixed="right">
                     <template #default="{ row }">
-                        <el-button type="primary" size="small" :loading="submittingId===row.itemId" :disabled="Number(row.itemStatus)===2 || itemTab===2" @click="handleSubmit(row)">提交</el-button>
+                        <el-button type="primary" size="small" :loading="submittingId===row.itemId" :disabled="Number(row.itemStatus)!==2 || itemTab===2" @click="handleSubmit(row)">提交</el-button>
                     </template>
                 </el-table-column>
             </el-table>