Initial commit
6
.env
Normal file
@ -0,0 +1,6 @@
|
||||
# 后台接口地址(仅开发/预览环境生效)
|
||||
VITE_PROXY_API=http://localhost/AERWEN/php_web/php_web_api/public/admin.php/
|
||||
# 后台图片地址(仅开发/预览环境生效)
|
||||
VITE_PROXY_UPLOADS=http://localhost/AERWEN/php_web/php_web_api/public/uploads/
|
||||
# 后台富文本上传地址(仅开发/预览环境生效)
|
||||
VITE_PROXY_RICHTEXT=http://localhost:3000/api/
|
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
@ -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
@ -0,0 +1,3 @@
|
||||
{
|
||||
"nuxt.isNuxtApp": false
|
||||
}
|
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.
|
BIN
favicon.ico
Normal file
After Width: | Height: | Size: 201 KiB |
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
@ -0,0 +1,10 @@
|
||||
{
|
||||
"compilerOptions": {
|
||||
"target": "es2020",
|
||||
"module": "es6",
|
||||
"paths": {
|
||||
"~/*": ["./src/*"]
|
||||
}
|
||||
},
|
||||
"include": ["src/**/*"]
|
||||
}
|
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/favicon.ico
Normal file
After Width: | Height: | Size: 27 KiB |
BIN
public/font/clock_word.TTF
Normal file
BIN
public/images/login-background.jpg
Normal file
After Width: | Height: | Size: 39 KiB |
BIN
public/images/login-captcha-icon.png
Normal file
After Width: | Height: | Size: 636 B |
BIN
public/images/login-left.png
Normal file
After Width: | Height: | Size: 90 KiB |
BIN
public/images/login-password-icon.png
Normal file
After Width: | Height: | Size: 442 B |
BIN
public/images/login-user-icon.png
Normal file
After Width: | Height: | Size: 493 B |
BIN
public/images/logo_login.png
Normal file
After Width: | Height: | Size: 41 KiB |
0
public/img/home/img
Normal file
BIN
public/img/home/上升.png
Normal file
After Width: | Height: | Size: 3.9 KiB |
BIN
public/img/home/图标.png
Normal file
After Width: | Height: | Size: 4.4 KiB |
BIN
public/img/home/图标(蓝).png
Normal file
After Width: | Height: | Size: 5.7 KiB |
BIN
public/logo.png
Normal file
After Width: | Height: | Size: 39 KiB |
25
src/App.vue
Normal file
@ -0,0 +1,25 @@
|
||||
<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;
|
||||
}
|
||||
</style>
|
13681
src/assets/area.json
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
@ -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
@ -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
After Width: | Height: | Size: 14 KiB |
BIN
src/assets/images/login-left.png
Normal file
After Width: | Height: | Size: 90 KiB |
BIN
src/assets/logo.png
Normal file
After Width: | Height: | Size: 59 KiB |
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
@ -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 = true,
|
||||
...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
@ -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
@ -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
@ -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>
|
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
@ -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>
|
207
src/components/ImageUpload.vue
Normal file
@ -0,0 +1,207 @@
|
||||
<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"
|
||||
: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;
|
||||
}
|
||||
</style>
|
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
@ -0,0 +1,112 @@
|
||||
<template>
|
||||
<div :class="{ hidden: hidden }" class="pagination-container">
|
||||
<el-pagination
|
||||
small
|
||||
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
@ -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: 1 * 1024 * 1024, // 1M
|
||||
// 最多可上传几个文件,默认为 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>
|
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
@ -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();
|
||||
});
|
||||
}
|
187
src/layout/Index.vue
Normal file
@ -0,0 +1,187 @@
|
||||
<template>
|
||||
<el-container id="AppContainer">
|
||||
<el-aside width="200px">
|
||||
<div id="logo">
|
||||
<!-- 头部Logo替换 -->
|
||||
<img src="/logo.png" style="width: 180px;margin-top: 10px;margin-left: 10px;" alt="" />
|
||||
<!-- <span>ARW</span> -->
|
||||
</div>
|
||||
<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>
|
||||
<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;
|
||||
background-color: #f0f2f5;
|
||||
}
|
||||
.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;
|
||||
}
|
||||
</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: #ed1f65; // 头部logo背景色
|
||||
// background-color: #2b333e; //默认
|
||||
color: white;
|
||||
z-index: 99;
|
||||
img {
|
||||
width: 200px;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.header_right_title > span {
|
||||
font-weight: bold;
|
||||
margin: 2px;
|
||||
}
|
||||
|
||||
.el-header {
|
||||
font-size: 16px !important;
|
||||
display: flex;
|
||||
border-bottom: rgba(0, 0, 0, 0.1) 1px solid;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
width: 100%;
|
||||
height: 70px;
|
||||
|
||||
.el-dropdown,
|
||||
.el-dropdown-menu__item {
|
||||
font-size: 16px;
|
||||
color: white;
|
||||
}
|
||||
}
|
||||
</style>
|
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>
|
76
src/layout/components/Menu.vue
Normal file
@ -0,0 +1,76 @@
|
||||
<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="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>
|
||||
<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-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: #ed1f65 !important;
|
||||
}
|
||||
|
||||
/* 二级菜单开展箭头图标 */
|
||||
.el-sub-menu__icon-arrow>svg{
|
||||
color:white;
|
||||
}
|
||||
</style>
|
54
src/main.ts
Normal file
@ -0,0 +1,54 @@
|
||||
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 { 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);
|
||||
|
||||
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
@ -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>
|
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
@ -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
@ -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
@ -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
@ -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
@ -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
@ -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
@ -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
@ -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>
|
49
src/pages/index/flow/sourceCount/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_source" 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
@ -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>
|
240
src/pages/index/gen/editTable.vue
Normal file
@ -0,0 +1,240 @@
|
||||
<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="地图" 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 == 'radio' || 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
@ -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="genType">
|
||||
<template #label>
|
||||
生成代码方式
|
||||
<el-tooltip content="默认为zip压缩包下载" placement="top">
|
||||
<el-icon>
|
||||
<question-filled />
|
||||
</el-icon>
|
||||
</el-tooltip>
|
||||
</template>
|
||||
<el-radio v-model="info.genType" label="0">zip压缩包</el-radio>
|
||||
<el-radio v-model="info.genType" 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
@ -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
@ -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="http://aerwen.net/prod-api/cdn/阿尔文_SQL建表工具.msi" 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>
|
1408
src/pages/index/index.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
@ -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
@ -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>
|
187
src/pages/index/news/components/AddNewsDialog.vue
Normal file
@ -0,0 +1,187 @@
|
||||
<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_title">
|
||||
<el-input v-model='formData.news_title' type="text" placeholder='请输入新闻标题'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="新闻作者" prop="news_author">
|
||||
<el-input v-model='formData.news_author' type="text" placeholder='请输入新闻作者'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="新闻简介" prop="news_intro">
|
||||
<el-input v-model='formData.news_intro' type="textarea" placeholder='请输入新闻简介'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="新闻类型" prop="news_type" :label-width="labelWidth">
|
||||
<el-select v-model="formData.news_type" clearable placeholder="请选择">
|
||||
<el-option v-for="item in news_typee" :key="item.dictionary_guid" :label="item.dictionary_name"
|
||||
:value="item.dictionary_value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span='12'>
|
||||
<el-form-item :label-width='labelWidth' label='新闻封面图片' prop='news_img'>
|
||||
<UploadImage ref='uploadRef' v-model='formData.news_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="news_num">
|
||||
<el-input-number v-model='formData.news_num'></el-input-number>
|
||||
</el-form-item>
|
||||
</el-col> -->
|
||||
|
||||
|
||||
|
||||
<el-col :span="24">
|
||||
<el-form-item :label-width="labelWidth" label="新闻内容" prop="news_content">
|
||||
<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";
|
||||
|
||||
// --业务参数
|
||||
|
||||
|
||||
|
||||
// --业务方法
|
||||
|
||||
// 字典获取
|
||||
const news_typee = ref([]);
|
||||
async function get_news_typee() {
|
||||
await getDictionary({ dictionary_value: 'news_typee' }).then((res) => {
|
||||
news_typee.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: "News"
|
||||
})
|
||||
|
||||
watch(props, (v) => {
|
||||
dialogVisible.value = v.modelValue;
|
||||
});
|
||||
|
||||
const rules = reactive({
|
||||
news_title: [
|
||||
{
|
||||
required: true,
|
||||
message: '新闻标题不能为空'
|
||||
}
|
||||
],
|
||||
news_author: [
|
||||
{
|
||||
required: true,
|
||||
message: '新闻作者不能为空'
|
||||
}
|
||||
],
|
||||
news_intro: [
|
||||
{
|
||||
required: true,
|
||||
message: '新闻简介不能为空'
|
||||
}
|
||||
],
|
||||
news_type: [
|
||||
{
|
||||
required: true,
|
||||
message: '新闻类型不能为空'
|
||||
}
|
||||
],
|
||||
news_img: [
|
||||
{
|
||||
required: true,
|
||||
message: '新闻封面不能为空'
|
||||
}
|
||||
],
|
||||
news_time: [
|
||||
{
|
||||
required: true,
|
||||
message: '新闻到期时间不能为空'
|
||||
}
|
||||
],
|
||||
|
||||
});
|
||||
|
||||
|
||||
// --基础方法
|
||||
|
||||
// 打开弹窗时执行
|
||||
const openDialog = () => {
|
||||
get_news_typee()
|
||||
|
||||
};
|
||||
|
||||
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 addNews(formData);
|
||||
if (code == 0) {
|
||||
closeDialog();
|
||||
props.done();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const handleResetClick = async (formEl) => {
|
||||
if (!formEl) return;
|
||||
formEl.resetFields();
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped></style>
|
110
src/pages/index/news/components/DetailNewsDialog.vue
Normal file
@ -0,0 +1,110 @@
|
||||
<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_title">
|
||||
<el-input v-model='formData.news_title' type="text" placeholder='请输入新闻标题'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="新闻作者" prop="news_author">
|
||||
<el-input v-model='formData.news_author' type="text" placeholder='请输入新闻作者'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="新闻简介" prop="news_intro">
|
||||
<el-input v-model='formData.news_intro' type="textarea" placeholder='请输入新闻简介'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="新闻类型" prop="news_type" :label-width="labelWidth">
|
||||
<el-select v-model="formData.news_type" clearable placeholder="请选择">
|
||||
<el-option v-for="item in news_typee" :key="item.dictionary_guid" :label="item.dictionary_name"
|
||||
:value="item.dictionary_value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span='12'>
|
||||
<el-form-item :label-width='labelWidth' label='新闻封面图片' prop='news_img'>
|
||||
<UploadImage ref='uploadRef' v-model='formData.news_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="news_num">
|
||||
<span>{{formData.news_num}}</span>
|
||||
<!-- <el-input-number v-model='formData.news_num'></el-input-number> -->
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item :label-width="labelWidth" label="新闻内容" prop="news_content">
|
||||
<RichText v-model='formData.news_content'></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 { getDictionary } from '~/service/news';
|
||||
|
||||
// --业务参数
|
||||
|
||||
|
||||
|
||||
// --业务方法
|
||||
|
||||
// 字典获取
|
||||
const news_typee = ref([]);
|
||||
async function get_news_typee() {
|
||||
await getDictionary({ dictionary_value: 'news_typee' }).then((res) => {
|
||||
news_typee.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_news_typee()
|
||||
|
||||
};
|
||||
|
||||
const closeDialog = () => {
|
||||
emits("update:modelValue", false);
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped></style>
|
184
src/pages/index/news/components/EditNewsDialog.vue
Normal file
@ -0,0 +1,184 @@
|
||||
<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_title">
|
||||
<el-input v-model='formData.news_title' type="text" placeholder='请输入新闻标题'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="新闻作者" prop="news_author">
|
||||
<el-input v-model='formData.news_author' type="text" placeholder='请输入新闻作者'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="新闻简介" prop="news_intro">
|
||||
<el-input v-model='formData.news_intro' type="textarea" placeholder='请输入新闻简介'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="新闻类型" prop="news_type" :label-width="labelWidth">
|
||||
<el-select v-model="formData.news_type" clearable placeholder="请选择">
|
||||
<el-option v-for="item in news_typee" :key="item.dictionary_guid" :label="item.dictionary_name"
|
||||
:value="item.dictionary_value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span='12'>
|
||||
<el-form-item :label-width='labelWidth' label='新闻封面图片' prop='news_img'>
|
||||
<UploadImage ref='uploadRef' v-model='formData.news_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="news_num">
|
||||
<span>{{formData.news_num}}</span>
|
||||
<!-- <el-input-number v-model='formData.news_num'></el-input-number> -->
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="24">
|
||||
<el-form-item :label-width="labelWidth" label="新闻内容" prop="news_content">
|
||||
<RichText v-model='formData.news_content'></RichText>
|
||||
</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 { editNews, getDictionary } from "~/service/news";
|
||||
import { useLoginStore } from "~/store";
|
||||
|
||||
// --业务参数
|
||||
|
||||
|
||||
|
||||
// --业务方法
|
||||
|
||||
// 字典获取
|
||||
const news_typee = ref([]);
|
||||
async function get_news_typee() {
|
||||
await getDictionary({ dictionary_value: 'news_typee' }).then((res) => {
|
||||
news_typee.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: "News"
|
||||
})
|
||||
|
||||
|
||||
// --基础方法
|
||||
watch(props, (v) => {
|
||||
formData.value = v.data;
|
||||
|
||||
|
||||
});
|
||||
|
||||
// 打开弹窗时执行
|
||||
const openDialog = () => {
|
||||
get_news_typee()
|
||||
|
||||
};
|
||||
|
||||
const closeDialog = () => {
|
||||
props.done();
|
||||
emits("update:modelValue", false);
|
||||
};
|
||||
|
||||
const rules = reactive({
|
||||
news_title: [
|
||||
{
|
||||
required: true,
|
||||
message: '新闻标题不能为空'
|
||||
}
|
||||
],
|
||||
news_author: [
|
||||
{
|
||||
required: true,
|
||||
message: '新闻作者不能为空'
|
||||
}
|
||||
],
|
||||
news_intro: [
|
||||
{
|
||||
required: true,
|
||||
message: '新闻简介不能为空'
|
||||
}
|
||||
],
|
||||
news_type: [
|
||||
{
|
||||
required: true,
|
||||
message: '新闻类型不能为空'
|
||||
}
|
||||
],
|
||||
news_img: [
|
||||
{
|
||||
required: true,
|
||||
message: '新闻封面不能为空'
|
||||
}
|
||||
],
|
||||
news_time: [
|
||||
{
|
||||
required: true,
|
||||
message: '新闻到期时间不能为空'
|
||||
}
|
||||
],
|
||||
|
||||
});
|
||||
|
||||
const handleEditClick = async (formEl) => {
|
||||
console.log(formData.value);
|
||||
if (!formEl) return;
|
||||
formEl.validate(async (valid) => {
|
||||
if (!valid) {
|
||||
return;
|
||||
}
|
||||
|
||||
const { code } = await editNews(formData.value);
|
||||
if (code == 0) {
|
||||
closeDialog();
|
||||
props.done();
|
||||
}
|
||||
});
|
||||
};
|
||||
const handleResetClick = async (formEl) => {
|
||||
if (!formEl) return;
|
||||
formEl.resetFields();
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped></style>
|
253
src/pages/index/news/index.vue
Normal file
@ -0,0 +1,253 @@
|
||||
<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-input v-model='params.news_title' placeholder='请输入新闻标题'></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="新闻类型">
|
||||
<el-select v-model="params.news_type" clearable placeholder="请选择">
|
||||
<el-option v-for="item in news_typee" :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="addNewsDialogVisible = true"> 添加 </el-button>
|
||||
</el-col>
|
||||
|
||||
|
||||
<!-- 导出 -->
|
||||
<el-button icon="ElIconDocument" @click="exportExcel(params)">导出</el-button>
|
||||
|
||||
<!-- 导入 -->
|
||||
<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="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_img="scope">
|
||||
<el-image v-if="scope.row.news_img" :src="scope.row.news_img.split(',')[0]" lazy
|
||||
:preview-src-list="scope.row.news_img.split(',')" :preview-teleported="true" :hide-on-click-modal="true"
|
||||
fit="contain" class="el-avatar"></el-image>
|
||||
<template v-else>暂无图片</template>
|
||||
</template>
|
||||
|
||||
<template #news_type='scope'>
|
||||
<dict-tag :options='news_typee' :value='scope.row.news_type' />
|
||||
</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 } from 'vue';
|
||||
import { useLoginStore } from "~/store";
|
||||
import { getNewsList, 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_title: "",
|
||||
news_type: "",
|
||||
|
||||
});
|
||||
const column = [
|
||||
|
||||
{
|
||||
fixed: true,
|
||||
type: 'selection'
|
||||
},
|
||||
{
|
||||
prop: "news_title",
|
||||
label: '新闻标题',
|
||||
width: '150'
|
||||
},
|
||||
{
|
||||
prop: "news_author",
|
||||
label: '新闻作者',
|
||||
width: '150'
|
||||
},
|
||||
{
|
||||
prop: "news_intro",
|
||||
label: '新闻简介',
|
||||
width: '150'
|
||||
},
|
||||
{
|
||||
prop: "news_type",
|
||||
label: '新闻类型',
|
||||
width: '150'
|
||||
},
|
||||
{
|
||||
prop: "news_img",
|
||||
label: '新闻封面',
|
||||
width: '150'
|
||||
},
|
||||
|
||||
|
||||
{
|
||||
prop: "news_num",
|
||||
label: '新闻浏览数量',
|
||||
width: '150'
|
||||
},
|
||||
{
|
||||
label: '操作',
|
||||
prop: 'chaoz',
|
||||
width: '250'
|
||||
}
|
||||
];
|
||||
|
||||
|
||||
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 news_typee = ref([]);
|
||||
async function get_news_typee() {
|
||||
await getDictionary({ dictionary_value: 'news_typee' }).then((res) => {
|
||||
news_typee.value = res
|
||||
})
|
||||
}
|
||||
get_news_typee()
|
||||
</script>
|
262
src/pages/index/products/product/components/AddProductDialog.vue
Normal file
@ -0,0 +1,262 @@
|
||||
<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" @change="getTempList()"
|
||||
:props="{ checkStrictly: true, value: 'product_type_guid', label: 'product_type_name', emitPath: false, }"
|
||||
placeholder="请选择上级菜单" 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="12">
|
||||
<el-form-item :label-width="labelWidth" label="价格" prop="product_price">
|
||||
<el-input-number v-model='formData.product_price' 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_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-row>
|
||||
|
||||
|
||||
<el-row style="margin: 0 20px;">
|
||||
<span>产品参数</span>
|
||||
<el-col class="por_tem_sty" :span='18'>
|
||||
<!-- 新增自定义 -->
|
||||
<el-form-item :label-width='labelWidth' label="自定义">
|
||||
<el-input style="width: 40%;margin-right: 10px" v-model="productParamFormData.name"
|
||||
placeholder='请输入产品参数名称'></el-input>
|
||||
<el-input style="width: 40%;margin-right: 10px" v-model="productParamFormData.value"
|
||||
placeholder='请输入产品参数内容'></el-input>
|
||||
<el-button style="margin-left: 10px" :circle="true" icon="el-icon-plus"
|
||||
@click="addProductParam()"></el-button>
|
||||
</el-form-item>
|
||||
<!-- 编辑 -->
|
||||
<el-form-item v-for="(item, index) in formData.product_params" :key="index" :label-width='labelWidth'
|
||||
:label="item.product_param_name">
|
||||
<div style="display: flex">
|
||||
<el-input v-model='item.product_param_value' :placeholder="'请输入' + item.product_param_name"></el-input>
|
||||
<el-button style="margin-left: 10px" :circle="true" icon="el-icon-minus"
|
||||
@click="deleteProductParam(index)"></el-button>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-button type="danger" style="width: 100%;" @click="deleteAllProductParam()">一键清空</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row>
|
||||
<el-col>
|
||||
<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" :loading=isBtnLoading @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 { getProductParamTemplate } from '~/service/product_param';
|
||||
import { useLoginStore } from "~/store";
|
||||
|
||||
// --业务方法
|
||||
//产品系列
|
||||
const dataList = ref();
|
||||
async function getList() {
|
||||
getProductTypeTree().then((res) => {
|
||||
if (res.code == 0) {
|
||||
dataList.value = res.data
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
//产品参数
|
||||
async function getTempList() {
|
||||
if (formData.product_type_guid) {
|
||||
getProductParamTemplate({ product_type_guid: formData.product_type_guid })
|
||||
.then((res) => {
|
||||
if (res.code == 0) {
|
||||
formData.product_params = res.data;
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
const productParamFormData = reactive({});
|
||||
const addProductParam = () => {
|
||||
if (!formData.product_params) formData.product_params = [];
|
||||
if (!productParamFormData.name || !productParamFormData.name.trim() || !productParamFormData.value || !productParamFormData.value.trim()) return;
|
||||
formData.product_params.push({
|
||||
product_param_name: productParamFormData.name,
|
||||
product_param_value: productParamFormData.value
|
||||
});
|
||||
productParamFormData.name = null;
|
||||
productParamFormData.value = null;
|
||||
}
|
||||
const deleteProductParam = (index) => {
|
||||
formData.product_params.splice(index, 1);
|
||||
}
|
||||
const deleteAllProductParam = () => {
|
||||
ElMessageBox.confirm(`您确定要一键清空产品参数吗?`).then(() => {
|
||||
formData.product_params = [];
|
||||
});
|
||||
}
|
||||
const verifyProductParam = () => {
|
||||
let isSu = true;
|
||||
if (formData.product_params) {
|
||||
formData.product_params.some(item => {
|
||||
if (!item.product_param_value || !item.product_param_value.trim()) {
|
||||
ElMessage.error(`产品参数含有空值`)
|
||||
isSu = false;
|
||||
return true;
|
||||
}
|
||||
});
|
||||
}
|
||||
return isSu;
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
// --基础参数
|
||||
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: "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_details: [
|
||||
{
|
||||
required: true,
|
||||
message: '详情不能为空'
|
||||
}
|
||||
],
|
||||
product_price: [
|
||||
{
|
||||
required: true,
|
||||
message: '价格不能为空'
|
||||
}
|
||||
],
|
||||
|
||||
});
|
||||
|
||||
|
||||
// --基础方法
|
||||
|
||||
// 打开弹窗时执行
|
||||
const openDialog = () => {
|
||||
getList();
|
||||
};
|
||||
|
||||
|
||||
const closeDialog = () => {
|
||||
props.done();
|
||||
handleResetClick(formRef.value);
|
||||
dialogVisible.value = false;
|
||||
emits("update:modelValue", false);
|
||||
};
|
||||
|
||||
const isBtnLoading = ref(false);
|
||||
const handleAddClick = async (formEl) => {
|
||||
if (!formEl) return;
|
||||
if (verifyProductParam() == false) return;
|
||||
formEl.validate(async (valid) => {
|
||||
if (!valid) return;
|
||||
|
||||
isBtnLoading.value = true;
|
||||
const { code } = await addProduct(formData);
|
||||
if (code == 0) {
|
||||
closeDialog();
|
||||
props.done();
|
||||
}
|
||||
isBtnLoading.value = false
|
||||
});
|
||||
};
|
||||
|
||||
const handleResetClick = async (formEl) => {
|
||||
if (!formEl) return;
|
||||
formEl.resetFields();
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.por_tem {
|
||||
margin: 0 20px;
|
||||
}
|
||||
|
||||
.por_tem_sty {
|
||||
border: rgb(210, 208, 208) 1px solid;
|
||||
padding: 15px;
|
||||
border-radius: 10px;
|
||||
margin: 25px 20px;
|
||||
}
|
||||
</style>
|
@ -0,0 +1,102 @@
|
||||
<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_guid">
|
||||
<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_name">
|
||||
<el-input v-model='formData.product_name' type="text" placeholder='请输入产品名称'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="产品价格" prop="product_price">
|
||||
<el-input-number v-model='formData.product_price' 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_img'>
|
||||
<UploadImage ref='uploadRef' v-model='formData.product_img' :data=uoloadData :limit='1' :fileSize='5'
|
||||
:drag='true' :isShowTip='false' />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col>
|
||||
<el-form-item :label-width='labelWidth' label='产品参数' prop='product_img'>
|
||||
<ElTag v-if="formData.product_params" v-for="(item, index) in formData.product_params" :key="index"
|
||||
style="margin: 10px;" effect="light">
|
||||
{{ item.product_param_name }}:{{ item.product_param_value }}
|
||||
</ElTag>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-row>
|
||||
<el-col :span="22">
|
||||
<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";
|
||||
|
||||
|
||||
// --业务参数
|
||||
|
||||
|
||||
|
||||
// --业务方法
|
||||
|
||||
|
||||
|
||||
|
||||
// --基础参数
|
||||
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,257 @@
|
||||
<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" @change="getTempList()"
|
||||
:props="{ checkStrictly: true, value: 'product_type_guid', label: 'product_type_name', emitPath: false }"
|
||||
placeholder="请选择上级菜单" 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="12">
|
||||
<el-form-item :label-width="labelWidth" label="价格" prop="product_price">
|
||||
<el-input-number v-model='formData.product_price' 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_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-row>
|
||||
|
||||
|
||||
<el-row style="margin: 0 20px;">
|
||||
<span>产品参数</span>
|
||||
<el-col class="por_tem_sty" :span='18'>
|
||||
<!-- 新增自定义 -->
|
||||
<el-form-item :label-width='labelWidth' label="自定义">
|
||||
<el-input style="width: 40%;margin-right: 10px" v-model="productParamFormData.name"
|
||||
placeholder='请输入产品参数名称'></el-input>
|
||||
<el-input style="width: 40%;margin-right: 10px" v-model="productParamFormData.value"
|
||||
placeholder='请输入产品参数内容'></el-input>
|
||||
<el-button style="margin-left: 10px" :circle="true" icon="el-icon-plus"
|
||||
@click="addProductParam()"></el-button>
|
||||
</el-form-item>
|
||||
<!-- 编辑 -->
|
||||
<el-form-item v-for="(item, index) in formData.product_params" :key="index" :label-width='labelWidth'
|
||||
:label="item.product_param_name">
|
||||
<div style="display: flex">
|
||||
<el-input v-model='item.product_param_value' :placeholder="'请输入' + item.product_param_name"></el-input>
|
||||
<el-button style="margin-left: 10px" :circle="true" icon="el-icon-minus"
|
||||
@click="deleteProductParam(index)"></el-button>
|
||||
</div>
|
||||
</el-form-item>
|
||||
<el-button type="danger" style="width: 100%;" @click="deleteAllProductParam()">一键清空</el-button>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
<el-row>
|
||||
<el-col>
|
||||
<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" :loading="isBtnLoading" @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 { editProduct } from "~/service/product";
|
||||
import { getProductTypeTree } from '~/service/product_type';
|
||||
import { getProductParamTemplate } from '~/service/product_param';
|
||||
import { useLoginStore } from "~/store";
|
||||
|
||||
// --业务参数
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// --业务方法
|
||||
//产品系列
|
||||
const dataList = ref();
|
||||
async function getList() {
|
||||
getProductTypeTree().then((res) => {
|
||||
if (res.code == 0) {
|
||||
dataList.value = res.data
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
//产品参数
|
||||
async function getTempList() {
|
||||
if (formData.value.product_type_guid) {
|
||||
getProductParamTemplate({ product_type_guid: formData.value.product_type_guid })
|
||||
.then((res) => {
|
||||
if (res.code == 0) {
|
||||
formData.value.product_params = res.data
|
||||
}
|
||||
})
|
||||
}
|
||||
}
|
||||
const productParamFormData = reactive({});
|
||||
const addProductParam = () => {
|
||||
if (!formData.value.product_params) formData.value.product_params = [];
|
||||
if (!productParamFormData.name || !productParamFormData.name.trim() || !productParamFormData.value || !productParamFormData.value.trim()) return;
|
||||
formData.value.product_params.push({
|
||||
product_param_name: productParamFormData.name,
|
||||
product_param_value: productParamFormData.value
|
||||
});
|
||||
productParamFormData.name = null;
|
||||
productParamFormData.value = null;
|
||||
}
|
||||
const deleteProductParam = (index) => {
|
||||
formData.value.product_params.splice(index, 1);
|
||||
}
|
||||
const deleteAllProductParam = () => {
|
||||
ElMessageBox.confirm(`您确定要一键清空产品参数吗?`).then(() => {
|
||||
formData.value.product_params = [];
|
||||
});
|
||||
}
|
||||
const verifyProductParam = () => {
|
||||
let isSu = true;
|
||||
if (formData.value.product_params) {
|
||||
formData.value.product_params.some(item => {
|
||||
if (!item.product_param_value || !item.product_param_value.trim()) {
|
||||
ElMessage.error(`产品参数含有空值`)
|
||||
isSu = false;
|
||||
return true;
|
||||
}
|
||||
});
|
||||
}
|
||||
return isSu;
|
||||
}
|
||||
|
||||
// --基础参数
|
||||
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: "Product"
|
||||
})
|
||||
|
||||
|
||||
// --基础方法
|
||||
watch(props, (v) => {
|
||||
formData.value = v.data;
|
||||
});
|
||||
|
||||
// 打开弹窗时执行
|
||||
const openDialog = () => {
|
||||
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_details: [
|
||||
{
|
||||
required: true,
|
||||
message: '详情不能为空'
|
||||
}
|
||||
],
|
||||
product_price: [
|
||||
{
|
||||
required: true,
|
||||
message: '价格不能为空'
|
||||
}
|
||||
],
|
||||
|
||||
});
|
||||
|
||||
const isBtnLoading = ref(false);
|
||||
const handleEditClick = async (formEl) => {
|
||||
if (!formEl) return;
|
||||
if (verifyProductParam() == false) return;
|
||||
formEl.validate(async (valid) => {
|
||||
if (!valid) return;
|
||||
|
||||
isBtnLoading.value = true
|
||||
const { code } = await editProduct(formData.value);
|
||||
if (code == 0) {
|
||||
closeDialog();
|
||||
props.done();
|
||||
}
|
||||
isBtnLoading.value = false
|
||||
});
|
||||
};
|
||||
const handleResetClick = async (formEl) => {
|
||||
if (!formEl) return;
|
||||
formEl.resetFields();
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.por_tem_sty {
|
||||
border: rgb(210, 208, 208) 1px solid;
|
||||
padding: 15px;
|
||||
border-radius: 10px;
|
||||
margin: 25px 20px;
|
||||
}
|
||||
</style>
|
254
src/pages/index/products/product/index.vue
Normal file
@ -0,0 +1,254 @@
|
||||
<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="产品系列" 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="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" :done="() => tableRef.reload()"> 添加 </el-button>
|
||||
</el-col>
|
||||
|
||||
|
||||
<!-- 导出 -->
|
||||
<!-- <el-button icon="ElIconDocument" @click="exportExcel(params)">导出</el-button> -->
|
||||
|
||||
<!-- 导入 -->
|
||||
<!-- <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="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_params="scope">
|
||||
<el-tag v-if="scope.row.product_params && scope.row.product_params.length"
|
||||
v-for="(item, index) in scope.row.product_params" :key="index" style="margin: 5px;" effect="light">
|
||||
{{ item.product_param_name }}:{{ item.product_param_value }}
|
||||
</el-tag>
|
||||
<el-tag type="info" v-else>未填写参数</el-tag>
|
||||
</template>
|
||||
<template #product_img="scope">
|
||||
<el-image v-for="(item, index) in scope.row.product_img" :key="index" :src="item.url" lazy
|
||||
:preview-src-list="scope.row.product_img" :preview-teleported="true" :hide-on-click-modal="true" fit="contain"
|
||||
class="el-avatar"></el-image>
|
||||
</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 } from 'vue';
|
||||
import { useLoginStore } from "~/store";
|
||||
import { getProductList, deleteProduct, exportExcel, downloadTemplate, importExcel } from '~/service/product';
|
||||
import AddProductDialog from './components/AddProductDialog.vue';
|
||||
import EditProductDialog from './components/EditProductDialog.vue';
|
||||
import { getProductTypeTree } from '~/service/product_type';
|
||||
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_name: "",
|
||||
product_type_guid: "",
|
||||
});
|
||||
const column = [
|
||||
|
||||
{
|
||||
fixed: true,
|
||||
type: 'selection'
|
||||
},
|
||||
{
|
||||
prop: "product_type_name",
|
||||
label: '产品系列',
|
||||
width: '150'
|
||||
},
|
||||
{
|
||||
prop: "product_name",
|
||||
label: '产品名称',
|
||||
width: '150'
|
||||
},
|
||||
{
|
||||
prop: "product_img",
|
||||
label: '产品图片',
|
||||
width: '300'
|
||||
},
|
||||
{
|
||||
prop: "product_params",
|
||||
label: '产品参数',
|
||||
width: '400'
|
||||
},
|
||||
{
|
||||
prop: "product_price",
|
||||
label: '产品价格',
|
||||
width: '150'
|
||||
},
|
||||
{
|
||||
label: '操作',
|
||||
prop: 'chaoz',
|
||||
fixed: 'right',
|
||||
width: '250'
|
||||
}
|
||||
];
|
||||
|
||||
|
||||
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
|
||||
}
|
||||
|
||||
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,138 @@
|
||||
<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: true, 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-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="参数名称" prop="product_param_name">
|
||||
<el-input v-model='formData.product_param_name' type="text" placeholder='请输入产品参数名称'></el-input>
|
||||
</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 { addProductParam } from "~/service/product_param";
|
||||
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 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: "ProductParam"
|
||||
})
|
||||
|
||||
watch(props, (v) => {
|
||||
dialogVisible.value = v.modelValue;
|
||||
});
|
||||
|
||||
const rules = reactive({
|
||||
product_param_name: [
|
||||
{
|
||||
required: true,
|
||||
message: '产品参数名称不能为空'
|
||||
}
|
||||
],
|
||||
product_type_guid: [
|
||||
{
|
||||
required: true,
|
||||
message: '产品系列不能为空'
|
||||
}
|
||||
],
|
||||
|
||||
});
|
||||
|
||||
|
||||
// --基础方法
|
||||
|
||||
// 打开弹窗时执行
|
||||
const openDialog = () => {
|
||||
getList();
|
||||
};
|
||||
|
||||
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 addProductParam(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,72 @@
|
||||
<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_param_name">
|
||||
<el-input v-model='formData.product_param_name' type="text" placeholder='请输入产品参数名称'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="产品系列" prop="product_type_guid">
|
||||
<el-input v-model='formData.product_type_guid' type="text" placeholder='请输入产品系列'></el-input>
|
||||
</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,133 @@
|
||||
<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: true, 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-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="参数名称" prop="product_param_name">
|
||||
<el-input v-model='formData.product_param_name' type="text" placeholder='请输入产品参数名称'></el-input>
|
||||
</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 { editProductParam } from "~/service/product_param";
|
||||
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 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: "ProductParam"
|
||||
})
|
||||
|
||||
|
||||
// --基础方法
|
||||
watch(props, (v) => {
|
||||
formData.value = v.data;
|
||||
|
||||
|
||||
});
|
||||
|
||||
// 打开弹窗时执行
|
||||
const openDialog = () => {
|
||||
getList();
|
||||
};
|
||||
|
||||
const closeDialog = () => {
|
||||
props.done();
|
||||
emits("update:modelValue", false);
|
||||
};
|
||||
|
||||
const rules = reactive({
|
||||
product_param_name: [
|
||||
{
|
||||
required: true,
|
||||
message: '产品参数名称不能为空'
|
||||
}
|
||||
],
|
||||
product_type_guid: [
|
||||
{
|
||||
required: true,
|
||||
message: '产品系列不能为空'
|
||||
}
|
||||
],
|
||||
|
||||
});
|
||||
|
||||
const handleEditClick = async (formEl) => {
|
||||
console.log(formData.value);
|
||||
if (!formEl) return;
|
||||
formEl.validate(async (valid) => {
|
||||
if (!valid) {
|
||||
return;
|
||||
}
|
||||
|
||||
const { code } = await editProductParam(formData.value);
|
||||
if (code == 0) {
|
||||
closeDialog();
|
||||
props.done();
|
||||
}
|
||||
});
|
||||
};
|
||||
const handleResetClick = async (formEl) => {
|
||||
if (!formEl) return;
|
||||
formEl.resetFields();
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped></style>
|
197
src/pages/index/products/product_param/index.vue
Normal file
@ -0,0 +1,197 @@
|
||||
<template>
|
||||
<!-- 面包屑 -->
|
||||
<el-breadcrumb>
|
||||
<el-breadcrumb-item>产品参数管理</el-breadcrumb-item>
|
||||
<el-breadcrumb-item to="/product_param/list">产品参数列表</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
<!-- 搜索 -->
|
||||
<el-form inline :model="params">
|
||||
|
||||
<el-form-item 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="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>
|
||||
<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="addProductParamDialogVisible = 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 => getProductParamList(params)">
|
||||
|
||||
<template #product_param_order="scope">
|
||||
<el-input-number v-model='scope.row.product_param_order' controls-position="right" size="small"
|
||||
@change="editProductParam(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>
|
||||
|
||||
<!-- 添加产品参数 -->
|
||||
<AddProductParamDialog v-model="addProductParamDialogVisible" :done="() => tableRef.reload()"></AddProductParamDialog>
|
||||
<!-- 编辑产品参数 -->
|
||||
<EditProductParamDialog v-model="EditProductParamDialogVisible" :data="EditProductParamDialogRow"
|
||||
:done="() => tableRef.reload()"></EditProductParamDialog>
|
||||
<!-- 产品参数详情 -->
|
||||
<DetailProductParamDialog v-model="DetailProductParamDialogVisible" :data="DetailProductParamDialogRow">
|
||||
</DetailProductParamDialog>
|
||||
</template>
|
||||
<script setup>
|
||||
import { ArrowDown } from '@element-plus/icons-vue';
|
||||
import { ref, reactive } from 'vue';
|
||||
import { useLoginStore } from "~/store";
|
||||
import { getProductParamList, editProductParam, deleteProductParam } from '~/service/product_param';
|
||||
import { getProductTypeTree } from '~/service/product_type';
|
||||
import AddProductParamDialog from './components/AddProductParamDialog.vue';
|
||||
import EditProductParamDialog from './components/EditProductParamDialog.vue';
|
||||
import DetailProductParamDialog from './components/DetailProductParamDialog.vue';
|
||||
|
||||
const tableRef = ref();
|
||||
const selectionData = ref([]);
|
||||
const store = useLoginStore();
|
||||
|
||||
const addProductParamDialogVisible = ref(false);
|
||||
const EditProductParamDialogVisible = ref(false);
|
||||
const EditProductParamDialogRow = ref({});
|
||||
const DetailProductParamDialogVisible = ref(false);
|
||||
const DetailProductParamDialogRow = ref({});
|
||||
|
||||
const headers = {
|
||||
Accept: "application/json",
|
||||
...store.headers,
|
||||
};
|
||||
|
||||
const dataList = ref();
|
||||
async function getList() {
|
||||
getProductTypeTree().then((res) => {
|
||||
if (res.code == 0) {
|
||||
dataList.value = res.data
|
||||
}
|
||||
})
|
||||
}
|
||||
getList();
|
||||
|
||||
// 查询参数
|
||||
const params = reactive({
|
||||
product_type_guid: "",
|
||||
|
||||
});
|
||||
const column = [
|
||||
|
||||
{
|
||||
fixed: true,
|
||||
type: 'selection'
|
||||
},
|
||||
{
|
||||
prop: "product_param_name",
|
||||
label: '产品参数名称',
|
||||
width: '150'
|
||||
},
|
||||
{
|
||||
prop: "product_type_name",
|
||||
label: '产品系列',
|
||||
width: '150'
|
||||
},
|
||||
{
|
||||
prop: "product_param_order",
|
||||
label: '参数排序',
|
||||
width: '150'
|
||||
},
|
||||
{
|
||||
label: '操作',
|
||||
prop: 'chaoz',
|
||||
fixed: 'right',
|
||||
width: '250'
|
||||
|
||||
}
|
||||
];
|
||||
|
||||
|
||||
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 deleteProductParam({
|
||||
product_param_guid: data.map(v => v.product_param_guid).join()
|
||||
});
|
||||
if (res) {
|
||||
tableRef.value.reload();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
// 修改
|
||||
function handleUpdate(row) {
|
||||
EditProductParamDialogVisible.value = true
|
||||
EditProductParamDialogRow.value = row
|
||||
}
|
||||
|
||||
// 详情
|
||||
function handleDetail(row) {
|
||||
DetailProductParamDialogVisible.value = true
|
||||
DetailProductParamDialogRow.value = row
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
</script>
|
@ -0,0 +1,169 @@
|
||||
<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_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="12">
|
||||
<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="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-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>
|
||||
|
||||
<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,
|
||||
done: Function,
|
||||
});
|
||||
const emits = defineEmits(["update:modelValue"]);
|
||||
const dialogVisible = ref(props.modelValue);
|
||||
const formData = reactive({
|
||||
product_type_parent_guid: '0',
|
||||
product_type_order: 1,
|
||||
});
|
||||
|
||||
const uoloadData = ref({
|
||||
dirName: "ProductType"
|
||||
})
|
||||
|
||||
watch(props, (v) => {
|
||||
dialogVisible.value = v.modelValue;
|
||||
});
|
||||
|
||||
const rules = reactive({
|
||||
product_type_name: [
|
||||
{
|
||||
required: true,
|
||||
message: '产品系列名称不能为空'
|
||||
}
|
||||
],
|
||||
product_type_icon: [
|
||||
{
|
||||
required: true,
|
||||
message: '产品系列图标不能为空'
|
||||
}
|
||||
],
|
||||
product_type_cover: [
|
||||
{
|
||||
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,163 @@
|
||||
<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_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="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_order">
|
||||
<el-input v-model='formData.product_type_order' type="number" 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='1'
|
||||
: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='1'
|
||||
: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: '产品系列标题不能为空'
|
||||
}
|
||||
],
|
||||
product_type_icon: [
|
||||
{
|
||||
required: true,
|
||||
message: '产品系列图标不能为空'
|
||||
}
|
||||
],
|
||||
product_type_cover: [
|
||||
{
|
||||
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>
|
269
src/pages/index/products/product_type/index.vue
Normal file
@ -0,0 +1,269 @@
|
||||
<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-button icon="ElIconDocument" @click="exportExcel(params)">导出</el-button> -->
|
||||
|
||||
<!-- 导入 -->
|
||||
<!-- <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="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" border 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_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_cover" width="200" label="产品系列封面" :show-overflow-tooltip="true">
|
||||
<template #default="scope">
|
||||
<el-image :src="scope.row.product_type_cover" :preview-src-list="[scope.row.product_type_cover]"
|
||||
: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="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" :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 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 column = [
|
||||
|
||||
{
|
||||
fixed: true,
|
||||
type: 'selection'
|
||||
},
|
||||
{
|
||||
prop: "product_type_name",
|
||||
label: '产品系列标题',
|
||||
width: '150'
|
||||
},
|
||||
{
|
||||
prop: "product_type_icon",
|
||||
label: '产品系列图标',
|
||||
width: '150'
|
||||
},
|
||||
{
|
||||
prop: "product_type_cover",
|
||||
label: '产品系列封面',
|
||||
width: '150'
|
||||
},
|
||||
{
|
||||
label: '操作',
|
||||
prop: 'chaoz',
|
||||
fixed: 'right',
|
||||
width: '250'
|
||||
}
|
||||
];
|
||||
|
||||
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 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>
|
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
@ -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>
|
92
src/pages/index/role/components/OauthDialog.vue
Normal file
@ -0,0 +1,92 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
v-model="dialogVisible"
|
||||
:title="`授权 ${params.role_name}`"
|
||||
width="80%"
|
||||
@open="openDialog"
|
||||
@closed="closeDialog"
|
||||
:destroy-on-close="true"
|
||||
>
|
||||
<el-tree
|
||||
ref="treeRef"
|
||||
:data="data"
|
||||
show-checkbox
|
||||
default-expand-all
|
||||
node-key="id"
|
||||
></el-tree>
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button type="primary" @click="handleCommitClick"> 授权 </el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ElMessage } from 'element-plus';
|
||||
import { ref, watch, reactive } from 'vue';
|
||||
import { getMenuTree, getRoleMenu, bindRoleMenu } from '~/service/menu';
|
||||
const treeRef = ref();
|
||||
|
||||
const props = defineProps({
|
||||
modelValue: Boolean,
|
||||
data: Object
|
||||
});
|
||||
const emits = defineEmits(['update:modelValue']);
|
||||
|
||||
const dialogVisible = ref(props.modelValue);
|
||||
const data = ref([]);
|
||||
|
||||
getMenuTree().then((res) => {
|
||||
if (res.code === 0) {
|
||||
data.value = res.data;
|
||||
}
|
||||
});
|
||||
|
||||
const params = reactive({
|
||||
role_guid: '',
|
||||
role_name: ''
|
||||
});
|
||||
watch(
|
||||
() => props.modelValue,
|
||||
(v) => {
|
||||
console.log('watch props.modelValue', v);
|
||||
dialogVisible.value = v;
|
||||
}
|
||||
);
|
||||
|
||||
const openDialog = async () => {
|
||||
params.role_guid = props.data.role_guid;
|
||||
params.role_name = props.data.role_name;
|
||||
loadRoleMenu();
|
||||
};
|
||||
|
||||
const closeDialog = () => {
|
||||
dialogVisible.value = false;
|
||||
emits('update:modelValue', false);
|
||||
// props.done();
|
||||
};
|
||||
|
||||
const loadRoleMenu = async () => {
|
||||
const { code, data } = await getRoleMenu(params);
|
||||
if (code == 0) {
|
||||
console.log('load', data);
|
||||
treeRef.value?.setCheckedKeys(data, false);
|
||||
}
|
||||
};
|
||||
|
||||
const handleCommitClick = async () => {
|
||||
const menu_ids = treeRef.value?.getCheckedKeys(false);
|
||||
if (menu_ids.length == 0) {
|
||||
ElMessage.warning('请选择菜单');
|
||||
return;
|
||||
}
|
||||
const { code } = await bindRoleMenu({
|
||||
...params,
|
||||
menu_guid: menu_ids.join()
|
||||
});
|
||||
if (code == 0) {
|
||||
loadRoleMenu();
|
||||
}
|
||||
};
|
||||
</script>
|
151
src/pages/index/role/list.vue
Normal file
@ -0,0 +1,151 @@
|
||||
<template>
|
||||
<!-- 面包屑 -->
|
||||
<el-breadcrumb>
|
||||
<el-breadcrumb-item>角色管理</el-breadcrumb-item>
|
||||
<el-breadcrumb-item to="/role/list">角色列表</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
<!-- 搜索 -->
|
||||
<el-form inline :model="params">
|
||||
<el-form-item label="角色">
|
||||
<el-input v-model="params.role" placeholder="请输入角色信息"></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="状态">
|
||||
<el-select
|
||||
v-model="params.role_status"
|
||||
clearable
|
||||
placeholder="请选择状态"
|
||||
>
|
||||
<el-option label="启用" value="1"></el-option>
|
||||
<el-option label="停用" value="2"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" @click="tableRef.reload()">搜索</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
<el-button type="primary" @click="addRoleDialogVisible = true">
|
||||
添加
|
||||
</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-item @click="changStatus(1)">启用角色</el-dropdown-item>
|
||||
<el-dropdown-item @click="changStatus(2)">禁用角色</el-dropdown-item>
|
||||
</el-dropdown-menu>
|
||||
</template>
|
||||
</el-dropdown>
|
||||
<!-- 数据表格 -->
|
||||
<DataTable
|
||||
ref="tableRef"
|
||||
style="width: 100%"
|
||||
:onSelectionChange="data => (selectionData = data)"
|
||||
:column="column"
|
||||
:params="params"
|
||||
:request="params => getRoleList(params)"
|
||||
>
|
||||
<template #chaoz="scope">
|
||||
<el-button
|
||||
size="small"
|
||||
@click="(oauthDialogVisible = true), (currentData = scope.row)"
|
||||
>
|
||||
授权
|
||||
</el-button>
|
||||
<el-button size="small" @click="editRoleDialogVisible = scope.row">
|
||||
编辑
|
||||
</el-button>
|
||||
<el-button size="small" type="danger" @click="handleDelete([scope.row])">
|
||||
删除
|
||||
</el-button>
|
||||
</template>
|
||||
</DataTable>
|
||||
<!-- 添加角色 -->
|
||||
<AddRoleDialog
|
||||
v-model="addRoleDialogVisible"
|
||||
:done="() => tableRef.reload()"
|
||||
></AddRoleDialog>
|
||||
<!-- 编辑角色 -->
|
||||
<EditRoleDialog
|
||||
v-model="editRoleDialogVisible"
|
||||
:done="() => tableRef.reload()"
|
||||
></EditRoleDialog>
|
||||
<!-- 授权 -->
|
||||
<OauthDialog v-model="oauthDialogVisible" :data="currentData"></OauthDialog>
|
||||
</template>
|
||||
<script setup>
|
||||
import { ArrowDown } from '@element-plus/icons-vue';
|
||||
import { ref, reactive } from 'vue';
|
||||
import { getRoleList, deleteRole, updateRoleStatus } from '~/service/role';
|
||||
import AddRoleDialog from './components/AddRoleDialog.vue';
|
||||
import EditRoleDialog from './components/EditRoleDialog.vue';
|
||||
import OauthDialog from './components/OauthDialog.vue';
|
||||
|
||||
const tableRef = ref();
|
||||
const selectionData = ref([]);
|
||||
// 查询参数
|
||||
const params = reactive({
|
||||
role: '',
|
||||
role_status: ''
|
||||
});
|
||||
const column = [
|
||||
{
|
||||
fixed: true,
|
||||
type: 'selection'
|
||||
},
|
||||
{
|
||||
prop: 'role_name',
|
||||
label: '名称',
|
||||
width: '150'
|
||||
},
|
||||
{
|
||||
prop: 'role_status_text',
|
||||
label: '状态',
|
||||
width: '150'
|
||||
},
|
||||
{
|
||||
label: '操作',
|
||||
prop: 'chaoz',
|
||||
width: '450'
|
||||
}
|
||||
];
|
||||
|
||||
const addRoleDialogVisible = ref(false);
|
||||
const editRoleDialogVisible = ref({});
|
||||
|
||||
const currentData = ref({});
|
||||
const bindUserDialogVisible = ref(false);
|
||||
const viewUserDialogVisible = ref(false);
|
||||
const oauthDialogVisible = ref(false);
|
||||
|
||||
// 删除数据
|
||||
const handleDelete = data => {
|
||||
ElMessageBox.confirm(`您确定要删除该角色吗?`).then(async () => {
|
||||
const { code } = await deleteRole({
|
||||
role_guid: data.map(v => v.role_guid).join()
|
||||
});
|
||||
if (code == 0) {
|
||||
tableRef.value.reload();
|
||||
}
|
||||
});
|
||||
};
|
||||
// 修改状态
|
||||
const changStatus = async status => {
|
||||
if (selectionData.value.length == 0) {
|
||||
ElMessage.warning('请选择数据');
|
||||
return;
|
||||
}
|
||||
const { code } = await updateRoleStatus({
|
||||
role_guid: selectionData.value.map(v => v.role_guid).join(),
|
||||
role_status: status
|
||||
});
|
||||
if (code == 0) {
|
||||
tableRef.value.reload();
|
||||
}
|
||||
};
|
||||
</script>
|
113
src/pages/index/school/classes/components/AddClassesDialog.vue
Normal file
@ -0,0 +1,113 @@
|
||||
<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="classes_name">
|
||||
<el-input v-model='formData.classes_name' type="text" placeholder='请输入班级名称'></el-input>
|
||||
</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 { addClasses } from "~/service/classes";
|
||||
import { useLoginStore } from "~/store";
|
||||
|
||||
// --业务参数
|
||||
|
||||
|
||||
|
||||
// --业务方法
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// --基础参数
|
||||
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: "Classes"
|
||||
})
|
||||
|
||||
watch(props, (v) => {
|
||||
dialogVisible.value = v.modelValue;
|
||||
});
|
||||
|
||||
const rules = reactive({
|
||||
classes_name: [
|
||||
{
|
||||
required: true,
|
||||
message: '班级名称不能为空'
|
||||
}
|
||||
],
|
||||
|
||||
});
|
||||
|
||||
|
||||
// --基础方法
|
||||
|
||||
// 打开弹窗时执行
|
||||
const openDialog = () => {
|
||||
|
||||
};
|
||||
|
||||
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 addClasses(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,65 @@
|
||||
<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="classes_name">
|
||||
<el-input v-model='formData.classes_name' type="text" placeholder='请输入班级名称'></el-input>
|
||||
</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>
|
110
src/pages/index/school/classes/components/EditClassesDialog.vue
Normal file
@ -0,0 +1,110 @@
|
||||
<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="classes_name">
|
||||
<el-input v-model='formData.classes_name' type="text" placeholder='请输入班级名称'></el-input>
|
||||
</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 { editClasses } from "~/service/classes";
|
||||
import { useLoginStore } from "~/store";
|
||||
|
||||
// --业务参数
|
||||
|
||||
|
||||
|
||||
// --业务方法
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
// --基础参数
|
||||
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: "Classes"
|
||||
})
|
||||
|
||||
|
||||
// --基础方法
|
||||
watch(props, (v) => {
|
||||
formData.value = v.data;
|
||||
});
|
||||
|
||||
// 打开弹窗时执行
|
||||
const openDialog = () => {
|
||||
|
||||
|
||||
};
|
||||
|
||||
const closeDialog = () => {
|
||||
props.done();
|
||||
emits("update:modelValue", false);
|
||||
};
|
||||
|
||||
const rules = reactive({
|
||||
classes_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 editClasses(formData.value);
|
||||
if (code == 0) {
|
||||
closeDialog();
|
||||
props.done();
|
||||
}
|
||||
});
|
||||
};
|
||||
const handleResetClick = async (formEl) => {
|
||||
if (!formEl) return;
|
||||
formEl.resetFields();
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
|
||||
</style>
|
163
src/pages/index/school/classes/index.vue
Normal file
@ -0,0 +1,163 @@
|
||||
<template><!-- 面包屑 -->
|
||||
<el-breadcrumb>
|
||||
<el-breadcrumb-item>班级管理</el-breadcrumb-item>
|
||||
<el-breadcrumb-item to="/classes/list">班级列表</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
<!-- 搜索 -->
|
||||
<el-form inline :model="params">
|
||||
|
||||
|
||||
<el-form-item label="班级名称">
|
||||
<el-input v-model='params.classes_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="addClassesDialogVisible = 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 => getClassesList(params)">
|
||||
|
||||
<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>
|
||||
|
||||
<!-- 添加班级 -->
|
||||
<AddClassesDialog v-model="addClassesDialogVisible" :done="() => tableRef.reload()"></AddClassesDialog>
|
||||
<!-- 编辑班级 -->
|
||||
<EditClassesDialog v-model="EditClassesDialogVisible" :data="EditClassesDialogRow" :done="() => tableRef.reload()">
|
||||
</EditClassesDialog>
|
||||
<!-- 班级详情 -->
|
||||
<DetailClassesDialog v-model="DetailClassesDialogVisible" :data="DetailClassesDialogRow"></DetailClassesDialog>
|
||||
</template>
|
||||
<script setup>
|
||||
import { ArrowDown } from '@element-plus/icons-vue';
|
||||
import { ref, reactive } from 'vue';
|
||||
import { useLoginStore } from "~/store";
|
||||
import { getClassesList, deleteClasses } from '~/service/classes';
|
||||
import AddClassesDialog from './components/AddClassesDialog.vue';
|
||||
import EditClassesDialog from './components/EditClassesDialog.vue';
|
||||
import DetailClassesDialog from './components/DetailClassesDialog.vue';
|
||||
|
||||
const tableRef = ref();
|
||||
const selectionData = ref([]);
|
||||
const store = useLoginStore();
|
||||
|
||||
const addClassesDialogVisible = ref(false);
|
||||
const EditClassesDialogVisible = ref(false);
|
||||
const EditClassesDialogRow = ref({});
|
||||
const DetailClassesDialogVisible = ref(false);
|
||||
const DetailClassesDialogRow = ref({});
|
||||
|
||||
const headers = {
|
||||
Accept: "application/json",
|
||||
...store.headers,
|
||||
};
|
||||
|
||||
// 查询参数
|
||||
const params = reactive({
|
||||
classes_name: "",
|
||||
|
||||
});
|
||||
const column = [
|
||||
|
||||
{
|
||||
fixed: true,
|
||||
type: 'selection'
|
||||
},
|
||||
{
|
||||
prop: "classes_name",
|
||||
label: '班级名称',
|
||||
width: '150'
|
||||
},
|
||||
{
|
||||
label: '操作',
|
||||
prop: 'chaoz',
|
||||
width: '250'
|
||||
}
|
||||
];
|
||||
|
||||
|
||||
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 deleteClasses({
|
||||
classes_guid: data.map(v => v.classes_guid).join()
|
||||
});
|
||||
if (res) {
|
||||
tableRef.value.reload();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
// 修改
|
||||
function handleUpdate(row) {
|
||||
EditClassesDialogVisible.value = true
|
||||
EditClassesDialogRow.value = row
|
||||
}
|
||||
|
||||
// 详情
|
||||
function handleDetail(row) {
|
||||
DetailClassesDialogVisible.value = true
|
||||
DetailClassesDialogRow.value = row
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
</script>
|
466
src/pages/index/school/student/components/AddStudentDialog.vue
Normal file
@ -0,0 +1,466 @@
|
||||
<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="student_name">
|
||||
<el-input v-model='formData.student_name' type="text" placeholder='请输入学生名称'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="用户" prop="user_name">
|
||||
<el-input v-model='formData.user_name' disabled type="text" placeholder='点击选择用户'>
|
||||
<template #append>
|
||||
<div @click="handleChooseUser">选择</div>
|
||||
</template>
|
||||
</el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="班级" prop="classes_guid">
|
||||
<el-select v-model="formData.classes_guid" clearable placeholder="请选择班级">
|
||||
<el-option v-for="item in classesList" :label="item.classes_name" :key="item.classes_guid"
|
||||
:value="item.classes_guid"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="手机号" prop="studnet_phone">
|
||||
<el-input v-model='formData.studnet_phone' type="text" placeholder='请输入手机号'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="身份证号" prop="student_id_card">
|
||||
<el-input v-model='formData.student_id_card' type="text" placeholder='请输入身份证号'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="邮箱" prop="student_email">
|
||||
<el-input v-model='formData.student_email' type="text" placeholder='请输入邮箱'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="性别" :label-width="labelWidth" prop="student_sex">
|
||||
<el-radio-group v-model="formData.student_sex" placeholder="请选择学生性别">
|
||||
<el-radio v-for="item in sex" :key="item.dictionary_name" :label="item.dictionary_value">{{
|
||||
item.dictionary_name
|
||||
}}
|
||||
</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="价格/元" prop="student_price">
|
||||
<el-input-number v-model='formData.student_price' :precision="2" :step="0.1"
|
||||
:min="0"></el-input-number>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="生日" prop="student_brithday">
|
||||
<el-date-picker v-model="formData.student_brithday" 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="product_type">
|
||||
<el-cascader class="w100" :options="productTypeTreeList"
|
||||
:props="{ checkStrictly: false, value: 'product_type_guid', label: 'product_type_name', emitPath: false }"
|
||||
placeholder="请选择产品类型" clearable v-model="formData.product_type" @change="clickProductTypeTree">
|
||||
<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-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="产品" prop="product_guid">
|
||||
<el-select v-model="formData.product_guid" clearable placeholder="请先选择产品类型" @change="clickProduct">
|
||||
<el-option v-for="item in productList" :label="item.product_name" :key="item.product_guid"
|
||||
:value="item.product_guid"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="产品零件" prop="product_parts_guid">
|
||||
<el-select v-model="formData.product_parts_guid" clearable placeholder="请先选择产品">
|
||||
<el-option v-for="item in productPartsList" :label="item.product_parts_name"
|
||||
:key="item.product_parts_guid" :value="item.product_parts_guid"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="学生服务" prop="student_service">
|
||||
<!-- <el-input v-model='formData.student_service' type="text" placeholder='请输入学生服务'></el-input> -->
|
||||
<div v-for="(item, index) in formData.student_service" :key="index">
|
||||
<div style="margin-left:10px">
|
||||
{{ item.service_name + ":" + item.service_price + "元" }}
|
||||
<el-button size="small" :circle="true" icon="el-icon-minus"
|
||||
@click="handleCancel(index)"></el-button>
|
||||
</div>
|
||||
</div>
|
||||
<el-button style="margin-left:10px" :circle="true" icon="el-icon-plus"
|
||||
@click="handleStudentService"></el-button>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span='12'>
|
||||
<el-form-item :label-width='labelWidth' label='头像图片' prop='student_img'>
|
||||
<UploadImage ref='uploadRef' v-model='formData.student_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='student_attachment'>
|
||||
<UploadFile v-model='formData.student_attachment' :data=uoloadData />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span='12'>
|
||||
<el-form-item :label-width='labelWidth' label='轮播图片图片' prop='student_banner_img'>
|
||||
<UploadImage ref='uploadRef' v-model='formData.student_banner_img' :data=uoloadData :limit='5'
|
||||
:fileSize='5' :drag='true' :isShowTip='false' />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="24">
|
||||
<el-form-item :label-width="labelWidth" label="简介" prop="student_intro">
|
||||
<RichText v-model='formData.student_intro'></RichText>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span='24'>
|
||||
<el-form-item :label-width='labelWidth' label='家庭住址' prop='student_location'>
|
||||
<Map v-model='locationList' style='margin-top: 20px;'></Map>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12">
|
||||
<el-form-item label="会员类型" prop="student_membe_type">
|
||||
<el-select v-model="formData.student_membe_type" clearable placeholder="请选择">
|
||||
<el-option v-for="item in member_type" :label="item.dictionary_name"
|
||||
:key="item.dictionary_value" :value="item.dictionary_value"></el-option>
|
||||
</el-select>
|
||||
</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>
|
||||
|
||||
<!-- 学生服务 -->
|
||||
<StudentServiceDialog v-model="StudentServiceDialogVisible"></StudentServiceDialog>
|
||||
<!-- 选择用户 -->
|
||||
<ChooseUserDialog v-model="ChooseUserDialogVisible"></ChooseUserDialog>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref, watch } from "vue";
|
||||
import { addStudent, getDictionary, getClickProduct, getClickProductParts } from "~/service/student";
|
||||
import { getClassesList } from '~/service/classes';
|
||||
// import { getProductTypeTree } from "~/service/product_type";
|
||||
import { useLoginStore } from "~/store";
|
||||
import { validatePhTelNumber, validateIDCard, validateEmail } from '~/utils/validateRules';
|
||||
import StudentServiceDialog from './StudentServiceDialog.vue';
|
||||
import ChooseUserDialog from './ChooseUserDialog.vue';
|
||||
|
||||
// --业务参数
|
||||
const locationList = ref({})
|
||||
const classesList = ref([])
|
||||
const productTypeTreeList = ref([]);
|
||||
const productList = ref([]);
|
||||
const productPartsList = ref([]);
|
||||
const StudentServiceDialogVisible = ref({});
|
||||
const ChooseUserDialogVisible = ref({});
|
||||
|
||||
// --业务方法
|
||||
|
||||
/**
|
||||
* 打开学生服务弹窗
|
||||
*/
|
||||
const handleStudentService = () => {
|
||||
StudentServiceDialogVisible.value = formData
|
||||
}
|
||||
|
||||
/**
|
||||
* 打开选择用户弹窗
|
||||
*/
|
||||
const handleChooseUser = () => {
|
||||
ChooseUserDialogVisible.value = formData
|
||||
}
|
||||
|
||||
/**
|
||||
* 学生服务删除
|
||||
*/
|
||||
const handleCancel = function (index) {
|
||||
const arr = formData.student_service;
|
||||
arr.splice(index, 1);
|
||||
ElMessage({
|
||||
message: "删除成功",
|
||||
type: "success",
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* 点击产品类型
|
||||
*/
|
||||
const clickProductTypeTree = () => {
|
||||
getClickProductFun()
|
||||
formData.product_guid = null
|
||||
formData.product_parts_guid = null
|
||||
productList.length = 0
|
||||
productPartsList.length = 0
|
||||
}
|
||||
|
||||
/**
|
||||
* 点击产品
|
||||
*/
|
||||
const clickProduct = () => {
|
||||
getClickProductPartsFun()
|
||||
formData.product_parts_guid = null
|
||||
productPartsList.length = 0
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* 获取班级列表
|
||||
*/
|
||||
async function getClassesListFun() {
|
||||
getClassesList().then((res) => {
|
||||
if (res.code == 0) {
|
||||
classesList.value = res.data
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取产品类型树形列表
|
||||
*/
|
||||
async function getProductTypeTreeFun() {
|
||||
getProductTypeTree().then((res) => {
|
||||
if (res.code == 0) {
|
||||
productTypeTreeList.value = res.data
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取产品列表
|
||||
*/
|
||||
async function getClickProductFun() {
|
||||
getClickProduct({ product_type_guid: formData.product_type }).then((res) => {
|
||||
if (res.code == 0) {
|
||||
productList.value = res.data
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取产品零件列表
|
||||
*/
|
||||
async function getClickProductPartsFun() {
|
||||
getClickProductParts({ product_guid: formData.product_guid }).then((res) => {
|
||||
if (res.code == 0) {
|
||||
productPartsList.value = res.data
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
// 字典获取
|
||||
const sex = ref([]);
|
||||
async function get_sex() {
|
||||
await getDictionary({ dictionary_value: 'sex' }).then((res) => {
|
||||
sex.value = res
|
||||
})
|
||||
}
|
||||
// 字典获取
|
||||
const member_type = ref([]);
|
||||
async function get_member_type() {
|
||||
await getDictionary({ dictionary_value: 'member_type' }).then((res) => {
|
||||
member_type.value = res
|
||||
})
|
||||
}
|
||||
// 字典获取
|
||||
const audit_status = ref([]);
|
||||
async function get_audit_status() {
|
||||
await getDictionary({ dictionary_value: 'audit_status' }).then((res) => {
|
||||
audit_status.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({
|
||||
student_name: ""
|
||||
});
|
||||
|
||||
const uoloadData = ref({
|
||||
dirName: "Student"
|
||||
})
|
||||
|
||||
watch(props, (v) => {
|
||||
dialogVisible.value = v.modelValue;
|
||||
});
|
||||
|
||||
const rules = reactive({
|
||||
student_name: [
|
||||
{
|
||||
required: true,
|
||||
message: '学生名称不能为空'
|
||||
}
|
||||
],
|
||||
user_name: [
|
||||
{
|
||||
required: true,
|
||||
message: '用户不能为空'
|
||||
}
|
||||
],
|
||||
classes_guid: [
|
||||
{
|
||||
required: true,
|
||||
message: '班级不能为空'
|
||||
}
|
||||
],
|
||||
studnet_phone: [
|
||||
{
|
||||
validator: validatePhTelNumber,
|
||||
required: true,
|
||||
}
|
||||
],
|
||||
student_id_card: [
|
||||
{
|
||||
validator: validateIDCard,
|
||||
required: true,
|
||||
}
|
||||
],
|
||||
student_email: [
|
||||
{
|
||||
validator: validateEmail,
|
||||
}
|
||||
],
|
||||
student_sex: [
|
||||
{
|
||||
required: true,
|
||||
message: '性别不能为空'
|
||||
}
|
||||
],
|
||||
student_price: [
|
||||
{
|
||||
required: true,
|
||||
message: '学生价格不能为空'
|
||||
}
|
||||
],
|
||||
product_type: [
|
||||
{
|
||||
required: true,
|
||||
message: '产品类型不能为空'
|
||||
}
|
||||
],
|
||||
product_guid: [
|
||||
{
|
||||
required: true,
|
||||
message: '产品不能为空'
|
||||
}
|
||||
],
|
||||
product_parts_guid: [
|
||||
{
|
||||
required: true,
|
||||
message: '产品零件不能为空'
|
||||
}
|
||||
],
|
||||
student_img: [
|
||||
{
|
||||
required: true,
|
||||
message: '头像不能为空'
|
||||
}
|
||||
],
|
||||
student_intro: [
|
||||
{
|
||||
required: true,
|
||||
message: '简介不能为空'
|
||||
}
|
||||
],
|
||||
// student_location: [
|
||||
// {
|
||||
// required: true,
|
||||
// message: '家庭住址不能为空'
|
||||
// }
|
||||
// ],
|
||||
});
|
||||
|
||||
|
||||
// --基础方法
|
||||
|
||||
// 打开弹窗时执行
|
||||
const openDialog = () => {
|
||||
getClassesListFun()
|
||||
getProductTypeTreeFun()
|
||||
get_sex()
|
||||
get_member_type()
|
||||
get_audit_status()
|
||||
};
|
||||
|
||||
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;
|
||||
}
|
||||
|
||||
// 地址处理
|
||||
if (!locationList.value.address) {
|
||||
ElMessage.error("请选择学生家庭住址");
|
||||
return
|
||||
}
|
||||
let locationData = locationList.value
|
||||
formData.student_location = locationData.address
|
||||
formData.longitude = locationData.longitude
|
||||
formData.latitude = locationData.latitude
|
||||
|
||||
const { code } = await addStudent(formData);
|
||||
if (code == 0) {
|
||||
closeDialog();
|
||||
props.done();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const handleResetClick = async (formEl) => {
|
||||
if (!formEl) return;
|
||||
formEl.resetFields();
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped></style>
|
111
src/pages/index/school/student/components/ChooseUserDialog.vue
Normal file
@ -0,0 +1,111 @@
|
||||
<template>
|
||||
<el-dialog v-model="dialogVisible" title="选择用户" width="900px" @closed="closeDialog" @open="openDialog">
|
||||
|
||||
<el-form inline :model="params">
|
||||
<el-form-item label="用户名称">
|
||||
<el-input v-model='params.user' 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>
|
||||
|
||||
<!-- 数据表格 -->
|
||||
<DataTable
|
||||
ref="tableRef"
|
||||
style="width: 100%"
|
||||
:column="column"
|
||||
:params="params"
|
||||
:request="params => notBindUserList(params)"
|
||||
highlight-current-row
|
||||
@current-change="data => (selectionData = data)"
|
||||
>
|
||||
</DataTable>
|
||||
|
||||
<template #footer>
|
||||
<span class="dialog-footer">
|
||||
<el-button type="primary" @click="handleEditClick()">添加</el-button>
|
||||
<el-button @click="handleResetClick()">重置</el-button>
|
||||
</span>
|
||||
</template>
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref, watch, nextTick } from 'vue';
|
||||
import { isEmptyObject, deepClone } from '~/utils/index';
|
||||
import { ElMessage } from 'element-plus'
|
||||
import { notBindUserList } from '~/service/student';
|
||||
|
||||
// 业务参数
|
||||
const total = ref(0)
|
||||
const loading = ref(false)
|
||||
|
||||
// 基础参数
|
||||
const tableRef = ref(null);
|
||||
const selectionData = ref([]);
|
||||
// 查询参数
|
||||
const params = reactive({
|
||||
user: "",
|
||||
});
|
||||
|
||||
const emits = defineEmits(['update:modelValue']);
|
||||
const dialogVisible = ref(false);
|
||||
const props = defineProps({
|
||||
modelValue: Object,
|
||||
done: Function
|
||||
});
|
||||
const formData = ref({
|
||||
...props.modelValue
|
||||
});
|
||||
|
||||
const column = [
|
||||
{
|
||||
prop: "user_name",
|
||||
label: '用户',
|
||||
},
|
||||
];
|
||||
|
||||
let userList = ref([]);
|
||||
// 打开窗口时运行
|
||||
const openDialog = async () => {
|
||||
|
||||
}
|
||||
|
||||
watch(props, (v) => {
|
||||
formData.value = v.modelValue;
|
||||
dialogVisible.value = !isEmptyObject(v.modelValue);
|
||||
});
|
||||
|
||||
// -业务方法
|
||||
|
||||
|
||||
|
||||
// -基础方法
|
||||
const closeDialog = () => {
|
||||
selectionData.value.length = 0
|
||||
dialogVisible.value = false;
|
||||
emits('update:modelValue', {});
|
||||
};
|
||||
|
||||
// 提交
|
||||
const handleEditClick = async () => {
|
||||
if (selectionData.value.length !== 0) {
|
||||
let user_name = selectionData.value.user_name;
|
||||
formData.value.user_name = user_name
|
||||
if (formData.value.user_name != null) {
|
||||
closeDialog();
|
||||
}
|
||||
} else {
|
||||
ElMessage.error("请选择用户")
|
||||
return;
|
||||
}
|
||||
};
|
||||
|
||||
const handleResetClick = async formEl => {
|
||||
|
||||
};
|
||||
</script>
|
||||
|
@ -0,0 +1,295 @@
|
||||
<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="student_name">
|
||||
<el-input v-model='formData.student_name' type="text" placeholder='请输入学生名称'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="用户" prop="user_name">
|
||||
<el-input v-model='formData.user_name' type="text" placeholder='请输入用户'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="班级" prop="classes_guid">
|
||||
<el-select v-model="formData.classes_guid" clearable placeholder="请选择班级">
|
||||
<el-option v-for="item in classesList" :label="item.classes_name" :key="item.classes_guid"
|
||||
:value="item.classes_guid"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="手机号" prop="studnet_phone">
|
||||
<el-input v-model='formData.studnet_phone' type="text" placeholder='请输入手机号'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="身份证号" prop="student_id_card">
|
||||
<el-input v-model='formData.student_id_card' type="text" placeholder='请输入身份证号'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="邮箱" prop="student_email">
|
||||
<el-input v-model='formData.student_email' type="text" placeholder='请输入邮箱'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="性别" :label-width="labelWidth" prop="student_sex">
|
||||
<el-radio-group v-model="formData.student_sex" placeholder="请选择学生性别">
|
||||
<el-radio v-for="item in sex" :key="item.dictionary_name" :label="item.dictionary_value">{{
|
||||
item.dictionary_name
|
||||
}}
|
||||
</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="价格/元" prop="student_price">
|
||||
<el-input-number v-model='formData.student_price' :precision="2" :step="0.1"
|
||||
:min="0"></el-input-number>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="生日" prop="student_brithday">
|
||||
<el-date-picker v-model="formData.student_brithday" 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="product_type">
|
||||
<el-cascader class="w100" :options="productTypeTreeList"
|
||||
:props="{ checkStrictly: false, value: 'product_type_guid', label: 'product_type_name', emitPath: false }"
|
||||
placeholder="请选择产品类型" clearable v-model="formData.product_type" @change="clickProductTypeTree">
|
||||
<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-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="产品" prop="product_guid">
|
||||
<el-select v-model="formData.product_guid" clearable placeholder="请先选择产品类型" @change="clickProduct">
|
||||
<el-option v-for="item in productList" :label="item.product_name" :key="item.product_guid"
|
||||
:value="item.product_guid"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="产品零件" prop="product_parts_guid">
|
||||
<el-select v-model="formData.product_parts_guid" clearable placeholder="请先选择产品">
|
||||
<el-option v-for="item in productPartsList" :label="item.product_parts_name"
|
||||
:key="item.product_parts_guid" :value="item.product_parts_guid"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="学生服务" prop="student_service">
|
||||
<div v-for="(item, index) in formData.student_service" :key="index">
|
||||
<div style="margin-left:10px">
|
||||
{{ item.service_name + ":" + item.service_price + "元" }}
|
||||
</div>
|
||||
</div>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span='12'>
|
||||
<el-form-item :label-width='labelWidth' label='头像图片' prop='student_img'>
|
||||
<UploadImage ref='uploadRef' v-model='formData.student_img' :limit='1'
|
||||
:fileSize='5' :drag='true' :isShowTip='false' :isDisabled="true" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span='12'>
|
||||
<el-form-item :label-width='labelWidth' label='附件文件' prop='student_attachment'>
|
||||
<UploadFile v-model='formData.student_attachment' :isDetail="true" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span='12'>
|
||||
<el-form-item :label-width='labelWidth' label='轮播图片图片' prop='student_banner_img'>
|
||||
<UploadImage ref='uploadRef' v-model='formData.student_banner_img' :limit='5'
|
||||
:fileSize='5' :drag='true' :isShowTip='false' :isDisabled="true" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="24">
|
||||
<el-form-item :label-width="labelWidth" label="简介" prop="student_intro">
|
||||
<RichText v-model='formData.student_intro'></RichText>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span='24'>
|
||||
<el-form-item :label-width='labelWidth' label='家庭住址' prop='student_location'>
|
||||
<Map v-model='locationList' style='margin-top: 20px;' :isClick="false"></Map>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12">
|
||||
<el-form-item label="会员类型" :label-width="labelWidth" prop="student_membe_type">
|
||||
<dict-tag :options="member_type" :value="formData.student_membe_type" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item :label-width="labelWidth" label="会员时间" prop="student_member_begin_time">
|
||||
<el-date-picker disabled v-model="formData.student_member_time" type="daterange"
|
||||
value-format="YYYY-MM-DD" range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12">
|
||||
<el-form-item label="审核状态" :label-width="labelWidth" prop="student_audit_status">
|
||||
<dict-tag :options="audit_status" :value="formData.student_audit_status" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="审核人" prop="student_audit_user_guid">
|
||||
{{ formData.student_audit_user_name }}
|
||||
</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 ,getClickProduct, getClickProductParts } from "~/service/student";
|
||||
import { getClassesList } from '~/service/classes';
|
||||
// import { getProductTypeTree } from "~/service/product_type";
|
||||
import StudentServiceDialog from './StudentServiceDialog.vue';
|
||||
|
||||
// --业务参数
|
||||
const locationList = ref({})
|
||||
const classesList = ref([])
|
||||
const productTypeTreeList = ref([]);
|
||||
const productList = ref([]);
|
||||
const productPartsList = ref([]);
|
||||
const StudentServiceDialogVisible = ref({});
|
||||
|
||||
// --业务方法
|
||||
|
||||
/**
|
||||
* 打开学生服务弹窗
|
||||
*/
|
||||
const handleStudentService = () => {
|
||||
StudentServiceDialogVisible.value = formData
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取班级列表
|
||||
*/
|
||||
async function getClassesListFun() {
|
||||
getClassesList().then((res) => {
|
||||
if (res.code == 0) {
|
||||
classesList.value = res.data
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取产品类型树形列表
|
||||
*/
|
||||
async function getProductTypeTreeFun() {
|
||||
getProductTypeTree().then((res) => {
|
||||
if (res.code == 0) {
|
||||
productTypeTreeList.value = res.data
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取产品列表
|
||||
*/
|
||||
async function getClickProductFun() {
|
||||
getClickProduct({ product_type_guid: formData.value.product_type }).then((res) => {
|
||||
if (res.code == 0) {
|
||||
productList.value = res.data
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取产品零件列表
|
||||
*/
|
||||
async function getClickProductPartsFun() {
|
||||
getClickProductParts({ product_guid: formData.value.product_guid }).then((res) => {
|
||||
if (res.code == 0) {
|
||||
productPartsList.value = res.data
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
// 字典获取
|
||||
const sex = ref([]);
|
||||
async function get_sex() {
|
||||
await getDictionary({ dictionary_value: 'sex' }).then((res) => {
|
||||
sex.value = res
|
||||
})
|
||||
}
|
||||
// 字典获取
|
||||
const member_type = ref([]);
|
||||
async function get_member_type() {
|
||||
await getDictionary({ dictionary_value: 'member_type' }).then((res) => {
|
||||
member_type.value = res
|
||||
})
|
||||
}
|
||||
// 字典获取
|
||||
const audit_status = ref([]);
|
||||
async function get_audit_status() {
|
||||
await getDictionary({ dictionary_value: 'audit_status' }).then((res) => {
|
||||
audit_status.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;
|
||||
if (formData.value.longitude) {
|
||||
locationList.value.address = formData.value.student_location;
|
||||
locationList.value.longitude = formData.value.longitude;
|
||||
locationList.value.latitude = formData.value.latitude;
|
||||
}
|
||||
});
|
||||
|
||||
// 打开弹窗时执行
|
||||
const openDialog = () => {
|
||||
|
||||
getClickProductFun()
|
||||
getClickProductPartsFun()
|
||||
getClassesListFun()
|
||||
getProductTypeTreeFun()
|
||||
get_sex()
|
||||
get_member_type()
|
||||
get_audit_status()
|
||||
|
||||
};
|
||||
|
||||
const closeDialog = () => {
|
||||
emits("update:modelValue", false);
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped></style>
|
510
src/pages/index/school/student/components/EditStudentDialog.vue
Normal file
@ -0,0 +1,510 @@
|
||||
<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="student_name">
|
||||
<el-input v-model='formData.student_name' type="text" placeholder='请输入学生名称'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="用户" prop="user_guid">
|
||||
<el-input v-model='formData.user_name' disabled type="text" placeholder='请输入用户'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="班级" prop="classes_guid">
|
||||
<el-select v-model="formData.classes_guid" clearable placeholder="请选择班级">
|
||||
<el-option v-for="item in classesList" :label="item.classes_name" :key="item.classes_guid"
|
||||
:value="item.classes_guid"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="手机号" prop="studnet_phone">
|
||||
<el-input v-model='formData.studnet_phone' type="text" placeholder='请输入手机号'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="身份证号" prop="student_id_card">
|
||||
<el-input v-model='formData.student_id_card' type="text" placeholder='请输入身份证号'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="邮箱" prop="student_email">
|
||||
<el-input v-model='formData.student_email' type="text" placeholder='请输入邮箱'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item label="性别" :label-width="labelWidth" prop="student_sex">
|
||||
<el-radio-group v-model="formData.student_sex" placeholder="请选择学生性别">
|
||||
<el-radio v-for="item in sex" :key="item.dictionary_name" :label="item.dictionary_value">{{
|
||||
item.dictionary_name
|
||||
}}
|
||||
</el-radio>
|
||||
</el-radio-group>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="价格/元" prop="student_price">
|
||||
<el-input-number v-model='formData.student_price' :precision="2" :step="0.1" :min="0"></el-input-number>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="生日" prop="student_brithday">
|
||||
<el-date-picker v-model="formData.student_brithday" 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="product_type">
|
||||
<el-cascader class="w100" :options="productTypeTreeList"
|
||||
:props="{ checkStrictly: false, value: 'product_type_guid', label: 'product_type_name', emitPath: false }"
|
||||
placeholder="请选择产品类型" clearable v-model="formData.product_type" @change="clickProductTypeTree">
|
||||
<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-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="产品" prop="product_guid">
|
||||
<el-select v-model="formData.product_guid" clearable placeholder="请先选择产品类型" @change="clickProduct">
|
||||
<el-option v-for="item in productList" :label="item.product_name" :key="item.product_guid"
|
||||
:value="item.product_guid"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="产品零件" prop="product_parts_guid">
|
||||
<el-select v-model="formData.product_parts_guid" clearable placeholder="请先选择产品">
|
||||
<el-option v-for="item in productPartsList" :label="item.product_parts_name" :key="item.product_parts_guid"
|
||||
:value="item.product_parts_guid"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="学生服务" prop="student_service">
|
||||
<!-- <el-input v-model='formData.student_service' type="text" placeholder='请输入学生服务'></el-input> -->
|
||||
<!-- {{ formData.student_service }} -->
|
||||
<div v-for="(item, index) in formData.student_service" :key="index">
|
||||
<div style="margin-left:10px">
|
||||
{{ item.service_name + ":" + item.service_price + "元" }}
|
||||
<el-button size="small" :circle="true" icon="el-icon-minus" @click="handleCancel(index)"></el-button>
|
||||
</div>
|
||||
</div>
|
||||
<el-button style="margin-left:10px" :circle="true" icon="el-icon-plus"
|
||||
@click="handleStudentService"></el-button>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span='12'>
|
||||
<el-form-item :label-width='labelWidth' label='头像图片' prop='student_img'>
|
||||
<UploadImage ref='uploadRef' v-model='formData.student_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='student_attachment'>
|
||||
<UploadFile v-model='formData.student_attachment' :data=uoloadData />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span='12'>
|
||||
<el-form-item :label-width='labelWidth' label='轮播图片图片' prop='student_banner_img'>
|
||||
<UploadImage ref='uploadRef' v-model='formData.student_banner_img' :data=uoloadData :limit='5' :fileSize='5'
|
||||
:drag='true' :isShowTip='false' />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="24">
|
||||
<el-form-item :label-width="labelWidth" label="简介" prop="student_intro">
|
||||
<RichText v-model='formData.student_intro'></RichText>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span='24'>
|
||||
<el-form-item :label-width='labelWidth' label='家庭住址' prop='student_location'>
|
||||
<Map v-model='locationList' style='margin-top: 20px;'></Map>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12">
|
||||
<el-form-item label="会员类型" :label-width="labelWidth" prop="student_membe_type">
|
||||
<dict-tag :options="member_type" :value="formData.student_membe_type" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item :label-width="labelWidth" label="会员时间" prop="student_member_time">
|
||||
<el-date-picker v-model="formData.student_member_time" type="daterange" value-format="YYYY-MM-DD"
|
||||
range-separator="-" start-placeholder="开始日期" end-placeholder="结束日期" @change="hanleChangeTime" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<el-col :span="12">
|
||||
<el-form-item label="审核状态" :label-width="labelWidth" prop="student_audit_status">
|
||||
<dict-tag :options="audit_status" :value="formData.student_audit_status" />
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="12">
|
||||
<el-form-item :label-width="labelWidth" label="审核人" prop="student_audit_user_guid">
|
||||
{{ formData.student_audit_user_name }}
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
|
||||
<!-- <div class="box_pos">
|
||||
<div class="box">
|
||||
<input type="text" @change="request()">
|
||||
<div :v-model="isShow" :data="dataList"></div>
|
||||
</div>
|
||||
</div>
|
||||
const searchData = []
|
||||
request(){
|
||||
//..
|
||||
searchData.value = res
|
||||
} -->
|
||||
</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>
|
||||
|
||||
<!-- 学生服务 -->
|
||||
<StudentServiceDialog v-model="StudentServiceDialogVisible"></StudentServiceDialog>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref, watch } from "vue";
|
||||
import { editStudent, getDictionary, getClickProduct, getClickProductParts } from "~/service/student";
|
||||
import { getClassesList } from '~/service/classes';
|
||||
// import { getProductTypeTree } from "~/service/product_type";
|
||||
import { useLoginStore } from "~/store";
|
||||
import { validatePhTelNumber, validateIDCard, validateEmail } from '~/utils/validateRules';
|
||||
import StudentServiceDialog from './StudentServiceDialog.vue';
|
||||
|
||||
// --业务参数
|
||||
const locationList = ref({})
|
||||
const classesList = ref([])
|
||||
const productTypeTreeList = ref([]);
|
||||
const productList = ref([]);
|
||||
const productPartsList = ref([]);
|
||||
const StudentServiceDialogVisible = ref({});
|
||||
|
||||
// --业务方法
|
||||
|
||||
// 时间选择器变换
|
||||
function hanleChangeTime(val) {
|
||||
formData.value.service_begin_time = val[0]
|
||||
formData.value.service_end_time = val[1]
|
||||
let time = TimestampToDate2()
|
||||
console.log(time);
|
||||
if (val[0] < time) {
|
||||
ElMessage.error("不能选择小于当前时间的日期!")
|
||||
formData.value.student_member_time.length = 0
|
||||
}
|
||||
}
|
||||
|
||||
function TimestampToDate2() {
|
||||
let now = new Date(),
|
||||
y = now.getFullYear(),
|
||||
m = now.getMonth() + 1,
|
||||
d = now.getDate();
|
||||
return y + "-" + (m < 10 ? "0" + m : m) + "-" + (d < 10 ? "0" + d : d);
|
||||
}
|
||||
|
||||
|
||||
const request = () =>{
|
||||
|
||||
getClickProduct({ product_type_guid: formData.value.product_type }).then((res) => {
|
||||
if (res.code == 0) {
|
||||
|
||||
if(res.data.length == 0) return
|
||||
|
||||
|
||||
dataList.value = res.data
|
||||
}
|
||||
})
|
||||
|
||||
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* 打开学生服务弹窗
|
||||
*/
|
||||
const handleStudentService = () => {
|
||||
StudentServiceDialogVisible.value = formData.value
|
||||
}
|
||||
|
||||
/**
|
||||
* 学生服务删除
|
||||
*/
|
||||
const handleCancel = function (index) {
|
||||
let arr = Object.values(formData.value.student_service);
|
||||
arr.splice(index, 1);
|
||||
formData.value.student_service = arr
|
||||
ElMessage({
|
||||
message: "删除成功",
|
||||
type: "success",
|
||||
});
|
||||
};
|
||||
|
||||
/**
|
||||
* 点击产品类型
|
||||
*/
|
||||
const clickProductTypeTree = () => {
|
||||
getClickProductFun()
|
||||
|
||||
formData.value.product_guid = null
|
||||
formData.value.product_parts_guid = null
|
||||
productList.length = 0
|
||||
productPartsList.length = 0
|
||||
}
|
||||
|
||||
/**
|
||||
* 点击产品
|
||||
*/
|
||||
const clickProduct = () => {
|
||||
getClickProductPartsFun()
|
||||
formData.value.product_parts_guid = null
|
||||
productPartsList.length = 0
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
* 获取班级列表
|
||||
*/
|
||||
async function getClassesListFun() {
|
||||
getClassesList().then((res) => {
|
||||
if (res.code == 0) {
|
||||
classesList.value = res.data
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取产品类型树形列表
|
||||
*/
|
||||
async function getProductTypeTreeFun() {
|
||||
getProductTypeTree().then((res) => {
|
||||
if (res.code == 0) {
|
||||
productTypeTreeList.value = res.data
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取产品列表
|
||||
*/
|
||||
async function getClickProductFun() {
|
||||
getClickProduct({ product_type_guid: formData.value.product_type }).then((res) => {
|
||||
if (res.code == 0) {
|
||||
productList.value = res.data
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
/**
|
||||
* 获取产品零件列表
|
||||
*/
|
||||
async function getClickProductPartsFun() {
|
||||
getClickProductParts({ product_guid: formData.value.product_guid }).then((res) => {
|
||||
if (res.code == 0) {
|
||||
productPartsList.value = res.data
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 字典获取
|
||||
const sex = ref([]);
|
||||
async function get_sex() {
|
||||
await getDictionary({ dictionary_value: 'sex' }).then((res) => {
|
||||
sex.value = res
|
||||
})
|
||||
}
|
||||
// 字典获取
|
||||
const member_type = ref([]);
|
||||
async function get_member_type() {
|
||||
await getDictionary({ dictionary_value: 'member_type' }).then((res) => {
|
||||
member_type.value = res
|
||||
})
|
||||
}
|
||||
// 字典获取
|
||||
const audit_status = ref([]);
|
||||
async function get_audit_status() {
|
||||
await getDictionary({ dictionary_value: 'audit_status' }).then((res) => {
|
||||
audit_status.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: "Student"
|
||||
})
|
||||
|
||||
|
||||
// --基础方法
|
||||
watch(props, (v) => {
|
||||
formData.value = v.data;
|
||||
if (formData.value.longitude) {
|
||||
locationList.value.address = formData.value.student_location;
|
||||
locationList.value.longitude = formData.value.longitude;
|
||||
locationList.value.latitude = formData.value.latitude;
|
||||
}
|
||||
});
|
||||
|
||||
// 打开弹窗时执行
|
||||
const openDialog = () => {
|
||||
getClickProductFun()
|
||||
getClickProductPartsFun()
|
||||
getClassesListFun()
|
||||
getProductTypeTreeFun()
|
||||
get_sex()
|
||||
get_member_type()
|
||||
get_audit_status()
|
||||
|
||||
|
||||
};
|
||||
|
||||
const closeDialog = () => {
|
||||
props.done();
|
||||
emits("update:modelValue", false);
|
||||
};
|
||||
|
||||
const rules = reactive({
|
||||
student_name: [
|
||||
{
|
||||
required: true,
|
||||
message: '学生名称不能为空'
|
||||
}
|
||||
],
|
||||
user_guid: [
|
||||
{
|
||||
required: true,
|
||||
message: '用户不能为空'
|
||||
}
|
||||
],
|
||||
classes_guid: [
|
||||
{
|
||||
required: true,
|
||||
message: '班级不能为空'
|
||||
}
|
||||
],
|
||||
studnet_phone: [
|
||||
{
|
||||
validator: validatePhTelNumber,
|
||||
required: true,
|
||||
}
|
||||
],
|
||||
student_id_card: [
|
||||
{
|
||||
validator: validateIDCard,
|
||||
required: true,
|
||||
}
|
||||
],
|
||||
student_email: [
|
||||
{
|
||||
validator: validateEmail,
|
||||
}
|
||||
],
|
||||
student_sex: [
|
||||
{
|
||||
required: true,
|
||||
message: '性别不能为空'
|
||||
}
|
||||
],
|
||||
student_price: [
|
||||
{
|
||||
required: true,
|
||||
message: '学生价格不能为空'
|
||||
}
|
||||
],
|
||||
product_type: [
|
||||
{
|
||||
required: true,
|
||||
message: '产品类型不能为空'
|
||||
}
|
||||
],
|
||||
product_guid: [
|
||||
{
|
||||
required: true,
|
||||
message: '产品不能为空'
|
||||
}
|
||||
],
|
||||
product_parts_guid: [
|
||||
{
|
||||
required: true,
|
||||
message: '产品零件不能为空'
|
||||
}
|
||||
],
|
||||
student_img: [
|
||||
{
|
||||
required: true,
|
||||
message: '头像不能为空'
|
||||
}
|
||||
],
|
||||
student_intro: [
|
||||
{
|
||||
required: true,
|
||||
message: '简介不能为空'
|
||||
}
|
||||
],
|
||||
});
|
||||
|
||||
const handleEditClick = async (formEl) => {
|
||||
if (formData.value.student_member_time.length == 0) return ElMessage.error("请选择会员时间!")
|
||||
|
||||
if (!formEl) return;
|
||||
formEl.validate(async (valid) => {
|
||||
if (!valid) {
|
||||
return;
|
||||
}
|
||||
|
||||
// 地址处理
|
||||
if (!locationList.value.address) {
|
||||
ElMessage.error("请选择学生家庭住址");
|
||||
return
|
||||
}
|
||||
let locationData = locationList.value
|
||||
formData.value.student_location = locationData.address
|
||||
formData.value.longitude = locationData.longitude
|
||||
formData.value.latitude = locationData.latitude
|
||||
|
||||
const { code } = await editStudent(formData.value);
|
||||
if (code == 0) {
|
||||
closeDialog();
|
||||
props.done();
|
||||
}
|
||||
});
|
||||
};
|
||||
const handleResetClick = async (formEl) => {
|
||||
if (!formEl) return;
|
||||
formEl.resetFields();
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped></style>
|
@ -0,0 +1,48 @@
|
||||
<template>
|
||||
<el-dialog v-model="props.modelValue" title="导入信息" width="400px" @closed="closeDialog" @open="openDialog">
|
||||
{{ formData }}
|
||||
</el-dialog>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { reactive, ref, watch } from "vue";
|
||||
|
||||
// --业务参数
|
||||
|
||||
// --业务方法
|
||||
|
||||
|
||||
|
||||
// --基础参数
|
||||
const formData = ref({
|
||||
...props.data,
|
||||
});
|
||||
const props = defineProps({
|
||||
modelValue: Boolean,
|
||||
data: Object,
|
||||
done: Function,
|
||||
});
|
||||
const emits = defineEmits(["update:modelValue"]);
|
||||
const dialogVisible = ref(props.modelValue);
|
||||
|
||||
watch(props, (v) => {
|
||||
formData.value = v.data;
|
||||
console.log(formData.value);
|
||||
});
|
||||
|
||||
|
||||
// --基础方法
|
||||
|
||||
// 打开弹窗时执行
|
||||
const openDialog = () => {
|
||||
|
||||
};
|
||||
|
||||
const closeDialog = () => {
|
||||
dialogVisible.value = false;
|
||||
emits("update:modelValue", false);
|
||||
};
|
||||
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped></style>
|
@ -0,0 +1,121 @@
|
||||
<template>
|
||||
<el-dialog
|
||||
v-model="dialogVisible"
|
||||
title="学生服务"
|
||||
width="400px"
|
||||
@closed="closeDialog"
|
||||
>
|
||||
<el-form
|
||||
ref="formRef"
|
||||
:model="formData"
|
||||
>
|
||||
<el-form-item :label-width="labelWidth" label="服务类型" prop="">
|
||||
<el-input
|
||||
v-model="serviceList.service_name"
|
||||
type="text"
|
||||
placeholder="请输入服务类型"
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item :label-width="labelWidth" label="价格" prop="">
|
||||
<el-input
|
||||
v-model="serviceList.service_price"
|
||||
placeholder="请输入价格"
|
||||
type="number"
|
||||
><template #append>元</template></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 { isEmptyObject,deepClone } from '~/utils/index';
|
||||
import { ElMessage } from 'element-plus'
|
||||
|
||||
// 业务参数
|
||||
const formRef = ref();
|
||||
const labelWidth = 100;
|
||||
const serviceList = ref({
|
||||
service_name: "",
|
||||
service_price: ""
|
||||
});
|
||||
|
||||
// 基础参数
|
||||
const emits = defineEmits(['update:modelValue']);
|
||||
const dialogVisible = ref(false);
|
||||
const props = defineProps({
|
||||
modelValue: Object,
|
||||
done: Function
|
||||
});
|
||||
const formData = ref({
|
||||
...props.modelValue
|
||||
});
|
||||
watch(props, (v) => {
|
||||
formData.value = v.modelValue;
|
||||
dialogVisible.value = !isEmptyObject(v.modelValue);
|
||||
});
|
||||
|
||||
|
||||
// -业务方法
|
||||
|
||||
|
||||
|
||||
// -基础方法
|
||||
const closeDialog = () => {
|
||||
handleResetClick(formRef.value);
|
||||
dialogVisible.value = false;
|
||||
emits('update:modelValue', {});
|
||||
};
|
||||
|
||||
// 提交
|
||||
const handleEditClick = async (formEl) => {
|
||||
if (!formEl) return;
|
||||
if(serviceList.value.service_name == "" || serviceList.value.service_price == ""){
|
||||
ElMessage({
|
||||
message: '请填写服务类型和价格',
|
||||
type: 'error',
|
||||
})
|
||||
return;
|
||||
}
|
||||
formEl.validate(async (valid) => {
|
||||
if (!valid) {
|
||||
return;
|
||||
}
|
||||
const obj = formData.value.student_service;
|
||||
console.log(obj);
|
||||
var arr = []
|
||||
for (let i in obj) {
|
||||
arr.push(obj[i]); //属性
|
||||
}
|
||||
console.log(arr,"原来的");
|
||||
let newObj = deepClone(serviceList.value);
|
||||
arr.push(newObj)
|
||||
// let newObj = deepClose(serviceList.value);
|
||||
// arr.push(newObj)
|
||||
console.log(arr,"后面的");
|
||||
|
||||
formData.value.student_service = arr
|
||||
if(formData.value.student_service != null){
|
||||
serviceList.value.service_name = null
|
||||
serviceList.value.service_price = null
|
||||
closeDialog();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const handleResetClick = async formEl => {
|
||||
if (!formEl) return;
|
||||
formEl.resetFields();
|
||||
};
|
||||
</script>
|
||||
|
650
src/pages/index/school/student/index.vue
Normal file
@ -0,0 +1,650 @@
|
||||
<template>
|
||||
<!-- 面包屑 -->
|
||||
<el-breadcrumb>
|
||||
<el-breadcrumb-item>学生管理</el-breadcrumb-item>
|
||||
<el-breadcrumb-item to="/student/list">学生列表</el-breadcrumb-item>
|
||||
</el-breadcrumb>
|
||||
<el-row>
|
||||
<el-col :span="4">
|
||||
<el-tree :data="treeData" :props="{
|
||||
label: 'name',
|
||||
}" node-key="id" :default-expand-all="false" @node-click="handleNodeClick" highlight-current
|
||||
:expand-on-click-node="false" />
|
||||
</el-col>
|
||||
<el-col :span="20">
|
||||
<!-- 搜索 -->
|
||||
<el-form inline :model="params">
|
||||
|
||||
<el-form-item label="学生名称">
|
||||
<el-input v-model='params.student_name' placeholder='请输入学生名称'></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="手机号">
|
||||
<el-input v-model='params.studnet_phone' placeholder='请输入手机号'></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="身份证号">
|
||||
<el-input v-model='params.student_id_card' placeholder='请输入身份证号'></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="邮箱">
|
||||
<el-input v-model='params.student_email' placeholder='请输入邮箱'></el-input>
|
||||
</el-form-item>
|
||||
<el-form-item label="性别">
|
||||
<el-select v-model="params.student_sex" clearable placeholder="请选择">
|
||||
<el-option v-for="item in sex" :key="item.dictionary_guid" :label="item.dictionary_name"
|
||||
:value="item.dictionary_value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="产品类型">
|
||||
<el-cascader class="w100" :options="productTypeTreeList" :show-all-levels="false"
|
||||
:props="{ checkStrictly: false, value: 'product_type_guid', label: 'product_type_name', emitPath: false }"
|
||||
placeholder="请选择产品类型" clearable v-model="params.product_type" @change="clickProductTypeTree">
|
||||
<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-select v-model="params.product_guid" clearable placeholder="请先选择产品类型" @change="clickProduct">
|
||||
<el-option v-for="item in productList" :label="item.product_name" :key="item.product_guid"
|
||||
:value="item.product_guid"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="产品零件" prop="product_parts_guid">
|
||||
<el-select v-model="params.product_parts_guid" clearable placeholder="请先选择产品">
|
||||
<el-option v-for="item in productPartsList" :label="item.product_parts_name" :key="item.product_parts_guid"
|
||||
:value="item.product_parts_guid"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="会员类型">
|
||||
<el-select v-model="params.student_membe_type" clearable placeholder="请选择">
|
||||
<el-option v-for="item in member_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-select v-model="params.student_audit_status" clearable placeholder="请选择">
|
||||
<el-option v-for="item in audit_status" :key="item.dictionary_guid" :label="item.dictionary_name"
|
||||
:value="item.dictionary_value"></el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="会员日期">
|
||||
<el-date-picker v-model="params.student_member_time" style="width: 240px" type="daterange" range-separator="-"
|
||||
start-placeholder="开始日期" end-placeholder="结束日期" value-format="YYYY-MM-DD">
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item label="生日">
|
||||
<el-date-picker v-model="params.student_brithday" style="width: 240px" type="daterange" range-separator="-"
|
||||
start-placeholder="开始日期" end-placeholder="结束日期" value-format="YYYY-MM-DD">
|
||||
</el-date-picker>
|
||||
</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="addStudentDialogVisible = true"> 添加 </el-button>
|
||||
</el-col>
|
||||
<!-- 导出 -->
|
||||
<el-button icon="ElIconDocument" @click="exportExcel()">导出</el-button>
|
||||
<!-- 导入 -->
|
||||
<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="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-item @click="handleAudit(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 => getStudentList(params)">
|
||||
|
||||
<template #student_img="scope">
|
||||
<el-image v-if="scope.row.student_img" :src="scope.row.student_img.split(',')[0]" lazy
|
||||
:preview-src-list="scope.row.student_img.split(',')" :preview-teleported="true" :hide-on-click-modal="true"
|
||||
fit="contain" class="el-avatar"></el-image>
|
||||
<template v-else>暂无图片</template>
|
||||
</template>
|
||||
<template #student_banner_img="scope">
|
||||
<el-image v-if="scope.row.student_banner_img" :src="scope.row.student_banner_img.split(',')[0]" lazy
|
||||
:preview-src-list="scope.row.student_banner_img.split(',')" :preview-teleported="true"
|
||||
:hide-on-click-modal="true" fit="contain" class="el-avatar"></el-image>
|
||||
<template v-else>暂无图片</template>
|
||||
</template>
|
||||
<template #student_service="scope">
|
||||
<div v-for="(item, index) in scope.row.student_service " :key="index">
|
||||
<span>{{ item.service_name + ":" + item.service_price + "元" }}</span>
|
||||
</div>
|
||||
</template>
|
||||
<template #student_sex="scope">
|
||||
<dict-tag :options="sex" :value="scope.row.student_sex" />
|
||||
</template>
|
||||
<template #student_membe_type="scope">
|
||||
<dict-tag :options="member_type" :value="scope.row.student_membe_type" />
|
||||
</template>
|
||||
<template #student_audit_status="scope">
|
||||
<dict-tag :options="audit_status" :value="scope.row.student_audit_status" />
|
||||
</template>
|
||||
<template #chaoz="scope">
|
||||
<el-space>
|
||||
<el-button v-if="scope.row.student_audit_status == 2" size="small" @click="handleUpdate(scope.row)">
|
||||
编辑
|
||||
</el-button>
|
||||
<el-button v-if="scope.row.student_audit_status == 1" size="small" type="warning" @click="handleAudit(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>
|
||||
</el-col>
|
||||
</el-row>
|
||||
|
||||
|
||||
<!-- 添加学生 -->
|
||||
<AddStudentDialog v-model="addStudentDialogVisible" :done="() => tableRef.reload()"></AddStudentDialog>
|
||||
<!-- 编辑学生 -->
|
||||
<EditStudentDialog v-model="EditStudentDialogVisible" :data="EditStudentDialogRow" :done="() => tableRef.reload()">
|
||||
</EditStudentDialog>
|
||||
<!-- 学生详情 -->
|
||||
<DetailStudentDialog v-model="DetailStudentDialogVisible" :data="DetailStudentDialogRow"></DetailStudentDialog>
|
||||
<!-- 导入提示框 -->
|
||||
<ImportMsgDialog v-model="ImportMsgDialogVisible" :data="ImportMsgDialogRow" :done="() => tableRef.reload()">
|
||||
</ImportMsgDialog>
|
||||
</template>
|
||||
|
||||
|
||||
<script setup>
|
||||
import { ArrowDown } from '@element-plus/icons-vue';
|
||||
import { ref, reactive, watch } from 'vue';
|
||||
import { useLoginStore } from "~/store";
|
||||
import { changeDataPropertyName } from "~/utils/index";
|
||||
import { getStudentList, deleteStudent, getDictionary, exportExcel, downloadTemplate, importExcel, getClickProduct, getClickProductParts, getProductTree ,auditStudent} from '~/service/student';
|
||||
// import { getProductTypeTree } from "~/service/product_type";
|
||||
import AddStudentDialog from './components/AddStudentDialog.vue';
|
||||
import EditStudentDialog from './components/EditStudentDialog.vue';
|
||||
import DetailStudentDialog from './components/DetailStudentDialog.vue';
|
||||
import ImportMsgDialog from './components/ImportMsgDialog.vue';
|
||||
import { ElMessage } from 'element-plus';
|
||||
|
||||
const tableRef = ref();
|
||||
const selectionData = ref([]);
|
||||
const store = useLoginStore();
|
||||
|
||||
const addStudentDialogVisible = ref(false);
|
||||
const EditStudentDialogVisible = ref(false);
|
||||
const EditStudentDialogRow = ref({});
|
||||
const DetailStudentDialogVisible = ref(false);
|
||||
const DetailStudentDialogRow = ref({});
|
||||
const ImportMsgDialogVisible = ref(false);
|
||||
const ImportMsgDialogRow = ref({});
|
||||
|
||||
const productTypeTreeList = ref([]);
|
||||
const productList = ref([]);
|
||||
const productPartsList = ref([]);
|
||||
const treeData = ref([]);
|
||||
|
||||
const headers = {
|
||||
Accept: "application/json",
|
||||
...store.headers,
|
||||
};
|
||||
|
||||
// 查询参数
|
||||
const params = reactive({
|
||||
student_name: "",
|
||||
studnet_phone: "",
|
||||
student_id_card: "",
|
||||
student_email: "",
|
||||
student_sex: "",
|
||||
student_membe_type: "",
|
||||
student_audit_status: "",
|
||||
product_type: "",
|
||||
product_guid: "",
|
||||
product_parts_guid: "",
|
||||
student_member_time: "",
|
||||
student_brithday: "",
|
||||
});
|
||||
const column = [
|
||||
|
||||
{
|
||||
fixed: true,
|
||||
type: 'selection'
|
||||
},
|
||||
{
|
||||
prop: "student_name",
|
||||
label: '学生名称',
|
||||
width: '150'
|
||||
},
|
||||
{
|
||||
prop: "user_name",
|
||||
label: '用户',
|
||||
width: '150'
|
||||
},
|
||||
{
|
||||
prop: "classes_name",
|
||||
label: '班级',
|
||||
width: '150'
|
||||
},
|
||||
{
|
||||
prop: "student_img",
|
||||
label: '头像',
|
||||
width: '150'
|
||||
},
|
||||
{
|
||||
prop: "studnet_phone",
|
||||
label: '手机号',
|
||||
width: '150'
|
||||
},
|
||||
{
|
||||
prop: "student_id_card",
|
||||
label: '身份证号',
|
||||
width: '150'
|
||||
},
|
||||
{
|
||||
prop: "student_email",
|
||||
label: '邮箱',
|
||||
width: '150'
|
||||
},
|
||||
{
|
||||
prop: "student_sex",
|
||||
label: '性别',
|
||||
width: '150'
|
||||
},
|
||||
{
|
||||
prop: "student_price",
|
||||
label: '学生价格',
|
||||
width: '150'
|
||||
},
|
||||
{
|
||||
prop: "student_brithday",
|
||||
label: '生日',
|
||||
width: '150'
|
||||
},
|
||||
{
|
||||
prop: "product_type_name",
|
||||
label: '产品类型',
|
||||
width: '150'
|
||||
},
|
||||
{
|
||||
prop: "product_name",
|
||||
label: '产品',
|
||||
width: '150'
|
||||
},
|
||||
{
|
||||
prop: "product_parts_name",
|
||||
label: '产品零件',
|
||||
width: '150'
|
||||
},
|
||||
{
|
||||
prop: "student_service",
|
||||
label: '学生服务',
|
||||
width: '150'
|
||||
},
|
||||
{
|
||||
prop: "student_banner_img",
|
||||
label: '轮播图片',
|
||||
width: '150'
|
||||
},
|
||||
{
|
||||
prop: "student_location",
|
||||
label: '家庭住址',
|
||||
width: '150'
|
||||
},
|
||||
{
|
||||
prop: "student_membe_type",
|
||||
label: '会员类型',
|
||||
width: '150'
|
||||
},
|
||||
{
|
||||
prop: "student_member_begin_time",
|
||||
label: '会员开始时间',
|
||||
width: '150'
|
||||
},
|
||||
{
|
||||
prop: "student_member_end_time",
|
||||
label: '会员结束时间',
|
||||
width: '150'
|
||||
},
|
||||
{
|
||||
prop: "student_audit_status",
|
||||
label: '审核状态',
|
||||
width: '150'
|
||||
},
|
||||
{
|
||||
prop: "student_audit_user_name",
|
||||
label: '审核人',
|
||||
width: '150'
|
||||
},
|
||||
{
|
||||
label: '操作',
|
||||
prop: 'chaoz',
|
||||
width: '250'
|
||||
}
|
||||
];
|
||||
|
||||
|
||||
// 获取侧边产品树形
|
||||
const getTreeData = async () => {
|
||||
const data = await getProductTree();
|
||||
treeData.value = data;
|
||||
};
|
||||
getTreeData();
|
||||
|
||||
|
||||
// 获取产品类型树形列表
|
||||
async function getProductTypeTreeFun() {
|
||||
getProductTypeTree().then((res) => {
|
||||
if (res.code == 0) {
|
||||
productTypeTreeList.value = res.data
|
||||
}
|
||||
})
|
||||
}
|
||||
getProductTypeTreeFun()
|
||||
|
||||
// 点击产品类型
|
||||
const clickProductTypeTree = () => {
|
||||
getClickProductFun()
|
||||
params.product_guid = null
|
||||
params.product_parts_guid = null
|
||||
productList.length = 0
|
||||
productPartsList.length = 0
|
||||
}
|
||||
|
||||
// 点击产品
|
||||
const clickProduct = () => {
|
||||
getClickProductPartsFun()
|
||||
params.product_parts_guid = null
|
||||
productPartsList.length = 0
|
||||
}
|
||||
|
||||
// 获取产品列表
|
||||
async function getClickProductFun() {
|
||||
getClickProduct({ product_type_guid: params.product_type }).then((res) => {
|
||||
if (res.code == 0) {
|
||||
productList.value = res.data
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
|
||||
// 获取产品零件列表
|
||||
async function getClickProductPartsFun() {
|
||||
getClickProductParts({ product_guid: params.product_guid }).then((res) => {
|
||||
if (res.code == 0) {
|
||||
productPartsList.value = res.data
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
function findDataOf(data, rules, res) {
|
||||
top: for (let item of data) {
|
||||
if (item.children.length !== 0) {
|
||||
findDataOf(item.children, rules, res)
|
||||
}
|
||||
for (let key in rules) {
|
||||
if (item.data.product_guid === rules[key]) {
|
||||
res.push(data)
|
||||
break top
|
||||
}
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
// 点击侧边栏
|
||||
const handleNodeClick = (value) => {
|
||||
const { type, children, data } = value;
|
||||
switch (type) {
|
||||
// 点击产品类型
|
||||
case "product_type":
|
||||
if (data.parent_id == '0') return
|
||||
params.product_type = data.product_type_guid;
|
||||
clickProductTypeTree()
|
||||
|
||||
// console.log(data,'dart');
|
||||
// // 处理字段不同问题
|
||||
// changeDataPropertyName(children,{
|
||||
// id:'product_guid',
|
||||
// name:'product_name',
|
||||
// },true)
|
||||
// productList.value = children;
|
||||
// params.product_guid = "";
|
||||
// params.product_parts_guid = "";
|
||||
break;
|
||||
// 点击产品
|
||||
case "product":
|
||||
let res_product = []
|
||||
findDataOf(treeData.value, data, res_product)
|
||||
|
||||
console.log(res_product, 'asdasdasdas');
|
||||
|
||||
if (res_product.length == 2) {
|
||||
// 处理字段不同问题
|
||||
changeDataPropertyName(res_product[1], {
|
||||
id: 'product_guid',
|
||||
name: 'product_name',
|
||||
}, true)
|
||||
changeDataPropertyName(res_product[0], {
|
||||
id: 'product_parts_guid',
|
||||
name: 'product_parts_name',
|
||||
}, true)
|
||||
productList.value = res_product[1];
|
||||
productPartsList.value = res_product[0];
|
||||
}
|
||||
|
||||
if (res_product.length == 1) {
|
||||
// 处理字段不同问题
|
||||
changeDataPropertyName(res_product[0], {
|
||||
id: 'product_guid',
|
||||
name: 'product_name',
|
||||
}, true)
|
||||
productList.value = res_product[0];
|
||||
}
|
||||
|
||||
params.product_type = data.product_type_guid;
|
||||
params.product_guid = data.product_guid;
|
||||
params.product_parts_guid = "";
|
||||
break;
|
||||
// 点击产品零件
|
||||
case "product_parts":
|
||||
let res = []
|
||||
// "298b6201-eb5b-bca8-c5a6-b77ba45f6ffe"
|
||||
console.log(treeData.value, 'this is t');
|
||||
console.log(data, 'this is data');
|
||||
findDataOf(treeData.value, data, res)
|
||||
|
||||
let product = res[1]
|
||||
let product_parts = res[0]
|
||||
|
||||
console.log(res, 'this is res');
|
||||
|
||||
changeDataPropertyName(product, {
|
||||
id: 'product_guid',
|
||||
name: 'product_name',
|
||||
}, true)
|
||||
changeDataPropertyName(product_parts, {
|
||||
id: 'product_parts_guid',
|
||||
name: 'product_parts_name',
|
||||
}, true)
|
||||
|
||||
productList.value = product;
|
||||
productPartsList.value = product_parts;
|
||||
params.product_type = data.product_type_guid;
|
||||
params.product_guid = data.product_guid;
|
||||
params.product_parts_guid = data.product_parts_guid;
|
||||
break;
|
||||
|
||||
default:
|
||||
break;
|
||||
}
|
||||
};
|
||||
|
||||
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 deleteStudent({
|
||||
student_guid: data.map(v => v.student_guid).join()
|
||||
});
|
||||
if (res) {
|
||||
tableRef.value.reload();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
// 修改
|
||||
function handleUpdate(row) {
|
||||
EditStudentDialogVisible.value = true
|
||||
EditStudentDialogRow.value = row
|
||||
}
|
||||
|
||||
// 详情
|
||||
function handleDetail(row) {
|
||||
DetailStudentDialogVisible.value = true
|
||||
DetailStudentDialogRow.value = row
|
||||
}
|
||||
|
||||
|
||||
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();
|
||||
// ImportMsgDialogVisible.value = true
|
||||
// ImportMsgDialogRow.value = value.msg
|
||||
|
||||
tableRef.value.reload();
|
||||
};
|
||||
|
||||
|
||||
const AuditData = reactive({
|
||||
student_guid: null,
|
||||
student_audit_status: null,
|
||||
})
|
||||
|
||||
/** 审核按钮操作 */
|
||||
function handleAudit(row) {
|
||||
const Ids = row.student_guid || selectionData.value.map(v => v.student_guid).join()
|
||||
console.log(Ids);
|
||||
|
||||
ElMessageBox.confirm("是否通过审核?", "系统提示", {
|
||||
distinguishCancelAndClose: true,
|
||||
confirmButtonText: '通过',
|
||||
cancelButtonText: '驳回',
|
||||
type: "warning",
|
||||
})
|
||||
.then(async () => {
|
||||
AuditData.student_audit_status = 2
|
||||
AuditData.student_guid = Ids
|
||||
Audit()
|
||||
})
|
||||
.catch((action) => {
|
||||
if (action == 'cancel') {
|
||||
AuditData.student_audit_status = 3
|
||||
AuditData.student_guid = Ids
|
||||
Audit()
|
||||
// console.log("拒绝");
|
||||
}
|
||||
else {
|
||||
// console.log("关闭");
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
// 审核学生
|
||||
async function Audit() {
|
||||
auditStudent(AuditData).then((res) => {
|
||||
if (res.code == 0) {
|
||||
AuditData.student_audit_status = null
|
||||
AuditData.student_guid = null
|
||||
ElMessage.success(res.msg)
|
||||
}
|
||||
else{
|
||||
ElMessage.error(res.msg)
|
||||
}
|
||||
tableRef.value.reload();
|
||||
})
|
||||
}
|
||||
|
||||
// 字典获取
|
||||
const sex = ref([]);
|
||||
async function get_sex() {
|
||||
await getDictionary({ dictionary_value: 'sex' }).then((res) => {
|
||||
sex.value = res
|
||||
})
|
||||
}
|
||||
get_sex()
|
||||
// 字典获取
|
||||
const member_type = ref([]);
|
||||
async function get_member_type() {
|
||||
await getDictionary({ dictionary_value: 'member_type' }).then((res) => {
|
||||
member_type.value = res
|
||||
})
|
||||
}
|
||||
get_member_type()
|
||||
// 字典获取
|
||||
const audit_status = ref([]);
|
||||
async function get_audit_status() {
|
||||
await getDictionary({ dictionary_value: 'audit_status' }).then((res) => {
|
||||
audit_status.value = res
|
||||
})
|
||||
}
|
||||
get_audit_status()
|
||||
</script>
|
155
src/pages/index/tdk/components/AddTdkDialog.vue
Normal file
@ -0,0 +1,155 @@
|
||||
<template>
|
||||
<el-dialog v-model="dialogVisible" title="添加网站tdk" width="900px" @closed="closeDialog" @open="openDialog">
|
||||
<el-form ref="formRef" :model="formData" :rules="rules">
|
||||
<el-row>
|
||||
|
||||
|
||||
<el-col :span="12">
|
||||
<el-form-item label="tdk所属模块" prop="tdk_type">
|
||||
<el-select v-model="formData.tdk_type" clearable placeholder="请选择">
|
||||
<el-option v-for="item in tdk_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="12">
|
||||
<el-form-item :label-width="labelWidth" label="网页标题" prop="tdk_title">
|
||||
<el-input v-model='formData.tdk_title' type="text" placeholder='请输入网页标题'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item :label-width="labelWidth" label="网页简介" prop="tdk_description">
|
||||
<el-input :rows="10" v-model='formData.tdk_description' type="textarea" placeholder='请输入网页简介'></el-input>
|
||||
</el-form-item>
|
||||
</el-col>
|
||||
<el-col :span="24">
|
||||
<el-form-item :label-width="labelWidth" label="网页关键词" prop="tdk_keyword">
|
||||
<el-input :rows="10" v-model='formData.tdk_keyword' type="textarea" placeholder='请输入网页关键词'></el-input>
|
||||
</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 { addTdk, getDictionary } from "~/service/tdk";
|
||||
import { useLoginStore } from "~/store";
|
||||
|
||||
// --业务参数
|
||||
|
||||
|
||||
|
||||
// --业务方法
|
||||
|
||||
// 字典获取
|
||||
const tdk_type = ref([]);
|
||||
async function get_tdk_type() {
|
||||
await getDictionary({ dictionary_value: 'tdk_type' }).then((res) => {
|
||||
tdk_type.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: "Tdk"
|
||||
})
|
||||
|
||||
watch(props, (v) => {
|
||||
dialogVisible.value = v.modelValue;
|
||||
});
|
||||
|
||||
const rules = reactive({
|
||||
tdk_type: [
|
||||
{
|
||||
required: true,
|
||||
message: 'tdk所属模块不能为空'
|
||||
}
|
||||
],
|
||||
tdk_title: [
|
||||
{
|
||||
required: true,
|
||||
message: '网页标题不能为空'
|
||||
}
|
||||
],
|
||||
tdk_description: [
|
||||
{
|
||||
required: true,
|
||||
message: '网页简介不能为空'
|
||||
}
|
||||
],
|
||||
tdk_keyword: [
|
||||
{
|
||||
required: true,
|
||||
message: '网页关键词不能为空'
|
||||
}
|
||||
],
|
||||
|
||||
});
|
||||
|
||||
|
||||
// --基础方法
|
||||
|
||||
// 打开弹窗时执行
|
||||
const openDialog = () => {
|
||||
get_tdk_type()
|
||||
|
||||
};
|
||||
|
||||
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 addTdk(formData);
|
||||
if (code == 0) {
|
||||
closeDialog();
|
||||
props.done();
|
||||
}
|
||||
});
|
||||
};
|
||||
|
||||
const handleResetClick = async (formEl) => {
|
||||
if (!formEl) return;
|
||||
formEl.resetFields();
|
||||
};
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped></style>
|