数字人更新

lixuliang

2024-05-08 10ecfd0b60442d209d1ab4b749580ffb638d1992

 src/components/index.vue

@@ -1,5 +1,20 @@
<template>
  <div class="mapViewer">
    <div class="cacheImage">
      <img
        style="display: none"
        src="@assets/img/new/rightCircle-y.png"
        alt=""
      />
      <img
        style="display: none"
        src="@assets/img/new/leftCircle-y.png"
        alt=""
      />
      <img style="display: none" src="@assets/img/new/treeClose-y.png" alt="" />
      <img style="display: none" src="@assets/img/new/h1.png" alt="" />
    </div>

    <div class="tooltip" :class="{ tooltiphide: !tooltipShow }">
      <span>
        {{ tooltipInfo }}
@@ -11,19 +26,45 @@
          <img class="searchBtn" src="@/assets/img/right/closeinput1.png" />
        </el-button>
      </div>
      <History />
    </div>
    <left-menu></left-menu>

    <viewer1
      class="mapViewer"
      :key="switchKey"
      v-if="viewer1Show"
      :style="viewer1Style"
      @mousemove.native="viewer1MouseMove"
    />
    <viewer
      class="mapViewer"
      ref="mapViewer"
      :style="viewerStyle"
      @mousemove.native="viewerMouseMove"
    />
    <div v-if="isShowDigitalPerson" class="digital_Box">
      <div
        class="textBtn"
        @click="showTextArea"
        :class="{ active: isShowTextArea }"
      >
        <img class="legendImg" src="@/assets/img/new/文本输入.png" />
      </div>
      <iframe
        id="digital_page"
        allow="microphone;"
        :src="digitalHuman"
        :height="digitalSize.height"
        :width="digitalSize.width"
        frameborder="no"
        border="0"
        marginwidth="0"
        marginheight="0"
        scrolling="no"
        allowtransparency="yes"
      ></iframe>
    </div>

    <div
      class="controlPanel"
      :style="{
@@ -48,7 +89,8 @@
      <right ref="Right" />
      <leftpanel ref="Left" />
      <menupanel />
      <bottommenu />
      <bottommenu ref="bottommenu" />
      <signalling v-if="signallingShow"></signalling>
      <setting v-if="showSetting" />
      <qycharts v-if="$store.state.qyEchartsShow" />
    </div>
@@ -66,10 +108,12 @@
import qycharts from "@/components/bottom/qycharts";
import menupanel from "@/components/menu/index";
import setting from "@/components/menu/tools/setting";

import signalling from "@/components/menu/signalling";
import bottommenu from "@/components/menu/bottom-menu";
import { mapState, mapMutations } from "vuex";
import History from "@/components/map/history.vue";
import vueEvents from "@/utils/vueEvent.js";
import leftMenu from "@/components/menu/leftMenu.vue";
import mapMsg from "@/assets/js/mapMsg";

export default {
  name: "index",
@@ -85,6 +129,8 @@
    setting,
    qycharts,
    History,
    signalling,
    leftMenu,
  },
  data() {
    return {
@@ -98,22 +144,42 @@
      offset: "0%",
      tooltipInfo: "请稍后。。。",
      tooltipShow: false,
      signallingShow: false,
      switchKey: 0,
      isShowTA: false,
      digitalHuman: null,
      digitalSize: {},
      // viewer1Show: false,
    };
  },
  mounted() {
    this.digitalHuman = window.digitalHumanURL;
    this.digitalSize = window.digitalSize;
    let size = this.detectZoom();
    this.scale = (100 / size).toFixed(2);
    this.offset = "-" + ((size - 100) / 2).toFixed(2) + "%";
    this.size = size + "%";
    vueEvents.$on("queryLayer", (res) => {
      this.queryShow = res;
    });
  },
  computed: {
    ...mapState(["viewer1Show", "yqfk"]),
    ...mapState(["viewer1Show", "isLand", "yqfk"]),
    showSetting() {
      return this.$store.state.showSetting;
    },
    isShowHistory() {
      return this.$store.state.isShowHistory;
      F;
    },
    isShowDigitalPerson() {
      return this.$store.state.isShowDigitalPerson;
    },
    isShowTextArea() {
      if (this.$store.state.isShowTextArea) {
        this.input = "";
      }
      return this.$store.state.isShowTextArea;
    },
  },
  watch: {
@@ -131,12 +197,20 @@
  },
  methods: {
    ...mapMutations(["setLayerTreeTwoScreen"]),
    showTextArea() {
      this.$store.commit("showTextArea", !this.$store.state.isShowTextArea);
    },

    setMessgae(show, msg) {
      this.tooltipShow = show;
      this.tooltipInfo = msg ? msg : "";
    },

    changePwd() {
      console.log(111);
    },
    changeMode(mode) {
      this.$refs.mapViewer.changeMode(mode);
    },
    detectZoom() {
      var ratio = 0,
@@ -236,17 +310,25 @@
      this.$store.commit("showHistory", false);
    },
  },
  beforeDestroy() {
    this.$refs.bottommenu.switchMenu(0);
  },
};
</script>
<style scoped>
.cacheImage {
  display: none !important;
}
.mapViewer {
  height: 100%;
}

.userinfo {
  position: absolute;
  z-index: 20;
  top: 10px;
}

#headlog {
  width: 965px;
  height: 70px;
@@ -255,6 +337,7 @@
  top: 0;
  transform: translate(-50%, 0);
}

#bottomBar {
  width: 1357px;
  height: 52px;
@@ -263,6 +346,44 @@
  bottom: 0;
  transform: translate(-50%, 0);
}
.digital_Box {
  position: absolute;
  left: 0;
  bottom: 120px;
  z-index: 10;
}
.textBtn {
  background-image: url("~@/assets/img/new/leftCircle.png");
  background-size: 100%;
  background-color: transparent;
  width: 35px;
  height: 35px;
  position: absolute;
  left: 20px;
  cursor: pointer;
}
.textBtn:hover {
  background-image: url("~@/assets/img/new/leftCircle-y.png");
}
.active {
  background-image: url("~@/assets/img/new/leftCircle-y.png");
}
.textBtn img {
  /* margin-top: 14px;
  margin-left: 14px; */
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 20px;
}
#digital_page {
  /* position: absolute;
  left: 0;
  bottom: 120px;
  z-index: 10; */
}

.trigger {
  pointer-events: all;
}
@@ -304,6 +425,7 @@
  border-radius: 10px;
  padding: 10px 30px;
}

.hisbox {
  position: absolute;
  z-index: 10000002;
@@ -311,11 +433,13 @@
  height: 100%;
  background-color: #fff;
}

.btnbox {
  position: absolute;
  z-index: 100000003;
  right: 30px;
}

.btnbox .el-button {
  padding: 0 !important;
  font-size: 24px;