Преглед изворни кода

2022年5月12日21:05:27

master
wq пре 3 година
родитељ
комит
05e8dcf02b
6 измењених фајлова са 384 додато и 138 уклоњено
  1. 15
    12
      index.html
  2. 168
    45
      package-lock.json
  3. 3
    3
      package.json
  4. 7
    19
      src/layout/index.vue
  5. 128
    42
      src/views/system/home/Home.vue
  6. 63
    17
      yarn.lock

+ 15
- 12
index.html Прегледај датотеку

@@ -1,14 +1,17 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<!-- <link rel="icon" href="/favicon.ico" /> -->
<link rel="icon" href="/logo.png" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>D-UI</title>
</head>
<body>
<div id="app"></div>
<script type="module" src="/src/main.ts"></script>
</body>
</html>

<head>
<meta charset="UTF-8" />
<!-- <link rel="icon" href="/favicon.ico" /> -->
<link rel="icon" href="/logo.png" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>黔通智联</title>
</head>

<body>
<div id="app"></div>
<script type="module" src="/src/main.ts"></script>
</body>

</html>

+ 168
- 45
package-lock.json Прегледај датотеку

@@ -12,6 +12,7 @@
"axios": "^0.27.2",
"babel-polyfill": "^6.26.0",
"element-plus": "^2.1.7",
"file-saver": "^2.0.5",
"fuse.js": "^6.5.3",
"js-cookie": "^3.0.1",
"jsencrypt": "^3.2.1",
@@ -20,12 +21,12 @@
"vue": "^3.2.2",
"vue-fragment": "^1.5.2",
"vue-router": "4",
"vuex": "^4.0.2"
"vuex": "^4.0.2",
"xlsx": "^0.18.5"
},
"devDependencies": {
"@babel/types": "^7.16.0",
"@types/js-cookie": "^3.0.2",
"@types/node": "^16.11.10",
"@typescript-eslint/eslint-plugin": "^5.4.0",
"@typescript-eslint/parser": "^5.4.0",
"@vitejs/plugin-vue": "^1.10.2",
@@ -39,7 +40,6 @@
"postcss": "^8.4.4",
"prettier": "^2.4.1",
"sass": "^1.44.0",
"script-loader": "^0.7.2",
"typescript": "^4.5.2",
"vite": "^2.4.2",
"vite-plugin-compression": "^0.3.6",
@@ -318,12 +318,6 @@
"integrity": "sha1-l+3JA36gw4WFMgsolk3eOznkZg0=",
"dev": true
},
"node_modules/@types/node": {
"version": "16.11.10",
"resolved": "https://registry.npmmirror.com/@types/node/download/@types/node-16.11.10.tgz",
"integrity": "sha512-3aRnHa1KlOEEhJ6+CvyHKK5vE9BcLGjtUpwvqYLRvYNQKMfabu3BwfJaA/SLW8dxe28LsNDjtHwePTuzn3gmOA==",
"dev": true
},
"node_modules/@typescript-eslint/eslint-plugin": {
"version": "5.4.0",
"resolved": "https://registry.npmmirror.com/@typescript-eslint/eslint-plugin/download/@typescript-eslint/eslint-plugin-5.4.0.tgz",
@@ -671,6 +665,14 @@
"acorn": "^6.0.0 || ^7.0.0 || ^8.0.0"
}
},
"node_modules/adler-32": {
"version": "1.3.1",
"resolved": "https://registry.npmmirror.com/adler-32/-/adler-32-1.3.1.tgz",
"integrity": "sha512-ynZ4w/nUUv5rrsR8UUGoe1VC9hZj6V5hU9Qw1HlMDJGEJw5S7TfTErWTjMys6M7vr0YWcPqs3qAr4ss0nDfP+A==",
"engines": {
"node": ">=0.8"
}
},
"node_modules/ajv": {
"version": "6.12.6",
"resolved": "https://registry.npmmirror.com/ajv/download/ajv-6.12.6.tgz?cache=0&sync_timestamp=1637522259668&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Fajv%2Fdownload%2Fajv-6.12.6.tgz",
@@ -945,6 +947,18 @@
"integrity": "sha512-neRmrmIrCGuMnxGSoh+x7zYtQFFgnSY2jaomjU56sCkTA6JINqQrxutF459JpWcWRajvoyn95sOXq4Pqrnyjew==",
"dev": true
},
"node_modules/cfb": {
"version": "1.2.2",
"resolved": "https://registry.npmmirror.com/cfb/-/cfb-1.2.2.tgz",
"integrity": "sha512-KfdUZsSOw19/ObEWasvBP/Ac4reZvAGauZhs6S/gqNhXhI7cKwvlH7ulj+dOEYnca4bm4SGo8C1bTAQvnTjgQA==",
"dependencies": {
"adler-32": "~1.3.0",
"crc-32": "~1.2.0"
},
"engines": {
"node": ">=0.8"
}
},
"node_modules/chainsaw": {
"version": "0.1.0",
"resolved": "https://registry.npm.taobao.org/chainsaw/download/chainsaw-0.1.0.tgz",
@@ -991,6 +1005,14 @@
"fsevents": "~2.3.2"
}
},
"node_modules/codepage": {
"version": "1.15.0",
"resolved": "https://registry.npmmirror.com/codepage/-/codepage-1.15.0.tgz",
"integrity": "sha512-3g6NUTPd/YtuuGrhMnOMRjFc+LJw/bnMp3+0r/Wcz3IXUuCosKRJvMphm5+Q+bvTVGcJJuRvVLuYba+WojaFaA==",
"engines": {
"node": ">=0.8"
}
},
"node_modules/color-convert": {
"version": "2.0.1",
"resolved": "https://registry.npm.taobao.org/color-convert/download/color-convert-2.0.1.tgz",
@@ -1047,6 +1069,17 @@
"integrity": "sha1-pgQtNjTCsn6TKPg3uWX6yDgI24U=",
"dev": true
},
"node_modules/crc-32": {
"version": "1.2.2",
"resolved": "https://registry.npmmirror.com/crc-32/-/crc-32-1.2.2.tgz",
"integrity": "sha512-ROmzCKrTnOwybPcJApAA6WBWij23HVfGVNKqqrZpuyZOHqK2CwHSvpGuyt/UNNvaIjEd8X5IFGp4Mh+Ie1IHJQ==",
"bin": {
"crc32": "bin/crc32.njs"
},
"engines": {
"node": ">=0.8"
}
},
"node_modules/cross-spawn": {
"version": "7.0.3",
"resolved": "https://registry.npm.taobao.org/cross-spawn/download/cross-spawn-7.0.3.tgz",
@@ -1620,6 +1653,11 @@
"node": "^10.12.0 || >=12.0.0"
}
},
"node_modules/file-saver": {
"version": "2.0.5",
"resolved": "https://registry.npmmirror.com/file-saver/-/file-saver-2.0.5.tgz",
"integrity": "sha512-P9bmyZ3h/PRG+Nzga+rbdI4OEpNDzAVyy74uVO9ATgzLK6VtAsYybF/+TOCvrc0MO793d6+42lLyZTw7/ArVzA=="
},
"node_modules/fill-range": {
"version": "7.0.1",
"resolved": "https://registry.npm.taobao.org/fill-range/download/fill-range-7.0.1.tgz",
@@ -1689,6 +1727,14 @@
"node": ">= 6"
}
},
"node_modules/frac": {
"version": "1.1.2",
"resolved": "https://registry.npmmirror.com/frac/-/frac-1.1.2.tgz",
"integrity": "sha512-w/XBfkibaTl3YDqASwfDUqkna4Z2p9cFSr1aHDt0WoMTECnRfBOv2WArlZILlqgWlmdIlALXGpM2AOhEk5W3IA==",
"engines": {
"node": ">=0.8"
}
},
"node_modules/fraction.js": {
"version": "4.2.0",
"resolved": "https://registry.npmmirror.com/fraction.js/-/fraction.js-4.2.0.tgz",
@@ -2529,12 +2575,6 @@
"integrity": "sha1-SSkii7xyTfrEPg77BYyve2z7YkM=",
"dev": true
},
"node_modules/raw-loader": {
"version": "0.5.1",
"resolved": "https://registry.npmmirror.com/raw-loader/-/raw-loader-0.5.1.tgz",
"integrity": "sha512-sf7oGoLuaYAScB4VGr0tzetsYlS8EJH6qnTCfQ/WVEa89hALQ4RQfCKt5xCyPQKPDUbVUAIP1QsxAwfAjlDp7Q==",
"dev": true
},
"node_modules/readable-stream": {
"version": "2.3.7",
"resolved": "https://registry.npm.taobao.org/readable-stream/download/readable-stream-2.3.7.tgz",
@@ -2693,15 +2733,6 @@
"node": "^14.13.1 || >=16.0.0"
}
},
"node_modules/script-loader": {
"version": "0.7.2",
"resolved": "https://registry.npmmirror.com/script-loader/-/script-loader-0.7.2.tgz",
"integrity": "sha512-UMNLEvgOAQuzK8ji8qIscM3GIrRCWN6MmMXGD4SD5l6cSycgGsCo0tX5xRnfQcoghqct0tjHjcykgI1PyBE2aA==",
"dev": true,
"dependencies": {
"raw-loader": "~0.5.1"
}
},
"node_modules/semver": {
"version": "7.3.5",
"resolved": "https://registry.npm.taobao.org/semver/download/semver-7.3.5.tgz?cache=0&sync_timestamp=1616463603361&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fsemver%2Fdownload%2Fsemver-7.3.5.tgz",
@@ -2794,6 +2825,17 @@
"integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw=",
"dev": true
},
"node_modules/ssf": {
"version": "0.11.2",
"resolved": "https://registry.npmmirror.com/ssf/-/ssf-0.11.2.tgz",
"integrity": "sha512-+idbmIXoYET47hH+d7dfm2epdOMUDjqcB4648sTZ+t2JwoyBFL/insLfB/racrDmsKB3diwsDA696pZMieAC5g==",
"dependencies": {
"frac": "~1.1.2"
},
"engines": {
"node": ">=0.8"
}
},
"node_modules/string_decoder": {
"version": "1.1.1",
"resolved": "https://registry.npm.taobao.org/string_decoder/download/string_decoder-1.1.1.tgz",
@@ -3434,6 +3476,22 @@
"node": ">= 8"
}
},
"node_modules/wmf": {
"version": "1.0.2",
"resolved": "https://registry.npmmirror.com/wmf/-/wmf-1.0.2.tgz",
"integrity": "sha512-/p9K7bEh0Dj6WbXg4JG0xvLQmIadrner1bi45VMJTfnbVHsc7yIajZyoSoK60/dtVBs12Fm6WkUI5/3WAVsNMw==",
"engines": {
"node": ">=0.8"
}
},
"node_modules/word": {
"version": "0.3.0",
"resolved": "https://registry.npmmirror.com/word/-/word-0.3.0.tgz",
"integrity": "sha512-OELeY0Q61OXpdUfTp+oweA/vtLVg5VDOXh+3he3PNzLGG/y0oylSOC1xRVj0+l4vQ3tj/bB1HVHv1ocXkQceFA==",
"engines": {
"node": ">=0.8"
}
},
"node_modules/word-wrap": {
"version": "1.2.3",
"resolved": "https://registry.npm.taobao.org/word-wrap/download/word-wrap-1.2.3.tgz",
@@ -3449,6 +3507,26 @@
"integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8=",
"dev": true
},
"node_modules/xlsx": {
"version": "0.18.5",
"resolved": "https://registry.npmmirror.com/xlsx/-/xlsx-0.18.5.tgz",
"integrity": "sha512-dmg3LCjBPHZnQp5/F/+nnTa+miPJxUXB6vtk42YjBBKayDNagxGEeIdWApkYPOf3Z3pm3k62Knjzp7lMeTEtFQ==",
"dependencies": {
"adler-32": "~1.3.0",
"cfb": "~1.2.1",
"codepage": "~1.15.0",
"crc-32": "~1.2.1",
"ssf": "~0.11.2",
"wmf": "~1.0.1",
"word": "~0.3.0"
},
"bin": {
"xlsx": "bin/xlsx.njs"
},
"engines": {
"node": ">=0.8"
}
},
"node_modules/yallist": {
"version": "4.0.0",
"resolved": "https://registry.npm.taobao.org/yallist/download/yallist-4.0.0.tgz",
@@ -3675,12 +3753,6 @@
"integrity": "sha1-l+3JA36gw4WFMgsolk3eOznkZg0=",
"dev": true
},
"@types/node": {
"version": "16.11.10",
"resolved": "https://registry.npmmirror.com/@types/node/download/@types/node-16.11.10.tgz",
"integrity": "sha512-3aRnHa1KlOEEhJ6+CvyHKK5vE9BcLGjtUpwvqYLRvYNQKMfabu3BwfJaA/SLW8dxe28LsNDjtHwePTuzn3gmOA==",
"dev": true
},
"@typescript-eslint/eslint-plugin": {
"version": "5.4.0",
"resolved": "https://registry.npmmirror.com/@typescript-eslint/eslint-plugin/download/@typescript-eslint/eslint-plugin-5.4.0.tgz",
@@ -3927,6 +3999,11 @@
"dev": true,
"requires": {}
},
"adler-32": {
"version": "1.3.1",
"resolved": "https://registry.npmmirror.com/adler-32/-/adler-32-1.3.1.tgz",
"integrity": "sha512-ynZ4w/nUUv5rrsR8UUGoe1VC9hZj6V5hU9Qw1HlMDJGEJw5S7TfTErWTjMys6M7vr0YWcPqs3qAr4ss0nDfP+A=="
},
"ajv": {
"version": "6.12.6",
"resolved": "https://registry.npmmirror.com/ajv/download/ajv-6.12.6.tgz?cache=0&sync_timestamp=1637522259668&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Fajv%2Fdownload%2Fajv-6.12.6.tgz",
@@ -4146,6 +4223,15 @@
"integrity": "sha512-neRmrmIrCGuMnxGSoh+x7zYtQFFgnSY2jaomjU56sCkTA6JINqQrxutF459JpWcWRajvoyn95sOXq4Pqrnyjew==",
"dev": true
},
"cfb": {
"version": "1.2.2",
"resolved": "https://registry.npmmirror.com/cfb/-/cfb-1.2.2.tgz",
"integrity": "sha512-KfdUZsSOw19/ObEWasvBP/Ac4reZvAGauZhs6S/gqNhXhI7cKwvlH7ulj+dOEYnca4bm4SGo8C1bTAQvnTjgQA==",
"requires": {
"adler-32": "~1.3.0",
"crc-32": "~1.2.0"
}
},
"chainsaw": {
"version": "0.1.0",
"resolved": "https://registry.npm.taobao.org/chainsaw/download/chainsaw-0.1.0.tgz",
@@ -4181,6 +4267,11 @@
"readdirp": "~3.6.0"
}
},
"codepage": {
"version": "1.15.0",
"resolved": "https://registry.npmmirror.com/codepage/-/codepage-1.15.0.tgz",
"integrity": "sha512-3g6NUTPd/YtuuGrhMnOMRjFc+LJw/bnMp3+0r/Wcz3IXUuCosKRJvMphm5+Q+bvTVGcJJuRvVLuYba+WojaFaA=="
},
"color-convert": {
"version": "2.0.1",
"resolved": "https://registry.npm.taobao.org/color-convert/download/color-convert-2.0.1.tgz",
@@ -4229,6 +4320,11 @@
"integrity": "sha1-pgQtNjTCsn6TKPg3uWX6yDgI24U=",
"dev": true
},
"crc-32": {
"version": "1.2.2",
"resolved": "https://registry.npmmirror.com/crc-32/-/crc-32-1.2.2.tgz",
"integrity": "sha512-ROmzCKrTnOwybPcJApAA6WBWij23HVfGVNKqqrZpuyZOHqK2CwHSvpGuyt/UNNvaIjEd8X5IFGp4Mh+Ie1IHJQ=="
},
"cross-spawn": {
"version": "7.0.3",
"resolved": "https://registry.npm.taobao.org/cross-spawn/download/cross-spawn-7.0.3.tgz",
@@ -4669,6 +4765,11 @@
"flat-cache": "^3.0.4"
}
},
"file-saver": {
"version": "2.0.5",
"resolved": "https://registry.npmmirror.com/file-saver/-/file-saver-2.0.5.tgz",
"integrity": "sha512-P9bmyZ3h/PRG+Nzga+rbdI4OEpNDzAVyy74uVO9ATgzLK6VtAsYybF/+TOCvrc0MO793d6+42lLyZTw7/ArVzA=="
},
"fill-range": {
"version": "7.0.1",
"resolved": "https://registry.npm.taobao.org/fill-range/download/fill-range-7.0.1.tgz",
@@ -4720,6 +4821,11 @@
"mime-types": "^2.1.12"
}
},
"frac": {
"version": "1.1.2",
"resolved": "https://registry.npmmirror.com/frac/-/frac-1.1.2.tgz",
"integrity": "sha512-w/XBfkibaTl3YDqASwfDUqkna4Z2p9cFSr1aHDt0WoMTECnRfBOv2WArlZILlqgWlmdIlALXGpM2AOhEk5W3IA=="
},
"fraction.js": {
"version": "4.2.0",
"resolved": "https://registry.npmmirror.com/fraction.js/-/fraction.js-4.2.0.tgz",
@@ -5382,12 +5488,6 @@
"integrity": "sha1-SSkii7xyTfrEPg77BYyve2z7YkM=",
"dev": true
},
"raw-loader": {
"version": "0.5.1",
"resolved": "https://registry.npmmirror.com/raw-loader/-/raw-loader-0.5.1.tgz",
"integrity": "sha512-sf7oGoLuaYAScB4VGr0tzetsYlS8EJH6qnTCfQ/WVEa89hALQ4RQfCKt5xCyPQKPDUbVUAIP1QsxAwfAjlDp7Q==",
"dev": true
},
"readable-stream": {
"version": "2.3.7",
"resolved": "https://registry.npm.taobao.org/readable-stream/download/readable-stream-2.3.7.tgz",
@@ -5512,15 +5612,6 @@
"resolved": "https://registry.npmmirror.com/screenfull/-/screenfull-6.0.1.tgz",
"integrity": "sha512-yzQW+j4zMUBQC51xxWaoDYjxOtl8Kn+xvue3p6v/fv2pIi1jH4AldgVLU8TBfFVgH2x3VXlf3+YiA/AYIPlaew=="
},
"script-loader": {
"version": "0.7.2",
"resolved": "https://registry.npmmirror.com/script-loader/-/script-loader-0.7.2.tgz",
"integrity": "sha512-UMNLEvgOAQuzK8ji8qIscM3GIrRCWN6MmMXGD4SD5l6cSycgGsCo0tX5xRnfQcoghqct0tjHjcykgI1PyBE2aA==",
"dev": true,
"requires": {
"raw-loader": "~0.5.1"
}
},
"semver": {
"version": "7.3.5",
"resolved": "https://registry.npm.taobao.org/semver/download/semver-7.3.5.tgz?cache=0&sync_timestamp=1616463603361&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fsemver%2Fdownload%2Fsemver-7.3.5.tgz",
@@ -5589,6 +5680,14 @@
"integrity": "sha1-BOaSb2YolTVPPdAVIDYzuFcpfiw=",
"dev": true
},
"ssf": {
"version": "0.11.2",
"resolved": "https://registry.npmmirror.com/ssf/-/ssf-0.11.2.tgz",
"integrity": "sha512-+idbmIXoYET47hH+d7dfm2epdOMUDjqcB4648sTZ+t2JwoyBFL/insLfB/racrDmsKB3diwsDA696pZMieAC5g==",
"requires": {
"frac": "~1.1.2"
}
},
"string_decoder": {
"version": "1.1.1",
"resolved": "https://registry.npm.taobao.org/string_decoder/download/string_decoder-1.1.1.tgz",
@@ -6091,6 +6190,16 @@
"isexe": "^2.0.0"
}
},
"wmf": {
"version": "1.0.2",
"resolved": "https://registry.npmmirror.com/wmf/-/wmf-1.0.2.tgz",
"integrity": "sha512-/p9K7bEh0Dj6WbXg4JG0xvLQmIadrner1bi45VMJTfnbVHsc7yIajZyoSoK60/dtVBs12Fm6WkUI5/3WAVsNMw=="
},
"word": {
"version": "0.3.0",
"resolved": "https://registry.npmmirror.com/word/-/word-0.3.0.tgz",
"integrity": "sha512-OELeY0Q61OXpdUfTp+oweA/vtLVg5VDOXh+3he3PNzLGG/y0oylSOC1xRVj0+l4vQ3tj/bB1HVHv1ocXkQceFA=="
},
"word-wrap": {
"version": "1.2.3",
"resolved": "https://registry.npm.taobao.org/word-wrap/download/word-wrap-1.2.3.tgz",
@@ -6103,6 +6212,20 @@
"integrity": "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8=",
"dev": true
},
"xlsx": {
"version": "0.18.5",
"resolved": "https://registry.npmmirror.com/xlsx/-/xlsx-0.18.5.tgz",
"integrity": "sha512-dmg3LCjBPHZnQp5/F/+nnTa+miPJxUXB6vtk42YjBBKayDNagxGEeIdWApkYPOf3Z3pm3k62Knjzp7lMeTEtFQ==",
"requires": {
"adler-32": "~1.3.0",
"cfb": "~1.2.1",
"codepage": "~1.15.0",
"crc-32": "~1.2.1",
"ssf": "~0.11.2",
"wmf": "~1.0.1",
"word": "~0.3.0"
}
},
"yallist": {
"version": "4.0.0",
"resolved": "https://registry.npm.taobao.org/yallist/download/yallist-4.0.0.tgz",

+ 3
- 3
package.json Прегледај датотеку

@@ -13,6 +13,7 @@
"axios": "^0.27.2",
"babel-polyfill": "^6.26.0",
"element-plus": "^2.1.7",
"file-saver": "^2.0.5",
"fuse.js": "^6.5.3",
"js-cookie": "^3.0.1",
"jsencrypt": "^3.2.1",
@@ -21,12 +22,12 @@
"vue": "^3.2.2",
"vue-fragment": "^1.5.2",
"vue-router": "4",
"vuex": "^4.0.2"
"vuex": "^4.0.2",
"xlsx": "^0.18.5"
},
"devDependencies": {
"@babel/types": "^7.16.0",
"@types/js-cookie": "^3.0.2",
"@types/node": "^16.11.10",
"@typescript-eslint/eslint-plugin": "^5.4.0",
"@typescript-eslint/parser": "^5.4.0",
"@vitejs/plugin-vue": "^1.10.2",
@@ -40,7 +41,6 @@
"postcss": "^8.4.4",
"prettier": "^2.4.1",
"sass": "^1.44.0",
"script-loader": "^0.7.2",
"typescript": "^4.5.2",
"vite": "^2.4.2",
"vite-plugin-compression": "^0.3.6",

+ 7
- 19
src/layout/index.vue Прегледај датотеку

@@ -1,6 +1,5 @@
<template>
<!-- :sources="[bgVideo]" -->

<video-bg :sources="[]">
<div class="as-layout-horizontal" style="width: 100%; height: 100%; opacity: 0.9">
<!-- 此处先划出布局形式(按左右布局划分,左边菜单,右边内容) -->
@@ -10,26 +9,14 @@
<div class="as-gravity-center-start" style="height: 70px">
<img rel="icon" src="/logo2.png" style="width: 60px; height: 60px" />
<!-- D-UI框架模板 -->
<span
class="as-bold"
style="font-size: 18px; color: #ffffff"
v-show="menuStart.menuIsExpansion"
>黔通智联</span
>
<span class="as-bold" style="font-size: 18px; color: #ffffff" v-show="menuStart.menuIsExpansion">黔通智联</span>
</div>

<!-- 菜单主体部分 -->
<div style="height: 100%; background-color: #ffffff">
<el-scrollbar class="as-border-width" height="100%" style="background-color: #ffffff">
<el-menu
:default-active="menuIndex.menuIndex"
style="height: 100%"
mode="vertical"
:router="false"
@select="select"
:collapse="!menuStart.menuIsExpansion"
class="el-menu-vertical-demo"
>
<el-menu :default-active="menuIndex.menuIndex" style="height: 100%" mode="vertical" :router="false"
@select="select" :collapse="!menuStart.menuIsExpansion" class="el-menu-vertical-demo">
<sidebar-item :list="list" />
</el-menu>
</el-scrollbar>
@@ -39,6 +26,7 @@
<div class="as-weight as-layout-vertical">
<!-- 头部选项 -->
<div class="bg-theme" style="padding: 0px 10px 0px 10px; height: 70px">

<Head style="height: 70px"></Head>
</div>

@@ -68,11 +56,11 @@

<script setup lang="ts">
// @ts-ignore 选项菜单
import SidebarItem from '@/layout/components/SidebarItem.vue'
import SidebarItem from '@/layout/components/SidebarItem.vue'
// @ts-ignore 选项头部
import Head from '@/layout/components/Head.vue'
import Head from '@/layout/components/Head.vue'
// @ts-ignore Tab选项
import TabContainer from '@/layout/components/TabControl.vue'
import TabContainer from '@/layout/components/TabControl.vue'
import VideoBg from '@/components/VideoBackround/VideoBackground.vue' //视频背景组件
import BgTwo from '@/assets/video/homeBg.mp4' //视频资源
import $store from '@/store/index' // 引入vuex

+ 128
- 42
src/views/system/home/Home.vue Прегледај датотеку

@@ -1,50 +1,136 @@
<template>
<!-- accept 限制上传文件格式 .text-->
<el-upload
ref="uploadRef"
action="https://jsonplaceholder.typicode.com/posts/"
:auto-upload="false"
:on-change="handleChange"
:file-list="fileList"
>
<template #trigger>
<el-button type="primary">select file</el-button>
</template>

<el-button class="ml-3" type="success" @click="submitUpload"> upload to server </el-button>

<template #tip>
<div class="el-upload__tip">jpg/png files with a size less than 500kb</div>
</template>
</el-upload>
<div class="app-content">
<el-row>
<el-col :span="7">
<el-upload
action="/"
:on-change="onChange"
:auto-upload="false"
:show-file-list="false"
accept=".xls, .xlsx"
>
<el-button size="small" type="primary">选择文件</el-button>
</el-upload>
</el-col>
<el-col :span="7">
<el-button size="small" type="primary" @click="exportExcel">文件导出</el-button>
</el-col>
</el-row>
<el-table
style="margin:20px 0;"
:data="outputs"
border
:header-cell-style="{background:'#f1f1f1',color:'#606266'}"
>
<el-table-column label="姓名" prop="name"></el-table-column>
<!-- <el-table-column label="年龄" prop="age"></el-table-column> -->
</el-table>
</div>
</template>
<script lang="ts" setup>
import { ref } from 'vue'
import { barkTime } from '@/utils/utils'
import { UploadProps, UploadUserFile } from 'element-plus'

const uploadRef = ref()
const fileList = ref<UploadUserFile[]>([])
<script>

// import XLSX from "xlsx";

console.log(barkTime()) //时间戳
export default {
data() {
return {
outputs: [], // 保存读取出来的数据列表
fileData: "" // 保存选择的文件数据
};
},
create() {
console.log(XLSX);
},
methods: {
//文件选择时
onChange(file, fileList) {
this.fileData = file; // 保存当前选择文件
this.readExcel(); // 调用读取数据的方法
},

const submitUpload = () => {
uploadRef.value.submit()
}
//读取文件数据
readExcel(e) {
let that = this;
const files = that.fileData;
if (!files) {
//如果没有文件
return false;
} else if (!/\.(xls|xlsx)$/.test(files.name.toLowerCase())) {
this.$message.error("上传格式不正确,请上传xls或者xlsx格式");
return false;
}
const fileReader = new FileReader();
fileReader.onload = ev => {
try {
const data = ev.target.result;
const workbook = XLSX.read(data, {
type: "binary"
});
//导入的文件名称
console.log(workbook.SheetNames);
const wsname = workbook.SheetNames[0]; //取第一张表
const ws = XLSX.utils.sheet_to_json(workbook.Sheets[wsname]); //生成json表格内容
that.outputs = []; //清空接收数据
for (var i = 0; i < ws.length; i++) {
var sheetData = {
// 键名为绑定 el 表格的关键字,值则是 ws[i][对应表头名]
//此处的字段名对应 上面表格数据的字段名
age: ws[i]["年龄"],
name: ws[i]["姓名"]
};
that.outputs.push(sheetData);
}
} catch (e) {
console.log(e);
return false;
}
};
// 如果为原生 input 则应是 files[0]
fileReader.readAsBinaryString(files.raw);
},

const handleChange: UploadProps['onChange'] = (uploadFile, uploadFiles) => {
// console.log(uploadFile, fileList.value.slice(-1));
//导出文件
exportExcel() {
if (!this.outputs.length) {
this.$message.warning("暂无数据导出");
return false;
}
import("@/vendor/Export2Excel").then(excel => {
//导出表格头部内容(要与下面字段对照)
const tHeader = ["姓名", "年龄"];
const filterVal = ["name", "age"];
const data = this.formatJson(filterVal);
//保存excel
excel.export_json_to_excel({
header: tHeader,
data,
//导出的文件名
filename: "table-list"
});
});
},

fileList.value = fileList.value.slice(-1)
// let imgSize = Number(uploadFile.size / 1024).toFixed(2); // / 1024
// //截取后缀名
// const suffix = (uploadFile.name + '').split('.')[1]
// //修改文件名称
// uploadFile.name = barkTime() + '.' + suffix
// if (uploadFiles) {
// uploadFiles.value.split(uploadFiles.value.length, 1)
// }
//格式转换
formatJson(filterVal) {
return this.outputs.map(v =>
// obj = {
// name:'',
// age:''
// }
filterVal.map(j => {
// obj[name]
// obj[age]
console.log(v[j]);
return v[j];
})
);
// [[name,age],[name,age],[name,age]]
}
}
};
</script>

console.log(fileList.value)
}
</script>
<style>
</style>

+ 63
- 17
yarn.lock Прегледај датотеку

@@ -155,11 +155,6 @@
"resolved" "https://registry.npmmirror.com/@types/json-schema/download/@types/json-schema-7.0.9.tgz?cache=0&sync_timestamp=1637266073261&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2F%40types%2Fjson-schema%2Fdownload%2F%40types%2Fjson-schema-7.0.9.tgz"
"version" "7.0.9"

"@types/node@^16.11.10":
"integrity" "sha512-3aRnHa1KlOEEhJ6+CvyHKK5vE9BcLGjtUpwvqYLRvYNQKMfabu3BwfJaA/SLW8dxe28LsNDjtHwePTuzn3gmOA=="
"resolved" "https://registry.npmmirror.com/@types/node/download/@types/node-16.11.10.tgz"
"version" "16.11.10"

"@typescript-eslint/eslint-plugin@^5.4.0":
"integrity" "sha512-9/yPSBlwzsetCsGEn9j24D8vGQgJkOTr4oMLas/w886ZtzKIs1iyoqFrwsX2fqYEeUwsdBpC21gcjRGo57u0eg=="
"resolved" "https://registry.npmmirror.com/@typescript-eslint/eslint-plugin/download/@typescript-eslint/eslint-plugin-5.4.0.tgz"
@@ -366,6 +361,11 @@
"resolved" "https://registry.npmmirror.com/acorn/download/acorn-7.4.1.tgz?cache=0&sync_timestamp=1637225522161&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Facorn%2Fdownload%2Facorn-7.4.1.tgz"
"version" "7.4.1"

"adler-32@~1.3.0":
"integrity" "sha512-ynZ4w/nUUv5rrsR8UUGoe1VC9hZj6V5hU9Qw1HlMDJGEJw5S7TfTErWTjMys6M7vr0YWcPqs3qAr4ss0nDfP+A=="
"resolved" "https://registry.npmmirror.com/adler-32/-/adler-32-1.3.1.tgz"
"version" "1.3.1"

"ajv@^6.10.0", "ajv@^6.12.4":
"integrity" "sha1-uvWmLoArB9l3A0WG+MO69a3ybfQ="
"resolved" "https://registry.npmmirror.com/ajv/download/ajv-6.12.6.tgz?cache=0&sync_timestamp=1637522259668&other_urls=https%3A%2F%2Fregistry.npmmirror.com%2Fajv%2Fdownload%2Fajv-6.12.6.tgz"
@@ -566,6 +566,14 @@
"resolved" "https://registry.npmmirror.com/caniuse-lite/-/caniuse-lite-1.0.30001322.tgz"
"version" "1.0.30001322"

"cfb@~1.2.1":
"integrity" "sha512-KfdUZsSOw19/ObEWasvBP/Ac4reZvAGauZhs6S/gqNhXhI7cKwvlH7ulj+dOEYnca4bm4SGo8C1bTAQvnTjgQA=="
"resolved" "https://registry.npmmirror.com/cfb/-/cfb-1.2.2.tgz"
"version" "1.2.2"
dependencies:
"adler-32" "~1.3.0"
"crc-32" "~1.2.0"

"chainsaw@~0.1.0":
"integrity" "sha1-XqtQsor+WAdNDVgpE4iCi15fvJg="
"resolved" "https://registry.npm.taobao.org/chainsaw/download/chainsaw-0.1.0.tgz"
@@ -605,6 +613,11 @@
optionalDependencies:
"fsevents" "~2.3.2"

"codepage@~1.15.0":
"integrity" "sha512-3g6NUTPd/YtuuGrhMnOMRjFc+LJw/bnMp3+0r/Wcz3IXUuCosKRJvMphm5+Q+bvTVGcJJuRvVLuYba+WojaFaA=="
"resolved" "https://registry.npmmirror.com/codepage/-/codepage-1.15.0.tgz"
"version" "1.15.0"

"color-convert@^1.9.0":
"integrity" "sha1-u3GFBpDh8TZWfeYp0tVHHe2kweg="
"resolved" "https://registry.npm.taobao.org/color-convert/download/color-convert-1.9.3.tgz"
@@ -658,6 +671,11 @@
"resolved" "https://registry.nlark.com/core-util-is/download/core-util-is-1.0.3.tgz"
"version" "1.0.3"

"crc-32@~1.2.0", "crc-32@~1.2.1":
"integrity" "sha512-ROmzCKrTnOwybPcJApAA6WBWij23HVfGVNKqqrZpuyZOHqK2CwHSvpGuyt/UNNvaIjEd8X5IFGp4Mh+Ie1IHJQ=="
"resolved" "https://registry.npmmirror.com/crc-32/-/crc-32-1.2.2.tgz"
"version" "1.2.2"

"cross-spawn@^7.0.2":
"integrity" "sha1-9zqFudXUHQRVUcF34ogtSshXKKY="
"resolved" "https://registry.npm.taobao.org/cross-spawn/download/cross-spawn-7.0.3.tgz"
@@ -1097,6 +1115,11 @@
dependencies:
"flat-cache" "^3.0.4"

"file-saver@^2.0.5":
"integrity" "sha512-P9bmyZ3h/PRG+Nzga+rbdI4OEpNDzAVyy74uVO9ATgzLK6VtAsYybF/+TOCvrc0MO793d6+42lLyZTw7/ArVzA=="
"resolved" "https://registry.npmmirror.com/file-saver/-/file-saver-2.0.5.tgz"
"version" "2.0.5"

"fill-range@^7.0.1":
"integrity" "sha1-GRmmp8df44ssfHflGYU12prN2kA="
"resolved" "https://registry.npm.taobao.org/fill-range/download/fill-range-7.0.1.tgz"
@@ -1131,6 +1154,11 @@
"combined-stream" "^1.0.8"
"mime-types" "^2.1.12"

"frac@~1.1.2":
"integrity" "sha512-w/XBfkibaTl3YDqASwfDUqkna4Z2p9cFSr1aHDt0WoMTECnRfBOv2WArlZILlqgWlmdIlALXGpM2AOhEk5W3IA=="
"resolved" "https://registry.npmmirror.com/frac/-/frac-1.1.2.tgz"
"version" "1.1.2"

"fraction.js@^4.2.0":
"integrity" "sha512-MhLuK+2gUcnZe8ZHlaaINnQLl0xRIGRfcGk2yl8xoQAfHrSsL3rYu6FCmBdkdbhc9EPlwyGHewaRsvwRMJtAlA=="
"resolved" "https://registry.npmmirror.com/fraction.js/-/fraction.js-4.2.0.tgz"
@@ -1721,11 +1749,6 @@
"resolved" "https://registry.npm.taobao.org/queue-microtask/download/queue-microtask-1.2.3.tgz?cache=0&sync_timestamp=1616391510274&other_urls=https%3A%2F%2Fregistry.npm.taobao.org%2Fqueue-microtask%2Fdownload%2Fqueue-microtask-1.2.3.tgz"
"version" "1.2.3"

"raw-loader@~0.5.1":
"integrity" "sha512-sf7oGoLuaYAScB4VGr0tzetsYlS8EJH6qnTCfQ/WVEa89hALQ4RQfCKt5xCyPQKPDUbVUAIP1QsxAwfAjlDp7Q=="
"resolved" "https://registry.npmmirror.com/raw-loader/-/raw-loader-0.5.1.tgz"
"version" "0.5.1"

"readable-stream@^2.0.2", "readable-stream@~2.3.6":
"integrity" "sha1-Hsoc9xGu+BTAT2IlKjamL2yyO1c="
"resolved" "https://registry.npm.taobao.org/readable-stream/download/readable-stream-2.3.7.tgz"
@@ -1841,13 +1864,6 @@
"resolved" "https://registry.npmmirror.com/screenfull/-/screenfull-6.0.1.tgz"
"version" "6.0.1"

"script-loader@^0.7.2":
"integrity" "sha512-UMNLEvgOAQuzK8ji8qIscM3GIrRCWN6MmMXGD4SD5l6cSycgGsCo0tX5xRnfQcoghqct0tjHjcykgI1PyBE2aA=="
"resolved" "https://registry.npmmirror.com/script-loader/-/script-loader-0.7.2.tgz"
"version" "0.7.2"
dependencies:
"raw-loader" "~0.5.1"

"semver@^5.6.0":
"integrity" "sha512-sauaDf/PZdVgrLTNYHRtpXa1iRiKcaebiKQ1BJdpQlWH2lCvexQdX55snPFyK7QzpudqbCI0qXFfOasHdyNDGQ=="
"resolved" "https://registry.npmmirror.com/semver/-/semver-5.7.1.tgz"
@@ -1911,6 +1927,13 @@
"resolved" "https://registry.npm.taobao.org/sprintf-js/download/sprintf-js-1.0.3.tgz"
"version" "1.0.3"

"ssf@~0.11.2":
"integrity" "sha512-+idbmIXoYET47hH+d7dfm2epdOMUDjqcB4648sTZ+t2JwoyBFL/insLfB/racrDmsKB3diwsDA696pZMieAC5g=="
"resolved" "https://registry.npmmirror.com/ssf/-/ssf-0.11.2.tgz"
"version" "0.11.2"
dependencies:
"frac" "~1.1.2"

"string_decoder@~1.1.1":
"integrity" "sha1-nPFhG6YmhdcDCunkujQUnDrwP8g="
"resolved" "https://registry.npm.taobao.org/string_decoder/download/string_decoder-1.1.1.tgz"
@@ -2167,16 +2190,39 @@
dependencies:
"isexe" "^2.0.0"

"wmf@~1.0.1":
"integrity" "sha512-/p9K7bEh0Dj6WbXg4JG0xvLQmIadrner1bi45VMJTfnbVHsc7yIajZyoSoK60/dtVBs12Fm6WkUI5/3WAVsNMw=="
"resolved" "https://registry.npmmirror.com/wmf/-/wmf-1.0.2.tgz"
"version" "1.0.2"

"word-wrap@^1.2.3":
"integrity" "sha1-YQY29rH3A4kb00dxzLF/uTtHB5w="
"resolved" "https://registry.npm.taobao.org/word-wrap/download/word-wrap-1.2.3.tgz"
"version" "1.2.3"

"word@~0.3.0":
"integrity" "sha512-OELeY0Q61OXpdUfTp+oweA/vtLVg5VDOXh+3he3PNzLGG/y0oylSOC1xRVj0+l4vQ3tj/bB1HVHv1ocXkQceFA=="
"resolved" "https://registry.npmmirror.com/word/-/word-0.3.0.tgz"
"version" "0.3.0"

"wrappy@1":
"integrity" "sha1-tSQ9jz7BqjXxNkYFvA0QNuMKtp8="
"resolved" "https://registry.nlark.com/wrappy/download/wrappy-1.0.2.tgz?cache=0&sync_timestamp=1619133505879&other_urls=https%3A%2F%2Fregistry.nlark.com%2Fwrappy%2Fdownload%2Fwrappy-1.0.2.tgz"
"version" "1.0.2"

"xlsx@^0.18.5":
"integrity" "sha512-dmg3LCjBPHZnQp5/F/+nnTa+miPJxUXB6vtk42YjBBKayDNagxGEeIdWApkYPOf3Z3pm3k62Knjzp7lMeTEtFQ=="
"resolved" "https://registry.npmmirror.com/xlsx/-/xlsx-0.18.5.tgz"
"version" "0.18.5"
dependencies:
"adler-32" "~1.3.0"
"cfb" "~1.2.1"
"codepage" "~1.15.0"
"crc-32" "~1.2.1"
"ssf" "~0.11.2"
"wmf" "~1.0.1"
"word" "~0.3.0"

"yallist@^4.0.0":
"integrity" "sha1-m7knkNnA7/7GO+c1GeEaNQGaOnI="
"resolved" "https://registry.npm.taobao.org/yallist/download/yallist-4.0.0.tgz"

Loading…
Откажи
Сачувај