chore[litemall-wx]: 使用vant-weapp 1.0

litemall-wx/lib/vant-weapp/switch/index.d.ts

+export {};

litemall-wx/lib/vant-weapp/switch/index.js

+import { VantComponent } from '../common/component';
+import { BLUE, GRAY_DARK } from '../common/color';
+VantComponent({
+    field: true,
+    classes: ['node-class'],
+    props: {
+        checked: null,
+        loading: Boolean,
+        disabled: Boolean,
+        activeColor: String,
+        inactiveColor: String,
+        size: {
+            type: String,
+            value: '30px'
+        },
+        activeValue: {
+            type: null,
+            value: true
+        },
+        inactiveValue: {
+            type: null,
+            value: false
+        }
+    },
+    watch: {
+        checked(value) {
+            const loadingColor = this.getLoadingColor(value);
+            this.setData({ value, loadingColor });
+        }
+    },
+    created() {
+        const { checked: value } = this.data;
+        const loadingColor = this.getLoadingColor(value);
+        this.setData({ value, loadingColor });
+    },
+    methods: {
+        getLoadingColor(checked) {
+            const { activeColor, inactiveColor } = this.data;
+            return checked ? activeColor || BLUE : inactiveColor || GRAY_DARK;
+        },
+        onClick() {
+            const { activeValue, inactiveValue } = this.data;
+            if (!this.data.disabled && !this.data.loading) {
+                const checked = this.data.checked === activeValue;
+                const value = checked ? inactiveValue : activeValue;
+                this.$emit('input', value);
+                this.$emit('change', value);
+            }
+        }
+    }
+});

litemall-wx/lib/vant-weapp/switch/index.json

+{
+  "component": true,
+  "usingComponents": {
+    "van-loading": "../loading/index"
+  }
+}

litemall-wx/lib/vant-weapp/switch/index.wxml

+<wxs src="../wxs/utils.wxs" module="utils" />
+
+<view
+  class="custom-class {{ utils.bem('switch', { on: value === activeValue, disabled }) }}"
+  style="font-size: {{ size }}; {{ (checked ? activeColor : inactiveColor) ? 'background-color: ' + (checked ? activeColor : inactiveColor ) : '' }}"
+  bind:tap="onClick"
+>
+  <view class="van-switch__node node-class">
+    <van-loading wx:if="{{ loading }}" color="{{ loadingColor }}" custom-class="van-switch__loading" />
+  </view>
+</view>

litemall-wx/lib/vant-weapp/switch/index.wxss

+@import '../common/index.wxss';.van-switch{position:relative;display:inline-block;box-sizing:initial;width:2em;width:var(--switch-width,2em);height:1em;height:var(--switch-height,1em);background-color:#fff;background-color:var(--switch-background-color,#fff);border:1px solid rgba(0,0,0,.1);border:var(--switch-border,1px solid rgba(0,0,0,.1));border-radius:1em;border-radius:var(--switch-node-size,1em);transition:background-color .3s;transition:background-color var(--switch-transition-duration,.3s)}.van-switch__node{position:absolute;top:0;left:0;border-radius:100%;z-index:1;z-index:var(--switch-node-z-index,1);width:1em;width:var(--switch-node-size,1em);height:1em;height:var(--switch-node-size,1em);background-color:#fff;background-color:var(--switch-node-background-color,#fff);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);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));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);transition:-webkit-transform var(--switch-transition-duration,.3s) cubic-bezier(.3,1.05,.4,1.05);transition:transform var(--switch-transition-duration,.3s) cubic-bezier(.3,1.05,.4,1.05);transition:transform var(--switch-transition-duration,.3s) cubic-bezier(.3,1.05,.4,1.05),-webkit-transform var(--switch-transition-duration,.3s) cubic-bezier(.3,1.05,.4,1.05)}.van-switch__loading{position:absolute!important;top:25%;left:25%;width:50%;height:50%}.van-switch--on{background-color:#1989fa;background-color:var(--switch-on-background-color,#1989fa)}.van-switch--on .van-switch__node{-webkit-transform:translateX(1em);transform:translateX(1em);-webkit-transform:translateX(calc(var(--switch-width, 2em) - var(--switch-node-size, 1em)));transform:translateX(calc(var(--switch-width, 2em) - var(--switch-node-size, 1em)))}.van-switch--disabled{opacity:.4;opacity:var(--switch-disabled-opacity,.4)}
\ No newline at end of file

litemall-wx/lib/vant-weapp/tab/index.d.ts

+export {};

litemall-wx/lib/vant-weapp/tab/index.js

+import { VantComponent } from '../common/component';
+VantComponent({
+    relation: {
+        name: 'tabs',
+        type: 'ancestor',
+        linked(target) {
+            this.parent = target;
+        },
+        unlinked() {
+            this.parent = null;
+        }
+    },
+    props: {
+        dot: Boolean,
+        info: null,
+        title: String,
+        disabled: Boolean,
+        titleStyle: String,
+        name: {
+            type: [Number, String],
+            value: '',
+        }
+    },
+    data: {
+        active: false
+    },
+    watch: {
+        title: 'update',
+        disabled: 'update',
+        dot: 'update',
+        info: 'update',
+        titleStyle: 'update'
+    },
+    methods: {
+        getComputedName() {
+            if (this.data.name !== '') {
+                return this.data.name;
+            }
+            return this.index;
+        },
+        updateRender(active, parent) {
+            const { data: parentData } = parent;
+            this.inited = this.inited || active;
+            this.setData({
+                active,
+                shouldRender: this.inited || !parentData.lazyRender,
+                shouldShow: active || parentData.animated
+            });
+        },
+        update() {
+            if (this.parent) {
+                this.parent.updateTabs();
+            }
+        }
+    }
+});

litemall-wx/lib/vant-weapp/tab/index.json

+{
+  "component": true
+}
\ No newline at end of file

litemall-wx/lib/vant-weapp/tab/index.wxml

+<wxs src="../wxs/utils.wxs" module="utils" />
+
+<view
+  class="custom-class {{ utils.bem('tab__pane', { active, inactive: !active }) }}"
+  style="{{ shouldShow ? '' : 'display: none;' }}"
+>
+  <slot wx:if="{{ shouldRender }}" />
+</view>

litemall-wx/lib/vant-weapp/tab/index.wxss

+@import '../common/index.wxss';:host{-webkit-flex-shrink:0;flex-shrink:0;width:100%}.van-tab__pane,:host{box-sizing:border-box}.van-tab__pane{overflow-y:auto}.van-tab__pane--active{height:auto}.van-tab__pane--inactive{height:0;overflow:visible}
\ No newline at end of file

litemall-wx/lib/vant-weapp/tabbar-item/index.d.ts

+export {};

litemall-wx/lib/vant-weapp/tabbar-item/index.js

+import { VantComponent } from '../common/component';
+VantComponent({
+    props: {
+        info: null,
+        name: null,
+        icon: String,
+        dot: Boolean
+    },
+    relation: {
+        name: 'tabbar',
+        type: 'ancestor'
+    },
+    data: {
+        active: false
+    },
+    methods: {
+        onClick() {
+            if (this.parent) {
+                this.parent.onChange(this);
+            }
+            this.$emit('click');
+        },
+        updateFromParent() {
+            const { parent } = this;
+            if (!parent) {
+                return;
+            }
+            const index = parent.children.indexOf(this);
+            const parentData = parent.data;
+            const { data } = this;
+            const active = (data.name || index) === parentData.active;
+            const patch = {};
+            if (active !== data.active) {
+                patch.active = active;
+            }
+            if (parentData.activeColor !== data.activeColor) {
+                patch.activeColor = parentData.activeColor;
+            }
+            if (parentData.inactiveColor !== data.inactiveColor) {
+                patch.inactiveColor = parentData.inactiveColor;
+            }
+            return Object.keys(patch).length > 0
+                ? this.set(patch)
+                : Promise.resolve();
+        }
+    }
+});

litemall-wx/lib/vant-weapp/tabbar-item/index.json

+{
+  "component": true,
+  "usingComponents": {
+    "van-icon": "../icon/index",
+    "van-info": "../info/index"
+  }
+}

litemall-wx/lib/vant-weapp/tabbar-item/index.wxml

+<wxs src="../wxs/utils.wxs" module="utils" />
+
+<view
+  class="{{ utils.bem('tabbar-item', { active }) }} custom-class"
+  style="color: {{ active ? activeColor : inactiveColor }}"
+  bind:tap="onClick"
+>
+  <view class="van-tabbar-item__icon">
+    <van-icon
+      wx:if="{{ icon }}"
+      name="{{ icon }}"
+      custom-class="van-tabbar-item__icon__inner"
+    />
+    <block wx:else>
+      <slot
+        wx:if="{{ active }}"
+        name="icon-active"
+      />
+      <slot wx:else name="icon" />
+    </block>
+    <van-info
+      dot="{{ dot }}"
+      info="{{ info }}"
+      custom-class="van-tabbar-item__info"
+    />
+  </view>
+  <view class="van-tabbar-item__text">
+    <slot />
+  </view>
+</view>

litemall-wx/lib/vant-weapp/tabbar-item/index.wxss

+@import '../common/index.wxss';:host{-webkit-flex:1;flex:1}.van-tabbar-item{display:-webkit-flex;display:flex;-webkit-flex-direction:column;flex-direction:column;-webkit-align-items:center;align-items:center;-webkit-justify-content:center;justify-content:center;height:100%;color:#646566;color:var(--tabbar-item-text-color,#646566);font-size:12px;font-size:var(--tabbar-item-font-size,12px);line-height:1;line-height:var(--tabbar-item-line-height,1)}.van-tabbar-item__icon{position:relative;margin-bottom:5px;margin-bottom:var(--tabbar-item-margin-bottom,5px);font-size:18px;font-size:var(--tabbar-item-icon-size,18px)}.van-tabbar-item__icon__inner{display:block;min-width:1em}.van-tabbar-item--active{color:#1989fa;color:var(--tabbar-item-active-color,#1989fa)}.van-tabbar-item__info{margin-top:2px}
\ No newline at end of file

litemall-wx/lib/vant-weapp/tabbar/index.d.ts

+export {};

litemall-wx/lib/vant-weapp/tabbar/index.js

+import { VantComponent } from '../common/component';
+VantComponent({
+    relation: {
+        name: 'tabbar-item',
+        type: 'descendant',
+        linked(target) {
+            this.children.push(target);
+            target.parent = this;
+            target.updateFromParent();
+        },
+        unlinked(target) {
+            this.children = this.children.filter((item) => item !== target);
+            this.updateChildren();
+        }
+    },
+    props: {
+        active: {
+            type: null,
+            observer: 'updateChildren'
+        },
+        activeColor: {
+            type: String,
+            observer: 'updateChildren'
+        },
+        inactiveColor: {
+            type: String,
+            observer: 'updateChildren'
+        },
+        fixed: {
+            type: Boolean,
+            value: true
+        },
+        border: {
+            type: Boolean,
+            value: true
+        },
+        zIndex: {
+            type: Number,
+            value: 1
+        },
+        safeAreaInsetBottom: {
+            type: Boolean,
+            value: true
+        }
+    },
+    beforeCreate() {
+        this.children = [];
+    },
+    methods: {
+        updateChildren() {
+            const { children } = this;
+            if (!Array.isArray(children) || !children.length) {
+                return Promise.resolve();
+            }
+            return Promise.all(children.map((child) => child.updateFromParent()));
+        },
+        onChange(child) {
+            const index = this.children.indexOf(child);
+            const active = child.data.name || index;
+            if (active !== this.data.active) {
+                this.$emit('change', active);
+            }
+        }
+    }
+});

litemall-wx/lib/vant-weapp/tabbar/index.json

+{
+  "component": true
+}

litemall-wx/lib/vant-weapp/tabbar/index.wxml

+<wxs src="../wxs/utils.wxs" module="utils" />
+
+<view
+  class="custom-class {{ border ? 'van-hairline--top-bottom' : '' }} {{ utils.bem('tabbar', { fixed, safe: safeAreaInsetBottom }) }}"
+  style="{{ zIndex ? 'z-index: ' + zIndex : '' }}"
+>
+  <slot />
+</view>

litemall-wx/lib/vant-weapp/tabbar/index.wxss

+@import '../common/index.wxss';.van-tabbar{display:-webkit-flex;display:flex;width:100%;height:50px;height:var(--tabbar-height,50px);background-color:#fff;background-color:var(--tabbar-background-color,#fff)}.van-tabbar--fixed{position:fixed;bottom:0;left:0}.van-tabbar--safe{padding-bottom:env(safe-area-inset-bottom)}
\ No newline at end of file