大屏分离平台在线和考核成绩接口

fuliqi

2024-09-23 c5c80dbc2632719789b91d236de7cf1e6497557d

大屏分离平台在线和考核成绩接口

 src/api/newpage.js

@@ -8,6 +8,14 @@
  });
}

// 获取平台在线
export function getPlatform() {
  return request({
    url: "/dashboard/platform",
    method: "get",
  });
}

// 设备数据
export function getDeviceData(dataScope, deptId) {
  return request({

 src/views/screen/components/map3.vue

@@ -14,12 +14,53 @@
      type: Object,
      default: {},
    },
    platformData: {
      type: Object,
      default: {},
    },
  },
  data() {
    return {
      myChart: null, // ECharts 实例
      big: 130,
      data: [
      dotData: [
        {
          name: '自流井区',
          value: [104.665471408, 29.23008885, 300],
          platformOnline: true
        },
        {
          name: '高新区',
          value: [104.805193, 29.3, 300],
          platformOnline: true
        },
        {
          name: '大安区',
          value: [104.90805, 29.345946, 300],
          platformOnline: true
        },
        {
          name: '沿滩区',
          value: [104.80804, 29.200594, 300],
          platformOnline: true
        },
        {
          name: '贡井区',
          value: [104.579106, 29.241427, 300],
          platformOnline: true
        },
        {
          name: '荣县',
          value: [104.3534, 29.3538, 300],
          platformOnline: true
        },
        {
          name: '富顺县',
          value: [104.96, 29.08, 300],
          platformOnline: true
        }
      ],
      markData: [
        {
          name: '自流井区',
          number: '0',
@@ -72,11 +113,21 @@
      this.getChinData('自贡市', chinaJson)
    },
    updateMapData() {
      this.data.forEach(item => {
        if (this.geoCoordinates[item.name]) {
          item.number = this.geoCoordinates[item.name].score || '0'
        }
      })
      if (this.geoCoordinates) {
        this.markData.forEach(item => {
          if (this.geoCoordinates[item.name]) {
            item.number = this.geoCoordinates[item.name].score || '0'
          }
        })
      }
      if (this.platformData) {
        this.dotData.forEach(item => {
          console.log('更新数据', this.platformData)
          if (this.platformData[item.name]) {
            item.platformOnline = this.platformData[item.name].platformOnline
          }
        })
      }
    },
    updateChart() {
      if (this.myChart) {
@@ -84,7 +135,11 @@
        // Update the scatter3D series data
        const scatterSeries = option.series.find(s => s.type === 'scatter3D' && s.name !== '散点图');
        if (scatterSeries) {
          scatterSeries.data = this.data;
          scatterSeries.data = this.markData;
        }
        const dotSeries = option.series.find(s => s.type === 'scatter3D' && s.name === '散点图');
        if (dotSeries) {
          dotSeries.data = this.dotData;
        }
        this.myChart.setOption(option);
      }
@@ -250,41 +305,18 @@
            silent: true,

            itemStyle: {
              color: '#fc840e',
              color: function (param) {
                if (param.data.platformOnline) {
                  return '#04CD44';
                } else {
                  return '#FF0756';
                }
              },
              borderWidth: 1,
              borderColor: '#fff'
            },

            data: [
              {
                name: '自流井区',
                value: [104.665471408, 29.23008885, 300]
              },
              {
                name: '高新区',
                value: [104.805193, 29.3, 300]
              },
              {
                name: '大安区',
                value: [104.90805, 29.345946, 300]
              },
              {
                name: '沿滩区',
                value: [104.80804, 29.200594, 300]
              },
              {
                name: '贡井区',
                value: [104.579106, 29.241427, 300]
              },
              {
                name: '荣县',
                value: [104.3534, 29.3538, 300]
              },
              {
                name: '富顺县',
                value: [104.96, 29.08, 300]
              }
            ]
            data: that.dotData
          },
          {
            type: 'lines3D',
@@ -355,12 +387,12 @@
        coordinateSystem: 'geo3D',
        symbol: 'circle',
        symbolSize: 0,
        data: that.data,
        data: that.markData,

        itemStyle: {
          opacity: 1,
          borderWidth: 1,
          borderColor: 'a4ddee'
          borderColor: 'a4ddee',
        },

        label: {
@@ -404,6 +436,13 @@
        this.updateChart();
      },
      deep: true
    },
    platformData: {
      handler(newValue) {
        this.updateMapData(newValue);
        this.updateChart();
      },
      deep: true
    }
  },
}

 src/views/screen/index.vue

@@ -46,7 +46,7 @@
      <div class="map-container" ref="isMap">
        <img src="@/assets/map/texture/rotating-point2.png" alt="Rotating Image" class="rotating-image">
        <img src="@/assets/map/texture/rotatingAperture.png" alt="Rotating Image" class="rotating-image-in">
        <mapApp @clickMap="getDeptId" :geoCoordinates=scoreData></mapApp>
        <mapApp @clickMap="getDeptId" :geoCoordinates=scoreData :platformData = platformData></mapApp>
        <div class="btn-container">
          <img src="@/assets/images/btn-bg.png" class="bg-img"/>
          <div class="btn-list" v-model="activerBtnType">
@@ -202,7 +202,8 @@
  checkFace,
  checkCar,
  checkVideo,
  checkScore
  checkScore,
  getPlatform
} from "@/api/newpage";

export default {
@@ -217,6 +218,7 @@
      faceList: [],
      workOrderData: [],
      workOrderRegion: [],
      platformData: null,
      scoreData: {
          自流井区: [
            {
@@ -366,6 +368,14 @@
        .then((res) => {
          if(res.data && Object.keys(res.data).length > 0){
            this.scoreData = res.data;
          }
        })
        .catch((err) => {
        });
      getPlatform(this.activerBtnType, this.deptId)
        .then((res) => {
          if(res.data && Object.keys(res.data).length > 0){
            this.platformData = res.data;
          }
        })
        .catch((err) => {
@@ -1107,7 +1117,7 @@
              align-items: center;
              list-style-type: none;
              border-bottom: 1px dashed #223654;
              margin: 8px 0;
              margin: 7px 0;
              li {
                width: 25%;
                text-align: center;

 src/views/system/monitor/car/index.vue

@@ -158,8 +158,8 @@
            <el-form-item label="设备编码：">{{ form.serialNumber }}</el-form-item>
            <el-form-item label="标签：">{{ form.provinceTag == 0 ? '省厅' : '市局' }}</el-form-item>
            <el-form-item label="设备状态：">
              <div v-if="form.onState === 0">异常</div>
              <div v-else-if="form.onState === 1">正常</div>
              <div v-if="form.onState === 0">离线</div>
              <div v-else-if="form.onState === 1">在线</div>
            </el-form-item>
            <el-form-item label="管理单位：">{{ form.unitName }}</el-form-item>
          </el-col>

 src/views/system/monitor/face/index.vue

@@ -199,8 +199,8 @@
            <el-form-item label="设备编码：">{{ form.serialNumber }}</el-form-item>
            <el-form-item label="标签：">{{ form.provinceTag == 0 ? '省厅' : '市局' }}</el-form-item>
            <el-form-item label="设备状态：">
              <div v-if="form.onState === 0">异常</div>
              <div v-else-if="form.onState === 1">正常</div>
              <div v-if="form.onState === 0">离线</div>
              <div v-else-if="form.onState === 1">在线</div>
            </el-form-item>
            <el-form-item label="管理单位：">{{ form.unitName }}</el-form-item>
          </el-col>

 src/views/system/monitor/video/index.vue

@@ -239,8 +239,8 @@
            <el-form-item label="设备编码：">{{ form.serialNumber }}</el-form-item>
            <el-form-item label="标签：">{{ form.provinceTag == 0 ? '省厅' : '市局' }}</el-form-item>
            <el-form-item label="设备状态：">
              <div v-if="form.onState === 0">异常</div>
              <div v-else-if="form.onState === 1">正常</div>
              <div v-if="form.onState === 0">离线</div>
              <div v-else-if="form.onState === 1">在线</div>
            </el-form-item>
            <el-form-item label="管理单位：">{{ form.unitName }}</el-form-item>
          </el-col>