update 增加 Element类型定义

This commit is contained in:
LiuHao 2024-01-22 14:50:58 +08:00
parent bc10eb9d33
commit 9443218e86
12 changed files with 36 additions and 56 deletions

View File

@ -12,27 +12,16 @@ import ProcessPanel from './panel/ProcessPanel.vue';
import StartEndPanel from './panel/StartEndPanel.vue';
import GatewayPanel from './panel/GatewayPanel.vue';
import SequenceFlowPanel from './panel/SequenceFlowPanel.vue';
import { Modeler, Modeling, Element } from 'bpmn';
interface propsType {
users: Array<any>;
groups: Array<any>;
categorys: Array<any>;
modeler: any;
modeler: Modeler;
}
const props = withDefaults(defineProps<propsType>(), {});
const element = ref<any>();
const form = reactive({
id: '',
name: '',
color: null
});
const roles = ref([
{ value: 'manager', label: '经理' },
{ value: 'personnel', label: '人事' },
{ value: 'charge', label: '主管' }
]);
const element = ref<Element>();
const startEndType = ['bpmn:IntermediateThrowEvent', 'bpmn:StartEvent', 'bpmn:EndEvent'];
const taskType = [
@ -69,20 +58,24 @@ const nodeName = computed(() => {
});
const handleModeler = () => {
props.modeler.on('root.added', (e) => {
props.modeler.on('root.added', (e: any) => {
if (e.element.type === 'bpmn:Process') {
element.value = null;
nextTick(() => {
element.value = e.element;
// const modeling = props.modeler.get<Modeling>('modeling');
// modeling.setColor(e.element.children, {
// fill: 'green'
// });
});
}
});
props.modeler.on('element.click', (e) => {
props.modeler.on('element.click', (e: any) => {
if (e.element.type === 'bpmn:Process') {
element.value = e.element;
}
});
props.modeler.on('selection.changed', (e) => {
props.modeler.on('selection.changed', (e: any) => {
// nullvue
element.value = null;
const newElement = e.newSelection[0];

View File

@ -1,8 +1,8 @@
import showConfig from '@/components/BpmnDesign/assets/showConfig';
import { Moddle, Modeler, Modeling } from 'bpmn';
import { Moddle, Modeler, Modeling, Element } from 'bpmn';
interface Options {
modeler: Modeler;
element: any;
element: Element;
}
export default (ops: Options) => {

View File

@ -1,10 +1,9 @@
import { Ref } from 'vue';
import usePanel from '@/components/BpmnDesign/hooks/usePanel';
import { Modeler } from 'bpmn';
import { Element, Modeler } from 'bpmn';
interface Options {
modeler: Modeler;
element: any;
element: Element;
}
interface Data {

View File

@ -63,13 +63,14 @@
</template>
<script lang="ts" setup name="BpmnDesign">
import { Canvas, ElementRegistry, Modeler } from 'bpmn';
import PropertyPanel from './PropertyPanel.vue';
import BpmnModeler from 'bpmn-js/lib/Modeler.js';
import diagramXML from '@/components/BpmnDesign/assets/defaultXML';
import flowableModdle from '@/components/BpmnDesign/assets/moddle/flowable';
import Modules from './assets/module/index';
import useModelerStore from '@/store/modules/modeler';
import { Canvas, Modeler } from 'bpmn';
const modelerStore = useModelerStore();
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
@ -146,13 +147,12 @@ const initCanvas = () => {
* 初始化Model
*/
const initModel = () => {
let store = useModelerStore();
if (store.getModeler()) {
if (modelerStore.getModeler()) {
// modeler
store.getModeler().destroy();
store.setModeler(undefined);
modelerStore.getModeler().destroy();
modelerStore.setModeler(undefined);
}
store.setModeler(bpmnModeler.value);
modelerStore.setModeler(bpmnModeler.value);
};
/**
@ -325,20 +325,6 @@ const getProcessElement = () => {
@import 'bpmn-js/dist/assets/bpmn-font/css/bpmn-codes.css';
@import 'bpmn-js/dist/assets/bpmn-font/css/bpmn-embedded.css';
.view-mode {
.el-header,
.el-aside,
.djs-palette,
.bjs-powered-by {
display: none;
}
.el-loading-mask {
background-color: initial;
}
.el-loading-spinner {
display: none;
}
}
.app-containers {
width: 100%;
height: 100%;

View File

@ -18,12 +18,12 @@
<script setup lang="ts">
import useParseElement from '@/components/BpmnDesign/hooks/useParseElement';
import usePanel from '@/components/BpmnDesign/hooks/usePanel';
import { Modeler } from 'bpmn';
import { Modeler, Element } from 'bpmn';
import { GatewayPanel } from 'bpmnDesign';
interface PropType {
modeler: Modeler;
element: any;
element: Element;
categorys?: any[];
}
const props = withDefaults(defineProps<PropType>(), {

View File

@ -25,14 +25,14 @@
import ExecutionListener from './property/ExecutionListener.vue';
import useParseElement from '@/components/BpmnDesign/hooks/useParseElement';
import usePanel from '@/components/BpmnDesign/hooks/usePanel';
import { Modeler } from 'bpmn';
import { Modeler, Element } from 'bpmn';
import { ProcessPanel } from 'bpmnDesign';
const { proxy } = getCurrentInstance() as ComponentInternalInstance;
interface PropType {
modeler: Modeler;
element: any;
element: Element;
categorys?: any[];
}
const props = withDefaults(defineProps<PropType>(), {

View File

@ -24,12 +24,12 @@
<script setup lang="ts">
import useParseElement from '@/components/BpmnDesign/hooks/useParseElement';
import usePanel from '@/components/BpmnDesign/hooks/usePanel';
import { Modeler } from 'bpmn';
import { Modeler, Element } from 'bpmn';
import { SequenceFlowPanel } from 'bpmnDesign';
interface PropType {
modeler: Modeler;
element: any;
element: Element;
categorys?: any[];
}
const props = withDefaults(defineProps<PropType>(), {

View File

@ -18,12 +18,12 @@
<script setup lang="ts">
import useParseElement from '@/components/BpmnDesign/hooks/useParseElement';
import usePanel from '@/components/BpmnDesign/hooks/usePanel';
import { Modeler } from 'bpmn';
import { Modeler, Element } from 'bpmn';
import { StartEndPanel } from 'bpmnDesign';
interface PropType {
modeler: Modeler;
element: any;
element: Element;
categorys?: any[];
}
const props = withDefaults(defineProps<PropType>(), {

View File

@ -23,12 +23,12 @@
<script setup lang="ts">
import useParseElement from '@/components/BpmnDesign/hooks/useParseElement';
import usePanel from '@/components/BpmnDesign/hooks/usePanel';
import { Modeler } from 'bpmn';
import { Element, Modeler } from 'bpmn';
import { TaskPanel } from 'bpmnDesign';
interface PropType {
modeler: Modeler;
element: any;
element: Element;
categorys?: any[];
}
const props = withDefaults(defineProps<PropType>(), {

View File

@ -75,7 +75,7 @@
import ListenerParam from './ListenerParam.vue';
import { VxeTableEvents, VxeTableInstance, VxeTablePropTypes } from 'vxe-table';
import { ExecutionListenerVO } from 'bpmnDesign';
import { Moddle, Modeler } from 'bpmn';
import { Moddle, Modeler, Element } from 'bpmn';
import usePanel from '@/components/BpmnDesign/hooks/usePanel';
import useDialog from '@/hooks/useDialog';
@ -83,7 +83,7 @@ import useDialog from '@/hooks/useDialog';
const emit = defineEmits(['close']);
interface PropType {
modeler: Modeler;
element: any;
element: Element;
categorys?: any[];
}
const props = withDefaults(defineProps<PropType>(), {

View File

@ -74,7 +74,7 @@
import ListenerParam from './ListenerParam.vue';
import { VxeTableEvents, VxeTableInstance, VxeTablePropTypes } from 'vxe-table';
import { TaskListenerVO } from 'bpmnDesign';
import { Moddle, Modeler } from 'bpmn';
import { Moddle, Modeler, Element } from 'bpmn';
import usePanel from '@/components/BpmnDesign/hooks/usePanel';
import useDialog from '@/hooks/useDialog';
@ -83,7 +83,7 @@ const { proxy } = getCurrentInstance() as ComponentInternalInstance;
interface PropType {
modeler: Modeler;
element: any;
element: Element;
categorys?: any[];
}
const props = withDefaults(defineProps<PropType>(), {

View File

@ -4,10 +4,12 @@ declare module 'bpmn' {
import type modeling from 'bpmn-js/lib/features/modeling/Modeling';
import type canvas from 'diagram-js/lib/core/Canvas';
import type elementRegistry from 'diagram-js/lib/core/ElementRegistry';
import type { Element as element } from 'bpmn-js/lib/model/Types';
export type Modeler = modeler;
export type Modeling = modeling;
export type Canvas = canvas;
export type ElementRegistry = elementRegistry;
export type Moddle = moddle;
export type Element = element;
}