@{ ViewData["MainNum"] = "2"; ViewData["SubNum"] = "1"; ViewData["Title"] = "設備資料匯入"; } <ol class="breadcrumb page-breadcrumb"> <li class="breadcrumb-item"><a href="javascript:void(0);">首頁</a></li> <li class="breadcrumb-item">設備管理</li> <li class="breadcrumb-item active">設備資料匯入</li> <li class="position-absolute pos-top pos-right d-none d-sm-block"><span class="js-get-date"></span></li> </ol> <div class="row"> <div class="col-xl-12"> <div id="panel-5" class="panel"> <div class="panel-container show"> <div class="panel-content"> <ul class="nav nav-tabs" id="tabs" role="tablist"> <li class="nav-item"><a class="nav-link active" data-toggle="tab" href="#tab-import" role="tab"><span class="hidden-sm-down">資料匯入</span></a></li> <li class="nav-item"><a class="nav-link" data-toggle="tab" href="#tab-check" role="tab"><span class="hidden-sm-down">資料檢核</span></a></li> </ul> <div class="tab-content p-3"> <div class="tab-pane fade show active" id="tab-import" role="tabpanel" aria-labelledby="tab-import"> @Html.Partial("_RawDataImport") </div> <div class="tab-pane fade" id="tab-check" role="tabpanel" aria-labelledby="tab-check"> @Html.Partial("_RawDataCheck") </div> </div> </div> </div> </div> </div> </div> @section Scripts { <script> var rawDataImportTable, rawDataCheckTable; var deviceCheckFilterList; var selectedDeviceCheckFilter = {}; //#region 資料匯入分頁 //#region 資料匯入 document ready $(function () { //#region 資料匯入 DataTable rawDataImportTable = $("#rawDataImport_table").DataTable({ "columns": [ { "data": null, "render": function (data, type, row, meta) { return meta.row + 1; } }, { "data": "device_number" }, { "data": "device_result" }, { "data": "created_at" }, ], //"order": [[2, "desc"]], "ajax": { "url": "/DeviceImport/RawDataList", "type": "POST", "dataSrc": function (rel) { if (rel.code == "9999") { toast_error(rel.msg); return; } data = rel.data; if (data == null || data.length == 0) { this.data = []; } return data; } } }); //#endregion }); //#endregion //#region 資料匯入驗證 var ImportFileValidate = $("#import-file-form").validate({ rules: { import_file_input: { accept: ".csv, application/vnd.openxmlformats-officedocument.spreadsheetml.sheet, application/vnd.ms-excel" }, } }); //#endregion //#region 上傳設備檔案 function preImportRawDataFile() { var input_file = document.getElementById('import_file_input'); input_file.outerHTML = input_file.outerHTML; $('#import_file_input').click(); } function importRawDataFile() { import_files = $('#import_file_input')[0].files; if (import_files.length <= 0) { return; } if ($("#import-file-form").valid()) { Swal.fire( { title: "設備檔案匯入", text: "匯入檔案會將舊有資料完全移除,你確定是否要匯入?", type: "warning", icon: 'warning', showCancelButton: true, confirmButtonText: "是", cancelButtonText: "否" }).then(function (result) { if (result.value) { var url = "/DeviceImport/ImportRawDataFile"; var formData = new FormData(); if (import_files.length > 0) { Array.from(import_files).forEach(function (item, index) { formData.append("import_files", item) }); } $("#import-file-btn").html('<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>').attr("disabled", true); rawDataImportTable.clear().draw(); $.ajax({ type: "POST", url: url, data: formData, cache: false, contentType: false, processData: false, success: function (rel) { if (rel.code != "0000") { if (rel.code == "9999") { toast_error(rel.msg); } else { toast_warning(rel.msg); rawDataImportTable.ajax.reload(null, false); } $("#import-file-btn").html('<span class="fal fa-plus mr-1"></span>設備檔案匯入').attr("disabled", false); return; } else { toast_ok(rel.msg); $("#import-file-btn").html('<span class="fal fa-plus mr-1"></span>設備檔案匯入').attr("disabled", false); rawDataImportTable.ajax.reload(null, false); GetRawDataCheckFilter(); return; } }, }); } }); } } //#endregion //#endregion //#region 資料檢核分頁 //#region 資料檢核 document ready $(function () { //預設載入上方選單列表 GetRawDataCheckFilter(); //#region 資料檢核 DataTable rawDataCheckTable = $("#rawDataCheck_table").DataTable({ "columns": [ { "data": null, "render": function (data, type, row, meta) { return meta.row + 1; } }, { "data": "check_temp_device_number", "createdCell": function (td, cellData, rowData, row, col) { if (rowData && rowData.compare_device_number != 0) { $(td).css('color', 'red'); } }, }, { "data": "check_temp_device_system_category_layer3_key", "createdCell": function (td, cellData, rowData, row, col) { if (rowData && rowData.compare_system_category_layer3 != 0) { $(td).css('color', 'red'); } }, "render": function (data, type, row, meta) { if (row) { var value = row.check_temp_device_system_category_layer3 ? row.check_temp_device_system_category_layer3 : ""; var key = row.check_temp_device_system_category_layer3_key ? row.check_temp_device_system_category_layer3_key : ""; return value + " " + key } } }, { "data": "check_temp_disaster_key", "createdCell": function (td, cellData, rowData, row, col) { if (rowData && rowData.compare_device_disaster != 0) { $(td).css('color', 'red'); } }, "render": function (data, type, row, meta) { if (row) { var key = row.check_temp_disaster_key ? row.check_temp_disaster_key : ""; return key; } else { return ''; } } }, { "data": "device_number", "createdCell": function (td, cellData, rowData, row, col) { if (rowData && rowData.compare_device_number != 0) { $(td).css('color', 'red'); } }, }, { "data": "device_system_category_layer3_key", "createdCell": function (td, cellData, rowData, row, col) { if (rowData && rowData.compare_system_category_layer3 != 0) { $(td).css('color', 'red'); } }, "render": function (data, type, row, meta) { if (row) { var value = row.device_system_category_layer3 ? row.device_system_category_layer3 : ""; var key = row.device_system_category_layer3_key ? row.device_system_category_layer3_key : ""; return value + " " + key } } }, { "data": "device_disaster_type_text", "createdCell": function (td, cellData, rowData, row, col) { if (rowData && rowData.compare_device_disaster != 0) { $(td).css('color', 'red'); } }, }, { "data": "device_coordinate" }, ], //"order": [[2, "desc"]], "ajax": { "url": "/DeviceImport/DeviceCheckTableList", "type": "POST", "data": function (d) { d.Building_tag = selectedDeviceCheckFilter.building_tag ? selectedDeviceCheckFilter.building_tag : ""; d.System_tag = selectedDeviceCheckFilter.system_tag ? selectedDeviceCheckFilter.system_tag : ""; d.System_category = selectedDeviceCheckFilter.system_category ? selectedDeviceCheckFilter.system_category : ""; d.Abnormal = selectedDeviceCheckFilter.abnormal ? selectedDeviceCheckFilter.abnormal : "all"; }, "dataSrc": function (rel) { if (rel.code == "9999") { toast_error(rel.msg); return; } $("#abnormal-amount").html(rel.data.deviceCheckAmount) if (rel.data.deviceCheckAmount == 0) { $("#btn-replace").prop("disabled", false); } else { $("#btn-replace").prop("disabled", true); } data = rel.data.deviceCheckTableList; if (data == null || data.length == 0) { this.data = []; } return data; } } }); //#endregion 資料檢核 DataTable }); //#endregion 資料檢核 document ready //#region 取得上方搜尋過濾選單 function GetRawDataCheckFilter() { var url = "/DeviceImport/GetRawDataCheckFilter"; $.post(url, null, function (rel) { if (rel.code != "0000") { if (rel.code == "9999") { toast_error(rel.msg); } else { toast_warning(rel.msg); } return; } else { console.log(rel.data); deviceCheckFilterList = rel.data; $("#building-tag-list").empty(); var html = ''; deviceCheckFilterList.forEach(function (building_tag_item, building_tag_index) { html += ` <div class="btn-group mr-2 btn-building-tag-group"> <button type="button" class="btn btn-secondary waves-effect waves-themed mb-2 btn-building-tag" data-building-tag="${building_tag_item.building_tag}" onclick="ChangeDeviceCheckFilterPanel('${building_tag_item.building_tag}')">${building_tag_item.building_tag}</button> <button type="button" class="btn btn-secondary mb-2 btn-building-tag" data-building-tag="${building_tag_item.building_tag}" onclick="return false;">${building_tag_item.building_amount}</button> </div> `; }); $('#building-tag-list').append(html); $('#building-tag-list > .btn-building-tag-group').first().children().first().trigger('click'); return; } }, 'json'); } //#endregion 取得上方搜尋過濾選單 function ChangeDeviceCheckFilterPanel(building_tag, system_tag = "", system_category = "") { if (building_tag == undefined && building_tag == null || building_tag == "") { toast_warning("請先選擇區域"); return; } if ($(".btn-building-tag").hasClass("btn-success")) { $(".btn-building-tag").removeClass("btn-success").addClass("btn-secondary"); } $(".btn-building-tag").each(function (index, item) { var tag = $(item).attr("data-building-tag"); if (tag == building_tag) { $(item).removeClass("btn-secondary").addClass("btn-success"); } }); //選擇的棟別 selectedDeviceCheckFilter.building_tag = building_tag; //系統別 全選 $('#system-tag-all-warp').empty() if ("all" == system_tag) { $('#system-tag-all-warp').append(`<button type="button" class="btn btn-success waves-effect waves-theme mb-2" id="btn-system-tag-all" onclick="ChangeDeviceCheckFilterPanel('${building_tag}', 'all')">全選</button>`); selectedDeviceCheckFilter.system_tag = system_tag; } else { $('#system-tag-all-warp').append(`<button type="button" class="btn btn-secondary waves-effect waves-theme mb-2" id="btn-system-tag-all" onclick="ChangeDeviceCheckFilterPanel('${building_tag}', 'all')">全選</button>`); } //系統別 個別選單 $('#system-tag-list').empty(); deviceCheckFilterList.forEach(function (building_item, building_item_index) { if (building_item.building_tag == building_tag) { var system_html = ''; building_item.system_tags.forEach(function (system_item, system_item_index) { if (system_item.system_tag == system_tag && "all" != system_tag) { system_html += `<button type="button" class="btn btn-success waves-effect waves-themed mr-2 mb-2" onclick="ChangeDeviceCheckFilterPanel('${building_item.building_tag}', '${system_item.system_tag}')">${system_item.system_tag}</button>` //選擇的系統別 selectedDeviceCheckFilter.system_tag = system_tag; } else { system_html += `<button type="button" class="btn btn-secondary waves-effect waves-themed mr-2 mb-2" onclick="ChangeDeviceCheckFilterPanel('${building_item.building_tag}', '${system_item.system_tag}')">${system_item.system_tag}</button>` } }); $('#system-tag-list').append(system_html); if (system_tag == '') { $('#system-tag-list').children().first().trigger('click'); return; } else { //設備分類 全選 $('#system-category-all-warp').empty() if ("all" == system_category) { $('#system-category-all-warp').append(`<button type="button" class="btn btn-success waves-effect waves-theme mb-2" id="btn-system-category-all" onclick="ChangeDeviceCheckFilterPanel('${building_tag}', '${system_tag}', 'all')">全選</button>`); selectedDeviceCheckFilter.system_category = system_category; } else { $('#system-category-all-warp').append(`<button type="button" class="btn btn-secondary waves-effect waves-theme mb-2" id="btn-system-category-all" onclick="ChangeDeviceCheckFilterPanel('${building_tag}', '${system_tag}', 'all')">全選</button>`); } $('#system-category-list').empty(); building_item.system_tags.forEach(function (system_item, system_item_index) { if (system_item.system_tag == system_tag) { var system_category_html = ''; system_item.system_categories.forEach(function (system_category_item, system_category_item_index) { if (system_category_item == system_category && "all" != system_category) { system_category_html += `<button type="button" class="btn btn-success waves-effect waves-themed mr-2 mb-2" onclick="ChangeDeviceCheckFilterPanel('${building_item.building_tag}', '${system_item.system_tag}', '${system_category_item}')">${system_category_item}</button>` //選擇的設備種類 selectedDeviceCheckFilter.system_category = system_category; } else { system_category_html += `<button type="button" class="btn btn-secondary waves-effect waves-themed mr-2 mb-2" onclick="ChangeDeviceCheckFilterPanel('${building_item.building_tag}', '${system_item.system_tag}', '${system_category_item}')">${system_category_item}</button>` } }); $('#system-category-list').append(system_category_html); } else if ("all" == system_tag) { //系統別 為全選的時候 var system_category_html = ''; system_item.system_categories.forEach(function (system_category_item, system_category_item_index) { if (system_category_item == system_category && "all" != system_category) { system_category_html += `<button type="button" class="btn btn-success waves-effect waves-themed mr-2 mb-2" onclick="ChangeDeviceCheckFilterPanel('${building_item.building_tag}', '${system_tag}', '${system_category_item}')">${system_category_item}</button>` //選擇的設備種類 selectedDeviceCheckFilter.system_category = system_category; } else { system_category_html += `<button type="button" class="btn btn-secondary waves-effect waves-themed mr-2 mb-2" onclick="ChangeDeviceCheckFilterPanel('${building_item.building_tag}', '${system_tag}', '${system_category_item}')">${system_category_item}</button>` } }); $('#system-category-list').append(system_category_html); } }); if (system_category == '') { $('#system-category-list').children().first().trigger('click'); return; } else { //預設異常分類全選 if (selectedDeviceCheckFilter.abnormal == undefined || selectedDeviceCheckFilter.abnormal == "") { ChangeRawDeviceCheckTable(3, "all") } } } } }); } function ChangeRawDeviceCheckTable(target_filter, abnormal = "all") { switch (target_filter) { case 1: //系統別 selectedDeviceCheckFilter.system_tag = "all"; break; case 2: //設備分類 selectedDeviceCheckFilter.system_category = "all"; break; case 3: //異常分類 selectedDeviceCheckFilter.abnormal = abnormal; if ("abnormal" == abnormal) { ChangeDeviceCheckFilterPanel(selectedDeviceCheckFilter.building_tag, "all", "all") } if ($(".btn-abnormal-tag").hasClass("btn-success")) { $(".btn-abnormal-tag").removeClass("btn-success").addClass("btn-secondary"); } $(".btn-abnormal-tag").each(function (index, item) { var tag = $(item).attr("data-abnormal-tag"); if (tag == abnormal) { $(item).removeClass("btn-secondary").addClass("btn-success"); } }); break; } if ($('#btn-check').attr('data-auto-first') == "true") { //第一次自動點擊檢核 $('#btn-check').attr('data-auto-first', "false"); rawDataCheckTable.ajax.reload(null, false); } } //#region 重整資料檢核表 function ReloadRawDataCheckTable() { rawDataCheckTable.ajax.reload(null, false); } //#endregion重整資料檢核表 //#region 資料取代 function DataCheckReplace() { Swal.fire( { title: "資料取代", text: "資料將會取代當前設備資訊,確定是否要取代?", type: "warning", icon: 'warning', showCancelButton: true, confirmButtonText: "是", cancelButtonText: "否" }).then(function (result) { if (result.value) { var url = "/DeviceImport/DeviceCheckReplace"; $.post(url, selectedDeviceCheckFilter, function (rel) { if (rel.code != "0000") { if (rel.code == "9999") { toast_error(rel.msg); } else { toast_warning(rel.msg); } return; } else { toast_ok(rel.msg); ReloadRawDataCheckTable(); } }, 'json'); } }); } //#endregion 資料取代 //#endregion 資料檢核分頁 </script> }