From 02409bfbe15f22fc3b5dccadabfd860a660a49d9 Mon Sep 17 00:00:00 2001
From: 罗广辉 <guanghui.luo@foxmail.com>
Date: Sat, 11 Oct 2025 10:37:14 +0800
Subject: [PATCH] feat: 名称修改
---
src/views/wel/components/flightStatistics.vue | 226 +++++++++++++++++++++++++++++++++++++-------------------
1 files changed, 150 insertions(+), 76 deletions(-)
diff --git a/src/views/wel/components/flightStatistics.vue b/src/views/wel/components/flightStatistics.vue
index 16768fd..6034068 100644
--- a/src/views/wel/components/flightStatistics.vue
+++ b/src/views/wel/components/flightStatistics.vue
@@ -59,29 +59,24 @@
});
const chartRef = ref(null);
let { chart: lineChart } = useEchartsResize(chartRef);
-const keyMapping = {
- 飞行时长: 'total_flight_time',
- 飞行里程: 'total_flight_distance',
- // 任务成果: 'event_num',
-};
+// const keyMapping = {
+// '飞行时长': 'total_flight_time',
+// '飞行里程': 'total_flight_distance',
+// // 任务成果: 'event_num',
+// };
const unitMap = {
- 飞行时长: '小时',
- 飞行里程: '公里',
- // 任务成果: '个',
+ '飞行时长': '小时',
+ '飞行里程': '公里',
+
};
const flyTypeList = ref([
{ name: '飞行时长', value: 0, img: flyImg1, key: 'hour_count' },
{ name: '飞行里程', value: 0, img: flyImg2, key: 'flight_mileage' },
- // { name: '任务成果', value: 0, img: flyImg3 },
+
]);
// 飞行统计
const getFlyList = () => {
- // getFly(params.value).then(res => {
- // flyTypeList.value = flyTypeList.value.map(item => ({
- // ...item,
- // value: res.data.data[keyMapping[item.name]] || 0,
- // }));
- // });
+
tongjiNestApi(flyparams.value).then(res => {
flyTypeList.value = flyTypeList.value.map(item => ({
@@ -94,18 +89,18 @@
const getFlyTimeList = () => {
getFlyTime(params.value).then(res => {
const resList = res?.data?.data || [];
+
lineCharts(resList);
});
};
const refresh = () => {
- params.value.date_enum = 'CURRENT_YEAR';
- checked.value = 'CURRENT_YEAR';
- dateSelect.value = 'CURRENT_YEAR';
+
getFlyList();
getFlyTimeList();
+
+
};
let timeClick = (item, index) => {
-
checked.value = item;
params.value.date_enum = item;
dateSelect.value = item;
@@ -150,23 +145,25 @@
});
var option = {
tooltip: {
- trigger: 'item',
+ trigger: 'axis',
axisPointer: {
- type: 'shadow',
+ type: 'shadow'
},
+ // position: 'top'
+
},
grid: {
left: '2%',
right: '4%',
bottom: '14%',
- top: '16%',
+ top: '9%',
containLabel: true,
},
legend: {
data: ['飞行时长', '飞行里程'],
left: 'center',
- top: '5%',
- color: '#383838', // 直接配置颜色
+ // top: '5%',
+ color: '#383838',
itemWidth: 15,
itemHeight: 10,
itemGap: 25,
@@ -181,47 +178,49 @@
},
},
axisLabel: {
- interval: 0,
+ // interval: 0,
color: '#383838',
},
},
yAxis: [
{
- type: 'log',
- name: '单位:小时',
- nameTextStyle: {
- color: '#383838',
- fontSize: '1.2rem',
- },
- min: 1,
- logBase: 3,
- axisLine: {
- show: false,
- lineStyle: {
- color: '#cdd5e2',
- },
- },
- splitLine: {
- show: true,
- lineStyle: {
- type: 'dashed',
- color: '#cdd5e2',
- width: 1,
- opacity: 0.5,
- },
- },
- axisLabel: {
- color: '#666666', // 直接配置颜色
- },
+ type: 'value',
+ name: '单位:小时',
+ nameTextStyle: {
+ color: '#383838',
+ fontSize: '1.2rem',
+ // padding: [0, 0, 14, 0]
+
+ },
+ axisLine: {
+ show: false,
+ lineStyle: {
+ color: '#cdd5e2',
},
+ },
+ splitLine: {
+ show: true,
+ lineStyle: {
+ type: 'dashed',
+ color: '#cdd5e2',
+ width: 1,
+ opacity: 0.5,
+ },
+ },
+ axisLabel: {
+ color: '#666666',
+ }
+ },
{
- type: 'log',
+ type: 'value',
name: '单位:公里',
nameTextStyle: {
color: '#383838',
+ fontSize: '1.2rem',
+ // padding: [0, 0, 14, 0]
},
- min: 1,
- logBase: 3,
+
+
axisLine: {
show: false,
lineStyle: {
@@ -244,20 +243,84 @@
},
],
series: [
- {
- name: '飞行时长',
- type: 'bar',
- barWidth: '8px',
- itemStyle: {
- color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
- { offset: 0, color: '#91C1FF' },
- { offset: 1, color: '#2970FF' },
- ]),
- borderRadius: 4,
- },
- data: flight_time,
- },
+
+ // {//柱底圆片
+ // name: "",
+ // type: "pictorialBar",
+ // symbolSize: [8, 10],//调整截面形状
+ // symbolOffset: [0, 5],
+ // z: 12,
+ // itemStyle: {
+ // "normal": {
+ // color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [{
+ // offset: 0,
+ // "color": "#91C1FF"
+ // },
+ // {
+ // offset: 1,
+ // "color": "#2970FF"
+ // }
+ // ],false)
+ // }
+ // },
+ // data: flight_time,
+ // },
+
+ //柱体
+ {
+ name: '飞行时长',
+ type: 'bar',
+ barWidth: '8px',
+ itemStyle: {
+ "normal": {
+ "color": {
+ "x": 0,
+ "y": 0,
+ "x2": 0,
+ "y2": 1,
+ "type": "linear",
+ "global": false,
+ "colorStops": [{//第一节下面
+ "offset": 0,
+ "color": "#91C1FF"
+ }, {
+ "offset": 1,
+ "color": "#2970FF"
+ }]
+ }
+ }
+ },
+ data: flight_time,
+ },
+
+ //柱顶圆片
+ {
+ name: '',
+ type: "pictorialBar",
+ tooltip: { show: false },
+ symbolSize: [8, 8],//调整截面形状
+ symbolOffset: [0, -3],
+ z: 12,
+ symbolPosition: "end",
+ "itemStyle": {
+ "normal": {
+ color: new echarts.graphic.LinearGradient(0,0,0,1,
+ [{
+ offset: 0,
+ color: "#9DC9FD"
+ },
+ {
+ offset: 1,
+ color: "#3279FA"
+ }
+ ],
+ false
+ ),
+ }
+ },
+ data: flight_time,
+ },
{
name: '飞行里程',
type: 'line',
@@ -269,11 +332,21 @@
lineStyle: {
width: 2,
type: 'solid',
+ color: '#01D0A7',
},
symbol: 'circle',
symbolSize: 6,
- lineStyle: {
- color: '#01D0A7',
+ areaStyle: {
+ color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
+ {
+ offset: 0,
+ color: 'rgba(1,208,167,0.4) '
+ },
+ {
+ offset: 1,
+ color: 'rgba(1,208,167,0) '
+ }
+ ])
},
data: flight_distance,
},
@@ -295,7 +368,7 @@
padding: 4px 14px 0 15px;
background: #ffffff !important;
margin-top: 5px;
- height: pxToVh(400);
+ height: pxToVh(471);
.fytitle {
display: flex;
@@ -344,7 +417,7 @@
}
.flycenter {
- margin-top: 13px;
+ margin-top: 8px;
.centerBox {
display: flex;
@@ -355,13 +428,15 @@
padding: 7px 7px 0 15px;
width: 196px;
flex: 1;
- // height: 80px;
- height: pxToVh(80);
+ height: 41px;
+ //height: pxToVh(41);
background: #f6f8fe;
box-shadow: 0px 5px 4px 0px #ebf1ff;
border-radius: 8px 8px 8px 8px;
border: 1px solid #ffffff;
margin-right: 16px;
+ display: flex;
+ align-items: center;
img {
width: 15px;
@@ -378,7 +453,7 @@
}
.flydata {
- margin-top: 10px;
+ margin-left: 11px;
text-align: right;
font-size: 14px;
color: #7c8091;
@@ -394,9 +469,8 @@
}
.lineChart {
- height: pxToVh(233) ;
+ height: pxToVh(374) ;
width: 100%;
-
.lineBox {
width: 100%;
height: 100%;
--
Gitblit v1.9.3