合并冲突

.eslintrc

@@ -1,5 +1,5 @@
 {
-  "extends": ["taro/react"],
+  "extends": ["taro/react","plugin:react-hooks/recommended"],
   "rules": {
     "react/jsx-uses-react": "off",
     "react/react-in-jsx-scope": "off"

README.md

@@ -0,0 +1,168 @@
+# 阿里图标库 iconfont 使用 Symbol 我们使用了 taro-iconfont-cli 这个库
+
+用法如下：
+
+# 支持平台
+
+* 微信小程序
+* 支付宝小程序
+* 百度小程序
+* 头条小程序
+* QQ小程序
+* H5
+
+# 特性
+1、一键生成标准组件，多端支持
+<br>
+2、使用方便，import即可
+<br>
+3、支持多色彩
+<br>
+4、支持自定义颜色
+<br>
+5、支持es6和typescript两种模式
+
+# Step 1
+安装插件
+
+**如果您使用Taro2.x，请安装 `taro-iconfont-cli@2.1.0`，并阅读旧版的[README.md](https://github.com/iconfont-cli/taro-iconfont-cli/blob/v2.1.0/README.md)**
+
+```bash
+# Yarn
+yarn add taro-iconfont-cli --dev
+
+# Npm
+npm install taro-iconfont-cli --save-dev
+```
+
+
+# Step 2
+生成配置文件
+```bash
+npx iconfont-init
+
+# 可传入配置输出路径
+# npx iconfont-init --output iconfont.json
+```
+此时项目根目录会生成一个`iconfont.json`的文件，内容如下：
+```json
+{
+  "symbol_url": "请参考README.md，复制 http://iconfont.cn 官网提供的JS链接",
+  "save_dir": "./src/components/iconfont",
+  "use_typescript": false,
+  "platforms": "*",
+  "use_rpx": true,
+  "trim_icon_prefix": "icon",
+  "default_icon_size": 18,
+  "design_width": 750
+}
+```
+### 配置参数说明：
+### symbol_url
+请直接复制[iconfont](http://iconfont.cn)官网提供的项目链接。请务必看清是`.js`后缀而不是.css后缀。如果你现在还没有创建iconfont的仓库，那么可以填入这个链接去测试：`http://at.alicdn.com/t/font_1373348_kk9y3jk2omq.js`
+
+<br />
+
+![](https://github.com/fwh1990/mini-program-iconfont-cli/blob/master/images/symbol-url.png?raw=true)
+
+### save_dir
+根据iconfont图标生成的组件存放的位置。每次生成组件之前，该文件夹都会被清空。
+
+### use_typescript
+如果您的项目使用Typescript编写，请设置为true。这个选项将决定生成的图标组件是`.tsx`还是`.js`后缀。
+
+当该值为false时，我们会为您的图标生成`.js`和`.d.ts`两个文件，以便您能享受到最好的开发体验。
+
+### platforms
+选择需要支持的平台，默认是`*`，意味着所有平台都需要支持（如果有）。如果你只想支持部分平台，也可以设置成数组：
+```json5
+{
+  // 选择你需要的平台
+  // 说明 =>  weapp: 微信  |  swan: 百度  |  alipay: 支付宝  |  tt: 字节跳动
+  "platforms": ["weapp", "swan", "alipay", "h5", "tt", "qq"]
+}
+```
+
+### use_rpx
+是否使用[尺寸单位rpx](https://developers.weixin.qq.com/miniprogram/dev/framework/view/wxss.html#%E5%B0%BA%E5%AF%B8%E5%8D%95%E4%BD%8D)还是普通的像素单位`px`。默认值为true，与Taro保持一致的缩放。您也可以设置为false，强制使用`px`
+
+### design_width
+若 `use_rpx: true` 且当前设计图尺寸不为 750 时，可以通过修改这个字段来修改设计尺寸。
+
+### trim_icon_prefix
+如果你的图标有通用的前缀，而你在使用的时候又不想重复去写，那么可以通过这种配置这个选项把前缀统一去掉。
+
+### default_icon_size
+我们将为每个生成的图标组件加入默认的字体大小，当然，你也可以通过传入props的方式改变这个size值。
+
+
+# Step 3
+开始生成Taro标准组件
+```bash
+npx iconfont-taro
+
+# 可传入配置文件路径
+# npx iconfont-taro --config iconfont.json
+```
+生成后查看您设置的保存目录中是否含有所有的图标
+
+-------
+
+在生成代码之前，你可以顺便参考[snapshots目录](https://github.com/iconfont-cli/taro-iconfont-cli/tree/master/snapshots)自动生成的快照文件。
+
+# Step 4
+由于Taro3.0的架构变更，您需要在`src/app.config.js`下填写一次`usingComponents`。
+```typescript
+// src/app.config.js
+import { useGlobalIconFont } from './components/iconfont/helper';
+
+export default {
+  usingComponents: Object.assign(useGlobalIconFont()),
+}
+```
+
+这并不是一个多好的方案，毕竟还需要开发者关注这个细节。也许能用webpack的plugin解决或者等官方推出更好的方案，有任何更好的idea欢迎提供。
+
+# 使用
+在Page中使用图标
+```jsx harmony
+import React, { Component } from 'react';
+import IconFont from '../components/iconfont';
+
+class App extends Component {
+  render() {
+    return <IconFont name="alipay" />;
+  }
+}
+
+export default App;
+```
+更多用法：
+```jsx harmony
+// 原色彩
+<IconFont name="alipay" />
+
+// 单色：红色
+<IconFont name="alipay" color="red" />
+
+// 多色：红色+橘色
+<IconFont name="alipay" color={['red', 'orange']} size={300} />
+
+// 不同格式的颜色写法
+<IconFont name="alipay" color={['#333', 'rgb(50, 124, 39)']} />
+
+
+// 与文字对齐
+<View style={{ display: 'flex', alignItems: 'center' }}>
+  <Text>Hello</text>
+  <IconFont name="alipay" />
+</View>
+```
+
+# 更新图标
+当您在iconfont.cn中的图标有变更时，只需更改配置`symbol_url`，然后再次执行`Step 3`即可生成最新的图标组件
+```bash
+# 修改 symbol_url 配置后执行：
+npx iconfont-taro
+```
+

config/dev.js

@@ -37,8 +37,9 @@ module.exports = {
   alias: {
     '@': path.resolve(__dirname, '..', 'src'),
   },
+
   sass: {
-    resource: path.resolve(__dirname, '..', 'src/styles/common.scss'),
+    resource: [path.resolve(__dirname, '..', 'src/styles/common.scss'), path.resolve(__dirname, '..', 'src/styles/iconfont.scss')],
   },
   // plugins: [
   //   '@tarojs/plugin-react-devtools'

config/index.js

@@ -19,6 +19,7 @@ const CURRENT_VERSION = `Version: ${JSON.stringify(process.env.CODE_BRANCH || ve
 )
 
 const config = {
+  appid: 'wx64fe67f111d52457', // 测试/体验环境
   projectName: 'SpiderSteward',
   date: '2022-4-6',
   designWidth: 750,
@@ -43,7 +44,9 @@ const config = {
     postcss: {
       pxtransform: {
         enable: true,
-        config: {},
+        config: {
+          onePxTransform: false,
+        },
       },
       url: {
         enable: true,

config/pre.js

@@ -3,6 +3,7 @@ module.exports = {
   env: {
     NODE_ENV: '"pre"',
   },
+  outputRoot: 'build',
   defineConstants: {
     CURRENT_BASE_URL: '"https://pre.zzfzyc.com/lymarket"',
   },
@@ -38,6 +39,6 @@ module.exports = {
     '@': path.resolve(__dirname, '..', 'src'),
   },
   sass: {
-    resource: path.resolve(__dirname, '..', 'src/styles/common.scss'),
+    resource: [path.resolve(__dirname, '..', 'src/styles/common.scss'), path.resolve(__dirname, '..', 'src/styles/iconfont.scss')],
   },
 }

config/prod.js

@@ -3,6 +3,7 @@ module.exports = {
   env: {
     NODE_ENV: '"production"',
   },
+  outputRoot: 'build',
   defineConstants: {
     CURRENT_BASE_URL: '"https://www.zzfzyc.com/lymarket"',
   },

global.d.ts

@@ -19,4 +19,4 @@ declare namespace NodeJS {
 
 declare const CURRENT_VERSION: string
 declare const CURRENT_GITHASH: string
-declare const CURRENT_ENV: string
+declare const CURRENT_ENV: string

iconfont.json

@@ -0,0 +1,10 @@
+{
+    "symbol_url": "//at.alicdn.com/t/c/font_3619513_mrvpsyqxmzr.js",
+    "save_dir": "./src/components/iconfont",
+    "use_typescript": false,
+    "platforms": ["weapp","h5"],
+    "use_rpx": true,
+    "trim_icon_prefix": "",
+    "default_icon_size": 18,
+    "design_width": 750
+}

package.json

@@ -9,6 +9,7 @@
     "css": "sass"
   },
   "scripts": {
+    "init:iconfont": "npx iconfont-taro",
     "build:weapp": "taro build --type weapp",
     "build:swan": "taro build --type swan",
     "build:alipay": "taro build --type alipay",
@@ -18,17 +19,17 @@
     "build:qq": "taro build --type qq",
     "build:jd": "taro build --type jd",
     "build:quickapp": "taro build --type quickapp",
-    "dev:weapp": "npm run build:weapp -- --watch",
+    "dev:weapp": "npm run init:iconfont && npm run build:weapp -- --watch",
     "dev:swan": "npm run build:swan -- --watch",
     "dev:alipay": "npm run build:alipay -- --watch",
     "dev:tt": "npm run build:tt -- --watch",
-    "dev:h5": "npm run build:h5 -- --watch",
+    "dev:h5": "npm run init:iconfont && npm run build:h5 -- --watch",
     "dev:rn": "npm run build:rn -- --watch",
     "dev:qq": "npm run build:qq -- --watch",
     "dev:jd": "npm run build:jd -- --watch",
     "dev:quickapp": "npm run build:quickapp -- --watch",
-    "build:weapp:pre": "cross-env NODE_ENV=pre taro build --type weapp",
+    "build:weapp:pre": "npm run init:iconfont && cross-env NODE_ENV=pre taro build --type weapp",
-    "dev:weapp:pre": "cross-env NODE_ENV=pre npm run build:weapp -- --watch"
+    "dev:weapp:pre": "npm run init:iconfont && cross-env NODE_ENV=pre npm run build:weapp -- --watch"
   },
   "browserslist": [
     "last 3 versions",
@@ -44,6 +45,7 @@
     "@tarojs/runtime": "3.5.4",
     "@tarojs/taro": "3.5.4",
     "big.js": "^6.2.1",
+    "classname": "^0.0.0",
     "dayjs": "^1.11.3",
     "qs": "^6.10.3",
     "react": "^18.2.0",
@@ -75,6 +77,7 @@
     "eslint-plugin-react-hooks": "^4.2.0",
     "react-refresh": "0.11.0",
     "stylelint": "9.3.0",
+    "taro-iconfont-cli": "^3.3.0",
     "typescript": "^4.1.0",
     "webpack": "^5.74.0"
   }

src/app.config.ts

@@ -1,11 +1,13 @@
+import { useGlobalIconFont } from './components/iconfont/helper'
 export default defineAppConfig({
-  pages: ['pages/user/index',
+  pages: [
     'pages/index/index',
     'pages/order/index',
     'pages/shopping/index',
     'pages/searchPage/index',
     'pages/customerPage/index',
     'pages/saleuserPage/index',
+    'pages/user/index',
     'pages/orderDetails/index'
   ],
   window: {
@@ -16,30 +18,23 @@ export default defineAppConfig({
     backgroundColor: '#ffffff',
   },
   tabBar: {
+    custom: true,
     list: [
       {
         pagePath: 'pages/index/index',
         text: '首页',
-        iconPath: './styles/tabbar/list.png',
-        selectedIconPath: './styles/tabbar/list_on.png',
       },
       {
         pagePath: 'pages/shopping/index',
         text: '购物',
-        iconPath: './styles/tabbar/order.png',
-        selectedIconPath: './styles/tabbar/order_on.png',
       },
       {
         pagePath: 'pages/order/index',
         text: '订单',
-        iconPath: './styles/tabbar/order.png',
-        selectedIconPath: './styles/tabbar/order_on.png',
       },
       {
         pagePath: 'pages/user/index',
         text: '我的',
-        iconPath: './styles/tabbar/my.png',
-        selectedIconPath: './styles/tabbar/my_on.png',
       },
     ],
     color: '#707070',
@@ -47,5 +42,9 @@ export default defineAppConfig({
     backgroundColor: '#fff',
     borderStyle: 'white',
   },
+  usingComponents: {
+    'custom-wrapper': '/custom-wrapper',
+    ...useGlobalIconFont(),
+  },
   subPackages: [],
 })

src/app.scss

@@ -1,6 +1,16 @@
 @import './styles/common.scss';
 @import './styles/iconfont.scss';
-page{
+
-    height: 100%;
+/**
-    
+    由于Cover-view标签并不支持iconfont 所以需要把 .ttf 转成 base64 之后得到的 stylesheet.css 文件覆盖掉 iconfont.css 里的 @font-face 即可
-}
+    [转换工具](https://transfonter.org/)
+    [教程](https://blog.csdn.net/VoidLuffy/article/details/123530341)
+    [相关说明](https://developers.weixin.qq.com/community/develop/doc/000a60f7d58a982f08d7ddfc456000)
+*/
+
+// 总高度 - 自定义tabbar高度 - apple小黑条高度
+page {
+  height: calc(100% - #{$customTabBarHeight} - constant(safe-area-inset-bottom));
+  height: calc(100% - #{$customTabBarHeight} - env(safe-area-inset-bottom));
+  background-color: #f7f7f7;
+}

src/components/iconCard/index.module.scss

@@ -0,0 +1,11 @@
+.iconCard {
+  display: flex;
+  flex-flow: column nowrap;
+  justify-content: center;
+  align-items: center;
+  &-name{
+    font-size: 26px;
+    color: #333;
+    margin-top: 16px;
+  }
+}

src/components/iconCard/index.tsx

@@ -0,0 +1,26 @@
+import { View } from "@tarojs/components"
+import { FC, ReactNode } from "react"
+import IconFont from "../iconfont"
+import styles from './index.module.scss'
+
+type IconfontName = Parameters<typeof IconFont>['0']['name']
+
+interface PropsType {
+  iconName: IconfontName
+  title: string
+  children?: ReactNode
+  onClick?: Function
+}
+const IconCard: FC<PropsType> = (props) => {
+  const { iconName, title, onClick } = props
+  const handleClick = (event) => {
+    onClick && onClick(event)
+  }
+  return (
+    <View className={styles.iconCard} onClick={handleClick}>
+      <IconFont name={iconName} size={72}></IconFont>
+      <View className={styles['iconCard-name']}>{title}</View>
+    </View>
+  )
+}
+export default IconCard

src/components/iconfont/h5/IconDingdan.js

@@ -0,0 +1,27 @@
+/* eslint-disable */
+
+import React from 'react';
+import { getIconColor } from './helper';
+
+const DEFAULT_STYLE = {
+  display: 'block',
+};
+
+const IconDingdan = ({ size, color, style: _style, ...rest }) => {
+  const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE;
+
+  return (
+    <svg viewBox="0 0 1024 1024" width={size + 'rem'} height={size + 'rem'} style={style} {...rest}>
+      <path
+        d="M816 128a32 32 0 0 1 32 32v704a32 32 0 0 1-32 32H208a32 32 0 0 1-32-32V160a32 32 0 0 1 32-32h608z m-136 496h-336a24 24 0 0 0 0 48h336a24 24 0 0 0 0-48z m0-144h-336a24 24 0 0 0 0 48h336a24 24 0 0 0 0-48z m0-144h-336a24 24 0 0 0 0 48h336a24 24 0 0 0 0-48z"
+        fill={getIconColor(color, 0, '#4581FF')}
+      />
+    </svg>
+  );
+};
+
+IconDingdan.defaultProps = {
+  size: 18,
+};
+
+export default IconDingdan;

src/components/iconfont/h5/IconDingdan1.js

@@ -0,0 +1,27 @@
+/* eslint-disable */
+
+import React from 'react';
+import { getIconColor } from './helper';
+
+const DEFAULT_STYLE = {
+  display: 'block',
+};
+
+const IconDingdan1 = ({ size, color, style: _style, ...rest }) => {
+  const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE;
+
+  return (
+    <svg viewBox="0 0 1024 1024" width={size + 'rem'} height={size + 'rem'} style={style} {...rest}>
+      <path
+        d="M816 128a32 32 0 0 1 32 32v704a32 32 0 0 1-32 32H208a32 32 0 0 1-32-32V160a32 32 0 0 1 32-32h608z m-16 48H224v672h576V176z m-120 448a24 24 0 0 1 0 48h-336a24 24 0 0 1 0-48h336z m0-144a24 24 0 0 1 0 48h-336a24 24 0 0 1 0-48h336z m0-144a24 24 0 0 1 0 48h-336a24 24 0 0 1 0-48h336z"
+        fill={getIconColor(color, 0, '#444444')}
+      />
+    </svg>
+  );
+};
+
+IconDingdan1.defaultProps = {
+  size: 18,
+};
+
+export default IconDingdan1;

src/components/iconfont/h5/IconDizhi.js

@@ -0,0 +1,32 @@
+/* eslint-disable */
+
+import React from 'react';
+import { getIconColor } from './helper';
+
+const DEFAULT_STYLE = {
+  display: 'block',
+};
+
+const IconDizhi = ({ size, color, style: _style, ...rest }) => {
+  const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE;
+
+  return (
+    <svg viewBox="0 0 1024 1024" width={size + 'rem'} height={size + 'rem'} style={style} {...rest}>
+      <path
+        d="M512 64c194.4 0 352 154.24 352 344.48 0 63.424-29.328 143.76-88 241.008l-0.768 1.28-5.264 5.792C705.696 725.92 613.92 769.28 512 769.28c-104.72 0-198.752-45.808-263.232-118.528C189.6 552.976 160 472.192 160 408.48 160 218.24 317.6 64 512 64z m0 241.28c-61.392 0-111.152 49.856-111.152 111.36S450.608 528 512 528s111.152-49.856 111.152-111.36-49.76-111.36-111.152-111.36z"
+        fill={getIconColor(color, 0, '#4581FF')}
+      />
+      <path
+        d="M775.232 650.752C740.4 708.336 695.312 771.84 640 841.232l-17.824 22.112-18.496 22.512c-3.136 3.776-6.304 7.584-9.504 11.392l-19.52 23.104-20.192 23.488c-6.848 7.904-13.808 15.856-20.88 23.888L512 992a4097.536 4097.536 0 0 1-42.448-48.16l-20.192-23.488-19.52-23.104c-3.2-3.808-6.368-7.616-9.504-11.392l-18.496-22.512L384 841.232c-55.328-69.408-100.416-132.896-135.248-190.48 64.48 72.72 158.512 118.528 263.232 118.528 101.92 0 193.696-43.376 257.968-112.72l5.28-5.808z"
+        fill={getIconColor(color, 1, '#4581FF')}
+        opacity=".4"
+      />
+    </svg>
+  );
+};
+
+IconDizhi.defaultProps = {
+  size: 18,
+};
+
+export default IconDizhi;

src/components/iconfont/h5/IconDuizhang.js

@@ -0,0 +1,32 @@
+/* eslint-disable */
+
+import React from 'react';
+import { getIconColor } from './helper';
+
+const DEFAULT_STYLE = {
+  display: 'block',
+};
+
+const IconDuizhang = ({ size, color, style: _style, ...rest }) => {
+  const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE;
+
+  return (
+    <svg viewBox="0 0 1024 1024" width={size + 'rem'} height={size + 'rem'} style={style} {...rest}>
+      <path
+        d="M864 96a32 32 0 0 1 32 32v608a32 32 0 0 1-32 32h-128V288a32 32 0 0 0-29.6-31.92L704 256H288V128a32 32 0 0 1 32-32h544z"
+        fill={getIconColor(color, 0, '#4581FF')}
+        opacity=".5"
+      />
+      <path
+        d="M704 256a32 32 0 0 1 32 32v608a32 32 0 0 1-32 32H160a32 32 0 0 1-32-32V288a32 32 0 0 1 32-32h544zM375.552 464H288l11.264 13.312 68.608 132.608h-71.168l-6.656 48.64h77.312l-13.312 95.232h77.824l13.312-95.232h77.824l6.656-48.64h-71.168L574.72 464h-83.504l-71.12 98.816L375.552 464z"
+        fill={getIconColor(color, 1, '#4581FF')}
+      />
+    </svg>
+  );
+};
+
+IconDuizhang.defaultProps = {
+  size: 18,
+};
+
+export default IconDuizhang;

src/components/iconfont/h5/IconFahuoliebiao.js

@@ -0,0 +1,32 @@
+/* eslint-disable */
+
+import React from 'react';
+import { getIconColor } from './helper';
+
+const DEFAULT_STYLE = {
+  display: 'block',
+};
+
+const IconFahuoliebiao = ({ size, color, style: _style, ...rest }) => {
+  const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE;
+
+  return (
+    <svg viewBox="0 0 1024 1024" width={size + 'rem'} height={size + 'rem'} style={style} {...rest}>
+      <path
+        d="M864 416a32 32 0 0 1 32 32v416a32 32 0 0 1-32 32H160a32 32 0 0 1-32-32V448a32 32 0 0 1 32-32h704z m-80 320H528a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h256a16 16 0 0 0 16-16v-32a16 16 0 0 0-16-16z m0-128H608a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h176a16 16 0 0 0 16-16v-32a16 16 0 0 0-16-16z"
+        fill={getIconColor(color, 0, '#4581FF')}
+      />
+      <path
+        d="M748.8 192a32 32 0 0 1 28.24 16.944L896 432v16a32 32 0 0 0-32-32H160a32 32 0 0 0-32 32v-16l118.96-223.056A32 32 0 0 1 275.2 192h473.6z"
+        fill={getIconColor(color, 1, '#4581FF')}
+        opacity=".4"
+      />
+    </svg>
+  );
+};
+
+IconFahuoliebiao.defaultProps = {
+  size: 18,
+};
+
+export default IconFahuoliebiao;

src/components/iconfont/h5/IconGerenzhongxin.js

@@ -0,0 +1,27 @@
+/* eslint-disable */
+
+import React from 'react';
+import { getIconColor } from './helper';
+
+const DEFAULT_STYLE = {
+  display: 'block',
+};
+
+const IconGerenzhongxin = ({ size, color, style: _style, ...rest }) => {
+  const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE;
+
+  return (
+    <svg viewBox="0 0 1024 1024" width={size + 'rem'} height={size + 'rem'} style={style} {...rest}>
+      <path
+        d="M512 128a144 144 0 0 1 144 144v80a144 144 0 0 1-288 0v-80a144 144 0 0 1 144-144z m112 416c150.224 0 272 121.776 272 272v80H128v-80c0-150.224 121.776-272 272-272h224z"
+        fill={getIconColor(color, 0, '#4581FF')}
+      />
+    </svg>
+  );
+};
+
+IconGerenzhongxin.defaultProps = {
+  size: 18,
+};
+
+export default IconGerenzhongxin;

src/components/iconfont/h5/IconGerenzhongxin1.js

@@ -0,0 +1,27 @@
+/* eslint-disable */
+
+import React from 'react';
+import { getIconColor } from './helper';
+
+const DEFAULT_STYLE = {
+  display: 'block',
+};
+
+const IconGerenzhongxin1 = ({ size, color, style: _style, ...rest }) => {
+  const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE;
+
+  return (
+    <svg viewBox="0 0 1024 1024" width={size + 'rem'} height={size + 'rem'} style={style} {...rest}>
+      <path
+        d="M624 544c150.224 0 272 121.776 272 272v80H128v-80c0-150.224 121.776-272 272-272h224z m0 48H400c-122.048 0-221.28 97.6-223.952 218.992L176 816v32h672v-32c0-122.048-97.6-221.28-218.992-223.952L624 592zM512 128a144 144 0 0 1 144 144v80a144 144 0 0 1-139.76 143.936L512 496a144 144 0 0 1-144-144v-80a144 144 0 0 1 139.76-143.936L512 128z m0 48a96 96 0 0 0-95.936 92.4L416 272v80a96 96 0 0 0 191.936 3.6L608 352v-80a96 96 0 0 0-96-96z"
+        fill={getIconColor(color, 0, '#444444')}
+      />
+    </svg>
+  );
+};
+
+IconGerenzhongxin1.defaultProps = {
+  size: 18,
+};
+
+export default IconGerenzhongxin1;

src/components/iconfont/h5/IconGouwu.js

@@ -0,0 +1,27 @@
+/* eslint-disable */
+
+import React from 'react';
+import { getIconColor } from './helper';
+
+const DEFAULT_STYLE = {
+  display: 'block',
+};
+
+const IconGouwu = ({ size, color, style: _style, ...rest }) => {
+  const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE;
+
+  return (
+    <svg viewBox="0 0 1024 1024" width={size + 'rem'} height={size + 'rem'} style={style} {...rest}>
+      <path
+        d="M512 128a144 144 0 0 1 144 144v32h84.032a32 32 0 0 1 31.712 27.712l71.36 528A32 32 0 0 1 811.392 896H212.608a32 32 0 0 1-31.712-36.288l71.36-528A32 32 0 0 1 283.968 304h84.016L368 272a144 144 0 0 1 144-144z m0 48a96 96 0 0 0-95.936 92.4L416 272v32h192v-32a96 96 0 0 0-92.4-95.936L512 176z"
+        fill={getIconColor(color, 0, '#4581FF')}
+      />
+    </svg>
+  );
+};
+
+IconGouwu.defaultProps = {
+  size: 18,
+};
+
+export default IconGouwu;

src/components/iconfont/h5/IconGouwu1.js

@@ -0,0 +1,27 @@
+/* eslint-disable */
+
+import React from 'react';
+import { getIconColor } from './helper';
+
+const DEFAULT_STYLE = {
+  display: 'block',
+};
+
+const IconGouwu1 = ({ size, color, style: _style, ...rest }) => {
+  const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE;
+
+  return (
+    <svg viewBox="0 0 1024 1024" width={size + 'rem'} height={size + 'rem'} style={style} {...rest}>
+      <path
+        d="M512 128a144 144 0 0 1 144 144v32h84.032a32 32 0 0 1 31.712 27.712l71.36 528A32 32 0 0 1 811.392 896H212.608a32 32 0 0 1-31.712-36.288l71.36-528A32 32 0 0 1 283.968 304h84.016L368 272a144 144 0 0 1 144-144z m214.048 224H297.936l-67.024 496h562.16l-67.024-496zM512 176a96 96 0 0 0-95.936 92.4L416 272v32h192v-32a96 96 0 0 0-92.4-95.936L512 176z"
+        fill={getIconColor(color, 0, '#444444')}
+      />
+    </svg>
+  );
+};
+
+IconGouwu1.defaultProps = {
+  size: 18,
+};
+
+export default IconGouwu1;

src/components/iconfont/h5/IconLingquseka.js

@@ -0,0 +1,37 @@
+/* eslint-disable */
+
+import React from 'react';
+import { getIconColor } from './helper';
+
+const DEFAULT_STYLE = {
+  display: 'block',
+};
+
+const IconLingquseka = ({ size, color, style: _style, ...rest }) => {
+  const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE;
+
+  return (
+    <svg viewBox="0 0 1024 1024" width={size + 'rem'} height={size + 'rem'} style={style} {...rest}>
+      <path
+        d="M352 160a32 32 0 0 1 32 32v672a32 32 0 0 1-32 32H160a32 32 0 0 1-32-32V192a32 32 0 0 1 32-32h192z m-96 560a48 48 0 1 0 0 96 48 48 0 0 0 0-96z"
+        fill={getIconColor(color, 0, '#4581FF')}
+        opacity=".6"
+      />
+      <path
+        d="M648.432 230.624l135.76 135.76a32 32 0 0 1 0 45.264L331.648 864.192a32 32 0 0 1-45.264 0l-54.992-54.976a48 48 0 1 0-16.608-16.608l-64.16-64.176a32 32 0 0 1 0-45.264l452.544-452.544a32 32 0 0 1 45.264 0z"
+        fill={getIconColor(color, 1, '#4581FF')}
+        opacity=".8"
+      />
+      <path
+        d="M864 640a32 32 0 0 1 32 32v192a32 32 0 0 1-32 32H160a32 32 0 0 1-32-32V672a32 32 0 0 1 32-32h704z m-608 80a48 48 0 1 0 0 96 48 48 0 0 0 0-96z"
+        fill={getIconColor(color, 2, '#4581FF')}
+      />
+    </svg>
+  );
+};
+
+IconLingquseka.defaultProps = {
+  size: 18,
+};
+
+export default IconLingquseka;

src/components/iconfont/h5/IconMadanguanli.js

@@ -0,0 +1,45 @@
+/* eslint-disable */
+
+import React from 'react';
+import { getIconColor } from './helper';
+
+const DEFAULT_STYLE = {
+  display: 'block',
+};
+
+const IconMadanguanli = ({ size, color, style: _style, ...rest }) => {
+  const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE;
+
+  return (
+    <svg viewBox="0 0 1024 1024" width={size + 'rem'} height={size + 'rem'} style={style} {...rest}>
+      <path
+        d="M128 128m32 0l288 0q32 0 32 32l0 288q0 32-32 32l-288 0q-32 0-32-32l0-288q0-32 32-32Z"
+        fill={getIconColor(color, 0, '#4581FF')}
+      />
+      <path
+        d="M544 128m32 0l288 0q32 0 32 32l0 288q0 32-32 32l-288 0q-32 0-32-32l0-288q0-32 32-32Z"
+        fill={getIconColor(color, 1, '#4581FF')}
+      />
+      <path
+        d="M128 544m32 0l288 0q32 0 32 32l0 288q0 32-32 32l-288 0q-32 0-32-32l0-288q0-32 32-32Z"
+        fill={getIconColor(color, 2, '#4581FF')}
+      />
+      <path
+        d="M544 544m32 0l80 0q32 0 32 32l0 288q0 32-32 32l-80 0q-32 0-32-32l0-288q0-32 32-32Z"
+        fill={getIconColor(color, 3, '#4581FF')}
+        opacity=".6"
+      />
+      <path
+        d="M752 544m32 0l80 0q32 0 32 32l0 288q0 32-32 32l-80 0q-32 0-32-32l0-288q0-32 32-32Z"
+        fill={getIconColor(color, 4, '#4581FF')}
+        opacity=".6"
+      />
+    </svg>
+  );
+};
+
+IconMadanguanli.defaultProps = {
+  size: 18,
+};
+
+export default IconMadanguanli;

src/components/iconfont/h5/IconPandiansaoma.js

@@ -0,0 +1,32 @@
+/* eslint-disable */
+
+import React from 'react';
+import { getIconColor } from './helper';
+
+const DEFAULT_STYLE = {
+  display: 'block',
+};
+
+const IconPandiansaoma = ({ size, color, style: _style, ...rest }) => {
+  const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE;
+
+  return (
+    <svg viewBox="0 0 1024 1024" width={size + 'rem'} height={size + 'rem'} style={style} {...rest}>
+      <path
+        d="M224 128h304v768H224a96 96 0 0 1-96-96V224a96 96 0 0 1 96-96z"
+        fill={getIconColor(color, 0, '#4581FF')}
+        opacity=".4"
+      />
+      <path
+        d="M128 480h768v64H128zM896 656v208a32 32 0 0 1-32 32H656l-0.016-64H832V656h64z m-704 0v176h175.984L368 896H160a32 32 0 0 1-32-32V656h64zM864 128a32 32 0 0 1 32 32v208h-64V192H655.984L656 128h208zM128 160a32 32 0 0 1 32-32h208l-0.016 64H192v176H128V160z"
+        fill={getIconColor(color, 1, '#4581FF')}
+      />
+    </svg>
+  );
+};
+
+IconPandiansaoma.defaultProps = {
+  size: 18,
+};
+
+export default IconPandiansaoma;

src/components/iconfont/h5/IconQianzhicangkucun.js

@@ -0,0 +1,32 @@
+/* eslint-disable */
+
+import React from 'react';
+import { getIconColor } from './helper';
+
+const DEFAULT_STYLE = {
+  display: 'block',
+};
+
+const IconQianzhicangkucun = ({ size, color, style: _style, ...rest }) => {
+  const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE;
+
+  return (
+    <svg viewBox="0 0 1024 1024" width={size + 'rem'} height={size + 'rem'} style={style} {...rest}>
+      <path
+        d="M904.032 338.016a22.016 22.016 0 0 0-1.456-4.432l-67.616-154C823.28 147.776 790.944 128 750.272 128h-474.56c-39.856 0-70.832 19.392-82.064 50.064l-72.672 157.12a31.776 31.776 0 0 0-1.04 3.696A134.816 134.816 0 0 0 112 384.224c0.064 53.76 32.304 102.848 84.08 128.048 21.312 10.448 46.432 15.728 74.64 15.728h0.096c47.328-0.096 91.168-19.136 121.056-51.696 29.728 32.272 73.232 51.2 120.48 51.456 46.88-0.32 90.224-19.312 119.84-51.584 29.872 32.56 73.776 51.52 121.344 51.52 28.8-0.144 54.336-5.664 75.84-16.48 51.008-25.472 82.656-74.368 82.624-127.552a132.032 132.032 0 0 0-7.728-44.576 8.768 8.768 0 0 0-0.24-1.072z"
+        fill={getIconColor(color, 0, '#4581FF')}
+      />
+      <path
+        d="M848 432v445.088A34.912 34.912 0 0 1 813.088 912H210.912A34.912 34.912 0 0 1 176 877.088V432h672zM608 752H416a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h192a16 16 0 0 0 16-16v-32a16 16 0 0 0-16-16z m0-128H416a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h192a16 16 0 0 0 16-16v-32a16 16 0 0 0-16-16z"
+        fill={getIconColor(color, 1, '#4581FF')}
+        opacity=".4"
+      />
+    </svg>
+  );
+};
+
+IconQianzhicangkucun.defaultProps = {
+  size: 18,
+};
+
+export default IconQianzhicangkucun;

src/components/iconfont/h5/IconQusechazhao.js

@@ -0,0 +1,32 @@
+/* eslint-disable */
+
+import React from 'react';
+import { getIconColor } from './helper';
+
+const DEFAULT_STYLE = {
+  display: 'block',
+};
+
+const IconQusechazhao = ({ size, color, style: _style, ...rest }) => {
+  const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE;
+
+  return (
+    <svg viewBox="0 0 1024 1024" width={size + 'rem'} height={size + 'rem'} style={style} {...rest}>
+      <path
+        d="M868.528 816.8c59.36 0 107.472-46.48 107.472-103.824 0-38.224-35.824-102.496-107.472-192.816-71.648 90.32-107.472 154.592-107.472 192.816 0 57.344 48.112 103.84 107.472 103.84z"
+        fill={getIconColor(color, 0, '#4581FF')}
+        opacity=".4"
+      />
+      <path
+        d="M344 105.44l75.76 53.04c3.392 2.368 6.384 5.12 8.928 8.144 3.728 1.376 7.344 3.248 10.752 5.632l341.968 239.456a47.008 47.008 0 0 1 11.552 65.472L498.224 898.112a47.008 47.008 0 0 1-65.472 11.536L90.768 670.192a47.008 47.008 0 0 1-11.536-65.472l268.064-382.848-56.928-39.84A46.752 46.752 0 1 1 344 105.44z m112.528 192.928a40.336 40.336 0 0 0-56.128 9.904L221.424 563.76a40.288 40.288 0 0 0 44.448 61.76l382.24-113.232a40.288 40.288 0 0 0 11.68-71.648z"
+        fill={getIconColor(color, 1, '#4581FF')}
+      />
+    </svg>
+  );
+};
+
+IconQusechazhao.defaultProps = {
+  size: 18,
+};
+
+export default IconQusechazhao;

src/components/iconfont/h5/IconShouhouzhongxin.js

@@ -0,0 +1,32 @@
+/* eslint-disable */
+
+import React from 'react';
+import { getIconColor } from './helper';
+
+const DEFAULT_STYLE = {
+  display: 'block',
+};
+
+const IconShouhouzhongxin = ({ size, color, style: _style, ...rest }) => {
+  const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE;
+
+  return (
+    <svg viewBox="0 0 1024 1024" width={size + 'rem'} height={size + 'rem'} style={style} {...rest}>
+      <path
+        d="M848 384a32 32 0 0 1 32 32v448a32 32 0 0 1-32 32H176a32 32 0 0 1-32-32V416a32 32 0 0 1 32-32h672z m-376.448 112H384l11.264 13.312 68.608 132.608h-71.168l-6.656 48.64h77.312l-13.312 95.232h77.824l13.312-95.232h77.824l6.656-48.64h-71.168L670.72 496h-83.504l-71.12 98.816L471.552 496z"
+        fill={getIconColor(color, 0, '#4581FF')}
+      />
+      <path
+        d="M335.536 148.56a32 32 0 0 1 35.12 53.44l-2.192 1.44L307.488 240H832a32 32 0 0 1 31.92 29.6L864 272a32 32 0 0 1-29.6 31.92L832 304H192c-31.616 0-43.68-40.576-18.528-58.112l2.064-1.328 160-96z"
+        fill={getIconColor(color, 1, '#4581FF')}
+        opacity=".4"
+      />
+    </svg>
+  );
+};
+
+IconShouhouzhongxin.defaultProps = {
+  size: 18,
+};
+
+export default IconShouhouzhongxin;

src/components/iconfont/h5/IconShoukuanliebiao.js

@@ -0,0 +1,32 @@
+/* eslint-disable */
+
+import React from 'react';
+import { getIconColor } from './helper';
+
+const DEFAULT_STYLE = {
+  display: 'block',
+};
+
+const IconShoukuanliebiao = ({ size, color, style: _style, ...rest }) => {
+  const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE;
+
+  return (
+    <svg viewBox="0 0 1024 1024" width={size + 'rem'} height={size + 'rem'} style={style} {...rest}>
+      <path
+        d="M832 128a32 32 0 0 1 32 32v704a32 32 0 0 1-32 32H288a32 32 0 0 1-32-32V160a32 32 0 0 1 32-32h544z m-128 592H416a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h288a16 16 0 0 0 16-16v-32a16 16 0 0 0-16-16z m0-128H416a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h288a16 16 0 0 0 16-16v-32a16 16 0 0 0-16-16zM542.176 208H464l10.064 11.76 61.248 117.152h-63.536l-5.952 42.96h69.04L522.976 464h69.488l11.872-84.128h69.488l5.952-42.96h-63.552L720 208h-74.56l-63.504 87.296L542.176 208z"
+        fill={getIconColor(color, 0, '#4581FF')}
+      />
+      <path
+        d="M288 128a32 32 0 0 0-32 32v704a32 32 0 0 0 32 32h-80a32 32 0 0 1-32-32V160a32 32 0 0 1 32-32z"
+        fill={getIconColor(color, 1, '#4581FF')}
+        opacity=".4"
+      />
+    </svg>
+  );
+};
+
+IconShoukuanliebiao.defaultProps = {
+  size: 18,
+};
+
+export default IconShoukuanliebiao;

src/components/iconfont/h5/IconShouye.js

@@ -0,0 +1,27 @@
+/* eslint-disable */
+
+import React from 'react';
+import { getIconColor } from './helper';
+
+const DEFAULT_STYLE = {
+  display: 'block',
+};
+
+const IconShouye = ({ size, color, style: _style, ...rest }) => {
+  const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE;
+
+  return (
+    <svg viewBox="0 0 1024 1024" width={size + 'rem'} height={size + 'rem'} style={style} {...rest}>
+      <path
+        d="M570.256 230.304l2.544 2.432 235.936 235.936h5.648v5.648l73.52 73.536c9.328 9.328 9.376 24.4 0.096 33.664a23.792 23.792 0 0 1-31.968 1.456l-1.696-1.552-39.952-39.952v322.88c0 17.472-14.24 31.648-31.824 31.648l-190.992-0.016V896H576V688a64 64 0 1 0-128 0v208h-15.584v-0.016L241.44 896a31.744 31.744 0 0 1-31.84-31.648V539.648l-39.84 39.872c-9.28 9.28-24.352 9.216-33.664-0.096a23.84 23.84 0 0 1-1.632-31.984l1.536-1.68 73.6-73.632v-3.456h3.456l236.288-236.272c33.168-33.168 86.592-33.824 120.912-2.096z"
+        fill={getIconColor(color, 0, '#4581FF')}
+      />
+    </svg>
+  );
+};
+
+IconShouye.defaultProps = {
+  size: 18,
+};
+
+export default IconShouye;

src/components/iconfont/h5/IconShouye1.js

@@ -0,0 +1,27 @@
+/* eslint-disable */
+
+import React from 'react';
+import { getIconColor } from './helper';
+
+const DEFAULT_STYLE = {
+  display: 'block',
+};
+
+const IconShouye1 = ({ size, color, style: _style, ...rest }) => {
+  const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE;
+
+  return (
+    <svg viewBox="0 0 1024 1024" width={size + 'rem'} height={size + 'rem'} style={style} {...rest}>
+      <path
+        d="M543.84 690.24a31.728 31.728 0 0 0-29.472-31.552L512 658.592a31.76 31.76 0 0 0-31.744 29.296l-0.08 2.368V896h-47.76v-0.016L241.44 896a31.744 31.744 0 0 1-31.84-31.648V539.648l-39.84 39.872c-9.28 9.28-24.352 9.216-33.664-0.096a23.84 23.84 0 0 1-1.632-31.984l1.536-1.68 73.6-73.632v-3.456h3.456l236.288-236.272c33.168-33.168 86.592-33.824 120.912-2.096l2.544 2.432 235.936 235.936h5.648v5.648l73.52 73.536c9.328 9.328 9.376 24.4 0.096 33.664a23.792 23.792 0 0 1-31.968 1.456l-1.696-1.552-39.952-39.952v322.88c0 17.472-14.24 31.648-31.824 31.648l-190.992-0.016V896H543.84V690.24z m-58.832-425.856l-1.888 1.776-225.776 225.744v356.608h175.072v-158.256c0-43.712 35.632-79.136 79.584-79.136 43.952 0 79.584 35.424 79.584 79.136l-0.016 158.256h175.088l-0.016-354.784-227.408-227.408a39.696 39.696 0 0 0-54.224-1.936z"
+        fill={getIconColor(color, 0, '#444444')}
+      />
+    </svg>
+  );
+};
+
+IconShouye1.defaultProps = {
+  size: 18,
+};
+
+export default IconShouye1;

src/components/iconfont/h5/IconTihuoliebiao.js

@@ -0,0 +1,32 @@
+/* eslint-disable */
+
+import React from 'react';
+import { getIconColor } from './helper';
+
+const DEFAULT_STYLE = {
+  display: 'block',
+};
+
+const IconTihuoliebiao = ({ size, color, style: _style, ...rest }) => {
+  const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE;
+
+  return (
+    <svg viewBox="0 0 1024 1024" width={size + 'rem'} height={size + 'rem'} style={style} {...rest}>
+      <path
+        d="M880 496v317.088A34.912 34.912 0 0 1 845.088 848H274.912A34.912 34.912 0 0 1 240 813.088V496h640zM240 242.912c0-19.28 15.632-34.912 34.912-34.912h570.176c19.28 0 34.912 15.632 34.912 34.912V432H240V242.912z"
+        fill={getIconColor(color, 0, '#4581FF')}
+      />
+      <path
+        d="M224 144a16 16 0 0 1 16 16v668.112c7.84 5.28 14.624 12.032 19.888 19.888H880a32 32 0 0 1 32 32v16a32 32 0 0 1-32 32H259.872A72 72 0 1 1 160 828.144V224L112 224a16 16 0 0 1-16-16v-48a16 16 0 0 1 16-16h112z"
+        fill={getIconColor(color, 1, '#4581FF')}
+        opacity=".4"
+      />
+    </svg>
+  );
+};
+
+IconTihuoliebiao.defaultProps = {
+  size: 18,
+};
+
+export default IconTihuoliebiao;

src/components/iconfont/h5/IconWodekefu.js

@@ -0,0 +1,32 @@
+/* eslint-disable */
+
+import React from 'react';
+import { getIconColor } from './helper';
+
+const DEFAULT_STYLE = {
+  display: 'block',
+};
+
+const IconWodekefu = ({ size, color, style: _style, ...rest }) => {
+  const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE;
+
+  return (
+    <svg viewBox="0 0 1024 1024" width={size + 'rem'} height={size + 'rem'} style={style} {...rest}>
+      <path
+        d="M832 516.752a193.2 193.2 0 0 1 79.92 150.864l0.08 5.84v13.088c0 53.152-21.44 101.312-56.144 136.272l-3.904 3.84L912 880H657.44a192.72 192.72 0 0 1-127.536-48c165.2-1.024 299.152-133.808 302.048-298.56l0.064-16.688z"
+        fill={getIconColor(color, 0, '#4581FF')}
+        opacity=".4"
+      />
+      <path
+        d="M521.2 144C701.68 144 848 290.32 848 470.8v34.4C848 685.68 701.68 832 521.2 832H96l100.256-91.264A325.856 325.856 0 0 1 96 505.2v-34.4C96 290.32 242.32 144 422.8 144h98.4z m-151.744 275.2c-37.76 0-68.368 30.8-68.368 68.8s30.608 68.8 68.368 68.8c37.76 0 68.368-30.8 68.368-68.8s-30.608-68.8-68.368-68.8z m205.088 0c-37.76 0-68.368 30.8-68.368 68.8s30.608 68.8 68.368 68.8c37.76 0 68.368-30.8 68.368-68.8s-30.608-68.8-68.368-68.8z"
+        fill={getIconColor(color, 1, '#4581FF')}
+      />
+    </svg>
+  );
+};
+
+IconWodekefu.defaultProps = {
+  size: 18,
+};
+
+export default IconWodekefu;

src/components/iconfont/h5/IconWodeshoucang.js

@@ -0,0 +1,32 @@
+/* eslint-disable */
+
+import React from 'react';
+import { getIconColor } from './helper';
+
+const DEFAULT_STYLE = {
+  display: 'block',
+};
+
+const IconWodeshoucang = ({ size, color, style: _style, ...rest }) => {
+  const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE;
+
+  return (
+    <svg viewBox="0 0 1024 1024" width={size + 'rem'} height={size + 'rem'} style={style} {...rest}>
+      <path
+        d="M512 128c6.48 0 13.072 1.424 19.264 4.448 8.592 4.16 15.552 11.024 19.792 19.488l98.88 197.44c3.808 7.6 11.152 12.864 19.68 14.08l221.088 31.68c23.808 3.392 40.304 25.168 36.832 48.64a42.704 42.704 0 0 1-12.688 24.544l-160 153.696c-6.16 5.92-8.96 14.432-7.52 22.8l37.776 217.008c4.064 23.36-11.84 45.536-35.552 49.552-9.44 1.6-19.152 0.08-27.632-4.32l-197.76-102.448a26.432 26.432 0 0 0-12.16-2.96z"
+        fill={getIconColor(color, 0, '#4581FF')}
+        opacity=".4"
+      />
+      <path
+        d="M512 128v673.648c-4.176 0-8.352 0.976-12.16 2.96L302.08 907.04c-21.28 11.04-47.616 2.976-58.816-18.016a42.368 42.368 0 0 1-4.368-27.216L276.64 644.8a25.52 25.52 0 0 0-7.52-22.8L109.152 468.32a42.48 42.48 0 0 1-0.8-60.688 43.776 43.776 0 0 1 24.928-12.512l221.12-31.664a26.112 26.112 0 0 0 19.664-14.08l98.88-197.44A43.616 43.616 0 0 1 511.984 128z"
+        fill={getIconColor(color, 1, '#4581FF')}
+      />
+    </svg>
+  );
+};
+
+IconWodeshoucang.defaultProps = {
+  size: 18,
+};
+
+export default IconWodeshoucang;

src/components/iconfont/h5/IconXiaoshou.js

@@ -0,0 +1,32 @@
+/* eslint-disable */
+
+import React from 'react';
+import { getIconColor } from './helper';
+
+const DEFAULT_STYLE = {
+  display: 'block',
+};
+
+const IconXiaoshou = ({ size, color, style: _style, ...rest }) => {
+  const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE;
+
+  return (
+    <svg viewBox="0 0 1024 1024" width={size + 'rem'} height={size + 'rem'} style={style} {...rest}>
+      <path
+        d="M511.92 496c159.808 0 298.16 97.36 365.056 239.152 13.76 29.184 25.264 72.912 34.496 131.2A53.312 53.312 0 0 1 858.784 928H518.768l63.552-80.736-70.4-342-70.4 342L505.024 928H165.152a53.312 53.312 0 0 1-52.592-61.808c9.664-60.08 21.712-105.056 36.16-134.912C216.288 591.6 353.568 496 511.92 496z"
+        fill={getIconColor(color, 0, '#4581FF')}
+        opacity=".5"
+      />
+      <path
+        d="M520 296m-216 0a216 216 0 1 0 432 0 216 216 0 1 0-432 0Z"
+        fill={getIconColor(color, 1, '#408DFA')}
+      />
+    </svg>
+  );
+};
+
+IconXiaoshou.defaultProps = {
+  size: 18,
+};
+
+export default IconXiaoshou;

src/components/iconfont/h5/IconYangpinduibi.js

@@ -0,0 +1,32 @@
+/* eslint-disable */
+
+import React from 'react';
+import { getIconColor } from './helper';
+
+const DEFAULT_STYLE = {
+  display: 'block',
+};
+
+const IconYangpinduibi = ({ size, color, style: _style, ...rest }) => {
+  const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE;
+
+  return (
+    <svg viewBox="0 0 1024 1024" width={size + 'rem'} height={size + 'rem'} style={style} {...rest}>
+      <path
+        d="M528 80a32 32 0 0 1 32 32v800a32 32 0 0 1-32 32h-32a32 32 0 0 1-32-32v-64H160a32 32 0 0 1-32-32V208a32 32 0 0 1 32-32h304V112a32 32 0 0 1 32-32h32z"
+        fill={getIconColor(color, 0, '#4581FF')}
+      />
+      <path
+        d="M560 176h304a32 32 0 0 1 32 32v608a32 32 0 0 1-32 32H560V176z"
+        fill={getIconColor(color, 1, '#4581FF')}
+        opacity=".4"
+      />
+    </svg>
+  );
+};
+
+IconYangpinduibi.defaultProps = {
+  size: 18,
+};
+
+export default IconYangpinduibi;

src/components/iconfont/h5/IconYansequyang.js

@@ -0,0 +1,32 @@
+/* eslint-disable */
+
+import React from 'react';
+import { getIconColor } from './helper';
+
+const DEFAULT_STYLE = {
+  display: 'block',
+};
+
+const IconYansequyang = ({ size, color, style: _style, ...rest }) => {
+  const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE;
+
+  return (
+    <svg viewBox="0 0 1024 1024" width={size + 'rem'} height={size + 'rem'} style={style} {...rest}>
+      <path
+        d="M760.896 104.704a32 32 0 0 1 45.264 0l113.12 113.136a32 32 0 0 1 0 45.264L828.8 353.6l22.624 22.624a32 32 0 0 1 0 45.248l-45.248 45.264a32 32 0 0 1-45.264 0L557.248 263.104a32 32 0 0 1 0-45.264l45.264-45.248a32 32 0 0 1 45.248 0L670.4 195.2l90.512-90.512z"
+        fill={getIconColor(color, 0, '#4581FF')}
+      />
+      <path
+        d="M579.888 285.728l158.4 158.4-396 395.968a48 48 0 0 1-67.872 0l-22.624 22.624a64 64 0 1 1-90.512-90.512l22.624-22.624a48 48 0 0 1 0-67.872l395.984-396z"
+        fill={getIconColor(color, 1, '#4581FF')}
+        opacity=".5"
+      />
+    </svg>
+  );
+};
+
+IconYansequyang.defaultProps = {
+  size: 18,
+};
+
+export default IconYansequyang;

src/components/iconfont/h5/IconYaoqingma.js

@@ -0,0 +1,32 @@
+/* eslint-disable */
+
+import React from 'react';
+import { getIconColor } from './helper';
+
+const DEFAULT_STYLE = {
+  display: 'block',
+};
+
+const IconYaoqingma = ({ size, color, style: _style, ...rest }) => {
+  const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE;
+
+  return (
+    <svg viewBox="0 0 1024 1024" width={size + 'rem'} height={size + 'rem'} style={style} {...rest}>
+      <path
+        d="M768 128a32 32 0 0 1 32 32v299.984L512 544l-288-84.016V160a32 32 0 0 1 32-32h512z m-112 240H368a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h288a16 16 0 0 0 16-16v-32a16 16 0 0 0-16-16z m0-128H368a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h288a16 16 0 0 0 16-16v-32a16 16 0 0 0-16-16z"
+        fill={getIconColor(color, 0, '#4581FF')}
+        opacity=".5"
+      />
+      <path
+        d="M168.96 443.952L512 544l343.04-100.048a32 32 0 0 1 40.96 30.72V864a32 32 0 0 1-32 32H160a32 32 0 0 1-32-32V474.672a32 32 0 0 1 40.96-30.72z"
+        fill={getIconColor(color, 1, '#407AF4')}
+      />
+    </svg>
+  );
+};
+
+IconYaoqingma.defaultProps = {
+  size: 18,
+};
+
+export default IconYaoqingma;

src/components/iconfont/h5/IconYuncangkucun.js

@@ -0,0 +1,32 @@
+/* eslint-disable */
+
+import React from 'react';
+import { getIconColor } from './helper';
+
+const DEFAULT_STYLE = {
+  display: 'block',
+};
+
+const IconYuncangkucun = ({ size, color, style: _style, ...rest }) => {
+  const style = _style ? { ...DEFAULT_STYLE, ..._style } : DEFAULT_STYLE;
+
+  return (
+    <svg viewBox="0 0 1024 1024" width={size + 'rem'} height={size + 'rem'} style={style} {...rest}>
+      <path
+        d="M848 432v445.088A34.912 34.912 0 0 1 813.088 912H210.912A34.912 34.912 0 0 1 176 877.088V432h672zM608 704H416a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h192a16 16 0 0 0 16-16v-32a16 16 0 0 0-16-16z m0-128H416a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h192a16 16 0 0 0 16-16v-32a16 16 0 0 0-16-16z"
+        fill={getIconColor(color, 0, '#4581FF')}
+        opacity=".4"
+      />
+      <path
+        d="M536 64c108.8 0 197.328 86.88 199.936 195.072l0.016 1.024 3.936-2.624a112 112 0 1 1 63.952 206.464L800 464H392.8c-31.52 29.76-74.032 48-120.8 48-97.2 0-176-78.8-176-176s78.8-176 176-176c29.712 0 57.712 7.36 82.272 20.368C385.92 111.68 455.392 64 536 64z"
+        fill={getIconColor(color, 1, '#4581FF')}
+      />
+    </svg>
+  );
+};
+
+IconYuncangkucun.defaultProps = {
+  size: 18,
+};
+
+export default IconYuncangkucun;

src/components/iconfont/h5/helper.js

@@ -0,0 +1,17 @@
+/* eslint-disable */
+
+/**
+ * @param {string | string[] | undefined} color
+ * @param {number} index
+ * @param {string} defaultColor
+ * @return {string}
+ */
+export const getIconColor = (color, index, defaultColor) => {
+  return color
+    ? (
+      typeof color === 'string'
+        ? color
+        : color[index] || defaultColor
+    )
+    : defaultColor;
+};

src/components/iconfont/h5/index.js

@@ -0,0 +1,117 @@
+/* eslint-disable */
+
+import React from 'react';
+import IconWodekefu from './IconWodekefu';
+import IconDizhi from './IconDizhi';
+import IconShouhouzhongxin from './IconShouhouzhongxin';
+import IconWodeshoucang from './IconWodeshoucang';
+import IconShoukuanliebiao from './IconShoukuanliebiao';
+import IconMadanguanli from './IconMadanguanli';
+import IconQusechazhao from './IconQusechazhao';
+import IconPandiansaoma from './IconPandiansaoma';
+import IconYaoqingma from './IconYaoqingma';
+import IconDuizhang from './IconDuizhang';
+import IconTihuoliebiao from './IconTihuoliebiao';
+import IconYangpinduibi from './IconYangpinduibi';
+import IconYansequyang from './IconYansequyang';
+import IconFahuoliebiao from './IconFahuoliebiao';
+import IconYuncangkucun from './IconYuncangkucun';
+import IconXiaoshou from './IconXiaoshou';
+import IconQianzhicangkucun from './IconQianzhicangkucun';
+import IconLingquseka from './IconLingquseka';
+import IconGouwu1 from './IconGouwu1';
+import IconDingdan1 from './IconDingdan1';
+import IconGerenzhongxin1 from './IconGerenzhongxin1';
+import IconShouye1 from './IconShouye1';
+import IconGerenzhongxin from './IconGerenzhongxin';
+import IconDingdan from './IconDingdan';
+import IconShouye from './IconShouye';
+import IconGouwu from './IconGouwu';
+export { default as IconWodekefu } from './IconWodekefu';
+export { default as IconDizhi } from './IconDizhi';
+export { default as IconShouhouzhongxin } from './IconShouhouzhongxin';
+export { default as IconWodeshoucang } from './IconWodeshoucang';
+export { default as IconShoukuanliebiao } from './IconShoukuanliebiao';
+export { default as IconMadanguanli } from './IconMadanguanli';
+export { default as IconQusechazhao } from './IconQusechazhao';
+export { default as IconPandiansaoma } from './IconPandiansaoma';
+export { default as IconYaoqingma } from './IconYaoqingma';
+export { default as IconDuizhang } from './IconDuizhang';
+export { default as IconTihuoliebiao } from './IconTihuoliebiao';
+export { default as IconYangpinduibi } from './IconYangpinduibi';
+export { default as IconYansequyang } from './IconYansequyang';
+export { default as IconFahuoliebiao } from './IconFahuoliebiao';
+export { default as IconYuncangkucun } from './IconYuncangkucun';
+export { default as IconXiaoshou } from './IconXiaoshou';
+export { default as IconQianzhicangkucun } from './IconQianzhicangkucun';
+export { default as IconLingquseka } from './IconLingquseka';
+export { default as IconGouwu1 } from './IconGouwu1';
+export { default as IconDingdan1 } from './IconDingdan1';
+export { default as IconGerenzhongxin1 } from './IconGerenzhongxin1';
+export { default as IconShouye1 } from './IconShouye1';
+export { default as IconGerenzhongxin } from './IconGerenzhongxin';
+export { default as IconDingdan } from './IconDingdan';
+export { default as IconShouye } from './IconShouye';
+export { default as IconGouwu } from './IconGouwu';
+
+const IconFont = ({ name, ...rest }) => {
+  switch (name) {
+    case 'icon-wodekefu':
+      return <IconWodekefu {...rest} />;
+    case 'icon-dizhi':
+      return <IconDizhi {...rest} />;
+    case 'icon-shouhouzhongxin':
+      return <IconShouhouzhongxin {...rest} />;
+    case 'icon-wodeshoucang':
+      return <IconWodeshoucang {...rest} />;
+    case 'icon-shoukuanliebiao':
+      return <IconShoukuanliebiao {...rest} />;
+    case 'icon-madanguanli':
+      return <IconMadanguanli {...rest} />;
+    case 'icon-qusechazhao':
+      return <IconQusechazhao {...rest} />;
+    case 'icon-pandiansaoma':
+      return <IconPandiansaoma {...rest} />;
+    case 'icon-yaoqingma':
+      return <IconYaoqingma {...rest} />;
+    case 'icon-duizhang':
+      return <IconDuizhang {...rest} />;
+    case 'icon-tihuoliebiao':
+      return <IconTihuoliebiao {...rest} />;
+    case 'icon-yangpinduibi':
+      return <IconYangpinduibi {...rest} />;
+    case 'icon-yansequyang':
+      return <IconYansequyang {...rest} />;
+    case 'icon-fahuoliebiao':
+      return <IconFahuoliebiao {...rest} />;
+    case 'icon-yuncangkucun':
+      return <IconYuncangkucun {...rest} />;
+    case 'icon-xiaoshou':
+      return <IconXiaoshou {...rest} />;
+    case 'icon-qianzhicangkucun':
+      return <IconQianzhicangkucun {...rest} />;
+    case 'icon-lingquseka':
+      return <IconLingquseka {...rest} />;
+    case 'icon-gouwu1':
+      return <IconGouwu1 {...rest} />;
+    case 'icon-dingdan1':
+      return <IconDingdan1 {...rest} />;
+    case 'icon-gerenzhongxin1':
+      return <IconGerenzhongxin1 {...rest} />;
+    case 'icon-shouye1':
+      return <IconShouye1 {...rest} />;
+    case 'icon-gerenzhongxin':
+      return <IconGerenzhongxin {...rest} />;
+    case 'icon-dingdan':
+      return <IconDingdan {...rest} />;
+    case 'icon-shouye':
+      return <IconShouye {...rest} />;
+    case 'icon-gouwu':
+      return <IconGouwu {...rest} />;
+
+  }
+
+  return null;
+};
+
+export default IconFont;

src/components/iconfont/helper.d.ts

@@ -0,0 +1,2 @@
+/* eslint-disable */
+export declare var useGlobalIconFont: () => { iconfont: string };

src/components/iconfont/helper.js

@@ -0,0 +1,9 @@
+/* eslint-disable */
+const useGlobalIconFont = () => {
+  return {
+    iconfont: `components/iconfont/${process.env.TARO_ENV}/${process.env.TARO_ENV}`,
+  };
+};
+
+// es modules is unavaiable.
+module.exports.useGlobalIconFont = useGlobalIconFont;

src/components/iconfont/index.d.ts

@@ -0,0 +1,13 @@
+/* eslint-disable */
+import React, { FunctionComponent } from 'react';
+
+interface Props {
+  name: 'icon-wodekefu' | 'icon-dizhi' | 'icon-shouhouzhongxin' | 'icon-wodeshoucang' | 'icon-shoukuanliebiao' | 'icon-madanguanli' | 'icon-qusechazhao' | 'icon-pandiansaoma' | 'icon-yaoqingma' | 'icon-duizhang' | 'icon-tihuoliebiao' | 'icon-yangpinduibi' | 'icon-yansequyang' | 'icon-fahuoliebiao' | 'icon-yuncangkucun' | 'icon-xiaoshou' | 'icon-qianzhicangkucun' | 'icon-lingquseka' | 'icon-gouwu1' | 'icon-dingdan1' | 'icon-gerenzhongxin1' | 'icon-shouye1' | 'icon-gerenzhongxin' | 'icon-dingdan' | 'icon-shouye' | 'icon-gouwu';
+  size?: number;
+  color?: string | string[];
+  style?: React.CSSProperties;
+}
+
+declare const IconFont: FunctionComponent<Props>;
+
+export default IconFont;

src/components/iconfont/index.h5.js

@@ -0,0 +1,17 @@
+/* eslint-disable */
+
+import React from 'react';
+import Taro from '@tarojs/taro';
+import Icon from './h5';
+
+const IconFont = (props) => {
+  const { name, size, color, style } = props;
+
+  return <Icon name={name} size={parseFloat(Taro.pxTransform(size, 750))} color={color} style={style} />;
+};
+
+IconFont.defaultProps = {
+  size: 18,
+};
+
+export default IconFont;

src/components/iconfont/index.js

@@ -0,0 +1,7 @@
+/* eslint-disable */
+
+const IconFont = () => {
+  return null;
+};
+
+export default IconFont;

src/components/iconfont/index.weapp.js

@@ -0,0 +1,16 @@
+/* eslint-disable */
+
+import React from 'react';
+import Taro from '@tarojs/taro';
+
+const IconFont = (props) => {
+  const { name, size, color, style } = props;
+
+  return <iconfont name={name} size={parseFloat(Taro.pxTransform(size))} color={color} style={style} />;
+};
+
+IconFont.defaultProps = {
+  size: 18,
+};
+
+export default IconFont;

src/components/iconfont/weapp/weapp.js

@@ -0,0 +1,63 @@
+Component({
+  properties: {
+    // icon-wodekefu | icon-dizhi | icon-shouhouzhongxin | icon-wodeshoucang | icon-shoukuanliebiao | icon-madanguanli | icon-qusechazhao | icon-pandiansaoma | icon-yaoqingma | icon-duizhang | icon-tihuoliebiao | icon-yangpinduibi | icon-yansequyang | icon-fahuoliebiao | icon-yuncangkucun | icon-xiaoshou | icon-qianzhicangkucun | icon-lingquseka | icon-gouwu1 | icon-dingdan1 | icon-gerenzhongxin1 | icon-shouye1 | icon-gerenzhongxin | icon-dingdan | icon-shouye | icon-gouwu
+    name: {
+      type: String,
+    },
+    // string | string[]
+    color: {
+      type: null,
+      observer: function(color) {
+        this.setData({
+          colors: this.fixColor(),
+          isStr: typeof color === 'string',
+        });
+      }
+    },
+    size: {
+      type: Number,
+      value: 18,
+      observer: function(size) {
+        this.setData({
+          svgSize: size / 750 * wx.getSystemInfoSync().windowWidth,
+        });
+      },
+    },
+  },
+  data: {
+    colors: '',
+    svgSize: 18 / 750 * wx.getSystemInfoSync().windowWidth,
+    quot: '"',
+    isStr: true,
+  },
+  methods: {
+    fixColor: function() {
+      var color = this.data.color;
+      var hex2rgb = this.hex2rgb;
+
+      if (typeof color === 'string') {
+        return color.indexOf('#') === 0 ? hex2rgb(color) : color;
+      }
+
+      return color.map(function (item) {
+        return item.indexOf('#') === 0 ? hex2rgb(item) : item;
+      });
+    },
+    hex2rgb: function(hex) {
+      var rgb = [];
+
+      hex = hex.substr(1);
+
+      if (hex.length === 3) {
+        hex = hex.replace(/(.)/g, '$1$1');
+      }
+
+      hex.replace(/../g, function(color) {
+        rgb.push(parseInt(color, 0x10));
+        return color;
+      });
+
+      return 'rgb(' + rgb.join(',') + ')';
+    }
+  }
+});

src/components/iconfont/weapp/weapp.json

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

src/components/iconfont/weapp/weapp.wxml

@@ -0,0 +1,77 @@
+<!--icon-wodekefu-->
+<view wx:if="{{name === 'icon-wodekefu'}}" style="background-image: url({{quot}}data:image/svg+xml, %3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' width='{{svgSize}}px' height='{{svgSize}}px'%3E%3Cpath d='M832 516.752a193.2 193.2 0 0 1 79.92 150.864l0.08 5.84v13.088c0 53.152-21.44 101.312-56.144 136.272l-3.904 3.84L912 880H657.44a192.72 192.72 0 0 1-127.536-48c165.2-1.024 299.152-133.808 302.048-298.56l0.064-16.688z' fill='{{(isStr ? colors : colors[0]) || 'rgb(69,129,255)'}}' opacity='.4' /%3E%3Cpath d='M521.2 144C701.68 144 848 290.32 848 470.8v34.4C848 685.68 701.68 832 521.2 832H96l100.256-91.264A325.856 325.856 0 0 1 96 505.2v-34.4C96 290.32 242.32 144 422.8 144h98.4z m-151.744 275.2c-37.76 0-68.368 30.8-68.368 68.8s30.608 68.8 68.368 68.8c37.76 0 68.368-30.8 68.368-68.8s-30.608-68.8-68.368-68.8z m205.088 0c-37.76 0-68.368 30.8-68.368 68.8s30.608 68.8 68.368 68.8c37.76 0 68.368-30.8 68.368-68.8s-30.608-68.8-68.368-68.8z' fill='{{(isStr ? colors : colors[1]) || 'rgb(69,129,255)'}}' /%3E%3C/svg%3E{{quot}}); width: {{svgSize}}px; height: {{svgSize}}px; " class="icon" />
+
+<!--icon-dizhi-->
+<view wx:if="{{name === 'icon-dizhi'}}" style="background-image: url({{quot}}data:image/svg+xml, %3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' width='{{svgSize}}px' height='{{svgSize}}px'%3E%3Cpath d='M512 64c194.4 0 352 154.24 352 344.48 0 63.424-29.328 143.76-88 241.008l-0.768 1.28-5.264 5.792C705.696 725.92 613.92 769.28 512 769.28c-104.72 0-198.752-45.808-263.232-118.528C189.6 552.976 160 472.192 160 408.48 160 218.24 317.6 64 512 64z m0 241.28c-61.392 0-111.152 49.856-111.152 111.36S450.608 528 512 528s111.152-49.856 111.152-111.36-49.76-111.36-111.152-111.36z' fill='{{(isStr ? colors : colors[0]) || 'rgb(69,129,255)'}}' /%3E%3Cpath d='M775.232 650.752C740.4 708.336 695.312 771.84 640 841.232l-17.824 22.112-18.496 22.512c-3.136 3.776-6.304 7.584-9.504 11.392l-19.52 23.104-20.192 23.488c-6.848 7.904-13.808 15.856-20.88 23.888L512 992a4097.536 4097.536 0 0 1-42.448-48.16l-20.192-23.488-19.52-23.104c-3.2-3.808-6.368-7.616-9.504-11.392l-18.496-22.512L384 841.232c-55.328-69.408-100.416-132.896-135.248-190.48 64.48 72.72 158.512 118.528 263.232 118.528 101.92 0 193.696-43.376 257.968-112.72l5.28-5.808z' fill='{{(isStr ? colors : colors[1]) || 'rgb(69,129,255)'}}' opacity='.4' /%3E%3C/svg%3E{{quot}}); width: {{svgSize}}px; height: {{svgSize}}px; " class="icon" />
+
+<!--icon-shouhouzhongxin-->
+<view wx:if="{{name === 'icon-shouhouzhongxin'}}" style="background-image: url({{quot}}data:image/svg+xml, %3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' width='{{svgSize}}px' height='{{svgSize}}px'%3E%3Cpath d='M848 384a32 32 0 0 1 32 32v448a32 32 0 0 1-32 32H176a32 32 0 0 1-32-32V416a32 32 0 0 1 32-32h672z m-376.448 112H384l11.264 13.312 68.608 132.608h-71.168l-6.656 48.64h77.312l-13.312 95.232h77.824l13.312-95.232h77.824l6.656-48.64h-71.168L670.72 496h-83.504l-71.12 98.816L471.552 496z' fill='{{(isStr ? colors : colors[0]) || 'rgb(69,129,255)'}}' /%3E%3Cpath d='M335.536 148.56a32 32 0 0 1 35.12 53.44l-2.192 1.44L307.488 240H832a32 32 0 0 1 31.92 29.6L864 272a32 32 0 0 1-29.6 31.92L832 304H192c-31.616 0-43.68-40.576-18.528-58.112l2.064-1.328 160-96z' fill='{{(isStr ? colors : colors[1]) || 'rgb(69,129,255)'}}' opacity='.4' /%3E%3C/svg%3E{{quot}}); width: {{svgSize}}px; height: {{svgSize}}px; " class="icon" />
+
+<!--icon-wodeshoucang-->
+<view wx:if="{{name === 'icon-wodeshoucang'}}" style="background-image: url({{quot}}data:image/svg+xml, %3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' width='{{svgSize}}px' height='{{svgSize}}px'%3E%3Cpath d='M512 128c6.48 0 13.072 1.424 19.264 4.448 8.592 4.16 15.552 11.024 19.792 19.488l98.88 197.44c3.808 7.6 11.152 12.864 19.68 14.08l221.088 31.68c23.808 3.392 40.304 25.168 36.832 48.64a42.704 42.704 0 0 1-12.688 24.544l-160 153.696c-6.16 5.92-8.96 14.432-7.52 22.8l37.776 217.008c4.064 23.36-11.84 45.536-35.552 49.552-9.44 1.6-19.152 0.08-27.632-4.32l-197.76-102.448a26.432 26.432 0 0 0-12.16-2.96z' fill='{{(isStr ? colors : colors[0]) || 'rgb(69,129,255)'}}' opacity='.4' /%3E%3Cpath d='M512 128v673.648c-4.176 0-8.352 0.976-12.16 2.96L302.08 907.04c-21.28 11.04-47.616 2.976-58.816-18.016a42.368 42.368 0 0 1-4.368-27.216L276.64 644.8a25.52 25.52 0 0 0-7.52-22.8L109.152 468.32a42.48 42.48 0 0 1-0.8-60.688 43.776 43.776 0 0 1 24.928-12.512l221.12-31.664a26.112 26.112 0 0 0 19.664-14.08l98.88-197.44A43.616 43.616 0 0 1 511.984 128z' fill='{{(isStr ? colors : colors[1]) || 'rgb(69,129,255)'}}' /%3E%3C/svg%3E{{quot}}); width: {{svgSize}}px; height: {{svgSize}}px; " class="icon" />
+
+<!--icon-shoukuanliebiao-->
+<view wx:if="{{name === 'icon-shoukuanliebiao'}}" style="background-image: url({{quot}}data:image/svg+xml, %3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' width='{{svgSize}}px' height='{{svgSize}}px'%3E%3Cpath d='M832 128a32 32 0 0 1 32 32v704a32 32 0 0 1-32 32H288a32 32 0 0 1-32-32V160a32 32 0 0 1 32-32h544z m-128 592H416a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h288a16 16 0 0 0 16-16v-32a16 16 0 0 0-16-16z m0-128H416a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h288a16 16 0 0 0 16-16v-32a16 16 0 0 0-16-16zM542.176 208H464l10.064 11.76 61.248 117.152h-63.536l-5.952 42.96h69.04L522.976 464h69.488l11.872-84.128h69.488l5.952-42.96h-63.552L720 208h-74.56l-63.504 87.296L542.176 208z' fill='{{(isStr ? colors : colors[0]) || 'rgb(69,129,255)'}}' /%3E%3Cpath d='M288 128a32 32 0 0 0-32 32v704a32 32 0 0 0 32 32h-80a32 32 0 0 1-32-32V160a32 32 0 0 1 32-32z' fill='{{(isStr ? colors : colors[1]) || 'rgb(69,129,255)'}}' opacity='.4' /%3E%3C/svg%3E{{quot}}); width: {{svgSize}}px; height: {{svgSize}}px; " class="icon" />
+
+<!--icon-madanguanli-->
+<view wx:if="{{name === 'icon-madanguanli'}}" style="background-image: url({{quot}}data:image/svg+xml, %3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' width='{{svgSize}}px' height='{{svgSize}}px'%3E%3Cpath d='M128 128m32 0l288 0q32 0 32 32l0 288q0 32-32 32l-288 0q-32 0-32-32l0-288q0-32 32-32Z' fill='{{(isStr ? colors : colors[0]) || 'rgb(69,129,255)'}}' /%3E%3Cpath d='M544 128m32 0l288 0q32 0 32 32l0 288q0 32-32 32l-288 0q-32 0-32-32l0-288q0-32 32-32Z' fill='{{(isStr ? colors : colors[1]) || 'rgb(69,129,255)'}}' /%3E%3Cpath d='M128 544m32 0l288 0q32 0 32 32l0 288q0 32-32 32l-288 0q-32 0-32-32l0-288q0-32 32-32Z' fill='{{(isStr ? colors : colors[2]) || 'rgb(69,129,255)'}}' /%3E%3Cpath d='M544 544m32 0l80 0q32 0 32 32l0 288q0 32-32 32l-80 0q-32 0-32-32l0-288q0-32 32-32Z' fill='{{(isStr ? colors : colors[3]) || 'rgb(69,129,255)'}}' opacity='.6' /%3E%3Cpath d='M752 544m32 0l80 0q32 0 32 32l0 288q0 32-32 32l-80 0q-32 0-32-32l0-288q0-32 32-32Z' fill='{{(isStr ? colors : colors[4]) || 'rgb(69,129,255)'}}' opacity='.6' /%3E%3C/svg%3E{{quot}}); width: {{svgSize}}px; height: {{svgSize}}px; " class="icon" />
+
+<!--icon-qusechazhao-->
+<view wx:if="{{name === 'icon-qusechazhao'}}" style="background-image: url({{quot}}data:image/svg+xml, %3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' width='{{svgSize}}px' height='{{svgSize}}px'%3E%3Cpath d='M868.528 816.8c59.36 0 107.472-46.48 107.472-103.824 0-38.224-35.824-102.496-107.472-192.816-71.648 90.32-107.472 154.592-107.472 192.816 0 57.344 48.112 103.84 107.472 103.84z' fill='{{(isStr ? colors : colors[0]) || 'rgb(69,129,255)'}}' opacity='.4' /%3E%3Cpath d='M344 105.44l75.76 53.04c3.392 2.368 6.384 5.12 8.928 8.144 3.728 1.376 7.344 3.248 10.752 5.632l341.968 239.456a47.008 47.008 0 0 1 11.552 65.472L498.224 898.112a47.008 47.008 0 0 1-65.472 11.536L90.768 670.192a47.008 47.008 0 0 1-11.536-65.472l268.064-382.848-56.928-39.84A46.752 46.752 0 1 1 344 105.44z m112.528 192.928a40.336 40.336 0 0 0-56.128 9.904L221.424 563.76a40.288 40.288 0 0 0 44.448 61.76l382.24-113.232a40.288 40.288 0 0 0 11.68-71.648z' fill='{{(isStr ? colors : colors[1]) || 'rgb(69,129,255)'}}' /%3E%3C/svg%3E{{quot}}); width: {{svgSize}}px; height: {{svgSize}}px; " class="icon" />
+
+<!--icon-pandiansaoma-->
+<view wx:if="{{name === 'icon-pandiansaoma'}}" style="background-image: url({{quot}}data:image/svg+xml, %3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' width='{{svgSize}}px' height='{{svgSize}}px'%3E%3Cpath d='M224 128h304v768H224a96 96 0 0 1-96-96V224a96 96 0 0 1 96-96z' fill='{{(isStr ? colors : colors[0]) || 'rgb(69,129,255)'}}' opacity='.4' /%3E%3Cpath d='M128 480h768v64H128zM896 656v208a32 32 0 0 1-32 32H656l-0.016-64H832V656h64z m-704 0v176h175.984L368 896H160a32 32 0 0 1-32-32V656h64zM864 128a32 32 0 0 1 32 32v208h-64V192H655.984L656 128h208zM128 160a32 32 0 0 1 32-32h208l-0.016 64H192v176H128V160z' fill='{{(isStr ? colors : colors[1]) || 'rgb(69,129,255)'}}' /%3E%3C/svg%3E{{quot}}); width: {{svgSize}}px; height: {{svgSize}}px; " class="icon" />
+
+<!--icon-yaoqingma-->
+<view wx:if="{{name === 'icon-yaoqingma'}}" style="background-image: url({{quot}}data:image/svg+xml, %3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' width='{{svgSize}}px' height='{{svgSize}}px'%3E%3Cpath d='M768 128a32 32 0 0 1 32 32v299.984L512 544l-288-84.016V160a32 32 0 0 1 32-32h512z m-112 240H368a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h288a16 16 0 0 0 16-16v-32a16 16 0 0 0-16-16z m0-128H368a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h288a16 16 0 0 0 16-16v-32a16 16 0 0 0-16-16z' fill='{{(isStr ? colors : colors[0]) || 'rgb(69,129,255)'}}' opacity='.5' /%3E%3Cpath d='M168.96 443.952L512 544l343.04-100.048a32 32 0 0 1 40.96 30.72V864a32 32 0 0 1-32 32H160a32 32 0 0 1-32-32V474.672a32 32 0 0 1 40.96-30.72z' fill='{{(isStr ? colors : colors[1]) || 'rgb(64,122,244)'}}' /%3E%3C/svg%3E{{quot}}); width: {{svgSize}}px; height: {{svgSize}}px; " class="icon" />
+
+<!--icon-duizhang-->
+<view wx:if="{{name === 'icon-duizhang'}}" style="background-image: url({{quot}}data:image/svg+xml, %3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' width='{{svgSize}}px' height='{{svgSize}}px'%3E%3Cpath d='M864 96a32 32 0 0 1 32 32v608a32 32 0 0 1-32 32h-128V288a32 32 0 0 0-29.6-31.92L704 256H288V128a32 32 0 0 1 32-32h544z' fill='{{(isStr ? colors : colors[0]) || 'rgb(69,129,255)'}}' opacity='.5' /%3E%3Cpath d='M704 256a32 32 0 0 1 32 32v608a32 32 0 0 1-32 32H160a32 32 0 0 1-32-32V288a32 32 0 0 1 32-32h544zM375.552 464H288l11.264 13.312 68.608 132.608h-71.168l-6.656 48.64h77.312l-13.312 95.232h77.824l13.312-95.232h77.824l6.656-48.64h-71.168L574.72 464h-83.504l-71.12 98.816L375.552 464z' fill='{{(isStr ? colors : colors[1]) || 'rgb(69,129,255)'}}' /%3E%3C/svg%3E{{quot}}); width: {{svgSize}}px; height: {{svgSize}}px; " class="icon" />
+
+<!--icon-tihuoliebiao-->
+<view wx:if="{{name === 'icon-tihuoliebiao'}}" style="background-image: url({{quot}}data:image/svg+xml, %3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' width='{{svgSize}}px' height='{{svgSize}}px'%3E%3Cpath d='M880 496v317.088A34.912 34.912 0 0 1 845.088 848H274.912A34.912 34.912 0 0 1 240 813.088V496h640zM240 242.912c0-19.28 15.632-34.912 34.912-34.912h570.176c19.28 0 34.912 15.632 34.912 34.912V432H240V242.912z' fill='{{(isStr ? colors : colors[0]) || 'rgb(69,129,255)'}}' /%3E%3Cpath d='M224 144a16 16 0 0 1 16 16v668.112c7.84 5.28 14.624 12.032 19.888 19.888H880a32 32 0 0 1 32 32v16a32 32 0 0 1-32 32H259.872A72 72 0 1 1 160 828.144V224L112 224a16 16 0 0 1-16-16v-48a16 16 0 0 1 16-16h112z' fill='{{(isStr ? colors : colors[1]) || 'rgb(69,129,255)'}}' opacity='.4' /%3E%3C/svg%3E{{quot}}); width: {{svgSize}}px; height: {{svgSize}}px; " class="icon" />
+
+<!--icon-yangpinduibi-->
+<view wx:if="{{name === 'icon-yangpinduibi'}}" style="background-image: url({{quot}}data:image/svg+xml, %3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' width='{{svgSize}}px' height='{{svgSize}}px'%3E%3Cpath d='M528 80a32 32 0 0 1 32 32v800a32 32 0 0 1-32 32h-32a32 32 0 0 1-32-32v-64H160a32 32 0 0 1-32-32V208a32 32 0 0 1 32-32h304V112a32 32 0 0 1 32-32h32z' fill='{{(isStr ? colors : colors[0]) || 'rgb(69,129,255)'}}' /%3E%3Cpath d='M560 176h304a32 32 0 0 1 32 32v608a32 32 0 0 1-32 32H560V176z' fill='{{(isStr ? colors : colors[1]) || 'rgb(69,129,255)'}}' opacity='.4' /%3E%3C/svg%3E{{quot}}); width: {{svgSize}}px; height: {{svgSize}}px; " class="icon" />
+
+<!--icon-yansequyang-->
+<view wx:if="{{name === 'icon-yansequyang'}}" style="background-image: url({{quot}}data:image/svg+xml, %3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' width='{{svgSize}}px' height='{{svgSize}}px'%3E%3Cpath d='M760.896 104.704a32 32 0 0 1 45.264 0l113.12 113.136a32 32 0 0 1 0 45.264L828.8 353.6l22.624 22.624a32 32 0 0 1 0 45.248l-45.248 45.264a32 32 0 0 1-45.264 0L557.248 263.104a32 32 0 0 1 0-45.264l45.264-45.248a32 32 0 0 1 45.248 0L670.4 195.2l90.512-90.512z' fill='{{(isStr ? colors : colors[0]) || 'rgb(69,129,255)'}}' /%3E%3Cpath d='M579.888 285.728l158.4 158.4-396 395.968a48 48 0 0 1-67.872 0l-22.624 22.624a64 64 0 1 1-90.512-90.512l22.624-22.624a48 48 0 0 1 0-67.872l395.984-396z' fill='{{(isStr ? colors : colors[1]) || 'rgb(69,129,255)'}}' opacity='.5' /%3E%3C/svg%3E{{quot}}); width: {{svgSize}}px; height: {{svgSize}}px; " class="icon" />
+
+<!--icon-fahuoliebiao-->
+<view wx:if="{{name === 'icon-fahuoliebiao'}}" style="background-image: url({{quot}}data:image/svg+xml, %3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' width='{{svgSize}}px' height='{{svgSize}}px'%3E%3Cpath d='M864 416a32 32 0 0 1 32 32v416a32 32 0 0 1-32 32H160a32 32 0 0 1-32-32V448a32 32 0 0 1 32-32h704z m-80 320H528a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h256a16 16 0 0 0 16-16v-32a16 16 0 0 0-16-16z m0-128H608a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h176a16 16 0 0 0 16-16v-32a16 16 0 0 0-16-16z' fill='{{(isStr ? colors : colors[0]) || 'rgb(69,129,255)'}}' /%3E%3Cpath d='M748.8 192a32 32 0 0 1 28.24 16.944L896 432v16a32 32 0 0 0-32-32H160a32 32 0 0 0-32 32v-16l118.96-223.056A32 32 0 0 1 275.2 192h473.6z' fill='{{(isStr ? colors : colors[1]) || 'rgb(69,129,255)'}}' opacity='.4' /%3E%3C/svg%3E{{quot}}); width: {{svgSize}}px; height: {{svgSize}}px; " class="icon" />
+
+<!--icon-yuncangkucun-->
+<view wx:if="{{name === 'icon-yuncangkucun'}}" style="background-image: url({{quot}}data:image/svg+xml, %3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' width='{{svgSize}}px' height='{{svgSize}}px'%3E%3Cpath d='M848 432v445.088A34.912 34.912 0 0 1 813.088 912H210.912A34.912 34.912 0 0 1 176 877.088V432h672zM608 704H416a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h192a16 16 0 0 0 16-16v-32a16 16 0 0 0-16-16z m0-128H416a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h192a16 16 0 0 0 16-16v-32a16 16 0 0 0-16-16z' fill='{{(isStr ? colors : colors[0]) || 'rgb(69,129,255)'}}' opacity='.4' /%3E%3Cpath d='M536 64c108.8 0 197.328 86.88 199.936 195.072l0.016 1.024 3.936-2.624a112 112 0 1 1 63.952 206.464L800 464H392.8c-31.52 29.76-74.032 48-120.8 48-97.2 0-176-78.8-176-176s78.8-176 176-176c29.712 0 57.712 7.36 82.272 20.368C385.92 111.68 455.392 64 536 64z' fill='{{(isStr ? colors : colors[1]) || 'rgb(69,129,255)'}}' /%3E%3C/svg%3E{{quot}}); width: {{svgSize}}px; height: {{svgSize}}px; " class="icon" />
+
+<!--icon-xiaoshou-->
+<view wx:if="{{name === 'icon-xiaoshou'}}" style="background-image: url({{quot}}data:image/svg+xml, %3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' width='{{svgSize}}px' height='{{svgSize}}px'%3E%3Cpath d='M511.92 496c159.808 0 298.16 97.36 365.056 239.152 13.76 29.184 25.264 72.912 34.496 131.2A53.312 53.312 0 0 1 858.784 928H518.768l63.552-80.736-70.4-342-70.4 342L505.024 928H165.152a53.312 53.312 0 0 1-52.592-61.808c9.664-60.08 21.712-105.056 36.16-134.912C216.288 591.6 353.568 496 511.92 496z' fill='{{(isStr ? colors : colors[0]) || 'rgb(69,129,255)'}}' opacity='.5' /%3E%3Cpath d='M520 296m-216 0a216 216 0 1 0 432 0 216 216 0 1 0-432 0Z' fill='{{(isStr ? colors : colors[1]) || 'rgb(64,141,250)'}}' /%3E%3C/svg%3E{{quot}}); width: {{svgSize}}px; height: {{svgSize}}px; " class="icon" />
+
+<!--icon-qianzhicangkucun-->
+<view wx:if="{{name === 'icon-qianzhicangkucun'}}" style="background-image: url({{quot}}data:image/svg+xml, %3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' width='{{svgSize}}px' height='{{svgSize}}px'%3E%3Cpath d='M904.032 338.016a22.016 22.016 0 0 0-1.456-4.432l-67.616-154C823.28 147.776 790.944 128 750.272 128h-474.56c-39.856 0-70.832 19.392-82.064 50.064l-72.672 157.12a31.776 31.776 0 0 0-1.04 3.696A134.816 134.816 0 0 0 112 384.224c0.064 53.76 32.304 102.848 84.08 128.048 21.312 10.448 46.432 15.728 74.64 15.728h0.096c47.328-0.096 91.168-19.136 121.056-51.696 29.728 32.272 73.232 51.2 120.48 51.456 46.88-0.32 90.224-19.312 119.84-51.584 29.872 32.56 73.776 51.52 121.344 51.52 28.8-0.144 54.336-5.664 75.84-16.48 51.008-25.472 82.656-74.368 82.624-127.552a132.032 132.032 0 0 0-7.728-44.576 8.768 8.768 0 0 0-0.24-1.072z' fill='{{(isStr ? colors : colors[0]) || 'rgb(69,129,255)'}}' /%3E%3Cpath d='M848 432v445.088A34.912 34.912 0 0 1 813.088 912H210.912A34.912 34.912 0 0 1 176 877.088V432h672zM608 752H416a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h192a16 16 0 0 0 16-16v-32a16 16 0 0 0-16-16z m0-128H416a16 16 0 0 0-16 16v32a16 16 0 0 0 16 16h192a16 16 0 0 0 16-16v-32a16 16 0 0 0-16-16z' fill='{{(isStr ? colors : colors[1]) || 'rgb(69,129,255)'}}' opacity='.4' /%3E%3C/svg%3E{{quot}}); width: {{svgSize}}px; height: {{svgSize}}px; " class="icon" />
+
+<!--icon-lingquseka-->
+<view wx:if="{{name === 'icon-lingquseka'}}" style="background-image: url({{quot}}data:image/svg+xml, %3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' width='{{svgSize}}px' height='{{svgSize}}px'%3E%3Cpath d='M352 160a32 32 0 0 1 32 32v672a32 32 0 0 1-32 32H160a32 32 0 0 1-32-32V192a32 32 0 0 1 32-32h192z m-96 560a48 48 0 1 0 0 96 48 48 0 0 0 0-96z' fill='{{(isStr ? colors : colors[0]) || 'rgb(69,129,255)'}}' opacity='.6' /%3E%3Cpath d='M648.432 230.624l135.76 135.76a32 32 0 0 1 0 45.264L331.648 864.192a32 32 0 0 1-45.264 0l-54.992-54.976a48 48 0 1 0-16.608-16.608l-64.16-64.176a32 32 0 0 1 0-45.264l452.544-452.544a32 32 0 0 1 45.264 0z' fill='{{(isStr ? colors : colors[1]) || 'rgb(69,129,255)'}}' opacity='.8' /%3E%3Cpath d='M864 640a32 32 0 0 1 32 32v192a32 32 0 0 1-32 32H160a32 32 0 0 1-32-32V672a32 32 0 0 1 32-32h704z m-608 80a48 48 0 1 0 0 96 48 48 0 0 0 0-96z' fill='{{(isStr ? colors : colors[2]) || 'rgb(69,129,255)'}}' /%3E%3C/svg%3E{{quot}}); width: {{svgSize}}px; height: {{svgSize}}px; " class="icon" />
+
+<!--icon-gouwu1-->
+<view wx:if="{{name === 'icon-gouwu1'}}" style="background-image: url({{quot}}data:image/svg+xml, %3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' width='{{svgSize}}px' height='{{svgSize}}px'%3E%3Cpath d='M512 128a144 144 0 0 1 144 144v32h84.032a32 32 0 0 1 31.712 27.712l71.36 528A32 32 0 0 1 811.392 896H212.608a32 32 0 0 1-31.712-36.288l71.36-528A32 32 0 0 1 283.968 304h84.016L368 272a144 144 0 0 1 144-144z m214.048 224H297.936l-67.024 496h562.16l-67.024-496zM512 176a96 96 0 0 0-95.936 92.4L416 272v32h192v-32a96 96 0 0 0-92.4-95.936L512 176z' fill='{{(isStr ? colors : colors[0]) || 'rgb(68,68,68)'}}' /%3E%3C/svg%3E{{quot}}); width: {{svgSize}}px; height: {{svgSize}}px; " class="icon" />
+
+<!--icon-dingdan1-->
+<view wx:if="{{name === 'icon-dingdan1'}}" style="background-image: url({{quot}}data:image/svg+xml, %3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' width='{{svgSize}}px' height='{{svgSize}}px'%3E%3Cpath d='M816 128a32 32 0 0 1 32 32v704a32 32 0 0 1-32 32H208a32 32 0 0 1-32-32V160a32 32 0 0 1 32-32h608z m-16 48H224v672h576V176z m-120 448a24 24 0 0 1 0 48h-336a24 24 0 0 1 0-48h336z m0-144a24 24 0 0 1 0 48h-336a24 24 0 0 1 0-48h336z m0-144a24 24 0 0 1 0 48h-336a24 24 0 0 1 0-48h336z' fill='{{(isStr ? colors : colors[0]) || 'rgb(68,68,68)'}}' /%3E%3C/svg%3E{{quot}}); width: {{svgSize}}px; height: {{svgSize}}px; " class="icon" />
+
+<!--icon-gerenzhongxin1-->
+<view wx:if="{{name === 'icon-gerenzhongxin1'}}" style="background-image: url({{quot}}data:image/svg+xml, %3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' width='{{svgSize}}px' height='{{svgSize}}px'%3E%3Cpath d='M624 544c150.224 0 272 121.776 272 272v80H128v-80c0-150.224 121.776-272 272-272h224z m0 48H400c-122.048 0-221.28 97.6-223.952 218.992L176 816v32h672v-32c0-122.048-97.6-221.28-218.992-223.952L624 592zM512 128a144 144 0 0 1 144 144v80a144 144 0 0 1-139.76 143.936L512 496a144 144 0 0 1-144-144v-80a144 144 0 0 1 139.76-143.936L512 128z m0 48a96 96 0 0 0-95.936 92.4L416 272v80a96 96 0 0 0 191.936 3.6L608 352v-80a96 96 0 0 0-96-96z' fill='{{(isStr ? colors : colors[0]) || 'rgb(68,68,68)'}}' /%3E%3C/svg%3E{{quot}}); width: {{svgSize}}px; height: {{svgSize}}px; " class="icon" />
+
+<!--icon-shouye1-->
+<view wx:if="{{name === 'icon-shouye1'}}" style="background-image: url({{quot}}data:image/svg+xml, %3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' width='{{svgSize}}px' height='{{svgSize}}px'%3E%3Cpath d='M543.84 690.24a31.728 31.728 0 0 0-29.472-31.552L512 658.592a31.76 31.76 0 0 0-31.744 29.296l-0.08 2.368V896h-47.76v-0.016L241.44 896a31.744 31.744 0 0 1-31.84-31.648V539.648l-39.84 39.872c-9.28 9.28-24.352 9.216-33.664-0.096a23.84 23.84 0 0 1-1.632-31.984l1.536-1.68 73.6-73.632v-3.456h3.456l236.288-236.272c33.168-33.168 86.592-33.824 120.912-2.096l2.544 2.432 235.936 235.936h5.648v5.648l73.52 73.536c9.328 9.328 9.376 24.4 0.096 33.664a23.792 23.792 0 0 1-31.968 1.456l-1.696-1.552-39.952-39.952v322.88c0 17.472-14.24 31.648-31.824 31.648l-190.992-0.016V896H543.84V690.24z m-58.832-425.856l-1.888 1.776-225.776 225.744v356.608h175.072v-158.256c0-43.712 35.632-79.136 79.584-79.136 43.952 0 79.584 35.424 79.584 79.136l-0.016 158.256h175.088l-0.016-354.784-227.408-227.408a39.696 39.696 0 0 0-54.224-1.936z' fill='{{(isStr ? colors : colors[0]) || 'rgb(68,68,68)'}}' /%3E%3C/svg%3E{{quot}}); width: {{svgSize}}px; height: {{svgSize}}px; " class="icon" />
+
+<!--icon-gerenzhongxin-->
+<view wx:if="{{name === 'icon-gerenzhongxin'}}" style="background-image: url({{quot}}data:image/svg+xml, %3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' width='{{svgSize}}px' height='{{svgSize}}px'%3E%3Cpath d='M512 128a144 144 0 0 1 144 144v80a144 144 0 0 1-288 0v-80a144 144 0 0 1 144-144z m112 416c150.224 0 272 121.776 272 272v80H128v-80c0-150.224 121.776-272 272-272h224z' fill='{{(isStr ? colors : colors[0]) || 'rgb(69,129,255)'}}' /%3E%3C/svg%3E{{quot}}); width: {{svgSize}}px; height: {{svgSize}}px; " class="icon" />
+
+<!--icon-dingdan-->
+<view wx:if="{{name === 'icon-dingdan'}}" style="background-image: url({{quot}}data:image/svg+xml, %3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' width='{{svgSize}}px' height='{{svgSize}}px'%3E%3Cpath d='M816 128a32 32 0 0 1 32 32v704a32 32 0 0 1-32 32H208a32 32 0 0 1-32-32V160a32 32 0 0 1 32-32h608z m-136 496h-336a24 24 0 0 0 0 48h336a24 24 0 0 0 0-48z m0-144h-336a24 24 0 0 0 0 48h336a24 24 0 0 0 0-48z m0-144h-336a24 24 0 0 0 0 48h336a24 24 0 0 0 0-48z' fill='{{(isStr ? colors : colors[0]) || 'rgb(69,129,255)'}}' /%3E%3C/svg%3E{{quot}}); width: {{svgSize}}px; height: {{svgSize}}px; " class="icon" />
+
+<!--icon-shouye-->
+<view wx:if="{{name === 'icon-shouye'}}" style="background-image: url({{quot}}data:image/svg+xml, %3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' width='{{svgSize}}px' height='{{svgSize}}px'%3E%3Cpath d='M570.256 230.304l2.544 2.432 235.936 235.936h5.648v5.648l73.52 73.536c9.328 9.328 9.376 24.4 0.096 33.664a23.792 23.792 0 0 1-31.968 1.456l-1.696-1.552-39.952-39.952v322.88c0 17.472-14.24 31.648-31.824 31.648l-190.992-0.016V896H576V688a64 64 0 1 0-128 0v208h-15.584v-0.016L241.44 896a31.744 31.744 0 0 1-31.84-31.648V539.648l-39.84 39.872c-9.28 9.28-24.352 9.216-33.664-0.096a23.84 23.84 0 0 1-1.632-31.984l1.536-1.68 73.6-73.632v-3.456h3.456l236.288-236.272c33.168-33.168 86.592-33.824 120.912-2.096z' fill='{{(isStr ? colors : colors[0]) || 'rgb(69,129,255)'}}' /%3E%3C/svg%3E{{quot}}); width: {{svgSize}}px; height: {{svgSize}}px; " class="icon" />
+
+<!--icon-gouwu-->
+<view wx:if="{{name === 'icon-gouwu'}}" style="background-image: url({{quot}}data:image/svg+xml, %3Csvg viewBox='0 0 1024 1024' xmlns='http://www.w3.org/2000/svg' width='{{svgSize}}px' height='{{svgSize}}px'%3E%3Cpath d='M512 128a144 144 0 0 1 144 144v32h84.032a32 32 0 0 1 31.712 27.712l71.36 528A32 32 0 0 1 811.392 896H212.608a32 32 0 0 1-31.712-36.288l71.36-528A32 32 0 0 1 283.968 304h84.016L368 272a144 144 0 0 1 144-144z m0 48a96 96 0 0 0-95.936 92.4L416 272v32h192v-32a96 96 0 0 0-92.4-95.936L512 176z' fill='{{(isStr ? colors : colors[0]) || 'rgb(69,129,255)'}}' /%3E%3C/svg%3E{{quot}}); width: {{svgSize}}px; height: {{svgSize}}px; " class="icon" />

src/components/iconfont/weapp/weapp.wxss

@@ -0,0 +1,3 @@
+.icon {
+  background-repeat: no-repeat;
+}

src/components/layoutBlock/index.module.scss

@@ -0,0 +1,16 @@
+.layoutBlock {
+  display: flex;
+  flex-flow: row nowrap;
+  background-color: #fff;
+  padding: 32px;
+  margin-bottom: 20px;
+  &--row {
+    flex-flow: row nowrap;
+  }
+  &--col {
+    flex-flow: column nowrap;
+  }
+  &--circle {
+    border-radius: 20px;
+  }
+}

src/components/layoutBlock/index.tsx

@@ -0,0 +1,34 @@
+import { View } from '@tarojs/components'
+import { FC, ReactNode } from 'react'
+import classnames from 'classname'
+import styles from './index.module.scss'
+
+type FlexDirection = 'row' | 'col'
+
+interface PropsType {
+  flexDirection?: FlexDirection
+  
+  circle?: boolean
+  children?: ReactNode
+  customStyle?: React.CSSProperties
+
+}
+
+const LayoutBlock: FC<PropsType> = (props) => {
+  const { flexDirection = 'col', circle = false, children } = props
+
+  const getClassName = () => {
+    const classObject = {
+      [styles['layoutBlock--circle']]: circle,
+      [styles[`layoutBlock--${flexDirection}`]]: flexDirection,
+    }
+    return classObject
+  }
+
+  return <View className={classnames(styles.layoutBlock, getClassName())}>
+    
+    {children}
+    
+  </View>
+}
+export default LayoutBlock

src/components/normalButton/index.module.scss

@@ -0,0 +1,37 @@
+.button {
+  display: flex;
+  padding: 0 40px;
+  height: 36PX;
+  border: 1px solid $color_main;
+  background-color: #fff;
+  text-align: center;
+  flex-flow: row nowrap;
+  justify-content: center;
+  align-items: center;
+  &--normal {
+    height: 36PX;
+    font-size: $font_size_medium;
+  }
+  &--small {
+    height: 30PX;
+    font-size: $font_size_min;
+  }
+  &--disabled {
+    opacity: $opacity-disabled;
+  }
+  &--primary {
+    border: 1px solid $color_main;
+    color: $color_main;
+  }
+  &--danger {
+    border: 1px solid $color_danger;
+    color: $color_danger;
+  }
+  &--warning {
+    border: 1px solid $color_warning;
+    color: $color_warning;
+  }
+  &--circle {
+    border-radius: 50px;
+  }
+}

src/components/normalButton/index.tsx

@@ -0,0 +1,43 @@
+import { View } from '@tarojs/components'
+import { FC, ReactNode } from 'react'
+import classnames from 'classnames'
+import styles from './index.module.scss'
+
+type ButtonType = 'primary' | 'danger' | 'warning'
+type ButtonSize = 'normal' | 'small'
+
+interface PropsType {
+  size?: ButtonSize
+  type?: ButtonType
+  circle?: boolean
+  disabled?: boolean
+  children?: ReactNode
+  onClick?: Function
+}
+
+const NormalButton: FC<PropsType> = ({ type = 'primary', size = 'normal', circle = false, disabled = false, children, onClick }) => {
+  const getClassName = () => {
+    const classObject = {
+      [styles[`button--disabled`]]: disabled,
+      [styles[`button--${size}`]]: size,
+      [styles[`button--${type}`]]: type,
+      [styles['button--circle']]: circle,
+    }
+    console.log('classObj==>button', classObject)
+    return classObject
+  }
+
+  const handleClick = (event) => {
+    if (disabled) {
+      return
+    }
+    onClick && onClick(event)
+  }
+
+  return (
+    <View className={classnames(styles['button'], getClassName())} onClick={handleClick}>
+      {children}
+    </View>
+  )
+}
+export default NormalButton

src/components/tag/index.module.scss

@@ -0,0 +1,33 @@
+.tag {
+  display: inline-flex;
+  flex-flow: row nowrap;
+  padding: 0 20px;
+  height: 60px;
+  color: #fff;
+  text-align: center;
+  justify-content: center;
+  align-items: center;
+  &--normal {
+    font-size: $font_size_medium;
+    height: 40px;
+  }
+  &--small{
+    font-size: $font_size_min;
+    height: 30px;
+  }
+  &--circle{
+    border-radius: 10px;
+  }
+  &--danger {
+    background-color: $color_danger;
+  }
+  &--primary{
+    background-color: $color_main;
+  }
+  &--warning{
+    background-color: $color_warning;
+  }
+  &--disabled {
+    opacity: $opacity-disabled;
+  }
+}

src/components/tag/index.tsx

@@ -0,0 +1,43 @@
+import { View } from '@tarojs/components'
+import { FC, ReactNode } from 'react'
+import classnames from 'classnames'
+import styles from './index.module.scss'
+
+type TagSize = 'small' | 'normal'
+type TagType = 'primary' | 'danger' | 'warning'
+
+interface PropsType {
+  type?: TagType
+  disabled?: boolean
+  size?: TagSize
+  children?: ReactNode
+  onClick?: Function
+  circle?: boolean
+  customStyle?: React.CSSProperties
+}
+
+const Tag: FC<PropsType> = ({ type = 'primary', size = 'normal', disabled = false, children, onClick, circle = false, customStyle = {} }) => {
+  const handleClick = (event) => {
+    if (disabled) {
+      return
+    }
+    onClick && onClick(event)
+  }
+
+  const getClassName = () => {
+    const classObject = {
+      [styles['tag--disabled']]: disabled,
+      [styles[`tag--${size}`]]: size,
+      [styles[`tag--${type}`]]: type,
+      [styles['tag--circle']]: circle,
+    }
+    console.log('classObj==>', classObject)
+    return classObject
+  }
+  return (
+    <View className={classnames(styles.tag, getClassName())} style={customStyle} onClick={handleClick}>
+      {children}
+    </View>
+  )
+}
+export default Tag

src/constants/common.ts

@@ -1,3 +1,3 @@
 export const SET_SHOPCOUNT = 'set_shopCount'
 export const CLEAR_SHOPCOUNT = 'clear_shopCount'
-export const STORAGE_SHOPCOUNT = 'storage_shopcount'
+export const STORAGE_SHOPCOUNT = 'storage_shopcount'

src/constants/tabbar.ts

@@ -0,0 +1,3 @@
+export enum TabBarType {
+  SET_SELECTED = 'setSelected'
+}

src/custom-tab-bar/index.config.ts

@@ -0,0 +1,3 @@
+export default {
+  component: true,
+}

src/custom-tab-bar/index.module.scss

@@ -0,0 +1,41 @@
+.customTabBar {
+  position: fixed;
+  left: 0;
+  bottom: 0;
+  width: 100%;
+  height: $customTabBarHeight;
+  display: flex;
+  flex-flow: row nowrap;
+  padding-bottom: env(safe-area-inset-bottom);
+  background-color: #fff;
+  z-index: 9999;
+  box-shadow: 0 11px 7px 8px #c2c2c2;
+  &-line {
+    position: absolute;
+    left: 0;
+    top: 0;
+    width: 100%;
+    height: 1px;
+    transform: scaleY(0.5);
+  }
+  &-item {
+    flex: 1;
+    text-align: center;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    flex-flow: column nowrap;
+    &-icon {
+      width: 56px;
+      height: 56px;
+      font-size: 60px;
+    }
+    &-title {
+      margin-top: 10px;
+      font-size: 20px;
+    }
+  }
+}
+.selected {
+  color: $color_main;
+}

src/custom-tab-bar/index.tsx

@@ -0,0 +1,73 @@
+import { CoverImage, View } from '@tarojs/components'
+import { FC, useMemo, useState } from 'react'
+import styles from './index.module.scss'
+import IconFont from '@/components/iconfont'
+import classname from 'classname'
+import Taro, { useDidShow, useRouter } from '@tarojs/taro'
+import { useSelector } from '@/reducers/hooks'
+import { useDispatch } from 'react-redux'
+import { Dispatch } from 'redux'
+import { TabBarType } from '@/constants/tabbar'
+import { TabBarAction } from '@/reducers/tabBar'
+
+type IconfontName = Parameters<typeof IconFont>['0']['name']
+
+type TabBarIndexMap = {
+  [Property: number]: {
+    id: number
+    pagePath: string
+    text: string
+    iconPath: IconfontName
+    selectedIconPath: IconfontName
+  }
+}
+
+const CustomTabBar: FC = () => {
+  console.log('重新渲染')
+
+  
+
+  const { selectedId, tabItem } = useSelector((state) => {
+    console.log('sdfasdfa', state)
+    return state.tabBarData
+  })
+  // const tabBarIndexMap = useMemo(() => {
+  //   let map: TabBarIndexMap = {}
+  //   for (let i = 0; i < tabItem.length; i++) {
+  //     map[tabItem[i].id] = tabItem[i]
+  //   }
+  //   return map
+  // }, [tabItem])
+  console.log('selectedId', selectedId)
+
+  const dispatch = useDispatch<Dispatch<TabBarAction>>()
+
+  const handleSelectTabItem = (id: TabBarIndexMap[number]['id']) => {
+    return () => {
+      setSelected(id)
+      Taro.switchTab({ url: tabItem.find(item=>item.id === id)?.pagePath! })
+    }
+  }
+  const setSelected = (id: TabBarIndexMap[number]['id']) => {
+    dispatch({ type: TabBarType.SET_SELECTED, data: { tabItem, selectedId: id } })
+  }
+
+  return (
+    <View className={styles.customTabBar}>
+      <View className={styles['customTabBar-line']}></View>
+      {tabItem.map((item, index) => {
+        return (
+          <View
+            key={index}
+            className={classname(styles['customTabBar-item'], styles['customTabBar-item-title'], selectedId === item.id ? styles['selected'] : '')}
+            onClick={handleSelectTabItem(item.id)}>
+            <IconFont name={Number(selectedId) === item.id ? item.selectedIconPath : item.iconPath} size={56} />
+
+            <View>{item.text}</View>
+          </View>
+        )
+      })}
+    </View>
+  )
+}
+export default CustomTabBar

src/pages/index/index.tsx

@@ -6,7 +6,7 @@ import MoveBtn from '@/components/moveBtn'
 import ShopCart from '@/components/shoppingCart'
 import { goLink } from '@/common/common'
 import styles from './index.module.scss'
-import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react'
+import { useCallback, useEffect, useMemo, useRef, useState } from 'react'
 import { kindListApi, ProductListApi } from '@/api/index'
 // import useLogin from '@/use/useLogin'
 import { mpproductcolorlist, mpsaleOrderpreView } from "@/api/order"
@@ -296,4 +296,4 @@ export default () => {
         // </MoveBtn>
     )
 }
-// oninputEvent={(e, item) => { oninputEvent(e, item) }}
+// oninputEvent={(e, item) => { oninputEvent(e, item) }}

src/pages/shopping/index.tsx

@@ -1,9 +1,13 @@
 import { isEmptyObject } from '@/common/common'
 import { View } from '@tarojs/components'
+import Taro, { useDidShow } from '@tarojs/taro'
+import { useMemo } from 'react'
 
 const User = () => {
   const obj = {}
   console.log(isEmptyObject(obj))
+
+
   return <View>sdfasdfasdf</View>
 }
 export default User

src/pages/user/index.config.ts

@@ -4,5 +4,5 @@ export default definePageConfig({
   navigationBarBackgroundColor: '#4581FF',
   backgroundColor: '#4581FF',
   backgroundColorTop: '#4581FF',
-  enablePullDownRefresh: true
+  enablePullDownRefresh: true,
 })

src/pages/user/index.module.scss

@@ -1,5 +1,97 @@
-.main{
+page{
-  width: 100%;
+  position: relative;
-  min-height: 100vh;
+
-  background: linear-gradient(to bottom, $color_main 25%, $color_bg_one 42%);
+}
+.main {
+  background: linear-gradient(to bottom, $color_main 25%, $color_bg_one 42%);
+  padding: 24px;
+  padding-bottom: 0;
+  box-sizing: border-box;
+  overflow-y: scroll;
+  height: 100%;
+}
+.userAvatar {
+  position: relative;
+  width: 122px;
+  height: 122px;
+  border-radius: 50%;
+  background-color: #fff;
+  overflow: hidden;
+  &-text {
+    display: block;
+    width: 100%;
+    position: absolute;
+    left: 0;
+    bottom: 0;
+    height: 31px;
+    color: #fff;
+    text-align: center;
+    line-height: 31px;
+    font-size: 20px;
+    background-color: rgba($color: #000000, $alpha: 0.33);
+  }
+  
+}
+.topBar {
+  display: flex;
+  flex-flow: row nowrap;
+  justify-content: space-between;
+  align-items: center;
+  .left {
+  }
+  .middle {
+    margin: 0 40px;
+    flex: 1 1 auto;
+  }
+  .right {
+  }
+}
+.bottomBar {
+  display: flex;
+  flex-flow: row nowrap;
+  align-items: center;
+  border-radius: 16px;
+  background-color: #f6f6f6;
+  margin-top: 20px;
+  padding: 15px;
+}
+.username {
+  display: block;
+  font-size: 36px;
+  font-weight: 600;
+}
+.userno {
+  display: block;
+  font-size: 28px;
+  color: $color_font_two;
+}
+.userTitle {
+  color: #626262;
+  font-weight: 600;
+  font-size: $font_size_medium;
+  margin-left: 20px;
+}
+.grid-container{
+  display: grid;
+  grid-template-columns: 1fr 1fr 1fr 1fr;
+  grid-column-gap: 32px;
+  grid-row-gap: 32px;
+}
+.layoutTabBar {
+  display: flex;
+  flex-flow: row nowrap;
+  justify-content: space-between;
+  align-items: center;
+}
+.layoutTitle {
+  font-size: 32px;
+  font-weight: 600;
+  color: #333;
+  font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
+  margin-bottom: 20px;
+
+}
+.layoutDescription {
+  font-size: 24px;
+  color: $color_main;
 }

src/pages/user/index.tsx

@@ -1,27 +1,192 @@
 import { isEmptyObject } from '@/common/common'
-import { Button, View } from '@tarojs/components'
+import { Button, View, Image, Text } from '@tarojs/components'
-import { FC, memo, useState } from 'react'
+import { FC, memo, useMemo, useState } from 'react'
 import styles from './index.module.scss'
-const SonComp: FC = memo(() => {
+import defaultAvatar from '../../styles/image/defaultAvatar.png'
-  return <View className=''>我改变了吗{new Date().getTime()}</View>
+import NormalButton from '@/components/normalButton'
-})
+import Tag from '@/components/tag'
+import Divider from '@/components/Divider'
+import LayoutBlock from '@/components/layoutBlock'
+import IconCard from '@/components/iconCard'
+import IconFont from '@/components/iconfont'
+
+type IconfontName = Parameters<typeof IconFont>['0']['name']
+type IconCardType = {
+  iconName: IconfontName,
+  name: string,
+  path: string
+}
+
+// 用户信息
+const UserInfo: FC = () => {
+  const [userInfo, setUserInfo] = useState({
+    avatarUrl: '',
+    username: '',
+    userno: '',
+  })
+  
+
+  const feature: IconCardType[] = [
+    {
+      iconName: 'icon-lingquseka',
+      name: '领取色卡',
+      path: '',
+    },
+    {
+      iconName: 'icon-pandiansaoma',
+      name: '盘点扫码',
+      path: '',
+    },
+    {
+      iconName: 'icon-fahuoliebiao',
+      name: '发货列表',
+      path: '',
+    },
+    {
+      iconName: 'icon-yaoqingma',
+      name: '邀请码',
+      path: '',
+    },
+    {
+      iconName: 'icon-tihuoliebiao',
+      name: '提货列表',
+      path: '',
+    },
+    {
+      iconName: 'icon-shouhouzhongxin',
+      name: '退货退款',
+      path: '',
+    },
+    {
+      iconName: 'icon-shoukuanliebiao',
+      name: '收款列表',
+      path: '',
+    },
+    {
+      iconName: 'icon-shoukuanliebiao',
+      name: '客户列表',
+      path: '',
+    },
+  ]
+
+  const fabric: IconCardType[] = [
+    {
+      iconName: 'icon-yansequyang',
+      name: '颜色取样',
+      path: '',
+    },
+    {
+      iconName: 'icon-qusechazhao',
+      name: '取色查找',
+      path: '',
+    },
+    {
+      iconName: 'icon-yangpinduibi',
+      name: '样品对比',
+      path: '',
+    },
+  ]
+
+  const statisticAnalysis: IconCardType[] = [
+    {
+      iconName: 'icon-xiaoshou',
+      name: '销售',
+      path: '',
+    },
+    {
+      iconName: 'icon-duizhang',
+      name: '对账',
+      path: '',
+    },
+    {
+      iconName: 'icon-yuncangkucun',
+      name: '云仓库存',
+      path: '',
+    },
+    {
+      iconName: 'icon-qianzhicangkucun',
+      name: '前置仓库存',
+      path: '',
+    },
+  ]
+
+  const handleLogout = () => {}
+
+  return (
+    <>
+      <LayoutBlock circle>
+        <View className={styles.topBar}>
+          <View className={styles.left}>
+            <UserAvatar src={userInfo.avatarUrl} />
+          </View>
+          <View className={styles.middle}>
+            <Text className={styles.username}>杨子杰</Text>
+            <Text className={styles.userno}>064</Text>
+          </View>
+          <View className={styles.right}>
+            <NormalButton type='primary' circle size='normal' onClick={handleLogout}>
+              退出登录
+            </NormalButton>
+          </View>
+        </View>
+        <View className={styles.bottomBar}>
+          <Tag type='primary' size='normal' circle customStyle={{ marginRight: '10px' }}>
+            IT部门
+          </Tag>
+          <Divider direction='vertical'></Divider>
+          <Text className={styles.userTitle}>IT-开发总监</Text>
+        </View>
+      </LayoutBlock>
+      <LayoutBlock circle>
+        <View className={styles.layoutTitle}>功能特色</View>
+        <View className={styles['grid-container']}>
+          {feature.map((item) => {
+            return <IconCard iconName={item.iconName} title={item.name}></IconCard>
+          })}
+        </View>
+      </LayoutBlock>
+      <LayoutBlock circle>
+        <View className={styles.layoutTitle}>布料取色</View>
+        <View className={styles['grid-container']}>
+          {fabric.map((item) => {
+            return <IconCard iconName={item.iconName} title={item.name}></IconCard>
+          })}
+        </View>
+      </LayoutBlock>
+      <LayoutBlock circle>
+        <View className={styles.layoutTitle}>统计分析</View>
+        <View className={styles['grid-container']}>
+          {statisticAnalysis.map((item) => {
+            return <IconCard iconName={item.iconName} title={item.name}></IconCard>
+          })}
+        </View>
+      </LayoutBlock>
+      {/* <LayoutBlock circle>
+        <View className={styles.layoutTabBar}>
+          <View className={styles.layoutTitle}>客户列表</View>
+          <View className={styles.layoutDescription}>查看全部客户 ▶</View>
+        </View>
+        asdfasdfasdfas 
+      </LayoutBlock> */}
+    </>
+  )
+}
+// 用户头像
+const UserAvatar = ({ src }) => {
+  return (
+    <View className={styles.userAvatar}>
+      <Image className='full-100' src={src ? src : defaultAvatar} />
+      {src ? null : <Text className={styles['userAvatar-text']}>编辑</Text>}
+    </View>
+  )
+}
 
 // 我的
 const User = () => {
-  const obj = {}
-  console.log(isEmptyObject(obj))
-  const [count, setCount] = useState(0)
-  const handleCount = () => {
-    setCount((prev) => {
-      return prev + 1
-    })
-  }
   return (
     <>
-      <View className={styles['main']}>
+      <View className={styles.main}>
-        sdfasdfasdf {count}
+        <UserInfo />
-        <Button onClick={handleCount}>+1</Button>
-        <SonComp />
       </View>
     </>
   )

src/reducers/hooks.ts

@@ -1,10 +1,12 @@
 
 //该方法纯粹只是个Ts类型定义文件
 import { useSelector as useReduxSelector, TypedUseSelectorHook } from 'react-redux';
-import { DataParam } from './userInfo';
+import { DataParam as userInfoParam } from './userInfo';
 import { DataParam as commonDataParam } from './commonData';
+import { TabBarData as tabbarDataParam } from './tabBar';
 type Params = {
-    userInfo: DataParam,
+  userInfo: userInfoParam
-    commonData: commonDataParam
+  commonData: commonDataParam
+  tabBarData: tabbarDataParam
 }
-export const useSelector: TypedUseSelectorHook<Params> = useReduxSelector;
+export const useSelector: TypedUseSelectorHook<Params> = useReduxSelector;

src/reducers/index.ts

@@ -1,8 +1,18 @@
 import { combineReducers } from 'redux'
 import userInfo from './userInfo'
 import commonData from './commonData'
+import tabBarReducer from './tabBar'
 
-export default combineReducers({
+export type Reducers = {
-    userInfo,
+  userInfo: typeof userInfo
-    commonData
+  commonData: typeof commonData
-})
+  tabBarData: typeof tabBarReducer
+}
+
+export type ReducersKey = keyof Reducers
+
+export default combineReducers<Reducers>({
+  userInfo,
+  commonData,
+  tabBarData: tabBarReducer,
+})

src/reducers/tabBar.ts

@@ -0,0 +1,72 @@
+import { TabBarType } from '../constants/tabbar'
+import IconFont from '@/components/iconfont'
+
+type IconfontName = Parameters<typeof IconFont>['0']['name']
+
+type TabBarIndexMap = {
+  [Property: number]: {
+    id: number
+    pagePath: string
+    text: string
+    iconPath: IconfontName
+    selectedIconPath: IconfontName
+  }
+}
+
+
+const INITIAL_STATE = {
+  selectedId: 1,
+  tabItem: [
+    {
+      id: 1,
+      pagePath: '/pages/index/index',
+      text: '首页',
+      iconPath: 'icon-shouye1',
+      selectedIconPath: 'icon-shouye',
+    },
+    {
+      id: 2,
+      pagePath: '/pages/shopping/index',
+      text: '购物',
+      iconPath: 'icon-gouwu1',
+      selectedIconPath: 'icon-gouwu',
+    },
+    {
+      id: 3,
+      pagePath: '/pages/order/index',
+      text: '订单',
+      iconPath: 'icon-dingdan1',
+      selectedIconPath: 'icon-dingdan',
+    },
+    {
+      id: 4,
+      pagePath: '/pages/user/index',
+      text: '我的',
+      iconPath: 'icon-gerenzhongxin1',
+      selectedIconPath: 'icon-gerenzhongxin',
+    },
+  ],
+}
+
+export type TabBarData = {
+  selectedId: number
+  tabItem: TabBarIndexMap[number][]
+}
+
+export type TabBarAction = {
+  type: TabBarType
+  data: TabBarData
+}
+// TabBarReducer
+export default (state = INITIAL_STATE, action: TabBarAction) => {
+  const { type, data } = action
+  switch (type) {
+    case TabBarType.SET_SELECTED:
+      return {
+        ...state,
+        selectedId: data.selectedId,
+      }
+    default:
+      return state
+  }
+}

src/styles/common.scss

@@ -1,33 +1,44 @@
-
+$color_bg_one: #f8f8f8;
-$color_bg_one: #F8F8F8;
+$color_font_one: #3c3c3c;
-$color_font_one: #3C3C3C;
+$color_font_two: #ababab;
-$color_font_two: #ABABAB;
 $color_font_three: #707070;
-$color_main: #4581FF;
+$color_main: #4581ff;
+
+$color_danger: #e64340;
+$color_warning: #e6a23c;
+
+$opacity-disabled: 0.3;
+$borderStyle: solid;
+$borderColor: #ebebeb;
 
 $font_size_big: 32px;
 $font_size: 28px;
 $font_size_medium: 24px;
 $font_size_min: 22px;
 
+$customTabBarHeight: 100px;
+
+
 //安全底部距离
 .common_safe_area_y {
-    width: 100%;
+  width: 100%;
-    height: constant(safe-area-inset-bottom); /* 兼容 iOS < 11.2 */
+  height: constant(safe-area-inset-bottom); /* 兼容 iOS < 11.2 */
-    height: env(safe-area-inset-bottom); /* 兼容 iOS >= 11.2 */
+  height: env(safe-area-inset-bottom); /* 兼容 iOS >= 11.2 */
 }
 
 //省略号
-@mixin common_ellipsis($params:1) {
+@mixin common_ellipsis($params: 1) {
-    overflow: hidden;
+  overflow: hidden;
-    display: -webkit-box;
+  display: -webkit-box;
-    white-space:normal; 
+  white-space: normal;
-    text-overflow:ellipsis;
+  text-overflow: ellipsis;
-    word-break:break-all;
+  word-break: break-all;
-    -webkit-box-orient: vertical;
+  -webkit-box-orient: vertical;
-    -webkit-line-clamp: $params;
+  -webkit-line-clamp: $params;
-    
-    
 }
 
+.full-100 {
+  width: 100%;
+  height: 100%;
+}
 

src/styles/iconfont.scss

@@ -1,8 +1,9 @@
+/* CDN 服务仅供平台体验和调试使用，平台不承诺服务的稳定性，企业客户需下载字体包自行发布使用并做好备份。 */
 @font-face {
-  font-family: "iconfont";
+  font-family: 'iconfont';  /* Project id 3619513 */
-  /* Project id 2987621 */
+  src: url('//at.alicdn.com/t/c/font_3619513_g8r6ax9bp1n.woff2?t=1662609560991') format('woff2'),
-  src: url('iconfont.ttf?t=1661926630273') format('truetype');
+       url('//at.alicdn.com/t/c/font_3619513_g8r6ax9bp1n.woff?t=1662609560991') format('woff'),
-
+       url('//at.alicdn.com/t/c/font_3619513_g8r6ax9bp1n.ttf?t=1662609560991') format('truetype');
 }
 
 .iconfont {
@@ -13,222 +14,219 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
-.icon-A:before {
+.icon-yewuyuanqizi:before {
-  content: "\e6ea";
+  content: "\e639";
 }
 
-.icon-erweima:before {
+.icon-chakanquanbukehu:before {
-  content: "\e7b5";
+  content: "\e638";
 }
 
-.icon-xtianzhangqi:before {
+.icon-biyan:before {
-  content: "\e66a";
+  content: "\e637";
-}
-
-.icon-yucunkuan:before {
-  content: "\e66c";
-}
-
-.icon-a-tuikuanshouhou:before {
-  content: "\e65c";
-}
-
-.icon-yifahuo:before {
-  content: "\e65b";
-}
-
-.icon-daipeibu:before {
-  content: "\e662";
-}
-
-.icon-guanbi:before {
-  content: "\e641";
-}
-
-.icon-a-saoyisao2:before {
-  content: "\e613";
-}
-
-.icon-guanyuquse:before {
-  content: "\e635";
-}
-
-.icon-yangpinduibi:before {
-  content: "\e631";
-}
-
-.icon-lingquseka:before {
-  content: "\e632";
-}
-
-.icon-sehaochazhao:before {
-  content: "\e633";
-}
-
-.icon-jichuguanli:before {
-  content: "\e634";
-}
-
-.icon-yuncangkucun:before {
-  content: "\e630";
-}
-
-.icon-shangchuanzhaopian:before {
-  content: "\e62f";
-}
-
-.icon-zhushi:before {
-  content: "\e62d";
-}
-
-.icon-shenqingtuihuo:before {
-  content: "\e62e";
-}
-
-.icon-quxiaodingdanxiao:before {
-  content: "\e62c";
-}
-
-.icon-tuihuo1:before {
-  content: "\e62a";
-}
-
-.icon-a-fenqishangchengyifahuo:before {
-  content: "\e62b";
-}
-
-.icon-peibu:before {
-  content: "\e626";
-}
-
-.icon-dingdanbishu:before {
-  content: "\e627";
-}
-
-.icon-guanyufahuo:before {
-  content: "\e628";
-}
-
-.icon-tuihuo:before {
-  content: "\e629";
-}
-
-.icon-rili:before {
-  content: "\e625";
-}
-
-.icon-jiangpai:before {
-  content: "\e624";
-}
-
-.icon-xiaoshou:before {
-  content: "\e623";
-}
-
-.icon-cangkuguanli:before {
-  content: "\e61f";
-}
-
-.icon-zhibiaoduizhang:before {
-  content: "\e620";
-}
-
-.icon-a-tongji1:before {
-  content: "\e621";
-}
-
-.icon-shaixuan:before {
-  content: "\e622";
-}
-
-.icon-xiangxiagengduo:before {
-  content: "\e61e";
-}
-
-.icon-gongnengdingyi:before {
-  content: "\e61a";
-}
-
-.icon-rukuguanli:before {
-  content: "\e61b";
-}
-
-.icon-shenqing:before {
-  content: "\e61c";
-}
-
-.icon-kehuguanli:before {
-  content: "\e61d";
-}
-
-.icon-a-phone1:before {
-  content: "\e619";
-}
-
-.icon-a-saoyisao2:before {
-  content: "\e613";
-}
-
-.icon-ico_zhongyaofangguanli_zhongyaopandian:before {
-  content: "\e615";
-}
-
-.icon-seka:before {
-  content: "\e616";
-}
-
-.icon-xiaoshoutongji:before {
-  content: "\e617";
-}
-
-.icon-gengduo:before {
-  content: "\e618";
-}
-
-.icon-lajitong:before {
-  content: "\e60c";
-}
-
-.icon-jian:before {
-  content: "\e60b";
-}
-
-.icon-jia:before {
-  content: "\e60a";
-}
-
-.icon-a-tick1:before {
-  content: "\e609";
-}
-
-.icon-a-cuowuwrong:before {
-  content: "\e608";
-}
-
-.icon-more:before {
-  content: "\e606";
 }
 
 .icon-bianji:before {
-  content: "\e607";
+  content: "\e61e";
 }
 
-.icon-wode:before {
+.icon-daikuan:before {
-  content: "\e602";
+  content: "\e61f";
 }
 
-.icon-shangpinguanli:before {
+.icon-cangku:before {
-  content: "\e603";
+  content: "\e620";
 }
 
-.icon-dingdan:before {
+.icon-guanlidingdan:before {
+  content: "\e621";
+}
+
+.icon-mima:before {
+  content: "\e622";
+}
+
+.icon-guanbi:before {
+  content: "\e623";
+}
+
+.icon-jianshao:before {
+  content: "\e624";
+}
+
+.icon-dingwei:before {
+  content: "\e625";
+}
+
+.icon-saomiao:before {
+  content: "\e626";
+}
+
+.icon-peihuo:before {
+  content: "\e627";
+}
+
+.icon-shaixuan:before {
+  content: "\e628";
+}
+
+.icon-paiming:before {
+  content: "\e629";
+}
+
+.icon-shanchusousuoxinxi:before {
+  content: "\e62a";
+}
+
+.icon-shijian:before {
+  content: "\e62b";
+}
+
+.icon-sousuo:before {
+  content: "\e62c";
+}
+
+.icon-shouhou:before {
+  content: "\e62d";
+}
+
+.icon-sousuofanhui:before {
+  content: "\e62e";
+}
+
+.icon-sousuoshanchu:before {
+  content: "\e62f";
+}
+
+.icon-tuikuan:before {
+  content: "\e630";
+}
+
+.icon-tishi:before {
+  content: "\e631";
+}
+
+.icon-xianxiahuizong:before {
+  content: "\e632";
+}
+
+.icon-xinzeng:before {
+  content: "\e633";
+}
+
+.icon-yonghuming:before {
+  content: "\e634";
+}
+
+.icon-yanjing:before {
+  content: "\e635";
+}
+
+.icon-yufukuan:before {
+  content: "\e636";
+}
+
+.icon-wodekefu:before {
+  content: "\e60c";
+}
+
+.icon-dizhi:before {
+  content: "\e60d";
+}
+
+.icon-shouhouzhongxin:before {
+  content: "\e60e";
+}
+
+.icon-wodeshoucang:before {
+  content: "\e60f";
+}
+
+.icon-shoukuanliebiao:before {
+  content: "\e610";
+}
+
+.icon-madanguanli:before {
+  content: "\e611";
+}
+
+.icon-qusechazhao:before {
+  content: "\e612";
+}
+
+.icon-pandiansaoma:before {
+  content: "\e613";
+}
+
+.icon-yaoqingma:before {
+  content: "\e614";
+}
+
+.icon-duizhang:before {
+  content: "\e615";
+}
+
+.icon-tihuoliebiao:before {
+  content: "\e616";
+}
+
+.icon-yangpinduibi:before {
+  content: "\e617";
+}
+
+.icon-yansequyang:before {
+  content: "\e618";
+}
+
+.icon-fahuoliebiao:before {
+  content: "\e619";
+}
+
+.icon-yuncangkucun:before {
+  content: "\e61a";
+}
+
+.icon-xiaoshou:before {
+  content: "\e61b";
+}
+
+.icon-qianzhicangkucun:before {
+  content: "\e61c";
+}
+
+.icon-lingquseka:before {
+  content: "\e61d";
+}
+
+.icon-gouwu1:before {
+  content: "\e608";
+}
+
+.icon-dingdan1:before {
+  content: "\e609";
+}
+
+.icon-gerenzhongxin1:before {
+  content: "\e60a";
+}
+
+.icon-shouye1:before {
+  content: "\e60b";
+}
+
+.icon-gerenzhongxin:before {
   content: "\e604";
 }
 
-.icon-fenlei:before {
+.icon-dingdan:before {
   content: "\e605";
 }
 
-.icon-a-sousuo1:before {
+.icon-shouye:before {
-  content: "\e601";
+  content: "\e606";
-}
+}
+
+.icon-gouwu:before {
+  content: "\e607";
+}
+

yarn.lock

@@ -3514,6 +3514,13 @@ aws4@^1.8.0:
   resolved "https://registry.npmmirror.com/aws4/-/aws4-1.11.0.tgz#d61f46d83b2519250e2784daf5b09479a8b41c59"
   integrity sha512-xh1Rl34h6Fi1DC2WWKfxUTVqRsNnr6LsKz2+hfwDxQJWmrx8+c7ylaqBMcHfl1U1r2dsifOvKX3LQuLNZ+XSvA==
 
+axios@^0.19.0:
+  version "0.19.2"
+  resolved "https://registry.npmmirror.com/axios/-/axios-0.19.2.tgz#3ea36c5d8818d0d5f8a8a97a6d36b86cdc00cb27"
+  integrity sha512-fjgm5MvRHLhx+osE2xoekY70AhARk3a6hkN+3Io1jc00jtquGvxYlKlsFUhmUET0V5te6CcZI7lcv2Ym61mjHA==
+  dependencies:
+    follow-redirects "1.5.10"
+
 babel-code-frame@6.26.0, babel-code-frame@^6.26.0:
   version "6.26.0"
   resolved "https://registry.npmmirror.com/babel-code-frame/-/babel-code-frame-6.26.0.tgz#63fd43f7dc1e3bb7ce35947db8fe369a3f58c74b"
@@ -4800,6 +4807,11 @@ class-utils@^0.3.5:
     isobject "^3.0.0"
     static-extend "^0.1.1"
 
+classname@^0.0.0:
+  version "0.0.0"
+  resolved "https://registry.npmmirror.com/classname/-/classname-0.0.0.tgz#43d171b484e354c7a293a5b78004df6852db20d6"
+  integrity sha512-kkhsspEJdUW+VhuvNzb2sQf0KbafDPfd36dB1qf03Uu42dWZwMQzaQuyNkaRr5ir0ZiAN0+TlH/EOOfwb/aaXg==
+
 classnames@^2.2.5:
   version "2.3.1"
   resolved "https://registry.npmmirror.com/classnames/-/classnames-2.3.1.tgz#dfcfa3891e306ec1dad105d0e88f4417b8535e8e"
@@ -4936,6 +4948,11 @@ colorette@^2.0.10:
   resolved "https://registry.npmmirror.com/colorette/-/colorette-2.0.19.tgz#cdf044f47ad41a0f4b56b3a0d5b4e6e1a2d5a798"
   integrity sha512-3tlv/dIP7FWvj3BsbHrGLJ6l/oKh1O3TcgBqMn+yyCagOxc23fyzDS6HypQbgxWbkpDnf52p1LuR4eWDQ/K9WQ==
 
+colors@^1.3.3, colors@^1.4.0:
+  version "1.4.0"
+  resolved "https://registry.npmmirror.com/colors/-/colors-1.4.0.tgz#c50491479d4c1bdaed2c9ced32cf7c7dc2360f78"
+  integrity sha512-a+UqTh4kgZg/SlGvfbzDHpgRu7AAQOmmqRHJnxhRZICKFUT91brVhNNt58CMWU9PsBbv3PDCZUHbVxuDiH2mtA==
+
 combined-stream@^1.0.6, combined-stream@~1.0.6:
   version "1.0.8"
   resolved "https://registry.npmmirror.com/combined-stream/-/combined-stream-1.0.8.tgz#c3d45a8b34fd730631a110a8a2520682b31d5a7f"
@@ -5493,6 +5510,13 @@ debug@4.3.4, debug@^4.0.1, debug@^4.1.0, debug@^4.1.1, debug@^4.3.1, debug@^4.3.
   dependencies:
     ms "2.1.2"
 
+debug@=3.1.0, debug@~3.1.0:
+  version "3.1.0"
+  resolved "https://registry.npmmirror.com/debug/-/debug-3.1.0.tgz#5bb5a0672628b64149566ba16819e61518c67261"
+  integrity sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==
+  dependencies:
+    ms "2.0.0"
+
 debug@^3.0.0, debug@^3.2.6, debug@^3.2.7:
   version "3.2.7"
   resolved "https://registry.npmmirror.com/debug/-/debug-3.2.7.tgz#72580b7e9145fb39b6676f9c5e5fb100b934179a"
@@ -5500,13 +5524,6 @@ debug@^3.0.0, debug@^3.2.6, debug@^3.2.7:
   dependencies:
     ms "^2.1.1"
 
-debug@~3.1.0:
-  version "3.1.0"
-  resolved "https://registry.npmmirror.com/debug/-/debug-3.1.0.tgz#5bb5a0672628b64149566ba16819e61518c67261"
-  integrity sha512-OX8XqP7/1a9cqkxYw2yXss15f26NKWBpDXQd0/uK/KPqdQhxbPa994hnzjcE2VqQpDslf55723cKPUOGSmMY3g==
-  dependencies:
-    ms "2.0.0"
-
 debuglog@^1.0.1:
   version "1.0.1"
   resolved "https://registry.npmmirror.com/debuglog/-/debuglog-1.0.1.tgz#aa24ffb9ac3df9a2351837cfb2d279360cd78492"
@@ -6792,6 +6809,13 @@ flatted@^2.0.0:
   resolved "https://registry.npmmirror.com/flatted/-/flatted-2.0.2.tgz#4575b21e2bcee7434aa9be662f4b7b5f9c2b5138"
   integrity sha512-r5wGx7YeOwNWNlCA0wQ86zKyDLMQr+/RB8xy74M4hTphfmjlijTSSXGuH8rnvKZnfT9i+75zmd8jcKdMR4O6jA==
 
+follow-redirects@1.5.10:
+  version "1.5.10"
+  resolved "https://registry.npmmirror.com/follow-redirects/-/follow-redirects-1.5.10.tgz#7b7a9f9aea2fdff36786a94ff643ed07f4ff5e2a"
+  integrity sha512-0V5l4Cizzvqt5D44aTXbFZz+FtyXV1vrDN6qrelxtfYQKW0KO0W2T/hkE8xvGa/540LkZlkaUjO4ailYTFtHVQ==
+  dependencies:
+    debug "=3.1.0"
+
 follow-redirects@^1.0.0:
   version "1.15.1"
   resolved "https://registry.npmmirror.com/follow-redirects/-/follow-redirects-1.15.1.tgz#0ca6a452306c9b276e4d3127483e29575e207ad5"
@@ -7033,7 +7057,7 @@ glob@7.1.2:
     once "^1.3.0"
     path-is-absolute "^1.0.0"
 
-glob@^7.0.0, glob@^7.1.1, glob@^7.1.2, glob@^7.1.3, glob@^7.1.6:
+glob@^7.0.0, glob@^7.1.1, glob@^7.1.2, glob@^7.1.3, glob@^7.1.4, glob@^7.1.6:
   version "7.2.3"
   resolved "https://registry.npmmirror.com/glob/-/glob-7.2.3.tgz#b8df0fb802bbfa8e89bd1d938b4e16578ed44f2b"
   integrity sha512-nFR0zLpU2YCaRxwoCJvL6UvCH2JFyFVIvwTLsIf21AuHlMskA1hhTdk+LlYJtOlYt9v6dvszD2BGRqBL+iQK9Q==
@@ -7501,6 +7525,16 @@ human-signals@^2.1.0:
   resolved "https://registry.npmmirror.com/human-signals/-/human-signals-2.1.0.tgz#dc91fcba42e4d06e4abaed33b3e7a3c02f514ea0"
   integrity sha512-B4FFZ6q/T2jhhksgkbEW3HBvWIfDW85snkQgawt07S7J5QXTk6BkNV+0yAeZrM5QpMAdYlocGoljn0sJ/WQkFw==
 
+iconfont-parser@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.npmmirror.com/iconfont-parser/-/iconfont-parser-1.0.0.tgz#1fa61be02677005a9a014653ef2eeb7503c3538a"
+  integrity sha512-3RJceYHEjaqYyeDdfSAb1vP1x1Eb7ZtC9Xwetj+axm85sBlJU7HMvdNLVpwm/3g5eghYOdkQK+epUITZGAIqKQ==
+  dependencies:
+    axios "^0.19.0"
+    colors "^1.4.0"
+    tslib "^1.10.0"
+    xml2js "^0.4.22"
+
 iconv-lite@0.4.24, iconv-lite@^0.4.24:
   version "0.4.24"
   resolved "https://registry.npmmirror.com/iconv-lite/-/iconv-lite-0.4.24.tgz#2022b4b25fbddc21d2f524974a474aafe733908b"
@@ -9023,6 +9057,20 @@ mini-css-extract-plugin@2.4.6:
   dependencies:
     schema-utils "^4.0.0"
 
+mini-program-iconfont-cli@0.6.1:
+  version "0.6.1"
+  resolved "https://registry.npmmirror.com/mini-program-iconfont-cli/-/mini-program-iconfont-cli-0.6.1.tgz#61d08cf05bf5a51c82a75c4afcf77224e20ed06c"
+  integrity sha512-69FsU+tSevwmHBiL55535Hfh1q0ciRpNyYtiTBZw2bvw9lvW3N/SCTg395P0rkisWMqf1Ki9VYIWeaONvNWy2Q==
+  dependencies:
+    axios "^0.19.0"
+    colors "^1.3.3"
+    fs-extra "^8.1.0"
+    glob "^7.1.4"
+    minimist "^1.2.5"
+    mkdirp "^0.5.1"
+    tslib "^1.10.0"
+    xml2js "^0.4.19"
+
 minimalistic-assert@^1.0.0:
   version "1.0.1"
   resolved "https://registry.npmmirror.com/minimalistic-assert/-/minimalistic-assert-1.0.1.tgz#2e194de044626d4a10e7f7fbc00ce73e83e4d5c7"
@@ -10610,6 +10658,19 @@ react-dom@^18.2.0:
     loose-envify "^1.1.0"
     scheduler "^0.23.0"
 
+react-iconfont-cli@2.0.2:
+  version "2.0.2"
+  resolved "https://registry.npmmirror.com/react-iconfont-cli/-/react-iconfont-cli-2.0.2.tgz#547d872e5d76796230877176e397bc6ed3337467"
+  integrity sha512-43NP+dsk08XwJf8oXfrDwHk1WeE76vy1Xzbd2zz7WjjxsdblF9h/oalFMPclZSibIirwsckz3L0IV+42Yu//iQ==
+  dependencies:
+    colors "^1.3.3"
+    glob "^7.1.4"
+    iconfont-parser "^1.0.0"
+    lodash "^4.17.15"
+    minimist "^1.2.5"
+    mkdirp "^0.5.1"
+    tslib "^1.10.0"
+
 react-is@^16.13.1, react-is@^16.7.0:
   version "16.13.1"
   resolved "https://registry.npmmirror.com/react-is/-/react-is-16.13.1.tgz#789729a4dc36de2999dc156dd6c1d9c18cea56a4"
@@ -10620,6 +10681,19 @@ react-is@^18.0.0:
   resolved "https://registry.npmmirror.com/react-is/-/react-is-18.2.0.tgz#199431eeaaa2e09f86427efbb4f1473edb47609b"
   integrity sha512-xWGDIW6x921xtzPkhiULtthJHoJvBbF3q26fzloPCK0hsvxtPVelvftw3zjbHWSkR2km9Z+4uxbDDK/6Zw9B8w==
 
+react-native-iconfont-cli@2.2.4:
+  version "2.2.4"
+  resolved "https://registry.npmmirror.com/react-native-iconfont-cli/-/react-native-iconfont-cli-2.2.4.tgz#9bc3b18653105950646f8e5f5fcde9f8835d76f3"
+  integrity sha512-qTjfHG2f/sc3/YKWZJvIJk/SwiTu8C9/SvtoLxRX+GM/6pvOJq0ge6rcV3vTh4s3QJDuNDOD6+a4hGD6vv2vSg==
+  dependencies:
+    colors "^1.3.3"
+    glob "^7.1.4"
+    iconfont-parser "^1.0.0"
+    lodash "^4.17.15"
+    minimist "^1.2.5"
+    mkdirp "^0.5.1"
+    tslib "^1.10.0"
+
 react-reconciler@0.27.0:
   version "0.27.0"
   resolved "https://registry.npmmirror.com/react-reconciler/-/react-reconciler-0.27.0.tgz#360124fdf2d76447c7491ee5f0e04503ed9acf5b"
@@ -12204,6 +12278,21 @@ taro-css-to-react-native@3.3.10:
     css-mediaquery "^0.1.2"
     postcss-value-parser "^3.3.0"
 
+taro-iconfont-cli@^3.3.0:
+  version "3.3.0"
+  resolved "https://registry.npmmirror.com/taro-iconfont-cli/-/taro-iconfont-cli-3.3.0.tgz#b4d3f83598099d84bdc61435cadf4a8a584a29d7"
+  integrity sha512-lkZE/zaL0J3a6ymlUp1sMBiM8krJkDh0ZsrzB5FM2IGdgQO1/4Vs7N2hzTEVZ7EZoV/6hBqL0YwzTXg4MpuJMg==
+  dependencies:
+    colors "^1.4.0"
+    fs-extra "^8.1.0"
+    iconfont-parser "^1.0.0"
+    mini-program-iconfont-cli "0.6.1"
+    minimist "^1.2.5"
+    mkdirp "^0.5.1"
+    react-iconfont-cli "2.0.2"
+    react-native-iconfont-cli "2.2.4"
+    tslib "^2.3.1"
+
 tarojs@^2.1.1:
   version "2.1.1"
   resolved "https://registry.npmmirror.com/tarojs/-/tarojs-2.1.1.tgz#d56b50608b01de4efd6f245ecbf8cc3cd632173f"
@@ -12404,7 +12493,7 @@ tslib@^1.10.0, tslib@^1.8.1, tslib@^1.9.0:
   resolved "https://registry.npmmirror.com/tslib/-/tslib-1.14.1.tgz#cf2d38bdc34a134bcaf1091c41f6619e2f672d00"
   integrity sha512-Xni35NKzjgMrwevysHTCArtLDpPvye8zV/0E4EyYn43P7/7qvQwPh9BGkHewbMulVntbigmcT7rdX3BNo9wRJg==
 
-tslib@^2.0.3, tslib@^2.3.0:
+tslib@^2.0.3, tslib@^2.3.0, tslib@^2.3.1:
   version "2.4.0"
   resolved "https://registry.npmmirror.com/tslib/-/tslib-2.4.0.tgz#7cecaa7f073ce680a05847aa77be941098f36dc3"
   integrity sha512-d6xOpEDfsi2CZVlPQzGeux8XMwLT9hssAsaPYExaQMuYskwb+x1x7J371tWlbBdWHroy99KnVB6qIkUbs5X3UQ==
@@ -13148,7 +13237,7 @@ xml-parse-from-string@^1.0.0:
   resolved "https://registry.npmmirror.com/xml-parse-from-string/-/xml-parse-from-string-1.0.1.tgz#a9029e929d3dbcded169f3c6e28238d95a5d5a28"
   integrity sha512-ErcKwJTF54uRzzNMXq2X5sMIy88zJvfN2DmdoQvy7PAFJ+tPRU6ydWuOKNMyfmOjdyBQTFREi60s0Y0SyI0G0g==
 
-xml2js@^0.4.19, xml2js@^0.4.5:
+xml2js@^0.4.19, xml2js@^0.4.22, xml2js@^0.4.5:
   version "0.4.23"
   resolved "https://registry.npmmirror.com/xml2js/-/xml2js-0.4.23.tgz#a0c69516752421eb2ac758ee4d4ccf58843eac66"
   integrity sha512-ySPiMjM0+pLDftHgXY4By0uswI3SPKLDw/i3UXbnO8M/p28zqexCUoPmQFrYD+/1BzhGJSs2i1ERWKJAtiLrug==