dtd
Version:
根据数梦工场视觉规范打造的组件库，感谢react-components和ant design
1 lines • 7.25 kB
JavaScript
import _toConsumableArray from"babel-runtime/helpers/toConsumableArray";import _defineProperty from"babel-runtime/helpers/defineProperty";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*as PropTypes from"prop-types";import classNames from"classnames";import List from"./list";import Operation from"./operation";import Search from"./search";import LocaleReceiver from"../locale-provider/LocaleReceiver";import defaultLocale from"../locale-provider/default";function noop(){}var Transfer=function(e){function t(e){_classCallCheck(this,t);var r=_possibleConstructorReturn(this,(t.__proto__||Object.getPrototypeOf(t)).call(this,e));r.moveTo=function(e){var t=r.props,l=t.targetKeys,n=void 0===l?[]:l,o=t.dataSource,a=void 0===o?[]:o,s=t.onChange,i=r.state,c=i.sourceSelectedKeys,d=i.targetSelectedKeys,h=("right"===e?c:d).filter(function(e){return!a.some(function(t){return!(e!==t.key||!t.disabled)})}),u="right"===e?h.concat(n):n.filter(function(e){return-1===h.indexOf(e)}),f="right"===e?"left":"right";r.setState(_defineProperty({},r.getSelectedKeysName(f),[])),r.handleSelectChange(f,[]),s&&s(u,e,h)},r.moveToLeft=function(){return r.moveTo("left")},r.moveToRight=function(){return r.moveTo("right")},r.handleSelectAll=function(e,t,l){var n=r.state[r.getSelectedKeysName(e)]||[],o=t.map(function(e){return e.key}),a=n.filter(function(e){return-1===o.indexOf(e)}),s=[].concat(_toConsumableArray(n));o.forEach(function(e){-1===s.indexOf(e)&&s.push(e)});var i=l?a:s;r.handleSelectChange(e,i),r.props.selectedKeys||r.setState(_defineProperty({},r.getSelectedKeysName(e),i))},r.handleLeftSelectAll=function(e,t){return r.handleSelectAll("left",e,t)},r.handleRightSelectAll=function(e,t){return r.handleSelectAll("right",e,t)},r.handleFilter=function(e,t){r.setState(_defineProperty({},e+"Filter",t.target.value)),r.props.onSearchChange&&r.props.onSearchChange(e,t)},r.handleLeftFilter=function(e){return r.handleFilter("left",e)},r.handleRightFilter=function(e){return r.handleFilter("right",e)},r.handleClear=function(e){r.setState(_defineProperty({},e+"Filter",""))},r.handleLeftClear=function(){return r.handleClear("left")},r.handleRightClear=function(){return r.handleClear("right")},r.handleSelect=function(e,t,l){var n=r.state,o=n.sourceSelectedKeys,a=n.targetSelectedKeys,s=[].concat(_toConsumableArray("left"===e?o:a)),i=s.indexOf(t.key);i>-1&&s.splice(i,1),l&&s.push(t.key),r.handleSelectChange(e,s),r.props.selectedKeys||r.setState(_defineProperty({},r.getSelectedKeysName(e),s))},r.handleLeftSelect=function(e,t){return r.handleSelect("left",e,t)},r.handleRightSelect=function(e,t){return r.handleSelect("right",e,t)},r.handleScroll=function(e,t){var l=r.props.onScroll;l&&l(e,t)},r.handleLeftScroll=function(e){return r.handleScroll("left",e)},r.handleRightScroll=function(e){return r.handleScroll("right",e)},r.renderTransfer=function(e){var t=r.props,l=t.prefixCls,n=void 0===l?"dt-transfer":l,o=t.className,a=t.operations,s=void 0===a?[]:a,i=t.showSearch,c=t.notFoundContent,d=t.searchPlaceholder,h=t.body,u=t.footer,f=t.listStyle,p=t.filterOption,y=t.render,S=t.lazy,m=r.state,g=m.leftFilter,v=m.rightFilter,T=m.sourceSelectedKeys,C=m.targetSelectedKeys,K=r.splitDataSource(r.props),P=K.leftDataSource,b=K.rightDataSource,R=C.length>0,L=T.length>0,F=classNames(o,n),_=r.getTitles(e);return React.createElement("div",{className:F},React.createElement(List,{prefixCls:n+"-list",titleText:_&&_[0],dataSource:P,filter:g,filterOption:p,style:f,checkedKeys:T,handleFilter:r.handleLeftFilter,handleClear:r.handleLeftClear,handleSelect:r.handleLeftSelect,handleSelectAll:r.handleLeftSelectAll,render:y,showSearch:i,searchPlaceholder:d||e.searchPlaceholder,notFoundContent:c||e.notFoundContent,itemUnit:e.itemUnit,itemsUnit:e.itemsUnit,body:h,footer:u,lazy:S,onScroll:r.handleLeftScroll}),React.createElement(Operation,{className:n+"-operation",rightActive:L,rightArrowText:s[0],moveToRight:r.moveToRight,leftActive:R,leftArrowText:s[1],moveToLeft:r.moveToLeft}),React.createElement(List,{prefixCls:n+"-list",titleText:_&&_[1],dataSource:b,filter:v,filterOption:p,style:f,checkedKeys:C,handleFilter:r.handleRightFilter,handleClear:r.handleRightClear,handleSelect:r.handleRightSelect,handleSelectAll:r.handleRightSelectAll,render:y,showSearch:i,searchPlaceholder:d||e.searchPlaceholder,notFoundContent:c||e.notFoundContent,itemUnit:e.itemUnit,itemsUnit:e.itemsUnit,body:h,footer:u,lazy:S,onScroll:r.handleRightScroll}))};var l=e.selectedKeys,n=void 0===l?[]:l,o=e.targetKeys,a=void 0===o?[]:o;return r.state={leftFilter:"",rightFilter:"",sourceSelectedKeys:n.filter(function(e){return-1===a.indexOf(e)}),targetSelectedKeys:n.filter(function(e){return a.indexOf(e)>-1})},r}return _inherits(t,e),_createClass(t,[{key:"componentWillReceiveProps",value:function(e){var t=this.state,r=t.sourceSelectedKeys,l=t.targetSelectedKeys;if((e.targetKeys!==this.props.targetKeys||e.dataSource!==this.props.dataSource)&&(this.splitedDataSource=null,!e.selectedKeys)){var n=e.dataSource,o=e.targetKeys,a=void 0===o?[]:o,s=[],i=[];n.forEach(function(e){var t=e.key;r.includes(t)&&!a.includes(t)&&s.push(t),l.includes(t)&&a.includes(t)&&i.push(t)}),this.setState({sourceSelectedKeys:s,targetSelectedKeys:i})}if(e.selectedKeys){var c=e.targetKeys||[];this.setState({sourceSelectedKeys:e.selectedKeys.filter(function(e){return!c.includes(e)}),targetSelectedKeys:e.selectedKeys.filter(function(e){return c.includes(e)})})}}},{key:"splitDataSource",value:function(e){if(this.splitedDataSource)return this.splitedDataSource;var t=e.dataSource,r=e.rowKey,l=e.targetKeys,n=void 0===l?[]:l,o=[],a=new Array(n.length);return t.forEach(function(e){r&&(e.key=r(e));var t=n.indexOf(e.key);-1!==t?a[t]=e:o.push(e)}),this.splitedDataSource={leftDataSource:o,rightDataSource:a},this.splitedDataSource}},{key:"handleSelectChange",value:function(e,t){var r=this.state,l=r.sourceSelectedKeys,n=r.targetSelectedKeys,o=this.props.onSelectChange;o&&("left"===e?o(t,n):o(l,t))}},{key:"getTitles",value:function(e){var t=this.props;return t.titles?t.titles:e.titles}},{key:"getSelectedKeysName",value:function(e){return"left"===e?"sourceSelectedKeys":"targetSelectedKeys"}},{key:"render",value:function(){return React.createElement(LocaleReceiver,{componentName:"Transfer",defaultLocale:defaultLocale.Transfer},this.renderTransfer)}}]),t}(React.Component);export default Transfer;Transfer.List=List,Transfer.Operation=Operation,Transfer.Search=Search,Transfer.defaultProps={dataSource:[],render:noop,showSearch:!1},Transfer.propTypes={prefixCls:PropTypes.string,dataSource:PropTypes.array,render:PropTypes.func,targetKeys:PropTypes.array,onChange:PropTypes.func,height:PropTypes.number,listStyle:PropTypes.object,className:PropTypes.string,titles:PropTypes.array,operations:PropTypes.array,showSearch:PropTypes.bool,filterOption:PropTypes.func,searchPlaceholder:PropTypes.string,notFoundContent:PropTypes.node,body:PropTypes.func,footer:PropTypes.func,rowKey:PropTypes.func,lazy:PropTypes.oneOfType([PropTypes.object,PropTypes.bool])};