79 lines
3.8 KiB
JavaScript
79 lines
3.8 KiB
JavaScript
(function () {
|
|
"use strict";
|
|
|
|
const qs = (selector, root = document) => root.querySelector(selector);
|
|
const qsa = (selector, root = document) => [...root.querySelectorAll(selector)];
|
|
const toastRegion = qs("[data-toast-region]");
|
|
const toast = (message) => {
|
|
if (!toastRegion) return;
|
|
const item = document.createElement("div");
|
|
item.className = "toast";
|
|
item.setAttribute("role", "status");
|
|
item.textContent = message;
|
|
toastRegion.appendChild(item);
|
|
window.setTimeout(() => item.remove(), 3600);
|
|
};
|
|
const number = (selector) => Number(qs(selector)?.textContent || 0);
|
|
|
|
qsa("[data-select-alert]").forEach((row) => row.addEventListener("click", () => {
|
|
qs("[data-detail-title]").textContent = row.dataset.selectAlert;
|
|
qs("[data-detail-what]").textContent = row.dataset.selectAlert;
|
|
qs("[data-detail-location]").textContent = row.dataset.location;
|
|
qs("[data-detail-meta]").textContent = `${row.dataset.location} · ${row.dataset.time}`;
|
|
qs("[data-detail-suggestion]").textContent = row.dataset.suggestion;
|
|
const state = qs("[data-alert-state]");
|
|
state.textContent = row.dataset.risk;
|
|
state.className = `status ${row.dataset.risk === "高风险" ? "status-danger" : "status-warning"} el-tag`;
|
|
}));
|
|
|
|
let started = false;
|
|
const startButton = qs("[data-action='start-alert']");
|
|
startButton?.addEventListener("click", () => {
|
|
if (started) return;
|
|
started = true;
|
|
startButton.disabled = true;
|
|
startButton.textContent = "已由你开始处理";
|
|
const state = qs("[data-alert-state]");
|
|
state.textContent = "处理中";
|
|
state.className = "status status-warning el-tag";
|
|
qs("[data-pending-count]").textContent = String(Math.max(0, number("[data-pending-count]") - 1));
|
|
qs("[data-working-count]").textContent = String(number("[data-working-count]") + 1);
|
|
qs("[data-owned-alert]").hidden = false;
|
|
qs("[data-working-total]").textContent = "3 条";
|
|
toast("已开始处理；其他人会看到这条预警由王老师负责");
|
|
});
|
|
|
|
qs("[data-simulate-conflict]")?.addEventListener("click", () => {
|
|
toast("这条预警已由李老师开始处理，你可以查看进展但不能重复领取");
|
|
});
|
|
|
|
qsa("input[name='result']").forEach((input) => input.addEventListener("change", () => {
|
|
qs("[data-result-error]").hidden = true;
|
|
}));
|
|
|
|
qs("[data-action='finish-alert']")?.addEventListener("click", () => {
|
|
const selected = qs("input[name='result']:checked");
|
|
const error = qs("[data-result-error]");
|
|
if (!selected) {
|
|
error.hidden = false;
|
|
qs("input[name='result']")?.focus();
|
|
return;
|
|
}
|
|
const note = qs("#result-note").value.trim();
|
|
const tbody = qs("[data-history-body]");
|
|
const row = document.createElement("tr");
|
|
const statusClass = selected.value === "确认有危险" ? "status-danger" : selected.value === "现场正常" ? "status-success" : "status-neutral";
|
|
row.innerHTML = `<td><span class="table-title">危险区域有人进入</span><span class="table-subtitle"></span></td><td>北围墙 01</td><td><span class="status ${statusClass} el-tag"></span></td><td>王老师</td><td>刚刚</td><td><button class="btn btn-quiet el-button-link">查看记录</button></td>`;
|
|
qs(".table-subtitle", row).textContent = note || "未填写补充说明";
|
|
qs(".status", row).textContent = selected.value;
|
|
qs("button", row).addEventListener("click", () => toast("已打开完整处理记录"));
|
|
tbody.prepend(row);
|
|
qs("[data-owned-alert]").hidden = true;
|
|
qs("[data-working-total]").textContent = "2 条";
|
|
qs("[data-working-count]").textContent = String(Math.max(0, number("[data-working-count]") - 1));
|
|
qs("[data-completed-count]").textContent = String(number("[data-completed-count]") + 1);
|
|
qs("[data-close-modal]", qs("#finish-alert"))?.click();
|
|
toast(`处理已完成，现场结果：${selected.value}`);
|
|
});
|
|
})();
|