@@ -329,7 +329,7 @@ | |||
}, | |||
"@emotion/hash": { | |||
"version": "0.8.0", | |||
"resolved": "https://registry.npmjs.org/@emotion/hash/-/hash-0.8.0.tgz", | |||
"resolved": "https://registry.npmmirror.com/@emotion/hash/-/hash-0.8.0.tgz", | |||
"integrity": "sha512-kBJtf7PH6aWwZ6fka3zQ0p6SBYzx4fl1LoZXE2RrnYST9Xljm7WfKJrU4g/Xr3Beg72MLrp1AWNUmuYJTL7Cow==", | |||
"dev": true | |||
}, | |||
@@ -433,6 +433,55 @@ | |||
"local-pkg": "^0.4.1" | |||
} | |||
}, | |||
"@jridgewell/gen-mapping": { | |||
"version": "0.3.2", | |||
"resolved": "https://registry.npmjs.org/@jridgewell/gen-mapping/-/gen-mapping-0.3.2.tgz", | |||
"integrity": "sha512-mh65xKQAzI6iBcFzwv28KVWSmCkdRBWoOh+bYQGW3+6OZvbbN3TqMGo5hqYxQniRcH9F2VZIoJCm4pa3BPDK/A==", | |||
"dev": true, | |||
"requires": { | |||
"@jridgewell/set-array": "^1.0.1", | |||
"@jridgewell/sourcemap-codec": "^1.4.10", | |||
"@jridgewell/trace-mapping": "^0.3.9" | |||
} | |||
}, | |||
"@jridgewell/resolve-uri": { | |||
"version": "3.1.0", | |||
"resolved": "https://registry.npmjs.org/@jridgewell/resolve-uri/-/resolve-uri-3.1.0.tgz", | |||
"integrity": "sha512-F2msla3tad+Mfht5cJq7LSXcdudKTWCVYUgw6pLFOOHSTtZlj6SWNYAp+AhuqLmWdBO2X5hPrLcu8cVP8fy28w==", | |||
"dev": true | |||
}, | |||
"@jridgewell/set-array": { | |||
"version": "1.1.2", | |||
"resolved": "https://registry.npmjs.org/@jridgewell/set-array/-/set-array-1.1.2.tgz", | |||
"integrity": "sha512-xnkseuNADM0gt2bs+BvhO0p78Mk762YnZdsuzFV018NoG1Sj1SCQvpSqa7XUaTam5vAGasABV9qXASMKnFMwMw==", | |||
"dev": true | |||
}, | |||
"@jridgewell/source-map": { | |||
"version": "0.3.2", | |||
"resolved": "https://registry.npmjs.org/@jridgewell/source-map/-/source-map-0.3.2.tgz", | |||
"integrity": "sha512-m7O9o2uR8k2ObDysZYzdfhb08VuEml5oWGiosa1VdaPZ/A6QyPkAJuwN0Q1lhULOf6B7MtQmHENS743hWtCrgw==", | |||
"dev": true, | |||
"requires": { | |||
"@jridgewell/gen-mapping": "^0.3.0", | |||
"@jridgewell/trace-mapping": "^0.3.9" | |||
} | |||
}, | |||
"@jridgewell/sourcemap-codec": { | |||
"version": "1.4.14", | |||
"resolved": "https://registry.npmjs.org/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.14.tgz", | |||
"integrity": "sha512-XPSJHWmi394fuUuzDnGz1wiKqWfo1yXecHQMRf2l6hztTO+nPru658AyDngaBe7isIxEkRsPR3FZh+s7iVa4Uw==", | |||
"dev": true | |||
}, | |||
"@jridgewell/trace-mapping": { | |||
"version": "0.3.17", | |||
"resolved": "https://registry.npmjs.org/@jridgewell/trace-mapping/-/trace-mapping-0.3.17.tgz", | |||
"integrity": "sha512-MCNzAp77qzKca9+W/+I0+sEpaUnZoeasnghNeVc41VZCEKaCH73Vq3BZZ/SzWIgrqE4H4ceI+p+b6C0mHf9T4g==", | |||
"dev": true, | |||
"requires": { | |||
"@jridgewell/resolve-uri": "3.1.0", | |||
"@jridgewell/sourcemap-codec": "1.4.14" | |||
} | |||
}, | |||
"@juggle/resize-observer": { | |||
"version": "3.4.0", | |||
"resolved": "https://registry.npmjs.org/@juggle/resize-observer/-/resize-observer-3.4.0.tgz", | |||
@@ -655,7 +704,7 @@ | |||
}, | |||
"@types/lodash-es": { | |||
"version": "4.17.6", | |||
"resolved": "https://registry.npmjs.org/@types/lodash-es/-/lodash-es-4.17.6.tgz", | |||
"resolved": "https://registry.npmmirror.com/@types/lodash-es/-/lodash-es-4.17.6.tgz", | |||
"integrity": "sha512-R+zTeVUKDdfoRxpAryaQNRKk3105Rrgx2CFRClIgRGaqDTdjsm8h6IYA8ir584W3ePzkZfst5xIgDwYrlh9HLg==", | |||
"dev": true, | |||
"requires": { | |||
@@ -3315,11 +3364,6 @@ | |||
"integrity": "sha512-1rRqesRFhMO/PRF+G86evnyJkCgaZFOI+Z6kdj15TA18funfoqJXvgPCLSf0SWq3SRfg1j3HlDs8o4s3EGq1oQ==", | |||
"dev": true | |||
}, | |||
"hls.js": { | |||
"version": "1.2.9", | |||
"resolved": "https://registry.npmjs.org/hls.js/-/hls.js-1.2.9.tgz", | |||
"integrity": "sha512-SPjm8ix0xe6cYzwDvdVGh2QvQPDkCYrGWpZu6bRaKNNVyEGWM9uF0pooh/Lqj/g8QBQgPFEx1vHzW8SyMY9rqg==" | |||
}, | |||
"hosted-git-info": { | |||
"version": "2.8.9", | |||
"resolved": "https://registry.npmmirror.com/hosted-git-info/-/hosted-git-info-2.8.9.tgz", | |||
@@ -3825,6 +3869,14 @@ | |||
"resolved": "https://registry.npmmirror.com/json-stringify-pretty-compact/-/json-stringify-pretty-compact-2.0.0.tgz", | |||
"integrity": "sha512-WRitRfs6BGq4q8gTgOy4ek7iPFXjbra0H3PmDLKm2xnZ+Gh1HUhiKGgCZkSPNULlP7mvfu6FV/mOLhCarspADQ==" | |||
}, | |||
"json5": { | |||
"version": "1.0.2", | |||
"resolved": "https://registry.npmjs.org/json5/-/json5-1.0.2.tgz", | |||
"integrity": "sha512-g1MWMLBiz8FKi1e4w0UyVL3w+iJceWAFBAaBnnGKOpNa5f8TLktkbre1+s6oICydWAm+HRUGTmI+//xv2hvXYA==", | |||
"requires": { | |||
"minimist": "^1.2.0" | |||
} | |||
}, | |||
"jsonfile": { | |||
"version": "6.1.0", | |||
"resolved": "https://registry.npmmirror.com/jsonfile/-/jsonfile-6.1.0.tgz", | |||
@@ -3896,23 +3948,13 @@ | |||
"dev": true | |||
}, | |||
"loader-utils": { | |||
"version": "1.4.0", | |||
"resolved": "https://registry.npmmirror.com/loader-utils/-/loader-utils-1.4.0.tgz", | |||
"integrity": "sha512-qH0WSMBtn/oHuwjy/NucEgbx5dbxxnxup9s4PVXJUDHZBQY+s0NWA9rJf53RBnQZxfch7euUui7hpoAPvALZdA==", | |||
"version": "1.4.2", | |||
"resolved": "https://registry.npmjs.org/loader-utils/-/loader-utils-1.4.2.tgz", | |||
"integrity": "sha512-I5d00Pd/jwMD2QCduo657+YM/6L3KZu++pmX9VFncxaxvHcru9jx1lBaFft+r4Mt2jK0Yhp41XlRAihzPxHNCg==", | |||
"requires": { | |||
"big.js": "^5.2.2", | |||
"emojis-list": "^3.0.0", | |||
"json5": "^1.0.1" | |||
}, | |||
"dependencies": { | |||
"json5": { | |||
"version": "1.0.1", | |||
"resolved": "https://registry.npmmirror.com/json5/-/json5-1.0.1.tgz", | |||
"integrity": "sha512-aKS4WQjPenRxiQsC93MNfjx+nbF4PAdYzmd/1JIj8HYzqfbu86beTuNgXDzPknWk0n0uARlyewZo4s++ES36Ow==", | |||
"requires": { | |||
"minimist": "^1.2.0" | |||
} | |||
} | |||
} | |||
}, | |||
"local-pkg": { | |||
@@ -3929,7 +3971,7 @@ | |||
}, | |||
"lodash-es": { | |||
"version": "4.17.21", | |||
"resolved": "https://registry.npmjs.org/lodash-es/-/lodash-es-4.17.21.tgz", | |||
"resolved": "https://registry.npmmirror.com/lodash-es/-/lodash-es-4.17.21.tgz", | |||
"integrity": "sha512-mKnC+QJ9pWVzv+C4/U3rRsHapFfHvQFoFB92e52xeyGMcX6/OlIl78je1u8vePzYZSkkogMPJ2yjxxsb89cxyw==", | |||
"dev": true | |||
}, | |||
@@ -5163,9 +5205,9 @@ | |||
} | |||
}, | |||
"rollup": { | |||
"version": "2.70.1", | |||
"resolved": "https://registry.npmmirror.com/rollup/-/rollup-2.70.1.tgz", | |||
"integrity": "sha512-CRYsI5EuzLbXdxC6RnYhOuRdtz4bhejPMSWjsFLfVM/7w/85n2szZv6yExqUXsBdz5KT8eoubeyDUDjhLHEslA==", | |||
"version": "2.77.3", | |||
"resolved": "https://registry.npmjs.org/rollup/-/rollup-2.77.3.tgz", | |||
"integrity": "sha512-/qxNTG7FbmefJWoeeYJFbHehJ2HNWnjkAFRKzWN/45eNBBF/r8lo992CwcJXEzyVxs5FmfId+vTSTQDb+bxA+g==", | |||
"dev": true, | |||
"requires": { | |||
"fsevents": "~2.3.2" | |||
@@ -5954,14 +5996,14 @@ | |||
"dev": true | |||
}, | |||
"terser": { | |||
"version": "5.12.1", | |||
"resolved": "https://registry.npmmirror.com/terser/-/terser-5.12.1.tgz", | |||
"integrity": "sha512-NXbs+7nisos5E+yXwAD+y7zrcTkMqb0dEJxIGtSKPdCBzopf7ni4odPul2aechpV7EXNvOudYOX2bb5tln1jbQ==", | |||
"version": "5.16.1", | |||
"resolved": "https://registry.npmjs.org/terser/-/terser-5.16.1.tgz", | |||
"integrity": "sha512-xvQfyfA1ayT0qdK47zskQgRZeWLoOQ8JQ6mIgRGVNwZKdQMU+5FkCBjmv4QjcrTzyZquRw2FVtlJSRUmMKQslw==", | |||
"dev": true, | |||
"requires": { | |||
"@jridgewell/source-map": "^0.3.2", | |||
"acorn": "^8.5.0", | |||
"commander": "^2.20.0", | |||
"source-map": "~0.7.2", | |||
"source-map-support": "~0.5.20" | |||
}, | |||
"dependencies": { | |||
@@ -5970,12 +6012,6 @@ | |||
"resolved": "https://registry.npmmirror.com/commander/-/commander-2.20.3.tgz", | |||
"integrity": "sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ==", | |||
"dev": true | |||
}, | |||
"source-map": { | |||
"version": "0.7.3", | |||
"resolved": "https://registry.npmmirror.com/source-map/-/source-map-0.7.3.tgz", | |||
"integrity": "sha512-CkCj6giN3S+n9qrYiBTX5gystlENnRW5jZeNLHpe6aue+SrHcG5VYwujhW9s4dY31mEGsxBDrHR6oI69fTXsaQ==", | |||
"dev": true | |||
} | |||
} | |||
}, | |||
@@ -6014,20 +6050,15 @@ | |||
"thenify": ">= 3.1.0 < 4" | |||
} | |||
}, | |||
"throttle-debounce": { | |||
"version": "3.0.1", | |||
"resolved": "https://registry.npmjs.org/throttle-debounce/-/throttle-debounce-3.0.1.tgz", | |||
"integrity": "sha512-dTEWWNu6JmeVXY0ZYoPuH5cRIwc0MeGbJwah9KUNYSJwommQpCzTySTpEe8Gs1J23aeWEuAobe4Ag7EHVt/LOg==" | |||
}, | |||
"through": { | |||
"version": "2.3.8", | |||
"resolved": "https://registry.npmjs.org/through/-/through-2.3.8.tgz", | |||
"integrity": "sha512-w89qg7PI8wAdvX60bMDP+bFoD5Dvhm9oLheFp5O4a2QF0cSBGsBX4qZmadPMvVqlLJBBci+WqGGOAPvcDeNSVg==" | |||
}, | |||
"tinymce": { | |||
"version": "5.10.5", | |||
"resolved": "https://registry.npmjs.org/tinymce/-/tinymce-5.10.5.tgz", | |||
"integrity": "sha512-nFKtLhmoRtExBxUfv06JlkbQWux5D+d115vxSRAqUmccZdrtpFvOIYwZmikvulLdM9pfEpvO0B+RQ2qFV/+R7w==" | |||
"version": "5.10.7", | |||
"resolved": "https://registry.npmjs.org/tinymce/-/tinymce-5.10.7.tgz", | |||
"integrity": "sha512-9UUjaO0R7FxcFo0oxnd1lMs7H+D0Eh+dDVo5hKbVe1a+VB0nit97vOqlinj+YwgoBDt6/DSCUoWqAYlLI8BLYA==" | |||
}, | |||
"to-arraybuffer": { | |||
"version": "1.0.1", | |||
@@ -6449,16 +6480,35 @@ | |||
} | |||
}, | |||
"vite": { | |||
"version": "2.9.1", | |||
"resolved": "https://registry.npmmirror.com/vite/-/vite-2.9.1.tgz", | |||
"integrity": "sha512-vSlsSdOYGcYEJfkQ/NeLXgnRv5zZfpAsdztkIrs7AZHV8RCMZQkwjo4DS5BnrYTqoWqLoUe1Cah4aVO4oNNqCQ==", | |||
"version": "2.9.15", | |||
"resolved": "https://registry.npmjs.org/vite/-/vite-2.9.15.tgz", | |||
"integrity": "sha512-fzMt2jK4vQ3yK56te3Kqpkaeq9DkcZfBbzHwYpobasvgYmP2SoAr6Aic05CsB4CzCZbsDv4sujX3pkEGhLabVQ==", | |||
"dev": true, | |||
"requires": { | |||
"esbuild": "^0.14.27", | |||
"fsevents": "~2.3.2", | |||
"postcss": "^8.4.12", | |||
"postcss": "^8.4.13", | |||
"resolve": "^1.22.0", | |||
"rollup": "^2.59.0" | |||
"rollup": ">=2.59.0 <2.78.0" | |||
}, | |||
"dependencies": { | |||
"nanoid": { | |||
"version": "3.3.4", | |||
"resolved": "https://registry.npmjs.org/nanoid/-/nanoid-3.3.4.tgz", | |||
"integrity": "sha512-MqBkQh/OHTS2egovRtLk45wEyNXwF+cokD+1YPf9u5VfJiRdAiRwB2froX5Co9Rh20xs4siNPm8naNotSD6RBw==", | |||
"dev": true | |||
}, | |||
"postcss": { | |||
"version": "8.4.20", | |||
"resolved": "https://registry.npmjs.org/postcss/-/postcss-8.4.20.tgz", | |||
"integrity": "sha512-6Q04AXR1212bXr5fh03u8aAwbLxAQNGQ/Q1LNa0VfOI06ZAlhPHtQvE4OIdpj4kLThXilalPnmDSOD65DcHt+g==", | |||
"dev": true, | |||
"requires": { | |||
"nanoid": "^3.3.4", | |||
"picocolors": "^1.0.0", | |||
"source-map-js": "^1.0.2" | |||
} | |||
} | |||
} | |||
}, | |||
"vite-plugin-html": { | |||
@@ -6542,9 +6592,9 @@ | |||
} | |||
}, | |||
"vm2": { | |||
"version": "3.9.10", | |||
"resolved": "https://registry.npmjs.org/vm2/-/vm2-3.9.10.tgz", | |||
"integrity": "sha512-AuECTSvwu2OHLAZYhG716YzwodKCIJxB6u1zG7PgSQwIgAlEaoXH52bxdcvT8GkGjnYK7r7yWDW0m0sOsPuBjQ==", | |||
"version": "3.9.13", | |||
"resolved": "https://registry.npmjs.org/vm2/-/vm2-3.9.13.tgz", | |||
"integrity": "sha512-0rvxpB8P8Shm4wX2EKOiMp7H2zq+HUE/UwodY0pCZXs9IffIKZq6vUti5OgkVCTakKo9e/fgO4X1fkwfjWxE3Q==", | |||
"requires": { | |||
"acorn": "^8.7.0", | |||
"acorn-walk": "^8.2.0" | |||
@@ -6552,7 +6602,7 @@ | |||
}, | |||
"vooks": { | |||
"version": "0.2.12", | |||
"resolved": "https://registry.npmjs.org/vooks/-/vooks-0.2.12.tgz", | |||
"resolved": "https://registry.npmmirror.com/vooks/-/vooks-0.2.12.tgz", | |||
"integrity": "sha512-iox0I3RZzxtKlcgYaStQYKEzWWGAduMmq+jS7OrNdQo1FgGfPMubGL3uGHOU9n97NIvfFDBGnpSvkWyb/NSn/Q==", | |||
"dev": true, | |||
"requires": { | |||
@@ -6594,16 +6644,6 @@ | |||
"@vue/devtools-api": "^6.0.0" | |||
} | |||
}, | |||
"vue3-video-play": { | |||
"version": "1.3.1-beta.6", | |||
"resolved": "https://registry.npmjs.org/vue3-video-play/-/vue3-video-play-1.3.1-beta.6.tgz", | |||
"integrity": "sha512-Olrx2/LNAds7fuor/yX9ZKT9sOcwcfTt2g2YbbCrEaAmZ5Tb0hwBr5z+/CoLwELzzRzXCHPmWWoT0Wm5W/Nwpw==", | |||
"requires": { | |||
"hls.js": "^1.0.10", | |||
"throttle-debounce": "^3.0.1", | |||
"vue": "^3.2.2" | |||
} | |||
}, | |||
"vuedraggable": { | |||
"version": "4.1.0", | |||
"resolved": "https://registry.npmmirror.com/vuedraggable/-/vuedraggable-4.1.0.tgz", |
@@ -24,7 +24,6 @@ | |||
"vite-plugin-svg-icons": "^2.0.1", | |||
"vue": "^3.2.16", | |||
"vue-router": "^4.0.14", | |||
"vue3-video-play": "^1.3.1-beta.6", | |||
"vuedraggable": "^4.1.0" | |||
}, | |||
"devDependencies": { |
@@ -48,7 +48,7 @@ export default { | |||
new Tile({ | |||
visible: true, | |||
source: new XYZ({ | |||
url: 'https://tianditu.t-aaron.com/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=f82bb2fd8115c7fb576a8b2fcf738523' | |||
url: 'https://tianditu.t-aaron.com/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=f634525a82da65f715d168d7ba1899c0' | |||
}) | |||
}) | |||
] |
@@ -72,7 +72,7 @@ export default { | |||
new Tile({ | |||
visible: true, | |||
source: new XYZ({ | |||
url: 'https://tianditu.t-aaron.com/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=f82bb2fd8115c7fb576a8b2fcf738523' | |||
url: 'https://tianditu.t-aaron.com/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=f634525a82da65f715d168d7ba1899c0' | |||
}) | |||
}) | |||
] |
@@ -29,17 +29,12 @@ | |||
<div class="monitorList"> | |||
<div class="innerMonitor"> | |||
<div class="monitorName">机场内部监控</div> | |||
<!-- <img src="../../../assets/images/webScreen.png" @click="videoShowStyle"> --> | |||
<!-- <videoPlay | |||
v-bind="innerMonitorOptions" | |||
style="z-index:1" | |||
/> --> | |||
<!-- <EasyPlayer style="z-index=1" :video-url="innerVideoSrc" /> --> | |||
<easy-player :video-url="innerVideoSrc" live="true" stretch="true" /> | |||
</div> | |||
<div class="innerMonitor"> | |||
<div class="monitorName">机场外部监控</div> | |||
<!-- <img src="../../../assets/images/webScreen.png" @click="outerVideoShowStyle"> --> | |||
<easy-player :video-url="outVideoSrc" live="true" stretch="true" /> | |||
</div> | |||
@@ -50,12 +45,10 @@ | |||
import { reactive, toRefs, watch } from 'vue' | |||
import { getAirportInfo } from '@/api/dashboard/index.js' | |||
import 'vue3-video-play/dist/style.css' | |||
import { videoPlay } from 'vue3-video-play' | |||
export default { | |||
name: 'OneMap', | |||
components: { videoPlay }, | |||
components: { }, | |||
props: { | |||
data: { | |||
type: Object, | |||
@@ -109,7 +102,7 @@ export default { | |||
}) | |||
.then(res => { | |||
if (res.code === 0) { | |||
console.log(res, '机场详情') | |||
// console.log(res, '机场详情') | |||
data.mountedName = res.data.mountName | |||
const status = parseFloat(res.data.status) | |||
switch (status) { | |||
@@ -141,18 +134,10 @@ export default { | |||
}) | |||
} | |||
}) | |||
const videoShowStyle = () => { | |||
data.innerMonitorOptions.webFullScreen = !data.innerMonitorOptions.webFullScreen | |||
// data.innerMonitorOptions.width = '500px' | |||
// data.innerMonitorOptions.webFullScreen = true | |||
} | |||
const outerVideoShowStyle = () => { | |||
data.outsideMonitorOptions.webFullScreen = !data.outsideMonitorOptions.webFullScreen | |||
} | |||
return { | |||
...toRefs(data), | |||
videoShowStyle, | |||
outerVideoShowStyle | |||
...toRefs(data) | |||
} | |||
} | |||
} |
@@ -1,154 +1,125 @@ | |||
<template> | |||
<div class="map-container" :="getMapOptions" /> | |||
<div | |||
class="map-container" | |||
:="getMapOptions" | |||
/> | |||
<div | |||
id="airOverlay" | |||
class="airport-overlay" | |||
> | |||
<span | |||
id="closeAir" | |||
class="close-overlay" | |||
@click="hideAirInfo" | |||
>x</span> | |||
<div id="airOverlay" class="airport-overlay"> | |||
<span id="closeAir" class="close-overlay" @click="hideAirInfo">x</span> | |||
<air-info :data="airDetail" /> | |||
</div> | |||
<div | |||
v-show="problemPopupShow" | |||
id="problemOverlay" | |||
class="problem-overlay" | |||
> | |||
<span | |||
class="close-overlay" | |||
@click="hideProblemInfo" | |||
>x</span> | |||
<div v-show="problemPopupShow" id="problemOverlay" class="problem-overlay"> | |||
<span class="close-overlay" @click="hideProblemInfo">x</span> | |||
<problem-info :detail="problemDetail" /> | |||
</div> | |||
<div | |||
v-show="listChecked" | |||
class="menu" | |||
> | |||
<div v-show="listChecked" class="menu"> | |||
<div class="tabBar"> | |||
<span | |||
:class="[tabIndex==1?'checkedColor':'uncheckedColor']" | |||
style="margin-right:97px" | |||
:class="[tabIndex == 1 ? 'checkedColor' : 'uncheckedColor']" | |||
style="margin-right: 97px" | |||
@click="showTask" | |||
>任务</span> | |||
<span | |||
:class="[tabIndex==1?'uncheckedColor':'checkedColor']" | |||
:class="[tabIndex == 1 ? 'uncheckedColor' : 'checkedColor']" | |||
@click="showProblem" | |||
>问题</span> | |||
</div> | |||
<div | |||
v-if="tabIndex==1" | |||
class="listDetail" | |||
> | |||
<div v-if="tabIndex == 1" class="listDetail"> | |||
<ul> | |||
<li | |||
v-for="(item,index) in taskList" | |||
v-for="(item, index) in taskList" | |||
:key="index" | |||
style="display:flex;font-size:14px" | |||
style="font-size: 14px" | |||
> | |||
<div style="width:145px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis">{{ item.date }} {{ item.taskName }}</div> | |||
<div style="width:42px">{{ item.statusInfo }}</div> | |||
<n-popconfirm | |||
v-if="item.status==1" | |||
@positive-click="handlePositiveClick(item)" | |||
@negative-click="handleNegativeClick" | |||
<div | |||
style=" | |||
width: 150px; | |||
white-space: nowrap; | |||
overflow: hidden; | |||
text-overflow: ellipsis; | |||
margin-right: 20px; | |||
" | |||
> | |||
<template #trigger> | |||
<span style="color:#22D33D">立即执行</span> | |||
</template> | |||
是否立即开始执行任务? | |||
</n-popconfirm> | |||
{{ item.date }} {{ item.taskName }} | |||
</div> | |||
<div style="margin-right: 30px">{{ item.statusInfo }}</div> | |||
<div v-if="item.status == 1" style="float: left; width: 56px"> | |||
<n-popconfirm | |||
@positive-click="handlePositiveClick(item)" | |||
@negative-click="handleNegativeClick" | |||
> | |||
<template #trigger> | |||
<span style="color: #22d33d">立即执行</span> | |||
</template> | |||
是否立即开始执行任务? | |||
</n-popconfirm> | |||
</div> | |||
<div | |||
v-else | |||
style="color:#1890FF" | |||
style="color: #1890ff; float: left; width: 56px" | |||
@click="liveShow(item)" | |||
>直播</div> | |||
> | |||
直播 | |||
</div> | |||
</li> | |||
</ul> | |||
<n-pagination | |||
v-model:page="page" | |||
:page-count="pageCount" | |||
:page-slot="7" | |||
style="color:#FFFFFF;position:absolute;bottom:10px;left:10px" | |||
style="color: #ffffff; position: absolute; bottom: 10px; left: 10px" | |||
/> | |||
</div> | |||
<div | |||
v-else | |||
class="listDetail" | |||
> | |||
<div v-else class="listDetail"> | |||
<n-date-picker | |||
:on-update:formatted-value="abc" | |||
:default-formatted-value="efg" | |||
type="daterange" | |||
:default-value="[Date.now() - 6.048e8, Date.now()]" | |||
:is-date-disabled="disablePreviousDate" | |||
style="margin-bottom:15px" | |||
style="margin-bottom: 15px" | |||
/> | |||
<!-- 多选框 --> | |||
<n-checkbox-group | |||
v-model:value="problemTypeSelected" | |||
@update:value="handleProblemTypeValue" | |||
> | |||
<div | |||
v-for="(item,index) in problemTypeList" | |||
:key="index" | |||
> | |||
<div v-for="(item, index) in problemTypeList" :key="index"> | |||
<n-checkbox | |||
:value="item.content" | |||
:label="item.content" | |||
style="color:#FFFFFF" | |||
style="color: #ffffff" | |||
/> | |||
</div> | |||
</n-checkbox-group> | |||
</div> | |||
</div> | |||
<div class="menuControl"> | |||
<div | |||
style="border-bottom:1px solid rgba(1122,112,112,0.65)" | |||
style="border-bottom: 1px solid rgba(1122, 112, 112, 0.65)" | |||
class="item" | |||
> | |||
<div @click="showList"> | |||
<img | |||
v-if="listChecked==true" | |||
v-if="listChecked == true" | |||
src="../../../assets/images/listChecked.png" | |||
> | |||
<img | |||
v-else | |||
src="../../../assets/images/listUnchecked.png" | |||
> | |||
<img v-else src="../../../assets/images/listUnchecked.png"> | |||
</div> | |||
<span :style="{'color':listChecked?'#1890FF':'#666666'}">列表</span> | |||
<span :style="{ color: listChecked ? '#1890FF' : '#666666' }">列表</span> | |||
</div> | |||
<div class="item"> | |||
<div @click="showAirportList"> | |||
<img | |||
v-if="airportSelected==true" | |||
v-if="airportSelected == true" | |||
src="../../../assets/images/airportChecked.png" | |||
> | |||
<img | |||
v-else | |||
src="../../../assets/images/airportUnchecked.png" | |||
> | |||
<img v-else src="../../../assets/images/airportUnchecked.png"> | |||
</div> | |||
<span :style="{'color':airportSelected?'#1890FF':'#666666'}">机场</span> | |||
<span :style="{ color: airportSelected ? '#1890FF' : '#666666' }">机场</span> | |||
</div> | |||
</div> | |||
</template> | |||
<script> | |||
@@ -170,7 +141,12 @@ import deadTree_icon from '@/assets/images/deadTree.png' | |||
import fireHazard_icon from '@/assets/images/fireHazard.png' | |||
import { reactive, toRefs, onMounted, computed, ref, watch } from 'vue' | |||
import { Point } from 'ol/geom' | |||
import { airportList, getMissionList, getQuestionType, getQuestionList } from '@/api/dashboard/index.js' | |||
import { | |||
airportList, | |||
getMissionList, | |||
getQuestionType, | |||
getQuestionList | |||
} from '@/api/dashboard/index.js' | |||
import { getQuestions } from '@/api/task/index.js' | |||
import { gcj02towgs84 } from '@/utils/coordinate-util.js' | |||
import AirInfo from './AirInfo.vue' | |||
@@ -224,34 +200,42 @@ export default { | |||
listShow: false, | |||
// 时间范围是一周前至今天 | |||
efg: '', | |||
listIcon: new URL('../../../assets/images/listChecked.png', import.meta.url).href, | |||
airportIcon: new URL('../../../assets/images/airportChecked.png', import.meta.url).href, | |||
listIcon: new URL( | |||
'../../../assets/images/listChecked.png', | |||
import.meta.url | |||
).href, | |||
airportIcon: new URL( | |||
'../../../assets/images/airportChecked.png', | |||
import.meta.url | |||
).href, | |||
listFontStyle: { | |||
'color': '#666666' | |||
color: '#666666' | |||
}, | |||
airportFontStyle: { | |||
'color': '#1890FF' | |||
color: '#1890FF' | |||
}, | |||
problemPopupShow: false, | |||
tabIndex: 1, | |||
page: ref(1), | |||
pageCount: 1, | |||
taskList: [], | |||
range: (['2012-09-10', '2022-09-10']), | |||
range: ['2012-09-10', '2022-09-10'], | |||
problemTypeSelected: null, | |||
problemTypeList: [], | |||
listChecked: false, | |||
airportSelected: true, | |||
problemLayerList: [], | |||
airportPopupShow: false, | |||
problemlayer: null | |||
airportPopupShow: false | |||
}) | |||
watch(() => data.page, (newValue, oldValue) => { | |||
if (newValue !== oldValue) { | |||
initTaskList() | |||
watch( | |||
() => data.page, | |||
(newValue, oldValue) => { | |||
if (newValue !== oldValue) { | |||
initTaskList() | |||
} | |||
} | |||
}) | |||
) | |||
const getMapOptions = computed(() => { | |||
return { | |||
id: props.id | |||
@@ -260,17 +244,16 @@ export default { | |||
const initMap = () => { | |||
// 天地图影像图 | |||
const tdtImgMap = | |||
new Tile({ | |||
visible: true, | |||
source: new XYZ({ | |||
url: 'https://t0.tianditu.gov.cn/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=f634525a82da65f715d168d7ba1899c0' | |||
}) | |||
const tdtImgMap = new Tile({ | |||
visible: true, | |||
source: new XYZ({ | |||
url: 'https://t0.tianditu.gov.cn/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=f634525a82da65f715d168d7ba1899c0' | |||
}) | |||
}) | |||
var wmsSource = new Tile({ | |||
source: new TileWMS({ | |||
url: 'https://geoserver.t-aaron.com:4080/geoserver/jiangning/wms', | |||
params: { 'LAYERS': 'jiangning:town' } | |||
params: { LAYERS: 'jiangning:town' } | |||
}) | |||
}) | |||
data.map = new Map({ | |||
@@ -281,16 +264,12 @@ export default { | |||
zoom: 11, | |||
maxZoom: 17 | |||
}), | |||
layers: [ | |||
tdtImgMap | |||
], | |||
layers: [tdtImgMap], | |||
controls: control.defaults({ | |||
attribution: false, | |||
rotate: false, | |||
zoom: false | |||
}) | |||
}) | |||
data.map.addLayer(wmsSource) | |||
wmsSource.setOpacity(0.3) | |||
@@ -311,9 +290,7 @@ export default { | |||
/** | |||
* @description:分页器改变时改变任务列表信息 | |||
*/ | |||
const changePage = (v) => { | |||
} | |||
const changePage = (v) => {} | |||
/** | |||
* 展示机场 | |||
*/ | |||
@@ -321,7 +298,10 @@ export default { | |||
if (data.airportsAll.length > 0) { | |||
for (let i = 0; i < data.airportsAll.length; i++) { | |||
const airport = data.airportsAll[i] | |||
const lngLat = gcj02towgs84(parseFloat(airport.longitude), parseFloat(airport.latitude)) | |||
const lngLat = gcj02towgs84( | |||
parseFloat(airport.longitude), | |||
parseFloat(airport.latitude) | |||
) | |||
const feature = new Feature({ | |||
geometry: new Point(fromLonLat(lngLat)) | |||
}) | |||
@@ -388,6 +368,13 @@ export default { | |||
offset: [10, 10] | |||
}) | |||
data.airportPopupShow = true | |||
data.problemOverlay = new Overlay({ | |||
id: 'problem_overlay', | |||
element: document.getElementById('problemOverlay'), | |||
// autoPan: true, | |||
offset: [10, 10] | |||
}) | |||
// 点击事件 | |||
data.map.on('click', (evt) => { | |||
showAirInfo(evt) | |||
@@ -478,56 +465,54 @@ export default { | |||
const performTask = (item) => { | |||
// console.log(router, '路径') | |||
router.push({ path: '/taskManage/all', query: { rowInfo: JSON.stringify(item) }}) | |||
router.push({ | |||
path: '/taskManage/all', | |||
query: { rowInfo: JSON.stringify(item) } | |||
}) | |||
} | |||
const abc = (value) => { | |||
getQuestionList({ | |||
startTime: value[0], | |||
endTime: value[1] | |||
}).then(res => { | |||
}).then((res) => { | |||
if (res.code === 0) { | |||
const arr = res.data | |||
var resArr = [] | |||
var narr = [] | |||
const nar = [] | |||
for (var i = 0; i < arr.length; i++) { | |||
var n = resArr.indexOf(arr[i].typeName) | |||
if (n == -1) { | |||
if (n === -1) { | |||
resArr.push(arr[i].typeName) | |||
narr.push({ 'name': arr[i].typeName, fraction: [arr[i]] }) | |||
nar.push({ name: arr[i].typeName, fraction: [arr[i]] }) | |||
} else { | |||
narr[n].fraction.push(arr[i]) | |||
nar[n].fraction.push(arr[i]) | |||
} | |||
} | |||
// 添加问题图层 | |||
addproblemLayer(narr) | |||
addproblemLayer(nar) | |||
} | |||
}) | |||
} | |||
// 添加问题图层 | |||
const addproblemLayer = (narr) => { | |||
if (data.problemlayer !== null) { | |||
data.map.removeLayer(data.problemlayer) | |||
if (data.problemLayerList.length > 0) { | |||
data.problemLayerList.forEach(layer => { | |||
if (layer !== null) { | |||
data.map.removeLayer(layer) | |||
} | |||
}) | |||
data.problemLayerList.length = 0 | |||
} | |||
data.problemOverlay = new Overlay({ | |||
id: 'problem_overlay', | |||
element: document.getElementById('problemOverlay'), | |||
// autoPan: true, | |||
offset: [10, 10] | |||
}) | |||
narr.map((item) => { | |||
const Features = [] | |||
data.problemLayerList = [] | |||
if (item.fraction.length > 0) { | |||
const Features = [] | |||
item.fraction.map((iitem) => { | |||
const problem = iitem | |||
const lngLat = gcj02towgs84(parseFloat(problem.lng), parseFloat(problem.lat)) | |||
const feature = new Feature({ | |||
geometry: new Point(fromLonLat(lngLat)) | |||
geometry: new Point(fromLonLat([problem.lng, problem.lat])) | |||
}) | |||
let icon | |||
switch (iitem.typeName) { | |||
case '林场问题图斑': | |||
@@ -553,21 +538,24 @@ export default { | |||
// 要素设置id | |||
feature.setId(problem.questionId) | |||
// 要素设置属性 | |||
problem.coordinate = fromLonLat(lngLat) | |||
problem.coordinate = fromLonLat([problem.lng, problem.lat]) | |||
feature.setProperties(problem) | |||
Features.push(feature) | |||
}) | |||
// 添加图层 | |||
data.problemlayer = new VectorLayer({ | |||
const problemlayer = new VectorLayer({ | |||
source: new VectorSource({ | |||
features: Features | |||
}), | |||
visible: true | |||
}) | |||
const obj = { type: item.name, layer: data.problemlayer } | |||
data.problemLayerList.push(obj) | |||
data.map.addLayer(data.problemlayer) | |||
// 问题图层设置type | |||
problemlayer.setProperties({ | |||
type: item.name | |||
}) | |||
data.map.addLayer(problemlayer) | |||
data.problemLayerList.push(problemlayer) | |||
} | |||
}) | |||
} | |||
@@ -579,22 +567,24 @@ export default { | |||
getMissionList({ | |||
page: data.page, | |||
limit: 8 | |||
}).then(res => { | |||
}).then((res) => { | |||
if (res.code === 0) { | |||
data.taskList = res.data.records | |||
data.pageCount = res.data.pages | |||
// console.log(data.pageCount, '页数') | |||
data.taskList.map((item, index) => { | |||
const arr = item.executionStartTime.split(/[ ]+/)// 以空格分开 | |||
const arr = item.executionStartTime.split(/[ ]+/) // 以空格分开 | |||
item.date = arr[0] | |||
item.taskName = item.name | |||
switch (item.status) { | |||
case 1: | |||
item.statusInfo = '待执行' | |||
item.toIndexRoute = false | |||
break | |||
case 2: | |||
item.statusInfo = '执行中' | |||
item.toIndexRoute = true | |||
break | |||
} | |||
}) | |||
@@ -605,7 +595,7 @@ export default { | |||
* 获取问题多选类型 | |||
*/ | |||
const initProblemType = () => { | |||
getQuestionType().then(res => { | |||
getQuestionType().then((res) => { | |||
if (res.code === 0) { | |||
data.problemTypeList = res.data | |||
data.problemTypeSelected = [] | |||
@@ -625,16 +615,16 @@ export default { | |||
* | |||
*/ | |||
const handleProblemTypeValue = (value) => { | |||
// console.log(value, '选中的值') | |||
data.problemLayerList.map((item) => { | |||
const a = value.indexOf(item.type) | |||
if (a == -1) { | |||
item.layer.setVisible(false) | |||
} else { | |||
item.layer.setVisible(true) | |||
} | |||
}) | |||
if (data.problemLayerList.length > 0) { | |||
data.problemLayerList.map((layer) => { | |||
const a = value.indexOf(layer.getProperties().type) | |||
if (a === -1) { | |||
layer.setVisible(false) | |||
} else { | |||
layer.setVisible(true) | |||
} | |||
}) | |||
} | |||
} | |||
/** | |||
* @description:是否显示机场 | |||
@@ -650,7 +640,12 @@ export default { | |||
* 展示直播视频 | |||
*/ | |||
const liveShow = (rowInfo) => { | |||
router.push({ path: '/taskManage/all', query: { rowInfo: JSON.stringify(rowInfo), type: 1 }}) | |||
rowInfo = JSON.stringify(rowInfo) | |||
router.push({ | |||
path: '/taskManage/all', | |||
query: { rowInfo: rowInfo } | |||
}) | |||
} | |||
onMounted(() => { | |||
initMap() | |||
@@ -672,10 +667,14 @@ export default { | |||
const d = 864e5 | |||
// return ts > Date.now() | |||
if (type === 'start' && range !== null) { | |||
return startOfDay(range[1]).valueOf() - startOfDay(ts).valueOf() >= d * 8 | |||
return ( | |||
startOfDay(range[1]).valueOf() - startOfDay(ts).valueOf() >= d * 8 | |||
) | |||
} | |||
if (type === 'end' && range !== null) { | |||
return startOfDay(ts).valueOf() - startOfDay(range[0]).valueOf() >= d * 8 | |||
return ( | |||
startOfDay(ts).valueOf() - startOfDay(range[0]).valueOf() >= d * 8 | |||
) | |||
} | |||
return ts > Date.now() | |||
}, | |||
@@ -699,38 +698,34 @@ export default { | |||
}) | |||
}, | |||
handlePositiveClick(row) { | |||
// console.log(row, '该行数据') | |||
$message.info('机场设备开始自检,请稍等') | |||
implement(row.id) | |||
.then(res => { | |||
if (res.code === 0) { | |||
$message.info('操作成功') | |||
} | |||
}) | |||
}, | |||
handleNegativeClick() { | |||
implement(row.id).then((res) => { | |||
if (res.code === 0) { | |||
$message.info('操作成功') | |||
} | |||
}) | |||
}, | |||
handleNegativeClick() {}, | |||
liveShow | |||
} | |||
} | |||
} | |||
</script> | |||
<style lang="scss" scoped> | |||
.container{ | |||
width:100vw; | |||
height:100vh; | |||
position:relative; | |||
overflow:hidden; | |||
.container { | |||
width: 100vw; | |||
height: 100vh; | |||
position: relative; | |||
overflow: hidden; | |||
} | |||
.map-container { | |||
position:absolute; | |||
top:0px; | |||
left:0px; | |||
right:0px; | |||
bottom:0px; | |||
position: absolute; | |||
top: 0px; | |||
left: 0px; | |||
right: 0px; | |||
bottom: 0px; | |||
} | |||
.layer-management { | |||
@@ -814,10 +809,13 @@ export default { | |||
padding: 10px 19px; | |||
ul { | |||
li { | |||
display: flex; | |||
justify-content: space-between; | |||
padding: 5px 2px; | |||
margin-bottom: 3px; | |||
div { | |||
float: left; | |||
height: 100%; | |||
height: 30px; | |||
} | |||
} | |||
} | |||
} |
@@ -37,7 +37,7 @@ export default { | |||
new Tile({ | |||
visible: true, | |||
source: new XYZ({ | |||
url: 'https://tianditu.t-aaron.com/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=f82bb2fd8115c7fb576a8b2fcf738523' | |||
url: 'https://tianditu.t-aaron.com/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=f634525a82da65f715d168d7ba1899c0' | |||
}) | |||
}) | |||
] |
@@ -182,7 +182,7 @@ export default defineComponent({ | |||
new Tile({ | |||
visible: true, | |||
source: new XYZ({ | |||
url: 'https://tianditu.t-aaron.com/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=f82bb2fd8115c7fb576a8b2fcf738523' | |||
url: 'https://tianditu.t-aaron.com/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=f634525a82da65f715d168d7ba1899c0' | |||
}) | |||
}) | |||
] |
@@ -54,7 +54,7 @@ import VectorContext from 'ol/render/VectorContext' | |||
import * as control from 'ol/control' | |||
import { styleList } from '../tools/style.js' | |||
import { getTrackList, getLineList } from '@/api/task/index.js' | |||
import { useRouter } from 'vue-router' | |||
// 视频组件 | |||
import VideoPlayer from '@/components/VideoPlayer/index.vue' | |||
export default defineComponent({ | |||
@@ -77,6 +77,7 @@ export default defineComponent({ | |||
}, | |||
setup(props, { emit }) { | |||
const originRef = ref() | |||
const router = useRouter() | |||
const data = reactive({ | |||
mapData: null, | |||
view: null, | |||
@@ -147,7 +148,13 @@ export default defineComponent({ | |||
function handleDrawerColse() { | |||
emit('update:visible', false) | |||
// 如果是从首页进来的,关闭之后会跳转到首页,首页传进来的会传递一个参数为type==1 | |||
// 如果是从首页进来的,关闭之后会跳转到首页,首页传进来的会传递一个参数为type==true | |||
if (props.data.toIndexRoute) { | |||
router.push({ | |||
path: '/dashboard' | |||
}) | |||
} | |||
} | |||
/* 获取轨迹数据 */ | |||
@@ -208,7 +215,7 @@ export default defineComponent({ | |||
new Tile({ | |||
visible: true, | |||
source: new XYZ({ | |||
url: 'https://tianditu.t-aaron.com/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=f82bb2fd8115c7fb576a8b2fcf738523' | |||
url: 'https://tianditu.t-aaron.com/DataServer?T=img_w&x={x}&y={y}&l={z}&tk=f634525a82da65f715d168d7ba1899c0' | |||
}) | |||
}) | |||
] |
@@ -79,7 +79,7 @@ export default { | |||
setup() { | |||
const route = useRoute() | |||
const rowInfo = route.query.rowInfo | |||
const type = route.query.type | |||
getAirOptions() | |||
const searchRef = ref() | |||
const data = reactive({ | |||
@@ -123,6 +123,7 @@ export default { | |||
onMounted(() => { | |||
if (rowInfo) { | |||
data.rowData = JSON.parse(rowInfo) | |||
data.liveDrawer = true | |||
} | |||
}) |