提交初始版本,使用vant ui库
This commit is contained in:
1
miniprogram_npm/@vant/weapp/switch/index.d.ts
vendored
Normal file
1
miniprogram_npm/@vant/weapp/switch/index.d.ts
vendored
Normal file
@@ -0,0 +1 @@
|
||||
export {};
|
38
miniprogram_npm/@vant/weapp/switch/index.js
Normal file
38
miniprogram_npm/@vant/weapp/switch/index.js
Normal file
@@ -0,0 +1,38 @@
|
||||
"use strict";
|
||||
Object.defineProperty(exports, "__esModule", { value: true });
|
||||
var component_1 = require("../common/component");
|
||||
(0, component_1.VantComponent)({
|
||||
field: true,
|
||||
classes: ['node-class'],
|
||||
props: {
|
||||
checked: null,
|
||||
loading: Boolean,
|
||||
disabled: Boolean,
|
||||
activeColor: String,
|
||||
inactiveColor: String,
|
||||
size: {
|
||||
type: String,
|
||||
value: '30',
|
||||
},
|
||||
activeValue: {
|
||||
type: null,
|
||||
value: true,
|
||||
},
|
||||
inactiveValue: {
|
||||
type: null,
|
||||
value: false,
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
onClick: function () {
|
||||
var _a = this.data, activeValue = _a.activeValue, inactiveValue = _a.inactiveValue, disabled = _a.disabled, loading = _a.loading;
|
||||
if (disabled || loading) {
|
||||
return;
|
||||
}
|
||||
var checked = this.data.checked === activeValue;
|
||||
var value = checked ? inactiveValue : activeValue;
|
||||
this.$emit('input', value);
|
||||
this.$emit('change', value);
|
||||
},
|
||||
},
|
||||
});
|
6
miniprogram_npm/@vant/weapp/switch/index.json
Normal file
6
miniprogram_npm/@vant/weapp/switch/index.json
Normal file
@@ -0,0 +1,6 @@
|
||||
{
|
||||
"component": true,
|
||||
"usingComponents": {
|
||||
"van-loading": "../loading/index"
|
||||
}
|
||||
}
|
16
miniprogram_npm/@vant/weapp/switch/index.wxml
Normal file
16
miniprogram_npm/@vant/weapp/switch/index.wxml
Normal file
@@ -0,0 +1,16 @@
|
||||
<wxs src="../wxs/utils.wxs" module="utils" />
|
||||
<wxs src="./index.wxs" module="computed" />
|
||||
|
||||
<view
|
||||
class="{{ utils.bem('switch', { on: checked === activeValue, disabled }) }} custom-class"
|
||||
style="{{ computed.rootStyle({ size, checked, activeColor, inactiveColor, activeValue }) }}"
|
||||
bind:tap="onClick"
|
||||
>
|
||||
<view class="van-switch__node node-class">
|
||||
<van-loading
|
||||
wx:if="{{ loading }}"
|
||||
color="{{ computed.loadingColor({ checked, activeColor, inactiveColor, activeValue }) }}"
|
||||
custom-class="van-switch__loading"
|
||||
/>
|
||||
</view>
|
||||
</view>
|
26
miniprogram_npm/@vant/weapp/switch/index.wxs
Normal file
26
miniprogram_npm/@vant/weapp/switch/index.wxs
Normal file
@@ -0,0 +1,26 @@
|
||||
/* eslint-disable */
|
||||
var style = require('../wxs/style.wxs');
|
||||
var addUnit = require('../wxs/add-unit.wxs');
|
||||
|
||||
function rootStyle(data) {
|
||||
var currentColor = data.checked === data.activeValue ? data.activeColor : data.inactiveColor;
|
||||
|
||||
return style({
|
||||
'font-size': addUnit(data.size),
|
||||
'background-color': currentColor,
|
||||
});
|
||||
}
|
||||
|
||||
var BLUE = '#1989fa';
|
||||
var GRAY_DARK = '#969799';
|
||||
|
||||
function loadingColor(data) {
|
||||
return data.checked === data.activeValue
|
||||
? data.activeColor || BLUE
|
||||
: data.inactiveColor || GRAY_DARK;
|
||||
}
|
||||
|
||||
module.exports = {
|
||||
rootStyle: rootStyle,
|
||||
loadingColor: loadingColor,
|
||||
};
|
1
miniprogram_npm/@vant/weapp/switch/index.wxss
Normal file
1
miniprogram_npm/@vant/weapp/switch/index.wxss
Normal file
@@ -0,0 +1 @@
|
||||
@import '../common/index.wxss';.van-switch{background-color:var(--switch-background-color,#fff);border:var(--switch-border,1px solid rgba(0,0,0,.1));border-radius:var(--switch-node-size,1em);box-sizing:initial;display:inline-block;height:var(--switch-height,1em);position:relative;transition:background-color var(--switch-transition-duration,.3s);width:var(--switch-width,2em)}.van-switch__node{background-color:var(--switch-node-background-color,#fff);border-radius:100%;box-shadow:var(--switch-node-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));height:var(--switch-node-size,1em);left:0;position:absolute;top:0;transition:var(--switch-transition-duration,.3s) cubic-bezier(.3,1.05,.4,1.05);width:var(--switch-node-size,1em);z-index:var(--switch-node-z-index,1)}.van-switch__loading{height:50%;left:25%;position:absolute!important;top:25%;width:50%}.van-switch--on{background-color:var(--switch-on-background-color,#1989fa)}.van-switch--on .van-switch__node{transform:translateX(calc(var(--switch-width, 2em) - var(--switch-node-size, 1em)))}.van-switch--disabled{opacity:var(--switch-disabled-opacity,.4)}
|
Reference in New Issue
Block a user