2024-03-20 22:25:24 +08:00
|
|
|
<template>
|
|
|
|
|
<div>
|
2024-03-24 20:35:53 +08:00
|
|
|
|
2024-03-20 22:25:24 +08:00
|
|
|
<section class="dingflow-design">
|
2024-03-24 20:35:53 +08:00
|
|
|
<el-row>
|
|
|
|
|
<el-col :span="20"/>
|
|
|
|
|
<el-col :span="4">
|
|
|
|
|
<el-button type="primary" size="small" @click="test">测试</el-button>
|
|
|
|
|
</el-col>
|
|
|
|
|
</el-row>
|
2024-03-20 22:25:24 +08:00
|
|
|
<div class="box-scale">
|
|
|
|
|
<nodeWrap v-model:nodeConfig="nodeConfig" />
|
|
|
|
|
<div class="end-node">
|
|
|
|
|
<div class="end-node-circle"></div>
|
|
|
|
|
<div class="end-node-text">流程结束</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</section>
|
|
|
|
|
</div>
|
2024-03-24 20:35:53 +08:00
|
|
|
<approverDrawer />
|
2024-03-20 22:25:24 +08:00
|
|
|
</template>
|
|
|
|
|
<script lang="ts" setup>
|
|
|
|
|
import nodeWrap from '@/components/SimpleProcessDesigner/src/nodeWrap.vue'
|
2024-03-24 20:35:53 +08:00
|
|
|
import approverDrawer from '@/components/SimpleProcessDesigner/src/drawer/approverDrawer.vue'
|
|
|
|
|
import { ref } from 'vue'
|
2024-03-20 22:25:24 +08:00
|
|
|
defineOptions({ name: 'SimpleWorkflowDesignEditor' })
|
2024-03-24 20:35:53 +08:00
|
|
|
const nodeConfig = ref({
|
|
|
|
|
name: '发起人',
|
2024-03-20 22:25:24 +08:00
|
|
|
type: 0,
|
|
|
|
|
id: 'root',
|
|
|
|
|
nodeUserList: [],
|
2024-03-24 20:35:53 +08:00
|
|
|
attributes: {
|
|
|
|
|
"candidateStrategy": 70
|
|
|
|
|
},
|
|
|
|
|
childNode: {},
|
2024-03-20 22:25:24 +08:00
|
|
|
})
|
2024-03-24 20:35:53 +08:00
|
|
|
const test = ()=> {
|
|
|
|
|
console.log('json format', toRaw(nodeConfig.value))
|
|
|
|
|
}
|
2024-03-20 22:25:24 +08:00
|
|
|
</script>
|
|
|
|
|
<style>
|
|
|
|
|
@import url('@/components/SimpleProcessDesigner/theme/workflow.css');
|
|
|
|
|
</style>
|