surprise
2024-04-18 38efe35fc499fcb4b828acca1d7bda5d051ace6f
src/components/props/btns.vue
@@ -2,62 +2,57 @@
  <div id="moved">
    <div class="containerBtn">
      <div>
        <span
          v-show="boxindex == 1"
          v-for="(item, index) in oneindex"
          :key="index"
          class="ischoose"
          @click="choosebtn(index)"
        >
          <span class="icon" :style="{ background: `url(${item.src})` }"></span>
        <span v-show="boxindex == 1"
              v-for="(item, index) in oneindex"
              :key="index"
              class="ischoose"
              @click="choosebtn(index)">
          <span class="icon"
                :style="{ background: `url(${item.src})` }"></span>
          {{ item.name }}
        </span>
      </div>
      <div>
        <span
          v-show="boxindex == 2"
          v-for="(item, index) in twoindex"
          :key="index"
          class="ischoose"
          @click="choosebtn1(index)"
        >
          <span class="icon" :style="{ background: `url(${item.src})` }"></span>
        <span v-show="boxindex == 2"
              v-for="(item, index) in twoindex"
              :key="index"
              class="ischoose"
              @click="choosebtn1(index)">
          <span class="icon"
                :style="{ background: `url(${item.src})` }"></span>
          {{ item.name }}
        </span>
      </div>
      <div>
        <span
          v-show="boxindex == 3"
          v-for="(item, index) in threeindex"
          :key="index"
          class="ischoose"
          @click="choosebtn2(index)"
        >
          <span class="icon" :style="{ background: `url(${item.src})` }"></span>
        <span v-show="boxindex == 3"
              v-for="(item, index) in threeindex"
              :key="index"
              class="ischoose"
              @click="choosebtn2(index)">
          <span class="icon"
                :style="{ background: `url(${item.src})` }"></span>
          {{ item.name }}
        </span>
      </div>
      <div>
        <span
          v-show="boxindex == 4"
          v-for="(item, index) in fourindex"
          :key="index"
          class="ischoose"
          @click="choosebtn3(index)"
        >
          <span class="icon" :style="{ background: `url(${item.src})` }"></span>
        <span v-show="boxindex == 4"
              v-for="(item, index) in fourindex"
              :key="index"
              class="ischoose"
              @click="choosebtn3(index)">
          <span class="icon"
                :style="{ background: `url(${item.src})` }"></span>
          {{ item.name }}
        </span>
      </div>
      <div>
        <span
          v-show="boxindex == 5"
          v-for="(item, index) in fiveindex"
          :key="index"
          class="ischoose"
          @click="choosebtn4(index)"
        >
          <span class="icon" :style="{ background: `url(${item.src})` }"></span>
        <span v-show="boxindex == 5"
              v-for="(item, index) in fiveindex"
              :key="index"
              class="ischoose"
              @click="choosebtn4(index)">
          <span class="icon"
                :style="{ background: `url(${item.src})` }"></span>
          {{ item.name }}
        </span>
      </div>
@@ -67,7 +62,7 @@
<script>
import bus from "../../utils/bus";
export default {
  data() {
  data () {
    return {
      oneindex: [
        {
@@ -179,63 +174,64 @@
    };
  },
  methods: {
    choosebtn(index) {
      if (index === 2) {
        this.nowchoose = 1;
        bus.$emit("showdio", this.nowchoose);
    choosebtn (index) {
      alert(index)
      if(index===2) {
        this.nowchoose=1;
        bus.$emit("showdio",this.nowchoose);
      }
      if (index === 0) {
      if(index===0) {
        // 电磁环境态势
        this.nowchoose = 2;
        bus.$emit("showdio", this.nowchoose);
        this.nowchoose=2;
        bus.$emit("showdio",this.nowchoose);
      }
      // if (index === 1 ) {
      //     bus.$emit("openplay", true)
      // }
      //态势图动态播放
    },
    choosebtn1(index) {
      if (index === 1) {
        this.nowchoose = 3;
        bus.$emit("showdio", this.nowchoose);
    choosebtn1 (index) {
      if(index===1) {
        this.nowchoose=3;
        bus.$emit("showdio",this.nowchoose);
      }
      //空闲频率资源分析
      if (index === 4) {
        this.nowchoose = "1-4";
        bus.$emit("showdio", this.nowchoose);
      if(index===4) {
        this.nowchoose="1-4";
        bus.$emit("showdio",this.nowchoose);
      }
    },
    choosebtn2(index) {
      if (index === 0) {
        this.nowchoose = 5;
        bus.$emit("showdio", this.nowchoose);
    choosebtn2 (index) {
      if(index===0) {
        this.nowchoose=5;
        bus.$emit("showdio",this.nowchoose);
      }
       if (index === 1) {
        this.nowchoose = "1-2";
        bus.$emit("showdio", this.nowchoose);
      if(index===1) {
        this.nowchoose="1-2";
        bus.$emit("showdio",this.nowchoose);
      }
      if (index === 2) {
        this.nowchoose = 4;
        bus.$emit("showdio", this.nowchoose);
      if(index===2) {
        this.nowchoose=4;
        bus.$emit("showdio",this.nowchoose);
      }
      // 监测网覆盖能力评估
      if (index === 3) {
        this.nowchoose = 6;
        bus.$emit("showdio", this.nowchoose);
      if(index===3) {
        this.nowchoose=6;
        bus.$emit("showdio",this.nowchoose);
      }
    },
    choosebtn3(index) {},
    choosebtn4(index) {},
    choosebtn3 (index) { },
    choosebtn4 (index) { },
    //边框的显示隐藏
  },
  mounted() {
    bus.$on("showindex", (e) => {
      if (this.boxindex == e) {
        this.boxindex = 0;
  mounted () {
    bus.$on("showindex",(e) => {
      if(this.boxindex==e) {
        this.boxindex=0;
      } else {
        this.boxindex = e;
        this.boxindex=e;
      }
    });
  },