feat: 添加自定义iconfont

miniprogram/ui/button/button.ts

@@ -6,36 +6,40 @@ Component({
      * 组件的属性列表
      */
     properties: {
-        key: {
-            type: Number,
-            value: 0,
-        },
-        word: {
+        type: {
             type: String,
-            value: '',
+            value: 'default', // default, green, white
         },
-        color: {
+        size: {
             type: String,
-            value: '',
+            value: 'normal', // large, normal, small, mini
+        },
+        icon: {
+            type: String,
+            value: '', // 图标名称
+        },
+        disabled: {
+            type: Boolean,
+            value: false, // 是否禁用
+        },
+        flat: {
+            type: Boolean,
+            value: false, // 是否扁平化
+        },
+        loading: {
+            type: Boolean,
+            value: false, // 是否加载中
         },
     },
     /**
      * 组件的初始数据
      */
-    data: {
-        word: '',
-        color: '',
-    },
+    data: {},
     lifetimes: {
         attached() {},
     },
     /**
      * 组件的方法列表
      */
-    methods: {
-        onDelete() {
-            const { key, word } = this.data;
-            this.triggerEvent('onDelete', { key, word });
-        },
-    },
+    methods: {},
 });

miniprogram/ui/icon/icon.json

@@ -0,0 +1,4 @@
+{
+  "usingComponents": {},
+  "component": true
+}

miniprogram/ui/icon/icon.less

@@ -0,0 +1,21 @@
+@import '../../style/theme.less';
+@import '../../assets/font/iconfont.less';
+
+.icon {
+    margin: 0;
+    padding: 0;
+    display: inline-block;
+    vertical-align: middle;
+    font-size: inherit;
+    color: inherit;
+
+    &.icon_image {
+        width: @font-size-icon;
+        height: @font-size-icon;
+    }
+
+    &__image {
+        width: 100%;
+        height: 100%;
+    }
+}

miniprogram/ui/icon/icon.ts

@@ -0,0 +1,35 @@
+Component({
+    options: {
+        //@ts-ignore
+        styleIsolation: 'apply-shared',
+    },
+    properties: {
+        // icon name
+        name: {
+            type: String,
+            value: '',
+            optionalTypes: [String],
+        },
+        // icon color
+        color: {
+            type: String,
+            value: '',
+            optionalTypes: [String],
+        },
+        // icon size
+        size: {
+            type: String,
+            value: '',
+            optionalTypes: [String],
+        },
+        // icon classPrefix
+        classPrefix: {
+            type: String,
+            value: 'icon',
+            optionalTypes: [String],
+        },
+    },
+    externalClasses: ['ext-class'],
+    data: {},
+    methods: {},
+});

miniprogram/ui/icon/icon.wxml

@@ -0,0 +1,4 @@
+<wxs src="../wxs/base.wxs" module="Utils" />
+<view class="{{ Utils.classNames('icon iconfont ' + classPrefix, { icon_image: Utils.isUrl(name)}) }}  {{ !Utils.isUrl(name) && classPrefix + '-' + name }} ext-class" style="{{size ? 'font-size: ' + size + 'rpx;' : ''}}{{color ? 'color: ' + color + ';' : ''}}{{Utils.isUrl(name) && size ? 'width: ' + size + ';height: ' + size + ';' : ''}}">
+    <image wx:if="{{ Utils.isUrl(name) }}" src="{{ name }}" mode='aspectFit' class="icon__image" />
+</view>

miniprogram/ui/wxs/base.wxs

@@ -0,0 +1,60 @@
+/* eslint-disable */
+
+// key加引号会报错 如：{ "a": 1, "b": 0}, 仅支持： { a: 1, b: 0}
+function classNames() {
+    var classes = [],
+        hasOwn = {};
+
+    for (var i = 0; i < arguments.length; i++) {
+        var arg = arguments[i];
+        if (!arg) continue;
+
+        var argType = typeof arg;
+
+        if (argType === 'string' || argType === 'number') {
+            classes.push(arg);
+        } else if ('Array' === arg.constructor && arg.length) {
+            var inner = classNames.apply(null, arg);
+            if (inner) {
+                classes.push(inner);
+            }
+        } else if (argType === 'object') {
+            var objStr = JSON.stringify(arg);
+            var dotReg = getRegExp('"', 'g');
+            objStr = objStr.replace('{', '').replace('}', '').split(',');
+
+            for (var i = 0; i < objStr.length; i++) {
+                var key = objStr[i].split(':')[0],
+                    _key = key.replace(dotReg, '');
+
+                if (!hasOwn[_key] && arg[_key]) {
+                    classes.push(_key);
+                    hasOwn[_key] = true;
+                }
+            }
+        }
+    }
+
+    return classes.join(' ');
+}
+
+function isUrl(url) {
+    var expression =
+            'https?://(www.)?[-a-zA-Z0-9@:%._+~#=]{2,256}.[a-z]{2,6}\b([-a-zA-Z0-9@:%_+.~#?&//=]*)',
+        regex = getRegExp(expression, 'g');
+
+    return url.match(regex);
+}
+
+/**
+ * 禁止事件冒泡
+ */
+function stopPropagation() {
+    return false;
+}
+
+module.exports = {
+    classNames: classNames,
+    isUrl: isUrl,
+    stopPropagation: stopPropagation,
+};