first
This commit is contained in:
1
node_modules/vant/es/switch/index.css
generated
vendored
Normal file
1
node_modules/vant/es/switch/index.css
generated
vendored
Normal file
@ -0,0 +1 @@
|
||||
.van-switch{position:relative;display:inline-block;box-sizing:content-box;width:2em;height:1em;font-size:30px;background-color:#fff;border:1px solid rgba(0,0,0,.1);border-radius:1em;cursor:pointer;-webkit-transition:background-color .3s;transition:background-color .3s}.van-switch__node{position:absolute;top:0;left:0;width:1em;height:1em;font-size:inherit;background-color:#fff;border-radius:100%;box-shadow:0 3px 1px 0 rgba(0,0,0,.05),0 2px 2px 0 rgba(0,0,0,.1),0 3px 3px 0 rgba(0,0,0,.05);-webkit-transition:-webkit-transform .3s cubic-bezier(.3,1.05,.4,1.05);transition:-webkit-transform .3s cubic-bezier(.3,1.05,.4,1.05);transition:transform .3s cubic-bezier(.3,1.05,.4,1.05);transition:transform .3s cubic-bezier(.3,1.05,.4,1.05),-webkit-transform .3s cubic-bezier(.3,1.05,.4,1.05)}.van-switch__loading{top:25%;left:25%;width:50%;height:50%;line-height:1}.van-switch--on{background-color:#1989fa}.van-switch--on .van-switch__node{-webkit-transform:translateX(1em);transform:translateX(1em)}.van-switch--on .van-switch__loading{color:#1989fa}.van-switch--disabled{cursor:not-allowed;opacity:.5}.van-switch--loading{cursor:default}
|
74
node_modules/vant/es/switch/index.js
generated
vendored
Normal file
74
node_modules/vant/es/switch/index.js
generated
vendored
Normal file
@ -0,0 +1,74 @@
|
||||
// Utils
|
||||
import { createNamespace, addUnit } from '../utils';
|
||||
import { switchProps } from './shared'; // Mixins
|
||||
|
||||
import { FieldMixin } from '../mixins/field'; // Components
|
||||
|
||||
import Loading from '../loading';
|
||||
|
||||
var _createNamespace = createNamespace('switch'),
|
||||
createComponent = _createNamespace[0],
|
||||
bem = _createNamespace[1];
|
||||
|
||||
export default createComponent({
|
||||
mixins: [FieldMixin],
|
||||
props: switchProps,
|
||||
computed: {
|
||||
checked: function checked() {
|
||||
return this.value === this.activeValue;
|
||||
},
|
||||
style: function style() {
|
||||
return {
|
||||
fontSize: addUnit(this.size),
|
||||
backgroundColor: this.checked ? this.activeColor : this.inactiveColor
|
||||
};
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
onClick: function onClick(event) {
|
||||
this.$emit('click', event);
|
||||
|
||||
if (!this.disabled && !this.loading) {
|
||||
var newValue = this.checked ? this.inactiveValue : this.activeValue;
|
||||
this.$emit('input', newValue);
|
||||
this.$emit('change', newValue);
|
||||
}
|
||||
},
|
||||
genLoading: function genLoading() {
|
||||
var h = this.$createElement;
|
||||
|
||||
if (this.loading) {
|
||||
var color = this.checked ? this.activeColor : this.inactiveColor;
|
||||
return h(Loading, {
|
||||
"class": bem('loading'),
|
||||
"attrs": {
|
||||
"color": color
|
||||
}
|
||||
});
|
||||
}
|
||||
}
|
||||
},
|
||||
render: function render() {
|
||||
var h = arguments[0];
|
||||
var checked = this.checked,
|
||||
loading = this.loading,
|
||||
disabled = this.disabled;
|
||||
return h("div", {
|
||||
"class": bem({
|
||||
on: checked,
|
||||
loading: loading,
|
||||
disabled: disabled
|
||||
}),
|
||||
"attrs": {
|
||||
"role": "switch",
|
||||
"aria-checked": String(checked)
|
||||
},
|
||||
"style": this.style,
|
||||
"on": {
|
||||
"click": this.onClick
|
||||
}
|
||||
}, [h("div", {
|
||||
"class": bem('node')
|
||||
}, [this.genLoading()])]);
|
||||
}
|
||||
});
|
59
node_modules/vant/es/switch/index.less
generated
vendored
Normal file
59
node_modules/vant/es/switch/index.less
generated
vendored
Normal file
@ -0,0 +1,59 @@
|
||||
@import '../style/var';
|
||||
|
||||
.van-switch {
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
box-sizing: content-box;
|
||||
width: @switch-width;
|
||||
height: @switch-height;
|
||||
font-size: @switch-size;
|
||||
background-color: @switch-background-color;
|
||||
border: @switch-border;
|
||||
border-radius: @switch-node-size;
|
||||
cursor: pointer;
|
||||
transition: background-color @switch-transition-duration;
|
||||
|
||||
&__node {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: @switch-node-size;
|
||||
height: @switch-node-size;
|
||||
// https://github.com/vant-ui/vant/issues/9839
|
||||
font-size: inherit;
|
||||
background-color: @switch-node-background-color;
|
||||
border-radius: 100%;
|
||||
box-shadow: @switch-node-box-shadow;
|
||||
transition: transform @switch-transition-duration
|
||||
cubic-bezier(0.3, 1.05, 0.4, 1.05);
|
||||
}
|
||||
|
||||
&__loading {
|
||||
top: 25%;
|
||||
left: 25%;
|
||||
width: 50%;
|
||||
height: 50%;
|
||||
line-height: 1;
|
||||
}
|
||||
|
||||
&--on {
|
||||
background-color: @switch-on-background-color;
|
||||
|
||||
.van-switch__node {
|
||||
transform: translateX(@switch-width - @switch-node-size);
|
||||
}
|
||||
|
||||
.van-switch__loading {
|
||||
color: @switch-on-background-color;
|
||||
}
|
||||
}
|
||||
|
||||
&--disabled {
|
||||
cursor: not-allowed;
|
||||
opacity: @switch-disabled-opacity;
|
||||
}
|
||||
|
||||
&--loading {
|
||||
cursor: default;
|
||||
}
|
||||
}
|
19
node_modules/vant/es/switch/shared.js
generated
vendored
Normal file
19
node_modules/vant/es/switch/shared.js
generated
vendored
Normal file
@ -0,0 +1,19 @@
|
||||
/**
|
||||
* Common Switch Props
|
||||
*/
|
||||
export var switchProps = {
|
||||
size: [Number, String],
|
||||
value: null,
|
||||
loading: Boolean,
|
||||
disabled: Boolean,
|
||||
activeColor: String,
|
||||
inactiveColor: String,
|
||||
activeValue: {
|
||||
type: null,
|
||||
default: true
|
||||
},
|
||||
inactiveValue: {
|
||||
type: null,
|
||||
default: false
|
||||
}
|
||||
};
|
3
node_modules/vant/es/switch/style/index.js
generated
vendored
Normal file
3
node_modules/vant/es/switch/style/index.js
generated
vendored
Normal file
@ -0,0 +1,3 @@
|
||||
import '../../style/base.css';
|
||||
import '../../loading/index.css';
|
||||
import '../index.css';
|
3
node_modules/vant/es/switch/style/less.js
generated
vendored
Normal file
3
node_modules/vant/es/switch/style/less.js
generated
vendored
Normal file
@ -0,0 +1,3 @@
|
||||
import '../../style/base.less';
|
||||
import '../../loading/index.less';
|
||||
import '../index.less';
|
Reference in New Issue
Block a user