燕山石化溯源三维电子沙盘-【前端】-Web
surprise
2024-03-27 08d0c4ca9064c27be7b3e488bec497e87a05cc18
src/views/index.vue
@@ -5,52 +5,73 @@
    <transition name="el-zoom-in-center" v-show="showlogo">
      <menus @menusData="menusData"></menus>
    </transition>
    <transition name="el-zoom-in-top" v-show="showlogo">
      <div class="right_box">
        <poiList></poiList>
        <BGDC v-show="checkMenuFlag == 'a3'"></BGDC>
        <SYFX
          :SYPOIname="POIName"
          @toggleFK="toggleFK"
          v-if="checkMenuFlag == 'a2'"
        ></SYFX>
        <SYFK
          :SYPOIname="POIName"
          :syfkData="syfkData"
          v-if="showFk"
          @FKclose="FKclose"
        ></SYFK>
        <YCWG v-show="checkMenuFlag == 'b2'"></YCWG>
        <div class="chart_box" v-if="chart_isshow">
          <div class="popout_title">曲线统计图</div>
          <div class="close" @click="popoutClose('QX')"></div>
          <chart></chart>
        </div>
        <div class="content">
          <div class="left">
            <dayzdmax v-if="checkMenuFlag == 'f1'"></dayzdmax>
            <weekzdmax v-if="checkMenuFlag == 'f1'"></weekzdmax>
          </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>
            <YCWG v-if="checkMenuFlag == 'b2'"></YCWG>
            <div class="chart_box" v-if="chart_isshow">
              <div class="popout_title">曲线统计图</div>
              <div class="close" @click="popoutClose('QX')"></div>
              <chart></chart>
            </div>
        <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> -->
          <weather></weather>
        </div>
        <SZSZ v-show="checkMenuFlag == 'e2'"></SZSZ>
            <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> -->
              <weather></weather>
            </div>
            <SZSZ v-show="checkMenuFlag == 'e2'"></SZSZ>
        <BJlist v-if="checkMenuFlag == 'c3'"></BJlist>
        <YJlist v-if="checkMenuFlag == 'c2'"></YJlist>
        <gjfx v-if="checkMenuFlag == 'f1'"></gjfx>
        <zdmax v-if="checkMenuFlag == 'f1'"></zdmax>
            <BJlist v-if="checkMenuFlag == 'c3'"></BJlist>
            <YJlist v-if="checkMenuFlag == 'c2'"></YJlist>
            <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-show="checkMenuFlag == 'e3'">
    <div
      class="video_box"
      v-if="checkMenuFlag == 'e3' || checkMenuFlag == 'e5'"
    >
      <video
        :src="videoUrl"
        controls="controls"
@@ -74,6 +95,7 @@
import menus from "@/views/menus.vue";
//智能报告
import BGDC from "@/components/BGDC.vue";
import reportList from "@/components/reportList.vue";
//溯源分析
import SYFX from "@/components/SYFX.vue";
import SYFK from "@/components/SYFK.vue";
@@ -91,11 +113,14 @@
//预警报警
import BJlist from "@/components/BJlist.vue";
import YJlist from "@/components/YJlist.vue";
import PreCusPage from "@/components/PreCusPage.vue";
//点位列表
import poiList from "@/components/poiList.vue";
//统计图
import gjfx from "@/components/xgzs/gjfx.vue";
import zdmax from "@/components/xgzs/zdmax.vue";
import dayzdmax from "@/components/xgzs/dayzdmax.vue";
import weekzdmax from "@/components/xgzs/weekzdmax.vue";
import {
  queryWeatherList,
  queryLocaltion,
@@ -120,6 +145,10 @@
    poiList,
    gjfx,
    zdmax,
    reportList,
    dayzdmax,
    weekzdmax,
    PreCusPage
  },
  setup(props, { emit }) {
    const store = useStore();
@@ -193,6 +222,29 @@
      } else {
        checkMenuFlag.value = null;
      }
      if (res.id == "e4") {
        window.open(
          `${
            window.location.href.split("#")[0]
          }config/燕山石化系统功能操作文档.pdf`
        );
      }
      if (res.id == "e3") {
        videoUrl.value = window.location.href.split("#")[0] + videoJS;
      }
      if (res.id == "e5") {
        videoUrl.value = window.location.href.split("#")[0] + SMvideoJS;
      }
      sgworld.Core.postMessage({
        func_name: "SetSmallWind",
        lon: "",
        lat: "",
        alt: 300,
        Scope: "",
        Direction: "",
        Hidden: "true",
      });
    };
    const toggleFK = (params) => {
@@ -297,6 +349,11 @@
    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;