|
|
|
|
@ -2,68 +2,65 @@
|
|
|
|
|
<div>
|
|
|
|
|
<!--如果是grid 组件 需要新增grid布局包裹-->
|
|
|
|
|
<template v-if="schema.component.includes('Grid')">
|
|
|
|
|
<Row v-show="getIsShow(schema)" :align="(schema.componentProps as any ).align" :gutter="(schema.componentProps as any ).gutter ?? 0" :justify="(schema.componentProps as any ).justify" type="flex">
|
|
|
|
|
<Row v-show="getIsShow(schema)" :align="(schema.componentProps as any).align"
|
|
|
|
|
:gutter="(schema.componentProps as any).gutter ?? 0" :justify="(schema.componentProps as any).justify"
|
|
|
|
|
type="flex">
|
|
|
|
|
<Col v-for="(col, colIndex) in schema.children" :key="colIndex" :span="col.span">
|
|
|
|
|
<template v-for="childSchema in col.list" :key="childSchema.field">
|
|
|
|
|
<SimpleFormItem v-if="showComponent(childSchema)" v-model:value="formModel![childSchema.field]" :form-api="formApi" :isWorkFlow="isWorkFlow" :label-col="labelCol" :refreshFieldObj="refreshFieldObj" :schema="childSchema" />
|
|
|
|
|
<SimpleFormItem v-if="showComponent(childSchema)" v-model:value="formModel![childSchema.field]"
|
|
|
|
|
:form-api="formApi" :isWorkFlow="isWorkFlow" :label-col="labelCol"
|
|
|
|
|
:refreshFieldObj="refreshFieldObj" :schema="childSchema" />
|
|
|
|
|
</template>
|
|
|
|
|
</Col>
|
|
|
|
|
</Row>
|
|
|
|
|
</template>
|
|
|
|
|
<!--如果是tab 组件 需要新增tab组件包裹-->
|
|
|
|
|
<template v-else-if="schema.component === 'Tab'">
|
|
|
|
|
<Tabs v-show="getIsShow(schema)" v-model:activeKey="activeKey" :size="(schema.componentProps as any ).tabSize" :tabPosition="(schema.componentProps as any ).tabPosition" :type="(schema.componentProps as any ).type">
|
|
|
|
|
<Tabs v-show="getIsShow(schema)" v-model:activeKey="activeKey"
|
|
|
|
|
:size="(schema.componentProps as any).tabSize" :tabPosition="(schema.componentProps as any).tabPosition"
|
|
|
|
|
:type="(schema.componentProps as any).type">
|
|
|
|
|
<TabPane v-for="(tab, tabIndex) in schema.children" :key="tabIndex" :forceRender="true" :tab="tab.name">
|
|
|
|
|
<template v-for="childSchema in tab.list" :key="childSchema.field">
|
|
|
|
|
<SimpleFormItem v-if="showComponent(childSchema)" v-model:value="formModel![childSchema.field]" :form-api="formApi" :isWorkFlow="isWorkFlow" :refreshFieldObj="refreshFieldObj" :schema="childSchema" />
|
|
|
|
|
<SimpleFormItem v-if="showComponent(childSchema)" v-model:value="formModel![childSchema.field]"
|
|
|
|
|
:form-api="formApi" :isWorkFlow="isWorkFlow" :refreshFieldObj="refreshFieldObj"
|
|
|
|
|
:schema="childSchema" />
|
|
|
|
|
</template>
|
|
|
|
|
</TabPane>
|
|
|
|
|
</Tabs>
|
|
|
|
|
</template>
|
|
|
|
|
<!--如果是子表单 组件 需要v-model:value="表单对象[字段名]"-->
|
|
|
|
|
<template v-else-if="schema.component.includes('Form')">
|
|
|
|
|
<FormItem
|
|
|
|
|
v-if="getShow(schema)"
|
|
|
|
|
v-show="getIsShow(schema)"
|
|
|
|
|
:key="schema.key"
|
|
|
|
|
:label="getComponentsProps.showLabel ? schema.label : ''"
|
|
|
|
|
:label-col="labelCol"
|
|
|
|
|
:labelAlign="formProps?.labelAlign"
|
|
|
|
|
:name="schema.field"
|
|
|
|
|
:wrapperCol="itemLabelWidthProp.wrapperCol"
|
|
|
|
|
>
|
|
|
|
|
<component :is="formComponent(schema)" v-model:value="formModel![schema.field]" :disabled="getDisable" :size="formProps?.size" v-bind="schema.componentProps" />
|
|
|
|
|
<FormItem v-if="getShow(schema)" v-show="getIsShow(schema)" :key="schema.key"
|
|
|
|
|
:label="getComponentsProps.showLabel ? schema.label : ''" :label-col="labelCol"
|
|
|
|
|
:labelAlign="formProps?.labelAlign" :name="schema.field" :wrapperCol="itemLabelWidthProp.wrapperCol">
|
|
|
|
|
<component :is="formComponent(schema)" v-model:value="formModel![schema.field]" :disabled="getDisable"
|
|
|
|
|
:size="formProps?.size" v-bind="schema.componentProps" />
|
|
|
|
|
</FormItem>
|
|
|
|
|
</template>
|
|
|
|
|
<!--如果是子表单 组件 需要v-model:value="表单对象[字段名]"-->
|
|
|
|
|
<template v-else-if="schema.component.includes('OneForOne')">
|
|
|
|
|
<FormItem
|
|
|
|
|
v-if="getShow(schema)"
|
|
|
|
|
v-show="getIsShow(schema)"
|
|
|
|
|
:key="schema.key"
|
|
|
|
|
:label="getComponentsProps.showLabel ? schema.label : ''"
|
|
|
|
|
:label-col="labelCol"
|
|
|
|
|
:labelAlign="formProps?.labelAlign"
|
|
|
|
|
:name="schema.field"
|
|
|
|
|
:wrapperCol="itemLabelWidthProp.wrapperCol"
|
|
|
|
|
>
|
|
|
|
|
<component :is="componentMap.get(schema.component)" v-model:value="formModel![schema.field]" :disabled="getDisable" :refreshFieldObj="refreshFieldObj" :size="formProps?.size" v-bind="schema.componentProps" />
|
|
|
|
|
<FormItem v-if="getShow(schema)" v-show="getIsShow(schema)" :key="schema.key"
|
|
|
|
|
:label="getComponentsProps.showLabel ? schema.label : ''" :label-col="labelCol"
|
|
|
|
|
:labelAlign="formProps?.labelAlign" :name="schema.field" :wrapperCol="itemLabelWidthProp.wrapperCol">
|
|
|
|
|
<component :is="componentMap.get(schema.component)" v-model:value="formModel![schema.field]"
|
|
|
|
|
:disabled="getDisable" :refreshFieldObj="refreshFieldObj" :size="formProps?.size"
|
|
|
|
|
v-bind="schema.componentProps" />
|
|
|
|
|
</FormItem>
|
|
|
|
|
</template>
|
|
|
|
|
<template v-else-if="schema.component === 'TableLayout'">
|
|
|
|
|
<TableLayoutPreview v-if="getShow(schema)" v-show="getIsShow(schema)" :element="schema">
|
|
|
|
|
<template #tdElement="{ tdElement }">
|
|
|
|
|
<div class="h-full">
|
|
|
|
|
<div
|
|
|
|
|
:style="{
|
|
|
|
|
<div :style="{
|
|
|
|
|
height: tdElement.height ? tdElement.height + 'px' : '',
|
|
|
|
|
minHeight: (tdElement.height || '42') + 'px',
|
|
|
|
|
overflow: 'hidden',
|
|
|
|
|
padding: '10px'
|
|
|
|
|
}"
|
|
|
|
|
>
|
|
|
|
|
}">
|
|
|
|
|
<template v-for="childSchema in tdElement.children" :key="childSchema.field">
|
|
|
|
|
<SimpleFormItem v-if="showComponent(childSchema)" v-model:value="formModel![childSchema.field]" :form-api="formApi" :isWorkFlow="isWorkFlow" :refreshFieldObj="refreshFieldObj" :schema="childSchema" />
|
|
|
|
|
<SimpleFormItem v-if="showComponent(childSchema)"
|
|
|
|
|
v-model:value="formModel![childSchema.field]" :form-api="formApi"
|
|
|
|
|
:isWorkFlow="isWorkFlow" :refreshFieldObj="refreshFieldObj" :schema="childSchema" />
|
|
|
|
|
</template>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
@ -72,46 +69,41 @@
|
|
|
|
|
</template>
|
|
|
|
|
<!--如果是时间区间 组件 需要v-model:startField="表单对象[字段名]" v-model:endField="表单对象[字段名]"-->
|
|
|
|
|
<template v-else-if="schema.component.includes('Range')">
|
|
|
|
|
<FormItem
|
|
|
|
|
v-if="getShow(schema)"
|
|
|
|
|
v-show="getIsShow(schema)"
|
|
|
|
|
:key="schema.key"
|
|
|
|
|
:label="getComponentsProps.showLabel ? schema.label : ''"
|
|
|
|
|
:label-col="labelCol"
|
|
|
|
|
:name="schema.field"
|
|
|
|
|
:rules="rules"
|
|
|
|
|
:validateTrigger="['blur', 'change']"
|
|
|
|
|
:wrapperCol="itemLabelWidthProp.wrapperCol"
|
|
|
|
|
>
|
|
|
|
|
<component
|
|
|
|
|
:is="componentMap.get(schema.component)"
|
|
|
|
|
v-model:endField="schema.field.split(',')[1]"
|
|
|
|
|
v-model:startField="schema.field.split(',')[0]"
|
|
|
|
|
v-model:value="formModel![schema.field]"
|
|
|
|
|
:disabled="getDisable"
|
|
|
|
|
:size="formProps?.size"
|
|
|
|
|
v-bind="schema.componentProps"
|
|
|
|
|
/>
|
|
|
|
|
<FormItem v-if="getShow(schema)" v-show="getIsShow(schema)" :key="schema.key"
|
|
|
|
|
:label="getComponentsProps.showLabel ? schema.label : ''" :label-col="labelCol" :name="schema.field"
|
|
|
|
|
:rules="rules" :validateTrigger="['blur', 'change']" :wrapperCol="itemLabelWidthProp.wrapperCol">
|
|
|
|
|
<component :is="componentMap.get(schema.component)" v-model:endField="schema.field.split(',')[1]"
|
|
|
|
|
v-model:startField="schema.field.split(',')[0]" v-model:value="formModel![schema.field]"
|
|
|
|
|
:disabled="getDisable" :size="formProps?.size" v-bind="schema.componentProps" />
|
|
|
|
|
</FormItem>
|
|
|
|
|
<!-- 因为Range会变为 开始时间 和 结束时间 2个属性给与表单数据 所以需要2个隐藏框绑定 starTime 和 endTime -->
|
|
|
|
|
<FormItem v-show="false" :key="schema.key" :label="getComponentsProps.showLabel ? schema.label : ''" :name="schema.field.split(',')[0]">
|
|
|
|
|
<FormItem v-show="false" :key="schema.key" :label="getComponentsProps.showLabel ? schema.label : ''"
|
|
|
|
|
:name="schema.field.split(',')[0]">
|
|
|
|
|
<input type="hidden" />
|
|
|
|
|
</FormItem>
|
|
|
|
|
<FormItem v-show="false" :key="schema.key" :label="getComponentsProps.showLabel ? schema.label : ''" :name="schema.field.split(',')[1]">
|
|
|
|
|
<FormItem v-show="false" :key="schema.key" :label="getComponentsProps.showLabel ? schema.label : ''"
|
|
|
|
|
:name="schema.field.split(',')[1]">
|
|
|
|
|
<input type="hidden" />
|
|
|
|
|
</FormItem>
|
|
|
|
|
</template>
|
|
|
|
|
<!--如果checked 或者 switch组件 需要v-model:checked="表单对象[字段名]" "-->
|
|
|
|
|
<template v-else-if="checkedValueComponents.includes(schema.component)">
|
|
|
|
|
<FormItem v-if="getShow(schema)" v-show="getIsShow(schema)" :key="schema.key" :label="getComponentsProps.showLabel ? schema.label : ''" :label-col="labelCol" :name="schema.field" :rules="rules" :wrapperCol="itemLabelWidthProp.wrapperCol">
|
|
|
|
|
<component :is="componentMap.get(schema.component)" :key="refreshFieldObj[schema.field]" v-model:checked="formModel![schema.field]" :disabled="getDisable" :size="formProps?.size" v-bind="getComponentsProps" />
|
|
|
|
|
<FormItem v-if="getShow(schema)" v-show="getIsShow(schema)" :key="schema.key"
|
|
|
|
|
:label="getComponentsProps.showLabel ? schema.label : ''" :label-col="labelCol" :name="schema.field"
|
|
|
|
|
:rules="rules" :wrapperCol="itemLabelWidthProp.wrapperCol">
|
|
|
|
|
<component :is="componentMap.get(schema.component)" :key="refreshFieldObj[schema.field]"
|
|
|
|
|
v-model:checked="formModel![schema.field]" :disabled="getDisable" :size="formProps?.size"
|
|
|
|
|
v-bind="getComponentsProps" />
|
|
|
|
|
</FormItem>
|
|
|
|
|
</template>
|
|
|
|
|
<!--如果是card 组件 需要新增card组件包裹-->
|
|
|
|
|
<template v-else-if="schema.component.includes('Card')">
|
|
|
|
|
<CollapseContainer v-show="getIsShow(schema)" :bordered="false" :hasLeftBorder="true" :title="(schema.componentProps as any ).title">
|
|
|
|
|
<CollapseContainer v-show="getIsShow(schema)" :bordered="false" :hasLeftBorder="true"
|
|
|
|
|
:title="(schema.componentProps as any).title">
|
|
|
|
|
<template v-for="childSchema in schema.children![0].list" :key="childSchema.field">
|
|
|
|
|
<SimpleFormItem v-if="showComponent(childSchema)" v-model:value="formModel![childSchema.field]" :form-api="formApi" :isWorkFlow="isWorkFlow" :refreshFieldObj="refreshFieldObj" :schema="childSchema" />
|
|
|
|
|
<SimpleFormItem v-if="showComponent(childSchema)" v-model:value="formModel![childSchema.field]"
|
|
|
|
|
:form-api="formApi" :isWorkFlow="isWorkFlow" :refreshFieldObj="refreshFieldObj"
|
|
|
|
|
:schema="childSchema" />
|
|
|
|
|
</template>
|
|
|
|
|
</CollapseContainer>
|
|
|
|
|
</template>
|
|
|
|
|
@ -123,37 +115,25 @@
|
|
|
|
|
</template>
|
|
|
|
|
<!--如果是 意见簿 组件 需要使用defaultValue直接赋值 -->
|
|
|
|
|
<template v-else-if="schema.component.includes('Opinion')">
|
|
|
|
|
<FormItem
|
|
|
|
|
v-if="getShow(schema)"
|
|
|
|
|
v-show="getIsShow(schema)"
|
|
|
|
|
:key="schema.key"
|
|
|
|
|
:label="getComponentsProps.showLabel ? schema.label : ''"
|
|
|
|
|
:label-col="labelCol"
|
|
|
|
|
:name="schema.field"
|
|
|
|
|
:rules="rules"
|
|
|
|
|
:validateTrigger="['blur', 'change']"
|
|
|
|
|
:wrapperCol="itemLabelWidthProp.wrapperCol"
|
|
|
|
|
>
|
|
|
|
|
<component :is="componentMap.get(schema.component)" :key="refreshFieldObj[schema.field]" :disabled="getDisable" :size="formProps?.size" :value="schema.defaultValue" v-bind="getComponentsProps" />
|
|
|
|
|
<FormItem v-if="getShow(schema)" v-show="getIsShow(schema)" :key="schema.key"
|
|
|
|
|
:label="getComponentsProps.showLabel ? schema.label : ''" :label-col="labelCol" :name="schema.field"
|
|
|
|
|
:rules="rules" :validateTrigger="['blur', 'change']" :wrapperCol="itemLabelWidthProp.wrapperCol">
|
|
|
|
|
<component :is="componentMap.get(schema.component)" :key="refreshFieldObj[schema.field]"
|
|
|
|
|
:disabled="getDisable" :size="formProps?.size" :value="schema.defaultValue"
|
|
|
|
|
v-bind="getComponentsProps" />
|
|
|
|
|
</FormItem>
|
|
|
|
|
</template>
|
|
|
|
|
<template v-else>
|
|
|
|
|
<FormItem
|
|
|
|
|
v-if="getShow(schema)"
|
|
|
|
|
v-show="getIsShow(schema)"
|
|
|
|
|
:key="schema.key"
|
|
|
|
|
:label="getComponentsProps.showLabel ? schema.label : ''"
|
|
|
|
|
:label-col="labelCol"
|
|
|
|
|
:name="schema.field"
|
|
|
|
|
:rules="rules"
|
|
|
|
|
:validateTrigger="['blur', 'change']"
|
|
|
|
|
:wrapperCol="itemLabelWidthProp.wrapperCol"
|
|
|
|
|
>
|
|
|
|
|
<template v-if="getDisable && /Input|AutoCodeRule|DatePicker/.test(schema.component)">
|
|
|
|
|
<FormItem v-if="getShow(schema)" v-show="getIsShow(schema)" :key="schema.key"
|
|
|
|
|
:label="getComponentsProps.showLabel ? schema.label : ''" :label-col="labelCol" :name="schema.field"
|
|
|
|
|
:rules="rules" :validateTrigger="['blur', 'change']" :wrapperCol="itemLabelWidthProp.wrapperCol">
|
|
|
|
|
<template v-if="getDisable && readonlySupport(schema.component)">
|
|
|
|
|
<readonly :schema="schema" :value="formModel![schema.field]" />
|
|
|
|
|
</template>
|
|
|
|
|
<template v-else>
|
|
|
|
|
<component :is="defaultComponent(schema)" :key="refreshFieldObj[schema.field]" v-model:value="formModel![schema.field]" :disabled="getDisable" :size="formProps?.size" v-bind="getComponentsProps" />
|
|
|
|
|
<component :is="defaultComponent(schema)" :key="refreshFieldObj[schema.field]"
|
|
|
|
|
v-model:value="formModel![schema.field]" :disabled="getDisable" :size="formProps?.size"
|
|
|
|
|
v-bind="getComponentsProps" />
|
|
|
|
|
</template>
|
|
|
|
|
</FormItem>
|
|
|
|
|
</template>
|
|
|
|
|
@ -411,6 +391,10 @@
|
|
|
|
|
return props.isWorkFlow ? !noShowWorkFlowComponents.includes(schema.type) : !noShowGenerateComponents.includes(schema.type);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function readonlySupport(name) {
|
|
|
|
|
return /Input|AutoCodeRule|DatePicker|Text|TimePicker|Info/.test(name)
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function getShow(schema: FormSchema): boolean {
|
|
|
|
|
const { show } = schema;
|
|
|
|
|
let isIfShow = true;
|
|
|
|
|
|