add:完善字符、数值的条件下拉.
This commit is contained in:
parent
dac7145533
commit
64145e1d69
Binary file not shown.
|
@ -149,7 +149,23 @@ class Demo27 extends Component {
|
||||||
</Dropdown>
|
</Dropdown>
|
||||||
}
|
}
|
||||||
},
|
},
|
||||||
{ title: "姓名", width: 180, dataIndex: "name", key: "name", filterType: "text", filterDropdown: "show" },
|
{
|
||||||
|
title: "姓名",
|
||||||
|
width: 180,
|
||||||
|
dataIndex: "name",
|
||||||
|
key: "name",
|
||||||
|
filterType: "text",//输入框类型
|
||||||
|
filterDropdown: "show",//显示条件
|
||||||
|
filterDropdownType: "string"//字符条件
|
||||||
|
},
|
||||||
|
{
|
||||||
|
title: "区间",
|
||||||
|
width: 150,
|
||||||
|
dataIndex: "mark",
|
||||||
|
key: "mark",
|
||||||
|
filterType: "text",//输入框类型
|
||||||
|
filterDropdownType: "number"//数值类条件
|
||||||
|
},
|
||||||
{
|
{
|
||||||
title: "年龄",
|
title: "年龄",
|
||||||
width: 180,
|
width: 180,
|
||||||
|
@ -157,7 +173,7 @@ class Demo27 extends Component {
|
||||||
dataIndex: "age",
|
dataIndex: "age",
|
||||||
key: "age",
|
key: "age",
|
||||||
filterType: "dropdown",
|
filterType: "dropdown",
|
||||||
filterDropdown: "hide",
|
filterDropdown: "hide",//不显示条件
|
||||||
filterDropdownAuto: "manual",//切换手动传入模式
|
filterDropdownAuto: "manual",//切换手动传入模式
|
||||||
filterDropdownData: this.state.dropdownvalue,
|
filterDropdownData: this.state.dropdownvalue,
|
||||||
filterDropdownFocus: () => {
|
filterDropdownFocus: () => {
|
||||||
|
|
File diff suppressed because one or more lines are too long
|
@ -10335,16 +10335,4 @@ li.rc-time-picker-panel-select-option-disabled:hover {
|
||||||
.demo25 .u-table-scroll .u-table-header {
|
.demo25 .u-table-scroll .u-table-header {
|
||||||
margin-right: 15px; }
|
margin-right: 15px; }
|
||||||
|
|
||||||
th .drop-menu .uf {
|
|
||||||
font-size: 12px;
|
|
||||||
visibility: hidden;
|
|
||||||
margin-left: 15px; }
|
|
||||||
|
|
||||||
th:hover .uf {
|
|
||||||
visibility: visible; }
|
|
||||||
|
|
||||||
.demo3 .u-table-thead th {
|
|
||||||
padding-top: 0px;
|
|
||||||
padding-bottom: 0px; }
|
|
||||||
|
|
||||||
/*# sourceMappingURL=demo.css.map */
|
/*# sourceMappingURL=demo.css.map */
|
||||||
|
|
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
File diff suppressed because one or more lines are too long
|
@ -52,7 +52,7 @@ class FilterDropDown extends Component {
|
||||||
}
|
}
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* 根据props来获得指定的Menu
|
* 根据props来获得指定的Menu,分为String和Number
|
||||||
*
|
*
|
||||||
* @returns JSX Menu
|
* @returns JSX Menu
|
||||||
*/
|
*/
|
||||||
|
@ -86,7 +86,7 @@ class FilterDropDown extends Component {
|
||||||
<Item key="6">{locale['not_equal_to']}</Item>
|
<Item key="6">{locale['not_equal_to']}</Item>
|
||||||
</Menu>
|
</Menu>
|
||||||
default:
|
default:
|
||||||
return null;
|
return <div></div>;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
render() {
|
render() {
|
||||||
|
@ -124,7 +124,7 @@ FilterDropDown.propTypes = {
|
||||||
|
|
||||||
FilterDropDown.defaultProps = {
|
FilterDropDown.defaultProps = {
|
||||||
isShowCondition: 'show',
|
isShowCondition: 'show',
|
||||||
filterDropdownType: 'number'
|
filterDropdownType: 'string'
|
||||||
}
|
}
|
||||||
|
|
||||||
export default FilterDropDown;
|
export default FilterDropDown;
|
||||||
|
|
|
@ -84,8 +84,14 @@ class FilterType extends Component {
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
//组件渲染
|
//组件渲染
|
||||||
|
/**
|
||||||
|
* 根据不同的类型生成对应的组件类型包含一些参数的适应
|
||||||
|
*
|
||||||
|
* @param {*} rendertype 参数类型,包括['text','dropdown','date','daterange','number']
|
||||||
|
* @returns
|
||||||
|
*/
|
||||||
renderControl = (rendertype) => {
|
renderControl = (rendertype) => {
|
||||||
let { filterDropdown, className, onChange, onSelectDropdown, clsPrefix, locale } = this.props;
|
let { filterDropdown, filterDropdownType, className, onChange, onSelectDropdown, clsPrefix, locale } = this.props;
|
||||||
switch (rendertype) {
|
switch (rendertype) {
|
||||||
case 'text':
|
case 'text':
|
||||||
return <div className={`${clsPrefix} filter-wrap`}><FormControl
|
return <div className={`${clsPrefix} filter-wrap`}><FormControl
|
||||||
|
@ -102,6 +108,7 @@ class FilterType extends Component {
|
||||||
onClickClear={this.clearText}
|
onClickClear={this.clearText}
|
||||||
isShowClear={this.state.text}
|
isShowClear={this.state.text}
|
||||||
isShowCondition={filterDropdown}
|
isShowCondition={filterDropdown}
|
||||||
|
filterDropdownType={filterDropdownType}
|
||||||
>
|
>
|
||||||
</FilterDropDown>
|
</FilterDropDown>
|
||||||
</div>
|
</div>
|
||||||
|
@ -144,7 +151,7 @@ class FilterType extends Component {
|
||||||
</FilterDropDown>}
|
</FilterDropDown>}
|
||||||
</div>
|
</div>
|
||||||
default:
|
default:
|
||||||
break;
|
return <div></div>;
|
||||||
}
|
}
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
13
src/Table.js
13
src/Table.js
|
@ -382,14 +382,15 @@ class Table extends Component {
|
||||||
key: column.key,
|
key: column.key,
|
||||||
children: "过滤渲染",
|
children: "过滤渲染",
|
||||||
width: column.width,
|
width: column.width,
|
||||||
filtertype: column.filterType,
|
filtertype: column.filterType,//下拉的类型 包括['text','dropdown','date','daterange','number']
|
||||||
dataindex: column.dataIndex,
|
dataindex: column.dataIndex,//field
|
||||||
datasource: this.props.data,
|
datasource: this.props.data,//需要单独拿到数据处理
|
||||||
format: column.format,
|
format: column.format,//设置日期的格式
|
||||||
filterdropdown: column.filterDropdown,
|
filterdropdown: column.filterDropdown,//是否显示 show hide
|
||||||
filterdropdownauto: column.filterDropdownAuto,//是否自定义数据
|
filterdropdownauto: column.filterDropdownAuto,//是否自定义数据
|
||||||
filterdropdowndata: column.filterDropdownData,//自定义数据格式
|
filterdropdowndata: column.filterDropdownData,//自定义数据格式
|
||||||
filterdropdownfocus: column.filterDropdownFocus//焦点触发函数回调
|
filterdropdownfocus: column.filterDropdownFocus,//焦点触发函数回调
|
||||||
|
filterdropdowntype: column.filterDropdownType//下拉的类型分为 String,Number 默认是String
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
});
|
});
|
||||||
|
|
|
@ -340,6 +340,7 @@ class TableHeader extends Component {
|
||||||
dataIndex
|
dataIndex
|
||||||
)}
|
)}
|
||||||
filterDropdown={rows[1][index]["filterdropdown"]}
|
filterDropdown={rows[1][index]["filterdropdown"]}
|
||||||
|
filterDropdownType={rows[1][index]["filterdropdowntype"]}//下拉的条件类型为string,number
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
//下拉框选择
|
//下拉框选择
|
||||||
|
@ -375,6 +376,7 @@ class TableHeader extends Component {
|
||||||
)}
|
)}
|
||||||
filterDropdown={rows[1][index]["filterdropdown"]}
|
filterDropdown={rows[1][index]["filterdropdown"]}
|
||||||
onFocus={rows[1][index]["filterdropdownfocus"]}
|
onFocus={rows[1][index]["filterdropdownfocus"]}
|
||||||
|
filterDropdownType={rows[1][index]["filterdropdowntype"]}//下拉的条件类型为string,number
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
//日期
|
//日期
|
||||||
|
@ -392,6 +394,7 @@ class TableHeader extends Component {
|
||||||
dataIndex
|
dataIndex
|
||||||
)}
|
)}
|
||||||
filterDropdown={rows[1][index]["filterdropdown"]}
|
filterDropdown={rows[1][index]["filterdropdown"]}
|
||||||
|
filterDropdownType={rows[1][index]["filterdropdowntype"]}//下拉的条件类型为string,number
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
default:
|
default:
|
||||||
|
|
Loading…
Reference in New Issue