1. 添加溯源清单功能 2. 修复切换至走航监测界面后，之前正在加载的历史数据依旧展示至地图的问题 3. 添加折线图下载图片功能； 4. 添加数据导出...

riku

2024-09-06 3832a82fb79d4cec4cca5e2854e54953f2095ef8

 src/components/monitor/DataSummary.vue

@@ -20,13 +20,13 @@
            size="small"
            :show-overflow-tooltip="true"
            border
            row-class-name="t-row"
            row-class-name="t-row-summary"
            cell-class-name="t-cell"
            header-row-class-name="t-header-row"
            header-cell-class-name="t-header-cell"
          >
            <el-table-column prop="factor" label="因子" width="66" />
            <el-table-column prop="avg" label="均值" width="66" />
            <el-table-column prop="avg" label="均值" width="84" />
            <el-table-column prop="min" label="最小值" width="66" />
            <el-table-column prop="max" label="最大值" width="66" />
          </el-table>
@@ -38,6 +38,7 @@
<script>
import { FactorDatas } from '@/model/FactorDatas';
import { factorName } from '@/constant/factor-name';
import { windDir } from '@/constant/wind-dir';

export default {
  props: {
@@ -56,29 +57,40 @@
      for (const key in this.factorDatas.factor) {
        if (Object.hasOwnProperty.call(this.factorDatas.factor, key)) {
          const f = this.factorDatas.factor[key];
          let min,
            max,
            total = 0,
            count = 0;
          f.datas.forEach((v) => {
            if (!min || v.factorData < min) {
              min = v.factorData;
            }
            if (!max || v.factorData > max) {
              max = v.factorData;
            }
            total += v.factorData;
            count++;
          });
          let _avg = count == 0 ? 0 : Math.round((total / count) * 100) / 100;
          if (isNaN(_avg)) _avg = '-';
          list.push({
            factorId: f.factorId,
            factor: factorName[f.factorName],
            min,
            max,
            avg: _avg
          });
          if (f.factorName == 'WIND_DIRECTION') {
            const avg = this.windDirAvg(f);
            list.push({
              factorId: f.factorId,
              factor: factorName[f.factorName],
              min: '-',
              max: '-',
              avg: `${avg}(${windDir(avg)})`
            });
          } else {
            let min,
              max,
              total = 0,
              count = 0;
            f.datas.forEach((v) => {
              if (!min || v.factorData < min) {
                min = v.factorData;
              }
              if (!max || v.factorData > max) {
                max = v.factorData;
              }
              total += v.factorData;
              count++;
            });
            let _avg = count == 0 ? 0 : Math.round((total / count) * 100) / 100;
            if (isNaN(_avg)) _avg = '-';
            list.push({
              factorId: f.factorId,
              factor: factorName[f.factorName],
              min,
              max,
              avg: _avg
            });
          }
        }
      }
      return list;
@@ -88,6 +100,51 @@
        return this.selectFactorType.includes(v.factorId);
      });
    }
  },
  methods: {
    windDirAvg(factor) {
      let u = 0, // 东西方向分量总和
        v = 0, // 南北方向分量总和
        c = 0; // 风向数据个数
      factor.datas.forEach((value) => {
        let r = (value.factorData / 180.0) * Math.PI;
        u += Math.sin(r);
        v += Math.cos(r);
        c++;
      });
      if (c != 0) {
        const avgU = u / c;
        const avgV = v / c;
        let a = Math.atan(avgU / avgV);
        /**
         * avgU>0;avgV>0: 真实角度处于第一象限，修正值为+0°
         * avgU>0;avgV<0: 真实角度处于第二象限，修正值为+180°
         * avgU<0;avgV<0: 真实角度处于第三象限，修正值为+180°
         * avgU<0;avgV>0: 真实角度处于第四象限，修正值为+360°
         */
        a = (a * 180.0) / Math.PI;
        if (avgV > 0) {
          a += avgU > 0 ? 0 : 360;
        } else {
          a += 180;
        }
        return parseInt(a);
      } else {
        return 0;
      }
    }
  }
};
</script>
<style>
.t-row-summary {
  cursor: auto;
  background-color: transparent !important;
}
</style>
<style scoped>
.el-table {
  --el-table-row-hover-bg-color: transparent;
  --el-table-current-row-bg-color: transparent;
}
</style>