| | |
| | | :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="{ |
| | |
| | | import { mapState, mapMutations } from "vuex"; |
| | | import vueEvents from "@/utils/vueEvent.js"; |
| | | import leftMenu from "@/components/menu/leftMenu.vue"; |
| | | import mapMsg from "@/assets/js/mapMsg"; |
| | | |
| | | export default { |
| | | name: "index", |
| | |
| | | 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) + "%"; |
| | |
| | | }, |
| | | 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: { |
| | |
| | | }, |
| | | methods: { |
| | | ...mapMutations(["setLayerTreeTwoScreen"]), |
| | | showTextArea() { |
| | | this.$store.commit("showTextArea", !this.$store.state.isShowTextArea); |
| | | }, |
| | | |
| | | setMessgae(show, msg) { |
| | | this.tooltipShow = show; |
| | | this.tooltipInfo = msg ? msg : ""; |
| | |
| | | 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; |