提交 69334883 编写于 作者: Cano1997's avatar Cano1997

feat: 表单多数据部件支持重复器表格

上级 40e29068
import { defineComponent, getCurrentInstance, h, watch } from 'vue'; import { computed, defineComponent, getCurrentInstance, h, watch } from 'vue';
import { useController, useNamespace } from '@ibiz-template/vue-util'; import { useController, useNamespace } from '@ibiz-template/vue-util';
import { FormMDCtrlModel } from '@ibiz-template/model'; import {
FormMDCtrlModel,
IPSDEFormDetail,
IPSDEFormItem,
} from '@ibiz-template/model';
import '@ibiz-template/theme/style/components/widgets/form/form-mdctrl.scss'; import '@ibiz-template/theme/style/components/widgets/form/form-mdctrl.scss';
import { FormMDCtrlController } from '@ibiz-template/controller'; import { FormMDCtrlController } from '@ibiz-template/controller';
...@@ -26,6 +30,28 @@ export const FormMDCtrl = defineComponent({ ...@@ -26,6 +30,28 @@ export const FormMDCtrl = defineComponent({
const c = props.controller; const c = props.controller;
const columns = computed(() => {
const formDetails =
c.model.source.getPSDEFormDetails() as IPSDEFormDetail[];
const formItems = formDetails.filter(
formDetail => formDetail.detailType === 'FORMITEM',
) as IPSDEFormItem[];
return formItems.map(formItem => {
const width = formItem.labelWidth;
return {
align: 'center',
ellipsis: true,
key: formItem.id,
minWidth: width,
resizable: true,
sortable: false,
title: formItem.caption,
tooltip: false,
width,
};
});
});
watch( watch(
() => c.form.isLoaded, () => c.form.isLoaded,
(n, o) => { (n, o) => {
...@@ -35,9 +61,19 @@ export const FormMDCtrl = defineComponent({ ...@@ -35,9 +61,19 @@ export const FormMDCtrl = defineComponent({
}, },
); );
return { ns, c }; return { ns, c, columns };
}, },
render() { render() {
// 重复器表格
const renderGridContent = () => {
return (
<i-table
class={this.ns.b('grid-content')}
columns={this.columns}
data={this.c.contentCtrlData}
></i-table>
);
};
const renderFormContent = () => { const renderFormContent = () => {
return ( return (
this.c.contentCtrlData.length > 0 && this.c.contentCtrlData.length > 0 &&
...@@ -89,6 +125,14 @@ export const FormMDCtrl = defineComponent({ ...@@ -89,6 +125,14 @@ export const FormMDCtrl = defineComponent({
); );
}; };
const renderContent = () => {
// 重复器表格
if (this.c.mdCtrlType === 'REPEATER' && this.c.detailStyle === 'STYLE2') {
return renderGridContent();
}
return renderFormContent();
};
const renderMainContent = () => { const renderMainContent = () => {
return ( return (
<div class={this.ns.b('main')}> <div class={this.ns.b('main')}>
...@@ -107,7 +151,7 @@ export const FormMDCtrl = defineComponent({ ...@@ -107,7 +151,7 @@ export const FormMDCtrl = defineComponent({
</i-button> </i-button>
)} )}
</div>, </div>,
renderFormContent(), renderContent(),
]} ]}
</div> </div>
); );
......
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册