<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ taglib prefix="sec" uri="http://www.springframework.org/security/tags" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>systemManagement</title>
<script
	src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<link rel="stylesheet" href="/css/header.css">
<link rel="stylesheet" href="/css/systemManagement.css">
<link rel="stylesheet"
	href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
<script type="text/javascript" src="/js/header.js"></script>
<script type="text/javascript" src="/js/systemManagement.js"></script>
</head>
<body>
	<div class="menu">
		<div></div>
		<div class="unselect-dashboard"></div>
		<div class="unselect-record"></div>
		<div class="unselect-statistics"></div>
		<div class="select-system-manager"></div>
		<sec:authorize access="isAuthenticated()"><div>Log-Out</div></sec:authorize>
	</div>
	<br>
	<div class="systemManagement-container">
		<div>
			<div class="manager-on node">노드 관리</div>
			<div class="manager-off consummer">Consumer 관리</div>
			<div class="manager-off alarm">알람 정책 관리</div>
		</div>
		<div class="result-box">
			<div class="node-search">
				<div>
					지역(시): <select class="city-select">
						<option value="">지역(시)를 선택해주세요</option>
					</select>
				</div>
				<div>
					군/구 : <select class="gu-select">
						<option value="">군/구를 선택해주세요</option>
					</select>
				</div>
				<div>
					교차로 : <select class="intersection-select">
						<option value="">교차로를 선택해주세요</option>
					</select>
				</div>
				<div class="search-button"></div>
				<div class="excel-button">
					<i class='fa fa-file-excel-o' style="font-size: 25px;" aria-hidden='true'></i> 엑셀
				</div>
				<div class="add-button">
					<i class="fa fa-plus" style="font-size: 25px;" aria-hidden='true'></i> &nbsp;추 가
				</div>
				<div class="cancle-button">
					<i class="fa fa-times-circle-o" style="font-size: 25px;" aria-hidden='true'></i>
					&nbsp;취 소
				</div>
				<div class="update-button">
					<i class="fa fa-pencil-square-o" style="font-size: 25px;" aria-hidden='true'></i>
					&nbsp;수 정
				</div>
				<div class="save-button">
					<i class="fa fa-floppy-o" style="font-size: 25px;" aria-hidden='true'></i>
					&nbsp;저 장
				</div>
				<div class="delete-button">
					&nbsp;<i class="fa fa-trash-o" style="font-size: 25px;" aria-hidden='true'></i> 삭
					제
				</div>
			</div>

			<%--Consumer 관리 클릭시에만 나옴 --%>
			<div class="consumer-search">
				<div>
					업체명 : <input type="text" placeholder="조회하실 업체를 입력해주세요">
				</div>
				<div class="consumer-search-button"></div>
				<div class="excel-button">
					<i class='fa fa-file-excel-o' style="font-size: 25px;" aria-hidden='true'></i> 엑셀
				</div>
				<div class="consumer-add-button">
					<i class="fa fa-plus" style="font-size: 25px;" aria-hidden="true"></i> &nbsp;추 가
				</div>
				<div class="consumer-cancle-button">
					<i class="fa fa-times-circle-o" style="font-size: 25px;" aria-hidden="true"></i>
					&nbsp;취 소
				</div>
				<div class="consumer-update-button">
					<i class="fa fa-pencil-square-o" style="font-size: 25px;" aria-hidden="true"></i>
					&nbsp;수 정
				</div>
				<div class="consumer-save-button">
					<i class="fa fa-floppy-o" style="font-size: 25px;" aria-hidden="true"></i>
					&nbsp;저 장
				</div>
				<div class="consumer-delete-button">
					&nbsp;<i class="fa fa-trash-o" style="font-size: 25px;" aria-hidden="true"></i> 삭
					제
				</div>
			</div>

			<%--ApiToken 정책관리 클릭시에만 나옴 --%>
			<div class="alarm-search">
				<div class="alarm-cancel-button">
					<i class="fa fa-times-circle-o" style="font-size: 25px;" aria-hidden="true"></i>
					&nbsp;취 소
				</div>
				<div class="alarm-update-button">
					<i class="fa fa-pencil-square-o" style="font-size: 25px;" aria-hidden="true"></i>
					&nbsp;수 정
				</div>
				<div class="alarm-save-button">
					<i class="fa fa-floppy-o" style="font-size: 25px;" aria-hidden="true"></i>
					&nbsp;저 장
				</div>
			</div>

			<%--Table 표출 할 곳--%>
			<div class="table-box">
				<div class="data-table-box">
					<table class="data-table">
					</table>
				</div>
			</div>
			<div class="consumer-box2">
				<div class="data-table-box">
					<table class="consumer-info">
					</table>
					<table class="config-table">
					</table>
				</div>
			</div>
		</div>
	</div>
</body>
</html>