input-number add the controls support (#1473)

pull/1482/head
baiyaaaaa 2016-11-30 18:16:49 +08:00 committed by cinwell.li
parent fa5aa2b183
commit 648c498fd9
5 changed files with 32 additions and 2 deletions

View File

@ -96,6 +96,7 @@ Allows you to define incremental steps.
|step | incremental step | number | — | 1 | |step | incremental step | number | — | 1 |
|size | size of the component | string | large/small| — | |size | size of the component | string | large/small| — |
|disabled| whether the component is disabled | boolean | — | false | |disabled| whether the component is disabled | boolean | — | false |
|controls| whether to enable the control buttons | boolean | — | true |
### Events ### Events

View File

@ -101,6 +101,7 @@
| step | 计数器步长 | number | — | 1 | | step | 计数器步长 | number | — | 1 |
| size | 计数器尺寸 | string | large, small | — | | size | 计数器尺寸 | string | large, small | — |
| disabled | 是否禁用计数器 | boolean | — | false | | disabled | 是否禁用计数器 | boolean | — | false |
| controls | 是否使用控制按钮 | boolean | — | true |
### Events ### Events
| 事件名称 | 说明 | 回调参数 | | 事件名称 | 说明 | 回调参数 |

View File

@ -2,7 +2,8 @@
<div class="el-input-number" <div class="el-input-number"
:class="[ :class="[
size ? 'el-input-number--' + size : '', size ? 'el-input-number--' + size : '',
{ 'is-disabled': disabled } { 'is-disabled': disabled },
{ 'is-without-controls': !controls}
]" ]"
> >
<el-input <el-input
@ -18,6 +19,7 @@
}"> }">
</el-input> </el-input>
<span <span
v-if="controls"
class="el-input-number__decrease el-icon-minus" class="el-input-number__decrease el-icon-minus"
:class="{'is-disabled': minDisabled}" :class="{'is-disabled': minDisabled}"
v-repeat-click="decrease" v-repeat-click="decrease"
@ -26,6 +28,7 @@
> >
</span> </span>
<span <span
v-if="controls"
class="el-input-number__increase el-icon-plus" class="el-input-number__increase el-icon-plus"
:class="{'is-disabled': maxDisabled}" :class="{'is-disabled': maxDisabled}"
v-repeat-click="increase" v-repeat-click="increase"
@ -58,7 +61,11 @@
default: 0 default: 0
}, },
disabled: Boolean, disabled: Boolean,
size: String size: String,
controls: {
type: Boolean,
default: true
}
}, },
directives: { directives: {
repeatClick: { repeatClick: {

View File

@ -82,5 +82,10 @@
padding-right: calc(var(--input-small-height) * 2 + 10); padding-right: calc(var(--input-small-height) * 2 + 10);
} }
} }
@when without-controls {
& .el-input__inner {
padding-right: 10px;
}
}
} }
} }

View File

@ -226,4 +226,20 @@ describe('InputNumber', () => {
done(); done();
}, 100); }, 100);
}); });
it('controls', () => {
vm = createVue({
template: `
<el-input-number :controls="false" v-model="value" :max="8">
</el-input-number>
`,
data() {
return {
value: 8
};
}
}, true);
expect(vm.$el.querySelector('.el-input-number__decrease')).to.not.exist;
expect(vm.$el.querySelector('.el-input-number__increase')).to.not.exist;
});
}); });