135 lines
6.3 KiB
Vue
135 lines
6.3 KiB
Vue
|
||
<template>
|
||
<div ref="formWrap">
|
||
<Form ref="formRef" :label-col="getProps?.labelCol" :labelAlign="getProps?.labelAlign" :layout="getProps?.layout" :model="formModel" :wrapper-col="getProps?.wrapperCol" @keypress.enter="handleEnterPress">
|
||
<!-- 业务表单id -->
|
||
|
||
<Col v-if="getIfShow2('2b23009bb6be47d9bd60ffa7b928e3d3')" v-show="getIsShow2('2b23009bb6be47d9bd60ffa7b928e3d3')" :span="getColWidth(schemaMap['2b23009bb6be47d9bd60ffa7b928e3d3'])">
|
||
<template v-if="showComponent(schemaMap['2b23009bb6be47d9bd60ffa7b928e3d3'])">
|
||
<SimpleFormItem v-model:value="formModel[schemaMap['2b23009bb6be47d9bd60ffa7b928e3d3'].field]" :form-api="formApi" :isWorkFlow="isWorkFlow" :refreshFieldObj="refreshFieldObj" :schema="schemaMap['2b23009bb6be47d9bd60ffa7b928e3d3']" />
|
||
</template>
|
||
</Col>
|
||
<!-- 关联的业务数据id -->
|
||
|
||
<Col v-if="getIfShow2('ae02eb3114b24e0184df37f394394f2b')" v-show="getIsShow2('ae02eb3114b24e0184df37f394394f2b')" :span="getColWidth(schemaMap['ae02eb3114b24e0184df37f394394f2b'])">
|
||
<template v-if="showComponent(schemaMap['ae02eb3114b24e0184df37f394394f2b'])">
|
||
<SimpleFormItem v-model:value="formModel[schemaMap['ae02eb3114b24e0184df37f394394f2b'].field]" :form-api="formApi" :isWorkFlow="isWorkFlow" :refreshFieldObj="refreshFieldObj" :schema="schemaMap['ae02eb3114b24e0184df37f394394f2b']" />
|
||
</template>
|
||
</Col>
|
||
<!-- 变更人的ip地址 -->
|
||
|
||
<Col v-if="getIfShow2('d6f4b7d9678a4e968a3107a5c610e48f')" v-show="getIsShow2('d6f4b7d9678a4e968a3107a5c610e48f')" :span="getColWidth(schemaMap['d6f4b7d9678a4e968a3107a5c610e48f'])">
|
||
<template v-if="showComponent(schemaMap['d6f4b7d9678a4e968a3107a5c610e48f'])">
|
||
<SimpleFormItem v-model:value="formModel[schemaMap['d6f4b7d9678a4e968a3107a5c610e48f'].field]" :form-api="formApi" :isWorkFlow="isWorkFlow" :refreshFieldObj="refreshFieldObj" :schema="schemaMap['d6f4b7d9678a4e968a3107a5c610e48f']" />
|
||
</template>
|
||
</Col>
|
||
<!-- 变更原因 -->
|
||
|
||
<Col v-if="getIfShow2('6305f47c32214c14b60efac51758e47c')" v-show="getIsShow2('6305f47c32214c14b60efac51758e47c')" :span="getColWidth(schemaMap['6305f47c32214c14b60efac51758e47c'])">
|
||
<template v-if="showComponent(schemaMap['6305f47c32214c14b60efac51758e47c'])">
|
||
<SimpleFormItem v-model:value="formModel[schemaMap['6305f47c32214c14b60efac51758e47c'].field]" :form-api="formApi" :isWorkFlow="isWorkFlow" :refreshFieldObj="refreshFieldObj" :schema="schemaMap['6305f47c32214c14b60efac51758e47c']" />
|
||
</template>
|
||
</Col>
|
||
<!-- 变更版本号 -->
|
||
|
||
<Col v-if="getIfShow2('6ea6d70beac740dfb44e5b4dae8a5f92')" v-show="getIsShow2('6ea6d70beac740dfb44e5b4dae8a5f92')" :span="getColWidth(schemaMap['6ea6d70beac740dfb44e5b4dae8a5f92'])">
|
||
<template v-if="showComponent(schemaMap['6ea6d70beac740dfb44e5b4dae8a5f92'])">
|
||
<SimpleFormItem v-model:value="formModel[schemaMap['6ea6d70beac740dfb44e5b4dae8a5f92'].field]" :form-api="formApi" :isWorkFlow="isWorkFlow" :refreshFieldObj="refreshFieldObj" :schema="schemaMap['6ea6d70beac740dfb44e5b4dae8a5f92']" />
|
||
</template>
|
||
</Col>
|
||
|
||
<div :style="{ textAlign: getProps.buttonLocation }">
|
||
<slot name="buttonBefore"></slot>
|
||
<a-button v-if="getProps.showSubmitButton" type="primary" @click="handleSubmit">
|
||
{{ t('提交') }}
|
||
</a-button>
|
||
<a-button v-if="getProps.showResetButton" style="margin-left: 10px" @click="handleReset">
|
||
{{ t('重置') }}
|
||
</a-button>
|
||
<slot name="buttonAfter"></slot>
|
||
</div>
|
||
</Form>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
// 注意，这里继承的是SimpleFormSetup，使用script setup写法的组件无法继承，必须使用特别的版本
|
||
import SimpleFormSetup from '/@/components/SimpleForm/src/SimpleFormSetup.vue';
|
||
import { Col, Form, Row } from 'ant-design-vue';
|
||
import SimpleFormItem from '/@/components/SimpleForm/src/components/SimpleFormItem.vue';
|
||
import { ref } from 'vue';
|
||
import { CheckCircleOutlined } from '@ant-design/icons-vue';
|
||
|
||
|
||
const FormItem = Form.Item;
|
||
|
||
export default {
|
||
components: {
|
||
CheckCircleOutlined,
|
||
Form,
|
||
Col,
|
||
SimpleFormItem,
|
||
Row,
|
||
FormItem
|
||
|
||
},
|
||
mixins: [SimpleFormSetup],
|
||
setup(props, ctx) {
|
||
const ret = SimpleFormSetup.setup(props, ctx);
|
||
const expose = ctx.expose;
|
||
|
||
|
||
return {
|
||
|
||
...ret
|
||
};
|
||
},
|
||
computed: {
|
||
// 这里需要增加一个计算属性 否则流程关联时字段读写状态会失效
|
||
schemaMap() {
|
||
const schemaMap = {};
|
||
this.getSchemas.forEach((schema) => {
|
||
schemaMap[schema.key] = schema;
|
||
if(schema.children) {
|
||
schema.children.forEach(sChild=>{
|
||
if(sChild.list){
|
||
sChild.list.forEach(lChild=>{
|
||
schemaMap[lChild.key] = lChild;
|
||
});
|
||
}
|
||
});
|
||
}
|
||
});
|
||
return schemaMap;
|
||
}
|
||
},
|
||
methods: {
|
||
getIfShow2: function (key) {
|
||
return this.getIfShow(this.schemaMap[key], this.formModel[this.schemaMap[key].field]);
|
||
},
|
||
|
||
getIsShow2: function (key) {
|
||
return this.getIsShow(this.schemaMap[key], this.formModel[this.schemaMap[key].field]);
|
||
},
|
||
|
||
getTabProps(key) {
|
||
const schema = this.schemaMap[key];
|
||
return {
|
||
size: schema.componentProps.tabSize,
|
||
tabPosition: schema.componentProps.tabPosition,
|
||
type: schema.componentProps.type
|
||
}
|
||
},
|
||
|
||
getTdStyle(tdElement) {
|
||
return {
|
||
height: tdElement.height ? tdElement.height + 'px' : '',
|
||
minHeight: (tdElement.height || '42') + 'px',
|
||
overflow: 'hidden',
|
||
padding: '10px'
|
||
}
|
||
}
|
||
}
|
||
};
|
||
</script>
|