uniapp路由生成demo

.gitignore

+.DS_Store
+node_modules/
+unpackage/
+dist/
+
+# local env files
+.env.local
+.env.*.local
+
+# Log files
+npm-debug.log*
+yarn-debug.log*
+yarn-error.log*
+
+# Editor directories and files
+.project
+.idea
+.vscode
+*.suo
+*.ntvs*
+*.njsproj
+*.sln
+*.sw*

.hbuilderx/launch.json

+{ // launch.json 配置了启动调试时相关设置，configurations下节点名称可为 app-plus/h5/mp-weixin/mp-baidu/mp-alipay/mp-qq/mp-toutiao/mp-360/
+  // launchtype项可配置值为local或remote, local代表前端连本地云函数，remote代表前端连云端云函数
+    "version": "0.0",
+    "configurations": [{
+     	"default" : 
+     	{
+     		"launchtype" : "local"
+     	},
+     	"h5" : 
+     	{
+     		"launchtype" : "local"
+     	},
+     	"mp-weixin" : 
+     	{
+     		"launchtype" : "local"
+     	},
+     	"type" : "uniCloud"
+     }
+    ]
+}

README.md

+控制台运行--node routers/build.js命令，自动生成page.json文件。
+
+# my-project
+
+## Project setup
+```
+yarn install
+```
+
+### Compiles and hot-reloads for development
+```
+yarn serve
+```
+
+### Compiles and minifies for production
+```
+yarn build
+```
+
+### Customize configuration
+See [Configuration Reference](https://cli.vuejs.org/config/).
+
+### 路由
+
+| 页面名称 | 对应路由文件 | 参数 | tab页 | 备注 | 静态 | 数据渲染 |
+| -------- | ------------ | ---- | :---: | :---- | :---- | :---- |
+| 首页 |  pages/home/index|  | √ | 完成 | 完成 |  |

babel.config.js

+const plugins = []
+
+if (process.env.UNI_OPT_TREESHAKINGNG) {
+  plugins.push(require('@dcloudio/vue-cli-plugin-uni-optimize/packages/babel-plugin-uni-api/index.js'))
+}
+
+if (
+  (
+    process.env.UNI_PLATFORM === 'app-plus' &&
+    process.env.UNI_USING_V8
+  ) ||
+  (
+    process.env.UNI_PLATFORM === 'h5' &&
+    process.env.UNI_H5_BROWSER === 'builtin'
+  )
+) {
+  const path = require('path')
+
+  const isWin = /^win/.test(process.platform)
+
+  const normalizePath = path => (isWin ? path.replace(/\\/g, '/') : path)
+
+  const input = normalizePath(process.env.UNI_INPUT_DIR)
+  try {
+    plugins.push([
+      require('@dcloudio/vue-cli-plugin-hbuilderx/packages/babel-plugin-console'),
+      {
+        file (file) {
+          file = normalizePath(file)
+          if (file.indexOf(input) === 0) {
+            return path.relative(input, file)
+          }
+          return false
+        }
+      }
+    ])
+  } catch (e) {}
+}
+
+process.UNI_LIBRARIES = process.UNI_LIBRARIES || ['@dcloudio/uni-ui']
+process.UNI_LIBRARIES.forEach(libraryName => {
+  plugins.push([
+    'import',
+    {
+      'libraryName': libraryName,
+      'customName': (name) => {
+        return `${libraryName}/lib/${name}/${name}`
+      }
+    }
+  ])
+})
+module.exports = {
+  presets: [
+    [
+      '@vue/app',
+      {
+        modules: 'commonjs',
+        useBuiltIns: process.env.UNI_PLATFORM === 'h5' ? 'usage' : 'entry'
+      }
+    ]
+  ],
+  plugins
+}

package.json

+{
+  "name": "my-project",
+  "version": "0.1.0",
+  "private": true,
+  "scripts": {
+	"pages": "node ./src/routers/build.js",
+    "serve": "npm run dev:h5",
+    "build": "npm run build:h5",
+    "build:app-plus": "cross-env NODE_ENV=production UNI_PLATFORM=app-plus vue-cli-service uni-build",
+    "build:custom": "cross-env NODE_ENV=production uniapp-cli custom",
+    "build:h5": "cross-env NODE_ENV=production UNI_PLATFORM=h5 vue-cli-service uni-build",
+    "build:mp-360": "cross-env NODE_ENV=production UNI_PLATFORM=mp-360 vue-cli-service uni-build",
+    "build:mp-alipay": "cross-env NODE_ENV=production UNI_PLATFORM=mp-alipay vue-cli-service uni-build",
+    "build:mp-baidu": "cross-env NODE_ENV=production UNI_PLATFORM=mp-baidu vue-cli-service uni-build",
+    "build:mp-qq": "cross-env NODE_ENV=production UNI_PLATFORM=mp-qq vue-cli-service uni-build",
+    "build:mp-toutiao": "cross-env NODE_ENV=production UNI_PLATFORM=mp-toutiao vue-cli-service uni-build",
+    "build:mp-weixin": "cross-env NODE_ENV=production UNI_PLATFORM=mp-weixin vue-cli-service uni-build",
+    "build:quickapp-native": "cross-env NODE_ENV=production UNI_PLATFORM=quickapp-native vue-cli-service uni-build",
+    "build:quickapp-webview": "cross-env NODE_ENV=production UNI_PLATFORM=quickapp-webview vue-cli-service uni-build",
+    "build:quickapp-webview-huawei": "cross-env NODE_ENV=production UNI_PLATFORM=quickapp-webview-huawei vue-cli-service uni-build",
+    "build:quickapp-webview-union": "cross-env NODE_ENV=production UNI_PLATFORM=quickapp-webview-union vue-cli-service uni-build",
+    "dev:app-plus": "cross-env NODE_ENV=development UNI_PLATFORM=app-plus vue-cli-service uni-build --watch",
+    "dev:custom": "cross-env NODE_ENV=development uniapp-cli custom",
+    "dev:h5": "cross-env NODE_ENV=development UNI_PLATFORM=h5 vue-cli-service uni-serve",
+    "dev:mp-360": "cross-env NODE_ENV=development UNI_PLATFORM=mp-360 vue-cli-service uni-build --watch",
+    "dev:mp-alipay": "cross-env NODE_ENV=development UNI_PLATFORM=mp-alipay vue-cli-service uni-build --watch",
+    "dev:mp-baidu": "cross-env NODE_ENV=development UNI_PLATFORM=mp-baidu vue-cli-service uni-build --watch",
+    "dev:mp-qq": "cross-env NODE_ENV=development UNI_PLATFORM=mp-qq vue-cli-service uni-build --watch",
+    "dev:mp-toutiao": "cross-env NODE_ENV=development UNI_PLATFORM=mp-toutiao vue-cli-service uni-build --watch",
+    "dev:mp-weixin": "cross-env NODE_ENV=development UNI_PLATFORM=mp-weixin vue-cli-service uni-build --watch",
+    "dev:quickapp-native": "cross-env NODE_ENV=development UNI_PLATFORM=quickapp-native vue-cli-service uni-build --watch",
+    "dev:quickapp-webview": "cross-env NODE_ENV=development UNI_PLATFORM=quickapp-webview vue-cli-service uni-build --watch",
+    "dev:quickapp-webview-huawei": "cross-env NODE_ENV=development UNI_PLATFORM=quickapp-webview-huawei vue-cli-service uni-build --watch",
+    "dev:quickapp-webview-union": "cross-env NODE_ENV=development UNI_PLATFORM=quickapp-webview-union vue-cli-service uni-build --watch",
+    "info": "node node_modules/@dcloudio/vue-cli-plugin-uni/commands/info.js",
+    "serve:quickapp-native": "node node_modules/@dcloudio/uni-quickapp-native/bin/serve.js",
+    "test:android": "cross-env UNI_PLATFORM=app-plus UNI_OS_NAME=android jest -i",
+    "test:h5": "cross-env UNI_PLATFORM=h5 jest -i",
+    "test:ios": "cross-env UNI_PLATFORM=app-plus UNI_OS_NAME=ios jest -i",
+    "test:mp-baidu": "cross-env UNI_PLATFORM=mp-baidu jest -i",
+    "test:mp-weixin": "cross-env UNI_PLATFORM=mp-weixin jest -i"
+  },
+  "dependencies": {
+    "@dcloudio/uni-app-plus": "^2.0.0-28820200820001",
+    "@dcloudio/uni-h5": "^2.0.0-28820200820001",
+    "@dcloudio/uni-helper-json": "*",
+    "@dcloudio/uni-mp-360": "^2.0.0-28820200820001",
+    "@dcloudio/uni-mp-alipay": "^2.0.0-28820200820001",
+    "@dcloudio/uni-mp-baidu": "^2.0.0-28820200820001",
+    "@dcloudio/uni-mp-qq": "^2.0.0-28820200820001",
+    "@dcloudio/uni-mp-toutiao": "^2.0.0-28820200820001",
+    "@dcloudio/uni-mp-vue": "^2.0.0-28820200820001",
+    "@dcloudio/uni-mp-weixin": "^2.0.0-28820200820001",
+    "@dcloudio/uni-quickapp-native": "^2.0.0-28820200820001",
+    "@dcloudio/uni-quickapp-webview": "^2.0.0-28820200820001",
+    "@dcloudio/uni-stat": "^2.0.0-28820200820001",
+    "@vue/shared": "^3.0.0-rc.4",
+    "core-js": "^3.6.5",
+    "flyio": "^0.6.2",
+    "regenerator-runtime": "^0.12.1",
+    "vue": "^2.6.11",
+    "vuex": "^3.2.0"
+  },
+  "devDependencies": {
+    "@dcloudio/types": "*",
+    "@dcloudio/uni-automator": "^2.0.0-28820200820001",
+    "@dcloudio/uni-cli-shared": "^2.0.0-28820200820001",
+    "@dcloudio/uni-migration": "^2.0.0-28820200820001",
+    "@dcloudio/uni-template-compiler": "^2.0.0-28820200820001",
+    "@dcloudio/vue-cli-plugin-hbuilderx": "^2.0.0-28820200820001",
+    "@dcloudio/vue-cli-plugin-uni": "^2.0.0-28820200820001",
+    "@dcloudio/vue-cli-plugin-uni-optimize": "^2.0.0-28820200820001",
+    "@dcloudio/webpack-uni-mp-loader": "^2.0.0-28820200820001",
+    "@dcloudio/webpack-uni-pages-loader": "^2.0.0-28820200820001",
+    "@vue/cli-plugin-babel": "~4.5.0",
+    "@vue/cli-service": "~4.5.0",
+    "babel-plugin-import": "^1.11.0",
+    "cross-env": "^7.0.2",
+    "jest": "^25.4.0",
+    "mini-types": "*",
+    "miniprogram-api-typings": "*",
+    "postcss-comment": "^2.0.0",
+    "vue-template-compiler": "^2.6.11",
+    "less": "^3.9.0",
+    "less-loader": "^4.1.0",
+    "node-sass": "^4.11.0",
+    "sass-loader": "^7.1.0"
+  },
+  "browserslist": [
+    "Android >= 4",
+    "ios >= 8"
+  ],
+  "uni-app": {
+    "scripts": {}
+  }
+}

postcss.config.js

+const path = require('path')
+
+
+module.exports = {
+  parser: require('postcss-comment'),
+  plugins: [
+    require('postcss-import')({
+      resolve (id, basedir, importOptions) {
+        if (id.startsWith('~@/')) {
+          return path.resolve(process.env.UNI_INPUT_DIR, id.substr(3))
+        } else if (id.startsWith('@/')) {
+          return path.resolve(process.env.UNI_INPUT_DIR, id.substr(2))
+        } else if (id.startsWith('/') && !id.startsWith('//')) {
+          return path.resolve(process.env.UNI_INPUT_DIR, id.substr(1))
+        }
+        return id
+      }
+    }),
+    require('autoprefixer')({
+      remove: process.env.UNI_PLATFORM !== 'h5'
+    }),
+    require('@dcloudio/vue-cli-plugin-uni/packages/postcss')
+  ]
+}

public/index.html

+<!DOCTYPE html>
+<html lang="zh-CN">
+
+    <head>
+        <meta charset="utf-8">
+        <meta http-equiv="X-UA-Compatible" content="IE=edge">
+        <title>
+            <%= htmlWebpackPlugin.options.title %>
+        </title>
+        <script>
+            document.addEventListener('DOMContentLoaded', function() {
+                document.documentElement.style.fontSize = document.documentElement.clientWidth / 20 + 'px'
+            })
+            var coverSupport = 'CSS' in window && typeof CSS.supports === 'function' && (CSS.supports('top: env(a)') || CSS.supports('top: constant(a)'))
+            document.write('<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0' + (coverSupport ? ', viewport-fit=cover' : '') + '" />')
+        </script>
+        <link rel="stylesheet" href="<%= BASE_URL %>static/index.<%= VUE_APP_INDEX_CSS_HASH %>.css" />
+    </head>
+
+    <body>
+        <noscript>
+            <strong>Please enable JavaScript to continue.</strong>
+        </noscript>
+        <div id="app"></div>
+        <!-- built files will be auto injected -->
+    </body>
+
+</html>
\ No newline at end of file

src/App.vue

+<script>
+    export default {
+        onLaunch: function() {
+            console.log('App Launch')
+        },
+        onShow: function() {
+            console.log('App Show')
+        },
+        onHide: function() {
+            console.log('App Hide')
+        }
+    }
+</script>
+
+<style lang="scss">
+    @import url("@/components/u-parse/u-parse.css");
+    /*@import '~@/assets/styles/mixins.scss';        !*Mixins指令*!*/
+    @import '~@/assets/styles/quill.core.min.css'; /*富文本编辑器默认样式*/
+    @import '~@/assets/styles/base.css'; /*基础样式*/
+    /*@import url("~mpvue-wxparse/src/wxParse.css");*/
+    /*@import '~@/assets/font/iconfont.css';         !*图标字体*!*/
+  // uni-radio .uni-radio-input.uni-radio-input-checked{
+	 //  border: none !important;
+	 //  background-color: none !important;
+  // }
+  // uni-radio .uni-radio-input.uni-radio-input-checked::before{
+  // 	  background-color: none !important;
+  // }
+  radio .wx-radio-input{
+    border: none;
+	width: 32rpx;
+	height: 32rpx;
+  }
+radio .wx-radio-input.wx-radio-input-checked {
+  background: none !important;
+  border: none;
+}
+  radio .wx-radio-input.wx-radio-input-checked::before{
+	 color: red; /* 对勾颜色 白色 */
+  }
+
+  ::-webkit-scrollbar{
+	  display: none;
+  }
+</style>

src/api/account.js

+import fly from '../jslibs/dk-flyio'
+
+export const login = data => fly.request('/mini/account/register', data, { method: 'POST' })

src/api/activity.js

+/* eslint-disable import/prefer-default-export */
+import fly from '@/jslibs/dk-flyio'
+
+const qs = require('qs')
+
+// 获取活动列表
+export const getActivityList = params => fly.get('mini/activity/activities', params)
+// 轮播图列表
+export const getActivityBanners = params => fly.get('mini/activity/banners', params)
+// 活动详情
+export const getActivityDetails = params => fly.get(`/mini/activity/details/${params}`)
+// 项目列表
+export const getProjectList = params => fly.get('mini/activity/region-activity/projects', params)
+export const getProjectTemp = params => fly.get('mini/activity/projects-temp', params)
+// 收藏/取消
+export const upCollect = params => fly.put('mini/activity/user/collect', qs.stringify(params))
+// 评论列表
+export const getCommonList = params => fly.get('mini/activity/leave-notes', params)
+// 评论点赞
+export const onUserLikes = params => fly.post('mini/activity/activity-apply-user-likes', params)
+// 评论详情
+export const getCommonDetails = params => fly.get(`mini/activity/leave-notes/${params}`)
+// 发表评论
+export const sendCommon = params => fly.post('mini/activity/activity-leave-notes', params)
+// 相册列表
+export const getPictureList = params => fly.get('mini/activity/leave-picture', params)
+// 发布相册
+export const sendPicture = params => fly.post('/mini/activity/activity-picture-list', params)
+// 报名活动详情
+export const getUserActivitiesDetail = params => fly.get(`mini/activity/apply-user-details/activity-uuid/${params}`)
+// 确认报名
+export const applyUser = params => fly.post('mini/activity/activity-apply-user', params)
+// 修改报名
+export const upApplyUser = params => fly.put('mini/activity/activity-apply-user', params)
+// 取消报名
+export const cancelApply = params => fly.put('mini/activity/user/cancel', qs.stringify(params))
+// 收藏活动列表
+export const getCollectList = params => fly.get('mini/account/user-collect-activities', params)
+// 活动报名列表
+export const getApplyList = params => fly.get('mini/account/user-apply-activities', params)
+// 活动报名取消理由
+export const getApplyReasonList = params => fly.get('/mini/activity/cancel-reasons', params)
+// 用户签到
+export const userSignIn = params => fly.put('mini/activity/user/sign-in', qs.stringify(params))
+// 相册点赞
+export const getlikepicture = params => fly.put(`mini/activity/user/like-picture?${params}`)
+// 活动问卷详情
+export const getFormDetails = params => fly.get(`mini/activity/form-details/${params}`)
+// 提交问卷
+export const sendFormDetails = params => fly.post('mini/activity/form-user-record', params)
+// 优惠券
+export const getCouponsList = params => fly.get('mini/activity/coupons', params)
+// 用户推送优惠券
+export const pushMessage = params => fly.get(`mini/account/user-push-message/${params}`)
+// 删除相册
+export const deletePhoto = params => fly.delete(`/mini/activity/activity-picture-temp/${params}`)
+// 浮窗
+export const getTips = params => fly.get('/mini/activity/banners/type', params)
+// 获取轮播图信息（视频）
+export const getBannerVideo = params => fly.get('/mini/merchant/user/merchant-banner/banner-type', params)
+// 获取闸机icon
+export const getGateType = params => fly.get(`/mini/activity/banners/gate-type/${params}`)

src/api/grade.js

+/* eslint-disable import/prefer-default-export */
+import fly from '@/jslibs/dk-flyio'
+
+// 获取会员等级列表
+export const getUserGradeList = () => fly.get('/mini/user-score/member-grade')
+// 用户积分明细
+export const getUserScoresList = params => fly.get('mini/user-score/user-scores', params)
+// 任务列表
+export const getUserTaskTypes = () => fly.get('mini/user-score/task-types')
+// 任务详情
+export const getUserScoreDetail = params => fly.get('mini/user-score/detail', params)
+// 会员等级
+export const getUserMemberGrade = params => fly.get(`/mini/user-score/member-grade/detail/${params}`)
+// 完成任务
+export const finishUserTask = params => fly.get(`mini/user-score/finish-task/${params}`)
+// 推荐同事背景图
+export const getRecommendDetails = () => fly.get('/mini/account/recommend-detail')
+// 会员规则详情
+export const getUserGradeDetails = () => fly.get('/mini/user-score/member-grade-detail')
+// 刷新二维码
+export const refreshQrcode = () => fly.get('/mini/account/refresh-recommend-detail')

src/api/login.js

+/* eslint-disable */
+import fly from '@/jslibs/dk-flyio'
+
+// 获取七牛token
+export const getUpdateToken = () => fly.get('mini/common/qiniu')
+// 用户注册
+export const getminiRegister = params => fly.post('mini/account/register', params)
+// 绑定手机号
+export const getbindPhone = params => fly.post('mini/account/register/phone', params)
+// 用户认证
+export const getminiStaff = params => fly.post('mini/account/staff', params)
+// 发送验证码
+export const sendPhone = params => fly.get('/mini/common/phone/send', params)
+// 校验验证码
+export const checkPhoneCode = params => fly.post('mini/common/phone/verify-code', params)
+// 员工认证详情
+export const getStaffDetails = () => fly.get('mini/account/staff-details')
+// 员工详情
+export const getUserInfo = () => fly.get('mini/account/user-details')
+// 公司列表
+export const getCompanyList = params => fly.get('mini/account/companies', params)
+// 公司详情
+export const getCompanyDetails = params => fly.get(`/mini/account/company-details/${params}`)
+// 获取用户formid
+export const getUserFormId = params => fly.post(`mini/common/from-id?fromId=${params}`)
+// 推荐同事
+export const recommendUser = params => fly.get('/mini/account/recommend-user', params)
+// 检验员工手机号码是否可激活
+export const staffPhoneVerify = params => fly.get(`/mini/account/staff-phone-verify/${params}`)
+// 激活
+export const staffPhoneActivate = params => fly.get(`/mini/account/staff-phone-activate/${params}`)
+// 验证公司邀请码
+export const checkCompanyInvite = params => fly.get('/mini/account/company-details', params)
+// 退出公司
+export const signOutCompany = () => fly.get('/mini/account/quit-company')

src/api/merchants.js

+/* eslint-disable import/prefer-default-export */
+import fly from '@/jslibs/dk-flyio'
+
+const qs = require('qs')
+
+// 获取商家列表
+export const getMerchantsList = params => fly.get('mini/merchant/merchants', params)
+// 获取商家分类
+export const getMerchantType = params => fly.get('mini/merchant/merchant-type', params)
+// 获取优惠列表
+export const getCouponsType = params => fly.get('mini/merchant/coupons-type', params)
+// 商家详情
+export const getMerchantDetail = params => fly.get(`mini/merchant/details/${params}`)
+// 使用商家优惠
+export const recordMerchant = params => fly.put('mini/merchant/user/merchant-record', qs.stringify(params))
+// 商家记录列表
+export const getUserRecordList = params => fly.get('mini/account/user-merchants-record', params)
+// 获取首页轮播图
+export const getMerchantIndexImg = params => fly.get('/mini/merchant/user/merchant-banner', params)
+// 获取模块信息
+export const getMerchantModel = params => fly.get(`/mini/merchant/user/merchant-model/${params}`)
+// 获取榜单列表
+export const getRankingList = params => fly.get('/mini/merchant/user/merchant-ranking', params)
+// 获取商家信息
+export const getUserMerchants = params => fly.get('/mini/merchant/user/merchants', params)
+// 获取详情轮播图
+export const getMerchantDetailImg = params => fly.get('/mini/merchant/user/model-banners', params)
+// 获取区域项目列表
+export const getProjectsList = params => fly.get('/mini/activity/region/projects', params)

src/api/sample.js

+/* eslint-disable import/prefer-default-export */
+import fly from '@/jslibs/dk-flyio'
+
+export const getList = data => fly.request('app/Carousel', data, { method: 'GET' })

src/api/sign.js

+/* eslint-disable import/prefer-default-export */
+import fly from '@/jslibs/dk-flyio'
+
+// 用户签到
+export const signIn = () => fly.get('/mini/user-sign-in/sign-in')
+// 签到规则
+export const signRule = params => fly.get(`/mini/user-sign-in/sign-in-rule/${params}`)
+// 签到信息
+export const signUserInfo = () => fly.get('/mini/user-sign-in/sign-in-info')
+// 签到明细
+export const signBonusDetails = params => fly.get('/mini/user-sign-in/sign-in-records', params)
+// 签到说明
+export const signRemark = params => fly.get(`/mini/user-score/sundries/detail/${params}`)

src/api/user.js

+import fly from '@/jslibs/dk-flyio'
+
+// 我的数据
+export const getuserData = data => fly.request(
+  'mini/account/user-details',
+  data,
+  {
+    method: 'GET',
+  },
+)
+// 关于我们
+export const getaboutDetails = data => fly.request(
+  'mini/account/about-details',
+  data,
+  {
+    method: 'GET',
+  },
+)
+// 关于我们
+export const getuserInfo = data => fly.request(
+  'mini/account/user-info',
+  data,
+  {
+    method: 'PUT',
+  },
+)
+// 获取员工认证详情并激活员工
+export const getstaffdetail = phone => fly.request(
+  `/mini/account/staff-detail/${phone}`,
+  {
+    method: 'GET',
+  },
+)
+// 获取员工认证详情并激活员工
+export const getstaffdetail2 = data => fly.request(
+  '/mini/account/staff-details',
+  data,
+  {
+    method: 'GET',
+  },
+)
+export const getPhoneCode = params => fly.get('/mini/common/phone/normal-send', params)
+// 获取评论数
+export const getUsersUnread = () => fly.get('/mini/account/users-unread')
+// 评论回复通知列表
+export const getUsersComment = params => fly.get('/mini/account/users-comment', params)
+// 评论设为已读
+export const upNoticeRead = params => fly.get(`/mini/activity/leave-notes/notice/${params}`)
+// 成员列表
+export const getAccountStaffs = params => fly.get('/mini/account/staffs', params)
+// 删除成员
+export const delAccountQuiteCompany = params => fly.post('/mini/account/quit-company', params)
+// 更改行政类型
+export const upAccountStaffLabel = params => fly.put('/mini/account/staff-label', params)
+// 导入
+export const postStaffLabel = params => fly.post('/mini/account/label/staff', params)
+// 邮箱
+export const getmailHtml = params => fly.get('/mini/account/send/mail/html', params)
+// 记录员工健康
+export const addStaffHealth = params => fly.post('/mini/account/staff/health', params)

src/assets/font/demo.css

+/* Logo 字体 */
+@font-face {
+  font-family: "iconfont logo";
+  src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834');
+  src: url('https://at.alicdn.com/t/font_985780_km7mi63cihi.eot?t=1545807318834#iefix') format('embedded-opentype'),
+    url('https://at.alicdn.com/t/font_985780_km7mi63cihi.woff?t=1545807318834') format('woff'),
+    url('https://at.alicdn.com/t/font_985780_km7mi63cihi.ttf?t=1545807318834') format('truetype'),
+    url('https://at.alicdn.com/t/font_985780_km7mi63cihi.svg?t=1545807318834#iconfont') format('svg');
+}
+
+.logo {
+  font-family: "iconfont logo";
+  font-size: 160px;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+/* tabs */
+.nav-tabs {
+  position: relative;
+}
+
+.nav-tabs .nav-more {
+  position: absolute;
+  right: 0;
+  bottom: 0;
+  height: 42px;
+  line-height: 42px;
+  color: #666;
+}
+
+#tabs {
+  border-bottom: 1px solid #eee;
+}
+
+#tabs li {
+  cursor: pointer;
+  width: 100px;
+  height: 40px;
+  line-height: 40px;
+  text-align: center;
+  font-size: 16px;
+  border-bottom: 2px solid transparent;
+  position: relative;
+  z-index: 1;
+  margin-bottom: -1px;
+  color: #666;
+}
+
+
+#tabs .active {
+  border-bottom-color: #f00;
+  color: #222;
+}
+
+.tab-container .content {
+  display: none;
+}
+
+/* 页面布局 */
+.main {
+  padding: 30px 100px;
+  width: 960px;
+  margin: 0 auto;
+}
+
+.main .logo {
+  color: #333;
+  text-align: left;
+  margin-bottom: 30px;
+  line-height: 1;
+  height: 110px;
+  margin-top: -50px;
+  overflow: hidden;
+  *zoom: 1;
+}
+
+.main .logo a {
+  font-size: 160px;
+  color: #333;
+}
+
+.helps {
+  margin-top: 40px;
+}
+
+.helps pre {
+  padding: 20px;
+  margin: 10px 0;
+  border: solid 1px #e7e1cd;
+  background-color: #fffdef;
+  overflow: auto;
+}
+
+.icon_lists {
+  width: 100% !important;
+  overflow: hidden;
+  *zoom: 1;
+}
+
+.icon_lists li {
+  width: 100px;
+  margin-bottom: 10px;
+  margin-right: 20px;
+  text-align: center;
+  list-style: none !important;
+  cursor: default;
+}
+
+.icon_lists li .code-name {
+  line-height: 1.2;
+}
+
+.icon_lists .icon {
+  display: block;
+  height: 100px;
+  line-height: 100px;
+  font-size: 42px;
+  margin: 10px auto;
+  color: #333;
+  -webkit-transition: font-size 0.25s linear, width 0.25s linear;
+  -moz-transition: font-size 0.25s linear, width 0.25s linear;
+  transition: font-size 0.25s linear, width 0.25s linear;
+}
+
+.icon_lists .icon:hover {
+  font-size: 100px;
+}
+
+.icon_lists .svg-icon {
+  /* 通过设置 font-size 来改变图标大小 */
+  width: 1em;
+  /* 图标和文字相邻时，垂直对齐 */
+  vertical-align: -0.15em;
+  /* 通过设置 color 来改变 SVG 的颜色/fill */
+  fill: currentColor;
+  /* path 和 stroke 溢出 viewBox 部分在 IE 下会显示
+      normalize.css 中也包含这行 */
+  overflow: hidden;
+}
+
+.icon_lists li .name,
+.icon_lists li .code-name {
+  color: #666;
+}
+
+/* markdown 样式 */
+.markdown {
+  color: #666;
+  font-size: 14px;
+  line-height: 1.8;
+}
+
+.highlight {
+  line-height: 1.5;
+}
+
+.markdown img {
+  vertical-align: middle;
+  max-width: 100%;
+}
+
+.markdown h1 {
+  color: #404040;
+  font-weight: 500;
+  line-height: 40px;
+  margin-bottom: 24px;
+}
+
+.markdown h2,
+.markdown h3,
+.markdown h4,
+.markdown h5,
+.markdown h6 {
+  color: #404040;
+  margin: 1.6em 0 0.6em 0;
+  font-weight: 500;
+  clear: both;
+}
+
+.markdown h1 {
+  font-size: 28px;
+}
+
+.markdown h2 {
+  font-size: 22px;
+}
+
+.markdown h3 {
+  font-size: 16px;
+}
+
+.markdown h4 {
+  font-size: 14px;
+}
+
+.markdown h5 {
+  font-size: 12px;
+}
+
+.markdown h6 {
+  font-size: 12px;
+}
+
+.markdown hr {
+  height: 1px;
+  border: 0;
+  background: #e9e9e9;
+  margin: 16px 0;
+  clear: both;
+}
+
+.markdown p {
+  margin: 1em 0;
+}
+
+.markdown>p,
+.markdown>blockquote,
+.markdown>.highlight,
+.markdown>ol,
+.markdown>ul {
+  width: 80%;
+}
+
+.markdown ul>li {
+  list-style: circle;
+}
+
+.markdown>ul li,
+.markdown blockquote ul>li {
+  margin-left: 20px;
+  padding-left: 4px;
+}
+
+.markdown>ul li p,
+.markdown>ol li p {
+  margin: 0.6em 0;
+}
+
+.markdown ol>li {
+  list-style: decimal;
+}
+
+.markdown>ol li,
+.markdown blockquote ol>li {
+  margin-left: 20px;
+  padding-left: 4px;
+}
+
+.markdown code {
+  margin: 0 3px;
+  padding: 0 5px;
+  background: #eee;
+  border-radius: 3px;
+}
+
+.markdown strong,
+.markdown b {
+  font-weight: 600;
+}
+
+.markdown>table {
+  border-collapse: collapse;
+  border-spacing: 0px;
+  empty-cells: show;
+  border: 1px solid #e9e9e9;
+  width: 95%;
+  margin-bottom: 24px;
+}
+
+.markdown>table th {
+  white-space: nowrap;
+  color: #333;
+  font-weight: 600;
+}
+
+.markdown>table th,
+.markdown>table td {
+  border: 1px solid #e9e9e9;
+  padding: 8px 16px;
+  text-align: left;
+}
+
+.markdown>table th {
+  background: #F7F7F7;
+}
+
+.markdown blockquote {
+  font-size: 90%;
+  color: #999;
+  border-left: 4px solid #e9e9e9;
+  padding-left: 0.8em;
+  margin: 1em 0;
+}
+
+.markdown blockquote p {
+  margin: 0;
+}
+
+.markdown .anchor {
+  opacity: 0;
+  transition: opacity 0.3s ease;
+  margin-left: 8px;
+}
+
+.markdown .waiting {
+  color: #ccc;
+}
+
+.markdown h1:hover .anchor,
+.markdown h2:hover .anchor,
+.markdown h3:hover .anchor,
+.markdown h4:hover .anchor,
+.markdown h5:hover .anchor,
+.markdown h6:hover .anchor {
+  opacity: 1;
+  display: inline-block;
+}
+
+.markdown>br,
+.markdown>p>br {
+  clear: both;
+}
+
+
+.hljs {
+  display: block;
+  background: white;
+  padding: 0.5em;
+  color: #333333;
+  overflow-x: auto;
+}
+
+.hljs-comment,
+.hljs-meta {
+  color: #969896;
+}
+
+.hljs-string,
+.hljs-variable,
+.hljs-template-variable,
+.hljs-strong,
+.hljs-emphasis,
+.hljs-quote {
+  color: #df5000;
+}
+
+.hljs-keyword,
+.hljs-selector-tag,
+.hljs-type {
+  color: #a71d5d;
+}
+
+.hljs-literal,
+.hljs-symbol,
+.hljs-bullet,
+.hljs-attribute {
+  color: #0086b3;
+}
+
+.hljs-section,
+.hljs-name {
+  color: #63a35c;
+}
+
+.hljs-tag {
+  color: #333333;
+}
+
+.hljs-title,
+.hljs-attr,
+.hljs-selector-id,
+.hljs-selector-class,
+.hljs-selector-attr,
+.hljs-selector-pseudo {
+  color: #795da3;
+}
+
+.hljs-addition {
+  color: #55a532;
+  background-color: #eaffea;
+}
+
+.hljs-deletion {
+  color: #bd2c00;
+  background-color: #ffecec;
+}
+
+.hljs-link {
+  text-decoration: underline;
+}
+
+/* 代码高亮 */
+/* PrismJS 1.15.0
+https://prismjs.com/download.html#themes=prism&languages=markup+css+clike+javascript */
+/**
+ * prism.js default theme for JavaScript, CSS and HTML
+ * Based on dabblet (http://dabblet.com)
+ * @author Lea Verou
+ */
+code[class*="language-"],
+pre[class*="language-"] {
+  color: black;
+  background: none;
+  text-shadow: 0 1px white;
+  font-family: Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;
+  text-align: left;
+  white-space: pre;
+  word-spacing: normal;
+  word-break: normal;
+  word-wrap: normal;
+  line-height: 1.5;
+
+  -moz-tab-size: 4;
+  -o-tab-size: 4;
+  tab-size: 4;
+
+  -webkit-hyphens: none;
+  -moz-hyphens: none;
+  -ms-hyphens: none;
+  hyphens: none;
+}
+
+pre[class*="language-"]::-moz-selection,
+pre[class*="language-"] ::-moz-selection,
+code[class*="language-"]::-moz-selection,
+code[class*="language-"] ::-moz-selection {
+  text-shadow: none;
+  background: #b3d4fc;
+}
+
+pre[class*="language-"]::selection,
+pre[class*="language-"] ::selection,
+code[class*="language-"]::selection,
+code[class*="language-"] ::selection {
+  text-shadow: none;
+  background: #b3d4fc;
+}
+
+@media print {
+
+  code[class*="language-"],
+  pre[class*="language-"] {
+    text-shadow: none;
+  }
+}
+
+/* Code blocks */
+pre[class*="language-"] {
+  padding: 1em;
+  margin: .5em 0;
+  overflow: auto;
+}
+
+:not(pre)>code[class*="language-"],
+pre[class*="language-"] {
+  background: #f5f2f0;
+}
+
+/* Inline code */
+:not(pre)>code[class*="language-"] {
+  padding: .1em;
+  border-radius: .3em;
+  white-space: normal;
+}
+
+.token.comment,
+.token.prolog,
+.token.doctype,
+.token.cdata {
+  color: slategray;
+}
+
+.token.punctuation {
+  color: #999;
+}
+
+.namespace {
+  opacity: .7;
+}
+
+.token.property,
+.token.tag,
+.token.boolean,
+.token.number,
+.token.constant,
+.token.symbol,
+.token.deleted {
+  color: #905;
+}
+
+.token.selector,
+.token.attr-name,
+.token.string,
+.token.char,
+.token.builtin,
+.token.inserted {
+  color: #690;
+}
+
+.token.operator,
+.token.entity,
+.token.url,
+.language-css .token.string,
+.style .token.string {
+  color: #9a6e3a;
+  background: hsla(0, 0%, 100%, .5);
+}
+
+.token.atrule,
+.token.attr-value,
+.token.keyword {
+  color: #07a;
+}
+
+.token.function,
+.token.class-name {
+  color: #DD4A68;
+}
+
+.token.regex,
+.token.important,
+.token.variable {
+  color: #e90;
+}
+
+.token.important,
+.token.bold {
+  font-weight: bold;
+}
+
+.token.italic {
+  font-style: italic;
+}
+
+.token.entity {
+  cursor: help;
+}

src/assets/font/demo_index.html

+<!DOCTYPE html>
+<html>
+<head>
+  <meta charset="utf-8"/>
+  <title>IconFont Demo</title>
+  <link rel="shortcut icon" href="https://gtms04.alicdn.com/tps/i4/TB1_oz6GVXXXXaFXpXXJDFnIXXX-64-64.ico" type="image/x-icon"/>
+  <link rel="stylesheet" href="https://g.alicdn.com/thx/cube/1.3.2/cube.min.css">
+  <link rel="stylesheet" href="demo.css">
+  <link rel="stylesheet" href="iconfont.css">
+  <script src="iconfont.js"></script>
+  <!-- jQuery -->
+  <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/7bfddb60-08e8-11e9-9b04-53e73bb6408b.js"></script>
+  <!-- 代码高亮 -->
+  <script src="https://a1.alicdn.com/oss/uploads/2018/12/26/a3f714d0-08e6-11e9-8a15-ebf944d7534c.js"></script>
+</head>
+<body>
+  <div class="main">
+    <h1 class="logo"><a href="https://www.iconfont.cn/" title="iconfont 首页" target="_blank">&#xe86b;</a></h1>
+    <div class="nav-tabs">
+      <ul id="tabs" class="dib-box">
+        <li class="dib active"><span>Unicode</span></li>
+        <li class="dib"><span>Font class</span></li>
+        <li class="dib"><span>Symbol</span></li>
+      </ul>
+      
+      <a href="https://www.iconfont.cn/manage/index?manage_type=myprojects&projectId=1666972" target="_blank" class="nav-more">查看项目</a>
+      
+    </div>
+    <div class="tab-container">
+      <div class="content unicode" style="display: block;">
+          <ul class="icon_lists dib-box">
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe625;</span>
+                <div class="name">arrow-double-down</div>
+                <div class="code-name">&amp;#xe625;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe626;</span>
+                <div class="name">add</div>
+                <div class="code-name">&amp;#xe626;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe627;</span>
+                <div class="name">about</div>
+                <div class="code-name">&amp;#xe627;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe628;</span>
+                <div class="name">all-fill</div>
+                <div class="code-name">&amp;#xe628;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe629;</span>
+                <div class="name">arrow-double-right</div>
+                <div class="code-name">&amp;#xe629;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe62a;</span>
+                <div class="name">arrow-v-down</div>
+                <div class="code-name">&amp;#xe62a;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe62b;</span>
+                <div class="name">arrow-left</div>
+                <div class="code-name">&amp;#xe62b;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe62c;</span>
+                <div class="name">alipay</div>
+                <div class="code-name">&amp;#xe62c;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe62d;</span>
+                <div class="name">arrow-double-up</div>
+                <div class="code-name">&amp;#xe62d;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe62e;</span>
+                <div class="name">arrow-down</div>
+                <div class="code-name">&amp;#xe62e;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe62f;</span>
+                <div class="name">arrow-up</div>
+                <div class="code-name">&amp;#xe62f;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe630;</span>
+                <div class="name">arrow-v-left</div>
+                <div class="code-name">&amp;#xe630;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe631;</span>
+                <div class="name">about-fill</div>
+                <div class="code-name">&amp;#xe631;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe632;</span>
+                <div class="name">all</div>
+                <div class="code-name">&amp;#xe632;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe633;</span>
+                <div class="name">arrow-vv-down</div>
+                <div class="code-name">&amp;#xe633;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe634;</span>
+                <div class="name">arrow-double-left</div>
+                <div class="code-name">&amp;#xe634;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe635;</span>
+                <div class="name">arrow-vv-left</div>
+                <div class="code-name">&amp;#xe635;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe636;</span>
+                <div class="name">arrow-vv-right</div>
+                <div class="code-name">&amp;#xe636;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe637;</span>
+                <div class="name">arrow-vvv-left</div>
+                <div class="code-name">&amp;#xe637;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe638;</span>
+                <div class="name">arrow-v-up</div>
+                <div class="code-name">&amp;#xe638;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe639;</span>
+                <div class="name">arrow-vvv-right</div>
+                <div class="code-name">&amp;#xe639;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe63a;</span>
+                <div class="name">arrow-vvv-down</div>
+                <div class="code-name">&amp;#xe63a;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe63b;</span>
+                <div class="name">arrow-right</div>
+                <div class="code-name">&amp;#xe63b;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe63c;</span>
+                <div class="name">arrow-v-right</div>
+                <div class="code-name">&amp;#xe63c;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe63d;</span>
+                <div class="name">cart-add-fill</div>
+                <div class="code-name">&amp;#xe63d;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe63e;</span>
+                <div class="name">close</div>
+                <div class="code-name">&amp;#xe63e;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe63f;</span>
+                <div class="name">cart</div>
+                <div class="code-name">&amp;#xe63f;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe640;</span>
+                <div class="name">cart-add</div>
+                <div class="code-name">&amp;#xe640;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe641;</span>
+                <div class="name">cart-fill</div>
+                <div class="code-name">&amp;#xe641;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe642;</span>
+                <div class="name">arrow-vvv-up</div>
+                <div class="code-name">&amp;#xe642;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe643;</span>
+                <div class="name">arrow-vv-up</div>
+                <div class="code-name">&amp;#xe643;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe644;</span>
+                <div class="name">clock</div>
+                <div class="code-name">&amp;#xe644;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe645;</span>
+                <div class="name">facebook</div>
+                <div class="code-name">&amp;#xe645;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe646;</span>
+                <div class="name">delete-fill</div>
+                <div class="code-name">&amp;#xe646;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe647;</span>
+                <div class="name">editor</div>
+                <div class="code-name">&amp;#xe647;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe648;</span>
+                <div class="name">date-fill</div>
+                <div class="code-name">&amp;#xe648;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe649;</span>
+                <div class="name">delete</div>
+                <div class="code-name">&amp;#xe649;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe64a;</span>
+                <div class="name">download</div>
+                <div class="code-name">&amp;#xe64a;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe64b;</span>
+                <div class="name">favorite</div>
+                <div class="code-name">&amp;#xe64b;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe64c;</span>
+                <div class="name">help</div>
+                <div class="code-name">&amp;#xe64c;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe64d;</span>
+                <div class="name">favorite-fill</div>
+                <div class="code-name">&amp;#xe64d;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe64e;</span>
+                <div class="name">date</div>
+                <div class="code-name">&amp;#xe64e;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe64f;</span>
+                <div class="name">help-fill</div>
+                <div class="code-name">&amp;#xe64f;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe650;</span>
+                <div class="name">image-fill</div>
+                <div class="code-name">&amp;#xe650;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe651;</span>
+                <div class="name">friends</div>
+                <div class="code-name">&amp;#xe651;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe652;</span>
+                <div class="name">image</div>
+                <div class="code-name">&amp;#xe652;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe653;</span>
+                <div class="name">lessen</div>
+                <div class="code-name">&amp;#xe653;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe654;</span>
+                <div class="name">mail</div>
+                <div class="code-name">&amp;#xe654;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe655;</span>
+                <div class="name">lock</div>
+                <div class="code-name">&amp;#xe655;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe656;</span>
+                <div class="name">mail-fill</div>
+                <div class="code-name">&amp;#xe656;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe657;</span>
+                <div class="name">map</div>
+                <div class="code-name">&amp;#xe657;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe658;</span>
+                <div class="name">phone</div>
+                <div class="code-name">&amp;#xe658;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe659;</span>
+                <div class="name">qq</div>
+                <div class="code-name">&amp;#xe659;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe65a;</span>
+                <div class="name">play-fill</div>
+                <div class="code-name">&amp;#xe65a;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe65b;</span>
+                <div class="name">play</div>
+                <div class="code-name">&amp;#xe65b;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe65c;</span>
+                <div class="name">pic</div>
+                <div class="code-name">&amp;#xe65c;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe65d;</span>
+                <div class="name">QQspace</div>
+                <div class="code-name">&amp;#xe65d;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe65e;</span>
+                <div class="name">round-close</div>
+                <div class="code-name">&amp;#xe65e;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe65f;</span>
+                <div class="name">round-add-fill</div>
+                <div class="code-name">&amp;#xe65f;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe660;</span>
+                <div class="name">none</div>
+                <div class="code-name">&amp;#xe660;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe661;</span>
+                <div class="name">round-selected-fill</div>
+                <div class="code-name">&amp;#xe661;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe662;</span>
+                <div class="name">round-add</div>
+                <div class="code-name">&amp;#xe662;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe663;</span>
+                <div class="name">round-lessen-fill</div>
+                <div class="code-name">&amp;#xe663;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe664;</span>
+                <div class="name">round-lessen</div>
+                <div class="code-name">&amp;#xe664;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe665;</span>
+                <div class="name">round-close-fill</div>
+                <div class="code-name">&amp;#xe665;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe666;</span>
+                <div class="name">search</div>
+                <div class="code-name">&amp;#xe666;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe667;</span>
+                <div class="name">round-selected</div>
+                <div class="code-name">&amp;#xe667;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe668;</span>
+                <div class="name">shipping-address</div>
+                <div class="code-name">&amp;#xe668;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe669;</span>
+                <div class="name">round</div>
+                <div class="code-name">&amp;#xe669;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe66a;</span>
+                <div class="name">share</div>
+                <div class="code-name">&amp;#xe66a;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe66b;</span>
+                <div class="name">servise</div>
+                <div class="code-name">&amp;#xe66b;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe66c;</span>
+                <div class="name">siet-fill</div>
+                <div class="code-name">&amp;#xe66c;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe66d;</span>
+                <div class="name">square-selected</div>
+                <div class="code-name">&amp;#xe66d;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe66e;</span>
+                <div class="name">sort-fill</div>
+                <div class="code-name">&amp;#xe66e;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe66f;</span>
+                <div class="name">sort</div>
+                <div class="code-name">&amp;#xe66f;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe670;</span>
+                <div class="name">square</div>
+                <div class="code-name">&amp;#xe670;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe671;</span>
+                <div class="name">star-fill</div>
+                <div class="code-name">&amp;#xe671;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe672;</span>
+                <div class="name">square-selected-fill</div>
+                <div class="code-name">&amp;#xe672;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe673;</span>
+                <div class="name">stop-v-fill2</div>
+                <div class="code-name">&amp;#xe673;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe674;</span>
+                <div class="name">star-half</div>
+                <div class="code-name">&amp;#xe674;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe675;</span>
+                <div class="name">star</div>
+                <div class="code-name">&amp;#xe675;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe676;</span>
+                <div class="name">stop-fill</div>
+                <div class="code-name">&amp;#xe676;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe677;</span>
+                <div class="name">tick</div>
+                <div class="code-name">&amp;#xe677;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe678;</span>
+                <div class="name">stop-v</div>
+                <div class="code-name">&amp;#xe678;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe679;</span>
+                <div class="name">stop</div>
+                <div class="code-name">&amp;#xe679;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe67a;</span>
+                <div class="name">twitter</div>
+                <div class="code-name">&amp;#xe67a;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe67b;</span>
+                <div class="name">upload</div>
+                <div class="code-name">&amp;#xe67b;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe67c;</span>
+                <div class="name">visible</div>
+                <div class="code-name">&amp;#xe67c;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe67d;</span>
+                <div class="name">wechat</div>
+                <div class="code-name">&amp;#xe67d;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe67e;</span>
+                <div class="name">unvisible</div>
+                <div class="code-name">&amp;#xe67e;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe67f;</span>
+                <div class="name">clock-fill</div>
+                <div class="code-name">&amp;#xe67f;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon dk-iconfont">&#xe680;</span>
+                <div class="name">siet</div>
+                <div class="code-name">&amp;#xe680;</div>
+              </li>
+          
+          </ul>
+          <div class="article markdown">
+          <h2 id="unicode-">Unicode 引用</h2>
+          <hr>
+
+          <p>Unicode 是字体在网页端最原始的应用方式，特点是：</p>
+          <ul>
+            <li>兼容性最好，支持 IE6+，及所有现代浏览器。</li>
+            <li>支持按字体的方式去动态调整图标大小，颜色等等。</li>
+            <li>但是因为是字体，所以不支持多色。只能使用平台里单色的图标，就算项目里有多色图标也会自动去色。</li>
+          </ul>
+          <blockquote>
+            <p>注意：新版 iconfont 支持多色图标，这些多色图标在 Unicode 模式下将不能使用，如果有需求建议使用symbol 的引用方式</p>
+          </blockquote>
+          <p>Unicode 使用步骤如下：</p>
+          <h3 id="-font-face">第一步：拷贝项目下面生成的 <code>@font-face</code></h3>
+<pre><code class="language-css"
+>@font-face {
+  font-family: 'dk-iconfont';
+  src: url('iconfont.eot');
+  src: url('iconfont.eot?#iefix') format('embedded-opentype'),
+      url('iconfont.woff2') format('woff2'),
+      url('iconfont.woff') format('woff'),
+      url('iconfont.ttf') format('truetype'),
+      url('iconfont.svg#dk-iconfont') format('svg');
+}
+</code></pre>
+          <h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
+<pre><code class="language-css"
+>.dk-iconfont {
+  font-family: "dk-iconfont" !important;
+  font-size: 16px;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+</code></pre>
+          <h3 id="-">第三步：挑选相应图标并获取字体编码，应用于页面</h3>
+<pre>
+<code class="language-html"
+>&lt;span class="dk-iconfont"&gt;&amp;#x33;&lt;/span&gt;
+</code></pre>
+          <blockquote>
+            <p>"dk-iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
+          </blockquote>
+          </div>
+      </div>
+      <div class="content font-class">
+        <ul class="icon_lists dib-box">
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-arrow-double-down"></span>
+            <div class="name">
+              arrow-double-down
+            </div>
+            <div class="code-name">.dkic-arrow-double-down
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-add"></span>
+            <div class="name">
+              add
+            </div>
+            <div class="code-name">.dkic-add
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-about"></span>
+            <div class="name">
+              about
+            </div>
+            <div class="code-name">.dkic-about
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-all-fill"></span>
+            <div class="name">
+              all-fill
+            </div>
+            <div class="code-name">.dkic-all-fill
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-arrow-double-right"></span>
+            <div class="name">
+              arrow-double-right
+            </div>
+            <div class="code-name">.dkic-arrow-double-right
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-arrow-v-down"></span>
+            <div class="name">
+              arrow-v-down
+            </div>
+            <div class="code-name">.dkic-arrow-v-down
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-arrow-left"></span>
+            <div class="name">
+              arrow-left
+            </div>
+            <div class="code-name">.dkic-arrow-left
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-alipay"></span>
+            <div class="name">
+              alipay
+            </div>
+            <div class="code-name">.dkic-alipay
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-arrow-double-up"></span>
+            <div class="name">
+              arrow-double-up
+            </div>
+            <div class="code-name">.dkic-arrow-double-up
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-arrow-down"></span>
+            <div class="name">
+              arrow-down
+            </div>
+            <div class="code-name">.dkic-arrow-down
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-arrow-up"></span>
+            <div class="name">
+              arrow-up
+            </div>
+            <div class="code-name">.dkic-arrow-up
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-arrow-v-left"></span>
+            <div class="name">
+              arrow-v-left
+            </div>
+            <div class="code-name">.dkic-arrow-v-left
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-about-fill"></span>
+            <div class="name">
+              about-fill
+            </div>
+            <div class="code-name">.dkic-about-fill
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-all"></span>
+            <div class="name">
+              all
+            </div>
+            <div class="code-name">.dkic-all
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-arrow-vv-down"></span>
+            <div class="name">
+              arrow-vv-down
+            </div>
+            <div class="code-name">.dkic-arrow-vv-down
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-arrow-double-left"></span>
+            <div class="name">
+              arrow-double-left
+            </div>
+            <div class="code-name">.dkic-arrow-double-left
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-arrow-vv-left"></span>
+            <div class="name">
+              arrow-vv-left
+            </div>
+            <div class="code-name">.dkic-arrow-vv-left
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-arrow-vv-right"></span>
+            <div class="name">
+              arrow-vv-right
+            </div>
+            <div class="code-name">.dkic-arrow-vv-right
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-arrow-vvv-left"></span>
+            <div class="name">
+              arrow-vvv-left
+            </div>
+            <div class="code-name">.dkic-arrow-vvv-left
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-arrow-v-up"></span>
+            <div class="name">
+              arrow-v-up
+            </div>
+            <div class="code-name">.dkic-arrow-v-up
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-arrow-vvv-right"></span>
+            <div class="name">
+              arrow-vvv-right
+            </div>
+            <div class="code-name">.dkic-arrow-vvv-right
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-arrow-vvv-down"></span>
+            <div class="name">
+              arrow-vvv-down
+            </div>
+            <div class="code-name">.dkic-arrow-vvv-down
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-arrow-right"></span>
+            <div class="name">
+              arrow-right
+            </div>
+            <div class="code-name">.dkic-arrow-right
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-arrow-v-right"></span>
+            <div class="name">
+              arrow-v-right
+            </div>
+            <div class="code-name">.dkic-arrow-v-right
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-cart-add-fill"></span>
+            <div class="name">
+              cart-add-fill
+            </div>
+            <div class="code-name">.dkic-cart-add-fill
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-close"></span>
+            <div class="name">
+              close
+            </div>
+            <div class="code-name">.dkic-close
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-cart"></span>
+            <div class="name">
+              cart
+            </div>
+            <div class="code-name">.dkic-cart
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-cart-add"></span>
+            <div class="name">
+              cart-add
+            </div>
+            <div class="code-name">.dkic-cart-add
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-cart-fill"></span>
+            <div class="name">
+              cart-fill
+            </div>
+            <div class="code-name">.dkic-cart-fill
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-arrow-vvv-up"></span>
+            <div class="name">
+              arrow-vvv-up
+            </div>
+            <div class="code-name">.dkic-arrow-vvv-up
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-arrow-vv-up"></span>
+            <div class="name">
+              arrow-vv-up
+            </div>
+            <div class="code-name">.dkic-arrow-vv-up
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-clock"></span>
+            <div class="name">
+              clock
+            </div>
+            <div class="code-name">.dkic-clock
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-facebook"></span>
+            <div class="name">
+              facebook
+            </div>
+            <div class="code-name">.dkic-facebook
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-delete-fill"></span>
+            <div class="name">
+              delete-fill
+            </div>
+            <div class="code-name">.dkic-delete-fill
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-editor"></span>
+            <div class="name">
+              editor
+            </div>
+            <div class="code-name">.dkic-editor
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-date-fill"></span>
+            <div class="name">
+              date-fill
+            </div>
+            <div class="code-name">.dkic-date-fill
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-delete"></span>
+            <div class="name">
+              delete
+            </div>
+            <div class="code-name">.dkic-delete
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-download"></span>
+            <div class="name">
+              download
+            </div>
+            <div class="code-name">.dkic-download
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-favorite"></span>
+            <div class="name">
+              favorite
+            </div>
+            <div class="code-name">.dkic-favorite
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-help"></span>
+            <div class="name">
+              help
+            </div>
+            <div class="code-name">.dkic-help
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-favorite-fill"></span>
+            <div class="name">
+              favorite-fill
+            </div>
+            <div class="code-name">.dkic-favorite-fill
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-date"></span>
+            <div class="name">
+              date
+            </div>
+            <div class="code-name">.dkic-date
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-help-fill"></span>
+            <div class="name">
+              help-fill
+            </div>
+            <div class="code-name">.dkic-help-fill
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-image-fill"></span>
+            <div class="name">
+              image-fill
+            </div>
+            <div class="code-name">.dkic-image-fill
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-friends"></span>
+            <div class="name">
+              friends
+            </div>
+            <div class="code-name">.dkic-friends
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-image"></span>
+            <div class="name">
+              image
+            </div>
+            <div class="code-name">.dkic-image
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-lessen"></span>
+            <div class="name">
+              lessen
+            </div>
+            <div class="code-name">.dkic-lessen
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-mail"></span>
+            <div class="name">
+              mail
+            </div>
+            <div class="code-name">.dkic-mail
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-lock"></span>
+            <div class="name">
+              lock
+            </div>
+            <div class="code-name">.dkic-lock
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-mail-fill"></span>
+            <div class="name">
+              mail-fill
+            </div>
+            <div class="code-name">.dkic-mail-fill
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-map"></span>
+            <div class="name">
+              map
+            </div>
+            <div class="code-name">.dkic-map
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-phone"></span>
+            <div class="name">
+              phone
+            </div>
+            <div class="code-name">.dkic-phone
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-qq"></span>
+            <div class="name">
+              qq
+            </div>
+            <div class="code-name">.dkic-qq
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-play-fill"></span>
+            <div class="name">
+              play-fill
+            </div>
+            <div class="code-name">.dkic-play-fill
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-play"></span>
+            <div class="name">
+              play
+            </div>
+            <div class="code-name">.dkic-play
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-pic"></span>
+            <div class="name">
+              pic
+            </div>
+            <div class="code-name">.dkic-pic
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-QQspace"></span>
+            <div class="name">
+              QQspace
+            </div>
+            <div class="code-name">.dkic-QQspace
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-round-close"></span>
+            <div class="name">
+              round-close
+            </div>
+            <div class="code-name">.dkic-round-close
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-round-add-fill"></span>
+            <div class="name">
+              round-add-fill
+            </div>
+            <div class="code-name">.dkic-round-add-fill
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-none"></span>
+            <div class="name">
+              none
+            </div>
+            <div class="code-name">.dkic-none
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-round-selected-fill"></span>
+            <div class="name">
+              round-selected-fill
+            </div>
+            <div class="code-name">.dkic-round-selected-fill
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-round-add"></span>
+            <div class="name">
+              round-add
+            </div>
+            <div class="code-name">.dkic-round-add
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-round-lessen-fill"></span>
+            <div class="name">
+              round-lessen-fill
+            </div>
+            <div class="code-name">.dkic-round-lessen-fill
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-round-lessen"></span>
+            <div class="name">
+              round-lessen
+            </div>
+            <div class="code-name">.dkic-round-lessen
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-round-close-fill"></span>
+            <div class="name">
+              round-close-fill
+            </div>
+            <div class="code-name">.dkic-round-close-fill
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-search"></span>
+            <div class="name">
+              search
+            </div>
+            <div class="code-name">.dkic-search
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-round-selected"></span>
+            <div class="name">
+              round-selected
+            </div>
+            <div class="code-name">.dkic-round-selected
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-shipping-address"></span>
+            <div class="name">
+              shipping-address
+            </div>
+            <div class="code-name">.dkic-shipping-address
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-round"></span>
+            <div class="name">
+              round
+            </div>
+            <div class="code-name">.dkic-round
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-share"></span>
+            <div class="name">
+              share
+            </div>
+            <div class="code-name">.dkic-share
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-servise"></span>
+            <div class="name">
+              servise
+            </div>
+            <div class="code-name">.dkic-servise
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-siet-fill"></span>
+            <div class="name">
+              siet-fill
+            </div>
+            <div class="code-name">.dkic-siet-fill
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-square-selected"></span>
+            <div class="name">
+              square-selected
+            </div>
+            <div class="code-name">.dkic-square-selected
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-sort-fill"></span>
+            <div class="name">
+              sort-fill
+            </div>
+            <div class="code-name">.dkic-sort-fill
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-sort"></span>
+            <div class="name">
+              sort
+            </div>
+            <div class="code-name">.dkic-sort
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-square"></span>
+            <div class="name">
+              square
+            </div>
+            <div class="code-name">.dkic-square
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-star-fill"></span>
+            <div class="name">
+              star-fill
+            </div>
+            <div class="code-name">.dkic-star-fill
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-square-selected-fill"></span>
+            <div class="name">
+              square-selected-fill
+            </div>
+            <div class="code-name">.dkic-square-selected-fill
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-stop-v-fill"></span>
+            <div class="name">
+              stop-v-fill2
+            </div>
+            <div class="code-name">.dkic-stop-v-fill
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-star-half"></span>
+            <div class="name">
+              star-half
+            </div>
+            <div class="code-name">.dkic-star-half
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-star"></span>
+            <div class="name">
+              star
+            </div>
+            <div class="code-name">.dkic-star
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-stop-fill"></span>
+            <div class="name">
+              stop-fill
+            </div>
+            <div class="code-name">.dkic-stop-fill
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-tick"></span>
+            <div class="name">
+              tick
+            </div>
+            <div class="code-name">.dkic-tick
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-stop-v"></span>
+            <div class="name">
+              stop-v
+            </div>
+            <div class="code-name">.dkic-stop-v
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-stop"></span>
+            <div class="name">
+              stop
+            </div>
+            <div class="code-name">.dkic-stop
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-twitter"></span>
+            <div class="name">
+              twitter
+            </div>
+            <div class="code-name">.dkic-twitter
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-upload"></span>
+            <div class="name">
+              upload
+            </div>
+            <div class="code-name">.dkic-upload
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-visible"></span>
+            <div class="name">
+              visible
+            </div>
+            <div class="code-name">.dkic-visible
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-wechat"></span>
+            <div class="name">
+              wechat
+            </div>
+            <div class="code-name">.dkic-wechat
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-unvisible"></span>
+            <div class="name">
+              unvisible
+            </div>
+            <div class="code-name">.dkic-unvisible
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-clock-fill"></span>
+            <div class="name">
+              clock-fill
+            </div>
+            <div class="code-name">.dkic-clock-fill
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon dk-iconfont dkic-siet"></span>
+            <div class="name">
+              siet
+            </div>
+            <div class="code-name">.dkic-siet
+            </div>
+          </li>
+          
+        </ul>
+        <div class="article markdown">
+        <h2 id="font-class-">font-class 引用</h2>
+        <hr>
+
+        <p>font-class 是 Unicode 使用方式的一种变种，主要是解决 Unicode 书写不直观，语意不明确的问题。</p>
+        <p>与 Unicode 使用方式相比，具有如下特点：</p>
+        <ul>
+          <li>兼容性良好，支持 IE8+，及所有现代浏览器。</li>
+          <li>相比于 Unicode 语意明确，书写更直观。可以很容易分辨这个 icon 是什么。</li>
+          <li>因为使用 class 来定义图标，所以当要替换图标时，只需要修改 class 里面的 Unicode 引用。</li>
+          <li>不过因为本质上还是使用的字体，所以多色图标还是不支持的。</li>
+        </ul>
+        <p>使用步骤如下：</p>
+        <h3 id="-fontclass-">第一步：引入项目下面生成的 fontclass 代码：</h3>
+<pre><code class="language-html">&lt;link rel="stylesheet" href="./iconfont.css"&gt;
+</code></pre>
+        <h3 id="-">第二步：挑选相应图标并获取类名，应用于页面：</h3>
+<pre><code class="language-html">&lt;span class="dk-iconfont dkic-xxx"&gt;&lt;/span&gt;
+</code></pre>
+        <blockquote>
+          <p>"
+            dk-iconfont" 是你项目下的 font-family。可以通过编辑项目查看，默认是 "iconfont"。</p>
+        </blockquote>
+      </div>
+      </div>
+      <div class="content symbol">
+          <ul class="icon_lists dib-box">
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-arrow-double-down"></use>
+                </svg>
+                <div class="name">arrow-double-down</div>
+                <div class="code-name">#dkic-arrow-double-down</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-add"></use>
+                </svg>
+                <div class="name">add</div>
+                <div class="code-name">#dkic-add</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-about"></use>
+                </svg>
+                <div class="name">about</div>
+                <div class="code-name">#dkic-about</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-all-fill"></use>
+                </svg>
+                <div class="name">all-fill</div>
+                <div class="code-name">#dkic-all-fill</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-arrow-double-right"></use>
+                </svg>
+                <div class="name">arrow-double-right</div>
+                <div class="code-name">#dkic-arrow-double-right</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-arrow-v-down"></use>
+                </svg>
+                <div class="name">arrow-v-down</div>
+                <div class="code-name">#dkic-arrow-v-down</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-arrow-left"></use>
+                </svg>
+                <div class="name">arrow-left</div>
+                <div class="code-name">#dkic-arrow-left</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-alipay"></use>
+                </svg>
+                <div class="name">alipay</div>
+                <div class="code-name">#dkic-alipay</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-arrow-double-up"></use>
+                </svg>
+                <div class="name">arrow-double-up</div>
+                <div class="code-name">#dkic-arrow-double-up</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-arrow-down"></use>
+                </svg>
+                <div class="name">arrow-down</div>
+                <div class="code-name">#dkic-arrow-down</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-arrow-up"></use>
+                </svg>
+                <div class="name">arrow-up</div>
+                <div class="code-name">#dkic-arrow-up</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-arrow-v-left"></use>
+                </svg>
+                <div class="name">arrow-v-left</div>
+                <div class="code-name">#dkic-arrow-v-left</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-about-fill"></use>
+                </svg>
+                <div class="name">about-fill</div>
+                <div class="code-name">#dkic-about-fill</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-all"></use>
+                </svg>
+                <div class="name">all</div>
+                <div class="code-name">#dkic-all</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-arrow-vv-down"></use>
+                </svg>
+                <div class="name">arrow-vv-down</div>
+                <div class="code-name">#dkic-arrow-vv-down</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-arrow-double-left"></use>
+                </svg>
+                <div class="name">arrow-double-left</div>
+                <div class="code-name">#dkic-arrow-double-left</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-arrow-vv-left"></use>
+                </svg>
+                <div class="name">arrow-vv-left</div>
+                <div class="code-name">#dkic-arrow-vv-left</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-arrow-vv-right"></use>
+                </svg>
+                <div class="name">arrow-vv-right</div>
+                <div class="code-name">#dkic-arrow-vv-right</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-arrow-vvv-left"></use>
+                </svg>
+                <div class="name">arrow-vvv-left</div>
+                <div class="code-name">#dkic-arrow-vvv-left</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-arrow-v-up"></use>
+                </svg>
+                <div class="name">arrow-v-up</div>
+                <div class="code-name">#dkic-arrow-v-up</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-arrow-vvv-right"></use>
+                </svg>
+                <div class="name">arrow-vvv-right</div>
+                <div class="code-name">#dkic-arrow-vvv-right</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-arrow-vvv-down"></use>
+                </svg>
+                <div class="name">arrow-vvv-down</div>
+                <div class="code-name">#dkic-arrow-vvv-down</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-arrow-right"></use>
+                </svg>
+                <div class="name">arrow-right</div>
+                <div class="code-name">#dkic-arrow-right</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-arrow-v-right"></use>
+                </svg>
+                <div class="name">arrow-v-right</div>
+                <div class="code-name">#dkic-arrow-v-right</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-cart-add-fill"></use>
+                </svg>
+                <div class="name">cart-add-fill</div>
+                <div class="code-name">#dkic-cart-add-fill</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-close"></use>
+                </svg>
+                <div class="name">close</div>
+                <div class="code-name">#dkic-close</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-cart"></use>
+                </svg>
+                <div class="name">cart</div>
+                <div class="code-name">#dkic-cart</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-cart-add"></use>
+                </svg>
+                <div class="name">cart-add</div>
+                <div class="code-name">#dkic-cart-add</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-cart-fill"></use>
+                </svg>
+                <div class="name">cart-fill</div>
+                <div class="code-name">#dkic-cart-fill</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-arrow-vvv-up"></use>
+                </svg>
+                <div class="name">arrow-vvv-up</div>
+                <div class="code-name">#dkic-arrow-vvv-up</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-arrow-vv-up"></use>
+                </svg>
+                <div class="name">arrow-vv-up</div>
+                <div class="code-name">#dkic-arrow-vv-up</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-clock"></use>
+                </svg>
+                <div class="name">clock</div>
+                <div class="code-name">#dkic-clock</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-facebook"></use>
+                </svg>
+                <div class="name">facebook</div>
+                <div class="code-name">#dkic-facebook</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-delete-fill"></use>
+                </svg>
+                <div class="name">delete-fill</div>
+                <div class="code-name">#dkic-delete-fill</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-editor"></use>
+                </svg>
+                <div class="name">editor</div>
+                <div class="code-name">#dkic-editor</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-date-fill"></use>
+                </svg>
+                <div class="name">date-fill</div>
+                <div class="code-name">#dkic-date-fill</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-delete"></use>
+                </svg>
+                <div class="name">delete</div>
+                <div class="code-name">#dkic-delete</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-download"></use>
+                </svg>
+                <div class="name">download</div>
+                <div class="code-name">#dkic-download</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-favorite"></use>
+                </svg>
+                <div class="name">favorite</div>
+                <div class="code-name">#dkic-favorite</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-help"></use>
+                </svg>
+                <div class="name">help</div>
+                <div class="code-name">#dkic-help</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-favorite-fill"></use>
+                </svg>
+                <div class="name">favorite-fill</div>
+                <div class="code-name">#dkic-favorite-fill</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-date"></use>
+                </svg>
+                <div class="name">date</div>
+                <div class="code-name">#dkic-date</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-help-fill"></use>
+                </svg>
+                <div class="name">help-fill</div>
+                <div class="code-name">#dkic-help-fill</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-image-fill"></use>
+                </svg>
+                <div class="name">image-fill</div>
+                <div class="code-name">#dkic-image-fill</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-friends"></use>
+                </svg>
+                <div class="name">friends</div>
+                <div class="code-name">#dkic-friends</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-image"></use>
+                </svg>
+                <div class="name">image</div>
+                <div class="code-name">#dkic-image</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-lessen"></use>
+                </svg>
+                <div class="name">lessen</div>
+                <div class="code-name">#dkic-lessen</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-mail"></use>
+                </svg>
+                <div class="name">mail</div>
+                <div class="code-name">#dkic-mail</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-lock"></use>
+                </svg>
+                <div class="name">lock</div>
+                <div class="code-name">#dkic-lock</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-mail-fill"></use>
+                </svg>
+                <div class="name">mail-fill</div>
+                <div class="code-name">#dkic-mail-fill</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-map"></use>
+                </svg>
+                <div class="name">map</div>
+                <div class="code-name">#dkic-map</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-phone"></use>
+                </svg>
+                <div class="name">phone</div>
+                <div class="code-name">#dkic-phone</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-qq"></use>
+                </svg>
+                <div class="name">qq</div>
+                <div class="code-name">#dkic-qq</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-play-fill"></use>
+                </svg>
+                <div class="name">play-fill</div>
+                <div class="code-name">#dkic-play-fill</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-play"></use>
+                </svg>
+                <div class="name">play</div>
+                <div class="code-name">#dkic-play</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-pic"></use>
+                </svg>
+                <div class="name">pic</div>
+                <div class="code-name">#dkic-pic</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-QQspace"></use>
+                </svg>
+                <div class="name">QQspace</div>
+                <div class="code-name">#dkic-QQspace</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-round-close"></use>
+                </svg>
+                <div class="name">round-close</div>
+                <div class="code-name">#dkic-round-close</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-round-add-fill"></use>
+                </svg>
+                <div class="name">round-add-fill</div>
+                <div class="code-name">#dkic-round-add-fill</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-none"></use>
+                </svg>
+                <div class="name">none</div>
+                <div class="code-name">#dkic-none</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-round-selected-fill"></use>
+                </svg>
+                <div class="name">round-selected-fill</div>
+                <div class="code-name">#dkic-round-selected-fill</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-round-add"></use>
+                </svg>
+                <div class="name">round-add</div>
+                <div class="code-name">#dkic-round-add</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-round-lessen-fill"></use>
+                </svg>
+                <div class="name">round-lessen-fill</div>
+                <div class="code-name">#dkic-round-lessen-fill</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-round-lessen"></use>
+                </svg>
+                <div class="name">round-lessen</div>
+                <div class="code-name">#dkic-round-lessen</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-round-close-fill"></use>
+                </svg>
+                <div class="name">round-close-fill</div>
+                <div class="code-name">#dkic-round-close-fill</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-search"></use>
+                </svg>
+                <div class="name">search</div>
+                <div class="code-name">#dkic-search</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-round-selected"></use>
+                </svg>
+                <div class="name">round-selected</div>
+                <div class="code-name">#dkic-round-selected</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-shipping-address"></use>
+                </svg>
+                <div class="name">shipping-address</div>
+                <div class="code-name">#dkic-shipping-address</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-round"></use>
+                </svg>
+                <div class="name">round</div>
+                <div class="code-name">#dkic-round</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-share"></use>
+                </svg>
+                <div class="name">share</div>
+                <div class="code-name">#dkic-share</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-servise"></use>
+                </svg>
+                <div class="name">servise</div>
+                <div class="code-name">#dkic-servise</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-siet-fill"></use>
+                </svg>
+                <div class="name">siet-fill</div>
+                <div class="code-name">#dkic-siet-fill</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-square-selected"></use>
+                </svg>
+                <div class="name">square-selected</div>
+                <div class="code-name">#dkic-square-selected</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-sort-fill"></use>
+                </svg>
+                <div class="name">sort-fill</div>
+                <div class="code-name">#dkic-sort-fill</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-sort"></use>
+                </svg>
+                <div class="name">sort</div>
+                <div class="code-name">#dkic-sort</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-square"></use>
+                </svg>
+                <div class="name">square</div>
+                <div class="code-name">#dkic-square</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-star-fill"></use>
+                </svg>
+                <div class="name">star-fill</div>
+                <div class="code-name">#dkic-star-fill</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-square-selected-fill"></use>
+                </svg>
+                <div class="name">square-selected-fill</div>
+                <div class="code-name">#dkic-square-selected-fill</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-stop-v-fill"></use>
+                </svg>
+                <div class="name">stop-v-fill2</div>
+                <div class="code-name">#dkic-stop-v-fill</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-star-half"></use>
+                </svg>
+                <div class="name">star-half</div>
+                <div class="code-name">#dkic-star-half</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-star"></use>
+                </svg>
+                <div class="name">star</div>
+                <div class="code-name">#dkic-star</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-stop-fill"></use>
+                </svg>
+                <div class="name">stop-fill</div>
+                <div class="code-name">#dkic-stop-fill</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-tick"></use>
+                </svg>
+                <div class="name">tick</div>
+                <div class="code-name">#dkic-tick</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-stop-v"></use>
+                </svg>
+                <div class="name">stop-v</div>
+                <div class="code-name">#dkic-stop-v</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-stop"></use>
+                </svg>
+                <div class="name">stop</div>
+                <div class="code-name">#dkic-stop</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-twitter"></use>
+                </svg>
+                <div class="name">twitter</div>
+                <div class="code-name">#dkic-twitter</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-upload"></use>
+                </svg>
+                <div class="name">upload</div>
+                <div class="code-name">#dkic-upload</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-visible"></use>
+                </svg>
+                <div class="name">visible</div>
+                <div class="code-name">#dkic-visible</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-wechat"></use>
+                </svg>
+                <div class="name">wechat</div>
+                <div class="code-name">#dkic-wechat</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-unvisible"></use>
+                </svg>
+                <div class="name">unvisible</div>
+                <div class="code-name">#dkic-unvisible</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-clock-fill"></use>
+                </svg>
+                <div class="name">clock-fill</div>
+                <div class="code-name">#dkic-clock-fill</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#dkic-siet"></use>
+                </svg>
+                <div class="name">siet</div>
+                <div class="code-name">#dkic-siet</div>
+            </li>
+          
+          </ul>
+          <div class="article markdown">
+          <h2 id="symbol-">Symbol 引用</h2>
+          <hr>
+
+          <p>这是一种全新的使用方式，应该说这才是未来的主流，也是平台目前推荐的用法。相关介绍可以参考这篇<a href="">文章</a>
+            这种用法其实是做了一个 SVG 的集合，与另外两种相比具有如下特点：</p>
+          <ul>
+            <li>支持多色图标了，不再受单色限制。</li>
+            <li>通过一些技巧，支持像字体那样，通过 <code>font-size</code>, <code>color</code> 来调整样式。</li>
+            <li>兼容性较差，支持 IE9+，及现代浏览器。</li>
+            <li>浏览器渲染 SVG 的性能一般，还不如 png。</li>
+          </ul>
+          <p>使用步骤如下：</p>
+          <h3 id="-symbol-">第一步：引入项目下面生成的 symbol 代码：</h3>
+<pre><code class="language-html">&lt;script src="./iconfont.js"&gt;&lt;/script&gt;
+</code></pre>
+          <h3 id="-css-">第二步：加入通用 CSS 代码（引入一次就行）：</h3>
+<pre><code class="language-html">&lt;style&gt;
+.icon {
+  width: 1em;
+  height: 1em;
+  vertical-align: -0.15em;
+  fill: currentColor;
+  overflow: hidden;
+}
+&lt;/style&gt;
+</code></pre>
+          <h3 id="-">第三步：挑选相应图标并获取类名，应用于页面：</h3>
+<pre><code class="language-html">&lt;svg class="icon" aria-hidden="true"&gt;
+  &lt;use xlink:href="#icon-xxx"&gt;&lt;/use&gt;
+&lt;/svg&gt;
+</code></pre>
+          </div>
+      </div>
+
+    </div>
+  </div>
+  <script>
+  $(document).ready(function () {
+      $('.tab-container .content:first').show()
+
+      $('#tabs li').click(function (e) {
+        var tabContent = $('.tab-container .content')
+        var index = $(this).index()
+
+        if ($(this).hasClass('active')) {
+          return
+        } else {
+          $('#tabs li').removeClass('active')
+          $(this).addClass('active')
+
+          tabContent.hide().eq(index).fadeIn()
+        }
+      })
+    })
+  </script>
+</body>
+</html>

src/assets/font/iconfont.css

+@font-face {font-family: "dk-iconfont";
+  src: url('iconfont.eot?t=1583206766819'); /* IE9 */
+  src: url('iconfont.eot?t=1583206766819#iefix') format('embedded-opentype'), /* IE6-IE8 */
+  url('data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAACTwAAsAAAAAUHAAACShAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHEIGVgCMagr9eOBNATYCJAOCdAuBPAAEIAWFEQeIdBtBQGUEbBwAKGYdU0S1qI6iTG+S7P8/Jig5th/uR6gCl2US69laU7f4ScsIwcHugDhuvzcY5chUOn8CcvvUSqF102xyk5sglvd5M8fx1QpnkO/uq2F+zv4RK1+DHpIUTYhgrc3eiyLmh6g/4k/MtE4Mw8PX3nfn7d6UWlTrKi4TG2ESQNGFK83FfVCtjsdYuqVLukXCgiC6lXBcM1OAoLn9ObGOYCZ2BcCqmjW7pzTsGhb7kozBnsz5Nj5AS5StWBZ1FOXDTb3T3l3buczsOjSzku74tQ0/pt8SCAJH5oesH+l31f5pV6Y4B5YtS4GD8AGQLE37V/77tTXU3QokUW+WGZ78Re1U8HytXArElUE9vyuFOAox0abRWyb5ZAqXAKexy9Lhebf1/v+ACsoHETQRZDk2gprmQgEFDxQF3OucmaOl1NazO7VxgqM6W3LL0RpUd1utbrZI6naXZGuJL38pyB1QiQe3nOSj3xAoSYXe6BwRQEA7hRN/AMuTqAvD0gCgIAo3pBnj/k9n2Up36wsQHlaBoskVbV66QvNHhtFIux4vzrKWvfQsLxkCtg8Yw2x5+dDeoO8CdhAqYHg9UJcu1dVl+jJ9EWf7ZzJ73zFkMztrGU6XMBM6YwY0pUEqF9FBNrVBbgaMdZCKhhBzGiZ/RkDZuNpn1401QpCngDj/vztCy8IRQmOqJ66hqqnTmI7SDX/q+/i9VjUk6jL5qnbSuZDfgFfzpVw9yK5H6QrQvyEDKciSNJMtQt731FfztIb37n2oEJYi2MTWrhCSLNQNfpfXoFGTZi1atWnXoZNAJJEpVBqdwWSxOVweXyAUiSVSmVyhVKk1Wp3eYDSZLVab3eF0uT1eP3+KyWJzuDy+QCgSS6QyuUKpotUarU5vMJoQ9eRcBbInYNQhWEEgAgmikEEMsohDDgnIIwkFpKCINJSQgTKyUEEOqshDAwrQiCI0oQTNUIYWqEArVKENatAOdeiABnRCE7qgBd3Qhh7oQC90oQ960A99GIABDMIQhmAEhmEURmAMRmEcxmACxmESJmAKJmEapmAGpmEWZmAOZmEe5mABUliEeViCBViGRViBJViFZViDFViHVdiANdiEddiCDdiGTdiBLdiFbdiDHdiHXTiAPTiEfTiCAziGQziBIziFYziDEziHU7iAM7iEc7iCC7iGS7iBK7iFa7iDG7iHW3iAO3iEe3iCB3iGR3iBGrzCE7zBM7zDC3zAK3zCG3zBO3zDB/zAJ/zCF/zBN/zDD4R7BlEH8LvZzL+YovUdPU9FTnxWuSTPfDQ989Ck84rb9GkAC9mUxlyNkQ5hB8nIAkHbjMYjcLUhNShgAF+bIaxgIyNw5Fq04XlNG7KQYOpFHbe2BorqwNcEGI/x2Mq4d7ORKLyqqxVYSu+L5Zg0qG6urd30kHCuxQvQjYLJjFG5aoWlo2uTqjNZ25su5hE4nBMyROas8EGi/0HFMbx3bkXkzRicJxn6RJex49MZdhB+/oGO1a9xMaj4JyGtdQ3snDHCm2w9Mzb6dsF8illtaw2tZiwXCswFW4RG2/oUiOgvcaXSsSHXfqU0wO+nfdSc2UNYHtiC871pnZacUhTMu5b5glF+1UX/EkCRU68sFJgllRzTp+TwzhkNrqeTT9E8kNK2Z3RwX8IvJCuAyT4nMP1M9KP4z90vhp/fENAlxuZIYHTcdlCr+qjpHaA+TDqB1REShldK1B/m0muPHcn5J8Wh1Ud2WDn4xXaUDCBBqCQ4CHyft2cDQlSRrMlO79To4QeIyPzGH0QhltiRNPrNZJWv1AWFuZ/y64l530NjdQySL7BKuVlqXvU9JN5wN9K0S0t8ougB4RG7bxSIhH64dqd4g3haS0MMUXMK05EwwAC5w1BWP5YUDShRCV1NuQJbn4fdc6uSbveEgphmYAmFktN2K5pDABLxTVVfEYt5u9mqypEvAKMapg5UNaexRmS7zCy6BoHW0W9Q3tjaKds3r1K/Oh+03Q646unS28TMYiClKYdJ08E/jooMG33NQlt0dOLvMW5ull55aEvMPcr3JRuPt+mCrz9xfg0p0e+uD62E8ULHeroURIVZU0HMU+HL5GbK+603olLeMyYKm7FTmetWS4E5WfRDm276aLDkVK/DYqwZsoKkJKog+u21gEnjK2QLAInUpSlTXo/KW0mjg4csAim6rjBIPV3nB/VF3rRlQ76X+zrbUQyFEN8Q2hV5tdbW8SAFZP5YDwJ8DTl6MDFVwfiRnJpiLG5aZ5bNpS26sfDpKMYhvoX61cbjAvITo4CZKyjTckpkYP2Bc7bWyCNg2JRDiCgX9lYwdByLAclihv31b6vrWTmRJaHoKNGhT2UHD1gCI1NGk/RzX5yZZep+II/MICvyUfrLrjPlL2IIck5tAhC1DYYxYMxyJIgtx+RK5Zx1wTxPzwqKTaUV87YGuM/qGF7GCmCvg32k0jajo6/HiaJPx/NeN+8R9NvoKTuAXw8lza0NkFhcBVvLS5fEFIg2twMsowRKurSxETPWEaQHLFwFRClDUY7IMsomKcoCnjh7uJ+3vZg2yBSmi6gv+l9i4IJho34u9pgOHoD9K2dBzJ2T7MAv7Euiw7j057w+VX8o/bT22DRbQLKiqU0NUIrqIIF9pwAMzK1HdvknzXzyJKtadpP7OY+iIsiTOW40mvL39OqfmYEkOjeAH/uDKu25LThYRxhwAqmnrk/VH+6R8TEQRFcMUg7rETBE9KFNfyQPWZx203gMnBK5B6WcgDHrU4Lm91Y3LHQJ+WJkDmJDC09A5dmXr6L2znvnI7UlxcZCKRaJ5yMpV+mY3dJQTwlyZACMcD6OBhd2MdJAV7wFIFRZh/3Uw5B3djuwvY+FifcvzJRVnxdDH6GEsQUqAyEKoalUo0F3EQOUa8Ss8vkaWBmM5khoQSljrrOKh9Z5Pd/3YM/QF7dMgkejqeEWh4KvpabOUjoNlJ8Hdt9/Fa7U0W5z4Ia9Pceie2tzse6tbC3trF34lIauethYiQqtNYSuwrZAeEq1mN1rfnkX28v7jsfsGWH4/zHBrSU896I8c2MDVHwnLvxGyZ6Wj72M5VPK7RU8/5I2fXULsXKznf2l2ndCQ1CDhiCdDMeVxc31YH5pC9Gz3/Zfl6fneNweuEZ36kj42zy7PVU5NzLQvrCrp3p+9JuWv4sEkU2B0KqW8gVsidUorQ8ymjGU6LDsDQ+2/J09tWBsyO3skA/bVMy2AjfLuCGCSblUt8US9QhgHSuQIPdzCIbkXIASkDqQkNRHWbYG6S8ND/U75QVKA6wD8CH0pht0azTL59dHMszaVKzO6WgydKuU+oQUNzRoBqbAWposKmwF0IzJ2vhsXfYqVA0FhuEFEQJCFarIERUiWvbeZgi9yncEqKAc9tZmFgOn6Vnj3AhuB8CiQ4hGOhBHmNIe4qF9ipTL40ZnR6Uur9y22iIyNuTr+0WtLfp7uchPjHLz9AWpVpUcB/L6Fg0mVLazxT1z9Wzg0yc30dr5vXD+wuvuiOIuGgtRcQBqa3Tl7G5gPJKtMa293Fj6Y1qFxemnMh1LUJjAvn4Rq6rpj8Kmtx1UOhhagYzVWaK54Q2HaQahBoW+SQEZcSmIt0RV5IjIwzbRuOhPTsqMi+0xpy211yVnk0bp+StNYIKy+qq7OsJWBbtMbJs0yfi4TZigQuxI7bEH6zHHmWITyB4dlUcpsUaYKwgXS+3LLAHZTeLdxVXVtJmAczCPUkX2JGeCtvwBL66GaIrwgNc4rZjVVwnkt0GI+2YgYfhw5QLYxuP9xdF/Yvz2HvsXhY+9PKNNZWEmJs0YMIM/ycCCCrLSQ1UagKFktYzGSdak5DAnss2wAgwhgy2oORAqVjtSMSNnicIVmDmUlmlpRktoKlQO8Zshuyw57SAQX6eE2IST5gaxywJG7O9IluQEoiP1RGacOFCqxhBeGReC15m3e7Eb8oZrDZGLlDTB7RHBHauHZmH96WBXe6UrSsikOSpyDk3JwUxY/MZeGeVVgbUxc0e4yFuIN0U+HxIswXpyQ1EYNS5nXDzNXYG+nI+4Y46gZ13JQ/tqIs7np/Ja4ApKybH6yEQvis4cP7HLC8h+aRvlwk53bk98FeoVBLnv4NYMwOrosm9E0kgRTfWrQhlQQeQT5vvDqR7r6m485yNMdHZ/jtg/ZbhJHs4Mjxple60haWoc4IKifeFE1msSgg9PVhi22rWqqMamSAOHmSowLEXJSqi6lvJWmCAwScrvS8zc/wNWnqGFCnfjuj5mBGxlt1gZ1Mh8NyHaJFPlzshQexlDrH1isAfDdNMD9UEVXoVpswsyDmEGYweuQvglG8sPSI2aY+pobo7oRupRLHFVIziJeAlECcNDoHFfiqaoIvjBi8AAxiFupwICHykK7wHybN0McOEZHAEk7yipgiCIsx3iWMOOK6xMhrPiVhhb6JY34+RyNBWP/3wsiCPqUlQa3norN9kfrVzciY033hLXwpBc74bfrO95wwvDymK3+vbmm2Bm4crtPvP2yGoc1eajSQiKxMEDQwt3uRdtY6tplyufNatmBwbDMOmtyVBNti1VE1HJpKXX9JFubZ48Mp5PZJNF/9jpO7I+SG/+7yYKCSVZ5DXJuYjPkTx0NZWC46e2fpyIV0ezigM1ZR+26TCbsiuuK+UyDOPzDaY4ozlLjmWb0Fso8sQxVFpXV2tO+3OYSeZvyvnk4B3yIOHqUHZk5Omsjo82SOK6sue6q12VZ9Xc7LWhax62REk+G1SSlHMXhPL1K7IYLfKNXem4UumzV0uZZA07Vumkemd74N2BRUxfG43V1ZMbzdgoGzZC6QdyrPDwkjwIQ6BRhWErrq7dd7hja5EJuiNbUfISkcP5K1ZyM6+/XX9j/XWwkNMqj1lsSQr3vLaGDHcHbUP/R/fXqe3lozv+3v9tdlftmExIGOFQUXEpN2g9ZjdZFjkkxXUxTaNMgOJaeVv/MNch35urtGlUrJfOqoo1769sB4wp6yNYFU0yo/lgOirKL4tbkUMqiht5LGMHypAXf42aKPoEhwz1i+vyjr/g4X9podM6oj+6InLE9Hf8ERwJ51H9kTJMravogMnP++EvhLdOS/nLbUnMnb+b3//pm6BIkcHdms9sgoStxQXdf02I/HbP3O7dv2NMrJ0iKv7+jY1X3gCGTdSrv9WafOsQ+MPAHEnb29i3T+Vc0hxsCcrbwdtvL3GgQC/Pq2+++Yc0laDC7KwfqbfQgtHV/pyMBQthRfmJLMdlYbObwG1MpiMeEoLh5g0Ds43HyNAyjKblpovjDK2H8eZNPVM/+jR6aBnjIPbigZMnUQlTgvZeFnEo5AtsXTcwLBbmRjIWq8TD7tjrPk47J09hXrzAwHHqQcBeJrp4iez+9ll70ZX95GJreACqRVPQMFZYYa4F80U6u8omVlOlHas/SFTcBrCu2+vZtIrVdIc9JirgrVthOyoeBOxDLLD8kc5kMjCkDCNTQD8AVKEDUFgBAuczABGkI1gedr+OXWw06QaQgd+FcChDcuzop9M5x4e4neGH+vGloyfa1eBBp0WP7Qgpw3DxjVsl2ewOXLNZIcGCFS01mKutyUQxZ433lXQNvZDaF/fV3vJzmosp9d1FJ7LONLdOvn+sdF1O27jU/XxqIjNavitdBbZh1cY4zVVH+dlDrCzGG2dRKfd4gplrzsdtV+XV3eLdip9yLRfkvEcPBLYlk2mcoWEYb9wcZxl0Wb1Qe+jOfi93DtU8APGP64n6C3QNY9xE5znbJLJJAG4S9UqvuHOoduHYem4XyyaU6xd+AfKSHD12Gj8xCOjdMbSkNzw8cbQ9HLAQHZpW068xYWEYE0iG10DeP6dqf/bWney2BEKRyGSooBBKgpILC9pKqLAQDEYZhDfjIyMBYTUlYTBrC2DhyKuR0Fx8WWUnec9gGyM6g6t8wdTpfrMq3I+8f8APOB8VxO3byJKZTBc5YRy3v8CUDwBdl4nJ0gIRyxYWtp/knjkgoMT7ylmECyZ2OOfCBYKc6QvuiHxlLMeLpokk/zrwRs70AyLyOlRMXGkwdDtw3Y/MzhrcDVNTerqQrm9eWUEUAxs9/zHr4TULlckmooS4Uq83uAtnOHxOT9cnbZbvMjc3V6BhwFOtQ4Vok35Q3ydw75md0buPT052X9bTYFNTGVEIyMIui3HYDXwt28M203U6DuZx5seOGYPvRLiwuN5clm83i4QCpfarQ/Mq6pxrV9Z+XcAi15O7GGDypLOmVxzO2VYc0NRZHrXR60iIo1pNsLpaCX02x4e0h44ZajwQCQ0gaPOXXxo8+fJP/ThDwjA8iwa8hznSQdzA5jm+tbNQLVNKysK3rY6O6LL32BcwgRBiD7OmMS9l6MZxyoOoXaiQKUT13S6JgRWdY/boBdoCHvEsQ3tkOCLBFhC3x6XQPQcxU6hnldZVtdC/Lnraq8D/XUQzAft0zcxYkWuye0ClgC42hlTkLOPZPj4V8OQJQJWGU71QCXqbqtbcDsODpRCm4APhpGrCqvy0nrTEtkQFPSpPDVeC2Knvj8uJ5quNV81M+XG2cLfT+/sGUAnRizlrAZZZJg8V7l9ChZ5i0gBJ7ClEb/bXdGA3GghrcsZosfd19ibEi2mVtZKWOCboDvc+9w7UkJyyRnj1KkfRQfyj28hbXLuP0IQrLnPkXR5rLygcBQ8LRkEvQMa9oGgU3GKPa4/vBdZDuDgc/M4uZA/mmhwrBPzTgE+VHTQaP9F6+bbdXAFGz5KSM2JRE6jPtWiIQ1y0uQ8sEnSA4CVrour43cTXcpLY0ohKUfkJxrSc55R5EcM8JagXKlwEiyLKQxOZiUQecxZEZaxrSmjCn3VQ4s/g/R1mNnc4i98z4XEQJcLl+fO4oB/OnTPddH33drkkY6BfHyE89N98O0gfdBx6Orj/xjfZ44wwWgQdjEroXJVSSSeVK0RnZUwVJGf8qAeSxJzsmRRP3+Smcr+qyh8rynzqoVK/zLRMyJyaNXk4pHBC5p/vkZqKYu8I8J3MbiF4IcQabA2fN58/2lO1FjEaRw9LflsZDRHNd2ldVhyNJPEMQ2FFVaUCKKGKKkjpFpLwdlsRNg4VguuL3bcrM0v960GZd4WWlqQyS/3qoTKfCjC5URgtEAChIFooBIKFc4IYQY86tK+ef5K/xaJdeFbyzH+kbLTscut5sFheUv9FY/4EJSrTaaeH1OfmRmqg6YzjQ6fTYOe6Rl7jKx4a8ngGGElAYJZH55COtS+R6uR5QFH78ypXm7KVq3lnCWUQDSwfW/50Q0qKW6mbszZs/2ruuEFbvqzbdutGC5bYLWqIF4r+Gw9S+j1XOOG1BldIk9R8qKD3u+uxlIrpaoer0e3/GnmQ9MS3quYaBJV4ir02TuVM5iC0feMnYx+U7Cv9596fkHaiYo3s/hsUB2kiLjt4/33vboXpSdIgGNw0NrattG/l37DlD+1EWUfU2CcJrT6qv5F78xAEwB5YBW6SsS39g7ajoeU0T8NIJQfdCX7m9pEdSh3IfU97v0s7SfkJzhVHCd4/pu2/gcHS49+pmmowFjFLbIkXiF6NByqjONxbamyKDgK3xjJgubtBIPIycAMJCW032B6ctdit2Ipz65Nq9ZYu/MhZoP3vWF+14HIf7Q/us+0+sG5fC2zkOEQb1JN4AzGs4Ja8CbthaqQeagSff4zZ3iS/dps44MvCbVQmdLutGa7c0KQGGdCWdqSw6XidjRQaXagkbl0Uy22LmETMwGOvSB7Yakv9qMv9hap6R9r/C5wfpQvv1m5XTModDuJu3kD2EzFFFT/l1CsLczPe3CrP0Vbl1FX+jBQRkTHLzeFuAO/nntNWi9OVsnQmpp/U552D0wjxwU252S38Rfse+MQksiXpe1OpKLiZ1pKZ2UJrDhaVOkKaxkaNJD05GYtdOSpV3yngP9ExVRyswkss2vhjOZDwoP24PRNoCsDZu92XjvI+qM+5TOILjzohnojpqGkzlrb02HkP/f0VJ2OeB13T9b9SODy6IihWofBbCZQQfHTyI3LNhDeOvBP3Nqw2noZlubw3gINyGjvUsAbGuxLKQS7HelFxj3747JxnfTuHxp7uUCzj2xArxrYCFadX0aWB4Y7oMXUaefkSseP0RAAPjynm9IsXlKXTqxQ6vg1j5ZK5yxSnOwKkBCmTKjjdHurQjrXiqvDsM61kMg84x/yyuXjfKYFzOwmQ2iC+K9qdAXkb7tKArJP7SgBR3dpoZ0QbqbPUV5izeylFZ6myelGFNzE+h1tnD2yRiDmY8m5p/bdTvJ//P99xUCOi7Olg8y5umHIWPJlcWZYtz0OZIijJJ/uL6SMIm7J/Y9nWa1s1n2qcbF8zbtMK0ctECKpYFeABPaYfGvFxwakySBM6MOFcQuHtL9m/SCml9PfifhWeDR1Z+ObStWvlhFzPUBLNEVlb+GyZHhle0Bus5RjavPuINXccZJAiJaOjpzy0HkMg4t790d2Gkd0NTSv8VwzE9r07MgKqzij6+pWn5uQ7Jb19myhmiol9fksYM8wCeYLbCo+030B60dPy8+iq7WPgoRLoeNfP2zX9vf2vZ7tbu7Xl7Ad+ZeS0OlecYrOmyHGVj7vy+pd09fjOfB+YA8/B9itOrM+fg+veO7mj/HEfhZ9dCMGAuZ1F+ftfRcgFllN7MWx9GxaGzedIyG4lFRYglCmsIt+ybX3JCY0LXxn7bd+a9w5vTSrFIJHHCelbCOX3tkWot8qovckf24urWK6y94VDV3emeBMw/JKBjYmqUMoFr7UcBEB7l4tJ37Pn6c0DJQhfxD8xMc7IP/+YD2EYBYLCQBefyh6gXkuq4Vb1ZveTPvV0Wx4NsjPvS4L6XQp/rCwa5A6DzOGgUyBZBr7rsqMtdRObk/hvyn2+62hZ5F+uJV46BW/QrdqKu7j2MhuAaC/9i8T3KsVC+8mQYOntlvZJOQF+Tuhzxri4ON+96hHPEY+DPB8gCBX88pUggdO381NHrcnY2oF3eqg3Atv6LxH8TMi4v3FDxJ5cvUYZ0Lk6WaY8Oas81dd3SoFrmc7em7B2beLohA43b+0qpOYhaO3avQmHP7p1S49SA5jUAnmCiE/+G9k1KJP6phV+K/pj+94ctgjhlNAnzDQkJ9f0gjumHVw5s3AYs5UIIUHSQqnXbqGYS8stCTCc/j0EM6ZxdHTY8NCgXxpeBUW1HuleGBoeGbbq9Uv12ADGprWboSu7Atb7dqY8rU6vTbXZNcgvPv+cjMdvoGRffJGdHboQ1Mpv+W5b5x874LNnkQ+RHYPsqNGAgITp/aFv6dF+48wPIFlrx6ukCifjRzuVFNcv7ASul4+BAWxbVlhHkA2ffqqDU6ooyIYjI4eJGRkWy9KJThnq3kTdXbDNVYbH91vkXmdZW34lTnTV8L7cQ8DLtro2p7Em+HySkgAR1+Trvf7+VwazxinuLnqXHIqR8rEo59tv1mw742Ho7Z2bwPz3H2ZCSvfTRNGlcO+Zszvg8+vWvbJj335Ldx9RAgSiGcyXhpEh5M6l44ZoxQt2/zvs+4W1S/VlYyV17dGhTng9fGwIz4Oqs0QhEZps5+2ymJ2IZstuVvsEuHrGUVml6rK+oO1yMv+fNF+Nakm7SBLSg/ndJC1Ls7h7UcKSKr1JksXq+epj/xJAODCptgfrVT3ysD3rZRjyN3nLhurcck+dyHMzrnXLT+l72aL+4hdU7Knq4UucnfN2/OSO4xQfSryH4YwptAloIiVEudVCSbx3MiXl+1+IYs+0Hr6UTNbapQfgOKrDgscI79L7I2gCJV6xdZGSKER8RB94iXkiH94H3MSQNVLnJIe7Ce9U9gD+gPNp1mkmu3NDR7jGqtG0D+0VhCaWoqWCBEF03Kfs1q0upMREyAVyFqn0DiubIGvJLk0hqZLUDxBETdcyl3ZXe0d2TtSMOYZ0uVbtIjKO/FyIYBB3VdNCuhyTPaXxO2toH7fiI5wXv5APjCd7TkR2elfvXgKR+3QzWIu0gfi7b1rEYSHdPnI8DS/v8Q4P6n+rFlZa/g6XOqwkJGx2GXQe3OwA5TvvII4miLX8NQ8ix9A2T42tiAM8uoVDo+0avgPDOzo3MNlLp41OKV4/AHsDO/H1hJgIcx8cyZRRgikyZiR8KYgS6Rk5gu67HLAo7JUvbnsF/XI9NBTzEaAwCMTlfKdmpW/AojjU/PHY1f+HuWD2i+3Pt8U19Psrrn5r16GYdDqehLDQDbdsz6IR3YMaF/s+wLlOinM3XrtvUK3Wu7/62E6hBMVxuVW0qpk2WtsHPGMsHw2Wwmls+tGllFu1KA/ULTwNLND4RtVNo3yP5QxxD/GMpW/nboHJ8J5mLjGY6Z4+jhEFXZO/HsEKC+mGa6i/wt2+eebrA8fHwxMC4VFTr0vemlcbEuRIEBHbm0RPRo3bwm+1i5nQ5jUuXttKU/PvI5ejDiHb6YPd3ccPDLoL6OSbdzp2//abfkA8eXJeQSaYRfu+Jv+y3dPx9lcr40K1lTvrZdWSe7XJjSnVhmRZbwXsc/IUnAHV10P2yKivy4CxqqtrgNLhq8/6DAB2EL5UimCkEj4kir8iCCKRguBteLPLrOg2AeDf/LrLEXVbXGZzhAiLukjnu4YgCCLYXuRD+FmXGeqMy+zJB8LHKKCS/ZIl9womJftJHSBZS3EmlAo1qOYcUkFNFpRILSMGppAwD5HDHjKoJN2DUaKSQXKonhkGHA3i69BRs7NYzLZe94RVcN37F+cwM9+zsPx0/3ClY96DGQiRJJ2cjCtMS+W8J4/KzuK2i0aQKmVqC0NqgVyuK7wf4cjE0srkk1E1KVypQy09kmCO3z98fpHV0b5+85qssVwyGTtxrfNfCPWihkup4ARVowbR1xKC6OMXOce6lJqS26hTK7wVm+QETOjPuXapU2p7ffEnDgb77E0LR3NTAwXYfdlpPRGBGlWwUihUqkPKYoWYoux2qYLy/+G3pNl1F4/ZG+1TJhvdcn/qPP7hQYmej5Lspc5rgtcU8zXpIWUZwT08sVdPjHGbmrqlnarJbsugrSK309Sg4tGLruXil/RPjz06AkAxZlvOAqJTDECuAlA25N+RLiVQNmEz205geMhB239bK2COF7mknTBSJHjA9je4Bf4EgNKJ3AxpaEXYSA9wDvIB+C8FhLQAUHpDnVobS7qQS3UMdi7qwiB60cf5P44NIqr9dfleaF1FXYhNNJgwAJl1yTrvQhZQ4sZnA0KkinyPJtsAEKBnNqzEAKQKobe5Ibr2UV1ireMPsgPrEr9wX7P9sl1HUqOarweEdCo/AMqH+QKyFkUdhJJNKLaKO2lFKvGl8Z+NB4K8DyIjtZcNTg0uCLHp4ZTiKC6D/Bm+ct52B4DAXWa7BZn41Na/yHUFnvtoJUVozDN7wj/paj5uetygbNdnCwA0gotINcN/f2MYskP4bJ/ZJDmcT4PVHjbz1CzRk3umyxyxa1krW0k7+Wdi0jrXZGxqrHFc61o4bH+45P4q48EYU0YW6jsMPY/2I8KpIuAY2oavgZMOIQKguROgOasBCpBl3eDO9aT1sWFDCJrcH5rYYQ3NCHzEsAjEOkusWG+RDW0WANRbb0EBnQABhQMA5kB/ZyiEBs4MhRFdIwhlmScYsDwTsPtABBFnYQ/Fy4SWx0ngDYnn5l9GEDRqOiunKVg1S2fWAS77F87ZA1uh4+P/ISe3snobX4nmLwzI6fpJ+/wuYpVl2tTn8I6h96Qi0w9qGReR+HE4WCqJUdN20VmMIGjUdN6c3mkK9oZLd60DvHt+4Zw9sHsspsZ/yAkBrhr1Nr7yxC8auBHbaEz7/C4OENudZdrUZxhHnzWQinRnP6hlXALc8eOAk7NcOtavbQ8l9AY6Rrl5+GyQISZLjjwFin/keDmClDIVqoIoyYqq6YZp2Y7r+UEYxUma5UVZ1U3b9cM4zcu67cd53c/7+yvTsp0vfZVXIY9XGMVJmuVFWem6abt+GKd5zv+LBsx0GgzlyeP2Kz6FazCmhImyNOD9YJ33TyVasZsXuTHpXl7tTt6yRysVeBfhfD8uzbFbFJ9Cc8jP0R9CaFcbrolcV6nd0nLqCA2EsiEu0Ha7w+2yT2xxrXUslOM9GZEFmNHjfFtyqxakgWUAY1rnXWpPCQs7s8ml7Q4cE91ELMuxb5YrR5/boNfGgsaJaO0NehQc9lChcULcGjDkAqVpku4JTMApdmInWCx58VbDPKVApaXwaWPnNphnwbVlh8Gk0oxdeUwJQ7GB80UzlHYvX94SthTLuFDAq+OxjR7OSQFuy3V0uv7+ThE09kw5mOG8q3cz2wXCihCoPtutE3rUgrlZLUd9FHIT5MspzJr4IbJ8AVyRhMB6uYsY+JAWF6MLc59wEC37Ucu0AGOdkHc3qtrk8KrQ79Mx59p9q9pEPFGKvVoVNbRJgInJvXDxuHWfhOKwnxdcrn4Bb4s9bfNxqkZxeq1YCGNTrOXkRJCrHK8/UjdqK27yWJ1QLyBtDgbtbhTW9tQ7lIsR') format('woff2'),
+  url('iconfont.woff?t=1583206766819') format('woff'),
+  url('iconfont.ttf?t=1583206766819') format('truetype'), /* chrome, firefox, opera, Safari, Android, iOS 4.2+ */
+  url('iconfont.svg?t=1583206766819#dk-iconfont') format('svg'); /* iOS 4.1- */
+}
+
+.dk-iconfont {
+  font-family: "dk-iconfont" !important;
+  font-size: 16px;
+  font-style: normal;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+.dkic-arrow-double-down:before {
+  content: "\e625";
+}
+
+.dkic-add:before {
+  content: "\e626";
+}
+
+.dkic-about:before {
+  content: "\e627";
+}
+
+.dkic-all-fill:before {
+  content: "\e628";
+}
+
+.dkic-arrow-double-right:before {
+  content: "\e629";
+}
+
+.dkic-arrow-v-down:before {
+  content: "\e62a";
+}
+
+.dkic-arrow-left:before {
+  content: "\e62b";
+}
+
+.dkic-alipay:before {
+  content: "\e62c";
+}
+
+.dkic-arrow-double-up:before {
+  content: "\e62d";
+}
+
+.dkic-arrow-down:before {
+  content: "\e62e";
+}
+
+.dkic-arrow-up:before {
+  content: "\e62f";
+}
+
+.dkic-arrow-v-left:before {
+  content: "\e630";
+}
+
+.dkic-about-fill:before {
+  content: "\e631";
+}
+
+.dkic-all:before {
+  content: "\e632";
+}
+
+.dkic-arrow-vv-down:before {
+  content: "\e633";
+}
+
+.dkic-arrow-double-left:before {
+  content: "\e634";
+}
+
+.dkic-arrow-vv-left:before {
+  content: "\e635";
+}
+
+.dkic-arrow-vv-right:before {
+  content: "\e636";
+}
+
+.dkic-arrow-vvv-left:before {
+  content: "\e637";
+}
+
+.dkic-arrow-v-up:before {
+  content: "\e638";
+}
+
+.dkic-arrow-vvv-right:before {
+  content: "\e639";
+}
+
+.dkic-arrow-vvv-down:before {
+  content: "\e63a";
+}
+
+.dkic-arrow-right:before {
+  content: "\e63b";
+}
+
+.dkic-arrow-v-right:before {
+  content: "\e63c";
+}
+
+.dkic-cart-add-fill:before {
+  content: "\e63d";
+}
+
+.dkic-close:before {
+  content: "\e63e";
+}
+
+.dkic-cart:before {
+  content: "\e63f";
+}
+
+.dkic-cart-add:before {
+  content: "\e640";
+}
+
+.dkic-cart-fill:before {
+  content: "\e641";
+}
+
+.dkic-arrow-vvv-up:before {
+  content: "\e642";
+}
+
+.dkic-arrow-vv-up:before {
+  content: "\e643";
+}
+
+.dkic-clock:before {
+  content: "\e644";
+}
+
+.dkic-facebook:before {
+  content: "\e645";
+}
+
+.dkic-delete-fill:before {
+  content: "\e646";
+}
+
+.dkic-editor:before {
+  content: "\e647";
+}
+
+.dkic-date-fill:before {
+  content: "\e648";
+}
+
+.dkic-delete:before {
+  content: "\e649";
+}
+
+.dkic-download:before {
+  content: "\e64a";
+}
+
+.dkic-favorite:before {
+  content: "\e64b";
+}
+
+.dkic-help:before {
+  content: "\e64c";
+}
+
+.dkic-favorite-fill:before {
+  content: "\e64d";
+}
+
+.dkic-date:before {
+  content: "\e64e";
+}
+
+.dkic-help-fill:before {
+  content: "\e64f";
+}
+
+.dkic-image-fill:before {
+  content: "\e650";
+}
+
+.dkic-friends:before {
+  content: "\e651";
+}
+
+.dkic-image:before {
+  content: "\e652";
+}
+
+.dkic-lessen:before {
+  content: "\e653";
+}
+
+.dkic-mail:before {
+  content: "\e654";
+}
+
+.dkic-lock:before {
+  content: "\e655";
+}
+
+.dkic-mail-fill:before {
+  content: "\e656";
+}
+
+.dkic-map:before {
+  content: "\e657";
+}
+
+.dkic-phone:before {
+  content: "\e658";
+}
+
+.dkic-qq:before {
+  content: "\e659";
+}
+
+.dkic-play-fill:before {
+  content: "\e65a";
+}
+
+.dkic-play:before {
+  content: "\e65b";
+}
+
+.dkic-pic:before {
+  content: "\e65c";
+}
+
+.dkic-QQspace:before {
+  content: "\e65d";
+}
+
+.dkic-round-close:before {
+  content: "\e65e";
+}
+
+.dkic-round-add-fill:before {
+  content: "\e65f";
+}
+
+.dkic-none:before {
+  content: "\e660";
+}
+
+.dkic-round-selected-fill:before {
+  content: "\e661";
+}
+
+.dkic-round-add:before {
+  content: "\e662";
+}
+
+.dkic-round-lessen-fill:before {
+  content: "\e663";
+}
+
+.dkic-round-lessen:before {
+  content: "\e664";
+}
+
+.dkic-round-close-fill:before {
+  content: "\e665";
+}
+
+.dkic-search:before {
+  content: "\e666";
+}
+
+.dkic-round-selected:before {
+  content: "\e667";
+}
+
+.dkic-shipping-address:before {
+  content: "\e668";
+}
+
+.dkic-round:before {
+  content: "\e669";
+}
+
+.dkic-share:before {
+  content: "\e66a";
+}
+
+.dkic-servise:before {
+  content: "\e66b";
+}
+
+.dkic-siet-fill:before {
+  content: "\e66c";
+}
+
+.dkic-square-selected:before {
+  content: "\e66d";
+}
+
+.dkic-sort-fill:before {
+  content: "\e66e";
+}
+
+.dkic-sort:before {
+  content: "\e66f";
+}
+
+.dkic-square:before {
+  content: "\e670";
+}
+
+.dkic-star-fill:before {
+  content: "\e671";
+}
+
+.dkic-square-selected-fill:before {
+  content: "\e672";
+}
+
+.dkic-stop-v-fill:before {
+  content: "\e673";
+}
+
+.dkic-star-half:before {
+  content: "\e674";
+}
+
+.dkic-star:before {
+  content: "\e675";
+}
+
+.dkic-stop-fill:before {
+  content: "\e676";
+}
+
+.dkic-tick:before {
+  content: "\e677";
+}
+
+.dkic-stop-v:before {
+  content: "\e678";
+}
+
+.dkic-stop:before {
+  content: "\e679";
+}
+
+.dkic-twitter:before {
+  content: "\e67a";
+}
+
+.dkic-upload:before {
+  content: "\e67b";
+}
+
+.dkic-visible:before {
+  content: "\e67c";
+}
+
+.dkic-wechat:before {
+  content: "\e67d";
+}
+
+.dkic-unvisible:before {
+  content: "\e67e";
+}
+
+.dkic-clock-fill:before {
+  content: "\e67f";
+}
+
+.dkic-siet:before {
+  content: "\e680";
+}
+

src/assets/font/iconfont.js

+!function(p){var a,o='<svg><symbol id="dkic-arrow-double-down" viewBox="0 0 1024 1024"><path d="M512 895.488L62.6176 446.1056A35.84 35.84 0 0 0 11.9296 496.64l474.7264 474.7264a35.84 35.84 0 0 0 50.688 0L1012.0704 496.64a35.84 35.84 0 0 0-50.688-50.688z"  ></path><path d="M512 501.76L62.6176 52.48a35.84 35.84 0 0 0-50.688 50.688l474.7264 474.7264a35.84 35.84 0 0 0 50.688 0l474.7264-474.7264a35.84 35.84 0 0 0-50.688-50.688z"  ></path></symbol><symbol id="dkic-add" viewBox="0 0 1024 1024"><path d="M988.16 476.16h-440.32V35.84a35.84 35.84 0 0 0-35.84-35.84 35.84 35.84 0 0 0-35.84 35.84v440.32H35.84a35.84 35.84 0 0 0-35.84 35.84 35.84 35.84 0 0 0 35.84 35.84h440.32v440.32a35.84 35.84 0 0 0 35.84 35.84 35.84 35.84 0 0 0 35.84-35.84v-440.32h440.32a35.84 35.84 0 0 0 35.84-35.84 35.84 35.84 0 0 0-35.84-35.84z" fill="#333333" ></path></symbol><symbol id="dkic-about" viewBox="0 0 1024 1024"><path d="M512 1024a512 512 0 1 1 512-512 512.5632 512.5632 0 0 1-512 512z m0-950.528A438.528 438.528 0 1 0 950.528 512 438.9888 438.9888 0 0 0 512 73.472z m-55.0912 199.68A55.0912 55.0912 0 1 0 512 218.112a55.1424 55.1424 0 0 0-55.0912 55.0912zM512 805.888a36.7104 36.7104 0 0 1-36.7104-36.7616V438.528a36.7104 36.7104 0 0 1 73.4208 0v330.5984a36.7104 36.7104 0 0 1-36.7104 36.7616z" fill="#333333" ></path></symbol><symbol id="dkic-all-fill" viewBox="0 0 1024 1024"><path d="M479.948827 543.999973v383.999981A95.948795 95.948795 0 0 1 384.000032 1023.999949H96.000046A95.948795 95.948795 0 0 1 0.000051 927.948754V639.999968a95.948795 95.948795 0 0 1 95.999995-95.999995z m447.999978 0A95.999995 95.999995 0 0 1 1024 639.999968v287.948786A95.999995 95.999995 0 0 1 927.948805 1023.999949H640.000019a95.999995 95.999995 0 0 1-95.999995-95.999995v-383.999981zM384.000032 0a95.948795 95.948795 0 0 1 95.948795 96.051195v383.999981h-383.999981A95.948795 95.948795 0 0 1 0.000051 383.999981V96.051195A95.948795 95.948795 0 0 1 96.000046 0z m399.97438 0a239.974388 239.974388 0 1 1 0 479.948776 239.974388 239.974388 0 0 1 0-479.948776z" fill="#333333" ></path></symbol><symbol id="dkic-arrow-double-right" viewBox="0 0 1024 1024"><path d="M895.488 512l-449.3824 449.3824a35.84 35.84 0 0 0 50.688 50.688L971.52 537.6a35.84 35.84 0 0 0 0-50.688L496.64 11.9296a35.84 35.84 0 0 0-50.688 50.688z"  ></path><path d="M501.76 512l-449.28 449.3824a35.84 35.84 0 0 0 50.688 50.688L577.8944 537.6a35.84 35.84 0 0 0 0-50.688L103.168 11.9296a35.84 35.84 0 0 0-50.688 50.688z"  ></path></symbol><symbol id="dkic-arrow-v-down" viewBox="0 0 1024 1024"><path d="M1024 512A512 512 0 1 1 512 0a512.5632 512.5632 0 0 1 512 512z m-950.8352 0A438.8352 438.8352 0 1 0 512 73.1648 439.3472 439.3472 0 0 0 73.1648 512z m452.9664 123.8528h0.4096a36.352 36.352 0 0 0 11.4688-7.5776l182.1184-181.6064A36.5568 36.5568 0 0 0 668.7232 394.24l-156.2112 155.9552-155.3408-157.0304a36.5568 36.5568 0 1 0-51.968 51.2L486.4 627.7632a36.4544 36.4544 0 0 0 39.7312 8.0896z" fill="#333333" ></path></symbol><symbol id="dkic-arrow-left" viewBox="0 0 1024 1024"><path d="M749.3632 1022.5664a35.84 35.84 0 0 1-25.6-10.496L249.2928 537.6a35.84 35.84 0 0 1 0-50.688l474.7264-474.9824a35.84 35.84 0 1 1 50.688 50.688L325.3248 512l449.3824 449.3824a35.84 35.84 0 0 1-25.344 61.184z"  ></path></symbol><symbol id="dkic-alipay" viewBox="0 0 1024 1024"><path d="M279.668158 550.617023c-22.626867 2.252448-65.269808 12.183698-88.459787 32.6605-69.672321 60.560144-28.002027 171.339645 113.083142 171.339645 81.90721 0 163.81442-52.215846 228.316348-135.914777-91.480115-44.485854-169.240773-76.378474-252.939703-68.085368z" fill="#009FE9" ></path><path d="M805.666023 627.149072c114.414134 38.189237 176.765998 49.093134 190.485456 51.192007a511.920064 511.920064 0 1 0-57.488623 116.564198c-86.616875-34.042684-244.083486-97.264812-327.628841-137.245769-79.808338 97.930308-182.909039 157.466612-289.797948 157.466612-181.117319 0-242.291766-157.466612-156.801115-261.642345 18.685082-22.575675 50.577702-44.178701 99.77322-56.311207 77.095162-18.787466 199.904785 11.825353 314.933223 49.605054a620.549501 620.549501 0 0 0 51.192007-124.396575H275.777565v-35.834405h182.653079V322.249482H237.076409V286.72223h221.354235V194.934963A15.357602 15.357602 0 0 1 473.071558 179.219017h90.507467v107.503213h218.948212v35.834404h-218.89702v63.887624H742.495088a732.045691 732.045691 0 0 1-75.76417 190.536648c54.058759 19.504154 102.742357 38.035661 138.935105 50.168166z" fill="#009FE9" ></path></symbol><symbol id="dkic-arrow-double-up" viewBox="0 0 1024 1024"><path d="M512 128.512l449.3824 449.3824a35.84 35.84 0 1 0 50.688-50.688L537.6 52.48a35.84 35.84 0 0 0-50.688 0L11.9296 527.36a35.84 35.84 0 0 0 50.688 50.688z"  ></path><path d="M512 522.24l449.3824 449.3824a35.84 35.84 0 1 0 50.688-50.688L537.6 446.1056a35.84 35.84 0 0 0-50.688 0L11.9296 920.832a35.84 35.84 0 1 0 50.688 50.688z"  ></path></symbol><symbol id="dkic-arrow-down" viewBox="0 0 1024 1024"><path d="M1022.5664 274.6368a35.84 35.84 0 0 1-10.496 25.6L537.6 774.7072a35.84 35.84 0 0 1-50.688 0L11.9296 299.9808a35.84 35.84 0 0 1 50.688-50.688L512 698.6752l449.3824-449.3824a35.84 35.84 0 0 1 61.184 25.6z"  ></path></symbol><symbol id="dkic-arrow-up" viewBox="0 0 1024 1024"><path d="M1.4336 749.3632a35.84 35.84 0 0 1 10.496-25.6l474.7264-474.4704a35.84 35.84 0 0 1 50.688 0l474.7264 474.7264a35.84 35.84 0 1 1-50.688 50.688L512 325.3248l-449.3824 449.3824a35.84 35.84 0 0 1-61.44-25.344z"  ></path></symbol><symbol id="dkic-arrow-v-left" viewBox="0 0 1024 1024"><path d="M512 1024a512 512 0 1 1 512-512 512.5632 512.5632 0 0 1-512 512z m0-950.8352A438.8352 438.8352 0 1 0 950.8352 512 439.3472 439.3472 0 0 0 512 73.1648z m-123.8528 452.9664v0.4096a36.352 36.352 0 0 0 7.5776 11.4688l181.6064 182.1184A36.5568 36.5568 0 0 0 629.76 668.7232L473.8048 512.512l157.0304-155.3408a36.5568 36.5568 0 1 0-51.2-51.968L396.2368 486.4a36.4544 36.4544 0 0 0-8.0896 39.7312z" fill="#333333" ></path></symbol><symbol id="dkic-about-fill" viewBox="0 0 1024 1024"><path d="M512 0a512 512 0 1 0 512 512A512.5632 512.5632 0 0 0 512 0z m36.7104 769.1264a36.7104 36.7104 0 1 1-73.4208 0V438.528a36.7104 36.7104 0 0 1 73.4208 0zM512 328.3456a55.1424 55.1424 0 1 1 55.0912-55.1424A55.1424 55.1424 0 0 1 512 328.3456z" fill="#333333" ></path></symbol><symbol id="dkic-all" viewBox="0 0 1024 1024"><path d="M784.025612 71.679996a168.294392 168.294392 0 1 1-168.396792 168.294392A168.499192 168.499192 0 0 1 784.025612 71.679996M384.000032 71.679996a24.319999 24.319999 0 0 1 24.319999 24.319999v312.319985h-312.319985A24.319999 24.319999 0 0 1 71.680048 383.999981V96.051195A24.319999 24.319999 0 0 1 96.000046 71.679996H384.000032m543.948773 543.999973A24.319999 24.319999 0 0 1 952.320004 639.999968v287.948786a24.319999 24.319999 0 0 1-24.319999 24.319998H640.000019a24.319999 24.319999 0 0 1-24.319999-24.319998v-312.319985h312.319985m-519.679974 0v312.319985A24.319999 24.319999 0 0 1 384.000032 952.319952H96.000046a24.319999 24.319999 0 0 1-24.319998-24.371198V639.999968a24.319999 24.319999 0 0 1 24.319998-24.319999h312.319985M784.025612 0a239.974388 239.974388 0 0 0 0 479.948776 239.974388 239.974388 0 0 0 0-479.948776zM384.000032 0H96.000046A95.948795 95.948795 0 0 0 0.000051 96.051195V383.999981a95.948795 95.948795 0 0 0 95.999995 95.999995h383.999981v-383.999981A95.948795 95.948795 0 0 0 384.000032 0z m543.948773 543.999973h-383.999981v383.999981A95.999995 95.999995 0 0 0 640.000019 1023.999949h287.999986A95.999995 95.999995 0 0 0 1024 927.948754V639.999968a95.999995 95.999995 0 0 0-95.999995-95.999995z m-447.999978 0h-383.999981A95.948795 95.948795 0 0 0 0.000051 639.999968v287.948786A95.948795 95.948795 0 0 0 96.000046 1023.999949H384.000032a95.948795 95.948795 0 0 0 95.999995-95.999995v-383.999981z" fill="#333333" ></path></symbol><symbol id="dkic-arrow-vv-down" viewBox="0 0 1024 1024"><path d="M63.2832 222.7712c-52.224 0-85.6064 69.7344-45.6192 109.7216l449.3824 449.3824a61.9008 61.9008 0 0 0 89.9072 0l449.4336-449.3824c38.9632-39.0144 8.5504-109.7216-44.9536-109.7216z" fill="#333333" ></path></symbol><symbol id="dkic-arrow-double-left" viewBox="0 0 1024 1024"><path d="M128.512 512l449.3824-449.3824a35.84 35.84 0 0 0-50.688-50.688L52.48 486.656a35.84 35.84 0 0 0 0 50.688L527.36 1012.0704a35.84 35.84 0 1 0 50.688-50.688z"  ></path><path d="M522.24 512l449.3824-449.3824a35.84 35.84 0 1 0-50.688-50.688L446.1056 486.656a35.84 35.84 0 0 0 0 50.688l474.7264 474.7264a35.84 35.84 0 1 0 50.688-50.688z"  ></path></symbol><symbol id="dkic-arrow-vv-left" viewBox="0 0 1024 1024"><path d="M800.794785 64.721933c0-52.145633-69.629757-85.477939-109.556953-45.550744L242.529773 467.930371a61.756789 61.756789 0 0 0 0 89.721162l448.708059 448.759183c38.955855 38.904732 109.556952 8.537569 109.556953-44.886143V64.721933z" fill="#333333" ></path></symbol><symbol id="dkic-arrow-vv-right" viewBox="0 0 1024 1024"><path d="M222.772024 960.71698c0 52.223851 69.734201 85.606156 109.721288 45.61907l449.381119-449.381119a61.900624 61.900624 0 0 0 0-89.906944L332.493312 17.615668c-39.014289-38.963089-109.721287-8.550376-109.721288 44.953472v898.14784z" fill="#333333" ></path></symbol><symbol id="dkic-arrow-vvv-left" viewBox="0 0 1024 1024"><path d="M1024.939571 515.584a34.816 34.816 0 0 0-34.816-34.8672H108.049971l410.5728-410.5216a33.4336 33.4336 0 0 0-47.2576-47.2576L8.670771 485.4272a33.4336 33.4336 0 0 0 0 47.2064l435.2 435.2a33.3824 33.3824 0 0 0 47.2576-47.2064l-370.176-370.2272h869.1712a34.7648 34.7648 0 0 0 34.816-34.816z" fill="#333333" ></path></symbol><symbol id="dkic-arrow-v-up" viewBox="0 0 1024 1024"><path d="M0 512a512 512 0 1 1 512 512A512.5632 512.5632 0 0 1 0 512z m950.8352 0A438.8352 438.8352 0 1 0 512 950.8352 439.3472 439.3472 0 0 0 950.8352 512zM497.8688 388.1472h-0.4096a36.352 36.352 0 0 0-11.4688 7.5776l-182.3232 182.016A36.5568 36.5568 0 1 0 355.2768 629.76L511.488 473.8048l155.3408 157.0304a36.5568 36.5568 0 1 0 51.968-51.2L537.6 396.2368a36.4544 36.4544 0 0 0-39.7312-8.0896z" fill="#333333" ></path></symbol><symbol id="dkic-arrow-vvv-right" viewBox="0 0 1041 1024"><path d="M0.000358 509.0304a34.8672 34.8672 0 0 0 34.8672 34.8672h882.2272l-410.5216 410.5216a33.3824 33.3824 0 0 0 47.2064 47.2576l462.336-462.4896a33.3824 33.3824 0 0 0 0-47.2576l-435.2-435.2a33.4336 33.4336 0 1 0-47.2576 47.2576l370.0736 370.0224H34.867558a34.8672 34.8672 0 0 0-34.8672 35.0208z" fill="#333333" ></path></symbol><symbol id="dkic-arrow-vvv-down" viewBox="0 0 1025 1024"><path d="M500.702822 0.000613a34.747169 34.747169 0 0 0-34.798268 34.74717V915.077537L56.194549 505.520828a33.367502 33.367502 0 0 0-47.164173 47.164173l461.575266 461.575265a33.418601 33.418601 0 0 0 47.164172 0l434.339617-434.339616a33.367502 33.367502 0 0 0-47.164173-47.164173l-369.290871 369.290872V34.747783a34.747169 34.747169 0 0 0-34.951565-34.74717z" fill="#333333" ></path></symbol><symbol id="dkic-arrow-right" viewBox="0 0 1024 1024"><path d="M274.6368 1.4336a35.84 35.84 0 0 1 25.6 10.496l474.7264 474.7264a35.84 35.84 0 0 1 0 50.688l-474.9824 474.7264a35.84 35.84 0 0 1-50.688-50.688L698.6752 512 249.2928 62.6176a35.84 35.84 0 0 1 25.6-61.44z"  ></path></symbol><symbol id="dkic-arrow-v-right" viewBox="0 0 1024 1024"><path d="M512 0A512 512 0 1 1 0 512 512.5632 512.5632 0 0 1 512 0z m0 950.8352A438.8352 438.8352 0 1 0 73.1648 512 439.3472 439.3472 0 0 0 512 950.8352z m123.8528-452.9664v-0.4096a36.352 36.352 0 0 0-7.5776-11.4688L446.2592 303.6672A36.5568 36.5568 0 0 0 394.24 355.2768l155.9552 156.2112-157.0304 155.3408a36.5568 36.5568 0 1 0 51.2 51.968L627.7632 537.6a36.4544 36.4544 0 0 0 8.0896-39.7312z" fill="#333333" ></path></symbol><symbol id="dkic-cart-add-fill" viewBox="0 0 1024 1024"><path d="M222.924655 950.835248a73.164752 73.062353 90 1 0 146.124705 0 73.164752 73.062353 90 1 0-146.124705 0Z" fill="#333333" ></path><path d="M803.890677 950.835248a73.164752 73.062353 90 1 0 146.124705 0 73.164752 73.062353 90 1 0-146.124705 0Z" fill="#333333" ></path><path d="M1001.164149 252.365302a91.85274 91.85274 0 0 0-73.062352-32.921579H210.380663l-24.012784-127.999917A106.700731 106.700731 0 0 0 80.383948 0.000666H36.556776a36.607976 36.607976 0 0 0 0 73.164752h43.827172A34.611178 34.611178 0 0 1 113.254326 102.400599l32.921579 179.199884L204.799867 705.843407c7.321595 54.835164 51.199967 98.713536 102.399933 98.713536h555.110039c51.199967 0 95.027138-36.556776 102.399934-84.121546L1023.077735 332.800449a104.550332 104.550332 0 0 0-21.913586-80.435147z m-290.150211 286.719813h-82.739146v82.739146a26.879983 26.879983 0 0 1-53.759965 0v-82.943946H491.519681a26.879983 26.879983 0 0 1 0-53.759965h82.790346V402.381204a26.879983 26.879983 0 0 1 53.759965 0v82.739146h82.739146a26.879983 26.879983 0 0 1 0 53.759965z" fill="#333333" ></path></symbol><symbol id="dkic-close" viewBox="0 0 1024 1024"><path d="M558.08 507.136l432.0256-432.0256a35.84 35.84 0 0 0-50.688-50.688L507.136 456.448 75.1104 24.4224a35.84 35.84 0 0 0-50.688 50.688l432.0256 432.0256-432.0256 432.0256a35.84 35.84 0 0 0 50.688 50.688L507.136 558.08l432.0256 432.0256a35.84 35.84 0 0 0 50.688-50.688z" fill="#333333" ></path></symbol><symbol id="dkic-cart" viewBox="0 0 1024 1024"><path d="M1001.163949 252.365456a91.852722 91.852722 0 0 0-73.062338-32.921572h-599.039491A34.508771 34.508771 0 0 0 292.300552 256.000653a34.508771 34.508771 0 0 0 36.556768 36.556769h599.039491a27.955176 27.955176 0 0 1 18.227185 7.321594 20.479983 20.479983 0 0 1 3.686397 21.964781l-54.835154 383.999673c0 10.956791-14.591988 21.913581-29.235175 21.913582H310.578936c-14.591988 0-29.235175-18.278384-29.235175-32.921572L219.238214 270.64384l-32.870372-179.199847A106.649509 106.649509 0 0 0 80.383932 0.00087H36.556769a36.607969 36.607969 0 0 0 0 73.164738h43.827163A34.611171 34.611171 0 0 1 113.254304 102.400783l32.921572 179.199848L204.799826 705.84347c7.321594 54.835153 51.199956 98.713516 102.399913 98.713517h555.109928c51.199956 0 95.027119-36.556769 102.399913-84.121529L1023.07753 332.800588a104.550311 104.550311 0 0 0-21.913581-80.435132z" fill="#333333" ></path><path d="M222.924611 950.835262a73.164738 73.062338 90 1 0 146.124675 0 73.164738 73.062338 90 1 0-146.124675 0Z" fill="#333333" ></path><path d="M803.890517 950.835262a73.164738 73.062338 90 1 0 146.124675 0 73.164738 73.062338 90 1 0-146.124675 0Z" fill="#333333" ></path><path d="M781.823335 547.123605a35.12317 35.12317 0 0 0 0-70.24634H372.582083a35.12317 35.12317 0 0 0 0 70.24634z" fill="#333333" ></path></symbol><symbol id="dkic-cart-add" viewBox="0 0 1024 1024"><path d="M1001.164149 252.365302a91.85274 91.85274 0 0 0-73.062352-32.921579h-599.039611A34.508778 34.508778 0 0 0 292.30061 256.000499a34.508778 34.508778 0 0 0 36.556776 36.556776h599.039611a27.955182 27.955182 0 0 1 18.227188 7.321596 20.479987 20.479987 0 0 1 3.686398 21.964785l-54.835165 383.999751c0 10.956793-14.591991 21.913586-29.235181 21.913586H310.578998c-14.591991 0-29.235181-18.278388-29.235181-32.921579L219.238257 270.64369l-32.870378-179.199884A106.700731 106.700731 0 0 0 80.383948 0.000666H36.556776a36.607976 36.607976 0 0 0 0 73.164752h43.827172A34.611178 34.611178 0 0 1 113.254326 102.400599l32.921579 179.199884L204.799867 705.843407c7.321595 54.835164 51.199967 98.713536 102.399933 98.713536h555.110039c51.199967 0 95.027138-36.556776 102.399934-84.121546L1023.077735 332.800449a104.550332 104.550332 0 0 0-21.913586-80.435147z" fill="#333333" ></path><path d="M222.924655 950.835248a73.164752 73.062353 90 1 0 146.124705 0 73.164752 73.062353 90 1 0-146.124705 0Z" fill="#333333" ></path><path d="M803.890677 950.835248a73.164752 73.062353 90 1 0 146.124705 0 73.164752 73.062353 90 1 0-146.124705 0Z" fill="#333333" ></path><path d="M708.45394 485.12035h-82.739147V402.381204a26.931182 26.931182 0 0 0-53.811165 0v82.739146H489.164482a26.879983 26.879983 0 0 0 0 53.759965h82.739146v82.739147a26.931182 26.931182 0 0 0 53.811165 0v-82.739147h82.739147a26.879983 26.879983 0 0 0 0-53.759965z" fill="#333333" ></path></symbol><symbol id="dkic-cart-fill" viewBox="0 0 1024 1024"><path d="M222.924454 950.835313a73.164687 73.062287 90 1 0 146.124574 0 73.164687 73.062287 90 1 0-146.124574 0Z" fill="#333333" ></path><path d="M803.889954 950.835313a73.164687 73.062287 90 1 0 146.124573 0 73.164687 73.062287 90 1 0-146.124573 0Z" fill="#333333" ></path><path d="M1001.163248 252.365996a91.852658 91.852658 0 0 0-73.062287-32.921549H209.919675l-23.398364-127.999802A106.649435 106.649435 0 0 0 80.383875 0.001587H36.556743a36.607943 36.607943 0 0 0 0 73.164687h43.827132A34.611146 34.611146 0 0 1 113.254224 102.401428l32.921549 179.199723L204.799683 705.843693c7.321589 54.835115 51.199921 98.713447 102.399841 98.713447h555.109539c51.199921 0 95.027053-36.556743 102.399842-84.121469L1023.076814 332.801071a104.550238 104.550238 0 0 0-21.913566-80.435075z m-219.34046 294.757943H372.581822a35.123146 35.123146 0 0 1 0-70.246291h409.240966a35.123146 35.123146 0 0 1 0 70.246291z" fill="#333333" ></path></symbol><symbol id="dkic-arrow-vvv-up" viewBox="0 0 1024 1024"><path d="M491.561233 1024a34.797001 34.797001 0 0 0 34.797001-34.797001V108.752021L936.104412 518.447102a33.31519 33.31519 0 0 0 47.315745-47.315745L521.861705 9.777293a33.264093 33.264093 0 0 0-47.111358 0l-434.323795 434.323795a33.366287 33.366287 0 0 0 47.469036 47.009164l369.124129-369.27742v867.370167A34.745904 34.745904 0 0 0 491.561233 1024z" fill="#333333" ></path></symbol><symbol id="dkic-arrow-vv-up" viewBox="0 0 1024 1024"><path d="M960.719718 801.2288c52.224 0 85.6064-69.7344 45.6192-109.7216l-449.3824-449.3824a61.9008 61.9008 0 0 0-89.9072 0L17.615718 691.5072c-38.9632 39.0144-8.5504 109.7216 44.9536 109.7216z" fill="#333333" ></path></symbol><symbol id="dkic-clock" viewBox="0 0 1024 1024"><path d="M512 0a512 512 0 1 0 512 512A512.5632 512.5632 0 0 0 512 0z m0 950.528A438.528 438.528 0 1 1 950.528 512 439.04 439.04 0 0 1 512 950.528zM694.8352 512H512V256a36.608 36.608 0 1 0-73.1648 0v292.5056a36.5056 36.5056 0 0 0 36.608 36.608h219.392a36.608 36.608 0 1 0 0-73.1648z" fill="#333333" ></path></symbol><symbol id="dkic-facebook" viewBox="0 0 1024 1024"><path d="M512 0a512 512 0 1 0 512 512A512 512 0 0 0 512 0z m141.0048 313.1904H578.56c-12.1856 0-29.3376 6.144-29.3376 32.0512V414.72h103.7312l-12.288 117.76h-91.3408v334.6944h-138.24V531.968H345.088v-117.76h65.8432V338.2784c0-54.4256 25.6-139.7248 139.6736-139.7248l102.4 0.4608z" fill="#3B5998" ></path></symbol><symbol id="dkic-delete-fill" viewBox="0 0 1024 1024"><path d="M987.4432 182.8352h-182.8864V109.7216A109.3632 109.3632 0 0 0 695.7056 0H329.1648a109.824 109.824 0 0 0-109.7216 109.7216v73.1136H36.5568a36.608 36.608 0 0 0 0 73.1648h950.8864a36.608 36.608 0 0 0 0-73.1648zM841.1648 329.1648H182.9376a36.8128 36.8128 0 0 0-25.9072 10.24 36.1472 36.1472 0 0 0-10.752 25.6v549.2736A109.8752 109.8752 0 0 0 256 1024h512a109.7216 109.7216 0 0 0 109.568-109.7216V365.7216a36.608 36.608 0 0 0-36.4032-36.5568z m-402.3296 512a36.5568 36.5568 0 0 1-73.1136 0V438.8352a36.5568 36.5568 0 0 1 73.1136 0z m219.4432 0a36.5568 36.5568 0 0 1-73.1136 0V438.8352a36.5568 36.5568 0 1 1 73.1136 0z" fill="#333333" ></path></symbol><symbol id="dkic-editor" viewBox="0 0 1024 1024"><path d="M838.656 877.568a10.24 10.24 0 0 1-10.24 10.24H81.92a10.24 10.24 0 0 1-10.24-10.24V174.08a10.24 10.24 0 0 1 10.24-10.24h629.248V92.16H81.92A81.92 81.92 0 0 0 0 174.08v703.488a81.92 81.92 0 0 0 81.92 81.92h746.496a81.92 81.92 0 0 0 81.92-81.92V512h-71.68z" fill="#333333" ></path><path d="M508.16 634.9312l50.9952-0.3072L1024 169.7792l-50.688-50.688-464.8448 464.8448-0.3072 50.9952z" fill="#333333" ></path></symbol><symbol id="dkic-date-fill" viewBox="0 0 1029 1024"><path d="M1022.742199 419.565939l-3.617826 509.553a95.541187 95.541187 0 0 1-96.203607 94.878768L94.999053 1018.035937A95.490232 95.490232 0 0 1 0.018374 921.832331l3.668782-509.552999zM351.966631 701.399703L192.731319 700.533463 191.814123 795.819874l159.235312 1.121017z m238.827491 1.73248l-159.235313-1.171971-0.662419 95.388321 159.235313 1.171972z m238.82749 1.681525l-159.235312-1.121016-0.662419 95.541187 159.235312 1.121017zM353.291469 510.317329l-159.235313-1.121017-0.662418 95.541187 159.235312 1.121017z m238.878446 1.73248l-159.235313-1.121017-0.713374 95.541188 159.235312 1.121016z m238.82749 1.681525l-159.235312-1.121017-0.662419 95.541187 159.235312 1.121017zM101.725153 62.675019l95.541187 0.917195-1.121016 158.980536 206.980428 1.477704 1.121017-159.235313 238.878446 1.732481-1.171972 159.235312 207.031383 1.477704 1.121017-159.235313 79.643134 0.560509a95.490232 95.490232 0 0 1 94.827813 96.203606l-1.121017 159.235312-1019.105998-7.286608 1.171972-159.235312a95.490232 95.490232 0 0 1 96.203606-94.827813zM793.443349 3.923558l-1.121016 159.235312-95.541188-0.713374 1.121017-159.235312zM343.813783 0.713374l-1.121017 159.235312-95.541187-0.713374 1.121017-159.235312z" fill="#333333" ></path></symbol><symbol id="dkic-delete" viewBox="0 0 1024 1024"><path d="M621.7216 804.5568a36.5056 36.5056 0 0 1-36.5568-36.5568V365.7216a36.5568 36.5568 0 1 1 73.1136 0V768a36.5056 36.5056 0 0 1-36.5568 36.5568zM402.2784 804.5568a36.5056 36.5056 0 0 1-36.5568-36.5568V365.7216a36.5568 36.5568 0 0 1 73.1136 0V768a36.5056 36.5056 0 0 1-36.5568 36.5568zM987.4432 182.8352h-182.8864V109.7216A109.3632 109.3632 0 0 0 695.7056 0H329.1648a109.824 109.824 0 0 0-109.7216 109.7216v73.1136H36.5568a36.608 36.608 0 0 0 0 73.1648h950.8864a36.608 36.608 0 0 0 0-73.1648zM292.5568 109.7216a36.608 36.608 0 0 1 36.608-36.5568h366.5408a35.84 35.84 0 0 1 35.84 36.5568v73.1136H292.5568z" fill="#333333" ></path><path d="M768 1024H256a109.824 109.824 0 0 1-109.6704-109.7216V365.1584a36.5568 36.5568 0 0 1 73.1136 0v549.12a36.608 36.608 0 0 0 36.5568 36.5568h512a36.5568 36.5568 0 0 0 36.5568-36.5568v-547.84a36.608 36.608 0 0 1 73.1648 0v547.84A109.8752 109.8752 0 0 1 768 1024z" fill="#333333" ></path></symbol><symbol id="dkic-download" viewBox="0 0 1024 1024"><path d="M917.1968 259.5328h-111.872v65.6896h111.872a21.9136 21.9136 0 0 1 21.9136 21.9136v589.2608a21.9136 21.9136 0 0 1-21.9136 21.9136H106.8032a21.9136 21.9136 0 0 1-21.9136-21.9136V347.136a21.9136 21.9136 0 0 1 21.9136-21.9136h111.872V259.5328H106.8032A87.6032 87.6032 0 0 0 19.1488 347.136v589.2608A87.6032 87.6032 0 0 0 106.8032 1024h810.3936a87.6032 87.6032 0 0 0 87.6544-87.6032V347.136a87.6032 87.6032 0 0 0-87.6544-87.6032z" fill="#333333" ></path><path d="M730.2656 447.744a32.768 32.768 0 0 0-46.4384 0l-137.6256 137.5744V0H477.7984v594.432L331.0592 447.744a32.8192 32.8192 0 0 0-46.4384 46.4384l199.68 199.68a32.8704 32.8704 0 0 0 46.4896 0l199.68-199.68a32.768 32.768 0 0 0-0.2048-46.4384z" fill="#333333" ></path></symbol><symbol id="dkic-favorite" viewBox="0 0 1024 1024"><path d="M747.0592 131.8912a200.0896 200.0896 0 0 1 140.032 56.7808c1.4848 1.4336 2.9184 2.8672 4.3008 4.352a216.1152 216.1152 0 0 1 3.1232 296.5504l-382.7712 373.76-382.7712-373.76a216.2176 216.2176 0 0 1 3.1232-296.6016 201.1648 201.1648 0 0 1 284.5184-4.352l4.3008 4.352L442.5216 215.04h0.6144l19.1488 18.5344L512 281.6l49.7664-48.2304 13.0048-12.5952c10.6496-10.24 19.9168-19.6096 27.6992-27.5456a199.68 199.68 0 0 1 144.4352-61.1328m0-71.68A272.1792 272.1792 0 0 0 551.168 143.36c-7.2192 7.3728-15.9744 16.0768-26.2144 26.0096L512 181.7088c-11.4176-11.008-21.3504-20.48-29.7984-29.1328L472.832 143.36q-2.9184-3.0208-5.8368-5.8368A272.8448 272.8448 0 0 0 81.1008 143.36a287.3344 287.3344 0 0 0-2.9696 397.0048l433.8688 423.424 433.8688-423.7312a287.1808 287.1808 0 0 0-3.0208-396.6976q-2.8672-3.0208-5.8368-5.8368a271.7696 271.7696 0 0 0-189.952-76.8z" fill="#333333" ></path></symbol><symbol id="dkic-help" viewBox="0 0 1024 1024"><path d="M457.1648 823.2448A54.8352 54.8352 0 1 0 512 768.4096a54.8352 54.8352 0 0 0-54.8352 54.8352zM512 1024a512 512 0 1 1 512-512 512.5632 512.5632 0 0 1-512 512z m0-950.528A438.528 438.528 0 1 0 950.528 512 438.9888 438.9888 0 0 0 512 73.472z m0 623.3088a36.5568 36.5568 0 0 1-36.5568-36.3008v-62.1056c0-59.8016 45.7216-105.5232 86.0672-145.8688 29.5936-29.6448 60.2112-60.2112 60.2112-84.5824A110.2848 110.2848 0 0 0 512 257.3312a107.776 107.776 0 0 0-109.7216 108.0832 36.5568 36.5568 0 1 1-73.1136 0 182.8352 182.8352 0 0 1 365.6704 2.5088c0 54.7328-41.472 96.2048-81.6128 136.3456-31.7952 31.744-64.6656 64.5632-64.6656 94.0544v61.8496a36.608 36.608 0 0 1-36.5568 36.608z" fill="#333333" ></path></symbol><symbol id="dkic-favorite-fill" viewBox="0 0 1024 1024"><path d="M472.832 143.36l9.3696 9.472c8.448 8.448 18.3808 18.1248 29.7984 29.1328l12.9536-13.0048c10.24-9.9328 18.9952-18.6368 26.2144-26.0096A272.7936 272.7936 0 0 1 936.96 137.2672q3.0208 2.8672 5.8368 5.8368a287.1808 287.1808 0 0 1 3.0208 396.9536L512 963.7888l-433.8688-423.68A287.3344 287.3344 0 0 1 81.1008 143.36a272.896 272.896 0 0 1 385.8944-5.8368q2.9184 2.8672 5.8368 5.8368z" fill="#333333" ></path></symbol><symbol id="dkic-date" viewBox="0 0 1024 1024"><path d="M434.3296 509.184m50.2784 0l59.4432 0q50.2784 0 50.2784 50.2784l0 0q0 50.2784-50.2784 50.2784l-59.4432 0q-50.2784 0-50.2784-50.2784l0 0q0-50.2784 50.2784-50.2784Z" fill="#333333" ></path><path d="M672 699.4432m50.2784 0l59.4432 0q50.2784 0 50.2784 50.2784l0 0q0 50.2784-50.2784 50.2784l-59.4432 0q-50.2784 0-50.2784-50.2784l0 0q0-50.2784 50.2784-50.2784Z" fill="#333333" ></path><path d="M672 509.184m50.2784 0l59.4432 0q50.2784 0 50.2784 50.2784l0 0q0 50.2784-50.2784 50.2784l-59.4432 0q-50.2784 0-50.2784-50.2784l0 0q0-50.2784 50.2784-50.2784Z" fill="#333333" ></path><path d="M393.4208 60.5184h244.1216v97.7408H393.4208zM692.1216 0.1024h98.4576v158.1568h-98.4576zM240.2304 0.1024h98.56v158.1568H240.2304z" fill="#333333" ></path><path d="M917.9648 60.5184h-72.8064v97.7408h108.4416v174.08H75.0592v-174.08h110.592V60.5184H106.0352A106.0352 106.0352 0 0 0 0 166.5024v751.4624A106.0352 106.0352 0 0 0 106.0352 1024h811.9296A106.0352 106.0352 0 0 0 1024 917.9648V166.5024a106.0352 106.0352 0 0 0-106.0352-105.984z m35.84 893.0816H75.0592v-547.84h878.5408z" fill="#333333" ></path><path d="M192 699.4432m50.2784 0l59.4432 0q50.2784 0 50.2784 50.2784l0 0q0 50.2784-50.2784 50.2784l-59.4432 0q-50.2784 0-50.2784-50.2784l0 0q0-50.2784 50.2784-50.2784Z" fill="#333333" ></path><path d="M434.3296 699.4432m50.2784 0l59.4432 0q50.2784 0 50.2784 50.2784l0 0q0 50.2784-50.2784 50.2784l-59.4432 0q-50.2784 0-50.2784-50.2784l0 0q0-50.2784 50.2784-50.2784Z" fill="#333333" ></path><path d="M192 509.184m50.2784 0l59.4432 0q50.2784 0 50.2784 50.2784l0 0q0 50.2784-50.2784 50.2784l-59.4432 0q-50.2784 0-50.2784-50.2784l0 0q0-50.2784 50.2784-50.2784Z" fill="#333333" ></path></symbol><symbol id="dkic-help-fill" viewBox="0 0 1024 1024"><path d="M512 0a512 512 0 1 0 512 512A512.5632 512.5632 0 0 0 512 0z m0 878.1312a54.8864 54.8864 0 1 1 54.8352-54.8864A54.8352 54.8352 0 0 1 512 878.1312z m101.2224-373.76c-31.7952 31.744-64.6656 64.5632-64.6656 94.0544v61.8496a36.5568 36.5568 0 1 1-73.1136 0v-61.9008c0-59.8016 45.7216-105.5232 86.0672-145.8688 29.5936-29.6448 60.2112-60.2112 60.2112-84.5824A110.2848 110.2848 0 0 0 512 257.3312a107.776 107.776 0 0 0-109.7216 108.0832 36.5568 36.5568 0 1 1-73.1136 0 182.8352 182.8352 0 0 1 365.6704 2.5088c0 54.7328-41.472 96.2048-81.6128 136.3456z" fill="#333333" ></path></symbol><symbol id="dkic-image-fill" viewBox="0 0 1024 1024"><path d="M889.9072 73.1648H134.0928A134.2464 134.2464 0 0 0 0 207.2064v609.5872a134.2464 134.2464 0 0 0 134.0928 134.0416h755.8144A134.2464 134.2464 0 0 0 1024 816.7936V207.2064a134.2464 134.2464 0 0 0-134.0928-134.0416zM292.5568 292.5568a73.1648 73.1648 0 1 1-73.1136 73.1648 73.1648 73.1648 0 0 1 73.1136-73.1648z m545.024 111.0016c-87.04 0-105.8816 46.848-129.792 123.2896-16.5888 53.0432-37.2736 119.04-107.776 130.304-64.3072 10.24-114.0224-4.7104-157.952-17.8688-29.0304-8.704-56.32-16.9984-86.6816-17.7152h-1.6384c-70.912 0-122.1632 114.176-136.0384 158.72a36.5568 36.5568 0 0 1-69.7856-21.6576c2.7136-8.704 68.7616-213.5552 209.3568-209.92 39.9872 1.024 73.5232 11.1104 105.8816 20.8896 41.6256 12.4928 77.6192 23.296 125.3376 15.6672 23.3472-3.7888 33.024-27.2384 49.5104-79.9744 21.76-69.5296 54.6304-174.5408 199.68-174.5408a36.5568 36.5568 0 1 1 0 73.1136z" fill="#333333" ></path></symbol><symbol id="dkic-friends" viewBox="0 0 1024 1024"><path d="M512 0a512 512 0 1 0 512 512A512 512 0 0 0 512 0z m140.1856 209.5104A299.9296 299.9296 0 0 1 747.52 274.1248v-0.8192a334.4896 334.4896 0 0 1 66.9696 92.16l-163.84 163.84z m-140.9536-34.6624A326.8096 326.8096 0 0 1 624.64 192.9728v230.8096L397.7728 195.328h0.8192a263.3728 263.3728 0 0 1 112.64-20.48zM276.48 274.8928a300.288 300.288 0 0 1 92.16-67.7376l163.84 163.84-319.7952-1.5872A298.7008 298.7008 0 0 1 276.48 274.8928zM179.6096 512a324.0448 324.0448 0 0 1 18.1248-113.408h230.7584l-227.6352 226.816A268.0832 268.0832 0 0 1 179.6096 512z m191.3856 303.2576A310.8352 310.8352 0 0 1 276.48 750.6944h-0.768a325.4784 325.4784 0 0 1-66.9696-92.9792l163.84-163.84z m137.8304 33.8944a326.8096 326.8096 0 0 1-113.408-18.1248v-230.0416h1.5872l225.28 227.6864a281.856 281.856 0 0 1-113.4592 20.48z m236.3392-98.4576a340.992 340.992 0 0 1-92.16 67.7376l-163.84-163.84 320.5632 0.768a314.1632 314.1632 0 0 1-64.5632 95.3344z m81.1008-122.88h-229.9904v-2.4064l226.8672-224.4608v-0.8192c0 0.8192 0 0.8192 0.768 1.5872l0.8192-0.768a295.2192 295.2192 0 0 1 20.48 113.408 352.3584 352.3584 0 0 1-18.944 113.4592z" fill="#0CC472" ></path></symbol><symbol id="dkic-image" viewBox="0 0 1024 1024"><path d="M219.4432 365.7216a73.1648 73.1648 0 1 0 73.1136-73.1648 73.1136 73.1136 0 0 0-73.1136 73.1648z m670.72 585.1136H134.0928A134.2464 134.2464 0 0 1 0 816.7936V207.2064a134.2464 134.2464 0 0 1 134.0928-134.0416h755.8144A134.2464 134.2464 0 0 1 1024 207.2064v609.5872a134.2464 134.2464 0 0 1-134.0928 134.0416zM134.0928 146.2784a61.0304 61.0304 0 0 0-60.928 60.928v609.5872a61.0304 61.0304 0 0 0 60.928 60.928h755.8144a60.9792 60.9792 0 0 0 60.928-60.928V207.2064a60.9792 60.9792 0 0 0-60.928-60.928z m48.7424 659.4048a36.5056 36.5056 0 0 1-34.9184-47.36c2.7136-8.704 68.7616-213.5552 209.3568-209.92 39.9872 1.024 73.5232 11.1104 105.8816 20.8896 41.6256 12.4928 77.6192 23.296 125.3376 15.6672 23.3472-3.7888 33.024-27.2384 49.5104-79.9744 21.76-69.5296 54.6304-174.5408 199.68-174.5408a36.5568 36.5568 0 1 1 0 73.1136c-87.04 0-105.8816 46.848-129.792 123.2896-16.5888 53.0432-37.2736 119.04-107.776 130.304-64.3072 10.24-114.0224-4.7104-157.952-17.8688-29.0304-8.704-56.32-16.9984-86.6816-17.7152h-1.6384c-70.912 0-122.1632 114.176-136.0384 158.72a36.4544 36.4544 0 0 1-34.9696 25.3952z" fill="#333333" ></path></symbol><symbol id="dkic-lessen" viewBox="0 0 1024 1024"><path d="M476.16 476.16H35.84a35.84 35.84 0 0 0-35.84 35.84 35.84 35.84 0 0 0 35.84 35.84h952.32a35.84 35.84 0 0 0 35.84-35.84 35.84 35.84 0 0 0-35.84-35.84h-440.32" fill="#333333" ></path></symbol><symbol id="dkic-mail" viewBox="0 0 1024 1024"><path d="M908.1856 128H115.8144A115.9168 115.9168 0 0 0 0 243.7632v536.4736A115.9168 115.9168 0 0 0 115.8144 896h792.3712A115.9168 115.9168 0 0 0 1024 780.2368V243.7632A115.9168 115.9168 0 0 0 908.1856 128zM962.56 780.2368A54.3744 54.3744 0 0 1 908.1856 834.56H115.8144A54.3744 54.3744 0 0 1 61.44 780.2368V243.7632A54.3744 54.3744 0 0 1 115.8144 189.44h792.3712A54.3744 54.3744 0 0 1 962.56 243.7632z" fill="#333333" ></path><path d="M845.4144 282.5728l-326.0416 238.336c-16.6912 16.64-43.7248 16.64-62.5664-2.048L177.664 282.5728a36.5568 36.5568 0 1 0-47.3088 55.808l276.9408 234.24a115.8656 115.8656 0 0 0 82.2784 34.048 112.9472 112.9472 0 0 0 80.2304-32.8192l324.8128-237.2096a36.5568 36.5568 0 1 0-49.2032-54.0672z" fill="#333333" ></path></symbol><symbol id="dkic-lock" viewBox="0 0 1024 1024"><path d="M512 621.7216a36.5568 36.5568 0 0 0-36.5568 36.5568V768a36.5568 36.5568 0 0 0 73.1136 0v-109.7216a36.5568 36.5568 0 0 0-36.5568-36.5568z" fill="#333333" ></path><path d="M877.7216 402.2784h-73.1648V290.304c0-171.0592-155.136-290.304-294.4512-290.304-142.8992 0-290.6624 108.3904-290.6624 289.792v112.64H146.2784A109.8752 109.8752 0 0 0 36.5568 512v402.2784A109.8752 109.8752 0 0 0 146.2784 1024h731.4432a109.8752 109.8752 0 0 0 109.7216-109.7216V512a109.8752 109.8752 0 0 0-109.7216-109.7216zM292.5568 289.792c0-135.6288 110.592-216.6272 217.5488-216.6272 104.4992 0 221.3376 92.8256 221.3376 217.1392v111.9744H292.5568z m621.7216 624.64a36.5568 36.5568 0 0 1-36.5568 36.5568H146.2784a36.608 36.608 0 0 1-36.5568-36.5568V512a36.608 36.608 0 0 1 36.5568-36.5568h731.4432a36.5568 36.5568 0 0 1 36.5568 36.5568z" fill="#333333" ></path></symbol><symbol id="dkic-mail-fill" viewBox="0 0 1024 1024"><path d="M908.1856 128H115.8144A115.9168 115.9168 0 0 0 0 243.7632v536.4736A115.9168 115.9168 0 0 0 115.8144 896h792.3712A115.9168 115.9168 0 0 0 1024 780.2368V243.7632A115.9168 115.9168 0 0 0 908.1856 128z m-13.568 208.64l-324.8128 237.2096a112.9472 112.9472 0 0 1-80.2304 32.8192 115.8656 115.8656 0 0 1-82.2784-34.048L130.3552 338.3808a36.5568 36.5568 0 1 1 47.3088-55.808l279.1424 236.288c18.8416 18.688 46.08 18.688 62.5664 2.048l326.0416-238.336a36.5568 36.5568 0 1 1 49.2032 54.0672z" fill="#333333" ></path></symbol><symbol id="dkic-map" viewBox="0 0 1024 1024"><path d="M512 0h-9.0112c-215.8592 4.6592-389.12 176.1792-389.12 387.0208 0 4.5568 0 9.1136 0.256 13.6192 5.12 128 77.7216 271.8208 197.12 417.6896a1680.5888 1680.5888 0 0 0 168.96 177.6128l17.3568 15.36L512 1024l14.4384-12.4416a1682.2784 1682.2784 0 0 0 186.5216-193.0752c119.3984-145.92 192.2048-289.792 197.12-417.6896 0-4.608 0.256-9.1136 0.256-13.6704C910.336 173.312 732.16 0 512 0z m326.4512 397.6704v0.3584c-4.0448 105.6768-66.56 235.52-180.8896 374.9376A1612.8 1612.8 0 0 1 512 927.8976 1610.9056 1610.9056 0 0 1 366.5408 773.12C252.2112 633.3952 189.44 503.7056 185.5488 398.08v-10.9568a308.224 308.224 0 0 1 92.5184-220.16A329.984 329.984 0 0 1 504.1152 71.68h8.192c179.968 0 326.3488 141.6192 326.3488 315.4432 0 3.7376-0.0512 7.1168-0.2048 10.5472z" fill="#333333" ></path><path d="M512 184.9344A199.168 199.168 0 1 0 711.168 384 199.168 199.168 0 0 0 512 184.9344z m0 326.656A127.488 127.488 0 1 1 639.488 384 127.6416 127.6416 0 0 1 512 511.5904z" fill="#333333" ></path></symbol><symbol id="dkic-phone" viewBox="0 0 1024 1024"><path d="M783.0528 0H240.9472a90.368 90.368 0 0 0-90.368 90.368v843.264A90.368 90.368 0 0 0 240.9472 1024h542.1056a90.368 90.368 0 0 0 90.368-90.368V90.368A90.368 90.368 0 0 0 783.0528 0z m18.688 933.632a18.7392 18.7392 0 0 1-18.688 18.688H240.9472a18.7392 18.7392 0 0 1-18.688-18.688V90.368A18.7392 18.7392 0 0 1 240.9472 71.68h542.1056a18.7392 18.7392 0 0 1 18.688 18.688z" fill="#333333" ></path><path d="M512 751.7184a61.44 61.44 0 0 0 0 122.88h0.5632a61.44 61.44 0 1 0-0.5632-122.88zM601.7536 144.8448H422.2464c-16.9472 0-30.72 16.0768-30.72 35.84s13.7728 35.84 30.72 35.84h179.5072c16.9472 0 30.72-16.0256 30.72-35.84s-13.7728-35.84-30.72-35.84z" fill="#333333" ></path></symbol><symbol id="dkic-qq" viewBox="0 0 1024 1024"><path d="M512 0a512 512 0 1 0 512 512A512 512 0 0 0 512 0z m256.768 672.6656c-18.8928 16.5888-43.3152-53.5552-47.2576-42.496-8.6528 25.9584-12.5952 43.3152-38.6048 71.68-1.536 1.536 29.952 13.3632 38.6048 36.1984s25.2416 58.3168-82.688 70.144c-63.0272 6.2976-108.6976-33.1264-112.64-33.1264a36.864 36.864 0 0 1-13.4144 0h-14.9504c-1.5872 0-22.8352 33.1264-116.5824 33.1264-72.448 0-91.3408-44.9024-76.3904-70.144 14.9504-24.4224 38.6048-32.256 35.4304-36.1984a188.1088 188.1088 0 0 1-35.4304-59.0848 81.5616 81.5616 0 0 1-3.9424-13.4144c-2.3552-10.24-22.8352 58.3168-44.9024 42.5472-21.248-15.7696-19.712-55.9104-5.5296-94.5152s50.432-76.3904 50.432-84.2752c1.5872-30.72-3.1744-36.2496 0-44.1344 7.0656-18.1248 14.9504-11.008 14.9504-20.48 0-118.1184 88.2176-214.2208 198.5024-214.2208s198.5024 96.1024 198.5024 214.2208c0 4.7616 11.8272 0 17.3568 20.48a207.616 207.616 0 0 1 0.768 44.1344c-0.768 11.008 30.72 25.1904 46.4896 84.2752s-0.8192 88.9856-8.704 95.2832z" fill="#1E9CF0" ></path></symbol><symbol id="dkic-play-fill" viewBox="0 0 1024 1024"><path d="M512 0a512 512 0 1 0 512 512A512.5632 512.5632 0 0 0 512 0z m167.424 580.3008l-187.1872 120.2688a85.1456 85.1456 0 0 1-46.08 13.4656 85.1968 85.1968 0 0 1-85.1968-85.1968V390.656a85.3504 85.3504 0 0 1 85.1968-85.248A84.992 84.992 0 0 1 491.52 318.5664l187.136 117.76a85.248 85.248 0 0 1 0.6656 143.8208z" fill="#333333" ></path></symbol><symbol id="dkic-play" viewBox="0 0 1024 1024"><path d="M512 0a512 512 0 1 0 512 512A512.5632 512.5632 0 0 0 512 0z m0 952.32a440.32 440.32 0 1 1 440.32-440.32 440.832 440.832 0 0 1-440.32 440.32z" fill="#333333" ></path><path d="M678.7584 436.48L491.52 318.5664a84.992 84.992 0 0 0-45.4144-13.1584A85.3504 85.3504 0 0 0 360.96 390.656v238.1824a85.1968 85.1968 0 0 0 85.248 85.1968 85.1456 85.1456 0 0 0 46.08-13.4656l187.1872-120.2688a85.248 85.248 0 0 0-0.6656-143.8208z m-32.2048 74.9568a13.4656 13.4656 0 0 1-5.888 8.5504L453.5808 640a13.568 13.568 0 0 1-7.3728 2.1504 12.9024 12.9024 0 0 1-9.5744-3.9424 12.7488 12.7488 0 0 1-3.9936-9.5744V390.656a13.568 13.568 0 0 1 13.5168-13.568 14.1312 14.1312 0 0 1 7.2704 2.0992l187.0848 117.76a14.8992 14.8992 0 0 1 4.2496 4.1472 13.568 13.568 0 0 1 1.792 10.3424z" fill="#333333" ></path></symbol><symbol id="dkic-pic" viewBox="0 0 1024 1024"><path d="M530.8928 578.9696l29.952 52.736h132.3008L596.2752 471.04l-65.3824 107.9296zM410.368 419.84a42.3424 42.3424 0 0 0-42.1376-42.5472h-0.3584a42.3936 42.3936 0 0 0-42.5472 42.1888V419.84a42.3936 42.3936 0 0 0 42.1888 42.5472h0.3584a42.3424 42.3424 0 0 0 42.496-42.1888zM403.3024 632.5248h145.7152L475.7504 506.4704l-72.448 126.0544z" fill="#FF6124" ></path><path d="M512 0a512 512 0 1 0 512 512A512 512 0 0 0 512 0z m243.4048 636.4672a50.0736 50.0736 0 0 1-49.6128 50.3808H319.7952a49.5616 49.5616 0 0 1-49.6128-50.3808V386.7648a50.6368 50.6368 0 0 1 49.6128-50.432h385.9968a50.0736 50.0736 0 0 1 49.6128 50.432z" fill="#FF6124" ></path></symbol><symbol id="dkic-QQspace" viewBox="0 0 1024 1024"><path d="M512 0a512 512 0 1 0 512 512A512 512 0 0 0 512 0z m163.84 630.1696l29.952 174.08h-1.5872c-9.472-8.704-35.4304-18.1248-48.0768-25.2416-33.0752-17.3056-66.1504-33.8432-99.2256-51.2-11.8272-6.2976-22.8352-11.776-34.6624-18.0736-2.3552-1.5872-7.8848-7.1168-11.8272-6.3488l-7.0656 4.7616-30.72 15.7184c-35.4816 18.944-70.912 35.4816-107.1616 54.3744-14.1312 7.8848-32.256 20.48-48.0256 25.1904l37.0176-212.6848a173.0048 173.0048 0 0 1-27.5456-26.7776 601.7536 601.7536 0 0 0-51.2-47.2576l-21.2992-20.48A343.04 343.04 0 0 1 215.04 459.2128a179.2 179.2 0 0 1-18.1248-16.5376 315.1872 315.1872 0 0 0 37.8368-6.2976c17.3056-3.9424 33.8432-3.1232 50.3808-7.0656 23.6544-5.5296 48.0768-4.7616 70.0928-10.24 13.4144-3.1744 51.2-3.1744 59.0848-8.704a151.6544 151.6544 0 0 0 10.24-19.6608c7.1168-14.1824 14.1824-28.3648 22.0672-43.3152 22.0672-42.5472 44.1344-85.8624 64.6144-129.1776 0.768 0.768 0 0 0.768 1.536a45.056 45.056 0 0 1 7.8848 15.0016c7.0656 13.3632 13.3632 27.5456 21.248 41.728l67.7376 133.888a797.7472 797.7472 0 0 1 86.6816 12.6464c23.6032 5.4784 47.2576 4.7104 70.0928 10.24 13.3632 3.1232 51.968 3.1232 59.8528 8.6528-12.5952 9.4208-20.48 23.6032-32.3072 32.3072-8.6528 6.2976-14.9504 15.7184-22.8352 22.016-23.6032 17.3568-43.3152 40.96-63.7952 60.672-7.0656 7.0656-37.0176 30.72-37.7856 39.3728a109.3632 109.3632 0 0 1 7.0656 30.72l-196.1472-14.9504v-0.8192h0.8192a72.5504 72.5504 0 0 1 15.7184-11.008c12.5952-7.8848 24.4224-16.5376 37.0176-25.1904 33.1264-22.0672 64.6144-46.4896 96.9216-69.3248 8.6528-6.2976 28.3648-17.3568 33.8432-25.1904a18.4832 18.4832 0 0 0 2.3552-15.7696c-2.3552-7.1168-13.3632-4.7104-22.8352-4.7104h-65.3824c-6.2976 3.9424-41.728 0.768-51.968 0.768l-129.1776 1.5872c-10.24 0-46.4896-3.1744-52.7872 0.768a157.2352 157.2352 0 0 1 37.8368 4.7104c14.9504 3.1744 30.72 2.4064 44.8512 6.3488l15.7696 0.768c23.6544 5.5296 51.2 5.5296 74.8544 11.008 14.9504 3.1744 30.72 2.3552 44.9024 6.2976 7.0656 1.5872 14.1824-0.768 18.8928 3.1744h-1.5872c-13.3632 11.8272-37.7856 20.48-54.3232 29.952-39.424 24.3712-81.92 46.4384-121.344 70.8608-8.6528 5.5296-23.6032 14.1824-27.5456 22.8352-3.1744 6.2976-1.5872 20.48 3.9424 22.8352h15.7184l278.8864-12.5952v-3.1232" fill="#FFC000" ></path></symbol><symbol id="dkic-round-close" viewBox="0 0 1024 1024"><path d="M512 1024a512 512 0 1 1 512-512 512.5632 512.5632 0 0 1-512 512z m0-950.528A438.528 438.528 0 1 0 950.528 512 438.9888 438.9888 0 0 0 512 73.472z m51.5072 440.32l158.1056-156.416a36.5568 36.5568 0 1 0-51.2-52.0192L512 461.7728 355.8912 305.3568A36.5568 36.5568 0 1 0 304.128 356.9664l155.6992 156.2112-156.9792 155.2896a36.5568 36.5568 0 1 0 51.2 52.0192l157.44-155.4944 158.72 159.0272a36.5568 36.5568 0 0 0 51.712-51.6608z" fill="#333333" ></path></symbol><symbol id="dkic-round-add-fill" viewBox="0 0 1028 1024"><path d="M877.755849 149.840688a516.00937 516.00937 0 0 0-727.143847 0 511.998535 511.998535 0 0 0 363.649055 874.156381A511.844272 511.844272 0 0 0 877.755849 874.156381a510.404485 510.404485 0 0 0 0-724.16143zM771.314454 548.661682h-220.338829v220.39025a36.765989 36.765989 0 0 1-73.480557 0V548.661682H257.104818a36.765989 36.765989 0 0 1 0-73.480557h220.39025V254.790875a36.765989 36.765989 0 0 1 73.480557 0v220.39025H771.314454a36.765989 36.765989 0 0 1 0 73.480557z" fill="#333333" ></path></symbol><symbol id="dkic-none" viewBox="0 0 1024 1024"><path d="M14.080034 835.199117c0 78.509231 225.905963 142.27879 504.884986 142.27879S1023.747647 913.861887 1023.747647 835.199117s-225.803604-142.329969-504.782627-142.329969-504.884986 63.871917-504.884986 142.329969z" fill="#DEDEDE" ></path><path d="M827.37221 739.237703l-217.41018 190.84806-7.830451-369.464239 231.228623-137.109668z" fill="#EEEEEE" ></path><path d="M603.001629 926.247306l-405.699268-118.480359V670.861997l342.032069 100.66992c22.467766-157.888513 40.943537-219.508536 54.864339-186.241912s16.633312 147.089655 8.905219 341.162019z m-5.885633-371.460235l-108.858628-23.696072L481.245787 453.810073V322.48368l341.162019 95.142543h11.668908z" fill="#DEDEDE" ></path><path d="M204.928094 457.546171l283.329274 78.560411V320.436503L204.928094 457.546171z" fill="#EEEEEE" ></path><path d="M919.597526 603.765776L836.430967 434.259535v147.089655z" fill="#DEDEDE" ></path><path d="M487.387318 541.070986a4.759686 4.759686 0 0 1-5.117942-4.606148V330.365311a5.117942 5.117942 0 0 1 9.928807 0v205.741271a5.117942 5.117942 0 0 1-4.810865 5.117942z" fill="#AAAAAA" ></path><path d="M532.425208 770.45715l-409.844802-125.49194 76.462055-185.371862 398.073535 101.847047z" fill="#FFFFFF" ></path><path d="M839.501732 415.579046a5.117942 5.117942 0 0 0-5.885633-2.917227h-0.307077L489.434494 317.723994a1.995997 1.995997 0 0 0-3.070765 0L199.349538 454.884841a4.503789 4.503789 0 0 0-5.117942 3.019586L117.8719 643.17393a3.173124 3.173124 0 0 0 0 3.838457c0.87005 2.047177 2.047177 2.917227 2.917227 2.917227L194.641031 672.499738v139.924537a6.039172 6.039172 0 0 0 3.838456 5.117942l408.002343 118.992153a4.45261 4.45261 0 0 0 1.381844 0.716512h5.578557a3.787277 3.787277 0 0 0 1.586562-1.893639l222.272224-190.182727a6.090351 6.090351 0 0 0 2.047177-3.736098v-149.699806l77.280925 22.007151h0.870051a2.968406 2.968406 0 0 0 2.968406-1.535382 4.094354 4.094354 0 0 0 2.047177-3.736098V588.974924zM488.257368 326.578033l333.229208 93.095367-225.189451 136.08608-382.310273-97.855053zM202.010867 465.734878L286.763988 487.179056l305.438783 78.150975-62.029458 199.241485-401.451376-122.83061z m2.558971 343.823349v-134.038903l326.93414 99.902229h0.92123c1.944818 0 3.991995-1.177127 3.991995-2.968406L593.072821 588.974924l11.771267 338.142433z m409.435367 111.622317l-11.617729-356.97646 226.16186-136.444336v310.198469z m298.58074-318.284818L839.501732 581.451549V441.322295l72.930675 151.695803z" fill="#AAAAAA" ></path><path d="M921.388806 12.541108c-7.216298-9.877628-55.069057 0.87005-76.769132 33.368982-5.885633 9.826449-12.897214 40.175845-7.93281 33.215444C849.737617 60.496225 873.075432 71.243903 890.681153 56.708948c14.586135-12.538958 36.18385-36.18385 30.298217-44.474917z" fill="#F0F1F4" ></path><path d="M954.092455 0.00215a32.754829 32.754829 0 0 0-7.88163 0.87005c-1.177127 0-3.224304 1.177127-7.06276 2.047177a205.638913 205.638913 0 0 0-19.601719 6.346248 14.381417 14.381417 0 0 0-10.235884-2.507792 94.937826 94.937826 0 0 0-66.533247 38.231027c-2.917227 6.14153-12.897214 34.44375-7.88163 37.360978h2.047176a1.177127 1.177127 0 0 0 0.716512 0 1.330665 1.330665 0 0 0 0.409436-1.84246c5.885633-8.80286 15.353826-9.621731 25.333813-11.668908a46.82917 46.82917 0 0 0 28.404578-9.928807c0.87005 0 36.439748-31.78242 30.96355-45.498505 5.527377-1.893639 11.46419-3.684918 18.015156-5.117942a68.478065 68.478065 0 0 1 7.011581-2.047177 29.684064 29.684064 0 0 0 7.06276-0.92123z m-64.383711 54.045468a48.876347 48.876347 0 0 1-25.58971 8.905219 38.947539 38.947539 0 0 0-25.589711 9.877628 116.689079 116.689079 0 0 1 8.90522-26.664478A85.009018 85.009018 0 0 1 910.641127 10.647469l-0.358256 0.358256a23.286636 23.286636 0 0 1 4.043175 0.358256 133.066494 133.066494 0 0 0-56.55326 43.553687l3.838456 2.917227a115.819029 115.819029 0 0 1 57.832746-43.400149c2.303074 5.629736-13.716085 25.58971-29.735244 39.612872zM894.51961 82.298658c34.085494 54.710801 34.955544 119.094512 2.303074 154.561851a125.543119 125.543119 0 0 1-40.943537 26.715657c4.759686-25.58971-1.433024-56.757978-13.204291-72.572418a23.030739 23.030739 0 0 0-15.916799-10.59414 32.191856 32.191856 0 0 0-26.664479 11.720087 49.951115 49.951115 0 0 0-17.810438 40.278204 47.340964 47.340964 0 0 0 24.207866 35.825595l0.614153 0.614153a59.368128 59.368128 0 0 0 43.758405 2.047177c-15.353826 58.139822-85.469633 87.875065-93.70952 90.792292l2.047177 4.862045a202.31225 202.31225 0 0 0 66.533247-42.837175A95.961414 95.961414 0 0 0 854.855559 269.205903a112.594726 112.594726 0 0 0 45.600863-29.17227c33.880777-36.746824 33.880777-103.177712-1.433023-160.703381z m-41.864766 182.659353l-0.614154 1.074768a55.939107 55.939107 0 0 1-42.274201-0.614153l-1.074768-1.84246c-17.042747-10.798858-20.881204-23.133098-20.881204-31.424164a48.415732 48.415732 0 0 1 15.865621-36.746824 31.8336 31.8336 0 0 1 22.877201-10.491781 20.471768 20.471768 0 0 1 13.25547 8.85404 98.622744 98.622744 0 0 1 12.846035 71.139394z" fill="#AAAAAA" ></path><path d="M95.608852 840.163521c-0.87005 9.928808-42.018304 21.597716-71.139395 7.93281-9.928808-3.838457-26.664478-22.518945-20.471768-19.601718 17.810438 7.011581 30.349397-8.905219 49.899935-7.011581 16.019159 2.917227 42.325381 10.850037 42.325381 18.680489z" fill="#F0F1F4" ></path><path d="M111.62801 836.939217a134.857774 134.857774 0 0 0-17.503361-2.558971c-10.235884-7.267478-32.089497-11.975984-38.794001-12.641317a42.837175 42.837175 0 0 0-25.333814 3.838457 31.372985 31.372985 0 0 1-24.566122 2.047177c-4.043174-2.047177-5.117942 0.87005-5.117942 0.87005-2.917227 4.708507 15.353826 19.601718 22.518945 22.518945a87.005015 87.005015 0 0 0 31.475344 5.783274 144.786581 144.786581 0 0 0 38.231027-6.397427c5.117942-2.047177 7.011581-5.117942 7.011581-7.93281a6.243889 6.243889 0 0 0-0.614153-2.507792c3.787277 0.511794 7.574554 1.125947 11.310652 1.995997z m-20.062333 3.121945c0 0.92123-0.92123 1.79128-3.838456 3.838456a77.280925 77.280925 0 0 1-63.61602 2.047177 67.966271 67.966271 0 0 1-16.633312-13.716085 31.628882 31.628882 0 0 0 21.290639-4.094353A58.037463 58.037463 0 0 1 51.338653 824.400259a122.83061 122.83061 0 0 1 32.959547 9.468193 144.377146 144.377146 0 0 0-21.546536 1.074768 81.528817 81.528817 0 0 1-34.443751-2.047177l-2.047176 5.117942a87.516809 87.516809 0 0 0 36.235029 2.047177 133.066494 133.066494 0 0 1 28.916373-0.716512 2.098356 2.098356 0 0 1 0.153538 0.716512z" fill="#AAAAAA" ></path></symbol><symbol id="dkic-round-selected-fill" viewBox="0 0 1024 1024"><path d="M512 0a512 512 0 1 0 512 512A512.5632 512.5632 0 0 0 512 0z m245.76 427.9808L465.1008 723.968s0 0.256-0.256 0.3072a33.5872 33.5872 0 0 1-7.936 5.12 35.1744 35.1744 0 0 1-3.84 2.5088 36.608 36.608 0 0 1-27.5456 0c-1.4336-0.6144-2.56-1.8944-3.9936-2.6624a36.096 36.096 0 0 1-7.8848-5.12 1.6896 1.6896 0 0 0 0-0.3072h-0.3072l-144.4352-148.0704a36.5568 36.5568 0 0 1 52.4288-51.2l118.016 121.2928 266.6496-269.5168a36.5568 36.5568 0 1 1 51.968 51.2z" fill="#333333" ></path></symbol><symbol id="dkic-round-add" viewBox="0 0 1024 1024"><path d="M512 1021.7472a509.7472 509.7472 0 1 1 361.9328-870.4 508.2112 508.2112 0 0 1 0 721.0496A509.6448 509.6448 0 0 1 512 1021.7472z m0-946.3808a437.0432 437.0432 0 0 0-310.4256 128 435.2 435.2 0 0 0 0 617.3184 440.32 440.32 0 0 0 620.8512 0 435.2 435.2 0 0 0 0-617.3184 437.0944 437.0944 0 0 0-310.4256-128z m256 400.0256h-219.392V256a36.608 36.608 0 0 0-73.1648 0v219.392H256a36.608 36.608 0 0 0 0 73.1648h219.4432V768a36.608 36.608 0 0 0 73.1648 0v-219.4432H768a36.608 36.608 0 0 0 0-73.1648z" fill="#333333" ></path></symbol><symbol id="dkic-round-lessen-fill" viewBox="0 0 1024 1024"><path d="M873.984 151.4496a513.792 513.792 0 0 0-724.0192 0 509.7984 509.7984 0 0 0 362.0864 870.4 509.6448 509.6448 0 0 0 361.9328-149.248 508.2112 508.2112 0 0 0 0-721.0496zM768 548.5568H256a36.608 36.608 0 0 1 0-73.1648h512a36.608 36.608 0 0 1 0 73.1648z" fill="#333333" ></path></symbol><symbol id="dkic-round-lessen" viewBox="0 0 1024 1024"><path d="M873.984 151.4496a513.792 513.792 0 0 0-724.0192 0 509.7984 509.7984 0 0 0 362.0864 870.4 509.6448 509.6448 0 0 0 361.9328-149.248 508.2112 508.2112 0 0 0 0-721.0496z m-51.5584 669.184a440.32 440.32 0 0 1-620.8512 0 435.2 435.2 0 0 1 0-617.3184 440.32 440.32 0 0 1 620.8 0 435.2 435.2 0 0 1 0 617.3184z" fill="#333333" ></path><path d="M548.608 548.5568H768a36.608 36.608 0 0 0 0-73.1648H256a36.608 36.608 0 0 0 0 73.1648h219.4432" fill="#333333" ></path></symbol><symbol id="dkic-round-close-fill" viewBox="0 0 1024 1024"><path d="M512 0a512 512 0 1 0 512 512A512.5632 512.5632 0 0 0 512 0z m209.92 672.3584a36.5568 36.5568 0 1 1-51.7632 51.6608l-158.72-159.0272-157.184 155.4944a36.5568 36.5568 0 1 1-51.2-52.0192l156.9792-155.2896L304.128 356.9664a36.5568 36.5568 0 1 1 51.7632-51.6096L512 461.7728l158.208-156.6208a36.5568 36.5568 0 1 1 51.2 52.0192l-158.1056 156.416z" fill="#333333" ></path></symbol><symbol id="dkic-search" viewBox="0 0 1024 1024"><path d="M472.32 5.376a406.8864 406.8864 0 1 0 228.096 743.8848l1.2288 1.7408 192.2048 245.248a35.84 35.84 0 0 0 28.2624 13.7216 35.84 35.84 0 0 0 28.16-57.6512l-192.2048-245.76a29.184 29.184 0 0 0-2.3552-2.6624A406.784 406.784 0 0 0 472.32 5.376z m0 742.0928a335.2064 335.2064 0 1 1 335.2064-335.2064A335.616 335.616 0 0 1 472.32 747.52z" fill="#333333" ></path></symbol><symbol id="dkic-round-selected" viewBox="0 0 1024 1024"><path d="M512 1024a512 512 0 1 1 512-512 512.5632 512.5632 0 0 1-512 512z m0-950.528A438.528 438.528 0 1 0 950.528 512 438.9888 438.9888 0 0 0 512 73.472z m245.76 302.7456a36.5056 36.5056 0 0 0-51.712 0.3072l-266.7008 269.5168-118.016-121.2928a36.5568 36.5568 0 0 0-52.4288 51.2l144.0256 148.0192h0.3072a1.6896 1.6896 0 0 1 0 0.3072 36.096 36.096 0 0 0 7.8848 5.12c1.4336 0.768 2.56 2.048 3.9936 2.6624a36.608 36.608 0 0 0 27.5456 0 35.1744 35.1744 0 0 0 3.84-2.5088 33.5872 33.5872 0 0 0 7.936-5.12l0.256-0.3072L757.76 427.9808a36.6592 36.6592 0 0 0 0-51.7632z" fill="#333333" ></path></symbol><symbol id="dkic-shipping-address" viewBox="0 0 1024 1024"><path d="M512 761.624595q304.537406-288.694715 304.639617-456.984978a304.639617 304.639617 0 0 0-609.279234 0q0 168.494685 304.639617 456.984978zM364.765184 304.895144A147.234816 147.234816 0 1 1 512 452.12996a147.285921 147.285921 0 0 1-147.234816-147.234816z" fill="#1C1C1C" ></path><path d="M1016.257524 972.792334L879.959275 693.347707a35.773818 35.773818 0 0 0-32.145331-20.084444h-144.93507a35.773818 35.773818 0 0 0 0 71.547637h122.653092l101.444328 207.89699H97.023706l100.984379-207.89699H314.22189a35.773818 35.773818 0 0 0 0-71.547637H175.623896a35.773818 35.773818 0 0 0-32.196437 20.186655L7.691371 972.894545a35.773818 35.773818 0 0 0 32.196437 51.105455h944.224384a35.773818 35.773818 0 0 0 32.145332-51.463193z" fill="#1C1C1C" ></path></symbol><symbol id="dkic-round" viewBox="0 0 1024 1024"><path d="M512 1024a512 512 0 1 1 512-512 512.5632 512.5632 0 0 1-512 512z m0-950.8352A438.8352 438.8352 0 1 0 950.8352 512 439.3472 439.3472 0 0 0 512 73.1648z" fill="#333333" ></path></symbol><symbol id="dkic-share" viewBox="0 0 1024 1024"><path d="M877.2096 566.8352v381.4912H71.68v-742.4h232.2944v-71.68H46.08a46.08 46.08 0 0 0-46.08 46.08v793.6a46.08 46.08 0 0 0 46.08 46.08h856.7296a46.08 46.08 0 0 0 46.08-46.08v-407.0912z" fill="#333333" ></path><path d="M1013.76 221.2864l-199.68-199.68a35.84 35.84 0 0 0-50.688 50.688l140.8512 140.8512H697.856a416.3584 416.3584 0 0 0-415.8976 415.8976v68.9664a423.0656 423.0656 0 0 0 3.4816 53.1456h83.456a336.8448 336.8448 0 0 1-4.3008-53.1456v-68.9664a333.6192 333.6192 0 0 1 333.2608-333.2608h190.464l-125.184 125.184a35.84 35.84 0 0 0 50.688 50.688l199.68-199.68a35.84 35.84 0 0 0 0.256-50.688z" fill="#333333" ></path></symbol><symbol id="dkic-servise" viewBox="0 0 1024 1024"><path d="M915.046707 381.1328h-1.024a405.1968 405.1968 0 0 0-803.84 0h-1.024A108.9536 108.9536 0 0 0 0.000307 490.0864v148.1728A109.0048 109.0048 0 0 0 108.953907 747.52h175.4624V381.1328h-102.4a333.6704 333.6704 0 0 1 659.5584 0h-102.4v443.6992a34.4576 34.4576 0 0 1-34.4064 34.4064v0.768a109.5168 109.5168 0 0 0-103.6288-74.24h-148.48a109.568 109.568 0 1 0 0 219.136h148.992a109.5168 109.5168 0 0 0 103.6288-74.24v0.768a106.7008 106.7008 0 0 0 106.5984-106.5984V747.52h103.168A109.0048 109.0048 0 0 0 1024.000307 638.2592V490.0864a108.9536 108.9536 0 0 0-108.9536-108.9536z m-702.3104 71.68V675.84H108.953907a37.376 37.376 0 0 1-37.2736-37.5808V490.0864a37.3248 37.3248 0 0 1 37.2736-37.2736z m389.12 480.1536H452.659507a37.888 37.888 0 1 1 0-75.776h148.992a37.888 37.888 0 0 1 0 75.776zM952.320307 638.2592a37.376 37.376 0 0 1-37.2736 37.3248h-103.7824V452.8128h103.7824a37.3248 37.3248 0 0 1 37.2736 37.2736z" fill="#333333" ></path></symbol><symbol id="dkic-siet-fill" viewBox="0 0 1024 1024"><path d="M824.549063 207.052237a28.408898 28.408898 0 0 1 14.434791-3.890228 28.971957 28.971957 0 0 1 25.286478 14.485979l80.517471 139.075631a29.074331 29.074331 0 0 1-8.445888 38.339215l-3.020045 1.893927-20.884379 12.028993M582.740715 403.611097l-2.20105-1.27968a119.726868 119.726868 0 1 0 46.068483 165.027543 120.033992 120.033992 0 0 0-43.867433-163.747863z" fill="#333333" ></path><path d="M956.816796 574.729918l-15.356161-8.804199a421.782554 421.782554 0 0 0 1.586803-103.756461l21.601-12.438491 5.11872-3.020045a90.498975 90.498975 0 0 0 28.255336-120.801799L917.402649 186.884479a90.447788 90.447788 0 0 0-123.463534-33.066933l-21.549812 12.336116a422.908673 422.908673 0 0 0-87.837241-49.293277v-26.207848A90.447788 90.447788 0 0 0 594.155461 0.255936L433.47883 0h-5.835341A90.447788 90.447788 0 0 0 343.082229 90.652537v34.500175A417.175706 417.175706 0 0 0 263.025444 174.036491L225.351662 152.28193l-5.11872-2.508173a90.498975 90.498975 0 0 0-119.010248 35.831042L26.028693 316.08098l-2.55936 4.658035a90.550162 90.550162 0 0 0 35.831042 119.010248L102.502374 464.882179a422.140865 422.140865 0 0 0 0 86.608748l-39.15821 22.52237-5.11872 3.020045A90.498975 90.498975 0 0 0 30.84029 697.835141l80.517471 139.024444A90.447788 90.447788 0 0 0 234.565359 870.182454l38.492776-22.164059a427.515521 427.515521 0 0 0 70.84309 42.024694v43.304374A90.447788 90.447788 0 0 0 434.349013 1023.744064l160.676631 0.255936h5.784154a90.498975 90.498975 0 0 0 84.868382-90.447788v-35.831042a422.703924 422.703924 0 0 0 84.305324-47.092227l20.884379 12.08018 4.709223 2.508173a90.447788 90.447788 0 0 0 118.95906-35.831043l75.449937-130.680929 2.508173-4.658036a90.60135 90.60135 0 0 0-35.67748-119.31737z m-276.973957 23.136615a181.049138 181.049138 0 0 1-313.470432-181.253886 180.690827 180.690827 0 0 1 247.029443-66.031492 181.305074 181.305074 0 0 1 66.440989 247.285378z" fill="#333333" ></path></symbol><symbol id="dkic-square-selected" viewBox="0 0 1024 1024"><path d="M776.6016 365.7728a39.3216 39.3216 0 0 0-55.6544 0.3072l-287.1296 290.2016-127.0784-130.56a39.3728 39.3728 0 1 0-56.32 54.8864l155.0848 159.3856 0.3072 0.256c0.3072 0.256 0 0 0 0.3072a36.608 36.608 0 0 0 8.448 5.5808 44.8512 44.8512 0 0 0 4.352 2.816 38.5024 38.5024 0 0 0 14.8992 2.9696 39.5264 39.5264 0 0 0 14.6944-2.8672c1.536-0.6144 2.7136-1.8944 4.1984-2.6624a37.4272 37.4272 0 0 0 8.5504-5.632 3.1232 3.1232 0 0 1 0-0.3072h0.3584l315.3408-318.7712a39.3728 39.3728 0 0 0-0.0512-55.9104zM905.8816 1024H118.1696A118.272 118.272 0 0 1 0 905.8304V118.1696A118.272 118.272 0 0 1 118.1696 0h787.712A118.3232 118.3232 0 0 1 1024 118.1696v787.6608A118.3232 118.3232 0 0 1 905.8816 1024zM118.1696 78.7456a39.4752 39.4752 0 0 0-39.3728 39.424v787.6608a39.4752 39.4752 0 0 0 39.3728 39.424h787.712a39.3728 39.3728 0 0 0 39.3728-39.424V118.1696a39.424 39.424 0 0 0-39.3728-39.424z" fill="#333333" ></path></symbol><symbol id="dkic-sort-fill" viewBox="0 0 1024 1024"><path d="M922.925619 22.016a101.0688 101.0688 0 0 1 78.2848 165.0688l-313.2928 383.1296v431.7696l-362.0864-164.4544v-267.3152L21.856819 185.8048a101.0688 101.0688 0 0 1 79.2576-163.84z" fill="#333333" ></path></symbol><symbol id="dkic-sort" viewBox="0 0 1024 1024"><path d="M922.976819 22.016H101.114419a101.0688 101.0688 0 0 0-79.2576 163.84l303.9744 384.4096v267.3152l71.68 32.5632v-324.8128l-15.36-19.5584L78.074419 141.312a29.44 29.44 0 0 1 4.8128-41.3184 29.7984 29.7984 0 0 1 18.2272-6.2976h821.8624a29.3376 29.3376 0 0 1 22.7328 47.9744l-313.2928 383.1808-16.1792 19.7632v424.96l71.68 32.5632v-431.9232l313.2928-383.1296A101.0688 101.0688 0 0 0 922.976819 22.016z" fill="#333333" ></path></symbol><symbol id="dkic-square" viewBox="0 0 1024 1024"><path d="M905.8304 1024H118.1696A118.272 118.272 0 0 1 0 905.8304V118.1696A118.272 118.272 0 0 1 118.1696 0h787.6608A118.272 118.272 0 0 1 1024 118.1696v787.6608A118.272 118.272 0 0 1 905.8304 1024zM118.1696 78.7456a39.5264 39.5264 0 0 0-39.424 39.424v787.6608a39.4752 39.4752 0 0 0 39.424 39.424h787.6608a39.424 39.424 0 0 0 39.424-39.424V118.1696a39.4752 39.4752 0 0 0-39.424-39.424z" fill="#333333" ></path></symbol><symbol id="dkic-star-fill" viewBox="0 0 1024 1024"><path d="M1022.203699 389.120032a36.761598 36.761598 0 0 0-29.183998-24.575999l-308.940785-47.871998-138.239993-295.577585A36.710398 36.710398 0 0 0 512.968525 0.000051a36.505598 36.505598 0 0 0-33.075199 20.940799l-139.263993 294.911985-309.452784 46.591998A36.607998 36.607998 0 0 0 10.28695 424.08963l224.511989 230.963188-53.503998 325.478384a36.607998 36.607998 0 0 0 53.759998 37.990398l276.479986-152.063992 275.814386 152.985592a36.966398 36.966398 0 0 0 17.715199 4.5568h0.7168a36.556798 36.556798 0 0 0 36.607998-36.556798 37.478398 37.478398 0 0 0-2.304-12.9536l-51.199997-318.463984L1013.8069 426.03523a36.710398 36.710398 0 0 0 8.396799-36.915198z" fill="#333333" ></path></symbol><symbol id="dkic-square-selected-fill" viewBox="0 0 1024 1024"><path d="M905.8816 0H118.1696A118.272 118.272 0 0 0 0 118.1696v787.6608A118.272 118.272 0 0 0 118.1696 1024h787.712A118.3232 118.3232 0 0 0 1024 905.8304V118.1696A118.3232 118.3232 0 0 0 905.8816 0z m-128.9728 421.4784l-315.3408 318.7712h-0.3584a3.1232 3.1232 0 0 0 0 0.3072 37.4272 37.4272 0 0 1-8.5504 5.632c-1.4848 0.768-2.6624 2.048-4.1984 2.6624a39.5264 39.5264 0 0 1-14.6944 2.8672 38.5024 38.5024 0 0 1-14.8992-2.9696 44.8512 44.8512 0 0 1-4.352-2.816 36.608 36.608 0 0 1-8.448-5.5808v-0.3072c0-0.3072 0 0-0.3072-0.256L250.2656 580.608a39.3728 39.3728 0 1 1 56.32-54.8864l127.0784 130.56 287.2832-290.2016a39.3728 39.3728 0 1 1 55.9616 55.3984z" fill="#333333" ></path></symbol><symbol id="dkic-stop-v-fill" viewBox="0 0 1024 1024"><path d="M512.3072 0a512 512 0 1 0 512 512 512 512 0 0 0-512-512zM442.7264 677.632c0 24.9856-16.0768 45.2096-35.84 45.2096-19.8144 0-35.84-20.48-35.84-45.2096V376.4736c0-24.9344 16.0256-45.1584 35.84-45.1584 19.7632 0 35.84 20.48 35.84 45.1584z m195.7376 0c0 24.9856-16.0256 45.2096-35.84 45.2096-19.7632 0-35.84-20.48-35.84-45.2096V376.4736c0-24.9344 16.0768-45.1584 35.84-45.1584 19.8144 0 35.84 20.48 35.84 45.1584z" fill="#333333" ></path></symbol><symbol id="dkic-star-half" viewBox="0 0 1024 1024"><path d="M512.763725 95.078446l115.660794 247.603188 13.875199 29.695999 32.409599 5.119999 261.119987 40.294398-191.129591 195.379191-21.657599 22.118398 5.12 30.719999 44.339198 275.097586-231.116789-127.999993-29.644798-16.4352M512.968525 0.000051a36.505598 36.505598 0 0 0-33.075199 20.940799l-139.263993 294.911985-309.452784 46.591998A36.607998 36.607998 0 0 0 10.28695 424.08963l224.511989 230.963188-53.503998 325.478384a36.607998 36.607998 0 0 0 53.759998 37.990398l276.479986-152.063992 275.814386 152.985592a36.966398 36.966398 0 0 0 17.715199 4.5568h0.7168a36.556798 36.556798 0 0 0 36.607998-36.556798 37.478398 37.478398 0 0 0-2.304-12.9536l-51.199997-318.463984L1013.8069 426.03523a36.556798 36.556798 0 0 0-20.479999-61.439997l-309.247985-47.923198-138.239993-295.577585A36.710398 36.710398 0 0 0 512.968525 0.000051z" fill="#333333" ></path></symbol><symbol id="dkic-star" viewBox="0 0 1024 1024"><path d="M512.712525 119.193645l106.444794 227.839989 16.1792 34.662398 37.836798 5.8368L914.581305 424.96003 737.326914 605.900821l-25.292799 25.599999 5.7344 35.839998 40.959997 254.361587-212.684789-117.759994-34.611198-19.199999-34.559998 19.097599-213.09439 117.043194 41.830398-254.207987 5.888-35.839998-25.190399-25.907199-176.844791-181.759991 241.817588-36.454398 37.887998-5.6832 16.332799-34.559998 107.519995-227.276789M512.968525 0.000051a36.505598 36.505598 0 0 0-33.075199 20.940799l-139.263993 294.911985-309.452784 46.591998A36.607998 36.607998 0 0 0 10.28695 424.08963l224.511989 230.963188-53.503998 325.478384a36.607998 36.607998 0 0 0 53.759998 37.990398l276.479986-152.063992 275.814386 152.985592a36.966398 36.966398 0 0 0 17.715199 4.5568h0.7168a36.556798 36.556798 0 0 0 36.607998-36.556798 37.478398 37.478398 0 0 0-2.304-12.9536l-51.199997-318.463984L1013.8069 426.03523a36.556798 36.556798 0 0 0-20.479999-61.439997l-309.247985-47.923198-138.239993-295.577585A36.710398 36.710398 0 0 0 512.968525 0.000051z" fill="#333333" ></path></symbol><symbol id="dkic-stop-fill" viewBox="0 0 1035 1024"><path d="M523.1104 0a512 512 0 1 1-512 512 512 512 0 0 1 512-512z m75.264 361.4208H447.7952a75.3152 75.3152 0 0 0-75.3152 75.264v150.6304a75.3152 75.3152 0 0 0 75.3152 75.264h150.5792a75.3152 75.3152 0 0 0 75.3152-75.264V436.6848a75.3152 75.3152 0 0 0-75.3152-75.264z" fill="#333333" ></path></symbol><symbol id="dkic-tick" viewBox="0 0 1024 1024"><path d="M701.952 513.4336L977.92 237.7216c12.3904-12.3904 11.1104-33.7408-2.8672-47.7696-14.0288-13.9776-35.4304-15.36-47.8208-2.8672l-275.9168 275.6608-44.9024 44.9024L330.7008 783.36c-12.3904 12.3904-11.1104 33.792 2.9184 47.7696 13.9776 13.9776 35.3792 15.36 47.7696 2.9184l275.712-275.712z" fill="#333333" ></path><path d="M99.0208 495.1552l291.80416 291.80416a26.624 26.624 0 0 1 0 37.65248l-13.0304 13.0304a26.624 26.624 0 0 1-37.65248 0L48.3328 545.8432a35.84 35.84 0 0 1 0-50.68288 35.84 35.84 0 0 1 50.688 0z" fill="#333333" ></path></symbol><symbol id="dkic-stop-v" viewBox="0 0 1024 1024"><path d="M512 0a512 512 0 1 0 512 512A512 512 0 0 0 512 0z m0 952.32a440.32 440.32 0 1 1 440.32-440.32 440.832 440.832 0 0 1-440.32 440.32z" fill="#333333" ></path><path d="M406.5792 331.3152c-19.7632 0-35.84 20.48-35.84 45.1584v301.1584c0 24.9856 16.0768 45.2096 35.84 45.2096 19.8144 0 35.84-20.48 35.84-45.2096V376.4736c0-24.9344-16.0256-45.1584-35.84-45.1584zM602.368 331.3152c-19.8144 0-35.84 20.48-35.84 45.1584v301.1584c0 24.9856 16.0256 45.2096 35.84 45.2096 19.7632 0 35.84-20.48 35.84-45.2096V376.4736c0-24.9344-16.0768-45.1584-35.84-45.1584z" fill="#333333" ></path></symbol><symbol id="dkic-stop" viewBox="0 0 1024 1024"><path d="M512 0a512 512 0 1 0 512 512A512 512 0 0 0 512 0z m0 952.32a440.32 440.32 0 1 1 440.32-440.32 440.832 440.832 0 0 1-440.32 440.32z" fill="#333333" ></path><path d="M587.3152 361.4208H436.6848a75.264 75.264 0 0 0-75.264 75.264v150.6304a75.264 75.264 0 0 0 75.264 75.264h150.6304a75.264 75.264 0 0 0 75.264-75.264V436.6848a75.264 75.264 0 0 0-75.264-75.264z m3.584 225.8944a3.4816 3.4816 0 0 1-3.584 3.584H436.6848a3.584 3.584 0 0 1-3.584-3.584V436.6848a3.584 3.584 0 0 1 3.584-3.584h150.6304a3.584 3.584 0 0 1 3.584 3.584z" fill="#333333" ></path></symbol><symbol id="dkic-twitter" viewBox="0 0 1024 1024"><path d="M512 0a512 512 0 1 0 512 512A512 512 0 0 0 512 0z m252.672 431.5136v15.7184c0 161.792-122.88 348.16-348.16 348.16a346.88 346.88 0 0 1-187.6992-55.04 265.8304 265.8304 0 0 0 29.2352 1.7408 245.76 245.76 0 0 0 152.0128-52.3776 122.88 122.88 0 0 1-114.3808-84.992 125.3376 125.3376 0 0 0 55.1424-2.1504 122.4704 122.4704 0 0 1-97.024-120.0128V481.28a121.7536 121.7536 0 0 0 55.1424 15.36A122.4192 122.4192 0 0 1 271.36 332.8a347.3408 347.3408 0 0 0 252.0576 128 118.8352 118.8352 0 0 1-3.2768-27.5456 122.4704 122.4704 0 0 1 211.6096-84.0704 246.2208 246.2208 0 0 0 77.4656-29.696 122.88 122.88 0 0 1-53.8112 67.7376 242.8928 242.8928 0 0 0 70.1952-19.3024V368.64a246.7328 246.7328 0 0 1-60.928 63.0272z" fill="#55ACEE" ></path></symbol><symbol id="dkic-upload" viewBox="0 0 1024 1024"><path d="M917.175022 259.573888h-111.865987v65.686069h111.865987a21.912422 21.912422 0 0 1 21.912422 21.912422v589.229129a21.912422 21.912422 0 0 1-21.912422 21.912423H106.824978a21.912422 21.912422 0 0 1-21.912422-21.912423V347.172379a21.912422 21.912422 0 0 1 21.912422-21.912422h111.865987V259.573888H106.824978A87.598492 87.598492 0 0 0 19.175289 347.172379v589.229129A87.598492 87.598492 0 0 0 106.824978 1024h810.350044a87.598492 87.598492 0 0 0 87.649689-87.598492V347.172379a87.598492 87.598492 0 0 0-87.649689-87.598491z" fill="#333333" ></path><path d="M284.633021 255.734094a32.766239 32.766239 0 0 0 46.435904 0l137.618203-137.618203v585.338138h68.450721V109.053978l146.680116 146.680116a32.817436 32.817436 0 1 0 46.435904-46.435904l-199.669268-199.669268a32.868633 32.868633 0 0 0-46.487101 0l-199.669268 199.669268a32.766239 32.766239 0 0 0 0.204789 46.435904z" fill="#333333" ></path></symbol><symbol id="dkic-visible" viewBox="0 0 1024 1024"><path d="M1008.9472 462.6944q-224.4096-332.8-496.9472-332.8Q244.5312 130.0992 23.3984 450.56l-8.3456 12.1344-3.328 5.12a88.2688 88.2688 0 0 0 3.328 93.2352q224.4096 332.8 496.9472 332.8 267.52 0 488.6016-320.4096l8.3456-12.1856 3.328-5.12a88.2688 88.2688 0 0 0-3.328-93.44z m-58.4704 56.8832l-1.5872 2.56-7.3728 10.752c-68.0448 98.56-139.6736 172.9024-212.9408 220.9792-70.144 46.08-141.0048 68.352-216.576 68.352-76.8 0-149.1968-23.2448-220.6208-71.0656-74.7008-49.7152-147.6608-127.3344-216.8832-229.9392a16.5888 16.5888 0 0 1-0.9728-16.7936l1.5872-2.56 7.424-10.8032C150.528 392.4992 222.1568 318.1568 295.424 270.1312c70.144-46.08 141.0048-68.352 216.576-68.352 76.8 0 149.1968 23.2448 220.6208 71.0656 74.7008 49.9712 147.6608 127.3344 216.8832 229.9392a16.5888 16.5888 0 0 1 0.9728 16.7936z" fill="#333333" ></path><path d="M514.4576 324.9152H512a194.816 194.816 0 0 0 0 389.632h5.12a194.816 194.816 0 0 0-2.4064-389.632z m1.536 317.952h-3.1232a123.136 123.136 0 0 1 0-246.272h1.5872a123.136 123.136 0 0 1 1.536 246.272z" fill="#333333" ></path></symbol><symbol id="dkic-wechat" viewBox="0 0 1024 1024"><path d="M559.4112 504.4224a24.2688 24.2688 0 1 0 23.6544 24.8832v-0.6144a24.1664 24.1664 0 0 0-23.6544-24.2688zM355.9424 355.7376a28.672 28.672 0 1 0 28.3648 28.9792v-0.3072a28.4672 28.4672 0 0 0-28.3648-28.672zM496.64 413.44a28.672 28.672 0 1 0-28.3136-28.9792v0.3072a28.5184 28.5184 0 0 0 28.3136 28.672zM686.6432 505.6H686.08a24.0128 24.0128 0 1 0 0.8192 0z" fill="#0CC472" ></path><path d="M512 0a512 512 0 1 0 512 512A512 512 0 0 0 512 0zM430.08 619.52a242.8416 242.8416 0 0 1-64.768-8.6528l-3.4304-1.024-74.24 37.6832L307.2 585.1648l-1.8432-1.1776C256.4608 552.4992 225.28 503.2448 225.28 447.8976 225.28 353.28 316.8256 276.48 430.08 276.48c102.4 0 187.392 63.0272 202.5984 145.152h-8.6528c-102.4-0.3072-186.624 69.888-186.624 156.3136a133.4784 133.4784 0 0 0 6.5536 40.96c-4.608 0-9.1648 0.4608-13.7728 0.4608z m300.6976 74.752l-1.6384 1.024 16.7424 52.224-62.5664-32-2.9696 0.8704a202.7008 202.7008 0 0 1-55.1424 7.3216c-95.6416 0-173.312-64.8192-173.312-144.7424s77.6192-144.7936 173.312-144.7936S798.72 498.9952 798.72 578.9696c0 46.848-26.7776 88.5248-68.0448 115.0464z" fill="#0CC472" ></path></symbol><symbol id="dkic-unvisible" viewBox="0 0 1024 1024"><path d="M319.6416 531.2512A192.9216 192.9216 0 0 0 329.1136 593.92l62.208-62.208a122.88 122.88 0 0 1 120.9856-120.9856L574.5152 348.16a193.8432 193.8432 0 0 0-60.0576-9.5232H512a194.56 194.56 0 0 0-192.3584 192.6144zM515.9936 656.7936h-4.3008L450.56 717.7728a193.9968 193.9968 0 0 0 61.44 10.7008h5.12a194.56 194.56 0 0 0 181.6576-258.5088l-61.2352 60.9792v1.1776a123.1872 123.1872 0 0 1-121.5488 124.672z" fill="#333333" ></path><path d="M1008.9472 476.6208a1069.2608 1069.2608 0 0 0-143.36-173.7728l-50.7392 50.7392a996.6592 996.6592 0 0 1 134.6048 163.1232 16.5888 16.5888 0 0 1 0.9728 16.7936l-1.5872 2.56-7.3728 10.752c-67.9936 98.56-139.6224 172.9536-212.8896 221.184-70.144 46.08-141.0048 68.352-216.576 68.352a367.0528 367.0528 0 0 1-148.48-31.2832l-53.76 53.6576a445.44 445.44 0 0 0 202.24 49.1008q267.52 0 488.6016-320.4096l8.3456-12.1856 3.328-5.12a88.3712 88.3712 0 0 0-3.328-93.4912zM166.3488 756.5312l50.7392-50.7392c-48.7936-45.312-96.512-102.4-142.592-170.6496a16.5888 16.5888 0 0 1-0.9728-16.7936l1.5872-2.56 7.424-10.8032C150.528 406.4256 222.1568 332.1344 295.424 284.1088c70.144-46.08 141.0048-68.4032 216.576-68.4032a369.152 369.152 0 0 1 159.0784 35.84l53.4016-53.1456A447.5392 447.5392 0 0 0 512 144.0256q-267.4688 0-488.6016 320.4096l-8.3456 12.1856-3.328 5.12a88.2688 88.2688 0 0 0 3.328 93.2352q73.1136 108.5952 151.296 181.5552zM110.73536 881.70496l763.83232-763.0336 50.65728 50.7136-763.8272 763.0336z" fill="#333333" ></path></symbol><symbol id="dkic-clock-fill" viewBox="0 0 1024 1024"><path d="M512 0a512 512 0 1 0 512 512A512.5632 512.5632 0 0 0 512 0z m182.8352 585.1648H475.4432a36.5056 36.5056 0 0 1-36.608-36.608V256A36.608 36.608 0 1 1 512 256v256h182.8352a36.608 36.608 0 1 1 0 73.1648z" fill="#333333" ></path></symbol><symbol id="dkic-siet" viewBox="0 0 1024 1024"><path d="M956.816796 574.729918l-15.356161-8.804199a421.782554 421.782554 0 0 0 1.586803-103.756461l21.601-12.438491 5.11872-3.020045a90.498975 90.498975 0 0 0 28.255336-120.801799L917.402649 186.884479a90.447788 90.447788 0 0 0-123.463534-33.066933l-21.549812 12.336116a422.908673 422.908673 0 0 0-87.837241-49.293277v-26.207848A90.447788 90.447788 0 0 0 594.155461 0.255936L433.47883 0h-5.835341A90.447788 90.447788 0 0 0 343.082229 90.652537v34.500175A417.175706 417.175706 0 0 0 263.025444 174.036491L225.351662 152.28193l-5.11872-2.508173a90.498975 90.498975 0 0 0-119.010248 35.831042L26.028693 316.08098l-2.55936 4.658035a90.550162 90.550162 0 0 0 35.831042 119.010248L102.502374 464.882179a422.140865 422.140865 0 0 0 0 86.608748l-39.15821 22.52237-5.11872 3.020045A90.498975 90.498975 0 0 0 30.84029 697.835141l80.517471 139.024444A90.447788 90.447788 0 0 0 234.565359 870.182454l38.492776-22.164059a427.515521 427.515521 0 0 0 70.84309 42.024694v43.304374A90.447788 90.447788 0 0 0 434.349013 1023.744064l160.676631 0.255936h5.784154a90.498975 90.498975 0 0 0 84.868382-90.447788v-35.831042a422.703924 422.703924 0 0 0 84.305324-47.092227l20.884379 12.08018 4.709223 2.508173a90.447788 90.447788 0 0 0 118.95906-35.831043l75.449937-130.680929 2.508173-4.658036a90.60135 90.60135 0 0 0-35.67748-119.31737z m-26.105474-188.164159l-2.610547 1.586803-20.782005 11.977805-40.43789 23.341365 5.11872 46.426793a348.072982 348.072982 0 0 1-1.330867 86.045689l-6.807898 48.064784 41.768758 24.16036 15.356161 8.906573a18.888078 18.888078 0 0 1 7.67808 24.262734l-1.330867 2.456986L852.446088 793.40165a18.683329 18.683329 0 0 1-16.379905 9.418445 17.966708 17.966708 0 0 1-7.780454-1.740365l-2.508173-1.330867-19.860635-11.465934-40.130768-23.187803-37.622594 27.078031a352.731017 352.731017 0 0 1-70.024094 39.055836l-44.123369 18.376206v83.793451a18.939265 18.939265 0 0 1-16.994151 18.785704h-3.020045L434.502574 952.08198a18.836891 18.836891 0 0 1-18.83689-18.836891v-88.707423l-40.949763-19.297576a356.570057 356.570057 0 0 1-58.967658-35.012047L277.767358 762.689328l-40.43789 23.290177-38.492777 22.112872a18.376206 18.376206 0 0 1-9.316071 2.55936 18.990452 18.990452 0 0 1-16.431092-9.469633l-80.517471-139.280379a18.836891 18.836891 0 0 1 5.11872-24.672232l2.55936-1.586804 38.339216-22.061684 40.693826-23.238991-5.11872-46.375606a352.32152 352.32152 0 0 1 0-71.969207l4.606848-46.068483L138.333417 402.843289l-43.56031-25.184104A18.836891 18.836891 0 0 1 87.146213 353.498825l1.279681-2.405798 75.091627-129.861935a18.734516 18.734516 0 0 1 16.379905-9.418445 18.47858 18.47858 0 0 1 7.729267 1.689178l2.456986 1.330867 37.110722 21.396251 41.819945 24.16036 38.236841-29.688578a348.072982 348.072982 0 0 1 66.287428-40.949763l40.949763-19.39995V90.550162A18.836891 18.836891 0 0 1 431.431342 71.662084h3.12242l159.448138 0.255936a18.888078 18.888078 0 0 1 18.83689 18.888078V164.72042l44.072182 18.325019a354.420195 354.420195 0 0 1 73.044139 40.949762l37.980905 27.487528 40.335516-23.187803 21.549813-12.387303a18.325019 18.325019 0 0 1 9.316071-2.508173 18.990452 18.990452 0 0 1 16.431092 9.367258l80.517471 139.075631a18.939265 18.939265 0 0 1-5.374657 24.72342z" fill="#333333" ></path><path d="M613.504224 350.427593a180.690827 180.690827 0 0 0-247.029443 66.031492 181.049138 181.049138 0 1 0 313.316871 181.509823 181.305074 181.305074 0 0 0-66.287428-247.541315z m4.197351 211.710273a109.387053 109.387053 0 0 1-189.392652-109.847739 108.977556 108.977556 0 0 1 146.95846-40.949762l2.098675 1.228493a109.796551 109.796551 0 0 1 40.335517 149.569008z" fill="#333333" ></path></symbol></svg>',l=(a=document.getElementsByTagName("script"))[a.length-1].getAttribute("data-injectcss");if(l&&!p.__iconfont__svg__cssinject__){p.__iconfont__svg__cssinject__=!0;try{document.write("<style>.svgfont {display: inline-block;width: 1em;height: 1em;fill: currentColor;vertical-align: -0.1em;font-size:16px;}</style>")}catch(a){console&&console.log(a)}}!function(a){if(document.addEventListener)if(~["complete","loaded","interactive"].indexOf(document.readyState))setTimeout(a,0);else{var l=function(){document.removeEventListener("DOMContentLoaded",l,!1),a()};document.addEventListener("DOMContentLoaded",l,!1)}else document.attachEvent&&(h=a,t=p.document,d=!1,(o=function(){try{t.documentElement.doScroll("left")}catch(a){return void setTimeout(o,50)}i()})(),t.onreadystatechange=function(){"complete"==t.readyState&&(t.onreadystatechange=null,i())});function i(){d||(d=!0,h())}var h,t,d,o}(function(){var a,l,i,h,t,d;(a=document.createElement("div")).innerHTML=o,o=null,(l=a.getElementsByTagName("svg")[0])&&(l.setAttribute("aria-hidden","true"),l.style.position="absolute",l.style.width=0,l.style.height=0,l.style.overflow="hidden",i=l,(h=document.body).firstChild?(t=i,(d=h.firstChild).parentNode.insertBefore(t,d)):h.appendChild(i))})}(window);
\ No newline at end of file

src/assets/font/iconfont.json

+{
+  "id": "1666972",
+  "name": "dankal icon",
+  "font_family": "dk-iconfont",
+  "css_prefix_text": "dkic-",
+  "description": "蛋壳图标",
+  "glyphs": [
+    {
+      "icon_id": "13244010",
+      "name": "arrow-double-down",
+      "font_class": "arrow-double-down",
+      "unicode": "e625",
+      "unicode_decimal": 58917
+    },
+    {
+      "icon_id": "13244011",
+      "name": "add",
+      "font_class": "add",
+      "unicode": "e626",
+      "unicode_decimal": 58918
+    },
+    {
+      "icon_id": "13244012",
+      "name": "about",
+      "font_class": "about",
+      "unicode": "e627",
+      "unicode_decimal": 58919
+    },
+    {
+      "icon_id": "13244013",
+      "name": "all-fill",
+      "font_class": "all-fill",
+      "unicode": "e628",
+      "unicode_decimal": 58920
+    },
+    {
+      "icon_id": "13244014",
+      "name": "arrow-double-right",
+      "font_class": "arrow-double-right",
+      "unicode": "e629",
+      "unicode_decimal": 58921
+    },
+    {
+      "icon_id": "13244015",
+      "name": "arrow-v-down",
+      "font_class": "arrow-v-down",
+      "unicode": "e62a",
+      "unicode_decimal": 58922
+    },
+    {
+      "icon_id": "13244016",
+      "name": "arrow-left",
+      "font_class": "arrow-left",
+      "unicode": "e62b",
+      "unicode_decimal": 58923
+    },
+    {
+      "icon_id": "13244017",
+      "name": "alipay",
+      "font_class": "alipay",
+      "unicode": "e62c",
+      "unicode_decimal": 58924
+    },
+    {
+      "icon_id": "13244018",
+      "name": "arrow-double-up",
+      "font_class": "arrow-double-up",
+      "unicode": "e62d",
+      "unicode_decimal": 58925
+    },
+    {
+      "icon_id": "13244019",
+      "name": "arrow-down",
+      "font_class": "arrow-down",
+      "unicode": "e62e",
+      "unicode_decimal": 58926
+    },
+    {
+      "icon_id": "13244020",
+      "name": "arrow-up",
+      "font_class": "arrow-up",
+      "unicode": "e62f",
+      "unicode_decimal": 58927
+    },
+    {
+      "icon_id": "13244021",
+      "name": "arrow-v-left",
+      "font_class": "arrow-v-left",
+      "unicode": "e630",
+      "unicode_decimal": 58928
+    },
+    {
+      "icon_id": "13244022",
+      "name": "about-fill",
+      "font_class": "about-fill",
+      "unicode": "e631",
+      "unicode_decimal": 58929
+    },
+    {
+      "icon_id": "13244023",
+      "name": "all",
+      "font_class": "all",
+      "unicode": "e632",
+      "unicode_decimal": 58930
+    },
+    {
+      "icon_id": "13244024",
+      "name": "arrow-vv-down",
+      "font_class": "arrow-vv-down",
+      "unicode": "e633",
+      "unicode_decimal": 58931
+    },
+    {
+      "icon_id": "13244025",
+      "name": "arrow-double-left",
+      "font_class": "arrow-double-left",
+      "unicode": "e634",
+      "unicode_decimal": 58932
+    },
+    {
+      "icon_id": "13244026",
+      "name": "arrow-vv-left",
+      "font_class": "arrow-vv-left",
+      "unicode": "e635",
+      "unicode_decimal": 58933
+    },
+    {
+      "icon_id": "13244027",
+      "name": "arrow-vv-right",
+      "font_class": "arrow-vv-right",
+      "unicode": "e636",
+      "unicode_decimal": 58934
+    },
+    {
+      "icon_id": "13244028",
+      "name": "arrow-vvv-left",
+      "font_class": "arrow-vvv-left",
+      "unicode": "e637",
+      "unicode_decimal": 58935
+    },
+    {
+      "icon_id": "13244029",
+      "name": "arrow-v-up",
+      "font_class": "arrow-v-up",
+      "unicode": "e638",
+      "unicode_decimal": 58936
+    },
+    {
+      "icon_id": "13244030",
+      "name": "arrow-vvv-right",
+      "font_class": "arrow-vvv-right",
+      "unicode": "e639",
+      "unicode_decimal": 58937
+    },
+    {
+      "icon_id": "13244031",
+      "name": "arrow-vvv-down",
+      "font_class": "arrow-vvv-down",
+      "unicode": "e63a",
+      "unicode_decimal": 58938
+    },
+    {
+      "icon_id": "13244032",
+      "name": "arrow-right",
+      "font_class": "arrow-right",
+      "unicode": "e63b",
+      "unicode_decimal": 58939
+    },
+    {
+      "icon_id": "13244033",
+      "name": "arrow-v-right",
+      "font_class": "arrow-v-right",
+      "unicode": "e63c",
+      "unicode_decimal": 58940
+    },
+    {
+      "icon_id": "13244034",
+      "name": "cart-add-fill",
+      "font_class": "cart-add-fill",
+      "unicode": "e63d",
+      "unicode_decimal": 58941
+    },
+    {
+      "icon_id": "13244035",
+      "name": "close",
+      "font_class": "close",
+      "unicode": "e63e",
+      "unicode_decimal": 58942
+    },
+    {
+      "icon_id": "13244036",
+      "name": "cart",
+      "font_class": "cart",
+      "unicode": "e63f",
+      "unicode_decimal": 58943
+    },
+    {
+      "icon_id": "13244037",
+      "name": "cart-add",
+      "font_class": "cart-add",
+      "unicode": "e640",
+      "unicode_decimal": 58944
+    },
+    {
+      "icon_id": "13244038",
+      "name": "cart-fill",
+      "font_class": "cart-fill",
+      "unicode": "e641",
+      "unicode_decimal": 58945
+    },
+    {
+      "icon_id": "13244039",
+      "name": "arrow-vvv-up",
+      "font_class": "arrow-vvv-up",
+      "unicode": "e642",
+      "unicode_decimal": 58946
+    },
+    {
+      "icon_id": "13244040",
+      "name": "arrow-vv-up",
+      "font_class": "arrow-vv-up",
+      "unicode": "e643",
+      "unicode_decimal": 58947
+    },
+    {
+      "icon_id": "13244041",
+      "name": "clock",
+      "font_class": "clock",
+      "unicode": "e644",
+      "unicode_decimal": 58948
+    },
+    {
+      "icon_id": "13244042",
+      "name": "facebook",
+      "font_class": "facebook",
+      "unicode": "e645",
+      "unicode_decimal": 58949
+    },
+    {
+      "icon_id": "13244043",
+      "name": "delete-fill",
+      "font_class": "delete-fill",
+      "unicode": "e646",
+      "unicode_decimal": 58950
+    },
+    {
+      "icon_id": "13244044",
+      "name": "editor",
+      "font_class": "editor",
+      "unicode": "e647",
+      "unicode_decimal": 58951
+    },
+    {
+      "icon_id": "13244045",
+      "name": "date-fill",
+      "font_class": "date-fill",
+      "unicode": "e648",
+      "unicode_decimal": 58952
+    },
+    {
+      "icon_id": "13244046",
+      "name": "delete",
+      "font_class": "delete",
+      "unicode": "e649",
+      "unicode_decimal": 58953
+    },
+    {
+      "icon_id": "13244047",
+      "name": "download",
+      "font_class": "download",
+      "unicode": "e64a",
+      "unicode_decimal": 58954
+    },
+    {
+      "icon_id": "13244048",
+      "name": "favorite",
+      "font_class": "favorite",
+      "unicode": "e64b",
+      "unicode_decimal": 58955
+    },
+    {
+      "icon_id": "13244049",
+      "name": "help",
+      "font_class": "help",
+      "unicode": "e64c",
+      "unicode_decimal": 58956
+    },
+    {
+      "icon_id": "13244050",
+      "name": "favorite-fill",
+      "font_class": "favorite-fill",
+      "unicode": "e64d",
+      "unicode_decimal": 58957
+    },
+    {
+      "icon_id": "13244051",
+      "name": "date",
+      "font_class": "date",
+      "unicode": "e64e",
+      "unicode_decimal": 58958
+    },
+    {
+      "icon_id": "13244052",
+      "name": "help-fill",
+      "font_class": "help-fill",
+      "unicode": "e64f",
+      "unicode_decimal": 58959
+    },
+    {
+      "icon_id": "13244053",
+      "name": "image-fill",
+      "font_class": "image-fill",
+      "unicode": "e650",
+      "unicode_decimal": 58960
+    },
+    {
+      "icon_id": "13244054",
+      "name": "friends",
+      "font_class": "friends",
+      "unicode": "e651",
+      "unicode_decimal": 58961
+    },
+    {
+      "icon_id": "13244055",
+      "name": "image",
+      "font_class": "image",
+      "unicode": "e652",
+      "unicode_decimal": 58962
+    },
+    {
+      "icon_id": "13244056",
+      "name": "lessen",
+      "font_class": "lessen",
+      "unicode": "e653",
+      "unicode_decimal": 58963
+    },
+    {
+      "icon_id": "13244057",
+      "name": "mail",
+      "font_class": "mail",
+      "unicode": "e654",
+      "unicode_decimal": 58964
+    },
+    {
+      "icon_id": "13244058",
+      "name": "lock",
+      "font_class": "lock",
+      "unicode": "e655",
+      "unicode_decimal": 58965
+    },
+    {
+      "icon_id": "13244059",
+      "name": "mail-fill",
+      "font_class": "mail-fill",
+      "unicode": "e656",
+      "unicode_decimal": 58966
+    },
+    {
+      "icon_id": "13244060",
+      "name": "map",
+      "font_class": "map",
+      "unicode": "e657",
+      "unicode_decimal": 58967
+    },
+    {
+      "icon_id": "13244061",
+      "name": "phone",
+      "font_class": "phone",
+      "unicode": "e658",
+      "unicode_decimal": 58968
+    },
+    {
+      "icon_id": "13244062",
+      "name": "qq",
+      "font_class": "qq",
+      "unicode": "e659",
+      "unicode_decimal": 58969
+    },
+    {
+      "icon_id": "13244063",
+      "name": "play-fill",
+      "font_class": "play-fill",
+      "unicode": "e65a",
+      "unicode_decimal": 58970
+    },
+    {
+      "icon_id": "13244064",
+      "name": "play",
+      "font_class": "play",
+      "unicode": "e65b",
+      "unicode_decimal": 58971
+    },
+    {
+      "icon_id": "13244065",
+      "name": "pic",
+      "font_class": "pic",
+      "unicode": "e65c",
+      "unicode_decimal": 58972
+    },
+    {
+      "icon_id": "13244066",
+      "name": "QQspace",
+      "font_class": "QQspace",
+      "unicode": "e65d",
+      "unicode_decimal": 58973
+    },
+    {
+      "icon_id": "13244067",
+      "name": "round-close",
+      "font_class": "round-close",
+      "unicode": "e65e",
+      "unicode_decimal": 58974
+    },
+    {
+      "icon_id": "13244068",
+      "name": "round-add-fill",
+      "font_class": "round-add-fill",
+      "unicode": "e65f",
+      "unicode_decimal": 58975
+    },
+    {
+      "icon_id": "13244069",
+      "name": "none",
+      "font_class": "none",
+      "unicode": "e660",
+      "unicode_decimal": 58976
+    },
+    {
+      "icon_id": "13244070",
+      "name": "round-selected-fill",
+      "font_class": "round-selected-fill",
+      "unicode": "e661",
+      "unicode_decimal": 58977
+    },
+    {
+      "icon_id": "13244071",
+      "name": "round-add",
+      "font_class": "round-add",
+      "unicode": "e662",
+      "unicode_decimal": 58978
+    },
+    {
+      "icon_id": "13244072",
+      "name": "round-lessen-fill",
+      "font_class": "round-lessen-fill",
+      "unicode": "e663",
+      "unicode_decimal": 58979
+    },
+    {
+      "icon_id": "13244073",
+      "name": "round-lessen",
+      "font_class": "round-lessen",
+      "unicode": "e664",
+      "unicode_decimal": 58980
+    },
+    {
+      "icon_id": "13244074",
+      "name": "round-close-fill",
+      "font_class": "round-close-fill",
+      "unicode": "e665",
+      "unicode_decimal": 58981
+    },
+    {
+      "icon_id": "13244075",
+      "name": "search",
+      "font_class": "search",
+      "unicode": "e666",
+      "unicode_decimal": 58982
+    },
+    {
+      "icon_id": "13244076",
+      "name": "round-selected",
+      "font_class": "round-selected",
+      "unicode": "e667",
+      "unicode_decimal": 58983
+    },
+    {
+      "icon_id": "13244077",
+      "name": "shipping-address",
+      "font_class": "shipping-address",
+      "unicode": "e668",
+      "unicode_decimal": 58984
+    },
+    {
+      "icon_id": "13244078",
+      "name": "round",
+      "font_class": "round",
+      "unicode": "e669",
+      "unicode_decimal": 58985
+    },
+    {
+      "icon_id": "13244079",
+      "name": "share",
+      "font_class": "share",
+      "unicode": "e66a",
+      "unicode_decimal": 58986
+    },
+    {
+      "icon_id": "13244080",
+      "name": "servise",
+      "font_class": "servise",
+      "unicode": "e66b",
+      "unicode_decimal": 58987
+    },
+    {
+      "icon_id": "13244081",
+      "name": "siet-fill",
+      "font_class": "siet-fill",
+      "unicode": "e66c",
+      "unicode_decimal": 58988
+    },
+    {
+      "icon_id": "13244082",
+      "name": "square-selected",
+      "font_class": "square-selected",
+      "unicode": "e66d",
+      "unicode_decimal": 58989
+    },
+    {
+      "icon_id": "13244083",
+      "name": "sort-fill",
+      "font_class": "sort-fill",
+      "unicode": "e66e",
+      "unicode_decimal": 58990
+    },
+    {
+      "icon_id": "13244084",
+      "name": "sort",
+      "font_class": "sort",
+      "unicode": "e66f",
+      "unicode_decimal": 58991
+    },
+    {
+      "icon_id": "13244085",
+      "name": "square",
+      "font_class": "square",
+      "unicode": "e670",
+      "unicode_decimal": 58992
+    },
+    {
+      "icon_id": "13244086",
+      "name": "star-fill",
+      "font_class": "star-fill",
+      "unicode": "e671",
+      "unicode_decimal": 58993
+    },
+    {
+      "icon_id": "13244087",
+      "name": "square-selected-fill",
+      "font_class": "square-selected-fill",
+      "unicode": "e672",
+      "unicode_decimal": 58994
+    },
+    {
+      "icon_id": "13244088",
+      "name": "stop-v-fill2",
+      "font_class": "stop-v-fill",
+      "unicode": "e673",
+      "unicode_decimal": 58995
+    },
+    {
+      "icon_id": "13244089",
+      "name": "star-half",
+      "font_class": "star-half",
+      "unicode": "e674",
+      "unicode_decimal": 58996
+    },
+    {
+      "icon_id": "13244090",
+      "name": "star",
+      "font_class": "star",
+      "unicode": "e675",
+      "unicode_decimal": 58997
+    },
+    {
+      "icon_id": "13244091",
+      "name": "stop-fill",
+      "font_class": "stop-fill",
+      "unicode": "e676",
+      "unicode_decimal": 58998
+    },
+    {
+      "icon_id": "13244092",
+      "name": "tick",
+      "font_class": "tick",
+      "unicode": "e677",
+      "unicode_decimal": 58999
+    },
+    {
+      "icon_id": "13244093",
+      "name": "stop-v",
+      "font_class": "stop-v",
+      "unicode": "e678",
+      "unicode_decimal": 59000
+    },
+    {
+      "icon_id": "13244094",
+      "name": "stop",
+      "font_class": "stop",
+      "unicode": "e679",
+      "unicode_decimal": 59001
+    },
+    {
+      "icon_id": "13244095",
+      "name": "twitter",
+      "font_class": "twitter",
+      "unicode": "e67a",
+      "unicode_decimal": 59002
+    },
+    {
+      "icon_id": "13244096",
+      "name": "upload",
+      "font_class": "upload",
+      "unicode": "e67b",
+      "unicode_decimal": 59003
+    },
+    {
+      "icon_id": "13244097",
+      "name": "visible",
+      "font_class": "visible",
+      "unicode": "e67c",
+      "unicode_decimal": 59004
+    },
+    {
+      "icon_id": "13244098",
+      "name": "wechat",
+      "font_class": "wechat",
+      "unicode": "e67d",
+      "unicode_decimal": 59005
+    },
+    {
+      "icon_id": "13244099",
+      "name": "unvisible",
+      "font_class": "unvisible",
+      "unicode": "e67e",
+      "unicode_decimal": 59006
+    },
+    {
+      "icon_id": "13244100",
+      "name": "clock-fill",
+      "font_class": "clock-fill",
+      "unicode": "e67f",
+      "unicode_decimal": 59007
+    },
+    {
+      "icon_id": "13244101",
+      "name": "siet",
+      "font_class": "siet",
+      "unicode": "e680",
+      "unicode_decimal": 59008
+    }
+  ]
+}

src/assets/font/iconfont.svg

+<?xml version="1.0" standalone="no"?>
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
+<!--
+2013-9-30: Created.
+-->
+<svg>
+<metadata>
+Created by iconfont
+</metadata>
+<defs>
+
+<font id="dk-iconfont" horiz-adv-x="1024" >
+  <font-face
+    font-family="dk-iconfont"
+    font-weight="500"
+    font-stretch="normal"
+    units-per-em="1024"
+    ascent="896"
+    descent="-128"
+  />
+    <missing-glyph />
+    
+    <glyph glyph-name="arrow-double-down" unicode="&#58917;" d="M512 0.512L62.6176 449.8944A35.84 35.84 0 0 1 11.9296 399.36l474.7264-474.7264a35.84 35.84 0 0 1 50.688 0L1012.0704 399.36a35.84 35.84 0 0 1-50.688 50.688zM512 394.24L62.6176 843.52a35.84 35.84 0 0 1-50.688-50.688l474.7264-474.7264a35.84 35.84 0 0 1 50.688 0l474.7264 474.7264a35.84 35.84 0 0 1-50.688 50.688z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="add" unicode="&#58918;" d="M988.16 419.84h-440.32V860.16a35.84 35.84 0 0 1-35.84 35.84 35.84 35.84 0 0 1-35.84-35.84v-440.32H35.84a35.84 35.84 0 0 1-35.84-35.84 35.84 35.84 0 0 1 35.84-35.84h440.32v-440.32a35.84 35.84 0 0 1 35.84-35.84 35.84 35.84 0 0 1 35.84 35.84v440.32h440.32a35.84 35.84 0 0 1 35.84 35.84 35.84 35.84 0 0 1-35.84 35.84z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="about" unicode="&#58919;" d="M512-128a512 512 0 1 0 512 512 512.5632 512.5632 0 0 0-512-512z m0 950.528A438.528 438.528 0 1 1 950.528 384 438.9888 438.9888 0 0 1 512 822.528z m-55.0912-199.68A55.0912 55.0912 0 1 1 512 677.888a55.1424 55.1424 0 0 1-55.0912-55.0912zM512 90.112a36.7104 36.7104 0 0 0-36.7104 36.7616V457.472a36.7104 36.7104 0 0 0 73.4208 0v-330.5984a36.7104 36.7104 0 0 0-36.7104-36.7616z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="all-fill" unicode="&#58920;" d="M479.948827 352.000027v-383.999981A95.948795 95.948795 0 0 0 384.000032-127.999949H96.000046A95.948795 95.948795 0 0 0 0.000051-31.948754V256.000032a95.948795 95.948795 0 0 0 95.999995 95.999995z m447.999978 0A95.999995 95.999995 0 0 0 1024 256.000032v-287.948786A95.999995 95.999995 0 0 0 927.948805-127.999949H640.000019a95.999995 95.999995 0 0 0-95.999995 95.999995v383.999981zM384.000032 896a95.948795 95.948795 0 0 0 95.948795-96.051195v-383.999981h-383.999981A95.948795 95.948795 0 0 0 0.000051 512.000019V799.948805A95.948795 95.948795 0 0 0 96.000046 896z m399.97438 0a239.974388 239.974388 0 1 0 0-479.948776 239.974388 239.974388 0 0 0 0 479.948776z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="arrow-double-right" unicode="&#58921;" d="M895.488 384l-449.3824-449.3824a35.84 35.84 0 0 1 50.688-50.688L971.52 358.4a35.84 35.84 0 0 1 0 50.688L496.64 884.0704a35.84 35.84 0 0 1-50.688-50.688zM501.76 384l-449.28-449.3824a35.84 35.84 0 0 1 50.688-50.688L577.8944 358.4a35.84 35.84 0 0 1 0 50.688L103.168 884.0704a35.84 35.84 0 0 1-50.688-50.688z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="arrow-v-down" unicode="&#58922;" d="M1024 384A512 512 0 1 0 512 896a512.5632 512.5632 0 0 0 512-512z m-950.8352 0A438.8352 438.8352 0 1 1 512 822.8352 439.3472 439.3472 0 0 1 73.1648 384z m452.9664-123.8528h0.4096a36.352 36.352 0 0 1 11.4688 7.5776l182.1184 181.6064A36.5568 36.5568 0 0 1 668.7232 501.76l-156.2112-155.9552-155.3408 157.0304a36.5568 36.5568 0 1 1-51.968-51.2L486.4 268.2368a36.4544 36.4544 0 0 1 39.7312-8.0896z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="arrow-left" unicode="&#58923;" d="M749.3632-126.5664a35.84 35.84 0 0 0-25.6 10.496L249.2928 358.4a35.84 35.84 0 0 0 0 50.688l474.7264 474.9824a35.84 35.84 0 1 0 50.688-50.688L325.3248 384l449.3824-449.3824a35.84 35.84 0 0 0-25.344-61.184z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="alipay" unicode="&#58924;" d="M279.668158 345.382977c-22.626867-2.252448-65.269808-12.183698-88.459787-32.6605-69.672321-60.560144-28.002027-171.339645 113.083142-171.339645 81.90721 0 163.81442 52.215846 228.316348 135.914777-91.480115 44.485854-169.240773 76.378474-252.939703 68.085368zM805.666023 268.850928c114.414134-38.189237 176.765998-49.093134 190.485456-51.192007a511.920064 511.920064 0 1 1-57.488623-116.564198c-86.616875 34.042684-244.083486 97.264812-327.628841 137.245769-79.808338-97.930308-182.909039-157.466612-289.797948-157.466612-181.117319 0-242.291766 157.466612-156.801115 261.642345 18.685082 22.575675 50.577702 44.178701 99.77322 56.311207 77.095162 18.787466 199.904785-11.825353 314.933223-49.605054a620.549501 620.549501 0 0 1 51.192007 124.396575H275.777565v35.834405h182.653079V573.750518H237.076409V609.27777h221.354235V701.065037A15.357602 15.357602 0 0 0 473.071558 716.780983h90.507467v-107.503213h218.948212v-35.834404h-218.89702v-63.887624H742.495088a732.045691 732.045691 0 0 0-75.76417-190.536648c54.058759-19.504154 102.742357-38.035661 138.935105-50.168166z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="arrow-double-up" unicode="&#58925;" d="M512 767.488l449.3824-449.3824a35.84 35.84 0 1 1 50.688 50.688L537.6 843.52a35.84 35.84 0 0 1-50.688 0L11.9296 368.64a35.84 35.84 0 0 1 50.688-50.688zM512 373.76l449.3824-449.3824a35.84 35.84 0 1 1 50.688 50.688L537.6 449.8944a35.84 35.84 0 0 1-50.688 0L11.9296-24.832a35.84 35.84 0 1 1 50.688-50.688z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="arrow-down" unicode="&#58926;" d="M1022.5664 621.3632a35.84 35.84 0 0 0-10.496-25.6L537.6 121.2928a35.84 35.84 0 0 0-50.688 0L11.9296 596.0192a35.84 35.84 0 0 0 50.688 50.688L512 197.3248l449.3824 449.3824a35.84 35.84 0 0 0 61.184-25.6z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="arrow-up" unicode="&#58927;" d="M1.4336 146.6368a35.84 35.84 0 0 0 10.496 25.6l474.7264 474.4704a35.84 35.84 0 0 0 50.688 0l474.7264-474.7264a35.84 35.84 0 1 0-50.688-50.688L512 570.6752l-449.3824-449.3824a35.84 35.84 0 0 0-61.44 25.344z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="arrow-v-left" unicode="&#58928;" d="M512-128a512 512 0 1 0 512 512 512.5632 512.5632 0 0 0-512-512z m0 950.8352A438.8352 438.8352 0 1 1 950.8352 384 439.3472 439.3472 0 0 1 512 822.8352z m-123.8528-452.9664v-0.4096a36.352 36.352 0 0 1 7.5776-11.4688l181.6064-182.1184A36.5568 36.5568 0 0 1 629.76 227.2768L473.8048 383.488l157.0304 155.3408a36.5568 36.5568 0 1 1-51.2 51.968L396.2368 409.6a36.4544 36.4544 0 0 1-8.0896-39.7312z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="about-fill" unicode="&#58929;" d="M512 896a512 512 0 1 1 512-512A512.5632 512.5632 0 0 1 512 896z m36.7104-769.1264a36.7104 36.7104 0 1 0-73.4208 0V457.472a36.7104 36.7104 0 0 0 73.4208 0zM512 567.6544a55.1424 55.1424 0 1 0 55.0912 55.1424A55.1424 55.1424 0 0 0 512 567.6544z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="all" unicode="&#58930;" d="M784.025612 824.320004a168.294392 168.294392 0 1 0-168.396792-168.294392A168.499192 168.499192 0 0 0 784.025612 824.320004M384.000032 824.320004a24.319999 24.319999 0 0 0 24.319999-24.319999v-312.319985h-312.319985A24.319999 24.319999 0 0 0 71.680048 512.000019V799.948805A24.319999 24.319999 0 0 0 96.000046 824.320004H384.000032m543.948773-543.999973A24.319999 24.319999 0 0 0 952.320004 256.000032v-287.948786a24.319999 24.319999 0 0 0-24.319999-24.319998H640.000019a24.319999 24.319999 0 0 0-24.319999 24.319998v312.319985h312.319985m-519.679974 0v-312.319985A24.319999 24.319999 0 0 0 384.000032-56.319952H96.000046a24.319999 24.319999 0 0 0-24.319998 24.371198V256.000032a24.319999 24.319999 0 0 0 24.319998 24.319999h312.319985M784.025612 896a239.974388 239.974388 0 0 1 0-479.948776 239.974388 239.974388 0 0 1 0 479.948776zM384.000032 896H96.000046A95.948795 95.948795 0 0 1 0.000051 799.948805V512.000019a95.948795 95.948795 0 0 1 95.999995-95.999995h383.999981v383.999981A95.948795 95.948795 0 0 1 384.000032 896z m543.948773-543.999973h-383.999981v-383.999981A95.999995 95.999995 0 0 1 640.000019-127.999949h287.999986A95.999995 95.999995 0 0 1 1024-31.948754V256.000032a95.999995 95.999995 0 0 1-95.999995 95.999995z m-447.999978 0h-383.999981A95.948795 95.948795 0 0 1 0.000051 256.000032v-287.948786A95.948795 95.948795 0 0 1 96.000046-127.999949H384.000032a95.948795 95.948795 0 0 1 95.999995 95.999995v383.999981z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="arrow-vv-down" unicode="&#58931;" d="M63.2832 673.2288c-52.224 0-85.6064-69.7344-45.6192-109.7216l449.3824-449.3824a61.9008 61.9008 0 0 1 89.9072 0l449.4336 449.3824c38.9632 39.0144 8.5504 109.7216-44.9536 109.7216z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="arrow-double-left" unicode="&#58932;" d="M128.512 384l449.3824 449.3824a35.84 35.84 0 0 1-50.688 50.688L52.48 409.344a35.84 35.84 0 0 1 0-50.688L527.36-116.0704a35.84 35.84 0 1 1 50.688 50.688zM522.24 384l449.3824 449.3824a35.84 35.84 0 1 1-50.688 50.688L446.1056 409.344a35.84 35.84 0 0 1 0-50.688l474.7264-474.7264a35.84 35.84 0 1 1 50.688 50.688z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="arrow-vv-left" unicode="&#58933;" d="M800.794785 831.278067c0 52.145633-69.629757 85.477939-109.556953 45.550744L242.529773 428.069629a61.756789 61.756789 0 0 1 0-89.721162l448.708059-448.759183c38.955855-38.904732 109.556952-8.537569 109.556953 44.886143V831.278067z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="arrow-vv-right" unicode="&#58934;" d="M222.772024-64.71698c0-52.223851 69.734201-85.606156 109.721288-45.61907l449.381119 449.381119a61.900624 61.900624 0 0 1 0 89.906944L332.493312 878.384332c-39.014289 38.963089-109.721287 8.550376-109.721288-44.953472v-898.14784z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="arrow-vvv-left" unicode="&#58935;" d="M1024.939571 380.416a34.816 34.816 0 0 1-34.816 34.8672H108.049971l410.5728 410.5216a33.4336 33.4336 0 0 1-47.2576 47.2576L8.670771 410.5728a33.4336 33.4336 0 0 1 0-47.2064l435.2-435.2a33.3824 33.3824 0 0 1 47.2576 47.2064l-370.176 370.2272h869.1712a34.7648 34.7648 0 0 1 34.816 34.816z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="arrow-v-up" unicode="&#58936;" d="M0 384a512 512 0 1 0 512-512A512.5632 512.5632 0 0 0 0 384z m950.8352 0A438.8352 438.8352 0 1 1 512-54.8352 439.3472 439.3472 0 0 1 950.8352 384zM497.8688 507.8528h-0.4096a36.352 36.352 0 0 1-11.4688-7.5776l-182.3232-182.016A36.5568 36.5568 0 1 1 355.2768 266.24L511.488 422.1952l155.3408-157.0304a36.5568 36.5568 0 1 1 51.968 51.2L537.6 499.7632a36.4544 36.4544 0 0 1-39.7312 8.0896z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="arrow-vvv-right" unicode="&#58937;" d="M0.000358 386.9696a34.8672 34.8672 0 0 1 34.8672-34.8672h882.2272l-410.5216-410.5216a33.3824 33.3824 0 0 1 47.2064-47.2576l462.336 462.4896a33.3824 33.3824 0 0 1 0 47.2576l-435.2 435.2a33.4336 33.4336 0 1 1-47.2576-47.2576l370.0736-370.0224H34.867558a34.8672 34.8672 0 0 1-34.8672-35.0208z"  horiz-adv-x="1041" />
+
+    
+    <glyph glyph-name="arrow-vvv-down" unicode="&#58938;" d="M500.702822 895.999387a34.747169 34.747169 0 0 1-34.798268-34.74717V-19.077537L56.194549 390.479172a33.367502 33.367502 0 0 1-47.164173-47.164173l461.575266-461.575265a33.418601 33.418601 0 0 1 47.164172 0l434.339617 434.339616a33.367502 33.367502 0 0 1-47.164173 47.164173l-369.290871-369.290872V861.252217a34.747169 34.747169 0 0 1-34.951565 34.74717z"  horiz-adv-x="1025" />
+
+    
+    <glyph glyph-name="arrow-right" unicode="&#58939;" d="M274.6368 894.5664a35.84 35.84 0 0 0 25.6-10.496l474.7264-474.7264a35.84 35.84 0 0 0 0-50.688l-474.9824-474.7264a35.84 35.84 0 0 0-50.688 50.688L698.6752 384 249.2928 833.3824a35.84 35.84 0 0 0 25.6 61.44z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="arrow-v-right" unicode="&#58940;" d="M512 896A512 512 0 1 0 0 384 512.5632 512.5632 0 0 0 512 896z m0-950.8352A438.8352 438.8352 0 1 1 73.1648 384 439.3472 439.3472 0 0 1 512-54.8352z m123.8528 452.9664v0.4096a36.352 36.352 0 0 1-7.5776 11.4688L446.2592 592.3328A36.5568 36.5568 0 0 1 394.24 540.7232l155.9552-156.2112-157.0304-155.3408a36.5568 36.5568 0 1 1 51.2-51.968L627.7632 358.4a36.4544 36.4544 0 0 1 8.0896 39.7312z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="cart-add-fill" unicode="&#58941;" d="M222.924655-54.835248a73.164752 73.062353 90 1 1 146.124705 0 73.164752 73.062353 90 1 1-146.124705 0ZM803.890677-54.835248a73.164752 73.062353 90 1 1 146.124705 0 73.164752 73.062353 90 1 1-146.124705 0ZM1001.164149 643.634698a91.85274 91.85274 0 0 1-73.062352 32.921579H210.380663l-24.012784 127.999917A106.700731 106.700731 0 0 1 80.383948 895.999334H36.556776a36.607976 36.607976 0 0 1 0-73.164752h43.827172A34.611178 34.611178 0 0 0 113.254326 793.599401l32.921579-179.199884L204.799867 190.156593c7.321595-54.835164 51.199967-98.713536 102.399933-98.713536h555.110039c51.199967 0 95.027138 36.556776 102.399934 84.121546L1023.077735 563.199551a104.550332 104.550332 0 0 1-21.913586 80.435147z m-290.150211-286.719813h-82.739146v-82.739146a26.879983 26.879983 0 0 0-53.759965 0v82.943946H491.519681a26.879983 26.879983 0 0 0 0 53.759965h82.790346V493.618796a26.879983 26.879983 0 0 0 53.759965 0v-82.739146h82.739146a26.879983 26.879983 0 0 0 0-53.759965z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="close" unicode="&#58942;" d="M558.08 388.864l432.0256 432.0256a35.84 35.84 0 0 1-50.688 50.688L507.136 439.552 75.1104 871.5776a35.84 35.84 0 0 1-50.688-50.688l432.0256-432.0256-432.0256-432.0256a35.84 35.84 0 0 1 50.688-50.688L507.136 337.92l432.0256-432.0256a35.84 35.84 0 0 1 50.688 50.688z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="cart" unicode="&#58943;" d="M1001.163949 643.634544a91.852722 91.852722 0 0 1-73.062338 32.921572h-599.039491A34.508771 34.508771 0 0 1 292.300552 639.999347a34.508771 34.508771 0 0 1 36.556768-36.556769h599.039491a27.955176 27.955176 0 0 0 18.227185-7.321594 20.479983 20.479983 0 0 0 3.686397-21.964781l-54.835154-383.999673c0-10.956791-14.591988-21.913581-29.235175-21.913582H310.578936c-14.591988 0-29.235175 18.278384-29.235175 32.921572L219.238214 625.35616l-32.870372 179.199847A106.649509 106.649509 0 0 1 80.383932 895.99913H36.556769a36.607969 36.607969 0 0 1 0-73.164738h43.827163A34.611171 34.611171 0 0 0 113.254304 793.599217l32.921572-179.199848L204.799826 190.15653c7.321594-54.835153 51.199956-98.713516 102.399913-98.713517h555.109928c51.199956 0 95.027119 36.556769 102.399913 84.121529L1023.07753 563.199412a104.550311 104.550311 0 0 1-21.913581 80.435132zM222.924611-54.835262a73.164738 73.062338 90 1 1 146.124675 0 73.164738 73.062338 90 1 1-146.124675 0ZM803.890517-54.835262a73.164738 73.062338 90 1 1 146.124675 0 73.164738 73.062338 90 1 1-146.124675 0ZM781.823335 348.876395a35.12317 35.12317 0 0 1 0 70.24634H372.582083a35.12317 35.12317 0 0 1 0-70.24634z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="cart-add" unicode="&#58944;" d="M1001.164149 643.634698a91.85274 91.85274 0 0 1-73.062352 32.921579h-599.039611A34.508778 34.508778 0 0 1 292.30061 639.999501a34.508778 34.508778 0 0 1 36.556776-36.556776h599.039611a27.955182 27.955182 0 0 0 18.227188-7.321596 20.479987 20.479987 0 0 0 3.686398-21.964785l-54.835165-383.999751c0-10.956793-14.591991-21.913586-29.235181-21.913586H310.578998c-14.591991 0-29.235181 18.278388-29.235181 32.921579L219.238257 625.35631l-32.870378 179.199884A106.700731 106.700731 0 0 1 80.383948 895.999334H36.556776a36.607976 36.607976 0 0 1 0-73.164752h43.827172A34.611178 34.611178 0 0 0 113.254326 793.599401l32.921579-179.199884L204.799867 190.156593c7.321595-54.835164 51.199967-98.713536 102.399933-98.713536h555.110039c51.199967 0 95.027138 36.556776 102.399934 84.121546L1023.077735 563.199551a104.550332 104.550332 0 0 1-21.913586 80.435147zM222.924655-54.835248a73.164752 73.062353 90 1 1 146.124705 0 73.164752 73.062353 90 1 1-146.124705 0ZM803.890677-54.835248a73.164752 73.062353 90 1 1 146.124705 0 73.164752 73.062353 90 1 1-146.124705 0ZM708.45394 410.87965h-82.739147V493.618796a26.931182 26.931182 0 0 1-53.811165 0v-82.739146H489.164482a26.879983 26.879983 0 0 1 0-53.759965h82.739146v-82.739147a26.931182 26.931182 0 0 1 53.811165 0v82.739147h82.739147a26.879983 26.879983 0 0 1 0 53.759965z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="cart-fill" unicode="&#58945;" d="M222.924454-54.835313a73.164687 73.062287 90 1 1 146.124574 0 73.164687 73.062287 90 1 1-146.124574 0ZM803.889954-54.835313a73.164687 73.062287 90 1 1 146.124573 0 73.164687 73.062287 90 1 1-146.124573 0ZM1001.163248 643.634004a91.852658 91.852658 0 0 1-73.062287 32.921549H209.919675l-23.398364 127.999802A106.649435 106.649435 0 0 1 80.383875 895.998413H36.556743a36.607943 36.607943 0 0 1 0-73.164687h43.827132A34.611146 34.611146 0 0 0 113.254224 793.598572l32.921549-179.199723L204.799683 190.156307c7.321589-54.835115 51.199921-98.713447 102.399841-98.713447h555.109539c51.199921 0 95.027053 36.556743 102.399842 84.121469L1023.076814 563.198929a104.550238 104.550238 0 0 1-21.913566 80.435075z m-219.34046-294.757943H372.581822a35.123146 35.123146 0 0 0 0 70.246291h409.240966a35.123146 35.123146 0 0 0 0-70.246291z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="arrow-vvv-up" unicode="&#58946;" d="M491.561233-128a34.797001 34.797001 0 0 1 34.797001 34.797001V787.247979L936.104412 377.552898a33.31519 33.31519 0 0 1 47.315745 47.315745L521.861705 886.222707a33.264093 33.264093 0 0 1-47.111358 0l-434.323795-434.323795a33.366287 33.366287 0 0 1 47.469036-47.009164l369.124129 369.27742v-867.370167A34.745904 34.745904 0 0 1 491.561233-128z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="arrow-vv-up" unicode="&#58947;" d="M960.719718 94.7712c52.224 0 85.6064 69.7344 45.6192 109.7216l-449.3824 449.3824a61.9008 61.9008 0 0 1-89.9072 0L17.615718 204.4928c-38.9632-39.0144-8.5504-109.7216 44.9536-109.7216z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="clock" unicode="&#58948;" d="M512 896a512 512 0 1 1 512-512A512.5632 512.5632 0 0 1 512 896z m0-950.528A438.528 438.528 0 1 0 950.528 384 439.04 439.04 0 0 0 512-54.528zM694.8352 384H512V640a36.608 36.608 0 1 1-73.1648 0v-292.5056a36.5056 36.5056 0 0 1 36.608-36.608h219.392a36.608 36.608 0 1 1 0 73.1648z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="facebook" unicode="&#58949;" d="M512 896a512 512 0 1 1 512-512A512 512 0 0 1 512 896z m141.0048-313.1904H578.56c-12.1856 0-29.3376-6.144-29.3376-32.0512V481.28h103.7312l-12.288-117.76h-91.3408v-334.6944h-138.24V364.032H345.088v117.76h65.8432V557.7216c0 54.4256 25.6 139.7248 139.6736 139.7248l102.4-0.4608z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="delete-fill" unicode="&#58950;" d="M987.4432 713.1648h-182.8864V786.2784A109.3632 109.3632 0 0 1 695.7056 896H329.1648a109.824 109.824 0 0 1-109.7216-109.7216v-73.1136H36.5568a36.608 36.608 0 0 1 0-73.1648h950.8864a36.608 36.608 0 0 1 0 73.1648zM841.1648 566.8352H182.9376a36.8128 36.8128 0 0 1-25.9072-10.24 36.1472 36.1472 0 0 1-10.752-25.6v-549.2736A109.8752 109.8752 0 0 1 256-128h512a109.7216 109.7216 0 0 1 109.568 109.7216V530.2784a36.608 36.608 0 0 1-36.4032 36.5568z m-402.3296-512a36.5568 36.5568 0 0 0-73.1136 0V457.1648a36.5568 36.5568 0 0 0 73.1136 0z m219.4432 0a36.5568 36.5568 0 0 0-73.1136 0V457.1648a36.5568 36.5568 0 1 0 73.1136 0z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="editor" unicode="&#58951;" d="M838.656 18.432a10.24 10.24 0 0 0-10.24-10.24H81.92a10.24 10.24 0 0 0-10.24 10.24V721.92a10.24 10.24 0 0 0 10.24 10.24h629.248V803.84H81.92A81.92 81.92 0 0 1 0 721.92v-703.488a81.92 81.92 0 0 1 81.92-81.92h746.496a81.92 81.92 0 0 1 81.92 81.92V384h-71.68zM508.16 261.0688l50.9952 0.3072L1024 726.2208l-50.688 50.688-464.8448-464.8448-0.3072-50.9952z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="date-fill" unicode="&#58952;" d="M1022.742199 476.434061l-3.617826-509.553a95.541187 95.541187 0 0 0-96.203607-94.878768L94.999053-122.035937A95.490232 95.490232 0 0 0 0.018374-25.832331l3.668782 509.552999zM351.966631 194.600297L192.731319 195.466537 191.814123 100.180126l159.235312-1.121017z m238.827491-1.73248l-159.235313 1.171971-0.662419-95.388321 159.235313-1.171972z m238.82749-1.681525l-159.235312 1.121016-0.662419-95.541187 159.235312-1.121017zM353.291469 385.682671l-159.235313 1.121017-0.662418-95.541187 159.235312-1.121017z m238.878446-1.73248l-159.235313 1.121017-0.713374-95.541188 159.235312-1.121016z m238.82749-1.681525l-159.235312 1.121017-0.662419-95.541187 159.235312-1.121017zM101.725153 833.324981l95.541187-0.917195-1.121016-158.980536 206.980428-1.477704 1.121017 159.235313 238.878446-1.732481-1.171972-159.235312 207.031383-1.477704 1.121017 159.235313 79.643134-0.560509a95.490232 95.490232 0 0 0 94.827813-96.203606l-1.121017-159.235312-1019.105998 7.286608 1.171972 159.235312a95.490232 95.490232 0 0 0 96.203606 94.827813zM793.443349 892.076442l-1.121016-159.235312-95.541188 0.713374 1.121017 159.235312zM343.813783 895.286626l-1.121017-159.235312-95.541187 0.713374 1.121017 159.235312z"  horiz-adv-x="1029" />
+
+    
+    <glyph glyph-name="delete" unicode="&#58953;" d="M621.7216 91.4432a36.5056 36.5056 0 0 0-36.5568 36.5568V530.2784a36.5568 36.5568 0 1 0 73.1136 0V128a36.5056 36.5056 0 0 0-36.5568-36.5568zM402.2784 91.4432a36.5056 36.5056 0 0 0-36.5568 36.5568V530.2784a36.5568 36.5568 0 0 0 73.1136 0V128a36.5056 36.5056 0 0 0-36.5568-36.5568zM987.4432 713.1648h-182.8864V786.2784A109.3632 109.3632 0 0 1 695.7056 896H329.1648a109.824 109.824 0 0 1-109.7216-109.7216v-73.1136H36.5568a36.608 36.608 0 0 1 0-73.1648h950.8864a36.608 36.608 0 0 1 0 73.1648zM292.5568 786.2784a36.608 36.608 0 0 0 36.608 36.5568h366.5408a35.84 35.84 0 0 0 35.84-36.5568v-73.1136H292.5568zM768-128H256a109.824 109.824 0 0 0-109.6704 109.7216V530.8416a36.5568 36.5568 0 0 0 73.1136 0v-549.12a36.608 36.608 0 0 1 36.5568-36.5568h512a36.5568 36.5568 0 0 1 36.5568 36.5568v547.84a36.608 36.608 0 0 0 73.1648 0v-547.84A109.8752 109.8752 0 0 0 768-128z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="download" unicode="&#58954;" d="M917.1968 636.4672h-111.872v-65.6896h111.872a21.9136 21.9136 0 0 0 21.9136-21.9136v-589.2608a21.9136 21.9136 0 0 0-21.9136-21.9136H106.8032a21.9136 21.9136 0 0 0-21.9136 21.9136V548.864a21.9136 21.9136 0 0 0 21.9136 21.9136h111.872V636.4672H106.8032A87.6032 87.6032 0 0 1 19.1488 548.864v-589.2608A87.6032 87.6032 0 0 1 106.8032-128h810.3936a87.6032 87.6032 0 0 1 87.6544 87.6032V548.864a87.6032 87.6032 0 0 1-87.6544 87.6032zM730.2656 448.256a32.768 32.768 0 0 1-46.4384 0l-137.6256-137.5744V896H477.7984v-594.432L331.0592 448.256a32.8192 32.8192 0 0 1-46.4384-46.4384l199.68-199.68a32.8704 32.8704 0 0 1 46.4896 0l199.68 199.68a32.768 32.768 0 0 1-0.2048 46.4384z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="favorite" unicode="&#58955;" d="M747.0592 764.1088a200.0896 200.0896 0 0 0 140.032-56.7808c1.4848-1.4336 2.9184-2.8672 4.3008-4.352a216.1152 216.1152 0 0 0 3.1232-296.5504l-382.7712-373.76-382.7712 373.76a216.2176 216.2176 0 0 0 3.1232 296.6016 201.1648 201.1648 0 0 0 284.5184 4.352l4.3008-4.352L442.5216 680.96h0.6144l19.1488-18.5344L512 614.4l49.7664 48.2304 13.0048 12.5952c10.6496 10.24 19.9168 19.6096 27.6992 27.5456a199.68 199.68 0 0 0 144.4352 61.1328m0 71.68A272.1792 272.1792 0 0 1 551.168 752.64c-7.2192-7.3728-15.9744-16.0768-26.2144-26.0096L512 714.2912c-11.4176 11.008-21.3504 20.48-29.7984 29.1328L472.832 752.64q-2.9184 3.0208-5.8368 5.8368A272.8448 272.8448 0 0 1 81.1008 752.64a287.3344 287.3344 0 0 1-2.9696-397.0048l433.8688-423.424 433.8688 423.7312a287.1808 287.1808 0 0 1-3.0208 396.6976q-2.8672 3.0208-5.8368 5.8368a271.7696 271.7696 0 0 1-189.952 76.8z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="help" unicode="&#58956;" d="M457.1648 72.7552A54.8352 54.8352 0 1 1 512 127.5904a54.8352 54.8352 0 0 1-54.8352-54.8352zM512-128a512 512 0 1 0 512 512 512.5632 512.5632 0 0 0-512-512z m0 950.528A438.528 438.528 0 1 1 950.528 384 438.9888 438.9888 0 0 1 512 822.528z m0-623.3088a36.5568 36.5568 0 0 0-36.5568 36.3008v62.1056c0 59.8016 45.7216 105.5232 86.0672 145.8688 29.5936 29.6448 60.2112 60.2112 60.2112 84.5824A110.2848 110.2848 0 0 1 512 638.6688a107.776 107.776 0 0 1-109.7216-108.0832 36.5568 36.5568 0 1 0-73.1136 0 182.8352 182.8352 0 0 0 365.6704-2.5088c0-54.7328-41.472-96.2048-81.6128-136.3456-31.7952-31.744-64.6656-64.5632-64.6656-94.0544v-61.8496a36.608 36.608 0 0 0-36.5568-36.608z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="favorite-fill" unicode="&#58957;" d="M472.832 752.64l9.3696-9.472c8.448-8.448 18.3808-18.1248 29.7984-29.1328l12.9536 13.0048c10.24 9.9328 18.9952 18.6368 26.2144 26.0096A272.7936 272.7936 0 0 0 936.96 758.7328q3.0208-2.8672 5.8368-5.8368a287.1808 287.1808 0 0 0 3.0208-396.9536L512-67.7888l-433.8688 423.68A287.3344 287.3344 0 0 0 81.1008 752.64a272.896 272.896 0 0 0 385.8944 5.8368q2.9184-2.8672 5.8368-5.8368z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="date" unicode="&#58958;" d="M434.3296 386.816m50.2784 0l59.4432 0q50.2784 0 50.2784-50.2784l0 0q0-50.2784-50.2784-50.2784l-59.4432 0q-50.2784 0-50.2784 50.2784l0 0q0 50.2784 50.2784 50.2784ZM672 196.5568m50.2784 0l59.4432 0q50.2784 0 50.2784-50.2784l0 0q0-50.2784-50.2784-50.2784l-59.4432 0q-50.2784 0-50.2784 50.2784l0 0q0 50.2784 50.2784 50.2784ZM672 386.816m50.2784 0l59.4432 0q50.2784 0 50.2784-50.2784l0 0q0-50.2784-50.2784-50.2784l-59.4432 0q-50.2784 0-50.2784 50.2784l0 0q0 50.2784 50.2784 50.2784ZM393.4208 835.4816h244.1216v-97.7408H393.4208zM692.1216 895.8976h98.4576v-158.1568h-98.4576zM240.2304 895.8976h98.56v-158.1568H240.2304zM917.9648 835.4816h-72.8064v-97.7408h108.4416v-174.08H75.0592v174.08h110.592V835.4816H106.0352A106.0352 106.0352 0 0 1 0 729.4976v-751.4624A106.0352 106.0352 0 0 1 106.0352-128h811.9296A106.0352 106.0352 0 0 1 1024-21.9648V729.4976a106.0352 106.0352 0 0 1-106.0352 105.984z m35.84-893.0816H75.0592v547.84h878.5408zM192 196.5568m50.2784 0l59.4432 0q50.2784 0 50.2784-50.2784l0 0q0-50.2784-50.2784-50.2784l-59.4432 0q-50.2784 0-50.2784 50.2784l0 0q0 50.2784 50.2784 50.2784ZM434.3296 196.5568m50.2784 0l59.4432 0q50.2784 0 50.2784-50.2784l0 0q0-50.2784-50.2784-50.2784l-59.4432 0q-50.2784 0-50.2784 50.2784l0 0q0 50.2784 50.2784 50.2784ZM192 386.816m50.2784 0l59.4432 0q50.2784 0 50.2784-50.2784l0 0q0-50.2784-50.2784-50.2784l-59.4432 0q-50.2784 0-50.2784 50.2784l0 0q0 50.2784 50.2784 50.2784Z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="help-fill" unicode="&#58959;" d="M512 896a512 512 0 1 1 512-512A512.5632 512.5632 0 0 1 512 896z m0-878.1312a54.8864 54.8864 0 1 0 54.8352 54.8864A54.8352 54.8352 0 0 0 512 17.8688z m101.2224 373.76c-31.7952-31.744-64.6656-64.5632-64.6656-94.0544v-61.8496a36.5568 36.5568 0 1 0-73.1136 0v61.9008c0 59.8016 45.7216 105.5232 86.0672 145.8688 29.5936 29.6448 60.2112 60.2112 60.2112 84.5824A110.2848 110.2848 0 0 1 512 638.6688a107.776 107.776 0 0 1-109.7216-108.0832 36.5568 36.5568 0 1 0-73.1136 0 182.8352 182.8352 0 0 0 365.6704-2.5088c0-54.7328-41.472-96.2048-81.6128-136.3456z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="image-fill" unicode="&#58960;" d="M889.9072 822.8352H134.0928A134.2464 134.2464 0 0 1 0 688.7936v-609.5872a134.2464 134.2464 0 0 1 134.0928-134.0416h755.8144A134.2464 134.2464 0 0 1 1024 79.2064V688.7936a134.2464 134.2464 0 0 1-134.0928 134.0416zM292.5568 603.4432a73.1648 73.1648 0 1 0-73.1136-73.1648 73.1648 73.1648 0 0 0 73.1136 73.1648z m545.024-111.0016c-87.04 0-105.8816-46.848-129.792-123.2896-16.5888-53.0432-37.2736-119.04-107.776-130.304-64.3072-10.24-114.0224 4.7104-157.952 17.8688-29.0304 8.704-56.32 16.9984-86.6816 17.7152h-1.6384c-70.912 0-122.1632-114.176-136.0384-158.72a36.5568 36.5568 0 0 0-69.7856 21.6576c2.7136 8.704 68.7616 213.5552 209.3568 209.92 39.9872-1.024 73.5232-11.1104 105.8816-20.8896 41.6256-12.4928 77.6192-23.296 125.3376-15.6672 23.3472 3.7888 33.024 27.2384 49.5104 79.9744 21.76 69.5296 54.6304 174.5408 199.68 174.5408a36.5568 36.5568 0 1 0 0-73.1136z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="friends" unicode="&#58961;" d="M512 896a512 512 0 1 1 512-512A512 512 0 0 1 512 896z m140.1856-209.5104A299.9296 299.9296 0 0 0 747.52 621.8752v0.8192a334.4896 334.4896 0 0 0 66.9696-92.16l-163.84-163.84z m-140.9536 34.6624A326.8096 326.8096 0 0 0 624.64 703.0272v-230.8096L397.7728 700.672h0.8192a263.3728 263.3728 0 0 0 112.64 20.48zM276.48 621.1072a300.288 300.288 0 0 0 92.16 67.7376l163.84-163.84-319.7952 1.5872A298.7008 298.7008 0 0 0 276.48 621.1072zM179.6096 384a324.0448 324.0448 0 0 0 18.1248 113.408h230.7584l-227.6352-226.816A268.0832 268.0832 0 0 0 179.6096 384z m191.3856-303.2576A310.8352 310.8352 0 0 0 276.48 145.3056h-0.768a325.4784 325.4784 0 0 0-66.9696 92.9792l163.84 163.84z m137.8304-33.8944a326.8096 326.8096 0 0 0-113.408 18.1248v230.0416h1.5872l225.28-227.6864a281.856 281.856 0 0 0-113.4592-20.48z m236.3392 98.4576a340.992 340.992 0 0 0-92.16-67.7376l-163.84 163.84 320.5632-0.768a314.1632 314.1632 0 0 0-64.5632-95.3344z m81.1008 122.88h-229.9904v2.4064l226.8672 224.4608v0.8192c0-0.8192 0-0.8192 0.768-1.5872l0.8192 0.768a295.2192 295.2192 0 0 0 20.48-113.408 352.3584 352.3584 0 0 0-18.944-113.4592z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="image" unicode="&#58962;" d="M219.4432 530.2784a73.1648 73.1648 0 1 1 73.1136 73.1648 73.1136 73.1136 0 0 1-73.1136-73.1648z m670.72-585.1136H134.0928A134.2464 134.2464 0 0 0 0 79.2064V688.7936a134.2464 134.2464 0 0 0 134.0928 134.0416h755.8144A134.2464 134.2464 0 0 0 1024 688.7936v-609.5872a134.2464 134.2464 0 0 0-134.0928-134.0416zM134.0928 749.7216a61.0304 61.0304 0 0 1-60.928-60.928v-609.5872a61.0304 61.0304 0 0 1 60.928-60.928h755.8144a60.9792 60.9792 0 0 1 60.928 60.928V688.7936a60.9792 60.9792 0 0 1-60.928 60.928z m48.7424-659.4048a36.5056 36.5056 0 0 0-34.9184 47.36c2.7136 8.704 68.7616 213.5552 209.3568 209.92 39.9872-1.024 73.5232-11.1104 105.8816-20.8896 41.6256-12.4928 77.6192-23.296 125.3376-15.6672 23.3472 3.7888 33.024 27.2384 49.5104 79.9744 21.76 69.5296 54.6304 174.5408 199.68 174.5408a36.5568 36.5568 0 1 0 0-73.1136c-87.04 0-105.8816-46.848-129.792-123.2896-16.5888-53.0432-37.2736-119.04-107.776-130.304-64.3072-10.24-114.0224 4.7104-157.952 17.8688-29.0304 8.704-56.32 16.9984-86.6816 17.7152h-1.6384c-70.912 0-122.1632-114.176-136.0384-158.72a36.4544 36.4544 0 0 0-34.9696-25.3952z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="lessen" unicode="&#58963;" d="M476.16 419.84H35.84a35.84 35.84 0 0 1-35.84-35.84 35.84 35.84 0 0 1 35.84-35.84h952.32a35.84 35.84 0 0 1 35.84 35.84 35.84 35.84 0 0 1-35.84 35.84h-440.32"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="mail" unicode="&#58964;" d="M908.1856 768H115.8144A115.9168 115.9168 0 0 1 0 652.2368v-536.4736A115.9168 115.9168 0 0 1 115.8144 0h792.3712A115.9168 115.9168 0 0 1 1024 115.7632V652.2368A115.9168 115.9168 0 0 1 908.1856 768zM962.56 115.7632A54.3744 54.3744 0 0 0 908.1856 61.44H115.8144A54.3744 54.3744 0 0 0 61.44 115.7632V652.2368A54.3744 54.3744 0 0 0 115.8144 706.56h792.3712A54.3744 54.3744 0 0 0 962.56 652.2368zM845.4144 613.4272l-326.0416-238.336c-16.6912-16.64-43.7248-16.64-62.5664 2.048L177.664 613.4272a36.5568 36.5568 0 1 1-47.3088-55.808l276.9408-234.24a115.8656 115.8656 0 0 1 82.2784-34.048 112.9472 112.9472 0 0 1 80.2304 32.8192l324.8128 237.2096a36.5568 36.5568 0 1 1-49.2032 54.0672z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="lock" unicode="&#58965;" d="M512 274.2784a36.5568 36.5568 0 0 1-36.5568-36.5568V128a36.5568 36.5568 0 0 1 73.1136 0v109.7216a36.5568 36.5568 0 0 1-36.5568 36.5568zM877.7216 493.7216h-73.1648V605.696c0 171.0592-155.136 290.304-294.4512 290.304-142.8992 0-290.6624-108.3904-290.6624-289.792v-112.64H146.2784A109.8752 109.8752 0 0 1 36.5568 384v-402.2784A109.8752 109.8752 0 0 1 146.2784-128h731.4432a109.8752 109.8752 0 0 1 109.7216 109.7216V384a109.8752 109.8752 0 0 1-109.7216 109.7216zM292.5568 606.208c0 135.6288 110.592 216.6272 217.5488 216.6272 104.4992 0 221.3376-92.8256 221.3376-217.1392v-111.9744H292.5568z m621.7216-624.64a36.5568 36.5568 0 0 0-36.5568-36.5568H146.2784a36.608 36.608 0 0 0-36.5568 36.5568V384a36.608 36.608 0 0 0 36.5568 36.5568h731.4432a36.5568 36.5568 0 0 0 36.5568-36.5568z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="mail-fill" unicode="&#58966;" d="M908.1856 768H115.8144A115.9168 115.9168 0 0 1 0 652.2368v-536.4736A115.9168 115.9168 0 0 1 115.8144 0h792.3712A115.9168 115.9168 0 0 1 1024 115.7632V652.2368A115.9168 115.9168 0 0 1 908.1856 768z m-13.568-208.64l-324.8128-237.2096a112.9472 112.9472 0 0 0-80.2304-32.8192 115.8656 115.8656 0 0 0-82.2784 34.048L130.3552 557.6192a36.5568 36.5568 0 1 0 47.3088 55.808l279.1424-236.288c18.8416-18.688 46.08-18.688 62.5664-2.048l326.0416 238.336a36.5568 36.5568 0 1 0 49.2032-54.0672z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="map" unicode="&#58967;" d="M512 896h-9.0112c-215.8592-4.6592-389.12-176.1792-389.12-387.0208 0-4.5568 0-9.1136 0.256-13.6192 5.12-128 77.7216-271.8208 197.12-417.6896a1680.5888 1680.5888 0 0 1 168.96-177.6128l17.3568-15.36L512-128l14.4384 12.4416a1682.2784 1682.2784 0 0 1 186.5216 193.0752c119.3984 145.92 192.2048 289.792 197.12 417.6896 0 4.608 0.256 9.1136 0.256 13.6704C910.336 722.688 732.16 896 512 896z m326.4512-397.6704v-0.3584c-4.0448-105.6768-66.56-235.52-180.8896-374.9376A1612.8 1612.8 0 0 0 512-31.8976 1610.9056 1610.9056 0 0 0 366.5408 122.88C252.2112 262.6048 189.44 392.2944 185.5488 497.92v10.9568a308.224 308.224 0 0 0 92.5184 220.16A329.984 329.984 0 0 0 504.1152 824.32h8.192c179.968 0 326.3488-141.6192 326.3488-315.4432 0-3.7376-0.0512-7.1168-0.2048-10.5472zM512 711.0656A199.168 199.168 0 1 1 711.168 512 199.168 199.168 0 0 1 512 711.0656z m0-326.656A127.488 127.488 0 1 0 639.488 512 127.6416 127.6416 0 0 0 512 384.4096z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="phone" unicode="&#58968;" d="M783.0528 896H240.9472a90.368 90.368 0 0 1-90.368-90.368v-843.264A90.368 90.368 0 0 1 240.9472-128h542.1056a90.368 90.368 0 0 1 90.368 90.368V805.632A90.368 90.368 0 0 1 783.0528 896z m18.688-933.632a18.7392 18.7392 0 0 0-18.688-18.688H240.9472a18.7392 18.7392 0 0 0-18.688 18.688V805.632A18.7392 18.7392 0 0 0 240.9472 824.32h542.1056a18.7392 18.7392 0 0 0 18.688-18.688zM512 144.2816a61.44 61.44 0 0 1 0-122.88h0.5632a61.44 61.44 0 1 1-0.5632 122.88zM601.7536 751.1552H422.2464c-16.9472 0-30.72-16.0768-30.72-35.84s13.7728-35.84 30.72-35.84h179.5072c16.9472 0 30.72 16.0256 30.72 35.84s-13.7728 35.84-30.72 35.84z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="qq" unicode="&#58969;" d="M512 896a512 512 0 1 1 512-512A512 512 0 0 1 512 896z m256.768-672.6656c-18.8928-16.5888-43.3152 53.5552-47.2576 42.496-8.6528-25.9584-12.5952-43.3152-38.6048-71.68-1.536-1.536 29.952-13.3632 38.6048-36.1984s25.2416-58.3168-82.688-70.144c-63.0272-6.2976-108.6976 33.1264-112.64 33.1264a36.864 36.864 0 0 0-13.4144 0h-14.9504c-1.5872 0-22.8352-33.1264-116.5824-33.1264-72.448 0-91.3408 44.9024-76.3904 70.144 14.9504 24.4224 38.6048 32.256 35.4304 36.1984a188.1088 188.1088 0 0 0-35.4304 59.0848 81.5616 81.5616 0 0 0-3.9424 13.4144c-2.3552 10.24-22.8352-58.3168-44.9024-42.5472-21.248 15.7696-19.712 55.9104-5.5296 94.5152s50.432 76.3904 50.432 84.2752c1.5872 30.72-3.1744 36.2496 0 44.1344 7.0656 18.1248 14.9504 11.008 14.9504 20.48 0 118.1184 88.2176 214.2208 198.5024 214.2208s198.5024-96.1024 198.5024-214.2208c0-4.7616 11.8272 0 17.3568-20.48a207.616 207.616 0 0 0 0.768-44.1344c-0.768-11.008 30.72-25.1904 46.4896-84.2752s-0.8192-88.9856-8.704-95.2832z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="play-fill" unicode="&#58970;" d="M512 896a512 512 0 1 1 512-512A512.5632 512.5632 0 0 1 512 896z m167.424-580.3008l-187.1872-120.2688a85.1456 85.1456 0 0 0-46.08-13.4656 85.1968 85.1968 0 0 0-85.1968 85.1968V505.344a85.3504 85.3504 0 0 0 85.1968 85.248A84.992 84.992 0 0 0 491.52 577.4336l187.136-117.76a85.248 85.248 0 0 0 0.6656-143.8208z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="play" unicode="&#58971;" d="M512 896a512 512 0 1 1 512-512A512.5632 512.5632 0 0 1 512 896z m0-952.32a440.32 440.32 0 1 0 440.32 440.32 440.832 440.832 0 0 0-440.32-440.32zM678.7584 459.52L491.52 577.4336a84.992 84.992 0 0 1-45.4144 13.1584A85.3504 85.3504 0 0 1 360.96 505.344v-238.1824a85.1968 85.1968 0 0 1 85.248-85.1968 85.1456 85.1456 0 0 1 46.08 13.4656l187.1872 120.2688a85.248 85.248 0 0 1-0.6656 143.8208z m-32.2048-74.9568a13.4656 13.4656 0 0 0-5.888-8.5504L453.5808 256a13.568 13.568 0 0 0-7.3728-2.1504 12.9024 12.9024 0 0 0-9.5744 3.9424 12.7488 12.7488 0 0 0-3.9936 9.5744V505.344a13.568 13.568 0 0 0 13.5168 13.568 14.1312 14.1312 0 0 0 7.2704-2.0992l187.0848-117.76a14.8992 14.8992 0 0 0 4.2496-4.1472 13.568 13.568 0 0 0 1.792-10.3424z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="pic" unicode="&#58972;" d="M530.8928 317.0304l29.952-52.736h132.3008L596.2752 424.96l-65.3824-107.9296zM410.368 476.16a42.3424 42.3424 0 0 1-42.1376 42.5472h-0.3584a42.3936 42.3936 0 0 1-42.5472-42.1888V476.16a42.3936 42.3936 0 0 1 42.1888-42.5472h0.3584a42.3424 42.3424 0 0 1 42.496 42.1888zM403.3024 263.4752h145.7152L475.7504 389.5296l-72.448-126.0544zM512 896a512 512 0 1 1 512-512A512 512 0 0 1 512 896z m243.4048-636.4672a50.0736 50.0736 0 0 0-49.6128-50.3808H319.7952a49.5616 49.5616 0 0 0-49.6128 50.3808V509.2352a50.6368 50.6368 0 0 0 49.6128 50.432h385.9968a50.0736 50.0736 0 0 0 49.6128-50.432z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="QQspace" unicode="&#58973;" d="M512 896a512 512 0 1 1 512-512A512 512 0 0 1 512 896z m163.84-630.1696l29.952-174.08h-1.5872c-9.472 8.704-35.4304 18.1248-48.0768 25.2416-33.0752 17.3056-66.1504 33.8432-99.2256 51.2-11.8272 6.2976-22.8352 11.776-34.6624 18.0736-2.3552 1.5872-7.8848 7.1168-11.8272 6.3488l-7.0656-4.7616-30.72-15.7184c-35.4816-18.944-70.912-35.4816-107.1616-54.3744-14.1312-7.8848-32.256-20.48-48.0256-25.1904l37.0176 212.6848a173.0048 173.0048 0 0 0-27.5456 26.7776 601.7536 601.7536 0 0 1-51.2 47.2576l-21.2992 20.48A343.04 343.04 0 0 0 215.04 436.7872a179.2 179.2 0 0 0-18.1248 16.5376 315.1872 315.1872 0 0 1 37.8368 6.2976c17.3056 3.9424 33.8432 3.1232 50.3808 7.0656 23.6544 5.5296 48.0768 4.7616 70.0928 10.24 13.4144 3.1744 51.2 3.1744 59.0848 8.704a151.6544 151.6544 0 0 1 10.24 19.6608c7.1168 14.1824 14.1824 28.3648 22.0672 43.3152 22.0672 42.5472 44.1344 85.8624 64.6144 129.1776 0.768-0.768 0 0 0.768-1.536a45.056 45.056 0 0 0 7.8848-15.0016c7.0656-13.3632 13.3632-27.5456 21.248-41.728l67.7376-133.888a797.7472 797.7472 0 0 0 86.6816-12.6464c23.6032-5.4784 47.2576-4.7104 70.0928-10.24 13.3632-3.1232 51.968-3.1232 59.8528-8.6528-12.5952-9.4208-20.48-23.6032-32.3072-32.3072-8.6528-6.2976-14.9504-15.7184-22.8352-22.016-23.6032-17.3568-43.3152-40.96-63.7952-60.672-7.0656-7.0656-37.0176-30.72-37.7856-39.3728a109.3632 109.3632 0 0 0 7.0656-30.72l-196.1472 14.9504v0.8192h0.8192a72.5504 72.5504 0 0 0 15.7184 11.008c12.5952 7.8848 24.4224 16.5376 37.0176 25.1904 33.1264 22.0672 64.6144 46.4896 96.9216 69.3248 8.6528 6.2976 28.3648 17.3568 33.8432 25.1904a18.4832 18.4832 0 0 1 2.3552 15.7696c-2.3552 7.1168-13.3632 4.7104-22.8352 4.7104h-65.3824c-6.2976-3.9424-41.728-0.768-51.968-0.768l-129.1776-1.5872c-10.24 0-46.4896 3.1744-52.7872-0.768a157.2352 157.2352 0 0 0 37.8368-4.7104c14.9504-3.1744 30.72-2.4064 44.8512-6.3488l15.7696-0.768c23.6544-5.5296 51.2-5.5296 74.8544-11.008 14.9504-3.1744 30.72-2.3552 44.9024-6.2976 7.0656-1.5872 14.1824 0.768 18.8928-3.1744h-1.5872c-13.3632-11.8272-37.7856-20.48-54.3232-29.952-39.424-24.3712-81.92-46.4384-121.344-70.8608-8.6528-5.5296-23.6032-14.1824-27.5456-22.8352-3.1744-6.2976-1.5872-20.48 3.9424-22.8352h15.7184l278.8864 12.5952v3.1232"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="round-close" unicode="&#58974;" d="M512-128a512 512 0 1 0 512 512 512.5632 512.5632 0 0 0-512-512z m0 950.528A438.528 438.528 0 1 1 950.528 384 438.9888 438.9888 0 0 1 512 822.528z m51.5072-440.32l158.1056 156.416a36.5568 36.5568 0 1 1-51.2 52.0192L512 434.2272 355.8912 590.6432A36.5568 36.5568 0 1 1 304.128 539.0336l155.6992-156.2112-156.9792-155.2896a36.5568 36.5568 0 1 1 51.2-52.0192l157.44 155.4944 158.72-159.0272a36.5568 36.5568 0 0 1 51.712 51.6608z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="round-add-fill" unicode="&#58975;" d="M877.755849 746.159312a516.00937 516.00937 0 0 1-727.143847 0 511.998535 511.998535 0 0 1 363.649055-874.156381A511.844272 511.844272 0 0 1 877.755849 21.843619a510.404485 510.404485 0 0 1 0 724.16143zM771.314454 347.338318h-220.338829v-220.39025a36.765989 36.765989 0 0 0-73.480557 0V347.338318H257.104818a36.765989 36.765989 0 0 0 0 73.480557h220.39025V641.209125a36.765989 36.765989 0 0 0 73.480557 0v-220.39025H771.314454a36.765989 36.765989 0 0 0 0-73.480557z"  horiz-adv-x="1028" />
+
+    
+    <glyph glyph-name="none" unicode="&#58976;" d="M14.080034 60.800883c0-78.509231 225.905963-142.27879 504.884986-142.27879S1023.747647-17.861887 1023.747647 60.800883s-225.803604 142.329969-504.782627 142.329969-504.884986-63.871917-504.884986-142.329969zM827.37221 156.762297l-217.41018-190.84806-7.830451 369.464239 231.228623 137.109668zM603.001629-30.247306l-405.699268 118.480359V225.138003l342.032069-100.66992c22.467766 157.888513 40.943537 219.508536 54.864339 186.241912s16.633312-147.089655 8.905219-341.162019z m-5.885633 371.460235l-108.858628 23.696072L481.245787 442.189927V573.51632l341.162019-95.142543h11.668908zM204.928094 438.453829l283.329274-78.560411V575.563497L204.928094 438.453829zM919.597526 292.234224L836.430967 461.740465v-147.089655zM487.387318 354.929014a4.759686 4.759686 0 0 0-5.117942 4.606148V565.634689a5.117942 5.117942 0 0 0 9.928807 0v-205.741271a5.117942 5.117942 0 0 0-4.810865-5.117942zM532.425208 125.54285l-409.844802 125.49194 76.462055 185.371862 398.073535-101.847047zM839.501732 480.420954a5.117942 5.117942 0 0 1-5.885633 2.917227h-0.307077L489.434494 578.276006a1.995997 1.995997 0 0 1-3.070765 0L199.349538 441.115159a4.503789 4.503789 0 0 1-5.117942-3.019586L117.8719 252.82607a3.173124 3.173124 0 0 1 0-3.838457c0.87005-2.047177 2.047177-2.917227 2.917227-2.917227L194.641031 223.500262v-139.924537a6.039172 6.039172 0 0 1 3.838456-5.117942l408.002343-118.992153a4.45261 4.45261 0 0 1 1.381844-0.716512h5.578557a3.787277 3.787277 0 0 1 1.586562 1.893639l222.272224 190.182727a6.090351 6.090351 0 0 1 2.047177 3.736098v149.699806l77.280925-22.007151h0.870051a2.968406 2.968406 0 0 1 2.968406 1.535382 4.094354 4.094354 0 0 1 2.047177 3.736098V307.025076zM488.257368 569.421967l333.229208-93.095367-225.189451-136.08608-382.310273 97.855053zM202.010867 430.265122L286.763988 408.820944l305.438783-78.150975-62.029458-199.241485-401.451376 122.83061z m2.558971-343.823349v134.038903l326.93414-99.902229h0.92123c1.944818 0 3.991995 1.177127 3.991995 2.968406L593.072821 307.025076l11.771267-338.142433z m409.435367-111.622317l-11.617729 356.97646 226.16186 136.444336v-310.198469z m298.58074 318.284818L839.501732 314.548451V454.677705l72.930675-151.695803zM921.388806 883.458892c-7.216298 9.877628-55.069057-0.87005-76.769132-33.368982-5.885633-9.826449-12.897214-40.175845-7.93281-33.215444C849.737617 835.503775 873.075432 824.756097 890.681153 839.291052c14.586135 12.538958 36.18385 36.18385 30.298217 44.474917zM954.092455 895.99785a32.754829 32.754829 0 0 1-7.88163-0.87005c-1.177127 0-3.224304-1.177127-7.06276-2.047177a205.638913 205.638913 0 0 1-19.601719-6.346248 14.381417 14.381417 0 0 1-10.235884 2.507792 94.937826 94.937826 0 0 1-66.533247-38.231027c-2.917227-6.14153-12.897214-34.44375-7.88163-37.360978h2.047176a1.177127 1.177127 0 0 1 0.716512 0 1.330665 1.330665 0 0 1 0.409436 1.84246c5.885633 8.80286 15.353826 9.621731 25.333813 11.668908a46.82917 46.82917 0 0 1 28.404578 9.928807c0.87005 0 36.439748 31.78242 30.96355 45.498505 5.527377 1.893639 11.46419 3.684918 18.015156 5.117942a68.478065 68.478065 0 0 0 7.011581 2.047177 29.684064 29.684064 0 0 1 7.06276 0.92123z m-64.383711-54.045468a48.876347 48.876347 0 0 0-25.58971-8.905219 38.947539 38.947539 0 0 1-25.589711-9.877628 116.689079 116.689079 0 0 0 8.90522 26.664478A85.009018 85.009018 0 0 0 910.641127 885.352531l-0.358256-0.358256a23.286636 23.286636 0 0 0 4.043175-0.358256 133.066494 133.066494 0 0 1-56.55326-43.553687l3.838456-2.917227a115.819029 115.819029 0 0 0 57.832746 43.400149c2.303074-5.629736-13.716085-25.58971-29.735244-39.612872zM894.51961 813.701342c34.085494-54.710801 34.955544-119.094512 2.303074-154.561851a125.543119 125.543119 0 0 0-40.943537-26.715657c4.759686 25.58971-1.433024 56.757978-13.204291 72.572418a23.030739 23.030739 0 0 1-15.916799 10.59414 32.191856 32.191856 0 0 1-26.664479-11.720087 49.951115 49.951115 0 0 1-17.810438-40.278204 47.340964 47.340964 0 0 1 24.207866-35.825595l0.614153-0.614153a59.368128 59.368128 0 0 1 43.758405-2.047177c-15.353826-58.139822-85.469633-87.875065-93.70952-90.792292l2.047177-4.862045a202.31225 202.31225 0 0 1 66.533247 42.837175A95.961414 95.961414 0 0 1 854.855559 626.794097a112.594726 112.594726 0 0 1 45.600863 29.17227c33.880777 36.746824 33.880777 103.177712-1.433023 160.703381z m-41.864766-182.659353l-0.614154-1.074768a55.939107 55.939107 0 0 0-42.274201 0.614153l-1.074768 1.84246c-17.042747 10.798858-20.881204 23.133098-20.881204 31.424164a48.415732 48.415732 0 0 0 15.865621 36.746824 31.8336 31.8336 0 0 0 22.877201 10.491781 20.471768 20.471768 0 0 0 13.25547-8.85404 98.622744 98.622744 0 0 0 12.846035-71.139394zM95.608852 55.836479c-0.87005-9.928808-42.018304-21.597716-71.139395-7.93281-9.928808 3.838457-26.664478 22.518945-20.471768 19.601718 17.810438-7.011581 30.349397 8.905219 49.899935 7.011581 16.019159-2.917227 42.325381-10.850037 42.325381-18.680489zM111.62801 59.060783a134.857774 134.857774 0 0 1-17.503361 2.558971c-10.235884 7.267478-32.089497 11.975984-38.794001 12.641317a42.837175 42.837175 0 0 1-25.333814-3.838457 31.372985 31.372985 0 0 0-24.566122-2.047177c-4.043174 2.047177-5.117942-0.87005-5.117942-0.87005-2.917227-4.708507 15.353826-19.601718 22.518945-22.518945a87.005015 87.005015 0 0 1 31.475344-5.783274 144.786581 144.786581 0 0 1 38.231027 6.397427c5.117942 2.047177 7.011581 5.117942 7.011581 7.93281a6.243889 6.243889 0 0 1-0.614153 2.507792c3.787277-0.511794 7.574554-1.125947 11.310652-1.995997z m-20.062333-3.121945c0-0.92123-0.92123-1.79128-3.838456-3.838456a77.280925 77.280925 0 0 0-63.61602-2.047177 67.966271 67.966271 0 0 0-16.633312 13.716085 31.628882 31.628882 0 0 1 21.290639 4.094353A58.037463 58.037463 0 0 0 51.338653 71.599741a122.83061 122.83061 0 0 0 32.959547-9.468193 144.377146 144.377146 0 0 1-21.546536-1.074768 81.528817 81.528817 0 0 0-34.443751 2.047177l-2.047176-5.117942a87.516809 87.516809 0 0 1 36.235029-2.047177 133.066494 133.066494 0 0 0 28.916373 0.716512 2.098356 2.098356 0 0 0 0.153538-0.716512z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="round-selected-fill" unicode="&#58977;" d="M512 896a512 512 0 1 1 512-512A512.5632 512.5632 0 0 1 512 896z m245.76-427.9808L465.1008 172.032s0-0.256-0.256-0.3072a33.5872 33.5872 0 0 0-7.936-5.12 35.1744 35.1744 0 0 0-3.84-2.5088 36.608 36.608 0 0 0-27.5456 0c-1.4336 0.6144-2.56 1.8944-3.9936 2.6624a36.096 36.096 0 0 0-7.8848 5.12 1.6896 1.6896 0 0 1 0 0.3072h-0.3072l-144.4352 148.0704a36.5568 36.5568 0 0 0 52.4288 51.2l118.016-121.2928 266.6496 269.5168a36.5568 36.5568 0 1 0 51.968-51.2z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="round-add" unicode="&#58978;" d="M512-125.7472a509.7472 509.7472 0 1 0 361.9328 870.4 508.2112 508.2112 0 0 0 0-721.0496A509.6448 509.6448 0 0 0 512-125.7472z m0 946.3808a437.0432 437.0432 0 0 1-310.4256-128 435.2 435.2 0 0 1 0-617.3184 440.32 440.32 0 0 1 620.8512 0 435.2 435.2 0 0 1 0 617.3184 437.0944 437.0944 0 0 1-310.4256 128z m256-400.0256h-219.392V640a36.608 36.608 0 0 1-73.1648 0v-219.392H256a36.608 36.608 0 0 1 0-73.1648h219.4432V128a36.608 36.608 0 0 1 73.1648 0v219.4432H768a36.608 36.608 0 0 1 0 73.1648z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="round-lessen-fill" unicode="&#58979;" d="M873.984 744.5504a513.792 513.792 0 0 1-724.0192 0 509.7984 509.7984 0 0 1 362.0864-870.4 509.6448 509.6448 0 0 1 361.9328 149.248 508.2112 508.2112 0 0 1 0 721.0496zM768 347.4432H256a36.608 36.608 0 0 0 0 73.1648h512a36.608 36.608 0 0 0 0-73.1648z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="round-lessen" unicode="&#58980;" d="M873.984 744.5504a513.792 513.792 0 0 1-724.0192 0 509.7984 509.7984 0 0 1 362.0864-870.4 509.6448 509.6448 0 0 1 361.9328 149.248 508.2112 508.2112 0 0 1 0 721.0496z m-51.5584-669.184a440.32 440.32 0 0 0-620.8512 0 435.2 435.2 0 0 0 0 617.3184 440.32 440.32 0 0 0 620.8 0 435.2 435.2 0 0 0 0-617.3184zM548.608 347.4432H768a36.608 36.608 0 0 1 0 73.1648H256a36.608 36.608 0 0 1 0-73.1648h219.4432"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="round-close-fill" unicode="&#58981;" d="M512 896a512 512 0 1 1 512-512A512.5632 512.5632 0 0 1 512 896z m209.92-672.3584a36.5568 36.5568 0 1 0-51.7632-51.6608l-158.72 159.0272-157.184-155.4944a36.5568 36.5568 0 1 0-51.2 52.0192l156.9792 155.2896L304.128 539.0336a36.5568 36.5568 0 1 0 51.7632 51.6096L512 434.2272l158.208 156.6208a36.5568 36.5568 0 1 0 51.2-52.0192l-158.1056-156.416z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="search" unicode="&#58982;" d="M472.32 890.624a406.8864 406.8864 0 1 1 228.096-743.8848l1.2288-1.7408 192.2048-245.248a35.84 35.84 0 0 1 28.2624-13.7216 35.84 35.84 0 0 1 28.16 57.6512l-192.2048 245.76a29.184 29.184 0 0 1-2.3552 2.6624A406.784 406.784 0 0 1 472.32 890.624z m0-742.0928a335.2064 335.2064 0 1 0 335.2064 335.2064A335.616 335.616 0 0 0 472.32 148.48z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="round-selected" unicode="&#58983;" d="M512-128a512 512 0 1 0 512 512 512.5632 512.5632 0 0 0-512-512z m0 950.528A438.528 438.528 0 1 1 950.528 384 438.9888 438.9888 0 0 1 512 822.528z m245.76-302.7456a36.5056 36.5056 0 0 1-51.712-0.3072l-266.7008-269.5168-118.016 121.2928a36.5568 36.5568 0 0 1-52.4288-51.2l144.0256-148.0192h0.3072a1.6896 1.6896 0 0 0 0-0.3072 36.096 36.096 0 0 1 7.8848-5.12c1.4336-0.768 2.56-2.048 3.9936-2.6624a36.608 36.608 0 0 1 27.5456 0 35.1744 35.1744 0 0 1 3.84 2.5088 33.5872 33.5872 0 0 1 7.936 5.12l0.256 0.3072L757.76 468.0192a36.6592 36.6592 0 0 1 0 51.7632z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="shipping-address" unicode="&#58984;" d="M512 134.375405q304.537406 288.694715 304.639617 456.984978a304.639617 304.639617 0 0 1-609.279234 0q0-168.494685 304.639617-456.984978zM364.765184 591.104856A147.234816 147.234816 0 1 0 512 443.87004a147.285921 147.285921 0 0 0-147.234816 147.234816zM1016.257524-76.792334L879.959275 202.652293a35.773818 35.773818 0 0 1-32.145331 20.084444h-144.93507a35.773818 35.773818 0 0 1 0-71.547637h122.653092l101.444328-207.89699H97.023706l100.984379 207.89699H314.22189a35.773818 35.773818 0 0 1 0 71.547637H175.623896a35.773818 35.773818 0 0 1-32.196437-20.186655L7.691371-76.894545a35.773818 35.773818 0 0 1 32.196437-51.105455h944.224384a35.773818 35.773818 0 0 1 32.145332 51.463193z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="round" unicode="&#58985;" d="M512-128a512 512 0 1 0 512 512 512.5632 512.5632 0 0 0-512-512z m0 950.8352A438.8352 438.8352 0 1 1 950.8352 384 439.3472 439.3472 0 0 1 512 822.8352z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="share" unicode="&#58986;" d="M877.2096 329.1648v-381.4912H71.68v742.4h232.2944v71.68H46.08a46.08 46.08 0 0 1-46.08-46.08v-793.6a46.08 46.08 0 0 1 46.08-46.08h856.7296a46.08 46.08 0 0 1 46.08 46.08v407.0912zM1013.76 674.7136l-199.68 199.68a35.84 35.84 0 0 1-50.688-50.688l140.8512-140.8512H697.856a416.3584 416.3584 0 0 1-415.8976-415.8976v-68.9664a423.0656 423.0656 0 0 1 3.4816-53.1456h83.456a336.8448 336.8448 0 0 0-4.3008 53.1456v68.9664a333.6192 333.6192 0 0 0 333.2608 333.2608h190.464l-125.184-125.184a35.84 35.84 0 0 1 50.688-50.688l199.68 199.68a35.84 35.84 0 0 1 0.256 50.688z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="servise" unicode="&#58987;" d="M915.046707 514.8672h-1.024a405.1968 405.1968 0 0 1-803.84 0h-1.024A108.9536 108.9536 0 0 1 0.000307 405.9136v-148.1728A109.0048 109.0048 0 0 1 108.953907 148.48h175.4624V514.8672h-102.4a333.6704 333.6704 0 0 0 659.5584 0h-102.4v-443.6992a34.4576 34.4576 0 0 0-34.4064-34.4064v-0.768a109.5168 109.5168 0 0 1-103.6288 74.24h-148.48a109.568 109.568 0 1 1 0-219.136h148.992a109.5168 109.5168 0 0 1 103.6288 74.24v-0.768a106.7008 106.7008 0 0 1 106.5984 106.5984V148.48h103.168A109.0048 109.0048 0 0 1 1024.000307 257.7408V405.9136a108.9536 108.9536 0 0 1-108.9536 108.9536z m-702.3104-71.68V220.16H108.953907a37.376 37.376 0 0 0-37.2736 37.5808V405.9136a37.3248 37.3248 0 0 0 37.2736 37.2736z m389.12-480.1536H452.659507a37.888 37.888 0 1 0 0 75.776h148.992a37.888 37.888 0 0 0 0-75.776zM952.320307 257.7408a37.376 37.376 0 0 0-37.2736-37.3248h-103.7824V443.1872h103.7824a37.3248 37.3248 0 0 0 37.2736-37.2736z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="siet-fill" unicode="&#58988;" d="M824.549063 688.947763a28.408898 28.408898 0 0 0 14.434791 3.890228 28.971957 28.971957 0 0 0 25.286478-14.485979l80.517471-139.075631a29.074331 29.074331 0 0 0-8.445888-38.339215l-3.020045-1.893927-20.884379-12.028993M582.740715 492.388903l-2.20105 1.27968a119.726868 119.726868 0 1 1 46.068483-165.027543 120.033992 120.033992 0 0 1-43.867433 163.747863zM956.816796 321.270082l-15.356161 8.804199a421.782554 421.782554 0 0 1 1.586803 103.756461l21.601 12.438491 5.11872 3.020045a90.498975 90.498975 0 0 1 28.255336 120.801799L917.402649 709.115521a90.447788 90.447788 0 0 1-123.463534 33.066933l-21.549812-12.336116a422.908673 422.908673 0 0 1-87.837241 49.293277v26.207848A90.447788 90.447788 0 0 1 594.155461 895.744064L433.47883 896h-5.835341A90.447788 90.447788 0 0 1 343.082229 805.347463v-34.500175A417.175706 417.175706 0 0 1 263.025444 721.963509L225.351662 743.71807l-5.11872 2.508173a90.498975 90.498975 0 0 1-119.010248-35.831042L26.028693 579.91902l-2.55936-4.658035a90.550162 90.550162 0 0 1 35.831042-119.010248L102.502374 431.117821a422.140865 422.140865 0 0 1 0-86.608748l-39.15821-22.52237-5.11872-3.020045A90.498975 90.498975 0 0 1 30.84029 198.164859l80.517471-139.024444A90.447788 90.447788 0 0 1 234.565359 25.817546l38.492776 22.164059a427.515521 427.515521 0 0 1 70.84309-42.024694v-43.304374A90.447788 90.447788 0 0 1 434.349013-127.744064l160.676631-0.255936h5.784154a90.498975 90.498975 0 0 1 84.868382 90.447788v35.831042a422.703924 422.703924 0 0 1 84.305324 47.092227l20.884379-12.08018 4.709223-2.508173a90.447788 90.447788 0 0 1 118.95906 35.831043l75.449937 130.680929 2.508173 4.658036a90.60135 90.60135 0 0 1-35.67748 119.31737z m-276.973957-23.136615a181.049138 181.049138 0 0 0-313.470432 181.253886 180.690827 180.690827 0 0 0 247.029443 66.031492 181.305074 181.305074 0 0 0 66.440989-247.285378z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="square-selected" unicode="&#58989;" d="M776.6016 530.2272a39.3216 39.3216 0 0 1-55.6544-0.3072l-287.1296-290.2016-127.0784 130.56a39.3728 39.3728 0 1 1-56.32-54.8864l155.0848-159.3856 0.3072-0.256c0.3072-0.256 0 0 0-0.3072a36.608 36.608 0 0 1 8.448-5.5808 44.8512 44.8512 0 0 1 4.352-2.816 38.5024 38.5024 0 0 1 14.8992-2.9696 39.5264 39.5264 0 0 1 14.6944 2.8672c1.536 0.6144 2.7136 1.8944 4.1984 2.6624a37.4272 37.4272 0 0 1 8.5504 5.632 3.1232 3.1232 0 0 0 0 0.3072h0.3584l315.3408 318.7712a39.3728 39.3728 0 0 1-0.0512 55.9104zM905.8816-128H118.1696A118.272 118.272 0 0 0 0-9.8304V777.8304A118.272 118.272 0 0 0 118.1696 896h787.712A118.3232 118.3232 0 0 0 1024 777.8304v-787.6608A118.3232 118.3232 0 0 0 905.8816-128zM118.1696 817.2544a39.4752 39.4752 0 0 1-39.3728-39.424v-787.6608a39.4752 39.4752 0 0 1 39.3728-39.424h787.712a39.3728 39.3728 0 0 1 39.3728 39.424V777.8304a39.424 39.424 0 0 1-39.3728 39.424z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="sort-fill" unicode="&#58990;" d="M922.925619 873.984a101.0688 101.0688 0 0 0 78.2848-165.0688l-313.2928-383.1296v-431.7696l-362.0864 164.4544v267.3152L21.856819 710.1952a101.0688 101.0688 0 0 0 79.2576 163.84z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="sort" unicode="&#58991;" d="M922.976819 873.984H101.114419a101.0688 101.0688 0 0 1-79.2576-163.84l303.9744-384.4096v-267.3152l71.68-32.5632v324.8128l-15.36 19.5584L78.074419 754.688a29.44 29.44 0 0 0 4.8128 41.3184 29.7984 29.7984 0 0 0 18.2272 6.2976h821.8624a29.3376 29.3376 0 0 0 22.7328-47.9744l-313.2928-383.1808-16.1792-19.7632v-424.96l71.68-32.5632v431.9232l313.2928 383.1296A101.0688 101.0688 0 0 1 922.976819 873.984z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="square" unicode="&#58992;" d="M905.8304-128H118.1696A118.272 118.272 0 0 0 0-9.8304V777.8304A118.272 118.272 0 0 0 118.1696 896h787.6608A118.272 118.272 0 0 0 1024 777.8304v-787.6608A118.272 118.272 0 0 0 905.8304-128zM118.1696 817.2544a39.5264 39.5264 0 0 1-39.424-39.424v-787.6608a39.4752 39.4752 0 0 1 39.424-39.424h787.6608a39.424 39.424 0 0 1 39.424 39.424V777.8304a39.4752 39.4752 0 0 1-39.424 39.424z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="star-fill" unicode="&#58993;" d="M1022.203699 506.879968a36.761598 36.761598 0 0 1-29.183998 24.575999l-308.940785 47.871998-138.239993 295.577585A36.710398 36.710398 0 0 1 512.968525 895.999949a36.505598 36.505598 0 0 1-33.075199-20.940799l-139.263993-294.911985-309.452784-46.591998A36.607998 36.607998 0 0 1 10.28695 471.91037l224.511989-230.963188-53.503998-325.478384a36.607998 36.607998 0 0 1 53.759998-37.990398l276.479986 152.063992 275.814386-152.985592a36.966398 36.966398 0 0 1 17.715199-4.5568h0.7168a36.556798 36.556798 0 0 1 36.607998 36.556798 37.478398 37.478398 0 0 1-2.304 12.9536l-51.199997 318.463984L1013.8069 469.96477a36.710398 36.710398 0 0 1 8.396799 36.915198z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="square-selected-fill" unicode="&#58994;" d="M905.8816 896H118.1696A118.272 118.272 0 0 1 0 777.8304v-787.6608A118.272 118.272 0 0 1 118.1696-128h787.712A118.3232 118.3232 0 0 1 1024-9.8304V777.8304A118.3232 118.3232 0 0 1 905.8816 896z m-128.9728-421.4784l-315.3408-318.7712h-0.3584a3.1232 3.1232 0 0 1 0-0.3072 37.4272 37.4272 0 0 0-8.5504-5.632c-1.4848-0.768-2.6624-2.048-4.1984-2.6624a39.5264 39.5264 0 0 0-14.6944-2.8672 38.5024 38.5024 0 0 0-14.8992 2.9696 44.8512 44.8512 0 0 0-4.352 2.816 36.608 36.608 0 0 0-8.448 5.5808v0.3072c0 0.3072 0 0-0.3072 0.256L250.2656 315.392a39.3728 39.3728 0 1 0 56.32 54.8864l127.0784-130.56 287.2832 290.2016a39.3728 39.3728 0 1 0 55.9616-55.3984z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="stop-v-fill" unicode="&#58995;" d="M512.3072 896a512 512 0 1 1 512-512 512 512 0 0 1-512 512zM442.7264 218.368c0-24.9856-16.0768-45.2096-35.84-45.2096-19.8144 0-35.84 20.48-35.84 45.2096V519.5264c0 24.9344 16.0256 45.1584 35.84 45.1584 19.7632 0 35.84-20.48 35.84-45.1584z m195.7376 0c0-24.9856-16.0256-45.2096-35.84-45.2096-19.7632 0-35.84 20.48-35.84 45.2096V519.5264c0 24.9344 16.0768 45.1584 35.84 45.1584 19.8144 0 35.84-20.48 35.84-45.1584z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="star-half" unicode="&#58996;" d="M512.763725 800.921554l115.660794-247.603188 13.875199-29.695999 32.409599-5.119999 261.119987-40.294398-191.129591-195.379191-21.657599-22.118398 5.12-30.719999 44.339198-275.097586-231.116789 127.999993-29.644798 16.4352M512.968525 895.999949a36.505598 36.505598 0 0 1-33.075199-20.940799l-139.263993-294.911985-309.452784-46.591998A36.607998 36.607998 0 0 1 10.28695 471.91037l224.511989-230.963188-53.503998-325.478384a36.607998 36.607998 0 0 1 53.759998-37.990398l276.479986 152.063992 275.814386-152.985592a36.966398 36.966398 0 0 1 17.715199-4.5568h0.7168a36.556798 36.556798 0 0 1 36.607998 36.556798 37.478398 37.478398 0 0 1-2.304 12.9536l-51.199997 318.463984L1013.8069 469.96477a36.556798 36.556798 0 0 1-20.479999 61.439997l-309.247985 47.923198-138.239993 295.577585A36.710398 36.710398 0 0 1 512.968525 895.999949z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="star" unicode="&#58997;" d="M512.712525 776.806355l106.444794-227.839989 16.1792-34.662398 37.836798-5.8368L914.581305 471.03997 737.326914 290.099179l-25.292799-25.599999 5.7344-35.839998 40.959997-254.361587-212.684789 117.759994-34.611198 19.199999-34.559998-19.097599-213.09439-117.043194 41.830398 254.207987 5.888 35.839998-25.190399 25.907199-176.844791 181.759991 241.817588 36.454398 37.887998 5.6832 16.332799 34.559998 107.519995 227.276789M512.968525 895.999949a36.505598 36.505598 0 0 1-33.075199-20.940799l-139.263993-294.911985-309.452784-46.591998A36.607998 36.607998 0 0 1 10.28695 471.91037l224.511989-230.963188-53.503998-325.478384a36.607998 36.607998 0 0 1 53.759998-37.990398l276.479986 152.063992 275.814386-152.985592a36.966398 36.966398 0 0 1 17.715199-4.5568h0.7168a36.556798 36.556798 0 0 1 36.607998 36.556798 37.478398 37.478398 0 0 1-2.304 12.9536l-51.199997 318.463984L1013.8069 469.96477a36.556798 36.556798 0 0 1-20.479999 61.439997l-309.247985 47.923198-138.239993 295.577585A36.710398 36.710398 0 0 1 512.968525 895.999949z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="stop-fill" unicode="&#58998;" d="M523.1104 896a512 512 0 1 0-512-512 512 512 0 0 0 512 512z m75.264-361.4208H447.7952a75.3152 75.3152 0 0 1-75.3152-75.264v-150.6304a75.3152 75.3152 0 0 1 75.3152-75.264h150.5792a75.3152 75.3152 0 0 1 75.3152 75.264V459.3152a75.3152 75.3152 0 0 1-75.3152 75.264z"  horiz-adv-x="1035" />
+
+    
+    <glyph glyph-name="tick" unicode="&#58999;" d="M701.952 382.5664L977.92 658.2784c12.3904 12.3904 11.1104 33.7408-2.8672 47.7696-14.0288 13.9776-35.4304 15.36-47.8208 2.8672l-275.9168-275.6608-44.9024-44.9024L330.7008 112.64c-12.3904-12.3904-11.1104-33.792 2.9184-47.7696 13.9776-13.9776 35.3792-15.36 47.7696-2.9184l275.712 275.712zM99.0208 400.8448l291.80416-291.80416a26.624 26.624 0 0 0 0-37.65248l-13.0304-13.0304a26.624 26.624 0 0 0-37.65248 0L48.3328 350.1568a35.84 35.84 0 0 0 0 50.68288 35.84 35.84 0 0 0 50.688 0z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="stop-v" unicode="&#59000;" d="M512 896a512 512 0 1 1 512-512A512 512 0 0 1 512 896z m0-952.32a440.32 440.32 0 1 0 440.32 440.32 440.832 440.832 0 0 0-440.32-440.32zM406.5792 564.6848c-19.7632 0-35.84-20.48-35.84-45.1584v-301.1584c0-24.9856 16.0768-45.2096 35.84-45.2096 19.8144 0 35.84 20.48 35.84 45.2096V519.5264c0 24.9344-16.0256 45.1584-35.84 45.1584zM602.368 564.6848c-19.8144 0-35.84-20.48-35.84-45.1584v-301.1584c0-24.9856 16.0256-45.2096 35.84-45.2096 19.7632 0 35.84 20.48 35.84 45.2096V519.5264c0 24.9344-16.0768 45.1584-35.84 45.1584z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="stop" unicode="&#59001;" d="M512 896a512 512 0 1 1 512-512A512 512 0 0 1 512 896z m0-952.32a440.32 440.32 0 1 0 440.32 440.32 440.832 440.832 0 0 0-440.32-440.32zM587.3152 534.5792H436.6848a75.264 75.264 0 0 1-75.264-75.264v-150.6304a75.264 75.264 0 0 1 75.264-75.264h150.6304a75.264 75.264 0 0 1 75.264 75.264V459.3152a75.264 75.264 0 0 1-75.264 75.264z m3.584-225.8944a3.4816 3.4816 0 0 0-3.584-3.584H436.6848a3.584 3.584 0 0 0-3.584 3.584V459.3152a3.584 3.584 0 0 0 3.584 3.584h150.6304a3.584 3.584 0 0 0 3.584-3.584z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="twitter" unicode="&#59002;" d="M512 896a512 512 0 1 1 512-512A512 512 0 0 1 512 896z m252.672-431.5136v-15.7184c0-161.792-122.88-348.16-348.16-348.16a346.88 346.88 0 0 0-187.6992 55.04 265.8304 265.8304 0 0 1 29.2352-1.7408 245.76 245.76 0 0 1 152.0128 52.3776 122.88 122.88 0 0 0-114.3808 84.992 125.3376 125.3376 0 0 1 55.1424 2.1504 122.4704 122.4704 0 0 0-97.024 120.0128V414.72a121.7536 121.7536 0 0 1 55.1424-15.36A122.4192 122.4192 0 0 0 271.36 563.2a347.3408 347.3408 0 0 1 252.0576-128 118.8352 118.8352 0 0 0-3.2768 27.5456 122.4704 122.4704 0 0 0 211.6096 84.0704 246.2208 246.2208 0 0 1 77.4656 29.696 122.88 122.88 0 0 0-53.8112-67.7376 242.8928 242.8928 0 0 1 70.1952 19.3024V527.36a246.7328 246.7328 0 0 0-60.928-63.0272z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="upload" unicode="&#59003;" d="M917.175022 636.426112h-111.865987v-65.686069h111.865987a21.912422 21.912422 0 0 0 21.912422-21.912422v-589.229129a21.912422 21.912422 0 0 0-21.912422-21.912423H106.824978a21.912422 21.912422 0 0 0-21.912422 21.912423V548.827621a21.912422 21.912422 0 0 0 21.912422 21.912422h111.865987V636.426112H106.824978A87.598492 87.598492 0 0 1 19.175289 548.827621v-589.229129A87.598492 87.598492 0 0 1 106.824978-128h810.350044a87.598492 87.598492 0 0 1 87.649689 87.598492V548.827621a87.598492 87.598492 0 0 1-87.649689 87.598491zM284.633021 640.265906a32.766239 32.766239 0 0 1 46.435904 0l137.618203 137.618203v-585.338138h68.450721V786.946022l146.680116-146.680116a32.817436 32.817436 0 1 1 46.435904 46.435904l-199.669268 199.669268a32.868633 32.868633 0 0 1-46.487101 0l-199.669268-199.669268a32.766239 32.766239 0 0 1 0.204789-46.435904z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="visible" unicode="&#59004;" d="M1008.9472 433.3056q-224.4096 332.8-496.9472 332.8Q244.5312 765.9008 23.3984 445.44l-8.3456-12.1344-3.328-5.12a88.2688 88.2688 0 0 1 3.328-93.2352q224.4096-332.8 496.9472-332.8 267.52 0 488.6016 320.4096l8.3456 12.1856 3.328 5.12a88.2688 88.2688 0 0 1-3.328 93.44z m-58.4704-56.8832l-1.5872-2.56-7.3728-10.752c-68.0448-98.56-139.6736-172.9024-212.9408-220.9792-70.144-46.08-141.0048-68.352-216.576-68.352-76.8 0-149.1968 23.2448-220.6208 71.0656-74.7008 49.7152-147.6608 127.3344-216.8832 229.9392a16.5888 16.5888 0 0 0-0.9728 16.7936l1.5872 2.56 7.424 10.8032C150.528 503.5008 222.1568 577.8432 295.424 625.8688c70.144 46.08 141.0048 68.352 216.576 68.352 76.8 0 149.1968-23.2448 220.6208-71.0656 74.7008-49.9712 147.6608-127.3344 216.8832-229.9392a16.5888 16.5888 0 0 0 0.9728-16.7936zM514.4576 571.0848H512a194.816 194.816 0 0 1 0-389.632h5.12a194.816 194.816 0 0 1-2.4064 389.632z m1.536-317.952h-3.1232a123.136 123.136 0 0 0 0 246.272h1.5872a123.136 123.136 0 0 0 1.536-246.272z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="wechat" unicode="&#59005;" d="M559.4112 391.5776a24.2688 24.2688 0 1 1 23.6544-24.8832v0.6144a24.1664 24.1664 0 0 1-23.6544 24.2688zM355.9424 540.2624a28.672 28.672 0 1 1 28.3648-28.9792v0.3072a28.4672 28.4672 0 0 1-28.3648 28.672zM496.64 482.56a28.672 28.672 0 1 1-28.3136 28.9792v-0.3072a28.5184 28.5184 0 0 1 28.3136-28.672zM686.6432 390.4H686.08a24.0128 24.0128 0 1 1 0.8192 0zM512 896a512 512 0 1 1 512-512A512 512 0 0 1 512 896zM430.08 276.48a242.8416 242.8416 0 0 0-64.768 8.6528l-3.4304 1.024-74.24-37.6832L307.2 310.8352l-1.8432 1.1776C256.4608 343.5008 225.28 392.7552 225.28 448.1024 225.28 542.72 316.8256 619.52 430.08 619.52c102.4 0 187.392-63.0272 202.5984-145.152h-8.6528c-102.4 0.3072-186.624-69.888-186.624-156.3136a133.4784 133.4784 0 0 1 6.5536-40.96c-4.608 0-9.1648-0.4608-13.7728-0.4608z m300.6976-74.752l-1.6384-1.024 16.7424-52.224-62.5664 32-2.9696-0.8704a202.7008 202.7008 0 0 0-55.1424-7.3216c-95.6416 0-173.312 64.8192-173.312 144.7424s77.6192 144.7936 173.312 144.7936S798.72 397.0048 798.72 317.0304c0-46.848-26.7776-88.5248-68.0448-115.0464z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="unvisible" unicode="&#59006;" d="M319.6416 364.7488A192.9216 192.9216 0 0 1 329.1136 302.08l62.208 62.208a122.88 122.88 0 0 0 120.9856 120.9856L574.5152 547.84a193.8432 193.8432 0 0 1-60.0576 9.5232H512a194.56 194.56 0 0 1-192.3584-192.6144zM515.9936 239.2064h-4.3008L450.56 178.2272a193.9968 193.9968 0 0 1 61.44-10.7008h5.12a194.56 194.56 0 0 1 181.6576 258.5088l-61.2352-60.9792v-1.1776a123.1872 123.1872 0 0 0-121.5488-124.672zM1008.9472 419.3792a1069.2608 1069.2608 0 0 1-143.36 173.7728l-50.7392-50.7392a996.6592 996.6592 0 0 0 134.6048-163.1232 16.5888 16.5888 0 0 0 0.9728-16.7936l-1.5872-2.56-7.3728-10.752c-67.9936-98.56-139.6224-172.9536-212.8896-221.184-70.144-46.08-141.0048-68.352-216.576-68.352a367.0528 367.0528 0 0 0-148.48 31.2832l-53.76-53.6576a445.44 445.44 0 0 1 202.24-49.1008q267.52 0 488.6016 320.4096l8.3456 12.1856 3.328 5.12a88.3712 88.3712 0 0 1-3.328 93.4912zM166.3488 139.4688l50.7392 50.7392c-48.7936 45.312-96.512 102.4-142.592 170.6496a16.5888 16.5888 0 0 0-0.9728 16.7936l1.5872 2.56 7.424 10.8032C150.528 489.5744 222.1568 563.8656 295.424 611.8912c70.144 46.08 141.0048 68.4032 216.576 68.4032a369.152 369.152 0 0 0 159.0784-35.84l53.4016 53.1456A447.5392 447.5392 0 0 1 512 751.9744q-267.4688 0-488.6016-320.4096l-8.3456-12.1856-3.328-5.12a88.2688 88.2688 0 0 1 3.328-93.2352q73.1136-108.5952 151.296-181.5552zM110.73536 14.29504l763.83232 763.0336 50.65728-50.7136-763.8272-763.0336z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="clock-fill" unicode="&#59007;" d="M512 896a512 512 0 1 1 512-512A512.5632 512.5632 0 0 1 512 896z m182.8352-585.1648H475.4432a36.5056 36.5056 0 0 0-36.608 36.608V640A36.608 36.608 0 1 0 512 640v-256h182.8352a36.608 36.608 0 1 0 0-73.1648z"  horiz-adv-x="1024" />
+
+    
+    <glyph glyph-name="siet" unicode="&#59008;" d="M956.816796 321.270082l-15.356161 8.804199a421.782554 421.782554 0 0 1 1.586803 103.756461l21.601 12.438491 5.11872 3.020045a90.498975 90.498975 0 0 1 28.255336 120.801799L917.402649 709.115521a90.447788 90.447788 0 0 1-123.463534 33.066933l-21.549812-12.336116a422.908673 422.908673 0 0 1-87.837241 49.293277v26.207848A90.447788 90.447788 0 0 1 594.155461 895.744064L433.47883 896h-5.835341A90.447788 90.447788 0 0 1 343.082229 805.347463v-34.500175A417.175706 417.175706 0 0 1 263.025444 721.963509L225.351662 743.71807l-5.11872 2.508173a90.498975 90.498975 0 0 1-119.010248-35.831042L26.028693 579.91902l-2.55936-4.658035a90.550162 90.550162 0 0 1 35.831042-119.010248L102.502374 431.117821a422.140865 422.140865 0 0 1 0-86.608748l-39.15821-22.52237-5.11872-3.020045A90.498975 90.498975 0 0 1 30.84029 198.164859l80.517471-139.024444A90.447788 90.447788 0 0 1 234.565359 25.817546l38.492776 22.164059a427.515521 427.515521 0 0 1 70.84309-42.024694v-43.304374A90.447788 90.447788 0 0 1 434.349013-127.744064l160.676631-0.255936h5.784154a90.498975 90.498975 0 0 1 84.868382 90.447788v35.831042a422.703924 422.703924 0 0 1 84.305324 47.092227l20.884379-12.08018 4.709223-2.508173a90.447788 90.447788 0 0 1 118.95906 35.831043l75.449937 130.680929 2.508173 4.658036a90.60135 90.60135 0 0 1-35.67748 119.31737z m-26.105474 188.164159l-2.610547-1.586803-20.782005-11.977805-40.43789-23.341365 5.11872-46.426793a348.072982 348.072982 0 0 0-1.330867-86.045689l-6.807898-48.064784 41.768758-24.16036 15.356161-8.906573a18.888078 18.888078 0 0 0 7.67808-24.262734l-1.330867-2.456986L852.446088 102.59835a18.683329 18.683329 0 0 0-16.379905-9.418445 17.966708 17.966708 0 0 0-7.780454 1.740365l-2.508173 1.330867-19.860635 11.465934-40.130768 23.187803-37.622594-27.078031a352.731017 352.731017 0 0 0-70.024094-39.055836l-44.123369-18.376206v-83.793451a18.939265 18.939265 0 0 0-16.994151-18.785704h-3.020045L434.502574-56.08198a18.836891 18.836891 0 0 0-18.83689 18.836891v88.707423l-40.949763 19.297576a356.570057 356.570057 0 0 0-58.967658 35.012047L277.767358 133.310672l-40.43789-23.290177-38.492777-22.112872a18.376206 18.376206 0 0 0-9.316071-2.55936 18.990452 18.990452 0 0 0-16.431092 9.469633l-80.517471 139.280379a18.836891 18.836891 0 0 0 5.11872 24.672232l2.55936 1.586804 38.339216 22.061684 40.693826 23.238991-5.11872 46.375606a352.32152 352.32152 0 0 0 0 71.969207l4.606848 46.068483L138.333417 493.156711l-43.56031 25.184104A18.836891 18.836891 0 0 0 87.146213 542.501175l1.279681 2.405798 75.091627 129.861935a18.734516 18.734516 0 0 0 16.379905 9.418445 18.47858 18.47858 0 0 0 7.729267-1.689178l2.456986-1.330867 37.110722-21.396251 41.819945-24.16036 38.236841 29.688578a348.072982 348.072982 0 0 0 66.287428 40.949763l40.949763 19.39995V805.449838A18.836891 18.836891 0 0 0 431.431342 824.337916h3.12242l159.448138-0.255936a18.888078 18.888078 0 0 0 18.83689-18.888078V731.27958l44.072182-18.325019a354.420195 354.420195 0 0 0 73.044139-40.949762l37.980905-27.487528 40.335516 23.187803 21.549813 12.387303a18.325019 18.325019 0 0 0 9.316071 2.508173 18.990452 18.990452 0 0 0 16.431092-9.367258l80.517471-139.075631a18.939265 18.939265 0 0 0-5.374657-24.72342zM613.504224 545.572407a180.690827 180.690827 0 0 1-247.029443-66.031492 181.049138 181.049138 0 1 1 313.316871-181.509823 181.305074 181.305074 0 0 1-66.287428 247.541315z m4.197351-211.710273a109.387053 109.387053 0 0 0-189.392652 109.847739 108.977556 108.977556 0 0 0 146.95846 40.949762l2.098675-1.228493a109.796551 109.796551 0 0 0 40.335517-149.569008z"  horiz-adv-x="1024" />
+
+    
+
+
+  </font>
+</defs></svg>

src/assets/styles/base.css

+*{
+	margin: 0;
+	padding: 0;
+	font-family: PingFangSC-Regular, PingFang SC;
+}
+
+.clearfix:after{
+  content: ""; 
+  display: block; 
+  height: 0; 
+  clear: both; 
+  visibility: hidden;  
+  }
+
+.clearfix {
+  /* 触发 hasLayout */ 
+  zoom: 1; 
+  }
+
+.f-l{
+	float: left;
+}
+.f-r{
+	float: right;
+}
+.txt-r{
+	text-align: right;
+}
\ No newline at end of file

src/assets/styles/quill.core.min.css

+/*!
+ * Quill Editor v2.0.0-dev.2
+ * https://quilljs.com/
+ * Copyright (c) 2014, Jason Chen
+ * Copyright (c) 2013, salesforce.com
+ */
+.ql-container {
+  box-sizing: border-box;
+  font-family: Helvetica, Arial, sans-serif;
+  font-size: 13px;
+  height: 100%;
+  margin: 0;
+  position: relative
+}
+
+.ql-container.ql-disabled .ql-tooltip {
+  visibility: hidden
+}
+
+.ql-container.ql-disabled .ql-editor li[data-list=checked]:before, .ql-container.ql-disabled .ql-editor li[data-list=unchecked]:before {
+  pointer-events: none
+}
+
+.ql-clipboard {
+  left: -100000px;
+  height: 1px;
+  overflow-y: hidden;
+  position: absolute;
+  top: 50%
+}
+
+.ql-clipboard p {
+  margin: 0;
+  padding: 0
+}
+
+.ql-editor {
+  box-sizing: border-box;
+  counter-reset: list-0;
+  line-height: 1.42;
+  height: 100%;
+  outline: 0;
+  overflow-y: auto;
+  /*padding: 12px 15px;*/
+  tab-size: 4;
+  -moz-tab-size: 4;
+  text-align: left;
+  white-space: pre-wrap;
+  word-wrap: break-word
+}
+
+.ql-editor > div {
+  cursor: text
+}
+
+.ql-editor blockquote, .ql-editor h1, .ql-editor h2, .ql-editor h3, .ql-editor h4, .ql-editor h5, .ql-editor h6, .ql-editor ol, .ql-editor p, .ql-editor pre {
+  margin: 0;
+  padding: 0
+}
+
+.ql-editor h1, .ql-editor h2, .ql-editor h3, .ql-editor h4, .ql-editor h5, .ql-editor h6, .ql-editor p {
+  counter-reset: list-0 list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9
+}
+
+.ql-editor table {
+  border-collapse: collapse
+}
+
+.ql-editor td, .ql-editor tr {
+  border: 1px solid #000
+}
+
+.ql-editor td {
+  padding: 2px 5px
+}
+
+.ql-editor ol {
+  padding-left: 1.5em
+}
+
+.ql-editor li {
+  list-style-type: none;
+  padding-left: 1.5em
+}
+
+.ql-editor li:before {
+  display: inline-block;
+  margin-left: -1.5em;
+  margin-right: .3em;
+  text-align: right;
+  white-space: nowrap;
+  width: 1.2em
+}
+
+.ql-editor li[data-list=checked], .ql-editor li[data-list=unchecked] {
+  pointer-events: none
+}
+
+.ql-editor li[data-list=checked] div, .ql-editor li[data-list=unchecked] div {
+  pointer-events: all
+}
+
+.ql-editor li[data-list=checked]:before, .ql-editor li[data-list=unchecked]:before {
+  color: #777;
+  cursor: pointer;
+  pointer-events: all
+}
+
+.ql-editor li[data-list=bullet]:before {
+  content: '\2022'
+}
+
+.ql-editor li[data-list=checked]:before {
+  content: '\2611'
+}
+
+.ql-editor li[data-list=unchecked]:before {
+  content: '\2610'
+}
+
+.ql-editor li[data-list=ordered] {
+  counter-reset: list-1 list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9;
+  counter-increment: list-0
+}
+
+.ql-editor li[data-list=ordered]:before {
+  content: counter(list-0, decimal) '. '
+}
+
+.ql-editor li[data-list=ordered].ql-indent-1 {
+  counter-increment: list-1
+}
+
+.ql-editor li[data-list=ordered].ql-indent-1:before {
+  content: counter(list-1, lower-alpha) '. '
+}
+
+.ql-editor li[data-list=ordered].ql-indent-1 {
+  counter-reset: list-2 list-3 list-4 list-5 list-6 list-7 list-8 list-9
+}
+
+.ql-editor li[data-list=ordered].ql-indent-2 {
+  counter-increment: list-2
+}
+
+.ql-editor li[data-list=ordered].ql-indent-2:before {
+  content: counter(list-2, lower-roman) '. '
+}
+
+.ql-editor li[data-list=ordered].ql-indent-2 {
+  counter-reset: list-3 list-4 list-5 list-6 list-7 list-8 list-9
+}
+
+.ql-editor li[data-list=ordered].ql-indent-3 {
+  counter-increment: list-3
+}
+
+.ql-editor li[data-list=ordered].ql-indent-3:before {
+  content: counter(list-3, decimal) '. '
+}
+
+.ql-editor li[data-list=ordered].ql-indent-3 {
+  counter-reset: list-4 list-5 list-6 list-7 list-8 list-9
+}
+
+.ql-editor li[data-list=ordered].ql-indent-4 {
+  counter-increment: list-4
+}
+
+.ql-editor li[data-list=ordered].ql-indent-4:before {
+  content: counter(list-4, lower-alpha) '. '
+}
+
+.ql-editor li[data-list=ordered].ql-indent-4 {
+  counter-reset: list-5 list-6 list-7 list-8 list-9
+}
+
+.ql-editor li[data-list=ordered].ql-indent-5 {
+  counter-increment: list-5
+}
+
+.ql-editor li[data-list=ordered].ql-indent-5:before {
+  content: counter(list-5, lower-roman) '. '
+}
+
+.ql-editor li[data-list=ordered].ql-indent-5 {
+  counter-reset: list-6 list-7 list-8 list-9
+}
+
+.ql-editor li[data-list=ordered].ql-indent-6 {
+  counter-increment: list-6
+}
+
+.ql-editor li[data-list=ordered].ql-indent-6:before {
+  content: counter(list-6, decimal) '. '
+}
+
+.ql-editor li[data-list=ordered].ql-indent-6 {
+  counter-reset: list-7 list-8 list-9
+}
+
+.ql-editor li[data-list=ordered].ql-indent-7 {
+  counter-increment: list-7
+}
+
+.ql-editor li[data-list=ordered].ql-indent-7:before {
+  content: counter(list-7, lower-alpha) '. '
+}
+
+.ql-editor li[data-list=ordered].ql-indent-7 {
+  counter-reset: list-8 list-9
+}
+
+.ql-editor li[data-list=ordered].ql-indent-8 {
+  counter-increment: list-8
+}
+
+.ql-editor li[data-list=ordered].ql-indent-8:before {
+  content: counter(list-8, lower-roman) '. '
+}
+
+.ql-editor li[data-list=ordered].ql-indent-8 {
+  counter-reset: list-9
+}
+
+.ql-editor li[data-list=ordered].ql-indent-9 {
+  counter-increment: list-9
+}
+
+.ql-editor li[data-list=ordered].ql-indent-9:before {
+  content: counter(list-9, decimal) '. '
+}
+
+.ql-editor .ql-indent-1:not(.ql-direction-rtl) {
+  padding-left: 3em
+}
+
+.ql-editor li.ql-indent-1:not(.ql-direction-rtl) {
+  padding-left: 4.5em
+}
+
+.ql-editor .ql-indent-1.ql-direction-rtl.ql-align-right {
+  padding-right: 3em
+}
+
+.ql-editor li.ql-indent-1.ql-direction-rtl.ql-align-right {
+  padding-right: 4.5em
+}
+
+.ql-editor .ql-indent-2:not(.ql-direction-rtl) {
+  padding-left: 6em
+}
+
+.ql-editor li.ql-indent-2:not(.ql-direction-rtl) {
+  padding-left: 7.5em
+}
+
+.ql-editor .ql-indent-2.ql-direction-rtl.ql-align-right {
+  padding-right: 6em
+}
+
+.ql-editor li.ql-indent-2.ql-direction-rtl.ql-align-right {
+  padding-right: 7.5em
+}
+
+.ql-editor .ql-indent-3:not(.ql-direction-rtl) {
+  padding-left: 9em
+}
+
+.ql-editor li.ql-indent-3:not(.ql-direction-rtl) {
+  padding-left: 10.5em
+}
+
+.ql-editor .ql-indent-3.ql-direction-rtl.ql-align-right {
+  padding-right: 9em
+}
+
+.ql-editor li.ql-indent-3.ql-direction-rtl.ql-align-right {
+  padding-right: 10.5em
+}
+
+.ql-editor .ql-indent-4:not(.ql-direction-rtl) {
+  padding-left: 12em
+}
+
+.ql-editor li.ql-indent-4:not(.ql-direction-rtl) {
+  padding-left: 13.5em
+}
+
+.ql-editor .ql-indent-4.ql-direction-rtl.ql-align-right {
+  padding-right: 12em
+}
+
+.ql-editor li.ql-indent-4.ql-direction-rtl.ql-align-right {
+  padding-right: 13.5em
+}
+
+.ql-editor .ql-indent-5:not(.ql-direction-rtl) {
+  padding-left: 15em
+}
+
+.ql-editor li.ql-indent-5:not(.ql-direction-rtl) {
+  padding-left: 16.5em
+}
+
+.ql-editor .ql-indent-5.ql-direction-rtl.ql-align-right {
+  padding-right: 15em
+}
+
+.ql-editor li.ql-indent-5.ql-direction-rtl.ql-align-right {
+  padding-right: 16.5em
+}
+
+.ql-editor .ql-indent-6:not(.ql-direction-rtl) {
+  padding-left: 18em
+}
+
+.ql-editor li.ql-indent-6:not(.ql-direction-rtl) {
+  padding-left: 19.5em
+}
+
+.ql-editor .ql-indent-6.ql-direction-rtl.ql-align-right {
+  padding-right: 18em
+}
+
+.ql-editor li.ql-indent-6.ql-direction-rtl.ql-align-right {
+  padding-right: 19.5em
+}
+
+.ql-editor .ql-indent-7:not(.ql-direction-rtl) {
+  padding-left: 21em
+}
+
+.ql-editor li.ql-indent-7:not(.ql-direction-rtl) {
+  padding-left: 22.5em
+}
+
+.ql-editor .ql-indent-7.ql-direction-rtl.ql-align-right {
+  padding-right: 21em
+}
+
+.ql-editor li.ql-indent-7.ql-direction-rtl.ql-align-right {
+  padding-right: 22.5em
+}
+
+.ql-editor .ql-indent-8:not(.ql-direction-rtl) {
+  padding-left: 24em
+}
+
+.ql-editor li.ql-indent-8:not(.ql-direction-rtl) {
+  padding-left: 25.5em
+}
+
+.ql-editor .ql-indent-8.ql-direction-rtl.ql-align-right {
+  padding-right: 24em
+}
+
+.ql-editor li.ql-indent-8.ql-direction-rtl.ql-align-right {
+  padding-right: 25.5em
+}
+
+.ql-editor .ql-indent-9:not(.ql-direction-rtl) {
+  padding-left: 27em
+}
+
+.ql-editor li.ql-indent-9:not(.ql-direction-rtl) {
+  padding-left: 28.5em
+}
+
+.ql-editor .ql-indent-9.ql-direction-rtl.ql-align-right {
+  padding-right: 27em
+}
+
+.ql-editor li.ql-indent-9.ql-direction-rtl.ql-align-right {
+  padding-right: 28.5em
+}
+
+.ql-editor li.ql-direction-rtl {
+  padding-right: 1.5em
+}
+
+.ql-editor li.ql-direction-rtl:before {
+  margin-left: .3em;
+  margin-right: -1.5em;
+  text-align: left
+}
+
+.ql-editor table {
+  table-layout: fixed;
+  width: 100%
+}
+
+.ql-editor table td {
+  outline: 0
+}
+
+.ql-editor .ql-code-block-container {
+  font-family: monospace
+}
+
+.ql-editor .ql-video {
+  display: block;
+  max-width: 100%
+}
+
+.ql-editor .ql-video.ql-align-center {
+  margin: 0 auto
+}
+
+.ql-editor .ql-video.ql-align-right {
+  margin: 0 0 0 auto
+}
+
+.ql-editor .ql-bg-black {
+  background-color: #000
+}
+
+.ql-editor .ql-bg-red {
+  background-color: #e60000
+}
+
+.ql-editor .ql-bg-orange {
+  background-color: #f90
+}
+
+.ql-editor .ql-bg-yellow {
+  background-color: #ff0
+}
+
+.ql-editor .ql-bg-green {
+  background-color: #008a00
+}
+
+.ql-editor .ql-bg-blue {
+  background-color: #06c
+}
+
+.ql-editor .ql-bg-purple {
+  background-color: #93f
+}
+
+.ql-editor .ql-color-white {
+  color: #fff
+}
+
+.ql-editor .ql-color-red {
+  color: #e60000
+}
+
+.ql-editor .ql-color-orange {
+  color: #f90
+}
+
+.ql-editor .ql-color-yellow {
+  color: #ff0
+}
+
+.ql-editor .ql-color-green {
+  color: #008a00
+}
+
+.ql-editor .ql-color-blue {
+  color: #06c
+}
+
+.ql-editor .ql-color-purple {
+  color: #93f
+}
+
+.ql-editor .ql-font-serif {
+  font-family: Georgia, Times New Roman, serif
+}
+
+.ql-editor .ql-font-monospace {
+  font-family: Monaco, Courier New, monospace
+}
+
+.ql-editor .ql-size-small {
+  font-size: .75em
+}
+
+.ql-editor .ql-size-large {
+  font-size: 1.5em
+}
+
+.ql-editor .ql-size-huge {
+  font-size: 2.5em
+}
+
+.ql-editor .ql-direction-rtl {
+  direction: rtl;
+  text-align: inherit
+}
+
+.ql-editor .ql-align-center {
+  text-align: center
+}
+
+.ql-editor .ql-align-justify {
+  text-align: justify
+}
+
+.ql-editor .ql-align-right {
+  text-align: right
+}
+
+.ql-editor.ql-blank::before {
+  color: rgba(0, 0, 0, .6);
+  content: attr(data-placeholder);
+  font-style: italic;
+  left: 15px;
+  pointer-events: none;
+  position: absolute;
+  right: 15px
+}
+
+/*# sourceMappingURL=quill.core.min.css.map */

src/assets/styles/variables.scss

+// 用于配置常用的 CSS 变量
+
+//主要颜色
+$primary-color:#F7AC30;
+//二级颜色
+$secondary-color:#32CBBC;
+//三级颜色
+$tertiary-color:'#FFFFFF';
+
+//主要文字颜色
+$primary-text-color:#141414;
+//二级文字颜色
+$secondary-text-color:#666666;
+//三级文字颜色
+$tertiary-text-color:#454649;
+
+//主要按钮颜色
+$primary-button-color:$primary-color;
+//二级按钮颜色
+$secondary-button-color:$secondary-color;
+//三级按钮颜色
+$tertiary-button-color: $tertiary-color;
+
+//不可点击时按钮颜色
+$button-disabled-color:#999999;
+
+//容器背景颜色
+$background-color:#f5f5f5;
+//placeholder颜色
+$placeholder-color:#e5e5e5;
+//border颜色
+$border-color:#e5e5e5;
+
+// UI 字体
+, 
+$font-family: 'PingFangSC-Regular', 'PingFang SC';
\ No newline at end of file

src/components/btn-code.vue

+<template>
+  <div >
+    <div v-if="!countdown" class="btn-primary btn" @click="getCaptcha">获取验证码</div>
+    <div v-else class="btn-disable btn">{{ countdown }}</div>
+  </div>
+</template>
+
+<script>
+  import { getCaptcha, getPartnerCaptcha } from '@/api/login'
+  export default {
+    name: 'btn-code',
+    data() {
+      return {
+        countdown: 0,
+      };
+    },
+    props: {
+      phone: {
+        type: String,
+        default: '',
+      },
+      type: {
+        type: String,
+        default: '',
+      },
+    },
+    watch: {
+      countdown(val) {
+        if (val > 0) {
+          setTimeout(() => {
+            this.countdown--
+          }, 1000)
+        }
+      },
+    },
+    methods: {
+      getCaptcha() {
+        if (!this.throttleAction) return
+
+        if (!this.phone) {
+          wx.showToast({title: '请输入手机号', icon: 'none', duration: 3000})
+          return
+        }
+
+        this.countdown = 60
+
+        if (this.type==='applyPartner') {
+          this.network().getPartnerCaptcha()
+        } else {
+          this.network().getCaptcha()
+        }
+
+      },
+      network() {
+        return {
+          getCaptcha: async () => {
+            const { data } = await getCaptcha({ phone:this.phone })
+            console.log('获取验证码', data)
+          },
+          getPartnerCaptcha: async () => {
+            const { data } = await getPartnerCaptcha({ phone:this.phone })
+            console.log('获取验证码(申请合伙人)', data)
+          },
+        };
+      },
+      handler() {
+        return {
+          example: () => {
+            console.log('handle');
+          },
+        };
+      },
+    },
+  };
+</script>
+
+<style lang="scss" scoped>
+  .container {
+
+  }
+  .btn {
+    width: 200rpx;
+    height: 80rpx;
+    font-size: 28rpx;
+    color: #0077ff;
+    border-radius: 0 40rpx 40rpx 0;
+    background: #fff;
+  }
+  .btn::after {
+    position: absolute;
+    top: 22rpx;
+    left: 0;
+    width:30rpx;
+    height:1rpx;
+    // background:#000;
+    content:'|';
+    // top:25px;
+  }
+</style>

src/components/custom-header/custom-header.vue

+<template>
+    <view class="custom-header-container" :style="containerStyle">
+		<view class="custom-header-status-bar" :style="{height:getStausBarHeight}"></view>
+		<view class="custom-header-top-container" :style="headerStyle">
+			<view :class="backBtnClass" style="height: 44px;width: 38px;margin: 0;padding: 0;border-radius: 0 !important;display: flex;align-items: center;justify-content: center;" 
+			v-if="showBack" @tap="backTap"></view>
+			<view class="custom-header-title" :style="titleStyle">
+				{{title}}
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+    export default {
+        props: {
+            /**
+             * 导航文字
+             */
+            title: String,
+            /**
+             * 顶部导航容器样式字符串
+             */
+            containerStyle: String,
+            /**
+             * 标题导航样式字符串
+             */
+            headerStyle: String,
+            /**
+             * 左侧返回按钮样式类
+             */
+            backBtnClass: String,
+			/**
+			 * 标题样式字符串
+			 */
+            titleStyle: String,
+			/**
+			 * 是否显示返回
+			 */
+			showBack: Boolean
+        },
+        computed: {
+            getStausBarHeight(){
+            	try {
+            		const res = uni.getSystemInfoSync();
+            		return res.statusBarHeight + 'px';
+            	} catch (e) {
+            	}
+            }
+        },
+        methods: {
+            backTap(e) {
+                this.$emit('backTap')
+            }
+        }
+    }
+</script>
+
+<style>
+	.custom-header-top-container{
+		display: flex;
+		flex-flow: row nowrap;
+		justify-content: flex-start;
+		width: 100%;
+	}
+	.custom-header-back-btn{
+		height: 44px;
+		width: 38px;
+		margin: 0;
+		padding: 0;
+		border-radius: 0 !important;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+	}
+	.custom-header-container{
+		z-index: 1;
+		width: 750upx;
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+		position: sticky;
+		top: 0;
+	}
+	.custom-header-status-bar{
+		width: 100%;
+		top: 0;
+		position: sticky;
+		z-index: 100;
+	}
+	.custom-header-title{
+		height: 44px;
+		align-self: flex-start;
+		margin-left: 30upx;
+		line-height: 44px;
+		font-size: 15px;
+	}
+</style>

src/components/dankal-count-control.vue

+<template>
+  <div class="count-control">
+    <div class="btn cut" @click="addValue(-1)"/>
+    <div class="val">{{ value }}</div>
+    <div class="btn add" @click="addValue(1)"/>
+  </div>
+</template>
+
+<script>
+  export default {
+    data() {
+      return {};
+    },
+    props: {
+      value: {
+        type: Number,
+        required: true,
+      },
+    },
+    mounted() {
+    },
+    methods: {
+      addValue(addVal) {
+        if (this.value <= 1 && addVal < 0) return
+        this.$emit('input', this.value + addVal);
+      },
+      network() {
+        return {
+          example: async () => {
+            console.log('network');
+          },
+        };
+      },
+      handler() {
+        return {
+          example: () => {
+            console.log('handle');
+          },
+        };
+      },
+    },
+  };
+</script>
+
+<style lang="scss" scoped>
+  .count-control{
+    display: flex;
+    align-items: center;
+    .val{
+      font-size: 32rpx;
+      margin: 0 24rpx;
+    }
+    .btn{
+      width: 56rpx;
+      height: 44rpx;
+      background-size: 100% 100% !important;
+      &.cut{background:url("https://qiniu.fenglou.runworld.com.cn/static-image/ic_cut.png") ;}
+      &.add{background:url("https://qiniu.fenglou.runworld.com.cn/static-image/ic_add.png") ;}
+    }
+  }
+</style>

src/components/dankal-image-upload.vue

+<template>
+  <div class="container">
+    <div class="item" v-for="(item,index) in value" :key="index" >
+      <img class="img" :src="imgDomain + item" mode="aspectFill" @click="openImage(value,index)">
+      <div class="tips" @click="delImage(index)">删除</div>
+    </div>
+    <div class="item">
+      <div class="add" @click="addImage()">
+        <img class="ic" src="https://qiniu.mctower.runworld.com.cn/static-image/ic_repair_camera.png" mode="widthFix">
+        <div>点击添加</div>
+        <div class="tex">{{text?text:'最多可添加'+limit+'张'}}</div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+  // import { getQiniu } from '@/api/api'
+
+  export default {
+    name: 'ImageUpload',
+
+    data() {
+      return {
+        token: '',
+        valueShow: [],
+      };
+    },
+
+    created() {
+      // this.network().getQiniu()
+    },
+
+    props: {
+      value: {
+        type: Array,
+        required: true,
+      },
+      limit: {
+        type: Number,
+        default: 9,
+      },
+      text: {
+        type: String,
+        default: '',
+      },
+    },
+
+    watch: {
+      value(val) {
+        console.log('value', val) // 勿删
+        const valueShow = []
+        val.forEach((item) => { valueShow.push(this.imgDomain + item) })
+        this.valueShow = valueShow
+
+        this.$emit('input', this.value)
+      },
+    },
+
+    computed: {
+    },
+
+    methods: {
+      addImage() {
+        uni.chooseImage({
+          count: 1,
+          sizeType: ['original', 'compressed'],
+          sourceType: ['album', 'camera'],
+          success: (res) => {
+            const filePath = res.tempFiles[0].path;
+            const filename = filePath.substr(filePath.lastIndexOf('/') + 1);
+            uni.showLoading({ title: 'Loading...', mask: true });
+            uni.uploadFile({
+              filePath,
+              url: 'https://upload-z2.qiniup.com',
+              name: 'file',
+              header: { 'Content-Type': 'multipart/form-data' },
+              formData: {
+                token: this.token,
+                file: filename,
+              },
+              success: (res1) => {
+                console.log('图片上传到七牛', res1)
+                const data = JSON.parse(res1.data)
+                if (!data || !data.key) return
+                this.value.push(data.key)
+                uni.hideLoading();
+              },
+              fail(res1) {
+                console.log(res1)
+                uni.hideLoading();
+              },
+            })
+          },
+        })
+      },
+
+      delImage(index) {
+        this.value.splice(index, 1);
+      },
+
+      network() {
+        return {
+          getQiniu: async () => {
+            // const { data } = await getQiniu()
+            // console.log('获取七牛信息', data);
+            // this.token = data.token
+            // this.imgDomain = data.url
+          },
+        };
+      },
+    },
+  };
+</script>
+
+<style lang="scss" scoped>
+  .container{
+    display: flex;
+    justify-content: space-between;
+    text-align: center;
+    flex-wrap: wrap;
+    .item{
+      margin-top: 20rpx;
+      width: 330rpx;
+      border-radius: 20rpx;
+      background: #FFFFFF;
+      .img,.add{
+        width: 100%;
+        height: 330rpx;
+        vertical-align: middle;
+      }
+      .add{
+        padding-top: 100rpx;
+        color: #ABB2B7;
+        .ic{
+          width: 70rpx;
+          height: 70rpx;
+          margin-bottom: 30rpx;
+        }
+        .tex{
+          font-size: 24rpx;
+          margin-top: 8rpx;
+        }
+      }
+      .tips{
+        width: 100%;
+        line-height: 72rpx;
+        color: #ABB2B7;
+        font-size: 24rpx;
+        box-shadow:0rpx -6rpx 24rpx 0rpx rgba(0,0,0,0.07);
+      }
+    }
+  }
+</style>

src/components/dankal-modal.vue

+<template>
+  <transition name="router-fade">
+    <section
+      class="dankal-modal"
+      v-if="value">
+      <div
+        class="modal-shadows"
+        @touchmove.stop="touchmoveHandler"
+        @click="handlerModalClose()"
+        @catchtouchmove="touchmoveHandler"/>
+      <div
+        class="modal-content"
+        :class="direction"
+        :style="'background:'+background+';border-radius:'+borderRadius"
+        v-if="value">
+        <div
+          class="modal-close"
+          @click="handlerModalClose(true)"
+          v-if="buttonCloseAble"/>
+        <div
+          class="modal-title"
+          v-if="title">{{ title }}</div>
+        <slot name="content"/>
+        <div
+          class="modal-close2"
+          @click="handlerModalClose(true)"
+          v-if="button2CloseAble"/>
+      </div>
+    </section>
+  </transition>
+</template>
+
+<script>
+export default {
+  props: {
+    value: {
+      type: Boolean,
+      required: true,
+    },
+    cornerCloseAble: {
+      type: Boolean,
+      default: true,
+    },
+    buttonCloseAble: {
+      type: Boolean,
+      default: false,
+    },
+    button2CloseAble: {
+      type: Boolean,
+      default: false,
+    },
+    direction: {
+      type: String,
+      default: 'center',
+    },
+    background: {
+      type: String,
+      default: '#FFFFFF',
+    },
+    borderRadius: {
+      type: String,
+      default: '0',
+    },
+    title: {
+      type: String,
+      default: '',
+    },
+  },
+
+  methods: {
+    touchmoveHandler() {
+    },
+    handlerModalClose(isButton) {
+      if (!this.cornerCloseAble && !isButton) return
+      this.$emit('input', false);
+    },
+  },
+};
+</script>
+
+<style lang="scss" >
+  @import '~@/assets/styles/mixins.scss';
+  .dankal-modal {
+    @include pos-box(fixed,0,auto,auto,0);
+    z-index: 999;
+    width: 100%;
+    height: 100%;
+    .modal-shadows {
+      width: 100%;
+      height: 100%;
+      background: rgba(0, 0, 0, 0.5);
+    }
+
+    .modal-content {
+      position: absolute;
+      &.center{
+        top: 50%;
+        left: 50%;
+        transform: translate(-50%, -50%);
+      }
+      &.left{
+        left: 0;
+        top: 50%;
+        transform: translateY(-50%);
+      }
+      &.right{
+        right: 0;
+        top: 50%;
+        transform: translateY(-50%);
+      }
+      &.top{
+        top: 0;
+        left: 50%;
+        transform: translateX(-50%);
+      }
+      &.bottom{
+        bottom: 0;
+        left: 50%;
+        transform: translateX(-50%);
+      }
+      .modal-close {
+         @include pos-box(absolute, 0, 0, auto, auto);
+         width: 100rpx;
+         height: 100rpx;
+         background: url('https://qiniu.mctower.runworld.com.cn/static-image/ic_home_mall_order_close.png') no-repeat center;
+         background-size: 25rpx 25rpx;
+       }
+      .modal-close2 {
+        width: 80rpx;
+        height: 80rpx;
+        background: url('https://qiniu.mctower.runworld.com.cn/static-image/ic_pass_close.png') no-repeat center;
+        background-size: 100% 100%;
+        margin: 60rpx auto;
+      }
+      .modal-title{
+        font-size: 36rpx;
+        padding: 52rpx 0;
+        text-align: center;
+        font-weight: bolder;
+        color: #2D506B;
+      }
+    }
+  }
+</style>

src/components/dankal-search-box.vue

+<template>
+  <div class="searchTop">
+    <div class="searchInp">
+      <img
+              class="search-img"
+              src="https://cdn.tuanhaoke.cn/assets/images/ic_home_search_search.png">
+      <input
+              type="text"
+              :placeholder="placeHolder"
+              class="search-inp"
+              v-model="value">
+      <img
+              class="search-del"
+              v-if="value"
+              @click="clearSearchVal"
+              src="https://cdn.tuanhaoke.cn/assets/images/ic_home_search_close.png">
+    </div>
+    <span
+            class="searchText"
+            @click="getSearchVal">搜索</span>
+  </div>
+</template>
+
+<script>
+
+  export default {
+    data() {
+      return {
+        searchVal: '',
+      };
+    },
+    props: {
+      value: {
+        type: String,
+        default: '',
+      },
+      placeHolder: {
+        type: String,
+        default: '请输入搜索关键词',
+      },
+    },
+    created() {
+      this.searchVal = this.defaultSearchVal || ''
+    },
+    methods: {
+      clearSearchVal() {
+        this.value = ''
+      },
+      getSearchVal() {
+        if (!this.value) {
+          wx.showToast({
+            title: '请输入搜索关键字',
+            icon: 'none',
+            duration: 2000,
+          })
+          return
+        }
+        this.$emit('input', this.value)
+        this.$emit('change', this.value)
+      },
+      network() {
+        return {
+          example: async () => {
+            console.log('network');
+          },
+        };
+      },
+      handler() {
+        return {
+          example: () => {
+            console.log('handle');
+          },
+        };
+      },
+    },
+  };
+</script>
+
+<style lang="scss" scoped>
+  .searchTop{
+    height: 104rpx;
+    min-height: 104r[x];
+    width: 100%;
+    display: flex;
+    align-items: center;
+    padding: 0 30rpx;
+    box-sizing: border-box;
+    justify-content: space-between;
+    background-color: #fff;
+    border-top: 1rpx solid #E5E5E5;
+    // box-shadow:0px 1px 0px 0px rgba(229,229,229,1);
+    .searchInp{
+      flex: 1;
+      height: 64rpx;
+      border-radius: 34rpx;
+      background-color: #f5f5f5;
+      display: flex;
+      align-items: center;
+      padding:0 26rpx;
+      margin-right: 30rpx;
+      .search-img{
+        width: 28rpx;
+        height: 28rpx;
+        margin-right: 10rpx;
+      }
+      .search-inp{
+        flex: 1;
+        background: none;
+      }
+      .search-del{
+        width: 40rpx;
+        height: 40rpx;
+        opacity: 0.8;
+        border-radius: 100%;
+      }
+    }
+    .searchText{
+      color:#141414;
+      font-size: 28rpx;
+    }
+  }
+</style>

src/components/dankal-tab-control.vue

+<template>
+  <div class="tab-control">
+    <div
+      class="item"
+      v-for="(item,index) in options"
+      :key="index"
+      :class="{'on':value==index}"
+      @click="getIndex(index)">
+        {{ item }}
+    </div>
+  </div>
+</template>
+<script>
+export default {
+  data() {
+    return {
+    };
+  },
+  mounted() {
+  },
+  props: {
+    value: {
+      type: Number,
+      default: 0,
+    },
+    options: {
+      type: Array,
+      required: true,
+    },
+  },
+  methods: {
+    getIndex(index) {
+      this.$emit('input', index)
+    },
+    navigateTo(path) {
+      this.$router.push(path);
+    },
+    network() {
+      return {
+        example: async () => {
+          console.log('network');
+        },
+      };
+    },
+    handler() {
+      return {
+        example: () => {
+          console.log('handle');
+        },
+      };
+    },
+  },
+};
+</script>
+<style lang="scss" scoped>
+.tab-control{
+  border-bottom: 1px solid #efefef;
+  display: flex;
+  min-height: 92rpx;
+  height: 92rpx;
+  background: #FFFFFF;
+  .item{
+    height: 92rpx;
+    flex: 1;
+    display: flex;
+    align-items: center;
+    justify-content: space-around;
+    color: #999999;
+    border-bottom: 2rpx solid transparent;
+    &.on{
+      color: #686C71;
+      border-bottom: 2rpx solid #6FC3FF;
+    }
+  }
+}
+</style>

src/components/empty.vue

+<template>
+	<view>
+		<view class="container">
+			<image class="img" :src="imageUrl" mode="aspectFill"></image>
+			<view class="text">
+				{{hint}}
+			</view>
+			<!-- <view class="btn" @tap="clickBtn">
+				{{btnText}}
+			</view> -->
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		name:"empty",
+		props:{
+			hint:{
+				type: String,
+				default: '资源录入成功'
+			},
+			btnText:{
+				type: String,
+				default: '我知道了'
+			},
+			imageUrl:String,
+		},
+		data() {
+			return {
+				
+			};
+		},
+		methods:{
+			clickBtn(){
+				this.$emit('clickBtn')
+			},
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+.container {
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+	}
+
+	.img{
+		width: 458rpx;
+		height: 310rpx;
+		margin-top: 120rpx;
+	}
+	.text{
+		margin-top: 60rpx;
+		font-size: 32rpx;
+		font-family: PingFangSC-Medium, PingFang SC;
+		font-weight: 500;
+		color: #333333;
+	}
+	.btn{
+		width: 200rpx;
+		height: 88rpx;
+		border-radius: 44rpx;
+		border: 2px solid #FF3334;
+		line-height: 88rpx;
+		font-size: 32rpx;
+		font-family: PingFangSC-Regular, PingFang SC;
+		font-weight: 400;
+		color: #FF3334;
+		text-align: center;
+		margin-top: 120rpx;
+		margin: auto;
+	}
+</style>

src/components/jp-timePicker/jp-timePicker.vue

+<template>
+	<view class="date-time-picker" v-if="visible">
+		<view class="date-time-mask" @click.stop="hide"></view>
+		<view class="date-time-container" @click.stop="handleEvent">
+			<view class="time-picker-tool">
+				<view class="cancel-btn" @click.stop="cancel">
+					<text>取消</text>
+				</view>
+				<view class="tool-title">
+					课程时间
+				</view>
+				<view class="confirm-btn" @click.stop="confirm">
+					<text>确定</text>
+				</view>
+			</view>
+			<view class="jp-picker" > 
+			<!-- <view @click="gettype('year')" class="jp-picker-year"  :class="type=='year'?'jp-picker-xzr':''">按年</view> -->
+			<!-- <view @click="gettype('year-month')" class="jp-picker-year-month"  :class="type=='year-month'?'jp-picker-xzr':''">按月</view> -->
+			<!-- <view @click="gettype('date')" class="jp-picker-date"  :class="type=='date'?'jp-picker-xzr':''">按日</view> -->
+			</view>
+			<picker-view class="picker-view" :indicator-style="indicatorStyleString" :value="dateTime" @change="dateTimePickerChange">
+				<picker-view-column data-id='year' v-if='isShowYear'>
+					<view class="item" v-for="(item,index) in years" :key="index" :style="formatDateArrays[0]==item?'{color: #000,fontSize: 34rpx;}':''">{{item}}年</view>
+				</picker-view-column>
+				<picker-view-column data-id='month' v-if='isShowMonth'>
+					<view class="item" v-for="(item,index) in months" :key="index" :style="formatDateArrays[1]==item?'color: #000':''">{{item}}月</view>
+				</picker-view-column>
+				<picker-view-column data-id='day' v-if='isShowDay'>
+					<view class="item" v-for="(item,index) in days" :key="index" :style="formatDateArrays[2]==item?'color: rgb(250,80,80)':''">{{item}}日</view>
+				</picker-view-column>
+			</picker-view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import {
+		getOneMonthDays,
+		getTimeArray,
+		addZero,
+		getIndexOfArray
+	} from './uitls/util.js'
+	export default {
+		name: 'jp-timePicker',
+		props: {
+			startYear: {
+				type: Number,
+				default: 1900
+			},
+			endYear: {
+				type: Number,
+				default: new Date().getFullYear()
+			},
+			datestring: {
+				type: String,
+				default: ''
+			},
+			datestype: {
+				type: String,
+				default: 'year'
+			},
+		},
+		data() {
+			return {
+				formatDateArrays:[],
+				visible: false,
+				dateTime: [],
+				days: [],
+				indicatorStyle:{  height: '40px',color: '#000 !important',fontSize:'34rpx'  },
+				indicatorStyleString: '',
+				type: 'year',
+			}
+		},
+		watch: {
+			datestype(){
+				this.type = this.datestype
+			},
+			indicatorStyle(val){
+				this.getIndicatorStyle();
+			},
+			type() {
+				this.initDateTime()
+			},
+			datestring(){
+				this.initDateTime()
+			}
+		},
+		computed: {
+			years() {
+				return this.initTimeData(this.endYear, this.startYear);
+			},
+			isShowYear() {
+				return this.type !== 'time' && this.type !== 'hour-minute';
+			},
+			months() {
+				return this.initTimeData(12, 1);
+			},
+			isShowMonth() {
+				return this.type !== 'year' && this.type !== 'time' && this.type !== 'hour-minute';
+			},
+			isShowDay() {
+				return this.type === 'date' || this.type === 'datetime' || this.type === 'datetime-all';
+			},
+			hours() {
+				return this.initTimeData(23, 0);
+			},
+			isShowHour() {
+				return this.type !== 'date' && this.type !== 'year-month' && this.type !== 'year';
+			},
+			minutes() {
+				return this.initTimeData(59, 0);
+			},
+			isShowMinute() {
+				return this.type !== 'date' && this.type !== 'year-month' && this.type !== 'year';
+			},
+			seconds() {
+				return this.initTimeData(59, 0);
+			},
+			isShowSecond() {
+				return this.type === 'datetime-all' || this.type === 'time';
+			}
+		},
+		methods: {
+			gettype(type){
+				this.type = type
+				},
+			getIndicatorStyle(){
+				if(this.indicatorStyle){
+					for(let key in this.indicatorStyle){
+						this.indicatorStyleString += `${key}:${this.indicatorStyle[key]};`
+					}
+				}
+			},
+			handleEvent() {
+				return;
+			},
+			cancel() {
+				this.hide();
+			},
+			confirm() {
+				this.formatDate();
+				this.hide();
+			},
+			show() {
+				this.visible = true;
+			},
+			hide() {
+				this.visible = false;
+			},
+			initDateTime() {
+				let value;
+				if (this.datestring.length > 0) {
+					if (this.type === 'year') {
+						value = new Date(this.datestring, 0);
+					} else if (this.type === 'time' || this.type === 'hour-minute') {
+						let date = new Date();
+						let ary = this.datestring.split(':');
+						ary.forEach((item, index) => {
+							if (index == 0) {
+								date.setHours(item)
+							} else if (index == 1) {
+								date.setMinutes(item)
+							} else if (index == 2) {
+								date.setSeconds(item)
+							}
+						})
+						value = date;
+					} else {
+						value = new Date(this.datestring.replace(/-/g, '/'));
+					}
+
+				} else {
+					value = new Date();
+				}
+				let len, timeArray, index;
+				let array = getTimeArray(value);
+				let [year, month, day, hour, minute, second] = array;
+				this.days = this.initTimeData(getOneMonthDays(year, month), 1);
+				let names = ['year', 'month', 'day', 'hour', 'minute', 'second'];
+				switch (this.type) {
+					case "date":
+						len = 3;
+						break;
+					case "year-month":
+						len = 2;
+						break;
+					case "year":
+						len = 1;
+						break;
+					case "datetime":
+						len = 5;
+						break;
+					case "datetime-all":
+						len = 6;
+						break;
+					case "time":
+						len = 3;
+						break;
+					case "hour-minute":
+						len = 2;
+						break;
+				}
+				timeArray = new Array(len).fill(0);
+				if (this.type === 'time' || this.type === 'hour-minute') {
+					names = names.slice(3);
+					array = array.slice(3);
+				}
+				timeArray = timeArray.map((item, index) => {
+					const name = names[index];
+					return getIndexOfArray(array[index], this[name + 's'])
+				})
+				this.dateTime = timeArray;
+				
+				if (this.type === 'date' || this.type === 'year-month' || this.type === 'year') {
+					this.formatDateArrays = this.dateTime.map((item, index) => {
+						return this[names[index] + 's'][item] < 10 ? addZero(this[names[index] + 's'][item]) : this[names[index] + 's'][item];
+					})
+				}
+				console.log(this.formatDateArrays)
+			},
+			initTimeData(end, start) {
+				let timeArray = [];
+				while (start <= end) {
+					timeArray.push(start);
+					start++;
+				}
+				return timeArray;
+			},
+			formatDate() {
+				let names = ['year', 'month', 'day', 'hour', 'minute', 'second'];
+				let dateString, formatDateArray = [];
+				if (this.type === 'date' || this.type === 'year-month' || this.type === 'year') {
+					formatDateArray = this.dateTime.map((item, index) => {
+						return this[names[index] + 's'][item] < 10 ? addZero(this[names[index] + 's'][item]) : this[names[index] + 's'][item];
+					})
+					dateString = formatDateArray.join('-');
+				} 
+				this.$emit('change', dateString)
+			},
+			dateTimePickerChange(e) {
+				let columns = e.target.value;
+				if (this.type === 'date' || this.type === 'datetime' || this.type === 'datetime-all') {
+					this.dateTime.splice(0, 1, columns[0]);
+					if (columns[0] != this.dateTime[0]) {
+						this.days = this.initTimeData(getOneMonthDays(this.years[this.dateTime[0]], this.months[this.dateTime[1]]), 1);
+						if (this.dateTime[1] == 1) {
+							if (this.dateTime[2] === this.days.length - 1) {
+								if (getOneMonthDays(this.years[columns[0]], this.dateTime[1]) < getOneMonthDays(this.years[this.dateTime[0]],this.dateTime[1])) {
+									this.dateTime.splice(2, 1, this.days.length - 1)
+								}
+							}
+						}
+					} else {
+						this.dateTime.splice(1, 1, columns[1]);
+						this.days = this.initTimeData(getOneMonthDays(this.years[this.dateTime[0]], this.dateTime[1]), 1);
+						if (columns[1] != this.dateTime[1]) {
+							if (this.dateTime[1] == 1) {
+								if (this.dateTime[2] === this.days.length - 1) {
+									if (getOneMonthDays(this.years[columns[0]], this.dateTime[1]) < getOneMonthDays(this.years[this.dateTime[0]],
+											this.dateTime[1])) {
+										this.dateTime.splice(2, 1, this.days.length - 1)
+									}
+								}
+							} else {
+								if (this.dateTime[2] > this.days.length - 1) {
+									this.dateTime.splice(2, 1, this.days.length - 1)
+								} else {
+									this.dateTime.splice(2, 1, columns[2])
+								}
+							}
+						} else {
+							this.dateTime.splice(2, 1, columns[2])
+						}
+					}
+					if (columns.length > 2) {
+						columns.splice(3).forEach((column, index) => {
+							this.dateTime.splice(index + 3, 1, column);
+						})
+					}
+				} else {
+					columns.forEach((column, index) => {
+						this.dateTime.splice(index, 1, column);
+					})
+				}
+				if (!this.isShowToolBar) {
+					this.formatDate();
+				}
+				
+				let names = ['year', 'month', 'day', 'hour', 'minute', 'second'];
+				this.formatDateArrays = [];
+				if (this.type === 'date' || this.type === 'year-month' || this.type === 'year') {
+					this.formatDateArrays = this.dateTime.map((item, index) => {
+						return this[names[index] + 's'][item] < 10 ? addZero(this[names[index] + 's'][item]) : this[names[index] + 's'][item];
+					})
+				}
+				console.log(this.formatDateArrays)
+			},
+		},
+		mounted() {
+			this.type = this.datestype
+			this.getIndicatorStyle();
+			this.initDateTime();
+		}
+	}
+</script>
+
+<style lang='scss' scoped>
+	.date-time-picker {
+		.date-time-mask {
+			position: fixed;
+			top: 0;
+			bottom: 0;
+			left: 0;
+			right: 0;
+			background-color: rgba($color: #000000, $alpha: .5);
+			z-index: 998 ;
+		}
+		
+		.jp-picker{
+			background-color: #fff;display: flex;justify-content: center;align-items: center;font-size: 30rpx;
+			font-size: 34rpx;
+			font-family: PingFangSC-Regular, PingFang SC;
+			color: #000000;
+		}
+	/* 	.jp-picker-year{
+			padding: 10rpx 20rpx;border: 1px solid rgb(250,80,80);border-top-left-radius: 30rpx;border-bottom-left-radius: 30rpx;height: 30rpx;line-height: 30rpx;
+		}
+		.jp-picker-year-month{
+			padding: 10rpx 20rpx;border-top: 1px solid rgb(250,80,80);border-bottom: 1px solid rgb(250,80,80);height: 30rpx;line-height: 30rpx;
+		}
+		.jp-picker-date{
+			padding: 10rpx 20rpx;border: 1px solid rgb(250,80,80);border-top-right-radius: 30rpx;border-bottom-right-radius: 30rpx;height: 30rpx;line-height: 30rpx;
+		} */
+		.jp-picker-xzr{
+			background-color: rgb(250,80,80);color: #fff;
+		}
+
+		.date-time-container {
+			position: fixed;
+			height: 50%;
+			bottom: 0;
+			right: 0;
+			left: 0;
+			background-color: #fff;
+			z-index: 1000;
+			display: flex;
+			flex-direction: column;
+
+			.time-picker-tool {
+				height: 80rpx;
+				display: flex;
+				align-items: center;
+				justify-content: space-between;
+				font-size: 28rpx;
+
+				.cancel-btn,.confirm-btn {
+					padding: 0 32rpx;
+					font-size: 32rpx;
+					color: #FF3334;
+					line-height: 40rpx;
+				}
+
+				.tool-title {
+					
+						font-size: 34rpx;
+						font-family: PingFangSC-Medium, PingFang SC;
+						font-weight: 500;
+						color: #000000;
+						line-height: 44rpx;
+					
+					
+				}
+
+				
+			}
+
+			.picker-view {
+				width: 100%;
+				flex: 1;
+
+				.item {
+					font-size: 34rpx;
+					height: 80rpx;
+					display: flex;
+					align-items: center;
+					justify-content: center;
+				}
+			}
+		}
+	}
+</style>

src/components/jp-timePicker/uitls/util.js

+/**
+ * 获取某年某月有多少天
+ */
+export const getOneMonthDays = (year,month)=>{
+	month = Number(month);
+	const baseMonthsDays = [0,31,28,31,30,31,30,31,31,30,31,30,31];
+	if(year % 4 == 0 && (year % 100 != 0 || year % 400 == 0)){
+		if(month === 2){
+			baseMonthsDays[month] = 29;
+		}
+	}
+	return baseMonthsDays[month];
+}
+
+/**
+ * 获取日期的年月日时分秒
+ */
+export const getTimeArray = (date)=>{
+	const year = date.getFullYear();
+	const month = date.getMonth()+1;
+	const day = date.getDate();
+	const hour = date.getHours();
+	const minute = date.getMinutes();
+	const second = date.getSeconds();
+	return [year,month,day,hour,minute,second];
+}
+/**
+ * 小于10的数字前面补0
+ */
+export const addZero = (num)=>{
+	return num < 10 ? '0' + num : num;
+}
+
+/**
+ * 获取当前值在数组中的索引
+ */
+export const getIndexOfArray = (value,array)=>{
+	let index = array.findIndex(item => item == value);
+	return index > -1 ? index : 0;
+}
\ No newline at end of file

src/components/resources/resources.vue

+<template>
+	<view>
+		<view class="container">
+			<image class="success-icon" :src="imageUrl" mode="aspectFit"></image>
+			<view class="text1">
+				{{title1}}
+			</view>
+			<view class="text2">
+				{{title2}}
+			</view>
+			<view class="btn" @tap="clickBtn">
+					{{btnText}}
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		name:"resources",
+		props:{
+			title1:{
+				type: String,
+				default: '资源录入成功'
+			},
+			title2:{
+				type: String,
+				default: '最终结果请前往钉钉查看哦～'
+			},
+			btnText:{
+				type: String,
+				default: '我知道了'
+			},
+		},
+		data() {
+			return {
+				imageUrl:require('../../assets/images/icon/resources.png'),
+			};
+		},
+		methods:{
+			clickBtn(){
+				this.$emit('clickBtn')
+			},
+		}
+	}
+</script>
+
+<style lang="scss">
+.container{
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+	}
+.success-icon{
+	margin-top: 120rpx;
+	width: 262rpx;
+	height: 252rpx;
+}
+.text1{
+	margin-top: 60rpx;
+	font-size: 32rpx;
+	font-family: PingFangSC-Medium, PingFang SC;
+	font-weight: 500;
+	color: #333333;
+	line-height: 44rpx;
+}
+.text2{
+	margin-top: 30rpx;
+	font-size: 26rpx;
+	font-family: PingFangSC-Regular, PingFang SC;
+	font-weight: 400;
+	color: #999999;
+	line-height: 30rpx;
+}
+.btn{
+	margin-top: 120rpx;
+	width: 200rpx;
+	height: 88rpx;
+	border-radius: 44rpx;
+	border: 2rpx solid #FF3334;
+	line-height: 88rpx;
+	text-align: center;
+	font-size: 32rpx;
+	font-family: PingFangSC-Regular, PingFang SC;
+	font-weight: 400;
+	color: #FF3334;
+}
+</style>

src/components/tale-calendar/calendar.vue

+<template>
+	<view class="content">
+		<view>
+
+			<view class="flex week-title">
+				<view class="flex-item flex " v-for="item in weeks" >
+					<text class="week">{{item}}</text>
+				</view>
+			</view>
+			<view class="flex-wrap">
+				<template v-for="item in visibleDays" :Key="item.day">
+					<view class="day-box flex-column">
+						<text
+							class="day"
+							@click="clickDate(item.day)"
+							:style="[
+							clickflag?isToday(item.day) && todayObj:'',
+							isClick(item.day) && selectedObj
+						]"
+							:class="[
+							{selected: isClick(item.day)},
+							{notCurrentMonth: !isCurrentMonth(item.day)},
+							{calendarRed:isWeek(item.day)}
+						]"
+						>{{item.day | dayFilter}}</text>
+						<template v-if="showText">
+							<text
+								v-if="isCurrentMonth(item.day)"
+								class="day-text"
+								:style="{color: textColor}"
+							>
+								{{item.data.value || ''}}
+							</text>
+						</template>
+						<template v-if="showDot">
+							<text
+								v-if="isCurrentMonth(item.day) && item.data.dot && item.data.active"
+								class="day-dot"
+							></text>
+							<text
+								v-if="isCurrentMonth(item.day) && item.data.dot && !item.data.active"
+								class="day-dot dot-gray"
+							></text>
+						</template>
+					</view>
+				</template>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+
+	const getYearMonthDay = (date) => {
+		let year = date.getFullYear();
+		let month = date.getMonth();
+		let day = date.getDate();
+		return {
+			year,
+			month,
+			day
+		}
+	}
+	const getDate = (year, month, day) => {
+		return new Date(year, month, day)
+	}
+
+	export default {
+		data() {
+			return {
+				iArr: [1,2,3,4,5,6],
+				jArr: [1,2,3,4,5,6,7],
+				value: new Date(),
+				weeks: ['SUN', 'MON', 'TUE', 'WED', 'THU', 'FRI', 'SAT'],
+				clickflag:true,//是否点击
+				click_time: {},
+				month_data: this.extraData,
+				time: this.defaultTime,
+				todayObj: {
+					background: this.bgColor,
+					color: '#ffffff'
+				},
+				selectedObj: {
+					background: this.selColor,
+					color: '#ffffff'
+				}
+			}
+		},
+		props: {
+			bgColor: {
+				type: String,
+				default: '#4198f8'
+			},
+			selColor: {
+				type: String,
+				default: '#4198f8'
+			},
+			textColor: {
+				type: String,
+				default: '#4198f8'
+			},
+			defaultTime: {
+				type: Object,
+				default: ()=> {
+					return {
+						year: getYearMonthDay(new Date()).year,
+						month: getYearMonthDay(new Date()).month
+					}
+				}
+			},
+			extraData: {
+				type: Array,
+				default: ()=> {
+					return [] // {date: '2020-6-3', value: '签到', dot: true, active: true}
+				}
+			},
+			showText: {
+				type: Boolean,
+				default: true
+			},
+			showDot: {
+				type: Boolean,
+				default: false
+			}
+		},
+		filters: {
+			dayFilter(val) {
+				return val.getDate();
+			}
+		},
+    watch: {
+      extraData:{
+        handler(newV, oldV) {
+          if (newV !== oldV) {
+            this.month_data = newV
+          }
+        },
+        deep:true
+      }
+    },
+		computed: {
+			visibleDays() { // 计算当月展示日期
+				let {time: {year, month}, month_data} = this;
+				let currentFirstDay = getDate(year, month, 1);
+				let week = currentFirstDay.getDay();
+				let startDay = currentFirstDay - week * 60 * 60 * 1000 * 24;
+				let arr = [];
+				for(let i = 0; i < 35; i++) {
+					let day = new Date(startDay + i * 60 * 60 * 1000 * 24);
+					let {year: dayY, month: dayM, day: dayD} = getYearMonthDay(day);
+					let data = {};
+					for (let item of month_data) {
+						let dateString = item.date;
+						let dateArr = dateString.indexOf('-') !== -1
+							? dateString.split('-')
+							: dateString.indexOf('/') !== -1
+								? dateString.split('/')
+								: [];
+						if (dateArr.length === 3
+							&& Number(dateArr[0]) === Number(dayY)
+							&& Number(dateArr[1]) === (Number(dayM) + 1)
+							&& Number(dateArr[2]) === Number(dayD)) {
+							data = item
+						}
+					}
+					let obj = {
+						day,
+						data
+					}
+					arr.push(obj)
+				}
+				return arr
+			}
+		},
+		mounted() {
+
+		},
+		methods: {
+			isCurrentMonth(date) { // 是否当月
+				let {year, month} = getYearMonthDay(getDate(this.time.year, this.time.month, 1));
+				let {year: y, month:m} = getYearMonthDay(date);
+				return year === y && month === m;
+			},
+			isToday(date) { // 是否当天
+				let {year, month, day} = getYearMonthDay(new Date());
+				let {year: y, month: m, day: d} = getYearMonthDay(date);
+				return year === y && month === m && day === d;
+			},
+			isClick(date) { // 是否是点击日期
+				let {click_time} = this;
+				if (!click_time.day) return false;
+				let {year, month, day} = getYearMonthDay(getDate(click_time.year, click_time.month, click_time.day));
+				let {year: y, month: m, day: d} = getYearMonthDay(date);
+				this.clickflag = false
+				return year === y && month === m && day === d;
+			},
+			isWeek(date){ //是否是周末
+				let day = new Date(date)
+				let dt = day.getDay()
+				if(this.isCurrentMonth(date)){
+					if(dt%7==6||dt%6==0){
+						return true
+					}
+				}
+				
+			},
+			clickDate(date) { // 点击日期
+				let {year, month, day} = getYearMonthDay(date);
+				this.click_time = {year, month, day};
+				this.$emit('calendarTap', {year, month, day})
+			},
+			prevMonth() { // 上一月
+				let { time: { year, month} } = this;
+				let d = getDate(year, month, 1);
+				d.setMonth(d.getMonth() - 1);
+				this.time = getYearMonthDay(d);
+				// this.click_time = {};
+        this.$emit('monthTap', getYearMonthDay(d))
+			},
+			nextMonth() { // 下一月
+				// 获取当前的年月的日期
+				let { time: { year, month} } = this;
+				let d = getDate(year, month, 1);
+				d.setMonth(d.getMonth() + 1);
+				this.time = getYearMonthDay(d);
+				// this.click_time = {};
+        this.$emit('monthTap', getYearMonthDay(d))
+			},
+			monthChange(e) {
+				let {value} = e.detail;
+				let timeArr = value.split('-');
+				this.time = {year: timeArr[0], month: timeArr[1] - 1, day: 1};
+        this.$emit('monthTap',{year: timeArr[0], month: timeArr[1] - 1, day: 1})
+			}
+		}
+	}
+</script>
+
+<style scoped lang="scss">
+	.content {
+		box-sizing: border-box;
+		box-shadow: 0px 0px 32rpx 0px rgba(0, 0, 0, 0.1);
+		border-radius: 24rpx;
+		background-color: #fff;
+		margin: 0 auto;
+	}
+	.flex {
+		width: 100%;
+		display: flex;
+		align-items: center;
+		justify-content: space-between;
+		flex-direction: row;
+	}
+	.flex-wrap {
+		width: 100%;
+		padding-top: 50rpx;
+		display: flex;
+		flex-wrap: wrap;
+		align-items: center;
+		justify-content: space-between;
+		flex-direction: row;
+	}
+	.flex-column {
+		width: 100%;
+		height: 106rpx;
+		display: flex;
+		flex-direction: column;
+		justify-content: center;
+		align-items: center;
+	}
+	.flex-item {
+		flex: 1;
+		text-align: center;
+	}
+	.bold {
+		font-weight: bold;
+		font-size: 28rpx;
+	}
+	.year-month {
+		width: 400rpx;
+		margin: 0 auto 20rpx;
+		padding-top: 20rpx;
+	}
+	.week-title{
+		position: fixed;
+		width: 690rpx;
+		border-radius: 24rpx;
+		background-color: #fff;
+	}
+	.week {
+		margin: 20rpx auto 30rpx;
+		// width: 60rpx;
+		text-align: center;
+		font-size: 24rpx;
+		font-family: PingFangSC-Semibold, PingFang SC;
+		font-weight: 600;
+		color: #333333;
+	}
+	.day-box {
+		// width: 100rpx;
+		flex: 1;
+		text-align: center;
+		display: flex;
+		padding: 0 10rpx;
+		flex-direction: column;
+	}
+	.day {
+		width: 68rpx;
+		height: 68rpx;
+		line-height: 68rpx;
+		border-radius: 50%;
+		text-align: center;
+		font-size: 28rpx;
+		font-family: PingFangSC-Semibold, PingFang SC;
+		font-weight: 600;
+		color: #333333;
+	}
+	.day-text {
+		font-size: 22rpx;
+	}
+	.day-dot {
+		width: 12rpx;
+		height: 12rpx;
+		border-radius: 50%;
+		background: #4cd964;
+		&.dot-gray {
+			background: gray;
+		}
+	}
+	.today, .selected {
+		background: linear-gradient(135deg, #FF6E58 0%, #FF3334 100%);
+		box-shadow: 0px 4rpx 8rpx 0px rgba(254, 59, 31, 0.3);
+		color: #ffffff;
+	}
+	.notCurrentMonth {
+		color: #999999;
+		pointer-events: none;
+		background: none;
+	}
+	.calendarRed{
+		color: #FF3334;
+	}
+</style>

src/components/u-parse/components/wxParseAudio.vue

+<template>
+  <!--增加audio标签支持-->
+  <audio
+    :id="node.attr.id"
+    :class="node.classStr"
+    :style="node.styleStr"
+    :src="node.attr.src"
+    :loop="node.attr.loop"
+    :poster="node.attr.poster"
+    :name="node.attr.name"
+    :author="node.attr.author"
+    controls></audio>
+</template>
+
+<script>
+export default {
+  name: 'wxParseAudio',
+  props: {
+    node: {
+      type: Object,
+      default() {
+        return {};
+      },
+    },
+  },
+};
+</script>

src/components/u-parse/components/wxParseImg.vue

+<template>
+  <image
+    :mode="node.attr.mode"
+    :lazy-load="node.attr.lazyLoad"
+    :class="node.classStr"
+    :style="newStyleStr || node.styleStr"
+    :data-src="node.attr.src"
+    :src="node.attr.src"
+    @tap="wxParseImgTap"
+    @load="wxParseImgLoad"
+    />
+</template>
+
+<script>
+export default {
+  name: 'wxParseImg',
+  data() {
+    return {
+      newStyleStr: '',
+      preview: true,
+    };
+  },
+  props: {
+    node: {
+      type: Object,
+      default() {
+        return {};
+      },
+    },
+  },
+  methods: {
+    wxParseImgTap(e) {
+      if (!this.preview) return;
+      const { src } = e.currentTarget.dataset;
+      if (!src) return;
+      let parent = this.$parent;
+      while(!parent.preview || typeof parent.preview !== 'function') {// TODO 遍历获取父节点执行方法
+      	parent = parent.$parent;
+      }
+      parent.preview(src, e);
+    },
+    // 图片视觉宽高计算函数区
+    wxParseImgLoad(e) {
+      const { src } = e.currentTarget.dataset;
+      if (!src) return;
+      const { width, height } = e.mp.detail;
+      const recal = this.wxAutoImageCal(width, height);
+      const { imageheight, imageWidth } = recal;
+      const { padding, mode } = this.node.attr;
+      const { styleStr } = this.node;
+      const imageHeightStyle = mode === 'widthFix' ? '' : `height: ${imageheight}px;`;
+      this.newStyleStr = `${styleStr}; ${imageHeightStyle}; width: ${imageWidth}px; padding: 0 ${+padding}px;`;
+    },
+    // 计算视觉优先的图片宽高
+    wxAutoImageCal(originalWidth, originalHeight) {
+      // 获取图片的原始长宽
+      const { padding } = this.node.attr;
+      const windowWidth = this.node.$screen.width - (2 * padding);
+      const results = {};
+
+      if (originalWidth < 60 || originalHeight < 60) {
+        const { src } = this.node.attr;
+				let parent = this.$parent;
+				while(!parent.preview || typeof parent.preview !== 'function') {
+					parent = parent.$parent;
+				}
+				parent.removeImageUrl(src);
+        this.preview = false;
+      }
+
+      // 判断按照那种方式进行缩放
+      if (originalWidth > windowWidth) {
+        // 在图片width大于手机屏幕width时候
+        results.imageWidth = windowWidth;
+        results.imageheight = windowWidth * (originalHeight / originalWidth);
+      } else {
+        // 否则展示原来的数据
+        results.imageWidth = originalWidth;
+        results.imageheight = originalHeight;
+      }
+
+      return results;
+    },
+  },
+};
+</script>

src/components/u-parse/components/wxParseTemplate0.vue

+<template>
+	<view>
+		<!--判断是否是标签节点-->
+		<block v-if="node.node == 'element'">
+			<block v-if="node.tag == 'button'">
+				<button type="default" size="mini">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</button>
+			</block>
+
+			<!--li类型-->
+			<block v-else-if="node.tag == 'li'">
+				<view :class="node.classStr" :style="node.styleStr">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</view>
+			</block>
+
+			<!--video类型-->
+			<block v-else-if="node.tag == 'video'">
+				<wx-parse-video :node="node" />
+			</block>
+
+			<!--audio类型-->
+			<block v-else-if="node.tag == 'audio'">
+				<wx-parse-audio :node="node" />
+			</block>
+
+			<!--img类型-->
+			<block v-else-if="node.tag == 'img'">
+				<wx-parse-img :node="node" />
+			</block>
+
+			<!--a类型-->
+			<block v-else-if="node.tag == 'a'">
+				<view @click="wxParseATap" :class="node.classStr" :data-href="node.attr.href" :style="node.styleStr">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</view>
+			</block>
+
+			<!--table类型-->
+			<block v-else-if="node.tag == 'table'">
+				<view :class="node.classStr" class="table" :style="node.styleStr">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</view>
+			</block>
+
+			<!--br类型-->
+			<block v-else-if="node.tag == 'br'">
+				<text>\n</text>
+			</block>
+
+			<!--其他标签-->
+			<block v-else>
+				<view :class="node.classStr" :style="node.styleStr">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</view>
+			</block>
+
+		</block>
+
+		<!--判断是否是文本节点-->
+		<block v-else-if="node.node == 'text'">{{node.text}}</block>
+	</view>
+</template>
+
+<script>
+	import wxParseTemplate from './wxParseTemplate1';
+	import wxParseImg from './wxParseImg';
+	import wxParseVideo from './wxParseVideo';
+	import wxParseAudio from './wxParseAudio';
+
+	export default {
+		name: 'wxParseTemplate0',
+		props: {
+			node: {},
+		},
+		components: {
+			wxParseTemplate,
+			wxParseImg,
+			wxParseVideo,
+			wxParseAudio,
+		},
+		methods: {
+			wxParseATap(e) {
+				const {
+					href
+				} = e.currentTarget.dataset;// TODO currentTarget才有dataset
+				if (!href) return;
+				let parent = this.$parent;
+				while(!parent.preview || typeof parent.preview !== 'function') {// TODO 遍历获取父节点执行方法
+					parent = parent.$parent;
+				}
+				parent.navigate(href, e);
+			},
+		},
+	};
+</script>

src/components/u-parse/components/wxParseTemplate1.vue

+<template>
+	<view :class="(node.tag == 'li' ? node.classStr : (node.node==='text'?'text':''))">
+		<!--判断是否是标签节点-->
+		<block v-if="node.node == 'element'">
+			<block v-if="node.tag == 'button'">
+				<button type="default" size="mini">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</button>
+			</block>
+
+			<!--li类型-->
+			<block v-else-if="node.tag == 'li'">
+				<!-- <view :class="node.classStr" :style="node.styleStr"> -->
+				<view :style="node.styleStr">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</view>
+			</block>
+
+			<!--video类型-->
+			<block v-else-if="node.tag == 'video'">
+				<wx-parse-video :node="node" />
+			</block>
+
+			<!--audio类型-->
+			<block v-else-if="node.tag == 'audio'">
+				<wx-parse-audio :node="node" />
+			</block>
+
+			<!--img类型-->
+			<block v-else-if="node.tag == 'img'">
+				<wx-parse-img :node="node" />
+			</block>
+
+			<!--a类型-->
+			<block v-else-if="node.tag == 'a'">
+				<view @click="wxParseATap" :class="node.classStr" :data-href="node.attr.href" :style="node.styleStr">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</view>
+			</block>
+
+			<!--br类型-->
+			<block v-else-if="node.tag == 'br'">
+				<text>\n</text>
+			</block>
+
+			<!--其他标签-->
+			<block v-else>
+				<view :class="node.classStr" :style="node.styleStr">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</view>
+			</block>
+
+		</block>
+
+		<!--判断是否是文本节点-->
+		<block v-else-if="node.node == 'text'">{{node.text}}</block>
+	</view>
+</template>
+
+<script>
+	import wxParseTemplate from './wxParseTemplate2';
+	import wxParseImg from './wxParseImg';
+	import wxParseVideo from './wxParseVideo';
+	import wxParseAudio from './wxParseAudio';
+
+	export default {
+		name: 'wxParseTemplate1',
+		props: {
+			node: {},
+		},
+		components: {
+			wxParseTemplate,
+			wxParseImg,
+			wxParseVideo,
+			wxParseAudio,
+		},
+		methods: {
+			wxParseATap(e) {
+				const {
+					href
+				} = e.currentTarget.dataset;
+				if (!href) return;
+				let parent = this.$parent;
+				while(!parent.preview || typeof parent.preview !== 'function') {
+					parent = parent.$parent;
+				}
+				parent.navigate(href, e);
+			},
+		},
+	};
+</script>

src/components/u-parse/components/wxParseTemplate10.vue

+<template>
+	<view>
+		<!--判断是否是标签节点-->
+		<block v-if="node.node == 'element'">
+			<block v-if="node.tag == 'button'">
+				<button type="default" size="mini">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</button>
+			</block>
+
+			<!--li类型-->
+			<block v-else-if="node.tag == 'li'">
+				<view :class="node.classStr" :style="node.styleStr">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</view>
+			</block>
+
+			<!--video类型-->
+			<block v-else-if="node.tag == 'video'">
+				<wx-parse-video :node="node" />
+			</block>
+
+			<!--audio类型-->
+			<block v-else-if="node.tag == 'audio'">
+				<wx-parse-audio :node="node" />
+			</block>
+
+			<!--img类型-->
+			<block v-else-if="node.tag == 'img'">
+				<wx-parse-img :node="node" />
+			</block>
+
+			<!--a类型-->
+			<block v-else-if="node.tag == 'a'">
+				<view @click="wxParseATap" :class="node.classStr" :data-href="node.attr.href" :style="node.styleStr">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</view>
+			</block>
+
+			<!--br类型-->
+			<block v-else-if="node.tag == 'br'">
+				<text>\n</text>
+			</block>
+
+			<!--其他标签-->
+			<block v-else>
+				<view :class="node.classStr" :style="node.styleStr">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</view>
+			</block>
+		</block>
+
+		<!--判断是否是文本节点-->
+		<block v-else-if="node.node == 'text'">{{node.text}}</block>
+	</view>
+</template>
+
+<script>
+	import wxParseTemplate from './wxParseTemplate11';
+	import wxParseImg from './wxParseImg';
+	import wxParseVideo from './wxParseVideo';
+	import wxParseAudio from './wxParseAudio';
+
+	export default {
+		name: 'wxParseTemplate10',
+		props: {
+			node: {},
+		},
+		components: {
+			wxParseTemplate,
+			wxParseImg,
+			wxParseVideo,
+			wxParseAudio,
+		},
+		methods: {
+			wxParseATap(e) {
+				const {
+					href
+				} = e.currentTarget.dataset;
+				if (!href) return;
+				let parent = this.$parent;
+				while(!parent.preview || typeof parent.preview !== 'function') {
+					parent = parent.$parent;
+				}
+				parent.navigate(href, e);
+			},
+		},
+	};
+</script>

src/components/u-parse/components/wxParseTemplate11.vue

+<template>
+	<view>
+		<!--判断是否是标签节点-->
+		<block v-if="node.node == 'element'">
+			<!--button类型-->
+			<block v-if="node.tag == 'button'">
+				<button type="default" size="mini">
+				</button>
+			</block>
+
+			<!--li类型-->
+			<block v-else-if="node.tag == 'li'">
+				<view :class="node.classStr" :style="node.styleStr">
+					{{node.text}}
+				</view>
+			</block>
+
+			<!--video类型-->
+			<block v-else-if="node.tag == 'video'">
+				<wx-parse-video :node="node" />
+			</block>
+
+			<!--audio类型-->
+			<block v-else-if="node.tag == 'audio'">
+				<wx-parse-audio :node="node" />
+			</block>
+
+			<!--img类型-->
+			<block v-else-if="node.tag == 'img'">
+				<wx-parse-img :node="node" />
+			</block>
+
+			<!--a类型-->
+			<block v-else-if="node.tag == 'a'">
+				<view @click="wxParseATap" :class="node.classStr" :data-href="node.attr.href" :style="node.styleStr">
+					{{node.text}}
+				</view>
+			</block>
+
+			<!--br类型-->
+			<block v-else-if="node.tag == 'br'">
+				<text>\n</text>
+			</block>
+
+			<!--其他标签-->
+			<block v-else>
+				<view :class="node.classStr" :style="node.styleStr">
+					{{node.text}}
+				</view>
+			</block>
+		</block>
+
+		<!--判断是否是文本节点-->
+		<block v-else-if="node.node == 'text'">{{node.text}}</block>
+	</view>
+</template>
+
+<script>
+	import wxParseImg from './wxParseImg';
+	import wxParseVideo from './wxParseVideo';
+	import wxParseAudio from './wxParseAudio';
+
+	export default {
+		name: 'wxParseTemplate11',
+		props: {
+			node: {},
+		},
+		components: {
+			wxParseImg,
+			wxParseVideo,
+			wxParseAudio,
+		},
+		methods: {
+			wxParseATap(e) {
+				const {
+					href
+				} = e.currentTarget.dataset;
+				if (!href) return;
+				let parent = this.$parent;
+				while(!parent.preview || typeof parent.preview !== 'function') {
+					parent = parent.$parent;
+				}
+				parent.navigate(href, e);
+			},
+		},
+	};
+</script>

src/components/u-parse/components/wxParseTemplate2.vue

+<template>
+	<view>
+		<!--判断是否是标签节点-->
+		<block v-if="node.node == 'element'">
+			<block v-if="node.tag == 'button'">
+				<button type="default" size="mini">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</button>
+			</block>
+
+			<!--li类型-->
+			<block v-else-if="node.tag == 'li'">
+				<view :class="node.classStr" :style="node.styleStr">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</view>
+			</block>
+
+			<!--video类型-->
+			<block v-else-if="node.tag == 'video'">
+				<wx-parse-video :node="node" />
+			</block>
+
+			<!--audio类型-->
+			<block v-else-if="node.tag == 'audio'">
+				<wx-parse-audio :node="node" />
+			</block>
+
+			<!--img类型-->
+			<block v-else-if="node.tag == 'img'">
+				<wx-parse-img :node="node" />
+			</block>
+
+			<!--a类型-->
+			<block v-else-if="node.tag == 'a'">
+				<view @click="wxParseATap" :class="node.classStr" :data-href="node.attr.href" :style="node.styleStr">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</view>
+			</block>
+
+			<!--br类型-->
+			<block v-else-if="node.tag == 'br'">
+				<text>\n</text>
+			</block>
+
+			<!--其他标签-->
+			<block v-else>
+				<view :class="node.classStr" :style="node.styleStr">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</view>
+			</block>
+
+		</block>
+
+		<!--判断是否是文本节点-->
+		<block v-else-if="node.node == 'text'">{{node.text}}</block>
+	</view>
+</template>
+
+<script>
+	import wxParseTemplate from './wxParseTemplate3';
+	import wxParseImg from './wxParseImg';
+	import wxParseVideo from './wxParseVideo';
+	import wxParseAudio from './wxParseAudio';
+
+	export default {
+		name: 'wxParseTemplate2',
+		props: {
+			node: {},
+		},
+		components: {
+			wxParseTemplate,
+			wxParseImg,
+			wxParseVideo,
+			wxParseAudio,
+		},
+		methods: {
+			wxParseATap(e) {
+				const {
+					href
+				} = e.currentTarget.dataset;
+				if (!href) return;
+				let parent = this.$parent;
+				while(!parent.preview || typeof parent.preview !== 'function') {
+					parent = parent.$parent;
+				}
+				parent.navigate(href, e);
+			},
+		},
+	};
+</script>

src/components/u-parse/components/wxParseTemplate3.vue

+<template>
+	<view>
+		<!--判断是否是标签节点-->
+		<block v-if="node.node == 'element'">
+			<block v-if="node.tag == 'button'">
+				<button type="default" size="mini">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</button>
+			</block>
+
+			<!--li类型-->
+			<block v-else-if="node.tag == 'li'">
+				<view :class="node.classStr" :style="node.styleStr">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</view>
+			</block>
+
+			<!--video类型-->
+			<block v-else-if="node.tag == 'video'">
+				<wx-parse-video :node="node" />
+			</block>
+
+			<!--audio类型-->
+			<block v-else-if="node.tag == 'audio'">
+				<wx-parse-audio :node="node" />
+			</block>
+
+			<!--img类型-->
+			<block v-else-if="node.tag == 'img'">
+				<wx-parse-img :node="node" />
+			</block>
+
+			<!--a类型-->
+			<block v-else-if="node.tag == 'a'">
+				<view @click="wxParseATap" :class="node.classStr" :data-href="node.attr.href" :style="node.styleStr">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</view>
+			</block>
+
+			<!--br类型-->
+			<block v-else-if="node.tag == 'br'">
+				<text>\n</text>
+			</block>
+
+			<!--其他标签-->
+			<block v-else>
+				<view :class="node.classStr" :style="node.styleStr">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</view>
+			</block>
+
+		</block>
+
+		<!--判断是否是文本节点-->
+		<block v-else-if="node.node == 'text'">{{node.text}}</block>
+	</view>
+</template>
+
+<script>
+	import wxParseTemplate from './wxParseTemplate4';
+	import wxParseImg from './wxParseImg';
+	import wxParseVideo from './wxParseVideo';
+	import wxParseAudio from './wxParseAudio';
+
+	export default {
+		name: 'wxParseTemplate3',
+		props: {
+			node: {},
+		},
+		components: {
+			wxParseTemplate,
+			wxParseImg,
+			wxParseVideo,
+			wxParseAudio,
+		},
+		methods: {
+			wxParseATap(e) {
+				const {
+					href
+				} = e.currentTarget.dataset;
+				if (!href) return;
+				let parent = this.$parent;
+				while(!parent.preview || typeof parent.preview !== 'function') {
+					parent = parent.$parent;
+				}
+				parent.navigate(href, e);
+			},
+		},
+	};
+</script>

src/components/u-parse/components/wxParseTemplate4.vue

+<template>
+	<view>
+		<!--判断是否是标签节点-->
+		<block v-if="node.node == 'element'">
+			<block v-if="node.tag == 'button'">
+				<button type="default" size="mini">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</button>
+			</block>
+
+			<!--li类型-->
+			<block v-else-if="node.tag == 'li'">
+				<view :class="node.classStr" :style="node.styleStr">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</view>
+			</block>
+
+			<!--video类型-->
+			<block v-else-if="node.tag == 'video'">
+				<wx-parse-video :node="node" />
+			</block>
+
+			<!--audio类型-->
+			<block v-else-if="node.tag == 'audio'">
+				<wx-parse-audio :node="node" />
+			</block>
+
+			<!--img类型-->
+			<block v-else-if="node.tag == 'img'">
+				<wx-parse-img :node="node" />
+			</block>
+
+			<!--a类型-->
+			<block v-else-if="node.tag == 'a'">
+				<view @click="wxParseATap" :class="node.classStr" :data-href="node.attr.href" :style="node.styleStr">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</view>
+			</block>
+
+			<!--br类型-->
+			<block v-else-if="node.tag == 'br'">
+				<text>\n</text>
+			</block>
+
+			<!--其他标签-->
+			<block v-else>
+				<view :class="node.classStr" :style="node.styleStr">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</view>
+			</block>
+
+		</block>
+
+		<!--判断是否是文本节点-->
+		<block v-else-if="node.node == 'text'">{{node.text}}</block>
+	</view>
+</template>
+
+<script>
+	import wxParseTemplate from './wxParseTemplate5';
+	import wxParseImg from './wxParseImg';
+	import wxParseVideo from './wxParseVideo';
+	import wxParseAudio from './wxParseAudio';
+
+	export default {
+		name: 'wxParseTemplate4',
+		props: {
+			node: {},
+		},
+		components: {
+			wxParseTemplate,
+			wxParseImg,
+			wxParseVideo,
+			wxParseAudio,
+		},
+		methods: {
+			wxParseATap(e) {
+				const {
+					href
+				} = e.currentTarget.dataset;
+				if (!href) return;
+				let parent = this.$parent;
+				while(!parent.preview || typeof parent.preview !== 'function') {
+					parent = parent.$parent;
+				}
+				parent.navigate(href, e);
+			},
+		},
+	};
+</script>

src/components/u-parse/components/wxParseTemplate5.vue

+<template>
+	<view>
+		<!--判断是否是标签节点-->
+		<block v-if="node.node == 'element'">
+			<block v-if="node.tag == 'button'">
+				<button type="default" size="mini">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</button>
+			</block>
+
+			<!--li类型-->
+			<block v-else-if="node.tag == 'li'">
+				<view :class="node.classStr" :style="node.styleStr">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</view>
+			</block>
+
+			<!--video类型-->
+			<block v-else-if="node.tag == 'video'">
+				<wx-parse-video :node="node" />
+			</block>
+
+			<!--audio类型-->
+			<block v-else-if="node.tag == 'audio'">
+				<wx-parse-audio :node="node" />
+			</block>
+
+			<!--img类型-->
+			<block v-else-if="node.tag == 'img'">
+				<wx-parse-img :node="node" />
+			</block>
+
+			<!--a类型-->
+			<block v-else-if="node.tag == 'a'">
+				<view @click="wxParseATap" :class="node.classStr" :data-href="node.attr.href" :style="node.styleStr">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</view>
+			</block>
+
+			<!--br类型-->
+			<block v-else-if="node.tag == 'br'">
+				<text>\n</text>
+			</block>
+
+			<!--其他标签-->
+			<block v-else>
+				<view :class="node.classStr" :style="node.styleStr">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</view>
+			</block>
+
+		</block>
+
+		<!--判断是否是文本节点-->
+		<block v-else-if="node.node == 'text'">{{node.text}}</block>
+	</view>
+</template>
+
+<script>
+	import wxParseTemplate from './wxParseTemplate6';
+	import wxParseImg from './wxParseImg';
+	import wxParseVideo from './wxParseVideo';
+	import wxParseAudio from './wxParseAudio';
+
+	export default {
+		name: 'wxParseTemplate5',
+		props: {
+			node: {},
+		},
+		components: {
+			wxParseTemplate,
+			wxParseImg,
+			wxParseVideo,
+			wxParseAudio,
+		},
+		methods: {
+			wxParseATap(e) {
+				const {
+					href
+				} = e.currentTarget.dataset;
+				if (!href) return;
+				let parent = this.$parent;
+				while(!parent.preview || typeof parent.preview !== 'function') {
+					parent = parent.$parent;
+				}
+				parent.navigate(href, e);
+			},
+		},
+	};
+</script>

src/components/u-parse/components/wxParseTemplate6.vue

+<template>
+	<view>
+		<!--判断是否是标签节点-->
+		<block v-if="node.node == 'element'">
+			<block v-if="node.tag == 'button'">
+				<button type="default" size="mini">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</button>
+			</block>
+
+			<!--li类型-->
+			<block v-else-if="node.tag == 'li'">
+				<view :class="node.classStr" :style="node.styleStr">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</view>
+			</block>
+
+			<!--video类型-->
+			<block v-else-if="node.tag == 'video'">
+				<wx-parse-video :node="node" />
+			</block>
+
+			<!--audio类型-->
+			<block v-else-if="node.tag == 'audio'">
+				<wx-parse-audio :node="node" />
+			</block>
+
+			<!--img类型-->
+			<block v-else-if="node.tag == 'img'">
+				<wx-parse-img :node="node" />
+			</block>
+
+			<!--a类型-->
+			<block v-else-if="node.tag == 'a'">
+				<view @click="wxParseATap" :class="node.classStr" :data-href="node.attr.href" :style="node.styleStr">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</view>
+			</block>
+
+			<!--br类型-->
+			<block v-else-if="node.tag == 'br'">
+				<text>\n</text>
+			</block>
+
+			<!--其他标签-->
+			<block v-else>
+				<view :class="node.classStr" :style="node.styleStr">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</view>
+			</block>
+
+		</block>
+
+		<!--判断是否是文本节点-->
+		<block v-else-if="node.node == 'text'">{{node.text}}</block>
+	</view>
+</template>
+
+<script>
+	import wxParseTemplate from './wxParseTemplate7';
+	import wxParseImg from './wxParseImg';
+	import wxParseVideo from './wxParseVideo';
+	import wxParseAudio from './wxParseAudio';
+
+	export default {
+		name: 'wxParseTemplate6',
+		props: {
+			node: {},
+		},
+		components: {
+			wxParseTemplate,
+			wxParseImg,
+			wxParseVideo,
+			wxParseAudio,
+		},
+		methods: {
+			wxParseATap(e) {
+				const {
+					href
+				} = e.currentTarget.dataset;
+				if (!href) return;
+				let parent = this.$parent;
+				while(!parent.preview || typeof parent.preview !== 'function') {
+					parent = parent.$parent;
+				}
+				parent.navigate(href, e);
+			},
+		},
+	};
+</script>

src/components/u-parse/components/wxParseTemplate7.vue

+<template>
+	<view>
+		<!--判断是否是标签节点-->
+		<block v-if="node.node == 'element'">
+			<block v-if="node.tag == 'button'">
+				<button type="default" size="mini">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</button>
+			</block>
+
+			<!--li类型-->
+			<block v-else-if="node.tag == 'li'">
+				<view :class="node.classStr" :style="node.styleStr">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</view>
+			</block>
+
+			<!--video类型-->
+			<block v-else-if="node.tag == 'video'">
+				<wx-parse-video :node="node" />
+			</block>
+
+			<!--audio类型-->
+			<block v-else-if="node.tag == 'audio'">
+				<wx-parse-audio :node="node" />
+			</block>
+
+			<!--img类型-->
+			<block v-else-if="node.tag == 'img'">
+				<wx-parse-img :node="node" />
+			</block>
+
+			<!--a类型-->
+			<block v-else-if="node.tag == 'a'">
+				<view @click="wxParseATap" :class="node.classStr" :data-href="node.attr.href" :style="node.styleStr">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</view>
+			</block>
+
+			<!--br类型-->
+			<block v-else-if="node.tag == 'br'">
+				<text>\n</text>
+			</block>
+
+			<!--其他标签-->
+			<block v-else>
+				<view :class="node.classStr" :style="node.styleStr">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</view>
+			</block>
+
+		</block>
+
+		<!--判断是否是文本节点-->
+		<block v-else-if="node.node == 'text'">{{node.text}}</block>
+	</view>
+</template>
+
+<script>
+	import wxParseTemplate from './wxParseTemplate8';
+	import wxParseImg from './wxParseImg';
+	import wxParseVideo from './wxParseVideo';
+	import wxParseAudio from './wxParseAudio';
+
+	export default {
+		name: 'wxParseTemplate7',
+		props: {
+			node: {},
+		},
+		components: {
+			wxParseTemplate,
+			wxParseImg,
+			wxParseVideo,
+			wxParseAudio,
+		},
+		methods: {
+			wxParseATap(e) {
+				const {
+					href
+				} = e.currentTarget.dataset;
+				if (!href) return;
+				let parent = this.$parent;
+				while(!parent.preview || typeof parent.preview !== 'function') {
+					parent = parent.$parent;
+				}
+				parent.navigate(href, e);
+			},
+		},
+	};
+</script>

src/components/u-parse/components/wxParseTemplate8.vue

+<template>
+	<view>
+		<!--判断是否是标签节点-->
+		<block v-if="node.node == 'element'">
+			<block v-if="node.tag == 'button'">
+				<button type="default" size="mini">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</button>
+			</block>
+
+			<!--li类型-->
+			<block v-else-if="node.tag == 'li'">
+				<view :class="node.classStr" :style="node.styleStr">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</view>
+			</block>
+
+			<!--video类型-->
+			<block v-else-if="node.tag == 'video'">
+				<wx-parse-video :node="node" />
+			</block>
+
+			<!--audio类型-->
+			<block v-else-if="node.tag == 'audio'">
+				<wx-parse-audio :node="node" />
+			</block>
+
+			<!--img类型-->
+			<block v-else-if="node.tag == 'img'">
+				<wx-parse-img :node="node" />
+			</block>
+
+			<!--a类型-->
+			<block v-else-if="node.tag == 'a'">
+				<view @click="wxParseATap" :class="node.classStr" :data-href="node.attr.href" :style="node.styleStr">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</view>
+			</block>
+
+			<!--br类型-->
+			<block v-else-if="node.tag == 'br'">
+				<text>\n</text>
+			</block>
+
+			<!--其他标签-->
+			<block v-else>
+				<view :class="node.classStr" :style="node.styleStr">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</view>
+			</block>
+
+		</block>
+
+		<!--判断是否是文本节点-->
+		<block v-else-if="node.node == 'text'">{{node.text}}</block>
+	</view>
+</template>
+
+<script>
+	import wxParseTemplate from './wxParseTemplate9';
+	import wxParseImg from './wxParseImg';
+	import wxParseVideo from './wxParseVideo';
+	import wxParseAudio from './wxParseAudio';
+
+	export default {
+		name: 'wxParseTemplate8',
+		props: {
+			node: {},
+		},
+		components: {
+			wxParseTemplate,
+			wxParseImg,
+			wxParseVideo,
+			wxParseAudio,
+		},
+		methods: {
+			wxParseATap(e) {
+				const {
+					href
+				} = e.currentTarget.dataset;
+				if (!href) return;
+				let parent = this.$parent;
+				while(!parent.preview || typeof parent.preview !== 'function') {
+					parent = parent.$parent;
+				}
+				parent.navigate(href, e);
+			},
+		},
+	};
+</script>

src/components/u-parse/components/wxParseTemplate9.vue

+<template>
+	<view>
+		<!--判断是否是标签节点-->
+		<block v-if="node.node == 'element'">
+			<block v-if="node.tag == 'button'">
+				<button type="default" size="mini">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</button>
+			</block>
+
+			<!--li类型-->
+			<block v-else-if="node.tag == 'li'">
+				<view :class="node.classStr" :style="node.styleStr">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</view>
+			</block>
+
+			<!--video类型-->
+			<block v-else-if="node.tag == 'video'">
+				<wx-parse-video :node="node" />
+			</block>
+
+			<!--audio类型-->
+			<block v-else-if="node.tag == 'audio'">
+				<wx-parse-audio :node="node" />
+			</block>
+
+			<!--img类型-->
+			<block v-else-if="node.tag == 'img'">
+				<wx-parse-img :node="node" />
+			</block>
+
+			<!--a类型-->
+			<block v-else-if="node.tag == 'a'">
+				<view @click="wxParseATap" :class="node.classStr" :data-href="node.attr.href" :style="node.styleStr">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</view>
+			</block>
+
+			<!--br类型-->
+			<block v-else-if="node.tag == 'br'">
+				<text>\n</text>
+			</block>
+
+			<!--其他标签-->
+			<block v-else>
+				<view :class="node.classStr" :style="node.styleStr">
+					<block v-for="(node, index) of node.nodes" :key="index">
+						<wx-parse-template :node="node" />
+					</block>
+				</view>
+			</block>
+
+		</block>
+
+		<!--判断是否是文本节点-->
+		<block v-else-if="node.node == 'text'">{{node.text}}</block>
+	</view>
+</template>
+
+<script>
+	import wxParseTemplate from './wxParseTemplate10';
+	import wxParseImg from './wxParseImg';
+	import wxParseVideo from './wxParseVideo';
+	import wxParseAudio from './wxParseAudio';
+
+	export default {
+		name: 'wxParseTemplate9',
+		props: {
+			node: {},
+		},
+		components: {
+			wxParseTemplate,
+			wxParseImg,
+			wxParseVideo,
+			wxParseAudio,
+		},
+		methods: {
+			wxParseATap(e) {
+				const {
+					href
+				} = e.currentTarget.dataset;
+				if (!href) return;
+				let parent = this.$parent;
+				while(!parent.preview || typeof parent.preview !== 'function') {
+					parent = parent.$parent;
+				}
+				parent.navigate(href, e);
+			},
+		},
+	};
+</script>

src/components/u-parse/components/wxParseVideo.vue

+<template>
+  <!--增加video标签支持，并循环添加-->
+  <view :class="node.classStr" :style="node.styleStr">
+    <video :class="node.classStr" class="video-video" :src="node.attr.src"></video>
+  </view>
+</template>
+
+<script>
+export default {
+  name: 'wxParseVideo',
+  props: {
+    node: {},
+  },
+};
+</script>

src/components/u-parse/libs/html2json.js

+/**
+ * html2Json 改造来自: https://github.com/Jxck/html2json
+ *
+ *
+ * author: Di (微信小程序开发工程师)
+ * organization: WeAppDev(微信小程序开发论坛)(http://weappdev.com)
+ *               垂直微信小程序开发交流社区
+ *
+ * github地址: https://github.com/icindy/wxParse
+ *
+ * for: 微信小程序富文本解析
+ * detail : http://weappdev.com/t/wxparse-alpha0-1-html-markdown/184
+ */
+
+import wxDiscode from './wxDiscode';
+import HTMLParser from './htmlparser';
+
+function makeMap(str) {
+  const obj = {};
+  const items = str.split(',');
+  for (let i = 0; i < items.length; i += 1) obj[items[i]] = true;
+  return obj;
+}
+
+// Block Elements - HTML 5
+const block = makeMap('br,code,address,article,applet,aside,audio,blockquote,button,canvas,center,dd,del,dir,div,dl,dt,fieldset,figcaption,figure,footer,form,frameset,h1,h2,h3,h4,h5,h6,header,hgroup,hr,iframe,ins,isindex,li,map,menu,noframes,noscript,object,ol,output,p,pre,section,script,table,tbody,td,tfoot,th,thead,tr,ul,video');
+
+// Inline Elements - HTML 5
+const inline = makeMap('a,abbr,acronym,applet,b,basefont,bdo,big,button,cite,del,dfn,em,font,i,iframe,img,input,ins,kbd,label,map,object,q,s,samp,script,select,small,span,strike,strong,sub,sup,textarea,tt,u,var');
+
+// Elements that you can, intentionally, leave open
+// (and which close themselves)
+const closeSelf = makeMap('colgroup,dd,dt,li,options,p,td,tfoot,th,thead,tr');
+
+function removeDOCTYPE(html) {
+  const isDocument = /<body.*>([^]*)<\/body>/.test(html);
+  return isDocument ? RegExp.$1 : html;
+}
+
+function trimHtml(html) {
+  return html
+    .replace(/<!--.*?-->/gi, '')
+    .replace(/\/\*.*?\*\//gi, '')
+    .replace(/[ ]+</gi, '<')
+    .replace(/<script[^]*<\/script>/gi, '')
+    .replace(/<style[^]*<\/style>/gi, '');
+}
+
+function getScreenInfo() {
+  const screen = {};
+  wx.getSystemInfo({
+    success: (res) => {
+      screen.width = res.windowWidth;
+      screen.height = res.windowHeight;
+    },
+  });
+  return screen;
+}
+
+function html2json(html, customHandler, imageProp, host) {
+  // 处理字符串
+  html = removeDOCTYPE(html);
+  html = trimHtml(html);
+  html = wxDiscode.strDiscode(html);
+  // 生成node节点
+  const bufArray = [];
+  const results = {
+    nodes: [],
+    imageUrls: [],
+  };
+
+	const screen = getScreenInfo();
+  function Node(tag) {
+    this.node = 'element';
+    this.tag = tag;
+		
+		this.$screen = screen;
+  }
+
+  HTMLParser(html, {
+    start(tag, attrs, unary) {
+      // node for this element
+      const node = new Node(tag);
+
+      if (bufArray.length !== 0) {
+        const parent = bufArray[0];
+        if (parent.nodes === undefined) {
+          parent.nodes = [];
+        }
+      }
+
+      if (block[tag]) {
+        node.tagType = 'block';
+      } else if (inline[tag]) {
+        node.tagType = 'inline';
+      } else if (closeSelf[tag]) {
+        node.tagType = 'closeSelf';
+      }
+
+      node.attr = attrs.reduce((pre, attr) => {
+        const { name } = attr;
+        let { value } = attr;
+        if (name === 'class') {
+          node.classStr = value;
+        }
+        // has multi attibutes
+        // make it array of attribute
+        if (name === 'style') {
+          node.styleStr = value;
+        }
+        if (value.match(/ /)) {
+          value = value.split(' ');
+        }
+
+        // if attr already exists
+        // merge it
+        if (pre[name]) {
+          if (Array.isArray(pre[name])) {
+            // already array, push to last
+            pre[name].push(value);
+          } else {
+            // single value, make it array
+            pre[name] = [pre[name], value];
+          }
+        } else {
+          // not exist, put it
+          pre[name] = value;
+        }
+
+        return pre;
+      }, {});
+
+      // 优化样式相关属性
+      if (node.classStr) {
+        node.classStr += ` ${node.tag}`;
+      } else {
+        node.classStr = node.tag;
+      }
+      if (node.tagType === 'inline') {
+        node.classStr += ' inline';
+      }
+
+      // 对img添加额外数据
+      if (node.tag === 'img') {
+        let imgUrl = node.attr.src;
+        imgUrl = wxDiscode.urlToHttpUrl(imgUrl, imageProp.domain);
+        Object.assign(node.attr, imageProp, {
+          src: imgUrl || '',
+        });
+        if (imgUrl) {
+          results.imageUrls.push(imgUrl);
+        }
+      }
+
+      // 处理a标签属性
+      if (node.tag === 'a') {
+        node.attr.href = node.attr.href || '';
+      }
+
+      // 处理font标签样式属性
+      if (node.tag === 'font') {
+        const fontSize = [
+          'x-small',
+          'small',
+          'medium',
+          'large',
+          'x-large',
+          'xx-large',
+          '-webkit-xxx-large',
+        ];
+        const styleAttrs = {
+          color: 'color',
+          face: 'font-family',
+          size: 'font-size',
+        };
+        if (!node.styleStr) node.styleStr = '';
+        Object.keys(styleAttrs).forEach((key) => {
+          if (node.attr[key]) {
+            const value = key === 'size' ? fontSize[node.attr[key] - 1] : node.attr[key];
+            node.styleStr += `${styleAttrs[key]}: ${value};`;
+          }
+        });
+      }
+
+      // 临时记录source资源
+      if (node.tag === 'source') {
+        results.source = node.attr.src;
+      }
+
+      if (customHandler.start) {
+        customHandler.start(node, results);
+      }
+
+      if (unary) {
+        // if this tag doesn't have end tag
+        // like <img src="hoge.png"/>
+        // add to parents
+        const parent = bufArray[0] || results;
+        if (parent.nodes === undefined) {
+          parent.nodes = [];
+        }
+        parent.nodes.push(node);
+      } else {
+        bufArray.unshift(node);
+      }
+    },
+    end(tag) {
+      // merge into parent tag
+      const node = bufArray.shift();
+      if (node.tag !== tag) {
+        console.error('invalid state: mismatch end tag');
+      }
+
+      // 当有缓存source资源时于于video补上src资源
+      if (node.tag === 'video' && results.source) {
+        node.attr.src = results.source;
+        delete results.source;
+      }
+
+      if (customHandler.end) {
+        customHandler.end(node, results);
+      }
+
+      if (bufArray.length === 0) {
+        results.nodes.push(node);
+      } else {
+        const parent = bufArray[0];
+        if (!parent.nodes) {
+          parent.nodes = [];
+        }
+        parent.nodes.push(node);
+      }
+    },
+    chars(text) {
+      if (!text.trim()) return;
+
+      const node = {
+        node: 'text',
+        text,
+      };
+
+      if (customHandler.chars) {
+        customHandler.chars(node, results);
+      }
+
+      if (bufArray.length === 0) {
+        results.nodes.push(node);
+      } else {
+        const parent = bufArray[0];
+        if (parent.nodes === undefined) {
+          parent.nodes = [];
+        }
+        parent.nodes.push(node);
+      }
+    },
+  });
+
+  return results;
+}
+
+export default html2json;

src/components/u-parse/libs/htmlparser.js

+/**
+ *
+ * htmlParser改造自: https://github.com/blowsie/Pure-JavaScript-HTML5-Parser
+ *
+ * author: Di (微信小程序开发工程师)
+ * organization: WeAppDev(微信小程序开发论坛)(http://weappdev.com)
+ *               垂直微信小程序开发交流社区
+ *
+ * github地址: https://github.com/icindy/wxParse
+ *
+ * for: 微信小程序富文本解析
+ * detail : http://weappdev.com/t/wxparse-alpha0-1-html-markdown/184
+ */
+// Regular Expressions for parsing tags and attributes
+
+const startTag = /^<([-A-Za-z0-9_]+)((?:\s+[a-zA-Z0-9_:][-a-zA-Z0-9_:.]*(?:\s*=\s*(?:(?:"[^"]*")|(?:'[^']*')|[^>\s]+))?)*)\s*(\/?)>/;
+const endTag = /^<\/([-A-Za-z0-9_]+)[^>]*>/;
+const attr = /([a-zA-Z0-9_:][-a-zA-Z0-9_:.]*)(?:\s*=\s*(?:(?:"((?:\\.|[^"])*)")|(?:'((?:\\.|[^'])*)')|([^>\s]+)))?/g;
+
+function makeMap(str) {
+  const obj = {};
+  const items = str.split(',');
+  for (let i = 0; i < items.length; i += 1) obj[items[i]] = true;
+  return obj;
+}
+
+// Empty Elements - HTML 5
+const empty = makeMap('area,base,basefont,br,col,frame,hr,img,input,link,meta,param,embed,command,keygen,source,track,wbr');
+
+// Block Elements - HTML 5
+const block = makeMap('address,code,article,applet,aside,audio,blockquote,button,canvas,center,dd,del,dir,div,dl,dt,fieldset,figcaption,figure,footer,form,frameset,h1,h2,h3,h4,h5,h6,header,hgroup,hr,iframe,ins,isindex,li,map,menu,noframes,noscript,object,ol,output,p,pre,section,script,table,tbody,td,tfoot,th,thead,tr,ul,video');
+
+// Inline Elements - HTML 5
+const inline = makeMap('a,abbr,acronym,applet,b,basefont,bdo,big,br,button,cite,del,dfn,em,font,i,iframe,img,input,ins,kbd,label,map,object,q,s,samp,script,select,small,span,strike,strong,sub,sup,textarea,tt,u,var');
+
+// Elements that you can, intentionally, leave open
+// (and which close themselves)
+const closeSelf = makeMap('colgroup,dd,dt,li,options,p,td,tfoot,th,thead,tr');
+
+// Attributes that have their values filled in disabled="disabled"
+const fillAttrs = makeMap('checked,compact,declare,defer,disabled,ismap,multiple,nohref,noresize,noshade,nowrap,readonly,selected');
+
+function HTMLParser(html, handler) {
+  let index;
+  let chars;
+  let match;
+  let last = html;
+  const stack = [];
+
+  stack.last = () => stack[stack.length - 1];
+
+  function parseEndTag(tag, tagName) {
+    // If no tag name is provided, clean shop
+    let pos;
+    if (!tagName) {
+      pos = 0;
+    } else {
+      // Find the closest opened tag of the same type
+      tagName = tagName.toLowerCase();
+      for (pos = stack.length - 1; pos >= 0; pos -= 1) {
+        if (stack[pos] === tagName) break;
+      }
+    }
+    if (pos >= 0) {
+      // Close all the open elements, up the stack
+      for (let i = stack.length - 1; i >= pos; i -= 1) {
+        if (handler.end) handler.end(stack[i]);
+      }
+
+      // Remove the open elements from the stack
+      stack.length = pos;
+    }
+  }
+
+  function parseStartTag(tag, tagName, rest, unary) {
+    tagName = tagName.toLowerCase();
+
+    if (block[tagName]) {
+      while (stack.last() && inline[stack.last()]) {
+        parseEndTag('', stack.last());
+      }
+    }
+
+    if (closeSelf[tagName] && stack.last() === tagName) {
+      parseEndTag('', tagName);
+    }
+
+    unary = empty[tagName] || !!unary;
+
+    if (!unary) stack.push(tagName);
+
+    if (handler.start) {
+      const attrs = [];
+
+      rest.replace(attr, function genAttr(matches, name) {
+        const value = arguments[2] || arguments[3] || arguments[4] || (fillAttrs[name] ? name : '');
+
+        attrs.push({
+          name,
+          value,
+          escaped: value.replace(/(^|[^\\])"/g, '$1\\"'), // "
+        });
+      });
+
+      if (handler.start) {
+        handler.start(tagName, attrs, unary);
+      }
+    }
+  }
+
+  while (html) {
+    chars = true;
+
+    if (html.indexOf('</') === 0) {
+      match = html.match(endTag);
+
+      if (match) {
+        html = html.substring(match[0].length);
+        match[0].replace(endTag, parseEndTag);
+        chars = false;
+      }
+
+      // start tag
+    } else if (html.indexOf('<') === 0) {
+      match = html.match(startTag);
+
+      if (match) {
+        html = html.substring(match[0].length);
+        match[0].replace(startTag, parseStartTag);
+        chars = false;
+      }
+    }
+
+    if (chars) {
+      index = html.indexOf('<');
+      let text = '';
+      while (index === 0) {
+        text += '<';
+        html = html.substring(1);
+        index = html.indexOf('<');
+      }
+      text += index < 0 ? html : html.substring(0, index);
+      html = index < 0 ? '' : html.substring(index);
+
+      if (handler.chars) handler.chars(text);
+    }
+
+    if (html === last) throw new Error(`Parse Error: ${html}`);
+    last = html;
+  }
+
+  // Clean up any remaining tags
+  parseEndTag();
+}
+
+export default HTMLParser;

src/components/u-parse/libs/wxDiscode.js

+// HTML 支持的数学符号
+function strNumDiscode(str) {
+  str = str.replace(/∀/g, '∀');
+  str = str.replace(/∂/g, '∂');
+  str = str.replace(/∃/g, '∃');
+  str = str.replace(/∅/g, '∅');
+  str = str.replace(/∇/g, '∇');
+  str = str.replace(/∈/g, '∈');
+  str = str.replace(/∉/g, '∉');
+  str = str.replace(/∋/g, '∋');
+  str = str.replace(/∏/g, '∏');
+  str = str.replace(/∑/g, '∑');
+  str = str.replace(/−/g, '−');
+  str = str.replace(/∗/g, '∗');
+  str = str.replace(/√/g, '√');
+  str = str.replace(/∝/g, '∝');
+  str = str.replace(/∞/g, '∞');
+  str = str.replace(/∠/g, '∠');
+  str = str.replace(/∧/g, '∧');
+  str = str.replace(/∨/g, '∨');
+  str = str.replace(/∩/g, '∩');
+  str = str.replace(/∪/g, '∪');
+  str = str.replace(/∫/g, '∫');
+  str = str.replace(/∴/g, '∴');
+  str = str.replace(/∼/g, '∼');
+  str = str.replace(/≅/g, '≅');
+  str = str.replace(/≈/g, '≈');
+  str = str.replace(/≠/g, '≠');
+  str = str.replace(/≤/g, '≤');
+  str = str.replace(/≥/g, '≥');
+  str = str.replace(/⊂/g, '⊂');
+  str = str.replace(/⊃/g, '⊃');
+  str = str.replace(/⊄/g, '⊄');
+  str = str.replace(/⊆/g, '⊆');
+  str = str.replace(/⊇/g, '⊇');
+  str = str.replace(/⊕/g, '⊕');
+  str = str.replace(/⊗/g, '⊗');
+  str = str.replace(/⊥/g, '⊥');
+  str = str.replace(/⋅/g, '⋅');
+  return str;
+}
+
+// HTML 支持的希腊字母
+function strGreeceDiscode(str) {
+  str = str.replace(/Α/g, 'Α');
+  str = str.replace(/Β/g, 'Β');
+  str = str.replace(/Γ/g, 'Γ');
+  str = str.replace(/Δ/g, 'Δ');
+  str = str.replace(/Ε/g, 'Ε');
+  str = str.replace(/Ζ/g, 'Ζ');
+  str = str.replace(/Η/g, 'Η');
+  str = str.replace(/Θ/g, 'Θ');
+  str = str.replace(/Ι/g, 'Ι');
+  str = str.replace(/Κ/g, 'Κ');
+  str = str.replace(/Λ/g, 'Λ');
+  str = str.replace(/Μ/g, 'Μ');
+  str = str.replace(/Ν/g, 'Ν');
+  str = str.replace(/Ξ/g, 'Ν');
+  str = str.replace(/Ο/g, 'Ο');
+  str = str.replace(/Π/g, 'Π');
+  str = str.replace(/Ρ/g, 'Ρ');
+  str = str.replace(/Σ/g, 'Σ');
+  str = str.replace(/Τ/g, 'Τ');
+  str = str.replace(/Υ/g, 'Υ');
+  str = str.replace(/Φ/g, 'Φ');
+  str = str.replace(/Χ/g, 'Χ');
+  str = str.replace(/Ψ/g, 'Ψ');
+  str = str.replace(/Ω/g, 'Ω');
+
+  str = str.replace(/α/g, 'α');
+  str = str.replace(/β/g, 'β');
+  str = str.replace(/γ/g, 'γ');
+  str = str.replace(/δ/g, 'δ');
+  str = str.replace(/ε/g, 'ε');
+  str = str.replace(/ζ/g, 'ζ');
+  str = str.replace(/η/g, 'η');
+  str = str.replace(/θ/g, 'θ');
+  str = str.replace(/ι/g, 'ι');
+  str = str.replace(/κ/g, 'κ');
+  str = str.replace(/λ/g, 'λ');
+  str = str.replace(/μ/g, 'μ');
+  str = str.replace(/ν/g, 'ν');
+  str = str.replace(/ξ/g, 'ξ');
+  str = str.replace(/ο/g, 'ο');
+  str = str.replace(/π/g, 'π');
+  str = str.replace(/ρ/g, 'ρ');
+  str = str.replace(/ς/g, 'ς');
+  str = str.replace(/σ/g, 'σ');
+  str = str.replace(/τ/g, 'τ');
+  str = str.replace(/υ/g, 'υ');
+  str = str.replace(/φ/g, 'φ');
+  str = str.replace(/χ/g, 'χ');
+  str = str.replace(/ψ/g, 'ψ');
+  str = str.replace(/ω/g, 'ω');
+  str = str.replace(/ϑ/g, 'ϑ');
+  str = str.replace(/ϒ/g, 'ϒ');
+  str = str.replace(/ϖ/g, 'ϖ');
+  str = str.replace(/·/g, '·');
+  return str;
+}
+
+function strcharacterDiscode(str) {
+  // 加入常用解析
+  str = str.replace(/ /g, ' ');
+  str = str.replace(/ /g, ' ');
+  str = str.replace(/ /g, '　');
+  str = str.replace(/"/g, "'");
+  str = str.replace(/&/g, '&');
+  str = str.replace(/&lt;/g, '<');
+  str = str.replace(/&gt;/g, '>');
+  str = str.replace(/&#8226;/g, '•');
+
+  return str;
+}
+
+// HTML 支持的其他实体
+function strOtherDiscode(str) {
+  str = str.replace(/&OElig;/g, 'Œ');
+  str = str.replace(/&oelig;/g, 'œ');
+  str = str.replace(/&Scaron;/g, 'Š');
+  str = str.replace(/&scaron;/g, 'š');
+  str = str.replace(/&Yuml;/g, 'Ÿ');
+  str = str.replace(/&fnof;/g, 'ƒ');
+  str = str.replace(/&circ;/g, 'ˆ');
+  str = str.replace(/&tilde;/g, '˜');
+  str = str.replace(/&ensp;/g, '');
+  str = str.replace(/&emsp;/g, '');
+  str = str.replace(/&thinsp;/g, '');
+  str = str.replace(/&zwnj;/g, '');
+  str = str.replace(/&zwj;/g, '');
+  str = str.replace(/&lrm;/g, '');
+  str = str.replace(/&rlm;/g, '');
+  str = str.replace(/&ndash;/g, '–');
+  str = str.replace(/&mdash;/g, '—');
+  str = str.replace(/&lsquo;/g, '‘');
+  str = str.replace(/&rsquo;/g, '’');
+  str = str.replace(/&sbquo;/g, '‚');
+  str = str.replace(/&ldquo;/g, '“');
+  str = str.replace(/&rdquo;/g, '”');
+  str = str.replace(/&bdquo;/g, '„');
+  str = str.replace(/&dagger;/g, '†');
+  str = str.replace(/&Dagger;/g, '‡');
+  str = str.replace(/&bull;/g, '•');
+  str = str.replace(/&hellip;/g, '…');
+  str = str.replace(/&permil;/g, '‰');
+  str = str.replace(/&prime;/g, '′');
+  str = str.replace(/&Prime;/g, '″');
+  str = str.replace(/&lsaquo;/g, '‹');
+  str = str.replace(/&rsaquo;/g, '›');
+  str = str.replace(/&oline;/g, '‾');
+  str = str.replace(/&euro;/g, '€');
+  str = str.replace(/&trade;/g, '™');
+
+  str = str.replace(/&larr;/g, '←');
+  str = str.replace(/&uarr;/g, '↑');
+  str = str.replace(/&rarr;/g, '→');
+  str = str.replace(/&darr;/g, '↓');
+  str = str.replace(/&harr;/g, '↔');
+  str = str.replace(/&crarr;/g, '↵');
+  str = str.replace(/&lceil;/g, '⌈');
+  str = str.replace(/&rceil;/g, '⌉');
+
+  str = str.replace(/&lfloor;/g, '⌊');
+  str = str.replace(/&rfloor;/g, '⌋');
+  str = str.replace(/&loz;/g, '◊');
+  str = str.replace(/&spades;/g, '♠');
+  str = str.replace(/&clubs;/g, '♣');
+  str = str.replace(/&hearts;/g, '♥');
+
+  str = str.replace(/&diams;/g, '♦');
+  str = str.replace(/&#39;/g, "'");
+  return str;
+}
+
+function strDiscode(str) {
+  str = strNumDiscode(str);
+  str = strGreeceDiscode(str);
+  str = strcharacterDiscode(str);
+  str = strOtherDiscode(str);
+  return str;
+}
+
+function urlToHttpUrl(url, domain) {
+  if (/^\/\//.test(url)) {
+    return `https:${url}`;
+  } else if (/^\//.test(url)) {
+    return `https://${domain}${url}`;
+  }
+  return url;
+}
+
+export default {
+  strDiscode,
+  urlToHttpUrl,
+};

src/components/u-parse/readme.md

+## uParse 适用于 uni-app/mpvue 的富文本解析组件
+
+> 支持 Html、Markdown 解析，Fork自: [mpvue-wxParse](https://github.com/F-loat/mpvue-wxParse)
+
+
+## 属性
+
+| 名称             | 类型          | 默认值        | 描述               |
+| -----------------|--------------- | ------------- | ----------------  |
+| loading          | Boolean        | false         | 数据加载状态       |
+| className        | String         | —             | 自定义 class 名称  |
+| content          | String         | —             | 渲染内容           |
+| noData           | String         | 数据不能为空   | 空数据时的渲染展示  |
+| startHandler     | Function       | 见源码         | 自定义 parser 函数 |
+| endHandler       | Function       | null          | 自定义 parser 函数 |
+| charsHandler     | Function       | null          | 自定义 parser 函数 |
+| imageProp        | Object         | 见下文        | 图片相关参数        |
+
+### 自定义 parser 函数具体介绍
+
+* 传入的参数为当前节点 `node` 对象及解析结果 `results` 对象，例如 `startHandler(node, results)`
+* 无需返回值，通过对传入的参数直接操作来完成需要的改动
+* 自定义函数会在原解析函数处理之后执行
+
+### imageProp 对象具体属性
+
+| 名称              | 类型           | 默认值        | 描述                |
+| -----------------|--------------- | ------------- | ------------------ |
+| mode             | String         | 'aspectFit'   | 图片裁剪、缩放的模式 |
+| padding          | Number         | 0             | 图片内边距          |
+| lazyLoad         | Boolean        | false         | 图片懒加载          |
+| domain           | String         | ''            | 图片服务域名        |
+
+## 事件
+
+| 名称             | 参数              | 描述              |
+| -----------------|----------------- | ----------------  |
+| preview          | 图片地址，原始事件 | 预览图片时触发     |
+| navigate         | 链接地址，原始事件 | 点击链接时触发     |
+
+## 基本使用方法
+
+
+``` vue
+<template>
+  <div>
+    <u-parse :content="article" @preview="preview" @navigate="navigate" />
+  </div>
+</template>
+
+<script>
+import uParse from '@/components/u-parse/u-parse.vue'
+
+export default {
+  components: {
+    uParse
+  },
+  data () {
+    return {
+      article: '<div>我是HTML代码</div>'
+    }
+  },
+  methods: {
+    preview(src, e) {
+      // do something
+    },
+    navigate(href, e) {
+      // do something
+    }
+  }
+}
+</script>
+
+<style>
+@import url("@/components/u-parse/u-parse.css");
+</style>
+```
+
+
+## 渲染 Markdown
+
+> 先将 markdown 转换为 html 即可
+
+```
+npm install marked
+```
+
+``` js
+import marked from 'marked'
+import uParse from '@/components/u-parse/u-parse.vue'
+
+export default {
+  components: {
+    uParse
+  },
+  data () {
+    return {
+      article: marked(`#hello, markdown!`)
+    }
+  }
+}
+```

src/components/u-parse/u-parse.css

+/**
+ * author: Di (微信小程序开发工程师)
+ * organization: WeAppDev(微信小程序开发论坛)(http://weappdev.com)
+ *         垂直微信小程序开发交流社区
+ *
+ * github地址: https://github.com/icindy/wxParse
+ *
+ * for: 微信小程序富文本解析
+ * detail : http://weappdev.com/t/wxparse-alpha0-1-html-markdown/184
+ */
+
+.wxParse {
+  width: 100%;
+  font-family: Helvetica, sans-serif;
+  font-size: 30upx;
+  color: #666;
+  line-height: 1.8;
+}
+
+.wxParse view {
+  word-break: hyphenate;
+}
+
+.wxParse .inline {
+  display: inline;
+  margin: 0;
+  padding: 0;
+}
+
+.wxParse .div {
+  margin: 0;
+  padding: 0;
+}
+
+.wxParse .h1 .text {
+  font-size: 2em;
+  margin: 0.67em 0;
+}
+.wxParse .h2 .text {
+  font-size: 1.5em;
+  margin: 0.83em 0;
+}
+.wxParse .h3 .text {
+  font-size: 1.17em;
+  margin: 1em 0;
+}
+.wxParse .h4 .text {
+  margin: 1.33em 0;
+}
+.wxParse .h5 .text {
+  font-size: 0.83em;
+  margin: 1.67em 0;
+}
+.wxParse .h6 .text {
+  font-size: 0.67em;
+  margin: 2.33em 0;
+}
+
+.wxParse .h1 .text,
+.wxParse .h2 .text,
+.wxParse .h3 .text,
+.wxParse .h4 .text,
+.wxParse .h5 .text,
+.wxParse .h6 .text,
+.wxParse .b,
+.wxParse .strong {
+  font-weight: bolder;
+}
+
+
+.wxParse .p {
+  margin: 1em 0;
+}
+
+.wxParse .i,
+.wxParse .cite,
+.wxParse .em,
+.wxParse .var,
+.wxParse .address {
+  font-style: italic;
+}
+
+.wxParse .pre,
+.wxParse .tt,
+.wxParse .code,
+.wxParse .kbd,
+.wxParse .samp {
+  font-family: monospace;
+}
+.wxParse .pre {
+  overflow: auto;
+  background: #f5f5f5;
+  padding: 16upx;
+  white-space: pre;
+  margin: 1em 0upx;
+}
+.wxParse .code {
+  display: inline;
+  background: #f5f5f5;
+}
+
+.wxParse .big {
+  font-size: 1.17em;
+}
+
+.wxParse .small,
+.wxParse .sub,
+.wxParse .sup {
+  font-size: 0.83em;
+}
+
+.wxParse .sub {
+  vertical-align: sub;
+}
+.wxParse .sup {
+  vertical-align: super;
+}
+
+.wxParse .s,
+.wxParse .strike,
+.wxParse .del {
+  text-decoration: line-through;
+}
+
+.wxParse .strong,
+.wxParse .s {
+  display: inline;
+}
+
+.wxParse .a {
+  color: deepskyblue;
+}
+
+.wxParse .video {
+  text-align: center;
+  margin: 22upx 0;
+}
+
+.wxParse .video-video {
+  width: 100%;
+}
+
+.wxParse .img {
+  display: inline-block;
+  width: 0;
+  height: 0;
+  max-width: 100%;
+  overflow: hidden;
+}
+
+.wxParse .blockquote {
+  margin: 10upx 0;
+  padding: 22upx 0 22upx 22upx;
+  font-family: Courier, Calibri, "宋体";
+  background: #f5f5f5;
+  border-left: 6upx solid #dbdbdb;
+}
+.wxParse .blockquote .p {
+  margin: 0;
+}
+
+.wxParse .ul, .wxParse .ol {
+  display: block;
+  margin: 1em 0;
+  padding-left: 33upx;
+}
+.wxParse .ol {
+  list-style-type: disc;
+}
+.wxParse .ol {
+  list-style-type: decimal;
+}
+.wxParse .ol>weixin-parse-template,.wxParse .ul>weixin-parse-template {
+  display: list-item;
+  align-items: baseline;
+  text-align: match-parent;
+}
+
+.wxParse .ol>.li,.wxParse .ul>.li {
+  display: list-item;
+  align-items: baseline;
+  text-align: match-parent;
+}
+.wxParse .ul .ul, .wxParse .ol .ul {
+  list-style-type: circle;
+}
+.wxParse .ol .ol .ul, .wxParse .ol .ul .ul, .wxParse .ul .ol .ul, .wxParse .ul .ul .ul {
+    list-style-type: square;
+}
+
+.wxParse .u {
+  text-decoration: underline;
+}
+.wxParse .hide {
+  display: none;
+}
+.wxParse .del {
+  display: inline;
+}
+.wxParse .figure {
+  overflow: hidden;
+}
+
+.wxParse .table {
+  width: 100%;
+}
+.wxParse .thead, .wxParse .tfoot, .wxParse .tr {
+  display: flex;
+  flex-direction: row;
+}
+.wxParse .tr {
+  width:100%;
+  display: flex;
+  border-right: 2upx solid #e0e0e0;
+  border-bottom: 2upx solid #e0e0e0;
+}
+.wxParse .th,
+.wxParse .td {
+  display: flex;
+  width: 1276upx;
+  overflow: auto;
+  flex: 1;
+  padding: 11upx;
+  border-left: 2upx solid #e0e0e0;
+}
+.wxParse .td:last {
+  border-top: 2upx solid #e0e0e0;
+}
+.wxParse .th {
+  background: #f0f0f0;
+  border-top: 2upx solid #e0e0e0;
+}

src/components/u-parse/u-parse.vue

+<!--**
+ * forked from：https://github.com/F-loat/mpvue-wxParse
+ *
+ * github地址: https://github.com/dcloudio/uParse
+ *
+ * for: uni-app框架下 富文本解析
+ */-->
+
+<template>
+<!--基础元素-->
+<div class="wxParse" :class="className" v-if="!loading">
+  <block v-for="(node,index) of nodes" :key="index">
+    <wxParseTemplate :node="node" />
+  </block>
+</div>
+</template>
+
+<script>
+import HtmlToJson from './libs/html2json';
+import wxParseTemplate from './components/wxParseTemplate0';
+
+export default {
+  name: 'wxParse',
+  props: {
+    loading: {
+      type: Boolean,
+      default: false,
+    },
+    className: {
+      type: String,
+      default: '',
+    },
+    content: {
+      type: String,
+      default: '',
+    },
+    noData: {
+      type: String,
+      default: '<div style="color: red;">数据不能为空</div>',
+    },
+    startHandler: {
+      type: Function,
+      default() {
+        return (node) => {
+          node.attr.class = null;
+          node.attr.style = null;
+        };
+      },
+    },
+    endHandler: {
+      type: Function,
+      default: null,
+    },
+    charsHandler: {
+      type: Function,
+      default: null,
+    },
+    imageProp: {
+      type: Object,
+      default() {
+        return {
+          mode: 'aspectFit',
+          padding: 0,
+          lazyLoad: false,
+          domain: '',
+        };
+      },
+    },
+  },
+  components: {
+    wxParseTemplate,
+  },
+  data() {
+    return {
+      imageUrls: [],
+    };
+  },
+  computed: {
+    nodes() {
+      const {
+        content,
+        noData,
+        imageProp,
+        startHandler,
+        endHandler,
+        charsHandler,
+      } = this;
+      const parseData = content || noData;
+      const customHandler = {
+        start: startHandler,
+        end: endHandler,
+        chars: charsHandler,
+      };
+      const results = HtmlToJson(parseData, customHandler, imageProp, this);
+      this.imageUrls = results.imageUrls;
+      console.log(results)
+      return results.nodes;
+    },
+  },
+  methods: {
+    navigate(href, $event) {
+      this.$emit('navigate', href, $event);
+    },
+    preview(src, $event) {
+      if (!this.imageUrls.length) return;
+      wx.previewImage({
+        current: src,
+        urls: this.imageUrls,
+      });
+      this.$emit('preview', src, $event);
+    },
+    removeImageUrl(src) {
+      const { imageUrls } = this;
+      imageUrls.splice(imageUrls.indexOf(src), 1);
+    },
+  },
+};
+</script>

src/components/up-modal.vue

+<template>
+  <div
+    class="masking" @touchmove.stop="touchmoveHandler"
+    @catchtouchmove="touchmoveHandler"
+    v-if="up">
+    <div class="position">
+      <div class="new-people">
+        <img class="bck" mode='aspectFill' src="https://qiniu.runworld.com.cn/assets/images/up.png" alt="">
+        <img class="close-icon" @click.stop="onSure" src="https://qiniu.runworld.com.cn/assets/images/ic_popup_close.png" alt="">
+        <div class="footer">
+          <p class="black">恭喜升级<span>{{ value.member_grade_vo.next_name }}</span></p>
+          <p class="gray">您的积分已到达{{ value.member_grade_vo.score }}升级身份</p>
+          <div class="btn-green" @click="onSure">确定</div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+  export default {
+    name: 'modal',
+    props: {
+      value: Object,
+      default: {},
+    },
+    data() {
+      return {
+        up: this.value.member_grade_vo,
+      }
+    },
+    methods: {
+      onSure() {
+        this.up = false;
+        this.$emit('on-sure', true);
+      },
+    },
+  }
+</script>
+
+<style lang='scss' scoped>
+  .masking{
+    width: 100vw;
+    height: 100vh;
+    background:rgba(0,0,0,.5);
+    position: fixed;
+    top: 0;
+    left: 0;
+    z-index: 9999;
+    .position{
+      position: absolute;
+      left: 50%;
+      transform: translate(-50%,-50%);
+      top: 45%;
+      .new-people{
+        height: 9rem;
+        width: 5.92rem;
+        /*background: url('https://qiniu.runworld.com.cn/assets/images/pic_popup1.png') center no-repeat;*/
+        /*background-size: contain;*/
+        text-align: center;
+        position: relative;
+        box-sizing: border-box;
+        .bck{
+          height: 9rem;
+          width: 5.92rem;
+          border-radius: 0.25rem;
+          img{
+            height: 9rem;
+            width: 5.92rem;
+            border-radius: 0.25rem;
+          }
+        }
+        .close-icon{
+          width: 0.24rem;
+          height: 0.24rem;
+          position: absolute;
+          top: 2.5rem;
+          right: 0.12rem;
+          padding: 0.2rem;
+        }
+        .footer{
+          position: absolute;
+          bottom: 0.4rem;
+          left: 1.1rem;
+          .black{
+            font-size:0.38rem;
+            font-weight:500;
+            color:rgba(51,51,51,1);
+            line-height: 0.9rem;
+            span{
+              color:#FBB11B;
+            }
+          }
+          .gray{
+            font-size:0.3rem;
+            font-weight:400;
+            color:rgba(153,153,153,1);
+          }
+          .btn-green{
+            width:2.72rem;
+            height:0.8rem;
+            background:linear-gradient(115deg,rgba(122,232,231,1) 0%,rgba(34,164,163,1) 100%);
+            border-radius:0.4rem;
+            color: #FFFFFF;
+            font-size: 0.32rem;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            margin: 0.3rem auto auto auto;
+          }
+        }
+      }
+    }
+  }
+</style>

src/components/xy-customhead/xy-customhead.vue

+<template>
+	<view>
+		<view class="uni-head" :class="colorMode==false?colorType:''" :style="naviBarHeight+bgColors">
+
+			<view class="mode" v-if="mode=='deNav'">
+				<view class="deNav" v-if="textAlign==false" @tap="goBack" :style="tltTs">
+					<view class="fhico" v-if="isReturn"></view>
+					{{title}}
+				</view>
+				<view class="deNav" v-else style="width: 100%;" :style="tltTs">
+					<view class="fhico" style="position: absolute;left: 3.3333%;" v-if="isReturn"></view>
+					{{title}}
+				</view>
+				<view class="qxsearch" v-if="RbtnMode==true" @tap.stop="handleRbtn" :style="tltTss">
+					<slot v-if="$slots['customRbtn']" name="customRbtn"></slot>
+					<view v-else class="rbtn"></view>
+				</view>
+			</view>
+
+			<view class="mode" v-if="mode=='searchNav'">
+				<view class="searchNav" :style="tltTs">
+					<view class="searchBox" :style="searchCss1">
+						<!-- #ifdef MP -->
+						<view class="fhico" :class="mBInfoH!=0?'mpfh':''" @tap="qxsearch"></view>
+						<!-- #endif -->
+						<input confirm-type="search" v-model="searchVal" @confirm="searchConfirm" :focus="searchfocus"
+							:adjust-position="false" :placeholder="searchTips" placeholder-style="color:#ccc"
+							:style="mBInfoH!=0?'height:'+mBInfoH+'px;margin-top:0;margin-left:0;width:60%;':''" />
+						<!-- #ifndef MP -->
+						<view class="qxsearch" @tap="qxsearch">取消</view>
+						<!-- #endif -->
+					</view>
+					<view class="searchBox" :style="searchCss2">
+						<view class="qxsearch" @tap.stop="handleLbtn" :style="mBInfoH!=0?'height:'+mBInfoH+'px;line-height:'+mBInfoH+'px;':''">
+							<slot v-if="$slots['customLbtn']" name="customLbtn"></slot>
+							<view v-else>{{title}}</view>
+						</view>
+						<view class="searchip"
+							:style="mBInfoH!=0?'height:'+mBInfoH+'px;margin-top:0;margin-left:0;width:54%;':''"
+							@tap="clickip">{{searchTips}}</view>
+						<!-- #ifndef MP -->
+						<view class="qxsearch" @tap.stop="handleRbtn" style="float: right;">
+							<slot v-if="$slots['customRbtn']" name="customRbtn"></slot>
+							<view v-else class="rbtn"></view>
+						</view>
+						<!-- #endif -->
+					</view>
+				</view>
+			</view>
+		</view>
+
+		<view v-if="mode=='searchNav'">
+			<view class="searchCon" :style="'top:'+ sotop +'px;'+searchCss3" style="margin-bottom: 15px;" v-if="$slots['customSearchCon']">
+				<slot name="customSearchCon"></slot>
+			</view>
+			<view v-else class="searchCon" :style="'top:'+ sotop +'px;'+searchCss3" style="margin-bottom: 15px;">
+				<view class="searchHistoryTlt" v-if="searchHistoryList!=''">历史记录<text @tap="empty">清空</text></view>
+				<view class="searchHistoryItem" v-if="searchHistoryList!=''">
+					<view @tap="searchHistoryBtn(index)" v-for="(item, index) in searchHistoryList.slice(0,15)"
+						:key="index">{{item}}</view>
+				</view>
+
+				<view class="searchHistoryTlt" style="color: red;" v-if="searchLists!=''">热门搜索</view>
+				<view class="searchHistoryItems" v-if="searchLists!=''">
+					<view @tap="searchHistoryBtns(index)" v-for="(item, index) in searchLists" :key="index">
+						<text :style="index<=2?'color: red':'color: #666'">{{index+1}}</text>{{item}}
+					</view>
+				</view>
+			</view>
+		</view>
+
+		<view :style="naviBarHeight" style="box-sizing: border-box;"></view>
+	</view>
+</template>
+
+<script>
+	export default {
+		name:"customHead",
+		props: {
+			title: {
+				type: String,
+				default: ''
+			},
+			textAlign: {
+				type: [Boolean, String],
+				default: true
+			},
+			isReturn: {
+				type: [Boolean, String],
+				default: false
+			},
+			RbtnMode: {
+				type: [Boolean, String],
+				default: false
+			},
+			mode: {
+				type: String,
+				default: 'deNav'
+			},
+			colorMode: {
+				type: [Boolean, String],
+				default: false
+			},
+			colorType: {
+				type: String,
+				default: 'green'
+			},
+			bgColor: {
+				type: String,
+				default: '#0fac9c'
+			},
+			searchTips: {
+				type: String,
+				default: ''
+			},
+			searchLists: Array
+		},
+		data() {
+			return {
+				titleHeight: 0, //状态栏和导航栏的总高度
+				statusBarHeight: 0, //状态栏高度
+				naviBarHeight: 0, //导航栏高度
+				sotop: 0,
+				mBInfoH: 0,
+				searchVal: '',
+				searchHistoryList: [], //历史记录
+				bgColors: '',
+
+				tltTs: '',
+				tltTss: '',
+				searchShow: false,
+				searchCss1: 'left:6.6666%;opacity: 0;z-index: -2;',
+				searchCss2: '',
+				searchCss3: 'opacity: 0;z-index: -2;',
+				searchfocus: false,
+
+			}
+		},
+		mounted() {
+			const res = uni.getSystemInfoSync()
+			const system = res.platform
+			this.statusBarHeight = res.statusBarHeight
+
+			if (this.colorMode == true) {
+				this.bgColors = 'background:' + this.bgColor
+			}
+
+			//#ifdef MP
+			const mBInfo = uni.getMenuButtonBoundingClientRect();
+			this.titleHeight = (mBInfo.top - this.statusBarHeight) * 2 + mBInfo.height;
+			this.naviBarHeight = 'height:' + (this.titleHeight + this.statusBarHeight) + 'px;'
+			const mBInfoL = mBInfo.left
+			const mBInfoR = mBInfo.right
+			const mBInfoT = mBInfo.top
+			const mBInfoB = mBInfo.bottom
+			const mBInfoH = mBInfo.height
+			this.tltTs = 'top:' + mBInfoT + 'px;left:0px;bottom:' + mBInfoB + 'px;height:' + mBInfoH + 'px;line-height:' + mBInfoH + 'px'
+			this.tltTss = 'position: absolute;width: auto;top:' + mBInfoT + 'px;right:'+(mBInfoR-mBInfoL+15)+'px;bottom:' + mBInfoB + 'px;height:' + mBInfoH + 'px;line-height:' + mBInfoH + 'px'
+			this.sotop = this.titleHeight + this.statusBarHeight
+			this.mBInfoH = mBInfoH
+			//#endif
+
+			//#ifndef APP-PLUS || MP
+			this.naviBarHeight = 'height:55px;'
+			this.tltTs = 'height:55px;line-height:55px;left:0;top:0;'
+			this.sotop = 55
+			this.tltTss = 'float: right;width: auto;margin-right: 15px;'
+			//#endif
+
+			//#ifdef APP-PLUS
+			this.naviBarHeight = 'height:' + (55 + this.statusBarHeight) + 'px;padding-top: ' + this.statusBarHeight + 'px;'
+			this.tltTs = 'height:55px;line-height:55px;left:0;top:0;'
+			this.sotop = 55 + this.statusBarHeight
+			this.tltTss = 'float: right;width: auto;margin-right: 15px;'
+			//#endif
+			this.$emit('getnaviBarH',this.statusBarHeight*2)
+		},
+		methods: {
+			goBack() {
+				uni.navigateBack({
+					delta: 1
+				})
+			},
+			clickip() {
+				var _this = this
+				_this.searchVal = ''
+				uni.getStorage({
+					key: 'searchList',
+					success: function(res) {
+						_this.searchHistoryList = JSON.parse(res.data)
+					}
+				})
+				_this.searchCss1 = 'left:6.6666%;opacity: 0;z-index: -2;'
+				_this.searchCss2 = 'opacity: 0;z-index: -2;'
+				setTimeout(function() {
+					_this.searchCss1 = 'left:0;opacity: 1;z-index: 999;'
+				}, 0)
+				_this.searchCss3 = 'opacity: 1;z-index: 998;'
+				_this.searchfocus = true
+
+
+			},
+			qxsearch() {
+				var _this = this
+				_this.searchCss1 = 'left:6.6666%;opacity: 0;z-index: -2;'
+				_this.searchCss2 = 'opacity: 1;z-index: 999;'
+				_this.searchCss3 = 'opacity: 0;z-index: -2;'
+				_this.searchfocus = false
+				_this.searchVal = ''
+			},
+			handleLbtn() {
+				this.$emit('Lbtn', null)
+			},
+			handleRbtn() {
+				this.$emit('Rbtn', null)
+			},
+			searchConfirm() {
+				var _this = this
+				_this.$emit('searchConfirm', [_this.searchVal])
+				if (_this.searchVal == '') {
+					return false
+				} else {
+					if (!_this.searchHistoryList.includes(_this.searchVal)) {
+						_this.searchHistoryList.unshift(_this.searchVal);
+						uni.setStorage({
+							key: 'searchList',
+							data: JSON.stringify(_this.searchHistoryList)
+						});
+					} else {
+						//有搜索记录，删除之前的旧记录，将新搜索值重新push到数组首位
+						let i = _this.searchHistoryList.indexOf(_this.searchVal);
+						_this.searchHistoryList.splice(i, 1);
+						_this.searchHistoryList.unshift(_this.searchVal);
+						uni.setStorage({
+							key: 'searchList',
+							data: JSON.stringify(_this.searchHistoryList)
+						});
+					}
+				}
+				_this.searchVal = ''
+			},
+
+			//清空历史记录
+			empty() {
+				var _this = this
+				uni.showModal({
+				    title: '提示',
+				    content: '是否清空历史记录',
+				    success: function (res) {
+				        if (res.confirm) {
+				            uni.removeStorage({
+				            	key: 'searchList'
+				            });
+							_this.searchHistoryList = [];
+				        }
+				    }
+				});
+				
+			},
+			searchHistoryBtn(e) {
+				var _this = this
+				_this.searchVal = _this.searchHistoryList[e]
+				_this.searchConfirm()
+			},
+			searchHistoryBtns(e) {
+				var _this = this
+				_this.searchVal = _this.searchLists[e]
+				_this.searchConfirm()
+			}
+		}
+	}
+</script>
+
+<style lang="scss">
+	.uni-head {
+		width: 100%;
+		font-size: 18px;
+		line-height: 18px;
+		color: #fff;
+		text-align: center;
+		box-sizing: border-box;
+		position: fixed;
+		top: 0;
+		left: 0;
+		overflow: hidden;
+		z-index: 999;
+
+	}
+
+	.uni-head.red {
+		background: -webkit-gradient(linear, left top, right top, from(#ff557f), to(#e3390e));
+		background: -o-linear-gradient(left, #ff557f, #e3390e);
+		background: linear-gradient(to right, #ff557f, #e3390e);
+	}
+
+	.uni-head.yellow {
+		background: -webkit-gradient(linear, left top, right top, from(#ffbe3a), to(#ff763a));
+		background: -o-linear-gradient(left, #ffbe3a, #ff763a);
+		background: linear-gradient(to right, #ffbe3a, #ff763a);
+	}
+
+	.uni-head.blue {
+		background: -webkit-gradient(linear, left top, right top, from(#55d5fc), to(#3f8cfe));
+		background: -o-linear-gradient(left, #55d5fc, #3f8cfe);
+		background: linear-gradient(to right, #55d5fc, #3f8cfe);
+	}
+
+	.uni-head.green {
+		background: -webkit-gradient(linear, left top, right top, from(#14cbe7), to(#0fac9c));
+		background: -o-linear-gradient(left, #14cbe7, #0fac9c);
+		background: linear-gradient(to right, #14cbe7, #0fac9c);
+	}
+
+	.mode {
+		float: left;
+		width: 100%;
+		position: relative;
+	}
+
+	.mode .deNav {
+		text-align: center;
+		position: absolute;
+		z-index: 3;
+		font-size: 16px;
+		padding: 0 3.3333%;
+		box-sizing: border-box;
+	}
+
+	.mode .searchNav {
+		position: relative;
+		width: 100%;
+		z-index: 999;
+		font-size: 16px;
+		box-sizing: border-box;
+		text-align: left;
+	}
+
+	.mode .searchNav text {
+		width: auto;
+		padding-right: 3.3333%;
+		height: 100%;
+		float: left;
+		display: inline-block;
+		color: #fff;
+	}
+
+	.mode .searchNav input {
+		width: 78%;
+		height: 35px;
+		background: #fff;
+		border-radius: 35px;
+		vertical-align: middle;
+		display: inline-block;
+		padding: 0 15px;
+		font-size: 32rpx;
+		box-sizing: border-box;
+		color: #737373;
+		display: block;
+		float: left;
+		margin-top: 10px;
+		margin-left: 3.3333%;
+		outline: none;
+	}
+
+	.searchip {
+		width: 64%;
+		height: 35px;
+		line-height: 35px;
+		background: #fff;
+		border-radius: 35px;
+		display: block;
+		float: left;
+		padding: 0 15px;
+		margin-top: 10px;
+		font-size: 32rpx;
+		box-sizing: border-box;
+		color: #ccc;
+	}
+
+	.searchBox {
+		position: absolute;
+		width: 100%;
+		height: 100%;
+		top: 0;
+		transition: all 0.4s;
+	}
+
+	.searchCon {
+		position: fixed;
+		top: 0;
+		right: 0;
+		bottom: 0;
+		left: 0;
+		background: #FFFFFF;
+		transition: all 0.4s;
+	}
+
+	.qxsearch {
+		float: left;
+		display: block;
+		width: 18%;
+		height: 55px;
+		line-height: 55px;
+		text-align: center;
+		font-size: 16px;
+		color: #fff;
+		box-sizing: border-box;
+		padding: 0 15px;
+		overflow: hidden;
+		position: relative;
+	}
+
+	.qxsearch .rbtn {
+		width: 24px;
+		height: 14px;
+		position: absolute;
+		top: 50%;
+		left: 50%;
+		margin-left: -12px;
+		margin-top: -10px;
+		border-top: 2px solid #ffffff;
+		border-bottom: 2px solid #ffffff;
+	}
+
+	.qxsearch .rbtn::after {
+		content: "";
+		width: 24px;
+		height: 2px;
+		position: absolute;
+		top: 50%;
+		left: 0;
+		margin-top: -1px;
+		background: #fff;
+
+	}
+
+	.fhico {
+		width: 20rpx;
+		height: 100%;
+		float: left;
+		margin-right: 10px;
+		position: relative;
+	}
+
+	.fhico::after {
+		content: "";
+		width: 20rpx;
+		height: 20rpx;
+		position: absolute;
+		top: 50%;
+		margin-top: -12rpx;
+		left: 3px;
+		border-left: 2px solid #ffffff;
+		border-bottom: 2px solid #ffffff;
+		transform: rotate(45deg);
+	}
+
+	.mpfh {
+		padding: 0 3.3333%;
+	}
+
+	.mpfh::after {
+		left: 50%;
+	}
+
+	.searchHistoryTlt {
+		width: 100%;
+		padding: 0 3.3333%;
+		box-sizing: border-box;
+		height: 55px;
+		line-height: 55px;
+		font-size: 16px;
+		color: #434343;
+		float: left;
+	}
+
+	.searchHistoryTlt text {
+		float: right;
+		color: #00aaff;
+		display: block;
+	}
+
+	.searchHistoryItem,
+	.searchHistoryItems {
+		width: 100%;
+		padding: 0 3.3333%;
+		box-sizing: border-box;
+		float: left;
+	}
+
+	.searchHistoryItem view {
+		font-size: 16px;
+		padding: 3px 10px;
+		background: #f5f5f5;
+		display: inline-block;
+		border-radius: 50px;
+		margin-right: 15px;
+		margin-bottom: 15px;
+		color: #7c7c7c;
+	}
+
+	.searchHistoryItems view {
+		float: left;
+		width: 50%;
+		box-sizing: border-box;
+		padding-right: 10px;
+		padding-bottom: 5px;
+		margin-bottom: 10px;
+		overflow: hidden;
+		text-overflow: ellipsis;
+		white-space: nowrap;
+		font-size: 16px;
+		color: #666;
+	}
+
+	.searchHistoryItems view text {
+		display: block;
+		float: left;
+		width: 20px;
+		margin-right: 5px;
+		padding-left: 5px;
+		box-sizing: border-box;
+	}
+</style>

src/configs/env.js

+/* eslint-disable no-unused-vars */
+const devDomain = 'https://api-officeasy.dankal.cn/v1/'
+const proDomain = 'https://api.officeasy.com/v1/'
+const apiDomain = ''
+const testDomain = 'https://api-staging.officeasy.dankal.cn/v1/'
+const imgDomain = 'https://qiniu.runworld.com.cn/' // 七牛云
+
+module.exports = {
+    apiDomain: devDomain,
+    imgDomain,
+};

src/jslibs/dk-flyio.js

+/* eslint-disable new-cap,import/no-mutable-exports */
+import { apiDomain } from '@/configs/env';
+
+let fly = require('flyio/dist/npm/wx');
+
+fly = new fly();
+fly.config.baseURL = apiDomain;
+// 添加请求拦截器
+let timer = null
+fly.interceptors.request.use((request) => {
+  // 给所有请求添加自定义header
+  request.headers['X-Access-Token'] = 'token';
+  // 打印出请求体
+  console.log('打印出请求体', request);
+  // 终止请求
+  // var err=new Error("xxx")
+  // err.request=request
+  // return Promise.reject(new Error(""))
+
+  if (!timer) timer = setTimeout(() => { wx.showLoading({ title: '加载中', mask: true }) }, 1000);
+
+  // 可以显式返回request, 也可以不返回，没有返回值时拦截器中默认返回request
+  return request;
+});
+
+// 添加响应拦截器，响应拦截器会在then/catch处理之前执行
+fly.interceptors.response.use(
+    (response) => {
+      if (timer) {
+        clearTimeout(timer)
+        timer = null
+        wx.hideLoading()
+      }
+
+      // console.log(response, 'response');
+      const { data } = response;
+      if (data.error) {
+        wx.showToast({ title: data.error.message, icon: 'none', duration: 3000 })
+        return Promise.resolve(data);
+      }
+      return response
+    },
+    (error) => {
+      if (timer) {
+        clearTimeout(timer)
+        timer = null
+        wx.hideLoading()
+      }
+
+
+      if (!error.response) {
+        wx.showToast({ title: '请检查网络设备', icon: 'none', duration: 3000 })
+        return
+      }
+
+      // 发生网络错误后会走到这里
+      // console.log(error, 'error');
+      const { status, data } = error.response;
+
+      switch (status) {
+        case 401:
+        case 412:
+          wx.setStorageSync('token', '')
+          wx.navigateTo({ url: '/pages/auth' })
+          break;
+        default:
+          wx.showToast({ title: data.error.message, icon: 'none', duration: 3000 })
+          Promise.resolve(data);
+      }
+    },
+);
+export default fly;

src/main.js

+import Vue from 'vue';
+import App from '@/App';
+import store from '@/store'; // 状态管理
+import common from '@/mixin/common' // 全局函数
+import globalData from '@/utils/global-data';
+import MpvueRouterPatch from './static/index'; // 路由拦截
+
+Vue.use(MpvueRouterPatch);
+Vue.config.productionTip = false;
+
+Vue.mixin(common)
+Vue.prototype.globalData = globalData
+
+
+const app = new Vue({
+  mpType: 'app',
+  store,
+  ...App,
+});
+app.$mount();

src/manifest.json

+{
+    "name" : "",
+    "appid" : "",
+    "description" : "",
+    "versionName" : "1.0.0",
+    "versionCode" : "100",
+    "transformPx" : false,
+    "app-plus" : {
+        /* 5+App特有相关 */
+        "usingComponents" : true,
+        "splashscreen" : {
+            "alwaysShowBeforeRender" : true,
+            "waiting" : true,
+            "autoclose" : true,
+            "delay" : 0
+        },
+        "modules" : {},
+        /* 模块配置 */
+        "distribute" : {
+            /* 应用发布信息 */
+            "android" : {
+                /* android打包配置 */
+                "permissions" : [
+                    "<uses-permission android:name=\"android.permission.CHANGE_NETWORK_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.MOUNT_UNMOUNT_FILESYSTEMS\"/>",
+                    "<uses-permission android:name=\"android.permission.READ_CONTACTS\"/>",
+                    "<uses-permission android:name=\"android.permission.VIBRATE\"/>",
+                    "<uses-permission android:name=\"android.permission.READ_LOGS\"/>",
+                    "<uses-permission android:name=\"android.permission.ACCESS_WIFI_STATE\"/>",
+                    "<uses-feature android:name=\"android.hardware.camera.autofocus\"/>",
+                    "<uses-permission android:name=\"android.permission.WRITE_CONTACTS\"/>",
+                    "<uses-permission android:name=\"android.permission.ACCESS_NETWORK_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.CAMERA\"/>",
+                    "<uses-permission android:name=\"android.permission.RECORD_AUDIO\"/>",
+                    "<uses-permission android:name=\"android.permission.GET_ACCOUNTS\"/>",
+                    "<uses-permission android:name=\"android.permission.MODIFY_AUDIO_SETTINGS\"/>",
+                    "<uses-permission android:name=\"android.permission.READ_PHONE_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.CHANGE_WIFI_STATE\"/>",
+                    "<uses-permission android:name=\"android.permission.WAKE_LOCK\"/>",
+                    "<uses-permission android:name=\"android.permission.CALL_PHONE\"/>",
+                    "<uses-permission android:name=\"android.permission.FLASHLIGHT\"/>",
+                    "<uses-permission android:name=\"android.permission.ACCESS_COARSE_LOCATION\"/>",
+                    "<uses-feature android:name=\"android.hardware.camera\"/>",
+                    "<uses-permission android:name=\"android.permission.ACCESS_FINE_LOCATION\"/>",
+                    "<uses-permission android:name=\"android.permission.WRITE_SETTINGS\"/>"
+                ]
+            },
+            "ios" : {},
+            /* ios打包配置 */
+            "sdkConfigs" : {}
+        }
+    },
+    /* SDK配置 */
+    "quickapp" : {},
+    /* 快应用特有相关 */
+    "mp-weixin" : {
+        /* 微信小程序特有相关 */
+        "appid" : "wxd2117e47b702df32",
+        "setting" : {
+            "urlCheck" : false
+        },
+        "useExtendedLib" : {
+            "weui" : true
+        },
+        "usingComponents" : true
+    },
+    "mp-alipay" : {
+        "usingComponents" : true
+    },
+    "mp-baidu" : {
+        "usingComponents" : true
+    },
+    "mp-toutiao" : {
+        "usingComponents" : true
+    },
+    "mp-qq" : {
+        "usingComponents" : true
+    }
+}

src/mixin/common.js

+import { imgDomain } from '@/configs/env'
+
+export default {
+  data() {
+    return {
+      imgDomain,
+    };
+  },
+  methods: {
+    /*
+     * 保留当前页面，跳转到应用内的某个页面。但是不能跳到 tabbar 页面。使用 uni.navigateBack 可以返回到原页面。小程序中页面栈最多十层
+     * @param url 跳转链接
+    */
+    navigateTo(url) {
+      uni.navigateTo({ url })
+    },
+
+    /*
+     * 关闭当前页面，跳转到应用内的某个页面。但是不允许跳转到 tabbar 页面
+     * @param url 跳转链接
+    */
+    redirectTo(url) {
+      uni.redirectTo({ url })
+    },
+
+    /*
+     * 关闭所有页面，打开到应用内的某个页面
+     * @param url 跳转链接
+    */
+    reLaunch(url) {
+      uni.reLaunch({ url })
+    },
+
+    /*
+     * 跳转到 tabBar 页面，并关闭其他所有非 tabBar 页面
+     * @param url 跳转链接
+    */
+    switchTab(url) {
+      uni.switchTab({ url })
+    },
+
+    /*
+     * 关闭当前页面，返回上一页面或多级页面。可通过 getCurrentPages 获取当前的页面栈，决定需要返回几层
+     * @param delta 返回的页面数
+    */
+    navigateBack(delta) {
+      uni.navigateBack({ delta })
+    },
+
+    /*
+     * 放大图片
+     * @param list 图片列表（没有包含七牛域名的图片链接自动加上）
+     * @param index 当前显示图片索引
+    */
+    openImage(list, index = 0) {
+      const listNew = []
+      list.forEach((item) => {
+        listNew.push(item.indexOf(imgDomain) >= 0 ? item : (imgDomain + item))
+      })
+
+      uni.previewImage({
+        current: listNew[index], // 当前显示图片的http链接
+        urls: listNew, // 需要预览的图片http链接列表
+      })
+    },
+
+    /*
+     * 拨打电话
+     * @param phoneNumber 电话号码
+    */
+    makePhoneCall(phoneNumber) {
+      uni.makePhoneCall({
+        phoneNumber,
+      })
+    },
+
+    /*
+     * 获取时间戳
+     * @param date 日期
+    */
+    getTimestamp(date) {
+      const timestamp = new Date(date.replace(/-/g, '/')).getTime();
+      // const timestampNow = new Date().getTime();
+      // console.log(`timestampNow:${timestampNow}`, `timestamp:${timestamp}`)
+      return timestamp
+    },
+
+    /*
+     * 单位数转两位数
+     * @param num 单位数
+    */
+    getTwoDigits(num) {
+      return Number(num) < 10 ? `0${num}` : num
+    },
+
+    /*
+     * 节流处理（点击提交按钮可用）
+     * @param time 毫秒
+    */
+    throttleAction(time = 1000) {
+      const nowTime = new Date().getTime()
+      const lastTime = this.lastTimestamp
+      console.log(`lastTime:${lastTime}`, `nowTime:${nowTime}`)
+      this.lastTimestamp = nowTime
+      if (nowTime - lastTime > time) return true
+      return false
+    },
+
+    /*
+     * 截取链接参数（扫描二维码时可用）
+     * @param name 参数名称
+     * @param url1 链接地址
+    */
+    getQueryString(name, url) {
+      //  正则筛选地址链接中的参数
+      const reg = new RegExp(`(^|&)${name}=([^&]*)(&|$)`);
+      // 匹配目标参数
+      const result = `&${url.split('?')[1]}`.substr(1).match(reg);
+      // 返回参数值
+      return result ? decodeURIComponent(result[2]) : null;
+    },
+
+    // 判断字符串是否为空|或者仅为空格
+    isEmptyString(val) {
+      if (!val) return true;
+      const nullReg = '^[ ]+$';
+      const re = new RegExp(nullReg);
+      return re.test(val);
+    },
+
+    // 判断对象是否为空
+    isEmptyObject(val) {
+      return JSON.stringify(val) === '{}'
+    },
+
+    // 判断手机号码是否合法
+    isPhone(val) {
+      const phoneReg = /^[1][3,4,5,6,7,8,9][0-9]{9}$/;
+      return phoneReg.test(val)
+    },
+
+    // 判断身份证号码是否合法
+    isIdcard(val) {
+      const idcardReg = /^[1-9]\d{7}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}$|^[1-9]\d{5}[1-9]\d{3}((0\d)|(1[0-2]))(([0|1|2]\d)|3[0-1])\d{3}([0-9]|X)$/;
+      return idcardReg.test(val)
+    },
+
+    // 判断邮箱是否合法
+    isEmail(val) {
+      const emailReg = /^[A-Za-z0-9\u4e00-\u9fa5]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/
+      return emailReg.test(val)
+    },
+  },
+}

src/mixin/painting.js

+const paintingConfigs = {
+  width: 580,
+  height: 1040,
+  clear: true,
+  views: [
+    {
+      type: 'image',
+      width: 580,
+      height: 751,
+      top: 15,
+      left: 0,
+      url: 'https://qiniu.runworld.com.cn/wxapp/images/pic_home_107@3x.png',
+    },
+    {
+      type: 'rect',
+      width: 580,
+      height: 289,
+      left: 0,
+      top: 751,
+      background: '#fff',
+    },
+    {
+      type: 'image',
+      width: 127,
+      height: 42,
+      left: 30,
+      top: 960,
+      url: 'https://qiniu.runworld.com.cn/assets/images/logo／1.png',
+    },
+    {
+      type: 'text',
+      left: 60,
+      top: 850,
+      content: '2019.6.30~2019.7.5',
+      fontSize: 24,
+      color: '#666666',
+    },
+    {
+      type: 'text',
+      width: 520,
+      left: 30,
+      right: 30,
+      top: 775,
+      lineHeight: 40,
+      MaxLineNumber: 2,
+      content: '搞事 | 职场荣耀争霸赛火热报名ING火热报名ING',
+      breakWord: true,
+      fontSize: 28,
+      bolder: true,
+      color: '#333333',
+    },
+    {
+      type: 'text',
+      left: 60,
+      top: 890,
+      lineHeight: 40,
+      width: 250,
+      MaxLineNumber: 2,
+      breakWord: true,
+      content: '12',
+      fontSize: 24,
+      color: '#666666',
+    },
+    {
+      type: 'image',
+      width: 18,
+      height: 19,
+      left: 30,
+      top: 850,
+      url: 'https://qiniu.runworld.com.cn/assets/images/icon／sj／1.png',
+    },
+    {
+      type: 'image',
+      width: 18,
+      height: 25,
+      left: 30,
+      top: 890,
+      url: 'https://qiniu.runworld.com.cn/assets/images/icon／dw／1.png',
+    },
+    {
+      type: 'image',
+      width: 160,
+      height: 180,
+      left: 400,
+      top: 840,
+      url: 'https://qiniu.runworld.com.cn/wxapp/images/1565348887(1).png',
+    },
+  ],
+}
+
+export default paintingConfigs

src/package.json

+{
+    "id": "xy-customhead",
+    "name": "customhead自定义导航栏",
+    "version": "1.0.0",
+    "description": "自定义导航栏 支持App，h5，微信小程序，自定义文字，按钮，背景色，带搜索",
+    "keywords": [
+        "自定义导航栏"
+    ]
+}
\ No newline at end of file

src/packageCourse/course/details.vue

+<template>
+	<div class="contain">
+		<div class="course-top"
+			:style="[{background:`url(${background}) no-repeat`},{height:naviBarH},{backgroundSize: '100% 100%'}]">
+			<customHead mode='deNav' :title='headtitle' :textAlign='textAlign' :isReturn='isReturn'
+				:colorMode='colorMode' :colorType='colorType' :RbtnMode='RbtnMode' @getnaviBarH="getnaviBarH">
+			</customHead>
+		</div>
+
+		<div class="course-main">
+			<div class="time clearfix">
+				<div class="f-l">
+					<p>开始时间</p>
+					<span>10:30</span>
+				</div>
+
+				<div class="f-r">
+					<p>开始时间</p>
+					<span>10:30</span>
+				</div>
+				<div>
+					<p>2020.08.03 周一</p>
+					<image class="lines" :src='require("../../assets/images/lines.png")' mode="widthFix"></image>
+					<div class="tips2">
+						<template v-if="type==''">
+							<template v-if="user=='student'&&feedbacktype==1">
+								<image :src='require("../../assets/images/tips2-icon.png")' mode="widthFix"></image>
+								<span>老师已反馈</span>
+							</template>
+							<template v-if="isfinish">
+								<image :src='require("../../assets/images/finishright.png")' mode="widthFix"></image>
+								<span>课程已结束</span>
+							</template>
+							<template v-if="!isfinish">
+								<image :src='require("../../assets/images/clock.png")' mode="widthFix"></image>
+								<span>距离上课还有3分5秒</span>
+							</template>
+						</template>
+							<!-- 取消审核中 -->
+							<template v-if="type=='cancel'">
+								<image :src='require("../../assets/images/clock.png")' mode="widthFix"></image>
+								<span>取消审核中</span>
+							</template>
+							<template v-if="type=='change'">
+								<image :src='require("../../assets/images/clock.png")' mode="widthFix"></image>
+								<span>调课审核中</span>
+							</template>
+						
+					</div>
+				</div>
+			</div>
+
+			<div class="course-scroll" :style="{maxHeight:scrollH}">
+				<div class="list">
+					<h1 class="list_title">课程信息</h1>
+					<div class="list_item clearfix">
+						<label>课程类型</label>
+						<div class="f-r txt-r">海外名校精品项目</div>
+					</div>
+					<div class="list_item clearfix">
+						<label>小时数</label>
+						<div class="f-r txt-r">1.00 小时</div>
+					</div>
+					<div class="list_item clearfix">
+						<label>课程类型</label>
+						<div class="f-r txt-r">上课地址</div>
+					</div>
+					<div class="list_item clearfix">
+						<label>授课方式</label>
+						<div class="f-r txt-r">面授</div>
+					</div>
+					<div class="list_item clearfix">
+						<label>项目ID</label>
+						<div class="f-r txt-r">123456</div>
+					</div>
+				</div>
+				<div class="list">
+					<h1 class="list_title">基本信息</h1>
+					<div class="list_item clearfix">
+						<label>学生姓名</label>
+						<div class="f-r txt-r">Susan</div>
+					</div>
+					<div class="list_item clearfix">
+						<label>老师姓名</label>
+						<div class="f-r txt-r">Sunny</div>
+					</div>
+					<div class="list_item clearfix">
+						<label>教务姓名</label>
+						<div class="f-r txt-r">JoJo</div>
+					</div>
+
+				</div>
+				<div class="list clearfix" style="padding-bottom:20rpx ;">
+				    <span class="list_title">打卡状态</span>
+					<div class="f-r txt-r clearfix">
+						<!-- 打卡状态 0未打卡，1已打卡 -->
+						<template v-if="clocktype==1">
+							<div class="f-r">打卡成功</div>
+							<image class="type_icon" :src='require("../../assets/images/success.png")' mode="widthFix"></image>
+						</template>
+						<template v-else>
+							<div class="f-r">未打卡</div>
+							<image class="type_icon" :src='require("../../assets/images/nofinish.png")' mode="widthFix"></image>
+						</template>
+						
+					</div>
+				</div>
+			</div>
+
+		</div>
+        <div class="detail_bottom" v-if="type==''">
+			<!-- 学员课程详情底部 -->
+			<template v-if="user=='student'">
+				<div class="clearfix">
+					<div class="bottom_icon f-l" v-if="feedbacktype==1">
+						<image :src='require("../../assets/images/tips1-icon.png")' mode="widthFix"></image>
+						<p>查看反馈</p>
+					</div>
+					<div class="f-r flex" :style="{width:flexW}">
+						<navigator url="" class="detail_btn redborder flex-1" v-if="recommandtype==1">查看评价</navigator>
+						<navigator url="" class="detail_btn redborder flex-1" v-if="recommandtype==0">课程评价</navigator>
+						<navigator url="" class="detail_btn redbg flex-1" v-if="clocktype==0">课程打卡</navigator>
+						</div>
+				</div>
+			</template>
+			<!-- 老师课程详情底部 -->
+			<template v-if="user=='teacher'">
+				<div class="clearfix">
+					<template v-if="feedbacktype==0&&clocktype==0">
+						<div class="bottom_icon f-l" >
+							<image :src='require("../../assets/images/tips1-icon.png")' mode="widthFix"></image>
+							<p>取消</p>
+						</div>
+						<div class="bottom_icon f-l">
+							<image :src='require("../../assets/images/tips1-icon.png")' mode="widthFix"></image>
+							<p>调课</p>
+						</div>
+					</template>
+					<div class="f-r flex" :style="{width:flexW}">
+						<navigator url="" class="detail_btn redborder flex-1" v-if="feedbacktype==1">查看反馈</navigator>
+						<navigator url="" class="detail_btn redborder flex-1" v-if="feedbacktype==0">课程反馈</navigator>
+						<navigator url="" class="detail_btn redbg flex-1" v-if="clocktype==0">课程打卡</navigator>
+						</div>
+				</div>
+			</template>
+		</div>
+	</div>
+</template>
+
+<script>
+	import customHead from "@/components/xy-customhead/xy-customhead.vue"
+	export default {
+		components: {
+			customHead
+		},
+		data() {
+			return {
+				background: require('@/static/bg.png'),
+				headtitle: '我的课程', // 头部标题
+				textAlign: true, // 文字是否居中，默认居中
+				isReturn: true, // 是否开启返回箭头，默认关闭
+				naviBarH: '', //背景图高度
+				scrollH: '', //可滚动区域
+				clocktype:0,//打卡状态
+				recommandtype:0,//评价状态
+				feedbacktype:1,//反馈状态
+				flexW:'',//flex长度
+				user:'',//用户身份
+				type:'',//取消，调课状态时
+				isfinish:true,//课程是否结束
+			}
+		},
+		methods: {
+			// 获取标题高度
+			getnaviBarH(val) {
+				this.naviBarH = 410 + val + 'rpx'
+				this.scrollH = 'calc(100vh - 232rpx - ' + val + 'rpx)'
+			},
+			// 修改flex长度
+			changFlex(){
+				if(this.feedbacktype==0&&this.user!=='teacher'){
+					this.flexW = '100%'
+				}
+				else{
+					this.flexW = 'calc(100% - 156rpx)'
+				}
+				if(this.user=='teacher'&&this.feedbacktype==0&&this.clocktype==0){
+					this.flexW = 'calc(100% - 196rpx)'
+				}else{
+					this.flexW = '100%'
+				}
+				
+			}
+			
+
+		},
+		created() {
+			this.getnaviBarH()
+			this.$nextTick(function(){
+				this.changFlex()
+			})
+			
+			
+		},
+		onLoad(options) {
+			this.user = options.user
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.contain {
+		.course-top {
+			height: 410rpx;
+			background: linear-gradient(135deg, #FF3334 0%, #FF6E58 100%);
+			border-radius: 0px 0px 22rpx 22rpx;
+
+		}
+
+		.course-main {
+			box-sizing: border-box;
+			margin: -250rpx 30rpx 0;
+
+			.time {
+				position: relative;
+				font-size: 24rpx;
+				font-family: PingFangSC-Semibold, PingFang SC;
+				font-weight: 600;
+				color: #FFFFFF;
+				padding: 0 30rpx;
+
+				&>div {
+					&:nth-child(3) {
+						position: absolute;
+						top: 50%;
+						left: 50%;
+						transform: translate(-50%, -50%);
+						text-align: center;
+					}
+
+					&:nth-child(2) {
+						text-align: right;
+					}
+				}
+
+				p {
+					margin-bottom: 8rpx;
+				}
+
+				span {
+					font-size: 60rpx;
+				}
+
+				.lines {
+					width: 244rpx;
+				}
+
+				.tips2 {
+					image {
+						width: 34rpx;
+						margin-right: 10rpx;
+						vertical-align: text-top;
+					}
+
+					span {
+						font-size: 24rpx;
+					}
+				}
+			}
+
+			.course-scroll {
+				overflow: auto;
+				box-sizing: border-box;
+				overflow-x: initial;
+				border-radius: 24rpx;
+				// height: calc(100vh - 272rpx - 88rpx);
+				margin: 40rpx 0rpx 0;
+
+				.list {
+					box-sizing: border-box;
+					background: #FFFFFF;
+					box-shadow: 0px 0px 32rpx 0px rgba(0, 0, 0, 0.1);
+					border-radius: 24rpx;
+					padding: 30rpx 30rpx 2rpx;
+					margin-bottom: 20rpx;
+                    font-family: PingFangSC-Regular, PingFang SC;
+					.list_title {
+						font-size: 28rpx;
+						font-family: PingFangSC-Medium, PingFang SC;
+						font-weight: 500;
+						color: #333333;
+					}
+
+					.list_item {
+						height: 90rpx;
+						line-height: 90rpx;
+						border-bottom: 1px solid #EEEEEE;
+						font-size: 28rpx;
+                        &:nth-last-child(1){
+							border-bottom:none;
+						}
+						label {
+							color: #999999;
+						}
+
+						&>div {
+							color: #333333;
+						}
+					}
+					.type_icon{
+						width: 32rpx;
+						height: 32rpx;
+						margin-right: 8rpx;
+					}
+				}
+			}
+
+		}
+	// 固定在底部
+	.detail_bottom{
+		position: fixed;
+		bottom: 0;
+		left: 0;
+		right: 0;
+		height: 136rpx;
+		padding: 20rpx 30rpx 30rpx;	
+        background: #FFFFFF;
+		font-family: PingFangSC-Regular, PingFang SC;
+		&::before{
+			position: absolute;
+			top: 0;
+			left: 0;
+			right: 0;
+			content: '';
+			height: 1px;
+			background-color: #eee;
+		}
+		.bottom_icon{
+			text-align: center;
+			&:nth-child(n+1){
+				margin-left: 40rpx;
+			}
+			image{
+				width: 40rpx;
+				height: 40rpx;
+				font-size: 24rpx;
+				color: #333333;
+			}
+		}
+		.flex {
+			width: calc(100% - 156rpx);
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+			flex-direction: row;
+		}
+		.flex-1{
+			flex: 1;
+		}
+		navigator{
+			display:inline-block;
+			height: 88rpx;
+			line-height: 88rpx;
+			text-align: center;
+			&:nth-child(n+1){
+				margin-left: 20rpx;
+			}
+		}
+		.detail_btn{
+			font-size: 32rpx;
+			border-radius: 44rpx;
+			&.redborder{
+			border: 2rpx solid #FF3334;
+			color: #FF3334;
+		    }
+			&.redbg{
+			background: linear-gradient(135deg, #FF6E58 0%, #FF3334 100%);
+			color: #fff;
+			}
+		}
+	}
+	}
+</style>

src/packageCourse/course/index.vue

+<template>
+	<div class="contain">
+		<div class="course-top" :style="[{background:`url(${background}) no-repeat`},{height:naviBarH},{backgroundSize: '100% 100%'}]">
+			<customHead mode='deNav' :title='headtitle' :textAlign='textAlign' :isReturn='isReturn'
+				:colorMode='colorMode' :colorType='colorType' :RbtnMode='RbtnMode' @getnaviBarH="getnaviBarH"></customHead>
+		</div>
+		
+		<div class="course-main">
+			<div class="time" @click="selectDatePicker">{{date?date:today}}</div>
+			<jpTimePicker ref='date-time' :datestype="type" :datestring='dateString'  @change='dateTimeChange'>
+			</jpTimePicker>
+			<div class="course-scroll" :style="{height:scrollH}">
+				<div class="calendar"><calendar :selColor="selColor" :bgColor="selColor"></calendar></div>
+				<template v-if="courseList.length>0">
+					<div class="line"></div>
+					<div class="course" v-for="(item,index) in courseList" @click="toDetail(item.courseid)">
+						<div class="course-t clearfix"><div class="f-l"><span class="course-icon big">大班课</span><span class="course-title">上课时间</span></div><div class="f-r"><span class="course-type">课程已结束</span></div></div>
+						<div class="course-center clearfix"><div class="f-l"><span class="start">10:30</span><image class="arrow" src="../../static/arrow.png" mode="widthFix"></image><span class="end">24:00</span></div><div class="f-r"><image class="arrow-left" src="../../static/more.png" mode="widthFix"></div></div>
+						<div class="course-bottom"><image src="../../static/userimg.png" mode="widthFix"></image><span>Sunny老师</span><span>海外名校精品项目</span><span>50分钟</span></div>
+					</div>
+				</template>
+				<template v-else>
+					<div class="course-lack">
+						<image :src="lackImg" mode="widthFix"></image>
+						<p class="lack-txt">暂无课程～</p>
+					</div>
+				</template>
+				
+			</div>
+			
+			
+		</div>
+
+	</div>
+</template>
+
+<script>
+	import jpTimePicker from '@/components/jp-timePicker/jp-timePicker.vue'
+	import calendar from '@/components/tale-calendar/calendar.vue'
+	import customHead from "@/components/xy-customhead/xy-customhead.vue"
+	export default {
+		components: {
+			jpTimePicker,
+			calendar,
+			customHead
+		},
+		data() {
+			return {
+				courseList:[
+					{courseid:1,start:'9:30',end:'10:30',type:'1'},
+					{courseid:2,start:'15:30',end:'16:30',type:'2'},
+					{courseid:3,start:'15:30',end:'16:30',type:'2'},
+					],
+				background: require('@/static/bg.png'),
+				dateString: '',//默认日期
+				date:'',
+				today:'',//今天日期
+				type: 'year-month',
+				selColor:'linear-gradient(135deg, #FF6E58 0%, #FF3334 100%)',
+				lackImg:require('@/assets/images/course_lack.png'),//缺省图片
+				headtitle: '我的课程', // 头部标题
+				textAlign: true, // 文字是否居中，默认居中
+				isReturn: true, // 是否开启返回箭头，默认关闭
+				naviBarH:'',//背景图高度
+				scrollH:'',//可滚动区域
+				user:'teacher',//当前账户的身份
+			}
+		},
+		methods: {
+			selectDatePicker() {
+				this.$refs['date-time'].show();
+			},
+			dateTimeChange(value) {
+				console.log(value)
+			    let temptime = value.replace('-','年')
+			    this.date = temptime.concat('月')
+			    this.dateString = value
+			    
+			   },
+			   // 转化日期
+			   changeToday(){
+			    let day = new Date()
+			    let year = day.getFullYear()
+			    let months = day.getMonth()+1
+				if(months<10){
+					months = '0'+months
+				}
+			    this.today = year+'年'+months+'月'
+			   },
+			   // 获取标题高度
+			   getnaviBarH(val){
+				   this.naviBarH = 410+val+'rpx'
+				   this.scrollH = 'calc(100vh - 272rpx - '+val+'rpx)'
+			   },
+			   // 跳转详情
+			   toDetail(id){
+				   uni.navigateTo({
+				   	url:'details?courseid='+id+'&user='+this.user
+				   })
+			   }
+		},
+		created(){
+			this.changeToday()
+			this.getnaviBarH()
+		},
+		mounted(){
+			
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.contain {
+		.course-top {
+			height: 410rpx;
+			background: linear-gradient(135deg, #FF3334 0%, #FF6E58 100%);
+			border-radius: 0px 0px 22rpx 22rpx;
+			
+		}
+
+		.course-main {
+			box-sizing: border-box;
+			margin: -222rpx 30rpx 0;
+			.time {
+				position: relative;
+				font-size: 40rpx;
+				font-family: PingFangSC-Semibold, PingFang SC;
+				font-weight: 600;
+				color: #FFFFFF;
+				line-height: 44rpx;
+				&::after{
+					content: '';
+					width: 0;
+					height: 0;
+					position: absolute;
+					right: 412rpx;
+					top: calc(50% + 8rpx);
+					transform: translateY(-50%);
+					border: 16rpx solid #fff;
+					border-radius: 4rpx;
+					border-left-color: transparentize($color: #000000, $amount: 1);
+					border-right-color: transparentize($color: #000000, $amount: 1);
+					border-bottom-color: transparentize($color: #000000, $amount: 1);
+					
+					
+				}
+			}
+			.course-scroll{
+				overflow: auto;
+				box-sizing: border-box;
+				overflow-x: initial;
+				border-radius: 24rpx;
+				// height: calc(100vh - 272rpx - 88rpx);
+				margin: 40rpx 0rpx 0;
+				.calendar{
+					box-sizing: border-box;
+				}
+				.line{
+					width: 60rpx;
+					height: 8rpx;
+					background: #D8D8D8;
+					border-radius: 4rpx;
+					margin: 30rpx auto;
+				}
+				.course{
+					box-sizing: border-box;
+					background: #FFFFFF;
+					box-shadow: 0px 0px 32rpx 0px rgba(0, 0, 0, 0.1);
+					border-radius: 24rpx;
+					padding: 32rpx 30rpx 28rpx;
+					margin-bottom: 20rpx;
+					.course-icon{
+						font-size: 20rpx;
+						font-family: PingFangSC-Semibold, PingFang SC;
+						font-weight: 600;
+						border-radius: 4rpx;
+						padding: 8rpx 10rpx;
+						&.big{
+							background: #FDEBE9;
+							color: #FF3334;
+						}
+						&.small{
+							background: #EFF2FE;
+							color: #6386FA;
+						}
+					}
+					.course-title{
+						margin-left: 10rpx;
+						font-size: 26rpx;
+						font-family: PingFangSC-Semibold, PingFang SC;
+						font-weight: 600;
+						color: #333333;
+					}
+					.course-type{
+						font-size: 26rpx;
+						color: #999999;
+					}
+					.start,.end{
+						font-size: 40rpx;
+						font-family: PingFangSC-Semibold, PingFang SC;
+						font-weight: 600;
+						color: #333333;
+					}
+					.course-t{
+						height: 42rpx;
+						line-height: 42rpx;
+					}
+					.course-center,.course-bottom{
+						margin-top: 40rpx;
+					}
+					.arrow{
+						width: 32rpx;
+						height: 32rpx;
+						margin:0 20rpx;
+					}
+					.arrow-left{
+						width: 32rpx;
+						height: 32rpx;
+					}
+					.course-bottom{
+						font-size: 24rpx;
+						color: #999999;
+						image{
+							width: 44rpx;
+							height: 44rpx;
+							vertical-align: middle;
+						}
+						span{
+							padding: 0  20rpx;
+							border-right:1px solid #999 ;
+						}
+					}
+				}
+			    .course-lack{
+					text-align: center;
+					background: #FFFFFF;
+					box-shadow: 0px 0px 32rpx 0px rgba(0, 0, 0, 0.1);
+					border-radius: 24rpx;
+					padding: 80rpx 0;
+					margin-top: 30rpx;
+					image{
+						width: 272rpx;
+						height: 182rpx;
+						margin: 0 auto;
+					}
+					.lack-txt{
+						margin-top: 28rpx;
+						font-size: 32rpx;
+						color: #333333;
+					}
+				}
+			}
+			
+			
+		}
+
+	}
+</style>

src/pages copy.json

+{
+	"pages": [ //pages数组中第一项表示应用启动页，参考：https://uniapp.dcloud.io/collocation/pages
+		{
+			"path": "pages/login/index",
+			"style": {
+				"navigationBarTitleText": "SIA",
+				"backgroundColor": "#f7fbff"
+			}
+		},
+		{
+			"path": "pages/home/order-share/add",
+			"style": {
+				"navigationBarTitleText": "共享设置",
+				"mp-weixin": {
+					"usingComponents": {
+						"mp-dialog": "weui-miniprogram/picker/picker"
+					}
+				}
+			}
+		},
+		{
+			"path": "pages/home/order-share/details",
+			"style": {
+				"navigationBarTitleText": "面单分享"
+			}
+		},
+		{
+			"path": "pages/home/order-share/index",
+			"style": {
+				"navigationBarTitleText": "面单分享"
+			}
+		},
+		{
+			"path": "pages/home/order-share/balance",
+			"style": {
+				"navigationBarTitleText": "追加/减少余额"
+			}
+		},
+		{
+			"path": "pages/home/order-share/record",
+			"style": {
+				"navigationBarTitleText": "分享记录"
+			}
+		},
+		{
+			"path": "pages/home/index",
+			"style": {
+				"navigationBarTitleText": "首页",
+				"navigationBarBackgroundColor": "#42b4ff",
+				"backgroundColor-color": "#f1f1f1"
+			}
+		},
+		{
+			"path": "pages/shop-order/index",
+			"style": {
+				"navigationBarTitleText": "店铺订单"
+			}
+		},
+		{
+			"path": "pages/printing/index",
+			"style": {
+				"navigationBarTitleText": "自由打印"
+			}
+		},
+		{
+			"path": "pages/user/index",
+			"style": {
+				"navigationBarTitleText": "我的"
+			}
+		},
+
+		{
+			"path": "pages/example/counter"
+		},
+		{
+			"path": "pages/example/wxParse",
+			"style": {
+				"navigationBarTitleText": "文章-富文本"
+			}
+		},
+		{
+			"path": "pages/example/button"
+		},
+		{
+			"path": "pages/example/components"
+		},
+		{
+			"path": "pages/index"
+		}, {
+			"path": "pages/home/index/index",
+			"style": {
+				"navigationBarTitleText": "首页",
+				"enablePullDownRefresh": false
+			}
+		}, {
+			"path": "pages/home/index/resources",
+			"style": {
+				"navigationBarTitleText": "",
+				"enablePullDownRefresh": false
+			}
+		}, {
+			"path": "pages/course/index",
+			"style": {
+				"navigationBarTitleText": "我的课程",
+				"enablePullDownRefresh": false,
+				"navigationStyle": "custom" 
+			}
+		}, {
+			"path": "pages/channels/channels",
+			"style": {
+				"navigationBarTitleText": "资源录入",
+				"enablePullDownRefresh": false,
+				"navigationStyle": "custom" 
+			}
+		}
+	    ,{
+            "path" : "pages/course/details",
+            "style" :                                                                                    
+            {
+                "navigationBarTitleText": "课程详情",
+                "enablePullDownRefresh": false,
+				"navigationStyle": "custom" 
+            }
+            
+        }
+    ],
+	"globalStyle": {
+		"navigationBarTextStyle": "black",
+		"navigationBarTitleText": "WeChat",
+		"navigationBarBackgroundColor": "#fff",
+		"backgroundColor": "#fff"
+	}
+
+}

src/pages.json

+{
+  "globalStyle": {
+    "navigationBarTextStyle": "black",
+    "navigationBarTitleText": "SIA",
+    "navigationBarBackgroundColor": "#fff",
+    "backgroundColor": "#fff"
+  },
+  "pages": [
+    {
+      "path": "pages/example/counter",
+      "style": {}
+    },
+    {
+      "path": "pages/example/wxParse",
+      "style": {
+        "navigationBarTitleText": "文章-富文本"
+      }
+    },
+    {
+      "path": "pages/example/button",
+      "style": {}
+    },
+    {
+      "path": "pages/index",
+      "style": {}
+    },
+    {
+      "path": "pages/home/index/resources",
+      "style": {
+        "navigationBarTitleText": "",
+        "enablePullDownRefresh": false
+      }
+    },
+    {
+      "path": "pages/channels/channels",
+      "style": {
+        "navigationBarTitleText": "资源录入",
+        "enablePullDownRefresh": false,
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "path": "pages/course/details",
+      "style": {
+        "navigationBarTitleText": "课程详情",
+        "enablePullDownRefresh": false,
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "path": "pages/course/index",
+      "style": {
+        "navigationBarTitleText": "我的课程",
+        "enablePullDownRefresh": false,
+        "navigationStyle": "custom"
+      }
+    },
+    {
+      "path": "pages/login/index",
+      "style": {
+        "navigationBarTitleText": "SIA",
+        "backgroundColor": "#f7fbff"
+      }
+    },
+    {
+      "path": "pages/home/index",
+      "style": {
+        "navigationBarTitleText": "首页",
+        "navigationBarBackgroundColor": "#42b4ff",
+        "backgroundColor-color": "#f1f1f1"
+      }
+    },
+    {
+      "path": "pages/home/index/index",
+      "style": {
+        "navigationBarTitleText": "首页",
+        "enablePullDownRefresh": false
+      }
+    }
+  ],
+  "subPackages": [
+    {
+      "root": "packageCourse",
+      "pages": [
+        {
+          "path": "course/index",
+          "style": {
+            "navigationBarTitleText": "我的课程",
+            "enablePullDownRefresh": false,
+            "navigationStyle": "custom"
+          }
+        },
+        {
+          "path": "course/details",
+          "style": {
+            "navigationBarTitleText": "课程详情",
+            "enablePullDownRefresh": false,
+            "navigationStyle": "custom"
+          }
+        }
+      ]
+    }
+  ]
+}
\ No newline at end of file

src/pages/channels/channels.vue

+<template>
+	<view>
+		<!-- 顶部 -->
+		<view class="header" :style="{backgroundImage:`url(${logobackground})`}">
+			<customHead mode='deNav' :title='headtitle' :textAlign='textAlign' :isReturn='isReturn'
+				:colorMode='colorMode' :colorType='colorType' :RbtnMode='RbtnMode'></customHead>
+			<view class="top-title">
+				<view class="left">
+					<view class="text1">
+						资源录入
+					</view>
+					<view class="text2">
+						最终结果请前往钉钉查看
+					</view>
+				</view>
+				<view class="right">
+					<image class="student-bg" :src="imageUrl" mode="aspectFill"></image>
+				</view>
+			</view>
+		</view>
+		<!-- 信息录入 -->
+		<view class="main">
+			<scroll-view scroll-y>
+				<view class="box1">
+					<view class="title">
+						学生信息
+					</view>
+					<view class="item">
+						<text class="text">姓名</text>
+						<input type="text" value="" placeholder="请输入" />
+					</view>
+					<view class="item">
+						<text class="text">省份</text>
+						<radio-group @change="radioChange">
+							<label v-for="(item,index) in identity" :key="index">
+								<view class="check-li">
+									{{item.name}}
+									<radio class="login-check" :value="item.value" />
+								</view>
+							</label>
+						</radio-group>
+					</view>
+					<view class="item">
+						<text class="text">市区</text>
+						<radio-group @change="radioChange">
+							<label v-for="(item,index) in identity" :key="index">
+								<view class="check-li">
+									{{item.name}}
+									<radio class="login-check" :value="item.value" />
+								</view>
+							</label>
+						</radio-group>
+					</view>
+					<view class="item">
+						<text class="text">微信</text>
+						<input type="text" value="" placeholder="请输入" />
+					</view>
+					<view class="item">
+						<text class="text">手机号</text>
+						<input type="text" value="" placeholder="请输入" />
+					</view>
+				</view>
+			
+			
+			
+			
+			</scroll-view>
+		</view>
+
+		<view class="footer">
+			<view class="bot-btn">
+				保存
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	import customHead from "@/components/xy-customhead/xy-customhead.vue"
+	export default {
+		components: {
+			customHead
+		},
+		data() {
+			return {
+				headtitle: '资源录入', // 文字
+				textAlign: true, // 文字是否居中，默认居中
+				isReturn: true, // 是否开启返回箭头，默认关闭
+				colorMode: false, // 是否开渐变背景，默认开启
+				//学生档案图
+				imageUrl: require('../../assets/images/channels/file.png'),
+				logobackground: '../../static/logo-bg.png',
+
+			};
+		}
+	}
+</script>
+
+<style lang="scss">
+	// 顶部
+	.header {
+		width: 750rpx;
+		height: 410rpx;
+		border-radius: 0rpx 0rpx 22rpx 22rpx;
+		background-size: cover;
+		position: sticky;
+
+		.top-title {
+			.left {
+				position: absolute;
+				left: 30rpx;
+				bottom: 134rpx;
+
+				.text1 {
+					font-size: 40rpx;
+					font-family: PingFangSC-Medium, PingFang SC;
+					font-weight: 500;
+					color: #FFFFFF;
+					line-height: 44rpx;
+				}
+
+				.text2 {
+					font-size: 24rpx;
+					font-family: PingFangSC-Regular, PingFang SC;
+					font-weight: 400;
+					color: #FFFFFF;
+					line-height: 28rpx;
+					margin-top: 20rpx;
+				}
+
+			}
+
+			.right {
+				position: absolute;
+				bottom: 84rpx;
+				right: 60rpx;
+
+				.student-bg {
+					width: 362rpx;
+					height: 170rpx;
+				}
+			}
+		}
+	}
+
+	.main {
+		// background: pink;
+		padding: 0 30rpx;
+		box-sizing: border-box;
+		position: absolute;
+		top:23%;
+		.box1{
+			padding: 30rpx;
+			width: 690rpx;
+			height: 542rpx;
+			background: #FFFFFF;
+			box-shadow: 0px 0px 32rpx 0rpx rgba(0, 0, 0, 0.1);
+			border-radius: 24rpx;
+			background-color: pink;
+			.title{
+				font-size: 28rpx;
+				font-family: PingFangSC-Medium, PingFang SC;
+				font-weight: 500;
+				color: #333333;
+				line-height: 32rpx;
+				text-shadow: 0px 0px 32rpx rgba(0, 0, 0, 0.1);
+				margin-bottom: 10rpx;
+			}
+			.item{
+				margin-top: 30rpx;
+				display: flex;
+				justify-content: space-between;
+				padding-bottom: 30rpx;
+				border-bottom: 1rpx solid #EEEEEE;
+			}
+			.text{
+				font-size: 28rpx;
+				font-family: PingFangSC-Regular, PingFang SC;
+				font-weight: 400;
+				color: #999999;
+				line-height: 32rpx;
+				text-shadow: 0px 0px 32rpx rgba(0, 0, 0, 0.1);
+			}
+		}
+	}
+
+	// 底部按钮
+	.footer {
+		position: fixed;
+		bottom: 0;
+		left: 0;
+		width: 750rpx;
+		height: 128rpx;
+		background: #FFFFFF;
+		border-top: 1rpx solid #EEEEEE;
+		display: flex;
+		align-items: center;
+		justify-content: center;
+
+		.bot-btn {
+
+			width: 690rpx;
+			height: 88rpx;
+			line-height: 88rpx;
+			text-align: center;
+			background: linear-gradient(135deg, #FF6E58 0%, #FF3334 100%);
+			border-radius: 44rpx;
+			font-size: 32rpx;
+			font-family: PingFangSC-Regular, PingFang SC;
+			font-weight: 400;
+			color: #FFFFFF;
+		}
+
+	}
+</style>

src/pages/course/details.vue

+<template>
+	<div class="contain">
+		<div class="course-top"
+			:style="[{background:`url(${background}) no-repeat`},{height:naviBarH},{backgroundSize: '100% 100%'}]">
+			<customHead mode='deNav' :title='headtitle' :textAlign='textAlign' :isReturn='isReturn'
+				:colorMode='colorMode' :colorType='colorType' :RbtnMode='RbtnMode' @getnaviBarH="getnaviBarH">
+			</customHead>
+		</div>
+
+		<div class="course-main">
+			<div class="time clearfix">
+				<div class="f-l">
+					<p>开始时间</p>
+					<span>10:30</span>
+				</div>
+
+				<div class="f-r">
+					<p>开始时间</p>
+					<span>10:30</span>
+				</div>
+				<div>
+					<p>2020.08.03 周一</p>
+					<image class="lines" :src='require("../../assets/images/lines.png")' mode="widthFix"></image>
+					<div class="tips2">
+						<template v-if="type==''">
+							<template v-if="user=='student'&&feedbacktype==1">
+								<image :src='require("../../assets/images/tips2-icon.png")' mode="widthFix"></image>
+								<span>老师已反馈</span>
+							</template>
+							<template v-if="isfinish">
+								<image :src='require("../../assets/images/finishright.png")' mode="widthFix"></image>
+								<span>课程已结束</span>
+							</template>
+							<template v-if="!isfinish">
+								<image :src='require("../../assets/images/clock.png")' mode="widthFix"></image>
+								<span>距离上课还有3分5秒</span>
+							</template>
+						</template>
+							<!-- 取消审核中 -->
+							<template v-if="type=='cancel'">
+								<image :src='require("../../assets/images/clock.png")' mode="widthFix"></image>
+								<span>取消审核中</span>
+							</template>
+							<template v-if="type=='change'">
+								<image :src='require("../../assets/images/clock.png")' mode="widthFix"></image>
+								<span>调课审核中</span>
+							</template>
+						
+					</div>
+				</div>
+			</div>
+
+			<div class="course-scroll" :style="{maxHeight:scrollH}">
+				<div class="list">
+					<h1 class="list_title">课程信息</h1>
+					<div class="list_item clearfix">
+						<label>课程类型</label>
+						<div class="f-r txt-r">海外名校精品项目</div>
+					</div>
+					<div class="list_item clearfix">
+						<label>小时数</label>
+						<div class="f-r txt-r">1.00 小时</div>
+					</div>
+					<div class="list_item clearfix">
+						<label>课程类型</label>
+						<div class="f-r txt-r">上课地址</div>
+					</div>
+					<div class="list_item clearfix">
+						<label>授课方式</label>
+						<div class="f-r txt-r">面授</div>
+					</div>
+					<div class="list_item clearfix">
+						<label>项目ID</label>
+						<div class="f-r txt-r">123456</div>
+					</div>
+				</div>
+				<div class="list">
+					<h1 class="list_title">基本信息</h1>
+					<div class="list_item clearfix">
+						<label>学生姓名</label>
+						<div class="f-r txt-r">Susan</div>
+					</div>
+					<div class="list_item clearfix">
+						<label>老师姓名</label>
+						<div class="f-r txt-r">Sunny</div>
+					</div>
+					<div class="list_item clearfix">
+						<label>教务姓名</label>
+						<div class="f-r txt-r">JoJo</div>
+					</div>
+
+				</div>
+				<div class="list clearfix" style="padding-bottom:20rpx ;">
+				    <span class="list_title">打卡状态</span>
+					<div class="f-r txt-r clearfix">
+						<!-- 打卡状态 0未打卡，1已打卡 -->
+						<template v-if="clocktype==1">
+							<div class="f-r">打卡成功</div>
+							<image class="type_icon" :src='require("../../assets/images/success.png")' mode="widthFix"></image>
+						</template>
+						<template v-else>
+							<div class="f-r">未打卡</div>
+							<image class="type_icon" :src='require("../../assets/images/nofinish.png")' mode="widthFix"></image>
+						</template>
+						
+					</div>
+				</div>
+			</div>
+
+		</div>
+        <div class="detail_bottom" v-if="type==''">
+			<!-- 学员课程详情底部 -->
+			<template v-if="user=='student'">
+				<div class="clearfix">
+					<div class="bottom_icon f-l" v-if="feedbacktype==1">
+						<image :src='require("../../assets/images/tips1-icon.png")' mode="widthFix"></image>
+						<p>查看反馈</p>
+					</div>
+					<div class="f-r flex" :style="{width:flexW}">
+						<navigator url="" class="detail_btn redborder flex-1" v-if="recommandtype==1">查看评价</navigator>
+						<navigator url="" class="detail_btn redborder flex-1" v-if="recommandtype==0">课程评价</navigator>
+						<navigator url="" class="detail_btn redbg flex-1" v-if="clocktype==0">课程打卡</navigator>
+						</div>
+				</div>
+			</template>
+			<!-- 老师课程详情底部 -->
+			<template v-if="user=='teacher'">
+				<div class="clearfix">
+					<template v-if="feedbacktype==0&&clocktype==0">
+						<div class="bottom_icon f-l" >
+							<image :src='require("../../assets/images/tips1-icon.png")' mode="widthFix"></image>
+							<p>取消</p>
+						</div>
+						<div class="bottom_icon f-l">
+							<image :src='require("../../assets/images/tips1-icon.png")' mode="widthFix"></image>
+							<p>调课</p>
+						</div>
+					</template>
+					<div class="f-r flex" :style="{width:flexW}">
+						<navigator url="" class="detail_btn redborder flex-1" v-if="feedbacktype==1">查看反馈</navigator>
+						<navigator url="" class="detail_btn redborder flex-1" v-if="feedbacktype==0">课程反馈</navigator>
+						<navigator url="" class="detail_btn redbg flex-1" v-if="clocktype==0">课程打卡</navigator>
+						</div>
+				</div>
+			</template>
+		</div>
+	</div>
+</template>
+
+<script>
+	import customHead from "@/components/xy-customhead/xy-customhead.vue"
+	export default {
+		components: {
+			customHead
+		},
+		data() {
+			return {
+				background: require('@/static/bg.png'),
+				headtitle: '我的课程', // 头部标题
+				textAlign: true, // 文字是否居中，默认居中
+				isReturn: true, // 是否开启返回箭头，默认关闭
+				naviBarH: '', //背景图高度
+				scrollH: '', //可滚动区域
+				clocktype:0,//打卡状态
+				recommandtype:0,//评价状态
+				feedbacktype:1,//反馈状态
+				flexW:'',//flex长度
+				user:'',//用户身份
+				type:'',//取消，调课状态时
+				isfinish:true,//课程是否结束
+			}
+		},
+		methods: {
+			// 获取标题高度
+			getnaviBarH(val) {
+				this.naviBarH = 410 + val + 'rpx'
+				this.scrollH = 'calc(100vh - 232rpx - ' + val + 'rpx)'
+			},
+			// 修改flex长度
+			changFlex(){
+				if(this.feedbacktype==0&&this.user!=='teacher'){
+					this.flexW = '100%'
+				}
+				else{
+					this.flexW = 'calc(100% - 156rpx)'
+				}
+				if(this.user=='teacher'&&this.feedbacktype==0&&this.clocktype==0){
+					this.flexW = 'calc(100% - 196rpx)'
+				}else{
+					this.flexW = '100%'
+				}
+				
+			}
+			
+
+		},
+		created() {
+			this.getnaviBarH()
+			this.$nextTick(function(){
+				this.changFlex()
+			})
+			
+			
+		},
+		onLoad(options) {
+			this.user = options.user
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.contain {
+		.course-top {
+			height: 410rpx;
+			background: linear-gradient(135deg, #FF3334 0%, #FF6E58 100%);
+			border-radius: 0px 0px 22rpx 22rpx;
+
+		}
+
+		.course-main {
+			box-sizing: border-box;
+			margin: -250rpx 30rpx 0;
+
+			.time {
+				position: relative;
+				font-size: 24rpx;
+				font-family: PingFangSC-Semibold, PingFang SC;
+				font-weight: 600;
+				color: #FFFFFF;
+				padding: 0 30rpx;
+
+				&>div {
+					&:nth-child(3) {
+						position: absolute;
+						top: 50%;
+						left: 50%;
+						transform: translate(-50%, -50%);
+						text-align: center;
+					}
+
+					&:nth-child(2) {
+						text-align: right;
+					}
+				}
+
+				p {
+					margin-bottom: 8rpx;
+				}
+
+				span {
+					font-size: 60rpx;
+				}
+
+				.lines {
+					width: 244rpx;
+				}
+
+				.tips2 {
+					image {
+						width: 34rpx;
+						margin-right: 10rpx;
+						vertical-align: text-top;
+					}
+
+					span {
+						font-size: 24rpx;
+					}
+				}
+			}
+
+			.course-scroll {
+				overflow: auto;
+				box-sizing: border-box;
+				overflow-x: initial;
+				border-radius: 24rpx;
+				// height: calc(100vh - 272rpx - 88rpx);
+				margin: 40rpx 0rpx 0;
+
+				.list {
+					box-sizing: border-box;
+					background: #FFFFFF;
+					box-shadow: 0px 0px 32rpx 0px rgba(0, 0, 0, 0.1);
+					border-radius: 24rpx;
+					padding: 30rpx 30rpx 2rpx;
+					margin-bottom: 20rpx;
+                    font-family: PingFangSC-Regular, PingFang SC;
+					.list_title {
+						font-size: 28rpx;
+						font-family: PingFangSC-Medium, PingFang SC;
+						font-weight: 500;
+						color: #333333;
+					}
+
+					.list_item {
+						height: 90rpx;
+						line-height: 90rpx;
+						border-bottom: 1px solid #EEEEEE;
+						font-size: 28rpx;
+                        &:nth-last-child(1){
+							border-bottom:none;
+						}
+						label {
+							color: #999999;
+						}
+
+						&>div {
+							color: #333333;
+						}
+					}
+					.type_icon{
+						width: 32rpx;
+						height: 32rpx;
+						margin-right: 8rpx;
+					}
+				}
+			}
+
+		}
+	// 固定在底部
+	.detail_bottom{
+		position: fixed;
+		bottom: 0;
+		left: 0;
+		right: 0;
+		height: 136rpx;
+		padding: 20rpx 30rpx 30rpx;	
+        background: #FFFFFF;
+		font-family: PingFangSC-Regular, PingFang SC;
+		&::before{
+			position: absolute;
+			top: 0;
+			left: 0;
+			right: 0;
+			content: '';
+			height: 1px;
+			background-color: #eee;
+		}
+		.bottom_icon{
+			text-align: center;
+			&:nth-child(n+1){
+				margin-left: 40rpx;
+			}
+			image{
+				width: 40rpx;
+				height: 40rpx;
+				font-size: 24rpx;
+				color: #333333;
+			}
+		}
+		.flex {
+			width: calc(100% - 156rpx);
+			display: flex;
+			align-items: center;
+			justify-content: space-between;
+			flex-direction: row;
+		}
+		.flex-1{
+			flex: 1;
+		}
+		navigator{
+			display:inline-block;
+			height: 88rpx;
+			line-height: 88rpx;
+			text-align: center;
+			&:nth-child(n+1){
+				margin-left: 20rpx;
+			}
+		}
+		.detail_btn{
+			font-size: 32rpx;
+			border-radius: 44rpx;
+			&.redborder{
+			border: 2rpx solid #FF3334;
+			color: #FF3334;
+		    }
+			&.redbg{
+			background: linear-gradient(135deg, #FF6E58 0%, #FF3334 100%);
+			color: #fff;
+			}
+		}
+	}
+	}
+</style>

src/pages/course/index.vue

+<template>
+	<div class="contain">
+		<div class="course-top" :style="[{background:`url(${background}) no-repeat`},{height:naviBarH},{backgroundSize: '100% 100%'}]">
+			<customHead mode='deNav' :title='headtitle' :textAlign='textAlign' :isReturn='isReturn'
+				:colorMode='colorMode' :colorType='colorType' :RbtnMode='RbtnMode' @getnaviBarH="getnaviBarH"></customHead>
+		</div>
+		
+		<div class="course-main">
+			<div class="time" @click="selectDatePicker">{{date?date:today}}</div>
+			<jpTimePicker ref='date-time' :datestype="type" :datestring='dateString'  @change='dateTimeChange'>
+			</jpTimePicker>
+			<div class="course-scroll" :style="{height:scrollH}">
+				<div class="calendar"><calendar :selColor="selColor" :bgColor="selColor"></calendar></div>
+				<template v-if="courseList.length>0">
+					<div class="line"></div>
+					<div class="course" v-for="(item,index) in courseList" @click="toDetail(item.courseid)">
+						<div class="course-t clearfix"><div class="f-l"><span class="course-icon big">大班课</span><span class="course-title">上课时间</span></div><div class="f-r"><span class="course-type">课程已结束</span></div></div>
+						<div class="course-center clearfix"><div class="f-l"><span class="start">10:30</span><image class="arrow" src="../../static/arrow.png" mode="widthFix"></image><span class="end">24:00</span></div><div class="f-r"><image class="arrow-left" src="../../static/more.png" mode="widthFix"></div></div>
+						<div class="course-bottom"><image src="../../static/userimg.png" mode="widthFix"></image><span>Sunny老师</span><span>海外名校精品项目</span><span>50分钟</span></div>
+					</div>
+				</template>
+				<template v-else>
+					<div class="course-lack">
+						<image :src="lackImg" mode="widthFix"></image>
+						<p class="lack-txt">暂无课程～</p>
+					</div>
+				</template>
+				
+			</div>
+			
+			
+		</div>
+
+	</div>
+</template>
+
+<script>
+	import jpTimePicker from '@/components/jp-timePicker/jp-timePicker.vue'
+	import calendar from '@/components/tale-calendar/calendar.vue'
+	import customHead from "@/components/xy-customhead/xy-customhead.vue"
+	export default {
+		components: {
+			jpTimePicker,
+			calendar,
+			customHead
+		},
+		data() {
+			return {
+				courseList:[
+					{courseid:1,start:'9:30',end:'10:30',type:'1'},
+					{courseid:2,start:'15:30',end:'16:30',type:'2'},
+					{courseid:3,start:'15:30',end:'16:30',type:'2'},
+					],
+				background: require('@/static/bg.png'),
+				dateString: '',//默认日期
+				date:'',
+				today:'',//今天日期
+				type: 'year-month',
+				selColor:'linear-gradient(135deg, #FF6E58 0%, #FF3334 100%)',
+				lackImg:require('@/assets/images/course_lack.png'),//缺省图片
+				headtitle: '我的课程', // 头部标题
+				textAlign: true, // 文字是否居中，默认居中
+				isReturn: true, // 是否开启返回箭头，默认关闭
+				naviBarH:'',//背景图高度
+				scrollH:'',//可滚动区域
+				user:'teacher',//当前账户的身份
+			}
+		},
+		methods: {
+			selectDatePicker() {
+				this.$refs['date-time'].show();
+			},
+			dateTimeChange(value) {
+				console.log(value)
+			    let temptime = value.replace('-','年')
+			    this.date = temptime.concat('月')
+			    this.dateString = value
+			    
+			   },
+			   // 转化日期
+			   changeToday(){
+			    let day = new Date()
+			    let year = day.getFullYear()
+			    let months = day.getMonth()+1
+				if(months<10){
+					months = '0'+months
+				}
+			    this.today = year+'年'+months+'月'
+			   },
+			   // 获取标题高度
+			   getnaviBarH(val){
+				   this.naviBarH = 410+val+'rpx'
+				   this.scrollH = 'calc(100vh - 272rpx - '+val+'rpx)'
+			   },
+			   // 跳转详情
+			   toDetail(id){
+				   uni.navigateTo({
+				   	url:'details?courseid='+id+'&user='+this.user
+				   })
+			   }
+		},
+		created(){
+			this.changeToday()
+			this.getnaviBarH()
+		},
+		mounted(){
+			
+		}
+	}
+</script>
+
+<style lang="scss" scoped>
+	.contain {
+		.course-top {
+			height: 410rpx;
+			background: linear-gradient(135deg, #FF3334 0%, #FF6E58 100%);
+			border-radius: 0px 0px 22rpx 22rpx;
+			
+		}
+
+		.course-main {
+			box-sizing: border-box;
+			margin: -222rpx 30rpx 0;
+			.time {
+				position: relative;
+				font-size: 40rpx;
+				font-family: PingFangSC-Semibold, PingFang SC;
+				font-weight: 600;
+				color: #FFFFFF;
+				line-height: 44rpx;
+				&::after{
+					content: '';
+					width: 0;
+					height: 0;
+					position: absolute;
+					right: 412rpx;
+					top: calc(50% + 8rpx);
+					transform: translateY(-50%);
+					border: 16rpx solid #fff;
+					border-radius: 4rpx;
+					border-left-color: transparentize($color: #000000, $amount: 1);
+					border-right-color: transparentize($color: #000000, $amount: 1);
+					border-bottom-color: transparentize($color: #000000, $amount: 1);
+					
+					
+				}
+			}
+			.course-scroll{
+				overflow: auto;
+				box-sizing: border-box;
+				overflow-x: initial;
+				border-radius: 24rpx;
+				// height: calc(100vh - 272rpx - 88rpx);
+				margin: 40rpx 0rpx 0;
+				.calendar{
+					box-sizing: border-box;
+				}
+				.line{
+					width: 60rpx;
+					height: 8rpx;
+					background: #D8D8D8;
+					border-radius: 4rpx;
+					margin: 30rpx auto;
+				}
+				.course{
+					box-sizing: border-box;
+					background: #FFFFFF;
+					box-shadow: 0px 0px 32rpx 0px rgba(0, 0, 0, 0.1);
+					border-radius: 24rpx;
+					padding: 32rpx 30rpx 28rpx;
+					margin-bottom: 20rpx;
+					.course-icon{
+						font-size: 20rpx;
+						font-family: PingFangSC-Semibold, PingFang SC;
+						font-weight: 600;
+						border-radius: 4rpx;
+						padding: 8rpx 10rpx;
+						&.big{
+							background: #FDEBE9;
+							color: #FF3334;
+						}
+						&.small{
+							background: #EFF2FE;
+							color: #6386FA;
+						}
+					}
+					.course-title{
+						margin-left: 10rpx;
+						font-size: 26rpx;
+						font-family: PingFangSC-Semibold, PingFang SC;
+						font-weight: 600;
+						color: #333333;
+					}
+					.course-type{
+						font-size: 26rpx;
+						color: #999999;
+					}
+					.start,.end{
+						font-size: 40rpx;
+						font-family: PingFangSC-Semibold, PingFang SC;
+						font-weight: 600;
+						color: #333333;
+					}
+					.course-t{
+						height: 42rpx;
+						line-height: 42rpx;
+					}
+					.course-center,.course-bottom{
+						margin-top: 40rpx;
+					}
+					.arrow{
+						width: 32rpx;
+						height: 32rpx;
+						margin:0 20rpx;
+					}
+					.arrow-left{
+						width: 32rpx;
+						height: 32rpx;
+					}
+					.course-bottom{
+						font-size: 24rpx;
+						color: #999999;
+						image{
+							width: 44rpx;
+							height: 44rpx;
+							vertical-align: middle;
+						}
+						span{
+							padding: 0  20rpx;
+							border-right:1px solid #999 ;
+						}
+					}
+				}
+			    .course-lack{
+					text-align: center;
+					background: #FFFFFF;
+					box-shadow: 0px 0px 32rpx 0px rgba(0, 0, 0, 0.1);
+					border-radius: 24rpx;
+					padding: 80rpx 0;
+					margin-top: 30rpx;
+					image{
+						width: 272rpx;
+						height: 182rpx;
+						margin: 0 auto;
+					}
+					.lack-txt{
+						margin-top: 28rpx;
+						font-size: 32rpx;
+						color: #333333;
+					}
+				}
+			}
+			
+			
+		}
+
+	}
+</style>

src/pages/example.vue

+<template>
+    <div>example</div>
+</template>
+
+<script>
+    export default {
+      data() {
+        return {};
+      },
+      mounted() {
+      },
+      methods: {
+        network() {
+          return {
+            example: async () => {
+              console.log('network');
+            },
+          };
+        },
+        handler() {
+          return {
+            example: () => {
+              console.log('handle');
+            },
+          };
+        },
+      },
+    };
+</script>
+
+<style lang="scss" scoped>
+
+</style>

src/pages/example/button.vue

+<template>
+    <div class="container">
+      <div class="line btn-primary">提交按钮（主色）</div>
+      <div class="line btn-secondary">提交按钮（辅色）</div>
+      <div class="line btn-disable">不可点击按钮</div>
+    </div>
+</template>
+
+<script>
+    export default {
+      data() {
+        return {};
+      },
+      mounted() {
+      },
+      methods: {
+        network() {
+          return {
+            example: async () => {
+              console.log('network');
+            },
+          };
+        },
+        handler() {
+          return {
+            example: () => {
+              console.log('handle');
+            },
+          };
+        },
+      },
+    };
+</script>
+
+<style lang="scss" scoped>
+  .container {
+    padding: 20rpx;
+    .line {
+      & + .line {
+        margin-top: 20rpx;
+      }
+    }
+  }
+</style>

src/pages/example/components.vue

+<template>
+    <div class="container">
+      <div class="title">数量编辑</div>
+      <dankal-count-control v-model="count"/>
+
+      <div class="title">图片上传</div>
+      <dankal-image-upload v-model="imgList"/>
+
+      <div class="title" @click="isShowModal=true">对话弹窗</div>
+      <dankal-modal v-model="isShowModal" background="none">
+        <div slot="content">对话弹窗</div>
+      </dankal-modal>
+
+      <div class="title">搜索框</div>
+      <dankalSearchBox v-model="keywords"/>
+
+      <div class="title">选项卡</div>
+      <dankal-tab-control :options='tabControl' v-model="tabControlInd"/>
+    </div>
+</template>
+
+<script>
+
+  import dankalCountControl from '@/components/dankal-count-control';
+  import dankalImageUpload from '@/components/dankal-image-upload';
+  import dankalModal from '@/components/dankal-modal';
+  import dankalSearchBox from '@/components/dankal-search-box';
+  import dankalTabControl from '@/components/dankal-tab-control';
+
+  export default {
+    config: {
+      navigationBarTitleText: '组件',
+    },
+    data() {
+      return {
+        count: 0,
+        imgList: [],
+        isShowModal: false,
+        keywords: '',
+        tabControl: ['a', 'b'],
+        tabControlInd: 0,
+      };
+    },
+    components: {
+      dankalCountControl,
+      dankalImageUpload,
+      dankalModal,
+      dankalSearchBox,
+      dankalTabControl,
+    },
+    mounted() {
+    },
+    methods: {
+      network() {
+        return {
+          example: async () => {
+            console.log('network');
+          },
+        };
+      },
+      handler() {
+        return {
+          example: () => {
+            console.log('handle');
+          },
+        };
+      },
+    },
+  };
+</script>
+
+<style lang="scss" scoped>
+
+  .container{
+    padding: 0 30rpx;
+    .title{
+      padding: 30rpx 0;
+    }
+  }
+</style>

src/pages/example/counter copy.vue

+<template>
+  <div class="counter-warp">
+    <p>Vuex counter：{{ count }}</p>
+    <p>
+      <button @click="increment">+</button>
+      <button @click="decrement">-</button>
+    </p>
+  </div>
+</template>
+
+<script>
+import { mapState, mapMutations } from 'vuex';
+
+export default {
+  config: {
+    navigationBarTitleText: 'Vuex示例',
+  },
+
+  computed: {
+    ...mapState([
+      'count',
+    ]),
+  },
+
+  methods: {
+    ...mapMutations([
+      'increment',
+      'decrement',
+    ]),
+  },
+};
+</script>
+
+<style>
+.counter-warp {
+  text-align: center;
+  margin-top: 100rpx;
+}
+.home {
+  display: inline-block;
+  margin: 100rpx auto;
+  padding: 5rpx 10rpx;
+  color: blue;
+  border: 1rpx solid blue;
+}
+</style>

src/pages/example/counter.vue

+<template>
+	<view>
+		<view class="search">
+			<input type="text" placeholder="请输入搜索内容" @input="set">
+		</view>
+		<view class="list">
+			<view v-for="(item,index) in filterList" :key="index">
+				<rich-text :nodes="item"></rich-text>
+			</view>
+		</view>
+	</view>
+</template>
+ 
+<script>
+	export default {
+		data() {
+			return {
+				list:[
+					'helang',
+					'uview',
+					'uniapp',
+					'1846492969',
+					'helang.love@qq.com',
+					'公众号 web-7258'
+				],
+				filterList:[]
+			}
+		},
+		mounted(){
+			// #ifdef H5
+			console.log("%c 河浪原创作品，QQ:1846492969",'color:#09f;font-size:32px;');
+			// #endif
+			
+			// #ifndef H5
+			console.log("河浪原创作品，QQ:1846492969");
+			// #endif
+			
+			this.set({detail:''});	// 默认调用显示数据，你可以无视
+		},
+		methods: {
+			// 设置
+			set(e){
+				let value = e.detail.value;
+				if(!value){
+					this.filterList = this.list;
+					return;
+				}
+				
+				let filterArr = [];
+				// 过滤出符合条件的值
+				this.list.forEach((item,index)=>{
+					if(item.includes(value)){
+						filterArr.push(this.join(item,value));
+					}
+				});
+								
+				this.filterList = filterArr;
+			},
+			// 拼接
+			join(str,key){
+				var reg = new RegExp((`(${key})`), "gm");
+				var replace = '<span style="color:#FD463E;font-weight:bold;">$1</span>';
+				return str.replace(reg, replace);
+			}
+		}
+	}
+</script>
+ 
+<style lang="scss">
+.search{
+	padding: 20rpx;
+	background-color: #fff;
+	border-bottom: #09f solid 1px;
+	
+	&>input{
+		height: 64rpx;
+	}
+}
+.list{
+	&>view{
+		padding: 20rpx;
+		
+		&+ view{
+			border-top: #e5e5e5 solid 1px;
+		}
+	}
+}
+</style>
\ No newline at end of file

src/pages/example/wxParse.vue

+<template>
+    <div>
+        <u-parse :content="article" :imageProp="{mode:'widthFix'}"/>
+    </div>
+</template>
+
+<script>
+import uParse from '@/components/u-parse/u-parse.vue'
+  export default {
+    data() {
+      return {
+        article: '<img class="bg" src="https://qiniu.fenglou.runworld.com.cn/pic1.png" mode="aspectFill"/>说明文档说明文档',
+      };
+    },
+      components: {
+          uParse
+      },
+    mounted() {
+    },
+    methods: {
+      network() {
+        return {
+          example: async () => {
+            console.log('network');
+          },
+        };
+      },
+      handler() {
+        return {
+          example: () => {
+            console.log('handle');
+          },
+        };
+      },
+    },
+  };
+</script>
+
+<style lang="scss" scoped>
+</style>

src/pages/home/index.vue

+<template>
+  <div class="container">
+    <!-- 上半区固定 -->
+    <div class="top" :style="{height: isNewMessDiv ? '342rpx' : '272rpx'}">
+      <div class="new-mess" v-if="isNewMessDiv">
+        <div class="son">
+          <img class="icon-28" src="@/assets/images/exp/homeindex-icon-horn.png"/>
+          <div class="fs-28 fs-ff5d4a">自助修改地址功能已开通。</div>
+        </div>
+        <div class="son">
+          <div class="fs-28 fs-3d7eff">立即查看</div>
+          <img class="icon-20" src="@/assets/images/exp/homeindex-icon-close01.png"/>
+        </div>
+      </div>
+      <!-- 搜索 -->
+      <div class="search">
+        <img class="icon-28 margin-left-30" src="@/assets/images/exp/homeindex-icon-search.png"/>
+        <input class="search-input" type="text" placeholder="搜索订单号或买家昵称"/>
+        <img class="icon-30" src="@/assets/images/exp/homeindex-icon-scanning.png"/>
+      </div>
+      <!-- 显示 -->
+      <div class="current-state">
+        <div class="state-data" v-for="(item, i) in currentStateData" :key="item.id">
+          <div class="num">{{item.num}}</div>
+          <div class="name">{{item.name}}</div>
+        </div>
+      </div>
+    </div>
+    <!-- 下半区 -->
+    <div class="bottom" :style="{'margin-top': isNewMessDiv ? '342rpx' : '272rpx'}">
+      <div class="advertisement">我是广告
+        <img class="icon-40 close-advertisement" src="@/assets/images/exp/homeindex-icon-close02.png"/>
+      </div>
+      <div class="btn-show">
+        <div class="title">常用工具</div>
+        <div class="small-btn-show" v-for="(item, i) in oftenTool" :key="item.id">
+          <img class="icon-40 margin-15 " :src='item.src' />
+          <div class="name">{{item.name}}</div>
+        </div>
+      </div>
+      <div class="btn-show">
+        <div class="title">实用工具</div>
+        <div class="small-btn-show" v-for="(item, i) in oftenPractical" :key="item.id">
+          <img class="icon-40 margin-15 " :src='item.src' />
+          <div class="name">{{item.name}}</div>
+        </div>
+      </div>
+      <div class="btn-show">
+        <div class="title">基础设置</div>
+        <div class="small-btn-show" v-for="(item, i) in basicsSetUp" :key="item.id">
+          <img class="icon-40 margin-15 " :src='item.src' />
+          <div class="name">{{item.name}}</div>
+        </div>
+      </div>
+      <div class="edition">易打单技术支持   V1.5.8</div>
+    </div>
+  </div>
+</template>
+
+<script>
+  export default {
+    name: 'index',
+    data() {
+      return {
+        isNewMessDiv: true, // true为消息提醒显示，false为消息提醒关闭
+        currentStateData: [ // 上部分数据展示
+          {
+            id: 1,
+            num: 45,
+            name: '待打印',
+          },
+          {
+            id: 2,
+            num: 173,
+            name: '已打印',
+          },
+          {
+            id: 3,
+            num: 33,
+            name: '待发货',
+          },
+          {
+            id: 4,
+            num: 63,
+            name: '已发货',
+          }
+        ],
+        oftenTool:[ // 常用工具
+          {
+            id: 1,
+            src: require('@/assets/images/exp/homeindex-icon-order-printing.png'),
+            // src: require('./../../assets/images/exp/homeindex-icon-order-printing.png'),
+            name: '订单打印',
+          },
+          {
+            id: 2,
+            src: require('@/assets/images/exp/homeindex-icon-neworder.png'),
+            // src: './../../assets/images/exp/homeindex-icon-order-printing.png',
+            name: '新建订单',
+          },
+          {
+            id: 3,
+            src: require('@/assets/images/exp/homeindex-icon-scanning-logistics.png'),
+            // src: './../../assets/images/exp/homeindex-icon-order-printing.png',
+            name: '扫描发货',
+          },
+          {
+            id: 4,
+            src: require('@/assets/images/exp/homeindex-icon-order-manifest.png'),
+            // src: './../../assets/images/exp/homeindex-icon-order-printing.png',
+            name: '拣货单',
+          },
+          {
+            id: 5,
+            src: require('@/assets/images/exp/homeindex-icon-orderquery.png'),
+            // src: './../../assets/images/exp/homeindex-icon-order-printing.png',
+            name: '底单查询',
+          },
+          {
+            id: 6,
+            src: require('@/assets/images/exp/homeindex-icon-order-delrecord.png'),
+            // src: './../../assets/images/exp/homeindex-icon-order-printing.png',
+            name: '回收记录',
+          }
+        ],
+        oftenPractical:[ // 实用工具
+          {
+            id: 1,
+            src: require('@/assets/images/exp/homeindex-icon-check-ordercode.png'),
+            // src: './../../assets/images/exp/homeindex-icon-order-printing.png',
+            name: '查件码',
+          },
+          {
+            id: 2,
+            src: require('@/assets/images/exp/homeindex-icon-collect-ordercode.png'),
+            // src: './../../assets/images/exp/homeindex-icon-order-printing.png',
+            name: '收单码',
+          },
+          {
+            id: 3,
+            src: require('@/assets/images/exp/homeindex-icon-order-share.png'),
+            // src: './../../assets/images/exp/homeindex-icon-order-printing.png',
+            name: '面单分享',
+          },
+          {
+            id: 4,
+            src: require('@/assets/images/exp/homeindex-icon-ascription-query.png'),
+            // src: './../../assets/images/exp/homeindex-icon-order-printing.png',
+            name: '归属查询',
+          },
+        ],
+        basicsSetUp:[ // 基础设置
+          {
+            id: 1,
+            src: require('@/assets/images/exp/homeindex-icon-address-warehouse.png'),
+            // src: './../../assets/images/exp/homeindex-icon-order-printing.png',
+            name: '地址库',
+          },
+          {
+            id: 2,
+            src: require('@/assets/images/exp/homeindex-icon-electron-order.png'),
+            // src: './../../assets/images/exp/homeindex-icon-order-printing.png',
+            name: '电子面单',
+          },
+          {
+            id: 3,
+            src: require('@/assets/images/exp/homeindex-icon-printer.png'),
+            // src: './../../assets/images/exp/homeindex-icon-order-printing.png',
+            name: '打印机',
+          },
+          {
+            id: 4,
+            src: require('@/assets/images/exp/homeindex-icon-contact.png'),
+            // src: './../../assets/images/exp/homeindex-icon-order-printing.png',
+            name: '联系客服',
+          }
+        ],
+      };
+    },
+    mounted() {
+    },
+    methods: {
+      network() {
+        return {
+          example: async () => {
+            console.log('network');
+          },
+        };
+      },
+      handler() {
+        return {
+          example: () => {
+            console.log('handle');
+          },
+        };
+      },
+    },
+  };
+</script>
+<style>
+  page{
+    background-color: #f1f1f1;
+  }
+</style>
+<style lang="scss" scoped>
+  
+  .container {
+    width: 100vw;
+    // height: 100vh;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+  }
+  // 上半区固定
+  .top{
+    position: fixed;
+    top: 0;
+    right: 0;
+    left: 0;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    width: 100%;
+    height: 210rpx;
+    background: linear-gradient(136deg, #42B4FF 0%, #3985FD 100%);
+  }
+
+  .new-mess {
+    box-sizing: border-box;
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: space-between;
+    width: 750rpx;
+    height: 70rpx;
+    background: #ffeee8;
+    padding: 0 30rpx;
+
+    .son {
+      display: flex;
+      flex-direction: row;
+      align-items: center;
+    }
+  }
+  .search {
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    width: 700rpx;
+    height: 84rpx;
+    margin-top: 24rpx;
+    margin-bottom: 28rpx;
+    background: #FFFFFF;
+    opacity: 1;
+    border-radius: 42rpx;
+
+    .search-input {
+      width: 552rpx;
+      margin-left: 14rpx;
+      margin-right: 14rpx;
+    }
+  }
+  .current-state {
+    display: flex;
+    flex-direction: row;
+    justify-content: space-between;
+    width: 610rpx;
+    height: 98rpx;
+
+    .state-data {
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      justify-content: space-between;
+
+      .num {
+        display: flex;
+        flex-direction: row;
+        align-items: center;
+        // width: 50rpx;
+        height: 58rpx;
+        font-size: 42rpx;
+        line-height: 26rpx;
+        color: #fff;
+      }
+      .name {
+        display: flex;
+        flex-direction: row;
+        align-items: center;
+        height: 58rpx;
+        font-size: 28rpx;
+        line-height: 26rpx;
+        color: #fff;
+      }
+    }
+  }
+  .bottom{
+    z-index: -1;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    // justify-content: center;
+    width: 100%;
+    // background: #f1f1f1;
+  }
+  .advertisement {
+    position: relative;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    width: 700rpx;
+    height: 150rpx;
+    margin-top: 24rpx;
+    background: #fff;
+    border-radius: 10px;
+
+    .close-advertisement {
+      position: absolute;
+      top: -15rpx;
+      right: -15rpx;
+    }
+  }
+  .btn-show {
+    box-sizing: border-box;
+    width: 700rpx;
+    padding: 30rpx 0;
+    margin-top: 24rpx;
+    background: #FFFFFF;
+    border-radius: 10rpx;
+    box-shadow: 0rpx 4rpx 10rpx rgba(54, 54, 54, 0.05);
+
+    .title {
+      margin-left: 24rpx;
+      margin-bottom: 27rpx;
+      font-size: 30rpx;
+      font-weight: bold;
+      color: #262626;
+    }
+    .small-btn-show {
+      // display: flex;
+      // flex-direction: column;
+      // align-items: center;
+      display: inline-block;
+      width: 98rpx;
+      margin: 0 38rpx;
+      font-size: 24rpx;
+      color: #333;
+
+      .name {
+        display: flex;
+        justify-content: center;
+      }
+    }
+  }
+  .edition {
+    margin-top: 24rpx;
+    margin-bottom: calc(env(safe-area-inset-bottom) + 24rpx);
+    font-size: 24rpx;
+    line-height: 31rpx;
+    color: #717171;
+  }
+  .margin-left-30 {
+    margin-left: 30rpx;
+  }
+  .margin-15 {
+    margin: 15rpx 28rpx;
+  }
+  .fs-28 {
+    font-size: 28rpx;
+  }
+  .fs-ff5d4a {
+    color: #ff5d4a;
+    margin-left: 12rpx;
+  }
+  .fs-3d7eff {
+    color: #3d7eff;
+    margin-right: 30rpx;
+  }
+  /** icon */
+  .icon-20{
+    width: 20rpx;
+    height: 20rpx;
+  }
+  .icon-28{
+    width: 28rpx;
+    height: 28rpx;
+  }
+  .icon-30{
+    width: 30rpx;
+    height: 30rpx;
+  }
+  .icon-40{
+    width: 40rpx;
+    height: 40rpx;
+  }
+  
+</style>

src/pages/home/index/index.vue

+<template>
+	<view>
+		<view class="header padding">
+			<text class="uer-name">下午好，Susan同学</text>
+			<image class="tx" :src="txImg" mode="aspectFit"></image>
+		</view>
+		<view class="bannar padding">
+			lbt
+		</view>
+		<view class="content padding">
+			<view class="content-item">
+				<view class="icon">
+					<image :src="signImg" mode=""></image>
+				</view>
+				<view class="title">
+					<view class="top">
+						资源录入
+					</view>
+					<view class="bot">
+						Resource entry
+					</view>
+				</view>
+			</view>
+		</view>
+	</view>
+</template>
+
+<script>
+	export default {
+		data() {
+			return {
+			txImg:require('../../../assets/images/exp/homeindex-icon-contact.png') ,
+			signImg:require('../../../assets/images/exp/homeindex-icon-orderquery.png') ,
+			};
+		}
+	}
+</script>
+
+<style lang="scss">
+	.padding{
+		padding-left: 30rpx;
+		padding-right: 30rpx;
+	}
+	.header {
+		display: flex;
+		justify-content: space-between;
+		padding-top: 36rpx;
+		.tx{
+			width: 56rpx;
+			height: 56rpx;
+			border-radius: 50%;
+			background: pink;
+		}
+		.uer-name {
+			max-width: 600rpx;
+			font-size: 40rpx;
+			font-family: PingFangSC-Semibold, PingFang SC;
+			font-weight: 600;
+			color: #333333;
+			line-height: 44rpx;
+		}
+	}
+	.bannar{
+		margin-top: 36rpx;
+		width: 690rpx;
+		height: 240rpx;
+		background: pink;
+	}
+	.content{
+		margin-top: 36rpx;
+	}
+	.content-item{
+		width: 330rpx;
+		height: 306rpx;
+		background: #FFFFFF;
+		box-shadow: 0rpx 0rpx 32rpx 0rpx rgba(0, 0, 0, 0.1);
+		border-radius: 24rpx;
+		display: flex;
+		flex-direction: column;
+		justify-content: space-between;
+		padding: 30rpx;
+		
+		.icon{
+			display: flex;
+			justify-content: flex-end;
+			image{
+				width: 60rpx;
+				height: 60rpx;
+				background: pink;
+			}
+		}
+		.title{
+			font-size: 28rpx;
+			font-family: PingFangSC-Semibold, PingFang SC;
+			font-weight: 600;
+			color: #333333;
+			line-height: 32rpx;
+		}
+	}
+	
+</style>

src/pages/home/index/resources.vue

+<template>
+	<view>
+		<!-- <resources :title1='title1'></resources> -->
+		<empty :hint='title1' :imageUrl="imageUrl"></empty>
+		<view class="btn" @tap="clickBtn()">
+			{{btnText}}
+		</view>
+	</view>
+</template>
+
+<script>
+	// import resources from "@/components/resources/resources.vue"
+	import empty from "@/components/empty.vue"
+	export default {
+		components: {
+			// resources
+			empty
+		},
+		data() {
+			return {
+				title1:'404',
+				imageUrl:require('../../../assets/images/404.png') ,
+				btnText:'回去'
+			};
+		},
+		methods:{
+			clickBtn(){
+				uni.navigateTo({
+					url:('/pages/index/index')
+				})
+				console.log('回去')
+			}
+		}
+		
+	}
+</script>
+
+<style lang="scss">
+	.container {
+		display: flex;
+		flex-direction: column;
+		align-items: center;
+	}
+
+	.img{
+		width: 458rpx;
+		height: 310rpx;
+		margin-top: 120rpx;
+	}
+	.text{
+		margin-top: 60rpx;
+		font-size: 32rpx;
+		font-family: PingFangSC-Medium, PingFang SC;
+		font-weight: 500;
+		color: #333333;
+	}
+	.btn{
+		margin: auto;
+		width: 200rpx;
+		height: 88rpx;
+		border-radius: 44rpx;
+		border: 2px solid #FF3334;
+		line-height: 88rpx;
+		font-size: 32rpx;
+		font-family: PingFangSC-Regular, PingFang SC;
+		font-weight: 400;
+		color: #FF3334;
+		text-align: center;
+		margin-top: 120rpx;
+	}
+</style>

src/pages/home/order-share/add.vue

+<template>
+  <div class="container">
+    <div class="select-show margin-top22">
+      <div class="name fscolor-666">选择对方平台</div>
+      <!-- #ifdef MP-WEIXIN -->
+      <picker @change="selectPlatformName" value="0" :range="platformName" range-key='name'>
+        <div class="value-icon">
+          <div :class='["select-value", platformNameSelect !== "" ? "fscolor-333" : "fscolor-ccc"]'>{{platformNameSelect !== '' ? platformNameSelect : '请输入'}}</div>
+          <img class="icon-20 margin-left16" src="@/assets/images/exp/icon-angle-bracket-grey.png"/>
+        </div>
+      </picker>
+      <!-- #endif -->
+    </div>
+    <div class="select-show margin-top2">
+      <div class="name fscolor-666">对方店铺名</div>
+      <div class="input">
+        <input type="text" placeholder="请输入"/>
+      </div>
+    </div>
+    <div class="select-show margin-top26">
+      <div class="name fscolor-666">面单账号</div>
+        <!-- #ifdef MP-WEIXIN -->
+        <picker @change="selectOrderUser" value="0" :range="orderUser" range-key='name'>
+          <div class="value-icon">
+            <div :class='["select-value", orderUserSelect !== "" ? "fscolor-333" : "fscolor-ccc"]'>{{orderUserSelect !== '' ? orderUserSelect : '请输入'}}</div>
+            <img class="icon-20 margin-left16" src="@/assets/images/exp/icon-angle-bracket-grey.png"/>
+          </div>
+        </picker>
+        <!-- #endif -->
+    </div>
+    <div class="select-show margin-top2">
+      <div class="name fscolor-666">快递公司</div>
+        <!-- #ifdef MP-WEIXIN -->
+        <picker @change="selectExpressCompany" value="0" :range="expressCompany" range-key='name'>
+          <div class="value-icon">
+            <div :class='["select-value", expressCompanySelect !== "" ? "fscolor-333" : "fscolor-ccc"]'>{{expressCompanySelect !== '' ? expressCompanySelect : '请输入'}}</div>
+            <img class="icon-20 margin-left16" src="@/assets/images/exp/icon-angle-bracket-grey.png"/>
+          </div>
+        </picker>
+        <!-- #endif -->
+    </div>
+    <div class="select-show margin-top2">
+      <div class="name fscolor-666">网点发货地址</div>
+        <!-- #ifdef MP-WEIXIN -->
+        <picker @change="selecOutletsAddress" value="0" :range="outletsAddress" range-key='name'>
+          <div class="value-icon">
+            <div :class='["select-value", outletsAddressSelect !== "" ? "fscolor-333" : "fscolor-ccc"]'>{{outletsAddressSelect !== '' ? outletsAddressSelect : '请输入'}}</div>
+            <img class="icon-20 margin-left16" src="@/assets/images/exp/icon-angle-bracket-grey.png"/>
+          </div>
+        </picker>
+        <!-- #endif -->
+    </div>
+    <div class="select-show margin-top2">
+      <div class="name fscolor-666">本次共享单号数</div>
+      <div class="radio">
+        <div class="input">
+          <input type="text" placeholder="请输入"/>
+        </div>
+        <div class="unlimited fscolor-666">
+          <img class="icon-28 margin-left40-right10" :src='isSelectIcon ? icSelect : icSelectNull' @click="isSelectIcon = !isSelectIcon"/>无限量
+        </div>
+      </div>
+    </div>
+    <div class="btn-primary">保存</div>
+  </div>
+</template>
+
+<script>
+  export default {
+    name: 'index',
+    data() {
+      return {
+        platformName: [ // 对方平台选择器数据
+          {
+            id: 1,
+            name: '淘宝',
+          },
+          {
+            id: 2,
+            name: '拼多多',
+          },
+          {
+            id: 3,
+            name: '京东',
+          },
+          {
+            id: 4,
+            name: '唯品会',
+          },
+        ], 
+        platformNameSelect: '', // 对方平台绑定值
+        orderUser: [ // 面单账号选择器数据
+          {
+            id: 1,
+            name: '随叶等候的风'
+          },
+          {
+            id: 2,
+            name: '俊俊的小店'
+          }
+        ],
+        orderUserSelect: '', // 面单账号绑定值
+        expressCompany: [ // 快递公司选择器数据
+          {
+            id: 1,
+            name: '顺丰快递'
+          },
+          {
+            id: 2,
+            name: '申通快递'
+          },
+          {
+            id: 3,
+            name: '圆通快递'
+          }
+        ],
+        expressCompanySelect: '', // 快递公司绑定值
+        outletsAddress: [ // 网点发货地址选择器数据
+          {
+            id: 1,
+            name: '随叶等候的风'
+          },
+          {
+            id: 2,
+            name: '俊俊的小店'
+          }
+        ],
+        outletsAddressSelect: '', // 网点发货地址绑定值
+        isSelectIcon: false, // 判断是否选中无限量共享
+        icSelect: require('@/assets/images/exp/ic-order-share-select.png'),
+        icSelectNull: require('@/assets/images/exp/ic-order-share-nullselect.png'),
+      };
+    },
+    mounted() {
+    },
+    methods: {
+      network() {
+        return {
+          example: async () => {
+            console.log('network');
+          },
+        };
+      },
+      handler() {
+        return {
+          example: () => {
+            console.log('handle');
+          },
+        };
+      },
+      // 选择店铺名
+      selectPlatformName(event) {
+        console.log('event',event.detail.value)
+        let index = event.detail.value
+        this.platformNameSelect = this.platformName[index].name
+      },
+      // 选择面单账号
+      selectOrderUser(event) {
+        console.log('event',event.detail.value)
+        let index = event.detail.value
+        this.orderUserSelect = this.orderUser[index].name
+      },
+      // 选择快递公司
+      selectExpressCompany(event) {
+        console.log('event',event.detail.value)
+        let index = event.detail.value
+        this.expressCompanySelect = this.expressCompany[index].name
+      },
+      // 选择网点发货地址
+      selecOutletsAddress(event) {
+        console.log('event',event.detail.value)
+        let index = event.detail.value
+        this.outletsAddressSelect = this.outletsAddress[index].name
+      },
+    },
+  };
+</script>
+
+<style>
+  page{
+    background-color: #f1f1f1;
+  }
+</style>
+
+<style lang="scss" scoped>
+  .container {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    width: 750rpx;
+    // height: 1197rpx;
+  }
+  .select-show {
+    box-sizing: border-box;
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: space-between;
+    width: 750rpx;
+    height: 90rpx;
+    padding: 0 24rpx;
+    background: #fff;
+    .name {
+      font-size: 28rpx;
+      color: #666;
+    }
+    .value-icon {
+      display: flex;
+      flex-direction: row;
+      align-items: center;
+      font-size: 28rpx;
+      color: #333;
+
+      .search-input {
+        // width: 200rpx;
+      }
+    }
+
+    .input {
+      text-align: end;
+    }
+
+    .radio {
+      display: flex;
+      flex-direction: row;
+      align-items: center;
+
+      .unlimited{
+        display: flex;
+        flex-direction: row;
+        align-items: center;
+        font-size: 28rpx;
+      }
+    }
+  }
+  .btn-primary {
+    position: fixed;
+    bottom: calc(env(safe-area-inset-bottom) + 120rpx);
+    // margin-bottom: calc(env(safe-area-inset-bottom) + 24rpx);
+    border-radius: 40rpx;
+  }
+  // 边距
+  .margin-top2{
+    margin-top: 2rpx;
+  }
+  .margin-top22{
+    margin-top: 22rpx;
+  }
+  .margin-top26{
+    margin-top: 26rpx;
+  }
+  .margin-left16{
+    margin-left: 16rpx;
+  }
+  .margin-left40-right10{
+    margin-right: 10rpx;
+    margin-left: 50rpx;
+  }
+  
+</style>

src/pages/home/order-share/balance.vue

+<template>
+  <div class="container">
+    <div class="box">
+      <div class="name">当前余额</div>
+      <div class="numdata color-fc8431">1000</div>
+    </div>
+    <div class="box">
+      <div class="name">追加</div>
+      <div class="numdata">
+        <div class="nun">0</div>
+        <div class="nunbtn">
+          <div class="num100 bgcolor-fcf2ec">+100</div>
+          <div class="num1000 bgcolor-fcf2ec">+1000</div>
+        </div>
+      </div>
+    </div>
+    <div class="box">
+      <div class="name">减少</div>
+      <div class="numdata">
+        <div class="nun">0</div>
+        <div class="nunbtn">
+          <div class="num100 bgcolor-ebf2ff">-100</div>
+          <div class="num1000 bgcolor-ebf2ff">-1000</div>
+        </div>
+      </div>
+    </div>
+    <div class="box switch">
+      <div class="name">无限制</div>
+      <switch checked @change="switch1Change" color="#3d7eff"/>
+    </div>
+    
+  </div>
+</template>
+
+<script>
+  export default {
+    name: 'index',
+    data() {
+      return {
+        
+      };
+    },
+    mounted() {
+    },
+    methods: {
+      network() {
+        return {
+          example: async () => {
+            console.log('network');
+          },
+        };
+      },
+      handler() {
+        return {
+          example: () => {
+            console.log('handle');
+          },
+        };
+      },
+      // 点击搜索
+      switch1Change(event) {
+        console.log('e',event.target.value)
+      },
+    },
+  };
+</script>
+<style>
+  page{
+    background-color: #f1f1f1;
+  }
+</style>
+<style lang="scss" scoped>
+  // @import "uni.scss";
+  .container {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    width: 750rpx;
+    height: 1197rpx;
+    // margin-top: 23rpx;
+    // margin-bottom: 36rpx;
+  }
+
+  .box {
+    box-sizing: border-box;
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: space-between;
+    width: 750rpx;
+    height: 90rpx;
+    padding: 0 28rpx;
+    margin-top: 2rpx;
+    font-size: 28rpx;
+    background: #fff;
+    
+    .name{
+      width: 112rpx;
+      color: #333;
+    }
+    .numdata{
+      display: flex;
+      flex-direction: row;
+      width: 503rpx;
+
+      .nun {
+        width: 240rpx;
+      }
+
+      .nunbtn {
+        display: flex;
+        flex-direction: row;
+        justify-content: space-between;
+        width: 254rpx;
+
+        .num100{
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          width: 110rpx;
+          height: 54rpx;
+          border-radius: 40rpx;
+        }
+
+        .num1000{
+          display: flex;
+          align-items: center;
+          justify-content: center;
+          width: 124rpx;
+          height: 54rpx;
+          border-radius: 40rpx;
+        }
+
+        .bgcolor-fcf2ec {
+          color: #fc8431;
+          background: #fcf2ec;
+        }
+        .bgcolor-ebf2ff {
+          color: #41aeff;
+          background: #ebf2ff;
+        }
+      }
+    }
+  }
+
+  .switch {
+    margin-top: 24rpx;
+  }
+
+  .color-fc8431{
+    color: #fc8431;
+  }
+
+</style>

src/pages/home/order-share/details.vue

+<template>
+  <div class="container">
+    <div class="title">
+      <div>易打单账号</div>
+      <div>俊俊的小店</div>
+    </div>
+    <div class="box">
+      <div>备注</div>
+      <div class="right">
+        <img class="icon-30 margin-left16" src="@/assets/images/exp/icon-angle-bracket-grey.png"/>
+      </div>
+    </div>
+    <div class="box">
+      <div>面单账号</div>
+      <div class="right">
+        <img class="icon-36" src="@/assets/images/exp/ascription-query-icon-taobao.png"/>
+        <div class="margin-left16">随叶等候的风</div>
+        <img class="icon-30 margin-left16" src="@/assets/images/exp/icon-angle-bracket-grey.png"/>
+      </div>
+    </div>
+    <div class="box">
+      <div>面单余额</div>
+      <div class="right">
+        <div style="color: #fc8431;">10</div>
+        <img class="icon-30 margin-left16" src="@/assets/images/exp/icon-angle-bracket-grey.png"/>
+      </div>
+    </div>
+    <div class="box margin-top23">
+      <div>消费记录</div>
+      <div class="right">
+        <img class="icon-30 margin-left16" src="@/assets/images/exp/icon-angle-bracket-grey.png"/>
+      </div>
+    </div>
+    <div class="box">
+      <div>分享记录</div>
+      <div class="right">
+        <img class="icon-30 margin-left16" src="@/assets/images/exp/icon-angle-bracket-grey.png"/>
+      </div>
+    </div>
+    <div class="box switch margin-top23">
+      <div>停止分享</div>
+      <switch checked @change="switch1Change" color="#3d7eff"/>
+    </div>
+    <div class="btn-primary btn">删除分享</div>
+  </div>
+</template>
+
+<script>
+  export default {
+    name: 'index',
+    data() {
+      return {
+        
+      };
+    },
+    mounted() {
+    },
+    methods: {
+      network() {
+        return {
+          example: async () => {
+            console.log('network');
+          },
+        };
+      },
+      handler() {
+        return {
+          example: () => {
+            console.log('handle');
+          },
+        };
+      },
+      // 点击搜索
+      switch1Change(event) {
+        console.log('e',event.target.value)
+      },
+    },
+  };
+</script>
+<style>
+  page{
+    background-color: #f1f1f1;
+  }
+</style>
+<style lang="scss" scoped>
+  // @import "uni.scss";
+  .container {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    width: 750rpx;
+    height: 1197rpx;
+    // margin-top: 23rpx;
+    // margin-bottom: 36rpx;
+  }
+
+  .title {
+    box-sizing: border-box;
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: space-between;
+    width: 750rpx;
+    height: 40rpx;
+    margin: 26rpx 0;
+    padding: 0 28rpx;
+    font-size: 30rpx;
+    color: #999;
+  }
+  .box {
+    box-sizing: border-box;
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    justify-content: space-between;
+    width: 750rpx;
+    height: 90rpx;
+    padding: 0 28rpx;
+    margin-bottom: 2rpx;
+    background: #fff;
+
+    .right {
+      display: flex;
+      flex-direction: row;
+    }
+  }
+  .switch {
+    padding: 0 14rpx 0 28rpx;
+  }
+  .btn {
+    position: fixed;
+    right: 25rpx;
+    bottom: 20rpx;
+    left: 25rpx;
+    width: 700rpx;
+    height: 80rpx;
+    margin-bottom: env(safe-area-inset-bottom);
+    font-size: 30rpx;
+    color: #fff;
+    border-radius: 40rpx;
+    
+  }
+  .margin-left16 {
+    margin-left: 16rpx;
+  }
+  .margin-top23 {
+    margin-top: 23rpx;
+  }
+
+</style>

src/pages/home/order-share/index.vue

+<template>
+  <div class="container">
+    <!-- 搜索 -->
+    <div class="search-show">
+      <div class="search">
+        <img class="icon-28 margin-left-30" src="@/assets/images/exp/homeindex-icon-search.png"/>
+        <input class="search-input" type="text" placeholder="请输入对方账号/面单账号" @input="search"/>
+      </div>
+      <div class="search-btn">查询</div>
+    </div>
+    <!-- 无数据空状态 -->
+    <div class="nulldata fscolor-999" v-if="isnull">
+      <img class="icon-180" src="@/assets/images/exp/icon-nulldata-state.png"/>
+      未查询到分享的订单信息
+    </div>
+    <!-- 有数据展示 -->
+    <div v-if="!isnull">
+      <div class="order-title" >
+        <div class="son1">对方店铺账号</div>
+        <div class="son1 son2">面单账号</div>
+        <div class="son1">余额</div>
+      </div>
+      <div v-if="isSearchInput">
+        <div class="order-data" v-for="item in userDataList" :key="item">
+          <div class="son ">
+            <div class="padding-left27">{{item.objectShopCode}}</div>
+          </div>
+
+          <div class="son ">
+            <div class="padding-left22">
+              <img class="icon-36" :src='item.brandNameIcon' />
+              <div class="son-brandname fs-28">
+                {{item.ordeCode}}
+              </div>
+            </div>
+          </div>
+          <div class="son balance">
+            <div class="son-shopsName fs-28">
+              {{item.balance}}
+            </div>
+            <img class="icon-20" src="@/assets/images/exp/icon-angle-bracket-grey.png"/>
+          </div>
+        </div>
+      </div>
+    </div>
+    <!-- 新增按钮 -->
+    <div class="btn-primary">新增面单分享</div>
+  </div>
+</template>
+
+<script>
+  export default {
+    name: 'index',
+    data() {
+      return {
+        isnull: false, // test数据，用于测试显示空数据 true显示空状态图，false则不显示
+        isSearchInput: true, // true为输入有数据，false为无结果
+        SearchInputLength: 2, // 判断输入的单号
+        userDataList: [ // 订单的数据列表
+          {
+            id: 1,
+            objectShopCode: '俊俊的小店',
+            ordeCode: '随叶等候的风',
+            brandNameIcon: require('@/assets/images/exp/ascription-query-icon-pinduoduo.png'),
+            balance: 10,
+          },
+          {
+            id: 2,
+            objectShopCode: '13457260000',
+            ordeCode: '好淘的店',
+            brandNameIcon: require('@/assets/images/exp/ascription-query-icon-pinduoduo.png'),
+            balance: 35,
+          },
+          {
+            id: 3,
+            objectShopCode: '17677122222',
+            ordeCode: '俊俊的小店',
+            brandNameIcon: require('@/assets/images/exp/ascription-query-icon-taobao.png'),
+            balance: 10,
+          },
+          {
+            id: 4,
+            objectShopCode: '13457260000',
+            ordeCode: '好淘的店',
+            brandNameIcon: require('@/assets/images/exp/ascription-query-icon-pinduoduo.png'),
+            balance: 35,
+          }
+        ],
+      };
+    },
+    mounted() {
+    },
+    methods: {
+      network() {
+        return {
+          example: async () => {
+            console.log('network');
+          },
+        };
+      },
+      handler() {
+        return {
+          example: () => {
+            console.log('handle');
+          },
+        };
+      },
+      // 点击搜索
+      search(event) {
+        console.log('e',event.target.value)
+      },
+    },
+  };
+</script>
+<style>
+  page{
+    background-color: #f1f1f1;
+  }
+</style>
+<style lang="scss" scoped>
+  // @import "uni.scss";
+  .container {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    // justify-content: center;
+    width: 750rpx;
+    // height: 1197rpx;
+    margin-top: 23rpx;
+    margin-bottom: 36rpx;
+    background-color: $background-color;
+  }
+
+  .search-show {
+    display: flex;
+    flex-direction: row;
+    justify-content: center;
+    width: 750rpx;
+    height: 66rpx;
+    margin: 24rpx 0 24rpx 0;
+
+    .search {
+      box-sizing: border-box;
+      display: flex;
+      flex-direction: row;
+      align-items: center;
+      justify-content: space-between;
+      width: 572rpx;
+      height: 66rpx;
+      padding: 0 24rpx;
+      background: $input-background-color;
+      opacity: 1;
+      border-radius: 42rpx 0 0 42rpx;
+
+      .search-input {
+        width: 485rpx;
+        margin-left: 14rpx;
+        margin-right: 14rpx;
+      }
+    }
+
+    .search-btn{
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      width: 128rpx;
+      height: 66rpx;
+      font-size: 28rpx;
+      line-height: 23rpx;
+      color: #fff;
+      background: $primary-color;
+      border-radius: 0 42rpx 42rpx 0;
+    }
+  }
+
+  .nulldata {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    width: 750rpx;
+    margin-top: 296px;
+    margin-bottom: 470rpx;
+  }
+
+  .order-title {
+    display: flex;
+    flex-direction: row;
+    width: 750rpx;
+    height: 84rpx;
+    margin-top: 24rpx;
+    font-size: 30rpx;
+    color: #999;
+    background: #EFF5FF;
+    box-shadow: 0rpx 4rpx 10rpx rgba(54, 54, 54, 0.05);
+    opacity: 1;
+
+    .son1 {
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      flex: 1;
+    }
+    .son2 {
+      position:relative;
+      // display: flex;
+      // align-items: center;
+      // justify-content: center;
+      // flex: 1;
+    }
+    .son2::after, .son2::before{
+      position: absolute;
+      width:30rpx;
+      height:1rpx;
+      // background:#000;
+      content:'|';
+      // top:25px;
+    }
+    .son2::after {
+      top: 26rpx;
+      left: 0;
+    }
+    .son2::before {
+      top: 26rpx;
+      right: -26rpx;
+    }
+  }
+
+  .order-data {
+    display: flex;
+    flex-direction: row;
+    width: 750rpx;
+    height: 90rpx;
+    font-size: 28rpx;
+    color: #333;
+    border-color:#e4e4e4;
+    border-width: 1rpx;
+    border-bottom-style:solid;
+    opacity: 1;
+
+    .son {
+      display: flex;
+      align-items: center;
+      // justify-content: center;
+      flex: 1;
+
+      .son-brandname {
+        display: -webkit-box;
+        width: 175rpx;
+        margin-left: 6rpx;
+        -webkit-box-orient: vertical;    
+        -webkit-line-clamp: 1;    
+        overflow: hidden;
+        // overflow: hidden;
+        // text-overflow: ellipsis;
+      }
+
+      .son-shopsName {
+        color: #fc8431;
+      }
+    }
+
+    .balance {
+      position: relative;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+    }
+
+  }
+
+  .btn-primary {
+    position: fixed;
+    bottom: calc(env(safe-area-inset-bottom) + 120rpx);
+    // margin-bottom: calc(env(safe-area-inset-bottom) + 24rpx);
+    border-radius: 40rpx;
+  }
+
+  // 边距
+  .padding-left22 {
+    box-sizing: border-box;
+    display: flex;
+    flex-direction: row;
+    align-items: center;
+    padding-left: 22rpx;
+  }
+  .padding-left27 {
+    font-family: MicrosoftYaHei;
+    box-sizing: border-box;
+    padding-left: 27rpx;
+  }
+
+  .icon-20 {
+    position: absolute;
+    right: 25rpx;
+  }
+
+</style>

src/pages/home/order-share/record.vue

+<template>
+  <div class="container">
+    <div class="share-title">记录了分享面单操作的日期和内容</div>
+    <div class="share-data">
+      <div slot="content">
+        <div class="follow-modal">
+          <div class="foolow-box">
+            <!-- <div class="header">
+              <div class="title">跟进进度</div>
+            </div> -->
+            <div class="ul">
+              <div class="li" v-for="item in shareDataList" :key="item" :class="{ active: item === 0 }">
+                <div class="item">
+                  <div class="time">{{item.data+ ' ' +item.time}}</div>
+                  <div class="content">{{item.text}}</div>
+                  <!-- <div class="name">烨卿山</div> -->
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+  export default {
+    name: 'index',
+    data() {
+      return {
+        shareDataList: [ // 分享的数据列表
+          {
+            id: 1,
+            data: '2020-12-24',
+            time: '08:21:32',
+            text: '为手机号：17677122222增加可以余额【1100】，快递公司/面单账号：宅急送/俊俊的小店'
+          },
+          {
+            id: 1,
+            data: '2020-11-21',
+            time: '08:21:32',
+            text: '开始分享'
+          },
+          {
+            id: 2,
+            data: '2020-10-23',
+            time: '08:21:32',
+            text: '停止分享'
+          },
+          {
+            id: 1,
+            data: '2020-09-16',
+            time: '08:21:32',
+            text: '为手机号：17677122222开通电子面单分享，单号数量：【10】，快递公司/面单账号：宅急送/俊俊的小店'
+          },
+        ],
+      };
+    },
+    mounted() {
+    },
+    methods: {
+      network() {
+        return {
+          example: async () => {
+            console.log('network');
+          },
+        };
+      },
+      handler() {
+        return {
+          example: () => {
+            console.log('handle');
+          },
+        };
+      },
+      // 点击搜索
+      search(event) {
+        console.log('e',event.target.value)
+      },
+    },
+  };
+</script>
+<style>
+  page{
+    background-color: #f1f1f1;
+  }
+</style>
+<style lang="scss" scoped>
+  // @import "uni.scss";
+  .container {
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    width: 750rpx;
+    height: 1197rpx;
+    // margin-top: 23rpx;
+    // margin-bottom: 36rpx;
+  }
+
+  .share-title {
+    display: flex;
+    // align-items: center;
+    justify-content: center;
+    width: 750rpx;
+    height: 37rpx;
+    margin: 26rpx 0 28rpx 0;
+    font-size: 28rpx;
+    color: #999;
+  }
+
+  .share-data {
+    box-sizing: border-box;
+    width: 750rpx;
+    // padding: 30rpx 0 75rpx 0;
+    background: #fff;
+  }
+
+  // 快递进度模板
+  .follow-modal {
+    width: 100vw;
+    padding: 30rpx 30rpx 15rpx 40rpx;
+
+    .foolow-box {
+      background: #ffffff;
+      border-radius: 20rpx;
+      // padding: 32rpx;
+      .ul {
+        margin-top: 33rpx;
+        .li {
+          position: relative;
+          border-left: 1px solid #ccc;
+          padding: 20rpx 0 0 26rpx;
+          &::before {
+            content: '';
+            position: absolute;
+            top: 0;
+            left: -8rpx;
+            width: 16rpx;
+            height: 16rpx;
+            border-radius: 50%;
+            background: #ccc;
+          }
+          &.active {
+            &::before {
+              background: #3d7eff;
+            }
+            // border-left-color: #3d7eff;
+          }
+          &:last-child {
+            border: none;
+          }
+          .item {
+            position: relative;
+            top: -30rpx;
+            .content {
+              padding: 22rpx 0 60rpx 0;
+              font-size: 28rpx;
+              font-family: MicrosoftYaHei;
+              color: #333;
+            }
+            .time {
+              margin-top: 5rpx;
+            }
+            .time,
+            .name {
+              font-size: 26rpx;
+              color: #999999;
+            }
+          }
+        }
+      }
+    }
+  }
+
+</style>

src/pages/index.vue

+<template>
+  <div class="container">
+    <div class="line" @click="navigateTo('/pages/example/button')">按钮</div>
+    <div class="line" @click="clickHandle('test click', $event)">点击获取参数</div>
+    <div class="line" @click="navigateTo('/pages/example/counter')">Vuex示例页面</div>
+    <div class="line" @click="navigateTo('/pages/example/wxParse')">文章-富文本</div>
+    <div class="line" @click="navigateTo('/pages/example/components')">组件</div>
+  </div>
+</template>
+
+<script>
+
+  import { getList } from '@/api/sample';
+  import iconfontObj from '@/assets/font/iconfont.json';
+
+  export default {
+    mpType: 'page',
+
+    data() {
+      return {
+        motto: 'Hello World',
+        iconfontObj,
+      };
+    },
+
+    created() {
+      // this.network().getList(); // 调用应用实例的方法获取全局数据
+    },
+
+    methods: {
+      clickHandle(msg, ev) {
+        console.log('clickHandle:', msg, ev);
+      },
+      bindViewTap() {
+        this.$router.push('/packageA/logs');
+      },
+      network() {
+        return {
+          getList: async () => {
+            const { data } = await getList()
+            console.log(data);
+          },
+        };
+      },
+      handler() {
+        return {
+          example: () => {
+            console.log('handle');
+          },
+        };
+      },
+    },
+  };
+</script>
+
+<style lang="scss" scoped>
+  .container {
+    padding: 20rpx;
+    .line {
+      display: flex;
+      flex-wrap: wrap;
+      & + .line {
+        margin-top: 20rpx;
+      }
+    }
+  }
+</style>

src/pages/login/index.vue

+<template>
+  <div class="container">
+    <div class="container-box" :style="{backgroundImage:`url(${logobackground})`}">
+		<div class="logo"><image :src="require('../../assets/images/logo.png')" mode="widthFix"></image></div>
+		<h1>Welcome SIA</h1>
+		<p class="login-text">Here’s to create 作品连接世界</p>
+        <div class="login-form">
+			<div class="login-form-cell">
+				<p>手机号</p>
+				<input type="text" class="ipt" :value="phone" placeholder="请输入您的11位手机号" placeholder-style="font-family: PingFangSC-Regular, PingFang SC !important;color: #CCCCCC !important;font-weight: 400 !important;" @input="onInput"/>
+			</div>
+			<div class="login-form-cell">
+				<p>用户身份</p>
+				<div class="identitylist" @click="changeIdentity">
+					<div class="iden-val " :class="identityVal?'iden-result':'iden-placehoder'" >{{identityVal?identityVal:identityDef}}</div>
+					<image :src="require('../../assets/images/putdown.png')" mode="widthFix"></image>
+					<div class="check-ul" v-show="showidentity">
+						<radio-group @change="radioChange">
+						<label  v-for="(item,index) in identity" :key="index">
+						<div class="check-li">
+						{{item.name}}
+						<radio class="login-check" :value="item.value" />
+						
+						</div>
+						</label>
+						</radio-group>
+					</div>
+				</div>
+				
+				
+			</div>
+			<div class="tips" v-if="!checkcurrent"><image :src="require('../../assets/images/error.png')" mode="widthFix"></image>手机号与绑定的身份不符，请重新输入</div>
+			<button type="default" class="login-btn" :class="btnClass" @click="login">登录</button>
+		</div>
+    </div>
+	<div class="login-bottom">
+		<p class="copyright">版权所有@北京鲲鹏山水教育有限公司</p>
+		<p class="agree">登录即代表您已知晓并同意我司<navigator url="">《用户注册协仪》</navigator>及<navigator url="">《使用须知》</navigator></p>
+	</div>
+	</div>
+</template>
+
+<script>
+  import btncode from "@/components/btn-code.vue";
+  import dankalModal from '@/components/dankal-modal';
+  export default {
+    components: {btncode,dankalModal},
+    name: 'index',
+    data() {
+      return {
+       logobackground:'../../static/logo-bg.png',
+	   identity:[
+		   {
+			  name:'学员',
+			  value:'student'
+		   },
+		   {
+			   name:'教师',
+			   value:'teacher'
+		   },
+		   {
+		   			   name:'外部人员',
+		   			   value:'wai'
+		   },
+		   {
+		   			   name:'内部人员',
+		   			   value:'nai'
+		   }
+		   ],
+	   identityVal:'',//选中的值显示
+	   showidentity:false,//是否出现身份选项
+	   identityDef:'请选择您已绑定的用户身份',
+	   phone:'',//账号
+	   btnClass:'login-default',
+	   checkcurrent:true,//判断是否手机号和绑定号是否正确
+      };
+    },
+    mounted() {
+    },
+    methods: {
+      radioChange(evt) {
+		 for (let i = 0; i < this.identity.length; i++) {
+		                if (this.identity[i].value === evt.detail.value) {
+		                    this.identityVal = this.identity[i].name;
+		                    break;
+		                }
+		            }
+					this.checklogin()
+					this.showidentity = false
+      },
+	  changeIdentity(){
+		  this.showidentity = !this.showidentity
+		  
+	  },
+	  onInput(e){
+		  this.phone = e.detail.value
+		  this.checklogin()
+	  },
+	  // 检查是否输入完整
+	  checklogin(){
+		 
+		  if(this.phone&&this.identityVal){
+			  this.btnClass = 'login-check'
+		  }
+	  },
+	  // 登录
+	  login(){
+		  if(this.phone&&this.identityVal){
+			  this.checkcurrent = false
+		  	 uni.navigateTo({
+		  	 	url:'../home/index?user='+this.identityVal,
+		  	 })
+		  }
+	  }
+    },
+  };
+</script>
+
+<style lang="scss" scoped>
+  .container {
+    width: 100vw;
+    height: 100vh;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    background: #FFFFFF;
+	.container-box {
+		width: 100%;
+		height: 708rpx;
+		background-size: cover;
+		.logo{
+			margin: 24rpx 0 0 24rpx;
+			image{
+				width: 134rpx;
+				height: 68rpx;
+			}
+		}
+		h1{
+			font-size: 60rpx;
+			font-family: PingFangSC-Semibold, PingFang SC;
+			font-weight: 600;
+			line-height: 64px;
+		}
+		.login-text{
+			font-size: 24rpx;
+			
+		}
+		h1,.login-text{
+			text-align: center;
+			color: #FFFFFF;
+		}
+		.login-form{
+			position: relative;
+			width: 92%;
+			margin: 58rpx auto 0;
+			padding: 0 30rpx 72rpx;
+			background: #FFFFFF;
+			box-shadow: 0px 0px 32rpx 0px rgba(0, 0, 0, 0.1);
+			border-radius: 24rpx;
+			p{
+				font-size: 28rpx;
+				// font-family: PingFangSC-Regular, PingFang SC;
+				color: #333333;
+			}
+			.input::placeholder{
+			     font-family: PingFangSC-Regular, PingFang SC !important;
+			     color: #CCCCCC !important;
+				 font-weight: 400 !important;
+			    }
+			input{
+				height: 32rpx;
+				line-height:32rpx;
+				margin: 16rpx 0;
+				font-size: 28rpx;
+				font-family: PingFangSC-Semibold, PingFang SC;
+				font-weight: 600;
+				color: #333333;
+				
+			}
+			
+			  
+			    
+			.login-form-cell{
+				padding-top: 40rpx;
+				border-bottom: 1px solid #EEEEEE;
+				.identitylist{
+					position: relative;
+					height: 64rpx;
+					line-height: 64rpx;
+					.iden-val{
+						height: 32rpx;
+						line-height: 32rpx;
+						padding: 15rpx 0;
+						&.iden-placehoder{
+							font-family: PingFangSC-Regular, PingFang SC !important;
+							color: #CCCCCC !important;
+						}
+						&.iden-result{
+							font-family: PingFangSC-Semibold, PingFang SC;
+							font-weight: 600;
+							color: #333333;
+						}
+					}
+					image{
+						position: absolute;
+						top: 50%;
+						right: 0;
+						transform: translateY(-50%);
+						width: 32rpx;
+					}
+					.check-ul{
+						position: absolute;
+						z-index: 99;
+				        top: 67rpx;
+						width: 100%;
+						background: #FFFFFF;
+						box-shadow: 0px 0px 16rpx 0px rgba(0, 0, 0, 0.1);
+						border-radius: 24rpx;
+						padding-bottom: 30rpx;
+						.check-li{
+							position: relative;
+							font-size: 28rpx;
+							color: #000000;
+							line-height: 32rpx;
+						    padding: 30rpx 30rpx 0;
+							radio{
+								position: absolute;
+								top: 45%;
+								right: 30rpx;
+								transform: translateY(-50%);
+								width: 32rpx;
+								height: 32rpx;
+							}
+							
+						}
+						
+				}
+				}
+			}
+			.tips{
+				font-size: 24rpx;
+				color: #FF3334;
+				margin-top: 30rpx;
+				image{
+					width: 32rpx;
+					height: 32rpx;
+					margin-left: 8rpx;
+					vertical-align: middle;
+				}
+			}
+			.login-btn{
+				position: absolute;
+				bottom: -56rpx;
+				width: calc(100% - 60rpx);
+				height: 88rpx;
+				text-align: center;
+				line-height: 88rpx;
+				box-shadow: 0px 8rpx 16rpx 0px rgba(0, 0, 0, 0.1);
+				border-radius: 44rpx;
+				font-size: 32rpx;
+				color: #FFFFFF;
+				&.login-default{
+				background: #CCCCCC;
+			    }
+				&.login-check{
+				background: linear-gradient(135deg, #FF6E58 0%, #FF3334 100%);
+			}
+			}
+			
+			
+		}
+	}
+	.login-bottom{
+		position: absolute;
+		bottom: 48rpx;
+		width: 100%;
+		text-align: center;
+		font-size: 22rpx;
+		.copyright{
+			color: #333333;
+			margin-bottom: 16rpx;
+		}
+		.agree{
+			color: #999999;
+			navigator{
+				display: inline-block;
+				color: #007AFF;
+			}
+		}
+		
+	}
+  }
+
+ 
+</style>

src/pages/printing/index.vue

+<template>
+  <div class="container">user</div>
+</template>
+
+<script>
+  export default {
+    name: 'index',
+    data() {
+      return {};
+    },
+    mounted() {
+    },
+    methods: {
+      network() {
+        return {
+          example: async () => {
+            console.log('network');
+          },
+        };
+      },
+      handler() {
+        return {
+          example: () => {
+            console.log('handle');
+          },
+        };
+      },
+    },
+  };
+</script>
+
+<style lang="scss" scoped>
+  .container {
+
+  }
+</style>

src/pages/shop-order/index.vue

+<template>
+  <div class="container">user</div>
+</template>
+
+<script>
+  export default {
+    name: 'index',
+    data() {
+      return {};
+    },
+    mounted() {
+    },
+    methods: {
+      network() {
+        return {
+          example: async () => {
+            console.log('network');
+          },
+        };
+      },
+      handler() {
+        return {
+          example: () => {
+            console.log('handle');
+          },
+        };
+      },
+    },
+  };
+</script>
+
+<style lang="scss" scoped>
+  .container {
+
+  }
+</style>

src/pages/user/index.vue

+<template>
+  <div class="container">user</div>
+</template>
+
+<script>
+  export default {
+    name: 'index',
+    data() {
+      return {};
+    },
+    mounted() {
+    },
+    methods: {
+      network() {
+        return {
+          example: async () => {
+            console.log('network');
+          },
+        };
+      },
+      handler() {
+        return {
+          example: () => {
+            console.log('handle');
+          },
+        };
+      },
+    },
+  };
+</script>
+
+<style lang="scss" scoped>
+  .container {
+
+  }
+</style>

src/routers/build.js

+const fs = require('fs')
+const path = require('path')
+const router = require('./index.js')
+
+// 将子路由模块配置文件转化为 uniapp 配置文件格式---pages
+const buildRouter = route => {
+  let res = []
+  const { baseUrl, children } = route
+  res = builder(baseUrl, children)
+  return res
+}
+// 将子路由模块配置文件转化为 uniapp 配置文件格式---subPackages
+const buildsubPackages = subPackages => {
+  const res = []
+  subPackages&&subPackages.forEach(item => {
+    let obj  = {
+      root: item.root,
+      pages: builder('',item.pages),
+    }
+    res.push(obj)
+  })
+  return res
+}
+
+// 兼容pages
+function builder(baseUrl,children){
+  const res = []
+
+  children.forEach(i => {
+    if (i.children) {
+      builder(baseUrl + i.path + '/', i.children)
+    } else {
+      const obj = {
+        path: baseUrl + i.path,
+        style: {
+          navigationBarTitleText: i.name
+        }
+      }
+      Object.keys(i).forEach(ii => {
+        !['path', 'name'].includes(ii) && (obj.style[ii] = i[ii])
+      })
+      res.push(obj)
+    }
+  })
+  return res
+}
+// 自动加载 './modules' 目录子路由配置文件
+const getRouter = (file_array) => {
+  let router = []
+  file_array.forEach(r => {
+    const route = require(r)
+    router = [ ...router, ...buildRouter(route)]
+  })
+  return router
+}
+// 自动加载 './modules' 目录子路由配置文件
+const getsubPackages = (file_array) => {
+  let subPackages = []
+  file_array.forEach(r => {
+    const route = require(r)
+    subPackages = [ ...subPackages, ...buildsubPackages(route.subPackages)]
+  })
+  return subPackages
+}
+
+const getFile = (srcPath) => {
+  const result = fs.readdirSync(srcPath)
+  let file = []
+  result.forEach(r => {
+    const path = srcPath + '/' + r
+    const stat = fs.lstatSync(path)
+    const is_file = stat.isFile()
+    const is_directory = stat.isDirectory()
+    if (is_file) { // 是文件
+      file.push(path)
+    }
+    if (is_directory) {
+      const file_array = getFile(path) // 递归查询子文件夹
+      file = file.concat(file_array)
+    }
+  })
+  return file
+}
+
+// 构建 pages 并写入 pages.json 文件
+const srcPath = path.resolve(__dirname, './modules')
+const file_array = getFile(srcPath) // 递归查询所有modules下的文件
+router.pages = getRouter(file_array)
+router.subPackages = getsubPackages(file_array)
+// console.log('router.pages',router.pages);
+fs.writeFile(
+  __dirname + '/../pages.json',
+  // 我这边是用两个空格来缩进 pages.json，如果喜欢制表符，第三个参数更换你为 \t 即可
+  JSON.stringify(router, null, '  '),
+  e => e ? console.error(e) : console.log('pages.json 配置文件更新成功')
+)

src/routers/index.js

+module.exports = {
+	globalStyle: {
+		navigationBarTextStyle: 'black',
+		navigationBarTitleText: 'SIA',
+		navigationBarBackgroundColor: '#fff',
+		backgroundColor: '#fff',
+	},
+}

src/routers/modules/course/index.js

+/*
+  * 课程url配置
+*/
+module.exports = {
+  baseUrl: '',
+  // pages配置
+  children: [
+
+  ],
+  // 分包配置
+  subPackages: [
+    {
+			root: "packageCourse",
+			pages: [
+        {
+          path: "course/index",
+          navigationBarTitleText: "我的课程",
+          enablePullDownRefresh: false,
+          navigationStyle: "custom"
+        },
+        {
+          path: "course/details",
+          navigationBarTitleText: "课程详情",
+          enablePullDownRefresh: false,
+          navigationStyle: "custom"
+        },
+      ]
+		},
+  ]
+}
+
+
+
+

src/routers/modules/educational/index.js

+/*
+  * 教务url配置
+*/
+module.exports = {
+  baseUrl: '',
+  // pages配置
+  children: [
+
+  ],
+  // 分包配置
+  subPackages: [
+   
+  ]
+}
+
+
+
+

src/routers/modules/index/inedx.js

+/*
+  * 基础页面url配置
+*/
+module.exports = {
+  baseUrl: '',
+  children: [
+    {
+      path: 'pages/example/counter',
+    }, 
+    {
+      path: 'pages/example/wxParse',
+      navigationBarTitleText: '文章-富文本',
+    },
+    {
+			path: "pages/example/button"
+		},
+    {
+			path: "pages/index"
+		},
+    {
+			path: "pages/home/index/resources",
+      navigationBarTitleText: "",
+      enablePullDownRefresh: false,
+		},
+    {
+			path: "pages/channels/channels",
+      navigationBarTitleText: "资源录入",
+      enablePullDownRefresh: false,
+      navigationStyle: "custom"
+		},
+    {
+			path: "pages/course/details",
+      navigationBarTitleText: "课程详情",
+      enablePullDownRefresh: false,
+      navigationStyle: "custom"
+		},
+    {
+			path: "pages/course/index",
+      navigationBarTitleText: "我的课程",
+      enablePullDownRefresh: false,
+      navigationStyle: "custom"
+		},
+  ],
+}
+
+
+
+

src/routers/modules/login/index.js

+/*
+  * 教务url配置
+*/
+module.exports = {
+  baseUrl: '',
+  // pages配置
+  children: [
+    {
+      path: 'pages/login/index',
+      navigationBarTitleText: 'SIA',
+      backgroundColor: '#f7fbff',
+    }, 
+    {
+      path: 'pages/home/index',
+      navigationBarTitleText: '首页',
+      navigationBarBackgroundColor: '#42b4ff',
+      'backgroundColor-color': '#f1f1f1',
+    },
+    {
+			path: "pages/home/index/index",
+      navigationBarTitleText: "首页",
+      enablePullDownRefresh: false,
+		},
+  ],
+  // 分包配置
+  subPackages: [
+   
+  ]
+}
+
+
+
+

src/static/index.js

+var _typeof = typeof Symbol === "function" && typeof Symbol.iterator === "symbol" ? function (obj) { return typeof obj; } : function (obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; };
+
+// Copyright Joyent, Inc. and other Node contributors.
+//
+// Permission is hereby granted, free of charge, to any person obtaining a
+// copy of this software and associated documentation files (the
+// "Software"), to deal in the Software without restriction, including
+// without limitation the rights to use, copy, modify, merge, publish,
+// distribute, sublicense, and/or sell copies of the Software, and to permit
+// persons to whom the Software is furnished to do so, subject to the
+// following conditions:
+//
+// The above copyright notice and this permission notice shall be included
+// in all copies or substantial portions of the Software.
+//
+// THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS
+// OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+// MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN
+// NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM,
+// DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR
+// OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE
+// USE OR OTHER DEALINGS IN THE SOFTWARE.
+
+var stringifyPrimitive = function stringifyPrimitive(v) {
+  switch (typeof v === 'undefined' ? 'undefined' : _typeof(v)) {
+    case 'string':
+      return v;
+
+    case 'boolean':
+      return v ? 'true' : 'false';
+
+    case 'number':
+      return isFinite(v) ? v : '';
+
+    default:
+      return '';
+  }
+};
+
+function stringify(obj, sep, eq, name) {
+  sep = sep || '&';
+  eq = eq || '=';
+  if (obj === null) {
+    obj = undefined;
+  }
+
+  if ((typeof obj === 'undefined' ? 'undefined' : _typeof(obj)) === 'object') {
+    return Object.keys(obj).map(function (k) {
+      var ks = stringifyPrimitive(k) + eq;
+      if (Array.isArray(obj[k])) {
+        return obj[k].map(function (v) {
+          return ks + stringifyPrimitive(v);
+        }).join(sep);
+      } else {
+        return ks + stringifyPrimitive(obj[k]);
+      }
+    }).filter(Boolean).join(sep);
+  }
+
+  if (!name) return '';
+  return stringifyPrimitive(name) + eq + stringifyPrimitive(obj);
+}
+
+function parseUrl(location) {
+  if (typeof location === 'string') return location;
+
+  var path = location.path,
+      query = location.query;
+
+  var queryStr = stringify(query);
+
+  if (!queryStr) {
+    return path;
+  }
+
+  return path + '?' + queryStr;
+}
+
+function parseRoute($mp) {
+  var _$mp = $mp || {};
+  var path = _$mp.page && _$mp.page.route;
+  return {
+    path: '/' + path,
+    params: {},
+    query: _$mp.query,
+    hash: '',
+    fullPath: parseUrl({
+      path: '/' + path,
+      query: _$mp.query
+    }),
+    name: path && path.replace(/\/(\w)/g, function ($0, $1) {
+      return $1.toUpperCase();
+    })
+  };
+}
+
+function push(location, complete, fail, success) {
+  var url = parseUrl(location);
+  var params = { url: url, complete: complete, fail: fail, success: success };
+
+  if (location.isTab) {
+    uni.switchTab(params);
+    return;
+  }
+  if (location.reLaunch) {
+    uni.reLaunch(params);
+    return;
+  }
+  uni.navigateTo(params);
+}
+
+function replace(location, complete, fail, success) {
+  var url = parseUrl(location);
+  uni.redirectTo({ url: url, complete: complete, fail: fail, success: success });
+}
+
+function go(delta) {
+  uni.navigateBack({ delta: delta });
+}
+
+function back() {
+  uni.navigateBack();
+}
+
+var _Vue = void 0;
+
+var index = {
+  install: function install(Vue) {
+    if (this.installed && _Vue === Vue) return;
+    this.installed = true;
+
+    _Vue = Vue;
+
+    var _router = {
+      mode: 'history',
+      push: push,
+      replace: replace,
+      go: go,
+      back: back
+    };
+
+    Vue.mixin({
+      onLoad: function onLoad() {
+        var $mp = this.$root.$mp;
+
+        this._route = parseRoute($mp);
+      },
+      onShow: function onShow() {
+        _router.app = this;
+        _router.currentRoute = this._route;
+      }
+    });
+
+    Object.defineProperty(Vue.prototype, '$router', {
+      get: function get() {
+        return _router;
+      }
+    });
+
+    Object.defineProperty(Vue.prototype, '$route', {
+      get: function get() {
+        return this._route;
+      }
+    });
+  }
+};
+
+export default index;
+export { _Vue };

src/store/index.js

+// https://vuex.vuejs.org/zh-cn/intro.html
+// make sure to call Vue.use(Vuex) if using a module system
+import Vue from 'vue';
+import Vuex from 'vuex';
+
+Vue.use(Vuex);
+
+const store = new Vuex.Store({
+  state: {
+    count: 0,
+  },
+  mutations: {
+    increment: (state) => {
+      const obj = state;
+      obj.count += 1;
+    },
+    decrement: (state) => {
+      const obj = state;
+      obj.count -= 1;
+    },
+  },
+});
+
+export default store;

src/uni.scss

+/**
+ * 这里是uni-app内置的常用样式变量
+ *
+ * uni-app 官方扩展插件及插件市场（https://ext.dcloud.net.cn）上很多三方插件均使用了这些样式变量
+ * 如果你是插件开发者，建议你使用scss预处理，并在插件代码中直接使用这些变量（无需 import 这个文件），方便用户通过搭积木的方式开发整体风格一致的App
+ *
+ */
+
+/**
+ * 如果你是App开发者（插件使用者），你可以通过修改这些变量来定制自己的插件主题，实现自定义主题功能
+ *
+ * 如果你的项目同样使用了scss预处理，你也可以直接在你的 scss 代码中使用如下变量，同时无需 import 这个文件
+ */
+
+/* 颜色变量 */
+
+/* 行为相关颜色 */
+// =================================用于配置常用的 CSS 变量
+
+//主要颜色
+$primary-color: #007FFF;
+//二级颜色
+$secondary-color:#32CBBC;
+//三级颜色
+$tertiary-color:'#FFFFFF';
+
+//主要文字颜色
+$primary-text-color:#262626;
+//二级文字颜色
+$secondary-text-color:#666666;
+//三级文字颜色
+$tertiary-text-color:#333333;
+
+//主要按钮颜色
+$primary-button-color:$primary-color;
+//二级按钮颜色
+$secondary-button-color:$secondary-color;
+//三级按钮颜色
+$tertiary-button-color: $tertiary-color;
+
+//不可点击时按钮颜色
+$button-disabled-color:linear-gradient(180deg, #42B4FF 0%, #3985FD 100%);;
+
+//容器背景颜色
+$background-color:#fff;
+//placeholder颜色
+$placeholder-color:#e5e5e5;
+//border颜色
+$border-color:#e5e5e5;
+// input背景色
+$input-background-color: #f6f6f6;
+
+// UI 字体
+$font-family: 'lucida grande', 'lucida sans unicode', lucida, helvetica,
+'Hiragino Sans GB', 'Microsoft YaHei', 'WenQuanYi Micro Hei', sans-serif;
+
+// ================================= 临时
+
+// 默认Flex布局
+@mixin flex-box(){
+  display: flex;
+  flex-direction: row;
+  align-items: center;
+  justify-content: space-between;
+}
+
+// 默认定位布局
+@mixin pos-box($position:absolute,$top:auto,$right:auto,$bottom:auto,$left:auto){
+  position: $position;
+  top: $top;
+  bottom: $bottom;
+  right: $right;
+  left: $left;
+}
+
+//清除浮动
+@mixin clear{
+  clear: both;
+  &:after{
+    content: '';
+    display: block;
+    clear: both;
+  }
+}
+
+//限制行数为n行
+@mixin line-limit-n($-webkit-line-clamp : 1){
+  overflow: hidden;
+  display: -webkit-box;
+  -webkit-line-clamp: $-webkit-line-clamp;
+  -webkit-box-orient: vertical;
+}
+
+// 默认按钮
+@mixin button(
+  $width:auto,
+  $height:auto,
+  $background: $primary-color,
+  $border-color: $primary-color,
+  $border-radius:0,
+  $color:#FFFFFF,
+  $font-size: 28rpx)
+{
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  margin: 0 auto;
+  width: $width;
+  height: $height;
+  border-radius: $border-radius;
+  border: 1px solid $border-color;
+  background: $background;
+  color: $color;
+  font-size: $font-size;
+  &:active{ opacity: 0.8 }
+}
+
+// 提交按钮（主色）
+@mixin btn-primary(){
+  @include button(700rpx, 80rpx, linear-gradient(90deg, #42B4FF 0%, #3985FD 100%));
+}
+
+// 提交按钮（次色）
+@mixin btn-secondary(){
+  @include button(610rpx, 80rpx,$tertiary-color,  rgba(30,30,32,.2),0.46rem,  #454649, 32rpx);
+}
+
+// 提交按钮（无效）
+@mixin btn-disable(){
+  @include button(700rpx, 80rpx, 40rpx, $button-disabled-color, $button-disabled-color, #fff, 32rpx)
+}
+
+
+// 尾部添加小icon
+@mixin icon-box(){
+  display: flex;
+  align-items: center;
+  &:after{
+    content: '';
+    display: block;
+    width: 24rpx ;
+    height: 24rpx;
+    margin-left: auto;
+    background-size: contain !important;
+  }
+}
+
+// 尾部添加向右icon（背景图片应换相对应项目的图片地址）
+@mixin icon-box-right() {
+  @include icon-box;
+  &:after{
+    background: url('https://qiniu.mctower.runworld.com.cn/static-image/ic_repair_more.png') no-repeat center;
+  }
+}
+
+// 尾部添加向右icon（背景图片应换相对应项目的图片地址）
+@mixin icon-box-left() {
+  @include icon-box;
+  &:before{
+    content: '';
+    display: block;
+    width: 24rpx ;
+    height: 24rpx;
+    margin-left: auto;
+    background-size: contain !important;
+    background: url('https://qiniu.mctower.runworld.com.cn/static-image/ic_repair_more.png') no-repeat center;
+    transform: rotate(180deg);
+    margin-right: auto;
+  }
+  &:after{
+    display: none;
+  }
+}
+
+// 尾部添加向上icon（背景图片应换相对应项目的图片地址）
+@mixin icon-box-up() {
+  @include icon-box;
+  &:after{
+    background: url('https://qiniu.mctower.runworld.com.cn/static-image/ic_my_home_tip.png') no-repeat center;
+  }
+}
+
+// 尾部添加向下icon（背景图片应换相对应项目的图片地址）
+@mixin icon-box-down() {
+  @include icon-box;
+  &:after{
+    width: 20rpx ;
+    height: 12rpx;
+    background-size: 100% 100% !important;
+    background: url('https://qiniu.mctower.runworld.com.cn/static-image/ic_mine_down.png') no-repeat center;
+  }
+}
+
+// 选择状态的icon（背景图片应换相对应项目的图片地址）
+@mixin icon-select(){
+  display: inline-block;
+  vertical-align: middle;
+  min-width: 44rpx;
+  max-width: 44rpx;
+  width: 44rpx;
+  height: 44rpx;
+  border-radius: 100%;
+  background-size: 100% 100% !important;
+  margin-right: 20rpx;
+  background: #ffffff url('https://qiniu.mctower.runworld.com.cn/static-image/ic_round_unselected.png');
+  &.on{background: #ffffff url('http://image.sch.dankal.cn/ic_selected.png');}
+}
+
+// 占位图 （背景图片应换相对应项目的图片地址）
+@mixin placeholder-img(){
+  background: #f5f5f5;
+  //background: url(~assets/images/tea/pic_home_logo_bg.png) no-repeat center;
+  //background-size:40% auto;
+  //object-fit: cover;
+}
+
+// ================================= 公用
+
+.placeholder {
+  font-size: 30rpx !important;
+  font-weight:500 !important;
+}
+
+page {
+  font-size: 28rpx !important;
+  line-height: 1.4 !important;
+  letter-spacing: 1rpx;
+  color: $primary-text-color;
+  font-family: $font-family;
+}
+
+page,cover-view,scroll-view,swiper,swiper-item,view,textarea,ul,li,p,img,input{
+  box-sizing: border-box;
+  -webkit-overflow-scrolling: touch;
+  word-wrap: break-word;
+  word-break: break-all;
+  letter-spacing: inherit;
+  line-height: inherit;
+  font-size: inherit;
+  color: inherit;
+}
+
+button{
+  padding: 0;
+  margin: 0;
+  font-size: inherit;
+  color: inherit;
+  background: none;
+  &:after{ display: none; }
+}
+
+/*浮动|清除浮动*/
+.fl{float: left;}
+.fr{float: right;}
+.clear{@include clear}
+
+/*字体颜色*/
+.primary-color{color: $primary-color !important;}
+
+/*文字行数*/
+.line-limit{@include line-limit-n(1)}
+.line-limit-2{@include line-limit-n(2)}
+
+/*按钮样式*/
+.btn-primary{ @include btn-primary }
+// .btn-primary-noclick{ @include btn-primary }
+.btn-secondary{ @include btn-secondary }
+.btn-disable{ @include btn-disable }
+
+/*输入框占位符颜色*/
+.placeholder-color{color: $placeholder-color}
+
+/*选择按钮*/
+.icon-select {@include icon-select}
+
+/*input 背景色*/
+
+ /** icon */
+ .icon-20{
+  width: 20rpx;
+  height: 20rpx;
+}
+.icon-28{
+  width: 28rpx;
+  height: 28rpx;
+}
+.icon-30{
+  width: 30rpx;
+  height: 30rpx;
+}
+.icon-36{
+  width: 36rpx;
+  height: 36rpx;
+}
+.icon-40{
+  width: 40rpx;
+  height: 40rpx;
+}
+.icon-180{
+  width: 180rpx;
+  height: 180rpx;
+}
+// 字体大小
+.fs-28 {
+  font-size: 28rpx;
+}
+
+// 字体颜色
+.fscolor-333{
+  color: #333;
+}
+.fscolor-666{
+  color: #666;
+}
+.fscolor-999{
+  color: #999;
+}
+.fscolor-ccc{
+  color: #ccc;
+}

src/utils/global-data.js

+function throttle() {
+  const nowTime = new Date().getTime()
+  const lastTime = this.lastTimestamp
+  console.log(`lastTime:${lastTime}`, `nowTime:${nowTime}`)
+  this.lastTimestamp = nowTime
+  if (nowTime - lastTime > 1000 || !lastTime) {
+    return true
+  }
+  return false
+}
+
+const lastTimestamp = 0
+
+
+// if (!this.globalData.throttle()) return
+
+export default {
+  lastTimestamp,
+  throttle,
+}

src/utils/index.js

+import { getUserScoreDetail, finishUserTask } from '@/api/grade';
+
+function formatNumber(n) {
+  const str = n.toString();
+  return str[1] ? str : `0${str}`;
+}
+
+export function formatTime(date) {
+  const year = date.getFullYear();
+  const month = date.getMonth() + 1;
+  const day = date.getDate();
+
+  const hour = date.getHours();
+
+  const minute = date.getMinutes();
+  const second = date.getSeconds();
+
+  const t1 = [year, month, day].map(formatNumber).join('/');
+  const t2 = [hour, minute, second].map(formatNumber).join(':');
+
+  return `${t1} ${t2}`;
+}
+export function Toast(title) {
+  uni.showToast({
+    title,
+    icon: 'none',
+    duration: 1000, // 延迟时间,
+    mask: true, // 显示透明蒙层，防止触摸穿透,
+  })
+}
+// 下拉刷新
+// eslint-disable-next-line consistent-return
+export async function onfetch(api, info) {
+  uni.stopPullDownRefresh();
+  const { data } = await api(info)
+  if (!data.error) {
+    console.info('进来', data)
+    return data
+  }
+}
+// 上拉加载
+// eslint-disable-next-line consistent-return
+export async function onbottom(api, info, total) {
+  // eslint-disable-next-line no-unused-expressions,no-mixed-operators
+  const page = Math.ceil((total * 1 + info.pageIndex - 1) / info.pageSize);
+  console.info(info.pageIndex, total, page, '几页')
+  if (info.pageIndex > page) {
+    console.info('没有了')
+    Toast('没有更多数据')
+    return;
+  }
+  const { data } = await api(info)
+  if (!data.error) {
+    // eslint-disable-next-line consistent-return
+    return data
+  }
+}
+
+export default {
+  formatNumber,
+  formatTime,
+  Toast,
+  onfetch,
+  onbottom,
+};

src/utils/routers/build.js

+const fs = require('fs')
+const path = require('path')
+const router = require('./index.js')
+
+// 将子路由模块配置文件转化为 uniapp 配置文件格式---pages
+const buildRouter = route => {
+  let res = []
+  const { baseUrl, children } = route
+  res = builder(baseUrl, children)
+  return res
+}
+// 将子路由模块配置文件转化为 uniapp 配置文件格式---subPackages
+const buildsubPackages = subPackages => {
+  const res = []
+  subPackages&&subPackages.forEach(item => {
+    let obj  = {
+      root: item.root,
+      pages: builder('',item.pages),
+    }
+    res.push(obj)
+  })
+  return res
+}
+
+// 兼容pages
+function builder(baseUrl,children){
+  const res = []
+
+  children.forEach(i => {
+    if (i.children) {
+      builder(baseUrl + i.path + '/', i.children)
+    } else {
+      const obj = {
+        path: baseUrl + i.path,
+        style: {
+          navigationBarTitleText: i.name
+        }
+      }
+      Object.keys(i).forEach(ii => {
+        !['path', 'name'].includes(ii) && (obj.style[ii] = i[ii])
+      })
+      res.push(obj)
+    }
+  })
+  return res
+}
+// 自动加载 './modules' 目录子路由配置文件
+const getRouter = (file_array) => {
+  let router = []
+  file_array.forEach(r => {
+    const route = require(r)
+    router = [ ...router, ...buildRouter(route)]
+  })
+  return router
+}
+// 自动加载 './modules' 目录子路由配置文件
+const getsubPackages = (file_array) => {
+  let subPackages = []
+  file_array.forEach(r => {
+    const route = require(r)
+    subPackages = [ ...subPackages, ...buildsubPackages(route.subPackages)]
+  })
+  return subPackages
+}
+
+const getFile = (srcPath) => {
+  const result = fs.readdirSync(srcPath)
+  let file = []
+  result.forEach(r => {
+    const path = srcPath + '/' + r
+    const stat = fs.lstatSync(path)
+    const is_file = stat.isFile()
+    const is_directory = stat.isDirectory()
+    if (is_file) { // 是文件
+      file.push(path)
+    }
+    if (is_directory) {
+      const file_array = getFile(path) // 递归查询子文件夹
+      file = file.concat(file_array)
+    }
+  })
+  return file
+}
+
+// 构建 pages 并写入 pages.json 文件
+const srcPath = path.resolve(__dirname, './modules')
+const file_array = getFile(srcPath) // 递归查询所有modules下的文件
+router.pages = getRouter(file_array)
+router.subPackages = getsubPackages(file_array)
+// console.log('router.pages',router.pages);
+fs.writeFile(
+  __dirname + '/../pages.json',
+  // 我这边是用两个空格来缩进 pages.json，如果喜欢制表符，第三个参数更换你为 \t 即可
+  JSON.stringify(router, null, '  '),
+  e => e ? console.error(e) : console.log('pages.json 配置文件更新成功')
+)

src/utils/routers/index.js

+module.exports = {
+	globalStyle: {
+		navigationBarTextStyle: 'black',
+		navigationBarTitleText: '九象',
+		navigationBarBackgroundColor: '#ffffffcc',
+		backgroundColor: '#ffffffcc',
+	},
+	tabBar: {
+		color: '#7A7E83',
+		selectedColor: '#3ccc86',
+		backgroundColor: '#ffffff',
+		borderStyle: 'black',
+		list: [{
+				pagePath: 'pages/index/tabbar/home',
+				iconPath: 'static/images/tabbar/tab_ic_home_nor.png',
+				selectedIconPath: 'static/images/tabbar/tab_ic_home_sel.png',
+				text: '首页'
+			},
+			{
+				pagePath: 'pages/index/tabbar/famousEnterprise',
+				iconPath: 'static/images/tabbar/tab_ic_mq_nor.png',
+				selectedIconPath: 'static/images/tabbar/tab_ic_mq_sel.png',
+				text: '名企',
+				enablePullDownRefresh: true
+			},
+			{
+				pagePath: 'pages/index/tabbar/hotProducts',
+				iconPath: 'static/images/tabbar/tab_ic_rp_nor.png',
+				selectedIconPath: 'static/images/tabbar/tab_ic_rp_sel.png',
+				text: '热品'
+			},
+			{
+				pagePath: 'pages/index/tabbar/activity',
+				iconPath: 'static/images/tabbar/tab_ic_zb_nor.png',
+				selectedIconPath: 'static/images/tabbar/tab_ic_zb_sel.png',
+				text: '直播'
+			},
+			{
+				pagePath: 'pages/index/tabbar/user',
+				iconPath: 'static/images/tabbar/tab_ic_my_nor.png',
+				selectedIconPath: 'static/images/tabbar/tab_ic_my_sel.png',
+				text: '个人中心'
+			},
+		]
+	},
+	condition: { // 模式配置，仅开发期间生效
+		current: 0,
+		list: [{
+				name: '首页',
+				path: 'pages/index/tabbar/home',
+				query: ''
+			},
+			{
+				name: '名企',
+				path: 'pages/index/tabbar/famousEnterprise',
+				query: ''
+			},
+			{
+				name: '热品',
+				path: 'pages/index/tabbar/hotProducts',
+				query: ''
+			},
+			{
+				"name": "直播",
+				"path": "pages/index/tabbar/activity",
+				"query": ""
+			},
+			{
+				name: '个人中心',
+				path: 'pages/index/tabbar/user',
+				query: ''
+			},
+		]
+	}
+}

src/utils/routers/modules/data.js

+
+module.exports = {
+  baseUrl: '',
+  children: [
+    {
+      path: 'pages/data/list',
+      navigationStyle: 'default',
+      navigationBarTextStyle: 'white',
+      navigationBarBackgroundColor: '#5cb56e',
+      disableScroll: true,
+    }, 
+    {
+      path: 'pages/data/list111',
+      navigationStyle: 'default',
+      navigationBarTextStyle: 'white',
+      navigationBarBackgroundColor: '#5cb56e',
+      disableScroll: true,
+    }, 
+  ],
+  // subPackages: [
+  //   {
+	// 		root: "packageHome",
+	// 		pages: [
+	// 			{
+	// 				path: "order-share/index",
+  //         navigationStyle: 'default',
+  //         navigationBarTextStyle: 'white',
+  //         navigationBarBackgroundColor: '#5cb56e',
+  //         disableScroll: true,
+	// 			},
+	// 			{
+	// 				path: "order-share/record",
+  //         navigationStyle: 'default',
+  //         navigationBarTextStyle: 'white',
+  //         navigationBarBackgroundColor: '#5cb56e',
+  //         disableScroll: true,
+	// 			},
+  //     ]
+	// 	},
+  // ]
+}
+
+
+
+

src/utils/routers/modules/demo.js

+
+module.exports = {
+  baseUrl: '',
+  children: [
+    {
+      path: 'pages/data/test1',
+      navigationStyle: 'default',
+      navigationBarTextStyle: 'white',
+      navigationBarBackgroundColor: '#5cb56e',
+      disableScroll: true,
+    }, 
+    {
+      path: 'pages/data/test2',
+      navigationStyle: 'default',
+      navigationBarTextStyle: 'white',
+      navigationBarBackgroundColor: '#5cb56e',
+      disableScroll: true,
+    }, 
+  ],
+}
+
+
+
+

src/wxcomponents/canvasdrawer/canvasdrawer.js

+/* global Component wx */
+
+Component({
+  properties: {
+    painting: {
+      type: Object,
+      value: { view: [] },
+      observer(newVal, oldVal) {
+        console.log(newVal, oldVal)
+        if (!this.data.isPainting) {
+          if (JSON.stringify(newVal) !== JSON.stringify(oldVal) &&
+            newVal && newVal.width && newVal.height) {
+            this.setData({
+              showCanvas: true,
+              isPainting: true,
+            })
+            this.readyPigment()
+          }
+        }
+      },
+    },
+  },
+  data: {
+    showCanvas: false,
+
+    width: 100,
+    height: 100,
+
+    index: 0,
+    imageList: [],
+    tempFileList: [],
+
+    isPainting: false,
+  },
+  ctx: null,
+  cache: {},
+  ready() {
+    wx.removeStorageSync('canvasdrawer_pic_cache')
+    this.cache = wx.getStorageSync('canvasdrawer_pic_cache') || {}
+    this.ctx = wx.createCanvasContext('canvasdrawer', this)
+  },
+  methods: {
+    readyPigment() {
+      const { width, height, views } = this.data.painting
+      this.setData({
+        width,
+        height,
+      })
+
+      const inter = setInterval(() => {
+        if (this.ctx) {
+          clearInterval(inter)
+          this.ctx.clearActions()
+          this.ctx.save()
+          this.getImageList(views)
+          this.downLoadImages(0)
+        }
+      }, 100)
+    },
+    getImageList(views) {
+      const imageList = []
+      for (let i = 0; i < views.length; i++) {
+        if (views[i].type === 'image') {
+          imageList.push(views[i].url)
+        }
+      }
+      this.setData({
+        imageList,
+      })
+    },
+    downLoadImages(index) {
+      const { imageList, tempFileList } = this.data
+      if (index < imageList.length) {
+        // console.log(imageList[index])
+        this.getImageInfo(imageList[index]).then((file) => {
+          tempFileList.push(file)
+          this.setData({
+            tempFileList,
+          })
+          this.downLoadImages(index + 1)
+        })
+      } else {
+        this.startPainting()
+      }
+    },
+    startPainting() {
+      const { tempFileList, painting: { views } } = this.data
+      for (let i = 0, imageIndex = 0; i < views.length; i++) {
+        if (views[i].type === 'image') {
+          this.drawImage({
+            ...views[i],
+            url: tempFileList[imageIndex],
+          })
+          imageIndex++
+        } else if (views[i].type === 'text') {
+          if (!this.ctx.measureText) {
+            wx.showModal({
+              title: '提示',
+              content: '当前微信版本过低，无法使用 measureText 功能，请升级到最新微信版本后重试。',
+            })
+          } else {
+            this.drawText(views[i])
+          }
+        } else if (views[i].type === 'rect') {
+          this.drawRect(views[i])
+        }
+      }
+      this.ctx.draw(true, () => {
+        wx.setStorageSync('canvasdrawer_pic_cache', this.cache)
+        this.saveImageToLocal()
+      })
+    },
+    drawImage(params) {
+      this.ctx.save()
+      const {
+        url, top = 0, left = 0, width = 0, height = 0, borderRadius = 0,
+      } = params
+      if (borderRadius) {
+        this.ctx.beginPath()
+        this.ctx.arc(left + borderRadius, top + borderRadius, borderRadius, 0, 2 * Math.PI)
+        this.ctx.clip()
+        this.ctx.drawImage(url, left, top, width, height)
+      } else {
+        this.ctx.drawImage(url, left, top, width, height)
+      }
+      this.ctx.restore()
+    },
+    drawText(params) {
+      this.ctx.save()
+      const {
+        MaxLineNumber = 2,
+        breakWord = false,
+        color = 'black',
+        content = '',
+        fontSize = 16,
+        top = 0,
+        left = 0,
+        lineHeight = 20,
+        textAlign = 'left',
+        width,
+        bolder = false,
+        textDecoration = 'none',
+      } = params
+
+      this.ctx.beginPath()
+      this.ctx.setTextBaseline('top')
+      this.ctx.setTextAlign(textAlign)
+      this.ctx.setFillStyle(color)
+      this.ctx.setFontSize(fontSize)
+
+      if (!breakWord) {
+        this.ctx.fillText(content, left, top)
+        this.drawTextLine(left, top, textDecoration, color, fontSize, content)
+      } else {
+        let fillText = ''
+        let fillTop = top
+        let lineNum = 1
+        for (let i = 0; i < content.length; i+=1) {
+          fillText += [content[i]]
+          if (this.ctx.measureText(fillText).width > width) {
+            if (lineNum === MaxLineNumber) {
+              if (i !== content.length) {
+                fillText = `${fillText.substring(0, fillText.length - 1)}...`
+                this.ctx.fillText(fillText, left, fillTop)
+                this.drawTextLine(left, fillTop, textDecoration, color, fontSize, fillText)
+                fillText = ''
+                break
+              }
+            }
+            this.ctx.fillText(fillText, left, fillTop)
+            this.drawTextLine(left, fillTop, textDecoration, color, fontSize, fillText)
+            fillText = ''
+            fillTop += lineHeight
+            lineNum++
+          }
+        }
+        this.ctx.fillText(fillText, left, fillTop)
+        this.drawTextLine(left, fillTop, textDecoration, color, fontSize, fillText)
+      }
+
+      this.ctx.restore()
+
+      if (bolder) {
+        this.drawText({
+          ...params,
+          left: left + 0.3,
+          top: top + 0.3,
+          bolder: false,
+          textDecoration: 'none',
+        })
+      }
+    },
+    drawTextLine(left, top, textDecoration, color, fontSize, content) {
+      if (textDecoration === 'underline') {
+        this.drawRect({
+          background: color,
+          // eslint-disable-next-line no-mixed-operators
+          top: top + fontSize * 1.2,
+          left: left - 1,
+          width: this.ctx.measureText(content).width + 3,
+          height: 1,
+        })
+      } else if (textDecoration === 'line-through') {
+        this.drawRect({
+          background: color,
+          top: top + fontSize * 0.6,
+          left: left - 1,
+          width: this.ctx.measureText(content).width + 3,
+          height: 1,
+        })
+      }
+    },
+    drawRect(params) {
+      this.ctx.save()
+      // console.log(params)
+      const {
+        background, top = 0, left = 0, width = 0, height = 0, borderRadius = 0,
+      } = params
+      if (borderRadius) {
+        // this.ctx.setGlobalAlpha(0);
+        // this.ctx.setFillStyle('white');
+        // this.ctx.beginPath()
+        // this.ctx.arc(left + borderRadius, top + borderRadius, borderRadius, 0, 2 * Math.PI)
+        // this.ctx.closePath();
+        // this.ctx.fill();
+        // this.ctx.clip()
+        // this.ctx.setGlobalAlpha(1);
+        this.ctx.setFillStyle(background)
+        this.ctx.fillRect(left, top, width, height)
+      } else {
+        this.ctx.setFillStyle(background)
+        this.ctx.fillRect(left, top, width, height)
+      }
+
+      this.ctx.restore()
+    },
+    getImageInfo(url) {
+      return new Promise((resolve, reject) => {
+        /* 获得要在画布上绘制的图片 */
+        if (this.cache[url]) {
+          resolve(this.cache[url])
+        } else {
+          const objExp = new RegExp(/^http(s)?:\/\/([\w-]+\.)+[\w-]+(\/[\w- .\/?%&=]*)?/)
+          if (objExp.test(url)) {
+            wx.getImageInfo({
+              src: url,
+              complete: (res) => {
+                if (res.errMsg === 'getImageInfo:ok') {
+                  this.cache[url] = res.path
+                  resolve(res.path)
+                } else {
+                  reject(new Error('getImageInfo fail'))
+                  wx.hideLoading();
+                  wx.showToast({
+                    title: '绘制失败，请重试', // 提示的内容,
+                    icon: 'none', // 图标,
+                    duration: 2000, // 延迟时间,
+                    mask: true, // 显示透明蒙层，防止触摸穿透,
+                    success: () => {
+                    },
+                  });
+                }
+              },
+            })
+          } else {
+            this.cache[url] = url
+            resolve(url)
+          }
+        }
+      })
+    },
+    saveImageToLocal() {
+      const { width, height } = this.data
+      wx.canvasToTempFilePath({
+        x: 0,
+        y: 0,
+        width,
+        height,
+        canvasId: 'canvasdrawer',
+        success: (res) => {
+          if (res.errMsg === 'canvasToTempFilePath:ok') {
+            this.setData({
+              showCanvas: false,
+              isPainting: false,
+              imageList: [],
+              tempFileList: [],
+            })
+            this.triggerEvent('getImage', { tempFilePath: res.tempFilePath })
+          }
+        },
+        fail: (res) => {
+          console.info(res, '-----')
+        },
+      }, this)
+    },
+  },
+})

src/wxcomponents/canvasdrawer/canvasdrawer.json

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

src/wxcomponents/canvasdrawer/canvasdrawer.vue

+<template>
+<uni-shadow-root class="canvasdrawer-canvasdrawer"><canvas canvas-id="canvasdrawer" :style="'width:'+(width)+'px;height:'+(height)+'px;'" class="board" v-if="showCanvas"></canvas></uni-shadow-root>
+</template>
+
+<script>
+
+global['__wxRoute'] = 'canvasdrawer/canvasdrawer'
+/* global Component wx */
+
+Component({
+  properties: {
+    painting: {
+      type: Object,
+      value: { view: [] },
+      observer(newVal, oldVal) {
+        console.log(newVal, oldVal)
+        if (!this.data.isPainting) {
+          if (JSON.stringify(newVal) !== JSON.stringify(oldVal) &&
+            newVal && newVal.width && newVal.height) {
+            this.setData({
+              showCanvas: true,
+              isPainting: true,
+            })
+            this.readyPigment()
+          }
+        }
+      },
+    },
+  },
+  data: {
+    showCanvas: false,
+
+    width: 100,
+    height: 100,
+
+    index: 0,
+    imageList: [],
+    tempFileList: [],
+
+    isPainting: false,
+  },
+  ctx: null,
+  cache: {},
+  ready() {
+    wx.removeStorageSync('canvasdrawer_pic_cache')
+    this.cache = wx.getStorageSync('canvasdrawer_pic_cache') || {}
+    this.ctx = wx.createCanvasContext('canvasdrawer', this)
+  },
+  methods: {
+    readyPigment() {
+      const { width, height, views } = this.data.painting
+      this.setData({
+        width,
+        height,
+      })
+
+      const inter = setInterval(() => {
+        if (this.ctx) {
+          clearInterval(inter)
+          this.ctx.clearActions()
+          this.ctx.save()
+          this.getImageList(views)
+          this.downLoadImages(0)
+        }
+      }, 100)
+    },
+    getImageList(views) {
+      const imageList = []
+      for (let i = 0; i < views.length; i++) {
+        if (views[i].type === 'image') {
+          imageList.push(views[i].url)
+        }
+      }
+      this.setData({
+        imageList,
+      })
+    },
+    downLoadImages(index) {
+      const { imageList, tempFileList } = this.data
+      if (index < imageList.length) {
+        // console.log(imageList[index])
+        this.getImageInfo(imageList[index]).then((file) => {
+          tempFileList.push(file)
+          this.setData({
+            tempFileList,
+          })
+          this.downLoadImages(index + 1)
+        })
+      } else {
+        this.startPainting()
+      }
+    },
+    startPainting() {
+      const { tempFileList, painting: { views } } = this.data
+      for (let i = 0, imageIndex = 0; i < views.length; i++) {
+        if (views[i].type === 'image') {
+          this.drawImage({
+            ...views[i],
+            url: tempFileList[imageIndex],
+          })
+          imageIndex++
+        } else if (views[i].type === 'text') {
+          if (!this.ctx.measureText) {
+            wx.showModal({
+              title: '提示',
+              content: '当前微信版本过低，无法使用 measureText 功能，请升级到最新微信版本后重试。',
+            })
+          } else {
+            this.drawText(views[i])
+          }
+        } else if (views[i].type === 'rect') {
+          this.drawRect(views[i])
+        }
+      }
+      this.ctx.draw(true, () => {
+        wx.setStorageSync('canvasdrawer_pic_cache', this.cache)
+        this.saveImageToLocal()
+      })
+    },
+    drawImage(params) {
+      this.ctx.save()
+      const {
+        url, top = 0, left = 0, width = 0, height = 0, borderRadius = 0,
+      } = params
+      if (borderRadius) {
+        this.ctx.beginPath()
+        this.ctx.arc(left + borderRadius, top + borderRadius, borderRadius, 0, 2 * Math.PI)
+        this.ctx.clip()
+        this.ctx.drawImage(url, left, top, width, height)
+      } else {
+        this.ctx.drawImage(url, left, top, width, height)
+      }
+      this.ctx.restore()
+    },
+    drawText(params) {
+      this.ctx.save()
+      const {
+        MaxLineNumber = 2,
+        breakWord = false,
+        color = 'black',
+        content = '',
+        fontSize = 16,
+        top = 0,
+        left = 0,
+        lineHeight = 20,
+        textAlign = 'left',
+        width,
+        bolder = false,
+        textDecoration = 'none',
+      } = params
+
+      this.ctx.beginPath()
+      this.ctx.setTextBaseline('top')
+      this.ctx.setTextAlign(textAlign)
+      this.ctx.setFillStyle(color)
+      this.ctx.setFontSize(fontSize)
+
+      if (!breakWord) {
+        this.ctx.fillText(content, left, top)
+        this.drawTextLine(left, top, textDecoration, color, fontSize, content)
+      } else {
+        let fillText = ''
+        let fillTop = top
+        let lineNum = 1
+        for (let i = 0; i < content.length; i+=1) {
+          fillText += [content[i]]
+          if (this.ctx.measureText(fillText).width > width) {
+            if (lineNum === MaxLineNumber) {
+              if (i !== content.length) {
+                fillText = `${fillText.substring(0, fillText.length - 1)}...`
+                this.ctx.fillText(fillText, left, fillTop)
+                this.drawTextLine(left, fillTop, textDecoration, color, fontSize, fillText)
+                fillText = ''
+                break
+              }
+            }
+            this.ctx.fillText(fillText, left, fillTop)
+            this.drawTextLine(left, fillTop, textDecoration, color, fontSize, fillText)
+            fillText = ''
+            fillTop += lineHeight
+            lineNum++
+          }
+        }
+        this.ctx.fillText(fillText, left, fillTop)
+        this.drawTextLine(left, fillTop, textDecoration, color, fontSize, fillText)
+      }
+
+      this.ctx.restore()
+
+      if (bolder) {
+        this.drawText({
+          ...params,
+          left: left + 0.3,
+          top: top + 0.3,
+          bolder: false,
+          textDecoration: 'none',
+        })
+      }
+    },
+    drawTextLine(left, top, textDecoration, color, fontSize, content) {
+      if (textDecoration === 'underline') {
+        this.drawRect({
+          background: color,
+          // eslint-disable-next-line no-mixed-operators
+          top: top + fontSize * 1.2,
+          left: left - 1,
+          width: this.ctx.measureText(content).width + 3,
+          height: 1,
+        })
+      } else if (textDecoration === 'line-through') {
+        this.drawRect({
+          background: color,
+          top: top + fontSize * 0.6,
+          left: left - 1,
+          width: this.ctx.measureText(content).width + 3,
+          height: 1,
+        })
+      }
+    },
+    drawRect(params) {
+      this.ctx.save()
+      // console.log(params)
+      const {
+        background, top = 0, left = 0, width = 0, height = 0, borderRadius = 0,
+      } = params
+      if (borderRadius) {
+        // this.ctx.setGlobalAlpha(0);
+        // this.ctx.setFillStyle('white');
+        // this.ctx.beginPath()
+        // this.ctx.arc(left + borderRadius, top + borderRadius, borderRadius, 0, 2 * Math.PI)
+        // this.ctx.closePath();
+        // this.ctx.fill();
+        // this.ctx.clip()
+        // this.ctx.setGlobalAlpha(1);
+        this.ctx.setFillStyle(background)
+        this.ctx.fillRect(left, top, width, height)
+      } else {
+        this.ctx.setFillStyle(background)
+        this.ctx.fillRect(left, top, width, height)
+      }
+
+      this.ctx.restore()
+    },
+    getImageInfo(url) {
+      return new Promise((resolve, reject) => {
+        /* 获得要在画布上绘制的图片 */
+        if (this.cache[url]) {
+          resolve(this.cache[url])
+        } else {
+          const objExp = new RegExp(/^http(s)?:\/\/([\w-]+\.)+[\w-]+(\/[\w- .\/?%&=]*)?/)
+          if (objExp.test(url)) {
+            wx.getImageInfo({
+              src: url,
+              complete: (res) => {
+                if (res.errMsg === 'getImageInfo:ok') {
+                  this.cache[url] = res.path
+                  resolve(res.path)
+                } else {
+                  reject(new Error('getImageInfo fail'))
+                  wx.hideLoading();
+                  wx.showToast({
+                    title: '绘制失败，请重试', // 提示的内容,
+                    icon: 'none', // 图标,
+                    duration: 2000, // 延迟时间,
+                    mask: true, // 显示透明蒙层，防止触摸穿透,
+                    success: () => {
+                    },
+                  });
+                }
+              },
+            })
+          } else {
+            this.cache[url] = url
+            resolve(url)
+          }
+        }
+      })
+    },
+    saveImageToLocal() {
+      const { width, height } = this.data
+      wx.canvasToTempFilePath({
+        x: 0,
+        y: 0,
+        width,
+        height,
+        canvasId: 'canvasdrawer',
+        success: (res) => {
+          if (res.errMsg === 'canvasToTempFilePath:ok') {
+            this.setData({
+              showCanvas: false,
+              isPainting: false,
+              imageList: [],
+              tempFileList: [],
+            })
+            this.triggerEvent('getImage', { tempFilePath: res.tempFilePath })
+          }
+        },
+        fail: (res) => {
+          console.info(res, '-----')
+        },
+      }, this)
+    },
+  },
+})
+export default global['__wxComponents']['canvasdrawer/canvasdrawer']
+</script>
+<style platform="mp-weixin">
+.board {
+  position: fixed;
+  top: 2000rpx;
+}
+</style>
\ No newline at end of file

src/wxcomponents/canvasdrawer/canvasdrawer.wxml

+<canvas canvas-id="canvasdrawer" style="width:{{width}}px;height:{{height}}px;" class="board" wx:if="{{showCanvas}}"></canvas>
\ No newline at end of file

src/wxcomponents/canvasdrawer/canvasdrawer.wxss

+.board {
+  position: fixed;
+  top: 2000rpx;
+}
\ No newline at end of file

tsconfig.json

+{
+  "compilerOptions": {
+    "types": [
+      "@dcloudio/types",
+      "miniprogram-api-typings",
+      "mini-types"
+    ]
+  }
+}