| <!-- |
| ~ Licensed to the Apache Software Foundation (ASF) under one or more |
| ~ contributor license agreements. See the NOTICE file distributed with |
| ~ this work for additional information regarding copyright ownership. |
| ~ The ASF licenses this file to You under the Apache License, Version 2.0 |
| ~ (the "License"); you may not use this file except in compliance with |
| ~ the License. You may obtain a copy of the License at |
| ~ |
| ~ http://www.apache.org/licenses/LICENSE-2.0 |
| ~ |
| ~ Unless required by applicable law or agreed to in writing, software |
| ~ distributed under the License is distributed on an "AS IS" BASIS, |
| ~ WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. |
| ~ See the License for the specific language governing permissions and |
| ~ limitations under the License. |
| --> |
| |
| <template> |
| <div class="visual-analysis" v-if="project"> |
| <iframe id="iframe" :src="visualSrc" frameborder="0"></iframe> |
| <Modal |
| v-model="project.show" |
| :title="$t('message.common.saveToWidget')" |
| @on-ok="confirm" |
| @on-cancel="cancel" |
| :ok-text="$t('message.common.ok')" |
| > |
| <Select v-model="project.id"> |
| <Option |
| v-for="item in apps" |
| :value="item.id" |
| :key="item.id" |
| style="width: 200px;" |
| >{{ item.name }}</Option> |
| </Select> |
| </Modal> |
| </div> |
| </template> |
| <script> |
| import api from "@/common/service/api"; |
| import mixin from '@/common/service/mixin'; |
| export default { |
| props: { |
| visualParams: { |
| type: Object, |
| required: true |
| } |
| }, |
| mixins: [mixin], |
| data() { |
| let { projectId } = this.visualParams; |
| return { |
| project: { |
| show: false, |
| id: projectId, |
| data: {} |
| }, |
| projectid: null, |
| apps: [] |
| }; |
| }, |
| computed: { |
| visualSrc() { |
| let { json } = this.visualParams; |
| const dwraisUrl = this.getVsBiUrl(); |
| const srcPre = `${dwraisUrl}/dss/visualis/#/project/${this.projectid}/widget`; |
| let viewJson = { |
| ...json, |
| params: {} |
| }; |
| viewJson = JSON.stringify(viewJson); |
| if (this.projectid) { |
| return json ? `${srcPre}/add?view=${viewJson}` : ""; |
| }else{ |
| return '' |
| } |
| } |
| }, |
| beforeDestroy() { |
| window.removeEventListener("message", this.fn, false); |
| }, |
| created() { |
| api.fetch("/visualis/project/default", "get").then(res => { |
| this.projectid = res.project.id; |
| }); |
| }, |
| mounted() { |
| this.getproject(); |
| this.hiddenArrow(); |
| this.fn = ev => { |
| if (typeof ev.data === "string") { |
| try { |
| let data = JSON.parse(ev.data); |
| if (data.type === "saveWidget") { |
| this.queryApplication(); |
| this.project.show = true; |
| delete data.type; |
| this.project.data = data; |
| } |
| } catch (error) { |
| window.console.error(error); |
| } |
| } |
| }; |
| window.addEventListener("message", this.fn, false); |
| }, |
| methods: { |
| getproject() {}, |
| async queryApplication() { |
| let data = await api.fetch("/application/list"); |
| this.apps = data.applications; |
| }, |
| saveWidgetToDws(data) { |
| data = Object.assign(data, { |
| projectId: this.project.id |
| }); |
| const vsBiUrl = this.getVsBiUrl(); |
| api.fetch(`${vsBiUrl}/api/rest_j/v1/visualis/widgets`, data).then(() => { |
| this.$Message.success(this.$t("message.common.saveSuccess")); |
| }); |
| }, |
| confirm() { |
| this.saveWidgetToDws(this.project.data); |
| }, |
| cancel() {}, |
| hiddenArrow() { |
| let iframe = document.getElementById("iframe"); |
| let iwindow = iframe.contentWindow; |
| iwindow.onload = function() { |
| let dom = iwindow.document.querySelector(".anticon.anticon-left"); |
| dom.style.display = "none"; |
| }; |
| } |
| } |
| }; |
| </script> |
| <style lang="scss" scoped> |
| .visual-analysis { |
| overflow-y: scroll; |
| iframe { |
| width: 100%; |
| height: 100%; |
| min-height: 400px; |
| } |
| } |
| </style> |
