305 lines
6.9 KiB
HTML
305 lines
6.9 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="de">
|
|
<head>
|
|
<meta charset="UTF-8">
|
|
<title>Workorder Activation</title>
|
|
|
|
<script src="/backend/jquery/jquery-3.7.1.min.js"></script>
|
|
|
|
<style>
|
|
/* ===== BASE THEME (Workbench / HMI) ===== */
|
|
:root{
|
|
--bg:#0b1020;
|
|
--card:rgba(255,255,255,0.08);
|
|
--border:rgba(255,255,255,0.14);
|
|
--text:rgba(255,255,255,0.92);
|
|
--muted:rgba(255,255,255,0.6);
|
|
--accent:#4f7cff;
|
|
--ok:#22c55e;
|
|
--shadow:0 16px 60px rgba(0,0,0,.4);
|
|
--radius:20px;
|
|
}
|
|
|
|
*{box-sizing:border-box}
|
|
html,body{height:100%}
|
|
|
|
body{
|
|
margin:0;
|
|
padding:16px;
|
|
font-family:-apple-system,system-ui,Segoe UI,Roboto;
|
|
background:
|
|
radial-gradient(900px 600px at 20% 10%, rgba(79,124,255,.35), transparent 60%),
|
|
var(--bg);
|
|
color:var(--text);
|
|
}
|
|
|
|
/* ===== LAYOUT ===== */
|
|
.app{
|
|
max-width:1600px;
|
|
margin:0 auto;
|
|
height:100%;
|
|
display:grid;
|
|
grid-template-rows:auto auto 1fr;
|
|
gap:16px;
|
|
}
|
|
|
|
.panel{
|
|
background:linear-gradient(180deg,var(--card),rgba(255,255,255,.04));
|
|
border:1px solid var(--border);
|
|
border-radius:var(--radius);
|
|
box-shadow:var(--shadow);
|
|
overflow:hidden;
|
|
}
|
|
|
|
.header{
|
|
padding:14px 18px;
|
|
display:flex;
|
|
justify-content:space-between;
|
|
align-items:center;
|
|
border-bottom:1px solid var(--border);
|
|
}
|
|
|
|
.header h1{
|
|
margin:0;
|
|
font-size:18px;
|
|
}
|
|
|
|
/* ===== CONTROLS ===== */
|
|
.controls{
|
|
padding:16px;
|
|
display:flex;
|
|
gap:12px;
|
|
align-items:center;
|
|
flex-wrap:wrap;
|
|
}
|
|
|
|
input{
|
|
padding:10px 14px;
|
|
border-radius:14px;
|
|
border:1px solid var(--border);
|
|
background:rgba(255,255,255,.06);
|
|
color:var(--text);
|
|
}
|
|
|
|
button{
|
|
padding:10px 18px;
|
|
border-radius:14px;
|
|
border:0;
|
|
background:var(--accent);
|
|
color:#fff;
|
|
cursor:pointer;
|
|
}
|
|
|
|
button:hover{filter:brightness(1.1)}
|
|
|
|
/* ===== INFO BAR ===== */
|
|
.info{
|
|
padding:14px 18px;
|
|
display:grid;
|
|
grid-template-columns:repeat(auto-fit,minmax(160px,1fr));
|
|
gap:12px;
|
|
}
|
|
|
|
/* ===== TABLE ===== */
|
|
.table-wrap{
|
|
padding:16px;
|
|
overflow:auto;
|
|
}
|
|
|
|
table{
|
|
width:100%;
|
|
border-collapse:collapse;
|
|
}
|
|
|
|
thead th{
|
|
text-align:left;
|
|
padding:12px;
|
|
font-size:13px;
|
|
color:var(--muted);
|
|
border-bottom:1px solid var(--border);
|
|
cursor:pointer;
|
|
}
|
|
|
|
tbody td{
|
|
padding:12px;
|
|
border-bottom:1px solid var(--border);
|
|
}
|
|
|
|
tbody tr:hover{
|
|
background:rgba(255,255,255,.06);
|
|
}
|
|
|
|
.activateBtn{
|
|
padding:6px 14px;
|
|
border-radius:999px;
|
|
background:var(--ok);
|
|
border:0;
|
|
color:#000;
|
|
cursor:pointer;
|
|
}
|
|
|
|
.activateBtn:hover{filter:brightness(1.1)}
|
|
</style>
|
|
</head>
|
|
|
|
<body>
|
|
|
|
<main class="app">
|
|
|
|
<!-- HEADER -->
|
|
<section class="panel">
|
|
<div class="header">
|
|
<h1>Workorder Activation</h1>
|
|
</div>
|
|
</section>
|
|
|
|
<!-- CONTROLS -->
|
|
<section class="panel controls">
|
|
<input type="text" id="stationNumber" placeholder="Station Number">
|
|
<button id="fetchWoBtn">Workorders laden</button>
|
|
|
|
<input type="text" id="filterInput" placeholder="🔍 Workorders filtern …">
|
|
</section>
|
|
|
|
<!-- INFO -->
|
|
<section class="panel info">
|
|
<input id="workOrder" placeholder="Workorder" readonly>
|
|
<input id="partNumber" placeholder="Part Number" readonly>
|
|
<input id="partDesc" placeholder="Description" readonly>
|
|
<input id="layer" placeholder="Layer" readonly>
|
|
<input id="qty" placeholder="Quantity" readonly>
|
|
</section>
|
|
|
|
<!-- TABLE -->
|
|
<section class="panel table-wrap">
|
|
<table id="woTable">
|
|
<thead>
|
|
<tr>
|
|
<th>WORKORDER</th>
|
|
<th>PARTNUMBER</th>
|
|
<th>DESCRIPTION</th>
|
|
<th>LAYER</th>
|
|
<th>ACTIVATE</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody></tbody>
|
|
</table>
|
|
</section>
|
|
|
|
</main>
|
|
|
|
<script>
|
|
document.addEventListener("DOMContentLoaded", function () {
|
|
|
|
const url = sessionStorage.getItem("url");
|
|
const globallogin = JSON.parse(sessionStorage.getItem("globallogin"));
|
|
if (!globallogin) return alert("Bitte einloggen.");
|
|
|
|
const stationInput = document.getElementById("stationNumber");
|
|
stationInput.value = sessionStorage.getItem("stationNumber") || "";
|
|
|
|
const tbody = document.querySelector("#woTable tbody");
|
|
const filterInput = document.getElementById("filterInput");
|
|
let currentWorkorders = [];
|
|
|
|
document.getElementById("fetchWoBtn").onclick = getWorkOrder;
|
|
filterInput.onkeyup = applyFilter;
|
|
|
|
function applyFilter(){
|
|
const val = filterInput.value.toLowerCase();
|
|
Array.from(tbody.rows).forEach(row=>{
|
|
row.style.display = row.innerText.toLowerCase().includes(val) ? "" : "none";
|
|
});
|
|
}
|
|
|
|
function renderTable(data){
|
|
tbody.innerHTML="";
|
|
if(!data.length){
|
|
tbody.innerHTML="<tr><td colspan='5'>Keine Workorders gefunden</td></tr>";
|
|
return;
|
|
}
|
|
data.forEach(w=>{
|
|
const tr=document.createElement("tr");
|
|
tr.innerHTML=`
|
|
<td>${w[0]}</td>
|
|
<td>${w[1]}</td>
|
|
<td>${w[2]}</td>
|
|
<td>${w[3]}</td>
|
|
<td><button class="activateBtn">Activate</button></td>
|
|
`;
|
|
tr.querySelector("button").onclick=()=>activateWo(w[0],w[3]);
|
|
tr.ondblclick=()=>activateWo(w[0],w[3]);
|
|
tbody.appendChild(tr);
|
|
});
|
|
applyFilter();
|
|
}
|
|
|
|
function parseLayer(l){
|
|
return l==0?"TOP":l==1?"BOT":l==2?"INDEP.":l;
|
|
}
|
|
|
|
function getWorkOrder(){
|
|
if(!stationInput.value) return alert("Station fehlt");
|
|
|
|
fetch(url+"/mes/imsapi/rest/actions/trGetWorkOrderForStation",{
|
|
method:"POST",
|
|
headers:{"Content-Type":"application/json"},
|
|
body:JSON.stringify({
|
|
sessionContext:globallogin.result.sessionContext,
|
|
stationNumber:stationInput.value,
|
|
workorderFilter:[
|
|
{key:"MAX_ROWS",value:"100"},
|
|
{key:"WORKORDER_STATE",value:"F; N; S; P"}
|
|
],
|
|
workorderResultKeys:[
|
|
"WORKORDER_NUMBER",
|
|
"PART_NUMBER",
|
|
"PART_DESC",
|
|
"PROCESS_LAYER"
|
|
]
|
|
})
|
|
})
|
|
.then(r=>r.json())
|
|
.then(res=>{
|
|
if(!res.result?.workorderResultValues) return renderTable([]);
|
|
const arr=res.result.workorderResultValues;
|
|
currentWorkorders=[];
|
|
for(let i=0;i<arr.length;i+=4){
|
|
currentWorkorders.push([
|
|
arr[i],
|
|
arr[i+1],
|
|
arr[i+2],
|
|
parseLayer(arr[i+3])
|
|
]);
|
|
}
|
|
renderTable(currentWorkorders);
|
|
});
|
|
}
|
|
|
|
function activateWo(wo,layer){
|
|
fetch(url+"/mes/imsapi/rest/actions/trActivateWorkOrder",{
|
|
method:"POST",
|
|
headers:{"Content-Type":"application/json"},
|
|
body:JSON.stringify({
|
|
sessionContext:globallogin.result.sessionContext,
|
|
stationNumber:stationInput.value,
|
|
workOrderNumber:""+wo,
|
|
serialNumber:"-1",
|
|
serialNumberPos:"-1",
|
|
processLayer:parseLayer(layer),
|
|
flag:"1"
|
|
})
|
|
})
|
|
.then(r=>r.json())
|
|
.then(r=>{
|
|
if(r.result.return_value!==0) alert("Error "+r.result.return_value);
|
|
else getWorkOrder();
|
|
});
|
|
}
|
|
|
|
});
|
|
</script>
|
|
|
|
</body>
|
|
</html>
|