From 40d9deaa0e2add04a761c68b9c5fa3a3a57f1714 Mon Sep 17 00:00:00 2001 From: songjie Date: Sat, 24 Jan 2026 12:00:34 +0800 Subject: [PATCH] =?UTF-8?q?=E5=90=84=E5=9C=B0=E5=8C=BA=E7=99=BB=E5=BD=95?= =?UTF-8?q?=E6=95=B0=E6=8D=AE=E7=9A=84=E4=B8=89=E4=B8=AA=E8=A1=A8=E6=A0=BC?= =?UTF-8?q?=E6=8E=A5=E5=8F=A3=E5=AF=B9=E6=8E=A5=E5=AE=8C=E6=88=90=EF=BC=9B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/platformData.js | 24 +++++++++ src/views/PlatformData/UserLoginStats.vue | 81 ++++++++++++++++++++++++------- 2 files changed, 87 insertions(+), 18 deletions(-) diff --git a/src/api/platformData.js b/src/api/platformData.js index b0008d7..1968c17 100644 --- a/src/api/platformData.js +++ b/src/api/platformData.js @@ -108,3 +108,27 @@ export function getUserLoginTrend(params) { data: formData }) } + +// 获取各地区登录活跃数据 +export function getRegionActiveData(params) { + const formData = new FormData(); + formData.append('token', localStorage.getItem('token')); + if (params) { + if (params.start_time) formData.append('start_time', params.start_time); + if (params.end_time) formData.append('end_time', params.end_time); + // identity: 0:全部 1:会员 2:非网 (可不传，默认全部) + if (params.identity !== undefined) formData.append('identity', params.identity); + } + + return request({ + url: 'http://d9a962ee.natappfree.cc/admin/user/login/statistics/regionActiveData', + method: 'post', + headers: { + 'token': localStorage.getItem('token'), + 'client': 'ios', + 'version': '1', + 'Content-Type': 'multipart/form-data' + }, + data: formData + }) +} diff --git a/src/views/PlatformData/UserLoginStats.vue b/src/views/PlatformData/UserLoginStats.vue index cdd34d1..e04836a 100644 --- a/src/views/PlatformData/UserLoginStats.vue +++ b/src/views/PlatformData/UserLoginStats.vue @@ -146,8 +146,8 @@ end-placeholder="结束时间" size="default" /> - 搜索 - 重置 + 搜索 + 重置 数据导出 @@ -223,7 +223,7 @@ import { ref, onMounted, nextTick, watch } from 'vue'; import { useRoute, useRouter } from 'vue-router'; import * as echarts from 'echarts'; -import { getUserLoginList, getUserLoginTrend } from '../../api/platformData'; +import { getUserLoginList, getUserLoginTrend, getRegionActiveData } from '../../api/platformData'; const route = useRoute(); const router = useRouter(); @@ -241,6 +241,11 @@ const chartRegionPieRef = ref(null); const chartRegionMemberPieRef = ref(null); const chartRegionNonMemberPieRef = ref(null); +// 响应式数据：地区活跃数据 +const regionalTableData1 = ref([]); +const regionalTableData2 = ref([]); +const regionalTableData3 = ref([]); + // 初始化查询参数 const initQueryParams = () => { const { start_time, end_time, region } = route.query; @@ -425,6 +430,58 @@ const handleReset = () => { fetchLoginData(); }; +const fetchRegionActiveData = async () => { + let params = {}; + if (dateRangeRegion.value && dateRangeRegion.value.length === 2) { + params.start_time = formatDate(dateRangeRegion.value[0]); + params.end_time = formatDate(dateRangeRegion.value[1]); + } + + try { + // 并行请求三种身份的数据 + const [resAll, resMember, resNormal] = await Promise.all([ + getRegionActiveData({ ...params, identity: 0 }), + getRegionActiveData({ ...params, identity: 1 }), + getRegionActiveData({ ...params, identity: 2 }) + ]); + + console.log("获取地区活跃数据响应:", { resAll, resMember, resNormal }); + + const processData = (res) => { + // 兼容处理拦截器 + const data = res.region_active_data ? res : (res.data && res.data.region_active_data ? res.data : null); + if (data && data.region_active_data) { + return data.region_active_data.map(item => ({ + region: item.region, + dailyActive: item.daily_active_user, + weeklyActive: item.weekly_active_user, + monthlyActive: item.monthly_active_user, + periodActive: item.range_active_user, + percent: item.active_rate + '%' + })); + } + return []; + }; + + regionalTableData1.value = processData(resAll); + regionalTableData2.value = processData(resMember); + regionalTableData3.value = processData(resNormal); + + } catch (e) { + console.error('获取地区活跃数据失败:', e); + } +}; + +const handleSearchRegion = () => { + fetchRegionActiveData(); +}; + +const handleResetRegion = () => { + dateRangeRegion.value = ''; + searchRegion.value = ''; + fetchRegionActiveData(); +}; + // Tab 1 数据 const loginTableData1 = [ { channel: 'App Store', total: '154,832', dailyNew: '', percent: '38%' }, @@ -450,21 +507,7 @@ const loginTableData3 = [ { channel: '总计', total: '3,096', dailyNew: '', rate: '100%' }, ]; -// Tab 2 数据 -const regionalTableData1 = [ - { region: '香港', dailyActive: '1,245', weeklyActive: '1,245', monthlyActive: '1,245', periodActive: '', percent: '38%' }, - { region: '新加坡', dailyActive: '987', weeklyActive: '987', monthlyActive: '807', periodActive: '', percent: '30%' }, - { region: '泰国', dailyActive: '543', weeklyActive: '543', monthlyActive: '543', periodActive: '', percent: '17%' }, - { region: '越南', dailyActive: '321', weeklyActive: '321', monthlyActive: '321', periodActive: '', percent: '10%' }, - { region: '马来西亚', dailyActive: '321', weeklyActive: '321', monthlyActive: '321', periodActive: '', percent: '10%' }, - { region: '加拿大', dailyActive: '321', weeklyActive: '321', monthlyActive: '321', periodActive: '', percent: '10%' }, - { region: '其他', dailyActive: '321', weeklyActive: '321', monthlyActive: '321', periodActive: '', percent: '10%' }, - { region: '总计', dailyActive: '3,096', weeklyActive: '3,096', monthlyActive: '3,096', periodActive: '', percent: '100%' }, -]; - -const regionalTableData2 = JSON.parse(JSON.stringify(regionalTableData1)); // 复用假数据 -const regionalTableData3 = JSON.parse(JSON.stringify(regionalTableData1)); // 复用假数据 - +// Tab 2 数据：regionalTableData1, 2, 3 已改为响应式变量并在 fetchRegionActiveData 中更新 const headerCellStyle = { background: '#fff0f0', color: '#333', @@ -479,7 +522,9 @@ const initCharts = () => { // 趋势图已经在 fetchTrendData -> updateTrendChart 中初始化和更新 // 这里只需要处理初始无数据时的状态，或者等待 fetchTrendData 调用 fetchTrendData(); + fetchLoginData(); } else if (activeTab.value === 'regionalData') { + fetchRegionActiveData(); // 柱状图 if (chartRegionBarRef.value) { const chart = echarts.init(chartRegionBarRef.value);