Files
park/application/index/view/jingmen/yddt.html
MeSHard b22d09bd39 init
2025-12-01 11:19:23 +08:00

1836 lines
87 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters

This file contains Unicode characters that might be confused with other characters. If you think that this is intentional, you can safely ignore this warning. Use the Escape button to reveal them.

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv=X-UA-Compatible content="IE=edge,chrome=1">
<meta http-equiv=Access-Control-Allow-Origin content=*>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="shortcut icon" href="__CDN__/assets/img/favicon.ico"/>
<link href="__CDN__/web/static/css/cldt.css" rel="stylesheet">
<title>{$site.name|htmlentities}</title>
<script src="__CDN__/web/static/js/jquery-1.11.3.js" type=text/javascript charset=utf-8></script>
<script src="__CDN__/web/static/js/echarts.min.js" type=text/javascript charset=utf-8></script>
<script src="__CDN__/web/static/js/vue.js" type=text/javascript charset=utf-8></script>
<script src="__CDN__/web/static/js/data.js" type=text/javascript charset=utf-8></script>
<script src="__CDN__/web/static/js/datav.min.vue.js"></script>
</head>
<body>
<div id=app>
<div class="header">
<div class="left">
<dv-decoration-1 style="width:200px;height:50px;">
</dv-decoration-1>
<div class="logo">
<span>{{ name }}</span>
</div>
<div class="title">
<img :src="p.img" alt="p.name" v-for="(p,i) in page" :key="i" @click="toPath(p.path)">
</div>
</div>
<div class="right">
<div>
<span class="view"
:class="{sidebarcolor:showSidebar}"
@click="toggleSidebar">{{!showSidebar ? '收起侧边栏' : '打开侧边栏'}}</span>
<span>当前日期:{{currentTime }}</span>
<dv-decoration-1 style="width:200px;height:50px;">
</dv-decoration-1>
</div>
</div>
</div>
<div class="row">
<div class="left" v-show="!showSidebar">
<div class="left_1" >
<dv-border-box-1>
<p class="title">
<span>运单数量周统计</span>
</p>
<div id="echarts-left_1" style="width: 100%; height: 25vh;"></div>
</dv-border-box-1>
</div>
<div class="left_2">
<dv-border-box-1>
<p class="title">
<span>当日片区货物输入</span>
</p>
<div id="echarts-left_2" style="width: 100%; height: 25vh;"></div>
</dv-border-box-1>
</div>
<div class="left_3">
<dv-border-box-1>
<p class="title">
<span>当日片区货物输出</span>
</p>
<div id="echarts-left_3" style="width: 100%; height: 25vh;"></div>
</dv-border-box-1>
</div>
</div>
<div class="main">
<div id='container'></div>
</div>
<div class="right" v-show="!showSidebar">
<div class="r_i r_i_1">
<dv-border-box-1 class="">
<p class="title">
<span>企业货物排行TOP10</span>
</p>
<div id="right-chart_1" style="width: 100%; height: 25vh;"></div>
</dv-border-box-1>
</div>
<div class="r_i r_i_2" style="height: 55vh">
<p class="title">
<span>当前未查验运单</span>
</p>
<dv-scroll-board :config="config" style="width:100%;height:100%;align-content: center" @click="line"/>
</div>
</div>
</div>
<div class="lengend" :class="vis&&'l-show'" v-show="vis">
<div class="l-item" v-for="(i,k) of form" :key="k">
<div class="l-head">
<div class="f-item">
<input type="checkbox" v-model="i.val" :id="k+'-tit'">
<label :for="k+'-tit'">
<span>{{i.tit}}</span>
</label>
</div>
</div>
<div class="l-cont">
<div class="f-item" v-for="(j,z) of i.kids" :key="z">
<input type="checkbox" v-model="i.model" :value="j.val" :id="k+'-item-'+z" @change="i.change(i)">
<label :for="k+'-item-'+z">
<img :src="j.icon" alt="" v-if="j.icon">
<i v-if="j.bc" :style="{'background-color':j.bc}"></i>
<span>{{j.label}}</span>
</label>
</div>
</div>
</div>
</div>
<div class="app-vis"><input type="checkbox" id="vis" v-show="vis" v-model="vis"> <label for="vis"></label></div>
<div class="car-search" >
<input type="text" placeholder="车辆搜索" v-model="linKey">
<i @click="searchClear" v-show="linKey"></i>
<span @click="linSearch">搜索</span>
</div>
</div>
<script type="text/javascript">
stopcolor= '#ff0000'
livcolor = '#e89393'
lv1color= "#ff0000"
lv2color = "#a08e8e"
lv3color= '#d2db00'
lv4color= '#f29b76'
overlayGroups={
fac:[],
car:[],
enter:{},
road:[],
truth:[],
}
let fac=[
{
label:"变电站",
icon:'/web/static/icon/d.png',
val:'y',
},
{
label:"配气站",
icon:'/web/static/icon/fq.png',
val:'g',
},
{
label:"热能配置",
icon:'/web/static/icon/rs.png',
val:'v',
},
{
label:"废物处理",
icon:'/web/static/icon/fs.png',
val:'f',
},
{
label:"给水厂",
icon:'/web/static/icon/w.png',
val:'d',
},
{
label:"污水处理厂",
icon:'/web/static/icon/ws.png',
val:'h',
},
{
label:"事故池",
icon:'/web/static/icon/b.png',
val:'p',
},
{
label:"应急集合点",
icon:'/web/static/icon/pp.png',
val:'m',
},
{
label:"医院",
icon:'/web/static/icon/ht.png',
val:'_',
},
{
label:"居住区域",
bc:livcolor,
val:'live',
},
{
label:"停车区域",
bc:stopcolor,
val:'stop',
},
{
label:"森林防护区",
bc:'#26c533',
val:'tree',
},
],
car=[
{
label:"有运单",
icon:'/web/static/icon/400.png',
val:400,
},
{
label:"无运单",
val:500,
},
],
enter=[
{
label:"一级周界",
bc:lv1color,
val:'lv1',
},
{
label:"二级周界",
bc:lv2color,
val:'lv2',
},
{
label:"三级周界",
bc:lv3color,
val:'lv3',
},
],
road=[
{
label:"正常周界",
bc:'#448ACA',
val:'nor',
},
{
label:"预警周界",
bc:'#46A162',
val:'warn',
},
{
label:"禁行周界",
bc:'#6A005F',
val:'no',
}
];
var vm = new Vue({
el: '#app',
filters:{
status(n){
switch(n){
case -1:
return '区域外行驶';
case 0:
return '正常';
case 1:
return '超速';
case 2:
return '禁行/禁停';
case 3:
return '禁停/禁行';
case 4:
return '未上报';
case 5:
return '超最大数量'
default:return "";
}
}
},
data: {
name: '封闭园区运营中心',
page: [
{
'name': '总览',
'path': 'index',
'img': 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAHgAAAAkCAYAAABCKP5eAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTM4IDc5LjE1OTgyNCwgMjAxNi8wOS8xNC0wMTowOTowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTcgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjkzNjY5NzQ3QTcyMTExRUI5OTM1OTc5OEFERjMyM0Y0IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjkzNjY5NzQ4QTcyMTExRUI5OTM1OTc5OEFERjMyM0Y0Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6OTM2Njk3NDVBNzIxMTFFQjk5MzU5Nzk4QURGMzIzRjQiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6OTM2Njk3NDZBNzIxMTFFQjk5MzU5Nzk4QURGMzIzRjQiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz7DkPpKAAAJmklEQVR42uyc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'
},
{
'name': '车辆码',
'path': 'i_clm',
'img': 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAHgAAAAkCAYAAABCKP5eAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTM4IDc5LjE1OTgyNCwgMjAxNi8wOS8xNC0wMTowOTowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTcgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjkxRjdENUQ2QTcyMTExRUI4RDJBRTUzMjc2RjEzRERBIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjkxRjdENUQ3QTcyMTExRUI4RDJBRTUzMjc2RjEzRERBIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6OTFGN0Q1RDRBNzIxMTFFQjhEMkFFNTMyNzZGMTNEREEiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6OTFGN0Q1RDVBNzIxMTFFQjhEMkFFNTMyNzZGMTNEREEiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz5pdQd6AAAKwElEQVR42uyc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'
},
{
'name': '车辆状态',
'path': 'cldt',
'img': 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAHgAAAAkCAYAAABCKP5eAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTM4IDc5LjE1OTgyNCwgMjAxNi8wOS8xNC0wMTowOTowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTcgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjkwOTE3MzIzQTcyMTExRUI5M0RDRkMxMUY4ODZBQzE2IiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjkwOTE3MzI0QTcyMTExRUI5M0RDRkMxMUY4ODZBQzE2Ij4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6OTA5MTczMjFBNzIxMTFFQjkzRENGQzExRjg4NkFDMTYiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6OTA5MTczMjJBNzIxMTFFQjkzRENGQzExRjg4NkFDMTYiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz5q+4q4AAANAElEQVR42uyc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'
},
{
'name': '运单状态',
'path': 'yddt',
'img': 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAHgAAAAkCAYAAABCKP5eAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNi1jMTM4IDc5LjE1OTgyNCwgMjAxNi8wOS8xNC0wMTowOTowMSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIDIwMTcgKFdpbmRvd3MpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjhERDQwQzdBQTcyMTExRUJBQUNFQzg4RDFCNjg0OUNFIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjhERDQwQzdCQTcyMTExRUJBQUNFQzg4RDFCNjg0OUNFIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6OERENDBDNzhBNzIxMTFFQkFBQ0VDODhEMUI2ODQ5Q0UiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6OERENDBDNzlBNzIxMTFFQkFBQ0VDODhEMUI2ODQ5Q0UiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz5nuNn5AAAMMElEQVR42uyc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'
},
],
currentTime: '',
showSidebar: false,
echarts_data:[],
yes_waybill_count:[],
no_waybill_count:[],
r_3_data: [],
config: {
header: ['运单号', '车牌号', '产品', '装货单位','卸货单位','时间'],
data: [], columnWidth: [180, 120, 80, 120, 120, 120],
align: ['center'], rowNum: 20,waitTime:1000,oddRowBGC:'',evenRowBGC:'#cfd5d71c'
},
show_video:false,
infoPos :{
left:'0px',
top:'0px'
},
videosrc:true,
zjinfor:{},
zjinforvis:false,
carInfo:{},
infoVis:false,
vis:false,
linKey:"",
search:'',
form:[
{
tit:'固定设施标记 ',
get val(){
return this.model.length===this.kids.length;
},
set val(n){
if(n){
this.model = this.kids.map(i=>i.val);
}else{
this.model= [];
}
this.change(this);
},
model:fac.map(i=>i.val),
change(_this){
let marksers= overlayGroups.fac,
kids=_this.kids.map(i=>i.val);
marksers.forEach(i=>{
let val=i.getExtData().type;
if(_this.model.includes(val)||!kids.includes(val)){
i.show();
}else{
i.hide();
}
})
},
kids:fac
},{
tit:'运单动态',
get val(){
return this.model.length===this.kids.length;
},
set val(n){
if(n){
this.model = this.kids.map(i=>i.val);
console.log(this.model)
}else{
this.model= [];
}
this.change(this);
},
get zh(){
//console.log(this.model)
// let v1=this.model.filter(i==100),
// v2=this.model.filter(i==200),
// arr=[];
// v1.forEach(i=>{
// v2.forEach(j=>{
// arr.push(i+j+'');
// })
// })
var arr=[];
for(var i=0;i<this.model.length;i++){
this.model[i]=String(this.model[i])
}
arr=this.model;
return arr;
},
change(){
console.log('搜索车辆,运单状态过滤', car_markers.list)
car_markers.list.forEach(i=>{
var data=i.getExtData();
var shouldShow = false;
// 先检查运单状态是否匹配
if(this.zh.includes(data.status)){
// 如果运单状态匹配,再检查搜索关键词
if(vm.search){
// 如果有搜索关键词,检查车牌号是否匹配(支持部分匹配)
if (data.vehicleNo && data.vehicleNo.indexOf(vm.search) !== -1) {
shouldShow = true;
}
} else {
// 没有搜索关键词,显示所有匹配运单状态的车辆
shouldShow = true;
}
}
// 应用显示/隐藏
if (shouldShow) {
i.show();
} else {
i.hide();
}
})
},
model:car.map(i=>i.val),
kids:car
},{
tit:'周界',
get val(){
return this.model.length===this.kids.length;
},
set val(n){
if(n){
this.model = this.kids.map(i=>i.val);
}else{
this.model= [];
}
this.change(this);
},
change(_this){
vm.enterSec();
/*
let enters= overlayGroups.enter,
kids=_this.kids.map(i=>i.val);
for(var i in enters){
if(_this.model.includes(i)){
enters[i].forEach(j=>j.show());
}else{
enters[i].forEach(j=>j.hide());
}
}
*/
},
model:enter.map(i=>i.val),
kids:enter
},
{
tit:'周界筛选禁行',
$val:false,
get val(){
return this.$val;
},
set val(n){
this.$val=n;
this.change(this);
},
change(_this){
vm.enterSec();
},
model:[1,2],
kids:[
{
label:"非禁行",
val:2,
},
{
label:"禁行",
val:1,
}
]
},
// {
// tit:'道路周界',
// model:true,
// change(_this){
// let truth= overlayGroups.truth,
// kids=_this.kids.map(i=>i.val);
// for(var i in truth){
// if(_this.model.includes(i)){
// truth[i].forEach(j=>j.show());
// }else{
// truth[i].forEach(j=>j.hide());
// }
// }
// },
// get val(){
// return this.model;
// },
// set val(n){
// this.model=n;
// let truth= overlayGroups.truth;
// for(var i in truth){
// if(n){
// truth[i].forEach(j=>j.show());
// }else{
// truth[i].forEach(j=>j.hide());
// }
// }
// },
// kids:[],
// }
]
},
computed: {
enterModel(){
var ef=this.form.filter(i=>i.tit==='周界')[0],
sf=this.form.filter(i=>i.tit==='周界筛选禁行')[0];
return {
lv:ef.model,
isSec:sf.val,
sec:sf.model
}
}
},
created() {
this.startTimer()
this.getData()
this.getUncheckWaybillList()
},
beforeDestroy() {
this.stopTimer(); // 清除定时器以避免内存泄漏
},
mounted() {
this.initChart();
},
watch: {
// 监听数据变化自动更新图表
echarts_data(newVal) {
if (newVal) {
this.updateChart();
}
}
},
methods: {
initChart() {
// 通过document.getElementById获取DOM元素
const chartDom = document.getElementById('echarts-left_1');
// 初始化图表
if (chartDom) {
this.myChart1 = echarts.init(chartDom);
// 设置初始空配置
this.myChart1.setOption({
title: {
textStyle: {
color: '#94a3b8',
fontSize: 18
},
left: 'center',
top: 'center'
},
xAxis: {show: false},
yAxis: {show: true},
series: []
});
}
// 初始化图表
const chartDom2 = document.getElementById('echarts-left_2');
if (chartDom2) {
this.myChart2 = echarts.init(chartDom2);
// 设置初始空配置
this.myChart2.setOption({
title: {
textStyle: {
color: '#94a3b8',
fontSize: 18
},
left: 'center',
top: 'center'
},
xAxis: {show: false},
yAxis: {show: true},
series: []
});
}
// 通过document.getElementById获取DOM元素
const chartDom3 = document.getElementById('echarts-left_3');
// 初始化图表
if (chartDom3) {
this.myChart3 = echarts.init(chartDom3);
this.myChart3.setOption({
title: {
textStyle: {
color: '#94a3b8',
fontSize: 18
},
left: 'center',
top: 'center'
},
xAxis: {show: false},
yAxis: {show: true},
series: []
});
}
// 初始化图表
const chartDom4 = document.getElementById('right-chart_1');
if (chartDom4) {
this.myChart4 = echarts.init(chartDom4);
// 设置初始空配置
this.myChart4.setOption({
title: {
textStyle: {
color: '#94a3b8',
fontSize: 18
},
left: 'center',
top: 'center'
},
xAxis: {show: false},
yAxis: {show: true},
series: []
});
}
// 窗口大小变化时重绘图表
window.addEventListener('resize', this.handleResize);
},
handleResize() {
this.myChart && this.myChart.resize();
},
toPath(url){
window.location.href = '/index/datav/'+url
},
getData() {
$.post('/api/Yq_screen/waybill_trend').then(r => {
this.echarts_data = r.data
})
},
getUncheckWaybillList() {
// 获取未查验运单列表
$.post('/api/Yq_screen/uncheck_waybill_list', {
limit: 20
}).then(r => {
if (r.code == 1 && r.data) {
this.r_3_data = r.data
this.updatedv()
}
}).fail((xhr, status, error) => {
console.error('获取未查验运单列表失败:', error)
})
},
updateChart() {
if (this.myChart1){
var echartData = this.echarts_data.waybill
var time = []
var count = []
echartData.map((item,index)=>{
time.push(item.weekday)
count.push(item.count)
})
var option = {
tooltip: {
trigger: "axis",
axisPointer: {
type: 'shadow'
}
},
grid: {
left: "3%",
right: "4%",
bottom: "3%",
containLabel: true
},
xAxis: [{
type: "category",
data: time,
axisTick: {
alignWithLabel: true
},
axisLabel: {
interval: 0,
// rotate: 45,
textStyle: {
color: "#ffffff",
fontSize: 12
}
},
axisLine: {lineStyle: {color: "#D2F1FF", width: 1}},
}],
yAxis: {
type: "value",
axisLine: {
lineStyle: {
color: "#D2F1FF",
width: 1
}
},
splitLine: {
show: false,
lineStyle: {
type: "solid",
color: "rgba(255,255,255,0.1)"
}
}
},
series: [{
name: "运单数量",
type: "bar",
barWidth: "20%",
itemStyle: {
// color:'#3aa0ff'
normal: {
color: new echarts.graphic.LinearGradient(0, 0, 0,
1, [{
offset: 0,
color: "#0082DC"
}, {
offset: 1,
color: "#00FFD8"
}])
}
},
data: count,
label: {
show: true,
normal: {
show: true,
formatter: '{c}' // {b}: name, {c}: value, {d}: percentage
}
},
}
]
};
// 设置图表配置
this.myChart1.setOption(option);
}
if (this.myChart2){
var echartData = this.echarts_data.in_area
var option = {
tooltip: {
trigger: "item",
},
color: ["#8486F4", "#F077B3","#29ABE2", "#FFBD27", "#89DE79", "#64B9EA"],
// legend: {
// top: '1%',
// left: 'center',
// textStyle: {
// color: "#ffffff",
// fontSize: '8'
// },
// },
series: [{
name: "片区车流统计",
type: "pie",
radius: ['40%', '70%'],
avoidLabelOverlap: true,
itemStyle: {
borderRadius: 10,
borderColor: '#fff',
borderWidth: 1
},
label: {
show: true,
lineStyle: {
color: "#fff" // 标签引导线的颜色
},
},
emphasis: {
label: {
show: true,
fontSize: "14",
fontWeight: "bold"
}
},
labelLine: {
lineStyle: {
color: "rgba(255, 255, 255, 0.3)" // 标签引导线的颜色
},
smooth: 0.2, // 平滑度
length: 10, // 第一段线长度
length2: 20 // 第二段线长度
},
data: echartData,
label: {
show: true,
normal: {
show: true,
formatter: '{b}: {c}' //
}
},
}]
};
// 设置图表配置
this.myChart2.setOption(option);
}
if (this.myChart3){
var echartData = this.echarts_data.out_area
var option = {
tooltip: {
trigger: "item",
},
color: ["#8486F4", "#F077B3","#29ABE2", "#FFBD27", "#89DE79", "#64B9EA"],
// legend: {
// top: '1%',
// left: 'center',
// textStyle: {
// color: "#ffffff",
// fontSize: '8'
// },
// },
series: [{
name: "片区车流统计",
type: "pie",
radius: ['40%', '70%'],
avoidLabelOverlap: true,
itemStyle: {
borderRadius: 10,
borderColor: '#fff',
borderWidth: 1
},
label: {
show: true,
lineStyle: {
color: "#fff" // 标签引导线的颜色
},
},
emphasis: {
label: {
show: true,
fontSize: "14",
fontWeight: "bold"
}
},
labelLine: {
lineStyle: {
color: "rgba(255, 255, 255, 0.3)" // 标签引导线的颜色
},
smooth: 0.2, // 平滑度
length: 10, // 第一段线长度
length2: 20 // 第二段线长度
},
data: echartData,
label: {
show: true,
normal: {
show: true,
formatter: '{b}: {c}' //
}
},
}]
};
this.myChart3.setOption(option);
}
if (this.myChart4){
var echartData = this.echarts_data.enterprise
console.log(echartData)
var option = {
tooltip: {
trigger: "axis",
axisPointer: {
type: 'shadow'
}
},
grid: {
left: "3%",
right: "4%",
bottom: "3%",
containLabel: true
},
xAxis: [{
type: "category",
data: echartData.name,
axisTick: {
alignWithLabel: true
},
axisLabel: {
interval: 0,
rotate: 45,
textStyle: {
color: "#ffffff",
fontSize: 12
}
},
axisLine: {lineStyle: {color: "#D2F1FF", width: 1}},
}],
yAxis: {
type: "value",
axisLine: {
lineStyle: {
color: "#D2F1FF",
width: 1
}
},
splitLine: {
show: false,
lineStyle: {
type: "solid",
color: "rgba(255,255,255,0.1)"
}
}
},
series: [{
name: "企业货物",
type: "bar",
barWidth: "20%",
itemStyle: {
normal: {
color: new echarts.graphic.LinearGradient(0, 0, 0,
1, [{
offset: 0,
color: "#0082DC"
}, {
offset: 1,
color: "#00FFD8"
}])
}
},
data: echartData.num,
label: {
show: true,
normal: {
show: true,
formatter: '{c}' // {b}: name, {c}: value, {d}: percentage
}
},
}]
};
// 设置图表配置
this.myChart4.setOption(option);
}
},
updatedv() {
var data = []
this.r_3_data.map((item, index) => {
data.push([
item.waybill_order,item.tow_license,item.sale_product,item.waybill_loading,item.waybill_unloading,item.waybill_date
])
})
this.config = {
...this.config, data
}
},
line(e){
const order_sn = e.row[0]
console.log('ee',e,order_sn)
},
startTimer() {
this.timer = setInterval(() => {
this.currentTime = this.getCurrentDateTime();
}, 1000);
//触发整点请求数据
const currentMinutes = new Date().getMinutes();
const timeUntilNextHour = (60 - currentMinutes) * 60 * 1000;
this.timer2 = setTimeout(() => {
setInterval(() => {
this.getData();
this.getUncheckWaybillList();
}, 3600000);
}, timeUntilNextHour);
// 每20秒刷新一次未查验运单列表
this.timer3 = setInterval(() => {
this.getUncheckWaybillList();
}, 20000);
},
stopTimer() {
clearInterval(this.timer);
clearInterval(this.timer2);
if (this.timer3) {
clearInterval(this.timer3);
}
},
getCurrentDateTime() {
const now = new Date();
const year = now.getFullYear();
const month = this.padNumber(now.getMonth() + 1);
const day = this.padNumber(now.getDate());
const hours = this.padNumber(now.getHours());
const minutes = this.padNumber(now.getMinutes());
const seconds = this.padNumber(now.getSeconds());
return (
year + '-' + month + '-' + day + ' ' + hours + ':' + minutes + ':' + seconds
);
},
padNumber(num) {
return num < 10 ? '0' + num : num;
},
toggleSidebar() {
this.showSidebar = !this.showSidebar
},
enterSec(){
let enters= overlayGroups.enter;
console.log(enters)
for(var i in enters){
if(this.enterModel.lv.includes(i)){
if(this.enterModel.isSec){
enters[i].forEach(j=>{
if([0,...this.enterModel.sec].includes(j.getExtData().is_ban)){
j.show()
}else{
console.log(j)
j.hide();
}
});
}else{
enters[i].forEach(j=>j.show());
}
}else{
enters[i].forEach(j=>j.hide());
}
}
},
linSearch(){
this.search=this.linKey;
vm.form[1].change();
},
searchClear(){
this.search="";
this.linKey="";
vm.form[1].change();
},
}
})
</script>
<script type="text/javascript">
window._AMapSecurityConfig = {
securityJsCode: 'c093878ad110aeadf3f2e6854ada1f6c',
}
</script>
<script src="https://webapi.amap.com/maps?v=1.4.15&key=31fedc4d3fd2c3438589db99eb2f7182&plugin=AMap.MouseTool"></script>
<script type="text/javascript">
const MAP_KEY = "31fedc4d3fd2c3438589db99eb2f7182",
{
LngLat
} = AMap;
var buildings = new AMap.Buildings({
zooms: [13.4, 20],
zIndex: 10,
heightFactor: 2, //2倍于默认高度3D 视图下生效)
});
var map = new AMap.Map('container', {
zoom: 12.3,
center: new LngLat(107.01706, 29.821693),
mapStyle: 'amap://styles/light',//d20072f4733f3c023ea36097cd4d9933
viewMode: "3D",
terrain:true,
pitch:44.5,
rotation:0,
features:['bg','road','point'],//默认不要 'building',
layers: [buildings], //地图图层的数组
}),
stopcolor = '#ff0000',
livcolor = '#e89393',
lv1color = "#ff0000",
lv2color = "#a08e8e",
lv3color = '#d2db00',
lv4color = '#f29b76',
overlayGroups = {
fac: [],
car: [],
enter: {},
road: [],
truth: [],
},
kk = `107.027841,29.759073;107.034279,29.762086;106.997726,29.824484;107.059954,29.820257;107.043592,29.83791;107.016477,29.871028;106.962953,29.790122`;
map.on('zoomchange', () => {
if (map.getZoom() > 18) map.setZoom(18);
});
// 构造官方卫星图层
var satelliteLayer = new AMap.TileLayer.Satellite();
//批量添加图层
map.add([satelliteLayer]);
function kkRender() {
strToLL(kk).map(i => {
new AMap.Marker({
position: i,
map: map,
icon: '/web/static/icon/tuli_kakou.png'
})
})
}
kkRender();
showMarkers();
function strToLL(str) {
return str.split(';').map(i => new LngLat(...i.split(',').map(j => +j)))
}
function openInfo(info, pixel) {
const res = `
<div class="custom-info-window zjinfo" >
<p> ${info.name}</p>
<p>停车位总数:${info.space}</p>
<p>停放车辆数量:${info.place_car}</p>
<p>剩余车位数量:${info.remainder_car}</p>
<p>当日入场车次:${info.in_car}</p>
<p>当日出场车次:${info.out_car}</p>
</div>
`;
// 创建新的信息窗口
infoWindow = new AMap.InfoWindow({
content: res,
offset: new AMap.Pixel(0, 0),
isCustom: true
});
infoWindow.open(map, [pixel.lng, pixel.lat]);
setTimeout(() => {
infoWindow.close();
}, 3000)
}
// 区域数据
function lvOverRender(i, sty) {
var style = {};
style = {
fillOpacity: {
1: 0,
2: .5,
3: .5,
4: 1,
},
fillColor: {
1: lv1color,
2: lv2color,
3: lv3color,
4: lv4color
},
strokeOpacity: {
1: 1,
2: 1,
3: 1,
4: 1
},
strokeColor: {
1: lv1color,
2: lv2color,
3: lv3color,
4: lv4color
},
strokeWeight: {
1: 3,
2: 2,
3: 0,
4: 0,
},
zIndex: {
1: 21,
2: 22,
3: 23,
4: 24
},
strokeStyle: {
1: 'dashed',//dashed
2: 'solid',
3: 'solid',
4: 'solid',
},
}
var poy = new AMap.Polygon({
map: map,
path: i.info ? strToLL(i.info) : '',
extData: i,
...(function () {
var obj = {};
for (var j in style) {
const region_lv = i.region_lv == 20 ? 2 : (i.region_lv == 21 ? 3 : (i.region_lv == 22 ? 1 : 4))
obj[j] = style[j][region_lv]
}
return obj
})(),
...(sty || {})
})
map.add(poy)
poy.on('click', function (e) {
$.post('/api/Yq_perimeter/perimeter_detail',{name:e.target.getExtData().name}).then(r => {
openInfo(r.data, e.lnglat)
})
// // if(e.target.getExtData().type=='stop'){
// // vm.zjinfor={name:'明宇危化品停车场'}
// // }else if(e.target.getExtData().type=='live'){
// // vm.zjinfor={name:'晏家居住区'}
// // }else{
// // vm.zjinfor=e.target.getExtData();
// // }
// vm.zjinfor = e.target.getExtData();
//
// vm.zjinforvis = true;
// vm.infoVis = false;
// let pos = e.pixel;
// vm.infoPos = {
// left: `${pos.x + 10}px`,
// top: `${pos.y - 120}px`
// }
// var timer;
// timer && clearTimeout(timer);
//
// timer = setTimeout(e => {
// vm.zjinforvis = false
// }, 5e3);
})
return poy;
}
var carlist = [],
timer,
markerEvent = e => {
const pos = e.lnglat;
const carInfo = e.target.getExtData();
openCarInfo(carInfo,pos)
};
function openCarInfo(carInfo,pixel) {
var qr_color = ''
if(carInfo.qr_color == 1){
qr_color = '绿牌车辆'
}else if (carInfo.qr_color == 2){
qr_color = '黄牌车辆'
}else if (carInfo.qr_color == 3){
qr_color = '红牌车辆'
}else {
qr_color = '未知'
}
var vehicle_type = ''
if(carInfo.vehicle_type == -1){
vehicle_type = '区域外行驶'
}else if (carInfo.vehicle_type == 0){
vehicle_type = '正常'
}else if (carInfo.vehicle_type == 1){
vehicle_type = '超速'
}else if (carInfo.vehicle_type == 2){
vehicle_type = '禁行'
}else if (carInfo.vehicle_type == 3){
vehicle_type = '禁停'
}else if (carInfo.vehicle_type == 4){
vehicle_type = '未上报'
}else if (carInfo.vehicle_type == 5){
vehicle_type = '超最大数量'
}
const res = `
<div class="carinfo" >
<div v-show="carInfo.type==='pog'" class="i-tit"></div>
<div class="i-main">
<div class="im-item">车牌号:${carInfo.vehicleNo}</div>
<div class="im-item">速度:${carInfo.vec1}</div>
<div class="im-item">状态:`+vehicle_type+`</div>
<div class="im-item">车辆码:${qr_color}</div>
<div class="im-item">定位时间:${carInfo.positionTime}</div>
<div class="btn_map">
<button Onclick="bjlist('${carInfo.vehicleNo}')" style="display: block;width: 100%;">查看报警</button>
<button Onclick="cardetail('${carInfo.vehicleNo}')" style="width: 45%;">车辆信息</button>
<button Onclick="parklist('${carInfo.vehicleNo}')" style="width: 45%;float: right;">入园记录</button>
<button Onclick="waybill_list('${carInfo.vehicleNo}')" style="width: 45%;">运单记录</button>
<button Onclick="history('${carInfo.vehicleNo}')" style="width: 45%;float: right;">车辆轨迹</button>
</div>
</div>
</div>
`
// 创建新的信息窗口
infoWindow = new AMap.InfoWindow({
content: res,
offset: new AMap.Pixel(0,0),
isCustom: true
});
infoWindow.open(map, [pixel.lng, pixel.lat]);
setTimeout(() => {
infoWindow.close();
}, 5000)
}
function CarMarkers() {
this.list = [];
this.data = [];
Object.defineProperty(this, 'ids', {
get() {
return this.data.map(i => i.id);
}
})
}
CarMarkers.prototype.getMarker = function (id) {
return this.list.filter(i => {
return i.getExtData().id === id
})[0];
}
CarMarkers.prototype.update = function (list) {
let markers = [], marker;
list.forEach(i => {
if(!i.longitude || !i.latitude){
return;
}
let lnglat = new LngLat(i.longitude, i.latitude);
i.type = "marker";
if (this.ids.includes(i.id)) {
marker = this.getMarker(i.id);
if (lnglat.toString() !== marker.getPosition().toString()) {
marker.setPosition(lnglat);
}
var _data = marker.getExtData();
marker.setIcon('/web/static/icon/' + i.status + '.png'/*_data.vehicle_type?'icon/dingwei_red.png':_data.vec1?'icon/dingwei_blue.png':'icon/dingwei_white.png'*/);
marker.setExtData(i);
} else {
marker = new AMap.Marker({
icon: '/web/static/icon/' + i.status + '.png',//i.vehicle_type?'icon/dingwei_red.png':i.vec1?'icon/dingwei_blue.png':'icon/dingwei_white.png',
position: lnglat,
offset: new AMap.Pixel(-12, -12),
zIndex: 30 + i.id,
map: map,
extData: i
});
marker.on('click', markerEvent)
}
/*if(vm.form[1].zh.includes(i.status)){
marker.show();
}else{
marker.hide();
}*/
markers.push(marker)
})
let removeArr = [];
this.list.forEach(i => {
if (!markers.includes(i)) {
removeArr.push(i)
}
})
map.remove(removeArr)
this.data = list;
this.list = markers;
// 更新后应用搜索和运单状态过滤
if (vm && vm.form && vm.form[1]) {
vm.form[1].change();
}
}
let car_markers = new CarMarkers();
let _this=this;
// 坐标转换配置如果数据库存储的是WGS84坐标设置为true如果已经是GCJ02设置为false
var NEED_COORDINATE_CONVERT = true; // 根据实际情况调整true=需要转换false=不需要转换
// WGS84转GCJ02坐标转换函数与i_clm.html保持一致
function wgs84ToGcj02(lon, lat) {
var a = 6378245.0;
var ee = 0.00669342162296594323;
if (outOfChina(lon, lat)) {
return {lon: lon, lat: lat};
}
var dLat = transformLat(lon - 105.0, lat - 35.0);
var dLon = transformLon(lon - 105.0, lat - 35.0);
var radLat = lat / 180.0 * Math.PI;
var magic = Math.sin(radLat);
magic = 1 - ee * magic * magic;
var sqrtMagic = Math.sqrt(magic);
dLat = (dLat * 180.0) / ((a * (1 - ee)) / (magic * sqrtMagic) * Math.PI);
dLon = (dLon * 180.0) / (a / sqrtMagic * Math.cos(radLat) * Math.PI);
return {
lon: lon + dLon,
lat: lat + dLat
};
}
function outOfChina(lon, lat) {
return (lon < 72.004 || lon > 137.8347) || ((lat < 0.8293 || lat > 55.8271) || false);
}
function transformLat(lon, lat) {
var ret = -100.0 + 2.0 * lon + 3.0 * lat + 0.2 * lat * lat + 0.1 * lon * lat + 0.2 * Math.sqrt(Math.abs(lon));
ret += (20.0 * Math.sin(6.0 * lon * Math.PI) + 20.0 * Math.sin(2.0 * lon * Math.PI)) * 2.0 / 3.0;
ret += (20.0 * Math.sin(lat * Math.PI) + 40.0 * Math.sin(lat / 3.0 * Math.PI)) * 2.0 / 3.0;
ret += (160.0 * Math.sin(lat / 12.0 * Math.PI) + 320 * Math.sin(lat * Math.PI / 30.0)) * 2.0 / 3.0;
return ret;
}
function transformLon(lon, lat) {
var ret = 300.0 + lon + 2.0 * lat + 0.1 * lon * lon + 0.1 * lon * lat + 0.1 * Math.sqrt(Math.abs(lon));
ret += (20.0 * Math.sin(6.0 * lon * Math.PI) + 20.0 * Math.sin(2.0 * lon * Math.PI)) * 2.0 / 3.0;
ret += (20.0 * Math.sin(lon * Math.PI) + 40.0 * Math.sin(lon / 3.0 * Math.PI)) * 2.0 / 3.0;
ret += (150.0 * Math.sin(lon / 12.0 * Math.PI) + 300.0 * Math.sin(lon / 30.0 * Math.PI)) * 2.0 / 3.0;
return ret;
}
function getlist(){
// 先从外部API获取车辆位置数据与i_clm.html保持一致确保位置一致
$.ajax({
url: 'https://changshoupark.cyuncq.com/cs/posInfo',
type: 'POST',
contentType: 'application/json',
data: JSON.stringify({
"fenceList": ["CQQA_CQCS"]
}),
success: function (posResponse) {
if (posResponse.code === 200 && posResponse.data && posResponse.data.length > 0) {
// 构建同步数据保留原始WGS84坐标
var syncData = {
code: 200,
data: posResponse.data.map(function (item) {
return {
fenceCode: item.fenceCode,
danCount: item.danCount,
posList: item.posList ? item.posList.map(function (vehicle) {
return {
vehNo: vehicle.vehNo,
vehId: vehicle.vehId,
lon: vehicle.lon,
lat: vehicle.lat,
originalLon: vehicle.lon,
originalLat: vehicle.lat,
v1: vehicle.v1,
dir: vehicle.dir,
posTime: vehicle.posTime,
color: vehicle.color,
trans: vehicle.trans
};
}) : []
};
})
};
// 同步数据到本地数据库(异步执行,不阻塞后续操作)
syncVehicleToLocal(syncData);
// 处理地图展示数据坐标转换与i_clm.html保持一致
var processedData = posResponse.data.map(function (item) {
if (item.posList && item.posList.length > 0) {
item.posList = item.posList.map(function (vehicle) {
// WGS84转GCJ02坐标转换高德地图使用GCJ02
var converted = wgs84ToGcj02(vehicle.lon, vehicle.lat);
vehicle.lon = converted.lon;
vehicle.lat = converted.lat;
return vehicle;
});
}
return item;
});
// 从数据库获取车辆运单状态信息,然后合并位置数据
$.ajax({
dataType: "json",
type: "post",
url:'/api/Yq_screen/screen_list',
data: {
action:'Screen/screen_list'
},
success: function(res) {
if (res.code == 1) {
var dbVehicleList = res.data.vehicle_list || [];
_this.mingyu = res.data.mingyu;
// 创建数据库车辆信息映射表以车牌号为key
var dbVehicleMap = {};
dbVehicleList.forEach(function(vehicle) {
dbVehicleMap[vehicle.vehicleNo] = vehicle;
});
// 合并API位置数据和数据库运单状态数据
carlist = [];
processedData.forEach(function (item, index) {
if (item.posList && item.posList.length > 0) {
item.posList.forEach(function (vehicle, vehicleIndex) {
if (!vehicle.lon || !vehicle.lat ||
isNaN(vehicle.lon) || isNaN(vehicle.lat) ||
vehicle.lon < 70 || vehicle.lon > 140 ||
vehicle.lat < 0 || vehicle.lat > 60) {
return;
}
var vehNo = vehicle.vehNo;
var dbVehicle = dbVehicleMap[vehNo] || {};
// 使用API的坐标已转换数据库的运单状态信息
var mergedVehicle = {
id: dbVehicle.id || (vehicleIndex + index * 1000),
vehicleNo: vehNo,
longitude: parseFloat(vehicle.lon.toFixed(6)),
latitude: parseFloat(vehicle.lat.toFixed(6)),
waybill_status: dbVehicle.waybill_status !== undefined ? dbVehicle.waybill_status : false,
vehicle_type: dbVehicle.vehicle_type,
vec1: dbVehicle.vec1 || vehicle.v1 || 0,
positionTime: vehicle.posTime ? new Date(vehicle.posTime * 1000).toLocaleString() : '',
// 计算status根据运单状态400=有运单500=无运单)
status: `${dbVehicle.waybill_status === true ? 400 : 500}`,
// 保留车辆码颜色信息
qr_color: dbVehicle.qr_color !== undefined ? dbVehicle.qr_color : null
};
// 保留数据库中的其他字段
if (dbVehicle.id) mergedVehicle.id = dbVehicle.id;
carlist.push(mergedVehicle);
});
}
});
car_markers.update(carlist);
}
},
error: function(err) {
console.warn('获取车辆运单状态信息失败:', err);
// 如果数据库获取失败仍然使用API数据但可能缺少运单状态信息
renderVehiclePositionsFromAPI(processedData);
}
});
} else {
// 如果API获取失败回退到数据库数据
getVehicleListFromDB();
}
},
error: function (xhr, status, error) {
console.warn('外部车辆数据请求失败:', error);
// 如果API获取失败回退到数据库数据
getVehicleListFromDB();
}
});
}
// 同步车辆数据到本地数据库(异步执行,设置超时避免阻塞)
function syncVehicleToLocal(data) {
$.ajax({
type: "POST",
contentType: 'application/json',
url: '/api/Yq_data_handle/sync_vehicle',
data: JSON.stringify(data),
timeout: 30000, // 30秒超时
async: true, // 确保异步执行
success: function (res) {
if (res.code == 1 || res.code == 200) {
console.log('车辆数据同步成功:', res.data);
} else {
console.warn('车辆数据同步失败:', res.msg);
}
},
error: function (xhr, status, error) {
if (status === 'timeout') {
console.warn('车辆数据同步超时');
} else {
console.warn('车辆数据同步请求失败:', error);
}
}
});
}
// 从数据库获取车辆列表(备用方案)
function getVehicleListFromDB() {
$.ajax({
dataType: "json",
type: "post",
url:'/api/Yq_screen/screen_list',
data: {
action:'Screen/screen_list'
},
success: function(res) {
if (res.code == 1) {
carlist = res.data.vehicle_list;
_this.mingyu = res.data.mingyu;
carlist && carlist.forEach(i => {
i.status = `${i.waybill_status == true ? 400 : 500}`;
// 坐标转换如果数据库存储的是WGS84坐标需要转换为GCJ02
if (NEED_COORDINATE_CONVERT && i.longitude && i.latitude) {
var converted = wgs84ToGcj02(parseFloat(i.longitude), parseFloat(i.latitude));
i.longitude = parseFloat(converted.lon.toFixed(6));
i.latitude = parseFloat(converted.lat.toFixed(6));
}
})
car_markers.update(carlist);
}
},
});
}
// 仅从API数据渲染当数据库不可用时
function renderVehiclePositionsFromAPI(processedData) {
carlist = [];
processedData.forEach(function (item, index) {
if (item.posList && item.posList.length > 0) {
item.posList.forEach(function (vehicle, vehicleIndex) {
if (!vehicle.lon || !vehicle.lat ||
isNaN(vehicle.lon) || isNaN(vehicle.lat) ||
vehicle.lon < 70 || vehicle.lon > 140 ||
vehicle.lat < 0 || vehicle.lat > 60) {
return;
}
carlist.push({
id: vehicleIndex + index * 1000,
vehicleNo: vehicle.vehNo,
longitude: parseFloat(vehicle.lon.toFixed(6)),
latitude: parseFloat(vehicle.lat.toFixed(6)),
waybill_status: false,
status: '500' // 默认无运单
});
});
}
});
car_markers.update(carlist);
}
getlist();
setInterval(function(){
getlist();
},20000)
function showMarkers() {
const icons = {
_: '/web/static/icon/ht.png',
g: '/web/static/icon/fq.png',
u: '/web/static/icon/lv3.png',
c: '/web/static/icon/lv4.png',
l: '/web/static/icon/2.png',
y: '/web/static/icon/d.png',
v: '/web/static/icon/rs.png',
d: '/web/static/icon/w.png',
h: '/web/static/icon/ws.png',
s: '/web/static/icon/lv1.png',
b: '/web/static/icon/ot.png',
m: '/web/static/icon/pp.png',
f: '/web/static/icon/fs.png',
p: '/web/static/icon/b.png',
stop: '/web/static/icon/p.png'
}
let geoJson = markers_pos.map(i => {
return {
path: i[0],
type: i[1]
}
}),
markers = geoJson.map(i => {
return new AMap.Marker({
position: strToLL(i.path)[0],
icon: new AMap.Icon({
size: new AMap.Size(23, 23),
image: icons[i.type],
imageSize: new AMap.Size(15, 15),
}),
anchor: 'bottom-center',
offset: new AMap.Pixel(0, 0),
content: !icons[i.type] && `<span style="color:#fff">${i.type}</span>`,
map: map,
extData: i,
})
});
overlayGroups.fac = markers;
return markers;
}
overlayGroups.truth = {nor: [], no: [], warn: []};
var truthColor = {nor: '#1b2538', warn: '#46A162', no: '#6A005F'}
getData()
function getData() {
$.post('/api/Yq_perimeter/perimeter_list').then(r => {
// this.polyline(r.data[0])
this.dataHandle(r.data)
})
// 106.941496,29.924628;106.976515,29.889809;106.920897,29.900821;106.941496,29.924628
// 107.01527,29.895601;106.997876,29.89281;106.991391,29.887939;106.985853,29.880405;106.981835,29.871026;106.960543,29.849142;106.950737,29.83564;106.945862,29.824089;106.943563,29.814148;106.945054,29.799754;106.942764,29.783607;106.970332,29.766519;106.983273,29.751322;107.017612,29.737776;107.050425,29.734115;107.064458,29.737683;107.064744,29.739318;107.058942,29.748447;107.055205,29.762378;107.071581,29.77504;107.086248,29.789923;107.088111,29.796775;107.084106,29.807387;107.080959,29.81142;107.068298,29.813474;107.06422,29.813406;107.060435,29.82112;107.050628,29.827207;107.04726,29.828623;107.046543,29.829966;107.04701,29.830878;107.04712,29.834263;107.044827,29.838826;107.053757,29.842875;107.056479,29.849047;107.057124,29.85153;107.056802,29.853468;107.060415,29.86047;107.061665,29.864841;107.054919,29.881592;107.052508,29.894119;107.040451,29.898403;107.028579,29.89536;107.014946,29.895825;106.997804,29.89278
}
function bjlist(id){
window.open('/index/datav/bjlist?id='+id)
};
function cardetail(id){ //车辆详情
window.open('/index/datav/car_detail?id='+id)
};
function parklist(id){ //入园记录
window.open('/index/datav/park_list?id='+id)
};
function waybill_list(id){ //运单记录
window.open('/index/datav/waybill_list?id='+id)
};
function history(id){ //车辆轨迹
window.open('/index/datav/vehicle_history?id='+id)
};
function dataHandle(data) {
let lv1 = [], lv2 = [], lv3 = [], lv4 = [];
data.filter(function (i) {
var res;
if (i.region_lv === 22 && i.region_type === 8) { //停车场
//res = false;
overlayGroups.fac.push(lvOverRender(i, {
fillColor: stopcolor,
fillOpacity: .3,
strokeColor: stopcolor,
extData: {
type: 'stop',
name: i.name
}
}))
} else if (i.region_lv === 21 && i.region_type === 3) { //居住区
//res = false;
overlayGroups.fac.push(lvOverRender(i, {
fillColor: livcolor,
fillOpacity: .5,
strokeColor: livcolor,
extData: {
type: 'live',
name: i.name
}
}))
} else if (i.region_lv === 20 && i.region_type === 4) { //森林防护区
overlayGroups.fac.push(lvOverRender(i, {
fillColor: '#26c533',
strokeColor: '#26c533',
extData: {
type: 'tree',
name: i.name
}
}))
} else {
res = true;
}
return res;
}).forEach(i => {
if (i.info) {
let stys = {}
if (i.region_type == 5) {
stys = {
[i.id]: {
fillColor: '#000000',
fillOpacity: .1,
strokeColor: '#000000',
}
}
}
var over = lvOverRender(i, stys[i.id] || {})
switch (i.region_lv) {
case 22:
lv1.push(over);
break;
case 20:
lv2.push(over);
break;
case 21:
lv3.push(over);
break;
default:
lv4.push(over);
break;
}
}
})
overlayGroups.enter = {
lv1, lv2, lv3, lv4
}
}
</script>
</body>
</html>