vue ureport

1.springboot后端整合不用说
<template>
  <t-drawer class="r-dw" :visible="visible"  :fullscreen="fullscreen" :switchFullscreen="fullscreen" @close="() => { $emit('cancel') }">
    <div class="r-content">
      <iframe :src="src" frameborder="no" style="width: 100%;height: 100%" scrolling="auto" />
    </div>
  </t-drawer>
</template>
<script>
  import {
      ACCESS_TOKEN } from '@/store/mutation-types'
  import Vue from 'vue'
  import {
      baseUrl } from '@/services/baseUrl.js'
  export default {
     
    data () {
     
      return {
     
        src: '',
        fullscreen:true,
        height: document.documentElement.clientHeight - 94.5 + 'px'
      }
    },
    props:{
     
      visible:{
     
        type:Boolean
      },
      loading:{
     
        type:Boolean
      },
    },
    mounted: function () {
     
      console.log(111111)
      const that = this
      that.getToken()
      window.onresize = function temp () {
     
        that.height = document.documentElement.clientHeight - 94.5 + 'px'
      }
    },
    methods: {
     
      getToken () {
     
        this.src = baseUrl+'/report/ureport/designer?token=' + Vue.ls.get(ACCESS_TOKEN)
      }
    }
  }
</script>
<style>
  .r-content{
     
    height: calc(100vh - 50px);
  }
  .r-dw .ant-drawer-close{
     
    top: -10px !important;
    width: 48px !important;
    height: 48px !important;
  }
</style>

3. baseUrl 就是访问设计界面的ip+端口
4. 因为我这边单独访问报表项目的加了个前缀 /report。你们没加前缀是可以去掉的
5. 最后面是拼接了token

你可能感兴趣的:(ureport)