颜色选择器支持定制默认颜色

This commit is contained in:
catchonme 2019-08-01 19:45:04 +08:00
parent 6b51c8d547
commit 7190bbd980
4 changed files with 8 additions and 0 deletions

View File

@ -11,6 +11,8 @@
- `extractValue` 默认为 `false`, `joinValues`设置为`false`时生效, 开启后将选中的选项 value 的值封装为数组,作为当前表单项的值。
- `delimiter` 默认为 `,`
- `columnsCount` 默认为 `1` 可以配置成一行显示多个。
- `checkAll` 默认为 `false` 开启后支持全选
- `defaultCheckAll` 是否默认全选,默认为`false`
- **还有更多通用配置请参考** [FormItem](./FormItem.md)
```schema:height="330" scope="form"

View File

@ -4,6 +4,8 @@
- `type` 请设置成 `color`
- `format` 请选择 `hex`、`hls`、`rgb`或者`rgba`。默认为 `hex`
- `presetColors` 选择器底部的默认颜色
- 默认为`['#D0021B', '#F5A623', '#F8E71C', '#8B572A', '#7ED321', '#417505', '#BD10E0', '#9013FE', '#4A90E2', '#50E3C2', '#B8E986', '#000000', '#4A4A4A', '#9B9B9B', '#FFFFFF']`,数组内为空则不显示默认颜色
- `clearable` 是否显示清除按钮。
```schema:height="400" scope="form-item"

View File

@ -27,6 +27,7 @@ export interface ColorProps {
classPrefix: string;
classnames: ClassNamesFn;
onChange: (value: any) => void;
presetColors?: string[];
}
export interface ColorControlState {
@ -178,6 +179,7 @@ export class ColorControl extends React.PureComponent<ColorProps, ColorControlSt
clearable,
placement,
classnames: cx,
presetColors
} = this.props;
const isOpened = this.state.isOpened;
@ -236,6 +238,7 @@ export class ColorControl extends React.PureComponent<ColorProps, ColorControlSt
<SketchPicker
disableAlpha={!!~['rgb', 'hex'].indexOf(format as string)}
color={value}
presetColors={presetColors}
onChangeComplete={this.handleChange}
/>
</PopOver>

View File

@ -11,6 +11,7 @@ export interface ColorProps extends FormControlProps {
format?: string;
timeConstrainst?: object;
closeOnSelect?:boolean;
presetColors?: string[];
};
export interface ColorControlState {