var layer;
|
var form;
|
var curCamera;
|
var firstQuantity;
|
var hisChart = null; //曲线图
|
var listRecord;
|
var fileRecord;
|
var names = ['12-01', '12-02', '12-03', '12-04', '12-05', '12-06', '12-07'];
|
var data = [2560000, 2510000, 2540000, 2530000, 2490000, 2610000, 2570000];
|
|
layui.use(['layer'], function () {
|
form = layui.form;
|
layer = layui.layer;
|
|
// 调色板切换事件
|
document.querySelectorAll('.palette-item').forEach(item => {
|
item.addEventListener('click', function () {
|
document.querySelectorAll('.palette-item').forEach(i => {
|
i.classList.remove('active');
|
});
|
this.classList.add('active');
|
const paletteName = this.textContent.trim();
|
layer.msg(`已切换至${paletteName}调色板`, {icon: 1, time: 1000});
|
});
|
});
|
|
|
//选择摄像头后触发的事件
|
const cameraSelect = document.getElementById('select-camera');
|
cameraSelect.addEventListener('change', function () {
|
const selectId = this.value;
|
|
ajaxData(selectId);
|
});
|
|
// 初始化走势图
|
initEcharts(names, data);
|
|
});
|
|
/**
|
* 视频播放
|
* @param selectId
|
*/
|
function ajaxData(selectId) {
|
curCamera = null;
|
//从列表中获取摄像头信息
|
curCamera = listCamera.find(camera => camera.depotId === selectId);
|
if (!curCamera) {
|
layer.msg('没有获取到当前摄像头信息……', {icon: 1, time: 1200});
|
return;
|
}
|
|
//获取视频
|
video();
|
|
//渲染走势图
|
ajaxEcharts();
|
|
//渲染记录
|
ajaxListRecord();
|
|
//渲染抓拍图
|
ajaxSnapImg();
|
}
|
|
/**
|
* 请求图表信息
|
*/
|
function ajaxSnapImg() {
|
if(!firstQuantity){
|
renderSnapImg();
|
return;
|
}
|
fileRecord = null;
|
var data = {
|
key: firstQuantity.batchId
|
};
|
$.ajax({
|
type: 'POST',
|
url: "/security/quantity-files",
|
dataType: 'JSON',
|
contentType: "application/json;charset=UTF-8",
|
data: JSON.stringify(data),
|
success: function (result) {
|
if (result.code != "SUCCESS") {
|
renderSnapImg();
|
} else {
|
fileRecord = result.data;
|
renderSnapImg();
|
}
|
},
|
error: function (result) {
|
renderSnapImg();
|
}
|
});
|
}
|
|
/**
|
* 渲染抓图
|
* @returns {null}
|
*/
|
function renderSnapImg() {
|
|
if (!fileRecord) return null;
|
|
if (fileRecord.length === 0) return null;
|
|
var record = fileRecord[0];
|
if (record) {
|
$("#file-time1").text(record.createTime);
|
$("#file-img1").attr("src", record.filePath);
|
} else {
|
$("#file-time1").text("----");
|
$("#file-img1").attr("src", "/img/web/security/p-snap.jpg");
|
}
|
|
record = fileRecord[1];
|
if (record) {
|
$("#file-time2").text(record.createTime);
|
$("#file-img2").attr("src", record.filePath);
|
} else {
|
$("#file-time2").text("----");
|
$("#file-img2").attr("src", "/img/web/security/p-snap.jpg");
|
}
|
|
record = fileRecord[2];
|
if (record) {
|
$("#file-time3").text(record.createTime);
|
$("#file-img3").attr("src", record.filePath);
|
} else {
|
$("#file-time3").text("----");
|
$("#file-img3").attr("src", "/img/web/security/p-snap.jpg");
|
}
|
|
record = fileRecord[3];
|
if (record) {
|
$("#file-time4").text(record.createTime);
|
$("#file-img4").attr("src", record.filePath);
|
} else {
|
$("#file-time4").text("----");
|
$("#file-img4").attr("src", "/img/web/security/p-snap.jpg");
|
}
|
}
|
|
/**
|
* 请求图表信息
|
*/
|
function ajaxEcharts() {
|
var data = {
|
depotId: curCamera.depotId
|
};
|
$.ajax({
|
type: 'POST',
|
url: "/security/quantity-chart",
|
dataType: 'JSON',
|
contentType: "application/json;charset=UTF-8",
|
data: JSON.stringify(data),
|
success: function (result) {
|
if (result.code != "SUCCESS") {
|
renderEcharts(null);
|
} else {
|
renderEcharts(result.data);
|
}
|
},
|
error: function (result) {
|
renderEcharts(null);
|
}
|
});
|
}
|
|
/**
|
* 渲染图表
|
* @param chartData
|
*/
|
function renderEcharts(chartData) {
|
var chart = hisChart;
|
if (chartData && chartData.xaxis.length > 0 && chartData.seriesData.length > 0) {
|
chart.option.xAxis.data = chartData.xaxis;
|
chart.option.series[0].data = chartData.seriesData;
|
chart.chart.setOption(chart.option, true);
|
} else {
|
chart.option.xAxis.data = names;
|
chart.option.series[0].data = data;
|
chart.chart.setOption(chart.option, true);
|
}
|
hisChart = chart;
|
}
|
|
/**
|
* 请求记录
|
*/
|
function ajaxListRecord() {
|
firstQuantity = null;
|
listRecord = null;
|
var data = {
|
depotId: curCamera.depotId
|
};
|
$.ajax({
|
type: 'POST',
|
url: "/security/quantity-list",
|
dataType: 'JSON',
|
contentType: "application/json;charset=UTF-8",
|
data: JSON.stringify(data),
|
success: function (result) {
|
if (result.code != "SUCCESS") {
|
renderListRecord();
|
} else {
|
listRecord = result.data;
|
renderListRecord();
|
}
|
},
|
error: function (result) {
|
renderListRecord();
|
}
|
});
|
}
|
|
/**
|
* 渲染记录
|
* @returns {null}
|
*/
|
function renderListRecord() {
|
|
if (!listRecord) return null;
|
|
if (listRecord.length === 0) return null;
|
|
var record = listRecord[0];
|
if (record) {
|
firstQuantity = record;
|
$("#record_title1").text("检测重量：" + record.weight + " KG");
|
$("#record_time1").text(record.receiveDate);
|
$("#record_content1").text(record.remark);
|
} else {
|
$("#record_title1").text("检测重量：---- KG");
|
$("#record_time1").text("----");
|
$("#record_content1").text("检测重量为---- KG，实际重量为---- KG，误差小于-%。");
|
}
|
|
record = listRecord[1];
|
if (record) {
|
$("#record_title2").text("检测重量：" + record.weight + " KG");
|
$("#record_time2").text(record.receiveDate);
|
$("#record_content2").text(record.remark);
|
} else {
|
$("#record_title2").text("检测重量：---- KG");
|
$("#record_time2").text("----");
|
$("#record_content2").text("检测重量为---- KG，实际重量为---- KG，误差小于-%。");
|
}
|
|
record = listRecord[2];
|
if (record) {
|
$("#record_title3").text("检测重量：" + record.weight + " KG");
|
$("#record_time3").text(record.receiveDate);
|
$("#record_content3").text(record.remark);
|
} else {
|
$("#record_title3").text("检测重量：---- KG");
|
$("#record_time3").text("----");
|
$("#record_content3").text("检测重量为---- KG，实际重量为---- KG，误差小于-%。");
|
}
|
|
record = listRecord[3];
|
if (record) {
|
$("#record_title4").text("检测重量：" + record.weight + " KG");
|
$("#record_time4").text(record.receiveDate);
|
$("#record_content4").text(record.remark);
|
} else {
|
$("#record_title4").text("检测重量：---- KG");
|
$("#record_time4").text("----");
|
$("#record_content4").text("检测重量为---- KG，实际重量为---- KG，误差小于-%。");
|
}
|
}
|
|
/**
|
* 视频播放
|
* @param
|
*/
|
function video() {
|
|
var data = {
|
id: curCamera.cameraSn,
|
playType: curCamera.playType
|
};
|
$.ajax({
|
type: 'POST',
|
url: "/security/get-media",
|
dataType: 'JSON',
|
contentType: "application/json;charset=UTF-8",
|
data: JSON.stringify(data),
|
success: function (result) {
|
if (result.code != "SUCCESS") {
|
layer.msg(result.msg, {icon: 1, time: 1200});
|
} else {
|
toPlay(result.playUrl);
|
}
|
},
|
error: function (result) {
|
layer.msg("未获取到播放信息！！", {icon: 1, time: 1200});
|
}
|
});
|
|
}
|
|
/**
|
* 播放视频
|
* @param url
|
*/
|
function toPlay(url) {
|
var html = '';
|
if (url) {
|
html += '<iframe src="' + url + '" width="100%" height="100%" frameborder="0" allowfullscreen></iframe>';
|
} else {
|
html += '<img src="/img/web/security/p-snap.jpg">';
|
}
|
$("#divPlugin2").html(html);
|
}
|
|
/**
|
* 启动开始检测
|
*/
|
function checkStart() {
|
if (!curCamera) {
|
shoTips("请先选择设备！");
|
return;
|
}
|
layer.msg("开始执行……");
|
var data = {
|
'depotId': curCamera.depotId
|
};
|
$.ajax({
|
type: "POST",
|
url: "/security/check-single",
|
dataType: "json",
|
contentType: "application/json;charset=UTF-8",
|
data: JSON.stringify(data),
|
success: function (result) {
|
if (result.code == "ORDER_SUCCESS") {
|
shoTips("命令发生成功，请等待终端返回结果……");
|
} else {
|
shoTips("命令发送失败：" + result.msg);
|
}
|
},
|
error: function () {
|
shoTips("检测出现异常，执行失败！");
|
}
|
});
|
}
|
|
/**
|
* 停止检测
|
*/
|
function checkStop() {
|
if (!curCamera) {
|
shoTips("请先选择仓库！");
|
return;
|
}
|
layer.msg("开始执行……");
|
var data = {
|
'depotId': curCamera.depotId
|
};
|
$.ajax({
|
type: "POST",
|
url: "/security/check-stop",
|
dataType: "json",
|
contentType: "application/json;charset=UTF-8",
|
data: JSON.stringify(data),
|
success: function (result) {
|
if (result.code == "ORDER_SUCCESS") {
|
shoTips("命令发生成功……");
|
} else {
|
shoTips("命令发送失败：" + result.msg);
|
}
|
},
|
error: function () {
|
shoTips("检测出现异常，执行失败！");
|
}
|
});
|
}
|
|
// 初始化ECharts温度走势图
|
function initEcharts(names, data) {
|
// 初始化ECharts温度走势图
|
var temperatureChartDom = document.getElementById('temperatureChart');
|
var temperatureChart = echarts.init(temperatureChartDom);
|
|
// 图表配置项
|
var option = {
|
tooltip: {
|
trigger: 'axis',
|
axisPointer: {
|
type: 'cross',
|
label: {
|
backgroundColor: '#6a7985'
|
}
|
}
|
},
|
legend: {
|
data: ['数量 (KG)'],
|
top: 0
|
},
|
grid: {
|
left: '3%',
|
right: '4%',
|
bottom: '3%',
|
containLabel: true
|
},
|
xAxis: [
|
{
|
type: 'category',
|
boundaryGap: false,
|
data: names
|
}
|
],
|
yAxis: [
|
{
|
type: 'value',
|
name: '数量 (KG)',
|
min: 0,
|
max: 3000000,
|
axisLabel: {
|
formatter: '{value} KG'
|
}
|
}
|
],
|
series: [
|
{
|
name: '数量 (KG)',
|
type: 'line',
|
smooth: true,
|
lineStyle: {
|
width: 2,
|
color: '#0f3460'
|
},
|
areaStyle: {
|
color: new echarts.graphic.LinearGradient(0, 0, 0, 1, [
|
{offset: 0, color: 'rgba(15, 52, 96, 0.3)'},
|
{offset: 1, color: 'rgba(15, 52, 96, 0.05)'}
|
])
|
},
|
data: data
|
}
|
]
|
};
|
// 渲染图表
|
option && temperatureChart.setOption(option);
|
hisChart = {"chart": temperatureChart, "option": option};
|
|
// 窗口大小变化时调整图表大小
|
window.addEventListener('resize', function () {
|
temperatureChart.resize();
|
});
|
}
|
|
function shoTips(msg) {
|
layer.msg(msg,
|
{time: 3000, shift: 5, offset: "rb"},
|
function () {
|
});
|
}
|
