From 99ad146f97ffb625ca564fb690fb4554e9930461 Mon Sep 17 00:00:00 2001 From: Janry Date: Tue, 2 Jun 2020 12:11:10 +0800 Subject: [PATCH] fix(components): fix datepicker format and checkbox editable style (#881) --- docs/zh-cn/schema-develop/form-schema.md | 82 +++++++++---------- .../antd-components/src/checkbox/index.tsx | 3 +- .../antd-components/src/date-picker/index.tsx | 5 +- packages/antd-components/src/radio/index.tsx | 3 +- .../next-components/src/checkbox/index.tsx | 3 +- .../next-components/src/date-picker/index.tsx | 7 +- packages/next-components/src/radio/index.tsx | 3 +- .../react-schema-renderer/README.zh-cn.md | 4 +- 8 files changed, 52 insertions(+), 58 deletions(-) diff --git a/docs/zh-cn/schema-develop/form-schema.md b/docs/zh-cn/schema-develop/form-schema.md index 64f7d2babf8..6e5bfc4421c 100644 --- a/docs/zh-cn/schema-develop/form-schema.md +++ b/docs/zh-cn/schema-develop/form-schema.md @@ -52,47 +52,47 @@ Schema 开发，最核心的就是 Schema，只有我们理解了这套协议之 ## 属性 -| 属性名 | 描述 | 类型 | -| -------------------- | -------------------------------------- | ----------------------------------------------------------------- | -| title | 字段标题 | `React.ReactNode` | -| name | 字段所属的父节点属性名 | `string` | -| description | 字段描述 | `React.ReactNode` | -| default | 字段默认值 | `any` | -| readOnly | 是否只读与 editable 一致 | `boolean` | -| type | 字段类型 | `'string' | 'object' | 'array' | 'number' | string` | -| enum | 枚举数据 | `Array` | -| const | 校验字段值是否与 const 的值相等 | `any` | -| multipleOf | 校验字段值是否可被 multipleOf 的值整除 | `number` | -| maximum | 校验最大值(大于) | `number` | -| exclusiveMaximum | 校验最大值（大于等于） | `number` | -| minimum | 校验最小值(小于) | `number` | -| exclusiveMinimum | 最小值（小于等于） | `number` | -| maxLength | 校验最大长度 | `number` | -| minLength | 校验最小长度 | `number` | -| pattern | 正则校验规则 | `string | RegExp` | -| maxItems | 最大条目数 | `number` | -| minItems | 最小条目数 | `number` | -| uniqueItems | 是否校验重复 | `boolean` | -| maxProperties | 最大属性数量 | `number` | -| minProperties | 最小属性数量 | `number` | -| required | 必填 | `boolean` | -| format | 正则规则类型，详细类型可以往后看 | `InternalFormats` | -| properties | 对象属性 | `{[key : string]:Schema}` | -| items | 数组描述 | `Schema | Schema[]` | -| additionalItems | 额外数组元素描述 | `Schema` | -| patternProperties | 动态匹配对象的某个属性的 Schema | `{[key : string]:Schema}` | -| additionalProperties | 匹配对象额外属性的 Schema | `Schema` | -| triggerType | 字段校验时机 | `"onChange" | "onBlur"` | -| editable | 字段是否可编辑 | `boolean` | -| visible | 字段是否可见(数据+样式) | `boolean` | -| display | 字段样式是否可见 | `boolean` | -| x-props | 字段扩展属性 | `{ [name: string]: any }` | -| x-index | 字段顺序 | `number` | -| x-rules | 字段校验规则，详细描述可以往后看 | [ValidatePatternRules](#validatepatternrules) | -| x-component | 字段 UI 组件名称，大小写不敏感 | `string` | -| x-component-props | 字段 UI 组件属性 | `{}` | -| x-linkages | 字段间联动协议，详细描述可以往后看 | `Array<{ target: FormPathPattern, type: string, [key: string]: any }>` | -| x-mega-props | 字段布局属性 | `{ [name: string]: any }` | +| 属性名 | 描述 | 类型 | +| -------------------- | -------------------------------------- | ---------------------------------------------------------------------- | +| title | 字段标题 | `React.ReactNode` | +| name | 字段所属的父节点属性名 | `string` | +| description | 字段描述 | `React.ReactNode` | +| default | 字段默认值 | `any` | +| readOnly | 是否只读与 editable 一致 | `boolean` | +| type | 字段类型 | `'string' | 'object' | 'array' | 'number' | string` | +| enum | 枚举数据 | `Array` | +| const | 校验字段值是否与 const 的值相等 | `any` | +| multipleOf | 校验字段值是否可被 multipleOf 的值整除 | `number` | +| maximum | 校验最大值(大于) | `number` | +| exclusiveMaximum | 校验最大值（大于等于） | `number` | +| minimum | 校验最小值(小于) | `number` | +| exclusiveMinimum | 最小值（小于等于） | `number` | +| maxLength | 校验最大长度 | `number` | +| minLength | 校验最小长度 | `number` | +| pattern | 正则校验规则 | `string | RegExp` | +| maxItems | 最大条目数 | `number` | +| minItems | 最小条目数 | `number` | +| uniqueItems | 是否校验重复 | `boolean` | +| maxProperties | 最大属性数量 | `number` | +| minProperties | 最小属性数量 | `number` | +| required | 必填 | `boolean` | +| format | 正则规则类型，详细类型可以往后看 | `InternalFormats` | +| properties | 对象属性 | `{[key : string]:Schema}` | +| items | 数组描述 | `Schema | Schema[]` | +| additionalItems | 额外数组元素描述 | `Schema` | +| patternProperties | 动态匹配对象的某个属性的 Schema | `{[key : string]:Schema}` | +| additionalProperties | 匹配对象额外属性的 Schema | `Schema` | +| triggerType | 字段校验时机 | `"onChange" | "onBlur"` | +| editable | 字段是否可编辑 | `boolean` | +| visible | 字段是否可见(数据+样式) | `boolean` | +| display | 字段样式是否可见 | `boolean` | +| x-props | 字段扩展属性 | `{ [name: string]: any }` | +| x-index | 字段顺序 | `number` | +| x-rules | 字段校验规则，详细描述可以往后看 | [ValidatePatternRules](#validatepatternrules) | +| x-component | 字段 UI 组件名称，大小写不敏感 | `string` | +| x-component-props | 字段 UI 组件属性 | `{}` | +| x-linkages | 字段间联动协议，详细描述可以往后看 | `Array<{ target: FormPathPattern, type: string, [key: string]: any }>` | +| x-mega-props | 字段布局属性 | `{ [name: string]: any }` | ## x-props 扩展属性 diff --git a/packages/antd-components/src/checkbox/index.tsx b/packages/antd-components/src/checkbox/index.tsx index 6ef05588d6a..e9b6fd55e0f 100644 --- a/packages/antd-components/src/checkbox/index.tsx +++ b/packages/antd-components/src/checkbox/index.tsx @@ -10,8 +10,7 @@ import { export const Checkbox = connect<'Group'>({ valueName: 'checked', - getProps: mapStyledProps, - getComponent: mapTextComponent + getProps: mapStyledProps })(AntdCheckbox) Checkbox.Group = connect({ diff --git a/packages/antd-components/src/date-picker/index.tsx b/packages/antd-components/src/date-picker/index.tsx index 23836e1bde7..d8e5cabdf45 100644 --- a/packages/antd-components/src/date-picker/index.tsx +++ b/packages/antd-components/src/date-picker/index.tsx @@ -51,7 +51,7 @@ export const DatePicker = connect< const props = this.props || {} return transformMoment( value, - props.showTime ? 'YYYY-MM-DD HH:mm:ss' : 'YYYY-MM-DD' + props.format || (props.showTime ? 'YYYY-MM-DD HH:mm:ss' : 'YYYY-MM-DD') ) }, getProps: compose(mapStyledProps, mapMomentValue), @@ -61,7 +61,8 @@ export const DatePicker = connect< DatePicker.RangePicker = connect({ getValueFromEvent(_, [startDate, endDate]) { const props = this.props || {} - const format = props.showTime ? 'YYYY-MM-DD HH:mm:ss' : 'YYYY-MM-DD' + const format = + props.format || (props.showTime ? 'YYYY-MM-DD HH:mm:ss' : 'YYYY-MM-DD') return [ transformMoment(startDate, format), transformMoment(endDate, format) diff --git a/packages/antd-components/src/radio/index.tsx b/packages/antd-components/src/radio/index.tsx index b1af2b17e29..c2c3db9dc4d 100644 --- a/packages/antd-components/src/radio/index.tsx +++ b/packages/antd-components/src/radio/index.tsx @@ -8,8 +8,7 @@ import { export const Radio = connect<'Group'>({ valueName: 'checked', - getProps: mapStyledProps, - getComponent: mapTextComponent + getProps: mapStyledProps })(AntdRadio) Radio.Group = connect({ diff --git a/packages/next-components/src/checkbox/index.tsx b/packages/next-components/src/checkbox/index.tsx index 459920c87fc..42bab978870 100644 --- a/packages/next-components/src/checkbox/index.tsx +++ b/packages/next-components/src/checkbox/index.tsx @@ -4,8 +4,7 @@ import { mapStyledProps, mapTextComponent } from '../shared' export const Checkbox = connect<'Group'>({ valueName: 'checked', - getProps: mapStyledProps, - getComponent: mapTextComponent + getProps: mapStyledProps })(NextCheckbox) Checkbox.Group = connect({ diff --git a/packages/next-components/src/date-picker/index.tsx b/packages/next-components/src/date-picker/index.tsx index 67a9439bf18..5619b5ec650 100644 --- a/packages/next-components/src/date-picker/index.tsx +++ b/packages/next-components/src/date-picker/index.tsx @@ -11,13 +11,10 @@ const transformMoment = (value, format = 'YYYY-MM-DD HH:mm:ss') => { const getFormatFromProps = props => { if (props.showTime) { if (typeof props.showTime === 'boolean') { - return 'YYYY-MM-DD HH:mm:ss' - } else if ('format' in props.showTime) { - return `YYYY-MM-DD ${props.showTime.format}` + return props.format || 'YYYY-MM-DD HH:mm:ss' } - } else { - return 'YYYY-MM-DD' } + return props.format || 'YYYY-MM-DD' } export const DatePicker = connect< diff --git a/packages/next-components/src/radio/index.tsx b/packages/next-components/src/radio/index.tsx index 5607c0dd995..f413ad70280 100644 --- a/packages/next-components/src/radio/index.tsx +++ b/packages/next-components/src/radio/index.tsx @@ -4,8 +4,7 @@ import { mapStyledProps, mapTextComponent } from '../shared' export const Radio = connect<'Group'>({ valueName: 'checked', - getProps: mapStyledProps, - getComponent: mapTextComponent + getProps: mapStyledProps })(NextRadio) Radio.Group = connect({ diff --git a/packages/react-schema-renderer/README.zh-cn.md b/packages/react-schema-renderer/README.zh-cn.md index ad7a7094ae5..328b17eb825 100644 --- a/packages/react-schema-renderer/README.zh-cn.md +++ b/packages/react-schema-renderer/README.zh-cn.md @@ -938,8 +938,8 @@ cleanRegistry(): void | x-component-props | 字段 UI 组件属性 | `{}` | | x-render | 字段扩展渲染函数 | `(props: T & { renderComponent: () => React.ReactElement}) => React.ReactElement` | | x-effect | 字段副作用触发器 | `(dispatch: (type: string, payload: any) => void,option?:object) => { [key: string]: any }` | -| x-linkages | 字段间联动协议，详细描述可以往后看 | `Array<{ target: FormPathPattern, type: string, [key: string]: any }>` | -| x-mega-props | 字段布局属性 | `{ [name: string]: any }` | +| x-linkages | 字段间联动协议，详细描述可以往后看 | `Array<{ target: FormPathPattern, type: string, [key: string]: any }>` | +| x-mega-props | 字段布局属性 | `{ [name: string]: any }` | **方法**