@{ ViewData["MainNum"] = "1"; ViewData["SubNum"] = "3"; ViewData["Title"] = "區域選單管理"; } <ol class="breadcrumb page-breadcrumb"> <li class="breadcrumb-item"><a href="javascript:void(0);">首頁</a></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-12"> <div id="panel-5" class="panel"> <div class="panel-container show"> <div class="panel-content"> <div class="subheader"> <h1 class="subheader-title"> <span>區域選單設定</span> </h1> </div> <div class="row mb-3 d-flex align-items-center px-3 justify-content-between"> <div class="pr-3 "> <div class="btn-group btn-group-md" id="buildlist"> </div> </div> </div> <div class="row mb-3 d-flex align-items-center px-3"> <div class="pr-3 "> <button type="button" class="btn btn-secondary waves-effect waves-themed mb-2" onclick="AllMainSys()">全選</button> </div> <div class="pr-3 row col"> <div class="frame-wrap" id="mainlist"> </div> </div> <div class="card border mb-g w-100 mb-5" id="menucard"> <div class="card-header bg-fusion-25 py-2 pr-3 d-flex align-items-center flex-wrap justify-content-between"> <div class="card-title font-weight-bold">選單</div> <div class="text-right "> <a href="javascript:;" class="btn btn-sm btn-success ml-auto waves-effect waves-themed" id="addUser-btn" onclick="Addmenu()"><span class="fal fa-plus mr-1"></span>新增</a> </div> </div> <div class="card-body"> <div class="w-100"> <div class="col-12"> <table id="buildMenu_table" class="table table-bordered table-hover m-0 text-center"> <thead class="thead-themed"> <tr> <th>序</th> <th>系統大類</th> <th>系統小類</th> <th>左邊預設頁面</th> <th>左邊是否顯示<br>平面圖</th> <th>左邊昇位圖<br>詳細資料設定</th> <th>左邊昇位圖<br>詳細資料URL</th> <th>右邊預設頁面</th> <th>右邊是否顯示<br>平面圖</th> <th>右邊昇位圖<br>詳細資料設定</th> <th>右邊昇位圖<br>詳細資料URL</th> @*<th>昇位圖URL</th>*@ <th>功能</th> </tr> </thead> <tbody> </tbody> </table> </div> </div> </div> </div> <div class="card border mb-g w-100 mb-5" id="floorcard"> <div class="card-header bg-fusion-25 py-2 pr-3 d-flex align-items-center flex-wrap justify-content-between"> <div class="card-title font-weight-bold">樓層設定</div> <div class="text-right "> <a href="javascript:;" class="btn btn-sm btn-success ml-auto waves-effect waves-themed" id="addUser-btn" onclick="AddFloor()"><span class="fal fa-plus mr-1"></span>新增</a> </div> </div> <div class="card-body"> <div class="w-100"> <div class="col-12"> <table id="buildMenu_floor_table" class="table table-bordered table-hover m-0 text-center"> <thead class="thead-themed"> <tr> <th>序</th> <th>系統大類</th> <th>系統小類</th> <th>樓層</th> <th>功能</th> </tr> </thead> <tbody> </tbody> </table> </div> </div> </div> </div> </div> </div> </div> </div> </div> </div> <div class="modal fade" id="build-menu-modal" tabindex="-1" role="dialog" aria-hidden="true" data-backdrop="static" data-keyboard="false"> <div class="modal-dialog modal-dialog-centered modal-xl" role="document"> <div class="modal-content"> <div class="modal-header"> <h4 class="modal-title"> 選單基本資料 - 新增 </h4> <button type="button" class="close" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true"><i class="fal fa-times"></i></span> </button> </div> <div class="modal-body"> <form id="build-menu-form"> <div class="row"> <div class="form-group col-6"> <label class="form-label" for="build_menu_building_modal"><span class="text-danger">*</span>棟別</label> <select class="form-control" id="build_menu_building_modal"> </select> </div> <div class="form-group col-6"> <label class="form-label" for="build_menu_main_modal"><span class="text-danger">*</span>大類</label> <select class="form-control" id="build_menu_main_modal"> </select> </div> <div class="form-group col-12"> <label class="form-label" for="build_menu_sub_modal"><span class="text-danger">*</span>小類</label> <select class="form-control" id="build_menu_sub_modal"> </select> </div> <div class="col-12" id="build_menu_position_l_div"> <label class="mb-0 t-gray">左邊區塊</label> <hr class="mt-1" /> <div class="form-group col-12"> <label class="form-label"><span class="text-danger">*</span>預設頁面</label> <div class="row" id="build_menu_drawing_modal"> <div class="col"> <input type="radio" name="drawing" id="drawing_4" value="4" checked> <label for="drawing_4"> 昇位圖 </label> </div> <div class="col"> <input type="radio" name="drawing" id="drawing_2" value="2"> <label for="drawing_2"> 系統圖 </label> </div> <div class="col" id="drawing_1_div" style="display: none;"> <input type="radio" name="drawing" id="drawing_1" value="1"> <label for="drawing_1"> 2D </label> </div> <div class="col" id="drawing_3_div" style="display: none;"> <input type="radio" name="drawing" id="drawing_3" value="3"> <label for="drawing_3"> 3D </label> </div> <div class="col"> <input type="radio" name="drawing" id="drawing_5" value="5"> <label for="drawing_5"> 彈出URL </label> </div> </div> </div> <div class="form-group col-12" id="build_menu_planimetric_modal_div" name="drawing_extend" > <div class="col-12 mb-2 custom-control custom-checkbox align-content-center" > <input type="checkbox" class="custom-control-input" name="planimetric_click" id="planimetric_click" value="1" /> <label class="custom-control-label" for="planimetric_click">是否顯示平面圖</label> </div> </div> <div class="form-group col-12" id="build_menu_systemurl_modal_div" name="drawing_extend"> <label class="form-label" for="build_menu_systemurl_modal"><span class="text-danger">*</span>系統圖URL</label> <input type="text" id="build_menu_systemurl_modal" class="form-control" name="build_menu_systemurl_modal"> </div> <div class="form-group col-12" id="build_menu_blankurl_modal_div" name="drawing_extend"> <label class="form-label" for="build_menu_blankurl_modal"><span class="text-danger">*</span>彈出URL</label> <input type="text" id="build_menu_blankurl_modal" class="form-control" name="build_menu_blankurl_modal"> </div> <div class="form-group col-12" id="build_menu_icon_click_onoff_modal_div" name="drawing_extend"> <label class="form-label">昇位圖 - 詳細資料設定</label> @*<div class="row"> <div class="col"> <input type="radio" name="icon_click_onoff" id="icon_click_on" value="1"> <label for="icon_click_on"> 點擊開關 </label> </div> <div class="col"> <input type="radio" name="icon_click_onoff" id="icon_click_off" value="0" checked> <label for="icon_click_off"> 彈出視窗 </label> </div> </div>*@ <div class="row"> <div class="col" style="display:none"> <div class="custom-control custom-checkbox"> <input type="checkbox" class="custom-control-input" name="icon_click[]" id="icon_click_switch" value="2"> <label class="custom-control-label" for="icon_click_switch">點擊開關</label> </div> </div> <div class="col"> <div class="custom-control custom-checkbox"> <input type="checkbox" class="custom-control-input" name="icon_click[]" id="icon_click_url" value="1"> <label class="custom-control-label" for="icon_click_url">顯示詳細資料</label> </div> </div> </div> </div> <div class="form-group col-12" id="build_menu_icon_click_url_modal_div" name="drawing_extend"> <label class="form-label" for="build_menu_icon_click_url_modal">詳細資料 URL</label><br> <button type="button" class="btn btn-secondary waves-effect waves-themed mb-2" onclick="AddTagIntoClickUrl('device_building_tag', 'l')">+/[device_building_tag]</button> <button type="button" class="btn btn-secondary waves-effect waves-themed mb-2" onclick="AddTagIntoClickUrl('device_system_tag', 'l')">+/[device_system_tag]</button> <button type="button" class="btn btn-secondary waves-effect waves-themed mb-2" onclick="AddTagIntoClickUrl('device_floor_tag', 'l')">+/[device_floor_tag]</button> <button type="button" class="btn btn-secondary waves-effect waves-themed mb-2" onclick="AddTagIntoClickUrl('device_name_tag', 'l')">+/[device_name_tag]</button> <button type="button" class="btn btn-secondary waves-effect waves-themed mb-2" onclick="AddTagIntoClickUrl('device_serial_tag', 'l')">+/[device_serial_tag]</button> <button type="button" class="btn btn-secondary waves-effect waves-themed mb-2" onclick="AddTagIntoClickUrl('tag_name', 'l')">+/[tag_name]</button> <input type="text" id="build_menu_icon_click_url_modal" class="form-control"> </div> <div class="form-group col-12" id="build_menu_icon_click_url_width_height_modal_div"> <label class="form-label">詳細資料 顯示視窗設定</label><br> <div class="row"> <div class="col-6 form-group"> <label class="form-label" for="build_menu_icon_click_url_width_modal">寬(單位:px)</label> <input type="number" step="1" id="build_menu_icon_click_url_width_modal" class="form-control"> </div> <div class="col-6 form-group"> <label class="form-label" for="build_menu_icon_click_url_height_modal">高(單位:px)</label> <input type="number" step="1" id="build_menu_icon_click_url_height_modal" class="form-control"> </div> </div> </div> <div class="form-group col-12" id="build_menu_riser_diagram_url_modal_div" style="display: none"> <label class="form-label" for="build_menu_riser_diagram_url_modal">昇位圖 URL</label><br> <input type="text" id="build_menu_riser_diagram_url_modal" class="form-control"> </div> <div class="form-group col-6" id="build_menu_planimetric_floor_modal_div"> <label class="form-label" for="build_menu_planimetric_floor_modal"><span class="text-danger">*</span>平面圖預設樓層</label> <select class="form-control" id="build_menu_planimetric_floor_modal"> </select> </div> </div> <div class="col-12 mt-3" id="build_menu_position_r_div"> <label class="mb-0 t-gray">右邊區塊</label> <hr class="mt-1" /> <div class="form-group col-12"> <label class="form-label"><span class="text-danger">*</span>預設頁面</label> <div class="row" id="build_menu_drawing_modal_r"> <div class="col"> <input type="radio" name="drawing_r" id="drawing_0_r" value="0" checked> <label for="drawing_0_r"> 不顯示 </label> </div> <div class="col"> <input type="radio" name="drawing_r" id="drawing_4_r" value="4"> <label for="drawing_4_r"> 昇位圖 </label> </div> <div class="col"> <input type="radio" name="drawing_r" id="drawing_2_r" value="2"> <label for="drawing_2_r"> 系統圖 </label> </div> <div class="col" id="drawing_1_div_r" style="display: none;"> <input type="radio" name="drawing_r" id="drawing_1_r" value="1"> <label for="drawing_1_r"> 2D </label> </div> <div class="col" id="drawing_3_div_r" style="display: none;"> <input type="radio" name="drawing_r" id="drawing_3_r" value="3"> <label for="drawing_3_r"> 3D </label> </div> <div class="col"> <input type="radio" name="drawing_r" id="drawing_5_r" value="5"> <label for="drawing_5_r"> 彈出URL </label> </div> </div> </div> <div class="form-group col-12" id="build_menu_planimetric_modal_div_r" name="drawing_extend_r"> <div class="col-12 mb-2 custom-control custom-checkbox align-content-center"> <input type="checkbox" class="custom-control-input" name="planimetric_click_r" id="planimetric_click_r" value="1" /> <label class="custom-control-label" for="planimetric_click_r">是否顯示平面圖</label> </div> </div> <div class="form-group col-12" id="build_menu_systemurl_modal_div_r" name="drawing_extend"> <label class="form-label" for="build_menu_systemurl_modal_r"><span class="text-danger">*</span>系統圖URL</label> <input type="text" id="build_menu_systemurl_modal_r" class="form-control" name="build_menu_systemurl_modal_r"> </div> <div class="form-group col-12" id="build_menu_blankurl_modal_div_r" name="drawing_extend_r"> <label class="form-label" for="build_menu_blankurl_modal_r"><span class="text-danger">*</span>彈出URL</label> <input type="text" id="build_menu_blankurl_modal_r" class="form-control" name="build_menu_blankurl_modal_r"> </div> <div class="form-group col-12" id="build_menu_icon_click_onoff_modal_div_r" name="drawing_extend_r"> <label class="form-label">昇位圖 - 詳細資料設定</label> @*<div class="row"> <div class="col"> <input type="radio" name="icon_click_onoff" id="icon_click_on" value="1"> <label for="icon_click_on"> 點擊開關 </label> </div> <div class="col"> <input type="radio" name="icon_click_onoff" id="icon_click_off" value="0" checked> <label for="icon_click_off"> 彈出視窗 </label> </div> </div>*@ <div class="row"> <div class="col" style="display:none"> <div class="custom-control custom-checkbox"> <input type="checkbox" class="custom-control-input" name="icon_click[]_r" id="icon_click_switch_r" value="2"> <label class="custom-control-label" for="icon_click_switch_r">點擊開關</label> </div> </div> <div class="col"> <div class="custom-control custom-checkbox"> <input type="checkbox" class="custom-control-input" name="icon_click[]_r" id="icon_click_url_r" value="1"> <label class="custom-control-label" for="icon_click_url_r">顯示詳細資料</label> </div> </div> </div> </div> <div class="form-group col-12" id="build_menu_icon_click_url_modal_div_r" name="drawing_extend_r"> <label class="form-label" for="build_menu_icon_click_url_modal_r">詳細資料 URL</label><br> <button type="button" class="btn btn-secondary waves-effect waves-themed mb-2" onclick="AddTagIntoClickUrl('device_building_tag')">+/[device_building_tag]</button> <button type="button" class="btn btn-secondary waves-effect waves-themed mb-2" onclick="AddTagIntoClickUrl('device_system_tag')">+/[device_system_tag]</button> <button type="button" class="btn btn-secondary waves-effect waves-themed mb-2" onclick="AddTagIntoClickUrl('device_floor_tag')">+/[device_floor_tag]</button> <button type="button" class="btn btn-secondary waves-effect waves-themed mb-2" onclick="AddTagIntoClickUrl('device_name_tag')">+/[device_name_tag]</button> <button type="button" class="btn btn-secondary waves-effect waves-themed mb-2" onclick="AddTagIntoClickUrl('device_serial_tag')">+/[device_serial_tag]</button> <button type="button" class="btn btn-secondary waves-effect waves-themed mb-2" onclick="AddTagIntoClickUrl('tag_name')">+/[tag_name]</button> <input type="text" id="build_menu_icon_click_url_modal_r" class="form-control"> </div> <div class="form-group col-12" id="build_menu_icon_click_url_width_height_modal_div_r"> <label class="form-label">詳細資料 顯示視窗設定</label><br> <div class="row"> <div class="col-6 form-group"> <label class="form-label" for="build_menu_icon_click_url_width_modal_r">寬(單位:px)</label> <input type="number" step="1" id="build_menu_icon_click_url_width_modal_r" class="form-control"> </div> <div class="col-6 form-group"> <label class="form-label" for="build_menu_icon_click_url_height_modal_r">高(單位:px)</label> <input type="number" step="1" id="build_menu_icon_click_url_height_modal_r" class="form-control"> </div> </div> </div> <div class="form-group col-12" id="build_menu_riser_diagram_url_modal_div_r" style="display: none"> <label class="form-label" for="build_menu_riser_diagram_url_modal_r">昇位圖 URL</label><br> <input type="text" id="build_menu_riser_diagram_url_modal_r" class="form-control"> </div> <div class="form-group col-6" id="build_menu_planimetric_floor_modal_div_r"> <label class="form-label" for="build_menu_planimetric_floor_modal_r"><span class="text-danger">*</span>平面圖預設樓層</label> <select class="form-control" id="build_menu_planimetric_floor_modal_r"> </select> </div> </div> </div> </form> </div> <div class="modal-footer"> <button type="button" class="btn btn-secondary" data-dismiss="modal">取消</button> <button type="button" class="btn btn-primary" onclick="SavebuildMenuModal()">儲存</button> </div> </div> </div> </div> <div class="modal fade" id="menu-floor-modal" tabindex="-1" role="dialog" aria-hidden="true" data-backdrop="static" data-keyboard="false"> <div class="modal-dialog modal-dialog-centered " role="document"> <div class="modal-content"> <div class="modal-header"> <h4 class="modal-title"> 樓層 - 新增 </h4> <button type="button" class="close" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true"><i class="fal fa-times"></i></span> </button> </div> <div class="modal-body"> <form id="menu-floor-form"> <div class="row"> <div class="form-group col-6"> <label class="form-label" for="menu_floor_main_modal"><span class="text-danger">*</span>大類</label> <br> <span id="menu_floor_main_modal" class="fw-900"></span> @*<select class="form-control" id="menu_floor_main_modal" disabled> </select>*@ </div> <div class="form-group col-6"> <label class="form-label" for="menu_floor_sub_modal"><span class="text-danger">*</span>小類</label> <br> <span id="menu_floor_sub_modal" class="fw-900"></span> @*<select class="form-control" id="menu_floor_sub_modal" disabled> </select>*@ </div> <div class="form-group col-12"> <label class="form-label"><span class="text-danger">*</span>可新增樓層</label> <div class="row ml-2 mr-1" id="floor_check"> </div> </div> </div> </form> </div> <div class="modal-footer"> <button type="button" class="btn btn-secondary" data-dismiss="modal">取消</button> <button type="button" class="btn btn-primary" onclick="SaveFloorMenuModal()">儲存</button> </div> </div> </div> </div> @section Scripts { <script> var AllMainList = new Array(0); var SelectMainList = new Array(0); var buildMenuTable; var SelectBuild = ""; var SelectMainSys = ""; var SelectSubSys = ""; var buildMenuFloorTable; var selectAllMain = false; $(function () { $('#floorcard').hide(); GetBuild(); GetMainList(); buildMenuTable = $("#buildMenu_table").DataTable({ "columns": [ { "data": "building_tag", "render": function (data, type, row, meta) { return meta.row + 1; } }, { "data": "main_system_guid_name" }, { "data": "sub_system_guid_name" }, { "data": "left_drawing_name" }, { "data": "left_planimetric_click_name" }, { "data": null, "render": function (data, type, row, meta) { var str = []; if (2 & parseInt(data) > 0) { str.push("點擊開關") } if (1 & parseInt(data) > 0) { str.push("顯示詳細資料") } return str.join(";"); } }, { "data": "left_icon_click_url" }, { "data": "right_drawing_name" }, { "data": "right_planimetric_click_name" }, { "data": null, "render": function (data, type, row, meta) { var str = []; if (2 & parseInt(data) > 0) { str.push("點擊開關") } if (1 & parseInt(data) > 0) { str.push("顯示詳細資料") } return str.join(";"); } }, { "data": "right_icon_click_url" }, { "data": null, "defaultContent": '<button class="btn btn-primary edit-btn">修改</button> <button class="btn btn-danger del-btn">刪除</button>' } ], 'createdRow': function (row, data, dataIndex) { $(row).attr('bg-guid', data.building_tag); $(row).attr('ms-guid', data.main_system_tag); $(row).attr('ss-guid', data.sub_system_tag); $(row).attr('ms-name', data.main_system_guid_name); $(row).attr('ss-name', data.sub_system_guid_name); }, "ajax": { "url": "/BuildMenu/BuildMenuTable", "type": "POST", "data": function (d) { d.building_tag = SelectBuild, d.MainList = SelectMainList }, "dataSrc": function (rel) { if (rel.code == "9999") { toast_error(rel.msg); return; } data = rel.data.data; if (data == null || data.length == 0) { this.data = []; } else { $.each(this.data, function (k, rel) { rel.sub_system_guid_name = "<font color='#7c91df'>" + rel.sub_system_guid_name + "</font>" if (rel.left_drawing == 2) { rel.left_drawing_name = rel.left_drawing_name + "<br>" + '<a href = "' + rel.system_url + '" target="_blank" >點擊連結</a >' } if (rel.left_drawing == 1) { rel.left_drawing_name = rel.left_drawing_name + "<br>" + '[' + rel.floor_guid_name + ']' } if (rel.right_drawing == 2) { rel.right_drawing_name = rel.right_drawing_name + "<br>" + '<a href = "' + rel.system_url + '" target="_blank" >點擊連結</a >' } if (rel.right_drawing == 1) { rel.right_drawing_name = rel.right_drawing_name + "<br>" + '[' + rel.floor_guid_name + ']' } }) } $('#floorcard').hide(); return data; } } }); buildMenuFloorTable = $("#buildMenu_floor_table").DataTable({ "columns": [ { "data": "sub_system_floor_id", "render": function (data, type, row, meta) { return meta.row + 1; } }, { "data": "main_system_guid_name" }, { "data": "sub_system_guid_name" }, { "data": "floor_guid_name" }, { "data": null, "defaultContent": '<button class="btn btn-danger del-btn">刪除</button>' } ], 'createdRow': function (row, data, dataIndex) { $(row).attr('ssf-guid', data.sub_system_floor_id); }, "ajax": { "url": "/BuildMenu/BuildMenuFloorTable", "type": "POST", "data": function (d) { d.building_tag = SelectBuild, d.main_system_tag = SelectMainSys, d.sub_system_tag = SelectSubSys }, "dataSrc": function (rel) { if (rel.code == "9999") { toast_error(rel.msg); return; } data = rel.data.data; if (data == null || data.length == 0) { this.data = []; } return data; } } }); }); //#region 取棟別 function GetBuild() { var url = "/BuildMenu/BuildInfoList"; var send_data = {}; $.post(url, send_data, function (rel) { if (rel.code != "0000") { if (rel.code == "9999") { toast_error(rel.msg); } return; } else { $('#buildlist').empty(); var buildstr = ""; $.each(rel.data, function (index, val) { $('#build_menu_building_modal').append($("<option />").val(val.value).text(val.name)); if (index == 0) { SelectBuild = val.value; buildstr += '<button type="button" class="btn btn-success waves-effect waves-themed" onclick="SelectBulid(\'' + val.value + '\' ,this)">' + val.name + '</button>'; } else { buildstr += '<button type="button" class="btn btn-secondary waves-effect waves-themed" onclick="SelectBulid(\'' + val.value + '\',this)" >' + val.name + '</button>'; } }); $('#buildlist').append(buildstr); $('#buildlist').find('.btn-success').trigger('click'); GetMainlistByBuild(SelectBuild); return; } }, 'json'); } //#endregion //#region 選擇棟別 function SelectBulid(build, e) { SelectBuild = build; if ($("#buildlist").find('.btn').hasClass("btn-success")) { $("#buildlist").find('.btn').removeClass("btn-success").addClass("btn-secondary"); } $(e).removeClass("btn-secondary").addClass("btn-success"); $('#menucard').find('.card-title').html(e.innerText + "-選單"); GetMainlistByBuild(SelectBuild); } //#endregion var submain = new Array(0); //#region 以棟別找系統大類 function GetMainlistByBuild(building_tag) { var url = "/BuildMenu/MainListBybuild"; var send_data = { building_tag: building_tag }; $.post(url, send_data, function (rel) { if (rel.code != "0000") { if (rel.code == "9999") { toast_error(rel.msg); } return; } else { $('#mainlist').empty(); submain = SelectMainList; SelectMainList = []; selectAllMain = false; var mainliststr = ""; AllMainList = []; $.each(rel.data, function (index, val) { AllMainList.push(val.value); mainliststr += '<button type="button" class="btn btn-outline-success waves-effect waves-themed mb-2 mr-2" id="btn-' + val.value + '" onclick="SelectMain(\'' + val.value + '\',this)">' + val.name + '</button>'; }); $('#mainlist').append(mainliststr); if (submain.length != 0) { $.each(submain, function (ind, va) { $('#btn-' + va).trigger('click'); }); submain = []; } buildMenuTable.ajax.reload(); return; } }, 'json'); } //#endregion //#region 取所有系統大類 function GetMainList() { var url = "/BuildMenu/MainList"; var send_data = {}; $.post(url, send_data, function (rel) { if (rel.code != "0000") { if (rel.code == "9999") { toast_error(rel.msg); } return; } else { $('#build_menu_main_modal').empty(); $.each(rel.data, function (index, val) { $('#build_menu_main_modal').append($("<option />").val(val.value).text(val.name)); if (index == 0) { GetSubList(val.value) } }); return; } }, 'json'); } //#endregion //#region 取大類中的小類(還沒新增) function GetSubList(main) { var url = "/BuildMenu/SubListNotAdd"; var send_data = { main_system_tag: main, building_tag: SelectBuild }; $.post(url, send_data, function (rel) { if (rel.code != "0000") { if (rel.code == "9999") { toast_error(rel.msg); } return; } else { $('#build_menu_sub_modal').empty(); $.each(rel.data, function (index, val) { $('#build_menu_sub_modal').append($("<option />").val(val.value).text(val.name)); }); return; } }, 'json'); } //#endregion //#region 選擇系統大類 function SelectMain(main, e) { if ($(e).hasClass("btn-outline-success")) { $(e).removeClass("btn-outline-success").addClass("btn-success"); SelectMainList.push(main); } else if ($(e).hasClass("btn-success")) { $(e).removeClass("btn-success").addClass("btn-outline-success"); var a = SelectMainList.filter(function (n, i) { if (n === main) { SelectMainList.splice(i, 1); } }); } buildMenuTable.ajax.reload(); }; //#endregion //#region 新增menu function Addmenu() { $('.modal-title').html("選單基本資料 - 新增"); $('#build_menu_building_modal').attr('disabled', false); $('#build_menu_main_modal').attr('disabled', false); $('#build_menu_sub_modal').attr('disabled', false); $("#build-menu-form").trigger("reset"); $('#build_menu_building_modal').val(SelectBuild); $.each($("input[name='icon_click[]']"), function (index, item) { $(this).prop("checked", false); }); changebuild_menu_drawing_modal(); GetSubList($('#build_menu_main_modal').val()); GetBuildingHas3D(); $('#planimetric_click').attr("disabled", false); $('#build-menu-modal').modal(); } //#endregionplanimetric_click //#region 修改選擇顯示頁面總類 $('#build-menu-form').on("change", "input[name^=drawing]", function () { changebuild_menu_drawing_modal(this); }); //#endregion $('#build_menu_icon_click_onoff_modal_div').on("click", "input[type=checkbox]", function () { if ($(this).prop("checked") && $(this).val() == 1) { $('#build_menu_icon_click_url_modal_div').show(); $('#build_menu_icon_click_url_width_height_modal_div').show(); } else { $('#build_menu_icon_click_url_modal_div').hide(); $('#build_menu_icon_click_url_width_height_modal_div').hide(); } }); $('#build_menu_icon_click_onoff_modal_div_r').on("click", "input[type=checkbox]", function () { if ($(this).prop("checked") && $(this).val() == 1) { $('#build_menu_icon_click_url_modal_div_r').show(); $('#build_menu_icon_click_url_width_height_modal_div_r').show(); } else { $('#build_menu_icon_click_url_modal_div_r').hide(); $('#build_menu_icon_click_url_width_height_modal_div_r').hide(); } }); //#region 更改大類更換小類 $('#build_menu_main_modal').on("change", function () { GetSubList($('#build_menu_main_modal').val()); }); //#endregion //#region 儲存選單 function SavebuildMenuModal() { if ($('input[name="drawing"]:checked').val() == 2) { if ($('#build_menu_systemurl_modal').val().length == 0) { Swal.fire( { title: "儲存失敗", icon: 'warning', html: '系統圖URL不能為空', }); return; } } if ($('#build_menu_sub_modal').val() == null) { Swal.fire( { title: "儲存失敗", icon: 'warning', html: '沒有小類不能儲存', }); return; } var left_icon_click = 0; var right_icon_click = 0; $.each($("input[name='icon_click[]']"), function (index, item) { if (item.checked) { left_icon_click += parseInt(item.value); } }); $.each($("input[name='icon_click[]_r']"), function (index, item) { if (item.checked) { right_icon_click += parseInt(item.value); } }); var url = "/BuildMenu/SavebuildMenuModal"; var send_data = { building_tag: $('#build_menu_building_modal').val(), main_system_tag: $('#build_menu_main_modal').val(), sub_system_tag: $('#build_menu_sub_modal').val(), left_drawing: $('input[name="drawing"]:checked').val(), left_system_url: $('#build_menu_systemurl_modal').val(), left_icon_click: left_icon_click, left_icon_click_url: $('#build_menu_icon_click_url_modal').val(), left_icon_click_url_width: $('#build_menu_icon_click_url_width_modal').val(), left_icon_click_url_height: $('#build_menu_icon_click_url_height_modal').val(), left_planimetric_click: $('input[name="planimetric_click"]:checked').val(), left_riser_diagram_url: $('#build_menu_riser_diagram_url_modal').val(), left_planimetric_floor_guid: $('#build_menu_planimetric_floor_modal').val(), right_drawing: $('input[name="drawing_r"]:checked').val(), right_system_url: $('#build_menu_systemurl_modal_r').val(), right_icon_click: right_icon_click, right_icon_click_url: $('#build_menu_icon_click_url_modal_r').val(), right_icon_click_url_width: $('#build_menu_icon_click_url_width_modal_r').val(), right_icon_click_url_height: $('#build_menu_icon_click_url_height_modal_r').val(), right_planimetric_click: $('input[name="planimetric_click_r"]:checked').val(), right_riser_diagram_url: $('#build_menu_riser_diagram_url_modal_r').val(), right_planimetric_floor_guid: $('#build_menu_planimetric_floor_modal_r').val() }; $.post(url, send_data, function (rel) { if (rel.code != "0000") { toast_error(rel.msg); $('#build-menu-modal').modal('hide'); } else { buildMenuTable.ajax.reload(null, false); $('#build-menu-modal').modal('hide'); $('#buildlist').find('.btn-success').trigger('click'); toast_ok(rel.msg); } }, 'json'); } //#endregion //#region 修改menu $('#buildMenu_table').on("click", "button.edit-btn", function () { var url = "/BuildMenu/GetBuildMenu"; var send_data = { building_tag: $(this).parents('tr').attr('bg-guid'), main_system_tag: $(this).parents('tr').attr('ms-guid'), sub_system_tag: $(this).parents('tr').attr('ss-guid') }; $.post(url, send_data, function (rel) { if (rel.code != "0000") { toast_error(rel.msg); } else { $('#build_menu_building_modal').val(rel.data.building_tag); $('#build_menu_main_modal').val(rel.data.main_system_tag); $('#build_menu_building_modal').attr('disabled', true); $('#build_menu_main_modal').attr('disabled', true); $('#build_menu_sub_modal').attr('disabled', true); $('#build_menu_sub_modal').append($("<option />").val(rel.data.sub_system_tag).text(rel.data.sub_system_guid_name)); $('#build_menu_sub_modal').val(rel.data.sub_system_tag); //left $("input[name='drawing'][value='" + rel.data.left_drawing + "']").prop("checked", true); if (rel.data.left_planimetric_click == 1) { $('input[name="planimetric_click"]').prop("checked", true) } else { $('input[name="planimetric_click"]').prop("checked", false) } $('#build_menu_systemurl_modal').val(rel.data.left_system_url); $.each($("input[name='icon_click[]']"), function (index, item) { if (parseInt(item.value) & rel.data.left_icon_click > 0) { $(item).prop("checked", true); } else { $(item).prop("checked", false); } }); @*$("input[name*='icon_click_onoff'][value='" + rel.data.icon_click + "']").prop("checked", true);*@ $('#build_menu_icon_click_url_modal').val(rel.data.left_icon_click_url); if (rel.data.left_icon_click_url_width != undefined && rel.data.left_icon_click_url_width != null && rel.data.left_icon_click_url_width > 0) { $('#build_menu_icon_click_url_width_modal').val(rel.data.left_icon_click_url_width); } else { $('#build_menu_icon_click_url_width_modal').val(""); } if (rel.data.left_icon_click_url_height != undefined && rel.data.left_icon_click_url_height != null && rel.data.left_icon_click_url_height > 0) { $('#build_menu_icon_click_url_height_modal').val(rel.data.left_icon_click_url_height); } else { $('#build_menu_icon_click_url_height_modal').val(""); } //right $("input[name*='drawing_r'][value='" + rel.data.right_drawing + "']").prop("checked", true); if (rel.data.right_planimetric_click == 1) { $('input[name="planimetric_click_r"]').prop("checked", true) } else { $('input[name="planimetric_click_r"]').prop("checked", false) } $('#build_menu_systemurl_modal_r').val(rel.data.right_system_url); $.each($("input[name='icon_click[]_r']"), function (index, item) { if (parseInt(item.value) & rel.data.left_icon_click > 0) { $(item).prop("checked", true); } else { $(item).prop("checked", false); } }); $('#build_menu_icon_click_url_modal_r').val(rel.data.right_icon_click_url); if (rel.data.right_icon_click_url_width != undefined && rel.data.right_icon_click_url_width != null && rel.data.right_icon_click_url_width > 0) { $('#build_menu_icon_click_url_width_modal_r').val(rel.data.right_icon_click_url_width); } else { $('#build_menu_icon_click_url_width_modal_r').val(""); } if (rel.data.right_icon_click_url_height != undefined && rel.data.right_icon_click_url_height != null && rel.data.right_icon_click_url_height > 0) { $('#build_menu_icon_click_url_height_modal_r').val(rel.data.right_icon_click_url_height); } else { $('#build_menu_icon_click_url_height_modal_r').val(""); } changebuild_menu_drawing_modal(); GetBuildingHas3D(); GetFloorInSubSystem(rel.data.left_planimetric_floor_guid); GetFloorInSubSystem(rel.data.right_planimetric_floor_guid); $('.modal-title').html("選單基本資料 - 修改"); $('#build-menu-modal').modal(); } }, 'json'); }); //#endregion function changebuild_menu_drawing_modal(selector = "input[name^='drawing']:checked") { $(selector).each(function (index, value) { let drawingParent = $(value).parents("[id^=build_menu_position]") $(drawingParent).find('[id^=build_menu_icon_click_onoff_modal_div]').hide(); $(drawingParent).find('[id^=build_menu_blankurl_modal_div]').hide(); $(drawingParent).find('[id^=build_menu_icon_click_url_modal_div]').hide(); $(drawingParent).find('[id^=build_menu_icon_click_url_width_height_modal_div]').hide(); $(drawingParent).find('[id^=build_menu_planimetric_floor_modal_div]').hide(); $(drawingParent).find('[id^=build_menu_systemurl_modal_div]').hide(); $(drawingParent).find('[id^=build_menu_planimetric_modal_div]').show(); if ($(value).val() == 2) { $(drawingParent).find('[id^=planimetric_click]').attr("disabled", false); $(drawingParent).find('[id^=build_menu_systemurl_modal_div]').show(); } else if ($(value).val() == 4) { $(drawingParent).find('[id^="planimetric_click"]').attr("disabled", false); $(drawingParent).find('[id^=build_menu_icon_click_onoff_modal_div]').show(); if ($(drawingParent).find("[id^=icon_click_url]").prop('checked')) { $(drawingParent).find('[id^=build_menu_icon_click_url_modal_div]').show(); $(drawingParent).find('[id^=build_menu_icon_click_url_width_height_modal_div]').show(); } } else if ($(value).val() == 1) { $(drawingParent).find('[id^=planimetric_click]').prop("checked", true).attr("disabled", true); $(drawingParent).find('[id^=build_menu_planimetric_floor_modal_div]').show(); } else if ($(value).val() == 5) { $(drawingParent).find('[id^=planimetric_click]').prop("checked", false); $(drawingParent).find('[id^=build_menu_blankurl_modal_div]').show(); } else if ($(value).val() == 3) { $(drawingParent).find('[id^=planimetric_click]').prop("checked", false).attr("disabled", true); } else { $(drawingParent).find('[id^=build_menu_planimetric_modal_div]').hide(); } }) } $('#buildMenu_table').on("click", "button.del-btn", function () { var send_data = { building_tag: $(this).parents('tr').attr('bg-guid'), main_system_tag: $(this).parents('tr').attr('ms-guid'), sub_system_tag: $(this).parents('tr').attr('ss-guid') }; Swal.fire( { title: "刪除", text: "你確定是否刪除此筆資料?", type: "warning", icon: 'warning', showCancelButton: true, confirmButtonText: "是", cancelButtonText: "否" }).then(function (result) { if (result.value) { if ($("#buildMenu_floor_table").find(".dataTables_empty").length != 1) { Swal.fire( { title: "刪除失敗", icon: 'warning', html: '下方樓層設定中尚有樓層正在使用該棟別選單,故無法刪除', html: '需先刪除所有相關樓層才可進行刪除', }); return; } else { var url = "/BuildMenu/DeleteBuildMenu/"; $.post(url, send_data, function (rel) { if (rel.code == "9999") { toast_error(rel.msg); return; } toast_ok(rel.msg); buildMenuTable.ajax.reload(null, false); }, 'json'); } } }); }); $('#buildMenu_table').on("click", "tbody>tr", function () { $(this).parents().find('tr').css('background-color', '#fff'); $(this).css('background-color', '#67B4AC'); SelectBuild = $(this).attr('bg-guid'); SelectMainSys = $(this).attr('ms-guid'); SelectSubSys = $(this).attr('ss-guid'); @*$('#menu_floor_main_modal').append($("<option />").val($(this).attr('ms-guid')).text($(this).attr('ms-name'))); $('#menu_floor_sub_modal').append($("<option />").val($(this).attr('ss-guid')).text($(this).attr('ss-name')));*@ $('#menu_floor_main_modal').html($(this).attr('ms-name')) $('#menu_floor_sub_modal').html($(this).attr('ss-name')) $('#floorcard').show(); $('#floorcard').find('.card-title').html($(this).attr('ms-name') + "-" + $(this).attr('ss-name') + "-樓層設定"); buildMenuFloorTable.ajax.reload(null, false); }); function AddFloor() { var send_data = { building_tag: SelectBuild, main_system_tag: SelectMainSys, sub_system_tag: SelectSubSys }; var url = "/BuildMenu/GetNotUsefloor/"; $.post(url, send_data, function (rel) { if (rel.code == "9999") { toast_error(rel.msg); return; } var checkbox = ""; $('#floor_check').empty(); $.each(rel.data, function (index, val) { checkbox += '<div class="col-3 mb-2 custom-control custom-checkbox align-content-center">'; checkbox += '<input type="checkbox" class="custom-control-input" name="selectfloor[]" id="' + val.value + '" value="' + val.name + ' " />'; checkbox += '<label class="custom-control-label" for="' + val.value + '">' + val.name + '</label>'; checkbox += '</div>'; }); $('#floor_check').append(checkbox); $('#menu-floor-modal').modal(); buildMenuFloorTable.ajax.reload(null, false); }, 'json'); } function SaveFloorMenuModal() { var SelectAddFloor = $("input[name='selectfloor[]']:checked").map(function () { return $(this).val(); }).get(); if (SelectAddFloor.length == 0) { Swal.fire( { title: "儲存失敗", icon: 'warning', html: '沒有選擇樓層不能儲存', }); return; } var send_data = { building_tag: SelectBuild, main_system_tag: SelectMainSys, sub_system_tag: SelectSubSys, floorlist: SelectAddFloor }; var url = "/BuildMenu/SaveAddsubfloor/"; $.post(url, send_data, function (rel) { if (rel.code == "9999") { toast_error(rel.msg); return; } toast_ok(rel.msg); buildMenuFloorTable.ajax.reload(null, false); $('#menu-floor-modal').modal('hide'); }, 'json'); } $('#buildMenu_floor_table').on("click", "button.del-btn", function () { var send_data = { sub_system_floor_id: $(this).parents('tr').attr('ssf-guid') }; Swal.fire( { title: "刪除", text: "你確定是否刪除此筆資料?", type: "warning", icon: 'warning', showCancelButton: true, confirmButtonText: "是", cancelButtonText: "否" }).then(function (result) { if (result.value) { var url = "/BuildMenu/DeleteBuildFloorMenu/"; $.post(url, send_data, function (rel) { if (rel.code != "0000") { if (rel.code == "9999") { toast_error(rel.msg); } else if (rel.code == "9997") { var htnl = rel.msg + "<br>" Swal.fire( { title: "刪除失敗", icon: 'warning', html: htnl, }); } else { toast_warning(rel.msg); } return; } else { toast_ok(rel.msg); buildMenuFloorTable.ajax.reload(null, false); return; } }, 'json'); } }); }); function AllMainSys() { if (selectAllMain) { SelectMainList = []; $('#mainlist').find('.btn').removeClass('btn-success').addClass("btn-outline-success"); selectAllMain = false; } else { SelectMainList = AllMainList; $('#mainlist').find('.btn').removeClass('btn-outline-success').addClass("btn-success"); selectAllMain = true; } buildMenuTable.ajax.reload(); } function AddTagIntoClickUrl(tag, way) { var elem = way == "l" ? $('#build_menu_icon_click_url_modal') : $('#build_menu_icon_click_url_modal_r'); var a = elem.val(); switch (tag) { case 'device_building_tag': elem.val(a + '/[device_building_tag]'); break; case 'device_system_tag': elem.val(a + '/[device_system_tag]'); break; case 'device_floor_tag': elem.val(a + '/[device_floor_tag]'); break; case 'device_name_tag': elem.val(a + '/[device_name_tag]'); break; case 'device_serial_tag': elem.val(a + '/[device_serial_tag]'); break; case 'tag_name': elem.val(a + '/[tag_name]'); break; } } function GetFloorInSubSystem(floor = null) { var url = "/BuildMenu/GetFloorInSubSystem"; var send_data = { building_tag: $('#build_menu_building_modal').val(), main_system_tag: $('#build_menu_main_modal').val(), sub_system_tag: $('#build_menu_sub_modal').val(), }; $.post(url, send_data, function (rel) { if (rel.code != "0000") { toast_error(rel.msg); } else { if (rel.data.length == 0) { $('[id^=drawing_1_div]').hide(); $('[id^=build_menu_planimetric_floor_modal_div]').hide(); } else { $('#build_menu_planimetric_floor_modal,#build_menu_planimetric_floor_modal_r').empty(); $.each(rel.data, function (index, val) { $('#build_menu_planimetric_floor_modal').append($("<option />").val(val.value).text(val.name)); $('#build_menu_planimetric_floor_modal_r').append($("<option />").val(val.value).text(val.name)); }); if (floor != null) { $('#build_menu_planimetric_floor_modal').val(floor); $('#build_menu_planimetric_floor_modal_r').val(floor); } $('[id^=drawing_1_div]').show(); $('[id^=build_menu_planimetric_floor_modal_div]').show(); changebuild_menu_drawing_modal(); } } }, 'json'); } function GetBuildingHas3D() { var url = "/BuildMenu/GetBuildingHas3D"; var send_data = { building_tag: $('#build_menu_building_modal').val(), }; $.post(url, send_data, function (rel) { if (rel.code != "0000") { toast_error(rel.msg); } else { if (rel.data == 0) { $('[id^=drawing_3_div]').hide(); } else { $('[id^=drawing_3_div]').show(); changebuild_menu_drawing_modal(); } } }, 'json'); } </script> }