添加页面布局
This commit is contained in:
unknown
parent
cd3735f527
commit
dd020f5235
|
|
@ -6,14 +6,15 @@
|
|||
"serve": "vue-cli-service serve",
|
||||
"build": "vue-cli-service build",
|
||||
"lint": "vue-cli-service lint"
|
||||
|
||||
},
|
||||
"dependencies": {
|
||||
"@arcgis/core": "^4.29.10",
|
||||
"core-js": "^3.8.3",
|
||||
"element-plus": "^2.6.3",
|
||||
"esri-loader": "^3.7.0",
|
||||
"ncp": "^2.0.0",
|
||||
"vue": "^3.2.13",
|
||||
"vue-router": "4",
|
||||
"webpack": "^5.91.0"
|
||||
},
|
||||
"devDependencies": {
|
||||
|
|
|
|||
168
pnpm-lock.yaml
168
pnpm-lock.yaml
|
|
@ -11,6 +11,9 @@ dependencies:
|
|||
core-js:
|
||||
specifier: ^3.8.3
|
||||
version: 3.36.1
|
||||
element-plus:
|
||||
specifier: ^2.6.3
|
||||
version: 2.6.3(vue@3.4.21)
|
||||
esri-loader:
|
||||
specifier: ^3.7.0
|
||||
version: 3.7.0
|
||||
|
|
@ -20,6 +23,9 @@ dependencies:
|
|||
vue:
|
||||
specifier: ^3.2.13
|
||||
version: 3.4.21
|
||||
vue-router:
|
||||
specifier: '4'
|
||||
version: 4.3.0(vue@3.4.21)
|
||||
webpack:
|
||||
specifier: ^5.91.0
|
||||
version: 5.91.0
|
||||
|
|
@ -39,7 +45,7 @@ devDependencies:
|
|||
version: 5.0.8(@vue/cli-service@5.0.8)(eslint@7.32.0)
|
||||
'@vue/cli-service':
|
||||
specifier: ~5.0.0
|
||||
version: 5.0.8(vue@3.4.21)
|
||||
version: 5.0.8(lodash@4.17.21)(vue@3.4.21)
|
||||
eslint:
|
||||
specifier: ^7.32.0
|
||||
version: 7.32.0
|
||||
|
|
@ -1345,11 +1351,24 @@ packages:
|
|||
'@babel/helper-validator-identifier': 7.22.20
|
||||
to-fast-properties: 2.0.0
|
||||
|
||||
/@ctrl/tinycolor@3.6.1:
|
||||
resolution: {integrity: sha512-SITSV6aIXsuVNV3f3O0f2n/cgyEDWoSqtZMYiAmcsYHydcKrOz3gUxB/iXd/Qf08+IZX4KpgNbvUdMBmWz+kcA==}
|
||||
engines: {node: '>=10'}
|
||||
dev: false
|
||||
|
||||
/@discoveryjs/json-ext@0.5.7:
|
||||
resolution: {integrity: sha512-dBVuXR082gk3jsFp7Rd/JI4kytwGHecnCoTtXFb7DB6CNHp4rg5k1bhg0nWdLGLnOV71lmDzGQaLMy8iPLY0pw==}
|
||||
engines: {node: '>=10.0.0'}
|
||||
dev: true
|
||||
|
||||
/@element-plus/icons-vue@2.3.1(vue@3.4.21):
|
||||
resolution: {integrity: sha512-XxVUZv48RZAd87ucGS48jPf6pKu0yV5UCg9f4FFwtrYxXOwWuVJo6wOvSLKEoMQKjv8GsX/mhP6UsC1lRwbUWg==}
|
||||
peerDependencies:
|
||||
vue: ^3.2.0
|
||||
dependencies:
|
||||
vue: 3.4.21
|
||||
dev: false
|
||||
|
||||
/@eslint/eslintrc@0.4.3:
|
||||
resolution: {integrity: sha512-J6KFFz5QCYUJq3pf0mjEcCJVERbzv71PUIDczuh9JkwGEzced6CO5ADLHB1rbf/+oPBtoPfMYNOpGDzCANlbXw==}
|
||||
engines: {node: ^10.12.0 || >=12.0.0}
|
||||
|
|
@ -1568,6 +1587,10 @@ packages:
|
|||
hasBin: true
|
||||
dev: false
|
||||
|
||||
/@sxzz/popperjs-es@2.11.7:
|
||||
resolution: {integrity: sha512-Ccy0NlLkzr0Ex2FKvh2X+OyERHXJ88XJ1MXtsI9y9fGexlaXaVTPzBCRBwIxFkORuOb+uBqeu+RqnpgYTEZRUQ==}
|
||||
dev: false
|
||||
|
||||
/@trysound/sax@0.2.0:
|
||||
resolution: {integrity: sha512-L7z9BgrNEcYyUYtF+HaEfiS5ebkh9jXqbszz7pC0hRBPaatV0XjSD3+eHrpqFemQfgwiFF0QPIarnIihIDn7OA==}
|
||||
engines: {node: '>=10.13.0'}
|
||||
|
|
@ -1665,6 +1688,16 @@ packages:
|
|||
/@types/json-schema@7.0.15:
|
||||
resolution: {integrity: sha512-5+fP8P8MFNC+AyZCDxrB2pkZFPGzqQWUzpSeuuVLvm8VMcorNYavBqoFcxK8bQz4Qsbn4oUEEem4wDLfcysGHA==}
|
||||
|
||||
/@types/lodash-es@4.17.12:
|
||||
resolution: {integrity: sha512-0NgftHUcV4v34VhXm8QBSftKVXtbkBG3ViCjs6+eJ5a6y6Mi/jiFGPc1sC7QK+9BFhWrURE3EOggmWaSxL9OzQ==}
|
||||
dependencies:
|
||||
'@types/lodash': 4.17.0
|
||||
dev: false
|
||||
|
||||
/@types/lodash@4.17.0:
|
||||
resolution: {integrity: sha512-t7dhREVv6dbNj0q17X12j7yDG4bD/DHYX7o5/DbDxobP0HnGPgpRz2Ej77aL7TZT3DSw13fqUTj8J4mMnqa7WA==}
|
||||
dev: false
|
||||
|
||||
/@types/mime@1.3.5:
|
||||
resolution: {integrity: sha512-/pyBZWSLD2n0dcHE3hq8s8ZvcETHtEuF+3E7XVt0Ig2nvsVQXdghHVcEkIWjy9A0wKfTn97a/PSDYohKIlnP/w==}
|
||||
dev: true
|
||||
|
|
@ -1735,6 +1768,10 @@ packages:
|
|||
resolution: {integrity: sha512-ScaPdn1dQczgbl0QFTeTOmVHFULt394XJgOQNoyVhZ6r2vLnMLJfBPd53SB52T/3G36VI1/g2MZaX0cwDuXsfw==}
|
||||
dev: false
|
||||
|
||||
/@types/web-bluetooth@0.0.16:
|
||||
resolution: {integrity: sha512-oh8q2Zc32S6gd/j50GowEjKLoOVOwHP/bWVjKJInBwQqdOYMdPrf1oVlelTlyfFK3CKxL1uahMDAr+vy8T7yMQ==}
|
||||
dev: false
|
||||
|
||||
/@types/ws@8.5.10:
|
||||
resolution: {integrity: sha512-vmQSUcfalpIq0R9q7uTo2lXs6eGIpt9wtnLdMv9LVpIjCA/+ufZRozlVoVelIYixx1ugCBKDhn89vnsEGOCx9A==}
|
||||
dependencies:
|
||||
|
|
@ -2063,7 +2100,7 @@ packages:
|
|||
dependencies:
|
||||
'@babel/core': 7.24.4
|
||||
'@vue/babel-preset-app': 5.0.8(@babel/core@7.24.4)(core-js@3.36.1)(vue@3.4.21)
|
||||
'@vue/cli-service': 5.0.8(vue@3.4.21)
|
||||
'@vue/cli-service': 5.0.8(lodash@4.17.21)(vue@3.4.21)
|
||||
'@vue/cli-shared-utils': 5.0.8
|
||||
babel-loader: 8.3.0(@babel/core@7.24.4)(webpack@5.91.0)
|
||||
thread-loader: 3.0.4(webpack@5.91.0)
|
||||
|
|
@ -2085,7 +2122,7 @@ packages:
|
|||
'@vue/cli-service': ^3.0.0 || ^4.0.0 || ^5.0.0-0
|
||||
eslint: '>=7.5.0'
|
||||
dependencies:
|
||||
'@vue/cli-service': 5.0.8(vue@3.4.21)
|
||||
'@vue/cli-service': 5.0.8(lodash@4.17.21)(vue@3.4.21)
|
||||
'@vue/cli-shared-utils': 5.0.8
|
||||
eslint: 7.32.0
|
||||
eslint-webpack-plugin: 3.2.0(eslint@7.32.0)(webpack@5.91.0)
|
||||
|
|
@ -2105,7 +2142,7 @@ packages:
|
|||
peerDependencies:
|
||||
'@vue/cli-service': ^3.0.0 || ^4.0.0 || ^5.0.0-0
|
||||
dependencies:
|
||||
'@vue/cli-service': 5.0.8(vue@3.4.21)
|
||||
'@vue/cli-service': 5.0.8(lodash@4.17.21)(vue@3.4.21)
|
||||
'@vue/cli-shared-utils': 5.0.8
|
||||
transitivePeerDependencies:
|
||||
- encoding
|
||||
|
|
@ -2116,10 +2153,10 @@ packages:
|
|||
peerDependencies:
|
||||
'@vue/cli-service': ^3.0.0 || ^4.0.0 || ^5.0.0-0
|
||||
dependencies:
|
||||
'@vue/cli-service': 5.0.8(vue@3.4.21)
|
||||
'@vue/cli-service': 5.0.8(lodash@4.17.21)(vue@3.4.21)
|
||||
dev: true
|
||||
|
||||
/@vue/cli-service@5.0.8(vue@3.4.21):
|
||||
/@vue/cli-service@5.0.8(lodash@4.17.21)(vue@3.4.21):
|
||||
resolution: {integrity: sha512-nV7tYQLe7YsTtzFrfOMIHc5N2hp5lHG2rpYr0aNja9rNljdgcPZLyQRb2YRivTHqTv7lI962UXFURcpStHgyFw==}
|
||||
engines: {node: ^12.0.0 || >= 14.0.0}
|
||||
hasBin: true
|
||||
|
|
@ -2158,8 +2195,8 @@ packages:
|
|||
'@vue/cli-plugin-router': 5.0.8(@vue/cli-service@5.0.8)
|
||||
'@vue/cli-plugin-vuex': 5.0.8(@vue/cli-service@5.0.8)
|
||||
'@vue/cli-shared-utils': 5.0.8
|
||||
'@vue/component-compiler-utils': 3.3.0
|
||||
'@vue/vue-loader-v15': /vue-loader@15.11.1(css-loader@6.11.0)(webpack@5.91.0)
|
||||
'@vue/component-compiler-utils': 3.3.0(lodash@4.17.21)
|
||||
'@vue/vue-loader-v15': /vue-loader@15.11.1(css-loader@6.11.0)(lodash@4.17.21)(webpack@5.91.0)
|
||||
'@vue/web-component-wrapper': 1.3.0
|
||||
acorn: 8.11.3
|
||||
acorn-walk: 8.3.2
|
||||
|
|
@ -2329,10 +2366,10 @@ packages:
|
|||
'@vue/compiler-dom': 3.4.21
|
||||
'@vue/shared': 3.4.21
|
||||
|
||||
/@vue/component-compiler-utils@3.3.0:
|
||||
/@vue/component-compiler-utils@3.3.0(lodash@4.17.21):
|
||||
resolution: {integrity: sha512-97sfH2mYNU+2PzGrmK2haqffDpVASuib9/w2/noxiFi31Z54hW+q3izKQXXQZSNhtiUpAI36uSuYepeBe4wpHQ==}
|
||||
dependencies:
|
||||
consolidate: 0.15.1
|
||||
consolidate: 0.15.1(lodash@4.17.21)
|
||||
hash-sum: 1.0.2
|
||||
lru-cache: 4.1.5
|
||||
merge-source-map: 1.1.0
|
||||
|
|
@ -2398,6 +2435,10 @@ packages:
|
|||
- whiskers
|
||||
dev: true
|
||||
|
||||
/@vue/devtools-api@6.6.1:
|
||||
resolution: {integrity: sha512-LgPscpE3Vs0x96PzSSB4IGVSZXZBZHpfxs+ZA1d+VEPwHdOXowy/Y2CsvCAIFrf+ssVU1pD1jidj505EpUnfbA==}
|
||||
dev: false
|
||||
|
||||
/@vue/reactivity@3.4.21:
|
||||
resolution: {integrity: sha512-UhenImdc0L0/4ahGCyEzc/pZNwVgcglGy9HVzJ1Bq2Mm9qXOpP8RyNTjookw/gOCUlXSEtuZ2fUg5nrHcoqJcw==}
|
||||
dependencies:
|
||||
|
|
@ -2432,6 +2473,31 @@ packages:
|
|||
resolution: {integrity: sha512-Iu8Tbg3f+emIIMmI2ycSI8QcEuAUgPTgHwesDU1eKMLE4YC/c/sFbGc70QgMq31ijRftV0R7vCm9co6rldCeOA==}
|
||||
dev: true
|
||||
|
||||
/@vueuse/core@9.13.0(vue@3.4.21):
|
||||
resolution: {integrity: sha512-pujnclbeHWxxPRqXWmdkKV5OX4Wk4YeK7wusHqRwU0Q7EFusHoqNA/aPhB6KCh9hEqJkLAJo7bb0Lh9b+OIVzw==}
|
||||
dependencies:
|
||||
'@types/web-bluetooth': 0.0.16
|
||||
'@vueuse/metadata': 9.13.0
|
||||
'@vueuse/shared': 9.13.0(vue@3.4.21)
|
||||
vue-demi: 0.14.7(vue@3.4.21)
|
||||
transitivePeerDependencies:
|
||||
- '@vue/composition-api'
|
||||
- vue
|
||||
dev: false
|
||||
|
||||
/@vueuse/metadata@9.13.0:
|
||||
resolution: {integrity: sha512-gdU7TKNAUVlXXLbaF+ZCfte8BjRJQWPCa2J55+7/h+yDtzw3vOoGQDRXzI6pyKyo6bXFT5/QoPE4hAknExjRLQ==}
|
||||
dev: false
|
||||
|
||||
/@vueuse/shared@9.13.0(vue@3.4.21):
|
||||
resolution: {integrity: sha512-UrnhU+Cnufu4S6JLCPZnkWh0WwZGUp72ktOF2DFptMlOs3TOdVv8xJN53zhHGARmVOsz5KqOls09+J1NR6sBKw==}
|
||||
dependencies:
|
||||
vue-demi: 0.14.7(vue@3.4.21)
|
||||
transitivePeerDependencies:
|
||||
- '@vue/composition-api'
|
||||
- vue
|
||||
dev: false
|
||||
|
||||
/@webassemblyjs/ast@1.12.1:
|
||||
resolution: {integrity: sha512-EKfMUOPRRUTy5UII4qJDGPpqfwjOmZ5jeGFwid9mnoqIFK+e0vqoi1qH56JpmZSzEL53jKnNzScdmftJyG5xWg==}
|
||||
dependencies:
|
||||
|
|
@ -2710,6 +2776,10 @@ packages:
|
|||
engines: {node: '>=8'}
|
||||
dev: true
|
||||
|
||||
/async-validator@4.2.5:
|
||||
resolution: {integrity: sha512-7HhHjtERjqlNbZtqNqy2rckN/SpOOlmDliet+lP7k+eKZEjPk3DgyeU9lIXLdeLz0uBbbVp+9Qdow9wJWgwwfg==}
|
||||
dev: false
|
||||
|
||||
/async@2.6.4:
|
||||
resolution: {integrity: sha512-mzo5dfJYwAn29PeiJ0zvwTo04zj8HDJj0Mn8TD7sno7q12prdbnasKJHhkm2c1LgrhlJ0teaea8860oxi51mGA==}
|
||||
dependencies:
|
||||
|
|
@ -3164,7 +3234,7 @@ packages:
|
|||
engines: {node: '>=0.8'}
|
||||
dev: true
|
||||
|
||||
/consolidate@0.15.1:
|
||||
/consolidate@0.15.1(lodash@4.17.21):
|
||||
resolution: {integrity: sha512-DW46nrsMJgy9kqAbPt5rKaCr7uFtpo4mSUvLHIUbJEjm0vo+aY5QLwBUq3FK4tRnJr/X0Psc0C4jf/h+HtXSMw==}
|
||||
engines: {node: '>= 0.10.0'}
|
||||
deprecated: Please upgrade to consolidate v1.0.0+ as it has been modernized with several long-awaited fixes implemented. Maintenance is supported by Forward Email at https://forwardemail.net ; follow/watch https://github.com/ladjs/consolidate for updates and release changelog
|
||||
|
|
@ -3331,6 +3401,7 @@ packages:
|
|||
optional: true
|
||||
dependencies:
|
||||
bluebird: 3.7.2
|
||||
lodash: 4.17.21
|
||||
dev: true
|
||||
|
||||
/content-disposition@0.5.4:
|
||||
|
|
@ -3780,6 +3851,31 @@ packages:
|
|||
/electron-to-chromium@1.4.730:
|
||||
resolution: {integrity: sha512-oJRPo82XEqtQAobHpJIR3zW5YO3sSRRkPz2an4yxi1UvqhsGm54vR/wzTFV74a3soDOJ8CKW7ajOOX5ESzddwg==}
|
||||
|
||||
/element-plus@2.6.3(vue@3.4.21):
|
||||
resolution: {integrity: sha512-U4L/mr+1r+EmAUYUHrs0V/8hHMdBGP07rPymSC72LZCN4jK1UwygQYICegTQ5us4mxeqBvW6wfoEfo003fwCqw==}
|
||||
peerDependencies:
|
||||
vue: ^3.2.0
|
||||
dependencies:
|
||||
'@ctrl/tinycolor': 3.6.1
|
||||
'@element-plus/icons-vue': 2.3.1(vue@3.4.21)
|
||||
'@floating-ui/dom': 1.6.3
|
||||
'@popperjs/core': /@sxzz/popperjs-es@2.11.7
|
||||
'@types/lodash': 4.17.0
|
||||
'@types/lodash-es': 4.17.12
|
||||
'@vueuse/core': 9.13.0(vue@3.4.21)
|
||||
async-validator: 4.2.5
|
||||
dayjs: 1.11.10
|
||||
escape-html: 1.0.3
|
||||
lodash: 4.17.21
|
||||
lodash-es: 4.17.21
|
||||
lodash-unified: 1.0.3(@types/lodash-es@4.17.12)(lodash-es@4.17.21)(lodash@4.17.21)
|
||||
memoize-one: 6.0.0
|
||||
normalize-wheel-es: 1.2.0
|
||||
vue: 3.4.21
|
||||
transitivePeerDependencies:
|
||||
- '@vue/composition-api'
|
||||
dev: false
|
||||
|
||||
/emoji-regex@8.0.0:
|
||||
resolution: {integrity: sha512-MSjYzcWNOA0ewAHpz0MxpYFvwg6yjy1NG3xteoqz644VCo/RPgnr1/GGt+ic3iJTzQ8Eu3TdM14SawnVUmGE6A==}
|
||||
dev: true
|
||||
|
|
@ -3856,7 +3952,6 @@ packages:
|
|||
|
||||
/escape-html@1.0.3:
|
||||
resolution: {integrity: sha512-NiSupZ4OeuGwr68lGIeym/ksIZMJodUGOSCZ/FSnTxcrekbvqrgdUxlJOMpijaKZVjAJrWrGs/6Jy8OMuyj9ow==}
|
||||
dev: true
|
||||
|
||||
/escape-string-regexp@1.0.5:
|
||||
resolution: {integrity: sha512-vbRorB5FUQWvla16U8R/qgaFIya2qGzwDrNmCZuYKrbdSUMG6I1ZCGQRefkRVhuOkIGVne7BQ35DSfo1qvJqFg==}
|
||||
|
|
@ -5016,6 +5111,18 @@ packages:
|
|||
resolution: {integrity: sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw==}
|
||||
dev: false
|
||||
|
||||
/lodash-unified@1.0.3(@types/lodash-es@4.17.12)(lodash-es@4.17.21)(lodash@4.17.21):
|
||||
resolution: {integrity: sha512-WK9qSozxXOD7ZJQlpSqOT+om2ZfcT4yO+03FuzAHD0wF6S0l0090LRPDx3vhTTLZ8cFKpBn+IOcVXK6qOcIlfQ==}
|
||||
peerDependencies:
|
||||
'@types/lodash-es': '*'
|
||||
lodash: '*'
|
||||
lodash-es: '*'
|
||||
dependencies:
|
||||
'@types/lodash-es': 4.17.12
|
||||
lodash: 4.17.21
|
||||
lodash-es: 4.17.21
|
||||
dev: false
|
||||
|
||||
/lodash.debounce@4.0.8:
|
||||
resolution: {integrity: sha512-FT1yDzDYEoYWhnSGnpE/4Kj1fLZkDFyqRb7fNt6FdYOSxlUWAtp42Eh6Wb0rGIv/m9Bgo7x4GhQbm5Ys4SG5ow==}
|
||||
dev: true
|
||||
|
|
@ -5050,7 +5157,6 @@ packages:
|
|||
|
||||
/lodash@4.17.21:
|
||||
resolution: {integrity: sha512-v2kDEe57lecTulaDIuNTPy3Ry4gLGJ6Z1O3vE1krgXZNrsQ+LFTGHVxVjcXPs17LhbZVGedAJv8XZ1tvj5FvSg==}
|
||||
dev: true
|
||||
|
||||
/log-symbols@4.1.0:
|
||||
resolution: {integrity: sha512-8XPvpAA8uyhfteu8pIvQxpJZ7SYYdpUivZpGy6sFsBuKRY/7rQGavedeB8aK+Zkyq6upMFVL/9AW6vOYzfRyLg==}
|
||||
|
|
@ -5129,6 +5235,10 @@ packages:
|
|||
fs-monkey: 1.0.5
|
||||
dev: true
|
||||
|
||||
/memoize-one@6.0.0:
|
||||
resolution: {integrity: sha512-rkpe71W0N0c0Xz6QD0eJETuWAJGnJ9afsl1srmwPrI+yBCkge5EycXXbYRyvL29zZVUWQCY7InPRCv3GDXuZNw==}
|
||||
dev: false
|
||||
|
||||
/merge-descriptors@1.0.1:
|
||||
resolution: {integrity: sha512-cCi6g3/Zr1iqQi6ySbseM1Xvooa98N0w31jzUYrXPX2xqObmFGHJ0tQ5u74H3mVh7wLouTseZyYIq39g8cNp1w==}
|
||||
dev: true
|
||||
|
|
@ -5344,6 +5454,10 @@ packages:
|
|||
engines: {node: '>=10'}
|
||||
dev: true
|
||||
|
||||
/normalize-wheel-es@1.2.0:
|
||||
resolution: {integrity: sha512-Wj7+EJQ8mSuXr2iWfnujrimU35R2W4FAErEyTmJoJ7ucwTn2hOUSsRehMb5RSYkxXGTM7Y9QpvPmp++w5ftoJw==}
|
||||
dev: false
|
||||
|
||||
/npm-run-path@2.0.2:
|
||||
resolution: {integrity: sha512-lJxZYlT4DW/bRUtFh1MQIWqmLwQfAxnqWG4HhEdjMlkrJYnJn0Jrr2u3mgxqaWsdiBc76TYkTG/mhrnYTuzfHw==}
|
||||
engines: {node: '>=4'}
|
||||
|
|
@ -6924,6 +7038,21 @@ packages:
|
|||
engines: {node: '>= 0.8'}
|
||||
dev: true
|
||||
|
||||
/vue-demi@0.14.7(vue@3.4.21):
|
||||
resolution: {integrity: sha512-EOG8KXDQNwkJILkx/gPcoL/7vH+hORoBaKgGe+6W7VFMvCYJfmF2dGbvgDroVnI8LU7/kTu8mbjRZGBU1z9NTA==}
|
||||
engines: {node: '>=12'}
|
||||
hasBin: true
|
||||
requiresBuild: true
|
||||
peerDependencies:
|
||||
'@vue/composition-api': ^1.0.0-rc.1
|
||||
vue: ^3.0.0-0 || ^2.6.0
|
||||
peerDependenciesMeta:
|
||||
'@vue/composition-api':
|
||||
optional: true
|
||||
dependencies:
|
||||
vue: 3.4.21
|
||||
dev: false
|
||||
|
||||
/vue-eslint-parser@8.3.0(eslint@7.32.0):
|
||||
resolution: {integrity: sha512-dzHGG3+sYwSf6zFBa0Gi9ZDshD7+ad14DGOdTLjruRVgZXe2J+DcZ9iUhyR48z5g1PqRa20yt3Njna/veLJL/g==}
|
||||
engines: {node: ^12.22.0 || ^14.17.0 || >=16.0.0}
|
||||
|
|
@ -6946,7 +7075,7 @@ packages:
|
|||
resolution: {integrity: sha512-BXq3jwIagosjgNVae6tkHzzIk6a8MHFtzAdwhnV5VlvPTFxDCvIttgSiHWjdGoTJvXtmRu5HacExfdarRcFhog==}
|
||||
dev: true
|
||||
|
||||
/vue-loader@15.11.1(css-loader@6.11.0)(webpack@5.91.0):
|
||||
/vue-loader@15.11.1(css-loader@6.11.0)(lodash@4.17.21)(webpack@5.91.0):
|
||||
resolution: {integrity: sha512-0iw4VchYLePqJfJu9s62ACWUXeSqM30SQqlIftbYWM3C+jpPcEHKSPUZBLjSF9au4HTHQ/naF6OGnO3Q/qGR3Q==}
|
||||
peerDependencies:
|
||||
'@vue/compiler-sfc': ^3.0.8
|
||||
|
|
@ -6965,7 +7094,7 @@ packages:
|
|||
vue-template-compiler:
|
||||
optional: true
|
||||
dependencies:
|
||||
'@vue/component-compiler-utils': 3.3.0
|
||||
'@vue/component-compiler-utils': 3.3.0(lodash@4.17.21)
|
||||
css-loader: 6.11.0(webpack@5.91.0)
|
||||
hash-sum: 1.0.2
|
||||
loader-utils: 1.4.2
|
||||
|
|
@ -7047,6 +7176,15 @@ packages:
|
|||
webpack: 5.91.0
|
||||
dev: true
|
||||
|
||||
/vue-router@4.3.0(vue@3.4.21):
|
||||
resolution: {integrity: sha512-dqUcs8tUeG+ssgWhcPbjHvazML16Oga5w34uCUmsk7i0BcnskoLGwjpa15fqMr2Fa5JgVBrdL2MEgqz6XZ/6IQ==}
|
||||
peerDependencies:
|
||||
vue: ^3.2.0
|
||||
dependencies:
|
||||
'@vue/devtools-api': 6.6.1
|
||||
vue: 3.4.21
|
||||
dev: false
|
||||
|
||||
/vue-style-loader@4.1.3:
|
||||
resolution: {integrity: sha512-sFuh0xfbtpRlKfm39ss/ikqs9AbKCoXZBpHeVZ8Tx650o0k0q/YCM7FRvigtxpACezfq6af+a7JeqVTWvncqDg==}
|
||||
dependencies:
|
||||
|
|
|
|||
20
src/App.vue
20
src/App.vue
|
|
@ -1,14 +1,17 @@
|
|||
<template>
|
||||
<Lession06 msg="Welcome to Your App"/>
|
||||
<TargetCom />
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import Lession01 from './components/Lession01.vue'
|
||||
import Lession02 from './components/Lession02.vue'
|
||||
import Lession03 from './components/Lession03.vue'
|
||||
import Lession04 from './components/Lession04.vue'
|
||||
import Lession05 from './components/Lession05.vue'
|
||||
import Lession06 from './components/Lession06.vue'
|
||||
// import Lession01 from './components/Lession01.vue'
|
||||
// import Lession02 from './components/Lession02.vue'
|
||||
// import Lession03 from './components/Lession03.vue'
|
||||
// import Lession04 from './components/Lession04.vue'
|
||||
// import Lession05 from './components/Lession05.vue'
|
||||
// import Lession06 from './components/Lession06.vue'
|
||||
// import TargetCom from './components/Lession07Layers.vue'
|
||||
|
||||
import TargetCom from './views/Layout.vue'
|
||||
|
||||
import "@arcgis/core/assets/esri/themes/light/main.css";
|
||||
import esriConfig from "@arcgis/core/config.js";
|
||||
|
|
@ -18,8 +21,7 @@ esriConfig.apiKey = "AAPK1cfe97dcfec94638878da15e4491bde6bxFKMuZg_LW_d6b4qca-QdR
|
|||
export default {
|
||||
name: 'App',
|
||||
components: {
|
||||
Lession01,
|
||||
Lession06
|
||||
TargetCom
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1,9 +1,6 @@
|
|||
<template>
|
||||
<div class="hello">
|
||||
<div id="viewDiv"></div>
|
||||
<div class="btn-box">
|
||||
<calcite-button @click="goto"> goTo</calcite-button>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
|
|
@ -15,6 +12,11 @@ import WebMap from "@arcgis/core/WebMap.js";
|
|||
import { toRaw } from "vue"
|
||||
import "@esri/calcite-components/dist/components/calcite-button";
|
||||
import Search from "@arcgis/core/widgets/Search.js";
|
||||
import Graphic from "@arcgis/core/Graphic.js";
|
||||
import FeatureLayer from "@arcgis/core/layers/FeatureLayer.js";
|
||||
import GraphicsLayer from "@arcgis/core/layers/GraphicsLayer.js";
|
||||
import CSVLayer from "@arcgis/core/layers/CSVLayer.js";
|
||||
|
||||
export default {
|
||||
name: 'HelloWorld',
|
||||
data(){
|
||||
|
|
@ -45,7 +47,7 @@ export default {
|
|||
// });
|
||||
// console.log(view)
|
||||
|
||||
// 通过 web map(2D) 或 web scene(3D) 创建 map 实例
|
||||
// 创建Map的第二种方式，通过 web map(2D) 或 web scene(3D) 创建 map 实例
|
||||
// Web maps和Web scenes是JSON格式构造的，包含map或scene的basemap、layers/
|
||||
// layer styling、popups、legends、labels等设置，它们是通过ArcGIS Online map Viewer或
|
||||
// ArcGIS Online scene viewer交互式的创建，ArcGIS Online或ArcGIS Enterprise会为它们分
|
||||
|
|
@ -86,54 +88,221 @@ export default {
|
|||
});
|
||||
// 存进去的时候会被代理
|
||||
this.view = view;
|
||||
// setTimeout(()=>{
|
||||
// view.goTo( // go to point with a custom animation duration
|
||||
// { center: [113.896193, 22.538811] },
|
||||
// { duration: 5000 }
|
||||
// );
|
||||
// },5000)
|
||||
|
||||
// view交互
|
||||
// 这也是很重要的，view还负责用户交互和展示气泡弹窗popups，view提供多种类型的事件处理方法，
|
||||
// 如鼠标点击、键盘输入、触屏交互、手柄控制等其他设备的输入。
|
||||
// 当用户点击地图时，默认行为是展示气泡弹窗popups（如果图层有预先配置的话），这个行为也可以被下列代码监听到点击事件
|
||||
// 使用`hitTest()`方法，找到用户点击的要素features
|
||||
// Layers是Map中的数据集合。layers数据可以是在客户端创建的，
|
||||
// 也可以是服务端的（ArcGIS Online|ArcGIS Enterprise|其他服务器）
|
||||
// ArcGIS API 有很多图层Layer类来展示数据，它们都继承至`Layer`,不同的数据有与之对应的Layer类。
|
||||
/*
|
||||
- FeatureLayer: 展示同一几何类型的地理几何要素数据
|
||||
- GraphicLayer: 展示独立的地理几何要素或文本注记
|
||||
- CSVLayer/KMLLayer/GeoJSONLayer: 展示符合文件格式的数据
|
||||
- TileLayer/VectorTileLayer: 展示basemaps和其它瓦片数据集（矢量瓦片）
|
||||
- MapImageLayer: 动态渲染ArcGIS Server中的图层服务
|
||||
- ImageryLayer:展示遥感卫星或其它的图片数据
|
||||
*/
|
||||
|
||||
view.popupEnabled = false; // Disable the default popup behavior
|
||||
|
||||
view.on("click", function(event) { // Listen for the click event
|
||||
view.hitTest(event).then(function (hitTestResults){ // Search for features where the user clicked
|
||||
if(hitTestResults.results) {
|
||||
view.openPopup({ // open a popup to show some of the results
|
||||
location: event.mapPoint,
|
||||
title: "Hit Test Results",
|
||||
content: hitTestResults.results.length + "Features Found"
|
||||
});
|
||||
// this.addFeatureLayer(webScene);
|
||||
// this.addGraphicsLayer(webScene);
|
||||
this.addCSVLayer(webScene);
|
||||
},
|
||||
addFeatureLayer(map){
|
||||
/**
|
||||
* FeatureLayer是引用一个具有相同几何类型geometry和属性attributes字段的地理几何要素。
|
||||
* 图层的数据可以从内存中获取，也可以通过REST请求从服务端（ArcGIS Online|ArcGIS Enterprise）获取
|
||||
* FeatureLayer 在客户端和服务端都进行了高度优化，以实现快速显示，并支持各种其它功能，包括：
|
||||
* - 用户交互和气泡弹窗展示
|
||||
* - 客户端过滤、查询和分析
|
||||
* - 在线编辑
|
||||
* - 数据驱动可视化
|
||||
* ArcGIS Developers和ArcGIS Online提供导入数据（如：GeoJSON|Excel|CSV|file geodatabases|shapefiles）的工具,
|
||||
* 导入数据创建要素图层实例，作为服务端数据源（ArcGIS Online）
|
||||
*/
|
||||
// 方式一：直接在客户端内存中创建。
|
||||
let places = [
|
||||
{
|
||||
"id": 1,
|
||||
"address": "200 N Spring St, Los Angeles, CA 90012",
|
||||
"longitude": 113.305,
|
||||
"latitude": 23.185665
|
||||
},
|
||||
{
|
||||
"id": 2,
|
||||
"address": "419 N Fairfax Ave, Los Angeles, CA 90036",
|
||||
"longitude": 113.315,
|
||||
"latitude": 23.185665
|
||||
}
|
||||
]
|
||||
// 第一步是将每个位置转换为具有属性attributes和几何属性geometry的图形对象Graphic。
|
||||
const graphics = places.map((place) => {
|
||||
// 一个Graphic由 geometry、symbol、attributes、template组成
|
||||
return new Graphic({
|
||||
attributes: {
|
||||
ObjectId: place.id,
|
||||
address: place.address
|
||||
},
|
||||
geometry: {
|
||||
type: "point",
|
||||
longitude: place.longitude,
|
||||
latitude: place.latitude
|
||||
},
|
||||
symbol: {
|
||||
// autocasts as new SimpleMarkerSymbol()
|
||||
type: "simple-marker",
|
||||
color: [226, 119, 40],
|
||||
outline: {
|
||||
// autocasts as new SimpleLineSymbol()
|
||||
color: [255, 255, 255],
|
||||
width: 2
|
||||
}
|
||||
}
|
||||
})
|
||||
});
|
||||
});
|
||||
|
||||
// 添加微件和UI组件到view中
|
||||
// view也是一个容纳弹出层微件和HTML元素的容器。`view.ui`提供一个DefaultUI容器，用来展示默认的微件。
|
||||
// 另外widgets微件和HTML元素可以通过 `view.ui.add`方法添加到view中。
|
||||
var searchWidget = new Search({
|
||||
view: view
|
||||
// 第二步是创建FeatureLayer，实际创建一个FeatureLayer对象，创建时至少指定objectIdField、fields、renderer和source属性。
|
||||
/**
|
||||
* - source:是用来创建要素的Graphic对象集合
|
||||
* - renderer：用来展示要素符号的渲染器
|
||||
* - objectIdField：要素标识的属性字段名称（id）
|
||||
* - fields:一个JSON对象，属性
|
||||
* - popup Template:要素的信息弹窗模板
|
||||
*/
|
||||
const featureLayer = new FeatureLayer({
|
||||
source: graphics,
|
||||
renderer: {
|
||||
type: "simple", // autocasts as new SimpleRenderer()
|
||||
symbol: { // autocasts as new SimpleMarkerSymbol()
|
||||
type: "simple-marker",
|
||||
color: "#102A44",
|
||||
outline: { // autocasts as new SimpleLineSymbol()
|
||||
color: "#598DD8",
|
||||
width: 2
|
||||
}
|
||||
}
|
||||
},
|
||||
popupTemplate: { // autocasts as new PopupTemplate()
|
||||
title: "Places in Los Angeles",
|
||||
content: [{
|
||||
type: "fields",
|
||||
fieldInfos: [
|
||||
{
|
||||
fieldName: "address",
|
||||
label: "Address",
|
||||
visible: true
|
||||
}
|
||||
]
|
||||
}]
|
||||
},
|
||||
objectIdField: "ObjectID", // This must be defined when creating a layer from `Graphic` objects
|
||||
fields: [
|
||||
{
|
||||
name: "ObjectID",
|
||||
alias: "ObjectID",
|
||||
type: "oid"
|
||||
},
|
||||
{
|
||||
name: "address",
|
||||
alias: "address",
|
||||
type: "string"
|
||||
}
|
||||
]
|
||||
});
|
||||
|
||||
// Add the search widget to the top right corner of the view
|
||||
view.ui.add(searchWidget, {
|
||||
position: "top-right"
|
||||
map.layers.add(featureLayer);
|
||||
|
||||
|
||||
//方式二：引用服务端的数据源，一份洛杉矶的点数据
|
||||
var layer = new FeatureLayer({
|
||||
url: "https://services3.arcgis.com/GVgbJbqm8hXASVYi/arcgis/rest/services/Trailheads/FeatureServer/0"
|
||||
});
|
||||
map.layers.add(layer);
|
||||
|
||||
},
|
||||
goto(e){
|
||||
console.log("------------",this.view)
|
||||
// 拿到的是一个代理对象，调用方法是会报错因为代理对象没有返回实际的值，
|
||||
// 通过toRaw方法将从reactive对象中获取到原始数据
|
||||
toRaw(this.view).goTo( // go to point with a custom animation duration
|
||||
{ center: [113.896193, 22.538811] },
|
||||
{ duration: 5000 }
|
||||
);
|
||||
addGraphicsLayer(map){
|
||||
/**
|
||||
* Graphics 通常用来添加文本、图形形状、images图标.
|
||||
* 创建Graphics layer最简单的方式就是创建一个graphic数组，传递给GraphicsLayer对象的graphics属性。
|
||||
* 每个Graphic都包含下列四个属性：
|
||||
* - attribute：k-v键值对，用来存储要素的属性信息
|
||||
* - geometry：提供要素的几何位置信息，可以是Point、Polyline、Polygon对象
|
||||
* - popupTemplate：气泡弹窗的模板
|
||||
* - symbol：样式符号
|
||||
*/
|
||||
var pointGraphic = new Graphic({
|
||||
attributes: {
|
||||
name: "LA City Hall",
|
||||
address: "200 N Spring St, Los Angeles, CA 90012"
|
||||
},
|
||||
geometry: {
|
||||
type: "point", // autocasts as new Point()
|
||||
longitude: 113.305,
|
||||
latitude: 23.185665
|
||||
},
|
||||
symbol: {
|
||||
type: "simple-marker", // autocasts as new SimpleMarkerSymbol()
|
||||
color: [ 226, 119, 40 ],
|
||||
outline: { // autocasts as SimpleLineSymbol()
|
||||
color: [ 255, 255, 255 ],
|
||||
width: 2
|
||||
}
|
||||
},
|
||||
popupTemplate: { // autocasts as new PopupTemplate()
|
||||
title: "Places in Los Angeles",
|
||||
content: [{
|
||||
type: "fields",
|
||||
fieldInfos: [
|
||||
{
|
||||
fieldName: "name",
|
||||
label: "Name",
|
||||
visible: true
|
||||
},
|
||||
{
|
||||
fieldName: "address",
|
||||
label: "Address",
|
||||
visible: true
|
||||
}
|
||||
]
|
||||
}]
|
||||
},
|
||||
});
|
||||
|
||||
var graphicsLayer = new GraphicsLayer({
|
||||
graphics: [ pointGraphic ]
|
||||
});
|
||||
|
||||
map.layers.add(graphicsLayer);
|
||||
|
||||
|
||||
},
|
||||
addCSVLayer(map){
|
||||
/**
|
||||
* CSVLayer是基于CSV文件(.csv|.txt)解析的点图层，文件中必须要有代表点坐标的数据列。
|
||||
* 其中坐标数据的坐标系必须是WGS84的。
|
||||
*
|
||||
*/
|
||||
// 方式一：引用服务端数据源
|
||||
var earthquakesLayer = new CSVLayer({
|
||||
url: "https://earthquake.usgs.gov/earthquakes/feed/v1.0/summary/2.5_week.csv",
|
||||
copyright: "USGS Earthquakes",
|
||||
latitudeField: "latitude", // Defaults to "latitude"
|
||||
longitudeField: "longitude" // Defaults to "longitude"
|
||||
});
|
||||
|
||||
// map.layers.add(earthquakesLayer)
|
||||
|
||||
// 方式二：引用内存中的数据，通过一个blob URL
|
||||
const csv = `name|year|latitude|Longitude
|
||||
aspen|2020|40.418|20.553
|
||||
birch|2018|-118.123|35.888`;
|
||||
|
||||
const blob = new Blob([csv], {
|
||||
type: "plain/text"
|
||||
});
|
||||
let url = URL.createObjectURL(blob);
|
||||
|
||||
const layer = new CSVLayer({
|
||||
url: url
|
||||
});
|
||||
map.layers.add(layer)
|
||||
}
|
||||
},
|
||||
mounted(){
|
||||
|
|
|
|||
|
|
@ -1,4 +1,10 @@
|
|||
import { createApp } from 'vue'
|
||||
import App from './App.vue'
|
||||
|
||||
createApp(App).mount('#app')
|
||||
import ElementPlus from 'element-plus'
|
||||
import 'element-plus/dist/index.css'
|
||||
import reouter from "./routers/index"
|
||||
createApp(App)
|
||||
.use(reouter)
|
||||
.use(ElementPlus)
|
||||
.mount('#app')
|
||||
|
|
|
|||
|
|
@ -0,0 +1,5 @@
|
|||
import TargetCom from '../components/Lession07Layers.vue'
|
||||
const constRoutes = [
|
||||
{ path: '/', component: TargetCom },
|
||||
]
|
||||
export default constRoutes
|
||||
|
|
@ -0,0 +1,10 @@
|
|||
import { createRouter, createWebHashHistory } from 'vue-router'
|
||||
import constRoutes from './constRoutes'
|
||||
|
||||
const router = createRouter({
|
||||
// 4. 内部提供了 history 模式的实现。为了简单起见，我们在这里使用 hash 模式。
|
||||
history: createWebHashHistory(),
|
||||
routes: constRoutes, // `routes: routes` 的缩写
|
||||
})
|
||||
|
||||
export default router
|
||||
|
|
@ -0,0 +1,32 @@
|
|||
<template>
|
||||
<div class="common-layout">
|
||||
<el-container>
|
||||
<el-header class="layout-header">Header</el-header>
|
||||
<el-container>
|
||||
<el-aside width="200px" class="layout-aside">Aside</el-aside>
|
||||
<el-main class="layout-main">
|
||||
<router-view></router-view>
|
||||
</el-main>
|
||||
</el-container>
|
||||
</el-container>
|
||||
</div>
|
||||
</template>
|
||||
<script setup>
|
||||
import { ref } from 'vue'
|
||||
const count = ref(0)
|
||||
</script>
|
||||
<style scoped>
|
||||
.common-layout,.el-container{
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
}
|
||||
.layout-header{
|
||||
background-color: aqua;
|
||||
}
|
||||
.layout-aside{
|
||||
background-color: burlywood;
|
||||
}
|
||||
.layout-main{
|
||||
background-color: aliceblue;
|
||||
}
|
||||
</style>
|
||||
|
|
@ -1,5 +1,13 @@
|
|||
const { defineConfig } = require('@vue/cli-service')
|
||||
const path = require('path')
|
||||
function resolve(dir){
|
||||
return path.join(__dirname,dir)
|
||||
}
|
||||
module.exports = defineConfig({
|
||||
transpileDependencies: true,
|
||||
lintOnSave:false
|
||||
lintOnSave:false,
|
||||
chainWebpack:(config)=>{
|
||||
config.resolve.alias
|
||||
.set("@",resolve('src'))
|
||||
}
|
||||
})
|
||||
|
|
|
|||
Loading…
Reference in New Issue