dtd/es/filter/index.js

根据数梦工场视觉规范打造的组件库，感谢react-components和ant design

import _defineProperty from"babel-runtime/helpers/defineProperty";import _toConsumableArray from"babel-runtime/helpers/toConsumableArray";import _extends from"babel-runtime/helpers/extends";import _classCallCheck from"babel-runtime/helpers/classCallCheck";import _createClass from"babel-runtime/helpers/createClass";import _possibleConstructorReturn from"babel-runtime/helpers/possibleConstructorReturn";import _inherits from"babel-runtime/helpers/inherits";import*as React from"react";import classNames from"classnames";import Row from"../row";import Col from"../col";import Icon from"../icon";import Form from"../form";import Input from"../input";import Modal from"../modal";import Button from"../button";import Select from"../select";import Checkbox from"../checkbox";import DatePicker from"../date-picker";import TimePicker from"../time-picker";import Tooltip from"../tooltip";import warning from"../_util/warning";var CheckboxGroup=Checkbox.Group,Option=Select.Option,FormItem=Form.Item,Filter=function(e){function t(e){_classCallCheck(this,t);var r=_possibleConstructorReturn(this,(t.__proto__||Object.getPrototypeOf(t)).call(this,e));r.handleSubmit=function(e){e&&e.preventDefault&&e.preventDefault(),r.props.form.validateFields(function(e,t){!e&&r.props.fetchDataFunc&&r.props.fetchDataFunc(t)})},r.handleReset=function(){r.props.form.resetFields();var e=r.props,t=e.resetFunc,a=e.fetchDataFunc,n=e.form.getFieldsValue();t?t(n):a&&a(n,"reset")},r.setSearchFields=function(e){var t=arguments.length>1&&void 0!==arguments[1]&&arguments[1];r.props.form.setFields(e,function(){t&&r.handleSubmit(0)})},r.setSearchFieldsValue=function(e){var t=arguments.length>1&&void 0!==arguments[1]&&arguments[1];r.props.form.setFieldsValue(e,function(){t&&r.handleSubmit(0)})},r.handleSelectChange=function(){setTimeout(function(){r.handleSubmit(0)},0)},r.renderItem=function(e){var t=arguments.length>1&&void 0!==arguments[1]?arguments[1]:[],a=arguments[2],n=arguments.length>3&&void 0!==arguments[3]?arguments[3]:{};switch(e){case"input":return React.createElement(Input,_extends({onPressEnter:r.handleSubmit},n));case"select":var o=t.map(function(e){var t=e.value,r=e.text;return React.createElement(Option,{key:t,value:t},r)});return React.createElement(Select,_extends({onChange:function(){return a?r.handleSelectChange():function(){}}},n),o);case"datePicker":return React.createElement(DatePicker,n);case"monthPicker":return React.createElement(DatePicker.MonthPicker,n);case"weekPicker":return React.createElement(DatePicker.WeekPicker,n);case"rangePicker":return React.createElement(DatePicker.RangePicker,n);case"timePicker":return React.createElement(TimePicker,n);default:return React.isValidElement(e)?e:null}},r.renderComp=function(e,t){var a=r.props.form.getFieldDecorator,n=t.ctrlSingleRow,o=void 0!==n&&n,i=t.showAdvanceCig,l=void 0===i||i,c=t.formItemCol,s=t.ctrlStyles,m=t.searchText,u=void 0===m?"搜索":m,p=t.resetText,d=void 0===p?"重置":p,h=t.customCtrlGroup,f=t.noCtrlBtn,v=void 0!==f&&f,g=t.lineLimit,C=void 0===g?3:g,k=!1,y=e.length,R=y/C;!o&&R<=2&&R>1&&(k=!0);var b=void 0;b=24%C==0?{span:24/C}:{style:{float:"left",width:100/C+"%"}};for(var x=_extends({labelCol:{span:6},wrapperCol:{span:18}},c),E=React.createElement(Tooltip,{placement:"top",title:"高级设置"},React.createElement(Button,{key:"config",onClick:r.showAdvanceModal,style:{marginLeft:8,padding:"0 10px"}},React.createElement(Icon,{type:"configuration"}))),w=[],F=0;F<y;F+=1){var _=e[F],D=_.type,P=_.label,S=_.name,A=_.data,I=_.options,N=_.extra;warning(!!S,"searchData中name是必填项，请检查"+e[F]+"项！"),S&&w.push(React.createElement(Col,_extends({},b,{key:S}),React.createElement(FormItem,_extends({label:P},x),a(S,I)(r.renderItem(D,A,1===y,N)))))}if(!v){var B=h||React.createElement(FormItem,null,React.createElement(Button,{key:"primary",type:"primary",htmlType:"submit"},u),React.createElement(Button,{key:"reset",style:{marginLeft:8},onClick:r.handleReset},d),l&&(!k||w.length<C)&&E),T=void 0,O=void 0;if(R<=1)return T={width:o?"100%":"calc(100% - 182px)",float:"left",margin:0},O={width:o?"100%":"182px",paddingRight:o?"16px":0,float:"left",textAlign:"right"},React.createElement("div",null,React.createElement(Row,{gutter:32,style:T},w),React.createElement("div",{style:O},B));if(l&&k)return T={width:"calc(100% - 140px)",float:"left",margin:0},O={width:"140px",float:"left",textAlign:"right"},React.createElement("div",null,React.createElement(Row,{gutter:32,style:T},w.slice(0,C)),React.createElement("div",{style:O},E),React.createElement(Row,{gutter:32,style:T},w.slice(C)),React.createElement("div",{style:O},B));var M={},V=_extends({textAlign:"right"},s);b.span?M.span=o?24:b.span*(C-w.length%C):(V.width=o?"100%":100*(1-w.length%C/C)+"%",V.float="left"),w.push(React.createElement(Col,_extends({key:"ctrl"},M,{style:V}),B))}return w},r.genCheckboxes=function(e){return e.length?e.map(function(e){return React.createElement(Col,{span:6,key:e.name},React.createElement(Checkbox,{value:e.name},e.label))}):[]},r.showAdvanceModal=function(){r.setState({showAdvance:!0})},r.onCheckboxChange=function(e){r.itemNames=[].concat(_toConsumableArray(e)),e.length?"block"===r.errDiv.style.display&&(r.errDiv.style.display="none"):r.errDiv.style.display="block"},r.onFieldsChangeCancel=function(){r.itemNames=r.itemNamesBackup,r.setState({showAdvance:!1})},r.handleFieldsChange=function(){if(r.itemNames.length){var e=r.props.searchData,t=[];(void 0===e?[]:e).map(function(e){var a=e.name;r.itemNames.includes(a)&&t.push(e)}),r.setState({showAdvance:!1,displayedItem:t},function(){return r.itemNamesBackup=r.itemNames})}};var a=e.initialMax,n=void 0===a?-1:a,o=e.searchData,i=void 0===o?[]:o,l=e.searchCig,c=(void 0===l?{}:l).showAdvanceCig,s=void 0===c||c;warning(!!i.length,"searchData不能为空。"),s?n<0&&(n=i.length):n=i.length;var m=[];i.map(function(e,t){t<n&&m.push(e)}),r.state={showAdvance:!1,displayedItem:m};var u=m.map(function(e){return e.name});return r.itemNames=[].concat(_toConsumableArray(u)),r.itemNamesBackup=[].concat(_toConsumableArray(u)),r}return _inherits(t,e),_createClass(t,[{key:"render",value:function(){var e=this,t=this.props,r=t.searchData,a=void 0===r?[]:r,n=t.searchCig,o=void 0===n?{}:n,i=t.prefixCls,l=t.useFlexBox,c=this.state,s=c.showAdvance,m=c.displayedItem,u=this.genCheckboxes(a);if(!a.length)return null;var p=classNames(i,o.customCls,_defineProperty({},i+"-flex",l));return React.createElement(Form,{className:p,onSubmit:this.handleSubmit},React.createElement(Row,{gutter:32},this.renderComp(m,o)),React.createElement(Modal,{visible:s,okText:"保存",cancelText:"取消",title:"自定义筛选项",destroyOnClose:!0,onCancel:this.onFieldsChangeCancel,onOk:this.handleFieldsChange},React.createElement(CheckboxGroup,{defaultValue:this.itemNames,onChange:this.onCheckboxChange,style:{width:"100%"}},React.createElement(Row,null,u),React.createElement("div",{ref:function(t){return e.errDiv=t},style:{display:"none"},className:i+"-errDiv"},"请至少选择一项。"))))}}],[{key:"getDerivedStateFromProps",value:function(e,t){if("searchData"in e){var r=e.searchData,a=void 0===r?[]:r,n=t.displayedItem,o=(void 0===n?[]:n).map(function(e){return e.name});return{displayedItem:a.filter(function(e){return o.indexOf(e.name||"")>-1})}}return null}}]),t}(React.Component);Filter.defaultProps={prefixCls:"dt-filter",useFlexBox:!1};export default Form.create()(Filter);