🎉 init: 项目初始化

+# port
+VITE_PORT = 8006
+
+# 反向代理服务器地址
+VITE_PROXY_TARGET = http://voice.onwall.cn
+
+# API请求前缀
+VITE_PROXY_PREFIX = /srv/
+
+# 打包输出文件夹名称
+VITE_OUTDIR = voice
+
+# 是否开启调试
+VITE_CONSOLE = 0
+
+# appID相关
+VITE_APPID=微信appID

+# 资源公共路径
+VITE_BASE = /
+
+# 测试open-id
+# VITE_OPENID = api-test-openid
+# VITE_OPENID = o8BRf1gLDWieH3Y3JvbrI_4IjaME
+VITE_OPENID = oJLZq5t9PIKLW9tm1oSUNAuPwssA
+# VITE_OPENID = oJLZq5uT_6GwIh2tQWh1F9IoHZ3U
+
+# B端账号
+VITE_ID = 13761653761
+
+# 验证码
+VITE_PIN = 

+# 资源公共路径
+VITE_BASE = /f/map/
+
+# 测试open-id
+VITE_APP_OPENID =
+
+# B端账号
+VITE_APP_ID =
+
+# 验证码
+VITE_APP_PIN =

+{
+  "globals": {
+    "EffectScope": true,
+    "computed": true,
+    "createApp": true,
+    "customRef": true,
+    "defineAsyncComponent": true,
+    "defineComponent": true,
+    "effectScope": true,
+    "getCurrentInstance": true,
+    "getCurrentScope": true,
+    "h": true,
+    "inject": true,
+    "isProxy": true,
+    "isReactive": true,
+    "isReadonly": true,
+    "isRef": true,
+    "markRaw": true,
+    "nextTick": true,
+    "onActivated": true,
+    "onBeforeMount": true,
+    "onBeforeUnmount": true,
+    "onBeforeUpdate": true,
+    "onDeactivated": true,
+    "onErrorCaptured": true,
+    "onMounted": true,
+    "onRenderTracked": true,
+    "onRenderTriggered": true,
+    "onScopeDispose": true,
+    "onServerPrefetch": true,
+    "onUnmounted": true,
+    "onUpdated": true,
+    "provide": true,
+    "reactive": true,
+    "readonly": true,
+    "ref": true,
+    "resolveComponent": true,
+    "shallowReactive": true,
+    "shallowReadonly": true,
+    "shallowRef": true,
+    "toRaw": true,
+    "toRef": true,
+    "toRefs": true,
+    "triggerRef": true,
+    "unref": true,
+    "useAttrs": true,
+    "useCssModule": true,
+    "useCssVars": true,
+    "useRoute": true,
+    "useRouter": true,
+    "useSlots": true,
+    "watch": true,
+    "watchEffect": true,
+    "watchPostEffect": true,
+    "watchSyncEffect": true
+  }
+}
\ No newline at end of file

+/*
+ * @Author: hookehuyr hookehuyr@gmail.com
+ * @Date: 2022-05-27 08:59:09
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-07-08 18:15:20
+ * @FilePath: /tswj/.eslintrc.js
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ */
+module.exports = {
+  // parser: '@typescript-eslint/parser',
+  parser: 'vue-eslint-parser',
+  parserOptions: {
+    parser: 'babel-eslint',
+    // parser: '@typescript-eslint/parser',
+  },
+  extends: [
+    // add more generic rule sets here, such as:
+    // 'eslint:recommended',
+    'plugin:vue/vue3-recommended',
+    './.eslintrc-auto-import.json'
+    // 'plugin:vue/recommended' // Use this if you are using Vue.js 2.x.
+  ],
+  rules: {
+    // override/add rules settings here, such as:
+    // 'vue/no-unused-vars': 'error'
+    "vue/max-attributes-per-line": ["error", {
+      "singleline": {
+        "max": 20
+      },      
+      "multiline": {
+        "max": 10
+      }
+    }],
+    "vue/singleline-html-element-content-newline": 0, // 在单行元素的内容之前和之后需要换行符
+    "vue/first-attribute-linebreak": 0, // 强制第一个属性需要换行
+    "vue/multi-word-component-names": 0, // 要求组件名称始终为多字
+    "vue/html-indent": 0, // 执行一致的缩进
+    "vue/html-closing-bracket-newline": 0, // 在标签的右括号之前要求或禁止换行
+  },
+  overrides: [
+    {
+      files: ['*.ts'],
+      parser: '@typescript-eslint/parser',
+      plugins: ['@typescript-eslint'],
+      extends: ['plugin:@typescript-eslint/recommended'],
+    },
+  ],
+}

+node_modules
+.DS_Store
+dist
+dist-ssr
+*.local
+.history
+doc
+.vscode
+src/views/test/*
+src/store/test.js
+cypress
+src/test/mocha/test.js
+cypress.json
+src/test
+.idea

+{
+  "esversion": 11,
+  "asi": true
+}
\ No newline at end of file

+export function createProxy(prefix, target) {
+  const ret = {};
+  ret[prefix] = {
+    target,
+    changeOrigin: true,
+    ws: true,
+    // rewrite: (path) => path.replace(/^\/api/, '')
+    // rewrite: (path) => path.replace(new RegExp(`^${prefix}`), ''),
+  }
+  return ret
+}

+/* eslint-disable */
+/* prettier-ignore */
+// @ts-nocheck
+// Generated by unplugin-vue-components
+// Read more: https://github.com/vuejs/core/pull/3399
+import '@vue/runtime-core'
+
+export {}
+
+declare module '@vue/runtime-core' {
+  export interface GlobalComponents {
+    '图形验证码': typeof import('./src/components/图形验证码.vue')['default']
+    Agreement: typeof import('./src/components/DonateFlower/agreement.vue')['default']
+    AuditVideoCard: typeof import('./src/components/AuditVideoCard/index.vue')['default']
+    Banner: typeof import('./src/components/MuiVideo/banner.vue')['default']
+    BookCard: typeof import('./src/components/BookCard/index.vue')['default']
+    BVideoCard: typeof import('./src/components/BVideoCard/index.vue')['default']
+    CommentBox: typeof import('./src/components/CommentBox/index.vue')['default']
+    CommentList: typeof import('./src/components/CommentList/index.vue')['default']
+    DonateBar: typeof import('./src/components/DonateBar/index.vue')['default']
+    DonateBook: typeof import('./src/components/DonateBook/index.vue')['default']
+    DonateCert: typeof import('./src/components/DonateCert/index.vue')['default']
+    DonateFlower: typeof import('./src/components/DonateFlower/index.vue')['default']
+    FlowerIcon: typeof import('./src/components/FlowerIcon/index.vue')['default']
+    ImageSliderVerify: typeof import('./src/components/ImageSliderVerify/index.vue')['default']
+    LocalismBox: typeof import('./src/components/LocalismBox/index.vue')['default']
+    LoginBox: typeof import('./src/components/LoginBox/index.vue')['default']
+    MuiVideo: typeof import('./src/components/MuiVideo/index.vue')['default']
+    MyButton: typeof import('./src/components/MyButton/index.vue')['default']
+    NoticeOverlay: typeof import('./src/components/NoticeOverlay/index.vue')['default']
+    NoticeOverlayModule: typeof import('./src/components/NoticeOverlayModule/index.vue')['default']
+    RankingItem: typeof import('./src/components/RankingItem/index.vue')['default']
+    RightSideList: typeof import('./src/components/RightSideList/index.vue')['default']
+    RouterLink: typeof import('vue-router')['RouterLink']
+    RouterView: typeof import('vue-router')['RouterView']
+    ShortcutFixed: typeof import('./src/components/ShortcutFixed/index.vue')['default']
+    Status: typeof import('./src/components/MuiVideo/status.vue')['default']
+    Template: typeof import('./src/components/template/index.vue')['default']
+    Test: typeof import('./src/components/LoginBox/test.vue')['default']
+    VanActionSheet: typeof import('vant/es')['ActionSheet']
+    VanButton: typeof import('vant/es')['Button']
+    VanCellGroup: typeof import('vant/es')['CellGroup']
+    VanCheckbox: typeof import('vant/es')['Checkbox']
+    VanCol: typeof import('vant/es')['Col']
+    VanConfigProvider: typeof import('vant/es')['ConfigProvider']
+    VanDialog: typeof import('vant/es')['Dialog']
+    VanEmpty: typeof import('vant/es')['Empty']
+    VanField: typeof import('vant/es')['Field']
+    VanForm: typeof import('vant/es')['Form']
+    VanIcon: typeof import('vant/es')['Icon']
+    VanImage: typeof import('vant/es')['Image']
+    VanList: typeof import('vant/es')['List']
+    VanLoading: typeof import('vant/es')['Loading']
+    VanNumberKeyboard: typeof import('vant/es')['NumberKeyboard']
+    VanOverlay: typeof import('vant/es')['Overlay']
+    VanPicker: typeof import('vant/es')['Picker']
+    VanPopup: typeof import('vant/es')['Popup']
+    VanRow: typeof import('vant/es')['Row']
+    VanStepper: typeof import('vant/es')['Stepper']
+    VanSticky: typeof import('vant/es')['Sticky']
+    VanSwipe: typeof import('vant/es')['Swipe']
+    VanSwipeItem: typeof import('vant/es')['SwipeItem']
+    VanTab: typeof import('vant/es')['Tab']
+    VanTabs: typeof import('vant/es')['Tabs']
+    VanTag: typeof import('vant/es')['Tag']
+    VanUploader: typeof import('vant/es')['Uploader']
+    VideoBar: typeof import('./src/components/MuiVideo/videoBar.vue')['default']
+    VideoCard: typeof import('./src/components/VideoCard/index.vue')['default']
+    VideoDetail: typeof import('./src/components/VideoDetail/index.vue')['default']
+  }
+}

+<!--
+ * @Date: 2023-01-09 15:22:38
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2023-05-26 16:14:24
+ * @FilePath: /tswj/index.html
+ * @Description: 文件描述
+-->
+<!DOCTYPE html>
+<html lang='zh'>
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, viewport-fit=cover" />
+  <link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
+  <title></title>
+  <!-- <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.compat.css" /> -->
+</head>
+<body>
+  <div id="app"></div>
+  <script type="module" src="/src/main.js"></script>
+  <script type="text/javascript">
+    window._AMapSecurityConfig = {
+        securityJsCode:'8602057c4c8dae5bed9a240c0582c46f',
+    }
+  </script>
+  <script src="https://webapi.amap.com/maps?v=2.0&key=381c6763e1fefd810fbab697f470149c&plugin=AMap.ElasticMarker,AMap.ImageLayer"></script>
+</body>
+</html>

+-----BEGIN PRIVATE KEY-----
+MIIEvgIBADANBgkqhkiG9w0BAQEFAASCBKgwggSkAgEAAoIBAQDEzFrlVSgeuOQT
+sglIR5RxEASnH0XKKxg/rl6U0pe6NGHwnybhdO6ZHAWRIU4OVOVDCI3OnJ2/2c2o
+eCT9L+fDGJew3BAMZvKKn1A/o5xM5YYJo8IKKeJbehjXajXdRJ5WkhAKwSH+rSJE
+nADUF4S5sqbXVlvttc1QUVL9GprPq5OBptDfcs6AM+dN1XOn/LgFt0KJ1C80Ah1a
+TLjLLFOGEJNLtTAUpLzJb5DKLro88QgPK8ek5afOKiOMULnFk3QJCZ1W98Xd75zq
+5Fz/FLCmTgkZMGe+iLr44MewmwMu1H/cHtWVkfEZiFUcRa5xc6SbvMGENfu/3/L4
+rLQ7ppMRAgMBAAECggEAaNnMD+WoA35Unh28DlN8xiRXpkbmIwmE2ODpKXduOVoR
+WGcjCvoG6XJhkOpisQYQQ/+5tfwBnCbKCNlCM9cjLvHaV/NXZZQv4yVwVwevjdS3
+7kjeaBXasQxDUfoXirU1e0BE5cXye8L4v/8x/c4t+9YwSAiN3/99zS4W/hz/oGaE
+fCkjHOHQkQKw0invQz3kf86iyanLBS/rllJAtZKmRFqZKchWR68m+sDcbAP320tb
+z2yi7og8QcP+kuqQWr2QVOCfD7zz5ihLDCnzipNU/7JmHIkUXqYI8NKGLSftN0LB
+NSmOinsx/oM4gu7IAMsyZjpM4UkAHieJEtAHM4RIMQKBgQD13iV4QgupvQauwnl/
+Kezse8zSjZS2YSUVZRsMDqw62sVa2BE4CV9NCWO3nPp5MDSDXahjDuoS640askM5
+ynWQWbDmttomlVqPbXwHUfKqTLgUIvl7byIuyoJHAIlL/7xEOeHHa5oIy49aKTnw
+vrJMTrBifNsdqWp2ht64hwNL3QKBgQDM6IklIbfXDEdji7LAaCzu24uttWAwLn69
+d1q5fMVWfWBl3l8O3gvbJSxXTeLHNcjsOb1iQq+3CT/eV+g+5xv17EQH+32ASq9d
+VBQ0tZC09BkMcDKPulC9JoGVsgLnIbjOy7GJKOhANqYh18FW9JAYvzZFWzNpsGAR
+kXZIGt/axQKBgQDotvZCSEkfxPHhUeOL0FQXVep9VFLw+SwPfx5FoFG2d0Gbha1u
+m7hfg0amEWgmctERkgGCmShG9jsdjKMCvTXfhnVhOqtrH6yS2y8tAoysUmddb+kx
+wvPY1AbRS5monItHDH4+sgMe1gV+ck0MKIM8pLJg1grTnXpOa8O9ZtVg5QKBgDFM
+4XJlom3DLons2p0gc28ks36f3Py6sxOy28k1E+WzVLYtwoE5O3EGiJyYyK9VaXos
+ijxR/yTyvMMqM16vDDMnHVcuUwvC7F5wFEx6Qs7GzCAJ/qBGG5bm5Na3datWmbhn
+mdd+WCLbAy2xU3swbFsH5m7Zeo07OmH/tY2zqZhhAoGBALxxnWJ4bgtZHcHREB0A
+QP6ZSLWoUk0ggoPuwSVgHImW+/C1/38KjHgv4UmhS59MpNqX3BOUgP1lTKQ4ifut
+N2/tFBdZXNdsbRNYp2UTGAHzUK6sUGyvY4g6mAZJWsIsVIzuLrZdrQywlglBpM4Q
+v/Q0jcIl9880opSG/+dfRbpW
+-----END PRIVATE KEY-----

+-----BEGIN CERTIFICATE-----
+MIIEMTCCApmgAwIBAgIRAJqTbr7oXEP7a1vMS7zyApQwDQYJKoZIhvcNAQELBQAw
+ZzEeMBwGA1UEChMVbWtjZXJ0IGRldmVsb3BtZW50IENBMR4wHAYDVQQLDBVodXlp
+cnVpQEhZUi1NQUMubG9jYWwxJTAjBgNVBAMMHG1rY2VydCBodXlpcnVpQEhZUi1N
+QUMubG9jYWwwHhcNMjMwNTE5MDcxMTE0WhcNMjUwODE5MDcxMTE0WjBVMScwJQYD
+VQQKEx5ta2NlcnQgZGV2ZWxvcG1lbnQgY2VydGlmaWNhdGUxKjAoBgNVBAsMIWh1
+eWlydWlASFlSLU1BQy5sb2NhbCAo6IOh5YWI55SfKTCCASIwDQYJKoZIhvcNAQEB
+BQADggEPADCCAQoCggEBAMTMWuVVKB645BOyCUhHlHEQBKcfRcorGD+uXpTSl7o0
+YfCfJuF07pkcBZEhTg5U5UMIjc6cnb/Zzah4JP0v58MYl7DcEAxm8oqfUD+jnEzl
+hgmjwgop4lt6GNdqNd1EnlaSEArBIf6tIkScANQXhLmyptdWW+21zVBRUv0ams+r
+k4Gm0N9yzoAz503Vc6f8uAW3QonULzQCHVpMuMssU4YQk0u1MBSkvMlvkMouujzx
+CA8rx6Tlp84qI4xQucWTdAkJnVb3xd3vnOrkXP8UsKZOCRkwZ76Iuvjgx7CbAy7U
+f9we1ZWR8RmIVRxFrnFzpJu8wYQ1+7/f8vistDumkxECAwEAAaNqMGgwDgYDVR0P
+AQH/BAQDAgWgMBMGA1UdJQQMMAoGCCsGAQUFBwMBMB8GA1UdIwQYMBaAFJbi3Ybj
+xDBPnN8B3bayujege6IKMCAGA1UdEQQZMBeCCWxvY2FsaG9zdIcEfwAAAYcEwKgC
+ejANBgkqhkiG9w0BAQsFAAOCAYEAi3Scjz10WV/nJnlKHGbQxBgM4FqOQMEMqNoQ
+ojdRQqY7iTfV+6265TFaZ9pY27+ZKzL8Qyb6htqNYuRKACXqEohHHJBdDlGV9Kda
+hxznoP9ZBYm4NoiSiIJIQmEVy5SH/qb208gZPXb8mQT/czPPmQAE0oTWrVUDRkJl
+YGJmfcdVuN8JfLqW0HxUdP89gqH8nHv72+wZpcqc9i/yVwCfjhqgbinwU/rkZRqW
+7SIBVlDJs7d+4EuDMQMMe21w4b3isXr+LVtrH6I1MtQ0hTd9bQiMvl6HQ6hDK9Yd
+VRz2ubj5p2/qzCchxxfMMJjAea8YNlQCL593963PKzDPcaJnw8j9RtySpeIxiPPQ
+4+oRkZgO6Bd9OrxOAmoLG8+bJJbwmWC0LxH2nvYmArFgzKDu5hqwGQnLP0/7GeIk
+fNqWPJ84rj0V3lfVRKYWYwXNJbFTCQ3/ewN6mTChzBWgmRFUv6LjSfzq/X2l5tX0
+vLXgvm2XxAtQoVRUAYsRRRrFwguT
+-----END CERTIFICATE-----

+{
+  "name": "tjws",
+  "description": "项目, 编译上传直接执行publish, 不需要其他额外操作。",
+  "version": "1.0.0",
+  "scripts": {
+    "dev": "vite",
+    "start": "vite --host 0.0.0.0",
+    "build": "vite build",
+    "build-watch": "vite build --watch",
+    "build-ts": "vue-tsc --noEmit && vite build",
+    "serve": "vite preview",
+    "cypress:open": "cypress open"
+  },
+  "dependencies": {
+    "@vitejs/plugin-legacy": "^1.8.2",
+    "@vueuse/core": "^8.5.0",
+    "animate.css": "^4.1.1",
+    "dayjs": "^1.11.3",
+    "default-passive-events": "^2.0.0",
+    "global": "^4.4.0",
+    "html2canvas": "^1.4.1",
+    "jquery": "^3.6.0",
+    "js-cookie": "^3.0.1",
+    "lodash": "^4.17.21",
+    "mockjs": "^1.1.0",
+    "moment": "^2.29.3",
+    "mui-player": "^1.6.0",
+    "typescript": "^4.7.3",
+    "unplugin-vue-components": "^0.24.1",
+    "uuid": "^8.3.2",
+    "vant": "^4.0.0-alpha.3",
+    "vconsole": "^3.14.6",
+    "vite-plugin-dynamic-import": "^0.9.6",
+    "vite-plugin-mp": "^1.6.1",
+    "vue": "^3.2.36",
+    "weixin-js-sdk": "^1.6.0"
+  },
+  "devDependencies": {
+    "@types/jquery": "^3.5.14",
+    "@types/lodash": "^4.14.182",
+    "@types/moment": "^2.13.0",
+    "@typescript-eslint/parser": "^5.27.1",
+    "@vitejs/plugin-vue": "^2.3.3",
+    "@vue/compiler-sfc": "^3.2.36",
+    "axios": "^0.27.2",
+    "chai": "^4.3.6",
+    "cypress": "^9.7.0",
+    "eslint-plugin-vue": "^9.0.1",
+    "less": "^4.1.2",
+    "mocha": "^10.0.0",
+    "pinia": "^2.0.14",
+    "postcss-px-to-viewport": "^1.1.1",
+    "qs": "^6.10.3",
+    "tslint": "^6.1.3",
+    "unplugin-auto-import": "^0.8.8",
+    "unplugin-vue-define-options": "^0.6.1",
+    "vite": "^2.9.9",
+    "vite-plugin-style-import": "1.4.1",
+    "vue-router": "^4.0.15"
+  }
+}

+module.exports = {
+  printWidth: 100, // 代码行的宽度，通用建议每行最大长度建议为100/120，但最好不超过这两个数。
+  tabWidth: 2, // 指定每次缩进的空格数。
+  semi: true, // 是否在代码语句结尾添加分号。
+  vueIndentScriptAndStyle: true,
+  singleQuote: true, // 是否使用单引号，JSX单独设置。
+  trailingComma: 'all', // 在多行以逗号分割的句法中尽可能补充尾行逗号。
+  bracketSpacing: true, // 是否在对象属性与大括号之间填充空格。
+  bracketSameLine: false, // 开始标签的右尖括号是否跟随在最后一行属性末尾。
+  proseWrap: 'never',
+  htmlWhitespaceSensitivity: 'strict',
+  endOfLine: 'auto', // 设置换行风格，避免不同操作系统造成的大量代码diff。
+  singleAttributePerLine: false // 在Html，Vue，JSX中是否强制每条属性占用一行。
+};

+#!/usr/bin/env sh
+# -----------------------------------------------
+# Filename:    publish.sh
+# Revision:    1.0
+# Date:        2022年5月20日
+# Author:      Hooke
+# Description: **** 根据php项目相应特征书写项目发布流程
+# -----------------------------------------------
+
+# 当发生错误时中止脚本
+set -e
+
+# 本地Git服务器目录路径
+path=/Users/huyirui/program/itomix/git/isp/f
+
+# 编译输出文件夹
+output=voice
+
+# 打包
+npm run build
+
+# 移除Git服务器目录下项目文件夹
+rm -r $path"/${output:?}/images"
+rm -r $path"/${output:?}/index.html"
+rm -r $path"/${output:?}/static"
+
+# 把本地编译输出文件夹添加到服务器目录
+mv "${output:?}/images" $path"/${output:?}"
+mv "${output:?}/index.html" $path"/${output:?}"
+mv "${output:?}/static" $path"/${output:?}"
+
+# 提交到Git服务器
+cd $path"/${output:?}"
+git pull
+git add -A
+git commit -m '前端网页更新'
+git push
+
+# 更新SSH服务器上文件
+ssh -p 22 itomix@ipadbiz.cn 'cd /opt/voice/f/voice && git pull'

+export interface commentListType {
+  id: string;
+  avatar: string;
+  name: string;
+  kg_name: string;
+  comment_time: string;
+  note: string;
+  c_action: string;
+  c_name: string;
+  cover: string;
+  prod_id: string;
+  perf_id: string;
+  book_id: string;
+  perf_name: string;
+  book_name: string;
+  localism_type: string;
+  is_new: number;
+}

+<!--
+ * @Author: hookehuyr hookehuyr@gmail.com
+ * @Date: 2022-05-26 23:52:36
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2023-05-19 15:52:36
+ * @FilePath: /tswj/src/App.vue
+ * @Description:
+-->
+<template>
+  <!-- 页面缓存 -->
+  <router-view v-slot="{ Component, route }">
+    <keep-alive :include="keepPages" :max="10">
+      <component :is="Component" :key="route.name" />
+    </keep-alive>
+  </router-view>
+</template>
+
+<script setup>
+import { mainStore, useTitle } from '@/utils/generatePackage'
+import { computed, watchEffect, onMounted } from 'vue';
+import { useRoute } from 'vue-router'
+import { Toast } from 'vant';
+// 会根据配置判断是否显示调试控件
+// eslint-disable-next-line no-unused-vars
+import vConsole from '@/utils/vconsole'
+// 初始化WX环境
+import wx from 'weixin-js-sdk'
+// import { wxJsAPI } from '@/api/wx/config'
+// import { apiList } from '@/api/wx/jsApiList.js'
+
+// 使用 include + pinia 状态管理动态缓存页面
+const store = mainStore()
+const keepPages = computed(() => store.getKeepPages)
+
+// TAG: 全局设置页面标题
+const $route = useRoute();
+watchEffect(
+  () => useTitle($route.meta.title)
+)
+
+// TAG: 全局配置Toast
+// Toast.setDefaultOptions({
+//   duration: 2000,
+//   className: 'zIndex'
+// });
+
+onMounted(async () => {
+  // const { data } = await wxJsAPI();
+  // data.jsApiList = apiList;
+  // wx.config(data);
+  // wx.ready(() => {
+  //   wx.showAllNonBaseMenuItem();
+  // });
+  // wx.error((err) => {
+  //   console.warn(err);
+  // });
+})
+</script>
+
+<style lang="less">
+@prefix: ~'@{namespace}-x';
+
+html,
+body {
+  width: 100%;
+  height: 100%;
+}
+
+body {
+  position: relative;
+  // --van-white: #fff;
+  // --van-blue: #1989fa;
+  // --van-button-primary-color: var(--van-white);
+  // --van-button-primary-background: var(--van-primary-color);
+  /* 全局修改主色调 */
+  // --van-blue: #F9D95C;
+
+  // background-color: #FAFAFA;
+  p {
+    margin: 0;
+    padding: 0;
+  }
+}
+
+.@{prefix} {
+  color: red;
+}
+
+.global-center {
+  position: relative;
+  top: 50%;
+  transform: translateY(-50%);
+}
+
+.zIndex {
+  z-index: 4500 !important;
+}
+</style>

+/*
+ * @Date: 2022-06-20 16:33:35
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-20 16:35:56
+ * @FilePath: /tswj/src/api/B/audit.js
+ * @Description: 文件描述
+ */
+import { fn, fetch } from '@/api/fn';
+
+const Api = {
+  CHECK_PROD: '/srv/?a=check_prod',
+}
+
+/**
+ * @description 审核作品
+ * @param {*} prod_id
+ * @param {*} status
+ * @param {*} check_note
+ * @returns {*} data
+ */
+  export const checkProdAPI = (params) => fn(fetch.post(Api.CHECK_PROD, params));

+/*
+ * @Author: hookehuyr hookehuyr@gmail.com
+ * @Date: 2022-06-09 02:25:31
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-17 22:32:59
+ * @FilePath: /tswj/src/api/B/kg.js
+ * @Description: 幼儿园主页接口
+ */
+import { fn, fetch } from '@/api/fn';
+
+const Api = {
+  KG_INFO: '/srv/?a=kg_info',
+  MY_KG: '/srv/?a=my_kg',
+}
+
+/**
+ * @description 幼儿园详情
+ * @returns {*} data
+ */
+export const kgInfoAPI = (params) => fn(fetch.get(Api.KG_INFO, params));
+
+/**
+ * @description 我的幼儿园详情
+ * @returns {*} data
+ */
+export const myKgAPI = (params) => fn(fetch.get(Api.MY_KG, params));

+/*
+ * @Date: 2022-06-20 12:56:47
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-20 15:41:41
+ * @FilePath: /tswj/src/api/B/localism.js
+ * @Description: 文件描述
+ */
+import { fn, fetch } from '@/api/fn';
+
+const Api = {
+  LOCALISM_LIST_MODI: '/srv/?a=localism_list4modi',
+  ADD_LOCALISM: '/srv/?a=add_localism',
+  MODIFY_PROD_LOCALISM: '/srv/?a=modify_prod_localism',
+}
+
+/**
+ * @description 幼儿园方言列表
+ * @returns {*} data
+ */
+export const localismListModiAPI = (params) => fn(fetch.get(Api.LOCALISM_LIST_MODI, params));
+
+/**
+ * @description 新增方言
+ * @param {string} localism_name
+ * @returns {*} data
+ */
+export const addLocalismAPI = (params) => fn(fetch.post(Api.ADD_LOCALISM, params));
+
+/**
+ * @description 更新作品方言
+ * @param {string} prod_id
+ * @param {string} localism_name
+ * @returns {*} data
+ */
+export const modifyProdLocalismAPI = (params) => fn(fetch.post(Api.MODIFY_PROD_LOCALISM, params));

+/*
+ * @Date: 2022-06-17 15:03:03
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-20 09:59:50
+ * @FilePath: /tswj/src/api/B/login.js
+ * @Description: 文件描述
+ */
+import { fn, fetch } from '@/api/fn';
+
+const Api = {
+  B_LOGIN: '/srv/?a=b_login',
+  B_LOGOUT: '/srv/?a=b_logout',
+}
+
+/**
+ * @description 登录接口
+ * @param {*} phone 手机号
+ * @param {*} pin 验证码
+ */
+export const bLoginAPI = (params) => fn(fetch.post(Api.B_LOGIN, params));
+
+/**
+ * @description 登出接口
+ */
+export const bLogoutAPI = (params) => fn(fetch.post(Api.B_LOGOUT, params));

+/*
+ * @Date: 2022-05-26 19:50:27
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-18 00:15:08
+ * @FilePath: /tswj/src/api/C/book.js
+ * @Description: 文件描述
+ */
+import { fn, fetch } from '@/api/fn';
+
+const Api = {
+  ADD_SUBSCRIBE: '/srv/?a=add_subscribe',
+  BOOK_INFO: '/srv/?a=book_info',
+}
+
+/**
+ * @description: 订阅书籍操作
+ * @param {String} book_id 书籍 ID
+ * @returns 
+ */
+export const addSubscribeAPI = (params) => fn(fetch.post(Api.ADD_SUBSCRIBE, params));
+
+/**
+ * @description: 书籍详情
+ * @param {String} book_id 书籍 ID
+ * @param {String} localism_type 方言类型
+ * @param {*} limit
+ * @param {*} offset
+ * @returns 
+ */
+export const bookInfoAPI = (params) => fn(fetch.get(Api.BOOK_INFO, params));

+/*
+ * @Author: hookehuyr hookehuyr@gmail.com
+ * @Date: 2022-06-01 16:00:48
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-07-01 16:40:05
+ * @FilePath: /tswj/src/api/C/donate.js
+ * @Description: 捐钱操作API
+ */
+import { fn, fetch } from '@/api/fn';
+
+const Api = {
+  PREPARE_DONATE: '/srv/?a=prepare_donate',
+  ADD_DONATE: '/srv/?a=add_donate',
+  ONE_CERT: '/srv/?a=one_cert',
+}
+
+/**
+ * @description: 当前用户捐献所需信息
+ * @summary 适用于 访客进入操作，幼儿园节目操作，表演者节目操作
+ * @param {String} kg_id 幼儿园ID
+ * @param {String} perf_id 表演者ID
+ * @returns 
+ */
+export const prepareDonateAPI = (params) => fn(fetch.get(Api.PREPARE_DONATE, params));
+
+/**
+ * @description: 用户捐献
+ * @param {Number} qty 数量
+ * @param {String} donate_name 捐赠人名称
+ * @param {Number} kg_id 指定助力幼儿园id
+ * @param {Number} perf_id 指定助力儿童id
+ * @returns 
+ */
+export const addDonateAPI = (params) => fn(fetch.post(Api.ADD_DONATE, params));
+
+/**
+ * @description: 捐赠证书
+ * @param {String} donate_id 捐赠ID
+ * @returns 
+ */
+export const oneCertAPI = (params) => fn(fetch.get(Api.ONE_CERT, params));

+/*
+ * @Author: hookehuyr hookehuyr@gmail.com
+ * @Date: 2022-05-18 21:12:23
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-09 09:21:54
+ * @FilePath: /tswj/src/api/C/kg.js
+ * @Description: 幼儿园相关接口
+ */
+import { fn, fetch } from '@/api/fn';
+
+const Api = {
+  KG_LIST: '/srv/?a=kg_list',
+  KG_DONATE_LIST: '/srv/?a=donate_list',
+  KG_DONATE_RANK: '/srv/?a=donate_rank',
+  KG_BOOK_LIST: '/srv/?a=kg_book_list',
+}
+
+/**
+ * @description 幼儿园列表页
+ * @param {*} params 参数
+ * @returns {array} data
+ */
+export const kgListAPI = (params) => fn(fetch.get(Api.KG_LIST, params));
+
+/**
+ * @description 幼儿园捐赠列表页
+ * @param {*} kg_id 幼儿园ID
+ * @param {*} limit 20
+ * @param {*} offset 0
+ * @returns {array} data
+ */
+export const kgDonateListAPI = (params) => fn(fetch.get(Api.KG_DONATE_LIST, params));
+
+/**
+ * @description 幼儿园捐赠排行榜
+ * @param {*} kg_id 幼儿园ID
+ * @param {*} limit 20
+ * @param {*} offset 0
+ * @returns {array} data
+ */
+export const kgDonateRankAPI = (params) => fn(fetch.get(Api.KG_DONATE_RANK, params));
+
+/**
+ * @description 幼儿园书籍列表
+ * @param {*} kg_id 幼儿园ID
+ * @returns {*} data
+ */
+export const kgBookListAPI = (params) => fn(fetch.get(Api.KG_BOOK_LIST, params));

+/*
+ * @Author: hookehuyr hookehuyr@gmail.com
+ * @Date: 2022-05-18 22:16:10
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-09-06 11:32:16
+ * @FilePath: /tswj/src/api/C/me.js
+ * @Description: 我的页面接口操作
+ */
+import { fn, fetch } from '@/api/fn';
+
+const Api = {
+  CHANGE_PERFORMER: '/srv/?a=change_performer',
+  MY_INFO: '/srv/?a=my_info',
+  MY_PERFORMER: '/srv/?a=my_performer',
+  MY_LIKE: '/srv/?a=my_like',
+  MY_FAVOR: '/srv/?a=my_favor',
+  MY_COMMENT: '/srv/?a=my_comment',
+  MY_ATME: '/srv/?a=my_atme',
+  DEL_COMMENT: '/srv/?a=del_comment',
+  MY_SUBSCRIBE: '/srv/?a=my_subscribe',
+  MY_FOLLOW: '/srv/?a=my_follow',
+  MY_PROD: '/srv/?a=my_prod',
+}
+
+/**
+ * @description: 切换儿童角色
+ * @param {*} params
+ * @returns
+ */
+export const changePerformerAPI = (params) => fn(fetch.post(Api.CHANGE_PERFORMER, params));
+
+/**
+ * @description: 获取儿童信息
+ * @param {object} params 参数
+ * @returns {*} 布尔值｜｜查询值
+ */
+export const myInfoAPI = (params) => fn(fetch.get(Api.MY_INFO, params));
+
+/**
+ * @description: 角色列表信息
+ * @param {*} params
+ * @returns
+ */
+export const myPerformerAPI = (params) => fn(fetch.get(Api.MY_PERFORMER, params));
+
+/**
+ * @description: 点赞列表信息
+ * @param {*} params
+ * @returns
+ */
+export const myLikeAPI = (params) => fn(fetch.get(Api.MY_LIKE, params));
+
+/**
+ * @description: 收藏列表信息
+ * @param {*} params
+ * @returns
+ */
+export const myFavorAPI = (params) => fn(fetch.get(Api.MY_FAVOR, params));
+
+/**
+ * @description: 用户评论列表
+ * @param {string} limit
+ * @param {string} offset
+ * @returns
+ */
+export const myCommentAPI = (params) => fn(fetch.get(Api.MY_COMMENT, params));
+
+/**
+ * @description: 删除用户评论
+ * @param {string} comment_id 评论ID
+ * @returns
+ */
+export const delCommentAPI = (params) => fn(fetch.post(Api.DEL_COMMENT, params));
+
+/**
+ * @description: /@/我的列表
+ * @param {string} limit
+ * @param {string} offset
+ * @returns
+ */
+export const myAtmeAPI = (params) => fn(fetch.get(Api.MY_ATME, params));
+
+/**
+ * @description: 我的订阅
+ * @returns
+ */
+export const mySubscribeAPI = (params) => fn(fetch.get(Api.MY_SUBSCRIBE, params));
+
+/**
+ * @description: 我的关注
+ * @returns
+ */
+export const myFollowAPI = (params) => fn(fetch.get(Api.MY_FOLLOW, params));
+
+/**
+ * @description: 我的作品
+ * @returns
+ */
+export const myProdAPI = (params) => fn(fetch.get(Api.MY_PROD, params));

+/*
+ * @Author: hookehuyr hookehuyr@gmail.com
+ * @Date: 2022-05-26 21:16:59
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-10 13:30:31
+ * @FilePath: /tswj/src/api/C/perf.js
+ * @Description: 用户相关API
+ */
+import { fn, fetch } from '@/api/fn';
+
+const Api = {
+  PERF_INFO: '/srv/?a=perf_info',
+  ADD_FOLLOW: '/srv/?a=add_follow',
+  ADD_COMMENT: '/srv/?a=add_comment',
+  ADD_REPLY: '/srv/?a=add_reply',
+  MY_COMMENT_TIME: '/srv/?a=my_comment_time',
+}
+
+/**
+ * @description: 获取表演者信息
+ * @param {String} perf_id 表演者ID
+ * @returns 
+ */
+export const perfInfoAPI = (params) => fn(fetch.post(Api.PERF_INFO, params));
+
+/**
+ * @description: 关注用户操作
+ * @param {String} perf_id 表演者ID
+ * @returns 
+ */
+export const addFollowAPI = (params) => fn(fetch.post(Api.ADD_FOLLOW, params));
+
+/**
+ * @description: 用户新增评论操作
+ * @param {String} prod_id 作品ID
+ * @returns 
+ */
+export const addCommentAPI = (params) => fn(fetch.post(Api.ADD_COMMENT, params));
+
+/**
+ * @description: 用户新增回复操作
+ * @param {String} comment_id 评论ID
+ * @returns 
+ */
+export const addReplyAPI = (params) => fn(fetch.post(Api.ADD_REPLY, params));
+
+/**
+ * @description: 更新用户留言事件
+ * @summary 处理留言已读未读问题
+ * @param {String} optr_type 操作类型 my_comment ｜ atme_comment
+ * @returns 
+ */
+export const myCommentTimeAPI = (params) => fn(fetch.post(Api.MY_COMMENT_TIME, params));

+import { fn, fetch } from '@/api/fn';
+
+const Api = {
+  PROD_ACTION: '/srv/?a=prod_action',
+  PROD_INFO: '/srv/?a=prod_info',
+}
+
+/**
+ * @description: 操作作品动作
+ * @param {String} type 动作类型：like, favor, play
+ * @param {String} prod_id 作品 ID
+ * @returns 
+ */
+export const prodActionAPI = (params) => fn(fetch.post(Api.PROD_ACTION, params));
+
+/**
+ * @description: 查询作品详情
+ * @param {String} type 动作类型：like, favor, play
+ * @param {String} prod_id 作品 ID
+ * @returns 
+ */
+export const prodInfoAPI = (params) => fn(fetch.get(Api.PROD_INFO, params));

+/*
+ * @Date: 2022-06-17 14:54:29
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-18 22:18:46
+ * @FilePath: /tswj/src/api/common.js
+ * @Description: 通用接口
+ */
+import { fn, fetch, uploadFn } from '@/api/fn';
+
+const Api = {
+  SMS: '/srv/?a=sms',
+  TOKEN: '/srv/?a=upload',
+  SAVE_FILE: '/srv/?a=upload&t=save_file',
+}
+
+/**
+ * @description: 发送验证码
+ * @param {*} phone 手机号码
+ * @returns 
+ */
+export const smsAPI = (params) => fn(fetch.post(Api.SMS, params));
+
+/**
+ * @description: 获取七牛token
+ * @param {*} filename 文件名
+ * @param {*} file 图片base64
+ * @returns 
+ */
+export const qiniuTokenAPI = (params) => fn(fetch.stringifyPost(Api.TOKEN, params));
+
+/**
+ * @description: 上传七牛
+ * @param {*}
+ * @returns 
+ */
+export const qiniuUploadAPI = (url, data, config) => uploadFn(fetch.basePost(url, data, config));
+
+/**
+ * @description: 保存图片
+ * @param {*} format
+ * @param {*} hash
+ * @param {*} height
+ * @param {*} width
+ * @param {*} filekey
+ * @returns 
+ */
+export const saveFileAPI = (params) => fn(fetch.stringifyPost(Api.SAVE_FILE, params));

+/*
+ * @Date: 2022-05-18 22:56:08
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-07-05 23:27:51
+ * @FilePath: /tswj/src/api/fn.js
+ * @Description: 文件描述
+ */
+import axios from '@/utils/axios';
+import { Toast } from 'vant';
+import qs from 'Qs'
+
+/**
+ * 网络请求功能函数
+ * @param {*} api 请求axios接口
+ * @returns 请求成功后，获取数据
+ */
+export const fn = (api) => {
+  return api
+    .then(res => {
+      if (res.data.code === 1) {
+        return res.data || true;
+      } else {
+        // tslint:disable-next-line: no-console
+        console.warn(res);
+        if (!res.data.show) return false;
+        Toast({
+          icon: 'close',
+          message: res.data.msg
+        });
+        return false;
+      }
+    })
+    .catch(err => {
+      // tslint:disable-next-line: no-console
+      console.error(err);
+      return false;
+    })
+    .finally(() => { // 最终执行
+    })
+}
+
+/**
+ * 七牛返回格式
+ * @param {*} api 
+ * @returns 
+ */
+export const uploadFn = (api) => {
+  return api
+    .then(res => {
+      if (res.statusText === 'OK') {
+        return res.data || true;
+      } else {
+        // tslint:disable-next-line: no-console
+        console.warn(res);
+        if (!res.data.show) return false;
+        Toast({
+          icon: 'close',
+          message: res.data.msg
+        });
+        return false;
+      }
+    })
+    .catch(err => {
+      // tslint:disable-next-line: no-console
+      console.error(err);
+      return false;
+    })
+}
+
+/**
+ * 统一 GET/POST 不同传参形式
+ */
+export const fetch = {
+  get: function (api, params) {
+    return axios.get(api, { params })
+  },
+  post: function (api, params) {
+    return axios.post(api, params)
+  },
+  stringifyPost: function (api, params) {
+    return axios.post(api, qs.stringify(params))
+  },
+  basePost: function (url, data, config) {
+    return axios.post(url, data, config)
+  }
+}

+/*
+ * @Author: hookehuyr hookehuyr@gmail.com
+ * @Date: 2022-06-09 13:32:44
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-14 14:47:01
+ * @FilePath: /tswj/src/api/wx/config.js
+ * @Description:
+ */
+import { fn, fetch } from '@/api/fn';
+
+const Api = {
+  WX_JSAPI: '/srv/?a=wx_share',
+}
+
+/**
+ * @description 获取微信CONFIG配置文件
+ * @param {*} url
+ * @returns {*} cfg
+ */
+export const wxJsAPI = (params) => fn(fetch.get(Api.WX_JSAPI, params));

+/*
+ * @Date: 2022-06-13 14:18:57
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-13 14:27:21
+ * @FilePath: /tswj/src/api/wx/jsApiList.js
+ * @Description: 文件描述
+ */
+export const apiList = [
+  "updateAppMessageShareData",
+  "updateTimelineShareData",
+  "onMenuShareTimeline",
+  "onMenuShareAppMessage",
+  "onMenuShareQQ",
+  "onMenuShareWeibo",
+  "onMenuShareQZone",
+  "startRecord",
+  "stopRecord",
+  "onVoiceRecordEnd",
+  "playVoice",
+  "pauseVoice",
+  "stopVoice",
+  "onVoicePlayEnd",
+  "uploadVoice",
+  "downloadVoice",
+  "chooseImage",
+  "previewImage",
+  "uploadImage",
+  "downloadImage",
+  "translateVoice",
+  "getNetworkType",
+  "openLocation",
+  "getLocation",
+  "hideOptionMenu",
+  "showOptionMenu",
+  "hideMenuItems",
+  "showMenuItems",
+  "hideAllNonBaseMenuItem",
+  "showAllNonBaseMenuItem",
+  "closeWindow",
+  "scanQRCode",
+  "chooseWXPay",
+  "openProductSpecificView",
+  "addCard",
+  "chooseCard",
+  "openCard"
+]

+/*
+ * @Author: hookehuyr hookehuyr@gmail.com
+ * @Date: 2022-06-09 13:32:44
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-09 13:42:06
+ * @FilePath: /tswj/src/api/wx/config.js
+ * @Description:
+ */
+import { fn, fetch } from '@/api/fn';
+
+const Api = {
+  WX_PAY: 'c/bill_paymentForBill.do',
+}
+
+/**
+ * @description 微信支付接口
+ * @param {*}
+ * @returns {*}
+ */
+export const wxPayAPI = (params) => fn(fetch.get(Api.WX_PAY, params));

+
+.modify-top {
+  z-index: 36;
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 10px;
+  background-image: url('http://gyzs.onwall.cn/top-xian%402x.png');
+  background-size: contain;
+}
+.content-bg {
+  /**
+  * background-color and background-image 共存，不能使用渐变色
+  * 图片铺平当时精度提高看看效果
+  * 直接用渐变色
+  * 不使用渐变色背景
+  */
+  height: 100%;
+  min-height: 100vh;
+  // background-image: url('@images/bg-yellow-duan@2x.png');
+  background-image: url('http://gyzs.onwall.cn/bg-yellow-duan%402x.png');
+  // background-size: cover;
+  // background: linear-gradient(360deg, #FDD347 0%, #FFED6D 100%) ;
+}

+@namespace: 'tswj';
+
+/* ============ 颜色 ============ */
+
+// 主色调
+@base-color: #11D2B1;
+// 文字颜色
+@base-font-color: #FFFFFF;
+
+// 定义一个映射
+#colors() {
+  base-color: @base-color;
+  base-font-color: @base-font-color;
+}
+
+// 混合
+.width100 {
+  width: 100%;
+}

+// Generated by 'unplugin-auto-import'
+export {}
+declare global {
+  const EffectScope: typeof import('vue')['EffectScope']
+  const computed: typeof import('vue')['computed']
+  const createApp: typeof import('vue')['createApp']
+  const customRef: typeof import('vue')['customRef']
+  const defineAsyncComponent: typeof import('vue')['defineAsyncComponent']
+  const defineComponent: typeof import('vue')['defineComponent']
+  const effectScope: typeof import('vue')['effectScope']
+  const getCurrentInstance: typeof import('vue')['getCurrentInstance']
+  const getCurrentScope: typeof import('vue')['getCurrentScope']
+  const h: typeof import('vue')['h']
+  const inject: typeof import('vue')['inject']
+  const isProxy: typeof import('vue')['isProxy']
+  const isReactive: typeof import('vue')['isReactive']
+  const isReadonly: typeof import('vue')['isReadonly']
+  const isRef: typeof import('vue')['isRef']
+  const markRaw: typeof import('vue')['markRaw']
+  const nextTick: typeof import('vue')['nextTick']
+  const onActivated: typeof import('vue')['onActivated']
+  const onBeforeMount: typeof import('vue')['onBeforeMount']
+  const onBeforeUnmount: typeof import('vue')['onBeforeUnmount']
+  const onBeforeUpdate: typeof import('vue')['onBeforeUpdate']
+  const onDeactivated: typeof import('vue')['onDeactivated']
+  const onErrorCaptured: typeof import('vue')['onErrorCaptured']
+  const onMounted: typeof import('vue')['onMounted']
+  const onRenderTracked: typeof import('vue')['onRenderTracked']
+  const onRenderTriggered: typeof import('vue')['onRenderTriggered']
+  const onScopeDispose: typeof import('vue')['onScopeDispose']
+  const onServerPrefetch: typeof import('vue')['onServerPrefetch']
+  const onUnmounted: typeof import('vue')['onUnmounted']
+  const onUpdated: typeof import('vue')['onUpdated']
+  const provide: typeof import('vue')['provide']
+  const reactive: typeof import('vue')['reactive']
+  const readonly: typeof import('vue')['readonly']
+  const ref: typeof import('vue')['ref']
+  const resolveComponent: typeof import('vue')['resolveComponent']
+  const shallowReactive: typeof import('vue')['shallowReactive']
+  const shallowReadonly: typeof import('vue')['shallowReadonly']
+  const shallowRef: typeof import('vue')['shallowRef']
+  const toRaw: typeof import('vue')['toRaw']
+  const toRef: typeof import('vue')['toRef']
+  const toRefs: typeof import('vue')['toRefs']
+  const triggerRef: typeof import('vue')['triggerRef']
+  const unref: typeof import('vue')['unref']
+  const useAttrs: typeof import('vue')['useAttrs']
+  const useCssModule: typeof import('vue')['useCssModule']
+  const useCssVars: typeof import('vue')['useCssVars']
+  const useRoute: typeof import('vue-router')['useRoute']
+  const useRouter: typeof import('vue-router')['useRouter']
+  const useSlots: typeof import('vue')['useSlots']
+  const watch: typeof import('vue')['watch']
+  const watchEffect: typeof import('vue')['watchEffect']
+  const watchPostEffect: typeof import('vue')['watchPostEffect']
+  const watchSyncEffect: typeof import('vue')['watchSyncEffect']
+}

+import axios from 'axios';
+import { Toast } from 'vant';
+
+export default {
+  // 初始化设置
+  init: {
+    mounted () {
+      document.title = this.$route.meta.title;
+    }
+  },
+  likeFn: {
+    methods: {
+      /**
+       * 用户相关操作
+       * @param {String} type 动作类型：like, favor, play
+       * @param {String} id 作品 ID
+       */
+      handleAction (type, id) { // 用户操作
+        axios.post('/srv/?a=prod_action', {
+          action_type: type,
+          prod_id: id
+        })
+        .then(res => {
+          if (res.data.code === 1) {
+            if (res.data.msg === `${type}-add-OK`) { // 动作操作成功
+              this.getProductDetail(type, id);
+              if (type === 'favor') {
+                Toast('收藏成功');
+              }
+              if (type === 'like') {
+                Toast('点赞成功');
+              }
+            } else { // 取消操作
+              this.getProductDetail(type, id);
+              if (type !== 'play') {
+                Toast('取消成功');
+              }
+            }
+          } else {
+            // tslint:disable-next-line: no-console
+            console.warn(res);
+            if (!res.data.show) return false;
+            Toast({
+              icon: 'close',
+              message: res.data.msg
+            });
+          }
+        })
+        .catch(err => {
+          // tslint:disable-next-line: no-console
+          console.error(err); 
+        });
+      },
+      getProductDetail (type, id) { // 查询更新作品详情
+        axios.get('/srv/?a=prod_info', {
+          params: {
+            prod_id: id
+          }
+        })
+        .then(res => {
+          if (res.data.code === 1) {
+            this.detail[`is_${type}`] = res.data.data[`is_${type}`];
+            this.detail[`${type}_num`] = res.data.data[`${type}_num`];
+          } else {
+            // tslint:disable-next-line: no-console
+            console.warn(res);
+            if (!res.data.show) return false;
+            Toast({
+              icon: 'close',
+              message: res.data.msg
+            });
+          }
+        })
+        .catch(err => {
+          // tslint:disable-next-line: no-console
+          console.error(err); 
+        });
+      }
+    }
+  }
+};

+var sheshi = [{
+  name: '停车场',
+  position: [116.418563, 39.883041],
+  icon: 'https://a.amap.com/jsapi_demos/static/resource/img/停车场.png'
+}, {
+  name: '洗手间',
+  position: [116.415419, 39.883125],
+  icon: 'https://a.amap.com/jsapi_demos/static/resource/img/洗手间.png'
+}, {
+  name: '洗手间',
+  position: [116.410226, 39.88364],
+  icon: 'https://a.amap.com/jsapi_demos/static/resource/img/洗手间.png'
+}, {
+  name: '洗手间',
+  position: [116.412247, 39.887258],
+  icon: 'https://a.amap.com/jsapi_demos/static/resource/img/洗手间.png'
+}, {
+  name: '洗手间',
+  position: [116.412701, 39.874841],
+  icon: 'https://a.amap.com/jsapi_demos/static/resource/img/洗手间.png'
+}, {
+  name: '售票处',
+  position: [116.412442, 39.887925],
+  icon: 'https://a.amap.com/jsapi_demos/static/resource/img/门票.png'
+}, {
+  name: '售票处',
+  position: [116.413039, 39.874522],
+  icon: 'https://a.amap.com/jsapi_demos/static/resource/img/门票.png'
+}]
+
+var touristSpots = [{
+  name: '祈年殿',
+  position: [116.412866, 39.88365],
+  zIndex: 300,
+  smallIcon: 'https://a.amap.com/jsapi_demos/static/resource/img/故宫.png',
+  bigIcon: 'https://a.amap.com/jsapi_demos/static/resource/img/qiniandian.png',
+  size: [128, 160],
+  anchor: 'bottom-center',
+  minZoom: 19
+}, {
+  name: '西天门',
+  position: [116.405562, 39.881166],
+  smallIcon: 'https://a.amap.com/jsapi_demos/static/resource/img/门.png',
+  bigIcon: 'https://a.amap.com/jsapi_demos/static/resource/img/men.png',
+  size: [146, 144],
+  anchor: 'bottom-center',
+  minZoom: 18
+}, {
+  name: '北天门',
+  position: [116.412745, 39.885776],
+  smallIcon: 'https://a.amap.com/jsapi_demos/static/resource/img/门.png',
+  bigIcon: 'https://a.amap.com/jsapi_demos/static/resource/img/men2.png',
+  size: [185, 94],
+  anchor: 'bottom-center',
+  minZoom: 17
+}, {
+  name: '百花园',
+  position: [116.40783, 39.88212],
+  zIndex: 200,
+  smallIcon: 'https://a.amap.com/jsapi_demos/static/resource/img/盆景02.png',
+  bigIcon: 'https://a.amap.com/jsapi_demos/static/resource/img/men3.png',
+  size: [210, 98],
+  anchor: 'bottom-center',
+  minZoom: 16
+}, {
+  name: '万寿亭',
+  position: [116.406792, 39.8837],
+  smallIcon: 'https://a.amap.com/jsapi_demos/static/resource/img/景点.png',
+  bigIcon: 'https://a.amap.com/jsapi_demos/static/resource/img/tingzi.png',
+  size: [128, 168],
+  anchor: 'bottom-center',
+  minZoom: 15
+}, {
+  name: '圜丘',
+  position: [116.413219, 39.876967],
+  smallIcon: 'https://a.amap.com/jsapi_demos/static/resource/img/景点.png',
+  bigIcon: 'https://a.amap.com/jsapi_demos/static/resource/img/men4.png',
+  size: [148, 137],
+  anchor: 'bottom-center',
+  minZoom: 15
+}, {
+  name: '东天门',
+  position: [116.417604, 39.881557],
+  smallIcon: 'https://a.amap.com/jsapi_demos/static/resource/img/门.png',
+  bigIcon: 'https://a.amap.com/jsapi_demos/static/resource/img/men2.png',
+  size: [185, 94],
+  anchor: 'bottom-center',
+  minZoom: 15
+}];
+
+var spotInfo = [
+  {
+    name: '三宝楼',
+    position: [120.587519, 31.315924],
+    icon: '//a.amap.com/jsapi_demos/static/demo-center/icons/poi-marker-default.png',
+  },
+  {
+    name: '法云堂',
+    position: [120.587884, 31.3152],
+    icon: '//a.amap.com/jsapi_demos/static/demo-center/icons/poi-marker-default.png',
+  },
+  {
+    name: '西花园湖心亭',
+    position: [120.586253, 31.315273],
+    icon: '//a.amap.com/jsapi_demos/static/demo-center/icons/poi-marker-default.png',
+  },
+  {
+    name: '四百岁神龟',
+    position: [120.585948, 31.315095],
+    icon: '//a.amap.com/jsapi_demos/static/demo-center/icons/poi-marker-default.png',
+  },
+];
+
+var toiletInfo = [
+  {
+    name: '厕所',
+    position: [120.588351, 31.31449],
+    icon: '//a.amap.com/jsapi_demos/static/resource/img/洗手间.png',
+  },
+];
+
+export default {
+  sheshi,
+  touristSpots,
+  spotInfo,
+  toiletInfo,
+};

+/**
+ * 判断多行省略文本
+ * @param {*} id 目标dom标签
+ * @returns 
+ */
+const hasEllipsis = (id) => {
+  let oDiv = document.getElementById(id);
+  let flag = false
+  if (oDiv.scrollHeight > oDiv.clientHeight) {
+    flag = true
+  }
+  return flag
+}
+
+export default {
+  hasEllipsis
+}
\ No newline at end of file

+import { ref } from 'vue'
+import { useBrowserLocation, useEventListener, useTitle, useUrlSearchParams, useWindowScroll, logicAnd } from '@vueuse/core'
+export const fn = () => {
+  // const location = useBrowserLocation()
+  // console.warn(location.value);
+
+  // useEventListener(window, 'scroll', (evt) => { 
+  //   const { x, y } = useWindowScroll()
+  //   // console.warn(x.value);
+  //   console.warn(y.value);
+  // })
+
+  // useTitle('New Title')
+
+  const a = ref(true)
+  const b = ref(true)
+  const flag = a.value && b.value
+  console.warn(flag);
+  
+}

+<template>
+  <div class="video-wrapper" style="position: relative;">
+    <div v-if="mp && detail.showStatus" class="status">
+      <van-image round width="6rem" height="6rem" style="vertical-align: bottom;" :src="status_icon" />
+    </div>
+    <div :id="'mui-player-' + item.id" class="video-div" />
+    <div v-if="mp">
+      <div v-if="item.status === 'ENABLE'" class="normal-module">
+        <div class="video-bar">
+          <van-row>
+            <van-col span="12" @click="setComment">
+              <van-image round width="2rem" height="2rem" style="vertical-align: middle;"
+                :src="item.avatar ? item.avatar : icon_avatar" />&nbsp;&nbsp;
+              <span style="font-size: 1.05rem;vertical-align: middle;">{{ item.name }}</span>
+            </van-col>
+            <van-col span="12">
+              <div style="padding: 0.25rem; padding-top: 0.75rem; text-align: right;">
+                <span @click="setComment">
+                  <van-icon :name="icon_liuyan" size="1.2rem" style="vertical-align: bottom;" />
+                  {{ item.comment_num }}
+                </span>
+                &nbsp;&nbsp;&nbsp;
+                <span @click="handleAction('like', detail.id)">
+                  <van-icon v-if="!detail.is_like" :name="icon_dianzan1" size="1.2rem"
+                    style="vertical-align: bottom;" />
+                  <van-icon v-else :name="icon_dianzan2" size="1.2rem" style="vertical-align: bottom;" />
+                  {{ detail.like_num }}
+                </span>
+              </div>
+            </van-col>
+          </van-row>
+        </div>
+        <div style="color: #999999; padding: 0px 1rem 0.5rem;" @click="goTo">
+          {{ item.book_name }} ｜ {{ item.localism_type }}
+        </div>
+      </div>
+      <div v-else class="audit-module" style="margin-top: 1rem;">
+        <div style="color: #222222; padding: 0px 1rem 0.5rem;">{{ item.book_name }} ｜ {{ item.localism_type }}</div>
+        <div v-if="item.status === 'DISABLE'" class="van-hairline--top" style="padding: 1rem; font-size: 0.85rem;">
+          <p style="color: #999999; margin-bottom: 0.25rem;">老师留言：</p>
+          <p>{{ item.check_note }}</p>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+/**
+ * 视频组件通用模块
+ */
+import icon_dianzan1 from '@images/icon-dianzan01@2x.png'
+import icon_dianzan2 from '@images/icon-dianzan02@2x.png'
+import icon_liuyan from '@images/icon-liuyan@2x.png'
+import icon_avatar from '@images/que-touxiang@2x.png'
+
+import icon_refuse from '@images/icon-jujue@2x.png'
+import icon_apply from '@images/icon-shenhe@2x.png'
+import icon_enable from '@images/icon-tongguo@2x.png'
+
+import 'mui-player/dist/mui-player.min.css'
+import MuiPlayer from 'mui-player'
+import _ from 'lodash';
+import { DEFAULT_COVER } from '@/constant'
+
+</script>
+
+<script>
+import mixin from 'common/mixin';
+
+export default {
+  mixins: [mixin.likeFn],
+  props: ['item'],
+  data() {
+    return {
+      detail: {},
+      mp: ''
+    }
+  },
+  computed: {
+    // eslint-disable-next-line vue/return-in-computed-property
+    status_icon () {
+      switch (this.item.status) {
+        case 'ENABLE':
+          return icon_enable
+        case 'DISABLE':
+          return icon_refuse
+        case 'APPLY':
+          return icon_apply
+      }
+    }
+  },
+  created() {
+  },
+  mounted() {
+    // TAG: 视频组件控制
+    setTimeout(() => {
+      var mp = new MuiPlayer({
+        container: '#mui-player-' + this.item.id,
+        title: this.item.title,
+        src: this.item.video,
+        poster: this.item.cover ? this.item.cover : DEFAULT_COVER,
+        // poster: DEFAULT_COVER,
+        autoFit: false,
+        videoAttribute: [ // 声明启用同层播放, 不让会自动全屏播放
+          { attrKey: 'webkit-playsinline', attrValue: 'webkit-playsinline' },
+          { attrKey: 'playsinline', attrValue: 'playsinline' },
+          { attrKey: 'x5-video-player-type', attrValue: 'h5-page' },
+        ]
+      })
+      this.mp = mp; // 渲染速度问题，只有视频控件渲染完成后显示
+      this.detail = _.cloneDeep(this.item);
+      this.detail.showStatus = true;
+      var video = mp.video();
+      // 监听原生video事件，审核状态标签显示控制
+      var _this = this;
+      video && video.addEventListener('play', function () {
+        _this.detail.showStatus = false;
+      });
+      video && video.addEventListener('pause', function () {
+        _this.detail.showStatus = true;
+      });
+    }, 500);
+    // 配置16:9高度比
+    const width = document.getElementById('mui-player-' + this.item.id).clientWidth;
+    const height = (width * 9) / 16;
+    document.getElementById('mui-player-' + this.item.id).height = height;
+  },
+  methods: {
+    goTo () { // 跳转作品详情页
+      this.$router.push({
+        path: '/client/videoDetail',
+        query: {
+          prod_id: this.item.id,
+          type: this.item.type, // 特殊标识，判断入口 为keepAlive使用
+          perf_id: this.item.perf_id,
+          book_id: this.item.book_id
+        }
+      });
+    },
+    setComment() {
+      this.$router.push({
+        path: '/client/videoDetail/comment',
+        query: {
+          prod_id: this.item.id,
+          book_id: this.item.book_id
+        }
+      });
+    }
+  }
+}
+</script>
+
+<style lang="less" scoped>
+.video-wrapper {
+  margin: 1rem;
+  border-bottom-left-radius: 5px;
+  border-bottom-right-radius: 5px;
+  box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.13);
+  .status {
+    position: absolute; 
+    top: 0; 
+    right: 0; 
+    z-index: 999;
+  }
+  .video-div {
+    border-top-left-radius: 5px;
+    border-top-right-radius: 5px;
+  }
+
+  .video-bar {
+    color: #713610;
+    padding: 1rem;
+    padding-bottom: 0.5rem;
+ 
+  }
+}
+</style>

+<template>
+  <div class="video-wrapper" style="position: relative;">
+    <div v-if="status === 'PROCESS' && detail.showStatus" class="status">
+      <van-image v-if="item.status === 'ENABLE'" round width="6rem" height="6rem" style="vertical-align: bottom;"
+        :src="icon_enable" />
+      <van-image v-if="item.status === 'DISABLE'" round width="6rem" height="6rem" style="vertical-align: bottom;"
+        :src="icon_refuse" />
+      <van-image v-if="item.status === 'APPLY'" round width="6rem" height="6rem" style="vertical-align: bottom;"
+        :src="icon_apply" />
+    </div>
+    <div :id="'mui-player-' + item.id" class="video-div" />
+    <div class="control-bar">
+      <div>
+        <div class="video-bar">
+          <!-- <van-row align="center">
+            <van-col span="8">
+              <van-image round width="2rem" height="2rem" style="vertical-align: middle;" :src="item.avatar" />&nbsp;
+              <span style="font-size: 1.05rem; vertical-align: middle;">{{ item.name }}</span>
+            </van-col>
+            <van-col span="16">
+              <div style="color: #999999; text-align: right;">
+                {{ item.book_name }} ｜
+                <span style="color: #11D2B1;" @click="setLocalism">{{ item.localism_type }}</span>
+              </div>
+            </van-col>
+          </van-row> -->
+          <div>
+            <van-image round width="2rem" height="2rem" style="vertical-align: middle;" :src="item.avatar" />&nbsp;
+            <span style="font-size: 1.05rem; vertical-align: middle;">{{ item.name }}</span>
+          </div>
+          <div style="color: #999999; margin-top: 1rem;">
+            {{ item.book_name }} ｜
+            <span style="color: #11D2B1;" @click="setLocalism">{{ item.localism_type }}</span>
+          </div>
+        </div>
+      </div>
+      <div class="book-intro" style="margin-top: 1rem;">
+        <!-- <div :id="'book-intro' + item.id" :class="{ 'van-multi-ellipsis--l3': isToggle }">{{ item.note }}</div> -->
+        <div v-if="hasToggle">
+          <div v-if="isToggle" class="book-toggle-icon" @click="onToggle(false)">
+            展开&nbsp;
+            <van-icon style="vertical-align: middle;" size="0.9rem" :name="icon_down" />
+          </div>
+          <div v-else class="book-toggle-icon" @click="onToggle(true)">
+            折叠&nbsp;
+            <van-icon style="vertical-align: middle;" size="0.9rem" :name="icon_up" />
+          </div>
+        </div>
+      </div>
+      <div v-if="status === 'PROCESS'">
+        <div v-if="item.status === 'DISABLE'" class="van-hairline--top" style="padding: 1rem; font-size: 0.85rem;">
+          <p style="color: #999999; margin-bottom: 0.25rem;">老师留言：</p>
+          <p>{{ item.check_note }}</p>
+        </div>
+      </div>
+      <div v-if="status === 'PENDING'" class="van-hairline--top book-handle">
+        <van-row>
+          <van-col offset="3" style="padding: 1rem;" @click="onRefuse()">
+            <div class="disagree-btn">
+              <van-icon name="close" />&nbsp;不通过
+            </div>
+          </van-col>
+          <van-col style="padding: 1rem;" @click="onPass('pass')">
+            <div class="agree-btn" style="">
+              <van-icon name="passed" />&nbsp;通过
+            </div>
+          </van-col>
+        </van-row>
+      </div>
+    </div>
+  </div>
+
+  <van-overlay :show="showNotice" z-index="1000">
+    <div class="wrapper" @click.stop>
+      <div class="block">
+        <div style="position: absolute; top: -2rem; right: 1rem; font-size: 1.5rem;">
+          <van-icon name="close" color="#FFFFFF" @click="closeNotice" />
+        </div>
+        <div class="van-hairline--bottom"
+          style="color: #222222; font-size: 1.25rem; font-weight: bold; text-align: center; padding-bottom: 1rem;">
+          作品不通过
+        </div>
+        <div>
+          <van-field v-model="message" rows="2" autosize label="" type="textarea" maxlength="200"
+            placeholder="请填写您对小朋友的温馨鼓励" show-word-limit @focus="focusInput" @blur="blurInput" />
+        </div>
+        <div style="margin-top: 3rem;">
+          <my-button type="primary" @on-click="handleAudit('disable')">确定</my-button>
+        </div>
+      </div>
+    </div>
+  </van-overlay>
+
+  <van-dialog v-model:show="show" title="温馨提示" show-cancel-button :confirmButtonColor="styleColor.baseColor"
+    @confirm="handleAudit('enable')" @cancel="onCancel">
+    <div style="padding: 1rem; text-align: center;">是否确认审核通过该视频 ？</div>
+  </van-dialog>
+
+  <localism-box :id="item.id" :title="localism_title" :show-localism="showLocalism"
+    :localism="item.localism_type" @on-close="closeLocalism" @on-submit="submitLocalism" />
+</template>
+
+<script setup>
+import { icon_up, icon_down, icon_refuse, icon_apply, icon_enable } from '@/utils/generateIcons'
+
+import MyButton from '@/components/MyButton/index.vue'
+import LocalismBox from '@/components/LocalismBox/index.vue'
+import { checkProdAPI } from '@/api/B/audit'
+
+import { ref, onMounted } from 'vue'
+import 'mui-player/dist/mui-player.min.css'
+import MuiPlayer from 'mui-player'
+import _ from 'lodash';
+import tools from '@/common/tool'
+import { styleColor } from '@/constant.js';
+
+import { Toast } from 'vant';
+import { DEFAULT_COVER } from '@/constant'
+
+const props = defineProps({
+  item: Object,
+  status: String,
+});
+const emit = defineEmits(['on-click']);
+
+// 判断是否显示简介的展开图标
+const hasToggle = ref(false); // 判断是否有展开文字，默认没有
+const isToggle = ref(true); // 判断展开状态，默认展开
+
+const onToggle = (v) => { // 展开/折叠
+  isToggle.value = v
+}
+
+onMounted(() => {
+  // setTimeout(() => {
+  //   // 判断是否显示简介的展开图标
+  //   hasToggle.value = tools.hasEllipsis(`book-intro${props.item.id}`);
+  // }, 500);
+})
+
+const localism_title = ref('')
+// 审核视频通过/不通过弹框
+const showNotice = ref(false);
+const show = ref(false);
+const message = ref('');
+const trigger_type = ref(''); // 点击入口判断，pass为点击通过按钮进入，空值为直接点击语言栏
+const onPass = (type) => { // 通过审核
+  showLocalism.value = true;
+  localism_title.value = '请确认您的方言类别是否正确'
+  trigger_type.value = type;
+}
+const onCancel = () => {
+  show.value = false;
+}
+
+const closeNotice = () => {
+  showNotice.value = false;
+}
+const onRefuse = () => { // 不通过审核
+  showNotice.value = true;
+}
+const handleAudit = async (status) => {
+  const { code } = await checkProdAPI({ prod_id: props.item.id, status, check_note: message.value, })
+  if (code === 1) {
+    Toast.success('操作成功');
+    message.value = '';
+    showNotice.value = false;
+    show.value = false;
+    emit('on-click', props.item.id);
+  }
+}
+
+const focusInput = () => {
+}
+const blurInput = () => {
+}
+
+// 修改语言种类
+const showLocalism = ref(false);
+const setLocalism = () => {
+  trigger_type.value = ''
+  localism_title.value = '设置方言类别'
+  showLocalism.value = true;
+}
+const closeLocalism = () => {
+  showLocalism.value = false;
+}
+const submitLocalism = (localism) => {
+  // 接口保存成功后，静态修改语言类型
+  props.item.localism_type = localism;
+  showLocalism.value = false;
+  // 通过按钮点击进入，需要走通过审核流程。
+  if (trigger_type.value) {
+    show.value = true;
+  }
+}
+</script>
+
+<script>
+export default {
+  data() {
+    return {
+      detail: {},
+      mp: '',
+    }
+  },
+  created() {
+  },
+  mounted() {
+    setTimeout(() => {
+      var mp = new MuiPlayer({
+        container: '#mui-player-' + this.item.id,
+        title: this.item.title,
+        src: this.item.video,
+        poster: this.item.cover ? this.item.cover : DEFAULT_COVER,
+        // poster: DEFAULT_COVER,
+        autoFit: false,
+        videoAttribute: [ // 声明启用同层播放, 不让会自动全屏播放
+          { attrKey: 'webkit-playsinline', attrValue: 'webkit-playsinline' },
+          { attrKey: 'playsinline', attrValue: 'playsinline' },
+          { attrKey: 'x5-video-player-type', attrValue: 'h5-page' },
+        ]
+      })
+      this.mp = mp;
+      this.detail = _.cloneDeep(this.item);
+      this.detail.showStatus = true;
+      var video = mp.video();
+      // 监听原生video事件，审核状态标签显示控制
+      var _this = this;
+      video && video.addEventListener('play', function (event) {
+        _this.detail.showStatus = false;
+      });
+      video && video.addEventListener('pause', function (event) {
+        _this.detail.showStatus = true;
+      });
+    }, 500);
+  },
+  methods: {
+  }
+}
+</script>
+
+<style lang="less" scoped>
+.video-wrapper {
+  margin: 1rem;
+  border-bottom-left-radius: 5px;
+  border-bottom-right-radius: 5px;
+  box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.13);
+
+  .status {
+    position: absolute;
+    top: 0;
+    right: 0;
+    z-index: 999;
+  }
+
+  .video-div {
+    border-top-left-radius: 5px;
+    border-top-right-radius: 5px;
+    height: 13rem !important;
+  }
+
+  .video-bar {
+    color: #713610;
+    padding: 1rem;
+    padding-bottom: 0.5rem;
+  }
+
+  .book-intro {
+    padding: 1rem;
+    padding-top: 0;
+
+    .book-post {
+      color: #222222;
+      font-size: 1.25rem;
+      font-weight: bold;
+    }
+
+    #book-intro {
+      color: #333333;
+      margin-top: 0.25rem;
+    }
+
+    .book-toggle-icon {
+      text-align: right;
+      color: #713610;
+      font-size: 1rem;
+      margin-top: 0.5rem;
+    }
+  }
+  .book-handle {
+    padding: 0 1rem;
+    .disagree-btn {
+      background: #B4B4B3; 
+      border-radius: 15px; 
+      color: #FFFFFF; 
+      padding: 0.25rem 0.8rem;
+    }
+    .agree-btn {
+      background: @base-color; 
+      border-radius: 15px; 
+      color: @base-font-color; 
+      padding: 0.25rem 1.5rem;
+    }
+  }
+}
+
+.wrapper {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 100%;
+  width: auto;
+  text-align: center;
+}
+
+.block {
+  width: 80%;
+  // height: 25rem;
+  background-color: #fff;
+  border-radius: 10px;
+  padding: 1rem;
+  position: relative;
+  margin-top: 1rem;
+  margin-bottom: 5rem;
+}
+</style>

+<template>
+  <div class="book-item van-hairline--bottom" @click="handle">
+    <van-row>
+      <van-col span="8">
+        <van-image width="7rem" height="7rem" :src="item.cover" fit="contain" style="text-align: center;">
+          <template #loading>
+            <van-loading type="spinner" size="20" />
+          </template>
+        </van-image>
+      </van-col>
+      <van-col class="wrapper" span="16">
+        <p class="title van-multi-ellipsis--l2">{{ item.name }}</p>
+        <div v-if="type === USER_ROLE.CLIENT" class="van-multi-ellipsis--l2 content">{{ item.note }}</div>
+        <div class="sub">
+          <van-icon :name="icon_video" />&nbsp;&nbsp;<span>{{ item.prod_num }}个作品</span>
+        </div>
+        <div v-if="type === USER_ROLE.BUSINESS" class="upload" @click="onUpload(item)">上传视频</div>
+      </van-col>
+    </van-row>
+  </div>
+
+  <van-overlay :show="show" z-index="9999">
+    <div class="overlay-wrapper" @click.stop>
+      <van-loading size="24px">跳转中...</van-loading>
+    </div>
+  </van-overlay>
+</template>
+
+<script setup>
+import icon_video from '@images/video.png'
+
+import { ref } from 'vue'
+import { onBeforeRouteLeave } from 'vue-router'
+
+import { JSJ_FORM_B, USER_ROLE } from '@/constant'
+
+const props = defineProps({
+  item: Object,
+  type: String,
+  user_id: Number
+})
+const emit = defineEmits(['on-click']);
+const handle = () => {
+  if (props.type === USER_ROLE.CLIENT) { // 类型是客户端时，才能查看
+    emit('on-click', props.item)
+  }
+}
+
+// 上传视频
+const show = ref(false);
+const onUpload = (v) => {
+  show.value = true;
+  // x_field_1是金数据表单传入的参数，老师上传的格式为：user_id-book_id-perf_id，perf_id 为 0
+  let str = `${props.user_id}-${v.id}-0`;
+  location.href = `${JSJ_FORM_B}?x_field_1=${str}`;
+  // BUG: 关闭loading临时处理
+  setTimeout(() => {
+    show.value = false;
+  }, 2000);
+}
+
+onBeforeRouteLeave(() => {
+})
+</script>
+
+<script>
+export default {
+  data() {
+    return {
+
+    }
+  },
+  mounted() {
+
+  },
+  methods: {
+
+  }
+}
+</script>
+
+<style lang="less" scoped>
+.book-item {
+  // margin: 1rem;
+  padding: 1rem;
+
+  .wrapper {
+    padding-left: 1rem;
+
+    .title {
+      font-size: 1.15rem;
+      color: #222222;
+      font-weight: bold;
+      margin: 0.5rem 0;
+    }
+
+    .content {
+      font-size: 0.85rem;
+      color: #999999;
+      margin: 0.5rem 0;
+      line-height: 1.75;
+    }
+
+    .sub {
+      font-size: 0.85rem;
+      color: #999999;
+      margin-top: 0.5rem;
+    }
+
+    .upload {
+      color: @base-font-color;
+      background-color: @base-color;
+      border-radius: 15px;
+      width: 4rem;
+      padding: 0.25rem 0.5rem;
+      font-size: 0.8rem;
+      text-align: center;
+      margin-top: 1rem;
+    }
+  }
+}
+.overlay-wrapper {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 100%;
+  width: auto;
+  text-align: center;
+}
+
+</style>

+<template>
+  <van-popup v-model:show="show" :close-on-click-overlay="false" position="bottom" :style="{ height: '40%' }">
+    <div class="van-hairline--bottom">
+      <van-row>
+        <van-col span="4" />
+        <van-col span="16" style="color: #222222; text-align: center; line-height: 3;">
+          <span v-if="type === 'comment'">留言</span>
+          <span v-else>回复</span>
+        </van-col>
+        <van-col span="4" @click="closeBtn">
+          <div style="padding: 1rem;">
+            <van-icon :name="icon_y" size="1.25rem" />
+          </div>
+        </van-col>
+      </van-row>
+    </div>
+    <div style="background-color: #F7F7F7; font-size: 0.9rem;">
+      <p style="color: #777777; padding: 1rem;">您的留言评论将会展示在页面中，请谨慎发表留言评论</p>
+      <van-row>
+        <van-col span="16">
+          <p v-if="type === 'comment'" style="padding: 1rem; padding-top: 0;">请写下你友善的留言：</p>
+          <p v-else style="padding: 1rem; padding-top: 0;">回复<span style="color: #0B3A72;">@{{ replayUser }}：</span></p>
+        </van-col>
+        <van-col span="8">
+          <div class="button-primary-comment" @click="submitComment">发送</div>
+        </van-col>
+      </van-row>
+    </div>
+    <div>
+      <van-cell-group inset>
+        <van-field v-model="message" rows="2" autosize label="" type="textarea" maxlength="200"
+          :placeholder="type === 'comment' ? '请输入留言内容' : '请输入回复内容'" show-word-limit @focus="focusInput"
+          @blur="blurInput" />
+      </van-cell-group>
+    </div>
+  </van-popup>
+</template>
+
+<script setup>
+import icon_y from '@images/y.png'
+import { Toast } from 'vant';
+
+import { ref, watch } from 'vue'
+
+const props = defineProps({
+  showPopup: Boolean,
+  type: String,
+  replayUser: String
+})
+
+const emit = defineEmits(['on-close', 'on-submit']);
+
+const show = ref(false)
+const message = ref('')
+
+const closeBtn = () => {
+  emit('on-close', false)
+  show.value = false;
+}
+
+const submitComment = () => {
+  if (message.value) {
+    show.value = false;
+    emit('on-submit', message.value);
+    message.value = '';
+  } else {
+    Toast.fail('留言不能为空');
+  }
+}
+
+// 监听弹出框
+watch(() => props.showPopup, (v) => {
+  show.value = v
+})
+
+// 优化处理输入框弹出遮挡问题
+let interval = ''
+const focusInput = () => {
+  window.addEventListener("resize", function () {
+    if (
+      document.activeElement.tagName === "INPUT" ||
+      document.activeElement.tagName === "TEXTAREA"
+    ) {
+      interval = window.setTimeout(function () {
+        if ("scrollIntoView" in document.activeElement) {
+          document.activeElement.scrollIntoView();
+        } else {
+          document.activeElement.scrollIntoViewIfNeeded();
+        }
+      }, 0);
+    }
+  });
+}
+const blurInput = () => {
+  clearInterval(interval);
+}
+</script>
+
+<style lang="less" scoped>
+.comment-wrapper {
+  color: #999999;
+  padding: 1rem;
+  line-height: 1.75;
+
+  .reply-wrapper {
+    background: #F7F7F7;
+    border-radius: 10px;
+    padding: 0.5rem;
+    margin-top: 0.5rem;
+    color: #0B3A72;
+
+    .content {
+      color: #222222;
+    }
+  }
+}
+
+.button-primary-comment {
+  width: 5rem;
+  height: auto;
+  text-align: center;
+  padding: 0.2rem;
+  // margin: 0.25rem;
+  font-size: 0.9rem;
+  background: @base-color;
+  border-radius: 24px;
+  border: 1px solid @base-color;
+  color: @base-font-color;
+  font-weight: bold;
+  margin-left: 1rem;
+  margin-bottom: 1rem;
+}
+.text {
+  text-align: center;
+  padding: 0.7rem;
+  margin: 0.8rem;
+  font-size: 1rem;
+  font-weight: bold;
+  border-radius: 24px;
+  // border: 1px solid F7F7F7;
+  color: #713610;
+  background-color: @base-color;
+  box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.06);
+}
+</style>

+<template>
+  <van-popup v-model:show="show" :close-on-click-overlay="false" round position="bottom" :style="{ height: '70%' }">
+    <div style="position: relative;">
+      <div class="van-hairline--bottom"
+        style="position: fixed; width: 100%; background-color: white; border-radius: 10px; z-index: 999;">
+        <van-row>
+          <van-col span="4" @click="onReload">
+            <div style="padding: 1rem; text-align: center;">
+              <!-- <van-icon :name="icon_x" size="1.25rem" /> -->
+            </div>
+          </van-col>
+          <van-col span="16" style="color: #222222; text-align: center; line-height: 3;">
+            <span>{{ listTotal }}条回复</span>
+          </van-col>
+          <van-col span="4" @click="closeBtn">
+            <div style="padding: 1rem;">
+              <van-icon :name="icon_y" size="1.25rem" />
+            </div>
+          </van-col>
+        </van-row>
+      </div>
+      <div style="height: 4rem;"></div>
+      <van-list v-model:loading="loading" :finished="finished" :finished-text="finishedTextStatus ? '没有更多了' : ''"
+        @load="onLoad" :immediate-check="false">
+        <template v-for="(item, key) in replyList" :key="key">
+          <div class="comment-wrapper">
+            <van-row style="font-size: 0.9rem;">
+              <van-col span="4">
+                <van-image round width="3rem" height="3rem" :src="item.avatar ? item.avatar : icon_avatar" />
+              </van-col>
+              <van-col span="14">
+                <p>{{ item.name }}</p>
+                <p>{{ item.kg_name }}</p>
+              </van-col>
+              <van-col span="6" style="text-align: right;">
+                <p @click="setComment(item, 'reply')" style="color: #333333;">回复</p>
+                <p>{{ item.comment_time }}</p>
+              </van-col>
+            </van-row>
+            <van-row>
+              <van-col offset="4">
+                <span style="color: #222222;">{{ item.note }}</span>
+              </van-col>
+            </van-row>
+          </div>
+        </template>
+      </van-list>
+      <van-empty v-if="emptyStatus" class="custom-image" :image="no_image" description="暂无回复" />
+    </div>
+    <comment-box :showPopup="showCommentBoxPopup" :type="commentType" :replayUser="replayUser"
+      @on-submit="submitCommentBox" @on-close="closeCommentBox"></comment-box>
+  </van-popup>
+
+  <!-- 写评论时，如果没有实名认证提示弹框 -->
+  <notice-overlay-module :show="showNotice" :type="userInfo.can_upload" @on-submit="onSubmit" @on-close="onClose" />
+</template>
+
+<script setup>
+import CommentBox from '@/components/CommentBox/index.vue'
+import NoticeOverlayModule from '@/components/NoticeOverlayModule/index.vue'
+import no_image from '@images/que-shuju@2x.png'
+import icon_y from '@images/y.png'
+import icon_avatar from '@images/que-touxiang@2x.png'
+
+import { useRoute, useRouter } from 'vue-router'
+
+import axios from '@/utils/axios';
+import _ from 'lodash'
+import { Toast } from 'vant';
+
+import { ref, watch } from 'vue'
+// 获取是否实名认证
+import { useDefaultPerf } from '@/composables';
+import { USER_STATUS } from '@/constant'
+import { useGo } from '@/hooks/useGo'
+const go = useGo();
+
+const $router = useRouter();
+const $route = useRoute();
+
+const { userInfo } = useDefaultPerf($route.query.book_id);
+
+const props = defineProps({
+  showPopup: Boolean,
+  data: Object
+})
+
+const emit = defineEmits(['on-close']);
+
+/******** 留言框相关操作 START *******/
+// 回复评论控件
+const showCommentBoxPopup = ref(false);
+const commentType = ref('comment'); // 类型 comment 为评论/类型 reply 为回复
+
+/**
+ * 回复/评论 功能
+ * @param {*} v 单行评论数据
+ * @param {*} type 类型 comment 为评论/类型 reply 为回复
+ */
+const commentId = ref('')
+const replayUser = ref('')
+const setComment = (v, type) => { //
+  if (userInfo.value.can_upload === USER_STATUS.PASS) {
+    showCommentBoxPopup.value = true;
+    commentType.value = type;
+    replayUser.value = v.name;
+    commentId.value = props.data.id;
+  } else {
+    closeBtn();
+    showNotice.value = true;
+  }
+}
+
+/**
+ * 提交留言回调
+ * @param {*} note 留言内容
+ */
+const submitCommentBox = (note) => {
+  let url = '';
+  let data = {}
+  // 判断是留言还是回复 动态调整接口名称
+  if (commentType.value === 'comment') {
+    url = 'add_comment';
+    data = {
+      prod_id: $route.query.prod_id,
+      note
+    }
+  } else {
+    url = 'add_reply';
+    data = {
+      comment_id: commentId.value,
+      note
+    }
+  }
+  axios.post(`/srv/?a=${url}`, data)
+    .then(res => {
+      showCommentBoxPopup.value = false;
+      if (res.data.code === 1) {
+        Toast.success('发布成功')
+        onReload()
+      } else {
+        console.warn(res);
+        if (!res.data.show) return false;
+        Toast({
+          icon: 'close',
+          message: res.data.msg
+        });
+      }
+    })
+    .catch(err => {
+      console.error(err);
+    })
+}
+
+const closeCommentBox = (v) => { // 关闭留言框
+  showCommentBoxPopup.value = v;
+}
+/******** 留言框相关操作 START *******/
+
+const showNotice = ref(false)
+const onClose = () => { // 关闭提示框回调
+  showNotice.value = false;
+}
+// 跳转个人中心
+const onSubmit = () => {
+  setTimeout(() => {
+    showNotice.value = false;
+  }, 1000);
+  if (userInfo.value.can_upload === USER_STATUS.NON_VERIFIED) { // 未实名认证
+    go('/me/verifyUser', { back_url: $route.fullPath })
+  } else if (userInfo.value.can_upload === USER_STATUS.NON_DEFAULT_CHILD) { // 没有默认儿童
+    go('/me/handleUser', { perf_id: '', kg_id: '', kg_name: '', type: 'ADD', back_url: $route.fullPath })
+  }
+}
+
+const show = ref(false);
+const listTotal = ref(0)
+const replyList = ref([])
+const loading = ref(false)
+const finished = ref(false)
+const limit = ref(10)
+const offset = ref(0)
+
+// 因为不能让空图标提前出来的写法
+const finishedTextStatus = ref(false);
+const emptyStatus = ref(false);
+
+const onLoad = () => {
+  // 异步更新数据
+  axios.get('/srv/?a=reply_list', {
+    params: {
+      comment_id: props.data.id,
+      limit: limit.value,
+      offset: offset.value
+    }
+  })
+    .then(res => {
+      if (res.data.code === 1) {
+        listTotal.value = res.data.data.total;
+        replyList.value = _.concat(replyList.value, res.data.data.replylist);
+        replyList.value = _.uniqBy(replyList.value, 'id');
+        offset.value = replyList.value.length;
+        loading.value = false;
+        // 数据全部加载完成
+        if (!res.data.data.replylist.length) {
+          // 加载状态结束
+          finished.value = true;
+        }
+        if (!replyList.value.length) {
+          finishedTextStatus.value = false;
+          emptyStatus.value = true;
+        } else {
+          emptyStatus.value = false;
+        }
+      } else {
+        console.warn(res);
+        if (!res.data.show) return false;
+        Toast({
+          icon: 'close',
+          message: res.data.msg
+        });
+      }
+    })
+    .catch(err => {
+      console.error(err);
+    })
+}
+const onReload = () => {
+  replyList.value = [];
+  offset.value = 0;
+  onLoad();
+}
+// const onClose = () => {
+//   show.value = false;
+// }
+
+// 监听弹出框
+watch(() => props.showPopup, (v) => {
+  show.value = v;
+  onReload()
+});
+
+
+const closeBtn = () => {
+  emit('on-close', { comment_id: props.data.id, total: listTotal.value })
+  show.value = false;
+}
+</script>
+
+<style lang="less" scoped>
+.comment-wrapper {
+  color: #999999;
+  padding: 1rem;
+  line-height: 1.75;
+
+  .reply-wrapper {
+    background: #F7F7F7;
+    border-radius: 10px;
+    padding: 0.5rem;
+    margin-top: 0.5rem;
+    color: #0B3A72;
+
+    .content {
+      color: #222222;
+    }
+  }
+}
+</style>

+<!--
+ * @Author: hookehuyr hookehuyr@gmail.com
+ * @Date: 2022-05-31 18:32:38
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-07-01 17:58:30
+ * @FilePath: /tswj/src/components/DonateBar/index.vue
+ * @Description: 爱心助力底部固定栏
+-->
+<template>
+  <div class="fix-btn">
+    <div class="text" @click="showDonate=true">
+      <slot />
+    </div>
+  </div>
+  <donate-flower
+    :show-popup="showDonate" 
+    :item="donateInfo" 
+    @on-close="showDonate=false"
+  />
+</template>
+
+<script setup>
+import { ref, onMounted } from 'vue'
+import { DonateFlower } from '@/utils/generateModules'
+import { prepareDonateAPI } from '@/api/C/donate.js'
+
+const props = defineProps({
+  perfId: Number,
+  kgId: {
+    type: String,
+    default: ''
+  }
+})
+
+const donateInfo = ref({})
+const showDonate = ref(false);
+onMounted(async () => {
+  const { data } = await prepareDonateAPI({ perf_id: props.perfId, kg_id: props.kgId });
+  donateInfo.value = data;
+})
+
+</script>
+
+<style lang="less" scoped>
+.fix-btn {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  background-color: white;
+  box-shadow: 0px -2px 4px 0px rgba(0, 0, 0, 0.07);
+  .text {
+    text-align: center;
+    padding: 0.7rem;
+    margin: 1.2rem;
+    font-size: 1rem;
+    font-weight: bold;
+    border-radius: 24px;
+    // border: 1px solid F7F7F7;
+    color: @base-font-color;
+    background-color: @base-color;
+    box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.06);
+  }
+}
+</style>

+<template>
+  <van-popup v-model:show="show" :close-on-click-overlay="false" round position="bottom"
+    :style="{ height: popupHeight }">
+    <div class="donate-wrapper">
+      <div class="donate-header">
+        <van-row>
+          <van-col>
+            <div class="donate-book">
+              <van-image width="80" height="80" :src="item.avatar ? item.avatar : icon_avatar" />
+            </div>
+          </van-col>
+          <van-col>
+            <div class="donate-detail">
+              <p class="text">{{ item.name }}</p>
+              <p class="price">¥{{ item.price }}</p>
+            </div>
+          </van-col>
+        </van-row>
+      </div>
+      <div class="donate-name">
+        <van-row>
+          <van-col span="4" style="line-height: 2;">捐赠人<span style="color: red;">*</span></van-col>
+          <van-col class="donate-input" span="18">
+            <input v-model="item.perf_name" type="text" style="border: 0; padding: 0.25rem;" />
+          </van-col>
+        </van-row>
+      </div>
+      <div class="van-hairline--bottom donate-tips">
+        <p style="color: #999999;">
+          <van-icon name="warning-o" />&nbsp;&nbsp;您捐献的书籍将用于多民族语言发展项目
+        </p>
+      </div>
+      <div class="donate-number">
+        <van-row>
+          <van-col span="12"> 数量 </van-col>
+          <van-col span="12" style="text-align: right;">
+            <van-stepper v-model="donate_number" min="1" max="100" integer input-width="40px" button-size="32px" />
+          </van-col>
+        </van-row>
+      </div>
+      <div class="donate-handle">
+        <div class="donate-cancel">
+          <my-button type="plain" @on-click="cancelDonate">取消</my-button>
+        </div>
+        <div class="donate-imd">
+          <my-button type="primary" @on-click="donateBook">立即捐赠</my-button>
+        </div>
+      </div>
+    </div>
+  </van-popup>
+</template>
+
+<script setup>
+import Cookies from 'js-cookie'
+import icon_avatar from '@images/que-touxiang@2x.png'
+
+import MyButton from '@/components/MyButton/index.vue'
+import { ref, reactive, onMounted, watch, nextTick } from 'vue'
+import { useRoute, useRouter } from 'vue-router'
+import axios from '@/utils/axios';
+import $ from 'jquery'
+import { Toast, Dialog } from 'vant';
+const $route = useRoute();
+const $router = useRouter();
+
+const props = defineProps({
+  item: Object,
+  showPopup: Boolean
+})
+
+const emit = defineEmits(['on-close']);
+
+let donate_number = ref(1)
+const donateBook = () => {
+  // 爱心捐书接口
+  axios.post('/srv/?a=add_donate', {
+    book_id: props.item.book_id,
+    qty: donate_number.value,
+    donate_name: props.item.perf_name,
+  })
+    .then(res => {
+      if (res.data.code === 1) {
+        console.warn(res.data.data);
+        closeBtn();
+
+        // 交易成功跳转回调页面
+        // TEMP: 临时传参 donate_id
+        $router.push({
+          path: '/client/wechatpayCallback',
+          query: {
+            donate_id: res.data.data.id
+          }
+        })
+      } else {
+        console.warn(res);
+        if (!res.data.show) return false;
+        Toast({
+          icon: 'close',
+          message: res.data.msg
+        });
+      }
+    })
+    .catch(err => {
+      console.error(err);
+    })
+}
+
+const show = ref(false);
+let popupHeight = ref('60%');
+
+watch(() => props.showPopup, (v) => {
+  // 如果没有默认儿童需要用户确认一次
+  if (v && !props.item.perf_id) {
+    Dialog.confirm({
+      title: '温馨提示',
+      message: '默认儿童为空, 是否继续捐书!',
+      confirmButtonColor: '#713610'
+    })
+      .then(() => {
+        show.value = v;
+        // DOM调整后，把弹出框高度设定到适合高度，配合不同分辨率效果
+        nextTick(() => {
+          let height = $('.donate-wrapper').height();
+          popupHeight.value = height + 10 + 'px';
+        })
+      })
+      .catch(() => {
+        // 取消按钮回调
+        closeBtn();
+      });
+    return false;
+  }
+  show.value = v;
+  // DOM调整后，把弹出框高度设定到适合高度，配合不同分辨率效果
+  nextTick(() => {
+    let height = $('.donate-wrapper').height();
+    popupHeight.value = height + 10 + 'px';
+  })
+})
+
+const closeBtn = () => {
+  emit('on-close', false)
+  show.value = false;
+}
+
+const cancelDonate = () => {
+  closeBtn();
+}
+
+onMounted(() => {
+
+})
+</script>
+
+<script>
+import mixin from 'common/mixin';
+
+export default {
+  mixins: [mixin.init],
+  data() {
+    return {
+    }
+  },
+  mounted() {
+  },
+  methods: {
+  }
+}
+</script>
+
+<style lang="less" scoped>
+.donate-wrapper {
+  .donate-header {
+    padding: 1rem;
+
+    .donate-book {
+      border: 1px solid #ECECEC;
+      border-radius: 5px;
+      padding: 0.1rem;
+    }
+
+    .donate-detail {
+      font-size: 1.25rem;
+      padding: 1rem;
+
+      .text {
+        color: #292929;
+        font-weight: bold;
+      }
+
+      .price {
+        color: #EE332E;
+      }
+    }
+  }
+
+  .donate-name {
+    padding: 1rem;
+
+    .donate-input {
+      border: 1px solid #B9B9B9;
+      border-radius: 5px;
+      padding: 0.2rem;
+      margin-left: 1rem;
+    }
+  }
+
+  .donate-tips {
+    padding: 1rem;
+    padding-top: 0;
+  }
+
+  .donate-number {
+    padding: 1rem;
+  }
+
+  .donate-handle {
+    overflow: auto;
+
+    .donate-cancel {
+      width: 49%;
+      float: left;
+    }
+
+    .donate-imd {
+      width: 50%;
+      float: left;
+    }
+  }
+}
+
+.button {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  flex: 1;
+  padding: 0 0.5rem;
+}
+</style>

+<template>
+  <div class="donate-certificate">
+    <div class="header-bg">
+      <van-image width="100" height="100" fit="contain" :src="icon_cert" style="margin-top: 15vh;" />
+    </div>
+    <div class="title">
+      <van-row align="center">
+        <van-col>
+          <span style="font-size: 0.8rem; color: #272727;">亲爱的捐赠者</span>
+        </van-col>
+        <van-col>
+          <div style="color: #713610; padding: 1rem;" class="bg-gradient">{{ item.name }}</div>
+        </van-col>
+        <van-col>：</van-col>
+      </van-row>
+    </div>
+    <div class="content">
+      感谢您对“童声无界”多民族儿童共读活动的关注及捐赠。上海市儿童基金会已收到您的捐款。您的爱心将用于边疆地区少数民族儿童阅读能力的培育。共读一本书传递一份爱，初心为爱童声无界。感谢您对公益事业的支持。
+    </div>
+    <div class="price">
+      <div>爱心捐赠</div>
+      <div>{{ item.amt }}&nbsp;元</div>
+    </div>
+    <div class="organizer">
+      <div class="wrapper">
+        <p>上海市儿童基金会</p>
+        <p>上海初心为爱公益基金会</p>
+        <div style="position: absolute; width: 50%; height: 100%; top: 0; left: 0;">
+          <van-image height="100%" fit="contain" :src="icon_stamp01" />
+        </div>
+        <div style="position: absolute; width: 50%; height: 100%; top: 0; right: 0;">
+          <van-image height="100%" fit="contain" :src="icon_stamp02" />
+        </div>
+      </div>
+    </div>
+    <!-- <div class="date">{{ item.donate_date }}</div> -->
+    <div class="text">
+      证书编号：{{ item.cert_code }}
+    </div>
+    <div style="height: 3rem;" />
+    <div class="wrapper-border">
+      <div class="top-bg">
+        <van-image :src="donate_top" style="width: 100%; height: 10rem;" />
+      </div>
+      <div class="center-bg">
+        <img :src="donate_center" :style="styleObject">
+      </div>
+      <div class="bottom-bg">
+        <van-image :src="donate_bottom" style="width: 100%;" />
+      </div>
+      <div style="height: 3rem;" />
+    </div>
+  </div>
+</template>
+
+<script setup>
+import icon_cert from '@images/zhengshu@2x.png'
+import icon_stamp01 from '@images/stamp01.png'
+import icon_stamp02 from '@images/stamp02.png'
+import donate_top from '@images/donate_top.png'
+import donate_center from '@images/donate_center.png'
+import donate_bottom from '@images/donate_bottom.png'
+import $ from 'jquery'
+
+</script>
+
+<script>
+import mixin from 'common/mixin';
+
+export default {
+  mixins: [mixin.init],
+  props: ['item'],
+  data() {
+    return {
+      name: '',
+      price: '',
+      datetime: '',
+      styleObject: {}
+    }
+  },
+  mounted() {
+    // 动态计算背景图高度
+    const wrapper_height = $('.donate-certificate').height()
+    const top_height = $('.top-bg').height()
+    const bottom_height = $('.bottom-bg').height()
+    const center_height = (wrapper_height - top_height - bottom_height).toFixed();
+    this.styleObject = {
+      width: '100%',
+      height: center_height + 'px'
+    }
+  },
+  methods: {
+
+  }
+}
+</script>
+
+<style lang="less" scoped>
+.donate-certificate {
+  background-image: url('http://gyzs.onwall.cn/zhengshu-banner.png');
+  background-color: white;
+  background-repeat: no-repeat;
+  background-size: contain;
+  width: 100%;
+  position: relative;
+  border-radius: 10px;
+  // height: 85vh;
+  box-shadow: 0px 0px 7px 0px rgba(3, 155, 178, 0.14);
+  .header-bg {
+    text-align: center;
+  }
+
+  .title {
+    padding: 0 2rem;
+  }
+
+  .content {
+    font-size: 0.85rem;
+    padding: 2rem;
+    line-height: 1.75;
+    text-indent: 2rem;
+  }
+
+  .price {
+    margin-left: 4rem;
+
+    div:first-child {
+      display: inline-block;
+      font-size: 0.85rem;
+      vertical-align: middle;
+      margin-right: 0.5rem;
+    }
+
+    div:last-child {
+      display: inline-block;
+      font-size: 1.25rem;
+      color: red;
+      vertical-align: middle;
+    }
+  }
+
+  .organizer {
+    margin: 1rem;
+    overflow: hidden;
+    margin-right: 2rem;
+    padding-bottom: 1rem;
+    .wrapper {
+      float: right;
+      font-size: 0.8rem;
+      text-align: center;
+      line-height: 2;
+      position: relative;
+      color: #000;
+      padding: 0.5rem 0;
+    }
+  }
+
+  .date {
+    color: #272727;
+    font-size: 0.85rem;
+    text-align: right;
+    padding-right: 2rem;
+  }
+  .text {
+    color: #713610;
+    padding-left: 10%;
+    font-size: 0.9rem;
+    position: relative;
+    bottom: 1rem;
+    margin-top: 1rem;
+  }
+  .wrapper-border {
+    position: absolute;
+    // border: 0.5px solid #11D2B1;
+    height: 95%;
+    top: 0;
+    width: 93%;
+    margin: 3%;
+    // border-radius: 1.5rem;
+    // overflow: hidden;
+    .top-bg {
+      margin: 0;
+        padding: 0;
+        font-size: 0;
+        position: absolute;
+        top: 0;
+        width: 100%;
+    }
+    .center-bg {
+      margin: 0;
+        padding: 0;
+        font-size: 0;
+        position: absolute;
+        top: 10%;
+        width: 100%;
+    }
+    .bottom-bg {
+      margin: 0;
+        padding: 0;
+        font-size: 0;
+        position: absolute;
+        bottom: 0;
+        width: 100%;
+    }
+  }
+  .bg-gradient {
+    // 文字下划线
+    background: linear-gradient(#EAEAEA, #EAEAEA) no-repeat;
+    /*调整下划线的宽度占百分之百  高度是3px */
+    // background-size: 100% 3px;
+    /* 调整下划线的起始位置 左侧是0 上边是1.15em */
+    // background-position: 0 1rem;
+    background-size: 100% 1px;
+    background-position: 0 2.5rem;
+  }
+}
+</style>

+/*
+ * @Author: hookehuyr hookehuyr@gmail.com
+ * @Date: 2022-06-02 11:23:16
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-09 17:05:08
+ * @FilePath: /tswj/src/components/DonateFlower/agreement.js
+ * @Description: 
+ */
+const str = '上海XX益基金会'
+const html = `
+  <div style="text-align: center; font-weight: bold; margin-bottom: 1rem; font-size: 1.25rem; color: #11D2B1;">
+    捐赠协议
+  </div>
+  <div style="text-align: justify; color: #231815; font-size: 1.05rem; line-height: 1.5;">
+    感谢您对中国公益慈善事业的关心与支持!${str}面向所有具有公开募捐资质的慈善组织提供服务。${str}始终秉持着最高的合规性要求，因此，只要您点击“同意”或“接受”，您的行为就已表示您无条件接受并遵守“本网络捐赠条款和条件”以及${str}不时公布的“其他公开规则”。
+  </div>
+  <div style="margin: 1rem 0;">
+    <div style="margin-bottom: 0.5rem;">1.资格规定</div>
+    <div style="line-height: 1.75;">
+      您声明您是符合中华人民共和国法律规定的具有完全民事行为能力的自然人。
+    </div>
+  </div>
+  <div style="margin: 1rem 0;">
+    <div style="margin-bottom: 0.5rem;">2.捐赠财产</div>
+    <div style="margin-bottom: 0.5rem;line-height: 1.75;">您同意依照《公益事业捐赠法》的相关规定，自愿无偿地通过网络向${str}平台上具有公开募捐资质的慈善组织捐赠财产用于公益事业。</div>
+    <div style="margin-bottom: 0.5rem;line-height: 1.75;">您声明您用于捐赠的财产是您合法持有并有权处分的财产。</div>
+    <div style="margin-bottom: 0.5rem;line-height: 1.75;">您声明您已经了解《公益事业捐赠法》、《合同法》中关干财产捐赠的相关规定，明确同意不会撤销或部分撤销对${str}平台上具有公开募捐资质的慈善组织作出的捐赠。</div>
+    <div style="margin-bottom: 0.5rem;line-height: 1.75;">您声明您知晓并同意，${str}平台上具有公开募捐资质的慈善组织可以为公益事业之目的合理审慎地自主决定捐赠财产的实际受助对象、以及具体使用的领域、金额、时间。</div>
+  </div>
+  <div style="margin: 1rem 0;">
+    <div style="margin-bottom: 0.5rem;">3.争议解决和法律适用</div>
+    <div style="margin-bottom: 0.5rem;line-height: 1.75;">除非另有明确约定，否则，本网络捐款条款和条件适用中华人民共和国法律，并排除一切冲突法原则的适用。</div>
+    <div style="line-height: 1.75;">
+    如果各方无法通过协商解决争端，您和${str}平台上具有公开募捐资质的慈善组织，也即善款接收方，均有权向有管辖权的人民法院提起诉讼以解决争议，由此产生的诉讼费、律师费、公证费等由败诉方承担。<br/>
+    </div>
+  </div>
+  <div style="margin: 1rem 0;">
+    <div style="margin-bottom: 0.5rem;">4.其他</div>
+    本网络捐款条款和条件构成您与${str}之间就本网络捐款条款和条件约定事项的完整和唯一的协议，并取代就本网络捐款条款和条件事项达成的口头或书面协议。如本网络捐款条款和条件内容与${str}其他公开规则内容相冲突，则以本网络捐款条款和条件内容为准。
+  </div>
+  <div style="margin: 1rem 0; line-height: 1.75;">
+  如果本网络捐款条款和条件条文因任何原因被认定是违法、无效或者丧失执行力，该条文将从本网络捐款条款和条件中删除，而其余条款的效力则不受影响。<br/>
+  </div>
+  <div style="margin: 1rem 0; line-height: 1.75;">
+  ${str}未能执行本网络捐款条款和条件中的任何条款的行为不应被解释为放弃当前或未来对该条款的权利，也不会影响${str}日后要求执行该条款的权利。${str}明确提出放弃本网络捐款条款和条件中的规定、条件或要求不构成放弃追究未来与此规定、条件或要求相一致的责任。
+  </div>
+  </div>
+  <div style="height: 5rem;"></div>
+`
+
+export default html;

+<!--
+ * @Date: 2022-06-17 17:17:13
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-17 20:39:34
+ * @FilePath: /tswj/src/components/DonateFlower/agreement.vue
+ * @Description: 文件描述
+-->
+<template>
+  <div class="agreement-page">
+    <div class="title">捐赠协议</div>
+    <div class="sub">
+      感谢您对中国公益慈善事业的关心与支持!上海市儿童基金会面向所有具有公开募捐资质的慈善组织提供服务。上海市儿童基金会始终秉持着最高的合规性要求，因此，只要您点击“同意”或“接受”，您的行为就已表示您无条件接受并遵守“本网络捐赠条款和条件”以及上海市儿童基金会不时公布的“其他公开规则”。
+    </div>
+    <div class="content">
+      <div class="title-content">1. 资格规定</div>
+      <div class="text-content">
+        您声明您是符合中华人民共和国法律规定的具有完全民事行为能力的自然人。
+      </div>
+    </div>
+    <div class="content">
+      <div class="title-content">2. 捐赠财产</div>
+      <div class="text-content">您同意依照《公益事业捐赠法》的相关规定，自愿无偿地通过网络向上海市儿童基金会平台上具有公开募捐资质的慈善组织捐赠财产用于公益事业。</div>
+      <div class="text-content">您声明您用于捐赠的财产是您合法持有并有权处分的财产。</div>
+      <div class="text-content">
+        您声明您已经了解《公益事业捐赠法》、《民法典》中关干财产捐赠的相关规定，明确同意不会撤销或部分撤销对上海市儿童基金会平台上具有公开募捐资质的慈善组织作出的捐赠。
+      </div>
+      <div class="text-content">
+        您声明您知晓并同意，上海市儿童基金会平台上具有公开募捐资质的慈善组织可以为公益事业之目的合理审慎地自主决定捐赠财产的实际受助对象、以及具体使用的领域、金额、时间。
+      </div>
+    </div>
+    <div class="content">
+      <div class="title-content">3. 争议解决和法律适用</div>
+      <div class="text-content">除非另有明确约定，否则，本网络捐款条款和条件适用中华人民共和国法律，并排除一切冲突法原则的适用。</div>
+      <div class="text-content">
+        如果各方无法通过协商解决争端，您和上海市儿童基金会平台上具有公开募捐资质的慈善组织，也即善款接收方，均有权向有管辖权的人民法院提起诉讼以解决争议，由此产生的诉讼费、律师费、公证费等由败诉方承担。
+      </div>
+    </div>
+    <div class="content">
+      <div class="title-content">4. 其他</div>
+      <div class="text-content">
+        本网络捐款条款和条件构成您与上海市儿童基金会之间就本网络捐款条款和条件约定事项的完整和唯一的协议，并取代就本网络捐款条款和条件事项达成的口头或书面协议。如本网络捐款条款和条件内容与上海市儿童基金会其他公开规则内容相冲突，则以本网络捐款条款和条件内容为准。
+      </div>
+    </div>
+    <div class="content">
+      如果本网络捐款条款和条件条文因任何原因被认定是违法、无效或者丧失执行力，该条文将从本网络捐款条款和条件中删除，而其余条款的效力则不受影响。
+    </div>
+    <div class="content">
+      上海市儿童基金会未能执行本网络捐款条款和条件中的任何条款的行为不应被解释为放弃当前或未来对该条款的权利，也不会影响上海市儿童基金会日后要求执行该条款的权利。上海市儿童基金会明确提出放弃本网络捐款条款和条件中的规定、条件或要求不构成放弃追究未来与此规定、条件或要求相一致的责任。
+    </div>
+    <div style="height: 5rem;" />
+  </div>
+</template>
+
+<script setup>
+import { ref } from 'vue'
+import { useRoute, useRouter } from 'vue-router'
+
+import { Cookies, $, _, axios, storeToRefs, mainStore, Toast, useTitle } from '@/utils/generatePackage.js'
+//import { } from '@/utils/generateModules.js'
+//import { } from '@/utils/generateIcons.js'
+//import { } from '@/composables'
+const $route = useRoute();
+const $router = useRouter();
+useTitle($route.meta.title);
+
+</script>
+
+<style lang="less" scoped>
+.agreement-page {
+  padding: 1rem;
+  .title {
+    text-align: center;
+      font-weight: bold;
+      margin-bottom: 1rem;
+      font-size: 1.25rem;
+      color: #11D2B1;
+  }
+  .sub {
+  text-align: justify;
+    color: #231815;
+    font-size: 1.05rem;
+    line-height: 1.5;
+  }
+  .content {
+    margin: 1rem 0;
+    line-height: 1.75;
+    .title-content {
+      margin-bottom: 0.5rem;
+    }
+    .text-content {
+      margin-bottom: 0.5rem;
+      line-height: 1.75;
+    }
+  }
+}
+</style>

+<!--
+ * @Author: hookehuyr hookehuyr@gmail.com
+ * @Date: 2022-05-31 22:09:58
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2023-02-08 13:45:09
+ * @FilePath: /tswj/src/components/DonateFlower/index.vue
+ * @Description: 捐花组件
+-->
+<template>
+  <van-popup v-model:show="show" :close-on-click-overlay="false" round position="bottom"
+    :style="{ height: popupHeight, zIndex: 3000 }">
+    <div class="donate-wrapper">
+      <div class="donate-title">
+        您所有捐助的爱心
+        <van-icon :name="icon_flower" />
+        都将用于多民族语言发展
+      </div>
+      <div class="shortcut-choose-wrapper">
+        <van-row gutter="10">
+          <van-col v-for="(v, index) in defaultOptions" :key="index" span="8">
+            <div :class="['base-item', donate_number === +index ? 'checked-item' : 'uncheck-item']"
+              @click="selectDonate(+index)">
+              {{ v }}
+            </div>
+          </van-col>
+        </van-row>
+      </div>
+      <!-- <div style="background: #FFFFFF; border-radius: 3px; border: 1px solid #713610; padding: 0.5rem 1rem; margin: 0.5rem 1rem; text-align: center;">更多花花</div> -->
+      <div class="donate-number">
+        <van-row v-if="more_donate">
+          <van-col span="18" style="text-align: right;">
+            <van-field v-model="donate_number" style="border: 1px solid #11D2B1; padding: 0.4rem 1rem;" type="digit"
+              input-align="center" label="" placeholder="请输入花花数量" />
+          </van-col>
+          <van-col span="6" style="line-height: 2.5;">&nbsp;朵花花</van-col>
+        </van-row>
+        <div v-else style="border: 1px solid #11D2B1; padding: 0.4rem 1rem;" @click="more_donate = true">更多花花</div>
+      </div>
+      <div v-if="item.kg_id" class="donate-name">
+        <van-row>
+          <van-col span="4" style="line-height: 2;">幼儿园</van-col>
+          <van-col span="18">
+            <div class="donate-text">{{ item.kg_name }}</div>
+          </van-col>
+        </van-row>
+      </div>
+      <div v-if="item.perf_id" class="donate-name">
+        <van-row>
+          <van-col span="4" style="line-height: 2;">助力人</van-col>
+          <van-col span="18">
+            <div class="donate-text">{{ item.perf_name }}</div>
+          </van-col>
+        </van-row>
+      </div>
+      <div class="donate-name">
+        <van-row>
+          <van-col span="4" style="line-height: 2;">捐赠人<span style="color: red;">*</span></van-col>
+          <van-col class="donate-input" span="18">
+            <input v-model="item.donate_name" type="text" style="border: 0; padding: 0.25rem;">
+          </van-col>
+        </van-row>
+      </div>
+      <van-row class="agree-wrapper">
+        <van-col span="12" offset="8">
+          <div class="agree-content">
+            <div class="btn">
+              <van-checkbox v-model="agreed" checked-color="#ee0a24">同意&nbsp;</van-checkbox>
+            </div>
+            <div class="text">
+              <span @click="showDA=true">捐赠协议</span>
+            </div>
+          </div>
+        </van-col>
+      </van-row>
+
+      <div class="donate-handle">
+        <div class="donate-cancel">
+          <my-button type="plain" @on-click="cancelDonate">取消</my-button>
+        </div>
+        <div class="donate-imd">
+          <my-button type="primary" @on-click="donateFlower">确定</my-button>
+        </div>
+      </div>
+    </div>
+  </van-popup>
+  <div class="popup-wrapper">
+    <van-popup v-model:show="showDA" position="bottom" :style="{ height: '100%', zIndex: 4000 }">
+      <agreement />
+      <div class="bottom-btn" @click="showDA=false">
+        <div class="text">关闭</div>
+      </div>
+    </van-popup>
+  </div>
+</template>
+
+<script setup>
+import { icon_flower } from '@/utils/generateIcons'
+import MyButton from '@/components/MyButton/index.vue'
+import agreement from './agreement.vue'
+import { ref, watch, nextTick } from 'vue'
+import { $, Toast } from '@/utils/generatePackage'
+import { addDonateAPI } from '@/api/C/donate.js'
+// import { wxJsAPI } from '@/api/wx/config'
+// import { wxPayAPI } from '@/api/wx/pay'
+// import wx from 'weixin-js-sdk'
+
+const props = defineProps({
+  item: Object,
+  showPopup: Boolean
+})
+const emit = defineEmits(['on-close']);
+
+let donate_number = ref(1);
+const donateFlower = () => {
+  if (!agreed.value) {
+    Toast.fail('请先查看捐赠协议，勾选同意！');
+    return false;
+  }
+  if (!props.item.donate_name) {
+    Toast.fail('捐赠人姓名不能为空！');
+    return false;
+  }
+  // 业务逻辑调整，有值就传值显示
+  let params = {
+    qty: donate_number.value,
+    donate_name: props.item.donate_name,
+    perf_id: props.item.perf_id,
+    kg_id: props.item.kg_id,
+  };
+  addDonate(params);
+}
+
+const addDonate = async (params) => {
+  const { data } = await addDonateAPI(params);
+  if (data.id) {
+    closeBtn();
+    // TAG: 微信支付
+    wechatPay(data.id);
+  }
+}
+
+const show = ref(false);
+let popupHeight = ref('100%');
+
+watch(() => props.showPopup, (v) => {
+  // 现在新需求只要钱，多余步骤先屏蔽掉。
+  // // 如果没有默认儿童需要用户确认一次
+  // if (v && !props.item.perf_id) {
+  //   Dialog.confirm({
+  //     title: '温馨提示',
+  //     message: '默认儿童为空, 是否继续助力!',
+  //     confirmButtonColor: '#713610'
+  //   })
+  //     .then(() => {
+  //       show.value = v;
+  //       // DOM调整后，把弹出框高度设定到适合高度，配合不同分辨率效果
+  //       nextTick(() => {
+  //         let height = $('.donate-wrapper').height();
+  //         popupHeight.value = height + 10 + 'px';
+  //       })
+  //     })
+  //     .catch(() => {
+  //       // 取消按钮回调
+  //       closeBtn();
+  //     });
+  //   return false;
+  // }
+  show.value = v;
+  // DOM调整后，把弹出框高度设定到适合高度，配合不同分辨率效果
+  nextTick(() => {
+    let height = $('.donate-wrapper').height();
+    popupHeight.value = height + 10 + 'px';
+  })
+})
+
+const closeBtn = () => {
+  emit('on-close', false)
+  show.value = false;
+}
+
+const cancelDonate = () => {
+  closeBtn();
+}
+
+// TAG: 微信支付
+const wechatPay = (id) => {
+  const base = 'http://voice.onwall.cn/WxpayAPI/voice_pay/jsapi_voice.php'
+  location.href = `${base}?i=${id}`
+}
+
+const more_donate = ref(false);
+// 选择捐赠数量
+const selectDonate = (index) => {
+  donate_number.value = index
+  more_donate.value = false
+}
+const defaultOptions = ref({
+  1: '1朵花花',
+  3: '3朵花花',
+  5: '5朵花花',
+});
+// 捐赠协议
+const agreed = ref(false);
+// 显示捐赠协议弹框
+const showDA = ref(false);
+</script>
+
+<style lang="less" scoped>
+.donate-wrapper {
+  .donate-title {
+    padding: 1rem 1rem 0 1rem;
+    color: #999999;
+    text-align: center;
+  }
+
+  .shortcut-choose-wrapper {
+    padding: 1rem;
+
+    .base-item {
+      text-align: center;
+      padding: 0.5rem 0;
+    }
+
+    .checked-item {
+      color: @base-font-color;
+      background: @base-color;
+      border-radius: 3px;
+      border: 1px solid @base-color;
+    }
+
+    .uncheck-item {
+      color: @base-color;
+      background: @base-font-color;
+      border-radius: 3px;
+      border: 1px solid @base-color;
+    }
+  }
+
+  .donate-name {
+    padding: 1rem;
+
+    .donate-text {
+      background: #F4F4F4;
+      border-radius: 3px;
+      padding: 0.5rem;
+      margin-left: 5%;
+      width: 95%;
+    }
+
+    .donate-input {
+      border: 1px solid #B9B9B9;
+      border-radius: 5px;
+      padding: 0.2rem;
+      margin-left: 1rem;
+    }
+  }
+
+  .agree-wrapper {
+    margin: 1rem 0;
+
+    .agree-content {
+      display: flex;
+      align-items: center;
+      box-sizing: content-box;
+
+      .btn {
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+      }
+
+      .text {
+        display: flex;
+        flex-direction: column;
+        justify-content: center;
+
+        span {
+          text-decoration: underline;
+          color: #11D2B1;
+        }
+      }
+    }
+  }
+
+  .donate-number {
+    padding: 1rem;
+    padding-top: 0;
+    text-align: center;
+    color: #11D2B1;
+  }
+
+  .donate-handle {
+    overflow: auto;
+
+    .donate-cancel {
+      width: 49%;
+      float: left;
+    }
+
+    .donate-imd {
+      width: 50%;
+      float: left;
+    }
+  }
+}
+
+.button {
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  flex: 1;
+  padding: 0 0.5rem;
+}
+
+.bottom-btn {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  right: 0;
+  background-color: white;
+  box-shadow: 0px -2px 4px 0px rgba(0, 0, 0, 0.07);
+
+  .text {
+    text-align: center;
+    padding: 0.7rem;
+    margin: 0.8rem;
+    font-size: 1rem;
+    font-weight: bold;
+    border-radius: 24px;
+    // border: 1px solid F7F7F7;
+    color: @base-font-color;
+    background-color: @base-color;
+    box-shadow: 0px 0px 4px 0px rgba(0, 0, 0, 0.06);
+  }
+}
+
+.popup-wrapper {
+  .agreementHtml {
+    padding: 1rem;
+  }
+}
+</style>

+<!--
+ * @Date: 2022-06-25 03:29:05
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-25 15:50:08
+ * @FilePath: /tswj/src/components/FlowerIcon/index.vue
+ * @Description: 文件描述
+-->
+<template>
+  <div :class="[type === 'center' ? 'global-center' : 'flower']">
+    <van-icon :name="icon_flower" color="#c5c5c5" size="1.25rem" :style="{ verticalAlign: align }" />
+    <span :style="{ color, fontSize }">&nbsp;{{ qty }}</span>
+  </div>
+</template>
+
+<script setup>
+import { icon_flower } from '@/utils/generateIcons.js'
+
+const props = defineProps({
+  qty: {
+    type: Number,
+    default: 0
+  },
+  color: String,
+  align: String,
+  type: String,
+  fontSize: String
+})
+</script>
+
+<style lang="less" scoped>
+.flower {
+  text-align: center; 
+  position: absolute; 
+  top: 40%; 
+  right: 0.5rem;
+  color: #713610;
+}
+</style>

+<template>
+  <!-- 滑块验证功能 -->
+  <div class="sliderModel" v-if="visible">
+    <div class="cont">
+      <div class="title">滑块验证</div>
+      <div class="slider-refresh">
+        <span @click="handleRefresh">刷新</span>
+        <span @click="handleClose">关闭</span>
+      </div>
+      <!-- canvas 图片 -->
+      <div class="imgWrap">
+        <canvas ref="sliderBlock" class="slider-block"></canvas>
+        <canvas ref="codeImg" class="code-img"></canvas>
+      </div>
+      <!-- 滑块 -->
+      <div class="sliderBox">
+        <div class="sliderF">
+          <div class="sliderS" @touchstart.prevent="handleTouch">
+            <div class="btn">&gt;&gt;</div>
+          </div>
+        </div>
+        <div class="bgC">
+          {{ tips }}
+          <div class="bgC_left"></div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script>
+import img1 from './images/1.jpg'
+import img2 from './images/2.jpg'
+import img3 from './images/3.jpg'
+import img4 from './images/4.jpg'
+import img5 from './images/5.jpg'
+import img6 from './images/6.jpg'
+
+export default {
+  props: {
+    isShow: {
+      type: Boolean,
+      default: false
+    },
+    options: {
+      // 传入的参数不影响组件
+      type: Object,
+      default: () => ({})
+    },
+    imgList: { // 背景图片
+      type: Array,
+      default: () => {
+        return [img1, img2, img3, img4, img5, img6]
+      }
+    }
+  },
+  data() {
+    return {
+      // 滑块x轴数据
+      slider: {
+        mx: 0,
+        bx: 0
+      },
+      tips: '',
+      visible: false,
+      mainDom: '',
+      blockDom: ''
+    }
+  },
+  watch: {
+    isShow: {
+      handler(newVal) {
+        this.visible = newVal
+        if (newVal === true) {
+          this.tips = '拖动左边滑块完成上方拼图'
+          this.$nextTick(() => {
+            this.getDom()
+            this.canvasInit()
+          })
+        }
+      },
+      immediate: true
+    }
+  },
+
+  methods: {
+    // 获取 dom
+    getDom() {
+      this.mainDom = this.$refs.codeImg
+      this.blockDom = this.$refs.sliderBlock
+    },
+
+    handleClose() {
+      this.$emit('on-close', false)
+    },
+
+    // 刷新
+    handleRefresh() {
+      this.canvasInit()
+    },
+
+    // 移动端事件
+    handleTouch(e) {
+      const ev = e || window.event
+      const dom = ev.target // dom元素
+
+      const downCoordinate = {
+        x: ev.touches[0].pageX,
+        y: ev.touches[0].pageY
+      }
+      // 正确的滑块数据
+      const checkx = Number(this.slider.mx) - 0
+      // x轴数据
+      let x = 0
+      const move = (moveEV) => {
+        x = moveEV.touches[0].pageX - downCoordinate.x
+        // //y = moveEV.y - downCoordinate.y;
+        if (x >= 251 || x <= 0) return false
+        dom.style.left = x + 'px'
+        // dom.style.top = y + "px";
+        this.blockDom.style.left = x + 'px'
+      }
+
+      const up = () => {
+        document.removeEventListener('touchmove', move)
+        document.removeEventListener('touchend', up)
+        dom.style.left = ''
+
+        // console.log(x, checkx)
+        const max = checkx - 5
+        const min = checkx - 15
+        // 允许正负误差1
+        if ((max >= x && x >= min) || x === checkx) {
+          this.tips = '验证成功'
+          this.$emit('done', this.options.type)
+        } else {
+          this.tips = '验证失败，请重试'
+          this.blockDom.style.left = 0
+          this.canvasInit()
+        }
+      }
+
+      document.addEventListener('touchmove', move)
+      document.addEventListener('touchend', up)
+    },
+
+    // 拼图验证码初始化
+    canvasInit() {
+      // 生成指定区间的随机数
+      const random = (min, max) => {
+        return Math.floor(Math.random() * (max - min + 1) + min)
+      }
+      // x: 254, y: 109
+      const mx = random(127, 230)
+      const bx = random(10, 128)
+      const y = random(10, 99)
+
+      this.slider = { mx, bx }
+
+      this.draw(mx, bx, y)
+    },
+
+    draw(mx = 200, bx = 20, y = 50) {
+      const bg = this.mainDom.getContext('2d')
+      const block = this.blockDom.getContext('2d')
+
+      const width = this.mainDom.width
+      const height = this.mainDom.height
+
+      // 重新赋值，让canvas进行重新绘制
+      this.blockDom.height = height
+      this.mainDom.height = height
+      this.mainDom.width = width
+      // 随机背景图片
+      const randomImg = () => {
+        const num = Math.floor(Math.random() * this.imgList.length)
+        return this.imgList[num]
+      }
+
+      const imgsrc = randomImg()
+      const img = document.createElement('img')
+      img.style.objectFit = 'scale-down'
+      img.src = imgsrc
+      img.onload = () => {
+        bg.drawImage(img, 0, 0, width, height)
+        block.drawImage(img, 0, 0, width, height)
+        const ImageData = block.getImageData(mx, y, width, height)
+        block.putImageData(ImageData, 0, y)
+      }
+
+      const mainxy = { x: mx, y: y, r: 9 }
+      const blockxy = { x: mx, y: y, r: 9 }
+      this.drawBlock(bg, mainxy, 'fill')
+      this.drawBlock(block, blockxy, 'clip')
+    },
+
+    // 绘制拼图
+    drawBlock(ctx, xy = { x: 254, y: 109, r: 9 }, type) {
+      const x = xy.x
+      const y = xy.y
+      const r = xy.r
+      const w = 40
+      const PI = Math.PI
+      // 绘制
+      ctx.beginPath()
+      // left
+      // ctx.moveTo(x, y)
+      // top
+      ctx.arc(x + (w + 5) / 2, y, r, -PI, 0.15, true)
+      ctx.lineTo(x + w + 5, y)
+      // right
+      ctx.arc(x + w + 5, y + w / 2, r, 1.5 * PI, 0.5 * PI, false)
+      ctx.lineTo(x + w + 5, y + w)
+      // bottom
+      ctx.arc(x + (w + 5) / 2, y + w, r, 0, PI, false)
+      ctx.lineTo(x, y + w)
+      ctx.arc(x, y + w / 2, r, 0.5 * PI, 1.5 * PI, true)
+      ctx.lineTo(x, y)
+      // 修饰，没有会看不出效果
+      ctx.lineWidth = 1
+      ctx.fillStyle = 'rgba(255, 255, 255, 0.5)'
+      ctx.strokeStyle = 'rgba(255, 255, 255, 0.5)'
+      ctx.stroke()
+      ctx[type]()
+      ctx.globalCompositeOperation = 'xor'
+    }
+  }
+}
+</script>
+
+<style scoped lang="less">
+.sliderModel {
+  position: fixed;
+  left: 0;
+  top: 0;
+  width: 100%;
+  height: 100%;
+  background: rgba(0, 0, 0, 0.5);
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+.title {
+  width: 100%;
+  height: 60px;
+  font-size: 18px;
+  color: #333;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+}
+
+.cont {
+  position: relative;
+  background: #fff;
+  width: 300px;
+  border-radius: 8px;
+  overflow: hidden;
+  padding-bottom: 10px;
+}
+
+.imgWrap {
+  position: relative;
+  width: 280px;
+  height: 150px;
+  margin: 0 auto;
+  overflow: hidden;
+
+  .code-img,
+  .slider-block {
+    border-radius: 8px;
+    height: inherit;
+  }
+
+  .code-img {
+    width: 280px;
+    margin: 0 auto;
+  }
+
+  .slider-block {
+    position: absolute;
+    z-index: 4000;
+    left: 0;
+  }
+}
+
+.slider-refresh {
+  font-size: 14px;
+  position: absolute;
+  top: 20px;
+  right: 20px;
+  cursor: pointer;
+  color: green;
+
+  span {
+    padding: 0 2px;
+  }
+}
+
+.img {
+  display: block;
+  width: 100%;
+  height: 100%;
+}
+
+.sliderOver {
+  position: absolute;
+  left: 0;
+  top: 0;
+  width: 50px;
+  height: 50px;
+  background: #ddd;
+  box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.3);
+}
+
+.smartImg {
+  position: absolute;
+  z-index: 2;
+  left: 0;
+  top: 0;
+  width: 50px;
+  height: 50px;
+  overflow: hidden;
+  box-shadow: 0 0 5px rgba(0, 0, 0, 0.3);
+}
+
+.simg {
+  position: absolute;
+  display: block;
+  width: 280px;
+  height: 150px;
+}
+
+.sliderBox {
+  width: 280px;
+  margin: 15px auto 0;
+  height: 36px;
+  position: relative;
+}
+
+.sliderF {
+  width: 100%;
+  height: 100%;
+  z-index: 3;
+}
+
+.sliderS {
+  cursor: pointer;
+  position: absolute;
+  left: 0;
+  top: 0;
+  z-index: 2;
+  height: 36px;
+  width: 36px;
+  border-radius: 36px;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+}
+
+.icon {
+  width: 20px;
+  height: 20px;
+}
+
+.bgC {
+  position: absolute;
+  z-index: 1;
+  left: 0;
+  top: 50%;
+  transform: translateY(-50%);
+  width: 100%;
+  height: 30px;
+  border-radius: 30px;
+  line-height: 30px;
+  font-size: 14px;
+  color: #999999;
+  box-shadow: inset 0 0 4px #ccc;
+  text-align: center;
+  overflow: hidden;
+}
+
+.bgC_left {
+  position: absolute;
+  left: 0px;
+  top: 50%;
+  transform: translateY(-50%);
+  width: 0;
+  height: 28px;
+  border-top-left-radius: 28px;
+  border-bottom-left-radius: 28px;
+  line-height: 28px;
+  font-size: 14px;
+  background-color: #eee;
+  box-shadow: inset 0 0 4px #ccc;
+  text-align: center;
+}
+
+.showMessage {
+  text-align: center;
+  font-size: 14px;
+  height: 30px;
+  line-height: 30px;
+}
+
+#closeBtn {
+  position: fixed;
+  z-index: 10;
+  bottom: 10px;
+  left: 50%;
+}
+
+.btn {
+  width: 36px;
+  height: 36px;
+  position: absolute;
+  border: 1px solid #ccc;
+  cursor: move;
+  font-family: "宋体";
+  text-align: center;
+  line-height: 36px;
+  background-color: #fff;
+  user-select: none;
+  color: #666;
+  font-size: 16px;
+}
+</style>

+<!--
+ * @Date: 2022-06-20 11:35:50
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-21 19:10:41
+ * @FilePath: /tswj/src/components/LocalismBox/index.vue
+ * @Description: 调整作品方言弹框组件
+-->
+<template>
+  <van-overlay :show="show" z-index="1000" :lock-scroll="false">
+    <div class="wrapper" @click.stop>
+      <div class="block">
+        <div class="close">
+          <van-icon name="close" color="#FFFFFF" @click="handleClose" />
+        </div>
+        <div class="localism-title">{{ title }}</div>
+        <div id="localism-list" class="localism-list">
+          <div v-for="(item, index) in localismList" :id="item.id" :key="index"
+            :class="[item.checked ? 'checked' : 'unchecked', 'van-hairline--top-bottom', 'localism-item']"
+            @click="setLocalism(item.id)">
+            {{ item.localism }}
+          </div>
+          <div v-show="show_localism" id="localism-bottom" class="van-hairline--top-bottom localism-item">
+            <input v-model="localism_name" placeholder="请输入新增的方言名称" style="border: 0; text-align: center;"
+              @blur="onBlur">
+          </div>
+        </div>
+        <div class="bar">
+          <div class="button">
+            <my-button type="plain" @on-click="addLocalism">新增方言</my-button>
+          </div>
+          <div class="button">
+            <my-button type="primary" @on-click="handleSubmit">确定</my-button>
+          </div>
+        </div>
+      </div>
+    </div>
+  </van-overlay>
+</template>
+
+<script setup>
+import { ref, watch, nextTick } from 'vue'
+import MyButton from '@/components/MyButton/index.vue'
+import { localismListModiAPI, addLocalismAPI, modifyProdLocalismAPI } from '@/api/B/localism'
+import { Toast, Dialog } from '@/utils/generatePackage.js'
+
+const props = defineProps({
+  showLocalism: Boolean,
+  id: Number,
+  localism: String,
+  title: String,
+})
+const emit = defineEmits(['on-close', 'on-submit']);
+/**
+ * 滚动到指定位置
+ * @param {*} id 
+ */
+const scrollToDom = (id) => {
+  nextTick(() => {
+    document.getElementById(id)?.scrollIntoView({ block: 'center' });
+  })
+}
+
+// 处理语言列表数据
+let localismList = ref([]);
+const raw_id = ref('')
+const getLocalismList = async () => {
+  const { data } = await localismListModiAPI();
+  localismList.value = data.map((item) => ({ id: item, localism: item, checked: false }))
+  localismList.value.forEach((item) => {
+    if (item.localism === props.localism) {
+      item.checked = true;
+      raw_id.value = item.id
+    }
+  });
+  scrollToDom(props.localism);
+}
+
+let show = ref(false);
+watch(() => props.showLocalism, (v) => {
+  show.value = v;
+  if (v) {
+    getLocalismList()
+  }
+})
+
+// 点击行选择方言
+const setLocalism = (v) => {
+  localismList.value.forEach((item) => {
+    item.checked = false;
+  });
+  localismList.value.forEach((item) => {
+    if (item.id === v) {
+      item.checked = true;
+    }
+  });
+}
+
+// 新增方言
+const show_localism = ref(false)
+const localism_name = ref('')
+
+const addLocalism = () => { // 滚动到底部，显示新增输入框
+  show_localism.value = true;
+  const id = localismList.value[localismList.value.length - 1]['id'];
+  scrollToDom(id);
+}
+
+const onBlur = () => { // 失焦保存录入方言
+  if (!localism_name.value) return false;
+  Dialog.confirm({
+    title: '温馨提示',
+    message: `是否确认新增${localism_name.value}？`,
+    confirmButtonColor: '#11D2B1'
+  })
+    .then(async () => {
+      const { code } = await addLocalismAPI({ localism_name: localism_name.value });
+      if (code) {
+        Toast.success('新增成功！');
+        localismList.value.forEach((item) => {
+          item.checked = false;
+        });
+        localismList.value.push({ id: localism_name.value, localism: localism_name.value, checked: true });
+        scrollToDom(localism_name.value);
+      }
+      show_localism.value = false;
+      localism_name.value = '';
+    })
+    .catch(() => {
+      // on cancel
+    });
+}
+
+const clearAll = () => {
+  show.value = false
+  show_localism.value = false
+  localismList.value = []
+  localism_name.value = ''
+}
+
+const handleClose = () => { // 关闭提示框回调
+  clearAll();
+  emit('on-close', false)
+}
+
+const handleSubmit = () => { // 提交选择方言
+  const localism = localismList.value.filter((item) => item.checked === true);
+  // 原始和提交不一致请求接口提交
+  if (raw_id.value !== localism[0].id) {
+    Dialog.confirm({
+      title: '温馨提示',
+      message: `是否确认设置方言为${localism[0].id}？`,
+      confirmButtonColor: '#11D2B1'
+    })
+      .then(async () => {
+        const { code } = await modifyProdLocalismAPI({ prod_id: props.id, localism_name: localism[0].id });
+        if (code) {
+          Toast.success('更新成功！');
+          clearAll();
+          emit('on-submit', localism[0].id);
+        }
+      })
+      .catch(() => {
+        // on cancel
+      });
+  } else {
+    clearAll();
+    emit('on-submit', raw_id.value);
+  }
+}
+</script>
+
+<style lang="less" scoped>
+.wrapper {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 100%;
+  width: auto;
+  text-align: center;
+}
+
+.block {
+  width: 80%;
+  // height: 25rem;
+  background-color: #fff;
+  border-radius: 10px;
+  padding: 1rem 0;
+  position: relative;
+  margin-top: 1rem;
+  margin-bottom: 5rem;
+  .close {
+    position: absolute;
+    top: -2rem;
+    right: 1rem;
+    font-size: 1.5rem;
+  }
+}
+.localism-title {
+  font-size: 1.05rem;
+}
+.localism-list {
+  margin-top: 2rem;
+  height: 20rem;
+  overflow: scroll;
+}
+
+.bar {
+  display: flex;
+  align-items: center;
+  box-sizing: content-box;
+  background-color: white;
+  padding: 0.7rem;
+
+  .button {
+    display: flex;
+    flex-direction: column;
+    justify-content: center;
+    flex: 1;
+    padding: 0 0.5rem;
+  }
+}
+
+.localism-item {
+  padding: 1rem;
+  text-align: center;
+}
+.checked {
+  color: #11d2b1;
+}
+.unchecked {
+  color: gray;
+}
+input::-webkit-input-placeholder {
+  color: #B0B0B0;
+}
+</style>

+<template>
+  <div class="login-section">
+    <van-config-provider :theme-vars="themeVars">
+      <van-form ref="form" @submit="onSubmit">
+        <van-cell-group inset style="border: 1px solid #EAEAEA;">
+          <van-field v-if="use_widget" v-model="phone" name="phone" label="手机号" placeholder="手机号" readonly clickable
+            :rules="[{ validator, message: '请输入正确手机号' }]"
+            @touchstart.stop="showKeyboard" />
+          <van-field v-else v-model="phone" name="phone" label="手机号" placeholder="手机号"
+            :rules="[{ validator, message: '请输入正确手机号' }]" />
+          <van-field v-model="code" center clearable name="code" type="digit" label="短信验证码" placeholder="请输入短信验证码"
+            :formatter="formatter" :rules="[{ required: true, message: '请填写验证码' }]">
+            <template #button>
+              <van-button @click="sendCode" v-if="countDown.current.value.total === limit" size="small" type="primary"
+                :disabled="disabled">
+                <span>发送验证码</span>
+              </van-button>
+              <van-button v-else size="small" type="primary" :disabled="disabled">
+                <span>{{ countDown.current.value.seconds }} 秒重新发送</span>
+              </van-button>
+            </template>
+          </van-field>
+        </van-cell-group>
+      </van-form>
+    </van-config-provider>
+  </div>
+
+  <van-number-keyboard v-model="phone" :show="keyboard_show" :maxlength="11" @blur="onBlur" />
+
+  <!-- 图片滑块验证 -->
+  <image-slider-verify :isShow="sliderShow" @done="handleConfirm" @on-close="handleClose">
+  </image-slider-verify>
+</template>
+
+<script setup>
+import ImageSliderVerify from '@/components/ImageSliderVerify/index.vue'
+
+import { ref, onMounted } from 'vue'
+import { useRoute, useRouter } from 'vue-router'
+import { useCountDown } from '@vant/use';
+import { wxInfo } from '@/utils/tools';
+import { styleColor } from '@/constant.js';
+
+import { Cookies, $, _, axios, storeToRefs, mainStore, Toast, useTitle } from '@/utils/generatePackage.js'
+//import { } from '@/utils/generateModules.js'
+//import { } from '@/utils/generateIcons.js'
+//import { } from '@/composables'
+const $route = useRoute();
+const $router = useRouter();
+
+const emit = defineEmits(['on-submit'])
+
+const form = ref(null);
+
+const submit = () => {
+  let valid = form.value.validate();
+  valid
+    .then(() => {
+      form.value.submit();
+    })
+    .catch(error => {
+      console.error(error);
+      Toast({
+        message: '请检查后再次提交',
+        icon: 'cross',
+      });
+    })
+}
+
+defineExpose({
+  submit
+})
+
+const themeVars = {
+  buttonPrimaryBackground: styleColor.baseColor,
+  buttonPrimaryBorderColor: styleColor.baseColor,
+  buttonPrimaryColor: styleColor.baseFontColor,
+  CellVerticalPadding: '14px'
+};
+
+const onSubmit = () => { 
+  emit('on-submit', {
+    phone: phone.value,
+    code: code.value,
+  })
+}
+
+// 判断是否显示控件
+let use_widget = ref(true);
+/**
+ * 手机号码校验
+ * 函数返回 true 表示校验通过，false 表示不通过
+ * @param {*} val 
+ */
+const validator = (val) => {
+  let flag = false;
+  // 简单判断手机号位数
+  if (/1\d{10}/.test(val) && phone.value.length === 11) {
+    disabled.value = false;
+    flag = true;
+  } else {
+    disabled.value = true;
+    flag = false;
+  }
+  return flag
+};
+
+
+const phone = ref('');
+const code = ref('');
+// TAG: 开发环境测试数据
+if (import.meta.env.DEV) {
+  phone.value = import.meta.env.VITE_ID
+  code.value = import.meta.env.VITE_PIN
+}
+
+onMounted(() => {
+  /**
+   * 判断微信环境看是否弹出控件框
+   * 桌面微信直接输入
+   * 其他环境弹出输入框
+   */
+  if (wxInfo().isiOS || wxInfo().isAndroid) {
+    use_widget.value = true;
+  } else {
+    use_widget.value = false;
+  }
+  // 判断微信授权状态，进入页面时未授权需要授权跳转
+  if (!Cookies.get('PHPSESSID')) {
+    $router.replace({
+      path: '/auth',
+      query: {
+        href: location.hash,
+        userType: 'b'
+      }
+    });
+  }
+})
+
+// 手机号输入控件控制
+const keyboard_show = ref(false);
+const showKeyboard = () => { // 弹出数字弹框
+  keyboard_show.value = true;
+};
+const onBlur = () => { // 数字键盘失焦回调
+  keyboard_show.value = false;
+  if (phone.value.length === 11) {
+    disabled.value = false;
+  }
+};
+
+// 设置发送短信倒计时
+// TAG: vant 自带倒计时函数
+const limit = ref(60000); // 配置倒计时秒数
+const countDown = useCountDown({
+  // 倒计时 24 小时
+  time: limit.value,
+  onFinish: () => {
+    countDown.reset();
+  }
+});
+
+const sendCode = () => { // 发送验证码
+  countDown.start();
+  axios.post('/srv/?a=bind_phone&t=get_code', {
+    phone: phone.value
+  })
+    .then(res => {
+      if (res.data.code === 1) {
+        Toast.success('发送成功');
+      } else {
+        console.warn(res.data);
+        if (!res.data.show) return false;
+        Toast({
+          message: res.data.msg,
+          icon: 'close',
+        });
+      }
+    })
+    .catch(err => {
+      console.error(err);
+    })
+};
+
+const disabled = ref(true);
+// 过滤输入的数字 只能四位
+const formatter = (value) => value.substring(0, 4);
+
+// 滑块验证成功后回调
+const sliderShow = ref(false);
+const handleConfirm = (val) => {
+  sliderShow.value = false
+  console.warn('验证成功');
+}
+const handleClose = () => {
+  sliderShow.value = false
+}
+const imageVerify = () => {
+  sliderShow.value = true;
+}
+</script>
+
+<style lang="less" scoped>
+</style>

+<template>
+  <login-box ref="form" @on-submit="onSubmit"></login-box>
+  <div class="btn" @click="submit">
+    登&nbsp;录
+  </div>
+</template>
+
+<script setup>
+import LoginBox from '@/components/LoginBox'
+import { onMounted, ref } from 'vue';
+import { useRoute, useRouter } from 'vue-router';
+
+import {
+  Cookies,
+  $,
+  _,
+  axios,
+  storeToRefs,
+  mainStore,
+  Toast,
+  useTitle,
+} from '@/utils/generatePackage.js';
+//import { } from '@/utils/generateModules.js'
+//import { } from '@/utils/generateIcons.js'
+//import { } from '@/composables'
+const $route = useRoute();
+const $router = useRouter();
+useTitle($route.meta.title);
+
+const form = ref(null);
+
+const submit = () => {
+  form.value.submit();
+}
+
+const onSubmit = (values) => {
+  axios.post('/srv/?a=b_login', {
+    phone: values.phone,
+    pin: values.code,
+  })
+    .then(res => {
+      if (res.data.code === 1) {
+        $router.push({
+          path: '/business/index'
+        });
+      } else {
+        console.warn(res.data);
+        Toast({
+          message: res.data.msg,
+          icon: 'close',
+        });
+      }
+    })
+    .catch(err => {
+      console.error(err);
+    })
+};
+</script>
+
+<style
+  lang="less"
+  scoped>
+</style>

+<template>
+  <div 
+    @click="goToDetail(item, $router)" 
+    class="banner">
+    {{ item.kg_name }} ｜ {{ item.localism_type }}
+  </div>
+</template>
+
+<script setup>
+import { goToDetail } from './methods'
+const props = defineProps({
+  item: Object,
+});
+</script>
+
+<style lang="less" scoped>
+  .banner {
+    color: #999999; 
+    padding: 0.5rem 1rem
+  }
+</style>

+<!--
+ * @Author: hookehuyr hookehuyr@gmail.com
+ * @Date: 2022-05-23 13:42:35
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-24 12:19:30
+ * @FilePath: /tswj/src/components/MuiVideo/index.vue
+ * @Description: 
+-->
+<template>
+  <div class="video-wrapper">
+    <div v-if="type === 'video'">
+      <div :id="'mui-player-' + item.id" class="video-div" />
+    </div>
+    <div v-else>
+      <status :item="item" />
+      <div :id="'mui-player-' + item.id" class="video-div" />
+      <video-bar :item="item" :bar-type="1" />
+      <banner v-if="type === 'bookDetail'" :item="item" />
+    </div>
+  </div>
+</template>
+
+<script setup>
+/**
+ * 视频组件通用模块
+ */
+import 'mui-player/dist/mui-player.min.css';
+import MuiPlayer from 'mui-player';
+import { onMounted } from 'vue';
+import banner from './banner';
+import videoBar from './videoBar';
+import status from './status';
+import { useEventListener } from '@/composables';
+
+// 视频基础属性
+const props = defineProps({
+  item: Object,
+  type: String,
+});
+// 视频播放事件回调
+const emit = defineEmits(['on-play']);
+
+onMounted(() => {
+  const mp = new MuiPlayer({
+    container: '#mui-player-' + props.item.id,
+    title: props.item.title,
+    src: props.item.video,
+    poster: props.item.cover,
+    autoFit: false,
+    videoAttribute: [
+      // 声明启用同层播放, 不让会自动全屏播放
+      { attrKey: 'webkit-playsinline', attrValue: 'webkit-playsinline' },
+      { attrKey: 'playsinline', attrValue: 'playsinline' },
+      { attrKey: 'x5-video-player-type', attrValue: 'h5-page' },
+    ],
+  });
+  const video = mp.video();
+  // 监听原生video事件
+  useEventListener(video, 'play', (event) => {
+    emit('on-play', {
+      event,
+      props: props.item,
+    });
+  });
+  // 配置16:9高度比
+  const width = document.getElementById('mui-player-' + props.item.id).clientWidth;
+  const height = (width * 9) / 16;
+  document.getElementById('mui-player-' + props.item.id).height = height;
+});
+</script>
+
+<style lang="less" scoped>
+.video-wrapper {
+  position: relative;
+  margin: 1rem 0;
+  border-bottom-left-radius: 5px;
+  border-bottom-right-radius: 5px;
+  box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.13);
+
+  .video-div {
+    border-top-left-radius: 5px;
+    border-top-right-radius: 5px;
+  }
+
+  .video-bar {
+    color: #713610;
+    padding: 1rem;
+    padding-bottom: 0.5rem;
+
+  }
+}
+</style>

+/*
+ * @Author: hookehuyr hookehuyr@gmail.com
+ * @Date: 2022-05-23 14:33:37
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-02 13:14:23
+ * @FilePath: /tswj/src/components/MuiVideo/methods.js
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+ */
+import { prodActionAPI } from '@/api/C/prod.js'
+import { Toast } from 'vant';
+
+export const goToDetail = ({ id, book_id, type, perf_id }, $router) => {
+  $router.push({
+    path: '/client/videoDetail',
+    query: {
+      prod_id: id,
+      book_id,
+      type, // 特殊标识，判断入口 为keepAlive使用
+      perf_id
+    }
+  });
+}
+
+export const setComment = ({ id, book_id }, $router) => {
+  $router.push({
+    path: '/client/videoDetail/comment',
+    query: {
+      prod_id: id,
+      book_id
+    }
+  });
+}
+
+export const prodAction = async (action_type, prod_id) => {
+  const { msg } = await prodActionAPI({ action_type, prod_id });
+  if (msg === `${action_type}-add-OK`) { // 动作操作成功
+    if (action_type === 'favor') {
+      Toast('收藏成功');
+    }
+    if (action_type === 'like') {
+      Toast('点赞成功');
+    }
+  } else { // 取消操作
+    if (action_type !== 'play') {
+      Toast('取消成功');
+    }
+  }
+  return true;
+}

+export default [
+  {
+    "id": 315040,
+    "localism_type": "普通话",
+    "cover": "https://gd-pri.jinshujufiles.com/en/NAGn1D/FgYwXBnKzvOcLNoojqrpwYGsppQI_field_74_1653095780.png?token=7NK_Z1IEoKaIY6I9RXzO4b9uQPwuwdvnlGbzHZmF:3kZFL-LK1CP0k8Iiewr6d4_kCas=:eyJTIjoiZ2QtcHJpLmppbnNodWp1ZmlsZXMuY29tL2VuL05BR24xRC9GZ1l3WEJuS3p2T2NMTm9vanFycHdZR3NwcFFJX2ZpZWxkXzc0XzE2NTMwOTU3ODAucG5nKiIsIkUiOjE5Njg2NjUzMTB9",
+    "video": "https://gd-pri.jinshujufiles.com/en/NAGn1D/FjyggcxvTB9HJ6yFBv4i7-HDuW8F_field_20_1653095775.mp4?token=7NK_Z1IEoKaIY6I9RXzO4b9uQPwuwdvnlGbzHZmF:2gmHTr1opoFCeuYjRPvxabflLZM=:eyJTIjoiZ2QtcHJpLmppbnNodWp1ZmlsZXMuY29tL2VuL05BR24xRC9GanlnZ2N4dlRCOUhKNnlGQnY0aTctSER1VzhGX2ZpZWxkXzIwXzE2NTMwOTU3NzUubXA0KiIsIkUiOjE5Njg2NjUzMTB9",
+    "note": "Z",
+    "status": "apply",
+    "check_note": null,
+    "kg_id": 314048,
+    "kg_name": "上海市杨浦区科技幼儿园",
+    "perf_id": 314880,
+    "name": "王申羽",
+    "avatar": "https://cdn.ipadbiz.cn/ipadbiz/Njg3ZjY5Yzk2NGJhOWQ2NGNjODJmMzBhYWM2NmE3NDJhOTI2NTljNA.jpeg",
+    "book_id": 314483,
+    "book_name": "《它们从哪里来》",
+    "comment_num": 0,
+    "like_num": 0,
+    "favor_num": 0,
+    "play_num": 0,
+    "is_like": 0
+  },
+  {
+    "id": 315041,
+    "localism_type": "沪语",
+    "cover": "https://gd-pri.jinshujufiles.com/en/NAGn1D/FgYwXBnKzvOcLNoojqrpwYGsppQI_field_81_1653095788.png?token=7NK_Z1IEoKaIY6I9RXzO4b9uQPwuwdvnlGbzHZmF:km1-cl6r3X9BwYekqZHyo4kzbWo=:eyJTIjoiZ2QtcHJpLmppbnNodWp1ZmlsZXMuY29tL2VuL05BR24xRC9GZ1l3WEJuS3p2T2NMTm9vanFycHdZR3NwcFFJX2ZpZWxkXzgxXzE2NTMwOTU3ODgucG5nKiIsIkUiOjE5Njg2NjUzMTB9",
+    "video": "https://gd-pri.jinshujufiles.com/en/NAGn1D/FjyggcxvTB9HJ6yFBv4i7-HDuW8F_field_80_1653095786.mp4?token=7NK_Z1IEoKaIY6I9RXzO4b9uQPwuwdvnlGbzHZmF:9kK2Nf96oLV0_t5dKXLnEC0QBLM=:eyJTIjoiZ2QtcHJpLmppbnNodWp1ZmlsZXMuY29tL2VuL05BR24xRC9GanlnZ2N4dlRCOUhKNnlGQnY0aTctSER1VzhGX2ZpZWxkXzgwXzE2NTMwOTU3ODYubXA0KiIsIkUiOjE5Njg2NjUzMTB9",
+    "note": "Z",
+    "status": "apply",
+    "check_note": null,
+    "kg_id": 314048,
+    "kg_name": "上海市杨浦区科技幼儿园",
+    "perf_id": 314880,
+    "name": "王申羽",
+    "avatar": "https://cdn.ipadbiz.cn/ipadbiz/Njg3ZjY5Yzk2NGJhOWQ2NGNjODJmMzBhYWM2NmE3NDJhOTI2NTljNA.jpeg",
+    "book_id": 314483,
+    "book_name": "《它们从哪里来》",
+    "comment_num": 0,
+    "like_num": 0,
+    "favor_num": 0,
+    "play_num": 0,
+    "is_like": 0
+  },
+  {
+    "id": 315036,
+    "localism_type": "普通话",
+    "cover": "https://gd-pri.jinshujufiles.com/en/NAGn1D/FgYwXBnKzvOcLNoojqrpwYGsppQI_field_74_1653095579.png?token=7NK_Z1IEoKaIY6I9RXzO4b9uQPwuwdvnlGbzHZmF:TbYtglmAQrmsCpKulfIkdjrYsjc=:eyJTIjoiZ2QtcHJpLmppbnNodWp1ZmlsZXMuY29tL2VuL05BR24xRC9GZ1l3WEJuS3p2T2NMTm9vanFycHdZR3NwcFFJX2ZpZWxkXzc0XzE2NTMwOTU1NzkucG5nKiIsIkUiOjE5Njg2NjUxMjd9",
+    "video": "https://gd-pri.jinshujufiles.com/en/NAGn1D/FjyggcxvTB9HJ6yFBv4i7-HDuW8F_field_20_1653095576.mp4?token=7NK_Z1IEoKaIY6I9RXzO4b9uQPwuwdvnlGbzHZmF:CIcNhT-g-lmC1mv253Nnoz7EVKQ=:eyJTIjoiZ2QtcHJpLmppbnNodWp1ZmlsZXMuY29tL2VuL05BR24xRC9GanlnZ2N4dlRCOUhKNnlGQnY0aTctSER1VzhGX2ZpZWxkXzIwXzE2NTMwOTU1NzYubXA0KiIsIkUiOjE5Njg2NjUxMjd9",
+    "note": "Z",
+    "status": "apply",
+    "check_note": null,
+    "kg_id": 314048,
+    "kg_name": "上海市杨浦区科技幼儿园",
+    "perf_id": 314880,
+    "name": "王申羽",
+    "avatar": "https://cdn.ipadbiz.cn/ipadbiz/Njg3ZjY5Yzk2NGJhOWQ2NGNjODJmMzBhYWM2NmE3NDJhOTI2NTljNA.jpeg",
+    "book_id": 314483,
+    "book_name": "《它们从哪里来》",
+    "comment_num": 0,
+    "like_num": 0,
+    "favor_num": 0,
+    "play_num": 0,
+    "is_like": 0
+  },
+  {
+    "id": 315037,
+    "localism_type": "沪语",
+    "cover": "https://gd-pri.jinshujufiles.com/en/NAGn1D/FgYwXBnKzvOcLNoojqrpwYGsppQI_field_81_1653095586.png?token=7NK_Z1IEoKaIY6I9RXzO4b9uQPwuwdvnlGbzHZmF:MaeVQ6AUQNzcWKDaMExdr7pFpZU=:eyJTIjoiZ2QtcHJpLmppbnNodWp1ZmlsZXMuY29tL2VuL05BR24xRC9GZ1l3WEJuS3p2T2NMTm9vanFycHdZR3NwcFFJX2ZpZWxkXzgxXzE2NTMwOTU1ODYucG5nKiIsIkUiOjE5Njg2NjUxMjd9",
+    "video": "https://gd-pri.jinshujufiles.com/en/NAGn1D/FjyggcxvTB9HJ6yFBv4i7-HDuW8F_field_80_1653095584.mp4?token=7NK_Z1IEoKaIY6I9RXzO4b9uQPwuwdvnlGbzHZmF:Ox6WCAeG4ImThDZaoEc2v3mrcb8=:eyJTIjoiZ2QtcHJpLmppbnNodWp1ZmlsZXMuY29tL2VuL05BR24xRC9GanlnZ2N4dlRCOUhKNnlGQnY0aTctSER1VzhGX2ZpZWxkXzgwXzE2NTMwOTU1ODQubXA0KiIsIkUiOjE5Njg2NjUxMjd9",
+    "note": "Z",
+    "status": "apply",
+    "check_note": null,
+    "kg_id": 314048,
+    "kg_name": "上海市杨浦区科技幼儿园",
+    "perf_id": 314880,
+    "name": "王申羽",
+    "avatar": "https://cdn.ipadbiz.cn/ipadbiz/Njg3ZjY5Yzk2NGJhOWQ2NGNjODJmMzBhYWM2NmE3NDJhOTI2NTljNA.jpeg",
+    "book_id": 314483,
+    "book_name": "《它们从哪里来》",
+    "comment_num": 0,
+    "like_num": 0,
+    "favor_num": 0,
+    "play_num": 0,
+    "is_like": 0
+  },
+  {
+    "id": 315033,
+    "localism_type": "沪语",
+    "cover": "https://gd-pri.jinshujufiles.com/en/NAGn1D/FgYwXBnKzvOcLNoojqrpwYGsppQI_field_81_1653095145.png?token=7NK_Z1IEoKaIY6I9RXzO4b9uQPwuwdvnlGbzHZmF:dzCQntH7aBmPGYyxvmiOTwgr8WY=:eyJTIjoiZ2QtcHJpLmppbnNodWp1ZmlsZXMuY29tL2VuL05BR24xRC9GZ1l3WEJuS3p2T2NMTm9vanFycHdZR3NwcFFJX2ZpZWxkXzgxXzE2NTMwOTUxNDUucG5nKiIsIkUiOjE5Njg2NjQ2Njh9",
+    "video": "https://gd-pri.jinshujufiles.com/en/NAGn1D/FjyggcxvTB9HJ6yFBv4i7-HDuW8F_field_80_1653095142.mp4?token=7NK_Z1IEoKaIY6I9RXzO4b9uQPwuwdvnlGbzHZmF:IygI0aLGuFR_DEgRtmsbNjAhVS0=:eyJTIjoiZ2QtcHJpLmppbnNodWp1ZmlsZXMuY29tL2VuL05BR24xRC9GanlnZ2N4dlRCOUhKNnlGQnY0aTctSER1VzhGX2ZpZWxkXzgwXzE2NTMwOTUxNDIubXA0KiIsIkUiOjE5Njg2NjQ2Njh9",
+    "note": "2",
+    "status": "apply",
+    "check_note": null,
+    "kg_id": 314048,
+    "kg_name": "上海市杨浦区科技幼儿园",
+    "perf_id": 314880,
+    "name": "王申羽",
+    "avatar": "https://cdn.ipadbiz.cn/ipadbiz/Njg3ZjY5Yzk2NGJhOWQ2NGNjODJmMzBhYWM2NmE3NDJhOTI2NTljNA.jpeg",
+    "book_id": 314483,
+    "book_name": "《它们从哪里来》",
+    "comment_num": 0,
+    "like_num": 0,
+    "favor_num": 0,
+    "play_num": 0,
+    "is_like": 0
+  },
+  {
+    "id": 315032,
+    "localism_type": "普通话",
+    "cover": "https://gd-pri.jinshujufiles.com/en/NAGn1D/FgYwXBnKzvOcLNoojqrpwYGsppQI_field_74_1653095136.png?token=7NK_Z1IEoKaIY6I9RXzO4b9uQPwuwdvnlGbzHZmF:PLQaeVUgpZ-rgvD37DE0Yq9W5-o=:eyJTIjoiZ2QtcHJpLmppbnNodWp1ZmlsZXMuY29tL2VuL05BR24xRC9GZ1l3WEJuS3p2T2NMTm9vanFycHdZR3NwcFFJX2ZpZWxkXzc0XzE2NTMwOTUxMzYucG5nKiIsIkUiOjE5Njg2NjQ2Njh9",
+    "video": "https://gd-pri.jinshujufiles.com/en/NAGn1D/FjyggcxvTB9HJ6yFBv4i7-HDuW8F_field_20_1653095134.mp4?token=7NK_Z1IEoKaIY6I9RXzO4b9uQPwuwdvnlGbzHZmF:1fnWx_k8UBYJJ_XjunwCp93N7GI=:eyJTIjoiZ2QtcHJpLmppbnNodWp1ZmlsZXMuY29tL2VuL05BR24xRC9GanlnZ2N4dlRCOUhKNnlGQnY0aTctSER1VzhGX2ZpZWxkXzIwXzE2NTMwOTUxMzQubXA0KiIsIkUiOjE5Njg2NjQ2Njh9",
+    "note": "1",
+    "status": "apply",
+    "check_note": null,
+    "kg_id": 314048,
+    "kg_name": "上海市杨浦区科技幼儿园",
+    "perf_id": 314880,
+    "name": "王申羽",
+    "avatar": "https://cdn.ipadbiz.cn/ipadbiz/Njg3ZjY5Yzk2NGJhOWQ2NGNjODJmMzBhYWM2NmE3NDJhOTI2NTljNA.jpeg",
+    "book_id": 314483,
+    "book_name": "《它们从哪里来》",
+    "comment_num": 0,
+    "like_num": 0,
+    "favor_num": 0,
+    "play_num": 0,
+    "is_like": 0
+  },
+  {
+    "id": 315024,
+    "localism_type": "普通话",
+    "cover": "https://gd-pri.jinshujufiles.com/en/NAGn1D/FgYwXBnKzvOcLNoojqrpwYGsppQI_field_74_1653094501.png?token=7NK_Z1IEoKaIY6I9RXzO4b9uQPwuwdvnlGbzHZmF:0fDZL_C8youKy-IftSFwyr3c36g=:eyJTIjoiZ2QtcHJpLmppbnNodWp1ZmlsZXMuY29tL2VuL05BR24xRC9GZ1l3WEJuS3p2T2NMTm9vanFycHdZR3NwcFFJX2ZpZWxkXzc0XzE2NTMwOTQ1MDEucG5nKiIsIkUiOjE5Njg2NjQwNDF9",
+    "video": "https://gd-pri.jinshujufiles.com/en/NAGn1D/FjyggcxvTB9HJ6yFBv4i7-HDuW8F_field_20_1653094499.mp4?token=7NK_Z1IEoKaIY6I9RXzO4b9uQPwuwdvnlGbzHZmF:BHD2B4D_CDzu9Tw48SvPAgfuJ90=:eyJTIjoiZ2QtcHJpLmppbnNodWp1ZmlsZXMuY29tL2VuL05BR24xRC9GanlnZ2N4dlRCOUhKNnlGQnY0aTctSER1VzhGX2ZpZWxkXzIwXzE2NTMwOTQ0OTkubXA0KiIsIkUiOjE5Njg2NjQwNDF9",
+    "note": "1",
+    "status": "apply",
+    "check_note": null,
+    "kg_id": 314048,
+    "kg_name": "上海市杨浦区科技幼儿园",
+    "perf_id": 314880,
+    "name": "王申羽",
+    "avatar": "https://cdn.ipadbiz.cn/ipadbiz/Njg3ZjY5Yzk2NGJhOWQ2NGNjODJmMzBhYWM2NmE3NDJhOTI2NTljNA.jpeg",
+    "book_id": 314483,
+    "book_name": "《它们从哪里来》",
+    "comment_num": 0,
+    "like_num": 0,
+    "favor_num": 0,
+    "play_num": 0,
+    "is_like": 0
+  },
+  {
+    "id": 315025,
+    "localism_type": "沪语",
+    "cover": "https://gd-pri.jinshujufiles.com/en/NAGn1D/FgYwXBnKzvOcLNoojqrpwYGsppQI_field_81_1653094509.png?token=7NK_Z1IEoKaIY6I9RXzO4b9uQPwuwdvnlGbzHZmF:qSjAFNlU3o6SduJzStxg49A8SK0=:eyJTIjoiZ2QtcHJpLmppbnNodWp1ZmlsZXMuY29tL2VuL05BR24xRC9GZ1l3WEJuS3p2T2NMTm9vanFycHdZR3NwcFFJX2ZpZWxkXzgxXzE2NTMwOTQ1MDkucG5nKiIsIkUiOjE5Njg2NjQwNDF9",
+    "video": "https://gd-pri.jinshujufiles.com/en/NAGn1D/FjyggcxvTB9HJ6yFBv4i7-HDuW8F_field_80_1653094506.mp4?token=7NK_Z1IEoKaIY6I9RXzO4b9uQPwuwdvnlGbzHZmF:2Khn4cIo2mJo6Ty6qRvLB0Uus48=:eyJTIjoiZ2QtcHJpLmppbnNodWp1ZmlsZXMuY29tL2VuL05BR24xRC9GanlnZ2N4dlRCOUhKNnlGQnY0aTctSER1VzhGX2ZpZWxkXzgwXzE2NTMwOTQ1MDYubXA0KiIsIkUiOjE5Njg2NjQwNDF9",
+    "note": "2",
+    "status": "apply",
+    "check_note": null,
+    "kg_id": 314048,
+    "kg_name": "上海市杨浦区科技幼儿园",
+    "perf_id": 314880,
+    "name": "王申羽",
+    "avatar": "https://cdn.ipadbiz.cn/ipadbiz/Njg3ZjY5Yzk2NGJhOWQ2NGNjODJmMzBhYWM2NmE3NDJhOTI2NTljNA.jpeg",
+    "book_id": 314483,
+    "book_name": "《它们从哪里来》",
+    "comment_num": 0,
+    "like_num": 0,
+    "favor_num": 0,
+    "play_num": 0,
+    "is_like": 0
+  },
+  {
+    "id": 315021,
+    "localism_type": "沪语",
+    "cover": "https://gd-pri.jinshujufiles.com/en/NAGn1D/FgYwXBnKzvOcLNoojqrpwYGsppQI_field_81_1653094433.png?token=7NK_Z1IEoKaIY6I9RXzO4b9uQPwuwdvnlGbzHZmF:AfRlQR8HGWV0y9kAeEAKd7jhj6I=:eyJTIjoiZ2QtcHJpLmppbnNodWp1ZmlsZXMuY29tL2VuL05BR24xRC9GZ1l3WEJuS3p2T2NMTm9vanFycHdZR3NwcFFJX2ZpZWxkXzgxXzE2NTMwOTQ0MzMucG5nKiIsIkUiOjE5Njg2NjM5NTV9",
+    "video": "https://gd-pri.jinshujufiles.com/en/NAGn1D/FjyggcxvTB9HJ6yFBv4i7-HDuW8F_field_80_1653094431.mp4?token=7NK_Z1IEoKaIY6I9RXzO4b9uQPwuwdvnlGbzHZmF:PjpJx-lC2kILJPBlpPJuJMqslrE=:eyJTIjoiZ2QtcHJpLmppbnNodWp1ZmlsZXMuY29tL2VuL05BR24xRC9GanlnZ2N4dlRCOUhKNnlGQnY0aTctSER1VzhGX2ZpZWxkXzgwXzE2NTMwOTQ0MzEubXA0KiIsIkUiOjE5Njg2NjM5NTV9",
+    "note": "Z",
+    "status": "apply",
+    "check_note": null,
+    "kg_id": 314048,
+    "kg_name": "上海市杨浦区科技幼儿园",
+    "perf_id": 314880,
+    "name": "王申羽",
+    "avatar": "https://cdn.ipadbiz.cn/ipadbiz/Njg3ZjY5Yzk2NGJhOWQ2NGNjODJmMzBhYWM2NmE3NDJhOTI2NTljNA.jpeg",
+    "book_id": 314483,
+    "book_name": "《它们从哪里来》",
+    "comment_num": 0,
+    "like_num": 0,
+    "favor_num": 0,
+    "play_num": 0,
+    "is_like": 0
+  },
+  {
+    "id": 315020,
+    "localism_type": "普通话",
+    "cover": "https://gd-pri.jinshujufiles.com/en/NAGn1D/FgYwXBnKzvOcLNoojqrpwYGsppQI_field_74_1653094425.png?token=7NK_Z1IEoKaIY6I9RXzO4b9uQPwuwdvnlGbzHZmF:9BOVLskMMLE-pbqmb5rK_5qncNQ=:eyJTIjoiZ2QtcHJpLmppbnNodWp1ZmlsZXMuY29tL2VuL05BR24xRC9GZ1l3WEJuS3p2T2NMTm9vanFycHdZR3NwcFFJX2ZpZWxkXzc0XzE2NTMwOTQ0MjUucG5nKiIsIkUiOjE5Njg2NjM5NTV9",
+    "video": "https://gd-pri.jinshujufiles.com/en/NAGn1D/FjyggcxvTB9HJ6yFBv4i7-HDuW8F_field_20_1653094423.mp4?token=7NK_Z1IEoKaIY6I9RXzO4b9uQPwuwdvnlGbzHZmF:uEz_Ke-BuliSvPQkvdwOAe42Hyk=:eyJTIjoiZ2QtcHJpLmppbnNodWp1ZmlsZXMuY29tL2VuL05BR24xRC9GanlnZ2N4dlRCOUhKNnlGQnY0aTctSER1VzhGX2ZpZWxkXzIwXzE2NTMwOTQ0MjMubXA0KiIsIkUiOjE5Njg2NjM5NTV9",
+    "note": "Z",
+    "status": "apply",
+    "check_note": null,
+    "kg_id": 314048,
+    "kg_name": "上海市杨浦区科技幼儿园",
+    "perf_id": 314880,
+    "name": "王申羽",
+    "avatar": "https://cdn.ipadbiz.cn/ipadbiz/Njg3ZjY5Yzk2NGJhOWQ2NGNjODJmMzBhYWM2NmE3NDJhOTI2NTljNA.jpeg",
+    "book_id": 314483,
+    "book_name": "《它们从哪里来》",
+    "comment_num": 0,
+    "like_num": 0,
+    "favor_num": 0,
+    "play_num": 0,
+    "is_like": 0
+  }
+]

+<template>
+  <div class="status">
+    <van-image v-if="item.status === 'enable'" round width="6rem" height="6rem" style="vertical-align: bottom;" :src="icon_enable" />
+    <van-image v-if="item.status === 'disable'" round width="6rem" height="6rem" style="vertical-align: bottom;" :src="icon_refuse" />
+    <van-image v-if="item.status === 'apply'" round width="6rem" height="6rem" style="vertical-align: bottom;" :src="icon_apply" />
+  </div>
+</template>
+
+<script setup>
+import icon_refuse from '@images/icon-jujue@2x.png'
+import icon_apply from '@images/icon-shenhe@2x.png'
+import icon_enable from '@images/icon-tongguo@2x.png'
+
+const props = defineProps({
+  item: Object,
+});
+</script>
+
+<style lang="less" scoped>
+.status {
+  position: absolute; 
+  top: 0; 
+  right: 0; 
+  z-index: 999;
+}
+</style>

+<!--
+ * @Author: hookehuyr hookehuyr@gmail.com
+ * @Date: 2022-05-23 18:00:39
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-02 17:41:38
+ * @FilePath: /tswj/src/components/MuiVideo/test.vue
+ * @Description: 视频播放通用组件演示组件
+ * @Description: type: video 为纯视频播放框，bookDetail为定制模式
+-->
+<template>
+  <mui-video
+    v-for="(item, index) in mock"
+    :key="index"
+    :item="item"
+    type="video"
+    @on-play="onPlay"
+  />
+</template>
+
+<script setup>
+  import mock from '@/components/MuiVideo/mock';
+  import MuiVideo from '@/components/MuiVideo/index';
+  import { ref } from 'vue';
+  import { useRoute, useRouter } from 'vue-router';
+
+  import {
+    Cookies,
+    $,
+    _,
+    axios,
+    storeToRefs,
+    mainStore,
+    Toast,
+    useTitle,
+  } from '@/utils/generatePackage.js';
+  //import { } from '@/utils/generateModules.js'
+  //import { } from '@/utils/generateIcons.js'
+  //import { } from '@/composables'
+  const $route = useRoute();
+  const $router = useRouter();
+  useTitle($route.meta.title);
+
+  const onPlay = ({ event, props }) => {
+    console.warn(event);
+    console.warn(props);
+  };
+</script>
+
+<style
+  lang="less"
+  scoped></style>

+<!--
+ * @Author: hookehuyr hookehuyr@gmail.com
+ * @Date: 2022-05-23 14:30:57
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-07 15:26:03
+ * @FilePath: /tswj/src/components/MuiVideo/videoBar.vue
+ * @Description: 这是默认设置,请设置`customMade`, 打开koroFileHeader查看配置 进行设置: https://github.com/OBKoro1/koro1FileHeader/wiki/%E9%85%8D%E7%BD%AE
+-->
+<template>
+  <div v-if="barType === 1" class="video-bar">
+    <van-row>
+      <van-col span="12" @click="goToDetail(item, $router)">
+        <van-image round width="2rem" height="2rem" style="vertical-align: middle;"
+          :src="item.avatar ? item.avatar : icon_avatar" />&nbsp;
+        <span style="font-size: 1.05rem;vertical-align: middle;">{{ item.name }}</span>
+      </van-col>
+      <van-col span="12">
+        <div style="padding: 0.25rem; padding-top: 0.75rem; text-align: right;">
+          <span @click="setComment(item, $router)">
+            <van-icon :name="icon_liuyan" size="1.2rem" style="vertical-align: bottom;" />
+            {{ item.comment_num }}
+          </span>
+          &nbsp;&nbsp;&nbsp;
+          <span @click="handleAction('like', detail.id)">
+            <van-icon v-if="!detail.is_like" :name="icon_dianzan1" size="1.2rem" style="vertical-align: bottom;" />
+            <van-icon v-else :name="icon_dianzan2" size="1.2rem" style="vertical-align: bottom;" />
+            {{ detail.like_num }}
+          </span>
+        </div>
+      </van-col>
+    </van-row>
+  </div>
+  <div v-if="barType === 2" class="video-bar">
+    <van-row style="text-align: center;">
+      <van-col span="7">
+        <span style="color: #777777;">
+          {{ item.play_num }}次播放
+        </span>
+      </van-col>
+      <van-col span="1" style="color: #EEEDED;">
+        |
+      </van-col>
+      <van-col span="8">
+        <span @click="handleAction('favor', detail.id)">
+          <van-icon v-if="!detail.is_favor" :name="icon_shoucang1" size="1.2rem" style="vertical-align: bottom;" />
+          <van-icon v-else :name="icon_shoucang2" size="1.2rem" style="vertical-align: bottom;" />
+          {{ detail.favor_num }}
+        </span>
+      </van-col>
+      <van-col span="1" style="color: #EEEDED;">
+        |
+      </van-col>
+      <van-col span="7">
+        <span @click="handleAction('like', detail.id)">
+          <van-icon v-if="!detail.is_like" :name="icon_dianzan1" size="1.2rem" style="vertical-align: bottom;" />
+          <van-icon v-else :name="icon_dianzan2" size="1.2rem" style="vertical-align: bottom;" />
+          {{ detail.like_num }}
+        </span>
+      </van-col>
+    </van-row>
+  </div>
+</template>
+
+<script setup>
+import { icon_shoucang1, icon_shoucang2, icon_dianzan1, icon_dianzan2, icon_liuyan, icon_avatar } from '@/utils/generateIcons.js'
+
+import { ref } from 'vue';
+import { goToDetail, setComment, prodAction } from './methods';
+import _ from 'lodash';
+import { prodInfoAPI } from '@/api/C/prod.js'
+
+const props = defineProps({
+  item: Object,
+  barType: Number
+});
+
+const detail = ref({});
+detail.value = _.cloneDeep(props.item);
+
+const handleAction = async (type, id) => {
+  if (await prodAction(type, id)) {
+    getProductDetail(type, id)
+  }
+}
+
+// 查询作品详情
+async function getProductDetail(action_type, prod_id) {
+  const { data } = await prodInfoAPI({ prod_id });
+  // 更新详情显示
+  detail.value[`is_${action_type}`] = data[`is_${action_type}`];
+  detail.value[`${action_type}_num`] = data[`${action_type}_num`];
+}
+
+</script>
+
+<style lang="less" scoped>
+.video-bar {
+  color: #713610; 
+  padding: 1rem; 
+  padding-bottom: 0.5rem;
+}
+</style>

+<!--
+ * @Author: hookehuyr hookehuyr@gmail.com
+ * @Date: 2022-04-21 10:04:58
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-18 19:28:22
+ * @FilePath: /tswj/src/components/MyButton/index.vue
+ * @Description: 
+-->
+<template>
+  <div v-if="type === 'primary'" class="button-primary" @click="handle">
+    <slot />
+  </div>
+  <div v-if="type === 'plain'" class="button-plain" @click="handle">
+    <slot />
+  </div>
+  <div v-if="type === 'custom'" :style="customStyle" class="button-custom" @click="handle">
+    <slot />
+  </div>
+</template>
+
+<script setup>
+import { onMounted } from 'vue'
+const props = defineProps({
+  type: String,
+  customStyle: Object,
+  disable: {
+    type: Boolean,
+    default: false
+  }
+})
+const emit = defineEmits(['on-click']);
+const handle = () => {
+  emit('on-click', '')
+}
+  onMounted(() => {
+    
+  })
+</script>
+
+<script>
+export default {
+  data () {
+    return {
+
+    }
+  },
+  mounted () {
+
+  },
+  methods: {
+
+  }
+}
+</script>
+
+<style lang="less" scoped>
+  .button-primary {
+    width: auto;
+    height: auto;
+    text-align: center;
+    padding: 0.6rem;
+    margin: 0.5rem;
+    font-size: 1rem;
+    background: #colors[base-color];
+    border-radius: 24px;
+    border: 1px solid #colors[base-color];
+    color: #colors[base-font-color];
+    font-weight: bold;
+  }
+  .button-plain {
+    width: auto;
+    height: auto;
+    text-align: center;
+    padding: 0.6rem;
+    margin: 0.5rem;
+    font-size: 1rem;
+    background: @base-font-color;
+    border-radius: 24px;
+    border: 1px solid @base-color;
+    color: @base-color;
+    font-weight: bold;
+  }
+  .button-custom {
+    width: auto;
+    height: auto;
+    text-align: center;
+    padding: 0.6rem;
+    font-size: 1rem;
+    border-radius: 24px;
+    border: 1px solid;
+  }
+</style>

+<template>
+  <van-overlay :show="showNotice" z-index="1000">
+    <div class="wrapper" @click.stop>
+      <div class="block">
+        <div style="position: absolute; top: -2rem; right: 1rem; font-size: 1.5rem;">
+          <van-icon name="close" color="#FFFFFF" @click="handleClose" />
+        </div>
+        <div>
+          <van-image width="100" height="100" :src="icon_notice" />
+          <p style="margin: 1rem; font-size: 1.15rem; font-weight: bold; color: #222222;">温馨提示</p>
+        </div>
+        <slot></slot>
+        <div style="margin: 3rem 0;">
+          <my-button @on-click="handleSubmit" type="primary">{{ text }}</my-button>
+        </div>
+      </div>
+    </div>
+  </van-overlay>
+</template>
+
+<script setup>
+import MyButton from '@/components/MyButton/index.vue'
+import icon_notice from '@images/que-tishi@2x.png'
+
+import { ref, reactive, onMounted } from 'vue'
+const props = defineProps({
+  showNotice: Boolean,
+  text: String
+})
+const emit = defineEmits(['on-close', 'on-submit']);
+
+let show = props.showNotice;
+
+const handleClose = () => { // 关闭提示框回调
+  show = false
+  emit('on-close', false)
+}
+// 底部按钮
+const handleSubmit = () => {
+  emit('on-submit', false)
+}
+
+onMounted(() => {
+
+})
+</script>
+
+<script>
+export default {
+  data() {
+    return {
+
+    }
+  },
+  mounted() {
+
+  },
+  methods: {
+
+  }
+}
+</script>
+
+<style lang="less" scoped>
+.wrapper {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 100%;
+  width: auto;
+  text-align: center;
+}
+
+.block {
+  width: 80%;
+  // height: 25rem;
+  background-color: #fff;
+  border-radius: 10px;
+  padding: 1rem;
+  position: relative;
+  margin-top: 1rem;
+  margin-bottom: 5rem;
+}
+</style>
\ No newline at end of file

+<!--
+ * @Date: 2022-06-30 17:48:46
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-30 18:11:08
+ * @FilePath: /tswj/src/components/NoticeOverlayTest/index.vue
+ * @Description: 文件描述
+-->
+<template>
+  <van-overlay :show="showNotice" z-index="1000">
+    <div class="wrapper" @click.stop>
+      <div class="block">
+        <div style="position: absolute; top: -2rem; right: 1rem; font-size: 1.5rem;">
+          <van-icon name="close" color="#FFFFFF" @click="handleClose" />
+        </div>
+        <div>
+          <van-image width="100" height="100" :src="icon_notice" />
+          <p style="margin: 1rem; font-size: 1.15rem; font-weight: bold; color: #222222;">温馨提示</p>
+        </div>
+        <div style="color: #333333;">
+          <div v-html="noticeHtml" />
+        </div>
+        <div style="margin: 3rem 0;">
+          <my-button type="primary" @on-click="handleSubmit">{{ noticeText }}</my-button>
+        </div>
+      </div>
+    </div>
+  </van-overlay>
+</template>
+
+<script setup>
+import MyButton from '@/components/MyButton/index.vue'
+import icon_notice from '@images/que-tishi@2x.png'
+import { USER_STATUS } from '@/constant'
+
+const props = defineProps({
+  show: Boolean,
+  type: {
+    type: Number,
+    default: -1,
+  }
+})
+
+const emit = defineEmits(['on-close', 'on-submit']);
+
+const handleClose = () => { // 关闭提示框回调
+  showNotice.value = false
+  emit('on-close', false)
+}
+// 底部按钮
+const handleSubmit = () => {
+  emit('on-submit', false)
+}
+
+const noticeText = ref('')
+const noticeHtml = ref('')
+const showNotice = ref(false)
+// 监听弹出框
+watch(() => props.show, (v) => {
+  showNotice.value = v;
+  if (props.type === USER_STATUS.NON_VERIFIED) {
+    noticeText.value = '前往认证'
+    noticeHtml.value = `
+      <p>您还没有实名认证</p>
+      <p>请前往个人中心进行实名认证</p>
+    `
+  } else if (props.type === USER_STATUS.NON_DEFAULT_CHILD) {
+    noticeText.value = '前往新增'
+    noticeHtml.value = `
+      <p>您还没有新增儿童</p>
+      <p>请前往个人中心进行新增</p>
+    `
+  }
+})
+</script>
+
+<style lang="less" scoped>
+.wrapper {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  height: 100%;
+  width: auto;
+  text-align: center;
+}
+
+.block {
+  width: 80%;
+  // height: 25rem;
+  background-color: #fff;
+  border-radius: 10px;
+  padding: 1rem;
+  position: relative;
+  margin-top: 1rem;
+  margin-bottom: 5rem;
+}
+</style>

+<!--
+ * @Author: hookehuyr hookehuyr@gmail.com
+ * @Date: 2022-05-30 10:20:34
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-25 20:13:49
+ * @FilePath: /tswj/src/components/RankingItem/index.vue
+-->
+<template>
+  <div class="wrapper">
+    <van-row>
+      <van-col span="2" class="rank">
+        <div :class="[{ 'text': indexKey >= 3 }, { 'avatar': indexKey < 3 }]">
+          <van-icon v-if="indexKey < 3" :name="iconRanking(indexKey)" size="1.75rem" />
+          <span v-else>{{ indexKey + 1 }}&nbsp;</span>
+        </div>
+      </van-col>
+      <van-col span="18" class="content-wrapper">
+        <div :class="['height3rem', 'kg-name']" @click="go('/client/chooseBook', { kg_id: rankInfo.id })">
+          <van-row align="center" justify="center" style="position: relative; top: 50%; transform: translateY(-50%);">
+            <van-col span="4">
+              <van-image round width="3rem" height="3rem" :src="rankInfo.logo ? rankInfo.logo : icon_logo"
+                style="vertical-align: text-bottom;" />
+            </van-col>
+            <van-col span="20">
+              <div v-if="rankInfo.multi_name" style="margin-left: 0.5rem;">
+                <p>{{ rankInfo.multi_name[0] }}<br>{{ rankInfo.multi_name[1] }}</p>
+              </div>
+              <p v-else style="margin-left: 0.5rem;">
+                {{ rankInfo.name }}
+              </p>
+            </van-col>
+          </van-row>
+        </div>
+      </van-col>
+      <van-col>
+        <flower-icon type="right" :qty="rankInfo.qty" align="text-bottom"
+          @click="go('/client/donateList', { kg_id: rankInfo.id })" />
+      </van-col>
+    </van-row>
+  </div>
+</template>
+
+<script setup>
+import { icon_logo, icon_ranking1, icon_ranking2, icon_ranking3 } from '@/utils/generateIcons.js'
+
+import { ref } from 'vue'
+import _ from 'lodash'
+import FlowerIcon from '@/components/FlowerIcon'
+import { useGo } from '@/hooks/useGo'
+const go = useGo()
+
+const iconRanking = (index) => {
+  switch (index) {
+    case 0:
+      return icon_ranking1
+    case 1:
+      return icon_ranking2
+    case 2:
+      return icon_ranking3
+    default:
+      return 0
+  }
+}
+
+const onFlowerClick = (v) => {
+  if (v) {
+    go('/client/donateList', { kg_id: rankInfo.value.id })
+  }
+}
+
+// eslint-disable-next-line no-unused-vars
+const props = defineProps({
+  item: {
+    type: Object,
+    default(rawProps) {
+      return rawProps
+    }
+  },
+  indexKey: {
+    type: Number,
+    default(rawProps) {
+      return rawProps
+    }
+  }
+})
+const emit = defineEmits(['on-icon-click']);
+const handle = () => {
+  emit('on-icon-click', '')
+}
+const rankInfo = ref('');
+rankInfo.value = _.cloneDeep(props.item);
+// 有空格分割name
+if (rankInfo.value.name.indexOf(' ') > -1) {
+  rankInfo.value.multi_name = rankInfo.value.name.split(' ');
+}
+</script>
+
+<style lang="less" scoped>
+.wrapper {
+  margin: 1rem 0;
+  background-color: #FFF;
+  position: relative;
+
+  .rank {
+    position: relative;
+
+    .avatar {
+      position: absolute;
+      top: 0;
+      left: 20%;
+    }
+
+    .text {
+      position: absolute;
+      top: 0.5rem;
+      left: 40%;
+      color: #84909F;
+    }
+  }
+  .content-wrapper {
+    padding: 1rem 0.5rem 1rem 0;
+  }
+  .flower {
+    text-align: center; 
+    position: absolute; 
+    top: 40%; 
+    right: 0.5rem;
+    color: #713610;
+  }
+
+  .kg-name {
+    position: relative;
+    height: 3rem;
+  }
+
+  .height3rem {
+    height: 3rem;
+  }
+
+  .height6rem {
+    height: 6rem;
+  }
+}
+</style>

+<template>
+  <div class="wrapper">
+    <div class="w-image">
+      <van-image class="van-hairline--surround avatar" round :src="avatar ? avatar : icon_avatar">
+        <template #error>加载失败</template>
+      </van-image>
+    </div>
+    <div class="text-wrapper">
+      <van-row align="center" justify="center" class="center-content">
+        <van-col span="20" style="color: #713610;">
+          <slot />
+        </van-col>
+        <van-col span="4" style="text-align: center;" @click="handle">
+          <van-icon name="arrow" color="#c5c5c5" size="1.25rem" />
+        </van-col>
+      </van-row>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import icon_avatar from '@images/que-logo@2x.png'
+
+// eslint-disable-next-line no-unused-vars
+const props = defineProps({
+  avatar: {
+    type: String,
+    default: ''
+  }
+})
+const emit = defineEmits(['on-icon-click']);
+const handle = () => {
+  emit('on-icon-click', '')
+}
+</script>
+
+<style lang="less" scoped>
+.wrapper {
+  position: relative;
+  background-color: #fff;
+  margin: 2rem;
+  margin-right: 0;
+  margin-left: 4rem;
+  height: 4rem;
+  box-shadow: 0px 0px 4px 0px rgba(73, 156, 255, 0.2);
+
+  .w-image {
+    width: 4rem;
+    height: 4rem;
+    border-radius: 50%;
+    background-color: #FFF;
+    position: absolute;
+    left: -2rem;
+
+    .avatar {
+      position: absolute;
+      left: 0.1rem;
+      top: 0.1rem;
+      width: 3.8rem;
+      height: 3.8rem;
+    }
+  }
+
+  .text-wrapper {
+    height: 100%;
+    text-align: left;
+    // line-height: 4rem; 
+    padding-left: 3rem;
+    .center-content{
+      position: relative; top: 50%; transform: translateY(-50%);
+    }
+  }
+}
+</style>

+<!--
+ * @Date: 2022-05-11 11:19:14
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-24 13:19:43
+ * @FilePath: /tswj/src/components/ShortcutFixed/index.vue
+ * @Description: 文件描述
+-->
+<template>
+  <div class="shortcut-page" :style="customStyle">
+    <van-image v-if="isHome" class="icon-box" :src="icon_home" @click="toHome" />
+    <van-image v-if="isMe" class="icon-box" :src="icon_me" @click="toMe" />
+    <van-image v-if="isRank" class="icon-box" :src="icon_rank" @click="toRank" />
+  </div>
+</template>
+
+<script setup>
+import Cookies from 'js-cookie'
+import { icon_me, icon_home, icon_rank } from '@/utils/generateIcons.js'
+</script>
+
+<script>
+// FIXME: VUE2写法
+export default {
+  props: ['type', 'item', 'customStyle'],
+  data() {
+    return {
+      userType: Cookies.get('userType') ? Cookies.get('userType') : ''
+    }
+  },
+  computed: {
+    isHome() {
+      return this.item.indexOf('home') !== -1 ? true : false
+    },
+    isMe() {
+      return this.item.indexOf('me') !== -1 ? true : false
+    },
+    isRank() {
+      return this.item.indexOf('rank') !== -1 ? true : false
+    },
+  },
+  mounted() {
+  },
+  methods: {
+    toHome() {
+      // 返回首页
+      if (this.type === 'B') { // 服务端判断
+        this.$router.push({
+          path: '/business/index'
+        });
+      } else {
+        // C 端返回首页需要判断是否，访客或客户
+        switch (this.userType) {
+          case 'visitor':
+            this.$router.push({
+              path: '/client/chooseBook'
+            });
+            break;
+          case 'client':
+            this.$router.push({
+              path: '/client/chooseSchool'
+            });
+            break;
+          default:
+            this.$router.push({
+              path: '/client/index'
+            });
+            break;
+        }
+      }
+    },
+    toMe() {
+      if (this.type === 'B') { // 服务端判断
+        this.$router.push({
+          path: '/business/me'
+        });
+      } else {
+        this.$router.push({
+          path: '/me/index'
+        });
+      }
+    },
+    toRank () {
+      this.$router.push({
+        path: '/client/rankList',
+        query: {
+          kg_id: this.$route.query.kg_id
+        }
+      });
+    }
+  }
+}
+</script>
+
+<style lang="less" scoped>
+.shortcut-page {
+  position: fixed;
+  bottom: 18rem;
+  right: 1rem;
+  overflow: auto;
+  z-index: 999;
+  width: 3rem;
+}
+.icon-box {
+  width: 3rem;
+  height: 3rem;
+  margin-bottom: 0.5rem;
+}
+</style>

+<template>
+  <div class="video-wrapper">
+    <div :id="'mui-player-' + item.id" class="video-div" />
+    <div class="normal-module">
+      <div class="video-bar">
+        <van-row>
+          <van-col span="15" @click="setComment">
+            <van-image round width="2rem" height="2rem" class="avatar" :src="item.avatar ? item.avatar : icon_avatar" />
+            <span class="text">{{ item.name }}</span>
+          </van-col>
+          <van-col span="9">
+            <div style="padding: 0.25rem; padding-top: 0.5rem; text-align: right;">
+              <span @click="setComment">
+                <van-icon :name="icon_liuyan" size="1.2rem" style="vertical-align: bottom;" />
+                {{ item.comment_num }}
+              </span>
+              &nbsp;&nbsp;&nbsp;
+              <span @click="handleAction('like', detail.id)">
+                <van-icon :name="!detail.is_like ? icon_dianzan1 : icon_dianzan2" size="1.2rem"
+                  style="vertical-align: bottom;" />
+                {{ detail.like_num }}
+              </span>
+            </div>
+          </van-col>
+        </van-row>
+      </div>
+      <slot name="bookDetailSub" />
+    </div>
+    <div class="audit-module" />
+  </div>
+</template>
+
+<script setup>
+/**
+ * 视频组件通用模块
+ */
+import { icon_dianzan1, icon_dianzan2, icon_liuyan, icon_avatar } from '@/utils/generateIcons.js'
+import { ref, onMounted } from 'vue'
+import { _, Toast } from '@/utils/generatePackage.js'
+import { useRouter } from 'vue-router'
+import 'mui-player/dist/mui-player.min.css'
+import MuiPlayer from 'mui-player'
+import { prodActionAPI, prodInfoAPI } from '@/api/C/prod.js'
+import { useDebounce } from '@/hooks/useDebounce.js'
+import { DEFAULT_COVER } from '@/constant'
+
+const $router = useRouter();
+const props = defineProps({
+  item: {
+    type: Object,
+    default(rawProps) {
+      return rawProps
+    }
+  }
+})
+
+// 作品用户操作
+/**
+ * 两个请求顺序执行，处理直接写在请求函数里面似乎有点问题，get请求数据似乎无法顺利渲染显示
+ */
+// TAG：防抖处理
+const handleAction = useDebounce(async (action_type, prod_id) => {
+  const { msg } = await prodActionAPI({ action_type, prod_id });
+  if (msg === `${action_type}-add-OK`) { // 动作操作成功
+    if (action_type === 'favor') {
+      Toast('收藏成功');
+    }
+    if (action_type === 'like') {
+      Toast('点赞成功');
+    }
+  } else { // 取消操作，播放动作不提示
+    if (action_type !== 'play') {
+      Toast('取消成功');
+    }
+  }
+  getProductDetail(action_type, prod_id); // 更新信息
+});
+
+// 查询作品详情
+const getProductDetail = async (action_type, prod_id) => {
+  const { data } = await prodInfoAPI({ prod_id });
+  // 更新详情显示
+  detail.value[`is_${action_type}`] = data[`is_${action_type}`];
+  detail.value[`${action_type}_num`] = data[`${action_type}_num`];
+}
+
+let detail = ref({});
+
+onMounted(() => {
+  const mp = new MuiPlayer({
+    container: '#mui-player-' + props.item.id,
+    title: props.item.title,
+    src: props.item.video,
+    poster: props.item.cover ?  props.item.cover : DEFAULT_COVER,
+    // poster: DEFAULT_COVER,
+    autoFit: false,
+    videoAttribute: [ // 声明启用同层播放, 不让会自动全屏播放
+      { attrKey: 'webkit-playsinline', attrValue: 'webkit-playsinline' },
+      { attrKey: 'playsinline', attrValue: 'playsinline' },
+      { attrKey: 'x5-video-player-type', attrValue: 'h5-page' },
+    ]
+  })
+  detail.value = _.cloneDeep(props.item);
+  const video = mp.video();
+  // 监听原生video事件
+  video && video.addEventListener('play', function () {
+    handleAction('play', props.item.id)
+  });
+  // 配置16:9高度比
+  const width = document.getElementById('mui-player-' + props.item.id).clientWidth;
+  const height = (width * 9) / 16;
+  document.getElementById('mui-player-' + props.item.id).height = height;
+});
+
+const goTo = () => { // 跳转作品详情页
+  $router.push({
+    path: '/client/videoDetail',
+    query: {
+      prod_id: props.item.id,
+      book_id: props.item.book_id,
+      type: props.item.type, // 特殊标识，判断入口 为keepAlive使用
+      perf_id: props.item.perf_id
+    }
+  });
+}
+
+const setComment = () => {
+  $router.push({
+    path: '/client/videoDetail/comment',
+    query: {
+      prod_id: props.item.id,
+      book_id: props.item.book_id,
+      type: props.item.type, // 特殊标识，判断入口 为keepAlive使用
+    }
+  });
+}
+
+</script>
+
+<style lang="less" scoped>
+.video-wrapper {
+  margin: 1rem;
+  border-bottom-left-radius: 5px;
+  border-bottom-right-radius: 5px;
+  box-shadow: 0px 4px 8px 0px rgba(0, 0, 0, 0.13);
+
+  .video-div {
+    border-top-left-radius: 5px;
+    border-top-right-radius: 5px;
+  }
+
+  .video-bar {
+    color: #713610;
+    padding: 1rem;
+    padding-bottom: 0.5rem;
+    .avatar {
+      vertical-align: middle;
+    }
+    .text {
+      font-size: 1.05rem;vertical-align: middle; display: inline-block; padding-left: 1rem;
+    }
+  }
+}
+</style>

+<template>
+  <div class="video-wrapper">
+    <div class="video-div" :id="'mui-player-' + item.id"></div>
+    <div class="video-bar">
+      <van-row style="text-align: center;">
+        <van-col span="7">
+          <span style="color: #777777;">
+            {{ item.play_num }}次播放
+          </span>
+        </van-col>
+        <van-col span="1" style="color: #EEEDED;">
+          |
+        </van-col>
+        <van-col span="8">
+          <span @click="handleAction('favor', detail.id)">
+            <van-icon v-if="!detail.is_favor" :name="icon_shoucang1" size="1.2rem" style="vertical-align: bottom;" />
+            <van-icon v-else :name="icon_shoucang2" size="1.2rem" style="vertical-align: bottom;" />
+            {{ detail.favor_num }}
+          </span>
+        </van-col>
+        <van-col span="1" style="color: #EEEDED;">
+          |
+        </van-col>
+        <van-col span="7">
+          <span @click="handleAction('like', detail.id)">
+            <van-icon v-if="!detail.is_like" :name="icon_dianzan1" size="1.2rem" style="vertical-align: bottom;" />
+            <van-icon v-else :name="icon_dianzan2" size="1.2rem" style="vertical-align: bottom;" />
+            {{ detail.like_num }}
+          </span>
+        </van-col>
+      </van-row>
+    </div>
+  </div>
+</template>
+
+<script setup>
+/**
+ * 该组件是放在作品详情页头部
+ */
+import icon_dianzan1 from '@images/icon-dianzan01@2x.png'
+import icon_dianzan2 from '@images/icon-dianzan02@2x.png'
+import icon_shoucang1 from '@images/icon-shoucang01@2x.png'
+import icon_shoucang2 from '@images/icon-shoucang02@2x.png'
+
+import 'mui-player/dist/mui-player.min.css'
+import MuiPlayer from 'mui-player'
+import _ from 'lodash';
+import { DEFAULT_COVER } from '@/constant'
+
+</script>
+
+<script>
+// FIXME: VUE2写法
+import mixin from 'common/mixin';
+
+export default {
+  mixins: [mixin.likeFn],
+  props: ['item'],
+  data() {
+    return {
+      detail: {
+        mp: ''
+      }
+    }
+  },
+  created() {
+  },
+  mounted() {
+    setTimeout(() => {
+      var mp = new MuiPlayer({
+        container: '#mui-player-' + this.item.id,
+        title: this.item.title,
+        src: this.item.video,
+        poster: this.item.cover ? this.item.cover : DEFAULT_COVER,
+        // poster: DEFAULT_COVER,
+        autoFit: false,
+        videoAttribute: [ // 声明启用同层播放, 不让会自动全屏播放
+          {attrKey:'webkit-playsinline',attrValue:'webkit-playsinline'},
+          {attrKey:'playsinline',attrValue:'playsinline'},
+          {attrKey:'x5-video-player-type',attrValue:'h5-page'},
+        ]
+      })
+      this.detail = _.cloneDeep(this.item);
+      // 传回数据
+      this.$emit('on-click', this.detail);
+      this.mp = mp;
+      var video = mp.video();
+      // 监听原生video事件
+      var _this = this;
+      video && video.addEventListener('play', function (event) {
+        _this.handleAction('play', _this.item.id)
+      });
+    }, 500)
+    // 配置16:9高度比
+    const width = document.getElementById('mui-player-' + this.item.id).clientWidth;
+    const height = (width * 9) / 16;
+    document.getElementById('mui-player-' + this.item.id).height = height;
+  },
+  methods: {
+  }
+}
+</script>
+
+<style lang="less" scoped>
+.video-wrapper {
+  .video-div {
+    border-top-left-radius: 5px;
+    border-top-right-radius: 5px;
+  }
+  .video-bar {
+    color: #713610; 
+    padding: 1rem; 
+    padding-bottom: 0.5rem;
+  }
+}
+</style>

+<template>
+  <div></div>
+</template>
+
+<script setup>
+import { ref, reactive, onMounted } from 'vue'
+const props = defineProps({
+  type: String
+})
+
+  onMounted(() => {
+    
+  })
+</script>
+
+<script>
+export default {
+  data () {
+    return {
+
+    }
+  },
+  mounted () {
+
+  },
+  methods: {
+
+  }
+}
+</script>
+
+<style lang="less" scoped>
+</style>
\ No newline at end of file

+// ts script setup 写法
+<template>
+  <div class="img-verify">
+    <canvas ref="verify" :width="state.width" :height="state.height" @click="handleDraw" />
+  </div>
+</template>
+
+<script setup lang="ts">
+import { reactive, onMounted, ref } from 'vue'
+
+const verify = ref({} as HTMLCanvasElement)
+const state = reactive({
+  pool: 'ABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890', // 字符串
+  width: 120,
+  height: 40,
+  imgCode: ''
+})
+onMounted(() => {
+  // 初始化绘制图片验证码
+  state.imgCode = draw()
+})
+
+// 点击图片重新绘制
+const handleDraw = () => {
+  state.imgCode = draw()
+}
+
+// 随机数
+const randomNum = (min: number, max: number) => {
+  return parseInt((Math.random() * (max - min) + min + '') as string)
+}
+// 随机颜色
+const randomColor = (min: number, max: number) => {
+  const r = randomNum(min, max)
+  const g = randomNum(min, max)
+  const b = randomNum(min, max)
+  return `rgb(${r},${g},${b})`
+}
+
+// 绘制图片
+const draw = () => {
+  // 3.填充背景颜色，背景颜色要浅一点
+  const ctx = verify.value.getContext('2d') as any
+  // 填充颜色
+  ctx.fillStyle = randomColor(180, 230)
+  // 填充的位置
+  ctx.fillRect(0, 0, state.width, state.height)
+  // 定义paramText
+  let imgCode = ''
+  // 4.随机产生字符串，并且随机旋转
+  for (let i = 0; i < 4; i++) {
+    // 随机的四个字
+    const text = state.pool[randomNum(0, state.pool.length)]
+    imgCode += text
+    // 随机的字体大小
+    const fontSize = randomNum(18, 40)
+    // 字体随机的旋转角度
+    const deg = randomNum(-30, 30)
+    /*
+     * 绘制文字并让四个文字在不同的位置显示的思路 :
+     * 1、定义字体
+     * 2、定义对齐方式
+     * 3、填充不同的颜色
+     * 4、保存当前的状态（以防止以上的状态受影响）
+     * 5、平移translate()
+     * 6、旋转 rotate()
+     * 7、填充文字
+     * 8、restore出栈
+     * */
+    ctx.font = fontSize + 'px Simhei'
+    ctx.textBaseline = 'top'
+    ctx.fillStyle = randomColor(80, 150)
+    /*
+     * save() 方法把当前状态的一份拷贝压入到一个保存图像状态的栈中。
+     * 这就允许您临时地改变图像状态，
+     * 然后，通过调用 restore() 来恢复以前的值。
+     * save是入栈，restore是出栈。
+     * 用来保存Canvas的状态。save之后，可以调用Canvas的平移、放缩、旋转、错切、裁剪等操作。 restore：用来恢复Canvas之前保存的状态。防止save后对Canvas执行的操作对后续的绘制有影响。
+     *
+     * */
+    ctx.save()
+    ctx.translate(30 * i + 15, 15)
+    ctx.rotate((deg * Math.PI) / 180)
+    // fillText() 方法在画布上绘制填色的文本。文本的默认颜色是黑色。
+    // 请使用 font 属性来定义字体和字号，并使用 fillStyle 属性以另一种颜色/渐变来渲染文本。
+    // context.fillText(text,x,y,maxWidth);
+    ctx.fillText(text, -15 + 5, -15)
+    ctx.restore()
+  }
+  // 5.随机产生5条干扰线,干扰线的颜色要浅一点
+  for (let i = 0; i < 5; i++) {
+    ctx.beginPath()
+    ctx.moveTo(randomNum(0, state.width), randomNum(0, state.height))
+    ctx.lineTo(randomNum(0, state.width), randomNum(0, state.height))
+    ctx.strokeStyle = randomColor(180, 230)
+    ctx.closePath()
+    ctx.stroke()
+  }
+  // 6.随机产生40个干扰的小点
+  for (let i = 0; i < 40; i++) {
+    ctx.beginPath()
+    ctx.arc(randomNum(0, state.width), randomNum(0, state.height), 1, 0, 2 * Math.PI)
+    ctx.closePath()
+    ctx.fillStyle = randomColor(150, 200)
+    ctx.fill()
+  }
+  return imgCode
+}
+
+</script>
+<style type="text/css">
+.img-verify canvas {
+  cursor: pointer;
+}
+</style>

+/*
+ * @Author: hookehuyr hookehuyr@gmail.com
+ * @Date: 2022-05-17 12:13:13
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-12 22:50:29
+ * @FilePath: /tswj/src/composables/index.js
+ * @Description:
+ */
+import { onMounted, onUnmounted } from 'vue'
+
+import { useVideoList } from '@/composables/useVideoList.js'
+import { useDefaultPerf } from '@/composables/useDefaultPerf.js'
+import { useBookList, useAsyncBookList } from '@/composables/useBookList.js'
+import { useShortcutBar } from '@/composables/useShortcutBar.js'
+import { useScrollTop } from '@/composables/useScrollTop.js'
+import { useMessageList } from '@/composables/useMessageList.ts'
+
+export {
+  useVideoList,
+  useDefaultPerf,
+  useBookList,
+  useAsyncBookList,
+  useShortcutBar,
+  useScrollTop,
+  useMessageList,
+}
+
+/**
+ * 添加和清除 DOM 事件监听器
+ * @param {*} target 
+ * @param {*} event 
+ * @param {*} callback 
+ */
+export function useEventListener(target, event, callback) {
+  onMounted(() => target?.addEventListener(event, callback))
+  onUnmounted(() => target?.removeEventListener(event, callback))
+}

+/*
+ * @Author: hookehuyr hookehuyr@gmail.com
+ * @Date: 2022-05-07 17:46:54
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-12 22:55:58
+ * @FilePath: /tswj/src/composables/useBookList.js
+ * @Description: 
+ */
+import { ref } from 'vue'
+import axios from '@/utils/axios';
+import { Toast } from 'vant';
+import { useRoute } from 'vue-router';
+import { kgBookListAPI } from '@/api/C/kg'
+
+export const useBookList = () => {
+  const $route = useRoute();
+  const emptyStatus = ref(false);
+  // tslint:disable-next-line: variable-name
+  const kg_id = $route.query.kg_id ? $route.query.kg_id : '';
+  const kgInfo = ref({
+    id: '',
+    logo: '',
+    name: '',
+    multi_name: '',
+    book_list: []
+  });
+  if (kg_id) { // 从学校列表进入
+    axios.get('/srv/?a=kg_book_list', {
+      params: {
+        kg_id
+      }
+    })
+      .then(res => {
+        if (res.data.code === 1) {
+          kgInfo.value = res.data.data;
+          kgInfo.value.book_list.forEach(item => {
+            item.show = true; // 默认显示所有，给搜索功能留的hook
+          });
+          // 有空格分割name
+          if (kgInfo.value.name.indexOf(' ') > -1) {
+            kgInfo.value.multi_name = kgInfo.value.name.split(' ');
+          }
+          if (!kgInfo.value.book_list.length) {
+            emptyStatus.value = true;
+          }
+        } else {
+          // tslint:disable-next-line: no-console
+          console.warn(res);
+          if (!res.data.show) return false;
+          Toast({
+            icon: 'close',
+            message: res.data.msg
+          });
+        }
+      })
+      .catch(err => {
+        // tslint:disable-next-line: no-console
+        console.error(err);
+      })
+  } else { // 从访客进入
+    axios.get('/srv/?a=book_list')
+      .then(res => {
+        if (res.data.code === 1) {
+          res.data.data.forEach(item => {
+            item.show = true; // 默认显示所有，给搜索功能留的hook
+          });
+          kgInfo.value = {
+            book_list: res.data.data
+          }
+          if (!kgInfo.value.book_list.length) {
+            emptyStatus.value = true;
+          }
+        } else {
+          // tslint:disable-next-line: no-console
+          console.warn(res);
+          if (!res.data.show) return false;
+          Toast({
+            icon: 'close',
+            message: res.data.msg
+          });
+        }
+      })
+      .catch(err => {
+        // tslint:disable-next-line: no-console
+        console.error(err);
+      })
+  }
+  return {
+    kg_id,
+    kgInfo,
+    emptyStatus
+  }
+}
+
+// ！！废弃方法
+// 前端使用方式过于复杂
+export const useAsyncBookList = async () => {
+  const $route = useRoute();
+  const emptyStatus = ref(false);
+  // tslint:disable-next-line: variable-name
+  const kg_id = $route.query.kg_id ? $route.query.kg_id : '';
+  const kgInfo = ref({
+    id: '',
+    logo: '',
+    name: '',
+    multi_name: [],
+    book_list: []
+  });
+  const { data } = await kgBookListAPI({ kg_id });
+  if (data) kgInfo.value = data;
+  kgInfo.value.book_list.forEach(item => {
+    item.show = true; // 默认显示所有，给搜索功能留的hook
+  });
+  // 有空格分割name
+  if (kgInfo.value.name.indexOf(' ') > -1) {
+    kgInfo.value.multi_name = kgInfo.value.name.split(' ');
+  }
+  if (!kgInfo.value.book_list.length) {
+    emptyStatus.value = true;
+  }
+  return {
+    kg_id,
+    kgInfo,
+    emptyStatus
+  }
+}

+/*
+ * @Author: hookehuyr hookehuyr@gmail.com
+ * @Date: 2022-05-18 14:31:26
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-05-30 10:18:19
+ * @FilePath: /tswj/src/composables/useDefaultPerf.js
+ * @Description: 
+ */
+import { ref } from 'vue'
+import axios from '@/utils/axios';
+import { Toast } from 'vant';
+
+/**
+ * @description: 获取默认儿童信息
+ * @param {*} bookId
+ * @param {*} params
+ * @param {*} avatar
+ * @param {*} name
+ * @param {*} price
+ * @param {*} user_id
+ * @param {*} perf_id
+ * @param {*} perf_name
+ * @param {*} can_upload
+ * @param {*} can_upload
+ * @param {*} can_upload
+ * @param {*} message
+ * @return {*}
+ */
+export const useDefaultPerf = (bookId) => {
+  // 金数据准备数据
+  const userInfo = ref({})
+
+  axios.get('/srv/?a=default_perf', {
+    params: {
+      book_id: bookId
+    }
+  })
+  .then(res => {
+    if (res.data.code === 1) {
+      userInfo.value = {
+        book_id: res.data.data.book_id,
+        avatar: res.data.data.book_cover,
+        name: res.data.data.book_name,
+        price: res.data.data.book_price,
+        user_id: res.data.data.user_id,
+        perf_id: res.data.data.perf_id,
+        perf_name: res.data.data.perf_name,
+        can_upload: res.data.data.can_upload, //  can_upload ：1=可上传，-1=用户没有实名，-2=用户没有儿童表演者
+        // can_upload: -1, //  can_upload ：1=可上传，-1=用户没有实名，-2=用户没有儿童表演者
+      }
+    } else {
+      console.warn(res);
+      if (!res.data.show) return false;
+      Toast({
+        icon: 'close',
+        message: res.data.msg
+      });
+    }
+  })
+  .catch(err => {
+    console.error(err);
+  });
+  return {
+    userInfo
+  }
+}

+/*
+ * @Date: 2022-06-22 00:07:42
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-30 13:45:54
+ * @FilePath: /tswj/src/composables/useLogin.js
+ * @Description: 文件描述
+ */
+import { bLoginAPI } from '@/api/B/login'
+import { useRouter } from 'vue-router'
+import { wxInfo } from '@/utils/tools';
+import { ref } from 'vue'
+import { useCountDown } from '@vant/use';
+import { smsAPI } from '@/api/common'
+import { Toast } from 'vant'
+
+export const useLogin = () => {
+  const phone = ref('');
+  const code = ref('')
+
+  const refForm = ref(null);
+  const validateForm = () => {
+    const valid = refForm.value.validate();
+    valid
+      .then(() => {
+        refForm.value.submit();
+      })
+      .catch(error => {
+        console.error(error);
+        Toast({
+          message: '请检查后再次提交',
+          icon: 'cross',
+        });
+      })
+  }
+
+  /**
+   * 判断微信环境看是否弹出控件框
+   * 桌面微信直接输入
+   * 其他环境弹出输入框
+   */
+  let use_widget = ref(true);
+  use_widget.value = !!(wxInfo().isiOS || wxInfo().isAndroid);
+
+  /**
+   * 手机号码校验
+   * 函数返回 true 表示校验通过，false 表示不通过
+   * @param {*} val 
+   */
+  const sms_disabled = ref(true);
+  const phoneValidator = (val) => {
+    let flag = false;
+    // 简单判断手机号位数
+    if (/1\d{10}/.test(val) && phone.value.length === 11) {
+      sms_disabled.value = false;
+      flag = true;
+    } else {
+      sms_disabled.value = true;
+      flag = false;
+    }
+    return flag
+  };
+
+  /**
+   * 手机号数字弹框
+   */
+  const keyboard_show = ref(false);
+  const refPhone = ref(null)
+  const showKeyboard = () => { // 弹出数字弹框
+    keyboard_show.value = true;
+  };
+  const keyboardBlur = () => { // 数字键盘失焦回调
+    keyboard_show.value = false;
+    refPhone.value.validate();
+  };
+
+  // 设置发送短信倒计时
+  // TAG: vant 自带倒计时函数
+  const limitSeconds = ref(60000); // 配置倒计时秒数
+  const countDown = useCountDown({ // 配置倒计时
+    time: limitSeconds.value,
+    onFinish: () => {
+      countDown.reset();
+    }
+  });
+
+  const sendCode = async () => { // 发送验证码
+    countDown.start();
+    // 验证码接口
+    const { code } = await smsAPI({ phone: phone.value });
+    if (code) {
+      Toast.success('发送成功');
+    }
+  };
+
+  // 过滤输入的数字 只能四位
+  const smsFormatter = (value) => value.substring(0, 4);
+
+  /**
+   * 用户登录
+   * @param {*} phone 
+   * @param {*} pin 
+   */
+  const $router = useRouter();
+  const onSubmit = async (values) => {
+    const { code } = await bLoginAPI({ phone: values.phone, pin: values.code })
+    if (code) {
+      $router.push({
+        path: '/business/index'
+      });
+    }
+  };
+
+  return {
+    phone,
+    code,
+    onSubmit,
+    use_widget,
+    sms_disabled,
+    phoneValidator,
+    keyboardBlur,
+    keyboard_show,
+    showKeyboard,
+    refPhone,
+    refForm,
+    validateForm,
+    smsFormatter,
+    limitSeconds,
+    countDown,
+    sendCode,
+  }
+}

+/*
+ * @Date: 2022-06-12 22:51:21
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-13 01:01:33
+ * @FilePath: /tswj/src/composables/useMessageList.ts
+ * @Description: 测试处理列表查询功能中的重复代码问题
+ * 感觉复用意义不大，这么写反而很麻烦
+ */
+import { Ref, ref } from 'vue'
+import { myCommentAPI } from '@/api/C/me'
+import _ from 'lodash'
+import { commentListType } from '@/@types/message/interface';
+import {
+  loading,
+  finished,
+  limit,
+  offset,
+  finishedTextStatus,
+  emptyStatus,
+} from '@/composables/variable';
+
+// scrollList的类型是个麻烦，其他地方调用时类型不一定一样
+function fn(data: [], scrollList: Ref<commentListType[]>) {
+// function fn(data: [], scrollList: any) {
+  // 数据全部加载完成
+  if (!data.length) {
+    // 加载状态结束
+    finished.value = true;
+  }
+  scrollList.value = [...scrollList.value, ...data];
+  offset.value = scrollList.value.length;
+  loading.value = false;
+  // 隐藏loading标识，空列表图标
+  if (!scrollList.value.length) {
+    finishedTextStatus.value = false;
+    emptyStatus.value = true;
+  } else {
+    emptyStatus.value = false;
+  }
+
+  return {
+    scrollList,
+    finished,
+    loading,
+    finishedTextStatus,
+    emptyStatus,
+  };
+}
+
+export const useMessageList = () => {
+  // 我的留言接口联调
+  const scrollList = ref<commentListType[]>([]);
+  let obj = {
+    scrollList,
+    finished,
+    loading,
+    finishedTextStatus,
+    emptyStatus,
+  };
+
+  const onLoad = async () => {
+    const { data } = await myCommentAPI({ limit: limit.value, offset: offset.value });
+    data.forEach((item: { target_name: string | null | undefined; c_action: string; c_name: string; }) => {
+      let arr = _.split(item.target_name, '@'); // 分割评论的动作和姓名
+      item.c_action = arr[0]; // 评论动作
+      item.c_name = arr[1]; // 评论姓名
+    });
+    // fn把重复代码抽离
+    obj = fn(data, scrollList);
+  }
+
+  return {
+    onLoad,
+    scrollList: obj.scrollList,
+    loading: obj.loading,
+    finished: obj.finished,
+    finishedTextStatus: obj.finishedTextStatus,
+    emptyStatus: obj.emptyStatus,
+  };
+}

+import { $, _, storeToRefs, mainStore } from '@/utils/generatePackage'
+
+/**
+ * 页面滚动恢复
+ * @returns 
+ */
+export const useScrollTop = () => {
+  const store = mainStore();
+  const resetScrollTop = (key) => {
+    // 嵌套滚动，执行两个，先滚外面再滚里面
+    _.times(2, () => {
+      $("html,body").animate({ "scrollTop": String(storeToRefs(store)[key].value) + 'px' });
+    });
+  }
+  return {
+    resetScrollTop,
+    store
+  }
+}

+/*
+ * @Date: 2022-06-13 17:42:32
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-18 21:14:42
+ * @FilePath: /tswj/src/composables/useShare.js
+ * @Description: 文件描述
+ */
+import wx from 'weixin-js-sdk';
+// import { Toast } from 'vant';
+
+/**
+ * @description: 微信分享功能
+ * @param {*} title 标题
+ * @param {*} desc 描述
+ * @param {*} imgUrl 图标
+ * @return {*}
+ */
+export const sharePage = ({title = '童声无界', desc = '共读一本书，传递一份爱。', imgUrl = 'http://voice.onwall.cn/f/voice/images/weixin_logo.jpg'}) => {
+  const shareData = {
+    title, // 分享标题
+    desc, // 分享描述
+    link: location.origin + location.pathname + location.hash, // 分享链接，该链接域名或路径必须与当前页面对应的公众号 JS 安全域名一致
+    imgUrl, // 分享图标
+    success: function () {
+      // console.warn('设置成功');
+    }
+  }
+  // 分享好友（微信好友或qq好友）
+  wx.updateAppMessageShareData(shareData);
+  // 分享到朋友圈或qq空间
+  wx.updateTimelineShareData(shareData);
+  // 分享到腾讯微博
+  wx.onMenuShareWeibo(shareData);
+
+  // // 获取“分享给朋友”按钮点击状态及自定义分享内容接口（即将废弃）
+  // wx.onMenuShareAppMessage(shareData);
+  // // 获取“分享到朋友圈”按钮点击状态及自定义分享内容接口（即将废弃）
+  // wx.onMenuShareTimeline(shareData);
+  // // 获取“分享到QQ”按钮点击状态及自定义分享内容接口（即将废弃）
+  // wx.onMenuShareQQ(shareData);
+}

+import { useRoute } from 'vue-router';
+import { ref } from 'vue';
+import { Cookies } from '@/utils/generatePackage'
+
+export const useShortcutBar = (item) => {
+  const $route = useRoute();
+  const path = $route.path;
+  const isClient = Cookies.get('userType') === 'client' ? true : false; // 判断C端入口位置，访客/客户
+  // const case1 = ['home', 'me', 'rank'];
+  // const case2 = ['home'];
+  // const case3 = ['me'];
+  const shortcutItem = ref([]);
+
+  // 配置快捷跳转条
+  if (item) {
+    shortcutItem.value = item;
+  } else {
+    if (path === '/client/chooseBook') { // 爱心捐书页面
+      if (isClient) {
+        shortcutItem.value = ['home', 'me', 'rank']
+      } else {
+        shortcutItem.value = ['me']
+      }
+    }
+
+    if (path === '/client/donateCertificate') {
+      shortcutItem.value = ['home']
+    }
+
+    if (path === '/business/index') {
+      shortcutItem.value = ['me']
+    }
+  }
+
+  return {
+    shortcutItem
+  }
+}

+import { ref } from 'vue'
+import axios from '@/utils/axios';
+import _ from 'lodash'
+import { Toast } from 'vant';
+
+export const useUnwatchList = () => {
+  // 绑定页面数据
+  const prod_list = ref([]);
+  const limit = ref(10)
+  const offset = ref(0)
+
+  // 处理书籍下作品列表
+  const loading = ref(false);
+  const finished = ref(false);
+
+  // 因为不能让空图标提前出来的写法
+  const finishedTextStatus = ref(false);
+  const emptyStatus = ref(false);
+
+  /**
+   * 向下滚动查询数据
+   */
+  const onLoad = () => {
+    // 异步更新数据
+    axios.get('/srv/?a=my_unplay', {
+      params: {
+        limit: limit.value,
+        offset: offset.value
+      }
+    })
+      .then(res => {
+        if (res.data.code === 1) {
+          prod_list.value = _.concat(prod_list.value, res.data.data.prod);
+          prod_list.value = _.uniqBy(prod_list.value, 'id');
+          _.each(prod_list.value, (item) => {
+            item.type = 'read-only' // 特殊标识，判断入口 为keepAlive使用
+          })
+          offset.value = prod_list.value.length;
+          loading.value = false;
+          // 数据全部加载完成
+          if (!res.data.data.prod.length) {
+            // 加载状态结束
+            finished.value = true;
+          }
+          // 空数据提示
+          if (!prod_list.value.length) {
+            finishedTextStatus.value = false;
+            emptyStatus.value = true;
+          }
+        } else {
+          // tslint:disable-next-line: no-console
+          console.warn(res);
+          if (!res.data.show) return false;
+          Toast({
+            icon: 'close',
+            message: res.data.msg
+          });
+        }
+      })
+      .catch(err => {
+        // tslint:disable-next-line: no-console
+        console.error(err);
+      })
+  };
+
+  return {
+    onLoad,
+    prod_list,
+    finished,
+    loading,
+    finishedTextStatus,
+    emptyStatus,
+  }
+}

+/*
+ * @Date: 2022-05-10 12:15:14
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-29 23:36:29
+ * @FilePath: /tswj/src/composables/useUpload.js
+ * @Description: 图片上传模块
+ */
+import { v4 as uuidv4 } from 'uuid';
+import { ref, reactive } from 'vue'
+import { qiniuTokenAPI, qiniuUploadAPI, saveFileAPI } from '@/api/common'
+
+export const useUpload = () => {
+  let lock_btn = ref(false); // 保存按钮锁
+  let fileList = ref([]);
+  let upload_image = reactive({ src: '' });
+  const afterRead = async (res) => {
+    lock_btn.value = true; // 上传开始, 不能保存
+    let affix = uuidv4();
+    // 此时可以自行将文件上传至服务器
+    let dataURL = res.content;
+    let base64url = dataURL.slice(dataURL.indexOf(',') + 1);  // 截取前缀的base64   data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAnoAAAJeCAYAA.......
+    // 获取七牛token
+    const { token, key, code } = await qiniuTokenAPI({ filename: `${affix}_${res.file.name}`, file: base64url });
+    if (code) {
+      const config = {
+        headers: {
+          'Content-Type': 'application/octet-stream',
+          'Authorization': 'UpToken ' + token,    // UpToken后必须有一个 ' '(空格)
+        }
+      }
+      // 上传七牛服务器
+      const { filekey, hash, image_info } = await qiniuUploadAPI('http://upload.qiniup.com/putb64/-1/key/' + key, base64url, config)
+      if (filekey) {
+        // 保存图片
+        const { data } = await saveFileAPI({ filekey, hash, format: image_info.format, height: image_info.height, width: image_info.width });
+        upload_image.src = data.src;
+        lock_btn.value = false; // 头像上传完成, 打开锁
+      }
+    }
+  };
+  const beforeDelete = () => { // 删除图片回调
+    upload_image.src = '';
+    return true;
+  }
+
+  return {
+    lock_btn,
+    fileList,
+    upload_image,
+    afterRead,
+    beforeDelete
+  }
+}

+import { ref } from 'vue'
+import axios from '@/utils/axios';
+import { Toast } from 'vant';
+
+export const idCard = () => {
+  /**
+   * 检查用户是否已实名认证 (实名认证后可以上传作品，留言)
+   */
+  const can_use = ref(false)
+    axios.get('/srv/?a=can_upload')
+      .then(res => {
+        if (res.data.code === 1) {
+          can_use.value = res.data.data.can_upload ? true : false;
+        } else {
+          console.warn(res);
+          if (!res.data.show) return false;
+          Toast({
+            icon: 'close',
+            message: res.data.msg
+          });
+        }
+      })
+      .catch(err => {
+        console.error(err);
+      })
+
+      return {
+        can_use
+      }
+  }

+/*
+ * @Date: 2022-05-05 18:07:16
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-10-01 21:13:07
+ * @FilePath: /tswj/src/composables/useVideoList.js
+ * @Description: 文件描述
+ */
+import { ref } from 'vue'
+import axios from '@/utils/axios';
+import _ from 'lodash'
+import { Toast } from 'vant';
+import { useRoute } from 'vue-router'
+import { bookInfoAPI } from '@/api/C/book'
+import { flowFn } from '@/hooks/useFlowFn'
+
+export const useVideoList = () => {
+  const $route = useRoute();
+  // 切换视频语言
+  const checkMandarin = ref(true); // 普通话选项卡
+  const checkLocalism = ref(false); // 方言选项卡
+  const chooseLanguage = ref({ text: '普通话', val: '普通话' }); // 默认选中普通话
+  /**
+   * 切换视频语言回调
+   * @param {*} type
+   */
+  const toggleLanguage = (type) => {
+    if (type === 'mandarin') {
+      checkMandarin.value = true;
+      checkLocalism.value = false;
+    } else {
+      checkMandarin.value = false;
+      checkLocalism.value = true;
+    }
+    // 修改默认语言绑定数据
+    if (checkLocalism.value) {
+      // tslint:disable-next-line:no-string-literal
+      chooseLanguage.value = { text: columns.value[0]['text'], val: columns.value[0]['val'] }
+    } else {
+      chooseLanguage.value = { text: '普通话', val: '普通话' };
+    }
+    // 切换语言需要更新列表数据
+    onReload()
+  }
+
+  // 方言选择项
+  let columns = ref([
+    { text: '所有方言', val: '所有方言' },
+  ])
+  //
+  axios.get('/srv/?a=localism_list&book_id=' + $route.query.id)
+  .then(res => {
+    if (res.data.code === 1) {
+      let arr = [];
+      _.each(res.data.data, item => {
+        arr.push({
+          text: item,
+          val: item
+        })
+      });
+      columns.value = _.concat(columns.value, arr);
+    } else {
+      // tslint:disable-next-line: no-console
+      console.warn(res);
+      if (!res.data.show) return false;
+      Toast({
+        icon: 'close',
+        message: res.data.msg
+      });
+    }
+  })
+  .catch(err => {
+    // tslint:disable-next-line: no-console
+    console.error(err);
+  })
+
+  const showPicker = ref(false);
+
+  /**
+   * 选择方言确认后回调
+   * @param {*} param
+   */
+  const onConfirm = ({ selectedOptions }) => {
+    showPicker.value = false;
+    chooseLanguage.value = {
+      text: selectedOptions[0].text,
+      val: selectedOptions[0].val
+    }
+    onReload()
+  };
+
+  // 绑定页面数据
+  const bookInfo = ref('');
+  // tslint:disable-next-line: variable-name
+  const prod_list = ref([]);
+  const limit = ref(10)
+  const offset = ref(0)
+
+  // 处理书籍下作品列表
+  const loading = ref(false);
+  const finished = ref(false);
+
+  // 因为不能让空图标提前出来的写法
+  const finishedTextStatus = ref(false);
+  const emptyStatus = ref(false);
+
+  /**
+   * 向下滚动查询数据
+   */
+  const onLoad = async () => {
+    // 异步更新数据
+    const { data, code } = await bookInfoAPI({ book_id: $route.query.id, kg_id: $route.query.kg_id ? $route.query.kg_id : 0, localism_type: chooseLanguage.value.text, limit: limit.value, offset: offset.value })
+    if (code === 1) {
+      bookInfo.value = data;
+      flowFn(data.prod_list, prod_list, offset, loading, finished, finishedTextStatus, emptyStatus);
+    }
+  };
+
+  /**
+   * 重载刷新程序
+   */
+  const onReload = () => {
+    offset.value = 0
+    prod_list.value = []
+    loading.value = true;
+    finished.value = false;
+    onLoad()
+  }
+
+  return {
+    toggleLanguage,
+    onLoad,
+    columns,
+    prod_list,
+    finished,
+    loading,
+    bookInfo,
+    showPicker,
+    checkLocalism,
+    checkMandarin,
+    onConfirm,
+    chooseLanguage,
+    finishedTextStatus,
+    emptyStatus,
+  }
+}

+/*
+ * @Date: 2022-06-12 23:54:24
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-13 00:50:29
+ * @FilePath: /tswj/src/composables/variable.js
+ * @Description: 文件描述
+ */
+import { ref } from 'vue';
+
+export const loading = ref(false);
+export const finished = ref(false);
+export const limit = ref(5);
+export const offset = ref(0)
+export const finishedTextStatus = ref(false);
+export const emptyStatus = ref(false);

+/*
+ * @Author: hookehuyr hookehuyr@gmail.com
+ * @Date: 2022-05-25 18:34:17
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-30 16:55:15
+ * @FilePath: /tswj/src/constant.js
+ * @Description: 
+ */
+// 金数据表单 - 家长端（废弃）
+export const JSJ_FORM_C = 'https://jsjs.onwall.cn/f/NAGn1D';
+// 金数据表单 - 家长端（普通话/方言）
+export const JSJ_FORM_MANDARIN = 'https://jsjs.onwall.cn/f/NAGn1D';
+export const JSJ_FORM_LOCALISM = 'https://jsjs.onwall.cn/f/HFdZIx';
+
+// 金数据表单 - 老师端
+export const JSJ_FORM_B = 'https://jsj.onwall.cn/f/g7D0MT';
+
+// 颜色变量
+export const styleColor = {
+  baseColor: '#11D2B1',
+  baseFontColor: '#FFFFFF'
+}
+
+/**
+ * 客户端类型
+ * @param CLIENT 家长端
+ * @param BUSINESS 老师端
+ */
+export const USER_ROLE = {
+  CLIENT: 'C',
+  BUSINESS: 'B',
+}
+
+/**
+ * 用户身份
+ * @param CHILDREN 儿童
+ * @param VISIT 访客
+ * @param KINDERGARTEN 幼儿园
+ */
+export const USER_TYPE = {
+  CHILDREN: 'C',
+  VISIT: 'V',
+  KINDERGARTEN: 'K',
+}
+
+// 默认视频封面
+export const DEFAULT_COVER = 'http://gyzs.onwall.cn/tswj_vidieo_cover.jpg'
+
+/**
+ * 用户操作状态
+ * @param PASS 正常
+ * @param NON_VERIFIED 未实名认证
+ * @param NON_DEFAULT_CHILD 没有默认儿童
+ */
+export const USER_STATUS = {
+  PASS: 1,
+  NON_VERIFIED: -1,
+  NON_DEFAULT_CHILD: -2
+}

+/*
+ * @Author: hookehuyr hookehuyr@gmail.com
+ * @Date: 2022-05-14 23:28:39
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-07 22:49:56
+ * @FilePath: /tswj/src/env.d.ts
+ * @Description:
+ */
+interface ImportMetaEnv extends Readonly<Record<string, string>> {
+  readonly VITE_OPENID: string;
+  readonly VITE_ID: string;
+  readonly VITE_PIN: string;
+  readonly VITE_APPID: string;
+}
+
+interface ImportMeta {
+  readonly env: ImportMetaEnv
+}

+/**
+ * 依赖注入命名集合
+ */
+export const myInjectionKey = Symbol()
+export const fooInjectionKey = Symbol()

+import { provide, inject } from "vue";
+
+// const key = Symbol();
+
+/**
+ * 创建全局变量
+ * @param {*} context 
+ * @param {*} key 
+ */
+export function createContext(context, key) {
+  provide(key, context)
+}
+/**
+ * 使用全局变量
+ * @param {*} key 
+ * @returns 
+ */
+export function useContext(key) {
+  return inject(key)
+}

+/*
+ * @Author: hookehuyr hookehuyr@gmail.com
+ * @Date: 2022-05-28 22:31:25
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-05-30 10:18:09
+ * @FilePath: /tswj/src/hooks/useDebounce.js
+ * @Description: 
+ */
+import _ from 'lodash';
+/**
+ * 封装lodash防抖
+ * @param {*} fn 执行函数
+ * @param {*} timestamp 执行间隔
+ * @param {*} options 函数配置 - 在延迟开始前调用，在延迟结束后不调用
+ * @returns 返回新的 debounced（防抖动）函数。
+ */
+export const useDebounce = (fn, timestamp = 500, options = { leading: true, trailing: false }) => {
+  return _.debounce(fn, timestamp, options);
+}

+
+/**
+ * @description 封装简化滚动查询列表执行流程
+ * @param {*} data 接口返回列表数据
+ * @param {*} list 自定义列表
+ * @param {*} offset 
+ * @param {*} loading 
+ * @param {*} finished 
+ * @param {*} finishedTextStatus 
+ * @param {*} emptyStatus 
+ */
+import _ from 'lodash'
+
+export const flowFn = (data, list, offset, loading, finished, finishedTextStatus, emptyStatus) => {
+  list.value = _.concat(list.value, data);
+  list.value = _.uniqBy(list.value, 'id');
+  offset.value = list.value.length;
+  loading.value = false;
+  // 数据全部加载完成
+  if (!data.length) {
+    // 加载状态结束
+    finished.value = true;
+  }
+  // 空数据提示
+  if (!list.value.length) {
+    finishedTextStatus.value = false;
+  }
+  emptyStatus.value = Object.is(list.value.length, 0);
+}

+import { useRouter } from 'vue-router';
+
+/**
+ * 封装路由跳转方便行内调用
+ * @returns 
+ */
+export function useGo () {
+  let router = useRouter()
+  function go (path, query) {
+    router.push({
+      path: path,
+      query: query
+    })
+  }
+  return go
+}
+
+export function useReplace () {
+  let router = useRouter()
+  function replace (path, query) {
+    router.replace({
+      path: path,
+      query: query
+    })
+  }
+  return replace
+}

+import { mainStore } from '@/utils/generatePackage.js'
+
+// 删除 keep-alive 缓存
+export const store = mainStore();
+
+export const killPages = () => {
+  store.changeKeepPages();
+}
+
+export const addPages = () => {
+  store.keepThisPage();
+}

+/*
+ * @Author: hookehuyr hookehuyr@gmail.com
+ * @Date: 2022-05-31 12:06:19
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-29 22:00:37
+ * @FilePath: /tswj/src/main.js
+ * @Description: 
+ */
+import { createApp } from 'vue';
+import { Button, Image as VanImage, Col, Row, Icon, Form, Field, CellGroup, ConfigProvider, Toast, Uploader, Empty, Tab, Tabs, Overlay, NumberKeyboard, Lazyload, List, PullRefresh, Popup, Picker, Sticky, Stepper, Tag, Swipe, SwipeItem, Dialog, ActionSheet, Loading, Checkbox, Search } from 'vant';
+import router from './router';
+import App from './App.vue';
+// import axios from './utils/axios';
+import axios from '@/utils/axios';
+// import 'default-passive-events'; // 解决Chrome控制台non-passive event listener输出问题
+import { createPinia } from 'pinia';
+
+const pinia = createPinia();
+const app = createApp(App);
+
+app.config.globalProperties.$http = axios; // 关键语句
+
+app.use(pinia).use(router).use(Button).use(VanImage).use(Col).use(Row).use(Icon).use(Form).use(Field).use(CellGroup).use(Toast).use(Uploader).use(Empty).use(Tab).use(Tabs).use(Overlay).use(NumberKeyboard).use(Lazyload).use(List).use(PullRefresh).use(Popup).use(Picker).use(Sticky).use(Stepper).use(Tag).use(Swipe).use(SwipeItem).use(Dialog).use(ActionSheet).use(Loading).use(Checkbox).use(Search).use(ConfigProvider);
+
+app.mount('#app');

+const routes = [{
+  path: '/image',
+  redirect: '',
+  name: 'html转图片',
+  component: 'html2canvas',
+  keepAlive: '',
+  meta: {
+    title: 'html转图片',
+    name: ''
+  },
+  children: [{
+    path: 'children',
+    redirect: '',
+    name: 'html转图片',
+    component: 'children-test',
+    keepAlive: '',
+    meta: {
+      title: 'html转图片',
+      name: ''
+    }
+  }]
+}]
+// const routes = []
+
+export default routes

+const data = [
+    {
+      "case_id": "424589807164071936",
+      "code": "N06",
+      "title": "复旦管理学奖励基金会",
+      "detail": "我国自古就有优秀的管理思想和实践，但中国现代管理科学则是在改革开放之后才逐步发展起来的。为进一步推动我国现代管理科学发展，原中共中央政治局常委、国务院副总理李岚清同志于2005年发起成立了复旦管理学奖励基金会，这也是中国人自己设立的管理学界第一个奖励基金会。\r\n“要真正解决好中国的管理问题，最终还是要依靠中国人自己。”这句话道出了“管理”必须根植于一个国家的社会组织和民族文化。管理科学，是兴国之道，也是一个国家软实力的重要组成部分。\r\n十六年来，基金会各项管理逐步完善，2020年首次参加社会组织等级评估即被授予“5A级社会组织”荣誉称号；FTI透明指数排名连获最优等级。基金会的评奖工作，及其开展的一系列公益项目，获得了来自各界人士的一致认可；同时借助媒体之力，不断拓宽公众对中国管理学的认识边界，受益人数不断增加。如今，基金会已逐渐发展成为中国管理学界最具影响力、最具公信力的基金会。\r\n作为一个“奖励性”的基金会，我们希望打造中国管理学界的“诺贝尔奖”。基金会目前设立了“复旦管理学杰出贡献奖”“复旦管理学终身成就奖”“复旦企业管理杰出贡献奖”三大奖项，已成为我国管理学界享有崇高声誉、具有广泛影响力的重要奖项。截至2020年，已评选出57位获奖人，他们中不乏成思危、苏东水等矢志推动中国特色的管理学及其研究走向世界的杰出专家学者，亦有张瑞敏、任正非等对中国管理学不断实践、探索的优秀民族企业家。\r\n评奖之外，基金会还积极开展了丰富多样的公益活动。自2013年起，面向我国高等学府，面向青年师生，面向中西部地区举办了“校园公益”系列讲座活动，辐射师生5000余人。\r\n联合我国管理学一级学会，举办了一系列具有国际影响力的管理学学术盛会。其中，“中国管理学年会”是中国管理学领域规模最大、层次最高的综合性学术会议。另外，基金会通过支持“中国管理学青年论坛”，为有潜力的优秀青年架起了跨学科、跨层次的学习交流平台，旨在培养中国管理学的中青年力量。\r\n为加强学术界和实业界的合作，基金会充分发挥“桥梁·引领·赋能”作用，做到将“管理学带出去”，“管理领进来”，邀请获奖人、专家学者与企业家共话“管理”。\r\n基金会还与复旦大学东方管理研究院、第一财经合作开展了“中国杰出企业家管理思想访谈录”项目，已通过42集电视专题片、6部《改变世界》、14本研究丛书等形式对外发布，另有10多个优秀案例走进了高校课堂，收益人数达10亿多人。\r\n基金会积极响应习近平总书记“把论文写在祖国大地上”的号召，与《管理学报》合作，举办专题学术研讨会，开辟“中国企业家管理思想”专栏；与知名企业合作开展“海尔生态雨林计划”等专项研究。\r\n2020年新冠疫情的突发，对全国各地的公共卫生治理都是前所未有的考验。为总结出应对疫情的科学、高效的经验，提供疫情应对经验给相关部门，基金会资助了“新冠疫情防控防治的中国特色管理理论与方法”系列专著及案例研究。于基金会而言，这件事意义非常。\r\n作为一个扎根于中国管理学领域发展的公益组织，基金会在各级领导的亲切关怀下不断发展。获奖人所提出管理思想、管理理论和实践的创新、各项公益活动等，对于上海乃至全国各地的社会治理、公共管理与企业管理都发挥了重要的作用。在每年的颁奖典礼上，历任上海市领导均受邀出席并致辞。当今世界正面临百年未有的大变局，发展中国特色的管理学、并让中国特色管理学发挥更大的影响力，这比任何时候都更加迫切。在未来的公益发展事业中，基金会将继续助力中国特色管理学的探索和创新，为增强上海自主创新能力，提高城市国际竞争力，做出新的重大的贡献！",
+      "cover": {
+        "name": "N06.jpg",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N06.jpg",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "video": {
+        "name": "N06.mp4",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N06.mp4",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "status": "ENABLE",
+      "public_vote": 3406,
+      "score": 0,
+      "award": null,
+      "optr_date": "2021-12-31T15:50:00.547Z",
+      "corp": {
+        "name": "复旦管理学奖励基金会"
+      },
+      "voted": false,
+      "liked": false
+    },
+    {
+      "case_id": "419178326515888128",
+      "code": "N14",
+      "title": "上海市普陀区长寿社会组织联合会",
+      "detail": "近年来，各类社区社会组织数量增长，规模扩大，社会组织日趋成为服务社区发展，提升社区治理水平的重要力量。所以以服务中心传统的点对点形式来去服务社会组织，已经不符合形势的发展，亟待搭建新的平台。在这种情势下，2016年长寿社会组织联合会孕育而生。长寿社会组织联合会是全市首家街道层面社会组织联合会。联合会以党建为引领，创新构建社区、社会组织、社会组织联合会的联动机制，这种全新模式不仅为社区与社会组织之间搭建了交流对接平台，也为促进社会组织自律自治、资源共享、健康发展创造了良好的条件。\n联合会运行以来，正式会员近百家。目前，长寿社会组织联合会成员中已有区党代表、区人大代表、区政协委员，充分激发社会组织领军人物的参与度，发挥社会组织自我管理、自我服务的能效。\n创新党建引领社会组织参与社区治理是我们的工作特色之一。2016年我们同步成立联合会党总支，党总支通过“价值引领、服务凝聚、同心共治”凝聚党员力量，提升基层组织活力。目前，党总支下设20个党组织、6个联合支部，14个独立支部。联合会自成立以来开展了一系列凝聚力建设活动，包括开展情景党课、建立学习教育体验站等等，我们还努力将公益理念引入党建活动，例如开展垃圾分类主题党日活动。通过这些活动和服务，不仅会员们的凝聚力日益增强，更是聚拢到了一批原先游离在边缘的社会组织。\n搭建公益服务平台也是我们最大的工作特色。我们通过公益秀、公益项目菜单、公益集市等形式将社会服务和项目精准化地投放到我们两新组织、楼宇和居民区，政府购买社会组织服务项目的数量及社区参与面都有了一个较大幅度的提升。\n在新媒体时代，为了更加方便项目对接，社联会依托微信公众号平台，于18年9月正式上线了长寿公e家网站。公e家的推出填补了20万以下政府采购服务对接渠道的空白。居民区科室可以进行社区需求发布，社会组织发布服务内容，这样以来加快了信息传递速率，实现了项目精准对接。例如，我们会在学生的暑假开展暑期班公益项目，让公益项目走进社区、走进百姓生活中。项目结项后，我们会举办成果展，把项目的成果进行公示，并在公E家上给承接方打分，能够让购买方一目了然地了解社会组织的服务能力。通过这样一个平台，我们让长寿的社会组织能真正了解到社区的需求，因地制宜地研发适合长寿、服务长寿的公益项目。尤其在疫情的冲击下，公E家的优势更加得到了肯定。2016年以来我们通过线上线下的渠道共举办了115个公益项目、300余场活动，有效实现社会组织与居民需求的“无缝对接”。\n我们在实践中摸索，完善中创新。展望未来，长寿社会组织联合会也将不断探索，下一步的计划是“请进来、走出去”，长寿社会组织联合会将联合其他街镇乃至其他区县的社会组织共同协作，打破社会组织属地化壁垒，提升他们视野和竞争力，因地制宜的研发出服务社区的公益项目，让公益的力量势如破竹，为打造精彩长寿、善美普陀和公益上海添砖加瓦。",
+      "cover": {
+        "name": "N14.jpg",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N14.jpg",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "video": {
+        "name": "N14.mp4",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N14.mp4",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "status": "APPLY",
+      "public_vote": 3346,
+      "score": 0,
+      "award": null,
+      "optr_date": "2021-12-31T15:50:00.547Z",
+      "corp": {
+        "name": "上海市普陀区长寿社会组织联合会"
+      },
+      "voted": false
+    },
+    {
+      "case_id": "419527762110595072",
+      "code": "N04",
+      "title": "上海震旦教育发展基金会",
+      "detail": "上海震旦教育发展基金会成立于2015年，秉持弘扬公益精神，积极回报社会的办会宗旨，努力汇集各方力量、传递正能量。\r\n基金会主要以四项特色工作为主:\r\n(一)携手各方力量，关爱特殊人群\r\n震旦教育基金会已成功主办、协办多项全国性、市级助残公益活动。关爱自闭症特殊群体活动，主题鲜明、内容丰富、参与者众、受益面广。\r\n（二)共襄慈善良业，回报社区民众\r\n震旦教育基金会为社区建设作贡献。为黄浦社区加装电梯工程中做配套绿化改建项目，为居民提供了优美的绿化环境。\r\n基金会每年中国传统节日前向街道、镇、村老人、残疾人送去温暖与爱心。\r\n2020年疫情期间，震旦教育基金会为黄浦区各大医院、派出所等总共58家单位，送去价值28万余元的哈根达斯蛋糕，向日夜坚守在疫情防控第一线的工作人员送去慰问与祝福，为抗击疫情助力加油!\r\n（三)引领环保时尚，共倡整洁家园\r\n震旦教育基金会联合公益机构举办了多场大型环保艺术展，在浦东科技馆的“艺起减塑”历时90天，共接待观众逾13万人次，使参与者对环保、减塑、有了感性的认识，也认识到环保是我们全人类的职责与使命。\r\n（四)共同奉献爱心，基金奖励优秀\r\n震旦师生积极为抗疫捐款，把参与慈善公益事业作为每个人的社会责任与使命。在疫情之中，基金会表彰震旦职业学院17名驰援武汉的毕业生，给予每人2万元的奖励，鼓励和表彰他们无私无畏，挺身而出把人民生命安全放在首位的大无畏精神。\r\n震旦教育基金会近年来开展了50多项公益项目活动，受益人数16万余人次。震旦教育基金会将不忘初心，凝心聚力，坚毅前行，吸纳更多热心于慈善事业的有识之士参与，做更多造福于社会的公益活动。",
+      "cover": {
+        "name": "N04.jpg",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N04.jpg",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "video": {
+        "name": "N04.mp4",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N04.mp4",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "status": "REFUSE",
+      "public_vote": 4125,
+      "score": 0,
+      "award": null,
+      "optr_date": "2021-12-31T15:50:00.547Z",
+      "corp": {
+        "name": "上海震旦教育发展基金会"
+      },
+      "voted": false
+    },
+    {
+      "case_id": "420369007372419072",
+      "code": "N18",
+      "title": "上海青创社会服务中心",
+      "detail": "上海青创社会服务中心，AAAA级社会组织，是一家从事社会创新治理、公共空间营造与运维、公益活动策划以及媒体宣传于一体的枢纽型社会组织。机构在党建引领下茁壮成长，在上海城市更新、社会治理工作中发挥着积极重要的作用。\n党建引领社会组织发展\n上海青创坚持“党建引领促发展”的理念，目前团队规模超过70人，服务在上海创新治理的前沿，年服务人次超过30万。机构党支部拥有中共党员15名，这些党员既是业务骨干，也是治理先锋。在建党百年之际，上海青创成立了普陀区首家建在社会组织上的党群服务站。党建引领树立了青创人正确的价值观，为社会组织的发展保驾护航。机构理事长也先后荣获上海市五四青年奖章个人、上海市青年社区治理达人、普陀区优秀共产党员等荣誉。\n党建引领公益志愿服务\n通过“党建”带动“公益”的模式，青创公益在党支部的带领下，组建了多个青年志愿团队，参与到各项公益志愿服务当中。定期举办五福生日会为老系列服务；作为区文明单位，在创城行动中参与美化楼宇环境；积极响应“人民城市人民建，人民城市为人民”的理念，成立了苏州河护河队，助力苏州河环境治理工作；疫情期间组织员工在一线抗疫、慰问、捐款捐物，今年以来机构组织了一批又一批的员工和志愿者，参与疫苗接种的宣传和动员工作中；在党建引领之下，每年都有青年员工志愿加入民兵队伍，成为祖国国防力量的后备军。\n党建引领社会创新治理\n通过项目孵化团队，通过社区挖掘骨干，上海青创每年为超过100个社区提供赋能，培育社区项目负责人，强化自治共治，更好地推动社区治理体系和能力的现代化。通过空间培育志愿队伍，在机构参与运营的多个公共空间上面，不仅对驻点服务人员进行赋能提升，还把居民也动员起来，成为空间的小主人，进一步服务百姓，提升空间活力。机构理事长作为一名区政协委员，每年都会对上海社会治理工作积极地建言资政，为社会组织的发展而发声。\n坚持党建引领，才能促进社会组织健康有序的发展。在庆祝中国共产党成立100周年大会上，习近平总书记强调“新时代的中国青年，要以实现中华民族伟大复兴为己任，增强做中国人的志气、骨气、底气”。上海青创社会服务中心通过公益之申这个平台，以青年社会组织的身份表态：将不忘公益初心，在党建引领下，为上海创新社会治理工作添一份力。",
+      "cover": {
+        "name": "N18.jpg",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N18.jpg",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "video": {
+        "name": "N18.mp4",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N18.mp4",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "status": "ENABLE",
+      "public_vote": 5079,
+      "score": 0,
+      "award": null,
+      "optr_date": "2021-12-31T15:50:00.547Z",
+      "corp": {
+        "name": "上海青创社会服务中心"
+      },
+      "voted": false
+    },
+    {
+      "case_id": "420305782152998912",
+      "code": "N02",
+      "title": "上海静安区心灵导航心理咨询服务中心",
+      "detail": "上海静安区心灵导航心理咨询服务中心成立于2011年8月，作为一家开展专业心理服务的非营利性社会组织，始终以“热衷公益、不求回报，把爱心奉献社会，把专业与关怀传递给更多、更广的社会大众”作为服务宗旨，共同的公益理念聚集了200余名心理咨询师志愿者，在心灵导航党支部的带领下，关注社区心理健康，提供专业心理服务。\n二、专业服务关注社区心理健康\n走进社区、学校，楼宇，通过心理咨询、上门走访、心理辅导活动等形式在社区普及心理学知识，增强人们心理健康意识。设计并实施了“星星港”失独家庭心理疏导、“贫困青少年心理健康项目”、“安徽贫困青少年心理暑期夏令营”、“信访人员心理疏导”、“特殊人员心理疏导”等心理服务工作。服务人群涵盖了老人、青少年、白领、困境等群体，累计开展项目82个，服务58000人次。\n三、热心公益回馈社会\n疫情伊始，心灵导航第一时间以党支部为核心，党员心理咨询师为骨干力量，组建“心理服务志愿团队”，创建热线和微信通道，向社会免费开通，录制《新冠疫情心理微课程》，通过各种渠道宣传播放，为市民和一线防疫工作者提供及时必要的心理援助。热线服务除涵盖上海地区之外，还处理了来自武汉金银潭医院医护人员的热线求助，同时为新疆喀什地区和驻疆武警部队提供远程心理指导。热线累计服务156人次，目前热线已作为一项常态化工作。\n四、文化援疆心理援疆\n心灵导航积极参与“心理援疆”，大力支援边疆的心理健康体系建设，自2018年起已连续三年为新疆巴楚县和驻疆武警部队开展心理健康建设服务，成立了“心灵导航巴楚工作站”以及“驻疆部队心理援建服务中心”，运用远程线上授课、专家团队赴疆现场教学、组织心理骨干赴沪深造等形式，为新疆巴楚教育系统、公安系统、社区一线工作人员、驻疆武警部队培养了大量的心理服务骨干，并通过线上形式为当地有心理困扰的家庭和武警战士提供心理咨询服务，防止了严重事故的发生，受助者来电、来信表示感谢，武警三支队连续三年零事故。心理援疆服务取得良好成效，累计服务9000人次，得到驻疆武警部队和巴楚县委的高度评价和肯定。\n五、媒体报道报道\n1、中央电视台曾对心灵导航为失独家庭开展的心理服务进行过专题报道。\n2、学习强国平台和静安报对心灵导航疫情期间的工作进行了宣传报道。\n3、人民网、上海电视台对心理援疆进行了连续报导。\n六、获得荣誉\n于2020年被评为上海市文明单位，复评为4A级社会组织。",
+      "cover": {
+        "name": "N02.jpg",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N02.jpg",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "video": {
+        "name": "N02.mp4",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N02.mp4",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "status": "ENABLE",
+      "public_vote": 4446,
+      "score": 0,
+      "award": null,
+      "optr_date": "2021-12-31T15:50:00.547Z",
+      "corp": {
+        "name": "上海静安区心灵导航心理咨询服务中心"
+      },
+      "voted": false
+    },
+    {
+      "case_id": "419897909908398080",
+      "code": "N13",
+      "title": "上海市奉贤区民营经济协会",
+      "detail": "我们奉贤区民营经济协会的前身是奉贤县（区）个体劳动者协会和私营企业协会，成立于上世纪八十年代末。今年1月，为顺应形势发展需要，区民营经济协会的业务主管单位由奉贤区市场监督管理局变更为奉贤区工商联（总商会）,开创了全市先河。多年来，协会认真贯彻落实习近平总书记关于加强社会组织建设的一系列重要指示精神，紧紧围绕推进“两个健康”(民营经济健康发展和民营经济人士健康成长），强化“三个服务”（服务会员、服务经济、服务社会）坚持“建设四会”(政治建会、团结立会、服务兴会、改革强会)这一工作理念和职责任务，扎实开展各项工作，促进社会组织高质量发展。目前，协会会员达到6000多名，其中理事会员150余人。协会先后二次获得全国个私协会系统先进单位和5A级社团组织、上海市个私协会系统三八红旗集体、奉贤区十佳公益机构、“热心慈善无私奉献”先进单位等称号；还收获服务单位赠送的三十多面锦旗和几十封感谢信。\n在引领广大会员参与公益事业方面我们的主要做法是：\n---充分发挥党员先锋模范引领作用。积极组织党员、会员开展访贫问暖活动；组织并推动会员开展公益服务项目，积极参加青海、务川、精准扶贫、关心下一代等项目对接捐助等公益活动，共有500余人次弱势群体受益。立足会员需求，我会成立了志愿者协调小组、法律顾问小组，发挥老同志、法律工作者协调优势，帮助协调解决近百家会员企业在生产经营投资中面临的困难问题，维护其合法权益，有效发挥我会的“稳定器”作用。\n---充分发挥民营经济人士主体作用。我们于2015年7月在会员中积极组建“爱心”、“小皮匠”、“善之乐”、“医疗志愿”等四支百人志愿服务队，采用分散服务和相对集中服务模式，积极组织开展3.5学雷锋、4•15爱心活动、志愿者嘉年华、公益伙伴日和“三下乡大篷车”等活动，“益”起行动，传递爱的正能量。“4•15”爱心行动日活动是全市个私协会系统影响深远的一项“品牌”活动，已经持续开展了20多年。“小皮匠”志愿服务队从2010年成立时的几个人发展到目前的40多人，志愿服务群众达40万余人次，近五年累计志愿服务时长15120个小时，人均服务时长400小时。服务项目有理发、磨剪刀、修鞋、修表、配钥匙、义诊和各种咨询服务，深得社会各界的好评。\n---引导民营企业积极履行社会责任。去年年初，面对突如其来的新冠疫情，协会第一时间向会员企业发出《倡议书》，动员各会员企业积极响应党和政府号召，自觉履行社会责任，以捐款捐物的方式共同参与抗击疫情，据不完全统计，共有68家会员企业捐款捐物总计863万元；组织企业家参与“携手慈善，与爱同行”、“弘扬公益贤风共建美丽贤城”奉贤区9.5中华慈善日系列活动，捐赠善款达上千万元。\n积极引导和组织民营经济人士参与公益事业、履行社会责任是我们社会组织的重要职责。“新时代呼唤新作为，新征程谱写新篇章”。我们将坚定理想信念、永葆初心使命，以更强大的内生动力和昂扬的精神状态，在营造共建共治共享的社会治理格局中发挥更大的作用，为“温暖这座城”做出新的更大的贡献!",
+      "cover": {
+        "name": "N13.jpg",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N13.jpg",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "video": {
+        "name": "N13.mp4",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N13.mp4",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "status": "ENABLE",
+      "public_vote": 343,
+      "score": 0,
+      "award": null,
+      "optr_date": "2021-12-31T15:50:00.547Z",
+      "corp": {
+        "name": "上海市奉贤区民营经济协会"
+      },
+      "voted": false
+    },
+    {
+      "case_id": "429021582644748288",
+      "code": "N03",
+      "title": "上海大慈公益基金会",
+      "detail": "上海大慈公益基金会是由上海龙华古寺发起，于2015年1月18日成立的佛教界第一家非公募基金会。基金会以“大慈念一切，慧光照十方”为基本理念；以慈善回报社会，以慈爱构建和谐社会为使命。六年来共募集善款9220.9万元，使用善款5132.1万元，受益群体277118人。受助的对象有老人和儿童、本地困境家庭、国家级贫困地区、革命老区、少数民族地区，以及上海对口援助地区。\r\n基金会在文化传承等方面也有新的亮点，16个慈善项目不断升级，逐步形成大慈品牌，被中国社会组织评为4A级社会组织、并获上海市科普公益贡献奖、中国红十字会奉献奖、2020年度公益之申“十佳公益项目”等。理事长照诚法师多次获得“上海慈善之星”的称号。\r\n一、“明旸法师助学帮困基金”，通过连续十年总计1000万元的捐赠用于帮助上海在校的孤儿、身患重大疾病等困难家庭学生完成学业。五年来投入资金500万元、受助学生2700人。经第三方评估满意度为100%。\r\n此项目同时也带动了其他爱心企业的积极参与,光明乳业在我们资助的困境学生中每人每年再增加1000元的牛奶卡直到项目结束为止。2019年有一家爱心组织捐赠100万元来认领此项目，我们很高兴的看到基金会爱的种子在持续的发芽。\r\n二、“生命护航——儿童意外伤害”项目，秉承“救孩子,救家庭”的理念,切实有效的帮助遭受意外伤害的患儿家庭，应对突如其来的变故。截止到2020年共救助患儿195人,使用资金278.7万元。2018年我们将项目前移，把宣传教育与救治相结合。举办“儿童无伤害日”，切实守护儿童健康的梦想。\r\n三、2017年大慈基金会与上海市慈善基金会合作举办了“蓝天下的至爱--点亮心愿”慈善义拍。三年来共拍得善款2246.5万元，用于“先心病”手术等医疗项目。\r\n四、为了让革命老区上海对口支援地区的青少年享受到优质科学资源参与科普体验，建立“大慈流动科技馆”项目，四年来共投入资金178万元，共有13000多名孩子受益。\r\n五、利用大数据的优势，推动远程支教项目。对云南泸西县小学推送，让孩子们“走进”上海课堂感受优质教育。\r\n六、“大慈儿童普惠”项目,改善身处困境的儿童生活，该项目执行以来共有5424名孩子受助。\r\n七、2017年开始分别为河南固始等革命老区、云南对口支援地区培训优秀中青教师、校长共183名。\r\n八、“老教授健康关爱”专项基金项目，五年来共资助资金100万元。\r\n九、2018年、2019年在月饼的推广会上共募得资金245万元,全部用于本市残疾儿童等学校。\r\n十、新冠肺炎抗疫期间，捐赠物资1788.04万元，捐赠现金543万元。理事长照诚法师手书“福”字共计1892幅，同时又为1649名上海援鄂医务人员特别发行个性化邮票并定制了“抗疫英雄卡”。\r\n十一、基金会每季度都会开展“一路有你”微慈善项目。\r\n多年来，基金会在项目的运行中突出了三性，广泛性、多样性、特色性，并向专业、规范、制度化迈进。\r\n基金会将继续要以“为政府分忧，为百姓解难”为根本，做好政府想做百姓所需的项目，在人道救助领域倾力奉献。",
+      "cover": {
+        "name": "N03.jpg",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N03.jpg",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "video": {
+        "name": "N03.mp4",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N03.mp4",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "status": "ENABLE",
+      "public_vote": 3981,
+      "score": 0,
+      "award": null,
+      "optr_date": "2021-12-31T15:50:00.547Z",
+      "corp": {
+        "name": "上海大慈公益基金会"
+      },
+      "voted": false
+    },
+    {
+      "case_id": "424325105943162880",
+      "code": "N15",
+      "title": "上海喜雅爱心社区服务中心",
+      "detail": "喜雅爱心成立于12年，是5A级社会组织，曾获上海市先进社会组织等殊荣。中心共有48名员工，100多名志愿者，有独立的党支部，7名党员。在党建引领下我们积极开展各类公益活动，为服务社区居民贡献自己的力量。\n\n在我们的身边，有这样一群特殊的邻居——“阳光宝宝”，因为智力发育不完善，永远成为了我们关注的阳光宝宝，她们需要被照顾。当我第一次走进长宁区新泾镇“阳光之家”的时候，被这25名在校全日制“阳光宝宝”深深感动，他们乖巧可爱，懂礼貌知感恩，渴望朋友，渴望走出家庭，走出教室，走向社会。他们的年龄在26-47岁之间，他们的父母50-80岁，有的父母早已无力照顾自己的孩子。提升“阳光宝宝”独立生活的能力，让他们学着融入社会，这一生存问题刻不容缓。\n\n在上海市慈善基金会第二届“蓝天至爱计划”的资助下，“阳光宝宝成长计划”应运而生！我们得到了新泾镇人民政府的大力支持。作为项目总设计师，我发挥亲子艺术教育的专业特长，组织团队为“阳光宝宝”量身定制创作课程，结合非遗艺术传承，用宝宝们自己的作品开发“阳光宝宝”文创产品。通过就业指导，培养他们成为新泾镇慈善超市的收银员、公益集市的导购员。正如大家一开篇看到的宣传片，阳光宝宝们正在自信自强地成长！\n\n“垃圾分一分·环境美十分”喜雅爱心积极参与社区治理，助力长宁做好垃圾分类特长生。2018年我们领先全市提出了“垃圾分类达人秀”活动，推荐长宁区垃圾分类形象大使，进单位进学校进社区进商圈，喜雅爱心开展垃圾分类宣讲活动逾2000场。我们开创垃圾分类美学，设计垃圾分类视觉体系，创作垃圾分类普法宣传片，亲身演绎“环保时装秀”，创建长宁区特色工作“八大首创”，设计互动游戏“魔方转转转”，至今为止我们在课堂上累计创作了8000只创意分类垃圾桶。让垃圾分类变得简单有趣，让环保活跃在长宁的大街小巷。我们的足迹从长宁走向上海，为建设美丽上海添上有力的一笔！\n\n更多的，喜雅爱心积极拓展对外服务项目，其中政府购买服务项目涉及长宁区民政局、区绿化市容局、区妇联等8个区政府单位，服务范围覆盖全长宁。为老助餐、上门维修等服务内容20余种，爱心暑托班、春雨润心田等服务项目共计百余个。服务对象从老至幼覆盖全年龄段，从普通家庭到弱势群体，服务十万余人次。把与社区居民有关的事，都当做自己的“头等大事”。",
+      "cover": {
+        "name": "N15.jpg",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N15.jpg",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "video": {
+        "name": "N15.mp4",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N15.mp4",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "status": "ENABLE",
+      "public_vote": 3563,
+      "score": 0,
+      "award": null,
+      "optr_date": "2021-12-31T15:50:00.547Z",
+      "corp": {
+        "name": "上海喜雅爱心社区服务中心"
+      },
+      "voted": false
+    },
+    {
+      "case_id": "419533650678550528",
+      "code": "N16",
+      "title": "上海市宁波商会",
+      "detail": "上海市宁波商会不是公益基金会，而是代表了商会组织，代表了民营企业的力量。下面从三个方面来阐述：\n第一、党建引领，锻造甬商红色品牌。中共上海市宁波商会委员会成立于2019年，是上海首家异地地市级商会党委，杨浦区首家“两新”组织党委，以“商会会员企业、楼宇企业、党建联席单位”为工作载体，党建联席单位31家，指导联系会员企业近1000家，覆盖4000余名党员，先后开展两新组织党建论坛、践行红色之旅、红五月滨江跑、优秀党建案例分享等具有甬商特色的品牌活动47场，形成了以党建促会建，以党建促会员企业发展的党建工作模式，是新形势下社团组织基层党建工作的创新与实践。\n第二、甬抗疫情，彰显责任与担当。面对突如其来的疫情，商会第一时间做出响应，发布《致全体会员抗击疫情倡议书》和《致全体党员抗击疫情倡议书》，商会会员企业及个人积极响应号召，以实际行动为抗击疫情捐资捐物，投身各项疫情防控工作。据不完全统计，商会企业累计捐助善款及物资近6000万元，商会党委及委员企业累计捐助善款及物资550余万元。期间，我们为瑞金医院援鄂医疗队送去了冲锋衣，为宁波家乡一线工作人员送去了防护服，为华山医院医护人员送去了暖心礼包，杉杉华清医院、大众出行服务、小汤山医院改扩建工程、雷神山医院信息化工程、分众电梯公益广告等等，甬商积极参与各项抗击疫情前线建设和后勤保障工作事例不胜枚举，全体甬商上下一心共同为打赢此次疫情阻击战贡献了力量。\n第三、脱贫攻坚，助力社会事业发展。\n商会始终将家国情怀与企业发展紧密结合，号召全体会员企业践行社会责任。我们致力公益的脚步从未停歇，我们捐赠宁波恩美儿童福利院，关爱折翼天使，我们捐赠上海交通大学医学院附属新华医院，营造儿童公益空间，我们捐赠上海甬协公益基金会，助力贫困优秀大学生读书，我们支持上海公益伙伴日，引领公益之光。商会企业中有代表性的比如分众传媒美丽中国乡村支教、龙元慈善基金会、全筑关爱脑瘫儿童、一兆韦德“老兵回家”等等公益项目，据不完全统计，商会会员企业每年捐助公益项目金额近亿元。\n同时，商会企业在助力脱贫攻坚的道路上，留下了深刻的足迹。例如致达集团，2016年起联合6家企业共同向云南省彝良县捐赠4500万元，修建道路、农民新村和希望小学，目前已经让4000户居民喜迁新居、数百名小学生有了崭新明亮的课堂，使村民逐步摆脱贫困，迈向幸福生活。例如宁波银行上海分行作为第三届进博会“消费扶贫生活馆”的唯一金融支持单位参与其中,为扶贫攻坚和公共卫生安全贡献自己的力量。\n家国有需要，甬商有担当！上海甬商始终坚守初心，爱国敬业，在奉献社会中创造价值，在高质量发展浪潮中勇于担当。",
+      "cover": {
+        "name": "N16.jpg",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N16.jpg",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "video": {
+        "name": "N16.mp4",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N16.mp4",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "status": "ENABLE",
+      "public_vote": 342,
+      "score": 0,
+      "award": null,
+      "optr_date": "2021-12-31T15:50:00.547Z",
+      "corp": {
+        "name": "上海市宁波商会"
+      },
+      "voted": false
+    },
+    {
+      "case_id": "419561056730619904",
+      "code": "N20",
+      "title": "上海乐爱社工师事务所",
+      "detail": "2012年乐爱在上海市民政局注册成立，多年来致力于提供助残社会工作、社区工作等专业服务，是一家5A级社会组织。业务重点服务浦东新区，杨浦区、徐汇区、宝山区，辐射上海市16个区以及无锡惠山区，总计服务60余个街镇，累计服务人次超过61万人次。多年来获得多项市级、区级奖项。\r\n阳光家园服务\r\n乐爱社工运用“助人自助”的理念为残障学员提供康复服务。包括生活自理、劳动技能、教育培训、康复训练以及社会参与等，提升学员个人能力，为其家庭提供支持，促进亲子关系融洽缓解家庭照护压力。搭建其参与融入社会的平台。2012年至今乐爱累计服务“三阳机构”学员共计17余万人次，为多个“阳光家园”获得了荣誉。如金杨街道“阳光心园”被市残联誉为“上海市残疾人之家”，徐家汇、殷行街道的“阳光心园”获得了“上海市示范型阳光心园”等。\r\n多年助残经验的基础上，形成专业助残服务模式并制定浦东新区阳光之家星级评定标准，在区级助残服务方面，2017年乐爱受浦东新区残联委托对浦东36家“阳光之家”进行培训和督导。\r\n研发行业标准\r\n2019年乐爱与上海市残联合作共同研发制定了《上海市“阳光之家”星级评定标准》，为16个区开展星级评定指标解读的培训，为整个上海市“阳光之家”的服务管理能级提升做出了贡献。\r\n\r\n社区精神障碍服务\r\n社区精神障碍患者由于病情造成生活技能减退，个人及其家庭承受了长期的照护和精神压力。社区对精障人士的排斥及偏见使他们难以融入社会。自2014年开始，乐爱运用“社区康复模式”在殷行街道、徐家汇街道、杨浦区精神卫生中心开展了社区精障患者服务管理平台项目，打造了“康复离院、回归家庭、适应社区、融入社会”完整服务模式。2021年，乐爱开展的社区精神障碍康复工作获得了市民政局的认可，作为第一批试点单位在杨浦区开展试点工作。\r\n该项目在2015年获得《杨浦区十佳优秀案例》，2018年作为社区治理经典案例，收录在上海政法委出版的《综治研究》一书中，2020年，机构也通过此项目被评为“上海市平安示范单位”。\r\n社区治理项目\r\n乐爱发挥专业优势运用“社区工作模式”不断探索社区治理途径，2018年开始承接宝山区区级层面的“活力楼组”建设项目，以“增能赋权”专业理念，探索社区问题解决的新途径。\r\n截止到2021年，乐爱在宝山区12个街镇2个园区，打造了4000余个“活力楼组”。项目获得了中共上海市委组织部、中共上海市委政法委、中共上海市社会工作委员会颁发的“中国（上海）社会治理创新实践优秀案例奖”。",
+      "cover": {
+        "name": "N20.jpg",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N20.jpg",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "video": {
+        "name": "N20.mp4",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N20.mp4",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "status": "ENABLE",
+      "public_vote": 762,
+      "score": 0,
+      "award": null,
+      "optr_date": "2021-12-31T15:50:00.547Z",
+      "corp": {
+        "name": "上海乐爱社工师事务所"
+      },
+      "voted": false
+    },
+    {
+      "case_id": "421773466363342848",
+      "code": "N12",
+      "title": "上海市白玉兰开心家园家庭服务社",
+      "detail": "“白玉兰”自2013年成立以来,在市妇联悉心培育指导下,在全国三八红旗手赵红娣社长带领下，弘扬公益精神，创新公益实践，用爱心铸就公益服务品牌。\n“白玉兰”坚持将发展公益作为立业之基。在服务对象上，以公益为民的情怀，聚焦困境中的妇女、儿童和家庭，持续深化调解、心理辅导及危机干预等服务；在团队建设上，以公益精神滋养培育了一支200人的志愿服务总队；在公益实践中，以人文关怀精耕细作项目；“白玉兰”在上海这片公益沃土中蓬勃生长。先后获全国维权先进集体、市三八红旗集体、优秀女性社会组织，巾帼文明岗等荣誉称号，获评上海市规范化建设五A社会组织。白玉兰志愿者团队公益服务事迹三次受到上海电视台新闻坊专访和宣传。多次在中国社会组织、上海社会组织等杂志刊登服务事迹。\n为提升服务妇女儿童身心健康专业水平，白玉兰志愿服务总队分设“心理疏导、危机干预、讲师团辅、督导培训、项目执行”五支团队，实行精细化服务。2018--2019连续二年在全市开展“幸福从心出发”百场公益讲座；与市妇联携手打造“12338”心理咨询热线，线上线下同步开展心理援助和危机干预服务，年平均服务3万多人次。为了打造“开心家园”品牌，在做强本部旗舰的基础上，深入各区指导因地制宜建立开心家园心理咨询工作站、社区心理服务点，并在部分区成立“6+1”开心家园示范点，将信访接待、法律援助、人民调解、心理疏导“四位一体”功能落实到基层妇女之家，形成同城效应。\n为了更广惠及民生，积极申报开展各类公益项目，受益人群涵盖失独家庭、妇科癌症患者、单亲困难母亲、困境儿童等，服务范围遍及市内11个区，受益人群达5万多人次。通过心理疏导、团体辅导和主题活动等多种关护形式，引领舒展心胸，直面困境，塑造健康人生。\n“白玉兰”着力打造“知心妈妈”服务品牌。五轮近10年，每年承接政府疑难信访件100多起，面对坚冰，发挥第三方优势，爱心陪伴、认知引导，在政府和上访者之间架起沟通的桥梁，化解率达50%以上，挽救了众多深陷泥潭的家庭。不少对象送来了感谢信、锦旗等，以示感谢。提炼创立的“五步法”，成为化解信访矛盾的行动指南。市信访办和市妇联两次授予“白玉兰知心妈妈项目服务贡献奖”。\n白玉兰主动承担社会责任。2015年元旦外滩踩踏事件，2019年3.25江苏响水化工厂爆炸事件,5.16长宁区建筑工地倒塌等重大灾害事故，白玉兰总会在第一时间请缨并参与救援，使身心遭受重创的家属及时得到抚慰和帮助。为助力抗疫，开设了15场公益微课，8个微信群，为包括社区群众、居委干部、居家学生、消防官兵、城管队员等提供心理调适，更义无反顾与医护人员一起，奔赴长宁区临空留验点开展专业疏导，让700多个回沪人员在第一时间感受到祖国的温暖和伟大。\n白玉兰以专业与爱，让生命如花绽放！",
+      "cover": {
+        "name": "N12.jpg",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N12.jpg",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "video": {
+        "name": "N12.mp4",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N12.mp4",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "status": "ENABLE",
+      "public_vote": 3685,
+      "score": 0,
+      "award": null,
+      "optr_date": "2021-12-31T15:50:00.547Z",
+      "corp": {
+        "name": "上海市白玉兰开心家园家庭服务社"
+      },
+      "voted": false
+    },
+    {
+      "case_id": "423887740208525312",
+      "code": "N10",
+      "title": "上海仁德基金会",
+      "detail": "上海仁德基金会是2011年12月9日在上海市民政局注册成立的公募基金会。2016年11月，仁德成为上海市首批获得“慈善组织登记证书”和“慈善组织公开募捐资格证书”的五家公募基金会之一。2017年12月通过5A级社会组织评审，成为5A级公募基金会。2019年，上海仁德基金会成立了联合党支部，在党建的引领下，仁德团队立足上海、辐射全国，开展公益活动。\n一、高效透明坚守公益初心\n仁德基金会自成立以来募得善款总计3.64亿，支出善款总计约3.04亿。2017年到2020年每年投入的公益项目资金分别是6248万、8035万、5091万和7992万。仁德高效透明的工作，让一些品牌项目获得政府、社会和企业等相关部门的认可和肯定；得到了新闻媒体的积极宣传和捐赠人的大力支持，项目影响力大、辐射范围广。如“亲亲禾苗，营养一餐”项目持续开展困难学生帮扶工作，自2015年8月实施以来，累计筹款3000多万，已为4.7万名偏远贫困地区的中小学生和特殊学校学生送去营养餐，项目入选国务院扶贫办“2019年全国社会组织扶贫50佳案例”；“春柳-留守女童关爱项目”自2017年实施以来，关注留守女童生理和心理健康，荣获中国慈善项目大赛百强项目荣誉。仁德也连续6年在中国基金会透明指数FTI的（FoundationTransparencyIndex）评比中获得满分100分。在事业不断发展的过程中，仁德也非常注重自身的规范化建设，通过完善内部治理结构、开展建章立制工作、实施员工绩效考核，学习和掌握相关法律法规等活动，在思想上提高员工的意识，在实践中提高员工的技能，在考核中约束员工的行为，从而保障仁德的公益事业公开、透明，符合法律法规的要求，帮扶到真正有需要的人。\n二、高效对接，积极抗疫防疫\n在2020年抗疫工作中仁德团队行动迅速，从1月29日至3月10日的42天内，为了将爱心捐款及时转换成抗疫前线急缺的物资，团队成员们24小时连轴转，通过全国的合作伙伴网络采购物资、联系物流，确保在最短的时间内将物资送到医院和医护人员手中。同时，每一笔抗疫善款的支出都在第二天通过微信公众号向捐赠人和社会公众公示。仁德在抗疫工作中奖励和慰问了1200名上海援鄂医护人员和上海公卫中心医护人员；为上海东方医院等15家医院和5家武汉的医院捐赠了抗疫物资；为疫情期间奋战在养老一线的养老院、养老助餐点和养老护理员捐赠了防疫物资和关爱津贴。仁德还是第一家完成海外捐赠物资免税手续的基金会。\n三、响应政策，助力脱贫攻坚\n2019年-2020年期间仁德员工们不怕苦不怕累，克服高原反应，深入到“三州三区”、云南、贵州的对口支援地区实地调研，充分了解当地老百姓的需求。在此基础上，仁德在“三州三区”、云南和贵州的对口支援地区开展了59个项目，捐赠扶贫资金达1030.8万元，受益人数达9万人次。这些项目以关怀对口支援地区的弱势群体和有需要的群体为己任，积极开展帮扶老、弱、病、残、孤等群体的公益活动。\n四、踊跃参与，增色社区服务仁德从2018年开始与杨浦区12家基金会牵手，支持和辅导社区基金会开展互联网筹款；为全市15家社区基金会参与99公益日筹款提供专业的技术支持和周到的服务。今后，仁德将结合十四五规划和2035年远景纲要的要求，结合上海市公益事业的规划，继续做好品牌项目，让仁爱之心和贤德之举的种子结出更加丰硕的果实。",
+      "cover": {
+        "name": "N10.jpg",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N10.jpg",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "video": {
+        "name": "N10.mp4",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N10.mp4",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "status": "ENABLE",
+      "public_vote": 2607,
+      "score": 0,
+      "award": null,
+      "optr_date": "2021-12-31T15:50:00.547Z",
+      "corp": {
+        "name": "上海仁德基金会"
+      },
+      "voted": false
+    },
+    {
+      "case_id": "425393918906314752",
+      "code": "N09",
+      "title": "上海财经大学教育发展基金会",
+      "detail": "上海财经大学教育发展基金会是2008年在上海市民政局登记注册的慈善组织，我们以围绕公益、服务上财、服务社会为核心，助力学校建设成具有鲜明财经特色的世界一流大学，在吸引更多的社会力量参与高等财经教育发展的同时，支持抗疫、乡村振兴、长三角发展等工作，践行服务国家战略实施和社会公益发展。\r\n十三年来，上财基金会资产的总规模和公益性支出不段攀升，通过“理念协同、机制协同、项目协同、队伍协同”深化多元化筹资机制，发挥上财专业优势，投资收益表现亮眼。截至2021年6月，基金会净资产为2.62亿元，年均实施项目约为150项，受益人数2万余人。基金会遵守公开透明、专业规范的原则，2017年获评5A级社会组织，并成为上海首家高校公益基地；中基透明指数持续5年保持满分，2020年获上海唯一满分高校基金会。持续打造公益品牌，传播公益文化，连续三年分别以“公益校庆”、“咖啡绿植”、“元阳帮扶”获评公益之申十佳公益校园和公益项目。\r\n1、红色经典，强化党建内涵\r\n在建党100周年之际，基金会携手校友企业设立党建育人基金，通过引入《永不消逝的电波》等一批上海创作的红色经典艺术剧作，打造沉浸式党课，引导党员、师生在感悟经典中赓续红色基因、厚植爱国情怀、汲取精神力量；鼓励支持教职工开展党建课题研究，把党建当学问做，推进党史教育入脑入心。\r\n2、立德树人，关爱学子成长\r\n围绕学校育人的根本任务，基金会累计设立100余项丰富的奖助学金，如山佳奖学金奖励进步最大的学生，让获奖的同学感受到努力被认可的喜悦；设立首个民族专项—石榴籽基金，筑牢中华民族共同意识，贴近、关心和助力民族学生成长成才；设立“心动力”基金，加强学生心理健康教育的内涵建设。\r\n3、千村调查，助力乡村振兴\r\n中国农村是大学生熟悉社会、了解国情的最好课堂，基金会助力打造持续13年的实践项目“千村调查”，支持学生走千村、访万户、读中国、传递爱，将青春写在祖国的大地上，通过田野调查获取数据资料、形成决策咨询报告，为国家相关部门决策提供参考。\r\n基金会设立元阳帮扶基金，携手广大师生、校友、企业和基金会投入和引进400余万资金，从教育、党建入手，助力云南元阳县精准脱贫。我们也将持续为推进乡村振兴贡献上财力量。\r\n4、文化传承，发挥公益育人\r\n基金会聚焦公益育人，指导成立学生公益社团—思源社，启动“六个一”公益传播计划，以“一站公益基地、一堂公益课、一本公益护照、一个公益项目、一次志愿服务、一起做公益”为抓手，“走出去、请进来”携手沪上优秀公益机构，向师生播撒公益种子。\r\n百年芳华，初心如磐。鉴往知来，砥砺前行！上财基金会将持续打造一流，期待更多人和我们一起用公益点亮希望，让城市和社会更温暖。",
+      "cover": {
+        "name": "N09.jpg",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N09.jpg",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "video": {
+        "name": "N09.mp4",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N09.mp4",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "status": "ENABLE",
+      "public_vote": 1564,
+      "score": 0,
+      "award": null,
+      "optr_date": "2021-12-31T15:50:00.547Z",
+      "corp": {
+        "name": "上海财经大学教育发展基金会"
+      },
+      "voted": false
+    },
+    {
+      "case_id": "425366695058976768",
+      "code": "N19",
+      "title": "上海复星公益基金会",
+      "detail": "复星自成立以来，秉承“修身、齐家、立业、助天下”的理念，深入践行企业社会责任，坚持服务社会、人民和国家。上海复星公益基金会成立于2012年11月，是以复星为主要捐赠人的公益行为体。\n上海复星公益基金会为“中国社会组织评估等级·5A级社会组织”，主要业务包括：健康福祉、教育、文化艺术及青年创业、就业等。每年捐助公益项目30余个，辐射全球多个国家和地区。\n\n抗疫：2020年1月24日除夕当晚，复星紧急成立“全球抗疫指挥部”，启动全球调配医疗物资的抗疫行动，复星基金会设立抗疫专项基金积极投身抗疫。\n此后，复星逐步建立了覆盖日本、印度、英国、德国、巴西、以色列、韩国、波兰等23个国家的物资调配网络，筹措了近300万件各类医疗物资，驰援了包括湖北武汉在内的国内28个省市区抗疫一线。\n2020年3月，在国内疫情持续好转，国外疫情却又呈现爆发态势的情况下，复星又立即启动全球人道主义驰援计划，向全球40多个国家开展捐赠行动。\n复星基金会始终在抗疫前线。自2021年4月底启动驰援印度人道主义行动，五一假期期间，复星印度区域抗疫指挥部休假不休兵，在总指挥部、制氧机生产厂、机场及物流中心、印度前线，复星在每一个环节安排专人把关，争分夺秒加紧生产运输，将印度紧缺的制氧机、呼吸机、口罩等防护设备以最快速度运往当地。\n\n乡村医生：2017年12月，在国家卫生健康委扶贫办的指导下，复星瞄准精准扶贫的薄弱环节——贫困人口的基本医疗保障需求，联合中国光彩事业基金会、中国人口福利基金会等，发起“健康暖心——乡村医生健康扶贫”项目（以下简称“乡村医生项目”）。三年来，复星调动全球资源助力基层医疗体系建立，项目覆盖全国15个省、市、自治区的70个国家级贫困县（包括13个“三区三州”深度贫困县），共帮扶12545个行政村卫生室，守护22192名乡村医生，惠及300万户基层家庭。\n乡村医生健康扶贫项目以帮扶乡村医生为切入口，围绕守护、赋能与激励村医三个核心内容，推进以“五个一”工程为抓手的全方位立体式帮扶计划，派出员工志愿者驻点接力扶贫，帮助贫困地区培养并留住合格的乡村医生，有效提升基层医疗卫生服务水平，最终助力国家脱贫攻坚任务圆满完成。\n2021是中国乡村振兴的元年，在《中共中央国务院关于全面推进乡村振兴加快农业农村现代化的意见》的指引下，复星将继续深化帮扶内容，巩固脱贫成果，以实现基层农村的健康振兴。乡村医生项目将进一步拓展帮扶区域和内容，提升村医的技术能力和工作环境，从而为广大村民提供更好、更可持续的医疗服务，助力“健康中国梦”早日实现。\n\n其他项目：\n-太极抗帕：经过六年多的坚持，至2021年3月，复星基金会“太极抗帕”公益项目已惠及近400位帕金森患者，这项公益还将持续进行。\n-青少年：2013年5月30日，伴随着复星与保德信在中国建立合资公司——复星保德信人寿，上海复星公益基金会与保德信金融集团联手将拥有18年历史的保德信青少年社区志愿奖引入中国，以推动中国青少年公益与国际接轨。青社奖来到中国已经走过了八个年头，至今已有超过4500名中学生申请。在过去的六届里，共表彰了数百位12-18岁在志愿服务或公益活动中做出杰出贡献的中学生志愿者。",
+      "cover": {
+        "name": "N19.jpg",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N19.jpg",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "video": {
+        "name": "N19.mp4",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N19.mp4",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "status": "ENABLE",
+      "public_vote": 1235,
+      "score": 0,
+      "award": null,
+      "optr_date": "2021-12-31T15:50:00.547Z",
+      "corp": {
+        "name": "上海复星公益基金会"
+      },
+      "voted": false
+    },
+    {
+      "case_id": "427919603789049856",
+      "code": "N07",
+      "title": "上海市慈善教育培训中心",
+      "detail": "上海市慈善教育培训中心成立于1995年，现有员工15人，是一家5A级社会组织。中心成立26年来，始终坚持“知识扶贫、技能助强、促进发展”的宗旨，努力为各类社会群体开展公益慈善教育服务。近5年来，中心每年开展的公益慈善项目超过30个，年投入项目资金近1000万元，每年直接惠及人数超过5万人，从多方面体现了上海对弱势群体的人间大爱和城市温暖，起到公益示范引领作用。先后被评为上海市第七届“慈善之星”和静安区“文明单位”。\r\n1、“大众创业、万众创新”特色明显。中心连续16年在全市90余所高校、中职校举办了免费创业教育培训班，举办上海市青年创业夏令营，累计投入资金540余万元，共惠及大中专学生13000余人，其中有9人获得全国创业大赛一等奖和全球创业精神大奖。有数百名学生实施了自主创业，成为活跃在上海和帮助家乡脱贫的成功创业者。\r\n2、“共享阳光、助力脱贫”。中心从2015年起连续实施“共享阳光”公益行动，累计投入资金1500余万元，帮助1000多名外来务工者获得大、中专学历证书，有1500多人通过参加免费职业技能培训提升了职业能力，在上海稳定就业，助力脱贫，提高了生活水平。\r\n3、“金融普惠教育，推进社会和谐”。中心从2016年起对社区老年人、外来务工者、在校大学生、社区青少年等人群免费开展了金融知识和防范金融风险教育及少儿财商教育，累计投入资金690.9万元,惠及人员近10万人。\r\n4、“创意艺术教育，助力青少年发展”。中心从2013年开始启动“牵手艺术彩虹·献给未来地球”青少年创意艺术教育培训项目，8年来投入资金1400余万元，吸引了12万人次的青少年参加，探索了自闭症青少年通过创意教育提升工业设计能力的途径和方法，建立了教育、产业、商业和媒体深度融合的新模式，一些优秀设计作品被应用于文具等产品，一批自闭症青少年提高了社会交往能力，有的建立了个人工作室，有的实现就业。\r\n5、“科普教育，提升素质”。中心从2017年开始对青少年免费开展无人机科普教育，并组织开展了有200万人次青少年参加的全国航空·无人机科普培训和大赛，将青少年科普教育与国防教育、公益教育相结合，开创了特殊青少年科普教育的新途径。\r\n6、“抗疫情、送温暖”。新冠疫情期间，中心积极做好防疫、抗疫物资捐赠工作。组织艺术家以各种艺术表演形式进行抗疫宣传，举办“共克时艰抗疫情，线上义演赞英雄”慈善专场演出，用抖音、美篇等方法合成一个个微视频作品，其网上展播量超过80万人次，鼓舞了全国人民抗疫必胜的斗志。为湖北“共享阳光”学员及时送上一份慰问金，表达了对英雄的武汉和湖北人民为战胜新冠疫情作出重大贡献的感谢。\r\n7、“示范引领，体现责任”。中心注重公益慈善的诚信建设，26年中没有发生诚信和质量问题，近五年来，带动3万人次志愿者参与公益项目，有100多家企业和机构合作开展公益项目。中心还为本市和外地社会组织开展能力建设培训，仅中心原副主任徐本亮一人就为全国4000多家社会组织开展了培训和咨询。",
+      "cover": {
+        "name": "N07.jpg",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N07.jpg",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "video": {
+        "name": "N07.mp4",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N07.mp4",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "status": "ENABLE",
+      "public_vote": 1076,
+      "score": 0,
+      "award": null,
+      "optr_date": "2021-12-31T15:50:00.547Z",
+      "corp": {
+        "name": "上海市慈善教育培训中心"
+      },
+      "voted": false
+    },
+    {
+      "case_id": "429036392128294912",
+      "code": "N17",
+      "title": "上海秋海堂文化艺术中心",
+      "detail": "秋海堂文化艺术中心（以下简称秋海堂）创办于2014年，缘起并蒙恩于海上艺术大家——书画泰斗陈佩秋、著名书法家刘小晴先生。创办者是两位书画大家的共同入室弟子徐宏斌。\r\n2018年3月31日，陈佩秋先生曾亲自为秋海堂陈佩秋大师工作室揭牌。2018年12月8日刘小晴书法工作室在秋海堂正式揭牌；2017年起著名画家陈翔（现上海中国画院院长）在秋海堂开设陈翔中国画公益讲堂。\r\n依托名家大师工作室，秋海堂致力于书画艺术的传承、传播。守正创新，紧贴时代，举办高水平的艺术活动；推动书法文化进校园，注重美育、德育相结合；发起秋海堂刘小晴艺术基金，坚持投身公益和扶贫事业，持续帮扶徐汇区对口支持的云南省红河州，为脱贫攻坚事业作出突出贡献。正因为连续几年文化扶贫的行为和贡献，秋海堂文化艺术中心创办人，徐宏斌老师，于2021年2月份被评为全国脱贫攻坚先进个人的荣誉。而且在全国三千多先进个人当中，他也是唯一的书法工作者。这也是对秋海堂多年来文化扶贫的最大肯定。\r\n秋海堂文化艺术中心是在徐汇区民政局注册、接受徐汇区文旅局指导的优秀公益组织，先后被评为或授予：徐汇区美术馆美育共同体成员单位（徐汇区文旅局），徐汇区市民修身基地（徐汇区文明办），徐汇区新的阶层人士工作示范点（徐汇区委统战部）、徐汇区特殊对象未成年子女教育关爱基地（徐汇区司法局）、徐汇区政协书画院创作基地（徐汇区政协）。2021年入选上海百佳社会组织排行榜。\r\n秋海堂植根徐汇，已先后设立虹梅街道、天平街道、凌云街道等大师工作室社区基地，并先后与高安路第一小学、上海市中国中学，世界外国语中学等合作共建。开展“百场公益讲座”活动，先后走进多家学校和社区，两年时间已经进行了70多场书法公益讲座，影响到数千名青少年。秋海堂曾被《人民日报》作为上海艺术馆品牌典型进行专题报道。",
+      "cover": {
+        "name": "N17.jpg",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N17.jpg",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "video": {
+        "name": "N17.mp4",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N17.mp4",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "status": "ENABLE",
+      "public_vote": 3179,
+      "score": 0,
+      "award": null,
+      "optr_date": "2021-12-31T15:50:00.547Z",
+      "corp": {
+        "name": "上海秋海堂文化艺术中心"
+      },
+      "voted": false
+    },
+    {
+      "case_id": "426455554140151808",
+      "code": "N08",
+      "title": "上海市基金同业公会",
+      "detail": "上海市基金同业公会成立于2010年11月18日，是由上海基金行业相关业务单位发起并自愿组成的行业性的非营利性社会团体法人，是中国第一家基金行业自律组织。目前，公会共有会员单位181家，包括上海地区66家公募基金机构，37家资产管理机构，24家私募基金机构，32家基金销售机构，22家异地基金管理公司在沪分支机构。其中，公募基金会员管理资产规模8.67万亿元，占全国37.84%。\n公会成立以来，始终以公益为立会之本，坚持以服务为基础、自律为核心，充分发挥公会的桥梁纽带作用，在投资者教育、自律管理、会员服务、国际交流、社会责任上成功打响了中国基金业第一家同业公会的品牌，为建设上海国际金融中心和国际资管中心作出积极的贡献。\n\n-探索公益投教新模式，强化投资者保护工作\n公会自成立以来，累计举办投资者保护教育宣传活动百余场，向投资者发放实物投教产品达40万件；首创网上基金学院、公募基金集体接待日，通过网络打破了地域界限，让全国各地投资者与上海基金公司实现零距离互动交流；策划筹建上海地区首个由自律组织和地方政府共建的投资者教育基地：上海基金业—陆家嘴金融城投资者教育基地，提供投资者看得见、摸得到的多元公益投教；与第一财经携手打造业内首个投资者教育电视栏目《基金时间》，每周三晚在第一财经电视、抖音等平台播出，帮助投资者更好地认识基金，树立科学的投资理念，受到业内业外高度认可和广泛赞誉，成为上海基金业的投教新名片。\n\n-发挥行业核心优势、服务国家发展战略，进一步推进金融行业对外开放\n2020年4月1日起，我国正式取消对证券公司、公募基金管理公司的外资持股比例限制。在此背景下，3月31日，在我国正式取消对证券公司、公募基金管理公司的外资持股比例限制的前夕，由公会牵头编写的《海外资管机构赴上海投资指南》中英文双版正式发布，收到海外资管的高度评价，这是国内同类行业协会为服务海外资管机构推出指南性文件的首次尝试，同时也开创了城市编写指南吸引海外资管投资的先河。\n\n-行业强大合力应对疫情，彰显社会组织公益属性\n2020年1月，湖北武汉爆发新冠疫情，公会第一时间向行业发出《致敬白衣天使项目倡议书》，设立全国首个由行业自律组织发起的专项基金：上海基金业致敬白衣天使专项基金。专项基金共筹集了4748.1736万元，直接拨付抗疫医务工作者2676万元，受益医务人员及家属共计4349名；支持市卫健委“防控新冠疫情纪念铜章”、市基层卫生抗疫表彰活动、《逆行者》—上海援鄂医务人员群像雕塑等公益项目；致力推动上海市医疗卫生系统人才培育，支持上海市“杰出青年医学人才”以及“十佳家庭医生”项目。专项基金荣获上海慈善最高奖项第十一届“中华慈善奖上海市提名奖”。此外，上海基金业捐款捐物超过一亿，在全市社团组织中位居前列，充分展现上海基金业责任与担当。",
+      "cover": {
+        "name": "N08.jpg",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N08.jpg",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "video": {
+        "name": "N08.mp4",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N08.mp4",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "status": "ENABLE",
+      "public_vote": 2273,
+      "score": 0,
+      "award": null,
+      "optr_date": "2021-12-31T15:50:00.547Z",
+      "corp": {
+        "name": "上海市基金同业公会"
+      },
+      "voted": false
+    },
+    {
+      "case_id": "422875798316593152",
+      "code": "N05",
+      "title": "上海市浦东新区旅游业协会",
+      "detail": "上海市浦东新区旅游协会成立于1995年，是浦东新区旅游行业企事业单位自愿组成的跨部门、跨所有制的非营利行业性社会团体。\n协会成立至今，先后获得市级、区级各项荣誉称号，2016年，被上海市社团管理局评为“5A级社会组织”。现有会员单位超过350余家，下设宾馆、旅行社、景点、旅游投资发展4个专业委员会，行业覆盖率90%以上。\n在新区民政局与新区文体旅游局指导与支持下，协会以探索公益创新模式为目的，积极践行公益事业之路。今天，我将从三个方面着手，为各位评委老师讲述我们的公益事业：\n一、紧握服务企业根本，打造特色公益品牌\n多年来，协会紧紧围绕以公益促发展，以服务促提升，不断迭代升级特色公益品牌，结合浦东旅游实际情况，积极开展各类公益活动，为推动上海建设“公益之城”添砖加瓦。\n协会以服务会员为工作核心，以极力支持社会公益活动为根本，秉持着“为会员排忧解难、为行业保驾护航”的服务理念，始终按照“服务、代表、协调、自律”为工作宗旨，不断积极探索公益模式，先后树立了5·19中国旅游日浦东新区主题活动、对口援建、新区旅游业纠纷调解公益平台、浦东旅游志愿者队伍等协会特色公益品牌项目。\n二、发挥行业资源优势，践行公益旅游之路\n为深入贯彻落实习近平总书记关于对口支援工作一系列重要指示精神，根据翁祖亮书记关于浦东与莎车、大理2020年度扶贫协作工作指示，协会先后组织开展新区旅游企业赴新疆莎车县、云南大理市进行旅游援建工作，就客源输送、文旅融合发展、旅游产品定制、旅游资源整合、运营效率提升、人才培养、民宿产业探索等多方面给予扶持，以实际旅游产业提升与经济效益拉动来促进沪疆、沪滇之间文化旅游援助行动。\n同时，协会积极围绕打造浦东公益旅游新项目，在5•19中国旅游日策划开展浦东新区主题公益活动，活动通过旅游企业集体宣传浦东旅游资源，讲好浦东旅游故事，同时串联滨江“世界会客厅”及网红打卡点，将7色丝带化身爱和正能量进行传播与分享，营造多样化沉浸式旅游休闲体验，体现“彩色让世界更美好”精神。\n另外依托强大的会员体系及组织优势，协会积极探索建立以浦东新区旅游企业为志愿者的旅游志愿服务队伍。进一步引导新区旅游从业人员做文明旅游的倡导者、推动者、实践者，推动规范长效的旅游志愿服务机制，提升浦东新区旅游质量满意度。\n三、助力企业复工复产，拓展延伸公益新思路\n随着疫情防控进入常态化，国内游在不断恢复中，内循环成为旅游复苏的主战场。协会抓牢重点工作，整合内需，创新打造了“惠游浦东”品牌，推出了“惠游浦东”旅游联票和“惠游浦东”文旅巡展等活动，进一步刺激文旅消费潜力，助力畅通新区文旅企业后疫情时代内循环通路。\n今后，协会在各项公益活动、志愿服务活动中将拿出120分的热情和150分的努力，以非营利性作为基础，积极探索公益新模式，为推动公益之城建设垒土筑基。",
+      "cover": {
+        "name": "N05.jpg",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N05.jpg",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "video": {
+        "name": "N05.mp4",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N05.mp4",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "status": "ENABLE",
+      "public_vote": 2276,
+      "score": 0,
+      "award": null,
+      "optr_date": "2021-12-31T15:50:00.547Z",
+      "corp": {
+        "name": "上海市浦东新区旅游业协会"
+      },
+      "voted": false
+    },
+    {
+      "case_id": "426458849424449536",
+      "code": "N01",
+      "title": "上海霞满云间公益发展中心",
+      "detail": "简介：\r\n上海霞满云间公益发展中心是一家专注机构养老、社区养老、居家养老、智慧养老业务的社区服务综合体。\r\n愿景——做上海最专业的上门居家养老服务机构\r\n使命——使用科学技术和爱的力量，为改善提升服务对象的生活生命质量而不懈努力\r\n理念——以生命服务生命以生命影响生命\r\n价值观——守法、尊重、安全、专业、快乐\r\n运营能力：\r\n霞满云间以专业为基础，将机构养老、社区养老和居家养老深入融合。机构自2012年成立以来，人员团队不断壮大，人员流失率1%，政府采购项目承接规模逐年递增，年度收入增长率约41.17%。霞满云间下辖机构养老四家，社区综合为老&日间养老6家，居家养老涉及松江7个街镇，实施分区域分层次阶梯式管理，为老年朋友提供标准化、专业化、人性化养老护理服务。\r\n公益理念：\r\n饮水思源、回报社会，是企业应尽的社会责任,霞满云间自2012年成立至今，主动承担社会责任，上海霞满云间公益发展中心是上海市民政局5382号公益基地，下辖5家公益基地，由专人负责管理，定期在“公益上海”平台发布公益消息，募集社会各方力量，倡导传播公益精神，救助弱势群体，努力营造社会和谐共享氛围。霞满云间积极开展公益项目，有认知症友好社区建设、失能老人助浴、爱心护理床、老伙伴互助等等，截至2020年底，机构共计承接公益项目100多个，服务老人达10万余，受益人次100万余人次，为提高社区老人生活生命质量做出了应有贡献。\r\n公信力、影响力：\r\n机构与日本、台湾、马来西亚等专业服务机构常年合作，与上海智障志愿者团队结成合作伙伴关系；经常接受市、区民政、区残联、街镇相关部门的指导和培训。\r\n并于2015年荣获上海市4A级社会组织；\r\n2015年、2018年和2019年荣获上海市肢残人协会颁发的优秀集体奖；\r\n2016年荣获优秀社会组织；\r\n2017年荣获慈善基金会颁发的慈善社会组织荣誉证书;\r\n2018年被评为2016-2017年度先进慈善义工集体；\r\n2019年荣获方松街道颁发的方松最美团队荣誉证书；\r\n“为长期卧床老人上门助浴”案例在2019年松江区养老服务行业评选表彰活动中荣获“十佳养老服务案例”称号；\r\n2020年度上海市承接政府购买服务社会组织，荣获《聚焦热点》栏目品牌机构展播（播出平台：上海电视台纪实人文频道），同年荣获慈善基金会颁发的“慈善捐赠爱满云间”奖杯。服务中频频收到服务对象送来的感谢信、锦旗等。\r\n2021年承接机构养老方松街道敬老院20年度上海市养老机构服务质量监测排名区排名第二，市排名前五。\r\n可持续发展：\r\n上海霞满云间公益发展中心以公益为纽带，促进“企社”、“社社”的合作。以慈善为导向，将社会各方面的人士共同联合起来，更进一步去激发社会的爱心，把我们的养老事业、养老服务做得更好。\r\n养老事业是非常富有意义的，我们将不遗余力地按照我们党“人民城市人民建，人民城市为人民”这个理念，共同去贴近养老事业的发展，让我们老年人的感受度、满意度、温暖度获得一个很大的提升。",
+      "cover": {
+        "name": "N01.jpg",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N01.jpg",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "video": {
+        "name": "N01.mp4",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N01.mp4",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "status": "ENABLE",
+      "public_vote": 4352,
+      "score": 0,
+      "award": null,
+      "optr_date": "2021-12-31T15:50:00.547Z",
+      "corp": {
+        "name": "上海霞满云间公益发展中心"
+      },
+      "voted": false
+    },
+    {
+      "case_id": "422530524956082176",
+      "code": "N11",
+      "title": "上海市阳光社区青少年事务中心",
+      "detail": "上海市阳光社区青少年事务中心成立于2004年2月，是一家致力于青少年成长发展的社会服务机构。主要承接政府委托的6-25周岁社区青少年教育、管理和服务事务，400余名专职青少年事务社会工作者分布在13个区167个街镇，运用专业方法开展就业创业、社区融入、亲职教育、生命健康、助困增能、志愿服务、外展服务、未成年人司法等八大类服务。\n一、秉持专业理念，践行助人自助宗旨\n（一）关爱困境青少年，陪伴健康成长\n主要对城区困境青少年、金山（准）孤儿、崇明区留守儿童提供服务，建立“一人一档”，以个案辅导、家长沙龙、自护课堂、志愿服务等形式开展专业服务，引导困境青少年群体“爱自己、爱家庭、爱社区”，以全方位、多维度的陪伴式服务提升青少年的自我认同感和社会融入感。\n（二）关注未就业就学青少年，引导回归社会\n面对16至25周岁的未就业就学青少年群体，从优势视角出发，以就业促业、学历技能提升为抓手，协助与家庭、社区建立联结。2004年至今协助近五万名青少年成功就业。\n（三）聚焦特定青少年，促进社会融入\n一是面向刑事案件中需要帮扶、救助的未成年人开展教育引导和正向激励，累计服务、帮教违法涉罪未成年人1万余名；二是已介入近千个涉未成年人家事案件，提供庭前调解、心理疏导、家事调查、回访观护、担任探望监督人等服务，维护未成年人合法权益。\n二、构建保护体系，探索社会治理模式\n（一）参与地方标准建设，推动行业发展\n机构作为主要起草单位参与研制全国首个聚焦未成年人司法领域的《未成年人司法社会工作服务规范》这一上海地方标准。该标准的建立促进了全国未成年人司法社会工作的专业发展。\n（二）建立合作应急平台，集合专业力量\n机构建立“跨专业多部门合作应急平台”，联合高校、精卫中心、青少年热线、基金会、律师、媒体等力量形成青少年保护合作联盟，共同为青少年搭建权益保护“港湾”。\n（三）设立阳光研究院，加强分析预判\n每年面向高校发布青少年重点、热点问题的研究项目指南，联同市阳光中心的资深青少年事务社会工作者开展协同式研究。定期将现状、问题及针对性的对策建议形成调研报告、专报，助力相关职能部门对青少年问题的研判。\n成立十七年来，上海市阳光中心坚持以职业化、专业化为导向，加强社工队伍建设，汇聚了一批具有社会工作专业知识、勇于创新、敢于开拓、无私奉献的社工人才，在保护青少年权益的道路上不断前行！",
+      "cover": {
+        "name": "N11.jpg",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N11.jpg",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "video": {
+        "name": "N11.mp4",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N11.mp4",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "status": "ENABLE",
+      "public_vote": 923,
+      "score": 0,
+      "award": null,
+      "optr_date": "2021-12-31T15:50:00.547Z",
+      "corp": {
+        "name": "上海市阳光社区青少年事务中心"
+      },
+      "voted": false
+    }
+  ]
+
+export default data
\ No newline at end of file

+const data = [
+    {
+      "case_id": "4245898071640719361",
+      "code": "N06",
+      "title": "复旦管理学奖励基金会",
+      "detail": "我国自古就有优秀的管理思想和实践，但中国现代管理科学则是在改革开放之后才逐步发展起来的。为进一步推动我国现代管理科学发展，原中共中央政治局常委、国务院副总理李岚清同志于2005年发起成立了复旦管理学奖励基金会，这也是中国人自己设立的管理学界第一个奖励基金会。\r\n“要真正解决好中国的管理问题，最终还是要依靠中国人自己。”这句话道出了“管理”必须根植于一个国家的社会组织和民族文化。管理科学，是兴国之道，也是一个国家软实力的重要组成部分。\r\n十六年来，基金会各项管理逐步完善，2020年首次参加社会组织等级评估即被授予“5A级社会组织”荣誉称号；FTI透明指数排名连获最优等级。基金会的评奖工作，及其开展的一系列公益项目，获得了来自各界人士的一致认可；同时借助媒体之力，不断拓宽公众对中国管理学的认识边界，受益人数不断增加。如今，基金会已逐渐发展成为中国管理学界最具影响力、最具公信力的基金会。\r\n作为一个“奖励性”的基金会，我们希望打造中国管理学界的“诺贝尔奖”。基金会目前设立了“复旦管理学杰出贡献奖”“复旦管理学终身成就奖”“复旦企业管理杰出贡献奖”三大奖项，已成为我国管理学界享有崇高声誉、具有广泛影响力的重要奖项。截至2020年，已评选出57位获奖人，他们中不乏成思危、苏东水等矢志推动中国特色的管理学及其研究走向世界的杰出专家学者，亦有张瑞敏、任正非等对中国管理学不断实践、探索的优秀民族企业家。\r\n评奖之外，基金会还积极开展了丰富多样的公益活动。自2013年起，面向我国高等学府，面向青年师生，面向中西部地区举办了“校园公益”系列讲座活动，辐射师生5000余人。\r\n联合我国管理学一级学会，举办了一系列具有国际影响力的管理学学术盛会。其中，“中国管理学年会”是中国管理学领域规模最大、层次最高的综合性学术会议。另外，基金会通过支持“中国管理学青年论坛”，为有潜力的优秀青年架起了跨学科、跨层次的学习交流平台，旨在培养中国管理学的中青年力量。\r\n为加强学术界和实业界的合作，基金会充分发挥“桥梁·引领·赋能”作用，做到将“管理学带出去”，“管理领进来”，邀请获奖人、专家学者与企业家共话“管理”。\r\n基金会还与复旦大学东方管理研究院、第一财经合作开展了“中国杰出企业家管理思想访谈录”项目，已通过42集电视专题片、6部《改变世界》、14本研究丛书等形式对外发布，另有10多个优秀案例走进了高校课堂，收益人数达10亿多人。\r\n基金会积极响应习近平总书记“把论文写在祖国大地上”的号召，与《管理学报》合作，举办专题学术研讨会，开辟“中国企业家管理思想”专栏；与知名企业合作开展“海尔生态雨林计划”等专项研究。\r\n2020年新冠疫情的突发，对全国各地的公共卫生治理都是前所未有的考验。为总结出应对疫情的科学、高效的经验，提供疫情应对经验给相关部门，基金会资助了“新冠疫情防控防治的中国特色管理理论与方法”系列专著及案例研究。于基金会而言，这件事意义非常。\r\n作为一个扎根于中国管理学领域发展的公益组织，基金会在各级领导的亲切关怀下不断发展。获奖人所提出管理思想、管理理论和实践的创新、各项公益活动等，对于上海乃至全国各地的社会治理、公共管理与企业管理都发挥了重要的作用。在每年的颁奖典礼上，历任上海市领导均受邀出席并致辞。当今世界正面临百年未有的大变局，发展中国特色的管理学、并让中国特色管理学发挥更大的影响力，这比任何时候都更加迫切。在未来的公益发展事业中，基金会将继续助力中国特色管理学的探索和创新，为增强上海自主创新能力，提高城市国际竞争力，做出新的重大的贡献！",
+      "cover": {
+        "name": "N06.jpg",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N06.jpg",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "video": {
+        "name": "N06.mp4",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N06.mp4",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "status": "ENABLE",
+      "public_vote": 3406,
+      "score": 0,
+      "award": null,
+      "optr_date": "2021-12-31T15:50:00.547Z",
+      "corp": {
+        "name": "复旦管理学奖励基金会"
+      },
+      "voted": false,
+      "liked": false
+    },
+    {
+      "case_id": "419178326515888128",
+      "code": "N14",
+      "title": "上海市普陀区长寿社会组织联合会",
+      "detail": "近年来，各类社区社会组织数量增长，规模扩大，社会组织日趋成为服务社区发展，提升社区治理水平的重要力量。所以以服务中心传统的点对点形式来去服务社会组织，已经不符合形势的发展，亟待搭建新的平台。在这种情势下，2016年长寿社会组织联合会孕育而生。长寿社会组织联合会是全市首家街道层面社会组织联合会。联合会以党建为引领，创新构建社区、社会组织、社会组织联合会的联动机制，这种全新模式不仅为社区与社会组织之间搭建了交流对接平台，也为促进社会组织自律自治、资源共享、健康发展创造了良好的条件。\n联合会运行以来，正式会员近百家。目前，长寿社会组织联合会成员中已有区党代表、区人大代表、区政协委员，充分激发社会组织领军人物的参与度，发挥社会组织自我管理、自我服务的能效。\n创新党建引领社会组织参与社区治理是我们的工作特色之一。2016年我们同步成立联合会党总支，党总支通过“价值引领、服务凝聚、同心共治”凝聚党员力量，提升基层组织活力。目前，党总支下设20个党组织、6个联合支部，14个独立支部。联合会自成立以来开展了一系列凝聚力建设活动，包括开展情景党课、建立学习教育体验站等等，我们还努力将公益理念引入党建活动，例如开展垃圾分类主题党日活动。通过这些活动和服务，不仅会员们的凝聚力日益增强，更是聚拢到了一批原先游离在边缘的社会组织。\n搭建公益服务平台也是我们最大的工作特色。我们通过公益秀、公益项目菜单、公益集市等形式将社会服务和项目精准化地投放到我们两新组织、楼宇和居民区，政府购买社会组织服务项目的数量及社区参与面都有了一个较大幅度的提升。\n在新媒体时代，为了更加方便项目对接，社联会依托微信公众号平台，于18年9月正式上线了长寿公e家网站。公e家的推出填补了20万以下政府采购服务对接渠道的空白。居民区科室可以进行社区需求发布，社会组织发布服务内容，这样以来加快了信息传递速率，实现了项目精准对接。例如，我们会在学生的暑假开展暑期班公益项目，让公益项目走进社区、走进百姓生活中。项目结项后，我们会举办成果展，把项目的成果进行公示，并在公E家上给承接方打分，能够让购买方一目了然地了解社会组织的服务能力。通过这样一个平台，我们让长寿的社会组织能真正了解到社区的需求，因地制宜地研发适合长寿、服务长寿的公益项目。尤其在疫情的冲击下，公E家的优势更加得到了肯定。2016年以来我们通过线上线下的渠道共举办了115个公益项目、300余场活动，有效实现社会组织与居民需求的“无缝对接”。\n我们在实践中摸索，完善中创新。展望未来，长寿社会组织联合会也将不断探索，下一步的计划是“请进来、走出去”，长寿社会组织联合会将联合其他街镇乃至其他区县的社会组织共同协作，打破社会组织属地化壁垒，提升他们视野和竞争力，因地制宜的研发出服务社区的公益项目，让公益的力量势如破竹，为打造精彩长寿、善美普陀和公益上海添砖加瓦。",
+      "cover": {
+        "name": "N14.jpg",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N14.jpg",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "video": {
+        "name": "N14.mp4",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N14.mp4",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "status": "APPLY",
+      "public_vote": 3346,
+      "score": 0,
+      "award": null,
+      "optr_date": "2021-12-31T15:50:00.547Z",
+      "corp": {
+        "name": "上海市普陀区长寿社会组织联合会"
+      },
+      "voted": false
+    },
+    {
+      "case_id": "419527762110595072",
+      "code": "N04",
+      "title": "上海震旦教育发展基金会",
+      "detail": "上海震旦教育发展基金会成立于2015年，秉持弘扬公益精神，积极回报社会的办会宗旨，努力汇集各方力量、传递正能量。\r\n基金会主要以四项特色工作为主:\r\n(一)携手各方力量，关爱特殊人群\r\n震旦教育基金会已成功主办、协办多项全国性、市级助残公益活动。关爱自闭症特殊群体活动，主题鲜明、内容丰富、参与者众、受益面广。\r\n（二)共襄慈善良业，回报社区民众\r\n震旦教育基金会为社区建设作贡献。为黄浦社区加装电梯工程中做配套绿化改建项目，为居民提供了优美的绿化环境。\r\n基金会每年中国传统节日前向街道、镇、村老人、残疾人送去温暖与爱心。\r\n2020年疫情期间，震旦教育基金会为黄浦区各大医院、派出所等总共58家单位，送去价值28万余元的哈根达斯蛋糕，向日夜坚守在疫情防控第一线的工作人员送去慰问与祝福，为抗击疫情助力加油!\r\n（三)引领环保时尚，共倡整洁家园\r\n震旦教育基金会联合公益机构举办了多场大型环保艺术展，在浦东科技馆的“艺起减塑”历时90天，共接待观众逾13万人次，使参与者对环保、减塑、有了感性的认识，也认识到环保是我们全人类的职责与使命。\r\n（四)共同奉献爱心，基金奖励优秀\r\n震旦师生积极为抗疫捐款，把参与慈善公益事业作为每个人的社会责任与使命。在疫情之中，基金会表彰震旦职业学院17名驰援武汉的毕业生，给予每人2万元的奖励，鼓励和表彰他们无私无畏，挺身而出把人民生命安全放在首位的大无畏精神。\r\n震旦教育基金会近年来开展了50多项公益项目活动，受益人数16万余人次。震旦教育基金会将不忘初心，凝心聚力，坚毅前行，吸纳更多热心于慈善事业的有识之士参与，做更多造福于社会的公益活动。",
+      "cover": {
+        "name": "N04.jpg",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N04.jpg",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "video": {
+        "name": "N04.mp4",
+        "url": "http://gyzs.onwall.cn/2021gyzs/N04.mp4",
+        "uid": 1564543218846,
+        "status": "success"
+      },
+      "status": "REFUSE",
+      "public_vote": 4125,
+      "score": 0,
+      "award": null,
+      "optr_date": "2021-12-31T15:50:00.547Z",
+      "corp": {
+        "name": "上海震旦教育发展基金会"
+      },
+      "voted": false
+    },
+  ]
+
+export default data
\ No newline at end of file

+<template>
+  <router-view></router-view>
+</template>
+
+<script>
+export default {
+  data () {
+    return {
+
+    }
+  },
+  mounted () {
+
+  },
+  methods: {
+
+  }
+}
+</script>

+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" href="/favicon.ico" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Vite App1</title>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module" src="./main.js"></script>
+  </body>
+</html>

+import { createApp } from 'vue';
+import App from './App.vue';
+// import store, { key } from './store/index';
+import router from './router';
+
+createApp(App).use(router).mount('#app');

+import { createRouter, createWebHashHistory } from 'vue-router';
+
+const router = createRouter({
+  history: createWebHashHistory('/index.html'),
+  routes: [
+    {
+      path: '/',
+      name: 'mono2',
+      component: () => import('./views/index.vue'),
+    },
+  ],
+});
+
+export default router;

+<template>
+  <div class="">456</div>
+</template>
+
+<script>
+export default {
+  data () {
+    return {
+
+    }
+  },
+  mounted () {
+
+  },
+  methods: {
+
+  }
+}
+</script>
+
+<style lang="less" scoped>
+
+</style>

+<template>
+  <router-view></router-view>
+</template>
+
+<script>
+export default {
+  data () {
+    return {
+
+    }
+  },
+  mounted () {
+
+  },
+  methods: {
+
+  }
+}
+</script>

+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <meta charset="UTF-8" />
+    <link rel="icon" href="/favicon.ico" />
+    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
+    <title>Vite App1</title>
+  </head>
+  <body>
+    <div id="app"></div>
+    <script type="module" src="./main.js"></script>
+  </body>
+</html>

+import { createApp } from 'vue';
+import App from './App.vue';
+// import store, { key } from './store/index';
+import router from './router';
+
+createApp(App).use(router).mount('#app');

+import { createRouter, createWebHashHistory } from 'vue-router';
+
+const router = createRouter({
+  history: createWebHashHistory('/index.html'),
+  routes: [
+    {
+      path: '/',
+      name: 'mono2',
+      component: () => import('./views/index.vue'),
+    },
+  ],
+});
+
+export default router;

+<template>
+  <div class="">123</div>
+</template>
+
+<script>
+export default {
+  data () {
+    return {
+
+    }
+  },
+  mounted () {
+
+  },
+  methods: {
+
+  }
+}
+</script>
+
+<style lang="less" scoped>
+
+</style>

+export default [
+  {
+    path: '/',
+    component: () => import('@/views/index.vue'),
+    meta: {
+      title: '地图展示',
+    },
+  },
+];

+/*
+ * @Date: 2023-05-29 11:10:19
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2023-05-29 11:30:06
+ * @FilePath: /map-demo/src/router.js
+ * @Description: 文件描述
+ */
+import { createRouter, createWebHashHistory } from 'vue-router';
+import RootRoute from './route.js';
+import asyncRoutesArr from "./mock/routes"
+import generateRoutes from './utils/generateRoute'
+
+// TAG: 路由配置表
+/**
+ * 把项目独有的路由配置到相应的路径，默认路由文件只放公用部分
+ * 但是 vue 文件内容还是要事先准备好
+ */
+const modules = import.meta.globEager('@/router/routes/modules/**/*.js'); // Vite 支持使用特殊的 import.meta.glob 函数从文件系统导入多个模块
+const routeModuleList = [];
+
+Object.keys(modules).forEach((key) => {
+  const mod = modules[key].default || {};
+  const modList = Array.isArray(mod) ? [...mod] : [mod];
+  routeModuleList.push(...modList);
+});
+
+// 创建路由实例并传递 `routes` 配置
+const router = createRouter({
+  history: createWebHashHistory('/index.html'),
+  routes: [...RootRoute, ...routeModuleList]
+});
+
+// TAG: 动态生成路由
+/**
+ * generateRoute 负责把后台返回数据拼接成项目需要的路由结构，动态添加到路由表里面
+ */
+router.beforeEach((to, from, next) => {
+  // 使用404为中转页面，避免动态路由没有渲染出来，控制台报警告问题
+  if (to.path == '/404' && to.redirectedFrom != undefined) {
+    // 模拟异步操作
+    setTimeout(() => {
+      if (!asyncRoutesArr.length) return; // 没有动态路由避免报错
+      const arr = generateRoutes(asyncRoutesArr); // 在路由守卫处生成，避免有子路由时刷新白屏问题。
+      arr.forEach(item => {
+        router.addRoute(item) // 新增路由
+      })
+      // 重写被404覆盖路由信息
+      next({ ...to.redirectedFrom, replace: true });
+    }, 1000);
+  } else {
+    next()
+  }
+})
+
+router.afterEach(() => {
+  // console.warn(to);
+  // console.warn(wx);
+  // share(to)
+})
+
+export default router;

+/*
+ * @Author: hookehuyr hookehuyr@gmail.com
+ * @Date: 2022-06-07 18:03:50
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-08 19:35:53
+ * @FilePath: /tswj/src/router/methods/goToVideoDetail.ts
+ * @Description:
+ */
+// import { useRouter } from 'vue-router';
+import $router from '@/router';
+
+/**
+ * 路由跳转视频详情页
+ * @param prod_id 作品ID
+ * @param perf_id 表演者ID
+ * @param book_id 书籍ID
+ * @param type 特殊标识，判断入口 为keepAlive使用
+ */
+const fn = ({
+  prod_id,
+  perf_id,
+  book_id,
+  type,
+}: {
+  prod_id: string;
+  perf_id: string;
+  book_id: string;
+  type?: string;
+}): void => {
+  $router.push({
+    path: '/client/videoDetail',
+    query: {
+      prod_id,
+      perf_id,
+      book_id,
+      type,
+    },
+  });
+};
+
+export default fn;

+const index = [{
+  path: '/auth',
+  name: '授权跳转页',
+  component: () => import('@/views/auth.vue'),
+  meta: {
+    title: '微信授权'
+  },
+  children: []
+}]
+
+export default index;

+export default {
+  defaultPageSize: 10,
+}

+/*
+ * @Author: hookehuyr hookehuyr@gmail.com
+ * @Date: 2022-05-26 10:08:06
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-02 22:50:53
+ * @FilePath: /tswj/src/settings/designSetting.js
+ * @Description: 
+ */
+import { ref } from 'vue';
+import { styleColor } from '@/constant.js';
+
+export const styleObject1 = ref({
+  backgroundColor: styleColor.baseFontColor,
+  color: styleColor.baseColor,
+  borderColor: styleColor.baseColor
+})
+
+export const styleObject2 = ref({
+  backgroundColor: styleColor.baseColor,
+  color: styleColor.baseFontColor,
+  borderColor: styleColor.baseColor
+})
+
+export const styleObject3 = ref({
+  // backgroundColor: '#6D97D2',
+  backgroundColor: '#F4675A',
+  color: styleColor.baseFontColor,
+  // borderColor: '#6D97D2'
+  borderColor: '#F4675A'
+})
+
+export const styleObject4 = ref({
+  backgroundColor: styleColor.baseFontColor,
+  color: '#713610',
+  borderColor: '#713610'
+})
+
+export const styleObject5 = ref({
+  backgroundColor: styleColor.baseFontColor,
+  color: '#FDD347',
+  borderColor: '#FDD347'
+})
+
+export const styleObject6 = ref({
+  backgroundColor: styleColor.baseFontColor,
+  color: '#777777',
+  borderColor: '#777777'
+})
+
+export const styleObject7 = ref({
+  backgroundColor: styleColor.baseFontColor,
+  color: '#0B3A72',
+  borderColor: '#0B3A72'
+})

+/*
+ * @Author: hookehuyr hookehuyr@gmail.com
+ * @Date: 2022-06-07 22:46:46
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-08 05:34:56
+ * @FilePath: /tswj/src/shims-vue.d.ts
+ * @Description:
+ */
+declare module '*.vue' {
+  import type { DefineComponent } from 'vue';
+  const component: DefineComponent;
+  export default component;
+}

+/*
+ * @Date: 2022-04-18 15:59:42
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-13 11:30:40
+ * @FilePath: /tswj/src/store/index.js
+ * @Description: 文件描述
+ */
+import { defineStore } from 'pinia';
+// import { testStore } from './test'; // 另一个store
+import _ from 'lodash';
+import { useRouter } from 'vue-router'
+
+export const mainStore = defineStore('main', {
+  state: () => {
+    return {
+      msg: 'Hello world',
+      count: 0,
+      auth: false,
+      comment_num: 0,
+      video_detail: {},
+      scrollTop: 0,
+      scrollTopCollection: 0,
+      scrollTopLike: 0,
+      scrollTopPerson: 0,
+      keepPages: ['default'], // 很坑爹，空值全部都缓存
+    };
+  },
+  getters: {
+    getKeepPages () {
+      return this.keepPages
+    },
+    // getTestStoreList () {
+    //   return testStore().list // 返回另一个store的值
+    // }
+  },
+  actions: {
+    changeState (state) {
+      this.auth = state;
+    },
+    changeCommentNum (num) {
+      this.comment_num = num;
+    },
+    changeVideoDetail (v) {
+      this.video_detail = v;
+    },
+    changeScrollTop (v) {
+      this.scrollTop = v;
+    },
+    changeScrollTopCollection (v) {
+      this.scrollTopCollection = v;
+    },
+    changeScrollTopLike (v) {
+      this.scrollTopLike = v;
+    },
+    changeScrollTopPerson (v) {
+      this.scrollTopPerson = v;
+    },
+    changeKeepPages () { // 清空所有缓存，用一个不存在的值覆盖
+      this.keepPages = ['default'];
+    },
+    keepThisPage () { // 新增缓存页
+      const $router = useRouter();
+      const page = $router.currentRoute.value.meta.name;
+      this.keepPages.push(page);
+    },
+    removeThisPage () { // 删除缓存页
+      const $router = useRouter();
+      const page = $router.currentRoute.value.meta.name;
+      _.remove(this.keepPages, item => item === page)
+    }
+  },
+});

+/*
+ * @Author: hookehuyr hookehuyr@gmail.com
+ * @Date: 2022-05-25 18:34:17
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-22 01:35:44
+ * @FilePath: /tswj/src/theme-vars.js
+ * @Description: 修改vant默认表单样式
+ */
+import { styleColor } from '@/constant.js';
+
+export const loginTheme = {
+  buttonPrimaryBackground: styleColor.baseColor,
+  buttonPrimaryBorderColor: styleColor.baseColor,
+  buttonPrimaryColor: styleColor.baseFontColor,
+  CellVerticalPadding: '14px'
+};

+/*
+ * @Date: 2022-06-20 01:22:50
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-20 01:23:18
+ * @FilePath: /tswj/src/composables/useMonitorKeyboard.js
+ * @Description: 文件描述
+ */
+/**
+ * @class 监听虚拟键盘
+ * @classdesc 监听虚拟键盘弹出隐藏
+ * @public onEnd 结束监听虚拟键盘
+ * @public onShow 传递一个回调 监听虚拟键盘弹出
+ * @public onHidden 传递一个回调 监听虚拟键盘隐藏
+ */
+class MonitorKeyboard {
+  constructor() {
+    this.type = this.IsIA();
+    this.originalHeight = window.innerHeight;
+  }
+
+  /**
+   *  @function IsIA 获取设备类型
+   *  @param  1 Android 2 iOS  
+   */
+  IsIA = () => {
+    const userAgent = typeof window === 'object' ? window.navigator.userAgent : '';
+    if (/android/i.test(userAgent)) {
+      return 1;
+    } else if (/iPhone|iPod|iPad/i.test(userAgent)) {
+      return 2;
+    }
+  }
+
+  // Android系统
+  onResize = () => {
+    //键盘弹起与隐藏都会引起窗口的高度发生变化
+    const resizeHeight = window.innerHeight;
+
+    if (this.originalHeight - resizeHeight > 50) {
+      this.show('Android系统: 软键盘弹出');
+    } else {
+      this.hidden('Android系统: 软键盘收起');
+    }
+  }
+
+  // iOS获取焦点
+  onFocusin = () => {
+    this.show('iOS系统:软键盘弹出');
+  }
+
+  // iOS失去焦点
+  onFocusout = () => {
+    this.hidden('iOS系统:软键盘收起');
+  }
+
+  /**  
+   * @function onStart 开始监听虚拟键盘  
+   */
+  onStart = () => {
+    if (this.type == 1) {
+      // 获取窗口的高度
+      window.addEventListener('resize', this.onResize);
+    }
+    if (this.type == 2) {
+      // iOS系统
+      window.addEventListener('focusin', this.onFocusin);
+      window.addEventListener('focusout', this.onFocusout);
+    }
+  }
+
+  /** 
+   * @function onEnd 结束监听虚拟键盘  
+   */
+  onEnd = () => {
+    if (this.type == 1) {
+      //获取窗口的高度
+      window.removeEventListener('resize', this.onResize);
+    }
+    if (this.type == 2) {
+      window.removeEventListener('focusin', this.onFocusin);
+      window.removeEventListener('focusout', this.onFocusout);
+    }
+  }
+
+  /**
+   * @function  onShow 传递一个回调函数
+   * @param  虚拟键盘弹出时触发
+   */
+  onShow = (fn) => {
+    this.show = fn;
+  }
+
+  /**
+    * @function  onHidden 传递一个回调函数
+    * @param  虚拟键盘隐藏时触发
+    */
+  onHidden = (fn) => {
+    this.hidden = fn;
+  }
+}
+
+export default MonitorKeyboard

+/*
+ * @Author: hookehuyr hookehuyr@gmail.com
+ * @Date: 2022-05-28 10:17:40
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-30 01:30:26
+ * @FilePath: /tswj/src/utils/axios.js
+ * @Description:
+ */
+import axios from 'axios';
+import router from '@/router';
+import qs from 'Qs'
+import { strExist } from '@/utils/tools'
+// import { parseQueryString } from '@/utils/tools'
+
+axios.defaults.params = {
+  f: 'voice',
+};
+
+/**
+ * @description 请求拦截器
+ */
+axios.interceptors.request.use(
+  config => {
+    // const url_params = parseQueryString(location.href);
+    // GET请求默认打上时间戳，避免从缓存中拿数据。
+    const timestamp = config.method === 'get' ? (new Date()).valueOf() : '';
+    /**
+     * POST PHP需要修改数据格式
+     * 序列化POST请求时需要屏蔽上传相关接口，上传相关接口序列化后报错
+     */
+    config.data = config.method === 'post' && !strExist(['a=upload', 'upload.qiniup.com'], config.url) ? qs.stringify(config.data) : config.data;
+    // 绑定默认请求头
+    config.params = { ...config.params, timestamp }
+    return config;
+  },
+  error => {
+    // 请求错误处理
+    return Promise.reject(error);
+  });
+
+/**
+ * @description 响应拦截器
+ */
+axios.interceptors.response.use(
+  response => {
+    // 默认显示错误提示
+    response.data.show = true;
+    // 判断微信授权状态，进入页面时未授权需要授权跳转
+    // C/B 授权拼接头特殊标识，openid_x
+    let prefixAPI = router?.currentRoute.value.href?.indexOf('business') > 0 ? 'b' : 'c';
+    if (response.data.code === 401) {
+      // 特殊标识-带此标识报错不显示
+      response.data.show = false;
+      /**
+       * 未授权跳转登录页
+       * 带着上一个页面的信息, 授权完成后 返回当前页面
+       */
+      router.replace({ path: '/auth', query: { href: location.hash, prefixAPI } });
+    }
+    // 拦截B端未登录情况
+    if (['老师请先登录！', '老师不存在！'].includes(response.data.msg)) { router.replace({ path: '/business/login' }); }
+    return response;
+  },
+  error => {
+    return Promise.reject(error);
+  });
+
+export default axios;

+/*
+ * @Author: hookehuyr hookehuyr@gmail.com
+ * @Date: 2022-05-17 11:34:35
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-20 16:31:28
+ * @FilePath: /tswj/src/utils/generateIcons.js
+ * @Description: 图标集合
+ */
+import icon_video from '@images/video.png'
+import icon_up from '@images/icon-guanbi@2x.png'
+import icon_down from '@images/icon-zhankai@2x.png'
+import icon_subscribed from '@images/icon-dingyue01@2x.png'
+import icon_unsubscribe from '@images/icon-dingyue02@2x.png'
+import no_image from '@images/que-shuju@2x.png'
+import icon_avatar from '@images/que-touxiang@2x.png'
+import icon_logo from '@images/que-logo@2x.png'
+import icon_dianzan1 from '@images/icon-dianzan01@2x.png'
+import icon_dianzan2 from '@images/icon-dianzan02@2x.png'
+import icon_shoucang1 from '@images/icon-shoucang01@2x.png'
+import icon_shoucang2 from '@images/icon-shoucang02@2x.png'
+import icon_liuyan from '@images/icon-liuyan@2x.png'
+import icon_book from '@images/shu@2x.png'
+import icon_me from '@images/icon-my@2x.png'
+import icon_home from '@images/icon-home@2x.png'
+import icon_rank from '@images/icon-paihang@2x.png'
+import icon_ranking1 from '@images/1@2x.png'
+import icon_ranking2 from '@images/2@2x.png'
+import icon_ranking3 from '@images/3@2x.png'
+import icon_flower from '@images/xiaohua@2x.png'
+import icon_refuse from '@images/icon-jujue@2x.png'
+import icon_apply from '@images/icon-shenhe@2x.png'
+import icon_enable from '@images/icon-tongguo@2x.png'
+
+export {
+  icon_video,
+  icon_up,
+  icon_down,
+  icon_subscribed,
+  icon_unsubscribe,
+  no_image,
+  icon_avatar,
+  icon_logo,
+  icon_dianzan1,
+  icon_dianzan2,
+  icon_liuyan,
+  icon_shoucang1,
+  icon_shoucang2,
+  icon_book,
+  icon_me,
+  icon_home,
+  icon_rank,
+  icon_ranking1,
+  icon_ranking2,
+  icon_ranking3,
+  icon_flower,
+  icon_refuse,
+  icon_apply,
+  icon_enable,
+}

+/*
+ * @Author: hookehuyr hookehuyr@gmail.com
+ * @Date: 2022-05-17 11:17:58
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-07-01 14:55:12
+ * @FilePath: /tswj/src/utils/generateModules.js
+ * @Description: 
+ */
+import MyButton from '@/components/MyButton/index.vue'
+import VideoCard from '@/components/VideoCard/index.vue'
+import NoticeOverlay from '@/components/NoticeOverlay/index.vue'
+import NoticeOverlayModule from '@/components/NoticeOverlayModule/index.vue'
+import DonateBook from '@/components/DonateBook/index.vue'
+import ShortcutFixed from '@/components/ShortcutFixed/index.vue'
+import BookCard from '@/components/BookCard/index.vue'
+import VideoDetail from '@/components/VideoDetail/index.vue'
+import DonateBar from '@/components/DonateBar/index.vue'
+import DonateFlower from '@/components/DonateFlower/index.vue'
+
+export {
+  MyButton,
+  VideoCard,
+  NoticeOverlay,
+  NoticeOverlayModule,
+  DonateBook,
+  ShortcutFixed,
+  BookCard,
+  VideoDetail,
+  DonateBar,
+  DonateFlower,
+}

+/*
+ * @Date: 2022-05-17 11:26:03
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-20 14:00:13
+ * @FilePath: /tswj/src/utils/generatePackage.js
+ * @Description: 文件描述
+ */
+import Cookies from 'js-cookie'
+import $ from 'jquery'
+import _ from 'lodash'
+import axios from '@/utils/axios';
+import { storeToRefs } from 'pinia'
+import { mainStore } from '@/store'
+import { Toast, Dialog } from 'vant';
+import { wxInfo, hasEllipsis } from '@/utils/tools';
+import { useTitle } from '@vueuse/core'
+
+export {
+  Cookies,
+  $,
+  _,
+  axios,
+  storeToRefs,
+  mainStore,
+  Toast,
+  Dialog,
+  wxInfo,
+  hasEllipsis,
+  useTitle
+}

+/*
+ * @Date: 2022-05-16 17:21:45
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-29 17:00:15
+ * @FilePath: /tswj/src/utils/generateRoute.js
+ * @Description: 文件描述
+ */
+
+/**
+ * 根据后台返回的路径，生成页面的组件模版
+ * @param {*} component 
+ * @returns 模版地址
+ */
+function loadView(component) {
+  return () => import(`../views/${component}.vue`)
+}
+
+/**
+ * 生成路由结构
+ * @param {*} routes
+ */
+const generateRoutes = (routes) => {
+  const arr = []
+  routes.forEach(route => {
+    const router = {}
+    const {
+      path,
+      redirect,
+      name,
+      component,
+      keepAlive,
+      meta,
+      children
+    } = route
+
+    router.path = path
+    redirect && (router.redirect = redirect)
+    name && (router.name = name)
+    router.component = loadView(component)
+    keepAlive && (router.keepAlive = keepAlive)
+    meta && (router.meta = meta)
+    router.children = !Array.isArray(children) || generateRoutes(children);
+    arr.push(router)
+  })
+  return arr
+}
+
+export default generateRoutes;

+import wx from 'weixin-js-sdk'
+import axios from '@/utils/axios';
+
+const fn = (to) => {
+  // 路由名
+  let ruleName = location.href.split('#/')[1].split('?')[0];
+  
+  const icon = 'https://cdn.lifeat.cn/webappgroup/betterLifelogo.png'
+  
+  const shareInfoMap = {
+    'client/index': {
+      title: '童声无界',
+      desc: '引导页',
+      icon
+    },
+    'client/chooseSchool': {
+      title: '选择幼儿园',
+      desc: '引导页',
+      icon
+    },
+    default: {
+      title: to.name,
+      desc: window.location.href,
+      icon
+    },
+  }
+  let infoMap = shareInfoMap[ruleName] ? shareInfoMap[ruleName] : shareInfoMap['default'];
+  // console.warn(ruleName);
+  console.warn(infoMap);
+  console.warn(wx);
+  console.warn(axios);
+}
+export default fn
+// 这个判断后加的为了减少请求次数，据后端说有次数限制，当需要分享的页面才去请求接口。
+// if (shareInfoMap[ruleName]) {
+//   // request 是封装的请求
+//   request.post('/wxmp/sign/jsSdk', {
+//     url: location.href,
+//   }).then(res => {
+//     let { timestamp, nonceStr, signature, appId } = res;
+//     wx.config({
+//       debug: false,
+//       appId,
+//       timestamp,
+//       nonceStr,
+//       signature,
+//       jsApiList: ['updateAppMessageShareData', 'updateTimelineShareData']
+//     });
+//     wx.error(function (errres) {
+//       console.info(errres)
+//     })
+//     wx.ready(() => {   //需在用户可能点击分享按钮前就先调用
+//       console.info('ready')
+//       //分享朋友
+//       wx.updateAppMessageShareData({
+//         title: infoMap.title, // 分享标题
+//         desc: infoMap.desc, // 分享描述
+//         link: location.href, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
+//         imgUrl: infoMap.icon, // 分享图标
+//         success: function () {
+//           console.info("成功")
+//           // 设置成功
+//         },
+//         fail: function (erres) {
+//           console.info('失败：', erres)
+//         }
+//       })
+//       //分享到 朋友圈
+//       wx.updateTimelineShareData({
+//         title: infoMap.title, // 分享标题
+//         link: location.href, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
+//         imgUrl: infoMap.icon, // 分享图标
+//         success: function () {
+//           console.info("成功")
+//           // 设置成功
+//         },
+//         fail: function (erres) {
+//           console.info('失败：', erres)
+//         }
+//       })
+//     });
+//   }).catch(err => {
+//     console.info('err:', err)
+//   })
+// }
\ No newline at end of file

+/*
+ * @Date: 2022-04-18 15:59:42
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-30 13:54:32
+ * @FilePath: /tswj/src/utils/tools.js
+ * @Description: 文件描述
+ */
+import dayjs from 'dayjs';
+
+// 格式化时间
+const formatDate = (date) => {
+  return dayjs(date).format('YYYY-MM-DD HH:mm');
+};
+
+/**
+ * @description 判断浏览器属于平台
+ * @returns 
+ */
+const wxInfo = () => {
+  let u = navigator.userAgent;
+  let isAndroid = u.indexOf('Android') > -1 || u.indexOf('Linux') > -1; //android终端或者uc浏览器
+  let isiOS = !!u.match(/\(i[^;]+;( U;)? CPU.+Mac OS X/); //ios终端
+  let uAgent = navigator.userAgent.toLowerCase();
+  let isTable = (uAgent.match(/MicroMessenger/i) == 'micromessenger') ? true : false;
+  return {
+    isAndroid,
+    isiOS,
+    isTable
+  };
+};
+
+/**
+ * @description 判断多行省略文本
+ * @param {*} id 目标dom标签
+ * @returns 
+ */
+const hasEllipsis = (id) => {
+  let oDiv = document.getElementById(id);
+  let flag = false;
+  if (oDiv.scrollHeight > oDiv.clientHeight) {
+    flag = true
+  }
+  return flag
+}
+
+/**
+ * @description 解析URL参数
+ * @param {*} url 
+ * @returns 
+ */
+const parseQueryString = url => {
+  var json = {};
+  var arr = url.indexOf('?') >= 0 ? url.substr(url.indexOf('?') + 1).split('&') : [];
+  arr.forEach(item => {
+    var tmp = item.split('=');
+    json[tmp[0]] = tmp[1];
+  });
+  return json;
+}
+
+/**
+ * 字符串包含字符数组中字符的状态
+ * @param {*} array 字符数组
+ * @param {*} str 字符串
+ * @returns 包含状态
+ */
+const strExist = (array, str) => {
+  const exist = array.filter(arr => {
+    if (str.indexOf(arr) >= 0) return str;
+  })
+  return exist.length > 0
+}
+
+export { formatDate, wxInfo, hasEllipsis, parseQueryString, strExist };

+import VConsole from 'vconsole';
+
+// const vConsole = new VConsole();
+let vConsole = '';
+// 或者使用配置参数来初始化，详情见文档
+if (+import.meta.env.VITE_CONSOLE) {
+  vConsole = new VConsole({ theme: 'dark' });
+}
+
+export default vConsole

+<template>
+  <div class="">router test</div>
+</template>
+
+<script setup>
+</script>
+
+<style lang="less" scoped>
+</style>

+<template>
+  <div />
+</template>
+
+<script setup>
+import { onMounted } from 'vue'
+import { useRoute } from 'vue-router'
+
+const $route = useRoute();
+
+onMounted(() => {
+  // php需要先跳转链接获取openid
+  /**
+   * encodeURIComponent() 函数可把字符串作为 URI 组件进行编码。
+   * 该方法不会对 ASCII 字母和数字进行编码，也不会对这些 ASCII 标点符号进行编码： - _ . ! ~ * ' ( ) 。
+   * 其他字符（比如 ：;/?:@&=+$,# 这些用于分隔 URI 组件的标点符号），都是由一个或多个十六进制的转义序列替换的。
+   */
+  let raw_url = encodeURIComponent(location.origin + location.pathname + $route.query.href); // 未授权的地址
+  // TAG: 开发环境测试数据
+  const short_url = `/srv/?f=voice&a=openid_${$route.query.prefixAPI}&res=${raw_url}`;
+  location.href = import.meta.env.DEV
+    ? `${short_url}&input_openid=${import.meta.env.VITE_OPENID}`
+    : `${short_url}`;
+})
+</script>

+<!--
+ * @Date: 2023-05-19 14:54:27
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2023-05-29 06:15:20
+ * @FilePath: /tswj/src/views/Map.vue
+ * @Description: 文件描述
+-->
+<template>
+  <div class="">
+    <div id="container"></div>
+    <div class="input-card">
+      <div class="input-item">
+        <span @click="showPublic" class="btn">显示公共设施</span>
+        <span @click="hidePublic" class="btn">隐藏公共设施</span>
+      </div>
+      <div class="input-item">
+        <button class="btn" @click="addLayer" style="margin-right:1rem;">添加图层</button>
+        <button class="btn" @click="removeLayer">删除图层</button>
+      </div>
+      <div class="input-item">
+        <button class="btn" @click="setLocation" style="margin-right:1rem;">定位服务</button>
+        <button class="btn" @click="addLocation" style="margin-right:1rem;">添加定位路线</button>
+        <button class="btn" @click="removeLocation" style="margin-right:1rem;">删除定位路线</button>
+        <button class="btn" @click="setTitleLayer" style="margin-right:1rem;">添加贴片</button>
+      </div>
+      <div class="input-item">
+        <button class="btn" @click="setSpotLayer" style="margin-right:1rem;">景点信息</button>
+        <button class="btn" @click="setToiletLayer" style="margin-right:1rem;">卫生间</button>
+      </div>
+      <div class="input-item">
+        <button class="btn" @click="setWalkRoute" style="margin-right:1rem;">步行导航</button>
+        <button class="btn" @click="removeWalkRoute" style="margin-right:1rem;">移除步行导航</button>
+      </div>
+    </div>
+    <van-popup v-model:show="show_popup" position="bottom" :overlay="false" closeable
+      :style="{ padding: '64px' }">内容</van-popup>
+
+    <van-dialog v-model:show="dialog_show" title="温馨提示">
+      <div style="padding: 1rem; text-align: center;">您不在景区范围内</div>
+    </van-dialog>
+  </div>
+</template>
+
+<script>
+// import { Flexbox, FlexboxItem } from 'vux'
+// import { mapState } from 'vuex'
+import coord from '@/common/tiantan_v2'
+// import AMap from 'AMap'
+import _ from 'lodash';
+import { makeRequiredProp } from 'vant/lib/utils';
+
+const GPS = {
+  PI: 3.14159265358979324,
+  x_pi: 3.14159265358979324 * 3000.0 / 180.0,
+  delta: function (lat, lon) {
+    var a = 6378245.0; //  a: 卫星椭球坐标投影到平面地图坐标系的投影因子。
+    var ee = 0.00669342162296594323; //  ee: 椭球的偏心率。
+    var dLat = this.transformLat(lon - 105.0, lat - 35.0);
+    var dLon = this.transformLon(lon - 105.0, lat - 35.0);
+    var radLat = lat / 180.0 * this.PI;
+    var magic = Math.sin(radLat);
+    magic = 1 - ee * magic * magic;
+    var sqrtMagic = Math.sqrt(magic);
+    dLat = (dLat * 180.0) / ((a * (1 - ee)) / (magic * sqrtMagic) * this.PI);
+    dLon = (dLon * 180.0) / (a / sqrtMagic * Math.cos(radLat) * this.PI);
+    return {
+      'lat': dLat,
+      'lon': dLon
+    };
+  },
+  //WGS-84 to GCJ-02
+  gcj_encrypt: function (wgsLat, wgsLon) {
+    if (this.outOfChina(wgsLat, wgsLon))
+      return {
+        'lat': wgsLat,
+        'lon': wgsLon
+      };
+
+    var d = this.delta(wgsLat, wgsLon);
+    return {
+      'lat': wgsLat + d.lat,
+      'lon': wgsLon + d.lon
+    };
+  },
+  outOfChina: function (lat, lon) {
+    if (lon < 72.004 || lon > 137.8347)
+      return true;
+    if (lat < 0.8293 || lat > 55.8271)
+      return true;
+    return false;
+  },
+  transformLat: function (x, y) {
+    var ret = -100.0 + 2.0 * x + 3.0 * y + 0.2 * y * y + 0.1 * x * y + 0.2 * Math.sqrt(Math.abs(x));
+    ret += (20.0 * Math.sin(6.0 * x * this.PI) + 20.0 * Math.sin(2.0 * x * this.PI)) * 2.0 / 3.0;
+    ret += (20.0 * Math.sin(y * this.PI) + 40.0 * Math.sin(y / 3.0 * this.PI)) * 2.0 / 3.0;
+    ret += (160.0 * Math.sin(y / 12.0 * this.PI) + 320 * Math.sin(y * this.PI / 30.0)) * 2.0 / 3.0;
+    return ret;
+  },
+  transformLon: function (x, y) {
+    var ret = 300.0 + x + 2.0 * y + 0.1 * x * x + 0.1 * x * y + 0.1 * Math.sqrt(Math.abs(x));
+    ret += (20.0 * Math.sin(6.0 * x * this.PI) + 20.0 * Math.sin(2.0 * x * this.PI)) * 2.0 / 3.0;
+    ret += (20.0 * Math.sin(x * this.PI) + 40.0 * Math.sin(x / 3.0 * this.PI)) * 2.0 / 3.0;
+    ret += (150.0 * Math.sin(x / 12.0 * this.PI) + 300.0 * Math.sin(x / 30.0 * this.PI)) * 2.0 / 3.0;
+    return ret;
+  }
+};
+
+export default {
+  // components: { Flexbox, FlexboxItem },
+  data() {
+    return {
+      map: '',
+      facilities: [],
+      imageLayer: '',
+      location_options: {
+        'showButton': true, // 是否显示定位按钮
+        'buttonPosition': 'LB', // 定位按钮的位置
+        /* LT LB RT RB */
+        'buttonOffset': new AMap.Pixel(10, 20), // 定位按钮距离对应角落的距离
+        'showMarker': true, // 是否显示定位点
+        'markerOptions': { // 自定义定位点样式，同Marker的Options
+          'offset': new AMap.Pixel(-18, -36),
+          'content': '<img src="https://a.amap.com/jsapi_demos/static/resource/img/user.png" style="width:36px;height:36px"/>'
+        },
+        'showCircle': true, // 是否显示定位精度圈
+        'circleOptions': { // 定位精度圈的样式
+          'strokeColor': '#0093FF',
+          'noSelect': true,
+          'strokeOpacity': 0.5,
+          'strokeWeight': 1,
+          'fillColor': '#02B0FF',
+          'fillOpacity': 0.25
+        },
+        enableHighAccuracy: true
+      },
+      geolocation: '',
+      current_lng: '',
+      current_lat: '',
+      current_route: '',
+      spotInfo: [], // 景点信息实体
+      toiletInfo: [], // 厕所信息实体
+      show_popup: false,
+      dialog_show: false,
+      xys_lng: '',
+      xys_lat: '',
+      walk_route: '',
+    }
+  },
+  mounted() {
+    // 初始化地图
+    this.initMap();
+    this.loadPublicEquipment();
+    this.loadScenicSpot();
+    this.loadPlant();
+    // this.setMapBoundary();
+    // 使用之前都要再获取一下地址
+    this.getLocation()
+  },
+  methods: {
+    // addMarker () {
+    //   // axios.get('http://api.map.baidu.com/location/ip?ak=CzpAXV4bhyqCKnWpQqLRkS1i&coor=bd09ll')
+    //   axios.get('https://restapi.amap.com/v5/ip?ip=114.88.176.153&type=4&key=d50d6e58d65408db18af05c0a9422a44')
+    //   .then(res => {
+    //     if (res.statusText === 'OK') {
+    //       console.warn(res.data);
+    //       //
+    //       let marker = new AMap.Marker({
+    //         icon: 'https://a.amap.com/jsapi_demos/static/demo-center/icons/poi-marker-default.png',
+    //         position: [121.54431, 31.30164],
+    //         offset: new AMap.Pixel(-13, -30)
+    //       });
+    //       marker.setMap(this.map);
+    //     } else {
+    //       console.warn(res);
+    //       this.$vux.toast.show({
+    //         type: 'warn',
+    //         text: res.data.msg
+    //       });
+    //     }
+    //   })
+    //   .catch(err => {
+    //     console.error(err);
+    //   })
+    // },
+    initMap() {
+      // 初始化地图
+      this.map = new AMap.Map('container', {
+        viewMode: '3D', // 设置地图模式
+        turboMode: false,
+        showIndoorMap: false,
+        defaultCursor: 'pointer', // 地图默认鼠标样式
+        showBuildingBlock: false, // 是否展示地图 3D 楼块
+        zooms: [17, 19], // 地图显示的缩放级别范围, 默认为 [2, 20] ，取值范围 [2 ~ 30]
+        showLabel: true, // 是否展示地图文字和 POI 信息
+        zoom: 18, // 设置地图显示的缩放级别
+        pitch: 0, // 俯仰角度，默认 0，最大值根据地图当前 zoom 级别不断增大，2D地图下无效 。
+        rotation: 0, // 地图顺时针旋转角度，取值范围 [0-360] ，默认值：0
+        center: [120.587382, 31.314504], // 设置地图中心点坐标
+        forceVector: false,
+        rotateEnable: false,
+        layers: [
+          // new AMap.TileLayer.RoadNet(),
+        ]
+      });
+      // 添加地图点击事件
+      this.map.on("click", this.showInfoClick);
+    },
+    layerMap() {
+      // 图层地图
+      this.imageLayer = new AMap.ImageLayer({
+        url: 'http://amappc.cn-hangzhou.oss-pub.aliyun-inc.com/lbs/static/img/dongwuyuan.jpg',
+        // url: 'https://img.zcool.cn/community/01462356c80e976ac7252ce62bc446.jpg@1280w_1l_0o_100sh.jpg',
+        // url: 'https://cdn.ipadbiz.cn/tmp/map_test/xys.jpg',
+        bounds: new AMap.Bounds(
+          [116.406897, 39.874346], [116.417451, 39.887843] // 对象西南角经纬度和东北角经纬度值
+        ),
+        opacity: 0.5, // 图层透明度，默认为 1
+        zooms: [2, 18],
+        zIndex: 6 // 图层的层级，默认为 6
+      });
+      this.map = new AMap.Map('container', {
+        viewMode: '3D', // 设置地图模式
+        turboMode: false,
+        showIndoorMap: false,
+        defaultCursor: 'pointer', // 地图默认鼠标样式
+        showBuildingBlock: false, // 是否展示地图 3D 楼块
+        zooms: [2, 20], // 地图显示的缩放级别范围, 默认为 [2, 20] ，取值范围 [2 ~ 30]
+        showLabel: false, // 是否展示地图文字和 POI 信息
+        zoom: 18, // 设置地图显示的缩放级别
+        pitch: 0, // 俯仰角度，默认 0，最大值根据地图当前 zoom 级别不断增大，2D地图下无效 。
+        rotation: 0, // 地图顺时针旋转角度，取值范围 [0-360] ，默认值：0
+        center: [116.408967, 39.880101], // 设置地图中心点坐标
+        forceVector: false,
+        rotateEnable: false,
+        layers: [
+          new AMap.TileLayer.RoadNet(),
+          this.imageLayer
+        ]
+      });
+    },
+    layerMap1() {
+      // 图层地图
+      this.imageLayer = new AMap.ImageLayer({
+        // url: 'http://amappc.cn-hangzhou.oss-pub.aliyun-inc.com/lbs/static/img/dongwuyuan.jpg',
+        // url: 'https://img.zcool.cn/community/01462356c80e976ac7252ce62bc446.jpg@1280w_1l_0o_100sh.jpg',
+        url: 'images/xys1.png',
+        bounds: new AMap.Bounds(
+          [120.585202, 31.312918], [120.588828, 31.316511] // 对象西南角经纬度和东北角经纬度值
+          // [116.327911, 39.939229],
+          // [116.342659, 39.946275] // 对象西南角经纬度和东北角经纬度值
+        ),
+        opacity: 1, // 图层透明度，默认为 1
+        zooms: [2, 20],
+        zIndex: 6 // 图层的层级，默认为 6
+      });
+      this.map = new AMap.Map('container', {
+        viewMode: '3D', // 设置地图模式
+        turboMode: false,
+        showIndoorMap: false,
+        defaultCursor: 'pointer', // 地图默认鼠标样式
+        showBuildingBlock: false, // 是否展示地图 3D 楼块
+        zoom: 18, // 设置地图显示的缩放级别
+        zooms: [2, 20], // 地图显示的缩放级别范围, 默认为 [2, 20] ，取值范围 [2 ~ 30]
+        showLabel: false, // 是否展示地图文字和 POI 信息
+        pitch: 0, // 俯仰角度，默认 0，最大值根据地图当前 zoom 级别不断增大，2D地图下无效 。
+        rotation: 0, // 地图顺时针旋转角度，取值范围 [0-360] ，默认值：0
+        center: [120.587237, 31.314805], // 设置地图中心点坐标
+        forceVector: false,
+        rotateEnable: false,
+        resizeEnable: true, //是否监控地图容器尺寸变化
+        layers: [
+          new AMap.TileLayer.RoadNet(),
+          this.imageLayer,
+        ]
+      });
+    },
+    layerMap2() {
+      // 图层地图
+      this.imageLayer = new AMap.ImageLayer({
+        url: 'https://amappc.cn-hangzhou.oss-pub.aliyun-inc.com/lbs/static/img/dongwuyuan.jpg',
+        bounds: new AMap.Bounds(
+          [116.327911, 39.939229],
+          [116.342659, 39.946275]
+        ),
+        zooms: [15, 20]
+      });
+      this.map = new AMap.Map('container', {
+        center: [120.587237, 31.314805],
+        zoom: 15,
+        layers: [
+          AMap.createDefaultLayer(),
+          // this.imageLayer,
+        ]
+      });
+    },
+    loadPublicEquipment() { // 加载公共设备图标
+      var zoomStyleMapping = { 14: 0, 15: 0, 16: 0, 17: 0, 18: 0, 19: 0, 20: 0 };
+      _.each(coord.sheshi, (x, i) => {
+        var marker = new AMap.ElasticMarker({
+          position: coord.sheshi[i].position,
+          zooms: [14, 20],
+          styles: [{
+            icon: {
+              img: coord.sheshi[i].icon,
+              size: [16, 16], // 可见区域的大小
+              anchor: 'bottom-center', // 锚点
+              fitZoom: 14, // 最合适的级别
+              scaleFactor: 2, // 地图放大一级的缩放比例系数
+              maxScale: 1.4, // 最大放大比例
+              minScale: 0.8 // 最小放大比例
+            }
+          }],
+          zoomStyleMapping
+        });
+        let infoWindowContent =
+          '<div className="custom-infowindow input-card">' +
+          '<label style="color:grey">公共厕所</label>' +
+          // 为 infowindow 添加自定义事件
+          '<div id="lnglat2container" class="btn">我要走过去</div>' +
+          '</div>';
+        // 创建一个自定义内容的 infowindow 实例
+        let infoWindow = new AMap.InfoWindow({
+          position: coord.sheshi[i].position,
+          offset: new AMap.Pixel(0, -30),
+          content: infoWindowContent
+        });
+        if (clickListener) {
+          makeRequiredProp.off('click', clickListener)
+        }
+        // 绑定景点的点击事件 - 文字出现才能触发
+        var clickListener = marker.on('click', (e) => {
+          infoWindow.open(this.map);
+        })
+        //
+        this.facilities.push(marker);
+      })
+      this.map.add(this.facilities);
+    },
+    loadScenicSpot() { // 加载景点图标
+      var spots = [];
+      var zoomStyleMapping = { 14: 0, 15: 0, 16: 1, 17: 1, 18: 1, 19: 1, 20: 1 }
+      _.each(coord.touristSpots, (x, i) => {
+        var marker = new AMap.ElasticMarker({
+          position: coord.touristSpots[i].position,
+          zooms: [14, 20],
+          styles: [{
+            icon: {
+              img: coord.touristSpots[i].smallIcon,
+              size: [16, 16], // 可见区域的大小
+              anchor: 'bottom-center', // 锚点
+              fitZoom: 14, // 最合适的级别
+              scaleFactor: 2, // 地图放大一级的缩放比例系数
+              maxScale: 2, // 最大放大比例
+              minScale: 1 // 最小放大比例
+            },
+            label: {
+              content: coord.touristSpots[i].name,
+              position: 'BM',
+              minZoom: coord.touristSpots[i].minZoom
+            }
+          }, {
+            icon: {
+              img: coord.touristSpots[i].bigIcon,
+              size: coord.touristSpots[i].size,
+              anchor: coord.touristSpots[i].anchor,
+              fitZoom: 17.5,
+              scaleFactor: 2,
+              maxScale: 2,
+              minScale: 0.125
+            },
+            label: {
+              content: coord.touristSpots[i].name,
+              position: 'BM',
+              minZoom: coord.touristSpots[i].minZoom
+            }
+          }],
+          zoomStyleMapping
+        });
+        if (clickListener) {
+          AMap.Event.removeListener(clickListener); // 移除地图事件，以绑定时返回的对象作为参数
+        }
+        // 绑定景点的点击事件 - 文字出现才能触发
+        var clickListener = AMap.Event.addListener(marker, 'click', function (e) {
+          alert(coord.touristSpots[i].name)
+        });
+        spots.push(marker);
+      })
+      this.map.add(spots);
+    },
+    loadPlant() { // 加载植物图标
+      var zoomStyleMapping = { 14: 0, 15: 0, 16: 0, 17: 0, 18: 0, 19: 0, 20: 0 };
+      var trees = new AMap.ElasticMarker({
+        position: [116.410908, 39.88057],
+        zooms: [15.5, 20],
+        styles: [{
+          icon: {
+            img: 'https://a.amap.com/jsapi_demos/static/resource/img/trees.png',
+            size: [366, 201],
+            anchor: 'center',
+            imageSize: [865, 1156],
+            imageOffset: [-44, -480],
+            fitZoom: 17.5,
+            scaleFactor: 2,
+            maxScale: 2,
+            minScale: 0.125
+          }
+        }],
+        zoomStyleMapping
+      });
+
+      this.map.add(trees);
+    },
+    loadSpotMaker() { // 加载景点标记
+      var zoomStyleMapping = { 14: 0, 15: 0, 16: 0, 17: 0, 18: 0, 19: 0, 20: 0 };
+      _.each(coord.spotInfo, (x, i) => {
+        var marker = new AMap.ElasticMarker({
+          position: coord.spotInfo[i].position,
+          zooms: [17, 19],
+          styles: [{
+            icon: {
+              img: coord.spotInfo[i].icon,
+              size: [16, 16], // 可见区域的大小
+              anchor: 'bottom-center', // 锚点
+              fitZoom: 14, // 最合适的级别
+              scaleFactor: 2, // 地图放大一级的缩放比例系数
+              maxScale: 1.4, // 最大放大比例
+              minScale: 0.8 // 最小放大比例
+            },
+            label: {
+              content: coord.spotInfo[i].name,
+              position: 'TM',
+              minZoom: 18
+            }
+          }],
+          zoomStyleMapping
+        });
+        let infoWindowContent =
+          '<div className="custom-infowindow input-card">' +
+          '<label style="color:grey">公共厕所</label>' +
+          // 为 infowindow 添加自定义事件
+          '<div id="lnglat2container" class="btn">我要走过去</div>' +
+          '</div>';
+        // 创建一个自定义内容的 infowindow 实例
+        let infoWindow = new AMap.InfoWindow({
+          position: coord.spotInfo[i].position,
+          offset: new AMap.Pixel(0, -30),
+          content: infoWindowContent
+        });
+        if (clickListener) {
+          marker.off('click', clickListener)
+        }
+        // 绑定景点的点击事件 - 文字出现才能触发
+        var clickListener = marker.on('click', (e) => {
+          infoWindow.open(this.map);
+        })
+        //
+        this.spotInfo.push(marker);
+      })
+      this.map.add(this.spotInfo);
+    },
+    loadToiletMaker() { // 加载厕所标记
+      var zoomStyleMapping = { 14: 0, 15: 0, 16: 0, 17: 0, 18: 0, 19: 0, 20: 0 };
+      _.each(coord.toiletInfo, (x, i) => {
+        var marker = new AMap.ElasticMarker({
+          position: coord.toiletInfo[i].position,
+          zooms: [17, 19],
+          styles: [{
+            icon: {
+              img: coord.toiletInfo[i].icon,
+              size: [16, 16], // 可见区域的大小
+              anchor: 'bottom-center', // 锚点
+              fitZoom: 14, // 最合适的级别
+              scaleFactor: 2, // 地图放大一级的缩放比例系数
+              maxScale: 1.4, // 最大放大比例
+              minScale: 0.8 // 最小放大比例
+            },
+            label: {
+              content: coord.toiletInfo[i].name,
+              position: 'TM',
+              minZoom: 18
+            }
+          }],
+          zoomStyleMapping
+        });
+        // let infoWindowContent =
+        //   '<div className="custom-infowindow input-card">' +
+        //   '<label style="color:grey">公共厕所</label>' +
+        //   // 为 infowindow 添加自定义事件
+        //   '<div id="lnglat2container" class="btn">我要走过去</div>' +
+        //   '</div>';
+        // // 创建一个自定义内容的 infowindow 实例
+        // let infoWindow = new AMap.InfoWindow({
+        //   position: coord.spotInfo[i].position,
+        //   offset: new AMap.Pixel(0, -30),
+        //   content: infoWindowContent
+        // });
+        if (clickListener) {
+          marker.off('click', clickListener)
+        }
+        // 绑定景点的点击事件 - 文字出现才能触发
+        var clickListener = marker.on('click', (e) => {
+          // infoWindow.open(this.map);
+          this.show_popup = true;
+        })
+        //
+        this.toiletInfo.push(marker);
+
+      })
+      this.map.add(this.toiletInfo);
+    },
+    setMapBoundary() { // 地图描边
+      new AMap.Polygon({
+        cursor: 'pointer',
+        bubble: true,
+        path: [[120.587704, 31.312785], [120.587669, 31.313028], [120.587554, 31.313086], [120.586883, 31.313019], [120.586826, 31.314066], [120.586736, 31.314426], [120.585872, 31.314466], [120.585675, 31.315276], [120.585817, 31.315397], [120.586251, 31.31542], [120.586229, 31.31618], [120.588248, 31.316367], [120.588533, 31.314761], [120.588479, 31.31474], [120.588482, 31.314172], [120.588251, 31.314145], [120.588337, 31.313184], [120.588337, 31.313184], [120.588154, 31.313163], [120.588152, 31.312835]],
+        map: this.map,
+        fillOpacity: 0.5,
+        strokeWeight: 1,
+        fillColor: '#CFE7AA'
+      });
+    },
+    showPublic() {
+      this.map.add(this.facilities);
+    },
+    hidePublic() {
+      this.map.remove(this.facilities);
+    },
+    addLayer() {
+      this.layerMap();
+      // this.layerMap1();
+      // this.layerMap2();
+      this.loadPublicEquipment();
+      this.loadScenicSpot();
+      this.loadPlant();
+      this.setMapBoundary();
+    },
+    removeLayer() {
+      this.initMap();
+      this.loadPublicEquipment();
+      this.loadScenicSpot();
+      this.loadPlant();
+      this.setMapBoundary();
+    },
+    setLocation() { // 开启定位服务
+      // this.map.addControl(this.geolocation); // 添加定位图标 自动跳转当前位置
+      // 使用纠正偏移后的地址，打一个定位标记
+      var marker = new AMap.Marker({
+        position: new AMap.LngLat(this.current_lng, this.current_lat),   // 经纬度对象，也可以是经纬度构成的一维数组[116.39, 39.9]
+      });
+      this.map.add(marker);
+      // 定位到地图中心-西园寺
+      this.map.setCenter([120.587334, 31.314823]);
+      // 判断是否在范围内
+      let isPointInRing = AMap.GeometryUtil.isPointInRing([this.current_lng, this.current_lat], [
+        [120.585111, 31.316084], [120.585111, 31.316084], [120.589488, 31.313197], [120.585422, 31.313005]
+      ]);
+      if (!isPointInRing) {
+        this.dialog_show = true;
+      }
+    },
+    getLocation() {
+      AMap.plugin(['AMap.Geolocation'], () => {
+        this.geolocation = new AMap.Geolocation(this.location_options);
+        this.geolocation.getCurrentPosition((status, result) => {
+          if (status === 'complete') {
+            let lat = result.position.lat;
+            let lng = result.position.lng;
+            // 行动路线
+            if (lng && lat) {
+              this.current_lng = GPS.gcj_encrypt(lat, lng).lon;
+              this.current_lat = GPS.gcj_encrypt(lat, lng).lat;
+              // 西园寺的经纬度
+              this.xys_lng = GPS.gcj_encrypt(31.315021, 120.58848).lon;
+              this.xys_lat = GPS.gcj_encrypt(31.315021, 120.58848).lat;
+            }
+          }
+        })
+      });
+    },
+    setRoute() { // 生成路径
+      // 行动路线
+      var path = [
+        [116.413384, 39.874071],
+        [116.413141, 39.877934],
+        [116.411469, 39.878175],
+        [this.current_lng, this.current_lat]
+      ];
+
+      this.current_route = new AMap.Polyline({
+        path: path,
+        isOutline: true,
+        outlineColor: 'red',
+        borderWeight: 1,
+        strokeColor: '#FFF',
+        strokeOpacity: 1,
+        strokeWeight: 1,
+        // 折线样式还支持 'dashed'
+        strokeStyle: 'solid',
+        // strokeStyle是dashed时有效
+        strokeDasharray: [10, 5],
+        lineJoin: 'round',
+        lineCap: 'round',
+        zIndex: 50
+      })
+    },
+    addLocation() { // 新增路径
+      this.setRoute();
+      this.map.add([this.current_route]);
+    },
+    removeLocation() { // 删除路径
+      this.map.remove([this.current_route]);
+    },
+    setTitleLayer() {
+      //该demo可模拟水印效果
+      var layer = new AMap.TileLayer.Flexible({
+        cacheSize: 30,
+        opacity: 1,
+        zIndex: 2,
+        createTile: function (x, y, z, success, fail) {
+          // if ((x + y) % 3) {
+          //   fail();
+          //   return;
+          // }
+
+          var img = document.createElement('img');
+          img.onload = function () {
+            success(img)
+          };
+          img.crossOrigin = "anonymous";// 必须添加，同时图片要有跨域头
+          img.onerror = function () {
+            fail()
+          };
+
+          // img.src = `fileHost + '/tilefile/' + zoom + '/${x} + '_' + ${y} + '.png`;
+          img.src = `images/tiles/${z}/${x}_${y}.jpg`
+        }
+      });
+
+      this.map.addLayer(layer);
+
+      // Canvas作为切片
+      var layer = new AMap.TileLayer.Flexible({
+        // tileSize: 128,
+        cacheSize: 300,
+        zIndex: 200,
+        createTile: function (x, y, z, success, fail) {
+          var c = document.createElement('canvas');
+          c.width = c.height = 256;
+
+          var cxt = c.getContext("2d");
+          cxt.font = "15px Verdana";
+          cxt.fillStyle = "#ff0000";
+          cxt.strokeStyle = "#FF0000";
+          cxt.strokeRect(0, 0, 256, 256);
+          cxt.fillText('(' + [x, y, z].join(',') + ')', 10, 30);
+
+          // 通知API切片创建完成
+          success(c);
+        }
+      });
+
+      layer.setMap(this.map);
+
+      // 只显示相应区域，移动会回到选定范围
+      this.lockMapBounds()
+
+    },
+    setSpotLayer() { // 设置景点图层
+      this.removeToiletLayer()
+      // 加载地图标记
+      this.loadSpotMaker()
+    },
+    setToiletLayer() { // 设置景点图层
+      this.removeSpotLayer()
+      // 加载厕所标记
+      this.loadToiletMaker()
+    },
+    removeSpotLayer() { // 删除景点标记
+      this.map.remove(this.spotInfo);
+    },
+    removeToiletLayer() { // 删除景点标记
+      this.map.remove(this.toiletInfo);
+    },
+    // 限制地图范围
+    lockMapBounds() {
+      // var bounds = this.map.getBounds();
+      var myBounds = new AMap.Bounds(
+        [120.585138, 31.312908],
+        [120.588839, 31.316492]
+      );
+
+      this.map.setLimitBounds(myBounds);
+    },
+    showInfoClick(e) {
+      console.log(e);
+      var zoom = this.map.getZoom(); //获取当前地图级别
+      var text =
+        "您在 [ " +
+        e.lnglat.getLng() +
+        "," +
+        e.lnglat.getLat() +
+        " ] 的位置单击了地图！当前层级" +
+        zoom;
+      console.warn(text);
+    },
+    setWalkRoute() {
+      //步行导航
+      let walking_CallBack = (result) => {
+        if (result.type === 'complete') {
+          console.warn(result);
+          console.warn('绘制步行路线完成');
+        } else {
+          console.error('步行路线数据查询失败' + result);
+        }
+      }
+       AMap.plugin(["AMap.Walking"], () => { //加载步行导航插件
+        this.walk_route = new AMap.Walking ({
+          map: this.map,
+        }); //构造步行导航类
+        AMap.Event.addListener(this.walk_route, "complete", walking_CallBack); //返回导航查询结果
+        //根据起、终点坐标规划步行路线
+        this.walk_route.search(new AMap.LngLat(120.587799, 31.313276), new AMap.LngLat(120.587912, 31.315169));
+      });
+    },
+    removeWalkRoute () {
+      this.walk_route.clear()
+    }
+  }
+}
+</script>
+
+<style lang="less">
+#container {
+  position: absolute;
+  top: 0;
+  left: 0;
+  right: 0;
+  bottom: 0;
+  width: 100%;
+  height: 100%;
+}
+
+/* 标记文字样式 */
+.amap-marker-label {
+  /* width: 60px; */
+  font-size: 0.85rem;
+  line-height: 18px;
+  text-align: center;
+  height: 18px;
+  font-family: STLiti;
+  color: #000;
+  border: 0;
+  /* border-radius: 15px; */
+  background-color: rgba(255, 255, 255, 0.4);
+  /* border: solid 2px rgba(100, 255, 200, 0.8); */
+}
+
+.input-card {
+  display: flex;
+  flex-direction: column;
+  min-width: 0;
+  word-wrap: break-word;
+  background-color: #fff;
+  background-clip: border-box;
+  border-radius: .25rem;
+  width: 20rem;
+  border-width: 0;
+  border-radius: 0.4rem;
+  box-shadow: 0 2px 6px 0 rgba(114, 124, 245, .5);
+  position: fixed;
+  top: 1rem;
+  right: 1rem;
+  -ms-flex: 1 1 auto;
+  flex: 1 1 auto;
+  padding: 0.75rem 1.25rem;
+}
+</style>

+{
+  "compilerOptions": {
+    /* 基本选项 */
+    "target": "esnext", // 指定 ECMAScript 目标版本: 'ES3' (default), 'ES5', 'ES6'/'ES2015', 'ES2016', 'ES2017', or 'ESNEXT'
+    "module": "CommonJS", // 指定使用模块: 'commonjs', 'amd', 'system', 'umd' or 'es2015'
+    "lib": [ // 指定要包含在编译中的库文件
+      "esnext",
+      "dom",
+      "dom.iterable",
+      "scripthost"
+    ],
+    "allowJs": true, // 允许编译 javascript 文件
+    // "checkJs": true, // 报告 javascript 文件中的错误
+    "jsx": "preserve", // 指定 jsx 代码的生成: 'preserve', 'react-native', or 'react'
+    // "declaration": true, // 生成相应的 '.d.ts' 文件
+    // "sourceMap": true, // 生成相应的 '.map' 文件
+    // "outFile": "./", // 将输出文件合并为一个文件
+    "outDir": "./", // 指定输出目录
+    // "rootDir": "./", // 用来控制输出目录结构 --outDir.
+    "removeComments": true, // 删除编译后的所有的注释
+    // "noEmit": true, // 不生成输出文件
+    "importHelpers": true, // 从 tslib 导入辅助工具函数
+    "isolatedModules": false, // 将每个文件做为单独的模块 （与 'ts.transpileModule' 类似）
+
+    /* 严格的类型检查选项 */
+    "strict": true, // 启用所有严格类型检查选项
+    // "noImplicitAny": true, // 在表达式和声明上有隐含的 any类型时报错
+    // "strictNullChecks": true,  // 启用严格的 null 检查
+    // "noImplicitThis": true, // 当 this 表达式值为 any 类型的时候，生成一个错误
+    // "alwaysStrict": true, // 以严格模式检查每个模块，并在每个文件里加入 'use strict'
+
+    /* 额外的检查 */
+    "noUnusedLocals": true, // 有未使用的变量时，抛出错误
+    "noUnusedParameters": true, // 有未使用的参数时，抛出错误
+    "noImplicitReturns": true, // 并不是所有函数里的代码都有返回值时，抛出错误
+    "noFallthroughCasesInSwitch": true, // 报告 switch 语句的 fallthrough 错误。（即，不允许 switch 的 case 语句贯穿）
+    
+    /* 模块解析选项 */
+    "moduleResolution": "node", // 选择模块解析策略： 'node' (Node.js) or 'classic' (TypeScript pre-1.6)
+    "baseUrl": ".", // 用于解析非相对模块名称的基目录
+    "paths": { // 模块名到基于 baseUrl 的路径映射的列表
+      "@/*": [
+        "src/*"
+      ]
+    },
+    // "rootDirs": [], // 根文件夹列表，其组合内容表示项目运行时的结构内容
+    // "typeRoots": [], // 包含类型声明的文件列表
+    "types": [ // 需要包含的类型声明文件名列表
+      // "webpack-env",
+      "vite/client",
+      "lodash",
+      "moment",
+      "node",
+      "jquery",
+    ],
+    "allowSyntheticDefaultImports": true, // 允许从没有设置默认导出的模块中默认导入。
+
+    /* Source Map Options */
+    // "sourceRoot": "./", // 指定调试器应该找到 TypeScript 文件而不是源文件的位置
+    // "mapRoot": "./", // 指定调试器应该找到映射文件而不是生成文件的位置
+    // "inlineSourceMap": true, // 生成单个 sourcemaps 文件，而不是将 sourcemaps 生成不同的文件
+    // "inlineSources": true, // 将代码与 sourcemaps 生成到一个文件中，要求同时设置了 --inlineSourceMap 或 --sourceMap 属性
+
+    /* 其他选项 */
+    // "experimentalDecorators": true, // 启用装饰器
+    // "emitDecoratorMetadata": true, // 为装饰器提供元数据的支持
+
+    "esModuleInterop": true, // 可以在es6中导入commonjs
+  },
+  "include": [
+    "src/**/*"
+  ],
+  "exclude": [
+    "node_modules",
+    "dist"
+  ],
+  "vueCompilerOptions": {
+    "target": 2,
+    "experimentalSuppressInvalidJsxElementTypeErrors": true
+  }
+}

+{
+  "defaultSeverity": "warning",
+  "extends": [
+    "tslint:recommended"
+  ],
+  "linterOptions": {
+    "exclude": [
+      "node_modules/**"
+    ]
+  },
+  "rules": {
+    "quotemark": [
+      true,
+      "single"
+    ],
+    "indent": [
+      true,
+      "spaces",
+      2
+    ],
+    "interface-name": false,
+    "ordered-imports": false,
+    "object-literal-sort-keys": false,
+    "no-consecutive-blank-lines": false,
+    "no-console": true
+  }
+}

+/*
+ * @Date: 2022-06-13 10:39:44
+ * @LastEditors: hookehuyr hookehuyr@gmail.com
+ * @LastEditTime: 2022-06-13 10:41:43
+ * @FilePath: /tswj/typings/index.d.ts
+ * @Description: 文件描述
+ */
+export {};
+
+// => 全局类型声明
+declare global {
+  interface Window {
+    _hmt: any;
+    wx: any;
+    AlipayJSBridge: any;
+  }
+  namespace GD {
+    interface BaseResponse<T = any> {
+      code: number;
+      data: T;
+      msg: string;
+      page: {
+        pageNo: number;
+        pageSize: number;
+        pages: number;
+        total: number;
+      };
+    }
+  }
+}
+
+// const response = GD.BaseResponse<{name: string}>

+import vue from '@vitejs/plugin-vue';
+import dynamicImport from 'vite-plugin-dynamic-import';
+// import legacy from '@vitejs/plugin-legacy';
+// import styleImport, { VantResolve } from 'vite-plugin-style-import';
+import Components from 'unplugin-vue-components/vite';
+import { VantResolver } from 'unplugin-vue-components/resolvers';
+import { defineConfig, loadEnv } from 'vite';
+import { createProxy } from './build/proxy'
+import DefineOptions from 'unplugin-vue-define-options/vite';
+import AutoImport from 'unplugin-auto-import/vite';
+import postcsspxtoviewport from 'postcss-px-to-viewport'
+
+var path = require('path');
+const fs = require('fs');
+
+export default ({ command, mode }) => {
+  const root = process.cwd();
+
+  const viteEnv = loadEnv(mode, root);
+  // let isProd = (command === 'serve'); // 情景配置是否为开发模式 serve 或 build
+
+  return defineConfig({
+    // root: '',
+    // root: './src/packages', // 多页面应用配置入口根目录
+    base: viteEnv.VITE_BASE, // 开发或生产环境服务的公共基础路径。
+    // base: isProd ? '/' : '/f/voice/', // 开发或生产环境服务的公共基础路径。
+    // mode: '', // 在配置中指明将会把 serve 和 build 时的模式 都 覆盖掉。也可以通过命令行 --mode 选项来重写。
+    // define: '', // 定义全局常量替换方式。其中每项在开发环境下会被定义在全局，而在构建时被静态替换。
+    plugins: [
+      // 将要用到的插件数组。Falsy 虚值的插件将被忽略，插件数组将被扁平化（flatten）。查看 插件 API 获取 Vite 插件的更多细节。
+      vue(),
+      Components({
+        resolvers: [VantResolver()],
+      }),
+      // styleImport({
+      // resolves: [VantResolve()],
+      // libs: [
+      //   {
+      //     libraryName: 'vant',
+      //     esModule: true,
+      //     resolveStyle: name => `../es/${name}/style`
+      //   }
+      // ]
+      // }), // 按需引入 vant 位置报错问题
+      dynamicImport(), // 增强 Vite 内置的 dynamic import, 支持在 import() 中使用别名
+      // legacy({
+      //   targets: ['defaults', 'not IE 11']
+      // }), // Vite 的默认旧版浏览器支持时提供此插件本机ESM的支持。
+      DefineOptions(), // TAG: 插件来对组件名进行注册的, 解决setup没法写name的问题
+      AutoImport({
+        // API 自动导入
+        // 可以自定义文件生成的位置，默认是根目录下，使用ts的建议放src目录下
+        dts: 'src/auto-imports.d.ts',
+        imports: ['vue', 'vue-router'],
+        // 解决eslint报错问题
+        eslintrc: {
+          enabled: true,
+        },
+      }),
+    ],
+    publicDir: 'public', // 作为静态资源服务的文件夹。这个目录中的文件会在开发中被服务于 /，在开发模式时，会被拷贝到 outDir 的根目录，并没有转换，永远只是复制到这里。该值可以是文件系统的绝对路径，也可以是相对于项目的根目录路径。
+    // cacheDir: '', // 存储缓存文件的目录。此目录下会存储预打包的依赖项或 vite 生成的某些缓存文件，使用缓存可以提高性能。如需重新生成缓存文件，你可以使用 --force 命令行选项或手动删除目录。此选项的值可以是文件的绝对路径，也可以是以项目根目录为基准的相对路径。
+    resolve: {
+      alias: {
+        // 将会被传递到 @rollup/plugin-alias 作为 entries 的选项。也可以是一个对象，或一个 { find, replacement } 的数组. 当使用文件系统路径的别名时，请始终使用绝对路径。相对路径的别名值会被原封不动地使用，因此无法被正常解析。 更高级的自定义解析方法可以通过 插件 实现。
+        '@': path.resolve(__dirname, 'src'),
+        '@components': path.resolve(__dirname, 'src/components'),
+        '@composables': path.resolve(__dirname, 'src/composables'),
+        '@utils': path.resolve(__dirname, 'src/utils'),
+        '@images': path.resolve(__dirname, 'src/assets/images'),
+        '@css': path.resolve(__dirname, 'src/assets/css'),
+        '@mock': path.resolve(__dirname, 'src/assets/mock'),
+        common: path.resolve(__dirname, 'src/common'),
+      },
+      // dedupe: [''], // 如果你在你的应用程序中有相同依赖的副本（比如 monorepos），使用这个选项来强制 Vite 总是将列出的依赖关系解析到相同的副本（从项目根目录)。
+      // conditions: [''], // 在解析包的 情景导出 时允许的附加条件。
+      // mainFields: [''], // package.json 中，在解析包的入口点时尝试的字段列表。注意，这比从 exports 字段解析的情景导出优先级低：如果一个入口点从 exports 成功解析，主字段将被忽略。
+      extensions: ['.mjs', '.js', '.ts', '.jsx', '.tsx', '.json', '.vue'], // 导入时想要省略的扩展名列表。注意，不 建议忽略自定义导入类型的扩展名（例如：.vue），因为它会干扰 IDE 和类型支持。
+    },
+    css: {
+      modules: '', // 配置 CSS modules 的行为。选项将被传递给 postcss-modules。
+      postcss: {
+        // 内联的 PostCSS 配置（格式同 postcss.config.js），或者一个（默认基于项目根目录的）自定义的 PostCSS 配置路径。其路径搜索是通过 postcss-load-config 实现的。 注意，如果提供了该内联配置，Vite 将不会搜索其他 PostCSS 配置源。
+        plugins: [
+          postcsspxtoviewport({
+            unitToConvert: 'px', // 要转化的单位
+            viewportWidth: 375, // UI设计稿的宽度
+            unitPrecision: 6, // 转换后的精度，即小数点位数
+            propList: ['*'], // 指定转换的css属性的单位，*代表全部css属性的单位都进行转换
+            viewportUnit: 'vw', // 指定需要转换成的视窗单位，默认vw
+            fontViewportUnit: 'vw', // 指定字体需要转换成的视窗单位，默认vw
+            selectorBlackList: ['ignore-'], // 指定不转换为视窗单位的类名，
+            minPixelValue: 1, // 默认值1，小于或等于1px则不进行转换
+            mediaQuery: true, // 是否在媒体查询的css代码中也进行转换，默认false
+            replace: true, // 是否转换后直接更换属性值
+            // exclude: [/node_modules/], // 设置忽略文件，用正则做目录名匹配
+            exclude: [],
+            landscape: false, // 是否处理横屏情况
+          }),
+        ],
+      },
+      preprocessorOptions: {
+        less: {
+          javascriptEnabled: true,
+          additionalData: `@import "${path.resolve(__dirname, 'src/assets/styles/base.less')}";`,
+        },
+      }, // 指定传递给 CSS 预处理器的选项。
+    },
+    // json: {
+    //   namedExports: true, // 是否支持从 .json 文件中进行按名导入。
+    //   stringify: false, // 若设置为 true，导入的 JSON 会被转换为 export default JSON.parse("...") 会比转译成对象字面量性能更好，尤其是当 JSON 文件较大的时候。 开启此项，则会禁用按名导入。
+    // },
+    // esbuild: false, //
+    // assetsInclude: '', // 指定其他文件类型作为静态资源处理
+    logLevel: 'info', // 调整控制台输出的级别，默认为 'info'。
+    // clearScreen: true, // 设为 false 可以避免 Vite 清屏而错过在终端中打印某些关键信息。命令行模式下请通过 --clearScreen false 设置。
+    server: {
+      host: '0.0.0.0',
+      port: viteEnv.VITE_PORT, // 本地服务端口
+      // strictPort: true, // 设为true时若端口已被占用则会直接退出, 而不是尝试下一个可用端口
+      https: {
+        key: fs.readFileSync(path.resolve(__dirname, 'keys/localhost+2-key.pem')),
+        cert: fs.readFileSync(path.resolve(__dirname, 'keys/localhost+2.pem')),
+      },
+      // open: false, // 在服务器启动时自动在浏览器中打开应用程序. 当此值为字符串时, 会被当作URL的路径名.
+      // proxy: { // 代理
+      //   '/srv/': {
+      //     // target: 'http://voice.onwall.cn',
+      //     target: viteEnv.VITE_PROXY_TARGET,
+      //     changeOrigin: true,
+      //     // rewrite: (path) => path.replace(/^\/api/, '')
+      //   },
+      // },
+      proxy: createProxy(viteEnv.VITE_PROXY_PREFIX, viteEnv.VITE_PROXY_TARGET),
+      // cors: '', // 为开发服务器配置 CORS。默认启用并允许任何源，传递一个 选项对象 来调整行为或设为 false 表示禁用。
+      // force: '', // 设置为 true 强制使依赖预构建。
+      // hmr: '', // 禁用或配置 HMR 连接（用于 HMR websocket 必须使用不同的 http 服务器地址的情况）。 设置 server.hmr.overlay 为 false 可以禁用服务器错误遮罩层。
+      // watch: '', // 传递给 chokidar 的文件系统监视器选项。
+    },
+    build: {
+      // outDir: 'voice', // 指定输出路径(相对于项目根目录).
+      outDir: viteEnv.VITE_OUTDIR, // 指定输出路径(相对于项目根目录).
+      assetsDir: 'static',
+      rollupOptions: {
+        output: {
+          chunkFileNames: 'static/js/[name]-[hash].js',
+          entryFileNames: 'static/js/[name]-[hash].js',
+          assetFileNames: 'static/[ext]/[name]-[hash].[ext]',
+        },
+        input: {
+          // 多页面应用模式, 打包时配置，运行配置要处理root
+          main: path.resolve(__dirname, 'index.html'),
+          // mono1: path.resolve(__dirname, 'src/packages/mono1/index.html'),
+          // mono2: path.resolve(__dirname, 'src/packages/mono2/index.html'),
+        },
+      },
+    },
+    optimizeDeps: {
+      // entries: '',
+      // exclude: [],
+      include: ['jquery', 'lodash', 'moment', 'axios', 'pinia', 'vue-router', 'vant'], // 默认情况下，不在 node_modules 中的，链接的包不会被预构建。使用此选项可强制预构建链接的包。
+      // keepNames: false, // 打包器有时需要重命名符号以避免冲突。 设置此项为 true 可以在函数和类上保留 name 属性。 若想获取更多详情，请参阅 keepNames
+    },
+  });
+};

+Arguments: 
+  /Users/huyirui/.nvm/versions/node/v17.5.0/bin/node /Users/huyirui/.node/corepack/yarn/1.22.15/bin/yarn.js add vite-plugin-style-impor
+
+PATH: 
+  /Users/huyirui/.nvm/versions/node/v17.5.0/bin:/opt/homebrew/bin:/opt/homebrew/sbin:/usr/local/bin:/usr/bin:/bin:/usr/sbin:/sbin:/Library/Apple/usr/bin:/Users/huyirui/.nvm/versions/node/v17.5.0/bin:/opt/homebrew/bin:/opt/homebrew/sbin
+
+Yarn version: 
+  1.22.15
+
+Node version: 
+  17.5.0
+
+Platform: 
+  darwin arm64
+
+Trace: 
+  Error: https://registry.yarnpkg.com/vite-plugin-style-impor: Not found
+      at Request.params.callback [as _callback] (/Users/huyirui/.node/corepack/yarn/1.22.15/lib/cli.js:66140:18)
+      at Request.self.callback (/Users/huyirui/.node/corepack/yarn/1.22.15/lib/cli.js:140885:22)
+      at Request.emit (node:events:526:28)
+      at Request.<anonymous> (/Users/huyirui/.node/corepack/yarn/1.22.15/lib/cli.js:141857:10)
+      at Request.emit (node:events:526:28)
+      at IncomingMessage.<anonymous> (/Users/huyirui/.node/corepack/yarn/1.22.15/lib/cli.js:141779:12)
+      at Object.onceWrapper (node:events:645:28)
+      at IncomingMessage.emit (node:events:538:35)
+      at endReadableNT (node:internal/streams/readable:1342:12)
+      at processTicksAndRejections (node:internal/process/task_queues:83:21)
+
+npm manifest: 
+  {
+    "name": "vite",
+    "version": "0.0.0",
+    "scripts": {
+      "dev": "vite",
+      "build": "vite build"
+    },
+    "dependencies": {
+      "vant": "^4.0.0-alpha.0",
+      "vue": "^3.2.31"
+    },
+    "devDependencies": {
+      "@vitejs/plugin-vue": "^2.2.4",
+      "@vue/compiler-sfc": "^3.2.31",
+      "less": "^4.1.2",
+      "vite": "^2.8.6",
+      "vite-plugin-style-import": "^0.10.0"
+    }
+  }
+
+yarn manifest: 
+  No manifest
+
+Lockfile: 
+  # THIS IS AN AUTOGENERATED FILE. DO NOT EDIT THIS FILE DIRECTLY.
+  # yarn lockfile v1
+  
+  
+  "@babel/parser@^7.16.4":
+    version "7.17.7"
+    resolved "https://registry.yarnpkg.com/@babel/parser/-/parser-7.17.7.tgz#fc19b645a5456c8d6fdb6cecd3c66c0173902800"
+    integrity sha512-bm3AQf45vR4gKggRfvJdYJ0gFLoCbsPxiFLSH6hTVYABptNHY6l9NrhnucVjQ/X+SPtLANT9lc0fFhikj+VBRA==
+  
+  "@popperjs/core@^2.9.2":
+    version "2.11.4"
+    resolved "https://registry.yarnpkg.com/@popperjs/core/-/core-2.11.4.tgz#d8c7b8db9226d2d7664553a0741ad7d0397ee503"
+    integrity sha512-q/ytXxO5NKvyT37pmisQAItCFqA7FD/vNb8dgaJy3/630Fsc+Mz9/9f2SziBoIZ30TJooXyTwZmhi1zjXmObYg==
+  
+  "@rollup/pluginutils@^4.1.0":
+    version "4.2.0"
+    resolved "https://registry.yarnpkg.com/@rollup/pluginutils/-/pluginutils-4.2.0.tgz#a14bbd058fdbba0a5647143b16ed0d86fb60bd08"
+    integrity sha512-2WUyJNRkyH5p487pGnn4tWAsxhEFKN/pT8CMgHshd5H+IXkOnKvKZwsz5ZWz+YCXkleZRAU5kwbfgF8CPfDRqA==
+    dependencies:
+      estree-walker "^2.0.1"
+      picomatch "^2.2.2"
+  
+  "@vant/icons@^1.7.1":
+    version "1.7.3"
+    resolved "https://registry.yarnpkg.com/@vant/icons/-/icons-1.7.3.tgz#e51b46065cfde445617401ebe309a33b62a29725"
+    integrity sha512-tW4EqzxN4kXw1rnlnQJQHofEifPbt/gECOWiibomht8QLyvoGuE4iUmDFS288dJ07ZjuTy0bhdABj0SENo2fmQ==
+  
+  "@vant/popperjs@^1.1.0":
+    version "1.1.0"
+    resolved "https://registry.yarnpkg.com/@vant/popperjs/-/popperjs-1.1.0.tgz#b4edee5bbfa6fb18705986e313d4fd5f17942a0f"
+    integrity sha512-8MD1gz146awV/uPxYjz4pet22f7a9YVKqk7T+gFkWFwT9mEcrIUEg/xPrdOnWKLP9puXyYtm7oVfSDSefZ/p/w==
+    dependencies:
+      "@popperjs/core" "^2.9.2"
+  
+  "@vant/use@^1.3.5":
+    version "1.3.6"
+    resolved "https://registry.yarnpkg.com/@vant/use/-/use-1.3.6.tgz#7618d3a72ad6cd622a8b3cbc693ed1540426a05b"
+    integrity sha512-3z+nywPaV2F5BdJO7RQxWlgfzJeEOmViD2yHMb7Tg+R4NR/7iQskqW8v2Cnv9FWSJgTOSHlcr7UzeLpiTAP4HA==
+  
+  "@vitejs/plugin-vue@^2.2.4":
+    version "2.2.4"
+    resolved "https://registry.yarnpkg.com/@vitejs/plugin-vue/-/plugin-vue-2.2.4.tgz#ab8b199ca82496b05d2654c5f34ffcf9b947243d"
+    integrity sha512-ev9AOlp0ljCaDkFZF3JwC/pD2N4Hh+r5srl5JHM6BKg5+99jiiK0rE/XaRs3pVm1wzyKkjUy/StBSoXX5fFzcw==
+  
+  "@vue/compiler-core@3.2.31":
+    version "3.2.31"
+    resolved "https://registry.yarnpkg.com/@vue/compiler-core/-/compiler-core-3.2.31.tgz#d38f06c2cf845742403b523ab4596a3fda152e89"
+    integrity sha512-aKno00qoA4o+V/kR6i/pE+aP+esng5siNAVQ422TkBNM6qA4veXiZbSe8OTXHXquEi/f6Akc+nLfB4JGfe4/WQ==
+    dependencies:
+      "@babel/parser" "^7.16.4"
+      "@vue/shared" "3.2.31"
+      estree-walker "^2.0.2"
+      source-map "^0.6.1"
+  
+  "@vue/compiler-dom@3.2.31":
+    version "3.2.31"
+    resolved "https://registry.yarnpkg.com/@vue/compiler-dom/-/compiler-dom-3.2.31.tgz#b1b7dfad55c96c8cc2b919cd7eb5fd7e4ddbf00e"
+    integrity sha512-60zIlFfzIDf3u91cqfqy9KhCKIJgPeqxgveH2L+87RcGU/alT6BRrk5JtUso0OibH3O7NXuNOQ0cDc9beT0wrg==
+    dependencies:
+      "@vue/compiler-core" "3.2.31"
+      "@vue/shared" "3.2.31"
+  
+  "@vue/compiler-sfc@3.2.31", "@vue/compiler-sfc@^3.2.31":
+    version "3.2.31"
+    resolved "https://registry.yarnpkg.com/@vue/compiler-sfc/-/compiler-sfc-3.2.31.tgz#d02b29c3fe34d599a52c5ae1c6937b4d69f11c2f"
+    integrity sha512-748adc9msSPGzXgibHiO6T7RWgfnDcVQD+VVwYgSsyyY8Ans64tALHZANrKtOzvkwznV/F4H7OAod/jIlp/dkQ==
+    dependencies:
+      "@babel/parser" "^7.16.4"
+      "@vue/compiler-core" "3.2.31"
+      "@vue/compiler-dom" "3.2.31"
+      "@vue/compiler-ssr" "3.2.31"
+      "@vue/reactivity-transform" "3.2.31"
+      "@vue/shared" "3.2.31"
+      estree-walker "^2.0.2"
+      magic-string "^0.25.7"
+      postcss "^8.1.10"
+      source-map "^0.6.1"
+  
+  "@vue/compiler-ssr@3.2.31":
+    version "3.2.31"
+    resolved "https://registry.yarnpkg.com/@vue/compiler-ssr/-/compiler-ssr-3.2.31.tgz#4fa00f486c9c4580b40a4177871ebbd650ecb99c"
+    integrity sha512-mjN0rqig+A8TVDnsGPYJM5dpbjlXeHUm2oZHZwGyMYiGT/F4fhJf/cXy8QpjnLQK4Y9Et4GWzHn9PS8AHUnSkw==
+    dependencies:
+      "@vue/compiler-dom" "3.2.31"
+      "@vue/shared" "3.2.31"
+  
+  "@vue/reactivity-transform@3.2.31":
+    version "3.2.31"
+    resolved "https://registry.yarnpkg.com/@vue/reactivity-transform/-/reactivity-transform-3.2.31.tgz#0f5b25c24e70edab2b613d5305c465b50fc00911"
+    integrity sha512-uS4l4z/W7wXdI+Va5pgVxBJ345wyGFKvpPYtdSgvfJfX/x2Ymm6ophQlXXB6acqGHtXuBqNyyO3zVp9b1r0MOA==
+    dependencies:
+      "@babel/parser" "^7.16.4"
+      "@vue/compiler-core" "3.2.31"
+      "@vue/shared" "3.2.31"
+      estree-walker "^2.0.2"
+      magic-string "^0.25.7"
+  
+  "@vue/reactivity@3.2.31":
+    version "3.2.31"
+    resolved "https://registry.yarnpkg.com/@vue/reactivity/-/reactivity-3.2.31.tgz#fc90aa2cdf695418b79e534783aca90d63a46bbd"
+    integrity sha512-HVr0l211gbhpEKYr2hYe7hRsV91uIVGFYNHj73njbARVGHQvIojkImKMaZNDdoDZOIkMsBc9a1sMqR+WZwfSCw==
+    dependencies:
+      "@vue/shared" "3.2.31"
+  
+  "@vue/runtime-core@3.2.31":
+    version "3.2.31"
+    resolved "https://registry.yarnpkg.com/@vue/runtime-core/-/runtime-core-3.2.31.tgz#9d284c382f5f981b7a7b5971052a1dc4ef39ac7a"
+    integrity sha512-Kcog5XmSY7VHFEMuk4+Gap8gUssYMZ2+w+cmGI6OpZWYOEIcbE0TPzzPHi+8XTzAgx1w/ZxDFcXhZeXN5eKWsA==
+    dependencies:
+      "@vue/reactivity" "3.2.31"
+      "@vue/shared" "3.2.31"
+  
+  "@vue/runtime-dom@3.2.31":
+    version "3.2.31"
+    resolved "https://registry.yarnpkg.com/@vue/runtime-dom/-/runtime-dom-3.2.31.tgz#79ce01817cb3caf2c9d923f669b738d2d7953eff"
+    integrity sha512-N+o0sICVLScUjfLG7u9u5XCjvmsexAiPt17GNnaWHJUfsKed5e85/A3SWgKxzlxx2SW/Hw7RQxzxbXez9PtY3g==
+    dependencies:
+      "@vue/runtime-core" "3.2.31"
+      "@vue/shared" "3.2.31"
+      csstype "^2.6.8"
+  
+  "@vue/server-renderer@3.2.31":
+    version "3.2.31"
+    resolved "https://registry.yarnpkg.com/@vue/server-renderer/-/server-renderer-3.2.31.tgz#201e9d6ce735847d5989403af81ef80960da7141"
+    integrity sha512-8CN3Zj2HyR2LQQBHZ61HexF5NReqngLT3oahyiVRfSSvak+oAvVmu8iNLSu6XR77Ili2AOpnAt1y8ywjjqtmkg==
+    dependencies:
+      "@vue/compiler-ssr" "3.2.31"
+      "@vue/shared" "3.2.31"
+  
+  "@vue/shared@3.2.31":
+    version "3.2.31"
+    resolved "https://registry.yarnpkg.com/@vue/shared/-/shared-3.2.31.tgz#c90de7126d833dcd3a4c7534d534be2fb41faa4e"
+    integrity sha512-ymN2pj6zEjiKJZbrf98UM2pfDd6F2H7ksKw7NDt/ZZ1fh5Ei39X5tABugtT03ZRlWd9imccoK0hE8hpjpU7irQ==
+  
+  camel-case@^4.1.2:
+    version "4.1.2"
+    resolved "https://registry.yarnpkg.com/camel-case/-/camel-case-4.1.2.tgz#9728072a954f805228225a6deea6b38461e1bd5a"
+    integrity sha512-gxGWBrTT1JuMx6R+o5PTXMmUnhnVzLQ9SNutD4YqKtI6ap897t3tKECYla6gCWEkplXnlNybEkZg9GEGxKFCgw==
+    dependencies:
+      pascal-case "^3.1.2"
+      tslib "^2.0.3"
+  
+  capital-case@^1.0.4:
+    version "1.0.4"
+    resolved "https://registry.yarnpkg.com/capital-case/-/capital-case-1.0.4.tgz#9d130292353c9249f6b00fa5852bee38a717e669"
+    integrity sha512-ds37W8CytHgwnhGGTi88pcPyR15qoNkOpYwmMMfnWqqWgESapLqvDx6huFjQ5vqWSn2Z06173XNA7LtMOeUh1A==
+    dependencies:
+      no-case "^3.0.4"
+      tslib "^2.0.3"
+      upper-case-first "^2.0.2"
+  
+  change-case@^4.1.2:
+    version "4.1.2"
+    resolved "https://registry.yarnpkg.com/change-case/-/change-case-4.1.2.tgz#fedfc5f136045e2398c0410ee441f95704641e12"
+    integrity sha512-bSxY2ws9OtviILG1EiY5K7NNxkqg/JnRnFxLtKQ96JaviiIxi7djMrSd0ECT9AC+lttClmYwKw53BWpOMblo7A==
+    dependencies:
+      camel-case "^4.1.2"
+      capital-case "^1.0.4"
+      constant-case "^3.0.4"
+      dot-case "^3.0.4"
+      header-case "^2.0.4"
+      no-case "^3.0.4"
+      param-case "^3.0.4"
+      pascal-case "^3.1.2"
+      path-case "^3.0.4"
+      sentence-case "^3.0.4"
+      snake-case "^3.0.4"
+      tslib "^2.0.3"
+  
+  constant-case@^3.0.4:
+    version "3.0.4"
+    resolved "https://registry.yarnpkg.com/constant-case/-/constant-case-3.0.4.tgz#3b84a9aeaf4cf31ec45e6bf5de91bdfb0589faf1"
+    integrity sha512-I2hSBi7Vvs7BEuJDr5dDHfzb/Ruj3FyvFyh7KLilAjNQw3Be+xgqUBA2W6scVEcL0hL1dwPRtIqEPVUCKkSsyQ==
+    dependencies:
+      no-case "^3.0.4"
+      tslib "^2.0.3"
+      upper-case "^2.0.2"
+  
+  copy-anything@^2.0.1:
+    version "2.0.6"
+    resolved "https://registry.yarnpkg.com/copy-anything/-/copy-anything-2.0.6.tgz#092454ea9584a7b7ad5573062b2a87f5900fc480"
+    integrity sha512-1j20GZTsvKNkc4BY3NpMOM8tt///wY3FpIzozTOFO2ffuZcV61nojHXVKIy3WM+7ADCy5FVhdZYHYDdgTU0yJw==
+    dependencies:
+      is-what "^3.14.1"
+  
+  csstype@^2.6.8:
+    version "2.6.20"
+    resolved "https://registry.yarnpkg.com/csstype/-/csstype-2.6.20.tgz#9229c65ea0b260cf4d3d997cb06288e36a8d6dda"
+    integrity sha512-/WwNkdXfckNgw6S5R125rrW8ez139lBHWouiBvX8dfMFtcn6V81REDqnH7+CRpRipfYlyU1CmOnOxrmGcFOjeA==
+  
+  debug@^3.2.6:
+    version "3.2.7"
+    resolved "https://registry.yarnpkg.com/debug/-/debug-3.2.7.tgz#72580b7e9145fb39b6676f9c5e5fb100b934179a"
+    integrity sha512-CFjzYYAi4ThfiQvizrFQevTTXHtnCqWfe7x1AhgEscTz6ZbLbfoLRLPugTQyBth6f8ZERVUSyWHFD/7Wu4t1XQ==
+    dependencies:
+      ms "^2.1.1"
+  
+  debug@^4.3.2:
+    version "4.3.3"
+    resolved "https://registry.yarnpkg.com/debug/-/debug-4.3.3.tgz#04266e0b70a98d4462e6e288e38259213332b664"
+    integrity sha512-/zxw5+vh1Tfv+4Qn7a5nsbcJKPaSvCDhojn6FEl9vupwK2VCSDtEiEtqr8DFtzYFOdz63LBkxec7DYuc2jon6Q==
+    dependencies:
+      ms "2.1.2"
+  
+  dot-case@^3.0.4:
+    version "3.0.4"
+    resolved "https://registry.yarnpkg.com/dot-case/-/dot-case-3.0.4.tgz#9b2b670d00a431667a8a75ba29cd1b98809ce751"
+    integrity sha512-Kv5nKlh6yRrdrGvxeJ2e5y2eRUpkUosIW4A2AS38zwSz27zu7ufDwQPi5Jhs3XAlGNetl3bmnGhQsMtkKJnj3w==
+    dependencies:
+      no-case "^3.0.4"
+      tslib "^2.0.3"
+  
+  errno@^0.1.1:
+    version "0.1.8"
+    resolved "https://registry.yarnpkg.com/errno/-/errno-0.1.8.tgz#8bb3e9c7d463be4976ff888f76b4809ebc2e811f"
+    integrity sha512-dJ6oBr5SQ1VSd9qkk7ByRgb/1SH4JZjCHSW/mr63/QcXO9zLVxvJ6Oy13nio03rxpSnVDDjFor75SjVeZWPW/A==
+    dependencies:
+      prr "~1.0.1"
+  
+  es-module-lexer@^0.4.1:
+    version "0.4.1"
+    resolved "https://registry.yarnpkg.com/es-module-lexer/-/es-module-lexer-0.4.1.tgz#dda8c6a14d8f340a24e34331e0fab0cb50438e0e"
+    integrity sha512-ooYciCUtfw6/d2w56UVeqHPcoCFAiJdz5XOkYpv/Txl1HMUozpXjz/2RIQgqwKdXNDPSF1W7mJCFse3G+HDyAA==
+  
+  esbuild-android-64@0.14.27:
+    version "0.14.27"
+    resolved "https://registry.yarnpkg.com/esbuild-android-64/-/esbuild-android-64-0.14.27.tgz#b868bbd9955a92309c69df628d8dd1945478b45c"
+    integrity sha512-LuEd4uPuj/16Y8j6kqy3Z2E9vNY9logfq8Tq+oTE2PZVuNs3M1kj5Qd4O95ee66yDGb3isaOCV7sOLDwtMfGaQ==
+  
+  esbuild-android-arm64@0.14.27:
+    version "0.14.27"
+    resolved "https://registry.yarnpkg.com/esbuild-android-arm64/-/esbuild-android-arm64-0.14.27.tgz#e7d6430555e8e9c505fd87266bbc709f25f1825c"
+    integrity sha512-E8Ktwwa6vX8q7QeJmg8yepBYXaee50OdQS3BFtEHKrzbV45H4foMOeEE7uqdjGQZFBap5VAqo7pvjlyA92wznQ==
+  
+  esbuild-darwin-64@0.14.27:
+    version "0.14.27"
+    resolved "https://registry.yarnpkg.com/esbuild-darwin-64/-/esbuild-darwin-64-0.14.27.tgz#4dc7484127564e89b4445c0a560a3cb50b3d68e1"
+    integrity sha512-czw/kXl/1ZdenPWfw9jDc5iuIYxqUxgQ/Q+hRd4/3udyGGVI31r29LCViN2bAJgGvQkqyLGVcG03PJPEXQ5i2g==
+  
+  esbuild-darwin-arm64@0.14.27:
+    version "0.14.27"
+    resolved "https://registry.yarnpkg.com/esbuild-darwin-arm64/-/esbuild-darwin-arm64-0.14.27.tgz#469e59c665f84a8ed323166624c5e7b9b2d22ac1"
+    integrity sha512-BEsv2U2U4o672oV8+xpXNxN9bgqRCtddQC6WBh4YhXKDcSZcdNh7+6nS+DM2vu7qWIWNA4JbRG24LUUYXysimQ==
+  
+  esbuild-freebsd-64@0.14.27:
+    version "0.14.27"
+    resolved "https://registry.yarnpkg.com/esbuild-freebsd-64/-/esbuild-freebsd-64-0.14.27.tgz#895df03bf5f87094a56c9a5815bf92e591903d70"
+    integrity sha512-7FeiFPGBo+ga+kOkDxtPmdPZdayrSzsV9pmfHxcyLKxu+3oTcajeZlOO1y9HW+t5aFZPiv7czOHM4KNd0tNwCA==
+  
+  esbuild-freebsd-arm64@0.14.27:
+    version "0.14.27"
+    resolved "https://registry.yarnpkg.com/esbuild-freebsd-arm64/-/esbuild-freebsd-arm64-0.14.27.tgz#0b72a41a6b8655e9a8c5608f2ec1afdcf6958441"
+    integrity sha512-8CK3++foRZJluOWXpllG5zwAVlxtv36NpHfsbWS7TYlD8S+QruXltKlXToc/5ZNzBK++l6rvRKELu/puCLc7jA==
+  
+  esbuild-linux-32@0.14.27:
+    version "0.14.27"
+    resolved "https://registry.yarnpkg.com/esbuild-linux-32/-/esbuild-linux-32-0.14.27.tgz#43b8ba3803b0bbe7f051869c6a8bf6de1e95de28"
+    integrity sha512-qhNYIcT+EsYSBClZ5QhLzFzV5iVsP1YsITqblSaztr3+ZJUI+GoK8aXHyzKd7/CKKuK93cxEMJPpfi1dfsOfdw==
+  
+  esbuild-linux-64@0.14.27:
+    version "0.14.27"
+    resolved "https://registry.yarnpkg.com/esbuild-linux-64/-/esbuild-linux-64-0.14.27.tgz#dc8072097327ecfadba1735562824ce8c05dd0bd"
+    integrity sha512-ESjck9+EsHoTaKWlFKJpPZRN26uiav5gkI16RuI8WBxUdLrrAlYuYSndxxKgEn1csd968BX/8yQZATYf/9+/qg==
+  
+  esbuild-linux-arm64@0.14.27:
+    version "0.14.27"
+    resolved "https://registry.yarnpkg.com/esbuild-linux-arm64/-/esbuild-linux-arm64-0.14.27.tgz#c52b58cbe948426b1559910f521b0a3f396f10b8"
+    integrity sha512-no6Mi17eV2tHlJnqBHRLekpZ2/VYx+NfGxKcBE/2xOMYwctsanCaXxw4zapvNrGE9X38vefVXLz6YCF8b1EHiQ==
+  
+  esbuild-linux-arm@0.14.27:
+    version "0.14.27"
+    resolved "https://registry.yarnpkg.com/esbuild-linux-arm/-/esbuild-linux-arm-0.14.27.tgz#df869dbd67d4ee3a04b3c7273b6bd2b233e78a18"
+    integrity sha512-JnnmgUBdqLQO9hoNZQqNHFWlNpSX82vzB3rYuCJMhtkuaWQEmQz6Lec1UIxJdC38ifEghNTBsF9bbe8dFilnCw==
+  
+  esbuild-linux-mips64le@0.14.27:
+    version "0.14.27"
+    resolved "https://registry.yarnpkg.com/esbuild-linux-mips64le/-/esbuild-linux-mips64le-0.14.27.tgz#a2b646d9df368b01aa970a7b8968be6dd6b01d19"
+    integrity sha512-NolWP2uOvIJpbwpsDbwfeExZOY1bZNlWE/kVfkzLMsSgqeVcl5YMen/cedRe9mKnpfLli+i0uSp7N+fkKNU27A==
+  
+  esbuild-linux-ppc64le@0.14.27:
+    version "0.14.27"
+    resolved "https://registry.yarnpkg.com/esbuild-linux-ppc64le/-/esbuild-linux-ppc64le-0.14.27.tgz#9a21af766a0292578a3009c7408b8509cac7cefd"
+    integrity sha512-/7dTjDvXMdRKmsSxKXeWyonuGgblnYDn0MI1xDC7J1VQXny8k1qgNp6VmrlsawwnsymSUUiThhkJsI+rx0taNA==
+  
+  esbuild-linux-riscv64@0.14.27:
+    version "0.14.27"
+    resolved "https://registry.yarnpkg.com/esbuild-linux-riscv64/-/esbuild-linux-riscv64-0.14.27.tgz#344a27f91568056a5903ad5841b447e00e78d740"
+    integrity sha512-D+aFiUzOJG13RhrSmZgrcFaF4UUHpqj7XSKrIiCXIj1dkIkFqdrmqMSOtSs78dOtObWiOrFCDDzB24UyeEiNGg==
+  
+  esbuild-linux-s390x@0.14.27:
+    version "0.14.27"
+    resolved "https://registry.yarnpkg.com/esbuild-linux-s390x/-/esbuild-linux-s390x-0.14.27.tgz#73a7309bd648a07ef58f069658f989a5096130db"
+    integrity sha512-CD/D4tj0U4UQjELkdNlZhQ8nDHU5rBn6NGp47Hiz0Y7/akAY5i0oGadhEIg0WCY/HYVXFb3CsSPPwaKcTOW3bg==
+  
+  esbuild-netbsd-64@0.14.27:
+    version "0.14.27"
+    resolved "https://registry.yarnpkg.com/esbuild-netbsd-64/-/esbuild-netbsd-64-0.14.27.tgz#482a587cdbd18a6c264a05136596927deb46c30a"
+    integrity sha512-h3mAld69SrO1VoaMpYl3a5FNdGRE/Nqc+E8VtHOag4tyBwhCQXxtvDDOAKOUQexBGca0IuR6UayQ4ntSX5ij1Q==
+  
+  esbuild-openbsd-64@0.14.27:
+    version "0.14.27"
+    resolved "https://registry.yarnpkg.com/esbuild-openbsd-64/-/esbuild-openbsd-64-0.14.27.tgz#e99f8cdc63f1628747b63edd124d53cf7796468d"
+    integrity sha512-xwSje6qIZaDHXWoPpIgvL+7fC6WeubHHv18tusLYMwL+Z6bEa4Pbfs5IWDtQdHkArtfxEkIZz77944z8MgDxGw==
+  
+  esbuild-sunos-64@0.14.27:
+    version "0.14.27"
+    resolved "https://registry.yarnpkg.com/esbuild-sunos-64/-/esbuild-sunos-64-0.14.27.tgz#8611d825bcb8239c78d57452e83253a71942f45c"
+    integrity sha512-/nBVpWIDjYiyMhuqIqbXXsxBc58cBVH9uztAOIfWShStxq9BNBik92oPQPJ57nzWXRNKQUEFWr4Q98utDWz7jg==
+  
+  esbuild-windows-32@0.14.27:
+    version "0.14.27"
+    resolved "https://registry.yarnpkg.com/esbuild-windows-32/-/esbuild-windows-32-0.14.27.tgz#c06374206d4d92dd31d4fda299b09f51a35e82f6"
+    integrity sha512-Q9/zEjhZJ4trtWhFWIZvS/7RUzzi8rvkoaS9oiizkHTTKd8UxFwn/Mm2OywsAfYymgUYm8+y2b+BKTNEFxUekw==
+  
+  esbuild-windows-64@0.14.27:
+    version "0.14.27"
+    resolved "https://registry.yarnpkg.com/esbuild-windows-64/-/esbuild-windows-64-0.14.27.tgz#756631c1d301dfc0d1a887deed2459ce4079582f"
+    integrity sha512-b3y3vTSl5aEhWHK66ngtiS/c6byLf6y/ZBvODH1YkBM+MGtVL6jN38FdHUsZasCz9gFwYs/lJMVY9u7GL6wfYg==
+  
+  esbuild-windows-arm64@0.14.27:
+    version "0.14.27"
+    resolved "https://registry.yarnpkg.com/esbuild-windows-arm64/-/esbuild-windows-arm64-0.14.27.tgz#ad7e187193dcd18768b16065a950f4441d7173f4"
+    integrity sha512-I/reTxr6TFMcR5qbIkwRGvldMIaiBu2+MP0LlD7sOlNXrfqIl9uNjsuxFPGEG4IRomjfQ5q8WT+xlF/ySVkqKg==
+  
+  esbuild@^0.14.14:
+    version "0.14.27"
+    resolved "https://registry.yarnpkg.com/esbuild/-/esbuild-0.14.27.tgz#41fe0f1b6b68b9f77cac025009bc54bb96e616f1"
+    integrity sha512-MZQt5SywZS3hA9fXnMhR22dv0oPGh6QtjJRIYbgL1AeqAoQZE+Qn5ppGYQAoHv/vq827flj4tIJ79Mrdiwk46Q==
+    optionalDependencies:
+      esbuild-android-64 "0.14.27"
+      esbuild-android-arm64 "0.14.27"
+      esbuild-darwin-64 "0.14.27"
+      esbuild-darwin-arm64 "0.14.27"
+      esbuild-freebsd-64 "0.14.27"
+      esbuild-freebsd-arm64 "0.14.27"
+      esbuild-linux-32 "0.14.27"
+      esbuild-linux-64 "0.14.27"
+      esbuild-linux-arm "0.14.27"
+      esbuild-linux-arm64 "0.14.27"
+      esbuild-linux-mips64le "0.14.27"
+      esbuild-linux-ppc64le "0.14.27"
+      esbuild-linux-riscv64 "0.14.27"
+      esbuild-linux-s390x "0.14.27"
+      esbuild-netbsd-64 "0.14.27"
+      esbuild-openbsd-64 "0.14.27"
+      esbuild-sunos-64 "0.14.27"
+      esbuild-windows-32 "0.14.27"
+      esbuild-windows-64 "0.14.27"
+      esbuild-windows-arm64 "0.14.27"
+  
+  estree-walker@^2.0.1, estree-walker@^2.0.2:
+    version "2.0.2"
+    resolved "https://registry.yarnpkg.com/estree-walker/-/estree-walker-2.0.2.tgz#52f010178c2a4c117a7757cfe942adb7d2da4cac"
+    integrity sha512-Rfkk/Mp/DL7JVje3u18FxFujQlTNR2q6QfMSMB7AvCBx91NGj/ba3kCfza0f6dVDbw7YlRf/nDrn7pQrCCyQ/w==
+  
+  fsevents@~2.3.2:
+    version "2.3.2"
+    resolved "https://registry.yarnpkg.com/fsevents/-/fsevents-2.3.2.tgz#8a526f78b8fdf4623b709e0b975c52c24c02fd1a"
+    integrity sha512-xiqMQR4xAeHTuB9uWm+fFRcIOgKBMiOBP+eXiyT7jsgVCq1bkVygt00oASowB7EdtpOHaaPgKt812P9ab+DDKA==
+  
+  function-bind@^1.1.1:
+    version "1.1.1"
+    resolved "https://registry.yarnpkg.com/function-bind/-/function-bind-1.1.1.tgz#a56899d3ea3c9bab874bb9773b7c5ede92f4895d"
+    integrity sha512-yIovAzMX49sF8Yl58fSCWJ5svSLuaibPxXQJFLmBObTuCr0Mf1KiPopGM9NiFjiYBCbfaa2Fh6breQ6ANVTI0A==
+  
+  graceful-fs@^4.1.2:
+    version "4.2.9"
+    resolved "https://registry.yarnpkg.com/graceful-fs/-/graceful-fs-4.2.9.tgz#041b05df45755e587a24942279b9d113146e1c96"
+    integrity sha512-NtNxqUcXgpW2iMrfqSfR73Glt39K+BLwWsPs94yR63v45T0Wbej7eRmL5cWfwEgqXnmjQp3zaJTshdRW/qC2ZQ==
+  
+  has@^1.0.3:
+    version "1.0.3"
+    resolved "https://registry.yarnpkg.com/has/-/has-1.0.3.tgz#722d7cbfc1f6aa8241f16dd814e011e1f41e8796"
+    integrity sha512-f2dvO0VU6Oej7RkWJGrehjbzMAjFp5/VKPp5tTpWIV4JHHZK1/BxbFRtf/siA2SWTe09caDmVtYYzWEIbBS4zw==
+    dependencies:
+      function-bind "^1.1.1"
+  
+  header-case@^2.0.4:
+    version "2.0.4"
+    resolved "https://registry.yarnpkg.com/header-case/-/header-case-2.0.4.tgz#5a42e63b55177349cf405beb8d775acabb92c063"
+    integrity sha512-H/vuk5TEEVZwrR0lp2zed9OCo1uAILMlx0JEMgC26rzyJJ3N1v6XkwHHXJQdR2doSjcGPM6OKPYoJgf0plJ11Q==
+    dependencies:
+      capital-case "^1.0.4"
+      tslib "^2.0.3"
+  
+  iconv-lite@^0.4.4:
+    version "0.4.24"
+    resolved "https://registry.yarnpkg.com/iconv-lite/-/iconv-lite-0.4.24.tgz#2022b4b25fbddc21d2f524974a474aafe733908b"
+    integrity sha512-v3MXnZAcvnywkTUEZomIActle7RXXeedOR31wwl7VlyoXO4Qi9arvSenNQWne1TcRwhCL1HwLI21bEqdpj8/rA==
+    dependencies:
+      safer-buffer ">= 2.1.2 < 3"
+  
+  image-size@~0.5.0:
+    version "0.5.5"
+    resolved "https://registry.yarnpkg.com/image-size/-/image-size-0.5.5.tgz#09dfd4ab9d20e29eb1c3e80b8990378df9e3cb9c"
+    integrity sha1-Cd/Uq50g4p6xw+gLiZA3jfnjy5w=
+  
+  is-core-module@^2.8.1:
+    version "2.8.1"
+    resolved "https://registry.yarnpkg.com/is-core-module/-/is-core-module-2.8.1.tgz#f59fdfca701d5879d0a6b100a40aa1560ce27211"
+    integrity sha512-SdNCUs284hr40hFTFP6l0IfZ/RSrMXF3qgoRHd3/79unUTvrFO/JoXwkGm+5J/Oe3E/b5GsnG330uUNgRpu1PA==
+    dependencies:
+      has "^1.0.3"
+  
+  is-what@^3.14.1:
+    version "3.14.1"
+    resolved "https://registry.yarnpkg.com/is-what/-/is-what-3.14.1.tgz#e1222f46ddda85dead0fd1c9df131760e77755c1"
+    integrity sha512-sNxgpk9793nzSs7bA6JQJGeIuRBQhAaNGG77kzYQgMkrID+lS6SlK07K5LaptscDlSaIgH+GPFzf+d75FVxozA==
+  
+  less@^4.1.2:
+    version "4.1.2"
+    resolved "https://registry.yarnpkg.com/less/-/less-4.1.2.tgz#6099ee584999750c2624b65f80145f8674e4b4b0"
+    integrity sha512-EoQp/Et7OSOVu0aJknJOtlXZsnr8XE8KwuzTHOLeVSEx8pVWUICc8Q0VYRHgzyjX78nMEyC/oztWFbgyhtNfDA==
+    dependencies:
+      copy-anything "^2.0.1"
+      parse-node-version "^1.0.1"
+      tslib "^2.3.0"
+    optionalDependencies:
+      errno "^0.1.1"
+      graceful-fs "^4.1.2"
+      image-size "~0.5.0"
+      make-dir "^2.1.0"
+      mime "^1.4.1"
+      needle "^2.5.2"
+      source-map "~0.6.0"
+  
+  lower-case@^2.0.2:
+    version "2.0.2"
+    resolved "https://registry.yarnpkg.com/lower-case/-/lower-case-2.0.2.tgz#6fa237c63dbdc4a82ca0fd882e4722dc5e634e28"
+    integrity sha512-7fm3l3NAF9WfN6W3JOmf5drwpVqX78JtoGJ3A6W0a6ZnldM41w2fV5D490psKFTpMds8TJse/eHLFFsNHHjHgg==
+    dependencies:
+      tslib "^2.0.3"
+  
+  magic-string@^0.25.7:
+    version "0.25.9"
+    resolved "https://registry.yarnpkg.com/magic-string/-/magic-string-0.25.9.tgz#de7f9faf91ef8a1c91d02c2e5314c8277dbcdd1c"
+    integrity sha512-RmF0AsMzgt25qzqqLc1+MbHmhdx0ojF2Fvs4XnOqz2ZOBXzzkEwc/dJQZCYHAn7v1jbVOjAZfK8msRn4BxO4VQ==
+    dependencies:
+      sourcemap-codec "^1.4.8"
+  
+  make-dir@^2.1.0:
+    version "2.1.0"
+    resolved "https://registry.yarnpkg.com/make-dir/-/make-dir-2.1.0.tgz#5f0310e18b8be898cc07009295a30ae41e91e6f5"
+    integrity sha512-LS9X+dc8KLxXCb8dni79fLIIUA5VyZoyjSMCwTluaXA0o27cCK0bhXkpgw+sTXVpPy/lSO57ilRixqk0vDmtRA==
+    dependencies:
+      pify "^4.0.1"
+      semver "^5.6.0"
+  
+  mime@^1.4.1:
+    version "1.6.0"
+    resolved "https://registry.yarnpkg.com/mime/-/mime-1.6.0.tgz#32cd9e5c64553bd58d19a568af452acff04981b1"
+    integrity sha512-x0Vn8spI+wuJ1O6S7gnbaQg8Pxh4NNHb7KSINmEWKiPE4RKOplvijn+NkmYmmRgP68mc70j2EbeTFRsrswaQeg==
+  
+  ms@2.1.2:
+    version "2.1.2"
+    resolved "https://registry.yarnpkg.com/ms/-/ms-2.1.2.tgz#d09d1f357b443f493382a8eb3ccd183872ae6009"
+    integrity sha512-sGkPx+VjMtmA6MX27oA4FBFELFCZZ4S4XqeGOXCv68tT+jb3vk/RyaKWP0PTKyWtmLSM0b+adUTEvbs1PEaH2w==
+  
+  ms@^2.1.1:
+    version "2.1.3"
+    resolved "https://registry.yarnpkg.com/ms/-/ms-2.1.3.tgz#574c8138ce1d2b5861f0b44579dbadd60c6615b2"
+    integrity sha512-6FlzubTLZG3J2a/NVCAleEhjzq5oxgHyaCU9yYXvcLsvoVaHJq/s5xXI6/XXP6tz7R9xAOtHnSO/tXtF3WRTlA==
+  
+  nanoid@^3.3.1:
+    version "3.3.1"
+    resolved "https://registry.yarnpkg.com/nanoid/-/nanoid-3.3.1.tgz#6347a18cac88af88f58af0b3594b723d5e99bb35"
+    integrity sha512-n6Vs/3KGyxPQd6uO0eH4Bv0ojGSUvuLlIHtC3Y0kEO23YRge8H9x1GCzLn28YX0H66pMkxuaeESFq4tKISKwdw==
+  
+  needle@^2.5.2:
+    version "2.9.1"
+    resolved "https://registry.yarnpkg.com/needle/-/needle-2.9.1.tgz#22d1dffbe3490c2b83e301f7709b6736cd8f2684"
+    integrity sha512-6R9fqJ5Zcmf+uYaFgdIHmLwNldn5HbK8L5ybn7Uz+ylX/rnOsSp1AHcvQSrCaFN+qNM1wpymHqD7mVasEOlHGQ==
+    dependencies:
+      debug "^3.2.6"
+      iconv-lite "^0.4.4"
+      sax "^1.2.4"
+  
+  no-case@^3.0.4:
+    version "3.0.4"
+    resolved "https://registry.yarnpkg.com/no-case/-/no-case-3.0.4.tgz#d361fd5c9800f558551a8369fc0dcd4662b6124d"
+    integrity sha512-fgAN3jGAh+RoxUGZHTSOLJIqUc2wmoBwGR4tbpNAKmmovFoWq0OdRkb0VkldReO2a2iBT/OEulG9XSUc10r3zg==
+    dependencies:
+      lower-case "^2.0.2"
+      tslib "^2.0.3"
+  
+  param-case@^3.0.4:
+    version "3.0.4"
+    resolved "https://registry.yarnpkg.com/param-case/-/param-case-3.0.4.tgz#7d17fe4aa12bde34d4a77d91acfb6219caad01c5"
+    integrity sha512-RXlj7zCYokReqWpOPH9oYivUzLYZ5vAPIfEmCTNViosC78F8F0H9y7T7gG2M39ymgutxF5gcFEsyZQSph9Bp3A==
+    dependencies:
+      dot-case "^3.0.4"
+      tslib "^2.0.3"
+  
+  parse-node-version@^1.0.1:
+    version "1.0.1"
+    resolved "https://registry.yarnpkg.com/parse-node-version/-/parse-node-version-1.0.1.tgz#e2b5dbede00e7fa9bc363607f53327e8b073189b"
+    integrity sha512-3YHlOa/JgH6Mnpr05jP9eDG254US9ek25LyIxZlDItp2iJtwyaXQb57lBYLdT3MowkUFYEV2XXNAYIPlESvJlA==
+  
+  pascal-case@^3.1.2:
+    version "3.1.2"
+    resolved "https://registry.yarnpkg.com/pascal-case/-/pascal-case-3.1.2.tgz#b48e0ef2b98e205e7c1dae747d0b1508237660eb"
+    integrity sha512-uWlGT3YSnK9x3BQJaOdcZwrnV6hPpd8jFH1/ucpiLRPh/2zCVJKS19E4GvYHvaCcACn3foXZ0cLB9Wrx1KGe5g==
+    dependencies:
+      no-case "^3.0.4"
+      tslib "^2.0.3"
+  
+  path-case@^3.0.4:
+    version "3.0.4"
+    resolved "https://registry.yarnpkg.com/path-case/-/path-case-3.0.4.tgz#9168645334eb942658375c56f80b4c0cb5f82c6f"
+    integrity sha512-qO4qCFjXqVTrcbPt/hQfhTQ+VhFsqNKOPtytgNKkKxSoEp3XPUQ8ObFuePylOIok5gjn69ry8XiULxCwot3Wfg==
+    dependencies:
+      dot-case "^3.0.4"
+      tslib "^2.0.3"
+  
+  path-parse@^1.0.7:
+    version "1.0.7"
+    resolved "https://registry.yarnpkg.com/path-parse/-/path-parse-1.0.7.tgz#fbc114b60ca42b30d9daf5858e4bd68bbedb6735"
+    integrity sha512-LDJzPVEEEPR+y48z93A0Ed0yXb8pAByGWo/k5YYdYgpY2/2EsOsksJrq7lOHxryrVOn1ejG6oAp8ahvOIQD8sw==
+  
+  picocolors@^1.0.0:
+    version "1.0.0"
+    resolved "https://registry.yarnpkg.com/picocolors/-/picocolors-1.0.0.tgz#cb5bdc74ff3f51892236eaf79d68bc44564ab81c"
+    integrity sha512-1fygroTLlHu66zi26VoTDv8yRgm0Fccecssto+MhsZ0D/DGW2sm8E8AjW7NU5VVTRt5GxbeZ5qBuJr+HyLYkjQ==
+  
+  picomatch@^2.2.2:
+    version "2.3.1"
+    resolved "https://registry.yarnpkg.com/picomatch/-/picomatch-2.3.1.tgz#3ba3833733646d9d3e4995946c1365a67fb07a42"
+    integrity sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==
+  
+  pify@^4.0.1:
+    version "4.0.1"
+    resolved "https://registry.yarnpkg.com/pify/-/pify-4.0.1.tgz#4b2cd25c50d598735c50292224fd8c6df41e3231"
+    integrity sha512-uB80kBFb/tfd68bVleG9T5GGsGPjJrLAUpR5PZIrhBnIaRTQRjqdJSsIKkOP6OAIFbj7GOrcudc5pNjZ+geV2g==
+  
+  postcss@^8.1.10, postcss@^8.4.6:
+    version "8.4.11"
+    resolved "https://registry.yarnpkg.com/postcss/-/postcss-8.4.11.tgz#a06229f23820b4ddd46500a3e38dbca1598a8e8d"
+    integrity sha512-D+jFLnT0ilGfy4CVBGbC+XE68HkVpT8+CUkDrcSpgxmo4RKco2uaZ4kIoyVGEm+m8KN/+Vwgs8MtpNbQ3/ma9w==
+    dependencies:
+      nanoid "^3.3.1"
+      picocolors "^1.0.0"
+      source-map-js "^1.0.2"
+  
+  prr@~1.0.1:
+    version "1.0.1"
+    resolved "https://registry.yarnpkg.com/prr/-/prr-1.0.1.tgz#d3fc114ba06995a45ec6893f484ceb1d78f5f476"
+    integrity sha1-0/wRS6BplaRexok/SEzrHXj19HY=
+  
+  resolve@^1.22.0:
+    version "1.22.0"
+    resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.22.0.tgz#5e0b8c67c15df57a89bdbabe603a002f21731198"
+    integrity sha512-Hhtrw0nLeSrFQ7phPp4OOcVjLPIeMnRlr5mcnVuMe7M/7eBn98A3hmFRLoFo3DLZkivSYwhRUJTyPyWAk56WLw==
+    dependencies:
+      is-core-module "^2.8.1"
+      path-parse "^1.0.7"
+      supports-preserve-symlinks-flag "^1.0.0"
+  
+  rollup@^2.59.0:
+    version "2.70.1"
+    resolved "https://registry.yarnpkg.com/rollup/-/rollup-2.70.1.tgz#824b1f1f879ea396db30b0fc3ae8d2fead93523e"
+    integrity sha512-CRYsI5EuzLbXdxC6RnYhOuRdtz4bhejPMSWjsFLfVM/7w/85n2szZv6yExqUXsBdz5KT8eoubeyDUDjhLHEslA==
+    optionalDependencies:
+      fsevents "~2.3.2"
+  
+  "safer-buffer@>= 2.1.2 < 3":
+    version "2.1.2"
+    resolved "https://registry.yarnpkg.com/safer-buffer/-/safer-buffer-2.1.2.tgz#44fa161b0187b9549dd84bb91802f9bd8385cd6a"
+    integrity sha512-YZo3K82SD7Riyi0E1EQPojLz7kpepnSQI9IyPbHHg1XXXevb5dJI7tpyN2ADxGcQbHG7vcyRHk0cbwqcQriUtg==
+  
+  sax@^1.2.4:
+    version "1.2.4"
+    resolved "https://registry.yarnpkg.com/sax/-/sax-1.2.4.tgz#2816234e2378bddc4e5354fab5caa895df7100d9"
+    integrity sha512-NqVDv9TpANUjFm0N8uM5GxL36UgKi9/atZw+x7YFnQ8ckwFGKrl4xX4yWtrey3UJm5nP1kUbnYgLopqWNSRhWw==
+  
+  semver@^5.6.0:
+    version "5.7.1"
+    resolved "https://registry.yarnpkg.com/semver/-/semver-5.7.1.tgz#a954f931aeba508d307bbf069eff0c01c96116f7"
+    integrity sha512-sauaDf/PZdVgrLTNYHRtpXa1iRiKcaebiKQ1BJdpQlWH2lCvexQdX55snPFyK7QzpudqbCI0qXFfOasHdyNDGQ==
+  
+  sentence-case@^3.0.4:
+    version "3.0.4"
+    resolved "https://registry.yarnpkg.com/sentence-case/-/sentence-case-3.0.4.tgz#3645a7b8c117c787fde8702056225bb62a45131f"
+    integrity sha512-8LS0JInaQMCRoQ7YUytAo/xUu5W2XnQxV2HI/6uM6U7CITS1RqPElr30V6uIqyMKM9lJGRVFy5/4CuzcixNYSg==
+    dependencies:
+      no-case "^3.0.4"
+      tslib "^2.0.3"
+      upper-case-first "^2.0.2"
+  
+  snake-case@^3.0.4:
+    version "3.0.4"
+    resolved "https://registry.yarnpkg.com/snake-case/-/snake-case-3.0.4.tgz#4f2bbd568e9935abdfd593f34c691dadb49c452c"
+    integrity sha512-LAOh4z89bGQvl9pFfNF8V146i7o7/CqFPbqzYgP+yYzDIDeS9HaNFtXABamRW+AQzEVODcvE79ljJ+8a9YSdMg==
+    dependencies:
+      dot-case "^3.0.4"
+      tslib "^2.0.3"
+  
+  source-map-js@^1.0.2:
+    version "1.0.2"
+    resolved "https://registry.yarnpkg.com/source-map-js/-/source-map-js-1.0.2.tgz#adbc361d9c62df380125e7f161f71c826f1e490c"
+    integrity sha512-R0XvVJ9WusLiqTCEiGCmICCMplcCkIwwR11mOSD9CR5u+IXYdiseeEuXCVAjS54zqwkLcPNnmU4OeJ6tUrWhDw==
+  
+  source-map@^0.6.1, source-map@~0.6.0:
+    version "0.6.1"
+    resolved "https://registry.yarnpkg.com/source-map/-/source-map-0.6.1.tgz#74722af32e9614e9c287a8d0bbde48b5e2f1a263"
+    integrity sha512-UjgapumWlbMhkBgzT7Ykc5YXUT46F0iKu8SGXq0bcwP5dz/h0Plj6enJqjz1Zbq2l5WaqYnrVbwWOWMyF3F47g==
+  
+  sourcemap-codec@^1.4.8:
+    version "1.4.8"
+    resolved "https://registry.yarnpkg.com/sourcemap-codec/-/sourcemap-codec-1.4.8.tgz#ea804bd94857402e6992d05a38ef1ae35a9ab4c4"
+    integrity sha512-9NykojV5Uih4lgo5So5dtw+f0JgJX30KCNI8gwhz2J9A15wD0Ml6tjHKwf6fTSa6fAdVBdZeNOs9eJ71qCk8vA==
+  
+  supports-preserve-symlinks-flag@^1.0.0:
+    version "1.0.0"
+    resolved "https://registry.yarnpkg.com/supports-preserve-symlinks-flag/-/supports-preserve-symlinks-flag-1.0.0.tgz#6eda4bd344a3c94aea376d4cc31bc77311039e09"
+    integrity sha512-ot0WnXS9fgdkgIcePe6RHNk1WA8+muPa6cSjeR3V8K27q9BB1rTE3R1p7Hv0z1ZyAc8s6Vvv8DIyWf681MAt0w==
+  
+  tslib@^2.0.3, tslib@^2.3.0:
+    version "2.3.1"
+    resolved "https://registry.yarnpkg.com/tslib/-/tslib-2.3.1.tgz#e8a335add5ceae51aa261d32a490158ef042ef01"
+    integrity sha512-77EbyPPpMz+FRFRuAFlWMtmgUWGe9UOG2Z25NqCwiIjRhOf5iKGuzSe5P2w1laq+FkRy4p+PCuVkJSGkzTEKVw==
+  
+  upper-case-first@^2.0.2:
+    version "2.0.2"
+    resolved "https://registry.yarnpkg.com/upper-case-first/-/upper-case-first-2.0.2.tgz#992c3273f882abd19d1e02894cc147117f844324"
+    integrity sha512-514ppYHBaKwfJRK/pNC6c/OxfGa0obSnAl106u97Ed0I625Nin96KAjttZF6ZL3e1XLtphxnqrOi9iWgm+u+bg==
+    dependencies:
+      tslib "^2.0.3"
+  
+  upper-case@^2.0.2:
+    version "2.0.2"
+    resolved "https://registry.yarnpkg.com/upper-case/-/upper-case-2.0.2.tgz#d89810823faab1df1549b7d97a76f8662bae6f7a"
+    integrity sha512-KgdgDGJt2TpuwBUIjgG6lzw2GWFRCW9Qkfkiv0DxqHHLYJHmtmdUIKcZd8rHgFSjopVTlw6ggzCm1b8MFQwikg==
+    dependencies:
+      tslib "^2.0.3"
+  
+  vant@^4.0.0-alpha.0:
+    version "4.0.0-alpha.0"
+    resolved "https://registry.yarnpkg.com/vant/-/vant-4.0.0-alpha.0.tgz#137ad1e7d1765f0545ab9041ccdda42e199578a4"
+    integrity sha512-D1J0YZBZmVx8Ft2phhJ4x88sxPGylsyMmJJvWT5GDyusC5kU1ik8qe77Dwtp3fiaZSxs8Fb5Hv4LQmjeqxtMLQ==
+    dependencies:
+      "@vant/icons" "^1.7.1"
+      "@vant/popperjs" "^1.1.0"
+      "@vant/use" "^1.3.5"
+  
+  vite-plugin-style-import@^0.10.0:
+    version "0.10.1"
+    resolved "https://registry.yarnpkg.com/vite-plugin-style-import/-/vite-plugin-style-import-0.10.1.tgz#8732d2c04c92b7e13a7afddcb8e4a34f289fc17c"
+    integrity sha512-3P7Jyf5+b1p26t6mOd6yn8ATNPTDGDRkE19aHicFpo3K7Of7ouJabiPfWE4QaicO6grtCfWGQ0SGMAPqxUSdRA==
+    dependencies:
+      "@rollup/pluginutils" "^4.1.0"
+      change-case "^4.1.2"
+      debug "^4.3.2"
+      es-module-lexer "^0.4.1"
+      magic-string "^0.25.7"
+  
+  vite@^2.8.6:
+    version "2.8.6"
+    resolved "https://registry.yarnpkg.com/vite/-/vite-2.8.6.tgz#32d50e23c99ca31b26b8ccdc78b1d72d4d7323d3"
+    integrity sha512-e4H0QpludOVKkmOsRyqQ7LTcMUDF3mcgyNU4lmi0B5JUbe0ZxeBBl8VoZ8Y6Rfn9eFKYtdXNPcYK97ZwH+K2ug==
+    dependencies:
+      esbuild "^0.14.14"
+      postcss "^8.4.6"
+      resolve "^1.22.0"
+      rollup "^2.59.0"
+    optionalDependencies:
+      fsevents "~2.3.2"
+  
+  vue@^3.2.31:
+    version "3.2.31"
+    resolved "https://registry.yarnpkg.com/vue/-/vue-3.2.31.tgz#e0c49924335e9f188352816788a4cca10f817ce6"
+    integrity sha512-odT3W2tcffTiQCy57nOT93INw1auq5lYLLYtWpPYQQYQOOdHiqFct9Xhna6GJ+pJQaF67yZABraH47oywkJgFw==
+    dependencies:
+      "@vue/compiler-dom" "3.2.31"
+      "@vue/compiler-sfc" "3.2.31"
+      "@vue/runtime-dom" "3.2.31"
+      "@vue/server-renderer" "3.2.31"
+      "@vue/shared" "3.2.31"