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

litemall-wx/lib/vant-weapp/tree-select/index.json

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

litemall-wx/lib/vant-weapp/tree-select/index.wxml

+<wxs src="../wxs/utils.wxs" module="utils" />
+<wxs src="./index.wxs" module="wxs" />
+
+<view
+  class="van-tree-select"
+  style="height: {{ innerHeight }}"
+>
+  <scroll-view scroll-y class="van-tree-select__nav">
+    <van-sidebar active-key="{{ mainActiveIndex }}" bind:change="onClickNav" custom-class="van-tree-select__nav__inner">
+      <van-sidebar-item
+        wx:for="{{ items }}"
+        wx:key="index"
+        custom-class="main-item-class"
+        active-class="main-active-class"
+        disabled-class="main-disabled-class"
+        title="{{ item.text }}"
+        disabled="{{ item.disabled }}"
+      />
+    </van-sidebar>
+  </scroll-view>
+  <scroll-view scroll-y class="van-tree-select__content">
+    <slot name="content" />
+    <view
+      wx:for="{{ subItems }}"
+      wx:key="id"
+      class="van-ellipsis content-item-class {{ utils.bem('tree-select__item', { active: wxs.isActive(activeId, item.id), disabled: item.disabled }) }} {{ wxs.isActive(activeId, item.id) ? 'content-active-class' : '' }} {{ item.disabled ? 'content-disabled-class' : '' }}"
+      data-item="{{ item }}"
+      bind:tap="onSelectItem"
+    >
+      {{ item.text }}
+      <van-icon
+        wx:if="{{ wxs.isActive(activeId, item.id) }}"
+        name="checked"
+        size="16px"
+        class="van-tree-select__selected"
+      />
+    </view>
+  </scroll-view>
+</view>

litemall-wx/lib/vant-weapp/tree-select/index.wxs

+/* eslint-disable */
+var array = require('../wxs/array.wxs');
+
+function isActive (activeList, itemId) {
+  if (array.isArray(activeList)) {
+    return activeList.indexOf(itemId) > -1;
+  }
+
+  return activeList === itemId;
+}
+
+module.exports.isActive = isActive;

litemall-wx/lib/vant-weapp/tree-select/index.wxss

+@import '../common/index.wxss';.van-tree-select{position:relative;display:-webkit-flex;display:flex;-webkit-user-select:none;user-select:none;font-size:14px;font-size:var(--tree-select-font-size,14px)}.van-tree-select__nav{-webkit-flex:1;flex:1;background-color:#fafafa;background-color:var(--tree-select-nav-background-color,#fafafa);--sidebar-padding:12px 8px 12px 12px}.van-tree-select__nav__inner{width:100%!important;height:100%}.van-tree-select__content{-webkit-flex:2;flex:2;background-color:#fff;background-color:var(--tree-select-content-background-color,#fff)}.van-tree-select__item{position:relative;font-weight:700;padding:0 32px 0 16px;padding:0 32px 0 var(--padding-md,16px);line-height:44px;line-height:var(--tree-select-item-height,44px)}.van-tree-select__item--active{color:#ee0a24;color:var(--tree-select-item-active-color,#ee0a24)}.van-tree-select__item--disabled{color:#c8c9cc;color:var(--tree-select-item-disabled-color,#c8c9cc)}.van-tree-select__selected{position:absolute;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);right:16px;right:var(--padding-md,16px)}
\ No newline at end of file

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

+export {};

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

+import { VantComponent } from '../common/component';
+import { isImageFile } from './utils';
+import { addUnit } from '../common/utils';
+VantComponent({
+    props: {
+        disabled: Boolean,
+        multiple: Boolean,
+        uploadText: String,
+        useSlot: Boolean,
+        useBeforeRead: Boolean,
+        previewSize: {
+            type: null,
+            value: 90,
+            observer: 'setComputedPreviewSize'
+        },
+        name: {
+            type: [Number, String],
+            value: ''
+        },
+        accept: {
+            type: String,
+            value: 'image'
+        },
+        fileList: {
+            type: Array,
+            value: [],
+            observer: 'formatFileList'
+        },
+        maxSize: {
+            type: Number,
+            value: Number.MAX_VALUE
+        },
+        maxCount: {
+            type: Number,
+            value: 100
+        },
+        deletable: {
+            type: Boolean,
+            value: true
+        },
+        previewImage: {
+            type: Boolean,
+            value: true
+        },
+        previewFullImage: {
+            type: Boolean,
+            value: true
+        },
+        imageFit: {
+            type: String,
+            value: 'scaleToFill'
+        }
+    },
+    data: {
+        lists: [],
+        computedPreviewSize: '',
+        isInCount: true
+    },
+    methods: {
+        formatFileList() {
+            const { fileList = [], maxCount } = this.data;
+            const lists = fileList.map(item => (Object.assign(Object.assign({}, item), { isImage: typeof item.isImage === 'undefined' ? isImageFile(item) : item.isImage })));
+            this.setData({ lists, isInCount: lists.length < maxCount });
+        },
+        setComputedPreviewSize(val) {
+            this.setData({
+                computedPreviewSize: addUnit(val)
+            });
+        },
+        startUpload() {
+            if (this.data.disabled)
+                return;
+            const { name = '', capture = ['album', 'camera'], maxCount = 100, multiple = false, maxSize, accept, lists, useBeforeRead = false // 是否定义了 beforeRead
+             } = this.data;
+            let chooseFile = null;
+            const newMaxCount = maxCount - lists.length;
+            // 设置为只选择图片的时候使用 chooseImage 来实现
+            if (accept === 'image') {
+                chooseFile = new Promise((resolve, reject) => {
+                    wx.chooseImage({
+                        count: multiple ? (newMaxCount > 9 ? 9 : newMaxCount) : 1,
+                        sourceType: capture,
+                        success: resolve,
+                        fail: reject
+                    });
+                });
+            }
+            else {
+                chooseFile = new Promise((resolve, reject) => {
+                    wx.chooseMessageFile({
+                        count: multiple ? newMaxCount : 1,
+                        type: 'file',
+                        success: resolve,
+                        fail: reject
+                    });
+                });
+            }
+            chooseFile.then((res) => {
+                const file = multiple ? res.tempFiles : res.tempFiles[0];
+                // 检查文件大小
+                if (file instanceof Array) {
+                    const sizeEnable = file.every(item => item.size <= maxSize);
+                    if (!sizeEnable) {
+                        this.$emit('oversize', { name });
+                        return;
+                    }
+                }
+                else if (file.size > maxSize) {
+                    this.$emit('oversize', { name });
+                    return;
+                }
+                // 触发上传之前的钩子函数
+                if (useBeforeRead) {
+                    this.$emit('before-read', {
+                        file,
+                        name,
+                        callback: (result) => {
+                            if (result) {
+                                // 开始上传
+                                this.$emit('after-read', { file, name });
+                            }
+                        }
+                    });
+                }
+                else {
+                    this.$emit('after-read', { file, name });
+                }
+            });
+        },
+        deleteItem(event) {
+            const { index } = event.currentTarget.dataset;
+            this.$emit('delete', { index, name: this.data.name });
+        },
+        doPreviewImage(event) {
+            if (!this.data.previewFullImage)
+                return;
+            const curUrl = event.currentTarget.dataset.url;
+            const images = this.data.lists
+                .filter(item => item.isImage)
+                .map(item => item.url || item.path);
+            this.$emit('click-preview', { url: curUrl, name: this.data.name });
+            wx.previewImage({
+                urls: images,
+                current: curUrl,
+                fail() {
+                    wx.showToast({ title: '预览图片失败', icon: 'none' });
+                }
+            });
+        }
+    }
+});

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

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

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

+<wxs src="../wxs/utils.wxs" module="utils" />
+
+<view class="van-uploader">
+  <view class="van-uploader__wrapper">
+    <!-- 预览样式 -->
+    <view
+      wx:if="{{ previewImage }}"
+      wx:for="{{ lists  }}"
+      wx:key="index"
+      class="van-uploader__preview"
+    >
+      <image
+        wx:if="{{ item.isImage }}"
+        mode="{{ imageFit }}"
+        src="{{ item.url || item.path }}"
+        alt="{{ item.name || ('图片' + index) }}"
+        class="van-uploader__preview-image"
+        style="width: {{ computedPreviewSize }}; height: {{ computedPreviewSize }};"
+        data-url="{{ item.url || item.path }}"
+        bind:tap="doPreviewImage"
+      />
+      <view
+        wx:else
+        class="van-uploader__file"
+        style="width: {{ computedPreviewSize }}; height: {{ computedPreviewSize }};"
+      >
+        <van-icon name="description" class="van-uploader__file-icon" />
+        <view class="van-uploader__file-name van-ellipsis">{{ item.name || item.url || item.path }}</view>
+      </view>
+      <van-icon
+        wx:if="{{ deletable }}"
+        name="clear"
+        class="van-uploader__preview-delete"
+        data-index="{{ index }}"
+        bind:tap="deleteItem"
+      />
+    </view>
+
+    <!-- 上传样式 -->
+    <block wx:if="{{ isInCount }}">
+      <view wx:if="{{ useSlot }}" class="van-uploader__slot" bind:tap="startUpload">
+        <slot />
+      </view>
+
+      <!-- 默认上传样式 -->
+      <view
+        wx:else
+        class="van-uploader__upload"
+        style="width: {{ computedPreviewSize }}; height: {{ computedPreviewSize }};"
+        bind:tap="startUpload"
+      >
+        <van-icon name="plus" class="van-uploader__upload-icon" />
+        <text wx:if="{{ uploadText }}" class="van-uploader__upload-text">{{ uploadText }}</text>
+      </view>
+    </block>
+  </view>
+</view>

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

+@import '../common/index.wxss';.van-uploader{position:relative;display:inline-block}.van-uploader__wrapper{display:-webkit-flex;display:flex;-webkit-flex-wrap:wrap;flex-wrap:wrap}.van-uploader__upload{position:relative;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;box-sizing:border-box;width:80px;height:80px;margin:0 8px 8px 0;background-color:#fff;border:1px dashed #ebedf0;border-radius:4px}.van-uploader__upload-icon{display:inline-block;width:24px;height:24px;color:#969799;font-size:24px}.van-uploader__upload-text{margin-top:8px;color:#969799;font-size:12px}.van-uploader__preview{position:relative;margin:0 8px 8px 0}.van-uploader__preview-image{display:block;width:80px;height:80px;border-radius:4px}.van-uploader__preview-delete{position:absolute;top:-8px;right:-8px;color:#969799;font-size:18px;background-color:#fff;border-radius:100%}.van-uploader__file{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;width:80px;height:80px;background-color:#f7f8fa;border-radius:4px}.van-uploader__file-icon{display:inline-block;width:20px;height:20px;color:#646566;font-size:20px}.van-uploader__file-name{box-sizing:border-box;width:100%;margin-top:8px;padding:0 5px;color:#646566;font-size:12px;text-align:center}
\ No newline at end of file

litemall-wx/lib/vant-weapp/uploader/utils.d.ts

+interface File {
+    path: string;
+    url: string;
+    size: number;
+    name: string;
+    type: string;
+    time: number;
+    image: boolean;
+}
+export declare function isImageUrl(url: string): boolean;
+export declare function isImageFile(item: File): boolean;
+export {};

litemall-wx/lib/vant-weapp/uploader/utils.js

+const IMAGE_EXT = ['jpeg', 'jpg', 'gif', 'png', 'svg'];
+export function isImageUrl(url) {
+    return IMAGE_EXT.some(ext => url.indexOf(`.${ext}`) !== -1);
+}
+export function isImageFile(item) {
+    if (item.type) {
+        return item.type.indexOf('image') === 0;
+    }
+    if (item.path) {
+        return isImageUrl(item.path);
+    }
+    if (item.url) {
+        return isImageUrl(item.url);
+    }
+    return false;
+}