572 lines
16 KiB
JavaScript
572 lines
16 KiB
JavaScript
/**
|
||
* 删除验证时的提示信息
|
||
* @param formId 所属formId
|
||
*/
|
||
function removeValidCss(formId) {
|
||
if (document.getElementById("error_message")) {
|
||
document.getElementById("error_message").style.display = "none";
|
||
}
|
||
|
||
let form = document.getElementById(formId);
|
||
let elements = form.elements;
|
||
for (const element of elements) {
|
||
if (element.classList) {
|
||
element.classList.remove("is-invalid");
|
||
}
|
||
}
|
||
}
|
||
|
||
/**
|
||
* 关闭模态对话框
|
||
* @param id
|
||
*/
|
||
function closeDialog(id) {
|
||
document.getElementById(id).classList.add("hide");
|
||
document.getElementById(id).style.display = "none";
|
||
}
|
||
|
||
//打开对话框
|
||
function openDialog(id) {
|
||
|
||
document.getElementById(id).classList.add("show");
|
||
document.getElementById(id).style.display = "block";
|
||
}
|
||
|
||
//打开对话框并设置参数
|
||
function openDialogWithParam(id, from, toFormID) {
|
||
|
||
document.getElementById(id).classList.add("show");
|
||
document.getElementById(id).style.display = "block";
|
||
document.getElementById(toFormID)["from"].value = from;
|
||
}
|
||
|
||
//保存
|
||
function common_save() {
|
||
|
||
if (typeof preSaveCallback === "function") {
|
||
|
||
preSaveCallback();
|
||
}
|
||
|
||
let formElement = document.getElementById("entityForm");
|
||
const formData = new FormData(formElement);
|
||
|
||
if (typeof modifyForm === "function") {
|
||
if (modifyForm(formData)) {
|
||
return;
|
||
}
|
||
}
|
||
removeValidCss('entityForm');
|
||
|
||
const action = formElement.getAttribute("action");
|
||
const success = formElement.getAttribute("list");
|
||
fetch(action, {
|
||
method: "POST",
|
||
|
||
body: formData
|
||
}).then(response => {
|
||
if (!response.ok) {
|
||
throw new Error("网络响应异常");
|
||
}
|
||
return response.json();
|
||
}).then(data => {
|
||
|
||
if (data.code < 0) {
|
||
|
||
for (const item of data.errors) {
|
||
if (formElement.elements[item.elementId].classList) {
|
||
formElement.elements[item.elementId].classList.add("is-invalid");
|
||
document.getElementById(item.elementId + "_error_tip").innerHTML = item.message;
|
||
}
|
||
|
||
}
|
||
} else {
|
||
window.location = success;
|
||
}
|
||
}).catch(error => {
|
||
console.error("请求出错：", error);
|
||
|
||
});
|
||
}
|
||
|
||
|
||
//显示添加对话框
|
||
function common_add() {
|
||
openDialog("_addDialog");
|
||
}
|
||
|
||
//公用删除函数
|
||
function common_delete(id) {
|
||
openDialog("modal-danger")
|
||
document.getElementById("delete-confirm-9999").onclick = function () {
|
||
let formElement = document.getElementById("entityForm");
|
||
let deleteUrl = formElement.getAttribute("delete");
|
||
const success = formElement.getAttribute("list");
|
||
|
||
fetch(deleteUrl + "/" + id, {
|
||
method: "GET",
|
||
|
||
|
||
}).then(response => {
|
||
if (!response.ok) {
|
||
throw new Error("网络响应异常");
|
||
}
|
||
return response.json();
|
||
}).then(data => {
|
||
|
||
if (data.code === 0) {
|
||
|
||
window.location = success;
|
||
}
|
||
|
||
|
||
}).catch(error => {
|
||
console.error("请求出错：", error);
|
||
|
||
});
|
||
|
||
}
|
||
|
||
}
|
||
|
||
//公用编辑函数
|
||
function common_edit(id) {
|
||
let formElement = document.getElementById("entityForm");
|
||
let viewUrl = formElement.getAttribute("view");
|
||
fetch(viewUrl + "/" + id, {
|
||
method: "GET",
|
||
|
||
|
||
}).then(response => {
|
||
if (!response.ok) {
|
||
throw new Error("网络响应异常");
|
||
}
|
||
return response.json();
|
||
}).then(data => {
|
||
|
||
if (data.code === 0) {
|
||
|
||
fillForm("entityForm", data.result);
|
||
//回调
|
||
if (typeof afterEditShow === 'function') {
|
||
// 函数 someFunction 存在，可以调用
|
||
afterEditShow(data.result);
|
||
}
|
||
common_add();
|
||
}
|
||
|
||
|
||
}).catch(error => {
|
||
console.error("请求出错：", error);
|
||
|
||
});
|
||
}
|
||
|
||
//公用查看函数
|
||
function common_view(id) {
|
||
let formElement = document.getElementById("entityForm");
|
||
let viewUrl = formElement.getAttribute("view");
|
||
fetch(viewUrl + "/" + id, {
|
||
method: "GET",
|
||
|
||
|
||
}).then(response => {
|
||
if (!response.ok) {
|
||
throw new Error("网络响应异常");
|
||
}
|
||
return response.json();
|
||
}).then(data => {
|
||
|
||
if (data.code === 0) {
|
||
|
||
|
||
for (const key in data.result) {
|
||
if (data.result.hasOwnProperty(key)) {
|
||
if (document.getElementById("detail_" + key + "_value")) {
|
||
|
||
|
||
document.getElementById("detail_" + key + "_value").innerHTML = data.result[key];
|
||
}
|
||
}
|
||
|
||
}
|
||
if (typeof afterViewShow === 'function') {
|
||
// 函数 someFunction 存在，可以调用
|
||
afterViewShow(data.result);
|
||
}
|
||
openDialog("detailDialog");
|
||
}
|
||
|
||
|
||
}).catch(error => {
|
||
console.error("请求出错：", error);
|
||
|
||
});
|
||
}
|
||
|
||
/**
|
||
* 自动填充表单，根据 JSON 数据中的 key 和嵌套对象自动拼接 name 属性进行匹配
|
||
* @param {string} formId - 表单的 ID，例如 "myForm"
|
||
* @param {Object} data - JSON 对象，例如 { username: "johndoe", profile: { firstName: "John", lastName: "Doe" }}
|
||
*/
|
||
function fillForm(formId, data) {
|
||
let form = document.getElementById(formId);
|
||
if (!form) {
|
||
console.error("找不到表单: #" + formId);
|
||
return;
|
||
}
|
||
|
||
/**
|
||
* 递归处理 JSON 对象, 将嵌套对象的 key 拼接为点连接的形式
|
||
* @param {Object} obj - 当前处理的 JSON 对象
|
||
* @param {string} [prefix] - 父级 key 前缀
|
||
*/
|
||
function fill(obj, prefix) {
|
||
prefix = prefix || "";
|
||
Object.keys(obj).forEach(function (key) {
|
||
var fullKey = prefix ? prefix + "." + key : key;
|
||
var value = obj[key];
|
||
|
||
// 如果值为对象，但不为数组，则递归处理
|
||
if (value && typeof value === "object" && !Array.isArray(value)) {
|
||
fill(value, fullKey);
|
||
} else {
|
||
// 根据 name 属性寻找对应的表单元素
|
||
var field = form.querySelector('[name="' + fullKey + '"]');
|
||
if (field) {
|
||
// 针对复选框或者单选按钮的处理
|
||
if (field.type === "checkbox" || field.type === "radio") {
|
||
// 对于同一 name 的多个元素，都可能需要设置选中状态
|
||
var fields = form.querySelectorAll('[name="' + fullKey + '"]');
|
||
fields.forEach(function (item) {
|
||
|
||
if (value) {
|
||
if (item.value === value.toString()) {
|
||
item.checked = true;
|
||
}
|
||
}
|
||
|
||
});
|
||
} else {
|
||
field.value = value;
|
||
}
|
||
}
|
||
}
|
||
});
|
||
}
|
||
|
||
fill(data);
|
||
}
|
||
|
||
/**
|
||
* 将表单数据序列化为 JSON 对象
|
||
* @param {HTMLFormElement} formElement - 表单元素
|
||
* @returns {Object} 包含表单数据的 JSON 对象
|
||
*/
|
||
function serializeFormToJSON(formElement) {
|
||
const formData = new FormData(formElement);
|
||
const jsonData = {};
|
||
|
||
// 遍历 FormData 的所有条目
|
||
formData.forEach((value, key) => {
|
||
// 如果已经存在相同的键，则将其转换成数组存储
|
||
if (Object.prototype.hasOwnProperty.call(jsonData, key)) {
|
||
if (!Array.isArray(jsonData[key])) {
|
||
jsonData[key] = [jsonData[key]];
|
||
}
|
||
jsonData[key].push(value);
|
||
} else {
|
||
jsonData[key] = value;
|
||
}
|
||
});
|
||
|
||
return JSON.stringify(jsonData);
|
||
}
|
||
|
||
//表头上checkbox框状态改变函数
|
||
function checkBoxIdChanged(check) {
|
||
document.getElementsByName("itemId").forEach(function (checkbox) {
|
||
checkbox.checked = check.checked;
|
||
});
|
||
}
|
||
|
||
//批量删除函数
|
||
function common_batchRemove() {
|
||
let ids = [];
|
||
document.getElementsByName("itemId").forEach(function (item) {
|
||
|
||
if (item.checked) {
|
||
|
||
ids.push(item.value);
|
||
}
|
||
})
|
||
if (ids.length > 0) {
|
||
openDialog("modal-danger");
|
||
document.getElementById("delete-confirm-9999").onclick = function () {
|
||
let formElement = document.getElementById("entityForm");
|
||
let deleteUrl = formElement.getAttribute("batchDelete");
|
||
const success = formElement.getAttribute("list");
|
||
|
||
|
||
let formData = new FormData();
|
||
ids.forEach((value) => {
|
||
formData.append('list', value);
|
||
});
|
||
|
||
fetch(deleteUrl, {
|
||
method: "POST",
|
||
body: formData
|
||
|
||
}).then(response => {
|
||
if (!response.ok) {
|
||
throw new Error("网络响应异常");
|
||
}
|
||
return response.json();
|
||
}).then(data => {
|
||
|
||
if (data.code === 0) {
|
||
|
||
window.location = success;
|
||
}
|
||
|
||
|
||
}).catch(error => {
|
||
console.error("请求出错：", error);
|
||
|
||
});
|
||
|
||
|
||
}
|
||
}
|
||
|
||
}
|
||
|
||
//分页相关
|
||
function _next() {
|
||
let currentPageNum = document.getElementById("_currentPage").value;
|
||
_setPage(parseInt(currentPageNum) + 1);
|
||
}
|
||
|
||
function _pre() {
|
||
let currentPageNum = document.getElementById("_currentPage").value;
|
||
_setPage(parseInt(currentPageNum) - 1);
|
||
}
|
||
|
||
function _setPage(pageNum) {
|
||
document.getElementById("_currentPage").value = pageNum;
|
||
_search();
|
||
}
|
||
|
||
function _search() {
|
||
document.getElementById("searchForm").submit();
|
||
}
|
||
|
||
function _resetPageNoSearch() {
|
||
document.getElementById("_currentPage").value = 1;
|
||
_search();
|
||
}
|
||
|
||
document.addEventListener('DOMContentLoaded', function () {
|
||
if (document.getElementById('uploadIcon') && document.getElementById('fileInput')) {
|
||
document.getElementById('uploadIcon').addEventListener('click', function () {
|
||
|
||
document.getElementById('fileInput').click();
|
||
});
|
||
|
||
document.getElementById('fileInput').addEventListener('change', function (e) {
|
||
if (e.target.files.length > 0) {
|
||
// 例如：打印文件名称
|
||
console.log("已选择文件: " + e.target.files[0].name);
|
||
const file = e.target.files[0];
|
||
if (file && file.type.startsWith("image/")) {
|
||
const reader = new FileReader();
|
||
// 读取完成后返回 Data URL
|
||
reader.onload = (e) => {
|
||
// 清空原始图标内容
|
||
document.getElementById("uploadIcon").innerHTML = "";
|
||
// 创建 img 元素
|
||
const imgElement = document.createElement("img");
|
||
imgElement.src = e.target.result;
|
||
imgElement.alt = "上传的图片";
|
||
// 插入到上传图标容器中
|
||
document.getElementById("uploadIcon").appendChild(imgElement);
|
||
};
|
||
reader.readAsDataURL(file);
|
||
}
|
||
}
|
||
});
|
||
}
|
||
|
||
|
||
})
|
||
var mockSocket;
|
||
|
||
function connectWs() {
|
||
var protocol = window.location.protocol === 'https:' ? 'wss' : 'ws';
|
||
// 获取当前主机（包含域名和端口）
|
||
var host = window.location.host;
|
||
// 获取上下文路径，如果你的应用存在上下文路径（没有的话可以为空字符串）
|
||
var contextPath = /*[[${#httpServletRequest.contextPath}]]*/ '';
|
||
// 定义 WebSocket 访问的端点，这个端点根据你的服务端配置来设置
|
||
var endpoint = '/ws/push'; // 此处为示例，请根据实际情况修改
|
||
|
||
// 构造完整的 WebSocket 地址
|
||
var wsUrl = protocol + '://' + host + contextPath + endpoint;
|
||
|
||
console.log("WebSocket 地址：", wsUrl);
|
||
|
||
// 建立 WebSocket 连接
|
||
mockSocket = new WebSocket(wsUrl);
|
||
|
||
// WebSocket 事件处理示例
|
||
mockSocket.onopen = function () {
|
||
console.log('WebSocket 连接已打开');
|
||
};
|
||
|
||
mockSocket.onmessage = function (event) {
|
||
console.log('接收到消息：', event.data);
|
||
if (typeof doWsMessageCall === 'function') {
|
||
// 函数 someFunction 存在，可以调用
|
||
doWsMessageCall(event.data);
|
||
}
|
||
|
||
|
||
};
|
||
|
||
mockSocket.onerror = function (error) {
|
||
console.error('WebSocket 发生错误：', error);
|
||
};
|
||
|
||
mockSocket.onclose = function () {
|
||
console.log('WebSocket 连接已关闭');
|
||
};
|
||
}
|
||
|
||
|
||
function getFacilities(select, tbodyId, callBack) {
|
||
let url = document.getElementById("baseUrl").value + "fuelMetalJar/resourceByOrganize";
|
||
let formData = new FormData();
|
||
formData.append('id', select);
|
||
fetch(url, {
|
||
method: "POST",
|
||
body: formData
|
||
|
||
|
||
}).then(response => {
|
||
if (!response.ok) {
|
||
throw new Error("网络响应异常");
|
||
}
|
||
return response.json();
|
||
}).then(data => {
|
||
if (callBack instanceof Function) {
|
||
callBack(data);
|
||
}
|
||
|
||
|
||
}).catch(error => {
|
||
console.error("请求出错：", error);
|
||
|
||
});
|
||
}
|
||
|
||
|
||
function formToObject(form) {
|
||
const obj = {};
|
||
|
||
// 遍历表单内所有控件
|
||
for (let element of form.elements) {
|
||
// 忽略没有 name 属性的控件
|
||
if (!element.name) continue;
|
||
|
||
const name = element.name;
|
||
const type = element.type;
|
||
|
||
// 单选框处理：只添加选中的值
|
||
if (type === 'radio') {
|
||
if (element.checked) {
|
||
obj[name] = element.value;
|
||
}
|
||
}
|
||
// 复选框处理：可能有多个值
|
||
else if (type === 'checkbox') {
|
||
if (element.checked) {
|
||
// 如果已经存在该键且为数组，直接添加；否则新建一个数组
|
||
if (obj.hasOwnProperty(name)) {
|
||
// 确保先前已经是数组
|
||
if (!Array.isArray(obj[name])) {
|
||
obj[name] = [obj[name]];
|
||
}
|
||
obj[name].push(element.value);
|
||
} else {
|
||
obj[name] = element.value;
|
||
}
|
||
}
|
||
// 如果没有选中且你希望总是以数组形式返回，可以额外处理
|
||
}
|
||
// 其他控件，例如 input (text、email、hidden)、select、textarea 等
|
||
else {
|
||
obj[name] = element.value;
|
||
}
|
||
}
|
||
|
||
return obj;
|
||
}
|
||
|
||
|
||
function warStatusChange(value) {
|
||
let url = document.getElementById("baseUrl").value + "config/warTime";
|
||
|
||
fetch(url + "?status=" + value, {
|
||
method: "GET",
|
||
|
||
|
||
}).then(response => {
|
||
if (response.ok) {
|
||
return response.json();
|
||
}
|
||
}).then(data => {
|
||
if (data.code === 0) {
|
||
let config = data.result;
|
||
document.getElementById("inspectTime").value = config.inspectTime;
|
||
document.getElementById("qualityTime").value = config.qualityTime;
|
||
document.getElementById("measureTime").value = config.measureTime;
|
||
}
|
||
})
|
||
}
|
||
|
||
function showCustomAlert(title, message, callback) {
|
||
// 避免重复弹窗
|
||
if (document.querySelector('.custom-alert-mask')) return;
|
||
// 创建弹窗元素
|
||
const mask = document.createElement('div');
|
||
mask.className = 'custom-alert-mask';
|
||
mask.innerHTML = `
|
||
<div class="custom-alert-box">
|
||
<div class="custom-alert-icon">
|
||
<svg width="54" height="54" viewBox="0 0 54 54" fill="none">
|
||
<circle cx="27" cy="27" r="26" fill="#FFF5E6" stroke="#FFD69B" stroke-width="2"/>
|
||
<path d="M27 16v15" stroke="#d98c1b" stroke-width="3.5" stroke-linecap="round"/>
|
||
<circle cx="27" cy="38.2" r="2.2" fill="#d98c1b"/>
|
||
</svg>
|
||
</div>
|
||
<div class="custom-alert-title">${title || ''}</div>
|
||
<div class="custom-alert-message">${message || ''}</div>
|
||
<button class="custom-alert-btn">确定</button>
|
||
</div>
|
||
`;
|
||
document.body.appendChild(mask);
|
||
|
||
// 关闭逻辑
|
||
const close = () => {
|
||
mask.remove();
|
||
if (typeof callback === 'function') callback();
|
||
};
|
||
mask.querySelector('.custom-alert-btn').onclick = close;
|
||
// 支持ESC键关闭
|
||
document.addEventListener('keydown', function escHandler(e) {
|
||
if (e.key === "Escape") {
|
||
close();
|
||
document.removeEventListener('keydown', escHandler);
|
||
}
|
||
});
|
||
} |