代码更新

surprise

2024-01-10 2a960cd2c5b88b143cea4acfaeafb96daef0f29b

 src/components/menu/menulist.vue

@@ -1,23 +1,10 @@
<template>
  <div>
    <div
      @click="showMenuList"
      :class="{ menulist: !panelActive, menulist_active: panelActive }"
      class="menuliststyle"
    >
      <img
        class="menuchangebtn"
        v-show="!panelActive"
        title="菜单"
        :src="switchMenuImage"
      />
    <div @click="showMenuList" :class="{ menulist: !panelActive, menulist_active: panelActive }" class="menuliststyle">
      <img class="menuchangebtn" v-show="!panelActive" title="菜单" :src="switchMenuImage" />
      <div class="menubtnlist" v-show="panelActive">
        <div class="menubtn" @click="showSceneCard()">
          <img
            class="bhImg"
            title="场景数据"
            src="@/assets/img/left/specialeffect4.png"
          />
          <img class="bhImg" title="场景数据" src="@/assets/img/left/specialeffect4.png" />
          <span>场景</span>
        </div>
        <div class="menubtn" @click="setMenuTool(1)">
@@ -32,69 +19,46 @@
          <img class="bhImg" title="漫游" src="@/assets/img/right/my11.png" />
          <span>漫游</span>
        </div>
       <div class="menubtn" @click="showModelCard()">
          <img
            class="bhImg"
            title="专题"
            src="@/assets/img/left/specialanalyse4.png"
          />
        <div class="menubtn" @click="showModelCard()">
          <img class="bhImg" title="专题" src="@/assets/img/left/specialanalyse4.png" />
          <span>模型</span>
        </div>

        <div class="menubtn" @click="setMenuGrid()">
          <img class="bhImg" title="格网" src="@/assets/img/right/cx-s.png" />
          <span>格网</span>
        </div>  
        
        <div class="menubtn" @click="setMenuQuery()">
          <img class="bhImg" title="查询" src="@/assets/img/right/queyr.png" />
          <span>查询</span>
        </div>
        <div class="menubtn" @click="setImgUpDate()">
          <input id="imgs" type="file" multiple="multiple" v-show="false" @change="setImgUpload" accept=".jpg,.png" />
          <img class="bhImg" title="上传" src="@/assets/img/right/upload.png" />
          <span>上传</span>
        </div>
        <div class="menubtn" @click="setMenuTool(5)">
          <img class="bhImg" title="分析" src="@/assets/img/right/cx-s.png" />
          <span>分析</span>
        </div>
        <div class="menubtn" @click="setMenuTool(6)">
          <img
            class="bhImg"
            title="特效"
            src="@/assets/img/left/leftnav2.png"
          />
          <img class="bhImg" title="特效" src="@/assets/img/left/leftnav2.png" />
          <span>特效</span>
        </div>
        <div class="menubtn" @click="showSettingCard()">
          <img
            class="bhImg"
            title="设置"
            src="@/assets/img/left/specialeffect4.png"
          />
          <img class="bhImg" title="设置" src="@/assets/img/left/specialeffect4.png" />
          <span>设置</span>
        </div>
    

      </div>
    </div>
    <div class="menutools">
      <plotting
        class="menutool"
        :class="{ menutoolhide: !(!panelActive && selectIndex == 1) }"
        ref="plotting"
      />
      <measure
        class="menutool"
        :class="{ menutoolhide: !(!panelActive && selectIndex == 2) }"
        ref="measure"
      />
      <roam
        class="menutool"
        :class="{ menutoolhide: !(!panelActive && selectIndex == 3) }"
        ref="roam"
      />
      <special
        class="menutool"
        :class="{ menutoolhide: !(!panelActive && selectIndex == 4) }"
        ref="special"
      />
      <analysis
        class="menutool"
        :class="{ menutoolhide: !(!panelActive && selectIndex == 5) }"
        ref="analysis"
      />
      <effects
        class="menutool"
        :class="{ menutoolhide: !(!panelActive && selectIndex == 6) }"
        ref="effects"
      />
      <plotting class="menutool" :class="{ menutoolhide: !(!panelActive && selectIndex == 1) }" ref="plotting" />
      <measure class="menutool" :class="{ menutoolhide: !(!panelActive && selectIndex == 2) }" ref="measure" />
      <roam class="menutool" :class="{ menutoolhide: !(!panelActive && selectIndex == 3) }" ref="roam" />
      <special class="menutool" :class="{ menutoolhide: !(!panelActive && selectIndex == 4) }" ref="special" />
      <analysis class="menutool" :class="{ menutoolhide: !(!panelActive && selectIndex == 5) }" ref="analysis" />
      <effects class="menutool" :class="{ menutoolhide: !(!panelActive && selectIndex == 6) }" ref="effects" />
    </div>
  </div>
</template>
@@ -119,8 +83,7 @@
  width: 0px !important;
}

.menutools {
}
.menutools {}

.menuchangebtn {
  position: absolute;
@@ -149,7 +112,7 @@
  margin: 5px;
  cursor: pointer;
  /* border: 1px solid #999; */
    background-image: url("~@/assets/img/new/menuBg.png");
  background-image: url("~@/assets/img/new/menuBg.png");
  background-size: contain;
  border-radius: 5px;
  overflow: hidden;
@@ -205,16 +168,16 @@
  border-radius: 30px;
  cursor: pointer;
}

.menulist:hover {
  background-image: url("~@/assets/img/new/rightCircle-y.png");
}

.menulist_active {
  border-image-source: radial-gradient(
    59% 79%,
    transparent 0px,
    transparent 100%,
    cyan 100%
  );
  border-image-source: radial-gradient(59% 79%,
      transparent 0px,
      transparent 100%,
      cyan 100%);
  border-image-slice: 1;
  border-width: 1px;
  border-style: solid;
@@ -223,7 +186,7 @@
  background-size: 100% 100%;
  background-repeat: no-repeat;
  width: 360px;
  height: 200px;
  height: 230px;
  /* border-radius: 5px 5px 5px 30px; */
}
</style>
@@ -245,6 +208,10 @@
import zt from "@/assets/img/left/specialanalyse4.png";
import fx from "@/assets/img/right/cx-s.png";
import tx from "@/assets/img/left/leftnav2.png";
 
import { Img_Upload } from '@/api/api.js'
import Bus from "../tools/Bus";
import drawGrid from "../../assets/js/Layer/drawGrid";
export default {
  name: "menulist",
  components: {
@@ -292,12 +259,38 @@
    showSettingCard() {
      this.$store.commit("showSetBox", true);
    },
    showModelCard(){
    showModelCard() {
      this.$store.commit("showModelBox", true);
    },
    showSceneCard(){
    showSceneCard() {
      this.$store.commit("showSceneBox", "");
    },
    setMenuQuery() {
      this.$store.commit("setMenuQuery", true)
    },
    setMenuGrid() {
      drawGrid.drawRect();
    },
    setImgUpDate() {
      // this.$store.commit("setImgUpdate",true)

      $("#imgs").click();
    },
    async setImgUpload() {
      var formData = new FormData();
      var fs = document.getElementById("imgs");
      for (var i = 0, c = fs.files.length; i < c; i++) {
        formData.append(fs.files[i].name, fs.files[i]); // name, file
      }
      const data = await Img_Upload(formData)
      if (data.status == 200) {
        this.$message({
          message: "图片上传成功",
          type: "success",
        });
        Bus.$emit("reastLayer",true);
      }
    },
    closeAllHighLight(type) {
      // !(type == "plotting") && this.$refs.plotting.clearHighLight();
      // !(type == "roam") && this.$refs.roam.clearActive();