|
新增一个flow组件 可以正常拖拽到画布 但是无法拖拽到容器中(界面上会消失 )
flow-widget.vue 代码如下
<template>
<static-content-wrapper :design-state="designState" :designer="designer" :field="field"
:index-of-parent-list="indexOfParentList" :parent-list="parentList"
:parent-widget="parentWidget"
:sub-form-col-index="subFormColIndex" :sub-form-row-id="subFormRowId"
:sub-form-row-index="subFormRowIndex">
<div>
<span>流程组件</span>
</div>
</static-content-wrapper>
</template>
<script>
import StaticContentWrapper from './static-content-wrapper.vue'
import emitter from '@/utils/tcLowCode/codev/lowCodeDesign/emitter'
import i18n, {translate} from "@/utils/tcLowCode/codev/lowCodeDesign/i18n";
import fieldMixin from "../../../form-designer/form-widget/field-widget/fieldMixin";
export default {
name: "flow-widget",
componentName: 'FieldWidget', //必须固定为FieldWidget,用于接收父级组件的broadcast事件
mixins: [emitter, fieldMixin, i18n],
props: {
field: Object,
parentWidget: Object,
parentList: Array,
indexOfParentList: Number,
designer: Object,
designState: {
type: Boolean,
default: false
},
subFormRowIndex: { /* 子表单组件行索引,从0开始计数 */
type: Number,
default: -1
},
subFormColIndex: { /* 子表单组件列索引,从0开始计数 */
type: Number,
default: -1
},
subFormRowId: { /* 子表单组件行Id,唯一id且不可变 */
type: String,
default: ''
},
},
components: {
StaticContentWrapper,
},
computed: {},
beforeCreate() {
/* 这里不能访问方法和属性!! */
},
created() {
/* 注意:子组件mounted在父组件created之后、父组件mounted之前触发,故子组件mounted需要用到的prop
需要在父组件created中初始化!! */
this.registerToRefList()
this.initEventHandler()
this.handleOnCreated()
},
mounted() {
this.handleOnMounted()
},
beforeUnmount() {
this.unregisterFromRefList()
},
methods: {}
}
</script>
<style lang="scss" scoped>
@import "../../../styles/global.scss"; //* static-content-wrapper已引入,还需要重复引入吗? *//
</style>
workFlow-editor.vue 代码如下
<template>
<el-form-item label="流程实例选择">
<el-select v-model="optionModel.workflow">
<el-option v-for='item in flowList'
:key='item.definitionId'
:label='item.processName'
:value='item.definitionId'
/>
</el-select>
</el-form-item>
</template>
<script>
import i18n from "@/utils/tcLowCode/codev/lowCodeDesign/i18n"
import propertyMixin from "../propertyMixin.js";
import {getWfDeployList} from "@/api/tcLowCode/workflow/workflowDesign";
import {storeToRefs} from "pinia";
import {useUserInfo} from "@/stores/userInfo";
export default {
name: "workFlow-editor",
mixins: [i18n, propertyMixin],
props: {
designer: Object,
selectedWidget: Object,
optionModel: Object,
},
data() {
return {
flowList: [],
}
},
async mounted() {
//用户信息
const {userInfo} = storeToRefs(useUserInfo());
const {data} = await getWfDeployList({
tenantId: userInfo.value.sysUser.tenantId
})
this.flowList = data
debugger
}
}
</script>
<style lang="scss" scoped>
</style>
propertyRegister.js 代码如下
const ADVANCED_PROPERTIES = {//...'workFlow': 'workFlow-editor',//...}
widgetsConfig.js代码如下
export const advancedFields = [//...{
type: 'flow',
icon: 'slot-field',
formItemFlag: false,
options: {
name: '',
label: '',
workFlow: '',
size: '',
disabled: false,
hidden: false,
type: '',
//-------------------
customClass: '', //自定义css类名
//-------------------
// onCreated: '',
// onMounted: '',
// onClick: '',
}
}//...]
我知道答案
回答被采纳将会获得 500 威望 已有4人回答
|
|