From 4e25a3cbca70dc3b49efa71982c3b0b59244826c Mon Sep 17 00:00:00 2001 From: songjie Date: Sat, 24 Jan 2026 15:16:20 +0800 Subject: [PATCH] =?UTF-8?q?=E5=AE=8C=E6=88=90=E7=94=A8=E6=88=B7=E7=B1=BB?= =?UTF-8?q?=E7=99=BB=E5=BD=95=E7=BB=9F=E8=AE=A1-=E7=99=BB=E5=BD=95?= =?UTF-8?q?=E6=95=B0=E6=8D=AE-=E4=BB=8A=E6=97=A5=E9=9D=9E=E7=BD=91?= =?UTF-8?q?=E7=99=BB=E5=BD=95=E6=95=B0=E6=8D=AE=E6=8E=A5=E5=8F=A3=EF=BC=9B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/api/platformData.js | 23 ++++++ src/views/PlatformData/UserLoginStats.vue | 133 ++++++++++++++++++++---------- 2 files changed, 114 insertions(+), 42 deletions(-) diff --git a/src/api/platformData.js b/src/api/platformData.js index 8777821..960626b 100644 --- a/src/api/platformData.js +++ b/src/api/platformData.js @@ -132,6 +132,29 @@ export function getUserLoginChannelMember(params) { }) } +// 获取非网登录数据（渠道分布） +export function getUserLoginChannelNoMember(params) { + const formData = new FormData(); + formData.append('token', localStorage.getItem('token')); + if (params) { + if (params.region) formData.append('region', params.region); + if (params.start_time) formData.append('start_time', params.start_time); + if (params.end_time) formData.append('end_time', params.end_time); + } + + return request({ + url: 'http://7a1b8c9e.r40.cpolar.top/admin/user/active/ChannelNonMember', + method: 'post', + headers: { + 'token': localStorage.getItem('token'), + 'client': 'ios', + 'version': '1', + 'Content-Type': 'multipart/form-data' + }, + data: formData + }) +} + // 获取用户登录趋势数据 export function getUserLoginTrend(params) { const formData = new FormData(); diff --git a/src/views/PlatformData/UserLoginStats.vue b/src/views/PlatformData/UserLoginStats.vue index e2daab9..8a23928 100644 --- a/src/views/PlatformData/UserLoginStats.vue +++ b/src/views/PlatformData/UserLoginStats.vue @@ -18,7 +18,7 @@ -
+
地区
@@ -100,10 +100,10 @@
{{ statsTitle }}登录数据
- - - - + + + +
@@ -111,27 +111,27 @@
{{ statsTitle }}会员登录数据
- - - - + + + +
-
非网登录数据
+
{{ statsTitle }}非网登录数据
- - - - + + + +
-
+
地区查询
@@ -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, getRegionActiveData, getRegionActiveDataHistogram, getUserLoginChannel, getUserLoginChannelMember } from '../../api/platformData'; +import { getUserLoginList, getUserLoginTrend, getRegionActiveData, getRegionActiveDataHistogram, getUserLoginChannel, getUserLoginChannelMember, getUserLoginChannelNoMember } from '../../api/platformData'; const route = useRoute(); const router = useRouter(); @@ -233,6 +233,8 @@ const dateRange = ref(''); const selectedRegion = ref(''); const searchRegion = ref(''); const dateRangeRegion = ref(''); +const loading = ref(false); +const loadingRegion = ref(false); const chartTrendRef = ref(null); let chartTrendInstance = null; @@ -467,6 +469,56 @@ const fetchLoginChannelMemberData = async () => { } }; +const fetchLoginChannelNoMemberData = async () => { + let params = {}; + if (dateRange.value && dateRange.value.length === 2) { + params.start_time = formatDate(dateRange.value[0]); + params.end_time = formatDate(dateRange.value[1]); + } + + if (selectedRegion.value && selectedRegion.value !== 'all') { + params.region = selectedRegion.value; + } + + try { + const res = await getUserLoginChannelNoMember(params); + console.log("获取非网登录渠道数据响应:", res); + + // 兼容处理拦截器 + const data = res.list ? res : (res.data && res.data.list ? res.data : null); + + if (data && data.list) { + loginTableData3.value = data.list.map(item => ({ + channel: item.source, + total: item.today_count, + dailyNew: item.growth_value, + rate: item.ratio + '%' + })); + } + } catch (e) { + console.error('获取非网登录渠道数据失败:', e); + } +}; + +// 统一获取登录数据 Tab 的所有数据 +const fetchAllLoginData = async () => { + loading.value = true; + try { + // 使用 Promise.all 并行请求所有接口 + await Promise.all([ + fetchTrendData(), + fetchLoginData(), + fetchLoginChannelData(), + fetchLoginChannelMemberData(), + fetchLoginChannelNoMemberData() + ]); + } catch (error) { + console.error('获取登录数据失败:', error); + } finally { + loading.value = false; + } +}; + const handleSearch = () => { // 更新 URL 参数 const query = { ...route.query }; @@ -487,10 +539,7 @@ const handleSearch = () => { router.replace({ query }); - fetchTrendData(); - fetchLoginData(); - fetchLoginChannelData(); - fetchLoginChannelMemberData(); + fetchAllLoginData(); }; const handleReset = () => { @@ -504,10 +553,22 @@ const handleReset = () => { delete query.region; router.replace({ query }); - fetchTrendData(); - fetchLoginData(); - fetchLoginChannelData(); - fetchLoginChannelMemberData(); + fetchAllLoginData(); +}; + +// 统一获取地区数据 Tab 的所有数据 +const fetchAllRegionData = async () => { + loadingRegion.value = true; + try { + await Promise.all([ + fetchRegionActiveData(), + fetchRegionHistogramData() + ]); + } catch (error) { + console.error('获取地区数据失败:', error); + } finally { + loadingRegion.value = false; + } }; const fetchRegionActiveData = async () => { @@ -695,8 +756,7 @@ const handleSearchRegion = () => { router.replace({ query }); - fetchRegionActiveData(); - fetchRegionHistogramData(); + fetchAllRegionData(); }; const handleResetRegion = () => { @@ -710,8 +770,7 @@ const handleResetRegion = () => { delete query.r_region; router.replace({ query }); - fetchRegionActiveData(); - fetchRegionHistogramData(); + fetchAllRegionData(); }; // Tab 1 数据 @@ -719,13 +778,7 @@ const loginTableData1 = ref([]); const loginTableData2 = ref([]); -const loginTableData3 = [ - { channel: 'App Store', total: '1,245', dailyNew: '', rate: '38%' }, - { channel: 'Play Store', total: '987', dailyNew: '', rate: '30%' }, - { channel: 'H5', total: '543', dailyNew: '', rate: '17%' }, - { channel: 'APK', total: '321', dailyNew: '', rate: '10%' }, - { channel: '总计', total: '3,096', dailyNew: '', rate: '100%' }, -]; +const loginTableData3 = ref([]); // Tab 2 数据：regionalTableData1, 2, 3 已改为响应式变量并在 fetchRegionActiveData 中更新 const headerCellStyle = { @@ -741,11 +794,9 @@ const initCharts = () => { if (activeTab.value === 'loginData') { // 趋势图已经在 fetchTrendData -> updateTrendChart 中初始化和更新 // 这里只需要处理初始无数据时的状态，或者等待 fetchTrendData 调用 - fetchTrendData(); - fetchLoginData(); + fetchAllLoginData(); } else if (activeTab.value === 'regionalData') { - fetchRegionActiveData(); - fetchRegionHistogramData(); + fetchAllRegionData(); // 柱状图 if (chartRegionBarRef.value) { const chart = echarts.init(chartRegionBarRef.value); @@ -858,9 +909,7 @@ watch(activeTab, (newVal) => { onMounted(() => { if (activeTab.value === 'loginData') { - fetchLoginData(); - fetchLoginChannelData(); - fetchLoginChannelMemberData(); + fetchAllLoginData(); } initCharts(); });