jcq 6 天之前
父节点
当前提交
c469c67d41

+ 5 - 6
src/views/count/main/trend/index.vue

@@ -144,13 +144,13 @@ const Title = defineAsyncComponent(() => import('/@/components/Title/index.vue')
 const InfoCard = defineAsyncComponent(() => import('./infoCard.vue'));
 const { t } = useI18n();
 const timeRange = ref(null);
+const qChartRef = ref<HTMLDivElement | null>(null);
 let qualityChart: echarts.ECharts | null = null;
-const qChartRef = ref(null);
+
 onMounted(() => {
-	// initLineChart();
-	initQualityChart();
-   console.log(qualityChart);
-	// initBehaviorChart();
+   setTimeout(() => {
+      initQualityChart();
+   }, 500);
 });
 const qualityXAxis = ref<string[]>([
 	'2025-07-01',
@@ -170,7 +170,6 @@ const retentionSeries = ref<number[]>([20, 23, 27, 24, 22, 15, 5, 4, 16, 26, 25,
 const industryAvgSeries = ref<number[]>([16, 18, 20, 24, 25, 24, 16, 10, 15, 22, 21, 12]);
 const peerSameScaleSeries = ref<number[]>([0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0]);
 function initQualityChart(): void {
-   console.log(qChartRef.value);
 	if (!qChartRef.value) return;
 	if (qualityChart) qualityChart.dispose();
 	qualityChart = echarts.init( qChartRef.value);

+ 6 - 47
src/views/count/user/activations/index.vue

@@ -191,7 +191,6 @@ function initLineChart(): void {
 
 onMounted(() => {
 	initLineChart();
-	initQualityChart();
 });
 
 watch(timeGranularity, () => {
@@ -222,57 +221,17 @@ const Title = defineAsyncComponent(() => import('/@/components/Title/index.vue')
 // 展开/收起明细
 const showDetail1 = ref(true);
 
-// 用户质量(留存率)
-const qualityChartRef = ref<HTMLDivElement | null>(null);
-let qualityChart: echarts.ECharts | null = null;
 
-const qualityXAxis = ref<string[]>([
-	'2025-07-01',
-	'2025-07-08',
-	'2025-07-15',
-	'2025-07-22',
-	'2025-07-29',
-	'2025-08-05',
-	'2025-08-12',
-	'2025-08-19',
-	'2025-08-26',
-	'2025-09-02',
-	'2025-09-09',
-	'2025-09-16',
-]);
-
-const retentionSeries = ref<number[]>([20, 23, 27, 24, 22, 15, 5, 4, 16, 26, 25, 2]);
-const industryAvgSeries = ref<number[]>([16, 18, 20, 24, 25, 24, 16, 10, 15, 22, 21, 12]);
-const peerSameScaleSeries = ref<number[]>([0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0]);
-
-function initQualityChart(): void {
-	if (!qualityChartRef.value) return;
-	if (qualityChart) qualityChart.dispose();
-	qualityChart = echarts.init(qualityChartRef.value);
-	const option: echarts.EChartsOption = {
-		tooltip: { trigger: 'axis', valueFormatter: (v) => `${v}%` },
-		legend: { data: ['留存率', '同行业App', '同行业同规模App'] },
-		grid: { left: 40, right: 20, top: 30, bottom: 30 },
-		xAxis: { type: 'category', data: qualityXAxis.value },
-		yAxis: {
-			type: 'value',
-			min: 0,
-			max: 30,
-			axisLabel: { formatter: '{value}%' },
-			splitLine: { lineStyle: { color: '#f3f4f6' } },
-		},
-		series: [
-			{ name: '留存率', type: 'line', smooth: true, data: retentionSeries.value },
-			{ name: '同行业App', type: 'line', smooth: true, data: industryAvgSeries.value, color: '#f59e0b' },
-			{ name: '同行业同规模App', type: 'line', smooth: true, data: peerSameScaleSeries.value, color: '#60a5fa' },
-		],
-	};
-	qualityChart.setOption(option);
-}
 </script>
 
 <style lang="scss" scoped>
 .highlight {
 	color: #2196f3;
 }
+.el-form-item--default{
+	margin-bottom: 0;
+}
+.el-form.el-form--inline .el-form-item--default.el-form-item:last-of-type, .el-form.el-form--inline .el-form-item--small.el-form-item:last-of-type{
+	margin-bottom: 0 !important;
+}
 </style>

+ 6 - 1
src/views/count/user/activeUser/index.vue

@@ -212,7 +212,6 @@ function initLineChart(): void {
 
 onMounted(() => {
 	initLineChart();
-	initQualityChart();
 });
 
 watch(timeGranularity, () => {
@@ -252,4 +251,10 @@ const showDetail1 = ref(true);
 .highlight {
 	color: #2196f3;
 }
+.el-form-item--default{
+	margin-bottom: 0;
+}
+.el-form.el-form--inline .el-form-item--default.el-form-item:last-of-type, .el-form.el-form--inline .el-form-item--small.el-form-item:last-of-type{
+	margin-bottom: 0 !important;
+}
 </style>

+ 8 - 55
src/views/count/user/adduser/index.vue

@@ -12,10 +12,10 @@
 				<div>
 					<el-row shadow="hover" class="ml10">
 						<el-form :inline="true" :model="formData" @keyup.enter="query" ref="queryRef">
-							<el-form-item>
+							<el-form-item >
 								<el-date-picker v-model="formData.time" type="daterange" start-placeholder="开始时间" end-placeholder="结束时间" />
 							</el-form-item>
-							<el-form-item prop="appId">
+							<el-form-item   prop="appId">
 								<el-input :placeholder="'请输入应用ID'" clearable v-model="formData.appId" />
 							</el-form-item>
 						</el-form>
@@ -259,8 +259,6 @@ function initLineChart(): void {
 onMounted(() => {
 	initLineChart();
 	initQualityChart();
-	console.log(qualityChart);
-	initBehaviorChart();
 });
 
 watch(timeGranularity, () => {
@@ -341,61 +339,16 @@ function initQualityChart(): void {
 
 
 
-
-// 用户行为分析(静态)
-const behaviorChartRef = ref<HTMLDivElement | null>(null);
-let behaviorChart: echarts.ECharts | null = null;
-
-const behaviorXAxis = ref<string[]>([
-	'2025-07-01',
-	'2025-07-08',
-	'2025-07-15',
-	'2025-07-22',
-	'2025-07-29',
-	'2025-08-05',
-	'2025-08-12',
-	'2025-08-19',
-	'2025-08-26',
-	'2025-09-02',
-	'2025-09-09',
-	'2025-09-16',
-]);
-
-const activeUsersSeries = ref<number[]>([100, 120, 130, 110, 105, 90, 80, 70, 95, 110, 100, 85]);
-const avgSessionSeries = ref<number[]>([120, 130, 140, 125, 120, 110, 100, 95, 115, 125, 120, 110]);
-const behaviorAvgSeries = ref<number[]>([110, 115, 120, 115, 110, 105, 100, 95, 110, 115, 110, 105]);
-
-function initBehaviorChart(): void {
-	if (!behaviorChartRef.value) return;
-	if (behaviorChart) behaviorChart.dispose();
-	behaviorChart = echarts.init(behaviorChartRef.value);
-	const option: echarts.EChartsOption = {
-		tooltip: { trigger: 'axis', valueFormatter: (v) => `${v}s` },
-		legend: { data: ['活跃用户数', '平均会话时长', '行为均值'] },
-		grid: { left: 40, right: 20, top: 30, bottom: 30 },
-		xAxis: { type: 'category', data: behaviorXAxis.value },
-		yAxis: {
-			type: 'value',
-			min: 0,
-			max: 150,
-			axisLabel: { formatter: '{value}s' },
-			splitLine: { lineStyle: { color: '#f3f4f6' } },
-		},
-		series: [
-			{ name: '活跃用户数', type: 'line', smooth: true, data: activeUsersSeries.value },
-			{ name: '平均会话时长', type: 'line', smooth: true, data: avgSessionSeries.value, color: '#f59e0b' },
-			{ name: '行为均值', type: 'line', smooth: true, data: behaviorAvgSeries.value, color: '#60a5fa' },
-		],
-	};
-	behaviorChart.setOption(option);
-}
-
-
-
 </script>
 
 <style lang="scss" scoped>
 .highlight{
 	color: #2196f3;
 }
+.el-form-item--default{
+	margin-bottom: 0;
+}
+.el-form.el-form--inline .el-form-item--default.el-form-item:last-of-type, .el-form.el-form--inline .el-form-item--small.el-form-item:last-of-type{
+	margin-bottom: 0 !important;
+}
 </style>