101 lines
3.4 KiB
PHP
101 lines
3.4 KiB
PHP
<?php
|
||
include 'include/include_header.php';
|
||
|
||
// Templates inlezen uit de map
|
||
$templateDir = __DIR__ . "/templates";
|
||
$templates = [];
|
||
if (is_dir($templateDir)) {
|
||
foreach (glob($templateDir . "/*.json.tpl") as $file) {
|
||
$basename = basename($file, ".json.tpl"); // bv. "pump"
|
||
// Je kunt hier de naam formatteren zoals je wil
|
||
$templates[$basename] = ucfirst($basename) . " flow";
|
||
}
|
||
}
|
||
?>
|
||
|
||
<main class="container py-5">
|
||
<div class="row justify-content-center">
|
||
<div class="col-lg-6">
|
||
<div class="card p-4">
|
||
<h1 class="h4 mb-3 text-primary">Genereer een Node-RED flow</h1>
|
||
<form method="post" action="generate.php">
|
||
|
||
<!-- Template keuze -->
|
||
<div class="mb-3">
|
||
<label for="template" class="form-label">Kies template</label>
|
||
<select name="template" id="template" class="form-select" required>
|
||
<option value="">-- kies --</option>
|
||
<?php foreach ($templates as $value => $label): ?>
|
||
<option value="<?= htmlspecialchars($value) ?>">
|
||
<?= htmlspecialchars($label) ?>
|
||
</option>
|
||
<?php endforeach; ?>
|
||
</select>
|
||
</div>
|
||
|
||
<!-- Asset live search -->
|
||
<div class="mb-3 position-relative">
|
||
<label for="asset_search" class="form-label">Zoek asset</label>
|
||
<input type="text" id="asset_search" class="form-control" placeholder="Type om te zoeken...">
|
||
<input type="hidden" name="asset_id" id="asset_id">
|
||
<div id="results" class="list-group search-results d-none"></div>
|
||
</div>
|
||
|
||
<button class="btn btn-primary w-100">Genereer & Deploy</button>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</main>
|
||
|
||
<footer class="text-center">
|
||
<div class="container">
|
||
<p>© <?= date("Y") ?> FlowManager</p>
|
||
</div>
|
||
</footer>
|
||
|
||
<script>
|
||
const searchInput = document.getElementById("asset_search");
|
||
const resultsBox = document.getElementById("results");
|
||
const assetIdField = document.getElementById("asset_id");
|
||
|
||
searchInput.addEventListener("keyup", async () => {
|
||
const q = searchInput.value.trim();
|
||
if (q.length < 2) {
|
||
resultsBox.classList.add("d-none");
|
||
return;
|
||
}
|
||
|
||
try {
|
||
const res = await fetch("https://pimmoerman.nl/rdlab/tagcode.app/v2.1/api/asset/get_all_assets.php");
|
||
const json = await res.json();
|
||
|
||
if (json.success) {
|
||
const matches = json.data.filter(a =>
|
||
(a.asset_name && a.asset_name.toLowerCase().includes(q.toLowerCase())) ||
|
||
(a.asset_tag_number && a.asset_tag_number.toLowerCase().includes(q.toLowerCase()))
|
||
);
|
||
|
||
resultsBox.innerHTML = "";
|
||
matches.forEach(asset => {
|
||
const item = document.createElement("a");
|
||
item.className = "list-group-item list-group-item-action";
|
||
item.textContent = asset.asset_tag_number + " – " + asset.asset_name;
|
||
item.onclick = () => {
|
||
searchInput.value = asset.asset_tag_number + " – " + asset.asset_name;
|
||
assetIdField.value = asset.asset_id;
|
||
resultsBox.classList.add("d-none");
|
||
};
|
||
resultsBox.appendChild(item);
|
||
});
|
||
|
||
resultsBox.classList.toggle("d-none", matches.length === 0);
|
||
}
|
||
} catch (e) {
|
||
console.error("API error", e);
|
||
}
|
||
});
|
||
</script>
|
||
</body>
|
||
</html>
|