init
This commit is contained in:
commit
655f0c2063
6
.env
Normal file
6
.env
Normal file
@ -0,0 +1,6 @@
|
||||
# 后台接口地址(仅开发/预览环境生效)
|
||||
VITE_PROXY_API=http://localhost/Aerwen/heart_cabin/heart_cabin_api/public/admin.php/
|
||||
# 后台图片地址(仅开发/预览环境生效)
|
||||
VITE_PROXY_UPLOADS=http://localhost/Aerwen/heart_cabin/heart_cabin_api/public/uploads/
|
||||
# 后台富文本上传地址(仅开发/预览环境生效)
|
||||
VITE_PROXY_RICHTEXT=http://localhost:3000/api/
|
||||
17
.gitignore
vendored
Normal file
17
.gitignore
vendored
Normal file
@ -0,0 +1,17 @@
|
||||
node_modules
|
||||
package-lock.json
|
||||
.DS_Store
|
||||
dist
|
||||
dist-ssr
|
||||
*.local
|
||||
|
||||
# lock
|
||||
# yarn.lock
|
||||
# package-lock.json
|
||||
# pnpm-lock.yaml
|
||||
|
||||
*.log
|
||||
|
||||
*.d.ts
|
||||
|
||||
.env.development.local
|
||||
10
.prettierrc.json
Normal file
10
.prettierrc.json
Normal file
@ -0,0 +1,10 @@
|
||||
{
|
||||
"semi": true,
|
||||
"eslintIntegration": true,
|
||||
"singleQuote": true,
|
||||
"endOfLine": "lf",
|
||||
"tabWidth": 2,
|
||||
"trailingComma": "none",
|
||||
"bracketSpacing": true,
|
||||
"arrowParens": "avoid"
|
||||
}
|
||||
3
.vscode/settings.json
vendored
Normal file
3
.vscode/settings.json
vendored
Normal file
@ -0,0 +1,3 @@
|
||||
{
|
||||
"nuxt.isNuxtApp": false
|
||||
}
|
||||
92
README.md
Normal file
92
README.md
Normal file
@ -0,0 +1,92 @@
|
||||
# rentalshop-web
|
||||
|
||||
快转铺后台-后台页面
|
||||
|
||||
## Getting started
|
||||
|
||||
To make it easy for you to get started with GitLab, here's a list of recommended next steps.
|
||||
|
||||
Already a pro? Just edit this README.md and make it your own. Want to make it easy? [Use the template at the bottom](#editing-this-readme)!
|
||||
|
||||
## Add your files
|
||||
|
||||
- [ ] [Create](https://docs.gitlab.com/ee/user/project/repository/web_editor.html#create-a-file) or [upload](https://docs.gitlab.com/ee/user/project/repository/web_editor.html#upload-a-file) files
|
||||
- [ ] [Add files using the command line](https://docs.gitlab.com/ee/gitlab-basics/add-file.html#add-a-file-using-the-command-line) or push an existing Git repository with the following command:
|
||||
|
||||
```
|
||||
cd existing_repo
|
||||
git remote add origin http://172.20.80.175:28000/kongwu/rentalshop-web.git
|
||||
git branch -M main
|
||||
git push -uf origin main
|
||||
```
|
||||
|
||||
## Integrate with your tools
|
||||
|
||||
- [ ] [Set up project integrations](http://172.20.80.175:28000/kongwu/rentalshop-web/-/settings/integrations)
|
||||
|
||||
## Collaborate with your team
|
||||
|
||||
- [ ] [Invite team members and collaborators](https://docs.gitlab.com/ee/user/project/members/)
|
||||
- [ ] [Create a new merge request](https://docs.gitlab.com/ee/user/project/merge_requests/creating_merge_requests.html)
|
||||
- [ ] [Automatically close issues from merge requests](https://docs.gitlab.com/ee/user/project/issues/managing_issues.html#closing-issues-automatically)
|
||||
- [ ] [Enable merge request approvals](https://docs.gitlab.com/ee/user/project/merge_requests/approvals/)
|
||||
- [ ] [Automatically merge when pipeline succeeds](https://docs.gitlab.com/ee/user/project/merge_requests/merge_when_pipeline_succeeds.html)
|
||||
|
||||
## Test and Deploy
|
||||
|
||||
Use the built-in continuous integration in GitLab.
|
||||
|
||||
- [ ] [Get started with GitLab CI/CD](https://docs.gitlab.com/ee/ci/quick_start/index.html)
|
||||
- [ ] [Analyze your code for known vulnerabilities with Static Application Security Testing(SAST)](https://docs.gitlab.com/ee/user/application_security/sast/)
|
||||
- [ ] [Deploy to Kubernetes, Amazon EC2, or Amazon ECS using Auto Deploy](https://docs.gitlab.com/ee/topics/autodevops/requirements.html)
|
||||
- [ ] [Use pull-based deployments for improved Kubernetes management](https://docs.gitlab.com/ee/user/clusters/agent/)
|
||||
- [ ] [Set up protected environments](https://docs.gitlab.com/ee/ci/environments/protected_environments.html)
|
||||
|
||||
***
|
||||
|
||||
# Editing this README
|
||||
|
||||
When you're ready to make this README your own, just edit this file and use the handy template below (or feel free to structure it however you want - this is just a starting point!). Thank you to [makeareadme.com](https://www.makeareadme.com/) for this template.
|
||||
|
||||
## Suggestions for a good README
|
||||
Every project is different, so consider which of these sections apply to yours. The sections used in the template are suggestions for most open source projects. Also keep in mind that while a README can be too long and detailed, too long is better than too short. If you think your README is too long, consider utilizing another form of documentation rather than cutting out information.
|
||||
|
||||
## Name
|
||||
Choose a self-explaining name for your project.
|
||||
|
||||
## Description
|
||||
Let people know what your project can do specifically. Provide context and add a link to any reference visitors might be unfamiliar with. A list of Features or a Background subsection can also be added here. If there are alternatives to your project, this is a good place to list differentiating factors.
|
||||
|
||||
## Badges
|
||||
On some READMEs, you may see small images that convey metadata, such as whether or not all the tests are passing for the project. You can use Shields to add some to your README. Many services also have instructions for adding a badge.
|
||||
|
||||
## Visuals
|
||||
Depending on what you are making, it can be a good idea to include screenshots or even a video (you'll frequently see GIFs rather than actual videos). Tools like ttygif can help, but check out Asciinema for a more sophisticated method.
|
||||
|
||||
## Installation
|
||||
Within a particular ecosystem, there may be a common way of installing things, such as using Yarn, NuGet, or Homebrew. However, consider the possibility that whoever is reading your README is a novice and would like more guidance. Listing specific steps helps remove ambiguity and gets people to using your project as quickly as possible. If it only runs in a specific context like a particular programming language version or operating system or has dependencies that have to be installed manually, also add a Requirements subsection.
|
||||
|
||||
## Usage
|
||||
Use examples liberally, and show the expected output if you can. It's helpful to have inline the smallest example of usage that you can demonstrate, while providing links to more sophisticated examples if they are too long to reasonably include in the README.
|
||||
|
||||
## Support
|
||||
Tell people where they can go to for help. It can be any combination of an issue tracker, a chat room, an email address, etc.
|
||||
|
||||
## Roadmap
|
||||
If you have ideas for releases in the future, it is a good idea to list them in the README.
|
||||
|
||||
## Contributing
|
||||
State if you are open to contributions and what your requirements are for accepting them.
|
||||
|
||||
For people who want to make changes to your project, it's helpful to have some documentation on how to get started. Perhaps there is a script that they should run or some environment variables that they need to set. Make these steps explicit. These instructions could also be useful to your future self.
|
||||
|
||||
You can also document commands to lint the code or run tests. These steps help to ensure high code quality and reduce the likelihood that the changes inadvertently break something. Having instructions for running tests is especially helpful if it requires external setup, such as starting a Selenium server for testing in a browser.
|
||||
|
||||
## Authors and acknowledgment
|
||||
Show your appreciation to those who have contributed to the project.
|
||||
|
||||
## License
|
||||
For open source projects, say how it is licensed.
|
||||
|
||||
## Project status
|
||||
If you have run out of energy or time for your project, put a note at the top of the README saying that development has slowed down or stopped completely. Someone may choose to fork your project or volunteer to step in as a maintainer or owner, allowing your project to keep going. You can also make an explicit request for maintainers.
|
||||
129
index.html
Normal file
129
index.html
Normal file
@ -0,0 +1,129 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8" />
|
||||
<link rel="icon" href="/favicon.ico" />
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||
<title>心动小屋后台管理系统</title>
|
||||
<!-- element css cdn, if you use custom theme, remove it. -->
|
||||
<!-- <link
|
||||
rel="stylesheet"
|
||||
href="https://cdn.jsdelivr.net/npm/element-plus/dist/index.css"
|
||||
/> -->
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<div id="app">
|
||||
<style>
|
||||
.first-loading-wrap {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
height: 100vh;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
}
|
||||
|
||||
.first-loading-wrap>h1 {
|
||||
font-size: 128px
|
||||
}
|
||||
|
||||
.first-loading-wrap .loading-wrap {
|
||||
padding: 98px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center
|
||||
}
|
||||
|
||||
.dot {
|
||||
animation: antRotate 1.2s infinite linear;
|
||||
transform: rotate(45deg);
|
||||
position: relative;
|
||||
display: inline-block;
|
||||
font-size: 32px;
|
||||
width: 32px;
|
||||
height: 32px;
|
||||
box-sizing: border-box
|
||||
}
|
||||
|
||||
.dot i {
|
||||
width: 14px;
|
||||
height: 14px;
|
||||
position: absolute;
|
||||
display: block;
|
||||
background-color: #1890ff;
|
||||
border-radius: 100%;
|
||||
transform: scale(.75);
|
||||
transform-origin: 50% 50%;
|
||||
opacity: .3;
|
||||
animation: antSpinMove 1s infinite linear alternate
|
||||
}
|
||||
|
||||
.dot i:nth-child(1) {
|
||||
top: 0;
|
||||
left: 0
|
||||
}
|
||||
|
||||
.dot i:nth-child(2) {
|
||||
top: 0;
|
||||
right: 0;
|
||||
-webkit-animation-delay: .4s;
|
||||
animation-delay: .4s
|
||||
}
|
||||
|
||||
.dot i:nth-child(3) {
|
||||
right: 0;
|
||||
bottom: 0;
|
||||
-webkit-animation-delay: .8s;
|
||||
animation-delay: .8s
|
||||
}
|
||||
|
||||
.dot i:nth-child(4) {
|
||||
bottom: 0;
|
||||
left: 0;
|
||||
-webkit-animation-delay: 1.2s;
|
||||
animation-delay: 1.2s
|
||||
}
|
||||
|
||||
@keyframes antRotate {
|
||||
to {
|
||||
-webkit-transform: rotate(405deg);
|
||||
transform: rotate(405deg)
|
||||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes antRotate {
|
||||
to {
|
||||
-webkit-transform: rotate(405deg);
|
||||
transform: rotate(405deg)
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes antSpinMove {
|
||||
to {
|
||||
opacity: 1
|
||||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes antSpinMove {
|
||||
to {
|
||||
opacity: 1
|
||||
}
|
||||
}
|
||||
</style>
|
||||
<div class="first-loading-wrap">
|
||||
<div class="loading-wrap">
|
||||
<span class="dot dot-spin">
|
||||
<i></i>
|
||||
<i></i>
|
||||
<i></i>
|
||||
<i></i>
|
||||
</span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<script type="module" src="/src/main.ts"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
10
jsconfig.json
Normal file
10
jsconfig.json
Normal file
@ -0,0 +1,10 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"target": "es2020",
|
||||
"module": "es6",
|
||||
"paths": {
|
||||
"~/*": ["./src/*"]
|
||||
}
|
||||
},
|
||||
"include": ["src/**/*"]
|
||||
}
|
||||
57
package.json
Normal file
57
package.json
Normal file
@ -0,0 +1,57 @@
|
||||
{
|
||||
"name": "template",
|
||||
"private": true,
|
||||
"version": "0.1.0",
|
||||
"scripts": {
|
||||
"dev": "vite --host",
|
||||
"build": "vite build",
|
||||
"preview": "vite preview"
|
||||
},
|
||||
"browserslist": [
|
||||
"chrome > 70",
|
||||
"last 10 version",
|
||||
"> 1%",
|
||||
"not dead"
|
||||
],
|
||||
"dependencies": {
|
||||
"@amap/amap-jsapi-loader": "^1.0.1",
|
||||
"@element-plus/icons-vue": "^0.2.7",
|
||||
"@wangeditor/editor": "^5.1.23",
|
||||
"@wangeditor/editor-for-vue": "^5.1.12",
|
||||
"audit": "^0.0.6",
|
||||
"axios": "^0.26.1",
|
||||
"echarts": "^5.4.1",
|
||||
"element-plus": "^2.2.30",
|
||||
"highlight.js": "^11.7.0",
|
||||
"hyw-drag": "^1.0.0",
|
||||
"lodash": "^4.17.21",
|
||||
"moment": "^2.29.4",
|
||||
"nprogress": "^0.2.0",
|
||||
"pinia": "^2.0.32",
|
||||
"pinia-plugin-persist": "^1.0.0",
|
||||
"sortablejs": "^1.15.0",
|
||||
"vue": "^3.2.47",
|
||||
"vue-demi": "^0.13.11",
|
||||
"vue-router": "^4.1.6",
|
||||
"vuex": "^4.1.0",
|
||||
"wangeditor": "^4.7.15"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@types/node": "^17.0.45",
|
||||
"@vitejs/plugin-legacy": "^1.8.2",
|
||||
"@vitejs/plugin-vue": "^2.3.4",
|
||||
"@vitejs/plugin-vue-jsx": "^1.3.10",
|
||||
"@vue/compiler-sfc": "^3.2.47",
|
||||
"element-theme-chalk": "^2.15.13",
|
||||
"less": "^4.1.3",
|
||||
"less-loader": "^10.2.0",
|
||||
"prettier": "^2.8.4",
|
||||
"sass": "^1.58.2",
|
||||
"unplugin-auto-import": "^0.6.9",
|
||||
"unplugin-element-plus": "^0.3.4",
|
||||
"unplugin-vue-components": "^0.17.21",
|
||||
"vite": "^2.9.15",
|
||||
"vite-plugin-pages": "^0.23.0",
|
||||
"vue-tsc": "^0.31.4"
|
||||
}
|
||||
}
|
||||
BIN
public/document/后台管理平台初始化.pdf
Normal file
BIN
public/document/后台管理平台初始化.pdf
Normal file
Binary file not shown.
BIN
public/favicon.ico
Normal file
BIN
public/favicon.ico
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 66 KiB |
BIN
public/font/clock_word.TTF
Normal file
BIN
public/font/clock_word.TTF
Normal file
Binary file not shown.
BIN
public/images/login-background.jpg
Normal file
BIN
public/images/login-background.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 39 KiB |
BIN
public/images/login-captcha-icon.png
Normal file
BIN
public/images/login-captcha-icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 636 B |
BIN
public/images/login-left.png
Normal file
BIN
public/images/login-left.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.9 MiB |
BIN
public/images/login-password-icon.png
Normal file
BIN
public/images/login-password-icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 442 B |
BIN
public/images/login-user-icon.png
Normal file
BIN
public/images/login-user-icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 493 B |
BIN
public/images/logo_login.png
Normal file
BIN
public/images/logo_login.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 8.4 KiB |
BIN
public/img/home/Ellipse 82.png
Normal file
BIN
public/img/home/Ellipse 82.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 55 KiB |
BIN
public/img/home/Frame.png
Normal file
BIN
public/img/home/Frame.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.7 KiB |
BIN
public/img/home/Time icon.png
Normal file
BIN
public/img/home/Time icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.6 KiB |
0
public/img/home/img
Normal file
0
public/img/home/img
Normal file
BIN
public/img/home/上升.png
Normal file
BIN
public/img/home/上升.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.9 KiB |
BIN
public/img/home/分组 1 (10).png
Normal file
BIN
public/img/home/分组 1 (10).png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.2 KiB |
BIN
public/img/home/分组 1 (11).png
Normal file
BIN
public/img/home/分组 1 (11).png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 7.5 KiB |
BIN
public/img/home/分组 1 (12).png
Normal file
BIN
public/img/home/分组 1 (12).png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.3 KiB |
BIN
public/img/home/分组 1 (13).png
Normal file
BIN
public/img/home/分组 1 (13).png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 6.5 KiB |
BIN
public/img/home/图标.png
Normal file
BIN
public/img/home/图标.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 4.4 KiB |
BIN
public/img/home/图标（蓝）.png
Normal file
BIN
public/img/home/图标（蓝）.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.7 KiB |
BIN
public/img/home/矩形 2.png
Normal file
BIN
public/img/home/矩形 2.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.4 KiB |
BIN
public/logo.png
Normal file
BIN
public/logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 8.4 KiB |
38
src/App.vue
Normal file
38
src/App.vue
Normal file
@ -0,0 +1,38 @@
|
||||
<template>
|
||||
<el-config-provider :locale="zhCn">
|
||||
<router-view></router-view>
|
||||
</el-config-provider>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import zhCn from 'element-plus/lib/locale/lang/zh-cn';
|
||||
</script>
|
||||
|
||||
<style>
|
||||
.el-avatar {
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
white-space: nowrap;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
vertical-align: middle;
|
||||
width: 100px;
|
||||
height: 100px;
|
||||
line-height: 100px;
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.el-avatar-plus {
|
||||
display: inline-block;
|
||||
text-align: center;
|
||||
color: #fff;
|
||||
white-space: nowrap;
|
||||
position: relative;
|
||||
overflow: hidden;
|
||||
vertical-align: middle;
|
||||
min-width: 100px;
|
||||
min-height: 100px;
|
||||
border-radius: 10px;
|
||||
}
|
||||
</style>
|
||||
13681
src/assets/area.json
Normal file
13681
src/assets/area.json
Normal file
File diff suppressed because it is too large
Load Diff
100
src/assets/images/exception/403.svg
Normal file
100
src/assets/images/exception/403.svg
Normal file
@ -0,0 +1,100 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 456.01 262.12">
|
||||
<defs>
|
||||
<style>
|
||||
.cls-1,.cls-2,.cls-20,.cls-22,.cls-23,.cls-3,.cls-4,.cls-5,.cls-6{fill:none;stroke-miterlimit:10;}.cls-1,.cls-2,.cls-3,.cls-4,.cls-5,.cls-6{stroke-width:2px;}.cls-1{stroke:url(#未命名的渐变_26);}.cls-2{stroke:url(#未命名的渐变_26-2);}.cls-3{stroke:url(#未命名的渐变_26-3);}.cls-4{stroke:url(#未命名的渐变_26-4);}.cls-5{stroke:url(#未命名的渐变_26-5);}.cls-6{stroke:url(#未命名的渐变_26-6);}.cls-10,.cls-11,.cls-12,.cls-7,.cls-9{opacity:0.4;}.cls-7{fill:url(#未命名的渐变_26-7);}.cls-8{opacity:0.7;}.cls-9{fill:url(#未命名的渐变_26-8);}.cls-10{fill:url(#未命名的渐变_26-9);}.cls-11{fill:url(#未命名的渐变_26-10);}.cls-12{fill:url(#未命名的渐变_26-11);}.cls-13{fill:#2c94ee;}.cls-14{fill:#8cd7ff;}.cls-15{fill:#40a8f5;}.cls-16{fill:#fff;}.cls-17{fill:#ffb056;}.cls-18{fill:#398eed;}.cls-19{fill:#ffeed2;}.cls-20{stroke:#000;stroke-width:0.23px;}.cls-21{fill:#ebfcff;}.cls-22{stroke:#e49056;stroke-width:0.26px;}.cls-23{stroke:#4986d9;stroke-width:0.13px;}
|
||||
</style>
|
||||
<linearGradient id="未命名的渐变_26" x1="1" y1="91.35" x2="1" y2="181.12" gradientUnits="userSpaceOnUse">
|
||||
<stop offset="0" stop-color="#81cfff"/>
|
||||
<stop offset="1" stop-color="#5ecfff" stop-opacity="0"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="未命名的渐变_26-2" x1="455.01" y1="72.11" x2="455.01" y2="161.88" xlink:href="#未命名的渐变_26"/>
|
||||
<linearGradient id="未命名的渐变_26-3" x1="40.9" y1="143.88" x2="40.9" y2="199.51" xlink:href="#未命名的渐变_26"/>
|
||||
<linearGradient id="未命名的渐变_26-4" x1="64.97" y1="95.36" x2="64.97" y2="123.17" xlink:href="#未命名的渐变_26"/>
|
||||
<linearGradient id="未命名的渐变_26-5" x1="397.23" y1="104.2" x2="397.23" y2="132.02" xlink:href="#未命名的渐变_26"/>
|
||||
<linearGradient id="未命名的渐变_26-6" x1="424.75" y1="133.49" x2="424.75" y2="189.13" xlink:href="#未命名的渐变_26"/>
|
||||
<linearGradient id="未命名的渐变_26-7" x1="232.75" y1="224.43" x2="232.75" y2="262.12" xlink:href="#未命名的渐变_26"/>
|
||||
<linearGradient id="未命名的渐变_26-8" x1="349.36" y1="26.68" x2="349.36" y2="204.03" xlink:href="#未命名的渐变_26"/>
|
||||
<linearGradient id="未命名的渐变_26-9" x1="201.45" y1="55.61" x2="201.45" y2="204.03" xlink:href="#未命名的渐变_26"/>
|
||||
<linearGradient id="未命名的渐变_26-10" x1="122.98" y1="26.68" x2="122.98" y2="204.03" xlink:href="#未命名的渐变_26"/>
|
||||
<linearGradient id="未命名的渐变_26-11" x1="273.51" y1="0" x2="273.51" y2="209.54" xlink:href="#未命名的渐变_26"/>
|
||||
</defs>
|
||||
<title>无访问权限</title>
|
||||
<g id="图层_2" data-name="图层 2">
|
||||
<g id="图层_1-2" data-name="图层 1">
|
||||
<line class="cls-1" x1="1" y1="91.35" x2="1" y2="181.12"/>
|
||||
<line class="cls-2" x1="455.01" y1="72.11" x2="455.01" y2="161.88"/>
|
||||
<line class="cls-3" x1="40.9" y1="143.88" x2="40.9" y2="199.51"/>
|
||||
<line class="cls-4" x1="64.97" y1="95.36" x2="64.97" y2="123.17"/>
|
||||
<line class="cls-5" x1="397.23" y1="104.2" x2="397.23" y2="132.02"/>
|
||||
<line class="cls-6" x1="424.75" y1="133.49" x2="424.75" y2="189.13"/>
|
||||
<path class="cls-7" d="M412.28,262.12c-23-23-61-37.69-179.53-37.69S76.24,239.1,53.21,262.12Z"/>
|
||||
<g class="cls-8">
|
||||
<path class="cls-9"
|
||||
d="M380.66,26.68H318.07a2.71,2.71,0,0,0-2.82,2.59V201.44a2.71,2.71,0,0,0,2.82,2.59h62.59a2.72,2.72,0,0,0,2.82-2.59V29.27A2.72,2.72,0,0,0,380.66,26.68ZM328.3,147a.9.9,0,0,1-.95.87h-3.6a.9.9,0,0,1-.95-.87V127.27a.91.91,0,0,1,.95-.87h3.6a.91.91,0,0,1,.95.87Zm0-30.23a.91.91,0,0,1-.95.87h-3.6a.91.91,0,0,1-.95-.87V97a.91.91,0,0,1,.95-.87h3.6a.91.91,0,0,1,.95.87Zm0-30.24a.91.91,0,0,1-.95.87h-3.6a.91.91,0,0,1-.95-.87V66.8a.91.91,0,0,1,.95-.87h3.6a.91.91,0,0,1,.95.87Zm0-30.24a.91.91,0,0,1-.95.87h-3.6a.91.91,0,0,1-.95-.87V36.56a.91.91,0,0,1,.95-.87h3.6a.91.91,0,0,1,.95.87ZM340,147a.9.9,0,0,1-.94.87h-3.61a.91.91,0,0,1-.95-.87V127.27a.92.92,0,0,1,.95-.87h3.61a.91.91,0,0,1,.94.87Zm0-30.23a.91.91,0,0,1-.94.87h-3.61a.92.92,0,0,1-.95-.87V97a.92.92,0,0,1,.95-.87h3.61A.91.91,0,0,1,340,97Zm0-30.24a.91.91,0,0,1-.94.87h-3.61a.92.92,0,0,1-.95-.87V66.8a.92.92,0,0,1,.95-.87h3.61a.91.91,0,0,1,.94.87Zm0-30.24a.91.91,0,0,1-.94.87h-3.61a.92.92,0,0,1-.95-.87V36.56a.92.92,0,0,1,.95-.87h3.61a.91.91,0,0,1,.94.87ZM351.7,147a.9.9,0,0,1-.94.87h-3.61a.9.9,0,0,1-.94-.87V127.27a.91.91,0,0,1,.94-.87h3.61a.91.91,0,0,1,.94.87Zm0-30.23a.91.91,0,0,1-.94.87h-3.61a.91.91,0,0,1-.94-.87V97a.91.91,0,0,1,.94-.87h3.61a.91.91,0,0,1,.94.87Zm0-30.24a.91.91,0,0,1-.94.87h-3.61a.91.91,0,0,1-.94-.87V66.8a.91.91,0,0,1,.94-.87h3.61a.91.91,0,0,1,.94.87Zm0-30.24a.91.91,0,0,1-.94.87h-3.61a.91.91,0,0,1-.94-.87V36.56a.91.91,0,0,1,.94-.87h3.61a.91.91,0,0,1,.94.87ZM363.4,147a.9.9,0,0,1-.94.87h-3.61a.9.9,0,0,1-.94-.87V127.27a.91.91,0,0,1,.94-.87h3.61a.91.91,0,0,1,.94.87Zm0-30.23a.91.91,0,0,1-.94.87h-3.61a.91.91,0,0,1-.94-.87V97a.91.91,0,0,1,.94-.87h3.61a.91.91,0,0,1,.94.87Zm0-30.24a.91.91,0,0,1-.94.87h-3.61a.91.91,0,0,1-.94-.87V66.8a.91.91,0,0,1,.94-.87h3.61a.91.91,0,0,1,.94.87Zm0-30.24a.91.91,0,0,1-.94.87h-3.61a.91.91,0,0,1-.94-.87V36.56a.91.91,0,0,1,.94-.87h3.61a.91.91,0,0,1,.94.87ZM375.11,147a.91.91,0,0,1-.95.87h-3.61a.9.9,0,0,1-.94-.87V127.27a.91.91,0,0,1,.94-.87h3.61a.92.92,0,0,1,.95.87Zm0-30.23a.92.92,0,0,1-.95.87h-3.61a.91.91,0,0,1-.94-.87V97a.91.91,0,0,1,.94-.87h3.61a.92.92,0,0,1,.95.87Zm0-30.24a.92.92,0,0,1-.95.87h-3.61a.91.91,0,0,1-.94-.87V66.8a.91.91,0,0,1,.94-.87h3.61a.92.92,0,0,1,.95.87Zm0-30.24a.92.92,0,0,1-.95.87h-3.61a.91.91,0,0,1-.94-.87V36.56a.91.91,0,0,1,.94-.87h3.61a.92.92,0,0,1,.95.87Z"/>
|
||||
<path class="cls-10"
|
||||
d="M231.1,55.61H171.8A2.71,2.71,0,0,0,169,58.2V201.44A2.71,2.71,0,0,0,171.8,204h59.3a2.71,2.71,0,0,0,2.82-2.59V58.2A2.71,2.71,0,0,0,231.1,55.61ZM182.47,159.37a1.16,1.16,0,0,1-1.2,1.11h-5.4a1.16,1.16,0,0,1-1.2-1.11v-5.22a1.15,1.15,0,0,1,1.2-1.1h5.4a1.15,1.15,0,0,1,1.2,1.1Zm0-12.88a1.15,1.15,0,0,1-1.2,1.1h-5.4a1.15,1.15,0,0,1-1.2-1.1v-5.22a1.16,1.16,0,0,1,1.2-1.11h5.4a1.16,1.16,0,0,1,1.2,1.11Zm0-12.89a1.16,1.16,0,0,1-1.2,1.11h-5.4a1.16,1.16,0,0,1-1.2-1.11v-5.22a1.15,1.15,0,0,1,1.2-1.1h5.4a1.15,1.15,0,0,1,1.2,1.1Zm0-12.88a1.15,1.15,0,0,1-1.2,1.1h-5.4a1.15,1.15,0,0,1-1.2-1.1V115.5a1.16,1.16,0,0,1,1.2-1.11h5.4a1.16,1.16,0,0,1,1.2,1.11Zm0-12.89a1.16,1.16,0,0,1-1.2,1.11h-5.4a1.16,1.16,0,0,1-1.2-1.11v-5.21a1.15,1.15,0,0,1,1.2-1.11h5.4a1.15,1.15,0,0,1,1.2,1.11Zm0-12.88a1.15,1.15,0,0,1-1.2,1.1h-5.4a1.15,1.15,0,0,1-1.2-1.1V89.73a1.16,1.16,0,0,1,1.2-1.11h5.4a1.16,1.16,0,0,1,1.2,1.11Zm0-12.89a1.16,1.16,0,0,1-1.2,1.11h-5.4a1.16,1.16,0,0,1-1.2-1.11V76.85a1.15,1.15,0,0,1,1.2-1.11h5.4a1.15,1.15,0,0,1,1.2,1.11Zm0-12.88a1.15,1.15,0,0,1-1.2,1.1h-5.4a1.15,1.15,0,0,1-1.2-1.1V64a1.16,1.16,0,0,1,1.2-1.11h5.4a1.16,1.16,0,0,1,1.2,1.11Zm10.08,90.19a1.16,1.16,0,0,1-1.2,1.11H186a1.16,1.16,0,0,1-1.21-1.11v-5.22a1.16,1.16,0,0,1,1.21-1.1h5.4a1.15,1.15,0,0,1,1.2,1.1Zm0-12.88a1.15,1.15,0,0,1-1.2,1.1H186a1.16,1.16,0,0,1-1.21-1.1v-5.22a1.16,1.16,0,0,1,1.21-1.11h5.4a1.16,1.16,0,0,1,1.2,1.11Zm0-12.89a1.16,1.16,0,0,1-1.2,1.11H186a1.16,1.16,0,0,1-1.21-1.11v-5.22a1.16,1.16,0,0,1,1.21-1.1h5.4a1.15,1.15,0,0,1,1.2,1.1Zm0-12.88a1.15,1.15,0,0,1-1.2,1.1H186a1.16,1.16,0,0,1-1.21-1.1V115.5a1.16,1.16,0,0,1,1.21-1.11h5.4a1.16,1.16,0,0,1,1.2,1.11Zm0-12.89a1.16,1.16,0,0,1-1.2,1.11H186a1.16,1.16,0,0,1-1.21-1.11v-5.21a1.16,1.16,0,0,1,1.21-1.11h5.4a1.15,1.15,0,0,1,1.2,1.11Zm0-12.88a1.15,1.15,0,0,1-1.2,1.1H186a1.16,1.16,0,0,1-1.21-1.1V89.73A1.16,1.16,0,0,1,186,88.62h5.4a1.16,1.16,0,0,1,1.2,1.11Zm0-12.89a1.16,1.16,0,0,1-1.2,1.11H186a1.16,1.16,0,0,1-1.21-1.11V76.85A1.16,1.16,0,0,1,186,75.74h5.4a1.15,1.15,0,0,1,1.2,1.11Zm0-12.88a1.15,1.15,0,0,1-1.2,1.1H186a1.16,1.16,0,0,1-1.21-1.1V64A1.16,1.16,0,0,1,186,62.85h5.4a1.16,1.16,0,0,1,1.2,1.11Zm10.08,90.19a1.16,1.16,0,0,1-1.21,1.11H196a1.16,1.16,0,0,1-1.2-1.11v-5.22a1.15,1.15,0,0,1,1.2-1.1h5.4a1.16,1.16,0,0,1,1.21,1.1Zm0-12.88a1.16,1.16,0,0,1-1.21,1.1H196a1.15,1.15,0,0,1-1.2-1.1v-5.22a1.16,1.16,0,0,1,1.2-1.11h5.4a1.16,1.16,0,0,1,1.21,1.11Zm0-12.89a1.16,1.16,0,0,1-1.21,1.11H196a1.16,1.16,0,0,1-1.2-1.11v-5.22a1.15,1.15,0,0,1,1.2-1.1h5.4a1.16,1.16,0,0,1,1.21,1.1Zm0-12.88a1.16,1.16,0,0,1-1.21,1.1H196a1.15,1.15,0,0,1-1.2-1.1V115.5a1.16,1.16,0,0,1,1.2-1.11h5.4a1.16,1.16,0,0,1,1.21,1.11Zm0-12.89a1.16,1.16,0,0,1-1.21,1.11H196a1.16,1.16,0,0,1-1.2-1.11v-5.21a1.15,1.15,0,0,1,1.2-1.11h5.4a1.16,1.16,0,0,1,1.21,1.11Zm0-12.88a1.16,1.16,0,0,1-1.21,1.1H196a1.15,1.15,0,0,1-1.2-1.1V89.73a1.16,1.16,0,0,1,1.2-1.11h5.4a1.16,1.16,0,0,1,1.21,1.11Zm0-12.89a1.16,1.16,0,0,1-1.21,1.11H196a1.16,1.16,0,0,1-1.2-1.11V76.85a1.15,1.15,0,0,1,1.2-1.11h5.4a1.16,1.16,0,0,1,1.21,1.11Zm0-12.88a1.16,1.16,0,0,1-1.21,1.1H196a1.15,1.15,0,0,1-1.2-1.1V64a1.16,1.16,0,0,1,1.2-1.11h5.4A1.16,1.16,0,0,1,202.63,64Zm25.21,90.19a1.16,1.16,0,0,1-1.2,1.11H206.1a1.16,1.16,0,0,1-1.2-1.11v-5.22a1.15,1.15,0,0,1,1.2-1.1h20.54a1.15,1.15,0,0,1,1.2,1.1Zm0-12.88a1.15,1.15,0,0,1-1.2,1.1H206.1a1.15,1.15,0,0,1-1.2-1.1v-5.22a1.16,1.16,0,0,1,1.2-1.11h20.54a1.16,1.16,0,0,1,1.2,1.11Zm0-12.89a1.16,1.16,0,0,1-1.2,1.11H206.1a1.16,1.16,0,0,1-1.2-1.11v-5.22a1.15,1.15,0,0,1,1.2-1.1h20.54a1.15,1.15,0,0,1,1.2,1.1Zm0-12.88a1.15,1.15,0,0,1-1.2,1.1H206.1a1.15,1.15,0,0,1-1.2-1.1V115.5a1.16,1.16,0,0,1,1.2-1.11h20.54a1.16,1.16,0,0,1,1.2,1.11Zm0-12.89a1.16,1.16,0,0,1-1.2,1.11H206.1a1.16,1.16,0,0,1-1.2-1.11v-5.21a1.15,1.15,0,0,1,1.2-1.11h20.54a1.15,1.15,0,0,1,1.2,1.11Zm0-12.88a1.15,1.15,0,0,1-1.2,1.1H206.1a1.15,1.15,0,0,1-1.2-1.1V89.73a1.16,1.16,0,0,1,1.2-1.11h20.54a1.16,1.16,0,0,1,1.2,1.11Zm0-12.89a1.16,1.16,0,0,1-1.2,1.11H206.1a1.16,1.16,0,0,1-1.2-1.11V76.85a1.15,1.15,0,0,1,1.2-1.11h20.54a1.15,1.15,0,0,1,1.2,1.11Zm0-12.88a1.15,1.15,0,0,1-1.2,1.1H206.1a1.15,1.15,0,0,1-1.2-1.1V64a1.16,1.16,0,0,1,1.2-1.11h20.54a1.16,1.16,0,0,1,1.2,1.11Z"/>
|
||||
<path class="cls-11"
|
||||
d="M161.13,26.68H84.83A2.71,2.71,0,0,0,82,29.27V201.44A2.71,2.71,0,0,0,84.83,204h76.3a2.71,2.71,0,0,0,2.82-2.59V29.27A2.71,2.71,0,0,0,161.13,26.68ZM154.34,161a1.16,1.16,0,0,1-1.2,1.11H92.83A1.16,1.16,0,0,1,91.62,161v-5.21a1.16,1.16,0,0,1,1.21-1.11h60.31a1.15,1.15,0,0,1,1.2,1.11Zm0-14.67a1.15,1.15,0,0,1-1.2,1.1H92.83a1.16,1.16,0,0,1-1.21-1.1v-5.22A1.16,1.16,0,0,1,92.83,140h60.31a1.16,1.16,0,0,1,1.2,1.11Zm0-14.68a1.16,1.16,0,0,1-1.2,1.11H92.83a1.16,1.16,0,0,1-1.21-1.11v-5.22a1.16,1.16,0,0,1,1.21-1.1h60.31a1.15,1.15,0,0,1,1.2,1.1Zm0-14.68a1.16,1.16,0,0,1-1.2,1.11H92.83a1.16,1.16,0,0,1-1.21-1.11v-5.21a1.16,1.16,0,0,1,1.21-1.11h60.31a1.15,1.15,0,0,1,1.2,1.11Zm0-14.67a1.15,1.15,0,0,1-1.2,1.1H92.83a1.16,1.16,0,0,1-1.21-1.1V97a1.16,1.16,0,0,1,1.21-1.11h60.31a1.16,1.16,0,0,1,1.2,1.11Zm0-14.68a1.16,1.16,0,0,1-1.2,1.11H92.83a1.16,1.16,0,0,1-1.21-1.11V82.35a1.16,1.16,0,0,1,1.21-1.1h60.31a1.15,1.15,0,0,1,1.2,1.1Zm0-14.68a1.16,1.16,0,0,1-1.2,1.11H92.83a1.16,1.16,0,0,1-1.21-1.11V67.68a1.16,1.16,0,0,1,1.21-1.11h60.31a1.15,1.15,0,0,1,1.2,1.11Zm0-14.67a1.15,1.15,0,0,1-1.2,1.1H92.83a1.16,1.16,0,0,1-1.21-1.1V53a1.16,1.16,0,0,1,1.21-1.11h60.31a1.16,1.16,0,0,1,1.2,1.11Zm0-14.68a1.16,1.16,0,0,1-1.2,1.11H92.83a1.16,1.16,0,0,1-1.21-1.11V38.32a1.16,1.16,0,0,1,1.21-1.1h60.31a1.15,1.15,0,0,1,1.2,1.1Z"/>
|
||||
<path class="cls-12"
|
||||
d="M306.21,0H240.82a2.51,2.51,0,0,0-2.42,2.59V206.94a2.51,2.51,0,0,0,2.42,2.6h65.39a2.51,2.51,0,0,0,2.41-2.6V2.59A2.51,2.51,0,0,0,306.21,0Zm-5.82,134.28a1.06,1.06,0,0,1-1,1.1H247.67a1.06,1.06,0,0,1-1-1.1v-5.22a1.07,1.07,0,0,1,1-1.11h51.69a1.07,1.07,0,0,1,1,1.11Zm0-14.68a1.07,1.07,0,0,1-1,1.11H247.67a1.07,1.07,0,0,1-1-1.11v-5.22a1.06,1.06,0,0,1,1-1.1h51.69a1.06,1.06,0,0,1,1,1.1Zm0-14.68a1.07,1.07,0,0,1-1,1.11H247.67a1.07,1.07,0,0,1-1-1.11V99.71a1.07,1.07,0,0,1,1-1.11h51.69a1.07,1.07,0,0,1,1,1.11Zm0-14.67a1.06,1.06,0,0,1-1,1.1H247.67a1.06,1.06,0,0,1-1-1.1V85a1.07,1.07,0,0,1,1-1.11h51.69a1.07,1.07,0,0,1,1,1.11Zm0-14.68a1.07,1.07,0,0,1-1,1.11H247.67a1.07,1.07,0,0,1-1-1.11V70.35a1.06,1.06,0,0,1,1-1.1h51.69a1.06,1.06,0,0,1,1,1.1Zm0-14.68a1.07,1.07,0,0,1-1,1.11H247.67a1.07,1.07,0,0,1-1-1.11V55.68a1.07,1.07,0,0,1,1-1.11h51.69a1.07,1.07,0,0,1,1,1.11Zm0-14.67a1.06,1.06,0,0,1-1,1.1H247.67a1.06,1.06,0,0,1-1-1.1V41a1.07,1.07,0,0,1,1-1.11h51.69a1.07,1.07,0,0,1,1,1.11Zm0-14.68a1.07,1.07,0,0,1-1,1.11H247.67a1.07,1.07,0,0,1-1-1.11V26.32a1.06,1.06,0,0,1,1-1.1h51.69a1.06,1.06,0,0,1,1,1.1Zm0-14.68a1.07,1.07,0,0,1-1,1.11H247.67a1.07,1.07,0,0,1-1-1.11V11.65a1.07,1.07,0,0,1,1-1.11h51.69a1.07,1.07,0,0,1,1,1.11Z"/>
|
||||
</g>
|
||||
<path class="cls-13"
|
||||
d="M315.5,74.68a5.32,5.32,0,0,0-3.58-1.38H162.32a6.41,6.41,0,0,0-5.55,3.21h0a3.34,3.34,0,0,1,2.16-.78H310.77a3.42,3.42,0,0,1,3.4,3.4V185.35a3.36,3.36,0,0,1-1.32,2.68,6.93,6.93,0,0,0,4.41-6.46V78.63A5.29,5.29,0,0,0,315.5,74.68Z"/>
|
||||
<polygon class="cls-14"
|
||||
points="293.51 81.67 292.41 81.67 292.41 83.34 294.61 83.34 294.61 82.32 294.61 81.67 293.51 81.67"/>
|
||||
<polygon class="cls-14"
|
||||
points="295.72 80.65 295.72 82.32 294.61 82.32 294.61 81.67 293.51 81.67 293.51 80.65 295.72 80.65"/>
|
||||
<path class="cls-14"
|
||||
d="M307.05,78.94A3.06,3.06,0,1,1,304,82,3.06,3.06,0,0,1,307.05,78.94Zm.71,3.06,1-1-.71-.71-1,1-1-1-.71.71,1,1-1,1,.71.71,1-1,1,1,.71-.71Z"/>
|
||||
<path class="cls-14"
|
||||
d="M294.13,78.94A3.06,3.06,0,1,1,291.08,82,3.06,3.06,0,0,1,294.13,78.94Zm1.59,3.38V80.65h-2.21v1h-1.1v1.67h2.2v-1Z"/>
|
||||
<path class="cls-14"
|
||||
d="M281.22,78.94A3.06,3.06,0,1,1,278.16,82,3.05,3.05,0,0,1,281.22,78.94Zm1.51,3.56v-1h-3v1Z"/>
|
||||
<path class="cls-15"
|
||||
d="M314.17,79.14v8.29H155.53V79.14a3.41,3.41,0,0,1,3.4-3.4H310.77a3.42,3.42,0,0,1,3.4,3.4ZM310.11,82a3.06,3.06,0,1,0-3.06,3A3.06,3.06,0,0,0,310.11,82Zm-12.92,0a3.06,3.06,0,1,0-3.06,3A3.06,3.06,0,0,0,297.19,82Zm-12.92,0a3.06,3.06,0,1,0-3,3A3.05,3.05,0,0,0,284.27,82Z"/>
|
||||
<path class="cls-14"
|
||||
d="M238.61,136.26a3.76,3.76,0,0,1-2.33,3.47V146a.37.37,0,0,1-.37.36h-2.12a.36.36,0,0,1-.36-.36v-6.26a3.76,3.76,0,1,1,5.18-3.47Z"/>
|
||||
<path class="cls-14"
|
||||
d="M314.17,87.43v97.92a3.42,3.42,0,0,1-3.4,3.4H158.93a3.4,3.4,0,0,1-3.4-3.4V87.43Zm-59,63.87V128a3.55,3.55,0,0,0-3.55-3.55h-1.8v-4.68a14.93,14.93,0,1,0-29.86,0v4.68h-1.8a3.55,3.55,0,0,0-3.55,3.55V151.3a3.56,3.56,0,0,0,3.55,3.56h33.46A3.56,3.56,0,0,0,255.13,151.3Z"/>
|
||||
<polygon class="cls-15"
|
||||
points="308.8 80.96 307.76 82 308.8 83.03 308.09 83.74 307.05 82.7 306.02 83.74 305.31 83.03 306.34 82 305.31 80.96 306.02 80.25 307.05 81.29 308.09 80.25 308.8 80.96"/>
|
||||
<rect class="cls-15" x="279.71" y="81.5" width="3.02" height="1"/>
|
||||
<path class="cls-16"
|
||||
d="M251.58,124.4h-1.8v-4.68a14.93,14.93,0,1,0-29.86,0v4.68h-1.8a3.55,3.55,0,0,0-3.55,3.55V151.3a3.56,3.56,0,0,0,3.55,3.56h33.46a3.56,3.56,0,0,0,3.55-3.56V128A3.55,3.55,0,0,0,251.58,124.4Zm-15.3,15.33V146a.37.37,0,0,1-.37.36h-2.12a.36.36,0,0,1-.36-.36v-6.26a3.76,3.76,0,1,1,2.85,0ZM224.9,124.4v-4.68a9.95,9.95,0,0,1,19.9,0v4.68Z"/>
|
||||
<path class="cls-14" d="M244.8,119.72v4.68H224.9v-4.68a9.95,9.95,0,0,1,19.9,0Z"/>
|
||||
<path class="cls-15"
|
||||
d="M295.87,80.5h-2.51v1h-1.1v2h2.5v-1h1.11Zm-1.41,2.69h-1.9V81.81h1.9Zm1.11-1h-.81v-.65h-1.1v-.73h1.91Z"/>
|
||||
<path d="M203.58,147.25c.06.14.44-.84.44-.84l.09.84.6-.58.26.7.35-.84s.08.15.35.72c.11-.26.8-.22,1.61-.72a3.06,3.06,0,0,0,1-2.59c-.1-.58-.66-1.12-.34-1.48a.67.67,0,0,1,.92-.15c.23.14.49-.17,1.44-.49l.25-.07c1.16-.34,1.06-1.15,1.24-2.29s-1.16-2.56-2.24-3.51a7,7,0,0,0-5.42-1.06c-1.58.49-3.16.9-3.77,4.44a7.67,7.67,0,0,0,1.52,6.37,3.92,3.92,0,0,0,1.18.88A1,1,0,0,1,203.58,147.25Z"/>
|
||||
<path class="cls-17"
|
||||
d="M206.25,232.22c-.33-.73-.59-1.63.55-1.13l.1,0,0-5.25a4.21,4.21,0,0,0-.93.73,31.18,31.18,0,0,0-2.71,2.81c0-.21.05-.39.06-.48,0-.33-.46-.71-.89-.18s-2.71.62-4.06.38a2.8,2.8,0,0,1-.48-.12c-1.18-.39-.84.49-.45,1.18s.44,1.67.57,3.61,2.26,2.4,3.85,2.57c1.4.16,2.37-1.3,4.56-3.27A3.14,3.14,0,0,0,206.25,232.22Z"/>
|
||||
<path class="cls-17"
|
||||
d="M206.47,233.11a24.12,24.12,0,0,1,0,2.76c-.06,1.95,2,2.59,3.59,2.92s2.77-1.47,5.85-3.56,5.51-6,4.48-7c-.94-.63-3.41-.22-5.32,1.25a31.79,31.79,0,0,0-3,2.54h0c0-.21.09-.38.11-.47.06-.33-.39-.75-.88-.26s-3.24.34-4.44-.12l-.1,0c-1.14-.5-.88.4-.55,1.13A3.14,3.14,0,0,1,206.47,233.11Z"/>
|
||||
<path class="cls-18"
|
||||
d="M197.24,182.41l1.23,23.46-.05,23.27c1.35.24,3.67.09,4.06-.38l1.12-21.62,1.08-17a.71.71,0,0,1,.77-.68.8.8,0,0,1,.47.22.72.72,0,0,1,.2.47l1,18.93L207,225.88l0,5.25c1.2.46,4,.59,4.44.12l1.79-23.48.34-23C209.7,185.44,199.19,182.68,197.24,182.41Z"/>
|
||||
<path class="cls-17"
|
||||
d="M188.66,150.58l-.34,7.12,7.18.81s.13,18.8-1.51,23c.89.42,15.71,3.89,19.48,3.27a3.78,3.78,0,0,0,1.09-.3c-.29-1.68,1.18-22.4,1.18-22.4s3.08,2.26,4.81,3.58a4.68,4.68,0,0,0,.79-1.43h0a28.57,28.57,0,0,0,1.07-5.74L216.55,153a3.32,3.32,0,0,0-1.75-.88,39.71,39.71,0,0,1-5.66-1.29c-.81,1-6,1.61-7.16-.22Z"/>
|
||||
<path class="cls-19"
|
||||
d="M221.35,164.27l2,1.71a1,1,0,0,0,1.46-.22l8.65-13.51s2.82-2.35,2.8-3.82c0-1-1.52-2.37-1.78-2.42s.17-1.35.2-2.8-.49-1.7-1-1.7,0,.48,0,2-1.77,6.11-2.28,7L224,160l-1.58-1.5A28.57,28.57,0,0,1,221.35,164.27Z"/>
|
||||
<path class="cls-19"
|
||||
d="M208.26,143.94a3.06,3.06,0,0,1-1,2.59c-.81.5-1.5.46-1.61.72-.27-.57-.35-.72-.35-.72l-.35.84-.26-.7-.6.58-.09-.84s-.38,1-.44.84a1,1,0,0,0-.54-.67c.13,1.4.49,3.77-.49,3.92l-.57.08c1.14,1.83,6.35,1.24,7.16.22a2.47,2.47,0,0,1-1.23-.71c-.63-1.08-.82-3,0-3.46a6.31,6.31,0,0,0,1.85-2.33,4.7,4.7,0,0,0,.2-1.41c0-.53.15-.54.29-1.06h0c-.95.32-1.21.63-1.44.49a.67.67,0,0,0-.92.15C207.6,142.82,208.16,143.36,208.26,143.94Z"/>
|
||||
<path class="cls-20"
|
||||
d="M203,146.58a3.92,3.92,0,0,1-1.18-.88,7.67,7.67,0,0,1-1.52-6.37c.61-3.54,2.19-4,3.77-4.44a7,7,0,0,1,5.42,1.06c1.08,1,2.38,2.4,2.24,3.51s-.08,1.95-1.24,2.29l-.25.07c-.95.32-1.21.63-1.44.49a.67.67,0,0,0-.92.15c-.32.36.24.9.34,1.48a3.06,3.06,0,0,1-1,2.59c-.81.5-1.5.46-1.61.72-.27-.57-.35-.72-.35-.72l-.35.84-.26-.7-.6.58-.09-.84s-.38,1-.44.84A1,1,0,0,0,203,146.58Z"/>
|
||||
<path class="cls-21"
|
||||
d="M201.91,236.38c-1.21-.13-2.74-.42-3.45-1.42-.05.94,0,.9,1.1,1.43s2.77,1.15,3.81.39a33.66,33.66,0,0,0,3.14-3.06h0c0-.22,0-.42,0-.6C204.28,235.08,203.31,236.54,201.91,236.38Z"/>
|
||||
<path class="cls-21"
|
||||
d="M208.69,239a5.08,5.08,0,0,0,3,.08c1.05-.24,3-2.7,4.28-3.43a15.2,15.2,0,0,0,4.39-4.7c1.09-1.81.54-2.25.19-2.48.44,1.36-1.84,4.8-4.67,6.73-3.08,2.09-4.29,3.88-5.85,3.56-1.23-.26-2.78-.71-3.36-1.85C206.42,238.45,207.7,238.67,208.69,239Z"/>
|
||||
<path class="cls-22" d="M206.9,231.13l-.1,0c-1.14-.5-.88.4-.55,1.13a3.14,3.14,0,0,1,.22.89"/>
|
||||
<path class="cls-22" d="M212.64,233.14c-.72.2-.64-.59-.53-1.16"/>
|
||||
<path class="cls-22" d="M203.94,230.52c-.69.27-.69-.52-.63-1.1"/>
|
||||
<path class="cls-23"
|
||||
d="M220.58,228.5h0c.35.23.9.67-.19,2.48a15.2,15.2,0,0,1-4.39,4.7c-1.31.73-3.23,3.19-4.28,3.43a5.08,5.08,0,0,1-3-.08c-1-.36-2.27-.58-2-2.09"/>
|
||||
<path class="cls-23"
|
||||
d="M198.46,235h0c-.05.94,0,.9,1.1,1.43s2.77,1.15,3.81.39a33.66,33.66,0,0,0,3.14-3.06h0"/>
|
||||
<path class="cls-19"
|
||||
d="M202.57,136.72c.21.61.72,2.29-.44,2.73s-2.64,1.42-2.7,1.85-.2,1.06-.67,1.27l-1.31-1.46c.69-1.08,3.37-4.75,3.73-4.77S202.36,136.12,202.57,136.72Z"/>
|
||||
<path class="cls-19" d="M197.45,141.11l1.31,1.46-7.79,8h-2.31l-4.32.11a2.25,2.25,0,0,0-.74.12Z"/>
|
||||
<path class="cls-19"
|
||||
d="M188.66,150.58l-.23,4.95-4.31-.43a2.21,2.21,0,0,1-1.42-.71,2.17,2.17,0,0,1-.58-1.47,2.22,2.22,0,0,1,1.48-2.11,2.25,2.25,0,0,1,.74-.12Z"/>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 20 KiB |
115
src/assets/images/exception/404.svg
Normal file
115
src/assets/images/exception/404.svg
Normal file
@ -0,0 +1,115 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 456.01 262.12">
|
||||
<defs>
|
||||
<style>
|
||||
.cls-1,.cls-2,.cls-24,.cls-25,.cls-3,.cls-4,.cls-5,.cls-6{fill:none;stroke-miterlimit:10;}.cls-1,.cls-2,.cls-3,.cls-4,.cls-5,.cls-6{stroke-width:2px;}.cls-1{stroke:url(#未命名的渐变_26);}.cls-2{stroke:url(#未命名的渐变_26-2);}.cls-3{stroke:url(#未命名的渐变_26-3);}.cls-4{stroke:url(#未命名的渐变_26-4);}.cls-5{stroke:url(#未命名的渐变_26-5);}.cls-6{stroke:url(#未命名的渐变_26-6);}.cls-10,.cls-11,.cls-12,.cls-7,.cls-9{opacity:0.4;}.cls-7{fill:url(#未命名的渐变_26-7);}.cls-8{opacity:0.7;}.cls-9{fill:url(#未命名的渐变_26-8);}.cls-10{fill:url(#未命名的渐变_26-9);}.cls-11{fill:url(#未命名的渐变_26-10);}.cls-12{fill:url(#未命名的渐变_26-11);}.cls-13{fill:#67c8ff;}.cls-14{fill:#8cd7ff;}.cls-15{fill:#b0e7ff;}.cls-16{fill:#728cb9;}.cls-17{fill:#7798b9;}.cls-18{fill:#a4c0d9;}.cls-19{fill:#ebfcff;}.cls-20{fill:#ffb056;}.cls-21{fill:#257fba;}.cls-22{fill:#398eed;}.cls-23{fill:#ffeed2;}.cls-24{stroke:#e49056;stroke-width:0.26px;}.cls-25{stroke:#4986d9;stroke-width:0.1px;}.cls-26{fill:#e55c5c;opacity:0.2;}
|
||||
</style>
|
||||
<linearGradient id="未命名的渐变_26" x1="1" y1="91.35" x2="1" y2="181.12" gradientUnits="userSpaceOnUse">
|
||||
<stop offset="0" stop-color="#81cfff"/>
|
||||
<stop offset="1" stop-color="#5ecfff" stop-opacity="0"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="未命名的渐变_26-2" x1="455.01" y1="72.11" x2="455.01" y2="161.88" xlink:href="#未命名的渐变_26"/>
|
||||
<linearGradient id="未命名的渐变_26-3" x1="40.9" y1="143.88" x2="40.9" y2="199.51" xlink:href="#未命名的渐变_26"/>
|
||||
<linearGradient id="未命名的渐变_26-4" x1="64.97" y1="95.36" x2="64.97" y2="123.17" xlink:href="#未命名的渐变_26"/>
|
||||
<linearGradient id="未命名的渐变_26-5" x1="397.23" y1="104.2" x2="397.23" y2="132.02" xlink:href="#未命名的渐变_26"/>
|
||||
<linearGradient id="未命名的渐变_26-6" x1="424.75" y1="133.49" x2="424.75" y2="189.13" xlink:href="#未命名的渐变_26"/>
|
||||
<linearGradient id="未命名的渐变_26-7" x1="232.75" y1="224.43" x2="232.75" y2="262.12" xlink:href="#未命名的渐变_26"/>
|
||||
<linearGradient id="未命名的渐变_26-8" x1="349.36" y1="26.68" x2="349.36" y2="204.03" xlink:href="#未命名的渐变_26"/>
|
||||
<linearGradient id="未命名的渐变_26-9" x1="201.45" y1="55.61" x2="201.45" y2="204.03" xlink:href="#未命名的渐变_26"/>
|
||||
<linearGradient id="未命名的渐变_26-10" x1="122.98" y1="26.68" x2="122.98" y2="204.03" xlink:href="#未命名的渐变_26"/>
|
||||
<linearGradient id="未命名的渐变_26-11" x1="273.51" y1="0" x2="273.51" y2="209.54" xlink:href="#未命名的渐变_26"/>
|
||||
</defs>
|
||||
<title>404</title>
|
||||
<g id="图层_2" data-name="图层 2">
|
||||
<g id="图层_1-2" data-name="图层 1">
|
||||
<line class="cls-1" x1="1" y1="91.35" x2="1" y2="181.12"/>
|
||||
<line class="cls-2" x1="455.01" y1="72.11" x2="455.01" y2="161.88"/>
|
||||
<line class="cls-3" x1="40.9" y1="143.88" x2="40.9" y2="199.51"/>
|
||||
<line class="cls-4" x1="64.97" y1="95.36" x2="64.97" y2="123.17"/>
|
||||
<line class="cls-5" x1="397.23" y1="104.2" x2="397.23" y2="132.02"/>
|
||||
<line class="cls-6" x1="424.75" y1="133.49" x2="424.75" y2="189.13"/>
|
||||
<path class="cls-7" d="M412.28,262.12c-23-23-61-37.69-179.53-37.69S76.24,239.1,53.21,262.12Z"/>
|
||||
<g class="cls-8">
|
||||
<path class="cls-9"
|
||||
d="M380.66,26.68H318.07a2.71,2.71,0,0,0-2.82,2.59V201.44a2.71,2.71,0,0,0,2.82,2.59h62.59a2.72,2.72,0,0,0,2.82-2.59V29.27A2.72,2.72,0,0,0,380.66,26.68ZM328.3,147a.9.9,0,0,1-.95.87h-3.6a.9.9,0,0,1-.95-.87V127.27a.91.91,0,0,1,.95-.87h3.6a.91.91,0,0,1,.95.87Zm0-30.23a.91.91,0,0,1-.95.87h-3.6a.91.91,0,0,1-.95-.87V97a.91.91,0,0,1,.95-.87h3.6a.91.91,0,0,1,.95.87Zm0-30.24a.91.91,0,0,1-.95.87h-3.6a.91.91,0,0,1-.95-.87V66.8a.91.91,0,0,1,.95-.87h3.6a.91.91,0,0,1,.95.87Zm0-30.24a.91.91,0,0,1-.95.87h-3.6a.91.91,0,0,1-.95-.87V36.56a.91.91,0,0,1,.95-.87h3.6a.91.91,0,0,1,.95.87ZM340,147a.9.9,0,0,1-.94.87h-3.61a.91.91,0,0,1-.95-.87V127.27a.92.92,0,0,1,.95-.87h3.61a.91.91,0,0,1,.94.87Zm0-30.23a.91.91,0,0,1-.94.87h-3.61a.92.92,0,0,1-.95-.87V97a.92.92,0,0,1,.95-.87h3.61A.91.91,0,0,1,340,97Zm0-30.24a.91.91,0,0,1-.94.87h-3.61a.92.92,0,0,1-.95-.87V66.8a.92.92,0,0,1,.95-.87h3.61a.91.91,0,0,1,.94.87Zm0-30.24a.91.91,0,0,1-.94.87h-3.61a.92.92,0,0,1-.95-.87V36.56a.92.92,0,0,1,.95-.87h3.61a.91.91,0,0,1,.94.87ZM351.7,147a.9.9,0,0,1-.94.87h-3.61a.9.9,0,0,1-.94-.87V127.27a.91.91,0,0,1,.94-.87h3.61a.91.91,0,0,1,.94.87Zm0-30.23a.91.91,0,0,1-.94.87h-3.61a.91.91,0,0,1-.94-.87V97a.91.91,0,0,1,.94-.87h3.61a.91.91,0,0,1,.94.87Zm0-30.24a.91.91,0,0,1-.94.87h-3.61a.91.91,0,0,1-.94-.87V66.8a.91.91,0,0,1,.94-.87h3.61a.91.91,0,0,1,.94.87Zm0-30.24a.91.91,0,0,1-.94.87h-3.61a.91.91,0,0,1-.94-.87V36.56a.91.91,0,0,1,.94-.87h3.61a.91.91,0,0,1,.94.87ZM363.4,147a.9.9,0,0,1-.94.87h-3.61a.9.9,0,0,1-.94-.87V127.27a.91.91,0,0,1,.94-.87h3.61a.91.91,0,0,1,.94.87Zm0-30.23a.91.91,0,0,1-.94.87h-3.61a.91.91,0,0,1-.94-.87V97a.91.91,0,0,1,.94-.87h3.61a.91.91,0,0,1,.94.87Zm0-30.24a.91.91,0,0,1-.94.87h-3.61a.91.91,0,0,1-.94-.87V66.8a.91.91,0,0,1,.94-.87h3.61a.91.91,0,0,1,.94.87Zm0-30.24a.91.91,0,0,1-.94.87h-3.61a.91.91,0,0,1-.94-.87V36.56a.91.91,0,0,1,.94-.87h3.61a.91.91,0,0,1,.94.87ZM375.11,147a.91.91,0,0,1-.95.87h-3.61a.9.9,0,0,1-.94-.87V127.27a.91.91,0,0,1,.94-.87h3.61a.92.92,0,0,1,.95.87Zm0-30.23a.92.92,0,0,1-.95.87h-3.61a.91.91,0,0,1-.94-.87V97a.91.91,0,0,1,.94-.87h3.61a.92.92,0,0,1,.95.87Zm0-30.24a.92.92,0,0,1-.95.87h-3.61a.91.91,0,0,1-.94-.87V66.8a.91.91,0,0,1,.94-.87h3.61a.92.92,0,0,1,.95.87Zm0-30.24a.92.92,0,0,1-.95.87h-3.61a.91.91,0,0,1-.94-.87V36.56a.91.91,0,0,1,.94-.87h3.61a.92.92,0,0,1,.95.87Z"/>
|
||||
<path class="cls-10"
|
||||
d="M231.1,55.61H171.8A2.71,2.71,0,0,0,169,58.2V201.44A2.71,2.71,0,0,0,171.8,204h59.3a2.71,2.71,0,0,0,2.82-2.59V58.2A2.71,2.71,0,0,0,231.1,55.61ZM182.47,159.37a1.16,1.16,0,0,1-1.2,1.11h-5.4a1.16,1.16,0,0,1-1.2-1.11v-5.22a1.15,1.15,0,0,1,1.2-1.1h5.4a1.15,1.15,0,0,1,1.2,1.1Zm0-12.88a1.15,1.15,0,0,1-1.2,1.1h-5.4a1.15,1.15,0,0,1-1.2-1.1v-5.22a1.16,1.16,0,0,1,1.2-1.11h5.4a1.16,1.16,0,0,1,1.2,1.11Zm0-12.89a1.16,1.16,0,0,1-1.2,1.11h-5.4a1.16,1.16,0,0,1-1.2-1.11v-5.22a1.15,1.15,0,0,1,1.2-1.1h5.4a1.15,1.15,0,0,1,1.2,1.1Zm0-12.88a1.15,1.15,0,0,1-1.2,1.1h-5.4a1.15,1.15,0,0,1-1.2-1.1V115.5a1.16,1.16,0,0,1,1.2-1.11h5.4a1.16,1.16,0,0,1,1.2,1.11Zm0-12.89a1.16,1.16,0,0,1-1.2,1.11h-5.4a1.16,1.16,0,0,1-1.2-1.11v-5.21a1.15,1.15,0,0,1,1.2-1.11h5.4a1.15,1.15,0,0,1,1.2,1.11Zm0-12.88a1.15,1.15,0,0,1-1.2,1.1h-5.4a1.15,1.15,0,0,1-1.2-1.1V89.73a1.16,1.16,0,0,1,1.2-1.11h5.4a1.16,1.16,0,0,1,1.2,1.11Zm0-12.89a1.16,1.16,0,0,1-1.2,1.11h-5.4a1.16,1.16,0,0,1-1.2-1.11V76.85a1.15,1.15,0,0,1,1.2-1.11h5.4a1.15,1.15,0,0,1,1.2,1.11Zm0-12.88a1.15,1.15,0,0,1-1.2,1.1h-5.4a1.15,1.15,0,0,1-1.2-1.1V64a1.16,1.16,0,0,1,1.2-1.11h5.4a1.16,1.16,0,0,1,1.2,1.11Zm10.08,90.19a1.16,1.16,0,0,1-1.2,1.11H186a1.16,1.16,0,0,1-1.21-1.11v-5.22a1.16,1.16,0,0,1,1.21-1.1h5.4a1.15,1.15,0,0,1,1.2,1.1Zm0-12.88a1.15,1.15,0,0,1-1.2,1.1H186a1.16,1.16,0,0,1-1.21-1.1v-5.22a1.16,1.16,0,0,1,1.21-1.11h5.4a1.16,1.16,0,0,1,1.2,1.11Zm0-12.89a1.16,1.16,0,0,1-1.2,1.11H186a1.16,1.16,0,0,1-1.21-1.11v-5.22a1.16,1.16,0,0,1,1.21-1.1h5.4a1.15,1.15,0,0,1,1.2,1.1Zm0-12.88a1.15,1.15,0,0,1-1.2,1.1H186a1.16,1.16,0,0,1-1.21-1.1V115.5a1.16,1.16,0,0,1,1.21-1.11h5.4a1.16,1.16,0,0,1,1.2,1.11Zm0-12.89a1.16,1.16,0,0,1-1.2,1.11H186a1.16,1.16,0,0,1-1.21-1.11v-5.21a1.16,1.16,0,0,1,1.21-1.11h5.4a1.15,1.15,0,0,1,1.2,1.11Zm0-12.88a1.15,1.15,0,0,1-1.2,1.1H186a1.16,1.16,0,0,1-1.21-1.1V89.73A1.16,1.16,0,0,1,186,88.62h5.4a1.16,1.16,0,0,1,1.2,1.11Zm0-12.89a1.16,1.16,0,0,1-1.2,1.11H186a1.16,1.16,0,0,1-1.21-1.11V76.85A1.16,1.16,0,0,1,186,75.74h5.4a1.15,1.15,0,0,1,1.2,1.11Zm0-12.88a1.15,1.15,0,0,1-1.2,1.1H186a1.16,1.16,0,0,1-1.21-1.1V64A1.16,1.16,0,0,1,186,62.85h5.4a1.16,1.16,0,0,1,1.2,1.11Zm10.08,90.19a1.16,1.16,0,0,1-1.21,1.11H196a1.16,1.16,0,0,1-1.2-1.11v-5.22a1.15,1.15,0,0,1,1.2-1.1h5.4a1.16,1.16,0,0,1,1.21,1.1Zm0-12.88a1.16,1.16,0,0,1-1.21,1.1H196a1.15,1.15,0,0,1-1.2-1.1v-5.22a1.16,1.16,0,0,1,1.2-1.11h5.4a1.16,1.16,0,0,1,1.21,1.11Zm0-12.89a1.16,1.16,0,0,1-1.21,1.11H196a1.16,1.16,0,0,1-1.2-1.11v-5.22a1.15,1.15,0,0,1,1.2-1.1h5.4a1.16,1.16,0,0,1,1.21,1.1Zm0-12.88a1.16,1.16,0,0,1-1.21,1.1H196a1.15,1.15,0,0,1-1.2-1.1V115.5a1.16,1.16,0,0,1,1.2-1.11h5.4a1.16,1.16,0,0,1,1.21,1.11Zm0-12.89a1.16,1.16,0,0,1-1.21,1.11H196a1.16,1.16,0,0,1-1.2-1.11v-5.21a1.15,1.15,0,0,1,1.2-1.11h5.4a1.16,1.16,0,0,1,1.21,1.11Zm0-12.88a1.16,1.16,0,0,1-1.21,1.1H196a1.15,1.15,0,0,1-1.2-1.1V89.73a1.16,1.16,0,0,1,1.2-1.11h5.4a1.16,1.16,0,0,1,1.21,1.11Zm0-12.89a1.16,1.16,0,0,1-1.21,1.11H196a1.16,1.16,0,0,1-1.2-1.11V76.85a1.15,1.15,0,0,1,1.2-1.11h5.4a1.16,1.16,0,0,1,1.21,1.11Zm0-12.88a1.16,1.16,0,0,1-1.21,1.1H196a1.15,1.15,0,0,1-1.2-1.1V64a1.16,1.16,0,0,1,1.2-1.11h5.4A1.16,1.16,0,0,1,202.63,64Zm25.21,90.19a1.16,1.16,0,0,1-1.2,1.11H206.1a1.16,1.16,0,0,1-1.2-1.11v-5.22a1.15,1.15,0,0,1,1.2-1.1h20.54a1.15,1.15,0,0,1,1.2,1.1Zm0-12.88a1.15,1.15,0,0,1-1.2,1.1H206.1a1.15,1.15,0,0,1-1.2-1.1v-5.22a1.16,1.16,0,0,1,1.2-1.11h20.54a1.16,1.16,0,0,1,1.2,1.11Zm0-12.89a1.16,1.16,0,0,1-1.2,1.11H206.1a1.16,1.16,0,0,1-1.2-1.11v-5.22a1.15,1.15,0,0,1,1.2-1.1h20.54a1.15,1.15,0,0,1,1.2,1.1Zm0-12.88a1.15,1.15,0,0,1-1.2,1.1H206.1a1.15,1.15,0,0,1-1.2-1.1V115.5a1.16,1.16,0,0,1,1.2-1.11h20.54a1.16,1.16,0,0,1,1.2,1.11Zm0-12.89a1.16,1.16,0,0,1-1.2,1.11H206.1a1.16,1.16,0,0,1-1.2-1.11v-5.21a1.15,1.15,0,0,1,1.2-1.11h20.54a1.15,1.15,0,0,1,1.2,1.11Zm0-12.88a1.15,1.15,0,0,1-1.2,1.1H206.1a1.15,1.15,0,0,1-1.2-1.1V89.73a1.16,1.16,0,0,1,1.2-1.11h20.54a1.16,1.16,0,0,1,1.2,1.11Zm0-12.89a1.16,1.16,0,0,1-1.2,1.11H206.1a1.16,1.16,0,0,1-1.2-1.11V76.85a1.15,1.15,0,0,1,1.2-1.11h20.54a1.15,1.15,0,0,1,1.2,1.11Zm0-12.88a1.15,1.15,0,0,1-1.2,1.1H206.1a1.15,1.15,0,0,1-1.2-1.1V64a1.16,1.16,0,0,1,1.2-1.11h20.54a1.16,1.16,0,0,1,1.2,1.11Z"/>
|
||||
<path class="cls-11"
|
||||
d="M161.13,26.68H84.83A2.71,2.71,0,0,0,82,29.27V201.44A2.71,2.71,0,0,0,84.83,204h76.3a2.71,2.71,0,0,0,2.82-2.59V29.27A2.71,2.71,0,0,0,161.13,26.68ZM154.34,161a1.16,1.16,0,0,1-1.2,1.11H92.83A1.16,1.16,0,0,1,91.62,161v-5.21a1.16,1.16,0,0,1,1.21-1.11h60.31a1.15,1.15,0,0,1,1.2,1.11Zm0-14.67a1.15,1.15,0,0,1-1.2,1.1H92.83a1.16,1.16,0,0,1-1.21-1.1v-5.22A1.16,1.16,0,0,1,92.83,140h60.31a1.16,1.16,0,0,1,1.2,1.11Zm0-14.68a1.16,1.16,0,0,1-1.2,1.11H92.83a1.16,1.16,0,0,1-1.21-1.11v-5.22a1.16,1.16,0,0,1,1.21-1.1h60.31a1.15,1.15,0,0,1,1.2,1.1Zm0-14.68a1.16,1.16,0,0,1-1.2,1.11H92.83a1.16,1.16,0,0,1-1.21-1.11v-5.21a1.16,1.16,0,0,1,1.21-1.11h60.31a1.15,1.15,0,0,1,1.2,1.11Zm0-14.67a1.15,1.15,0,0,1-1.2,1.1H92.83a1.16,1.16,0,0,1-1.21-1.1V97a1.16,1.16,0,0,1,1.21-1.11h60.31a1.16,1.16,0,0,1,1.2,1.11Zm0-14.68a1.16,1.16,0,0,1-1.2,1.11H92.83a1.16,1.16,0,0,1-1.21-1.11V82.35a1.16,1.16,0,0,1,1.21-1.1h60.31a1.15,1.15,0,0,1,1.2,1.1Zm0-14.68a1.16,1.16,0,0,1-1.2,1.11H92.83a1.16,1.16,0,0,1-1.21-1.11V67.68a1.16,1.16,0,0,1,1.21-1.11h60.31a1.15,1.15,0,0,1,1.2,1.11Zm0-14.67a1.15,1.15,0,0,1-1.2,1.1H92.83a1.16,1.16,0,0,1-1.21-1.1V53a1.16,1.16,0,0,1,1.21-1.11h60.31a1.16,1.16,0,0,1,1.2,1.11Zm0-14.68a1.16,1.16,0,0,1-1.2,1.11H92.83a1.16,1.16,0,0,1-1.21-1.11V38.32a1.16,1.16,0,0,1,1.21-1.1h60.31a1.15,1.15,0,0,1,1.2,1.1Z"/>
|
||||
<path class="cls-12"
|
||||
d="M306.21,0H240.82a2.51,2.51,0,0,0-2.42,2.59V206.94a2.51,2.51,0,0,0,2.42,2.6h65.39a2.51,2.51,0,0,0,2.41-2.6V2.59A2.51,2.51,0,0,0,306.21,0Zm-5.82,134.28a1.06,1.06,0,0,1-1,1.1H247.67a1.06,1.06,0,0,1-1-1.1v-5.22a1.07,1.07,0,0,1,1-1.11h51.69a1.07,1.07,0,0,1,1,1.11Zm0-14.68a1.07,1.07,0,0,1-1,1.11H247.67a1.07,1.07,0,0,1-1-1.11v-5.22a1.06,1.06,0,0,1,1-1.1h51.69a1.06,1.06,0,0,1,1,1.1Zm0-14.68a1.07,1.07,0,0,1-1,1.11H247.67a1.07,1.07,0,0,1-1-1.11V99.71a1.07,1.07,0,0,1,1-1.11h51.69a1.07,1.07,0,0,1,1,1.11Zm0-14.67a1.06,1.06,0,0,1-1,1.1H247.67a1.06,1.06,0,0,1-1-1.1V85a1.07,1.07,0,0,1,1-1.11h51.69a1.07,1.07,0,0,1,1,1.11Zm0-14.68a1.07,1.07,0,0,1-1,1.11H247.67a1.07,1.07,0,0,1-1-1.11V70.35a1.06,1.06,0,0,1,1-1.1h51.69a1.06,1.06,0,0,1,1,1.1Zm0-14.68a1.07,1.07,0,0,1-1,1.11H247.67a1.07,1.07,0,0,1-1-1.11V55.68a1.07,1.07,0,0,1,1-1.11h51.69a1.07,1.07,0,0,1,1,1.11Zm0-14.67a1.06,1.06,0,0,1-1,1.1H247.67a1.06,1.06,0,0,1-1-1.1V41a1.07,1.07,0,0,1,1-1.11h51.69a1.07,1.07,0,0,1,1,1.11Zm0-14.68a1.07,1.07,0,0,1-1,1.11H247.67a1.07,1.07,0,0,1-1-1.11V26.32a1.06,1.06,0,0,1,1-1.1h51.69a1.06,1.06,0,0,1,1,1.1Zm0-14.68a1.07,1.07,0,0,1-1,1.11H247.67a1.07,1.07,0,0,1-1-1.11V11.65a1.07,1.07,0,0,1,1-1.11h51.69a1.07,1.07,0,0,1,1,1.11Z"/>
|
||||
</g>
|
||||
<path class="cls-13"
|
||||
d="M182.43,170.83l.09.09a3.44,3.44,0,0,1,.41.44l.12.15a6,6,0,0,1,.39.59.93.93,0,0,0,.05.1,5.36,5.36,0,0,1,.32.73h0a6.39,6.39,0,0,1,.22.78c0,.06,0,.12,0,.19a8.08,8.08,0,0,1,.14.9V175c0,.31,0,.63,0,1V164.28c0-.28,0-.55,0-.82v-.14h0c0-.26-.06-.51-.11-.75l0-.14c0-.06,0-.13,0-.19L184,162c-.05-.17-.1-.33-.16-.49v0h0c-.06-.16-.12-.31-.19-.46s-.09-.17-.13-.25a.93.93,0,0,0-.05-.1.59.59,0,0,1,0-.08,3.74,3.74,0,0,0-.27-.42l-.08-.1-.12-.15c-.05-.06-.1-.13-.16-.19a3,3,0,0,0-.25-.25l-.09-.09A4.06,4.06,0,0,0,182,159l-.11-.07-.12-.07-.18-.12-.5-.23c-.26-.11-.53-.22-.81-.32a2.46,2.46,0,0,1-.29-.09l-.54-.16h0l-.65-.16-.34-.09c-.32-.06-.65-.13-1-.18h0c-.36-.06-.73-.11-1.12-.15l-.39,0-.8-.07H175l-.74,0-.4,0-1.26,0h-2.95v11.49h2.95c.43,0,.85,0,1.26,0l.4,0,.8,0,.79.07.4,0,1.12.16h0l1,.19.34.08.65.16.58.18.29.09c.28.1.55.2.81.31a6.23,6.23,0,0,1,.68.36l.12.07A4.73,4.73,0,0,1,182.43,170.83Z"/>
|
||||
<rect class="cls-13" x="122.87" y="157.13" width="29.56" height="11.49"/>
|
||||
<path class="cls-13"
|
||||
d="M169.61,106.86q0-.52,0-1c0-.08,0-.15,0-.23s0-.35,0-.52a2.51,2.51,0,0,0,0-.27c0-.25-.06-.49-.1-.73a3.31,3.31,0,0,0,0-.33,1.89,1.89,0,0,1-.05-.23l-.12-.52c0-.11,0-.23-.07-.34a2.41,2.41,0,0,1-.08-.25c0-.14-.08-.27-.13-.4a2,2,0,0,0-.08-.26c0-.12-.09-.23-.14-.35s-.08-.21-.13-.31l0-.15c-.08-.18-.18-.34-.26-.51a1.74,1.74,0,0,1-.1-.19.08.08,0,0,1,0,0c-.14-.25-.3-.49-.46-.72l0,0c-.09-.13-.19-.24-.28-.36s-.2-.25-.3-.36,0,0,0,0l-.45-.43-.26-.24a6.42,6.42,0,0,0-.65-.48l-.13-.1h0l-.46-.27a1.63,1.63,0,0,0-.19-.09l-.52-.25c-.14-.06-.29-.13-.44-.18s-.37-.14-.57-.2l-.31-.1a.58.58,0,0,0-.14,0c-.32-.09-.65-.16-1-.22l-.2,0h-.05c-.4-.06-.83-.11-1.26-.14h0c-.39,0-.79,0-1.2,0H159l-.43,0h-.3c-.21,0-.43,0-.64.09h0l-.13,0a3,3,0,0,0-.43.09.35.35,0,0,0-.11,0,1.41,1.41,0,0,0-.22.06l-.24.06-.2.08-.23.08-.14,0-.27.12-.24.11-.08,0-.24.14-.33.18-.08,0-.14.1-.53.38-.12.09-.27.23a53.11,53.11,0,0,0-5.87,6.55l-36.44,45.8-2.55,3.17c-.68.86-1.34,1.75-2,2.68a12.25,12.25,0,0,0-1.44,2.65,7.17,7.17,0,0,0-.45,1.87c0,.2,0,.41,0,.61h0v11.49a7,7,0,0,1,.48-2.49,12.43,12.43,0,0,1,1.44-2.64c.65-.93,1.31-1.82,2-2.69l2.55-3.16L147.76,116a53.36,53.36,0,0,1,5.87-6.56l.39-.31c.17-.14.35-.26.53-.39a1.64,1.64,0,0,0,.22-.14l.33-.19.32-.17.24-.11.41-.17.23-.09.44-.14.22-.06.54-.11.13,0c.23,0,.47-.07.71-.09h.26c.19,0,.38,0,.57,0,.42,0,.83,0,1.23,0a12.44,12.44,0,0,1,1.26.14l.25,0q.51.09,1,.21l.45.14c.2.06.39.12.57.19l.44.19.52.24c.22.12.44.24.65.37h0l.13.1a6.42,6.42,0,0,1,.65.48c.09.07.17.16.26.24s.31.28.45.43.21.26.32.39.19.23.28.36a7.45,7.45,0,0,1,.5.78l.1.19c.11.21.22.43.31.65s.09.22.13.32a6.32,6.32,0,0,1,.22.61c.05.13.09.26.13.4l.15.59.12.52.09.56c0,.24.08.48.1.73s.06.52.08.79c0,.08,0,.15,0,.23,0,.42,0,.84,0,1.29h0V107.13A2.44,2.44,0,0,0,169.61,106.86Z"/>
|
||||
<path class="cls-13"
|
||||
d="M247,164.23c-1,5.13-2.63,9.07-5,11.83a11.68,11.68,0,0,1-.85.87c-.09.09-.18.16-.27.24a6.66,6.66,0,0,1-.59.49c-.19.14-.37.28-.56.4s-.39.27-.6.39l-.38.21c-.28.15-.57.3-.86.43l-.2.08a10,10,0,0,1-1.13.4l-.29.09c-.32.08-.64.16-1,.22L235,180c-.43.07-.87.14-1.32.18h-.23c-.43,0-.87.05-1.33.05s-.9,0-1.34-.05l-.7-.08-.77-.1-.21,0c-.39-.08-.78-.17-1.16-.27s-.48-.16-.72-.25l-.55-.19c-.24-.1-.46-.21-.7-.33s-.33-.14-.48-.23l-.21-.13a8.63,8.63,0,0,1-.82-.51c-.21-.15-.41-.31-.61-.47l-.43-.34c-.21-.19-.41-.39-.6-.59s-.27-.25-.39-.39a12.06,12.06,0,0,1-.77-.94l-.17-.22c-.23-.32-.47-.66-.69-1a1,1,0,0,0-.1-.17c-.2-.34-.4-.69-.59-1a1.62,1.62,0,0,1-.1-.18c-.2-.39-.39-.8-.58-1.22l-.13-.31c-.17-.4-.34-.81-.49-1.24l-.06-.14c-.17-.47-.33-1-.48-1.47l-.12-.43c-.12-.39-.22-.79-.33-1.2,0-.15-.07-.31-.11-.46-.13-.55-.26-1.11-.37-1.68s-.23-1.25-.33-1.9l0-.14c-.1-.61-.19-1.25-.27-1.9,0-.17,0-.34-.07-.51-.07-.57-.13-1.14-.19-1.73,0-.12,0-.23,0-.35l-.09-1c0-.49-.09-1-.13-1.48s0-.75-.07-1.12-.06-1-.09-1.51,0-.81-.05-1.21,0-1-.07-1.55l0-1.3,0-1.61c0-.85,0-1.7,0-2.57v11.48c0,.75,0,1.49,0,2.21,0,.13,0,.24,0,.36,0,.55,0,1.08,0,1.61s0,.88,0,1.3,0,1,.07,1.56,0,.82.05,1.21l.09,1.5c0,.38,0,.76.07,1.12,0,.51.09,1,.13,1.49,0,.29.05.6.08.89,0,0,0,.09,0,.13s0,.23,0,.35c.06.59.12,1.16.19,1.72,0,.18.05.35.07.52.08.65.17,1.28.27,1.9l0,.14c.06.41.13.82.2,1.21,0,.23.09.46.13.68.11.58.24,1.14.37,1.69,0,.15.07.3.11.46s.09.37.14.55.12.43.19.65l.12.43c.15.48.3,1,.46,1.42,0,0,0,0,0,0l.06.14c.15.43.32.84.49,1.24l.13.31.11.26c.15.33.31.65.47,1a1.62,1.62,0,0,0,.1.18c.09.18.19.36.29.54l.3.5.1.17c.18.28.36.56.54.82l.16.2.16.22c.25.33.5.64.77.94l.06.06c.1.12.22.22.33.33s.39.4.6.58.29.23.43.35.4.32.61.47l.07.06q.38.24.75.45l.21.13h0l.46.22c.23.11.46.23.7.33l.55.19c.24.08.47.17.72.24l0,0c.37.1.74.18,1.12.25l.21,0,.2,0c.18,0,.38,0,.57.06s.46.07.7.08l.15,0c.39,0,.78,0,1.19,0h.26c.36,0,.72,0,1.07-.06h.26c.38,0,.76-.08,1.13-.14l.16,0,.32-.07.52-.1.45-.13.29-.08.18-.05c.31-.1.6-.2.89-.32l.06,0,.2-.09.62-.28c.09,0,.16-.1.24-.14l.38-.21c.1-.07.21-.12.31-.18l.29-.21.56-.4.24-.18.35-.31.27-.24a11.84,11.84,0,0,0,.85-.88c2.39-2.75,4-6.69,5-11.82a113.49,113.49,0,0,0,1.44-20.15V144.08A113.42,113.42,0,0,1,247,164.23Z"/>
|
||||
<path class="cls-13"
|
||||
d="M267.31,143.7c0-.12,0-.23,0-.34,0-.49,0-1,0-1.43s0-.69,0-1c0-.5,0-1-.06-1.46,0-.31,0-.62,0-.92,0-.54-.06-1.08-.1-1.61,0-.23,0-.46,0-.68-.06-.75-.12-1.49-.19-2.22v0c-.06-.63-.13-1.25-.2-1.87,0-.19-.05-.37-.07-.56-.06-.43-.11-.86-.17-1.29,0-.22-.07-.43-.1-.65-.06-.39-.12-.78-.19-1.17,0-.21-.07-.42-.1-.62l-.06-.35c0-.14-.06-.27-.08-.41l-.33-1.63c-.05-.21-.09-.42-.14-.63-.16-.71-.33-1.41-.51-2.08h0c-.16-.6-.33-1.19-.51-1.76l-.18-.56c-.12-.38-.25-.77-.38-1.14,0-.07,0-.14-.07-.21s-.13-.32-.19-.49l-.3-.8c-.09-.23-.19-.46-.29-.69s-.21-.51-.32-.76c0-.08-.07-.17-.11-.25-.13-.29-.27-.58-.4-.86-.34-.68-.7-1.34-1.06-2-.05-.08-.09-.17-.13-.25l-.18-.29c-.2-.34-.4-.68-.6-1s-.23-.38-.35-.56c-.23-.36-.47-.72-.72-1.07-.07-.11-.14-.22-.22-.33l0-.06q-.56-.77-1.14-1.5l-.3-.37c-.3-.36-.61-.72-.92-1.07-.06-.07-.13-.16-.2-.23l-.17-.17c-.44-.49-.9-1-1.37-1.41l-1-.92-.32-.27-.74-.61-.37-.28q-.4-.31-.81-.6l-.29-.21-.1-.07-.42-.27c-.26-.18-.53-.35-.8-.52l-.56-.33-.78-.45-.18-.1-.29-.15c-.42-.21-.83-.42-1.26-.62l-.48-.22c-.57-.25-1.14-.49-1.73-.71s-.91-.33-1.37-.48l-.46-.14-.74-.22-.17,0c-.49-.14-1-.26-1.49-.37l-.24-.06c-.59-.13-1.18-.24-1.79-.34l-.12,0-.57-.08-1-.13-.75-.08-1-.09-.25,0-.79,0-.52,0c-.54,0-1.08,0-1.63,0h-.91c-.35,0-.7,0-1.05,0l-.47,0-1.41.1h-.07c-.45.05-.9.09-1.34.15l-.41.06-.91.13-.13,0-.41.07-.69.13-.55.11-.67.15-.19,0-.37.1-.61.15-.56.16-.59.18-.21.06-.33.12-.59.2-.53.19-.57.22-.24.09-.27.12-.62.26-.48.22-.61.3-.28.13a1.51,1.51,0,0,1-.18.09l-.76.42-.36.19c-.37.21-.73.43-1.09.65l0,0c-.58.36-1.13.75-1.67,1.15-.17.11-.32.24-.48.36s-.45.33-.66.51-.32.28-.48.41l-.55.48c-.37.33-.73.68-1.08,1l-.44.43c-.48.5-1,1-1.4,1.56l-.17.22c-.39.47-.77,1-1.13,1.47-.14.19-.27.39-.4.58-.28.41-.56.82-.82,1.24l-.41.67c-.26.44-.51.89-.76,1.35l-.33.62c-.34.68-.67,1.36-1,2.07A55.46,55.46,0,0,0,198,128.9a127.46,127.46,0,0,0-1.1,17.57V158a127.36,127.36,0,0,1,1.1-17.57A55.34,55.34,0,0,1,201.46,127c.31-.71.64-1.4,1-2.07l.33-.62c.25-.46.5-.91.76-1.35l.41-.67c.26-.42.54-.84.82-1.24.13-.2.26-.4.4-.59.36-.5.74-1,1.13-1.46l.17-.22c.45-.54.92-1.06,1.4-1.56l.44-.44q.52-.53,1.08-1l.55-.48c.37-.32.75-.62,1.14-.92.16-.12.31-.25.48-.37.55-.4,1.12-.8,1.7-1.17.36-.22.72-.44,1.09-.65l.36-.2.76-.41.46-.23.61-.29.48-.22.62-.27.51-.2.57-.22.53-.2.59-.2.54-.17.59-.18.56-.16.61-.15.56-.14.66-.15.56-.11.68-.13.55-.1.91-.13.41-.05c.44-.06.89-.11,1.34-.15h.07c.46,0,.93-.08,1.41-.1l.47,0,1.05,0h.91c.55,0,1.09,0,1.63,0l.52,0,1,.06c.33,0,.65.06,1,.09l.75.07,1,.14.69.1c.61.1,1.2.21,1.79.34l.24,0,1.49.37.91.27.46.14c.46.15.92.31,1.37.48s1.16.46,1.73.71l.48.22c.43.2.84.4,1.26.62l.47.25q.39.21.78.45c.19.11.38.21.56.33s.54.34.8.51l.52.35.29.21c.27.19.55.39.81.6l.36.28c.26.2.5.4.75.61l.32.27c.34.3.68.6,1,.92s.93.92,1.37,1.4l.37.41c.31.35.62.71.92,1.07l.3.37c.39.49.77,1,1.14,1.5l.26.39c.25.35.49.71.72,1.07l.35.55.6,1,.31.54c.36.65.72,1.31,1.06,2l.51,1.11c.11.25.22.5.32.76s.2.45.29.69l.3.8c.09.23.18.46.26.7s.26.75.38,1.14l.18.56c.18.57.35,1.16.51,1.76h0c.18.67.35,1.37.51,2.07.05.21.09.43.14.64.11.53.22,1.08.33,1.63,0,.25.09.5.14.75s.07.42.1.63c.07.39.13.77.19,1.17,0,.21.07.43.1.65.06.42.11.85.17,1.29,0,.19.05.37.07.56.07.62.14,1.25.21,1.9s.13,1.46.19,2.21c0,.23,0,.46,0,.69,0,.53.07,1.07.1,1.61,0,.3,0,.61,0,.91,0,.49.05,1,.06,1.46s0,.68,0,1,0,1,0,1.43c0,.67,0,1.34,0,2h0V145.37C267.32,144.81,267.32,144.25,267.31,143.7Z"/>
|
||||
<path class="cls-13"
|
||||
d="M356.8,170.83l.09.09a3.44,3.44,0,0,1,.41.44l.12.15a6,6,0,0,1,.39.59.93.93,0,0,0,.05.1,5.36,5.36,0,0,1,.32.73h0a5.92,5.92,0,0,1,.22.78,1.06,1.06,0,0,1,0,.19,8.46,8.46,0,0,1,.14.9.49.49,0,0,0,0,.12c0,.31,0,.64,0,1V164.28c0-.29,0-.57,0-.84a.49.49,0,0,1,0-.12h0c0-.25-.06-.5-.1-.74,0,0,0-.1,0-.15a1.29,1.29,0,0,0,0-.19c0-.09,0-.19-.06-.27s-.1-.35-.16-.51h0c-.06-.16-.12-.32-.19-.47s-.09-.17-.13-.25l-.05-.1s0-.05,0-.08-.17-.28-.26-.42l-.09-.1-.12-.15-.16-.2-.25-.24-.09-.09a4.06,4.06,0,0,0-.46-.36l-.11-.07-.12-.07-.19-.12-.49-.23c-.26-.11-.53-.22-.81-.31l-.29-.1-.54-.16h0l-.65-.16-.34-.08-1-.19h-.09c-.36-.06-.74-.11-1.12-.15l-.38,0-.82-.07h-.05l-.73,0-.41,0-1.26,0h-3v11.49h3c.43,0,.85,0,1.26,0l.4,0,.79,0,.82.07.38,0,1.12.16h.09l1,.18.34.08.65.16.58.18.29.09c.28.1.55.2.81.31a6.23,6.23,0,0,1,.68.36l.12.07A4.73,4.73,0,0,1,356.8,170.83Z"/>
|
||||
<rect class="cls-13" x="297.24" y="157.13" width="29.56" height="11.49"/>
|
||||
<path class="cls-13"
|
||||
d="M344,106.86c0-.35,0-.69,0-1,0-.08,0-.15,0-.23s0-.35,0-.52,0-.18,0-.27c0-.25-.06-.49-.1-.73s0-.23-.05-.33a1.89,1.89,0,0,0-.05-.23c0-.18-.07-.35-.11-.52s-.05-.23-.08-.34a1.83,1.83,0,0,0-.08-.25l-.12-.4c0-.09-.05-.18-.08-.26s-.09-.23-.14-.35-.08-.21-.13-.31l-.06-.15c-.08-.18-.17-.34-.26-.51a1.74,1.74,0,0,0-.1-.19.08.08,0,0,0,0,0q-.21-.37-.45-.72l0,0c-.09-.12-.19-.24-.29-.35s-.19-.26-.29-.37l0,0a6.14,6.14,0,0,0-.45-.43l-.25-.24a7.62,7.62,0,0,0-.64-.48l-.14-.1h0l-.46-.27a1.11,1.11,0,0,0-.19-.09c-.16-.09-.34-.17-.51-.25s-.29-.13-.44-.18l-.57-.2-.31-.1-.14,0a9.78,9.78,0,0,0-1-.22l-.2,0h0c-.41-.06-.83-.11-1.27-.14h0c-.38,0-.78,0-1.19,0h-.14l-.43,0h-.3c-.21,0-.43,0-.64.09h0l-.13,0c-.15,0-.29,0-.43.09a.35.35,0,0,0-.11,0,1.41,1.41,0,0,0-.22.06l-.24.06-.2.08-.23.08-.14,0-.27.12-.24.11-.08,0-.24.14-.33.18-.07,0-.14.11a4.7,4.7,0,0,0-.53.38l-.12.08-.28.24a53,53,0,0,0-5.88,6.55l-36.43,45.8c-1,1.25-1.86,2.31-2.54,3.17s-1.36,1.75-2,2.68a12.25,12.25,0,0,0-1.44,2.65,7.17,7.17,0,0,0-.45,1.87c0,.2,0,.41,0,.61h0v11.49a7,7,0,0,1,.48-2.49,12.43,12.43,0,0,1,1.44-2.64c.64-.93,1.31-1.82,2-2.69l2.54-3.16L322.12,116a53.27,53.27,0,0,1,5.88-6.56l.4-.32.53-.38.21-.14.33-.19.32-.17.24-.11.41-.17.23-.09.44-.14.22-.06.54-.11.13,0c.23,0,.47-.07.71-.09H333c.19,0,.37,0,.57,0,.42,0,.83,0,1.22,0a12.65,12.65,0,0,1,1.27.14l.25,0q.51.09,1,.21l.45.14c.19.06.39.12.57.19l.44.19.51.24c.23.12.45.24.65.37h0l.15.1a7.62,7.62,0,0,1,.64.48c.09.07.17.16.26.24s.3.28.44.43a3.89,3.89,0,0,1,.32.39c.1.12.2.23.29.36a6.07,6.07,0,0,1,.49.78,1.14,1.14,0,0,1,.1.19c.11.21.22.43.32.65s.09.21.13.32.15.4.22.61l.12.39c.06.2.11.4.16.6s.08.34.11.52.07.37.1.56.07.48.1.73.06.52.08.79c0,.08,0,.15,0,.23,0,.42,0,.84,0,1.29h0V106.86Z"/>
|
||||
<path class="cls-14"
|
||||
d="M181.06,170q3.19,1.36,3.2,5.95a6,6,0,0,1-2.61,5.45c-1.74,1.15-4.36,1.72-7.84,1.72h-4.19v12q0,5-2.34,7.39a9.16,9.16,0,0,1-12.48-.07c-1.58-1.65-2.37-4.1-2.37-7.32v-12H117.92q-6.53,0-9.79-2.78a9.36,9.36,0,0,1-3.27-7.56,7,7,0,0,1,.48-2.49,12.43,12.43,0,0,1,1.44-2.64c.65-.93,1.31-1.82,2-2.69l2.55-3.16L147.76,116a53.36,53.36,0,0,1,5.87-6.56,8.12,8.12,0,0,1,5.54-2q10.44,0,10.45,11.25v50h2.95A22.17,22.17,0,0,1,181.06,170Zm-28.63-1.35V131.09l-29.56,37.53h29.56"/>
|
||||
<path class="cls-14"
|
||||
d="M262.1,126.69q5.22,10.67,5.22,30.17A104.74,104.74,0,0,1,266,175.07a40.85,40.85,0,0,1-5.09,13.83,32.76,32.76,0,0,1-12.1,11.76,33.29,33.29,0,0,1-16.5,4.13,32.86,32.86,0,0,1-18.73-5.55,34.11,34.11,0,0,1-12.48-15.38A54.59,54.59,0,0,1,197.92,172a93.33,93.33,0,0,1-1-14,127.36,127.36,0,0,1,1.1-17.57A55.34,55.34,0,0,1,201.46,127a30.81,30.81,0,0,1,11.79-14.18q7.73-4.87,18.46-4.88a36.2,36.2,0,0,1,12.85,2.17,29.45,29.45,0,0,1,10.14,6.33A36.1,36.1,0,0,1,262.1,126.69Zm-15.06,49a113.49,113.49,0,0,0,1.44-20.15A101.2,101.2,0,0,0,247,136.22c-1-5-2.7-8.81-5.08-11.37S236.2,121,232,121q-9.07,0-12.61,8.59t-3.54,26.48a107,107,0,0,0,1.51,19.9q1.51,7.76,5.09,11.73a12.37,12.37,0,0,0,9.69,4q6.33,0,9.9-4.14c2.39-2.75,4-6.69,5-11.82"/>
|
||||
<path class="cls-14"
|
||||
d="M355.43,170q3.19,1.36,3.2,5.95a6,6,0,0,1-2.62,5.45q-2.61,1.73-7.83,1.72H344v12q0,5-2.33,7.39a8.29,8.29,0,0,1-6.26,2.42,8.19,8.19,0,0,1-6.22-2.49c-1.58-1.65-2.37-4.1-2.37-7.32v-12H292.29q-6.54,0-9.8-2.78a9.42,9.42,0,0,1-3.26-7.56,7,7,0,0,1,.48-2.49,12.43,12.43,0,0,1,1.44-2.64c.64-.93,1.31-1.82,2-2.69l2.54-3.16L322.12,116a53.27,53.27,0,0,1,5.88-6.56,8.1,8.1,0,0,1,5.54-2q10.44,0,10.44,11.25v50h3A22.17,22.17,0,0,1,355.43,170Zm-28.63-1.35V131.09l-29.56,37.53H326.8"/>
|
||||
<path class="cls-15"
|
||||
d="M270.46,172.17c.07,1.42-.5,2.61-1.28,2.64s-1.46-1.08-1.53-2.5.5-2.6,1.28-2.64S270.39,170.75,270.46,172.17Z"/>
|
||||
<path class="cls-16"
|
||||
d="M285.58,170.34c.33,0,.62.46.65,1.06s-.21,1.1-.54,1.12l-.88.09c.12-.19.17-.36,0-.48-.38-.34-.75-.34-1-.08s-.17.57-.48.71h0l-3.26.34-.61.07a3.68,3.68,0,0,0,.19-1.45,3.76,3.76,0,0,0-.33-1.42h2c0,.31.1.73.42.83a19.28,19.28,0,0,0,3.06.13c1,0,.41-.65.47-.93h.29Z"/>
|
||||
<path class="cls-17"
|
||||
d="M279.17,171.65a3.49,3.49,0,0,1-1.1,2.61l-8.67,1.23c.89-.21,1.53-1.64,1.44-3.34S270,169.06,269,169l8.79.38A2.92,2.92,0,0,1,279.17,171.65Z"/>
|
||||
<path class="cls-18"
|
||||
d="M279.37,170.3a3.76,3.76,0,0,1,.33,1.42,3.68,3.68,0,0,1-.19,1.45c-.21.6-.57,1-1,1l-.43.06a3.49,3.49,0,0,0,1.1-2.61,2.92,2.92,0,0,0-1.34-2.3l.44,0C278.7,169.35,279.1,169.71,279.37,170.3Z"/>
|
||||
<path class="cls-18"
|
||||
d="M269.18,174.81c.78,0,1.35-1.22,1.28-2.64s-.75-2.54-1.53-2.5-1.35,1.22-1.28,2.64S268.41,174.85,269.18,174.81Zm1.66-2.66c.09,1.7-.55,3.13-1.44,3.34h0l-.17,0c-1,0-1.86-1.38-2-3.19s.64-3.31,1.63-3.36H269C270,169.06,270.76,170.44,270.84,172.15Z"/>
|
||||
<path d="M303,176a1.14,1.14,0,0,0,.33.71,2.75,2.75,0,0,1-.88-.39A4.37,4.37,0,0,0,303,176Z"/>
|
||||
<path d="M298.64,166.65l.12.16A5.6,5.6,0,0,0,297,169a4.63,4.63,0,0,1-2.06-1.52C296.92,168,297.5,166.05,298.64,166.65Z"/>
|
||||
<path d="M306.62,169.68c-.86-3.88-3.84-4.21-3.84-4.21s-3.07-.47-4.14,1.18l.12.16A5.6,5.6,0,0,0,297,169a6.88,6.88,0,0,0,1.35.43c1.8.34,4.18.13,4.85,1.15s.22,2.66-.91,4.16c-.59.8-.28,1.31.16,1.62A4.37,4.37,0,0,0,303,176a.46.46,0,0,1,.28-.48,1.61,1.61,0,0,1,.49-.11,2.5,2.5,0,0,0,1.34-.39C305.68,174.58,307.49,173.56,306.62,169.68Z"/>
|
||||
<path class="cls-19"
|
||||
d="M320.54,231.08c0,.63.23,3.56-.53,3.84a54,54,0,0,1-7.28,1.17c-1.07,0-.9-.85-.9-.85s7.18-.51,7.81-1.12.32-2.83.06-4.08a23.55,23.55,0,0,1-.41-4.38,16,16,0,0,0,.17-1.74c-.06-.35-1.59-1.62-1.59-1.62.11-.22.39-.31.9-.31s1.4,1.52,1.44,1.87-.38,1.49-.38,2.36S320.49,230.45,320.54,231.08Z"/>
|
||||
<path class="cls-20"
|
||||
d="M319.7,230c.26,1.25.57,3.47-.06,4.08s-7.81,1.12-7.81,1.12,0-.92,0-1.3,4.06-1.18,4.2-2-.47-2.2-1.23-2.16c-.38,0-.48-.26-.49-.57a7.35,7.35,0,0,1,.07-.78c0-.24.95,1,1.35.77s.86-3.75-.28-4.77a1.05,1.05,0,0,0-.86-.28s-.8-.86-.69-1.18.63-.81,1-.31,1.46-.07,1.88-.22a4.57,4.57,0,0,1,1.13-.14s1.53,1.27,1.59,1.62a16,16,0,0,1-.17,1.74A23.55,23.55,0,0,0,319.7,230Z"/>
|
||||
<path class="cls-21"
|
||||
d="M313.73,229.3l.17,3L295,235.55a3.15,3.15,0,0,1-3.64-2.68l-2.74-20.29,9.2,2.1-.35,12.89,16-3v.18Z"/>
|
||||
<path class="cls-22"
|
||||
d="M288.06,204.33c.51.45,9.48,2.36,15.15,2.31h0l-.77,5.1a3.62,3.62,0,0,1-4.4,3l-.24,0-9.2-2.1-8.66-2,1.86,19-2.31.39-4.45.75-.33.06L272.81,204a2.71,2.71,0,0,1,3.39-2.81Z"/>
|
||||
<path class="cls-20"
|
||||
d="M305.83,192.12h0a23,23,0,0,0,.05,2.76l-10.67.31c-.63-.74-1.57-1.4-2-1a.6.6,0,0,0,.34,1c.32,0,1.08.71-.34.58s-2.1-.85-2.62-.44-.66,2.48,0,2.65,4.27.33,5.37-.22l10.05.51c.16,3,.39,6.37.53,7.94a11,11,0,0,1-3.37.43c-5.67.05-14.64-1.86-15.15-2.31s1.25-9.1,2.52-15.42a14.92,14.92,0,0,1-2.92,1.4,5.36,5.36,0,0,1-1.91-2.19,6.93,6.93,0,0,1-.7-4.55,2,2,0,0,1,.24-.6c1.44-1.05,5.18-2.8,7.2-4.19a8.25,8.25,0,0,1,4.06-1.22c-.17.32-.75,3,.87,3.44s5-.87,5-3.08a6.18,6.18,0,0,1,3.22.52c1.77,1,4.07,6.39,5.89,11.34-.32,1.08-2.22,1.88-4,2.19A8.16,8.16,0,0,1,305.83,192.12Z"/>
|
||||
<polygon class="cls-23"
|
||||
points="279.49 229.99 279.48 231.93 275.27 232.85 275.04 231.33 275.04 230.74 279.49 229.99"/>
|
||||
<path class="cls-23"
|
||||
d="M314.38,228.43a7.35,7.35,0,0,0-.07.78h0l-.58.09-.27-4.55,2-.32c1.14,1,.61,4.6.28,4.77S314.38,228.19,314.38,228.43Z"/>
|
||||
<path class="cls-23"
|
||||
d="M314,197.18c-.52-1.65-1.43-4.45-2.51-7.4-.32,1.08-2.22,1.88-4,2.19l1.08,2.83-2.68.08-10.67.31c-.63-.74-1.57-1.4-2-1a.6.6,0,0,0,.34,1c.32,0,1.08.71-.34.58s-2.1-.85-2.62-.44-.66,2.48,0,2.65,4.27.33,5.37-.22l10.05.51,6.84.35A1.11,1.11,0,0,0,314,197.18Z"/>
|
||||
<path class="cls-23"
|
||||
d="M302.38,177.92c0,2.21-3.34,3.52-5,3.08s-1-3.12-.87-3.44a14.35,14.35,0,0,1,1.51,0c.17-.09.3-.54.3-.91a3.83,3.83,0,0,0,1.12.27,5.52,5.52,0,0,0,3-.59c-.32.56-.81,1.15-.74,1.48C301.73,177.92,302,177.93,302.38,177.92Z"/>
|
||||
<path class="cls-23"
|
||||
d="M303.19,170.55c.67,1,.22,2.66-.91,4.16-.59.8-.28,1.31.16,1.62a5.52,5.52,0,0,1-3,.59,3.83,3.83,0,0,1-1.12-.27c-1.65-.71-2.29-2.23-2.05-4.86a9.18,9.18,0,0,1,1-2.68,3.91,3.91,0,0,0,1,.29C300.14,169.74,302.52,169.53,303.19,170.55Z"/>
|
||||
<path class="cls-23"
|
||||
d="M285.29,170.34h0c0-.29-.74-1.21-1.47-1.51a6.8,6.8,0,0,0-2.48,0c-.34,0-.84,1.33-.9,1.48h.9c0,.31.1.73.42.83a19.28,19.28,0,0,0,3.06.13C285.8,171.29,285.23,170.62,285.29,170.34Z"/>
|
||||
<path class="cls-23"
|
||||
d="M283.87,172.05c.22-.26.59-.26,1,.08.14.12.09.29,0,.48l-1.42.15C283.7,172.62,283.64,172.31,283.87,172.05Z"/>
|
||||
<path class="cls-23"
|
||||
d="M283.38,172.76h0l1.42-.15c-.21.34-.64.74-.7,1.06-.09.49-1.08.75-1.52,1.35l-.48,10.24,2.94-1.69a6.93,6.93,0,0,0,.7,4.55L279.2,191a1,1,0,0,1-1.41-1.07l2.2-15.22c.12-1,.13-1.61.13-1.61Z"/>
|
||||
<path class="cls-24" d="M303,187.14l1.72,4.81a3.36,3.36,0,0,0,1.11.17"/>
|
||||
<path class="cls-25"
|
||||
d="M317.87,222.3c.11-.22.39-.31.9-.31s1.4,1.52,1.44,1.87-.38,1.49-.38,2.36.66,4.23.71,4.86.23,3.56-.53,3.84a54,54,0,0,1-7.28,1.17c-1.07,0-.9-.85-.9-.85"/>
|
||||
<ellipse class="cls-23" cx="303.14" cy="173.18" rx="1.32" ry="0.91"
|
||||
transform="translate(13 367.35) rotate(-63.53)"/>
|
||||
<ellipse class="cls-26" cx="303.14" cy="173.18" rx="0.77" ry="0.53"
|
||||
transform="translate(13 367.35) rotate(-63.53)"/>
|
||||
<path class="cls-19"
|
||||
d="M262.55,235.72a.72.72,0,0,1-.12-1.21c-.17.18.05.37.48.39a36.08,36.08,0,0,0,11.77-.55c1-.08,3.65.2,5.06.15,1.16-.05,1.62-.47,1.73-.86a1,1,0,0,1,.17,1.64c-.6.61-4.14.52-4.82.51s-7.56,0-8.57.12A26.72,26.72,0,0,1,262.55,235.72Z"/>
|
||||
<path class="cls-20"
|
||||
d="M280.69,231.61a8.33,8.33,0,0,1,.81,1.8.91.91,0,0,1,0,.23c-.11.39-.57.81-1.73.86-1.41.05-4-.23-5.06-.15a36.08,36.08,0,0,1-11.77.55c-.43,0-.65-.21-.48-.39a33.2,33.2,0,0,1,4.91-1.81,12.78,12.78,0,0,0,6.17-2.66,3.77,3.77,0,0,1,.75,0c.87.08,1.61.44,1.58.78s-.47.82.46.92a3.33,3.33,0,0,0,2.36-.58c.33-.37.34-.67,1-.56.18,0,.33,0,.46,0,.39,0,.58,0,.7.17S280.52,231.25,280.69,231.61Z"/>
|
||||
<path class="cls-25"
|
||||
d="M262.43,234.51a.72.72,0,0,0,.12,1.21,26.72,26.72,0,0,0,5.7.19c1-.17,7.9-.13,8.57-.12s4.22.1,4.82-.51a1,1,0,0,0-.17-1.64h0"/>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 32 KiB |
111
src/assets/images/exception/500.svg
Normal file
111
src/assets/images/exception/500.svg
Normal file
@ -0,0 +1,111 @@
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" viewBox="0 0 456.01 262.12">
|
||||
<defs>
|
||||
<style>
|
||||
.cls-1,.cls-2,.cls-21,.cls-22,.cls-3,.cls-4,.cls-5,.cls-6,.cls-7{fill:none;}.cls-2,.cls-21,.cls-22,.cls-3,.cls-4,.cls-5,.cls-6,.cls-7{stroke-miterlimit:10;}.cls-2,.cls-3,.cls-4,.cls-5,.cls-6,.cls-7{stroke-width:2px;}.cls-2{stroke:url(#未命名的渐变_26);}.cls-3{stroke:url(#未命名的渐变_26-2);}.cls-4{stroke:url(#未命名的渐变_26-3);}.cls-5{stroke:url(#未命名的渐变_26-4);}.cls-6{stroke:url(#未命名的渐变_26-5);}.cls-7{stroke:url(#未命名的渐变_26-6);}.cls-10,.cls-11,.cls-12,.cls-13,.cls-8{opacity:0.4;}.cls-8{fill:url(#未命名的渐变_26-7);}.cls-9{opacity:0.7;}.cls-10{fill:url(#未命名的渐变_26-8);}.cls-11{fill:url(#未命名的渐变_26-9);}.cls-12{fill:url(#未命名的渐变_26-10);}.cls-13{fill:url(#未命名的渐变_26-11);}.cls-14{fill:#67c8ff;}.cls-15{fill:#8cd7ff;}.cls-16{isolation:isolate;}.cls-17{clip-path:url(#clip-path);}.cls-18{fill:#517d94;}.cls-19{fill:#ebfcff;}.cls-20{fill:#ffb056;}.cls-21{stroke:#e49056;stroke-width:0.25px;}.cls-22{stroke:#4986d9;stroke-width:0.13px;}.cls-23{fill:#e49056;}.cls-24{fill:#fae6d2;}.cls-25{fill:#ffeed2;}.cls-26{fill:#d3d3d3;}.cls-27{fill:#fff;}.cls-28{fill:#398eed;}
|
||||
</style>
|
||||
<linearGradient id="未命名的渐变_26" x1="1" y1="91.35" x2="1" y2="181.12" gradientUnits="userSpaceOnUse">
|
||||
<stop offset="0" stop-color="#81cfff"/>
|
||||
<stop offset="1" stop-color="#5ecfff" stop-opacity="0"/>
|
||||
</linearGradient>
|
||||
<linearGradient id="未命名的渐变_26-2" x1="455.01" y1="72.11" x2="455.01" y2="161.88" xlink:href="#未命名的渐变_26"/>
|
||||
<linearGradient id="未命名的渐变_26-3" x1="40.9" y1="143.88" x2="40.9" y2="199.51" xlink:href="#未命名的渐变_26"/>
|
||||
<linearGradient id="未命名的渐变_26-4" x1="64.97" y1="95.36" x2="64.97" y2="123.17" xlink:href="#未命名的渐变_26"/>
|
||||
<linearGradient id="未命名的渐变_26-5" x1="397.23" y1="104.2" x2="397.23" y2="132.02" xlink:href="#未命名的渐变_26"/>
|
||||
<linearGradient id="未命名的渐变_26-6" x1="424.75" y1="133.49" x2="424.75" y2="189.13" xlink:href="#未命名的渐变_26"/>
|
||||
<linearGradient id="未命名的渐变_26-7" x1="232.75" y1="224.43" x2="232.75" y2="262.12" xlink:href="#未命名的渐变_26"/>
|
||||
<linearGradient id="未命名的渐变_26-8" x1="349.36" y1="26.68" x2="349.36" y2="204.03" xlink:href="#未命名的渐变_26"/>
|
||||
<linearGradient id="未命名的渐变_26-9" x1="201.45" y1="55.61" x2="201.45" y2="204.03" xlink:href="#未命名的渐变_26"/>
|
||||
<linearGradient id="未命名的渐变_26-10" x1="122.98" y1="26.68" x2="122.98" y2="204.03" xlink:href="#未命名的渐变_26"/>
|
||||
<linearGradient id="未命名的渐变_26-11" x1="273.51" y1="0" x2="273.51" y2="209.54" xlink:href="#未命名的渐变_26"/>
|
||||
<clipPath id="clip-path">
|
||||
<path class="cls-1"
|
||||
d="M132.71,143.17v-8.64c1.84-.15,3.62-.2,5.32-.2s3.18,0,4.65.11c7.58.36,16.62,3.36,22.3,8.63s7.84,11.57,7.84,20.58v8.64c0-9-2.17-15.32-7.84-20.58s-14.72-8.27-22.3-8.63c-1.47-.07-3-.12-4.65-.12S134.55,143,132.71,143.17Z"/>
|
||||
</clipPath>
|
||||
</defs>
|
||||
<title>500</title>
|
||||
<g id="图层_2" data-name="图层 2">
|
||||
<g id="图层_1-2" data-name="图层 1">
|
||||
<line class="cls-2" x1="1" y1="91.35" x2="1" y2="181.12"/>
|
||||
<line class="cls-3" x1="455.01" y1="72.11" x2="455.01" y2="161.88"/>
|
||||
<line class="cls-4" x1="40.9" y1="143.88" x2="40.9" y2="199.51"/>
|
||||
<line class="cls-5" x1="64.97" y1="95.36" x2="64.97" y2="123.17"/>
|
||||
<line class="cls-6" x1="397.23" y1="104.2" x2="397.23" y2="132.02"/>
|
||||
<line class="cls-7" x1="424.75" y1="133.49" x2="424.75" y2="189.13"/>
|
||||
<path class="cls-8" d="M412.28,262.12c-23-23-61-37.69-179.53-37.69S76.24,239.1,53.21,262.12Z"/>
|
||||
<g class="cls-9">
|
||||
<path class="cls-10"
|
||||
d="M380.66,26.68H318.07a2.71,2.71,0,0,0-2.82,2.59V201.44a2.71,2.71,0,0,0,2.82,2.59h62.59a2.72,2.72,0,0,0,2.82-2.59V29.27A2.72,2.72,0,0,0,380.66,26.68ZM328.3,147a.9.9,0,0,1-.95.87h-3.6a.9.9,0,0,1-.95-.87V127.27a.91.91,0,0,1,.95-.87h3.6a.91.91,0,0,1,.95.87Zm0-30.23a.91.91,0,0,1-.95.87h-3.6a.91.91,0,0,1-.95-.87V97a.91.91,0,0,1,.95-.87h3.6a.91.91,0,0,1,.95.87Zm0-30.24a.91.91,0,0,1-.95.87h-3.6a.91.91,0,0,1-.95-.87V66.8a.91.91,0,0,1,.95-.87h3.6a.91.91,0,0,1,.95.87Zm0-30.24a.91.91,0,0,1-.95.87h-3.6a.91.91,0,0,1-.95-.87V36.56a.91.91,0,0,1,.95-.87h3.6a.91.91,0,0,1,.95.87ZM340,147a.9.9,0,0,1-.94.87h-3.61a.91.91,0,0,1-.95-.87V127.27a.92.92,0,0,1,.95-.87h3.61a.91.91,0,0,1,.94.87Zm0-30.23a.91.91,0,0,1-.94.87h-3.61a.92.92,0,0,1-.95-.87V97a.92.92,0,0,1,.95-.87h3.61A.91.91,0,0,1,340,97Zm0-30.24a.91.91,0,0,1-.94.87h-3.61a.92.92,0,0,1-.95-.87V66.8a.92.92,0,0,1,.95-.87h3.61a.91.91,0,0,1,.94.87Zm0-30.24a.91.91,0,0,1-.94.87h-3.61a.92.92,0,0,1-.95-.87V36.56a.92.92,0,0,1,.95-.87h3.61a.91.91,0,0,1,.94.87ZM351.7,147a.9.9,0,0,1-.94.87h-3.61a.9.9,0,0,1-.94-.87V127.27a.91.91,0,0,1,.94-.87h3.61a.91.91,0,0,1,.94.87Zm0-30.23a.91.91,0,0,1-.94.87h-3.61a.91.91,0,0,1-.94-.87V97a.91.91,0,0,1,.94-.87h3.61a.91.91,0,0,1,.94.87Zm0-30.24a.91.91,0,0,1-.94.87h-3.61a.91.91,0,0,1-.94-.87V66.8a.91.91,0,0,1,.94-.87h3.61a.91.91,0,0,1,.94.87Zm0-30.24a.91.91,0,0,1-.94.87h-3.61a.91.91,0,0,1-.94-.87V36.56a.91.91,0,0,1,.94-.87h3.61a.91.91,0,0,1,.94.87ZM363.4,147a.9.9,0,0,1-.94.87h-3.61a.9.9,0,0,1-.94-.87V127.27a.91.91,0,0,1,.94-.87h3.61a.91.91,0,0,1,.94.87Zm0-30.23a.91.91,0,0,1-.94.87h-3.61a.91.91,0,0,1-.94-.87V97a.91.91,0,0,1,.94-.87h3.61a.91.91,0,0,1,.94.87Zm0-30.24a.91.91,0,0,1-.94.87h-3.61a.91.91,0,0,1-.94-.87V66.8a.91.91,0,0,1,.94-.87h3.61a.91.91,0,0,1,.94.87Zm0-30.24a.91.91,0,0,1-.94.87h-3.61a.91.91,0,0,1-.94-.87V36.56a.91.91,0,0,1,.94-.87h3.61a.91.91,0,0,1,.94.87ZM375.11,147a.91.91,0,0,1-.95.87h-3.61a.9.9,0,0,1-.94-.87V127.27a.91.91,0,0,1,.94-.87h3.61a.92.92,0,0,1,.95.87Zm0-30.23a.92.92,0,0,1-.95.87h-3.61a.91.91,0,0,1-.94-.87V97a.91.91,0,0,1,.94-.87h3.61a.92.92,0,0,1,.95.87Zm0-30.24a.92.92,0,0,1-.95.87h-3.61a.91.91,0,0,1-.94-.87V66.8a.91.91,0,0,1,.94-.87h3.61a.92.92,0,0,1,.95.87Zm0-30.24a.92.92,0,0,1-.95.87h-3.61a.91.91,0,0,1-.94-.87V36.56a.91.91,0,0,1,.94-.87h3.61a.92.92,0,0,1,.95.87Z"/>
|
||||
<path class="cls-11"
|
||||
d="M231.1,55.61H171.8A2.71,2.71,0,0,0,169,58.2V201.44A2.71,2.71,0,0,0,171.8,204h59.3a2.71,2.71,0,0,0,2.82-2.59V58.2A2.71,2.71,0,0,0,231.1,55.61ZM182.47,159.37a1.16,1.16,0,0,1-1.2,1.11h-5.4a1.16,1.16,0,0,1-1.2-1.11v-5.22a1.15,1.15,0,0,1,1.2-1.1h5.4a1.15,1.15,0,0,1,1.2,1.1Zm0-12.88a1.15,1.15,0,0,1-1.2,1.1h-5.4a1.15,1.15,0,0,1-1.2-1.1v-5.22a1.16,1.16,0,0,1,1.2-1.11h5.4a1.16,1.16,0,0,1,1.2,1.11Zm0-12.89a1.16,1.16,0,0,1-1.2,1.11h-5.4a1.16,1.16,0,0,1-1.2-1.11v-5.22a1.15,1.15,0,0,1,1.2-1.1h5.4a1.15,1.15,0,0,1,1.2,1.1Zm0-12.88a1.15,1.15,0,0,1-1.2,1.1h-5.4a1.15,1.15,0,0,1-1.2-1.1V115.5a1.16,1.16,0,0,1,1.2-1.11h5.4a1.16,1.16,0,0,1,1.2,1.11Zm0-12.89a1.16,1.16,0,0,1-1.2,1.11h-5.4a1.16,1.16,0,0,1-1.2-1.11v-5.21a1.15,1.15,0,0,1,1.2-1.11h5.4a1.15,1.15,0,0,1,1.2,1.11Zm0-12.88a1.15,1.15,0,0,1-1.2,1.1h-5.4a1.15,1.15,0,0,1-1.2-1.1V89.73a1.16,1.16,0,0,1,1.2-1.11h5.4a1.16,1.16,0,0,1,1.2,1.11Zm0-12.89a1.16,1.16,0,0,1-1.2,1.11h-5.4a1.16,1.16,0,0,1-1.2-1.11V76.85a1.15,1.15,0,0,1,1.2-1.11h5.4a1.15,1.15,0,0,1,1.2,1.11Zm0-12.88a1.15,1.15,0,0,1-1.2,1.1h-5.4a1.15,1.15,0,0,1-1.2-1.1V64a1.16,1.16,0,0,1,1.2-1.11h5.4a1.16,1.16,0,0,1,1.2,1.11Zm10.08,90.19a1.16,1.16,0,0,1-1.2,1.11H186a1.16,1.16,0,0,1-1.21-1.11v-5.22a1.16,1.16,0,0,1,1.21-1.1h5.4a1.15,1.15,0,0,1,1.2,1.1Zm0-12.88a1.15,1.15,0,0,1-1.2,1.1H186a1.16,1.16,0,0,1-1.21-1.1v-5.22a1.16,1.16,0,0,1,1.21-1.11h5.4a1.16,1.16,0,0,1,1.2,1.11Zm0-12.89a1.16,1.16,0,0,1-1.2,1.11H186a1.16,1.16,0,0,1-1.21-1.11v-5.22a1.16,1.16,0,0,1,1.21-1.1h5.4a1.15,1.15,0,0,1,1.2,1.1Zm0-12.88a1.15,1.15,0,0,1-1.2,1.1H186a1.16,1.16,0,0,1-1.21-1.1V115.5a1.16,1.16,0,0,1,1.21-1.11h5.4a1.16,1.16,0,0,1,1.2,1.11Zm0-12.89a1.16,1.16,0,0,1-1.2,1.11H186a1.16,1.16,0,0,1-1.21-1.11v-5.21a1.16,1.16,0,0,1,1.21-1.11h5.4a1.15,1.15,0,0,1,1.2,1.11Zm0-12.88a1.15,1.15,0,0,1-1.2,1.1H186a1.16,1.16,0,0,1-1.21-1.1V89.73A1.16,1.16,0,0,1,186,88.62h5.4a1.16,1.16,0,0,1,1.2,1.11Zm0-12.89a1.16,1.16,0,0,1-1.2,1.11H186a1.16,1.16,0,0,1-1.21-1.11V76.85A1.16,1.16,0,0,1,186,75.74h5.4a1.15,1.15,0,0,1,1.2,1.11Zm0-12.88a1.15,1.15,0,0,1-1.2,1.1H186a1.16,1.16,0,0,1-1.21-1.1V64A1.16,1.16,0,0,1,186,62.85h5.4a1.16,1.16,0,0,1,1.2,1.11Zm10.08,90.19a1.16,1.16,0,0,1-1.21,1.11H196a1.16,1.16,0,0,1-1.2-1.11v-5.22a1.15,1.15,0,0,1,1.2-1.1h5.4a1.16,1.16,0,0,1,1.21,1.1Zm0-12.88a1.16,1.16,0,0,1-1.21,1.1H196a1.15,1.15,0,0,1-1.2-1.1v-5.22a1.16,1.16,0,0,1,1.2-1.11h5.4a1.16,1.16,0,0,1,1.21,1.11Zm0-12.89a1.16,1.16,0,0,1-1.21,1.11H196a1.16,1.16,0,0,1-1.2-1.11v-5.22a1.15,1.15,0,0,1,1.2-1.1h5.4a1.16,1.16,0,0,1,1.21,1.1Zm0-12.88a1.16,1.16,0,0,1-1.21,1.1H196a1.15,1.15,0,0,1-1.2-1.1V115.5a1.16,1.16,0,0,1,1.2-1.11h5.4a1.16,1.16,0,0,1,1.21,1.11Zm0-12.89a1.16,1.16,0,0,1-1.21,1.11H196a1.16,1.16,0,0,1-1.2-1.11v-5.21a1.15,1.15,0,0,1,1.2-1.11h5.4a1.16,1.16,0,0,1,1.21,1.11Zm0-12.88a1.16,1.16,0,0,1-1.21,1.1H196a1.15,1.15,0,0,1-1.2-1.1V89.73a1.16,1.16,0,0,1,1.2-1.11h5.4a1.16,1.16,0,0,1,1.21,1.11Zm0-12.89a1.16,1.16,0,0,1-1.21,1.11H196a1.16,1.16,0,0,1-1.2-1.11V76.85a1.15,1.15,0,0,1,1.2-1.11h5.4a1.16,1.16,0,0,1,1.21,1.11Zm0-12.88a1.16,1.16,0,0,1-1.21,1.1H196a1.15,1.15,0,0,1-1.2-1.1V64a1.16,1.16,0,0,1,1.2-1.11h5.4A1.16,1.16,0,0,1,202.63,64Zm25.21,90.19a1.16,1.16,0,0,1-1.2,1.11H206.1a1.16,1.16,0,0,1-1.2-1.11v-5.22a1.15,1.15,0,0,1,1.2-1.1h20.54a1.15,1.15,0,0,1,1.2,1.1Zm0-12.88a1.15,1.15,0,0,1-1.2,1.1H206.1a1.15,1.15,0,0,1-1.2-1.1v-5.22a1.16,1.16,0,0,1,1.2-1.11h20.54a1.16,1.16,0,0,1,1.2,1.11Zm0-12.89a1.16,1.16,0,0,1-1.2,1.11H206.1a1.16,1.16,0,0,1-1.2-1.11v-5.22a1.15,1.15,0,0,1,1.2-1.1h20.54a1.15,1.15,0,0,1,1.2,1.1Zm0-12.88a1.15,1.15,0,0,1-1.2,1.1H206.1a1.15,1.15,0,0,1-1.2-1.1V115.5a1.16,1.16,0,0,1,1.2-1.11h20.54a1.16,1.16,0,0,1,1.2,1.11Zm0-12.89a1.16,1.16,0,0,1-1.2,1.11H206.1a1.16,1.16,0,0,1-1.2-1.11v-5.21a1.15,1.15,0,0,1,1.2-1.11h20.54a1.15,1.15,0,0,1,1.2,1.11Zm0-12.88a1.15,1.15,0,0,1-1.2,1.1H206.1a1.15,1.15,0,0,1-1.2-1.1V89.73a1.16,1.16,0,0,1,1.2-1.11h20.54a1.16,1.16,0,0,1,1.2,1.11Zm0-12.89a1.16,1.16,0,0,1-1.2,1.11H206.1a1.16,1.16,0,0,1-1.2-1.11V76.85a1.15,1.15,0,0,1,1.2-1.11h20.54a1.15,1.15,0,0,1,1.2,1.11Zm0-12.88a1.15,1.15,0,0,1-1.2,1.1H206.1a1.15,1.15,0,0,1-1.2-1.1V64a1.16,1.16,0,0,1,1.2-1.11h20.54a1.16,1.16,0,0,1,1.2,1.11Z"/>
|
||||
<path class="cls-12"
|
||||
d="M161.13,26.68H84.83A2.71,2.71,0,0,0,82,29.27V201.44A2.71,2.71,0,0,0,84.83,204h76.3a2.71,2.71,0,0,0,2.82-2.59V29.27A2.71,2.71,0,0,0,161.13,26.68ZM154.34,161a1.16,1.16,0,0,1-1.2,1.11H92.83A1.16,1.16,0,0,1,91.62,161v-5.21a1.16,1.16,0,0,1,1.21-1.11h60.31a1.15,1.15,0,0,1,1.2,1.11Zm0-14.67a1.15,1.15,0,0,1-1.2,1.1H92.83a1.16,1.16,0,0,1-1.21-1.1v-5.22A1.16,1.16,0,0,1,92.83,140h60.31a1.16,1.16,0,0,1,1.2,1.11Zm0-14.68a1.16,1.16,0,0,1-1.2,1.11H92.83a1.16,1.16,0,0,1-1.21-1.11v-5.22a1.16,1.16,0,0,1,1.21-1.1h60.31a1.15,1.15,0,0,1,1.2,1.1Zm0-14.68a1.16,1.16,0,0,1-1.2,1.11H92.83a1.16,1.16,0,0,1-1.21-1.11v-5.21a1.16,1.16,0,0,1,1.21-1.11h60.31a1.15,1.15,0,0,1,1.2,1.11Zm0-14.67a1.15,1.15,0,0,1-1.2,1.1H92.83a1.16,1.16,0,0,1-1.21-1.1V97a1.16,1.16,0,0,1,1.21-1.11h60.31a1.16,1.16,0,0,1,1.2,1.11Zm0-14.68a1.16,1.16,0,0,1-1.2,1.11H92.83a1.16,1.16,0,0,1-1.21-1.11V82.35a1.16,1.16,0,0,1,1.21-1.1h60.31a1.15,1.15,0,0,1,1.2,1.1Zm0-14.68a1.16,1.16,0,0,1-1.2,1.11H92.83a1.16,1.16,0,0,1-1.21-1.11V67.68a1.16,1.16,0,0,1,1.21-1.11h60.31a1.15,1.15,0,0,1,1.2,1.11Zm0-14.67a1.15,1.15,0,0,1-1.2,1.1H92.83a1.16,1.16,0,0,1-1.21-1.1V53a1.16,1.16,0,0,1,1.21-1.11h60.31a1.16,1.16,0,0,1,1.2,1.11Zm0-14.68a1.16,1.16,0,0,1-1.2,1.11H92.83a1.16,1.16,0,0,1-1.21-1.11V38.32a1.16,1.16,0,0,1,1.21-1.1h60.31a1.15,1.15,0,0,1,1.2,1.1Z"/>
|
||||
<path class="cls-13"
|
||||
d="M306.21,0H240.82a2.51,2.51,0,0,0-2.42,2.59V206.94a2.51,2.51,0,0,0,2.42,2.6h65.39a2.51,2.51,0,0,0,2.41-2.6V2.59A2.51,2.51,0,0,0,306.21,0Zm-5.82,134.28a1.06,1.06,0,0,1-1,1.1H247.67a1.06,1.06,0,0,1-1-1.1v-5.22a1.07,1.07,0,0,1,1-1.11h51.69a1.07,1.07,0,0,1,1,1.11Zm0-14.68a1.07,1.07,0,0,1-1,1.11H247.67a1.07,1.07,0,0,1-1-1.11v-5.22a1.06,1.06,0,0,1,1-1.1h51.69a1.06,1.06,0,0,1,1,1.1Zm0-14.68a1.07,1.07,0,0,1-1,1.11H247.67a1.07,1.07,0,0,1-1-1.11V99.71a1.07,1.07,0,0,1,1-1.11h51.69a1.07,1.07,0,0,1,1,1.11Zm0-14.67a1.06,1.06,0,0,1-1,1.1H247.67a1.06,1.06,0,0,1-1-1.1V85a1.07,1.07,0,0,1,1-1.11h51.69a1.07,1.07,0,0,1,1,1.11Zm0-14.68a1.07,1.07,0,0,1-1,1.11H247.67a1.07,1.07,0,0,1-1-1.11V70.35a1.06,1.06,0,0,1,1-1.1h51.69a1.06,1.06,0,0,1,1,1.1Zm0-14.68a1.07,1.07,0,0,1-1,1.11H247.67a1.07,1.07,0,0,1-1-1.11V55.68a1.07,1.07,0,0,1,1-1.11h51.69a1.07,1.07,0,0,1,1,1.11Zm0-14.67a1.06,1.06,0,0,1-1,1.1H247.67a1.06,1.06,0,0,1-1-1.1V41a1.07,1.07,0,0,1,1-1.11h51.69a1.07,1.07,0,0,1,1,1.11Zm0-14.68a1.07,1.07,0,0,1-1,1.11H247.67a1.07,1.07,0,0,1-1-1.11V26.32a1.06,1.06,0,0,1,1-1.1h51.69a1.06,1.06,0,0,1,1,1.1Zm0-14.68a1.07,1.07,0,0,1-1,1.11H247.67a1.07,1.07,0,0,1-1-1.11V11.65a1.07,1.07,0,0,1,1-1.11h51.69a1.07,1.07,0,0,1,1,1.11Z"/>
|
||||
</g>
|
||||
<path class="cls-14"
|
||||
d="M240.54,164.63c-1,5.12-2.63,9.07-5,11.82-.27.31-.56.6-.85.88l-.27.24c-.19.17-.39.33-.6.49l-.55.4-.6.38-.38.22q-.42.23-.87.42l-.19.09c-.37.15-.74.28-1.13.4l-.3.08c-.31.09-.63.16-1,.23l-.32.06q-.64.12-1.32.18H227c-.44,0-.88.06-1.33.06s-.9,0-1.34-.06l-.71-.08-.76-.1-.21,0a10.34,10.34,0,0,1-1.16-.27c-.25-.07-.48-.16-.72-.24l-.55-.19c-.24-.1-.47-.22-.7-.33l-.48-.23-.21-.13c-.28-.16-.56-.33-.82-.51s-.41-.32-.61-.48a5,5,0,0,1-.43-.34c-.21-.18-.41-.39-.61-.59l-.38-.38c-.27-.3-.52-.62-.77-.94l-.17-.22q-.36-.5-.69-1l-.1-.17c-.21-.34-.41-.68-.6-1.05l-.09-.18c-.2-.39-.4-.79-.58-1.21l-.14-.32c-.17-.4-.33-.81-.49-1.23a.78.78,0,0,0-.05-.14c-.17-.48-.33-1-.48-1.48-.05-.14-.08-.28-.13-.42-.11-.4-.22-.79-.32-1.2,0-.16-.08-.31-.11-.47-.13-.54-.26-1.1-.37-1.68s-.23-1.24-.34-1.89c0-.05,0-.1,0-.15-.1-.61-.19-1.25-.27-1.9,0-.16-.05-.34-.07-.51-.07-.56-.13-1.14-.2-1.73l0-.34c0-.33-.06-.69-.09-1-.05-.49-.09-1-.13-1.48s0-.74-.07-1.12-.07-1-.09-1.5l-.06-1.22c0-.51,0-1-.06-1.55s0-.86,0-1.3,0-1.06,0-1.61c0-.84,0-1.69,0-2.57v11.49c0,.75,0,1.48,0,2.21,0,.12,0,.24,0,.36,0,.54,0,1.08,0,1.61l0,1.3c0,.53,0,1,.06,1.55l.06,1.22c0,.51.06,1,.09,1.5s0,.75.07,1.12.08,1,.13,1.48c0,.3,0,.61.07.9,0,0,0,.08,0,.13l0,.34c.07.59.13,1.17.2,1.73,0,.17,0,.34.07.51.08.65.17,1.29.27,1.9,0,0,0,.1,0,.14.07.41.14.82.21,1.21,0,.23.08.46.13.69.11.58.24,1.13.37,1.68,0,.16.07.31.11.46s.09.38.14.56l.18.64c0,.15.08.29.13.43.14.49.3,1,.46,1.42,0,0,0,0,0,.05a.88.88,0,0,1,.05.15c.16.42.32.83.49,1.23,0,.11.09.21.14.31s.07.18.11.26c.15.33.31.65.47,1l.09.18c.1.18.19.37.29.54s.21.34.31.51l.1.17c.18.28.35.55.54.81l.15.2.17.22a12.06,12.06,0,0,0,.77.94l.05.07.34.32c.19.2.39.4.6.59a5,5,0,0,0,.43.34c.2.16.4.33.61.47l.07.06c.24.17.49.31.75.46l.21.12,0,0c.15.08.31.14.46.21a6.36,6.36,0,0,0,.7.33c.18.08.37.13.55.19s.47.18.72.25h0c.36.1.74.19,1.12.26l.21,0,.19,0,.57.07.71.08.14,0q.58,0,1.2,0h.26c.36,0,.71,0,1.07,0h.25c.39,0,.77-.09,1.13-.15l.17,0,.32-.06.52-.11c.15,0,.29-.08.44-.12l.3-.09.18,0a9.44,9.44,0,0,0,.89-.32l.06,0,.19-.09c.21-.09.43-.18.63-.29l.24-.14c.13-.06.25-.14.38-.21s.21-.11.31-.18l.29-.2.55-.4c.08-.07.17-.12.25-.18l.35-.31.27-.25a11.68,11.68,0,0,0,.85-.87q3.57-4.14,5-11.82A112.54,112.54,0,0,0,242,156V144.47A112.54,112.54,0,0,1,240.54,164.63Z"/>
|
||||
<path class="cls-14"
|
||||
d="M260.82,144.09c0-.11,0-.22,0-.34l0-1.43,0-1c0-.49,0-1-.06-1.46,0-.3,0-.61,0-.91,0-.55-.07-1.08-.1-1.62,0-.22,0-.45-.05-.68-.05-.75-.12-1.49-.19-2.22v0c-.06-.63-.13-1.26-.2-1.87,0-.19-.05-.38-.07-.57l-.18-1.28-.09-.66c-.06-.39-.12-.78-.19-1.16,0-.21-.07-.42-.11-.63s0-.23-.06-.35-.05-.26-.08-.4c-.1-.55-.21-1.1-.33-1.64,0-.21-.09-.42-.13-.63-.17-.71-.33-1.4-.51-2.08h0l-.51-1.77-.18-.56c-.13-.38-.25-.76-.38-1.13a1.72,1.72,0,0,1-.07-.21c-.06-.17-.13-.33-.19-.5l-.3-.79c-.1-.24-.19-.47-.29-.7l-.32-.75-.11-.26c-.13-.29-.27-.57-.41-.85-.34-.69-.69-1.35-1-2l-.14-.25c0-.1-.11-.19-.17-.29l-.6-1-.35-.55c-.23-.37-.48-.72-.72-1.08-.07-.1-.14-.22-.22-.32l0-.06c-.36-.52-.74-1-1.13-1.5l-.3-.37c-.3-.37-.61-.72-.92-1.07l-.2-.24-.17-.17c-.45-.48-.9-1-1.37-1.4s-.67-.62-1-.92l-.32-.27-.75-.61-.36-.29-.81-.6-.29-.21-.1-.06-.42-.28c-.27-.17-.53-.35-.8-.51s-.37-.23-.56-.34l-.78-.45-.18-.1-.3-.14c-.41-.22-.83-.42-1.25-.62l-.49-.23c-.56-.25-1.13-.49-1.72-.71s-.91-.32-1.38-.47l-.45-.14c-.25-.08-.49-.16-.74-.22l-.18,0c-.48-.13-1-.26-1.48-.37l-.25-.06c-.58-.12-1.18-.23-1.78-.33l-.12,0-.58-.07-1-.14-.75-.07c-.32,0-.65-.07-1-.09l-.24,0-.8,0-.51,0c-.54,0-1.08,0-1.63,0h-.91l-1.05,0-.48,0c-.47,0-.94,0-1.4.09h-.07l-1.34.14-.41.06-.91.13-.13,0-.41.08-.7.12-.55.12-.66.14-.2,0-.37.09-.6.16-.56.16-.59.17-.21.07-.33.11-.59.2-.53.2-.58.21a1.57,1.57,0,0,1-.23.09l-.27.12-.62.27-.49.22-.6.29-.29.14-.17.09-.77.41-.35.2c-.37.21-.73.42-1.09.65l0,0c-.57.36-1.12.75-1.67,1.15l-.48.37-.66.5-.47.42-.56.48c-.36.33-.72.67-1.07,1l-.44.43c-.48.51-1,1-1.4,1.56l-.17.22c-.39.48-.77,1-1.13,1.47-.14.19-.27.39-.41.59-.28.4-.55.81-.81,1.24-.14.22-.28.44-.41.66-.26.45-.51.9-.76,1.36l-.33.62c-.34.67-.67,1.36-1,2.07a54.8,54.8,0,0,0-3.44,13.43,125.91,125.91,0,0,0-1.1,17.57v11.49a125.91,125.91,0,0,1,1.1-17.57A54.8,54.8,0,0,1,195,127.35c.31-.72.64-1.4,1-2.07l.33-.63c.25-.46.5-.91.76-1.35.13-.22.27-.44.41-.66.26-.43.53-.84.81-1.25l.41-.58c.36-.51.74-1,1.13-1.47l.17-.22c.45-.54.92-1.06,1.4-1.56.14-.15.29-.29.44-.43.35-.35.71-.69,1.07-1l.56-.49,1.13-.92.48-.36c.56-.41,1.12-.8,1.71-1.17.36-.23.72-.45,1.09-.66l.35-.19.77-.41c.15-.08.3-.16.46-.23l.6-.29.49-.22c.2-.1.41-.18.62-.27l.5-.21.58-.22.53-.19.59-.2.54-.18.59-.17.56-.16.6-.16.57-.14.66-.14.56-.12.68-.13.55-.09.9-.13.42-.06,1.34-.14h.07l1.4-.1.48,0,1.05,0h.91c.55,0,1.09,0,1.63,0l.51,0,1,.06,1,.09.75.08,1,.13.7.1c.6.1,1.2.21,1.78.34l.25.06c.5.11,1,.23,1.48.37l.92.26.45.14q.7.23,1.38.48c.59.22,1.16.46,1.72.71l.49.23c.42.19.84.4,1.25.61l.48.25.78.45.56.33.8.52.52.34.29.21.81.6.36.28.75.61.32.28c.34.29.68.6,1,.91s.92.92,1.37,1.41l.37.4c.31.35.62.71.92,1.07l.3.37c.39.49.77,1,1.13,1.5l.27.39c.24.35.49.71.72,1.08l.35.55.6,1c.1.18.2.36.31.54.36.65.71,1.31,1,2,.18.36.35.74.52,1.11s.21.51.32.76l.29.69.3.8c.09.23.17.47.26.71s.25.75.38,1.13l.18.56c.17.57.34,1.16.5,1.76h0c.18.67.34,1.37.51,2.08,0,.21.09.42.13.63.12.54.23,1.08.33,1.64.05.25.1.49.14.75s.08.42.11.63c.07.38.13.77.19,1.16l.09.65.18,1.29c0,.19,0,.38.07.57.07.62.14,1.25.2,1.89s.14,1.47.19,2.22c0,.22,0,.45.05.68,0,.53.07,1.07.1,1.62,0,.3,0,.6,0,.91,0,.48.05,1,.06,1.46l0,1,0,1.43c0,.66,0,1.33,0,2h0V145.77C260.83,145.2,260.82,144.65,260.82,144.09Z"/>
|
||||
<path class="cls-15"
|
||||
d="M255.6,127.08q5.23,10.67,5.23,30.18a103.75,103.75,0,0,1-1.38,18.21,40.8,40.8,0,0,1-5.09,13.83,32.63,32.63,0,0,1-12.09,11.75,33.35,33.35,0,0,1-16.5,4.14A32.93,32.93,0,0,1,207,199.63a34.21,34.21,0,0,1-12.48-15.37,54.27,54.27,0,0,1-3.12-11.86,92,92,0,0,1-1-14.05,125.91,125.91,0,0,1,1.1-17.57A54.8,54.8,0,0,1,195,127.35a30.64,30.64,0,0,1,11.79-14.18q7.73-4.87,18.46-4.88a36.47,36.47,0,0,1,12.85,2.16,29.6,29.6,0,0,1,10.14,6.33A36.27,36.27,0,0,1,255.6,127.08Zm-15.06,49A112.54,112.54,0,0,0,242,156a101,101,0,0,0-1.51-19.34q-1.51-7.53-5.09-11.38c-2.39-2.56-5.68-3.84-9.9-3.84q-9.08,0-12.61,8.59t-3.54,26.49a107,107,0,0,0,1.51,19.9q1.52,7.74,5.09,11.72a12.37,12.37,0,0,0,9.69,4q6.31,0,9.9-4.13t5-11.82"/>
|
||||
<path class="cls-14"
|
||||
d="M323.79,164.63c-1,5.12-2.63,9.07-5,11.82-.27.31-.56.6-.85.88l-.27.24c-.19.17-.39.33-.6.49l-.55.4-.6.38-.38.22q-.42.23-.87.42l-.19.09c-.37.15-.74.28-1.13.4l-.3.08c-.31.09-.63.16-1,.23l-.32.06q-.64.12-1.32.18h-.23c-.44,0-.88.06-1.33.06s-.9,0-1.34-.06l-.71-.08-.76-.1-.21,0a10.34,10.34,0,0,1-1.16-.27c-.25-.07-.48-.16-.72-.24l-.55-.19c-.24-.1-.47-.22-.7-.33l-.48-.23-.21-.13c-.28-.16-.56-.33-.82-.51s-.41-.32-.61-.48a5,5,0,0,1-.43-.34c-.21-.18-.41-.39-.61-.59l-.38-.38c-.27-.3-.52-.62-.77-.94l-.17-.22q-.36-.5-.69-1l-.1-.17c-.21-.34-.41-.68-.6-1.05l-.09-.18c-.2-.39-.4-.79-.58-1.21l-.14-.32q-.26-.6-.48-1.23l-.06-.14c-.17-.48-.33-1-.48-1.48,0-.14-.08-.28-.13-.42-.11-.4-.22-.79-.32-1.2,0-.16-.08-.31-.11-.47-.13-.54-.26-1.1-.37-1.68s-.23-1.24-.34-1.89a.77.77,0,0,0,0-.15c-.1-.61-.19-1.25-.27-1.9,0-.16-.05-.34-.07-.51-.07-.56-.13-1.14-.19-1.73,0-.11,0-.23,0-.34,0-.33-.06-.69-.09-1-.05-.49-.09-1-.13-1.48s-.05-.74-.07-1.12-.07-1-.09-1.5l-.06-1.22c0-.51,0-1-.06-1.55s0-.86,0-1.3,0-1.06,0-1.61c0-.84,0-1.69,0-2.57v11.49c0,.75,0,1.48,0,2.21,0,.12,0,.24,0,.36,0,.54,0,1.08,0,1.61l0,1.3c0,.53,0,1,.06,1.55l.06,1.22c0,.51.06,1,.09,1.5s.05.75.07,1.12.08,1,.13,1.48c0,.3.05.61.07.9,0,0,0,.08,0,.13s0,.22,0,.34c.06.59.12,1.17.19,1.73,0,.17,0,.34.07.51.08.65.17,1.29.27,1.9a.78.78,0,0,1,0,.14c.07.41.14.82.21,1.21,0,.23.08.46.13.69.11.58.24,1.13.37,1.68,0,.16.07.31.11.46s.09.38.14.56l.18.64c.05.15.09.29.13.43.15.49.3,1,.46,1.42l0,.05.06.15q.23.63.48,1.23c.05.11.09.21.14.31s.07.18.11.26c.15.33.31.65.47,1l.09.18c.1.18.2.37.3.54s.2.34.3.51l.1.17.54.81.15.2.17.22a12.06,12.06,0,0,0,.77.94l.06.07c.1.11.22.21.33.32s.39.4.6.59l.43.34c.2.16.4.33.61.47l.07.06c.24.17.5.31.75.46l.21.12,0,0c.15.08.31.14.46.21a6.36,6.36,0,0,0,.7.33c.18.08.37.13.55.19s.47.18.72.25h0c.37.1.74.19,1.12.26l.21,0,.19,0,.57.07.71.08.14,0q.58,0,1.2,0h.26c.36,0,.72,0,1.07,0h.25c.39,0,.77-.09,1.13-.15l.17,0,.32-.06.52-.11c.15,0,.3-.08.44-.12l.3-.09.18,0a9.44,9.44,0,0,0,.89-.32l.06,0,.19-.09c.21-.09.43-.18.63-.29l.24-.14c.13-.06.25-.14.38-.21s.21-.11.31-.18l.29-.2.55-.4c.08-.07.17-.12.25-.18l.35-.31.27-.25a11.68,11.68,0,0,0,.85-.87q3.57-4.14,5-11.82A112.54,112.54,0,0,0,325.24,156V144.47A112.54,112.54,0,0,1,323.79,164.63Z"/>
|
||||
<path class="cls-14"
|
||||
d="M344.07,144.09c0-.11,0-.22,0-.34l0-1.43,0-1c0-.49,0-1-.06-1.46,0-.3,0-.61,0-.91,0-.55-.06-1.08-.1-1.62,0-.22,0-.45-.05-.68-.05-.75-.11-1.49-.19-2.22v0c-.06-.63-.13-1.26-.2-1.87,0-.19-.05-.38-.07-.57l-.18-1.28L343,130c-.06-.39-.12-.78-.19-1.16,0-.21-.07-.42-.11-.63s0-.23-.05-.35l-.09-.4c-.1-.55-.21-1.1-.33-1.64,0-.21-.09-.42-.13-.63-.16-.71-.33-1.4-.51-2.08h0c-.16-.6-.34-1.19-.51-1.77l-.18-.56c-.13-.38-.25-.76-.38-1.13a1.72,1.72,0,0,1-.07-.21c-.06-.17-.13-.33-.19-.5l-.3-.79c-.1-.24-.19-.47-.29-.7s-.21-.5-.32-.75l-.11-.26c-.13-.29-.27-.57-.41-.85-.34-.69-.69-1.35-1.05-2l-.14-.25c-.05-.1-.11-.19-.17-.29l-.6-1-.35-.55c-.23-.37-.47-.72-.72-1.08-.07-.1-.14-.22-.22-.32l-.05-.06c-.36-.52-.74-1-1.13-1.5l-.3-.37c-.3-.37-.61-.72-.92-1.07l-.2-.24-.17-.17c-.45-.48-.9-1-1.37-1.4s-.67-.62-1-.92l-.32-.27-.75-.61-.36-.29-.81-.6-.29-.21-.1-.06-.42-.28c-.27-.17-.53-.35-.8-.51s-.37-.23-.56-.34l-.78-.45-.18-.1-.3-.14c-.41-.22-.82-.42-1.25-.62l-.49-.23c-.56-.25-1.13-.49-1.72-.71s-.91-.32-1.37-.47l-.46-.14c-.25-.08-.49-.16-.74-.22l-.17,0c-.49-.13-1-.26-1.49-.37l-.25-.06c-.58-.12-1.18-.23-1.78-.33l-.12,0-.57-.07-1-.14-.75-.07c-.32,0-.65-.07-1-.09l-.24,0-.8,0-.51,0c-.54,0-1.08,0-1.63,0h-.91l-1.05,0-.48,0c-.47,0-.94,0-1.4.09h-.07l-1.34.14-.41.06-.91.13-.13,0-.41.08-.69.12-.56.12-.66.14-.2,0-.37.09-.6.16-.56.16-.59.17-.21.07-.33.11-.59.2-.53.2-.58.21a1.57,1.57,0,0,1-.23.09l-.27.12-.62.27-.49.22-.6.29-.29.14-.17.09-.77.41-.35.2c-.37.21-.73.42-1.09.65l0,0c-.58.36-1.13.75-1.68,1.15-.16.12-.32.24-.47.37s-.45.33-.66.5l-.48.42c-.19.16-.37.31-.55.48q-.56.5-1.08,1l-.44.43c-.48.51-.95,1-1.4,1.56l-.17.22c-.39.48-.77,1-1.13,1.47-.14.19-.27.39-.41.59-.28.4-.55.81-.81,1.24-.14.22-.28.44-.41.66-.26.45-.51.9-.76,1.36l-.33.62c-.34.67-.67,1.36-1,2.07a54.8,54.8,0,0,0-3.44,13.43,125.91,125.91,0,0,0-1.1,17.57v11.49a125.91,125.91,0,0,1,1.1-17.57,54.8,54.8,0,0,1,3.44-13.43c.31-.72.64-1.4,1-2.07l.33-.63c.25-.46.5-.91.76-1.35.13-.22.27-.44.41-.66.26-.43.53-.84.81-1.25l.41-.58c.36-.51.74-1,1.13-1.47l.17-.22c.45-.54.92-1.06,1.4-1.56.14-.15.29-.29.44-.43q.53-.52,1.08-1l.55-.49c.37-.31.75-.62,1.14-.92l.47-.36c.56-.41,1.12-.8,1.71-1.17.36-.23.72-.45,1.09-.66l.35-.19.77-.41c.15-.08.3-.16.46-.23l.6-.29.49-.22c.2-.1.41-.18.62-.27l.5-.21.58-.22.53-.19.59-.2.54-.18.59-.17.56-.16.6-.16.57-.14.66-.14.56-.12.68-.13.55-.09.9-.13.42-.06,1.34-.14h.07l1.4-.1.48,0,1.05,0h.91c.55,0,1.09,0,1.63,0l.51,0,1,.06,1,.09.75.08,1,.13.69.1c.6.1,1.2.21,1.78.34l.25.06c.5.11,1,.23,1.49.37l.91.26.46.14c.46.15.92.31,1.37.48s1.16.46,1.72.71l.49.23c.43.19.84.4,1.25.61l.48.25.78.45.56.33.8.52.52.34.29.21.81.6.36.28.75.61.32.28c.34.29.68.6,1,.91s.92.92,1.37,1.41c.13.13.25.27.37.4.31.35.62.71.92,1.07l.3.37c.39.49.77,1,1.13,1.5l.27.39q.38.52.72,1.08l.35.55.6,1c.1.18.2.36.31.54.36.65.71,1.31,1.05,2,.18.36.35.74.52,1.11s.22.51.32.76l.29.69.3.8c.09.23.17.47.26.71s.25.75.38,1.13l.18.56c.17.57.34,1.16.51,1.76h0c.18.67.35,1.37.51,2.08,0,.21.09.42.13.63.12.54.23,1.08.33,1.64.05.25.1.49.14.75s.08.42.11.63c.07.38.13.77.19,1.16l.09.65.18,1.29c0,.19,0,.38.07.57.07.62.14,1.25.2,1.89s.14,1.47.19,2.22c0,.22,0,.45.05.68,0,.53.07,1.07.1,1.62,0,.3,0,.6,0,.91,0,.48.05,1,.06,1.46l0,1,0,1.43c0,.66,0,1.33,0,2h0V145.77C344.08,145.2,344.07,144.65,344.07,144.09Z"/>
|
||||
<path class="cls-15"
|
||||
d="M338.85,127.08q5.23,10.67,5.23,30.18a103.75,103.75,0,0,1-1.38,18.21,40.59,40.59,0,0,1-5.09,13.83,32.63,32.63,0,0,1-12.09,11.75,33.33,33.33,0,0,1-16.5,4.14,32.93,32.93,0,0,1-18.74-5.56,34.12,34.12,0,0,1-12.47-15.37,53.71,53.71,0,0,1-3.13-11.86,92,92,0,0,1-1-14.05,125.91,125.91,0,0,1,1.1-17.57,54.8,54.8,0,0,1,3.44-13.43A30.64,30.64,0,0,1,290,113.17q7.73-4.87,18.46-4.88a36.47,36.47,0,0,1,12.85,2.16,29.6,29.6,0,0,1,10.14,6.33A36.27,36.27,0,0,1,338.85,127.08Zm-15.06,49A112.54,112.54,0,0,0,325.24,156a101,101,0,0,0-1.51-19.34q-1.51-7.53-5.09-11.38t-9.9-3.84q-9.08,0-12.61,8.59t-3.54,26.49a107,107,0,0,0,1.51,19.9q1.51,7.74,5.09,11.72a12.37,12.37,0,0,0,9.69,4q6.31,0,9.9-4.13t5-11.82"/>
|
||||
<path class="cls-14"
|
||||
d="M148,177.15c-.37.32-.77.62-1.18.91l-.38.25c-.31.2-.64.4-1,.59l-.35.19c-.45.24-.91.46-1.39.66l-.14.06c-.44.18-.9.34-1.37.49l-.33.11c-.51.15-1,.29-1.56.41l-.31.06c-.46.1-.94.18-1.43.25l-.44.07c-.57.07-1.17.13-1.78.17s-1.48.08-2.25.08l-1.5,0c-.71,0-1.41-.08-2.1-.13l-.47,0q-1-.1-2-.24l-.26-.05c-.77-.11-1.55-.25-2.31-.41l-.14,0c-.77-.16-1.54-.35-2.3-.56l-.63-.17-.09,0a7.67,7.67,0,0,0-1.06-.22h-.13a5.39,5.39,0,0,0-.79-.07H120l-.58,0h-.11l-.48.06-.26,0h-.08l-.59.14-.19,0h0a7.55,7.55,0,0,0-.84.29l-.05,0-.11.06a5.75,5.75,0,0,0-.82.42l-.13.06-.08.06a7.11,7.11,0,0,0-.72.5h0c-.23.18-.45.39-.67.6l-.18.19c-.15.16-.29.32-.43.49l-.18.23q-.21.28-.39.57a1.86,1.86,0,0,0-.11.19,7.68,7.68,0,0,0-.41.81c0,.06,0,.13-.08.2-.08.22-.16.44-.23.67s-.05.2-.08.3-.1.44-.13.66a2.93,2.93,0,0,0,0,.29,7.82,7.82,0,0,0-.06,1V196a7.77,7.77,0,0,1,.06-1,2.5,2.5,0,0,1,0-.29,6.42,6.42,0,0,1,.13-.66c0-.1,0-.2.08-.3s.15-.46.23-.68c0-.06.05-.13.08-.19a9,9,0,0,1,.41-.82,1.74,1.74,0,0,1,.11-.18,5.72,5.72,0,0,1,.39-.57l.18-.24c.14-.16.28-.33.43-.48l.18-.2c.22-.21.44-.41.67-.59l0,0c.23-.18.47-.34.72-.5l.21-.11a5.75,5.75,0,0,1,.82-.42l.16-.08q.41-.16.84-.3l.22-.05.6-.14.33-.05c.16,0,.32-.05.48-.06l.69,0a9.77,9.77,0,0,1,1.07.07h.11a9.77,9.77,0,0,1,1.17.25l.41.12.22.06c.76.2,1.53.4,2.3.56l.14,0c.76.16,1.54.29,2.31.41l.18,0H128q1,.15,2,.24l.47,0c.69.06,1.39.11,2.1.13h0q.75,0,1.5,0c.77,0,1.52,0,2.25-.08h.1q.86-.06,1.68-.18l.44-.06.7-.1.73-.15.31-.06c.45-.1.89-.21,1.32-.34l.24-.07.33-.11c.47-.15.93-.31,1.37-.5l.14-.05.06,0c.46-.2.9-.41,1.33-.64l.35-.19.48-.27.49-.33.38-.25a11.57,11.57,0,0,0,1.18-.91,14.07,14.07,0,0,0,5-9.84c0-.58.08-1.18.08-1.79h0v-8.63A14.53,14.53,0,0,1,148,177.15Z"/>
|
||||
<g class="cls-16">
|
||||
<g class="cls-17">
|
||||
<g class="cls-16">
|
||||
<path class="cls-14"
|
||||
d="M172.52,158.33A33.35,33.35,0,0,0,172,155a26.4,26.4,0,0,0-.82-2.78,22.25,22.25,0,0,0-1.16-2.69,21.93,21.93,0,0,0-2-3.24,25.52,25.52,0,0,0-3-3.25,29.16,29.16,0,0,0-7.34-4.85,40.29,40.29,0,0,0-6.32-2.35,42.23,42.23,0,0,0-5.08-1.08c-1.21-.17-2.4-.29-3.56-.35l-1.53-.06c-1,0-2.05,0-3.12,0-1.5,0-3.06,0-4.68.15l-.64.05v8.64l.64,0C135,143,136.53,143,138,143q1.6,0,3.12.06l1.53.06c1.16.06,2.35.17,3.56.35a42.23,42.23,0,0,1,5.08,1.08,39.31,39.31,0,0,1,6.32,2.35,29.16,29.16,0,0,1,7.34,4.85,24.86,24.86,0,0,1,3,3.25,21.84,21.84,0,0,1,2,3.23,22.39,22.39,0,0,1,1.16,2.7,26.4,26.4,0,0,1,.82,2.78,32.36,32.36,0,0,1,.57,3.3,43.27,43.27,0,0,1,.3,4.55v-8.64A43.27,43.27,0,0,0,172.52,158.33Z"/>
|
||||
<path class="cls-18" d="M172.82,171.52v0"/>
|
||||
</g>
|
||||
</g>
|
||||
</g>
|
||||
<polygon class="cls-14" points="113.49 159.94 113.49 151.3 117.24 96.8 117.24 105.44 113.49 159.94"/>
|
||||
<path class="cls-14"
|
||||
d="M163.16,105.56l.71.16.31.07.29.1.46.17.3.12.37.18c.2.1.39.21.58.32l.25.15a8.15,8.15,0,0,1,.76.55l0,0c.23.19.44.39.65.6l.2.22a6.4,6.4,0,0,1,.42.49l.24.31.18.27c.09.13.17.26.25.39l.16.29c0,.09.09.19.14.29s.2.43.28.65l.12.31a4.77,4.77,0,0,1,.15.54c0,.11.07.22.09.33s.06.33.09.5l.06.37c0,.16,0,.33,0,.5s0,.29,0,.44v-8.76c0-.1,0-.21,0-.32s0-.34,0-.5a.19.19,0,0,1,0-.08,2.93,2.93,0,0,0-.05-.29c0-.17,0-.33-.09-.49s0-.07,0-.1a2.25,2.25,0,0,0-.08-.24,5.44,5.44,0,0,0-.15-.54.57.57,0,0,1,0-.14l-.08-.16c-.08-.23-.18-.44-.28-.66,0,0-.05-.12-.08-.17l-.06-.12c-.05-.1-.11-.19-.16-.28a3.73,3.73,0,0,0-.25-.39l-.18-.28-.13-.18a.69.69,0,0,1-.11-.13,6.4,6.4,0,0,0-.42-.49l-.2-.22a7.21,7.21,0,0,0-.65-.59l0,0a8.15,8.15,0,0,0-.76-.55l-.25-.15c-.19-.11-.38-.22-.58-.32l-.14-.08-.23-.09-.3-.13-.46-.17-.29-.09-.11,0-.2,0c-.23-.06-.47-.11-.71-.15l-.17,0h-.18a5.11,5.11,0,0,0-.55,0l-.25,0H117.24v8.63H161.7c.19,0,.38,0,.56,0l.55.05Z"/>
|
||||
<path class="cls-15"
|
||||
d="M161.7,105.43a8.48,8.48,0,1,1,0,17H134.13l-1.42,20.78c1.84-.15,3.62-.21,5.32-.21s3.18,0,4.65.12c7.58.36,16.62,3.36,22.3,8.63s7.84,11.57,7.84,20.58c0,9.94-2.36,16.89-9.22,23.21s-15.9,9.69-27.68,9.69c-6.9,0-12.87,0-18.22-1.53A7.93,7.93,0,0,1,120,188.1a8.4,8.4,0,0,1,2.35.34,42,42,0,0,0,11.75,1.65q8.88,0,13.88-4.31t5-11.63q0-15.36-21.36-15.36a165,165,0,0,0-18.19,1.15l3.75-54.51Z"/>
|
||||
<path class="cls-19"
|
||||
d="M309.61,253.46a4.84,4.84,0,0,1-2.85.39c-1-.12-3.07-2.25-4.39-2.8a14.58,14.58,0,0,1-4.61-4c-1.21-1.6-.74-2.07-.43-2.32-.28,1.32,2.22,4.34,5.08,5.86,3.12,1.66,4.45,3.22,5.88,2.76,1.14-.36,2.55-1,3-2.08C311.7,252.68,310.51,253,309.61,253.46Z"/>
|
||||
<path class="cls-20"
|
||||
d="M311.11,247.65a22.22,22.22,0,0,0,.27,2.61c.25,1.83-1.65,2.65-3.09,3.11s-2.76-1.1-5.88-2.76-5.8-5.1-4.93-6.18c.82-.68,3.19-.55,5.14.64a29.2,29.2,0,0,1,3.05,2.09h0c-.06-.19-.12-.35-.14-.43-.09-.3.29-.74.8-.33s3.09,0,4.17-.57l.09-.05c1-.58.87.29.64,1A2.84,2.84,0,0,0,311.11,247.65Z"/>
|
||||
<path class="cls-21" d="M310.5,245.83l.09-.05c1-.58.87.29.64,1a2.84,2.84,0,0,0-.12.86"/>
|
||||
<path class="cls-21" d="M305.3,248.31c.69.11.54-.62.37-1.14"/>
|
||||
<path class="cls-22"
|
||||
d="M297.34,244.74h0c-.31.25-.78.72.43,2.32a14.58,14.58,0,0,0,4.61,4c1.32.55,3.38,2.68,4.39,2.8a4.84,4.84,0,0,0,2.85-.39c.9-.44,2.09-.78,1.66-2.17"/>
|
||||
<path d="M305.76,168.75c-.06.15-.45.76-.45.76l-.15.14-.47-.18-.45.3-.4-.22s-.06-.5-.36.1c-.12-.28-.86-.23-1.74-.76a3.15,3.15,0,0,1-1.06-2.71c.11-.61.69-.93.34-1.31s-.48-.24-.75-.08-.6-.32-1.62-.65c-.09,0-1.12-2.63-.77-3.79a4.24,4.24,0,0,1,2.16-3,7,7,0,0,1,5.12-.66c1.72.52,3.43.94,4.08,4.66a6.34,6.34,0,0,1-1.61,6,3.79,3.79,0,0,1-1.07.88C306.25,168.51,306,168.2,305.76,168.75Z"/>
|
||||
<path class="cls-23"
|
||||
d="M316.53,186.52a3.29,3.29,0,0,1-1.34,1,4.82,4.82,0,0,1-3.3.2c.15-3.54.27-6.22.27-6.22l1-7.75a1.23,1.23,0,0,1,.27.52C314.07,176.7,315.88,183.71,316.53,186.52Z"/>
|
||||
<path class="cls-24"
|
||||
d="M315.34,191.29v0a1.5,1.5,0,0,1-1.84,1.57l-2.69-1.24c.06-1.78,1-2.38,1.08-4a4.82,4.82,0,0,0,3.3-.2Z"/>
|
||||
<path class="cls-25"
|
||||
d="M300.82,166.25a2.91,2.91,0,0,0,.92,2.45c.77.47,1.43.43,1.53.68l.33-.68.33.79.25-.66.57.55.08-.8s.37.94.43.8c.19-.49.23-.43.5-.63-.12,1.32-.46,3.57.47,3.71l.54.08c-1.08,1.73-6,1.17-6.78.2a2.38,2.38,0,0,0,1.16-.67c.59-1,.86-3,0-3.27a2.47,2.47,0,0,1-1.88-2.11c-.11-.51-.23-1.65-.33-2.45h0c.89.29,1.14.59,1.36.46a.62.62,0,0,1,.87.14C301.44,165.18,300.91,165.69,300.82,166.25Z"/>
|
||||
<path class="cls-26"
|
||||
d="M294.81,182.83a.83.83,0,0,1-.41,1.1L285,188.22a.83.83,0,0,1-1.1-.41l-6.05-13.32a.83.83,0,0,1,.41-1.1l9.45-4.29a.83.83,0,0,1,1.1.41Z"/>
|
||||
<path class="cls-27"
|
||||
d="M288.29,170.34l5.14,11.31a.72.72,0,0,1-.36,1l-8.24,3.75a.73.73,0,0,1-1-.36l-5.14-11.31a.72.72,0,0,1,.36-1l8.24-3.75A.73.73,0,0,1,288.29,170.34Z"/>
|
||||
<circle class="cls-27" cx="289.29" cy="185.23" r="0.5" transform="translate(57.59 438.83) rotate(-80.22)"/>
|
||||
<path class="cls-25"
|
||||
d="M285.93,190.32s-1.4-1.52-2-2.13-1.86-2.34-2-2.46-1.82-5.36-2.18-5.62.5-.8,1.14.51,1.86,3,2.43,3,.31-1.59.72-1.85.35,0,.5.15-.34,2,.09,2.65.34,1.79.66,2.29l1.84,2.88Z"/>
|
||||
<path class="cls-25"
|
||||
d="M284.63,188.92s3.61,4.34,7,6c.17.08,1.22.48,1.51-.1a24.27,24.27,0,0,0,1-4.75c.07-.34.25-4,.25-4L290.88,185l-.28,5.53a.06.06,0,0,1-.09.05l-4.73-2.84Z"/>
|
||||
<path class="cls-20"
|
||||
d="M313.16,173.71l-1,7.75s-.12,2.68-.27,6.22c-.07,1.59-.14,3.35-.2,5.13-.19,5.23-.33,10.58-.15,11.9l-.28,0c-1.85.25-11.81.82-15.38.24a3.6,3.6,0,0,1-1-.29c.28-1.59.43-20.67.43-20.67s-.35,2.07-.51,3.67c-1.63.6-2.42.32-4.63-.63.18-1.38,1.93-9.68,3.19-12.13a2.78,2.78,0,0,1,2.15-1.29h0a26.47,26.47,0,0,0,4.5-.92c.76,1,5.7,1.53,6.78-.2,1.28.18,4.1.53,5.54.71A1.31,1.31,0,0,1,313.16,173.71Z"/>
|
||||
<path class="cls-28"
|
||||
d="M311.26,204.76,310.1,225l0,21c-.53.24-3,.89-3.86.38l-1-20.22-1-16.14a.67.67,0,0,0-.73-.63.65.65,0,0,0-.44.2.71.71,0,0,0-.19.44l-2.76,16.56L299.6,243v.05l-.27,4.33c-1.13.44-3.76.56-4.21.12l-.74-22.18,1.5-20.36C299.45,205.58,309.41,205,311.26,204.76Z"/>
|
||||
<path class="cls-19"
|
||||
d="M300.08,252.26a4.88,4.88,0,0,1-2.65,1.13c-1,.15-3.56-1.37-5-1.55a14.41,14.41,0,0,1-5.5-2.63c-1.59-1.22-1.25-1.8-1-2.12.07,1.34,3.28,3.6,6.44,4.32,3.44.78,5.13,1.94,6.4,1.11,1-.65,2.21-1.59,2.33-2.79C301.88,251,300.83,251.6,300.08,252.26Z"/>
|
||||
<path class="cls-20"
|
||||
d="M300,246.27a22.16,22.16,0,0,0,.95,2.44c.72,1.7-.89,3-2.16,3.81s-3-.33-6.4-1.11-6.94-3.39-6.39-4.66c.62-.88,2.94-1.37,5.13-.74a30.64,30.64,0,0,1,3.5,1.21h0l-.26-.38c-.16-.26.09-.79.69-.53s3-.82,3.87-1.64l.08-.07c.83-.84.91.05.88.81A3.07,3.07,0,0,0,300,246.27Z"/>
|
||||
<path class="cls-21" d="M298.92,244.67l.08-.07c.83-.84.78.06.88.81a18.24,18.24,0,0,0,1.23,4.32"/>
|
||||
<path class="cls-21" d="M294.56,248.43c.69-.07.36-.75.06-1.2"/>
|
||||
<path class="cls-22"
|
||||
d="M285.94,247.08h0c-.23.32-.57.9,1,2.12a14.41,14.41,0,0,0,5.5,2.63c1.41.18,4,1.7,5,1.55a4.88,4.88,0,0,0,2.65-1.13c.75-.66,1.8-1.3,1-2.53"/>
|
||||
</g>
|
||||
</g>
|
||||
</svg>
|
||||
|
After Width: | Height: | Size: 34 KiB |
BIN
src/assets/images/login-icon.jpg
Normal file
BIN
src/assets/images/login-icon.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 14 KiB |
BIN
src/assets/images/login-left.png
Normal file
BIN
src/assets/images/login-left.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 90 KiB |
BIN
src/assets/logo.png
Normal file
BIN
src/assets/logo.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 59 KiB |
169
src/components/DataTable copy.jsx
Normal file
169
src/components/DataTable copy.jsx
Normal file
@ -0,0 +1,169 @@
|
||||
import {
|
||||
defineComponent,
|
||||
h,
|
||||
reactive,
|
||||
ref,
|
||||
watch,
|
||||
onMounted,
|
||||
toRefs
|
||||
} from 'vue';
|
||||
import { ElTable, ElTableColumn, ElPagination, ElLoading } from 'element-plus';
|
||||
import { debounce } from 'lodash';
|
||||
|
||||
export default defineComponent({
|
||||
setup(props, { attrs, slots, expose }) {
|
||||
console.log(props,'_this');
|
||||
const {
|
||||
request = () => { },
|
||||
pagination: _pagination = {},
|
||||
column = [],
|
||||
params = {},
|
||||
loading = {},
|
||||
debug = false,
|
||||
border = true,
|
||||
_tableRef = {},
|
||||
...attr
|
||||
} = attrs;
|
||||
|
||||
const pagination = {
|
||||
page: 1,
|
||||
background: true,
|
||||
layout: 'prev,pager,next,jumper,total,sizes',
|
||||
..._pagination
|
||||
};
|
||||
|
||||
const log = (type, ...msg) => {
|
||||
debug && console.log(`[ DataTable ] ${type} => `, ...msg);
|
||||
};
|
||||
log('setup', {
|
||||
props,
|
||||
attrs,
|
||||
slots
|
||||
});
|
||||
|
||||
const tableRef = ref(null);
|
||||
|
||||
const tableData = ref({
|
||||
msg: '加载中...',
|
||||
data: [],
|
||||
count: 0
|
||||
});
|
||||
|
||||
const _params = reactive({
|
||||
...toRefs(params),
|
||||
page: 1,
|
||||
limit: 10
|
||||
});
|
||||
|
||||
// 请求数据
|
||||
const fetchData = debounce(async v => {
|
||||
const _loading = ElLoading.service({
|
||||
target: tableRef.value,
|
||||
...loading
|
||||
});
|
||||
// setTimeout(async () => {
|
||||
log('fetchData', _params, params);
|
||||
try {
|
||||
const { code, data, count, msg } = await request(_params);
|
||||
|
||||
if (code == 0) {
|
||||
tableData.value.data = data;
|
||||
tableData.value.count = count;
|
||||
if (count === 0) {
|
||||
tableData.value.msg = '暂无数据';
|
||||
}
|
||||
} else {
|
||||
tableData.value.msg = msg;
|
||||
tableData.value.data.length = 0;
|
||||
tableData.value.count = 0;
|
||||
}
|
||||
} catch (error) {
|
||||
tableData.value.msg = error.message || '服务器返回异常';
|
||||
} finally {
|
||||
_loading.close();
|
||||
}
|
||||
// });
|
||||
}, 1000);
|
||||
|
||||
expose({
|
||||
reload: fetchData
|
||||
});
|
||||
|
||||
// watch(attrs.params, (v) => {
|
||||
// log("watch attr.params", v);
|
||||
// });
|
||||
|
||||
// watch(params, (v) => {
|
||||
// log("watch params", v);
|
||||
// fetchData();
|
||||
// });
|
||||
watch(_params, v => {
|
||||
log('watch _params', v);
|
||||
fetchData();
|
||||
});
|
||||
// watch(
|
||||
// params,
|
||||
// (v) => {
|
||||
// log("watch deep params", v);
|
||||
// fetchData();
|
||||
// },
|
||||
// {
|
||||
// deep: true,
|
||||
// }
|
||||
// );
|
||||
// watch(
|
||||
// _params,
|
||||
// (v) => {
|
||||
// log("watch deep _params", v);
|
||||
// fetchData();
|
||||
// },
|
||||
// {
|
||||
// deep: true,
|
||||
// }
|
||||
// );
|
||||
|
||||
// onActivated(() => {
|
||||
// log("onActivated");
|
||||
// });
|
||||
|
||||
onMounted(() => {
|
||||
log('onMounted');
|
||||
fetchData();
|
||||
console.log(attrs,'this');
|
||||
});
|
||||
return () => (
|
||||
<div ref={tableRef}>
|
||||
<ElTable
|
||||
{...attr}
|
||||
border={border}
|
||||
data={tableData.value.data}
|
||||
emptyText={tableData.value.msg}
|
||||
ref={attrs._tableRef}
|
||||
>
|
||||
{column.map(v => {
|
||||
const { prop } = v;
|
||||
const slotsProp = slots[prop];
|
||||
let temp = null;
|
||||
if (slotsProp) {
|
||||
temp = {
|
||||
default: slotsProp
|
||||
};
|
||||
}
|
||||
return h(ElTableColumn, v, temp);
|
||||
})}
|
||||
</ElTable>
|
||||
{_pagination === false ? (
|
||||
''
|
||||
) : (
|
||||
<ElPagination
|
||||
{...pagination}
|
||||
onCurrentChange={val => (_params.page = val)}
|
||||
onSizeChange={val => (_params.limit = val)}
|
||||
total={tableData.value.count}
|
||||
pageSize={_params.limit}
|
||||
></ElPagination>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
});
|
||||
165
src/components/DataTable.jsx
Normal file
165
src/components/DataTable.jsx
Normal file
@ -0,0 +1,165 @@
|
||||
import {
|
||||
defineComponent,
|
||||
h,
|
||||
reactive,
|
||||
ref,
|
||||
watch,
|
||||
onMounted,
|
||||
toRefs
|
||||
} from 'vue';
|
||||
import { ElTable, ElTableColumn, ElPagination, ElLoading } from 'element-plus';
|
||||
import { debounce } from 'lodash';
|
||||
|
||||
export default defineComponent({
|
||||
setup(props, { attrs, slots, expose }) {
|
||||
const {
|
||||
request = () => { },
|
||||
pagination: _pagination = {},
|
||||
column = [],
|
||||
params = {},
|
||||
loading = {},
|
||||
debug = false,
|
||||
border = false,
|
||||
...attr
|
||||
} = attrs;
|
||||
|
||||
const pagination = {
|
||||
page: 1,
|
||||
background: true,
|
||||
layout: 'prev,pager,next,jumper,total,sizes',
|
||||
..._pagination
|
||||
};
|
||||
|
||||
const log = (type, ...msg) => {
|
||||
debug && console.log(`[ DataTable ] ${type} => `, ...msg);
|
||||
};
|
||||
log('setup', {
|
||||
props,
|
||||
attrs,
|
||||
slots
|
||||
});
|
||||
|
||||
const tableRef = ref(null);
|
||||
|
||||
const tableData = ref({
|
||||
msg: '加载中...',
|
||||
data: [],
|
||||
count: 0
|
||||
});
|
||||
|
||||
const _params = reactive({
|
||||
...toRefs(params),
|
||||
page: 1,
|
||||
limit: 10
|
||||
});
|
||||
|
||||
// 请求数据
|
||||
const fetchData = debounce(async v => {
|
||||
const _loading = ElLoading.service({
|
||||
target: tableRef.value,
|
||||
...loading
|
||||
});
|
||||
// setTimeout(async () => {
|
||||
log('fetchData', _params, params);
|
||||
try {
|
||||
const { code, data, count, msg } = await request(_params);
|
||||
|
||||
if (code == 0) {
|
||||
tableData.value.data = data;
|
||||
tableData.value.count = count;
|
||||
if (count === 0) {
|
||||
tableData.value.msg = '暂无数据';
|
||||
}
|
||||
} else {
|
||||
tableData.value.msg = msg;
|
||||
tableData.value.data.length = 0;
|
||||
tableData.value.count = 0;
|
||||
}
|
||||
} catch (error) {
|
||||
tableData.value.msg = error.message || '服务器返回异常';
|
||||
} finally {
|
||||
_loading.close();
|
||||
}
|
||||
// });
|
||||
}, 1000);
|
||||
|
||||
expose({
|
||||
reload: fetchData
|
||||
});
|
||||
|
||||
// watch(attrs.params, (v) => {
|
||||
// log("watch attr.params", v);
|
||||
// });
|
||||
|
||||
// watch(params, (v) => {
|
||||
// log("watch params", v);
|
||||
// fetchData();
|
||||
// });
|
||||
watch(_params, v => {
|
||||
log('watch _params', v);
|
||||
fetchData();
|
||||
});
|
||||
// watch(
|
||||
// params,
|
||||
// (v) => {
|
||||
// log("watch deep params", v);
|
||||
// fetchData();
|
||||
// },
|
||||
// {
|
||||
// deep: true,
|
||||
// }
|
||||
// );
|
||||
// watch(
|
||||
// _params,
|
||||
// (v) => {
|
||||
// log("watch deep _params", v);
|
||||
// fetchData();
|
||||
// },
|
||||
// {
|
||||
// deep: true,
|
||||
// }
|
||||
// );
|
||||
|
||||
// onActivated(() => {
|
||||
// log("onActivated");
|
||||
// });
|
||||
|
||||
onMounted(() => {
|
||||
log('onMounted');
|
||||
fetchData();
|
||||
});
|
||||
return () => (
|
||||
<div ref={tableRef}>
|
||||
<ElTable
|
||||
{...attr}
|
||||
border={border}
|
||||
data={tableData.value.data}
|
||||
emptyText={tableData.value.msg}
|
||||
>
|
||||
{column.map(v => {
|
||||
const { prop } = v;
|
||||
const slotsProp = slots[prop];
|
||||
let temp = null;
|
||||
if (slotsProp) {
|
||||
temp = {
|
||||
default: slotsProp
|
||||
};
|
||||
}
|
||||
return h(ElTableColumn, v, temp);
|
||||
})}
|
||||
</ElTable>
|
||||
{_pagination === false ? (
|
||||
''
|
||||
) : (
|
||||
<ElPagination
|
||||
{...pagination}
|
||||
onCurrentChange={val => (_params.page = val)}
|
||||
onSizeChange={val => (_params.limit = val)}
|
||||
total={tableData.value.count}
|
||||
pageSize={_params.limit}
|
||||
></ElPagination>
|
||||
)}
|
||||
</div>
|
||||
);
|
||||
}
|
||||
});
|
||||
77
src/components/DepartmentTreeDialog.vue
Normal file
77
src/components/DepartmentTreeDialog.vue
Normal file
@ -0,0 +1,77 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
title="请选择部门"
|
||||
v-model="dialogVisible"
|
||||
@closed="closeDialog"
|
||||
destroy-on-close
|
||||
>
|
||||
<el-alert
|
||||
:title="`当前选中节点：` + currentNode.department_name"
|
||||
type="success"
|
||||
/>
|
||||
<el-tree
|
||||
ref="treeRef"
|
||||
:data="treeData"
|
||||
default-expand-all
|
||||
node-key="id"
|
||||
highlight-current
|
||||
accordion
|
||||
@node-click="handleNodeClick"
|
||||
>
|
||||
</el-tree>
|
||||
<template #footer>
|
||||
<el-button type="primary" @click="handleCommitClick">确定</el-button>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref, watch } from 'vue';
|
||||
import { getUserDepartmentTree } from '~/service/user';
|
||||
|
||||
const loading = ref(false);
|
||||
const treeRef = ref();
|
||||
const treeData = ref([]);
|
||||
|
||||
const currentNode = reactive({
|
||||
department_guid: '',
|
||||
department_name: ''
|
||||
});
|
||||
|
||||
const props = defineProps({
|
||||
modelValue: Boolean,
|
||||
done: Function
|
||||
});
|
||||
|
||||
getUserDepartmentTree().then(({ code, data }) => {
|
||||
if (code === 0) {
|
||||
treeData.value = data;
|
||||
}
|
||||
});
|
||||
|
||||
const emits = defineEmits(['update:modelValue']);
|
||||
|
||||
const dialogVisible = ref(props.modelValue);
|
||||
|
||||
watch(
|
||||
() => props.modelValue,
|
||||
(v) => {
|
||||
dialogVisible.value = v;
|
||||
}
|
||||
);
|
||||
|
||||
const closeDialog = () => {
|
||||
dialogVisible.value = false;
|
||||
emits('update:modelValue', false);
|
||||
};
|
||||
|
||||
const handleNodeClick = (value) => {
|
||||
currentNode.department_guid = value.id;
|
||||
currentNode.department_name = value.label;
|
||||
};
|
||||
|
||||
const handleCommitClick = async () => {
|
||||
props.done(currentNode);
|
||||
closeDialog();
|
||||
};
|
||||
</script>
|
||||
162
src/components/DialogForm.jsx
Normal file
162
src/components/DialogForm.jsx
Normal file
@ -0,0 +1,162 @@
|
||||
import { defineComponent, ref, watch, computed, h } from 'vue';
|
||||
import { ElForm, ElDialog, ElButton, ElIcon } from 'element-plus';
|
||||
|
||||
export default defineComponent({
|
||||
emits: ['update:visible'],
|
||||
setup(props, { attrs, slots, expose, emit }) {
|
||||
const {
|
||||
debug = false,
|
||||
title = '',
|
||||
visible = false,
|
||||
model = {},
|
||||
rules = [],
|
||||
onClosed = () => {},
|
||||
dialogProps = {},
|
||||
formProps = {},
|
||||
disabled = false,
|
||||
...attr
|
||||
} = attrs;
|
||||
|
||||
const log = (type, ...msg) => {
|
||||
debug && console.log(`[ DialogForm ] ${type} => `, ...msg);
|
||||
};
|
||||
log('setup', {
|
||||
props,
|
||||
attrs,
|
||||
slots,
|
||||
emit
|
||||
});
|
||||
|
||||
const formRef = ref(null);
|
||||
const _visible = ref(!!visible);
|
||||
const _model = ref(model);
|
||||
|
||||
log('_visible', _visible.value);
|
||||
|
||||
watch(
|
||||
() => attrs.model,
|
||||
v => {
|
||||
log('watch model', v);
|
||||
_model.value = v;
|
||||
}
|
||||
);
|
||||
|
||||
watch(
|
||||
() => attrs.visible,
|
||||
v => {
|
||||
log('watch visible', v);
|
||||
_visible.value = v;
|
||||
}
|
||||
);
|
||||
// // 验证表单
|
||||
// const validate = computed(() => formRef.value?.validate);
|
||||
// // 重置表单
|
||||
// const resetFields = computed(() => formRef.value?.resetFields);
|
||||
// 验证表单
|
||||
const validate = () => {
|
||||
return formRef.value && formRef.value.validate();
|
||||
};
|
||||
// 重置表单
|
||||
const resetFields = () => {
|
||||
return formRef.value && formRef.value.resetFields();
|
||||
};
|
||||
// 打开弹窗
|
||||
const _onOpen = () => {
|
||||
log('_onOpen', _visible.value);
|
||||
_visible.value = true;
|
||||
emit('update:visible', true);
|
||||
};
|
||||
// 关闭弹窗
|
||||
const _onClose = () => {
|
||||
log('_onClose', _visible.value);
|
||||
_visible.value = false;
|
||||
emit('update:visible', false);
|
||||
};
|
||||
|
||||
expose({
|
||||
form: formRef,
|
||||
open: _onOpen,
|
||||
close: _onClose,
|
||||
resetFields,
|
||||
validate
|
||||
});
|
||||
// 关闭弹出
|
||||
const _onClosed = () => {
|
||||
resetFields();
|
||||
_onClose();
|
||||
onClosed();
|
||||
};
|
||||
|
||||
let openButton = '';
|
||||
if (slots.openButton) {
|
||||
openButton = slots.openButton(_onOpen);
|
||||
} else {
|
||||
switch (typeof attrs.openButton) {
|
||||
case 'function':
|
||||
openButton = attrs.openButton(_onOpen);
|
||||
break;
|
||||
case 'object':
|
||||
const { text, icon, ...temp } = attrs.openButton;
|
||||
openButton = (
|
||||
<ElButton type="primary" {...temp} onClick={_onOpen}>
|
||||
{text}
|
||||
{icon ? h(ElIcon, null, { default: () => h(icon) }) : ''}
|
||||
</ElButton>
|
||||
);
|
||||
break;
|
||||
case 'string':
|
||||
openButton = (
|
||||
<ElButton type="primary" onClick={_onOpen}>
|
||||
{attrs.openButton}
|
||||
</ElButton>
|
||||
);
|
||||
break;
|
||||
case 'boolean':
|
||||
if (attrs.openButton) {
|
||||
openButton = (
|
||||
<ElButton type="primary" onClick={_onOpen}>
|
||||
打开
|
||||
</ElButton>
|
||||
);
|
||||
}
|
||||
break;
|
||||
default:
|
||||
openButton = (
|
||||
<ElButton type="primary" onClick={_onOpen}>
|
||||
打开
|
||||
</ElButton>
|
||||
);
|
||||
break;
|
||||
}
|
||||
}
|
||||
|
||||
return () => (
|
||||
<div
|
||||
class="addButton"
|
||||
style={{
|
||||
display: 'inline-block'
|
||||
}}
|
||||
>
|
||||
{openButton}
|
||||
<ElDialog
|
||||
{...dialogProps}
|
||||
modelValue={_visible.value}
|
||||
title={title}
|
||||
onClosed={_onClosed}
|
||||
// 去掉会影响数据表格
|
||||
destroyOnClose={true}
|
||||
v-slots={{ title: slots.title, footer: slots.footer }}
|
||||
>
|
||||
<ElForm
|
||||
{...formProps}
|
||||
disabled={disabled}
|
||||
ref={formRef}
|
||||
model={_model}
|
||||
rules={rules}
|
||||
v-slots={{ default: slots.default }}
|
||||
></ElForm>
|
||||
</ElDialog>
|
||||
</div>
|
||||
);
|
||||
}
|
||||
});
|
||||
47
src/components/DictTag.vue
Normal file
47
src/components/DictTag.vue
Normal file
@ -0,0 +1,47 @@
|
||||
<template>
|
||||
<template v-for="(item, index) in props.options" :key="item.dictionary_guid">
|
||||
<template v-if="values.includes(item.dictionary_value)">
|
||||
<span v-if="item.dictionary_list_class == 'default' || item.dictionary_list_class == ''" :key="item.dictionary_value" :index="index" :class="item.cssClass">
|
||||
{{ item.dictionary_name }} <i v-if="showValue">#{{ item.dictionary_value }}</i>
|
||||
</span>
|
||||
<el-tag
|
||||
v-else
|
||||
:disable-transitions="true"
|
||||
:index="index"
|
||||
:type="item.dictionary_list_class == 'primary' ? '' : item.dictionary_list_class"
|
||||
:class="item.cssClass">
|
||||
{{ item.dictionary_name }}
|
||||
<i v-if="showValue">#{{ item.dictionary_value }}</i>
|
||||
</el-tag>
|
||||
</template>
|
||||
</template>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {computed} from 'vue';
|
||||
|
||||
const props = defineProps({
|
||||
// 数据
|
||||
options: {
|
||||
type: Array,
|
||||
default: null,
|
||||
},
|
||||
// 当前的值
|
||||
value: [Number, String, Array, Boolean],
|
||||
showValue: false,
|
||||
})
|
||||
|
||||
const values = computed(() => {
|
||||
if (props.value !== null && typeof props.value !== 'undefined') {
|
||||
return Array.isArray(props.value) ? props.value : [String(props.value)]
|
||||
} else {
|
||||
return []
|
||||
}
|
||||
})
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.el-tag + .el-tag {
|
||||
margin-left: 10px;
|
||||
}
|
||||
</style>
|
||||
317
src/components/Echarts/CountBox.vue
Normal file
317
src/components/Echarts/CountBox.vue
Normal file
@ -0,0 +1,317 @@
|
||||
<template>
|
||||
<div class="top_box_pos">
|
||||
|
||||
<div class="top_content_box">
|
||||
<div class="top_content_left_box">
|
||||
<div class="top_content_left_title_box">
|
||||
<div class="top_content_left_title_img_box">
|
||||
<img :src=props.img alt="">
|
||||
</div>
|
||||
|
||||
<div class="top_content_left_title_text_box">
|
||||
<div class="top_content_left_title_text_sub_title">{{ props.text }}</div>
|
||||
<div class="top_content_left_title_text_title">{{ props.count }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="top_content_right_box">
|
||||
<div class="top_content_right_num_box">
|
||||
<img v-if="props.percentage > 0" src="/img/home/上升.png" alt="">
|
||||
<div class="top_content_right_num">{{ props.percentage }}%</div>
|
||||
</div>
|
||||
<div class="top_content_right_price">同昨日对比</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="top_line_box">
|
||||
<div class="mainBox" :id="'mainBox' + props.idx"></div>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, onMounted, onBeforeUnmount } from 'vue';
|
||||
import * as echarts from 'echarts';
|
||||
|
||||
|
||||
const props = defineProps({
|
||||
// 数据
|
||||
data: {
|
||||
type: Array,
|
||||
default: [
|
||||
['1', 500],
|
||||
['2', 900],
|
||||
['3', 460],
|
||||
['4', 1150],
|
||||
['5', 300],
|
||||
['6', 1000],
|
||||
['7', 400],
|
||||
],
|
||||
},
|
||||
img: {
|
||||
type: String,
|
||||
default: null,
|
||||
},
|
||||
text: {
|
||||
type: String,
|
||||
default: null,
|
||||
},
|
||||
count: {
|
||||
type: Number,
|
||||
default: 0,
|
||||
},
|
||||
percentage: {
|
||||
type: Number,
|
||||
default: 0,
|
||||
},
|
||||
idx: {
|
||||
type: Number,
|
||||
default: 0,
|
||||
},
|
||||
})
|
||||
|
||||
console.log(props.data,'this is data');
|
||||
|
||||
|
||||
onMounted(async () => {
|
||||
await echartsInit()
|
||||
})
|
||||
|
||||
onBeforeUnmount(() => {
|
||||
echarts.dispose(document.getElementById('mainBox' + props.idx));
|
||||
});
|
||||
|
||||
// 数据预览 echarts 参数
|
||||
let options = ref({
|
||||
xAxis: {
|
||||
type: 'category',
|
||||
boundaryGap: false,
|
||||
show: false,
|
||||
axisTick: {
|
||||
show: false // 不显示坐标轴刻度线
|
||||
},
|
||||
axisLine: {
|
||||
show: false, // 不显示坐标轴线
|
||||
},
|
||||
axisLabel: {
|
||||
show: false, // 不显示坐标轴上的文字
|
||||
},
|
||||
splitLine: {
|
||||
show: false // 不显示网格线
|
||||
},
|
||||
},
|
||||
yAxis: {
|
||||
type: 'value',
|
||||
boundaryGap: [0, '30%'],
|
||||
show: false,
|
||||
},
|
||||
visualMap: {
|
||||
type: 'piecewise',
|
||||
show: false,
|
||||
// 淡化效果
|
||||
dimension: 0.1,
|
||||
// 最小值
|
||||
min: 0,
|
||||
seriesIndex: 1,
|
||||
pieces: [
|
||||
{
|
||||
gt: 1,
|
||||
lt: 3,
|
||||
color: 'rgba(0, 0, 180, 0.4)'
|
||||
},
|
||||
{
|
||||
gt: 5,
|
||||
lt: 7,
|
||||
color: 'rgba(0, 0, 180, 0.4)'
|
||||
}
|
||||
]
|
||||
},
|
||||
series: [
|
||||
{
|
||||
type: 'line',
|
||||
smooth: 0.6,
|
||||
symbol: 'none',
|
||||
showSymbol: true,
|
||||
|
||||
lineStyle: {
|
||||
color: {
|
||||
type: 'linear', // 线性渐变
|
||||
x: 0.7,
|
||||
y: 0,
|
||||
x2: 0,
|
||||
y2: 0,
|
||||
colorStops: [{
|
||||
offset: 0,
|
||||
color: '#a5b9fe' // 0%处的颜色为淡橙色
|
||||
}, {
|
||||
offset: 1,
|
||||
color: '#4e70df' // 100%处的颜色为橙色
|
||||
}]
|
||||
},
|
||||
width: 3,
|
||||
},
|
||||
itemStyle: {
|
||||
color: {
|
||||
type: 'linear', // 线性渐变
|
||||
x: 0,
|
||||
y: 0.8,
|
||||
x2: 0,
|
||||
y2: 0.4,
|
||||
colorStops: [{
|
||||
offset: 0,
|
||||
color: '#ffffff' // 0%处的颜色为淡橙色
|
||||
}, {
|
||||
offset: 1,
|
||||
color: '#e7f1ff' // 100%处的颜色为橙色
|
||||
}]
|
||||
}
|
||||
},
|
||||
areaStyle: {},
|
||||
data: props.data
|
||||
}
|
||||
]
|
||||
})
|
||||
|
||||
|
||||
|
||||
// 顶部第一个盒子
|
||||
async function echartsInit() {
|
||||
let myChart = echarts.getInstanceByDom(document.getElementById('mainBox' + props.idx)); //有的话就获取已有echarts实例的DOM节点。
|
||||
|
||||
if (myChart == null) { // 如果不存在，就进行初始化。
|
||||
myChart = echarts.init(document.getElementById('mainBox' + props.idx));
|
||||
}
|
||||
|
||||
options.value && myChart.setOption(options.value);
|
||||
}
|
||||
</script>
|
||||
|
||||
|
||||
<style lang="less" scoped>
|
||||
.mainBox {
|
||||
width: 450px;
|
||||
margin-top: -139px;
|
||||
margin-left: -45px;
|
||||
margin-top: -70px;
|
||||
height: 300px;
|
||||
}
|
||||
|
||||
.top_box_pos {
|
||||
width: 350px;
|
||||
height: 250px;
|
||||
background-color: #ffffff;
|
||||
box-shadow: 0 0 30px 10px #f8f8fd;
|
||||
border-radius: 10px;
|
||||
margin-top: 0.3rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
overflow: hidden;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.top_content_box {
|
||||
width: 100%;
|
||||
height: 40%;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-around;
|
||||
}
|
||||
|
||||
// 顶部盒子左边
|
||||
.top_content_left_box {
|
||||
width: 45%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.top_content_left_title_box {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding: 20px 0 0 5px;
|
||||
display: flex;
|
||||
position: relative;
|
||||
flex-direction: column;
|
||||
justify-content: center;
|
||||
align-items: flex-start;
|
||||
margin-left: 15px;
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.top_content_left_title_img_box {
|
||||
width: 35%;
|
||||
height: 60%;
|
||||
// overflow: hidden;
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.top_content_left_title_img_box img {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
object-fit: cover;
|
||||
}
|
||||
|
||||
.top_content_left_title_text_box {
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.top_content_left_title_text_title {
|
||||
font-weight: bold;
|
||||
font-size: 25px;
|
||||
}
|
||||
|
||||
.top_content_left_title_text_sub_title {
|
||||
font-size: 15px;
|
||||
margin-top: 5px;
|
||||
font-weight: bold;
|
||||
color: #9aa4ba;
|
||||
}
|
||||
|
||||
.top_content_right_box {
|
||||
width: 45%;
|
||||
height: 100%;
|
||||
padding: 23px 20px 0 0;
|
||||
}
|
||||
|
||||
.top_content_right_price {
|
||||
display: flex;
|
||||
justify-content: end;
|
||||
margin-right: -10px;
|
||||
margin-bottom: 3px;
|
||||
font-size: 13px;
|
||||
|
||||
font-weight: bold;
|
||||
color: #9ca1bb;
|
||||
}
|
||||
|
||||
.Top_content_right_price {
|
||||
display: flex;
|
||||
justify-content: end;
|
||||
margin-bottom: 3px;
|
||||
font-size: 14px;
|
||||
font-weight: bold;
|
||||
color: #9ca1bb;
|
||||
|
||||
}
|
||||
|
||||
.top_content_right_num_box {
|
||||
display: flex;
|
||||
justify-content: end;
|
||||
align-items: center;
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.top_content_right_num_box img {
|
||||
width: 15px;
|
||||
height: 15px;
|
||||
object-fit: contain;
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
|
||||
.top_line_box {
|
||||
width: 100%;
|
||||
height: 60%;
|
||||
}
|
||||
</style>
|
||||
261
src/components/FileUpload.vue
Normal file
261
src/components/FileUpload.vue
Normal file
@ -0,0 +1,261 @@
|
||||
<template>
|
||||
<div class="upload-file">
|
||||
<el-upload
|
||||
multiple
|
||||
:action="fileUpload"
|
||||
:before-upload="handleBeforeUpload"
|
||||
:file-list="fileList"
|
||||
:limit="limit"
|
||||
:on-error="handleUploadError"
|
||||
:on-exceed="handleExceed"
|
||||
:on-success="handleUploadSuccess"
|
||||
:show-file-list="false"
|
||||
:data="data"
|
||||
:drag="drag"
|
||||
:headers="headers"
|
||||
:auto-upload="autoUpload"
|
||||
class="upload-file-uploader"
|
||||
ref="upload"
|
||||
>
|
||||
<!-- 拖拽上传 -->
|
||||
<template v-if="drag">
|
||||
+
|
||||
<div class="el-upload__text">将文件拖到此处，或<em>点击上传</em></div>
|
||||
</template>
|
||||
<!-- 上传按钮 -->
|
||||
<el-button type="primary" v-if="!drag">选取文件</el-button>
|
||||
<!-- 上传提示 -->
|
||||
<template #tip>
|
||||
<div class="el-upload__tip" v-if="showTip">
|
||||
请上传
|
||||
<template v-if="fileSize">
|
||||
大小不超过 <b style="color: #f56c6c">{{ fileSize }}MB</b>
|
||||
</template>
|
||||
<template v-if="fileType">
|
||||
格式为 <b style="color: #f56c6c">{{ fileType.join('/') }}</b>
|
||||
</template>
|
||||
的文件
|
||||
</div>
|
||||
</template>
|
||||
</el-upload>
|
||||
<!-- 文件列表 -->
|
||||
<transition-group class="upload-file-list el-upload-list el-upload-list--text" name="el-fade-in-linear" tag="ul">
|
||||
<li :key="file.uid" class="el-upload-list__item ele-upload-list__item-content" v-for="(file, index) in fileList">
|
||||
<el-link :href="`${file.url}`" :underline="false" target="_blank">
|
||||
<svg-icon class-name="doc-icon" name="documentation" />
|
||||
{{ file.name }}
|
||||
</el-link>
|
||||
<div class="ele-upload-list__item-content-action" v-if="isDetail == false">
|
||||
<el-link :underline="false" @click="handleDelete(index)" type="danger" style="margin-left: 10px">删除</el-link>
|
||||
</div>
|
||||
</li>
|
||||
</transition-group>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref,reactive,watch,computed } from "vue";
|
||||
import { useLoginStore } from "~/store";
|
||||
import { fileUpload } from "~/service/common";
|
||||
|
||||
const props = defineProps({
|
||||
modelValue: [String, Object, Array],
|
||||
// 数量限制
|
||||
limit: {
|
||||
type: Number,
|
||||
default: 5,
|
||||
},
|
||||
// 大小限制(MB)
|
||||
fileSize: {
|
||||
type: Number,
|
||||
default: 5,
|
||||
},
|
||||
// 文件类型, 例如['png', 'jpg', 'jpeg']
|
||||
fileType: {
|
||||
type: Array,
|
||||
default: () => ['doc', 'xls', 'ppt', 'txt', 'pdf'],
|
||||
},
|
||||
// 是否显示提示
|
||||
isShowTip: {
|
||||
type: Boolean,
|
||||
default: true,
|
||||
},
|
||||
// 是否拖拽
|
||||
drag: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
// 自动上传
|
||||
autoUpload: {
|
||||
type: Boolean,
|
||||
default: true,
|
||||
},
|
||||
// 是否为详情
|
||||
isDetail: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
// 上传携带的参数
|
||||
data: {
|
||||
type: Object,
|
||||
},
|
||||
})
|
||||
|
||||
const store = useLoginStore();
|
||||
|
||||
const headers = {
|
||||
Accept: "application/json",
|
||||
...store.headers,
|
||||
};
|
||||
|
||||
|
||||
const emit = defineEmits()
|
||||
const number = ref(0)
|
||||
const uploadList = ref([])
|
||||
// const baseUrl = import.meta.env.VITE_APP_BASE_API
|
||||
// const uploadFileUrl = ref(baseUrl + import.meta.env.VITE_APP_UPLOAD_URL) // 上传的图片服务器地址
|
||||
// const headers = ref({ Authorization: 'Bearer ' + getToken() })
|
||||
const fileList = ref([])
|
||||
const showTip = computed(() => props.isShowTip && (props.fileType || props.fileSize))
|
||||
|
||||
watch(
|
||||
() => props.modelValue,
|
||||
(val) => {
|
||||
if (val) {
|
||||
let temp = 1
|
||||
// 首先将值转为数组
|
||||
const list = Array.isArray(val) ? val : props.modelValue.split(',')
|
||||
// 然后将数组转为对象数组
|
||||
fileList.value = list.map((item) => {
|
||||
var fileName = item.slice(item.lastIndexOf('/') + 1)
|
||||
if (typeof item === 'string') {
|
||||
item = { name: fileName, url: item }
|
||||
}
|
||||
item.uid = item.uid || new Date().getTime() + temp++
|
||||
return item
|
||||
})
|
||||
// uploadList.value = fileList
|
||||
} else {
|
||||
fileList.value = []
|
||||
return []
|
||||
}
|
||||
},
|
||||
{ deep: true, immediate: true },
|
||||
)
|
||||
|
||||
// 上传前校检格式和大小
|
||||
function handleBeforeUpload(file) {
|
||||
// 校检文件类型
|
||||
if (props.fileType.length) {
|
||||
let fileExtension = ''
|
||||
if (file.name.lastIndexOf('.') > -1) {
|
||||
fileExtension = file.name.slice(file.name.lastIndexOf('.') + 1)
|
||||
}
|
||||
const isTypeOk = props.fileType.some((type) => {
|
||||
if (file.type.indexOf(type) > -1) return true
|
||||
if (fileExtension && fileExtension.indexOf(type) > -1) return true
|
||||
return false
|
||||
})
|
||||
if (!isTypeOk) {
|
||||
ElMessage.error(`文件格式不正确, 请上传${props.fileType.join('/')}格式文件!`)
|
||||
return false
|
||||
}
|
||||
}
|
||||
// 校检文件大小
|
||||
if (props.fileSize) {
|
||||
const isLt = file.size / 1024 / 1024 < props.fileSize
|
||||
if (!isLt) {
|
||||
ElMessage.error(`上传文件大小不能超过 ${props.fileSize} MB!`)
|
||||
return false
|
||||
}
|
||||
}
|
||||
number.value++
|
||||
return true
|
||||
}
|
||||
|
||||
// 文件个数超出
|
||||
function handleExceed() {
|
||||
ElMessage.error(`上传文件数量不能超过 ${props.limit} 个!`)
|
||||
}
|
||||
|
||||
// 上传失败
|
||||
function handleUploadError(err) {
|
||||
ElMessage.error('上传失败')
|
||||
}
|
||||
|
||||
// 上传成功回调
|
||||
function handleUploadSuccess(response, uploadFile) {
|
||||
if (response.code != 0) {
|
||||
fileList.value = []
|
||||
ElMessage.error(`上传失败，原因:${response.msg}!`)
|
||||
return
|
||||
}
|
||||
const { fileName, url, fileId } = response.data
|
||||
const tempFile = { name: fileName, url: url }
|
||||
uploadList.value.push(tempFile)
|
||||
if (uploadList.value.length === number.value) {
|
||||
fileList.value = fileList.value.filter((f) => f.url !== undefined).concat(uploadList.value)
|
||||
uploadList.value = []
|
||||
number.value = 0
|
||||
emit('update:modelValue', listToString(fileList.value))
|
||||
emit('success', listToString(fileList.value))
|
||||
}
|
||||
}
|
||||
|
||||
// 删除文件
|
||||
function handleDelete(index) {
|
||||
fileList.value.splice(index, 1)
|
||||
emit('update:modelValue', listToString(fileList.value))
|
||||
}
|
||||
|
||||
// 获取文件名称
|
||||
function getFileName(name) {
|
||||
if (name.lastIndexOf('/') > -1) {
|
||||
return name.slice(name.lastIndexOf('/') + 1).toLowerCase()
|
||||
} else {
|
||||
return ''
|
||||
}
|
||||
}
|
||||
|
||||
// 对象转成指定字符串分隔
|
||||
function listToString(list, separator) {
|
||||
let strs = ''
|
||||
separator = separator || ','
|
||||
for (let i in list) {
|
||||
strs += list[i].url + separator
|
||||
}
|
||||
return strs != '' ? strs.substr(0, strs.length - 1) : ''
|
||||
}
|
||||
// 手动提交上传
|
||||
function submitUpload() {
|
||||
proxy.$refs.upload.submit()
|
||||
}
|
||||
defineExpose({
|
||||
submitUpload,
|
||||
})
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.upload-file-uploader {
|
||||
margin-bottom: 5px;
|
||||
width: 100%;
|
||||
}
|
||||
.upload-file-list .el-upload-list__item {
|
||||
border: 1px solid #e4e7ed;
|
||||
line-height: 2;
|
||||
margin-bottom: 10px;
|
||||
position: relative;
|
||||
}
|
||||
.upload-file-list .ele-upload-list__item-content {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
color: inherit;
|
||||
}
|
||||
.ele-upload-list__item-content-action .el-link {
|
||||
padding-left: 10px;
|
||||
}
|
||||
.doc-icon {
|
||||
margin: 0 10px;
|
||||
}
|
||||
</style>
|
||||
23
src/components/Icon.vue
Normal file
23
src/components/Icon.vue
Normal file
@ -0,0 +1,23 @@
|
||||
<template>
|
||||
<template v-if="iconType === 'ElIcon'">
|
||||
<el-icon>
|
||||
<component :is="name"></component>
|
||||
</el-icon>
|
||||
</template>
|
||||
</template>
|
||||
<script setup>
|
||||
import { ref } from 'vue';
|
||||
|
||||
const { name } = defineProps({
|
||||
name: String
|
||||
});
|
||||
const iconType = ref('');
|
||||
switch (true) {
|
||||
case name.startsWith('ElIcon'):
|
||||
iconType.value = 'ElIcon';
|
||||
break;
|
||||
|
||||
default:
|
||||
break;
|
||||
}
|
||||
</script>
|
||||
199
src/components/ImageUpload.vue
Normal file
199
src/components/ImageUpload.vue
Normal file
@ -0,0 +1,199 @@
|
||||
<template>
|
||||
<div class="component-upload-image">
|
||||
<el-upload multiple :action="imageUpload" list-type="picture-card" :on-success="handleUploadSuccess"
|
||||
:before-upload="handleBeforeUpload" :limit="limit" :on-error="handleUploadError" :on-exceed="handleExceed"
|
||||
name="file" :drag="true" :data="data" :disabled="isDisabled" :on-remove="handleRemove" :show-file-list="true"
|
||||
:headers="headers" :file-list="fileList" :on-preview="handlePictureCardPreview" :style="style"
|
||||
:class="{ hide: fileList.length >= limit || isDisabled }">
|
||||
<el-icon class="avatar-uploader-icon">
|
||||
+
|
||||
</el-icon>
|
||||
</el-upload>
|
||||
<!-- 上传提示 -->
|
||||
<div class="el-upload__tip" v-if="showTip">
|
||||
请上传
|
||||
<template v-if="fileSize">
|
||||
大小不超过 <b style="color: #f56c6c">{{ fileSize }}MB</b>
|
||||
</template>
|
||||
<template v-if="fileType">
|
||||
格式为 <b style="color: #f56c6c">{{ fileType.join('/') }}</b>
|
||||
</template>
|
||||
的文件
|
||||
</div>
|
||||
|
||||
<el-dialog v-model="dialogVisible" title="预览" width="800px" append-to-body>
|
||||
<img :src="dialogImageUrl" style="display: block; max-width: 100%; margin: 0 auto" />
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, reactive, watch, computed } from "vue";
|
||||
import { useLoginStore } from "~/store";
|
||||
import { imageUpload } from "~/service/common";
|
||||
|
||||
const props = defineProps({
|
||||
modelValue: [String, Object, Array],
|
||||
// 图片数量限制
|
||||
limit: {
|
||||
type: Number,
|
||||
default: 5,
|
||||
},
|
||||
// 大小限制(MB)
|
||||
fileSize: {
|
||||
type: Number,
|
||||
default: 5,
|
||||
},
|
||||
// 文件类型, 例如['png', 'jpg', 'jpeg']
|
||||
fileType: {
|
||||
type: Array,
|
||||
default: () => ['png', 'jpg', 'jpeg'],
|
||||
},
|
||||
// 是否显示提示
|
||||
isShowTip: {
|
||||
type: Boolean,
|
||||
default: true,
|
||||
},
|
||||
// 是否禁用
|
||||
isDisabled: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
// 上传携带的参数
|
||||
data: {
|
||||
type: Object,
|
||||
},
|
||||
})
|
||||
|
||||
const store = useLoginStore();
|
||||
|
||||
const headers = {
|
||||
Accept: "application/json",
|
||||
...store.headers,
|
||||
};
|
||||
|
||||
const emit = defineEmits()
|
||||
const number = ref(0)
|
||||
const uploadList = ref([])
|
||||
const dialogImageUrl = ref('')
|
||||
const dialogVisible = ref(false)
|
||||
const fileList = ref([])
|
||||
const showTip = computed(() => props.isShowTip && (props.fileType || props.fileSize))
|
||||
|
||||
watch(
|
||||
() => props.modelValue,
|
||||
(val) => {
|
||||
if (val) {
|
||||
// 首先将值转为数组
|
||||
const list = Array.isArray(val) ? val : props.modelValue.split(',')
|
||||
// 然后将数组转为对象数组
|
||||
fileList.value = list.map((item) => {
|
||||
if (typeof item === 'string') {
|
||||
// if (item.indexOf(baseUrl) === -1) {
|
||||
// item = { name: baseUrl + item, url: baseUrl + item }
|
||||
// } else {
|
||||
item = { name: item, url: item }
|
||||
// }
|
||||
}
|
||||
return item
|
||||
})
|
||||
} else {
|
||||
fileList.value = []
|
||||
return []
|
||||
}
|
||||
},
|
||||
{ deep: true, immediate: true },
|
||||
)
|
||||
|
||||
// 删除图片
|
||||
function handleRemove(file, files) {
|
||||
emit('update:modelValue', listToString(fileList.value))
|
||||
}
|
||||
|
||||
// 上传成功回调
|
||||
function handleUploadSuccess(res) {
|
||||
if (res.code != 0) {
|
||||
ElMessage.error(`上传失败，原因:${res.msg}!`);
|
||||
fileList.value = fileList.value.slice(0, fileList.value.length - 1)
|
||||
return
|
||||
}
|
||||
uploadList.value.push({ name: res.data.fileName, url: res.data.url })
|
||||
if (uploadList.value.length === number.value) {
|
||||
fileList.value = fileList.value.filter((f) => f.url !== undefined).concat(uploadList.value)
|
||||
uploadList.value = []
|
||||
number.value = 0
|
||||
emit('update:modelValue', listToString(fileList.value))
|
||||
}
|
||||
}
|
||||
|
||||
// 上传前loading加载
|
||||
function handleBeforeUpload(file) {
|
||||
let isImg = false
|
||||
if (props.fileType.length) {
|
||||
let fileExtension = ''
|
||||
if (file.name.lastIndexOf('.') > -1) {
|
||||
fileExtension = file.name.slice(file.name.lastIndexOf('.') + 1)
|
||||
}
|
||||
isImg = props.fileType.some((type) => {
|
||||
if (file.type.indexOf(type) > -1) return true
|
||||
if (fileExtension && fileExtension.indexOf(type) > -1) return true
|
||||
return false
|
||||
})
|
||||
} else {
|
||||
isImg = file.type.indexOf('image') > -1
|
||||
}
|
||||
if (!isImg) {
|
||||
ElMessage.error(`文件格式不正确, 请上传${props.fileType.join('/')}图片格式文件!`);
|
||||
return false
|
||||
}
|
||||
if (props.fileSize) {
|
||||
const isLt = file.size / 1024 / 1024 < props.fileSize
|
||||
if (!isLt) {
|
||||
ElMessage.error(`上传头像图片大小不能超过 ${props.fileSize} MB!`);
|
||||
return false
|
||||
}
|
||||
}
|
||||
number.value++
|
||||
}
|
||||
|
||||
// 文件个数超出
|
||||
function handleExceed() {
|
||||
ElMessage.error(`上传文件数量不能超过 ${props.limit} 个!`)
|
||||
}
|
||||
|
||||
// 上传失败
|
||||
function handleUploadError() {
|
||||
ElMessage.error('上传图片失败')
|
||||
}
|
||||
|
||||
// 预览
|
||||
function handlePictureCardPreview(file) {
|
||||
dialogImageUrl.value = file.url
|
||||
dialogVisible.value = true
|
||||
}
|
||||
|
||||
// 对象转成指定字符串分隔
|
||||
function listToString(list, separator) {
|
||||
let strs = ''
|
||||
separator = separator || ','
|
||||
for (let i in list) {
|
||||
if (undefined !== list[i].url && list[i].url.indexOf('blob:') !== 0) {
|
||||
strs += list[i].url + separator
|
||||
}
|
||||
}
|
||||
return strs != '' ? strs.substr(0, strs.length - 1) : ''
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
:deep(.hide .el-upload--picture-card) {
|
||||
display: none !important;
|
||||
}
|
||||
|
||||
:deep(.el-upload-dragger) {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
}
|
||||
</style>
|
||||
248
src/components/Map.vue
Normal file
248
src/components/Map.vue
Normal file
@ -0,0 +1,248 @@
|
||||
<template>
|
||||
<div class="map-wrapper">
|
||||
<div id="mapcontainer"></div>
|
||||
<div class="search-box">
|
||||
<el-autocomplete v-if="props.isSearch" v-model="location.address" :fetch-suggestions="handleSearch"
|
||||
:trigger-on-focus="false" clearable placeholder="输入城市+关键字搜索" @select="handleSelect"
|
||||
style="width: 300px" />
|
||||
<el-input v-if="props.isShowInput" v-model="location.longitude" placeholder="选择经度" maxlength="15" readonly
|
||||
style="width: 150px; margin: 0 10px 0 20px"></el-input>
|
||||
<el-input v-if="props.isShowInput" v-model="location.latitude" placeholder="选择纬度" maxlength="15" readonly
|
||||
style="width: 150px"></el-input>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import AMapLoader from '@amap/amap-jsapi-loader';
|
||||
import { ref, watch, shallowRef, onMounted } from 'vue'
|
||||
|
||||
window._AMapSecurityConfig = {
|
||||
securityJsCode: '8841f4d260a9f47378242a05ace584ca'
|
||||
};
|
||||
const props = defineProps({
|
||||
// v-model (经纬度)
|
||||
modelValue: {
|
||||
type: Object,
|
||||
default(v) {
|
||||
return v;
|
||||
}
|
||||
},
|
||||
// 是否显示搜索
|
||||
isSearch: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
// 是否可以点击
|
||||
isClick: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
// 是否展示当前经纬度
|
||||
isShowInput: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
},
|
||||
mapCb:{
|
||||
type:Function,
|
||||
default:function(){
|
||||
console.log('is default');
|
||||
}
|
||||
}
|
||||
});
|
||||
const emit = defineEmits(['update:modelValue']);
|
||||
const map = shallowRef(null);
|
||||
const location = ref(props.modelValue);
|
||||
|
||||
|
||||
onMounted(() => {
|
||||
initMap();
|
||||
});
|
||||
|
||||
watch(location.value, val => {
|
||||
if (val.longitude && val.latitude) {
|
||||
drawMarker();
|
||||
}
|
||||
});
|
||||
const keyword = ref('');
|
||||
let placeSearch, AMapObj, marker, geocoder;
|
||||
function initMap() {
|
||||
AMapLoader.load({
|
||||
key: '582deef9a68a17068f3b7e291807045d', // 申请好的Web端Key，首次调用 load 时必填
|
||||
version: '2.0'
|
||||
}).then(AMap => {
|
||||
props.mapCb()
|
||||
AMapObj = AMap;
|
||||
map.value = new AMap.Map('mapcontainer');
|
||||
// 添加点击事件
|
||||
if (props.isClick) {
|
||||
map.value.on('click', onMapClick);
|
||||
}
|
||||
if (location.value.longitude) {
|
||||
drawMarker();
|
||||
}
|
||||
AMap.plugin(
|
||||
[
|
||||
'AMap.ToolBar',
|
||||
'AMap.Scale',
|
||||
'AMap.Geolocation',
|
||||
'AMap.PlaceSearch',
|
||||
'AMap.Geocoder'
|
||||
],
|
||||
() => {
|
||||
// 缩放条
|
||||
const toolbar = new AMap.ToolBar();
|
||||
// 比例尺
|
||||
const scale = new AMap.Scale();
|
||||
// 定位
|
||||
const geolocation = new AMap.Geolocation({
|
||||
enableHighAccuracy: true, //是否使用高精度定位，默认:true
|
||||
timeout: 10000, //超过10秒后停止定位，默认：5s
|
||||
position: 'RT', //定位按钮的停靠位置
|
||||
buttonOffset: new AMap.Pixel(10, 20), //定位按钮与设置的停靠位置的偏移量，默认：Pixel(10, 20)
|
||||
zoomToAccuracy: true //定位成功后是否自动调整地图视野到定位点
|
||||
});
|
||||
geocoder = new AMap.Geocoder({
|
||||
city: '全国'
|
||||
});
|
||||
map.value.addControl(geolocation);
|
||||
map.value.addControl(toolbar);
|
||||
map.value.addControl(scale);
|
||||
placeSearch = new AMap.PlaceSearch({
|
||||
map: map.value,
|
||||
city: '',
|
||||
pageSize: 30, // 单页显示结果条数
|
||||
pageIndex: 1, // 页码
|
||||
citylimit: false, // 是否强制限制在设置的城市内搜索
|
||||
autoFitView: true
|
||||
});
|
||||
}
|
||||
);
|
||||
});
|
||||
}
|
||||
|
||||
// 搜索地图
|
||||
function handleSearch(queryString, cb) {
|
||||
placeSearch.search(queryString, (status, result) => {
|
||||
if (result && typeof result === 'object' && result.poiList) {
|
||||
const list = result.poiList.pois;
|
||||
list.forEach(item => {
|
||||
item.value = item.name;
|
||||
item.label = item.name;
|
||||
});
|
||||
cb(list);
|
||||
|
||||
} else {
|
||||
cb([]);
|
||||
}
|
||||
});
|
||||
}
|
||||
// 点击地图
|
||||
function onMapClick(e) {
|
||||
const { lng, lat } = e.lnglat;
|
||||
// 逆地理编码
|
||||
geocoder.getAddress([lng, lat], (status, result) => {
|
||||
if (status === 'complete' && result.info === 'OK') {
|
||||
const { addressComponent, formattedAddress } = result.regeocode;
|
||||
let { city, province, district } = addressComponent;
|
||||
if (!city) {
|
||||
// 直辖市
|
||||
city = province;
|
||||
}
|
||||
// location.value = {
|
||||
// longitude: lng,
|
||||
// latitude: lat,
|
||||
// address: formattedAddress,
|
||||
// zone: [province, city, district],
|
||||
// };
|
||||
|
||||
location.value.longitude = lng;
|
||||
location.value.latitude = lat;
|
||||
location.value.address = formattedAddress;
|
||||
location.value.zone = [province, city, district];
|
||||
|
||||
// console.log(location.value);
|
||||
}
|
||||
});
|
||||
}
|
||||
// 点击搜索项
|
||||
function handleSelect(item) {
|
||||
// const { pname, cityname, adname, address, name } = item;
|
||||
const { lng, lat } = item.location;
|
||||
// 逆地理编码
|
||||
geocoder.getAddress([lng, lat], (status, result) => {
|
||||
if (status === 'complete' && result.info === 'OK') {
|
||||
const { addressComponent, formattedAddress } = result.regeocode;
|
||||
let { city, province, district } = addressComponent;
|
||||
if (!city) {
|
||||
// 直辖市
|
||||
city = province;
|
||||
}
|
||||
// location.value = {
|
||||
// longitude: lng,
|
||||
// latitude: lat,
|
||||
// address: formattedAddress,
|
||||
// zone: [province, city, district],
|
||||
// };
|
||||
|
||||
location.value.longitude = lng;
|
||||
location.value.latitude = lat;
|
||||
location.value.address = formattedAddress;
|
||||
location.value.zone = [province, city, district];
|
||||
|
||||
// console.log(location.value);
|
||||
}
|
||||
});
|
||||
|
||||
// location.value = {
|
||||
// longitude: lng,
|
||||
// latitude: lat,
|
||||
// address,
|
||||
// zone: [pname, cityname, adname],
|
||||
// name
|
||||
// };
|
||||
// location.value.longitude = lng;
|
||||
// location.value.latitude = lat;
|
||||
// location.value.address = address;
|
||||
// location.value.name = name;
|
||||
// location.value.zone = [pname, cityname, adname];
|
||||
map.value.setZoomAndCenter(16, [lng, lat]);
|
||||
}
|
||||
// 绘制地点marker
|
||||
function drawMarker(val) {
|
||||
const { longitude, latitude } = location.value || val;
|
||||
if (marker) {
|
||||
marker.setMap(null);
|
||||
}
|
||||
marker = new AMapObj.Marker({
|
||||
position: new AMapObj.LngLat(longitude, latitude),
|
||||
anchor: 'bottom-center'
|
||||
});
|
||||
map.value.add(marker);
|
||||
map.value.setZoomAndCenter(16, [longitude, latitude]);
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.map-wrapper {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
height: 400px;
|
||||
display: flex;
|
||||
|
||||
#mapcontainer {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.search-box {
|
||||
position: absolute;
|
||||
top: 10px;
|
||||
left: 10px;
|
||||
z-index: 1;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
align-items: center;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
112
src/components/Pagination.vue
Normal file
112
src/components/Pagination.vue
Normal file
@ -0,0 +1,112 @@
|
||||
<template>
|
||||
<div :class="{ hidden: hidden }" class="pagination-container">
|
||||
<el-pagination
|
||||
large
|
||||
background
|
||||
v-model:current-page="currentPage"
|
||||
v-model:page-size="pageSize"
|
||||
:layout="layout"
|
||||
:page-sizes="pageSizes"
|
||||
:pager-count="pagerCount"
|
||||
:total="total"
|
||||
@size-change="handleSizeChange"
|
||||
@current-change="handleCurrentChange" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
// import { scrollTo } from "@/utils/scroll-to";
|
||||
import { computed } from 'vue'
|
||||
export default {
|
||||
name: 'pagingation',
|
||||
emits: ['update:page', 'update:limit', 'pagination'],
|
||||
props: {
|
||||
total: {
|
||||
required: true,
|
||||
type: Number,
|
||||
},
|
||||
page: {
|
||||
type: Number,
|
||||
default: 1,
|
||||
},
|
||||
limit: {
|
||||
type: Number,
|
||||
default: 20,
|
||||
},
|
||||
pageSizes: {
|
||||
type: Array,
|
||||
default() {
|
||||
return [10, 20, 30, 50, 100]
|
||||
},
|
||||
},
|
||||
// 移动端页码按钮的数量端默认值5
|
||||
pagerCount: {
|
||||
type: Number,
|
||||
default: document.body.clientWidth < 992 ? 5 : 7,
|
||||
},
|
||||
layout: {
|
||||
type: String,
|
||||
default: 'total, sizes, prev, pager, next, jumper',
|
||||
},
|
||||
background: {
|
||||
type: Boolean,
|
||||
default: true,
|
||||
},
|
||||
autoScroll: {
|
||||
type: Boolean,
|
||||
default: true,
|
||||
},
|
||||
hidden: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
},
|
||||
setup(props, { ctx, emit }) {
|
||||
const currentPage = computed({
|
||||
get() {
|
||||
return props.page
|
||||
},
|
||||
set(val) {
|
||||
emit('update:page', val)
|
||||
},
|
||||
})
|
||||
const pageSize = computed({
|
||||
get() {
|
||||
return props.limit
|
||||
},
|
||||
set(val) {
|
||||
emit('update:limit', val)
|
||||
},
|
||||
})
|
||||
|
||||
function handleSizeChange(val) {
|
||||
emit('pagination', { page: currentPage.value, limit: val })
|
||||
if (props.autoScroll) {
|
||||
// scrollTo(0, 800);
|
||||
}
|
||||
}
|
||||
function handleCurrentChange(val) {
|
||||
emit('pagination', { page: val, limit: pageSize.value })
|
||||
if (props.autoScroll) {
|
||||
// scrollTo(0, 800);
|
||||
}
|
||||
}
|
||||
|
||||
return {
|
||||
currentPage,
|
||||
pageSize,
|
||||
handleSizeChange,
|
||||
handleCurrentChange,
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
<style scoped>
|
||||
.pagination-container {
|
||||
/* background: #fff; */
|
||||
padding: 32px 16px;
|
||||
}
|
||||
.pagination-container.hidden {
|
||||
display: none;
|
||||
}
|
||||
</style>
|
||||
141
src/components/RichText.vue
Normal file
141
src/components/RichText.vue
Normal file
@ -0,0 +1,141 @@
|
||||
<template>
|
||||
<div style="border: 1px solid #ccc;width: 100%;z-index: 999;" >
|
||||
<Toolbar style="border-bottom: 1px solid #ccc" :editor="editorRef" :defaultConfig="toolbarConfig" :mode="mode" />
|
||||
<Editor style="height: 500px; overflow-y: hidden" v-model="valueHtml" :defaultConfig="editorConfig" :mode="mode"
|
||||
@onCreated="handleCreated" @onChange="handleChange" />
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import '@wangeditor/editor/dist/css/style.css' // 引入 css
|
||||
import { onBeforeUnmount, ref, shallowRef,watch } from 'vue'
|
||||
import { Editor, Toolbar } from '@wangeditor/editor-for-vue'
|
||||
import { useLoginStore } from "~/store";
|
||||
|
||||
export default {
|
||||
components: { Editor, Toolbar },
|
||||
props: {
|
||||
placeholder: {
|
||||
type: String,
|
||||
default: () => '请输入内容',
|
||||
},
|
||||
modelValue: String,
|
||||
editorConfig: {
|
||||
type: Object,
|
||||
default: {},
|
||||
}
|
||||
},
|
||||
setup(props, { emit }) {
|
||||
const store = useLoginStore();
|
||||
const headers = {
|
||||
...store.headers,
|
||||
};
|
||||
|
||||
const editorRef = shallowRef()
|
||||
const valueHtml = ref(props.modelValue)
|
||||
const toolbarConfig = {}
|
||||
const editorConfig = {
|
||||
MENU_CONF: {},
|
||||
placeholder: props.placeholder,
|
||||
...props.editorConfig
|
||||
}
|
||||
//上传图片
|
||||
editorConfig.MENU_CONF['uploadImage'] = {
|
||||
server: import.meta.env.VITE_PROXY_RICHTEXT + '/common/uploadImg',
|
||||
// form-data fieldName ，默认值 'wangeditor-uploaded-image'
|
||||
fieldName: 'file',
|
||||
// 单个文件的最大体积限制，默认为 2M
|
||||
maxFileSize: 5 * 1024 * 1024, // 5M
|
||||
// 最多可上传几个文件，默认为 100
|
||||
maxNumberOfFiles: 10,
|
||||
// 选择文件时的类型限制，默认为 ['image/*'] 。如不想限制，则设置为 []
|
||||
allowedFileTypes: ['image/*'],
|
||||
// 将 meta 拼接到 url 参数中，默认 false
|
||||
metaWithUrl: false,
|
||||
// 自定义增加 http header
|
||||
headers: {
|
||||
token: headers.token // 设置请求头
|
||||
},
|
||||
data: {
|
||||
dirName: "RichText"
|
||||
},
|
||||
// 跨域是否传递 cookie ，默认为 false
|
||||
withCredentials: true,
|
||||
// 超时时间，默认为 10 秒
|
||||
timeout: 5 * 1000, // 5 秒
|
||||
// 自定义插入图片
|
||||
customInsert(res, insertFn) {
|
||||
; -(
|
||||
// 从 res 中找到 url alt href ，然后插图图片
|
||||
insertFn(res.data.url)
|
||||
)
|
||||
},
|
||||
}
|
||||
//上传视频
|
||||
editorConfig.MENU_CONF['uploadVideo'] = {
|
||||
server: import.meta.env.VITE_PROXY_RICHTEXT + '/common/uploadFile',
|
||||
// form-data fieldName ，默认值 'wangeditor-uploaded-video'
|
||||
fieldName: 'file',
|
||||
|
||||
// 单个文件的最大体积限制，默认为 10M
|
||||
maxFileSize: 100 * 1024 * 1024, // 5M
|
||||
|
||||
// 最多可上传几个文件，默认为 5
|
||||
maxNumberOfFiles: 3,
|
||||
|
||||
// 选择文件时的类型限制，默认为 ['video/*'] 。如不想限制，则设置为 []
|
||||
allowedFileTypes: ['video/*'],
|
||||
|
||||
// 将 meta 拼接到 url 参数中，默认 false
|
||||
metaWithUrl: false,
|
||||
|
||||
// 自定义增加 http header
|
||||
headers: {
|
||||
token: headers.token // 设置请求头
|
||||
},
|
||||
|
||||
// 跨域是否传递 cookie ，默认为 false
|
||||
withCredentials: true,
|
||||
// 超时时间，默认为 30 秒
|
||||
timeout: 15 * 1000, // 15 秒
|
||||
// 自定义插入视频
|
||||
customInsert(res, insertFn) {
|
||||
; -(
|
||||
// 从 res 中找到 url alt href ，然后插图图片
|
||||
insertFn(res.data.url)
|
||||
)
|
||||
},
|
||||
}
|
||||
onBeforeUnmount(() => {
|
||||
const editor = editorRef.value
|
||||
if (editor == null) return
|
||||
editor.destroy()
|
||||
})
|
||||
const handleCreated = (editor) => {
|
||||
editorRef.value = editor
|
||||
}
|
||||
const handleChange = (editor) => {
|
||||
emit('update:modelValue', editor.getHtml())
|
||||
}
|
||||
watch(
|
||||
() => props.modelValue,
|
||||
(value) => {
|
||||
const editor = editorRef.value
|
||||
if (value == undefined) {
|
||||
editor.clear()
|
||||
return
|
||||
}
|
||||
valueHtml.value = value;
|
||||
},
|
||||
)
|
||||
return {
|
||||
editorRef,
|
||||
valueHtml,
|
||||
mode: 'default',
|
||||
toolbarConfig,
|
||||
editorConfig,
|
||||
handleCreated,
|
||||
handleChange,
|
||||
}
|
||||
},
|
||||
}
|
||||
</script>
|
||||
190
src/components/UploadVideo.vue
Normal file
190
src/components/UploadVideo.vue
Normal file
@ -0,0 +1,190 @@
|
||||
<template>
|
||||
|
||||
<el-upload v-model="props.modelValue"
|
||||
multiple
|
||||
:action="videoUpload"
|
||||
:file-list="uploadVideoArr"
|
||||
:data="props.data"
|
||||
:fileSize="props.fileSize"
|
||||
@success="handle"
|
||||
@error="handle"
|
||||
@exceed="handleExceed"
|
||||
:before-upload="beforeUpload"
|
||||
:drag="true"
|
||||
@preview="handleVideoPreview"
|
||||
@remove="handleDelete"
|
||||
list-type="picture-card"
|
||||
>
|
||||
|
||||
<div class="previewVideoMask" v-if="previewIsShow" @click.stop="changPreview">
|
||||
<video :src="previewViewSrc" class="previewVideo" controls></video>
|
||||
</div>
|
||||
<el-button size="small" type="primary">点击上传</el-button>
|
||||
<div slot="tip" class="el-upload__tip">只能上传视频格式文件（注：需等待全部上传成功再提交）</div>
|
||||
</el-upload>
|
||||
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {ElMessage} from "element-plus";
|
||||
import {ref, watch} from "vue";
|
||||
import { videoUpload } from "~/service/common";
|
||||
|
||||
let uploadIdx = ref(0)
|
||||
let previewIsShow = ref(false)
|
||||
let previewViewSrc = ref('')
|
||||
let uploadVideoArr = ref([])
|
||||
let uploadList = ref([])
|
||||
let number = ref(0)
|
||||
|
||||
const emit = defineEmits()
|
||||
const props = defineProps({
|
||||
modelValue : String,
|
||||
data:Object,
|
||||
fileType: {
|
||||
type: Array,
|
||||
default: () => ['mov', 'mp4', 'wmv', 'flv', 'avi','avchd','webm'],
|
||||
},
|
||||
})
|
||||
|
||||
const changPreview = function (){
|
||||
previewIsShow.value = !previewIsShow.value
|
||||
}
|
||||
const handleExceed = function (arg){
|
||||
console.log(arg)
|
||||
}
|
||||
watch(
|
||||
() => props.modelValue,
|
||||
(val) => {
|
||||
if (val) {
|
||||
let temp = 1
|
||||
// 首先将值转为数组
|
||||
const list = Array.isArray(val) ? val : props.modelValue.split(',')
|
||||
// 然后将数组转为对象数组
|
||||
uploadVideoArr.value = list.map((item) => {
|
||||
if (typeof item === 'string') {
|
||||
item = { url: item }
|
||||
}
|
||||
item.uid = item.uid || new Date().getTime() + temp++
|
||||
return item
|
||||
})
|
||||
// uploadList.value = fileList
|
||||
} else {
|
||||
uploadVideoArr.value = []
|
||||
return []
|
||||
}
|
||||
updateVideoDom()
|
||||
|
||||
},
|
||||
{ deep: true, immediate: true },
|
||||
)
|
||||
|
||||
|
||||
// 对象转成指定字符串分隔
|
||||
function listToString(list, separator) {
|
||||
let strs = ''
|
||||
separator = separator || ','
|
||||
for (let i in list) {
|
||||
strs += list[i].url + separator
|
||||
}
|
||||
return strs != '' ? strs.substr(0, strs.length - 1) : ''
|
||||
}
|
||||
|
||||
const handle=function (res){
|
||||
if(res['code'] !== 0){
|
||||
uploadVideoArr.value = []
|
||||
ElMessage.error(res.msg)
|
||||
return
|
||||
}
|
||||
const { url, } = res?.data
|
||||
const tempFile = { url: url }
|
||||
uploadList.value.push(tempFile)
|
||||
if (uploadList.value.length === number.value) {
|
||||
uploadVideoArr.value.map(item=>{
|
||||
if(item?.response){
|
||||
item.url = item.response.data.url
|
||||
}
|
||||
})
|
||||
emit('update:modelValue', listToString(uploadVideoArr.value))
|
||||
emit('success', listToString(uploadVideoArr.value))
|
||||
// console.log(uploadVideoArr.value,'is local')
|
||||
// console.log(props.modelValue,'is props')
|
||||
uploadList.value = []
|
||||
number.value = 0
|
||||
console.log(uploadVideoArr.value,123)
|
||||
ElMessage.success('全部上传成功')
|
||||
|
||||
}
|
||||
updateVideoDom()
|
||||
}
|
||||
function updateVideoDom(){
|
||||
setTimeout(()=>{
|
||||
Array.prototype.slice.call(document.getElementsByClassName('is-success')).filter(item=>item.className.indexOf('el-upload-list__item')!==-1).map((item,idx)=>{
|
||||
let tag = item.getElementsByClassName('el-upload-list__item-thumbnail')[0]
|
||||
let attr = [tag.getAttribute('class'),tag.getAttribute('src')]
|
||||
let videoTag = document.createElement('video')
|
||||
videoTag.setAttribute('class',attr[0])
|
||||
videoTag.setAttribute('src',attr[1])
|
||||
item.replaceChild(videoTag,tag)
|
||||
})
|
||||
|
||||
},)
|
||||
}
|
||||
|
||||
const beforeUpload = function (file){
|
||||
// 校检文件类型
|
||||
if (props.fileType.length) {
|
||||
let fileExtension = ''
|
||||
if (file.name.lastIndexOf('.') > -1) {
|
||||
fileExtension = file.name.slice(file.name.lastIndexOf('.') + 1)
|
||||
}
|
||||
const isTypeOk = props.fileType.some((type) => {
|
||||
if (file.type.indexOf(type) > -1) return true
|
||||
if (fileExtension && fileExtension.indexOf(type) > -1) return true
|
||||
return false
|
||||
})
|
||||
if (!isTypeOk) {
|
||||
ElMessage.error(`文件格式不正确, 请上传${props.fileType.join('/')}格式文件!`)
|
||||
return false
|
||||
}
|
||||
number.value+=1
|
||||
}
|
||||
}
|
||||
const handleDelete=function (f,fl){
|
||||
let index
|
||||
console.log(f,props.modelValue.split(','))
|
||||
props.modelValue.split(',').map((item,idx)=>{
|
||||
if(item===f.url){
|
||||
index = idx
|
||||
}
|
||||
})
|
||||
uploadVideoArr.value.splice(index, 1)
|
||||
emit('update:modelValue', listToString(uploadVideoArr.value))
|
||||
}
|
||||
const handleVideoPreview = function (f){
|
||||
|
||||
changPreview()
|
||||
previewViewSrc.value = f.url
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="scss">
|
||||
.previewVideoMask{
|
||||
height: 100vh;
|
||||
width: 100vw;
|
||||
background: rgba(0,10,10,0.5);
|
||||
position: fixed;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
z-index: 99999;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-content: center;
|
||||
flex-direction: column;
|
||||
.previewVideo{
|
||||
height: 80%;
|
||||
width: 80%;
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
5
src/components/index.ts
Normal file
5
src/components/index.ts
Normal file
@ -0,0 +1,5 @@
|
||||
import DataTable from './DataTable';
|
||||
import DialogForm from './DialogForm';
|
||||
import Icon from './Icon.vue';
|
||||
|
||||
export { DataTable, DialogForm, Icon };
|
||||
93
src/guardian.ts
Normal file
93
src/guardian.ts
Normal file
@ -0,0 +1,93 @@
|
||||
import NProgress from 'nprogress';
|
||||
import 'nprogress/nprogress.css';
|
||||
|
||||
import './styles/nprogress/index.css';
|
||||
|
||||
import router from './router';
|
||||
import { useLoginStore, useMenuStore } from '~/store';
|
||||
import { ElMessageBox } from 'element-plus';
|
||||
|
||||
/**
|
||||
* 检查是否登陆
|
||||
*/
|
||||
const checkLogin = async () => {
|
||||
const login = useLoginStore();
|
||||
const token = login.token;
|
||||
try {
|
||||
if (!token) {
|
||||
throw new Error('请登陆');
|
||||
}
|
||||
const check = !(await login.checkLoginIsExp())
|
||||
if (!check) {
|
||||
throw new Error("登录超时");
|
||||
}
|
||||
return check;
|
||||
} catch (error) {
|
||||
login.logout();
|
||||
return false;
|
||||
}
|
||||
};
|
||||
/**
|
||||
* 检查路由
|
||||
*/
|
||||
const checkRouter = (path: string) => {
|
||||
const menu = useMenuStore()
|
||||
const validate = menu.routers.includes(path);
|
||||
if (!validate) {
|
||||
// 开发环境
|
||||
if (import.meta.env.DEV) {
|
||||
ElMessageBox.alert(
|
||||
`[ ${path} ] 路由未添加到菜单中 请添加后访问`,
|
||||
'提示',
|
||||
{
|
||||
confirmButtonText: '去添加',
|
||||
showClose: false
|
||||
}
|
||||
).then(() => {
|
||||
router.push('/system/menu');
|
||||
});
|
||||
} else {
|
||||
router.push('/exception/403');
|
||||
}
|
||||
return false;
|
||||
}
|
||||
return true;
|
||||
};
|
||||
|
||||
/**
|
||||
* 路由守护
|
||||
*/
|
||||
export function guardian() {
|
||||
router.beforeEach(async ({ path, meta }) => {
|
||||
const {
|
||||
// 路由检查
|
||||
ignoreRouterCheck = false,
|
||||
// 登陆检查
|
||||
ignoreLoginCheck = false
|
||||
} = meta;
|
||||
// 登录验证
|
||||
if (!ignoreLoginCheck) {
|
||||
await checkLogin()
|
||||
}
|
||||
// 路由检查
|
||||
if (!ignoreRouterCheck) {
|
||||
const check = checkRouter(path);
|
||||
if (!check) {
|
||||
return false;
|
||||
}
|
||||
}
|
||||
});
|
||||
}
|
||||
|
||||
/**
|
||||
* 顶部进度条
|
||||
*/
|
||||
export function topProgressBar() {
|
||||
router.beforeEach((to, from, next) => {
|
||||
NProgress.start();
|
||||
next();
|
||||
});
|
||||
router.afterEach(() => {
|
||||
NProgress.done();
|
||||
});
|
||||
}
|
||||
206
src/layout/Index.vue
Normal file
206
src/layout/Index.vue
Normal file
@ -0,0 +1,206 @@
|
||||
<template>
|
||||
<el-container id="AppContainer">
|
||||
<el-aside width="200px">
|
||||
<router-link to="/">
|
||||
<div id="logo">
|
||||
<!-- 头部Logo替换 -->
|
||||
<img src="/logo.png" style="margin-top: 5px;margin-left: 5px;" alt="" />
|
||||
<!-- <span>PHP模板</span> -->
|
||||
</div>
|
||||
</router-link>
|
||||
<AsideMenu :collapse="collapse" />
|
||||
</el-aside>
|
||||
<el-container>
|
||||
<el-header>
|
||||
<!-- <span @click="collapse = !collapse">
|
||||
<el-icon>
|
||||
<expand v-show="collapse" />
|
||||
<fold v-show="!collapse" />
|
||||
</el-icon>
|
||||
</span> -->
|
||||
<div class="header_right_title">
|
||||
<span>后 台 管 理 系 统</span>
|
||||
</div>
|
||||
|
||||
|
||||
<el-dropdown>
|
||||
<!-- <el-avatar :size="50" :src="circleUrl" /> -->
|
||||
<span style="color:black">
|
||||
欢迎您，
|
||||
<span style="color: red">{{ useInfo.user_name }}</span
|
||||
>！
|
||||
<Icon name="ElIconArrowDown" class="el-icon--right" />
|
||||
</span>
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu>
|
||||
<el-dropdown-item @click="logout">登出</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
</el-header>
|
||||
<el-main>
|
||||
<el-card class="box-card main-card">
|
||||
<slot name="default"></slot>
|
||||
</el-card>
|
||||
</el-main>
|
||||
</el-container>
|
||||
</el-container>
|
||||
</template>
|
||||
<script setup>
|
||||
import { computed, ref } from "vue";
|
||||
import { useRouter } from "vue-router";
|
||||
import { useIntervalFn } from "@vueuse/core";
|
||||
import AsideMenu from "./components/AsideMenu.vue";
|
||||
import useUserStore from "~/store/user";
|
||||
import useLoginStore from "~/store/login";
|
||||
|
||||
const router = useRouter();
|
||||
|
||||
const login = useLoginStore();
|
||||
const user = useUserStore();
|
||||
|
||||
user.getUserInfo();
|
||||
user.getUserMenu();
|
||||
|
||||
const useInfo = computed(() => user.user);
|
||||
const collapse = ref(false);
|
||||
|
||||
const logout = () => {
|
||||
user.userLogout();
|
||||
};
|
||||
|
||||
useIntervalFn(async () => {
|
||||
if (await login.checkLoginIsExp()) {
|
||||
ElNotification({
|
||||
title: "提示",
|
||||
message: "检测到当前登录状态已超时，请重新登录",
|
||||
type: "warning",
|
||||
duration: 0,
|
||||
});
|
||||
login.logout();
|
||||
}
|
||||
}, 1000 * 30);
|
||||
</script>
|
||||
<style>
|
||||
body {
|
||||
margin: 0;
|
||||
}
|
||||
#AppContainer {
|
||||
height: 100vh;
|
||||
width: 100%;
|
||||
overflow: hidden;
|
||||
}
|
||||
.addButton {
|
||||
float: right;
|
||||
}
|
||||
.el-breadcrumb {
|
||||
position: fixed;
|
||||
top: 70px;
|
||||
z-index: 99;
|
||||
line-height: 35px !important;
|
||||
background-color: white;
|
||||
width: 100%;
|
||||
margin-bottom: 10px;
|
||||
}
|
||||
.el-main {
|
||||
padding: 0 !important;
|
||||
overflow: hidden !important;
|
||||
}
|
||||
.main-card {
|
||||
position: relative;
|
||||
height: 100%;
|
||||
overflow-y: auto !important;
|
||||
}
|
||||
.el-card__body {
|
||||
padding-top: 50px !important;
|
||||
}
|
||||
.el-aside {
|
||||
height: 100%;
|
||||
overflow-y: hidden;
|
||||
}
|
||||
/* 滑动条 */
|
||||
/* 定义滚动条样式 */
|
||||
::-webkit-scrollbar {
|
||||
width: 5px;
|
||||
height: 8px;
|
||||
}
|
||||
::-webkit-scrollbar-corner {
|
||||
background: #f6f6f6;
|
||||
}
|
||||
::-webkit-scrollbar-thumb {
|
||||
background: #cdcdcd;
|
||||
border-radius: 2px;
|
||||
}
|
||||
::-webkit-scrollbar-track {
|
||||
background: #f6f6f6;
|
||||
border-radius: 2px;
|
||||
}
|
||||
|
||||
#logo span{
|
||||
font-size: 20px;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
|
||||
.header_m_box{
|
||||
display: flex;
|
||||
font-size: 14px;
|
||||
color: #85a5c2;
|
||||
font-weight: bold;
|
||||
}
|
||||
|
||||
.header_m_content_box{
|
||||
display: flex;
|
||||
}
|
||||
|
||||
</style>
|
||||
<style lang="less" scoped>
|
||||
/* 头部 */
|
||||
|
||||
.el-aside {
|
||||
position: relative;
|
||||
#logo {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: 0;
|
||||
width: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
// justify-content: center;
|
||||
// justify-content: space-around;
|
||||
height: 70px;
|
||||
text-align: center;
|
||||
background-color: pink; // 头部logo背景色
|
||||
// background-color: #2b333e; //默认
|
||||
cursor: pointer;
|
||||
color: white;
|
||||
z-index: 99;
|
||||
img {
|
||||
width: 150px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.header_right_title > span {
|
||||
font-weight: bold;
|
||||
margin: 2px;
|
||||
}
|
||||
|
||||
.el-header {
|
||||
font-size: 16px !important;
|
||||
display: flex;
|
||||
box-shadow: 10px 5px 20px 0px #f1f1f1;
|
||||
// border-bottom: rgba(0, 0, 0, 0.1) 1px solid;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
height: 70px;
|
||||
z-index: 999;
|
||||
|
||||
.el-dropdown,
|
||||
.el-dropdown-menu__item {
|
||||
font-size: 16px;
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
44
src/layout/components/AsideMenu.vue
Normal file
44
src/layout/components/AsideMenu.vue
Normal file
@ -0,0 +1,44 @@
|
||||
<template>
|
||||
<el-menu
|
||||
style="background-color: #2b333e"
|
||||
router
|
||||
:default-openeds="menu.openMenu"
|
||||
@open="v => menu.setOpenMenu(v)"
|
||||
@close="v => menu.setOpenMenu(v)"
|
||||
:collapse="collapse"
|
||||
:unique-opened="true"
|
||||
>
|
||||
<div style="width: 200px; height: 70px"></div>
|
||||
<Menu :menu="menu.menu"></Menu>
|
||||
</el-menu>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {
|
||||
ref,
|
||||
onMounted,
|
||||
onBeforeMount,
|
||||
reactive,
|
||||
computed,
|
||||
watch,
|
||||
toRefs,
|
||||
unref,
|
||||
nextTick
|
||||
} from 'vue';
|
||||
import { useRouter } from 'vue-router';
|
||||
import useMenuStore from '~/store/menu';
|
||||
import Menu from './Menu.vue';
|
||||
|
||||
const props = defineProps({
|
||||
collapse: Boolean
|
||||
});
|
||||
const menu = useMenuStore();
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
.el-menu {
|
||||
height: 100%;
|
||||
position: relative;
|
||||
overflow-y: auto;
|
||||
overflow-x: hidden;
|
||||
}
|
||||
</style>
|
||||
83
src/layout/components/Menu.vue
Normal file
83
src/layout/components/Menu.vue
Normal file
@ -0,0 +1,83 @@
|
||||
<template>
|
||||
<template v-for="item in props.menu" :key="item.key">
|
||||
<template v-if="isShow(item)">
|
||||
<!-- 一级菜单 -->
|
||||
<el-menu-item :index="item.url" v-if="!hasChildren(item)">
|
||||
<template #title>
|
||||
<template v-if="props.showIcon && item.icon">
|
||||
<el-icon style="color: white">
|
||||
<component :is="item.icon"></component>
|
||||
</el-icon>
|
||||
</template>
|
||||
<span style="color: white">{{ item.name }}</span>
|
||||
</template>
|
||||
</el-menu-item>
|
||||
<!-- 二级菜单 -->
|
||||
<el-sub-menu :index="item.url" v-else>
|
||||
<template #title>
|
||||
<template v-if="item.icon">
|
||||
<el-icon style="color: white">
|
||||
<component :is="item.icon"></component>
|
||||
</el-icon>
|
||||
</template>
|
||||
<span style="color: white">{{ item.name }}</span>
|
||||
</template>
|
||||
<Menu :menu="item.children" :showIcon="false"></Menu>
|
||||
</el-sub-menu>
|
||||
</template>
|
||||
</template>
|
||||
</template>
|
||||
<script setup>
|
||||
const props = defineProps({
|
||||
menu: Object,
|
||||
showIcon: {
|
||||
type: Boolean,
|
||||
default: true
|
||||
}
|
||||
});
|
||||
|
||||
const hasChildren = ({ children }) => {
|
||||
return Array.isArray(children) && children.length;
|
||||
};
|
||||
|
||||
const isShow = ({ show }) => {
|
||||
return show === 1;
|
||||
};
|
||||
</script>
|
||||
|
||||
<style>
|
||||
/* 菜单栏背景 */
|
||||
.el-menu-item {
|
||||
background-color: #2b333e !important;
|
||||
}
|
||||
|
||||
/* 二级菜单栏背景 */
|
||||
.el-sub-menu {
|
||||
background-color: #2b333e !important;
|
||||
}
|
||||
|
||||
/* 一级菜单移入移出 */
|
||||
.el-menu-item:hover {
|
||||
background-color: none !important;
|
||||
}
|
||||
|
||||
/* 二级菜单移入移出 */
|
||||
.el-sub-menu:hover {
|
||||
background-color: none !important;
|
||||
}
|
||||
|
||||
/* 二级菜单2移入移出 */
|
||||
.el-sub-menu__title:hover {
|
||||
background-color: rgba(0, 0, 0, 0) !important;
|
||||
}
|
||||
|
||||
/* 选中背景颜色 */
|
||||
.el-menu-item.is-active {
|
||||
background-color: pink !important;
|
||||
}
|
||||
|
||||
/* 二级菜单开展箭头图标 */
|
||||
.el-sub-menu__icon-arrow>svg {
|
||||
color: white;
|
||||
}
|
||||
</style>
|
||||
56
src/main.ts
Normal file
56
src/main.ts
Normal file
@ -0,0 +1,56 @@
|
||||
import { createApp } from 'vue';
|
||||
import { createPinia } from 'pinia';
|
||||
import piniaPersist from 'pinia-plugin-persist';
|
||||
import App from './App.vue';
|
||||
import DataTable from '~/components/DataTable';
|
||||
import DialogForm from '~/components/DialogForm';
|
||||
import Icon from '~/components/Icon.vue';
|
||||
import * as ElIcons from '@element-plus/icons-vue';
|
||||
import DictTag from '~/components/DictTag.vue'
|
||||
import Pagination from '~/components/Pagination.vue'
|
||||
|
||||
// import ElementPlus from "element-plus";
|
||||
// import "element-plus/theme-chalk/src/common/var.scss";
|
||||
|
||||
import router from './router';
|
||||
import RichText from '~/components/RichText.vue';
|
||||
import Map from '~/components/Map.vue';
|
||||
import ImageUpload from '~/components/ImageUpload.vue';
|
||||
import FileUpload from '~/components/FileUpload.vue';
|
||||
import UploadVideo from '~/components/UploadVideo.vue';
|
||||
import { guardian, topProgressBar } from './guardian';
|
||||
|
||||
async function bootstrap(): Promise<void> {
|
||||
const app = createApp(App);
|
||||
|
||||
const pinia = createPinia();
|
||||
pinia.use(piniaPersist);
|
||||
|
||||
app.use(router);
|
||||
app.use(pinia);
|
||||
|
||||
app.component('Pagination', Pagination);
|
||||
app.component('DictTag', DictTag);
|
||||
app.component('DataTable', DataTable);
|
||||
app.component('DialogForm', DialogForm);
|
||||
app.component('Icon', Icon);
|
||||
app.component('RichText', RichText);
|
||||
app.component('Map', Map);
|
||||
app.component('UploadImage', ImageUpload);
|
||||
app.component('UploadFile', FileUpload);
|
||||
app.component('UploadVideo', UploadVideo);
|
||||
|
||||
Object.keys(ElIcons).forEach((icon: string) => {
|
||||
app.component(`ElIcon${icon}`, ElIcons[icon]);
|
||||
});
|
||||
|
||||
topProgressBar();
|
||||
|
||||
guardian();
|
||||
|
||||
await router.isReady();
|
||||
|
||||
app.mount('#app');
|
||||
}
|
||||
|
||||
bootstrap();
|
||||
33
src/pages/index.vue
Normal file
33
src/pages/index.vue
Normal file
@ -0,0 +1,33 @@
|
||||
<template>
|
||||
<Index>
|
||||
|
||||
|
||||
|
||||
<router-view v-slot="{ Component, route }">
|
||||
|
||||
<transition
|
||||
:name="route.meta.transition || 'el-fade-in-linear'"
|
||||
mode="out-in"
|
||||
appear
|
||||
:duration="550"
|
||||
>
|
||||
<div :key="route.name">
|
||||
<component :is="Component" :key="route.fullPath" />
|
||||
</div>
|
||||
</transition>
|
||||
|
||||
|
||||
|
||||
</router-view>
|
||||
<!-- <router-view></router-view> -->
|
||||
</Index>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import Index from '~/layout/Index.vue';
|
||||
import { onMounted } from 'vue'
|
||||
|
||||
</script>
|
||||
<style scoped>
|
||||
|
||||
</style>
|
||||
@ -0,0 +1,142 @@
|
||||
<template>
|
||||
<el-dialog v-model="dialogVisible" title="添加轮播图" width="900px" @closed="closeDialog" @open="openDialog">
|
||||
<el-form ref="formRef" :model="formData" :rules="rules">
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="轮播图位置" prop="banner_location">
|
||||
<el-select v-model="formData.banner_location" clearable placeholder="请选择">
|
||||
<el-option v-for="item in banner_location" :key="item.dictionary_guid" :label="item.dictionary_name"
|
||||
:value="item.dictionary_value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span='12'>
|
||||
<el-form-item :label-width='labelWidth' label='轮播图' prop='banner_img'>
|
||||
<UploadImage ref='uploadRef' v-model='formData.banner_img' :data=uoloadData :limit='1' :fileSize='5'
|
||||
:drag='true' :isShowTip='false' />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="排序" prop="banner_order">
|
||||
<el-input-number v-model='formData.banner_order' controls-position='right' :min="1"></el-input-number>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button type="primary" @click="handleAddClick(formRef)">添加</el-button>
|
||||
<el-button @click="handleResetClick(formRef)">重置</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref, watch } from "vue";
|
||||
import { addBanner, getDictionary } from "~/service/banner";
|
||||
import { useLoginStore } from "~/store";
|
||||
|
||||
// --业务参数
|
||||
|
||||
|
||||
|
||||
// --业务方法
|
||||
|
||||
// 字典获取
|
||||
const banner_location = ref([]);
|
||||
async function get_banner_location() {
|
||||
await getDictionary({ dictionary_value: 'banner_location' }).then((res) => {
|
||||
banner_location.value = res
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
// --基础参数
|
||||
const store = useLoginStore();
|
||||
const headers = {
|
||||
Accept: "application/json",
|
||||
...store.headers,
|
||||
};
|
||||
|
||||
const formRef = ref();
|
||||
const labelWidth = 90;
|
||||
const props = defineProps({
|
||||
modelValue: Boolean,
|
||||
done: Function,
|
||||
});
|
||||
const emits = defineEmits(["update:modelValue"]);
|
||||
const dialogVisible = ref(props.modelValue);
|
||||
const formData = reactive({
|
||||
});
|
||||
|
||||
const uoloadData = ref({
|
||||
dirName: "Banner"
|
||||
})
|
||||
|
||||
watch(props, (v) => {
|
||||
dialogVisible.value = v.modelValue;
|
||||
});
|
||||
|
||||
const rules = reactive({
|
||||
banner_img: [
|
||||
{
|
||||
required: true,
|
||||
message: '轮播图图片不能为空'
|
||||
}
|
||||
],
|
||||
// banner_location: [
|
||||
// {
|
||||
// required: true,
|
||||
// message: '轮播图片位置(字典)不能为空'
|
||||
// }
|
||||
// ],
|
||||
|
||||
|
||||
});
|
||||
|
||||
|
||||
// --基础方法
|
||||
|
||||
// 打开弹窗时执行
|
||||
const openDialog = () => {
|
||||
get_banner_location()
|
||||
|
||||
};
|
||||
|
||||
const closeDialog = () => {
|
||||
handleResetClick(formRef.value);
|
||||
dialogVisible.value = false;
|
||||
emits("update:modelValue", false);
|
||||
};
|
||||
|
||||
const handleAddClick = async (formEl) => {
|
||||
console.log(formData);
|
||||
if (!formEl) return;
|
||||
formEl.validate(async (valid) => {
|
||||
if (!valid) {
|
||||
return;
|
||||
}
|
||||
|
||||
const { code } = await addBanner(formData);
|
||||
if (code == 0) {
|
||||
closeDialog();
|
||||
props.done();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const handleResetClick = async (formEl) => {
|
||||
if (!formEl) return;
|
||||
formEl.resetFields();
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped></style>
|
||||
@ -0,0 +1,88 @@
|
||||
<template>
|
||||
<el-dialog v-model="props.modelValue" title="轮播图详情" width="900px" @closed="closeDialog" @open="openDialog">
|
||||
<el-form ref="formRef" :model="formData" :disabled="true">
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="轮播图位置" prop="banner_location">
|
||||
<el-select v-model="formData.banner_location" clearable placeholder="请选择">
|
||||
<el-option v-for="item in banner_location" :key="item.dictionary_guid" :label="item.dictionary_name"
|
||||
:value="item.dictionary_value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span='12'>
|
||||
<el-form-item :label-width='labelWidth' label='轮播图' prop='banner_img'>
|
||||
<UploadImage ref='uploadRef' v-model='formData.banner_img' :data=uoloadData :limit='1' :fileSize='5'
|
||||
:drag='true' :isShowTip='false' />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="排序" prop="banner_order">
|
||||
<el-input-number v-model='formData.banner_order' controls-position='right'></el-input-number>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref, watch } from "vue";
|
||||
import { isEmptyObject } from "~/utils/index";
|
||||
import { getDictionary } from '~/service/banner';
|
||||
|
||||
// --业务参数
|
||||
|
||||
|
||||
|
||||
// --业务方法
|
||||
|
||||
// 字典获取
|
||||
const banner_location = ref([]);
|
||||
async function get_banner_location() {
|
||||
await getDictionary({ dictionary_value: 'banner_location' }).then((res) => {
|
||||
banner_location.value = res
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
// --基础参数
|
||||
const formRef = ref();
|
||||
const labelWidth = 100;
|
||||
|
||||
const props = defineProps({
|
||||
modelValue: Boolean,
|
||||
data: Object,
|
||||
done: Function,
|
||||
});
|
||||
const emits = defineEmits(["update:modelValue"]);
|
||||
const formData = ref({
|
||||
...props.data,
|
||||
});
|
||||
|
||||
|
||||
// --基础方法
|
||||
watch(props, (v) => {
|
||||
formData.value = v.data;
|
||||
|
||||
|
||||
});
|
||||
|
||||
// 打开弹窗时执行
|
||||
const openDialog = () => {
|
||||
|
||||
get_banner_location()
|
||||
|
||||
};
|
||||
|
||||
const closeDialog = () => {
|
||||
emits("update:modelValue", false);
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped></style>
|
||||
@ -0,0 +1,144 @@
|
||||
<template>
|
||||
<el-dialog v-model="props.modelValue" title="编辑轮播图" width="900px" @closed="closeDialog" @open="openDialog">
|
||||
<el-form ref="formRef" :model="formData" :rules="rules">
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="轮播图位置" prop="banner_location">
|
||||
<el-select v-model="formData.banner_location" clearable placeholder="请选择">
|
||||
<el-option v-for="item in banner_location" :key="item.dictionary_guid" :label="item.dictionary_name"
|
||||
:value="item.dictionary_value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span='12'>
|
||||
<el-form-item :label-width='labelWidth' label='轮播图' prop='banner_img'>
|
||||
<UploadImage ref='uploadRef' v-model='formData.banner_img' :data=uoloadData :limit='1' :fileSize='5'
|
||||
:drag='true' :isShowTip='false' />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="排序" prop="banner_order">
|
||||
<el-input-number v-model='formData.banner_order' controls-position='right' :min="1"></el-input-number>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button type="primary" @click="handleEditClick(formRef)">编辑</el-button>
|
||||
<el-button @click="handleResetClick(formRef)">重置</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref, watch } from "vue";
|
||||
import { editBanner, getDictionary } from "~/service/banner";
|
||||
import { useLoginStore } from "~/store";
|
||||
|
||||
// --业务参数
|
||||
|
||||
|
||||
|
||||
// --业务方法
|
||||
|
||||
// 字典获取
|
||||
const banner_location = ref([]);
|
||||
async function get_banner_location() {
|
||||
await getDictionary({ dictionary_value: 'banner_location' }).then((res) => {
|
||||
banner_location.value = res
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
// --基础参数
|
||||
const store = useLoginStore();
|
||||
const headers = {
|
||||
Accept: "application/json",
|
||||
...store.headers,
|
||||
};
|
||||
const formRef = ref();
|
||||
const labelWidth = 100;
|
||||
const props = defineProps({
|
||||
modelValue: Boolean,
|
||||
data: Object,
|
||||
done: Function,
|
||||
});
|
||||
const emits = defineEmits(["update:modelValue"]);
|
||||
const formData = ref({
|
||||
...props.data,
|
||||
});
|
||||
const uoloadData = ref({
|
||||
dirName: "Banner"
|
||||
})
|
||||
|
||||
|
||||
// --基础方法
|
||||
watch(props, (v) => {
|
||||
formData.value = v.data;
|
||||
|
||||
|
||||
});
|
||||
|
||||
// 打开弹窗时执行
|
||||
const openDialog = () => {
|
||||
get_banner_location()
|
||||
|
||||
};
|
||||
|
||||
const closeDialog = () => {
|
||||
props.done();
|
||||
emits("update:modelValue", false);
|
||||
};
|
||||
|
||||
const rules = reactive({
|
||||
// banner_img: [
|
||||
// {
|
||||
// required: true,
|
||||
// message: '轮播图图片不能为空'
|
||||
// }
|
||||
// ],
|
||||
banner_location: [
|
||||
{
|
||||
required: true,
|
||||
message: '轮播图片位置(字典)不能为空'
|
||||
}
|
||||
],
|
||||
banner_order: [
|
||||
{
|
||||
required: true,
|
||||
message: '排序不能为空'
|
||||
}
|
||||
],
|
||||
|
||||
});
|
||||
|
||||
const handleEditClick = async (formEl) => {
|
||||
console.log(formData.value);
|
||||
if (!formEl) return;
|
||||
formEl.validate(async (valid) => {
|
||||
if (!valid) {
|
||||
return;
|
||||
}
|
||||
|
||||
const { code } = await editBanner(formData.value);
|
||||
if (code == 0) {
|
||||
closeDialog();
|
||||
props.done();
|
||||
}
|
||||
});
|
||||
};
|
||||
const handleResetClick = async (formEl) => {
|
||||
if (!formEl) return;
|
||||
formEl.resetFields();
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped></style>
|
||||
212
src/pages/index/business/banners/banner/index.vue
Normal file
212
src/pages/index/business/banners/banner/index.vue
Normal file
@ -0,0 +1,212 @@
|
||||
<template>
|
||||
<!-- 面包屑 -->
|
||||
<el-breadcrumb>
|
||||
<el-breadcrumb-item>轮播图管理</el-breadcrumb-item>
|
||||
<el-breadcrumb-item to="/banner/list">轮播图列表</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
<!-- 搜索 -->
|
||||
<el-form inline :model="params">
|
||||
<el-form-item label="轮播图位置">
|
||||
<el-select v-model="params.banner_location" clearable placeholder="请选择">
|
||||
<el-option v-for="item in banner_location" :key="item.dictionary_guid" :label="item.dictionary_name"
|
||||
:value="item.dictionary_value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="tableRef.reload()" icon="ElIconSearch">
|
||||
搜索
|
||||
</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-space style="margin-bottom: 10px;">
|
||||
<!-- 添加轮播图 -->
|
||||
<el-col :span="1">
|
||||
<el-button type="primary" @click="addBannerDialogVisible = true"> 添加 </el-button>
|
||||
</el-col>
|
||||
<!-- 下拉操作 -->
|
||||
<el-dropdown v-if="selectionData.length">
|
||||
<el-button type="primary">
|
||||
批量操作<el-icon class="el-icon--right"><arrow-down /></el-icon>
|
||||
</el-button>
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu>
|
||||
<el-dropdown-item @click="handleDelete(selectionData)">
|
||||
批量删除
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
</el-space>
|
||||
<!-- 数据表格 -->
|
||||
<DataTable v-loading="loading" ref="tableRef" style="width: 100%" :onSelectionChange="data => (selectionData = data)" :column="column"
|
||||
:params="params" :request="params => getBannerList(params)">
|
||||
<!-- 排序 -->
|
||||
<template #banner_order="scope">
|
||||
<el-input-number :disabled="loading" v-model='scope.row.banner_order' controls-position="right"
|
||||
@change="handleEditOrder(scope.row)" :min="1"></el-input-number>
|
||||
</template>
|
||||
<!-- 图片 -->
|
||||
<template #banner_img="scope">
|
||||
<el-image v-if="scope.row.banner_img" :src="scope.row.banner_img.split(',')[0]" lazy
|
||||
:preview-src-list="scope.row.banner_img.split(',')" :preview-teleported="true" :hide-on-click-modal="true"
|
||||
fit="contain" class="el-avatar"></el-image>
|
||||
<template v-else>暂无图片</template>
|
||||
</template>
|
||||
|
||||
<template #banner_location='scope'>
|
||||
<dict-tag :options='banner_location' :value='scope.row.banner_location' />
|
||||
</template>
|
||||
|
||||
<template #chaoz="scope">
|
||||
<el-space>
|
||||
<el-button size="small" @click="handleUpdate(scope.row)">
|
||||
编辑
|
||||
</el-button>
|
||||
<el-dropdown @command="handleCommand">
|
||||
<el-button type="primary" size="small">
|
||||
更多<el-icon class="el-icon--right"><arrow-down /></el-icon>
|
||||
</el-button>
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu>
|
||||
<el-dropdown-item :command="{ type: 'detail', row: scope.row }">
|
||||
详情
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item :command="{ type: 'delete', row: scope.row }">
|
||||
删除
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
</el-space>
|
||||
</template>
|
||||
</DataTable>
|
||||
|
||||
<!-- 添加轮播图 -->
|
||||
<AddBannerDialog v-model="addBannerDialogVisible" :done="() => tableRef.reload()"></AddBannerDialog>
|
||||
<!-- 编辑轮播图 -->
|
||||
<EditBannerDialog v-model="EditBannerDialogVisible" :data="EditBannerDialogRow" :done="() => tableRef.reload()">
|
||||
</EditBannerDialog>
|
||||
<!-- 轮播图详情 -->
|
||||
<DetailBannerDialog v-model="DetailBannerDialogVisible" :data="DetailBannerDialogRow"></DetailBannerDialog>
|
||||
</template>
|
||||
<script setup>
|
||||
import { ArrowDown } from '@element-plus/icons-vue';
|
||||
import { ref, reactive, watch } from 'vue';
|
||||
import { useLoginStore } from "~/store";
|
||||
import { getBannerList, editBanner, deleteBanner, getDictionary } from '~/service/banner';
|
||||
import AddBannerDialog from './components/AddBannerDialog.vue';
|
||||
import EditBannerDialog from './components/EditBannerDialog.vue';
|
||||
import DetailBannerDialog from './components/DetailBannerDialog.vue';
|
||||
|
||||
const tableRef = ref();
|
||||
const selectionData = ref([]);
|
||||
const store = useLoginStore();
|
||||
|
||||
const addBannerDialogVisible = ref(false);
|
||||
const EditBannerDialogVisible = ref(false);
|
||||
const EditBannerDialogRow = ref({});
|
||||
const DetailBannerDialogVisible = ref(false);
|
||||
const DetailBannerDialogRow = ref({});
|
||||
const loading = ref(false)
|
||||
|
||||
const headers = {
|
||||
Accept: "application/json",
|
||||
...store.headers,
|
||||
};
|
||||
|
||||
// 查询参数
|
||||
const params = reactive({
|
||||
banner_location: "",
|
||||
|
||||
});
|
||||
const column = [
|
||||
|
||||
{
|
||||
fixed: true,
|
||||
type: 'selection'
|
||||
},
|
||||
{
|
||||
prop: "banner_location",
|
||||
label: '轮播图位置',
|
||||
width: '150'
|
||||
},
|
||||
{
|
||||
prop: "banner_img",
|
||||
label: '轮播图图片',
|
||||
width: '150'
|
||||
},
|
||||
// {
|
||||
// prop: "banner_location",
|
||||
// label: '轮播图位置',
|
||||
// width: '150'
|
||||
// },
|
||||
{
|
||||
prop: "banner_order",
|
||||
label: '排序',
|
||||
width: '200'
|
||||
},
|
||||
{
|
||||
label: '操作',
|
||||
prop: 'chaoz',
|
||||
width: '250',
|
||||
fixed: 'right'
|
||||
}
|
||||
];
|
||||
|
||||
|
||||
const handleCommand = ({ type, row }) => {
|
||||
switch (type) {
|
||||
case "detail":
|
||||
handleDetail(row);
|
||||
break;
|
||||
case 'delete':
|
||||
handleDelete([row]);
|
||||
break;
|
||||
}
|
||||
};
|
||||
|
||||
// 删除数据
|
||||
const handleDelete = data => {
|
||||
ElMessageBox.confirm(`您确定要删除该轮播图吗？`).then(async () => {
|
||||
const res = await deleteBanner({
|
||||
banner_guid: data.map(v => v.banner_guid).join()
|
||||
});
|
||||
if (res) {
|
||||
tableRef.value.reload();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
//排序
|
||||
async function handleEditOrder(data) {
|
||||
loading.value = true
|
||||
const { code, msg } = await editBanner(data);
|
||||
if (code == 0) {
|
||||
loading.value = false
|
||||
tableRef.value.reload()
|
||||
} else {
|
||||
ElMessage.error(msg);
|
||||
}
|
||||
}
|
||||
|
||||
// 修改
|
||||
function handleUpdate(row) {
|
||||
EditBannerDialogVisible.value = true
|
||||
EditBannerDialogRow.value = row
|
||||
}
|
||||
|
||||
// 详情
|
||||
function handleDetail(row) {
|
||||
DetailBannerDialogVisible.value = true
|
||||
DetailBannerDialogRow.value = row
|
||||
}
|
||||
|
||||
// 字典获取
|
||||
const banner_location = ref([]);
|
||||
async function get_banner_location() {
|
||||
await getDictionary({ dictionary_value: 'banner_location' }).then((res) => {
|
||||
banner_location.value = res
|
||||
})
|
||||
}
|
||||
get_banner_location()
|
||||
</script>
|
||||
@ -0,0 +1,152 @@
|
||||
<template>
|
||||
<el-dialog v-model="dialogVisible" title="添加海报" width="900px" @closed="closeDialog" @open="openDialog">
|
||||
<el-form ref="formRef" :model="formData" :rules="rules">
|
||||
<el-row>
|
||||
|
||||
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width='labelWidth' label="位置" prop="poster_location">
|
||||
<el-select v-model="formData.poster_location" clearable placeholder="请选择">
|
||||
<el-option v-for="item in poster_location" :key="item.dictionary_guid" :label="item.dictionary_name"
|
||||
:value="item.dictionary_value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span='24'>
|
||||
<el-form-item :label-width='labelWidth' label='图片' prop='poster_img'>
|
||||
<UploadImage ref='uploadRef' v-model='formData.poster_img' :data=uoloadData :limit='1' :fileSize='20'
|
||||
:drag='true' :isShowTip='false' />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="标题" prop="poster_title">
|
||||
<el-input v-model='formData.poster_title' type="text" placeholder='请输入标题'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="描述" prop="poster_describe">
|
||||
<el-input v-model='formData.poster_describe' type="text" placeholder='请输入描述'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="排序" prop="poster_sort">
|
||||
<el-input-number v-model='formData.poster_sort' controls-position='right' :min="1"></el-input-number>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
</el-row>
|
||||
</el-form>
|
||||
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button type="primary" @click="handleAddClick(formRef)">添加</el-button>
|
||||
<el-button @click="handleResetClick(formRef)">重置</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref, watch } from "vue";
|
||||
import { addPoster, getDictionary } from "~/service/poster";
|
||||
import { useLoginStore } from "~/store";
|
||||
|
||||
// --业务参数
|
||||
|
||||
|
||||
|
||||
// --业务方法
|
||||
|
||||
// 字典获取
|
||||
const poster_location = ref([]);
|
||||
async function get_poster_location() {
|
||||
await getDictionary({ dictionary_value: 'poster_location' }).then((res) => {
|
||||
poster_location.value = res
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
// --基础参数
|
||||
const store = useLoginStore();
|
||||
const headers = {
|
||||
Accept: "application/json",
|
||||
...store.headers,
|
||||
};
|
||||
|
||||
const formRef = ref();
|
||||
const labelWidth = 90;
|
||||
const props = defineProps({
|
||||
modelValue: Boolean,
|
||||
done: Function,
|
||||
});
|
||||
const emits = defineEmits(["update:modelValue"]);
|
||||
const dialogVisible = ref(props.modelValue);
|
||||
const formData = reactive({
|
||||
// poster_sort: 1
|
||||
});
|
||||
|
||||
const uoloadData = ref({
|
||||
dirName: "Poster"
|
||||
})
|
||||
|
||||
watch(props, (v) => {
|
||||
dialogVisible.value = v.modelValue;
|
||||
});
|
||||
|
||||
const rules = reactive({
|
||||
poster_location: [
|
||||
{
|
||||
required: true,
|
||||
message: '位置不能为空'
|
||||
}
|
||||
],
|
||||
poster_img: [
|
||||
{
|
||||
required: true,
|
||||
message: '图片不能为空'
|
||||
}
|
||||
],
|
||||
|
||||
});
|
||||
|
||||
|
||||
// --基础方法
|
||||
|
||||
// 打开弹窗时执行
|
||||
const openDialog = () => {
|
||||
get_poster_location()
|
||||
|
||||
};
|
||||
|
||||
const closeDialog = () => {
|
||||
handleResetClick(formRef.value);
|
||||
dialogVisible.value = false;
|
||||
emits("update:modelValue", false);
|
||||
};
|
||||
|
||||
const handleAddClick = async (formEl) => {
|
||||
console.log(formData);
|
||||
if (!formEl) return;
|
||||
formEl.validate(async (valid) => {
|
||||
if (!valid) {
|
||||
return;
|
||||
}
|
||||
|
||||
const { code } = await addPoster(formData);
|
||||
if (code == 0) {
|
||||
closeDialog();
|
||||
props.done();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const handleResetClick = async (formEl) => {
|
||||
if (!formEl) return;
|
||||
formEl.resetFields();
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped></style>
|
||||
@ -0,0 +1,98 @@
|
||||
<template>
|
||||
<el-dialog v-model="props.modelValue" title="海报详情" width="900px" @closed="closeDialog" @open="openDialog">
|
||||
<el-form ref="formRef" :model="formData" :disabled="true">
|
||||
<el-row>
|
||||
|
||||
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width='labelWidth' label="位置" prop="poster_location">
|
||||
<el-select v-model="formData.poster_location" clearable placeholder="请选择">
|
||||
<el-option v-for="item in poster_location" :key="item.dictionary_guid" :label="item.dictionary_name"
|
||||
:value="item.dictionary_value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span='24'>
|
||||
<el-form-item :label-width='labelWidth' label='图片' prop='poster_img'>
|
||||
<UploadImage ref='uploadRef' v-model='formData.poster_img' :data=uoloadData :limit='1' :fileSize='5'
|
||||
:drag='true' :isShowTip='false' />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="标题" prop="poster_title">
|
||||
<el-input v-model='formData.poster_title' type="text" placeholder='请输入标题'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="描述" prop="poster_describe">
|
||||
<el-input v-model='formData.poster_describe' type="text" placeholder='请输入描述'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="排序" prop="poster_sort">
|
||||
<el-input-number v-model='formData.poster_sort' controls-position='right'></el-input-number>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
</el-row>
|
||||
</el-form>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref, watch } from "vue";
|
||||
import { isEmptyObject } from "~/utils/index";
|
||||
import { getDictionary } from '~/service/poster';
|
||||
|
||||
// --业务参数
|
||||
|
||||
|
||||
|
||||
// --业务方法
|
||||
|
||||
// 字典获取
|
||||
const poster_location = ref([]);
|
||||
async function get_poster_location() {
|
||||
await getDictionary({ dictionary_value: 'poster_location' }).then((res) => {
|
||||
poster_location.value = res
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
// --基础参数
|
||||
const formRef = ref();
|
||||
const labelWidth = 100;
|
||||
|
||||
const props = defineProps({
|
||||
modelValue: Boolean,
|
||||
data: Object,
|
||||
done: Function,
|
||||
});
|
||||
const emits = defineEmits(["update:modelValue"]);
|
||||
const formData = ref({
|
||||
...props.data,
|
||||
});
|
||||
|
||||
|
||||
// --基础方法
|
||||
watch(props, (v) => {
|
||||
formData.value = v.data;
|
||||
|
||||
|
||||
});
|
||||
|
||||
// 打开弹窗时执行
|
||||
const openDialog = () => {
|
||||
|
||||
get_poster_location()
|
||||
|
||||
};
|
||||
|
||||
const closeDialog = () => {
|
||||
emits("update:modelValue", false);
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped></style>
|
||||
@ -0,0 +1,154 @@
|
||||
<template>
|
||||
<el-dialog v-model="props.modelValue" title="编辑海报" width="900px" @closed="closeDialog" @open="openDialog">
|
||||
<el-form ref="formRef" :model="formData" :rules="rules">
|
||||
<el-row>
|
||||
|
||||
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width='labelWidth' label="位置" prop="poster_location">
|
||||
<el-select disabled v-model="formData.poster_location" clearable placeholder="请选择">
|
||||
<el-option v-for="item in poster_location" :key="item.dictionary_guid" :label="item.dictionary_name"
|
||||
:value="item.dictionary_value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span='24'>
|
||||
<el-form-item :label-width='labelWidth' label='图片' prop='poster_img'>
|
||||
<UploadImage ref='uploadRef' v-model='formData.poster_img' :data=uoloadData :limit='1' :fileSize='20'
|
||||
:drag='true' :isShowTip='false' />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="标题" prop="poster_title">
|
||||
<el-input v-model='formData.poster_title' type="text" placeholder='请输入标题'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="描述" prop="poster_describe">
|
||||
<el-input v-model='formData.poster_describe' type="text" placeholder='请输入描述'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="排序" prop="poster_sort">
|
||||
<el-input-number v-model='formData.poster_sort' controls-position='right' :min="1"></el-input-number>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
</el-row>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button type="primary" @click="handleEditClick(formRef)">编辑</el-button>
|
||||
<el-button @click="handleResetClick(formRef)">重置</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref, watch } from "vue";
|
||||
import { editPoster, getDictionary } from "~/service/poster";
|
||||
import { useLoginStore } from "~/store";
|
||||
|
||||
// --业务参数
|
||||
|
||||
|
||||
|
||||
// --业务方法
|
||||
|
||||
// 字典获取
|
||||
const poster_location = ref([]);
|
||||
async function get_poster_location() {
|
||||
await getDictionary({ dictionary_value: 'poster_location' }).then((res) => {
|
||||
poster_location.value = res
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
// --基础参数
|
||||
const store = useLoginStore();
|
||||
const headers = {
|
||||
Accept: "application/json",
|
||||
...store.headers,
|
||||
};
|
||||
const formRef = ref();
|
||||
const labelWidth = 100;
|
||||
const props = defineProps({
|
||||
modelValue: Boolean,
|
||||
data: Object,
|
||||
done: Function,
|
||||
});
|
||||
const emits = defineEmits(["update:modelValue"]);
|
||||
const formData = ref({
|
||||
...props.data,
|
||||
});
|
||||
const uoloadData = ref({
|
||||
dirName: "Poster"
|
||||
})
|
||||
|
||||
|
||||
// --基础方法
|
||||
watch(props, (v) => {
|
||||
formData.value = v.data;
|
||||
|
||||
|
||||
});
|
||||
|
||||
// 打开弹窗时执行
|
||||
const openDialog = () => {
|
||||
get_poster_location()
|
||||
|
||||
};
|
||||
|
||||
const closeDialog = () => {
|
||||
props.done();
|
||||
emits("update:modelValue", false);
|
||||
};
|
||||
|
||||
const rules = reactive({
|
||||
poster_location: [
|
||||
{
|
||||
required: true,
|
||||
message: '位置不能为空'
|
||||
}
|
||||
],
|
||||
poster_img: [
|
||||
{
|
||||
required: true,
|
||||
message: '图片不能为空'
|
||||
}
|
||||
],
|
||||
poster_sort: [
|
||||
{
|
||||
required: true,
|
||||
message: '排序不能为空'
|
||||
}
|
||||
],
|
||||
|
||||
});
|
||||
|
||||
const handleEditClick = async (formEl) => {
|
||||
console.log(formData.value);
|
||||
if (!formEl) return;
|
||||
formEl.validate(async (valid) => {
|
||||
if (!valid) {
|
||||
return;
|
||||
}
|
||||
|
||||
const { code } = await editPoster(formData.value);
|
||||
if (code == 0) {
|
||||
closeDialog();
|
||||
props.done();
|
||||
}
|
||||
});
|
||||
};
|
||||
const handleResetClick = async (formEl) => {
|
||||
if (!formEl) return;
|
||||
formEl.resetFields();
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped></style>
|
||||
221
src/pages/index/business/banners/poster/index.vue
Normal file
221
src/pages/index/business/banners/poster/index.vue
Normal file
@ -0,0 +1,221 @@
|
||||
<template>
|
||||
<!-- 面包屑 -->
|
||||
<el-breadcrumb>
|
||||
<el-breadcrumb-item>海报管理</el-breadcrumb-item>
|
||||
<el-breadcrumb-item to="/poster/list">海报列表</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
<!-- 搜索 -->
|
||||
<el-form inline :model="params">
|
||||
|
||||
<el-form-item :label-width='labelWidth' label="位置" prop="poster_location">
|
||||
<el-select v-model="params.poster_location" clearable placeholder="请选择">
|
||||
<el-option v-for="item in poster_location" :key="item.dictionary_guid" :label="item.dictionary_name"
|
||||
:value="item.dictionary_value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="tableRef.reload()" icon="ElIconSearch">
|
||||
搜索
|
||||
</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-space style="margin-bottom: 10px;">
|
||||
<!-- 添加海报 -->
|
||||
<el-col :span="1">
|
||||
<el-button type="primary" @click="addPosterDialogVisible = true"> 添加 </el-button>
|
||||
</el-col>
|
||||
|
||||
|
||||
|
||||
<!-- 下拉操作 -->
|
||||
<el-dropdown v-if="selectionData.length">
|
||||
<el-button type="primary">
|
||||
批量操作<el-icon class="el-icon--right"><arrow-down /></el-icon>
|
||||
</el-button>
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu>
|
||||
<el-dropdown-item @click="handleDelete(selectionData)">
|
||||
批量删除
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
</el-space>
|
||||
<!-- 数据表格 -->
|
||||
<DataTable ref="tableRef" style="width: 100%" :onSelectionChange="data => (selectionData = data)" :column="column"
|
||||
:params="params" :request="params => getPosterList(params)">
|
||||
|
||||
<template #poster_img="scope">
|
||||
<el-image v-if="scope.row.poster_img" :src="scope.row.poster_img.split(',')[0]" lazy
|
||||
:preview-src-list="scope.row.poster_img.split(',')" :preview-teleported="true" :hide-on-click-modal="true"
|
||||
fit="contain" class="el-avatar"></el-image>
|
||||
<template v-else>暂无图片</template>
|
||||
</template>
|
||||
|
||||
<!-- 排序 -->
|
||||
<template #poster_sort="scope">
|
||||
<el-input-number :disabled="loading" v-model='scope.row.poster_sort' controls-position="right"
|
||||
@change="handleEditOrder(scope.row)"></el-input-number>
|
||||
</template>
|
||||
|
||||
<template #poster_location='scope'>
|
||||
<dict-tag :options='poster_location' :value='scope.row.poster_location' />
|
||||
</template>
|
||||
|
||||
<template #chaoz="scope">
|
||||
<el-space>
|
||||
<el-button size="small" @click="handleUpdate(scope.row)">
|
||||
编辑
|
||||
</el-button>
|
||||
<el-dropdown @command="handleCommand">
|
||||
<el-button type="primary" size="small">
|
||||
更多<el-icon class="el-icon--right"><arrow-down /></el-icon>
|
||||
</el-button>
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu>
|
||||
<el-dropdown-item :command="{ type: 'detail', row: scope.row }">
|
||||
详情
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item :command="{ type: 'delete', row: scope.row }">
|
||||
删除
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
</el-space>
|
||||
</template>
|
||||
</DataTable>
|
||||
|
||||
<!-- 添加海报 -->
|
||||
<AddPosterDialog v-model="addPosterDialogVisible" :done="() => tableRef.reload()"></AddPosterDialog>
|
||||
<!-- 编辑海报 -->
|
||||
<EditPosterDialog v-model="EditPosterDialogVisible" :data="EditPosterDialogRow" :done="() => tableRef.reload()">
|
||||
</EditPosterDialog>
|
||||
<!-- 海报详情 -->
|
||||
<DetailPosterDialog v-model="DetailPosterDialogVisible" :data="DetailPosterDialogRow"></DetailPosterDialog>
|
||||
</template>
|
||||
<script setup>
|
||||
import { ArrowDown } from '@element-plus/icons-vue';
|
||||
import { ref, reactive, watch } from 'vue';
|
||||
import { useLoginStore } from "~/store";
|
||||
import { getPosterList, deletePoster, getDictionary,editPoster } from '~/service/poster';
|
||||
import AddPosterDialog from './components/AddPosterDialog.vue';
|
||||
import EditPosterDialog from './components/EditPosterDialog.vue';
|
||||
import DetailPosterDialog from './components/DetailPosterDialog.vue';
|
||||
|
||||
const tableRef = ref();
|
||||
const selectionData = ref([]);
|
||||
const store = useLoginStore();
|
||||
|
||||
const addPosterDialogVisible = ref(false);
|
||||
const EditPosterDialogVisible = ref(false);
|
||||
const EditPosterDialogRow = ref({});
|
||||
const DetailPosterDialogVisible = ref(false);
|
||||
const DetailPosterDialogRow = ref({});
|
||||
|
||||
const headers = {
|
||||
Accept: "application/json",
|
||||
...store.headers,
|
||||
};
|
||||
|
||||
// 查询参数
|
||||
const params = reactive({
|
||||
poster_location: ""
|
||||
});
|
||||
const column = [
|
||||
|
||||
{
|
||||
fixed: true,
|
||||
type: 'selection'
|
||||
},
|
||||
{
|
||||
prop: "poster_location",
|
||||
label: '位置',
|
||||
width: '150'
|
||||
},
|
||||
{
|
||||
prop: "poster_img",
|
||||
label: '图片',
|
||||
width: '150'
|
||||
},
|
||||
// {
|
||||
// prop: "poster_title",
|
||||
// label: '标题',
|
||||
// width: '200'
|
||||
// },
|
||||
// {
|
||||
// prop: "poster_describe",
|
||||
// label: '描述',
|
||||
// width: '250'
|
||||
// },
|
||||
{
|
||||
prop: "poster_sort",
|
||||
label: '排序',
|
||||
width: '200'
|
||||
},
|
||||
{
|
||||
label: '操作',
|
||||
prop: 'chaoz',
|
||||
width: '250',
|
||||
fixed: 'right'
|
||||
}
|
||||
];
|
||||
|
||||
|
||||
const handleCommand = ({ type, row }) => {
|
||||
switch (type) {
|
||||
case "detail":
|
||||
handleDetail(row);
|
||||
break;
|
||||
case 'delete':
|
||||
handleDelete([row]);
|
||||
break;
|
||||
}
|
||||
};
|
||||
|
||||
// 删除数据
|
||||
const handleDelete = data => {
|
||||
ElMessageBox.confirm(`您确定要删除该海报吗？`).then(async () => {
|
||||
const res = await deletePoster({
|
||||
poster_guid: data.map(v => v.poster_guid).join()
|
||||
});
|
||||
if (res) {
|
||||
tableRef.value.reload();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
// 修改
|
||||
function handleUpdate(row) {
|
||||
EditPosterDialogVisible.value = true
|
||||
EditPosterDialogRow.value = row
|
||||
}
|
||||
|
||||
// 详情
|
||||
function handleDetail(row) {
|
||||
DetailPosterDialogVisible.value = true
|
||||
DetailPosterDialogRow.value = row
|
||||
}
|
||||
|
||||
//排序
|
||||
const loading = ref(false)
|
||||
async function handleEditOrder(data) {
|
||||
loading.value = true
|
||||
const { code, msg } = await editPoster(data);
|
||||
if (code == 0) {
|
||||
loading.value = false
|
||||
tableRef.value.reload()
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
// 字典获取
|
||||
const poster_location = ref([]);
|
||||
async function get_poster_location() {
|
||||
await getDictionary({ dictionary_value: 'poster_location' }).then((res) => {
|
||||
poster_location.value = res
|
||||
})
|
||||
}
|
||||
get_poster_location()
|
||||
</script>
|
||||
205
src/pages/index/business/news/components/AddNewsDialog.vue
Normal file
205
src/pages/index/business/news/components/AddNewsDialog.vue
Normal file
@ -0,0 +1,205 @@
|
||||
<template>
|
||||
<el-dialog v-model="dialogVisible" title="添加新闻" width="900px" @closed="closeDialog" @open="openDialog">
|
||||
<el-form ref="formRef" :model="formData" :rules="rules">
|
||||
<el-row>
|
||||
|
||||
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="新闻类型" prop="news_type">
|
||||
<el-select v-model="formData.news_type" clearable placeholder="请选择">
|
||||
<el-option v-for="item in news_type" :key="item.dictionary_guid" :label="item.dictionary_name"
|
||||
:value="item.dictionary_value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item :label-width="labelWidth" label="新闻标题" prop="news_title">
|
||||
<el-input v-model='formData.news_title' type="text" placeholder='请输入新闻标题'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span='24'>
|
||||
<el-form-item :label-width='labelWidth' label='新闻封面' prop='news_cover'>
|
||||
<UploadImage ref='uploadRef' v-model='formData.news_cover' :data=uoloadData :limit='1' :fileSize='5'
|
||||
:drag='true' :isShowTip='false' />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item :label-width="labelWidth" label="新闻简介" prop="news_intro">
|
||||
<el-input v-model='formData.news_intro' type="textarea" :rows="5" placeholder='请输入新闻简介'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="文章来源" prop="news_source">
|
||||
<el-input v-model='formData.news_source' type="text" placeholder='请输入文章来源'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="跳转链接" prop="news_link">
|
||||
<el-input v-model='formData.news_link' type="text" placeholder='请输入跳转链接'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="发布日期" prop="news_issue_date">
|
||||
<el-date-picker v-model="formData.news_issue_date" type="date" value-format="YYYY-MM-DD" placeholder="发布日期" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="浏览次数" prop="news_views_num">
|
||||
<el-input-number v-model='formData.news_views_num' controls-position='right' :min='0'></el-input-number>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="新闻排序" prop="news_sort">
|
||||
<el-input-number v-model='formData.news_sort' controls-position='right' :min='1'></el-input-number>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item :label-width="labelWidth" label="新闻内容" prop="news_content">
|
||||
<div class="copy-btn-box">
|
||||
<el-button @click="handleCopyRichText" class="copy-btn">获取富文本内容</el-button>
|
||||
</div>
|
||||
<RichText v-model='formData.news_content' :min-height='196'></RichText>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
</el-row>
|
||||
</el-form>
|
||||
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button type="primary" @click="handleAddClick(formRef)">添加</el-button>
|
||||
<el-button @click="handleResetClick(formRef)">重置</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref, watch } from "vue";
|
||||
import { addNews, getDictionary } from "~/service/news";
|
||||
import { useLoginStore } from "~/store";
|
||||
import { ElMessage } from "element-plus";
|
||||
|
||||
// --业务参数
|
||||
|
||||
|
||||
|
||||
// --业务方法
|
||||
|
||||
// 字典获取
|
||||
const news_type = ref([]);
|
||||
async function get_news_type() {
|
||||
await getDictionary({ dictionary_value: 'news_type' }).then((res) => {
|
||||
news_type.value = res
|
||||
})
|
||||
}
|
||||
|
||||
// 复制富文本内容
|
||||
async function handleCopyRichText() {
|
||||
let text = await navigator.clipboard.writeText(formData.news_content);
|
||||
ElMessage.success("富文本内容复制成功")
|
||||
}
|
||||
|
||||
|
||||
|
||||
// --基础参数
|
||||
const store = useLoginStore();
|
||||
const headers = {
|
||||
Accept: "application/json",
|
||||
...store.headers,
|
||||
};
|
||||
|
||||
const isBtnLod = ref(false);
|
||||
const formRef = ref();
|
||||
const labelWidth = 90;
|
||||
const props = defineProps({
|
||||
modelValue: Boolean,
|
||||
done: Function,
|
||||
});
|
||||
const emits = defineEmits(["update:modelValue"]);
|
||||
const dialogVisible = ref(props.modelValue);
|
||||
const formData = reactive({});
|
||||
|
||||
const uoloadData = ref({
|
||||
dirName: "News"
|
||||
})
|
||||
|
||||
watch(props, (v) => {
|
||||
dialogVisible.value = v.modelValue;
|
||||
});
|
||||
|
||||
const rules = reactive({
|
||||
news_type: [
|
||||
{
|
||||
required: true,
|
||||
message: '新闻类型不能为空'
|
||||
}
|
||||
],
|
||||
news_title: [
|
||||
{
|
||||
required: true,
|
||||
message: '新闻标题不能为空'
|
||||
}
|
||||
],
|
||||
news_cover: [
|
||||
{
|
||||
required: true,
|
||||
message: '新闻封面不能为空'
|
||||
}
|
||||
],
|
||||
news_sort: [
|
||||
{
|
||||
required: true,
|
||||
message: '新闻排序不能为空'
|
||||
}
|
||||
],
|
||||
|
||||
});
|
||||
|
||||
|
||||
// --基础方法
|
||||
|
||||
// 打开弹窗时执行
|
||||
const openDialog = () => {
|
||||
get_news_type()
|
||||
|
||||
};
|
||||
|
||||
const closeDialog = () => {
|
||||
handleResetClick(formRef.value);
|
||||
dialogVisible.value = false;
|
||||
emits("update:modelValue", false);
|
||||
};
|
||||
|
||||
const handleAddClick = async (formEl) => {
|
||||
if (!formEl) return;
|
||||
formEl.validate(async (valid) => {
|
||||
if (!valid) {
|
||||
return;
|
||||
}
|
||||
isBtnLod.value = true;
|
||||
|
||||
|
||||
const { code } = await addNews(formData);
|
||||
if (code == 0) {
|
||||
closeDialog();
|
||||
props.done();
|
||||
}
|
||||
isBtnLod.value = flase;
|
||||
});
|
||||
};
|
||||
|
||||
const handleResetClick = async (formEl) => {
|
||||
if (!formEl) return;
|
||||
formEl.resetFields();
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.copy-btn-box {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: right;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
</style>
|
||||
134
src/pages/index/business/news/components/DetailNewsDialog.vue
Normal file
134
src/pages/index/business/news/components/DetailNewsDialog.vue
Normal file
@ -0,0 +1,134 @@
|
||||
<template>
|
||||
<el-dialog v-model="props.modelValue" title="新闻详情" width="900px" @closed="closeDialog" @open="openDialog">
|
||||
<el-form ref="formRef" :model="formData" :disabled="true">
|
||||
<el-row>
|
||||
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="新闻类型" prop="news_type">
|
||||
<el-select v-model="formData.news_type" clearable>
|
||||
<el-option v-for="item in news_type" :key="item.dictionary_guid" :label="item.dictionary_name"
|
||||
:value="item.dictionary_value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item :label-width="labelWidth" label="新闻标题" prop="news_title">
|
||||
<el-input v-model='formData.news_title' type="text"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span='24'>
|
||||
<el-form-item :label-width='labelWidth' label='新闻封面' prop='news_cover'>
|
||||
<UploadImage ref='uploadRef' v-model='formData.news_cover' :data=uoloadData :limit='1' :fileSize='5'
|
||||
:drag='true' :isShowTip='false' />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item :label-width="labelWidth" label="新闻简介" prop="news_intro">
|
||||
<el-input v-model='formData.news_intro' type="textarea" :rows="5"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="文章来源" prop="news_source">
|
||||
<el-input v-model='formData.news_source' type="text"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="跳转链接" prop="news_link">
|
||||
<el-input v-model='formData.news_link' type="text"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="发布日期" prop="news_issue_date">
|
||||
<el-date-picker v-model="formData.news_issue_date" type="date" value-format="YYYY-MM-DD" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="浏览次数" prop="news_views_num">
|
||||
<el-input-number v-model='formData.news_views_num' controls-position='right' :min='0'></el-input-number>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="新闻排序" prop="news_sort">
|
||||
<el-input-number v-model='formData.news_sort' controls-position='right' :min='1'></el-input-number>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item :label-width="labelWidth" label="新闻内容" prop="news_content">
|
||||
<!-- <div class="copy-btn-box">
|
||||
<el-button @click="handleCopyRichText" class="copy-btn" >获取富文本内容</el-button>
|
||||
</div> -->
|
||||
<RichText v-model='formData.news_content' :min-height='196'></RichText>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
</el-row>
|
||||
</el-form>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref, watch } from "vue";
|
||||
import { getDictionary } from '~/service/news';
|
||||
|
||||
// 打开弹窗时执行
|
||||
const openDialog = async () => {
|
||||
|
||||
await get_news_type()
|
||||
|
||||
};
|
||||
|
||||
// --业务参数
|
||||
|
||||
|
||||
|
||||
// --业务方法
|
||||
|
||||
// 字典获取
|
||||
const news_type = ref([]);
|
||||
async function get_news_type() {
|
||||
await getDictionary({ dictionary_value: 'news_type' }).then((res) => {
|
||||
news_type.value = res
|
||||
})
|
||||
}
|
||||
|
||||
// 复制富文本内容
|
||||
async function handleCopyRichText() {
|
||||
let text = await navigator.clipboard.writeText(formData.news_content);
|
||||
ElMessage.success("富文本内容复制成功")
|
||||
}
|
||||
|
||||
// --基础参数
|
||||
const formRef = ref();
|
||||
const labelWidth = 100;
|
||||
|
||||
const props = defineProps({
|
||||
modelValue: Boolean,
|
||||
data: Object,
|
||||
done: Function,
|
||||
});
|
||||
const emits = defineEmits(["update:modelValue"]);
|
||||
const formData = ref({
|
||||
...props.data,
|
||||
});
|
||||
|
||||
|
||||
// --基础方法
|
||||
watch(props, (v) => {
|
||||
formData.value = v.data;
|
||||
|
||||
|
||||
});
|
||||
|
||||
const closeDialog = () => {
|
||||
emits("update:modelValue", false);
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.copy-btn-box {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: right;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
</style>
|
||||
202
src/pages/index/business/news/components/EditNewsDialog.vue
Normal file
202
src/pages/index/business/news/components/EditNewsDialog.vue
Normal file
@ -0,0 +1,202 @@
|
||||
<template>
|
||||
<el-dialog v-model="props.modelValue" title="编辑新闻" width="900px" @closed="closeDialog" @open="openDialog">
|
||||
<el-form ref="formRef" :model="formData" :rules="rules">
|
||||
<el-row>
|
||||
|
||||
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="新闻类型" prop="news_type">
|
||||
<el-select v-model="formData.news_type" clearable placeholder="请选择">
|
||||
<el-option v-for="item in news_type" :key="item.dictionary_guid" :label="item.dictionary_name"
|
||||
:value="item.dictionary_value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item :label-width="labelWidth" label="新闻标题" prop="news_title">
|
||||
<el-input v-model='formData.news_title' type="text" placeholder='请输入新闻标题'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span='24'>
|
||||
<el-form-item :label-width='labelWidth' label='新闻封面' prop='news_cover'>
|
||||
<UploadImage ref='uploadRef' v-model='formData.news_cover' :data=uoloadData :limit='1' :fileSize='5'
|
||||
:drag='true' :isShowTip='false' />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item :label-width="labelWidth" label="新闻简介" prop="news_intro">
|
||||
<el-input v-model='formData.news_intro' type="textarea" :rows="5" placeholder='请输入新闻简介'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="文章来源" prop="news_source">
|
||||
<el-input v-model='formData.news_source' type="text" placeholder='请输入文章来源'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="跳转链接" prop="news_link">
|
||||
<el-input v-model='formData.news_link' type="text" placeholder='请输入跳转链接'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="发布日期" prop="news_issue_date">
|
||||
<el-date-picker v-model="formData.news_issue_date" type="date" value-format="YYYY-MM-DD" placeholder="发布日期" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="浏览次数" prop="news_views_num">
|
||||
<el-input-number v-model='formData.news_views_num' controls-position='right' :min='0'></el-input-number>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="新闻排序" prop="news_sort">
|
||||
<el-input-number v-model='formData.news_sort' controls-position='right' :min='1'></el-input-number>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item :label-width="labelWidth" label="新闻内容" prop="news_content">
|
||||
<div class="copy-btn-box">
|
||||
<el-button @click="handleCopyRichText" class="copy-btn">获取富文本内容</el-button>
|
||||
</div>
|
||||
<RichText v-model='formData.news_content' :min-height='196'></RichText>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
</el-row>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button type="primary" @click="handleEditClick(formRef)" :loading="isBtnLod">编辑</el-button>
|
||||
<el-button @click="handleResetClick(formRef)">重置</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref, watch } from "vue";
|
||||
import { editNews, getDictionary } from "~/service/news";
|
||||
import { useLoginStore } from "~/store";
|
||||
|
||||
// --业务参数
|
||||
|
||||
|
||||
|
||||
// --业务方法
|
||||
|
||||
// 字典获取
|
||||
const news_type = ref([]);
|
||||
async function get_news_type() {
|
||||
await getDictionary({ dictionary_value: 'news_type' }).then((res) => {
|
||||
news_type.value = res
|
||||
})
|
||||
}
|
||||
|
||||
// 复制富文本内容
|
||||
async function handleCopyRichText() {
|
||||
let text = await navigator.clipboard.writeText(formData.news_content);
|
||||
ElMessage.success("富文本内容复制成功")
|
||||
}
|
||||
|
||||
|
||||
// --基础参数
|
||||
const store = useLoginStore();
|
||||
const headers = {
|
||||
Accept: "application/json",
|
||||
...store.headers,
|
||||
};
|
||||
const isBtnLod = ref(false);
|
||||
const formRef = ref();
|
||||
const labelWidth = 100;
|
||||
const props = defineProps({
|
||||
modelValue: Boolean,
|
||||
data: Object,
|
||||
done: Function,
|
||||
});
|
||||
const emits = defineEmits(["update:modelValue"]);
|
||||
const formData = ref({
|
||||
...props.data,
|
||||
});
|
||||
const uoloadData = ref({
|
||||
dirName: "News"
|
||||
})
|
||||
|
||||
|
||||
// --基础方法
|
||||
watch(props, (v) => {
|
||||
formData.value = v.data;
|
||||
|
||||
|
||||
});
|
||||
|
||||
// 打开弹窗时执行
|
||||
const openDialog = () => {
|
||||
get_news_type()
|
||||
|
||||
};
|
||||
|
||||
const closeDialog = () => {
|
||||
props.done();
|
||||
emits("update:modelValue", false);
|
||||
};
|
||||
|
||||
const rules = reactive({
|
||||
news_type: [
|
||||
{
|
||||
required: true,
|
||||
message: '新闻类型不能为空'
|
||||
}
|
||||
],
|
||||
news_title: [
|
||||
{
|
||||
required: true,
|
||||
message: '新闻标题不能为空'
|
||||
}
|
||||
],
|
||||
news_cover: [
|
||||
{
|
||||
required: true,
|
||||
message: '新闻封面不能为空'
|
||||
}
|
||||
],
|
||||
news_sort: [
|
||||
{
|
||||
required: true,
|
||||
message: '新闻排序不能为空'
|
||||
}
|
||||
],
|
||||
|
||||
});
|
||||
|
||||
const handleEditClick = async (formEl) => {
|
||||
console.log(formData.value);
|
||||
if (!formEl) return;
|
||||
formEl.validate(async (valid) => {
|
||||
if (!valid) {
|
||||
return;
|
||||
}
|
||||
isBtnLod.value = true;
|
||||
|
||||
|
||||
const { code } = await editNews(formData.value);
|
||||
if (code == 0) {
|
||||
closeDialog();
|
||||
props.done();
|
||||
}
|
||||
isBtnLod.value = false;
|
||||
});
|
||||
};
|
||||
const handleResetClick = async (formEl) => {
|
||||
if (!formEl) return;
|
||||
formEl.resetFields();
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.copy-btn-box {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: right;
|
||||
margin-bottom: 15px;
|
||||
}
|
||||
</style>
|
||||
281
src/pages/index/business/news/index.vue
Normal file
281
src/pages/index/business/news/index.vue
Normal file
@ -0,0 +1,281 @@
|
||||
<template>
|
||||
<!-- 面包屑 -->
|
||||
<el-breadcrumb>
|
||||
<el-breadcrumb-item>新闻管理</el-breadcrumb-item>
|
||||
<el-breadcrumb-item to="/news/list">新闻列表</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
<!-- 搜索 -->
|
||||
<el-form inline :model="params">
|
||||
|
||||
|
||||
<el-form-item label="新闻类型">
|
||||
<el-select v-model="params.news_type" clearable placeholder="请选择">
|
||||
<el-option v-for="item in news_type" :key="item.dictionary_guid" :label="item.dictionary_name"
|
||||
:value="item.dictionary_value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="新闻标题">
|
||||
<el-input v-model='params.news_title' placeholder='请输入新闻标题'></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="tableRef.reload()" icon="ElIconSearch">
|
||||
搜索
|
||||
</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-space style="margin-bottom: 10px;">
|
||||
<!-- 添加新闻 -->
|
||||
<el-col :span="1">
|
||||
<el-button type="primary" @click="addNewsDialogVisible = true"> 添加 </el-button>
|
||||
</el-col>
|
||||
|
||||
<!-- 导入 -->
|
||||
<el-upload class="upload-demo" :action="importExcel" :headers="headers" :on-success="handleExcelSuccess"
|
||||
:on-progress="uploadLoading" :on-error="closeUploadLoading" style="margin-left: 10px" :show-file-list="false">
|
||||
<el-button type="primary">导入</el-button>
|
||||
</el-upload>
|
||||
|
||||
<!-- 导出 -->
|
||||
<el-button icon="ElIconDocument" @click="exportExcel(params)">导出</el-button>
|
||||
|
||||
<!-- 下载导入模板 -->
|
||||
<el-button icon="ElIconDownload" @click="downloadTemplate()">下载导入模板</el-button>
|
||||
|
||||
|
||||
<!-- 下拉操作 -->
|
||||
<el-dropdown v-if="selectionData.length">
|
||||
<el-button type="primary">
|
||||
批量操作<el-icon class="el-icon--right"><arrow-down /></el-icon>
|
||||
</el-button>
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu>
|
||||
<el-dropdown-item @click="handleDelete(selectionData)">
|
||||
批量删除
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
</el-space>
|
||||
<!-- 数据表格 -->
|
||||
<DataTable ref="tableRef" style="width: 100%" :onSelectionChange="data => (selectionData = data)" :column="column"
|
||||
:params="params" :request="params => getNewsList(params)">
|
||||
|
||||
|
||||
<template #news_type='scope'>
|
||||
<dict-tag :options='news_type' :value='scope.row.news_type' />
|
||||
</template>
|
||||
|
||||
<template #news_cover="scope">
|
||||
<el-image v-if="scope.row.news_cover" :src="scope.row.news_cover.split(',')[0]" lazy
|
||||
:preview-src-list="scope.row.news_cover.split(',')" :preview-teleported="true" :hide-on-click-modal="true"
|
||||
fit="contain" class="el-avatar"></el-image>
|
||||
<template v-else>暂无图片</template>
|
||||
</template>
|
||||
|
||||
<!-- 排序 -->
|
||||
<template #news_sort='scope'>
|
||||
<el-input-number :disabled='loading' v-model='scope.row.news_sort' :min='1' controls-position='right'
|
||||
@change='handleEditOrder(scope.row)'></el-input-number>
|
||||
</template>
|
||||
|
||||
|
||||
|
||||
<template #chaoz="scope">
|
||||
<el-space>
|
||||
<el-button size="small" @click="handleUpdate(scope.row)">
|
||||
编辑
|
||||
</el-button>
|
||||
<el-dropdown @command="handleCommand">
|
||||
<el-button type="primary" size="small">
|
||||
更多<el-icon class="el-icon--right"><arrow-down /></el-icon>
|
||||
</el-button>
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu>
|
||||
<el-dropdown-item :command="{ type: 'detail', row: scope.row }">
|
||||
详情
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item :command="{ type: 'delete', row: scope.row }">
|
||||
删除
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
</el-space>
|
||||
</template>
|
||||
</DataTable>
|
||||
|
||||
<!-- 添加新闻 -->
|
||||
<AddNewsDialog v-model="addNewsDialogVisible" :done="() => tableRef.reload()"></AddNewsDialog>
|
||||
<!-- 编辑新闻 -->
|
||||
<EditNewsDialog v-model="EditNewsDialogVisible" :data="EditNewsDialogRow" :done="() => tableRef.reload()">
|
||||
</EditNewsDialog>
|
||||
<!-- 新闻详情 -->
|
||||
<DetailNewsDialog v-model="DetailNewsDialogVisible" :data="DetailNewsDialogRow"></DetailNewsDialog>
|
||||
</template>
|
||||
<script setup>
|
||||
import { ArrowDown } from '@element-plus/icons-vue';
|
||||
import { ref, reactive, watch } from 'vue';
|
||||
import { useLoginStore } from "~/store";
|
||||
import { getNewsList, editNews, deleteNews, getDictionary, exportExcel, downloadTemplate, importExcel } from '~/service/news';
|
||||
import AddNewsDialog from './components/AddNewsDialog.vue';
|
||||
import EditNewsDialog from './components/EditNewsDialog.vue';
|
||||
import DetailNewsDialog from './components/DetailNewsDialog.vue';
|
||||
|
||||
const tableRef = ref();
|
||||
const selectionData = ref([]);
|
||||
const store = useLoginStore();
|
||||
|
||||
const addNewsDialogVisible = ref(false);
|
||||
const EditNewsDialogVisible = ref(false);
|
||||
const EditNewsDialogRow = ref({});
|
||||
const DetailNewsDialogVisible = ref(false);
|
||||
const DetailNewsDialogRow = ref({});
|
||||
|
||||
const headers = {
|
||||
Accept: "application/json",
|
||||
...store.headers,
|
||||
};
|
||||
|
||||
// 查询参数
|
||||
const params = reactive({
|
||||
news_type: "",
|
||||
news_title: "",
|
||||
|
||||
});
|
||||
const column = [
|
||||
|
||||
{
|
||||
fixed: true,
|
||||
type: 'selection'
|
||||
},
|
||||
{
|
||||
prop: "news_type",
|
||||
label: '新闻类型',
|
||||
},
|
||||
{
|
||||
prop: "news_cover",
|
||||
label: '新闻封面',
|
||||
width: "200",
|
||||
},
|
||||
{
|
||||
prop: "news_title",
|
||||
label: '新闻标题',
|
||||
showOverflowTooltip: true,
|
||||
width: "500",
|
||||
},
|
||||
// {
|
||||
// prop: "news_intro",
|
||||
// label: '新闻简介',
|
||||
// showOverflowTooltip: true,
|
||||
// width: "400",
|
||||
// },
|
||||
{
|
||||
prop: "news_issue_date",
|
||||
label: '发布日期',
|
||||
sortable: true
|
||||
},
|
||||
{
|
||||
prop: "news_views_num",
|
||||
label: '浏览次数',
|
||||
sortable: true,
|
||||
width: "150",
|
||||
},
|
||||
{
|
||||
prop: "news_sort",
|
||||
label: '新闻排序',
|
||||
width: "180",
|
||||
sortable: true
|
||||
},
|
||||
{
|
||||
label: '操作',
|
||||
prop: 'chaoz',
|
||||
width: '250',
|
||||
fixed: 'right'
|
||||
}
|
||||
];
|
||||
|
||||
|
||||
const handleCommand = ({ type, row }) => {
|
||||
switch (type) {
|
||||
case "detail":
|
||||
handleDetail(row);
|
||||
break;
|
||||
case 'delete':
|
||||
handleDelete([row]);
|
||||
break;
|
||||
}
|
||||
};
|
||||
|
||||
// 删除数据
|
||||
const handleDelete = data => {
|
||||
ElMessageBox.confirm(`您确定要删除该新闻吗？`).then(async () => {
|
||||
const res = await deleteNews({
|
||||
news_guid: data.map(v => v.news_guid).join()
|
||||
});
|
||||
if (res) {
|
||||
tableRef.value.reload();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
// 修改
|
||||
function handleUpdate(row) {
|
||||
EditNewsDialogVisible.value = true
|
||||
EditNewsDialogRow.value = row
|
||||
}
|
||||
|
||||
// 详情
|
||||
function handleDetail(row) {
|
||||
DetailNewsDialogVisible.value = true
|
||||
DetailNewsDialogRow.value = row
|
||||
}
|
||||
|
||||
|
||||
// 导入方法
|
||||
let loadingImoprt = null;
|
||||
const uploadLoading = () => {
|
||||
loadingImoprt = ElLoading.service({
|
||||
lock: true,
|
||||
text: "正在导入中...",
|
||||
background: "rgba(255, 255, 255, 0.7)",
|
||||
});
|
||||
};
|
||||
const closeUploadLoading = () => loadingImoprt.close();
|
||||
const handleExcelSuccess = (value) => {
|
||||
if (value.code == 0) {
|
||||
ElMessageBox.alert(value.msg, "导入信息", {
|
||||
dangerouslyUseHTMLString: true,
|
||||
confirmButtonText: "确定",
|
||||
});
|
||||
} else {
|
||||
ElMessage.error(value.msg);
|
||||
}
|
||||
closeUploadLoading();
|
||||
tableRef.value.reload();
|
||||
};
|
||||
|
||||
|
||||
|
||||
//排序
|
||||
const loading = ref(false)
|
||||
async function handleEditOrder(data) {
|
||||
loading.value = true
|
||||
const { code } = await editNews(data);
|
||||
if (code == 0) {
|
||||
loading.value = false
|
||||
tableRef.value.reload()
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
// 字典获取
|
||||
const news_type = ref([]);
|
||||
async function get_news_type() {
|
||||
await getDictionary({ dictionary_value: 'news_type' }).then((res) => {
|
||||
news_type.value = res
|
||||
})
|
||||
}
|
||||
get_news_type()
|
||||
</script>
|
||||
@ -0,0 +1,181 @@
|
||||
<template>
|
||||
<el-dialog v-model="dialogVisible" title="添加产品" width="900px" @closed="closeDialog" @open="openDialog">
|
||||
<el-form ref="formRef" :model="formData" :rules="rules">
|
||||
<el-row>
|
||||
<el-col :lg="24">
|
||||
<el-form-item :label-width="labelWidth" label="产品类目" prop="product_type_guid">
|
||||
<el-cascader class="w100" filterable :options="dataList"
|
||||
:props="{ checkStrictly: false, value: 'product_type_guid', label: 'product_type_name', emitPath: false }"
|
||||
placeholder="请选择产品类目" clearable v-model="formData.product_type_guid">
|
||||
<template #default="{ node, data }">
|
||||
<span>{{ data.product_type_name }}</span>
|
||||
<span v-if="!node.isLeaf"> ({{ data.children.length }}) </span>
|
||||
</template>
|
||||
</el-cascader>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="产品名称" prop="product_name">
|
||||
<el-input v-model='formData.product_name' type="text" placeholder='请输入产品名称'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span='24'>
|
||||
<el-form-item :label-width='labelWidth' label='产品图片' prop='product_img'>
|
||||
<UploadImage ref='uploadRef' v-model='formData.product_img' :data=uoloadData :limit='5' :fileSize='5'
|
||||
:drag='true' :isShowTip='false' />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="产品排序" prop="product_sort">
|
||||
<el-input-number v-model='formData.product_sort' controls-position='right' :min='1'></el-input-number>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="跳转链接" prop="product_link">
|
||||
<el-input v-model='formData.product_link' type="text" placeholder='请输入跳转链接'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item :label-width="labelWidth" label="产品描述" prop="product_description">
|
||||
<el-input v-model='formData.product_description' type="textarea" :rows="5" placeholder='请输入产品描述'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="24">
|
||||
<el-form-item :label-width="labelWidth" label="产品详情" prop="product_details">
|
||||
<RichText v-model='formData.product_details' :min-height='196'></RichText>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
</el-row>
|
||||
</el-form>
|
||||
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button type="primary" @click="handleAddClick(formRef)">添加</el-button>
|
||||
<el-button @click="handleResetClick(formRef)">重置</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref, watch } from "vue";
|
||||
import { addProduct } from "~/service/product";
|
||||
import { getProductTypeTree } from "~/service/product_type";
|
||||
import { useLoginStore } from "~/store";
|
||||
|
||||
// --业务参数
|
||||
|
||||
|
||||
|
||||
// --业务方法
|
||||
const dataList = ref();
|
||||
async function getList() {
|
||||
getProductTypeTree().then((res) => {
|
||||
if (res.code == 0) {
|
||||
dataList.value = res.data
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
// --基础参数
|
||||
const store = useLoginStore();
|
||||
const headers = {
|
||||
Accept: "application/json",
|
||||
...store.headers,
|
||||
};
|
||||
|
||||
const isBtnLod = ref(false);
|
||||
const formRef = ref();
|
||||
const labelWidth = 90;
|
||||
const props = defineProps({
|
||||
modelValue: Boolean,
|
||||
done: Function,
|
||||
});
|
||||
const emits = defineEmits(["update:modelValue"]);
|
||||
const dialogVisible = ref(props.modelValue);
|
||||
const formData = reactive({});
|
||||
|
||||
const uoloadData = ref({
|
||||
dirName: "Product"
|
||||
})
|
||||
|
||||
watch(props, (v) => {
|
||||
dialogVisible.value = v.modelValue;
|
||||
});
|
||||
|
||||
const rules = reactive({
|
||||
product_type_guid: [
|
||||
{
|
||||
required: true,
|
||||
message: '产品类目不能为空'
|
||||
}
|
||||
],
|
||||
product_name: [
|
||||
{
|
||||
required: true,
|
||||
message: '产品名称不能为空'
|
||||
}
|
||||
],
|
||||
product_img: [
|
||||
{
|
||||
required: true,
|
||||
message: '产品图片不能为空'
|
||||
}
|
||||
],
|
||||
product_sort: [
|
||||
{
|
||||
required: true,
|
||||
message: '产品排序不能为空'
|
||||
}
|
||||
],
|
||||
|
||||
});
|
||||
|
||||
|
||||
// --基础方法
|
||||
|
||||
// 打开弹窗时执行
|
||||
const openDialog = async () => {
|
||||
await getList()
|
||||
};
|
||||
|
||||
const closeDialog = () => {
|
||||
handleResetClick(formRef.value);
|
||||
dialogVisible.value = false;
|
||||
emits("update:modelValue", false);
|
||||
};
|
||||
|
||||
const handleAddClick = async (formEl) => {
|
||||
if (!formEl) return;
|
||||
formEl.validate(async (valid) => {
|
||||
if (!valid) {
|
||||
return;
|
||||
}
|
||||
isBtnLod.value = true;
|
||||
|
||||
|
||||
const { code } = await addProduct(formData);
|
||||
if (code == 0) {
|
||||
closeDialog();
|
||||
props.done();
|
||||
}
|
||||
isBtnLod.value = flase;
|
||||
});
|
||||
};
|
||||
|
||||
const handleResetClick = async (formEl) => {
|
||||
if (!formEl) return;
|
||||
formEl.resetFields();
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped></style>
|
||||
@ -0,0 +1,116 @@
|
||||
<template>
|
||||
<el-dialog v-model="props.modelValue" title="产品详情" width="900px" @closed="closeDialog" @open="openDialog">
|
||||
<el-form ref="formRef" :model="formData" :rules="rules" :disabled="true">
|
||||
<el-row>
|
||||
<el-col :lg="24">
|
||||
<el-form-item :label-width="labelWidth" label="产品类目" prop="product_type_guid">
|
||||
<el-cascader class="w100" filterable :options="dataList"
|
||||
:props="{ checkStrictly: false, value: 'product_type_guid', label: 'product_type_name', emitPath: false }"
|
||||
clearable v-model="formData.product_type_guid">
|
||||
<template #default="{ node, data }">
|
||||
<span>{{ data.product_type_name }}</span>
|
||||
<span v-if="!node.isLeaf"> ({{ data.children.length }}) </span>
|
||||
</template>
|
||||
</el-cascader>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="产品名称" prop="product_name">
|
||||
<el-input v-model='formData.product_name' type="text"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span='24'>
|
||||
<el-form-item :label-width='labelWidth' label='产品图片' prop='product_img'>
|
||||
<UploadImage ref='uploadRef' v-model='formData.product_img' :data=uoloadData :limit='5' :fileSize='5'
|
||||
:drag='true' :isDisabled="true" :isShowTip='false' />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="产品排序" prop="product_sort">
|
||||
<el-input-number v-model='formData.product_sort' controls-position='right' :min='1'></el-input-number>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="跳转链接" prop="product_link">
|
||||
<el-input v-model='formData.product_link' type="text"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item :label-width="labelWidth" label="产品描述" prop="product_description">
|
||||
<el-input v-model='formData.product_description' type="textarea" :rows="5"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="24">
|
||||
<el-form-item :label-width="labelWidth" label="产品详情" prop="product_details">
|
||||
<RichText v-model='formData.product_details' :min-height='196'></RichText>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
</el-row>
|
||||
</el-form>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref, watch } from "vue";
|
||||
import { isEmptyObject } from "~/utils/index";
|
||||
import { getProductTypeTree } from "~/service/product_type";
|
||||
|
||||
|
||||
// --业务参数
|
||||
|
||||
|
||||
|
||||
// --业务方法
|
||||
const dataList = ref();
|
||||
async function getList() {
|
||||
getProductTypeTree().then((res) => {
|
||||
if (res.code == 0) {
|
||||
dataList.value = res.data
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
// --基础参数
|
||||
const formRef = ref();
|
||||
const labelWidth = 100;
|
||||
|
||||
const props = defineProps({
|
||||
modelValue: Boolean,
|
||||
data: Object,
|
||||
done: Function,
|
||||
});
|
||||
const emits = defineEmits(["update:modelValue"]);
|
||||
const formData = ref({
|
||||
...props.data,
|
||||
});
|
||||
|
||||
|
||||
// --基础方法
|
||||
watch(props, (v) => {
|
||||
formData.value = v.data;
|
||||
|
||||
|
||||
});
|
||||
|
||||
// 打开弹窗时执行
|
||||
const openDialog = async () => {
|
||||
|
||||
await getList()
|
||||
|
||||
};
|
||||
|
||||
const closeDialog = () => {
|
||||
emits("update:modelValue", false);
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped></style>
|
||||
@ -0,0 +1,181 @@
|
||||
<template>
|
||||
<el-dialog v-model="props.modelValue" title="编辑产品" width="900px" @closed="closeDialog" @open="openDialog">
|
||||
<el-form ref="formRef" :model="formData" :rules="rules">
|
||||
<el-row>
|
||||
<el-col :lg="24">
|
||||
<el-form-item :label-width="labelWidth" label="产品类目" prop="product_type_guid">
|
||||
<el-cascader class="w100" filterable :options="dataList"
|
||||
:props="{ checkStrictly: false, value: 'product_type_guid', label: 'product_type_name', emitPath: false }"
|
||||
placeholder="请选择产品类目" clearable v-model="formData.product_type_guid">
|
||||
<template #default="{ node, data }">
|
||||
<span>{{ data.product_type_name }}</span>
|
||||
<span v-if="!node.isLeaf"> ({{ data.children.length }}) </span>
|
||||
</template>
|
||||
</el-cascader>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="产品名称" prop="product_name">
|
||||
<el-input v-model='formData.product_name' type="text" placeholder='请输入产品名称'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span='24'>
|
||||
<el-form-item :label-width='labelWidth' label='产品图片' prop='product_img'>
|
||||
<UploadImage ref='uploadRef' v-model='formData.product_img' :data=uoloadData :limit='5' :fileSize='5'
|
||||
:drag='true' :isShowTip='false' />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="产品排序" prop="product_sort">
|
||||
<el-input-number v-model='formData.product_sort' controls-position='right' :min='1'></el-input-number>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="跳转链接" prop="product_link">
|
||||
<el-input v-model='formData.product_link' type="text" placeholder='请输入跳转链接'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item :label-width="labelWidth" label="产品描述" prop="product_description">
|
||||
<el-input v-model='formData.product_description' type="textarea" :rows="5" placeholder='请输入产品描述'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="24">
|
||||
<el-form-item :label-width="labelWidth" label="产品详情" prop="product_details">
|
||||
<RichText v-model='formData.product_details' :min-height='196'></RichText>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
</el-row>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button type="primary" @click="handleEditClick(formRef)" :loading="isBtnLod">编辑</el-button>
|
||||
<el-button @click="handleResetClick(formRef)">重置</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref, watch } from "vue";
|
||||
import { editProduct } from "~/service/product";
|
||||
import { getProductTypeTree } from "~/service/product_type";
|
||||
import { useLoginStore } from "~/store";
|
||||
|
||||
// --业务参数
|
||||
|
||||
|
||||
|
||||
// --业务方法
|
||||
const dataList = ref();
|
||||
async function getList() {
|
||||
getProductTypeTree().then((res) => {
|
||||
if (res.code == 0) {
|
||||
dataList.value = res.data
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
// --基础参数
|
||||
const store = useLoginStore();
|
||||
const headers = {
|
||||
Accept: "application/json",
|
||||
...store.headers,
|
||||
};
|
||||
const isBtnLod = ref(false);
|
||||
const formRef = ref();
|
||||
const labelWidth = 100;
|
||||
const props = defineProps({
|
||||
modelValue: Boolean,
|
||||
data: Object,
|
||||
done: Function,
|
||||
});
|
||||
const emits = defineEmits(["update:modelValue"]);
|
||||
const formData = ref({
|
||||
...props.data,
|
||||
});
|
||||
const uoloadData = ref({
|
||||
dirName: "Product"
|
||||
})
|
||||
|
||||
|
||||
// --基础方法
|
||||
watch(props, (v) => {
|
||||
formData.value = v.data;
|
||||
|
||||
|
||||
});
|
||||
|
||||
// 打开弹窗时执行
|
||||
const openDialog = async () => {
|
||||
await getList()
|
||||
};
|
||||
|
||||
const closeDialog = () => {
|
||||
props.done();
|
||||
emits("update:modelValue", false);
|
||||
};
|
||||
|
||||
const rules = reactive({
|
||||
product_type_guid: [
|
||||
{
|
||||
required: true,
|
||||
message: '产品类目不能为空'
|
||||
}
|
||||
],
|
||||
product_name: [
|
||||
{
|
||||
required: true,
|
||||
message: '产品名称不能为空'
|
||||
}
|
||||
],
|
||||
product_img: [
|
||||
{
|
||||
required: true,
|
||||
message: '产品图片不能为空'
|
||||
}
|
||||
],
|
||||
product_sort: [
|
||||
{
|
||||
required: true,
|
||||
message: '产品排序不能为空'
|
||||
}
|
||||
],
|
||||
|
||||
});
|
||||
|
||||
const handleEditClick = async (formEl) => {
|
||||
console.log(formData.value);
|
||||
if (!formEl) return;
|
||||
formEl.validate(async (valid) => {
|
||||
if (!valid) {
|
||||
return;
|
||||
}
|
||||
isBtnLod.value = true;
|
||||
|
||||
|
||||
const { code } = await editProduct(formData.value);
|
||||
if (code == 0) {
|
||||
closeDialog();
|
||||
props.done();
|
||||
}
|
||||
isBtnLod.value = false;
|
||||
});
|
||||
};
|
||||
const handleResetClick = async (formEl) => {
|
||||
if (!formEl) return;
|
||||
formEl.resetFields();
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped></style>
|
||||
270
src/pages/index/business/products/product/index.vue
Normal file
270
src/pages/index/business/products/product/index.vue
Normal file
@ -0,0 +1,270 @@
|
||||
<template>
|
||||
<!-- 面包屑 -->
|
||||
<el-breadcrumb>
|
||||
<el-breadcrumb-item>产品管理</el-breadcrumb-item>
|
||||
<el-breadcrumb-item to="/product/list">产品列表</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
<!-- 搜索 -->
|
||||
<el-form inline :model="params">
|
||||
|
||||
|
||||
<el-form-item :label-width="labelWidth" label="商品类目" prop="product_type_parent_guid">
|
||||
<el-cascader class="w100" filterable :options="dataList"
|
||||
:props="{ checkStrictly: false, value: 'product_type_guid', label: 'product_type_name', emitPath: false }"
|
||||
placeholder="请选择商品类目" clearable v-model="params.product_type_guid">
|
||||
<template #default="{ node, data }">
|
||||
<span>{{ data.product_type_name }}</span>
|
||||
<span v-if="!node.isLeaf"> ({{ data.children.length }}) </span>
|
||||
</template>
|
||||
</el-cascader>
|
||||
</el-form-item>
|
||||
<el-form-item label="产品名称">
|
||||
<el-input v-model='params.product_name' placeholder='请输入产品名称'></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="tableRef.reload()" icon="ElIconSearch">
|
||||
搜索
|
||||
</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-space style="margin-bottom: 10px;">
|
||||
<!-- 添加产品 -->
|
||||
<el-col :span="1">
|
||||
<el-button type="primary" @click="addProductDialogVisible = true"> 添加 </el-button>
|
||||
</el-col>
|
||||
|
||||
<!-- 导入 -->
|
||||
<el-upload class="upload-demo" :action="importExcel" :headers="headers" :on-success="handleExcelSuccess"
|
||||
:on-progress="uploadLoading" :on-error="closeUploadLoading" style="margin-left: 10px" :show-file-list="false">
|
||||
<el-button type="primary">导入</el-button>
|
||||
</el-upload>
|
||||
|
||||
<!-- 导出 -->
|
||||
<el-button icon="ElIconDocument" @click="exportExcel(params)">导出</el-button>
|
||||
|
||||
<!-- 下载导入模板 -->
|
||||
<el-button icon="ElIconDownload" @click="downloadTemplate()">下载导入模板</el-button>
|
||||
|
||||
|
||||
<!-- 下拉操作 -->
|
||||
<el-dropdown v-if="selectionData.length">
|
||||
<el-button type="primary">
|
||||
批量操作<el-icon class="el-icon--right"><arrow-down /></el-icon>
|
||||
</el-button>
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu>
|
||||
<el-dropdown-item @click="handleDelete(selectionData)">
|
||||
批量删除
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
</el-space>
|
||||
<!-- 数据表格 -->
|
||||
<DataTable ref="tableRef" style="width: 100%" :onSelectionChange="data => (selectionData = data)" :column="column"
|
||||
:params="params" :request="params => getProductList(params)">
|
||||
|
||||
<template #product_img="scope">
|
||||
<el-image v-if="scope.row.product_img" :src="scope.row.product_img.split(',')[0]" lazy
|
||||
:preview-src-list="scope.row.product_img.split(',')" :preview-teleported="true" :hide-on-click-modal="true"
|
||||
fit="contain" class="el-avatar"></el-image>
|
||||
<template v-else>暂无图片</template>
|
||||
</template>
|
||||
|
||||
<template #product_sort="scope">
|
||||
<el-input-number v-model='scope.row.product_sort' controls-position="right"
|
||||
@change="handleEditProduct(scope.row)"></el-input-number>
|
||||
</template>
|
||||
|
||||
|
||||
<template #chaoz="scope">
|
||||
<el-space>
|
||||
<el-button size="small" @click="handleUpdate(scope.row)">
|
||||
编辑
|
||||
</el-button>
|
||||
<el-dropdown @command="handleCommand">
|
||||
<el-button type="primary" size="small">
|
||||
更多<el-icon class="el-icon--right"><arrow-down /></el-icon>
|
||||
</el-button>
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu>
|
||||
<el-dropdown-item :command="{ type: 'detail', row: scope.row }">
|
||||
详情
|
||||
</el-dropdown-item>
|
||||
<el-dropdown-item :command="{ type: 'delete', row: scope.row }">
|
||||
删除
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
</el-space>
|
||||
</template>
|
||||
</DataTable>
|
||||
|
||||
<!-- 添加产品 -->
|
||||
<AddProductDialog v-model="addProductDialogVisible" :done="() => tableRef.reload()"></AddProductDialog>
|
||||
<!-- 编辑产品 -->
|
||||
<EditProductDialog v-model="EditProductDialogVisible" :data="EditProductDialogRow" :done="() => tableRef.reload()">
|
||||
</EditProductDialog>
|
||||
<!-- 产品详情 -->
|
||||
<DetailProductDialog v-model="DetailProductDialogVisible" :data="DetailProductDialogRow"></DetailProductDialog>
|
||||
</template>
|
||||
<script setup>
|
||||
import { ArrowDown } from '@element-plus/icons-vue';
|
||||
import { ref, reactive, watch } from 'vue';
|
||||
import { useLoginStore } from "~/store";
|
||||
import { getProductList, editProduct, deleteProduct, exportExcel, downloadTemplate, importExcel } from '~/service/product';
|
||||
import { getProductTypeTree } from "~/service/product_type";
|
||||
import AddProductDialog from './components/AddProductDialog.vue';
|
||||
import EditProductDialog from './components/EditProductDialog.vue';
|
||||
import DetailProductDialog from './components/DetailProductDialog.vue';
|
||||
|
||||
const tableRef = ref();
|
||||
const selectionData = ref([]);
|
||||
const store = useLoginStore();
|
||||
|
||||
const addProductDialogVisible = ref(false);
|
||||
const EditProductDialogVisible = ref(false);
|
||||
const EditProductDialogRow = ref({});
|
||||
const DetailProductDialogVisible = ref(false);
|
||||
const DetailProductDialogRow = ref({});
|
||||
|
||||
const headers = {
|
||||
Accept: "application/json",
|
||||
...store.headers,
|
||||
};
|
||||
|
||||
// 查询参数
|
||||
const params = reactive({
|
||||
product_type_guid: "",
|
||||
product_name: "",
|
||||
|
||||
});
|
||||
const column = [
|
||||
|
||||
{
|
||||
fixed: true,
|
||||
type: 'selection'
|
||||
},
|
||||
{
|
||||
prop: "product_id",
|
||||
label: '产品ID',
|
||||
width: "100",
|
||||
},
|
||||
{
|
||||
prop: "product_type_name",
|
||||
label: '产品类目',
|
||||
width: "150",
|
||||
},
|
||||
{
|
||||
prop: "product_name",
|
||||
label: '产品名称',
|
||||
width: "400",
|
||||
showOverflowTooltip: true,
|
||||
},
|
||||
{
|
||||
prop: "product_img",
|
||||
label: '产品图片',
|
||||
width: "200"
|
||||
},
|
||||
{
|
||||
prop: "product_description",
|
||||
label: '产品描述',
|
||||
showOverflowTooltip: true,
|
||||
},
|
||||
{
|
||||
prop: "product_sort",
|
||||
label: '产品排序',
|
||||
width: "200",
|
||||
sortable: true
|
||||
},
|
||||
{
|
||||
label: '操作',
|
||||
prop: 'chaoz',
|
||||
width: '250',
|
||||
fixed: 'right'
|
||||
}
|
||||
];
|
||||
|
||||
|
||||
const handleCommand = ({ type, row }) => {
|
||||
switch (type) {
|
||||
case "detail":
|
||||
handleDetail(row);
|
||||
break;
|
||||
case 'delete':
|
||||
handleDelete([row]);
|
||||
break;
|
||||
}
|
||||
};
|
||||
|
||||
// 删除数据
|
||||
const handleDelete = data => {
|
||||
ElMessageBox.confirm(`您确定要删除该产品吗？`).then(async () => {
|
||||
const res = await deleteProduct({
|
||||
product_guid: data.map(v => v.product_guid).join()
|
||||
});
|
||||
if (res) {
|
||||
tableRef.value.reload();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
// 修改
|
||||
function handleUpdate(row) {
|
||||
EditProductDialogVisible.value = true
|
||||
EditProductDialogRow.value = row
|
||||
}
|
||||
|
||||
// 详情
|
||||
function handleDetail(row) {
|
||||
DetailProductDialogVisible.value = true
|
||||
DetailProductDialogRow.value = row
|
||||
}
|
||||
|
||||
//排序
|
||||
async function handleEditProduct(data) {
|
||||
await editProduct(data);
|
||||
tableRef.value.reload();
|
||||
}
|
||||
|
||||
// 获取产品类目树形列表
|
||||
const dataList = ref();
|
||||
async function getList() {
|
||||
getProductTypeTree().then((res) => {
|
||||
if (res.code == 0) {
|
||||
dataList.value = res.data
|
||||
}
|
||||
})
|
||||
}
|
||||
getList()
|
||||
|
||||
// 导入方法
|
||||
let loadingImoprt = null;
|
||||
const uploadLoading = () => {
|
||||
loadingImoprt = ElLoading.service({
|
||||
lock: true,
|
||||
text: "正在导入中...",
|
||||
background: "rgba(255, 255, 255, 0.7)",
|
||||
});
|
||||
};
|
||||
const closeUploadLoading = () => loadingImoprt.close();
|
||||
const handleExcelSuccess = (value) => {
|
||||
if (value.code == 0) {
|
||||
ElMessageBox.alert(value.msg, "导入信息", {
|
||||
dangerouslyUseHTMLString: true,
|
||||
confirmButtonText: "确定",
|
||||
});
|
||||
} else {
|
||||
ElMessage.error(value.msg);
|
||||
}
|
||||
closeUploadLoading();
|
||||
tableRef.value.reload();
|
||||
};
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</script>
|
||||
@ -0,0 +1,167 @@
|
||||
<template>
|
||||
<el-dialog v-model="dialogVisible" title="添加产品类目" width="600px" @closed="closeDialog" @open="openDialog">
|
||||
<el-form ref="formRef" :model="formData" :rules="rules">
|
||||
<el-row>
|
||||
<el-col :lg="24">
|
||||
<el-form-item :label-width="labelWidth" label="上级菜单" prop="product_type_parent_guid">
|
||||
<el-cascader class="w100" filterable :options="dataList"
|
||||
:props="{ checkStrictly: true, value: 'product_type_guid', label: 'product_type_name', emitPath: false }"
|
||||
placeholder="请选择上级菜单" clearable v-model="formData.product_type_parent_guid">
|
||||
<template #default="{ node, data }">
|
||||
<span>{{ data.product_type_name }}</span>
|
||||
<span v-if="!node.isLeaf"> ({{ data.children.length }}) </span>
|
||||
</template>
|
||||
</el-cascader>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-form-item :label-width="labelWidth" label="类目名称" prop="product_type_name">
|
||||
<el-input v-model='formData.product_type_name' placeholder='请输入类目名称'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-form-item :label-width="labelWidth" label="类目标题" prop="">
|
||||
<el-input v-model='formData.product_type_title' placeholder='请输入类目标题'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-form-item :label-width="labelWidth" label="类目链接" prop="">
|
||||
<el-input v-model='formData.product_type_link' placeholder='请输入类目链接'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="排序" prop="product_type_order">
|
||||
<el-input-number v-model='formData.product_type_order' controls-position='right'></el-input-number>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row>
|
||||
<el-col :span='12'>
|
||||
<el-form-item :label-width='labelWidth' label='类目图标' prop='product_type_icon'>
|
||||
<UploadImage ref='uploadRef' v-model='formData.product_type_icon' :data=uoloadData :limit='1' :fileSize='5'
|
||||
:drag='true' :isShowTip='false' />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
</el-row>
|
||||
</el-form>
|
||||
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button type="primary" @click="handleAddClick(formRef)">添加</el-button>
|
||||
<el-button @click="handleResetClick(formRef)">重置</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref, watch } from "vue";
|
||||
import { addProductType, getProductTypeTree } from "~/service/product_type";
|
||||
import { useLoginStore } from "~/store";
|
||||
|
||||
// --业务参数
|
||||
|
||||
|
||||
|
||||
// --业务方法
|
||||
const dataList = ref();
|
||||
async function getList() {
|
||||
getProductTypeTree().then((res) => {
|
||||
if (res.code == 0) {
|
||||
dataList.value = res.data
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
// --基础参数
|
||||
const store = useLoginStore();
|
||||
const headers = {
|
||||
Accept: "application/json",
|
||||
...store.headers,
|
||||
};
|
||||
|
||||
const formRef = ref();
|
||||
const labelWidth = 90;
|
||||
const props = defineProps({
|
||||
modelValue: Boolean,
|
||||
data: Object,
|
||||
done: Function,
|
||||
});
|
||||
const emits = defineEmits(["update:modelValue"]);
|
||||
const dialogVisible = ref(props.modelValue);
|
||||
const formData = reactive({
|
||||
product_type_parent_guid: '0',
|
||||
product_type_order: 100,
|
||||
});
|
||||
|
||||
const uoloadData = ref({
|
||||
dirName: "ProductType"
|
||||
})
|
||||
|
||||
watch(props, (v) => {
|
||||
dialogVisible.value = v.modelValue;
|
||||
formData.product_type_parent_guid = v.data.product_type_guid
|
||||
});
|
||||
|
||||
const rules = reactive({
|
||||
product_type_name: [
|
||||
{
|
||||
required: true,
|
||||
message: '产品类目名称不能为空'
|
||||
}
|
||||
],
|
||||
|
||||
});
|
||||
|
||||
|
||||
// --基础方法
|
||||
|
||||
// 打开弹窗时执行
|
||||
const openDialog = () => {
|
||||
getList();
|
||||
};
|
||||
|
||||
const closeDialog = () => {
|
||||
handleResetClick(formRef.value);
|
||||
dialogVisible.value = false;
|
||||
emits("update:modelValue", false);
|
||||
};
|
||||
|
||||
const handleAddClick = async (formEl) => {
|
||||
|
||||
if (!formEl) return;
|
||||
formEl.validate(async (valid) => {
|
||||
if (!valid) {
|
||||
return;
|
||||
}
|
||||
|
||||
const { code } = await addProductType(formData);
|
||||
if (code == 0) {
|
||||
closeDialog();
|
||||
props.done();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const handleResetClick = async (formEl) => {
|
||||
if (!formEl) return;
|
||||
formEl.resetFields();
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped></style>
|
||||
@ -0,0 +1,79 @@
|
||||
<template>
|
||||
<el-dialog v-model="props.modelValue" title="产品系列详情" width="900px" @closed="closeDialog" @open="openDialog">
|
||||
<el-form ref="formRef" :model="formData" :disabled="true">
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="系列标题" prop="product_type_name">
|
||||
<el-input v-model='formData.product_type_name' type="text" placeholder='请输入系列标题'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row>
|
||||
<el-col :span='12'>
|
||||
<el-form-item :label-width='labelWidth' label='系列图标' prop='product_type_icon'>
|
||||
<UploadImage ref='uploadRef' v-model='formData.product_type_icon' :data=uoloadData :limit='1' :fileSize='5'
|
||||
:drag='true' :isShowTip='false' />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span='12'>
|
||||
<el-form-item :label-width='labelWidth' label='系列封面' prop='product_type_cover'>
|
||||
<UploadImage ref='uploadRef' v-model='formData.product_type_cover' :data=uoloadData :limit='1' :fileSize='5'
|
||||
:drag='true' :isShowTip='false' />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
</el-row>
|
||||
</el-form>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref, watch } from "vue";
|
||||
import { isEmptyObject } from "~/utils/index";
|
||||
|
||||
|
||||
// --业务参数
|
||||
|
||||
|
||||
|
||||
// --业务方法
|
||||
|
||||
|
||||
|
||||
|
||||
// --基础参数
|
||||
const formRef = ref();
|
||||
const labelWidth = 100;
|
||||
|
||||
const props = defineProps({
|
||||
modelValue: Boolean,
|
||||
data: Object,
|
||||
done: Function,
|
||||
});
|
||||
const emits = defineEmits(["update:modelValue"]);
|
||||
const formData = ref({
|
||||
...props.data,
|
||||
});
|
||||
|
||||
|
||||
// --基础方法
|
||||
watch(props, (v) => {
|
||||
formData.value = v.data;
|
||||
|
||||
|
||||
});
|
||||
|
||||
// 打开弹窗时执行
|
||||
const openDialog = () => {
|
||||
|
||||
|
||||
};
|
||||
|
||||
const closeDialog = () => {
|
||||
emits("update:modelValue", false);
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped></style>
|
||||
@ -0,0 +1,158 @@
|
||||
<template>
|
||||
<el-dialog v-model="props.modelValue" title="编辑产品系列" width="600px" @closed="closeDialog" @open="openDialog">
|
||||
<el-form ref="formRef" :model="formData" :rules="rules">
|
||||
<el-row>
|
||||
<el-col :lg="24">
|
||||
<el-form-item :label-width="labelWidth" label="上级菜单" prop="product_type_parent_guid">
|
||||
<el-cascader class="w100" filterable :options="dataList"
|
||||
:props="{ checkStrictly: true, value: 'product_type_guid', label: 'product_type_name', emitPath: false }"
|
||||
placeholder="请选择上级菜单" clearable v-model="formData.product_type_parent_guid">
|
||||
<template #default="{ node, data }">
|
||||
<span>{{ data.product_type_name }}</span>
|
||||
<span v-if="!node.isLeaf"> ({{ data.children.length }}) </span>
|
||||
</template>
|
||||
</el-cascader>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-form-item :label-width="labelWidth" label="类目名称" prop="product_type_name">
|
||||
<el-input v-model='formData.product_type_name' placeholder='请输入类目名称'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-form-item :label-width="labelWidth" label="类目标题" prop="">
|
||||
<el-input v-model='formData.product_type_title' placeholder='请输入类目标题'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="24">
|
||||
<el-form-item :label-width="labelWidth" label="类目链接" prop="">
|
||||
<el-input v-model='formData.product_type_link' placeholder='请输入类目链接'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="排序" prop="product_type_order">
|
||||
<el-input-number v-model='formData.product_type_order' controls-position='right'></el-input-number>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row>
|
||||
<el-col :span='12'>
|
||||
<el-form-item :label-width='labelWidth' label='类目图标' prop='product_type_icon'>
|
||||
<UploadImage ref='uploadRef' v-model='formData.product_type_icon' :data=uoloadData :limit='1' :fileSize='5'
|
||||
:drag='true' :isShowTip='false' />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
</el-row>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button type="primary" @click="handleEditClick(formRef)">编辑</el-button>
|
||||
<el-button @click="handleResetClick(formRef)">重置</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref, watch } from "vue";
|
||||
import { editProductType, getProductTypeTree } from "~/service/product_type";
|
||||
import { useLoginStore } from "~/store";
|
||||
|
||||
// --业务参数
|
||||
|
||||
|
||||
|
||||
// --业务方法
|
||||
const dataList = ref();
|
||||
async function getList() {
|
||||
getProductTypeTree().then((res) => {
|
||||
if (res.code == 0) {
|
||||
dataList.value = res.data
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
// --基础参数
|
||||
const store = useLoginStore();
|
||||
const headers = {
|
||||
Accept: "application/json",
|
||||
...store.headers,
|
||||
};
|
||||
const formRef = ref();
|
||||
const labelWidth = 100;
|
||||
const props = defineProps({
|
||||
modelValue: Boolean,
|
||||
data: Object,
|
||||
done: Function,
|
||||
});
|
||||
const emits = defineEmits(["update:modelValue"]);
|
||||
const formData = ref({
|
||||
...props.data,
|
||||
});
|
||||
const uoloadData = ref({
|
||||
dirName: "ProductType"
|
||||
})
|
||||
|
||||
|
||||
// --基础方法
|
||||
watch(props, (v) => {
|
||||
formData.value = v.data;
|
||||
|
||||
});
|
||||
|
||||
// 打开弹窗时执行
|
||||
const openDialog = () => {
|
||||
getList();
|
||||
};
|
||||
|
||||
const closeDialog = () => {
|
||||
props.done();
|
||||
emits("update:modelValue", false);
|
||||
};
|
||||
|
||||
const rules = reactive({
|
||||
product_type_name: [
|
||||
{
|
||||
required: true,
|
||||
message: '产品系列标题不能为空'
|
||||
}
|
||||
]
|
||||
});
|
||||
|
||||
const handleEditClick = async (formEl) => {
|
||||
console.log(formData.value);
|
||||
if (!formEl) return;
|
||||
formEl.validate(async (valid) => {
|
||||
if (!valid) {
|
||||
return;
|
||||
}
|
||||
|
||||
const { code } = await editProductType(formData.value);
|
||||
if (code == 0) {
|
||||
closeDialog();
|
||||
props.done();
|
||||
}
|
||||
});
|
||||
};
|
||||
const handleResetClick = async (formEl) => {
|
||||
if (!formEl) return;
|
||||
formEl.resetFields();
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped></style>
|
||||
244
src/pages/index/business/products/product_type/index.vue
Normal file
244
src/pages/index/business/products/product_type/index.vue
Normal file
@ -0,0 +1,244 @@
|
||||
<template>
|
||||
<!-- 面包屑 -->
|
||||
<el-breadcrumb>
|
||||
<el-breadcrumb-item>产品类目管理</el-breadcrumb-item>
|
||||
<el-breadcrumb-item to="/product_type/list">产品类目列表</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
<!-- 搜索 -->
|
||||
<el-form inline :model="params">
|
||||
|
||||
|
||||
<el-form-item label="产品类目标题">
|
||||
<el-input v-model='params.product_type_name' placeholder='请输入产品类目标题'></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="getList()" icon="ElIconSearch">
|
||||
搜索
|
||||
</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-space style="margin-bottom: 10px;">
|
||||
<!-- 添加产品类目 -->
|
||||
<el-col :span="1">
|
||||
<el-button type="primary" @click="addProductTypeDialogVisible = true"> 添加 </el-button>
|
||||
</el-col>
|
||||
|
||||
<!-- 导入 -->
|
||||
<el-upload class="upload-demo" :action="importExcel" :headers="headers" :on-success="handleExcelSuccess"
|
||||
:on-progress="uploadLoading" :on-error="closeUploadLoading" style="margin-left: 10px" :show-file-list="false">
|
||||
<el-button type="primary">导入</el-button>
|
||||
</el-upload>
|
||||
|
||||
<!-- 导出 -->
|
||||
<el-button icon="ElIconDocument" @click="exportExcel(params)">导出</el-button>
|
||||
|
||||
<!-- 下载导入模板 -->
|
||||
<el-button icon="ElIconDownload" @click="downloadTemplate()">下载导入模板</el-button>
|
||||
|
||||
|
||||
<!-- 下拉操作 -->
|
||||
<el-dropdown v-if="selectionData.length">
|
||||
<el-button type="primary">
|
||||
批量操作<el-icon class="el-icon--right"><arrow-down /></el-icon>
|
||||
</el-button>
|
||||
<template #dropdown>
|
||||
<el-dropdown-menu>
|
||||
<el-dropdown-item @click="handleDelete(selectionData)">
|
||||
批量删除
|
||||
</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
</el-space>
|
||||
<!-- 数据表格 -->
|
||||
<el-table v-loading="loading" :data="dataList" ref="tableRef" highlight-current-row
|
||||
:onSelectionChange="data => (selectionData = data)" :default-expand-all="tableExpandAll" row-key="product_type_guid"
|
||||
:tree-props="{ children: 'children' }">
|
||||
<el-table-column type="selection" width="50" align="center" />
|
||||
<el-table-column prop="product_type_name" width="200" label="产品类目名称" :show-overflow-tooltip="true"> </el-table-column>
|
||||
<el-table-column prop="product_type_title" width="200" label="产品类目标题" :show-overflow-tooltip="true">
|
||||
</el-table-column>
|
||||
<el-table-column prop="product_type_icon" width="200" label="产品类目图标" :show-overflow-tooltip="true">
|
||||
<template #default="scope">
|
||||
<el-image :src="scope.row.product_type_icon" :preview-src-list="[scope.row.product_type_icon]"
|
||||
:preview-teleported="true"></el-image>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column prop="product_type_order" width="200" label="排序" sort>
|
||||
<template #default="scope">
|
||||
<el-input-number v-model='scope.row.product_type_order' controls-position="right"
|
||||
@change="handleEditProductType(scope.row)"></el-input-number>
|
||||
</template>
|
||||
</el-table-column>
|
||||
|
||||
<el-table-column label="操作" align="center" width="250" fixed='right'>
|
||||
<template #default="scope">
|
||||
<el-button size="small" type="primary" @click="handleAdd(scope.row)">添加</el-button>
|
||||
<el-button size="small" type="primary" @click="handleUpdate(scope.row)">编辑</el-button>
|
||||
<el-button size="small" type="danger" @click="handleDelete([scope.row])">删除</el-button>
|
||||
<!-- <el-button size="small" type="info" @click="handleDetail(scope.row)">查看</el-button> -->
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<!-- 添加产品类目 -->
|
||||
<AddProductTypeDialog v-model="addProductTypeDialogVisible" :data="AddProductTypeDialogRow" :done="() => getList()">
|
||||
</AddProductTypeDialog>
|
||||
<!-- 编辑产品类目 -->
|
||||
<EditProductTypeDialog v-model="EditProductTypeDialogVisible" :data="EditProductTypeDialogRow" :done="() => getList()">
|
||||
</EditProductTypeDialog>
|
||||
<!-- 产品类目详情 -->
|
||||
<DetailProductTypeDialog v-model="DetailProductTypeDialogVisible" :data="DetailProductTypeDialogRow">
|
||||
</DetailProductTypeDialog>
|
||||
</template>
|
||||
<script setup>
|
||||
import { ArrowDown } from '@element-plus/icons-vue';
|
||||
import { ref, reactive, onMounted, watch } from 'vue';
|
||||
import { useLoginStore } from "~/store";
|
||||
import { getProductTypeTree, editProductType, deleteProductType, exportExcel, downloadTemplate, importExcel } from '~/service/product_type';
|
||||
import AddProductTypeDialog from './components/AddProductTypeDialog.vue';
|
||||
import EditProductTypeDialog from './components/EditProductTypeDialog.vue';
|
||||
import DetailProductTypeDialog from './components/DetailProductTypeDialog.vue';
|
||||
import createDraw from 'hyw-drag'
|
||||
|
||||
|
||||
const tableRef = ref();
|
||||
const tableKey = ref(0);
|
||||
const selectionData = ref([]);
|
||||
const store = useLoginStore();
|
||||
|
||||
const addProductTypeDialogVisible = ref(false);
|
||||
const AddProductTypeDialogRow = ref({});
|
||||
const EditProductTypeDialogVisible = ref(false);
|
||||
const EditProductTypeDialogRow = ref({});
|
||||
const DetailProductTypeDialogVisible = ref(false);
|
||||
const DetailProductTypeDialogRow = ref({});
|
||||
|
||||
const tableExpandAll = ref(false)
|
||||
|
||||
const headers = {
|
||||
Accept: "application/json",
|
||||
...store.headers,
|
||||
};
|
||||
|
||||
|
||||
|
||||
// 查询参数
|
||||
const params = reactive({
|
||||
product_type_name: "",
|
||||
});
|
||||
|
||||
const handleCommand = ({ type, row }) => {
|
||||
switch (type) {
|
||||
case "detail":
|
||||
handleDetail(row);
|
||||
break;
|
||||
case 'delete':
|
||||
handleDelete([row]);
|
||||
break;
|
||||
}
|
||||
};
|
||||
|
||||
// 删除数据
|
||||
const handleDelete = data => {
|
||||
ElMessageBox.confirm(`您确定要删除该产品类目吗？`).then(async () => {
|
||||
const res = await deleteProductType({
|
||||
product_type_guid: data.map(v => v.product_type_guid).join()
|
||||
});
|
||||
if (res) {
|
||||
getList();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
// 添加
|
||||
function handleAdd(row) {
|
||||
addProductTypeDialogVisible.value = true
|
||||
AddProductTypeDialogRow.value = row
|
||||
}
|
||||
|
||||
// 修改
|
||||
function handleUpdate(row) {
|
||||
EditProductTypeDialogVisible.value = true
|
||||
EditProductTypeDialogRow.value = row
|
||||
}
|
||||
|
||||
// 详情
|
||||
function handleDetail(row) {
|
||||
DetailProductTypeDialogVisible.value = true
|
||||
DetailProductTypeDialogRow.value = row
|
||||
}
|
||||
|
||||
//排序
|
||||
async function handleEditProductType(data) {
|
||||
loading.value = true
|
||||
await editProductType(data);
|
||||
getList();
|
||||
}
|
||||
|
||||
|
||||
// 导入方法
|
||||
let loadingImoprt = null;
|
||||
const uploadLoading = () => {
|
||||
loadingImoprt = ElLoading.service({
|
||||
lock: true,
|
||||
text: "正在导入中...",
|
||||
background: "rgba(255, 255, 255, 0.7)",
|
||||
});
|
||||
};
|
||||
const closeUploadLoading = () => loadingImoprt.close();
|
||||
const handleExcelSuccess = (value) => {
|
||||
if (value.code == 0) {
|
||||
ElMessageBox.alert(value.msg, "导入信息", {
|
||||
dangerouslyUseHTMLString: true,
|
||||
confirmButtonText: "确定",
|
||||
});
|
||||
} else {
|
||||
ElMessage.error(value.msg);
|
||||
}
|
||||
closeUploadLoading();
|
||||
tableRef.value.reload();
|
||||
};
|
||||
|
||||
const loading = ref(false)
|
||||
const dataList = ref([])
|
||||
//排序
|
||||
let drag = ref(false)
|
||||
// 查询数据
|
||||
function getList() {
|
||||
loading.value = true
|
||||
getProductTypeTree(params).then((res) => {
|
||||
if (res.code == 0) {
|
||||
dataList.value = res.data
|
||||
setTimeout(() => {
|
||||
[...document.getElementsByClassName('el-table__row')].map(item => { item.classList.add('row1') });
|
||||
[...document.getElementsByClassName('el-table__row--level-1')].map(item => { item.classList.remove('row1') })
|
||||
drag.value === false && (drag.value = createDraw(document.getElementsByClassName('el-table__row')[0].parentElement))
|
||||
})
|
||||
loading.value = false
|
||||
}
|
||||
})
|
||||
|
||||
}
|
||||
|
||||
// watch(drag, () => {
|
||||
// drag.value.start(() => {
|
||||
// dataList.value.map(item => {
|
||||
// tableRef.value.toggleRowExpansion(item, false)
|
||||
// })
|
||||
// tableExpandAll.value = false
|
||||
// })
|
||||
// drag.value.drop((info) => {
|
||||
// // console.log(info)
|
||||
// let targetIdx = [...document.getElementsByClassName('row1')].indexOf(info.el)
|
||||
// let sourceIdx = [...document.getElementsByClassName('row1')].indexOf(info.info.source.el)
|
||||
// let orderIdx = dataList.value[sourceIdx]['product_type_order']
|
||||
// dataList.value[targetIdx]['product_type_order'] = orderIdx
|
||||
// handleEditProductType(dataList.value[targetIdx])
|
||||
// })
|
||||
// })
|
||||
getList()
|
||||
|
||||
|
||||
|
||||
</script>
|
||||
356
src/pages/index/dictionary/index.vue
Normal file
356
src/pages/index/dictionary/index.vue
Normal file
@ -0,0 +1,356 @@
|
||||
<template>
|
||||
<!-- 面包屑 -->
|
||||
<el-breadcrumb>
|
||||
<el-breadcrumb-item>系统管理</el-breadcrumb-item>
|
||||
<el-breadcrumb-item to="/system/dictionary">数据字典</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<template v-if="checkData.length">
|
||||
<el-button type="danger" @click="handleCheckDeleteClick">
|
||||
批量删除
|
||||
</el-button>
|
||||
</template>
|
||||
<el-input v-model="filterText" placeholder="搜索数据字典" />
|
||||
<el-row style="margin: 15px 0;">
|
||||
<!-- 导入 -->
|
||||
<el-upload class="upload-demo" :action="importExcel" :headers="headers" :on-success="handleExcelSuccess"
|
||||
:on-progress="uploadLoading" :on-error="closeUploadLoading" style="margin-left: 10px" :show-file-list="false">
|
||||
<el-button type="primary">导入</el-button>
|
||||
</el-upload>
|
||||
<!-- 下载导入模板 -->
|
||||
<el-button style="margin-left: 10px" icon="ElIconDownload" @click="downloadTemplate()">下载导入模板</el-button>
|
||||
</el-row>
|
||||
|
||||
<el-tree
|
||||
ref="treeRef"
|
||||
:filter-node-method="filterNode"
|
||||
:data="treeData"
|
||||
show-checkbox
|
||||
draggable
|
||||
:default-expanded-keys="treeExpandData"
|
||||
:highlight-current="true"
|
||||
:expand-on-click-node="true"
|
||||
node-key="id"
|
||||
@node-drop="handleDrop"
|
||||
@check="handleCheck"
|
||||
>
|
||||
<template #default="{ node, data }">
|
||||
<span class="custom-tree-node">
|
||||
<span>{{ node.label }}</span>
|
||||
<span>
|
||||
<a @click="handleTreeClick('create', data)"> 添加 </a>
|
||||
<a v-if="data.allow == 1" @click="handleTreeClick('edit', data)">
|
||||
编辑
|
||||
</a>
|
||||
</span>
|
||||
</span>
|
||||
</template>
|
||||
</el-tree>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<div v-if="model.dictionary_guid">
|
||||
<el-form ref="formRef" :model="model" :rules="rules">
|
||||
<el-form-item label="名称" prop="dictionary_name">
|
||||
<el-input v-model="model.dictionary_name" type="text"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="值" prop="dictionary_value">
|
||||
<el-input v-model="model.dictionary_value" type="text"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="排序" prop="dictionary_order">
|
||||
<el-input v-model="model.dictionary_order" type="number"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="状态" prop="dictionary_status">
|
||||
<el-switch
|
||||
v-model="model.dictionary_status"
|
||||
active-text="启用"
|
||||
inactive-text="停用"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="允许更新" prop="dictionary_allow_update">
|
||||
<el-switch
|
||||
v-model="model.dictionary_allow_update"
|
||||
active-text="启用"
|
||||
inactive-text="停用"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="回显样式" prop="dictionary_list_class">
|
||||
<el-select v-model="model.dictionary_list_class">
|
||||
<el-option
|
||||
v-for="item in listClassOptions"
|
||||
:key="item.value"
|
||||
:label="item.label + '(' + item.value + ')'"
|
||||
:value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="handleSaveClick">
|
||||
保存
|
||||
</el-button>
|
||||
<el-button
|
||||
v-if="model.dictionary_guid && model.dictionary_guid != 'create'"
|
||||
type="danger"
|
||||
@click="handleDeleteClick"
|
||||
>
|
||||
删除
|
||||
</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<div v-else>
|
||||
<el-empty description="请选择字典" />
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</template>
|
||||
<script setup>
|
||||
import { ref, reactive, watch } from 'vue';
|
||||
import {
|
||||
getDictionaryTree,
|
||||
addDictionary,
|
||||
updateDictionary,
|
||||
deleteDictionary,
|
||||
downloadTemplate,
|
||||
importExcel
|
||||
} from '~/service/dictionary';
|
||||
import { useLoginStore } from "~/store";
|
||||
|
||||
const store = useLoginStore();
|
||||
const headers = {
|
||||
Accept: "application/json",
|
||||
...store.headers,
|
||||
};
|
||||
|
||||
const formRef = ref();
|
||||
const treeRef = ref();
|
||||
const filterText = ref('');
|
||||
const treeData = ref([]);
|
||||
const treeExpandData = ref([]);
|
||||
const checkData = ref([]);
|
||||
const model = reactive({
|
||||
dictionary_guid: '',
|
||||
dictionary_parent_guid: '',
|
||||
dictionary_name: '',
|
||||
dictionary_value: '',
|
||||
dictionary_status: true,
|
||||
dictionary_index: 0,
|
||||
dictionary_order: 0,
|
||||
dictionary_allow_update: 0,
|
||||
dictionary_list_class: 'default',
|
||||
});
|
||||
// 数据标签回显样式
|
||||
const listClassOptions = ref([
|
||||
{
|
||||
value: 'default',
|
||||
label: '默认'
|
||||
},
|
||||
{
|
||||
value: 'primary',
|
||||
label: '主要'
|
||||
},
|
||||
{
|
||||
value: 'success',
|
||||
label: '成功'
|
||||
},
|
||||
{
|
||||
value: 'info',
|
||||
label: '信息'
|
||||
},
|
||||
{
|
||||
value: 'warning',
|
||||
label: '警告'
|
||||
},
|
||||
{
|
||||
value: 'danger',
|
||||
label: '危险'
|
||||
}
|
||||
])
|
||||
|
||||
const rules = {
|
||||
dictionary_name: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入字典名称'
|
||||
}
|
||||
],
|
||||
dictionary_order: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入字典排序'
|
||||
}
|
||||
]
|
||||
};
|
||||
|
||||
const loadTree = async () => {
|
||||
const { code, data } = await getDictionaryTree();
|
||||
if (code == 0) {
|
||||
treeData.value = data;
|
||||
data.forEach(element => {
|
||||
treeExpandData.value.push("0")
|
||||
});
|
||||
}
|
||||
};
|
||||
|
||||
loadTree();
|
||||
|
||||
watch(filterText, v => {
|
||||
treeRef.value.filter(v);
|
||||
});
|
||||
// 搜索树组件
|
||||
const filterNode = (value, data) => {
|
||||
if (!value) return true;
|
||||
return data.label.indexOf(value) !== -1;
|
||||
};
|
||||
// 拖拽排序
|
||||
const handleDrop = async (current, to, action) => {
|
||||
const currentData = current.data;
|
||||
const toData = to.data;
|
||||
console.log({
|
||||
current: currentData,
|
||||
to: toData,
|
||||
action
|
||||
});
|
||||
const data = {
|
||||
dictionary_guid: current.data.id,
|
||||
dictionary_parent_guid: '',
|
||||
dictionary_index: '',
|
||||
dictionary_order: ''
|
||||
};
|
||||
switch (action) {
|
||||
case 'before':
|
||||
data.dictionary_parent_guid = toData.parent_id;
|
||||
data.dictionary_index = toData.index;
|
||||
data.dictionary_order = toData.order + 1;
|
||||
break;
|
||||
case 'after':
|
||||
data.dictionary_parent_guid = toData.parent_id;
|
||||
data.dictionary_index = toData.index;
|
||||
data.dictionary_order = toData.order - 1;
|
||||
break;
|
||||
case 'inner':
|
||||
data.dictionary_parent_guid = toData.id;
|
||||
data.dictionary_index = toData.index + 1;
|
||||
data.dictionary_order = 0;
|
||||
break;
|
||||
}
|
||||
const { code } = await updateDictionary(data);
|
||||
if (code == 0) {
|
||||
loadTree();
|
||||
}
|
||||
};
|
||||
// 选中菜单
|
||||
const handleCheck = (_, { checkedKeys }) => {
|
||||
checkData.value = checkedKeys;
|
||||
};
|
||||
// 表单提交
|
||||
const handleSaveClick = async () => {
|
||||
try {
|
||||
await formRef.value.validate();
|
||||
const data = {
|
||||
...model,
|
||||
dictionary_status: model.dictionary_status ? 1 : 2,
|
||||
dictionary_allow_update: model.dictionary_allow_update ? 1 : 2
|
||||
};
|
||||
if (model.dictionary_guid === 'create') {
|
||||
const { code } = await addDictionary(data);
|
||||
if (code == 0) {
|
||||
loadTree();
|
||||
}
|
||||
model.dictionary_guid = '';
|
||||
} else {
|
||||
const { code } = await updateDictionary(data);
|
||||
if (code == 0) {
|
||||
loadTree();
|
||||
model.dictionary_guid = '';
|
||||
}
|
||||
}
|
||||
} catch (error) {}
|
||||
};
|
||||
// 批量删除
|
||||
const handleCheckDeleteClick = () => {
|
||||
ElMessageBox.alert('您确定要删除该字典吗？', '删除字典', {
|
||||
confirmButtonText: '确定'
|
||||
}).then(async () => {
|
||||
const { code } = await deleteDictionary({
|
||||
dictionary_guid: checkData.value.join()
|
||||
});
|
||||
if (code == 0) {
|
||||
loadTree();
|
||||
checkData.value = [];
|
||||
}
|
||||
});
|
||||
};
|
||||
// 删除字典
|
||||
const handleDeleteClick = () => {
|
||||
ElMessageBox.alert('您确定要删除该字典吗？', '删除字典', {
|
||||
confirmButtonText: '确定'
|
||||
}).then(async () => {
|
||||
const { code } = await deleteDictionary(model);
|
||||
if (code == 0) {
|
||||
loadTree();
|
||||
model.dictionary_guid = '';
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const handleTreeClick = (type, data) => {
|
||||
switch (type) {
|
||||
case 'create':
|
||||
model.dictionary_guid = 'create';
|
||||
model.dictionary_parent_guid = data.id;
|
||||
model.dictionary_index = data.index + 1;
|
||||
model.dictionary_name = '';
|
||||
model.dictionary_value = '';
|
||||
model.dictionary_order = 0;
|
||||
model.dictionary_status = true;
|
||||
model.dictionary_allow_update = true;
|
||||
model.dictionary_list_class = "default";
|
||||
break;
|
||||
case 'edit':
|
||||
model.dictionary_guid = data.id;
|
||||
model.dictionary_parent_guid = data.parent_id;
|
||||
model.dictionary_index = data.index;
|
||||
model.dictionary_name = data.label;
|
||||
model.dictionary_value = data.value;
|
||||
model.dictionary_order = data.order;
|
||||
model.dictionary_status = data.status == 1;
|
||||
model.dictionary_allow_update = data.allow == 1;
|
||||
model.dictionary_list_class = data.list_class;
|
||||
break;
|
||||
}
|
||||
};
|
||||
|
||||
let loading = null;
|
||||
const uploadLoading = () => {
|
||||
loading = ElLoading.service({
|
||||
lock: true,
|
||||
text: "正在导入中...",
|
||||
background: "rgba(255, 255, 255, 0.7)",
|
||||
});
|
||||
};
|
||||
const closeUploadLoading = () => loading.close();
|
||||
const handleExcelSuccess = (value) => {
|
||||
if (value.code == 0) {
|
||||
ElMessageBox.alert(value.msg, "导入信息", {
|
||||
dangerouslyUseHTMLString: true,
|
||||
confirmButtonText: "确定",
|
||||
});
|
||||
} else {
|
||||
ElMessage.error(value.msg);
|
||||
}
|
||||
closeUploadLoading();
|
||||
treeRef.value.reload();
|
||||
};
|
||||
|
||||
|
||||
</script>
|
||||
<style scoped>
|
||||
.custom-tree-node {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-size: 14px;
|
||||
padding-right: 8px;
|
||||
}
|
||||
</style>
|
||||
45
src/pages/index/exception/403.vue
Normal file
45
src/pages/index/exception/403.vue
Normal file
@ -0,0 +1,45 @@
|
||||
<template>
|
||||
<div class="flex flex-col justify-center page-container">
|
||||
<div class="text-center">
|
||||
<img src="~~/assets/images/exception/403.svg" alt="" />
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<h1 class="text-base text-gray-500">抱歉，你无权访问该页面</h1>
|
||||
<el-button type="primary" @click="goHome">回到首页</el-button>
|
||||
<el-button @click="goBack">返回</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { useRouter } from 'vue-router';
|
||||
const router = useRouter();
|
||||
function goHome() {
|
||||
router.push('/');
|
||||
}
|
||||
function goBack() {
|
||||
router.back();
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.page-container {
|
||||
width: 100%;
|
||||
border-radius: 4px;
|
||||
padding: 50px 0;
|
||||
height: 100vh;
|
||||
text-align: center;
|
||||
|
||||
.text-center {
|
||||
h1 {
|
||||
color: #666;
|
||||
padding: 20px 0;
|
||||
}
|
||||
}
|
||||
|
||||
img {
|
||||
width: 350px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
45
src/pages/index/exception/404.vue
Normal file
45
src/pages/index/exception/404.vue
Normal file
@ -0,0 +1,45 @@
|
||||
<template>
|
||||
<div class="flex flex-col justify-center page-container">
|
||||
<div class="text-center">
|
||||
<img src="~~/assets/images/exception/404.svg" alt="" />
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<h1 class="text-base text-gray-500">抱歉，你访问的页面不存在</h1>
|
||||
<el-button type="primary" @click="goHome">回到首页</el-button>
|
||||
<el-button @click="goBack">返回</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { useRouter } from 'vue-router';
|
||||
const router = useRouter();
|
||||
function goHome() {
|
||||
router.push('/');
|
||||
}
|
||||
function goBack() {
|
||||
router.back();
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.page-container {
|
||||
width: 100%;
|
||||
border-radius: 4px;
|
||||
padding: 50px 0;
|
||||
height: 100vh;
|
||||
text-align: center;
|
||||
|
||||
.text-center {
|
||||
h1 {
|
||||
color: #666;
|
||||
padding: 20px 0;
|
||||
}
|
||||
}
|
||||
|
||||
img {
|
||||
width: 350px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
45
src/pages/index/exception/500.vue
Normal file
45
src/pages/index/exception/500.vue
Normal file
@ -0,0 +1,45 @@
|
||||
<template>
|
||||
<div class="flex flex-col justify-center page-container">
|
||||
<div class="text-center">
|
||||
<img src="~~/assets/images/exception/500.svg" alt="" />
|
||||
</div>
|
||||
<div class="text-center">
|
||||
<h1 class="text-base text-gray-500">抱歉，服务器出错了</h1>
|
||||
<el-button type="primary" @click="goHome">回到首页</el-button>
|
||||
<el-button @click="goBack">返回</el-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { useRouter } from 'vue-router';
|
||||
const router = useRouter();
|
||||
function goHome() {
|
||||
router.push('/');
|
||||
}
|
||||
function goBack() {
|
||||
router.back();
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.page-container {
|
||||
width: 100%;
|
||||
border-radius: 4px;
|
||||
padding: 50px 0;
|
||||
height: 100vh;
|
||||
text-align: center;
|
||||
|
||||
.text-center {
|
||||
h1 {
|
||||
color: #666;
|
||||
padding: 20px 0;
|
||||
}
|
||||
}
|
||||
|
||||
img {
|
||||
width: 350px;
|
||||
margin: 0 auto;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
49
src/pages/index/flow/browserCount/index.vue
Normal file
49
src/pages/index/flow/browserCount/index.vue
Normal file
@ -0,0 +1,49 @@
|
||||
<template>
|
||||
|
||||
<div class="flow-select-main">
|
||||
<div style="font-size:12px;margin:20px 0;">累计：{{total}}</div>
|
||||
|
||||
<el-table :data="tableData" :header-cell-style="{'background':'#f6f8fb!important',
|
||||
'color':'#495060'}"
|
||||
:cell-style="{'padding':'20px 0 !important','font-size':'12px'}">
|
||||
<el-table-column label="序号" prop="flow_id" width="180"/>
|
||||
<el-table-column label="浏览器" prop="flow_browser" width="180"/>
|
||||
<el-table-column label="访问量" prop="number" width="180"/>
|
||||
<el-table-column label="比例" prop="percentage">
|
||||
<template #default="scope">
|
||||
<div> <el-progress :text-inside="true" :stroke-width="26" :percentage="scope.row.percentage" /></div>
|
||||
<div class="percentage-txt">{{ scope.row.percentage }} %</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import {getFlowBrowserCount} from "~/service/flow.js"
|
||||
import {reactive,ref} from "vue";
|
||||
let tableData = ref([
|
||||
])
|
||||
let total = ref(0);
|
||||
|
||||
|
||||
function getList() {
|
||||
getFlowBrowserCount().then((res) => {
|
||||
if (res['code'] == 0) {
|
||||
tableData.value = res.data['GDP']
|
||||
total.value = res['count']
|
||||
}
|
||||
})
|
||||
}
|
||||
getList()
|
||||
|
||||
|
||||
</script>
|
||||
<style scoped>
|
||||
.el-card__body{
|
||||
padding-top:20px!important;
|
||||
}
|
||||
</style>
|
||||
58
src/pages/index/flow/dayCount/index.vue
Normal file
58
src/pages/index/flow/dayCount/index.vue
Normal file
@ -0,0 +1,58 @@
|
||||
<template>
|
||||
<div class="flow-select-main">
|
||||
<div style="font-size:12px;margin:20px 0;">统计年月：{{ tableData['current_date']['y'] }}年{{tableData['current_date']['m']}}月 本月累计：{{total}}</div>
|
||||
<el-select v-model="timeVal" class="m-2" style="margin-bottom: 20px;" placeholder="Select" @change="selectChang">
|
||||
<el-option
|
||||
v-for="item in [{value:'0',label:'当前月'},{value:'-1',label:'前一月'},{value:'-2',label:'前两月'}]"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
|
||||
<el-table :data="tableData['select']" :header-cell-style="{'background':'#f6f8fb!important',
|
||||
'color':'#495060'}"
|
||||
:cell-style="{'padding':'20px 0 !important','font-size':'12px'}">
|
||||
<el-table-column label="日期" prop="flow_Date" width="180"/>
|
||||
<el-table-column label="星期" prop="flow_week" width="180"/>
|
||||
<el-table-column label="访问量" prop="number"/>
|
||||
<el-table-column label="比例" prop="percentage">
|
||||
<template #default="scope">
|
||||
<div> <el-progress :text-inside="true" :stroke-width="26" :percentage="scope.row.percentage" /></div>
|
||||
<div class="percentage-txt">{{ scope.row.percentage }} %</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {getFlowDayCount} from "~/service/flow.js"
|
||||
import {reactive, ref, watchEffect} from "vue";
|
||||
let tableData = ref({'current_date':{y:'',m:''}})
|
||||
let total = ref(0);
|
||||
let timeVal = ref('当前月')
|
||||
let i = 0
|
||||
function getList(param) {
|
||||
getFlowDayCount(param || {current_month:0}).then((res) => {
|
||||
if (res.code == 0) {
|
||||
tableData.value = res.data
|
||||
total.value = res.count
|
||||
console.log(res,'s')
|
||||
}
|
||||
})
|
||||
}
|
||||
getList()
|
||||
|
||||
const selectChang = function (val){
|
||||
getList({current_month:val})
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.percentage-txt{
|
||||
font-size: 13px!important;
|
||||
}
|
||||
|
||||
</style>
|
||||
52
src/pages/index/flow/flowSelect/index.vue
Normal file
52
src/pages/index/flow/flowSelect/index.vue
Normal file
@ -0,0 +1,52 @@
|
||||
<template>
|
||||
|
||||
<div class="flow-select-main">
|
||||
<el-table :data="tableData" :header-cell-style="{'background':'#f6f8fb!important',
|
||||
'color':'#495060'}"
|
||||
:cell-style="{'padding':'20px 0 !important','font-size':'12px'}">
|
||||
<el-table-column label="记录号" prop="flow_record_no" width="180"/>
|
||||
<el-table-column label="访问者IP" prop="flow_visitor_ip" width="180"/>
|
||||
<el-table-column label="所在地" prop="flow_location">
|
||||
<template #default="scope">
|
||||
<div> {{scope.row.flow_location }}</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="访问日期" prop="flow_create_time"/>
|
||||
<el-table-column label="来源" prop="flow_source"/>
|
||||
</el-table>
|
||||
</div>
|
||||
|
||||
<pagination v-model:limit="queryParams.limit" v-model:page="queryParams.page" :total="total"
|
||||
@pagination="getList"/>
|
||||
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import {getFlowRecord} from "~/service/flow.js"
|
||||
import {reactive,ref} from "vue";
|
||||
let tableData = ref([
|
||||
])
|
||||
let total = ref(0);
|
||||
const queryParams = reactive({
|
||||
page: 1,
|
||||
limit: 20
|
||||
})
|
||||
|
||||
function getList() {
|
||||
getFlowRecord(queryParams).then((res) => {
|
||||
if (res.code == 0) {
|
||||
console.log(res,'s')
|
||||
tableData.value = res.data
|
||||
total.value = res.count
|
||||
}
|
||||
})
|
||||
}
|
||||
getList()
|
||||
|
||||
|
||||
</script>
|
||||
<style scoped>
|
||||
.el-card__body{
|
||||
padding-top:20px!important;
|
||||
}
|
||||
</style>
|
||||
55
src/pages/index/flow/index.vue
Normal file
55
src/pages/index/flow/index.vue
Normal file
@ -0,0 +1,55 @@
|
||||
<template>
|
||||
<div class="flow-main" @click="swiperIdx($event)">
|
||||
<template v-for="(item,idx) in navArr">
|
||||
<div :class="idx === navIdx ? 'flow-items active' : 'flow-items'">{{item.name}}</div>
|
||||
</template>
|
||||
</div>
|
||||
<component :is="navArr[navIdx]['components']"></component>
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import {ref} from "vue";
|
||||
import dayCount from './dayCount/index.vue'
|
||||
import flowSelect from './flowSelect/index.vue'
|
||||
import monthCount from './monthCount/index.vue'
|
||||
import browserCount from './browserCount/index.vue'
|
||||
import sourceCount from './sourceCount/index.vue'
|
||||
|
||||
let navArr = [
|
||||
{
|
||||
name:'访问记录',
|
||||
components:flowSelect
|
||||
},
|
||||
{
|
||||
name:'日统计',
|
||||
components:dayCount
|
||||
},
|
||||
{
|
||||
name:'月统计',
|
||||
components:monthCount
|
||||
},
|
||||
{
|
||||
name:'浏览器统计',
|
||||
components:browserCount
|
||||
},
|
||||
{
|
||||
name:'来源统计',
|
||||
components:sourceCount
|
||||
},
|
||||
],
|
||||
navIdx = ref(0)
|
||||
|
||||
let swiperIdx = function (e){
|
||||
let tag = e.target
|
||||
if(tag.classList[0] === 'flow-items'){
|
||||
let oFlowItems = document.getElementsByClassName('flow-items')
|
||||
oFlowItems[navIdx.value].classList.remove('active')
|
||||
navIdx.value = [...oFlowItems].indexOf(tag)
|
||||
oFlowItems[navIdx.value].classList.add('active')
|
||||
|
||||
}
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style src="~/styles/flow/index.scss"></style>
|
||||
58
src/pages/index/flow/monthCount/index.vue
Normal file
58
src/pages/index/flow/monthCount/index.vue
Normal file
@ -0,0 +1,58 @@
|
||||
<template>
|
||||
<div class="flow-select-main">
|
||||
<div style="font-size:12px;margin:20px 0;">统计年月：{{ tableData['current_date']['y'] }}年 当年累计：{{total}}</div>
|
||||
<el-select v-model="timeVal" class="m-2" style="margin-bottom: 20px;" placeholder="Select" @change="selectChang">
|
||||
<el-option
|
||||
v-for="item in [{value:'0',label:'当前年'},{value:'-1',label:'前一年'},{value:'-2',label:'前两年'}]"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
/>
|
||||
</el-select>
|
||||
|
||||
<el-table :data="tableData['select']" :header-cell-style="{'background':'#f6f8fb!important',
|
||||
'color':'#495060'}"
|
||||
:cell-style="{'padding':'20px 0 !important','font-size':'12px'}">
|
||||
<el-table-column label="日期" prop="flow_Date" width="180"/>
|
||||
<el-table-column label="访问量" prop="number"/>
|
||||
<el-table-column label="比例" prop="percentage">
|
||||
<template #default="scope">
|
||||
<div> <el-progress :text-inside="true" :stroke-width="26" :percentage="scope.row.percentage" /></div>
|
||||
<div class="percentage-txt">{{ scope.row.percentage }} %</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import {getFlowMonthCount} from "~/service/flow.js"
|
||||
import {reactive, ref, watchEffect} from "vue";
|
||||
let tableData = ref({'current_date':{y:'',m:''}})
|
||||
let total = ref(0);
|
||||
let timeVal = ref('当前年')
|
||||
let i = 0
|
||||
function getList(param) {
|
||||
getFlowMonthCount(param || {current_year:0}).then((res) => {
|
||||
if (res.code == 0) {
|
||||
tableData.value = res.data
|
||||
total.value = res.count
|
||||
console.log(res,'s')
|
||||
}
|
||||
})
|
||||
}
|
||||
getList()
|
||||
|
||||
const selectChang = function (val){
|
||||
getList({current_year:val})
|
||||
}
|
||||
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.percentage-txt{
|
||||
font-size: 13px!important;
|
||||
|
||||
}
|
||||
|
||||
</style>
|
||||
51
src/pages/index/flow/sourceCount/index.vue
Normal file
51
src/pages/index/flow/sourceCount/index.vue
Normal file
@ -0,0 +1,51 @@
|
||||
<template>
|
||||
|
||||
<div class="flow-select-main">
|
||||
<div style="font-size:12px;margin:20px 0;">累计：{{total}}</div>
|
||||
|
||||
<el-table :data="tableData" :header-cell-style="{'background':'#f6f8fb!important',
|
||||
'color':'#495060'}"
|
||||
:cell-style="{'padding':'20px 0 !important','font-size':'12px'}">
|
||||
<el-table-column label="序号" prop="flow_id" width="180"/>
|
||||
<el-table-column label="来源" prop="flow_source" width="180"/>
|
||||
<el-table-column label="访问页面" prop="flow_target" width="180"/>
|
||||
<el-table-column label="操作系统" prop="flow_os" width="180"/>
|
||||
<el-table-column label="访问量" prop="number" width="180"/>
|
||||
<el-table-column label="比例" prop="percentage">
|
||||
<template #default="scope">
|
||||
<div> <el-progress :text-inside="true" :stroke-width="26" :percentage="scope.row.percentage" /></div>
|
||||
<div class="percentage-txt">{{ scope.row.percentage }} %</div>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</template>
|
||||
|
||||
<script lang="ts" setup>
|
||||
import {getFlowSourceCount} from "~/service/flow.js"
|
||||
import {reactive,ref} from "vue";
|
||||
let tableData = ref([
|
||||
])
|
||||
let total = ref(0);
|
||||
|
||||
|
||||
function getList() {
|
||||
getFlowSourceCount().then((res) => {
|
||||
if (res['code'] == 0) {
|
||||
tableData.value = res.data['GDP']
|
||||
total.value = res['count']
|
||||
}
|
||||
})
|
||||
}
|
||||
getList()
|
||||
|
||||
|
||||
</script>
|
||||
<style scoped>
|
||||
.el-card__body{
|
||||
padding-top:20px!important;
|
||||
}
|
||||
</style>
|
||||
49
src/pages/index/gen/basicInfoForm.vue
Normal file
49
src/pages/index/gen/basicInfoForm.vue
Normal file
@ -0,0 +1,49 @@
|
||||
<template>
|
||||
<el-form ref="basicInfoForm" :model="info" :rules="rules" label-width="100px">
|
||||
<el-row>
|
||||
<el-col :lg="6">
|
||||
<el-form-item label="表名称" prop="tableName">
|
||||
<el-input placeholder="请输入仓库名称" v-model="info.tableName" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :lg="6">
|
||||
<el-form-item label="表描述" prop="tableComment">
|
||||
<el-input placeholder="请输入" v-model="info.tableComment" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :lg="6">
|
||||
<el-form-item label="实体类名称" prop="className">
|
||||
<el-input placeholder="请输入" v-model="info.className" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :lg="6">
|
||||
<el-form-item label="作者" prop="functionAuthor">
|
||||
<el-input placeholder="请输入" v-model="info.functionAuthor" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :lg="24">
|
||||
<el-form-item label="备注" prop="remark">
|
||||
<el-input type="textarea" :rows="3" v-model="info.remark"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</el-form>
|
||||
</template>
|
||||
<script setup name="BasicInfoForm">
|
||||
import { ref, onMounted, reactive } from 'vue'
|
||||
|
||||
let basicInfoForm = ref(null)
|
||||
const props = defineProps({
|
||||
info: {
|
||||
type: Object,
|
||||
default: null,
|
||||
},
|
||||
})
|
||||
const rules = reactive({
|
||||
tableName: [{ required: true, message: '请输入表名称', trigger: 'blur' }],
|
||||
tableComment: [{ required: true, message: '请输入表描述', trigger: 'blur' }],
|
||||
className: [{ required: true, message: '请输入实体类名称', trigger: 'blur' }],
|
||||
functionAuthor: [{ required: true, message: '请输入作者', trigger: 'blur' }],
|
||||
})
|
||||
</script>
|
||||
242
src/pages/index/gen/editTable.vue
Normal file
242
src/pages/index/gen/editTable.vue
Normal file
@ -0,0 +1,242 @@
|
||||
<template>
|
||||
<el-card>
|
||||
<el-tabs v-model="activeName" tab-position="top">
|
||||
<el-tab-pane label="基本信息" name="basic">
|
||||
<basic-info-form ref="basicInfo" :info="info" />
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="生成信息" name="genInfo">
|
||||
<gen-info-form ref="genInfo" :info="info" :columns="columns" />
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="字段信息" name="cloum">
|
||||
<el-table ref="dragTableRef" v-loading="loading" :data="columns" row-key="columnId" min-height="80px"
|
||||
:max-height="tableHeight">
|
||||
<el-table-column label="#" type="index" class-name="allowDrag" width="60" fixed />
|
||||
<el-table-column label="字段列名" prop="columnName" :show-overflow-tooltip="true" width="200" fixed />
|
||||
<el-table-column label="字段描述" fixed width="120">
|
||||
<template #default="scope">
|
||||
<el-input v-model="scope.row.columnComment" :ref="setColumnsRef"
|
||||
@keydown="nextFocus(scope.row, scope.$index, $event)"> </el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="物理类型" prop="columnType" :show-overflow-tooltip="true" width="90" />
|
||||
<el-table-column label="新增" width="60" align="center" v-if="info.tplCategory != 'select'">
|
||||
<template #default="scope">
|
||||
<el-checkbox v-model="scope.row.isInsert" :disabled="scope.row.isIncrement"></el-checkbox>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="编辑" width="60" align="center" v-if="info.tplCategory != 'select'">
|
||||
<template #default="scope">
|
||||
<el-checkbox v-model="scope.row.isEdit" :disabled="scope.row.isPk || scope.row.isIncrement"></el-checkbox>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<!-- <el-table-column label="排序" width="60" align="center">
|
||||
<template #default="scope">
|
||||
<el-checkbox v-model="scope.row.isSort"
|
||||
:disabled="scope.row.htmlType == 'imageUpload' || scope.row.htmlType == 'fileUpload'"></el-checkbox>
|
||||
</template>
|
||||
</el-table-column> -->
|
||||
<el-table-column label="列表" width="60" align="center">
|
||||
<template #default="scope">
|
||||
<el-checkbox v-model="scope.row.isList"></el-checkbox>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="查询" width="60" align="center">
|
||||
<template #default="scope">
|
||||
<el-checkbox v-model="scope.row.isQuery"
|
||||
:disabled="scope.row.htmlType == 'imageUpload' || scope.row.htmlType == 'fileUpload'">
|
||||
</el-checkbox>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="查询方式" width="90" align="center">
|
||||
<template #default="scope">
|
||||
<el-select v-model="scope.row.queryType" :disabled="scope.row.htmlType == 'datetime'"
|
||||
v-if="scope.row.isQuery">
|
||||
<el-option label="=" value="EQ" />
|
||||
<el-option label="!=" value="NE" />
|
||||
<el-option label=">" value="GT" />
|
||||
<el-option label=">=" value="GTE" />
|
||||
<el-option label="<" value="LT" />
|
||||
<el-option label="<=" value="LTE" />
|
||||
<el-option label="LIKE" value="LIKE" />
|
||||
<el-option label="BETWEEN" value="BETWEEN" />
|
||||
</el-select>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="必填" width="60" align="center">
|
||||
<template #default="scope">
|
||||
<el-checkbox v-model="scope.row.isRequired"></el-checkbox>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="表单显示类型" width="140">
|
||||
<template #default="scope">
|
||||
<el-select v-model="scope.row.htmlType">
|
||||
<el-option label="文本框" value="input" />
|
||||
<el-option label="数字框" value="inputNumber" />
|
||||
<el-option label="文本域" value="textarea" />
|
||||
<el-option label="下拉框" value="select" />
|
||||
<!-- <el-option label="单选框" value="radio" /> -->
|
||||
<!-- <el-option label="复选框" value="checkbox" /> -->
|
||||
<el-option label="日期控件" value="datetime" />
|
||||
<el-option label="图片上传" value="imageUpload" />
|
||||
<el-option label="文件上传" value="fileUpload" />
|
||||
<el-option label="富文本控件" value="editor" />
|
||||
<el-option label="switch开关" value="switch" />
|
||||
<el-option label="评分" value="rate" />
|
||||
<el-option label="地图" value="map" />
|
||||
<!-- <el-option label="自定义输入框" value="customInput" /> -->
|
||||
</el-select>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="字典类型" min-width="140">
|
||||
<template #default="scope">
|
||||
<el-select v-model="scope.row.dictType" clearable filterable placeholder="请选择"
|
||||
v-if="scope.row.htmlType == 'select' || scope.row.htmlType == 'switch' || scope.row.htmlType == 'checkbox'">
|
||||
<el-option v-for="dict in dictOptions" :key="dict.dictionary_value" :label="dict.dictionary_name"
|
||||
:value="dict.dictionary_value">
|
||||
<span style="float: left">{{ dict.dictionary_name }}</span>
|
||||
<span style="float: right; color: #8492a6; font-size: 13px">{{ dict.dictionary_value }}</span>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="备注" align="center" width="200">
|
||||
<template #default="scope">
|
||||
<el-input v-model="scope.row.remark"> </el-input>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
<footer class="mt20" style="text-align: center">
|
||||
<el-button type="primary" icon="check" @click="submitForm()">提交</el-button>
|
||||
<el-button type="success" icon="refresh" @click="handleQuery()">刷新</el-button>
|
||||
<el-button icon="back" @click="close()">返回</el-button>
|
||||
</footer>
|
||||
</el-card>
|
||||
</template>
|
||||
<script setup name="genedit">
|
||||
// import { updateGenTable, getGenTable } from '@/api/tool/gen'
|
||||
import { getGenTableDetail , updateGenTable } from '~/service/Gen';
|
||||
import { getDictionaryList } from '~/service/Dictionary';
|
||||
// import { listType } from '@/api/system/dict/type'
|
||||
import basicInfoForm from './basicInfoForm.vue'
|
||||
import genInfoForm from './genInfoForm.vue'
|
||||
import { useRoute, useRouter } from 'vue-router'
|
||||
import Sortable from 'sortablejs'
|
||||
import { ref, onMounted, reactive, watch, provide } from 'vue'
|
||||
|
||||
// 选中选项卡的 name
|
||||
const activeName = ref('cloum')
|
||||
// 表格的高度
|
||||
const tableHeight = ref(document.documentElement.scrollHeight - 275 + 'px')
|
||||
// 表列信息
|
||||
const columns = ref([])
|
||||
// 字典信息
|
||||
const dictOptions = ref([])
|
||||
// 表详细信息
|
||||
const info = ref({})
|
||||
const loading = ref(true)
|
||||
const dragTableRef = ref()
|
||||
const route = useRoute()
|
||||
const router = useRouter()
|
||||
const basicInfo = ref(null)
|
||||
const genInfo = ref(null)
|
||||
// const { proxy } = getCurrentInstance()
|
||||
|
||||
async function handleQuery() {
|
||||
const tableId = route.query && route.query.tableId
|
||||
if (tableId) {
|
||||
// 获取表详细信息
|
||||
await getGenTableDetail({ tableId: tableId }).then((res) => {
|
||||
loading.value = false
|
||||
columns.value = res.columns
|
||||
info.value = { ...res.data, ...res.data.options }
|
||||
console.log(info.value, '13423424342');
|
||||
})
|
||||
}
|
||||
}
|
||||
/** 提交按钮 */
|
||||
function submitForm() {
|
||||
let genTable = info.value
|
||||
genTable.columns = columns.value
|
||||
// console.log(genTable,"值");
|
||||
|
||||
updateGenTable(genTable).then((res) => {
|
||||
// proxy.$modal.msgSuccess(res.msg)
|
||||
ElMessage({
|
||||
message: res.msg,
|
||||
type: 'success',
|
||||
})
|
||||
if (res.code === 200) {
|
||||
close()
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
function getFormPromise(form) {
|
||||
return new Promise((resolve) => {
|
||||
form.validate((res) => {
|
||||
resolve(res)
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
/** 查询字典下拉列表 */
|
||||
getDictionaryList().then((response) => {
|
||||
dictOptions.value = response.data
|
||||
})
|
||||
/** 关闭按钮 */
|
||||
function close() {
|
||||
router.push({
|
||||
path: '/gen',
|
||||
query: { page: 1 },
|
||||
})
|
||||
// proxy.$tab.closeOpenPage(obj)
|
||||
}
|
||||
|
||||
/*************** table column 回车代码 start*************/
|
||||
// 动态ref设置值
|
||||
const columnRefs = ref([])
|
||||
const setColumnsRef = (el) => {
|
||||
if (el) {
|
||||
columnRefs.value.push(el)
|
||||
}
|
||||
}
|
||||
|
||||
// 回车到下一行
|
||||
function nextFocus(row, index, e) {
|
||||
var length = columnRefs.value.length
|
||||
var keyCode = e.keyCode || e.which || e.charCode
|
||||
if (keyCode === 13) {
|
||||
if (length - 1 == index) {
|
||||
console.log('到最后一行了')
|
||||
} else {
|
||||
columnRefs.value[index + 1].focus()
|
||||
}
|
||||
}
|
||||
}
|
||||
/*************** table column 回车代码 end *************/
|
||||
// 拖动排序
|
||||
const tableSort = () => {
|
||||
const tbody = document.querySelector('.el-table__body > tbody')
|
||||
|
||||
Sortable.create(tbody, {
|
||||
onEnd: (evt) => {
|
||||
const targetRow = columns.value.splice(evt.oldIndex, 1)[0]
|
||||
columns.value.splice(evt.newIndex, 0, targetRow)
|
||||
for (const index in columns.value) {
|
||||
columns.value[index].sort = parseInt(index) + 1
|
||||
}
|
||||
nextTick(() => {
|
||||
console.log(columns.value)
|
||||
})
|
||||
},
|
||||
})
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
tableSort()
|
||||
})
|
||||
|
||||
handleQuery()
|
||||
</script>
|
||||
286
src/pages/index/gen/genInfoForm.vue
Normal file
286
src/pages/index/gen/genInfoForm.vue
Normal file
@ -0,0 +1,286 @@
|
||||
<template>
|
||||
<el-form ref="genInfoForm" :model="info" :rules="rules" label-width="150px">
|
||||
<el-row>
|
||||
<el-col :lg="12">
|
||||
<el-form-item prop="tplCategory">
|
||||
<template #label>生成模板</template>
|
||||
<el-select v-model="info.tplCategory" @change="tplSelectChange">
|
||||
<el-option label="单表（增删改查）" value="crud" />
|
||||
<el-option label="门户静态模块（查询修改）" value="web_static" />
|
||||
<!-- <el-option label="树表（增删改查）" value="tree" /> -->
|
||||
<!-- <el-option label="导航查询(1对1)" value="subNav"></el-option> -->
|
||||
<!-- <el-option label="导航查询(1对多)" value="subNavMore"></el-option> -->
|
||||
<!-- <el-option label="主子表（增删改查）" value="sub" /> -->
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :lg="12">
|
||||
<el-form-item prop="moduleName">
|
||||
<template #label>
|
||||
生成模块名
|
||||
<el-tooltip content="可理解为子系统名，例如 system、user、tool（一般文件夹归类）" placement="top">
|
||||
<el-icon>
|
||||
<question-filled />
|
||||
</el-icon>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
<el-input v-model="info.moduleName" auto-complete="" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :lg="12">
|
||||
<el-form-item prop="businessName">
|
||||
<template #label>
|
||||
生成业务名
|
||||
<el-tooltip content="可理解为功能英文名，例如 user" placement="top">
|
||||
<el-icon>
|
||||
<question-filled />
|
||||
</el-icon>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
<el-input v-model="info.businessName" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :lg="12">
|
||||
<el-form-item prop="functionName">
|
||||
<template #label>
|
||||
生成功能名
|
||||
<el-tooltip content="用作类描述，例如 用户,代码生成,文章系统" placement="top">
|
||||
<el-icon>
|
||||
<question-filled />
|
||||
</el-icon>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
<el-input v-model="info.functionName" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<!-- <el-col :lg="12">
|
||||
<el-form-item>
|
||||
<template #label>
|
||||
上级菜单
|
||||
<el-tooltip content="分配到指定菜单下，例如 系统管理" placement="top">
|
||||
<el-icon>
|
||||
<question-filled />
|
||||
</el-icon>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
<el-cascader
|
||||
class="w100"
|
||||
:options="menuOptions"
|
||||
:props="{ checkStrictly: true, value: 'key', label: 'name', emitPath: false }"
|
||||
placeholder="请选择上级菜单"
|
||||
clearable
|
||||
v-model="info.parentMenuId">
|
||||
<template #default="{ node, data }">
|
||||
<span>{{ data.name }}</span>
|
||||
<span v-if="!node.isLeaf"> ({{ data.children.length }}) </span>
|
||||
</template>
|
||||
</el-cascader>
|
||||
</el-form-item>
|
||||
</el-col> -->
|
||||
<el-col :lg="12">
|
||||
<el-form-item label="默认查询排序字段">
|
||||
<el-select v-model="info.SortField" placeholder="请选择字段" class="mr10" clearable="">
|
||||
<el-option v-for="item in columns" :key="item.columnId" :label="item.columnName" :value="item.columnName"> </el-option>
|
||||
</el-select>
|
||||
|
||||
<el-radio v-model="info.SortType" label="asc">正序</el-radio>
|
||||
<el-radio v-model="info.SortType" label="desc">倒序</el-radio>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :lg="12">
|
||||
<el-form-item prop="isSort">
|
||||
<template #label>
|
||||
排序处理
|
||||
<el-tooltip content="加上模型层排序处理,控制器加上事务,列表展示" placement="top">
|
||||
<el-icon>
|
||||
<question-filled />
|
||||
</el-icon>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
<el-radio v-model="info.isSort" label="0">不需要</el-radio>
|
||||
<el-radio v-model="info.isSort" label="1">需要</el-radio>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :lg="24" v-if="info.genType == '1'">
|
||||
<el-form-item prop="genPath">
|
||||
<template #label>
|
||||
自定义路径
|
||||
<el-tooltip content="填写磁盘绝对路径，若不填写，则生成到当前Web项目下" placement="top">
|
||||
<el-icon>
|
||||
<question-filled />
|
||||
</el-icon>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
<el-input v-model="info.genPath"></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :lg="24" v-show="info.tplCategory != 'select'">
|
||||
<el-form-item label="显示按钮">
|
||||
<el-checkbox-group v-model="info.CheckedBtn" @change="checkedBtnSelect">
|
||||
<el-checkbox :label="1">
|
||||
<el-tag>添加</el-tag>
|
||||
</el-checkbox>
|
||||
<el-checkbox :label="2">
|
||||
<el-tag type="success">修改</el-tag>
|
||||
</el-checkbox>
|
||||
<el-checkbox :label="3">
|
||||
<el-tag type="danger">删除</el-tag>
|
||||
</el-checkbox>
|
||||
<el-checkbox :label="4">
|
||||
<el-tag type="warning">导出</el-tag>
|
||||
</el-checkbox>
|
||||
<el-checkbox :label="6">
|
||||
<el-tag type="primary">导入</el-tag>
|
||||
</el-checkbox>
|
||||
<el-checkbox :label="5">
|
||||
<el-tag type="info">查看</el-tag>
|
||||
</el-checkbox>
|
||||
</el-checkbox-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row v-show="info.tplCategory == 'tree'">
|
||||
<h4 class="form-header">其他信息</h4>
|
||||
<el-col :lg="12">
|
||||
<el-form-item>
|
||||
<template #label>
|
||||
树编码字段
|
||||
<el-tooltip content="树显示的编码字段名， 如：dept_id" placement="top">
|
||||
<el-icon>
|
||||
<question-filled />
|
||||
</el-icon>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
<el-select v-model="info.treeCode" placeholder="请选择树编码字段">
|
||||
<el-option
|
||||
v-for="(column, index) in columns"
|
||||
:key="index"
|
||||
:label="column.csharpField + '：' + column.columnComment"
|
||||
:value="column.csharpField"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :lg="12">
|
||||
<el-form-item>
|
||||
<template #label>
|
||||
树父编码字段
|
||||
<el-tooltip content="树显示的父编码字段名， 如：parent_Id" placement="top">
|
||||
<el-icon>
|
||||
<question-filled />
|
||||
</el-icon>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
<el-select v-model="info.treeParentCode" placeholder="请选择树父编码字段">
|
||||
<el-option
|
||||
v-for="(column, index) in columns"
|
||||
:key="index"
|
||||
:label="column.csharpField + '：' + column.columnComment"
|
||||
:value="column.csharpField"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :lg="12">
|
||||
<el-form-item>
|
||||
<template #label>
|
||||
树名称字段
|
||||
<el-tooltip content="树节点的显示名称字段名， 如：dept_name" placement="top">
|
||||
<el-icon>
|
||||
<question-filled />
|
||||
</el-icon>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
<el-select v-model="info.treeName" placeholder="请选择树名称字段">
|
||||
<el-option
|
||||
v-for="(column, index) in columns"
|
||||
:key="index"
|
||||
:label="column.csharpField + '：' + column.columnComment"
|
||||
:value="column.csharpField"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
</el-form>
|
||||
</template>
|
||||
|
||||
<script setup name="genInfoForm">
|
||||
import { getUserMenu } from '~/service/user';
|
||||
// import { listMenu } from '@/api/system/menu'
|
||||
// import { queryColumnInfo } from '@/api/tool/gen'
|
||||
import { ref,watch } from 'vue'
|
||||
|
||||
let genInfoForm = ref(null)
|
||||
const subColumns = ref([])
|
||||
const menuOptions = ref([])
|
||||
|
||||
const props = defineProps({
|
||||
info: {
|
||||
type: Object,
|
||||
default: null,
|
||||
},
|
||||
// 列
|
||||
columns: {
|
||||
type: Array,
|
||||
default: [],
|
||||
},
|
||||
})
|
||||
// 表单校验
|
||||
const rules = ref({
|
||||
tplCategory: [{ required: true, message: '请选择生成模板', trigger: 'blur' }],
|
||||
moduleName: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入生成模块名',
|
||||
trigger: 'blur',
|
||||
pattern: /^[A-Za-z]+$/,
|
||||
},
|
||||
],
|
||||
businessName: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入生成业务名',
|
||||
trigger: 'blur',
|
||||
pattern: /^[A-Za-z]+$/,
|
||||
},
|
||||
],
|
||||
functionName: [{ required: true, message: '请输入生成功能名', trigger: 'blur' }],
|
||||
permissionPrefix: {
|
||||
required: true,
|
||||
message: '请输入权限前缀',
|
||||
trigger: 'blur',
|
||||
},
|
||||
})
|
||||
function subSelectChange(value) {
|
||||
props.info.subTableFkName = ''
|
||||
}
|
||||
function tplSelectChange(value) {
|
||||
if (value !== 'sub') {
|
||||
props.info.subTableName = ''
|
||||
props.info.subTableFkName = ''
|
||||
}
|
||||
}
|
||||
/** 查询菜单下拉树结构 */
|
||||
function getMenuTreeselect() {
|
||||
/** 查询菜单下拉列表 */
|
||||
getUserMenu().then((response) => {
|
||||
menuOptions.value = response.data
|
||||
})
|
||||
}
|
||||
function checkedBtnSelect(value) {
|
||||
console.log(value)
|
||||
}
|
||||
// watch(
|
||||
// () => props.info.subTableName,
|
||||
// (val) => {
|
||||
// setSubTableColumns(val)
|
||||
// },
|
||||
// )
|
||||
|
||||
getMenuTreeselect()
|
||||
</script>
|
||||
103
src/pages/index/gen/importTable.vue
Normal file
103
src/pages/index/gen/importTable.vue
Normal file
@ -0,0 +1,103 @@
|
||||
<template>
|
||||
<!-- 导入表 -->
|
||||
<el-dialog title="导入表" v-model="visible" width="900px" top="5vh" append-to-body>
|
||||
<el-form ref="queryRef" :inline="true" :rules="rules" :model="queryParams">
|
||||
<el-form-item label="表名">
|
||||
<el-input v-model="queryParams.tableName" clearable placeholder="输入要查询的表名" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="search" @click="handleQuery()">查询</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-row>
|
||||
<el-table ref="table" @row-click="clickRow" :data="dbTableList" highlight-current-row height="300px"
|
||||
@selection-change="handleSelectionChange">
|
||||
<el-table-column type="selection" width="55"></el-table-column>
|
||||
<el-table-column prop="name" label="表名" sortable="custom" width="380" />
|
||||
</el-table>
|
||||
<pagination v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize" v-model:total="total"
|
||||
@pagination="getList" />
|
||||
|
||||
</el-row>
|
||||
<template #footer>
|
||||
<div class="dialog-footer">
|
||||
<el-button type="primary" @click="handleImportTable">确 定</el-button>
|
||||
<el-button @click="visible = false">取 消</el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
// import { listDbTable, importTable, codeGetDBList } from '@/api/tool/gen'
|
||||
import { getTablesList ,importTable } from '~/service/Gen';
|
||||
import { ref, reactive } from 'vue'
|
||||
|
||||
const total = ref(0)
|
||||
const visible = ref(false)
|
||||
const tables = ref([])
|
||||
const dbTableList = ref([])
|
||||
const table = ref(null)
|
||||
// const { proxy } = getCurrentInstance()
|
||||
|
||||
const queryParams = reactive({
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
tableName: undefined,
|
||||
})
|
||||
|
||||
const emit = defineEmits(['ok'])
|
||||
|
||||
/** 查询参数列表 */
|
||||
function show() {
|
||||
getList()
|
||||
visible.value = true
|
||||
}
|
||||
/** 单击选择行 */
|
||||
function clickRow(row) {
|
||||
table.value.toggleRowSelection(row)
|
||||
}
|
||||
/** 多选框选中数据 */
|
||||
function handleSelectionChange(selection) {
|
||||
tables.value = selection.map((item) => item.name)
|
||||
console.log(tables.value)
|
||||
}
|
||||
/** 查询表数据 */
|
||||
function getList() {
|
||||
|
||||
getTablesList(queryParams).then((res) => {
|
||||
dbTableList.value = res.data.result
|
||||
total.value = res.data.totalNum
|
||||
})
|
||||
|
||||
}
|
||||
/** 搜索按钮操作 */
|
||||
function handleQuery() {
|
||||
queryParams.pageNum = 1
|
||||
getList()
|
||||
}
|
||||
/** 重置按钮操作 */
|
||||
function resetQuery() {
|
||||
proxy.resetForm('queryRef')
|
||||
handleQuery()
|
||||
}
|
||||
/** 导入按钮操作 */
|
||||
function handleImportTable() {
|
||||
importTable({
|
||||
tables: tables.value,
|
||||
}).then((res) => {
|
||||
ElMessage({
|
||||
message: res.msg,
|
||||
type: 'success',
|
||||
})
|
||||
if (res.code === 200) {
|
||||
visible.value = false
|
||||
emit('ok')
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
defineExpose({
|
||||
show,
|
||||
})
|
||||
</script>
|
||||
278
src/pages/index/gen/index.vue
Normal file
278
src/pages/index/gen/index.vue
Normal file
@ -0,0 +1,278 @@
|
||||
<template>
|
||||
<!-- 面包屑 -->
|
||||
<el-breadcrumb>
|
||||
<el-breadcrumb-item>生成代码</el-breadcrumb-item>
|
||||
<el-breadcrumb-item to="/news/list">生成代码列表</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
<div class="app-container">
|
||||
<el-form ref="codeform" :inline="true" :model="queryParams">
|
||||
<el-form-item label="表名" prop="tableName">
|
||||
<el-input v-model="queryParams.tableName" clearable placeholder="输入要查询的表名" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="search" @click="getList()">查询</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<el-row :gutter="10" class="mb10">
|
||||
<el-col :span="1.5">
|
||||
<el-button type="info" plain icon="upload" @click="openImportTable">导入</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="danger" :disabled="multiple" plain icon="delete" @click="handleDelete">删除</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="success">
|
||||
<a href="https://aitool.aerwen.net/" target="_blank"
|
||||
style="text-decoration:none;color:white;">下载一键建表工具</a>
|
||||
</el-button>
|
||||
</el-col>
|
||||
<!-- <el-col :span="1.5">
|
||||
<el-button type="success" plain @click="handleCreateTable">一键生成表</el-button>
|
||||
</el-col>
|
||||
<el-col :span="1.5">
|
||||
<el-button type="danger" plain @click="handleDeleteTable">一键删除表</el-button>
|
||||
</el-col> -->
|
||||
</el-row>
|
||||
<br>
|
||||
<el-table ref="gridtable" v-loading="tableloading" :data="tableList" border @selection-change="handleSelectionChange"
|
||||
highlight-current-row height="480px">
|
||||
<el-table-column type="selection" align="center" width="55"></el-table-column>
|
||||
<el-table-column prop="tableId" label="id" width="70" sortable="" />
|
||||
<el-table-column prop="tableName" label="表名" width="110" :show-overflow-tooltip="true" />
|
||||
<el-table-column prop="tableComment" label="表描述" :show-overflow-tooltip="true" width="120" />
|
||||
<el-table-column prop="className" label="实体" :show-overflow-tooltip="true" />
|
||||
<el-table-column prop="create_time" label="创建时间" sortable />
|
||||
<el-table-column prop="update_time" label="更新时间" sortable />
|
||||
<el-table-column label="操作" align="center" width="320">
|
||||
<template #default="scope">
|
||||
|
||||
<el-link type="primary" icon="edit" :underline="false" class="ml10" @click="handleEditTable(scope.row)">
|
||||
编辑
|
||||
</el-link>
|
||||
<el-link type="primary" icon="delete" :underline="false" class="ml10" @click="handleDelete(scope.row)">
|
||||
删除
|
||||
</el-link>
|
||||
<el-link type="primary" icon="download" :underline="false" class="ml10" @click="handleGenTable(scope.row)">
|
||||
生成代码
|
||||
</el-link>
|
||||
<el-link type="primary" icon="download" :underline="false" class="ml10" @click="handleGenTableApi(scope.row)">
|
||||
生成Api接口
|
||||
</el-link>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<pagination v-model:page="queryParams.page" v-model:limit="queryParams.limit" v-model:total="total"
|
||||
@pagination="getList" />
|
||||
|
||||
<import-table ref="importRef" @ok="getList" />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup name="gen">
|
||||
// import { codeGenerator, codeGeneratorApi, listTable, delTable, previewTable, synchDb } from '@/api/tool/gen'
|
||||
import { getGenTablesList, delTable, genCode, createTable, deleteTable, codeGeneratorApi } from '~/service/Gen';
|
||||
import { useRouter } from 'vue-router'
|
||||
import importTable from './importTable.vue'
|
||||
import hljs from 'highlight.js'
|
||||
import 'highlight.js/styles/dark.css' // 这里有多个样式，自己可以根据需要切换
|
||||
import { useClipboard } from '@vueuse/core'
|
||||
import { ref } from 'vue'
|
||||
// const route = useRoute()
|
||||
const router = useRouter()
|
||||
// const { proxy } = getCurrentInstance()
|
||||
|
||||
const tableList = ref([])
|
||||
const tableloading = ref(true)
|
||||
const tableIds = ref([])
|
||||
const single = ref(true)
|
||||
const multiple = ref(true)
|
||||
const total = ref(0)
|
||||
const dateRange = ref([])
|
||||
const showGenerate = ref(false)
|
||||
// 选中行的表
|
||||
const currentSelected = ref({})
|
||||
|
||||
let queryParams = ref({
|
||||
page: 1,
|
||||
limit: 10,
|
||||
tableName: undefined,
|
||||
})
|
||||
|
||||
const importRef = ref(null);
|
||||
|
||||
|
||||
/** 查询表集合 */
|
||||
function getList() {
|
||||
tableloading.value = true
|
||||
getGenTablesList(queryParams.value).then((response) => {
|
||||
tableList.value = response.data
|
||||
total.value = response.count
|
||||
tableloading.value = false
|
||||
})
|
||||
}
|
||||
/** 搜索按钮操作 */
|
||||
function handleQuery() {
|
||||
queryParams.value.page = 1
|
||||
getList()
|
||||
}
|
||||
/** 生成代码操作 */
|
||||
function handleGenTable(row) {
|
||||
currentSelected.value = row
|
||||
if (!currentSelected.value) {
|
||||
ElMessage({
|
||||
message: "请先选择要生成代码的数据表...",
|
||||
type: 'info',
|
||||
})
|
||||
return false
|
||||
}
|
||||
|
||||
ElMessage({
|
||||
message: "正在生成代码...",
|
||||
type: 'info',
|
||||
})
|
||||
|
||||
genCode({
|
||||
tableId: currentSelected.value.tableId,
|
||||
})
|
||||
.then((res) => {
|
||||
const { data } = res
|
||||
showGenerate.value = false
|
||||
ElMessage({
|
||||
message: "生成完成",
|
||||
type: 'success',
|
||||
})
|
||||
})
|
||||
.catch((erre) => {
|
||||
})
|
||||
|
||||
}
|
||||
/** 生成Api代码操作 */
|
||||
function handleGenTableApi(row) {
|
||||
currentSelected.value = row
|
||||
if (!currentSelected.value) {
|
||||
ElMessage({
|
||||
message: "请先选择要生成代码的数据表",
|
||||
type: 'error',
|
||||
})
|
||||
return false
|
||||
}
|
||||
ElMessage({
|
||||
message: "正在生成代码...",
|
||||
type: 'info',
|
||||
})
|
||||
|
||||
codeGeneratorApi({
|
||||
tableId: currentSelected.value.tableId,
|
||||
})
|
||||
.then((res) => {
|
||||
const { data } = res
|
||||
showGenerate.value = false
|
||||
ElMessage({
|
||||
message: "生成完成",
|
||||
type: 'success',
|
||||
})
|
||||
})
|
||||
.catch((erre) => {
|
||||
})
|
||||
}
|
||||
|
||||
/** 打开导入表弹窗 */
|
||||
function openImportTable() {
|
||||
importRef.value.show();
|
||||
// importRef.show()
|
||||
}
|
||||
|
||||
// 多选框选中数据
|
||||
function handleSelectionChange(selection) {
|
||||
tableIds.value = selection.map((item) => item.tableId)
|
||||
multiple.value = !selection.length
|
||||
}
|
||||
/** 编辑表格 */
|
||||
function handleEditTable(row) {
|
||||
queryParams.value.tableName = row.tableName
|
||||
getList()
|
||||
|
||||
router.push({
|
||||
path: '/gen/editTable',
|
||||
query: { tableId: row.tableId },
|
||||
})
|
||||
}
|
||||
/** 一键生成操作 */
|
||||
function handleCreateTable(row) {
|
||||
const Ids = row.tableId
|
||||
createTable({ tableId: Ids }).then((res) => {
|
||||
if (res.code == 0) {
|
||||
ElMessage({
|
||||
message: "生成表成功",
|
||||
type: 'success',
|
||||
})
|
||||
handleQuery()
|
||||
}
|
||||
})
|
||||
}
|
||||
/** 一键删除操作 */
|
||||
function handleDeleteTable(row) {
|
||||
const Ids = row.tableId
|
||||
deleteTable({ tableId: Ids }).then((res) => {
|
||||
if (res.code == 0) {
|
||||
ElMessage({
|
||||
message: "删除表成功",
|
||||
type: 'success',
|
||||
})
|
||||
handleQuery()
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
/** 删除按钮操作 */
|
||||
function handleDelete(row) {
|
||||
const Ids = row.tableId || tableIds.value
|
||||
console.log(Ids);
|
||||
// const Ids = {tableId: row.map(v => v.tableId).join()}
|
||||
ElMessageBox.alert('此操作将永久删除该文件, 是否继续?', '提示', {
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning',
|
||||
})
|
||||
.then(() => {
|
||||
delTable({ tableId: Ids }).then((res) => {
|
||||
if (res.code == 200) {
|
||||
ElMessage({
|
||||
message: "删除成功",
|
||||
type: 'success',
|
||||
})
|
||||
handleQuery()
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
/** 高亮显示 */
|
||||
function highlightedCode(code, key) {
|
||||
// var language = key.substring(key.lastIndexOf(".") , key.length)
|
||||
const result = hljs.highlightAuto(code || '')
|
||||
return result.value || ' '
|
||||
}
|
||||
|
||||
const { copy, isSupported } = useClipboard()
|
||||
function onCopy(input) {
|
||||
if (isSupported) {
|
||||
copy(input)
|
||||
proxy.$modal.msgSuccess('复制成功！')
|
||||
} else {
|
||||
ElMessage({
|
||||
message: "当前浏览器不支持",
|
||||
type: 'info',
|
||||
})
|
||||
}
|
||||
}
|
||||
getList()
|
||||
</script>
|
||||
<style>
|
||||
.btn-copy {
|
||||
position: absolute;
|
||||
right: 0;
|
||||
top: -5px;
|
||||
}
|
||||
</style>
|
||||
376
src/pages/index/index.vue
Normal file
376
src/pages/index/index.vue
Normal file
@ -0,0 +1,376 @@
|
||||
<route>
|
||||
{
|
||||
meta: {
|
||||
ignoreRouterCheck: true,
|
||||
}
|
||||
}
|
||||
</route>
|
||||
<style lang="less" scoped>
|
||||
* {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.total {
|
||||
width: 95%;
|
||||
margin: 0 auto 0 auto;
|
||||
}
|
||||
|
||||
// 顶部标题
|
||||
.top_title_box {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
margin-bottom: 1rem;
|
||||
margin-left: 1.5rem;
|
||||
}
|
||||
|
||||
.point {
|
||||
width: 10px;
|
||||
height: 10px;
|
||||
border-radius: 50%;
|
||||
margin-right: 1rem;
|
||||
background-color: pink;
|
||||
z-index: 2;
|
||||
}
|
||||
|
||||
.top_title {
|
||||
font-size: 25px;
|
||||
// font-weight: bold;
|
||||
}
|
||||
|
||||
// 顶部盒子
|
||||
.top_box_pos {
|
||||
width: 350px;
|
||||
height: 250px;
|
||||
background-color: #ffffff;
|
||||
box-shadow: 0 0 30px 10px #f8f8fd;
|
||||
border-radius: 10px;
|
||||
margin-top: 0.3rem;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
justify-content: space-between;
|
||||
overflow: hidden;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.top_content_box {
|
||||
width: 100%;
|
||||
height: 40%;
|
||||
// background-color: green;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
justify-content: space-around;
|
||||
}
|
||||
|
||||
|
||||
#main3 {
|
||||
width: 1850px;
|
||||
height: 100%;
|
||||
margin-top: 30px;
|
||||
margin-left: -7%;
|
||||
}
|
||||
|
||||
// 柱状图
|
||||
.Wave_pattern {
|
||||
width: 95%;
|
||||
height: 450px;
|
||||
margin: 0rem auto;
|
||||
background-color: #ffffff;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
overflow: hidden;
|
||||
border: 2px solid #f3f3f3;
|
||||
border-radius: 15px;
|
||||
}
|
||||
|
||||
.Wave_pattern>P {
|
||||
float: left;
|
||||
margin-top: 40px;
|
||||
font-family: 幼圆;
|
||||
}
|
||||
</style>
|
||||
|
||||
<template>
|
||||
<!-- 顶部的所有盒子 -->
|
||||
<div class="top_title_box">
|
||||
<span class="point"></span>
|
||||
<p class="top_title">数据预览</p>
|
||||
</div>
|
||||
|
||||
<div class="total">
|
||||
<div class="top_content_box">
|
||||
|
||||
<CountBox :data="teacherEchartsData" :idx="1" :text="'教师总数'" :img="'/img/home/分组 1 (10).png'"
|
||||
:count="teacherData.count" :percentage="teacherData.percentage">
|
||||
</CountBox>
|
||||
|
||||
<CountBox :data="infoArticleEchartsData" :idx="2" :text="'文章总数'" :img="'/img/home/分组 1 (11).png'"
|
||||
:count="infoArticleData.count" :percentage="infoArticleData.percentage">
|
||||
</CountBox>
|
||||
|
||||
<CountBox :data="flowEchartsData" :idx="3" :text="'访客总数'" :img="'/img/home/分组 1 (12).png'" :count="flowData.count"
|
||||
:percentage="flowData.percentage">
|
||||
</CountBox>
|
||||
|
||||
<CountBox :data="worksEchartsData" :idx="4" :text="'作品总数'" :img="'/img/home/分组 1 (13).png'" :count="worksData.count"
|
||||
:percentage="worksData.percentage">
|
||||
</CountBox>
|
||||
|
||||
</div>
|
||||
|
||||
</div>
|
||||
|
||||
<div class="top_title_box" style="margin-top: 50px;">
|
||||
<!-- main3是柱状图 -->
|
||||
<span class="point"></span>
|
||||
<p class="top_title">报名统计</p>
|
||||
</div>
|
||||
<div class="Wave_pattern">
|
||||
|
||||
<!-- <div class="middle_show_box">
|
||||
|
||||
<div class="middle_pos_box">
|
||||
<div class="middle_title_box">
|
||||
<span class="point"></span>
|
||||
<p class="top_title">预约课程统计</p>
|
||||
</div>
|
||||
|
||||
<div class="year_select_box">
|
||||
<div class="year_text">2021</div>
|
||||
<div class="year_text">2022</div>
|
||||
<div class="year_text year_text_actice">2023</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</div> -->
|
||||
|
||||
<div id="main3"></div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, onMounted, nextTick, onBeforeUnmount } from 'vue';
|
||||
import * as echarts from 'echarts';
|
||||
import CountBox from "~/components/Echarts/CountBox.vue"
|
||||
import { getHomeData } from '~/service/home';
|
||||
|
||||
// Echarts数据
|
||||
let teacherEchartsData = [
|
||||
['1', 500],
|
||||
['2', 900],
|
||||
['3', 460],
|
||||
['4', 1150],
|
||||
['5', 300],
|
||||
['6', 1000],
|
||||
['7', 400],
|
||||
]
|
||||
|
||||
let infoArticleEchartsData = [
|
||||
['1', 500],
|
||||
['2', 900],
|
||||
['3', 460],
|
||||
['4', 1150],
|
||||
['5', 300],
|
||||
['6', 1000],
|
||||
['7', 400],
|
||||
]
|
||||
|
||||
let flowEchartsData = [
|
||||
['1', 500],
|
||||
['2', 900],
|
||||
['3', 460],
|
||||
['4', 1150],
|
||||
['5', 300],
|
||||
['6', 1000],
|
||||
['7', 400],
|
||||
]
|
||||
|
||||
let worksEchartsData = [
|
||||
['1', 500],
|
||||
['2', 900],
|
||||
['3', 460],
|
||||
['4', 1150],
|
||||
['5', 300],
|
||||
['6', 1000],
|
||||
['7', 400],
|
||||
]
|
||||
|
||||
let teacherData = ref({
|
||||
count: 12,
|
||||
percentage: 0
|
||||
})
|
||||
let infoArticleData = ref({
|
||||
count: 223,
|
||||
percentage: 0
|
||||
})
|
||||
let flowData = ref({
|
||||
count: 3321,
|
||||
percentage: 12.0
|
||||
})
|
||||
let worksData = ref({
|
||||
count: 12,
|
||||
percentage: 0
|
||||
})
|
||||
let enrolData = ref({
|
||||
"signup": [
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
18,
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
0
|
||||
],
|
||||
"leave_message": [
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
5,
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
0
|
||||
]
|
||||
})
|
||||
|
||||
onMounted(async () => {
|
||||
// await getHome()
|
||||
await echartsInit3()
|
||||
})
|
||||
|
||||
onBeforeUnmount(() => {
|
||||
echarts.dispose(document.getElementById('main3'));
|
||||
});
|
||||
|
||||
|
||||
// 获取接口数据
|
||||
async function getHome() {
|
||||
const { code, data } = await getHomeData();
|
||||
if (code == 0) {
|
||||
teacherData.value = data.data_preview.teacher
|
||||
infoArticleData.value = data.data_preview.info_article
|
||||
flowData.value = data.data_preview.flow
|
||||
worksData.value = data.data_preview.works
|
||||
|
||||
enrolData.value = data.statistics
|
||||
console.log(data, "首页");
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
// 柱形图
|
||||
async function echartsInit3() {
|
||||
var chartDom = document.getElementById('main3');
|
||||
var myChart = echarts.init(chartDom);
|
||||
var option;
|
||||
|
||||
option = {
|
||||
tooltip: {
|
||||
trigger: 'axis'
|
||||
},
|
||||
legend: {
|
||||
right: 200,
|
||||
itemWidth: 20, // 设置图标宽度为10px
|
||||
itemHeight: 20, // 设置图标宽度为10px
|
||||
textStyle: { // 设置字体样式
|
||||
color: '#a0a5b2',
|
||||
fontSize: 16,
|
||||
fontWeight: 'bold',
|
||||
padding: [0, 5, 0, 8] // 设置字体和图标之间的间距
|
||||
},
|
||||
data: ['报名人数', '留言人数']
|
||||
},
|
||||
calculable: true,
|
||||
xAxis: [
|
||||
{
|
||||
axisTick: {
|
||||
show: false // 不显示坐标轴刻度线
|
||||
},
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: '#eaeff7' // 坐标轴轴线的颜色
|
||||
}
|
||||
},
|
||||
axisLabel: {
|
||||
textStyle: {
|
||||
color: '#a4bade', // 坐标轴标签的颜色
|
||||
fontSize: 15, // 坐标轴标签的字体大小
|
||||
fontWeight: "bold", // 坐标轴标签的字体大小
|
||||
lineHeight: 40 // 坐标轴标签的行高，即字体间距
|
||||
}
|
||||
},
|
||||
type: 'category',
|
||||
data: ['一月', '二月', '三月', '四月', '五月', '六月', '七月', '八月', '九月', '十月', '十一月', '十二月']
|
||||
}
|
||||
],
|
||||
yAxis: [
|
||||
{
|
||||
name: '人数', // 设置 y 轴名称为 "人数"
|
||||
nameGap: 35, // 设置名称和轴线之间的距离为 10 像素
|
||||
nameTextStyle: {
|
||||
color: '#a4bade',
|
||||
fontSize: 15,
|
||||
padding: [0, 0, 0, -73], // 设置名称文字与轴线之间的间距为 [0, 0, 10, 0]
|
||||
fontWeight: "bold", // 坐标轴标签的字体大小
|
||||
},
|
||||
splitLine: {
|
||||
lineStyle: {
|
||||
color: '#eaeff7' // 设置网格线的颜色为 #eaeff7
|
||||
}
|
||||
},
|
||||
axisLabel: {
|
||||
padding: [0, 15, 0, 0],
|
||||
textStyle: {
|
||||
color: '#a4bade', // 坐标轴标签的颜色
|
||||
fontSize: 15, // 坐标轴标签的字体大小
|
||||
fontWeight: "bold", // 坐标轴标签的字体大小
|
||||
}
|
||||
},
|
||||
type: 'value'
|
||||
}
|
||||
],
|
||||
series: [
|
||||
{
|
||||
name: '报名人数',
|
||||
type: 'bar',
|
||||
barWidth: 25,
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: "#4365dc",
|
||||
barBorderRadius: 3,
|
||||
},
|
||||
},
|
||||
// data: [
|
||||
// 2.0, 4.9, 7.0, 23.2, 25.6, 76.7, 135.6, 162.2, 32.6, 20.0, 6.4, 3.3
|
||||
// ],
|
||||
data: enrolData.value.signup
|
||||
},
|
||||
{
|
||||
name: '留言人数',
|
||||
type: 'bar',
|
||||
barWidth: 25,
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: "#74be8c",
|
||||
barBorderRadius: 3,
|
||||
},
|
||||
},
|
||||
data: enrolData.value.leave_message
|
||||
}
|
||||
]
|
||||
}
|
||||
option && myChart.setOption(option);
|
||||
};
|
||||
|
||||
|
||||
</script>
|
||||
76
src/pages/index/menu/api.vue
Normal file
76
src/pages/index/menu/api.vue
Normal file
@ -0,0 +1,76 @@
|
||||
<template>
|
||||
<!-- 面包屑 -->
|
||||
<el-breadcrumb>
|
||||
<el-breadcrumb-item>系统管理</el-breadcrumb-item>
|
||||
<el-breadcrumb-item to="/system/menu">菜单管理接口</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
<!-- 数据表格 -->
|
||||
<DataTable
|
||||
ref="tableRef"
|
||||
style="width: 100%"
|
||||
row-key="menu_guid"
|
||||
:onSelectionChange="data => (selectionData = data)"
|
||||
:column="column"
|
||||
:params="params"
|
||||
:pagination="false"
|
||||
:request="params => getMenuApiTree(params)"
|
||||
>
|
||||
<template #menu_api_url="scope">
|
||||
<template v-for="(item, index) in scope.row.menu_api_url" :key="item">
|
||||
<el-tag v-if="index <= 2">
|
||||
{{ item }}
|
||||
</el-tag>
|
||||
</template>
|
||||
</template>
|
||||
<template #chaoz="scope">
|
||||
<el-button
|
||||
size="small"
|
||||
@click="(currentData = scope.row), (viewApiDialogVisible = true)"
|
||||
>
|
||||
绑定接口
|
||||
</el-button>
|
||||
</template>
|
||||
</DataTable>
|
||||
<!-- 查看接口 -->
|
||||
<ViewApiDialog
|
||||
v-model="viewApiDialogVisible"
|
||||
:data="currentData"
|
||||
:done="() => tableRef.reload()"
|
||||
></ViewApiDialog>
|
||||
</template>
|
||||
<script setup>
|
||||
import { ref, reactive, watch } from 'vue';
|
||||
import { getMenuApiTree } from '~/service/menu';
|
||||
import ViewApiDialog from './components/ViewApiDialog.vue';
|
||||
|
||||
const tableRef = ref();
|
||||
const viewApiDialogVisible = ref(false);
|
||||
const currentData = ref({});
|
||||
const params = reactive({});
|
||||
const column = [
|
||||
{
|
||||
fixed: true,
|
||||
type: 'selection'
|
||||
},
|
||||
{
|
||||
prop: 'menu_name',
|
||||
label: '名称',
|
||||
width: '250'
|
||||
},
|
||||
{
|
||||
prop: 'menu_url',
|
||||
label: '路由',
|
||||
width: '250'
|
||||
},
|
||||
{
|
||||
prop: 'menu_api_url',
|
||||
label: '接口',
|
||||
width: '300'
|
||||
},
|
||||
{
|
||||
label: '操作',
|
||||
prop: 'chaoz',
|
||||
width: '150'
|
||||
}
|
||||
];
|
||||
</script>
|
||||
132
src/pages/index/menu/components/ViewApiDialog.vue
Normal file
132
src/pages/index/menu/components/ViewApiDialog.vue
Normal file
@ -0,0 +1,132 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
v-model="dialogVisible"
|
||||
:title="`绑定接口 ${params.menu_name}`"
|
||||
width="80%"
|
||||
@open="openDialog"
|
||||
@closed="closeDialog"
|
||||
>
|
||||
<DataTable
|
||||
ref="tableRef"
|
||||
style="width: 100%"
|
||||
:onSelectionChange="(data) => (selectionData = data)"
|
||||
:column="column"
|
||||
:params="params"
|
||||
:request="(params) => getMenuApiList(params)"
|
||||
>
|
||||
</DataTable>
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button type="primary" @click="handleAddClick"> 添加 </el-button>
|
||||
<el-button type="danger" @click="handleDeleteClick"> 删除 </el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ElMessage } from 'element-plus';
|
||||
import { ref, watch, reactive } from 'vue';
|
||||
import { getMenuApiList, addMenuApi, deleteMenuApi } from '~/service/menu';
|
||||
const tableRef = ref();
|
||||
|
||||
const column = [
|
||||
{
|
||||
fixed: true,
|
||||
type: 'selection'
|
||||
},
|
||||
{
|
||||
prop: 'menu_api_url',
|
||||
label: '接口',
|
||||
width: '300'
|
||||
},
|
||||
{
|
||||
prop: 'menu_api_status_text',
|
||||
label: '状态',
|
||||
width: '150'
|
||||
}
|
||||
];
|
||||
|
||||
const props = defineProps({
|
||||
modelValue: Boolean,
|
||||
data: Object,
|
||||
done: Function
|
||||
});
|
||||
const emits = defineEmits(['update:modelValue']);
|
||||
|
||||
const dialogVisible = ref(props.modelValue);
|
||||
const selectionData = ref([]);
|
||||
|
||||
const params = reactive({
|
||||
menu_guid: '',
|
||||
menu_name: ''
|
||||
});
|
||||
watch(
|
||||
() => props.modelValue,
|
||||
(v) => {
|
||||
console.log('watch props.modelValue', v);
|
||||
dialogVisible.value = v;
|
||||
}
|
||||
);
|
||||
|
||||
const openDialog = () => {
|
||||
params.menu_guid = props.data.menu_guid;
|
||||
params.menu_name = props.data.menu_name;
|
||||
};
|
||||
|
||||
const closeDialog = () => {
|
||||
dialogVisible.value = false;
|
||||
emits('update:modelValue', false);
|
||||
props.done();
|
||||
};
|
||||
|
||||
const handleAddClick = async () => {
|
||||
ElMessageBox.prompt('请输入接口地址', '添加接口', {
|
||||
inputPlaceholder: 'controller/action',
|
||||
async beforeClose(action, instance, done) {
|
||||
if (action === 'confirm') {
|
||||
instance.confirmButtonLoading = true;
|
||||
try {
|
||||
const value = instance.inputValue;
|
||||
if (!value) {
|
||||
throw new Error('请输入接口地址');
|
||||
}
|
||||
const { code, msg } = await addMenuApi({
|
||||
menu_guid: params.menu_guid,
|
||||
menu_api_url: value
|
||||
});
|
||||
if (code == 0) {
|
||||
tableRef.value.reload();
|
||||
done();
|
||||
} else {
|
||||
throw new Error(msg);
|
||||
}
|
||||
} catch (error) {
|
||||
instance.confirmButtonLoading = false;
|
||||
ElMessage.warning(error.message);
|
||||
}
|
||||
} else {
|
||||
done();
|
||||
}
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const handleDeleteClick = async () => {
|
||||
if (selectionData.value.length == 0) {
|
||||
ElMessage.warning('请选择数据');
|
||||
return;
|
||||
}
|
||||
ElMessageBox.alert('您确定要删除选中接口吗？', '批量删除接口', {
|
||||
confirmButtonText: 'OK'
|
||||
}).then(async () => {
|
||||
const { code } = await deleteMenuApi({
|
||||
...params,
|
||||
menu_api_guid: selectionData.value.map((v) => v.menu_api_guid).join()
|
||||
});
|
||||
if (code == 0) {
|
||||
tableRef.value.reload();
|
||||
}
|
||||
});
|
||||
};
|
||||
</script>
|
||||
270
src/pages/index/menu/index.vue
Normal file
270
src/pages/index/menu/index.vue
Normal file
@ -0,0 +1,270 @@
|
||||
<template>
|
||||
<!-- 面包屑 -->
|
||||
<el-breadcrumb>
|
||||
<el-breadcrumb-item>系统管理</el-breadcrumb-item>
|
||||
<el-breadcrumb-item to="/system/menu">菜单管理</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
<el-row :gutter="20">
|
||||
<el-col :span="12">
|
||||
<template v-if="checkData.length">
|
||||
<el-button type="danger" @click="handleCheckDeleteClick">
|
||||
批量删除
|
||||
</el-button>
|
||||
</template>
|
||||
<el-input v-model="filterText" placeholder="搜索菜单" />
|
||||
<el-tree
|
||||
ref="treeRef"
|
||||
:filter-node-method="filterNode"
|
||||
:data="treeData"
|
||||
show-checkbox
|
||||
draggable
|
||||
default-expand-all
|
||||
:highlight-current="true"
|
||||
:expand-on-click-node="false"
|
||||
node-key="id"
|
||||
@node-drop="handleDrop"
|
||||
@check="handleCheck"
|
||||
>
|
||||
<template #default="{ node, data }">
|
||||
<span class="custom-tree-node">
|
||||
<span>{{ node.label }}</span>
|
||||
<span>
|
||||
<a @click="handleTreeClick('create', data)"> 添加 </a>
|
||||
<a v-if="data.id != 0" @click="handleTreeClick('edit', data)">
|
||||
编辑
|
||||
</a>
|
||||
</span>
|
||||
</span>
|
||||
</template>
|
||||
</el-tree>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<div v-if="model.menu_guid">
|
||||
<el-form ref="formRef" :model="model" :rules="rules">
|
||||
<el-form-item label="名称" prop="menu_name">
|
||||
<el-input v-model="model.menu_name" type="text"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="路由" prop="menu_url">
|
||||
<el-input v-model="model.menu_url" type="text"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="排序" prop="menu_order">
|
||||
<el-input v-model="model.menu_order" type="number"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="展示" prop="menu_show">
|
||||
<el-switch
|
||||
v-model="model.menu_show"
|
||||
active-text="展示"
|
||||
inactive-text="隐藏"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="状态" prop="menu_status">
|
||||
<el-switch
|
||||
v-model="model.menu_status"
|
||||
active-text="启用"
|
||||
inactive-text="停用"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="handleSaveClick">
|
||||
保存
|
||||
</el-button>
|
||||
<el-button
|
||||
v-if="model.menu_guid && model.menu_guid != 'create'"
|
||||
type="danger"
|
||||
@click="handleDeleteClick"
|
||||
>
|
||||
删除
|
||||
</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<div v-else>
|
||||
<el-empty description="请选择菜单" />
|
||||
</div>
|
||||
</el-col>
|
||||
</el-row>
|
||||
</template>
|
||||
<script setup>
|
||||
import { ref, reactive, watch } from 'vue';
|
||||
import { getMenuTree, addMenu, updateMenu, deleteMenu } from '~/service/menu';
|
||||
|
||||
const formRef = ref();
|
||||
const treeRef = ref();
|
||||
const filterText = ref('');
|
||||
const treeData = ref([]);
|
||||
const checkData = ref([]);
|
||||
const model = reactive({
|
||||
menu_guid: '',
|
||||
menu_parent_guid: '',
|
||||
menu_name: '',
|
||||
menu_status: true,
|
||||
menu_show: true,
|
||||
menu_url: '',
|
||||
menu_index: 0,
|
||||
menu_order: 0
|
||||
});
|
||||
|
||||
const rules = {
|
||||
menu_name: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入菜单名称'
|
||||
}
|
||||
],
|
||||
menu_url: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入菜单url'
|
||||
}
|
||||
],
|
||||
menu_order: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入菜单排序'
|
||||
}
|
||||
]
|
||||
};
|
||||
|
||||
const loadTree = async () => {
|
||||
const { code, data } = await getMenuTree();
|
||||
if (code == 0) {
|
||||
treeData.value = data;
|
||||
}
|
||||
};
|
||||
|
||||
loadTree();
|
||||
|
||||
watch(filterText, v => {
|
||||
treeRef.value.filter(v);
|
||||
});
|
||||
// 搜索树组件
|
||||
const filterNode = (value, data) => {
|
||||
if (!value) return true;
|
||||
return data.label.indexOf(value) !== -1;
|
||||
};
|
||||
// 拖拽排序
|
||||
const handleDrop = async (current, to, action) => {
|
||||
const currentData = current.data;
|
||||
const toData = to.data;
|
||||
console.log({
|
||||
current: currentData,
|
||||
to: toData,
|
||||
action
|
||||
});
|
||||
const data = {
|
||||
menu_guid: current.data.id,
|
||||
menu_parent_guid: '',
|
||||
menu_index: '',
|
||||
menu_order: ''
|
||||
};
|
||||
switch (action) {
|
||||
case 'before':
|
||||
data.menu_parent_guid = toData.parent_id;
|
||||
data.menu_index = toData.index;
|
||||
data.menu_order = toData.order + 1;
|
||||
break;
|
||||
case 'after':
|
||||
data.menu_parent_guid = toData.parent_id;
|
||||
data.menu_index = toData.index;
|
||||
data.menu_order = toData.order - 1;
|
||||
break;
|
||||
case 'inner':
|
||||
data.menu_parent_guid = toData.id;
|
||||
data.menu_index = toData.index + 1;
|
||||
data.menu_order = 0;
|
||||
break;
|
||||
}
|
||||
const { code } = await updateMenu(data);
|
||||
if (code == 0) {
|
||||
loadTree();
|
||||
}
|
||||
};
|
||||
// 选中菜单
|
||||
const handleCheck = (_, { checkedKeys }) => {
|
||||
checkData.value = checkedKeys;
|
||||
};
|
||||
// 表单提交
|
||||
const handleSaveClick = async () => {
|
||||
try {
|
||||
await formRef.value.validate();
|
||||
const data = {
|
||||
...model,
|
||||
menu_status: model.menu_status ? 1 : 2,
|
||||
menu_show: model.menu_show ? 1 : 2
|
||||
};
|
||||
if (model.menu_guid === 'create') {
|
||||
const { code } = await addMenu(data);
|
||||
if (code == 0) {
|
||||
loadTree();
|
||||
}
|
||||
model.menu_guid = '';
|
||||
} else {
|
||||
const { code } = await updateMenu(data);
|
||||
if (code == 0) {
|
||||
loadTree();
|
||||
}
|
||||
}
|
||||
} catch (error) {}
|
||||
};
|
||||
// 批量删除
|
||||
const handleCheckDeleteClick = () => {
|
||||
ElMessageBox.alert('您确定要删除该菜单吗？', '删除菜单', {
|
||||
confirmButtonText: '确定'
|
||||
}).then(async () => {
|
||||
const isSuccess = await deleteMenu({
|
||||
menu_guid: checkData.value.join()
|
||||
});
|
||||
if (isSuccess) {
|
||||
loadTree();
|
||||
checkData.value = [];
|
||||
}
|
||||
});
|
||||
};
|
||||
// 删除菜单
|
||||
const handleDeleteClick = () => {
|
||||
ElMessageBox.alert('您确定要删除该菜单吗？', '删除菜单', {
|
||||
confirmButtonText: '确定'
|
||||
}).then(async () => {
|
||||
const isSuccess = await deleteMenu(model);
|
||||
if (isSuccess) {
|
||||
loadTree();
|
||||
model.menu_guid = '';
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const handleTreeClick = (type, data) => {
|
||||
switch (type) {
|
||||
case 'create':
|
||||
model.menu_guid = 'create';
|
||||
model.menu_parent_guid = data.id;
|
||||
model.menu_index = data.index + 1;
|
||||
model.menu_name = '';
|
||||
model.menu_url = '';
|
||||
model.menu_order = 0;
|
||||
model.menu_status = true;
|
||||
model.menu_show = true;
|
||||
break;
|
||||
case 'edit':
|
||||
model.menu_guid = data.id;
|
||||
model.menu_parent_guid = data.parent_id;
|
||||
model.menu_index = data.index;
|
||||
model.menu_name = data.label;
|
||||
model.menu_order = data.order;
|
||||
model.menu_url = data.url;
|
||||
model.menu_status = data.status == 1;
|
||||
model.menu_show = data.show == 1;
|
||||
break;
|
||||
}
|
||||
};
|
||||
</script>
|
||||
<style scoped>
|
||||
.custom-tree-node {
|
||||
flex: 1;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
font-size: 14px;
|
||||
padding-right: 8px;
|
||||
}
|
||||
</style>
|
||||
84
src/pages/index/role/components/AddRoleDialog.vue
Normal file
84
src/pages/index/role/components/AddRoleDialog.vue
Normal file
@ -0,0 +1,84 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
v-model="dialogVisible"
|
||||
title="添加角色"
|
||||
width="30%"
|
||||
@closed="closeDialog"
|
||||
>
|
||||
<el-form
|
||||
ref="formRef"
|
||||
:model="formData"
|
||||
:rules="rules"
|
||||
label-position="top"
|
||||
style="max-width: 460px"
|
||||
>
|
||||
<el-form-item :label-width="labelWidth" label="名称" prop="role_name">
|
||||
<el-input v-model="formData.role_name" type="text"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button type="primary" @click="handleAddClick(formRef)"
|
||||
>添加</el-button
|
||||
>
|
||||
<el-button @click="handleResetClick(formRef)">重置</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref, toRef, watch } from 'vue';
|
||||
import { addRole } from '~/service/role';
|
||||
const formRef = ref();
|
||||
const labelWidth = 90;
|
||||
|
||||
const props = defineProps({
|
||||
modelValue: Boolean,
|
||||
done: Function
|
||||
});
|
||||
const emits = defineEmits(['update:modelValue']);
|
||||
|
||||
const dialogVisible = ref(props.modelValue);
|
||||
|
||||
const rules = reactive({
|
||||
role_name: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入名称'
|
||||
}
|
||||
]
|
||||
});
|
||||
const formData = reactive({
|
||||
user_name: ''
|
||||
});
|
||||
|
||||
watch(props, v => {
|
||||
dialogVisible.value = v.modelValue;
|
||||
});
|
||||
|
||||
const closeDialog = () => {
|
||||
handleResetClick(formRef.value);
|
||||
dialogVisible.value = false;
|
||||
emits('update:modelValue', false);
|
||||
};
|
||||
|
||||
const handleAddClick = async formEl => {
|
||||
console.log(formEl);
|
||||
if (!formEl) return;
|
||||
formEl.validate(async valid => {
|
||||
if (!valid) {
|
||||
return;
|
||||
}
|
||||
const { code } = await addRole(formData);
|
||||
if (code == 0) {
|
||||
closeDialog();
|
||||
props.done();
|
||||
}
|
||||
});
|
||||
};
|
||||
const handleResetClick = async formEl => {
|
||||
if (!formEl) return;
|
||||
formEl.resetFields();
|
||||
};
|
||||
</script>
|
||||
83
src/pages/index/role/components/EditRoleDialog.vue
Normal file
83
src/pages/index/role/components/EditRoleDialog.vue
Normal file
@ -0,0 +1,83 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
v-model="dialogVisible"
|
||||
title="编辑角色"
|
||||
width="30%"
|
||||
@closed="closeDialog"
|
||||
>
|
||||
<el-form
|
||||
ref="formRef"
|
||||
:model="formData"
|
||||
:rules="rules"
|
||||
label-position="top"
|
||||
style="max-width: 460px"
|
||||
>
|
||||
<el-form-item label="名称" prop="role_name">
|
||||
<el-input v-model="formData.role_name" type="text"></el-input>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button type="primary" @click="handleEditClick(formRef)"
|
||||
>编辑</el-button
|
||||
>
|
||||
<el-button @click="handleResetClick(formRef)">重置</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref, watch } from 'vue';
|
||||
import { editRole } from '~/service/role';
|
||||
import { isEmptyObject } from '~/utils/index';
|
||||
const formRef = ref();
|
||||
|
||||
const props = defineProps({
|
||||
modelValue: Object,
|
||||
done: Function
|
||||
});
|
||||
const emits = defineEmits(['update:modelValue']);
|
||||
|
||||
const dialogVisible = ref(!isEmptyObject(props.modelValue));
|
||||
|
||||
const rules = reactive({
|
||||
role_name: [
|
||||
{
|
||||
required: true,
|
||||
message: '请输入名称'
|
||||
}
|
||||
]
|
||||
});
|
||||
const formData = ref({
|
||||
...props.modelValue
|
||||
});
|
||||
|
||||
watch(props, (v) => {
|
||||
formData.value = v.modelValue;
|
||||
dialogVisible.value = !isEmptyObject(v.modelValue);
|
||||
});
|
||||
|
||||
const closeDialog = () => {
|
||||
dialogVisible.value = false;
|
||||
emits('update:modelValue', {});
|
||||
};
|
||||
|
||||
const handleEditClick = async (formEl) => {
|
||||
if (!formEl) return;
|
||||
formEl.validate(async (valid) => {
|
||||
if (!valid) {
|
||||
return;
|
||||
}
|
||||
const { code } = await editRole(formData.value);
|
||||
if (code == 0) {
|
||||
closeDialog();
|
||||
props.done();
|
||||
}
|
||||
});
|
||||
};
|
||||
const handleResetClick = async (formEl) => {
|
||||
if (!formEl) return;
|
||||
formEl.resetFields();
|
||||
};
|
||||
</script>
|
||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in New Issue
Block a user