From 7fc1598ca4c4a03e0c4ef8ff5589ba61e720f27f Mon Sep 17 00:00:00 2001 From: wangailin Date: Mon, 21 Feb 2022 14:40:10 +0800 Subject: [PATCH 01/13] feat: version 1.2.4 --- package.json | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/package.json b/package.json index 91472ce..b1fc05e 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "ccms", - "version": "1.2.0", + "version": "1.2.4", "description": "ConfigableCMS", "main": "lib/index.js", "module": "dist/index.js", -- Gitee From 8691169638644f26e173068872e16f1b0a13c9e5 Mon Sep 17 00:00:00 2001 From: zjt Date: Wed, 23 Feb 2022 22:16:26 +0800 Subject: [PATCH 02/13] =?UTF-8?q?feat:=20=E8=A1=A5=E5=85=85treeSelect?= =?UTF-8?q?=E5=92=8Cselect?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/formFields/select/common.tsx | 60 ++++++- .../formFields/select/multiple/index.tsx | 8 +- .../formFields/treeSelect/index.tsx | 162 +++++++++++++----- src/interface.ts | 89 +++++----- 4 files changed, 232 insertions(+), 87 deletions(-) diff --git a/src/components/formFields/select/common.tsx b/src/components/formFields/select/common.tsx index 528b21d..2779ab8 100644 --- a/src/components/formFields/select/common.tsx +++ b/src/components/formFields/select/common.tsx @@ -1,7 +1,29 @@ import { ReactNode } from 'react' -import EnumerationHelper, { EnumerationOptionsConfig } from '../../../util/enumeration' +import EnumerationHelper, { EnumerationOptionsConfig, InterfaceEnumerationOptionsKVConfig, InterfaceEnumerationOptionsListConfig } from '../../../util/enumeration' import InterfaceHelper from '../../../util/interface' import { Field, FieldConfig, FieldProps, IField, Display, DisplayProps } from '../common' +import { + RecordParamConfig, + DataParamConfig, + StepParamConfig, + SourceParamConfig +} from '../../../interface' +import ParamHelper from '../../../util/param' +import { getValue } from '../../../util/value' + +type OptionsConfigDefaultValue = + | RecordParamConfig + | DataParamConfig + | StepParamConfig + | SourceParamConfig; + +interface AutomaticEnumerationOptionsConfig { + from: 'automatic'; + defaultValue?: OptionsConfigDefaultValue; + format?: + | InterfaceEnumerationOptionsKVConfig + | InterfaceEnumerationOptionsListConfig; +} export interface SelectFieldConfig extends FieldConfig { options?: EnumerationOptionsConfig @@ -25,7 +47,7 @@ interface SelectSingleFieldState { export default class SelectField extends Field implements IField { interfaceHelper = new InterfaceHelper() - constructor (props: FieldProps) { + constructor(props: FieldProps) { super(props) this.state = { @@ -33,10 +55,40 @@ export default class SelectField extends Fiel } } + optionsAutomaticValue = (defaultValue: OptionsConfigDefaultValue) => { + if (defaultValue !== undefined) { + return ParamHelper(defaultValue, { record: this.props.record, data: this.props.data, step: this.props.step }) + } + return undefined + } + options = ( - config: EnumerationOptionsConfig | undefined + config: EnumerationOptionsConfig | undefined | AutomaticEnumerationOptionsConfig ) => { if (config) { + if (config.from === 'automatic') { + if (config.defaultValue && config.defaultValue.source && config.defaultValue.field) { + const data = this.optionsAutomaticValue(config.defaultValue) + if (config.format) { + if (config.format.type === 'kv') { + return Object.keys(data).map((key) => ({ + value: key, + label: data[key] + })) + } else if (config.format.type === 'list') { + if (Array.isArray(data)) { + return data.map((item: any) => { + return { + value: getValue(item, (config.format as InterfaceEnumerationOptionsListConfig).keyField), + label: getValue(item, (config.format as InterfaceEnumerationOptionsListConfig).labelField) + } + }) + } + } + } + } + return [] + } EnumerationHelper.options(config, (config, source) => this.interfaceHelper.request(config, source, { record: this.props.record, data: this.props.data, step: this.props.step }, { loadDomain: this.props.loadDomain })).then((options) => { if (JSON.stringify(this.state.options) !== JSON.stringify(options)) { this.setState({ @@ -54,7 +106,7 @@ export default class SelectField extends Fiel export class SelectDisplay extends Display { interfaceHelper = new InterfaceHelper() - constructor (props: DisplayProps) { + constructor(props: DisplayProps) { super(props) this.state = { diff --git a/src/components/formFields/select/multiple/index.tsx b/src/components/formFields/select/multiple/index.tsx index d2dd263..0d84ff1 100644 --- a/src/components/formFields/select/multiple/index.tsx +++ b/src/components/formFields/select/multiple/index.tsx @@ -114,7 +114,13 @@ export default class SelectMultipleField extends SelectField { await this.props.onValueSet('', value, await this.validate(value)) }, + onChange: async (value: string | Array | undefined) => { + let useV = value + if (Array.isArray(useV) && multiple !== true && multiple?.type === 'split') { + useV = useV.join(multiple.split || ',') + } + return await this.props.onValueSet('', useV, await this.validate(useV)) + }, onClear: this.props.config.canClear ? async () => { await this.props.onValueSet('', undefined, await this.validate(undefined)) } : undefined, disabled: getBoolean(disabled), readonly: getBoolean(readonly), diff --git a/src/components/formFields/treeSelect/index.tsx b/src/components/formFields/treeSelect/index.tsx index 6d3973a..6546deb 100644 --- a/src/components/formFields/treeSelect/index.tsx +++ b/src/components/formFields/treeSelect/index.tsx @@ -2,20 +2,42 @@ import React, { ReactNode } from 'react' import { get } from 'lodash' import { Field, FieldConfig, IField, FieldError, FieldProps } from '../common' import InterfaceHelper, { InterfaceConfig } from '../../../util/interface' +import ParamHelper from '../../../util/param' +import { RecordParamConfig, DataParamConfig, StepParamConfig, SourceParamConfig } from '../../../interface' +type OptionsConfigDefaultValue = RecordParamConfig | DataParamConfig | StepParamConfig | SourceParamConfig export interface TreeSelectFieldConfig extends FieldConfig { type: 'tree_select' - treeData?: ManualOptionsConfig | InterfaceOptionsConfig + mode?: 'tree' | 'table' + multiple?: true | TreeSelectMultipleArrayConfig | TreeSelectMultipleSplitConfig, + titleColumn: string, + treeData?: ManualOptionsConfig | InterfaceOptionsConfig | DefaultOptionsConfig +} + +interface TreeSelectMultipleArrayConfig { + type: 'array' +} + +interface TreeSelectMultipleSplitConfig { + type: 'split', + split?: string +} +export interface DefaultOptionsConfig { + from: 'automatic' + defaultValue?: OptionsConfigDefaultValue, + format?: InterfaceOptionsListConfig } export interface ManualOptionsConfig { from: 'manual' defaultIndex?: string | number - data?: Array<{ - value: string | number - title: string - [extra: string]: any - }> + data?: treeTableDataConfig[] +} + +export interface treeTableDataConfig { + value: any + title: string + children: treeTableDataConfig[] } export interface InterfaceOptionsConfig { @@ -36,36 +58,32 @@ export interface InterfaceOptionsListConfig { } export interface ISelectFieldOption { - value: string | number, - title: ReactNode, + key: any + value: any + title: ReactNode children?: Array } -interface treeData { - value: any, - title: string, - children?: treeData[] -} - -interface SelectSingleFieldState { - interfaceOptionsData: treeData[] +interface TreeSelectFieldState { + interfaceOptionsData: ISelectFieldOption[] } export interface ITreeSelectField { - value?: string, + value?: any, treeData: Array - onChange: (value: string) => Promise + titleColumn?: string + onChange: (value: any) => Promise } -export default class TreeSelectField extends Field implements IField { +export default class TreeSelectField extends Field | undefined> { interfaceHelper = new InterfaceHelper() interfaceOptionsConfig: string = '' - state: SelectSingleFieldState = { + state: TreeSelectFieldState = { interfaceOptionsData: [] } - constructor (props: FieldProps) { + constructor(props: FieldProps | undefined>) { super(props) this.state = { @@ -73,17 +91,26 @@ export default class TreeSelectField extends Field { + if (defaultValue !== undefined) { + return ParamHelper(defaultValue, { record: this.props.record, data: this.props.data, step: this.props.step }) + } + return undefined + } + formatTree = (treeList: any, value: string, title: string, children: string) => { - const rsMenu: treeData[] = [] + const rsMenu: ISelectFieldOption[] = [] treeList.forEach((val: any) => { - const theMenu: treeData = { + const theMenu: ISelectFieldOption = { title: '', - value: null + value: null, + key: null } theMenu.title = get(val, title) theMenu.value = get(val, value) + theMenu.key = get(val, value) if (get(val, children)) { theMenu.children = this.formatTree(get(val, children), value, title, children) @@ -95,7 +122,7 @@ export default class TreeSelectField extends Field { if (config) { - if (config.from === 'manual') { + if (config.from === 'automatic') { + if (config.defaultValue && config.defaultValue.source && config.defaultValue.field) { + const data = this.optionsAutomaticValue(config.defaultValue) + if (Array.isArray(data)) { + return this.formatTree( + data, + config.format?.keyField || 'value', + config.format?.titleField || 'title', + config.format?.childrenField || 'children' + ) + } + } + } else if (config.from === 'manual') { if (config.data) { return this.formatTree(config.data, 'value', 'title', 'children') } @@ -151,7 +190,7 @@ export default class TreeSelectField extends Field => { + validate = async (_value: string | Array | undefined): Promise => { const { config: { required @@ -169,11 +208,20 @@ export default class TreeSelectField extends Field { + renderTreeComponent = (props: ITreeSelectField) => { return - 您当前使用的UI版本没有实现TreeSelectSingleField组件的SelectSingle模式。 + 您当前使用的UI版本没有实现TreeSelectField组件的tree模式。
- + +
+ + } + + renderTableComponent = (props: ITreeSelectField) => { + return + 您当前使用的UI版本没有实现TreeSelectField组件的table模式。 +
+
} @@ -182,24 +230,54 @@ export default class TreeSelectField extends Field - {this.renderComponent({ - value, - treeData: this.state.interfaceOptionsData, - onChange: async (value: string) => await this.props.onValueSet('', value, await this.validate(value)) - })} - - ) + const temp = this.options(optionsConfig, { record, data, step }) + const props: ITreeSelectField = { + value: undefined, + treeData: this.state.interfaceOptionsData, + onChange: async (value: string | Array | undefined) => { + let useV = value + if (Array.isArray(useV) && multiple !== true && multiple?.type === 'split') { + useV = useV.join(multiple.split || ',') + } + return await this.props.onValueSet('', useV, await this.validate(useV)) + } + } + if (optionsConfig && (optionsConfig.from === 'manual' || optionsConfig.from === 'automatic')) { + props.treeData = temp + } + if (multiple === true || multiple?.type === 'array') { + if (Array.isArray(value)) { + props.value = (value as Array) + } else if (value !== undefined) { + props.value = undefined + console.warn('数组类型的树形选框的值需要是字符串或数值的数组。') + } + } else if (multiple?.type === 'split') { + if (typeof value === 'string') { + props.value = String(value).split(multiple.split || ',') + } else if (value !== undefined) { + props.value = undefined + console.warn('字符串分隔类型的树形选框的值需要是字符串。') + } + } else { + props.value = Array.isArray(value) ? value : undefined + } + + if (mode === 'table') { + props.titleColumn = titleColumn + return this.renderTableComponent(props) + } else { + return this.renderTreeComponent(props) + } } } diff --git a/src/interface.ts b/src/interface.ts index 1f55966..60a20c5 100644 --- a/src/interface.ts +++ b/src/interface.ts @@ -7,75 +7,84 @@ * - content: 内容 */ export interface RichStringConfig { - type: 'plain' | 'markdown' | 'html' - content: string + type: 'plain' | 'markdown' | 'html'; + content: string; } -export type ParamConfig = RecordParamConfig | DataParamConfig | StepParamConfig | SourceParamConfig | URLParamConfig | QueryParamConfig | HashParamConfig | InterfaceParamConfig | StaticParamConfig +export type ParamConfig = + | RecordParamConfig + | DataParamConfig + | StepParamConfig + | SourceParamConfig + | URLParamConfig + | QueryParamConfig + | HashParamConfig + | InterfaceParamConfig + | StaticParamConfig; -interface RecordParamConfig { - source: 'record' - field: string +export interface RecordParamConfig { + source: 'record'; + field: string; } -interface DataParamConfig { - source: 'data' - field: string +export interface DataParamConfig { + source: 'data'; + field: string; } -interface StepParamConfig { - source: 'step' - step: number - field: string +export interface StepParamConfig { + source: 'step'; + step: number; + field: string; } -interface SourceParamConfig { - source: 'source', - field: string +export interface SourceParamConfig { + source: 'source'; + field: string; } interface URLParamConfig { - source: 'url', - field: string + source: 'url'; + field: string; } interface QueryParamConfig { - source: 'query', - filed: any + source: 'query'; + filed: any; } interface HashParamConfig { - source: 'hash', - filed: any + source: 'hash'; + filed: any; } interface InterfaceParamConfig { - source: 'interface', + source: 'interface'; // api: { // url: string, // method: 'POST', // contentType: 'json', // withCredentials: true // }, - api: object, - apiResponse: string + api: object; + apiResponse: string; } interface StaticParamConfig { - source: 'static', - value: any + source: 'static'; + value: any; } /** * 表单/详情分栏配置定义 -* - * type: 分栏类型 -* - * - * span: 固定分栏 -* - * - * width: 宽度分栏 -* - * value: 分栏相关配置值 -* - * wrap: 分栏后是否换行 -* - * gap: 分栏边距 -*/ + * - * type: 分栏类型 + * - * - * span: 固定分栏 + * - * - * width: 宽度分栏 + * - * value: 分栏相关配置值 + * - * wrap: 分栏后是否换行 + * - * gap: 分栏边距 + */ export interface ColumnsConfig { - enable?: boolean - type?: 'span' | 'width' - value?: number | string, - wrap?: boolean - gap?: number | string - rowGap?: number | string + enable?: boolean; + type?: 'span' | 'width'; + value?: number | string; + wrap?: boolean; + gap?: number | string; + rowGap?: number | string; } -- Gitee From 23d2ec3ad3b30c2a549bb6e41ace5243472402f5 Mon Sep 17 00:00:00 2001 From: zjt Date: Thu, 24 Feb 2022 10:54:10 +0800 Subject: [PATCH 03/13] =?UTF-8?q?fix:=20=E8=A1=A5=E5=85=85export?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/util/enumeration.ts | 10 +++++----- 1 file changed, 5 insertions(+), 5 deletions(-) diff --git a/src/util/enumeration.ts b/src/util/enumeration.ts index 0b3c41d..f56f413 100644 --- a/src/util/enumeration.ts +++ b/src/util/enumeration.ts @@ -1,5 +1,5 @@ -import { InterfaceConfig } from "./interface"; -import { getValue } from "./value"; +import { InterfaceConfig } from './interface' +import { getValue } from './value' export type EnumerationOptionsConfig = ManualEnumerationOptionsConfig | InterfaceEnumerationOptionsConfig @@ -18,11 +18,11 @@ interface InterfaceEnumerationOptionsConfig { format?: InterfaceEnumerationOptionsKVConfig | InterfaceEnumerationOptionsListConfig } -interface InterfaceEnumerationOptionsKVConfig { +export interface InterfaceEnumerationOptionsKVConfig { type: 'kv' } -interface InterfaceEnumerationOptionsListConfig { +export interface InterfaceEnumerationOptionsListConfig { type: 'list' keyField: string labelField: string @@ -74,4 +74,4 @@ export default class EnumerationHelper { } return await EnumerationHelper._instance.options(config, interfaceRequire) } -} \ No newline at end of file +} -- Gitee From f597cd1d664e2317b9f4ea9b0e1fcf47e77c343a Mon Sep 17 00:00:00 2001 From: zjt Date: Thu, 24 Feb 2022 21:07:23 +0800 Subject: [PATCH 04/13] =?UTF-8?q?peat:=20=E4=BF=AE=E6=94=B9=E5=AD=97?= =?UTF-8?q?=E6=AE=B5=E5=90=8D&=E5=85=BC=E5=AE=B9mini?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/formFields/select/common.tsx | 12 +++--- .../formFields/treeSelect/index.tsx | 42 ++++++++++++++----- 2 files changed, 37 insertions(+), 17 deletions(-) diff --git a/src/components/formFields/select/common.tsx b/src/components/formFields/select/common.tsx index 2779ab8..550175d 100644 --- a/src/components/formFields/select/common.tsx +++ b/src/components/formFields/select/common.tsx @@ -19,7 +19,7 @@ type OptionsConfigDefaultValue = interface AutomaticEnumerationOptionsConfig { from: 'automatic'; - defaultValue?: OptionsConfigDefaultValue; + sourceConfig?: OptionsConfigDefaultValue; format?: | InterfaceEnumerationOptionsKVConfig | InterfaceEnumerationOptionsListConfig; @@ -55,9 +55,9 @@ export default class SelectField extends Fiel } } - optionsAutomaticValue = (defaultValue: OptionsConfigDefaultValue) => { - if (defaultValue !== undefined) { - return ParamHelper(defaultValue, { record: this.props.record, data: this.props.data, step: this.props.step }) + optionsAutomaticValue = (sourceConfig: OptionsConfigDefaultValue) => { + if (sourceConfig !== undefined) { + return ParamHelper(sourceConfig, { record: this.props.record, data: this.props.data, step: this.props.step }) } return undefined } @@ -67,8 +67,8 @@ export default class SelectField extends Fiel ) => { if (config) { if (config.from === 'automatic') { - if (config.defaultValue && config.defaultValue.source && config.defaultValue.field) { - const data = this.optionsAutomaticValue(config.defaultValue) + if (config.sourceConfig && config.sourceConfig.source && config.sourceConfig.field) { + const data = this.optionsAutomaticValue(config.sourceConfig) if (config.format) { if (config.format.type === 'kv') { return Object.keys(data).map((key) => ({ diff --git a/src/components/formFields/treeSelect/index.tsx b/src/components/formFields/treeSelect/index.tsx index 6546deb..405d701 100644 --- a/src/components/formFields/treeSelect/index.tsx +++ b/src/components/formFields/treeSelect/index.tsx @@ -10,8 +10,8 @@ export interface TreeSelectFieldConfig extends FieldConfig { type: 'tree_select' mode?: 'tree' | 'table' multiple?: true | TreeSelectMultipleArrayConfig | TreeSelectMultipleSplitConfig, - titleColumn: string, - treeData?: ManualOptionsConfig | InterfaceOptionsConfig | DefaultOptionsConfig + titleColumn?: string, + treeData?: ManualOptionsConfig | InterfaceOptionsConfig | AutomaticOptionsConfig } interface TreeSelectMultipleArrayConfig { @@ -22,9 +22,9 @@ interface TreeSelectMultipleSplitConfig { type: 'split', split?: string } -export interface DefaultOptionsConfig { +export interface AutomaticOptionsConfig { from: 'automatic' - defaultValue?: OptionsConfigDefaultValue, + sourceConfig?: OptionsConfigDefaultValue, format?: InterfaceOptionsListConfig } @@ -91,9 +91,9 @@ export default class TreeSelectField extends Field { - if (defaultValue !== undefined) { - return ParamHelper(defaultValue, { record: this.props.record, data: this.props.data, step: this.props.step }) + optionsAutomatic = (sourceConfig: OptionsConfigDefaultValue) => { + if (sourceConfig !== undefined) { + return ParamHelper(sourceConfig, { record: this.props.record, data: this.props.data, step: this.props.step }) } return undefined } @@ -122,7 +122,7 @@ export default class TreeSelectField extends Field { if (config) { if (config.from === 'automatic') { - if (config.defaultValue && config.defaultValue.source && config.defaultValue.field) { - const data = this.optionsAutomaticValue(config.defaultValue) + if (config.sourceConfig && config.sourceConfig.source && config.sourceConfig.field) { + const data = this.optionsAutomatic(config.sourceConfig) if (Array.isArray(data)) { return this.formatTree( data, @@ -208,6 +208,15 @@ export default class TreeSelectField extends Field { + return + 您当前使用的UI版本没有实现TreeSelectSingleField组件的SelectSingle模式。 +
+ +
+ + } + renderTreeComponent = (props: ITreeSelectField) => { return 您当前使用的UI版本没有实现TreeSelectField组件的tree模式。 @@ -255,6 +264,7 @@ export default class TreeSelectField extends Field) @@ -276,8 +286,18 @@ export default class TreeSelectField extends Field + {this.renderComponent({ + value, + treeData: this.state.interfaceOptionsData, + onChange: async (value: string) => await this.props.onValueSet('', value, await this.validate(value)) + })} + + ) } } } -- Gitee From 0501370816a331b77266d761247cf1fc19ab05b2 Mon Sep 17 00:00:00 2001 From: zjt Date: Fri, 25 Feb 2022 10:53:05 +0800 Subject: [PATCH 05/13] =?UTF-8?q?fix:=20=E5=8E=BB=E9=99=A4debug?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/formFields/treeSelect/index.tsx | 1 - 1 file changed, 1 deletion(-) diff --git a/src/components/formFields/treeSelect/index.tsx b/src/components/formFields/treeSelect/index.tsx index 405d701..33433a2 100644 --- a/src/components/formFields/treeSelect/index.tsx +++ b/src/components/formFields/treeSelect/index.tsx @@ -264,7 +264,6 @@ export default class TreeSelectField extends Field) -- Gitee From 3c1ebc2fea83b79c67b0691479141a7f03cf21a1 Mon Sep 17 00:00:00 2001 From: zjt Date: Fri, 25 Feb 2022 15:31:45 +0800 Subject: [PATCH 06/13] =?UTF-8?q?fix:=20select=E5=85=BC=E5=AE=B9=E5=80=BC?= =?UTF-8?q?=E4=B8=BA=E7=A9=BA=E5=AD=97=E7=AC=A6=E4=B8=B2=E7=9A=84=E6=83=85?= =?UTF-8?q?=E5=86=B5?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- package.json | 2 +- src/components/formFields/select/multiple/index.tsx | 2 +- src/components/formFields/treeSelect/index.tsx | 2 +- 3 files changed, 3 insertions(+), 3 deletions(-) diff --git a/package.json b/package.json index b1fc05e..a420bb7 100644 --- a/package.json +++ b/package.json @@ -85,4 +85,4 @@ "react": "^16.13.1", "react-dom": "^16.13.1" } -} +} \ No newline at end of file diff --git a/src/components/formFields/select/multiple/index.tsx b/src/components/formFields/select/multiple/index.tsx index 0d84ff1..9254fde 100644 --- a/src/components/formFields/select/multiple/index.tsx +++ b/src/components/formFields/select/multiple/index.tsx @@ -135,7 +135,7 @@ export default class SelectMultipleField extends SelectField Date: Fri, 25 Feb 2022 18:35:50 +0800 Subject: [PATCH 07/13] =?UTF-8?q?feat:=20=E5=AD=97=E7=AC=A6=E5=88=86?= =?UTF-8?q?=E9=9A=94=E5=A2=9E=E5=8A=A0=E5=80=BC=E7=B1=BB=E5=9E=8B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../formFields/select/multiple/index.tsx | 10 ++++--- .../formFields/treeSelect/index.tsx | 6 +++-- src/util/value.ts | 26 +++++++++++++++++-- 3 files changed, 34 insertions(+), 8 deletions(-) diff --git a/src/components/formFields/select/multiple/index.tsx b/src/components/formFields/select/multiple/index.tsx index 9254fde..262c998 100644 --- a/src/components/formFields/select/multiple/index.tsx +++ b/src/components/formFields/select/multiple/index.tsx @@ -1,5 +1,5 @@ import React from 'react' -import { getBoolean } from '../../../../util/value' +import { getBoolean, transformValueType } from '../../../../util/value' import { FieldError } from '../../common' import SelectField, { ISelectFieldOption, SelectFieldConfig } from '../common' @@ -17,7 +17,8 @@ interface SelectMultipleArrayConfig { interface SelectMultipleSplitConfig { type: 'split', - split?: string + split?: string, + valueType?: string } export interface ISelectMultipleField { @@ -136,7 +137,7 @@ export default class SelectMultipleField extends SelectField option.value) props.value.filter((v) => { - if (props.options.map((option) => option.value).includes(v.toString())) { + if (values.includes(v)) { return true } else { console.warn(`选择框的当前值中${v}不在选项中。`) diff --git a/src/components/formFields/treeSelect/index.tsx b/src/components/formFields/treeSelect/index.tsx index 21b5be9..9ed3fa9 100644 --- a/src/components/formFields/treeSelect/index.tsx +++ b/src/components/formFields/treeSelect/index.tsx @@ -4,6 +4,7 @@ import { Field, FieldConfig, IField, FieldError, FieldProps } from '../common' import InterfaceHelper, { InterfaceConfig } from '../../../util/interface' import ParamHelper from '../../../util/param' import { RecordParamConfig, DataParamConfig, StepParamConfig, SourceParamConfig } from '../../../interface' +import { transformValueType } from '../../../util/value' type OptionsConfigDefaultValue = RecordParamConfig | DataParamConfig | StepParamConfig | SourceParamConfig export interface TreeSelectFieldConfig extends FieldConfig { @@ -20,7 +21,8 @@ interface TreeSelectMultipleArrayConfig { interface TreeSelectMultipleSplitConfig { type: 'split', - split?: string + split?: string, + valueType?: string } export interface AutomaticOptionsConfig { from: 'automatic' @@ -273,7 +275,7 @@ export default class TreeSelectField extends Field { + switch (type) { + case 'string': + return list.map(v => String(v)) + + case 'number': + return list.map(v => +v) + + case 'boolean': + return list.map(v => Boolean(v)) + + default: + return list + } +} -- Gitee From 29e052f002b58dd37a26a1ce7f530702f049bb8b Mon Sep 17 00:00:00 2001 From: zjt Date: Thu, 14 Apr 2022 14:54:10 +0800 Subject: [PATCH 08/13] =?UTF-8?q?perf:=20=E8=A1=A5=E5=85=85=E5=8F=98?= =?UTF-8?q?=E9=87=8F=E7=B1=BB=E5=9E=8B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/formFields/select/multiple/index.tsx | 2 +- src/util/value.ts | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/formFields/select/multiple/index.tsx b/src/components/formFields/select/multiple/index.tsx index 262c998..ad0aca9 100644 --- a/src/components/formFields/select/multiple/index.tsx +++ b/src/components/formFields/select/multiple/index.tsx @@ -18,7 +18,7 @@ interface SelectMultipleArrayConfig { interface SelectMultipleSplitConfig { type: 'split', split?: string, - valueType?: string + valueType?: 'string' | 'number' | 'boolean' | undefined } export interface ISelectMultipleField { diff --git a/src/util/value.ts b/src/util/value.ts index d45ae5c..10cd4dd 100644 --- a/src/util/value.ts +++ b/src/util/value.ts @@ -128,7 +128,7 @@ export const listItemMove = (list: any[], currentIndex: number, sortType: 'up' | * @param type 值类型 * @returns value数组 */ -export const transformValueType = (list: any[], type: string | undefined) => { +export const transformValueType = (list: any[], type: 'string' | 'number' | 'boolean' | undefined) => { switch (type) { case 'string': return list.map(v => String(v)) -- Gitee From b1ebc67d4eaacdece8019fdef47d51c191416e8c Mon Sep 17 00:00:00 2001 From: zjt Date: Thu, 14 Apr 2022 16:26:18 +0800 Subject: [PATCH 09/13] =?UTF-8?q?perf:=20=E4=BF=AE=E6=94=B9=E5=8F=98?= =?UTF-8?q?=E9=87=8F=E5=90=8D=E5=92=8C=E8=A1=A5=E5=85=85=E7=B1=BB=E5=9E=8B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/formFields/select/common.tsx | 29 ++++++------------- .../formFields/treeSelect/index.tsx | 18 ++++++------ 2 files changed, 18 insertions(+), 29 deletions(-) diff --git a/src/components/formFields/select/common.tsx b/src/components/formFields/select/common.tsx index 550175d..2a621ec 100644 --- a/src/components/formFields/select/common.tsx +++ b/src/components/formFields/select/common.tsx @@ -2,24 +2,13 @@ import { ReactNode } from 'react' import EnumerationHelper, { EnumerationOptionsConfig, InterfaceEnumerationOptionsKVConfig, InterfaceEnumerationOptionsListConfig } from '../../../util/enumeration' import InterfaceHelper from '../../../util/interface' import { Field, FieldConfig, FieldProps, IField, Display, DisplayProps } from '../common' -import { - RecordParamConfig, - DataParamConfig, - StepParamConfig, - SourceParamConfig -} from '../../../interface' +import { ParamConfig } from '../../../interface' import ParamHelper from '../../../util/param' import { getValue } from '../../../util/value' -type OptionsConfigDefaultValue = - | RecordParamConfig - | DataParamConfig - | StepParamConfig - | SourceParamConfig; - -interface AutomaticEnumerationOptionsConfig { - from: 'automatic'; - sourceConfig?: OptionsConfigDefaultValue; +interface DataEnumerationOptionsConfig { + from: 'data'; + sourceConfig?: ParamConfig; format?: | InterfaceEnumerationOptionsKVConfig | InterfaceEnumerationOptionsListConfig; @@ -55,7 +44,7 @@ export default class SelectField extends Fiel } } - optionsAutomaticValue = (sourceConfig: OptionsConfigDefaultValue) => { + optionsDataValue = (sourceConfig: ParamConfig) => { if (sourceConfig !== undefined) { return ParamHelper(sourceConfig, { record: this.props.record, data: this.props.data, step: this.props.step }) } @@ -63,12 +52,12 @@ export default class SelectField extends Fiel } options = ( - config: EnumerationOptionsConfig | undefined | AutomaticEnumerationOptionsConfig + config: EnumerationOptionsConfig | undefined | DataEnumerationOptionsConfig ) => { if (config) { - if (config.from === 'automatic') { - if (config.sourceConfig && config.sourceConfig.source && config.sourceConfig.field) { - const data = this.optionsAutomaticValue(config.sourceConfig) + if (config.from === 'data') { + if (config.sourceConfig && config.sourceConfig.source) { + const data = this.optionsDataValue(config.sourceConfig) if (config.format) { if (config.format.type === 'kv') { return Object.keys(data).map((key) => ({ diff --git a/src/components/formFields/treeSelect/index.tsx b/src/components/formFields/treeSelect/index.tsx index 9ed3fa9..6095c81 100644 --- a/src/components/formFields/treeSelect/index.tsx +++ b/src/components/formFields/treeSelect/index.tsx @@ -12,7 +12,7 @@ export interface TreeSelectFieldConfig extends FieldConfig { mode?: 'tree' | 'table' multiple?: true | TreeSelectMultipleArrayConfig | TreeSelectMultipleSplitConfig, titleColumn?: string, - treeData?: ManualOptionsConfig | InterfaceOptionsConfig | AutomaticOptionsConfig + treeData?: ManualOptionsConfig | InterfaceOptionsConfig | DataOptionsConfig } interface TreeSelectMultipleArrayConfig { @@ -22,10 +22,10 @@ interface TreeSelectMultipleArrayConfig { interface TreeSelectMultipleSplitConfig { type: 'split', split?: string, - valueType?: string + valueType?: 'string' | 'number' | 'boolean' | undefined } -export interface AutomaticOptionsConfig { - from: 'automatic' +export interface DataOptionsConfig { + from: 'data' sourceConfig?: OptionsConfigDefaultValue, format?: InterfaceOptionsListConfig } @@ -93,7 +93,7 @@ export default class TreeSelectField extends Field { + optionsData = (sourceConfig: OptionsConfigDefaultValue) => { if (sourceConfig !== undefined) { return ParamHelper(sourceConfig, { record: this.props.record, data: this.props.data, step: this.props.step }) } @@ -124,7 +124,7 @@ export default class TreeSelectField extends Field { if (config) { - if (config.from === 'automatic') { + if (config.from === 'data') { if (config.sourceConfig && config.sourceConfig.source && config.sourceConfig.field) { - const data = this.optionsAutomatic(config.sourceConfig) + const data = this.optionsData(config.sourceConfig) if (Array.isArray(data)) { return this.formatTree( data, @@ -263,7 +263,7 @@ export default class TreeSelectField extends Field Date: Thu, 14 Apr 2022 17:21:13 +0800 Subject: [PATCH 10/13] =?UTF-8?q?perf:=20=E5=B7=B2=E9=80=89=E6=95=B0?= =?UTF-8?q?=E6=8D=AE=E9=9B=86=E6=88=90=E5=88=B0EnumerationHelper=E4=B8=AD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/formFields/select/common.tsx | 55 +++++---------------- src/steps/header/index.tsx | 14 ++++-- src/util/enumeration.ts | 55 +++++++++++++++++++-- 3 files changed, 71 insertions(+), 53 deletions(-) diff --git a/src/components/formFields/select/common.tsx b/src/components/formFields/select/common.tsx index 2a621ec..039461a 100644 --- a/src/components/formFields/select/common.tsx +++ b/src/components/formFields/select/common.tsx @@ -2,17 +2,6 @@ import { ReactNode } from 'react' import EnumerationHelper, { EnumerationOptionsConfig, InterfaceEnumerationOptionsKVConfig, InterfaceEnumerationOptionsListConfig } from '../../../util/enumeration' import InterfaceHelper from '../../../util/interface' import { Field, FieldConfig, FieldProps, IField, Display, DisplayProps } from '../common' -import { ParamConfig } from '../../../interface' -import ParamHelper from '../../../util/param' -import { getValue } from '../../../util/value' - -interface DataEnumerationOptionsConfig { - from: 'data'; - sourceConfig?: ParamConfig; - format?: - | InterfaceEnumerationOptionsKVConfig - | InterfaceEnumerationOptionsListConfig; -} export interface SelectFieldConfig extends FieldConfig { options?: EnumerationOptionsConfig @@ -44,41 +33,15 @@ export default class SelectField extends Fiel } } - optionsDataValue = (sourceConfig: ParamConfig) => { - if (sourceConfig !== undefined) { - return ParamHelper(sourceConfig, { record: this.props.record, data: this.props.data, step: this.props.step }) - } - return undefined - } - options = ( - config: EnumerationOptionsConfig | undefined | DataEnumerationOptionsConfig + config: EnumerationOptionsConfig | undefined ) => { if (config) { - if (config.from === 'data') { - if (config.sourceConfig && config.sourceConfig.source) { - const data = this.optionsDataValue(config.sourceConfig) - if (config.format) { - if (config.format.type === 'kv') { - return Object.keys(data).map((key) => ({ - value: key, - label: data[key] - })) - } else if (config.format.type === 'list') { - if (Array.isArray(data)) { - return data.map((item: any) => { - return { - value: getValue(item, (config.format as InterfaceEnumerationOptionsListConfig).keyField), - label: getValue(item, (config.format as InterfaceEnumerationOptionsListConfig).labelField) - } - }) - } - } - } - } - return [] - } - EnumerationHelper.options(config, (config, source) => this.interfaceHelper.request(config, source, { record: this.props.record, data: this.props.data, step: this.props.step }, { loadDomain: this.props.loadDomain })).then((options) => { + EnumerationHelper.options( + config, + (config, source) => this.interfaceHelper.request(config, source, { record: this.props.record, data: this.props.data, step: this.props.step }, { loadDomain: this.props.loadDomain }), + { record: this.props.record, data: this.props.data, step: this.props.step } + ).then((options) => { if (JSON.stringify(this.state.options) !== JSON.stringify(options)) { this.setState({ options @@ -107,7 +70,11 @@ export class SelectDisplay extends Display { if (config) { - EnumerationHelper.options(config, (config, source) => this.interfaceHelper.request(config, source, { record: this.props.record, data: this.props.data, step: this.props.step }, { loadDomain: this.props.loadDomain })).then((options) => { + EnumerationHelper.options( + config, + (config, source) => this.interfaceHelper.request(config, source, { record: this.props.record, data: this.props.data, step: this.props.step }, { loadDomain: this.props.loadDomain }), + { record: this.props.record, data: this.props.data, step: this.props.step } + ).then((options) => { if (JSON.stringify(this.state.options) !== JSON.stringify(options)) { this.setState({ options diff --git a/src/steps/header/index.tsx b/src/steps/header/index.tsx index a7ec2d7..d693a2e 100644 --- a/src/steps/header/index.tsx +++ b/src/steps/header/index.tsx @@ -226,9 +226,9 @@ export default class HeaderStep extends Step { ref={(e: Step | null) => { e && e.stepPush() }} data={this.props.data} step={this.props.step} - onSubmit={async (data, unmountView) => {}} - onMount={async () => {}} - onUnmount={async (reload = false, data) => {}} + onSubmit={async (data, unmountView) => { }} + onMount={async () => { }} + onUnmount={async (reload = false, data) => { }} config={merge(config, defaultConfig)} baseRoute={this.props.baseRoute} checkPageAuth={this.props.checkPageAuth} @@ -252,7 +252,11 @@ export default class HeaderStep extends Step { }) case 'enumeration': if (statistic.options) { - EnumerationHelper.options(statistic.options, (config, source) => this.interfaceHelper.request(config, source, { data: this.props.data, step: this.props.step }, { loadDomain: this.props.loadDomain })).then((options) => { + EnumerationHelper.options( + statistic.options, + (config, source) => this.interfaceHelper.request(config, source, { data: this.props.data, step: this.props.step }, { loadDomain: this.props.loadDomain }), + { data: this.props.data, step: this.props.step } + ).then((options) => { if (!this.state || JSON.stringify(this.state[`statistic_options_${_position}_${index}`]) !== JSON.stringify(options)) { this.setState({ [`statistic_options_${_position}_${index}`]: options @@ -289,7 +293,7 @@ export default class HeaderStep extends Step { } } - render () { + render() { const props: IHeaderProps = {} if (this.props.config.breadcrumb && this.props.config.breadcrumb.enable) { diff --git a/src/util/enumeration.ts b/src/util/enumeration.ts index f56f413..9ded388 100644 --- a/src/util/enumeration.ts +++ b/src/util/enumeration.ts @@ -1,7 +1,9 @@ import { InterfaceConfig } from './interface' import { getValue } from './value' +import { ParamConfig } from '../interface' +import ParamHelper from './param' -export type EnumerationOptionsConfig = ManualEnumerationOptionsConfig | InterfaceEnumerationOptionsConfig +export type EnumerationOptionsConfig = ManualEnumerationOptionsConfig | InterfaceEnumerationOptionsConfig | DataEnumerationOptionsConfig interface ManualEnumerationOptionsConfig { from: 'manual' @@ -18,6 +20,14 @@ interface InterfaceEnumerationOptionsConfig { format?: InterfaceEnumerationOptionsKVConfig | InterfaceEnumerationOptionsListConfig } +interface DataEnumerationOptionsConfig { + from: 'data'; + sourceConfig?: ParamConfig; + format?: + | InterfaceEnumerationOptionsKVConfig + | InterfaceEnumerationOptionsListConfig; +} + export interface InterfaceEnumerationOptionsKVConfig { type: 'kv' } @@ -31,7 +41,18 @@ export interface InterfaceEnumerationOptionsListConfig { export default class EnumerationHelper { static _instance: EnumerationHelper - public async options (config: EnumerationOptionsConfig, interfaceRequire: (config: InterfaceConfig, source: any) => Promise) { + optionsDataValue = (sourceConfig: ParamConfig, datas: { record?: object, data: object[], step: number }) => { + if (sourceConfig !== undefined) { + return ParamHelper(sourceConfig, datas) + } + return undefined + } + + public async options( + config: EnumerationOptionsConfig, + interfaceRequire: (config: InterfaceConfig, source: any) => Promise, + datas: { record?: object, data: object[], step: number } + ) { if (config) { if (config.from === 'manual') { if (config.data) { @@ -63,15 +84,41 @@ export default class EnumerationHelper { } } } + } else if (config.from === 'data') { + if (config.sourceConfig && config.sourceConfig.source) { + const data = ParamHelper(config.sourceConfig, datas) + if (config.format) { + if (config.format.type === 'kv') { + return Object.keys(data).map((key) => ({ + value: key, + label: data[key] + })) + } else if (config.format.type === 'list') { + if (Array.isArray(data)) { + return data.map((item: any) => { + return { + value: getValue(item, (config.format as InterfaceEnumerationOptionsListConfig).keyField), + label: getValue(item, (config.format as InterfaceEnumerationOptionsListConfig).labelField) + } + }) + } + } + } + } + return [] } } return [] } - static async options (config: EnumerationOptionsConfig, interfaceRequire: (config: InterfaceConfig, source: any) => Promise) { + static async options( + config: EnumerationOptionsConfig, + interfaceRequire: (config: InterfaceConfig, source: any) => Promise, + datas: { record?: object, data: object[], step: number } + ) { if (!EnumerationHelper._instance) { EnumerationHelper._instance = new EnumerationHelper() } - return await EnumerationHelper._instance.options(config, interfaceRequire) + return await EnumerationHelper._instance.options(config, interfaceRequire, datas) } } -- Gitee From 3f66233f6215f9705224dc44242e43c7f67410d9 Mon Sep 17 00:00:00 2001 From: zjt Date: Thu, 14 Apr 2022 17:28:00 +0800 Subject: [PATCH 11/13] =?UTF-8?q?perf:=20=E4=BF=AE=E6=94=B9=E5=8F=98?= =?UTF-8?q?=E9=87=8F=E5=90=8D?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/formFields/treeSelect/index.tsx | 12 ++++++------ 1 file changed, 6 insertions(+), 6 deletions(-) diff --git a/src/components/formFields/treeSelect/index.tsx b/src/components/formFields/treeSelect/index.tsx index 6095c81..5af5bde 100644 --- a/src/components/formFields/treeSelect/index.tsx +++ b/src/components/formFields/treeSelect/index.tsx @@ -59,20 +59,20 @@ export interface InterfaceOptionsListConfig { childrenField?: string } -export interface ISelectFieldOption { +export interface TreeSelectFieldOption { key: any value: any title: ReactNode - children?: Array + children?: Array } interface TreeSelectFieldState { - interfaceOptionsData: ISelectFieldOption[] + interfaceOptionsData: TreeSelectFieldOption[] } export interface ITreeSelectField { value?: any, - treeData: Array + treeData: Array titleColumn?: string onChange: (value: any) => Promise } @@ -101,10 +101,10 @@ export default class TreeSelectField extends Field { - const rsMenu: ISelectFieldOption[] = [] + const rsMenu: TreeSelectFieldOption[] = [] treeList.forEach((val: any) => { - const theMenu: ISelectFieldOption = { + const theMenu: TreeSelectFieldOption = { title: '', value: null, key: null -- Gitee From aeb85ae3bd4cf850cfa391bda39b7acb973f0f48 Mon Sep 17 00:00:00 2001 From: zjt Date: Thu, 14 Apr 2022 17:59:28 +0800 Subject: [PATCH 12/13] =?UTF-8?q?perf:=20=E6=A0=87=E6=98=8E=E7=B1=BB?= =?UTF-8?q?=E5=9E=8B?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/components/formFields/treeSelect/index.tsx | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/src/components/formFields/treeSelect/index.tsx b/src/components/formFields/treeSelect/index.tsx index 5af5bde..38d3e07 100644 --- a/src/components/formFields/treeSelect/index.tsx +++ b/src/components/formFields/treeSelect/index.tsx @@ -9,7 +9,7 @@ import { transformValueType } from '../../../util/value' type OptionsConfigDefaultValue = RecordParamConfig | DataParamConfig | StepParamConfig | SourceParamConfig export interface TreeSelectFieldConfig extends FieldConfig { type: 'tree_select' - mode?: 'tree' | 'table' + mode?: 'tree' | 'table' | 'treeSelect' multiple?: true | TreeSelectMultipleArrayConfig | TreeSelectMultipleSplitConfig, titleColumn?: string, treeData?: ManualOptionsConfig | InterfaceOptionsConfig | DataOptionsConfig @@ -212,7 +212,7 @@ export default class TreeSelectField extends Field { return - 您当前使用的UI版本没有实现TreeSelectSingleField组件的SelectSingle模式。 + 您当前使用的UI版本没有实现TreeSelectField组件的treeSelect模式。
-- Gitee From 52b6c15439168efd05aaf47473bc8f5b7c5aec88 Mon Sep 17 00:00:00 2001 From: zjt Date: Thu, 14 Apr 2022 18:33:00 +0800 Subject: [PATCH 13/13] =?UTF-8?q?perf:=20=E5=8E=BB=E6=8E=89any?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../formFields/treeSelect/index.tsx | 30 ++++++++++--------- 1 file changed, 16 insertions(+), 14 deletions(-) diff --git a/src/components/formFields/treeSelect/index.tsx b/src/components/formFields/treeSelect/index.tsx index 38d3e07..00874d0 100644 --- a/src/components/formFields/treeSelect/index.tsx +++ b/src/components/formFields/treeSelect/index.tsx @@ -37,7 +37,7 @@ export interface ManualOptionsConfig { } export interface treeTableDataConfig { - value: any + value: string | number title: string children: treeTableDataConfig[] } @@ -60,8 +60,8 @@ export interface InterfaceOptionsListConfig { } export interface TreeSelectFieldOption { - key: any - value: any + key?: string | number + value: string | number, title: ReactNode children?: Array } @@ -70,14 +70,16 @@ interface TreeSelectFieldState { interfaceOptionsData: TreeSelectFieldOption[] } +type TreeSelectValueType = string | Array | undefined + export interface ITreeSelectField { - value?: any, + value: TreeSelectValueType, treeData: Array titleColumn?: string - onChange: (value: any) => Promise + onChange: (value: TreeSelectValueType) => Promise } -export default class TreeSelectField extends Field | undefined> { +export default class TreeSelectField extends Field { interfaceHelper = new InterfaceHelper() interfaceOptionsConfig: string = '' @@ -85,7 +87,7 @@ export default class TreeSelectField extends Field | undefined>) { + constructor(props: FieldProps) { super(props) this.state = { @@ -100,14 +102,14 @@ export default class TreeSelectField extends Field { + formatTree = (treeList: Array, value: string, title: string, children: string) => { const rsMenu: TreeSelectFieldOption[] = [] - treeList.forEach((val: any) => { + treeList.forEach((val: TreeSelectFieldOption) => { const theMenu: TreeSelectFieldOption = { title: '', - value: null, - key: null + value: '', + key: '' } theMenu.title = get(val, title) @@ -192,7 +194,7 @@ export default class TreeSelectField extends Field | undefined): Promise => { + validate = async (_value: TreeSelectValueType): Promise => { const { config: { required @@ -255,7 +257,7 @@ export default class TreeSelectField extends Field | undefined) => { + onChange: async (value: TreeSelectValueType) => { let useV = value if (Array.isArray(useV) && multiple !== true && multiple?.type === 'split') { useV = useV.join(multiple.split || ',') @@ -295,7 +297,7 @@ export default class TreeSelectField extends Field await this.props.onValueSet('', value, await this.validate(value)) + onChange: async (value: TreeSelectValueType) => await this.props.onValueSet('', value, await this.validate(value)) })} ) -- Gitee