lixuliang
2024-04-18 419ce8d31a69c59d5796567173c1f8dc438652fc
src/components/wggl/right/fwxq.vue
@@ -1,65 +1,87 @@
<template>
  <div>
    <div class="flytoBtns" v-if="showFly">
    <!-- <div class="flytoBtns" v-if="showFly">
      <span @click="tofly(true)">上海</span>
      <span @click="tofly(false)">广州</span>
    </div>
    </div> -->
    <div class="top">
      <div class="far">
        <span
          v-for="(item, index) in top2"
          :key="index"
          @mousemove="changebac(index)"
          @mouseout="returnbac(index)"
          @click="ishow(index)"
          :style="{ background: `url(${item.img})` }"
        ></span>
        <span v-for="(item, index) in top2"
              :key="index + '-top2'"
              @mousemove="changebac(index)"
              @mouseout="returnbac(index)"
              @click="ishow(index)"
              :style="{ background: `url(${item.img})` }"></span>
        <span v-for="(item, index) in bot1"
              :key="index + '-bot1'"
              @mousemove="changebac1(index)"
              @click="remove(index)"
              @mouseout="returnbac1(index)"
              :style="{ background: `url(${item.img})` }"></span>
      </div>
      <div class="far_2">
        <span @click="benear"></span>
        <span @click="befar"></span>
      </div>
    </div>
    <div class="bot" v-if="showtool" id="move3">
    <div class="bot"
         v-if="showtool"
         id="move3">
      <div class="top1">
        <span class="botcon">
          <span class="icon"></span>
          <span class="text">态势对比</span>
        </span>
        <span class="close" @click="close">x</span>
        <span class="close"
              @click="close">x</span>
      </div>
      <div class="next">
        <el-form ref="form" :rules="rules" :model="form" label-width="250px">
          <el-form-item label="区域" prop="name">
            <el-select v-model="form.name" placeholder="请选择活动区域">
              <el-option label="闵行区" value="shanghai"></el-option>
        <el-form ref="form"
                 :rules="rules"
                 :model="form"
                 label-width="250px">
          <el-form-item label="区域"
                        prop="name">
            <el-select v-model="form.name"
                       placeholder="请选择活动区域">
              <el-option label="闵行区"
                         value="shanghai"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="起始时间" prop="date1">
            <el-date-picker
              v-model="form.date1"
              :picker-options="pickerOptions"
              format="yyyy-MM-dd"
              placeholder="选择日期"
              type="date"
              value-format="yyyyMMddHHmmss"
            ></el-date-picker>
          <el-form-item label="起始时间"
                        prop="date1">
            <el-date-picker v-model="form.date1"
                            :picker-options="pickerOptions"
                            format="yyyy-MM-dd"
                            placeholder="选择日期"
                            type="date"
                            value-format="yyyyMMddHHmmss"></el-date-picker>
          </el-form-item>
          <el-form-item label="结束时间" prop="date2">
            <el-date-picker
              v-model="form.date2"
              :picker-options="pickerOptions"
              format="yyyy-MM-dd"
              placeholder="选择日期"
              type="date"
              value-format="yyyyMMddHHmmss"
            ></el-date-picker>
          <el-form-item label="结束时间"
                        prop="date2">
            <el-date-picker v-model="form.date2"
                            :picker-options="pickerOptions"
                            format="yyyy-MM-dd"
                            placeholder="选择日期"
                            type="date"
                            value-format="yyyyMMddHHmmss"></el-date-picker>
          </el-form-item>
          <el-form-item label="分析类型" prop="type">
            <el-select v-model="form.type" placeholder="请选择活动区域">
              <el-option label="频点" value="shanghai"></el-option>
              <el-option label="频段" value="beijing"></el-option>
          <el-form-item label="分析类型"
                        prop="type">
            <el-select v-model="form.type"
                       placeholder="请选择活动区域">
              <el-option label="频点"
                         value="shanghai"></el-option>
              <el-option label="频段"
                         value="beijing"></el-option>
            </el-select>
          </el-form-item>
          <el-form-item label="无线电业务" prop="resource">
            <el-select v-model="form.resource" placeholder="请选择活动区域">
              <el-option label="电视(74MHz~87MHz)" value="shanghai"></el-option>
          <el-form-item label="无线电业务"
                        prop="resource">
            <el-select v-model="form.resource"
                       placeholder="请选择活动区域">
              <el-option label="电视(74MHz~87MHz)"
                         value="shanghai"></el-option>
            </el-select>
          </el-form-item>
        </el-form>
@@ -76,14 +98,19 @@
<script>
import bus from "../../../utils/bus";
import axios from "axios";
import { oneStep, twoStep } from "../../../api/http";
import { oneStep,twoStep } from "../../../api/http";
export default {
  data() {
  data () {
    return {
      top2: [
        { img: require("@/assets/image/test/组 166.png") },
        { img: require("@/assets/image/test/组 167.png") },
        { img: require("@/assets/image/test/组 168.png") },
      ],
      bot1: [
        { img: require("@/assets/image/test/组 163.png") },
        { img: require("@/assets/image/test/组 164.png") },
        { img: require("@/assets/image/test/组 165.png") },
      ],
      form: {
        name: "",
@@ -97,7 +124,7 @@
      freqStart: 87000000,
      freqEnd: 108000000,
      rules: {
        name: [{ required: true, message: "请选择区域", trigger: "change" }],
        name: [{ required: true,message: "请选择区域",trigger: "change" }],
        date1: [
          {
            type: "date",
@@ -123,7 +150,7 @@
          },
        ],
        resource: [
          { required: true, message: "请选择无线电业务", trigger: "change" },
          { required: true,message: "请选择无线电业务",trigger: "change" },
        ],
      },
      pickerOptions: {},
@@ -134,14 +161,38 @@
      scale: 2.13,
    };
  },
  mounted() {
    bus.$on("openCheak", (e) => {
      this.showtool = e;
  mounted () {
    bus.$on("openCheak",(e) => {
      this.showtool=e;
    });
  },
  methods: {
    tofly(data) {
      if (data) {
    remove (index) {
      if(index==0) {
        var tlobj={
          value: false,
          value1: true,
          value2: false,
          show: true,
        };
        bus.$emit("ishowMilitaryPlot",tlobj);
        // bus.$emit("clearEve",true);
        // window.FieldIntensity&&window.FieldIntensity.deleteObject();
        // window.imageidXT&&window.Viewer.entities.removeById(window.imageidXT);
      }
      if(index==1) {
        window.createTool=true;
      }
    },
    benear () {
      $(".navigation-control")[0].click();
    },
    befar () {
      $(".navigation-control-last")[0].click();
    },
    tofly (data) {
      if(data) {
        //上海
        window.Viewer.camera.flyTo({
          destination: Cesium.Cartesian3.fromDegrees(
@@ -156,11 +207,11 @@
          },
        });
      } else {
        let guanzhou = {
        let guanzhou={
          fromdate: new Date("2019-10-08"),
          todate: new Date("2019-10-16"),
        };
        bus.$emit("guanzhou", guanzhou);
        bus.$emit("guanzhou",guanzhou);
        window.Viewer.camera.flyTo({
          destination: Cesium.Cartesian3.fromDegrees(
            113.29503528791071,
@@ -175,30 +226,46 @@
        });
      }
    },
    changebac(index) {
      let movein = [
    changebac (index) {
      let movein=[
        { img: require("@/assets/image/change/组179.png") },
        { img: require("@/assets/image/change/组180.png") },
        { img: require("@/assets/image/change/组181.png") },
      ];
      this.$set(this.top2, index, movein[index]);
      this.$set(this.top2,index,movein[index]);
    },
    returnbac(index) {
      let data = [
    returnbac (index) {
      let data=[
        { img: require("@/assets/image/test/组 166.png") },
        { img: require("@/assets/image/test/组 167.png") },
        { img: require("@/assets/image/test/组 168.png") },
      ];
      this.$set(this.top2, index, data[index]);
      this.$set(this.top2,index,data[index]);
    },
    close() {
      this.showtool = false;
    changebac1 (index) {
      let movein=[
        { img: require("@/assets/image/change/组172.png") },
        { img: require("@/assets/image/change/组173.png") },
        { img: require("@/assets/image/change/组174.png") },
      ];
      this.$set(this.bot1,index,movein[index]);
    },
    clear() {
      this.form = [];
    returnbac1 (index) {
      let movein=[
        { img: require("@/assets/image/test/组 163.png") },
        { img: require("@/assets/image/test/组 164.png") },
        { img: require("@/assets/image/test/组 165.png") },
      ];
      this.$set(this.bot1,index,movein[index]);
    },
    showpic() {
      let data = {
    close () {
      this.showtool=false;
    },
    clear () {
      this.form=[];
    },
    showpic () {
      let data={
        startTime: "20160615000000",
        endTime: 20160624300000,
        freqStart: 87000000,
@@ -209,7 +276,7 @@
        analysisType: 2,
      };
      oneStep(data).then((res) => {
        let data = {
        let data={
          file: "url",
          maxColor: "FF0000",
          minColor: "0000FF",
@@ -223,21 +290,23 @@
        });
      });
    },
    ishow(index) {
      if (index == 1) {
        bus.$emit("ishow", true);
    ishow (index) {
      if(index==1) {
        bus.$emit("ishow",true);
      }
      if (index == 0) {
        this.showFly = this.showFly ? false : true;
      if(index==0) {
        // this.showFly=this.showFly? false:true;
        window.open('http://221.224.53.36:8082/7S/Home')
      }
      if (index == 2) {
        var tlobj = {
      if(index==2) {
        var tlobj={
          value: false,
          value1: true,
          value2: false,
          show: true,
        };
        bus.$emit("ishowtuli", tlobj);
        bus.$emit("ishowtuli",tlobj);
      }
    },
  },
@@ -249,32 +318,64 @@
  cursor: move;
}
.top {
  width: 100px;
  height: 295px;
  transform: translateX(-103px);
  width: 700px;
  height: 100px;
  /* transform: translateX(-103px); */
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  margin-top: 60px;
}
.far {
  display: block;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  /* flex-direction: column; */
}
.far > span {
  display: block;
  width: 100%;
  height: 30%;
  width: calc(100% / 6);
  height: 100%;
  background-size: 100% 100% !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
}
.far_2 {
  width: calc(700px / 6);
  height: 200px;
  /* display: flex; */
  /* flex-direction: column; */
  position: absolute;
  /* background-color: #fff; */
  left: 705px;
}
.far_2 > span {
  display: block;
  width: 100%;
  height: 49%;
  cursor: pointer;
  background-size: 100% 100% !important;
  background-repeat: no-repeat !important;
  background-position: center !important;
}
.far_2 > span:nth-child(1) {
  background: url(../../../assets/image/test/+.png);
}
.far_2 > span:nth-child(1):hover {
  background: url(../../../assets/image/change/图层2.png);
}
.far_2 > span:nth-child(2) {
  background: url(../../../assets/image/test/-.png);
}
.far_2 > span:nth-child(2):hover {
  background: url(../../../assets/image/change/图层1.png);
}
.bot {
  width: 940px;
  height: 1200px;
  /* height: 1200px; */
  position: absolute;
  transform: translate(-915px, 200px);
  background: url(~@/assets/image/test/22.png);