版本更新

surprise

2024-04-09 71f13ae626284e476a300b08a5f9e2c0f188544c

版本更新

 src/components/BJlist.vue

@@ -144,9 +144,9 @@
      if (dt2.result) {

        dt2.result.map((item) => {
          console.log("val_step",item.dir);
        
          var dir = item.dir + val_step;
          console.log("val_step",dir);
         
          sgworld.Core.postMessage({
            func_name: "SetSmallWind",
            lon: item.x,
@@ -244,7 +244,7 @@
          pitch: -89.5,
          roll: 0,
        });
        WRY(dt.result.data, date);
        WRY(POIobj, dt.result.data, date);
      } else {
        return ElMessage.error("请检查是否有数据");
      }
@@ -268,7 +268,7 @@
    const dateFormatter = (row) => {
      return insertStr(row.time) + ":00:00";
    };
    const WRY = (val, time) => {
    const WRY = (obj, val, time) => {
      sgworld.Core.postMessage({ func_name: "RemoveGridLines", id: "" });
      //删除边界
      sgworld.Core.postMessage({ func_name: "RemoveGridSide", id: "" });
@@ -318,6 +318,23 @@
              Addr: dt.result.addr3,
            });
          }


          store.state.YJXQ = {
            name: obj,
            val: dt.result,
            time: time,
          }


          setTimeout(() => {
            store.state.YJXQFlag = true;
          }, 500);





          sgworld.Core.postMessage({
            func_name: "SpawnGridLines",
            StartPointArr: location,

 src/components/YJlist.vue

@@ -8,65 +8,22 @@
      <div class="list_title">预警点位列表</div>
      <div class="inp_box">
        <span>选择时间段：</span>
        <el-date-picker
          size="large"
          v-model="selectform.value1"
          type="datetimerange"
          @change="changeTime"
          value-format="YYYY-MM-DD HH"
          format="YYYY-MM-DD HH"
        />
        <el-date-picker size="large" v-model="selectform.value1" type="datetimerange" @change="changeTime"
          value-format="YYYY-MM-DD HH" format="YYYY-MM-DD HH" />
      </div>
      <div class="table_box">
        <el-table
          :data="data.tableData"
          style="width: 100%"
          height="100%"
          @row-click="flytoPoi"
        >
          <el-table-column
            prop="name"
            label="名称"
            show-overflow-tooltip
            align="center"
          />
        <el-table :data="data.tableData" style="width: 100%" height="100%" @row-click="flytoPoi">
          <el-table-column prop="name" label="名称" show-overflow-tooltip align="center" />
          <!--<el-table-column prop="name" label="名称" show-overflow-tooltip />-->
          <el-table-column
            prop="lon"
            label="经度"
            :show-overflow-tooltip="true"
            align="center"
          />
          <el-table-column
            prop="lat"
            label="纬度"
            show-overflow-tooltip
            align="center"
          />
          <el-table-column
            prop="value"
            label="数值"
            show-overflow-tooltip
            align="center"
          />
          <el-table-column
            width="120"
            prop="time"
            label="时间"
            show-overflow-tooltip
            :formatter="dateFormatter"
            align="center"
          />
          <el-table-column label="操作"  width="180px">
          <el-table-column prop="lon" label="经度" :show-overflow-tooltip="true" align="center" />
          <el-table-column prop="lat" label="纬度" show-overflow-tooltip align="center" />
          <el-table-column prop="value" label="数值" show-overflow-tooltip align="center" />
          <el-table-column width="120" prop="time" label="时间" show-overflow-tooltip :formatter="dateFormatter"
            align="center" />
          <el-table-column label="操作" width="180px">
            <template #default="scope">
              <el-button
                link
                type="primary"
                size="small"
                :disabled="scope.row.isSuYuan == 0"
                @click.stop="listClick(scope.row)"
                >污染源</el-button
              >
              <el-button link type="primary" size="small" :disabled="scope.row.isSuYuan == 0"
                @click.stop="listClick(scope.row)">污染源</el-button>
            </template>
          </el-table-column>
        </el-table>
@@ -90,6 +47,7 @@
} from "@/api/api.js";
export default {
  //import引入的组件需要注入到对象中才能使用
  emits: ["toYJList"],
  components: { Search },
  props: ["POIListData"],
  setup(props, { emit }) {
@@ -126,10 +84,8 @@
        )};Mouth=${row.time.slice(4, 6)};Day=${row.time.slice(
          6,
          8
        )};Hour=${row.time.slice(8, 10)};Density=${BJFC.Density};Speed=${
          BJFC.Speed
        };d1=0;d2=30;Corp=1;Lon=${row.lon};Lat=${row.lat};Length=${
          BJFC.Length
        )};Hour=${row.time.slice(8, 10)};Density=${BJFC.Density};Speed=${BJFC.Speed
        };d1=0;d2=30;Corp=1;Lon=${row.lon};Lat=${row.lat};Length=${BJFC.Length
        };`
      );
    };
@@ -152,7 +108,6 @@
        data.feedbackId = dt.result.feedbackId;
        data.WGlist = dt.result.data;
        let h = 450;

        let arr = [];
        dt.result.data.forEach((e) => {
          arr.push({
@@ -181,12 +136,13 @@
          h = 500;
        }
        const dt1 = await getCoordByName(POIobj.name);

        sgworld.Navigate.flyToPosition(dt1.result.lon, dt1.result.lat, h, {
          heading: 270,
          pitch: -89.5,
          roll: 0,
        });
        WRY(dt.result.data, date);
        WRY(POIobj, dt.result.data, date);
      } else {
        return ElMessage.error("请检查是否有数据");
      }
@@ -221,7 +177,7 @@
    const dateFormatter = (row) => {
      return insertStr(row.time);
    };
    const WRY = (val, time) => {
    const WRY = (obj, val, time) => {
      sgworld.Core.postMessage({ func_name: "RemoveGridLines", id: "" });
      //删除边界
      sgworld.Core.postMessage({ func_name: "RemoveGridSide", id: "" });
@@ -234,6 +190,7 @@
          date: time,
        });
        if (dt.result) {

          sgworld.Core.postMessage({
            func_name: "RemoveGridLines",
            id: "line",
@@ -271,6 +228,20 @@
              Addr: dt.result.addr3,
            });
          }
         
         
        store.state.YJXQ={
          name:obj,
          val:dt.result,
          time:time,
        }


        setTimeout(() => {
  store.state.YJXQFlag = true;
}, 500);


          sgworld.Core.postMessage({
            func_name: "SpawnGridLines",
            StartPointArr: location,
@@ -283,6 +254,10 @@
            fx_number: 20,
            line_scale: 0.5,
          });
          


        
        }
      });
    };
@@ -316,6 +291,7 @@
<style lang="less" scoped>
//@import url(); å¼•å…¥å…¬å…±cssç±»
.YJlist_box {

  // position: absolute;
  // right: 20px;
  // top: 490px;
@@ -346,12 +322,14 @@
      font-size: 16px;
      font-weight: 600;
    }

    .text {
      font-size: 24px;
      font-weight: 400;
      color: #ffffff;
    }
  }

  .list_box {
    width: calc(775px * 1.8);
    height: calc(472px * 1.8);
@@ -361,6 +339,7 @@
    padding: calc(45px * 1.5);
    position: relative;
    overflow: auto;

    .list_close {
      width: 22px;
      height: 22px;
@@ -371,12 +350,14 @@
      right: 80px;
      top: 80px;
    }

    .list_title {
      font-size: 30px;
      margin-bottom: 20px;
      font-weight: bold;
      color: #ffffff;
    }

    .table_box {
      width: 100%;
      height: 80%;
@@ -386,26 +367,32 @@
      // transform: translateX(-50%);
      // z-index: 10;
    }

    .el-table {
      // height: 370px;
      width: 100%;
      overflow: auto;
      background-color: transparent;
    }

    .el-table::before {
      height: 0;
    }

    .el-table /deep/ .el-tooltip {
      padding: 0;
    }

    .el-table /deep/ th,
    .el-table /deep/ tr {
      background-color: transparent;
      color: white;
    }
    .el-table /deep/ tr:hover > td {

    .el-table /deep/ tr:hover>td {
      background-color: rgba(0, 0, 0, 1) !important;
    }

    /deep/ .el-table__body {
      width: 100% !important;
    }
@@ -414,6 +401,7 @@
      width: 100% !important;
    }
  }

  .inp_box {
    span {
      font-size: 24px;
@@ -421,6 +409,7 @@
      color: #ffffff;
      padding-right: 10px;
    }

    /deep/ .el-input__wrapper {
      // width: 460px;
      background: rgba(0, 0, 0, 0.2);
@@ -430,21 +419,26 @@
      padding: 0;
      padding-left: 3px;
    }

    /deep/ .el-input__inner,
    /deep/ .el-textarea__inner {
      //   background-color: rgba(134, 132, 132, 0.5);
      color: #ffffff;
      font-size: 24px;
    }

    /deep/.el-range-input {
      color: white;
    }

    /deep/ .el-range-separator {
      color: white;
    }

    .el-select {
      width: 180px;
    }

    .el-select /deep/ .el-input__wrapper {
      background: rgba(0, 0, 0, 0.2);
      border: 2px solid #2e58cc;
@@ -453,6 +447,7 @@
      padding: 0;
      padding-left: 6px;
    }

    .el-select /deep/ .el-input__inner {
      color: #ffffff;
      font-size: 24px;

 src/components/yjxq.vue

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,283 @@
<template>
  <div class="YJlist_box">


    <div class="list_box" id="list_box1">
      <div style="display: flex;justify-content: space-between;">
        <div class="list_title">可疑污染源</div>
        <div @click="closeData" style="width: 30px;height:30px;color:white">
          <Close></Close>
        </div>
      </div>

      <table>
        <tr>
          <th>名称：</th>
          <th>{{ listData.name }}</th>
          <th>时间：</th>
          <th>{{ listData.time }}</th>
        </tr>
        <div>溯源结果：</div>

      </table>
      <table>
        <tr>
          <th></th>
          <th>设备名称</th>
          <th>经度</th>
          <th style="padding: 0px 20px;">维度</th>
          <th style="padding: 0px 20px;">概率</th>
        </tr>
        <tr v-if="listData.val">
          <th>位置1：</th>
          <td>{{ listData.val.addr1 }}</td>
          <td>{{ listData.val.x1 }}</td>
          <td style="padding: 0px 20px;">{{ listData.val.y1 }}</td>
          <td style="padding: 0px 20px;">{{ (listData.val.odds1 * 100).toFixed(1) }}%</td>
        </tr>
        <tr v-if="listData.val">
          <th>位置2：</th>
          <td>{{ listData.val.addr2 }}</td>
          <td>{{ listData.val.x2 }}</td>
          <td style="padding: 0px 20px;">{{ listData.val.y2 }}</td>
          <td style="padding: 0px 20px;">{{ (listData.val.odds2 * 100).toFixed(1) }}%</td>
        </tr>
        <tr v-if="listData.val">
          <th>位置3：</th>
          <td>{{ listData.val.addr3 }}</td>
          <td>{{ listData.val.x3 }}</td>
          <td style="padding: 0px 20px;">{{ listData.val.y2 }}</td>
          <td style="padding: 0px 20px;">{{ (listData.val.odds3 * 100).toFixed(1) }}%</td>
        </tr>
      </table>

    </div>
  </div>
</template>

<script>
import { Search, Close } from "@element-plus/icons-vue"; // svg图标
// import type { FormInstance, FormRules } from "element-plus";
import { reactive, onMounted, watch, ref } from "vue";
import { FormInstance, ElMessage, ElMessageBox } from "element-plus";

import menuTool from "@/assets/js/menuTool";
import { useStore } from "vuex";
import {
  ysshSuYuanX00Controller,
  getCoordByName,
  selectSuYuan46ById,
} from "@/api/api.js";
export default {
  //import引入的组件需要注入到对象中才能使用
  components: { Search },
  props: ["POIListData"],
  setup(props, { emit }) {
    const store = useStore();
    // è¿™ä¸ªæ˜¯å†™åœ¨setup()里的！！

    const formRef = ref < FormInstance > "";
    const selectform = reactive({
      value1: [],
    });
    let listData = ref({
      name: null,
      time: null,
      val: null,
    })



    const closeData = () => {
      store.state.YJXQFlag = false;
      store.state.YJXQ = null;
    }

    onMounted(() => {
      var obj = store.state.YJXQ;
      if (obj) {
        listData.value = {
          name: obj.name.name,
          time: obj.time,
          val: obj.val,
        };
        store.state.YJXQ = null;
      }
    });
    watch(
      () => store.state.YJXQ,
      (nVal, oVal) => {
        if (nVal) {

          listData.value = {
            name: nVal.name.name,
            time: nVal.time,
            val: nVal.val,

          };
          store.state.YJXQ = null;

        }
      },
      { deep: true, immediate: true }
    );


    return {
      formRef,
      selectform,
      listData,
      closeData
    };
  },
};
</script>
<style lang="less" scoped>
//@import url(); å¼•å…¥å…¬å…±cssç±»
.YJlist_box {
  position: absolute;
  right: 70px;
  bottom: 10px;

  .list_box {
    width: calc(775px * 1.8);
    // height: calc(472px * 1);
    box-sizing: border-box;
    background: url("../assets/img/bgk.png") no-repeat center;
    background-size: 100% 100%;
    padding: calc(45px * 1.5);
    position: relative;

    // overflow: auto;
    .list_close {
      width: 22px;
      height: 22px;
      cursor: pointer;
      background: url("../assets/img/close.png") center no-repeat;
      background-size: 100% 100%;
      position: absolute;
      right: 80px;
      top: 80px;
    }

    table {
      color: white;
      text-align: left;

      th {
        min-width: 150px;
      }

      tr {
        margin-bottom: 10px !important;


      }
    }

   

    .list_title {
      font-size: 30px;
      margin-bottom: 20px;
      font-weight: bold;
      color: #ffffff;
    }

    .table_box {
      width: 100%;
      height: 80%;
      // position: absolute;
      // top: 110px;
      // left: 50%;
      // transform: translateX(-50%);
      // z-index: 10;
    }

    .el-table {
      // height: 370px;
      width: 100%;
      overflow: auto;
      background-color: transparent;
    }

    .el-table::before {
      height: 0;
    }

    .el-table /deep/ .el-tooltip {
      padding: 0;
    }

    .el-table /deep/ th,
    .el-table /deep/ tr {
      background-color: transparent;
      color: white;
    }

    .el-table /deep/ tr:hover>td {
      background-color: rgba(0, 0, 0, 1) !important;
    }

    /deep/ .el-table__body {
      width: 100% !important;
    }

    /deep/ .el-table__header {
      width: 100% !important;
    }
  }

  .inp_box {
    span {
      font-size: 24px;
      font-weight: 400;
      color: #ffffff;
      padding-right: 10px;
    }

    /deep/ .el-input__wrapper {
      // width: 460px;
      background: rgba(0, 0, 0, 0.2);
      border: 2px solid #2e58cc;
      border-radius: 10px;
      color: #ffffff;
      padding: 0;
      padding-left: 3px;
    }

    /deep/ .el-input__inner,
    /deep/ .el-textarea__inner {
      //   background-color: rgba(134, 132, 132, 0.5);
      color: #ffffff;
      font-size: 24px;
    }

    /deep/.el-range-input {
      color: white;
    }

    /deep/ .el-range-separator {
      color: white;
    }

    .el-select {
      width: 180px;
    }

    .el-select /deep/ .el-input__wrapper {
      background: rgba(0, 0, 0, 0.2);
      border: 2px solid #2e58cc;
      border-radius: 10px;
      color: #ffffff;
      padding: 0;
      padding-left: 6px;
    }

    .el-select /deep/ .el-input__inner {
      color: #ffffff;
      font-size: 24px;
    }
  }
}
</style>

 src/store/index.js

@@ -22,6 +22,8 @@
    loadingInstance: null,
    SYPOI: null,
    WGobj: null,
    YJXQ:null,
    YJXQFlag:false,
  },
  mutations: {
    getWGobj(state, msg) {

 src/views/index.vue

@@ -16,25 +16,12 @@
          </div>
          <div class="right">
            <BGDC v-show="checkMenuFlag == 'a3'"></BGDC>
            <report-list
              :menusId="checkMenuFlag"
              v-if="
                checkMenuFlag == 'a4' ||
                checkMenuFlag == 'a5' ||
                checkMenuFlag == 'a6'
              "
            ></report-list>
            <SYFX
              :SYPOIname="POIName"
              @toggleFK="toggleFK"
              v-if="checkMenuFlag == 'a2'"
            ></SYFX>
            <SYFK
              :SYPOIname="POIName"
              :syfkData="syfkData"
              v-if="showFk"
              @FKclose="FKclose"
            ></SYFK>
            <report-list :menusId="checkMenuFlag" v-if="checkMenuFlag == 'a4' ||
      checkMenuFlag == 'a5' ||
      checkMenuFlag == 'a6'
      "></report-list>
            <SYFX :SYPOIname="POIName" @toggleFK="toggleFK" v-if="checkMenuFlag == 'a2'"></SYFX>
            <SYFK :SYPOIname="POIName" :syfkData="syfkData" v-if="showFk" @FKclose="FKclose"></SYFK>
            <YCWG v-if="checkMenuFlag == 'b2'"></YCWG>
            <div class="chart_box" v-if="chart_isshow">
              <div class="popout_title">曲线统计图</div>
@@ -42,16 +29,11 @@
              <chart></chart>
            </div>

            <date-time-picker
              :tpData="checkMenuFlag"
              v-if="
                checkMenuFlag == 'd21' ||
                checkMenuFlag == 'd22' ||
                checkMenuFlag == 'd23' ||
                checkMenuFlag == 'd3'
              "
              @changeTime="changeTime"
            ></date-time-picker>
            <date-time-picker :tpData="checkMenuFlag" v-if="checkMenuFlag == 'd21' ||
      checkMenuFlag == 'd22' ||
      checkMenuFlag == 'd23' ||
      checkMenuFlag == 'd3'
      " @changeTime="changeTime"></date-time-picker>
            <div class="weather_box_c" v-show="checkMenuFlag == 'd6'">
              <div class="popout_title">天气特效</div>
              <!-- <div class="close" @click="popoutClose('HJ')"></div> -->
@@ -64,22 +46,18 @@
            <gjfx v-if="checkMenuFlag == 'f1'"></gjfx>
            <zdmax v-if="checkMenuFlag == 'f1'"></zdmax>
            <PreCusPage v-if="checkMenuFlag == 'b5'"></PreCusPage>



          </div>
        </div>
      </div>
    </transition>
    <div
      class="video_box"
      v-if="checkMenuFlag == 'e3' || checkMenuFlag == 'e5'"
    >
      <video
        :src="videoUrl"
        controls="controls"
        autoplay
        muted
        style="width: 100%"
      ></video>
    <div class="video_box" v-if="checkMenuFlag == 'e3' || checkMenuFlag == 'e5'">
      <video :src="videoUrl" controls="controls" autoplay muted style="width: 100%"></video>
    </div>

    <yjxq v-if="yjwryisshow"></yjxq>
  </div>
</template>

@@ -121,6 +99,7 @@
import zdmax from "@/components/xgzs/zdmax.vue";
import dayzdmax from "@/components/xgzs/dayzdmax.vue";
import weekzdmax from "@/components/xgzs/weekzdmax.vue";
import yjxq from '@/components/yjxq.vue';
import {
  queryWeatherList,
  queryLocaltion,
@@ -128,6 +107,7 @@
  getRunAlarm,
  getRunWarning,
} from "@/api/api.js";
import { tr } from 'element-plus/es/locale';
export default {
  components: {
    headerBox,
@@ -148,10 +128,12 @@
    reportList,
    dayzdmax,
    weekzdmax,
    PreCusPage
    PreCusPage,
    yjxq
  },
  setup(props, { emit }) {
    const store = useStore();

    const checkMenuFlag = ref("f1");
    let POIName = ref("");
    let syfkData = reactive({
@@ -162,6 +144,7 @@
    });
    const showFk = ref(false);
    let chart_isshow = ref(false);
    let yjwryisshow = ref(false);
    let data = reactive({
      histogram: null,
      HeatMap: null,
@@ -224,8 +207,7 @@
      }
      if (res.id == "e4") {
        window.open(
          `${
            window.location.href.split("#")[0]
          `${window.location.href.split("#")[0]
          }config/燕山石化系统功能操作文档.pdf`
        );
      }
@@ -284,6 +266,7 @@
    const changeTime = (res) => {
      console.log(res);
    };

    getPOI();
    // menuTool.bjthis();
    onMounted(() => {
@@ -313,7 +296,15 @@
      },
      { deep: true, immediate: true }
    );
    watch(
      () => store.state.YJXQFlag,
      (nVal, oVal) => {
        console.log("sdasd", nVal)
        yjwryisshow.value = nVal;

      },
      { deep: true, immediate: true }
    );
    return {
      menusData,
      checkMenuFlag,
@@ -328,6 +319,8 @@
      showlogo,
      changeTime,
      videoUrl,

      yjwryisshow
    };
  },
};
@@ -339,6 +332,7 @@
  height: 100vh;
  position: relative;
  overflow: hidden;

  .right_box {
    position: absolute;
    right: 70px;
@@ -349,19 +343,23 @@
    display: flex;
    flex-direction: column;
    align-items: flex-end;

    .content {
      display: flex;
      justify-content: space-between;
      align-content: center;
    }
  }

  .right_box::-webkit-scrollbar {
    width: 8px;
  }

  .right_box::-webkit-scrollbar-thumb {
    border-radius: 10px;
    background: rgba(0, 0, 0, 0.2);
  }

  .right_box::-webkit-scrollbar-track {
    border-radius: 0;
    background: rgba(0, 0, 0, 0);
@@ -376,6 +374,7 @@

    // background: #000;
  }

  .chart_box {
    // position: absolute;
    // right: 70px;
@@ -388,6 +387,7 @@
    background: url("../assets/img/zbg.png") no-repeat center;
    background-size: 100% 100%;
    position: relative;

    .close {
      width: 22px;
      height: 22px;
@@ -398,6 +398,7 @@
      right: 50px;
      top: 50px;
    }

    .popout_title {
      font-size: 35px;
      font-weight: bold;
@@ -408,6 +409,7 @@
      // top: 50px;
    }
  }

  .weather_box_c {
    // position: absolute;
    // right: 20px;
@@ -419,6 +421,7 @@
    box-sizing: border-box;
    background: url("../assets/img/bgk.png") no-repeat center;
    background-size: 100% 100%;

    .popout_title {
      font-size: 30px;
      font-weight: bold;
@@ -429,12 +432,14 @@
      // top: 50px;
    }
  }

  .video_box {
    width: 50%;
    bottom: 21%;
    position: absolute;
    left: 23%;
  }

  .video_box_close {
    width: 100%;
    background: #333333;