v1.0.9

src/components/config/options.js

@@ -11,6 +11,8 @@ export default function (lan = 'zn') {
 		data: [],
         //表单提交的name
         name: 'select',
+        //尺寸
+        size: 'medium',
 		//默认选中数据, 优先级大于selected
 		initValue: null,
 		//默认提示

src/components/core/index.js

@@ -145,6 +145,14 @@ class xmOptions {
         }
         childs[this.options.el].del(sels);
         return this;
+    }
+    
+    /**
+     * 闪烁警告边框
+     */
+    warning(color){
+        childs[this.options.el].updateBorderColor(color || this.options.theme.maxColor);
+        return this;
     }
 
 }

src/components/element/framework.js

@@ -176,7 +176,7 @@ class Framework extends Component{
 
 	render(config, { sels, show }) {
 		const { tips, theme, prop, style, radio, repeat, clickClose, on, max, maxMethod } = config;
-		const borderStyle = { borderColor: this.state.tmpColor || theme.color };
+		const borderStyle = { borderColor: theme.color };
 		//最外层边框的属性
 		const xmSelectProps = {
 			style: {
@@ -185,7 +185,16 @@ class Framework extends Component{
 			},
 			onClick: this.onClick.bind(this),
 			ua: checkUserAgent(),
+            size: config.size,
 		}
+        if(this.state.tmpColor){
+            xmSelectProps.style.borderColor = this.state.tmpColor;
+            setTimeout(() => {
+                xmSelectProps.style.borderColor = '';
+                this.updateBorderColor('')
+            }, 300);
+        }
+        
 		//右边下拉箭头的变化class
 		const iconClass = show ? 'xm-icon xm-icon-expand' : 'xm-icon';
 		//提示信息的属性
@@ -214,8 +223,6 @@ class Framework extends Component{
                 let maxCount = toNum(max);
                 if(maxCount > 0 && sels.length >= maxCount){
                     this.updateBorderColor(theme.maxColor);
-                    //恢复正常
-                    setTimeout(() => this.updateBorderColor(''), 300);
                     //查看是否需要回调
                     maxMethod && isFunction(maxMethod) && maxMethod(sels, item);
                     return ;

src/components/element/model/general.js

@@ -81,11 +81,10 @@ class General extends Component{
             this.__value = v;
 
             //让搜索变成异步的
-            this.searchCid = setTimeout(() => this.setState({
-                filterValue: this.__value,
-                remote: true,
-                callback: true,
-            }), this.props.delay);
+            this.searchCid = setTimeout(() => {
+                this.callback = true;
+                this.setState({ filterValue: this.__value, remote: true })
+            }, this.props.delay);
         }
 	}
 
@@ -124,12 +123,12 @@ class General extends Component{
 	}
 
     componentDidUpdate(){
-        if(this.state.callback){
-            this.setState({ callback: false });
-            
+        if(this.callback){
+            this.callback = false;
+
             let done = this.props.filterDone;
             if(isFunction(done)){
-                done(this.state.filterValue);
+                done(this.state.filterValue, this.tempData || []);
             }
         }
     }
@@ -145,6 +144,7 @@ class General extends Component{
 		if(filterable){
 			if(remoteSearch){//是否进行远程搜索
 				if(this.state.remote){
+                    this.callback = false;
 					this.setState({ loading: true, remote: false });
 					//让输入框失去焦点
 					this.blur();
@@ -152,6 +152,7 @@ class General extends Component{
 						//回调后可以重新聚焦
 						this.focus();
 
+                        this.callback = true;
 						this.setState({ loading: false });
 						this.props.onReset(result, 'data');
 					}, this.props.show);
@@ -260,6 +261,7 @@ class General extends Component{
         }
 
         let safetyArr = deepMerge([], arr);
+        this.tempData = safetyArr;
 
         //工具条操作
         const toolbar = (
@@ -302,8 +304,7 @@ class General extends Component{
             const selected = !!sels.find(sel => sel[value] == item[value])
             const iconStyle = selected ? {
             	color: theme.color,
-            	border: 'none',
-            	fontSize: '18px'
+            	border: 'none'
             } : {
             	borderColor: theme.color,
             };

src/style/index.less

@@ -2,8 +2,6 @@
 @defaultBorderColor: #E6E6E6;
 @disabledColor: #C2C2C2;
 @border: 1px solid @defaultBorderColor;
-@height: 36px;
-@heightLabel: 30px;
 
 @-webkit-keyframes xm-upbit {
 	from {-webkit-transform: translate3d(0, 30px, 0);opacity: .3}
@@ -54,8 +52,6 @@ xm-select{
 	position: relative;
 	border: @border;
 	border-radius: 2px;
-	min-height: @height;
-    line-height: @height;
 	display: block;
 	width: 100%;
 	cursor: pointer;
@@ -117,7 +113,6 @@ xm-select{
 		.scroll{
 			.label-content{
 				display: flex;
-                line-height: @heightLabel;
                 padding: 3px 30px 3px 10px;
 			}
 		}
@@ -127,8 +122,6 @@ xm-select{
 			position: relative;
 			padding: 0px 5px;
 			margin: 2px 5px 2px 0;
-			height: 26px;
-			line-height: 26px;
 			border-radius: 3px;
 			align-items: baseline;
 			color: #FFF;
@@ -196,8 +189,10 @@ xm-select{
 		}
 
         .xm-group{
+            cursor: default;
             &-item{
-                cursor: default;
+                display: inline-block;
+                cursor: pointer;
                 padding: 0 10px;
                 color: #999;
                 font-size: 12px;
@@ -219,8 +214,6 @@ xm-select{
 				display: flex;
 				border: @border;
 				border-radius: 3px;
-				height: 18px;
-				width: 18px;
 				justify-content: center;
 				align-items: center;
 			}
@@ -306,8 +299,6 @@ xm-select{
 				justify-content: center;
 				vertical-align: middle;
 				padding: 0 15px;
-				height: 28px;
-				line-height: 28px;
 				margin: 0 -1px 0 0;
 				background-color: #fff;
 				color: #333;
@@ -358,7 +349,6 @@ xm-select{
 		width: 100%;
 		box-sizing: border-box;
 		background-color: #FFF;
-		height: 36px;
 		line-height: 1.3;
 		padding-left: 10px;
 		outline: 0;
@@ -402,6 +392,51 @@ xm-select{
 
 }
 
+//不同尺寸下的数据调整
+.mixin(@size){
+    @height: @size;
+    @heightLabel: @height - 6px;
+    @heightItem: @heightLabel - 4px;
+    @iconSize: @size / 2;
+
+    min-height: @height;
+    line-height: @height;
+    .xm-input{
+        height: @height;
+    }
+    .xm-label{
+        .scroll .label-content{
+            line-height: @heightLabel;
+        }
+        .xm-label-block{
+            height: @heightItem;
+            line-height: @heightItem;
+        }
+    }
+    .xm-body .xm-option .xm-option-icon{
+        height: @iconSize;
+        width: @iconSize;
+        font-size: @iconSize;
+    }
+    .xm-paging>span{
+        height: @heightLabel;
+        line-height: @heightLabel;
+    }
+}
+xm-select[size='large']{
+    .mixin(40px)
+}
+xm-select{//[size='medium']
+    .mixin(36px)
+}
+xm-select[size='small']{
+    .mixin(32px)
+}
+xm-select[size='mini']{
+    .mixin(28px)
+}
+
+
 //layui的一些样式兼容
 .layui-form-pane{
     xm-select{