3138 lines
160 KiB
Plaintext
3138 lines
160 KiB
Plaintext
@{
|
||
ViewData["MainNum"] = "2";
|
||
ViewData["SubNum"] = "2";
|
||
ViewData["Title"] = "設備管理";
|
||
}
|
||
|
||
<div class="container-fluid">
|
||
<div class="row flex-nowrap wrapper">
|
||
<div class="col-md-2 col-1 pl-0 pr-0 collapse width border-right sidebar vh-100 overflow-auto">
|
||
|
||
<div class="list-group border-0 card text-center text-md-left" id="sidebar">
|
||
|
||
<div class="border bg-light rounded-top">
|
||
<div class="form-group p-2 m-0 rounded-top">
|
||
<input type="text" class="form-control form-control-lg shadow-inset-2 m-0" id="js_list_accordion_filter" placeholder="">
|
||
</div>
|
||
<div id="js_list_accordion" class="accordion accordion-hover accordion-clean js-list-filter">
|
||
</div>
|
||
<span class="filter-message js-filter-message"></span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-auto px-0">
|
||
<a href="javascript:;" id="collapse" data-target=".sidebar" data-toggle="collapse" class="btn btn-default btn-xs btn-icon waves-effect waves-themed" style="border-radius: 0;" aria-expanded="true">
|
||
<span class="collapsed-reveal"><i class="fal fa-angle-left fa-lg py-3"></i></span>
|
||
<span class="collapsed-hidden"><i class="fal fa-angle-right fa-lg py-3"></i></span>
|
||
</a>
|
||
</div>
|
||
|
||
<main class="col px-5 pl-md-2 main">
|
||
<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="subheader">
|
||
<h1 class="subheader-title">
|
||
<i class="subheader-icon fal fa-crosshairs"></i> <span id="select-main-system-name"></span> - <span id="select-sub-system-name"></span>
|
||
</h1>
|
||
</div>
|
||
|
||
<div class="row">
|
||
<div class="col-xl-12">
|
||
<div id="panel-5" class="panel">
|
||
<div class="panel-container show">
|
||
<div class="panel-content">
|
||
<div class="mb-5 d-flex align-items-center justify-content-start ">
|
||
<span class="mr-2" style="font-size:18px">樓層</span>
|
||
<div class="floor-panel-wrap">
|
||
</div>
|
||
</div>
|
||
|
||
<div class="mb-5">
|
||
<div class="card p-3 w-100">
|
||
<div class="row">
|
||
<div class="col-12">
|
||
<div class="row mb-2">
|
||
<h3 class="mr-2">當前模式：</h3>
|
||
<h3 class="font-weight-bolder mr-2" id="floor-map-mode-text">檢視模式</h3>
|
||
@*<div class="edit-mode" id="floor-map-edit-mode-btn-wrap" style="display:none">
|
||
<button type="button" class="btn btn-secondary waves-effect waves-themed" onclick="CancelFloorMapEdit()">取消</button>
|
||
<button type="button" class="btn btn-primary waves-effect waves-themed" onclick="SaveFloorMapEdit()">確定</button>
|
||
</div>*@
|
||
</div>
|
||
</div>
|
||
<div class="col-12 mb-2" id="floor_map" style="height : 50vh!important;">
|
||
</div>
|
||
<div class="col-12">
|
||
<div class="edit-mode" id="floor-map-edit-mode-btn-wrap" style="display:none">
|
||
<button type="button" class="btn btn-secondary waves-effect waves-themed" onclick="CancelFloorMapEdit()">取消</button>
|
||
<button type="button" class="btn btn-primary waves-effect waves-themed" onclick="SaveFloorMapEdit()">確定</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="mb-5">
|
||
<div class="card p-3 w-100">
|
||
<div class="card-header d-flex align-items-center flex-wrap">
|
||
<div class="card-title">
|
||
設備基本資料
|
||
</div>
|
||
<div class="ml-auto">
|
||
@*隱藏新增按鈕
|
||
<a href="javascript:;" class="btn btn-success waves-effect waves-themed" id="addDevice-btn" onclick="AddDevice()"><span class="fal fa-plus mr-1"></span>新增設備</a>*@
|
||
<a href="javascript:;" class="btn btn-primary waves-effect waves-themed" id="device-master-list-btn" style="display:none"><span class="fal fa-plus mr-1"></span>分電盤</a>
|
||
</div>
|
||
</div>
|
||
<div class="card-body row">
|
||
<div class="col-12">
|
||
<!-- datatable start -->
|
||
<table id="device_info_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>
|
||
<th>樓層</th>
|
||
<th>設備編號</th>
|
||
<th>設備名稱</th>
|
||
<th>地圖座標</th>
|
||
<th>防災類別</th>
|
||
<th>功能</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="mb-5">
|
||
<div class="card p-3 w-100">
|
||
<div class="card-header d-flex align-items-center flex-wrap">
|
||
<div class="card-title">
|
||
設備種類設定
|
||
</div>
|
||
</div>
|
||
<div class="card-body row">
|
||
<div class="col-12">
|
||
<!-- datatable start -->
|
||
<table id="device_kind_table" class="table table-bordered table-hover m-0 text-center">
|
||
<thead class="thead-themed">
|
||
<tr>
|
||
<th>序</th>
|
||
<th>設備機型</th>
|
||
<th>設備icon</th>
|
||
<th>正常狀態</th>
|
||
<th>關機狀態</th>
|
||
<th>異常狀態</th>
|
||
<th>功能</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</main>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Modal 設備基本資料(新增) -->
|
||
<div class="modal fade" id="device-info-add-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">
|
||
<div class="row mb-3 align-items-center justify-content-start">
|
||
<div class="col-12">
|
||
<div class="row mb-2 align-items-center justify-content-start">
|
||
<span class="col-1">棟別</span>
|
||
<div class="col-11 row">
|
||
<div id="import-temp-building-tag-list" class="col-12">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-12">
|
||
<div class="row mb-2 align-items-center justify-content-start">
|
||
<span class="col-1">系統別</span>
|
||
<div class="col-11 row align-items-start">
|
||
<div id="import-temp-system-tag-list" class="col-12">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-12">
|
||
<div class="row mb-2 align-items-center justify-content-start">
|
||
<span class="col-1">樓層</span>
|
||
<div class="col-11 row align-items-start">
|
||
<div id="import-temp-floor-tag-list" class="col-12">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-12">
|
||
<div class="row mb-2 d-flex align-items-center justify-content-start">
|
||
<span class="col-1">設備種類</span>
|
||
<div class="col-11 row align-items-start">
|
||
<div id="import-temp-name-tag-list" class="col-12">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="col-12 row">
|
||
<div class="col-12">
|
||
<!-- datatable start -->
|
||
<table id="device_import_check_temp_table" class="table table-bordered table-hover m-0 text-center">
|
||
<thead class="thead-themed">
|
||
<tr>
|
||
<th>
|
||
<div class="custom-control custom-checkbox">
|
||
<input type="checkbox" class="custom-control-input" id="select-all-device-number">
|
||
<label class="custom-control-label" for="select-all-device-number">全選</label>
|
||
</div>
|
||
</th>
|
||
<th>序</th>
|
||
<th>設備編號</th>
|
||
<th>設備名稱</th>
|
||
<th>防災類別</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="modal-footer">
|
||
<button type="button" class="btn btn-secondary" data-dismiss="modal">取消</button>
|
||
<button type="button" class="btn btn-primary" id="save-device-add-btn" onclick="SaveDeviceAdd()">確定</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- /.Modal 設備基本資料(新增) -->
|
||
<!-- Modal 設備基本資料(修改) -->
|
||
<div class="modal fade" id="device-info-edit-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 class="device-info-edit-form" id="device-info-edit-form">
|
||
<div class="row">
|
||
<div class="form-group col-6">
|
||
<label class="form-label" for="device_building_name_modal">棟別</label><br>
|
||
<span id="device_building_name_modal" class="fw-900"></span>
|
||
</div>
|
||
<div class="form-group col-6">
|
||
<label class="form-label" for="system_main_code_modal">系統大類</label><br>
|
||
<span id="device_main_system_name_modal" class="fw-900"></span>
|
||
</div>
|
||
<div class="form-group col-6">
|
||
<label class="form-label" for="system_main_code_modal">系統小類</label><br>
|
||
<span id="device_sub_system_name_modal" class="fw-900"></span>
|
||
</div>
|
||
<div class="form-group col-6">
|
||
<label class="form-label" for="system_main_code_modal">樓層</label><br>
|
||
<span id="device_floor_name_modal" class="fw-900"></span>
|
||
</div>
|
||
<div class="form-group col-12">
|
||
<label class="form-label" for="device_number_modal"><span class="text-danger">*</span>設備編號</label><br>
|
||
<span id="device_number_modal" class="fw-900"></span>
|
||
</div>
|
||
<div class="form-group col-12">
|
||
<label class="form-label" for="device_name_modal"><span class="text-danger">*</span>設備名稱</label>
|
||
<input type="text" id="device_name_modal" name="device_name_modal" class="form-control">
|
||
</div>
|
||
<div class="form-group col-12" id="device-coordinate-wrap">
|
||
<label class="form-label" for="device_coordinate_modal"><span class="text-danger">*</span>地圖座標</label>
|
||
<div class="row">
|
||
<div class="col-6">
|
||
<label class="form-label" for="device_coordinate_x_modal">x：</label>
|
||
<input type="number" step="0.001" id="device_coordinate_x_modal" name="device_coordinate_x_modal" class="form-control">
|
||
</div>
|
||
<div class="col-6">
|
||
<label class="form-label" for="device_coordinate_y_modal">y：</label>
|
||
<input type="number" step="0.001" id="device_coordinate_y_modal" name="device_coordinate_y_modal" class="form-control">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div class="form-group col-12">
|
||
<label class="form-label" for="device_disaster_modal">防災類別</label>
|
||
<div class="row ml-2 mr-1" id="disaster_check">
|
||
|
||
</div>
|
||
</div>
|
||
<div class="form-group col-8" id="device-ip-wrap">
|
||
<label class="form-label" for="device_ip_modal">設備IP</label>
|
||
<input type="text" id="device_ip_modal" name="device_ip_modal" class="form-control">
|
||
</div>
|
||
<div class="form-group col-4" id="device-port-wrap">
|
||
<label class="form-label" for="device_port_modal">設備Port</label>
|
||
<input type="text" id="device_port_modal" name="device_port_modal" class="form-control">
|
||
</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="SaveDeviceInfoEdit()">確定</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- /.Modal 設備基本資料(修改) -->
|
||
<!-- Modal 設備種類資料 -->
|
||
<div class="modal fade" id="device-kind-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 class="device-kind-form" id="device-kind-form">
|
||
<div class="row">
|
||
<div class="form-group col-12">
|
||
<label class="form-label" for="device_kind_name_modal">設備機型</label><br>
|
||
<span id="device_kind_name_modal" class="fw-900"></span>
|
||
</div>
|
||
<div class="form-group col-12">
|
||
<label class="form-label" for="device_image_modal">設備icon</label>
|
||
<input type="file" id="device_image_modal" name="device_image_modal" class="form-control" accept="image/*">
|
||
</div>
|
||
<div class="form-group col-12">
|
||
<div class="row">
|
||
<div class="col-2 d-flex justify-content-center align-items-center">
|
||
<div class="form-group">
|
||
<label class="form-label">燈號 1</label>
|
||
</div>
|
||
</div>
|
||
<div class="col row">
|
||
<div class="form-group col">
|
||
<label class="form-label" for="device_normal_text_modal">顯示文字</label>
|
||
<input type="text" id="device_normal_text_modal" name="device_normal_text_modal" class="form-control" placeholder="正常/開機/運作中" maxlength="50" />
|
||
</div>
|
||
<div class="form-group col">
|
||
<label class="form-label" for="device_normal_point_name_modal">點位名稱</label>
|
||
<select class="form-control" id="device_normal_point_name_modal">
|
||
</select>
|
||
</div>
|
||
<div class="form-group col">
|
||
<label class="form-label" for="device_normal_point_col_modal">點位欄位</label>
|
||
<select class="form-control" id="device_normal_point_col_modal" disabled>
|
||
<option value="" selected disabled>未選擇</option>
|
||
<option value="Facets_key">Facets_key</option>
|
||
</select>
|
||
</div>
|
||
<div class="form-group col">
|
||
<label class="form-label" for="device_normal_point_value_modal">點位值</label>
|
||
<select class="form-control" id="device_normal_point_value_modal" disabled>
|
||
<option value="" selected disabled>未選擇</option>
|
||
<option value="trueText">trueText</option>
|
||
<option value="falseText">falseText</option>
|
||
</select>
|
||
</div>
|
||
<div class="form-group col">
|
||
<label class="form-label" for="device_normal_color_modal">燈號</label>
|
||
<input type="text" id="device_normal_color_modal" name="device_normal_color_modal" class="form-control" placeholder="#123456" maxlength="7" />
|
||
</div>
|
||
<div class="form-group col d-flex align-items-center" style="display: none !important">
|
||
<div class="custom-control custom-checkbox">
|
||
<input type="checkbox" id="device_normal_flashing_modal" name="device_normal_flashing_modal" class="custom-control-input" value="1">
|
||
<label class="custom-control-label" for="device_normal_flashing_modal">是否閃爍</label>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
</div>
|
||
<div class="row">
|
||
<div class="col-2 d-flex justify-content-center align-items-center">
|
||
<div class="form-group">
|
||
<label class="form-label">燈號 2</label>
|
||
</div>
|
||
</div>
|
||
<div class="col row">
|
||
<div class="form-group col">
|
||
<label class="form-label" for="device_close_text_modal">顯示文字</label>
|
||
<input type="text" id="device_close_text_modal" name="device_close_text_modal" class="form-control" placeholder="關機/非運作" maxlength="50" />
|
||
</div>
|
||
<div class="form-group col">
|
||
<label class="form-label" for="device_close_point_name_modal">點位名稱</label>
|
||
<select class="form-control" id="device_close_point_name_modal">
|
||
</select>
|
||
</div>
|
||
<div class="form-group col">
|
||
<label class="form-label" for="device_close_point_col_modal">點位欄位</label>
|
||
<select class="form-control" id="device_close_point_col_modal" disabled>
|
||
<option value="" selected disabled>未選擇</option>
|
||
<option value="Facets_key">Facets_key</option>
|
||
</select>
|
||
</div>
|
||
<div class="form-group col">
|
||
<label class="form-label" for="device_close_point_value_modal">點位值</label>
|
||
<select class="form-control" id="device_close_point_value_modal" disabled>
|
||
<option value="" selected disabled>未選擇</option>
|
||
<option value="trueText">trueText</option>
|
||
<option value="falseText">falseText</option>
|
||
</select>
|
||
</div>
|
||
<div class="form-group col">
|
||
<label class="form-label" for="device_close_color_modal">燈號</label>
|
||
<input type="text" id="device_close_color_modal" name="device_close_color_modal" class="form-control" placeholder="#123456" maxlength="7" />
|
||
</div>
|
||
<div class="form-group col d-flex align-items-center" style="display:none !important">
|
||
<div class="custom-control custom-checkbox">
|
||
<input type="checkbox" id="device_close_flashing_modal" name="device_close_flashing_modal" class="custom-control-input" value="1">
|
||
<label class="custom-control-label" for="device_close_flashing_modal">是否閃爍</label>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<hr>
|
||
<div class="row">
|
||
<div class="col-12">
|
||
<div class="row">
|
||
<div class="col-2 d-flex justify-content-center align-items-center">
|
||
<div class="form-group">
|
||
<label class="form-label">異常燈號</label>
|
||
</div>
|
||
</div>
|
||
<div class="col">
|
||
<div class="row">
|
||
<div class="form-group col">
|
||
<label class="form-label" for="device_error_text_modal">顯示文字</label>
|
||
<input type="text" id="device_error_text_modal" name="device_error_text_modal" class="form-control" placeholder="異常" maxlength="50" />
|
||
</div>
|
||
<div class="form-group col">
|
||
<label class="form-label" for="device_error_point_name_modal">點位名稱</label>
|
||
<select class="form-control" id="device_error_point_name_modal">
|
||
</select>
|
||
</div>
|
||
<div class="form-group col">
|
||
<label class="form-label" for="device_error_point_col_modal">點位欄位</label>
|
||
<select class="form-control" id="device_error_point_col_modal" disabled>
|
||
<option value="" selected disabled>未選擇</option>
|
||
<option value="Facets_key">Facets_key</option>
|
||
</select>
|
||
</div>
|
||
<div class="form-group col">
|
||
<label class="form-label" for="device_error_point_value_modal">點位值</label>
|
||
<select class="form-control" id="device_error_point_value_modal" disabled>
|
||
<option value="" selected disabled>未選擇</option>
|
||
<option value="trueText">trueText</option>
|
||
<option value="falseText">falseText</option>
|
||
</select>
|
||
</div>
|
||
<div class="form-group col">
|
||
<label class="form-label" for="device_error_color_modal">燈號</label>
|
||
<input type="text" id="device_error_color_modal" name="device_error_color_modal" class="form-control" placeholder="#123456" maxlength="7" />
|
||
</div>
|
||
</div>
|
||
<div class="row">
|
||
<div class="form-group col d-flex flex-column justify-content-center">
|
||
<div class="custom-control custom-checkbox">
|
||
<input type="checkbox" id="device_error_flashing_modal" name="device_error_flashing_modal" class="custom-control-input" value="1">
|
||
<label class="custom-control-label" for="device_error_flashing_modal">是否閃爍</label>
|
||
</div>
|
||
<div class="custom-control custom-checkbox" style="display:none">
|
||
<input type="checkbox" id="device_error_independent_modal" name="device_error_independent_modal" class="custom-control-input" value="1">
|
||
<label class="custom-control-label" for="device_error_independent_modal">是否獨立顯示</label>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</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" id="save-device-kind-btn" onclick="SaveDeviceKind()">確定</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- /.Modal 設備種類資料 -->
|
||
<!-- Modal 設備子節點資料 -->
|
||
<div class="modal fade" id="device-node-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 class="device-node-form" id="device-node-form">
|
||
<div class="row">
|
||
<div class="form-group col-12">
|
||
<label class="form-label" for="device_node_name_modal"><span class="text-danger">*</span>設備子節點名稱</label><br>
|
||
<input type="text" id="device_node_name_modal" name="device_node_name_modal" class="form-control">
|
||
</div>
|
||
<div class="form-group col-12">
|
||
<label class="form-label" for="device_node_coordinate_modal"><span class="text-danger">*</span>地圖座標</label>
|
||
<div class="row">
|
||
<div class="col-6">
|
||
<label class="form-label" for="device_node_coordinate_x_modal">x：</label>
|
||
<input type="number" step="0.001" id="device_node_coordinate_x_modal" name="device_node_coordinate_x_modal" class="form-control">
|
||
</div>
|
||
<div class="col-6">
|
||
<label class="form-label" for="device_node_coordinate_y_modal">y：</label>
|
||
<input type="number" step="0.001" id="device_node_coordinate_y_modal" name="device_node_coordinate_y_modal" class="form-control">
|
||
</div>
|
||
</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="SaveDeviceNode()">確定</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- /.Modal 設備子節點資料 -->
|
||
<!-- Modal 設備Master list -->
|
||
<div class="modal fade" id="device-master-list-modal" tabindex="-1" role="dialog" aria-hidden="true" data-backdrop="static" data-keyboard="false">
|
||
<div class="modal-dialog modal-dialog-centered modal-lg" 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">
|
||
<table id="device_master_table" class="table table-bordered table-hover m-0 text-center">
|
||
<thead class="thead-themed">
|
||
<tr>
|
||
<th>序</th>
|
||
<th>分電盤編號</th>
|
||
<th>分電盤名稱</th>
|
||
<th>分電盤icon</th>
|
||
<th>功能</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
</tbody>
|
||
</table>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- /.Modal 設備Master list -->
|
||
<!-- Modal 編輯 設備Master -->
|
||
<div class="modal fade" id="device-master-edit-modal" tabindex="-1" role="dialog" aria-hidden="true" data-backdrop="static" data-keyboard="false">
|
||
<div class="modal-dialog modal-dialog-centered modal-lg" 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 class="device-master-form" id="device-master-form">
|
||
<div class="row">
|
||
<div class="form-group col-12">
|
||
<label class="form-label" for="device_master_number_modal">分電盤編號</label><br>
|
||
<span id="device_master_number_modal" class="fw-900"></span>
|
||
</div>
|
||
<div class="form-group col-12">
|
||
<label class="form-label" for="device_master_full_name_modal">分電盤名稱</label>
|
||
<input type="text" id="device_master_full_name_modal" name="device_master_full_name_modal" class="form-control">
|
||
</div>
|
||
<div class="form-group col-12">
|
||
<label class="form-label" for="device_master_icon_modal">設備icon</label>
|
||
<input type="file" id="device_master_icon_modal" name="device_master_icon_modal" class="form-control" accept="image/*">
|
||
</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" id="save-device-master-btn" onclick="SaveDeviceMaster()">確定</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<!-- /.Modal 編輯 設備Master -->
|
||
|
||
|
||
@section Scripts {
|
||
<script src="~/js/echarts.min.js"></script>
|
||
<script>
|
||
var buildingCollapses;
|
||
var selected_building_menu = {}, selected_floor_tag;
|
||
var chartDom, myChart, option,
|
||
floor_map_mode = "view", //平面圖當前模式
|
||
selected_temp_device, //被選擇要修改的設備
|
||
temp_device_on_floor_map = [] //暫存在地圖上新的位置;
|
||
var currentData = [];
|
||
var deviceInfoTable, selected_device_guid;
|
||
var deviceImportCheckTempTable,
|
||
deviceImportCheckTempFilterList = [],
|
||
selected_building_tag = "",
|
||
selected_system_tag = "",
|
||
selected_floor_tag = "",
|
||
selected_name_tag = "";
|
||
var selected_device_node_guid;
|
||
var selected_device_parents_collapses = [];
|
||
var deviceKindTable,
|
||
selected_device_kind_guid,
|
||
selected_device_building_tag,
|
||
selected_device_system_tag,
|
||
selected_device_floor_tag,
|
||
selected_device_name_tag;
|
||
var deviceMasterTable,
|
||
selected_device_master_guid;
|
||
$(function () {
|
||
$('#collapse').trigger("click");
|
||
|
||
//預設載入左方選單列表
|
||
GetBuildingMenuCollapse("");
|
||
|
||
//修改左方選單列表查詢條件
|
||
$("#js_list_accordion_filter").change(function (e) {
|
||
GetBuildingMenuCollapse($(this).val());
|
||
});
|
||
|
||
chartDom = document.getElementById("floor_map");
|
||
myChart = echarts.init(chartDom, null, { width: 'auto', });
|
||
|
||
$('.sidebar').on("shown.bs.collapse", function () {
|
||
setTimeout(function () {
|
||
myChart.resize();
|
||
}, 500);
|
||
});
|
||
|
||
$('.sidebar').on("hidden.bs.collapse", function () {
|
||
setTimeout(function () {
|
||
myChart.resize();
|
||
}, 500);
|
||
});
|
||
|
||
//#region 設備基本資料DataTable
|
||
deviceInfoTable = $("#device_info_table").DataTable({
|
||
"pageLength": 20,
|
||
"columns": [
|
||
{
|
||
"className": 'dt-control',
|
||
"orderable": false,
|
||
"data": null,
|
||
"defaultContent": '<i class="fal fa-plus"></i>'
|
||
},
|
||
{
|
||
"data": null,
|
||
"render": function (data, type, row, meta) {
|
||
return meta.row + 1;
|
||
}
|
||
},
|
||
{
|
||
"data": "building_full_name"
|
||
},
|
||
{
|
||
"data": "main_system_full_name"
|
||
},
|
||
{
|
||
"data": "sub_system_full_name"
|
||
},
|
||
{
|
||
"data": "floor_full_name"
|
||
},
|
||
{
|
||
"data": "device_number"
|
||
},
|
||
{
|
||
"data": "device_full_name"
|
||
},
|
||
{
|
||
"data": "device_coordinate"
|
||
},
|
||
{
|
||
"data": "device_disaster_type_text"
|
||
},
|
||
{
|
||
"data": null,
|
||
"createdCell": function (td, cellData, rowData, row, col) {
|
||
$(td).empty();
|
||
@*if (rowData != null && (rowData.device_name_tag == "L1" || rowData.device_name_tag == "L2")) {
|
||
$(td).html(`
|
||
<button class="btn btn-primary edit-btn">修改</button>
|
||
<button class="btn btn-info add-device-node-btn">加入子節點</button>
|
||
<button class="btn btn-danger del-btn">刪除</button>`)
|
||
} else {
|
||
$(td).html(`<button class="btn btn-primary edit-btn">修改</button> <button class="btn btn-danger del-btn">刪除</button>`)
|
||
}*@
|
||
// 隱藏刪除按鈕
|
||
if (rowData != null && (rowData.device_name_tag == "L1" || rowData.device_name_tag == "L2")) {
|
||
$(td).html(`
|
||
<button class="btn btn-primary edit-btn">修改</button>
|
||
<button class="btn btn-info add-device-node-btn">加入子節點</button>`)
|
||
} else {
|
||
$(td).html(`<button class="btn btn-primary edit-btn">修改</button>`)
|
||
}
|
||
|
||
},
|
||
@*"defaultContent": '<button class="btn btn-primary edit-btn">修改</button> <button class="btn btn-danger del-btn">刪除</button>'*@
|
||
}
|
||
],
|
||
"order": [[1, "asc"]],
|
||
'createdRow': function (row, data, dataIndex) {
|
||
$(row).attr('id', "tr_" + data.device_guid);
|
||
$(row).attr('data-guid', data.device_guid);
|
||
},
|
||
"columnDefs": [
|
||
{
|
||
'targets': 0,
|
||
'searchable': false,
|
||
'visible': false
|
||
},
|
||
{
|
||
'targets': 8,
|
||
'searchable': false,
|
||
'className': 'dt-body-center',
|
||
'createdCell': function (td, cellData, rowData, row, col) {
|
||
$(td).empty();
|
||
|
||
if (cellData != null) {
|
||
var coordinate = cellData.split(',')
|
||
|
||
$(td).append(`<span>x：${parseFloat(coordinate[0])}, y：${parseFloat(coordinate[1])}</span><br>`);
|
||
$(td).append(`<a href="javascript:void(0)" class="device-coordinate-btn">修改座標</a>`);
|
||
} else {
|
||
$(td).append('<button class="btn btn-primary device-coordinate-btn">定位座標</button>');
|
||
}
|
||
}
|
||
}
|
||
],
|
||
//"order": [[2, "desc"]],
|
||
"ajax": {
|
||
"url": "/DeviceManage/DeviceTableList",
|
||
"type": "POST",
|
||
"data": function (d) {
|
||
d.building_tag = selected_building_menu.building_tag ? selected_building_menu.building_tag : "";
|
||
d.device_system_tag = selected_building_menu.main_system ? selected_building_menu.main_system.main_system_tag : "";
|
||
d.device_name_tag = selected_building_menu.main_system ? selected_building_menu.main_system.sub_system ? selected_building_menu.main_system.sub_system.sub_system_tag : "" : "";
|
||
d.device_floor_tag = selected_floor_tag ? selected_floor_tag : "";
|
||
},
|
||
"dataSrc": function (rel) {
|
||
if (rel.code == "9999") {
|
||
toast_error(rel.msg);
|
||
return;
|
||
}
|
||
|
||
currentData = rel.data;
|
||
|
||
currentData = $.map(currentData, function (item) {
|
||
|
||
if (item.device_name_tag == "L1" || item.device_name_tag == "L2") {
|
||
//照明設備
|
||
$("#device-master-list-btn").show();
|
||
deviceInfoTable.column(0).visible(true); //點擊顯示子節點
|
||
deviceInfoTable.column(8).visible(false); //設備座標
|
||
} else {
|
||
$("#device-master-list-btn").hide();
|
||
deviceInfoTable.column(0).visible(false); //點擊顯示子節點
|
||
deviceInfoTable.column(8).visible(true); //設備座標
|
||
}
|
||
|
||
|
||
item.selected = false;
|
||
if (item.device_coordinate != undefined && item.device_coordinate != null) {
|
||
var coordinate = item.device_coordinate.split(',')
|
||
item.value = [
|
||
parseFloat(coordinate[0]),
|
||
parseFloat(coordinate[1])
|
||
]
|
||
}
|
||
|
||
if (item.device_nodes != undefined && item.device_nodes != null && item.device_nodes.length > 0) {
|
||
$.map(item.device_nodes, function (item_node) {
|
||
item_node.selected = false;
|
||
if (item_node.device_node_coordinate != undefined && item_node.device_node_coordinate != null) {
|
||
var node_coordinate = item_node.device_node_coordinate.split(',')
|
||
item_node.value = [
|
||
parseFloat(node_coordinate[0]),
|
||
parseFloat(node_coordinate[1])
|
||
]
|
||
}
|
||
});
|
||
}
|
||
|
||
return item;
|
||
});
|
||
|
||
if (currentData == null || currentData.length == 0) {
|
||
this.currentData = [];
|
||
}
|
||
if (myChart.getOption() && myChart.getOption().geo && myChart.getOption().geo.length > 0) {
|
||
resetData();
|
||
}
|
||
|
||
return currentData;
|
||
}
|
||
}
|
||
});
|
||
//#endregion
|
||
|
||
deviceInfoTable.on('draw', function () {
|
||
$.each(selected_device_parents_collapses, function (i, id) {
|
||
var tr = $(`#${id}`)
|
||
var row = deviceInfoTable.row(tr);
|
||
if (!row.child.isShown()) {
|
||
$(`#${id}`).find("td.dt-control").trigger('click');
|
||
}
|
||
|
||
});
|
||
});
|
||
|
||
//#region 編輯設備
|
||
$('#device_info_table').on("click", "button.edit-btn", function () {
|
||
|
||
selected_device_guid = $(this).parents('tr').attr('data-guid');
|
||
|
||
//取得災害類別
|
||
var url_disaster = "/DeviceManage/GetDisasterList";
|
||
$.post(url_disaster, null, function (rel) {
|
||
if (rel.code != "0000") {
|
||
if (rel.code == "9999") {
|
||
toast_error(rel.msg);
|
||
}
|
||
else {
|
||
toast_warning(rel.msg);
|
||
}
|
||
return;
|
||
}
|
||
else {
|
||
|
||
var checkbox = "";
|
||
$('#disaster_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="selectDisaster[]" id="' + val.system_value + '" value="' + val.system_value + '" />';
|
||
checkbox += '<label class="custom-control-label" for="' + val.system_value + '">' + val.system_key + '</label>';
|
||
checkbox += '</div>';
|
||
});
|
||
$('#disaster_check').append(checkbox);
|
||
|
||
//取得單一設備基本資料
|
||
var url = "/DeviceManage/GetOneDevice";
|
||
|
||
var send_data = {
|
||
guid: selected_device_guid
|
||
}
|
||
|
||
$.post(url, send_data, function (rel) {
|
||
console.log(rel);
|
||
|
||
if (rel.code != "0000") {
|
||
if (rel.code == "9999") {
|
||
toast_error(rel.msg);
|
||
}
|
||
else {
|
||
toast_warning(rel.msg);
|
||
}
|
||
return;
|
||
}
|
||
else {
|
||
$("#device_building_name_modal").html(rel.data.building_full_name);
|
||
$("#device_main_system_name_modal").html(rel.data.main_system_full_name);
|
||
$("#device_sub_system_name_modal").html(rel.data.sub_system_full_name);
|
||
$("#device_floor_name_modal").html(rel.data.floor_full_name);
|
||
$("#device_number_modal").html(rel.data.device_number);
|
||
|
||
$("#device_name_modal").val(rel.data.device_full_name);
|
||
|
||
if (rel.data.device_system_category_layer3 == "L1" || rel.data.device_system_category_layer3 == "L2") {
|
||
$("#device-coordinate-wrap").hide();
|
||
} else {
|
||
$("#device-coordinate-wrap").show();
|
||
|
||
if (rel.data.device_coordinate != undefined && rel.data.device_coordinate != null) {
|
||
var coordinate = rel.data.device_coordinate.split(',')
|
||
|
||
$("#device_coordinate_x_modal").val(coordinate[0]);
|
||
$("#device_coordinate_y_modal").val(coordinate[1]);
|
||
} else {
|
||
$("#device_coordinate_x_modal").val("");
|
||
$("#device_coordinate_y_modal").val("");
|
||
}
|
||
}
|
||
|
||
rel.data.device_disasters.forEach(function (item, index) {
|
||
$(`input[name="selectDisaster[]"][value="${item.device_system_value}"]`).prop("checked", true)
|
||
});
|
||
|
||
if (rel.data.device_system_category_layer3 != "C") {
|
||
$("#device-ip-wrap").hide();
|
||
$("#device-port-wrap").hide();
|
||
}
|
||
else {
|
||
$("#device-ip-wrap").show();
|
||
$("#device-port-wrap").show();
|
||
|
||
$("#device_ip_modal").val(rel.data.device_ip);
|
||
$("#device_port_modal").val(rel.data.device_port);
|
||
}
|
||
|
||
$("#device-info-edit-modal").modal();
|
||
}
|
||
}, 'json');
|
||
}
|
||
});
|
||
});
|
||
//#endregion
|
||
|
||
//#region 刪除設備
|
||
$('#device_info_table').on("click", "button.del-btn", function () {
|
||
|
||
selected_device_guid = $(this).parents('tr').attr('data-guid');
|
||
|
||
Swal.fire(
|
||
{
|
||
title: "刪除",
|
||
text: "你確定是否刪除此筆資料?",
|
||
type: "warning",
|
||
icon: 'warning',
|
||
showCancelButton: true,
|
||
confirmButtonText: "是",
|
||
cancelButtonText: "否"
|
||
}).then(function (result) {
|
||
if (result.value) {
|
||
var url = "/DeviceManage/DeleteOneDevice";
|
||
var send_data = {
|
||
Guid: selected_device_guid
|
||
}
|
||
$.post(url, send_data, 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);
|
||
deviceInfoTable.ajax.reload(null, false);
|
||
return;
|
||
}
|
||
|
||
}, 'json');
|
||
}
|
||
});
|
||
});
|
||
//#endregion
|
||
|
||
//#region 編輯設備定位座標
|
||
$('#device_info_table').on("click", ".device-coordinate-btn", function () {
|
||
|
||
if ($(this).attr("disabled")) {
|
||
return;
|
||
}
|
||
|
||
selected_device_guid = $(this).parents('tr').attr('data-guid');
|
||
var index = currentData.findIndex(function (item) { return item.device_guid === selected_device_guid });
|
||
|
||
currentData[index].selected = true;
|
||
|
||
selected_temp_device = currentData[index];
|
||
|
||
ChangeFloorMapMode("edit");
|
||
});
|
||
//#endregion
|
||
|
||
//#region 編輯設備防災類別
|
||
$('#disaster_check').on("click", 'input[type="checkbox"]', function () {
|
||
|
||
var checked = $(this).val();
|
||
|
||
//console.log($('#disaster_check').find('input:checkbox:checked').length)
|
||
if ($('#disaster_check').find('input:checkbox:checked').length != 0) {
|
||
$('input[name="selectDisaster[]"]').prop('checked', false);
|
||
$('input[name="selectDisaster[]"]').map(function (index, item) {
|
||
var item_value = $(item).val();
|
||
|
||
if (item_value == checked) {
|
||
$(item).prop('checked', true)
|
||
}
|
||
});
|
||
}
|
||
|
||
|
||
|
||
});
|
||
//#endregion
|
||
|
||
//#region 設備Master DataTable
|
||
deviceMasterTable = $("#device_master_table").DataTable({
|
||
"columns": [
|
||
{
|
||
"data": null,
|
||
"render": function (data, type, row, meta) {
|
||
return meta.row + 1;
|
||
}
|
||
},
|
||
{
|
||
"data": "device_master_number",
|
||
"render": function (data, type, row, meta) {
|
||
if (data != undefined && data != null && data != "") {
|
||
return data;
|
||
} else {
|
||
return row.device_building_tag + "_" + row.device_name_tag;
|
||
}
|
||
}
|
||
},
|
||
{
|
||
"data": "device_master_full_name"
|
||
},
|
||
{
|
||
"data": "device_master_icon",
|
||
"render": function (data, type, row, meta) {
|
||
if (row.device_master_icon == undefined || row.device_master_icon == null || row.device_master_icon == '') {
|
||
return "";
|
||
}
|
||
var html = `<img src="/upload/device_icon/${row.device_master_icon}" style="margin: auto; width:30px;">
|
||
</img>`;
|
||
return html;
|
||
}
|
||
},
|
||
{
|
||
"data": null,
|
||
"defaultContent": '<button class="btn btn-primary edit-btn">修改</button>'
|
||
}
|
||
],
|
||
'createdRow': function (row, data, dataIndex) {
|
||
$(row).attr('data-guid', data.device_master_guid);
|
||
$(row).attr('data-device-building-tag', data.device_building_tag);
|
||
$(row).attr('data-device-name-tag', data.device_name_tag);
|
||
},
|
||
//"order": [[2, "desc"]],
|
||
"ajax": {
|
||
"url": "/DeviceManage/GetDeviceMasterTableList",
|
||
"type": "POST",
|
||
"data": function (d) {
|
||
d.Building_tag = selected_building_menu.building_tag ? selected_building_menu.building_tag : "";
|
||
d.Main_system_tag = selected_building_menu.main_system ? selected_building_menu.main_system.main_system_tag : "";
|
||
d.Sub_system_tag = selected_building_menu.main_system ? selected_building_menu.main_system.sub_system ? selected_building_menu.main_system.sub_system.sub_system_tag : "" : "";
|
||
d.Floor_tag = selected_floor_tag ? selected_floor_tag : "";
|
||
},
|
||
"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
|
||
|
||
//#region 分電盤按鈕
|
||
$("#device-master-list-btn").click(function (e) {
|
||
e.preventDefault();
|
||
|
||
var selectedBuilding_tag = selected_building_menu.building_tag ? selected_building_menu.building_tag : "";
|
||
var selectedMain_system_tag = selected_building_menu.main_system ? selected_building_menu.main_system.main_system_tag : "";
|
||
var selectedSub_system_tag = selected_building_menu.main_system ? selected_building_menu.main_system.sub_system ? selected_building_menu.main_system.sub_system.sub_system_tag : "" : "";
|
||
var selectedFloor_tag = selected_floor_tag ? selected_floor_tag : "";
|
||
if (selectedBuilding_tag == '' || selectedMain_system_tag == '' || selectedSub_system_tag == '' || selectedFloor_tag == '') {
|
||
toast_warning("請先選擇系統類別及樓層。");
|
||
return;
|
||
}
|
||
|
||
//取得設備master列表
|
||
deviceMasterTable.ajax.reload(null, false);
|
||
$("#device-master-list-modal").modal();
|
||
});
|
||
//#endregion
|
||
|
||
//#region 編輯設備master
|
||
$('#device_master_table').on("click", "button.edit-btn", function () {
|
||
|
||
selected_device_master_guid = $(this).parents('tr').attr('data-guid');
|
||
selected_device_building_tag = $(this).parents('tr').attr('data-device-building-tag');
|
||
selected_device_system_tag = "";
|
||
selected_device_floor_tag = "";
|
||
selected_device_name_tag = $(this).parents('tr').attr('data-device-name-tag');
|
||
selected_device_master_number_txt = $(this).parents('tr')[0].children[1].innerText
|
||
|
||
//取得單一設備基本資料
|
||
var url = "/DeviceManage/GetOneDeviceMaster";
|
||
|
||
var send_data = {
|
||
guid: selected_device_master_guid
|
||
}
|
||
|
||
$.post(url, send_data, function (rel) {
|
||
if (rel.code != "0000") {
|
||
if (rel.code == "9999") {
|
||
toast_error(rel.msg);
|
||
}
|
||
else {
|
||
toast_warning(rel.msg);
|
||
}
|
||
return;
|
||
}
|
||
else {
|
||
$("#device_master_number_modal").html(selected_device_master_number_txt);
|
||
if (rel.data != undefined && rel.data != null) {
|
||
$("#device_master_full_name_modal").val(rel.data.device_master_full_name);
|
||
}
|
||
|
||
$("#device-master-edit-modal").modal();
|
||
}
|
||
}, 'json');
|
||
});
|
||
//#endregion
|
||
|
||
//#region 展開子節點列表
|
||
$('#device_info_table').on("click", "td.dt-control", function () {
|
||
|
||
var tr = $(this).closest('tr');
|
||
var row = deviceInfoTable.row(tr);
|
||
|
||
var index = $.inArray(tr.attr('id'), selected_device_parents_collapses)
|
||
|
||
if (row.child.isShown()) {
|
||
// This row is already open - close it
|
||
row.child.hide();
|
||
tr.removeClass('shown');
|
||
tr.find("td").first().html(`<i class="fal fa-plus"></i>`);
|
||
|
||
selected_device_parents_collapses.splice(index, 1);
|
||
}
|
||
else {
|
||
// Open this row
|
||
console.log(row.data());
|
||
row.child(DeviceNodeFormat(row.data().device_nodes)).show();
|
||
tr.addClass('shown');
|
||
tr.find("td").first().html(`<i class="fal fa-minus"></i>`);
|
||
|
||
if (index < 0) {
|
||
selected_device_parents_collapses.push(tr.attr('id'))
|
||
}
|
||
|
||
}
|
||
});
|
||
//#endregion
|
||
|
||
//#region 子節點表格樣式
|
||
function DeviceNodeFormat(device_nodes) {
|
||
var tbody_content = "";
|
||
|
||
device_nodes.forEach(function (item, index) {
|
||
var coordinate_html = "";
|
||
if (item.device_node_coordinate != null) {
|
||
var coordinate = item.device_node_coordinate.split(',')
|
||
coordinate_html += `<span>x：${parseFloat(coordinate[0])}, y：${parseFloat(coordinate[1])}</span><br>
|
||
<a href="javascript:void(0)" class="device-node-coordinate-btn">修改座標</a>`;
|
||
} else {
|
||
coordinate_html += `<button class="btn btn-primary device-node-coordinate-btn">定位座標</button>`;
|
||
}
|
||
|
||
tbody_content += `
|
||
<tr data-device-node-guid="${item.device_node_guid}" data-device-guid="${item.device_guid}">
|
||
<td>
|
||
${index + 1}
|
||
</td>
|
||
<td>
|
||
${item.device_node_full_name}
|
||
</td>
|
||
<td>
|
||
${coordinate_html}
|
||
</td>
|
||
<td>
|
||
<button class="btn btn-primary edit-node-btn">修改</button>
|
||
<button class="btn btn-danger del-node-btn">刪除</button>
|
||
</td>
|
||
</tr>
|
||
`;
|
||
});
|
||
|
||
var html = "";
|
||
html = `<table class="table table-bordered table-hover m-0 text-center device-node-table">
|
||
<thead class="thead-themed">
|
||
<tr>
|
||
<th>序</th>
|
||
<th>名稱</th>
|
||
<th>座標</th>
|
||
<th>功能</th>
|
||
</tr>
|
||
</thead>
|
||
<tbody>
|
||
${tbody_content}
|
||
</tbody>
|
||
</table>`;
|
||
|
||
return html;
|
||
}
|
||
//#endregion
|
||
|
||
//#region 加入子節點
|
||
$('#device_info_table').on("click", "button.add-device-node-btn", function () {
|
||
|
||
selected_device_guid = $(this).parents('tr').attr('data-guid');
|
||
selected_device_node_guid = "";
|
||
|
||
$("#device-node-form").trigger("reset");
|
||
$("#device-node-modal").modal();
|
||
});
|
||
//#endregion
|
||
|
||
//#region 編輯子節點
|
||
$('#device_info_table').on("click", ".device-node-table button.edit-node-btn", function () {
|
||
|
||
selected_device_node_guid = $(this).parents('tr').attr('data-device-node-guid');
|
||
selected_device_guid = $(this).parents('tr').attr('data-device-guid');
|
||
|
||
//取得單一設備子節點資料
|
||
var url = "/DeviceManage/GetOneDeviceNode";
|
||
|
||
var send_data = {
|
||
guid: selected_device_node_guid
|
||
}
|
||
|
||
$.post(url, send_data, function (rel) {
|
||
if (rel.code != "0000") {
|
||
if (rel.code == "9999") {
|
||
toast_error(rel.msg);
|
||
}
|
||
else {
|
||
toast_warning(rel.msg);
|
||
}
|
||
return;
|
||
}
|
||
else {
|
||
$("#device_node_name_modal").val(rel.data.device_node_full_name);
|
||
|
||
if (rel.data.device_node_coordinate != undefined && rel.data.device_node_coordinate != null) {
|
||
var coordinate = rel.data.device_node_coordinate.split(',')
|
||
|
||
$("#device_node_coordinate_x_modal").val(coordinate[0]);
|
||
$("#device_node_coordinate_y_modal").val(coordinate[1]);
|
||
} else {
|
||
$("#device_node_coordinate_x_modal").val("");
|
||
$("#device_node_coordinate_y_modal").val("");
|
||
}
|
||
|
||
$("#device-node-modal").modal();
|
||
}
|
||
}, 'json');
|
||
});
|
||
//#endregion
|
||
|
||
//#region 編輯子節點定位座標
|
||
$('#device_info_table').on("click", ".device-node-table .device-node-coordinate-btn", function () {
|
||
|
||
if ($(this).attr("disabled")) {
|
||
return;
|
||
}
|
||
|
||
selected_device_guid = $(this).parents('tr').attr('data-device-guid');
|
||
selected_device_node_guid = $(this).parents('tr').attr('data-device-node-guid');
|
||
var index = currentData.findIndex(function (item) { return item.device_guid === selected_device_guid });
|
||
|
||
var node_index = currentData[index].device_nodes.findIndex(function (item) { return item.device_node_guid === selected_device_node_guid });
|
||
|
||
selected_temp_device = currentData[index].device_nodes[node_index];
|
||
|
||
ChangeFloorMapMode("edit");
|
||
});
|
||
//#endregion
|
||
|
||
//#region 刪除子節點
|
||
$('#device_info_table').on("click", ".device-node-table button.del-node-btn", function () {
|
||
|
||
selected_device_node_guid = $(this).parents('tr').attr('data-device-node-guid');
|
||
|
||
Swal.fire(
|
||
{
|
||
title: "刪除",
|
||
text: "你確定是否刪除此筆資料?",
|
||
type: "warning",
|
||
icon: 'warning',
|
||
showCancelButton: true,
|
||
confirmButtonText: "是",
|
||
cancelButtonText: "否"
|
||
}).then(function (result) {
|
||
if (result.value) {
|
||
var url = "/DeviceManage/DeleteOneDeviceNode";
|
||
var send_data = {
|
||
Guid: selected_device_node_guid
|
||
}
|
||
$.post(url, send_data, 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);
|
||
deviceInfoTable.ajax.reload(null, false);
|
||
return;
|
||
}
|
||
|
||
}, 'json');
|
||
}
|
||
});
|
||
});
|
||
//#endregion
|
||
|
||
//#region 設備種類DataTable
|
||
deviceKindTable = $("#device_kind_table").DataTable({
|
||
"columns": [
|
||
{
|
||
"data": null,
|
||
"render": function (data, type, row, meta) {
|
||
return meta.row + 1;
|
||
}
|
||
},
|
||
{
|
||
"data": null,
|
||
"render": function (data, type, row, meta) {
|
||
return data.device_system_tag == "S" && data.device_name_tag == "C" ? data.device_model_tag : data.device_name_tag;
|
||
}
|
||
},
|
||
{
|
||
"data": "device_image",
|
||
"render": function (data, type, row, meta) {
|
||
if (row.device_image == undefined || row.device_image == null || row.device_image == '') {
|
||
return "";
|
||
}
|
||
var file_names = row.device_image.split(".");
|
||
var html = `<img src="/upload/device_icon/${row.device_image}" style="margin: auto; width:45px; height: auto">
|
||
</img>`;
|
||
return html;
|
||
}
|
||
},
|
||
{
|
||
"data": "device_normal_color",
|
||
"render": function (data, type, row, meta) {
|
||
|
||
var device_normal_text = row.device_normal_text ? row.device_normal_text : "";
|
||
var device_normal_point_name = row.device_normal_point_name ? row.device_normal_point_name : "";
|
||
var device_normal_point_col = row.device_normal_point_col ? row.device_normal_point_col : "";
|
||
var device_normal_point_value = row.device_normal_point_value ? row.device_normal_point_value : "";
|
||
var device_normal_color = row.device_normal_color ? row.device_normal_color : "";
|
||
var flashing = row.device_normal_flashing == 1 ? "是" : "否";
|
||
|
||
var full_point_arr = [];
|
||
if (device_normal_point_name != "") {
|
||
full_point_arr.push(device_normal_point_name)
|
||
}
|
||
if (device_normal_point_col != "") {
|
||
full_point_arr.push(device_normal_point_col)
|
||
}
|
||
if (device_normal_point_value != "") {
|
||
full_point_arr.push(device_normal_point_value)
|
||
}
|
||
|
||
var html = `
|
||
<div class="row">
|
||
<label class="col-12">${device_normal_text}</label>
|
||
</div>
|
||
<div class="row">
|
||
<label class="col-12">${full_point_arr.join("-")}</label>
|
||
</div>
|
||
<div class="row">
|
||
<div style="width: 30px;height: 30px; margin:auto; border-radius: 50%;background-color: ${device_normal_color}"></div>
|
||
</div>
|
||
@*<div class="row">
|
||
<label class="col-8">是否閃爍：</label>
|
||
<label class="col-4">${flashing}</label>
|
||
</div>*@
|
||
`;
|
||
return html;
|
||
}
|
||
},
|
||
{
|
||
"data": "device_close_color",
|
||
"render": function (data, type, row, meta) {
|
||
|
||
var device_close_text = row.device_close_text ? row.device_close_text : "";
|
||
var device_close_point_name = row.device_close_point_name ? row.device_close_point_name : "";
|
||
var device_close_point_col = row.device_close_point_col ? row.device_close_point_col : "";
|
||
var device_close_point_value = row.device_close_point_value ? row.device_close_point_value : "";
|
||
var device_close_color = row.device_close_color ? row.device_close_color : "";
|
||
var flashing = row.device_normal_flashing == 1 ? "是" : "否";
|
||
|
||
var full_point_arr = [];
|
||
if (device_close_point_name != "") {
|
||
full_point_arr.push(device_close_point_name)
|
||
}
|
||
if (device_close_point_col != "") {
|
||
full_point_arr.push(device_close_point_col)
|
||
}
|
||
if (device_close_point_value != "") {
|
||
full_point_arr.push(device_close_point_value)
|
||
}
|
||
|
||
var html = `
|
||
<div class="row">
|
||
<label class="col-12">${device_close_text}</label>
|
||
</div>
|
||
<div class="row">
|
||
<label class="col-12">${full_point_arr.join("-")}</label>
|
||
</div>
|
||
<div class="row">
|
||
<div style="width: 30px;height: 30px; margin:auto; border-radius: 50%;background-color: ${device_close_color}"></div>
|
||
</div>
|
||
@*<div class="row">
|
||
<label class="col-8">是否閃爍：</label>
|
||
<label class="col-4">${flashing}</label>
|
||
</div>*@
|
||
`;
|
||
return html;
|
||
}
|
||
},
|
||
{
|
||
"data": "device_error_color",
|
||
"render": function (data, type, row, meta) {
|
||
|
||
var device_error_text = row.device_error_text ? row.device_error_text : "";
|
||
var device_error_point_name = row.device_error_point_name ? row.device_error_point_name : "";
|
||
var device_error_point_col = row.device_error_point_col ? row.device_error_point_col : "";
|
||
var device_error_point_value = row.device_error_point_value ? row.device_error_point_value : "";
|
||
var device_error_color = row.device_error_color ? row.device_error_color : "";
|
||
var flashing = row.device_error_flashing == 1 ? "是" : "否";
|
||
var independent = row.device_error_independent == 1 ? "是" : "否";
|
||
|
||
var full_point_arr = [];
|
||
if (device_error_point_name != "") {
|
||
full_point_arr.push(device_error_point_name)
|
||
}
|
||
if (device_error_point_col != "") {
|
||
full_point_arr.push(device_error_point_col)
|
||
}
|
||
if (device_error_point_value != "") {
|
||
full_point_arr.push(device_error_point_value)
|
||
}
|
||
|
||
var html = `
|
||
<div class="row">
|
||
<label class="col-12">${device_error_text}</label>
|
||
</div>
|
||
<div class="row">
|
||
<label class="col-12">${full_point_arr.join("-")}</label>
|
||
</div>
|
||
<div class="row">
|
||
<div style="width: 30px;height: 30px; margin:auto; border-radius: 50%;background-color: ${device_error_color}"></div>
|
||
</div>
|
||
<div class="row">
|
||
<label class="col-8">是否閃爍：</label>
|
||
<label class="col-4">${flashing}</label>
|
||
</div>
|
||
@*<div class="row">
|
||
<label class="col-8">是否獨立顯示：</label>
|
||
<label class="col-4">${independent}</label>
|
||
</div>*@
|
||
`;
|
||
return html;
|
||
}
|
||
},
|
||
{
|
||
"data": null,
|
||
"defaultContent": '<button class="btn btn-primary edit-btn">修改</button>'
|
||
}
|
||
],
|
||
'createdRow': function (row, data, dataIndex) {
|
||
$(row).attr('data-guid', data.device_kind_guid);
|
||
$(row).attr('data-device-building-tag', data.device_building_tag);
|
||
$(row).attr('data-device-system-tag', data.device_system_tag);
|
||
$(row).attr('data-device-floor-tag', data.device_floor_tag);
|
||
$(row).attr('data-device-name-tag', data.device_name_tag);
|
||
},
|
||
//"order": [[2, "desc"]],
|
||
"ajax": {
|
||
"url": "/DeviceManage/DeviceKindTableList",
|
||
"type": "POST",
|
||
"data": function (d) {
|
||
d.building_tag = selected_building_menu.building_tag ? selected_building_menu.building_tag : "";
|
||
d.device_system_tag = selected_building_menu.main_system ? selected_building_menu.main_system.main_system_tag : "";
|
||
d.device_name_tag = selected_building_menu.main_system ? selected_building_menu.main_system.sub_system ? selected_building_menu.main_system.sub_system.sub_system_tag : "" : "";
|
||
//d.Floor_tag = selected_floor_tag ? selected_floor_tag : "";
|
||
},
|
||
"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
|
||
|
||
//#region 編輯設備種類
|
||
$('#device_kind_table').on("click", "button.edit-btn", function () {
|
||
|
||
selected_device_kind_guid = $(this).parents('tr').attr('data-guid');
|
||
selected_device_building_tag = $(this).parents('tr').attr('data-device-building-tag');
|
||
selected_device_system_tag = $(this).parents('tr').attr('data-device-system-tag');
|
||
selected_device_floor_tag = $(this).parents('tr').attr('data-device-floor-tag');
|
||
selected_device_name_tag = $(this).parents('tr').attr('data-device-name-tag');
|
||
selected_device_name_tag_txt = $(this).parents('tr')[0].children[1].innerText
|
||
|
||
//取得單一設備基本資料
|
||
var url = "/DeviceManage/GetOneDeviceKind";
|
||
|
||
var send_data = {
|
||
guid: selected_device_kind_guid
|
||
}
|
||
|
||
$.post(url, send_data, function (rel) {
|
||
if (rel.code != "0000") {
|
||
if (rel.code == "9999") {
|
||
toast_error(rel.msg);
|
||
}
|
||
else {
|
||
toast_warning(rel.msg);
|
||
}
|
||
return;
|
||
}
|
||
else {
|
||
device_kind_data = rel.data;
|
||
|
||
//取得單一設備基本資料
|
||
var selectedSub_system_tag = selected_building_menu.main_system ? selected_building_menu.main_system.sub_system ? selected_building_menu.main_system.sub_system.sub_system_tag : "" : "";
|
||
var url = "/DeviceManage/GetDeviceItem";
|
||
var send_data = {
|
||
sub_system_tag: selectedSub_system_tag,
|
||
building_tag: selected_device_building_tag
|
||
}
|
||
|
||
$.post(url, send_data, function (rel) {
|
||
if (rel.code != "0000") {
|
||
if (rel.code == "9999") {
|
||
toast_error(rel.msg);
|
||
}
|
||
else {
|
||
toast_warning(rel.msg);
|
||
}
|
||
return;
|
||
}
|
||
else {
|
||
$('#device_image_modal').val("");
|
||
|
||
$("#device_normal_point_name_modal").empty();
|
||
$("#device_close_point_name_modal").empty();
|
||
$("#device_error_point_name_modal").empty();
|
||
$("#device_normal_point_name_modal").append($("<option />").val("").text("未選擇"));
|
||
$("#device_close_point_name_modal").append($("<option />").val("").text("未選擇"));
|
||
$("#device_error_point_name_modal").append($("<option />").val("").text("未選擇"));
|
||
$.each(rel.data, function (index, val) {
|
||
$("#device_normal_point_name_modal").append($("<option />").val(val.id).text(val.points));
|
||
$("#device_close_point_name_modal").append($("<option />").val(val.id).text(val.points));
|
||
$("#device_error_point_name_modal").append($("<option />").val(val.id).text(val.points));
|
||
});
|
||
|
||
|
||
$("#device_kind_name_modal").html(selected_device_name_tag_txt);
|
||
if (device_kind_data != null) {
|
||
$("#device_normal_text_modal").val(device_kind_data.device_normal_text ? device_kind_data.device_normal_text : "");
|
||
|
||
var normal_point_name = device_kind_data.device_normal_point_guid ? device_kind_data.device_normal_point_guid : "";
|
||
var normal_point_col = device_kind_data.device_normal_point_col ? device_kind_data.device_normal_point_col : "";
|
||
var normal_point_value = device_kind_data.device_normal_point_value ? device_kind_data.device_normal_point_value : "";
|
||
|
||
$("#device_normal_point_name_modal").val(normal_point_name);
|
||
$("#device_normal_point_col_modal").val(normal_point_col);
|
||
$("#device_normal_point_value_modal").val(normal_point_value);
|
||
if (normal_point_name != undefined && normal_point_name != null) {
|
||
var normal_point_text = $("#device_normal_point_name_modal option:selected").text();
|
||
if (normal_point_name == "" || normal_point_text == "ER") {
|
||
$("#device_normal_point_col_modal").val("").attr("disabled", true);
|
||
$("#device_normal_point_value_modal").val("").attr("disabled", true);
|
||
} else {
|
||
$("#device_normal_point_col_modal").val(normal_point_col).attr("disabled", false);
|
||
$("#device_normal_point_value_modal").val(normal_point_value).attr("disabled", false);
|
||
}
|
||
} else {
|
||
$("#device_normal_point_col_modal").val("").attr("disabled", true);
|
||
$("#device_normal_point_value_modal").val("").attr("disabled", true);
|
||
}
|
||
|
||
$("#device_normal_color_modal").val(device_kind_data.device_normal_color ? device_kind_data.device_normal_color : "");
|
||
|
||
if (device_kind_data.device_name_tag != undefined && device_kind_data.device_name_tag != null && device_kind_data.device_normal_flashing == 1) {
|
||
$("#device_normal_flashing_modal").prop("checked", true);
|
||
}
|
||
else {
|
||
$("#device_normal_flashing_modal").prop("checked", false);
|
||
}
|
||
|
||
$("#device_close_text_modal").val(device_kind_data.device_close_text ? device_kind_data.device_close_text : "");
|
||
|
||
var close_point_name = device_kind_data.device_close_point_guid ? device_kind_data.device_close_point_guid : "";
|
||
var close_point_col = device_kind_data.device_close_point_col ? device_kind_data.device_close_point_col : "";
|
||
var close_point_value = device_kind_data.device_close_point_value ? device_kind_data.device_close_point_value : "";
|
||
|
||
$("#device_close_point_name_modal").val(close_point_name);
|
||
$("#device_close_point_col_modal").val(close_point_col);
|
||
$("#device_close_point_value_modal").val(close_point_value);
|
||
if (close_point_name != undefined && close_point_name != null) {
|
||
var close_point_text = $("#device_close_point_name_modal option:selected").text();
|
||
if (close_point_name == "" || close_point_text == "ER") {
|
||
$("#device_close_point_col_modal").val("").attr("disabled", true);
|
||
$("#device_close_point_value_modal").val("").attr("disabled", true);
|
||
} else {
|
||
$("#device_close_point_col_modal").val(close_point_col).attr("disabled", false);
|
||
$("#device_close_point_value_modal").val(close_point_value).attr("disabled", false);
|
||
}
|
||
} else {
|
||
$("#device_close_point_col_modal").val("").attr("disabled", true);
|
||
$("#device_close_point_value_modal").val("").attr("disabled", true);
|
||
}
|
||
|
||
$("#device_close_color_modal").val(device_kind_data.device_close_color ? device_kind_data.device_close_color : "");
|
||
|
||
if (device_kind_data.device_name_tag != undefined && device_kind_data.device_name_tag != null && device_kind_data.device_close_flashing == 1) {
|
||
$("#device_close_flashing_modal").prop("checked", true);
|
||
}
|
||
else {
|
||
$("#device_close_flashing_modal").prop("checked", false);
|
||
}
|
||
|
||
$("#device_error_text_modal").val(device_kind_data.device_error_text ? device_kind_data.device_error_text : "");
|
||
|
||
var error_point_name = device_kind_data.device_error_point_guid ? device_kind_data.device_error_point_guid : "";
|
||
var error_point_col = device_kind_data.device_error_point_col ? device_kind_data.device_error_point_col : "";
|
||
var error_point_value = device_kind_data.device_error_point_value ? device_kind_data.device_error_point_value : "";
|
||
$("#device_error_point_name_modal").val(error_point_name);
|
||
$("#device_error_point_col_modal").val(error_point_col);
|
||
$("#device_error_point_value_modal").val(error_point_value);
|
||
if (error_point_name != undefined && error_point_name != null) {
|
||
var error_point_text = $("#device_error_point_name_modal option:selected").text();
|
||
if (error_point_name == "" || error_point_text == "ER") {
|
||
$("#device_error_point_col_modal").val("").attr("disabled", true);
|
||
$("#device_error_point_value_modal").val("").attr("disabled", true);
|
||
} else {
|
||
$("#device_error_point_col_modal").val(error_point_col).attr("disabled", false);
|
||
$("#device_error_point_value_modal").val(error_point_value).attr("disabled", false);
|
||
}
|
||
} else {
|
||
$("#device_error_point_col_modal").val("").attr("disabled", true);
|
||
$("#device_error_point_value_modal").val("").attr("disabled", true);
|
||
}
|
||
|
||
$("#device_error_color_modal").val(device_kind_data.device_error_color ? device_kind_data.device_error_color : "");
|
||
|
||
if (device_kind_data.device_name_tag != undefined && device_kind_data.device_name_tag != null && device_kind_data.device_error_flashing == 1) {
|
||
$("#device_error_flashing_modal").prop("checked", true);
|
||
}
|
||
else {
|
||
$("#device_error_flashing_modal").prop("checked", false);
|
||
}
|
||
|
||
if (device_kind_data.device_name_tag != undefined && device_kind_data.device_name_tag != null && device_kind_data.device_error_independent == 1) {
|
||
$("#device_error_independent_modal").prop("checked", true);
|
||
}
|
||
else {
|
||
$("#device_error_independent_modal").prop("checked", false);
|
||
}
|
||
}
|
||
else {
|
||
//Reset Form
|
||
$('#device_image_modal').val("");
|
||
$('#device_normal_text_modal').val("");
|
||
$('#device_normal_point_name_modal').val("");
|
||
$('#device_normal_point_col_modal').val("");
|
||
$('#device_normal_point_value_modal').val("");
|
||
$('#device_normal_color_modal').val("");
|
||
$('#device_normal_flashing_modal').prop("checked", false);
|
||
|
||
$('#device_close_text_modal').val("");
|
||
$('#device_close_point_name_modal').val("");
|
||
$('#device_close_point_col_modal').val("");
|
||
$('#device_close_point_value_modal').val("");
|
||
$('#device_close_color_modal').val("");
|
||
$('#device_close_flashing_modal').prop("checked", false);
|
||
|
||
$('#device_error_text_modal').val("");
|
||
$('#device_error_point_name_modal').val("");
|
||
$('#device_error_point_col_modal').val("");
|
||
$('#device_error_point_value_modal').val("");
|
||
$('#device_error_color_modal').val("");
|
||
$('#device_error_flashing_modal').prop("checked", false);
|
||
$('#device_error_independent_modal').prop("checked", false);
|
||
}
|
||
|
||
$("#device-kind-modal").modal();
|
||
}
|
||
}, 'json')
|
||
}
|
||
}, 'json');
|
||
});
|
||
//#endregion
|
||
|
||
//#region 設備種類燈號判別
|
||
$("#device_normal_point_name_modal").change(function () {
|
||
var point_name_value = $(this).val();
|
||
var point_name_text = $(this).find("option:selected").text();
|
||
|
||
if (point_name_value == "" || point_name_text == "ER") {
|
||
$("#device_normal_point_col_modal").val("").attr("disabled", true);
|
||
$("#device_normal_point_value_modal").val("").attr("disabled", true);
|
||
} else if (point_name_text != "ER") {
|
||
$("#device_normal_point_col_modal").attr("disabled", false);
|
||
$("#device_normal_point_value_modal").attr("disabled", false);
|
||
$("#device_close_point_name_modal").val(point_name_value).trigger("change");
|
||
}
|
||
});
|
||
|
||
$("#device_close_point_name_modal").change(function () {
|
||
var point_name_value = $(this).val();
|
||
var point_name_text = $(this).find("option:selected").text();
|
||
|
||
if (point_name_value == "" || point_name_text == "ER") {
|
||
$("#device_close_point_col_modal").val("").attr("disabled", true);
|
||
$("#device_close_point_value_modal").val("").attr("disabled", true);
|
||
} else if (point_name_text != "ER") {
|
||
$("#device_close_point_col_modal").attr("disabled", false);
|
||
$("#device_close_point_value_modal").attr("disabled", false);
|
||
$("#device_normal_point_name_modal").val(point_name_value).trigger("change");
|
||
}
|
||
});
|
||
|
||
$("#device_error_point_name_modal").change(function () {
|
||
var point_name_value = $(this).val()
|
||
var point_name_text = $(this).find("option:selected").text();
|
||
|
||
if (point_name_value == "" || point_name_text == "ER") {
|
||
$("#device_error_point_col_modal").val("").attr("disabled", true);
|
||
$("#device_error_point_value_modal").val("").attr("disabled", true);
|
||
} else if (point_name_text != "ER") {
|
||
$("#device_error_point_col_modal").attr("disabled", false);
|
||
$("#device_error_point_value_modal").attr("disabled", false);
|
||
}
|
||
});
|
||
//#endregion
|
||
|
||
//#region 新增設備基本資料DataTable
|
||
deviceImportCheckTempTable = $("#device_import_check_temp_table").DataTable({
|
||
"pageLength": 20,
|
||
"columns": [
|
||
{
|
||
"data": null,
|
||
},
|
||
{
|
||
"data": null,
|
||
"render": function (data, type, row, meta) {
|
||
return meta.row + 1;
|
||
}
|
||
},
|
||
{
|
||
"data": "device_number"
|
||
},
|
||
{
|
||
"data": null,
|
||
"render": function (data, type, row, meta) {
|
||
return row.device_name_tag + '_' + row.device_serial_tag;
|
||
}
|
||
},
|
||
{
|
||
"data": "device_disaster_type_text",
|
||
},
|
||
],
|
||
"columnDefs": [{
|
||
'targets': 0,
|
||
'searchable': false,
|
||
'orderable': false,
|
||
'className': 'dt-body-center',
|
||
'render': function (data, type, full, meta) {
|
||
var check_html = "";
|
||
check_html += `<div class="custom-control custom-checkbox">
|
||
<input type="checkbox" class="custom-control-input" id="${data.device_number}" name="selectedDevice[]" value="${data.device_number}" data-system-category="${data.device_system_category_layer3}" data-device-disaster="${data.device_disasters}" />
|
||
<label class="custom-control-label" for="${data.device_number}"/>
|
||
</div>`;
|
||
return check_html;
|
||
}
|
||
}],
|
||
"order": [[1, "asc"]],
|
||
"ajax": {
|
||
"url": "/DeviceManage/DeviceImportCheckTempTableList",
|
||
"type": "POST",
|
||
"data": function (d) {
|
||
d.Device_building_tag = selected_building_tag ? selected_building_tag : "";
|
||
d.Device_system_tag = selected_system_tag ? selected_system_tag : "";
|
||
d.Device_floor_tag = selected_floor_tag ? selected_floor_tag : "";
|
||
d.Device_name_tag = selected_name_tag ? selected_name_tag : "";
|
||
},
|
||
"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
|
||
|
||
//#region 新增設備基本資料全選
|
||
$("#select-all-device-number").change(function () {
|
||
|
||
var rows = deviceImportCheckTempTable.rows({ 'search': 'applied' }).nodes();
|
||
|
||
if (this.checked) {
|
||
$('input[type="checkbox"]', rows).prop('checked', this.checked);
|
||
} else {
|
||
$('input[type="checkbox"]', rows).prop('checked', this.checked);
|
||
}
|
||
});
|
||
//#endregion
|
||
});
|
||
|
||
//#region 建置左側選單列表
|
||
function GetBuildingMenuCollapse(filter) {
|
||
var url = "/DeviceManage/GetBuildingMenuCollapse";
|
||
|
||
var send_data = {
|
||
Filter: filter
|
||
}
|
||
|
||
$.post(url, send_data, function (rel) {
|
||
if (rel.code != "0000") {
|
||
if (rel.code == "9999") {
|
||
toast_error(rel.msg);
|
||
}
|
||
else {
|
||
toast_warning(rel.msg);
|
||
}
|
||
return;
|
||
}
|
||
else {
|
||
buildingCollapses = rel.data;
|
||
|
||
$("#js_list_accordion").empty();
|
||
|
||
if (buildingCollapses == undefined && buildingCollapses.length <= 0) {
|
||
$('#js_list_accordion').append("<div>查無結果</div>");
|
||
}
|
||
|
||
var html = '';
|
||
|
||
buildingCollapses.forEach(function (buildingCollapse, buildingCollapse_index) {
|
||
html += `
|
||
<div class="card border-top-left-radius-0 border-top-right-radius-0">
|
||
<div class="card-header">
|
||
<a href="javascript:void(0);" class="card-title collapsed" data-toggle="collapse" data-target="#js_list_accordion-${buildingCollapse_index}" aria-expanded="false" data-filter-tags="settings">
|
||
<i class="fal fa-globe width-2 fs-xl"></i>
|
||
${buildingCollapse.full_name}
|
||
<span class="ml-auto">
|
||
<span class="collapsed-reveal">
|
||
<i class="fal fa-chevron-up fs-xl"></i>
|
||
</span>
|
||
<span class="collapsed-hidden">
|
||
<i class="fal fa-chevron-down fs-xl"></i>
|
||
</span>
|
||
</span>
|
||
</a>
|
||
</div>
|
||
<div id="js_list_accordion-${buildingCollapse_index}" class="collapse" data-parent="#js_list_accordion" style="">`;
|
||
|
||
buildingCollapse.main_systems.forEach(function (main_system, main_system_index) {
|
||
html += `
|
||
<div id="cp-${main_system_index}" class="card py-3">
|
||
<div class="card-header pl-4 pr-3 d-flex justify-content-between">
|
||
<a href="javascript:;" class="" data-toggle="collapse" data-target="#cp-${main_system_index} > .card-body" aria-expanded="true">
|
||
<span class="collapsed-hidden"><h4 class="font-weight-bold"><i class="fal fa-charging-station"></i> ${main_system.full_name} <i class="fal fa-chevron-down fs-xl"></i></h4></span>
|
||
<span class="collapsed-reveal"><h4 class="font-weight-bold"><i class="fal fa-charging-station"></i> ${main_system.full_name} <i class="fal fa-chevron-up fs-xl"></i></h4></span>
|
||
</a>
|
||
</div>
|
||
<div class="card-body p-0 collapse show">
|
||
<div class="p-0">
|
||
<ul class="list-group list-group-flush">
|
||
`;
|
||
|
||
main_system.sub_systems.forEach(function (sub_system, sub_Systems_index) {
|
||
html += `
|
||
<li class="list-group-item pr-0 d-flex justify-content-between">
|
||
<a href="javascript:;" onclick="ChangeFloorPanel(this)"
|
||
data-building-tag="${buildingCollapse.building_tag}"
|
||
data-main-system-tag="${main_system.main_system_tag}"
|
||
data-sub-system-tag="${sub_system.sub_system_tag}">
|
||
${sub_system.full_name}
|
||
</a>
|
||
</li>`;
|
||
});
|
||
|
||
html += `
|
||
</ul>
|
||
</div>
|
||
</div>
|
||
</div>`;
|
||
});
|
||
|
||
html += ` </div>
|
||
</div>`;
|
||
});
|
||
|
||
$('#js_list_accordion').append(html);
|
||
|
||
$("#js_list_accordion .collapse").collapse('show');
|
||
|
||
return;
|
||
}
|
||
|
||
}, 'json');
|
||
}
|
||
//#endregion
|
||
|
||
//#region 變更樓層的控制面板
|
||
function ChangeFloorPanel(dom) {
|
||
|
||
var selected_target = {
|
||
"building_tag": $(dom).attr("data-building-tag") ? $(dom).attr("data-building-tag") : "",
|
||
"main_system_tag": $(dom).attr("data-main-system-tag") ? $(dom).attr("data-main-system-tag") : "",
|
||
"sub_system_tag": $(dom).attr("data-sub-system-tag") ? $(dom).attr("data-sub-system-tag") : "",
|
||
}
|
||
|
||
buildingCollapses.forEach(function (building_item, building_index) {
|
||
if (building_item.building_tag == selected_target.building_tag) {
|
||
selected_building_menu.building_tag = building_item.building_tag;
|
||
selected_building_menu.main_system = {};
|
||
|
||
building_item.main_systems.forEach(function (main_system_item, main_system_index) {
|
||
if (main_system_item.main_system_tag == selected_target.main_system_tag) {
|
||
selected_building_menu.main_system.main_system_tag = main_system_item.main_system_tag
|
||
selected_building_menu.main_system.sub_system = {};
|
||
|
||
$("#select-main-system-name").html(main_system_item.full_name);
|
||
|
||
main_system_item.sub_systems.forEach(function (sub_system_item, sub_system_index) {
|
||
if (sub_system_item.sub_system_tag == selected_target.sub_system_tag) {
|
||
selected_building_menu.main_system.sub_system.sub_system_tag = sub_system_item.sub_system_tag
|
||
selected_building_menu.main_system.sub_system.floors = sub_system_item.floors;
|
||
|
||
$("#select-sub-system-name").html(sub_system_item.full_name);
|
||
|
||
//匯入floor panel
|
||
$(".floor-panel-wrap").empty();
|
||
sub_system_item.floors.forEach(function (floor_item, floor_index) {
|
||
$(".floor-panel-wrap").append(`<button type="button" class="btn btn-secondary waves-effect waves-themed mr-2 mb-2 btn-floor" onclick="ChangeDevicePanel(this)" data-floor-guid="${floor_item.floor_tag}">${floor_item.full_name}</button>`)
|
||
});
|
||
}
|
||
});
|
||
}
|
||
});
|
||
}
|
||
});
|
||
|
||
$(".btn-floor").first().click();
|
||
}
|
||
//#endregion
|
||
|
||
//#region 變更平面圖與設備的控制面板
|
||
function ChangeDevicePanel(dom) {
|
||
|
||
selected_floor_tag = $(dom).attr("data-floor-guid") ? $(dom).attr("data-floor-guid") : ""
|
||
|
||
var current_floor = selected_building_menu.main_system.sub_system.floors.filter(function (item) {
|
||
return item.floor_tag == selected_floor_tag
|
||
})[0];
|
||
|
||
$.each($(".btn-floor"), function (index, item) {
|
||
if ($(item).hasClass("btn-success")) {
|
||
$(item).removeClass("btn-success");
|
||
$(item).addClass("btn-secondary");
|
||
}
|
||
});
|
||
|
||
$(dom).hasClass("btn-secondary") ? $(dom).removeClass("btn-secondary").addClass("btn-success") : $(dom).addClass("btn-success");
|
||
|
||
deviceInfoTable.ajax.reload(null, false);
|
||
deviceKindTable.ajax.reload(null, false);
|
||
|
||
ChangeFloorMapMode("");
|
||
|
||
//#region 平面圖設定
|
||
myChart.clear();
|
||
$.get(`/upload/floor_map/${current_floor.floor_map_name}.svg`, function (svg) {
|
||
|
||
if (svg == undefined || svg == null) {
|
||
return;
|
||
}
|
||
|
||
echarts.registerMap('floor_svg', { svg: svg });
|
||
|
||
option = {
|
||
// animationDurationUpdate: 1500,
|
||
tooltip: {
|
||
formatter: function (params) {
|
||
if (params.data.device_node_guid != undefined && params.data.device_node_guid != null && params.data.device_node_guid != "") {
|
||
return `名稱：${params.data.device_node_full_name}<br>
|
||
Guid：${params.data.device_node_guid}`
|
||
}
|
||
else {
|
||
return `名稱：${params.data.device_full_name}<br>
|
||
Guid：${params.data.device_guid}`
|
||
}
|
||
}
|
||
},
|
||
toolbox: { //工具欄
|
||
show: false
|
||
},
|
||
geo: {
|
||
map: 'floor_svg',
|
||
roam: true,
|
||
scaleLimit: { //限制放大縮小倍數
|
||
max: 32,
|
||
min: 2.5
|
||
},
|
||
layoutSize: '100%',
|
||
layoutCenter: ['50%', '50%'],
|
||
zoom: 2.5,
|
||
silent: true
|
||
},
|
||
series: [
|
||
{ //不管有無被選擇(圓點)
|
||
type: 'scatter',
|
||
coordinateSystem: 'geo',
|
||
geoIndex: 0,
|
||
symbol: 'circle',
|
||
symbolSize: 10,
|
||
symbolOffset: [10, 10],
|
||
label: {
|
||
show: false
|
||
},
|
||
data: currentData,
|
||
z: 2
|
||
},
|
||
{ //未選擇的設備(icon)
|
||
type: 'scatter',
|
||
coordinateSystem: 'geo',
|
||
geoIndex: 0,
|
||
symbolSize: 30,
|
||
label: {
|
||
formatter: '{b}',
|
||
position: 'bottom',
|
||
show: true,
|
||
backgroundColor: 'orange'
|
||
},
|
||
emphasis: {
|
||
label: {
|
||
show: true,
|
||
fontSize: '20',
|
||
fontWeight: 'bold',
|
||
color: 'yellow'
|
||
}
|
||
},
|
||
selectedMode: 'single',
|
||
data: null,
|
||
z: 1
|
||
},
|
||
{ //被選擇的設備(icon)
|
||
type: 'effectScatter',
|
||
coordinateSystem: 'geo',
|
||
geoIndex: 0,
|
||
showEffectOn: 'render',
|
||
symbolSize: 30,
|
||
label: {
|
||
formatter: '{b}',
|
||
position: 'bottom',
|
||
show: true,
|
||
backgroundColor: 'orange'
|
||
},
|
||
emphasis: {
|
||
label: {
|
||
show: true,
|
||
fontSize: '20',
|
||
fontWeight: 'bold',
|
||
color: 'yellow'
|
||
}
|
||
},
|
||
selectedMode: 'single',
|
||
data: null,
|
||
z: 1
|
||
},
|
||
{ //編輯模式底下的設備(圓點，只會有一個)
|
||
type: 'scatter',
|
||
coordinateSystem: 'geo',
|
||
geoIndex: 0,
|
||
symbol: 'circle',
|
||
symbolSize: 10,
|
||
symbolOffset: [10, 10],
|
||
label: {
|
||
show: false
|
||
},
|
||
data: currentData,
|
||
z: 2
|
||
},
|
||
{ //編輯模式底下的設備(icon，只會有一個)
|
||
type: 'scatter',
|
||
coordinateSystem: 'geo',
|
||
geoIndex: 0,
|
||
symbolSize: 30,
|
||
label: {
|
||
formatter: '{b}',
|
||
position: 'bottom',
|
||
show: true,
|
||
backgroundColor: 'orange'
|
||
},
|
||
emphasis: {
|
||
label: {
|
||
show: true,
|
||
fontSize: '20',
|
||
fontWeight: 'bold',
|
||
color: 'yellow'
|
||
}
|
||
},
|
||
data: null,
|
||
z: 1
|
||
},
|
||
],
|
||
};
|
||
|
||
myChart.setOption(option);
|
||
|
||
myChart.getZr().on('click', function (params) {
|
||
console.log("click", params);
|
||
var pixelPoint = [params.offsetX, params.offsetY];
|
||
var dataPoint = myChart.convertFromPixel({ geoIndex: 0 }, pixelPoint);
|
||
console.log(dataPoint);
|
||
|
||
if (floor_map_mode == "edit") {
|
||
|
||
temp_device_on_floor_map = [{
|
||
device_guid: selected_temp_device.device_guid,
|
||
device_full_name: selected_temp_device.device_full_name,
|
||
device_node_guid: selected_temp_device.device_node_guid ? selected_temp_device.device_node_guid : null,
|
||
device_node_full_name: selected_temp_device.device_node_full_name ? selected_temp_device.device_node_full_name : null,
|
||
status: selected_temp_device.status,
|
||
value: dataPoint
|
||
}];
|
||
|
||
resetData();
|
||
}
|
||
|
||
|
||
// currentData.push([dataPoint[0], dataPoint[1], 1]);
|
||
// myChart.setOption(option);
|
||
});
|
||
|
||
myChart.on('selectchanged', function (params) {
|
||
@*var pixelPoint = [params.offsetX, params.offsetY];
|
||
var dataPoint = myChart.convertFromPixel({ geoIndex: 0 }, pixelPoint);*@
|
||
console.log("selectchanged", params);
|
||
// currentData.push([dataPoint[0], dataPoint[1], 1]);
|
||
// myChart.setOption(option);
|
||
|
||
currentData = $.map(currentData, function (item) {
|
||
item.selected = false;
|
||
return item;
|
||
});
|
||
|
||
if (params.selected.length > 0) {
|
||
currentData[params.selected[0].seriesIndex - 1].selected = true;
|
||
}
|
||
|
||
resetData();
|
||
});
|
||
|
||
// myChart.getZr().on('mousewheel', function (params) {
|
||
// console.log(params)
|
||
// })
|
||
myChart.on('georoam', function (params) {
|
||
@*console.log("myChart", myChart)*@
|
||
@*console.log("myChart canvas Width Height", [myChart.getWidth(), myChart.getHeight()]);*@
|
||
@*console.log("params", params)
|
||
console.log("geo", myChart.getOption().geo[0])*@
|
||
var zoom = myChart.getOption().geo[0].zoom;
|
||
|
||
if (zoom <= 2.5) {
|
||
ResetFloorMap();
|
||
myChart.setOption({
|
||
geo: {
|
||
roam: 'scale'
|
||
},
|
||
});
|
||
} else {
|
||
myChart.setOption({
|
||
geo: {
|
||
roam: true
|
||
},
|
||
});
|
||
}
|
||
|
||
resetData();
|
||
});
|
||
})
|
||
.fail(function () {
|
||
toast_warning("查無該樓層地圖")
|
||
myChart.clear();
|
||
});
|
||
//#endregion
|
||
}
|
||
//#endregion
|
||
|
||
//#region 重設平面圖設備資料
|
||
function resetData() {
|
||
const scatter_symbol_unselect_convertData = function (data) { //不管有無被選擇(圓點)
|
||
let res = [], temp = [];
|
||
|
||
data.forEach(function (item, index) {
|
||
//如果有子節點，則只針對子節點操作
|
||
if (item.device_nodes != undefined && item.device_nodes != null && item.device_nodes.length > 0) {
|
||
item.device_nodes.forEach(function (item_node, item_node_index) {
|
||
temp.push(item_node);
|
||
});
|
||
} else {
|
||
temp.push(item)
|
||
}
|
||
});
|
||
|
||
temp.map(function (item) {
|
||
|
||
var obj = {
|
||
device_guid: item.device_guid,
|
||
device_full_name: item.device_full_name ? item.device_full_name : null,
|
||
device_node_guid: item.device_node_guid ? item.device_node_guid : null,
|
||
device_node_full_name: item.device_node_full_name ? item.device_node_full_name : null,
|
||
status: item.status,
|
||
value: item.value
|
||
}
|
||
|
||
obj.itemStyle = { 'color': "#0000FF" };
|
||
res.push(obj);
|
||
|
||
});
|
||
|
||
return res;
|
||
}
|
||
|
||
const scatter_icon_unselect_convertData = function (data) { //未選擇的設備(icon)
|
||
let res = [], temp = [];
|
||
|
||
data.forEach(function (item, index) {
|
||
//如果有子節點，則只針對子節點操作
|
||
if (item.device_nodes != undefined && item.device_nodes != null && item.device_nodes.length > 0) {
|
||
item.device_nodes.forEach(function (item_node, item_node_index) {
|
||
if (item_node.selected != undefined && item_node.selected != null && item_node.selected == false) {
|
||
//添加父節點相關資訊
|
||
item_node.device_image_url = item.device_image_url;
|
||
temp.push(item_node);
|
||
}
|
||
});
|
||
} else {
|
||
if (item.selected == false) {
|
||
temp.push(item)
|
||
}
|
||
}
|
||
});
|
||
|
||
temp.map(function (item) {
|
||
|
||
var obj = {
|
||
device_guid: item.device_guid,
|
||
device_full_name: item.device_full_name ? item.device_full_name : null,
|
||
device_node_guid: item.device_node_guid ? item.device_node_guid : null,
|
||
device_node_full_name: item.device_node_full_name ? item.device_node_full_name : null,
|
||
symbol: 'image://' + item.device_image_url,
|
||
status: item.status,
|
||
value: item.value
|
||
}
|
||
|
||
obj.itemStyle = { 'color': "#0000FF" };
|
||
res.push(obj);
|
||
});
|
||
|
||
return res;
|
||
}
|
||
|
||
const effectScatter_icon_selected_convertData = function (data) { //被選擇的設備(icon)
|
||
let res = [], temp = [];
|
||
|
||
data.forEach(function (item, index) {
|
||
//如果有子節點，則只針對子節點操作
|
||
if (item.device_nodes != undefined && item.device_nodes != null && item.device_nodes.length > 0) {
|
||
item.device_nodes.forEach(function (item_node, item_node_index) {
|
||
if (item_node.selected != undefined && item_node.selected != null && item_node.selected == true) {
|
||
//添加父節點相關資訊
|
||
item_node.device_image_url = item.device_image_url;
|
||
temp.push(item_node);
|
||
}
|
||
});
|
||
} else {
|
||
if (item.selected == true) {
|
||
temp.push(item)
|
||
}
|
||
}
|
||
});
|
||
|
||
temp.map(function (item) {
|
||
|
||
var obj = {
|
||
device_guid: item.device_guid,
|
||
device_full_name: item.device_full_name ? item.device_full_name : null,
|
||
device_node_guid: item.device_node_guid ? item.device_node_guid : null,
|
||
device_node_full_name: item.device_node_full_name ? item.device_node_full_name : null,
|
||
symbol: 'image://' + item.device_image_url,
|
||
status: item.status,
|
||
value: item.value
|
||
}
|
||
|
||
obj.itemStyle = { 'color': "#0000FF" };
|
||
res.push(obj);
|
||
});
|
||
|
||
return res;
|
||
}
|
||
|
||
const scatter_symbol_temp_device = function (data) { //編輯模式底下的設備(圓點，只會有一個)
|
||
let res = [];
|
||
data.map(function (item) {
|
||
|
||
var obj = {
|
||
device_guid: item.device_guid,
|
||
device_full_name: item.device_full_name,
|
||
status: item.status,
|
||
value: item.value
|
||
}
|
||
|
||
switch (item.status) {
|
||
case 0:
|
||
obj.itemStyle = { 'color': item.device_close_color };
|
||
break;
|
||
case 1:
|
||
obj.itemStyle = { 'color': item.device_normal_color };
|
||
break;
|
||
case 2:
|
||
obj.itemStyle = { 'color': item.device_error_color };
|
||
break;
|
||
}
|
||
|
||
res.push(obj);
|
||
});
|
||
|
||
return res;
|
||
}
|
||
|
||
const effectScatter_utemp_device = function (data) {
|
||
let res = [];
|
||
|
||
data.map(function (item) {
|
||
|
||
var obj = {
|
||
device_guid: item.device_guid,
|
||
device_full_name: item.device_full_name,
|
||
status: item.status,
|
||
symbol: 'image://' + item.device_image_url,
|
||
value: item.value
|
||
}
|
||
|
||
res.push(obj);
|
||
});
|
||
|
||
return res;
|
||
}
|
||
|
||
if (!myChart.getOption()) {
|
||
return;
|
||
}
|
||
|
||
|
||
var zoom = 0
|
||
if (myChart.getOption().geo && myChart.getOption().geo.length > 0) {
|
||
zoom = myChart.getOption().geo[0].zoom;
|
||
}
|
||
|
||
if (zoom <= 8) {
|
||
|
||
myChart.setOption({
|
||
series: [{
|
||
symbolOffset: [0, 0],
|
||
data: scatter_symbol_unselect_convertData(currentData)
|
||
}, {
|
||
data: []
|
||
}, {
|
||
data: []
|
||
}, {
|
||
data: scatter_symbol_temp_device(temp_device_on_floor_map)
|
||
}, {
|
||
data: []
|
||
}]
|
||
});
|
||
} else {
|
||
|
||
myChart.setOption({
|
||
series: [{
|
||
symbolOffset: [10, 10],
|
||
data: scatter_symbol_unselect_convertData(currentData)
|
||
}, {
|
||
data: scatter_icon_unselect_convertData(currentData),
|
||
}, {
|
||
data: effectScatter_icon_selected_convertData(currentData),
|
||
}, {
|
||
symbolOffset: [10, 10],
|
||
data: scatter_symbol_temp_device(temp_device_on_floor_map)
|
||
}, {
|
||
data: effectScatter_utemp_device(temp_device_on_floor_map),
|
||
}]
|
||
});
|
||
}
|
||
}
|
||
//#endregion
|
||
|
||
//#region 重製平面圖
|
||
function ResetFloorMap() {
|
||
myChart.clear();
|
||
myChart.setOption(option);
|
||
resetData();
|
||
}
|
||
//#endregion
|
||
|
||
//#region 變更平面圖模式
|
||
function ChangeFloorMapMode(mode = "") {
|
||
floor_map_mode = mode;
|
||
switch (floor_map_mode) {
|
||
case 'edit':
|
||
$('#floor-map-mode-text').html("編輯模式");
|
||
$('#floor-map-edit-mode-btn-wrap').show();
|
||
$('#device_info_table .device-coordinate-btn').attr("disabled", true);
|
||
break;
|
||
case 'view':
|
||
$('#floor-map-mode-text').html("檢視模式");
|
||
$('#floor-map-edit-mode-btn-wrap').hide();
|
||
$('#device_info_table .device-coordinate-btn').attr("disabled", false);
|
||
break;
|
||
}
|
||
}
|
||
//#endregion
|
||
|
||
//#region 取消編輯平面圖模式
|
||
function CancelFloorMapEdit() {
|
||
temp_device_on_floor_map = [];
|
||
|
||
var index = currentData.findIndex(function (item) { return item.device_guid === selected_temp_device.device_guid });
|
||
|
||
currentData[index].selected = false;
|
||
|
||
if (selected_temp_device.device_node_guid != undefined && selected_temp_device.device_node_guid != null && selected_temp_device.device_node_guid != "") {
|
||
var node_index = currentData[index].device_nodes.findIndex(function (item) { return item.device_node_guid === selected_temp_device.device_node_guid });
|
||
|
||
currentData[index].device_nodes[node_index].selected = false;
|
||
}
|
||
|
||
selected_temp_device = {}; //清空
|
||
|
||
resetData();
|
||
ChangeFloorMapMode("view");
|
||
}
|
||
//#endregion
|
||
|
||
//#region 儲存編輯平面圖模式
|
||
function SaveFloorMapEdit() {
|
||
var new_coordinate = temp_device_on_floor_map[0].value;
|
||
|
||
coordinate = new_coordinate[0].toFixed(3).toString() + "," + new_coordinate[1].toFixed(3).toString();
|
||
|
||
var index = currentData.findIndex(function (item) { return item.device_guid === selected_temp_device.device_guid });
|
||
|
||
var url = "/DeviceManage/SaveDeviceCoordinate";
|
||
|
||
var send_data = {
|
||
Device_guid: selected_temp_device.device_guid,
|
||
Device_node_guid: selected_temp_device.device_node_guid,
|
||
Coordinate: coordinate
|
||
}
|
||
|
||
$.post(url, send_data, function (rel) {
|
||
if (rel.code != "0000") {
|
||
if (rel.code == "9999") {
|
||
toast_error(rel.msg);
|
||
}
|
||
else {
|
||
toast_warning(rel.msg);
|
||
}
|
||
return;
|
||
}
|
||
else {
|
||
|
||
temp_device_on_floor_map = [];
|
||
deviceInfoTable.ajax.reload(null, false);
|
||
ChangeFloorMapMode("view");
|
||
return;
|
||
}
|
||
}, 'json')
|
||
}
|
||
//#endregion
|
||
|
||
//#region 新增設備
|
||
function AddDevice() {
|
||
|
||
var selectedBuilding_tag = selected_building_menu.building_tag ? selected_building_menu.building_tag : "";
|
||
var selectedMain_system_tag = selected_building_menu.main_system ? selected_building_menu.main_system.main_system_tag : "";
|
||
var selectedSub_system_tag = selected_building_menu.main_system ? selected_building_menu.main_system.sub_system ? selected_building_menu.main_system.sub_system.sub_system_tag : "" : "";
|
||
var selectedFloor_tag = selected_floor_tag ? selected_floor_tag : "";
|
||
if (selectedBuilding_tag == '' || selectedMain_system_tag == '' || selectedSub_system_tag == '' || selectedFloor_tag == '') {
|
||
toast_warning("請先選擇系統類別及樓層。");
|
||
return;
|
||
}
|
||
|
||
|
||
//取得上方選單過濾列表
|
||
var url = "/DeviceManage/GetDeviceImportCheckTempFilter";
|
||
|
||
$.post(url, null, function (rel) {
|
||
if (rel.code != "0000") {
|
||
if (rel.code == "9999") {
|
||
toast_error(rel.msg);
|
||
}
|
||
else {
|
||
toast_warning(rel.msg);
|
||
}
|
||
return;
|
||
}
|
||
else {
|
||
deviceImportCheckTempFilterList = rel.data;
|
||
|
||
$("#import-temp-building-tag-list").empty();
|
||
|
||
var html = '';
|
||
|
||
deviceImportCheckTempFilterList.forEach(function (building_item, building_tag_index) {
|
||
html += `<button type="button" class="btn btn-secondary waves-effect waves-themed mr-2 btn-building-tag" onclick="ChangeDeviceImportPanel('${building_item.device_building_tag}')">${building_item.device_building_tag}</button>`
|
||
});
|
||
|
||
$('#import-temp-building-tag-list').append(html);
|
||
|
||
$('#import-temp-building-tag-list').children().first().trigger('click');
|
||
|
||
$("#device-info-add-modal").modal();
|
||
|
||
return;
|
||
}
|
||
}, 'json');
|
||
}
|
||
//#endregion
|
||
|
||
//#region 變更新增設備基本資料modal的過濾條件
|
||
function ChangeDeviceImportPanel(building_tag, system_tag = "", floor_tag = "") {
|
||
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) {
|
||
if ($(item).text() == building_tag) {
|
||
$(item).removeClass("btn-secondary").addClass("btn-success");
|
||
}
|
||
});
|
||
|
||
$('#import-temp-system-tag-list').empty();
|
||
deviceImportCheckTempFilterList.forEach(function (building_item, building_item_index) {
|
||
if (building_item.device_building_tag == building_tag) {
|
||
var system_html = '';
|
||
|
||
building_item.device_system_tags.forEach(function (system_item, system_item_index) {
|
||
if (system_item.device_system_tag == system_tag) {
|
||
system_html += `<button type="button" class="btn btn-success waves-effect waves-themed mr-2 mb-2" onclick="ChangeDeviceImportPanel('${building_item.device_building_tag}', '${system_item.device_system_tag}')">${system_item.device_system_tag}</button>`
|
||
}
|
||
else {
|
||
system_html += `<button type="button" class="btn btn-secondary waves-effect waves-themed mr-2 mb-2" onclick="ChangeDeviceImportPanel('${building_item.device_building_tag}', '${system_item.device_system_tag}')">${system_item.device_system_tag}</button>`
|
||
}
|
||
});
|
||
|
||
$('#import-temp-system-tag-list').append(system_html);
|
||
|
||
if (system_tag == '') {
|
||
$('#import-temp-system-tag-list').children().first().trigger('click');
|
||
return;
|
||
} else {
|
||
$('#import-temp-floor-tag-list').empty();
|
||
building_item.device_system_tags.forEach(function (system_item, system_item_index) {
|
||
if (system_item.device_system_tag == system_tag) {
|
||
var floor_html = '';
|
||
|
||
system_item.device_floor_tags.forEach(function (floor_item, floor_item_index) {
|
||
if (floor_item.device_floor_tag == floor_tag) {
|
||
floor_html += `<button type="button" class="btn btn-success waves-effect waves-themed mr-2 mb-2" onclick="ChangeDeviceImportPanel('${building_item.device_building_tag}', '${system_item.device_system_tag}', '${floor_item.device_floor_tag}')">${floor_item.device_floor_tag}</button>`
|
||
}
|
||
else {
|
||
floor_html += `<button type="button" class="btn btn-secondary waves-effect waves-themed mr-2 mb-2" onclick="ChangeDeviceImportPanel('${building_item.device_building_tag}', '${system_item.device_system_tag}', '${floor_item.device_floor_tag}')">${floor_item.device_floor_tag}</button>`
|
||
}
|
||
});
|
||
|
||
$('#import-temp-floor-tag-list').append(floor_html);
|
||
|
||
if (floor_tag == '') {
|
||
$('#import-temp-floor-tag-list').children().first().trigger('click');
|
||
return;
|
||
} else {
|
||
$('#import-temp-name-tag-list').empty();
|
||
system_item.device_floor_tags.forEach(function (floor_item, floor_item_index) {
|
||
if (floor_item.device_floor_tag == floor_tag) {
|
||
var name_html = '';
|
||
floor_item.device_name_tags.forEach(function (name_item, name_item_index) {
|
||
name_html += `<button type="button" class="btn btn-secondary waves-effect waves-themed mr-2 mb-2 btn-name-tag"
|
||
onclick="ChangeDeviceImportCheckTempTable(
|
||
'${building_item.device_building_tag}',
|
||
'${system_item.device_system_tag}',
|
||
'${floor_item.device_floor_tag}',
|
||
'${name_item}')">${name_item}</button>`;
|
||
});
|
||
|
||
$('#import-temp-name-tag-list').append(name_html);
|
||
}
|
||
});
|
||
|
||
$('#import-temp-name-tag-list').children().first().trigger('click');
|
||
}
|
||
}
|
||
});
|
||
}
|
||
}
|
||
});
|
||
}
|
||
//#endregion
|
||
|
||
//#region 變更新增設備基本資料modal的列表
|
||
function ChangeDeviceImportCheckTempTable(building_tag = "", system_tag = "", floor_tag = "", name_tag = "") {
|
||
if ($(".btn-name-tag").hasClass("btn-success")) {
|
||
$(".btn-name-tag").removeClass("btn-success").addClass("btn-secondary");
|
||
}
|
||
|
||
$(".btn-name-tag").each(function (index, item) {
|
||
if ($(item).text() == name_tag) {
|
||
$(item).removeClass("btn-secondary").addClass("btn-success");
|
||
}
|
||
});
|
||
|
||
selected_building_tag = building_tag;
|
||
selected_system_tag = system_tag;
|
||
selected_floor_tag = floor_tag;
|
||
selected_name_tag = name_tag;
|
||
|
||
deviceImportCheckTempTable.ajax.reload(null, false);
|
||
}
|
||
//#endregion
|
||
|
||
//#region 設備儲存(透過新增按鈕)
|
||
function SaveDeviceAdd() {
|
||
|
||
var selectedBuilding_tag = selected_building_menu.building_tag ? selected_building_menu.building_tag : "";
|
||
var selectedMain_system_tag = selected_building_menu.main_system ? selected_building_menu.main_system.main_system_tag : "";
|
||
var selectedSub_system_tag = selected_building_menu.main_system ? selected_building_menu.main_system.sub_system ? selected_building_menu.main_system.sub_system.sub_system_tag : "" : "";
|
||
var selectedFloor_tag = selected_floor_tag ? selected_floor_tag : "";
|
||
if (selectedBuilding_tag == '' || selectedMain_system_tag == '' || selectedSub_system_tag == '' || selectedFloor_tag == '')
|
||
{
|
||
toast_warning("請先選擇系統類別及樓層。");
|
||
return;
|
||
}
|
||
|
||
var rows = deviceImportCheckTempTable.rows({ 'search': 'applied' }).nodes();
|
||
//取得被選擇的設備
|
||
var selectedDevices = $("input[name='selectedDevice[]']:checked", rows).map(function () {
|
||
var system_category = $(this).attr('data-system-category');
|
||
var device_disasters = $(this).attr('data-device-disaster');
|
||
return {
|
||
Device_number: $(this).val(),
|
||
Device_system_category_layer3: system_category,
|
||
Device_disasters: device_disasters
|
||
};
|
||
}).get();
|
||
|
||
if (selectedDevices.length <= 0) {
|
||
toast_warning("請選擇欲加入設備。");
|
||
return;
|
||
}
|
||
|
||
var json_selectedDevices = JSON.stringify(selectedDevices);
|
||
var blob = new Blob([json_selectedDevices],
|
||
{ type: "text/plain;charset=utf-8" });
|
||
|
||
var url = "/DeviceManage/SaveDeviceInfoAdd";
|
||
|
||
@*var send_data = {
|
||
Building_tag: selectedBuilding_tag,
|
||
Main_system_tag: selectedMain_system_tag,
|
||
Sub_system_tag: selectedSub_system_tag,
|
||
Floor_tag: selectedFloor_tag,
|
||
SelectedDevices: selectedDevices
|
||
}
|
||
|
||
$.post(url, send_data, function (rel) {
|
||
if (rel.code != "0000") {
|
||
toast_error(rel.msg);
|
||
return;
|
||
}
|
||
|
||
toast_ok(rel.msg);
|
||
$("#device-info-add-modal").modal('hide');
|
||
|
||
deviceInfoTable.ajax.reload();
|
||
deviceKindTable.ajax.reload(null, false);
|
||
}, 'json');*@
|
||
|
||
$("#save-device-add-btn").html('<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>').attr("disabled", true);
|
||
|
||
|
||
var formData = new FormData();
|
||
formData.append("Building_tag", selectedBuilding_tag);
|
||
formData.append("Main_system_tag", selectedMain_system_tag);
|
||
formData.append("Sub_system_tag", selectedSub_system_tag);
|
||
formData.append("Floor_tag", selectedFloor_tag);
|
||
formData.append("SelectedDevicesFile", blob);
|
||
|
||
$.ajax({
|
||
type: "POST",
|
||
url: url,
|
||
data: formData,
|
||
cache: false,
|
||
contentType: false,
|
||
processData: false,
|
||
success: function (rel) {
|
||
$("#save-device-add-btn").html('確定').attr("disabled", false);
|
||
if (rel.code != "0000") {
|
||
toast_error(rel.msg);
|
||
return;
|
||
}
|
||
|
||
toast_ok(rel.msg);
|
||
$("#device-info-add-modal").modal('hide');
|
||
|
||
deviceInfoTable.ajax.reload();
|
||
deviceKindTable.ajax.reload(null, false);
|
||
},
|
||
fail: function (jqXHR, textStatus, errorThrown) {
|
||
$("#save-device-add-btn").html('確定').attr("disabled", false);
|
||
}
|
||
});
|
||
}
|
||
//#endregion
|
||
|
||
//#region 設備基本資料表單驗證
|
||
var DeviceInfoValidate = $("#device-info-edit-form").validate({
|
||
rules: {
|
||
device_name_modal: {
|
||
// required: true,
|
||
maxlength: 50,
|
||
filterspace: true
|
||
},
|
||
device_ip_modal: {
|
||
regex: /^((2(5[0-5]|[0-4]\d))|[0-1]?\d{1,2})(\.((2(5[0-5]|[0-4]\d))|[0-1]?\d{1,2})){3}$/
|
||
},
|
||
device_port_modal: {
|
||
number: true
|
||
}
|
||
},
|
||
messages: {
|
||
device_ip_modal: {
|
||
regex: "請輸入正確的設備IP"
|
||
}
|
||
}
|
||
});
|
||
//#endregion
|
||
|
||
|
||
|
||
//#region 設備儲存(透過修改按鈕)
|
||
function SaveDeviceInfoEdit() {
|
||
if ($("#device-info-edit-form").valid()) {
|
||
|
||
var select_disasters = $("input[name='selectDisaster[]']:checked").map(function () {
|
||
return $(this).val();
|
||
}).get();
|
||
|
||
var url = "/DeviceManage/SaveDeviceInfoEdit";
|
||
var send_data = {
|
||
Device_guid: selected_device_guid,
|
||
Full_name: $("#device_name_modal").val(),
|
||
Device_coordinate_x: $("#device_coordinate_x_modal").val(),
|
||
Device_coordinate_y: $("#device_coordinate_y_modal").val(),
|
||
Device_disasters: select_disasters,
|
||
Device_ip: $("#device_ip_modal").val(),
|
||
Device_port: $("#device_port_modal").val(),
|
||
}
|
||
|
||
$.post(url, send_data, 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);
|
||
deviceInfoTable.ajax.reload(null, false);
|
||
$("#device-info-edit-modal").modal('hide');
|
||
return;
|
||
}
|
||
}, 'json');
|
||
}
|
||
}
|
||
//#endregion
|
||
|
||
//#region 設備子節點表單驗證
|
||
var DeviceNodeValidate = $("#device-node-form").validate({
|
||
rules: {
|
||
device_node_name_modal: {
|
||
required: true,
|
||
maxlength: 50,
|
||
filterspace: true
|
||
},
|
||
}
|
||
});
|
||
//#endregion
|
||
|
||
//#region 設備子節點儲存
|
||
function SaveDeviceNode() {
|
||
if ($("#device-node-form").valid()) {
|
||
|
||
var url = "/DeviceManage/SaveDeviceNode";
|
||
var send_data = {
|
||
Device_guid: selected_device_guid,
|
||
Device_node_guid: selected_device_node_guid,
|
||
Full_name: $("#device_node_name_modal").val(),
|
||
Device_node_coordinate_x: $("#device_node_coordinate_x_modal").val(),
|
||
Device_node_coordinate_y: $("#device_node_coordinate_y_modal").val(),
|
||
}
|
||
|
||
$.post(url, send_data, 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);
|
||
deviceInfoTable.ajax.reload(null, false);
|
||
|
||
@*Object.keys(selected_device_parents_collapses).forEach(key => {
|
||
var tr = selected_device_parents_collapses[key];
|
||
var row = deviceInfoTable.row(tr);
|
||
|
||
if (row.child.isShown()) {
|
||
// This row is already open - close it
|
||
row.child.hide();
|
||
tr.removeClass('shown');
|
||
tr.find("td").first().html(`<i class="fal fa-plus"></i>`);
|
||
}
|
||
else {
|
||
// Open this row
|
||
console.log(row.data());
|
||
row.child(DeviceNodeFormat(row.data().device_nodes)).show();
|
||
tr.addClass('shown');
|
||
tr.find("td").first().html(`<i class="fal fa-minus"></i>`);
|
||
}
|
||
});*@
|
||
|
||
$("#device-node-modal").modal("hide");
|
||
return;
|
||
}
|
||
}, 'json');
|
||
}
|
||
}
|
||
//#endregion
|
||
|
||
//#region 設備種類表單驗證
|
||
var DeviceKindValidate = $("#device-kind-form").validate({
|
||
rules: {
|
||
device_image_modal: {
|
||
accept: "image/*"
|
||
},
|
||
device_normal_text_modal: {
|
||
// required: true,
|
||
maxlength: 7,
|
||
filterspace: true
|
||
},
|
||
device_normal_color_modal: {
|
||
// required: true,
|
||
maxlength: 7,
|
||
filterspace: true
|
||
},
|
||
device_close_color_modal: {
|
||
// required: true,
|
||
maxlength: 7,
|
||
filterspace: true
|
||
},
|
||
device_error_color_modal: {
|
||
// required: true,
|
||
maxlength: 7,
|
||
filterspace: true
|
||
},
|
||
}
|
||
});
|
||
//#endregion
|
||
|
||
//#region 設備種類儲存
|
||
function SaveDeviceKind() {
|
||
if ($("#device_normal_point_name_modal").val() != ""
|
||
&& $("#device_normal_point_name_modal option:selected").text() != "ER"
|
||
&& $("#device_close_point_name_modal").val() != ""
|
||
&& $("#device_close_point_name_modal option:selected").text() != "ER"
|
||
&& $("#device_normal_point_name_modal").val() != $("#device_close_point_name_modal").val()) {
|
||
toast_warning("點位名稱設定需相同");
|
||
return;
|
||
}
|
||
|
||
var normalValue = $("#device_normal_point_value_modal").val();
|
||
var closeValue = $("#device_close_point_value_modal").val();
|
||
|
||
if (normalValue != "" && closeValue != "" && normalValue != null && closeValue != null) {
|
||
if (normalValue == closeValue) {
|
||
toast_warning("點位值設定重複，請修改");
|
||
return;
|
||
}
|
||
}
|
||
|
||
if ($("#device-kind-form").valid()) {
|
||
|
||
$("#save-device-kind-btn").html('<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>').attr("disabled", true);
|
||
|
||
|
||
var url = "/DeviceManage/SaveDeviceKind";
|
||
|
||
var formData = new FormData();
|
||
|
||
formData.append("Device_kind_guid", selected_device_kind_guid);
|
||
formData.append("Device_building_tag", selected_device_building_tag);
|
||
formData.append("Device_system_tag", selected_device_system_tag);
|
||
formData.append("Device_floor_tag", selected_device_floor_tag);
|
||
formData.append("Device_name_tag", selected_device_name_tag);
|
||
|
||
formData.append("Device_normal_text", $("#device_normal_text_modal").val());
|
||
if ($("#device_normal_point_name_modal").val() != null && $("#device_normal_point_name_modal").val() != "") {
|
||
formData.append("Device_normal_point_guid", $("#device_normal_point_name_modal").val());
|
||
|
||
if ($("#device_normal_point_col_modal").val() != null && $("#device_normal_point_col_modal").val() != "") {
|
||
formData.append("Device_normal_point_col", $("#device_normal_point_col_modal").val());
|
||
}
|
||
if ($("#device_normal_point_value_modal").val() != null && $("#device_normal_point_value_modal").val() !="") {
|
||
formData.append("Device_normal_point_value", $("#device_normal_point_value_modal").val());
|
||
}
|
||
}
|
||
|
||
formData.append("Device_normal_color", $("#device_normal_color_modal").val());
|
||
formData.append("Device_normal_flashing", $("#device_normal_flashing_modal:checked").val());
|
||
|
||
formData.append("Device_close_text", $("#device_close_text_modal").val());
|
||
if ($("#device_close_point_name_modal").val() != null && $("#device_close_point_name_modal").val() != "") {
|
||
formData.append("Device_close_point_guid", $("#device_close_point_name_modal").val());
|
||
if ($("#device_close_point_col_modal").val() != null && $("#device_close_point_col_modal").val() != "") {
|
||
formData.append("Device_close_point_col", $("#device_close_point_col_modal").val());
|
||
}
|
||
if ($("#device_close_point_value_modal").val() != null && $("#device_close_point_value_modal").val() != "") {
|
||
formData.append("Device_close_point_value", $("#device_close_point_value_modal").val());
|
||
}
|
||
}
|
||
formData.append("Device_close_color", $("#device_close_color_modal").val());
|
||
formData.append("Device_close_flashing", $("#device_close_flashing_modal:checked").val());
|
||
|
||
formData.append("Device_error_text", $("#device_error_text_modal").val());
|
||
if ($("#device_error_point_name_modal").val() != null && $("#device_error_point_name_modal").val() != "") {
|
||
formData.append("Device_error_point_guid", $("#device_error_point_name_modal").val());
|
||
if ($("#device_error_point_col_modal").val() != null && $("#device_error_point_col_modal").val() != "") {
|
||
formData.append("Device_error_point_col", $("#device_error_point_col_modal").val());
|
||
}
|
||
if ($("#device_error_point_value_modal").val() != null && $("#device_error_point_value_modal").val() != "") {
|
||
formData.append("Device_error_point_value", $("#device_error_point_value_modal").val());
|
||
}
|
||
}
|
||
formData.append("Device_error_color", $("#device_error_color_modal").val());
|
||
formData.append("Device_error_flashing", $("#device_error_flashing_modal:checked").val());
|
||
formData.append("Device_error_independent", $("#device_error_independent_modal:checked").val());
|
||
|
||
@*formData.append("Device_close_color", $("#device_close_color_modal").val());
|
||
formData.append("Device_error_color", $("#device_error_color_modal").val());
|
||
formData.append("Device_flashing", $("#device_normal_flashing_modal:checked").val());*@
|
||
|
||
imgs = $('#device_image_modal')[0].files
|
||
if (imgs.length > 0) {
|
||
|
||
var file_names = imgs[0].name.split(".")
|
||
|
||
formData.append("Device_image_file", imgs[0])
|
||
formData.append("InitDeviceName", imgs[0].name);
|
||
}
|
||
|
||
$.ajax({
|
||
type: "POST",
|
||
url: url,
|
||
data: formData,
|
||
cache: false,
|
||
contentType: false,
|
||
processData: false,
|
||
success: function (rel) {
|
||
$("#save-device-kind-btn").html('確定').attr("disabled", false);
|
||
if (rel.code != "0000") {
|
||
if (rel.code == "9999") {
|
||
toast_error(rel.msg);
|
||
}
|
||
else {
|
||
toast_warning(rel.msg);
|
||
}
|
||
return;
|
||
}
|
||
else {
|
||
toast_ok(rel.msg);
|
||
deviceKindTable.ajax.reload(null, false);
|
||
$("#device-kind-modal").modal('hide');
|
||
return;
|
||
}
|
||
},
|
||
fail: function (jqXHR, textStatus, errorThrown) {
|
||
$("#save-device-kind-btn").html('確定').attr("disabled", false);
|
||
}
|
||
});
|
||
}
|
||
}
|
||
//#endregion
|
||
|
||
//#region 設備Master表單驗證
|
||
var DeviceMasterValidate = $("#device-master-form").validate({
|
||
rules: {
|
||
device_master_icon_modal: {
|
||
accept: "image/*"
|
||
},
|
||
device_master_full_name_modal: {
|
||
// required: true,
|
||
filterspace: true
|
||
}
|
||
}
|
||
});
|
||
//#endregion
|
||
|
||
//#region 設備Master儲存
|
||
function SaveDeviceMaster() {
|
||
|
||
if ($("#device-master-form").valid()) {
|
||
|
||
var url = "/DeviceManage/SaveDeviceMaster";
|
||
|
||
var formData = new FormData();
|
||
|
||
formData.append("Device_master_guid", selected_device_master_guid);
|
||
formData.append("Device_building_tag", selected_device_building_tag);
|
||
formData.append("Device_name_tag", selected_device_name_tag);
|
||
formData.append("Device_master_full_name", $("#device_master_full_name_modal").val());
|
||
|
||
|
||
imgs = $('#device_master_icon_modal')[0].files
|
||
if (imgs.length > 0) {
|
||
formData.append("Device_master_icon_file", imgs[0])
|
||
}
|
||
|
||
$("#save-device-master-btn").html('<span class="spinner-border spinner-border-sm" role="status" aria-hidden="true"></span>').attr("disabled", true);
|
||
|
||
$.ajax({
|
||
type: "POST",
|
||
url: url,
|
||
data: formData,
|
||
cache: false,
|
||
contentType: false,
|
||
processData: false,
|
||
success: function (rel) {
|
||
$("#save-device-master-btn").html('確定').attr("disabled", false);
|
||
if (rel.code != "0000") {
|
||
if (rel.code == "9999") {
|
||
toast_error(rel.msg);
|
||
}
|
||
else {
|
||
toast_warning(rel.msg);
|
||
}
|
||
return;
|
||
}
|
||
else {
|
||
toast_ok(rel.msg);
|
||
deviceMasterTable.ajax.reload(null, false);
|
||
$("#device-master-edit-modal").modal('hide');
|
||
return;
|
||
}
|
||
},
|
||
fail: function (jqXHR, textStatus, errorThrown) {
|
||
$("#save-device-master-btn").html('確定').attr("disabled", false);
|
||
}
|
||
});
|
||
}
|
||
}
|
||
//#endregion
|
||
|
||
</script>
|
||
}
|