正在显示
5 个修改的文件
包含
72 行增加
和
22 行删除
| @@ -15,4 +15,5 @@ export const getLoginfo = (params) => defHttp.get({ url: Api.loginfo, params }, | @@ -15,4 +15,5 @@ export const getLoginfo = (params) => defHttp.get({ url: Api.loginfo, params }, | ||
| 15 | */ | 15 | */ |
| 16 | export const getVisitInfo = (params) => defHttp.get({ url: Api.visitInfo, params }, { isTransformResponse: false }); | 16 | export const getVisitInfo = (params) => defHttp.get({ url: Api.visitInfo, params }, { isTransformResponse: false }); |
| 17 | 17 | ||
| 18 | -export const getStatistics = () => defHttp.get({ url: '/airaglog/airagLog/getStatistics' }); | 18 | +export const getStatistics = (params?: { rangeType?: string | null; startTime?: string; endTime?: string }) => |
| 19 | + defHttp.get({ url: '/airaglog/airagLog/getStatistics', params }); |
| @@ -5,12 +5,13 @@ | @@ -5,12 +5,13 @@ | ||
| 5 | <template #rightExtra> | 5 | <template #rightExtra> |
| 6 | <div class="extra-wrapper"> | 6 | <div class="extra-wrapper"> |
| 7 | <div class="extra-item"> | 7 | <div class="extra-item"> |
| 8 | - <a>今日</a> | ||
| 9 | - <a>本周</a> | ||
| 10 | - <a>本月</a> | ||
| 11 | - <a>本年</a> | 8 | + <a :class="{ active: activeRange === 'all' }" @click="changeRange('all')">全部</a> |
| 9 | + <a :class="{ active: activeRange === 'today' }" @click="changeRange('today')">今日</a> | ||
| 10 | + <a :class="{ active: activeRange === 'week' }" @click="changeRange('week')">本周</a> | ||
| 11 | + <a :class="{ active: activeRange === 'month' }" @click="changeRange('month')">本月</a> | ||
| 12 | + <a :class="{ active: activeRange === 'year' }" @click="changeRange('year')">本年</a> | ||
| 12 | </div> | 13 | </div> |
| 13 | - <a-range-picker :style="{ width: '256px' }" /> | 14 | + <a-range-picker :style="{ width: '256px' }" @change="handleDateChange" :value="dateRange" /> |
| 14 | </div> | 15 | </div> |
| 15 | </template> | 16 | </template> |
| 16 | <a-tab-pane loading="true" tab="每月问答次数" key="1"> | 17 | <a-tab-pane loading="true" tab="每月问答次数" key="1"> |
| @@ -48,7 +49,7 @@ | @@ -48,7 +49,7 @@ | ||
| 48 | </a-card> | 49 | </a-card> |
| 49 | </template> | 50 | </template> |
| 50 | <script lang="ts" setup> | 51 | <script lang="ts" setup> |
| 51 | - import { computed } from 'vue'; | 52 | + import { computed, ref } from 'vue'; |
| 52 | import Bar from '/@/components/chart/Bar.vue'; | 53 | import Bar from '/@/components/chart/Bar.vue'; |
| 53 | import RankList from '/@/components/chart/RankList.vue'; | 54 | import RankList from '/@/components/chart/RankList.vue'; |
| 54 | import { useRootSetting } from '/@/hooks/setting/useRootSetting'; | 55 | import { useRootSetting } from '/@/hooks/setting/useRootSetting'; |
| @@ -67,6 +68,37 @@ | @@ -67,6 +68,37 @@ | ||
| 67 | default: () => [], | 68 | default: () => [], |
| 68 | }, | 69 | }, |
| 69 | }); | 70 | }); |
| 71 | + | ||
| 72 | + const activeRange = ref('all'); | ||
| 73 | + const dateRange = ref<any>(null); | ||
| 74 | + | ||
| 75 | + const emit = defineEmits(['range-change']); | ||
| 76 | + | ||
| 77 | + const changeRange = (rangeType: string) => { | ||
| 78 | + activeRange.value = rangeType; | ||
| 79 | + dateRange.value = null; // 清除日期选择 | ||
| 80 | + | ||
| 81 | + if (rangeType === 'all') { | ||
| 82 | + emit('range-change', { rangeType: null }); | ||
| 83 | + } else { | ||
| 84 | + emit('range-change', { rangeType }); | ||
| 85 | + } | ||
| 86 | + }; | ||
| 87 | + | ||
| 88 | + const handleDateChange = (dates: any, dateStrings: [string, string]) => { | ||
| 89 | + if (dateStrings[0] && dateStrings[1]) { | ||
| 90 | + activeRange.value = 'custom'; | ||
| 91 | + dateRange.value = dates; | ||
| 92 | + emit('range-change', { | ||
| 93 | + rangeType: 'custom', | ||
| 94 | + startTime: dateStrings[0] + ' 00:00:00', | ||
| 95 | + endTime: dateStrings[1] + ' 23:59:59', | ||
| 96 | + }); | ||
| 97 | + } else { | ||
| 98 | + activeRange.value = 'all'; | ||
| 99 | + emit('range-change', { rangeType: null }); | ||
| 100 | + } | ||
| 101 | + }; | ||
| 70 | const { getThemeColor } = useRootSetting(); | 102 | const { getThemeColor } = useRootSetting(); |
| 71 | const seriesColor = computed(() => { | 103 | const seriesColor = computed(() => { |
| 72 | return getThemeColor.value; | 104 | return getThemeColor.value; |
| 1 | <template> | 1 | <template> |
| 2 | <div class="p-4"> | 2 | <div class="p-4"> |
| 3 | <ChartGroupCard class="enter-y" :loading="loading" type="chart" :statistics="statistics" /> | 3 | <ChartGroupCard class="enter-y" :loading="loading" type="chart" :statistics="statistics" /> |
| 4 | - <SaleTabCard class="!my-4 enter-y" :loading="loading" :barData="barData" :buttonStats="buttonStats" /> | 4 | + <SaleTabCard class="!my-4 enter-y" :loading="loading" :barData="barData" :buttonStats="buttonStats" @range-change="handleRangeChange" /> |
| 5 | <a-row> | 5 | <a-row> |
| 6 | <a-col :span="24"> | 6 | <a-col :span="24"> |
| 7 | <a-card :loading="loading" :bordered="false" title="最近一周访问量统计"> | 7 | <a-card :loading="loading" :bordered="false" title="最近一周访问量统计"> |
| @@ -27,6 +27,20 @@ | @@ -27,6 +27,20 @@ | ||
| 27 | const loading = ref(true); | 27 | const loading = ref(true); |
| 28 | const { getThemeColor } = useRootSetting(); | 28 | const { getThemeColor } = useRootSetting(); |
| 29 | 29 | ||
| 30 | + // 默认范围类型(全部) | ||
| 31 | + const rangeType = ref<string | null>(null); | ||
| 32 | + const dateRange = ref<{ startTime?: string; endTime?: string }>({}); | ||
| 33 | + | ||
| 34 | + // 处理范围变化 | ||
| 35 | + const handleRangeChange = (params: { rangeType: string | null; startTime?: string; endTime?: string }) => { | ||
| 36 | + rangeType.value = params.rangeType; | ||
| 37 | + dateRange.value = { | ||
| 38 | + startTime: params.startTime, | ||
| 39 | + endTime: params.endTime, | ||
| 40 | + }; | ||
| 41 | + fetchStatistics(); | ||
| 42 | + }; | ||
| 43 | + | ||
| 30 | // 使用实时数据对象 | 44 | // 使用实时数据对象 |
| 31 | const statistics = ref({ | 45 | const statistics = ref({ |
| 32 | todayCount: 0, | 46 | todayCount: 0, |
| @@ -42,7 +56,12 @@ | @@ -42,7 +56,12 @@ | ||
| 42 | // 实时数据获取函数 | 56 | // 实时数据获取函数 |
| 43 | async function fetchStatistics() { | 57 | async function fetchStatistics() { |
| 44 | try { | 58 | try { |
| 45 | - const res = await getStatistics(); | 59 | + const params = { |
| 60 | + rangeType: rangeType.value, | ||
| 61 | + ...dateRange.value, | ||
| 62 | + }; | ||
| 63 | + | ||
| 64 | + const res = await getStatistics(params); | ||
| 46 | console.log('接收到的统计数据:', res); // 添加日志输出 | 65 | console.log('接收到的统计数据:', res); // 添加日志输出 |
| 47 | console.log('res是否有success属性:', 'success' in res); | 66 | console.log('res是否有success属性:', 'success' in res); |
| 48 | // 直接使用响应数据,不检查 success 属性 | 67 | // 直接使用响应数据,不检查 success 属性 |
| @@ -83,10 +102,8 @@ | @@ -83,10 +102,8 @@ | ||
| 83 | if (!statistics.value.monthlyData) return []; | 102 | if (!statistics.value.monthlyData) return []; |
| 84 | 103 | ||
| 85 | return statistics.value.monthlyData.map((item) => { | 104 | return statistics.value.monthlyData.map((item) => { |
| 86 | - // 提取月份数字 (格式如 "2025-05" -> 5) | ||
| 87 | - const monthNum = parseInt(item.month.split('-')[1]); | ||
| 88 | return { | 105 | return { |
| 89 | - name: `${monthNum}月`, | 106 | + name: `${item.month}`, |
| 90 | value: item.count, | 107 | value: item.count, |
| 91 | }; | 108 | }; |
| 92 | }); | 109 | }); |
| @@ -3,15 +3,15 @@ | @@ -3,15 +3,15 @@ | ||
| 3 | <IndexDef v-if="indexStyle === 1" /> | 3 | <IndexDef v-if="indexStyle === 1" /> |
| 4 | <IndexBdc v-if="indexStyle == 2" /> | 4 | <IndexBdc v-if="indexStyle == 2" /> |
| 5 | <IndexTask v-if="indexStyle == 3" /> | 5 | <IndexTask v-if="indexStyle == 3" /> |
| 6 | - <div style="width: 100%; text-align: right; margin-top: 20px"> | ||
| 7 | - 首页主题: | ||
| 8 | - <a-radio-group v-model:value="indexStyle"> | ||
| 9 | - <a-radio :value="0">默认</a-radio> | ||
| 10 | - <a-radio :value="1">销量统计</a-radio> | ||
| 11 | - <a-radio :value="2">业务统计</a-radio> | ||
| 12 | - <a-radio :value="3">我的任务</a-radio> | ||
| 13 | - </a-radio-group> | ||
| 14 | - </div> | 6 | + <!-- <div style="width: 100%; text-align: right; margin-top: 20px">--> |
| 7 | + <!-- 首页主题:--> | ||
| 8 | + <!-- <a-radio-group v-model:value="indexStyle">--> | ||
| 9 | + <!-- <a-radio :value="0">默认</a-radio>--> | ||
| 10 | + <!-- <a-radio :value="1">销量统计</a-radio>--> | ||
| 11 | + <!-- <a-radio :value="2">业务统计</a-radio>--> | ||
| 12 | + <!-- <a-radio :value="3">我的任务</a-radio>--> | ||
| 13 | + <!-- </a-radio-group>--> | ||
| 14 | + <!-- </div>--> | ||
| 15 | </template> | 15 | </template> |
| 16 | <script lang="ts" setup> | 16 | <script lang="ts" setup> |
| 17 | import { ref } from 'vue'; | 17 | import { ref } from 'vue'; |
-
请 注册 或 登录 后发表评论