diff --git a/Frontend/_alert.html b/Frontend/_alert.html
new file mode 100644
index 0000000..8d2d5d1
--- /dev/null
+++ b/Frontend/_alert.html
@@ -0,0 +1,184 @@
+<main id="js-page-content" role="main" class="page-content">
+    <div class="row">
+        <div class="col-sm-12 col-xl-12">
+            <h1 class="p-2 mb-0">即時告警</h1>
+            <div class="row bg-dark p-2">
+                <div class="col-auto">
+                    <div class="btn-group">
+                        <button id="returnFalse" onclick="setReturn(false)" type="button" class="btn btn-secondary waves-effect waves-themed">未復歸</button>
+                        <button id="returnTrue" onclick="setReturn(true)" type="button" class="btn btn-secondary waves-effect waves-themed">已復歸</button>
+                    </div>
+                </div>
+                <div class="col-auto">
+                    <div class="btn-group">
+                        <button id="unconfirmed" onclick="setConfirm(false)" type="button" class="btn btn-secondary waves-effect waves-themed">未確認</button>
+                        <button id="confirmed" onclick="setConfirm(true)" type="button" class="btn btn-secondary waves-effect waves-themed">已確認</button>
+                    </div>
+                </div>
+                <div class="col-auto">
+                    <a href="#" id="nearthirty" class="btn btn-secondary">近30天</a>
+                </div>
+                <div class="col-auto">
+                    <div class="form-group">
+                        <input class="form-control" id="startdate" data-val="" type="date" name="startdate" value="" style="cursor: pointer">
+                    </div>
+                </div>
+                <div class="col-auto">
+                    <div class="form-group">
+                        <input class="form-control" id="enddate" data-val="" type="date" name="enddate" value="" style="cursor: pointer">
+                    </div>
+                </div>
+                <hr>
+
+            </div>
+            <div class="row bg-dark p-2 mb-5">
+                <div class="col-auto">
+                    <a href="#" onclick="selAll()" class="btn btn-secondary">全部類別</a>
+                </div>
+                <div class="col-auto">
+                    <a href="#" class="btn btn-secondary">空調</a>
+                </div>
+            </div>
+
+            <div class="row">
+                <div class="frame-wrap">
+                    <table class="table table-bordered table-striped text-center m-0">
+                        <thead class="thead-themed">
+                            <tr>
+                                <th>棟別-樓層</th>
+                                <th>異常ID</th>
+                                <th>發生時間</th>
+                                <th>異常類別</th>
+                                <th>設備編號</th>
+                                <th>異常原因</th>
+                                <th>Ack 確認</th>
+                                <th>派工/維運單號</th>
+                            </tr>
+                        </thead>
+                        <tbody>
+                            <tr>
+                                <td>板橋-19F</td>
+                                <td>ER20210630001</td>
+                                <td>2022-08-01 09:36</td>
+                                <td>照明故障</td>
+                                <td>s02101000101</td>
+                                <td>照明設備 LA01 故障</td>
+                                <td><a href="#" class="btn btn-warning">未確認</a></td>
+                                <td>Op0004</td>
+                            </tr>
+                            <tr>
+                                <td>板橋-19F</td>
+                                <td>ER20210630001</td>
+                                <td>2022-08-01 09:36</td>
+                                <td>照明故障</td>
+                                <td>s02101000101</td>
+                                <td>照明設備 LA01 故障</td>
+                                <td><a href="#" class="btn btn-warning">未確認</a></td>
+                                <td><a href="#" class="btn btn-info">+ 維修單</a></td>
+                            </tr>
+                            <tr>
+                                <td>板橋-19F</td>
+                                <td>ER20210630001</td>
+                                <td>2022-08-01 09:36</td>
+                                <td>照明故障</td>
+                                <td>s02101000101</td>
+                                <td>照明設備 LA01 故障</td>
+                                <td><a href="#" class="btn btn-info">確認</a></td>
+                                <td><a href="#" class="btn btn-info">+ 維修單</a></td>
+                            </tr>
+                        </tbody>
+                    </table>
+                </div>
+            </div>
+        </div>
+    </div>
+</main>
+
+<script>
+    $(function () {
+        $('#nearthirty').click();
+        setReturn(false);
+        setConfirm(false);
+
+        event();
+    });
+
+    function event() {
+        onEvent('click', '#nearthirty', function () {
+            let today = displayDate(new Date(Date.now()), "date").replaceAll('/', '-');
+            let thirtyDays = displayDate(new Date(new Date().setDate(new Date(Date.now()).getDate() - 30)), "date").replaceAll('/', '-');
+            $('#startdate').val(thirtyDays);
+            $('#startdate').data('val', thirtyDays);
+			$('#enddate').val(today);
+            $('#enddate').data('val', today);
+            if (!$(this).hasClass('btn-info'))
+                elemSelCol($(this));
+        });
+
+        onEvent('change', '#startdate, #enddate', function () {
+            if ($('#startdate').val() > $('#enddate').val()) {
+                $('#startdate').val($('#startdate').data('val'));
+                $('#enddate').val($('#enddate').data('val'));
+                toast_error('不可選擇大於結束時間');
+            }
+            else {
+                let today = displayDate(new Date(Date.now()), "date").replaceAll('/', '-');
+                let enddate = displayDate(new Date(new Date().setDate(new Date($('#enddate').val()).getDate() - 30)), "date").replaceAll('/', '-');
+                let startdate = $('#startdate').val();
+                if (enddate == startdate && $('#enddate').val() == today) {
+                    $('#nearthirty').click();
+                }
+                else {
+					$('#nearthirty').removeClass('btn-info');
+					$('#nearthirty').addClass('btn-secondary');
+				}
+
+                $('#startdate').data('val', $('#startdate').val());
+				$('#enddate').data('val', $('#enddate').val());
+			}
+        });
+    }
+
+    function setReturn(bool) {
+        pageAct.return = bool;
+		$('#returnFalse').removeClass('btn-info');
+		$('#returnTrue').removeClass('btn-info');
+        if (!bool) {
+            $('#returnFalse').removeClass('btn-secondary');
+            $('#returnFalse').addClass('btn-info');
+			$('#returnTrue').addClass('btn-secondary');
+        }
+        else {
+			$('#returnTrue').removeClass('btn-secondary');
+            $('#returnTrue').addClass('btn-info');
+			$('#returnFalse').addClass('btn-secondary');
+		}
+    }
+
+    function setConfirm(bool) {
+        pageAct.confirm = bool;
+        $('#unconfirmed').removeClass('btn-info');
+		$('#confirmed').removeClass('btn-info');
+        if (!bool) {
+            $('#unconfirmed').removeClass('btn-secondary');
+            $('#unconfirmed').addClass('btn-info');
+			$('#confirmed').addClass('btn-secondary');
+        }
+        else {
+			$('#confirmed').removeClass('btn-secondary');
+            $('#confirmed').addClass('btn-info');
+			$('#unconfirmed').addClass('btn-secondary');
+		}
+	}
+
+    function elemSelCol(elem) {
+        if (elem.hasClass('btn-secondary')) {
+			$(elem).removeClass('btn-secondary');
+            $(elem).addClass('btn-info');
+        }
+        else if (elem.hasClass('btn-info')) {
+			$(elem).removeClass('btn-info');
+			$(elem).addClass('btn-secondary');
+		}
+	}
+</script>
\ No newline at end of file
diff --git a/Frontend/_historyData.html b/Frontend/_historyData.html
index bd3b25c..b997547 100644
--- a/Frontend/_historyData.html
+++ b/Frontend/_historyData.html
@@ -71,7 +71,7 @@
     var historyTable = null;
     $(function () {
         initList();
-		$(loadEle).Loading("close");
+		
         // default list filter
         initApp.listFilter($('#js_default_list'), $('#js_default_list_filter'));
         // custom response message
@@ -101,33 +101,33 @@
                     $('#enddate input').data('val', $('#enddate input').val());
 
 					$(`[onclick="setDateType('today', this)"]`).addClass('btn-secondary');
-					$(`[onclick="setDateType('today', this)"]`).removeClass('btn-dark');
+					$(`[onclick="setDateType('today', this)"]`).removeClass('btn-info');
 					$(`[onclick="setDateType('ytd', this)"]`).addClass('btn-secondary');
-					$(`[onclick="setDateType('ytd', this)"]`).removeClass('btn-dark');
+					$(`[onclick="setDateType('ytd', this)"]`).removeClass('btn-info');
 
                     if ($('#startdate').val() == $('#enddate input').val()) {
                         if ($('#startdate').val() == today) {
                             $(`[onclick="setDateType('today', this)"]`).removeClass('btn-secondary');
-                            $(`[onclick="setDateType('today', this)"]`).addClass('btn-dark');
+                            $(`[onclick="setDateType('today', this)"]`).addClass('btn-info');
                         }
                         else if ($('#startdate').val() == ytd) {
 							$(`[onclick="setDateType('ytd', this)"]`).removeClass('btn-secondary');
-							$(`[onclick="setDateType('ytd', this)"]`).addClass('btn-dark');
+							$(`[onclick="setDateType('ytd', this)"]`).addClass('btn-info');
 						}
 					}
 				}
 			}
             else if ($(this).val() == today) {
                 $(`[onclick="setDateType('today', this)"]`).removeClass('btn-secondary');
-                $(`[onclick="setDateType('today', this)"]`).addClass('btn-dark');
+                $(`[onclick="setDateType('today', this)"]`).addClass('btn-info');
 				$(`[onclick="setDateType('ytd', this)"]`).addClass('btn-secondary');
-				$(`[onclick="setDateType('ytd', this)"]`).removeClass('btn-dark');
+				$(`[onclick="setDateType('ytd', this)"]`).removeClass('btn-info');
             }
             else if ($(this).val() == ytd) {
 				$(`[onclick="setDateType('today', this)"]`).addClass('btn-secondary');
-				$(`[onclick="setDateType('today', this)"]`).removeClass('btn-dark');
+				$(`[onclick="setDateType('today', this)"]`).removeClass('btn-info');
                 $(`[onclick="setDateType('ytd', this)"]`).removeClass('btn-secondary');
-                $(`[onclick="setDateType('ytd', this)"]`).addClass('btn-dark');
+                $(`[onclick="setDateType('ytd', this)"]`).addClass('btn-info');
             }
         });
 
@@ -144,18 +144,18 @@
 				$('#enddate input').data('val', $('#enddate input').val());
 
 				$(`[onclick="setDateType('today', this)"]`).addClass('btn-secondary');
-				$(`[onclick="setDateType('today', this)"]`).removeClass('btn-dark');
+				$(`[onclick="setDateType('today', this)"]`).removeClass('btn-info');
 				$(`[onclick="setDateType('ytd', this)"]`).addClass('btn-secondary');
-				$(`[onclick="setDateType('ytd', this)"]`).removeClass('btn-dark');
+				$(`[onclick="setDateType('ytd', this)"]`).removeClass('btn-info');
 
 				if ($('#startdate').val() == $('#enddate input').val()) {
 					if ($('#startdate').val() == today) {
 						$(`[onclick="setDateType('today', this)"]`).removeClass('btn-secondary');
-						$(`[onclick="setDateType('today', this)"]`).addClass('btn-dark');
+						$(`[onclick="setDateType('today', this)"]`).addClass('btn-info');
 					}
 					else if ($('#startdate').val() == ytd) {
 						$(`[onclick="setDateType('ytd', this)"]`).removeClass('btn-secondary');
-						$(`[onclick="setDateType('ytd', this)"]`).addClass('btn-dark');
+						$(`[onclick="setDateType('ytd', this)"]`).addClass('btn-info');
 					}
 				}
 			}
@@ -163,7 +163,6 @@
     });
 
     function initList() {
-        pageAct.mainStatus = false;
         let sendData = {
             building_tag: pageAct.buiTag
         }
@@ -245,7 +244,7 @@
             
             $.each(res.data, function (index, val) {
                 if (index == 0) {
-					strHtml += `<button onClick="setValue(null, null, '${val.points}', this)" type="button" class="btn btn-dark waves-effect waves-themed">${val.full_name} ${val.points}</button>`;
+					strHtml += `<button onClick="setValue(null, null, '${val.points}', this)" type="button" class="btn btn-info waves-effect waves-themed">${val.full_name} ${val.points}</button>`;
                     pageAct.deviceItem = val.points;
                     pageAct.devicePoiName = val.full_name + ' ' + val.points;
                     getData();
@@ -321,11 +320,11 @@
                 getData(formatDate(ytd, "date", true), formatDate(now, "date", true));
             else {
 				$(`[onclick="setDateType('today', this)"]`).removeClass('btn-secondary');
-				$(`[onclick="setDateType('today', this)"]`).addClass('btn-dark');
+				$(`[onclick="setDateType('today', this)"]`).addClass('btn-info');
 			}
         }
         else if (type == "range") {
-			$(`[onclick="setDateType('today', this)"], [onclick="setDateType('ytd', this)"]`).removeClass('btn-dark');
+			$(`[onclick="setDateType('today', this)"], [onclick="setDateType('ytd', this)"]`).removeClass('btn-info');
 			$(`[onclick="setDateType('today', this)"], [onclick="setDateType('ytd', this)"]`).addClass('btn-secondary');
 
             $('#startdate').css('display', 'block');
@@ -337,7 +336,7 @@
             $('#enddate input').data('val', tmr);
         }
         else if (type == "month") {
-			$(`[onclick="setDateType('today', this)"], [onclick="setDateType('ytd', this)"]`).removeClass('btn-dark');
+			$(`[onclick="setDateType('today', this)"], [onclick="setDateType('ytd', this)"]`).removeClass('btn-info');
 			$(`[onclick="setDateType('today', this)"], [onclick="setDateType('ytd', this)"]`).addClass('btn-secondary');
 
             $('#startdate').css('display', 'none');
diff --git a/Frontend/_operation.html b/Frontend/_operation.html
index 49f2fb7..b3e7dfb 100644
--- a/Frontend/_operation.html
+++ b/Frontend/_operation.html
@@ -11,7 +11,7 @@
 						<button type="button" onclick="setType(null)" class="btn btn-secondary waves-effect waves-themed">廠商資料</button>
 					</div>
 				</div>
-				<div class="col-auto">
+				<div id="setDate" class="col-auto">
 					<div class="btn-group">
 						<button onclick="setDate('tdy')" type="button" class="btn btn-secondary waves-effect waves-themed">今天</button>
 						<button onclick="setDate('ytd')" type="button" class="btn btn-secondary waves-effect waves-themed">昨天</button>
@@ -40,7 +40,7 @@
 			</div>
 			<div class="row bg-dark p-2 align-items-center">
 				<div class="col-auto">
-					<a href="#" onclick="selAllSysVal(this)" class="btn btn-info">全選類別</a>
+					<a href="#" id="selAllSys" onclick="selAllSysVal(this)" class="btn btn-info">全選類別</a>
 				</div>
 				<div class="col-auto">
 					<div id="mainList" class="frame-wrap">
@@ -57,7 +57,7 @@
 			<div class="">
 				<div class="frame-wrap">
 					<div class="mb-3">
-						<a href="#" id="newForm" class="btn btn-success" data-toggle="modal" data-target="#opeFirmModal">+ 維修單</a>
+						<a href="#" id="newForm" class="btn btn-success" data-toggle="modal" data-target="#opeFirmModal">新增</a>
 						<a href="#" onclick="exportExcel()" class="btn btn-info waves-effect waves-themed">
 							<span class="fal fa-file-excel mr-1"></span>
 							匯出
@@ -99,6 +99,7 @@
 							<div class="form-group">
 								<label class="form-label" for="inpFirmSelSysSub">系統小類</label>
 								<select class="form-control" id="inpFirmSelSysSub" name="inpFirmSelSysSub">
+									<option value=''>未選擇</option>
 								</select>
 							</div>
 						</div>
@@ -164,50 +165,29 @@
 			<form id="opeRecForm">
 				<div class="modal-body">
 					<div class="row">
+						<div class="col-md-6">
+							<div class="form-group">
+								<label class="form-label" for="inpErrCode">異常編號</label>
+								<select class="form-control" id="inpErrCode" name="inpErrCode">
+									<option value=''>未選擇</option>
+								</select>
+							</div>
+						</div>
+						<div class="col-md-6">
+							<div class="form-group">
+								<label class="form-label" for="inpStaTime">預計開始時間</label>
+								<input type="date" id="inpStaTime" name="inpStaTime" class="form-control">
+							</div>
+						</div>
 						<div class="col-md-6">
 							<div class="form-group">
 								<label class="form-label" for="inpWorTyp">項目</label>
-								<select class="form-control" id="inpWorTyp" name="inpWorTyp">
+								<select class="form-control custom-select-ri" id="inpWorTyp" name="inpWorTyp" disabled>
 									<option value=1 selected>保養</option>
 									<option value=2>維修</option>
 								</select>
 							</div>
 						</div>
-						<div class="col-md-6">
-							<div class="form-group">
-								<label class="form-label" for="inpArea">區域</label>
-								<select class="form-control" id="inpArea" name="inpArea">
-								</select>
-							</div>
-						</div>
-						<div class="col-md-6">
-							<div class="form-group">
-								<label class="form-label" for="inpBuilding">東別</label>
-								<select class="form-control" id="inpBuilding" name="inpBuilding">
-								</select>
-							</div>
-						</div>
-						<div class="col-md-6">
-							<div class="form-group">
-								<label class="form-label" for="inpFloor">樓層</label>
-								<select class="form-control" id="inpFloor" name="inpFloor">
-								</select>
-							</div>
-						</div>
-						<div class="col-md-6">
-							<div class="form-group">
-								<label class="form-label" for="inpRecSelSysMain">系統大類</label>
-								<select class="form-control" id="inpRecSelSysMain" name="inpRecSelSysMain">
-								</select>
-							</div>
-						</div>
-						<div class="col-md-6">
-							<div class="form-group">
-								<label class="form-label" for="inpRecSelSysSub">系統小類</label>
-								<select class="form-control" id="inpRecSelSysSub" name="inpRecSelSysSub">
-								</select>
-							</div>
-						</div>
 						<div class="col-md-6">
 							<div class="form-group">
 								<label class="form-label" for="inpFixDo">維修項目</label>
@@ -218,6 +198,7 @@
 							<div class="form-group">
 								<label class="form-label" for="inpFixDoCode">維修項目代碼(設備編號)</label>
 								<select class="form-control" id="inpFixDoCode" name="inpFixDoCode">
+									<option value=''>未選擇</option>
 								</select>
 							</div>
 						</div>
@@ -225,72 +206,57 @@
 							<div class="form-group">
 								<label class="form-label" for="inpFixFirm">負責廠商</label>
 								<select class="form-control" id="inpFixFirm" name="inpFixFirm">
+									<option value=''>未選擇</option>
 								</select>
 							</div>
 						</div>
 						<div class="col-md-6">
 							<div class="form-group">
 								<label class="form-label" for="inpStatus">狀態</label>
-								<select class="form-control" id="inpStatus" name="inpStatus">
-									<option value=0 selected>未完成</option>
-									<option value=1>完成</option>
-									<option value=2>未完成-過期</option>
-									<option value=3>完成-過期</option>
-								</select>
+								<div class="form-control" id="inpStatus">
+									<div class="row container">
+										<div class="">
+											<input class="custom-radio-input" type="radio" name="inpSta" id="inpSta_0" value="0" checked>
+											<label class="form-label" for="inpSta_0">未完成</label>
+										</div>
+
+										<div class="px-4">
+											<input class="custom-radio-input" type="radio" name="inpSta" id="inpSta_1" value="1">
+											<label class="form-label" for="inpSta_1">完成</label>
+										</div>
+									</div>
+								</div>
 							</div>
 						</div>
 						<div class="col-md-6">
 							<div class="form-group">
 								<label class="form-label" for="inpWorPerId">工作人員編號</label>
 								<select class="form-control" id="inpWorPerId" name="inpWorPerId">
+									<option value=''>未選擇</option>
 								</select>
 							</div>
 						</div>
-						<div class="col-md-6">
-							<div class="form-group">
-								<label class="form-label" for="inpStaTime">預計開始時間</label>
-								<input class="form-control" type="datetime-local" id="inpStaTime" name="inpStaTime">
-							</div>
-						</div>
-						<div class="col-md-6">
-							<div class="form-group">
-								<label class="form-label" for="inpEndTime">預計結束時間</label>
-								<input class="form-control" type="datetime-local" id="inpEndTime" name="inpEndTime">
-							</div>
-						</div>
-						<div class="col-md-6">
-							<div class="form-group">
-								<label class="form-label" for="inpWorTime">實際開始時間</label>
-								<input class="form-control" type="datetime-local" id="inpWorTime" name="inpWorTime">
-							</div>
-						</div>
-						<div class="col-md-6">
-							<div class="form-group">
-								<label class="form-label" for="inpFinTime">實際完成時間</label>
-								<input class="form-control" type="datetime-local" id="inpFinTime" name="inpFinTime">
-							</div>
-						</div>
-						<div class="col-md-6">
+						<div class="col-md-12">
 							<div class="form-group">
 								<label class="form-label" for="inpNotice">注意事項</label>
-								<input class="form-control" type="text" id="inpNotice" name="inpNotice">
+								<textarea class="form-control" type="text" id="inpNotice" name="inpNotice" rows="7"></textarea>
 							</div>
 						</div>
-						<div class="col-md-6">
+						<div class="col-md-12">
 							<div class="form-group">
 								<label class="form-label" for="inpDescription">結果描述</label>
-								<input class="form-control" type="text" id="inpDescription" name="inpDescription">
+								<textarea class="form-control" type="text" id="inpDescription" name="inpDescription" rows="7"></textarea>
 							</div>
 						</div>
 						<div class="col-md-6">
-							<div class="form-group">
-								<label class="form-label">上傳圖片</label>
-								<label for="myImage" class="file-upload form-control" style="cursor : pointer ">點擊上傳圖片</label>
-								<input id="myImage" class="form-control" type="file" multiple hidden />
-							</div>
 							<div id='forImage' class="col-sm-12 forimage mt-2 p-0">
 
 							</div>
+							<div class="form-group">
+								<label class="form-label">上傳檔案</label>
+								<label for="myImage" class="file-upload" style="cursor : pointer ">點擊上傳檔案</label>
+								<input id="myImage" class="form-control" type="file" multiple hidden />
+							</div>
 						</div>
 					</div>
 				</div>
@@ -325,14 +291,26 @@
 
 <script>
 	$(function () {
+		pageAct.mainStatus = false;
+		$(loadEle).Loading("close");
 		pageAct.sub_system_tag = null;
 		pageAct.main_system_tag = null;
+		pageAct.selSysSub = [];
+		pageAct.selSysMain = [];
+
+		sysList();
 
-		initMaiList();
 		$('input[type=checkbox][data-type=main]').parent().on('change', function () {
-			pageAct.main_system_tag = $('input[type=checkbox]:checked').map(function (i, v) { if ($(v).data('type') == 'main') return $(v).prop('id') }).toArray();
-
-			subList();
+			pageAct.main_system_tag = $('input[type=checkbox]').map(function (i, v) {
+				if ($(v).data('type') == 'main') {
+					if ($(v).is(':checked')) {
+						$(`[data-main=` + $(v).prop('id') + `]`).attr('hidden', false);
+						return $(v).prop('id')
+					}
+					else
+						$(`[data-main=` + $(v).prop('id') + `]`).attr('hidden', true);
+				}
+			}).toArray();
 
 			if ($('input[type=checkbox][data-type=main]:checked').length <= 0) {
 				pageAct.main_system_tag = null
@@ -342,13 +320,20 @@
 			refTable();
 		});
 
-		$('#subList').on('change', $('input[type=checkbox][data-type=sub]').parent(), function () {
+		$('#subList, #mainList').on('change', $('input[type=checkbox][data-type=sub]').parent(), function () {
 			pageAct.sub_system_tag = $('input[type=checkbox]:checked').map(function (i, v) { if ($(v).data('type') == 'sub') return $(v).prop('id') }).toArray();
 
 			if ($('input[type=checkbox][data-type=sub]:checked').length <= 0) {
 				pageAct.sub_system_tag = null;
 			}
 
+			if ($('input[type=checkbox][data-type=sub]:checked').length == $('input[type=checkbox][data-type=sub]').length) {
+				$('#selAllSys').html('取消全選');
+			}
+			else {
+				$('#selAllSys').html('全選類別');
+			}
+
 			refTable();
 		});
 
@@ -357,8 +342,8 @@
 		});
 
 		$(`[onclick^=setDate]`).on('click', function () {
-			if ($(this).hasClass('btn-dark')) {
-				$(this).removeClass('btn-dark');
+			if ($(this).hasClass('btn-info')) {
+				$(this).removeClass('btn-info');
 				$(this).addClass('btn-secondary');
 				setDate();
 			}
@@ -384,6 +369,9 @@
 		$('#opeRecTable_wrapper').css('display', 'none');
 		$('#serial_number').parent().parent().css('display', 'none');
 		$('[for=serial_number]').parent().css('display', 'none');
+		$('#setDate').css('display', 'none');
+		$('#startdate').parent().parent().css('display', 'none');
+		$('#enddate').parent().parent().css('display', 'none');
 
 		serial_number = $('#serial_number').val() || null;
 		let ajaxObj = {
@@ -448,6 +436,9 @@
 		$('#opeRecTable_wrapper').css('display', 'block');
 		$('#serial_number').parent().parent().css('display', 'block');
 		$('[for=serial_number]').parent().css('display', 'block');
+		$('#setDate').css('display', 'block');
+		$('#startdate').parent().parent().css('display', 'block');
+		$('#enddate').parent().parent().css('display', 'block');
 
 		let ajaxObj = {
 			url: baseApiUrl + "/operation/OpeRecList",
@@ -562,6 +553,7 @@
 			loadOpeFirmTable();
 		}
 		else {
+			$('#inpWorTyp').val(wt);
 			$('#newForm').attr('data-target', '#opeRecModal');
 			loadOpeRecTable();
 		}
@@ -596,7 +588,7 @@
 				$('#enddate').data('val', ytd);
 			}
 			else {
-				$(`[onclick^=setDate]`).removeClass('btn-dark');
+				$(`[onclick^=setDate]`).removeClass('btn-info');
 				$(`[onclick^=setDate]`).addClass('btn-secondary');
 				if ($('#startdate').val() == $('#enddate').val()) {
 					if ($('#startdate').val() == today)
@@ -636,40 +628,43 @@
 		refTable();
 	}
 
-	function initMaiList() {
-		let url = baseApiUrl + "/operation/MaiSysList";
-		function success(res) {
-			let strHtml = ``;
-			$.each(res.data, function (i, v) {
-				strHtml += `<div class="custom-control custom-checkbox custom-control-inline">
-								<input type="checkbox" class="custom-control-input" data-type="main" id="${v.system_value}">
-								<label class="custom-control-label" for="${v.system_value}">${v.system_key}</label>
-							</div>`;
-			});
-
-			$('#mainList').html(strHtml);
-		}
-		ytAjax = new YourTeam.Ajax(url, null, success, null, "POST").send();
-	}
-
-	function subList() {
+	function sysList() {
+		let url = baseApiUrl + "/api/GetMainSub";
 		let sendData = {
-			main_system_tag: pageAct.main_system_tag
+			building_tag: pageAct.buiTag
 		}
 		objSendData.Data = sendData;
-
-		let url = baseApiUrl + "/operation/SubSysList";
-		let strHtml = ``;
 		function success(res) {
-			$.each(res.data, function (i, v) {
-				strHtml += `<div class="custom-control custom-checkbox custom-control-inline">
-								<input type="checkbox" class="custom-control-input" data-type="sub" id="${v.system_value}">
-								<label class="custom-control-label" for="${v.system_value}">${v.system_key}</label>
-							</div>`;
+			let mainStrHtml = ``;
+			let subStrHtml = ``;
+			let display = pageAct.mainStatus ? "hidden" : "";
+
+			$.each(res.data.history_Main_Systems, function (i, v) {
+				if (pageAct.mainStatus) {
+					mainStrHtml += `<div class="custom-control custom-checkbox custom-control-inline">
+										<input type="checkbox" class="custom-control-input" data-type="main" id="${v.main_system_tag}">
+										<label class="custom-control-label" for="${v.main_system_tag}">${v.full_name}</label>
+									</div>`;
+				}
+				pageAct.selSysMain.push(v);
+				$.each(v.history_Sub_systems, function (i2, v2) {
+					subStrHtml += `<div class="custom-control custom-checkbox custom-control-inline" data-main="${v.main_system_tag}" ${display}>
+										<input type="checkbox" class="custom-control-input" data-type="sub" id="${v2.sub_system_tag}">
+										<label class="custom-control-label" for="${v2.sub_system_tag}">${v2.full_name}</label>
+									</div>`;
+
+					pageAct.selSysSub.push(v2);
+				});
 			});
-
-			$('#subList').html(strHtml);
-
+			
+			if (pageAct.mainStatus) {
+				$('#mainList').html(mainStrHtml);
+				$('#subList').html(subStrHtml);
+			}
+			else {
+				$('#mainList').html(subStrHtml);
+			}	
+			
 			if (pageAct.sub_system_tag != null) {
 				$.each(pageAct.sub_system_tag, function (i, v) {
 					$('#' + v).click();
@@ -701,171 +696,52 @@
 		}, null, "POST").send();
 	}
 
-	function selSysMain(tag = null) {
-		let url = baseApiUrl + "/operation/MaiSysList";
+	function selSysMain() {
+		$("#inpFirmSelSysMain").html();
+		$("#inpFirmSelSysSub").html();
+		let mainStrHtml = ``;
+		let subStrHtml = ``;
+		$.each(pageAct.selSysMain, (index, roleObj) => {
+			let selected = index == 0 ? "selected" : "";
+			mainStrHtml += `<option value='${roleObj.main_system_tag}' ${selected}>${roleObj.full_name}</option>`;
 
-		ytAjax = new YourTeam.Ajax(url, null, function (res) {
-			if (!res || res.code != "0000" || !res.data) {
+			$.each(roleObj.history_Sub_systems, (index2, roleObj2) => {
+				subStrHtml += `<option value='${roleObj2.sub_system_tag}' data-main='${roleObj.main_system_tag}' ${selected} hidden>${roleObj2.full_name}</option>`;
+			});
+		});
 
-			} else {
-				$("#inpFirmSelSysMain").html();
-				$("#inpFirmSelSysSub").html();
-				$("#inpRecSelSysMain").html();
-				$("#inpRecSelSysSub").html();
-				strHtml = ``;
-				$.each(res.data, (index, roleObj) => {
-					strHtml += `<option value='${roleObj.system_value}'>${roleObj.system_key}</option>`;
-
-					if (index == 0)
-						pageAct.selSysMain = tag ?? roleObj.system_value
-				})
-				$("#inpFirmSelSysMain").html(strHtml);
-				$("#inpRecSelSysMain").html(strHtml);
-				selSysSub();
-			}
-		}, null, "POST").send();
-	}
-
-	function selSysSub() {
-		url = baseApiUrl + "/operation/SubSysList";
-		sendData = {
-			main_system_tag: [pageAct.selSysMain],
-		};
-		objSendData.Data = sendData;
-		strHtml = ``;
-		ytAjax = new YourTeam.Ajax(url, objSendData, function (res) {
-			$.each(res.data, (index, roleObj) => {
-				strHtml += `<option value='${roleObj.system_value}'>${roleObj.system_key}</option>`;
-				if (index == 0)
-					pageAct.selSysSub = pageAct.selSysSub ?? roleObj.system_value;
-			})
-			$("#inpFirmSelSysSub").html(strHtml);
-			$("#inpRecSelSysSub").html(strHtml);
-
-			if (pageAct.work_type != null)
-				selArea(pageAct.selAreaTag);
-		}, null, "POST").send();
-	}
-
-	function selArea(area_tag = null) {
-		let url = baseApiUrl + "/operation/AreaList";
-
-		ytAjax = new YourTeam.Ajax(url, null, function (res) {
-			if (!res || res.code != "0000" || !res.data) {
-
-			} else {
-				$("#inpArea").html();
-				strHtml = ``;
-				$.each(res.data, (index, roleObj) => {
-					let selected = (area_tag == roleObj.device_area_tag ? 'selected' : '');
-					strHtml += `<option value='${roleObj.device_area_tag}' ${selected}>${roleObj.area_name}</option>`;
-
-					if (index == 0)
-						pageAct.selAreaTag = area_tag ?? roleObj.device_area_tag
-				})
-				$("#inpArea").html(strHtml);
-				selBuilding(pageAct.selBuiTag);
-			}
-		}, null, "POST").send();
-	}
-
-	function selBuilding(building_tag = null) {
-		let url = baseApiUrl + "/operation/BuiList";
-
-		sendData = {
-			device_area_tag: pageAct.selAreaTag,
-		};
-		objSendData.Data = sendData;
-		ytAjax = new YourTeam.Ajax(url, objSendData, function (res) {
-			if (!res || res.code != "0000" || !res.data) {
-
-			} else {
-				$("#inpBuilding").html();
-				strHtml = ``;
-				$.each(res.data, (index, roleObj) => {
-					let selected = (building_tag == roleObj.device_building_tag ? 'selected' : '');
-					strHtml += `<option value='${roleObj.device_building_tag}' ${selected}>${roleObj.building_name}</option>`;
-
-					if (index == 0)
-						pageAct.selBuiTag = building_tag ?? roleObj.device_building_tag
-				})
-				$("#inpBuilding").html(strHtml);
-				selFloor(pageAct.selFloTag);
-			}
-		}, null, "POST").send();
-	}
-
-	function selFloor(floor_tag = null) {
-		
-		let url = baseApiUrl + "/operation/FloList";
-
-		sendData = {
-			device_building_tag: pageAct.selBuiTag,
-		};
-		objSendData.Data = sendData;
-		ytAjax = new YourTeam.Ajax(url, objSendData, function (res) {
-			if (!res || res.code != "0000" || !res.data) {
-
-			} else {
-				$("#inpFloor").html();
-				strHtml = ``;
-				$.each(res.data, (index, roleObj) => {
-					let selected = (floor_tag == roleObj.device_floor_tag ? 'selected' : '');
-					strHtml += `<option value='${roleObj.device_floor_tag}' ${selected}>${roleObj.device_floor_tag}</option>`;
-
-					if (index == 0)
-						pageAct.selFloTag = floor_tag ?? roleObj.device_floor_tag
-				})
-				$("#inpFloor").html(strHtml);
-				selDevice();
-			}
-		}, null, "POST").send();
+		$("#inpFirmSelSysMain").html(mainStrHtml);
+		$("#inpFirmSelSysSub").html(subStrHtml);
+		$(`[data-main=` + $("#inpFirmSelSysMain").find('option:selected').val() + `]`).attr('hidden', false);
 	}
 
 	function selDevice() {
 		let url = baseApiUrl + "/operation/DevList";
-
+		let lsst = [];
+		pageAct.selSysSub.map(function (v, i) { lsst.push(v.sub_system_tag.toString()); });
 		sendData = {
-			device_area_tag: pageAct.selAreaTag,
-			device_building_tag: pageAct.selBuiTag,
-			device_floor_tag: pageAct.selFloTag,
-			main_system_tag: pageAct.selSysMain,
-			sub_system_tag: pageAct.selSysSub,
+			device_area_tag: pageAct.AreaTag,
+			device_building_tag: pageAct.buiTag,
+			list_sub_system_tag: lsst,
 		};
 		objSendData.Data = sendData;
 		ytAjax = new YourTeam.Ajax(url, objSendData, function (res) {
 			if (!res || res.code != "0000" || !res.data) {
 
 			} else {
-				$("#inpFixDoCode").html();
 				strHtml = ``;
+				$("#inpFixDoCode").html();
 				$.each(res.data, (index, roleObj) => {
-					strHtml += `<option value='${roleObj.device_number}'>${roleObj.full_name}</option>`;
+					strHtml += `<option value='${roleObj.device_number}' data-floor=${roleObj.device_floor_tag} data-main=${roleObj.device_system_tag} data-sub=${roleObj.device_name_tag}>${roleObj.device_name}</option>`;
 
 					if (index == 0)
-						pageAct.selDevice = roleObj.device_number
+						pageAct.sysSub = roleObj.device_name_tag
 				})
 				$("#inpFixDoCode").html(strHtml);
 			}
 		}, null, "POST").send();
 	}
 
-	function selFixFirm() {
-		let url = baseApiUrl + "/operation/OpeFirList";
-		ytAjax = new YourTeam.Ajax(url, null, function (res) {
-			if (!res || res.code != "0000" || !res.data) {
-
-			} else {
-				$("#inpFixFirm").html();
-				strHtml = ``;
-				$.each(res.data, (index, roleObj) => {
-					strHtml += `<option value='${roleObj.id}'>${roleObj.name}</option>`;					
-				})
-				$("#inpFixFirm").html(strHtml);
-			}
-		}, null, "POST").send();
-	}
-
 	function selUser() {
 		let url = baseApiUrl + "/User/UserManagerList";
 		ytAjax = new YourTeam.Ajax(url, objSendData, function (res) {
@@ -874,6 +750,7 @@
 			} else {
 				$("#inpWorPerId").html();
 				strHtml = ``;
+				strHtml += `<option value=''>未選擇</option>`;
 				$.each(res.data, (index, roleObj) => {
 					strHtml += `<option value='${roleObj.userinfo_guid}'>${roleObj.full_name}</option>`;
 				})
@@ -882,13 +759,53 @@
 		}, null, "POST").send();
 	}
 
+	function selOpeFir() {
+		let url = baseApiUrl + "/operation/OpeFirSel";
+		objSendData.Data = { sub_system_tag: [pageAct.sysSub] };
+		ytAjax = new YourTeam.Ajax(url, objSendData, function (res) {
+			if (!res || res.code != "0000" || !res.data) {
+
+			} else {
+				$("#inpFixFirm").html();
+				strHtml = ``;
+				strHtml += `<option value=''>未選擇</option>`;
+				$.each(res.data, (index, roleObj) => {
+					strHtml += `<option value='${roleObj.id}'>${roleObj.name}</option>`;
+				})
+				$("#inpFixFirm").html(strHtml);
+			}
+		}, null, "POST").send();
+	}
+
 	function selAllSysVal(elem) {
 		//loading process
-		$('#mainList input').map(function (i, v) { $(v).click() });
-		$('#subList input').map(function (i, v) { $(v).click() });
+		if ($(elem).html() == '全選類別') {
+			$('#mainList input').map(function (i, v) {
+				if (!$(v).is(':checked')) {
+					$(v).click();
+				}
+			});
+			$('#subList input').map(function (i, v) {
+				if (!$(v).is(':checked')) {
+					$(v).click();
+				}
+			});
+			$(elem).html('取消全選');
+		}
+		else {
+			$('#mainList input').map(function (i, v) {
+				if ($(v).is(':checked')) 
+					$(v).click();
+			});
+			$('#subList input').map(function (i, v) {
+				if ($(v).is(':checked'))
+					$(v).click();
+			});
+			$(elem).html('全選類別');
+		}
+
+		refTable();
 		//end loading
-		
-		$(elem).html($(elem).html() == '全選類別' ? '取消全選' : '全選類別');
 	}
 
 	function event() {
@@ -905,10 +822,11 @@
 				pageAct.imageFile = [];
 				$('#opeRecTitle').html(pageAct.work_type == 1 ? "新增保養" : "新增維修");
 				$('#opeRecModal input').map(function (i, v) { $(v).val('') });
-				let today = displayDate(new Date(Date.now()), 'datetime').replaceAll('/', '-');
+				let today = displayDate(new Date(Date.now()), 'date').replaceAll('/', '-');
 				$('#opeRecModal input[id*=Time]').map(function (i, v) { $(v).val(today) });
-				selFixFirm();
 				selUser();
+				selDevice();
+				selOpeFir();
 				$('#forImage').html('');
 			}
 
@@ -925,7 +843,6 @@
 
 				} else {
 					pageAct.opeFirmAct = 'edit';
-					selSysMain(res.data.device_system_category_layer2);
 					$('#opeFirmForm select[id=inpFirmSelSysMain]').val(res.data.device_system_category_layer2).change();
 					$('#opeFirmForm select[id=inpFirmSelSysSub]').val(res.data.device_system_category_layer3).change();
 					$('#opeFirmForm input[id=inpName]').val(res.data.name);
@@ -1011,11 +928,6 @@
 			$(form).validate({
 				rules: {
 					inpWorTyp: { required: true},
-					inpArea: { required: true },
-					inpBuilding: { required: true },
-					inpFloor: { required: true },
-					inpRecSelSysMain: { required: true },
-					inpRecSelSysSub: { required: true },
 					inpFixDo: { required: true },
 					inpFixDoCode: { required: true },
 					inpFixFirm: { required: true },
@@ -1110,7 +1022,6 @@
 
 		onEvent('click', '#opeRecEdiBtn', function () {
 			clearOpeRecPageAct();
-			selFixFirm();
 			selUser();
 			pageAct.imageFile = [];
 			$('#opeRecTitle').html(pageAct.work_type == 1 ? "編輯保養" : "編輯維修");
@@ -1121,27 +1032,18 @@
 				if (!res || res.code != "0000" || !res.data) {
 
 				} else {
-					pageAct.selBuiTag = res.data.device_building_tag;
-					pageAct.selFloTag = res.data.device_floor_tag;
-					pageAct.selSysSub = res.data.device_system_category_layer3;
-					selSysMain(res.data.device_system_category_layer2);
-					$('#inpArea').val(res.data.device_area_tag);
-					$('#inpBuilding').val(res.data.device_building_tag);
-					$('#inpFloor').val(res.data.device_floor_tag);
-					$('#inpRecSelSysMain').val(res.data.device_system_category_layer2);
-					$('#inpRecSelSysSub').val(res.data.device_system_category_layer3);
 					$('#inpWorTyp').val(res.data.work_type);
 					$('#inpFixDo').val(res.data.fix_do);
 					$('#inpFixDoCode').val(res.data.fix_do_code);
 					$('#inpFixFirm').val(res.data.fix_firm);
 					$('#inpStatus').val(res.data.status);
 					$('#inpWorPerId').val(res.data.work_person_id);
-					$('#inpStaTime').val(displayDate(res.data.start_time, 'datetime').replace(' ', 'T').replaceAll('/', '-'));
-					$('#inpEndTime').val(displayDate(res.data.end_time, 'datetime').replace(' ', 'T').replaceAll('/', '-'));
-					$('#inpWorTime').val(displayDate(res.data.work_time, 'datetime').replace(' ', 'T').replaceAll('/', '-'));
-					$('#inpFinTime').val(displayDate(res.data.finish_time, 'datetime').replace(' ', 'T').replaceAll('/', '-'));
-					$('#inpNotice').val(res.data.notice);
-					$('#inpDescription').val(res.data.description);
+					//$('#inpStaTime').val(displayDate(res.data.start_time, 'datetime').replace(' ', 'T').replaceAll('/', '-'));
+					//$('#inpEndTime').val(displayDate(res.data.end_time, 'datetime').replace(' ', 'T').replaceAll('/', '-'));
+					//$('#inpWorTime').val(displayDate(res.data.work_time, 'datetime').replace(' ', 'T').replaceAll('/', '-'));
+					//$('#inpFinTime').val(displayDate(res.data.finish_time, 'datetime').replace(' ', 'T').replaceAll('/', '-'));
+					$('#inpNotice').text(res.data.notice);
+					$('#inpDescription').text(res.data.description);
 					let strHtml = ``;
 					$.each(res.data.lorf, function (i, v) {
 						let extName = v.ori_file_name.split('.')[1];
@@ -1149,7 +1051,7 @@
 						strHtml += `<div class="file-item" data-id=${v.id} ${divMargin}>
 										<a href="${baseApiUrl}/upload/operation/${v.save_file_name}.${extName}" download="${v.ori_file_name}" target="_blank">
 											<img data-filename=${v.ori_file_name} data-savename=${v.save_file_name} height="70px" width="150px" src="${baseApiUrl}/upload/operation/${v.save_file_name}.${extName}">
-											<button class="btn-dark" name="btnDelImg"><i class="fa fa-times"></i></button>
+											<button class="btn-info" name="btnDelImg"><i class="fa fa-times"></i></button>
 										</a>
 									</div>`;
 					});
@@ -1158,31 +1060,6 @@
 			}, null, "POST").send()
 		});
 
-		onEvent('change', '#inpFirmSelSysMain, #inpRecSelSysMain', function () {
-			pageAct.selSysMain = $(this).val();
-			selSysSub();
-		});
-
-		onEvent("change", "#inpRecSelSysSub", function () {
-			pageAct.selSysSub = $(this).val();
-			selDevice();
-		});
-
-		onEvent("change", "#inpArea", function () {
-			pageAct.selAreaTag = $(this).val();
-			selBuilding();
-		});
-
-		onEvent("change", "#inpBuilding", function () {
-			pageAct.selBuiTag = $(this).val();
-			selFloor();
-		});
-
-		onEvent("change", "#inpFloor", function () {
-			pageAct.selFloTag = $(this).val();
-			selDevice();
-		});
-
 		onEvent("change", "#myImage", function (e) {
 			var imageuploadFormOS = 0;
 			let fileHelper = new YourTeam.Utility.File();
@@ -1201,7 +1078,8 @@
 					return false;
 				}
 			}
-			fileHelper.readAndPreviewImages(this.files, 'forImage', 150, 70, '<div class="file-item">', '<button class="btn-dark" name="btnDelImg" ><i class="fa fa-times"></i></button></div>');
+			if (/\.(jpe?g|png|gif)$/i.test(this.file.name))
+			fileHelper.readAndPreviewImages(this.files, 'forImage', 150, 70, '<div class="file-item">', '<button class="btn-info" name="btnDelImg" ><i class="fa fa-times"></i></button></div>');
 			$.each(this.files, function (i, v) {
 				let fd = new FormData();
 				let file = v;
@@ -1223,5 +1101,34 @@
 
 			elem.remove();
 		});
+
+		onEvent("change", "#inpFirmSelSysMain", function () {
+			let mainTag = $("#inpFirmSelSysMain").find('option:selected').val();
+			$(`[data-main=${mainTag}]`).attr('hidden', false);
+			$('#inpFirmSelSysSub').find(`option[data-main!=${mainTag}]`).attr('hidden', true);
+			$(`#inpFirmSelSysSub option`).removeAttr('selected');
+			$($(`#inpFirmSelSysSub option[data-main=${mainTag}]`)[0]).attr('selected', 'selected')
+		});
+
+		onEvent("change", "#inpFixDoCode", function () {
+			elemSel = $(this).find('option:selected');
+			pageAct.sysSub = elemSel.data('sub');
+			pageAct.sysMain = elemSel.data('main');
+			pageAct.floor = elemSel.data('floor');
+			pageAct.number = elemSel.val();
+			selOpeFir();
+			errCodeList();
+		});
+
+	}
+
+	function errCodeList() {
+		let _pathArr = pageAct.number.split("_"); //TPE_B1_ELEV_EL_R2F_NA_ELEV1_N1
+		let _devicePath = _pathArr[0] + "_" + _pathArr[1] + "_" + _pathArr[2] + "_" + _pathArr[3] + "_" + _pathArr[4] + "_" + _pathArr[5];
+		getOneDeviceAlarmTop10ByBaja(_devicePath, callbackForErr);
+	}
+
+	function callbackForErr(res) {
+		console.log(res);
 	}
 </script>
\ No newline at end of file
diff --git a/Frontend/css/site.css b/Frontend/css/site.css
index 974af21..16e1f90 100644
--- a/Frontend/css/site.css
+++ b/Frontend/css/site.css
@@ -488,3 +488,13 @@ input.toggle:checked {
 .t-yellow {
     color: var(--yt-yellow-1);
 }
+
+.custom-select-ri {
+    -moz-appearance: none;
+    -webkit-appearance: none;
+    appearance: none;
+}
+
+.custom-radio-input {
+    vertical-align: middle;
+}
\ No newline at end of file
diff --git a/Frontend/index.html b/Frontend/index.html
index 7d448b8..d32ff43 100644
--- a/Frontend/index.html
+++ b/Frontend/index.html
@@ -1491,8 +1491,8 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
                             </a>
                         </div>
                         <div class="btn-group mx-4">
-                            <a href="javascript:;" class="dropdown-toggle no-arrow text-center blink"
-                               data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
+                            <a href="javascript:;" name="topFunBtn" class="dropdown-toggle no-arrow text-center"
+                               data-page="alert">
                                 <i class="fal fa-bell fa-2x"></i><br>即時告警
                             </a>
                         </div>
@@ -2113,6 +2113,7 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
                 // - 會被清洗，有類似程序需放入 loadPack1 Function rquired 引用
                 // (原 datatable.bundle.js require 會出問題，先以 cdn datatable.min.js引用)
                 require(["jquery"], loadedBasePack);
+                
             })
 
             /**
@@ -2164,6 +2165,7 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
                 } else {
                     isValidLogin();
                 }
+				showMainSys();
                 $(loadEle).Loading("close");
             }
 
@@ -2577,7 +2579,18 @@ License: You must have a valid license purchased only from wrapbootstrap.com (li
             $(loadEle).Loading("close");
         }
 
-        
+        function showMainSys() {
+			let url = baseApiUrl + "/Utility/isShowMaiSys";
+			
+			ytAjax = new YourTeam.Ajax(url, null, function (res) {
+				if (!res || res.code != "0000") {
+
+                } else {
+                    pageAct.mainStatus = res.data;
+				}
+            }, null, "POST").send();
+
+		}
     </script>
 
 </body>
diff --git a/Frontend/js/style.js b/Frontend/js/style.js
index 586bdbc..bbaeaa5 100644
--- a/Frontend/js/style.js
+++ b/Frontend/js/style.js
@@ -1566,9 +1566,9 @@ YT.Loading = function (type, ele = null, text = null, delay = 0) {
 //change css of clicked button
 function btnSelCss(elem) {
     $.each($(elem).parent().find('button'), function (i, v) {
-        $(v).removeClass('btn-dark');
+        $(v).removeClass('btn-info');
         $(v).addClass('btn-secondary');
     });
     $(elem).removeClass('btn-secondary');
-    $(elem).addClass('btn-dark');
+    $(elem).addClass('btn-info');
 }
\ No newline at end of file
diff --git a/FrontendWebApi/ApiControllers/DashboardController.cs b/FrontendWebApi/ApiControllers/DashboardController.cs
new file mode 100644
index 0000000..7cc76f5
--- /dev/null
+++ b/FrontendWebApi/ApiControllers/DashboardController.cs
@@ -0,0 +1,46 @@
+using FrontendWebApi.Models;
+using Microsoft.AspNetCore.Http;
+using Microsoft.AspNetCore.Mvc;
+using Microsoft.Extensions.Logging;
+using NPOI.SS.Formula.Functions;
+using Repository.BackendRepository.Interface;
+using Repository.FrontendRepository.Interface;
+using System;
+using System.Data.SqlTypes;
+using System.IO;
+using System.Threading.Tasks;
+
+namespace FrontendWebApi.ApiControllers
+{
+    public class DashboardController : MyBaseApiController<GraphManageController>
+    {
+        private readonly IBackendRepository backendRepository;
+        private readonly IFrontendRepository frontendRepository;
+
+        public DashboardController(IBackendRepository backendRepository, IFrontendRepository frontendRepository)
+        {
+            this.backendRepository = backendRepository;
+            this.frontendRepository = frontendRepository;
+        }
+
+        [HttpPost]
+        public async Task<ActionResult<ApiResult<WorkOrderGraph>>> DashAlert()
+        {
+            ApiResult<WorkOrderGraph> apiResult = new ApiResult<WorkOrderGraph>();
+            try
+            {
+                var sqlString = $@"select ";
+
+                //apiResult.Data = ;
+                apiResult.Code = "0000";
+            }
+            catch (Exception exception)
+            {
+                apiResult.Code = "9999";
+                Logger.LogError("【" + controllerName + "/" + actionName + "】" + exception.Message);
+                return Ok(apiResult);
+            }
+            return Ok(apiResult);
+        }
+    }
+}
diff --git a/FrontendWebApi/ApiControllers/FileController.cs b/FrontendWebApi/ApiControllers/FileController.cs
index 849fe7c..53be5c5 100644
--- a/FrontendWebApi/ApiControllers/FileController.cs
+++ b/FrontendWebApi/ApiControllers/FileController.cs
@@ -3,7 +3,9 @@ using Microsoft.AspNetCore.Mvc;
 using Repository.BackendRepository.Interface;
 using Repository.FrontendRepository.Interface;
 using System;
+using System.IdentityModel.Tokens.Jwt;
 using System.IO;
+using System.Net;
 
 namespace FrontendWebApi.ApiControllers
 {
@@ -60,5 +62,19 @@ namespace FrontendWebApi.ApiControllers
             else
                 return false;
         }
+
+        [HttpGet]
+        [Route("api/df")]
+        public ActionResult DownloadFile(string path, string fileName, string token)
+        {
+            var jwt = new JwtSecurityTokenHandler().ReadJwtToken(token);
+            if (jwt == null)
+                return Unauthorized(HttpStatusCode.Unauthorized);
+            else if (fileName == null)
+                return NotFound("找不到文件");
+
+            var filePath = Path.Combine(Directory.GetCurrentDirectory(), "wwwroot", "excel", path);
+            return File(System.IO.File.ReadAllBytes(Path.Combine(filePath, fileName)), "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet", fileName);
+        }
     }
 }
diff --git a/FrontendWebApi/ApiControllers/LoginController.cs b/FrontendWebApi/ApiControllers/LoginController.cs
index 5a449e5..151f5db 100644
--- a/FrontendWebApi/ApiControllers/LoginController.cs
+++ b/FrontendWebApi/ApiControllers/LoginController.cs
@@ -136,19 +136,5 @@ namespace FrontendWebApi.ApiControllers
 
             return Ok(apiResult);
         }
-
-        [HttpGet]
-        [Route("api/df")]
-        public ActionResult DownloadFile(string path, string fileName, string token)
-        {
-            var jwt = new JwtSecurityTokenHandler().ReadJwtToken(token);
-            if (jwt == null)
-                return Unauthorized(HttpStatusCode.Unauthorized);
-            else if (fileName == null)
-                return NotFound("找不到文件");
-
-            var filePath = Path.Combine(Directory.GetCurrentDirectory(), "wwwroot", "excel", path);
-            return File(System.IO.File.ReadAllBytes(Path.Combine(filePath, fileName)), "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet", fileName);
-        }
     }
 }
diff --git a/FrontendWebApi/ApiControllers/OperationController.cs b/FrontendWebApi/ApiControllers/OperationController.cs
index c3b259e..0a18cf9 100644
--- a/FrontendWebApi/ApiControllers/OperationController.cs
+++ b/FrontendWebApi/ApiControllers/OperationController.cs
@@ -203,10 +203,10 @@ namespace FrontendWebApi.ApiControllers
 
             try
             {
-                var sqlString = @$"select device_number, concat(device_floor_tag, ' ', device_last_name, ' ', device_serial_tag) as device_name, full_name
-                                   from device where deleted = 0 and device_area_tag = @device_area_tag and device_building_tag = @device_building_tag and device_floor_tag = @device_floor_tag and device_system_tag = @main_system_tag and device_name_tag = @sub_system_tag ";
+                var sqlString = @$"select device_number, concat(device_floor_tag, ' ', full_name) as device_name, full_name, device_floor_tag, device_system_tag, device_name_tag
+                                   from device where deleted = 0 and device_area_tag = @device_area_tag and device_building_tag = @device_building_tag and device_name_tag in @list_sub_system_tag  ";
 
-                var param = new { @device_building_tag = bl.device_building_tag, @device_floor_tag = bl.device_floor_tag, @device_area_tag = bl.device_area_tag, @main_system_tag = bl.main_system_tag, @sub_system_tag = bl.sub_system_tag };
+                var param = new { @device_building_tag = bl.device_building_tag, @device_area_tag = bl.device_area_tag, @list_sub_system_tag = bl.list_sub_system_tag };
 
                 d = await backendRepository.GetAllAsync<Device>(sqlString, param);
 
@@ -747,6 +747,33 @@ namespace FrontendWebApi.ApiControllers
         }
 
         #region 廠商
+        /// <summary>
+        /// 廠商資料列表(搜寻) / selection列表 ofl = null
+        /// </summary>
+        /// <param name="ofl"></param>
+        /// <returns></returns>
+        public async Task<ApiResult<List<Operation_Firm>>> OpeFirSel([FromBody] OperationFindList ofl)
+        {
+            ApiResult<List<Operation_Firm>> apiResult = new ApiResult<List<Operation_Firm>>();
+            List<Operation_Firm> opList = new List<Operation_Firm>();
+            try
+            {
+                var sqlString = $@"select id, name from operation_firm where deleted = 0 and device_system_category_layer3 in @sub_system_tag";
+                opList = await backendRepository.GetAllAsync<Operation_Firm>(sqlString, new { @sub_system_tag = ofl.sub_system_tag });
+
+                apiResult.Code = "0000";
+                apiResult.Data = opList;
+            }
+            catch (Exception exception)
+            {
+                apiResult.Code = "9999";
+                apiResult.Msg = "系統內部錯誤，請聯絡管理者。";
+                Logger.LogError("【" + controllerName + "/" + actionName + "】" + exception.Message);
+            }
+
+            return apiResult;
+        }
+
         /// <summary>
         /// 廠商資料列表(搜寻) / selection列表 ofl = null
         /// </summary>
@@ -761,10 +788,10 @@ namespace FrontendWebApi.ApiControllers
             {
                 if (ofl != null)
                 {
-                    if (ofl.start_created_at != null || ofl.end_created_at != null)
-                    {
-                        sWhere += $@" and (ofi.created_at >= ifnull(@start_created_at, ofi.created_at) AND ofi.created_at <= ifnull(@end_created_at, ofi.created_at))";
-                    }
+                    //if (ofl.start_created_at != null || ofl.end_created_at != null)
+                    //{
+                    //    sWhere += $@" and (ofi.created_at >= ifnull(@start_created_at, ofi.created_at) AND ofi.created_at <= ifnull(@end_created_at, ofi.created_at))";
+                    //}
                     //else if (ofl.today)
                     //{
                     //    sWhere += $@" and convert(of.created_at, DATE) = convert(NOW(), DATE)";
@@ -790,7 +817,7 @@ namespace FrontendWebApi.ApiControllers
                                     left join variable v2 on v1.id = v2.system_parent_id and ofi.device_system_category_layer3 = v2.system_value and v2.system_type = @sub_system_type and v2.deleted = 0
                                     where ofi.deleted = 0" + sWhere;
 
-                    var param = new { @main_system_type = main_system_type, @sub_system_type = sub_system_type, @start_created_at = ofl.start_created_at, @end_created_at = ofl.end_created_at, @sub_system_tag = ofl.sub_system_tag, @main_system_tag = ofl.main_system_tag };
+                    var param = new { @main_system_type = main_system_type, @sub_system_type = sub_system_type, @sub_system_tag = ofl.sub_system_tag, @main_system_tag = ofl.main_system_tag };
                     opList = await backendRepository.GetAllAsync<Operation_Firm>(sqlString, param);
                 }
                 else
diff --git a/FrontendWebApi/ApiControllers/UtilityController.cs b/FrontendWebApi/ApiControllers/UtilityController.cs
new file mode 100644
index 0000000..58bd7b4
--- /dev/null
+++ b/FrontendWebApi/ApiControllers/UtilityController.cs
@@ -0,0 +1,131 @@
+using FrontendWebApi.Models;
+using Microsoft.AspNetCore.Http;
+using Microsoft.AspNetCore.Mvc;
+using Microsoft.CodeAnalysis.CSharp;
+using Microsoft.Extensions.Logging;
+using Newtonsoft.Json;
+using Newtonsoft.Json.Linq;
+using Repository.BackendRepository.Interface;
+using Repository.FrontendRepository.Interface;
+using System;
+using System.Collections.Generic;
+using System.Collections.Specialized;
+using System.Diagnostics;
+using System.IO;
+using System.Linq;
+using System.Net;
+using System.Text;
+using System.Threading.Tasks;
+
+namespace FrontendWebApi.ApiControllers
+{
+    //[Route("api/[controller]")]
+    //[ApiController]
+    public class UtilityController : MyBaseApiController<DeviceManageController>
+    {
+        private readonly IBackendRepository backendRepository;
+        private readonly IFrontendRepository frontendRepository;
+
+        public UtilityController(IBackendRepository backendRepository, IFrontendRepository frontendRepository)
+        {
+            this.backendRepository = backendRepository;
+            this.frontendRepository = frontendRepository;
+        }
+
+        public async Task<ActionResult<ApiResult<bool>>> isShowMaiSys()
+        {
+            ApiResult<bool> apiResult = new ApiResult<bool>(jwt_str);
+            try
+            {
+                var isShow = await backendRepository.GetOneAsync<string>("select system_value from variable where system_type = 'show_main_system' and deleted = 0");
+                var isBool = bool.Parse(isShow);
+                apiResult.Data = isBool;
+                apiResult.Code = "0000";
+            }
+            catch (Exception exception)
+            {
+                apiResult.Code = "9999";
+                apiResult.Msg = "系統內部錯誤，請聯絡管理者。";
+                Logger.LogError("【" + controllerName + "/" + actionName + "】" + exception.Message);
+                return Ok(apiResult);
+            }
+            return Ok(apiResult);
+        }
+
+        /// <summary>
+        /// 即時趨勢條件過濾條件面板
+        /// </summary>
+        /// <param name="account"></param>
+        /// <returns></returns>
+        [HttpPost]
+        [Route("api/GetMainSub")]
+        public async Task<ActionResult<ApiResult<History_MainSubBuildFloor>>> GetMainSub([FromBody] HistoryFind hf)
+        {
+            ApiResult<History_MainSubBuildFloor> apiResult = new ApiResult<History_MainSubBuildFloor>(jwt_str);
+            if (!jwtlife)
+            {
+                apiResult.Code = "5000";
+                return BadRequest(apiResult);
+            }
+            else if (string.IsNullOrEmpty(hf.building_tag))
+            {
+                apiResult.Code = "0002";
+                apiResult.Msg = "必須選擇東別";
+                return apiResult;
+            }
+
+            try
+            {
+                var dbsub = await frontendRepository.GetAllAsync<HistoryDBMainSub>(
+                    @$"select distinct v1.system_key main_name, v1.system_value main_system_tag, v2.system_key sub_name, v2.system_value sub_system_tag, v1.system_priority, v2.system_priority,
+                                       d.device_number, d.full_name as device_full_name, d.device_serial_tag
+                        from role_auth a
+                        join auth_page b on a.AuthCode = b.AuthCode
+                        join userinfo c on c.role_guid = a.role_guid
+                        join variable v2 on b.ShowView = v2.id and v2.system_type = @sub_system_type
+                        join variable v1 on v1.id = v2.system_parent_id and v1.system_type = @main_system_type
+                        left join device d on v1.system_value = d.device_system_tag and v2.system_value = d.device_name_tag and d.deleted = 0
+                        where c.account = @account
+                        order by v1.system_priority, v2.system_priority", new { @account = myUser.account, @sub_system_type = sub_system_type, @main_system_type = main_system_type });
+                var dbbuilding = await frontendRepository.GetAllAsync<History_Build>(
+                    @$"select distinct d.building_guid,d.full_name,d.priority from role_auth a
+                        join auth_page b on a.AuthCode = b.AuthCode
+                        join userinfo c on c.role_guid = a.role_guid
+                        join building d on d.building_tag = b.building_tag
+                        where c.account = @account and d.building_tag = @building_tag
+                        order by d.priority 
+                        ", new { @account = myUser.account, @building_tag = hf.building_tag });
+                var mains = dbsub.GroupBy(a => a.main_system_tag).ToList();
+                apiResult.Data = new History_MainSubBuildFloor();
+                apiResult.Data.history_Main_Systems = new List<History_Main_system>();
+                foreach (var main in mains)
+                {
+                    History_Main_system history_Main_System = new History_Main_system();
+                    history_Main_System.main_system_tag = main.Select(a => a.main_system_tag).FirstOrDefault();
+                    history_Main_System.full_name = main.Select(a => a.main_name).FirstOrDefault();
+
+                    var subs = dbsub.Where(x => x.main_system_tag == main.Select(m => m.main_system_tag).FirstOrDefault()).GroupBy(x => x.sub_system_tag).ToList();
+                    history_Main_System.History_Sub_systems = subs.Count > 0 ? new List<History_Sub_system>() : null;
+                    foreach (var sub in subs)
+                    {
+                        History_Sub_system history_Sub_System = new History_Sub_system();
+                        history_Sub_System.full_name = sub.Select(x => x.sub_name).FirstOrDefault();
+                        history_Sub_System.sub_system_tag = sub.Select(x => x.sub_system_tag).FirstOrDefault();
+                        history_Main_System.History_Sub_systems.Add(history_Sub_System);
+                    }
+                    apiResult.Data.history_Main_Systems.Add(history_Main_System);
+                }
+                apiResult.Data.history_Builds = dbbuilding;
+                apiResult.Code = "0000";
+            }
+            catch (Exception exception)
+            {
+                apiResult.Code = "9999";
+                apiResult.Msg = "系統內部錯誤，請聯絡管理者。";
+                Logger.LogError("【" + controllerName + "/" + actionName + "】" + exception.Message);
+                return Ok(apiResult);
+            }
+            return Ok(apiResult);
+        }
+    }
+}
diff --git a/FrontendWebApi/Models/Build.cs b/FrontendWebApi/Models/Build.cs
index 31d0f9f..f4d85dc 100644
--- a/FrontendWebApi/Models/Build.cs
+++ b/FrontendWebApi/Models/Build.cs
@@ -159,6 +159,7 @@ namespace FrontendWebApi.Models
         public string device_building_tag { get; set; }
         public string device_system_tag { get; set; }
         public string device_floor_tag { get; set; }
+        public string device_name { get; set; }
         public string device_name_tag { get; set; }
         public string device_serial_tag { get; set; }
         public string device_last_name { get; set; }
diff --git a/FrontendWebApi/Models/Dashboard.cs b/FrontendWebApi/Models/Dashboard.cs
new file mode 100644
index 0000000..2214668
--- /dev/null
+++ b/FrontendWebApi/Models/Dashboard.cs
@@ -0,0 +1,10 @@
+namespace FrontendWebApi.Models
+{
+    public class WorkOrderGraph
+    {
+        public int DoneCnt { get; set; }
+        public int NotDoneCnt { get; set; }
+        public int DispatchCnt{ get; set; }
+        public int NotDispatchCnt { get; set; }
+    }
+}
diff --git a/FrontendWebApi/Models/Operation.cs b/FrontendWebApi/Models/Operation.cs
index 7f72f17..a11b0ae 100644
--- a/FrontendWebApi/Models/Operation.cs
+++ b/FrontendWebApi/Models/Operation.cs
@@ -58,6 +58,7 @@ namespace FrontendWebApi.Models
         public string building_name { get; set; }
         public string main_system_tag { get; set; }//大类tag
         public string sub_system_tag { get; set; }//小类tag
+        public List<string> list_sub_system_tag { get; set; }
     }
 
     public class Operation_Record : Actor