数据分析ui补充完善，接入数据库

pages/mall/analytics/sales-report.uvue

@@ -27,19 +27,34 @@
       <view class="main-content">
         <view class="container">
 
-      <!-- 时间维度筛选 -->
+      <!-- 时间维度筛选（快捷 + 自定义） -->
       <view class="tabs">
         <view
           v-for="p in timePeriods"
           :key="p.value"
           class="tab"
-          :class="{ active: selectedPeriod === p.value }"
+          :class="{ active: selectedPeriod === p.value && !customRangeEnabled }"
           @click="selectPeriod(p.value)"
         >
           {{ p.label }}
         </view>
+        <view
+          class="tab"
+          :class="{ active: customRangeEnabled }"
+          @click="toggleCustomRange"
+        >
+          自定义
+        </view>
       </view>
 
+      <AnalyticsDateRangePicker
+        v-if="customRangeEnabled"
+        :initialStartDate="selectedStartDate"
+        :initialEndDate="selectedEndDate"
+        @apply="onDateRangeApply"
+        @clear="onDateRangeClear"
+      />
+
       <!-- KPI 指标卡片 -->
       <view class="kpi-grid">
         <view class="kpi-card">
@@ -153,7 +168,9 @@ import AnalyticsComboChart from '@/components/analytics/AnalyticsComboChart.uvue
 import AnalyticsSidebarMenu from '@/components/analytics/AnalyticsSidebarMenu.uvue'
 import AnalyticsTopBar from '@/components/analytics/AnalyticsTopBar.uvue'
 import AnalyticsRegionMap from '@/components/analytics/AnalyticsRegionMap.uvue'
-import { computed, onLoad, reactive, ref } from 'vue'
+import AnalyticsDateRangePicker from '@/components/analytics/AnalyticsDateRangePicker.uvue'
+import { computed, reactive, ref } from 'vue'
+import { onLoad } from '@dcloudio/uni-app'
 
 import { fetchSalesKpis, fetchSalesTrend, fetchSalesTopProducts, fetchSalesTopMerchants } from '@/services/analytics/salesReportService.uts'
 import { mapAnalyticsError } from '@/services/analytics/errorMapper.uts'
@@ -162,6 +179,10 @@ import type { SalesTrendData, SalesData, ProductRank, MerchantRank } from '@/typ
 
 const lastUpdateTime = ref('')
 const selectedPeriod = ref('7d')
+
+const customRangeEnabled = ref(false)
+const selectedStartDate = ref('')
+const selectedEndDate = ref('')
 const showMoreMenu = ref(false)
 const showSidebarMenu = ref(false)
 const currentPath = ref('/pages/mall/analytics/sales-report')
@@ -212,8 +233,12 @@ async function loadSalesData() {
   try {
     updateTime()
 
+    const range = selectedStartDate.value && selectedEndDate.value
+      ? { start: selectedStartDate.value, end: selectedEndDate.value }
+      : null
+
     // KPI
-    const kpi = await fetchSalesKpis(selectedPeriod.value)
+    const kpi = await fetchSalesKpis(selectedPeriod.value, range)
     salesData.gmv = kpi.gmv
     salesData.gmv_growth = kpi.gmv_growth
     salesData.orders = kpi.orders
@@ -224,19 +249,19 @@ async function loadSalesData() {
     salesData.avg_order_growth = kpi.avg_order_growth
 
     // 趋势
-    const t = await fetchSalesTrend(selectedPeriod.value)
+    const t = await fetchSalesTrend(selectedPeriod.value, range)
     trend.x = t.x
     trend.gmv = t.gmv
     trend.orders = t.orders
 
     // TOP 商品/商家
-    const pList = await fetchSalesTopProducts(selectedPeriod.value, 50)
+    const pList = await fetchSalesTopProducts(selectedPeriod.value, 50, range)
     for (let i = 0; i < pList.length; i++) {
       pList[i].rank = i + 1
     }
     topProducts.splice(0, topProducts.length, ...pList)
 
-    const mList = await fetchSalesTopMerchants(selectedPeriod.value, 50)
+    const mList = await fetchSalesTopMerchants(selectedPeriod.value, 50, range)
     for (let i = 0; i < mList.length; i++) {
       mList[i].rank = i + 1
     }
@@ -331,6 +356,24 @@ function handleDropdown() {
 function handleSettings() {
   uni.showToast({ title: '设置', icon: 'none' })
 }
+
+function toggleCustomRange() {
+  customRangeEnabled.value = !customRangeEnabled.value
+}
+
+function onDateRangeApply(range: { start: string; end: string }) {
+  selectedStartDate.value = range.start
+  selectedEndDate.value = range.end
+  customRangeEnabled.value = true
+  loadSalesData()
+}
+
+function onDateRangeClear() {
+  selectedStartDate.value = ''
+  selectedEndDate.value = ''
+  customRangeEnabled.value = false
+  loadSalesData()
+}
 </script>
 
 <style>