|
|
@ -24,8 +24,12 @@ |
|
|
<div class="search-label">地区</div> |
|
|
<div class="search-label">地区</div> |
|
|
<el-select v-model="selectedRegion" placeholder="请选择所属地区" style="width: 200px; margin-right: 20px;"> |
|
|
<el-select v-model="selectedRegion" placeholder="请选择所属地区" style="width: 200px; margin-right: 20px;"> |
|
|
<el-option label="全部" value="all" /> |
|
|
<el-option label="全部" value="all" /> |
|
|
<el-option label="中国" value="cn" /> |
|
|
|
|
|
<el-option label="美国" value="us" /> |
|
|
|
|
|
|
|
|
<el-option |
|
|
|
|
|
v-for="item in regionOptions" |
|
|
|
|
|
:key="item.value" |
|
|
|
|
|
:label="item.label" |
|
|
|
|
|
:value="item.value" |
|
|
|
|
|
/> |
|
|
</el-select> |
|
|
</el-select> |
|
|
|
|
|
|
|
|
<div class="search-label">时间段查询</div> |
|
|
<div class="search-label">时间段查询</div> |
|
|
@ -135,7 +139,15 @@ |
|
|
<!-- 搜索栏 --> |
|
|
<!-- 搜索栏 --> |
|
|
<div class="search-bar"> |
|
|
<div class="search-bar"> |
|
|
<div class="search-label">地区查询</div> |
|
|
<div class="search-label">地区查询</div> |
|
|
<el-input v-model="searchRegion" placeholder="请输入地区" style="width: 200px; margin-right: 20px;" /> |
|
|
|
|
|
|
|
|
<el-select v-model="searchRegion" placeholder="请选择所属地区" style="width: 200px; margin-right: 20px;"> |
|
|
|
|
|
<el-option label="全部" value="" /> |
|
|
|
|
|
<el-option |
|
|
|
|
|
v-for="item in regionOptions" |
|
|
|
|
|
:key="item.value" |
|
|
|
|
|
:label="item.label" |
|
|
|
|
|
:value="item.value" |
|
|
|
|
|
/> |
|
|
|
|
|
</el-select> |
|
|
|
|
|
|
|
|
<div class="search-label">时间段查询</div> |
|
|
<div class="search-label">时间段查询</div> |
|
|
<el-date-picker |
|
|
<el-date-picker |
|
|
@ -223,7 +235,7 @@ |
|
|
import { ref, onMounted, nextTick, watch } from 'vue'; |
|
|
import { ref, onMounted, nextTick, watch } from 'vue'; |
|
|
import { useRoute, useRouter } from 'vue-router'; |
|
|
import { useRoute, useRouter } from 'vue-router'; |
|
|
import * as echarts from 'echarts'; |
|
|
import * as echarts from 'echarts'; |
|
|
import { getUserLoginList, getUserLoginTrend, getRegionActiveData, getRegionActiveDataHistogram, getUserLoginChannel, getUserLoginChannelMember, getUserLoginChannelNoMember, getRegionUserDistribution, exportRegionActiveData } from '../../api/platformData'; |
|
|
|
|
|
|
|
|
import { getUserLoginList, getUserLoginTrend, getRegionActiveData, getRegionActiveDataHistogram, getUserLoginChannel, getUserLoginChannelMember, getUserLoginChannelNoMember, getRegionUserDistribution, exportRegionActiveData, getRegionsList } from '../../api/platformData'; |
|
|
import { ElMessage } from 'element-plus'; |
|
|
import { ElMessage } from 'element-plus'; |
|
|
|
|
|
|
|
|
const route = useRoute(); |
|
|
const route = useRoute(); |
|
|
@ -252,6 +264,21 @@ const barChartMode = ref('all'); |
|
|
const regionalTableData1 = ref([]); |
|
|
const regionalTableData1 = ref([]); |
|
|
const regionalTableData2 = ref([]); |
|
|
const regionalTableData2 = ref([]); |
|
|
const regionalTableData3 = ref([]); |
|
|
const regionalTableData3 = ref([]); |
|
|
|
|
|
const regionOptions = ref([]); |
|
|
|
|
|
|
|
|
|
|
|
// 获取地区列表 |
|
|
|
|
|
const fetchRegionOptions = async () => { |
|
|
|
|
|
try { |
|
|
|
|
|
const res = await getRegionsList(); |
|
|
|
|
|
console.log("获取地区列表响应:", res); |
|
|
|
|
|
const data = res.data || res; |
|
|
|
|
|
if (data && data.list) { |
|
|
|
|
|
regionOptions.value = data.list.map(region => ({ label: region, value: region })); |
|
|
|
|
|
} |
|
|
|
|
|
} catch (e) { |
|
|
|
|
|
console.error('获取地区列表失败:', e); |
|
|
|
|
|
} |
|
|
|
|
|
}; |
|
|
|
|
|
|
|
|
// 初始化查询参数 |
|
|
// 初始化查询参数 |
|
|
const initQueryParams = () => { |
|
|
const initQueryParams = () => { |
|
|
@ -1023,6 +1050,7 @@ onMounted(() => { |
|
|
if (activeTab.value === 'loginData') { |
|
|
if (activeTab.value === 'loginData') { |
|
|
fetchAllLoginData(); |
|
|
fetchAllLoginData(); |
|
|
} |
|
|
} |
|
|
|
|
|
fetchRegionOptions(); |
|
|
initCharts(); |
|
|
initCharts(); |
|
|
}); |
|
|
}); |
|
|
</script> |
|
|
</script> |
|
|
|