Skip to content

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

群组页面部分图表数据接口配置化

parent 98f22c9f
Expand all Hide whitespace changes
Inline Side-by-side
Showing with 510 additions and 2016 deletions
wj-data-vision/public/DATA.json 0 → 100644
View file @ 511c1e13
{
"intersectionGroups": {
"apis":{
"targetTrack":"/holo/event-analysis/queryByType",
"trafficFlowCross":"/holo/cross-flow/list",
"trafficFlowRoad":"/holo/rid-flow/list"
}
}
}
wj-data-vision/src/dao/requestByUrl.js 0 → 100644
View file @ 511c1e13
import request from '../utils/request'
export const getData = (url) =>
request({
url: url,
method: "get",
});
wj-data-vision/src/utils/cache.js 0 → 100644
View file @ 511c1e13
const sessionCache = {
set (key, value) {
if (!sessionStorage) {
return
}
if (key != null && value != null) {
sessionStorage.setItem(key, value)
}
},
get (key) {
if (!sessionStorage) {
return null
}
if (key == null) {
return null
}
return sessionStorage.getItem(key)
},
setJSON (key, jsonValue) {
if (jsonValue != null) {
this.set(key, JSON.stringify(jsonValue))
}
},
getJSON (key) {
const value = this.get(key)
if (value != null) {
return JSON.parse(value)
}
},
remove (key) {
sessionStorage.removeItem(key);
}
}
const localCache = {
set (key, value) {
if (!localStorage) {
return
}
if (key != null && value != null) {
localStorage.setItem(key, value)
}
},
get (key) {
if (!localStorage) {
return null
}
if (key == null) {
return null
}
return localStorage.getItem(key)
},
setJSON (key, jsonValue) {
if (jsonValue != null) {
this.set(key, JSON.stringify(jsonValue))
}
},
getJSON (key) {
const value = this.get(key)
if (value != null) {
return JSON.parse(value)
}
},
remove (key) {
localStorage.removeItem(key);
}
}
export default {
/**
* 会话级缓存
*/
session: sessionCache,
/**
* 本地缓存
*/
local: localCache
}
wj-data-vision/src/utils/request.js
View file @ 511c1e13
import axios from 'axios'
import router from '@/router/index'
import store from '../store'
import { getToken } from '@/utils/auth'
import axios from "axios";
import { tansParams } from "./tools";
import cache from "./cache";
// 是否显示重新登录
export let isRelogin = { show: false };
axios.defaults.headers["Content-Type"] = "application/json;charset=utf-8";
// 创建axios实例
const service = axios.create({
withCredentials: true,
// baseURL: service_config.interface_url,
baseURL:'/',//走入 vue.config.js 中 /develop
timeout: 60000 // 请求超时时间
})
// 超时
timeout: 1000000,
});
// response 拦截器
service.interceptors.response.use(
response => {
const code = response.status
if (code < 200 || code > 300) {
ELEMENT.Notification.error({
title: response.message
})
return Promise.reject('error')
} else {
return response.data
// request拦截器
service.interceptors.request.use(
(config) => {
// console.log('axios request...', config);
// 是否需要防止数据重复提交
const isRepeatSubmit = (config.headers || {}).repeatSubmit === false;
// get请求映射params参数
if (config.method === "get" && config.params) {
let url = config.url + "?" + tansParams(config.params);
url = url.slice(0, -1);
config.params = {};
config.url = url;
}
if (
!isRepeatSubmit &&
(config.method === "post" || config.method === "put")
) {
const requestObj = {
url: config.url,
data:
typeof config.data === "object"
? JSON.stringify(config.data)
: config.data,
time: new Date().getTime(),
};
const sessionObj = cache.session.getJSON("sessionObj");
if (
sessionObj === undefined ||
sessionObj === null ||
sessionObj === ""
) {
cache.session.setJSON("sessionObj", requestObj);
} else {
const s_url = sessionObj.url; // 请求地址
const s_data = sessionObj.data; // 请求数据
const s_time = sessionObj.time; // 请求时间
const interval = 1000; // 间隔时间(ms)，小于此时间视为重复提交
if (
s_data === requestObj.data &&
requestObj.time - s_time < interval &&
s_url === requestObj.url
) {
const message = "数据正在处理，请勿重复提交";
console.warn(`[${s_url}]: ` + message);
return Promise.reject(new Error(message));
} else {
cache.session.setJSON("sessionObj", requestObj);
}
}
}
return config;
},
error => {
let code = 0
try {
code = error.response.data.status
} catch (e) {
if (error.toString().indexOf('timeout')) {
ELEMENT.Notification.error({
title: '请求超时',
duration: 2500
})
return Promise.reject(error)
(error) => {
console.log(error);
Promise.reject(error);
}
);
// 响应拦截器
service.interceptors.response.use(
(res) => {
console.log("axios response...", res);
// 未设置状态码则默认成功状态
const code = res.data.code || 200;
// 二进制数据则直接返回
if (
res.request.responseType === "blob" ||
res.request.responseType === "arraybuffer"
) {
let enc = new TextDecoder("utf-8");
let json = null
try {
json = JSON.parse(enc.decode(new Uint8Array(res.data)));
} catch (e) {
json = res.data
}
return json
}
if (code === 401) {
ELEMENT.MessageBox.confirm(
'登录状态过期了哦，您可以继续留在该页面，或者重新登录',
'系统提示',
{
confirmButtonText: '重新登录',
cancelButtonText: '取消',
type: 'warning'
}
).then(() => {
store.dispatch('LogOut').then(() => {
location.reload() // 为了重新实例化vue-router对象 避免bug
})
})
} else if (code === 403) {
router.push({ path: '/401' })
if (!ELEMENT.$_overTime) {
ELEMENT.$_overTime = ELEMENT.Notification.error({
title: "失败",
message: "code 401, 3秒后退出登录",
});
setTimeout(() => {
window.location.href = "/";
}, 3000);
}
return Promise.reject("无效的会话，或者会话已过期，请重新登录。");
}
if (code == 200) {
if (res.config.showMsg) {
ELEMENT.Message.success(res.data.message || res.data.status);
}
return res.data;
} else {
const errorMsg = error.response.data.message
if (errorMsg !== undefined) {
ELEMENT.Notification.error({
title: errorMsg,
duration: 2500
})
if (res.config.showMsg) {
ELEMENT.Message.error(res.data.message || res.data.status);
}
return null
}
return Promise.reject(error)
},
(error) => {
ELEMENT.Message.error(error.message);
return Promise.reject(error);
}
)
export default service
);
export function getBlob(url) {
return service
.get(url, {
headers: { "Content-Type": "application/x-www-form-urlencoded" },
responseType: "blob",
})
.then(async (data) => {
const blob = new Blob([data]);
return blob;
});
}
export default service;
wj-data-vision/src/utils/tools.js 0 → 100644
View file @ 511c1e13
/**
* 通用js方法封装处理
* Copyright (c) 2019 ruoyi
*/
// 日期格式化
export function parseTime(time, pattern) {
if (arguments.length === 0 || !time) {
return null
}
const format = pattern || '{y}-{m}-{d} {h}:{i}:{s}'
let date
if (typeof time === 'object') {
date = time
} else {
if ((typeof time === 'string') && (/^[0-9]+$/.test(time))) {
time = parseInt(time)
} else if (typeof time === 'string') {
time = time.replace(new RegExp(/-/gm), '/').replace('T', ' ').replace(new RegExp(/\.[\d]{3}/gm), '');
}
if ((typeof time === 'number') && (time.toString().length === 10)) {
time = time * 1000
}
date = new Date(time)
}
const formatObj = {
y: date.getFullYear(),
m: date.getMonth() + 1,
d: date.getDate(),
h: date.getHours(),
i: date.getMinutes(),
s: date.getSeconds(),
a: date.getDay()
}
const time_str = format.replace(/{(y|m|d|h|i|s|a)+}/g, (result, key) => {
let value = formatObj[key]
// Note: getDay() returns 0 on Sunday
if (key === 'a') { return ['日', '一', '二', '三', '四', '五', '六'][value] }
if (result.length > 0 && value < 10) {
value = '0' + value
}
return value || 0
})
return time_str
}
// 表单重置
export function resetForm(refName) {
if (this.$refs[refName]) {
this.$refs[refName].resetFields();
}
}
// 添加日期范围
export function addDateRange(params, dateRange, propName) {
let search = params;
search.params = typeof (search.params) === 'object' && search.params !== null && !Array.isArray(search.params) ? search.params : {};
dateRange = Array.isArray(dateRange) ? dateRange : [];
if (typeof (propName) === 'undefined') {
search.params['beginTime'] = dateRange[0];
search.params['endTime'] = dateRange[1];
} else {
search.params['begin' + propName] = dateRange[0];
search.params['end' + propName] = dateRange[1];
}
return search;
}
// 回显数据字典
export function selectDictLabel(datas, value) {
if (value === undefined) {
return "";
}
var actions = [];
Object.keys(datas).some((key) => {
if (datas[key].value == ('' + value)) {
actions.push(datas[key].label);
return true;
}
})
if (actions.length === 0) {
actions.push(value);
}
return actions.join('');
}
// 回显数据字典（字符串、数组）
export function selectDictLabels(datas, value, separator) {
if (value === undefined || value.length ===0) {
return "";
}
if (Array.isArray(value)) {
value = value.join(",");
}
var actions = [];
var currentSeparator = undefined === separator ? "," : separator;
var temp = value.split(currentSeparator);
Object.keys(value.split(currentSeparator)).some((val) => {
var match = false;
Object.keys(datas).some((key) => {
if (datas[key].value == ('' + temp[val])) {
actions.push(datas[key].label + currentSeparator);
match = true;
}
})
if (!match) {
actions.push(temp[val] + currentSeparator);
}
})
return actions.join('').substring(0, actions.join('').length - 1);
}
// 字符串格式化(%s )
export function sprintf(str) {
var args = arguments, flag = true, i = 1;
str = str.replace(/%s/g, function () {
var arg = args[i++];
if (typeof arg === 'undefined') {
flag = false;
return '';
}
return arg;
});
return flag ? str : '';
}
// 转换字符串，undefined,null等转化为""
export function parseStrEmpty(str) {
if (!str || str == "undefined" || str == "null") {
return "";
}
return str;
}
// 数据合并
export function mergeRecursive(source, target) {
for (var p in target) {
try {
if (target[p].constructor == Object) {
source[p] = mergeRecursive(source[p], target[p]);
} else {
source[p] = target[p];
}
} catch (e) {
source[p] = target[p];
}
}
return source;
};
/**
* 构造树型结构数据
* @param {*} data 数据源
* @param {*} id id字段 默认 'id'
* @param {*} parentId 父节点字段 默认 'parentId'
* @param {*} children 孩子节点字段 默认 'children'
*/
export function handleTree(data, id, parentId, children) {
let config = {
id: id || 'id',
parentId: parentId || 'parentId',
childrenList: children || 'children'
};
var childrenListMap = {};
var nodeIds = {};
var tree = [];
for (let d of data) {
let parentId = d[config.parentId];
if (childrenListMap[parentId] == null) {
childrenListMap[parentId] = [];
}
nodeIds[d[config.id]] = d;
childrenListMap[parentId].push(d);
}
for (let d of data) {
let parentId = d[config.parentId];
if (nodeIds[parentId] == null) {
tree.push(d);
}
}
for (let t of tree) {
adaptToChildrenList(t);
}
function adaptToChildrenList(o) {
if (childrenListMap[o[config.id]] !== null) {
o[config.childrenList] = childrenListMap[o[config.id]];
}
if (o[config.childrenList]) {
for (let c of o[config.childrenList]) {
adaptToChildrenList(c);
}
}
}
return tree;
}
/**
* 参数处理
* @param {*} params 参数
*/
export function tansParams(params) {
let result = ''
for (const propName of Object.keys(params)) {
const value = params[propName];
var part = encodeURIComponent(propName) + "=";
if (value !== null && value !== "" && typeof (value) !== "undefined") {
if (typeof value === 'object') {
for (const key of Object.keys(value)) {
if (value[key] !== null && value[key] !== "" && typeof (value[key]) !== 'undefined') {
let params = propName + '[' + key + ']';
var subPart = encodeURIComponent(params) + "=";
result += subPart + encodeURIComponent(value[key]) + "&";
}
}
} else {
result += part + encodeURIComponent(value) + "&";
}
}
}
return result
}
// 验证是否为blob格式
export async function blobValidate(data) {
try {
const text = await data.text();
JSON.parse(text);
return false;
} catch (error) {
return true;
}
}
\ No newline at end of file
wj-data-vision/src/views/accidentScene/index.vue
View file @ 511c1e13
......@@ -24,7 +24,6 @@ import HomeLeft from "./left/index.vue";
import HomeRight from "./right/index.vue";
import vehicleDetail from "./mapPopup/vehicleDetail.vue";
import vehicleDetail1 from "./mapPopup/vehicleDetailBottom.vue";
import * as myMixin from "../setColor";
import generalVehiclePopup from '../mapComponents/generalVehicleDetail.vue'
const GeneralVehiclePopup = Vue.extend(generalVehiclePopup);
......@@ -37,24 +36,11 @@ let map,
popupInstances = {},
lastFrameTime = "",
vehicleModelTypes = {},
greenPolygonLayer = null,
popComp1,
popComp2,
layers = {
first: {
vehicle: null,
license: null,
trackLineLayer: null,
trackLineLayer1: null,
},
},
//---
vehiclePopups = {},
popupVises = {},
vehiclePopupInstances = {},
//---
popup1 = null,
popup2 = null,
popups = {};
export default {
......@@ -621,11 +607,6 @@ export default {
});
});
return Promise.all(closePromises).then(() => {
// for (let key in this.layers) {
// for (let layer of this.layers[key]) {
// this.removeLayers(layer);
// }
// }
this.sockets = [];
});
},
......
wj-data-vision/src/views/dangerousDriving/index.vue
View file @ 511c1e13
......@@ -22,7 +22,6 @@ import mapAssets from "../../config/holo/mapAssets";
import HomeLeft from "./left/index.vue";
import HomeRight from "./right/index.vue";
import vehicleDetail from "./mapPopup/vehicleDetail.vue";
import * as myMixin from "../setColor";
import generalVehiclePopup from '../mapComponents/generalVehicleDetail.vue'
const GeneralVehiclePopup = Vue.extend(generalVehiclePopup);
......
wj-data-vision/src/views/drones/index.vue
View file @ 511c1e13
......@@ -14,7 +14,6 @@ import dict from "../../config/holo/dictionary";
import * as mapTools from "../../utils/mapboxTools";
import mapAssets from "../../config/holo/mapAssets";
import * as myMixin from "../setColor";
import HomeLeft from "./left/index.vue";
import HomeRight from "./right/index.vue";
......
wj-data-vision/src/views/intersectionGroups/layersSwitch.vue
View file @ 511c1e13
......@@ -20,7 +20,6 @@
:class="[{ 'expand-i': !show }, { 'close-i': show }]"
@click="changeVisibel"
>
<!-- {{ show ? "收起" : "展开" }} -->
</div>
</div>
</template>
......
wj-data-vision/src/views/intersectionGroups/mapPopup/cameraPopup.vue
View file @ 511c1e13
......@@ -3,8 +3,6 @@
<div class="equip_camera">
<div class="header">{{ model.cName }}</div>
<div class="main">
<!-- <camera-video :id="model.videoUrl" :auto-play="true" style="height: 100%"-->
<!-- :video-data="model && model.videoUrl"/>-->
<local-camera ref="videoItem" class="videoItem" :video-data="model.videoUrl"/>
</div>
</div>
......@@ -27,11 +25,9 @@ export default {
},
methods: {
startVideo(time) {
console.log(this.$refs.videoItem)
for (let item of this.$refs.videoItem) {
item.setTime(time)
}
// this.$refs.videoItem.setTime(time)
},
},
computed: {},
......
wj-data-vision/src/views/intersectionGroups/messageBoxes.vue
View file @ 511c1e13
......@@ -32,9 +32,6 @@
<div class="title comm">平均行程速度</div>
</div>
</div>
<!-- <div class="left_box aside" :class="[{ hide_left: !show }]">
</div> -->
<div class="right_box aside" :class="[{ hide_right: !show }]">
<target-track />
<traffic-flow />
......@@ -54,19 +51,9 @@ import conflictMonitor from "./msgRight/conflictMonitor.vue";
import trafficEvent from "./msgRight/trafficEvent.vue";
import warningData from "./msgRight/warningData.vue";
import {
getTargetTracks,
trafficSignals,
getOverDatas,
getConflict,
} from "../../dao/api";
import msgCard from "../../components/Standard/msg-card.vue";
import {
crossFlow,
ridFlow,
eventAnalysis,
eventAlarm,
} from "../../dao/situation";
import { getFontSize } from "../../config/holo/fontSize.js";
export default {
props: ["show"],
......@@ -84,9 +71,6 @@ export default {
flag: 0,
timers: [],
overDatas: {},
// 在途车辆
activeVehicle: {},
charts: {},
};
},
computed: {},
......
wj-data-vision/src/views/intersectionGroups/msgLeft/targetTrack.vue
View file @ 511c1e13
......@@ -11,7 +11,7 @@
<span class="circle4"></span>{{ item.aliasName }}
</div>
<div class="rightValue">
{{ item.eventNumber }}{{ nameUnitMap[item.aliasName] }}
{{ item.eventNumber }}{{ nameUnitMap[item.eventType] }}
</div>
</div>
</div>
......@@ -21,34 +21,36 @@
<script>
import msgCard from "../../../components/Standard/msg-card.vue";
import {
getTargetTracks,
trafficSignals,
getOverDatas,
getConflict,
} from "../../../dao/api";
//---
import { getData } from "../../../dao/requestByUrl.js";
//---
export default {
components: { msgCard },
data() {
return {
targetTracks: [],
nameUnitMap: {
行人横穿马路: "人",
连续变道: "辆",
非机动车占用机动车道: "辆",
非机动车横穿马路: "辆",
路段掉头: "辆",
11: "人",
16: "辆",
24: "辆",
10: "辆",
606: "辆",
},
};
},
mounted() {
// 目标轨迹
getTargetTracks().then((res) => {
console.log("目标轨迹", res.content);
this.targetTracks = res.content;
});
this.initData();
},
methods: {
async initData() {
let req = await fetch("DATA.json");
let allData = await req.json();
let api = allData.intersectionGroups.apis.targetTrack;
getData(api).then(res=>{
this.targetTracks = res.content;
})
},
},
methods: {},
};
</script>
......
wj-data-vision/src/views/intersectionGroups/msgLeft/trafficFlow.vue
View file @ 511c1e13
......@@ -2,10 +2,10 @@
<msg-card class="item item-trafficFlow" title="交通流量">
<el-tabs v-model="tabsActiveName" @tab-click="tabsHandleClick">
<el-tab-pane name="cross" label="路口">
<div id="trafficFlow" class="full-h"></div>
<div id="trafficFlowcross" class="full-h"></div>
</el-tab-pane>
<el-tab-pane name="road" label="路段">
<div id="trafficFlow1" class="full-h"></div>
<div id="trafficFlowroad" class="full-h"></div>
</el-tab-pane>
</el-tabs>
</msg-card>
......@@ -13,47 +13,41 @@
<script>
import msgCard from "../../../components/Standard/msg-card.vue";
import {
getTargetTracks,
trafficSignals,
getOverDatas,
getConflict,
} from "../../../dao/api";
import {
crossFlow,
ridFlow,
eventAnalysis,
eventAlarm,
} from "../../../dao/situation";
import {getFontSize} from "../../../config/holo/fontSize.js";
import { getFontSize } from "../../../config/holo/fontSize.js";
import { getData } from "../../../dao/requestByUrl.js";
export default {
components: { msgCard },
data() {
return {
// 交通流量
tabsActiveName: "cross",
trafficFlowData: {},
charts: {},
corssFlowApi: "",
roadFlowApi: "",
};
},
mounted() {
//路口
crossFlow().then((res) => {
console.log("lukou", res);
this.trafficFlowData.cross = res.content;
this.$nextTick(() => {
this.trafficFlow(this.trafficFlowData.cross, true);
});
});
//路段
ridFlow().then((res) => {
console.log("luduan", res);
this.trafficFlowData.road = res.content;
});
this.initData();
},
methods: {
trafficFlow(content, isCross) {
async initData() {
let req = await fetch("DATA.json");
let allData = await req.json();
this.corssFlowApi = allData.intersectionGroups.apis.trafficFlowCross;
this.roadFlowApi = allData.intersectionGroups.apis.trafficFlowRoad;
this.getcrossData();
},
getcrossData() {
getData(this.corssFlowApi).then((res) => {
this.refreshChart(res.content, "cross");
});
},
getroadData() {
getData(this.roadFlowApi).then((res) => {
this.refreshChart(res.content, "road");
});
},
refreshChart(content, id) {
let option = {
color: ["#53c188", "#318af5", "#6a38e1"],
tooltip: {
......@@ -68,14 +62,14 @@ export default {
confine: true,
},
legend: {
top: getFontSize(20),
top: getFontSize(0),
itemGap: getFontSize(16),
itemWidth: getFontSize(12),
itemHeight: getFontSize(12),
textStyle: {
color: "rgba(126, 139, 166, 1)",
fontSize: getFontSize(12),
lineHeight: 15,
lineHeight: getFontSize(15),
},
pageTextStyle: {
color: "rgba(126, 139, 166, 1)",
......@@ -90,7 +84,7 @@ export default {
left: 0,
right: 0,
bottom: 0,
top: "22%",
top: getFontSize(44),
containLabel: true,
},
xAxis: {
......@@ -141,26 +135,14 @@ export default {
return series;
})(),
};
if (isCross) {
this.charts.trafficFlowC = echarts.init(
document.getElementById("trafficFlow")
);
this.charts.trafficFlowC && this.charts.trafficFlowC.setOption(option);
} else {
this.charts.trafficFlowC1 = echarts.init(
document.getElementById("trafficFlow1")
);
this.charts.trafficFlowC1 &&
this.charts.trafficFlowC1.setOption(option);
}
this.charts[id] = echarts.init(
document.getElementById(`trafficFlow${id}`)
);
this.charts[id] && this.charts[id].setOption(option);
},
tabsHandleClick(tab) {
this.$nextTick(() => {
this.trafficFlow(
this.trafficFlowData[tab.name],
tab.name === "cross"
);
this[`get${tab.name}Data`]();
});
},
},
......
wj-data-vision/src/views/phaseAirPlay/index.vue
View file @ 511c1e13
......@@ -19,7 +19,6 @@ import dict from "../../config/holo/dictionary";
import * as mapTools from "../../utils/mapboxTools";
import mapAssets from "../../config/holo/mapAssets";
import * as myMixin from "../setColor";
import { getPhasePolygons } from "../../dao/api";
import HomeLeft from "./left/index.vue";
......
wj-data-vision/src/views/straightLeftConflict/index.vue
View file @ 511c1e13
......@@ -19,7 +19,6 @@ import dict from "../../config/holo/dictionary";
import * as mapTools from "../../utils/mapboxTools";
import mapAssets from "../../config/holo/mapAssets";
import * as myMixin from "../setColor";
import HomeLeft from "./left/index.vue";
import HomeRight from "./right/index.vue";
......
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