提交 8a14069e 编写于 作者: V Vben

refactor: refactor dashboard

上级 b9b470f4
......@@ -2,7 +2,7 @@ module.exports = {
'*.{js,jsx,ts,tsx}': ['eslint --fix', 'prettier --write'],
'{!(package)*.json,*.code-snippets,.!(browserslist)*rc}': ['prettier --write--parser json'],
'package.json': ['prettier --write'],
'*.vue': ['prettier --write', 'stylelint --fix'],
'*.vue': ['eslint --fix', 'prettier --write', 'stylelint --fix'],
'*.{scss,less,styl,css,html}': ['stylelint --fix', 'prettier --write'],
'*.md': ['prettier --write'],
};
......@@ -9,6 +9,7 @@
- 移除 useFullScreen 函数
- tinymce 由 Cdn 改为 npm(打包体积偏大)
- Dashboard 重构
### 🐛 Bug Fixes
......
......@@ -2,7 +2,7 @@ import { resolve } from 'path';
import type { Alias } from 'vite';
function pathResolve(dir: string) {
return resolve(__dirname, '.', dir);
return resolve(process.cwd(), '.', dir);
}
export function createAlias(alias: [string, string][]): Alias[] {
......
......@@ -12,7 +12,7 @@ import { GLOB_CONFIG_FILE_NAME } from '../../constant';
export function configHtmlPlugin(env: ViteEnv, isBuild: boolean) {
const { VITE_GLOB_APP_TITLE, VITE_PUBLIC_PATH } = env;
const path = VITE_PUBLIC_PATH.endsWith('/') ? VITE_PUBLIC_PATH : `${VITE_PUBLIC_PATH}/`;
const path = VITE_PUBLIC_PATH?.endsWith('/') ? VITE_PUBLIC_PATH : `${VITE_PUBLIC_PATH}/`;
const getAppConfigSrc = () => {
return `${path || '/'}${GLOB_CONFIG_FILE_NAME}?v=${pkg.version}-${new Date().getTime()}`;
......
......@@ -8,8 +8,8 @@
},
"scripts": {
"bootstrap": "yarn install",
"serve": "npx --max_old_space_size=4096 vite",
"dev": "npx --max_old_space_size=4096 vite",
"serve": "cross-env --max_old_space_size=4096 vite",
"dev": "cross-env --max_old_space_size=4096 vite",
"build": "vite build && esno ./build/script/postBuild.ts",
"build:no-cache": "yarn clean:cache && npm run build",
"report": "cross-env REPORT=true npm run build ",
......@@ -32,7 +32,7 @@
},
"dependencies": {
"@iconify/iconify": "^2.0.0-rc.6",
"@vueuse/core": "^4.6.2",
"@vueuse/core": "^4.6.3",
"@zxcvbn-ts/core": "^0.3.0",
"ant-design-vue": "^2.1.2",
"apexcharts": "^3.26.0",
......@@ -49,7 +49,7 @@
"sortablejs": "^1.13.0",
"tinymce": "^5.7.1",
"vditor": "^3.8.4",
"vue": "3.0.7",
"vue": "3.0.10",
"vue-i18n": "^9.0.0",
"vue-router": "^4.0.5",
"vue-types": "^3.0.2",
......@@ -60,7 +60,7 @@
"devDependencies": {
"@commitlint/cli": "^12.0.1",
"@commitlint/config-conventional": "^12.0.1",
"@iconify/json": "^1.1.322",
"@iconify/json": "^1.1.323",
"@purge-icons/generated": "^0.7.0",
"@types/crypto-js": "^4.0.1",
"@types/fs-extra": "^9.0.9",
......@@ -72,21 +72,20 @@
"@types/qs": "^6.9.6",
"@types/rollup-plugin-visualizer": "^2.6.0",
"@types/sortablejs": "^1.10.6",
"@typescript-eslint/eslint-plugin": "^4.19.0",
"@typescript-eslint/parser": "^4.19.0",
"@typescript-eslint/eslint-plugin": "^4.20.0",
"@typescript-eslint/parser": "^4.20.0",
"@vitejs/plugin-legacy": "^1.3.2",
"@vitejs/plugin-vue": "^1.2.0",
"@vitejs/plugin-vue": "^1.2.1",
"@vitejs/plugin-vue-jsx": "^1.1.2",
"@vue/compiler-sfc": "3.0.7",
"@vue/compiler-sfc": "3.0.10",
"autoprefixer": "^10.2.5",
"body-parser": "^1.19.0",
"commitizen": "^4.2.3",
"conventional-changelog-cli": "^2.1.1",
"cross-env": "^7.0.3",
"dotenv": "^8.2.0",
"eslint": "^7.23.0",
"eslint-config-prettier": "^8.1.0",
"eslint-define-config": "^1.0.5",
"eslint-define-config": "^1.0.6",
"eslint-plugin-prettier": "^3.3.1",
"eslint-plugin-vue": "^7.8.0",
"esno": "^0.5.0",
......@@ -97,7 +96,7 @@
"is-ci": "^3.0.0",
"less": "^4.1.1",
"lint-staged": "^10.5.4",
"postcss": "^8.2.8",
"postcss": "^8.2.9",
"prettier": "^2.2.1",
"pretty-quick": "^3.1.0",
"rimraf": "^3.0.2",
......@@ -108,17 +107,17 @@
"stylelint-order": "^4.1.0",
"ts-node": "^9.1.1",
"typescript": "4.2.3",
"vite": "2.1.3",
"vite": "2.1.5",
"vite-plugin-compression": "^0.2.3",
"vite-plugin-html": "^2.0.3",
"vite-plugin-imagemin": "^0.2.9",
"vite-plugin-mock": "^2.4.0",
"vite-plugin-mock": "^2.4.1",
"vite-plugin-purge-icons": "^0.7.0",
"vite-plugin-pwa": "^0.6.4",
"vite-plugin-style-import": "^0.9.1",
"vite-plugin-svg-icons": "^0.4.0",
"vite-plugin-theme": "^0.5.0",
"vite-plugin-windicss": "0.11.0",
"vite-plugin-windicss": "0.10.4",
"vue-eslint-parser": "^7.6.0"
},
"resolutions": {
......
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 356.99 419.8"><defs><style>.cls-1{fill:#ffa546;}.cls-2{fill:#ff6059;opacity:0.4;}.cls-3{fill:#426572;}.cls-4{fill:#ffd947;}</style></defs><title>Asset 91</title><g id="Layer_2" data-name="Layer 2"><g id="Layer_1-2" data-name="Layer 1"><path class="cls-1" d="M351,380.73v17.59a15.52,15.52,0,0,1-15.47,15.48H21.46A15.52,15.52,0,0,1,6,398.32V380.73a15.51,15.51,0,0,1,15.47-15.47H335.52A15.51,15.51,0,0,1,351,380.73Z"/><path class="cls-2" d="M351,406.85c0,3.95-7,7.19-15.47,7.19H21.46C13,414,6,410.8,6,406.85V380.73a15.51,15.51,0,0,1,15.47-15.47H37.66l3.44,25.27c0,4,7,7.2,15.47,7.2l283.72,12.44,7.38-2.28Z"/><path class="cls-3" d="M335.52,419.8H21.46A21.5,21.5,0,0,1,0,398.32V380.73a21.49,21.49,0,0,1,21.46-21.47H335.52A21.49,21.49,0,0,1,357,380.73v17.59a21.52,21.52,0,0,1-21.46,21.48ZM21.46,371.26A9.48,9.48,0,0,0,12,380.73v17.59a9.48,9.48,0,0,0,9.46,9.48H335.52a9.52,9.52,0,0,0,9.46-9.48V380.73a9.48,9.48,0,0,0-9.46-9.47Z"/><path class="cls-1" d="M247.93,138H233.23V41.7A35.7,35.7,0,0,0,197.53,6H159.45a35.7,35.7,0,0,0-35.7,35.7V138H109.06C80,138,61.84,169.48,76.37,194.64l34.72,60.13,30,52c16.6,28.76,58.12,28.76,74.72,0l30-52,34.72-60.13C295.14,169.48,277,138,247.93,138Z"/><path class="cls-2" d="M280.62,188l-34.73,60.13-30,52c-11.24,19.46-66.68,32.78-52.52,18.88,60.22-59.12,104.3-182.16,104.3-182.16A37.74,37.74,0,0,1,280.62,188Z"/><path class="cls-4" d="M192.3,6c-.22.23-.42.47-.63.72-38.92,45-18.36,116.49-42.85,170.71-10.14,22.45-29.18,41.51-52.15,49.48L78,194.64C63.52,169.48,81.67,138,110.72,138h14.7V41.7A35.7,35.7,0,0,1,161.12,6Z"/><path class="cls-3" d="M178.49,334.39h0a48.64,48.64,0,0,1-42.56-24.57L71.17,197.64A43.75,43.75,0,0,1,109.06,132h8.69V41.7A41.74,41.74,0,0,1,159.45,0h38.09a41.75,41.75,0,0,1,41.7,41.7V132h8.69a43.75,43.75,0,0,1,37.89,65.62L221,309.82A48.64,48.64,0,0,1,178.49,334.39ZM109.06,144a31.75,31.75,0,0,0-27.49,47.62l64.76,112.17a37.14,37.14,0,0,0,64.33,0l64.76-112.17A31.75,31.75,0,0,0,247.92,144H227.23V41.7A29.73,29.73,0,0,0,197.53,12H159.45a29.73,29.73,0,0,0-29.7,29.7V144Z"/></g></g></svg>
\ No newline at end of file
此差异已折叠。
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 379.47 510.81"><defs><style>.cls-1{fill:#dfe7ea;}.cls-2{fill:#ceea57;}.cls-3{fill:#213346;}.cls-4{fill:#95bc4a;}.cls-5{fill:#bfe1ee;}.cls-11,.cls-6{fill:#fff;}.cls-7{fill:#f5a2c6;}.cls-8{fill:#d676a3;}.cls-9{fill:#f9637c;}.cls-10{fill:#cc3656;}.cls-11{opacity:0.5;}.cls-12{fill:#f6aecd;}.cls-13{fill:#86b9f8;}.cls-14{fill:#7662fa;}</style></defs><title>Asset 16</title><g id="Layer_2" data-name="Layer 2"><g id="Layer_1-2" data-name="Layer 1"><ellipse class="cls-1" cx="191.74" cy="457.95" rx="179.73" ry="52.86"/><circle class="cls-2" cx="334.64" cy="271.05" r="40.33"/><path class="cls-3" d="M334.64,314.49a44.83,44.83,0,1,1,44.83-44.83A44.88,44.88,0,0,1,334.64,314.49Zm0-80.66a35.83,35.83,0,1,0,35.83,35.83A35.87,35.87,0,0,0,334.64,233.83Z"/><path class="cls-3" d="M356.42,273.33a3,3,0,0,1-2.93-2.41c-3.92-19.6-23.82-16.39-24.67-16.24a3,3,0,0,1-1.05-5.91c9.15-1.63,27.53.65,31.6,21a3,3,0,0,1-2.35,3.53A3.05,3.05,0,0,1,356.42,273.33Z"/><circle class="cls-2" cx="44.83" cy="269.05" r="40.33"/><path class="cls-4" d="M76.23,244.43a40.32,40.32,0,0,0-55.79,55.79,40.33,40.33,0,1,1,55.79-55.79Z"/><path class="cls-3" d="M44.83,312.49a44.83,44.83,0,1,1,44.83-44.83A44.88,44.88,0,0,1,44.83,312.49Zm0-80.66a35.83,35.83,0,1,0,35.83,35.83A35.87,35.87,0,0,0,44.83,231.83Z"/><path class="cls-2" d="M188.76,62h2.72A142.34,142.34,0,0,1,333.82,204.34v92.6a143.7,143.7,0,0,1-143.7,143.7h0a143.7,143.7,0,0,1-143.7-143.7v-92.6A142.34,142.34,0,0,1,188.76,62Z"/><path class="cls-4" d="M208.37,437.76a143.43,143.43,0,0,1-19.77,1.37c-79,0-143.71-64.66-143.71-143.71V200.94c0-77.25,63.22-140.46,140.47-140.46h6.48a136.88,136.88,0,0,1,16.53,1C138.82,69.71,84.43,129.29,84.43,200.94v94.48C84.43,367.76,138.58,428.06,208.37,437.76Z"/><path class="cls-3" d="M188.6,445.15A148.62,148.62,0,0,1,40.39,296.94v-92.6A147.26,147.26,0,0,1,187.24,57.5H190A147.26,147.26,0,0,1,336.8,204.34v92.6A148.62,148.62,0,0,1,188.6,445.15ZM187.24,66.5A138.26,138.26,0,0,0,49.39,204.34v92.6a139,139,0,0,0,237.52,98.31,138.2,138.2,0,0,0,40.89-98.31v-92.6A138.24,138.24,0,0,0,190,66.5Z"/><path class="cls-5" d="M319.19,272.92v.18C318.65,273.12,318.86,273,319.19,272.92Z"/><path class="cls-3" d="M20.84,273.92a2.31,2.31,0,0,1-.37,0,3,3,0,0,1-2.61-3.34c1.7-13.89,7.61-20.76,12.26-24.07a20.44,20.44,0,0,1,10.38-4,3,3,0,0,1,.23,6c-.63,0-14.25,1.06-16.92,22.76A3,3,0,0,1,20.84,273.92Z"/><path class="cls-3" d="M190.57,306.5a3,3,0,0,1-3-3V256.91a3,3,0,1,1,6,0V303.5A3,3,0,0,1,190.57,306.5Z"/><path class="cls-6" d="M40.94,365.6c.72-3.5,2.66-5.94,4-5.52s1.67,3.31,1,6.55-2.1,5.77-3.51,5.62S40.22,369.1,40.94,365.6Z"/><path class="cls-6" d="M42.16,403.44a49.43,49.43,0,0,1-1.78-14.27c.14-3.7.8-5.95,1.48-6,1.47,0,2.43,8.7,5.23,18.9s6.3,18.17,5,18.93c-.59.34-2.31-1.26-4.31-4.37A48.78,48.78,0,0,1,42.16,403.44Z"/><path class="cls-7" d="M137.75,2.51a33.77,33.77,0,0,0-24.37,10.94,34,34,0,0,0-41.26,46,34,34,0,1,0,38.79,54.36,34,34,0,0,0,54.73-27.46c0-.39,0-.78-.06-1.17a34,34,0,1,0,7.68-66.91,34.46,34.46,0,0,0-5.87.62A33.92,33.92,0,0,0,137.75,2.51Z"/><path class="cls-8" d="M89.32,49.48a33.74,33.74,0,0,0,2.8,12.94,34,34,0,0,0,6.82,64,34.92,34.92,0,0,1-6.91.82A34,34,0,0,1,77.12,62.42a34,34,0,0,1,30.57-47.49,34.27,34.27,0,0,1,8.1.82A34,34,0,0,0,89.32,49.48Z"/><path class="cls-3" d="M86.42,130.69A38.47,38.47,0,0,1,66.54,59.3,38.47,38.47,0,0,1,102.61,9.43a38.62,38.62,0,0,1,9.42,1A38,38,0,0,1,137.67,0h0a38.68,38.68,0,0,1,31.88,16c1.2-.14,2.42-.22,3.63-.24a38.47,38.47,0,0,1,28.34,65.18,38.17,38.17,0,0,1-27,11.75,40.18,40.18,0,0,1-4.53-.19,38.46,38.46,0,0,1-58.66,29.07,38.09,38.09,0,0,1-24.22,9.13ZM103.29,18.42h-.53a29.45,29.45,0,0,0-28.94,30,29,29,0,0,0,2.43,11.22l1.75,4L74,65.5a29.47,29.47,0,1,0,33.65,47.16l2.8-2.92,3.2,2.48A29.45,29.45,0,0,0,161.14,88.4c0-.29,0-.58,0-.87l-.53-6.29,6.12,1.55a29.47,29.47,0,1,0,6.65-58.05,28.71,28.71,0,0,0-5.08.54l-3.08.6-1.63-2.68A29.59,29.59,0,0,0,137.83,9h0a29.21,29.21,0,0,0-21.14,9.5l-1.93,2.09L112,19.75A29.32,29.32,0,0,0,103.29,18.42ZM137.75,4.51h0Z"/><polygon class="cls-3" points="225.1 107.59 226.73 112.26 221.44 110.12 233.38 107.94 235.94 107.48 236.58 109.21 243.09 126.94 231.9 111.73 235.06 112.98 224.2 118.39 221.46 119.76 218.98 116.27 215.87 111.89 194.8 82.23 205.66 66.03 225.1 107.59"/><polygon class="cls-3" points="81.49 154.74 81.53 157.94 84.27 155.47 76.54 156.78 74.89 157.06 74.88 158.25 74.82 170.43 78.27 158.75 76.63 160.2 84.41 161.1 86.37 161.33 87.11 158.67 88.04 155.33 95.65 128.68 84.16 125.25 81.49 154.74"/><polygon class="cls-3" points="197.95 122.51 197.9 126.47 194.51 123.42 204.09 125.03 206.15 125.38 206.16 126.86 206.23 141.99 201.95 127.48 203.99 129.29 194.33 130.4 191.89 130.68 190.97 127.38 189.82 123.23 180.37 90.14 194.63 85.89 197.95 122.51"/><polygon class="cls-3" points="149.78 144.16 144.65 143.61 144.93 142.63 148.61 118.63 135.56 121.73 137.8 143.28 138.05 145.98 138.25 148.13 140.4 147.9 147.64 147.1 148.59 155.26 151.23 145.32 151.49 144.35 149.78 144.16"/><circle class="cls-3" cx="241.03" cy="227.35" r="41.06"/><rect class="cls-9" x="238.09" y="225.78" width="15.99" height="86.04" rx="6.5"/><path class="cls-10" d="M249.78,310.38a5.81,5.81,0,0,1-3.69,1.43c-4.42,0-8-5.69-8-12.71V238.48c0-7,3.58-12.7,8-12.7a5.8,5.8,0,0,1,3.69,1.42c-2.56,2.13-4.31,6.38-4.31,11.28V299.1C245.47,304,247.22,308.25,249.78,310.38Z"/><path class="cls-3" d="M246.09,314.81a11,11,0,0,1-11-11v-70a11,11,0,0,1,22,0v70A11,11,0,0,1,246.09,314.81Zm0-86a5,5,0,0,0-5,5v70a5,5,0,1,0,10,0v-70A5,5,0,0,0,246.09,228.78Z"/><path class="cls-6" d="M296.05,131.36a75.23,75.23,0,0,1,6,11c.74,1.78,1.43,3.47,1.95,5.11s1,3.16,1.31,4.57c1.35,5.68,1.2,9.35.22,9.6-2.16.52-6.69-12.4-15.84-26.1-9-13.81-19.06-23.07-17.73-24.84.61-.81,4.05.51,8.73,4,1.17.87,2.42,1.86,3.69,3s2.58,2.43,3.93,3.81A76.62,76.62,0,0,1,296.05,131.36Z"/><path class="cls-6" d="M313.3,178.31c.48,2.42-.82,4.71-2.89,5.12s-4.15-1.22-4.62-3.64.82-4.72,2.9-5.13S312.83,175.89,313.3,178.31Z"/><path class="cls-6" d="M317,202.62c.54,4.11-.73,7.66-2.82,7.94s-4.24-2.84-4.77-6.94.73-7.66,2.83-7.94S316.48,198.52,317,202.62Z"/><circle class="cls-11" cx="229.78" cy="343.53" r="5.28"/><path class="cls-12" d="M138,52.68a29,29,0,0,0-19.37-.87c-4.89,1.53-7.35,3.77-7.61,3.46-.11-.12.35-.84,1.49-1.84A19.53,19.53,0,0,1,118,50.11a27.32,27.32,0,0,1,9.38-1.92,29,29,0,0,1,11.56,2.13,27.34,27.34,0,0,1,9.7,6.66,27.9,27.9,0,0,1,5.25,8,23.39,23.39,0,0,1,1.74,6.16c.19,1.49.1,2.34-.06,2.36-.42.07-.9-3.21-3.31-7.74a30.26,30.26,0,0,0-5.31-7.14A27.38,27.38,0,0,0,138,52.68Z"/><path class="cls-12" d="M108.26,80.3a20.07,20.07,0,0,1,5.12-6.47,17.38,17.38,0,0,1,5.9-3.25,12.35,12.35,0,0,1,4.47-.59c1.06.08,1.62.29,1.61.45,0,.42-2.29.4-5.44,1.83a19,19,0,0,0-5,3.33,20.41,20.41,0,0,0-4.38,5.83,30,30,0,0,0-2.72,13.22c0,3.56.27,5.81-.11,5.89s-1.22-2.07-1.69-5.78a27.59,27.59,0,0,1,0-6.59A24.21,24.21,0,0,1,108.26,80.3Z"/><path class="cls-12" d="M140.43,20.33a25.58,25.58,0,0,1,7.06,2.46,15.34,15.34,0,0,1,4.81,3.92,8.61,8.61,0,0,1,1.76,3.83c.16,1,0,1.54-.14,1.56-.41.07-.75-2-3-4.19a16.3,16.3,0,0,0-4.52-3,28.82,28.82,0,0,0-6.48-2.05,20.5,20.5,0,0,0-6.69-.31,13.86,13.86,0,0,0-5.09,1.69c-2.71,1.55-3.75,3.39-4.09,3.2-.15-.07-.09-.63.35-1.52a9.55,9.55,0,0,1,2.73-3.17,13.55,13.55,0,0,1,5.72-2.52A19.9,19.9,0,0,1,140.43,20.33Z"/><path class="cls-12" d="M186.89,58.43a31.33,31.33,0,0,0,1.87-9.7,11.92,11.92,0,0,0-2.48-7.23,38.35,38.35,0,0,0-3.72-4.12c-.95-1-1.44-1.54-1.33-1.68s.8.18,2,.91a22.1,22.1,0,0,1,4.49,3.76,12.88,12.88,0,0,1,3.43,8.27,30.14,30.14,0,0,1-1.79,10.58,20.67,20.67,0,0,1-2.38,5.16,14,14,0,0,1-3.87,3.81,16.85,16.85,0,0,1-8.49,2.65,18,18,0,0,1-5.85-.68c-1.33-.39-2-.81-1.95-1,.1-.41,3,.43,7.63-.16a16.46,16.46,0,0,0,7.33-2.79A12.18,12.18,0,0,0,184.85,63,19.79,19.79,0,0,0,186.89,58.43Z"/><path class="cls-12" d="M85.1,87.16A13.11,13.11,0,0,1,81,78.56c-.12-2.47.54-3.89.85-3.83s.39,1.48.94,3.56A14,14,0,0,0,94.08,88.92c2.11.43,3.54.36,3.61.74s-1.3,1-3.78,1.06A13.1,13.1,0,0,1,85.1,87.16Z"/><path class="cls-12" d="M133,92.83a24.28,24.28,0,0,0,4.74-.43,20,20,0,0,0,2-.52,16.5,16.5,0,0,0,1.73-.6c2.1-.83,3.36-1.6,3.61-1.3s-.66,1.54-2.78,2.91a13.24,13.24,0,0,1-1.81,1,16.71,16.71,0,0,1-2.21.82,18.08,18.08,0,0,1-10.7-.22,16.23,16.23,0,0,1-2.18-.92,11.2,11.2,0,0,1-1.76-1c-2.06-1.46-2.88-2.81-2.66-3s1.49.54,3.55,1.46c.52.22,1.08.47,1.71.67s1.3.4,2,.6A24.26,24.26,0,0,0,133,92.83Z"/><path class="cls-12" d="M104.17,42.92a20.9,20.9,0,0,1,4-4,17.67,17.67,0,0,1,2.09-1.33,12.45,12.45,0,0,1,2-.9c2.48-.93,4.14-.86,4.19-.55s-1.36.94-3.41,2.17a17.51,17.51,0,0,0-1.62,1.08c-.58.38-1.13.88-1.74,1.37a23.08,23.08,0,0,0-6,8.07c-.29.72-.6,1.4-.8,2.06s-.4,1.29-.55,1.87c-.59,2.31-.7,3.86-1.09,3.89s-.86-1.53-.7-4.17a13.28,13.28,0,0,1,.3-2.13,16.39,16.39,0,0,1,.66-2.4A20.41,20.41,0,0,1,104.17,42.92Z"/><path class="cls-12" d="M163.78,45.73a23.94,23.94,0,0,0,1.71-3.89,22.19,22.19,0,0,0,.81-3.4c.32-2,.34-3.32.72-3.38s.95,1.21,1.09,3.46a14.52,14.52,0,0,1-.35,3.94A16.69,16.69,0,0,1,163,50.82a14.36,14.36,0,0,1-3.2,2.32c-2,1-3.43,1.14-3.54.85s1-1.06,2.54-2.35a22.65,22.65,0,0,0,2.5-2.45A23.79,23.79,0,0,0,163.78,45.73Z"/><path class="cls-6" d="M173.73,70.51a21.63,21.63,0,0,0,8.47-4.27c1.93-1.57,3-3,3.68-2.73.32.11.49.65.41,1.55a8.73,8.73,0,0,1-1.32,3.5,16.46,16.46,0,0,1-10,6.9,22.68,22.68,0,0,1-11.76-.33c-2.83-.87-4.37-1.93-4.22-2.6s2-.89,4.71-1A47.09,47.09,0,0,0,173.73,70.51Z"/><path class="cls-6" d="M186.07,51.39c.2-1.77,1.49-3.08,2.89-2.93s2.38,1.72,2.19,3.49-1.49,3.08-2.89,2.92S185.88,53.16,186.07,51.39Z"/><path class="cls-6" d="M183.86,41.8a2.6,2.6,0,0,1,4.14-3,2.61,2.61,0,0,1-4.14,3Z"/><path class="cls-13" d="M330,302c20.28,37,13.83,73.05,14.54,107.47l-11-12.15a118.62,118.62,0,0,1-28.8,57.47,42.38,42.38,0,0,0-13.34-14.7A89.09,89.09,0,0,1,263.9,487a35.8,35.8,0,0,0-1-29.59,56.4,56.4,0,0,1-30.8,34.29,23.17,23.17,0,0,0,2.52-22.37c-11.17,19-43.3,19.54-55.14,1-.82,3.75-.22,8.67,3.61,9-16.11,2.48-30.85-4.3-41.93-16.25a27.05,27.05,0,0,0,9,17.56,49.18,49.18,0,0,1-40.92-27.17c-20.77,1.29-41.53-12.94-47.8-32.79a9.91,9.91,0,0,1-2.59,9.51c-35.89-18.22-34-99.94-10.46-126.89,0,0,49.48,7.94,79.51,30.74,6.43,4.88,14.43-4.6,23.27-7.4,17.51-5.53,38.32-11.15,56.88-11.22,23.39-.1,35.9,29.56,50.89,15.49C298.57,293.65,329.64,301.39,330,302Z"/><path class="cls-14" d="M345.91,405.22l-11-12.16a118.76,118.76,0,0,1-28.81,57.48,42.3,42.3,0,0,0-13.34-14.7,89,89,0,0,1-27.51,46.89,35.83,35.83,0,0,0-1-29.59,56.4,56.4,0,0,1-30.8,34.29A23.2,23.2,0,0,0,236,465.06c-11.17,19-43.3,19.54-55.14,1-.83,3.75.11,17.55,3.94,17.87-16.1,2.48-31.18-13.18-42.26-25.13.64,6.7,2.31,18.78,7.36,23.23-17.16-.88-31.84-17.37-39.3-32.84-20.78,1.29-41.53-12.95-47.8-32.79a9.91,9.91,0,0,1-2.58,9.51c-12.41-6.3-20.59-20-25-36.31,15.87,11.57,34.55,19.51,53,26.63,12.54,4.82,25.24,9.42,38.46,11.83,12.82,2.33,25.92,2.56,39,2.79,36.17.62,73.84.94,106.53-14.59,9.37-4.45,19.26-12.08,18.93-22.46-.37-11.86-13.35-18.63-24.42-22.88,23.58-3.5,42.91-21.78,53.67-43.05a131.59,131.59,0,0,0,9.48-25.3L333,305C342.73,339,345.19,370.81,345.91,405.22Z"/><path class="cls-3" d="M253.41,500.93l7.73-18.34a31,31,0,0,0,2.25-14.75,61,61,0,0,1-28.12,25.32l-15.22,6.65,9.79-13.42a18.51,18.51,0,0,0,3.37-9.49,38.29,38.29,0,0,1-24.46,8.83,39.29,39.29,0,0,1-20.87-5.26c1,5.16.93,9.73-3.16,11.61l-1.89.86-1.88-.86c-13-6-23.27-12.19-31.89-19.33,1.42,5.57,3,7.6,3.8,8.31l9.71,8.53-12.91-.66c-18.37-.93-33.64-18.1-41.8-33.56-17.77,0-34.88-10-44.23-24.92l-.28.28L61,433l-2.87-1.46c-13.73-7-23.61-22.79-27.84-44.54-6.17-31.81.86-70.33,16-87.71a4.5,4.5,0,1,1,6.78,5.92c-13.31,15.26-19.57,51.18-14,80.07,3.26,16.82,10.08,29.4,19.38,36a5.07,5.07,0,0,0-.1-2.09l8.63-2.54c5.62,17.79,24.6,30.81,43.23,29.66l3-.19,1.31,2.72c7.38,15.29,17.47,24.65,26.45,28.73a83.68,83.68,0,0,1-3-16.73l-1.27-13.24,9.05,9.75c8.53,9.2,18.86,16.65,33,23.73-.31-1.46-.69-2.95-1-4-1.25-5-1.93-7.92-1.4-10.33l2.33-10.64,5.86,9.18c4.71,7.38,13.68,11.69,24,11.5s19.08-4.81,23.52-12.35l4.51-7.66,3.51,8.17a27.18,27.18,0,0,1,2,13.86A51.87,51.87,0,0,0,260,453.4l3.32-10.56,5,9.88a40,40,0,0,1,4.21,17.36,84.32,84.32,0,0,0,15.89-33.6l1.43-6.48,5.49,3.72a47,47,0,0,1,11.36,10.93,115.09,115.09,0,0,0,23.84-50.82l1.7-8.88,10,11.05c2-35.79-3.31-65-16.46-91.39a4.5,4.5,0,1,1,8-4C349,331,354.25,364.9,350.39,407.23l-.93,10.24-12.07-13.36a122.34,122.34,0,0,1-27.94,51.07l-4.26,4.65-3-5.53a37.69,37.69,0,0,0-6.81-9,93.54,93.54,0,0,1-27.08,42.37Z"/><path class="cls-2" d="M159.69,399.62a9.74,9.74,0,0,1-9.71-9.71V352.76a9.74,9.74,0,0,1,9.71-9.71h68a9.75,9.75,0,0,1,9.72,9.71v37.15a9.75,9.75,0,0,1-9.72,9.71"/><path class="cls-4" d="M239,356.81v11.52a9.75,9.75,0,0,0-8.91-5.85h-68a9.74,9.74,0,0,0-9.71,9.71v25.63a9.65,9.65,0,0,1-.81-3.87V356.81a9.75,9.75,0,0,1,9.71-9.72h68A9.76,9.76,0,0,1,239,356.81Z"/><path class="cls-3" d="M193.29,341.91c7,0,13.87,0,20.49.1l9.74.12,2.37,0,1.18,0h.33l.43,0,.85.06a14.26,14.26,0,0,1,6.29,2.29,14.06,14.06,0,0,1,6.23,10.73l0,.78v.65l0,1.07c0,.7,0,1.41-.05,2.11,0,1.39-.09,2.77-.13,4.12-.17,5.41-.37,10.45-.59,15s-.45,8.76-.71,12.42c0,.45-.07.9-.1,1.34,0,.22,0,.44-.05.66s-.05.52-.08.78a11.57,11.57,0,0,1-.74,3,11.41,11.41,0,0,1-3,4.24,9.64,9.64,0,0,1-6.23,2.57,4.68,4.68,0,0,1-1.7-.26c-.38-.14-.55-.3-.55-.46s.17-.34.49-.52l1.35-.66a10.23,10.23,0,0,0,3.89-3.22,8.51,8.51,0,0,0,1.34-3.09,8,8,0,0,0,.12-1.84l0-.5c0-.22,0-.44-.05-.66l-.09-1.34c-.26-3.66-.5-7.82-.72-12.42s-.41-9.63-.59-15c0-1.35-.08-2.73-.12-4.12l-.06-2.11,0-1.07v-.43l0-.3a5.41,5.41,0,0,0-4.95-4.71h-.73l-1.18,0-2.37,0-9.74.12c-6.62.06-13.47.1-20.49.1s-13.87,0-20.48-.1l-9.74-.12-2.38,0-1.18,0h-.73a5.42,5.42,0,0,0-4.94,4.71l0,.3,0,.16v.27l0,1.07c0,.7,0,1.41-.05,2.11,0,1.39-.09,2.77-.13,4.12-.17,5.41-.37,10.45-.59,15s-.46,8.76-.71,12.42c0,.45-.07.9-.1,1.34,0,.22,0,.44,0,.66l0,.5a7.43,7.43,0,0,0,.13,1.84,8.18,8.18,0,0,0,1.34,3.09,10.21,10.21,0,0,0,3.88,3.22l1.35.66c.32.18.5.35.5.52s-.18.32-.55.46A4.74,4.74,0,0,1,157,404a9.6,9.6,0,0,1-6.22-2.57,11.32,11.32,0,0,1-3-4.24,12,12,0,0,1-.74-3c0-.26-.06-.57-.08-.78s0-.44-.05-.66l-.09-1.34c-.26-3.66-.5-7.82-.72-12.42s-.41-9.63-.59-15c0-1.35-.08-2.73-.12-4.12l-.06-2.11,0-1.07v-.65l0-.78a14.08,14.08,0,0,1,6.22-10.73,14.31,14.31,0,0,1,6.29-2.29l.86-.06.43,0h.32l1.18,0,2.38,0,9.74-.12C179.42,342,186.28,341.91,193.29,341.91Z"/><path class="cls-3" d="M60.39,322a37.09,37.09,0,0,0,.47,9,37.78,37.78,0,0,0,2.92,8.91,39.35,39.35,0,0,1-5.49-8A40.74,40.74,0,0,1,55,322.37a44.5,44.5,0,0,1-1-10.27,49.21,49.21,0,0,1,.4-5.25,33.42,33.42,0,0,1,1.13-5.44l10,4.36a23.19,23.19,0,0,0-1.89,3.53,41.21,41.21,0,0,0-1.54,4A38.35,38.35,0,0,0,60.39,322Z"/><path class="cls-3" d="M75.3,330.15c.78,7.09,3.93,14.18,8.49,20.33A45.39,45.39,0,0,1,70,331.43,37.16,37.16,0,0,1,67.79,319,33.53,33.53,0,0,1,70.32,306l9.59,5.16C76.2,316,74.51,323.12,75.3,330.15Z"/><path class="cls-3" d="M102.41,335.48A49,49,0,0,0,109,355a51.46,51.46,0,0,1-11.83-18.14,54.08,54.08,0,0,1-3.61-22.51l10.73,1.85A45.78,45.78,0,0,0,102.41,335.48Z"/><path class="cls-3" d="M279.1,331.6a25.9,25.9,0,0,1-.28,8.41c-.49,2.14-1.22,3.39-1.88,3.33-1.37-.13-2-5.16-2.7-11.16s-1.3-11,0-11.49c.63-.2,1.64.84,2.61,2.8A25.74,25.74,0,0,1,279.1,331.6Z"/><path class="cls-3" d="M300.7,325.92a34.06,34.06,0,0,1-2.28,11.66c-1.17,2.83-2.4,4.35-3,4.13-1.32-.5.23-7.41.4-15.92s-.91-15.49.43-15.91c.62-.19,1.77,1.39,2.79,4.28A34.18,34.18,0,0,1,300.7,325.92Z"/><path class="cls-3" d="M323.44,322.4a51.55,51.55,0,0,1,.48,8.84,42.08,42.08,0,0,1-.84,7.17c-.86,4-2,6.32-2.66,6.19-1.41-.31-.09-10-1.83-21.5s-5.47-20.53-4.18-21.19c.58-.3,2.31,1.61,4.22,5.24a44.14,44.14,0,0,1,2.79,6.64A53.12,53.12,0,0,1,323.44,322.4Z"/><path class="cls-3" d="M68.8,420.47a39.61,39.61,0,0,1-.25-8.28,35.94,35.94,0,0,1,.5-3.58,25.93,25.93,0,0,1,.76-3c1.14-3.68,2.57-5.64,3.16-5.43s.45,2.52.24,6.05c0,.89-.12,1.85-.12,2.88s0,2.13,0,3.28a59.18,59.18,0,0,0,2.11,14.73c.33,1.1.6,2.17.94,3.14s.63,1.89.92,2.73c1.2,3.32,2,5.46,1.47,5.87s-2.43-1.11-4.56-4.32a23.37,23.37,0,0,1-1.57-2.71,33.94,33.94,0,0,1-1.49-3.3A40.12,40.12,0,0,1,68.8,420.47Z"/><path class="cls-3" d="M99.55,433.75a50.42,50.42,0,0,1-.07-13.35c.45-3.36,1.12-5.4,1.79-5.39s1.24,2.09,1.67,5.4.77,7.81,1.45,12.64c.35,2.41.78,4.67,1.25,6.7.27,1,.47,2,.76,2.85l.38,1.3c.14.41.27.8.39,1.18,1,3,1.81,4.94,1.24,5.37s-2.36-.88-4.34-3.84c-.24-.37-.49-.77-.74-1.18s-.46-.87-.7-1.33a28,28,0,0,1-1.31-3.05A39.4,39.4,0,0,1,99.55,433.75Z"/><path class="cls-3" d="M136.2,440.16c-4-14.35-4.59-26.51-3.28-26.67s4.05,11.36,8,25.35,7.6,25.27,6.32,25.82S140.2,454.53,136.2,440.16Z"/><path class="cls-3" d="M244.41,451.81c1.82-6.05,3.09-11.74,4.22-15.84s2.08-6.65,2.75-6.55.91,2.79.66,7.11a75.23,75.23,0,0,1-2.94,16.7,56.28,56.28,0,0,1-3.52,8.82c-.71,1.29-1.35,2.52-2.1,3.61-.37.54-.71,1.07-1.06,1.56l-1.08,1.38c-2.84,3.46-5.24,4.92-5.69,4.49s.9-2.74,2.8-6.4c.24-.45.48-.93.74-1.43l.74-1.58c.54-1.08,1-2.29,1.55-3.52C242.49,457.64,243.49,454.83,244.41,451.81Z"/><path class="cls-3" d="M273,440.9c1.29-7.37,2-14.28,2.87-19.27s1.74-8,2.41-8,1,3.21,1,8.27a116.76,116.76,0,0,1-1.5,19.83,57.15,57.15,0,0,1-2.95,10.79,40,40,0,0,1-4.24,8.17c-3,4.36-5.79,6.2-6.23,5.76s1.21-3.06,3.23-7.47a65,65,0,0,0,3-7.94A85.72,85.72,0,0,0,273,440.9Z"/><path class="cls-3" d="M301.86,422.49c1.43-6,2.41-11.53,3.33-15.56s1.76-6.53,2.43-6.46,1,2.67,1,6.86a74.69,74.69,0,0,1-2,16.31,56.91,56.91,0,0,1-2.88,8.73c-.61,1.29-1.15,2.53-1.8,3.62-.31.55-.6,1.09-.91,1.59l-.95,1.41c-2.48,3.54-4.67,5.16-5.16,4.77s.59-2.76,2.14-6.45l.6-1.45q.3-.76.6-1.59c.45-1.08.82-2.28,1.26-3.51C300.32,428.25,301.13,425.46,301.86,422.49Z"/><path class="cls-3" d="M311.64,413.48c1.55-3.78,2.81-7.46,3.86-10.85.48-1.71,1-3.33,1.35-4.87s.75-3,1.06-4.28c1.21-5.28,1.85-8.64,2.57-8.62s1.22,3.49.85,9.12c-.1,1.41-.23,2.95-.5,4.59s-.58,3.38-1,5.21a72.61,72.61,0,0,1-9.28,22.38c-1,1.56-2,3-3,4.36s-2,2.53-2.89,3.59c-3.73,4.24-6.6,6.27-7.06,5.84s1.41-3.32,4.28-7.9c.72-1.15,1.51-2.4,2.29-3.78s1.62-2.84,2.49-4.39C308.34,420.75,310.06,417.25,311.64,413.48Z"/><path class="cls-6" d="M42.94,339.6c.72-3.5,2.66-5.94,4-5.52s1.67,3.31,1,6.55-2.1,5.77-3.51,5.62S42.22,343.1,42.94,339.6Z"/><path class="cls-6" d="M44.16,377.44a49.43,49.43,0,0,1-1.78-14.27c.14-3.7.8-5.95,1.48-6,1.47,0,2.43,8.7,5.23,18.9s6.3,18.17,5,18.93c-.59.34-2.31-1.26-4.31-4.37A48.78,48.78,0,0,1,44.16,377.44Z"/><path class="cls-3" d="M128.52,338.8H128c-5-.18-8.88-3.13-12-5.51l-.19-.14a150.17,150.17,0,0,0-65.16-28.23A4.5,4.5,0,0,1,52.19,296,159.48,159.48,0,0,1,121.27,326l.19.15c2.35,1.77,4.77,3.61,6.9,3.69s4.58-1.53,7.15-3.22l.75-.49c14.75-9.64,33.89-14.95,53.9-14.95h0c20,0,39.15,5.31,53.9,14.95l.74.48c2.58,1.7,5,3.3,7.15,3.23s4.56-1.92,6.9-3.69l.19-.15A159.59,159.59,0,0,1,328.13,296a4.5,4.5,0,0,1,1.52,8.88,150.17,150.17,0,0,0-65.16,28.23l-.19.14c-3.13,2.38-7,5.33-12,5.51s-9.12-2.53-12.42-4.7l-.71-.47c-27.47-17.94-70.5-17.94-98,0l-.72.47C137.27,336.2,133.32,338.8,128.52,338.8Z"/><path class="cls-3" d="M210.09,385.31h-36a3.5,3.5,0,1,1,0-7h36a3.5,3.5,0,0,1,0,7Z"/><circle class="cls-14" cx="256.32" cy="340.31" r="34.5"/><circle class="cls-6" cx="246.03" cy="330.35" r="40.04"/><circle class="cls-11" cx="250.78" cy="312.53" r="5.28"/><polygon class="cls-3" points="141.26 29.28 141.29 32.05 143.66 29.92 136.97 31.05 135.54 31.29 135.53 32.32 135.48 42.88 138.47 32.75 137.05 34.01 143.79 34.79 145.49 34.99 146.13 32.68 146.93 29.79 152.37 10.18 143.58 3.72 141.26 29.28"/><polygon class="cls-3" points="131.05 92.41 129.84 89.02 133.69 90.55 125.03 92.19 123.17 92.54 122.7 91.28 117.89 78.43 126.08 89.43 123.78 88.53 131.65 84.56 133.64 83.55 135.46 86.07 137.73 89.24 153.18 110.69 145.37 122.52 131.05 92.41"/><circle class="cls-3" cx="123.96" cy="232.98" r="22.91"/><circle class="cls-2" cx="134.18" cy="215.95" r="12.7"/><circle class="cls-6" cx="114.77" cy="241.53" r="5.28"/><circle class="cls-3" cx="242.84" cy="330.2" r="15.77"/><circle class="cls-6" cx="255.89" cy="340.77" r="10.18"/></g></g></svg>
\ No newline at end of file
此差异已折叠。
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 464.12 605.75"><defs><style>.cls-1{fill:#dfe7ea;}.cls-2{fill:#f0d7c2;}.cls-3{fill:#d7ad8c;}.cls-4{fill:#c4987a;}.cls-5{fill:#8376a5;}.cls-6{fill:#655a8e;}.cls-7{fill:#ebcbac;}.cls-16,.cls-8,.cls-9{fill:none;stroke:#42565e;stroke-miterlimit:10;}.cls-8{stroke-linecap:round;}.cls-8,.cls-9{stroke-width:10px;}.cls-9{stroke-linecap:square;}.cls-10{fill:#dcb79b;}.cls-11{fill:#fff;}.cls-12{fill:#40565a;}.cls-13{fill:#a699d6;}.cls-14{fill:#485d63;}.cls-15{fill:#796f9c;}.cls-16{stroke-width:11px;}.cls-17{fill:#325560;}</style></defs><title>Asset 120</title><g id="Layer_2" data-name="Layer 2"><g id="Layer_1-2" data-name="Layer 1"><ellipse class="cls-1" cx="236.82" cy="551.53" rx="184.33" ry="54.22"/><path class="cls-2" d="M30.24,275.91A69.67,69.67,0,0,0,21.69,369c4.48,6,10.06,11.3,16.89,14.32s15,3.46,21.65,0"/><path class="cls-3" d="M18,366.5c3.62,6.7,8.36,12.95,14.66,17.24,2.69,1.84,7,1.57,11.13,1.27-5.9-4.26-10.4-10.26-13.86-16.68-15.65-29-9.35-68.14,14.59-90.75H68.76v-1.84H32.58C8.64,298.37,2.34,337.52,18,366.5Z"/><path class="cls-3" d="M419,275a69.67,69.67,0,0,1,29.75,88.61c-3,6.84-7.19,13.32-13.14,17.82s-13.82,6.82-21.06,5"/><path class="cls-4" d="M411.42,386.76a29.59,29.59,0,0,0,19.15-4.19c6.72-4,11.79-10.17,15.61-16.77A67.58,67.58,0,0,0,453.47,316c-4.12-16.58-18.64-31.49-33.49-41l-1,13.49c7.89,8.45,16.35,18.74,19.1,29.76a67.58,67.58,0,0,1-7.29,49.78c-3.82,6.6-8.9,12.74-15.61,16.77A30.36,30.36,0,0,1,411.42,386.76Z"/><path class="cls-5" d="M452.36,118.46c-8.78-30.07-32.4-57-62.92-63.67a46.85,46.85,0,0,0-9.71-17.86c-5.41-6.13-12.35-10.72-19.61-14.48-36.17-18.7-79.26-17-119.65-11.85-16.15,2.07-32.27,4.63-48,8.91C128.34,37,73,84.38,45.91,145.09s-22.25,133.54,7.56,193L262.36,185.91V334.35H414.7c-8.85-26.74-4.64-73.12,7.76-98.72,9.21-19,22.61-32.09,28.47-53.07C457,160.94,458.72,140.29,452.36,118.46Z"/><path class="cls-6" d="M454.65,186.37C452,196,447.72,203.88,443,211.49c-.82-48.6-11-97.83-36.11-139.38A92.48,92.48,0,0,0,398.41,60c28,8.43,49.4,34,57.66,62.31C462.44,144.1,460.69,164.75,454.65,186.37Z"/><path class="cls-7" d="M53.69,331.22c15.1-11.09,21.39-30.36,26.05-48.51A691.24,691.24,0,0,0,99.16,167.36l91,27.16c10,3,20.12,6,30.54,6.38,26.17,1,49.73-14.31,74.25-23.5A165.16,165.16,0,0,1,370,167.87s7.5,121.7,48.83,164.47c.81,73-43.54,137.46-92.3,191.78-11.27,12.55-23,25.08-37.55,33.62l-.21.12a72.52,72.52,0,0,1-36.5,10.2l-29.86.15a71.65,71.65,0,0,1-36.73-9.91l-1-.56c-14.55-8.54-26.28-21.06-37.55-33.62C98.47,469.8,52,405.33,52.78,332.34"/><path class="cls-2" d="M146.18,528.31c-48.31-54-94-118-93.24-190.45l.91-1.13c15.09-11.09,21.39-30.36,26-48.51A690.78,690.78,0,0,0,99.31,172.88l28.18,8.41C118.46,222.82,83,409.19,146.18,528.31Z"/><path class="cls-3" d="M323.51,525.35a270.7,270.7,0,0,1-19.2,19.85c22.46-40.14,35.38-85.8,40-131.73,6.33-63.1-2.24-126.93-17.2-188.56-.55-2.26-1.17-4.63-2.75-6.34-2.47-2.67-6.5-3-10.13-3.13-20.76-.84-41.76-1.81-61.63-7.87a105.08,105.08,0,0,1-17.44-7c19.43-4.07,37.77-14.78,56.7-21.88A165.11,165.11,0,0,1,367,169.1s7.49,121.69,48.83,164.46C416.61,406.56,372.26,471,323.51,525.35Z"/><path class="cls-8" d="M390.57,54.45c31.3,6,55.6,33.41,64.53,64,6.37,21.82,4.61,42.47-1.43,64.1-5.86,21-19.26,34.06-28.47,53.07-12.4,25.6-14.78,71.07-5.93,97.81"/><path class="cls-8" d="M27.49,275.91A69.67,69.67,0,0,0,18.93,369c4.48,6,10.06,11.3,16.89,14.32s15,3.46,21.65,0"/><path class="cls-8" d="M422.38,274.38A69.67,69.67,0,0,1,452.13,363c-3,6.84-7.19,13.32-13.14,17.82s-13.82,6.82-21.06,5"/><polygon class="cls-3" points="237.17 353.31 237.17 432.24 264.71 432.24 237.17 353.31"/><polyline class="cls-9" points="237.32 357.44 236.19 423.51 236.11 428.1"/><path class="cls-10" d="M344.27,308.58c.57,5-.41,9-1.09,8.93s-.9-4-1.45-8.65-1.2-8.52-.51-8.75S343.71,303.58,344.27,308.58Z"/><path class="cls-11" d="M160.6,204.75a109.34,109.34,0,0,1,22.25,7.54c5.49,2.71,8.48,5.28,8,6.57s-4.34,1.18-10.15.31-13.7-2.41-22.45-4.49A144,144,0,0,1,136,207.81c-5.57-2.38-8.76-4.67-8.36-6s4.24-1.55,10.15-1A175.83,175.83,0,0,1,160.6,204.75Z"/><path class="cls-12" d="M397.3,128.18a75.72,75.72,0,0,1,1.9,14c0,2.17.07,4.23-.09,6.16-.07,1-.1,1.89-.21,2.78l-.35,2.55c-1,6.48-2.82,10.19-3.8,10s-1.24-4.15-1.61-10.27L393,151c0-.83-.16-1.7-.23-2.59-.11-1.78-.38-3.68-.6-5.67-.54-4-1.27-8.29-2.32-12.78s-2.39-8.66-3.69-12.45c-.71-1.87-1.32-3.68-2-5.33-.34-.83-.63-1.65-1-2.41l-.95-2.21c-2.43-5.63-4.08-9.23-3.19-9.9s4.05,1.91,7.9,7.22l1.46,2.11c.5.74.95,1.55,1.44,2.38,1,1.65,1.9,3.5,2.85,5.46A75.74,75.74,0,0,1,397.3,128.18Z"/><path class="cls-12" d="M435.13,118.25a108.47,108.47,0,0,1-2.34,18.33c-.67,2.76-1.29,5.39-2.1,7.78-.39,1.2-.73,2.37-1.14,3.46L428.33,151a55.23,55.23,0,0,1-2.41,5.25c-.39.76-.74,1.46-1.11,2.09s-.74,1.19-1.08,1.69c-1.34,2-2.3,3-2.79,2.77-1-.47.38-5.47,2.21-13.44l.71-3.13c.25-1.08.43-2.23.67-3.4.51-2.34.86-4.87,1.31-7.51A173.57,173.57,0,0,0,427.48,118a173.79,173.79,0,0,0-.37-17.39c-.26-2.66-.43-5.21-.77-7.58-.16-1.18-.25-2.34-.42-3.44l-.48-3.17c-1.25-8.08-2.3-13.17-1.24-13.56.5-.18,1.38.87,2.58,3q.45.79,1,1.76c.32.66.62,1.38,1,2.17a55.19,55.19,0,0,1,2,5.41l1,3.21c.33,1.12.59,2.31.89,3.54.64,2.45,1.06,5.11,1.53,7.91A108.47,108.47,0,0,1,435.13,118.25Z"/><path class="cls-12" d="M407,237.87a61.19,61.19,0,0,1,3-13.43,51.88,51.88,0,0,1,2.35-5.53c.43-.84.8-1.66,1.25-2.41l1.31-2.14a30.51,30.51,0,0,1,2.52-3.48c.4-.49.77-.95,1.14-1.34s.75-.73,1.09-1c1.35-1.2,2.28-1.69,2.71-1.38.91.66-.62,4.15-2.6,9.64l-.77,2.16c-.27.75-.48,1.55-.74,2.36-.56,1.61-1,3.38-1.49,5.21A83.83,83.83,0,0,0,414.29,251c.13,1.9.18,3.72.4,5.4.1.85.14,1.68.25,2.46l.32,2.27c.83,5.79,1.62,9.51.59,10-.48.21-1.3-.46-2.37-1.9q-.4-.54-.85-1.23c-.29-.46-.55-1-.84-1.54A30.49,30.49,0,0,1,410,262.5l-.85-2.36c-.28-.83-.48-1.71-.73-2.61a51.91,51.91,0,0,1-1.18-5.89A61.23,61.23,0,0,1,407,237.87Z"/><path class="cls-13" d="M338.06,11a505.1,505.1,0,0,0-65.52,7.53c-9.44,1.72-18.9,3.72-27.78,7.32C237.13,29,230,33.22,222.27,36.08l-1,.35c-15.13,5.37-33.2,6.48-43.21,19L179.81,52q1.31-2.53,2.6-5.07a64.64,64.64,0,0,0-39.5,17c-.84.79-1.73,1.54-2.63,2.27-9,7.24-20.27,11.3-28.87,19.81q-.45-4.32-.89-8.65-2,1.23-3.94,2.52c-9.37,6.19-18,13.53-24.81,22.49-7.31,9.7-12.31,21.4-12.89,33.52a2.76,2.76,0,0,0-1.28-1.65c-.22.33-.44.67-.65,1a164.8,164.8,0,0,0-25.72,75.23q-1.39-4.56-2.77-9.1c-.08,1.17-.16,2.37-.21,3.63a304,304,0,0,0,3.3,57.5,58,58,0,0,1-13.19-23.61,221.08,221.08,0,0,1,5.31-59.68A200.24,200.24,0,0,1,46,142.48a217.66,217.66,0,0,1,18.72-33.54A52.26,52.26,0,0,1,66.84,100a231.53,231.53,0,0,1,78.78-67.78,147.77,147.77,0,0,0-11.25,10A223.1,223.1,0,0,1,179,21.07q6.69-2.31,13.52-4.18a312,312,0,0,1,36.29-7.31c3.89-.58,7.79-1.1,11.68-1.61,10.4-1.34,21-2.43,31.56-3C294.53,3.75,317,4.85,338.06,11Z"/><path class="cls-8" d="M50.86,335.92C21,276.49,16.19,203.66,43.3,142.95S125.73,34.84,189.89,17.37c15.71-4.28,31.83-6.84,48-8.91,40.39-5.18,83.48-6.85,119.65,11.85,7.26,3.75,14.2,8.35,19.61,14.48C388.79,48,392,67.82,386,84.4s-20.53,29.56-37.4,34.67"/><path class="cls-12" d="M119.45,55.71a122.27,122.27,0,0,1,11.37-12.29c1.91-1.73,3.71-3.37,5.52-4.79s3.48-2.72,5.07-3.83c6.39-4.44,10.89-6.3,11.46-5.47,1.28,1.85-13.39,13.4-27.43,31.16C111.22,78.11,103.19,95,101.1,94.13c-.93-.38-.12-5.17,2.8-12.39.74-1.8,1.58-3.75,2.62-5.79s2.18-4.19,3.45-6.44A122.24,122.24,0,0,1,119.45,55.71Z"/><path class="cls-12" d="M152.92,44.74a155.46,155.46,0,0,1,12.6-13.37c2.09-1.91,4.07-3.71,6-5.29s3.78-3,5.5-4.29c6.91-5,11.74-7.28,12.34-6.46,1.32,1.81-14.6,14.92-30.58,34.31C142.68,68.9,132.71,87,130.69,86c-.91-.44.42-5.6,4.09-13.32.92-1.92,2-4,3.21-6.2s2.61-4.49,4.1-6.89A155.46,155.46,0,0,1,152.92,44.74Z"/><path class="cls-12" d="M193,32.11a87.62,87.62,0,0,1,14.89-12.4,79.37,79.37,0,0,1,14-7.35c8.37-3.31,14-3.82,14.24-2.87s-4.55,3.39-11.85,7.73a121.7,121.7,0,0,0-25.76,20.23c-8.94,9.23-15.89,18.86-21.16,25.73s-8.78,11.07-9.7,10.51,1-5.67,5.14-13.44A127.77,127.77,0,0,1,193,32.11Z"/><path class="cls-12" d="M246.25,15.32A101.07,101.07,0,0,1,263,7.14a76.92,76.92,0,0,1,14.74-4c8.63-1.37,14-.51,14.08.47s-5,2.2-12.8,4.79a141.76,141.76,0,0,0-28.82,13.45c-10.67,6.49-19.73,13.51-26.43,18.52s-11.06,8-11.8,7.22,2.32-5.1,8.21-11.27A131.37,131.37,0,0,1,246.25,15.32Z"/><path class="cls-12" d="M38.39,192.46a120.8,120.8,0,0,0,3.08,13.79c.66,2.07,1.22,4.08,1.91,5.9.33.91.6,1.82.94,2.67l.95,2.43c2.44,6.21,4.26,10.1,3.34,10.76-.43.31-1.43-.29-2.9-1.67q-.55-.52-1.19-1.18c-.41-.45-.81-1-1.26-1.52a38.32,38.32,0,0,1-2.81-3.91L39,217.34c-.5-.84-.94-1.75-1.43-2.68a65,65,0,0,1-2.76-6.13,71.66,71.66,0,0,1-4.66-30.3,64.9,64.9,0,0,1,.79-6.68c.19-1,.33-2,.56-3l.69-2.72a38.34,38.34,0,0,1,1.5-4.57c.26-.66.49-1.27.74-1.83s.53-1,.78-1.48c1-1.76,1.76-2.63,2.26-2.47,1.07.35.52,4.61.05,11.26l-.17,2.61c-.06.9,0,1.85-.09,2.82-.11,1.94,0,4,0,6.2A120.86,120.86,0,0,0,38.39,192.46Z"/><path class="cls-12" d="M36.06,250.75a94.42,94.42,0,0,0,5.12,8.54c.9,1.25,1.71,2.48,2.56,3.55.42.55.8,1.1,1.2,1.6l1.16,1.45c3,3.71,5,6.11,4.35,7s-3.77,0-8.06-3.08l-1.65-1.24c-.57-.44-1.1-1-1.68-1.47a42.43,42.43,0,0,1-3.46-3.52,47.69,47.69,0,0,1-10.33-19.94,42.32,42.32,0,0,1-.88-4.85c-.09-.77-.19-1.5-.23-2.22s0-1.4-.06-2.06c0-5.26,1.13-8.39,2.13-8.36s1.91,3.05,3.23,7.61l.52,1.78c.18.62.41,1.25.62,1.91.38,1.32.92,2.69,1.42,4.14A94.39,94.39,0,0,0,36.06,250.75Z"/><path class="cls-12" d="M67.93,123.65A94.35,94.35,0,0,0,69.15,133c.31,1.43.54,2.81.87,4.07.16.64.27,1.27.43,1.86l.44,1.71c1.13,4.37,1.93,7.26,1,7.85s-3.35-1.43-6-5.72l-1-1.71c-.33-.6-.61-1.25-.92-1.92a40.14,40.14,0,0,1-1.7-4.39,45.45,45.45,0,0,1-1.49-21.39,40.27,40.27,0,0,1,1.08-4.58c.22-.71.4-1.39.64-2l.73-1.83c2-4.61,4.21-6.91,5.12-6.49s.62,3.42.11,7.91l-.2,1.76c-.07.61-.1,1.25-.17,1.9-.15,1.3-.19,2.7-.3,4.16A94.26,94.26,0,0,0,67.93,123.65Z"/><path class="cls-6" d="M355.66,174.31a165.11,165.11,0,0,0-59.78,10.43c-10.63,4-21.07,9.1-31.63,13.56v-4.12L252.17,203a106,106,0,0,1-14.22,3.9c-1.55.3-3.11.56-4.69.78a69.08,69.08,0,0,1-11.64.58c-10.43-.39-20.55-3.4-30.53-6.38l-56.29-16.8-14.54-4.34-20.14-6q-2.75,33.38-8.73,66.39Q87.06,265.14,81,288.82c-.1.41-.21.82-.31,1.23-4.66,18.14-10.95,37.42-26,48.5l-.92,1.13c0,1.12,0,2.25,0,3.36Q50.69,336.71,48,330.2c11.22-9.15,18.92-22.41,22.74-36.44,4.32-15.88,4-32.73,1.4-49a1.49,1.49,0,0,0,1.43.57c1.44-.21,3-2.36,3.4-4.18a188.87,188.87,0,0,0,4.36-49.24c0-.66-.06-1.31-.09-2l3.23,3.4c6-11.47,4.25-31.47,6.3-44.25,13.89,12.88,48.77,13.2,66.08,5.51-4.33,3.77-5,12.86-10.1,15.6,1.53,0-8.28,5-6.75,4.94a129.75,129.75,0,0,0,65.78-21.6c-5.24,11-14.41,26.68-26,30.42,1.69.36,2.65-6.32,4.34-6q12.47,2.51,25.09,4.17c12.06,1.61,24.59,2.62,36.17-1.11,14.49-4.66,25.64-16.08,36.16-27.09q0,2.9-.35,5.8a65.84,65.84,0,0,1-5,19.31l32.61-13.88c.05.5.09,1,.12,1.51a27,27,0,0,1-3.55,14.74q25.15-11.8,49.59-25A27.75,27.75,0,0,1,355.66,174.31Z"/><path class="cls-6" d="M411.74,319.21c-8.3-10.85-15.05-25-20.53-40.32-.08-.22-.16-.44-.23-.65-11.25-33.09-16.84-70.92-19.39-93.54,10.71,26.93,25,59.59,39.5,85.45h0C408.88,287.05,408.92,304.81,411.74,319.21Z"/><path class="cls-14" d="M269.63,176.7c24.26-13.66,43.82-25.11,45.05-23.33s-16.68,16.14-41.28,30-46.18,21.74-47,19.86S245.4,190.42,269.63,176.7Z"/><path class="cls-14" d="M257.18,173.65c4.41-4.6,8.39-9.18,11.9-13.46,1.71-2.18,3.38-4.21,4.84-6.2.74-1,1.49-1.92,2.16-2.85l1.94-2.68c4.93-6.84,8-11.24,9-10.75s-.41,5.73-4.33,13.56l-1.59,3c-.56,1.05-1.22,2.11-1.87,3.22-1.28,2.24-2.84,4.51-4.47,6.91a121.8,121.8,0,0,1-26.14,27c-2.34,1.71-4.56,3.34-6.75,4.7-1.09.69-2.12,1.38-3.15,2l-3,1.69c-7.7,4.18-13,5.67-13.41,4.78s3.78-4.16,10.45-9.32l2.61-2c.91-.7,1.81-1.48,2.78-2.25,1.94-1.52,3.92-3.26,6-5C248.28,182.34,252.73,178.22,257.18,173.65Z"/><path class="cls-12" d="M167.43,170.51a127.73,127.73,0,0,0,20.86-7.38c3-1.53,6-2.88,8.6-4.48,1.31-.77,2.63-1.44,3.82-2.21l3.41-2.23c2.24-1.34,4.06-2.84,5.78-4,.84-.61,1.67-1.15,2.38-1.68s1.35-1.06,1.94-1.5c2.38-1.77,3.91-2.61,4.3-2.26s-.39,1.87-2.19,4.37q-.68.93-1.54,2c-.6.72-1.3,1.44-2,2.23a55.67,55.67,0,0,1-5.34,5.13l-3.32,2.77c-1.17.95-2.49,1.79-3.81,2.73a89.12,89.12,0,0,1-8.83,5.42,103.88,103.88,0,0,1-22.17,8.5,103.87,103.87,0,0,1-23.57,2.85,89.14,89.14,0,0,1-10.34-.66c-1.61-.22-3.17-.34-4.64-.63l-4.23-.9a55.7,55.7,0,0,1-7.12-2c-1-.36-2-.66-2.85-1s-1.63-.75-2.32-1.09c-2.76-1.36-4.16-2.34-4-2.84s1.92-.47,4.86,0c.73.11,1.54.26,2.42.42s1.86.23,2.89.37c2.07.25,4.38.72,7,.86l4.06.38c1.41.13,2.89.1,4.41.17,3,.2,6.29,0,9.69-.06A127.74,127.74,0,0,0,167.43,170.51Z"/><path class="cls-12" d="M132.77,165a101.23,101.23,0,0,0,11.59-5.33c1.7-1,3.36-1.87,4.83-2.84.74-.47,1.49-.89,2.17-1.36l2-1.33c5-3.41,8.07-5.83,8.93-5.11.4.34.13,1.39-.74,3q-.33.61-.76,1.34c-.3.47-.67.95-1.06,1.47a32.16,32.16,0,0,1-2.84,3.38L155,160c-.64.63-1.36,1.21-2.09,1.85a54.7,54.7,0,0,1-4.91,3.75,60.59,60.59,0,0,1-26.34,9.87,54.62,54.62,0,0,1-6.16.4c-1,0-1.9,0-2.79,0l-2.57-.2a32.13,32.13,0,0,1-4.36-.68c-.64-.14-1.23-.26-1.76-.41s-1-.34-1.45-.5c-1.73-.66-2.62-1.27-2.54-1.8.17-1.11,4.09-1.32,10.09-2l2.35-.29c.81-.1,1.65-.27,2.52-.4,1.74-.23,3.58-.66,5.51-1A101.21,101.21,0,0,0,132.77,165Z"/><path class="cls-12" d="M72.26,253c-3.94-18.19-10.05-32.28-8.1-33.34.9-.48,3.66,2.5,6.83,8.12.79,1.41,1.62,3,2.4,4.69S75,236,75.75,238a99.8,99.8,0,0,1,4,13.3,99.82,99.82,0,0,1,2,13.73c.12,2.13.24,4.15.2,6.05s-.07,3.66-.19,5.27c-.5,6.44-1.74,10.3-2.76,10.25C76.78,286.49,76.37,271.13,72.26,253Z"/><path class="cls-12" d="M82.64,210.52c-.93-5.11-1.91-9.93-2.87-14.31-.52-2.17-1-4.26-1.47-6.19l-.69-2.81-.68-2.58c-1.72-6.58-2.86-10.76-1.87-11.26s3.8,3,6.94,9.37l1.19,2.53c.4.89.76,1.83,1.15,2.8.8,1.94,1.5,4.06,2.24,6.29a126.38,126.38,0,0,1,3.6,14.79,156.62,156.62,0,0,1,2.4,27.28c0,7-.65,11.34-1.7,11.43s-2.36-4.11-3.69-10.92S84.46,220.74,82.64,210.52Z"/><path class="cls-12" d="M344.09,154.54c1.54-2,2.91-4,4.14-5.82.58-.94,1.18-1.81,1.68-2.67s1-1.65,1.46-2.38c1.79-2.95,3.1-4.91,4.17-4.69s1.56,2.67.92,6.54a22.28,22.28,0,0,1-.74,3.1,30,30,0,0,1-1.27,3.44A34.57,34.57,0,0,1,344.2,165.2a30,30,0,0,1-3,2.07,22.28,22.28,0,0,1-2.83,1.48c-3.59,1.57-6.13,1.62-6.56.71s1.11-2.74,3.53-5.19c.6-.62,1.27-1.27,2-2s1.41-1.49,2.18-2.28C340.94,158.34,342.52,156.53,344.09,154.54Z"/><path class="cls-8" d="M53.84,333.37C68.95,322.28,75.23,303,79.9,284.86A691.24,691.24,0,0,0,99.31,169.51l91,27.16c10,3,20.12,6,30.54,6.38,26.17,1,49.73-14.31,74.25-23.5A165.16,165.16,0,0,1,370.19,170s7.5,121.7,48.83,164.47c.81,73-43.54,137.46-92.3,191.78-11.27,12.55-23,25.08-37.55,33.62L289,560a72.52,72.52,0,0,1-36.5,10.2l-29.86.15a71.65,71.65,0,0,1-36.73-9.91l-1-.56c-14.55-8.54-26.28-21.06-37.55-33.62C98.62,472,52.12,407.48,52.93,334.49"/><path class="cls-15" d="M366.79,83c3.56-9.19,4.7-18.51,5.61-25.39s1.67-11.38,3.11-11.5,3.15,4.16,4.11,11.49a63.11,63.11,0,0,1,.29,13.08,57.22,57.22,0,0,1-3.61,16A46.21,46.21,0,0,1,367.44,101a36.74,36.74,0,0,1-11,8.3,22.84,22.84,0,0,1-8.9,2.45c-2.21.06-3.45-.39-3.59-1.06-.32-1.48,3.72-3.27,8.61-7.49A48.83,48.83,0,0,0,360.21,95,53.81,53.81,0,0,0,366.79,83Z"/><path class="cls-15" d="M393.72,82.48c.87-4.87,1.17-9.75,1.81-13.49s1.62-6.21,3-6.35,2.93,2,4.17,5.79a32.63,32.63,0,0,1,1.39,6.9,33.45,33.45,0,0,1-.35,9,27.19,27.19,0,0,1-3.21,8.81,20.26,20.26,0,0,1-5.08,5.9,11.07,11.07,0,0,1-4.8,2.28c-1.31.2-2.17-.08-2.53-.67-.73-1.26.54-3.35,1.86-6.32A49.1,49.1,0,0,0,393.72,82.48Z"/><path class="cls-15" d="M363.5,116.33c3.72-2.45,7.13-4.62,9.92-6.06s5-2.06,6-1.12.74,3.29-1,6.3a32.08,32.08,0,0,1-21.71,14.25c-3.46.41-5.77-.25-6.18-1.58s1-3.12,3.44-5.1S359.77,118.77,363.5,116.33Z"/><path class="cls-15" d="M405.25,202a22.88,22.88,0,0,1,7.56-8.1c2.52-1.51,4.63-1.74,5.6-.75s.76,3-.12,5.45a57,57,0,0,1-4.2,8.5,57,57,0,0,1-5.26,7.89c-1.67,2-3.28,3.19-4.65,2.83s-2.2-2.28-2.16-5.22A22.88,22.88,0,0,1,405.25,202Z"/><path class="cls-11" d="M46.05,163.48a38.77,38.77,0,0,1,3.68-7.13,28.5,28.5,0,0,1,4.21-5c2.78-2.58,5.19-3.49,6.27-2.63s.8,3.3-.21,6.55-2.66,7.39-4.44,12-3.35,8.72-4.8,11.81-2.84,5.08-4.27,5-2.54-2.4-2.85-6.18a28.52,28.52,0,0,1,.3-6.56A38.81,38.81,0,0,1,46.05,163.48Z"/><path class="cls-11" d="M77.47,109.21a11.49,11.49,0,0,1,6.45-3c2-.16,3.51.49,4.17,1.73a4.9,4.9,0,0,1-.29,4.37,16,16,0,0,1-8.4,7.53,4.9,4.9,0,0,1-4.37-.18c-1.16-.79-1.64-2.38-1.27-4.33A11.49,11.49,0,0,1,77.47,109.21Z"/><ellipse class="cls-11" cx="210.56" cy="221.64" rx="5.11" ry="8.76" transform="translate(-22.94 418.97) rotate(-86.67)"/><path class="cls-9" d="M224.78,442.79h22.94"/><path class="cls-9" d="M20.87,340A35.55,35.55,0,0,1,42,316.79"/><path class="cls-9" d="M442.19,340A35.55,35.55,0,0,0,421,316.79"/><path class="cls-11" d="M36.71,359.23a58.7,58.7,0,0,1,4.48,7.36c1.06,2.29,1.34,4.25.37,5.29s-2.92,1-5.37-.08a19.33,19.33,0,0,1-8-6.91c-2.49-3.68-3.38-8-2.81-11.09a7,7,0,0,1,1.47-3.46,2.37,2.37,0,0,1,2.07-.95c1.42.21,2.44,1.71,3.61,3.43S35.05,356.75,36.71,359.23Z"/><path class="cls-3" d="M306.74,281.15a53.41,53.41,0,0,0-19.38,5.9c-4.86,2.45-8,4.52-9.27,3.52-.59-.47-.59-1.67.1-3.41a20.9,20.9,0,0,1,4.39-6.38,33.08,33.08,0,0,1,4-3.56,37.32,37.32,0,0,1,5.31-3.26,38.1,38.1,0,0,1,28.15-2.45,37.32,37.32,0,0,1,5.79,2.29,33.07,33.07,0,0,1,4.6,2.8,20.9,20.9,0,0,1,5.43,5.52c1,1.6,1.18,2.78.69,3.34-1.07,1.2-4.53-.29-9.74-1.86A53.41,53.41,0,0,0,306.74,281.15Z"/><path class="cls-9" d="M342.4,280.36a49.37,49.37,0,0,0-70.8,6.17"/><path class="cls-16" d="M264.12,323.48c12.85-5.69,25.89-11.31,39.71-13.84s28.68-1.72,41.06,4.94"/><path class="cls-17" d="M326.2,321.18a17.9,17.9,0,0,1-35.79,0c0-9.88,8-13.77,17.9-13.77S326.2,311.3,326.2,321.18Z"/><path class="cls-3" d="M167.36,281.15a53.41,53.41,0,0,1,19.38,5.9c4.86,2.45,8,4.52,9.27,3.52.59-.47.59-1.67-.1-3.41a20.9,20.9,0,0,0-4.39-6.38,33.08,33.08,0,0,0-4-3.56,37.32,37.32,0,0,0-5.31-3.26A38.1,38.1,0,0,0,154,271.51a37.32,37.32,0,0,0-5.79,2.29,33.07,33.07,0,0,0-4.6,2.8,20.9,20.9,0,0,0-5.43,5.52c-1,1.6-1.18,2.78-.69,3.34,1.07,1.2,4.53-.29,9.74-1.86A53.41,53.41,0,0,1,167.36,281.15Z"/><path class="cls-9" d="M131.69,280.36a49.37,49.37,0,0,1,70.8,6.17"/><path class="cls-16" d="M210,323.48c-12.85-5.69-25.89-11.31-39.71-13.84s-28.68-1.72-41.06,4.94"/><path class="cls-17" d="M147.9,321.18a17.9,17.9,0,0,0,35.79,0c0-9.88-8-13.77-17.9-13.77S147.9,311.3,147.9,321.18Z"/><path class="cls-9" d="M206,498.28A59.24,59.24,0,0,0,236,503c14.26-1.51,29.15-10,32.35-24"/><circle class="cls-2" cx="237.17" cy="528.6" r="10.55" transform="translate(-329.15 406.34) rotate(-53.65)"/></g></g></svg>
\ No newline at end of file
此差异已折叠。
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 586.2 682.51"><defs><style>.cls-1{fill:#dfe7ea;}.cls-2{fill:#b0d7e9;}.cls-3{fill:#54b9d3;}.cls-4{fill:#f2c7a5;}.cls-20,.cls-5{opacity:0.5;}.cls-6{fill:#ffac89;}.cls-14,.cls-7{fill:none;stroke-miterlimit:10;stroke-width:10px;}.cls-7{stroke:#274b5b;}.cls-20,.cls-8{fill:#ef997b;}.cls-9{fill:#fcdac3;}.cls-10{fill:#fff;}.cls-11{fill:#274b5b;}.cls-12{fill:#3b535c;}.cls-13{fill:#d9edf4;}.cls-14{stroke:#42565e;stroke-linecap:round;}.cls-15{fill:#ebcbac;}.cls-16{fill:#d7ad8c;}.cls-17{fill:#3f565e;}.cls-18{fill:#f2dcca;}.cls-19{fill:#ce956e;}</style></defs><title>Asset 100</title><g id="Layer_2" data-name="Layer 2"><g id="Layer_1-2" data-name="Layer 1"><ellipse class="cls-1" cx="289.02" cy="618.52" rx="184.33" ry="54.22"/><path class="cls-2" d="M518.48,204.9l16.76,4.24,42.08,10.65a7.19,7.19,0,0,1,2.5,12.76L516.64,279a7.19,7.19,0,0,0-.88,10.82l54.39,55.65a7.19,7.19,0,0,1-1.52,11.23l-60.92,35.54a7.19,7.19,0,0,0-3,9l23.9,56.16a7.19,7.19,0,0,1-7.12,10L448.38,459l-305.16,3.1L67.8,467.44a7.19,7.19,0,0,1-7.12-10l23.9-56.16a7.19,7.19,0,0,0-3-9L20.67,356.73a7.19,7.19,0,0,1-1.52-11.23l54.39-55.65A7.19,7.19,0,0,0,72.65,279L9.48,232.55A7.19,7.19,0,0,1,12,219.79l44.73-11.32,23.55-6L125.78,191,90.1,107.72A7.19,7.19,0,0,1,98.83,98l119.89,37.21L233.83,14.4a7.19,7.19,0,0,1,13.82-1.75l45.43,114.84"/><path class="cls-2" d="M492,198.21,463.51,191l35.69-83.27a7.19,7.19,0,0,0-8.74-9.7L370.57,135.23l-6.09-48.76-3.73-29.86L355.46,14.4a7.19,7.19,0,0,0-13.82-1.75L296.22,127.48l-7.39,3.1"/><path class="cls-3" d="M233,368q0,46-1.73,92l-86.5.88-75.42,5.37a7.2,7.2,0,0,1-7.13-10l23.9-56.17a7.17,7.17,0,0,0-3-9L22.21,355.52a7.2,7.2,0,0,1-1.52-11.25l54.39-55.64a7.18,7.18,0,0,0-.88-10.81L11,231.34a7.19,7.19,0,0,1,2.49-12.76l44.74-11.32,23.56-5.95,45.51-11.52L91.64,106.5a7.19,7.19,0,0,1,8.75-9.7L142,109.72c-2,20.85-.12,41.93,7.5,61.34,3.36,8.54,7.81,16.73,10,25.65,4.38,18.17-1.25,37.39-10,53.89s-20.63,31.17-30.05,47.31c-5.36,9.22-10,19.27-10.24,29.93s5,22,14.75,26.29c14.89,6.55,31.1-5.22,42.57-16.76S192,312.6,207.88,316c10.25,2.17,18,11.15,21.52,21S233,357.54,233,368Z"/><circle class="cls-4" cx="145.54" cy="410.18" r="47.25"/><g class="cls-5"><path class="cls-6" d="M162,452.3a47.25,47.25,0,1,1-18-90.91,48.21,48.21,0,0,1,6.74.48A47.25,47.25,0,0,0,162,452.3Z"/></g><circle class="cls-7" cx="144" cy="410.18" r="47.25"/><circle class="cls-4" cx="439.86" cy="410.18" r="47.25"/><g class="cls-5"><path class="cls-6" d="M423.36,452.3a47.25,47.25,0,1,0,18-90.91,48.21,48.21,0,0,0-6.74.48,47.25,47.25,0,0,1-11.31,90.43Z"/></g><circle class="cls-7" cx="441.41" cy="410.18" r="47.25"/><path class="cls-4" d="M174.94,538q-4.07-6.33-7.72-13.08c-16.85-31.19-26.7-68.82-26.7-109.33,0-107.79,69.7-195.18,155.68-195.18S451.87,307.81,451.87,415.6,382.17,610.78,296.2,610.78c-39.91,0-76.31-18.83-103.86-49.78"/><g class="cls-5"><path class="cls-8" d="M312.5,609.72a126,126,0,0,1-16.3,1.05c-39.92,0-76.32-18.82-103.86-49.79l-17.4-23q-4.09-6.34-7.73-13.09c-16.85-31.2-26.69-68.82-26.69-109.33,0-107.8,69.69-195.18,155.68-195.18a125.57,125.57,0,0,1,16.26,1.05c-78.33,10.19-139.41,93.2-139.41,194.12,0,40.51,9.84,78.13,26.69,109.33q3.65,6.74,7.73,13.09l17.4,23C248.63,587.7,279,605.37,312.5,609.72Z"/></g><g class="cls-5"><path class="cls-9" d="M278.39,608.72a126,126,0,0,0,16.3,1.05C334.6,609.78,371,591,398.55,560l17.4-23q4.09-6.34,7.73-13.09c16.85-31.2,26.69-68.82,26.69-109.33,0-107.8-69.69-195.18-155.68-195.18a125.57,125.57,0,0,0-16.26,1.05c78.33,10.19,139.41,93.2,139.41,194.12,0,40.51-9.84,78.13-26.69,109.33q-3.65,6.74-7.73,13.09L366,560C342.25,586.7,311.91,604.37,278.39,608.72Z"/></g><path class="cls-7" d="M416.2,294.56c20.42,33,32.58,74.47,32.58,119.49,0,107.79-69.7,195.18-155.68,195.18-39.91,0-76.31-18.83-103.86-49.78"/><path class="cls-7" d="M386.26,257.67a174,174,0,0,1,17.85,19.56"/><path class="cls-7" d="M171.84,536.47q-4.07-6.33-7.72-13.08c-16.85-31.19-26.7-68.82-26.7-109.33,0-107.79,69.7-195.18,155.68-195.18,25.65,0,49.85,7.78,71.19,21.55"/><path class="cls-10" d="M281.08,387.72a43.37,43.37,0,0,1-86.75,0"/><path class="cls-1" d="M279.21,387.62a43.37,43.37,0,1,1-86.75,0h1.36a43.39,43.39,0,0,0,84,0Z"/><path class="cls-7" d="M278,387.72a43.37,43.37,0,0,1-86.75,0"/><circle class="cls-11" cx="233.06" cy="401.66" r="10.84"/><circle class="cls-10" cx="245.46" cy="398.56" r="7.75"/><path class="cls-10" d="M403.46,387.72a43.37,43.37,0,0,1-86.75,0"/><path class="cls-1" d="M400,387.62a43.37,43.37,0,0,1-86.75,0h1.36a43.39,43.39,0,0,0,84,0Z"/><path class="cls-7" d="M400.36,387.72a43.37,43.37,0,1,1-86.75,0"/><circle class="cls-11" cx="355.44" cy="401.66" r="10.84"/><circle class="cls-10" cx="367.83" cy="398.56" r="7.75"/><path class="cls-12" d="M108.89,340.21a50,50,0,0,1-1.71-8.58,50.56,50.56,0,0,1-.16-8.11,45.27,45.27,0,0,1,2.89-13.28,31.43,31.43,0,0,1,4.37-8c1.36-1.67,2.38-2.4,2.82-2.14,1,.57-.72,4.78-2,11.6a62,62,0,0,0-1,12,59.64,59.64,0,0,0,.55,7,55.64,55.64,0,0,0,1.6,7.31c.4,1.21.76,2.43,1.21,3.58a27,27,0,0,0,1.43,3.15,13.38,13.38,0,0,0,1.74,2.56l.47.58.53.52a9.35,9.35,0,0,0,1.1,1,27.49,27.49,0,0,0,10.2,4.72c3.33.91,6.22,1.44,8.21,2s3.12,1,3.11,1.58-1.15,1-3.23,1.39a36.81,36.81,0,0,1-9,.37,31.7,31.7,0,0,1-6.37-1.1,24,24,0,0,1-7.12-3.28,14.79,14.79,0,0,1-1.73-1.33l-.85-.74-.78-.82a19.33,19.33,0,0,1-2.78-3.69,30.37,30.37,0,0,1-2-4.07C109.8,343.06,109.36,341.65,108.89,340.21Z"/><path class="cls-12" d="M137.29,260.49C144,249.27,149.5,240,151.5,240.83c1,.4.82,3.3-.45,7.63a78.09,78.09,0,0,1-17.71,29.88c-3.19,3.19-5.66,4.71-6.48,4.06C125.2,281,130.66,271.75,137.29,260.49Z"/><path class="cls-12" d="M150.36,180c-3.32-14-7.15-25.25-5.2-26.23.93-.45,3.15,1.86,5.66,6.22a75.14,75.14,0,0,1,9.05,37.63c-.25,5-1.17,8.09-2.21,8.11C155.48,205.77,153.78,194,150.36,180Z"/><path class="cls-2" d="M444.61,469.61c26,26,14.79,78.17,15.55,115l-11.74-13a126.89,126.89,0,0,1-30.82,61.49,45.3,45.3,0,0,0-14.28-15.73,95.16,95.16,0,0,1-29.43,50.17,38.29,38.29,0,0,0-1.09-31.66,60.36,60.36,0,0,1-33,36.69,24.83,24.83,0,0,0,2.7-23.94c-12,20.29-46.33,20.91-59,1.06-.88,4-.23,9.28,3.86,9.62-17.23,2.65-33-4.61-44.86-17.39a29,29,0,0,0,9.61,18.79,52.63,52.63,0,0,1-43.78-29.08c-22.23,1.38-44.43-13.85-51.15-35.09a10.63,10.63,0,0,1-2.77,10.18C116,587.24,118.1,499.8,143.26,471c0,0,43.88,33.13,85.07,32.88,25.75-.15,55.88-19.8,85.76-19.93,25-.11,35.94,34.12,52,19.06C408.52,463.13,444.07,469.07,444.61,469.61Z"/><path class="cls-3" d="M461,579.41l-11.74-13a127,127,0,0,1-30.82,61.5,45.32,45.32,0,0,0-14.28-15.73,95.26,95.26,0,0,1-29.43,50.18,38.33,38.33,0,0,0-1.08-31.66,60.34,60.34,0,0,1-33,36.69,24.83,24.83,0,0,0,2.69-23.94c-12,20.3-46.33,20.91-59,1.07-.88,4,.12,18.77,4.22,19.12-17.23,2.65-33.36-14.1-45.22-26.89.68,7.17,2.47,20.1,7.87,24.85-18.36-.94-34.06-18.58-42.05-35.14-22.23,1.39-44.43-13.85-51.15-35.09a10.63,10.63,0,0,1-2.76,10.18c-13.27-6.74-22-21.38-26.76-38.85,17,12.38,37,20.88,56.73,28.49,13.42,5.16,27,10.08,41.15,12.66,13.72,2.49,27.74,2.75,41.69,3,38.71.67,79,1,114-15.61,10-4.76,20.61-12.93,20.26-24-.4-12.69-14.29-19.93-26.14-24.48,25.24-3.74,45.92-23.31,57.43-46.07a140.7,140.7,0,0,0,10.14-27.06l3.39,2.64C453.92,508.44,460.27,542.6,461,579.41Z"/><path class="cls-13" d="M279.44,484.79l-51.11,19.06-84.11-38.17a63.86,63.86,0,0,0-12.41,22,243.36,243.36,0,0,1,51,18,250.66,250.66,0,0,1,23.32,12.64c4.12,2.52,12.77,10.78,17.87,10.15a10.52,10.52,0,0,0,4.23-1.9c46.77-30.08,81.11-31.4,135.95-21.6l-25.77-15Z"/><path class="cls-14" d="M443.74,469.61C461,504.23,464.64,541.56,461,581.14l-11.74-13a126.89,126.89,0,0,1-30.82,61.49,45.3,45.3,0,0,0-14.28-15.73,95.16,95.16,0,0,1-29.43,50.17,38.29,38.29,0,0,0-1.09-31.66,60.36,60.36,0,0,1-33,36.69,24.83,24.83,0,0,0,2.7-23.94c-12,20.29-46.33,20.91-59,1.06-.88,4,6,20,2.13,21.75-17-7.82-31.27-16.74-43.13-29.52.69,7.17,2.46,21,7.87,25.72-18.36-.94-34.06-19.45-42.05-36-22.23,1.38-44.43-13.85-51.15-35.09a10.63,10.63,0,0,1-2.77,10.18c-38.41-19.5-36.36-105.21-11.2-134"/><path class="cls-15" d="M261.78,573.43a10.43,10.43,0,0,1-10.4-10.4V523.29a10.43,10.43,0,0,1,10.4-10.4h72.77a10.43,10.43,0,0,1,10.4,10.4V563a10.43,10.43,0,0,1-10.4,10.4"/><path class="cls-16" d="M346.68,527.62v12.33a10.43,10.43,0,0,0-9.53-6.26H264.38a10.43,10.43,0,0,0-10.4,10.4V571.5a10.29,10.29,0,0,1-.87-4.13V527.62a10.43,10.43,0,0,1,10.4-10.4h72.77A10.43,10.43,0,0,1,346.68,527.62Z"/><path class="cls-17" d="M297.73,509.18c7.51,0,14.84.05,21.92.16l10.42.19,2.54.06,1.26,0h.36l.53,0,1.06.08a17.57,17.57,0,0,1,7.76,2.86,17.26,17.26,0,0,1,7.6,13.23l0,1v.76l0,1.14-.09,2.26-.2,4.41c-.28,5.79-.59,11.18-.94,16.1s-.73,9.37-1.13,13.28l-.15,1.44-.19,1.61a13.71,13.71,0,0,1-.95,3.46,13,13,0,0,1-3.6,4.84,10.45,10.45,0,0,1-7.27,2.58c-1.75-.16-2.53-.78-2.52-1.27s.76-1,1.87-1.75a11.19,11.19,0,0,0,3.55-3.62,8,8,0,0,0,1-3,7.12,7.12,0,0,0,0-1.68l-.29-2.61c-.41-3.91-.79-8.36-1.13-13.28s-.66-10.31-.94-16.1l-.2-4.41-.09-2.26,0-1.14v-.29l0-.11a2,2,0,0,1,0-.2,3.62,3.62,0,0,0-1.85-2.5,3.46,3.46,0,0,0-1.47-.38l-4.35.1-10.42.19c-7.08.1-14.41.16-21.92.16s-14.84-.05-21.92-.16l-10.42-.19-4.35-.1a3.46,3.46,0,0,0-1.47.38,3.62,3.62,0,0,0-1.86,2.5,2,2,0,0,1,0,.2l0,.11v.29l0,1.14-.09,2.26-.2,4.41c-.28,5.79-.59,11.18-.94,16.1s-.73,9.37-1.13,13.28l-.29,2.61a7.13,7.13,0,0,0,0,1.68,8,8,0,0,0,1,3,11.2,11.2,0,0,0,3.55,3.62c1.1.73,1.87,1.19,1.87,1.75s-.78,1.11-2.52,1.27a10.45,10.45,0,0,1-7.27-2.58,13,13,0,0,1-3.6-4.84,13.71,13.71,0,0,1-.95-3.46l-.19-1.61-.15-1.44c-.41-3.91-.79-8.36-1.13-13.28s-.66-10.31-.94-16.1l-.2-4.41-.09-2.26,0-1.14v-.76l0-1a17.26,17.26,0,0,1,7.6-13.23,17.57,17.57,0,0,1,7.76-2.86l1.06-.08.53,0h.36l1.26,0,2.54-.06,10.42-.19C282.89,509.23,290.22,509.18,297.73,509.18Z"/><path class="cls-17" d="M302.86,552.58a54.43,54.43,0,0,0,5.71-1.73,48,48,0,0,0,5-2.23,39.67,39.67,0,0,0,7.71-5.1c2-1.73,3.52-3.4,4.81-4.61s2.25-2,3.11-1.78,1.44,1.34,1.56,3.45a17.79,17.79,0,0,1-2.29,8.39,29.29,29.29,0,0,1-8.6,9.58,38.08,38.08,0,0,1-6.48,3.82,42.55,42.55,0,0,1-7.57,2.62c-1.33.33-2.67.56-4,.77s-2.65.32-3.9.37a47.38,47.38,0,0,1-7.23-.2A41.23,41.23,0,0,1,279,563a23.64,23.64,0,0,1-7-4.26c-1.44-1.37-2-2.56-1.64-3.35.75-1.65,4.79-1.39,10.66-1.18,2.94.11,6.36.18,10.08,0,1.86-.1,3.8-.26,5.79-.51,1-.11,2-.3,2.95-.45S301.87,552.83,302.86,552.58Z"/><path class="cls-17" d="M155.46,490.33A39.37,39.37,0,0,0,156,500a41,41,0,0,0,3.15,9.52,42.44,42.44,0,0,1-5.84-8.6,43.67,43.67,0,0,1-3.52-10.15,47.59,47.59,0,0,1-1-11c0-.93.08-1.86.14-2.79s.15-1.87.31-2.81a36.46,36.46,0,0,1,1.21-5.8l10.41,4.56a25.27,25.27,0,0,0-2,3.8c-.33.69-.58,1.41-.87,2.12l-.76,2.2A40.47,40.47,0,0,0,155.46,490.33Z"/><path class="cls-17" d="M171.41,499.11c.85,7.6,4.25,15.18,9.15,21.74a48.54,48.54,0,0,1-14.67-20.41,39.56,39.56,0,0,1-2.34-13.25,35.77,35.77,0,0,1,2.72-13.91l10,5.38C172.32,484,170.54,491.58,171.41,499.11Z"/><path class="cls-17" d="M200.42,504.82a52.28,52.28,0,0,0,7.09,20.82,55.13,55.13,0,0,1-12.6-19.43,57.85,57.85,0,0,1-3.79-24l11.2,1.92A49.27,49.27,0,0,0,200.42,504.82Z"/><path class="cls-17" d="M389.49,500.65a28,28,0,0,1-.29,9c-.5,2.28-1.27,3.62-2,3.56-1.43-.14-2-5.52-2.82-12S383,489.45,384.35,489c.66-.22,1.72.9,2.74,3A28,28,0,0,1,389.49,500.65Z"/><path class="cls-17" d="M413.62,499.69a36.83,36.83,0,0,1-2.43,12.46c-1.23,3-2.53,4.66-3.17,4.43-1.37-.52.31-7.91.5-17s-1-16.59.39-17c.65-.19,1.87,1.5,2.94,4.59A36.83,36.83,0,0,1,413.62,499.69Z"/><path class="cls-17" d="M436.93,497a55.34,55.34,0,0,1,.52,9.45,45.63,45.63,0,0,1-.89,7.66c-.91,4.3-2.14,6.77-2.8,6.63-1.47-.31,0-10.64-1.89-23s-5.89-22-4.54-22.67c.6-.31,2.44,1.74,4.48,5.63a47.93,47.93,0,0,1,3,7.1A57.59,57.59,0,0,1,436.93,497Z"/><path class="cls-17" d="M164.59,595.73a42.25,42.25,0,0,1-.27-8.85,35.84,35.84,0,0,1,.53-3.82,26.8,26.8,0,0,1,.8-3.26c1.21-3.93,2.72-6,3.34-5.81s.45,2.69.21,6.47c-.06.95-.13,2-.14,3.08s0,2.28,0,3.51a62.81,62.81,0,0,0,2.26,15.79c.35,1.18.65,2.32,1,3.36s.68,2,1,2.92c1.29,3.56,2.22,5.84,1.61,6.27s-2.57-1.21-4.84-4.65a26.73,26.73,0,0,1-1.68-2.91,35.79,35.79,0,0,1-1.58-3.52A42.25,42.25,0,0,1,164.59,595.73Z"/><path class="cls-17" d="M197.49,609.93a54.89,54.89,0,0,1-.09-14.27c.47-3.6,1.18-5.78,1.87-5.77s1.28,2.24,1.74,5.77.81,8.37,1.53,13.54c.38,2.58.84,5,1.34,7.18.3,1.07.52,2.12.83,3.06l.4,1.38.43,1.26c1.09,3.22,2,5.28,1.36,5.73s-2.5-1-4.6-4.13l-.79-1.26c-.25-.45-.49-.93-.74-1.43a32.2,32.2,0,0,1-1.4-3.26A42.34,42.34,0,0,1,197.49,609.93Z"/><path class="cls-17" d="M236.71,616.79c-4.33-15.35-4.94-28.35-3.58-28.52s4.28,12.17,8.5,27.14,8.17,27,6.83,27.61S241,632.15,236.71,616.79Z"/><path class="cls-17" d="M346.34,623.13c1.94-6.48,3.3-12.56,4.5-17s2.2-7.12,2.9-7,.94,3,.66,7.6a81.29,81.29,0,0,1-3.17,17.86,60.46,60.46,0,0,1-3.75,9.43c-.76,1.38-1.45,2.7-2.24,3.86-.39.58-.75,1.15-1.13,1.68l-1.15,1.47c-3,3.7-5.58,5.28-6,4.83s1-2.91,3-6.82l.8-1.53.8-1.69c.58-1.15,1.08-2.45,1.67-3.76C344.27,629.38,345.35,626.36,346.34,623.13Z"/><path class="cls-17" d="M376.89,610.42c1.38-7.88,2.09-15.29,3-20.62s1.84-8.6,2.54-8.54,1.06,3.43,1.06,8.84a126.52,126.52,0,0,1-1.62,21.21,61.86,61.86,0,0,1-3.15,11.54,43.31,43.31,0,0,1-4.52,8.74c-3.21,4.66-6.17,6.64-6.63,6.19s1.33-3.26,3.49-8a69.42,69.42,0,0,0,3.21-8.5A91.9,91.9,0,0,0,376.89,610.42Z"/><path class="cls-17" d="M414,597.91c1.53-6.39,2.57-12.34,3.55-16.65s1.85-7,2.56-6.92,1.08,2.86,1,7.33a81.07,81.07,0,0,1-2.17,17.44,61.49,61.49,0,0,1-3.08,9.33c-.64,1.38-1.22,2.7-1.91,3.87-.33.59-.64,1.16-1,1.7l-1,1.51c-2.65,3.79-5,5.54-5.48,5.13s.65-2.93,2.32-6.87l.65-1.55.65-1.7c.48-1.16.88-2.44,1.36-3.77C412.32,604.08,413.18,601.1,414,597.91Z"/><path class="cls-17" d="M424.42,588.28c1.66-4,3-8,4.13-11.62.51-1.83,1.05-3.56,1.44-5.21s.79-3.18,1.12-4.59c1.28-5.65,2-9.25,2.7-9.22s1.27,3.73.87,9.75c-.11,1.5-.26,3.15-.54,4.9s-.63,3.62-1,5.57a78.08,78.08,0,0,1-9.93,23.93c-1.09,1.67-2.12,3.27-3.21,4.67s-2.1,2.71-3.09,3.84c-4,4.54-7,6.72-7.52,6.27s1.53-3.53,4.62-8.43c.77-1.23,1.62-2.56,2.46-4s1.74-3,2.67-4.7C420.89,596.06,422.73,592.32,424.42,588.28Z"/><path class="cls-18" d="M137,509.24c.76-3.74,2.77-6.36,4.11-5.94s1.6,3.5.9,7-2.17,6.21-3.58,6.05S136.26,513,137,509.24Z"/><path class="cls-18" d="M138.33,549.64a54.36,54.36,0,0,1-1.95-15.24c.12-3.95.78-6.35,1.46-6.36,1.47,0,2.42,9.33,5.42,20.26s6.83,19.45,5.58,20.21c-.59.34-2.39-1.39-4.5-4.73A53.49,53.49,0,0,1,138.33,549.64Z"/><path class="cls-14" d="M442.82,467.33A165.7,165.7,0,0,0,371,498.45c-3.11,2.36-6.43,4.93-10.32,5.07-4.14.15-7.78-2.48-11.25-4.75a88.22,88.22,0,0,0-21-10.34c-7.89-2.54-16.26-3.27-24.5-3.47s-16.56-.42-24.68.2a82.67,82.67,0,0,0-20.63,4.06,87.16,87.16,0,0,0-19.26,9.55c-3.47,2.26-7.11,4.89-11.25,4.75-3.9-.14-7.22-2.72-10.32-5.07a165.7,165.7,0,0,0-71.82-31.12"/><line class="cls-19" x1="228.33" y1="503.85" x2="263.97" y2="487.62"/><path class="cls-3" d="M219.34,122.68a55.94,55.94,0,0,1,29.93,12.77c.6-22.61-11.09-43.51-22.43-63.08A20.72,20.72,0,0,1,250,76.94a162.61,162.61,0,0,0-14.86-54.86c-4.94,2.27-6.38,8.48-7.16,13.85a673.21,673.21,0,0,0-6.9,86.47"/><path class="cls-12" d="M248.91,75a148.5,148.5,0,0,1,16.63,15.51,144.21,144.21,0,0,0-20.85-8.11,139.78,139.78,0,0,0-21.24-4.65l6.15-15.9A152.75,152.75,0,0,1,248.91,75Z"/><path class="cls-12" d="M246.73,129.61c7.6,7.08,14.49,15.09,19.26,24-7.16-7.34-15.61-12.79-24.45-17.26s-18.17-8-27.69-11.66l8.85-14.58C230.8,116.24,239.12,122.51,246.73,129.61Z"/><path class="cls-12" d="M41.67,334.64c5.88-2.52,11.18-5.31,15.27-7.08s6.9-2.54,7.48-1.65-1.16,3.21-4.57,6.22a58.45,58.45,0,0,1-15.18,9.57c-6.61,2.85-13.35,3.82-18.13,3.34s-7.5-2-7.33-3,2.94-1.5,7-2.42A86.51,86.51,0,0,0,41.67,334.64Z"/><path class="cls-3" d="M292,123.06A73,73,0,0,1,312.67,143a111.15,111.15,0,0,0,10.74-54.92l7.34,11.35A218.87,218.87,0,0,0,342,35.73c.18-6.89-.08-14.2-3.84-20a574.49,574.49,0,0,0-39.41,98"/><path class="cls-12" d="M329.81,92.79a148.49,148.49,0,0,1,8.38,21.15,144.21,144.21,0,0,0-15.36-16.27,139.76,139.76,0,0,0-17.2-13.31L318,72.64A152.73,152.73,0,0,1,329.81,92.79Z"/><path class="cls-12" d="M314.81,132.79a148.49,148.49,0,0,1,8.38,21.15,144.21,144.21,0,0,0-15.36-16.27,139.76,139.76,0,0,0-17.2-13.31L303,112.64A152.73,152.73,0,0,1,314.81,132.79Z"/><path class="cls-3" d="M400,125.72l3.05,20.6a98.07,98.07,0,0,0,40.39-35,165.29,165.29,0,0,1,1.82,34.87c18.29-2.58,31.49-18.24,42.86-32.79,3.7-4.74,7.52-9.73,8.59-15.65"/><path class="cls-12" d="M405.83,140.91a148.49,148.49,0,0,1-4.13,22.37,144.24,144.24,0,0,0-4.38-21.94,139.8,139.8,0,0,0-7.51-20.41l16.71-3.37A152.75,152.75,0,0,1,405.83,140.91Z"/><path class="cls-12" d="M448.83,134.91a148.49,148.49,0,0,1-4.13,22.37,144.24,144.24,0,0,0-4.38-21.94,139.8,139.8,0,0,0-7.51-20.41l16.71-3.37A152.75,152.75,0,0,1,448.83,134.91Z"/><path class="cls-3" d="M464.55,183.7a38,38,0,0,1-28.72,20.79c5,2.49,10.14,5,15.66,6,10.25,1.84,20.63-1.73,30.28-5.63,2.76-1.11,5.91-2.76,6.27-5.71.26-2.14-1.18-4.2-3-5.33a17.78,17.78,0,0,0-6.15-1.91c-5.36-1-11-2.31-14.88-6.17"/><path class="cls-3" d="M549.55,205.7a38,38,0,0,1-28.72,20.79c5,2.49,10.14,5,15.66,6,10.25,1.84,20.63-1.73,30.28-5.63,2.76-1.11,5.91-2.76,6.27-5.71.26-2.14-1.18-4.2-3-5.33a17.78,17.78,0,0,0-6.15-1.91c-5.36-1-11-2.31-14.88-6.17"/><path class="cls-12" d="M448.64,203.38a148.49,148.49,0,0,1-22,5.87,144.21,144.21,0,0,0,17.94-13.38,139.79,139.79,0,0,0,15.21-15.54L470,194A152.72,152.72,0,0,1,448.64,203.38Z"/><path class="cls-7" d="M78.71,199.41l45.52-11.52L88.55,104.62a7.19,7.19,0,0,1,8.74-9.7l119.89,37.21L232.28,11.3A7.19,7.19,0,0,1,246.1,9.55l46.43,116.84"/><path class="cls-7" d="M38.24,364.79,19.12,353.64A7.19,7.19,0,0,1,17.6,342.4L72,286.75a7.19,7.19,0,0,0-.88-10.82L7.93,229.45a7.19,7.19,0,0,1,2.5-12.76l44.73-11.32"/><path class="cls-7" d="M141.67,459l-75.42,5.37a7.19,7.19,0,0,1-7.12-10L83,398.2a7.19,7.19,0,0,0-3-9L53.83,373.89"/><path class="cls-7" d="M359.19,53.51,353.92,11.3A7.19,7.19,0,0,0,340.1,9.55L292.67,126.39"/><path class="cls-7" d="M490.47,195.11,462,187.9l35.69-83.27a7.19,7.19,0,0,0-8.74-9.7L369,132.13l-6.09-48.76"/><path class="cls-7" d="M511.25,417.2l-8.09-19a7.19,7.19,0,0,1,3-9l60.92-35.54a7.19,7.19,0,0,0,1.52-11.23l-54.39-55.65a7.19,7.19,0,0,1,.88-10.82l63.17-46.49a7.19,7.19,0,0,0-2.5-12.76L533.69,206l-16.76-4.24"/><path class="cls-7" d="M446.83,455.88l73.12,8.47a7.19,7.19,0,0,0,7.12-10l-7.48-17.57"/><path class="cls-12" d="M530.64,225.38a148.49,148.49,0,0,1-22,5.87,144.21,144.21,0,0,0,17.94-13.38,139.79,139.79,0,0,0,15.21-15.54L552,216A152.72,152.72,0,0,1,530.64,225.38Z"/><path class="cls-10" d="M350.55,248.54a42,42,0,0,1,7.24,3.77,31.91,31.91,0,0,1,5.16,4.21c2.66,2.74,3.69,5,3,5.76s-2.95.06-6.13-1.33l-5.47-2.47c-2-.9-4.28-1.87-6.65-2.83s-4.67-1.77-6.77-2.52l-5.67-2c-3.27-1.17-5.41-2.17-5.36-3.25s2.34-2,6.15-2.11a31.91,31.91,0,0,1,6.64.5A41.94,41.94,0,0,1,350.55,248.54Z"/><path class="cls-10" d="M387.87,278.37a26.41,26.41,0,0,1,4.24,10.33c.43,2.88,0,4.8-1,5.11s-2.39-1-4-3-3.49-5-5.6-8.13-4.06-6-5.38-8.27-2-4-1.3-4.85,2.6-.49,5.11,1A26.41,26.41,0,0,1,387.87,278.37Z"/><path class="cls-10" d="M513.06,362.54c7.17-4.16,14-5.44,14.87-3.54s-4.19,6.2-11,10.17-13.09,6.23-14.32,4.49S505.88,366.68,513.06,362.54Z"/><ellipse class="cls-10" cx="543.85" cy="350.52" rx="5.22" ry="3.83" transform="translate(-99.25 279.43) rotate(-26.49)"/><ellipse class="cls-10" cx="513.36" cy="253.47" rx="11.08" ry="3.83" transform="translate(-32.22 427.05) rotate(-43.93)"/><path class="cls-10" d="M222.9,474a12.54,12.54,0,0,1,6.13,4.21c1.17,1.61,1.35,3.07.67,3.86s-2.05.89-3.66.66a45.65,45.65,0,0,1-10.88-3.6c-1.43-.77-2.48-1.64-2.55-2.71s.94-2.1,2.84-2.7A12.54,12.54,0,0,1,222.9,474Z"/><path class="cls-10" d="M262.35,467.89a49.09,49.09,0,0,1,8.52-.84,37.07,37.07,0,0,1,7,.59c3.93.75,6.21,2,6.1,3s-2.51,1.75-6.16,2.39c-1.83.31-4,.66-6.35,1s-4.94.82-7.64,1.33-5.25,1.08-7.59,1.58-4.46,1-6.28,1.38c-3.63.75-6.11,1-6.61.05s1.17-2.92,4.55-5.06a37.07,37.07,0,0,1,6.26-3.12A49.09,49.09,0,0,1,262.35,467.89Z"/><rect class="cls-20" x="312.3" y="359.24" width="89" height="10"/><line class="cls-7" x1="312.3" y1="359.24" x2="401.3" y2="359.24"/><rect class="cls-20" x="187.3" y="359.24" width="89" height="10"/><line class="cls-7" x1="187.3" y1="359.24" x2="276.3" y2="359.24"/><path class="cls-7" d="M113.3,415.55a22.64,22.64,0,0,1,23-12.58"/><path class="cls-7" d="M473.26,415.55a22.64,22.64,0,0,0-23-12.58"/></g></g></svg>
\ No newline at end of file
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 445 271.8"><defs><style>.cls-1{fill:#32caf8;}.cls-2{fill:#00aaf8;opacity:0.5;}.cls-3{fill:#fff;}.cls-4{fill:#426572;}</style></defs><title>Asset 500</title><g id="Layer_2" data-name="Layer 2"><g id="Layer_1-2" data-name="Layer 1"><rect class="cls-1" x="6" y="8.17" width="433" height="259.8" rx="12" ry="12"/><path class="cls-2" d="M439,21.16V255a13,13,0,0,1-13,13H28.72l381-259.8H426A13,13,0,0,1,439,21.16Z"/><path class="cls-3" d="M328,33.24h88.92c3.86,0,3.87-6,0-6H328c-3.86,0-3.87,6,0,6Z"/><path class="cls-3" d="M283.49,33.24H312.6c3.86,0,3.87-6,0-6H283.49c-3.86,0-3.87,6,0,6Z"/><path class="cls-4" d="M427,271.8H18a18,18,0,0,1-18-18V18A18,18,0,0,1,18,0H427a18,18,0,0,1,18,18V253.8A18,18,0,0,1,427,271.8ZM18,12a6,6,0,0,0-6,6V253.8a6,6,0,0,0,6,6H427a6,6,0,0,0,6-6V18a6,6,0,0,0-6-6Z"/><rect class="cls-4" x="37.89" y="125.08" width="12" height="20.57"/><rect class="cls-4" x="55.93" y="125.08" width="12" height="20.57"/><rect class="cls-4" x="73.97" y="125.08" width="12" height="20.57"/><rect class="cls-4" x="92.01" y="125.08" width="12" height="20.57"/><rect class="cls-4" x="118.71" y="125.08" width="12" height="20.57"/><rect class="cls-4" x="136.76" y="125.08" width="12" height="20.57"/><rect class="cls-4" x="154.8" y="125.08" width="12" height="20.57"/><rect class="cls-4" x="172.84" y="125.08" width="12" height="20.57"/><rect class="cls-4" x="199.54" y="125.08" width="12" height="20.57"/><rect class="cls-4" x="217.58" y="125.08" width="12" height="20.57"/><rect class="cls-4" x="235.63" y="125.08" width="12" height="20.57"/><rect class="cls-4" x="253.67" y="125.08" width="12" height="20.57"/><rect class="cls-4" x="280.37" y="125.08" width="12" height="20.57"/><rect class="cls-4" x="298.41" y="125.08" width="12" height="20.57"/><rect class="cls-4" x="316.45" y="125.08" width="12" height="20.57"/><rect class="cls-4" x="334.49" y="125.08" width="12" height="20.57"/><rect class="cls-4" x="43.89" y="177.53" width="161.29" height="12"/><rect class="cls-4" x="43.89" y="204.59" width="68.2" height="12"/><circle class="cls-3" cx="379.46" cy="207.35" r="23.82"/><rect class="cls-3" x="43.89" y="36.31" width="72.53" height="47.63" rx="12" ry="12"/><path class="cls-4" d="M104.42,88.86H55.89a18,18,0,0,1-18-18V47.23a18,18,0,0,1,18-18h48.53a18,18,0,0,1,18,18V70.86A18,18,0,0,1,104.42,88.86ZM55.89,41.23a6,6,0,0,0-6,6V70.86a6,6,0,0,0,6,6h48.53a6,6,0,0,0,6-6V47.23a6,6,0,0,0-6-6Z"/><path class="cls-4" d="M379.46,241.49a29.81,29.81,0,1,1,29.82-29.82A29.85,29.85,0,0,1,379.46,241.49Zm0-47.63a17.81,17.81,0,1,0,17.82,17.81A17.84,17.84,0,0,0,379.46,193.86Z"/></g></g></svg>
\ No newline at end of file
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 392.49 390.69"><defs><style>.cls-1{fill:#fff;}.cls-2{fill:#f3aa9f;}.cls-3{fill:#e1978f;}.cls-4,.cls-6{fill:#426572;}.cls-5{fill:#e1d2d5;}.cls-6{font-size:100.43px;font-family:Dosis-ExtraBold, Dosis;font-weight:700;}</style></defs><title>Asset 480</title><g id="Layer_2" data-name="Layer 2"><g id="Layer_1-2" data-name="Layer 1"><path class="cls-1" d="M383.9,162H199.69V2.19q4-.19,8.16-.19A176.87,176.87,0,0,1,383.9,162Z"/><path class="cls-2" d="M355.38,210a176.83,176.83,0,0,1-95.72,157.18l-.15.07A176.88,176.88,0,1,1,101.72,50.67l.15-.07a175.93,175.93,0,0,1,72.82-17.4V191H354.37A177.9,177.9,0,0,1,355.38,210Z"/><path class="cls-3" d="M357.53,212.16a176,176,0,0,1-17.44,76.66,1,1,0,0,1-.07.15A176.89,176.89,0,0,1,73.47,352.79l1.23.38q6,1.86,12.26,3.29A177,177,0,0,0,303.49,191h52.78A178.15,178.15,0,0,1,357.53,212.16Z"/><path class="cls-4" d="M182.85,390.69a182.87,182.87,0,0,1-84-345.31l.41-.2a180.59,180.59,0,0,1,75.13-20l6.27-.28V185H364.36l.51,5.44c.54,5.77.82,11.62.82,17.4a180.72,180.72,0,0,1-20.18,83.56c-.06.12-.12.26-.2.41a184.39,184.39,0,0,1-83,80.77l-.18.08,0,0A181.06,181.06,0,0,1,182.85,390.69ZM104.33,56.08A170.88,170.88,0,0,0,256.9,361.85l.17-.08,0,0a172.34,172.34,0,0,0,77.5-75.38l.15-.29a168.84,168.84,0,0,0,18.93-78.23c0-3.6-.11-7.23-.34-10.84H168.69V37.58a168.41,168.41,0,0,0-64.07,18.35Z"/><path class="cls-5" d="M382.9,158H309.11c-2.89-46.4-18.43-98.49-36.89-144.29l1.33.51a177.49,177.49,0,0,1,92.51,83.56A175.63,175.63,0,0,1,382.9,158Z"/><path class="cls-4" d="M392.49,172H195.69V.47L201.4.2C204.11.07,207,0,209.85,0a182.87,182.87,0,0,1,182,165.44Zm-184.8-12H379.18A170.89,170.89,0,0,0,209.85,12h-2.16Z"/><text class="cls-6" transform="translate(232.67 133.93)">%</text><path class="cls-1" d="M101.22,81.14a166.34,166.34,0,0,1,34.83-18c3.58-1.34,2-7.14-1.6-5.79A172.89,172.89,0,0,0,98.19,76c-3.18,2.15-.18,7.35,3,5.18Z"/><path class="cls-1" d="M36.28,166.34c2.62-8.63,6.74-16.94,11.05-24.83A180.58,180.58,0,0,1,87.86,91.34c2.93-2.52-1.33-6.75-4.24-4.24-23.3,20.06-44.07,47.84-53.12,77.65-1.12,3.7,4.67,5.29,5.79,1.6Z"/></g></g></svg>
\ No newline at end of file
<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 419.23 419.23"><defs><style>.cls-1{fill:#fbc907;}.cls-2{fill:#f3a70f;}.cls-3{fill:#426572;}.cls-4,.cls-9{fill:#fff;}.cls-5{fill:#e8e8e8;}.cls-6{fill:#dadada;}.cls-7{opacity:0.1;}.cls-8{fill:#55e0ff;}.cls-9{opacity:0.4;}</style></defs><title>Asset 510</title><g id="Layer_2" data-name="Layer 2"><g id="Layer_1-2" data-name="Layer 1"><circle class="cls-1" cx="210.66" cy="209.62" r="203.61"/><path class="cls-2" d="M27.21,209.62A203.61,203.61,0,0,1,220.72,6.26q-5-.25-10.08-.25C98.19,4.86,6.11,95.09,5,207.54S94.05,412.07,206.5,413.21q2.07,0,4.13,0,5.06,0,10.08-.25A203.61,203.61,0,0,1,27.21,209.62Z"/><path class="cls-3" d="M209.61,419.23C94,419.23,0,325.19,0,209.61S94,0,209.61,0,419.23,94,419.23,209.61,325.19,419.23,209.61,419.23Zm0-407.23C100.65,12,12,100.65,12,209.61s88.65,197.61,197.61,197.61,197.61-88.65,197.61-197.61S318.58,12,209.61,12Z"/><path class="cls-4" d="M111.69,60.1a195,195,0,0,1,41.08-21.2c3.59-1.34,2-7.14-1.6-5.79a201.47,201.47,0,0,0-42.51,21.8c-3.18,2.15-.18,7.35,3,5.18Z"/><path class="cls-4" d="M35.09,160.61c3.09-10.2,8-20,13.05-29.32A212.37,212.37,0,0,1,95.87,72.18c2.93-2.52-1.33-6.75-4.24-4.24A217.08,217.08,0,0,0,43,128.26C37.63,138,32.54,148.34,29.31,159c-1.12,3.7,4.67,5.29,5.79,1.6Z"/><circle class="cls-5" cx="211.45" cy="212.12" r="156.89"/><path class="cls-6" d="M67.05,232.07a156.89,156.89,0,0,1,283.33-92.82A156.91,156.91,0,1,0,85,304.92,156.19,156.19,0,0,1,67.05,232.07Z"/><path class="cls-5" d="M211.32,152.25h0a9.16,9.16,0,0,1,9.16,9.16V210.5a9.16,9.16,0,0,1-9.16,9.16h0a9.16,9.16,0,0,1-9.16-9.16V161.41A9.16,9.16,0,0,1,211.32,152.25Z"/><circle class="cls-5" cx="211.14" cy="221.32" r="15.94"/><path class="cls-3" d="M210.48,92.62c6.29,0,6.29-9.77,0-9.77S204.19,92.62,210.48,92.62Z"/><path class="cls-3" d="M210.48,343.89c6.29,0,6.29-9.77,0-9.77S204.19,343.89,210.48,343.89Z"/><path class="cls-3" d="M339.84,218.25c6.29,0,6.29-9.77,0-9.77S333.55,218.25,339.84,218.25Z"/><path class="cls-3" d="M81.13,218.25c6.29,0,6.29-9.77,0-9.77S74.84,218.25,81.13,218.25Z"/><path class="cls-3" d="M205.56,153.32h0a9.16,9.16,0,0,1,9.16,9.16v49.09a9.16,9.16,0,0,1-9.16,9.16h0a9.16,9.16,0,0,1-9.16-9.16V162.49A9.16,9.16,0,0,1,205.56,153.32Z"/><circle class="cls-3" cx="205.38" cy="221.15" r="15.94"/><path class="cls-3" d="M135.78,272.58l135.16-89.89L290.11,170c5.22-3.46.33-11.94-4.92-8.44L150,251.4l-19.17,12.74C125.64,267.6,130.52,276.08,135.78,272.58Z"/><g class="cls-7"><ellipse class="cls-8" cx="210.2" cy="211.21" rx="156.89" ry="154.23"/></g><path class="cls-9" d="M243.13,60.17,84.37,301.88a162.18,162.18,0,0,1-18.58-47.29L193.5,60.21a153.88,153.88,0,0,1,49.67,0Z"/><path class="cls-9" d="M289.69,72.6,115.93,325.78a155.09,155.09,0,0,1-14.77-15L270,64.76A155.38,155.38,0,0,1,289.69,72.6Z"/><path class="cls-9" d="M362.16,171.75h0L232.51,360.68h0a160.93,160.93,0,0,1-42.54.43L346.63,132.84A151.63,151.63,0,0,1,362.16,171.75Z"/><path class="cls-3" d="M210.12,369.75c-89.82,0-162.89-71.88-162.89-160.23S120.31,49.29,210.12,49.29,373,121.17,373,209.52,299.94,369.75,210.12,369.75Zm0-308.46c-83.2,0-150.89,66.5-150.89,148.23s67.69,148.23,150.89,148.23S361,291.25,361,209.52,293.32,61.29,210.12,61.29Z"/></g></g></svg>
\ No newline at end of file
<?xml version="1.0" encoding="UTF-8"?>
<svg width="20px" height="12px" viewBox="0 0 20 12" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 61 (89581) - https://sketch.com -->
<title>下跌-24px</title>
<desc>Created with Sketch.</desc>
<g id="页面-2" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="系统首页" transform="translate(-850.000000, -241.000000)">
<g id="1" transform="translate(234.000000, 120.000000)">
<g id="Total-Sales" transform="translate(598.000000, 0.000000)">
<g id="8.5%-Up-from-yesterday" transform="translate(16.000000, 114.000000)">
<g id="下跌-24px" transform="translate(0.000000, 1.000000)">
<polygon id="Path" points="0 0 24 0 24 24 0 24"></polygon>
<polygon id="Path" fill="#ED6F6F" fill-rule="nonzero" points="16 18 18.29 15.71 13.41 10.83 9.41 14.83 2 7.41 3.41 6 9.41 12 13.41 8 19.71 14.29 22 12 22 18"></polygon>
</g>
</g>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file
<?xml version="1.0" encoding="UTF-8"?>
<svg width="60px" height="60px" viewBox="0 0 60 60" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 61 (89581) - https://sketch.com -->
<title>Icon1@3x</title>
<desc>Created with Sketch.</desc>
<g id="页面-2" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="系统首页" transform="translate(-419.000000, -136.000000)" fill="#0593FF">
<g id="1" transform="translate(234.000000, 120.000000)">
<g id="Total-Users">
<g id="Icon1" transform="translate(185.000000, 16.000000)">
<path d="M23,60 C10.2974508,60 1.55561363e-15,49.7025492 0,37 L0,23 C-1.55561363e-15,10.2974508 10.2974508,2.33342044e-15 23,0 L37,0 C49.7025492,-2.33342044e-15 60,10.2974508 60,23 L60,37 C60,49.7025492 49.7025492,60 37,60 L23,60 Z" id="Circle-2" opacity="0.209999993"></path>
<g id="Group" transform="translate(14.000000, 18.000000)" fill-rule="nonzero">
<path d="M24,6.66666667 C26.209139,6.66666667 28,8.45752767 28,10.6666667 C28,12.8758057 26.209139,14.6666667 24,14.6666667 C21.790861,14.6666667 20,12.8758057 20,10.6666667 C20,8.45752767 21.790861,6.66666667 24,6.66666667 Z M12,0 C14.9455187,0 17.3333333,2.38781467 17.3333333,5.33333333 C17.3333333,8.278852 14.9455187,10.6666667 12,10.6666667 C9.05448133,10.6666667 6.66666667,8.278852 6.66666667,5.33333333 C6.66666667,2.38781467 9.05448133,0 12,0 Z" id="Combined-Shape" opacity="0.587820871"></path>
<path d="M23.4686027,16.0012776 L23.3172917,16 C27.927838,16 31.7158139,18.2931929 31.9979916,23.2 C32.0092328,23.3954741 31.9979916,24 31.2745999,24 L26.1333333,24 L26.1333333,24 C26.1333333,20.9989578 25.1418595,18.2294867 23.4686027,16.0012776 Z M11.9777884,13.3333333 C18.3616218,13.3333333 23.6065116,16.3909238 23.9972191,22.9333333 C24.0127839,23.1939654 23.9972191,24 22.9955999,24 L0.97000297,24 L0.97000297,24 C0.635616207,24 -0.027282334,23.2789066 0.000868912387,22.932274 C0.517678033,16.5686878 5.6825498,13.3333333 11.9777884,13.3333333 Z" id="Combined-Shape"></path>
</g>
</g>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file
<?xml version="1.0" encoding="UTF-8"?>
<svg width="60px" height="60px" viewBox="0 0 60 60" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 61 (89581) - https://sketch.com -->
<title>Icon2@3x</title>
<desc>Created with Sketch.</desc>
<g id="页面-2" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="系统首页" transform="translate(-719.000000, -136.000000)">
<g id="1" transform="translate(234.000000, 120.000000)">
<g id="Total-Order" transform="translate(299.000000, 0.000000)">
<g id="Icon2" transform="translate(186.000000, 16.000000)">
<path d="M23,60 C10.2974508,60 1.55561363e-15,49.7025492 0,37 L0,23 C-1.55561363e-15,10.2974508 10.2974508,2.33342044e-15 23,0 L37,0 C49.7025492,-2.33342044e-15 60,10.2974508 60,23 L60,37 C60,49.7025492 49.7025492,60 37,60 L23,60 Z" id="Circle-2" fill="#FFD164" opacity="0.209999993"></path>
<g id="icon" transform="translate(15.000000, 13.000000)">
<path d="M0,11.3164701 L12.9004912,18.7645722 C13.0394036,18.8447733 13.1850623,18.9027046 13.3333333,18.9394739 L13.3333333,33.3847054 L0.920064885,26.0385088 C0.349783865,25.7010154 0,25.0875659 0,24.4249029 L0,11.3164701 Z M30,11.1184665 L30,24.4249029 C30,25.0875659 29.6502161,25.7010154 29.0799351,26.0385088 L16.6666667,33.3847054 L16.6666667,18.8129235 C16.6969108,18.7978151 16.7268876,18.7817016 16.7565565,18.7645722 L30,11.1184665 L30,11.1184665 Z" id="Combined-Shape" fill="#FFC741"></path>
<path d="M0.405221909,7.70142332 C0.562796988,7.50243849 0.761684783,7.33426405 0.993563997,7.21076013 L14.118564,0.220099528 C14.6695479,-0.0733665093 15.3304521,-0.0733665093 15.881436,0.220099528 L29.006436,7.21076013 C29.1851826,7.30596446 29.3443248,7.42771319 29.480051,7.56965747 L15.0898899,15.8778209 C14.9952678,15.9324509 14.9080291,15.9949583 14.8285239,16.0640363 C14.7490186,15.9949583 14.66178,15.9324509 14.5671579,15.8778209 L0.405221909,7.70142332 Z" id="Path" fill="#FFD164" opacity="0.659481957"></path>
</g>
</g>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file
<?xml version="1.0" encoding="UTF-8"?>
<svg width="60px" height="60px" viewBox="0 0 60 60" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 61 (89581) - https://sketch.com -->
<title>Icon3@3x</title>
<desc>Created with Sketch.</desc>
<g id="页面-2" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="系统首页" transform="translate(-1018.000000, -136.000000)" fill="#55D187">
<g id="1" transform="translate(234.000000, 120.000000)">
<g id="Total-Sales" transform="translate(598.000000, 0.000000)">
<g id="Icon3" transform="translate(186.000000, 16.000000)">
<path d="M23,60 C10.2974508,60 1.55561363e-15,49.7025492 0,37 L0,23 C-1.55561363e-15,10.2974508 10.2974508,2.33342044e-15 23,0 L37,0 C49.7025492,-2.33342044e-15 60,10.2974508 60,23 L60,37 C60,49.7025492 49.7025492,60 37,60 L23,60 Z" id="Circle-2" opacity="0.209999993"></path>
<g id="icon" transform="translate(16.000000, 16.000000)" fill-rule="nonzero">
<path d="M3.11111111,24.8888889 L26.4444444,24.8888889 C27.3035541,24.8888889 28,25.5853348 28,26.4444444 C28,27.3035541 27.3035541,28 26.4444444,28 L1.55555556,28 C0.696445945,28 0,27.3035541 0,26.4444444 L0,1.55555556 C0,0.696445945 0.696445945,0 1.55555556,0 C2.41466517,0 3.11111111,0.696445945 3.11111111,1.55555556 L3.11111111,24.8888889 Z" id="Path-95"></path>
<path d="M8.91261343,18.1750195 C8.32503303,18.801772 7.34062178,18.8335272 6.71386936,18.2459468 C6.08711693,17.6583664 6.05536173,16.6739551 6.64294213,16.0472027 L12.4762755,9.82498047 C13.044535,9.21883699 13.9888279,9.16627114 14.6208522,9.70559855 L19.2248856,13.6343737 L25.2235157,6.03610888 C25.7558581,5.36180856 26.7340352,5.24672889 27.4083356,5.77907125 C28.0826359,6.31141362 28.1977156,7.28959079 27.6653732,7.96389112 L20.6653732,16.8305578 C20.118618,17.5231144 19.1059101,17.6227201 18.4347034,17.049957 L13.7306235,13.0358088 L8.91261343,18.1750195 Z" id="Path-97" opacity="0.657133557"></path>
</g>
</g>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file
<?xml version="1.0" encoding="UTF-8"?>
<svg width="60px" height="60px" viewBox="0 0 60 60" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 61 (89581) - https://sketch.com -->
<title>Icon</title>
<desc>Created with Sketch.</desc>
<g id="页面-2" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="系统首页" transform="translate(-1317.000000, -136.000000)" fill="#FF9066">
<g id="1" transform="translate(234.000000, 120.000000)">
<g id="Order-Pending" transform="translate(897.000000, 0.000000)">
<g id="Icon" transform="translate(186.000000, 16.000000)">
<path d="M23,60 C10.2974508,60 1.55561363e-15,49.7025492 0,37 L0,23 C-1.55561363e-15,10.2974508 10.2974508,2.33342044e-15 23,0 L37,0 C49.7025492,-2.33342044e-15 60,10.2974508 60,23 L60,37 C60,49.7025492 49.7025492,60 37,60 L23,60 Z" id="Circle-2" opacity="0.3"></path>
<g id="icon" transform="translate(16.000000, 15.000000)">
<path d="M13.1296822,8.34718934 L13.5475062,8.34718934 C13.8043819,8.34718934 14.0194647,8.54183658 14.0450248,8.79743748 L14.6666667,15.013856 L14.6666667,15.013856 L19.0814028,17.5365624 C19.2371903,17.6255838 19.3333333,17.7912555 19.3333333,17.9706839 L19.3333333,18.3592308 C19.3333333,18.6353732 19.1094757,18.8592308 18.8333333,18.8592308 C18.7888923,18.8592308 18.7446497,18.8533059 18.7017746,18.8416127 L12.3986612,17.1225818 C12.1672824,17.0594785 12.0132986,16.8409746 12.0316926,16.6018516 L12.631155,8.80884109 C12.6511933,8.54834251 12.8684141,8.34718934 13.1296822,8.34718934 Z" id="Path-107" opacity="0.779999971"></path>
<path d="M6.01733907,-0.0772351689 C6.2288764,-0.254736066 6.5442542,-0.227144084 6.72175509,-0.0156067521 L6.72175509,-0.0156067521 L8.51913552,2.1273858 C10.2024553,1.41052645 12.054904,1.01385601 14,1.01385601 C21.7319865,1.01385601 28,7.28186951 28,15.013856 C28,22.6413562 21.9002476,28.8441829 14.312645,29.010434 L14,29.013856 L14,29.013856 C6.2680135,29.013856 0,22.7458425 0,15.013856 C0,13.7006992 0.180792724,12.4297687 0.518844853,11.224598 L3.08641434,11.944805 C2.80896017,12.9339413 2.66666667,13.9630912 2.66666667,15.013856 C2.66666667,21.2730832 7.74077284,26.3471893 14,26.3471893 C20.2592272,26.3471893 25.3333333,21.2730832 25.3333333,15.013856 C25.3333333,8.85242927 20.4165542,3.83937783 14.2925184,3.68422422 L14,3.68052267 L14,3.68052267 C12.7318949,3.68052267 11.4968995,3.88835566 10.3322213,4.2862714 L12.1330448,6.43331723 C12.2023675,6.51593278 12.24312,6.61874811 12.2492217,6.7264223 C12.2648452,7.00212236 12.0540114,7.23828671 11.7783113,7.25391015 L11.7783113,7.25391015 L4.73355552,7.65312407 C4.68508783,7.65587065 4.6364785,7.65154413 4.58925778,7.64028071 C4.32065092,7.57621071 4.15484104,7.30652283 4.21891104,7.03791597 L4.21891104,7.03791597 L5.85237713,0.189778054 C5.87728008,0.0853749765 5.93511798,-0.00824348388 6.01733907,-0.0772351689 Z" id="Combined-Shape" opacity="0.901274182"></path>
</g>
</g>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file
<?xml version="1.0" encoding="UTF-8"?>
<svg width="20px" height="12px" viewBox="0 0 20 12" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<!-- Generator: Sketch 61 (89581) - https://sketch.com -->
<title>上涨-24px</title>
<desc>Created with Sketch.</desc>
<g id="页面-2" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd">
<g id="系统首页" transform="translate(-551.000000, -240.000000)">
<g id="1" transform="translate(234.000000, 120.000000)">
<g id="Total-Order" transform="translate(299.000000, 0.000000)">
<g id="8.5%-Up-from-yesterday" transform="translate(16.000000, 114.000000)">
<g id="上涨-24px">
<polygon id="Path" points="0 0 24 0 24 24 0 24"></polygon>
<polygon id="Path" fill="#55D187" fill-rule="nonzero" points="16 6 18.29 8.29 13.41 13.17 9.41 9.17 2 16.59 3.41 18 9.41 12 13.41 16 19.71 9.71 22 12 22 6"></polygon>
</g>
</g>
</g>
</g>
</g>
</g>
</svg>
\ No newline at end of file
此差异已折叠。
......@@ -53,7 +53,7 @@
&-normal {
font-size: 14px;
font-weight: normal;
font-weight: 500;
}
&-show-span::before {
......
......@@ -9,6 +9,9 @@
<template #title>
<slot name="title"></slot>
</template>
<template #action>
<slot name="action"></slot>
</template>
</CollapseHeader>
<div class="p-2">
......@@ -19,6 +22,10 @@
</div>
</CollapseTransition>
</div>
<div :class="`${prefixCls}__footer`" v-if="$slots.footer">
<slot name="footer"></slot>
</div>
</div>
</template>
<script lang="ts">
......@@ -106,6 +113,10 @@
border-bottom: 1px solid @border-color-light;
}
&__footer {
border-top: 1px solid @border-color-light;
}
&__action {
display: flex;
text-align: right;
......
......@@ -181,7 +181,7 @@
position: relative;
.@{prefix-cls}-content {
margin: 16px 16px 0 16px;
margin: 16px;
}
.ant-page-header {
......
......@@ -111,9 +111,9 @@
onBeforeUnmount(() => {
if (props.native) return;
if (!props.noresize) {
// removeResizeListener(unref(resize), update);
// removeResizeListener(unref(wrap), update);
// removeEventListener('resize', update);
removeResizeListener(unref(resize), update);
removeResizeListener(unref(wrap), update);
removeEventListener('resize', update);
}
});
......
<template>
<div class="flex px-2 py-1.5 items-center border-b-1">
<slot name="headerTitle" v-if="$slots.headerTitle"></slot>
<BasicTitle :helpMessage="helpMessage" v-if="!$slots.headerTitle && title">{{
title
}}</BasicTitle>
<BasicTitle :helpMessage="helpMessage" v-if="!$slots.headerTitle && title">
{{ title }}
</BasicTitle>
<div class="flex flex-1 justify-end items-center cursor-pointer" v-if="search || toolbar">
<div class="mr-1 w-2/3" v-if="search">
<InputSearch :placeholder="t('common.searchText')" size="small" @change="handleSearch" />
<InputSearch
:placeholder="t('common.searchText')"
size="small"
allowClear
@change="handleSearch"
/>
</div>
<Dropdown @click.prevent v-if="toolbar">
<Icon icon="ion:ellipsis-vertical" />
......
......@@ -2,7 +2,7 @@ export enum PageEnum {
// basic login path
BASE_LOGIN = '/login',
// basic home path
BASE_HOME = '/home',
BASE_HOME = '/dashboard',
// error page path
ERROR_PAGE = '/exception',
// error log page path
......
......@@ -136,8 +136,8 @@
}
img {
width: 26px;
height: 26px;
width: 24px;
height: 24px;
margin-right: 12px;
}
......
......@@ -30,7 +30,7 @@
line-height: calc(@multiple-height - 2px);
color: @text-color-call-out;
background: @white;
border: 1px solid darken(@border-color-light, 6%);
border-bottom: 1px solid @header-light-bottom-border-color;
transition: none;
// &:not(.ant-tabs-tab-active)::before {
......
import * as echarts from 'echarts/core';
import { BarChart, LineChart, PieChart, MapChart, PictorialBarChart } from 'echarts/charts';
import {
BarChart,
LineChart,
PieChart,
MapChart,
PictorialBarChart,
RadarChart,
} from 'echarts/charts';
import {
TitleComponent,
......@@ -10,6 +17,7 @@ import {
AriaComponent,
ParallelComponent,
LegendComponent,
RadarComponent,
} from 'echarts/components';
import { SVGRenderer } from 'echarts/renderers';
......@@ -26,8 +34,10 @@ echarts.use([
LineChart,
PieChart,
MapChart,
RadarChart,
SVGRenderer,
PictorialBarChart,
RadarComponent,
]);
export default echarts;
......@@ -6,14 +6,26 @@ const menu: MenuModule = {
menu: {
name: t('routes.dashboard.dashboard'),
path: '/dashboard',
tag: {
dot: true,
type: 'warn',
},
children: [
{
path: 'workbench',
name: t('routes.dashboard.workbench'),
},
{
path: 'analysis',
name: t('routes.dashboard.analysis'),
tag: {
dot: true,
type: 'warn',
},
},
{
path: 'workbench',
name: t('routes.dashboard.workbench'),
tag: {
dot: true,
type: 'warn',
},
},
],
},
......
......@@ -7,7 +7,7 @@ const dashboard: AppRouteModule = {
path: '/dashboard',
name: 'Dashboard',
component: LAYOUT,
redirect: '/dashboard/workbench',
redirect: '/dashboard/analysis',
meta: {
icon: 'ion:grid-outline',
title: t('routes.dashboard.dashboard'),
......@@ -26,6 +26,7 @@ const dashboard: AppRouteModule = {
name: 'Analysis',
component: () => import('/@/views/dashboard/analysis/index.vue'),
meta: {
affix: true,
title: t('routes.dashboard.analysis'),
},
},
......
......@@ -80,12 +80,3 @@ export function isDevMode(): boolean {
export function isProdMode(): boolean {
return import.meta.env.PROD;
}
/**
* @description: Whether to open mock
* @returns:
* @example:
*/
export function isUseMock(): boolean {
return import.meta.env.VITE_USE_MOCK === 'true';
}
<template>
<div ref="chartRef" :style="{ height, width }"></div>
</template>
<script lang="ts">
import { defineComponent, onMounted, ref, Ref } from 'vue';
import { useECharts } from '/@/hooks/web/useECharts';
import { basicProps } from './props';
const m2R2Data = [
{ value: 335, name: '移动设备', itemStyle: { color: '#1b65b9' } },
{ value: 310, name: '网页端', itemStyle: { color: '#3ca0f6' } },
{ value: 234, name: '手表', itemStyle: { color: '#2dc0c0' } },
{ value: 234, name: '其他', itemStyle: { color: '#7dd9b9' } },
];
export default defineComponent({
props: basicProps,
setup() {
const chartRef = ref<HTMLDivElement | null>(null);
const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>);
onMounted(() => {
setOptions({
title: [
{
text: '总设备',
subtext: '1,430',
textStyle: {
fontSize: 12,
color: '#4B535E85',
},
subtextStyle: {
fontSize: 24,
color: 'black',
},
textAlign: 'center',
left: '34.5%',
top: '40%',
},
],
tooltip: {
trigger: 'item',
},
legend: {
itemHeight: 10,
type: 'scroll',
orient: 'vertical',
left: '70%',
align: 'left',
top: 'middle',
textStyle: {
color: '#8C8C8C',
},
height: 250,
},
series: [
{
name: '成交额',
type: 'pie',
center: ['35%', '50%'],
radius: ['45%', '65%'],
label: {
show: false,
},
data: m2R2Data,
animationDuration: 3000,
},
],
});
});
return { chartRef };
},
});
</script>
import { defineComponent } from 'vue';
import { Tabs, Row, Col, Progress, Divider } from 'ant-design-vue';
import { CollapseContainer } from '/@/components/Container/index';
import TrendLine from './TrendLine.vue';
import './flow-ana.less';
const prefixCls = 'flow-analysis';
export default defineComponent({
name: 'AnalysisFLow',
setup() {
const renderContent = () => {
return (
<Row>
{() => (
<>
<Col md={24} lg={8}>
{() => (
<CollapseContainer
title="整体流量评分"
canExpan={false}
class={`${prefixCls}__left`}
>
{() => (
<div>
<div class={`${prefixCls}__score`}>
86.2<span></span>
</div>
<div class={`${prefixCls}__rank`}>
排名<span>前20%</span>
</div>
<Progress percent={70} showInfo={false} status="active" />
<Divider />
<ul class={`${prefixCls}__rs`}>
<li>
<span>平均分</span>
<span>77.5</span>
</li>
<li>
<span>最高分</span>
<span>99.5</span>
</li>
<li>
<span>最低分</span>
<span>56.5</span>
</li>
</ul>
</div>
)}
</CollapseContainer>
)}
</Col>
<Col md={24} lg={16}>
{() => (
<CollapseContainer title="整体流量趋势" canExpan={false}>
{() => <TrendLine />}
</CollapseContainer>
)}
</Col>
</>
)}
</Row>
);
};
return () => (
<Tabs class={prefixCls} default-active-key="1">
{() => [
<Tabs.TabPane key="1" tab="产品一">
{() => renderContent()}
</Tabs.TabPane>,
<Tabs.TabPane key="2" tab="产品二">
{() => renderContent()}
</Tabs.TabPane>,
<Tabs.TabPane key="3" tab="产品三">
{() => renderContent()}
</Tabs.TabPane>,
]}
</Tabs>
);
},
});
<template>
<div class="grow-card">
<div class="grow-card-header">
<div class="grow-card__info">
<p class="grow-card__title">
{{ info.title }}
</p>
<CountTo prefix="$" :startVal="1" :endVal="info.price" />
</div>
<img :src="info.icon" />
</div>
<div class="grow-card-footer" :class="{ 'is-up': info.up }">
<Statistic :value="info.percent">
<template #prefix>
<img :src="info.up ? riseSvg : downSvg" />
<div class="md:flex">
<template v-for="(item, index) in growCardList" :key="item.title">
<Card
size="small"
:loading="$attrs.loading"
:title="item.title"
class="md:w-1/4 w-full md:mt-0 !mt-4"
:class="[index + 1 < 4 && '!md:mr-4']"
:canExpan="false"
>
<template #extra>
<Tag :color="item.color">{{ item.action }}</Tag>
</template>
</Statistic>
<span class="grow-card__mom">{{ info.mom }}</span>
</div>
<div class="py-4 px-4 flex justify-between">
<CountTo prefix="$" :startVal="1" :endVal="item.value" class="text-2xl" />
<Icon :icon="item.icon" :size="40" />
</div>
<div class="p-2 px-4 flex justify-between">
<span>总{{ item.title }}</span>
<CountTo prefix="$" :startVal="1" :endVal="item.total" />
</div>
</Card>
</template>
</div>
</template>
<script lang="ts">
import { defineComponent, PropType } from 'vue';
import { Statistic } from 'ant-design-vue';
import { CountTo } from '/@/components/CountTo/index';
import { defineComponent } from 'vue';
import riseSvg from '/@/assets/svg/dashboard/analysis-rise.svg';
import downSvg from '/@/assets/svg/dashboard/analysis-down.svg';
import { GrowCardItem } from '../types';
import { CountTo } from '/@/components/CountTo/index';
import { Icon } from '/@/components/Icon';
import { Tag, Card } from 'ant-design-vue';
import { growCardList } from '../data';
export default defineComponent({
components: { Statistic, CountTo },
props: {
info: {
type: Object as PropType<GrowCardItem>,
default: null,
},
},
components: { CountTo, Tag, Card, Icon },
setup() {
return {
riseSvg,
downSvg,
};
return { growCardList };
},
});
</script>
<style lang="less">
.grow-card {
display: flex;
width: calc(100% - 12px);
height: 158px;
padding: 16px 16px 12px 16px;
// margin: 0 12px 12px 12px;
cursor: pointer;
background: @white;
border-radius: 4px;
box-shadow: 6px 6px 54px 0 rgba(0, 0, 0, 0.05);
flex-direction: column;
&:hover {
box-shadow: 6px 6px 54px 0 rgba(0, 0, 0, 0.1);
}
&-header {
display: flex;
width: 100%;
justify-content: space-between;
}
&__title {
font-family: PingFangSC-Regular;
font-size: 16px;
letter-spacing: 0;
color: @text-color-base;
opacity: 0.7;
}
&__info {
span {
font-family: NeoSans;
font-size: 26px;
line-height: 38px;
}
}
&-footer {
display: flex;
width: 100%;
margin-top: 24px;
align-items: center;
.ant-statistic-content-value {
color: @error-color;
}
.ant-statistic-content-prefix svg {
width: 0.98rem !important;
height: 0.98rem !important;
}
&.is-up {
.ant-statistic-content-value {
color: @success-color;
}
}
}
&__mom {
display: inline-block;
padding-left: 10px;
font-family: PingFangSC-Regular;
font-size: 12px;
line-height: 22px;
letter-spacing: 0;
color: #606060;
}
}
</style>
<template>
<Card title="成交占比" :loading="loading">
<div ref="chartRef" :style="{ width, height }"></div>
</Card>
</template>
<script lang="ts">
import { defineComponent, Ref, ref, watch } from 'vue';
import { Card } from 'ant-design-vue';
import { useECharts } from '/@/hooks/web/useECharts';
export default defineComponent({
components: { Card },
props: {
loading: Boolean,
width: {
type: String as PropType<string>,
default: '100%',
},
height: {
type: String as PropType<string>,
default: '300px',
},
},
setup(props) {
const chartRef = ref<HTMLDivElement | null>(null);
const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>);
watch(
() => props.loading,
() => {
if (props.loading) {
return;
}
setOptions({
tooltip: {
trigger: 'item',
},
series: [
{
name: '访问来源',
type: 'pie',
radius: '80%',
center: ['50%', '50%'],
color: ['#5ab1ef', '#b6a2de', '#67e0e3', '#2ec7c9'],
data: [
{ value: 500, name: '电子产品' },
{ value: 310, name: '服装' },
{ value: 274, name: '化妆品' },
{ value: 400, name: '家居' },
].sort(function (a, b) {
return a.value - b.value;
}),
roseType: 'radius',
animationType: 'scale',
animationEasing: 'exponentialInOut',
animationDelay: function () {
return Math.random() * 400;
},
},
],
});
},
{ immediate: true }
);
return { chartRef };
},
});
</script>
<template>
<Card
:tab-list="tabListTitle"
v-bind="$attrs"
:active-tab-key="activeKey"
@tabChange="onTabChange"
>
<p v-if="activeKey === 'tab1'">
<VisitAnalysis />
</p>
<p v-if="activeKey === 'tab2'">
<VisitAnalysisBar />
</p>
</Card>
</template>
<script lang="ts">
import { defineComponent, ref } from 'vue';
import { Card } from 'ant-design-vue';
import VisitAnalysis from './VisitAnalysis.vue';
import VisitAnalysisBar from './VisitAnalysisBar.vue';
export default defineComponent({
components: { Card, VisitAnalysis, VisitAnalysisBar },
setup() {
const activeKey = ref('tab1');
const tabListTitle = [
{
key: 'tab1',
tab: '流量趋势',
},
{
key: 'tab2',
tab: '访问量',
},
];
function onTabChange(key) {
activeKey.value = key;
}
return { tabListTitle, activeKey, onTabChange };
},
});
</script>
<template>
<div :class="prefixCls">
<div :class="`${prefixCls}-header`">
<div :class="`${prefixCls}__info`">
<span :class="`${prefixCls}__title`">{{ info.title }}</span>
<span :class="`${prefixCls}__desc`">{{ info.desc }}</span>
</div>
<span :class="`${prefixCls}__tag ${info.status}`">{{ info.text }}</span>
</div>
<div :class="`${prefixCls}-body mt-5`">
<div :class="`${prefixCls}__process-nfo`">
<span>进度</span>
<span>{{ info.percent }}%</span>
</div>
<Progress :percent="info.percent" :showInfo="false" :status="info.status" />
</div>
<div :class="`${prefixCls}-footer`">
<span :class="`${prefixCls}__date`">
更新日期: <span>{{ info.updateTime }}</span>
</span>
<div :class="`${prefixCls}__avatar`">
<Avatar src="https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png" />
<Avatar src="https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png" />
<Avatar>+3</Avatar>
</div>
</div>
</div>
</template>
<script lang="ts">
import { computed, defineComponent, PropType } from 'vue';
import { Progress, Avatar } from 'ant-design-vue';
import { TaskItem } from '../types';
export default defineComponent({
name: 'GrowCard',
components: { Progress, Avatar },
props: {
info: {
type: Object as PropType<TaskItem>,
default: null,
},
},
setup(props) {
return {
prefixCls: 'task-card',
text: computed(() => {
const { status } = props.info || {};
return status === 'active'
? '进度正常'
: status === 'exception'
? '进度滞后'
: '项目完成';
}),
};
},
});
</script>
<style lang="less" scoped>
.task-card {
display: flex;
width: calc(100% - 24px);
height: 199px;
padding: 24px 20px 12px 16px;
margin: 0 12px 12px 12px;
background: #fff;
border: 1px solid #ececf2;
border-radius: 12px;
flex-direction: column;
&-header {
display: flex;
width: 100%;
justify-content: space-between;
align-items: center;
}
&__tag {
display: inline-block;
padding: 4px 6px;
font-family: PingFangSC-Regular;
font-size: 12px;
border-radius: 6px;
&.success {
color: #55d187;
background: rgba(85, 209, 135, 0.16);
}
&.warn {
color: #ffa07d;
background: #ffd16416;
}
&.done {
color: #0593ff;
background: #0593ff16;
}
}
&__info {
display: flex;
flex-direction: column;
}
&__title {
font-family: PingFangSC-Medium;
font-size: 16px;
line-height: 24px;
color: rgba(0, 0, 0, 0.85);
}
&__desc {
font-family: PingFangSC-Regular;
font-size: 12px;
line-height: 21px;
color: #8181a5;
}
&__process-nfo {
display: flex;
justify-content: space-between;
span {
font-size: 14px;
line-height: 21px;
color: #8181a5;
}
}
&-footer {
display: flex;
width: 100%;
margin-top: 16px;
align-items: center;
justify-content: space-between;
}
&__date {
font-size: 12px;
line-height: 21px;
color: #2c3a61;
span {
color: #7c8087;
}
}
&__avatar {
display: flex;
}
}
</style>
<template>
<div ref="chartRef" :style="{ height, width }"></div>
</template>
<script lang="ts">
import { defineComponent, onMounted, ref, Ref } from 'vue';
import { useECharts } from '/@/hooks/web/useECharts';
import { basicProps } from './props';
export default defineComponent({
props: basicProps,
setup() {
const chartRef = ref<HTMLDivElement | null>(null);
const { setOptions, echarts } = useECharts(chartRef as Ref<HTMLDivElement>);
onMounted(() => {
setOptions({
tooltip: {
trigger: 'axis',
padding: 3,
borderColor: '#777',
borderWidth: 1,
},
legend: {
show: false,
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true,
},
xAxis: {
type: 'category',
boundaryGap: false,
axisTick: {
inside: true,
},
data: [
'一月',
'二月',
'三月',
'四月',
'五月',
'六月',
'七月',
'八月',
'九月',
'十月',
'十一月',
'十二月',
],
},
yAxis: {
type: 'value',
axisTick: {
inside: true,
},
},
series: [
{
name: '产品一',
type: 'line',
itemStyle: {
color: '#5B8FF9',
},
areaStyle: {
color: new echarts.graphic.LinearGradient(
0,
0,
0,
1,
[
{
offset: 0,
color: '#5B8FF9',
},
{
offset: 1,
color: 'rgba(118,168,248, 0)',
},
],
false
),
shadowColor: 'rgba(118,168,248, 0.9)',
shadowBlur: 20,
},
data: [134, 330, 132, 101, 90, 230, 210, 150, 230, 400, 232, 234],
animationDuration: 3000,
},
],
});
});
return { chartRef };
},
});
</script>
......@@ -8,7 +8,6 @@
import { basicProps } from './props';
export default defineComponent({
name: 'AnalysisLine',
props: basicProps,
setup() {
const chartRef = ref<HTMLDivElement | null>(null);
......@@ -19,71 +18,128 @@
tooltip: {
trigger: 'axis',
axisPointer: {
// 坐标轴指示器,坐标轴触发有效
type: 'shadow', // 默认为直线,可选为:'line' | 'shadow'
lineStyle: {
width: 1,
color: '#019680',
},
},
},
legend: {
itemWidth: 15,
right: 10,
data: ['产品一', '产品二', '产品三'],
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true,
},
xAxis: [
{
type: 'category',
axisTick: {
inside: true, // 刻度朝内
xAxis: {
type: 'category',
boundaryGap: false,
data: [
'6:00',
'7:00',
'8:00',
'9:00',
'10:00',
'11:00',
'12:00',
'13:00',
'14:00',
'15:00',
'16:00',
'17:00',
'18:00',
'19:00',
'20:00',
'21:00',
'22:00',
'23:00',
],
splitLine: {
show: true,
lineStyle: {
width: 1,
type: 'solid',
color: 'rgba(226,226,226,0.5)',
},
data: ['付费用户', '免费用户', '自主'],
},
],
axisTick: {
show: false,
},
},
yAxis: [
{
type: 'value',
max: 80000,
splitNumber: 4,
axisTick: {
inside: true, // 刻度朝内
show: false,
},
splitArea: {
show: true,
areaStyle: {
color: ['rgba(255,255,255,0.2)', 'rgba(226,226,226,0.2)'],
},
},
},
],
grid: { left: '1%', right: '1%', top: '2 %', bottom: 0, containLabel: true },
series: [
{
name: '产品一',
type: 'bar',
smooth: true,
data: [
111,
222,
4000,
18000,
33333,
55555,
66666,
33333,
14000,
36000,
66666,
44444,
22222,
11111,
4000,
2000,
500,
333,
222,
111,
],
type: 'line',
areaStyle: {},
itemStyle: {
color: '#3ca0f6',
color: '#5ab1ef',
},
data: [3200, 3320, 3010],
animationDuration: 4000,
},
{
name: '产品二',
type: 'bar',
smooth: true,
data: [
33,
66,
88,
333,
3333,
5000,
18000,
3000,
1200,
13000,
22000,
11000,
2221,
1201,
390,
198,
60,
30,
22,
11,
],
type: 'line',
areaStyle: {},
itemStyle: {
color: '#7dd9b9',
color: '#019680',
},
data: [1200, 2600, 1010],
animationDuration: 4000,
},
{
name: '产品三',
type: 'bar',
itemStyle: {
color: '#e6a23c',
},
data: [862, 2500, 964],
animationDuration: 4000,
},
],
});
});
return { chartRef };
},
});
......
......@@ -8,7 +8,6 @@
import { basicProps } from './props';
export default defineComponent({
name: 'AnalysisLine',
props: basicProps,
setup() {
const chartRef = ref<HTMLDivElement | null>(null);
......@@ -16,74 +15,43 @@
onMounted(() => {
setOptions({
// title: {
// text: '产品成交额',
// },
tooltip: {
trigger: 'axis',
padding: 3,
borderColor: '#777',
borderWidth: 1,
},
legend: {
itemWidth: 15,
itemHeight: 4,
left: 80,
top: 0,
orient: 'horizontal',
data: ['产品一', '产品二'],
},
grid: {
left: '3%',
right: '4%',
bottom: '3%',
containLabel: true,
axisPointer: {
lineStyle: {
width: 1,
color: '#019680',
},
},
},
grid: { left: '1%', right: '1%', top: '2 %', bottom: 0, containLabel: true },
xAxis: {
type: 'category',
boundaryGap: false,
axisTick: {
inside: true, // 刻度朝内
},
data: [
'',
'',
'',
'',
'',
'',
'',
'',
'',
'',
'十一',
'十二',
'1',
'2',
'3',
'4',
'5',
'6',
'7',
'8',
'9',
'10',
'11',
'12',
],
},
yAxis: {
type: 'value',
axisTick: {
inside: true, // 刻度朝内
},
max: 8000,
splitNumber: 4,
},
series: [
{
name: '产品一',
type: 'line',
itemStyle: {
color: '#5B8FF9',
},
data: [330, 132, 101, 134, 90, 230, 210, 150, 232, 234, 230, 400],
animationDuration: 4000,
},
{
name: '产品二',
type: 'line',
itemStyle: {
color: '#55D187',
},
data: [220, 182, 191, 234, 290, 330, 310, 330, 232, 201, 330, 190],
animationDuration: 4000,
data: [3000, 2000, 3333, 5000, 3200, 4200, 3200, 2100, 3000, 5100, 6000, 3200, 4800],
type: 'bar',
barMaxWidth: 80,
},
],
});
......
<template>
<Card title="转化率" :loading="loading">
<div ref="chartRef" :style="{ width, height }"></div>
</Card>
</template>
<script lang="ts">
import { defineComponent, Ref, ref, watch } from 'vue';
import { Card } from 'ant-design-vue';
import { useECharts } from '/@/hooks/web/useECharts';
export default defineComponent({
components: { Card },
props: {
loading: Boolean,
width: {
type: String as PropType<string>,
default: '100%',
},
height: {
type: String as PropType<string>,
default: '300px',
},
},
setup(props) {
const chartRef = ref<HTMLDivElement | null>(null);
const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>);
watch(
() => props.loading,
() => {
if (props.loading) {
return;
}
setOptions({
backgroundColor: '#fff',
legend: {
bottom: 0,
data: ['访问', '购买'],
},
tooltip: {},
radar: {
radius: '60%',
splitNumber: 8,
indicator: [
{
text: '电脑',
max: 100,
},
{
text: '充电器',
max: 100,
},
{
text: '耳机',
max: 100,
},
{
text: '手机',
max: 100,
},
{
text: 'Ipad',
max: 100,
},
{
text: '耳机',
max: 100,
},
],
},
series: [
{
type: 'radar',
symbolSize: 0,
areaStyle: {
shadowBlur: 0,
shadowColor: 'rgba(0,0,0,.2)',
shadowOffsetX: 0,
shadowOffsetY: 10,
opacity: 1,
},
data: [
{
value: [90, 50, 86, 40, 50, 20],
name: '访问',
itemStyle: {
color: '#b6a2de',
},
},
{
value: [70, 75, 70, 76, 20, 85],
name: '购买',
itemStyle: {
color: '#5ab1ef',
},
},
],
},
],
});
},
{ immediate: true }
);
return { chartRef };
},
});
</script>
<template>
<Card title="访问来源" :loading="loading">
<div ref="chartRef" :style="{ width, height }"></div>
</Card>
</template>
<script lang="ts">
import { defineComponent, Ref, ref, watch } from 'vue';
import { Card } from 'ant-design-vue';
import { useECharts } from '/@/hooks/web/useECharts';
export default defineComponent({
components: { Card },
props: {
loading: Boolean,
width: {
type: String as PropType<string>,
default: '100%',
},
height: {
type: String as PropType<string>,
default: '300px',
},
},
setup(props) {
const chartRef = ref<HTMLDivElement | null>(null);
const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>);
watch(
() => props.loading,
() => {
if (props.loading) {
return;
}
setOptions({
tooltip: {
trigger: 'item',
},
legend: {
bottom: '1%',
left: 'center',
},
series: [
{
color: ['#5ab1ef', '#b6a2de', '#67e0e3', '#2ec7c9'],
name: '访问来源',
type: 'pie',
radius: ['40%', '70%'],
avoidLabelOverlap: false,
itemStyle: {
borderRadius: 10,
borderColor: '#fff',
borderWidth: 2,
},
label: {
show: false,
position: 'center',
},
emphasis: {
label: {
show: true,
fontSize: '12',
fontWeight: 'bold',
},
},
labelLine: {
show: false,
},
data: [
{ value: 1048, name: '搜索引擎' },
{ value: 735, name: '直接访问' },
{ value: 580, name: '邮件营销' },
{ value: 484, name: '联盟广告' },
],
animationType: 'scale',
animationEasing: 'exponentialInOut',
animationDelay: function () {
return Math.random() * 100;
},
},
],
});
},
{ immediate: true }
);
return { chartRef };
},
});
</script>
.flow-analysis {
width: 100%;
background: #fff;
&__left {
padding: 10px 20px !important;
border-right: 1px solid rgba(0, 0, 0, 0.06);
border-radius: 0;
}
&__score {
margin-top: 20px;
font-size: 30px;
line-height: 38px;
color: rgba(0, 0, 0, 0.85);
span {
font-size: 20px;
line-height: 28px;
color: rgba(0, 0, 0, 0.85);
}
}
&__rank {
margin: 16px 0;
font-size: 12px;
line-height: 20px;
color: #7c8087;
span {
display: inline-block;
margin-left: 10px;
color: #1c1d21;
}
}
&__rs {
li {
display: flex;
line-height: 28px;
justify-content: space-between;
span {
&:nth-child(1) {
font-size: 14px;
color: #1c1d21;
}
&:nth-child(2) {
font-size: 16px;
color: #1c1d21;
}
}
}
}
}
export interface GrowCardItem {
icon: string;
title: string;
value: number;
total: number;
color: string;
action: string;
}
export const growCardList: GrowCardItem[] = [
{
title: '访问数',
icon: 'visit-count|svg',
value: 2000,
total: 120000,
color: 'green',
action: '',
},
{
title: '成交额',
icon: 'total-sales|svg',
value: 20000,
total: 500000,
color: 'blue',
action: '',
},
{
title: '下载数',
icon: 'download-count|svg',
value: 8000,
total: 120000,
color: 'orange',
action: '',
},
{
title: '成交数',
icon: 'transaction|svg',
value: 5000,
total: 50000,
color: 'purple',
action: '',
},
];
import { GrowCardItem, TaskItem } from './types';
import iconSvg1 from '/@/assets/svg/dashboard/analysis-icon1.svg';
import iconSvg2 from '/@/assets/svg/dashboard/analysis-icon2.svg';
import iconSvg3 from '/@/assets/svg/dashboard/analysis-icon3.svg';
import iconSvg4 from '/@/assets/svg/dashboard/analysis-icon4.svg';
export const taskList: TaskItem[] = [
{
percent: 50,
title: '开发任务一',
updateTime: '2020.7.12',
desc: '开发任务一简介',
status: 'active',
},
{
percent: 67,
title: '开发任务二',
updateTime: '2020.3.12',
desc: '开发任务二简介',
status: 'exception',
},
{
percent: 100,
title: '开发任务三',
updateTime: '2020.4.12',
desc: '开发任务三简介',
status: 'success',
},
];
export const growCardList: GrowCardItem[] = [
{
title: '总用户数',
icon: iconSvg1,
price: 80000,
up: true,
mom: '环比增长',
percent: 2.5,
},
{
title: '产品数量',
icon: iconSvg2,
price: 4000,
up: true,
mom: '同比增长',
percent: 3,
},
{
title: '总营业额',
icon: iconSvg3,
price: 3000000,
up: false,
mom: '环比降低',
percent: 2,
},
{
title: '总任务数',
icon: iconSvg4,
price: 10000,
up: false,
mom: '同比降低',
percent: 1,
},
];
export const randomizeArray = function (arg: any) {
const array = arg.slice();
let currentIndex = array.length,
temporaryValue,
randomIndex;
while (0 !== currentIndex) {
randomIndex = Math.floor(Math.random() * currentIndex);
currentIndex -= 1;
temporaryValue = array[currentIndex];
array[currentIndex] = array[randomIndex];
array[randomIndex] = temporaryValue;
}
return array;
};
export const sparklineData = [
47,
45,
54,
38,
56,
24,
65,
31,
37,
39,
62,
51,
35,
41,
35,
27,
93,
53,
61,
27,
54,
43,
19,
46,
];
<template>
<div class="p-4 analysis">
<a-row class="pl-2">
<template v-for="item in growCardList" :key="item.title">
<a-col :sm="24" :md="12" :lg="6">
<GrowCard :info="item" />
</a-col>
</template>
</a-row>
<div class="p-4">
<GrowCard :loading="loading" class="enter-y" />
<SiteAnalysis class="!my-4 enter-y" :loading="loading" />
<a-row>
<a-col :md="24" :lg="17" class="my-3">
<CollapseContainer class="mr-3" title="产品成交额" :canExpan="false">
<AnalysisLine />
</CollapseContainer>
<a-row class="mt-3">
<a-col :md="24" :lg="12" class="product-total">
<CollapseContainer class="mr-3" title="产品成交额" :canExpan="false">
<AnalysisPie />
</CollapseContainer>
</a-col>
<a-col :md="24" :lg="12">
<CollapseContainer class="mr-3" title="用户来源" :canExpan="false">
<AnalysisBar />
</CollapseContainer>
</a-col>
</a-row>
</a-col>
<a-col :md="24" :lg="7">
<CollapseContainer class="mt-3" title="项目进度" :canExpan="false">
<template v-for="item in taskList" :key="item.title">
<TaskCard :info="item" />
</template>
</CollapseContainer>
</a-col>
</a-row>
<a-row>
<FlowAnalysis />
</a-row>
<div class="md:flex enter-y">
<VisitRadar class="md:w-1/3 w-full" :loading="loading" />
<VisitSource class="md:w-1/3 !md:mx-4 !md:my-0 !my-4 w-full" :loading="loading" />
<SalesProductPie class="md:w-1/3 w-full" :loading="loading" />
</div>
</div>
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { defineComponent, ref } from 'vue';
import GrowCard from './components/GrowCard.vue';
import AnalysisLine from './components/AnalysisLine.vue';
import AnalysisPie from './components/AnalysisPie.vue';
import AnalysisBar from './components/AnalysisBar.vue';
import TaskCard from './components/TaskCard.vue';
import FlowAnalysis from './components/FlowAnalysis';
import { CollapseContainer } from '/@/components/Container/index';
import { Row, Col } from 'ant-design-vue';
import { growCardList, taskList } from './data';
import SiteAnalysis from './components/SiteAnalysis.vue';
import VisitSource from './components/VisitSource.vue';
import VisitRadar from './components/VisitRadar.vue';
import SalesProductPie from './components/SalesProductPie.vue';
export default defineComponent({
components: {
GrowCard,
CollapseContainer,
AnalysisLine,
AnalysisPie,
AnalysisBar,
TaskCard,
FlowAnalysis,
[Row.name]: Row,
[Col.name]: Col,
SiteAnalysis,
VisitRadar,
VisitSource,
SalesProductPie,
},
setup() {
return { growCardList, taskList };
const loading = ref(true);
setTimeout(() => {
loading.value = false;
}, 1500);
return { loading };
},
});
</script>
<style lang="less" scoped>
.analysis {
width: 100%;
}
</style>
export interface GrowCardItem {
icon: string;
title: string;
price: number;
up: boolean;
mom: string;
percent: number;
}
export interface TaskItem {
percent: number;
status: 'success' | 'exception' | 'active';
updateTime: string;
title: string;
desc: string;
}
.house-wrap {
position: relative;
width: 600px;
height: 600px;
transform: scale(0.5);
.house {
position: absolute;
position: relative;
top: 50%;
left: 50%;
display: flex;
width: 400px;
height: 300px;
transform: translateX(-50%) translateY(-13%);
justify-content: center;
perspective: 200px;
}
.floor {
position: absolute;
bottom: 0;
display: flex;
width: 95%;
height: 30px;
background-color: #e1f6fd;
border: 4px solid #314b70;
border-top-right-radius: 4px;
border-top-left-radius: 4px;
box-shadow: inset 4px 4px 0 #fffdff;
justify-content: center;
}
.floor::before,
.floor::after {
position: absolute;
bottom: 0;
width: 32%;
height: 60%;
background-image: linear-gradient(to bottom, #e0f5fc 50%, #aac4d0 50%);
border-top: 4px solid #314b70;
border-right: 4px solid #314b70;
border-left: 4px solid #314b70;
border-top-right-radius: 4px;
border-top-left-radius: 4px;
content: '';
box-shadow: 4px 0 0 #aac4d0;
}
.floor::after {
top: 0;
width: 25%;
height: 40%;
border-top: none;
border-top-right-radius: 0;
border-top-left-radius: 0;
}
.wall {
position: absolute;
bottom: 30px;
display: flex;
width: 91%;
height: 175px;
overflow: hidden;
background: #c3e0e7;
border-right: 4px solid #314b70;
border-left: 4px solid #314b70;
justify-content: space-between;
align-items: flex-end;
}
.window {
position: relative;
width: 34%;
height: 125px;
background: #aac4d0;
border-top: 4px solid #314b70;
border-right: 4px solid #314b70;
border-bottom: none;
border-left: none;
border-top-right-radius: 8px;
box-shadow: inset 0 4px 2px #e0f5fc;
}
.window::before {
position: absolute;
top: 6%;
left: 0;
width: 94%;
height: 88%;
background-image: linear-gradient(to top, #f3f6fa 47%, #9ab2d3 47%, #9ab2d3 50%, #f3f6fa 50%);
border-top: 4px solid #314b70;
border-right: 4px solid #314b70;
border-bottom: 4px solid #314b70;
border-left: none;
border-top-right-radius: 4px;
border-bottom-right-radius: 4px;
content: '';
}
.window::after {
position: absolute;
top: 19%;
left: 20%;
width: 30px;
height: 40px;
background-color: #f9aabe;
border: 4px solid #9ab2d3;
content: '';
}
.window:nth-of-type(3) {
border-top: none;
border-right: 4px solid #314b70;
border-bottom: 4px solid #314b70;
border-left: none;
border-top-right-radius: 0;
border-bottom-right-radius: 8px;
transform: rotateZ(180deg);
box-shadow: inset 0 -4px 2px #e0f5fc;
}
.window:nth-of-type(3)::after {
content: none;
}
.door {
display: flex;
width: 20%;
height: 130px;
padding-left: 8px;
background-color: #ffc26b;
border: 4px solid #314b70;
border-bottom: none;
border-top-right-radius: 10px;
border-top-left-radius: 10px;
box-shadow: inset 3px 3px #ffe0ad, inset -10px -8px #ffad61, 4px 0 #aac4d0;
flex-direction: column;
justify-content: space-evenly;
align-items: flex-start;
}
.door__square {
width: 85%;
height: 47px;
border: 4px solid #314b70;
border-radius: 4px;
box-shadow: inset 3px 3px #ffe0ad;
}
.door__line {
width: 25%;
height: 4px;
background: #314b70;
border-radius: 4px;
}
.top {
position: absolute;
width: 82%;
height: 30px;
background-color: #aac4d0;
border: 4px solid #314b70;
border-top-right-radius: 4px;
border-top-left-radius: 4px;
box-shadow: inset 4px 4px 0 #e1f6fd;
}
.circle {
position: absolute;
top: -10%;
display: flex;
width: 115px;
height: 115px;
background-color: #e0f5fc;
border: 4px solid #314b70;
border-radius: 50%;
content: '';
box-shadow: inset 4px 4px 0 #fffdff, inset 4px -4px 0 #fffdff, inset -4px 4px 0 #fffdff,
inset -4px -4px 0 #fffdff;
justify-content: center;
align-items: center;
}
.circle::before,
.circle::after {
position: absolute;
top: 35%;
width: 70%;
height: 4px;
background-color: #314b70;
content: '';
}
.circle::after {
top: 20%;
width: 35%;
}
.plastic {
position: absolute;
top: 30%;
z-index: 100;
width: 100%;
height: 30px;
overflow: hidden;
}
.plastic__g {
display: flex;
justify-content: center;
width: 100%;
overflow: hidden;
transform: translateY(-22px);
}
.plastic__item {
width: 43px;
height: 43px;
margin-bottom: 4px;
border: 3px solid #314b70;
border-radius: 50%;
box-shadow: 0 4px 0 #aac4d0;
}
.plastic__item:nth-child(odd) {
background: #0792d9;
box-shadow: 0 4px 0 #aac4d0, inset 4px 4px 0 #66c8fa;
}
.plastic__item:nth-child(even) {
background: #fffdff;
}
.plastic__item:nth-of-type(1),
.plastic__item:nth-last-of-type(1) {
width: 45px;
height: 45px;
box-shadow: none;
box-shadow: inset 4px 4px 0 #66c8fa;
}
.plastic__item:nth-of-type(5) {
width: 45px;
height: 45px;
}
.line {
position: absolute;
top: 15px;
display: flex;
width: 90%;
height: 85px;
background-color: #e1f6fd;
border-right: 4px solid #314b70;
border-bottom: 4px solid #314b70;
border-left: 4px solid #314b70;
border-radius: 4px;
transform: rotateX(25deg);
transform-style: preserve-3d;
}
.line__item {
height: 100%;
flex-grow: 1;
border-right: 4px solid #314b70;
}
.line__item:nth-child(odd) {
background: #00affa;
box-shadow: inset 4px 4px 0 #66c8fa;
}
.line__item:nth-child(even) {
background: #fffdff;
}
.line__item:nth-last-of-type(1) {
border-right: none;
}
.line__item:nth-child(4),
.line__item:nth-child(5),
.line__item:nth-child(6) {
border-top: 6px solid #314b70;
}
.tree {
position: absolute;
bottom: 19%;
left: 10%;
display: flex;
width: 100px;
height: 165px;
background-color: #00d398;
border: 4px solid #314b70;
border-radius: 50px;
box-shadow: inset 4px 0 0 #77e4c6, inset -4px 0 0 #00a073;
animation: tree 1s linear alternate infinite;
justify-content: center;
transform-origin: 0% 100%;
}
.tree__item {
position: absolute;
bottom: -80px;
width: 4px;
height: 140px;
background: #314b70;
}
.tree__item:nth-of-type(2) {
bottom: 80px;
height: 40px;
border-radius: 20px;
box-shadow: 0 0 0 8px #77e4c6;
}
.tree__item:nth-of-type(2)::before {
position: absolute;
bottom: -45px;
left: -30px;
width: 20px;
height: 35px;
background-color: #77e4c6;
border-radius: 15px;
content: '';
}
.tree__item:nth-of-type(3) {
bottom: 20px;
left: 36%;
width: 4px;
height: 30px;
background-color: #314b70;
transform: rotateZ(-45deg);
}
.dot {
position: absolute;
bottom: 38px;
width: 100%;
height: 4px;
background-image: linear-gradient(
to right,
#314b70 10%,
transparent 10%,
transparent 11%,
#314b70 11%,
#314b70 85%,
transparent 85%,
transparent 86%,
#314b70 86%
);
}
.bush__item {
position: absolute;
bottom: 40px;
left: 18%;
width: 80px;
height: 60px;
background-color: #00d398;
border: 1px solid red;
border: 4px solid #314b70;
border-bottom: none;
border-top-right-radius: 100px;
border-top-left-radius: 50px;
box-shadow: inset 4px 0 0 #77e4c6, inset -4px 0 0 #00a073;
animation: bush 2s alternate infinite;
transform-origin: bottom center;
}
.bush__item:nth-of-type(2) {
left: 13%;
width: 50px;
height: 40px;
border-top-right-radius: 10px;
border-top-left-radius: 50px;
animation: tree 2s alternate reverse infinite 0.5s;
}
.bush__item::before {
position: absolute;
top: 10px;
left: 10px;
width: 20px;
height: 20px;
background: #77e4c6;
border-radius: 50%;
content: '';
}
.cloud {
position: absolute;
top: 200px;
left: 60px;
display: flex;
justify-content: center;
width: 85px;
height: 20px;
border-bottom: 4px solid #e1e8f2;
animation: cloud 4s infinite alternate;
}
.cloud:nth-of-type(2) {
top: 150px;
left: 50%;
animation: cloud 4s infinite reverse alternate 0.5s;
}
.cloud:nth-of-type(3) {
top: 250px;
left: 80%;
animation: cloud 4s ease infinite alternate 0.75s;
}
.cloud__item {
position: relative;
border-top: 20px solid #e1e8f2;
border-right: 20px solid transparent;
border-bottom: 20px solid transparent;
border-left: 20px solid #e1e8f2;
border-radius: 50%;
transform: rotateZ(45deg);
}
.cloud__item:nth-of-type(2) {
margin-top: 5px;
margin-left: -7px;
border-top: 15px solid #e1e8f2;
border-right: 15px solid transparent;
border-bottom: 15px solid transparent;
border-left: 15px solid #e1e8f2;
}
.bird {
position: absolute;
right: 10%;
bottom: 40%;
z-index: -1;
width: 20px;
height: 20px;
border-top: 4px solid #becde2;
border-left: 4px solid #becde2;
transform: rotateZ(-135deg);
animation: bird 1s ease alternate infinite;
}
.bird:nth-of-type(2) {
right: 20%;
bottom: 30%;
width: 15px;
height: 15px;
}
@keyframes bird {
0% {
transform: scaleY(0.7) rotateZ(-135deg) translateX(0) translateY(0) skew(-10deg, -10deg);
}
100% {
transform: scaleY(1) rotateZ(-135deg) translateX(50%) translateY(50%) skew(-10deg, -10deg);
}
}
@keyframes tree {
0% {
transform: scaleY(1);
}
100% {
transform: scaleY(0.975);
}
}
@keyframes bush {
0% {
transform: skewX(-2deg);
}
100% {
transform: skewX(5deg);
}
}
@keyframes cloud {
0% {
transform: translateX(-10%);
}
100% {
transform: translateX(20%);
}
}
}
<template>
<div class="house-wrap">
<div class="house">
<div class="floor"></div>
<div class="wall">
<div class="window"></div>
<div class="door">
<div class="door__square"></div>
<div class="door__line"></div>
<div class="door__square"></div>
</div>
<div class="window"></div>
</div>
<div class="top"></div>
<div class="circle"></div>
<div class="plastic">
<div class="plastic__g">
<div class="plastic__item"></div>
<div class="plastic__item"></div>
<div class="plastic__item"></div>
<div class="plastic__item"></div>
<div class="plastic__item"></div>
<div class="plastic__item"></div>
<div class="plastic__item"></div>
<div class="plastic__item"></div>
</div>
</div>
<div class="line">
<div class="line__item"></div>
<div class="line__item"></div>
<div class="line__item"></div>
<div class="line__item"></div>
<div class="line__item"></div>
<div class="line__item"></div>
<div class="line__item"></div>
<div class="line__item"></div>
<div class="line__item"></div>
</div>
</div>
<div class="clouds">
<div class="cloud">
<div class="cloud__item"></div>
<div class="cloud__item"></div>
</div>
<div class="cloud">
<div class="cloud__item"></div>
<div class="cloud__item"></div>
</div>
<div class="cloud">
<div class="cloud__item"></div>
<div class="cloud__item"></div>
</div>
<div class="bird"></div>
</div>
<div class="birds">
<div class="bird"></div>
<div class="bird"></div>
</div>
<div class="tree">
<div class="tree__item"></div>
<div class="tree__item"></div>
<div class="tree__item"></div>
</div>
<div class="bush">
<div class="bush__item"></div>
<div class="bush__item"></div>
</div>
<div class="dot"></div>
</div>
</template>
<script lang="ts">
import type { PropType } from 'vue';
import { defineComponent } from 'vue';
export default defineComponent({
name: 'House',
props: {
size: {
type: Number as PropType<number>,
default: 600,
},
},
setup() {
return {};
},
});
</script>
<style lang="less" scoped>
@import './index.less';
</style>
<template>
<div class="welcome">
<House />
</div>
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import House from '../house/index.vue';
export default defineComponent({
name: 'Welcome',
components: { House },
});
</script>
<style lang="less" scoped>
.welcome {
display: flex;
width: 100%;
height: 100%;
justify-content: center;
align-items: center;
}
</style>
<template>
<Card title="最新动态" v-bind="$attrs">
<template #extra>
<a-button type="link" size="small">更多</a-button>
</template>
<List item-layout="horizontal" :data-source="items">
<template #renderItem="{ item }">
<ListItem>
<ListItemMeta>
<template #description>
{{ item.date }}
</template>
<template #title> {{ item.name }} <span v-html="item.desc"> </span> </template>
<template #avatar>
<Icon :icon="item.avatar" :size="30" />
</template>
</ListItemMeta>
</ListItem>
</template>
</List>
</Card>
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { Card, List } from 'ant-design-vue';
import { dynamicInfoItems } from './data';
import headerImg from '/@/assets/images/header.jpg';
import { Icon } from '/@/components/Icon';
export default defineComponent({
components: { Card, List, ListItem: List.Item, ListItemMeta: List.Item.Meta, Icon },
setup() {
return { items: dynamicInfoItems, headerImg };
},
});
</script>
<template>
<CollapseContainer class="news-list" title="动态" :canExpan="false">
<ScrollContainer>
<List>
<template v-for="item in newList" :key="item.id">
<ListItem class="news-list__item">
<ListItemMeta>
<template #avatar>
<img :src="headerImg" class="news-list__item-avatar" />
</template>
<template #description>
<div class="news-list__item-desc">
<div class="news-list__item-time mb-1">
{{ item.sendTime }}
</div>
<div class="news-list__item-title mb-1">
<span class="news-list__item-light">{{ item.sender }}&nbsp;</span>申请迭代
<span class="news-list__item-light">&nbsp;{{ item.title }}&nbsp;</span>发布
</div>
<div class="news-list__item-cnte p-2">
<span class="news-list__item-cnte__title"> {{ item.cnteId }}</span>
<br />
Status: {{ item.cnteStas }}
<br />
Repository: {{ item.cnteRepo }}
<br />
</div>
</div>
</template>
</ListItemMeta>
</ListItem>
</template>
</List>
</ScrollContainer>
</CollapseContainer>
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { List } from 'ant-design-vue';
import { CollapseContainer, ScrollContainer } from '/@/components/Container/index';
import headerImg from '/@/assets/images/header.jpg';
import { newList } from '../data';
export default defineComponent({
components: {
List,
ListItem: List.Item,
ListItemMeta: List.Item.Meta,
CollapseContainer,
ScrollContainer,
},
setup() {
return { newList, headerImg };
},
});
</script>
<style lang="less" scoped>
.news-list {
&__item {
&-avatar {
width: 35px;
height: 35px;
border-radius: 50%;
}
&-title {
font-size: 14px;
line-height: 22px;
color: #000;
opacity: 0.65;
}
&-time {
font-size: 14px;
line-height: 22px;
color: #000;
opacity: 0.45;
}
&-light {
font-size: 14px;
line-height: 22px;
color: #000;
opacity: 0.85;
}
&-cnte {
background: #eef3fb;
border-radius: 2px;
opacity: 0.6;
&__title {
font-size: 14px;
line-height: 22px;
color: rgba(0, 0, 0, 0.85);
}
}
}
}
</style>
<template>
<a-row class="prod-total">
<template v-for="(item, index) in wokbProd" :key="item.type">
<a-col :xs="12" :sm="6" class="prod-total__item" :class="`prod-total__item-${index}`">
<div class="img" :class="`prod-total__item-${index}-img`"></div>
<div>{{ item.amount }}</div>
<span>{{ item.type }}</span>
</a-col>
</template>
</a-row>
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { Row, Col } from 'ant-design-vue';
import { wokbProd } from '../data';
// import {ProdTypeEnum} from '@/api/dashboard/model/wokbModel'
export default defineComponent({
components: { [Row.name]: Row, [Col.name]: Col },
setup() {
return { wokbProd };
},
});
</script>
<style lang="less" scoped>
.prod-total {
padding: 12px 4px 12px 12px;
background: #fff;
&__item {
display: inline-block;
flex: 0 0 calc(25% - 8px);
padding: 20px 10px;
margin-right: 8px;
border-radius: 4px;
span {
font-size: 14px;
line-height: 28px;
}
div {
font-size: 26px;
}
.img {
float: left;
width: 62px;
height: 62px;
}
&-0 {
background: rgba(254, 97, 178, 0.1);
&-img {
background: url(../../../../assets/images/dashboard/wokb/datashow1.png) no-repeat;
}
div {
color: #fe61b2;
}
}
&-1 {
background: rgba(254, 163, 64, 0.1);
&-img {
background: url(../../../..//assets/images/dashboard/wokb/datashow2.png) no-repeat;
}
div {
color: #fea340;
}
}
&-2 {
background: rgba(172, 70, 255, 0.1);
&-img {
background: url(../../../..//assets/images/dashboard/wokb/datashow3.png) no-repeat;
}
div {
color: #9e55ff;
}
}
&-3 {
background: rgba(0, 196, 186, 0.1);
&-img {
background: url(../../../..//assets/images/dashboard/wokb/datashow4.png) no-repeat;
}
div {
color: #00c4ba;
}
}
}
}
</style>
<template>
<Card title="项目" v-bind="$attrs">
<template #extra>
<a-button type="link" size="small">更多</a-button>
</template>
<template v-for="item in items" :key="item">
<CardGrid class="!md:w-1/3 !w-full">
<span class="flex">
<Icon :icon="item.icon" :color="item.color" size="30" />
<span class="text-lg ml-4">{{ item.title }}</span>
</span>
<div class="flex mt-2 h-10 text-secondary"> {{ item.desc }} </div>
<div class="flex justify-between text-secondary">
<span>{{ item.group }}</span>
<span>{{ item.date }}</span>
</div>
</CardGrid>
</template>
</Card>
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { Card } from 'ant-design-vue';
import { Icon } from '/@/components/Icon';
import { groupItems } from './data';
export default defineComponent({
components: { Card, CardGrid: Card.Grid, Icon },
setup() {
return { items: groupItems };
},
});
</script>
<template>
<Card title="快捷导航" v-bind="$attrs">
<template v-for="item in items" :key="item">
<CardGrid>
<span class="flex flex-col items-center">
<Icon :icon="item.icon" :color="item.color" size="20" />
<span class="text-md mt-2">{{ item.title }}</span>
</span>
</CardGrid>
</template>
</Card>
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { Card } from 'ant-design-vue';
import { Icon } from '/@/components/Icon';
import { navItems } from './data';
export default defineComponent({
components: { Card, CardGrid: Card.Grid, Icon },
setup() {
return { items: navItems };
},
});
</script>
<template>
<Card title="销售统计" :loading="loading">
<div ref="chartRef" :style="{ width, height }"></div>
</Card>
</template>
<script lang="ts">
import { defineComponent, Ref, ref, watch } from 'vue';
import { Card } from 'ant-design-vue';
import { useECharts } from '/@/hooks/web/useECharts';
export default defineComponent({
components: { Card },
props: {
loading: Boolean,
width: {
type: String as PropType<string>,
default: '100%',
},
height: {
type: String as PropType<string>,
default: '400px',
},
},
setup(props) {
const chartRef = ref<HTMLDivElement | null>(null);
const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>);
watch(
() => props.loading,
() => {
if (props.loading) {
return;
}
setOptions({
backgroundColor: '#fff',
legend: {
bottom: 0,
data: ['Visits', 'Sales'],
},
tooltip: {},
radar: {
radius: '60%',
splitNumber: 8,
indicator: [
{
text: '2017',
max: 100,
},
{
text: '2017',
max: 100,
},
{
text: '2018',
max: 100,
},
{
text: '2019',
max: 100,
},
{
text: '2020',
max: 100,
},
{
text: '2021',
max: 100,
},
],
},
series: [
{
type: 'radar',
symbolSize: 0,
areaStyle: {
shadowBlur: 0,
shadowColor: 'rgba(0,0,0,.2)',
shadowOffsetX: 0,
shadowOffsetY: 10,
opacity: 1,
},
data: [
{
value: [90, 50, 86, 40, 50, 20],
name: 'Visits',
itemStyle: {
color: '#b6a2de',
},
},
{
value: [70, 75, 70, 76, 20, 85],
name: 'Sales',
itemStyle: {
color: '#67e0e3',
},
},
],
},
],
});
},
{ immediate: true }
);
return { chartRef };
},
});
</script>
<template>
<CollapseContainer class="shortcuts" title="快捷入口" :canExpan="false">
<template #action>
<a-button size="small" type="link"> 新建 </a-button>
</template>
<a-row>
<template v-for="item in shortCuts" :key="item.img">
<a-col :span="8" class="p-3 shortcuts__item">
<img :src="item.img" class="mb-2 shortcuts__item-img" />
<span>{{ item.name }}</span>
</a-col>
</template>
<a-col :span="8" class="p-3 shortcuts__item">
<span class="mb-2 shortcuts__item-all">
<RightOutlined />
</span>
<br />
<span>查看全部</span>
</a-col>
</a-row>
</CollapseContainer>
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { Row, Col } from 'ant-design-vue';
import { CollapseContainer } from '/@/components/Container/index';
import { RightOutlined } from '@ant-design/icons-vue';
import wokbImg1 from '/@/assets/images/dashboard/wokb/attendance.png';
import wokbImg2 from '/@/assets/images/dashboard/wokb/overtime.png';
import wokbImg3 from '/@/assets/images/dashboard/wokb/meal.png';
import wokbImg4 from '/@/assets/images/dashboard/wokb/leave.png';
import wokbImg5 from '/@/assets/images/dashboard/wokb/stamp.png';
import wokbImg6 from '/@/assets/images/dashboard/wokb/travel.png';
import wokbImg7 from '/@/assets/images/dashboard/wokb/performance.png';
import wokbImg8 from '/@/assets/images/dashboard/wokb/approve.png';
const shortCuts = [
{
img: wokbImg1,
name: '考勤记录',
},
{
img: wokbImg2,
name: '加班申请',
},
{
img: wokbImg3,
name: '餐补申请',
},
{
img: wokbImg4,
name: '请假',
},
{
img: wokbImg5,
name: '用章申请',
},
{
img: wokbImg6,
name: '差旅报销',
},
{
img: wokbImg7,
name: '绩效申请',
},
{
img: wokbImg8,
name: '审批',
},
];
export default defineComponent({
components: { [Row.name]: Row, [Col.name]: Col, CollapseContainer, RightOutlined },
setup() {
return { shortCuts };
},
});
</script>
<style lang="less" scoped>
.shortcuts {
&__item {
text-align: center;
&-img {
width: 36px;
margin-left: auto;
margin-right: auto;
}
&-all {
display: inline-block;
width: 36px;
height: 36px;
line-height: 36px;
color: #000;
cursor: pointer;
background: lightgrey;
border-radius: 50%;
}
}
}
</style>
<template>
<CollapseContainer class="todo-list" title="待办事项" :canExpan="false">
<template #title>
<span> 待办事项 <span class="todo-list__total">30</span> </span>
</template>
<List>
<template v-for="item in todoList" :key="item.id">
<ListItem class="todo-list__item">
<ListItemMeta>
<template #title>
<div>
<span class="todo-list__item-title">{{ item.title }}</span>
<span class="todo-list__item-memo">{{ item.memo }}</span>
</div>
</template>
<template #description>
<div class="todo-list__item-desc">
提交人:{{ item.sbmter }}
<br />
提交时间:{{ item.sbmtTime }}
</div>
</template>
</ListItemMeta>
<a-button type="link">
<Tag color="blue"> 待审批 </Tag>
</a-button>
</ListItem>
</template>
</List>
<div class="todo-list__all">
<Tooltip placement="topRight">
<template #title> 查看更多 </template>
<EllipsisOutlined />
</Tooltip>
</div>
</CollapseContainer>
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { List, Tag, Tooltip } from 'ant-design-vue';
import { CollapseContainer } from '/@/components/Container/index';
import { EllipsisOutlined } from '@ant-design/icons-vue';
import { todoList } from '../data';
export default defineComponent({
name: 'TodoList',
components: {
CollapseContainer,
List,
ListItem: List.Item,
ListItemMeta: List.Item.Meta,
Tag,
Tooltip,
EllipsisOutlined,
},
setup() {
return { todoList };
},
});
</script>
<style lang="less" scoped>
.todo-list {
position: relative;
&__total {
display: inline-block;
width: 20px;
height: 20px;
font-size: 12px;
line-height: 20px;
color: #fff;
text-align: center;
background: rgba(255, 0, 0, 0.7);
border-radius: 50%;
}
&__all {
position: absolute;
top: 0;
right: 10px;
height: 56px;
font-size: 24px;
line-height: 56px;
text-align: center;
cursor: pointer;
}
&__item {
padding: 8px;
&-title {
font-size: 14px;
font-weight: normal;
line-height: 22px;
color: #1c1d21;
}
&-memo {
font-size: 12px;
font-weight: normal;
line-height: 22px;
color: #7c8087;
}
&-desc {
font-size: 12px;
line-height: 22px;
color: #7c8087;
}
}
}
</style>
<template>
<div class="lg:flex">
<Avatar :src="headerImg" :size="72" class="!mx-auto !block" />
<div class="md:ml-6 flex flex-col justify-center md:mt-0 mt-2">
<h1 class="md:text-lg text-md">早安, Vben, 开始您一天的工作吧!</h1>
<span class="text-secondary"> 今日晴,20℃ - 32℃! </span>
</div>
<div class="flex flex-1 justify-end md:mt-0 mt-4">
<div class="flex flex-col justify-center text-right">
<span class="text-secondary"> 待办 </span>
<span class="text-2xl">2/10</span>
</div>
<div class="flex flex-col justify-center text-right md:mx-16 mx-12">
<span class="text-secondary"> 项目 </span>
<span class="text-2xl">8</span>
</div>
<div class="flex flex-col justify-center text-right md:mr-10 mr-4">
<span class="text-secondary"> 团队 </span>
<span class="text-2xl">300</span>
</div>
</div>
</div>
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import { Avatar } from 'ant-design-vue';
import headerImg from '/@/assets/images/header.jpg';
export default defineComponent({
components: { Avatar },
setup() {
return { headerImg };
},
});
</script>
interface GroupItem {
title: string;
icon: string;
color: string;
desc: string;
date: string;
group: string;
}
interface NavItem {
title: string;
icon: string;
color: string;
}
interface DynamicInfoItem {
avatar: string;
name: string;
date: string;
desc: string;
}
export const navItems: NavItem[] = [
{
title: '首页',
icon: 'ion:home-outline',
color: '#1fdaca',
},
{
title: '仪表盘',
icon: 'ion:grid-outline',
color: '#bf0c2c',
},
{
title: '组件',
icon: 'ion:layers-outline',
color: '#e18525',
},
{
title: '系统管理',
icon: 'ion:settings-outline',
color: '#3fb27f',
},
{
title: '权限管理',
icon: 'ion:key-outline',
color: '#4daf1bc9',
},
{
title: '图表',
icon: 'ion:bar-chart-outline',
color: '#00d8ff',
},
];
export const dynamicInfoItems: DynamicInfoItem[] = [
{
avatar: 'dynamic-avatar-1|svg',
name: '威廉',
date: '刚刚',
desc: `在 <a>开源组</a> 创建了项目 <a>Vue</a>`,
},
{
avatar: 'dynamic-avatar-2|svg',
name: '艾文',
date: '1个小时前',
desc: `关注了 <a>威廉</a> `,
},
{
avatar: 'dynamic-avatar-3|svg',
name: '克里斯',
date: '1天前',
desc: `发布了 <a>个人动态</a> `,
},
{
avatar: 'dynamic-avatar-4|svg',
name: 'Vben',
date: '2天前',
desc: `发表文章 <a>如何编写一个Vite插件</a> `,
},
{
avatar: 'dynamic-avatar-5|svg',
name: '皮特',
date: '3天前',
desc: `回复了 <a>杰克</a> 的问题 <a>如何进行项目优化?</a>`,
},
{
avatar: 'dynamic-avatar-6|svg',
name: '杰克',
date: '1周前',
desc: `关闭了问题 <a>如何运行项目</a> `,
},
{
avatar: 'dynamic-avatar-1|svg',
name: '威廉',
date: '1周前',
desc: `发布了 <a>个人动态</a> `,
},
{
avatar: 'dynamic-avatar-1|svg',
name: '威廉',
date: '2021-04-01 20:00',
desc: `推送了代码到 <a>Github</a>`,
},
];
export const groupItems: GroupItem[] = [
{
title: 'Github',
icon: 'carbon:logo-github',
color: '',
desc: '不要等待机会,而要创造机会。',
group: '开源组',
date: '2021-04-01',
},
{
title: 'Vue',
icon: 'ion:logo-vue',
color: '#3fb27f',
desc: '现在的你决定将来的你。',
group: '算法组',
date: '2021-04-01',
},
{
title: 'Html5',
icon: 'ion:logo-html5',
color: '#e18525',
desc: '没有什么才能比努力更重要。',
group: '上班摸鱼',
date: '2021-04-01',
},
{
title: 'Angular',
icon: 'ion:logo-angular',
color: '#bf0c2c',
desc: '热情和欲望可以突破一切难关。',
group: 'UI',
date: '2021-04-01',
},
{
title: 'React',
icon: 'bx:bxl-react',
color: '#00d8ff',
desc: '健康的身体是实目标的基石。',
group: '技术牛',
date: '2021-04-01',
},
{
title: 'Js',
icon: 'ion:logo-javascript',
color: '#4daf1bc9',
desc: '路是走出来的,而不是空想出来的。',
group: '架构组',
date: '2021-04-01',
},
];
export const wokbProd = [
{
amount: '20',
type: '成品总数',
},
{
amount: '50',
type: '未发布',
},
{
amount: '80',
type: '发布中',
},
{
amount: '100',
type: '异常',
},
];
export const todoList = (() => {
const ret: any[] = [];
for (let index = 0; index < 3; index++) {
ret.push({
id: index,
sbmter: '张三',
sbmtTime: new Date().toLocaleString(),
title: '主要',
memo: '工作任务',
});
}
return ret;
})();
export const newList = (() => {
const ret: any[] = [];
for (let index = 0; index < 3; index++) {
ret.push({
id: index,
sender: '李四',
sendTime: new Date().toLocaleString(),
title: '代码',
memo: '工作任务',
cnteId: `c${index}`,
cnteStas: 'opened',
cnteRepo: index,
});
}
return ret;
})();
<template>
<a-row class="workbench p-4" :gutter="12">
<a-col :md="24" :lg="17">
<ProdTotal class="mb-3" />
<TodoList class="mb-3" />
<NewsList class="mb-3" />
</a-col>
<a-col :md="24" :lg="7">
<img src="/@/assets/images/dashboard/wokb/wokb.png" class="workbench__wokb-img mb-3" />
<ShortCuts class="mb-3" />
<Week class="mb-3" />
</a-col>
</a-row>
<PageWrapper>
<template #headerContent> <WorkbenchHeader /> </template>
<div class="lg:flex">
<div class="lg:w-7/10 w-full !mr-4 enter-y">
<ProjectCard :loading="loading" class="enter-y" />
<DynamicInfo :loading="loading" class="!my-4 enter-y" />
</div>
<div class="lg:w-3/10 w-full enter-y">
<QuickNav :loading="loading" class="enter-y" />
<Card class="!my-4 enter-y" :loading="loading">
<img class="xl:h-50 h-30 mx-auto" src="../../../assets/svg/illustration.svg" />
</Card>
<SaleRadar :loading="loading" class="enter-y" />
</div>
</div>
</PageWrapper>
</template>
<script lang="ts">
import { defineComponent } from 'vue';
import ProdTotal from './components/ProdTotal.vue';
import TodoList from './components/TodoList.vue';
import Week from './components/Week.vue';
import NewsList from './components/NewsList.vue';
import ShortCuts from './components/ShortCuts.vue';
import { Row, Col } from 'ant-design-vue';
import { defineComponent, ref } from 'vue';
import { Card } from 'ant-design-vue';
import { PageWrapper } from '/@/components/Page';
import WorkbenchHeader from './components/WorkbenchHeader.vue';
import ProjectCard from './components/ProjectCard.vue';
import QuickNav from './components/QuickNav.vue';
import DynamicInfo from './components/DynamicInfo.vue';
import SaleRadar from './components/SaleRadar.vue';
export default defineComponent({
components: {
ProdTotal,
TodoList,
Week,
ShortCuts,
NewsList,
[Row.name]: Row,
[Col.name]: Col,
PageWrapper,
WorkbenchHeader,
ProjectCard,
QuickNav,
DynamicInfo,
SaleRadar,
Card,
},
setup() {
return {};
const loading = ref(true);
setTimeout(() => {
loading.value = false;
}, 1500);
return {
loading,
};
},
});
</script>
<style lang="less" scoped>
.workbench {
&__wokb-img {
width: 100%;
height: 240px;
}
}
</style>
<template>
<Card title="销售统计" :loading="loading">
<div ref="chartRef" :style="{ width, height }"></div>
</Card>
</template>
<script lang="ts">
import { defineComponent, Ref, ref, watch } from 'vue';
import { Card } from 'ant-design-vue';
import { useECharts } from '/@/hooks/web/useECharts';
export default defineComponent({
components: { Card },
props: {
loading: Boolean,
width: {
type: String as PropType<string>,
default: '100%',
},
height: {
type: String as PropType<string>,
default: '400px',
},
},
setup(props) {
const chartRef = ref<HTMLDivElement | null>(null);
const { setOptions } = useECharts(chartRef as Ref<HTMLDivElement>);
watch(
() => props.loading,
() => {
if (props.loading) {
return;
}
setOptions({
backgroundColor: '#fff',
legend: {
bottom: 0,
data: ['Visits', 'Sales'],
},
tooltip: {},
radar: {
radius: '60%',
splitNumber: 8,
indicator: [
{
text: '2017',
max: 100,
},
{
text: '2017',
max: 100,
},
{
text: '2018',
max: 100,
},
{
text: '2019',
max: 100,
},
{
text: '2020',
max: 100,
},
{
text: '2021',
max: 100,
},
],
},
series: [
{
type: 'radar',
symbolSize: 0,
areaStyle: {
shadowBlur: 0,
shadowColor: 'rgba(0,0,0,.2)',
shadowOffsetX: 0,
shadowOffsetY: 10,
opacity: 1,
},
data: [
{
value: [90, 50, 86, 40, 50, 20],
name: 'Visits',
itemStyle: {
color: '#9f8ed7',
},
},
{
value: [70, 75, 70, 76, 20, 85],
name: 'Sales',
itemStyle: {
color: '#1edec5',
},
},
],
},
],
});
},
{ immediate: true }
);
return { chartRef };
},
});
</script>
<template>
<CollapseContainer title="销售统计" :canExpan="false">
<div ref="chartRef" :style="{ width: '100%' }"></div>
</CollapseContainer>
<div ref="chartRef" :style="{ width: '100%' }"></div>
</template>
<script lang="ts">
import { defineComponent, Ref, ref, onMounted } from 'vue';
import { CollapseContainer } from '/@/components/Container/index';
import { useApexCharts } from '/@/hooks/web/useApexCharts';
export default defineComponent({
components: { CollapseContainer },
setup() {
const chartRef = ref<HTMLDivElement | null>(null);
const { setOptions } = useApexCharts(chartRef as Ref<HTMLDivElement>);
......@@ -20,59 +16,31 @@
{ name: 'Visits', data: [90, 50, 86, 40, 100, 20] },
{ name: 'Sales', data: [70, 75, 70, 76, 20, 85] },
],
dataLabels: {
style: {
colors: ['#b9c3cd', '#b9c3cd', '#b9c3cd', '#b9c3cd', '#b9c3cd', '#b9c3cd'],
},
},
chart: {
height: 350,
type: 'radar',
dropShadow: {
enabled: true,
blur: 1,
left: 1,
top: 1,
toolbar: {
show: false,
},
},
yaxis: {
show: false,
},
grid: {
show: false,
},
legend: { show: false },
title: {
show: false,
},
tooltip: {
x: { show: false },
},
markers: {
size: 0,
// size: 0,
},
xaxis: {
categories: ['2011', '2012', '2013', '2014', '2015', '2016'],
categories: ['2016', '2017', '2018', '2019', '2020', '2021'],
},
stroke: {
width: 0,
},
colors: ['#9f8ed7', '#1edec5'],
plotOptions: {
radar: {
polygons: {
strokeColors: [
'#e8e8e8',
'transparent',
'transparent',
'transparent',
'transparent',
'transparent',
],
connectorColors: 'transparent',
},
},
},
fill: {
type: 'gradient',
gradient: {
......
......@@ -12,6 +12,9 @@
<div class="demo-box">
<Mixed />
</div>
<div class="demo-box">
<SaleRadar />
</div>
</div>
</template>
<script>
......@@ -21,8 +24,9 @@
import Bar from './Bar.vue';
import Area from './Area.vue';
import Mixed from './Mixed.vue';
import SaleRadar from './SaleRadar.vue';
export default defineComponent({
components: { Line, Bar, Area, Mixed },
components: { Line, Bar, Area, Mixed, SaleRadar },
setup() {},
});
</script>
......
<template>
<PageWrapper title="图片裁剪示例" contentBackground>
<CropperImage src="https://fengyuanchen.github.io/cropperjs/images/picture.jpg"></CropperImage>
<CropperImage src="https://fengyuanchen.github.io/cropperjs/images/picture.jpg" />
</PageWrapper>
</template>
<script lang="ts">
......
......@@ -24,6 +24,9 @@
<CollapseContainer title="svg 雪碧图" class="my-5">
<div class="flex justify-around flex-wrap">
<SvgIcon name="test" size="32" />
<template v-for="item in 6" :key="item">
<SvgIcon :name="`dynamic-avatar-${item}`" size="32" />
</template>
</div>
</CollapseContainer>
......
......@@ -6,7 +6,7 @@
<a-col :span="8">
<div :class="`${prefixCls}-top__avatar`">
<img width="70" :src="headerImg" />
<span>Serati Ma</span>
<span>Vben</span>
<div>海纳百川,有容乃大</div>
</div>
</a-col>
......
......@@ -85,7 +85,7 @@ export default ({ command, mode }: ConfigEnv): UserConfig => {
'ant-design-vue/es/locale/en_US',
'moment/dist/locale/eu',
],
exclude: ['vue-demi', 'consolidate'],
exclude: ['vue-demi'],
},
};
};
......@@ -12,6 +12,7 @@ export default defineConfig({
colors: {
...colors,
primary: primaryColor,
secondary: 'rgba(0, 0, 0, 0.45)',
},
screens: {
sm: '576px',
......
此差异已折叠。
Markdown is supported
0% .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑!
想要评论请 注册