2023-03-03 16:07:50 +08:00
|
|
|
|
@{
|
|
|
|
|
ViewBag.Title = "Index";
|
|
|
|
|
Layout = "~/Views/Shared/_Index.cshtml";
|
|
|
|
|
}
|
|
|
|
|
<style>
|
|
|
|
|
|
|
|
|
|
.layui-table-tool > .layui-table-tool-temp {
|
|
|
|
|
padding-right: 0px;
|
|
|
|
|
}
|
|
|
|
|
</style>
|
|
|
|
|
<script>
|
|
|
|
|
|
|
|
|
|
layui.use(['jquery', 'form', 'table', 'common', 'dtree', 'commonTable', 'optimizeSelectOption'], function () {
|
|
|
|
|
var $ = layui.jquery,
|
|
|
|
|
form = layui.form,
|
|
|
|
|
commonTable = layui.commonTable,
|
|
|
|
|
table = layui.table,
|
|
|
|
|
dtree = layui.dtree,
|
|
|
|
|
//echarts = layui.echarts,
|
|
|
|
|
common = layui.common;
|
|
|
|
|
//加载数据
|
|
|
|
|
wcLoading.close();
|
|
|
|
|
//权限控制(js是值传递)
|
|
|
|
|
//toolbarDemo.innerHTML = common.authorizeButtonNew(toolbarDemo.innerHTML);
|
|
|
|
|
|
|
|
|
|
GetAllSubsystemTag();
|
|
|
|
|
|
|
|
|
|
var starttime = new Date(new Date().setHours(0, 0, 0, 0));
|
|
|
|
|
var starttimeString = starttime.getFullYear() + "-" + parseInt(starttime.getMonth() + 1) + "-" + starttime.getDate() + " " + (starttime.getHours()) + ":" + starttime.getMinutes() + ":" + starttime.getSeconds();
|
|
|
|
|
var endtime = new Date();
|
|
|
|
|
endtime.setDate(endtime.getDate())
|
|
|
|
|
var endtimeString = endtime.getFullYear() + "-" + parseInt(endtime.getMonth() + 1) + "-" + endtime.getDate() + " " + (endtime.getHours()) + ":" + endtime.getMinutes() + ":" + endtime.getSeconds();
|
|
|
|
|
layui.use('laydate', function () {
|
|
|
|
|
var laydate = layui.laydate;
|
|
|
|
|
lay('#dateReStartTime').each(function () {
|
|
|
|
|
laydate.render({
|
|
|
|
|
elem: this,
|
|
|
|
|
trigger: 'click',
|
|
|
|
|
format: "yyyy-MM-dd HH:mm:ss",
|
|
|
|
|
//value: "2023-02-23 13:56:25",
|
|
|
|
|
value: starttimeString,
|
|
|
|
|
});
|
|
|
|
|
});
|
|
|
|
|
lay('#dateReEndTime').each(function () {
|
|
|
|
|
laydate.render({
|
|
|
|
|
elem: this,
|
|
|
|
|
trigger: 'click',
|
|
|
|
|
format: "yyyy-MM-dd HH:mm:ss",
|
|
|
|
|
//value: "2023-02-23 13:56:25",
|
|
|
|
|
value: endtimeString,
|
|
|
|
|
});
|
|
|
|
|
});
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
var t = null;
|
|
|
|
|
var StaticSelectTagList = new Array();
|
|
|
|
|
var SelectTagIDlist = new Array();
|
|
|
|
|
|
|
|
|
|
//获取所有子系统列表ok
|
|
|
|
|
async function GetAllSubsystemTag() {
|
|
|
|
|
debugger;
|
|
|
|
|
$.ajax({
|
|
|
|
|
url: "/ChartsManage/Rtcharts/GetAllSubsystemTag",
|
|
|
|
|
type: "Get",
|
|
|
|
|
//dataType: "json",
|
|
|
|
|
//async: false,
|
|
|
|
|
//data: datapa,
|
|
|
|
|
success: function (redata) {
|
|
|
|
|
debugger;
|
|
|
|
|
var listsubsysname = JSON.parse(redata);
|
|
|
|
|
$('#subsystemselect').combobox({
|
|
|
|
|
data: listsubsysname,
|
|
|
|
|
valueField: 'Lable',
|
|
|
|
|
textField: 'Value',
|
|
|
|
|
|
|
|
|
|
checkOnSelect: true,
|
|
|
|
|
selectOnCheck: true
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
//获取选中子系统tag
|
|
|
|
|
updateSelect = async function (data) {
|
|
|
|
|
var para = { "SubsysytemName": data.Value }
|
|
|
|
|
//var subsystemAllTag = await Call(api.DataHistoryCharts.GetSubsystemAllTag, para);
|
|
|
|
|
debugger;
|
|
|
|
|
myajax = $.ajax({
|
|
|
|
|
url: "/ChartsManage/Rtcharts/GetSubsystemAllTag",
|
|
|
|
|
type: "Post",
|
|
|
|
|
//dataType: "json",
|
|
|
|
|
data: para,
|
|
|
|
|
success: function (redata) { }
|
|
|
|
|
});
|
|
|
|
|
debugger;
|
|
|
|
|
$.when(myajax).done(function (redata) {
|
|
|
|
|
var subsystemAllTag = JSON.parse(redata);
|
|
|
|
|
$('#subsystemTagList').datalist({
|
|
|
|
|
data: subsystemAllTag,
|
|
|
|
|
valueField: 'TagID',
|
|
|
|
|
textField: 'Description',
|
|
|
|
|
idField: 'TagID',
|
|
|
|
|
});
|
|
|
|
|
var datalistArr = $('#subsystemTagList').datalist("getData").rows;
|
|
|
|
|
if (datalistArr.length > 0 && StaticSelectTagList.length > 0) {
|
|
|
|
|
for (var ni = 0; ni < datalistArr.length; ni++) {
|
|
|
|
|
if (StaticSelectTagList.indexOf(datalistArr[i]) != -1) {
|
|
|
|
|
$('#subsystemTagList').datalist("selectRecord", datalistArr[i].TagID);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
$('#subsystemTagList').datalist('resize', {
|
|
|
|
|
height: ($('#aright').height() - 75)
|
|
|
|
|
});
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
checkTagAdd = function (rowIndex, rowData) {
|
|
|
|
|
checkAddTaglist(rowData);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function checkAddTaglist(rowData) {
|
|
|
|
|
if (StaticSelectTagList.indexOf(rowData) == -1) {
|
|
|
|
|
StaticSelectTagList.push(rowData);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
checkTagDec = function (rowIndex, rowData) {
|
|
|
|
|
checkDecTaglist(rowData);
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function checkDecTaglist(rowData) {
|
|
|
|
|
if (StaticSelectTagList.indexOf(rowData) != -1) {
|
|
|
|
|
StaticSelectTagList.splice(StaticSelectTagList.indexOf(rowData), 1);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
//获取tagvalue
|
|
|
|
|
async function GetChartsTagValue() {
|
|
|
|
|
var chardatalist = new Array();
|
|
|
|
|
SelectTagIDlist.splice(0, SelectTagIDlist.length)
|
|
|
|
|
for (var si = 0; si < StaticSelectTagList.length; si++) {
|
|
|
|
|
SelectTagIDlist.push(StaticSelectTagList[si].TagID);
|
|
|
|
|
}
|
|
|
|
|
//debugger;
|
|
|
|
|
////拼接数组para参数
|
|
|
|
|
//var stringArrayPa = [];
|
|
|
|
|
//$.each(SelectTagIDlist,function(index,value){
|
|
|
|
|
// stringArrayPa.push(value);
|
|
|
|
|
//});
|
|
|
|
|
//debugger;
|
|
|
|
|
myajax = await $.ajax({
|
|
|
|
|
url: "/ChartsManage/Rtcharts/GetChartsTagValueInit",
|
|
|
|
|
type: "Post",
|
|
|
|
|
dataType: "json",
|
|
|
|
|
traditional: true,//这里设置为true
|
|
|
|
|
data: { charts_TagIDs: SelectTagIDlist },
|
|
|
|
|
success: function (redata) { }
|
|
|
|
|
});
|
|
|
|
|
debugger;
|
|
|
|
|
$.when(myajax).done(function (redata) {
|
|
|
|
|
chardatalist = redata;
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
return chardatalist;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
clearchart = async function() {
|
|
|
|
|
var myChart = echarts.init(document.getElementById('result'));
|
|
|
|
|
//$("#result").empty();
|
|
|
|
|
clearTimeout(t); //清除定时器
|
|
|
|
|
t = null;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
showchart = async function () {
|
|
|
|
|
//(document.getElementById('echarts-records'), 'walden');
|
|
|
|
|
var myChart = echarts.init(document.getElementById('result'), 'walden');
|
|
|
|
|
|
|
|
|
|
myChart.hideLoading();
|
|
|
|
|
myChart.showLoading();
|
|
|
|
|
|
|
|
|
|
var chardatalist = await GetChartsTagValue();
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
debugger;
|
|
|
|
|
myChart.dispose();
|
|
|
|
|
|
|
|
|
|
var xDataArr = new Array();
|
|
|
|
|
var yDataArr = new Array();
|
|
|
|
|
for (var listindex = 0; listindex < chardatalist.length; listindex++) {
|
|
|
|
|
let ydata = chardatalist[listindex].map(x => { return x.value });
|
|
|
|
|
let xdata = chardatalist[listindex].map(x => { return x.name });
|
|
|
|
|
xDataArr.push(xdata);
|
|
|
|
|
yDataArr.push(ydata);
|
|
|
|
|
}
|
|
|
|
|
var lightwhite = 0;
|
|
|
|
|
if (chardatalist.length > 1) {
|
|
|
|
|
lightwhite = (chardatalist.length - 1) * 100;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
//var lightwhite = (chardatalist.length) * 100;
|
|
|
|
|
var color = new Array();
|
|
|
|
|
for (var colori = 0; colori < StaticSelectTagList.length; colori++) {
|
|
|
|
|
color.push(roundrgb())
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
var yAxis = new Array();
|
|
|
|
|
for (var ci = 0; ci < StaticSelectTagList.length; ci++) {
|
|
|
|
|
if (ci == 0) {
|
|
|
|
|
let yAxisdata = {
|
|
|
|
|
name: JSON.parse(JSON.stringify(StaticSelectTagList[ci].Description)),
|
|
|
|
|
nameLocation: 'center',
|
|
|
|
|
type: 'value',
|
|
|
|
|
//坐标轴两边留白策略,设置max、min后失效
|
|
|
|
|
boundaryGap: ['5%', '2%'],
|
|
|
|
|
scale: true,
|
|
|
|
|
// max: 700,
|
|
|
|
|
// min: 0,
|
|
|
|
|
// 让表格的刻度向靠里侧显示
|
|
|
|
|
axisTick: {
|
|
|
|
|
inside: true
|
|
|
|
|
},
|
|
|
|
|
axisLabel: {
|
|
|
|
|
inside: true,
|
|
|
|
|
align: 'left',
|
|
|
|
|
verticalAlign: 'bottom',
|
|
|
|
|
},
|
|
|
|
|
// 设置刻度线的颜色等样式
|
|
|
|
|
axisLine: {
|
|
|
|
|
show: true,
|
|
|
|
|
lineStyle: {
|
|
|
|
|
color: color[ci],
|
|
|
|
|
width: 3
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
splitLine: {
|
|
|
|
|
show: true, //想要不显示网格线,改为false
|
|
|
|
|
lineStyle: {
|
|
|
|
|
// 设置网格为虚线
|
|
|
|
|
type: 'dashed'
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
yAxis.push(yAxisdata);
|
|
|
|
|
}
|
|
|
|
|
else {
|
|
|
|
|
let yAxisdata = {
|
|
|
|
|
name: JSON.parse(JSON.stringify(StaticSelectTagList[ci].Description)),
|
|
|
|
|
nameLocation: 'center',
|
|
|
|
|
// max: 800,
|
|
|
|
|
// min: 0,
|
|
|
|
|
type: 'value',
|
|
|
|
|
//坐标轴两边留白策略,设置max、min后失效
|
|
|
|
|
boundaryGap: ['5%', '2%'],
|
|
|
|
|
axisLabel: {
|
|
|
|
|
inside: true,
|
|
|
|
|
align: 'right',
|
|
|
|
|
verticalAlign: 'bottom',
|
|
|
|
|
},
|
|
|
|
|
axisLine: {
|
|
|
|
|
show: true,
|
|
|
|
|
lineStyle: {
|
|
|
|
|
color: color[ci],
|
|
|
|
|
width: 3
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
splitLine: {
|
|
|
|
|
show: false //想要不显示网格线,改为false
|
|
|
|
|
},
|
|
|
|
|
// 设置坐标轴偏移位置
|
|
|
|
|
offset: (ci - 1) * 100
|
|
|
|
|
//offset: (ci) * 100
|
|
|
|
|
}
|
|
|
|
|
yAxis.push(yAxisdata);
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
var series = new Array();
|
|
|
|
|
for (var si = 0; si < StaticSelectTagList.length; si++) {
|
2023-03-20 22:54:52 +08:00
|
|
|
|
//bool变量取消平滑采取折线
|
|
|
|
|
let issmooth = !(StaticSelectTagList[si].Units === 'Y/N')
|
2023-03-03 16:07:50 +08:00
|
|
|
|
let seriesdata = {
|
|
|
|
|
data: yDataArr[si],
|
|
|
|
|
// 曲线名
|
|
|
|
|
name: JSON.parse(JSON.stringify(StaticSelectTagList[si].Description)),
|
|
|
|
|
// 设置参数对应的y坐标轴的索引
|
|
|
|
|
yAxisIndex: si,
|
|
|
|
|
type: 'line',
|
|
|
|
|
// 曲线平滑设置
|
2023-03-20 22:54:52 +08:00
|
|
|
|
smooth: issmooth
|
2023-03-03 16:07:50 +08:00
|
|
|
|
}
|
|
|
|
|
series.push(seriesdata);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
// 设置鼠标hover时的提示信息
|
|
|
|
|
var tooltip = {
|
|
|
|
|
trigger: 'axis', // 有3个属性值 axis item none
|
|
|
|
|
axisPointer: {
|
|
|
|
|
type: 'cross',
|
|
|
|
|
label: {
|
|
|
|
|
backgroundColor: '#6a7985' //配置展示方块的背景颜色
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
// 调整表格两边的空白的区
|
|
|
|
|
var grid = {
|
|
|
|
|
//left:'20px'
|
|
|
|
|
// 左侧
|
|
|
|
|
x: '50px',
|
|
|
|
|
// 上部
|
|
|
|
|
// y: 25,
|
|
|
|
|
// 右侧
|
|
|
|
|
x2: lightwhite + 'px',
|
|
|
|
|
// 下部
|
|
|
|
|
// y2: 35
|
|
|
|
|
}
|
|
|
|
|
var letest = ['tg', 'fe', 'wdf'];
|
|
|
|
|
// 调整图样的名称 // 定义图样和每条曲线的颜色
|
|
|
|
|
var legend = new Array();
|
|
|
|
|
for (var li = 0; li < StaticSelectTagList.length; li++) {
|
|
|
|
|
let legenddata = StaticSelectTagList[li].Description;
|
|
|
|
|
legend.push(JSON.parse(JSON.stringify(legenddata)));
|
|
|
|
|
}
|
|
|
|
|
var dataZoom = {
|
|
|
|
|
//type: 'slider'
|
|
|
|
|
show: false,
|
|
|
|
|
start: 0,
|
|
|
|
|
end: 100
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
var option = {
|
|
|
|
|
xAxis: {
|
|
|
|
|
name: '时间',
|
|
|
|
|
type: 'category',
|
|
|
|
|
position: 'bottom',
|
|
|
|
|
data: xDataArr[0],
|
|
|
|
|
// boundaryGap: false, //x下标在刻度处显示
|
|
|
|
|
splitLine: {
|
|
|
|
|
show: true, //想要不显示网格线,改为false
|
|
|
|
|
lineStyle: {
|
|
|
|
|
// 设置网格为虚线
|
|
|
|
|
type: 'dashed'
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
// splitArea: { show: true }, //保留网格区域
|
|
|
|
|
// 设置刻度线的颜色等样式
|
|
|
|
|
axisLine: {
|
|
|
|
|
onZero: false,
|
|
|
|
|
lineStyle: {
|
|
|
|
|
color: 'black',
|
|
|
|
|
width: 3
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
},
|
|
|
|
|
yAxis: yAxis,
|
|
|
|
|
series: series,
|
|
|
|
|
tooltip: tooltip,
|
|
|
|
|
grid: grid,
|
|
|
|
|
//legend: legend,
|
|
|
|
|
dataZoom: dataZoom,
|
|
|
|
|
color: color
|
|
|
|
|
};
|
|
|
|
|
setTimeout(bulidchart(option), 500);
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function bulidchart(option) {
|
|
|
|
|
if (option) {
|
|
|
|
|
|
|
|
|
|
var myChart = echarts.init(document.getElementById('result'));
|
|
|
|
|
myChart.hideLoading();
|
|
|
|
|
myChart.setOption(JSON.parse(JSON.stringify(option)));
|
|
|
|
|
t = setTimeout(time, 1 * 1000); //开始运行
|
|
|
|
|
}
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function time() {
|
|
|
|
|
clearTimeout(t); //清除定时器
|
|
|
|
|
UpdataChart()
|
|
|
|
|
t = setTimeout(time, 1 * 1000); //设定定时器,循环运行
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
async function UpdataChart() {
|
|
|
|
|
|
|
|
|
|
var myChart = echarts.init(document.getElementById('result'));
|
|
|
|
|
var option = myChart.getOption();
|
|
|
|
|
//var RtData = new Array();
|
|
|
|
|
var RtData = new Array();
|
|
|
|
|
|
|
|
|
|
myajax = await $.ajax({
|
|
|
|
|
url: "/ChartsManage/Rtcharts/GetChartsTagValue",
|
|
|
|
|
type: "Post",
|
|
|
|
|
dataType: "json",
|
|
|
|
|
traditional: true,//这里设置为true
|
|
|
|
|
data: { charts_TagIDs:SelectTagIDlist},
|
|
|
|
|
success: function (redata) { }
|
|
|
|
|
});
|
|
|
|
|
$.when(myajax).done(function (redata) {
|
|
|
|
|
RtData = redata;
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
//axisData = (new Date()).toLocaleTimeString().replace(/^\D*/, '');//
|
|
|
|
|
let axisData = RtData[0][0].name;
|
|
|
|
|
for (var stl = 0; stl < StaticSelectTagList.length; stl++) {
|
|
|
|
|
if (option.series[stl].data.length > 49) {
|
|
|
|
|
option.series[stl].data.shift();
|
|
|
|
|
}
|
|
|
|
|
option.series[stl].data.push(RtData[stl][0].value);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
//这里是列表,需要获取列表数量
|
|
|
|
|
//var data0 = option.series[0].data;
|
|
|
|
|
//var data1 = option.series[1].data;
|
|
|
|
|
//if (data0.length > 49) {
|
|
|
|
|
// data0.shift();
|
|
|
|
|
//}
|
|
|
|
|
//data0.push(Math.round(Math.random() * 10000));//
|
|
|
|
|
|
|
|
|
|
//data1.shift();
|
|
|
|
|
//data1.push(Math.round(Math.random() * 20));
|
|
|
|
|
if (option.xAxis[0].data.length > 49) {
|
|
|
|
|
option.xAxis[0].data.shift();
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
option.xAxis[0].data.push(axisData);
|
|
|
|
|
//option.xAxis[0].data.shift();
|
|
|
|
|
//option.xAxis[0].data.push(axisData);
|
|
|
|
|
|
|
|
|
|
myChart.setOption(option);
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function roundrgb() {//rgb颜色随机
|
|
|
|
|
const r = Math.floor(Math.random() * 256);
|
|
|
|
|
const g = Math.floor(Math.random() * 256);
|
|
|
|
|
const b = Math.floor(Math.random() * 256);
|
|
|
|
|
return `rgb(${r},${g},${b})`;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</script>
|
|
|
|
|
<html style="height:100%">
|
|
|
|
|
<body style="height:100%">
|
|
|
|
|
|
|
|
|
|
<script type="text/javascript" src="~/lib/echarts-5.3.0/dist/echarts.js"></script>
|
|
|
|
|
<div class="layui-fluid" style="padding:0 0px;height:100%">
|
|
|
|
|
<div class="layui-row layui-col-space5" style="height:100%">
|
|
|
|
|
<div class="layui-col-md2 layui-col-xs3" style="height:100%;padding-right:12px;">
|
|
|
|
|
<div class="layui-card" style="text-align:left;overflow: auto;height:100%" id="toolbarDiv">
|
|
|
|
|
@*<ul id="dataTree" class="dtree" data-id="0"></ul>*@
|
|
|
|
|
<div id="aleft" style="float:left;width:100%;height:100%">
|
|
|
|
|
<div class="easyui-panel" title="选择设备信息" style="width:100%;height:100%">
|
2023-09-07 17:21:02 +08:00
|
|
|
|
@*<div class="easyui-combobox" id="groupselect" name="group" data-options="onSelect:function(rec){updateSelect(rec)}" style="width:100%;height:40px">
|
|
|
|
|
</div>*@
|
2023-03-03 16:07:50 +08:00
|
|
|
|
<div class="easyui-combobox" id="subsystemselect" name="state" data-options="onSelect:function(rec){updateSelect(rec)}" style="width:100%;height:40px">
|
|
|
|
|
</div>
|
|
|
|
|
<div class="easyui-datalist" id="subsystemTagList" title="变量列表" style="position: relative;width:100%;height:auto;overflow:auto;" data-options="
|
|
|
|
|
checkbox: true,
|
|
|
|
|
selectOnCheck: false,
|
|
|
|
|
sigleselect:false,
|
|
|
|
|
onCheck:function(rowIndex,rowData){checkTagAdd(rowIndex,rowData)},
|
|
|
|
|
onUncheck:function(rowIndex,rowData){checkTagDec(rowIndex,rowData)}
|
|
|
|
|
">
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="layui-col-md10 layui-col-xs9" style="height:100%">
|
|
|
|
|
@*<div class="layui-card" style="padding: 5px;">
|
|
|
|
|
<div id="echartdiv" style="width:100%;height: 100%;margin-bottom: 10px;">
|
|
|
|
|
<div id="result" class="echart" style="width: 100%; height: 100% "></div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>*@
|
|
|
|
|
|
|
|
|
|
<form class="layui-form" style="height:auto;" id="formPreviewForm">
|
|
|
|
|
<div id="grid_2" class="layui-form-item layui-row grid active" data-id="grid_2"
|
|
|
|
|
data-tag="grid" data-index="0">
|
|
|
|
|
|
|
|
|
|
<div class="layui-col-md2 widget-col-list column0" data-index="0" data-parentindex="0">
|
|
|
|
|
<div id="bottom_5" class="layui-form-item active" data-id="bottom_5" data-tag="bottom"
|
|
|
|
|
data-index="0">
|
|
|
|
|
<div class="layui-input-block" style="margin-left: 30px;">
|
|
|
|
|
<button id="btn_search" type="button" class="layui-btn custom-zc" ; onclick="showchart()">
|
|
|
|
|
<i class="layui-icon ">
|
|
|
|
|
</i>
|
|
|
|
|
确定
|
|
|
|
|
</button>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="layui-col-md2 widget-col-list column1" data-index="1" data-parentindex="0">
|
|
|
|
|
<div id="bottom_6" class="layui-form-item active" data-id="bottom_6" data-tag="bottom"
|
|
|
|
|
data-index="0">
|
|
|
|
|
<div class="layui-input-block" style="margin-left: 30px;">
|
|
|
|
|
<button id="btn_clear" type="button" class="layui-btn custom-zc" ; onclick="clearchart()">
|
|
|
|
|
<i class="layui-icon ">
|
|
|
|
|
</i>
|
|
|
|
|
重置
|
|
|
|
|
</button>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
</form>
|
|
|
|
|
<form class="layui-form" style="height:calc(100vh - 55px);width:100%" id="tablepanel">
|
|
|
|
|
<div class="layui-panel" id="gridpanel" style="width:100%;height: 100%;margin-bottom: 10px; ">
|
|
|
|
|
<div id="result" class="echart" style="width: 100%; height: 100% "></div>
|
|
|
|
|
</div>
|
|
|
|
|
</form>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</body>
|
|
|
|
|
</html>
|