将 BPMNJS 全局引入,改成局部引入

This commit is contained in:
YunaiV 2023-04-15 18:52:35 +08:00
parent 06974ca3c0
commit d5b569eefa
7 changed files with 16 additions and 48 deletions

View File

@ -25,7 +25,7 @@ VITE_DROP_CONSOLE=false
VITE_SOURCEMAP=true
# 打包路径
VITE_BASE_PATH=/dist-test/
VITE_BASE_PATH=/
# 输出路径
VITE_OUT_DIR=dist-test

View File

@ -1,37 +1,11 @@
import { App } from 'vue'
import MyProcessDesigner from './designer'
import MyProcessPenal from './penal'
import MyProcessViewer from './designer/index2'
const components = [MyProcessDesigner, MyProcessPenal, MyProcessViewer]
import './theme/index.scss'
import 'bpmn-js/dist/assets/diagram-js.css'
import 'bpmn-js/dist/assets/bpmn-font/css/bpmn.css'
import 'bpmn-js/dist/assets/bpmn-font/css/bpmn-codes.css'
import 'bpmn-js/dist/assets/bpmn-font/css/bpmn-embedded.css'
// const install = function (Vue) {
// components.forEach(component => {
// Vue.component(component.name, component)
// })
// }
// if (typeof window !== "undefined" && window.Vue) {
// install(window.Vue)
// }
// components.forEach(component => {
// Vue.component(component.name, component)
// })
const componentss = {
install: (Vue: App): void => {
components.forEach((component) => {
Vue.component(component.name, component)
})
}
}
// let version = "0.0.1"
export const MyPD = (app) => {
// export default {
// app.use(version)
// app.use(install)
// app.use(MyProcessDesigner)
// app.use(MyProcessPenal)
// app.use(MyProcessViewer)
// app.use(components)
app.use(componentss)
}
export { MyProcessDesigner, MyProcessPenal, MyProcessViewer }

View File

@ -37,13 +37,6 @@ import App from './App.vue'
import './permission'
import { MyPD } from '@/components/bpmnProcessDesigner/package/index.js'
import '@/components/bpmnProcessDesigner/package/theme/index.scss'
import 'bpmn-js/dist/assets/diagram-js.css'
import 'bpmn-js/dist/assets/bpmn-font/css/bpmn.css'
import 'bpmn-js/dist/assets/bpmn-font/css/bpmn-codes.css'
import 'bpmn-js/dist/assets/bpmn-font/css/bpmn-embedded.css'
import hljs from 'highlight.js' //导入代码高亮文件
import 'highlight.js/styles/github.css' //导入代码高亮样式 新版
@ -65,8 +58,6 @@ const setupAll = async () => {
await setupI18n(app)
MyPD(app)
setupStore(app)
setupGlobCom(app)

View File

@ -84,7 +84,7 @@
<!-- 弹窗流程模型图的预览 -->
<Dialog title="流程图" v-model="bpmnDetailVisible" width="800">
<my-process-viewer
<MyProcessViewer
key="designer"
v-model="bpmnXML"
:value="bpmnXML"
@ -97,6 +97,7 @@
<script setup lang="ts" name="BpmProcessDefinition">
import { DICT_TYPE } from '@/utils/dict'
import { dateFormatter } from '@/utils/formatTime'
import { MyProcessViewer } from '@/components/bpmnProcessDesigner/package'
import * as DefinitionApi from '@/api/bpm/definition'
import { setConfAndFields2 } from '@/utils/formCreate'
const { push } = useRouter() //

View File

@ -1,7 +1,7 @@
<template>
<ContentWrap>
<!-- 流程设计器负责绘制流程等 -->
<my-process-designer
<MyProcessDesigner
key="designer"
v-if="xmlString !== undefined"
v-model="xmlString"
@ -14,7 +14,7 @@
@save="save"
/>
<!-- 流程属性器负责编辑每个流程节点的属性 -->
<my-properties-panel
<MyProcessPenal
key="penal"
:bpmnModeler="modeler"
:prefix="controlForm.prefix"
@ -25,6 +25,7 @@
</template>
<script setup lang="ts" name="BpmModelEditor">
import { MyProcessDesigner, MyProcessPenal } from '@/components/bpmnProcessDesigner/package'
//
import CustomContentPadProvider from '@/components/bpmnProcessDesigner/package/designer/plugins/content-pad'
//

View File

@ -216,7 +216,7 @@
<!-- 弹窗流程模型图的预览 -->
<Dialog title="流程图" v-model="bpmnDetailVisible" width="800">
<my-process-viewer
<MyProcessViewer
key="designer"
v-model="bpmnXML"
:value="bpmnXML"
@ -229,6 +229,7 @@
<script setup lang="ts" name="BpmModel">
import { DICT_TYPE, getIntDictOptions } from '@/utils/dict'
import { dateFormatter, formatDate } from '@/utils/formatTime'
import { MyProcessViewer } from '@/components/bpmnProcessDesigner/package'
import * as ModelApi from '@/api/bpm/model'
import * as FormApi from '@/api/bpm/form'
import ModelForm from './ModelForm.vue'

View File

@ -3,7 +3,7 @@
<template #header>
<span class="el-icon-picture-outline">流程图</span>
</template>
<my-process-viewer
<MyProcessViewer
key="designer"
:activityData="activityList"
:prefix="bpmnControlForm.prefix"
@ -16,8 +16,8 @@
</template>
<script lang="ts" name="BpmProcessInstanceBpmnViewer" setup>
import { propTypes } from '@/utils/propTypes'
import { MyProcessViewer } from '@/components/bpmnProcessDesigner/package'
import * as ActivityApi from '@/api/bpm/activity'
// import * as DefinitionApi from '@/api/bpm/definition'
const props = defineProps({
loading: propTypes.bool, //