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

增加autoFill功能

Browse Source
This commit is contained in:
catchonme 2019-08-01 09:51:25 +08:00
parent a4de4932c2
commit 8819524b62
11 changed files with 101 additions and 15 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

1
scss/components/_table.scss
View File

@ -134,6 +134,7 @@
&-content {
min-height: 0.01%;
overflow-x: auto;
transform: translateZ(0);
}
&-table {

22
src/components/Radios.tsx
View File

@ -19,6 +19,8 @@ import Checkbox from './Checkbox';
import {value2array, OptionProps, Option} from './Checkboxes';
import chunk = require('lodash/chunk');
import {ClassNamesFn, themeable} from '../theme';
import {isEmpty} from '../utils/helper';
import {dataMapping} from '../utils/tpl-builtin';
interface RadioProps extends OptionProps {
id?: string;
@ -29,6 +31,10 @@ interface RadioProps extends OptionProps {
inline?: boolean;
disabled?: boolean;
onChange?: Function;
autoFill?: {
[propName:string]: string
};
onBulkChange?: Function;
columnsCount: number;
itemClassName?: string;
classPrefix: string;
@ -43,7 +49,18 @@ export class Radios extends React.Component<RadioProps, any> {
};
toggleOption(option: Option) {
const {value, onChange, joinValues, extractValue, valueField, clearable, delimiter, options} = this.props;
const {
value,
onChange,
joinValues,
extractValue,
valueField,
clearable,
delimiter,
options,
autoFill,
onBulkChange
} = this.props;
let valueArray = value2array(value, {
multiple: false,
@ -61,6 +78,9 @@ export class Radios extends React.Component<RadioProps, any> {
let newValue = valueArray[0];
const sendTo = autoFill && !isEmpty(autoFill) && dataMapping(autoFill, newValue as Option);
sendTo && onBulkChange && onBulkChange(sendTo);
if (newValue && (joinValues || extractValue)) {
newValue = newValue[valueField || 'value'];
}

1
src/components/Select.tsx
View File

@ -44,6 +44,7 @@ export interface OptionProps {
delimiter?: string;
clearable?: boolean;
placeholder?: string;
autoFill?: {[propName:string]: any}
}
export type OptionValue = string | number | null | undefined | Option;

2
src/renderers/Carousel.tsx
View File

@ -55,7 +55,7 @@ const defaultSchema = {
<% } %>
<% } else if (data.hasOwnProperty('html')) { %>
<%= data.html %>
<% } else if (data.hasOwnproperty('item')) { %>
<% } else if (data.hasOwnProperty('item')) { %>
<%= data.item %>
<% } else { %>
<%= '未找到渲染数据' %>

23
src/renderers/Form/ButtonGroup.tsx
View File

@ -2,12 +2,14 @@ import React from 'react';
import cx from 'classnames';
import {
OptionsControl,
OptionsControlProps
OptionsControlProps,
Option
} from './Options';
import {
Button
} from '../../types';
import { getLevelFromClassName } from '../../utils/helper';
import { getLevelFromClassName, autobind, isEmpty} from '../../utils/helper';
import { dataMapping } from '../../utils/tpl-builtin';
export interface ButtonGroupProps extends OptionsControlProps {
buttons?: Array<Button>;
@ -26,6 +28,20 @@ export default class ButtonGroupControl extends React.Component<ButtonGroupProps
vertical: false
}
@autobind
handleToggle(option: Option) {
const {
onToggle,
multiple,
autoFill,
onBulkChange
} = this.props;
const sendTo = !multiple && autoFill && !isEmpty(autoFill) && dataMapping(autoFill, option as Option);
sendTo && onBulkChange(sendTo);
onToggle(option)
}
render(props = this.props) {
const {
render,
@ -38,7 +54,6 @@ export default class ButtonGroupControl extends React.Component<ButtonGroupProps
placeholder,
btnClassName,
btnActiveClassName,
onToggle,
selectedOptions,
buttons,
size,
@ -69,7 +84,7 @@ export default class ButtonGroupControl extends React.Component<ButtonGroupProps
className: cx(option.className, btnClassName),
disabled: option.disabled || disabled,
onClick: (e:React.UIEvent<any>) => {
onToggle(option);
this.handleToggle(option);
e.preventDefault(); // 禁止 onAction 触发
}
});

19
src/renderers/Form/Checkboxes.tsx
View File

@ -7,7 +7,8 @@ import {
import cx from 'classnames';
import Checkbox from '../../components/Checkbox';
import chunk = require('lodash/chunk');
import { autobind } from '../../utils/helper';
import {autobind, isEmpty} from '../../utils/helper';
import {dataMapping} from '../../utils/tpl-builtin';
export interface CheckboxesProps extends OptionsControlProps {
placeholder?: any;
@ -32,6 +33,20 @@ export default class CheckboxesControl extends React.Component<CheckboxesProps,
defaultCheckAll && onToggleAll();
}
@autobind
handleToggle(option: Option) {
const {
onToggle,
multiple,
autoFill,
onBulkChange
} = this.props;
const sendTo = !multiple && autoFill && !isEmpty(autoFill) && dataMapping(autoFill, option as Option);
sendTo && onBulkChange(sendTo);
onToggle(option);
}
renderGroup(option:Option, index:number) {
const {
classnames: cx
@ -67,7 +82,7 @@ export default class CheckboxesControl extends React.Component<CheckboxesProps,
<Checkbox
className={itemClassName}
key={index}
onChange={() => onToggle(option)}
onChange={() => this.handleToggle(option)}
checked={!!~selectedOptions.indexOf(option)}
disabled={disabled || option.disabled}
inline={inline}

15
src/renderers/Form/List.tsx
View File

@ -6,7 +6,8 @@ import {
} from './Options';
import { Item } from 'react-bootstrap/lib/Breadcrumb';
import { Schema } from '../../types';
import { createObject } from '../../utils/helper';
import { createObject, isEmpty } from '../../utils/helper';
import {dataMapping} from '../../utils/tpl-builtin';
export interface ListProps extends OptionsControlProps {
imageClassName: string;
@ -38,7 +39,17 @@ export default class ListControl extends React.Component<ListProps, any> {
return;
}
this.props.onToggle(option);
const {
onToggle,
multiple,
autoFill,
onBulkChange
} = this.props;
const sendTo = !multiple && autoFill && !isEmpty(autoFill) && dataMapping(autoFill, option as Option);
sendTo && onBulkChange(sendTo);
onToggle(option);
}
render() {

11
src/renderers/Form/NestedSelect.tsx
View File

@ -6,7 +6,8 @@ import Checkbox from '../../components/Checkbox';
import PopOver from '../../components/PopOver';
import {RootCloseWrapper} from 'react-overlays';
import {closeIcon, rightArrowIcon} from '../../components/icons';
import {autobind, flattenTree} from '../../utils/helper'
import {autobind, flattenTree, isEmpty} from '../../utils/helper';
import {dataMapping} from '../../utils/tpl-builtin';
import {
OptionsControl,
@ -102,10 +103,16 @@ export default class NestedSelectControl extends React.Component<NestedSelectPro
onChange,
joinValues,
extractValue,
valueField
valueField,
autoFill,
onBulkChange
} = this.props;
e.stopPropagation();
const sendTo = !multiple && autoFill && !isEmpty(autoFill) && dataMapping(autoFill, option);
sendTo && onBulkChange(sendTo);
onChange(joinValues ? option[valueField || 'value'] : extractValue ? option[valueField || 'value'] : option);
!multiple && this.close();
}

8
src/renderers/Form/Picker.tsx
View File

@ -17,6 +17,8 @@ import findIndex = require('lodash/findIndex');
import Html from '../../components/Html';
import { filter } from '../../utils/tpl';
import { closeIcon } from '../../components/icons';
import {isEmpty} from '../../utils/helper';
import {dataMapping} from '../../utils/tpl-builtin';
export interface PickerProps extends OptionsControlProps {
modalMode: 'dialog' | 'drawer';
@ -127,7 +129,9 @@ export default class PickerControl extends React.PureComponent<PickerProps, any>
multiple,
options,
setOptions,
onChange
onChange,
autoFill,
onBulkChange
} = this.props;
let value: any = items;
@ -148,6 +152,8 @@ export default class PickerControl extends React.PureComponent<PickerProps, any>
});
additionalOptions.length && setOptions(options.concat(additionalOptions));
const sendTo = !multiple && !joinValues && !extractValue && autoFill && !isEmpty(autoFill) && dataMapping(autoFill, value as Option);
sendTo && onBulkChange(sendTo);
onChange(value);
}

6
src/renderers/Form/Radios.tsx
View File

@ -37,7 +37,9 @@ export default class RadiosControl extends React.Component<RadiosProps, any> {
formMode,
columnsCount,
classPrefix,
itemClassName
itemClassName,
autoFill,
onBulkChange
} = this.props;
return (
@ -46,6 +48,8 @@ export default class RadiosControl extends React.Component<RadiosProps, any> {
className={cx(`${ns}RadiosControl`, className)}
value={(typeof value === 'undefined' || value === null) ? '' : value}
disabled={disabled}
autoFill={autoFill}
onBulkChange={onBulkChange}
onChange={onChange}
joinValues={joinValues}
extractValue={extractValue}

8
src/renderers/Form/Select.tsx
View File

@ -10,6 +10,8 @@ import find = require('lodash/find');
import debouce = require('lodash/debounce');
import {Api} from '../../types';
import {isEffectiveApi} from '../../utils/api';
import {isEmpty} from '../../utils/helper';
import {dataMapping} from '../../utils/tpl-builtin';
export interface SelectProps extends OptionsControlProps {
autoComplete?: Api;
@ -55,7 +57,9 @@ export default class SelectControl extends React.Component<SelectProps, any> {
type,
onChange,
setOptions,
options
options,
autoFill,
onBulkChange
} = this.props;
let newValue: string | Option | Array<Option> | void = value;
@ -83,6 +87,8 @@ export default class SelectControl extends React.Component<SelectProps, any> {
// 不设置没法回显
additonalOptions.length && setOptions(options.concat(additonalOptions));
const sendTo = !multiple && autoFill && !isEmpty(autoFill) && dataMapping(autoFill, value as Option);
sendTo && onBulkChange(sendTo);
onChange(newValue);
}