Skip to content

Commit

Permalink
fix: 修复表单赋值问题
Browse files Browse the repository at this point in the history
  • Loading branch information
JackySoft authored and jianbing.chen committed Dec 18, 2024
1 parent 491aa9c commit 943b3b4
Show file tree
Hide file tree
Showing 3 changed files with 101 additions and 72 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -86,4 +86,5 @@
}
.publishPopover {
padding: 20px;
width: 100%;
}
86 changes: 50 additions & 36 deletions packages/editor/src/packages/utils/util.ts
Original file line number Diff line number Diff line change
Expand Up @@ -242,48 +242,62 @@ export function renderFormula(formula: string, eventParams: any = {}) {
}

/**
* 日期组件处理
* 递归查找日期组件
*/
export const getDateItem = (elements: ComponentType[], list: string[]): string[] => {
for (let i = 0; i < elements.length; i++) {
const item = elements[i];
if (['DatePicker', 'TimePicker', 'DatePickerRange', 'TimePickerRange', 'EditTable'].includes(item.type)) {
list.push(item.id);
} else if (item.elements?.length) {
getDateItem(item.elements, list);
}
}
return list;
};

/**
* 针对日期组件值做特殊处理,因为日期赋值必须转换为dayjs对象
* @param list 组件列表
* @param values 表单数据
* @param type 处理类型,string: 字符串处理,date: 日期转换
* @param values 表单数据值
*/
export const dateFormat = (list: Array<ComponentType>, values: any) => {
const elementsMap = usePageStore.getState().page.elementsMap;
list
.filter((item) => ['DatePicker', 'TimePicker', 'DatePickerRange', 'TimePickerRange', 'EditTable'].includes(item.type))
.map((item: any) => {
const {
startField,
endField,
formItem: { name },
formWrap: { format, columns },
} = elementsMap[item.id].config.props;
if (['DatePicker', 'TimePicker'].includes(item.type)) {
if (!values[name]) return;
values[name] = values[name]?.format?.(format) || dayjs(values[name]);
} else if (['DatePickerRange', 'TimePickerRange'].includes(item.type)) {
if (values[name]?.length == 2) {
const [start, end] = values[name]?.map((date: any) => date?.format?.(format) || dayjs(values[date])) || [undefined, undefined];
if (startField && endField) {
values[startField] = start;
values[endField] = end;
delete values[name];
}
} else {
if (values[startField] && values[endField]) {
values[name] = [dayjs(values[startField]), dayjs(values[endField])];
}
const dates = getDateItem(list, []);
dates.map((id: string) => {
const { type, config } = elementsMap[id];
const {
startField,
endField,
formItem: { name },
formWrap: { format, columns },
} = config.props;
if (['DatePicker', 'TimePicker'].includes(type)) {
if (!values[name]) return;
values[name] = values[name]?.format?.(format) || dayjs(values[name]);
} else if (['DatePickerRange', 'TimePickerRange'].includes(type)) {
if (values[name]?.length == 2) {
const [start, end] = values[name]?.map((date: any) => date?.format?.(format) || dayjs(values[date])) || [undefined, undefined];
if (startField && endField) {
values[startField] = start;
values[endField] = end;
delete values[name];
}
} else {
if (values[startField] && values[endField]) {
values[name] = [dayjs(values[startField]), dayjs(values[endField])];
}
} else if (item.type === 'EditTable') {
columns
.filter((item: any) => item.type === 'date')
.map(({ dataIndex }: { dataIndex: string }) => {
values[name].map((item: any) => {
if (item[dataIndex]) item[dataIndex] = dayjs(item[dataIndex]);
});
});
}
});
} else if (type === 'EditTable') {
columns
.filter((item: any) => item.type === 'date')
.map(({ dataIndex }: { dataIndex: string }) => {
values[name].map((item: any) => {
if (item[dataIndex]) item[dataIndex] = dayjs(item[dataIndex]);
});
});
}
});
return values;
};

Expand Down
86 changes: 50 additions & 36 deletions packages/materials/utils/util.ts
Original file line number Diff line number Diff line change
Expand Up @@ -242,48 +242,62 @@ export function renderFormula(formula: string, eventParams?: any) {
}

/**
* 日期组件处理
* 递归查找日期组件
*/
export const getDateItem = (elements: ComponentType[], list: string[]): string[] => {
for (let i = 0; i < elements.length; i++) {
const item = elements[i];
if (['DatePicker', 'TimePicker', 'DatePickerRange', 'TimePickerRange', 'EditTable'].includes(item.type)) {
list.push(item.id);
} else if (item.elements?.length) {
getDateItem(item.elements, list);
}
}
return list;
};

/**
* 针对日期组件值做特殊处理,因为日期赋值必须转换为dayjs对象
* @param list 组件列表
* @param values 表单数据
* @param type 处理类型,string: 字符串处理,date: 日期转换
* @param values 表单数据值
*/
export const dateFormat = (list: Array<ComponentType>, values: any) => {
const elementsMap = usePageStore.getState().page.elementsMap;
list
.filter((item) => ['DatePicker', 'TimePicker', 'DatePickerRange', 'TimePickerRange', 'EditTable'].includes(item.type))
.map((item: any) => {
const {
startField,
endField,
formItem: { name },
formWrap: { format, columns },
} = elementsMap[item.id].config.props;
if (['DatePicker', 'TimePicker'].includes(item.type)) {
if (!values[name]) return;
values[name] = values[name]?.format?.(format) || dayjs(values[name]);
} else if (['DatePickerRange', 'TimePickerRange'].includes(item.type)) {
if (values[name]?.length == 2) {
const [start, end] = values[name]?.map((date: any) => date?.format?.(format) || dayjs(values[date])) || [undefined, undefined];
if (startField && endField) {
values[startField] = start;
values[endField] = end;
delete values[name];
}
} else {
if (values[startField] && values[endField]) {
values[name] = [dayjs(values[startField]), dayjs(values[endField])];
}
const dates = getDateItem(list, []);
dates.map((id: string) => {
const { type, config } = elementsMap[id];
const {
startField,
endField,
formItem: { name },
formWrap: { format, columns },
} = config.props;
if (['DatePicker', 'TimePicker'].includes(type)) {
if (!values[name]) return;
values[name] = values[name]?.format?.(format) || dayjs(values[name]);
} else if (['DatePickerRange', 'TimePickerRange'].includes(type)) {
if (values[name]?.length == 2) {
const [start, end] = values[name]?.map((date: any) => date?.format?.(format) || dayjs(values[date])) || [undefined, undefined];
if (startField && endField) {
values[startField] = start;
values[endField] = end;
delete values[name];
}
} else {
if (values[startField] && values[endField]) {
values[name] = [dayjs(values[startField]), dayjs(values[endField])];
}
} else if (item.type === 'EditTable') {
columns
.filter((item: any) => item.type === 'date')
.map(({ dataIndex }: { dataIndex: string }) => {
values[name].map((item: any) => {
if (item[dataIndex]) item[dataIndex] = dayjs(item[dataIndex]);
});
});
}
});
} else if (type === 'EditTable') {
columns
.filter((item: any) => item.type === 'date')
.map(({ dataIndex }: { dataIndex: string }) => {
values[name].map((item: any) => {
if (item[dataIndex]) item[dataIndex] = dayjs(item[dataIndex]);
});
});
}
});
return values;
};

Expand Down

0 comments on commit 943b3b4

Please sign in to comment.