update ColorPicker

This commit is contained in:
梁灏 2017-08-18 16:49:42 +08:00
parent 59dc2df009
commit 8105945f4f
4 changed files with 19 additions and 4 deletions

View file

@ -3,8 +3,8 @@
{{ color }} {{ color }}
<!--<Input placeholder="请输入..." size="large" style="width: 50px;"></Input>--> <!--<Input placeholder="请输入..." size="large" style="width: 50px;"></Input>-->
<!--<color-picker placement="bottom-start" size="large"></color-picker>--> <!--<color-picker placement="bottom-start" size="large"></color-picker>-->
<!--<Date-picker type="date" placeholder="选择日期" size="large" style="width: 200px"></Date-picker>--> <Date-picker transfer type="date" placeholder="选择日期" size="large" style="width: 200px"></Date-picker>
<color-picker ref="xxx" v-model="color" format="rgb" alpha :recommend="true"></color-picker> <color-picker :transfer="true" ref="xxx" v-model="color" format="rgb" alpha :recommend="true"></color-picker>
<color-picker v-model="color2" :alpha="false" :recommend="false"></color-picker> <color-picker v-model="color2" :alpha="false" :recommend="false"></color-picker>
<!--<Date-picker type="date" placeholder="选择日期" style="width: 200px"></Date-picker>--> <!--<Date-picker type="date" placeholder="选择日期" style="width: 200px"></Date-picker>-->
<!--<color-picker placement="bottom-start" size="small"></color-picker>--> <!--<color-picker placement="bottom-start" size="small"></color-picker>-->

View file

@ -1,5 +1,5 @@
<template> <template>
<Dropdown :class="[prefixCls]" ref="picker" trigger="click" :transfer="transfer" :placement="placement" @on-visible-change="handleToggleVisible"> <Dropdown :class="classes" class-name="ivu-transfer-" ref="picker" trigger="click" :transfer="transfer" :placement="placement" @on-visible-change="handleToggleVisible">
<div :class="wrapClasses"> <div :class="wrapClasses">
<i class="ivu-icon ivu-icon-arrow-down-b ivu-input-icon ivu-input-icon-normal"></i> <i class="ivu-icon ivu-icon-arrow-down-b ivu-input-icon ivu-input-icon-normal"></i>
<div :class="inputClasses"> <div :class="inputClasses">
@ -197,6 +197,14 @@
this.val = newVal; this.val = newVal;
} }
}, },
classes () {
return [
`${prefixCls}`,
{
[`${prefixCls}-transfer`]: this.transfer
}
];
},
wrapClasses () { wrapClasses () {
return [ return [
`${prefixCls}-rel`, `${prefixCls}-rel`,

View file

@ -1,5 +1,5 @@
<template> <template>
<div class="ivu-select-dropdown" :style="styles"><slot></slot></div> <div class="ivu-select-dropdown" :class="className" :style="styles"><slot></slot></div>
</template> </template>
<script> <script>
import Vue from 'vue'; import Vue from 'vue';
@ -13,6 +13,9 @@
placement: { placement: {
type: String, type: String,
default: 'bottom-start' default: 'bottom-start'
},
className: {
type: String
} }
}, },
data () { data () {

View file

@ -1,4 +1,5 @@
@select-dropdown-prefix-cls: ~"@{css-prefix}select-dropdown"; @select-dropdown-prefix-cls: ~"@{css-prefix}select-dropdown";
@transfer-no-max-height: ~"@{css-prefix}transfer-no-max-height";
.@{select-dropdown-prefix-cls} { .@{select-dropdown-prefix-cls} {
width: inherit; width: inherit;
@ -17,6 +18,9 @@
&-transfer{ &-transfer{
z-index: @zindex-transfer; z-index: @zindex-transfer;
} }
&.@{transfer-no-max-height} {
max-height: none;
}
} }
.@{modal-prefix-cls} { .@{modal-prefix-cls} {
.@{select-dropdown-prefix-cls} { .@{select-dropdown-prefix-cls} {