dvcp_v2_webapp/packages/bigscreen/designer/preview.vue

<template>
  <section class="preview">
    <ai-dv-wrapper :views="[{label: '返回'}]" :theme="config.theme" @change="handleBack" v-if="screenId" :title="info.name" :background="bgImg" :titleSize="config.titleSize">
      <ai-dv-viewer :urlPrefix="urlPrefix" :instance="instance" :dict="dict" :id="screenId"/>
    </ai-dv-wrapper>
  </section>
</template>

<script>
import {mapActions} from "vuex"

export default {
  name: "preview",
  props: {
    instance: Function,
    dict: Object,
    permissions: Function,
    urlPrefix: {
      type: String,
      default: '/app'
    }
  },
  computed: {
    screenId: v => v.$route.query.id,
    bgImg: v => v.config.theme == 1 ? 'https://cdn.cunwuyun.cn/dvcp/dv/img/dj_bg.png' : (v.config.backgroundImage?.[0]?.url || "")
  },
  data() {
    return {
      info: {},
      config: {}
    }
  },
  methods: {
    ...mapActions(['closePage']),
    getDvData() {
      let {id} = this.$route.query
      this.instance.post(`/app/appdiylargescreen/queryLargeScreenDetailById?id=${id}`).then(res => {
        if (res?.data) {
          this.info = res.data
          this.config = JSON.parse(res.data.config).dashboard
        }
      })
    },
    handleBack() {
      this.$router.back()
      this.closePage()
    }
  },
  created() {
    this.getDvData()
  }
}
</script>

<style lang="scss" scoped>
.preview {
}
</style>