Skip to content

H
holo-web
Commit edfd5c94 authored by ninglx's avatar ninglx
Browse files
Options

济南bug修改统一提交 灯态socket数据结构及展示逻辑修改

parent 7eec0073
Expand all Show whitespace changes
Inline Side-by-side
Showing with 1356 additions and 617 deletions
wj-manage-web/public/stopLines.json 0 → 100644
View file @ edfd5c94
{
"code": 200,
"content": [
{
"lkid": "13NF80B5QN0",
"ldid": "13NED0B5Q9013NF80B5QN00",
"geom": "{\"type\":\"LineString\",\"coordinates\":[[117.08578147,36.641840211,140.25],[117.085795887,36.641811561,140.25],[117.085809801,36.641786004,140.25],[117.085825559,36.641756681,140.25]]}",
"angle": 152.17,
"dirtype": "6"
},
{
"lkid": "13NGH0B5RC0",
"ldid": "13NF80B5QN013NGH0B5RC00",
"geom": "{\"type\":\"LineString\",\"coordinates\":[[117.089696322,36.643939476,130.339797974],[117.089708559,36.643916476,130.339797974],[117.089720462,36.643893072,130.289093018],[117.089732699,36.643869668,130.289093018],[117.089743428,36.643846667,130.199203491]]}",
"angle": 153.09,
"dirtype": "6"
},
{
"lkid": "13NF80B5QN0",
"ldid": "13NDG0B5RI013NF80B5QN00",
"geom": "{\"type\":\"LineString\",\"coordinates\":[[117.085816674,36.642064573,139.281295776],[117.085780799,36.642044935,139.421905518]]}",
"angle": 241.3,
"dirtype": "1"
},
{
"lkid": "13NF80B5QN0",
"ldid": "13NDT0B5Q9013NF80B5QN00",
"geom": "{\"type\":\"LineString\",\"coordinates\":[[117.085989174,36.641797975,139.468795776],[117.08601784,36.641816538,139.328094482],[117.086045332,36.641834562,139.230499268],[117.086060923,36.641844785,139.179702759]]}",
"angle": 56.88,
"dirtype": "4"
},
{
"lkid": "13NDG0B5RI0",
"ldid": "13NF80B5QN013NDG0B5RI00",
"geom": "{\"type\":\"LineString\",\"coordinates\":[[117.086327299,36.644873481,132.488296509],[117.086359989,36.644863931,132.539093018],[117.086387146,36.644855054,132.531295776]]}",
"angle": 107.11,
"dirtype": "5"
},
{
"lkid": "13NF80B5QN0",
"ldid": "13NGH0B5RC013NF80B5QN00",
"geom": "{\"type\":\"LineString\",\"coordinates\":[[117.086044997,36.642015881,139.078094482],[117.086024713,36.6420409,138.980499268],[117.086005937,36.642063632,138.94140625],[117.085984144,36.642089727,138.890594482]]}",
"angle": 320.51,
"dirtype": "2"
},
{
"lkid": "13NED0B5Q90",
"ldid": "13NF80B5QN013NED0B5Q900",
"geom": "{\"type\":\"LineString\",\"coordinates\":[[117.083336134,36.64049981,149.730499268],[117.08331937,36.640526444,149.679702759],[117.083303779,36.640550656,149.62890625],[117.083286177,36.6405785,149.62890625]]}",
"angle": 327.59,
"dirtype": "2"
},
{
"lkid": "13NI00B5RM0",
"ldid": "13NGH0B5RC013NI00B5RM00",
"geom": "{\"type\":\"LineString\",\"coordinates\":[[117.094602879,36.644970828,135.570297241],[117.094611721,36.644862003,135.519500732]]}",
"angle": 175.35,
"dirtype": "7"
},
{
"lkid": "13NID0B5RM0",
"ldid": "13NI00B5RM013NID0B5RM00",
"geom": "{\"type\":\"LineString\",\"coordinates\":[[117.095711008,36.644986195,137.230499268],[117.095711343,36.644955798,137.230499268],[117.095711846,36.644928762,137.179702759],[117.095711175,36.644897692,137.179702759]]}",
"angle": 179.89,
"dirtype": "7"
},
{
"lkid": "13NI00B5RM0",
"ldid": "13NG40B5SK013NI00B5RM00",
"geom": "{\"type\":\"LineString\",\"coordinates\":[[117.094632592,36.645122448,135.37109375],[117.094598226,36.645121103,135.351593018],[117.094506976,36.645115703,0],[117.094567046,36.645119355,135.289093018]]}",
"angle": 267.3,
"dirtype": "1"
},
{
"lkid": "13NI00B5RM0",
"ldid": "13NID0B5RM013NI00B5RM00",
"geom": "{\"type\":\"LineString\",\"coordinates\":[[117.094906177,36.64496602,136.011703491],[117.094906848,36.644995342,135.960906982],[117.094908357,36.645022781,135.960906982],[117.09490886,36.645053717,135.910202026]]}",
"angle": 1.75,
"dirtype": "3"
},
{
"lkid": "13NGH0B5RC0",
"ldid": "13NI00B5RM013NGH0B5RC00",
"geom": "{\"type\":\"LineString\",\"coordinates\":[[117.090221867,36.64409779,130.339797974],[117.09021315,36.644122135,130.339797974],[117.090204768,36.644146077,130.289093018],[117.090196386,36.644170423,130.238296509],[117.090186998,36.644195441,130.148406982]]}",
"angle": 340.35,
"dirtype": "3"
},
{
"lkid": "13NG40B5SK0",
"ldid": "13NI00B5RM013NG40B5SK00",
"geom": "{\"type\":\"LineString\",\"coordinates\":[[117.09480945,36.647421087,121.988296509],[117.094844822,36.647420011,121.988296509],[117.09487617,36.647419339,121.941398621]]}",
"angle": 91.5,
"dirtype": "5"
},
{
"lkid": "13NGH0B5RC0",
"ldid": "13NEH0B5RJ013NGH0B5RC00",
"geom": "{\"type\":\"LineString\",\"coordinates\":[[117.089840658,36.644200687,129.761703491],[117.089808304,36.644191809,129.761703491],[117.08977377,36.644182528,129.730499268]]}",
"angle": 254.81,
"dirtype": "1"
},
{
"lkid": "13NEP0B5QJ0",
"ldid": "13NGH0B5RC013NEP0B5QJ00",
"geom": "{\"type\":\"LineString\",\"coordinates\":[[117.09044164,36.642228809,137.179702759],[117.090419177,36.642226791,137.230499268]]}",
"angle": 264.87,
"dirtype": "1"
},
{
"lkid": "13NEP0B5QJ0",
"ldid": "13NGH0B5RC013NEP0B5QJ00",
"geom": "{\"type\":\"LineString\",\"coordinates\":[[117.090504169,36.642235265,137.078094482],[117.090467624,36.642231096,137.031295776]]}",
"angle": 263.49,
"dirtype": "1"
},
{
"lkid": "13NEP0B5QJ0",
"ldid": "13NGH0B5RC013NEP0B5QJ00",
"geom": "{\"type\":\"LineString\",\"coordinates\":[[117.090538703,36.642239301,137.539093018],[117.090504169,36.642235265,137.078094482]]}",
"angle": 263.34,
"dirtype": "1"
},
{
"lkid": "13NGH0B5RC0",
"ldid": "13NEP0B5QJ013NGH0B5RC00",
"geom": "{\"type\":\"LineString\",\"coordinates\":[[117.090014331,36.64384438,130.339797974],[117.090044841,36.643854872,130.339797974],[117.090075854,36.643865094,130.339797974],[117.090105861,36.643875586,130.320297241]]}",
"angle": 71.17,
"dirtype": "5"
},
{
"lkid": "13NEH0B5RJ0",
"ldid": "13NGH0B5RC013NEH0B5RJ00",
"geom": "{\"type\":\"LineString\",\"coordinates\":[[117.089664568,36.64506163,125.460899353],[117.089723982,36.645074834,125.359397888],[117.089756168,36.645080886,125.308601379]]}",
"angle": 78.13,
"dirtype": "5"
},
{
"lkid": "13NID0B5RM0",
"ldid": "13NGQ0B5R0013NID0B5RM00",
"geom": "{\"type\":\"LineString\",\"coordinates\":[[117.097029085,36.642846211,160.87890625],[117.097066864,36.642847817,160.910202026],[117.097102404,36.642849162,160.859405518]]}",
"angle": 87.69,
"dirtype": "4"
},
{
"lkid": "13NID0B5RM0",
"ldid": "13NGQ0B5R0013NID0B5RM00",
"geom": "{\"type\":\"LineString\",\"coordinates\":[[117.095834892,36.644817527,137.281295776],[117.095866241,36.644837972,137.37109375],[117.095896583,36.644858282,137.421905518]]}",
"angle": 56.55,
"dirtype": "4"
},
{
"lkid": "13NID0B5RM0",
"ldid": "13NH20B5RH013NID0B5RM00",
"geom": "{\"type\":\"LineString\",\"coordinates\":[[117.096297238,36.644966423,138.199203491],[117.096298411,36.64499171,138.179702759],[117.096298244,36.64501619,138.109405518],[117.096298914,36.645040939,138.05859375],[117.096300088,36.645065418,138.05859375]]}",
"angle": 1.65,
"dirtype": "3"
},
{
"lkid": "13NID0B5RM0",
"ldid": "13NHC0B5R4013NID0B5RM00",
"geom": "{\"type\":\"LineString\",\"coordinates\":[[117.098410148,36.643917283,141.078094482],[117.098435462,36.643950909,140.94140625],[117.098445352,36.643965436,140.94140625]]}",
"angle": 36.17,
"dirtype": "4"
},
{
"lkid": "13NID0B5RM0",
"ldid": "13NHC0B5R4013NID0B5RM00",
"geom": "{\"type\":\"LineString\",\"coordinates\":[[117.096125241,36.64482896,137.761703491],[117.096164869,36.644863363,137.80859375]]}",
"angle": 49.04,
"dirtype": "4"
},
{
"lkid": "13NHC0B5R40",
"ldid": "13NID0B5RM013NHC0B5R400",
"geom": "{\"type\":\"LineString\",\"coordinates\":[[117.098188866,36.644014262,140.69140625],[117.098166402,36.64397808,140.718795776],[117.098156344,36.643962073,140.738296509]]}",
"angle": 211.93,
"dirtype": "8"
},
{
"lkid": "13NHC0B5R40",
"ldid": "13NID0B5RM013NHC0B5R400",
"geom": "{\"type\":\"LineString\",\"coordinates\":[[117.098936364,36.643452159,142.160202026],[117.098890767,36.643432656,142.210906982],[117.098873667,36.643425796,142.210906982]]}",
"angle": 247.19,
"dirtype": "8"
}
],
"message": "SQL执行成功",
"status": "success",
"timestamp": 0
}
\ No newline at end of file
wj-manage-web/src/components/Standard/cameraVideo.vue
View file @ edfd5c94
......@@ -76,12 +76,6 @@ export default {
//视频出错后销毁重新创建
this.player.on(flvjs.Events.ERROR, this.handleErr);
this.player.on(flvjs.Events.LOADING_COMPLETE, this.handleErr);
// this.player.on("media_info", (e) => {
// console.log('media_info', e)
// });
// this.player.on("metadata_arrived", (e) => {
// console.log('metadata_arrived', e)
// });
},
handleErr() {
if (this.player) {
......@@ -112,30 +106,15 @@ export default {
//清除定时器
clearInterval(this.cleanBuff);
}
if (this.timeoutInterval) {
clearInterval(this.timeoutInterval);
}
},
initPlayer() {
this.$nextTick(() => {
this.loadVideo();
});
this.timeoutInterval = setInterval(() => {
if (this.cameraLoading) {
this.handleErr();
} else {
clearInterval(this.timeoutInterval);
}
}, 15000);
},
},
data() {
return {
timeoutInterval: null,
cleanBuff: null,
cameraLoading: true,
supported: false,
player: null,
interval: null
};
},
mounted() {
......@@ -146,17 +125,16 @@ export default {
this.$nextTick(() => {
this.loadVideo();
});
let interval = setInterval(() => {
this.interval = setInterval(() => {
if (this.cameraLoading) {
this.handleErr();
} else {
clearInterval(interval);
clearInterval(this.interval);
}
}, 3000);
}
},
beforeDestroy() {
// console.log("beforeDestroy");
this.destroy();
},
};
......
wj-manage-web/src/components/Standard/loopVideo.vue
View file @ edfd5c94
<template>
<div
class="loopVideo"
v-loading="isLoading"
v-loading="videoLoading"
element-loading-text="加载中..."
element-loading-spinner="el-icon-loading"
element-loading-background="rgba(0, 0, 0, 0.8)"
......@@ -15,12 +15,6 @@
@ended="handleEnded"
@canplay="videoCanPlay"
></video>
<!-- <div class="loading-mask" v-show="isLoading">
<div style="position: relative">
<div class="el-icon-loading"></div>
<div>加载中...</div>
</div>
</div> -->
</div>
</template>
......@@ -38,29 +32,35 @@ export default {
},
data() {
return {
isLoading: false,
requestLoading: true,
videoLoading: true,
videoUrl: null,
flvPlayer: null,
interval: null,
};
},
mounted() {
if (this.channel) {
this.getVideoStreamUrl();
timer = setInterval(() => {
if (this.isLoading) {
this.destroy();
this.$nextTick(() => {
this.getVideoStreamUrl();
});
this.interval = setInterval(() => {
if (this.videoLoading) {
this.handleErr();
} else {
clearInterval(timer);
clearInterval(this.interval);
}
}, 5000);
}, 3000);
}
},
methods: {
handleErr() {
this.destroyPlayer();
this.$nextTick(() => {
this.getVideoStreamUrl();
});
},
videoCanPlay() {
this.videoLoading = false;
this.$emit("videoReady", this.channel);
},
replaceTimeGap(time) {
......@@ -72,8 +72,8 @@ export default {
},
async getVideoStreamUrl() {
try {
console.log("channel reconnect....", this.channel);
this.isLoading = true;
// console.log("channel reconnect....", this.channel);
this.requestLoading = true;
const response = await getEventVideo({
channel: this.channel,
subtype: 0,
......@@ -91,7 +91,7 @@ export default {
console.error("FLV is not supported by this browser!");
return;
}
console.log("loop start...", this.videoUrl);
// console.log("loop start...", this.videoUrl);
this.flvPlayer = flvjs.createPlayer({
type: "flv",
url: this.videoUrl,
......@@ -108,41 +108,39 @@ export default {
this.flvPlayer.on(flvjs.Events.MEDIA_DETACHED, this.handleMediaDetached);
},
handleMediaDetached() {
// setTimeout(() => {
// this.getVideoStreamUrl();
// }, 1000);
},
handleLoadStart() {
this.isLoading = true;
this.requestLoading = true;
},
handleLoadedMetadata() {
this.isLoading = false;
console.log("loaded...");
this.requestLoading = false;
// console.log("loaded...");
},
handleEnded() {
if (this.flvPlayer) {
this.flvPlayer.play();
}
},
destroy() {
timer && clearInterval(timer);
destroyPlayer() {
if (this.flvPlayer) {
this.flvPlayer.pause();
this.flvPlayer.unload();
this.flvPlayer.detachMediaElement();
this.flvPlayer.destroy();
this.flvPlayer?.pause();
this.flvPlayer?.unload();
this.flvPlayer?.detachMediaElement();
this.flvPlayer?.destroy();
this.flvPlayer = null;
}
},
},
watch: {
timeModel(val) {
this.destroy();
this.getVideoStreamUrl();
this.handleErr();
},
},
beforeDestroy() {
this.destroy();
if (this.interval) {
clearInterval(this.interval);
}
this.destroyPlayer();
},
};
</script>
......
wj-manage-web/src/components/Standard/map/pathMap/pathMap.vue
View file @ edfd5c94
......@@ -11,7 +11,7 @@ let vehicleModelTypes = {},
// Point MultiPoint LineString MultiLineString Polygon MultiPolygon
export default {
name: "wMap",
props: ["mapId", "speed", "filterType"],
props: ["mapId", "speed", "filterType", "eventTargetVehicleGlobalId"],
components: {},
data() {
return {
......@@ -21,10 +21,9 @@ export default {
},
mounted() {
this.initMap();
console.log('eventbus', this.$EventBus);
this.$EventBus.$on("fullTrack", (data) => {
fullTrack = data;
fullTrack = [...fullTrack,...data];
dillPath = [...dillPath, ...data]
});
},
methods: {
......@@ -96,6 +95,7 @@ export default {
pitch: map_config.MAP_PITCH,
});
map.on("style.load", () => {
this.$emit('mapLoad',map)
map.addLayer({
id: "vehicle3D",
type: "custom",
......@@ -143,11 +143,10 @@ export default {
},
clearAll() {
this.playStatus = false;
window.tb?.clear(null,true);
window.tb?.clear(null, true);
dillPath = [];
fullTrack = [];
window.tb.update();
window.tb?.update();
},
hasDuplicate(arr1, arr2) {
......@@ -194,7 +193,7 @@ export default {
dillPath.shift();
if (!dillPath.length) {
window.tb.clear(null, true);
lastFrame = { carInfo: [] }
lastFrame = { carInfo: [] };
dillPath = JSON.parse(JSON.stringify(fullTrack));
}
setTimeout(() => {
......@@ -205,6 +204,18 @@ export default {
},
setModel(model, options, timeDiff) {
// 如果有目标车辆 则把目标车辆设置为红色
if (
this.eventTargetVehicleGlobalId &&
options.id == this.eventTargetVehicleGlobalId
) {
model.traverse((child) => {
if (child.isMesh && child.name.includes("_19")) {
child.material = child.material.clone();
child.material.color.set("#e43f32");
}
});
}
if (timeDiff === 0) {
model.setCoords([options.longitude, options.latitude]);
} else {
......@@ -257,6 +268,19 @@ export default {
if (item.dill === "add") {
let model =
vehicleModelTypes[`car${item.originalType}`].duplicate();
// 如果有目标车辆 则把目标车辆设置为红色
if (
this.eventTargetVehicleGlobalId &&
item.id == this.eventTargetVehicleGlobalId
) {
map?.setCenter([item.longitude, item.latitude]);
model.traverse((child) => {
if (child.isMesh && child.name.includes("_19")) {
child.material = child.material.clone();
child.material.color.set("#e43f32");
}
});
}
model.setCoords([item.longitude, item.latitude]);
model.userData.data = item;
model.setRotation({ x: 90, y: 360 - item.courseAngle - 90, z: 0 });
......
wj-manage-web/src/config/holo/mapAssets.js
View file @ edfd5c94
......@@ -48,17 +48,17 @@ export default {
},
lightIcons: {
11: require('../../assets/images/sc/leftRed.png'),
12: require('../../assets/images/sc/leftYellow.png'),
13: require('../../assets/images/sc/leftGreen.png'),
21: require('../../assets/images/sc/sRed.png'),
22: require('../../assets/images/sc/sYellow.png'),
23: require('../../assets/images/sc/sGreen.png'),
31: require('../../assets/images/sc/rightRed.png'),
32: require('../../assets/images/sc/rightYellow.png'),
33: require('../../assets/images/sc/rightGreen.png'),
41: require('../../assets/images/sc/backRed.png'),
42: require('../../assets/images/sc/backYellow.png'),
43: require('../../assets/images/sc/backGreen.png'), // light
'1red': require('../../assets/images/sc/leftRed.png'),
'1yellow': require('../../assets/images/sc/leftYellow.png'),
'1green': require('../../assets/images/sc/leftGreen.png'),
'2red': require('../../assets/images/sc/sRed.png'),
'2yellow': require('../../assets/images/sc/sYellow.png'),
'2green': require('../../assets/images/sc/sGreen.png'),
'3red': require('../../assets/images/sc/rightRed.png'),
'3yellow': require('../../assets/images/sc/rightYellow.png'),
'3green': require('../../assets/images/sc/rightGreen.png'),
'4red': require('../../assets/images/sc/backRed.png'),
'4yellow': require('../../assets/images/sc/backYellow.png'),
'4green': require('../../assets/images/sc/backGreen.png'), // light
}
}
wj-manage-web/src/dao/historyTrack.js
View file @ edfd5c94
import fetch from '@/utils/fetch'
import request from '../utils/request'
// 行人轨迹查询
export const passerbyTrack = (data) => fetch('/holo/histrory-track/pedestrian-efficiency', data, 'POST')
export const passerbyTrack = (data) =>
request({
url: '/holo/histrory-track/pedestrian-efficiency',
method: 'post',
data: data,
responseType:'arraybuffer'
})
// 非机动车历史轨迹
export const noVehicleTrack = (data) => fetch('/holo/histrory-track/non-motor-efficiency', data, 'POST')
export const noVehicleTrack = (data) =>
request({
url: '/holo/histrory-track/non-motor-efficiency',
method: 'post',
data: data,
responseType:'arraybuffer'
})
// 机动车历史轨迹
export const vehicleTrack = (data) => fetch('/holo/histrory-track/motor-efficiency', data, 'POST')
export const vehicleTrack = (data) =>
request({
url: '/holo/histrory-track/motor-efficiency',
method: 'post',
data: data,
responseType:'arraybuffer'
})
// 所有轨迹
export const allTrack = (data) => fetch('/holo/histrory-track/info', data, 'POST')
\ No newline at end of file
export const allTrack = (data) =>
request({
url: '/holo/histrory-track/info',
method: 'post',
data: data,
responseType:'arraybuffer'
})
\ No newline at end of file
wj-manage-web/src/utils/mapboxTools.js
View file @ edfd5c94
......@@ -87,7 +87,8 @@ export function addOrUpdateLightLayers(map, geo) {
"icon-size": 0.7,
"icon-image": ["get", "ts"],
"icon-pitch-alignment": "map",
"icon-rotate": ["+", ["*", ["get", "roadDir"], 45], 140],
// "icon-rotate": ["+", ["*", ["get", "roadDir"], 45], 180],
'icon-rotate': ['get', 'lightAngle'],
"icon-rotation-alignment": "map",
},
},
......@@ -105,7 +106,8 @@ export function addOrUpdateLightLayers(map, geo) {
"text-size": 14,
"text-pitch-alignment": "map",
"text-rotation-alignment": "map",
"text-rotate": ["+", ["*", ["get", "roadDir"], 45], 140],
'text-rotate': ['get', 'lightAngle'],
// "text-rotate": ["+", ["*", ["get", "roadDir"], 45], 180],
},
paint: {
"text-color": "white",
......@@ -114,11 +116,11 @@ export function addOrUpdateLightLayers(map, geo) {
"text-halo-color": [
"match",
["get", "state"], // 属性字段名称
"1",
"red",
"rgba(255, 130, 130, 0.5)",
"2",
"yellow",
"rgba(255, 179, 0, 0.5)",
"3",
"green",
"rgba(48, 255, 141, 0.5)",
"rgba(255,255,255,1)", // 默认值，如果没有匹配到上述枚举值
],
......@@ -453,6 +455,7 @@ export function addOrUpdateCrossName(map, geo) {
// 交通事件热力图
export function addOrUpdateEventHeat(map, geo, callback) {
console.log(geo, 7777777777777777777);
if (!map.getSource("eventHeat")) {
map.addSource("eventHeat", {
type: "geojson",
......@@ -802,7 +805,7 @@ export function addOrUpdateRoadPolygon(map, geo, callback) {
}
// "vehicle3D"
);
map.on("click", "roadPolygon", (aaa) => callback(aaa));
// map.on("click", "roadPolygon", (aaa) => callback(aaa));
}
}
......
wj-manage-web/src/utils/request.js
View file @ edfd5c94
......@@ -57,11 +57,13 @@ service.interceptors.request.use(config => {
// 响应拦截器
service.interceptors.response.use(res => {
// console.log('axios response...', res);
console.log('axios response...', res);
// 未设置状态码则默认成功状态
const code = res.data.code || 200;
// 二进制数据则直接返回
if (res.request.responseType === 'blob' || res.request.responseType === 'arraybuffer') {
// 给二进制数据添加对应的请求参数信息，避免接收到不需要的数据
// return { data: res.data, params: JSON.parse(res.config.data) }
return res.data
}
if (code === 401) {
......
wj-manage-web/src/views/efficiency/crossCompare.vue
View file @ edfd5c94
......@@ -183,7 +183,7 @@ export default {
return (
Math.abs(
Number(scope.row.current) - Number(scope.row.compare)
).toFixed(2) + "pcu/h"
).toFixed(0)
);
}
if (scope.row.indexName.includes("时间")) {
......@@ -208,7 +208,7 @@ export default {
if (typeof scope.row[which] === "boolean") {
return "暂无数据";
}
return scope.row[which].toFixed(2)
return scope.row[which].toFixed(0)
}
if (scope.row.indexName.includes("时间")) {
if (typeof scope.row[which] === "boolean") {
......
wj-manage-web/src/views/efficiency/index.vue
View file @ edfd5c94
......@@ -78,6 +78,7 @@
<path-map-ctrl
:params="pathParam"
:apiName="pathApiName"
:showTime="true"
class="common_map"
ref="tab_map"
:showFilter="showFilter"
......@@ -107,8 +108,6 @@
v-if="item.valueList && item.valueList.length"
>
{{ getCheckItemValue(item) }}
<span v-show="item.label.includes('率')">%</span>
<span v-show="item.label.includes('时长')">s</span>
</span>
</el-checkbox>
</el-checkbox-group>
......@@ -245,8 +244,6 @@
v-if="item.valueList && item.valueList.length"
>
{{ getCheckItemValue(item) }}
<span v-show="item.label.includes('率')">%</span
><span v-show="item.label.includes('时长')">s</span>
</span>
</el-checkbox>
</el-checkbox-group>
......@@ -356,17 +353,24 @@ export default {
methods: {
beforeLeave() {
// 轨迹组件接口还在请求中，暂不可切换tab
if (this.$refs.tab_map.loading) {
return false;
}
// if (this.$refs.tab_map.loading) {
// return false;
// }
return true
},
getCheckItemValue(item) {
return item.valueList
? item.label.includes("率")
? (item.valueList[item.valueList.length - 1] * 100).toFixed(2)
: item.valueList[item.valueList.length - 1]
: "";
// return item.valueList[item.valueList.length - 1];
if (item.valueList && item.valueList.length) {
if (item.label.includes("率") || item.label.includes("占比")) {
return `${(
Number(item.valueList[item.valueList.length - 1]) * 100
).toFixed(0)}%`;
} else if (item.label.includes("时长")) {
return `${item.valueList[item.valueList.length - 1]}s`;
} else {
return `${item.valueList[item.valueList.length - 1]}`;
}
}
return "";
},
upOrDown(inverse) {
if (this.fullData && this.fullData.current) {
......@@ -771,11 +775,6 @@ export default {
startTime: this.tableCurrentData.windowStartTime,
endTime: this.tableCurrentData.windowEndTime,
crossId: this.currentCrossId,
// startTime: "2023-05-21 18:22:25",
// endTime: "2023-05-21 18:28:30",
// startTime: "2023-05-21 18:28:25",
// endTime: "2023-05-21 18:28:30",
// crossId: "12F6S08J8T0",
};
this.pathApiName = "passerbyTrack";
this.$nextTick(() => {
......@@ -788,6 +787,8 @@ export default {
passerbyEfficiency({
crossId: this.currentCrossId,
granularity: this.timeInterval,
startDate:this.tableCurrentData.windowStartTime,
endDate:this.tableCurrentData.windowEndTime
}).then((res) => {
this.tab1Loading = false;
console.log("行人效率", res.content);
......@@ -831,13 +832,15 @@ export default {
noVehicleTable({
crossId: this.currentCrossId,
granularity: this.timeInterval,
startDate:this.tableCurrentData.windowStartTime,
endDate:this.tableCurrentData.windowEndTime
}).then((res) => {
this.tab2Loading1 = false;
console.log("非机动车效率", res.content);
this.tableData = [];
for (let item of res.content) {
if ([1, 2, 3].includes(item.type)) {
let obj = { total: item.total, label: item.label };
let obj = { total: item.total||0, label: item.label };
for (let option of item.list) {
obj[this.turnMap[option.turnNo]] = option.number;
}
......@@ -849,6 +852,8 @@ export default {
noVehicleEfficiency({
crossId: this.currentCrossId,
granularity: this.timeInterval,
startDate:this.tableCurrentData.windowStartTime,
endDate:this.tableCurrentData.windowEndTime
}).then((res) => {
this.tab2Loading2 = false;
if (res.content.length) {
......@@ -880,6 +885,8 @@ export default {
vehicleEfficiency({
crossId: this.currentCrossId,
granularity: this.timeInterval,
startDate:this.tableCurrentData.windowStartTime,
endDate:this.tableCurrentData.windowEndTime
}).then((res) => {
this.tab3Loading = false;
console.log("机动车效率", res.content);
......@@ -939,6 +946,7 @@ export default {
.track-result-table {
overflow: auto;
//height: 400px;
background-color: #0a1526;
.el-icon-video-play:before {
color: #5b90ee;
font-size: 16px;
......@@ -1118,7 +1126,7 @@ export default {
display: flex;
justify-content: space-between;
flex-flow: wrap;
height: 42%;
height: 45%;
align-items: stretch;
::v-deep .el-checkbox {
width: 33.3%;
......@@ -1151,7 +1159,7 @@ export default {
}
.form_chart {
height: 58%;
height: 55%;
.ef_chart {
width: 100%;
......
wj-manage-web/src/views/organization/cameraImage.vue
View file @ edfd5c94
......@@ -2,7 +2,7 @@
<div class="custom-dialog">
<div class="dialog-main">
<div class="holo-dialog-header">
<div>非机动车佩戴头盔率：{{ helmetRate }}</div>
<div>非机动车佩戴头盔率：{{ currentBarRate }}</div>
<div>
<i class="el-icon-close holo-dialog-close" @click="closeDia"></i>
</div>
......@@ -38,18 +38,20 @@ export default {
data() {
return {
currentHelmetImg: "#",
currentPage: 0,
currentPage: 1,
totalPage: 0,
loading: false,
};
},
props: ["timeRange", 'cameraId'],
props: ["getImageProps", "currentBarRate",'compInitImg'],
mounted() {
this.getImage();
this.currentHelmetImg = this.compInitImg.url
this.totalPage = this.compInitImg.total
// this.getImage();
},
methods: {
getLastImage() {
if (this.currentPage - 1 < 0) {
if (this.currentPage - 1 < 1) {
ELEMENT.Message("已经是第一张图片！");
return;
}
......@@ -67,15 +69,17 @@ export default {
getImage() {
this.loading = true;
helmetRateImages({
cameraId: this.cameraId,
startDate: "2023-10-27 15:00:00",
endDate: "2023-10-27 15:00:00",
...this.getImageProps,
page: this.currentPage,
size: 1,
}).then((res) => {
this.loading = false;
if (res.content.rows && res.content.rows.length) {
this.currentHelmetImg = `data:image/png;base64,${res.content.rows[0].shootImage}`;
this.totalPage = res.content.total;
} else {
ELEMENT.Message("此相机当前时段无图片信息！");
}
});
},
closeDia() {
......
wj-manage-web/src/views/organization/mapFlow.vue
View file @ edfd5c94
......@@ -100,7 +100,8 @@ export default {
this.mapPolygons.push(feature);
}
let geo = turf.featureCollection(this.mapPolygons);
addOrUpdateRoadPolygon(map, geo, this.crossPolygonClick);
addOrUpdateRoadPolygon(map, geo);
map.on("click", "roadPolygon", this.crossPolygonClick);
console.log("转向弧线", line);
console.log("车道流量", flow);
this.flowJson = [];
......
wj-manage-web/src/views/safety/analysisTypes.vue
View file @ edfd5c94
......@@ -46,7 +46,7 @@
header-row-class-name="custom-table-header"
header-cell-class-name="custom-table-header-cell"
>
<el-table-column align='center' min-width="40" label="事件ID" prop="id">
<el-table-column align='center' min-width="40" label="事件ID" prop="eventId">
</el-table-column>
<el-table-column align='center'
min-width="50"
......@@ -154,6 +154,15 @@ export default {
return "未定义";
},
setBarOption() {
console.log('this.series1',this.series1);
let maxData = 0
for(let item of this.series1){
if(item.value){
maxData = Math.max(maxData, item.value)
}else{
maxData = Math.max(maxData, item)
}
}
let colors = [
"rgba(65, 130, 242,1)",
"rgba(255, 166, 0,1)",
......@@ -254,7 +263,7 @@ export default {
axisLine: {
show: false,
},
// max: ,
max: maxData+12,
splitLine: {
show: true,
lineStyle: {
......@@ -272,10 +281,9 @@ export default {
markLine: {
silent: true,
data: [
{
symbol: "none",
{ symbol: "none",
name: "警戒线",
yAxis: 60,
yAxis: maxData+10,
lineStyle: {
color: "rgba(173, 158, 21, 1)",
type: "solid",
......@@ -291,25 +299,25 @@ export default {
},
},
},
{
symbol: "none",
name: "事故线",
yAxis: 90,
label: {
color: "rgba(217, 231, 255, 1)",
fontSize: 12,
show: true,
position: "insideEnd",
formatter: () => {
return "事故线";
},
},
lineStyle: {
color: "rgba(212, 48, 48, 1)",
type: "solid",
cap: "butt",
},
},
// {
// symbol: "none",
// name: "事故线",
// yAxis: 90,
// label: {
// color: "rgba(217, 231, 255, 1)",
// fontSize: 12,
// show: true,
// position: "insideEnd",
// formatter: () => {
// return "事故线";
// },
// },
// lineStyle: {
// color: "rgba(212, 48, 48, 1)",
// type: "solid",
// cap: "butt",
// },
// },
],
},
itemStyle: {
......
wj-manage-web/src/views/safety/index.vue
View file @ edfd5c94
......@@ -58,6 +58,7 @@
<path-map-ctrl
:params="pathParam"
:apiName="pathApiName"
:eventTargetVehicleGlobalId="eventTargetVehicleGlobalId"
ref="pathMap"
:showCtrl="true"
class="commonPathMap"
......@@ -166,9 +167,6 @@ export default {
},
mounted() {},
methods: {
refreshHeatMap(tableData) {
this.$refs.pathMap?.refreshHeatMap(tableData);
},
dayTypeChange() {
this.$nextTick(() => {
this.$refs[`comp${this.tabsActiveName}`].refreshBarChart();
......@@ -200,7 +198,10 @@ export default {
},
eventPlay(row) {
console.log("event play...", row);
// 历史轨迹视频 && 接口api名称
this.cameraType = "history";
this.pathApiName = "allTrack";
this.eventTargetVehicleGlobalId = row.globalId;
if (row.cameraChannels) {
this.cameraChannels = row.cameraChannels.split(","); // todo
} else {
......@@ -213,12 +214,10 @@ export default {
startTime: this.getTimeToDate(startT),
endTime: this.getTimeToDate(endT),
};
this.pathParam = {
...this.cameraTimeBetween,
crossId: row.crossId,
};
this.pathApiName = "allTrack";
this.$nextTick(() => {
this.$refs.pathMap.getTracksAndPlay();
});
......@@ -229,17 +228,17 @@ export default {
Object.keys(this.currentCrossData).length &&
Object.keys(this.compareCrossData).length
) {
if (type === "level") {
return Number(this.currentCrossData[param]) >
if (
Number(this.currentCrossData[param]) >
Number(this.compareCrossData[param])
? this.down
: this.up;
) {
return type === "level" ? this.down : this.up;
}
if (type === "number") {
return Number(this.currentCrossData[param]) <
if (
Number(this.currentCrossData[param]) <
Number(this.compareCrossData[param])
? this.down
: this.up;
) {
return type === "level" ? this.up : this.down;
}
}
return "";
......@@ -251,7 +250,7 @@ export default {
},
// 选择不同路口 => 更新右侧所有数据
crossChange(row) {
this.$refs.pathMap.clearMap();
this.clearPath();
this.currentCrossData = row;
this.$refs[`comp${this.tabsActiveName}`].initData();
if (Array.isArray(row.cameraList)) {
......
wj-manage-web/src/views/situation/MapPopup/eventPopup.vue
View file @ edfd5c94
......@@ -3,8 +3,8 @@
<div class="header">事件详情</div>
<div class="main">
<div class="detail_item" v-for="item of eventDetails" :key="item._id">
<div class="label">{{ item.label }}</div>
<div class="value">{{ item.value }}</div>
<div class="detail_item_label">{{ item.label }}</div>
<div class="detail_item_value">{{ item.value }}</div>
</div>
</div>
</div>
......@@ -77,13 +77,13 @@ export default {
background-position-y: center;
background-repeat: no-repeat;
.label {
.detail_item_label {
padding-left: 30PX;
//line-height: 24PX;
color: #bcdaec;
}
.value {
.detail_item_value {
//line-height: 24PX;
color: white;
overflow: hidden;
......
wj-manage-web/src/views/situation/index.vue
View file @ edfd5c94
This diff is collapsed.
wj-manage-web/src/views/situation/messageBoxes.vue
View file @ edfd5c94
......@@ -374,7 +374,7 @@ export default {
for (let helmet of helmetData) {
total += Number(helmet.illegalNum);
}
this.avgHelMet = ((total / helmetData.length) * 100).toFixed(2) + "%";
this.avgHelMet = ((total / helmetData.length) * 100).toFixed(0) + "%";
} else {
this.avgHelMet = "-";
}
......@@ -457,6 +457,9 @@ export default {
crossFlow().then((res) => {
console.log("路口流量", res);
this.trafficFlowData.cross = res.content;
res.content.flowList = res.content.flowList.sort((a,b)=>{
return a.name.localeCompare(b.name)
})
if (init) {
this.$nextTick(() => {
this.trafficFlow(this.trafficFlowData.cross, true);
......@@ -466,6 +469,9 @@ export default {
//路段
ridFlow().then((res) => {
console.log("路段流量", res);
res.content.flowList = res.content.flowList.sort((a,b)=>{
return a.name.localeCompare(b.name)
})
this.trafficFlowData.road = res.content;
});
},
......@@ -532,6 +538,10 @@ export default {
"rgba(233, 66, 66,1)",
"rgba(75, 75, 75,1)",
];
let unitMap = {
'最大行程时间':'min',
"行驶速度":'km/h'
}
let option = {
tooltip: {
transitionDuration: 0,
......@@ -543,6 +553,7 @@ export default {
formatter: (params) => {
let back = `${params.name}</br>`;
for (let i = 0; i < params.data.key.length; i++) {
let unit = unitMap[params.data.key[i]]||''
if (params.data.key[i] === "交通状态") {
let realValue = "";
for (let item of this.trafficMap) {
......@@ -552,7 +563,7 @@ export default {
}
back += `${params.data.key[i]} : ${realValue} </br>`;
} else {
back += `${params.data.key[i]} : ${params.data.value[i]} </br>`;
back += `${params.data.key[i]} : ${params.data.value[i]} ${unit}</br>`;
}
}
return back;
......@@ -703,7 +714,7 @@ export default {
str += `<p>${params[i].seriesName}&nbsp;&nbsp;:&nbsp;&nbsp;${params[i].value}</p>`;
}
var tooltipHtml =
'<div style="max-height:150px;overflow-y:auto">' +
'<div style="max-height:120px;overflow-y:auto">' +
str +
"</div>";
return tooltipHtml;
......@@ -834,13 +845,17 @@ export default {
confine: true,
formatter: (params) => {
let back = ``;
let unitMap = {
'机动车速度':'km/h'
}
for (let item of params) {
let unit = unitMap[item.seriesName] || ''
if (
[pedNumLabel, notVehicleNumLabel, vehicleNumLabel].includes(
item.seriesName
)
) {
back += `${item.seriesName}&nbsp;&nbsp:&nbsp;&nbsp${item.data}</br>`;
back += `${item.seriesName}&nbsp;&nbsp:&nbsp;&nbsp${item.data} ${unit}</br>`;
}
}
return back;
......
wj-manage-web/src/views/track/index.vue
View file @ edfd5c94
This diff is collapsed.
wj-manage-web/src/views/track/menuKeyVehicle.vue
View file @ edfd5c94
......@@ -19,7 +19,7 @@
<el-table-column min-width="50" type="index" label="序号">
</el-table-column>
<el-table-column
min-width="60"
min-width="80"
:show-overflow-tooltip="true"
prop="plateNum"
label="号牌号码"
......@@ -37,7 +37,7 @@
{{ getNameByCode(scope.row && scope.row.type, "CarType") }}
</template>
</el-table-column>
<el-table-column
<!-- <el-table-column
min-width="60"
:show-overflow-tooltip="true"
label="使用性质"
......@@ -45,7 +45,7 @@
<template slot-scope="scope">
{{ getNameByCode(scope.row && scope.row.function, "Nature") }}
</template>
</el-table-column>
</el-table-column> -->
<el-table-column
min-width="80"
:show-overflow-tooltip="true"
......
wj-manage-web/src/views/track/menuTrafficCrowd.vue
View file @ edfd5c94
......@@ -188,8 +188,7 @@
<script>
import Pagination from "../../components/Standard/pigination.vue";
import { crowdTracksList, multiVehicleTrackDetail } from "../../dao/track";
import { crowdTracksList, multiVehicleTrackDetail,getLightByTimeAndCrossId } from "../../dao/track";
import MsgCard from "../../components/Standard/msg-card.vue";
export default {
......@@ -326,6 +325,7 @@ export default {
playTrack(rowData) {
this.fullscreenLoading = true;
console.log("row", rowData);
this.getLight({ startTime: rowData.startTime, endTime: rowData.endTime });
multiVehicleTrackDetail({
startTime: rowData.startTime,
endTime: rowData.endTime,
......@@ -334,12 +334,33 @@ export default {
console.log("多车详情", res);
this.fullscreenLoading = false;
if (res.content.length) {
this.$emit("playFullTrack", res.content, [rowData.lng, rowData.lat]);
this.$emit("playFullTrack", res.content, rowData);
} else {
this.$message.warning("该段时间无轨迹数据...");
}
});
},
// 获取时间区间内的历史灯态
getLight(timeRange) {
this.$emit('getHisLights',[])
let toSend = [];
for (let crossId of ["13NF80B5QN0", "13NGH0B5RC0", "13NI00B5RM0"]) {
toSend.push({
startBatchTime: new Date(timeRange.startTime).getTime() / 1000,
endBatchTime: new Date(timeRange.endTime).getTime() / 1000,
crossId: crossId,
});
}
console.log("timeRange", timeRange);
Promise.all([
getLightByTimeAndCrossId(toSend[0]),
getLightByTimeAndCrossId(toSend[1]),
getLightByTimeAndCrossId(toSend[2]),
]).then(([res1, res2, res3]) => {
console.log("历史灯态", res1, res2, res3);
this.$emit('getHisLights',[...res1.content, ...res2.content, ...res3.content])
});
},
// 搜索符合表单条件的轨迹
searchVehicleTracks() {
this.currentPage = 1;
......
wj-manage-web/src/views/track/menuTrafficEvent.vue
View file @ edfd5c94
......@@ -89,7 +89,7 @@
</el-form-item>
<el-form-item label="号牌号码:" prop="plateNum">
<el-input
:maxlength='64'
:maxlength="64"
clearable
placeholder="请输入车辆号牌号码"
v-model="searchForm.plateNum"
......@@ -165,7 +165,9 @@
min-width="60"
prop="plateNo"
label="号牌号码"
><template slot-scope="scope">{{scope.row.plateNo || '-'}}</template>
><template slot-scope="scope">{{
scope.row.plateNo || "-"
}}</template>
</el-table-column>
<el-table-column fixed="right" min-width="60" label="事件轨迹">
<template slot-scope="scope">
......@@ -195,6 +197,7 @@ import {
eventTracksList,
getEventVideo,
multiVehicleTrackDetail,
getLightByTimeAndCrossId
} from "../../dao/track";
import MsgCard from "../../components/Standard/msg-card.vue";
......@@ -358,11 +361,16 @@ export default {
};
Promise.all([eventTracksList(sendData), equip_camera()]).then(
([table, camera]) => {
console.log("table && camera", table, camera);
// console.log("table && camera", table, camera);
for (let i = 0; i < table.content.rows.length; i++) {
table.content.rows[i].channels = camera.content.filter((item) => {
return item.crossId === table.content.rows[i].crossId;
// table.content.rows[i].channels = camera.content.filter((item) => {
// return item.crossId === table.content.rows[i].crossId;
// });
let channels = table.content.rows[i].cameraChannels.split(",");
let fChannels = channels.filter((item) => {
return item !== "";
});
table.content.rows[i].channels = fChannels;
}
this.tableData = table.content.rows;
this.tableTotal = table.content.total;
......@@ -384,21 +392,40 @@ export default {
async playTrack(rowData) {
console.log("rowData", rowData);
this.fullscreenLoading = true;
this.getLight({ startTime: rowData.startTime, endTime: rowData.endTime });
multiVehicleTrackDetail({
startTime: rowData.startTime,
endTime: rowData.endTime,
}).then((res) => {
this.fullscreenLoading = false;
if (res.content.length) {
this.$emit("playFullTrackWithVideo", res.content, rowData, [
rowData.lng,
rowData.lat,
]);
this.$emit("playFullTrackWithVideo", res.content, rowData);
} else {
this.$message.warning("该段时间无轨迹数据...");
}
});
},
// 获取时间区间内的历史灯态
getLight(timeRange) {
this.$emit('getHisLights',[])
let toSend = [];
for (let crossId of ["13NF80B5QN0", "13NGH0B5RC0", "13NI00B5RM0"]) {
toSend.push({
startBatchTime: new Date(timeRange.startTime).getTime() / 1000,
endBatchTime: new Date(timeRange.endTime).getTime() / 1000,
crossId: crossId,
});
}
console.log("timeRange", timeRange);
Promise.all([
getLightByTimeAndCrossId(toSend[0]),
getLightByTimeAndCrossId(toSend[1]),
getLightByTimeAndCrossId(toSend[2]),
]).then(([res1, res2, res3]) => {
console.log("历史灯态", res1, res2, res3);
this.$emit('getHisLights',[...res1.content, ...res2.content, ...res3.content])
});
},
// 轨迹（仅展示）
showTrack(tracks) {
this.$emit("showTrack", tracks);
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment