版本初始化
3
.browserslistrc
Normal file
@@ -0,0 +1,3 @@
|
||||
> 1%
|
||||
last 2 versions
|
||||
not dead
|
||||
5
.editorconfig
Normal file
@@ -0,0 +1,5 @@
|
||||
[*.{js,jsx,ts,tsx,vue}]
|
||||
indent_style = space
|
||||
indent_size = 2
|
||||
trim_trailing_whitespace = true
|
||||
insert_final_newline = true
|
||||
18
.eslintrc.js
Normal file
@@ -0,0 +1,18 @@
|
||||
module.exports = {
|
||||
root: true,
|
||||
env: {
|
||||
node: true
|
||||
},
|
||||
extends: [
|
||||
'plugin:vue/essential',
|
||||
// '@vue/standard'
|
||||
],
|
||||
parserOptions: {
|
||||
parser: 'babel-eslint'
|
||||
},
|
||||
rules: {
|
||||
'no-console': process.env.NODE_ENV === 'production' ? 'warn' : 'off',
|
||||
'no-debugger': process.env.NODE_ENV === 'production' ? 'warn' : 'off', // 禁止生产使用debug模式
|
||||
'space-before-function-paren': 0 //去掉function与()之间空格
|
||||
}
|
||||
}
|
||||
23
.gitignore
vendored
Normal file
@@ -0,0 +1,23 @@
|
||||
.DS_Store
|
||||
node_modules
|
||||
/dist
|
||||
|
||||
|
||||
# local env files
|
||||
.env.local
|
||||
.env.*.local
|
||||
|
||||
# Log files
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
pnpm-debug.log*
|
||||
|
||||
# Editor directories and files
|
||||
.idea
|
||||
.vscode
|
||||
*.suo
|
||||
*.ntvs*
|
||||
*.njsproj
|
||||
*.sln
|
||||
*.sw?
|
||||
5
.prettierrc
Normal file
@@ -0,0 +1,5 @@
|
||||
{
|
||||
"semi": false,
|
||||
"singleQuote": true,
|
||||
"trailingComma": "none"
|
||||
}
|
||||
24
README.md
Normal file
@@ -0,0 +1,24 @@
|
||||
# admin-stu-capital
|
||||
|
||||
## Project setup
|
||||
```
|
||||
yarn install
|
||||
```
|
||||
|
||||
### Compiles and hot-reloads for development
|
||||
```
|
||||
yarn serve
|
||||
```
|
||||
|
||||
### Compiles and minifies for production
|
||||
```
|
||||
yarn build
|
||||
```
|
||||
|
||||
### Lints and fixes files
|
||||
```
|
||||
yarn lint
|
||||
```
|
||||
|
||||
### Customize configuration
|
||||
See [Configuration Reference](https://cli.vuejs.org/config/).
|
||||
5
babel.config.js
Normal file
@@ -0,0 +1,5 @@
|
||||
module.exports = {
|
||||
presets: [
|
||||
'@vue/cli-plugin-babel/preset'
|
||||
]
|
||||
}
|
||||
20349
package-lock.json
generated
Normal file
57
package.json
Normal file
@@ -0,0 +1,57 @@
|
||||
{
|
||||
"name": "admin-stu-capital",
|
||||
"version": "0.1.0",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"serve": "vue-cli-service serve",
|
||||
"build": "vue-cli-service build",
|
||||
"lint": "vue-cli-service lint"
|
||||
},
|
||||
"dependencies": {
|
||||
"@wangeditor/editor": "^5.1.14",
|
||||
"@wangeditor/editor-for-vue": "^1.0.2",
|
||||
"axios": "^0.26.1",
|
||||
"core-js": "^3.6.5",
|
||||
"echarts": "^5.3.2",
|
||||
"element-ui": "^2.15.6",
|
||||
"file-saver": "^2.0.5",
|
||||
"jquery": "^3.6.0",
|
||||
"js-base64": "^3.7.2",
|
||||
"lodash": "^4.17.21",
|
||||
"moment": "^2.29.2",
|
||||
"qs": "^6.10.3",
|
||||
"sass": "^1.26.5",
|
||||
"sass-loader": "^7.3.1",
|
||||
"save": "^2.9.0",
|
||||
"v-distpicker": "^1.2.13",
|
||||
"vue": "^2.6.11",
|
||||
"vue-baidu-map": "^0.21.22",
|
||||
"vue-router": "^3.2.0",
|
||||
"vuedraggable": "^2.24.3",
|
||||
"vuex": "^3.4.0",
|
||||
"xlsx": "^0.18.5"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@vue/cli-plugin-babel": "~4.5.13",
|
||||
"@vue/cli-plugin-eslint": "~4.5.13",
|
||||
"@vue/cli-plugin-router": "~4.5.13",
|
||||
"@vue/cli-plugin-vuex": "~4.5.13",
|
||||
"@vue/cli-service": "~4.5.13",
|
||||
"@vue/eslint-config-standard": "^5.1.2",
|
||||
"babel-eslint": "^10.1.0",
|
||||
"compression-webpack-plugin": "^5.0.2",
|
||||
"eslint": "^6.7.2",
|
||||
"eslint-plugin-import": "^2.20.2",
|
||||
"eslint-plugin-node": "^11.1.0",
|
||||
"eslint-plugin-promise": "^4.2.1",
|
||||
"eslint-plugin-standard": "^4.0.0",
|
||||
"eslint-plugin-vue": "^6.2.2",
|
||||
"image-webpack-loader": "^8.1.0",
|
||||
"less": "^3.0.4",
|
||||
"less-loader": "^5.0.0",
|
||||
"script-loader": "^0.7.2",
|
||||
"terser-webpack-plugin": "^4.2.3",
|
||||
"uglifyjs-webpack-plugin": "^2.2.0",
|
||||
"vue-template-compiler": "^2.6.11"
|
||||
}
|
||||
}
|
||||
2222
public/ezuikit.js
Normal file
BIN
public/favicon.ico
Normal file
|
After Width: | Height: | Size: 4.2 KiB |
BIN
public/h5/img/1.png
Normal file
|
After Width: | Height: | Size: 454 KiB |
BIN
public/h5/img/2.png
Normal file
|
After Width: | Height: | Size: 438 KiB |
BIN
public/h5/img/3.png
Normal file
|
After Width: | Height: | Size: 632 KiB |
BIN
public/h5/img/4.png
Normal file
|
After Width: | Height: | Size: 595 KiB |
BIN
public/h5/img/jyhQrCode/产地检疫证.jpg
Normal file
|
After Width: | Height: | Size: 68 KiB |
BIN
public/h5/img/jyhQrCode/经营户检疫合格证.jpg
Normal file
|
After Width: | Height: | Size: 34 KiB |
BIN
public/h5/img/jyhQrCode/经营户肉品证.png
Normal file
|
After Width: | Height: | Size: 270 KiB |
BIN
public/h5/img/query_bg.png
Normal file
|
After Width: | Height: | Size: 678 KiB |
BIN
public/h5/img/scQrCode/222.jpg
Normal file
|
After Width: | Height: | Size: 153 KiB |
BIN
public/h5/img/scQrCode/动物检疫证.jpg
Normal file
|
After Width: | Height: | Size: 72 KiB |
BIN
public/h5/img/scQrCode/肉品品质检疫合格证.jpg
Normal file
|
After Width: | Height: | Size: 149 KiB |
313
public/h5/index.html
Normal file
@@ -0,0 +1,313 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" name="viewport" />
|
||||
<!-- <meta name="viewport"
|
||||
content="initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, width=device-width"> -->
|
||||
<meta name="viewport"
|
||||
content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<meta name="screen-orientation" content="portrait">
|
||||
<meta name="full-screen" content="yes">
|
||||
<meta name="browsermode" content="application">
|
||||
<meta name="x5-orientation" content="portrait">
|
||||
|
||||
<title>溯源信息</title>
|
||||
<style>
|
||||
*,div,img,ul,li,span {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
font-size: 14px;
|
||||
font-family: "微软雅黑";
|
||||
font-weight: normal;
|
||||
color: #333;
|
||||
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
}
|
||||
li {
|
||||
list-style: none;
|
||||
}
|
||||
body {
|
||||
width: 100%;
|
||||
}
|
||||
.main_img {
|
||||
width: 100%;
|
||||
/* position: absolute; */
|
||||
}
|
||||
.main_img img{
|
||||
width: 100%;
|
||||
}
|
||||
.main_box {
|
||||
margin-top: -100px;
|
||||
}
|
||||
.item_box {
|
||||
width: 96%;
|
||||
margin: 0px 2%;
|
||||
color: #46D6A8;
|
||||
margin-top: 15px;
|
||||
background: #fff;
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-width: 0;
|
||||
word-wrap: break-word;
|
||||
border: 1px solid rgba(0,0,0,.125);
|
||||
border-radius: 10px;
|
||||
}
|
||||
.item_box .item_title {
|
||||
padding: 24px;
|
||||
box-sizing: border-box;
|
||||
text-align: left;
|
||||
font-size: 14px;
|
||||
letter-spacing: 2px;
|
||||
height: 40px;
|
||||
line-height: 24px;
|
||||
border-radius: 8px 8px 0 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-left: 14px;
|
||||
background-color: #DAFCE4;
|
||||
}
|
||||
.item_box .item_title span:nth-child(1){
|
||||
width: 100%;
|
||||
width: 3px;
|
||||
height: 14px;
|
||||
background: #46D6A8;
|
||||
}
|
||||
.item_box .item_title span:nth-child(2){
|
||||
margin-left: 10px;
|
||||
color: #46D6A8;;
|
||||
}
|
||||
ul {
|
||||
padding: 10px 10px 20px;
|
||||
}
|
||||
li {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
border-bottom: 1px solid rgba(0,0,0,.125);
|
||||
}
|
||||
li div{
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
color: #999;
|
||||
}
|
||||
.topimg {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
height: 100% !important;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
z-index: 9999;
|
||||
padding-top: 80%;
|
||||
background: rgba(0, 0, 0, .5);
|
||||
display: none;
|
||||
}
|
||||
|
||||
#img1 {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
height: 150% !important;
|
||||
position: fixed;
|
||||
background: rgba(0, 0, 0, .5);
|
||||
width: 100%;
|
||||
z-index: 9999;
|
||||
display: none;
|
||||
overflow: hidden;
|
||||
text-align: center;
|
||||
}
|
||||
#img2 {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
height: 150% !important;
|
||||
position: fixed;
|
||||
background: rgba(0, 0, 0, .5);
|
||||
width: 100%;
|
||||
z-index: 9999;
|
||||
padding-top: 80%;
|
||||
display: none;
|
||||
overflow: hidden;
|
||||
text-align: center;
|
||||
}
|
||||
#img3 {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
height: 150% !important;
|
||||
position: fixed;
|
||||
background: rgba(0, 0, 0, .5);
|
||||
width: 100%;
|
||||
z-index: 9999;
|
||||
padding-top: 80%;
|
||||
display: none;
|
||||
overflow: hidden;
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body id="bodydiv">
|
||||
<div class="topimg" id="img1">
|
||||
<div>
|
||||
<img style="width: 90%;"
|
||||
src="./img/jyhQrCode/产地检疫证.jpg"
|
||||
>
|
||||
</div>
|
||||
<div onclick="imgClick1(1)" style="font-size: 30px;color: rgb(255, 255, 255);">×</div>
|
||||
</div>
|
||||
<div class="topimg" id="img2">
|
||||
<div>
|
||||
<img style="width: 90%;"
|
||||
src="./img/jyhQrCode/经营户肉品证.png"
|
||||
>
|
||||
</div>
|
||||
<div onclick="imgClick1(2)" style="font-size: 30px;color: rgb(255, 255, 255);">×</div>
|
||||
</div>
|
||||
<div class="topimg" id="img3">
|
||||
<div>
|
||||
<img style="width: 90%;"
|
||||
src="./img/jyhQrCode/经营户检疫合格证.jpg"
|
||||
>
|
||||
</div>
|
||||
<div onclick="imgClick1(3)" style="font-size: 30px;color: rgb(255, 255, 255);">×</div>
|
||||
</div>
|
||||
<!-- 顶部图片 -->
|
||||
<div class="main_img">
|
||||
<img src="./img/2.png">
|
||||
</div>
|
||||
|
||||
|
||||
<div class="main_box">
|
||||
<div class="item_box">
|
||||
<div class="item_title"><span></span><span>经营户信息</span></div>
|
||||
<ul>
|
||||
<li>
|
||||
<div class="item_name">经营户名称</div>
|
||||
<div class="item_center">双成家庭农场</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">姓名</div>
|
||||
<div class="item_center">刘超</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">手机号</div>
|
||||
<div class="item_center">13678942578</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">经营户类型</div>
|
||||
<div class="item_center">散养</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">经营户地址</div>
|
||||
<div class="item_center">牧场牧三分场生活区</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="item_box">
|
||||
<div class="item_title"><span></span><span>屠宰检疫证</span></div>
|
||||
<ul>
|
||||
<li>
|
||||
<div class="item_name">证件照片</div>
|
||||
<div class="item_center" style="width: 50px;height: 100%;"><img id="myDiv" onclick="imgClick(1)" style="width: 50px;"
|
||||
src="./img/jyhQrCode/产地检疫证.jpg"></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">单位名称</div>
|
||||
<div class="item_center">双成家庭农场</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">法定负责人</div>
|
||||
<div class="item_center">刘超</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">代码编号</div>
|
||||
<div class="item_center">474984878487</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">经营范围</div>
|
||||
<div class="item_center">牛羊饲料销售</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="item_box">
|
||||
<div class="item_title"><span></span><span>肉品证</span></div>
|
||||
<ul>
|
||||
<li>
|
||||
<div class="item_name">证件照片</div>
|
||||
<div class="item_center" style="width: 50px;height: 100%;"><img id="myDiv" onclick="imgClick(2)" style="width: 50px;"
|
||||
src="./img/jyhQrCode/经营户肉品证.png"></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">单位名称</div>
|
||||
<div class="item_center">双成家庭农场</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">法定负责人</div>
|
||||
<div class="item_center">刘超</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">代码编号</div>
|
||||
<div class="item_center">NO.LZ02-3</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">有效期限</div>
|
||||
<div class="item_center">2024-11-23</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">发证单位</div>
|
||||
<div class="item_center">西吉县检疫机关</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="item_box">
|
||||
<div class="item_title"><span></span><span>产地检疫证</span></div>
|
||||
<ul>
|
||||
<li>
|
||||
<div class="item_name">证件照片</div>
|
||||
<div class="item_center" style="width: 50px;height: 100%;"><img id="myDiv" onclick="imgClick(3)" style="width: 50px;"
|
||||
src="./img/jyhQrCode/经营户检疫合格证.jpg"></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">单位名称</div>
|
||||
<div class="item_center">双成家庭农场</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">法定负责人</div>
|
||||
<div class="item_center">刘超</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">代码编号</div>
|
||||
<div class="item_center">牲检(2017)03号</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">单位地址</div>
|
||||
<div class="item_center">西吉县吉强乡牧场牧三分场生活区</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">发证机关</div>
|
||||
<div class="item_center">西吉县农牧管理局</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">有效期</div>
|
||||
<div class="item_center">2025 年 12月</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<script>
|
||||
var imgClick = (num) => {
|
||||
console.log(num)
|
||||
document.getElementById('img'+num).style.display = 'block';
|
||||
}
|
||||
var imgClick1 = (num) => {
|
||||
document.getElementById('img'+num).style.display = 'none';
|
||||
}
|
||||
</script>
|
||||
</html>
|
||||
224
public/h5/query.html
Normal file
@@ -0,0 +1,224 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" name="viewport" />
|
||||
<!-- <meta name="viewport"
|
||||
content="initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, width=device-width"> -->
|
||||
<meta name="viewport"
|
||||
content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<meta name="screen-orientation" content="portrait">
|
||||
<meta name="full-screen" content="yes">
|
||||
<meta name="browsermode" content="application">
|
||||
<meta name="x5-orientation" content="portrait">
|
||||
|
||||
<title>溯源信息</title>
|
||||
<style>
|
||||
*,
|
||||
div,
|
||||
img,
|
||||
ul,
|
||||
li,
|
||||
span {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
font-size: 14px;
|
||||
font-family: "微软雅黑";
|
||||
font-weight: normal;
|
||||
color: #333;
|
||||
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
}
|
||||
|
||||
li {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
body {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.main_img {
|
||||
width: 100%;
|
||||
/* position: absolute; */
|
||||
}
|
||||
|
||||
.main_img img {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.main_box {
|
||||
margin-top: -100px;
|
||||
}
|
||||
|
||||
.item_box {
|
||||
width: 96%;
|
||||
margin: 0px 2%;
|
||||
color: #46D6A8;
|
||||
margin-top: 15px;
|
||||
background: #fff;
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-width: 0;
|
||||
word-wrap: break-word;
|
||||
border: 1px solid rgba(0, 0, 0, .125);
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.item_box .item_title {
|
||||
padding: 24px;
|
||||
box-sizing: border-box;
|
||||
text-align: left;
|
||||
font-size: 14px;
|
||||
letter-spacing: 2px;
|
||||
height: 40px;
|
||||
line-height: 24px;
|
||||
border-radius: 8px 8px 0 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-left: 14px;
|
||||
background-color: #DAFCE4;
|
||||
}
|
||||
|
||||
.item_box .item_title span:nth-child(1) {
|
||||
width: 100%;
|
||||
width: 3px;
|
||||
height: 14px;
|
||||
background: #46D6A8;
|
||||
}
|
||||
|
||||
.item_box .item_title span:nth-child(2) {
|
||||
margin-left: 10px;
|
||||
color: #46D6A8;
|
||||
;
|
||||
}
|
||||
|
||||
ul {
|
||||
padding: 10px 10px 20px;
|
||||
}
|
||||
|
||||
li {
|
||||
height: 40px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
border-bottom: 1px solid rgba(0, 0, 0, .125);
|
||||
}
|
||||
|
||||
li div {
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.topimg {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
height: 100% !important;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
z-index: 9999;
|
||||
padding-top: 80%;
|
||||
background: rgba(0, 0, 0, .5);
|
||||
display: none;
|
||||
}
|
||||
|
||||
.btn-box {
|
||||
width: 100%;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
position: relative;
|
||||
z-index: 999;
|
||||
margin-top: 40px;
|
||||
}
|
||||
|
||||
.query-btn {
|
||||
width: 345px;
|
||||
height: 50px;
|
||||
border-radius: 50px;
|
||||
background-color: #46D6A8;
|
||||
color: #fff;
|
||||
border: none;
|
||||
}
|
||||
|
||||
.input-box {
|
||||
position: relative;
|
||||
z-index: 999;
|
||||
margin-top: -110px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
|
||||
}
|
||||
|
||||
.box-inner {
|
||||
width: 345px;
|
||||
height: 50px;
|
||||
padding: 0 30px;
|
||||
line-height: 50px;
|
||||
border-radius: 50px;
|
||||
background-color: #fff;
|
||||
}
|
||||
|
||||
.inner-text {
|
||||
color: #A6A6A6;
|
||||
font-size: 14px;
|
||||
display: inline-block;
|
||||
}
|
||||
|
||||
.inner-input {
|
||||
display: inline-block;
|
||||
margin-left: 50px;
|
||||
border: none;
|
||||
outline: none;
|
||||
}
|
||||
|
||||
.inner-input::placeholder {
|
||||
color: #A6A6A6
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body id="bodydiv" style="background-color:#E9F3FB ;">
|
||||
|
||||
<!-- 顶部图片 -->
|
||||
<div class="main_img">
|
||||
<img src="./img/query_bg.png">
|
||||
<div class="input-box">
|
||||
<div class="box-inner">
|
||||
<span class="inner-text">检疫耳标号</span>
|
||||
<input class="inner-input" type="text" placeholder="请输入检疫耳标号">
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="btn-box">
|
||||
<button class="query-btn" id="btn">查询</button>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
</body>
|
||||
<script>
|
||||
|
||||
|
||||
window.onload = function () {
|
||||
var btn = document.getElementById("btn");
|
||||
btn.addEventListener("click", function () {
|
||||
var url = 'https://demo-cattle-source.aiotagro.com/h5/record.html'
|
||||
window.location.href = url
|
||||
}, false)
|
||||
}
|
||||
|
||||
|
||||
</script>
|
||||
|
||||
</html>
|
||||
301
public/h5/record.html
Normal file
@@ -0,0 +1,301 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" name="viewport" />
|
||||
<!-- <meta name="viewport"
|
||||
content="initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, width=device-width"> -->
|
||||
<meta name="viewport"
|
||||
content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<meta name="screen-orientation" content="portrait">
|
||||
<meta name="full-screen" content="yes">
|
||||
<meta name="browsermode" content="application">
|
||||
<meta name="x5-orientation" content="portrait">
|
||||
|
||||
<title>溯源信息</title>
|
||||
<style>
|
||||
*,
|
||||
div,
|
||||
img,
|
||||
ul,
|
||||
li,
|
||||
span {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
font-size: 14px;
|
||||
font-family: "微软雅黑";
|
||||
font-weight: normal;
|
||||
color: #333;
|
||||
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
}
|
||||
|
||||
li {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
body {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.main_img {
|
||||
width: 100%;
|
||||
/* position: absolute; */
|
||||
}
|
||||
|
||||
.main_img img {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.main_box {
|
||||
margin-top: -100px;
|
||||
}
|
||||
|
||||
.item_box {
|
||||
width: 96%;
|
||||
margin: 0px 2%;
|
||||
color: #46D6A8;
|
||||
margin-top: 15px;
|
||||
background: #fff;
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-width: 0;
|
||||
word-wrap: break-word;
|
||||
border: 1px solid rgba(0, 0, 0, .125);
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.item_box .item_title {
|
||||
padding: 24px;
|
||||
box-sizing: border-box;
|
||||
text-align: left;
|
||||
font-size: 14px;
|
||||
letter-spacing: 2px;
|
||||
height: 40px;
|
||||
line-height: 24px;
|
||||
border-radius: 8px 8px 0 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-left: 14px;
|
||||
background-color: #DAFCE4;
|
||||
}
|
||||
|
||||
.item_box .item_title span:nth-child(1) {
|
||||
width: 100%;
|
||||
width: 3px;
|
||||
height: 14px;
|
||||
background: #46D6A8;
|
||||
}
|
||||
|
||||
.item_box .item_title span:nth-child(2) {
|
||||
margin-left: 10px;
|
||||
color: #46D6A8;
|
||||
;
|
||||
}
|
||||
|
||||
ul {
|
||||
padding: 10px 10px 20px;
|
||||
}
|
||||
|
||||
li {
|
||||
height: 40px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
border-bottom: 1px solid rgba(0, 0, 0, .125);
|
||||
}
|
||||
|
||||
li div {
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.topimg {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
height: 100% !important;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
z-index: 9999;
|
||||
padding-top: 80%;
|
||||
background: rgba(0, 0, 0, .5);
|
||||
display: none;
|
||||
}
|
||||
|
||||
#img1 {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
height: 150% !important;
|
||||
position: fixed;
|
||||
background: rgba(0, 0, 0, .5);
|
||||
width: 100%;
|
||||
z-index: 9999;
|
||||
display: none;
|
||||
overflow: hidden;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#img2 {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
height: 150% !important;
|
||||
position: fixed;
|
||||
background: rgba(0, 0, 0, .5);
|
||||
width: 100%;
|
||||
z-index: 9999;
|
||||
padding-top: 80%;
|
||||
display: none;
|
||||
overflow: hidden;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
#img3 {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
height: 150% !important;
|
||||
position: fixed;
|
||||
background: rgba(0, 0, 0, .5);
|
||||
width: 100%;
|
||||
z-index: 9999;
|
||||
padding-top: 80%;
|
||||
display: none;
|
||||
overflow: hidden;
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body id="bodydiv">
|
||||
|
||||
<div class="topimg" id="img1">
|
||||
<div style="margin-top: -100px;">
|
||||
<img style="width: 70%;"
|
||||
src="https://smart-1251449951.cos.ap-guangzhou.myqcloud.com/forage/20240724/d0grpuztsfjyrqp8mc0z.jpg">
|
||||
</div>
|
||||
<div onclick="imgClick1(1)" style="font-size: 30px;color: rgb(255, 255, 255);">×</div>
|
||||
</div>
|
||||
<div class="topimg" id="img2">
|
||||
<div style="margin-top: -100px;">
|
||||
<img style="width: 70%;"
|
||||
src="https://smart-1251449951.cos.ap-guangzhou.myqcloud.com/forage/20240722/mtyqc6ivv9t86kgfsmdq.jpg">
|
||||
</div>
|
||||
<div onclick="imgClick1(2)" style="font-size: 30px;color: rgb(255, 255, 255);">×</div>
|
||||
</div>
|
||||
|
||||
|
||||
|
||||
<!-- 顶部图片 -->
|
||||
<div class="main_img">
|
||||
<img src="./img/4.png">
|
||||
</div>
|
||||
|
||||
|
||||
<div class="main_box">
|
||||
<div class="item_box">
|
||||
<div class="item_title"><span></span><span>身份信息</span></div>
|
||||
<ul>
|
||||
<li style="height: 80px;">
|
||||
<div class="item_name">畜牧照片</div>
|
||||
<div class="item_center" style="height: 100%;"><img id="myDiv" onclick="imgClick(1)"
|
||||
style="width: 100%;height: 70px;"
|
||||
src="https://smart-1251449951.cos.ap-guangzhou.myqcloud.com/forage/20240724/d0grpuztsfjyrqp8mc0z.jpg"
|
||||
alt=""></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">品种</div>
|
||||
<div class="item_center">西门塔尔牛</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">生理阶段</div>
|
||||
<div class="item_center">基础母牛</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">性别</div>
|
||||
<div class="item_center">母</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">体重(kg)</div>
|
||||
<div class="item_center">500</div>
|
||||
</li>
|
||||
|
||||
</ul>
|
||||
</div>
|
||||
<div class="item_box">
|
||||
<div class="item_title"><span></span><span>检疫信息</span></div>
|
||||
<ul>
|
||||
<li style="height: 80px;">
|
||||
<div class="item_name">检疫证照片</div>
|
||||
<div class="item_center" style="height: 100%;"><img id="myDiv" onclick="imgClick(2)"
|
||||
style="width: 100%;height: 70px;"
|
||||
src="https://smart-1251449951.cos.ap-guangzhou.myqcloud.com/forage/20240722/mtyqc6ivv9t86kgfsmdq.jpg"
|
||||
alt=""></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">检疫证编号</div>
|
||||
<div class="item_center">062403041500564599</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">免疫程序</div>
|
||||
<div class="item_center">合格</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">免疫记录</div>
|
||||
<div class="item_center">合格</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">养殖卫生</div>
|
||||
<div class="item_center">合格</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">半年内是否出现过疫情</div>
|
||||
<div class="item_center">没有</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="item_box">
|
||||
<div class="item_title"><span></span><span>交易信息</span></div>
|
||||
<ul>
|
||||
|
||||
<li>
|
||||
<div class="item_name">卖家姓名</div>
|
||||
<div class="item_center">林*</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">卖家地址</div>
|
||||
<div class="item_center">宁夏回族自治区固原市西吉县什字乡*</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">买家姓名</div>
|
||||
<div class="item_center">刘*</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">买家地址</div>
|
||||
<div class="item_center">宁夏回族自治区固原市西吉县北山村*</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">交易时间</div>
|
||||
<div class="item_center">2024-7-22 19:45:24</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
</body>
|
||||
<script>
|
||||
var imgClick = (num) => {
|
||||
document.getElementById('img' + num).style.display = 'block';
|
||||
}
|
||||
var imgClick1 = (num) => {
|
||||
document.getElementById('img' + num).style.display = 'none';
|
||||
}
|
||||
</script>
|
||||
|
||||
</html>
|
||||
279
public/h5/scxx-index.html
Normal file
@@ -0,0 +1,279 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="zh-CN">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" name="viewport" />
|
||||
<!-- <meta name="viewport"
|
||||
content="initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, width=device-width"> -->
|
||||
<meta name="viewport"
|
||||
content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<meta name="screen-orientation" content="portrait">
|
||||
<meta name="full-screen" content="yes">
|
||||
<meta name="browsermode" content="application">
|
||||
<meta name="x5-orientation" content="portrait">
|
||||
|
||||
<title>牲畜信息</title>
|
||||
<style>
|
||||
*,div,img,ul,li,span {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
font-size: 14px;
|
||||
font-family: "微软雅黑";
|
||||
font-weight: normal;
|
||||
color: #333;
|
||||
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
}
|
||||
li {
|
||||
list-style: none;
|
||||
}
|
||||
body {
|
||||
width: 100%;
|
||||
}
|
||||
.main_img {
|
||||
width: 100%;
|
||||
/* position: absolute; */
|
||||
}
|
||||
.main_img img{
|
||||
width: 100%;
|
||||
}
|
||||
.main_box {
|
||||
margin-top: -100px;
|
||||
}
|
||||
.item_box {
|
||||
width: 96%;
|
||||
margin: 0px 2%;
|
||||
color: #46D6A8;
|
||||
margin-top: 15px;
|
||||
background: #fff;
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-width: 0;
|
||||
word-wrap: break-word;
|
||||
border: 1px solid rgba(0,0,0,.125);
|
||||
border-radius: 10px;
|
||||
}
|
||||
.item_box .item_title {
|
||||
padding: 24px;
|
||||
box-sizing: border-box;
|
||||
text-align: left;
|
||||
font-size: 14px;
|
||||
letter-spacing: 2px;
|
||||
height: 40px;
|
||||
line-height: 24px;
|
||||
border-radius: 8px 8px 0 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-left: 14px;
|
||||
background-color: #DAFCE4;
|
||||
}
|
||||
.item_box .item_title span:nth-child(1){
|
||||
width: 100%;
|
||||
width: 3px;
|
||||
height: 14px;
|
||||
background: #46D6A8;
|
||||
}
|
||||
.item_box .item_title span:nth-child(2){
|
||||
margin-left: 10px;
|
||||
color: #46D6A8;;
|
||||
}
|
||||
ul {
|
||||
padding: 10px 10px 20px;
|
||||
}
|
||||
li {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
border-bottom: 1px solid rgba(0,0,0,.125);
|
||||
}
|
||||
li div{
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
color: #999;
|
||||
}
|
||||
.topimg {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
height: 100% !important;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
z-index: 9999;
|
||||
padding-top: 80%;
|
||||
background: rgba(0, 0, 0, .5);
|
||||
display: none;
|
||||
}
|
||||
|
||||
#img1 {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
height: 150% !important;
|
||||
position: fixed;
|
||||
background: rgba(0, 0, 0, .5);
|
||||
width: 100%;
|
||||
z-index: 9999;
|
||||
display: none;
|
||||
overflow: hidden;
|
||||
text-align: center;
|
||||
}
|
||||
#img2 {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
height: 150% !important;
|
||||
position: fixed;
|
||||
background: rgba(0, 0, 0, .5);
|
||||
width: 100%;
|
||||
z-index: 9999;
|
||||
padding-top: 80%;
|
||||
display: none;
|
||||
overflow: hidden;
|
||||
text-align: center;
|
||||
}
|
||||
#img3 {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
height: 150% !important;
|
||||
position: fixed;
|
||||
background: rgba(0, 0, 0, .5);
|
||||
width: 100%;
|
||||
z-index: 9999;
|
||||
padding-top: 80%;
|
||||
display: none;
|
||||
overflow: hidden;
|
||||
text-align: center;
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body id="bodydiv">
|
||||
<div class="topimg" id="img1">
|
||||
<div>
|
||||
<img style="width: 90%;"
|
||||
src="./img/scQrCode/222.jpg"
|
||||
>
|
||||
</div>
|
||||
<div onclick="imgClick1(1)" style="font-size: 30px;color: rgb(255, 255, 255);">×</div>
|
||||
</div>
|
||||
<div class="topimg" id="img2">
|
||||
<div>
|
||||
<img style="width: 90%;"
|
||||
src="./img/scQrCode/动物检疫证.jpg"
|
||||
>
|
||||
</div>
|
||||
<div onclick="imgClick1(2)" style="font-size: 30px;color: rgb(255, 255, 255);">×</div>
|
||||
</div>
|
||||
<div class="topimg" id="img3">
|
||||
<div>
|
||||
<img style="width: 90%;"
|
||||
src="./img/scQrCode/肉品品质检疫合格证.jpg"
|
||||
>
|
||||
</div>
|
||||
<div onclick="imgClick1(3)" style="font-size: 30px;color: rgb(255, 255, 255);">×</div>
|
||||
</div>
|
||||
<!-- 顶部图片 -->
|
||||
<div class="main_img">
|
||||
<img src="./img/2.png">
|
||||
</div>
|
||||
|
||||
|
||||
<div class="main_box">
|
||||
<div class="item_box">
|
||||
<div class="item_title"><span></span><span>牲畜信息</span></div>
|
||||
<ul>
|
||||
<li>
|
||||
<div class="item_name">牲畜照片</div>
|
||||
<div class="item_center" style="width: 50px;height: 100%;"><img id="myDiv" onclick="imgClick(1)" style="width: 50px;"
|
||||
src="./img/scQrCode/222.jpg"></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">品种</div>
|
||||
<div class="item_center">九龙牦牛</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">生理阶段</div>
|
||||
<div class="item_center">犊牛</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">性别</div>
|
||||
<div class="item_center">公</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">体重(kg)</div>
|
||||
<div class="item_center">20.00</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
|
||||
<div class="item_box">
|
||||
<div class="item_title"><span></span><span>检疫证</span></div>
|
||||
<ul>
|
||||
<li>
|
||||
<div class="item_name">证件照片</div>
|
||||
<div class="item_center" style="width: 50px;height: 100%;"><img id="myDiv" onclick="imgClick(1)" style="width: 50px;"
|
||||
src="./img/scQrCode/动物检疫证.jpg"></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">货主</div>
|
||||
<div class="item_center">刘超</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">产品名称</div>
|
||||
<div class="item_center">牛肉</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">产地</div>
|
||||
<div class="item_center">西吉县</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">生产单位名称</div>
|
||||
<div class="item_center">西吉县</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">检疫识别号</div>
|
||||
<div class="item_center">宁F302</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="item_box">
|
||||
<div class="item_title"><span></span><span>肉品品质检验合格证</span></div>
|
||||
<ul>
|
||||
<li>
|
||||
<div class="item_name">证件照片</div>
|
||||
<div class="item_center" style="width: 50px;height: 100%;"><img id="myDiv" onclick="imgClick(2)" style="width: 50px;"
|
||||
src="./img/scQrCode/肉品品质检疫合格证.jpg"></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">产品名称</div>
|
||||
<div class="item_center">牛肉</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">生产单位</div>
|
||||
<div class="item_center">西吉县肉类加工有限公司</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">生产日期</div>
|
||||
<div class="item_center">2024年8月8日</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">肉品编码</div>
|
||||
<div class="item_center">宁B5</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<script>
|
||||
var imgClick = (num) => {
|
||||
document.getElementById('img'+num).style.display = 'block';
|
||||
}
|
||||
var imgClick1 = (num) => {
|
||||
document.getElementById('img'+num).style.display = 'none';
|
||||
}
|
||||
</script>
|
||||
</html>
|
||||
267
public/h5/wzhH5.html
Normal file
@@ -0,0 +1,267 @@
|
||||
<!DOCTYPE html>
|
||||
<html id="bodydiv" lang="zh-CN">
|
||||
|
||||
<head>
|
||||
<meta charset="UTF-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" name="viewport" />
|
||||
<!-- <meta name="viewport"
|
||||
content="initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0, user-scalable=no, width=device-width"> -->
|
||||
<meta name="viewport"
|
||||
content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
|
||||
<meta name="screen-orientation" content="portrait">
|
||||
<meta name="full-screen" content="yes">
|
||||
<meta name="browsermode" content="application">
|
||||
<meta name="x5-orientation" content="portrait">
|
||||
|
||||
<title>溯源信息</title>
|
||||
<style>
|
||||
*,
|
||||
div,
|
||||
img,
|
||||
ul,
|
||||
li,
|
||||
span {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
box-sizing: border-box;
|
||||
font-size: 14px;
|
||||
font-family: "微软雅黑";
|
||||
font-weight: normal;
|
||||
color: #333;
|
||||
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
|
||||
-webkit-touch-callout: none;
|
||||
-webkit-user-select: none;
|
||||
-moz-user-select: none;
|
||||
-ms-user-select: none;
|
||||
}
|
||||
|
||||
li {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
body {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.main_img {
|
||||
width: 100%;
|
||||
/* position: absolute; */
|
||||
}
|
||||
|
||||
.main_img img {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.main_box {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin-top: -100px;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
.item_box {
|
||||
width: 96%;
|
||||
color: #46D6A8;
|
||||
margin-top: 15px;
|
||||
background: #fff;
|
||||
position: relative;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
min-width: 0;
|
||||
word-wrap: break-word;
|
||||
border: 1px solid rgba(0, 0, 0, .125);
|
||||
border-radius: 10px;
|
||||
}
|
||||
|
||||
.item_box .item_title {
|
||||
padding: 24px;
|
||||
box-sizing: border-box;
|
||||
text-align: left;
|
||||
font-size: 14px;
|
||||
letter-spacing: 2px;
|
||||
height: 40px;
|
||||
line-height: 24px;
|
||||
background: #E7ECF2;
|
||||
border-radius: 8px 8px 0 0;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
padding-left: 14px;
|
||||
background-color: rgba(126, 182, 62, 0.1);
|
||||
}
|
||||
|
||||
.item_box .item_title span:nth-child(1) {
|
||||
width: 100%;
|
||||
width: 3px;
|
||||
height: 14px;
|
||||
background: #46D6A8;
|
||||
}
|
||||
|
||||
.item_box .item_title span:nth-child(2) {
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
ul {
|
||||
padding: 10px 10px 20px;
|
||||
}
|
||||
|
||||
li {
|
||||
/* height: 40px; */
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
border-bottom: 1px solid rgba(0, 0, 0, .125);
|
||||
}
|
||||
|
||||
li div {
|
||||
height: 40px;
|
||||
line-height: 40px;
|
||||
color: #999;
|
||||
}
|
||||
|
||||
.topimg {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
height: 100% !important;
|
||||
position: absolute;
|
||||
width: 100%;
|
||||
z-index: 9999;
|
||||
padding-top: 80%;
|
||||
background: rgba(0, 0, 0, .5);
|
||||
display: none;
|
||||
}
|
||||
|
||||
#img1 {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
height: 180% !important;
|
||||
position: absolute;
|
||||
background: rgba(0, 0, 0, .5);
|
||||
width: 100%;
|
||||
z-index: 9999;
|
||||
padding-top: 80%;
|
||||
display: none;
|
||||
overflow: hidden;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
/* html,
|
||||
body {
|
||||
overflow: hidden;
|
||||
height: 100%;
|
||||
} */
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body id="bodydiv">
|
||||
<!-- 顶部图片 -->
|
||||
<div>
|
||||
<div class="topimg" id="img1">
|
||||
<div>
|
||||
<img style="width: 240px;height: 260px;"
|
||||
src="https://smart-1251449951.cos.ap-guangzhou.myqcloud.com/jusu/2024/07/22/图片(1)20240722173455.png"
|
||||
alt="">
|
||||
</div>
|
||||
<div id="myDiv1" style="font-size: 30px;color: rgb(255, 255, 255);">×</div>
|
||||
</div>
|
||||
<div class="main_img">
|
||||
<img src="https://smart-1251449951.cos.ap-guangzhou.myqcloud.com/jusu/2024/07/23/220240723160432.png">
|
||||
</div>
|
||||
<div class="main_box">
|
||||
<div class="item_box">
|
||||
<div class="item_title"><span></span><span>药品基本信息</span></div>
|
||||
<ul>
|
||||
<li>
|
||||
<div class="item_name">药品照片</div>
|
||||
<div class="item_center" style="width: 50px;height: 100%;"><img id="myDiv" style="width: 50px;"
|
||||
src="https://smart-1251449951.cos.ap-guangzhou.myqcloud.com/jusu/2024/07/22/图片(1)20240722173455.png"
|
||||
alt=""></div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">药品编号</div>
|
||||
<div class="item_center">164735277755216851</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">药品名称</div>
|
||||
<div class="item_center">兽用阿莫西林可溶性粉</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">药品类型</div>
|
||||
<div class="item_center">抗生素</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">药品已售数量</div>
|
||||
<div class="item_center">45</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="item_box">
|
||||
<div class="item_title"><span></span><span>药店基本信息</span></div>
|
||||
<ul>
|
||||
<li>
|
||||
<div class="item_name">药店编号</div>
|
||||
<div class="item_center">10003251</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">药店名称</div>
|
||||
<div class="item_center">瑞丰兽药店</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">法定代表人</div>
|
||||
<div class="item_center">孙维</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">联系电话</div>
|
||||
<div class="item_center">13000023021</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">登记机关</div>
|
||||
<div class="item_center">西吉县市场监督管理局</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">成立日期</div>
|
||||
<div class="item_center">2021-07-13</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">经营状态</div>
|
||||
<div class="item_center">在业</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="item_box">
|
||||
<div class="item_title"><span></span><span>药品厂家信息</span></div>
|
||||
<ul>
|
||||
<li>
|
||||
<div class="item_name">生产厂家</div>
|
||||
<div class="item_center">大连博莱药业有限公司</div>
|
||||
</li>
|
||||
<li>
|
||||
<div class="item_name">厂家经营状态</div>
|
||||
<div class="item_center">正常经营</div>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
<div class="item_box">
|
||||
<div class="item_title"><span></span><span>售卖记录</span></div>
|
||||
<img style="width: 100%;margin-top: 20px;"
|
||||
src="https://smart-1251449951.cos.ap-guangzhou.myqcloud.com/jusu/2024/07/24/Steps 步骤条120240724111909.png"
|
||||
alt="">
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</body>
|
||||
<script>
|
||||
document.getElementById('myDiv').addEventListener('click', function () {
|
||||
document.getElementById('img1').style.display = 'block';
|
||||
document.getElementById('bodydiv').style.overflow = 'hidden';
|
||||
document.getElementById('height').style.overflow = '150%';
|
||||
}); document.getElementById('myDiv1').addEventListener('click', function () {
|
||||
document.getElementById('img1').style.display = 'none';
|
||||
document.getElementById('bodydiv').style.overflow = 'auto';
|
||||
document.getElementById('height').style.overflow = 'auto';
|
||||
});
|
||||
</script>
|
||||
|
||||
</html>
|
||||
51
public/index.html
Normal file
@@ -0,0 +1,51 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="">
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta http-equiv="X-UA-Compatible" content="IE=edge">
|
||||
<meta name="viewport" content="width=device-width,initial-scale=1.0">
|
||||
<link rel="icon" href="<%= BASE_URL %>favicon.ico">
|
||||
<title>
|
||||
<%= htmlWebpackPlugin.options.title %>
|
||||
</title>
|
||||
<style>
|
||||
* {
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
|
||||
html,
|
||||
body {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
#app {
|
||||
height: 100% !important;
|
||||
padding: 0;
|
||||
margin: 0;
|
||||
}
|
||||
</style>
|
||||
<!-- 使用CDN的CSS文件 -->
|
||||
<% for (var i in htmlWebpackPlugin.options.cdn && htmlWebpackPlugin.options.cdn.css) { %>
|
||||
<link href="<%= htmlWebpackPlugin.options.cdn.css[i] %>" rel="preload" as="style">
|
||||
<link href="<%= htmlWebpackPlugin.options.cdn.css[i] %>" rel="stylesheet">
|
||||
<% } %>
|
||||
<!-- 使用CDN的JS文件 -->
|
||||
<% for (var i in htmlWebpackPlugin.options.cdn && htmlWebpackPlugin.options.cdn.js) { %>
|
||||
<script src="<%= htmlWebpackPlugin.options.cdn.js[i] %>"></script>
|
||||
<% } %>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
<noscript>
|
||||
<strong>We're sorry but <%= htmlWebpackPlugin.options.title %> doesn't work properly without JavaScript enabled.
|
||||
Please enable it to continue.</strong>
|
||||
</noscript>
|
||||
<div id="app">
|
||||
</div>
|
||||
<!-- built files will be auto injected -->
|
||||
</body>
|
||||
|
||||
</html>
|
||||
9
src/App.vue
Normal file
@@ -0,0 +1,9 @@
|
||||
<template>
|
||||
<div id="app">
|
||||
<router-view></router-view>
|
||||
<!-- <router-link to="/"></router-link> -->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style lang="less">
|
||||
</style>
|
||||
179
src/Excel/Blob.js
Normal file
@@ -0,0 +1,179 @@
|
||||
/* eslint-disable */
|
||||
/* Blob.js
|
||||
* A Blob implementation.
|
||||
* 2014-05-27
|
||||
*
|
||||
* By Eli Grey, http://eligrey.com
|
||||
* By Devin Samarin, https://github.com/eboyjr
|
||||
* License: X11/MIT
|
||||
* See LICENSE.md
|
||||
*/
|
||||
|
||||
/*global self, unescape */
|
||||
/*jslint bitwise: true, regexp: true, confusion: true, es5: true, vars: true, white: true,
|
||||
plusplus: true */
|
||||
|
||||
/*! @source http://purl.eligrey.com/github/Blob.js/blob/master/Blob.js */
|
||||
|
||||
(function (view) {
|
||||
"use strict";
|
||||
|
||||
view.URL = view.URL || view.webkitURL;
|
||||
|
||||
if (view.Blob && view.URL) {
|
||||
try {
|
||||
new Blob;
|
||||
return;
|
||||
} catch (e) { }
|
||||
}
|
||||
|
||||
// Internally we use a BlobBuilder implementation to base Blob off of
|
||||
// in order to support older browsers that only have BlobBuilder
|
||||
var BlobBuilder = view.BlobBuilder || view.WebKitBlobBuilder || view.MozBlobBuilder || (function (view) {
|
||||
var
|
||||
get_class = function (object) {
|
||||
return Object.prototype.toString.call(object).match(/^\[object\s(.*)\]$/)[1];
|
||||
}
|
||||
, FakeBlobBuilder = function BlobBuilder () {
|
||||
this.data = [];
|
||||
}
|
||||
, FakeBlob = function Blob (data, type, encoding) {
|
||||
this.data = data;
|
||||
this.size = data.length;
|
||||
this.type = type;
|
||||
this.encoding = encoding;
|
||||
}
|
||||
, FBB_proto = FakeBlobBuilder.prototype
|
||||
, FB_proto = FakeBlob.prototype
|
||||
, FileReaderSync = view.FileReaderSync
|
||||
, FileException = function (type) {
|
||||
this.code = this[this.name = type];
|
||||
}
|
||||
, file_ex_codes = (
|
||||
"NOT_FOUND_ERR SECURITY_ERR ABORT_ERR NOT_READABLE_ERR ENCODING_ERR "
|
||||
+ "NO_MODIFICATION_ALLOWED_ERR INVALID_STATE_ERR SYNTAX_ERR"
|
||||
).split(" ")
|
||||
, file_ex_code = file_ex_codes.length
|
||||
, real_URL = view.URL || view.webkitURL || view
|
||||
, real_create_object_URL = real_URL.createObjectURL
|
||||
, real_revoke_object_URL = real_URL.revokeObjectURL
|
||||
, URL = real_URL
|
||||
, btoa = view.btoa
|
||||
, atob = view.atob
|
||||
|
||||
, ArrayBuffer = view.ArrayBuffer
|
||||
, Uint8Array = view.Uint8Array
|
||||
;
|
||||
FakeBlob.fake = FB_proto.fake = true;
|
||||
while (file_ex_code--) {
|
||||
FileException.prototype[file_ex_codes[file_ex_code]] = file_ex_code + 1;
|
||||
}
|
||||
if (!real_URL.createObjectURL) {
|
||||
URL = view.URL = {};
|
||||
}
|
||||
URL.createObjectURL = function (blob) {
|
||||
var
|
||||
type = blob.type
|
||||
, data_URI_header
|
||||
;
|
||||
if (type === null) {
|
||||
type = "application/octet-stream";
|
||||
}
|
||||
if (blob instanceof FakeBlob) {
|
||||
data_URI_header = "data:" + type;
|
||||
if (blob.encoding === "base64") {
|
||||
return data_URI_header + ";base64," + blob.data;
|
||||
} else if (blob.encoding === "URI") {
|
||||
return data_URI_header + "," + decodeURIComponent(blob.data);
|
||||
} if (btoa) {
|
||||
return data_URI_header + ";base64," + btoa(blob.data);
|
||||
} else {
|
||||
return data_URI_header + "," + encodeURIComponent(blob.data);
|
||||
}
|
||||
} else if (real_create_object_URL) {
|
||||
return real_create_object_URL.call(real_URL, blob);
|
||||
}
|
||||
};
|
||||
URL.revokeObjectURL = function (object_URL) {
|
||||
if (object_URL.substring(0, 5) !== "data:" && real_revoke_object_URL) {
|
||||
real_revoke_object_URL.call(real_URL, object_URL);
|
||||
}
|
||||
};
|
||||
FBB_proto.append = function (data/*, endings*/) {
|
||||
var bb = this.data;
|
||||
// decode data to a binary string
|
||||
if (Uint8Array && (data instanceof ArrayBuffer || data instanceof Uint8Array)) {
|
||||
var
|
||||
str = ""
|
||||
, buf = new Uint8Array(data)
|
||||
, i = 0
|
||||
, buf_len = buf.length
|
||||
;
|
||||
for (; i < buf_len; i++) {
|
||||
str += String.fromCharCode(buf[i]);
|
||||
}
|
||||
bb.push(str);
|
||||
} else if (get_class(data) === "Blob" || get_class(data) === "File") {
|
||||
if (FileReaderSync) {
|
||||
var fr = new FileReaderSync;
|
||||
bb.push(fr.readAsBinaryString(data));
|
||||
} else {
|
||||
// async FileReader won't work as BlobBuilder is sync
|
||||
throw new FileException("NOT_READABLE_ERR");
|
||||
}
|
||||
} else if (data instanceof FakeBlob) {
|
||||
if (data.encoding === "base64" && atob) {
|
||||
bb.push(atob(data.data));
|
||||
} else if (data.encoding === "URI") {
|
||||
bb.push(decodeURIComponent(data.data));
|
||||
} else if (data.encoding === "raw") {
|
||||
bb.push(data.data);
|
||||
}
|
||||
} else {
|
||||
if (typeof data !== "string") {
|
||||
data += ""; // convert unsupported types to strings
|
||||
}
|
||||
// decode UTF-16 to binary string
|
||||
bb.push(unescape(encodeURIComponent(data)));
|
||||
}
|
||||
};
|
||||
FBB_proto.getBlob = function (type) {
|
||||
if (!arguments.length) {
|
||||
type = null;
|
||||
}
|
||||
return new FakeBlob(this.data.join(""), type, "raw");
|
||||
};
|
||||
FBB_proto.toString = function () {
|
||||
return "[object BlobBuilder]";
|
||||
};
|
||||
FB_proto.slice = function (start, end, type) {
|
||||
var args = arguments.length;
|
||||
if (args < 3) {
|
||||
type = null;
|
||||
}
|
||||
return new FakeBlob(
|
||||
this.data.slice(start, args > 1 ? end : this.data.length)
|
||||
, type
|
||||
, this.encoding
|
||||
);
|
||||
};
|
||||
FB_proto.toString = function () {
|
||||
return "[object Blob]";
|
||||
};
|
||||
FB_proto.close = function () {
|
||||
this.size = this.data.length = 0;
|
||||
};
|
||||
return FakeBlobBuilder;
|
||||
}(view));
|
||||
|
||||
view.Blob = function Blob (blobParts, options) {
|
||||
var type = options ? (options.type || "") : "";
|
||||
var builder = new BlobBuilder();
|
||||
if (blobParts) {
|
||||
for (var i = 0, len = blobParts.length; i < len; i++) {
|
||||
builder.append(blobParts[i]);
|
||||
}
|
||||
}
|
||||
return builder.getBlob(type);
|
||||
};
|
||||
}(typeof self !== "undefined" && self || typeof window !== "undefined" && window || this.content || this));
|
||||
175
src/Excel/Export2Excel.js
Normal file
@@ -0,0 +1,175 @@
|
||||
/* eslint-disable */
|
||||
require('script-loader!file-saver');
|
||||
// require('script-loader!@/Excel/Blob');
|
||||
require('./Blob');
|
||||
require('script-loader!xlsx/dist/xlsx.core.min');
|
||||
function generateArray (table) {
|
||||
var out = [];
|
||||
var rows = table.querySelectorAll('tr');
|
||||
var ranges = [];
|
||||
for (var R = 0; R < rows.length; ++R) {
|
||||
var outRow = [];
|
||||
var row = rows[R];
|
||||
var columns = row.querySelectorAll('td');
|
||||
for (var C = 0; C < columns.length; ++C) {
|
||||
var cell = columns[C];
|
||||
var colspan = cell.getAttribute('colspan');
|
||||
var rowspan = cell.getAttribute('rowspan');
|
||||
var cellValue = cell.innerText;
|
||||
if (cellValue !== "" && cellValue == +cellValue) cellValue = +cellValue;
|
||||
|
||||
//Skip ranges
|
||||
ranges.forEach(function (range) {
|
||||
if (R >= range.s.r && R <= range.e.r && outRow.length >= range.s.c && outRow.length <= range.e.c) {
|
||||
for (var i = 0; i <= range.e.c - range.s.c; ++i) outRow.push(null);
|
||||
}
|
||||
});
|
||||
|
||||
//Handle Row Span
|
||||
if (rowspan || colspan) {
|
||||
rowspan = rowspan || 1;
|
||||
colspan = colspan || 1;
|
||||
ranges.push({ s: { r: R, c: outRow.length }, e: { r: R + rowspan - 1, c: outRow.length + colspan - 1 } });
|
||||
}
|
||||
;
|
||||
|
||||
//Handle Value
|
||||
outRow.push(cellValue !== "" ? cellValue : null);
|
||||
|
||||
//Handle Colspan
|
||||
if (colspan) for (var k = 0; k < colspan - 1; ++k) outRow.push(null);
|
||||
}
|
||||
out.push(outRow);
|
||||
}
|
||||
return [out, ranges];
|
||||
};
|
||||
|
||||
function datenum (v, date1904) {
|
||||
if (date1904) v += 1462;
|
||||
var epoch = Date.parse(v);
|
||||
return (epoch - new Date(Date.UTC(1899, 11, 30))) / (24 * 60 * 60 * 1000);
|
||||
}
|
||||
|
||||
function sheet_from_array_of_arrays (data, opts) {
|
||||
var ws = {};
|
||||
var range = { s: { c: 10000000, r: 10000000 }, e: { c: 0, r: 0 } };
|
||||
for (var R = 0; R != data.length; ++R) {
|
||||
for (var C = 0; C != data[R].length; ++C) {
|
||||
if (range.s.r > R) range.s.r = R;
|
||||
if (range.s.c > C) range.s.c = C;
|
||||
if (range.e.r < R) range.e.r = R;
|
||||
if (range.e.c < C) range.e.c = C;
|
||||
var cell = { v: data[R][C] };
|
||||
if (cell.v == null) continue;
|
||||
var cell_ref = XLSX.utils.encode_cell({ c: C, r: R });
|
||||
|
||||
if (typeof cell.v === 'number') cell.t = 'n';
|
||||
else if (typeof cell.v === 'boolean') cell.t = 'b';
|
||||
else if (cell.v instanceof Date) {
|
||||
cell.t = 'n';
|
||||
cell.z = XLSX.SSF._table[14];
|
||||
cell.v = datenum(cell.v);
|
||||
}
|
||||
else cell.t = 's';
|
||||
|
||||
ws[cell_ref] = cell;
|
||||
}
|
||||
}
|
||||
if (range.s.c < 10000000) ws['!ref'] = XLSX.utils.encode_range(range);
|
||||
return ws;
|
||||
}
|
||||
|
||||
function Workbook () {
|
||||
if (!(this instanceof Workbook)) return new Workbook();
|
||||
this.SheetNames = [];
|
||||
this.Sheets = {};
|
||||
}
|
||||
|
||||
function s2ab (s) {
|
||||
var buf = new ArrayBuffer(s.length);
|
||||
var view = new Uint8Array(buf);
|
||||
for (var i = 0; i != s.length; ++i) view[i] = s.charCodeAt(i) & 0xFF;
|
||||
return buf;
|
||||
}
|
||||
|
||||
export function export_table_to_excel (id) {
|
||||
var theTable = document.getElementById(id);
|
||||
console.log('a')
|
||||
var oo = generateArray(theTable);
|
||||
var ranges = oo[1];
|
||||
|
||||
/* original data */
|
||||
var data = oo[0];
|
||||
var ws_name = "SheetJS";
|
||||
console.log(data);
|
||||
|
||||
var wb = new Workbook(), ws = sheet_from_array_of_arrays(data);
|
||||
|
||||
/* add ranges to worksheet */
|
||||
// ws['!cols'] = ['apple', 'banan'];
|
||||
ws['!merges'] = ranges;
|
||||
|
||||
/* add worksheet to workbook */
|
||||
wb.SheetNames.push(ws_name);
|
||||
wb.Sheets[ws_name] = ws;
|
||||
|
||||
var wbout = XLSX.write(wb, { bookType: 'xlsx', bookSST: false, type: 'binary' });
|
||||
|
||||
saveAs(new Blob([s2ab(wbout)], { type: "application/octet-stream" }), "test.xlsx")
|
||||
}
|
||||
|
||||
function formatJson (jsonData) {
|
||||
console.log(jsonData)
|
||||
}
|
||||
export function exportjsontoexcel (th, jsonData, defaultTitle, autoWidth = true) {
|
||||
|
||||
/* original data */
|
||||
|
||||
var data = jsonData;
|
||||
data.unshift(th);
|
||||
var ws_name = "SheetJS";
|
||||
|
||||
var wb = new Workbook(), ws = sheet_from_array_of_arrays(data);
|
||||
//================表格宽度自适应====================
|
||||
if (autoWidth) {
|
||||
/*设置worksheet每列的最大宽度*/
|
||||
const colWidth = data.map(row =>
|
||||
row.map(val => {
|
||||
/*先判断是否为null/undefined*/
|
||||
if (val == null || val == undefined || val == "") {
|
||||
return {
|
||||
wch: 10
|
||||
};
|
||||
} else if (val.toString().charCodeAt(0) > 255) {
|
||||
/*再判断是否为中文*/
|
||||
return {
|
||||
wch: val.toString().length * 2
|
||||
};
|
||||
} else {
|
||||
return {
|
||||
wch: val.toString().length * 1.4
|
||||
};
|
||||
}
|
||||
})
|
||||
);
|
||||
/*以主表第二行为初始值,因为我的第一行是表格标题,会比较长,所以以主表第二行为初始值*/
|
||||
let result = colWidth[1];
|
||||
for (let i = 1; i < colWidth.length; i++) {
|
||||
for (let j = 0; j < colWidth[i].length; j++) {
|
||||
if (result[j]["wch"] < colWidth[i][j]["wch"]) {
|
||||
result[j]["wch"] = colWidth[i][j]["wch"];
|
||||
}
|
||||
}
|
||||
}
|
||||
ws["!cols"] = result;
|
||||
}
|
||||
//====================表格宽度自适应-结束=================
|
||||
// 原文链接:https://blog.csdn.net/weixin_56290799/article/details/118086721
|
||||
/* add worksheet to workbook */
|
||||
wb.SheetNames.push(ws_name);
|
||||
wb.Sheets[ws_name] = ws;
|
||||
|
||||
var wbout = XLSX.write(wb, { bookType: 'xlsx', bookSST: false, type: 'binary' });
|
||||
var title = defaultTitle || '列表'
|
||||
saveAs(new Blob([s2ab(wbout)], { type: "application/octet-stream" }), title + ".xlsx")
|
||||
}
|
||||
83
src/api/consumer.js
Normal file
@@ -0,0 +1,83 @@
|
||||
import request from '@/utils/request'
|
||||
// ==========登录===========
|
||||
// 主体
|
||||
export function Login (data) {
|
||||
return request.post('/api.php?c=index&a=login', data)
|
||||
}
|
||||
// 登录
|
||||
export function LoginEnter (data) {
|
||||
return request.post('/api.php?c=index&a=confirm_login', data)
|
||||
}
|
||||
|
||||
// // 退出登录
|
||||
// export function LoginOut (data) {
|
||||
// return request.post('/api.php?c=index&a=logout', data)
|
||||
// }
|
||||
// 2023-05-09 新版四端合一 - 统一接口(退出)
|
||||
export function LoginOut (data) {
|
||||
return request.post('/common.php?c=member&a=logout', data)
|
||||
}
|
||||
|
||||
// 获取系统信息 - 设置icon 系统名称
|
||||
export function systemInfo (data) {
|
||||
return request.post('/api.php?c=index&a=system_info', data)
|
||||
}
|
||||
// 配置通知
|
||||
export function editstatusapi (data) {
|
||||
return request.post('/api.php?c=org_set&a=save_other', data)
|
||||
}
|
||||
// 获取左侧菜单权限
|
||||
export function LeftMenuList (data) {
|
||||
return request.post('/api.php?c=index&a=my_auth', data)
|
||||
}
|
||||
|
||||
// 发送验证码
|
||||
export function sendsms (data) {
|
||||
return request.post('/api.php?c=index&a=send_sms', data)
|
||||
}
|
||||
|
||||
// 手机号登录
|
||||
export function phoneLogin (data) {
|
||||
return request.post('/api.php?c=index&a=phone', data)
|
||||
}
|
||||
|
||||
// 注册账号
|
||||
export function register (data) {
|
||||
return request.post('/api.php?c=index&a=user_reg', data)
|
||||
}
|
||||
|
||||
// 天翼账号注册
|
||||
export function tianyiregister (data) {
|
||||
return request.post('/api.php?c=index&a=telecom', data)
|
||||
}
|
||||
|
||||
// 忘记密码
|
||||
export function forgots (data) {
|
||||
return request.post('/api.php?c=index&a=forget', data)
|
||||
}
|
||||
// ===============硬件管理-参数设置与预警列表===============================
|
||||
// 硬件参数设置
|
||||
export function Hardwareparametersetting (data) {
|
||||
return request.post('/api.php?c=org_set&a=edit', data)
|
||||
}
|
||||
|
||||
// 预警列表
|
||||
export function EquipmentList (data) {
|
||||
return request.post('/api.php?c=org_set&a=index', data)
|
||||
}
|
||||
|
||||
// 个人信息
|
||||
export function userInfo (data) {
|
||||
return request.post('/api.php?c=index&a=user_info', data)
|
||||
}
|
||||
|
||||
// 重置硬件预警状态
|
||||
export function hardwareReset (data) {
|
||||
return request.post('/api.php?c=org_set&a=reset', data)
|
||||
}
|
||||
|
||||
// ------- 交流社区 / 线上问诊 -------
|
||||
// 社区 / 问诊
|
||||
export function communityConsultation (data) {
|
||||
return request.post('/api.php?c=index&a=consultation', data)
|
||||
}
|
||||
92
src/api/insurance.js
Normal file
@@ -0,0 +1,92 @@
|
||||
import request from '@/utils/request'
|
||||
// ============== 保险管理 ================
|
||||
// 保险-列表
|
||||
export function insuranceList (data) {
|
||||
return request.post('/api.php?c=insurance_product&a=index', data)
|
||||
}
|
||||
|
||||
// 保险-详情
|
||||
export function insurancedetail (data) {
|
||||
return request.post('/api.php?c=insurance_product&a=details', data)
|
||||
}
|
||||
|
||||
// 保险-申请
|
||||
export function insuranceAdd (data) {
|
||||
return request.post('/api.php?c=insurance_process&a=add', data)
|
||||
}
|
||||
// ========保险进度======================
|
||||
// 保险-保险进度列表
|
||||
export function insuranceProcess (data) {
|
||||
return request.post('/api.php?c=insurance_process&a=index', data)
|
||||
}
|
||||
// 提交 - 支付凭证
|
||||
export function insurancePayment (data) {
|
||||
return request.post('/api.php?c=insurance_process&a=payment_edit', data)
|
||||
}
|
||||
|
||||
// 保险-绑定设备
|
||||
export function insuranceBinding (data) {
|
||||
return request.post('/api.php?c=insurance_process&a=binding_edit', data)
|
||||
}
|
||||
|
||||
// 保险-绑定设备详情
|
||||
export function bindingList (data) {
|
||||
return request.post('/api.php?c=insurance_process&a=details', data)
|
||||
}
|
||||
// ====保险合同==================================
|
||||
// 保险合同 - 列表
|
||||
export function insurancecontractList (data) {
|
||||
return request.post('/api.php?c=insurance_contract&a=index', data)
|
||||
}
|
||||
|
||||
// 保险合同- 详情
|
||||
export function insurancecontractInfo (data) {
|
||||
return request.post('/api.php?c=insurance_contract&a=details', data)
|
||||
}
|
||||
|
||||
// 理赔 - 申请
|
||||
export function setclaimsapply (data) {
|
||||
return request.post('/api.php?c=insurance_report&a=add', data)
|
||||
}
|
||||
// =====我的理赔==================================================
|
||||
// 理赔 - 列表
|
||||
export function Claimlist (data) {
|
||||
return request.post('/api.php?c=insurance_report&a=index', data)
|
||||
}
|
||||
|
||||
// 理赔 - 上传资料
|
||||
export function Uploaddata (data) {
|
||||
return request.post('/api.php?c=insurance_report&a=add_datas', data)
|
||||
}
|
||||
|
||||
// 理赔 - 详情
|
||||
export function ClaimlistDetails (data) {
|
||||
return request.post('/api.php?c=insurance_report&a=details', data)
|
||||
}
|
||||
|
||||
// ========== 手动录入保单 ==================
|
||||
// 新增保单录入
|
||||
export function manualEntryAdd (data) {
|
||||
return request.post('/api.php?c=insurance_contract&a=farm_add', data)
|
||||
}
|
||||
|
||||
// 编辑保单
|
||||
export function manualEntryEdit (data) {
|
||||
return request.post('/api.php?c=insurance_contract&a=farm_edit', data)
|
||||
}
|
||||
|
||||
// 删除保单
|
||||
export function manualEntryDel (data) {
|
||||
return request.post('/api.php?c=insurance_contract&a=farm_del', data)
|
||||
}
|
||||
|
||||
// -------------------------------
|
||||
// 初审编辑
|
||||
export function chushenEdit (data) {
|
||||
return request.post('/api.php?c=insurance_process&a=edit200', data)
|
||||
}
|
||||
|
||||
// 绑定设备编辑
|
||||
export function bindEdit (data) {
|
||||
return request.post('/api.php?c=insurance_process&a=edit600', data)
|
||||
}
|
||||
77
src/assets/css/common.less
Normal file
@@ -0,0 +1,77 @@
|
||||
// 公共的布局样式
|
||||
html,
|
||||
body,
|
||||
#app {
|
||||
height: 100%;
|
||||
}
|
||||
// 全局样式
|
||||
body .el-table th.gutter{
|
||||
display: table-cell!important;
|
||||
}
|
||||
// 分页
|
||||
.block {
|
||||
height: 60px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
// ====公共布局===============================================
|
||||
.common-box {
|
||||
min-height: calc(100vh - 84px);
|
||||
padding: 15px;
|
||||
box-sizing: border-box;
|
||||
border-radius: 6px;
|
||||
background-color: #fff;
|
||||
|
||||
.common-title {
|
||||
height: 56px;
|
||||
font-size: 15px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
border-bottom: 1px solid #f2f2f2;
|
||||
letter-spacing: 2px;
|
||||
}
|
||||
|
||||
.common-title-p {
|
||||
height: 56px;
|
||||
font-size: 17px;
|
||||
font-weight: bold;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
|
||||
.common-search {
|
||||
height: 60px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
|
||||
.common-search-left {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
.common-search-right {
|
||||
display: flex;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
// .common-body {}
|
||||
}
|
||||
|
||||
// 分页器total 靠左边
|
||||
.el-pagination__rightwrapper{
|
||||
float:left;
|
||||
}
|
||||
// ------------返回按钮 ------------------
|
||||
.p-icon {
|
||||
width: 20px;
|
||||
height: 20px;
|
||||
background-color: #909399;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
border-radius: 4px;
|
||||
color: #fff;
|
||||
font-size: 12px;
|
||||
}
|
||||
399
src/assets/css/reset.css
Normal file
@@ -0,0 +1,399 @@
|
||||
/**
|
||||
* Eric Meyer's Reset CSS v2.0 (http://meyerweb.com/eric/tools/css/reset/)
|
||||
* http://cssreset.com
|
||||
*/
|
||||
|
||||
html,
|
||||
body,
|
||||
div,
|
||||
span,
|
||||
applet,
|
||||
object,
|
||||
iframe,
|
||||
h1,
|
||||
h2,
|
||||
h3,
|
||||
h4,
|
||||
h5,
|
||||
h6,
|
||||
p,
|
||||
blockquote,
|
||||
pre,
|
||||
a,
|
||||
abbr,
|
||||
acronym,
|
||||
address,
|
||||
big,
|
||||
cite,
|
||||
code,
|
||||
del,
|
||||
dfn,
|
||||
em,
|
||||
img,
|
||||
ins,
|
||||
kbd,
|
||||
q,
|
||||
s,
|
||||
samp,
|
||||
small,
|
||||
strike,
|
||||
strong,
|
||||
sub,
|
||||
sup,
|
||||
tt,
|
||||
var,
|
||||
b,
|
||||
u,
|
||||
i,
|
||||
center,
|
||||
dl,
|
||||
dt,
|
||||
dd,
|
||||
ol,
|
||||
ul,
|
||||
li,
|
||||
fieldset,
|
||||
form,
|
||||
label,
|
||||
legend,
|
||||
table,
|
||||
caption,
|
||||
tbody,
|
||||
tfoot,
|
||||
thead,
|
||||
tr,
|
||||
th,
|
||||
td,
|
||||
article,
|
||||
aside,
|
||||
canvas,
|
||||
details,
|
||||
embed,
|
||||
figure,
|
||||
figcaption,
|
||||
footer,
|
||||
header,
|
||||
hgroup,
|
||||
menu,
|
||||
nav,
|
||||
output,
|
||||
ruby,
|
||||
section,
|
||||
summary,
|
||||
time,
|
||||
mark,
|
||||
audio,
|
||||
video {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
border: 0;
|
||||
/* font-size: 100%; */
|
||||
/* font: inherit; */
|
||||
/* font-weight: normal; */
|
||||
vertical-align: baseline;
|
||||
}
|
||||
|
||||
/* HTML5 display-role reset for older browsers 旧浏览器的HTML5显示角色重置 */
|
||||
article,
|
||||
aside,
|
||||
details,
|
||||
figcaption,
|
||||
figure,
|
||||
footer,
|
||||
header,
|
||||
hgroup,
|
||||
menu,
|
||||
nav,
|
||||
section {
|
||||
display: block;
|
||||
}
|
||||
|
||||
ol,
|
||||
ul,
|
||||
li {
|
||||
list-style: none;
|
||||
}
|
||||
|
||||
blockquote,
|
||||
q {
|
||||
quotes: none;
|
||||
}
|
||||
|
||||
blockquote:before,
|
||||
blockquote:after,
|
||||
q:before,
|
||||
q:after {
|
||||
content: '';
|
||||
content: none;
|
||||
}
|
||||
|
||||
table {
|
||||
border-collapse: collapse;
|
||||
border-spacing: 0;
|
||||
}
|
||||
|
||||
/* custom 隐藏旋转 div 元素的背面 */
|
||||
a {
|
||||
color: #7e8c8d;
|
||||
text-decoration: none;
|
||||
-webkit-backface-visibility: hidden;
|
||||
}
|
||||
|
||||
/* webkit滚动条样式 */
|
||||
/* ::-webkit-scrollbar {
|
||||
width: 8px;
|
||||
height: 8px;
|
||||
} */
|
||||
|
||||
::-webkit-scrollbar-track-piece {
|
||||
background-color: rgba(0, 0, 0, 0.2);
|
||||
-webkit-border-radius: 6px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:vertical {
|
||||
height: 5px;
|
||||
background-color: rgba(125, 125, 125, 0.7);
|
||||
-webkit-border-radius: 6px;
|
||||
}
|
||||
|
||||
::-webkit-scrollbar-thumb:horizontal {
|
||||
width: 5px;
|
||||
background-color: rgba(125, 125, 125, 0.7);
|
||||
-webkit-border-radius: 6px;
|
||||
}
|
||||
|
||||
html,
|
||||
body {
|
||||
width: 100%;
|
||||
/* font-family: 'Arial',
|
||||
'Microsoft YaHei',
|
||||
'黑体',
|
||||
'宋体',
|
||||
'微软雅黑',
|
||||
sans-serif; */
|
||||
/* font-family: "Helvetica Neue",
|
||||
Helvetica,
|
||||
"PingFang SC",
|
||||
"Hiragino Sans GB",
|
||||
"Microsoft YaHei",
|
||||
"微软雅黑",
|
||||
Arial,
|
||||
sans-serif; */
|
||||
font-family: 'Helvetica Neue', Helvetica,Arial, sans-serif;
|
||||
}
|
||||
|
||||
body {
|
||||
line-height: 1;
|
||||
-webkit-text-size-adjust: none;
|
||||
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
|
||||
}
|
||||
|
||||
html {
|
||||
overflow-y: scroll;
|
||||
}
|
||||
|
||||
/* 影藏滚动条的样式 */
|
||||
body::-webkit-scrollbar {
|
||||
width: 0px;
|
||||
height: 0px;
|
||||
}
|
||||
|
||||
/*清除浮动*/
|
||||
.clearfix:before,
|
||||
.clearfix:after {
|
||||
content: '';
|
||||
display: block;
|
||||
clear: both;
|
||||
}
|
||||
|
||||
.clearfix {
|
||||
*zoom: 1;
|
||||
}
|
||||
|
||||
/*隐藏*/
|
||||
.dn {
|
||||
display: none;
|
||||
}
|
||||
|
||||
/* 边框测试线 */
|
||||
.bd {
|
||||
border: 1px solid red;
|
||||
}
|
||||
|
||||
/* 字体样式 */
|
||||
.fz12px {
|
||||
font-size: 12px;
|
||||
}
|
||||
|
||||
.fz14px {
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.fz16px {
|
||||
font-size: 16px;
|
||||
}
|
||||
|
||||
.fz18px {
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
.fz20px {
|
||||
font-size: 20px;
|
||||
}
|
||||
|
||||
.fz22px {
|
||||
font-size: 22px;
|
||||
}
|
||||
|
||||
.fz23px {
|
||||
font-size: 23px;
|
||||
}
|
||||
|
||||
.fz24px {
|
||||
font-size: 24px;
|
||||
}
|
||||
|
||||
.fz26px {
|
||||
font-size: 26px;
|
||||
}
|
||||
|
||||
.fz28px {
|
||||
font-size: 28px;
|
||||
}
|
||||
|
||||
.fz30px {
|
||||
font-size: 30px;
|
||||
}
|
||||
|
||||
/* 左右外边距 */
|
||||
.mr5px {
|
||||
margin: 0 5px;
|
||||
}
|
||||
|
||||
.mr10px {
|
||||
margin: 0 10px;
|
||||
}
|
||||
|
||||
.mrr5px {
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.mrr10px {
|
||||
margin-right: 10px;
|
||||
}
|
||||
|
||||
.mrr15px {
|
||||
margin-right: 15px;
|
||||
}
|
||||
|
||||
.mrl5px {
|
||||
margin-left: 5px;
|
||||
}
|
||||
|
||||
.mrl10px {
|
||||
margin-left: 10px;
|
||||
}
|
||||
|
||||
.mrl12px {
|
||||
margin-left: 12px;
|
||||
}
|
||||
|
||||
.mrl15px {
|
||||
margin-left: 15px;
|
||||
}
|
||||
|
||||
.mrl18px {
|
||||
margin-left: 18px;
|
||||
}
|
||||
|
||||
.mrr100px {
|
||||
margin-right: 100px;
|
||||
}
|
||||
|
||||
/* 上下外边距 */
|
||||
.mt10px {
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
.mt20px {
|
||||
margin-top: 20px;
|
||||
}
|
||||
|
||||
.mb10px {
|
||||
margin-bottom: 10px;
|
||||
|
||||
}
|
||||
|
||||
.mb20px {
|
||||
margin-bottom: 20px;
|
||||
}
|
||||
|
||||
/* 颜色 */
|
||||
.col8d8d8d {
|
||||
color: #8d8d8d;
|
||||
}
|
||||
|
||||
.col-69c23c {
|
||||
color: #69c23c;
|
||||
}
|
||||
|
||||
.col-f5a327 {
|
||||
color: #f5a327;
|
||||
}
|
||||
|
||||
.col-fa5d62 {
|
||||
color: #fa5d62;
|
||||
}
|
||||
|
||||
.col-f56c6c {
|
||||
color: #f56c6c;
|
||||
}
|
||||
|
||||
.col-67c23a {
|
||||
color: #67c23a;
|
||||
}
|
||||
|
||||
/* feeding-tips页面 颜色 */
|
||||
.col-caf982_20 {
|
||||
background-color: rgba(202, 249, 130, 0.2);
|
||||
}
|
||||
|
||||
.col-70b603 {
|
||||
color: #70b603;
|
||||
}
|
||||
|
||||
.col-facd91_24 {
|
||||
background-color: rgba(250, 205, 145, 0.24);
|
||||
}
|
||||
|
||||
.col-f59a23 {
|
||||
color: #f59a23;
|
||||
}
|
||||
|
||||
.col-80ffff_09 {
|
||||
background-color: rgba(128, 255, 255, 0.09);
|
||||
}
|
||||
|
||||
.col-00bfbf {
|
||||
color: #00bfbf;
|
||||
}
|
||||
|
||||
.col-d9001b_09 {
|
||||
background-color: rgba(217, 0, 27, 0.09);
|
||||
}
|
||||
|
||||
.col-d9001b {
|
||||
color: #d9001b;
|
||||
}
|
||||
|
||||
.col-facd91_09 {
|
||||
background-color: rgba(250, 205, 145, 0.09);
|
||||
}
|
||||
|
||||
strong {
|
||||
font-weight: bold !important;
|
||||
}
|
||||
|
||||
em {
|
||||
font-style: italic !important;
|
||||
}
|
||||
159
src/assets/fonts/iconfont.css
Normal file
@@ -0,0 +1,159 @@
|
||||
@font-face {
|
||||
font-family: "iconfont"; /* Project id 3368735 */
|
||||
src: url('iconfont.woff2?t=1687687235044') format('woff2'),
|
||||
url('iconfont.woff?t=1687687235044') format('woff'),
|
||||
url('iconfont.ttf?t=1687687235044') format('truetype');
|
||||
}
|
||||
|
||||
.iconfont {
|
||||
font-family: "iconfont" !important;
|
||||
font-size: 16px;
|
||||
font-style: normal;
|
||||
-webkit-font-smoothing: antialiased;
|
||||
-moz-osx-font-smoothing: grayscale;
|
||||
}
|
||||
|
||||
.ai-yangniuxueyuan:before {
|
||||
content: "\e627";
|
||||
}
|
||||
|
||||
.ai-xianshangwenzhen:before {
|
||||
content: "\e61e";
|
||||
}
|
||||
|
||||
.ai-jiaoliushequ:before {
|
||||
content: "\e61c";
|
||||
}
|
||||
|
||||
.ai-hangqing-wulianwang:before {
|
||||
content: "\e618";
|
||||
}
|
||||
|
||||
.ai-jiaqin:before {
|
||||
content: "\e62f";
|
||||
}
|
||||
|
||||
.ai-a-jiankangguanli:before {
|
||||
content: "\e626";
|
||||
}
|
||||
|
||||
.ai-a-wenzhenyiyuan:before {
|
||||
content: "\e623";
|
||||
}
|
||||
|
||||
.ai-a-yangniuxueyuan:before {
|
||||
content: "\e624";
|
||||
}
|
||||
|
||||
.ai-a-jiaoliushequ:before {
|
||||
content: "\e625";
|
||||
}
|
||||
|
||||
.ai-fenwubaoshou:before {
|
||||
content: "\e61d";
|
||||
}
|
||||
|
||||
.ai-luguanli:before {
|
||||
content: "\e61b";
|
||||
}
|
||||
|
||||
.ai-baoxianguanli:before {
|
||||
content: "\e61a";
|
||||
}
|
||||
|
||||
.ai-shouye:before {
|
||||
content: "\e619";
|
||||
}
|
||||
|
||||
.ai-baoxiangongsi:before {
|
||||
content: "\e610";
|
||||
}
|
||||
|
||||
.ai-zhifu:before {
|
||||
content: "\e611";
|
||||
}
|
||||
|
||||
.ai-shangchuancailiao:before {
|
||||
content: "\e612";
|
||||
}
|
||||
|
||||
.ai-lipeishouli:before {
|
||||
content: "\e613";
|
||||
}
|
||||
|
||||
.ai-bangdingshebei:before {
|
||||
content: "\e614";
|
||||
}
|
||||
|
||||
.ai-heyanshebei:before {
|
||||
content: "\e615";
|
||||
}
|
||||
|
||||
.ai-tijiaobaodanshenqing:before {
|
||||
content: "\e616";
|
||||
}
|
||||
|
||||
.ai-baoxianbaoan:before {
|
||||
content: "\e617";
|
||||
}
|
||||
|
||||
.ai-dianzijianyi:before {
|
||||
content: "\e60f";
|
||||
}
|
||||
|
||||
.ai-jianyirenzheng:before {
|
||||
content: "\e60e";
|
||||
}
|
||||
|
||||
.ai-xipusuyuan:before {
|
||||
content: "\e60d";
|
||||
}
|
||||
|
||||
.ai-huanjingguanli:before {
|
||||
content: "\e60c";
|
||||
}
|
||||
|
||||
.ai-yangguanli:before {
|
||||
content: "\e60b";
|
||||
}
|
||||
|
||||
.ai-a-ai_huaban1fuben15:before {
|
||||
content: "\e601";
|
||||
}
|
||||
|
||||
.ai-a-ai_huaban1fuben14:before {
|
||||
content: "\e602";
|
||||
}
|
||||
|
||||
.ai-a-ai_huaban1fuben11:before {
|
||||
content: "\e603";
|
||||
}
|
||||
|
||||
.ai-a-ai_huaban1fuben10:before {
|
||||
content: "\e604";
|
||||
}
|
||||
|
||||
.ai-a-ai_huaban1fuben17:before {
|
||||
content: "\e605";
|
||||
}
|
||||
|
||||
.ai-a-ai_huaban1fuben16:before {
|
||||
content: "\e606";
|
||||
}
|
||||
|
||||
.ai-a-ai_huaban1fuben18:before {
|
||||
content: "\e607";
|
||||
}
|
||||
|
||||
.ai-a-ai_huaban1fuben12:before {
|
||||
content: "\e608";
|
||||
}
|
||||
|
||||
.ai-a-ai_huaban1fuben13:before {
|
||||
content: "\e609";
|
||||
}
|
||||
|
||||
.ai-a-ai_huaban1fuben19:before {
|
||||
content: "\e60a";
|
||||
}
|
||||
|
||||
BIN
src/assets/fonts/iconfont.ttf
Normal file
BIN
src/assets/fonts/iconfont.woff
Normal file
BIN
src/assets/fonts/iconfont.woff2
Normal file
BIN
src/assets/img/111.jpg
Normal file
|
After Width: | Height: | Size: 72 KiB |
BIN
src/assets/img/222.jpg
Normal file
|
After Width: | Height: | Size: 153 KiB |
BIN
src/assets/img/333.jpg
Normal file
|
After Width: | Height: | Size: 165 KiB |
BIN
src/assets/img/444.jpg
Normal file
|
After Width: | Height: | Size: 38 KiB |
BIN
src/assets/img/555.jpg
Normal file
|
After Width: | Height: | Size: 43 KiB |
BIN
src/assets/img/JYHQR.png
Normal file
|
After Width: | Height: | Size: 2.5 KiB |
BIN
src/assets/img/SCQR.png
Normal file
|
After Width: | Height: | Size: 2.6 KiB |
BIN
src/assets/img/error.png
Normal file
|
After Width: | Height: | Size: 1.8 KiB |
BIN
src/assets/img/loan-list/01.png
Normal file
|
After Width: | Height: | Size: 4.0 KiB |
BIN
src/assets/img/loan-list/02.png
Normal file
|
After Width: | Height: | Size: 3.1 KiB |
BIN
src/assets/img/loan-list/03.png
Normal file
|
After Width: | Height: | Size: 5.2 KiB |
BIN
src/assets/img/loan-list/04.png
Normal file
|
After Width: | Height: | Size: 3.7 KiB |
BIN
src/assets/img/normal.png
Normal file
|
After Width: | Height: | Size: 1.9 KiB |
BIN
src/assets/img/skyfont.png
Normal file
|
After Width: | Height: | Size: 12 KiB |
BIN
src/assets/img/tougao.jpg
Normal file
|
After Width: | Height: | Size: 34 KiB |
BIN
src/assets/img/wudingwei.png
Normal file
|
After Width: | Height: | Size: 34 KiB |
142
src/components/AletaiCity.js
Normal file
@@ -0,0 +1,142 @@
|
||||
export default {
|
||||
options: [{
|
||||
value: 'zhinan',
|
||||
label: '阿克吐木斯克牧场',
|
||||
children: [{
|
||||
value: 'shejiyuanze',
|
||||
label: '大哈拉苏生活区',
|
||||
}, {
|
||||
value: 'daohang',
|
||||
label: '莫因生活区',
|
||||
}, {
|
||||
value: 'shejiyuanze',
|
||||
label: '克依干库都克生活区',
|
||||
}, {
|
||||
value: 'daohang',
|
||||
label: '阿克吐木斯克生活区',
|
||||
}]
|
||||
}, {
|
||||
value: 'zujian',
|
||||
label: '阿拉哈克镇',
|
||||
children: [{
|
||||
value: 'basic',
|
||||
label: '托普乌英克村',
|
||||
}, {
|
||||
value: 'form',
|
||||
label: '阿克齐村',
|
||||
}, {
|
||||
value: 'data',
|
||||
label: '喀拉库木村',
|
||||
}, {
|
||||
value: 'notice',
|
||||
label: '铁斯克别依特村',
|
||||
}, {
|
||||
value: 'navigation',
|
||||
label: '塔尔浪村',
|
||||
}, {
|
||||
value: 'others',
|
||||
label: '赛克赛吾勒吐别克村',
|
||||
}, {
|
||||
value: 'form',
|
||||
label: '阿热勒村',
|
||||
}, {
|
||||
value: 'data',
|
||||
label: '比铁吾塔勒村',
|
||||
}, {
|
||||
value: 'notice',
|
||||
label: '喀拉塔勒村',
|
||||
}, {
|
||||
value: 'navigation',
|
||||
label: '窝依玛克村',
|
||||
}, {
|
||||
value: 'others',
|
||||
label: '努尔沼村',
|
||||
}, {
|
||||
value: 'navigation',
|
||||
label: '阔阔尔图村',
|
||||
}, {
|
||||
value: 'others',
|
||||
label: '阿拉哈克村',
|
||||
}]
|
||||
}, {
|
||||
value: 'zujian',
|
||||
label: '阿苇滩镇',
|
||||
children: [{
|
||||
value: 'basic',
|
||||
label: '库布西村',
|
||||
}, {
|
||||
value: 'form',
|
||||
label: '青格劳村',
|
||||
}, {
|
||||
value: 'data',
|
||||
label: '阔克塔勒村',
|
||||
}, {
|
||||
value: 'notice',
|
||||
label: '铁斯克别依特村',
|
||||
}, {
|
||||
value: 'navigation',
|
||||
label: '塔尔浪村',
|
||||
}, {
|
||||
value: 'others',
|
||||
label: '赛克赛吾勒吐别克村',
|
||||
}, {
|
||||
value: 'form',
|
||||
label: '阿热勒村',
|
||||
}, {
|
||||
value: 'data',
|
||||
label: '比铁吾塔勒村',
|
||||
}, {
|
||||
value: 'notice',
|
||||
label: '喀拉塔勒村',
|
||||
}, {
|
||||
value: 'navigation',
|
||||
label: '窝依玛克村',
|
||||
}, {
|
||||
value: 'others',
|
||||
label: '努尔沼村',
|
||||
}, {
|
||||
value: 'navigation',
|
||||
label: '阔阔尔图村',
|
||||
}, {
|
||||
value: 'others',
|
||||
label: '阿拉哈克村',
|
||||
}]
|
||||
}, ],
|
||||
options01: [{
|
||||
value: 'zhinan',
|
||||
label: '指南啊啊啊',
|
||||
children: [{
|
||||
value: 'shejiyuanze',
|
||||
label: '设计原则',
|
||||
}, {
|
||||
value: 'daohang',
|
||||
label: '导航',
|
||||
}]
|
||||
}, {
|
||||
value: 'zujian',
|
||||
label: '组件',
|
||||
children: [{
|
||||
value: 'basic',
|
||||
label: 'Basic',
|
||||
}, {
|
||||
value: 'form',
|
||||
label: 'Form',
|
||||
}, {
|
||||
value: 'data',
|
||||
label: 'Data',
|
||||
}, {
|
||||
value: 'notice',
|
||||
label: 'Notice',
|
||||
}, {
|
||||
value: 'navigation',
|
||||
label: 'Navigation',
|
||||
}, {
|
||||
value: 'others',
|
||||
label: 'Others',
|
||||
}]
|
||||
}, {
|
||||
value: 'ziyuan',
|
||||
label: '资源',
|
||||
}],
|
||||
|
||||
}
|
||||
202
src/components/TreeItem.vue
Normal file
@@ -0,0 +1,202 @@
|
||||
<template>
|
||||
<div class="card">
|
||||
<ul>
|
||||
<li v-for="(item, index) in treeData" :key="index">
|
||||
<div
|
||||
class="item"
|
||||
:class="{
|
||||
'line-left': index !== 0,
|
||||
'line-right': index != treeData.length - 1
|
||||
}"
|
||||
>
|
||||
<div
|
||||
class="item-name"
|
||||
:class="{
|
||||
'line-bottom': item.child && item.child.length > 0,
|
||||
'line-top': !treeFirst
|
||||
}"
|
||||
>
|
||||
<!-- <div v-if="!treeFirst" class="reduce" @click="delChild(index)">
|
||||
-
|
||||
</div> -->
|
||||
<div class="input-box">
|
||||
<p class="p1">{{ item.name }}</p>
|
||||
<el-input
|
||||
type="number"
|
||||
v-model="item.value"
|
||||
:disabled="item.disabled"
|
||||
></el-input>
|
||||
<!-- placeholder="请输入内容" -->
|
||||
</div>
|
||||
<!-- <div class="plus" @click="addChild(index)">+</div> -->
|
||||
</div>
|
||||
</div>
|
||||
<tree-item
|
||||
v-if="item.child && item.child.length > 0"
|
||||
:tree-data="item.child"
|
||||
/>
|
||||
</li>
|
||||
</ul>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: 'TreeItem',
|
||||
props: {
|
||||
treeData: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
},
|
||||
treeFirst: {
|
||||
// 判断是否第一个
|
||||
type: Boolean,
|
||||
default: false
|
||||
}
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
treeDatas: []
|
||||
}
|
||||
},
|
||||
|
||||
created() {
|
||||
// console.log(' this.treeData ', this.treeData)
|
||||
},
|
||||
methods: {
|
||||
// 添加子元素
|
||||
// addChild(index) {
|
||||
// if (this.treeData[index].child) {
|
||||
// this.treeData[index].child.push({ name: '1' })
|
||||
// } else {
|
||||
// this.$set(this.treeData[index], 'child', [{ name: '1' }])
|
||||
// }
|
||||
// },
|
||||
// // 删除子元素
|
||||
// delChild(index) {
|
||||
// this.treeData.splice(index, 1)
|
||||
// }
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
$line-length: 20px; //线长
|
||||
$spacing: 20px; //间距
|
||||
$extend: calc(#{$spacing} + 2px); //延长线
|
||||
|
||||
// 线样式
|
||||
@mixin line {
|
||||
content: '';
|
||||
display: block;
|
||||
width: 3px;
|
||||
height: $line-length;
|
||||
position: absolute;
|
||||
left: 0;
|
||||
right: 0;
|
||||
margin: auto;
|
||||
background: rgb(6, 183, 253);
|
||||
}
|
||||
// 加减号icon
|
||||
@mixin icon {
|
||||
position: absolute;
|
||||
border: solid 1px #666;
|
||||
border-radius: 100%;
|
||||
bottom: -5px;
|
||||
width: 12px;
|
||||
height: 12px;
|
||||
line-height: 10px;
|
||||
text-align: center;
|
||||
color: #666;
|
||||
z-index: 100;
|
||||
cursor: pointer;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
// opacity: 0;
|
||||
}
|
||||
|
||||
.card {
|
||||
ul {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
li {
|
||||
.item {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
position: relative;
|
||||
&-name {
|
||||
position: relative;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
width: 140px;
|
||||
// height: 50px;
|
||||
padding: 5px;
|
||||
margin: $spacing;
|
||||
// background: coral;
|
||||
// background: #f2f2f2;
|
||||
// color: #fff;
|
||||
.plus {
|
||||
@include icon();
|
||||
&:hover {
|
||||
opacity: 100%;
|
||||
}
|
||||
}
|
||||
.reduce {
|
||||
@include icon();
|
||||
top: -5px;
|
||||
&:hover {
|
||||
opacity: 100%;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
// 向下的线
|
||||
.line-bottom {
|
||||
&::after {
|
||||
@include line();
|
||||
bottom: -$line-length;
|
||||
}
|
||||
}
|
||||
// 向上的线
|
||||
.line-top {
|
||||
&::before {
|
||||
@include line();
|
||||
top: -$line-length;
|
||||
}
|
||||
}
|
||||
// 向左的线
|
||||
.line-left {
|
||||
&::after {
|
||||
@include line();
|
||||
width: calc(50% + #{$spacing});
|
||||
height: 3px;
|
||||
left: calc(-50% - #{$extend});
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
// 向右的线
|
||||
.line-right {
|
||||
&::before {
|
||||
@include line();
|
||||
width: calc(50% + #{$spacing});
|
||||
height: 3px;
|
||||
right: calc(-50% - #{$extend});
|
||||
top: 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
.input-box {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
.p1 {
|
||||
padding: 8px 0;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
450
src/components/V-distpicker/Distpicker.vue
Normal file
@@ -0,0 +1,450 @@
|
||||
<template>
|
||||
<div :class="wrapper">
|
||||
<template v-if="type !== 'mobile'">
|
||||
<label>
|
||||
<select @change="getCities" v-model="currentProvince" :disabled="disabled || provinceDisabled">
|
||||
<option :value="placeholders.province">{{ placeholders.province }}</option>
|
||||
<option
|
||||
v-for="(item, index) in provinces"
|
||||
:value="item"
|
||||
:key="index"
|
||||
>
|
||||
{{ item }}
|
||||
</option>
|
||||
</select>
|
||||
</label>
|
||||
<template v-if="!onlyProvince">
|
||||
<label>
|
||||
<select
|
||||
@change="getAreas"
|
||||
v-model="currentCity"
|
||||
:disabled="disabled || cityDisabled"
|
||||
>
|
||||
<option :value="placeholders.city">{{ placeholders.city }}</option>
|
||||
<option
|
||||
v-for="(item, index) in cities"
|
||||
:value="item"
|
||||
:key="index"
|
||||
>
|
||||
{{ item }}
|
||||
</option>
|
||||
</select>
|
||||
</label>
|
||||
<label>
|
||||
<select v-if="!hideArea" v-model="currentArea" :disabled="disabled || areaDisabled">
|
||||
<option :value="placeholders.area">{{ placeholders.area }}</option>
|
||||
<option v-for="(item, index) in areas "
|
||||
:value="item"
|
||||
:key="index">
|
||||
{{ item }}
|
||||
</option>
|
||||
</select>
|
||||
</label>
|
||||
</template>
|
||||
</template>
|
||||
<template v-else>
|
||||
<div :class="addressHeader">
|
||||
<ul>
|
||||
<li :class="{'active': tab === 1}" @click="resetProvince">{{ currentProvince && !staticPlaceholder ? currentProvince : placeholders.province }}</li>
|
||||
<template v-if="!onlyProvince">
|
||||
<li v-if="showCityTab" :class="{'active': tab === 2}" @click="resetCity">{{ currentCity && !staticPlaceholder ? currentCity : placeholders.city }}</li>
|
||||
<li v-if="showAreaTab && !hideArea" :class="{'active': tab === 3}">{{ currentArea && !staticPlaceholder ? currentArea : placeholders.area }}</li>
|
||||
</template>
|
||||
</ul>
|
||||
</div>
|
||||
<div :class="addressContainer">
|
||||
<ul v-if="tab === 1">
|
||||
<li v-for="(item, index) in provinces"
|
||||
:class="{'active': item === currentProvince}"
|
||||
@click="chooseProvince(item)"
|
||||
:key="index">
|
||||
{{ item }}
|
||||
</li>
|
||||
</ul>
|
||||
<template v-if="!onlyProvince">
|
||||
<ul v-if="tab === 2">
|
||||
<li v-for="(item, index) in cities"
|
||||
:class="{'active': item === currentCity}"
|
||||
@click="chooseCity(item)"
|
||||
:key="index">
|
||||
{{ item }}
|
||||
</li>
|
||||
</ul>
|
||||
<ul v-if="tab === 3 && !hideArea">
|
||||
<li v-for="(item, index) in areas"
|
||||
:class="{'active': item === currentArea}"
|
||||
@click="chooseArea(item)"
|
||||
:key="index">
|
||||
{{ item }}
|
||||
</li>
|
||||
</ul>
|
||||
</template>
|
||||
</div>
|
||||
</template>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import DISTRICTS from './districts';
|
||||
|
||||
const DEFAULT_CODE = 100000;
|
||||
|
||||
export default {
|
||||
name: 'v-distpicker',
|
||||
props: {
|
||||
province: { type: [String, Number], default: '' },
|
||||
city: { type: [String, Number], default: '' },
|
||||
area: { type: [String, Number], default: '' },
|
||||
type: { type: String, default: '' },
|
||||
hideArea: { type: Boolean, default: false },
|
||||
onlyProvince: { type: Boolean, default: false },
|
||||
staticPlaceholder: { type: Boolean, default: false },
|
||||
placeholders: {
|
||||
type: Object,
|
||||
default() {
|
||||
return {
|
||||
province: '省',
|
||||
city: '市',
|
||||
area: '区',
|
||||
}
|
||||
}
|
||||
},
|
||||
districts: {
|
||||
type: [Array, Object],
|
||||
default() {
|
||||
return DISTRICTS
|
||||
}
|
||||
},
|
||||
disabled: { type: Boolean, default: false },
|
||||
provinceDisabled: { type: Boolean, default: false },
|
||||
cityDisabled: { type: Boolean, default: false },
|
||||
areaDisabled: { type: Boolean, default: false },
|
||||
addressHeader: { type: String, default: 'address-header' },
|
||||
addressContainer: { type: String, default: 'address-container' },
|
||||
wrapper: { type: String, default: 'distpicker-address-wrapper' },
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
tab: 1,
|
||||
showCityTab: false,
|
||||
showAreaTab: false,
|
||||
provinces: [],
|
||||
cities: [],
|
||||
areas: [],
|
||||
currentProvince: this.determineType(this.province) || this.placeholders.province,
|
||||
currentCity: this.determineType(this.city) || this.placeholders.city,
|
||||
currentArea: this.determineType(this.area) || this.placeholders.area,
|
||||
}
|
||||
},
|
||||
created() {
|
||||
if (this.type !== 'mobile') {
|
||||
this.provinces = this.getDistricts()
|
||||
this.cities = this.province ? this.getDistricts(this.getAreaCode(this.determineType(this.province))) : []
|
||||
let directCity= this.isDirectCity(this.province,this.city)
|
||||
this.areas = this.city ? this.getDistricts(this.getAreaCode(this.determineType(this.city), directCity ? this.determineType(this.city) : this.area)) : []
|
||||
} else {
|
||||
if (this.area && !this.hideArea && !this.onlyProvince) {
|
||||
this.tab = 3
|
||||
this.showCityTab = true
|
||||
this.showAreaTab = true
|
||||
let directCity= this.isDirectCity(this.province,this.city)
|
||||
this.areas = this.getDistricts(this.getAreaCode(this.determineType(this.city), directCity ? this.determineType(this.city) : this.area))
|
||||
} else if (this.city && this.hideArea && !this.onlyProvince) {
|
||||
this.tab = 2
|
||||
this.showCityTab = true
|
||||
this.cities = this.getDistricts(this.getAreaCode(this.determineType(this.province)))
|
||||
} else {
|
||||
this.provinces = this.getDistricts()
|
||||
}
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
currentProvince(vaule) {
|
||||
this.$emit('province', this.setData(vaule, 'province'))
|
||||
|
||||
if (this.onlyProvince) {
|
||||
this.emit('selected')
|
||||
}
|
||||
},
|
||||
currentCity(value) {
|
||||
this.$emit('city', this.setData(value, 'city', this.currentProvince))
|
||||
|
||||
if (value != this.placeholders.city && this.hideArea) {
|
||||
this.emit('selected')
|
||||
}
|
||||
},
|
||||
currentArea(value) {
|
||||
this.$emit('area', this.setData(value, 'area', this.currentProvince, true))
|
||||
|
||||
if (value != this.placeholders.area) {
|
||||
this.emit('selected')
|
||||
}
|
||||
},
|
||||
province(value) {
|
||||
this.currentProvince = this.province || this.placeholders.province
|
||||
this.cities = this.determineValue('province', this.currentProvince, this.placeholders.province)
|
||||
},
|
||||
city(value) {
|
||||
this.currentCity = this.city || this.placeholders.city
|
||||
this.areas = this.determineValue('city', this.currentCity, this.placeholders.city, this.currentProvince)
|
||||
},
|
||||
area(value) {
|
||||
this.currentArea = this.area || this.placeholders.area
|
||||
},
|
||||
},
|
||||
methods: {
|
||||
setData(value, type, check = '', isArea = false) {
|
||||
let code
|
||||
|
||||
if (isArea) {
|
||||
code = this.getCodeByArea(value)
|
||||
} else {
|
||||
code = this.getAreaCode(value, check, type)
|
||||
}
|
||||
|
||||
return {
|
||||
code: code,
|
||||
value: value,
|
||||
}
|
||||
},
|
||||
getCodeByArea(value) {
|
||||
let code
|
||||
Object.values(this.areas).forEach((item, key) => {
|
||||
if (item === value) {
|
||||
code = Object.keys(this.areas)[key]
|
||||
}
|
||||
})
|
||||
return code
|
||||
},
|
||||
emit(name) {
|
||||
let data = {
|
||||
province: this.setData(this.currentProvince, 'province')
|
||||
}
|
||||
|
||||
if (!this.onlyProvince) {
|
||||
this.$set(data, 'city', this.setData(this.currentCity, 'city', this.currentProvince))
|
||||
}
|
||||
|
||||
if (!this.onlyProvince || this.hideArea) {
|
||||
this.$set(data, 'area', this.setData(this.currentArea, 'area', this.currentProvince, true))
|
||||
}
|
||||
|
||||
this.$emit(name, data)
|
||||
},
|
||||
getCities() {
|
||||
this.currentCity = this.placeholders.city
|
||||
this.currentArea = this.placeholders.area
|
||||
this.cities = this.determineValue('province', this.currentProvince, this.placeholders.province)
|
||||
this.cleanList('areas')
|
||||
if (this.cities.length === 0) {
|
||||
this.emit('selected')
|
||||
this.tab = 1
|
||||
this.showCityTab = false
|
||||
}
|
||||
},
|
||||
getAreas() {
|
||||
this.currentArea = this.placeholders.area
|
||||
this.areas = this.determineValue('city', this.currentCity, this.placeholders.city, this.currentProvince)
|
||||
if (this.areas.length === 0) {
|
||||
this.emit('selected')
|
||||
this.tab = 2
|
||||
this.showAreaTab = false
|
||||
}
|
||||
},
|
||||
resetProvince() {
|
||||
this.tab = 1
|
||||
this.provinces = this.getDistricts()
|
||||
this.showCityTab = false
|
||||
this.showAreaTab = false
|
||||
},
|
||||
resetCity() {
|
||||
this.tab = 2
|
||||
this.showCityTab = true
|
||||
this.showAreaTab = false
|
||||
this.getCities()
|
||||
},
|
||||
chooseProvince(name) {
|
||||
this.currentProvince = name
|
||||
if (this.onlyProvince) return
|
||||
this.tab = 2
|
||||
this.showCityTab = true
|
||||
this.showAreaTab = false
|
||||
this.getCities()
|
||||
},
|
||||
chooseCity(name) {
|
||||
this.currentCity = name
|
||||
if (this.hideArea) return
|
||||
this.tab = 3
|
||||
this.showCityTab = true
|
||||
this.showAreaTab = true
|
||||
this.getAreas()
|
||||
},
|
||||
chooseArea(name) {
|
||||
this.currentArea = name
|
||||
},
|
||||
getAreaCodeByPreCode(name, preCode) {
|
||||
let codes = []
|
||||
|
||||
for(let x in this.districts) {
|
||||
for(let y in this.districts[x]) {
|
||||
if(name === this.districts[x][y]) {
|
||||
codes.push(y)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (codes.length > 1) {
|
||||
let index
|
||||
codes.forEach((item, i) => {
|
||||
if (preCode.length === 2 && item.slice(0, 2) === preCode || preCode.length === 4 && item.slice(0, 4) !== preCode) {
|
||||
index = i
|
||||
}
|
||||
})
|
||||
|
||||
return codes[index]
|
||||
} else {
|
||||
return codes[0]
|
||||
}
|
||||
},
|
||||
getAreaCode(name, check = '', type = '') {
|
||||
for(let x in this.districts) {
|
||||
for(let y in this.districts[x]) {
|
||||
if(name === this.districts[x][y]) {
|
||||
if (check.length > 0) {
|
||||
let code = y
|
||||
|
||||
if (check) {
|
||||
let preCode = type === 'city' ? this.getAreaCode(this.currentProvince).slice(0, 2) : y.slice(0, 2)
|
||||
|
||||
code = this.getAreaCodeByPreCode(name, preCode)
|
||||
}
|
||||
|
||||
if (!code || y.slice(0, 2) !== code.slice(0, 2)) {
|
||||
continue
|
||||
} else {
|
||||
return code
|
||||
}
|
||||
} else {
|
||||
return y
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
getCodeValue(code) {
|
||||
for(let x in this.districts) {
|
||||
for(let y in this.districts[x]) {
|
||||
if(code === parseInt(y)) {
|
||||
return this.districts[x][y]
|
||||
}
|
||||
}
|
||||
}
|
||||
},
|
||||
getDistricts(code = DEFAULT_CODE) {
|
||||
return this.districts[code] || []
|
||||
},
|
||||
determineValue(type, currentValue, placeholderValue, check = '') {
|
||||
if(currentValue === placeholderValue) {
|
||||
return []
|
||||
} else {
|
||||
return this.getDistricts(this.getAreaCode(currentValue, check, type))
|
||||
}
|
||||
},
|
||||
determineType(value) {
|
||||
if(typeof value === 'number') {
|
||||
return this.getCodeValue(value)
|
||||
}
|
||||
|
||||
return value
|
||||
},
|
||||
cleanList(name) {
|
||||
this[name] = []
|
||||
},
|
||||
isDirectCity(province,city) {
|
||||
if( province && city ){
|
||||
return this.determineType(this.province) === this.determineType(this.city)
|
||||
}
|
||||
return false
|
||||
},
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less">
|
||||
.distpicker-address-wrapper {
|
||||
color: #9caebf;
|
||||
select {
|
||||
padding: .5rem .75rem;
|
||||
height: 40px;
|
||||
font-size: 1rem;
|
||||
line-height: 1.25;
|
||||
color: #464a4c;
|
||||
background-color: #fff;
|
||||
background-image: none;
|
||||
-webkit-background-clip: padding-box;
|
||||
background-clip: padding-box;
|
||||
border: 1px solid rgba(0,0,0,.15);
|
||||
border-radius: .25rem;
|
||||
-webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
|
||||
transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
|
||||
-o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
|
||||
transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
|
||||
transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
|
||||
|
||||
option {
|
||||
font-weight: normal;
|
||||
display: block;
|
||||
white-space: pre;
|
||||
min-height: 1.2em;
|
||||
padding: 0px 2px 1px;
|
||||
}
|
||||
}
|
||||
ul {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
|
||||
li {
|
||||
list-style: none;
|
||||
}
|
||||
}
|
||||
.address-header {
|
||||
background-color: #fff;
|
||||
|
||||
ul {
|
||||
display: flex;
|
||||
justify-content: space-around;
|
||||
align-items: stretch;
|
||||
|
||||
li {
|
||||
display: inline-block;
|
||||
padding: 10px 10px 7px;
|
||||
|
||||
&.active {
|
||||
border-bottom: #52697f solid 3px;
|
||||
color: #52697f;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.address-container {
|
||||
background-color: #fff;
|
||||
|
||||
ul {
|
||||
height: 100%;
|
||||
overflow: auto;
|
||||
|
||||
li {
|
||||
padding: 8px 10px;
|
||||
border-top: 1px solid #f6f6f6;
|
||||
|
||||
&.active {
|
||||
color: #52697f;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
.disabled-color{
|
||||
background: #f8f8f8;
|
||||
}
|
||||
</style>
|
||||
4600
src/components/V-distpicker/districts.js
Normal file
44
src/components/flexible.js
Normal file
@@ -0,0 +1,44 @@
|
||||
(function flexible(window, document) {
|
||||
var docEl = document.documentElement;
|
||||
var dpr = window.devicePixelRatio || 1;
|
||||
|
||||
// adjust body font size
|
||||
function setBodyFontSize() {
|
||||
if (document.body) {
|
||||
document.body.style.fontSize = 12 * dpr + "px";
|
||||
} else {
|
||||
document.addEventListener("DOMContentLoaded", setBodyFontSize);
|
||||
}
|
||||
}
|
||||
setBodyFontSize();
|
||||
|
||||
// 将屏幕划分为10等份
|
||||
// set 1rem = viewWidth / 10
|
||||
function setRemUnit() {
|
||||
var rem = docEl.clientWidth / 24;
|
||||
docEl.style.fontSize = rem + "px";
|
||||
}
|
||||
|
||||
setRemUnit();
|
||||
|
||||
// reset rem unit on page resize
|
||||
window.addEventListener("resize", setRemUnit);
|
||||
window.addEventListener("pageshow", function(e) {
|
||||
if (e.persisted) {
|
||||
setRemUnit();
|
||||
}
|
||||
});
|
||||
|
||||
// detect 0.5px supports
|
||||
if (dpr >= 2) {
|
||||
var fakeBody = document.createElement("body");
|
||||
var testElement = document.createElement("div");
|
||||
testElement.style.border = ".5px solid transparent";
|
||||
fakeBody.appendChild(testElement);
|
||||
docEl.appendChild(fakeBody);
|
||||
if (testElement.offsetHeight === 1) {
|
||||
docEl.classList.add("hairlines");
|
||||
}
|
||||
docEl.removeChild(fakeBody);
|
||||
}
|
||||
})(window, document);
|
||||
41
src/main.js
Normal file
@@ -0,0 +1,41 @@
|
||||
import Vue from 'vue'
|
||||
// 引入element-ui框架
|
||||
import ElementUI from 'element-ui'
|
||||
// import 'element-ui/lib/theme-chalk/index.css'
|
||||
import App from './App.vue'
|
||||
import router from './router'
|
||||
import store from './store'
|
||||
import BaiduMap from 'vue-baidu-map'
|
||||
|
||||
// 引入 echarts
|
||||
import * as echarts from 'echarts'
|
||||
// 引入时间
|
||||
import Moment from 'moment'
|
||||
import Distpicker from 'v-distpicker'
|
||||
// 引入重置样式
|
||||
import '@/assets/css/reset.css'
|
||||
// 引入公共样式
|
||||
import '@/assets/css/common.less'
|
||||
// 引入字体图标库
|
||||
import '../src/assets/fonts/iconfont.css'
|
||||
|
||||
// 全局定义时间戳过滤器
|
||||
Vue.filter('formatDate', function (value) {
|
||||
return Moment(value).format('YYYY-MM-DD')
|
||||
})
|
||||
Vue.use(BaiduMap, {
|
||||
// ak 是在百度地图开发者平台申请的密钥 详见 http://lbsyun.baidu.com/apiconsole/key */
|
||||
ak: 'P5rdFRhnd00BxQa0IUNR0tpOsxFl5xhs'
|
||||
})
|
||||
// main.js 把bus加到vue的原型上
|
||||
Vue.prototype.$bus = new Vue()
|
||||
Vue.use(ElementUI)
|
||||
Vue.component('v-distpicker', Distpicker)
|
||||
Vue.config.productionTip = false
|
||||
Vue.prototype.$echarts = echarts
|
||||
|
||||
new Vue({
|
||||
router,
|
||||
store,
|
||||
render: h => h(App)
|
||||
}).$mount('#app')
|
||||
55
src/router/index.js
Normal file
@@ -0,0 +1,55 @@
|
||||
import Vue from 'vue'
|
||||
import VueRouter from 'vue-router'
|
||||
import Layout from '../views/layout/index.vue'
|
||||
import Login from '../views/login/login.vue'
|
||||
import local from '../utils/local'
|
||||
|
||||
Vue.use(VueRouter)
|
||||
|
||||
const routes = [
|
||||
{
|
||||
path: '/login',
|
||||
component: Login,
|
||||
meta: { title: '登录', activeMenu: '/login' }
|
||||
},
|
||||
{
|
||||
path: '/',
|
||||
component: Layout,
|
||||
redirect: '/disease-resistance/disease-resistance',
|
||||
meta: { title: '首页', activeMenu: '/disease-resistance/disease-resistance' }
|
||||
},
|
||||
{
|
||||
// 遗传病风险
|
||||
path: '/disease-resistance',
|
||||
component: Layout,
|
||||
children: [
|
||||
{
|
||||
path: '/disease-resistance/disease-resistance',
|
||||
component: () =>
|
||||
import('../views/disease-resistance/disease-resistance.vue'),
|
||||
meta: { title: '遗传病风险', activeMenu: '/disease-resistance/disease-resistance' }
|
||||
}
|
||||
]
|
||||
}
|
||||
]
|
||||
|
||||
const router = new VueRouter({
|
||||
routes
|
||||
})
|
||||
// 前置路由守卫
|
||||
router.beforeEach((to, from, next) => {
|
||||
// to到哪里取 from 从哪里来 next 放行
|
||||
const token = local.get('token_sd')
|
||||
if (to.meta.title) { // 修改总标题
|
||||
document.title = '肉牛溯源系统' + '-' + to.meta.title // routes数组中--meta是关键
|
||||
}
|
||||
if (token) { // ok
|
||||
next()
|
||||
} else { // no
|
||||
if (to.path === '/login') {
|
||||
next()
|
||||
}
|
||||
next('/login')
|
||||
}
|
||||
})
|
||||
export default router
|
||||
41
src/store/index.js
Normal file
@@ -0,0 +1,41 @@
|
||||
import Vue from 'vue'
|
||||
import Vuex from 'vuex'
|
||||
import local from '../utils/local.js'
|
||||
Vue.use(Vuex)
|
||||
|
||||
const classInfo = {
|
||||
namespaced: true,
|
||||
state: {
|
||||
dataTable: [],
|
||||
batch: [] // 储存批量设备 - id
|
||||
},
|
||||
getters: {
|
||||
|
||||
},
|
||||
mutations: { // 修改
|
||||
saveClassInfo (state, list) { state.dataTable = list },
|
||||
// 储存批量设备 - id
|
||||
getBatch (state, Batch) {
|
||||
state.batch = Batch
|
||||
}
|
||||
},
|
||||
actions: {
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
export default new Vuex.Store({
|
||||
state: {
|
||||
},
|
||||
getters: {
|
||||
|
||||
},
|
||||
mutations: { // 修改
|
||||
|
||||
},
|
||||
actions: {
|
||||
},
|
||||
modules: {
|
||||
classInfo // 品系 , 品种 , 来源类型
|
||||
}
|
||||
})
|
||||
11
src/utils/local.js
Normal file
@@ -0,0 +1,11 @@
|
||||
export default {
|
||||
get (key) {
|
||||
return window.localStorage.getItem(key)
|
||||
}, // 取
|
||||
set (key, value) {
|
||||
window.localStorage.setItem(key, value)
|
||||
}, // 存
|
||||
clear () {
|
||||
window.localStorage.clear()
|
||||
} // 删除all
|
||||
}
|
||||
72
src/utils/request.js
Normal file
@@ -0,0 +1,72 @@
|
||||
// 1 引库
|
||||
import axios from 'axios'
|
||||
import qs from 'qs'
|
||||
import local from '@/utils/local' // 本地封装
|
||||
|
||||
// 2 添加配置
|
||||
axios.defaults.baseURL = ''
|
||||
axios.defaults.timeout = 50000
|
||||
// axios.defaults.responseType = 'application/x-www-form-urlencoded'
|
||||
axios.defaults.headers.common['Access-Control-Allow-Origin'] = '*' // 允许所有
|
||||
// 3 拦截器
|
||||
axios.interceptors.request.use(
|
||||
config => {
|
||||
if (local.get('token_sd')) {
|
||||
// config.headers.Authorization = local.get('token_sd')
|
||||
}
|
||||
return config
|
||||
},
|
||||
err => {
|
||||
return Promise.reject(err)
|
||||
})
|
||||
|
||||
// 响应拦截器
|
||||
axios.interceptors.response.use(
|
||||
response => {
|
||||
return response
|
||||
},
|
||||
err => {
|
||||
// if (response.status === 404) {
|
||||
// // 比如跳转到404
|
||||
// router.push({ name: 'login' })
|
||||
// }
|
||||
return Promise.reject(err)
|
||||
})
|
||||
|
||||
// 4 暴露方法
|
||||
const post = (url, data) => {
|
||||
return new Promise((resolve, reject) => {
|
||||
axios
|
||||
.post(url, qs.stringify(data))
|
||||
.then(res => {
|
||||
resolve(res.data)
|
||||
if (res.data.code === 0) {
|
||||
window.open('/home/login.html', '_self')
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
console.log(err)
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
const get = (url, params) => {
|
||||
return new Promise((resolve, reject) => {
|
||||
axios
|
||||
.get(url, { params })
|
||||
.then(res => {
|
||||
resolve(res.data)
|
||||
if (res.data.code === 0) {
|
||||
window.open('/home/login.html', '_self')
|
||||
}
|
||||
})
|
||||
.catch(err => {
|
||||
console.log(err)
|
||||
})
|
||||
})
|
||||
}
|
||||
|
||||
export default {
|
||||
post,
|
||||
get
|
||||
}
|
||||
175
src/views/disease-resistance/disease-resistance.vue
Normal file
@@ -0,0 +1,175 @@
|
||||
<template>
|
||||
<div class="container-box">
|
||||
<div class="search-box">
|
||||
<el-form
|
||||
:inline="true"
|
||||
ref="searchForm"
|
||||
:model="searchForm"
|
||||
class="demo-form-inline"
|
||||
label-width="auto"
|
||||
size="mini"
|
||||
>
|
||||
<el-form-item label="养殖场">
|
||||
<el-input
|
||||
v-model="searchForm.farm"
|
||||
placeholder="请输入养殖场"
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item label="标记编号">
|
||||
<el-input
|
||||
v-model="searchForm.number"
|
||||
placeholder="请输入标记编号"
|
||||
></el-input>
|
||||
</el-form-item>
|
||||
|
||||
<el-form-item>
|
||||
<el-button type="success" icon="el-icon-search" @click="searchClick"
|
||||
>搜索</el-button
|
||||
>
|
||||
<el-button type="warning" icon="el-icon-refresh" @click="resetClick"
|
||||
>重置</el-button
|
||||
>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
</div>
|
||||
<div class="list-box">
|
||||
<el-table
|
||||
:data="tableData"
|
||||
style="width: 100%"
|
||||
size="mini"
|
||||
border
|
||||
:header-cell-style="{ textAlign: 'center', color: '#606266' }"
|
||||
:cell-style="cellStyle"
|
||||
>
|
||||
<el-table-column prop="farm" label="养殖场"></el-table-column>
|
||||
<el-table-column prop="number" label="标记编号"></el-table-column>
|
||||
<el-table-column prop="age" label="月龄"></el-table-column>
|
||||
<el-table-column prop="result" label="监测结果"></el-table-column>
|
||||
<el-table-column label="详情">
|
||||
<template slot-scope="scope">
|
||||
<el-button
|
||||
size="mini"
|
||||
type="text"
|
||||
@click="detailClick(scope.row)"
|
||||
class="detail-btn"
|
||||
>查看</el-button
|
||||
>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
<div class="page-box">
|
||||
<el-pagination
|
||||
@size-change="handleSizeChange"
|
||||
@current-change="handleCurrentChange"
|
||||
:page-sizes="[20, 50, 100]"
|
||||
layout="total, sizes, prev, pager, next, jumper"
|
||||
:current-page="form.page"
|
||||
:page-size="form.pagesize"
|
||||
:total="total"
|
||||
>
|
||||
</el-pagination>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
searchForm: {
|
||||
farm: '',
|
||||
number: ''
|
||||
},
|
||||
tableData: [
|
||||
{
|
||||
id: 1,
|
||||
farm: '爱农养殖场',
|
||||
number: '82010000990',
|
||||
age: '6',
|
||||
result: '携带'
|
||||
},
|
||||
{
|
||||
id: 2,
|
||||
farm: '小新养殖场',
|
||||
number: '82010000991',
|
||||
age: '6',
|
||||
result: '未携带'
|
||||
}
|
||||
],
|
||||
form: {
|
||||
page: 1,
|
||||
pagesize: 20
|
||||
},
|
||||
total: 2
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
// 搜索
|
||||
searchClick() {},
|
||||
// 重置
|
||||
resetClick() {
|
||||
for (const key in this.searchForm) {
|
||||
this.searchForm[key] = ''
|
||||
}
|
||||
},
|
||||
// 条
|
||||
handleSizeChange(val) {
|
||||
this.form.pagesize = parseInt(val)
|
||||
},
|
||||
// 页
|
||||
handleCurrentChange(val) {
|
||||
this.form.page = parseInt(val)
|
||||
},
|
||||
// 当监测结果为 已携带 的状态,加上背景色,字体颜色
|
||||
cellStyle({ row, column, rowIndex, columnIndex }) {
|
||||
// 注意,这里返回的是一个对象
|
||||
if (row.result == '携带' && column.label == '监测结果') {
|
||||
return 'background:#d9001b;textAlign: center;color:#fff;'
|
||||
} else {
|
||||
return 'textAlign: center'
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.container-box {
|
||||
min-height: calc(100vh - 84px);
|
||||
padding: 15px;
|
||||
box-sizing: border-box;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
.search-box {
|
||||
background: #fff;
|
||||
border-radius: 6px;
|
||||
padding: 10px 15px;
|
||||
margin-bottom: 25px;
|
||||
}
|
||||
.list-box {
|
||||
flex: 1;
|
||||
background: #fff;
|
||||
border-radius: 6px;
|
||||
padding: 10px 15px;
|
||||
.detail-btn {
|
||||
color: #67c23a;
|
||||
}
|
||||
.page-box {
|
||||
margin-top: 10px;
|
||||
}
|
||||
}
|
||||
}
|
||||
.el-form-item {
|
||||
margin-bottom: 0px;
|
||||
margin-right: 20px;
|
||||
}
|
||||
// table
|
||||
/deep/.el-table th.el-table__cell {
|
||||
background-color: #f5f7fa;
|
||||
}
|
||||
/deep/ .cell {
|
||||
font-weight: normal;
|
||||
}
|
||||
</style>
|
||||
66
src/views/layout/index.vue
Normal file
@@ -0,0 +1,66 @@
|
||||
<template>
|
||||
<div class="layouts">
|
||||
<el-container style="height: 100%">
|
||||
<el-aside width="" style="background-color: #fff">
|
||||
<!-- 左侧 - 栏 -->
|
||||
<left-menu></left-menu>
|
||||
</el-aside>
|
||||
<el-container>
|
||||
<el-header style="text-align: right; font-size: 12px">
|
||||
<right-main-top></right-main-top>
|
||||
</el-header>
|
||||
<el-main style="background-color: #f2f2f2">
|
||||
<div class="main-box">
|
||||
<right-main></right-main>
|
||||
</div>
|
||||
</el-main>
|
||||
</el-container>
|
||||
</el-container>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import LeftMenu from './left-menu.vue'
|
||||
import rightMainTop from './right-main-top.vue'
|
||||
import rightMain from './right-main.vue'
|
||||
export default {
|
||||
components: {
|
||||
LeftMenu,
|
||||
rightMainTop,
|
||||
rightMain
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
.layouts {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
.el-main {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
padding: 0px;
|
||||
box-sizing: border-box;
|
||||
.main-box {
|
||||
flex: 1;
|
||||
margin: 10px;
|
||||
border-radius: 6px !important;
|
||||
}
|
||||
}
|
||||
/* 影藏滚动条的样式 */
|
||||
body::-webkit-scrollbar {
|
||||
width: 0px;
|
||||
height: 0px;
|
||||
}
|
||||
.el-aside {
|
||||
height: 100vh;
|
||||
background-color: #ffffff;
|
||||
overflow-y: auto;
|
||||
-ms-overflow-style: none; /* Edge */
|
||||
scrollbar-width: none; /* Firefox */
|
||||
&::-webkit-scrollbar {
|
||||
display: none; /* WebKit */
|
||||
}
|
||||
}
|
||||
</style>
|
||||
131
src/views/layout/left-menu.vue
Normal file
@@ -0,0 +1,131 @@
|
||||
<template>
|
||||
<div id="left-menu">
|
||||
<div class="logo">
|
||||
<div
|
||||
v-if="!isCollapse"
|
||||
class="logo-box01"
|
||||
:style="{ width: !isCollapse ? '220px' : 'auto' }"
|
||||
>
|
||||
<span :title="system_name">{{ system_name || '' }}</span>
|
||||
</div>
|
||||
<el-image
|
||||
class="el-img-box"
|
||||
v-else
|
||||
style="height: 72px; width: 80px"
|
||||
src="https://smart-1251449951.cos.ap-guangzhou.myqcloud.com/youpin/20240724/xl34jq31yvdzd73b5im9.png"
|
||||
fit="cover"
|
||||
></el-image>
|
||||
</div>
|
||||
<el-menu
|
||||
class="el-menu-vertical-demo"
|
||||
:collapse="isCollapse"
|
||||
:router="true"
|
||||
:default-active="activeIndex"
|
||||
:unique-opened="true"
|
||||
>
|
||||
<el-menu-item index="/disease-resistance/disease-resistance">
|
||||
<i class="el-icon-orange"></i>
|
||||
<span slot="title">遗传病风险</span>
|
||||
</el-menu-item>
|
||||
</el-menu>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
activeIndex: '/',
|
||||
isCollapse: false,
|
||||
system_name: '肉牛溯源系统',
|
||||
logo: '',
|
||||
index: 0,
|
||||
menuList: [], // 菜单权限列表
|
||||
type: '', // 1 交流社区, 2线上问诊
|
||||
zhanghao: '',
|
||||
token_xs: '',
|
||||
othersData: {},
|
||||
activeStatus: ''
|
||||
}
|
||||
},
|
||||
watch: {
|
||||
// 监听路由
|
||||
'$route.path': {
|
||||
handler(routePath) {
|
||||
this.initMenuActive(routePath)
|
||||
},
|
||||
immediate: true
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.$bus.$on('show', (e) => {
|
||||
this.getShow(e)
|
||||
})
|
||||
},
|
||||
methods: {
|
||||
initMenuActive(routePath) {
|
||||
this.activeIndex = routePath
|
||||
},
|
||||
getShow(e) {
|
||||
this.isCollapse = e
|
||||
}
|
||||
},
|
||||
destroyed() {
|
||||
this.bus.$off('show')
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
#left-menu {
|
||||
height: 100%;
|
||||
|
||||
.logo {
|
||||
max-width: 220px;
|
||||
height: 80px;
|
||||
color: #fff;
|
||||
font-size: 25px;
|
||||
font-weight: bold;
|
||||
letter-spacing: 3px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: center;
|
||||
background-color: #5aad00;
|
||||
|
||||
.logo-box01 {
|
||||
cursor: pointer;
|
||||
white-space: nowrap;
|
||||
overflow: hidden;
|
||||
text-overflow: ellipsis;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.el-img-box {
|
||||
padding: 5px;
|
||||
box-sizing: border-box;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/deep/ .el-menu {
|
||||
border-right: 0;
|
||||
}
|
||||
|
||||
/deep/.el-menu-item-group__title {
|
||||
padding: 0;
|
||||
}
|
||||
|
||||
.icon {
|
||||
vertical-align: middle;
|
||||
font-size: 23px;
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.home-icons {
|
||||
margin-right: 5px;
|
||||
}
|
||||
|
||||
.active {
|
||||
color: #409eff;
|
||||
}
|
||||
</style>
|
||||
187
src/views/layout/right-main-top.vue
Normal file
@@ -0,0 +1,187 @@
|
||||
<template>
|
||||
<div id="nav-box">
|
||||
<div class="nav-left">
|
||||
<i class="icon el-icon-s-fold" @click="show(true)" v-if="!flag"></i>
|
||||
<i class="icon el-icon-s-unfold" @click="show(false)" v-else></i>
|
||||
</div>
|
||||
<div class="nav-right">
|
||||
<p class="mrr10px p-top fz16px mrl10px">
|
||||
<span
|
||||
style="color: #606266; vertical-align: middle"
|
||||
class="el-icon-user fz18px mrr5px"
|
||||
></span>
|
||||
<span style="color: #333">admin</span>
|
||||
</p>
|
||||
<p class="fz14px out" @click="out">
|
||||
<el-tag type="info" size="mini" effect="plain">退出平台</el-tag>
|
||||
</p>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import local from '../../utils/local'
|
||||
import { LoginOut, LoginEnter } from '../../api/consumer'
|
||||
// import { farmswitch } from '../../api/systemSet'
|
||||
export default {
|
||||
data() {
|
||||
return {
|
||||
value: '',
|
||||
flag: false,
|
||||
zhanghao: '',
|
||||
options: [],
|
||||
farm_name: '', // 养殖场
|
||||
object: {}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getUserInfo()
|
||||
this.farm_name = local.get('farm_name')
|
||||
},
|
||||
methods: {
|
||||
// 大屏按钮
|
||||
screenClick() {
|
||||
window.open(
|
||||
'https://datav.aliyuncs.com/share/page/3c006051da485e266d41ca59e4ec36bb',
|
||||
'_blank'
|
||||
)
|
||||
},
|
||||
shopClick() {
|
||||
window.open(
|
||||
'https://datav.aliyuncs.com/share/page/d8ff7d8044e930c7a12cdaa0591c04db',
|
||||
'_blank'
|
||||
)
|
||||
},
|
||||
// 显示 - 账号
|
||||
getUserInfo() {
|
||||
this.zhanghao = local.get('account_sds')
|
||||
},
|
||||
show(flag) {
|
||||
this.flag = flag
|
||||
this.$bus.$emit('show', flag)
|
||||
},
|
||||
// 退出
|
||||
out() {
|
||||
this.$confirm('退出登录, 是否继续?', '提示', {
|
||||
title: '退出登录',
|
||||
confirmButtonText: '确定',
|
||||
cancelButtonText: '取消',
|
||||
type: 'info'
|
||||
})
|
||||
.then(async () => {
|
||||
this.$message({
|
||||
message: '退出成功!',
|
||||
type: 'success'
|
||||
})
|
||||
local.set('farm_name', '')
|
||||
local.set('token_sd', '')
|
||||
local.set('account_sds', '')
|
||||
setTimeout(() => {
|
||||
this.$router.push('/login')
|
||||
}, 500)
|
||||
// const res = await LoginOut({
|
||||
// token: local.get('token_sd')
|
||||
// })
|
||||
// if (res.status === 1) {
|
||||
// this.$message({
|
||||
// message: '退出成功!',
|
||||
// type: 'success'
|
||||
// })
|
||||
// local.set('farm_name', '')
|
||||
// local.set('token_sd', '')
|
||||
// local.set('account_sds', '')
|
||||
// setTimeout(() => {
|
||||
// this.$router.push('/login')
|
||||
// }, 500)
|
||||
// } else {
|
||||
// this.$message.error(res.msg)
|
||||
// }
|
||||
})
|
||||
.catch(() => {
|
||||
this.$message({
|
||||
type: 'info',
|
||||
message: '已取消'
|
||||
})
|
||||
})
|
||||
},
|
||||
// true - 出现
|
||||
visiblechange(e) {
|
||||
if (e === true) {
|
||||
this.getfarmswitch()
|
||||
}
|
||||
},
|
||||
// 切换养殖场 - 列表
|
||||
async getfarmswitch() {
|
||||
const res = await farmswitch({
|
||||
token: local.get('token_sd')
|
||||
})
|
||||
if (res.status === 1) {
|
||||
this.options = res.data
|
||||
} else {
|
||||
this.$message.error(res.msg)
|
||||
}
|
||||
},
|
||||
change(e) {
|
||||
this.options.forEach((item) => {
|
||||
if (e === item.org_name) {
|
||||
this.object = item
|
||||
}
|
||||
})
|
||||
this.getLoginEnter()
|
||||
},
|
||||
// 养殖 - 切换
|
||||
async getLoginEnter() {
|
||||
const res = await LoginEnter({
|
||||
id: this.object.id,
|
||||
uid: this.object.uid,
|
||||
cate: this.object.cate,
|
||||
org_id: this.object.org_id
|
||||
})
|
||||
if (res.status === 1) {
|
||||
this.$message({
|
||||
type: 'success',
|
||||
message: '已切换'
|
||||
})
|
||||
var token = res.data.token // 暂时
|
||||
// 存储
|
||||
local.set('token_sd', token)
|
||||
local.set('farm_name', this.farm_name)
|
||||
location.reload()
|
||||
} else {
|
||||
this.$message.error(res.msg)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
#nav-box {
|
||||
height: 100%;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
justify-content: space-between;
|
||||
.nav-left {
|
||||
.icon {
|
||||
font-size: 26px;
|
||||
color: #606060;
|
||||
}
|
||||
}
|
||||
.nav-right {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
.p-top {
|
||||
color: #606060;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
}
|
||||
.out {
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
}
|
||||
// 按钮 - 可视化
|
||||
.el-tag {
|
||||
cursor: pointer;
|
||||
}
|
||||
</style>
|
||||
15
src/views/layout/right-main.vue
Normal file
@@ -0,0 +1,15 @@
|
||||
<template>
|
||||
<div id="right-main">
|
||||
<router-view></router-view>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
#right-main {
|
||||
height: 100%;
|
||||
}
|
||||
</style>
|
||||
15
src/views/link/community.vue
Normal file
@@ -0,0 +1,15 @@
|
||||
<template>
|
||||
<div>
|
||||
<iframe src="" frameborder="0"></iframe>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
|
||||
}
|
||||
</script>
|
||||
|
||||
<style lang="less" scoped>
|
||||
|
||||
</style>
|
||||
802
src/views/login/login.vue
Normal file
101
vue.config.js
Normal file
@@ -0,0 +1,101 @@
|
||||
const TerserPlugin = require("terser-webpack-plugin");
|
||||
const CompressionWebpackPlugin = require('compression-webpack-plugin')
|
||||
const IS_PRODUCTION = process.env.NODE_ENV === 'production'
|
||||
// var target = 'http://www.zqaiotagro.cn/' // 新版 - 线下(开发环境默认)
|
||||
//var target = 'http://farm.zqaiotagrodev.com/' // 新版 - 线下(开发环境默认)
|
||||
|
||||
var target = 'https://demo-farm.aiotagro.com' // 新版 - 线下(开发环境默认)
|
||||
|
||||
var plugins = []
|
||||
if (IS_PRODUCTION) {
|
||||
plugins = [
|
||||
new CompressionWebpackPlugin({
|
||||
// test: /\.(js|css|html)?$/i, // 压缩文件格式
|
||||
test: /\.(js|css)?$/i, // 压缩文件格式
|
||||
filename: '[path].gz[query]', // 压缩后的文件名
|
||||
algorithm: 'gzip', // 使用gzip压缩
|
||||
// 只有大小大于该值的资源会被处理。单位是 bytes。默认值是 0。
|
||||
threshold: 10240,
|
||||
minRatio: 0.8, // 压缩率小于1才会压缩
|
||||
deleteOriginalAssets: true // 是否删除原资源
|
||||
})
|
||||
]
|
||||
// target = 'https://zhaqi.xinniuyun.com' // 新版 - 线上(生产环境)
|
||||
target = 'https://demo-zq.aiotagro.com'
|
||||
}
|
||||
const cdn = {
|
||||
// 忽略第三方库
|
||||
externals: {
|
||||
'vue': 'Vue',
|
||||
'element-ui': 'ELEMENT',
|
||||
'vue-router': 'VueRouter',
|
||||
'vuex': 'Vuex',
|
||||
'axios': 'axios',
|
||||
'moment': 'moment',
|
||||
'jquery': '$'
|
||||
// 'v-distpicker': 'VDistpicker'
|
||||
},
|
||||
// CDN
|
||||
js: [
|
||||
'https://unpkg.zhimg.com/vue@2.6.11/dist/vue.js',
|
||||
'https://unpkg.zhimg.com/element-ui@2.15.6/lib/index.js',
|
||||
'https://unpkg.zhimg.com/vue-router@3.2.0/dist/vue-router.js',
|
||||
'https://unpkg.zhimg.com/vuex@3.4.0/dist/vuex.js',
|
||||
'https://unpkg.zhimg.com/axios@0.26.1/dist/axios.min.js',
|
||||
'https://unpkg.zhimg.com/moment@2.29.2/moment.js',
|
||||
'https://unpkg.zhimg.com/jquery@3.6.0/dist/jquery.min.js'
|
||||
// 'https://unpkg.com/v-distpicker@1.2.13/dist/v-distpicker.js',
|
||||
// 'https://code.jquery.com/jquery-3.6.0.min.js'
|
||||
],
|
||||
|
||||
css: ["https://unpkg.zhimg.com/element-ui@2.15.6/lib/theme-chalk/index.css"],
|
||||
}
|
||||
module.exports = {
|
||||
assetsDir: 'assets',
|
||||
productionSourceMap: false,
|
||||
configureWebpack: {
|
||||
plugins: plugins,
|
||||
optimization: {
|
||||
minimize: true,
|
||||
minimizer: [
|
||||
new TerserPlugin({
|
||||
parallel: true,
|
||||
terserOptions: {
|
||||
compress: {
|
||||
drop_console: true,
|
||||
drop_debugger: true,
|
||||
pure_funcs: ["console.log", "console.error"],//配置移除指令,如console.log,alert等
|
||||
},
|
||||
format: {
|
||||
comments: false,
|
||||
},
|
||||
},
|
||||
extractComments: false,
|
||||
})
|
||||
]
|
||||
},
|
||||
},
|
||||
chainWebpack: config => {
|
||||
// if (IS_PRODUCTION) {
|
||||
config.plugin('html').tap(args => {
|
||||
args[0].title = '智慧畜牧平台'
|
||||
args[0].cdn = cdn
|
||||
return args
|
||||
})
|
||||
config.externals(cdn.externals)
|
||||
// }
|
||||
},
|
||||
// 配置请求
|
||||
devServer: {
|
||||
proxy: {
|
||||
'/': {
|
||||
target: target,
|
||||
changeOrigin: true,
|
||||
ws: true,
|
||||
pathRewrite: {
|
||||
'^/': ''
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||