<template>
<div id="designer-host"></div>
</template>
<script lang="ts" setup>
import { onMounted, ref, getCurrentInstance, reactive, computed, unref, toRefs, h, watch, toRaw } from 'vue';
import { Designer as ReportDesigner } from '@grapecity/activereports/reportdesigner';
import '@grapecity/activereports-localization/dist/designer/zh-locale'; // 设计器汉化
import '@grapecity/activereports-localization'; //预览汉化
let resolveFunc = null;
let designer = null;
onMounted(() => {
designer = new ReportDesigner('#designer-host', { language: 'zh' });
});
</script>
<style lang="less">
@import '@grapecity/activereports/styles/ar-js-ui.css';
@import '@grapecity/activereports/styles/ar-js-viewer.css';
@import '@grapecity/activereports/styles/ar-js-designer.css';
#designer-host {
width: 100%;
height: 100%;
}
</style>
以上是设计页面的内容,打开后在线设计器已经出现,但是每个组件都无法拖动进行设计。
|