首页按钮排行榜时期查询

@@ -15,4 +15,5 @@ export const getLoginfo = (params) => defHttp.get({ url: Api.loginfo, params },
  */
 export const getVisitInfo = (params) => defHttp.get({ url: Api.visitInfo, params }, { isTransformResponse: false });
 
-export const getStatistics = () => defHttp.get({ url: '/airaglog/airagLog/getStatistics' });
+export const getStatistics = (params?: { rangeType?: string | null; startTime?: string; endTime?: string }) =>
+  defHttp.get({ url: '/airaglog/airagLog/getStatistics', params });

@@ -5,12 +5,13 @@
         <template #rightExtra>
           <div class="extra-wrapper">
             <div class="extra-item">
-              <a>今日</a>
-              <a>本周</a>
-              <a>本月</a>
-              <a>本年</a>
+              <a :class="{ active: activeRange === 'all' }" @click="changeRange('all')">全部</a>
+              <a :class="{ active: activeRange === 'today' }" @click="changeRange('today')">今日</a>
+              <a :class="{ active: activeRange === 'week' }" @click="changeRange('week')">本周</a>
+              <a :class="{ active: activeRange === 'month' }" @click="changeRange('month')">本月</a>
+              <a :class="{ active: activeRange === 'year' }" @click="changeRange('year')">本年</a>
             </div>
-            <a-range-picker :style="{ width: '256px' }" />
+            <a-range-picker :style="{ width: '256px' }" @change="handleDateChange" :value="dateRange" />
           </div>
         </template>
         <a-tab-pane loading="true" tab="每月问答次数" key="1">
@@ -48,7 +49,7 @@
   </a-card>
 </template>
 <script lang="ts" setup>
-  import { computed } from 'vue';
+  import { computed, ref } from 'vue';
   import Bar from '/@/components/chart/Bar.vue';
   import RankList from '/@/components/chart/RankList.vue';
   import { useRootSetting } from '/@/hooks/setting/useRootSetting';
@@ -67,6 +68,37 @@
       default: () => [],
     },
   });
+
+  const activeRange = ref('all');
+  const dateRange = ref<any>(null);
+
+  const emit = defineEmits(['range-change']);
+
+  const changeRange = (rangeType: string) => {
+    activeRange.value = rangeType;
+    dateRange.value = null; // 清除日期选择
+
+    if (rangeType === 'all') {
+      emit('range-change', { rangeType: null });
+    } else {
+      emit('range-change', { rangeType });
+    }
+  };
+
+  const handleDateChange = (dates: any, dateStrings: [string, string]) => {
+    if (dateStrings[0] && dateStrings[1]) {
+      activeRange.value = 'custom';
+      dateRange.value = dates;
+      emit('range-change', {
+        rangeType: 'custom',
+        startTime: dateStrings[0] + ' 00:00:00',
+        endTime: dateStrings[1] + ' 23:59:59',
+      });
+    } else {
+      activeRange.value = 'all';
+      emit('range-change', { rangeType: null });
+    }
+  };
   const { getThemeColor } = useRootSetting();
   const seriesColor = computed(() => {
     return getThemeColor.value;

 <template>
   <div class="p-4">
     <ChartGroupCard class="enter-y" :loading="loading" type="chart" :statistics="statistics" />
-    <SaleTabCard class="!my-4 enter-y" :loading="loading" :barData="barData" :buttonStats="buttonStats" />
+    <SaleTabCard class="!my-4 enter-y" :loading="loading" :barData="barData" :buttonStats="buttonStats" @range-change="handleRangeChange" />
     <a-row>
       <a-col :span="24">
         <a-card :loading="loading" :bordered="false" title="最近一周访问量统计">
@@ -27,6 +27,20 @@
   const loading = ref(true);
   const { getThemeColor } = useRootSetting();
 
+  // 默认范围类型（全部）
+  const rangeType = ref<string | null>(null);
+  const dateRange = ref<{ startTime?: string; endTime?: string }>({});
+
+  // 处理范围变化
+  const handleRangeChange = (params: { rangeType: string | null; startTime?: string; endTime?: string }) => {
+    rangeType.value = params.rangeType;
+    dateRange.value = {
+      startTime: params.startTime,
+      endTime: params.endTime,
+    };
+    fetchStatistics();
+  };
+
   // 使用实时数据对象
   const statistics = ref({
     todayCount: 0,
@@ -42,7 +56,12 @@
   // 实时数据获取函数
   async function fetchStatistics() {
     try {
-      const res = await getStatistics();
+      const params = {
+        rangeType: rangeType.value,
+        ...dateRange.value,
+      };
+
+      const res = await getStatistics(params);
       console.log('接收到的统计数据:', res); // 添加日志输出
       console.log('res是否有success属性:', 'success' in res);
       // 直接使用响应数据，不检查 success 属性
@@ -83,10 +102,8 @@
     if (!statistics.value.monthlyData) return [];
 
     return statistics.value.monthlyData.map((item) => {
-      // 提取月份数字 (格式如 "2025-05" -> 5)
-      const monthNum = parseInt(item.month.split('-')[1]);
       return {
-        name: `${monthNum}月`,
+        name: `${item.month}`,
         value: item.count,
       };
     });

@@ -3,15 +3,15 @@
   <IndexDef v-if="indexStyle === 1" />
   <IndexBdc v-if="indexStyle == 2" />
   <IndexTask v-if="indexStyle == 3" />
-  <div style="width: 100%; text-align: right; margin-top: 20px">
-    首页主题：
-    <a-radio-group v-model:value="indexStyle">
-      <a-radio :value="0">默认</a-radio>
-      <a-radio :value="1">销量统计</a-radio>
-      <a-radio :value="2">业务统计</a-radio>
-      <a-radio :value="3">我的任务</a-radio>
-    </a-radio-group>
-  </div>
+  <!--  <div style="width: 100%; text-align: right; margin-top: 20px">-->
+  <!--    首页主题：-->
+  <!--    <a-radio-group v-model:value="indexStyle">-->
+  <!--      <a-radio :value="0">默认</a-radio>-->
+  <!--      <a-radio :value="1">销量统计</a-radio>-->
+  <!--      <a-radio :value="2">业务统计</a-radio>-->
+  <!--      <a-radio :value="3">我的任务</a-radio>-->
+  <!--    </a-radio-group>-->
+  <!--  </div>-->
 </template>
 <script lang="ts" setup>
   import { ref } from 'vue';

@@ -59,7 +59,7 @@ export const columns: BasicColumn[] = [
     },
   },
   {
-    title: '按钮code',
+    title: 'code',
     align: 'center',
     dataIndex: 'code',
   },