/*
##### 수정로그 #####
2021.11.25 김현중 신규
*/
$(function(){
//**************************************** GLOBAL ********************************************//
// widget
var layout;
var mix_obj = function(){
this.mix1_graph;
this.mix2_graph;
this.mix3_graph;
this.mix4_graph;
this.mix5_graph;
this.mix6_graph;
};
var mix_box = new mix_obj();
// data
var temperature_data;
var humidity_data;
var metal_data;
var packing_data;
//*************************************** CONFIG & LOGIC ******************************************//
//LAYOUT [Main] (5*2)
function create_layout(){
return new dhx.Layout("layout", { //LAYOUT
type: "space",
width: "100%",
rows: [
{
padding:'15px',
type: "wide",
cols: [
{
width: "19.5%",
rows: [
{
header: "교반기1",
id: "mix1",
},
{
id: "mix1_set",
html: "세팅시간(분) : 0"
},
{
height: '15%',
cols: [
{
header: "세팅온도",
id: "set_temp1",
css: "set_temp",
html: 0,
},
{
header: "현재온도",
id: "now_temp1",
css: "now_temp",
html: 0,
},
]
},
]
},
{
width: "19.5%",
rows: [
{
header: "교반기2",
id: "mix2",
},
{
id: "mix2_set",
html: "세팅시간(분) : 0"
},
{
height: '15%',
cols: [
{
header: "세팅온도",
id: "set_temp2",
css: "set_temp",
html: 0,
},
{
header: "현재온도",
id: "now_temp2",
css: "now_temp",
html: 0,
},
]
},
]
},
{
width: "19.5%",
rows: [
{
header: "교반기3",
id: "mix3",
},
{
id: "mix3_set",
html: "세팅시간(분) : 0"
},
{
height: '15%',
cols: [
{
header: "세팅온도",
id: "set_temp3",
css: "set_temp",
html: 0,
},
{
header: "현재온도",
id: "now_temp3",
css: "now_temp",
html: 0,
},
]
},
]
},
{
header: "금속검출기 (검출/검사)",
width: "19.5%",
id: "metal",
html: "0/0",
},
{
header: "포장기(개)",
width: "19.5%",
id: "packing",
html: "0",
},
]
},
{
padding:'15px',
type: "wide",
cols: [
{
width: "19.5%",
rows: [
{
header: "교반기4",
id: "mix4",
},
{
id: "mix4_set",
html: "세팅시간(분) : 0"
},
{
height: '15%',
cols: [
{
header: "세팅온도",
id: "set_temp4",
css: "set_temp",
html: 0,
},
{
header: "현재온도",
id: "now_temp4",
css: "now_temp",
html: 0,
},
]
},
]
},
{
width: "19.5%",
rows: [
{
header: "교반기5",
id: "mix5",
},
{
id: "mix5_set",
html: "세팅시간(분) : 0"
},
{
height: '15%',
cols: [
{
header: "세팅온도",
id: "set_temp5",
css: "set_temp",
html: 0,
},
{
header: "현재온도",
id: "now_temp5",
css: "now_temp",
html: 0,
},
]
},
]
},
{
width: "19.5%",
rows: [
{
header: "교반기6",
id: "mix6",
},
{
id: "mix6_set",
html: "세팅시간(분) : 0"
},
{
height: '15%',
cols: [
{
header: "세팅온도",
id: "set_temp6",
css: "set_temp",
html: 0,
},
{
header: "현재온도",
id: "now_temp6",
css: "now_temp",
html: 0,
},
]
},
]
},
{
header: "온도(°C)",
width: "19.5%",
id: "temperature",
html: "0",
},
{
header: "습도(%)",
width: "19.5%",
id: "humidity",
html: "0",
},
]
},
]
});
}
//GRAPH [pie]
function create_graph(){
return new dhx.Chart("", {
type: "pie",
series: [
{
value: "value",
color: "color",
}
],
legend: {
values: {
id: "value",
text: "name",
color: "color"
},
halign: "right",
valign: "top"
}
});
};
//*************************************** FUNCTION [QUERY] ******************************************//
//mix [select]
function realtime_mix(starttime, settime, number){
setInterval(function(){
//graph
starttime = starttime < settime ? starttime + 1 : 0;
var mix_data = [{'name':'작동시간', 'value':starttime, 'color':'crimson'},{'name':'남은시간', 'value':settime - starttime, 'color':'#17a68c'}];
mix_box[`mix${number}_graph`].data.parse(mix_data);
//html
layout.getCell(`mix${number}_set`).attachHTML(`세팅시간(분) : ${settime}`);
var random_temp = (Math.random() * 100).toFixed(2);
var set_temp = 135;
layout.getCell(`set_temp${number}`).attachHTML(set_temp);
layout.getCell(`now_temp${number}`).attachHTML(random_temp);
},50);
}
//metal [select]
function realtime_meta(){
select_async('',[{
'table':'metalfind',
'column' : ['meta_inspectcnt','meta_findcnt'],
'order' : {'meta_regdate':'desc'},
'limit' : [0,1],
}]
).then((result_data)=>{
result_data = result_data.data[Object.keys(result_data.data)[0]][0];
//html
layout.getCell('metal').attachHTML(String(result_data.meta_inspectcnt)+'/'+String(result_data.meta_findcnt));
});
}
//packing [select]
function realtime_pack(){
select_async('',[{
'table':'packing',
'column' : ['pack_cnt'],
'order' : {'pack_regdate':'desc'},
'limit' : [0,1],
}]
).then((result_data)=>{
result_data = result_data.data[Object.keys(result_data.data)[0]][0];
//html
layout.getCell('packing').attachHTML(result_data.pack_cnt);
});
}
//temperature [select]
function realtime_temp(){
select_async('',[{
'table':'temperature',
'column' : ['temp_data'],
'order' : {'temp_regdate':'desc'},
'limit' : [0,1],
}]
).then((result_data)=>{
result_data = result_data.data[Object.keys(result_data.data)[0]][0];
//html
layout.getCell('temperature').attachHTML(result_data.temp_data);
});
}
//humidity [select]
function realtime_humi(){
select_async('',[{
'table':'humidity',
'column' : ['humi_data'],
'order' : {'humi_regdate':'desc'},
'limit' : [0,1],
}]
).then((result_data)=>{
result_data = result_data.data[Object.keys(result_data.data)[0]][0];
//html
layout.getCell('humidity').attachHTML(result_data.humi_data);
});
}
//*************************************** EXECUTION ******************************************//
//<<<<<<<<<<<< CREATE WIDGET >>>>>>>>>>>>>>
//layout
layout = create_layout();
//graph
mix_box.mix1_graph = create_graph();
mix_box.mix2_graph = create_graph();
mix_box.mix3_graph = create_graph();
mix_box.mix4_graph = create_graph();
mix_box.mix5_graph = create_graph();
mix_box.mix6_graph = create_graph();
layout.getCell('mix1').attach(mix_box.mix1_graph);
layout.getCell('mix2').attach(mix_box.mix2_graph);
layout.getCell('mix3').attach(mix_box.mix3_graph);
layout.getCell('mix4').attach(mix_box.mix4_graph);
layout.getCell('mix5').attach(mix_box.mix5_graph);
layout.getCell('mix6').attach(mix_box.mix6_graph);
// <<<<<<<<<<<< REALTIME EVENT >>>>>>>>>>>>>>
mix1
realtime_mix(0, 15, 1);
mix2
realtime_mix(3, 54, 2);
mix3
realtime_mix(6, 22, 3);
mix4
realtime_mix(1, 35, 4);
mix5
realtime_mix(25, 43, 5);
mix6
realtime_mix(12, 39, 6);
//metal
realtime_meta();
setInterval(() => realtime_meta(), 3000);
//packing
realtime_pack();
setInterval(() => realtime_pack(), 1000);
//temperature
realtime_temp();
setInterval(() => realtime_temp(), 1000);
//humidity
realtime_humi();
setInterval(() => realtime_humi(), 1000);
});
