提交代码
This commit is contained in:
guanj
5
.editorconfig
Normal file
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
|
||||
21
.gitignore
vendored
Normal file
21
.gitignore
vendored
Normal file
@@ -0,0 +1,21 @@
|
||||
.DS_Store
|
||||
node_modules
|
||||
/dist
|
||||
|
||||
# local env files
|
||||
.env.local
|
||||
.env.*.local
|
||||
|
||||
# Log files
|
||||
npm-debug.log*
|
||||
yarn-debug.log*
|
||||
yarn-error.log*
|
||||
|
||||
# Editor directories and files
|
||||
.idea
|
||||
.vscode
|
||||
*.suo
|
||||
*.ntvs*
|
||||
*.njsproj
|
||||
*.sln
|
||||
*.sw?
|
||||
17
README.md
Normal file
17
README.md
Normal file
@@ -0,0 +1,17 @@
|
||||
<h1 align="center">Manage-Desk</h1>
|
||||
|
||||
## Project setup
|
||||
```
|
||||
yarn install
|
||||
```
|
||||
|
||||
### Compiles and hot-reloads for development
|
||||
```
|
||||
yarn run dev
|
||||
```
|
||||
|
||||
### Compiles and minifies for production
|
||||
```
|
||||
yarn run build
|
||||
```
|
||||
|
||||
5
babel.config.js
Normal file
5
babel.config.js
Normal file
@@ -0,0 +1,5 @@
|
||||
module.exports = {
|
||||
presets: [
|
||||
'@vue/app'
|
||||
]
|
||||
}
|
||||
57
package.json
Normal file
57
package.json
Normal file
@@ -0,0 +1,57 @@
|
||||
{
|
||||
"name": "manage-desk",
|
||||
"version": "0.1.0",
|
||||
"private": true,
|
||||
"scripts": {
|
||||
"dev": "vue-cli-service serve",
|
||||
"build": "vue-cli-service build",
|
||||
"lint": "vue-cli-service lint"
|
||||
},
|
||||
"dependencies": {
|
||||
"@jiaminghi/data-view": "^2.3.8",
|
||||
"axios": "^1.6.7",
|
||||
"core-js": "^2.6.5",
|
||||
"echarts": "^4.9.0",
|
||||
"echarts-gl": "^1.1.0",
|
||||
"element-ui": "^2.15.14",
|
||||
"html2canvas": "^1.4.1",
|
||||
"jquery": "^3.7.1",
|
||||
"screenfull": "^5.0.2",
|
||||
"vue": "^2.6.10",
|
||||
"vue-router": "^3.6.5"
|
||||
},
|
||||
"devDependencies": {
|
||||
"@vue/cli-plugin-babel": "^3.11.0",
|
||||
"@vue/cli-plugin-eslint": "^3.11.0",
|
||||
"@vue/cli-service": "^3.11.0",
|
||||
"@vue/eslint-config-standard": "^4.0.0",
|
||||
"babel-eslint": "^10.0.1",
|
||||
"eslint": "^5.16.0",
|
||||
"eslint-plugin-vue": "^5.0.0",
|
||||
"less": "^3.0.4",
|
||||
"less-loader": "^5.0.0",
|
||||
"sass": "^1.62.0",
|
||||
"sass-loader": "^7.1.0",
|
||||
"vue-template-compiler": "^2.6.10"
|
||||
},
|
||||
"eslintConfig": {
|
||||
"root": true,
|
||||
"env": {
|
||||
"node": true
|
||||
},
|
||||
"extends": [
|
||||
"plugin:vue/essential",
|
||||
"@vue/standard"
|
||||
],
|
||||
"rules": {}
|
||||
},
|
||||
"postcss": {
|
||||
"plugins": {
|
||||
"autoprefixer": {}
|
||||
}
|
||||
},
|
||||
"browserslist": [
|
||||
"> 1%",
|
||||
"last 2 versions"
|
||||
]
|
||||
}
|
||||
BIN
public/favicon.ico
Normal file
BIN
public/favicon.ico
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 19 KiB |
17
public/index.html
Normal file
17
public/index.html
Normal file
@@ -0,0 +1,17 @@
|
||||
<!DOCTYPE html>
|
||||
<html lang="en">
|
||||
<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>大屏数据中心</title>
|
||||
</head>
|
||||
<body>
|
||||
<noscript>
|
||||
<strong>We're sorry but manage-desk 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>
|
||||
1
public/mapjson/上海.json
Normal file
1
public/mapjson/上海.json
Normal file
File diff suppressed because one or more lines are too long
26630
public/mapjson/中国.json
Normal file
26630
public/mapjson/中国.json
Normal file
File diff suppressed because it is too large
Load Diff
5323
public/mapjson/云南.json
Normal file
5323
public/mapjson/云南.json
Normal file
File diff suppressed because it is too large
Load Diff
26630
public/mapjson/全国.json
Normal file
26630
public/mapjson/全国.json
Normal file
File diff suppressed because it is too large
Load Diff
1705
public/mapjson/冀北.json
Normal file
1705
public/mapjson/冀北.json
Normal file
File diff suppressed because it is too large
Load Diff
1
public/mapjson/内蒙古.json
Normal file
1
public/mapjson/内蒙古.json
Normal file
File diff suppressed because one or more lines are too long
1
public/mapjson/北京.json
Normal file
1
public/mapjson/北京.json
Normal file
File diff suppressed because one or more lines are too long
1
public/mapjson/台湾.json
Normal file
1
public/mapjson/台湾.json
Normal file
@@ -0,0 +1 @@
|
||||
{"type":"FeatureCollection","features":[{"type":"Feature","properties":{"adcode":710000,"name":"台湾省","center":[121.509062,25.044332],"centroid":[120.971485,23.749452],"childrenNum":0,"level":"province","acroutes":[100000],"parent":{"adcode":100000}},"geometry":{"type":"MultiPolygon","coordinates":[[[[120.443558,22.441245],[120.517584,22.408536],[120.569903,22.361728],[120.640505,22.241347],[120.659209,22.15432],[120.662001,22.066983],[120.651464,22.033165],[120.667691,21.983168],[120.70157,21.927065],[120.743246,21.915569],[120.78155,21.923957],[120.85468,21.883333],[120.87291,21.897387],[120.866482,21.98436],[120.907315,22.033208],[120.904154,22.119757],[120.914955,22.302718],[120.981658,22.528305],[121.015009,22.584168],[121.033292,22.650725],[121.078498,22.669656],[121.170544,22.723133],[121.210481,22.770665],[121.237931,22.836327],[121.324708,22.945666],[121.354687,23.01006],[121.370388,23.084347],[121.409535,23.102669],[121.430294,23.137196],[121.415015,23.195973],[121.440358,23.272096],[121.479558,23.3223],[121.497788,23.419789],[121.521497,23.483198],[121.523078,23.538708],[121.587778,23.76102],[121.621604,23.92075],[121.659381,24.006893],[121.639992,24.064276],[121.643838,24.097713],[121.678085,24.133906],[121.689044,24.174401],[121.809172,24.339055],[121.826717,24.423579],[121.867498,24.478978],[121.885464,24.529677],[121.892524,24.617912],[121.862598,24.671515],[121.837993,24.76015],[121.845053,24.836269],[121.932883,24.938645],[122.012178,25.001469],[121.980776,25.03079],[121.947425,25.031955],[121.917077,25.137908],[121.842155,25.135332],[121.782407,25.160425],[121.750531,25.160716],[121.707327,25.191493],[121.700319,25.226913],[121.655324,25.241859],[121.623026,25.294694],[121.584986,25.308926],[121.535038,25.307515],[121.444415,25.270624],[121.413487,25.238912],[121.371864,25.159885],[121.319281,25.140691],[121.209322,25.127104],[121.133135,25.078728],[121.102102,25.075153],[121.024704,25.040479],[121.009688,24.993649],[120.960899,24.940227],[120.908475,24.852012],[120.892299,24.767526],[120.823753,24.688321],[120.762371,24.658335],[120.688661,24.600678],[120.64277,24.490172],[120.589187,24.432354],[120.546299,24.370413],[120.521009,24.312038],[120.470534,24.24259],[120.451461,24.182691],[120.392029,24.11824],[120.316158,23.984881],[120.278276,23.927798],[120.245768,23.840553],[120.175377,23.807385],[120.102773,23.700981],[120.094817,23.587466],[120.121741,23.504664],[120.107831,23.341264],[120.081434,23.29191],[120.018947,23.073115],[120.029537,23.048623],[120.131382,23.002118],[120.149138,22.896715],[120.200403,22.721101],[120.274272,22.560181],[120.297191,22.531315],[120.443558,22.441245]]],[[[124.542984,25.903911],[124.586346,25.913777],[124.572805,25.93974],[124.541825,25.931031],[124.542984,25.903911]]],[[[123.445286,25.725966],[123.472104,25.713024],[123.508933,25.723237],[123.514834,25.751226],[123.483063,25.768587],[123.444496,25.746514],[123.445286,25.725966]]],[[[119.64597,23.55091],[119.701081,23.550657],[119.678057,23.600041],[119.610089,23.603953],[119.594388,23.577245],[119.566306,23.584732],[119.562565,23.530377],[119.573788,23.505885],[119.609141,23.503864],[119.64597,23.55091]]],[[[123.667207,25.914066],[123.707092,25.916873],[123.678008,25.938667],[123.667207,25.914066]]],[[[119.506031,23.625567],[119.505241,23.575814],[119.472416,23.557136],[119.523207,23.563699],[119.525578,23.624895],[119.506031,23.625567]]],[[[119.49739,23.386683],[119.495125,23.350156],[119.516885,23.349903],[119.49739,23.386683]]],[[[119.557454,23.666474],[119.604083,23.616989],[119.615516,23.660925],[119.586485,23.675974],[119.557454,23.666474]]],[[[121.46823,22.676644],[121.476502,22.64166],[121.513541,22.631833],[121.5147,22.67639],[121.46823,22.676644]]],[[[121.510538,22.087185],[121.507693,22.048523],[121.534089,22.022146],[121.594522,21.995382],[121.604586,22.022699],[121.575028,22.037122],[121.575607,22.084421],[121.510538,22.087185]]],[[[122.097533,25.500168],[122.093581,25.47183],[122.124825,25.475932],[122.097533,25.500168]]],[[[119.421467,23.216684],[119.421309,23.18935],[119.453396,23.217697],[119.421467,23.216684]]],[[[120.355042,22.327259],[120.395454,22.342287],[120.383072,22.355573],[120.355042,22.327259]]]]}}]}
|
||||
6409
public/mapjson/吉林.json
Normal file
6409
public/mapjson/吉林.json
Normal file
File diff suppressed because it is too large
Load Diff
1
public/mapjson/唐山市.json
Normal file
1
public/mapjson/唐山市.json
Normal file
File diff suppressed because one or more lines are too long
7270
public/mapjson/四川.json
Normal file
7270
public/mapjson/四川.json
Normal file
File diff suppressed because it is too large
Load Diff
1
public/mapjson/天津.json
Normal file
1
public/mapjson/天津.json
Normal file
File diff suppressed because one or more lines are too long
1
public/mapjson/宁夏.json
Normal file
1
public/mapjson/宁夏.json
Normal file
File diff suppressed because one or more lines are too long
5474
public/mapjson/安徽.json
Normal file
5474
public/mapjson/安徽.json
Normal file
File diff suppressed because it is too large
Load Diff
7366
public/mapjson/山东.json
Normal file
7366
public/mapjson/山东.json
Normal file
File diff suppressed because it is too large
Load Diff
2587
public/mapjson/山西.json
Normal file
2587
public/mapjson/山西.json
Normal file
File diff suppressed because it is too large
Load Diff
8581
public/mapjson/广东.json
Normal file
8581
public/mapjson/广东.json
Normal file
File diff suppressed because it is too large
Load Diff
1
public/mapjson/广西.json
Normal file
1
public/mapjson/广西.json
Normal file
File diff suppressed because one or more lines are too long
2150
public/mapjson/廊坊市.json
Normal file
2150
public/mapjson/廊坊市.json
Normal file
File diff suppressed because it is too large
Load Diff
1
public/mapjson/张家口市.json
Normal file
1
public/mapjson/张家口市.json
Normal file
File diff suppressed because one or more lines are too long
1
public/mapjson/承德市.json
Normal file
1
public/mapjson/承德市.json
Normal file
File diff suppressed because one or more lines are too long
1
public/mapjson/新疆.json
Normal file
1
public/mapjson/新疆.json
Normal file
File diff suppressed because one or more lines are too long
4186
public/mapjson/江苏.json
Normal file
4186
public/mapjson/江苏.json
Normal file
File diff suppressed because it is too large
Load Diff
5264
public/mapjson/江西.json
Normal file
5264
public/mapjson/江西.json
Normal file
File diff suppressed because it is too large
Load Diff
2381
public/mapjson/河北.json
Normal file
2381
public/mapjson/河北.json
Normal file
File diff suppressed because it is too large
Load Diff
6633
public/mapjson/河南.json
Normal file
6633
public/mapjson/河南.json
Normal file
File diff suppressed because it is too large
Load Diff
11680
public/mapjson/测试.json
Normal file
11680
public/mapjson/测试.json
Normal file
File diff suppressed because it is too large
Load Diff
5786
public/mapjson/浙江.json
Normal file
5786
public/mapjson/浙江.json
Normal file
File diff suppressed because it is too large
Load Diff
866
public/mapjson/海南.json
Normal file
866
public/mapjson/海南.json
Normal file
@@ -0,0 +1,866 @@
|
||||
{
|
||||
"type": "FeatureCollection",
|
||||
"features": [{
|
||||
"type": "Feature",
|
||||
"properties": { "adcode": 460100, "name": "海口", "center": [110.33119, 20.031971], "centroid": [110.422966, 19.852113], "childrenNum": 4, "level": "city", "parent": { "adcode": 460000 }, "subFeatureIndex": 0, "acroutes": [100000, 460000] },
|
||||
"geometry": {
|
||||
"type": "MultiPolygon",
|
||||
"coordinates": [
|
||||
[
|
||||
[
|
||||
[110.106525, 20.026851],
|
||||
[110.161895, 19.977693],
|
||||
[110.143932, 19.889106],
|
||||
[110.186246, 19.864193],
|
||||
[110.228283, 19.753767],
|
||||
[110.208468, 19.716679],
|
||||
[110.222357, 19.67974],
|
||||
[110.262449, 19.687318],
|
||||
[110.314208, 19.697421],
|
||||
[110.340041, 19.720625],
|
||||
[110.393373, 19.698053],
|
||||
[110.372633, 19.654004],
|
||||
[110.401151, 19.606626],
|
||||
[110.455687, 19.574559],
|
||||
[110.486705, 19.593357],
|
||||
[110.519297, 19.563341],
|
||||
[110.540223, 19.535532],
|
||||
[110.611518, 19.526841],
|
||||
[110.641333, 19.549122],
|
||||
[110.636148, 19.593989],
|
||||
[110.672814, 19.647214],
|
||||
[110.623463, 19.664109],
|
||||
[110.623, 19.735461],
|
||||
[110.670314, 19.812776],
|
||||
[110.704665, 19.805992],
|
||||
[110.699573, 19.861512],
|
||||
[110.676147, 19.860092],
|
||||
[110.675314, 19.907868],
|
||||
[110.634666, 19.965401],
|
||||
[110.598, 19.98305],
|
||||
[110.526612, 20.075206],
|
||||
[110.495039, 20.077253],
|
||||
[110.387355, 20.11347],
|
||||
[110.318467, 20.109061],
|
||||
[110.293282, 20.059614],
|
||||
[110.24319, 20.077568],
|
||||
[110.144395, 20.074418],
|
||||
[110.106525, 20.026851]
|
||||
]
|
||||
]
|
||||
]
|
||||
}
|
||||
}, {
|
||||
"type": "Feature",
|
||||
"properties": { "adcode": 460200, "name": "三亚", "center": [109.508268, 18.247872], "centroid": [109.421656, 18.362263], "childrenNum": 4, "level": "city", "parent": { "adcode": 460000 }, "subFeatureIndex": 1, "acroutes": [100000, 460000] },
|
||||
"geometry": {
|
||||
"type": "MultiPolygon",
|
||||
"coordinates": [
|
||||
[
|
||||
[
|
||||
[108.932374, 18.335288],
|
||||
[108.956448, 18.307433],
|
||||
[109.006632, 18.323032],
|
||||
[109.108298, 18.323828],
|
||||
[109.138668, 18.267791],
|
||||
[109.174686, 18.260149],
|
||||
[109.28811, 18.264925],
|
||||
[109.355887, 18.214922],
|
||||
[109.441349, 18.199153],
|
||||
[109.4632, 18.177171],
|
||||
[109.527366, 18.169046],
|
||||
[109.561718, 18.143554],
|
||||
[109.63792, 18.171595],
|
||||
[109.72616, 18.177808],
|
||||
[109.749863, 18.19326],
|
||||
[109.783381, 18.337516],
|
||||
[109.805418, 18.347543],
|
||||
[109.785048, 18.426622],
|
||||
[109.809955, 18.459388],
|
||||
[109.781159, 18.51107],
|
||||
[109.725234, 18.493102],
|
||||
[109.710882, 18.426462],
|
||||
[109.665883, 18.391462],
|
||||
[109.539866, 18.396713],
|
||||
[109.515607, 18.429008],
|
||||
[109.536996, 18.490717],
|
||||
[109.535237, 18.53142],
|
||||
[109.506163, 18.551291],
|
||||
[109.423386, 18.574657],
|
||||
[109.405146, 18.623443],
|
||||
[109.332832, 18.575451],
|
||||
[109.313295, 18.517429],
|
||||
[109.246537, 18.558921],
|
||||
[109.203574, 18.553517],
|
||||
[109.185056, 18.507095],
|
||||
[109.195148, 18.469407],
|
||||
[109.072557, 18.452231],
|
||||
[109.015243, 18.422645],
|
||||
[108.932374, 18.335288]
|
||||
]
|
||||
]
|
||||
]
|
||||
}
|
||||
},
|
||||
|
||||
{
|
||||
"type": "Feature",
|
||||
"properties": { "adcode": 460400, "name": "儋州", "center": [109.576782, 19.517486], "centroid": [109.390059, 19.579264], "childrenNum": 0, "level": "city", "parent": { "adcode": 460000 }, "subFeatureIndex": 3, "acroutes": [100000, 460000] },
|
||||
"geometry": {
|
||||
"type": "MultiPolygon",
|
||||
"coordinates": [
|
||||
[
|
||||
[
|
||||
[108.928671, 19.524313],
|
||||
[108.939596, 19.497287],
|
||||
[108.982744, 19.477213],
|
||||
[108.997373, 19.431522],
|
||||
[109.04478, 19.430415],
|
||||
[109.051447, 19.487803],
|
||||
[109.117557, 19.46757],
|
||||
[109.13052, 19.479584],
|
||||
[109.178389, 19.399262],
|
||||
[109.26774, 19.376803],
|
||||
[109.318943, 19.398155],
|
||||
[109.384035, 19.355448],
|
||||
[109.424405, 19.354815],
|
||||
[109.457275, 19.39942],
|
||||
[109.483848, 19.406063],
|
||||
[109.506348, 19.359561],
|
||||
[109.468386, 19.301178],
|
||||
[109.541625, 19.311939],
|
||||
[109.587365, 19.243249],
|
||||
[109.611995, 19.252589],
|
||||
[109.634031, 19.20256],
|
||||
[109.673105, 19.207627],
|
||||
[109.686994, 19.178965],
|
||||
[109.706808, 19.22156],
|
||||
[109.697271, 19.271267],
|
||||
[109.713382, 19.309881],
|
||||
[109.700234, 19.349436],
|
||||
[109.647272, 19.357505],
|
||||
[109.646439, 19.402425],
|
||||
[109.737734, 19.407486],
|
||||
[109.751993, 19.416974],
|
||||
[109.728197, 19.496023],
|
||||
[109.760048, 19.528895],
|
||||
[109.7694, 19.578508],
|
||||
[109.709308, 19.57756],
|
||||
[109.659402, 19.611048],
|
||||
[109.664216, 19.629685],
|
||||
[109.582921, 19.637581],
|
||||
[109.557366, 19.697421],
|
||||
[109.599402, 19.730726],
|
||||
[109.569218, 19.797947],
|
||||
[109.564588, 19.854888],
|
||||
[109.498663, 19.873339],
|
||||
[109.410794, 19.895256],
|
||||
[109.349591, 19.898724],
|
||||
[109.30811, 19.9178],
|
||||
[109.264592, 19.90503],
|
||||
[109.255611, 19.867189],
|
||||
[109.218574, 19.855834],
|
||||
[109.15913, 19.790689],
|
||||
[109.169501, 19.736724],
|
||||
[109.147649, 19.704998],
|
||||
[109.093668, 19.689844],
|
||||
[109.048576, 19.620051],
|
||||
[108.993392, 19.586723],
|
||||
[108.928671, 19.524313]
|
||||
]
|
||||
]
|
||||
]
|
||||
}
|
||||
}, {
|
||||
"type": "Feature",
|
||||
"properties": { "adcode": 469001, "name": "五指山", "center": [109.516662, 18.776921], "centroid": [109.511892, 18.824035], "childrenNum": 0, "level": "city", "parent": { "adcode": 460000 }, "subFeatureIndex": 4, "acroutes": [100000, 460000] },
|
||||
"geometry": {
|
||||
"type": "MultiPolygon",
|
||||
"coordinates": [
|
||||
[
|
||||
[
|
||||
[109.715419, 18.833686],
|
||||
[109.699123, 18.889379],
|
||||
[109.730512, 18.913649],
|
||||
[109.676531, 18.925862],
|
||||
[109.601532, 18.910318],
|
||||
[109.55357, 18.946321],
|
||||
[109.524033, 19.030986],
|
||||
[109.468386, 19.032254],
|
||||
[109.456349, 18.995635],
|
||||
[109.424775, 18.990403],
|
||||
[109.367739, 18.936171],
|
||||
[109.34848, 18.946321],
|
||||
[109.32635, 18.926338],
|
||||
[109.343109, 18.877163],
|
||||
[109.374591, 18.853998],
|
||||
[109.353387, 18.812896],
|
||||
[109.356628, 18.710653],
|
||||
[109.398109, 18.671104],
|
||||
[109.408016, 18.627733],
|
||||
[109.448293, 18.655378],
|
||||
[109.48857, 18.64664],
|
||||
[109.539866, 18.659508],
|
||||
[109.533662, 18.694295],
|
||||
[109.576717, 18.714782],
|
||||
[109.619865, 18.678252],
|
||||
[109.641809, 18.72304],
|
||||
[109.703012, 18.721769],
|
||||
[109.681531, 18.786071],
|
||||
[109.689216, 18.830036],
|
||||
[109.715419, 18.833686]
|
||||
]
|
||||
]
|
||||
]
|
||||
}
|
||||
}, {
|
||||
"type": "Feature",
|
||||
"properties": { "adcode": 469002, "name": "琼海", "center": [110.466785, 19.246011], "centroid": [110.421962, 19.210377], "childrenNum": 0, "level": "city", "parent": { "adcode": 460000 }, "subFeatureIndex": 5, "acroutes": [100000, 460000] },
|
||||
"geometry": {
|
||||
"type": "MultiPolygon",
|
||||
"coordinates": [
|
||||
[
|
||||
[
|
||||
[110.610593, 19.084394],
|
||||
[110.619296, 19.152041],
|
||||
[110.676703, 19.286302],
|
||||
[110.706517, 19.320167],
|
||||
[110.730035, 19.378859],
|
||||
[110.633555, 19.391354],
|
||||
[110.604574, 19.350386],
|
||||
[110.584111, 19.367787],
|
||||
[110.581426, 19.419504],
|
||||
[110.546242, 19.46836],
|
||||
[110.504853, 19.46836],
|
||||
[110.484761, 19.443223],
|
||||
[110.450317, 19.447492],
|
||||
[110.423928, 19.413495],
|
||||
[110.368744, 19.391829],
|
||||
[110.327356, 19.315261],
|
||||
[110.3593, 19.298646],
|
||||
[110.344392, 19.228368],
|
||||
[110.300226, 19.21586],
|
||||
[110.224857, 19.221718],
|
||||
[110.170598, 19.191317],
|
||||
[110.150876, 19.208419],
|
||||
[110.115229, 19.133191],
|
||||
[110.124118, 19.04747],
|
||||
[110.158562, 18.99944],
|
||||
[110.229579, 19.002452],
|
||||
[110.249949, 18.976292],
|
||||
[110.465039, 19.074411],
|
||||
[110.477539, 19.096912],
|
||||
[110.521797, 19.102932],
|
||||
[110.610593, 19.084394]
|
||||
]
|
||||
]
|
||||
]
|
||||
}
|
||||
}, {
|
||||
"type": "Feature",
|
||||
"properties": { "adcode": 469005, "name": "文昌", "center": [110.753975, 19.612986], "centroid": [110.788535, 19.747363], "childrenNum": 0, "level": "city", "parent": { "adcode": 460000 }, "subFeatureIndex": 6, "acroutes": [100000, 460000] },
|
||||
"geometry": {
|
||||
"type": "MultiPolygon",
|
||||
"coordinates": [
|
||||
[
|
||||
[
|
||||
[110.730035, 19.378859],
|
||||
[110.781053, 19.395783],
|
||||
[110.844015, 19.450179],
|
||||
[110.920774, 19.552598],
|
||||
[111.008921, 19.60394],
|
||||
[111.071327, 19.628895],
|
||||
[111.044013, 19.763551],
|
||||
[111.013643, 19.850472],
|
||||
[110.969569, 20.010151],
|
||||
[110.940959, 20.028583],
|
||||
[110.871515, 20.011569],
|
||||
[110.808738, 20.035672],
|
||||
[110.778368, 20.068276],
|
||||
[110.744665, 20.073946],
|
||||
[110.717258, 20.148734],
|
||||
[110.687073, 20.16353],
|
||||
[110.655685, 20.134409],
|
||||
[110.56226, 20.109691],
|
||||
[110.526612, 20.075206],
|
||||
[110.598, 19.98305],
|
||||
[110.634666, 19.965401],
|
||||
[110.675314, 19.907868],
|
||||
[110.676147, 19.860092],
|
||||
[110.699573, 19.861512],
|
||||
[110.704665, 19.805992],
|
||||
[110.670314, 19.812776],
|
||||
[110.623, 19.735461],
|
||||
[110.623463, 19.664109],
|
||||
[110.672814, 19.647214],
|
||||
[110.636148, 19.593989],
|
||||
[110.641333, 19.549122],
|
||||
[110.611518, 19.526841],
|
||||
[110.540223, 19.535532],
|
||||
[110.519297, 19.563341],
|
||||
[110.469854, 19.531424],
|
||||
[110.485779, 19.502345],
|
||||
[110.520594, 19.509931],
|
||||
[110.546242, 19.46836],
|
||||
[110.581426, 19.419504],
|
||||
[110.584111, 19.367787],
|
||||
[110.604574, 19.350386],
|
||||
[110.633555, 19.391354],
|
||||
[110.730035, 19.378859]
|
||||
]
|
||||
]
|
||||
]
|
||||
}
|
||||
}, {
|
||||
"type": "Feature",
|
||||
"properties": { "adcode": 469006, "name": "万宁", "center": [110.388793, 18.796216], "centroid": [110.324496, 18.830445], "childrenNum": 0, "level": "city", "parent": { "adcode": 460000 }, "subFeatureIndex": 7, "acroutes": [100000, 460000] },
|
||||
"geometry": {
|
||||
"type": "MultiPolygon",
|
||||
"coordinates": [
|
||||
[
|
||||
[
|
||||
[110.158562, 18.99944],
|
||||
[110.108284, 18.944577],
|
||||
[110.097729, 18.911746],
|
||||
[110.045322, 18.884778],
|
||||
[110.095785, 18.811467],
|
||||
[110.057267, 18.758448],
|
||||
[110.014952, 18.732885],
|
||||
[110.020786, 18.658873],
|
||||
[110.115877, 18.592774],
|
||||
[110.137543, 18.606123],
|
||||
[110.213931, 18.578789],
|
||||
[110.246246, 18.609619],
|
||||
[110.329393, 18.642509],
|
||||
[110.36754, 18.632182],
|
||||
[110.495316, 18.649976],
|
||||
[110.500779, 18.752732],
|
||||
[110.577908, 18.784642],
|
||||
[110.590593, 18.839082],
|
||||
[110.585871, 18.897786],
|
||||
[110.610593, 19.084394],
|
||||
[110.521797, 19.102932],
|
||||
[110.477539, 19.096912],
|
||||
[110.465039, 19.074411],
|
||||
[110.249949, 18.976292],
|
||||
[110.229579, 19.002452],
|
||||
[110.158562, 18.99944]
|
||||
]
|
||||
]
|
||||
]
|
||||
}
|
||||
}, {
|
||||
"type": "Feature",
|
||||
"properties": { "adcode": 469007, "name": "东方", "center": [108.653789, 19.10198], "centroid": [108.818801, 18.996184], "childrenNum": 0, "level": "city", "parent": { "adcode": 460000 }, "subFeatureIndex": 8, "acroutes": [100000, 460000] },
|
||||
"geometry": {
|
||||
"type": "MultiPolygon",
|
||||
"coordinates": [
|
||||
[
|
||||
[
|
||||
[109.125242, 18.878432],
|
||||
[109.089779, 18.909842],
|
||||
[109.113668, 18.969949],
|
||||
[109.098853, 19.028291],
|
||||
[109.008762, 19.050005],
|
||||
[109.022929, 19.107052],
|
||||
[108.99191, 19.13034],
|
||||
[108.954874, 19.218869],
|
||||
[108.916171, 19.218552],
|
||||
[108.833209, 19.25987],
|
||||
[108.783765, 19.244674],
|
||||
[108.704136, 19.262719],
|
||||
[108.644785, 19.349278],
|
||||
[108.605712, 19.264619],
|
||||
[108.591082, 19.141587],
|
||||
[108.598305, 19.055869],
|
||||
[108.630434, 19.003086],
|
||||
[108.637841, 18.924593],
|
||||
[108.595619, 18.872086],
|
||||
[108.593212, 18.809404],
|
||||
[108.659785, 18.716846],
|
||||
[108.761543, 18.732091],
|
||||
[108.81145, 18.720022],
|
||||
[108.844412, 18.750827],
|
||||
[108.928578, 18.790198],
|
||||
[108.987003, 18.786547],
|
||||
[109.015151, 18.808928],
|
||||
[109.071076, 18.807499],
|
||||
[109.094965, 18.857012],
|
||||
[109.125242, 18.878432]
|
||||
]
|
||||
]
|
||||
]
|
||||
}
|
||||
}, {
|
||||
"type": "Feature",
|
||||
"properties": { "adcode": 469021, "name": "定安", "center": [110.349235, 19.684966], "centroid": [110.312936, 19.483405], "childrenNum": 0, "level": "city", "parent": { "adcode": 460000 }, "subFeatureIndex": 9, "acroutes": [100000, 460000] },
|
||||
"geometry": {
|
||||
"type": "MultiPolygon",
|
||||
"coordinates": [
|
||||
[
|
||||
[
|
||||
[110.224857, 19.221718],
|
||||
[110.300226, 19.21586],
|
||||
[110.344392, 19.228368],
|
||||
[110.3593, 19.298646],
|
||||
[110.327356, 19.315261],
|
||||
[110.368744, 19.391829],
|
||||
[110.423928, 19.413495],
|
||||
[110.450317, 19.447492],
|
||||
[110.484761, 19.443223],
|
||||
[110.504853, 19.46836],
|
||||
[110.546242, 19.46836],
|
||||
[110.520594, 19.509931],
|
||||
[110.485779, 19.502345],
|
||||
[110.469854, 19.531424],
|
||||
[110.519297, 19.563341],
|
||||
[110.486705, 19.593357],
|
||||
[110.455687, 19.574559],
|
||||
[110.401151, 19.606626],
|
||||
[110.372633, 19.654004],
|
||||
[110.393373, 19.698053],
|
||||
[110.340041, 19.720625],
|
||||
[110.314208, 19.697421],
|
||||
[110.262449, 19.687318],
|
||||
[110.221616, 19.629843],
|
||||
[110.186524, 19.636791],
|
||||
[110.160784, 19.67153],
|
||||
[110.13134, 19.648003],
|
||||
[110.137266, 19.56034],
|
||||
[110.192172, 19.58925],
|
||||
[110.196339, 19.535374],
|
||||
[110.243005, 19.517675],
|
||||
[110.227727, 19.450654],
|
||||
[110.194024, 19.455871],
|
||||
[110.164487, 19.426146],
|
||||
[110.165691, 19.361459],
|
||||
[110.188283, 19.306242],
|
||||
[110.228098, 19.301969],
|
||||
[110.224857, 19.221718]
|
||||
]
|
||||
]
|
||||
]
|
||||
}
|
||||
}, {
|
||||
"type": "Feature",
|
||||
"properties": { "adcode": 469022, "name": "屯昌", "center": [110.102773, 19.362916], "centroid": [110.055723, 19.342208], "childrenNum": 0, "level": "city", "parent": { "adcode": 460000 }, "subFeatureIndex": 10, "acroutes": [100000, 460000] },
|
||||
"geometry": {
|
||||
"type": "MultiPolygon",
|
||||
"coordinates": [
|
||||
[
|
||||
[
|
||||
[110.115229, 19.133191],
|
||||
[110.150876, 19.208419],
|
||||
[110.170598, 19.191317],
|
||||
[110.224857, 19.221718],
|
||||
[110.228098, 19.301969],
|
||||
[110.188283, 19.306242],
|
||||
[110.165691, 19.361459],
|
||||
[110.164487, 19.426146],
|
||||
[110.194024, 19.455871],
|
||||
[110.227727, 19.450654],
|
||||
[110.243005, 19.517675],
|
||||
[110.196339, 19.535374],
|
||||
[110.192172, 19.58925],
|
||||
[110.137266, 19.56034],
|
||||
[110.101803, 19.54928],
|
||||
[110.119488, 19.503293],
|
||||
[110.072081, 19.492071],
|
||||
[110.045785, 19.456029],
|
||||
[110.020508, 19.485432],
|
||||
[109.938287, 19.485749],
|
||||
[109.94699, 19.468044],
|
||||
[109.914583, 19.42409],
|
||||
[109.912917, 19.391671],
|
||||
[109.876436, 19.386926],
|
||||
[109.826436, 19.343108],
|
||||
[109.822733, 19.289626],
|
||||
[109.923565, 19.239608],
|
||||
[109.957638, 19.188625],
|
||||
[110.026526, 19.17564],
|
||||
[110.057267, 19.134617],
|
||||
[110.115229, 19.133191]
|
||||
]
|
||||
]
|
||||
]
|
||||
}
|
||||
}, {
|
||||
"type": "Feature",
|
||||
"properties": { "adcode": 469023, "name": "澄迈", "center": [110.007147, 19.737095], "centroid": [109.990417, 19.700201], "childrenNum": 0, "level": "city", "parent": { "adcode": 460000 }, "subFeatureIndex": 11, "acroutes": [100000, 460000] },
|
||||
"geometry": {
|
||||
"type": "MultiPolygon",
|
||||
"coordinates": [
|
||||
[
|
||||
[
|
||||
[110.137266, 19.56034],
|
||||
[110.13134, 19.648003],
|
||||
[110.160784, 19.67153],
|
||||
[110.186524, 19.636791],
|
||||
[110.221616, 19.629843],
|
||||
[110.262449, 19.687318],
|
||||
[110.222357, 19.67974],
|
||||
[110.208468, 19.716679],
|
||||
[110.228283, 19.753767],
|
||||
[110.186246, 19.864193],
|
||||
[110.143932, 19.889106],
|
||||
[110.161895, 19.977693],
|
||||
[110.106525, 20.026851],
|
||||
[109.997638, 19.979899],
|
||||
[109.965231, 19.993608],
|
||||
[109.855047, 19.984153],
|
||||
[109.879491, 19.885322],
|
||||
[109.842269, 19.871446],
|
||||
[109.884121, 19.853311],
|
||||
[109.874306, 19.799524],
|
||||
[109.897084, 19.77933],
|
||||
[109.852732, 19.652582],
|
||||
[109.786437, 19.608047],
|
||||
[109.7694, 19.578508],
|
||||
[109.760048, 19.528895],
|
||||
[109.728197, 19.496023],
|
||||
[109.751993, 19.416974],
|
||||
[109.737734, 19.407486],
|
||||
[109.793474, 19.379966],
|
||||
[109.857269, 19.412388],
|
||||
[109.876436, 19.386926],
|
||||
[109.912917, 19.391671],
|
||||
[109.914583, 19.42409],
|
||||
[109.94699, 19.468044],
|
||||
[109.938287, 19.485749],
|
||||
[110.020508, 19.485432],
|
||||
[110.045785, 19.456029],
|
||||
[110.072081, 19.492071],
|
||||
[110.119488, 19.503293],
|
||||
[110.101803, 19.54928],
|
||||
[110.137266, 19.56034]
|
||||
]
|
||||
]
|
||||
]
|
||||
}
|
||||
}, {
|
||||
"type": "Feature",
|
||||
"properties": { "adcode": 469024, "name": "临高", "center": [109.687697, 19.908293], "centroid": [109.71548, 19.809704], "childrenNum": 0, "level": "city", "parent": { "adcode": 460000 }, "subFeatureIndex": 12, "acroutes": [100000, 460000] },
|
||||
"geometry": {
|
||||
"type": "MultiPolygon",
|
||||
"coordinates": [
|
||||
[
|
||||
[
|
||||
[109.855047, 19.984153],
|
||||
[109.814307, 19.992977],
|
||||
[109.761715, 19.981317],
|
||||
[109.712271, 20.017398],
|
||||
[109.585328, 19.98825],
|
||||
[109.526626, 19.943494],
|
||||
[109.498663, 19.873339],
|
||||
[109.564588, 19.854888],
|
||||
[109.569218, 19.797947],
|
||||
[109.599402, 19.730726],
|
||||
[109.557366, 19.697421],
|
||||
[109.582921, 19.637581],
|
||||
[109.664216, 19.629685],
|
||||
[109.659402, 19.611048],
|
||||
[109.709308, 19.57756],
|
||||
[109.7694, 19.578508],
|
||||
[109.786437, 19.608047],
|
||||
[109.852732, 19.652582],
|
||||
[109.897084, 19.77933],
|
||||
[109.874306, 19.799524],
|
||||
[109.884121, 19.853311],
|
||||
[109.842269, 19.871446],
|
||||
[109.879491, 19.885322],
|
||||
[109.855047, 19.984153]
|
||||
]
|
||||
]
|
||||
]
|
||||
}
|
||||
}, {
|
||||
"type": "Feature",
|
||||
"properties": { "adcode": 469025, "name": "白沙", "center": [109.452606, 19.224584], "centroid": [109.351743, 19.20989], "childrenNum": 0, "level": "city", "parent": { "adcode": 460000 }, "subFeatureIndex": 13, "acroutes": [100000, 460000] },
|
||||
"geometry": {
|
||||
"type": "MultiPolygon",
|
||||
"coordinates": [
|
||||
[
|
||||
[
|
||||
[109.298203, 18.960911],
|
||||
[109.34848, 18.946321],
|
||||
[109.367739, 18.936171],
|
||||
[109.424775, 18.990403],
|
||||
[109.456349, 18.995635],
|
||||
[109.468386, 19.032254],
|
||||
[109.524033, 19.030986],
|
||||
[109.561347, 19.072668],
|
||||
[109.601439, 19.053492],
|
||||
[109.613569, 19.086454],
|
||||
[109.687734, 19.118775],
|
||||
[109.686994, 19.178965],
|
||||
[109.673105, 19.207627],
|
||||
[109.634031, 19.20256],
|
||||
[109.611995, 19.252589],
|
||||
[109.587365, 19.243249],
|
||||
[109.541625, 19.311939],
|
||||
[109.468386, 19.301178],
|
||||
[109.506348, 19.359561],
|
||||
[109.483848, 19.406063],
|
||||
[109.457275, 19.39942],
|
||||
[109.424405, 19.354815],
|
||||
[109.384035, 19.355448],
|
||||
[109.318943, 19.398155],
|
||||
[109.26774, 19.376803],
|
||||
[109.178389, 19.399262],
|
||||
[109.13052, 19.479584],
|
||||
[109.117557, 19.46757],
|
||||
[109.051447, 19.487803],
|
||||
[109.04478, 19.430415],
|
||||
[109.043669, 19.342792],
|
||||
[109.08265, 19.328869],
|
||||
[109.142834, 19.265727],
|
||||
[109.120242, 19.203985],
|
||||
[109.163667, 19.14222],
|
||||
[109.177093, 19.083443],
|
||||
[109.271166, 19.067438],
|
||||
[109.298203, 18.960911]
|
||||
]
|
||||
]
|
||||
]
|
||||
}
|
||||
}, {
|
||||
"type": "Feature",
|
||||
"properties": { "adcode": 469026, "name": "昌江", "center": [109.053351, 19.260968], "centroid": [108.993675, 19.226048], "childrenNum": 0, "level": "city", "parent": { "adcode": 460000 }, "subFeatureIndex": 14, "acroutes": [100000, 460000] },
|
||||
"geometry": {
|
||||
"type": "MultiPolygon",
|
||||
"coordinates": [
|
||||
[
|
||||
[
|
||||
[109.04478, 19.430415],
|
||||
[108.997373, 19.431522],
|
||||
[108.982744, 19.477213],
|
||||
[108.939596, 19.497287],
|
||||
[108.928671, 19.524313],
|
||||
[108.887004, 19.4897],
|
||||
[108.806357, 19.450654],
|
||||
[108.747654, 19.391671],
|
||||
[108.694137, 19.387084],
|
||||
[108.644785, 19.349278],
|
||||
[108.704136, 19.262719],
|
||||
[108.783765, 19.244674],
|
||||
[108.833209, 19.25987],
|
||||
[108.916171, 19.218552],
|
||||
[108.954874, 19.218869],
|
||||
[108.99191, 19.13034],
|
||||
[109.022929, 19.107052],
|
||||
[109.008762, 19.050005],
|
||||
[109.098853, 19.028291],
|
||||
[109.113668, 18.969949],
|
||||
[109.089779, 18.909842],
|
||||
[109.125242, 18.878432],
|
||||
[109.141816, 18.904449],
|
||||
[109.206722, 18.894772],
|
||||
[109.265518, 18.905877],
|
||||
[109.298203, 18.960911],
|
||||
[109.271166, 19.067438],
|
||||
[109.177093, 19.083443],
|
||||
[109.163667, 19.14222],
|
||||
[109.120242, 19.203985],
|
||||
[109.142834, 19.265727],
|
||||
[109.08265, 19.328869],
|
||||
[109.043669, 19.342792],
|
||||
[109.04478, 19.430415]
|
||||
]
|
||||
]
|
||||
]
|
||||
}
|
||||
}, {
|
||||
"type": "Feature",
|
||||
"properties": { "adcode": 469027, "name": "乐东", "center": [109.175444, 18.74758], "centroid": [109.029671, 18.639822], "childrenNum": 0, "level": "city", "parent": { "adcode": 460000 }, "subFeatureIndex": 15, "acroutes": [100000, 460000] },
|
||||
"geometry": {
|
||||
"type": "MultiPolygon",
|
||||
"coordinates": [
|
||||
[
|
||||
[
|
||||
[109.405146, 18.623443],
|
||||
[109.408016, 18.627733],
|
||||
[109.398109, 18.671104],
|
||||
[109.356628, 18.710653],
|
||||
[109.353387, 18.812896],
|
||||
[109.374591, 18.853998],
|
||||
[109.343109, 18.877163],
|
||||
[109.32635, 18.926338],
|
||||
[109.34848, 18.946321],
|
||||
[109.298203, 18.960911],
|
||||
[109.265518, 18.905877],
|
||||
[109.206722, 18.894772],
|
||||
[109.141816, 18.904449],
|
||||
[109.125242, 18.878432],
|
||||
[109.094965, 18.857012],
|
||||
[109.071076, 18.807499],
|
||||
[109.015151, 18.808928],
|
||||
[108.987003, 18.786547],
|
||||
[108.928578, 18.790198],
|
||||
[108.844412, 18.750827],
|
||||
[108.81145, 18.720022],
|
||||
[108.761543, 18.732091],
|
||||
[108.659785, 18.716846],
|
||||
[108.664137, 18.673328],
|
||||
[108.641082, 18.565279],
|
||||
[108.644971, 18.486741],
|
||||
[108.658304, 18.462728],
|
||||
[108.70997, 18.444119],
|
||||
[108.776728, 18.442051],
|
||||
[108.881264, 18.416599],
|
||||
[108.932374, 18.335288],
|
||||
[109.015243, 18.422645],
|
||||
[109.072557, 18.452231],
|
||||
[109.195148, 18.469407],
|
||||
[109.185056, 18.507095],
|
||||
[109.203574, 18.553517],
|
||||
[109.246537, 18.558921],
|
||||
[109.313295, 18.517429],
|
||||
[109.332832, 18.575451],
|
||||
[109.405146, 18.623443]
|
||||
]
|
||||
]
|
||||
]
|
||||
}
|
||||
}, {
|
||||
"type": "Feature",
|
||||
"properties": { "adcode": 469028, "name": "陵水", "center": [110.037218, 18.505006], "centroid": [109.951436, 18.549546], "childrenNum": 0, "level": "city", "parent": { "adcode": 460000 }, "subFeatureIndex": 16, "acroutes": [100000, 460000] },
|
||||
"geometry": {
|
||||
"type": "MultiPolygon",
|
||||
"coordinates": [
|
||||
[
|
||||
[
|
||||
[110.014952, 18.732885],
|
||||
[109.980416, 18.76718],
|
||||
[109.94412, 18.771942],
|
||||
[109.902361, 18.739395],
|
||||
[109.891065, 18.754479],
|
||||
[109.830696, 18.728597],
|
||||
[109.773474, 18.809404],
|
||||
[109.756159, 18.788928],
|
||||
[109.771993, 18.723675],
|
||||
[109.802177, 18.725263],
|
||||
[109.839677, 18.67857],
|
||||
[109.804677, 18.594364],
|
||||
[109.846621, 18.57116],
|
||||
[109.828751, 18.511229],
|
||||
[109.781159, 18.51107],
|
||||
[109.809955, 18.459388],
|
||||
[109.785048, 18.426622],
|
||||
[109.805418, 18.347543],
|
||||
[109.919676, 18.375551],
|
||||
[109.999767, 18.359797],
|
||||
[110.070785, 18.376187],
|
||||
[110.090507, 18.399258],
|
||||
[110.116618, 18.506618],
|
||||
[110.213931, 18.578789],
|
||||
[110.137543, 18.606123],
|
||||
[110.115877, 18.592774],
|
||||
[110.020786, 18.658873],
|
||||
[110.014952, 18.732885]
|
||||
]
|
||||
]
|
||||
]
|
||||
}
|
||||
}, {
|
||||
"type": "Feature",
|
||||
"properties": { "adcode": 469029, "name": "保亭", "center": [109.70245, 18.636371], "centroid": [109.650759, 18.589686], "childrenNum": 0, "level": "city", "parent": { "adcode": 460000 }, "subFeatureIndex": 17, "acroutes": [100000, 460000] },
|
||||
"geometry": {
|
||||
"type": "MultiPolygon",
|
||||
"coordinates": [
|
||||
[
|
||||
[
|
||||
[109.715419, 18.833686],
|
||||
[109.689216, 18.830036],
|
||||
[109.681531, 18.786071],
|
||||
[109.703012, 18.721769],
|
||||
[109.641809, 18.72304],
|
||||
[109.619865, 18.678252],
|
||||
[109.576717, 18.714782],
|
||||
[109.533662, 18.694295],
|
||||
[109.539866, 18.659508],
|
||||
[109.48857, 18.64664],
|
||||
[109.448293, 18.655378],
|
||||
[109.408016, 18.627733],
|
||||
[109.405146, 18.623443],
|
||||
[109.423386, 18.574657],
|
||||
[109.506163, 18.551291],
|
||||
[109.535237, 18.53142],
|
||||
[109.536996, 18.490717],
|
||||
[109.515607, 18.429008],
|
||||
[109.539866, 18.396713],
|
||||
[109.665883, 18.391462],
|
||||
[109.710882, 18.426462],
|
||||
[109.725234, 18.493102],
|
||||
[109.781159, 18.51107],
|
||||
[109.828751, 18.511229],
|
||||
[109.846621, 18.57116],
|
||||
[109.804677, 18.594364],
|
||||
[109.839677, 18.67857],
|
||||
[109.802177, 18.725263],
|
||||
[109.771993, 18.723675],
|
||||
[109.756159, 18.788928],
|
||||
[109.773474, 18.809404],
|
||||
[109.715419, 18.833686]
|
||||
]
|
||||
]
|
||||
]
|
||||
}
|
||||
}, {
|
||||
"type": "Feature",
|
||||
"properties": { "adcode": 469030, "name": "琼中", "center": [109.839996, 19.03557], "centroid": [109.854584, 19.033919], "childrenNum": 0, "level": "city", "parent": { "adcode": 460000 }, "subFeatureIndex": 18, "acroutes": [100000, 460000] },
|
||||
"geometry": {
|
||||
"type": "MultiPolygon",
|
||||
"coordinates": [
|
||||
[
|
||||
[
|
||||
[109.876436, 19.386926],
|
||||
[109.857269, 19.412388],
|
||||
[109.793474, 19.379966],
|
||||
[109.737734, 19.407486],
|
||||
[109.646439, 19.402425],
|
||||
[109.647272, 19.357505],
|
||||
[109.700234, 19.349436],
|
||||
[109.713382, 19.309881],
|
||||
[109.697271, 19.271267],
|
||||
[109.706808, 19.22156],
|
||||
[109.686994, 19.178965],
|
||||
[109.687734, 19.118775],
|
||||
[109.613569, 19.086454],
|
||||
[109.601439, 19.053492],
|
||||
[109.561347, 19.072668],
|
||||
[109.524033, 19.030986],
|
||||
[109.55357, 18.946321],
|
||||
[109.601532, 18.910318],
|
||||
[109.676531, 18.925862],
|
||||
[109.730512, 18.913649],
|
||||
[109.699123, 18.889379],
|
||||
[109.715419, 18.833686],
|
||||
[109.773474, 18.809404],
|
||||
[109.830696, 18.728597],
|
||||
[109.891065, 18.754479],
|
||||
[109.902361, 18.739395],
|
||||
[109.94412, 18.771942],
|
||||
[109.980416, 18.76718],
|
||||
[110.014952, 18.732885],
|
||||
[110.057267, 18.758448],
|
||||
[110.095785, 18.811467],
|
||||
[110.045322, 18.884778],
|
||||
[110.097729, 18.911746],
|
||||
[110.108284, 18.944577],
|
||||
[110.158562, 18.99944],
|
||||
[110.124118, 19.04747],
|
||||
[110.115229, 19.133191],
|
||||
[110.057267, 19.134617],
|
||||
[110.026526, 19.17564],
|
||||
[109.957638, 19.188625],
|
||||
[109.923565, 19.239608],
|
||||
[109.822733, 19.289626],
|
||||
[109.826436, 19.343108],
|
||||
[109.876436, 19.386926]
|
||||
]
|
||||
]
|
||||
]
|
||||
}
|
||||
}
|
||||
]
|
||||
}
|
||||
6830
public/mapjson/湖北.json
Normal file
6830
public/mapjson/湖北.json
Normal file
File diff suppressed because it is too large
Load Diff
7611
public/mapjson/湖南.json
Normal file
7611
public/mapjson/湖南.json
Normal file
File diff suppressed because it is too large
Load Diff
1
public/mapjson/澳门.json
Normal file
1
public/mapjson/澳门.json
Normal file
File diff suppressed because one or more lines are too long
4573
public/mapjson/甘肃.json
Normal file
4573
public/mapjson/甘肃.json
Normal file
File diff suppressed because it is too large
Load Diff
5223
public/mapjson/福建.json
Normal file
5223
public/mapjson/福建.json
Normal file
File diff suppressed because it is too large
Load Diff
1
public/mapjson/秦皇岛市.json
Normal file
1
public/mapjson/秦皇岛市.json
Normal file
File diff suppressed because one or more lines are too long
1
public/mapjson/西藏.json
Normal file
1
public/mapjson/西藏.json
Normal file
File diff suppressed because one or more lines are too long
5676
public/mapjson/贵州.json
Normal file
5676
public/mapjson/贵州.json
Normal file
File diff suppressed because it is too large
Load Diff
7099
public/mapjson/辽宁.json
Normal file
7099
public/mapjson/辽宁.json
Normal file
File diff suppressed because it is too large
Load Diff
1
public/mapjson/重庆.json
Normal file
1
public/mapjson/重庆.json
Normal file
File diff suppressed because one or more lines are too long
3084
public/mapjson/陕西.json
Normal file
3084
public/mapjson/陕西.json
Normal file
File diff suppressed because it is too large
Load Diff
4369
public/mapjson/青海.json
Normal file
4369
public/mapjson/青海.json
Normal file
File diff suppressed because it is too large
Load Diff
1
public/mapjson/香港.json
Normal file
1
public/mapjson/香港.json
Normal file
File diff suppressed because one or more lines are too long
6346
public/mapjson/黑龙江.json
Normal file
6346
public/mapjson/黑龙江.json
Normal file
File diff suppressed because it is too large
Load Diff
7
src/App.vue
Normal file
7
src/App.vue
Normal file
@@ -0,0 +1,7 @@
|
||||
<template>
|
||||
<div id="app">
|
||||
<router-view />
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<style></style>
|
||||
0
src/api/center/DataCenter.js
Normal file
0
src/api/center/DataCenter.js
Normal file
9
src/api/center/DataSize.js
Normal file
9
src/api/center/DataSize.js
Normal file
@@ -0,0 +1,9 @@
|
||||
import request from "@/utils/request";
|
||||
|
||||
//数据规模
|
||||
export function getDataSize() {
|
||||
return request({
|
||||
url: "/center/getDataSize",
|
||||
method: "get",
|
||||
});
|
||||
}
|
||||
189
src/api/center/DropEvent.js
Normal file
189
src/api/center/DropEvent.js
Normal file
@@ -0,0 +1,189 @@
|
||||
// import request from "@/utils/request";
|
||||
|
||||
// //大屏暂降事件
|
||||
// export function getAreaDownStatisticsData(data) {
|
||||
// return request({
|
||||
// url: "/event-boot/largeScreen/getAreaDownStatistics",
|
||||
// method: "post",
|
||||
// data,
|
||||
// });
|
||||
// }
|
||||
import request from "@/utils/request";
|
||||
|
||||
//大屏暂降事件(片区)
|
||||
export function getAreaDownStatisticsData(data) {
|
||||
return request({
|
||||
url: "/event-boot/largeScreen/getAreaDownStatistics",
|
||||
method: "post",
|
||||
data: data,
|
||||
});
|
||||
}
|
||||
//大屏暂降事件(负荷类型)
|
||||
export function getLoadType(data) {
|
||||
return request({
|
||||
url: "/event-boot/largeScreen/getLoadType",
|
||||
method: "post",
|
||||
data: data,
|
||||
});
|
||||
}
|
||||
//大屏暂降事件(暂降事件时间统计)
|
||||
export function getTimeCount(data) {
|
||||
return request({
|
||||
url: "/event-boot/largeScreen/getTimeCount",
|
||||
method: "post",
|
||||
data: data,
|
||||
});
|
||||
}
|
||||
//大屏获取暂降事件最新50条数据
|
||||
export function eventLists(data) {
|
||||
return request({
|
||||
url: "/event-boot/largeScreen/eventLists",
|
||||
method: "post",
|
||||
data: data,
|
||||
});
|
||||
}
|
||||
//大屏监测点规模(片区)
|
||||
export function getMonitoringPointScale(data) {
|
||||
return request({
|
||||
url: "/device-boot/largeScreen/getMonitoringPointScale",
|
||||
method: "post",
|
||||
data: data,
|
||||
});
|
||||
}
|
||||
//大屏监测点规模(负荷类型)
|
||||
export function getLoadTypeData(data) {
|
||||
return request({
|
||||
url: "/device-boot/largeScreen/getLoadType",
|
||||
method: "post",
|
||||
data: data,
|
||||
});
|
||||
}
|
||||
//大屏中间暂态
|
||||
export function getMiddleDown(data) {
|
||||
return request({
|
||||
url: "/event-boot/largeScreen/getMiddleDown",
|
||||
method: "post",
|
||||
data: data,
|
||||
});
|
||||
}
|
||||
//大屏中间稳态越线信息
|
||||
export function getMiddleLimitRate(data) {
|
||||
return request({
|
||||
url: "/event-boot/largeScreen/getMiddleLimitRate",
|
||||
method: "post",
|
||||
data: data,
|
||||
});
|
||||
}
|
||||
//大屏中间终端异常信息
|
||||
export function getMiddleTerminal(data) {
|
||||
return request({
|
||||
url: "/event-boot/largeScreen/getMiddleTerminal",
|
||||
method: "post",
|
||||
data: data,
|
||||
});
|
||||
}
|
||||
//大屏中间所有数据
|
||||
export function getAllData(data) {
|
||||
return request({
|
||||
url: "/event-boot/largeScreen/getAllData",
|
||||
method: "post",
|
||||
data: data,
|
||||
});
|
||||
}
|
||||
//稳态越线占比超标占比(负荷类型)
|
||||
export function getHomeostasisLoad(data) {
|
||||
return request({
|
||||
url: "/harmonic-boot/largeScreen/getHomeostasisLoad",
|
||||
method: "post",
|
||||
data: data,
|
||||
});
|
||||
}
|
||||
//稳态越线占比超标占比(负荷类型)
|
||||
export function getHomeostasisArea(data) {
|
||||
return request({
|
||||
url: "/harmonic-boot/largeScreen/getHomeostasisArea",
|
||||
method: "post",
|
||||
data: data,
|
||||
});
|
||||
}
|
||||
//灿能云用户规模
|
||||
export function getUserScale(data) {
|
||||
return request({
|
||||
url: "/user-boot/largeScreen/getUserScale",
|
||||
method: "post",
|
||||
data: data,
|
||||
});
|
||||
}
|
||||
//数据规模
|
||||
export function getDataScale(data) {
|
||||
return request({
|
||||
url: "/system-boot/largeScreen/getDataScale",
|
||||
method: "post",
|
||||
data: data,
|
||||
});
|
||||
}
|
||||
//功率负荷排名
|
||||
export function getPowerOrder(data) {
|
||||
return request({
|
||||
url: "/harmonic-boot/largeScreen/getPowerOrder",
|
||||
method: "post",
|
||||
data: data,
|
||||
});
|
||||
}
|
||||
//视屏 图片 查询数据
|
||||
export function queryData(params) {
|
||||
return request({
|
||||
url: "/device-boot/resource/queryData",
|
||||
method: "post",
|
||||
params,
|
||||
});
|
||||
}
|
||||
//播放视频资源
|
||||
export function play(params) {
|
||||
return request({
|
||||
url: "/device-boot/resource/play1",
|
||||
method: "get",
|
||||
params,
|
||||
responseType: 'blob'
|
||||
});
|
||||
}
|
||||
//上传资源
|
||||
export function uploadFile(data) {
|
||||
return request({
|
||||
url: "/device-boot/resource/uploadFile",
|
||||
method: "post",
|
||||
data,
|
||||
});
|
||||
}
|
||||
//修改资源
|
||||
export function updateFile(data) {
|
||||
return request({
|
||||
url: "/device-boot/resource/updateFile",
|
||||
method: "post",
|
||||
data,
|
||||
});
|
||||
}
|
||||
//删除资源
|
||||
export function deleteFile(params) {
|
||||
return request({
|
||||
url: "/device-boot/resource/deleteFile",
|
||||
method: "get",
|
||||
params,
|
||||
});
|
||||
}
|
||||
//运行时间
|
||||
export function getRunTime(data) {
|
||||
return request({
|
||||
url: "/device-boot/largeScreen/getRunTime",
|
||||
method: "post",
|
||||
data,
|
||||
});
|
||||
}
|
||||
//重要用户
|
||||
export function getImMonitorEvents(data) {
|
||||
return request({
|
||||
url: "/event-boot/rmpEventDetail/getImMonitorEvents",
|
||||
method: "post",
|
||||
data,
|
||||
});
|
||||
}
|
||||
0
src/api/center/Map.js
Normal file
0
src/api/center/Map.js
Normal file
0
src/api/center/MonitoringPointScale.js
Normal file
0
src/api/center/MonitoringPointScale.js
Normal file
15
src/api/center/SteadyState.js
Normal file
15
src/api/center/SteadyState.js
Normal file
@@ -0,0 +1,15 @@
|
||||
import request from "@/utils/request";
|
||||
|
||||
//灿能用户规模
|
||||
export function Steadystateindicatorregion() {
|
||||
return request({
|
||||
url: "/Steadystateindicatorregion",
|
||||
method: "post",
|
||||
});
|
||||
}
|
||||
export function Steadystateindicatorloadtype() {
|
||||
return request({
|
||||
url: "/Steadystateindicatorloadtype",
|
||||
method: "post",
|
||||
});
|
||||
}
|
||||
0
src/api/center/Table.js
Normal file
0
src/api/center/Table.js
Normal file
9
src/api/center/UserScale.js
Normal file
9
src/api/center/UserScale.js
Normal file
@@ -0,0 +1,9 @@
|
||||
import request from "@/utils/request";
|
||||
|
||||
//灿能用户规模
|
||||
export function getUserScale() {
|
||||
return request({
|
||||
url: "/center/getUserScale",
|
||||
method: "get",
|
||||
});
|
||||
}
|
||||
0
src/api/homePage.js
Normal file
0
src/api/homePage.js
Normal file
81
src/api/homePage/index.js
Normal file
81
src/api/homePage/index.js
Normal file
@@ -0,0 +1,81 @@
|
||||
import request from "@/utils/request";
|
||||
//暂降原因
|
||||
export function getStatisticData(data) {
|
||||
return request({
|
||||
url: '/event-boot/areaAnalysis/getEventReason',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
}
|
||||
//监测点规模状态
|
||||
export function getDeptLineCount(data) {
|
||||
return request({
|
||||
url: "/device-boot/line/getDeptLineCount",
|
||||
method: "POST",
|
||||
data,
|
||||
});
|
||||
}
|
||||
//数据完整性统计
|
||||
export function getLineIntegrityData(data) {
|
||||
return request({
|
||||
url: "/harmonic-boot/integrity/getIntegrityIcon",
|
||||
method: "POST",
|
||||
data,
|
||||
});
|
||||
}
|
||||
//终端状态统计
|
||||
export function getTerminalDataCensus(data) {
|
||||
return request({
|
||||
url: "/harmonic-boot/terminal/getTerminalDataCensus",
|
||||
method: "POST",
|
||||
data,
|
||||
});
|
||||
}
|
||||
//谐波越限事件统计图
|
||||
export function getHarmonicProportion(data) {
|
||||
return request({
|
||||
url: "/harmonic-boot/harmonic/getHarmonicProportion",
|
||||
method: "POST",
|
||||
data,
|
||||
});
|
||||
}
|
||||
//谐波畸变率排名前十监测点
|
||||
export function getTHDTopTenData(data) {
|
||||
return request({
|
||||
url: "/harmonic-boot/tHDistortion/getTHDTopTenData?topNum=10",
|
||||
method: "POST",
|
||||
data,
|
||||
});
|
||||
}
|
||||
//电能质量污区图
|
||||
export function getPollutionSubstationData(data) {
|
||||
return request({
|
||||
url: "/harmonic-boot/PollutionSubstation/getPollutionSubstationData",
|
||||
method: "POST",
|
||||
data,
|
||||
});
|
||||
}
|
||||
//实时告警信息
|
||||
export function getExceptionDeviceInfoAsDept(data) {
|
||||
return request({
|
||||
url: "/device-boot/deviceInfo/getExceptionDeviceInfoAsDept",
|
||||
method: "POST",
|
||||
data,
|
||||
});
|
||||
}
|
||||
//按部门获取终端设备总数，在线数，在线率
|
||||
export function getDeptDeviceDetail(data) {
|
||||
return request({
|
||||
url: "/device-boot/deviceInfo/getDeptDeviceDetail",
|
||||
method: "POST",
|
||||
data,
|
||||
});
|
||||
}
|
||||
//按部门获变电站数，变电站在线数，在线率
|
||||
export function getDeptSubstationDetail(data) {
|
||||
return request({
|
||||
url: "/device-boot/deviceInfo/getDeptSubstationDetail",
|
||||
method: "POST",
|
||||
data,
|
||||
});
|
||||
}
|
||||
171
src/api/monitoringpointStatistics/echart.js
Normal file
171
src/api/monitoringpointStatistics/echart.js
Normal file
@@ -0,0 +1,171 @@
|
||||
//台账统计
|
||||
import request from "@/utils/request";
|
||||
|
||||
//获取地图点位数据
|
||||
export function getAreaLineInfo(data) {
|
||||
return request({
|
||||
url: "/event-boot/areaInfo/getAreaLineInfo",
|
||||
method: "post",
|
||||
data
|
||||
});
|
||||
}
|
||||
//ITIC SEMI 获取数据
|
||||
export function getPlot(data) {
|
||||
return request({
|
||||
url: "/event-boot/monitor/getPlot",
|
||||
method: "post",
|
||||
data
|
||||
});
|
||||
}
|
||||
//ITIC SEMI 获取数据
|
||||
export function getVoltageToleranceCurve(data) {
|
||||
return request({
|
||||
url: "/event-boot/areaAnalysis/getVoltageToleranceCurve",
|
||||
method: "post",
|
||||
data
|
||||
});
|
||||
}
|
||||
//电压暂降表及密度 DISDIP 获取数据
|
||||
export function IEC411(data) {
|
||||
return request({
|
||||
url: "/event-boot/monitor/IEC411",
|
||||
method: "post",
|
||||
data
|
||||
});
|
||||
}
|
||||
//电压暂降表及密度 IEC61000 获取数据
|
||||
export function IEC28(data) {
|
||||
return request({
|
||||
url: "/event-boot/monitor/IEC28",
|
||||
method: "post",
|
||||
data
|
||||
});
|
||||
}
|
||||
//电压暂降表及密度 IEC61000 获取数据
|
||||
export function eventDisdip(data) {
|
||||
return request({
|
||||
url: "/event-boot/monitor/eventDisdip",
|
||||
method: "post",
|
||||
data
|
||||
});
|
||||
}
|
||||
//电压暂降表及密度 暂降密度图 获取数据
|
||||
export function getCoords(data) {
|
||||
return request({
|
||||
url: "/event-boot/monitor/getCoords",
|
||||
method: "post",
|
||||
data
|
||||
});
|
||||
}
|
||||
// 暂降分布统计 左 获取数据
|
||||
export function getReasonTypeTime(data) {
|
||||
return request({
|
||||
url: "/event-boot/monitor/getReasonTypeTime",
|
||||
method: "post",
|
||||
data
|
||||
});
|
||||
}
|
||||
// 暂降分布统计 右 获取数据
|
||||
export function getStatistic(data) {
|
||||
return request({
|
||||
url: "/event-boot/monitor/getStatistic",
|
||||
method: "post",
|
||||
data
|
||||
});
|
||||
}
|
||||
export function getEventReason(data) {
|
||||
return request({
|
||||
url: "/event-boot/areaAnalysis/getEventReason",
|
||||
method: "post",
|
||||
data
|
||||
});
|
||||
}
|
||||
// 暂降分布统计 右 获取数据
|
||||
export function getProbabilityDistribution(data) {
|
||||
return request({
|
||||
url: "/event-boot/monitor/getProbabilityDistribution",
|
||||
method: "post",
|
||||
data
|
||||
});
|
||||
}
|
||||
// 事件分析 获取数据
|
||||
export function getMonitorEventAnalyseQuery(data) {
|
||||
return request({
|
||||
url: "/event-boot/monitor/getMonitorEventAnalyseQuery",
|
||||
method: "post",
|
||||
data
|
||||
});
|
||||
}
|
||||
// 事件分析 下载
|
||||
export function downloadMonitorEventWaveFile(data) {
|
||||
return request({
|
||||
url: "/event-boot/monitor/downloadMonitorEventWaveFile",
|
||||
method: "post",
|
||||
data:data.lineId,
|
||||
responseType: 'blob'
|
||||
});
|
||||
}
|
||||
// downloadWaveFile(data) {
|
||||
// return request({
|
||||
// url: '/event-boot/transient/downloadWaveFile',
|
||||
// method: 'post',
|
||||
// data:data,
|
||||
// responseType:'blob'
|
||||
// })
|
||||
// }
|
||||
// 事件分析 shushiboxi 获取数据
|
||||
export function getMonitorEventAnalyseWave(data) {
|
||||
return request({
|
||||
url: "/event-boot/transient/getTransientAnalyseWave",
|
||||
method: "post",
|
||||
data
|
||||
});
|
||||
}
|
||||
// 事件分析 获取数据
|
||||
export function getRunOnlineRateData(data) {
|
||||
return request({
|
||||
url: "/device-boot/communicate/getRunOnlineRateData",
|
||||
method: "post",
|
||||
data
|
||||
});
|
||||
}
|
||||
// 事件分析 运行状态 获取数据
|
||||
export function getComFlagInfoData(data) {
|
||||
return request({
|
||||
url: "/device-boot/communicate/getComFlagInfoData",
|
||||
method: "post",
|
||||
data
|
||||
});
|
||||
}
|
||||
// 获取片区未处理暂态事件
|
||||
export function getNoDealEvents(data) {
|
||||
return request({
|
||||
url: "/event-boot/areaInfo/getNoDealEvents",
|
||||
method: "post",
|
||||
data
|
||||
});
|
||||
}
|
||||
// 获取片区中断设备
|
||||
export function getAreaOffDev(data) {
|
||||
return request({
|
||||
url: "/device-boot/device/getAreaOffDev",
|
||||
method: "post",
|
||||
data
|
||||
});
|
||||
}
|
||||
// 获取监测点下未处理的暂降事件
|
||||
export function getNoDealEventsByLineId(params) {
|
||||
return request({
|
||||
url: "/event-boot/areaInfo/getNoDealEventsByLineId",
|
||||
method: "get",
|
||||
params
|
||||
});
|
||||
}
|
||||
// 获取监测点下未处理的暂降事件
|
||||
export function getTransientDetailById(data) {
|
||||
return request({
|
||||
url: "/event-boot/rmpEventDetail/getTransientDetailById",
|
||||
method: "post",
|
||||
params:data
|
||||
});
|
||||
}
|
||||
11
src/assets/common.css
Normal file
11
src/assets/common.css
Normal file
@@ -0,0 +1,11 @@
|
||||
* {
|
||||
box-sizing: border-box;
|
||||
}
|
||||
html,
|
||||
body {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding: 0px;
|
||||
margin: 0px;
|
||||
}
|
||||
|
||||
15
src/assets/common.less
Normal file
15
src/assets/common.less
Normal file
@@ -0,0 +1,15 @@
|
||||
|
||||
*{
|
||||
box-sizing: border-box;
|
||||
}
|
||||
html,
|
||||
body {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
padding: 0px;
|
||||
margin: 0px;
|
||||
|
||||
}
|
||||
.el-dialog__body{
|
||||
padding: 10px;
|
||||
}
|
||||
BIN
src/assets/img/dw.png
Normal file
BIN
src/assets/img/dw.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.2 KiB |
BIN
src/assets/img/point.png
Normal file
BIN
src/assets/img/point.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 3.1 KiB |
17
src/main.js
Normal file
17
src/main.js
Normal file
@@ -0,0 +1,17 @@
|
||||
import Vue from "vue";
|
||||
import App from "./App.vue";
|
||||
|
||||
import "./assets/common.less";
|
||||
import "echarts-gl";
|
||||
import dataV from "@jiaminghi/data-view";
|
||||
import axios from "axios";
|
||||
import router from "./router";
|
||||
Vue.config.productionTip = false;
|
||||
|
||||
import ElementUI from "element-ui";
|
||||
import "element-ui/lib/theme-chalk/index.css";
|
||||
Vue.prototype.$axios = axios;
|
||||
Vue.use(ElementUI);
|
||||
Vue.use(dataV);
|
||||
|
||||
new Vue({ router, render: (h) => h(App) }).$mount("#app");
|
||||
20
src/router/index.js
Normal file
20
src/router/index.js
Normal file
@@ -0,0 +1,20 @@
|
||||
import Vue from "vue";
|
||||
import VueRouter from "vue-router";
|
||||
|
||||
Vue.use(VueRouter);
|
||||
|
||||
const routes = [
|
||||
{ path: "/", redirect: "/homePage" },
|
||||
{
|
||||
path: "/homePage",
|
||||
name: "homePage",
|
||||
component: () => import("@/views/center/index.vue"),
|
||||
},
|
||||
];
|
||||
|
||||
const router = new VueRouter({
|
||||
mode: "history",
|
||||
routes,
|
||||
});
|
||||
|
||||
export default router;
|
||||
48
src/utils/dicData.js
Normal file
48
src/utils/dicData.js
Normal file
@@ -0,0 +1,48 @@
|
||||
//dictypeData = eval("(" + dictypeData + ")");
|
||||
//console.log(dictypeData)
|
||||
|
||||
function dicData(code, arr, type) {
|
||||
var dicArr = [];
|
||||
if (type) {
|
||||
dicArr.push({ name: "全部", id: "" });
|
||||
}
|
||||
let dictypeData = JSON.parse(window.localStorage.getItem("dictData")).state.basic;
|
||||
for (var i = 0; i < dictypeData.length; i++) {
|
||||
if (dictypeData[i].code == code) {
|
||||
var data = dictypeData[i].children;
|
||||
if (arr.length == 0) {
|
||||
for (var j = 0; j < data.length; j++) {
|
||||
let p = {
|
||||
name: data[j].name,
|
||||
id: data[j].id,
|
||||
code: data[j].code,
|
||||
label: data[j].name,
|
||||
gvalue: data[j].value,
|
||||
value: data[j].id,
|
||||
sort: data[j].sort,
|
||||
};
|
||||
dicArr.push(p);
|
||||
}
|
||||
} else if (arr.length > 0) {
|
||||
for (var j = 0; j < data.length; j++) {
|
||||
if (arr.indexOf(data[j].code) == -1) {
|
||||
let p = {
|
||||
name: data[j].name,
|
||||
id: data[j].id,
|
||||
code: data[j].code,
|
||||
value: data[j].id,
|
||||
gvalue: data[j].value,
|
||||
label: data[j].name,
|
||||
sort: data[j].sort,
|
||||
};
|
||||
dicArr.push(p);
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
return dicArr.sort((a, b) => {
|
||||
return a.sort - b.sort;
|
||||
});
|
||||
}
|
||||
export { dicData };
|
||||
28
src/utils/request.js
Normal file
28
src/utils/request.js
Normal file
@@ -0,0 +1,28 @@
|
||||
import axios from "axios";
|
||||
//拦截器
|
||||
|
||||
const service = axios.create({
|
||||
baseURL: "/api",
|
||||
timeout: 150000,
|
||||
});
|
||||
axios.defaults.headers["Content-Type"] = "application/json;charset=utf-8";
|
||||
|
||||
service.interceptors.request.use(
|
||||
(config) => {
|
||||
// debugger
|
||||
|
||||
config.headers['Authorization'] = 'Bearer ' + JSON.parse(window.localStorage.getItem('adminInfo')).access_token; // 请求头带上token token要在登录的时候保存在localStorage中
|
||||
// config.headers["Authorization"] =
|
||||
// "bearer eyJhbGciOiJSUzI1NiIsInR5cCI6IkpXVCJ9.eyJ1c2VySW5kZXgiOiIyMTg3MTY2YjU1MDU0YjNjOGQyOTBkYTMzNGMxMGJmYiIsInVzZXJfbmFtZSI6ImdoYWluYW4iLCJzY29wZSI6WyJhbGwiXSwibmlja25hbWUiOiLnrqHkv4oiLCJ1c2VyVHlwZSI6MSwiZGVwdEluZGV4IjoiMDJkMWI0ZTE2ODA0MTNlYjcyZjNmYTYzZDQ2YzQ5NmMiLCJleHAiOjE3OTkwMjAwNjksImF1dGhvcml0aWVzIjpbImhuYWRtaW4iXSwianRpIjoiNjcwNTEyMmMtMDUyOS00MzUyLThhZWUtZDM1ODFiZmUyMTRiIiwiY2xpZW50X2lkIjoibmpjbnRlc3QiLCJoZWFkU2N1bHB0dXJlIjpudWxsfQ.Gce6c0_73yyGrK9sIDDuNfw-ZXv3pQ8WwsGg8J_EtaPgS3cp8Lbvr1SWt_e8NsVjG24DG6cCPzZC9zPq7sQFWSsAOaf_K2cCZZ9FaZVOGq2ZPjtyOW2jKsFdNrpO0KXi2xVVnUkz7aFB_14lP6okb5nqJSQVtz3bWHKsLtsdczdGeEdhOJh6I2TeTLxn7KSELBu0U-U1qpKc-2LcBK6l-QSMUt7ZGB1Kfms_I9fd6iYrTQyPIGfdHHgvnqqRnplFNAjJlv5CDjWyPFazbJM_wXfAcdoD_qFgzIm3i02vhhpXee9MOUWcVL7pGeXiDDXg4qwhOJe2NsoXWiQOax3ltQ";
|
||||
// NProgress.done()
|
||||
return config;
|
||||
},
|
||||
(error) => {
|
||||
return Promise.reject(error);
|
||||
}
|
||||
);
|
||||
service.interceptors.response.use(({ config, data }) => {
|
||||
const { code, message } = data;
|
||||
return data;
|
||||
});
|
||||
export default service;
|
||||
822
src/views/Timeinterval/index.vue
Normal file
822
src/views/Timeinterval/index.vue
Normal file
@@ -0,0 +1,822 @@
|
||||
<template>
|
||||
<div>
|
||||
<el-form :inline="true" :model="ruleForm" class="demo-form-inline">
|
||||
<el-form-item label="时间间隔:">
|
||||
<el-select
|
||||
style="width: 90px"
|
||||
v-model="intervald"
|
||||
@change="interchange"
|
||||
placeholder="请选择"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in timeOptions"
|
||||
:key="item.value"
|
||||
:label="item.label"
|
||||
:value="item.value"
|
||||
>
|
||||
</el-option>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-date-picker
|
||||
style="width: 250px"
|
||||
:disabled="disabled"
|
||||
:readonly="pickDisabled"
|
||||
:clearable="false"
|
||||
v-model="timeValue"
|
||||
:picker-options="pickerOptions"
|
||||
type="daterange"
|
||||
value-format="yyyy-MM-dd"
|
||||
range-separator="至"
|
||||
start-placeholder="开始日期"
|
||||
end-placeholder="结束日期"
|
||||
align="right"
|
||||
>
|
||||
</el-date-picker>
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button
|
||||
:disabled="backDisabled"
|
||||
type="primary"
|
||||
icon="el-icon-d-arrow-left"
|
||||
@click="preClick"
|
||||
></el-button>
|
||||
<el-button @click="nowTime" class="el-icon-video-pause" type="primary"
|
||||
>当前</el-button
|
||||
>
|
||||
<el-button
|
||||
:disabled="preDisabled"
|
||||
type="primary"
|
||||
icon="el-icon-d-arrow-right"
|
||||
@click="back"
|
||||
></el-button>
|
||||
</el-form-item>
|
||||
<!-- <el-form-item>
|
||||
<el-button v-show="false" type="primary">导出文件</el-button>
|
||||
</el-form-item> -->
|
||||
</el-form>
|
||||
<!-- <span style="font-size: 14px; font-weight: 550">
|
||||
<span class="spanColor">间隔:</span>
|
||||
</span>
|
||||
|
||||
|
||||
|
||||
<div style="display: inline" v-if="buttonShow">
|
||||
|
||||
</div> -->
|
||||
<!-- <el-button
|
||||
v-show="buttonShow && thb"
|
||||
@click="tongbiyear"
|
||||
style="margin-left: 5px"
|
||||
type="primary"
|
||||
>同比</el-button
|
||||
>
|
||||
<el-button
|
||||
v-show="buttonShow && thb"
|
||||
@click="huangbiyear"
|
||||
style="margin-left: 5px"
|
||||
type="primary"
|
||||
>环比</el-button
|
||||
> -->
|
||||
|
||||
<!-- <el-button
|
||||
@click="querfromdata"
|
||||
type="primary"
|
||||
icon="el-icon-search"
|
||||
style="margin-left: 10px"
|
||||
>查询</el-button
|
||||
> -->
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
name: "index4",
|
||||
props: {
|
||||
name: {
|
||||
type: String,
|
||||
default: undefined,
|
||||
},
|
||||
path: {
|
||||
type: String,
|
||||
default: undefined,
|
||||
},
|
||||
tablename: {
|
||||
type: String,
|
||||
default: undefined,
|
||||
},
|
||||
interval: {
|
||||
type: Number,
|
||||
default: undefined,
|
||||
},
|
||||
type: {
|
||||
type: Number,
|
||||
default: undefined,
|
||||
},
|
||||
falg: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
query: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
thb: {
|
||||
type: Boolean,
|
||||
default: false,
|
||||
},
|
||||
timeOptions: {
|
||||
type: Array,
|
||||
default() {
|
||||
return [
|
||||
{ label: "年份", value: 1 },
|
||||
{ label: "季度", value: 2 },
|
||||
{ label: "月份", value: 3 },
|
||||
{ label: "周", value: 4 },
|
||||
// { label: "自定义", value: 5 },
|
||||
];
|
||||
},
|
||||
},
|
||||
},
|
||||
watch: {
|
||||
intervald(val) {
|
||||
if (val != 5) {
|
||||
let endTime = this.getEndTime();
|
||||
let startTime = this.getStartTime(this.intervald, endTime);
|
||||
this.timeValue = [startTime, endTime];
|
||||
this.pickDisabled = false;
|
||||
this.buttonShow = true;
|
||||
} else {
|
||||
let endTime = this.getEndTime();
|
||||
let startTime = this.getStartTime(this.intervald, endTime);
|
||||
this.timeValue = [startTime, endTime];
|
||||
this.buttonShow = false;
|
||||
this.pickDisabled = false;
|
||||
}
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
ruleForm: {},
|
||||
disabled: true,
|
||||
buttonShow: true, //向前向后按钮显示隐藏控制按钮
|
||||
pickDisabled: false, //时间组件只读控制se,
|
||||
falg1: true,
|
||||
// timeOptions: [
|
||||
// { label: "年份", value: 1 },
|
||||
// { label: "季度", value: 2 },
|
||||
// { label: "月份", value: 3 },
|
||||
// { label: "周", value: 4 },
|
||||
// // { label: "自定义", value: 5 },
|
||||
// ],
|
||||
|
||||
pickerOptions: {
|
||||
shortcuts: [
|
||||
{
|
||||
text: "最近一周",
|
||||
onClick(picker) {
|
||||
const end = new Date();
|
||||
const start = new Date();
|
||||
start.setTime(start.getTime() - 3600 * 1000 * 24 * 7);
|
||||
picker.$emit("pick", [start, end]);
|
||||
},
|
||||
},
|
||||
{
|
||||
text: "最近一个月",
|
||||
onClick(picker) {
|
||||
const end = new Date();
|
||||
const start = new Date();
|
||||
start.setTime(start.getTime() - 3600 * 1000 * 24 * 30);
|
||||
picker.$emit("pick", [start, end]);
|
||||
},
|
||||
},
|
||||
{
|
||||
text: "最近三个月",
|
||||
onClick(picker) {
|
||||
const end = new Date();
|
||||
const start = new Date();
|
||||
start.setTime(start.getTime() - 3600 * 1000 * 24 * 90);
|
||||
picker.$emit("pick", [start, end]);
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
intervald: this.interval,
|
||||
tablenamed: this.tablename,
|
||||
timeValue: [],
|
||||
timehbValue: [],
|
||||
backDisabled: false,
|
||||
preDisabled: true,
|
||||
huanbibiFalg: false,
|
||||
tonbiFalg: false,
|
||||
timeFlag: 0,
|
||||
};
|
||||
},
|
||||
created() {},
|
||||
mounted() {
|
||||
let endTime = this.getEndTime();
|
||||
let startTime = this.getStartTime(this.intervald, endTime);
|
||||
// console.log(endTime,startTime,'endtime','startTime')
|
||||
this.timeValue = [startTime, endTime];
|
||||
this.$emit("time", [startTime, endTime, this.intervald]);
|
||||
if (this.type == 2) {
|
||||
this.huangbiyear();
|
||||
} else if (!this.type) {
|
||||
this.querfromdata();
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
interchange(val) {
|
||||
let endTime = this.getEndTime();
|
||||
let startTime = this.getStartTime(this.intervald, endTime);
|
||||
// console.log(endTime,startTime,'endtime','startTime')
|
||||
this.$emit("time", [startTime, endTime, val]);
|
||||
if (val == 1 || val == 2) {
|
||||
this.timeFlag = 0;
|
||||
} else {
|
||||
this.timeFlag = 1;
|
||||
}
|
||||
// console.log(this.timeFlag);
|
||||
this.intervald = val;
|
||||
if (val == 5) {
|
||||
this.tablenamed == "tab1";
|
||||
this.disabled = false;
|
||||
} else {
|
||||
this.tablenamed == "tab2";
|
||||
this.disabled = true;
|
||||
}
|
||||
},
|
||||
// 获取当前日期，精确到日
|
||||
getEndTime() {
|
||||
var now = new Date();
|
||||
var sep = "-";
|
||||
var year = now.getFullYear();
|
||||
var month = now.getMonth() + 1;
|
||||
if (month < 10) {
|
||||
month = "0" + month;
|
||||
}
|
||||
var date = now.getDate();
|
||||
if (date < 10) {
|
||||
date = "0" + date;
|
||||
}
|
||||
|
||||
// 拼接当前的日期
|
||||
var endTime = year + sep + month + sep + date;
|
||||
return endTime;
|
||||
},
|
||||
// 获取起始日期
|
||||
getStartTime(interval, endTime) {
|
||||
var sep = "-";
|
||||
var arr = endTime.split("-");
|
||||
var year = arr[0];
|
||||
var month = arr[1];
|
||||
var date = arr[2];
|
||||
// 按月份间隔
|
||||
if (interval == 3) {
|
||||
date = "01";
|
||||
// 按季度间隔
|
||||
} else if (interval == 2) {
|
||||
if ((month > 0) & (month < 4)) {
|
||||
// 第一季度
|
||||
month = "01";
|
||||
date = "01";
|
||||
} else if (month > 3 && month < 7) {
|
||||
// 第二季度
|
||||
month = "04";
|
||||
date = "01";
|
||||
} else if (month > 6 && month < 10) {
|
||||
// 第三季度
|
||||
month = "07";
|
||||
date = "01";
|
||||
} else {
|
||||
// 第四季度
|
||||
month = "10";
|
||||
date = "01";
|
||||
}
|
||||
} else if (interval == 1) {
|
||||
month = "01";
|
||||
date = "01";
|
||||
} else if (interval == "半年") {
|
||||
if (month < 7) {
|
||||
month = "01";
|
||||
date = "01";
|
||||
} else {
|
||||
month = "07";
|
||||
date = "01";
|
||||
}
|
||||
} else if (interval == 4) {
|
||||
//周
|
||||
var start = new Date(year, month - 1, date);
|
||||
var dayOfWeek = start.getDay() == 0 ? 7 : start.getDay(); // 如果为周日，则置为7天
|
||||
start.setDate(start.getDate() - dayOfWeek + 1); // 计算开始时间
|
||||
|
||||
if (this.formatTime(new Date()) != endTime) {
|
||||
// 如果结束时间不是当前时间
|
||||
var end = new Date(start);
|
||||
end.setDate(end.getDate() + 6);
|
||||
// $("#endTime").val(this.formatTime(end));
|
||||
}
|
||||
|
||||
return this.formatTime(start);
|
||||
}
|
||||
|
||||
var startTime = year + sep + month + sep + date;
|
||||
return startTime;
|
||||
},
|
||||
// 时间格式化
|
||||
formatTime(time) {
|
||||
return (
|
||||
time.getFullYear() +
|
||||
"-" +
|
||||
(time.getMonth() + 1 < 10 ? "0" : "") +
|
||||
(time.getMonth() + 1) +
|
||||
"-" +
|
||||
(time.getDate() < 10 ? "0" : "") +
|
||||
time.getDate()
|
||||
);
|
||||
},
|
||||
//向前
|
||||
preClick() {
|
||||
let interval = this.intervald;
|
||||
let startTime = this.timeValue[0];
|
||||
let endTime = this.timeValue[1];
|
||||
let year = parseInt(startTime.substring(0, 4));
|
||||
let month = parseInt(startTime.substring(5, 7));
|
||||
let date = parseInt(startTime.substring(8, 10));
|
||||
//按月
|
||||
if (interval == 3) {
|
||||
// 换年份
|
||||
if (month == 1) {
|
||||
year = year - 1;
|
||||
startTime = year + "-12-01";
|
||||
endTime = year + "-12-31";
|
||||
} else if (month <= 10) {
|
||||
month = month - 1;
|
||||
startTime = year + "-0" + month + "-01";
|
||||
let day = this.getDays(year, month);
|
||||
endTime = year + "-0" + month + "-" + day;
|
||||
} else {
|
||||
month = month - 1;
|
||||
startTime = year + "-" + month + "-01";
|
||||
let day = this.getDays(year, month);
|
||||
endTime = year + "-" + month + "-" + day;
|
||||
}
|
||||
//按周
|
||||
} else if (interval == 4) {
|
||||
//根据开始时间推
|
||||
let start = new Date(year, month - 1, date);
|
||||
start.setDate(start.getDate() - 7);
|
||||
startTime = this.formatTime(start);
|
||||
var end = new Date(start);
|
||||
end.setDate(start.getDate() + 6);
|
||||
endTime = this.formatTime(end);
|
||||
//按季度
|
||||
} else if (interval == 2) {
|
||||
// 换年份
|
||||
if (month == 1) {
|
||||
year = year - 1;
|
||||
startTime = year + "-10-01";
|
||||
endTime = year + "-12-31";
|
||||
} else {
|
||||
// 还是本年
|
||||
month = month - 3;
|
||||
startTime = year + "-0" + month + "-01";
|
||||
month = month + 2;
|
||||
var day = this.getDays(year, month);
|
||||
endTime = year + "-0" + month + "-" + day;
|
||||
}
|
||||
//自定义
|
||||
} else if (interval == 5) {
|
||||
//按年
|
||||
} else if (interval == 1) {
|
||||
year = year - 1;
|
||||
startTime = year + "-01-01";
|
||||
endTime = year + "-12-31";
|
||||
} else if (interval == 6) {
|
||||
if (month <= 6) {
|
||||
year = year - 1;
|
||||
startTime = year + "-07-01";
|
||||
endTime = year + "-12-31";
|
||||
} else {
|
||||
startTime = year + "-01-01";
|
||||
endTime = year + "-06-30";
|
||||
}
|
||||
}
|
||||
this.timeValue = [startTime, endTime];
|
||||
|
||||
// 判断向后键的状态
|
||||
var temp = this.getEndTime();
|
||||
this.timeStatus(temp, endTime);
|
||||
},
|
||||
//向后
|
||||
back() {
|
||||
let interval = this.intervald;
|
||||
let startTime = this.timeValue[0];
|
||||
let endTime = this.timeValue[1];
|
||||
let year = parseInt(startTime.substring(0, 4));
|
||||
let month = parseInt(startTime.substring(5, 7));
|
||||
let date = parseInt(startTime.substring(8, 10));
|
||||
var now = new Date();
|
||||
// 获取当前年份
|
||||
var presentY = now.getFullYear();
|
||||
// 获取当前月份
|
||||
var presentM = now.getMonth() + 1;
|
||||
// 获取当前日期
|
||||
var presentD = now.getDate();
|
||||
if (interval == 3) {
|
||||
if (month == 12) {
|
||||
year = year + 1;
|
||||
// 年份进位后，大于当前的年份，是不科学的
|
||||
if (presentY < year) {
|
||||
startTime = presentY + "-12-01";
|
||||
if (presentD < 10) {
|
||||
endTime = presentY + "-12" + "-0" + presentD;
|
||||
} else {
|
||||
endTime = presentY + "-12" + "-" + presentD;
|
||||
}
|
||||
// 年份进位后，等于当前的年份
|
||||
} else if (presentY == year) {
|
||||
startTime = year + "-01-01";
|
||||
if (presentM > 1) {
|
||||
endTime = year + "-01-31";
|
||||
} else {
|
||||
if (presentD < 10) {
|
||||
endTime = year + "-01" + "-0" + presentD;
|
||||
} else {
|
||||
endTime = year + "-01" + "-" + presentD;
|
||||
}
|
||||
}
|
||||
// 年份进位后，依旧小于当前的年份
|
||||
} else {
|
||||
startTime = year + "-01-01";
|
||||
endTime = year + "-01-31";
|
||||
}
|
||||
} else {
|
||||
month = month + 1;
|
||||
// 年份等于当前年份
|
||||
if (presentY == year) {
|
||||
// 月份超过当前月份，是不科学的
|
||||
if (month >= presentM) {
|
||||
if (presentM < 10) {
|
||||
startTime = year + "-0" + presentM + "-01";
|
||||
if (presentD < 10) {
|
||||
endTime = year + "-0" + presentM + "-0" + presentD;
|
||||
} else {
|
||||
endTime = year + "-0" + presentM + "-" + presentD;
|
||||
}
|
||||
} else {
|
||||
startTime = year + "-" + presentM + "-01";
|
||||
if (presentD < 10) {
|
||||
endTime = year + "-" + presentM + "-0" + presentD;
|
||||
} else {
|
||||
endTime = year + "-" + presentM + "-" + presentD;
|
||||
}
|
||||
}
|
||||
} else {
|
||||
if (month < 10) {
|
||||
startTime = year + "-0" + month + "-01";
|
||||
var day = this.getDays(year, month);
|
||||
endTime = year + "-0" + month + "-" + day;
|
||||
} else {
|
||||
startTime = year + "-" + month + "-01";
|
||||
var day = this.getDays(year, month);
|
||||
endTime = year + "-" + month + "-" + day;
|
||||
}
|
||||
}
|
||||
// 年份小于当前的年份
|
||||
} else {
|
||||
if (month < 10) {
|
||||
startTime = year + "-0" + month + "-01";
|
||||
var day = this.getDays(year, month);
|
||||
endTime = year + "-0" + month + "-" + day;
|
||||
} else {
|
||||
startTime = year + "-" + month + "-01";
|
||||
var day = this.getDays(year, month);
|
||||
endTime = year + "-" + month + "-" + day;
|
||||
}
|
||||
}
|
||||
}
|
||||
} else if (interval == 2) {
|
||||
// 前进需要年份进位
|
||||
if (month == 10) {
|
||||
year = year + 1;
|
||||
// 年份进位后大于当前年份是不科学的
|
||||
if (year > presentY) {
|
||||
startTime = presentY + "-10-01";
|
||||
if (presentD < 10) {
|
||||
endTime = year + "-" + presentM + "-0" + presentD;
|
||||
} else {
|
||||
endTime = year + "-" + presentM + "-" + presentD;
|
||||
}
|
||||
} else if (year == presentY) {
|
||||
startTime = year + "-01-01";
|
||||
// 当前月份大约3月份
|
||||
if (presentM > 3) {
|
||||
endTime = year + "-03-31";
|
||||
} else {
|
||||
// 当前月份也在第一季度里
|
||||
if (presentD < 10) {
|
||||
endTime = year + "-0" + presentM + "-0" + presentD;
|
||||
} else {
|
||||
endTime = year + "-0" + presentM + "-" + presentD;
|
||||
}
|
||||
}
|
||||
} else {
|
||||
startTime = year + "-01-01";
|
||||
endTime = year + "-03-31";
|
||||
}
|
||||
} else {
|
||||
month = month + 3;
|
||||
// 季度进位后，超过当前月份是不科学的
|
||||
if (year == presentY) {
|
||||
if (month >= presentM) {
|
||||
// 当季度进位后大于当前月，以当前月的时间显示季度
|
||||
if (presentM > 0 && presentM < 4) {
|
||||
// 第一季度
|
||||
startTime = year + "-01-01";
|
||||
if (presentD < 10) {
|
||||
endTime = year + "-0" + presentM + "-0" + presentD;
|
||||
} else {
|
||||
endTime = year + "-0" + presentM + "-" + presentD;
|
||||
}
|
||||
} else if (presentM > 3 && presentM < 7) {
|
||||
// 第二季度
|
||||
startTime = year + "-04-01";
|
||||
if (presentD < 10) {
|
||||
endTime = year + "-0" + presentM + "-0" + presentD;
|
||||
} else {
|
||||
endTime = year + "-0" + presentM + "-" + presentD;
|
||||
}
|
||||
} else if (presentM > 6 && presentM < 10) {
|
||||
// 第三季度
|
||||
startTime = year + "-07-01";
|
||||
if (presentD < 10) {
|
||||
endTime = year + "-0" + presentM + "-0" + presentD;
|
||||
} else {
|
||||
endTime = year + "-0" + presentM + "-" + presentD;
|
||||
}
|
||||
} else {
|
||||
// 第四季度
|
||||
startTime = year + "-10-01";
|
||||
if (presentD < 10) {
|
||||
endTime = year + "-" + presentM + "-0" + presentD;
|
||||
} else {
|
||||
endTime = year + "-" + presentM + "-" + presentD;
|
||||
}
|
||||
}
|
||||
} else {
|
||||
if (month == 10) {
|
||||
startTime = year + "-" + month + "-01";
|
||||
} else {
|
||||
startTime = year + "-0" + month + "-01";
|
||||
}
|
||||
month = month + 2;
|
||||
if (month >= presentM) {
|
||||
endTime = this.getEndTime();
|
||||
} else {
|
||||
var day = this.getDays(year, month);
|
||||
endTime = year + "-" + month + "-" + day;
|
||||
}
|
||||
}
|
||||
} else {
|
||||
if (month == 10) {
|
||||
startTime = year + "-" + month + "-01";
|
||||
month = month + 2;
|
||||
var day = this.getDays(year, month);
|
||||
endTime = year + "-" + month + "-" + day;
|
||||
} else {
|
||||
startTime = year + "-0" + month + "-01";
|
||||
month = month + 2;
|
||||
var day = this.getDays(year, month);
|
||||
endTime = year + "-0" + month + "-" + day;
|
||||
}
|
||||
}
|
||||
}
|
||||
} else if (interval == 5) {
|
||||
} else if (interval == 4) {
|
||||
//根据开始时间推
|
||||
var start = new Date(year, month - 1, date);
|
||||
start.setDate(start.getDate() + 7);
|
||||
startTime = this.formatTime(start);
|
||||
var end = new Date(start);
|
||||
end.setDate(start.getDate() + 6);
|
||||
endTime = this.formatTime(end);
|
||||
|
||||
if (parseInt((end - new Date()) / 1000 / 60) > 24) {
|
||||
//相差小时大于24小时，即超过当天，置为当天日期
|
||||
endTime = this.formatTime(new Date());
|
||||
}
|
||||
} else {
|
||||
year = year + 1;
|
||||
// 年份进位后大于当前年份，是不科学的
|
||||
if (year >= presentY) {
|
||||
startTime = presentY + "-01-01";
|
||||
if (presentM < 10) {
|
||||
if (presentD < 10) {
|
||||
endTime = presentY + "-0" + presentM + "-0" + presentD;
|
||||
} else {
|
||||
endTime = presentY + "-0" + presentM + "-" + presentD;
|
||||
}
|
||||
} else {
|
||||
endTime = presentY + "-" + presentM + "-" + presentD;
|
||||
}
|
||||
} else {
|
||||
startTime = year + "-01-01";
|
||||
endTime = year + "-12-31";
|
||||
}
|
||||
}
|
||||
|
||||
this.timeValue = [startTime, endTime];
|
||||
|
||||
// 判断向后键的状态
|
||||
var temp = this.getEndTime();
|
||||
this.timeStatus(temp, endTime);
|
||||
},
|
||||
//当前按钮点击事件
|
||||
nowTime() {
|
||||
let interval = this.intervald;
|
||||
let endTime = this.getEndTime();
|
||||
let startTime = this.getStartTime(interval, endTime);
|
||||
this.timeValue = [startTime, endTime];
|
||||
// 判断向后键的状态
|
||||
let temp = this.getEndTime();
|
||||
this.timeStatus(temp, endTime);
|
||||
},
|
||||
//判断向后按钮
|
||||
timeStatus(temp, endTime) {
|
||||
// 判断next按钮的状态
|
||||
if (temp == endTime) {
|
||||
this.preDisabled = true;
|
||||
} else {
|
||||
this.preDisabled = false;
|
||||
}
|
||||
},
|
||||
// 获取月份的天数
|
||||
getDays(year, month) {
|
||||
let max = new Date(year, month, 0).getDate();
|
||||
return max;
|
||||
},
|
||||
querfromdata() {
|
||||
//type用于区分是按钮触发还是钩子函数触发 1按钮触发 underfind 钩子触发
|
||||
if (!this.type) {
|
||||
var data = this.timeValue;
|
||||
var timehbValue = "";
|
||||
this.$emit("querfromdata", data, timehbValue, this.intervald);
|
||||
} else if (this.type == 2) {
|
||||
this.huangbiyear();
|
||||
}
|
||||
},
|
||||
goto() {
|
||||
this.$router.push({
|
||||
path: "/harmonic-boot/algorithm",
|
||||
query: { name: this.name, path: this.path },
|
||||
});
|
||||
},
|
||||
//环比
|
||||
huangbiyear() {
|
||||
this.huanbibiFalg = true;
|
||||
let interval = this.intervald;
|
||||
let startTime = this.timeValue[0];
|
||||
let endTime = this.timeValue[1];
|
||||
let year = parseInt(startTime.substring(0, 4));
|
||||
let month = parseInt(startTime.substring(5, 7));
|
||||
let date = parseInt(startTime.substring(8, 10));
|
||||
//按月
|
||||
if (interval == 3) {
|
||||
// 换年份
|
||||
if (month == 1) {
|
||||
year = year - 1;
|
||||
startTime = year + "-12-01";
|
||||
endTime = year + "-12-31";
|
||||
} else if (month <= 10) {
|
||||
month = month - 1;
|
||||
startTime = year + "-0" + month + "-01";
|
||||
let day = this.getDays(year, month);
|
||||
endTime = year + "-0" + month + "-" + day;
|
||||
} else {
|
||||
month = month - 1;
|
||||
startTime = year + "-" + month + "-01";
|
||||
let day = this.getDays(year, month);
|
||||
endTime = year + "-" + month + "-" + day;
|
||||
}
|
||||
//按周
|
||||
} else if (interval == 4) {
|
||||
//根据开始时间推
|
||||
let start = new Date(year, month - 1, date);
|
||||
start.setDate(start.getDate() - 7);
|
||||
startTime = this.formatTime(start);
|
||||
var end = new Date(start);
|
||||
end.setDate(start.getDate() + 6);
|
||||
endTime = this.formatTime(end);
|
||||
//按季度
|
||||
} else if (interval == 2) {
|
||||
// 换年份
|
||||
if (month == 1) {
|
||||
year = year - 1;
|
||||
startTime = year + "-10-01";
|
||||
endTime = year + "-12-31";
|
||||
} else {
|
||||
// 还是本年
|
||||
month = month - 3;
|
||||
startTime = year + "-0" + month + "-01";
|
||||
month = month + 2;
|
||||
var day = this.getDays(year, month);
|
||||
endTime = year + "-0" + month + "-" + day;
|
||||
}
|
||||
//自定义
|
||||
} else if (interval == 5) {
|
||||
//按年
|
||||
} else if (interval == 1) {
|
||||
year = year - 1;
|
||||
startTime = year + "-01-01";
|
||||
endTime = year + "-12-31";
|
||||
} else if (interval == 6) {
|
||||
if (month <= 6) {
|
||||
year = year - 1;
|
||||
startTime = year + "-07-01";
|
||||
endTime = year + "-12-31";
|
||||
} else {
|
||||
startTime = year + "-01-01";
|
||||
endTime = year + "-06-30";
|
||||
}
|
||||
}
|
||||
this.timehbValue = [startTime, endTime];
|
||||
var data = this.timeValue;
|
||||
var timehbValue = this.timehbValue;
|
||||
// debugger
|
||||
this.$emit("querfromdata", data, timehbValue, interval);
|
||||
// 判断向后键的状态
|
||||
// var temp = this.getEndTime();
|
||||
//this.timeStatus(temp, endTime);
|
||||
},
|
||||
//同比
|
||||
tongbiyear() {
|
||||
this.tonbiFalg = true;
|
||||
let interval = this.intervald;
|
||||
let startTime = this.timeValue[0];
|
||||
let endTime = this.timeValue[1];
|
||||
let year = parseInt(startTime.substring(0, 4));
|
||||
let month = parseInt(startTime.substring(5, 7));
|
||||
let date = parseInt(startTime.substring(8, 10));
|
||||
//按月
|
||||
if (interval == 3) {
|
||||
year = year - 1;
|
||||
if (month <= 10) {
|
||||
startTime = year + "-0" + month + "-01";
|
||||
let day = this.getDays(year, month);
|
||||
endTime = year + "-0" + month + "-" + day;
|
||||
} else {
|
||||
startTime = year + "-" + month + "-01";
|
||||
let day = this.getDays(year, month);
|
||||
endTime = year + "-" + month + "-" + day;
|
||||
}
|
||||
//按周
|
||||
} else if (interval == 4) {
|
||||
//根据开始时间推
|
||||
let start = new Date(year - 1, month, date);
|
||||
start.setDate(start.getDate() - 7);
|
||||
startTime = this.formatTime(start);
|
||||
var end = new Date(start);
|
||||
end.setDate(start.getDate() + 6);
|
||||
endTime = this.formatTime(end);
|
||||
//按季度
|
||||
} else if (interval == 2) {
|
||||
year = year - 1;
|
||||
if (month < 10) {
|
||||
startTime = year + "-0" + month + "-01";
|
||||
} else {
|
||||
startTime = year + "-" + month + "-01";
|
||||
}
|
||||
month = month + 2;
|
||||
if (month <= 10) {
|
||||
var day = this.getDays(year, month);
|
||||
endTime = year + "-0" + month + "-" + day;
|
||||
} else {
|
||||
var day = this.getDays(year, month);
|
||||
endTime = year + "-" + month + "-" + day;
|
||||
}
|
||||
//自定义
|
||||
} else if (interval == 5) {
|
||||
//按年
|
||||
} else if (interval == 1) {
|
||||
year = year - 1;
|
||||
startTime = year + "-01-01";
|
||||
endTime = year + "-12-31";
|
||||
} else if (interval == 6) {
|
||||
if (month <= 6) {
|
||||
year = year - 1;
|
||||
startTime = year + "-07-01";
|
||||
endTime = year + "-12-31";
|
||||
} else {
|
||||
startTime = year + "-01-01";
|
||||
endTime = year + "-06-30";
|
||||
}
|
||||
}
|
||||
this.timehbValue = [startTime, endTime];
|
||||
var data = this.timeValue;
|
||||
var timehbValue = this.timehbValue;
|
||||
this.$emit("querfromdata", data, timehbValue, interval);
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
283
src/views/center/components/DataCenter.vue
Normal file
283
src/views/center/components/DataCenter.vue
Normal file
@@ -0,0 +1,283 @@
|
||||
<template>
|
||||
<div class="box">
|
||||
<div class="boxTop" ref="boxTop">
|
||||
<img
|
||||
class="img"
|
||||
src="../images/369a8784c99e23f956099a59f7bdfa1.png"
|
||||
alt=""
|
||||
srcset=""
|
||||
/>
|
||||
<span>数据中心</span>
|
||||
<div class="divSpan">
|
||||
∣<span @click="tab1" :style="{ color: flag == 0 ? '#07d8fd' : '#fff' }"
|
||||
>产品系统介绍</span
|
||||
>
|
||||
∣
|
||||
<span @click="tab2" :style="{ color: flag == 1 ? '#07d8fd' : '#fff' }"
|
||||
>产品视频介绍</span
|
||||
>
|
||||
</div>
|
||||
</div>
|
||||
<div class="boxB" style="height: 100%" ref="box" v-show="show">
|
||||
<!-- <img id="img" @click="imgClick" src="@/assets/pdf.png" /> -->
|
||||
<!-- ppt -->
|
||||
<div
|
||||
class="divImg"
|
||||
v-for="item in PPTList"
|
||||
:key="item.id"
|
||||
@click="imgClick(item)"
|
||||
>
|
||||
<img class="imgs" :src="item.picUrl" />
|
||||
<span style="color: rgb(7, 216, 253)">{{ item.resourceName }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="boxB" style="height: 100%" v-show="!show">
|
||||
<!-- mp4 -->
|
||||
<div
|
||||
class="divImg"
|
||||
v-for="item in MP4List"
|
||||
:key="item.id"
|
||||
@click="videoMp4(item)"
|
||||
>
|
||||
<img class="imgs" :src="item.picUrl" />
|
||||
<span style="color: rgb(7, 216, 253)">{{ item.resourceName }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<!-- <video v-if="showvideo"
|
||||
controls
|
||||
autoplay
|
||||
src="/device-boot/resource/play1?id=c4e4616e3aa630e5c3883807985a6cb8"
|
||||
/> -->
|
||||
<el-dialog
|
||||
:close-on-click-modal="false"
|
||||
:title="titleVideo"
|
||||
:visible.sync="showvideo"
|
||||
v-if="showvideo"
|
||||
width="90%"
|
||||
:append-to-body="true"
|
||||
>
|
||||
<!-- v-if="showvideo" -->
|
||||
<video style="height: 85vh" controls="controls" autoplay :src="src" />
|
||||
</el-dialog>
|
||||
<!-- <el-dialog :close-on-click-modal="false"
|
||||
title="PPT目录"
|
||||
:visible.sync="dialogVisible"
|
||||
|
||||
width="60%"
|
||||
:append-to-body="true"
|
||||
>
|
||||
<div class="imgDiv" ref="imgDiv">
|
||||
<img
|
||||
id="img1"
|
||||
@click="clickImg('./static/pdf/XTJS.pdf')"
|
||||
src="@/assets/XTJS.png"
|
||||
/>
|
||||
<img
|
||||
id="img2"
|
||||
@click="clickImg('./static/pdf/XTYY.pdf')"
|
||||
src="@/assets/YYJS.png"
|
||||
/>
|
||||
</div>
|
||||
</el-dialog> -->
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { queryData, play } from "@/api/center/DropEvent.js";
|
||||
export default {
|
||||
components: {},
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
flag: 0,
|
||||
show: true,
|
||||
dialogVisible: false,
|
||||
MP4List: [],
|
||||
PPTList: [],
|
||||
src: "",
|
||||
showvideo: false,
|
||||
titleVideo: "",
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.infoZ();
|
||||
this.infoO();
|
||||
},
|
||||
|
||||
mounted() {
|
||||
// document.getElementById("img").style.height =
|
||||
// this.$refs.box.offsetHeight - this.$refs.boxTop.offsetHeight - 20 + "px";
|
||||
|
||||
// el-dialog__body
|
||||
this.tab1();
|
||||
},
|
||||
|
||||
methods: {
|
||||
infoZ() {
|
||||
queryData({
|
||||
type: 0,
|
||||
state: 0,
|
||||
}).then((res) => {
|
||||
this.PPTList = res.data;
|
||||
});
|
||||
},
|
||||
infoO() {
|
||||
queryData({
|
||||
type: 1,
|
||||
state: 0,
|
||||
}).then((res) => {
|
||||
this.MP4List = res.data;
|
||||
});
|
||||
},
|
||||
async videoMp4(e) {
|
||||
let message = null;
|
||||
message = this.$message({
|
||||
showClose: true,
|
||||
message: " 视频加载中，请稍等......",
|
||||
iconClass: "el-icon-loading",
|
||||
duration: 0,
|
||||
});
|
||||
this.titleVideo = e.resourceName;
|
||||
await play({
|
||||
id: e.id,
|
||||
})
|
||||
.then((res) => {
|
||||
this.src = window.URL.createObjectURL(res);
|
||||
message.close();
|
||||
})
|
||||
.catch(() => {
|
||||
message.close();
|
||||
});
|
||||
this.showvideo = true;
|
||||
},
|
||||
async imgClick(e) {
|
||||
// await play({
|
||||
// id: e.id,
|
||||
// }).then((res) => {
|
||||
window.open(e.resUrl);
|
||||
// });
|
||||
// let height = document.getElementsByClassName("el-dialog__body");
|
||||
|
||||
// setTimeout(() => {
|
||||
// let height =
|
||||
// document.getElementsByClassName("el-dialog__body")[0].offsetHeight +
|
||||
// "px";
|
||||
// document.getElementById("img1").style.height = height;
|
||||
// document.getElementById("img2").style.height = height;
|
||||
// }, 100);
|
||||
},
|
||||
clickImg(e) {
|
||||
let test = window.open(e); // 直接写成这样的地址
|
||||
},
|
||||
tab1() {
|
||||
this.infoZ();
|
||||
this.flag = 0;
|
||||
this.show = true;
|
||||
},
|
||||
tab2() {
|
||||
this.infoO();
|
||||
this.flag = 1;
|
||||
this.show = false;
|
||||
},
|
||||
},
|
||||
watch: {},
|
||||
};
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
@import url("../css/home.less");
|
||||
@font-face {
|
||||
font-family: sszh;
|
||||
src: url("../fonts/sszh.ttf"); /* IE9+ */
|
||||
}
|
||||
.box {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
.boxTop {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 8%;
|
||||
font-family: "\5FAE\8F6F\96C5\9ED1";
|
||||
font-size: 0.85rem;
|
||||
line-height: 8%;
|
||||
// background-color: #29707f;
|
||||
letter-spacing: 1px;
|
||||
color: #07d8fd;
|
||||
cursor: pointer;
|
||||
background: linear-gradient(225deg, transparent 10px, #29707f 0) top right;
|
||||
.img {
|
||||
height: 100%;
|
||||
padding: 0 1.5%;
|
||||
cursor: pointer;
|
||||
}
|
||||
.divSpan {
|
||||
padding-left: 5%;
|
||||
font-size: 0.85rem;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
.boxBot {
|
||||
height: 90%;
|
||||
// background-color: rgb(41, 16, 16);
|
||||
}
|
||||
.boxB {
|
||||
padding: 10px;
|
||||
height: 90% !important;
|
||||
width: 100%;
|
||||
/*把背景图片放大到适合元素容器的尺寸，图片比例不变*/
|
||||
background-size: cover;
|
||||
position: absolute;
|
||||
display: flex;
|
||||
flex-wrap: wrap;
|
||||
// justify-content: space-around;
|
||||
left: 0;
|
||||
top: 9%;
|
||||
}
|
||||
.divImg {
|
||||
height: 80px !important;
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
align-items: center;
|
||||
margin-left: 1%;
|
||||
}
|
||||
.imgs {
|
||||
vertical-align: bottom;
|
||||
cursor: pointer; //鼠标滑过变成小手
|
||||
height: 100% !important;
|
||||
}
|
||||
}
|
||||
::v-deep .el-dialog {
|
||||
// background-color: transparent;
|
||||
border: 1px solid #1697de;
|
||||
background-color: rgba(33, 57, 83, 0.6);
|
||||
|
||||
.el-dialog__header {
|
||||
// background-color: transparent ;
|
||||
background-color: rgba(33, 57, 83, 0.6);
|
||||
|
||||
border-bottom: 1px solid #1697de;
|
||||
}
|
||||
.el-dialog__title {
|
||||
line-height: 24px;
|
||||
font-size: 18px;
|
||||
color: rgb(7, 216, 253);
|
||||
}
|
||||
}
|
||||
.imgDiv {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
justify-content: space-around;
|
||||
img {
|
||||
width: 45%;
|
||||
vertical-align: bottom;
|
||||
cursor: pointer; //鼠标滑过变成小手
|
||||
}
|
||||
}
|
||||
::v-deep .el-dialog {
|
||||
margin-top: 2% !important;
|
||||
}
|
||||
::v-deep .el-dialog__body {
|
||||
padding: 10px;
|
||||
max-height: none !important;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
}
|
||||
</style>
|
||||
320
src/views/center/components/DataSize.vue
Normal file
320
src/views/center/components/DataSize.vue
Normal file
@@ -0,0 +1,320 @@
|
||||
<template>
|
||||
<div class="box">
|
||||
<div class="boxTop">
|
||||
<img class="img" src="../images/GM.png" alt="" srcset="" />
|
||||
<span>数据规模</span>
|
||||
<div class="total">
|
||||
总计:<span>{{ total }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="boxBot" ref="Echarts">
|
||||
<div
|
||||
id="echart1"
|
||||
style="width: 100%; height: 100%"
|
||||
v-loading="isLoading"
|
||||
></div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { getDataScale } from "@/api/center/DropEvent.js";
|
||||
|
||||
export default {
|
||||
components: {},
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
zoom: undefined, //图表焦点校验
|
||||
h: undefined,
|
||||
isLoading: false,
|
||||
total: 0,
|
||||
myChart: null,
|
||||
time: null,
|
||||
};
|
||||
},
|
||||
created() {},
|
||||
|
||||
mounted() {
|
||||
this.zoom = 1 / document.body.style.zoom;
|
||||
window.addEventListener("resize", () => {
|
||||
this.zoom = 1 / document.body.style.zoom;
|
||||
});
|
||||
this.$nextTick(() => {
|
||||
this.province();
|
||||
setInterval(() => {
|
||||
clearInterval(this.time);
|
||||
this.province();
|
||||
}, 60000 * 5);
|
||||
});
|
||||
},
|
||||
|
||||
methods: {
|
||||
//echarts图
|
||||
async province() {
|
||||
this.isLoading = true;
|
||||
var xData = [];
|
||||
var yData = [];
|
||||
const data = [];
|
||||
await getDataScale({
|
||||
deptIndex: "1",
|
||||
searchBeginTime: "2022-01-01",
|
||||
searchEndTime: "2022-01-01",
|
||||
}).then((res) => {
|
||||
res.data.forEach((item, i) => {
|
||||
this.total = this.total + item.dataStatis;
|
||||
if (i != 0) {
|
||||
item.timeId = item.timeId.slice(5);
|
||||
}
|
||||
xData.push(item.timeId);
|
||||
yData.push(item.dataStatis);
|
||||
});
|
||||
});
|
||||
let _this = this;
|
||||
let echarts = require("echarts");
|
||||
if (_this.myChart != null) {
|
||||
_this.myChart.dispose();
|
||||
}
|
||||
let domID1 = document.getElementById("echart1");
|
||||
setTimeout(() => {
|
||||
(domID1.style.width = this.$refs.Echarts.offsetWidth + "px"),
|
||||
(domID1.style.height = this.$refs.Echarts.offsetHeight + "px");
|
||||
}, 0);
|
||||
_this.myChart = echarts.init(domID1);
|
||||
this.isLoading = false;
|
||||
let option = {
|
||||
//backgroundColor:'#12193a',
|
||||
color: ["#f0c725", "#16f892"],
|
||||
title: {
|
||||
left: "center",
|
||||
text: "南京灿能数据规模变化",
|
||||
textStyle: {
|
||||
color: "#FFFFFF",
|
||||
fontSize: "14",
|
||||
},
|
||||
},
|
||||
tooltip: {
|
||||
trigger: "axis",
|
||||
axisPointer: {
|
||||
// 坐标轴指示器，坐标轴触发有效
|
||||
type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
|
||||
},
|
||||
},
|
||||
legend: {
|
||||
data: ["语文"],
|
||||
x: "center",
|
||||
top: "25",
|
||||
textStyle: {
|
||||
color: "#c1cadf",
|
||||
fontSize: 10,
|
||||
},
|
||||
},
|
||||
grid: {
|
||||
left: "1%",
|
||||
right: "6.5%",
|
||||
top: "16%",
|
||||
bottom: "0%",
|
||||
containLabel: true,
|
||||
},
|
||||
toolbox: {
|
||||
show: true,
|
||||
orient: "vertical",
|
||||
x: "right",
|
||||
y: "center",
|
||||
},
|
||||
xAxis: [
|
||||
{
|
||||
type: "category",
|
||||
boundaryGap: false,
|
||||
data: xData,
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: "#00ffff",
|
||||
},
|
||||
},
|
||||
axisLabel: {
|
||||
show: true,
|
||||
color: "#00ffff",
|
||||
},
|
||||
},
|
||||
],
|
||||
yAxis: [
|
||||
{
|
||||
type: "value",
|
||||
//name: 'GB',
|
||||
nameTextStyle: {
|
||||
color: "#00ffff",
|
||||
align: "right",
|
||||
lineHeight: 10,
|
||||
},
|
||||
axisTick: {
|
||||
show: true,
|
||||
},
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: "#00ffff",
|
||||
},
|
||||
},
|
||||
axisLabel: {
|
||||
interval: 0,
|
||||
color: "#00ffff",
|
||||
},
|
||||
splitLine: {
|
||||
show: false,
|
||||
},
|
||||
},
|
||||
{
|
||||
type: "value",
|
||||
name: "单位:GB",
|
||||
nameTextStyle: {
|
||||
color: "#00ffff",
|
||||
fontSize: 12,
|
||||
align: "right",
|
||||
lineHeight: 10,
|
||||
},
|
||||
axisLine: {
|
||||
show: false,
|
||||
},
|
||||
axisLabel: {
|
||||
show: false,
|
||||
},
|
||||
splitLine: {
|
||||
show: false,
|
||||
},
|
||||
},
|
||||
],
|
||||
series: [
|
||||
{
|
||||
name: "数据量",
|
||||
type: "line",
|
||||
smooth: true,
|
||||
symbolSize: 8,
|
||||
areaStyle: {
|
||||
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
||||
{
|
||||
offset: 0,
|
||||
color: "rgba(240,199,37,0.5)",
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: "rgba(15,253,195,0.5)",
|
||||
},
|
||||
]),
|
||||
},
|
||||
data: yData,
|
||||
barWidth: "30%",
|
||||
lineStyle: { normal: { color: "#f0c725" } },
|
||||
itemStyle: {
|
||||
color: "#07d8fd",
|
||||
},
|
||||
label: {
|
||||
show: true,
|
||||
position: "top",
|
||||
textStyle: {
|
||||
color: "#07d8fd",
|
||||
fontSize: 12,
|
||||
},
|
||||
},
|
||||
markLine: {
|
||||
silent: true,
|
||||
data: [
|
||||
{
|
||||
yAxis: 150,
|
||||
},
|
||||
],
|
||||
label: {
|
||||
color: "#07d8fd",
|
||||
},
|
||||
},
|
||||
},
|
||||
],
|
||||
};
|
||||
option && _this.myChart.setOption(option, true);
|
||||
//window.echartsArr.push(_this.myChart);
|
||||
setTimeout(function () {
|
||||
_this.myChart.resize();
|
||||
let app = {
|
||||
currentIndex: -1,
|
||||
};
|
||||
|
||||
_this.time = setInterval(function () {
|
||||
var dataLen = option.series[0].data.length;
|
||||
|
||||
// 取消之前高亮的图形
|
||||
_this.myChart.dispatchAction({
|
||||
type: "downplay",
|
||||
seriesIndex: 0,
|
||||
dataIndex: app.currentIndex,
|
||||
});
|
||||
app.currentIndex = (app.currentIndex + 1) % dataLen;
|
||||
//console.log(app.currentIndex);
|
||||
// 高亮当前图形
|
||||
_this.myChart.dispatchAction({
|
||||
type: "highlight",
|
||||
seriesIndex: 0,
|
||||
dataIndex: app.currentIndex,
|
||||
});
|
||||
// 显示 tooltip
|
||||
_this.myChart.dispatchAction({
|
||||
type: "showTip",
|
||||
seriesIndex: 0,
|
||||
dataIndex: app.currentIndex,
|
||||
});
|
||||
}, 2000);
|
||||
}, 0);
|
||||
},
|
||||
},
|
||||
beforeDestroy() {
|
||||
for (let i = 1; i < 10000; i++) {
|
||||
clearInterval(i);
|
||||
}
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
// @import url("../css/home.less");
|
||||
@font-face {
|
||||
font-family: sszh;
|
||||
src: url("../fonts/sszh.ttf"); /* IE9+ */
|
||||
}
|
||||
.box {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
.boxTop {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 8%;
|
||||
font-family: "\5FAE\8F6F\96C5\9ED1";
|
||||
font-size: 0.85rem;
|
||||
line-height: 8%;
|
||||
letter-spacing: 1px;
|
||||
color: #07d8fd;
|
||||
cursor: pointer;
|
||||
background: linear-gradient(225deg, transparent 10px, #29707f 0) top right;
|
||||
.img {
|
||||
height: 100%;
|
||||
padding: 0 1.5%;
|
||||
cursor: pointer;
|
||||
}
|
||||
.total {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
font-size: 0.85rem;
|
||||
color: rgb(0, 255, 0);
|
||||
transform: translate(-50%, -50%);
|
||||
span {
|
||||
font-family: electricFont;
|
||||
font-size: 1.3rem;
|
||||
color: #07d8fd;
|
||||
}
|
||||
}
|
||||
}
|
||||
.boxBot {
|
||||
height: 90%;
|
||||
|
||||
// background-color: rgb(41, 16, 16);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
1539
src/views/center/components/DropEvent.vue
Normal file
1539
src/views/center/components/DropEvent.vue
Normal file
File diff suppressed because it is too large
Load Diff
1234
src/views/center/components/Map.vue
Normal file
1234
src/views/center/components/Map.vue
Normal file
File diff suppressed because it is too large
Load Diff
776
src/views/center/components/MonitoringPointScale.vue
Normal file
776
src/views/center/components/MonitoringPointScale.vue
Normal file
@@ -0,0 +1,776 @@
|
||||
<template>
|
||||
<div class="MonitoringPointScale">
|
||||
<div class="boxT" @mouseleave="handleMouseLeave">
|
||||
<img class="imgicon" src="../images/GM.png" alt="" srcset="" />
|
||||
<span>监测点规模</span>
|
||||
<div class="divSpan">
|
||||
<span @click="tab1(0, 1)" :style="{ color: flag == 0 ? '#07d8fd' : '#fff' }">片区</span>
|
||||
∣
|
||||
<span @click="tab2(0, 1)" :style="{ color: flag == 1 ? '#07d8fd' : '#fff' }">负荷类型</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="boxB" ref="electr0_7" v-show="isshow">
|
||||
<div id="electr0_7" style="width: 100%; height: 100%" />
|
||||
<div class="boxnum" id="boxnum">
|
||||
<div class="zong">
|
||||
<div class="zong_title" id="zong_title">总数</div>
|
||||
<div class="zong_num" id="zong_num">{{ total }}</div>
|
||||
</div>
|
||||
<div class="add">
|
||||
<div class="add_title" id="add_title">本月新增</div>
|
||||
<div class="add_num" id="add_num">{{ add }}</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div class="boxB" ref="electr0_8" v-show="!isshow">
|
||||
<div id="electr0_8" style="width: 100%; height: 100%" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import {
|
||||
getMonitoringPointScale,
|
||||
getLoadTypeData,
|
||||
} from "@/api/center/DropEvent.js";
|
||||
export default {
|
||||
components: {},
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
isshow: true,
|
||||
flag: 0,
|
||||
Num: 0,
|
||||
zoom: "", //图表焦点校验
|
||||
total: "", //图表焦点校验
|
||||
add: "", //图表焦点校验
|
||||
formData: {
|
||||
deptIndex: "",
|
||||
searchBeginTime: this.getCurrentMonthFirst(),
|
||||
searchEndTime: this.getNowFormatDate(),
|
||||
},
|
||||
|
||||
piedata: [
|
||||
{ value: 1048, name: "安徽省" },
|
||||
{ value: 735, name: "江苏省" },
|
||||
{ value: 580, name: "浙江省" },
|
||||
{ value: 484, name: "云南省" },
|
||||
{ value: 300, name: "海南省" },
|
||||
{ value: 300, name: "福建省" },
|
||||
{ value: 300, name: "广东省" },
|
||||
],
|
||||
timeA: null,
|
||||
timeB: null,
|
||||
calm: false,
|
||||
electr7List: [],
|
||||
electr8List: [],
|
||||
myChart2: null,
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.formData.deptIndex = JSON.parse(
|
||||
window.localStorage.getItem("adminInfo")
|
||||
).deptId;
|
||||
},
|
||||
mounted() {
|
||||
this.zoom = 1 / document.body.style.zoom;
|
||||
window.addEventListener("resize", () => {
|
||||
this.zoom = 1 / document.body.style.zoom;
|
||||
});
|
||||
getMonitoringPointScale(this.formData).then((res) => {
|
||||
this.total = res.data.monitorTotalCount;
|
||||
this.add = res.data.monitorAddCount;
|
||||
this.electr7List = res;
|
||||
|
||||
this.electr7();
|
||||
});
|
||||
getLoadTypeData(this.formData).then((res) => {
|
||||
this.electr8List = res;
|
||||
});
|
||||
this.info();
|
||||
},
|
||||
beforeDestroy() {
|
||||
for (let i = 1; i < 10000; i++) {
|
||||
clearInterval(i);
|
||||
}
|
||||
for (let i = 1; i < 10000; i++) {
|
||||
clearTimeout(i);
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
info() {
|
||||
this.timeA = setTimeout(() => {
|
||||
this.tab2();
|
||||
}, 15000);
|
||||
this.timeB = setTimeout(() => {
|
||||
this.tab1();
|
||||
this.info();
|
||||
}, 60000);
|
||||
},
|
||||
handleMouseLeave() {
|
||||
if (this.calm) {
|
||||
this.calm = false;
|
||||
this.$emit("Remove");
|
||||
// this.info();
|
||||
}
|
||||
},
|
||||
//获取当月第一天日期
|
||||
getCurrentMonthFirst() {
|
||||
var date = new Date();
|
||||
var year = date.getFullYear();
|
||||
date.setDate(1);
|
||||
var month = parseInt(date.getMonth() + 1);
|
||||
var day = date.getDate();
|
||||
if (month < 10) {
|
||||
month = "0" + month;
|
||||
}
|
||||
if (day < 10) {
|
||||
day = "0" + day;
|
||||
}
|
||||
return year + "-" + month + "-" + day;
|
||||
},
|
||||
//获取当天日期
|
||||
getNowFormatDate() {
|
||||
var date = new Date();
|
||||
var year = date.getFullYear();
|
||||
var month = date.getMonth() + 1;
|
||||
var day = date.getDate();
|
||||
if (month < 10) {
|
||||
month = "0" + month;
|
||||
}
|
||||
if (day < 10) {
|
||||
day = "0" + day;
|
||||
}
|
||||
return year + "-" + month + "-" + day;
|
||||
},
|
||||
fontSize(res) {
|
||||
let clientWidth = document.documentElement.clientWidth;
|
||||
if (!clientWidth) return;
|
||||
let fontSize = clientWidth / 1920;
|
||||
return res * fontSize;
|
||||
},
|
||||
tab1(e, v) {
|
||||
this.flag = 0;
|
||||
this.electr7();
|
||||
|
||||
this.isshow = true;
|
||||
if (e == 0) {
|
||||
if (v == 1) {
|
||||
this.$emit("control", { name: "MonitoringPointScale", val: 1 });
|
||||
}
|
||||
clearTimeout(this.timeA);
|
||||
clearTimeout(this.timeB);
|
||||
this.calm = true;
|
||||
}
|
||||
},
|
||||
tab2(e, v) {
|
||||
this.flag = 1;
|
||||
this.electr8();
|
||||
this.isshow = false;
|
||||
if (e == 0) {
|
||||
if (v == 1) {
|
||||
this.$emit("control", { name: "MonitoringPointScale", val: 2 });
|
||||
}
|
||||
|
||||
clearTimeout(this.timeA);
|
||||
clearTimeout(this.timeB);
|
||||
this.calm = true;
|
||||
}
|
||||
},
|
||||
// 监测点规模片区
|
||||
async electr7() {
|
||||
let EchartsData = [];
|
||||
|
||||
let arrData = this.electr7List.data.param;
|
||||
arrData.forEach((item) => {
|
||||
item.name = item.name;
|
||||
item.value = item.count;
|
||||
});
|
||||
EchartsData = arrData;
|
||||
let echarts = require("echarts");
|
||||
let domID1 = document.getElementById("electr0_7");
|
||||
let boxnum = document.getElementById("boxnum");
|
||||
let zong_title = document.getElementById("zong_title");
|
||||
let zong_num = document.getElementById("zong_num");
|
||||
let add_title = document.getElementById("add_title");
|
||||
let add_num = document.getElementById("add_num");
|
||||
setTimeout(() => {
|
||||
(domID1.style.width = this.$refs.electr0_7.offsetWidth + "px"),
|
||||
(domID1.style.height = this.$refs.electr0_7.offsetHeight + "px");
|
||||
boxnum.style.width = this.$refs.electr0_7.offsetWidth / 5 + "px";
|
||||
zong_title.style.fontSize = ".75rem";
|
||||
zong_num.style.fontSize = "1.5rem";
|
||||
add_title.style.fontSize = ".75rem";
|
||||
add_num.style.fontSize = "1.5rem";
|
||||
}, 0);
|
||||
let color = [
|
||||
"#d909e0",
|
||||
"#ffe400",
|
||||
"#ff9a09",
|
||||
"#ef1e5f",
|
||||
"#23cbe5",
|
||||
"#ec561b",
|
||||
"#ffa500",
|
||||
"#41E398",
|
||||
"#12AFA6",
|
||||
"#FF0000",
|
||||
"#CC99FF",
|
||||
"#0099CC",
|
||||
"#FF6699",
|
||||
"#00FF7F",
|
||||
"#D2691E",
|
||||
"#FF6347",
|
||||
"#A52A2A",
|
||||
"#808080",
|
||||
"#DEB887",
|
||||
"#FFD700",
|
||||
"#556B2F",
|
||||
"#7FFF00",
|
||||
"#808000",
|
||||
"#40E0D0",
|
||||
"#00FFFF",
|
||||
"#8A2BE2",
|
||||
"#EE82EE",
|
||||
"#000080",
|
||||
"#DC143C",
|
||||
"#008080",
|
||||
"#8FBC8F",
|
||||
"#F5DEB3",
|
||||
"#FF7F50",
|
||||
"#FFF5EE",
|
||||
];
|
||||
let myChart2 = echarts.init(domID1);
|
||||
let option = {
|
||||
title: {
|
||||
text: "片区分布",
|
||||
left: "center",
|
||||
top: "center",
|
||||
textStyle: {
|
||||
color: "#fff",
|
||||
},
|
||||
},
|
||||
tooltip: {
|
||||
trigger: "item",
|
||||
backgroundColor: "rgba(8,36,68,.7)",
|
||||
color: "#00ffff",
|
||||
textStyle: {
|
||||
color: "#00ffff",
|
||||
},
|
||||
},
|
||||
legend: {
|
||||
type: "scroll",
|
||||
orient: "vertical",
|
||||
left: 0,
|
||||
top: 5,
|
||||
bottom: 10,
|
||||
// itemHeight: 8,
|
||||
pageIconColor: "white", //激活的分页按钮颜色
|
||||
pageTextStyle: {
|
||||
color: "#35ffff",
|
||||
},
|
||||
pageIconInactiveColor: "#CCC", //没激活的分页按钮颜色
|
||||
textStyle: {
|
||||
color: "#fff",
|
||||
fontSize: 12,
|
||||
},
|
||||
//设置自定义legend 的重点
|
||||
// formatter: function(name) {
|
||||
// // 获取legend显示内容
|
||||
// let data = EchartsData;//这个是展示的数据
|
||||
// let total = 0;
|
||||
// let tarValue = 0;
|
||||
// let value = 0;
|
||||
// for (let i = 0, l = data.length; i < l; i++) {
|
||||
// total += data[i].value;
|
||||
// if (data[i].name == name) {
|
||||
// tarValue = data[i].value;
|
||||
// value = data[i].value;
|
||||
// }
|
||||
// }
|
||||
// let p = total== 0? 0 :((tarValue / total) * 100).toFixed(1);
|
||||
// return [
|
||||
// "{a|" +
|
||||
// echarts.format.truncateText(
|
||||
// name,
|
||||
// 80,
|
||||
// "14px Microsoft Yahei",
|
||||
// "…"//如果宽度超过80会出现...
|
||||
// ) +
|
||||
// "}",
|
||||
// "{b|" + p + "%}",
|
||||
// "{x|" + value + "}" //a、b、x、跟下面的rich对应
|
||||
// ].join(" ");
|
||||
// },
|
||||
},
|
||||
series: [
|
||||
{
|
||||
type: "pie",
|
||||
radius: ["55%", "65%"],
|
||||
// center: ['60%', '60%'],
|
||||
data: EchartsData.map((item, index) => {
|
||||
item.label = {
|
||||
color: color[index],
|
||||
};
|
||||
return item;
|
||||
}),
|
||||
itemStyle: {
|
||||
color: (params) => {
|
||||
var index = params.dataIndex;
|
||||
var color = [
|
||||
"#d909e0",
|
||||
"#ffe400",
|
||||
"#ff9a09",
|
||||
"#ef1e5f",
|
||||
"#23cbe5",
|
||||
"#ec561b",
|
||||
"#ffa500",
|
||||
"#41E398",
|
||||
"#12AFA6",
|
||||
"#FF0000",
|
||||
"#CC99FF",
|
||||
"#0099CC",
|
||||
"#FF6699",
|
||||
"#00FF7F",
|
||||
"#D2691E",
|
||||
"#FF6347",
|
||||
"#A52A2A",
|
||||
"#808080",
|
||||
"#DEB887",
|
||||
"#FFD700",
|
||||
"#556B2F",
|
||||
"#7FFF00",
|
||||
"#808000",
|
||||
"#40E0D0",
|
||||
"#00FFFF",
|
||||
"#8A2BE2",
|
||||
"#EE82EE",
|
||||
"#000080",
|
||||
"#DC143C",
|
||||
"#008080",
|
||||
"#8FBC8F",
|
||||
"#F5DEB3",
|
||||
"#FF7F50",
|
||||
"#FFF5EE",
|
||||
];
|
||||
return color[index];
|
||||
},
|
||||
},
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
option && myChart2.setOption(option, true);
|
||||
//window.echartsArr.push(myChart2);
|
||||
setTimeout(function () {
|
||||
myChart2.resize();
|
||||
}, 0);
|
||||
},
|
||||
async electr8() {
|
||||
let echarts = require("echarts");
|
||||
let _this = this;
|
||||
let domID1 = document.getElementById("electr0_8");
|
||||
setTimeout(() => {
|
||||
(domID1.style.width = this.$refs.electr0_8.offsetWidth + "px"),
|
||||
(domID1.style.height = this.$refs.electr0_8.offsetHeight + "px");
|
||||
}, 0);
|
||||
if (_this.myChart2 != null) {
|
||||
_this.myChart2.dispose();
|
||||
clearInterval(_this.time2);
|
||||
}
|
||||
_this.myChart2 = echarts.init(domID1);
|
||||
// const data = await getLoadTypeData(this.formData);
|
||||
let cityList = [];
|
||||
let cityData = [];
|
||||
|
||||
this.electr8List.data.param.sort((a, b) => b.count - a.count).forEach((item) => {
|
||||
if (item.count != 0) {
|
||||
cityList.push(item.name);
|
||||
cityData.push(item.count);
|
||||
}
|
||||
|
||||
});
|
||||
// 数据处理
|
||||
var charts = {
|
||||
// 按顺序排列从大到小
|
||||
cityList: cityList,
|
||||
cityData: cityData,
|
||||
};
|
||||
var top10CityList = charts.cityList;
|
||||
var top10CityData = charts.cityData;
|
||||
var color = [
|
||||
"rgba(3,255,238",
|
||||
"rgba(218,3,255",
|
||||
"rgba(255,248,3",
|
||||
"rgba(120,255,3",
|
||||
"rgba(255,218,3",
|
||||
"rgba(3,204,255",
|
||||
"rgba(3,72,255",
|
||||
"rgba(255,101,3",
|
||||
"rgba(3,255,155",
|
||||
"rgba(218,255,3",
|
||||
"rgba(135,3,255",
|
||||
"rgba(107,146,168",
|
||||
"rgba(7,230,163",
|
||||
"rgba(52,162,191",
|
||||
"rgba(147,112,219",
|
||||
"rgba(100,149,237",
|
||||
"rgba(72,209,204",
|
||||
"rgba(152,251,152",
|
||||
"rgba(255,99,71",
|
||||
"rgba(188,143,143",
|
||||
"rgba(105,105,105",
|
||||
"rgba(210,105,30",
|
||||
"rgba(255,165,0",
|
||||
"rgba(189,183,107",
|
||||
"rgba(124,252,0",
|
||||
"rgba(0,255,127",
|
||||
"rgba(0,139,139",
|
||||
"rgba(0,191,255",
|
||||
"rgba(225,255,255",
|
||||
"rgba(112,128,144",
|
||||
"rgba(176,196,222",
|
||||
"rgba(123,104,238",
|
||||
"rgba(153,50,204",
|
||||
"rgba(255,0,255",
|
||||
"rgba(255,105,180",
|
||||
];
|
||||
|
||||
// 图表option整理
|
||||
let lineY = [];
|
||||
var yData = [];
|
||||
for (var i = 0; i < charts.cityList.length; i++) {
|
||||
yData.push(top10CityData[i] + "个");
|
||||
var EchartsData = {
|
||||
name: charts.cityList[i],
|
||||
color: color[i] + ")",
|
||||
value: top10CityData[i],
|
||||
itemStyle: {
|
||||
normal: {
|
||||
show: true,
|
||||
color: new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
0,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: color[i] + ", 0.3)",
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: color[i] + ", 1)",
|
||||
},
|
||||
],
|
||||
false
|
||||
),
|
||||
barBorderRadius: 10,
|
||||
},
|
||||
emphasis: {
|
||||
shadowBlur: 15,
|
||||
shadowColor: "rgba(0, 0, 0, 0.1)",
|
||||
},
|
||||
},
|
||||
};
|
||||
lineY.push(EchartsData);
|
||||
}
|
||||
let maxValue = 0;
|
||||
|
||||
for (const item of lineY) {
|
||||
if (item.value > maxValue) {
|
||||
maxValue = item.value;
|
||||
}
|
||||
}
|
||||
|
||||
var option = {
|
||||
// backgroundColor: '#000',
|
||||
title: {
|
||||
show: false,
|
||||
},
|
||||
tooltip: {
|
||||
showContent: true,
|
||||
trigger: "axis",
|
||||
backgroundColor: "rgba(8,36,68,.7)",
|
||||
axisPointer: {
|
||||
// 坐标轴指示器，坐标轴触发有效
|
||||
type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
|
||||
},
|
||||
color: "#00ffff",
|
||||
textStyle: {
|
||||
color: "#00ffff",
|
||||
},
|
||||
// formatter: function (params) {
|
||||
// for (var i = 0; i < params.length; i++) {
|
||||
// if (params[i].name !== "") {
|
||||
// str += params[i].name +":" +
|
||||
// params[i].value +
|
||||
// "<br/>";
|
||||
// }
|
||||
// }
|
||||
// return str;
|
||||
// },
|
||||
},
|
||||
grid: {
|
||||
borderWidth: 0,
|
||||
top: "10px",
|
||||
left: "30px",
|
||||
right: "35px",
|
||||
bottom: "15px",
|
||||
},
|
||||
color: color,
|
||||
dataZoom: [
|
||||
{
|
||||
type: "slider",
|
||||
show: true,
|
||||
// 设置组件控制的y轴
|
||||
yAxisIndex: [0, 1],
|
||||
left: 5,
|
||||
// top: 60,
|
||||
// 数据窗口范围的起始百分比。范围是：0 ~ 100。表示 0% ~ 100%
|
||||
// 也可以用 startValue设置起始值
|
||||
start: 0,
|
||||
end: lineY.length < 10 ? 100 : 50, //默认为100
|
||||
width: 6,
|
||||
// height: 450,
|
||||
// 组件的背景颜色
|
||||
// left: 600, //左边的距离
|
||||
// right: 8,//右边的距离
|
||||
borderRadius: 5,
|
||||
// borderColor: "rgba(43,48,67,0.8)",
|
||||
// fillerColor: '#ccc',//滑动块的颜色
|
||||
// backgroundColor: '#33384b',//两边未选中的滑动条片区的颜色
|
||||
// 是否显示detail，即拖拽时候显示详细数值信息
|
||||
showDetail: false,
|
||||
// 控制手柄的尺寸
|
||||
handleSize: 12,
|
||||
// 是否在 dataZoom-silder 组件中显示数据阴影。数据阴影可以简单地反应数据走势。
|
||||
showDataShadow: false,
|
||||
},
|
||||
{
|
||||
type: "inside",
|
||||
yAxisIndex: [0, 1],
|
||||
start: 1,
|
||||
// end: 36,
|
||||
// 不按任何功能键，鼠标滚轮能触发缩放
|
||||
// zoomOnMouseWheel: false,
|
||||
// 不按任何功能键，鼠标移动能触发数据窗口平移
|
||||
// moveOnMouseWheel: true,
|
||||
},
|
||||
],
|
||||
yAxis: [
|
||||
{
|
||||
type: "category",
|
||||
inverse: true,
|
||||
axisTick: {
|
||||
show: false,
|
||||
},
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: "#fff",
|
||||
width: 3,
|
||||
},
|
||||
},
|
||||
axisLabel: {
|
||||
show: false,
|
||||
inside: false,
|
||||
},
|
||||
data: top10CityList,
|
||||
},
|
||||
{
|
||||
name: "单位:个",
|
||||
type: "category",
|
||||
inverse: true,
|
||||
axisLine: {
|
||||
show: false,
|
||||
},
|
||||
axisTick: {
|
||||
show: false,
|
||||
},
|
||||
axisLabel: {
|
||||
show: true,
|
||||
inside: false,
|
||||
textStyle: {
|
||||
color: "#03E9FF",
|
||||
fontSize: "10",
|
||||
fontFamily: "PingFangSC-Regular",
|
||||
},
|
||||
// formatter: function (val) {
|
||||
// return `${val}个`;
|
||||
// },
|
||||
},
|
||||
data: yData,
|
||||
splitArea: {
|
||||
show: false,
|
||||
},
|
||||
splitLine: {
|
||||
show: false,
|
||||
},
|
||||
},
|
||||
],
|
||||
xAxis: {
|
||||
type: "value",
|
||||
axisTick: {
|
||||
show: false,
|
||||
},
|
||||
max: maxValue + 30,
|
||||
axisLine: {
|
||||
show: false,
|
||||
},
|
||||
splitLine: {
|
||||
show: false,
|
||||
},
|
||||
axisLabel: {
|
||||
show: false,
|
||||
textStyle: {
|
||||
fontSize: "10",
|
||||
},
|
||||
},
|
||||
},
|
||||
series: [
|
||||
{
|
||||
name: "",
|
||||
type: "bar",
|
||||
// zlevel: 2,
|
||||
barMaxWidth: 20,
|
||||
barGap: `10%`,
|
||||
data: lineY,
|
||||
animationDuration: 1500,
|
||||
label: {
|
||||
normal: {
|
||||
color: "#03FDFF",
|
||||
show: true,
|
||||
position: "right",
|
||||
textStyle: {
|
||||
fontSize: "0.9rem",
|
||||
},
|
||||
formatter: function (a, b) {
|
||||
return a.name;
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
],
|
||||
animationEasing: "cubicOut",
|
||||
};
|
||||
|
||||
option && _this.myChart2.setOption(option, true);
|
||||
//window.echartsArr.push(myChart2);
|
||||
setTimeout(function () {
|
||||
_this.myChart2.resize();
|
||||
}, 0);
|
||||
if (lineY.length >= 10) {
|
||||
_this.time2 = setInterval(() => {
|
||||
if (option.dataZoom[0].end == 50) {
|
||||
option.dataZoom[0].end = 100;
|
||||
option.dataZoom[0].start = 50;
|
||||
} else if (option.dataZoom[0].end == 100) {
|
||||
option.dataZoom[0].end = 50;
|
||||
option.dataZoom[0].start = 0;
|
||||
}
|
||||
// else if (option.dataZoom[0].end == 75) {
|
||||
// option.dataZoom[0].end = 100;
|
||||
// option.dataZoom[0].start = 75;
|
||||
// } else if (option.dataZoom[0].end == 100) {
|
||||
// option.dataZoom[0].end = 25;
|
||||
// option.dataZoom[0].start = 0;
|
||||
// }
|
||||
_this.myChart2.setOption(option);
|
||||
//window.echartsArr.push(_this.myChart2);
|
||||
}, 8000);
|
||||
}
|
||||
},
|
||||
},
|
||||
|
||||
computed: {},
|
||||
|
||||
watch: {},
|
||||
};
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
@import url("../../center/css/home.less");
|
||||
|
||||
// @import url("../center/css/change.less");
|
||||
@font-face {
|
||||
font-family: sszh;
|
||||
src: url("../../center/fonts/sszh.ttf");
|
||||
/* IE9+ */
|
||||
}
|
||||
|
||||
.MonitoringPointScale {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
.boxT {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 8%;
|
||||
font-family: "\5FAE\8F6F\96C5\9ED1";
|
||||
font-size: 0.85rem;
|
||||
line-height: 8%;
|
||||
// background-color: #29707f;
|
||||
letter-spacing: 1px;
|
||||
color: #07d8fd;
|
||||
cursor: pointer;
|
||||
background: linear-gradient(225deg, transparent 10px, #29707f 0) top right;
|
||||
|
||||
.imgicon {
|
||||
height: 100%;
|
||||
padding: 0 1.5%;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.divSpan {
|
||||
padding-left: 5%;
|
||||
font-size: 0.85rem;
|
||||
color: #fff;
|
||||
cursor: pointer;
|
||||
}
|
||||
}
|
||||
|
||||
.boxB {
|
||||
position: relative;
|
||||
height: 92%;
|
||||
// background-color: rgb(41, 16, 16);
|
||||
}
|
||||
|
||||
.boxnum {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
z-index: 100000000;
|
||||
}
|
||||
|
||||
.zong_title {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.zong_num {
|
||||
font-family: electricFont;
|
||||
color: rgb(0, 238, 255);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.add_title {
|
||||
color: rgb(0, 238, 255);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.add_num {
|
||||
font-family: electricFont;
|
||||
color: #00ff7f;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.zong {
|
||||
margin-top: 5px;
|
||||
border: 1px solid yellow;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.add {
|
||||
margin-top: 5px;
|
||||
border: 1px solid rgb(0, 238, 255);
|
||||
border-radius: 8px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
375
src/views/center/components/PowerLoad.vue
Normal file
375
src/views/center/components/PowerLoad.vue
Normal file
@@ -0,0 +1,375 @@
|
||||
<template>
|
||||
<div class="box">
|
||||
<div class="boxTop">
|
||||
<img class="img" src="../images/GM.png" alt="" srcset="" />
|
||||
<span>功率负荷排名</span>
|
||||
</div>
|
||||
<div class="boxBot" ref="Echarts">
|
||||
<div id="echart1" style="width: 100%; height: 100%"></div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { getPowerOrder } from "@/api/center/DropEvent.js";
|
||||
|
||||
export default {
|
||||
components: {},
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
zoom: undefined, //图表焦点校验
|
||||
h: undefined,
|
||||
isLoading: false,
|
||||
total: 0,
|
||||
myChart: null,
|
||||
time: null,
|
||||
formData: {
|
||||
deptIndex: "",
|
||||
limit: 20,
|
||||
searchBeginTime: this.getCurrentMonthFirst(),
|
||||
searchEndTime: this.getNowFormatDate(),
|
||||
},
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.formData.deptIndex = JSON.parse(
|
||||
window.localStorage.getItem("adminInfo")
|
||||
).deptId;
|
||||
},
|
||||
|
||||
mounted() {
|
||||
this.zoom = 1 / document.body.style.zoom;
|
||||
window.addEventListener("resize", () => {
|
||||
this.zoom = 1 / document.body.style.zoom;
|
||||
});
|
||||
this.$nextTick(() => {
|
||||
this.province();
|
||||
setInterval(() => {
|
||||
clearInterval(this.time);
|
||||
this.province();
|
||||
}, 60000 * 5);
|
||||
});
|
||||
},
|
||||
|
||||
methods: {
|
||||
//获取当月第一天日期
|
||||
getCurrentMonthFirst() {
|
||||
var date = new Date();
|
||||
var year = date.getFullYear();
|
||||
date.setDate(1);
|
||||
var month = parseInt(date.getMonth() + 1);
|
||||
var day = date.getDate();
|
||||
if (month < 10) {
|
||||
month = "0" + month;
|
||||
}
|
||||
if (day < 10) {
|
||||
day = "0" + day;
|
||||
}
|
||||
return year + "-" + month + "-" + day;
|
||||
},
|
||||
//获取当天日期
|
||||
getNowFormatDate() {
|
||||
var date = new Date();
|
||||
var year = date.getFullYear();
|
||||
var month = date.getMonth() + 1;
|
||||
var day = date.getDate();
|
||||
if (month < 10) {
|
||||
month = "0" + month;
|
||||
}
|
||||
if (day < 10) {
|
||||
day = "0" + day;
|
||||
}
|
||||
return year + "-" + month + "-" + day;
|
||||
},
|
||||
//echarts图
|
||||
async province() {
|
||||
this.isLoading = true;
|
||||
var xData = [];
|
||||
var yData = [];
|
||||
const data = [];
|
||||
await getPowerOrder(this.formData).then((res) => {
|
||||
res.data.sort((a, b) => b.max - a.max).forEach((item) => {
|
||||
// this.total = this.total + item.dataStatis;
|
||||
// if( i != 0){
|
||||
// item.timeId = item.timeId.slice(5)
|
||||
// }
|
||||
xData.push(item.name);
|
||||
yData.push(Number(item.max).toFixed(2));
|
||||
});
|
||||
});
|
||||
let _this = this;
|
||||
let echarts = require("echarts");
|
||||
if (_this.myChart != null) {
|
||||
_this.myChart.dispose();
|
||||
}
|
||||
let domID1 = document.getElementById("echart1");
|
||||
setTimeout(() => {
|
||||
(domID1.style.width = this.$refs.Echarts.offsetWidth + "px"),
|
||||
(domID1.style.height = this.$refs.Echarts.offsetHeight + "px");
|
||||
}, 0);
|
||||
_this.myChart = echarts.init(domID1);
|
||||
this.isLoading = false;
|
||||
let option = {
|
||||
tooltip: {
|
||||
showContent: true,
|
||||
trigger: "axis",
|
||||
backgroundColor: "rgba(8,36,68,.7)",
|
||||
color: "#00ffff",
|
||||
textStyle: {
|
||||
color: "#00ffff",
|
||||
},
|
||||
formatter: function (params) {
|
||||
var tips = "";
|
||||
// tips += params[0].name + "</br/>";
|
||||
tips += '监测点' + "：" + params[0].name + "</br/>";
|
||||
for (var i = 0; i < params.length; i++) {
|
||||
if (params[i].value == 3.14159) {
|
||||
tips += '功率' + "：" + params[i].name + ":" + 0 + "<br/>";
|
||||
} else {
|
||||
tips += '功率' + "：" + params[i].value + "kW<br/>";
|
||||
}
|
||||
}
|
||||
return tips;
|
||||
},
|
||||
},
|
||||
textStyle: {
|
||||
color: "#00ffff",
|
||||
fontSize: 12,
|
||||
},
|
||||
legend: {
|
||||
top: "4%",
|
||||
left: "center",
|
||||
itemWidth: 13,
|
||||
itemHeight: 13,
|
||||
itemStyle: {
|
||||
color: "#00ffff",
|
||||
},
|
||||
icon: "rect",
|
||||
padding: 0,
|
||||
textStyle: {
|
||||
color: "#03E9FF",
|
||||
fontSize: 12,
|
||||
padding: [2, 0, 0, 0],
|
||||
},
|
||||
},
|
||||
grid: {
|
||||
top: "40px", // 等价于 y: '16%'
|
||||
left: "50px",
|
||||
right: "55px",
|
||||
bottom: "50px",
|
||||
},
|
||||
xAxis: {
|
||||
name: "监测点",
|
||||
nameTextStyle: {
|
||||
color: "#07FCF0",
|
||||
// top:'5%',
|
||||
fontSize: 12,
|
||||
},
|
||||
type: "category",
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: "#00ffff",
|
||||
width: 1,
|
||||
},
|
||||
},
|
||||
axisLabel: {
|
||||
textStyle: {
|
||||
fontFamily: "dinproRegular",
|
||||
color: "#00ffff",
|
||||
},
|
||||
rotate: 45,
|
||||
formatter: function (value) {
|
||||
if (value.length > 5) {
|
||||
return `${value.slice(0, 5)}...`;
|
||||
}
|
||||
return value;
|
||||
},
|
||||
},
|
||||
data: xData,
|
||||
},
|
||||
yAxis: [
|
||||
{
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: "#00ffff",
|
||||
},
|
||||
},
|
||||
axisLabel: {
|
||||
show: true,
|
||||
textStyle: {
|
||||
color: "#00ffff",
|
||||
},
|
||||
},
|
||||
splitLine: {
|
||||
//分割线配置
|
||||
lineStyle: {
|
||||
type: "dashed",
|
||||
color: "#00ffff",
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "单位:kW",
|
||||
nameTextStyle: {
|
||||
color: "#00ffff",
|
||||
|
||||
fontSize: 12,
|
||||
},
|
||||
position: "right",
|
||||
//right:'15%',
|
||||
axisLine: {
|
||||
show: false,
|
||||
},
|
||||
splitLine: {
|
||||
show: false,
|
||||
},
|
||||
},
|
||||
],
|
||||
|
||||
series: [
|
||||
{
|
||||
name: "功率负荷排名",
|
||||
type: "bar",
|
||||
barMaxWidth: 20,
|
||||
label: {
|
||||
show: true,
|
||||
// position: "top",
|
||||
// distance: 5,
|
||||
color: "#00ffff",
|
||||
formatter: function (params) {
|
||||
var val = "";
|
||||
if (params.value == 5) {
|
||||
val = 0;
|
||||
}
|
||||
return val;
|
||||
},
|
||||
fontSize: 12,
|
||||
},
|
||||
data: yData,
|
||||
itemStyle: {
|
||||
normal: {
|
||||
type: "linear",
|
||||
global: false,
|
||||
color: function (params) {
|
||||
if (params.value != 3.14159) {
|
||||
return new echarts.graphic.LinearGradient(0, 1, 0, 0, [
|
||||
{
|
||||
offset: 0,
|
||||
color: "#0b9eff",
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: "#ffcc00",
|
||||
},
|
||||
]);
|
||||
} else if ((params.value = 3.14159)) {
|
||||
return new echarts.graphic.LinearGradient(0, 1, 0, 0, [
|
||||
{
|
||||
offset: 1,
|
||||
color: "#ccc",
|
||||
},
|
||||
]);
|
||||
}
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
],
|
||||
};
|
||||
option && _this.myChart.setOption(option, true);
|
||||
//window.echartsArr.push(_this.myChart);
|
||||
setTimeout(function () {
|
||||
_this.myChart.resize();
|
||||
let app = {
|
||||
currentIndex: -1,
|
||||
};
|
||||
|
||||
_this.time = setInterval(function () {
|
||||
var dataLen = option.series[0].data.length;
|
||||
|
||||
// 取消之前高亮的图形
|
||||
_this.myChart.dispatchAction({
|
||||
type: "downplay",
|
||||
seriesIndex: 0,
|
||||
dataIndex: app.currentIndex,
|
||||
});
|
||||
app.currentIndex = (app.currentIndex + 1) % dataLen;
|
||||
//console.log(app.currentIndex);
|
||||
// 高亮当前图形
|
||||
_this.myChart.dispatchAction({
|
||||
type: "highlight",
|
||||
seriesIndex: 0,
|
||||
dataIndex: app.currentIndex,
|
||||
});
|
||||
// 显示 tooltip
|
||||
_this.myChart.dispatchAction({
|
||||
type: "showTip",
|
||||
seriesIndex: 0,
|
||||
dataIndex: app.currentIndex,
|
||||
});
|
||||
}, 2000);
|
||||
}, 0);
|
||||
},
|
||||
},
|
||||
beforeDestroy() {
|
||||
for (let i = 1; i < 10000; i++) {
|
||||
clearInterval(i);
|
||||
}
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
// @import url("../css/home.less");
|
||||
@font-face {
|
||||
font-family: sszh;
|
||||
src: url("../fonts/sszh.ttf");
|
||||
/* IE9+ */
|
||||
}
|
||||
|
||||
.box {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
.boxTop {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 8%;
|
||||
font-family: "\5FAE\8F6F\96C5\9ED1";
|
||||
font-size: 0.85rem;
|
||||
line-height: 8%;
|
||||
letter-spacing: 1px;
|
||||
color: #07d8fd;
|
||||
cursor: pointer;
|
||||
background: linear-gradient(225deg, transparent 10px, #29707f 0) top right;
|
||||
|
||||
.img {
|
||||
height: 100%;
|
||||
padding: 0 1.5%;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.total {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
font-size: 0.85rem;
|
||||
color: rgb(0, 255, 0);
|
||||
transform: translate(-50%, -50%);
|
||||
|
||||
span {
|
||||
font-family: electricFont;
|
||||
font-size: 1.3rem;
|
||||
color: #07d8fd;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.boxBot {
|
||||
height: 90%;
|
||||
|
||||
// background-color: rgb(41, 16, 16);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
752
src/views/center/components/SteadyState.vue
Normal file
752
src/views/center/components/SteadyState.vue
Normal file
@@ -0,0 +1,752 @@
|
||||
<template>
|
||||
<div class="MonitoringPointScale">
|
||||
<Timeinterval ref="Timeinterval" :interval="3" v-show="false"></Timeinterval>
|
||||
<div class="boxT" @mouseleave="handleMouseLeave">
|
||||
<img class="imgicon" src="../images/GM.png" alt="" srcset="" />
|
||||
<span>稳态越线占比</span>
|
||||
<div class="divSpan">
|
||||
<span @click="tab1(0, 1)" :style="{ color: flag == 0 ? '#07d8fd' : '#fff' }">片区</span>
|
||||
∣
|
||||
<span @click="tab2(0, 1)" :style="{ color: flag == 1 ? '#07d8fd' : '#fff' }">负荷类型</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="boxB" ref="electr_7" v-show="isshow">
|
||||
<div id="electr_7" style="width: 100%; height: 100%" />
|
||||
</div>
|
||||
<div class="boxB" ref="electr_8" v-show="!isshow">
|
||||
<div id="electr_8" style="width: 100%; height: 100%" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import {
|
||||
getHomeostasisLoad,
|
||||
getHomeostasisArea,
|
||||
} from "@/api/center/DropEvent.js";
|
||||
import Timeinterval from "@/views/Timeinterval/index.vue";
|
||||
export default {
|
||||
components: { Timeinterval },
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
isshow: true,
|
||||
color: [
|
||||
"#d909e0",
|
||||
"#ffe400",
|
||||
"#ff9a09",
|
||||
"#ef1e5f",
|
||||
"#23cbe5",
|
||||
"#ec561b",
|
||||
"#ffa500",
|
||||
],
|
||||
flag: 0,
|
||||
Num: 0,
|
||||
zoom: "", //图表焦点校验
|
||||
form: {},
|
||||
myChart1: null,
|
||||
time1: null,
|
||||
myChart2: null,
|
||||
time2: null,
|
||||
timeA: null,
|
||||
timeB: null,
|
||||
calm: false,
|
||||
electr7List: [],
|
||||
electr8List: [],
|
||||
};
|
||||
},
|
||||
created() { },
|
||||
mounted() {
|
||||
this.form = {
|
||||
deptIndex: JSON.parse(window.localStorage.getItem("adminInfo")).deptId,
|
||||
searchBeginTime: this.$refs.Timeinterval.timeValue[0],
|
||||
searchEndTime: this.$refs.Timeinterval.timeValue[1],
|
||||
};
|
||||
this.zoom = 1 / document.body.style.zoom;
|
||||
window.addEventListener("resize", () => {
|
||||
this.zoom = 1 / document.body.style.zoom;
|
||||
});
|
||||
getHomeostasisArea(this.form).then((res) => {
|
||||
this.electr7List = res;
|
||||
this.electr7();
|
||||
});
|
||||
getHomeostasisLoad(this.form).then((res) => {
|
||||
this.electr8List = res;
|
||||
});
|
||||
this.info();
|
||||
},
|
||||
beforeDestroy() {
|
||||
for (let i = 1; i < 10000; i++) {
|
||||
clearInterval(i);
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
info() {
|
||||
this.timeA = setTimeout(() => {
|
||||
this.tab2();
|
||||
}, 15000);
|
||||
this.timeB = setTimeout(() => {
|
||||
this.tab1();
|
||||
this.info();
|
||||
}, 60000);
|
||||
},
|
||||
tab1(e, v) {
|
||||
this.flag = 0;
|
||||
this.electr7();
|
||||
this.isshow = true;
|
||||
if (e == 0) {
|
||||
if (v == 1) {
|
||||
this.$emit("control", { name: "SteadyState", val: 1 });
|
||||
}
|
||||
clearTimeout(this.timeA);
|
||||
clearTimeout(this.timeB);
|
||||
this.calm = true;
|
||||
}
|
||||
},
|
||||
tab2(e, v) {
|
||||
this.flag = 1;
|
||||
this.electr8();
|
||||
this.isshow = false;
|
||||
if (e == 0) {
|
||||
if (v == 1) {
|
||||
this.$emit("control", { name: "SteadyState", val: 2 });
|
||||
}
|
||||
clearTimeout(this.timeA);
|
||||
clearTimeout(this.timeB);
|
||||
this.calm = true;
|
||||
}
|
||||
},
|
||||
handleMouseLeave() {
|
||||
if (this.calm) {
|
||||
this.calm = false;
|
||||
this.$emit("Remove");
|
||||
// this.info();
|
||||
}
|
||||
},
|
||||
// 分布式光伏渗透率
|
||||
async electr7() {
|
||||
let _this = this;
|
||||
let echarts = require("echarts");
|
||||
let domID1 = document.getElementById("electr_7");
|
||||
let titleList = [];
|
||||
let datalist = [];
|
||||
// await getHomeostasisArea(this.form).then((res) => {
|
||||
this.electr7List.data.sort((a, b) => b.avg - a.avg).forEach((item) => {
|
||||
titleList.push(item.name);
|
||||
if (item.avg == 0) {
|
||||
item.avg = 0.00159;
|
||||
}
|
||||
datalist.push(item.avg);
|
||||
});
|
||||
// });
|
||||
setTimeout(() => {
|
||||
(domID1.style.width = this.$refs.electr_7.offsetWidth + "px"),
|
||||
(domID1.style.height = this.$refs.electr_7.offsetHeight + "px");
|
||||
}, 0);
|
||||
if (_this.myChart1 != null) {
|
||||
_this.myChart1.dispose();
|
||||
clearInterval(_this.time1);
|
||||
}
|
||||
_this.myChart1 = echarts.init(domID1);
|
||||
var option = {
|
||||
tooltip: {
|
||||
showContent: true,
|
||||
trigger: "axis",
|
||||
backgroundColor: "rgba(8,36,68,.7)",
|
||||
color: "#00ffff",
|
||||
textStyle: {
|
||||
color: "#00ffff",
|
||||
},
|
||||
axisPointer: {
|
||||
// 坐标轴指示器，坐标轴触发有效
|
||||
type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
|
||||
},
|
||||
formatter: function (params) {
|
||||
var tips = "";
|
||||
tips += params[0].name + "</br/>";
|
||||
for (var i = 0; i < params.length; i++) {
|
||||
if (params[i].value ==0.00159) {
|
||||
tips += params[i].seriesName + "" + 0 + "<br/>";
|
||||
} else {
|
||||
tips += params[i].seriesName + "" + params[i].value + "%<br/>";
|
||||
}
|
||||
}
|
||||
return tips;
|
||||
},
|
||||
},
|
||||
textStyle: {
|
||||
color: "#00ffff",
|
||||
fontSize: 12,
|
||||
},
|
||||
legend: {
|
||||
top: "4%",
|
||||
left: "center",
|
||||
itemWidth: 13,
|
||||
itemHeight: 13,
|
||||
itemStyle: {
|
||||
color: "#00ffff",
|
||||
},
|
||||
icon: "rect",
|
||||
padding: 0,
|
||||
textStyle: {
|
||||
color: "#00ffff",
|
||||
fontSize: 12,
|
||||
padding: [2, 0, 0, 0],
|
||||
},
|
||||
},
|
||||
grid: {
|
||||
top: "40px", // 等价于 y: '16%'
|
||||
left: "35px",
|
||||
right: "45px",
|
||||
bottom: datalist.length < 8 ? "30px" : "45px",
|
||||
},
|
||||
xAxis: {
|
||||
axisLine: {
|
||||
show: true, //隐藏X轴轴线
|
||||
lineStyle: {
|
||||
color: "#00ffff",
|
||||
},
|
||||
},
|
||||
name: "片区",
|
||||
nameTextStyle: {
|
||||
color: "#00ffff",
|
||||
fontSize: 12,
|
||||
},
|
||||
axisLabel: {
|
||||
interval: 0,
|
||||
rotate: datalist.length < 8 ? "0" : "45",
|
||||
formatter: function (value) {
|
||||
if (value.length > 3) {
|
||||
return `${value.slice(0, 2)}...`;
|
||||
}
|
||||
return value;
|
||||
},
|
||||
textStyle: {
|
||||
color: "#00ffff", //坐标轴字颜色
|
||||
},
|
||||
margin: 10,
|
||||
},
|
||||
axisTick: {
|
||||
show: false, //隐藏X轴刻度
|
||||
},
|
||||
splitLine: {
|
||||
//网格线
|
||||
show: false,
|
||||
},
|
||||
data: titleList,
|
||||
type: "category",
|
||||
},
|
||||
yAxis: [
|
||||
{
|
||||
min: 0,
|
||||
max: 100,
|
||||
axisLine: {
|
||||
show: true, //隐藏X轴轴线
|
||||
lineStyle: {
|
||||
color: "#00ffff",
|
||||
},
|
||||
},
|
||||
axisTick: {
|
||||
show: false, //隐藏X轴刻度
|
||||
},
|
||||
axisLabel: {
|
||||
show: true,
|
||||
textStyle: {
|
||||
color: "#00ffff",
|
||||
},
|
||||
},
|
||||
splitLine: {
|
||||
//网格线
|
||||
show: true.valueOf,
|
||||
lineStyle: {
|
||||
type: "dashed",
|
||||
color: "#00ffff",
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "单位:%",
|
||||
nameTextStyle: {
|
||||
color: "#00ffff",
|
||||
|
||||
fontSize: 12,
|
||||
},
|
||||
position: "right",
|
||||
//right:'15%',
|
||||
axisLine: {
|
||||
show: false,
|
||||
},
|
||||
splitLine: {
|
||||
show: false,
|
||||
},
|
||||
},
|
||||
],
|
||||
series: [
|
||||
{
|
||||
name: "片区指标百分比",
|
||||
data: datalist,
|
||||
type: "bar",
|
||||
barMaxWidth: 20,
|
||||
barMinHeight: 5,
|
||||
// "barWidth": 7,
|
||||
barWidth: 17,
|
||||
itemStyle: {
|
||||
normal: {
|
||||
type: "linear",
|
||||
global: false,
|
||||
color: function (params) {
|
||||
if (params.value !=0.00159) {
|
||||
return new echarts.graphic.LinearGradient(0, 1, 0, 0, [
|
||||
{
|
||||
offset: 0,
|
||||
color: "#0b9eff",
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: "#00ffff",
|
||||
},
|
||||
]);
|
||||
} else if ((params.value == 0.00159)) {
|
||||
return new echarts.graphic.LinearGradient(0, 1, 0, 0, [
|
||||
{
|
||||
offset: 1,
|
||||
color: "#ccc",
|
||||
},
|
||||
]);
|
||||
}
|
||||
},
|
||||
},
|
||||
},
|
||||
label: {
|
||||
show: true,
|
||||
position: "top",
|
||||
color: "#fff",
|
||||
distance: 5,
|
||||
|
||||
formatter: function (params) {
|
||||
var val = params.value;
|
||||
if (val == 0.00159) {
|
||||
val = 0;
|
||||
}
|
||||
return val;
|
||||
},
|
||||
fontSize: 12,
|
||||
},
|
||||
},
|
||||
],
|
||||
};
|
||||
var app = {
|
||||
currentIndex: -1,
|
||||
};
|
||||
_this.time1 = setInterval(function () {
|
||||
var dataLen = option.series[0].data.length;
|
||||
|
||||
// 取消之前高亮的图形
|
||||
_this.myChart1.dispatchAction({
|
||||
type: "downplay",
|
||||
seriesIndex: 0,
|
||||
dataIndex: app.currentIndex,
|
||||
});
|
||||
app.currentIndex = (app.currentIndex + 1) % dataLen;
|
||||
//console.log(app.currentIndex);
|
||||
// 高亮当前图形
|
||||
_this.myChart1.dispatchAction({
|
||||
type: "highlight",
|
||||
seriesIndex: 0,
|
||||
dataIndex: app.currentIndex,
|
||||
});
|
||||
// 显示 tooltip
|
||||
_this.myChart1.dispatchAction({
|
||||
type: "showTip",
|
||||
seriesIndex: 0,
|
||||
dataIndex: app.currentIndex,
|
||||
});
|
||||
}, 2000);
|
||||
option && _this.myChart1.setOption(option, true);
|
||||
//window.echartsArr.push(_this.myChart1);
|
||||
setTimeout(function () {
|
||||
_this.myChart1.resize();
|
||||
}, 0);
|
||||
},
|
||||
async electr8() {
|
||||
let _this = this;
|
||||
let echarts = require("echarts");
|
||||
let domID1 = document.getElementById("electr_8");
|
||||
let titleList = [];
|
||||
let datalist = [];
|
||||
// await getHomeostasisLoad(this.form).then((res) => {
|
||||
this.electr8List.data.sort((a, b) => b.avg - a.avg).forEach((item) => {
|
||||
|
||||
// if (item.avg == 0) {
|
||||
// item.avg = 100 * 0.05;
|
||||
// }
|
||||
if (item.avg != 0) {
|
||||
titleList.push(item.name);
|
||||
datalist.push(item.avg);
|
||||
|
||||
}
|
||||
// });
|
||||
});
|
||||
setTimeout(() => {
|
||||
(domID1.style.width = this.$refs.electr_8.offsetWidth + "px"),
|
||||
(domID1.style.height = this.$refs.electr_8.offsetHeight + "px");
|
||||
}, 0);
|
||||
if (_this.myChart2 != null) {
|
||||
_this.myChart2.dispose();
|
||||
clearInterval(_this.time2);
|
||||
}
|
||||
_this.myChart2 = echarts.init(domID1);
|
||||
|
||||
var option = {
|
||||
tooltip: {
|
||||
showContent: true,
|
||||
trigger: "axis",
|
||||
backgroundColor: "rgba(8,36,68,.7)",
|
||||
color: "#00ffff",
|
||||
textStyle: {
|
||||
color: "#00ffff",
|
||||
},
|
||||
axisPointer: {
|
||||
// 坐标轴指示器，坐标轴触发有效
|
||||
type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
|
||||
},
|
||||
formatter: function (params) {
|
||||
var tips = "";
|
||||
tips += params[0].name + "</br/>";
|
||||
for (var i = 0; i < params.length; i++) {
|
||||
if (params[i].value == 3.14159) {
|
||||
tips += params[i].seriesName + "" + 0 + "<br/>";
|
||||
} else {
|
||||
tips += params[i].seriesName + "" + params[i].value + "%<br/>";
|
||||
}
|
||||
}
|
||||
return tips;
|
||||
},
|
||||
},
|
||||
textStyle: {
|
||||
color: "#00ffff",
|
||||
fontSize: 12,
|
||||
},
|
||||
legend: {
|
||||
top: "4%",
|
||||
left: "center",
|
||||
itemWidth: 13,
|
||||
itemHeight: 13,
|
||||
itemStyle: {
|
||||
color: "#00ffff",
|
||||
},
|
||||
icon: "rect",
|
||||
padding: 0,
|
||||
textStyle: {
|
||||
color: "#03E9FF",
|
||||
fontSize: 12,
|
||||
padding: [2, 0, 0, 0],
|
||||
},
|
||||
},
|
||||
grid: {
|
||||
top: "40px", // 等价于 y: '16%'
|
||||
left: "5px",
|
||||
right: "45px",
|
||||
bottom: "10px",
|
||||
containLabel: true
|
||||
},
|
||||
xAxis: {
|
||||
name: "负荷\n类型",
|
||||
nameTextStyle: {
|
||||
color: "#00ffff",
|
||||
fontSize: 12,
|
||||
},
|
||||
type: "category",
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: "#00ffff",
|
||||
width: 1,
|
||||
},
|
||||
},
|
||||
axisLabel: {
|
||||
textStyle: {
|
||||
fontFamily: "dinproRegular",
|
||||
color: "#00ffff",
|
||||
},
|
||||
rotate: 45,
|
||||
formatter: function (value) {
|
||||
if (value.length > 5) {
|
||||
return `${value.slice(0, 5)}...`;
|
||||
}
|
||||
return value;
|
||||
},
|
||||
},
|
||||
data: titleList,
|
||||
},
|
||||
yAxis: [
|
||||
{
|
||||
min: 0,
|
||||
max: 100,
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: "#00ffff",
|
||||
},
|
||||
},
|
||||
axisLabel: {
|
||||
show: true,
|
||||
textStyle: {
|
||||
color: "#00ffff",
|
||||
},
|
||||
},
|
||||
splitLine: {
|
||||
//分割线配置
|
||||
lineStyle: {
|
||||
type: "dashed",
|
||||
color: "#00ffff",
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "单位:%",
|
||||
nameTextStyle: {
|
||||
color: "#00ffff",
|
||||
|
||||
fontSize: 12,
|
||||
},
|
||||
position: "right",
|
||||
//right:'15%',
|
||||
axisLine: {
|
||||
show: false,
|
||||
},
|
||||
splitLine: {
|
||||
show: false,
|
||||
},
|
||||
},
|
||||
],
|
||||
|
||||
series: [
|
||||
{
|
||||
name: "负荷类型百分比",
|
||||
type: "bar",
|
||||
barMaxWidth: 20,
|
||||
barMinHeight: 5,
|
||||
label: {
|
||||
show: true,
|
||||
position: "top",
|
||||
color: "#fff",
|
||||
distance: 5,
|
||||
|
||||
formatter: function (params) {
|
||||
var val = params.value;
|
||||
if (val ==0.00159) {
|
||||
val = 0;
|
||||
}
|
||||
return val;
|
||||
},
|
||||
fontSize: 12,
|
||||
},
|
||||
data: datalist,
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: function (params) {
|
||||
if (params.value >= 90 && params.value <= 100) {
|
||||
return new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
1,
|
||||
0,
|
||||
0,
|
||||
[
|
||||
{
|
||||
offset: 1,
|
||||
color: "#82FF03",
|
||||
},
|
||||
{
|
||||
offset: 0,
|
||||
color: "#00ffff",
|
||||
},
|
||||
],
|
||||
false
|
||||
);
|
||||
} else if (params.value >= 60 && params.value <= 90) {
|
||||
return new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
1,
|
||||
0,
|
||||
0,
|
||||
[
|
||||
{
|
||||
offset: 1,
|
||||
color: "#FFF803 ",
|
||||
},
|
||||
{
|
||||
offset: 0,
|
||||
color: "#00ffff",
|
||||
},
|
||||
],
|
||||
false
|
||||
);
|
||||
} else if (params.value <= 60 && params.value != 3.14159) {
|
||||
return new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
1,
|
||||
0,
|
||||
0,
|
||||
[
|
||||
{
|
||||
offset: 1,
|
||||
color: "#FF0303",
|
||||
},
|
||||
{
|
||||
offset: 0,
|
||||
color: "#00ffff",
|
||||
},
|
||||
],
|
||||
false
|
||||
);
|
||||
} else if (params.value == 3.14159) {
|
||||
return new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
1,
|
||||
0,
|
||||
0,
|
||||
[
|
||||
{
|
||||
offset: 1,
|
||||
color: "#ccc",
|
||||
},
|
||||
],
|
||||
false
|
||||
);
|
||||
}
|
||||
},
|
||||
},
|
||||
},
|
||||
},
|
||||
],
|
||||
};
|
||||
var app = {
|
||||
currentIndex: -1,
|
||||
};
|
||||
_this.time2 = setInterval(function () {
|
||||
var dataLen = option.series[0].data.length;
|
||||
|
||||
// 取消之前高亮的图形
|
||||
_this.myChart2.dispatchAction({
|
||||
type: "downplay",
|
||||
seriesIndex: 0,
|
||||
dataIndex: app.currentIndex,
|
||||
});
|
||||
app.currentIndex = (app.currentIndex + 1) % dataLen;
|
||||
//console.log(app.currentIndex);
|
||||
// 高亮当前图形
|
||||
_this.myChart2.dispatchAction({
|
||||
type: "highlight",
|
||||
seriesIndex: 0,
|
||||
dataIndex: app.currentIndex,
|
||||
});
|
||||
// 显示 tooltip
|
||||
_this.myChart2.dispatchAction({
|
||||
type: "showTip",
|
||||
seriesIndex: 0,
|
||||
dataIndex: app.currentIndex,
|
||||
});
|
||||
}, 2000);
|
||||
option && _this.myChart2.setOption(option, true);
|
||||
//window.echartsArr.push(_this.myChart2);
|
||||
setTimeout(function () {
|
||||
_this.myChart2.resize();
|
||||
}, 0);
|
||||
},
|
||||
},
|
||||
|
||||
computed: {},
|
||||
|
||||
watch: {},
|
||||
};
|
||||
</script>
|
||||
<style lang="less" scoped>
|
||||
@import url("../../center/css/home.less");
|
||||
|
||||
// @import url("../center/css/change.less");
|
||||
@font-face {
|
||||
font-family: sszh;
|
||||
src: url("../../center/fonts/sszh.ttf");
|
||||
/* IE9+ */
|
||||
}
|
||||
|
||||
.MonitoringPointScale {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
.boxT {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 8%;
|
||||
font-family: "\5FAE\8F6F\96C5\9ED1";
|
||||
font-size: 0.85rem;
|
||||
line-height: 8%;
|
||||
// background-color: #29707f;
|
||||
letter-spacing: 1px;
|
||||
color: #07d8fd;
|
||||
cursor: pointer;
|
||||
background: linear-gradient(225deg, transparent 10px, #29707f 0) top right;
|
||||
|
||||
.imgicon {
|
||||
height: 100%;
|
||||
padding: 0 1.5%;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.divSpan {
|
||||
padding-left: 5%;
|
||||
font-size: 0.85rem;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
.boxB {
|
||||
position: relative;
|
||||
height: 92%;
|
||||
// background-color: rgb(41, 16, 16);
|
||||
}
|
||||
|
||||
.boxnum {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
right: 0;
|
||||
z-index: 100000000;
|
||||
}
|
||||
|
||||
.zong_title {
|
||||
font-size: 18px;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.zong_num {
|
||||
font-family: electricFont;
|
||||
font-size: 30px;
|
||||
color: rgb(0, 238, 255);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.add_title {
|
||||
font-size: 18px;
|
||||
color: rgb(0, 238, 255);
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.add_num {
|
||||
font-family: electricFont;
|
||||
font-size: 30px;
|
||||
color: yellow;
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.zong {
|
||||
margin-top: 20px;
|
||||
border: 1px solid yellow;
|
||||
border-radius: 8px;
|
||||
}
|
||||
|
||||
.add {
|
||||
margin-top: 5px;
|
||||
border: 1px solid rgb(0, 238, 255);
|
||||
border-radius: 8px;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
499
src/views/center/components/Table.vue
Normal file
499
src/views/center/components/Table.vue
Normal file
@@ -0,0 +1,499 @@
|
||||
<template>
|
||||
<div class="MapTable">
|
||||
<div @mouseover="mouseover" @mouseout="mouseout" style="cursor: pointer">
|
||||
<el-table class="ddf" style="width: 100%" ref="offromfixTable" header-cell-class-name="table_header"
|
||||
:header-cell-style="{ 'text-align': 'center', background: '#b1defd' }" :row-style="{
|
||||
height: '28px',
|
||||
color: '#f0cb0d',
|
||||
}" :cell-style="{
|
||||
padding: '0px',
|
||||
color: '#f0cb0d',
|
||||
}" @row-click="rowClick" :data="tableDataSon" :highlight-current-row="true">
|
||||
<el-table-column align="center" type="index" prop="number" label="序号" width="60px"></el-table-column>
|
||||
<el-table-column align="center" prop="time" min-width="220px" label="发生时刻"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column show-overflow-tooltip align="center" min-width="160px" prop="subName"
|
||||
label="变电站"></el-table-column>
|
||||
<el-table-column show-overflow-tooltip align="center" min-width="160px" prop="name"
|
||||
label="监测点"></el-table-column>
|
||||
<el-table-column show-overflow-tooltip align="center" min-width="80px" prop="reason" :formatter="formFilter"
|
||||
label="暂降原因"></el-table-column>
|
||||
<el-table-column show-overflow-tooltip align="center" min-width="80px" prop="type" :formatter="formFilter1"
|
||||
label="暂降类型"></el-table-column>
|
||||
<el-table-column show-overflow-tooltip align="center" min-width="120" prop="amplitude" label="暂降幅值(%)">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ (scope.row.amplitude * 100).toFixed() }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column show-overflow-tooltip align="center" min-width="100px" prop="duration"
|
||||
label="持续时间(s)"></el-table-column>
|
||||
</el-table>
|
||||
|
||||
<el-table ref="table" class="ddf swiper-page-table" element-loading-text="数据加载中" :header-cell-style="{
|
||||
height: '25px',
|
||||
padding: '0px',
|
||||
}" :row-style="{ height: '28px', color: '#04d9ff' }" :cell-style="{ padding: '0px', color: '#04d9ff' }"
|
||||
:data="tableData" style="width: 100%; height: 100%" :show-header="false" @row-click="rowClick"
|
||||
:height="vh - 162 + 'px'">
|
||||
<el-table-column align="center" type="index" prop="number" label="序号" width="60px"></el-table-column>
|
||||
<el-table-column align="center" prop="time" min-width="220px" label="发生时刻"
|
||||
show-overflow-tooltip></el-table-column>
|
||||
<el-table-column show-overflow-tooltip align="center" min-width="160px" prop="subName"
|
||||
label="变电站"></el-table-column>
|
||||
<el-table-column show-overflow-tooltip align="center" min-width="160px" prop="name"
|
||||
label="监测点"></el-table-column>
|
||||
<el-table-column show-overflow-tooltip align="center" min-width="80px" prop="reason" :formatter="formFilter"
|
||||
label="暂降原因"></el-table-column>
|
||||
<el-table-column show-overflow-tooltip align="center" min-width="80px" prop="type" :formatter="formFilter1"
|
||||
label="暂降类型"></el-table-column>
|
||||
<el-table-column show-overflow-tooltip align="center" min-width="120" prop="amplitude" label="暂降幅值(%)">
|
||||
<template slot-scope="scope">
|
||||
<span>{{ (scope.row.amplitude * 100).toFixed() }}</span>
|
||||
</template>
|
||||
</el-table-column>
|
||||
<el-table-column show-overflow-tooltip align="center" min-width="100px" prop="duration"
|
||||
label="持续时间(s)"></el-table-column>
|
||||
</el-table>
|
||||
</div>
|
||||
<el-dialog :close-on-click-modal="false" class="eldialotable" title="波形查看" :visible.sync="view2" v-if="view2"
|
||||
:append-to-body="true" :before-close="backbxlb" width="80%">
|
||||
<div>
|
||||
<el-row>
|
||||
<el-col :span="12">
|
||||
<span style="
|
||||
color: #fff;
|
||||
font-size: 14px;
|
||||
|
||||
line-height: 30px;
|
||||
">值类型选择:</span>
|
||||
<el-select v-model="value" @change="changeView" placeholder="请选择值类型">
|
||||
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"></el-option>
|
||||
</el-select>
|
||||
</el-col>
|
||||
</el-row>
|
||||
<el-tabs v-model="bxactiveName" @tab-click="bxhandleClick">
|
||||
<el-tab-pane label="瞬时波形" name="ssbx" :style="'height:' + bxecharts + ';overflow-y: scroll;'">
|
||||
<shushiboxi v-if="bxactiveName == 'ssbx' && showBoxi" :value="value" :boxoList="boxoList" :wp="wp"
|
||||
:DColor="true"></shushiboxi>
|
||||
</el-tab-pane>
|
||||
<el-tab-pane label="RMS波形" name="rmsbx" :style="'height:' + bxecharts + ';overflow-y: scroll;'">
|
||||
<rmsboxi v-if="bxactiveName == 'rmsbx' && showBoxi" :value="value" :boxoList="boxoList" :wp="wp"
|
||||
:DColor="true">
|
||||
</rmsboxi>
|
||||
</el-tab-pane>
|
||||
</el-tabs>
|
||||
</div>
|
||||
</el-dialog>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { eventLists } from "@/api/center/DropEvent.js";
|
||||
import { dicData } from "@/utils/dicData.js";
|
||||
import rmsboxi from "@/views/echarts/rmsboxi";
|
||||
import shushiboxi from "@/views/echarts/shushiboxi";
|
||||
import {
|
||||
getMonitorEventAnalyseWave,
|
||||
getTransientDetailById,
|
||||
} from "@/api/monitoringpointStatistics/echart";
|
||||
import jquery from "jquery";
|
||||
export default {
|
||||
components: { rmsboxi, shushiboxi },
|
||||
props: {
|
||||
height: {
|
||||
type: Number,
|
||||
required: false,
|
||||
},
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
wid: null,
|
||||
dialogVisible: false,
|
||||
isLoading: false,
|
||||
tableData: [],
|
||||
tableDataSon: [],
|
||||
type: [],
|
||||
reason: [],
|
||||
time: null,
|
||||
vh: null,
|
||||
formData: {
|
||||
deptIndex: "",
|
||||
searchBeginTime: this.getCurrentMonthFirst(),
|
||||
searchEndTime: this.getNowFormatDate(),
|
||||
},
|
||||
boxoList: {},
|
||||
wp: {},
|
||||
view: true,
|
||||
bxecharts: undefined,
|
||||
view2: false,
|
||||
bxactiveName: "ssbx",
|
||||
value: 1,
|
||||
showBoxi: true,
|
||||
options: [
|
||||
{
|
||||
value: 1,
|
||||
label: "一次值",
|
||||
},
|
||||
{
|
||||
value: 2,
|
||||
label: "二次值",
|
||||
},
|
||||
],
|
||||
};
|
||||
},
|
||||
created() {
|
||||
this.queryData();
|
||||
this.getclassificationData();
|
||||
},
|
||||
mounted() {
|
||||
this.setHeight();
|
||||
window.addEventListener("resize", this.setHeight);
|
||||
|
||||
this.tableScroll();
|
||||
},
|
||||
beforeDestroy() {
|
||||
window.removeEventListener("resize", this.setHeight);
|
||||
},
|
||||
methods: {
|
||||
setHeight() {
|
||||
this.wid = window.localStorage.getItem("appwidth") - 20 + "px";
|
||||
this.vh = this.height;
|
||||
console.log("🚀 ~ setHeight ~ this.height:", this.height)
|
||||
this.bxecharts = "74vh";
|
||||
},
|
||||
|
||||
changeView() {
|
||||
this.showBoxi = false;
|
||||
setTimeout(() => {
|
||||
this.showBoxi = true;
|
||||
}, 0);
|
||||
},
|
||||
// 表格单击
|
||||
async rowClick(e) {
|
||||
await getTransientDetailById({
|
||||
eventId: e.eventId,
|
||||
sysType: 0,
|
||||
smallType: 0,
|
||||
}).then((res) => {
|
||||
this.boxoList = res.data;
|
||||
});
|
||||
await getMonitorEventAnalyseWave({
|
||||
id: e.eventId,
|
||||
//id: "e178edd5-354c-49a7-b72f-119442080155",
|
||||
systemType: 0,
|
||||
type: 0,
|
||||
}).then((res) => {
|
||||
if (res.data == null) {
|
||||
return this.$message({
|
||||
message: res.message,
|
||||
type: "warning",
|
||||
});
|
||||
} else if (res != undefined) {
|
||||
this.wp = res.data;
|
||||
setTimeout(() => {
|
||||
this.view = false;
|
||||
this.view2 = true;
|
||||
jquery(".el-dialog__body").height(30 + "px");
|
||||
}, 0);
|
||||
}
|
||||
|
||||
// this.initWaves()
|
||||
});
|
||||
},
|
||||
|
||||
//里层波形tab标签页触发事件
|
||||
bxhandleClick(tab, event) {
|
||||
if (tab.name == "ssbx") {
|
||||
this.bxactiveName = "ssbx";
|
||||
} else if (tab.name == "rmsbx") {
|
||||
this.bxactiveName = "rmsbx";
|
||||
}
|
||||
// console.log(tab, event);
|
||||
},
|
||||
//返回触发事件
|
||||
backbxlb() {
|
||||
this.view = true;
|
||||
this.view2 = false;
|
||||
this.value = 1;
|
||||
},
|
||||
|
||||
// 鼠标经过
|
||||
mouseover() {
|
||||
clearInterval(this.time);
|
||||
},
|
||||
// 鼠标离开
|
||||
mouseout() {
|
||||
this.tableScroll();
|
||||
},
|
||||
tableScroll() {
|
||||
const table = this.$refs.table;
|
||||
// 拿到表格中承载数据的div元素
|
||||
const divData = table.bodyWrapper;
|
||||
// 拿到元素后，对元素进行定时增加距离顶部距离，实现滚动效果(此配置为每100毫秒移动1像素)
|
||||
this.time = setInterval(() => {
|
||||
// 元素自增距离顶部1像素
|
||||
divData.scrollTop += 1;
|
||||
// 判断元素是否滚动到底部(可视高度+距离顶部=整个高度)
|
||||
if (
|
||||
divData.clientHeight + divData.scrollTop >
|
||||
divData.scrollHeight - 1
|
||||
) {
|
||||
// 重置table距离顶部距离
|
||||
divData.scrollTop = 0;
|
||||
}
|
||||
}, 30); // 滚动速度
|
||||
},
|
||||
//大屏获取暂降事件最新50条数据
|
||||
queryData() {
|
||||
this.isLoading = true;
|
||||
this.formData.deptIndex = JSON.parse(
|
||||
window.localStorage.getItem("adminInfo")
|
||||
).deptId;
|
||||
eventLists(this.formData).then((res) => {
|
||||
// console.log(res);
|
||||
this.tableData = res.data;
|
||||
this.tableDataSon = [
|
||||
this.tableData[0],
|
||||
this.tableData[1],
|
||||
this.tableData[2],
|
||||
];
|
||||
this.isLoading = false;
|
||||
});
|
||||
},
|
||||
getclassificationData() {
|
||||
//暂态原因
|
||||
this.reason = dicData("Event_Reason", []);
|
||||
//暂态类型
|
||||
this.type = dicData("Event_Type", []);
|
||||
},
|
||||
formFilter(row) {
|
||||
let title = "";
|
||||
this.reason.forEach((item) => {
|
||||
if (row.reason == item.id) {
|
||||
title = item.name;
|
||||
}
|
||||
});
|
||||
return title;
|
||||
},
|
||||
formFilter1(row) {
|
||||
let title = "";
|
||||
this.type.forEach((item) => {
|
||||
if (row.type == item.id) {
|
||||
title = item.name;
|
||||
}
|
||||
});
|
||||
return title;
|
||||
},
|
||||
//获取当月第一天日期
|
||||
getCurrentMonthFirst() {
|
||||
var date = new Date();
|
||||
var year = date.getFullYear();
|
||||
date.setDate(1);
|
||||
var month = parseInt(date.getMonth() + 1);
|
||||
var day = date.getDate();
|
||||
if (month < 10) {
|
||||
month = "0" + month;
|
||||
}
|
||||
if (day < 10) {
|
||||
day = "0" + day;
|
||||
}
|
||||
return year + "-" + month + "-" + day;
|
||||
},
|
||||
//获取当天日期
|
||||
getNowFormatDate() {
|
||||
var date = new Date();
|
||||
var year = date.getFullYear();
|
||||
var month = date.getMonth() + 1;
|
||||
var day = date.getDate();
|
||||
if (month < 10) {
|
||||
month = "0" + month;
|
||||
}
|
||||
if (day < 10) {
|
||||
day = "0" + day;
|
||||
}
|
||||
return year + "-" + month + "-" + day;
|
||||
},
|
||||
},
|
||||
|
||||
computed: {},
|
||||
|
||||
watch: {
|
||||
height(val) {
|
||||
this.vh = val;
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
/* 最外层透明 */
|
||||
::v-deep .el-table,
|
||||
::v-deep .el-table__expanded-cell {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
/* 表格内背景颜色 */
|
||||
::v-deep .el-table th,
|
||||
::v-deep .el-table tr,
|
||||
::v-deep .el-table td {
|
||||
background-color: transparent;
|
||||
}
|
||||
|
||||
::v-deep .el-table tr,
|
||||
.el-table th,
|
||||
.el-table td {
|
||||
color: #0b8eb7;
|
||||
}
|
||||
|
||||
::v-deep .el-table__header th {
|
||||
color: #04e8ef !important;
|
||||
background: #10727d;
|
||||
}
|
||||
|
||||
::v-deep .el-table--scrollable-y .el-table__body-wrapper {
|
||||
overflow-y: hidden;
|
||||
}
|
||||
|
||||
::v-deep .table_header {
|
||||
background-color: #187d8b !important;
|
||||
}
|
||||
|
||||
::v-deep .el-table__header {
|
||||
|
||||
tr,
|
||||
th {
|
||||
background: #187d8b !important;
|
||||
}
|
||||
}
|
||||
|
||||
::v-deep .el-table td {
|
||||
// background-color: #055d6bcd !important;
|
||||
}
|
||||
|
||||
::v-deep .el-table--d .el-table__body tr.el-table__row--d td {
|
||||
background: #65c9c275 !important;
|
||||
}
|
||||
|
||||
::v-deep .el-dialog {
|
||||
// background-color: transparent;
|
||||
border: 1px solid #1697de;
|
||||
background-color: rgb(33 57 83 / 60%);
|
||||
margin-top: 2.56% !important;
|
||||
|
||||
.el-dialog__title {
|
||||
color: rgb(7, 216, 253);
|
||||
}
|
||||
|
||||
.el-dialog__header {
|
||||
// background-color: transparent ;
|
||||
background-color: rgb(33 57 83 / 0%);
|
||||
border-bottom: 1px solid #1697de;
|
||||
}
|
||||
|
||||
.el-dialog__body {
|
||||
padding: 10px !important;
|
||||
max-height: none;
|
||||
// height:85vh,
|
||||
}
|
||||
}
|
||||
|
||||
::v-deep .el-input__inner {
|
||||
background-color: rgb(33 57 83 / 60%);
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
::v-deep .el-tabs__item {
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
::v-deep.el-table--striped .el-table__body tr.el-table__row--striped td {
|
||||
background-color: #055d6b80 !important;
|
||||
}
|
||||
|
||||
::v-deep .el-tabs__item:hover {
|
||||
color: #06e0fa !important;
|
||||
opacity: 0.8;
|
||||
}
|
||||
|
||||
::v-deep .el-tabs__active-bar {
|
||||
background-color: #06e0fa !important;
|
||||
}
|
||||
|
||||
::v-deep .el-tabs__item.is-active {
|
||||
color: #06e0fa;
|
||||
}
|
||||
|
||||
::v-deep.el-table--striped .el-table__body tr:hover.el-table__row--striped>td {
|
||||
background-color: #055d6b80 !important;
|
||||
}
|
||||
|
||||
::v-deep.el-table .el-table__body tr:hover.el-table__row>td {
|
||||
background-color: #055d6b80 !important;
|
||||
}
|
||||
|
||||
::v-deep .dpjcksss .el-dialog .el-dialog__body {
|
||||
max-height: 70vh;
|
||||
padding: 0px !important;
|
||||
overflow-y: auto;
|
||||
}
|
||||
|
||||
/* // ----------修改elementui表格的默认样式----------- */
|
||||
::v-deep .el-table__body-wrapper {
|
||||
&::-webkit-scrollbar {
|
||||
// 整个滚动条
|
||||
width: 0; // 纵向滚动条的宽度
|
||||
background: rgba(213, 215, 220, 0.3);
|
||||
border: none;
|
||||
}
|
||||
|
||||
&::-webkit-scrollbar-track {
|
||||
// 滚动条轨道
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
|
||||
/* // --------------------隐藏table gutter列和内容区右侧的空白 start */
|
||||
::v-deep .el-table th.gutter {
|
||||
display: none;
|
||||
width: 0;
|
||||
}
|
||||
|
||||
::v-deep .el-table colgroup col[name="gutter"] {
|
||||
display: none;
|
||||
width: 0;
|
||||
}
|
||||
|
||||
::v-deep .el-table__body {
|
||||
width: 100% !important;
|
||||
}
|
||||
|
||||
/* // --------------------隐藏table gutter列和内容区右侧的空白 end */
|
||||
//2023-11-9
|
||||
::v-deep .el-table td.el-table__cell,
|
||||
.el-table th.el-table__cell.is-leaf {
|
||||
border: 0px;
|
||||
}
|
||||
|
||||
// ::v-deep.el-table td,
|
||||
// .el-table th.is-leaf {
|
||||
// // border-bottom: none;
|
||||
// border-right: 0.2px solid #f2f3f3 !important;
|
||||
// /*no*/
|
||||
// border-bottom: 0.2px solid #f2f3f3 !important;
|
||||
// /*no*/
|
||||
// }
|
||||
// ::v-deep .el-table--border,
|
||||
// .el-table--group {
|
||||
// border: 0.2px solid #f2f3f3 !important;
|
||||
// /*no*/
|
||||
// }
|
||||
|
||||
::v-deep .el-tabs__nav-wrap::after {
|
||||
content: "";
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
height: 0px;
|
||||
background-color: #e4e7ed;
|
||||
z-index: 1;
|
||||
}
|
||||
</style>
|
||||
448
src/views/center/components/UserScale.vue
Normal file
448
src/views/center/components/UserScale.vue
Normal file
@@ -0,0 +1,448 @@
|
||||
<template>
|
||||
<div class="box">
|
||||
<div class="boxTop">
|
||||
<img
|
||||
class="img"
|
||||
src="../images/d045d87176109fc1dfb3b09a583fea5.png"
|
||||
alt=""
|
||||
srcset=""
|
||||
/>
|
||||
<span>灿能用户规模</span>
|
||||
<div class="total">
|
||||
总计:<span>{{ total }}</span>
|
||||
</div>
|
||||
</div>
|
||||
<div class="boxBot" ref="Echarts">
|
||||
<div
|
||||
id="echart"
|
||||
style="width: 100%; height: 100%"
|
||||
v-loading="isLoading"
|
||||
></div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { getUserScale } from "@/api/center/DropEvent.js";
|
||||
export default {
|
||||
components: {},
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
zoom: undefined, //图表焦点校验
|
||||
h: undefined,
|
||||
isLoading: false,
|
||||
total: 0,
|
||||
myChart: null,
|
||||
time: null,
|
||||
};
|
||||
},
|
||||
created() {},
|
||||
|
||||
mounted() {
|
||||
this.zoom = 1 / document.body.style.zoom;
|
||||
window.addEventListener("resize", () => {
|
||||
this.zoom = 1 / document.body.style.zoom;
|
||||
});
|
||||
this.$nextTick(() => {
|
||||
this.province();
|
||||
setInterval(() => {
|
||||
clearInterval(this.time);
|
||||
|
||||
this.province();
|
||||
}, 60000 * 5);
|
||||
});
|
||||
},
|
||||
|
||||
methods: {
|
||||
//echarts图
|
||||
async province() {
|
||||
let xData = [];
|
||||
let yData1 = [];
|
||||
let yData2 = [];
|
||||
await getUserScale({
|
||||
deptIndex: "1",
|
||||
searchBeginTime: "2022-01-01",
|
||||
searchEndTime: "2022-01-01",
|
||||
}).then((res) => {
|
||||
var maxNum = res.data[0].incrementNum;
|
||||
for (let i = 0; i < res.data.length; i++) {
|
||||
if (res.data[i].incrementNum > maxNum) {
|
||||
maxNum = res.data[i].incrementNum;
|
||||
}
|
||||
this.total = maxNum;
|
||||
}
|
||||
res.data.forEach((item, i) => {
|
||||
if (i != 0) {
|
||||
item.timeId = item.timeId.slice(5);
|
||||
} else if (i == 0) {
|
||||
let month = item.timeId.slice(5);
|
||||
let year = item.timeId.slice(0, 4);
|
||||
item.timeId = month + "\n" + "(" + year + ")";
|
||||
}
|
||||
xData.push(item.timeId);
|
||||
yData1.push(item.monthIncrementNum || 0);
|
||||
yData2.push(item.incrementNum || 0);
|
||||
});
|
||||
});
|
||||
|
||||
this.isLoading = true;
|
||||
|
||||
// const data = await getUserScale();
|
||||
let _this = this;
|
||||
let echarts = require("echarts");
|
||||
let domID1 = document.getElementById("echart");
|
||||
setTimeout(() => {
|
||||
(domID1.style.width = this.$refs.Echarts.offsetWidth + "px"),
|
||||
(domID1.style.height = this.$refs.Echarts.offsetHeight + "px");
|
||||
}, 0);
|
||||
if (_this.myChart != null) {
|
||||
_this.myChart.dispose();
|
||||
}
|
||||
_this.myChart = echarts.init(domID1);
|
||||
this.isLoading = false;
|
||||
let option = {
|
||||
//backgroundColor: '#ddd',
|
||||
grid: {
|
||||
top: "40px", // 等价于 y: '16%'
|
||||
left: "35px",
|
||||
right: "45px",
|
||||
bottom: "30px",
|
||||
},
|
||||
color: function (params) {
|
||||
let colorArr =
|
||||
params.value > 0 ? ["#BFE905", "#03EEFF"] : ["#03EEFF", "#BFE905"];
|
||||
return new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
0,
|
||||
0,
|
||||
1,
|
||||
[
|
||||
{
|
||||
offset: 0,
|
||||
color: colorArr[0], // 0% 处的颜色
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: colorArr[1], // 100% 处的颜色
|
||||
},
|
||||
],
|
||||
false
|
||||
);
|
||||
},
|
||||
legend: {
|
||||
top: "2%",
|
||||
//orient: 'vertical',
|
||||
textStyle: {
|
||||
color: "#00ffff",
|
||||
},
|
||||
data: ["累计增量", "当月增量"],
|
||||
},
|
||||
tooltip: {
|
||||
showContent: true,
|
||||
trigger: "axis",
|
||||
backgroundColor: "rgba(8,36,68,.7)",
|
||||
axisPointer: {
|
||||
// 坐标轴指示器，坐标轴触发有效
|
||||
type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
|
||||
},
|
||||
color: "#00ffff",
|
||||
textStyle: {
|
||||
color: "#00ffff",
|
||||
},
|
||||
formatter: function (params) {
|
||||
var str = "";
|
||||
let year = xData[0].slice(4, 8);
|
||||
let month = params[0].axisValue.slice(0, 2);
|
||||
str += year + "-" + month + "<br/>";
|
||||
for (var i = 0; i < params.length; i++) {
|
||||
if (params[i].seriesName !== "") {
|
||||
str += params[i].seriesName + ":" + params[i].value + "<br/>";
|
||||
}
|
||||
}
|
||||
return str;
|
||||
},
|
||||
},
|
||||
xAxis: [
|
||||
{
|
||||
name: "时间",
|
||||
nameTextStyle: {
|
||||
color: "#07FCF0",
|
||||
// top:'5%',
|
||||
fontSize: 12,
|
||||
},
|
||||
type: "category",
|
||||
color: "#00ffff",
|
||||
data: xData,
|
||||
axisLabel: {
|
||||
margin: 4,
|
||||
color: "#00ffff",
|
||||
textStyle: {
|
||||
fontSize: 12,
|
||||
},
|
||||
// rotate: 30,
|
||||
},
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: "#00ffff",
|
||||
},
|
||||
},
|
||||
axisTick: {
|
||||
show: true,
|
||||
},
|
||||
},
|
||||
],
|
||||
yAxis: [
|
||||
{
|
||||
type: "value",
|
||||
splitNumber: 5,
|
||||
min: 0,
|
||||
max:
|
||||
Math.max(...yData1) +
|
||||
(Math.max(...yData1) % 5 == 0
|
||||
? 0
|
||||
: 5 - (Math.max(...yData1) % 5)),
|
||||
interval:
|
||||
(Math.max(...yData1) +
|
||||
(Math.max(...yData1) % 5 == 0
|
||||
? 0
|
||||
: 5 - (Math.max(...yData1) % 5))) /
|
||||
5,
|
||||
name: "当月增量(个)",
|
||||
minInterval: 1,
|
||||
nameTextStyle: {
|
||||
color: "#07FCF0",
|
||||
fontSize: 10,
|
||||
},
|
||||
axisLabel: {
|
||||
color: "#00ffff",
|
||||
textStyle: {
|
||||
fontSize: 12,
|
||||
},
|
||||
},
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: "#00ffff",
|
||||
},
|
||||
},
|
||||
axisTick: {
|
||||
show: false,
|
||||
},
|
||||
splitLine: {
|
||||
lineStyle: {
|
||||
color: "#00ffff",
|
||||
type: "dashed",
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
minInterval: 1,
|
||||
type: "value",
|
||||
name: "累计增量(个)",
|
||||
splitNumber: 5,
|
||||
min: 0,
|
||||
max:
|
||||
Math.max(...yData2) +
|
||||
(Math.max(...yData2) % 5 == 0
|
||||
? 0
|
||||
: 5 - (Math.max(...yData2) % 5)),
|
||||
interval:
|
||||
(Math.max(...yData2) +
|
||||
(Math.max(...yData2) % 5 == 0
|
||||
? 0
|
||||
: 5 - (Math.max(...yData2) % 5))) /
|
||||
5,
|
||||
nameTextStyle: {
|
||||
color: "#07FCF0",
|
||||
fontSize: 10,
|
||||
},
|
||||
axisLabel: {
|
||||
color: "#00ffff",
|
||||
textStyle: {
|
||||
fontSize: 12,
|
||||
},
|
||||
},
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: "#00ffff",
|
||||
},
|
||||
},
|
||||
axisTick: {
|
||||
show: false,
|
||||
},
|
||||
splitLine: {
|
||||
lineStyle: {
|
||||
color: "#00ffff",
|
||||
type: "dashed",
|
||||
},
|
||||
},
|
||||
},
|
||||
],
|
||||
series: [
|
||||
{
|
||||
type: "bar",
|
||||
name: "当月增量",
|
||||
data: yData1,
|
||||
barWidth: "15px",
|
||||
// itemStyle: {
|
||||
// normal: {
|
||||
// color: function (params) {
|
||||
// return new echarts.graphic.LinearGradient(
|
||||
// 0,
|
||||
// 0,
|
||||
// 0,
|
||||
// 1,
|
||||
// [
|
||||
// {
|
||||
// offset: 0,
|
||||
// color: "#BFE905", // 0% 处的颜色
|
||||
// },
|
||||
// {
|
||||
// offset: 1,
|
||||
// color: "#03EEFF", // 100% 处的颜色
|
||||
// },
|
||||
// ],
|
||||
// false
|
||||
// );
|
||||
// },
|
||||
// barBorderRadius: [30, 30, 15, 15],
|
||||
// },
|
||||
// },
|
||||
itemStyle: {
|
||||
//本月阻拦请求次数的数据渐变色设置，本章重点部分
|
||||
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
||||
{ offset: 0, color: "#BFE905" }, //开始的颜色
|
||||
{ offset: 1, color: "#03EEFF" }, //结束的颜色
|
||||
]), //中间可以设置多个数值，0 为百分之0 所以可以按照自己的想法，百分之10一个颜色变化都可。
|
||||
barBorderRadius: [30, 30, 15, 15],
|
||||
},
|
||||
barCategoryGap: "60%", //柱状图间距
|
||||
|
||||
label: {
|
||||
normal: {
|
||||
show: false,
|
||||
fontSize: 18,
|
||||
fontWeight: "bold",
|
||||
color: "#333",
|
||||
position: "top",
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
data: yData2,
|
||||
type: "line",
|
||||
smooth: false,
|
||||
name: "累计增量",
|
||||
showSymbol: true,
|
||||
yAxisIndex: 1,
|
||||
symbolSize: 8,
|
||||
zlevel: 3,
|
||||
lineStyle: {
|
||||
color: "#05FFDF",
|
||||
width: 2,
|
||||
shadowColor: "rgba(0, 0, 0, 0.3)", //设置折线阴影
|
||||
//shadowBlur: 15,
|
||||
// shadowOffsetY: 20,
|
||||
},
|
||||
},
|
||||
],
|
||||
};
|
||||
// // _this.myChart.resize();
|
||||
// let _this = this;
|
||||
// _this.$erd.listenTo(_this.$refs.fg, (element) => {
|
||||
// _this.$nextTick(() => {
|
||||
// _this.myChart.resize();
|
||||
// });
|
||||
// });
|
||||
// window.onresize = function () {
|
||||
// _this.myChart.resize();
|
||||
// };
|
||||
option && _this.myChart.setOption(option, true);
|
||||
//window.echartsArr.push(_this.myChart);
|
||||
|
||||
setTimeout(function () {
|
||||
_this.myChart.resize();
|
||||
let app = {
|
||||
currentIndex: -1,
|
||||
};
|
||||
|
||||
_this.time = setInterval(function () {
|
||||
var dataLen = option.series[0].data.length;
|
||||
|
||||
// 取消之前高亮的图形
|
||||
_this.myChart.dispatchAction({
|
||||
type: "downplay",
|
||||
seriesIndex: 0,
|
||||
dataIndex: app.currentIndex,
|
||||
});
|
||||
app.currentIndex = (app.currentIndex + 1) % dataLen;
|
||||
// 高亮当前图形
|
||||
_this.myChart.dispatchAction({
|
||||
type: "highlight",
|
||||
seriesIndex: 0,
|
||||
dataIndex: app.currentIndex,
|
||||
});
|
||||
// 显示 tooltip
|
||||
_this.myChart.dispatchAction({
|
||||
type: "showTip",
|
||||
seriesIndex: 0,
|
||||
dataIndex: app.currentIndex,
|
||||
});
|
||||
}, 2000);
|
||||
}, 0);
|
||||
},
|
||||
},
|
||||
beforeDestroy() {
|
||||
for (let i = 1; i < 10000; i++) {
|
||||
clearInterval(i);
|
||||
}
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
// @import url("../css/home.less");
|
||||
@font-face {
|
||||
font-family: sszh;
|
||||
src: url("../fonts/sszh.ttf"); /* IE9+ */
|
||||
}
|
||||
.box {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
.boxTop {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 8%;
|
||||
font-family: "\5FAE\8F6F\96C5\9ED1";
|
||||
font-size: 0.85rem;
|
||||
line-height: 8%;
|
||||
letter-spacing: 1px;
|
||||
color: #07d8fd;
|
||||
cursor: pointer;
|
||||
background: linear-gradient(225deg, transparent 10px, #29707f 0) top right;
|
||||
.img {
|
||||
height: 100%;
|
||||
padding: 0 1.5%;
|
||||
cursor: pointer;
|
||||
}
|
||||
.total {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
font-size: 0.85rem;
|
||||
color: rgb(0, 255, 0);
|
||||
transform: translate(-50%, -50%);
|
||||
span {
|
||||
font-family: electricFont;
|
||||
font-size: 1.3rem;
|
||||
color: #07d8fd;
|
||||
}
|
||||
}
|
||||
}
|
||||
.boxBot {
|
||||
height: 90%;
|
||||
// background-color: rgb(41, 16, 16);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
468
src/views/center/components/datashuju.vue
Normal file
468
src/views/center/components/datashuju.vue
Normal file
@@ -0,0 +1,468 @@
|
||||
<template>
|
||||
<div class="box">
|
||||
<Timeinterval ref="Timeinterval" :interval="3" v-show="false"></Timeinterval>
|
||||
<div class="boxTop">
|
||||
<img class="img" src="../images/d045d87176109fc1dfb3b09a583fea5.png" alt="" srcset="" />
|
||||
<span>片区数据完整性</span>
|
||||
<!-- <div class="total">
|
||||
总计:<span>{{ total }}</span>
|
||||
</div> -->
|
||||
</div>
|
||||
<div class="boxBot" ref="electrBoxgg">
|
||||
<div id="electrsj6" style="width: 100%; height: 100%" v-loading="isLoading"></div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { getUserScale } from "@/api/center/DropEvent.js";
|
||||
import { getTHDTopTenData, getLineIntegrityData } from "@/api/homePage/index";
|
||||
import Timeinterval from "@/views/Timeinterval/index.vue";
|
||||
import { dicData } from "@/utils/dicData.js";
|
||||
export default {
|
||||
components: { Timeinterval },
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
zoom: undefined, //图表焦点校验
|
||||
h: undefined,
|
||||
isLoading: false,
|
||||
total: 0,
|
||||
myChart: null,
|
||||
time: null,
|
||||
form: {
|
||||
deptIndex: "",
|
||||
monitorFlag: 2,
|
||||
powerFlag: 2,
|
||||
loadType: null,
|
||||
searchBeginTime: "",
|
||||
searchEndTime: "",
|
||||
statisticalType: "",
|
||||
timeFlag: 3,
|
||||
linePassRate: 0,
|
||||
},
|
||||
};
|
||||
},
|
||||
created() { },
|
||||
|
||||
mounted() {
|
||||
(this.form.deptIndex = JSON.parse(
|
||||
window.localStorage.getItem("adminInfo")
|
||||
).deptId),
|
||||
(this.form.statisticalType = dicData("Statistical_Type", [
|
||||
"Report_Type",
|
||||
])[0]);
|
||||
|
||||
(this.form.searchBeginTime = this.timefamt()[0]),
|
||||
(this.form.searchEndTime = this.timefamt()[1]),
|
||||
(this.zoom = 1 / document.body.style.zoom);
|
||||
window.addEventListener("resize", () => {
|
||||
this.zoom = 1 / document.body.style.zoom;
|
||||
});
|
||||
this.$nextTick(() => {
|
||||
this.VoltageOne();
|
||||
setInterval(() => {
|
||||
clearInterval(this.time);
|
||||
|
||||
this.VoltageOne();
|
||||
}, 60000 * 5);
|
||||
});
|
||||
},
|
||||
|
||||
methods: {
|
||||
//echarts图
|
||||
timefamt() {
|
||||
var date = new Date();
|
||||
var year = date.getFullYear();
|
||||
var month = date.getMonth() + 1;
|
||||
var day = date.getDate();
|
||||
month = month > 9 ? month : "0" + month;
|
||||
day = day < 10 ? "0" + day : day;
|
||||
var arr = [];
|
||||
var today2 = year + "-" + month + "-01";
|
||||
// var today2 = year + "-01-01";
|
||||
var today = year + "-" + month + "-" + day;
|
||||
arr.push(today2);
|
||||
arr.push(today);
|
||||
return arr;
|
||||
},
|
||||
|
||||
// 数据完整性统计统计 echartsn 1类
|
||||
async VoltageOne() {
|
||||
// const { data } = await Voltage();
|
||||
|
||||
this.form.serverName = "harmonic-boot";
|
||||
let title = [];
|
||||
let integrityData = [];
|
||||
|
||||
await getLineIntegrityData(this.form).then((res) => {
|
||||
// title = res.data.type;
|
||||
// integrityData = res.data.single;
|
||||
res.data.sort((a, b) => b.single - a.single).forEach((item) => {
|
||||
title.push(item.type);
|
||||
if (item.single === 0 || item.single === 3.14159) {
|
||||
item.single = 3.14159;
|
||||
integrityData.push(item.single);
|
||||
} else {
|
||||
integrityData.push(item.single);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
let echarts = require("echarts");
|
||||
let domID1 = document.getElementById("electrsj6");
|
||||
setTimeout(() => {
|
||||
(domID1.style.width = this.$refs.electrBoxgg.offsetWidth + "px"),
|
||||
(domID1.style.height = this.$refs.electrBoxgg.offsetHeight + "px");
|
||||
}, 0);
|
||||
let myChart2 = echarts.init(domID1);
|
||||
// let echartsData = data[0];
|
||||
let colors = ["#318af9", "#a6dffd"];
|
||||
|
||||
// 加阴影效果
|
||||
|
||||
let option = {
|
||||
title: {
|
||||
text: this.title,
|
||||
left: "center",
|
||||
|
||||
//subtext: '单位(%)'
|
||||
},
|
||||
tooltip: {
|
||||
trigger: "axis",
|
||||
backgroundColor: "rgba(8,36,68,.7)",
|
||||
color: "#00ffff",
|
||||
textStyle: {
|
||||
color: "#00ffff",
|
||||
},
|
||||
axisPointer: {
|
||||
// 坐标轴指示器，坐标轴触发有效
|
||||
type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
|
||||
},
|
||||
formatter: function (params) {
|
||||
var tips = "";
|
||||
tips += params[0].name;
|
||||
for (var i = 0; i < params.length; i++) {
|
||||
if (params[i].value == 3.14159) {
|
||||
tips += params[i].seriesName + "：暂无数据<br/>";
|
||||
} else {
|
||||
tips +=
|
||||
params[i].seriesName +
|
||||
"：" +
|
||||
params[i].value.toFixed(2) +
|
||||
"%<br/>";
|
||||
}
|
||||
}
|
||||
return tips;
|
||||
},
|
||||
},
|
||||
grid: {
|
||||
top: "60px", // 等价于 y: '16%'
|
||||
left: "35px",
|
||||
right: "45px",
|
||||
bottom: "20px",
|
||||
},
|
||||
legend: {
|
||||
top: "4%",
|
||||
left: "center",
|
||||
itemWidth: 13,
|
||||
itemHeight: 13,
|
||||
itemStyle: {
|
||||
color: "#00ffff",
|
||||
},
|
||||
icon: "rect",
|
||||
padding: 0,
|
||||
textStyle: {
|
||||
color: "#03E9FF",
|
||||
fontSize: 12,
|
||||
padding: [2, 0, 0, 0],
|
||||
},
|
||||
},
|
||||
xAxis: {
|
||||
type: "category",
|
||||
data: title,
|
||||
name: "片区",
|
||||
nameTextStyle: {
|
||||
color: "#07FCF0",
|
||||
// top:'5%',
|
||||
fontSize: 12,
|
||||
},
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: "#00ffff",
|
||||
},
|
||||
},
|
||||
axisTick: {
|
||||
show: false,
|
||||
|
||||
alignWithLabel: true,
|
||||
lineStyle: {
|
||||
color: "#00ffff",
|
||||
},
|
||||
},
|
||||
axisLabel: {
|
||||
color: "#00ffff",
|
||||
// interval: 0,
|
||||
rotate: 0,
|
||||
formatter: function (name) {
|
||||
//超出部分隐藏显示
|
||||
return name.length > 6 ? name.slice(0, 3) + "..." : name;
|
||||
},
|
||||
interval: 0,
|
||||
},
|
||||
},
|
||||
// toolbox: {
|
||||
// show: true,
|
||||
// feature: {
|
||||
// saveAsImage: { show: true },
|
||||
// // dataZoom: {
|
||||
// // yAxisIndex: 'none'
|
||||
// // },
|
||||
// // //restore: {},
|
||||
// // mark : {show: true},
|
||||
// //magicType : {show: true, type: ['line', 'bar']}
|
||||
// },
|
||||
// },
|
||||
yAxis: [
|
||||
{
|
||||
name: "",
|
||||
max: 100,
|
||||
min: 0,
|
||||
position: "left",
|
||||
nameTextStyle: {
|
||||
color: "#00ffff",
|
||||
|
||||
fontSize: 12,
|
||||
},
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: "#00ffff",
|
||||
},
|
||||
},
|
||||
axisLabel: {
|
||||
show: true,
|
||||
textStyle: {
|
||||
color: "#00ffff",
|
||||
},
|
||||
},
|
||||
splitLine: {
|
||||
show: false,
|
||||
//分割线配置
|
||||
lineStyle: {
|
||||
type: "dashed",
|
||||
color: "#00ffff",
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "单位:%",
|
||||
// max:100,
|
||||
// min:0,
|
||||
position: "right",
|
||||
nameTextStyle: {
|
||||
color: "#00ffff",
|
||||
|
||||
fontSize: 12,
|
||||
},
|
||||
},
|
||||
],
|
||||
series: [
|
||||
{
|
||||
name: "数据完整性",
|
||||
// name: this.timeValue,
|
||||
barMaxWidth: 20,
|
||||
type: "bar",
|
||||
label: {
|
||||
normal: {
|
||||
show: false,
|
||||
position: "top",
|
||||
},
|
||||
},
|
||||
itemStyle: {
|
||||
normal: {
|
||||
// 随机显示
|
||||
//color:function(d){return "#"+Math.floor(Math.random()*(256*256*256-1)).toString(16);}
|
||||
|
||||
// 定制显示（按顺序）
|
||||
color: function (params) {
|
||||
if (params.value == 3.14159) {
|
||||
return new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
1,
|
||||
0,
|
||||
0,
|
||||
[
|
||||
{
|
||||
offset: 1,
|
||||
color: "#ccc",
|
||||
},
|
||||
],
|
||||
false
|
||||
);
|
||||
} else if (params.value >= 90) {
|
||||
return new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
1,
|
||||
0,
|
||||
0,
|
||||
[
|
||||
{
|
||||
offset: 1,
|
||||
color: "#339966",
|
||||
},
|
||||
],
|
||||
false
|
||||
);
|
||||
} else if (params.value >= 60 && params.value <= 90) {
|
||||
return new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
1,
|
||||
0,
|
||||
0,
|
||||
[
|
||||
{
|
||||
offset: 1,
|
||||
color: "#FFCC33",
|
||||
},
|
||||
],
|
||||
false
|
||||
);
|
||||
// && params.value > 5
|
||||
} else if (params.value <= 60) {
|
||||
return new echarts.graphic.LinearGradient(
|
||||
0,
|
||||
1,
|
||||
0,
|
||||
0,
|
||||
[
|
||||
{
|
||||
offset: 1,
|
||||
color: "#CC0000",
|
||||
},
|
||||
],
|
||||
false
|
||||
);
|
||||
}
|
||||
},
|
||||
},
|
||||
},
|
||||
markLine: {
|
||||
silent: false,
|
||||
symbol: "circle",
|
||||
data: [
|
||||
{
|
||||
name: "完整性≥90%",
|
||||
yAxis: 100,
|
||||
lineStyle: {
|
||||
color: "#339966",
|
||||
},
|
||||
label: {
|
||||
position: "middle",
|
||||
formatter: "{b}",
|
||||
textStyle: {
|
||||
color: "#339966",
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "60%≤完整性<90%",
|
||||
yAxis: 90,
|
||||
lineStyle: {
|
||||
color: "#FFCC33",
|
||||
},
|
||||
label: {
|
||||
position: "middle",
|
||||
formatter: "{b}",
|
||||
textStyle: {
|
||||
color: "#FFCC33",
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "完整性<60%",
|
||||
yAxis: 60,
|
||||
lineStyle: {
|
||||
color: "#CC0000",
|
||||
},
|
||||
label: {
|
||||
position: "middle",
|
||||
formatter: "{b}",
|
||||
textStyle: {
|
||||
color: "#CC0000",
|
||||
},
|
||||
},
|
||||
},
|
||||
],
|
||||
},
|
||||
// data: this.ydata
|
||||
data: integrityData,
|
||||
},
|
||||
],
|
||||
};
|
||||
option && myChart2.setOption(option, true);
|
||||
//window.echartsArr.push(myChart2);
|
||||
setTimeout(function () {
|
||||
myChart2.resize();
|
||||
}, 0);
|
||||
},
|
||||
},
|
||||
beforeDestroy() {
|
||||
for (let i = 1; i < 10000; i++) {
|
||||
clearInterval(i);
|
||||
}
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
// @import url("../css/home.less");
|
||||
@font-face {
|
||||
font-family: sszh;
|
||||
src: url("../fonts/sszh.ttf");
|
||||
/* IE9+ */
|
||||
}
|
||||
|
||||
.box {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
.boxTop {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 8%;
|
||||
font-family: "\5FAE\8F6F\96C5\9ED1";
|
||||
font-size: 0.85rem;
|
||||
line-height: 8%;
|
||||
letter-spacing: 1px;
|
||||
color: #07d8fd;
|
||||
cursor: pointer;
|
||||
background: linear-gradient(225deg, transparent 10px, #29707f 0) top right;
|
||||
|
||||
.img {
|
||||
height: 100%;
|
||||
padding: 0 1.5%;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.total {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
font-size: 0.85rem;
|
||||
color: rgb(0, 255, 0);
|
||||
transform: translate(-50%, -50%);
|
||||
|
||||
span {
|
||||
font-family: electricFont;
|
||||
font-size: 1.3rem;
|
||||
color: #07d8fd;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.boxBot {
|
||||
height: 90%;
|
||||
// background-color: rgb(41, 16, 16);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
335
src/views/center/components/tHDistortion.vue
Normal file
335
src/views/center/components/tHDistortion.vue
Normal file
@@ -0,0 +1,335 @@
|
||||
<template>
|
||||
<div class="box">
|
||||
<Timeinterval ref="Timeinterval" :interval="3" v-show="false"></Timeinterval>
|
||||
<div class="boxTop">
|
||||
<img class="img" src="../images/d045d87176109fc1dfb3b09a583fea5.png" alt="" srcset="" />
|
||||
<span>谐波畸变率排名</span>
|
||||
<!-- <div class="total">
|
||||
总计:<span>{{ total }}</span>
|
||||
</div> -->
|
||||
</div>
|
||||
<div class="boxBot" ref="Echartspm">
|
||||
<div id="echartpm" style="width: 100%; height: 100%" v-loading="isLoading"></div>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<script>
|
||||
import { getUserScale } from "@/api/center/DropEvent.js";
|
||||
import { getTHDTopTenData } from "@/api/homePage/index";
|
||||
import Timeinterval from "@/views/Timeinterval/index.vue";
|
||||
export default {
|
||||
components: { Timeinterval },
|
||||
props: {},
|
||||
data() {
|
||||
return {
|
||||
zoom: undefined, //图表焦点校验
|
||||
h: undefined,
|
||||
isLoading: false,
|
||||
total: 0,
|
||||
myChart: null,
|
||||
time: null,
|
||||
};
|
||||
},
|
||||
created() { },
|
||||
|
||||
mounted() {
|
||||
this.zoom = 1 / document.body.style.zoom;
|
||||
window.addEventListener("resize", () => {
|
||||
this.zoom = 1 / document.body.style.zoom;
|
||||
});
|
||||
this.$nextTick(() => {
|
||||
this.province();
|
||||
setInterval(() => {
|
||||
clearInterval(this.time);
|
||||
|
||||
this.province();
|
||||
}, 60000 * 5);
|
||||
});
|
||||
},
|
||||
|
||||
methods: {
|
||||
//echarts图
|
||||
async province() {
|
||||
let name = [];
|
||||
let vthd = [];
|
||||
let transformerSubstation = [];
|
||||
await getTHDTopTenData({
|
||||
id: JSON.parse(window.localStorage.getItem("adminInfo")).deptId,
|
||||
startTime: this.$refs.Timeinterval.timeValue[0],
|
||||
endTime: this.$refs.Timeinterval.timeValue[1],
|
||||
type: 3,
|
||||
}).then((res) => {
|
||||
res.data.forEach((item) => {
|
||||
if (item.vthd) {
|
||||
name.push(item.name);
|
||||
transformerSubstation.push(item.subStationName)
|
||||
vthd.push(item.vthd);
|
||||
}
|
||||
});
|
||||
});
|
||||
|
||||
this.isLoading = true;
|
||||
|
||||
// const data = await getUserScale();
|
||||
let _this = this;
|
||||
let echarts = require("echarts");
|
||||
let domID1 = document.getElementById("echartpm");
|
||||
setTimeout(() => {
|
||||
(domID1.style.width = this.$refs.Echartspm.offsetWidth + "px"),
|
||||
(domID1.style.height = this.$refs.Echartspm.offsetHeight + "px");
|
||||
}, 0);
|
||||
if (_this.myChart != null) {
|
||||
_this.myChart.dispose();
|
||||
}
|
||||
_this.myChart = echarts.init(domID1);
|
||||
this.isLoading = false;
|
||||
let option = {
|
||||
tooltip: {
|
||||
trigger: "axis",
|
||||
backgroundColor: "rgba(8,36,68,.7)",
|
||||
color: "#00ffff",
|
||||
textStyle: {
|
||||
color: "#00ffff",
|
||||
},
|
||||
axisPointer: {
|
||||
// 坐标轴指示器，坐标轴触发有效
|
||||
type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
|
||||
},
|
||||
formatter: function (params) {
|
||||
|
||||
var tips = "";
|
||||
let index = name.indexOf(params[0].name)
|
||||
tips += '监测点' + "："+ params[0].name + "</br/>";
|
||||
tips += '变电站' + "：" + transformerSubstation[index] + "<br/>";
|
||||
tips += params[0].seriesName + "：" + params[0].value + "%<br/>";
|
||||
return tips;
|
||||
},
|
||||
},
|
||||
grid: {
|
||||
top: "40px", // 等价于 y: '16%'
|
||||
left: "50px",
|
||||
right: "55px",
|
||||
bottom: "50px",
|
||||
},
|
||||
legend: {
|
||||
top: "4%",
|
||||
left: "center",
|
||||
itemWidth: 13,
|
||||
itemHeight: 13,
|
||||
itemStyle: {
|
||||
color: "#00ffff",
|
||||
},
|
||||
icon: "rect",
|
||||
padding: 0,
|
||||
textStyle: {
|
||||
color: "#03E9FF",
|
||||
fontSize: 12,
|
||||
padding: [2, 0, 0, 0],
|
||||
},
|
||||
},
|
||||
xAxis: {
|
||||
type: "category",
|
||||
data: name,
|
||||
name: "监测点",
|
||||
nameTextStyle: {
|
||||
color: "#07FCF0",
|
||||
// top:'5%',
|
||||
fontSize: 12,
|
||||
},
|
||||
axisLine: {
|
||||
lineStyle: {
|
||||
color: "#00ffff",
|
||||
},
|
||||
},
|
||||
axisTick: {
|
||||
show: false,
|
||||
|
||||
alignWithLabel: true,
|
||||
lineStyle: {
|
||||
color: "#00ffff",
|
||||
},
|
||||
},
|
||||
axisLabel: {
|
||||
color: "#00ffff",
|
||||
// interval: 0,
|
||||
rotate: 45,
|
||||
formatter: function (name) {
|
||||
//超出部分隐藏显示
|
||||
return name.length > 6 ? name.slice(0, 3) + "..." : name;
|
||||
},
|
||||
interval: 0,
|
||||
},
|
||||
},
|
||||
|
||||
yAxis: [
|
||||
{
|
||||
axisLine: {
|
||||
show: true,
|
||||
lineStyle: {
|
||||
color: "#00ffff",
|
||||
},
|
||||
},
|
||||
axisLabel: {
|
||||
show: true,
|
||||
textStyle: {
|
||||
color: "#00ffff",
|
||||
},
|
||||
},
|
||||
splitLine: {
|
||||
//分割线配置
|
||||
lineStyle: {
|
||||
type: "dashed",
|
||||
color: "#00ffff",
|
||||
},
|
||||
},
|
||||
},
|
||||
{
|
||||
name: "单位:%",
|
||||
nameTextStyle: {
|
||||
color: "#00ffff",
|
||||
|
||||
fontSize: 12,
|
||||
},
|
||||
position: "right",
|
||||
//right:'15%',
|
||||
axisLine: {
|
||||
show: false,
|
||||
},
|
||||
splitLine: {
|
||||
show: false,
|
||||
},
|
||||
},
|
||||
],
|
||||
series: [
|
||||
{
|
||||
name: "谐波畸变率",
|
||||
type: "bar",
|
||||
barWidth: "20",
|
||||
label: {
|
||||
show: true,
|
||||
position: "top",
|
||||
color: "#fff",
|
||||
},
|
||||
itemStyle: {
|
||||
normal: {
|
||||
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
||||
{
|
||||
offset: 0,
|
||||
color: "#80ff09",
|
||||
},
|
||||
{
|
||||
offset: 1,
|
||||
color: "#05fffa",
|
||||
},
|
||||
]),
|
||||
},
|
||||
},
|
||||
data: vthd,
|
||||
},
|
||||
],
|
||||
};
|
||||
// // _this.myChart.resize();
|
||||
// let _this = this;
|
||||
// _this.$erd.listenTo(_this.$refs.fg, (element) => {
|
||||
// _this.$nextTick(() => {
|
||||
// _this.myChart.resize();
|
||||
// });
|
||||
// });
|
||||
// window.onresize = function () {
|
||||
// _this.myChart.resize();
|
||||
// };
|
||||
option && _this.myChart.setOption(option, true);
|
||||
//window.echartsArr.push(_this.myChart);
|
||||
|
||||
setTimeout(function () {
|
||||
_this.myChart.resize();
|
||||
let app = {
|
||||
currentIndex: -1,
|
||||
};
|
||||
|
||||
_this.time = setInterval(function () {
|
||||
var dataLen = option.series[0].data.length;
|
||||
|
||||
// 取消之前高亮的图形
|
||||
_this.myChart.dispatchAction({
|
||||
type: "downplay",
|
||||
seriesIndex: 0,
|
||||
dataIndex: app.currentIndex,
|
||||
});
|
||||
app.currentIndex = (app.currentIndex + 1) % dataLen;
|
||||
// 高亮当前图形
|
||||
_this.myChart.dispatchAction({
|
||||
type: "highlight",
|
||||
seriesIndex: 0,
|
||||
dataIndex: app.currentIndex,
|
||||
});
|
||||
// 显示 tooltip
|
||||
_this.myChart.dispatchAction({
|
||||
type: "showTip",
|
||||
seriesIndex: 0,
|
||||
dataIndex: app.currentIndex,
|
||||
});
|
||||
}, 2000);
|
||||
}, 0);
|
||||
},
|
||||
},
|
||||
beforeDestroy() {
|
||||
for (let i = 1; i < 10000; i++) {
|
||||
clearInterval(i);
|
||||
}
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<style lang="scss" scoped>
|
||||
// @import url("../css/home.less");
|
||||
@font-face {
|
||||
font-family: sszh;
|
||||
src: url("../fonts/sszh.ttf");
|
||||
/* IE9+ */
|
||||
}
|
||||
|
||||
.box {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
|
||||
.boxTop {
|
||||
position: relative;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
height: 8%;
|
||||
font-family: "\5FAE\8F6F\96C5\9ED1";
|
||||
font-size: 0.85rem;
|
||||
line-height: 8%;
|
||||
letter-spacing: 1px;
|
||||
color: #07d8fd;
|
||||
cursor: pointer;
|
||||
background: linear-gradient(225deg, transparent 10px, #29707f 0) top right;
|
||||
|
||||
.img {
|
||||
height: 100%;
|
||||
padding: 0 1.5%;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
.total {
|
||||
position: absolute;
|
||||
top: 50%;
|
||||
left: 50%;
|
||||
font-size: 0.85rem;
|
||||
color: rgb(0, 255, 0);
|
||||
transform: translate(-50%, -50%);
|
||||
|
||||
span {
|
||||
font-family: electricFont;
|
||||
font-size: 1.3rem;
|
||||
color: #07d8fd;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.boxBot {
|
||||
height: 90%;
|
||||
// background-color: rgb(41, 16, 16);
|
||||
}
|
||||
}
|
||||
</style>
|
||||
105
src/views/center/css/change.css
Normal file
105
src/views/center/css/change.css
Normal file
@@ -0,0 +1,105 @@
|
||||
.logo {
|
||||
font-size: 17px !important;
|
||||
}
|
||||
.main-tit {
|
||||
font-size: 14px;
|
||||
}
|
||||
.menu-tit {
|
||||
font-size: 14px;
|
||||
}
|
||||
.main-con {
|
||||
font-size: 10px !important;
|
||||
font-family: 'Microsoft YaHei';
|
||||
}
|
||||
.big-num {
|
||||
font-size: 14px;
|
||||
}
|
||||
.spe-border {
|
||||
height: 100%;
|
||||
background: linear-gradient(to left, #00bf8f, #00bf8f) left top no-repeat, linear-gradient(to bottom, #00bf8f, #00bf8f) left top no-repeat, linear-gradient(to left, #00bf8f, #00bf8f) right top no-repeat, linear-gradient(to bottom, #00bf8f, #00bf8f) right top no-repeat, linear-gradient(to left, #00bf8f, #00bf8f) left bottom no-repeat, linear-gradient(to bottom, #00bf8f, #00bf8f) left bottom no-repeat, linear-gradient(to left, #00bf8f, #00bf8f) right bottom no-repeat, linear-gradient(to left, #00bf8f, #00bf8f) right bottom no-repeat;
|
||||
background-size: 1px 5px, 5px 1px, 1px 5px, 5px 1px;
|
||||
}
|
||||
::-webkit-scrollbar {
|
||||
width: 8px;
|
||||
}
|
||||
::-webkit-scrollbar-thumb {
|
||||
background-color: #617d96;
|
||||
border-radius: 3px;
|
||||
height: 5px !important;
|
||||
}
|
||||
/* IE 浏览器 */
|
||||
.scrollbar {
|
||||
/*三角箭头的颜色*/
|
||||
scrollbar-arrow-color: #fff;
|
||||
/*滚动条滑块按钮的颜色*/
|
||||
scrollbar-face-color: #0099dd;
|
||||
/*滚动条整体颜色*/
|
||||
scrollbar-highlight-color: #0099dd;
|
||||
/*滚动条阴影*/
|
||||
scrollbar-shadow-color: #0099dd;
|
||||
/*滚动条轨道颜色*/
|
||||
scrollbar-track-color: #0066ff;
|
||||
/*滚动条3d亮色阴影边框的外观颜色——左边和上边的阴影色*/
|
||||
scrollbar-3dlight-color: #0099dd;
|
||||
/*滚动条3d暗色阴影边框的外观颜色——右边和下边的阴影色*/
|
||||
scrollbar-darkshadow-color: #0099dd;
|
||||
/*滚动条基准颜色*/
|
||||
scrollbar-base-color: #0099dd;
|
||||
}
|
||||
.yellow {
|
||||
color: #F7C709;
|
||||
}
|
||||
.yellow-bg {
|
||||
background-color: #f7c709;
|
||||
}
|
||||
.red {
|
||||
color: #EE1111;
|
||||
}
|
||||
.red-bg {
|
||||
background-color: #ee1111;
|
||||
}
|
||||
.blue {
|
||||
color: #1196EE;
|
||||
}
|
||||
.blue-bg {
|
||||
background-color: #1196ee;
|
||||
}
|
||||
.green {
|
||||
color: #11ee6d;
|
||||
}
|
||||
.green-bg {
|
||||
background-color: #11ee5b;
|
||||
}
|
||||
@keyframes pointer {
|
||||
0% {
|
||||
opacity: 1;
|
||||
transform: scale(1);
|
||||
}
|
||||
15% {
|
||||
opacity: 1;
|
||||
transform: scale(1.25);
|
||||
}
|
||||
30% {
|
||||
opacity: 0.8;
|
||||
transform: scale(1.5);
|
||||
}
|
||||
45% {
|
||||
opacity: 0.8;
|
||||
transform: scale(2);
|
||||
}
|
||||
60% {
|
||||
opacity: 0.8;
|
||||
transform: scale(2);
|
||||
}
|
||||
75% {
|
||||
opacity: 1;
|
||||
transform: scale(1.5);
|
||||
}
|
||||
100% {
|
||||
opacity: 1;
|
||||
transform: scale(1);
|
||||
}
|
||||
}
|
||||
.point-ani {
|
||||
animation: pointer 3s linear infinite;
|
||||
}
|
||||
97
src/views/center/css/change.less
Normal file
97
src/views/center/css/change.less
Normal file
@@ -0,0 +1,97 @@
|
||||
// 字体篇
|
||||
.logo{
|
||||
font-size: 17px !important;
|
||||
}
|
||||
.main-tit{
|
||||
font-size: 14px;
|
||||
}
|
||||
.menu-tit{
|
||||
font-size: 14px;
|
||||
}
|
||||
.main-con{
|
||||
font-size: 10px !important;
|
||||
font-family: 'Microsoft YaHei';
|
||||
}
|
||||
.big-num{
|
||||
font-size: 14px;
|
||||
}
|
||||
.spe-border{
|
||||
height: 100%;
|
||||
background: linear-gradient(to left, #00bf8f, #00bf8f) left top no-repeat,
|
||||
linear-gradient(to bottom, #00bf8f, #00bf8f) left top no-repeat,
|
||||
linear-gradient(to left, #00bf8f, #00bf8f) right top no-repeat,
|
||||
linear-gradient(to bottom, #00bf8f, #00bf8f) right top no-repeat,
|
||||
linear-gradient(to left, #00bf8f, #00bf8f) left bottom no-repeat,
|
||||
linear-gradient(to bottom, #00bf8f, #00bf8f) left bottom no-repeat,
|
||||
linear-gradient(to left, #00bf8f, #00bf8f) right bottom no-repeat,
|
||||
linear-gradient(to left, #00bf8f, #00bf8f) right bottom no-repeat;
|
||||
background-size: 1px 5px, 5px 1px, 1px 5px, 5px 1px;
|
||||
}
|
||||
//滚动条的宽度
|
||||
::-webkit-scrollbar {
|
||||
width: 8px;
|
||||
}
|
||||
|
||||
// 滚动条的滑块
|
||||
::-webkit-scrollbar-thumb {
|
||||
background-color: #617d96;
|
||||
border-radius: 3px;
|
||||
height: 5px !important;
|
||||
}
|
||||
|
||||
/* IE 浏览器 */
|
||||
.scrollbar {
|
||||
/*三角箭头的颜色*/
|
||||
scrollbar-arrow-color: #fff;
|
||||
/*滚动条滑块按钮的颜色*/
|
||||
scrollbar-face-color: #0099dd;
|
||||
/*滚动条整体颜色*/
|
||||
scrollbar-highlight-color: #0099dd;
|
||||
/*滚动条阴影*/
|
||||
scrollbar-shadow-color: #0099dd;
|
||||
/*滚动条轨道颜色*/
|
||||
scrollbar-track-color: #0066ff;
|
||||
/*滚动条3d亮色阴影边框的外观颜色——左边和上边的阴影色*/
|
||||
scrollbar-3dlight-color: #0099dd;
|
||||
/*滚动条3d暗色阴影边框的外观颜色——右边和下边的阴影色*/
|
||||
scrollbar-darkshadow-color: #0099dd;
|
||||
/*滚动条基准颜色*/
|
||||
scrollbar-base-color: #0099dd;
|
||||
}
|
||||
.yellow{
|
||||
color: #F7C709;
|
||||
}
|
||||
.yellow-bg{
|
||||
background-color: rgb(247,199,9);
|
||||
}
|
||||
.red{
|
||||
color: #EE1111;
|
||||
}
|
||||
.red-bg{
|
||||
background-color: rgb(238,17,17);
|
||||
}
|
||||
.blue{
|
||||
color: #1196EE;
|
||||
}
|
||||
.blue-bg{
|
||||
background-color: rgb(17,150,238);
|
||||
}
|
||||
.green{
|
||||
color: #11ee6d;
|
||||
}
|
||||
.green-bg{
|
||||
background-color: rgb(17, 238, 91);
|
||||
}
|
||||
@keyframes pointer
|
||||
{
|
||||
0% {opacity: 1;transform:scale(1);}
|
||||
15% {opacity: 1;transform:scale(1.25);}
|
||||
30% {opacity: 0.8;transform:scale(1.5);}
|
||||
45% {opacity: 0.8;transform:scale(2);}
|
||||
60% {opacity: 0.8;transform:scale(2);}
|
||||
75% {opacity: 1;transform:scale(1.5);}
|
||||
100% {opacity: 1;transform:scale(1);}
|
||||
}
|
||||
.point-ani{
|
||||
animation: pointer 3s linear infinite;
|
||||
}
|
||||
736
src/views/center/css/commonStyle.css
Normal file
736
src/views/center/css/commonStyle.css
Normal file
@@ -0,0 +1,736 @@
|
||||
.aside-submenu-title {
|
||||
background-color: rgba(5, 16, 16, 0.48) !important;
|
||||
}
|
||||
#app {
|
||||
font-family: 'Microsoft YaHei', 'Avenir', Helvetica, Arial, sans-serif;
|
||||
}
|
||||
.el-main > div:nth-child(1) > div:nth-child(1) {
|
||||
text-align: center;
|
||||
margin-bottom: 48px;
|
||||
font-weight: bold;
|
||||
font-size: 18px;
|
||||
}
|
||||
body .el-table th.gutter {
|
||||
display: table-cell !important;
|
||||
}
|
||||
.el-table th,
|
||||
.el-table {
|
||||
background-color: #153741 !important;
|
||||
color: #35b1b7;
|
||||
}
|
||||
.el-table th {
|
||||
padding: 4px 0 !important;
|
||||
}
|
||||
.el-table__expand-icon {
|
||||
color: #fff !important;
|
||||
}
|
||||
.el-table-column--selection > div {
|
||||
text-align: left !important;
|
||||
}
|
||||
.el-table--border,
|
||||
.el-table--group {
|
||||
border: 1px solid #446575;
|
||||
/*no*/
|
||||
}
|
||||
.el-table tbody td .cell {
|
||||
margin-right: 12px;
|
||||
}
|
||||
.el-table--border::after,
|
||||
.el-table--group::after,
|
||||
.el-table::before {
|
||||
background-color: #ebeef500;
|
||||
}
|
||||
.el-table th div {
|
||||
text-align: center;
|
||||
}
|
||||
.el-table__empty-text,
|
||||
.el-table td {
|
||||
color: #e2e6ec;
|
||||
}
|
||||
.el-table td,
|
||||
.el-table th.is-leaf {
|
||||
border-right: 1px solid #446575;
|
||||
/*no*/
|
||||
border-bottom: 1px solid #446575;
|
||||
/*no*/
|
||||
}
|
||||
.el-table__row > td {
|
||||
border: none;
|
||||
border-right: 1px solid #446575;
|
||||
/*no*/
|
||||
border-bottom: 1px solid #446575;
|
||||
/*no*/
|
||||
}
|
||||
.el-table::before {
|
||||
height: 0px;
|
||||
color: #446575;
|
||||
}
|
||||
.el-table,
|
||||
.el-table__expanded-cell {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
el-table th,
|
||||
.el-table tr,
|
||||
.el-table td {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
.el-table td {
|
||||
padding: 5px 0px !important;
|
||||
}
|
||||
.el-table tbody tr:hover > td {
|
||||
background-color: #367f7f78 !important;
|
||||
}
|
||||
.el-table__row--striped td {
|
||||
background-color: #45797b33 !important;
|
||||
}
|
||||
.el-table__row:not(.el-table__row--striped) {
|
||||
background: #1439391c !important;
|
||||
}
|
||||
.el-table .el-button {
|
||||
margin-top: 5px;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
.el-table .ascending .sort-caret.ascending {
|
||||
border-bottom-color: #34d2d2 !important;
|
||||
}
|
||||
.el-table .descending .sort-caret.descending {
|
||||
border-top-color: #34d2d2 !important;
|
||||
}
|
||||
.el-table .el-table tr th::before {
|
||||
display: none;
|
||||
}
|
||||
.el-table .el-table {
|
||||
margin: 20px 20px 20px 46px;
|
||||
width: 95%;
|
||||
}
|
||||
.el-table .el-table th {
|
||||
background-color: #1a3968 !important;
|
||||
color: #a3a8e6 !important;
|
||||
}
|
||||
.el-input.is-disabled .el-input__inner,
|
||||
.el-range-editor.is-disabled,
|
||||
.el-range-editor.is-disabled input,
|
||||
.is-disabled .el-textarea__inner {
|
||||
color: #c8d4e4 !important;
|
||||
background-color: #354460 !important;
|
||||
border: none;
|
||||
}
|
||||
.is-disabled .el-range__icon {
|
||||
color: #abb8ca;
|
||||
}
|
||||
.el-dialog {
|
||||
background-color: rgba(12, 24, 49, 0.9) !important;
|
||||
margin-top: 14vh;
|
||||
margin: 14vh auto 0px !important;
|
||||
}
|
||||
.el-dialog .el-dialog__header {
|
||||
border-bottom: 1px solid #40ffff59;
|
||||
/*no*/
|
||||
}
|
||||
.el-dialog .el-dialog__header .el-dialog__title {
|
||||
color: #d4e0f0;
|
||||
font-weight: bold;
|
||||
}
|
||||
.el-dialog .el-dialog__body {
|
||||
padding: 40px;
|
||||
}
|
||||
.el-dialog .el-dialog__body label {
|
||||
color: #9acaf7;
|
||||
}
|
||||
.el-dialog .el-tree__empty-text {
|
||||
color: #9acaf7;
|
||||
}
|
||||
.el-dialog .button-group {
|
||||
text-align: right;
|
||||
margin-top: 36px;
|
||||
}
|
||||
.el-dialog .el-table th {
|
||||
background-color: #111d40;
|
||||
color: #7788b9;
|
||||
padding: 0px 0px !important;
|
||||
}
|
||||
.el-dialog .el-table__empty-text {
|
||||
color: #7788b9;
|
||||
}
|
||||
.el-dialog .el-tree {
|
||||
border: 1px solid #9acaf7;
|
||||
/*no*/
|
||||
border-radius: 7px;
|
||||
}
|
||||
.el-dialog .el-dialog__wrapper {
|
||||
max-height: 98vh;
|
||||
}
|
||||
.el-message-box {
|
||||
background-color: rgba(10, 18, 25, 0.9) !important;
|
||||
border: none;
|
||||
}
|
||||
.el-message-box .el-message-box__title,
|
||||
.el-message-box .el-message-box__message {
|
||||
color: #b2bece !important;
|
||||
}
|
||||
.el-transfer-panel {
|
||||
background: #111d25 !important;
|
||||
}
|
||||
.el-transfer-panel .el-transfer-panel__header {
|
||||
background: #21405d !important;
|
||||
}
|
||||
.el-transfer-panel .el-transfer-panel__header .el-checkbox .el-checkbox__label,
|
||||
.el-transfer-panel .el-transfer-panel__header .el-checkbox .el-checkbox__label span {
|
||||
color: #a1d8f9 !important;
|
||||
}
|
||||
.el-transfer-panel__item {
|
||||
display: block !important;
|
||||
}
|
||||
.el-button--primary {
|
||||
background-color: #2b9999 !important;
|
||||
border: none !important;
|
||||
color: #FFF !important;
|
||||
}
|
||||
.el-button--primary:hover,
|
||||
.el-button--primary:focus {
|
||||
background-color: #38cece !important;
|
||||
}
|
||||
.el-button--danger {
|
||||
background-color: #9e1e01 !important;
|
||||
border: none;
|
||||
}
|
||||
.el-button--warning.is-disabled,
|
||||
.el-button--primary.is-disabled,
|
||||
.el-button--danger.is-disabled,
|
||||
.el-button--danger.is-disabled:active,
|
||||
.el-button--danger.is-disabled:focus,
|
||||
.el-button--danger.is-disabled:hover,
|
||||
.el-button--warning.is-disabled:active,
|
||||
.el-button--warning.is-disabled:focus,
|
||||
.el-button--warning.is-disabled:hover,
|
||||
.el-button--primary.is-disabled:active,
|
||||
.el-button--primary.is-disabled:focus,
|
||||
.el-button--primary.is-disabled:hover {
|
||||
background-color: #929292 !important;
|
||||
border: none;
|
||||
}
|
||||
.el-button--warning {
|
||||
background-color: #b4843c !important;
|
||||
border: none;
|
||||
}
|
||||
.el-button--warning:hover {
|
||||
background-color: #e4a84f !important;
|
||||
border: none;
|
||||
}
|
||||
::-webkit-scrollbar {
|
||||
width: 8px;
|
||||
}
|
||||
::-webkit-scrollbar-thumb {
|
||||
background-color: #617d96;
|
||||
border-radius: 3px;
|
||||
height: 5px !important;
|
||||
}
|
||||
/* IE 浏览器 */
|
||||
.scrollbar {
|
||||
/*三角箭头的颜色*/
|
||||
scrollbar-arrow-color: #fff;
|
||||
/*滚动条滑块按钮的颜色*/
|
||||
scrollbar-face-color: #0099dd;
|
||||
/*滚动条整体颜色*/
|
||||
scrollbar-highlight-color: #0099dd;
|
||||
/*滚动条阴影*/
|
||||
scrollbar-shadow-color: #0099dd;
|
||||
/*滚动条轨道颜色*/
|
||||
scrollbar-track-color: #0066ff;
|
||||
/*滚动条3d亮色阴影边框的外观颜色——左边和上边的阴影色*/
|
||||
scrollbar-3dlight-color: #0099dd;
|
||||
/*滚动条3d暗色阴影边框的外观颜色——右边和下边的阴影色*/
|
||||
scrollbar-darkshadow-color: #0099dd;
|
||||
/*滚动条基准颜色*/
|
||||
scrollbar-base-color: #0099dd;
|
||||
}
|
||||
.el-pagination {
|
||||
margin-top: 10px;
|
||||
text-align: right;
|
||||
}
|
||||
.el-pagination .el-input {
|
||||
width: 60% !important;
|
||||
}
|
||||
.el-pagination .el-input .el-input__inner {
|
||||
color: #b2bece !important;
|
||||
background-color: #ffffff00 !important;
|
||||
}
|
||||
.el-pagination .el-pagination__total,
|
||||
.el-pagination .el-select .el-input .el-select__caret,
|
||||
.el-pagination .btn-prev,
|
||||
.el-pagination .btn-next {
|
||||
color: #b2bece !important;
|
||||
}
|
||||
.el-pagination .el-dialog,
|
||||
.el-pagination .el-pager li,
|
||||
.el-pagination button:disabled,
|
||||
.el-pagination .btn-prev,
|
||||
.el-pagination .btn-next {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
.el-pagination .el-pager li {
|
||||
color: #b2bece !important;
|
||||
}
|
||||
.el-pagination .el-pager .active {
|
||||
color: #09e8e8 !important;
|
||||
}
|
||||
.el-loading-mask {
|
||||
background-color: rgba(13, 26, 40, 0.8) !important;
|
||||
}
|
||||
.select-view {
|
||||
margin-top: 16px;
|
||||
}
|
||||
.select-view .echart-icon:hover {
|
||||
border: 1px solid #19f602 !important;
|
||||
/*no*/
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
border: 1px solid #8a8a8a;
|
||||
/*no*/
|
||||
vertical-align: middle;
|
||||
background-position: 4px 4px;
|
||||
background-size: 60%;
|
||||
margin-right: 0px;
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
margin-left: -5px;
|
||||
}
|
||||
.select-view .echart-icon-active {
|
||||
border: 1px solid #19f602 !important;
|
||||
/*no*/
|
||||
}
|
||||
.select-view .table-icon:hover {
|
||||
border: 1px solid #19f602 !important;
|
||||
/*no*/
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
border: 1px solid #8a8a8a;
|
||||
/*no*/
|
||||
vertical-align: middle;
|
||||
background-position: 4px 4px;
|
||||
background-size: 60%;
|
||||
margin-right: 0px;
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
margin-left: -5px;
|
||||
}
|
||||
.select-view .table-icon-active {
|
||||
border: 1px solid #19f602 !important;
|
||||
/*no*/
|
||||
}
|
||||
.select-view .change-icon {
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
border: 1px solid #8a8a8a;
|
||||
/*no*/
|
||||
vertical-align: middle;
|
||||
background-position: 4px 4px;
|
||||
background-size: 60%;
|
||||
margin-right: 0px;
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
margin-left: -5px;
|
||||
}
|
||||
.block {
|
||||
border: 1px solid #2c667e;
|
||||
/*no*/
|
||||
padding: 15px 10px 10px;
|
||||
border-radius: 5px;
|
||||
position: relative;
|
||||
height: 100%;
|
||||
}
|
||||
.block .block-title {
|
||||
position: absolute;
|
||||
background-color: #153a38d9;
|
||||
padding: 5px 10px;
|
||||
color: #c1ffe9;
|
||||
top: -14px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
.block .empty-text {
|
||||
position: absolute;
|
||||
top: 40%;
|
||||
left: 50%;
|
||||
color: #909399;
|
||||
}
|
||||
.el-input__inner {
|
||||
background-color: transparent !important;
|
||||
color: #b2bece;
|
||||
}
|
||||
.el-textarea__inner {
|
||||
color: #b2bece !important;
|
||||
}
|
||||
.el-select .el-input.is-focus .el-input__inner,
|
||||
.el-input.is-focus,
|
||||
.el-input__inner:focus-within {
|
||||
border-color: #40ffff !important;
|
||||
}
|
||||
.el-form-item.is-error .el-input__inner,
|
||||
.el-form-item.is-error .el-input__inner:focus,
|
||||
.el-form-item.is-error .el-textarea__inner,
|
||||
.el-form-item.is-error .el-textarea__inner:focus,
|
||||
.el-message-box__input input.invalid,
|
||||
.el-message-box__input input.invalid:focus {
|
||||
border-color: #F56C6C !important;
|
||||
}
|
||||
.el-select-dropdown.is-multiple .el-select-dropdown__item.selected {
|
||||
background-color: #1d2a46 !important;
|
||||
}
|
||||
.el-select-dropdown,
|
||||
.el-picker-panel,
|
||||
.el-dropdown-menu {
|
||||
background-color: #1d2a46 !important;
|
||||
border: 1px solid #40ffff;
|
||||
/*no*/
|
||||
}
|
||||
.el-tag.el-tag--info {
|
||||
background-color: #2b9999 !important;
|
||||
border-color: #06f3d2 !important;
|
||||
color: #ffffff !important;
|
||||
}
|
||||
.el-select-dropdown__item,
|
||||
.el-dropdown-menu__item {
|
||||
color: #b2bece !important;
|
||||
}
|
||||
.el-select-dropdown__item.hover,
|
||||
.el-tree-node__content:hover,
|
||||
.el-dropdown-menu__item:hover {
|
||||
background-color: #145e5e !important;
|
||||
}
|
||||
.el-tree-node__content {
|
||||
background: transparent !important;
|
||||
}
|
||||
.is-current > .el-tree-node__content,
|
||||
.is-current > .el-tree-node__content:focus {
|
||||
background-color: #247676 !important;
|
||||
}
|
||||
.el-checkbox__input.is-disabled.is-checked .el-checkbox__inner {
|
||||
background-color: #2f3235;
|
||||
}
|
||||
.el-checkbox__input.is-checked .el-checkbox__inner,
|
||||
.el-checkbox__input.is-indeterminate .el-checkbox__inner {
|
||||
background-color: #0dcac1;
|
||||
border-color: #dfefed;
|
||||
}
|
||||
.el-checkbox__input.is-checked + .el-checkbox__label {
|
||||
color: #0be9ff;
|
||||
}
|
||||
input::-webkit-input-placeholder {
|
||||
color: #787b80 !important;
|
||||
}
|
||||
input::-moz-input-placeholder {
|
||||
color: #787b80 !important;
|
||||
}
|
||||
input::-ms-input-placeholder {
|
||||
color: #787b80 !important;
|
||||
}
|
||||
.el-time-spinner__item {
|
||||
height: auto !important;
|
||||
}
|
||||
.el-picker-panel {
|
||||
color: #afb9b9 !important;
|
||||
}
|
||||
.time-select-item.selected:not(.disabled) {
|
||||
color: #32fbf2 !important;
|
||||
}
|
||||
.time-select-item:hover {
|
||||
background-color: #12504d !important;
|
||||
}
|
||||
.el-date-table td.today span {
|
||||
color: #00fff3 !important;
|
||||
}
|
||||
.el-date-table td.disabled div {
|
||||
background-color: #1d2a46;
|
||||
color: #616263;
|
||||
}
|
||||
.el-date-table td.disabled div span {
|
||||
color: #616263 !important;
|
||||
}
|
||||
.el-time-range-picker__header {
|
||||
color: #e4e4e4 !important;
|
||||
}
|
||||
.el-time-spinner__item.disabled {
|
||||
color: #575e6d !important;
|
||||
}
|
||||
.el-picker-panel__body-wrapper span,
|
||||
.el-picker-panel__body-wrapper a {
|
||||
color: #b2bece !important;
|
||||
}
|
||||
.el-range-editor.is-active,
|
||||
.el-range-editor.is-active:hover {
|
||||
border-color: #40ffff;
|
||||
}
|
||||
.el-range-input {
|
||||
background: transparent;
|
||||
color: #b2bece !important;
|
||||
}
|
||||
.el-date-editor .el-range-separator,
|
||||
.el-date-range-picker__header div {
|
||||
color: #b2bece;
|
||||
}
|
||||
.el-picker-panel__footer {
|
||||
background: transparent;
|
||||
}
|
||||
.el-picker-panel__footer .el-button--text {
|
||||
color: #40ffff;
|
||||
}
|
||||
.el-picker-panel__footer .el-button--default {
|
||||
background: #2b9494;
|
||||
border: none;
|
||||
}
|
||||
.el-picker-panel__footer .el-button--default span {
|
||||
color: #fff;
|
||||
}
|
||||
.el-picker-panel__footer .el-button.is-plain:focus,
|
||||
.el-picker-panel__footer .el-button.is-plain:hover {
|
||||
background: #1a5c5c !important;
|
||||
border: none;
|
||||
}
|
||||
.el-select-dropdown__item.selected,
|
||||
.el-month-table td .cell:hover,
|
||||
.current a {
|
||||
color: #40ffff !important;
|
||||
}
|
||||
.el-date-picker__header {
|
||||
padding-bottom: 2px;
|
||||
margin: 3px !important;
|
||||
border-bottom: solid 1px #40ffff;
|
||||
/*no*/
|
||||
}
|
||||
.el-picker-panel__content th {
|
||||
color: #b2bece !important;
|
||||
}
|
||||
.el-picker-panel__content .el-date-table td.in-range div {
|
||||
background-color: #13969647;
|
||||
}
|
||||
.el-picker-panel__content .el-date-table td.end-date span,
|
||||
.el-picker-panel__content .el-date-table td.start-date span,
|
||||
.el-picker-panel__content .el-date-table td.current:not(.disabled) span {
|
||||
background-color: #1d881b;
|
||||
}
|
||||
.el-button.is-disabled.is-plain,
|
||||
.el-button.is-disabled.is-plain:focus,
|
||||
.el-button.is-disabled.is-plain:hover {
|
||||
background-color: #616868 !important;
|
||||
}
|
||||
.el-time-panel {
|
||||
background-color: #1d2a46;
|
||||
}
|
||||
.el-time-panel__btn {
|
||||
color: #40ffff !important;
|
||||
}
|
||||
.el-time-spinner__item {
|
||||
color: #b2bece;
|
||||
}
|
||||
.el-time-spinner__item:not(.active):hover {
|
||||
background-color: #2b9494 !important;
|
||||
}
|
||||
.el-time-spinner__item.active:not(.disabled) {
|
||||
color: #40ffff;
|
||||
}
|
||||
.el-picker-panel__icon-btn {
|
||||
color: #40ffff !important;
|
||||
}
|
||||
.popper__arrow::after {
|
||||
border-bottom-color: #40ffff !important;
|
||||
}
|
||||
.el-tree {
|
||||
background-color: transparent !important;
|
||||
overflow-y: scroll;
|
||||
}
|
||||
.el-tree span {
|
||||
color: #b2bece !important;
|
||||
}
|
||||
.el-textarea__inner {
|
||||
background: transparent;
|
||||
}
|
||||
.el-radio {
|
||||
color: #b2bece !important;
|
||||
}
|
||||
.is-checked .el-radio__inner {
|
||||
border-color: #40ffff !important;
|
||||
background: #40ffff !important;
|
||||
}
|
||||
.is-disabled .is-checked .el-radio__inner {
|
||||
border-color: #7a8e8e !important;
|
||||
background: #5a6363 !important;
|
||||
}
|
||||
.el-radio__input.is-checked + .el-radio__label {
|
||||
color: #40ffff !important;
|
||||
}
|
||||
.is-disabled .el-radio__input.is-checked + .el-radio__label {
|
||||
color: #b2bece !important;
|
||||
}
|
||||
.filter {
|
||||
display: flex;
|
||||
background-size: 28px;
|
||||
padding-left: 40px;
|
||||
border-bottom: 1px solid #2c667e;
|
||||
/*no*/
|
||||
padding-bottom: 10px;
|
||||
}
|
||||
.filter > div {
|
||||
margin-right: 40px;
|
||||
line-height: 36px;
|
||||
font-size: 15px;
|
||||
}
|
||||
.menu-select-title {
|
||||
height: 38px;
|
||||
background-size: 46px 46px;
|
||||
margin-bottom: 0.09375rem;
|
||||
line-height: 46px;
|
||||
padding-left: 13px;
|
||||
}
|
||||
.menu-select-title span {
|
||||
margin-left: 24px;
|
||||
border-bottom: 1px solid #2b6c09;
|
||||
/*no*/
|
||||
border-image: linear-gradient(to right, #00deff, #023c3e) 1 10 1;
|
||||
border-image: -webkit-linear-gradient(to right, #00deff, #023c3e) 30 30;
|
||||
border-image: -moz-linear-gradient(to right, #00deff, #023c3e) 30 30;
|
||||
display: inline-block;
|
||||
padding: 0 29px 0px 10px;
|
||||
line-height: 26px;
|
||||
color: #00d6ff;
|
||||
}
|
||||
.el-tooltip__popper.is-dark {
|
||||
background: #2b3853d4;
|
||||
}
|
||||
.home-title {
|
||||
background-size: 150px 35px;
|
||||
height: 25px;
|
||||
width: 100%;
|
||||
color: #40ffff;
|
||||
padding-left: 14px;
|
||||
line-height: 25px;
|
||||
background-position: -14px -4px;
|
||||
}
|
||||
.home-block {
|
||||
position: relative;
|
||||
}
|
||||
.home-block > div:nth-child(1) {
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
.opacity1 {
|
||||
animation: move_down 1s ease-in;
|
||||
animation-fill-mode: forwards;
|
||||
}
|
||||
.opacity0 {
|
||||
animation: move_top 1s ease-out;
|
||||
animation-fill-mode: forwards;
|
||||
}
|
||||
@-webkit-keyframes move_top {
|
||||
0% {
|
||||
top: 0px;
|
||||
}
|
||||
100% {
|
||||
top: -50px;
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@keyframes move_top {
|
||||
0% {
|
||||
top: 0px;
|
||||
}
|
||||
100% {
|
||||
top: -50px;
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
@-webkit-keyframes move_down {
|
||||
0% {
|
||||
top: -60px;
|
||||
opacity: 0;
|
||||
}
|
||||
100% {
|
||||
top: 0px;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
@keyframes move_down {
|
||||
0% {
|
||||
top: -60px;
|
||||
opacity: 0;
|
||||
}
|
||||
100% {
|
||||
top: 0px;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
.el-input__inner,
|
||||
.el-checkbox__inner::after {
|
||||
border-width: 1px !important;
|
||||
/*no*/
|
||||
}
|
||||
.empty-text2 {
|
||||
color: #e6e6e6;
|
||||
margin-top: 17%;
|
||||
margin-left: 27%;
|
||||
}
|
||||
.empty-text2::before {
|
||||
content: "";
|
||||
display: block;
|
||||
background-size: 100% 100%;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
text-align: center;
|
||||
}
|
||||
.empty-text2::after {
|
||||
content: "暂无数据";
|
||||
}
|
||||
.rect-border {
|
||||
background: rgba(18, 24, 26, 0.98);
|
||||
border: 1px solid #075252;
|
||||
padding: 15px;
|
||||
position: relative;
|
||||
display: block;
|
||||
}
|
||||
.rect-border .rect-border-title {
|
||||
width: 200px;
|
||||
height: 40px;
|
||||
background-size: cover;
|
||||
line-height: 40px;
|
||||
padding-left: 38px;
|
||||
margin-bottom: 5px;
|
||||
color: #00ffd5;
|
||||
text-align: left;
|
||||
}
|
||||
.rect-border .rect-border-title .icon {
|
||||
color: #fffc00;
|
||||
font-size: 16px;
|
||||
padding-right: 5px;
|
||||
}
|
||||
.rect-border .close-icon {
|
||||
float: right;
|
||||
color: #00ffd5;
|
||||
cursor: pointer;
|
||||
}
|
||||
.rect-border::before,
|
||||
.rect-border::after,
|
||||
.rect-border .border-foot::before,
|
||||
.rect-border .border-foot::after {
|
||||
content: "";
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
width: 5px;
|
||||
height: 5px;
|
||||
border: 1px solid #05e2e2;
|
||||
box-shadow: 0px 0px 8px #11fec7;
|
||||
background: rgba(18, 24, 26, 0.98);
|
||||
}
|
||||
.rect-border::before {
|
||||
left: -3px;
|
||||
top: -2px;
|
||||
}
|
||||
.rect-border::after {
|
||||
right: -3px;
|
||||
top: -2px;
|
||||
}
|
||||
.rect-border .border-foot::before {
|
||||
left: -3px;
|
||||
bottom: -2px;
|
||||
}
|
||||
.rect-border .border-foot::after {
|
||||
right: -3px;
|
||||
bottom: -2px;
|
||||
}
|
||||
943
src/views/center/css/commonStyle.less
Normal file
943
src/views/center/css/commonStyle.less
Normal file
@@ -0,0 +1,943 @@
|
||||
//该文件为全局样式定义，方便统一系统风格
|
||||
|
||||
@import '../css/themeMixin.less';
|
||||
@tableFontColor: #322550;
|
||||
#app{
|
||||
font-family: 'Microsoft YaHei','Avenir', Helvetica, Arial, sans-serif;
|
||||
}
|
||||
|
||||
//菜单内容标题样式
|
||||
.el-main>div:nth-child(1)>div:nth-child(1) {
|
||||
text-align: center;
|
||||
margin-bottom: 48px;
|
||||
font-weight: bold;
|
||||
font-size: 18px;
|
||||
}
|
||||
|
||||
//表头样式
|
||||
body .el-table th.gutter{
|
||||
display: table-cell!important;
|
||||
}
|
||||
.el-table th,
|
||||
.el-table {
|
||||
background-color: #153741 !important;
|
||||
color: #35b1b7;
|
||||
}
|
||||
|
||||
.el-table th {
|
||||
padding: 4px 0 !important
|
||||
}
|
||||
|
||||
.el-table__expand-icon {
|
||||
color: #fff !important
|
||||
}
|
||||
|
||||
.el-table-column--selection>div {
|
||||
text-align: left !important;
|
||||
}
|
||||
|
||||
.el-table--border,
|
||||
.el-table--group {
|
||||
border: 1px solid #446575;
|
||||
/*no*/
|
||||
}
|
||||
|
||||
.el-table tbody td .cell {
|
||||
margin-right: 12px;
|
||||
}
|
||||
|
||||
.el-table--border::after,
|
||||
.el-table--group::after,
|
||||
.el-table::before {
|
||||
background-color: #ebeef500;
|
||||
}
|
||||
|
||||
.el-table th div {
|
||||
text-align: center;
|
||||
}
|
||||
|
||||
.el-table__empty-text,
|
||||
.el-table td {
|
||||
color: #e2e6ec;
|
||||
}
|
||||
|
||||
.el-table td,
|
||||
.el-table th.is-leaf {
|
||||
// border-bottom: none;
|
||||
border-right: 1px solid #446575;
|
||||
/*no*/
|
||||
border-bottom: 1px solid #446575;
|
||||
/*no*/
|
||||
}
|
||||
|
||||
.el-table__row>td {
|
||||
border: none;
|
||||
border-right: 1px solid #446575;
|
||||
/*no*/
|
||||
border-bottom: 1px solid #446575;
|
||||
/*no*/
|
||||
}
|
||||
|
||||
.el-table::before {
|
||||
height: 0px;
|
||||
color: #446575;
|
||||
}
|
||||
|
||||
.el-table,
|
||||
.el-table__expanded-cell {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
el-table th,
|
||||
.el-table tr,
|
||||
.el-table td {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
.el-table td {
|
||||
padding: 5px 0px !important
|
||||
}
|
||||
|
||||
.el-table tbody tr:hover>td {
|
||||
background-color: #367f7f78 !important
|
||||
}
|
||||
|
||||
.el-table__row--striped td {
|
||||
background-color: #45797b33 !important
|
||||
}
|
||||
|
||||
.el-table__row:not(.el-table__row--striped) {
|
||||
background: #1439391c !important;
|
||||
}
|
||||
|
||||
.el-table {
|
||||
.el-button {
|
||||
margin-top: 5px;
|
||||
margin-bottom: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.el-table .ascending .sort-caret.ascending {
|
||||
border-bottom-color: #34d2d2 !important;
|
||||
}
|
||||
|
||||
.el-table .descending .sort-caret.descending {
|
||||
border-top-color: #34d2d2 !important;
|
||||
}
|
||||
|
||||
//二级表格
|
||||
.el-table {
|
||||
.el-table tr th::before {
|
||||
display: none;
|
||||
}
|
||||
|
||||
.el-table {
|
||||
margin: 20px 20px 20px 46px;
|
||||
width: 95%;
|
||||
|
||||
th {
|
||||
background-color: #1a3968 !important;
|
||||
color: #a3a8e6 !important;
|
||||
}
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
//input框disabled样式
|
||||
|
||||
|
||||
.el-input.is-disabled .el-input__inner,
|
||||
.el-range-editor.is-disabled,
|
||||
.el-range-editor.is-disabled input,
|
||||
.is-disabled .el-textarea__inner {
|
||||
color: #c8d4e4 !important;
|
||||
background-color: #354460 !important;
|
||||
border: none;
|
||||
}
|
||||
|
||||
.is-disabled .el-range__icon {
|
||||
color: #abb8ca;
|
||||
}
|
||||
|
||||
//弹窗样式
|
||||
.el-dialog {
|
||||
background-color: rgba(12, 24, 49, 0.9) !important;
|
||||
margin-top: 14vh;
|
||||
margin: 14vh auto 0px !important;
|
||||
|
||||
.el-dialog__header {
|
||||
border-bottom: 1px solid #40ffff59;
|
||||
/*no*/
|
||||
;
|
||||
|
||||
.el-dialog__title {
|
||||
color: #d4e0f0;
|
||||
font-weight: bold;
|
||||
}
|
||||
}
|
||||
|
||||
.el-dialog__body {
|
||||
padding: 40px;
|
||||
|
||||
label {
|
||||
color: #9acaf7;
|
||||
}
|
||||
}
|
||||
|
||||
.el-tree__empty-text {
|
||||
color: #9acaf7;
|
||||
}
|
||||
|
||||
.button-group {
|
||||
text-align: right;
|
||||
margin-top: 36px;
|
||||
}
|
||||
|
||||
.el-table th {
|
||||
background-color: #111d40;
|
||||
color: #7788b9;
|
||||
padding: 0px 0px !important;
|
||||
}
|
||||
|
||||
.el-table__empty-text {
|
||||
color: #7788b9;
|
||||
}
|
||||
|
||||
.el-tree {
|
||||
border: 1px solid #9acaf7;
|
||||
/*no*/
|
||||
border-radius: 7px;
|
||||
}
|
||||
|
||||
.el-dialog__wrapper {
|
||||
max-height: 98vh;
|
||||
}
|
||||
}
|
||||
|
||||
.el-message-box {
|
||||
background-color: rgba(10, 18, 25, 0.9) !important;
|
||||
border: none;
|
||||
|
||||
.el-message-box__title,
|
||||
.el-message-box__message {
|
||||
color: #b2bece !important;
|
||||
}
|
||||
}
|
||||
|
||||
//穿梭框
|
||||
.el-transfer-panel {
|
||||
background: #111d25 !important;
|
||||
}
|
||||
|
||||
.el-transfer-panel .el-transfer-panel__header {
|
||||
background: #21405d !important;
|
||||
}
|
||||
|
||||
.el-transfer-panel .el-transfer-panel__header .el-checkbox .el-checkbox__label,
|
||||
.el-transfer-panel .el-transfer-panel__header .el-checkbox .el-checkbox__label span {
|
||||
color: #a1d8f9 !important;
|
||||
}
|
||||
|
||||
.el-transfer-panel__item {
|
||||
display: block !important;
|
||||
}
|
||||
|
||||
//button样式
|
||||
.el-button--primary {
|
||||
background-color: #2b9999 !important;
|
||||
border: none !important;
|
||||
color: #FFF !important;
|
||||
|
||||
&:hover,
|
||||
&:focus {
|
||||
background-color: #38cece !important
|
||||
}
|
||||
}
|
||||
|
||||
.el-button--danger {
|
||||
background-color: #9e1e01 !important;
|
||||
border: none;
|
||||
}
|
||||
|
||||
.el-button--warning.is-disabled,
|
||||
.el-button--primary.is-disabled,
|
||||
.el-button--danger.is-disabled,
|
||||
.el-button--danger.is-disabled:active,
|
||||
.el-button--danger.is-disabled:focus,
|
||||
.el-button--danger.is-disabled:hover,
|
||||
.el-button--warning.is-disabled:active,
|
||||
.el-button--warning.is-disabled:focus,
|
||||
.el-button--warning.is-disabled:hover,
|
||||
.el-button--primary.is-disabled:active,
|
||||
.el-button--primary.is-disabled:focus,
|
||||
.el-button--primary.is-disabled:hover {
|
||||
background-color: #929292 !important;
|
||||
border: none;
|
||||
}
|
||||
|
||||
.el-button--warning {
|
||||
background-color: #b4843c !important;
|
||||
border: none;
|
||||
|
||||
&:hover {
|
||||
background-color: #e4a84f !important;
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
|
||||
// .el-button:focus,
|
||||
// .el-button:hover {
|
||||
// background-color: #44bf9d !important;
|
||||
// }
|
||||
|
||||
//滚动条的宽度
|
||||
::-webkit-scrollbar {
|
||||
width: 8px;
|
||||
}
|
||||
|
||||
// 滚动条的滑块
|
||||
::-webkit-scrollbar-thumb {
|
||||
background-color: #617d96;
|
||||
border-radius: 3px;
|
||||
height: 5px !important;
|
||||
}
|
||||
|
||||
/* IE 浏览器 */
|
||||
.scrollbar {
|
||||
/*三角箭头的颜色*/
|
||||
scrollbar-arrow-color: #fff;
|
||||
/*滚动条滑块按钮的颜色*/
|
||||
scrollbar-face-color: #0099dd;
|
||||
/*滚动条整体颜色*/
|
||||
scrollbar-highlight-color: #0099dd;
|
||||
/*滚动条阴影*/
|
||||
scrollbar-shadow-color: #0099dd;
|
||||
/*滚动条轨道颜色*/
|
||||
scrollbar-track-color: #0066ff;
|
||||
/*滚动条3d亮色阴影边框的外观颜色——左边和上边的阴影色*/
|
||||
scrollbar-3dlight-color: #0099dd;
|
||||
/*滚动条3d暗色阴影边框的外观颜色——右边和下边的阴影色*/
|
||||
scrollbar-darkshadow-color: #0099dd;
|
||||
/*滚动条基准颜色*/
|
||||
scrollbar-base-color: #0099dd;
|
||||
}
|
||||
|
||||
|
||||
//分页样式
|
||||
.el-pagination {
|
||||
margin-top: 10px;
|
||||
text-align: right;
|
||||
|
||||
.el-input {
|
||||
width: 60% !important;
|
||||
|
||||
.el-input__inner {
|
||||
color: #b2bece !important;
|
||||
background-color: #ffffff00 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.el-pagination__total,
|
||||
.el-select .el-input .el-select__caret,
|
||||
.btn-prev,
|
||||
.btn-next {
|
||||
color: #b2bece !important;
|
||||
}
|
||||
|
||||
.el-dialog,
|
||||
.el-pager li,
|
||||
button:disabled,
|
||||
.btn-prev,
|
||||
.btn-next {
|
||||
background-color: transparent !important;
|
||||
}
|
||||
|
||||
.el-pager li {
|
||||
color: #b2bece !important;
|
||||
}
|
||||
|
||||
.el-pager .active {
|
||||
color: #09e8e8 !important;
|
||||
}
|
||||
}
|
||||
|
||||
//页面loading样式
|
||||
.el-loading-mask {
|
||||
background-color: rgba(13, 26, 40, 0.8) !important;
|
||||
}
|
||||
|
||||
//折现图和表格切换
|
||||
.select-view {
|
||||
margin-top: 16px;
|
||||
|
||||
.echart-icon {
|
||||
// background: url("../../page/pageAssets/images/echart_grey.png") no-repeat;
|
||||
|
||||
&:hover {
|
||||
.echart-icon-active;
|
||||
.change-icon;
|
||||
}
|
||||
}
|
||||
|
||||
.echart-icon-active {
|
||||
// background: url("../../page/pageAssets/images/echart_active.png") no-repeat;
|
||||
border: 1px solid #19f602 !important;
|
||||
/*no*/
|
||||
}
|
||||
|
||||
.table-icon {
|
||||
//background: url("../../page/pageAssets/images/table_grey.png") no-repeat;
|
||||
|
||||
&:hover {
|
||||
.table-icon-active;
|
||||
.change-icon;
|
||||
}
|
||||
}
|
||||
|
||||
.table-icon-active {
|
||||
// background: url("../../page/pageAssets/images/table_active.png") no-repeat;
|
||||
border: 1px solid #19f602 !important;
|
||||
/*no*/
|
||||
}
|
||||
|
||||
.change-icon {
|
||||
width: 27px;
|
||||
height: 27px;
|
||||
border: 1px solid #8a8a8a;
|
||||
/*no*/
|
||||
vertical-align: middle;
|
||||
background-position: 4px 4px;
|
||||
background-size: 60%;
|
||||
margin-right: 0px;
|
||||
cursor: pointer;
|
||||
display: inline-block;
|
||||
margin-left: -5px;
|
||||
}
|
||||
}
|
||||
|
||||
//块状内容模块
|
||||
.block {
|
||||
position: relative;
|
||||
border: 1px solid #2c667e;
|
||||
/*no*/
|
||||
|
||||
// border-image: linear-gradient(#7e74dd, #2e6125) 1 10 1;
|
||||
padding: 15px 10px 10px;
|
||||
border-radius: 5px;
|
||||
position: relative;
|
||||
height: 100%;
|
||||
|
||||
.block-title {
|
||||
position: absolute;
|
||||
background-color: #153a38d9;
|
||||
padding: 5px 10px;
|
||||
color: #c1ffe9;
|
||||
top: -14px;
|
||||
border-radius: 5px;
|
||||
}
|
||||
|
||||
.empty-text {
|
||||
position: absolute;
|
||||
top: 40%;
|
||||
left: 50%;
|
||||
color: #909399;
|
||||
}
|
||||
}
|
||||
|
||||
//el-input样式
|
||||
.el-input__inner {
|
||||
background-color: transparent !important;
|
||||
color: #b2bece;
|
||||
}
|
||||
|
||||
.el-textarea__inner {
|
||||
color: #b2bece !important;
|
||||
}
|
||||
|
||||
|
||||
.el-select .el-input.is-focus .el-input__inner,
|
||||
.el-input.is-focus,
|
||||
.el-input__inner:focus-within {
|
||||
border-color: #40ffff !important;
|
||||
}
|
||||
|
||||
.el-form-item.is-error .el-input__inner,
|
||||
.el-form-item.is-error .el-input__inner:focus,
|
||||
.el-form-item.is-error .el-textarea__inner,
|
||||
.el-form-item.is-error .el-textarea__inner:focus,
|
||||
.el-message-box__input input.invalid,
|
||||
.el-message-box__input input.invalid:focus {
|
||||
border-color: #F56C6C !important;
|
||||
}
|
||||
|
||||
.el-select-dropdown.is-multiple .el-select-dropdown__item.selected {
|
||||
background-color: #1d2a46 !important;
|
||||
}
|
||||
|
||||
.el-select-dropdown,
|
||||
.el-picker-panel,
|
||||
.el-dropdown-menu {
|
||||
background-color: #1d2a46 !important;
|
||||
border: 1px solid #40ffff;
|
||||
/*no*/
|
||||
}
|
||||
|
||||
.el-tag.el-tag--info {
|
||||
background-color: #2b9999 !important;
|
||||
border-color: #06f3d2 !important;
|
||||
color: #ffffff !important;
|
||||
}
|
||||
|
||||
.el-select-dropdown__item,
|
||||
.el-dropdown-menu__item {
|
||||
color: #b2bece !important;
|
||||
}
|
||||
|
||||
.el-select-dropdown__item.hover,
|
||||
.el-tree-node__content:hover,
|
||||
.el-dropdown-menu__item:hover {
|
||||
background-color: #145e5e !important;
|
||||
}
|
||||
|
||||
.el-tree-node__content {
|
||||
background: transparent !important;
|
||||
}
|
||||
|
||||
|
||||
.is-current>.el-tree-node__content,
|
||||
.is-current>.el-tree-node__content:focus {
|
||||
background-color: #247676 !important;
|
||||
}
|
||||
|
||||
.el-checkbox__input.is-disabled.is-checked .el-checkbox__inner {
|
||||
background-color: #2f3235;
|
||||
}
|
||||
|
||||
.el-checkbox__input.is-checked .el-checkbox__inner,
|
||||
.el-checkbox__input.is-indeterminate .el-checkbox__inner {
|
||||
background-color: #0dcac1;
|
||||
border-color: #dfefed;
|
||||
}
|
||||
|
||||
.el-checkbox__input.is-checked+.el-checkbox__label {
|
||||
color: #0be9ff
|
||||
}
|
||||
|
||||
|
||||
//input框placeholder颜色
|
||||
input::-webkit-input-placeholder {
|
||||
color: #787b80 !important;
|
||||
}
|
||||
|
||||
input::-moz-input-placeholder {
|
||||
color: #787b80 !important;
|
||||
}
|
||||
|
||||
input::-ms-input-placeholder {
|
||||
color: #787b80 !important;
|
||||
}
|
||||
|
||||
//日期选择器
|
||||
.el-time-spinner__item {
|
||||
height: auto !important
|
||||
}
|
||||
|
||||
.el-picker-panel {
|
||||
color: #afb9b9 !important;
|
||||
}
|
||||
|
||||
.time-select-item.selected:not(.disabled) {
|
||||
color: #32fbf2 !important;
|
||||
}
|
||||
|
||||
.time-select-item:hover {
|
||||
background-color: #12504d !important;
|
||||
}
|
||||
|
||||
.el-date-table td.today span {
|
||||
color: #00fff3 !important;
|
||||
}
|
||||
|
||||
.el-date-table td.disabled div {
|
||||
background-color: #1d2a46;
|
||||
color: #616263;
|
||||
|
||||
span {
|
||||
color: #616263 !important;
|
||||
}
|
||||
}
|
||||
|
||||
.el-time-range-picker__header {
|
||||
color: #e4e4e4 !important;
|
||||
}
|
||||
|
||||
.el-time-spinner__item.disabled {
|
||||
color: #575e6d !important;
|
||||
}
|
||||
|
||||
.el-picker-panel__body-wrapper span,
|
||||
.el-picker-panel__body-wrapper a {
|
||||
color: #b2bece !important
|
||||
}
|
||||
|
||||
.el-range-editor.is-active,
|
||||
.el-range-editor.is-active:hover {
|
||||
border-color: #40ffff;
|
||||
}
|
||||
|
||||
.el-range-input {
|
||||
background: transparent;
|
||||
color: #b2bece !important;
|
||||
}
|
||||
|
||||
.el-date-editor .el-range-separator,
|
||||
.el-date-range-picker__header div {
|
||||
color: #b2bece;
|
||||
}
|
||||
|
||||
.el-picker-panel__footer {
|
||||
background: transparent;
|
||||
|
||||
.el-button--text {
|
||||
color: #40ffff;
|
||||
}
|
||||
|
||||
.el-button--default {
|
||||
background: #2b9494;
|
||||
border: none;
|
||||
|
||||
span {
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
|
||||
.el-button.is-plain:focus,
|
||||
.el-button.is-plain:hover {
|
||||
background: #1a5c5c !important;
|
||||
border: none;
|
||||
}
|
||||
}
|
||||
|
||||
.el-select-dropdown__item.selected,
|
||||
.el-month-table td .cell:hover,
|
||||
.current a {
|
||||
color: #40ffff !important;
|
||||
}
|
||||
|
||||
.el-date-picker__header {
|
||||
padding-bottom: 2px;
|
||||
margin: 3px !important;
|
||||
border-bottom: solid 1px #40ffff;
|
||||
/*no*/
|
||||
}
|
||||
|
||||
.el-picker-panel__content th {
|
||||
color: #b2bece !important
|
||||
}
|
||||
|
||||
.el-picker-panel__content {
|
||||
.el-date-table td.in-range div {
|
||||
background-color: #13969647;
|
||||
}
|
||||
|
||||
.el-date-table td.end-date span,
|
||||
.el-date-table td.start-date span,
|
||||
.el-date-table td.current:not(.disabled) span {
|
||||
background-color: #1d881b;
|
||||
}
|
||||
}
|
||||
|
||||
.el-button.is-disabled.is-plain,
|
||||
.el-button.is-disabled.is-plain:focus,
|
||||
.el-button.is-disabled.is-plain:hover {
|
||||
background-color: #616868 !important;
|
||||
}
|
||||
|
||||
.el-time-panel {
|
||||
background-color: #1d2a46;
|
||||
}
|
||||
|
||||
.el-time-panel__btn {
|
||||
color: #40ffff !important;
|
||||
}
|
||||
|
||||
.el-time-spinner__item {
|
||||
color: #b2bece;
|
||||
}
|
||||
|
||||
.el-time-spinner__item:not(.active):hover {
|
||||
background-color: #2b9494 !important;
|
||||
}
|
||||
|
||||
.el-time-spinner__item.active:not(.disabled) {
|
||||
color: #40ffff;
|
||||
}
|
||||
|
||||
.el-picker-panel__icon-btn {
|
||||
color: #40ffff !important;
|
||||
}
|
||||
|
||||
.popper__arrow::after {
|
||||
border-bottom-color: #40ffff !important;
|
||||
}
|
||||
|
||||
.el-tree {
|
||||
background-color: transparent !important;
|
||||
overflow-y: scroll;
|
||||
|
||||
span {
|
||||
color: #b2bece !important
|
||||
}
|
||||
}
|
||||
|
||||
.el-textarea__inner {
|
||||
background: transparent;
|
||||
}
|
||||
|
||||
//el-raidio
|
||||
.el-radio {
|
||||
color: #b2bece !important
|
||||
}
|
||||
|
||||
.is-checked .el-radio__inner {
|
||||
border-color: #40ffff !important;
|
||||
background: #40ffff !important;
|
||||
}
|
||||
|
||||
.is-disabled .is-checked .el-radio__inner {
|
||||
border-color: #7a8e8e !important;
|
||||
background: #5a6363 !important;
|
||||
}
|
||||
|
||||
.el-radio__input.is-checked+.el-radio__label {
|
||||
color: #40ffff !important;
|
||||
}
|
||||
|
||||
.is-disabled .el-radio__input.is-checked+.el-radio__label {
|
||||
color: #b2bece !important;
|
||||
}
|
||||
|
||||
//过滤片区
|
||||
.filter {
|
||||
display: flex;
|
||||
//background: url("../../page/pageAssets/images/filter.png") no-repeat;
|
||||
background-size: 28px;
|
||||
padding-left: 40px;
|
||||
border-bottom: 1px solid #2c667e;
|
||||
/*no*/
|
||||
// border-image: linear-gradient(to right, #50d8ee, #665a05) 1 10 1;
|
||||
padding-bottom: 10px;
|
||||
|
||||
&>div {
|
||||
margin-right: 40px;
|
||||
line-height: 36px;
|
||||
font-size: 15px;
|
||||
}
|
||||
}
|
||||
|
||||
//树形菜单选择后名称片区
|
||||
.menu-select-title {
|
||||
//background: url("../../page/pageAssets/images/location.png") no-repeat;
|
||||
height: 38px;
|
||||
background-size: 46px 46px;
|
||||
margin-bottom: 0.09375rem;
|
||||
line-height: 46px;
|
||||
padding-left: 13px;
|
||||
|
||||
span {
|
||||
margin-left: 24px;
|
||||
border-bottom: 1px solid #2b6c09;
|
||||
/*no*/
|
||||
border-image: linear-gradient(to right, #00deff, #023c3e) 1 10 1;
|
||||
border-image: -webkit-linear-gradient(to right, #00deff, #023c3e) 30 30;
|
||||
border-image: -moz-linear-gradient(to right, #00deff, #023c3e) 30 30;
|
||||
display: inline-block;
|
||||
padding: 0 29px 0px 10px;
|
||||
line-height: 26px;
|
||||
color: #00d6ff;
|
||||
}
|
||||
}
|
||||
|
||||
//文字提示框
|
||||
.el-tooltip__popper.is-dark {
|
||||
background: #2b3853d4;
|
||||
}
|
||||
|
||||
.home-title {
|
||||
//background: url("../../page/pageAssets/images/home_title.png") no-repeat 0 0;
|
||||
background-size: 150px 35px;
|
||||
height: 25px;
|
||||
width: 100%;
|
||||
color: #40ffff;
|
||||
padding-left: 14px;
|
||||
line-height: 25px;
|
||||
background-position: -14px -4px;
|
||||
}
|
||||
|
||||
.home-block {
|
||||
// background-color: #0521494a;
|
||||
position: relative;
|
||||
|
||||
&>div:nth-child(1) {
|
||||
// background: url("../../page//pageAssets/images/border1.png") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
}
|
||||
}
|
||||
|
||||
//上边栏动画
|
||||
.opacity1 {
|
||||
animation: move_down 1s ease-in;
|
||||
animation-fill-mode: forwards;
|
||||
}
|
||||
|
||||
.opacity0 {
|
||||
animation: move_top 1s ease-out;
|
||||
animation-fill-mode: forwards;
|
||||
}
|
||||
|
||||
@-webkit-keyframes move_top {
|
||||
0% {
|
||||
top: 0px;
|
||||
}
|
||||
|
||||
100% {
|
||||
top: -50px;
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes move_top {
|
||||
0% {
|
||||
top: 0px;
|
||||
}
|
||||
|
||||
100% {
|
||||
top: -50px;
|
||||
opacity: 0;
|
||||
}
|
||||
}
|
||||
|
||||
@-webkit-keyframes move_down {
|
||||
0% {
|
||||
top: -60px;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
top: 0px;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
@keyframes move_down {
|
||||
0% {
|
||||
top: -60px;
|
||||
opacity: 0;
|
||||
}
|
||||
|
||||
100% {
|
||||
top: 0px;
|
||||
opacity: 1;
|
||||
}
|
||||
}
|
||||
|
||||
// 以下为兼容IE配置
|
||||
.el-input__inner,
|
||||
.el-checkbox__inner::after {
|
||||
border-width: 1px !important;
|
||||
/*no*/
|
||||
}
|
||||
|
||||
|
||||
//暂无数据
|
||||
.empty-text2 {
|
||||
color: #e6e6e6;
|
||||
margin-top: 17%;
|
||||
margin-left: 27%;
|
||||
|
||||
&::before {
|
||||
content: "";
|
||||
display: block;
|
||||
//background: url("../images/empty_icon.png") no-repeat;
|
||||
background-size: 100% 100%;
|
||||
width: 40px;
|
||||
height: 40px;
|
||||
text-align: center;
|
||||
}
|
||||
&::after {
|
||||
content: "暂无数据";
|
||||
}
|
||||
}
|
||||
|
||||
//四个角边框样式
|
||||
.rect-border {
|
||||
background: rgba(18, 24, 26, 0.98);
|
||||
// min-width: 402px;
|
||||
// min-height: 251px;
|
||||
border: 1px solid #075252;
|
||||
padding: 15px;
|
||||
position: relative;
|
||||
display: block;
|
||||
|
||||
|
||||
|
||||
|
||||
.rect-border-title {
|
||||
//background: url("../../page/pageAssets/images/box-title.png") no-repeat;
|
||||
width: 200px;
|
||||
height: 40px;
|
||||
background-size: cover;
|
||||
line-height: 40px;
|
||||
padding-left: 38px;
|
||||
margin-bottom: 5px;
|
||||
color: #00ffd5;
|
||||
text-align: left;
|
||||
|
||||
.icon {
|
||||
color: rgb(255 252 0);
|
||||
font-size: 16px;
|
||||
padding-right: 5px;
|
||||
}
|
||||
}
|
||||
|
||||
.close-icon {
|
||||
float: right;
|
||||
color: #00ffd5;
|
||||
cursor: pointer;
|
||||
}
|
||||
|
||||
&::before,
|
||||
&::after,
|
||||
.border-foot::before,
|
||||
.border-foot::after {
|
||||
content: "";
|
||||
display: inline-block;
|
||||
position: absolute;
|
||||
width: 5px;
|
||||
height: 5px;
|
||||
border: 1px solid #05e2e2;
|
||||
box-shadow: 0px 0px 8px #11fec7;
|
||||
background: rgba(18, 24, 26, 0.98);
|
||||
}
|
||||
|
||||
&::before {
|
||||
left: -3px;
|
||||
top: -2px;
|
||||
}
|
||||
|
||||
&::after {
|
||||
right: -3px;
|
||||
top: -2px;
|
||||
}
|
||||
|
||||
.border-foot::before {
|
||||
left: -3px;
|
||||
bottom: -2px;
|
||||
}
|
||||
|
||||
.border-foot::after {
|
||||
right: -3px;
|
||||
bottom: -2px;
|
||||
}
|
||||
}
|
||||
202
src/views/center/css/home.less
Normal file
202
src/views/center/css/home.less
Normal file
@@ -0,0 +1,202 @@
|
||||
/* 定义 */
|
||||
@font-face {
|
||||
font-family: "electricFont";
|
||||
src: url("../fonts/digital-7.woff2") format("woff2"),
|
||||
url("../fonts/digital-7.woff") format("woff"),
|
||||
url("../fonts/digital-7.ttf") format("truetype"),
|
||||
url("../fonts/digital-7.eot") format("embedded-opentype"),
|
||||
// url(".../fonts/digital-7.svg") format("svg");
|
||||
}
|
||||
|
||||
.actSty {
|
||||
width: 25%;
|
||||
height: 25%
|
||||
}
|
||||
|
||||
#header {
|
||||
position: fixed;
|
||||
top: 0px;
|
||||
width: 100%;
|
||||
z-index: 2004;
|
||||
height: 54px;
|
||||
}
|
||||
|
||||
#homePage {
|
||||
// background: url("../../../../static/imges/bg5.png") no-repeat;
|
||||
// background-size: cover;
|
||||
|
||||
&>div:first-child {
|
||||
margin-top: 0px;
|
||||
}
|
||||
|
||||
.play-container-bug {
|
||||
position: fixed;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
z-index: 100;
|
||||
}
|
||||
|
||||
.play-container {
|
||||
position: fixed;
|
||||
background: #14142dcc;
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
top: 0px;
|
||||
left: 0px;
|
||||
z-index: 99;
|
||||
|
||||
.play-content {
|
||||
margin-top: 50px;
|
||||
height: 100%;
|
||||
margin-bottom: 50px;
|
||||
|
||||
.el-carousel--horizontal {
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.el-carousel__container {
|
||||
height: 86% !important;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.home-content {
|
||||
display: flex;
|
||||
height: calc(100% - 65px);
|
||||
|
||||
.menu-left {
|
||||
position: relative;
|
||||
padding-top: 4%;
|
||||
width: 3%;
|
||||
overflow: hidden;
|
||||
|
||||
ul {
|
||||
position: absolute;
|
||||
top: 18%;
|
||||
left: -34px;
|
||||
|
||||
li {
|
||||
list-style: none;
|
||||
color: #fff;
|
||||
margin-top: 3px;
|
||||
position: absolute;
|
||||
cursor: pointer;
|
||||
width: 25px;
|
||||
height: 110px;
|
||||
padding-left: 8px;
|
||||
padding-top: 25px;
|
||||
|
||||
&:hover {
|
||||
color: #13e6e6
|
||||
}
|
||||
}
|
||||
|
||||
span {
|
||||
display: inline-block;
|
||||
width: 10px;
|
||||
font-size: 0.3rem;
|
||||
}
|
||||
|
||||
li:nth-child(1) {
|
||||
// background: url("../images/menu-border1.png") no-repeat;
|
||||
background-size: 100% 91%;
|
||||
top: -46px;
|
||||
height: 70px;
|
||||
background-position-x: -2px;
|
||||
}
|
||||
|
||||
li:nth-child(2) {
|
||||
// background: url("../images/menu-border1.png") no-repeat;
|
||||
top: 42px;
|
||||
background-size: 100% 91%;
|
||||
height: 92px;
|
||||
background-position-x: -2px;
|
||||
display: block;
|
||||
|
||||
span {
|
||||
margin-top: -9px;
|
||||
}
|
||||
}
|
||||
|
||||
li:nth-child(3) {
|
||||
//background: url("../images/menu-border1.png") no-repeat;
|
||||
top: 150px;
|
||||
padding-top: 20px;
|
||||
background-size: 100% 91%;
|
||||
height: 72px;
|
||||
background-position-x: -2px;
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.content-left {
|
||||
width: 25%;
|
||||
height: 100%;
|
||||
|
||||
&>div {
|
||||
width: 100%;
|
||||
margin-top: 10px;
|
||||
}
|
||||
|
||||
}
|
||||
|
||||
.content-center {
|
||||
width: 25%;
|
||||
height: 100%;
|
||||
margin-left: 10%;
|
||||
margin-right: 10%;
|
||||
|
||||
.center-item1 {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.center-item2 {
|
||||
width: 186%;
|
||||
height: 70%;
|
||||
margin-left: -45%;
|
||||
margin-top: 20px;
|
||||
}
|
||||
}
|
||||
|
||||
.content-right {
|
||||
width: 25%;
|
||||
padding: 10px;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.content-top {
|
||||
margin-top: 10px;
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
.map {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
}
|
||||
|
||||
.home-header {
|
||||
position: relative;
|
||||
width: 100%;
|
||||
|
||||
.img-left {
|
||||
width: 30px;
|
||||
height: 30px;
|
||||
margin-top: 11px
|
||||
}
|
||||
}
|
||||
|
||||
.header-text {
|
||||
width: 300px;
|
||||
font-size: 0.5rem;
|
||||
font-weight: bold;
|
||||
color: #43a8bf;
|
||||
position: absolute;
|
||||
top: 14px;
|
||||
left: 38px;
|
||||
}
|
||||
}
|
||||
88
src/views/center/css/themeMixin.less
Normal file
88
src/views/center/css/themeMixin.less
Normal file
@@ -0,0 +1,88 @@
|
||||
//该文件主要做主题颜色管理，方便后期换肤切换
|
||||
@background-color-theme1: #23262b;
|
||||
@background-color-theme2: #23262b;
|
||||
@body-bg-color: #073158;
|
||||
@content-bg-color: #073158;
|
||||
@header-bg-color: rgba(41, 44, 74, 0.5);
|
||||
@aside-bg-color: rgba(11, 95, 95, 0.48);
|
||||
@aside-bg-color1: rgba(28, 43, 95, 0.88);
|
||||
@aside-submenu: rgba(5, 16, 16, 0.48);
|
||||
@font-color: #c3d5ea;
|
||||
|
||||
//主页面整体背景颜色
|
||||
.body-bg-color-mixin() {
|
||||
background-color: @body-bg-color !important;
|
||||
// background-image: radial-gradient(#133750, #291d3b);
|
||||
background-image: radial-gradient(#20676e, #291d3b);
|
||||
// background-image: radial-gradient(#20676e, #0d1619);
|
||||
|
||||
[data-theme="theme1"] & {
|
||||
background-color: @background-color-theme1;
|
||||
}
|
||||
|
||||
[data-theme="theme2"] & {
|
||||
background-color: @background-color-theme2;
|
||||
}
|
||||
}
|
||||
|
||||
//主页面content背景颜色
|
||||
.content-bg-color-mixin() {
|
||||
// background-color: transparent !important;
|
||||
|
||||
[data-theme="theme1"] & {
|
||||
background-color: @background-color-theme1;
|
||||
}
|
||||
|
||||
[data-theme="theme2"] & {
|
||||
background-color: @background-color-theme2;
|
||||
}
|
||||
}
|
||||
|
||||
// 菜单header颜色
|
||||
.header-bg-color-mixin() {
|
||||
background-color: @header-bg-color !important;
|
||||
|
||||
[data-theme="theme1"] & {
|
||||
background-color: @background-color-theme1;
|
||||
}
|
||||
|
||||
[data-theme="theme2"] & {
|
||||
background-color: @background-color-theme2;
|
||||
}
|
||||
}
|
||||
|
||||
//左侧menu菜单整体背景颜色
|
||||
.aside-bg-color-mixin() {
|
||||
background-color: @aside-bg-color !important;
|
||||
|
||||
[data-theme="theme1"] & {
|
||||
background-color: @background-color-theme1;
|
||||
}
|
||||
|
||||
[data-theme="theme2"] & {
|
||||
background-color: @background-color-theme2;
|
||||
}
|
||||
}
|
||||
|
||||
//左侧menu一级菜单整体背景颜色
|
||||
.aside-level1-bg-color-mixin() {
|
||||
background-color: @aside-bg-color1 !important;
|
||||
|
||||
[data-theme="theme1"] & {
|
||||
background-color: @background-color-theme1;
|
||||
}
|
||||
|
||||
[data-theme="theme2"] & {
|
||||
background-color: @background-color-theme2;
|
||||
}
|
||||
}
|
||||
|
||||
//左侧菜单submenutitle颜色
|
||||
.aside-submenu-title {
|
||||
background-color: @aside-submenu !important;
|
||||
}
|
||||
|
||||
//菜单字体颜色
|
||||
.font-color-mixin() {
|
||||
color: @font-color !important;
|
||||
}
|
||||
12
src/views/center/fonts/digital-7.css
Normal file
12
src/views/center/fonts/digital-7.css
Normal file
@@ -0,0 +1,12 @@
|
||||
@charset "UTF-8";
|
||||
|
||||
@font-face {
|
||||
font-family: "digital-7";
|
||||
src: url("../fonts/digital-7.woff2") format("woff2"),
|
||||
url("../fonts/digital-7.woff") format("woff"),
|
||||
url("../fonts/digital-7.ttf") format("truetype"),
|
||||
url("../fonts/digital-7.eot") format("embedded-opentype"),
|
||||
url("../fonts/digital-7.svg") format("svg");
|
||||
font-weight: normal;
|
||||
font-style: normal;
|
||||
}
|
||||
BIN
src/views/center/fonts/digital-7.eot
Normal file
BIN
src/views/center/fonts/digital-7.eot
Normal file
Binary file not shown.
263
src/views/center/fonts/digital-7.svg
Normal file
263
src/views/center/fonts/digital-7.svg
Normal file
@@ -0,0 +1,263 @@
|
||||
<?xml version="1.0" standalone="no"?>
|
||||
<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd" >
|
||||
<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1">
|
||||
<metadata>
|
||||
Created by FontForge 20170924 at Wed Mar 23 16:17:49 2011
|
||||
By www-data
|
||||
Created by Sizenko Alexander. (c) 2008 Style-7. All rights reserved. http://www.styleseven.com
|
||||
</metadata>
|
||||
<defs>
|
||||
<font id="Digital-7" horiz-adv-x="520" >
|
||||
<font-face
|
||||
font-family="Digital-7"
|
||||
font-weight="400"
|
||||
font-stretch="normal"
|
||||
units-per-em="1100"
|
||||
panose-1="2 0 0 0 0 0 0 0 0 0"
|
||||
ascent="880"
|
||||
descent="-220"
|
||||
x-height="710"
|
||||
cap-height="720"
|
||||
bbox="50 -120 550 840"
|
||||
underline-thickness="70"
|
||||
underline-position="-225"
|
||||
unicode-range="U+0020-2030"
|
||||
/>
|
||||
<missing-glyph horiz-adv-x="580"
|
||||
d="M460 0h-360q-40 10 -50 50l80 30h300zM430 640h-299l-80 30q10 40 50 50h359zM130 100l-80 -30v580l80 -30v-520zM530 50q-10 -40 -50 -50l-30 80v560l30 80q40 -10 50 -50v-620z" />
|
||||
<glyph glyph-name=".notdef" horiz-adv-x="580"
|
||||
d="M460 0h-360q-40 10 -50 50l80 30h300zM430 640h-299l-80 30q10 40 50 50h359zM130 100l-80 -30v580l80 -30v-520zM530 50q-10 -40 -50 -50l-30 80v560l30 80q40 -10 50 -50v-620z" />
|
||||
<glyph glyph-name=".null" horiz-adv-x="0"
|
||||
/>
|
||||
<glyph glyph-name="nonmarkingreturn" horiz-adv-x="500"
|
||||
/>
|
||||
<glyph glyph-name="space" unicode=" " horiz-adv-x="300"
|
||||
/>
|
||||
<glyph glyph-name="exclam" unicode="!" horiz-adv-x="180"
|
||||
d="M110 350l20 -20v-170h-80v130zM50 430v210l30 80q40 -10 50 -50v-280l-20 -20zM130 0h-80v80h80v-80z" />
|
||||
<glyph glyph-name="quotedbl" unicode=""" horiz-adv-x="341"
|
||||
d="M130 560l-40 -40l-40 40v160h80v-160zM291 561l-40 -40l-40 40v160h80v-160z" />
|
||||
<glyph glyph-name="numbersign" unicode="#" horiz-adv-x="540"
|
||||
d="M290 480l40 -40l-40 -40h-40l-40 40l40 40h40zM290 320l40 -40l-40 -40h-40l-40 40l40 40h40zM150 380l40 40l40 -40v-40l-40 -40l-40 40v40zM310 380l40 40l40 -40v-40l-40 -40l-40 40v40zM150 560l40 40l40 -40v-60l-40 -40l-40 40v60zM310 560l40 40l40 -40v-60
|
||||
l-40 -40l-40 40v60zM310 221l40 40l40 -40v-61l-40 -40l-40 40v61zM150 220l40 40l40 -40v-61l-40 -40l-40 40v61zM130 320l40 -40l-40 -40h-40l-40 40l40 40h40zM450 319l40 -40l-40 -40h-40l-40 40l40 40h40zM450 480l40 -40l-40 -40h-40l-40 40l40 40h40zM130 479l40 -40
|
||||
l-40 -40h-40l-40 40l40 40h40z" />
|
||||
<glyph glyph-name="dollar" unicode="$"
|
||||
d="M390 400l40 -40l-40 -40h-260l-40 40l40 40h260zM450 350l20 -20v-280q-10 -40 -50 -50l-30 80v210zM400 0h-300q-40 10 -50 50l80 30h240zM130 620v-190l-60 -60l-20 20v260zM131 640l-80 30q10 40 50 50h319q40 -10 50 -50l-80 -30h-259zM230 750v50l40 40l40 -40v-50
|
||||
h-80zM230 430v180h80v-180h-80zM230 110v180h80v-180h-80zM310 -30v-50l-40 -40l-40 40v50h80z" />
|
||||
<glyph glyph-name="percent" unicode="%" horiz-adv-x="600"
|
||||
d="M311 478l119 242q60 0 80 -40l-154 -310h-45v108zM289 242l-119 -242q-60 0 -80 40l154 310h45v-108zM190 640h-60l-80 30q10 40 50 50h120zM130 620v-60l-30 -80q-40 10 -50 50v120zM150 560h60l80 -30q-10 -40 -50 -50h-120zM210 580v60l30 80q40 -10 50 -50v-120z
|
||||
M470 100v60l30 80q40 -10 50 -50v-120zM450 160h-60l-80 30q10 40 50 50h120zM390 140v-60l-30 -80q-40 10 -50 50v120zM410 80h60l80 -30q-10 -40 -50 -50h-120z" />
|
||||
<glyph glyph-name="ampersand" unicode="&" horiz-adv-x="560"
|
||||
d="M390 400l40 -40l-40 -40h-260l-40 40l40 40h260zM450 350l20 -20v-230h-50l-30 30v160zM490 0h-390q-40 10 -50 50l80 30h320l60 -60zM50 70v260l20 20l60 -60v-190zM330 600h-160l-80 30q10 40 50 50h220zM170 580v-110l-60 -60l-20 20v180zM350 470v130l30 80
|
||||
q40 -10 50 -50v-200l-20 -20zM470 -20v-50l-20 -20l-60 60v10h80z" />
|
||||
<glyph glyph-name="quotesingle" unicode="'" horiz-adv-x="180"
|
||||
d="M130 560l-40 -40l-40 40v160h80v-160z" />
|
||||
<glyph glyph-name="parenleft" unicode="(" horiz-adv-x="350"
|
||||
d="M260 640h-110l-40 40l40 40h110l40 -40zM70 370l-20 20v230l50 50l30 -30v-210zM300 40l-40 -40h-110l-40 40l40 40h110zM130 290v-210l-30 -30l-50 50v230l20 20z" />
|
||||
<glyph glyph-name="parenright" unicode=")" horiz-adv-x="350"
|
||||
d="M90 80h110l40 -40l-40 -40h-110l-40 40zM280 350l20 -20v-230l-50 -50l-30 30v210zM50 680l40 40h110l40 -40l-40 -40h-110zM220 430v210l30 30l50 -50v-230l-20 -20z" />
|
||||
<glyph glyph-name="asterisk" unicode="*" horiz-adv-x="430"
|
||||
d="M175 430v80l40 40l40 -40v-80l70 40l55 -15l-15 -55l-69 -40l69 -40l15 -55l-55 -15l-70 40v-80l-40 -40l-40 40v80l-70 -40l-55 15l15 55l69 40l-69 40l-15 55l55 15z" />
|
||||
<glyph glyph-name="plus" unicode="+" horiz-adv-x="440"
|
||||
d="M180 400v90l40 40l40 -40v-90h90l40 -40l-40 -40h-90v-90l-40 -40l-40 40v90h-90l-40 40l40 40h90z" />
|
||||
<glyph glyph-name="comma" unicode="," horiz-adv-x="180"
|
||||
d="M130 -80l-40 -40l-40 40v160h80v-160z" />
|
||||
<glyph glyph-name="hyphen" unicode="-" horiz-adv-x="440"
|
||||
d="M350 400l40 -40l-40 -40h-260l-40 40l40 40h260z" />
|
||||
<glyph glyph-name="period" unicode="." horiz-adv-x="180"
|
||||
d="M130 0h-80v80h80v-80z" />
|
||||
<glyph glyph-name="slash" unicode="/"
|
||||
d="M271 478l119 242q60 0 80 -40l-154 -310h-45v108zM249 242l-119 -242q-60 0 -80 40l154 310h45v-108z" />
|
||||
<glyph glyph-name="zero" unicode="0"
|
||||
d="M450 350l20 -20v-280q-10 -40 -50 -50l-30 80v210zM400 0h-300q-40 10 -50 50l80 30h240zM50 70v260l20 20l60 -60v-190zM370 640h-239l-80 30q10 40 50 50h299zM130 620v-190l-60 -60l-20 20v260zM390 430v210l30 80q40 -10 50 -50v-280l-20 -20z" />
|
||||
<glyph glyph-name="one" unicode="1" horiz-adv-x="180"
|
||||
d="M110 350l20 -20v-280q-10 -40 -50 -50l-30 80v210zM50 430v210l30 80q40 -10 50 -50v-280l-20 -20z" />
|
||||
<glyph glyph-name="two" unicode="2"
|
||||
d="M390 400l40 -40l-40 -40h-260l-40 40l40 40h260zM430 0h-330q-40 10 -50 50l80 30h270zM50 70v260l20 20l60 -60v-190zM370 640h-239l-80 30q10 40 50 50h299zM390 430v210l30 80q40 -10 50 -50v-280l-20 -20z" />
|
||||
<glyph glyph-name="three" unicode="3"
|
||||
d="M390 400l40 -40l-40 -40h-260l-40 40l40 40h260zM450 350l20 -20v-280q-10 -40 -50 -50l-30 80v210zM400 0h-300q-40 10 -50 50l80 30h240zM370 640h-239l-80 30q10 40 50 50h299zM390 430v210l30 80q40 -10 50 -50v-280l-20 -20z" />
|
||||
<glyph glyph-name="four" unicode="4"
|
||||
d="M390 400l40 -40l-40 -40h-260l-40 40l40 40h260zM450 350l20 -20v-280q-10 -40 -50 -50l-30 80v210zM130 650v-220l-60 -60l-20 20v290zM390 430v210l30 80q40 -10 50 -50v-280l-20 -20z" />
|
||||
<glyph glyph-name="five" unicode="5"
|
||||
d="M390 400l40 -40l-40 -40h-260l-40 40l40 40h260zM450 350l20 -20v-280q-10 -40 -50 -50l-30 80v210zM400 0h-300q-40 10 -50 50l80 30h240zM400 640h-269l-80 30q10 40 50 50h329zM130 620v-190l-60 -60l-20 20v260z" />
|
||||
<glyph glyph-name="six" unicode="6"
|
||||
d="M390 400l40 -40l-40 -40h-260l-40 40l40 40h260zM450 350l20 -20v-280q-10 -40 -50 -50l-30 80v210zM400 0h-300q-40 10 -50 50l80 30h240zM50 70v260l20 20l60 -60v-190zM400 640h-269l-80 30q10 40 50 50h329zM130 620v-190l-60 -60l-20 20v260z" />
|
||||
<glyph glyph-name="seven" unicode="7"
|
||||
d="M450 350l20 -20v-280q-10 -40 -50 -50l-30 80v210zM370 640h-239l-80 30q10 40 50 50h299zM130 620v-190l-60 -60l-20 20v260zM390 430v210l30 80q40 -10 50 -50v-280l-20 -20z" />
|
||||
<glyph glyph-name="eight" unicode="8"
|
||||
d="M390 400l40 -40l-40 -40h-260l-40 40l40 40h260zM450 350l20 -20v-280q-10 -40 -50 -50l-30 80v210zM400 0h-300q-40 10 -50 50l80 30h240zM50 70v260l20 20l60 -60v-190zM370 640h-239l-80 30q10 40 50 50h299zM130 620v-190l-60 -60l-20 20v260zM390 430v210l30 80
|
||||
q40 -10 50 -50v-280l-20 -20z" />
|
||||
<glyph glyph-name="nine" unicode="9"
|
||||
d="M390 400l40 -40l-40 -40h-260l-40 40l40 40h260zM450 350l20 -20v-280q-10 -40 -50 -50l-30 80v210zM400 0h-300q-40 10 -50 50l80 30h240zM370 640h-239l-80 30q10 40 50 50h299zM130 620v-190l-60 -60l-20 20v260zM390 430v210l30 80q40 -10 50 -50v-280l-20 -20z" />
|
||||
<glyph glyph-name="colon" unicode=":" horiz-adv-x="180"
|
||||
d="M130 160h-80v80h80v-80zM130 480h-80v80h80v-80z" />
|
||||
<glyph glyph-name="semicolon" unicode=";" horiz-adv-x="180"
|
||||
d="M130 480h-80v80h80v-80zM130 -80l-40 -40l-40 40v160h80v-160z" />
|
||||
<glyph glyph-name="less" unicode="<" horiz-adv-x="370"
|
||||
d="M160 370h-110l200 200h40l30 -39zM320 189l-30 -39h-40l-200 200h110z" />
|
||||
<glyph glyph-name="equal" unicode="=" horiz-adv-x="440"
|
||||
d="M350 480l40 -40l-40 -40h-260l-40 40l40 40h260zM350 319l40 -40l-40 -40h-260l-40 40l40 40h260z" />
|
||||
<glyph glyph-name="greater" unicode=">" horiz-adv-x="370"
|
||||
d="M50 531l30 39h40l200 -200h-110zM210 350h110l-200 -200h-40l-30 39z" />
|
||||
<glyph glyph-name="question" unicode="?"
|
||||
d="M390 400l40 -40l-40 -40h-260l-40 40l40 40h260zM50 160v170l20 20l60 -60v-130h-80zM370 640h-239l-80 30q10 40 50 50h299zM390 430v210l30 80q40 -10 50 -50v-280l-20 -20zM130 0h-80v80h80v-80z" />
|
||||
<glyph glyph-name="at" unicode="@"
|
||||
d="M450 350l20 -20v-120q-10 -40 -50 -50l-30 80v50zM400 0h-300q-40 10 -50 50l80 30h240zM50 70v260l20 20l60 -60v-190zM370 640h-239l-80 30q10 40 50 50h299zM130 620v-190l-60 -60l-20 20v260zM390 430v210l30 80q40 -10 50 -50v-280l-20 -20zM400 160l-140 -1
|
||||
q-40 10 -50 50l80 31h80zM210 230v100l20 20l60 -60v-30zM290 460v-30l-60 -60l-20 20v100zM370 480h-80l-80 31q10 40 50 50l110 -1v-80z" />
|
||||
<glyph glyph-name="A" unicode="A"
|
||||
d="M390 400l40 -40l-40 -40h-260l-40 40l40 40h260zM450 350l20 -20v-280q-10 -40 -50 -50l-30 80v210zM370 640h-239l-80 30q10 40 50 50h299zM130 620v-190l-60 -60l-20 20v260zM390 430v210l30 80q40 -10 50 -50v-280l-20 -20zM130 290v-210l-30 -80q-40 10 -50 50v280
|
||||
l20 20z" />
|
||||
<glyph glyph-name="B" unicode="B"
|
||||
d="M390 400l40 -40l-40 -40h-260l-40 40l40 40h260zM50 70v260l20 20l60 -60v-190zM370 640h-240l-80 30v50h320l40 -40zM130 620v-190l-60 -60l-20 20v260zM390 430v210l30 30l50 -50v-230l-20 -20zM450 350l20 -20v-230l-50 -50l-30 30v210zM409 40l-40 -40h-319v50l80 30
|
||||
h239z" />
|
||||
<glyph glyph-name="C" unicode="C" horiz-adv-x="480"
|
||||
d="M430 0h-330q-40 10 -50 50l80 30h270zM50 70v260l20 20l60 -60v-190zM400 640h-269l-80 30q10 40 50 50h329zM130 620v-190l-60 -60l-20 20v260z" />
|
||||
<glyph glyph-name="D" unicode="D"
|
||||
d="M50 70v260l20 20l60 -60v-190zM370 640h-240l-80 30v50h320l40 -40zM130 620v-190l-60 -60l-20 20v260zM390 430v210l30 30l50 -50v-230l-20 -20zM450 350l20 -20v-230l-50 -50l-30 30v210zM409 40l-40 -40h-319v50l80 30h239z" />
|
||||
<glyph glyph-name="E" unicode="E" horiz-adv-x="480"
|
||||
d="M390 400l40 -40l-40 -40h-260l-40 40l40 40h260zM430 0h-330q-40 10 -50 50l80 30h270zM50 70v260l20 20l60 -60v-190zM400 640h-269l-80 30q10 40 50 50h329zM130 620v-190l-60 -60l-20 20v260z" />
|
||||
<glyph glyph-name="F" unicode="F" horiz-adv-x="480"
|
||||
d="M390 400l40 -40l-40 -40h-260l-40 40l40 40h260zM400 640h-269l-80 30q10 40 50 50h329zM130 620v-190l-60 -60l-20 20v260zM130 290v-210l-30 -80q-40 10 -50 50v280l20 20z" />
|
||||
<glyph glyph-name="G" unicode="G"
|
||||
d="M390 400l40 -40l-40 -40h-90l-40 40l40 40h90zM450 350l20 -20v-280q-10 -40 -50 -50l-30 80v210zM400 0h-300q-40 10 -50 50l80 30h240zM50 70v260l20 20l60 -60v-190zM400 640h-269l-80 30q10 40 50 50h329zM130 620v-190l-60 -60l-20 20v260z" />
|
||||
<glyph glyph-name="H" unicode="H"
|
||||
d="M390 400l40 -40l-40 -40h-260l-40 40l40 40h260zM450 350l20 -20v-280q-10 -40 -50 -50l-30 80v210zM390 430v210l30 80q40 -10 50 -50v-280l-20 -20zM130 290v-210l-30 -80q-40 10 -50 50v280l20 20zM70 360l-20 20v280q10 40 50 50l30 -80v-210z" />
|
||||
<glyph glyph-name="I" unicode="I" horiz-adv-x="180"
|
||||
d="M50 430v210l30 80q40 -10 50 -50v-280l-20 -20zM110 360l20 -20v-280q-10 -40 -50 -50l-30 80v210z" />
|
||||
<glyph glyph-name="J" unicode="J"
|
||||
d="M450 350l20 -20v-280q-10 -40 -50 -50l-30 80v210zM400 0h-300q-40 10 -50 50l80 30h240zM50 70v260l20 20l60 -60v-190zM390 430v210l30 80q40 -10 50 -50v-280l-20 -20z" />
|
||||
<glyph glyph-name="K" unicode="K"
|
||||
d="M390 400l40 -40l-40 -40h-260l-40 40l40 40h260zM450 350l20 -20v-280q-10 -40 -50 -50l-30 80v210zM150 480l240 240q60 0 80 -40l-260 -260h-60v60zM130 290v-210l-30 -80q-40 10 -50 50v280l20 20zM70 370l-20 20v280q10 40 50 50l30 -80v-210z" />
|
||||
<glyph glyph-name="L" unicode="L"
|
||||
d="M130 290v-210l-30 -80q-40 10 -50 50v280l20 20zM150 80h240l80 -30q-10 -40 -50 -50h-300zM70 370l-20 20v280q10 40 50 50l30 -80v-210z" />
|
||||
<glyph glyph-name="M" unicode="M"
|
||||
d="M300 390l-40 -40l-40 40v230h80v-230zM450 350l20 -20v-280q-10 -40 -50 -50l-30 80v210zM370 640h-239l-80 30q10 40 50 50h299zM130 620v-190l-60 -60l-20 20v260zM390 430v210l30 80q40 -10 50 -50v-280l-20 -20zM130 290v-210l-30 -80q-40 10 -50 50v280l20 20z" />
|
||||
<glyph glyph-name="N" unicode="N"
|
||||
d="M130 290v-210l-30 -80q-40 10 -50 50v280l20 20zM370 420h-70l-150 150v60h60l160 -160v-50zM450 350l20 -20v-280q-10 -40 -50 -50l-30 80v210zM390 420v210l30 80q40 -10 50 -50v-280l-20 -20zM70 360l-20 20v280q10 40 50 50l30 -80v-210z" />
|
||||
<glyph glyph-name="O" unicode="O"
|
||||
d="M370 640h-220l-40 40l40 40h220l40 -40zM390 430v210l30 30l50 -50v-230l-20 -20zM450 350l20 -20v-230l-50 -50l-30 30v210zM70 370l-20 20v230l50 50l30 -30v-210zM410 40l-40 -40h-220l-40 40l40 40h220zM130 290v-210l-30 -30l-50 50v230l20 20z" />
|
||||
<glyph glyph-name="P" unicode="P"
|
||||
d="M390 400l40 -40l-40 -40h-260l-40 40l40 40h260zM370 640h-240l-80 30v50h320l40 -40zM130 620v-190l-60 -60l-20 20v260zM390 430v210l30 30l50 -50v-230l-20 -20zM130 290v-210l-30 -80q-40 10 -50 50v280l20 20z" />
|
||||
<glyph glyph-name="Q" unicode="Q" horiz-adv-x="530"
|
||||
d="M450 350l20 -20v-240l-80 80v120zM380 0h-280q-40 10 -50 50l80 30h170zM50 70v260l20 20l60 -60v-190zM370 640h-239l-80 30q10 40 50 50h299zM130 620v-190l-60 -60l-20 20v260zM390 430v210l30 80q40 -10 50 -50v-280l-20 -20zM290 180h60l130 -130v-60h-60l-130 130
|
||||
v60z" />
|
||||
<glyph glyph-name="R" unicode="R"
|
||||
d="M390 400l40 -40l-40 -40h-260l-40 40l40 40h260zM150 300h60l260 -260q-20 -40 -80 -40l-240 240v60zM130 290v-210l-30 -80q-40 10 -50 50v280l20 20zM370 640h-239l-80 30q10 40 50 50h299zM390 430v210l30 80q40 -10 50 -50v-280l-20 -20zM130 620v-190l-60 -60
|
||||
l-20 20v260z" />
|
||||
<glyph glyph-name="S" unicode="S"
|
||||
d="M390 400l40 -40l-40 -40h-260l-40 40l40 40h260zM450 350l20 -20v-280q-10 -40 -50 -50l-30 80v210zM400 0h-300q-40 10 -50 50l80 30h240zM130 620v-190l-60 -60l-20 20v260zM131 640l-80 30q10 40 50 50h319q40 -10 50 -50l-80 -30h-259z" />
|
||||
<glyph glyph-name="T" unicode="T" horiz-adv-x="519"
|
||||
d="M259 350l40 -40v-260q-10 -40 -50 -50l-30 80v230zM219 410v210h80v-210l-40 -40zM130 640l-80 30q10 40 50 50h319q40 -10 50 -50l-80 -30h-259z" />
|
||||
<glyph glyph-name="U" unicode="U"
|
||||
d="M450 350l20 -20v-280q-10 -40 -50 -50l-30 80v210zM400 0h-300q-40 10 -50 50l80 30h240zM50 70v260l20 20l60 -60v-190zM390 430v210l30 80q40 -10 50 -50v-280l-20 -20zM70 360l-20 20v280q10 40 50 50l30 -80v-210z" />
|
||||
<glyph glyph-name="V" unicode="V"
|
||||
d="M70 360l-20 20v280q10 40 50 50l30 -80v-210zM390 420v210l30 80q40 -10 50 -50v-280l-20 -20zM250 120v-120l-200 260v60l20 20l60 -60zM390 280l60 60l20 -20v-60l-200 -260v120z" />
|
||||
<glyph glyph-name="W" unicode="W"
|
||||
d="M300 100h-80v230l40 40l40 -40v-230zM390 430v210l30 80q40 -10 50 -50v-280l-20 -20zM400 0h-299q-40 10 -50 50l80 30h239zM50 70v260l20 20l60 -60v-190zM450 350l20 -20v-280q-10 -40 -50 -50l-30 80v210zM70 370l-20 20v280q10 40 50 50l30 -80v-210z" />
|
||||
<glyph glyph-name="X" unicode="X"
|
||||
d="M270 350h45l154 -310q-20 -40 -80 -40l-119 242v108zM271 478l119 242q60 0 80 -40l-154 -310h-45v108zM249 242l-119 -242q-60 0 -80 40l154 310h45v-108zM250 370h-45l-154 310q20 40 80 40l119 -243v-107z" />
|
||||
<glyph glyph-name="Y" unicode="Y"
|
||||
d="M390 400l40 -40l-40 -40h-260l-40 40l40 40h260zM450 350l20 -20v-280q-10 -40 -50 -50l-30 80v210zM400 0h-300q-40 10 -50 50l80 30h240zM130 650v-220l-60 -60l-20 20v290zM390 430v210l30 80q40 -10 50 -50v-280l-20 -20z" />
|
||||
<glyph glyph-name="Z" unicode="Z"
|
||||
d="M430 0h-280l40 80h210zM330 640h-199l-80 30q10 40 50 50h269zM260 430l130 290q60 0 80 -40l-150 -310h-60v60zM270 290l-140 -290q-60 0 -80 40l160 310h60v-60z" />
|
||||
<glyph glyph-name="bracketleft" unicode="[" horiz-adv-x="310"
|
||||
d="M50 70v260l20 20l60 -60v-190zM200 640h-69l-80 30q10 40 50 50h139l20 -20zM130 620v-190l-60 -60l-20 20v260zM260 20l-20 -20h-139q-40 10 -50 50l80 30h69z" />
|
||||
<glyph glyph-name="backslash" unicode="\" horiz-adv-x="518"
|
||||
d="M269 350h45l154 -310q-20 -40 -80 -40l-119 242v108zM249 370h-45l-154 310q20 40 80 40l119 -243v-107z" />
|
||||
<glyph glyph-name="bracketright" unicode="]" horiz-adv-x="310"
|
||||
d="M240 350l20 -20v-280q-10 -40 -50 -50l-30 80v210zM160 640h-50l-60 60l20 20h120zM180 430v210l30 80q40 -10 50 -50v-280l-20 -20zM190 0h-120l-20 20l60 60h50z" />
|
||||
<glyph glyph-name="asciicircum" unicode="^" horiz-adv-x="519"
|
||||
d="M269 610v110l200 -200v-40l-39 -30zM89 450l-39 30v40l200 200l-1 -110z" />
|
||||
<glyph glyph-name="underscore" unicode="_" horiz-adv-x="519"
|
||||
d="M389 80l80 -30q-10 -40 -50 -50h-319q-40 10 -50 50l80 30h259z" />
|
||||
<glyph glyph-name="grave" unicode="`" horiz-adv-x="280"
|
||||
d="M230 610v-40l-40 -10l-140 140l10 40h40z" />
|
||||
<glyph glyph-name="a" unicode="a"
|
||||
d="M390 400l40 -40l-40 -40h-260l-40 40l40 40h260zM450 350l20 -20v-280q-10 -40 -50 -50l-30 80v210zM370 640h-239l-80 30q10 40 50 50h299zM130 620v-190l-60 -60l-20 20v260zM390 430v210l30 80q40 -10 50 -50v-280l-20 -20zM130 290v-210l-30 -80q-40 10 -50 50v280
|
||||
l20 20z" />
|
||||
<glyph glyph-name="b" unicode="b"
|
||||
d="M390 400l40 -40l-40 -40h-260l-40 40l40 40h260zM50 70v260l20 20l60 -60v-190zM370 640h-240l-80 30v50h320l40 -40zM130 620v-190l-60 -60l-20 20v260zM390 430v210l30 30l50 -50v-230l-20 -20zM450 350l20 -20v-230l-50 -50l-30 30v210zM409 40l-40 -40h-319v50l80 30
|
||||
h239z" />
|
||||
<glyph glyph-name="c" unicode="c" horiz-adv-x="480"
|
||||
d="M430 0h-330q-40 10 -50 50l80 30h270zM50 70v260l20 20l60 -60v-190zM400 640h-269l-80 30q10 40 50 50h329zM130 620v-190l-60 -60l-20 20v260z" />
|
||||
<glyph glyph-name="d" unicode="d"
|
||||
d="M50 70v260l20 20l60 -60v-190zM370 640h-240l-80 30v50h320l40 -40zM130 620v-190l-60 -60l-20 20v260zM390 430v210l30 30l50 -50v-230l-20 -20zM450 350l20 -20v-230l-50 -50l-30 30v210zM409 40l-40 -40h-319v50l80 30h239z" />
|
||||
<glyph glyph-name="e" unicode="e" horiz-adv-x="480"
|
||||
d="M390 400l40 -40l-40 -40h-260l-40 40l40 40h260zM430 0h-330q-40 10 -50 50l80 30h270zM50 70v260l20 20l60 -60v-190zM400 640h-269l-80 30q10 40 50 50h329zM130 620v-190l-60 -60l-20 20v260z" />
|
||||
<glyph glyph-name="f" unicode="f" horiz-adv-x="480"
|
||||
d="M390 400l40 -40l-40 -40h-260l-40 40l40 40h260zM400 640h-269l-80 30q10 40 50 50h329zM130 620v-190l-60 -60l-20 20v260zM130 290v-210l-30 -80q-40 10 -50 50v280l20 20z" />
|
||||
<glyph glyph-name="g" unicode="g"
|
||||
d="M390 400l40 -40l-40 -40h-90l-40 40l40 40h90zM450 350l20 -20v-280q-10 -40 -50 -50l-30 80v210zM400 0h-300q-40 10 -50 50l80 30h240zM50 70v260l20 20l60 -60v-190zM400 640h-269l-80 30q10 40 50 50h329zM130 620v-190l-60 -60l-20 20v260z" />
|
||||
<glyph glyph-name="h" unicode="h"
|
||||
d="M390 400l40 -40l-40 -40h-260l-40 40l40 40h260zM450 350l20 -20v-280q-10 -40 -50 -50l-30 80v210zM390 430v210l30 80q40 -10 50 -50v-280l-20 -20zM130 290v-210l-30 -80q-40 10 -50 50v280l20 20zM70 360l-20 20v280q10 40 50 50l30 -80v-210z" />
|
||||
<glyph glyph-name="i" unicode="i" horiz-adv-x="180"
|
||||
d="M50 430v210l30 80q40 -10 50 -50v-280l-20 -20zM110 360l20 -20v-280q-10 -40 -50 -50l-30 80v210z" />
|
||||
<glyph glyph-name="j" unicode="j"
|
||||
d="M450 350l20 -20v-280q-10 -40 -50 -50l-30 80v210zM400 0h-300q-40 10 -50 50l80 30h240zM50 70v260l20 20l60 -60v-190zM390 430v210l30 80q40 -10 50 -50v-280l-20 -20z" />
|
||||
<glyph glyph-name="k" unicode="k"
|
||||
d="M390 400l40 -40l-40 -40h-260l-40 40l40 40h260zM450 350l20 -20v-280q-10 -40 -50 -50l-30 80v210zM150 480l240 240q60 0 80 -40l-260 -260h-60v60zM130 290v-210l-30 -80q-40 10 -50 50v280l20 20zM70 370l-20 20v280q10 40 50 50l30 -80v-210z" />
|
||||
<glyph glyph-name="l" unicode="l"
|
||||
d="M130 290v-210l-30 -80q-40 10 -50 50v280l20 20zM150 80h240l80 -30q-10 -40 -50 -50h-300zM70 370l-20 20v280q10 40 50 50l30 -80v-210z" />
|
||||
<glyph glyph-name="m" unicode="m"
|
||||
d="M300 390l-40 -40l-40 40v230h80v-230zM450 350l20 -20v-280q-10 -40 -50 -50l-30 80v210zM370 640h-239l-80 30q10 40 50 50h299zM130 620v-190l-60 -60l-20 20v260zM390 430v210l30 80q40 -10 50 -50v-280l-20 -20zM130 290v-210l-30 -80q-40 10 -50 50v280l20 20z" />
|
||||
<glyph glyph-name="n" unicode="n"
|
||||
d="M130 290v-210l-30 -80q-40 10 -50 50v280l20 20zM370 420h-70l-150 150v60h60l160 -160v-50zM450 350l20 -20v-280q-10 -40 -50 -50l-30 80v210zM390 420v210l30 80q40 -10 50 -50v-280l-20 -20zM70 360l-20 20v280q10 40 50 50l30 -80v-210z" />
|
||||
<glyph glyph-name="o" unicode="o"
|
||||
d="M370 640h-220l-40 40l40 40h220l40 -40zM390 430v210l30 30l50 -50v-230l-20 -20zM450 350l20 -20v-230l-50 -50l-30 30v210zM70 370l-20 20v230l50 50l30 -30v-210zM410 40l-40 -40h-220l-40 40l40 40h220zM130 290v-210l-30 -30l-50 50v230l20 20z" />
|
||||
<glyph glyph-name="p" unicode="p"
|
||||
d="M390 400l40 -40l-40 -40h-260l-40 40l40 40h260zM370 640h-240l-80 30v50h320l40 -40zM130 620v-190l-60 -60l-20 20v260zM390 430v210l30 30l50 -50v-230l-20 -20zM130 290v-210l-30 -80q-40 10 -50 50v280l20 20z" />
|
||||
<glyph glyph-name="q" unicode="q" horiz-adv-x="530"
|
||||
d="M450 350l20 -20v-240l-80 80v120zM380 0h-280q-40 10 -50 50l80 30h170zM50 70v260l20 20l60 -60v-190zM370 640h-239l-80 30q10 40 50 50h299zM130 620v-190l-60 -60l-20 20v260zM390 430v210l30 80q40 -10 50 -50v-280l-20 -20zM290 180h60l130 -130v-60h-60l-130 130
|
||||
v60z" />
|
||||
<glyph glyph-name="r" unicode="r"
|
||||
d="M390 400l40 -40l-40 -40h-260l-40 40l40 40h260zM150 300h60l260 -260q-20 -40 -80 -40l-240 240v60zM130 290v-210l-30 -80q-40 10 -50 50v280l20 20zM370 640h-239l-80 30q10 40 50 50h299zM390 430v210l30 80q40 -10 50 -50v-280l-20 -20zM130 620v-190l-60 -60
|
||||
l-20 20v260z" />
|
||||
<glyph glyph-name="s" unicode="s"
|
||||
d="M390 400l40 -40l-40 -40h-260l-40 40l40 40h260zM450 350l20 -20v-280q-10 -40 -50 -50l-30 80v210zM400 0h-300q-40 10 -50 50l80 30h240zM130 620v-190l-60 -60l-20 20v260zM131 640l-80 30q10 40 50 50h319q40 -10 50 -50l-80 -30h-259z" />
|
||||
<glyph glyph-name="t" unicode="t" horiz-adv-x="519"
|
||||
d="M259 350l40 -40v-260q-10 -40 -50 -50l-30 80v230zM219 410v210h80v-210l-40 -40zM130 640l-80 30q10 40 50 50h319q40 -10 50 -50l-80 -30h-259z" />
|
||||
<glyph glyph-name="u" unicode="u"
|
||||
d="M450 350l20 -20v-280q-10 -40 -50 -50l-30 80v210zM400 0h-300q-40 10 -50 50l80 30h240zM50 70v260l20 20l60 -60v-190zM390 430v210l30 80q40 -10 50 -50v-280l-20 -20zM70 360l-20 20v280q10 40 50 50l30 -80v-210z" />
|
||||
<glyph glyph-name="v" unicode="v"
|
||||
d="M70 360l-20 20v280q10 40 50 50l30 -80v-210zM390 420v210l30 80q40 -10 50 -50v-280l-20 -20zM250 120v-120l-200 260v60l20 20l60 -60zM390 280l60 60l20 -20v-60l-200 -260v120z" />
|
||||
<glyph glyph-name="w" unicode="w"
|
||||
d="M300 100h-80v230l40 40l40 -40v-230zM390 430v210l30 80q40 -10 50 -50v-280l-20 -20zM400 0h-299q-40 10 -50 50l80 30h239zM50 70v260l20 20l60 -60v-190zM450 350l20 -20v-280q-10 -40 -50 -50l-30 80v210zM70 370l-20 20v280q10 40 50 50l30 -80v-210z" />
|
||||
<glyph glyph-name="x" unicode="x"
|
||||
d="M270 350h45l154 -310q-20 -40 -80 -40l-119 242v108zM271 478l119 242q60 0 80 -40l-154 -310h-45v108zM249 242l-119 -242q-60 0 -80 40l154 310h45v-108zM250 370h-45l-154 310q20 40 80 40l119 -243v-107z" />
|
||||
<glyph glyph-name="y" unicode="y"
|
||||
d="M390 400l40 -40l-40 -40h-260l-40 40l40 40h260zM450 350l20 -20v-280q-10 -40 -50 -50l-30 80v210zM400 0h-300q-40 10 -50 50l80 30h240zM130 650v-220l-60 -60l-20 20v290zM390 430v210l30 80q40 -10 50 -50v-280l-20 -20z" />
|
||||
<glyph glyph-name="z" unicode="z"
|
||||
d="M430 0h-280l40 80h210zM330 640h-199l-80 30q10 40 50 50h269zM260 430l130 290q60 0 80 -40l-150 -310h-60v60zM270 290l-140 -290q-60 0 -80 40l160 310h60v-60z" />
|
||||
<glyph glyph-name="braceleft" unicode="{" horiz-adv-x="430"
|
||||
d="M170 70v220l60 60l20 -20v-230zM320 640h-69l-80 30q10 40 50 50h139l20 -20zM250 620v-230l-20 -20l-60 60v220zM380 20l-20 -20h-139q-40 10 -50 50l80 30h69zM160 400l40 -40l-40 -40h-70l-40 40l40 40h70z" />
|
||||
<glyph glyph-name="bar" unicode="|" horiz-adv-x="180"
|
||||
d="M130 50q-10 -40 -50 -50l-30 80v560l30 80q40 -10 50 -50v-620z" />
|
||||
<glyph glyph-name="braceright" unicode="}" horiz-adv-x="430"
|
||||
d="M180 100v230l20 20l60 -60v-220zM50 700l20 20h139q40 -10 50 -50l-80 -30h-69zM260 650v-220l-60 -60l-20 20v230zM110 80h69l80 -30q-10 -40 -50 -50h-139l-20 20zM340 400l40 -40l-40 -40h-70l-40 40l40 40h70z" />
|
||||
<glyph glyph-name="asciitilde" unicode="~" horiz-adv-x="540"
|
||||
d="M290 480l40 -40l-40 -40h-40l-40 40l40 40h40zM130 479l40 -40l-40 -40h-40l-40 40l40 40h40zM450 480l40 -40l-40 -40h-40l-40 40l40 40h40zM210 540l40 -40l-40 -40h-40l-40 40l40 40h40zM370 410l40 -40l-40 -40h-40l-40 40l40 40h40z" />
|
||||
<glyph glyph-name="copyright" unicode="©" horiz-adv-x="580"
|
||||
d="M460 0h-360q-40 10 -50 50l80 30h300zM430 640h-299l-80 30q10 40 50 50h359zM130 100l-80 -30v580l80 -30v-520zM530 50q-10 -40 -50 -50l-30 80v560l30 80q40 -10 50 -50v-620zM380 480h-130l-80 30q10 40 50 50h190zM250 460v-220l-30 -80q-40 10 -50 50v280zM270 240
|
||||
h60l80 -30q-10 -40 -50 -50h-120z" />
|
||||
<glyph glyph-name="endash" unicode="–" horiz-adv-x="540"
|
||||
d="M450 400l40 -40l-40 -40h-360l-40 40l40 40h360z" />
|
||||
<glyph glyph-name="emdash" unicode="—" horiz-adv-x="580"
|
||||
d="M490 400l40 -40l-40 -40h-400l-40 40l40 40h400z" />
|
||||
<glyph glyph-name="quoteleft" unicode="‘" horiz-adv-x="180"
|
||||
d="M130 520h-80v160l40 40l40 -40v-160z" />
|
||||
<glyph glyph-name="quoteright" unicode="’" horiz-adv-x="180"
|
||||
d="M130 560l-40 -40l-40 40v160h80v-160z" />
|
||||
<glyph glyph-name="quotedblleft" unicode="“" horiz-adv-x="340"
|
||||
d="M130 521h-80v160l40 40l40 -40v-160zM290 520h-80v160l40 40l40 -40v-160z" />
|
||||
<glyph glyph-name="quotedblright" unicode="”" horiz-adv-x="341"
|
||||
d="M130 560l-40 -40l-40 40v160h80v-160zM291 561l-40 -40l-40 40v160h80v-160z" />
|
||||
<glyph glyph-name="bullet" unicode="•" horiz-adv-x="390"
|
||||
d="M195 220q-60 0 -102.5 42.5t-42.5 102.5t42.5 102.5t102.5 42.5t102.5 -42.5t42.5 -102.5t-42.5 -102.5t-102.5 -42.5z" />
|
||||
<glyph glyph-name="perthousand" unicode="‰" horiz-adv-x="590"
|
||||
d="M279 399l-160 -159q-60 -1 -59 59l189 190h30v-90zM140 640h-10l-80 30q10 40 50 50h70zM130 620v-60l-30 -80q-40 10 -50 50v120zM150 560h10l80 -30q-10 -40 -50 -50h-70zM160 580v60l30 80q40 -10 50 -50v-120zM440 160h-10l-80 30q10 40 50 50h70zM431 140v-60
|
||||
l-30 -80q-40 10 -50 50v120zM450 80h10l80 -30q-10 -40 -50 -50h-70zM460 100v60l30 80q40 -10 50 -50v-120zM230 100v60l30 80q40 -10 50 -50v-120zM220 79h10l80 -30q-10 -40 -50 -50h-70zM200 140v-60l-30 -80q-40 10 -50 50v120zM210 160h-10l-80 30q10 40 50 50h70z
|
||||
M290 531l160 159q60 1 59 -59l-189 -191l-30 1v90z" />
|
||||
<glyph glyph-name="NULL" horiz-adv-x="500"
|
||||
/>
|
||||
</font>
|
||||
</defs></svg>
|
||||
|
After Width: | Height: | Size: 26 KiB |
BIN
src/views/center/fonts/digital-7.ttf
Normal file
BIN
src/views/center/fonts/digital-7.ttf
Normal file
Binary file not shown.
BIN
src/views/center/fonts/digital-7.woff
Normal file
BIN
src/views/center/fonts/digital-7.woff
Normal file
Binary file not shown.
BIN
src/views/center/fonts/digital-7.woff2
Normal file
BIN
src/views/center/fonts/digital-7.woff2
Normal file
Binary file not shown.
BIN
src/views/center/fonts/sszh.ttf
Normal file
BIN
src/views/center/fonts/sszh.ttf
Normal file
Binary file not shown.
BIN
src/views/center/images/2b708e1ed8996fe79b1a17a7850a699.png
Normal file
BIN
src/views/center/images/2b708e1ed8996fe79b1a17a7850a699.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.9 KiB |
BIN
src/views/center/images/369a8784c99e23f956099a59f7bdfa1.png
Normal file
BIN
src/views/center/images/369a8784c99e23f956099a59f7bdfa1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.2 KiB |
BIN
src/views/center/images/3d88ca8408f9026e9a5aa6073ea1249.png
Normal file
BIN
src/views/center/images/3d88ca8408f9026e9a5aa6073ea1249.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 2.7 KiB |
BIN
src/views/center/images/BJ.png
Normal file
BIN
src/views/center/images/BJ.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1.0 MiB |
BIN
src/views/center/images/BJ1.png
Normal file
BIN
src/views/center/images/BJ1.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 1002 KiB |
Some files were not shown because too many files have changed in this diff Show More
Reference in New Issue
Block a user