test/amis2
1
0
Fork 0
mirror of https://gitee.com/baidu/amis.git synced 2024-12-02 12:08:13 +08:00
Code Issues Actions 2 Packages Projects Releases Wiki Activity

优化 radios

Browse Source
This commit is contained in:
liaoxuezhi 2019-09-17 21:53:32 +08:00
parent dd322cf592
commit 8ed2c7c8d5
7 changed files with 30 additions and 12 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

5
scss/components/form/_checks.scss
View File

@ -215,6 +215,11 @@
}
}
}
&-desc {
color: $text--muted-color;
margin-left: $Checkbox-gap;
}
}
.#{$ns}CheckboxControl,

14
src/components/Checkbox.tsx
View File

@ -7,6 +7,7 @@ import React from 'react';
import cx from 'classnames';
import {ClassNamesFn, themeable} from '../theme';
import {autobind} from '../utils/helper';
import { filter } from '../utils/tpl';
const sizeMap = {
sm: 'i-checks-sm',
@ -33,9 +34,11 @@ interface CheckboxProps {
readOnly?: boolean;
checked?: boolean;
name?: string;
description?: string;
classPrefix: string;
classnames: ClassNamesFn;
partial?: boolean;
data?: any;
}
export class Checkbox extends React.Component<CheckboxProps, any> {
@ -60,17 +63,19 @@ export class Checkbox extends React.Component<CheckboxProps, any> {
let {
size,
className,
classPrefix: ns,
classnames: cx,
value,
label,
partial,
trueValue,
children,
disabled,
description,
readOnly,
checked,
type,
name
name,
data
} = this.props;
className = (className ? className : '') + (size && sizeMap[size] ? ` ${sizeMap[size]}` : '');
@ -78,9 +83,9 @@ export class Checkbox extends React.Component<CheckboxProps, any> {
return (
<label
className={cx(
`${ns}Checkbox ${ns}Checkbox--${type}`,
`Checkbox Checkbox--${type}`,
{
[`${ns}Checkbox--full`]: !partial
'Checkbox--full': !partial
},
className
)}
@ -101,6 +106,7 @@ export class Checkbox extends React.Component<CheckboxProps, any> {
/>
<i />
<span>{children || label}</span>
{description ? (<div className={cx("Checkbox-desc")}>{filter(description, data)}</div>) : null}
</label>
);
}

7
src/components/Checkboxes.tsx
View File

@ -9,7 +9,7 @@ import uncontrollable = require('uncontrollable');
import Checkbox from './Checkbox';
import find = require('lodash/find');
import chunk = require('lodash/chunk');
import {flattenTree} from '../utils/helper';
import {flattenTree, isObject} from '../utils/helper';
import {Option} from './Checkboxes';
import {ClassNamesFn, themeable} from '../theme';
// import isPlainObject = require('lodash/isPlainObject');
@ -19,6 +19,7 @@ export interface Option {
value?: any;
disabled?: boolean;
children?: Options;
description?: string;
[propName: string]: any;
}
export interface Options extends Array<Option> {}
@ -80,11 +81,11 @@ export function expandValue(value: OptionValue, props: Partial<OptionProps>): Op
return null;
}
if (valueType === 'object') {
if (valueType === 'object' && props.joinValues !== false) {
value = (value as Option)[valueField || 'value'] || '';
}
return find(flattenTree(options), item => String(item[valueField || 'value']) === String(value)) as Option;
return find(flattenTree(options), item => isObject(value) ? item[valueField || 'value'] === value : String(item[valueField || 'value']) === String(value)) as Option;
}
/**

7
src/components/Radios.tsx
View File

@ -93,6 +93,7 @@ export class Radios extends React.Component<RadioProps, any> {
checked={!!~valueArray.indexOf(option)}
className={cx(itemClassName, option.className)}
disabled={disabled || option.disabled}
description={option.description}
inline={inline}
>
{option.label}
@ -108,6 +109,8 @@ export class Radios extends React.Component<RadioProps, any> {
classnames: cx,
placeholder,
columnsCount,
joinValues,
extractValue,
disabled,
inline,
delimiter,
@ -119,7 +122,9 @@ export class Radios extends React.Component<RadioProps, any> {
multiple: false,
delimiter,
valueField,
options
options,
joinValues,
extractValue
});
let body: Array<React.ReactNode> = [];

1
src/components/Select.tsx
View File

@ -30,6 +30,7 @@ export interface Option {
children?: Options;
visible?: boolean;
hidden?: boolean;
description?: string;
[propName: string]: any;
}
export interface Options extends Array<Option> {}

2
src/store/crud.ts
View File

@ -243,7 +243,7 @@ export const CRUDStore = ServiceStore.named('CRUDStore')
self.updateMessage(json.msg || options.successMessage);
// 配置了获取成功提示后提示，默认是空不会提示。
self.msg && (getRoot(self) as IRendererStore).notify('success', self.msg);
options && options.successMessage && (getRoot(self) as IRendererStore).notify('success', self.msg);
}
self.markFetching(false);

6
src/store/service.ts
View File

@ -93,7 +93,7 @@ export const ServiceStore = iRendererStore
updateMessage(json.msg || (options && options.successMessage));
// 配置了获取成功提示后提示，默认是空不会提示。
self.msg && (getRoot(self) as IRendererStore).notify('success', self.msg);
options && options.successMessage && (getRoot(self) as IRendererStore).notify('success', self.msg);
}
@ -161,7 +161,7 @@ export const ServiceStore = iRendererStore
updateMessage(json.msg || (options && options.successMessage));
// 配置了获取成功提示后提示，默认是空不会提示。
self.msg && (getRoot(self) as IRendererStore).notify('success', self.msg);
options && options.successMessage && (getRoot(self) as IRendererStore).notify('success', self.msg);
}
markFetching(false);
@ -280,7 +280,7 @@ export const ServiceStore = iRendererStore
updateMessage(json.msg || (options && options.successMessage));
// 配置了获取成功提示后提示，默认是空不会提示。
self.msg && (getRoot(self) as IRendererStore).notify('success', self.msg);
options && options.successMessage && (getRoot(self) as IRendererStore).notify('success', self.msg);
}
self.initializing = false;