환경부 대시보드 및 스케줄러 샘플 페이지 작업
This commit is contained in:
parent
f4d12c87eb
commit
883254e05f
|
|
@ -58,7 +58,7 @@
|
||||||
|
|
||||||
@layer base {
|
@layer base {
|
||||||
body {
|
body {
|
||||||
@apply bg-base-background text-base-text font-['Pretendard-Regular']
|
@apply bg-base-background text-base-text font-['Godo']
|
||||||
}
|
}
|
||||||
|
|
||||||
hr {
|
hr {
|
||||||
|
|
@ -94,7 +94,7 @@
|
||||||
|
|
||||||
/*Form*/
|
/*Form*/
|
||||||
.label-style {
|
.label-style {
|
||||||
@apply block my-1 font-bold text-default-slate-dark
|
@apply block my-1 text-default-slate-dark
|
||||||
}
|
}
|
||||||
|
|
||||||
.select-style {
|
.select-style {
|
||||||
|
|
@ -125,12 +125,12 @@
|
||||||
|
|
||||||
@layer utilities {
|
@layer utilities {
|
||||||
.header {
|
.header {
|
||||||
@apply p-4 text-lg font-bold h-16 flex justify-between items-center;
|
@apply p-4 text-lg h-16 flex justify-between items-center;
|
||||||
}
|
}
|
||||||
|
|
||||||
.side-bar {
|
.side-bar {
|
||||||
/*@apply w-[16rem] pl-4 text-lg font-bold divide-y divide-base-border;*/
|
/*@apply w-[16rem] pl-4 text-lg divide-y divide-base-border;*/
|
||||||
@apply w-[16rem] p-4 text-lg font-bold;
|
@apply w-[16rem] p-4 text-lg;
|
||||||
}
|
}
|
||||||
|
|
||||||
.content {
|
.content {
|
||||||
|
|
@ -138,15 +138,15 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.page-title {
|
.page-title {
|
||||||
@apply text-xl font-bold;
|
@apply text-xl;
|
||||||
}
|
}
|
||||||
|
|
||||||
.search-title {
|
.search-title {
|
||||||
@apply text-base font-bold;
|
@apply text-base;
|
||||||
}
|
}
|
||||||
|
|
||||||
.form-title {
|
.form-title {
|
||||||
@apply text-center text-3xl font-bold tracking-tight text-default-slate-dark
|
@apply text-center text-3xl tracking-tight text-default-slate-dark
|
||||||
}
|
}
|
||||||
|
|
||||||
.field {
|
.field {
|
||||||
|
|
@ -183,7 +183,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.menu-group-items-title {
|
.menu-group-items-title {
|
||||||
@apply text-base font-bold
|
@apply text-base
|
||||||
}
|
}
|
||||||
|
|
||||||
.copyright {
|
.copyright {
|
||||||
|
|
@ -195,6 +195,10 @@
|
||||||
@apply rounded-md min-h-32 p-4 flex flex-col justify-between cursor-pointer shadow-xs
|
@apply rounded-md min-h-32 p-4 flex flex-col justify-between cursor-pointer shadow-xs
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.dashboard-title {
|
||||||
|
@apply text-2xl
|
||||||
|
}
|
||||||
|
|
||||||
/*Pagy*/
|
/*Pagy*/
|
||||||
.pagy {
|
.pagy {
|
||||||
@apply flex items-center justify-center space-x-1 font-semibold text-sm text-default-slate;
|
@apply flex items-center justify-center space-x-1 font-semibold text-sm text-default-slate;
|
||||||
|
|
@ -234,7 +238,7 @@
|
||||||
}
|
}
|
||||||
|
|
||||||
.base-table th {
|
.base-table th {
|
||||||
@apply p-3 text-left font-bold lg:table-cell
|
@apply p-3 text-left lg:table-cell
|
||||||
}
|
}
|
||||||
|
|
||||||
.base-table tr {
|
.base-table tr {
|
||||||
|
|
@ -260,11 +264,11 @@
|
||||||
|
|
||||||
@media (min-width: 640px) {
|
@media (min-width: 640px) {
|
||||||
.page-title {
|
.page-title {
|
||||||
@apply text-3xl font-bold;
|
@apply text-3xl;
|
||||||
}
|
}
|
||||||
|
|
||||||
.search-title {
|
.search-title {
|
||||||
@apply text-lg font-bold;
|
@apply text-lg;
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
@ -312,3 +316,10 @@
|
||||||
font-weight: 400;
|
font-weight: 400;
|
||||||
font-style: normal;
|
font-style: normal;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@font-face {
|
||||||
|
font-family: 'Godo';
|
||||||
|
font-style: normal;
|
||||||
|
font-weight: 400;
|
||||||
|
src: url('https://fastly.jsdelivr.net/korean-webfonts/1/corps/godo/Godo/GodoM.woff2') format('woff2'), url('https://fastly.jsdelivr.net/korean-webfonts/1/corps/godo/Godo/GodoM.woff') format('woff');
|
||||||
|
}
|
||||||
|
|
@ -3,77 +3,16 @@
|
||||||
<%= link_to environment_index_path(id: params[:id]), class: "flex items-center" do %>
|
<%= link_to environment_index_path(id: params[:id]), class: "flex items-center" do %>
|
||||||
<i class="fa-solid fa-angle-left text-2xl"></i>
|
<i class="fa-solid fa-angle-left text-2xl"></i>
|
||||||
<% end %>
|
<% end %>
|
||||||
<div class="text-2xl font-bold leading-10"><%= @controller.id %>동 온도 스케줄러</div>
|
<div class="text-2xl font-bold leading-10"><%= @controller.id %>동 환경 스케줄러</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="space-y-4 overflow-y-hidden divide-y divide-base-border bg-base-content rounded-lg p-4">
|
<div class="space-y-4 overflow-y-hidden divide-y divide-base-border">
|
||||||
<%= form_with url: edit_temp_environment_path, method: :post, class: 'flex flex-col h-full' do %>
|
<%= form_with url: edit_temp_environment_path, method: :post, class: 'flex flex-col h-full' do %>
|
||||||
<%= hidden_field_tag :controller_id, params[:id] %>
|
<div class="flex flex-col h-full">
|
||||||
<div class="flex flex-col divide-y divide-base-border overflow-y-hidden flex-1 space-y-4">
|
<div class="flex flex-col overflow-y-hidden flex-1 space-y-4">
|
||||||
|
<div class="flex justify-between">
|
||||||
<%= submit_tag "업데이트", class: "btn bg-primary w-fit" %>
|
<%= submit_tag "업데이트", class: "btn bg-primary w-fit" %>
|
||||||
<div class="overflow-y-auto flex-1 min-h-0 border border-base-border rounded-lg">
|
|
||||||
<ul class="divide-y divide-base-border whitespace-nowrap relative">
|
|
||||||
<% if @schedule.present? %>
|
|
||||||
<% @schedule.each do |s| %>
|
|
||||||
<li class="flex justify-between items-center px-4 py-2 space-x-4 h-full relative">
|
|
||||||
<div class="flex items-center space-x-4 basis-3/5 h-full">
|
|
||||||
<!-- 시간 -->
|
|
||||||
<div class="flex flex-col lg:flex-row h-full items-center space-x-0 space-y-2 lg:space-x-4 lg:space-y-0">
|
|
||||||
<div class=" text-left w-full lg:w-auto">시간</div>
|
|
||||||
<div class="text-xl flex items-center space-x-1 w-full h-full">
|
|
||||||
<%= select_tag "schedule[#{s.id}][hour]",
|
|
||||||
options_for_select((0..23).map { |h| [h.to_s.rjust(2, '0'), h] }, s.hour),
|
|
||||||
class: "select-style min-w-[60px]" %>
|
|
||||||
<div>:</div>
|
|
||||||
<%= number_field_tag "schedule[#{s.id}][minute]",
|
|
||||||
s.minute, min: 0, max: 59, step: 1, inputmode: "decimal",
|
|
||||||
class: "input-style min-w-[60px]" %>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- 온도 -->
|
|
||||||
<div class="flex flex-col lg:flex-row h-full items-center space-x-0 space-y-2 lg:space-x-4 lg:space-y-0">
|
|
||||||
<div class=" text-left w-full lg:w-auto">온도 (°C)</div>
|
|
||||||
<div class="text-xl flex items-center">
|
|
||||||
<%= number_field_tag "schedule[#{s.id}][temperature]", s.temperature, min: -99, max: 99, step: "0.1", inputmode: "decimal", class: "input-style min-w-[68px]" %>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<div class="flex items-center space-x-4 basis-2/5 justify-end h-full">
|
|
||||||
<!-- 사용 여부 -->
|
|
||||||
<div class="flex flex-col lg:flex-row items-center space-x-0 space-y-2 lg:space-x-4 lg:space-y-0 h-full">
|
|
||||||
<div class="">ON/OFF</div>
|
|
||||||
<label class="relative inline-flex items-center cursor-pointer h-full">
|
|
||||||
<%= check_box_tag "schedule[#{s.id}][is_active]", "1", s.is_active == true || s.is_active == 1, class: "sr-only peer" %>
|
|
||||||
<div class="toggle_style"></div>
|
|
||||||
<div class="btn-toggle-round"></div>
|
|
||||||
</label>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<!-- 삭제 -->
|
|
||||||
<div class="flex flex-col lg:flex-row items-center space-x-0 space-y-2 lg:space-x-4 lg:space-y-0 h-full relative">
|
|
||||||
<div class=""> </div>
|
|
||||||
<%= link_to schedule_path(s),
|
|
||||||
data: { turbo_method: :delete, turbo_confirm: "정말 삭제하시겠습니까?" },
|
|
||||||
class: "btn bg-danger text-sm flex items-center px-2 py-0 my-1.5 lg:px-4 lg:py-1.5 lg:my-0" do %>
|
|
||||||
<div class="hidden lg:block">삭제</div>
|
|
||||||
<div class="block lg:hidden"><i class="fa-solid fa-xmark"></i></div>
|
|
||||||
<% end %>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</li>
|
|
||||||
<% end %>
|
|
||||||
<% else %>
|
|
||||||
<li class="text-center p-4 w-full">저장된 스케줄이 없습니다.</li>
|
|
||||||
<% end %>
|
|
||||||
</ul>
|
|
||||||
</div>
|
|
||||||
<div class="flex space-x-4">
|
<div class="flex space-x-4">
|
||||||
<%= button_to "초기화", reset_schedule_path(params[:id]),
|
<%= link_to "추가하기", open_modals_path(type: "add_feeder_schedule"),
|
||||||
method: :post,
|
|
||||||
data: { turbo_confirm: "정말 초기화하시겠습니까? 모든 스케줄 데이터가 삭제됩니다." },
|
|
||||||
class: "btn bg-danger" %>
|
|
||||||
<%= button_to "추가하기", open_modals_path(type: "add_schedule", id: params[:id]),
|
|
||||||
class: "btn bg-default-slate",
|
class: "btn bg-default-slate",
|
||||||
data: {
|
data: {
|
||||||
turbo_method: :post,
|
turbo_method: :post,
|
||||||
|
|
@ -81,6 +20,85 @@
|
||||||
} %>
|
} %>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
<div class="overflow-y-auto flex-1 min-h-0 border border-base-border rounded-lg bg-base-content">
|
||||||
|
<ul class="divide-y divide-base-border whitespace-nowrap relative">
|
||||||
|
<!-- 헤더 -->
|
||||||
|
<li class="flex justify-between items-center px-4 py-2 text-md font-semibold text-gray-600 bg-base-content rounded-t-md">
|
||||||
|
<div class="flex basis-3/5 space-x-8">
|
||||||
|
<div class="w-[40px]">번호</div>
|
||||||
|
<div class="w-[120px]">시작 시간 (시/분)</div>
|
||||||
|
<div class="w-[120px]">온도 (°C)</div>
|
||||||
|
<div class="w-[120px]">습도 (%)</div>
|
||||||
|
<div class="w-[120px]">CO<span class="text-xs">2</span></div>
|
||||||
|
</div>
|
||||||
|
<div class="flex basis-2/5 items-center justify-end space-x-8">
|
||||||
|
<div class="w-[100px] text-center">사용 여부</div>
|
||||||
|
<div class="w-[80px] text-center">작업</div>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
<li class="flex justify-between items-center px-4 py-2 space-x-4 h-full border-b border-base-border relative bg-base-content">
|
||||||
|
<div class="flex items-center basis-3/5 space-x-8 h-full">
|
||||||
|
<!-- 번호 -->
|
||||||
|
<div class="w-[40px]">1</div>
|
||||||
|
|
||||||
|
<!-- 시작 시각 -->
|
||||||
|
<div class="w-[120px] flex space-x-2 items-center">
|
||||||
|
<select class="select-style w-1/2">
|
||||||
|
<option selected>08</option>
|
||||||
|
<option>09</option>
|
||||||
|
<option>10</option>
|
||||||
|
</select>
|
||||||
|
<div> : </div>
|
||||||
|
<select class="select-style w-1/2">
|
||||||
|
<option selected>30</option>
|
||||||
|
<option>45</option>
|
||||||
|
<option>00</option>
|
||||||
|
</select>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 온도 -->
|
||||||
|
<div class="w-[120px] flex space-x-2 items-center">
|
||||||
|
<input type="number" value="15" min="0" max="60" class="input-style w-full" />
|
||||||
|
<div>~</div>
|
||||||
|
<input type="number" value="20" min="0" max="60" class="input-style w-full" />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 습도 -->
|
||||||
|
<div class="w-[120px] flex space-x-2 items-center">
|
||||||
|
<input type="number" value="78" class="input-style" />
|
||||||
|
<div>~</div>
|
||||||
|
<input type="number" value="80" class="input-style" />
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- CO2 -->
|
||||||
|
<div class="w-[130px] flex space-x-2 items-center">
|
||||||
|
<input type="number" value="300" class="input-style" />
|
||||||
|
<div>~</div>
|
||||||
|
<input type="number" value="1000" class="input-style" />
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="flex basis-2/5 justify-end items-center space-x-8 h-full">
|
||||||
|
<!-- 토글 -->
|
||||||
|
<div class="w-[100px] flex justify-center">
|
||||||
|
<label class="relative inline-flex items-center cursor-pointer">
|
||||||
|
<input type="checkbox" checked class="sr-only peer" />
|
||||||
|
<div class="toggle_style"></div>
|
||||||
|
<div class="btn-toggle-round"></div>
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 삭제 버튼 -->
|
||||||
|
<div class="w-[80px] flex justify-center">
|
||||||
|
<button class="btn bg-danger text-md px-2 py-1">삭제</button>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
<% end %>
|
<% end %>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -1,5 +1,5 @@
|
||||||
<div class="w-full h-full content overflow-y-auto">
|
<div class="w-full h-full content overflow-y-auto space-y-4">
|
||||||
<div class="flex-1 grid grid-cols-2 xl:grid-cols-4 gap-4">
|
<div class="flex-1 grid grid-cols-2 xl:grid-cols-3 gap-4">
|
||||||
<!-- 실내온도 -->
|
<!-- 실내온도 -->
|
||||||
<%= link_to edit_temp_environment_path(id: params[:id]), class: "dashboard-group bg-base-content" do %>
|
<%= link_to edit_temp_environment_path(id: params[:id]), class: "dashboard-group bg-base-content" do %>
|
||||||
<div class="flex flex-col justify-between h-full space-y-2">
|
<div class="flex flex-col justify-between h-full space-y-2">
|
||||||
|
|
@ -10,23 +10,19 @@
|
||||||
<span class="text-2xl">온도</span>
|
<span class="text-2xl">온도</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="flex items-center space-x-2">
|
|
||||||
<i class="fa-solid fa-calendar-days text-2xl"></i>
|
|
||||||
<i class="fa-solid fa-angle-right text-2xl opacity-90"></i>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<hr>
|
<hr>
|
||||||
<div class="flex flex-row justify-between items-baseline w-full divide-x divide-base-border">
|
<div class="flex flex-row justify-between items-baseline w-full divide-x divide-base-border">
|
||||||
<div class="flex flex-col items-baseline text-right w-full">
|
<div class="flex flex-col items-baseline text-right w-full">
|
||||||
<div class="opacity-50">현재 온도</div>
|
<div class="opacity-50">현재 온도</div>
|
||||||
<div class="font-bold text-3xl">16.5<span class="font-normal text-2xl"> °C</span></div>
|
<div class="text-3xl">18.5<span class="font-normal text-2xl"> °C</span></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<hr>
|
<hr>
|
||||||
<div class="flex flex-row justify-between items-baseline w-full divide-x divide-base-border">
|
<div class="flex flex-row justify-between items-baseline w-full divide-x divide-base-border">
|
||||||
<div class="flex flex-col items-baseline text-right w-full">
|
<div class="flex flex-col items-baseline text-right w-full">
|
||||||
<div class="opacity-50">설정 온도</div>
|
<div class="opacity-50">설정 온도</div>
|
||||||
<div class="font-bold text-3xl">15.5<span class="font-normal text-2xl"> °C</span></div>
|
<div class="text-3xl">18<span class="font-normal text-2xl"> °C</span> ~ 20<span class="font-normal text-2xl"> °C</span></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -42,23 +38,19 @@
|
||||||
<span class="text-2xl">습도</span>
|
<span class="text-2xl">습도</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="flex items-center space-x-2">
|
|
||||||
<i class="fa-solid fa-calendar-days text-2xl"></i>
|
|
||||||
<i class="fa-solid fa-angle-right text-2xl opacity-90"></i>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<hr>
|
<hr>
|
||||||
<div class="flex flex-row justify-between items-baseline w-full divide-x divide-base-border">
|
<div class="flex flex-row justify-between items-baseline w-full divide-x divide-base-border">
|
||||||
<div class="flex flex-col items-baseline text-right w-full">
|
<div class="flex flex-col items-baseline text-right w-full">
|
||||||
<div class="opacity-50">현재 습도</div>
|
<div class="opacity-50">현재 습도</div>
|
||||||
<div class="font-bold text-3xl">78<span class="font-normal text-2xl"> %</span></div>
|
<div class="text-3xl">78<span class="font-normal text-2xl"> %</span></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<hr>
|
<hr>
|
||||||
<div class="flex flex-row justify-between items-baseline w-full divide-x divide-base-border">
|
<div class="flex flex-row justify-between items-baseline w-full divide-x divide-base-border">
|
||||||
<div class="flex flex-col items-baseline text-right w-full">
|
<div class="flex flex-col items-baseline text-right w-full">
|
||||||
<div class="opacity-50">설정 습도</div>
|
<div class="opacity-50">설정 습도</div>
|
||||||
<div class="font-bold text-3xl">80<span class="font-normal text-2xl"> %</span></div>
|
<div class="text-3xl">75<span class="font-normal text-2xl"> %</span> ~ 80<span class="font-normal text-2xl"> %</span></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -78,141 +70,413 @@
|
||||||
<span class="text-2xl">CO</span><span class="text-xl">2</span>
|
<span class="text-2xl">CO</span><span class="text-xl">2</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="flex items-center space-x-2">
|
|
||||||
<i class="fa-solid fa-calendar-days text-2xl"></i>
|
|
||||||
<i class="fa-solid fa-angle-right text-2xl opacity-90"></i>
|
|
||||||
</div>
|
|
||||||
</div>
|
</div>
|
||||||
<hr>
|
<hr>
|
||||||
<div class="flex flex-row justify-between items-baseline w-full divide-x divide-base-border">
|
<div class="flex flex-row justify-between items-baseline w-full divide-x divide-base-border">
|
||||||
<div class="flex flex-col items-baseline text-right w-full">
|
<div class="flex flex-col items-baseline text-right w-full">
|
||||||
<div class="opacity-50">현재 CO</span><span class="text-sm">2</div>
|
<div class="opacity-50">현재 CO</span><span class="text-sm">2</div>
|
||||||
<div class="font-bold text-3xl">700<span class="font-normal text-2xl"> ppm</span></div>
|
<div class="text-3xl">700<span class="font-normal text-2xl"> ppm</span></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<hr>
|
<hr>
|
||||||
<div class="flex flex-row justify-between items-baseline w-full divide-x divide-base-border">
|
<div class="flex flex-row justify-between items-baseline w-full divide-x divide-base-border">
|
||||||
<div class="flex flex-col items-baseline text-right w-full">
|
<div class="flex flex-col items-baseline text-right w-full">
|
||||||
<div class="opacity-50">최소 CO</span><span class="text-sm">2</div>
|
<div class="opacity-50">최소 CO</span><span class="text-sm">2</div>
|
||||||
<div class="font-bold text-3xl">300<span class="font-normal text-2xl"> ppm</span></div>
|
<div class="text-3xl">300<span class="font-normal text-2xl"> ppm</span></div>
|
||||||
</div>
|
</div>
|
||||||
<div class="flex flex-col items-baseline text-right w-full pl-4">
|
<div class="flex flex-col items-baseline text-right w-full pl-4">
|
||||||
<div class="opacity-50">최대 CO</span><span class="text-sm">2</div>
|
<div class="opacity-50">최대 CO</span><span class="text-sm">2</div>
|
||||||
<div class="font-bold text-3xl">1000<span class="font-normal text-2xl"> ppm</span></div>
|
<div class="text-3xl">1000<span class="font-normal text-2xl"> ppm</span></div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<% end %>
|
<% end %>
|
||||||
|
</div>
|
||||||
|
|
||||||
<!-- none -->
|
<div class="flex-1 grid grid-cols-2 xl:grid-cols-6 gap-4 min-h-32">
|
||||||
<div class="dashboard-group bg-base-content"
|
|
||||||
data-controller="toggle"
|
|
||||||
data-action="click->toggle#toggle"
|
|
||||||
data-toggle-target="background"></div>
|
|
||||||
|
|
||||||
<!-- 랙 -->
|
<!-- 스케줄러 동작 -->
|
||||||
<%= link_to rack_index_path, class: "dashboard-group bg-base-content" do %>
|
<div class="dashboard-group cursor-pointer w-full h-full bg-base-content">
|
||||||
|
<div class="flex flex-col justify-between h-full">
|
||||||
|
<div class="dashboard-title" data-modbus-target="statusTitle">스케줄러 동작</div>
|
||||||
|
<div class="flex flex-row justify-end items-baseline w-full">
|
||||||
|
<div class="flex size-12 items-center justify-center">
|
||||||
|
<i class="fa-solid fa-play text-etc-color text-5xl text-left"></i>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 긴급 정지 -->
|
||||||
|
<div class="dashboard-group cursor-pointer w-full h-full bg-base-content">
|
||||||
|
<div class="flex flex-col justify-between h-full">
|
||||||
|
<div class="dashboard-title">긴급 정지</div>
|
||||||
|
<div class="flex flex-row justify-end items-baseline w-full">
|
||||||
|
<div class="flex size-12 items-center justify-center">
|
||||||
|
<i class="fa-solid fa-stop text-etc-color text-5xl text-left"></i>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- LED 스케줄러 설정 -->
|
||||||
|
<div class="dashboard-group cursor-pointer w-full h-full bg-base-content">
|
||||||
|
<div class="flex flex-col justify-between h-full">
|
||||||
|
<div class="dashboard-title">LED 스케줄러 설정</div>
|
||||||
|
<div class="flex flex-row justify-end items-baseline w-full">
|
||||||
|
<div class="flex size-12 items-center justify-center">
|
||||||
|
<i class="fa-solid fa-calendar-days text-etc-color text-5xl text-left"></i>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 재배용 FAN 스케줄러 설정 -->
|
||||||
|
<div class="dashboard-group cursor-pointer w-full h-full bg-base-content">
|
||||||
|
<div class="flex flex-col justify-between h-full">
|
||||||
|
<div class="dashboard-title">재배용 FAN 스케줄러 설정</div>
|
||||||
|
<div class="flex flex-row justify-end items-baseline w-full">
|
||||||
|
<div class="flex size-12 items-center justify-center">
|
||||||
|
<i class="fa-solid fa-calendar-days text-etc-color text-5xl text-left"></i>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 환기용 FAN 스케줄러 설정 -->
|
||||||
|
<div class="dashboard-group cursor-pointer w-full h-full bg-base-content">
|
||||||
|
<div class="flex flex-col justify-between h-full">
|
||||||
|
<div class="dashboard-title">환기용 FAN 스케줄러 설정</div>
|
||||||
|
<div class="flex flex-row justify-end items-baseline w-full">
|
||||||
|
<div class="flex size-12 items-center justify-center">
|
||||||
|
<i class="fa-solid fa-calendar-days text-etc-color text-5xl text-left"></i>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 환경 스케줄러 설정 -->
|
||||||
|
<div class="dashboard-group cursor-pointer w-full h-full bg-base-content">
|
||||||
|
<div class="flex flex-col justify-between h-full">
|
||||||
|
<div class="dashboard-title">환경 스케줄러 설정</div>
|
||||||
|
<div class="flex flex-row justify-end items-baseline w-full">
|
||||||
|
<div class="flex size-12 items-center justify-center">
|
||||||
|
<i class="fa-solid fa-calendar-days text-etc-color text-5xl text-left"></i>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="flex-1 grid grid-cols-2 xl:grid-cols-6 gap-4">
|
||||||
|
<!-- 1번 랙 -->
|
||||||
|
<div class="dashboard-group bg-base-content">
|
||||||
<div class="flex flex-col justify-between h-full space-y-2">
|
<div class="flex flex-col justify-between h-full space-y-2">
|
||||||
<div class="flex flex-row justify-between w-full">
|
<div class="flex flex-row justify-between w-full">
|
||||||
<div class="flex flex-row space-x-4 items-center">
|
<div class="flex flex-row space-x-4 items-center">
|
||||||
<i class="fa-solid fa-timeline text-etc-color text-4xl text-left"></i>
|
<i class="fa-solid fa-timeline text-etc-color text-4xl text-left"></i>
|
||||||
<div class="items-baseline">
|
<div class="items-baseline">
|
||||||
<span class="text-2xl">랙</span>
|
<span class="text-2xl">1번 랙</span>
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="flex items-center space-x-2">
|
|
||||||
<i class="fa-solid fa-gear text-2xl"></i>
|
|
||||||
<i class="fa-solid fa-angle-right text-2xl opacity-90"></i>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<hr>
|
|
||||||
<div class="flex flex-row justify-between items-baseline w-full divide-x divide-base-border">
|
|
||||||
<div class="flex flex-col items-baseline text-right w-full">
|
|
||||||
<div class="opacity-50">현재 랙 정보</div>
|
|
||||||
<div class="font-bold text-3xl">5<span class="font-normal text-2xl"> 라인</span></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<% end %>
|
|
||||||
|
|
||||||
<!-- 센서 구역 -->
|
|
||||||
<%= link_to edit_area_environment_path(id: params[:id]), class: "dashboard-group bg-base-content" do %>
|
|
||||||
<div class="flex flex-col justify-between h-full space-y-2">
|
|
||||||
<div class="flex flex-row justify-between w-full">
|
|
||||||
<div class="flex flex-row space-x-4 items-center">
|
|
||||||
<i class="fa-solid fa-tower-broadcast text-etc-color text-4xl text-left"></i>
|
|
||||||
<div class="items-baseline">
|
|
||||||
<span class="text-2xl">센서구역</span>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<div class="flex items-center space-x-2">
|
|
||||||
<i class="fa-solid fa-gear text-2xl"></i>
|
|
||||||
<i class="fa-solid fa-angle-right text-2xl opacity-90"></i>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<hr>
|
|
||||||
<div class="flex flex-row justify-between items-baseline w-full divide-x divide-base-border">
|
|
||||||
<div class="flex flex-col items-baseline text-right w-full">
|
|
||||||
<div class="opacity-50">현재 센서구역 정보</div>
|
|
||||||
<div class="font-bold text-3xl">6<span class="font-normal text-2xl"> 구역</span></div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
<% end %>
|
|
||||||
|
|
||||||
<!-- LED -->
|
|
||||||
<div class="dashboard-group bg-base-content"
|
|
||||||
data-controller="toggle"
|
|
||||||
data-action="click->toggle#toggle"
|
|
||||||
data-toggle-target="background">
|
|
||||||
<div class="flex flex-col justify-between h-full space-y-2">
|
|
||||||
<div class="flex flex-row justify-between w-full">
|
|
||||||
<div class="flex flex-row space-x-4 items-center">
|
|
||||||
<i class="fa-solid fa-lightbulb text-etc-color text-4xl text-left"></i>
|
|
||||||
<div class="items-baseline">
|
|
||||||
<span class="text-2xl">LED</span>
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<hr>
|
<hr>
|
||||||
<div class="flex flex-row justify-between items-baseline w-full divide-x divide-base-border">
|
<div class="flex flex-row justify-between items-baseline w-full divide-x divide-base-border">
|
||||||
<div class="flex flex-col items-baseline text-right w-full">
|
<div class="flex flex-col items-baseline text-right w-full">
|
||||||
<div class="opacity-50">모드</div>
|
<div class="opacity-50">LED</div>
|
||||||
<div class="flex flex-row items-center space-x-2">
|
<div class="flex flex-row items-center space-x-2 text-notice">
|
||||||
<div class="size-5 bg-notice rounded-full"></div>
|
<div class="size-5 bg-notice rounded-full"></div>
|
||||||
<div class="font-bold text-3xl text-notice">자동</div>
|
<div class="text-3xl">ON</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="flex flex-col items-baseline text-right w-full ml-4">
|
||||||
|
<div class="opacity-50">FAN</div>
|
||||||
|
<div class="flex flex-row items-center space-x-2 text-notice">
|
||||||
|
<div class="size-5 bg-notice rounded-full"></div>
|
||||||
|
<div class="text-3xl">ON</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<!-- Fan -->
|
<!-- 2번 랙 -->
|
||||||
<div class="dashboard-group bg-base-content"
|
<div class="dashboard-group bg-base-content">
|
||||||
data-controller="toggle"
|
<div class="flex flex-col justify-between h-full space-y-2">
|
||||||
data-action="click->toggle#toggle"
|
<div class="flex flex-row justify-between w-full">
|
||||||
data-toggle-target="background">
|
<div class="flex flex-row space-x-4 items-center">
|
||||||
|
<i class="fa-solid fa-timeline text-etc-color text-4xl text-left"></i>
|
||||||
|
<div class="items-baseline">
|
||||||
|
<span class="text-2xl">2번 랙</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<hr>
|
||||||
|
<div class="flex flex-row justify-between items-baseline w-full divide-x divide-base-border">
|
||||||
|
<div class="flex flex-col items-baseline text-right w-full">
|
||||||
|
<div class="opacity-50">LED</div>
|
||||||
|
<div class="flex flex-row items-center space-x-2 text-notice">
|
||||||
|
<div class="size-5 bg-notice rounded-full"></div>
|
||||||
|
<div class="text-3xl">ON</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="flex flex-col items-baseline text-right w-full ml-4">
|
||||||
|
<div class="opacity-50">FAN</div>
|
||||||
|
<div class="flex flex-row items-center space-x-2 text-notice">
|
||||||
|
<div class="size-5 bg-notice rounded-full"></div>
|
||||||
|
<div class="text-3xl">ON</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 3번 랙 -->
|
||||||
|
<div class="dashboard-group bg-base-content">
|
||||||
|
<div class="flex flex-col justify-between h-full space-y-2">
|
||||||
|
<div class="flex flex-row justify-between w-full">
|
||||||
|
<div class="flex flex-row space-x-4 items-center">
|
||||||
|
<i class="fa-solid fa-timeline text-etc-color text-4xl text-left"></i>
|
||||||
|
<div class="items-baseline">
|
||||||
|
<span class="text-2xl">3번 랙</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<hr>
|
||||||
|
<div class="flex flex-row justify-between items-baseline w-full divide-x divide-base-border">
|
||||||
|
<div class="flex flex-col items-baseline text-right w-full">
|
||||||
|
<div class="opacity-50">LED</div>
|
||||||
|
<div class="flex flex-row items-center space-x-2 text-notice">
|
||||||
|
<div class="size-5 bg-notice rounded-full"></div>
|
||||||
|
<div class="text-3xl">ON</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="flex flex-col items-baseline text-right w-full ml-4">
|
||||||
|
<div class="opacity-50">FAN</div>
|
||||||
|
<div class="flex flex-row items-center space-x-2 text-notice">
|
||||||
|
<div class="size-5 bg-notice rounded-full"></div>
|
||||||
|
<div class="text-3xl">ON</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 4번 랙 -->
|
||||||
|
<div class="dashboard-group bg-base-content">
|
||||||
|
<div class="flex flex-col justify-between h-full space-y-2">
|
||||||
|
<div class="flex flex-row justify-between w-full">
|
||||||
|
<div class="flex flex-row space-x-4 items-center">
|
||||||
|
<i class="fa-solid fa-timeline text-etc-color text-4xl text-left"></i>
|
||||||
|
<div class="items-baseline">
|
||||||
|
<span class="text-2xl">4번 랙</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<hr>
|
||||||
|
<div class="flex flex-row justify-between items-baseline w-full divide-x divide-base-border">
|
||||||
|
<div class="flex flex-col items-baseline text-right w-full">
|
||||||
|
<div class="opacity-50">LED</div>
|
||||||
|
<div class="flex flex-row items-center space-x-2 text-notice">
|
||||||
|
<div class="size-5 bg-notice rounded-full"></div>
|
||||||
|
<div class="text-3xl">ON</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="flex flex-col items-baseline text-right w-full ml-4">
|
||||||
|
<div class="opacity-50">FAN</div>
|
||||||
|
<div class="flex flex-row items-center space-x-2 text-notice">
|
||||||
|
<div class="size-5 bg-notice rounded-full"></div>
|
||||||
|
<div class="text-3xl">ON</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 5번 랙 -->
|
||||||
|
<div class="dashboard-group bg-base-content">
|
||||||
|
<div class="flex flex-col justify-between h-full space-y-2">
|
||||||
|
<div class="flex flex-row justify-between w-full">
|
||||||
|
<div class="flex flex-row space-x-4 items-center">
|
||||||
|
<i class="fa-solid fa-timeline text-etc-color text-4xl text-left"></i>
|
||||||
|
<div class="items-baseline">
|
||||||
|
<span class="text-2xl">5번 랙</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<hr>
|
||||||
|
<div class="flex flex-row justify-between items-baseline w-full divide-x divide-base-border">
|
||||||
|
<div class="flex flex-col items-baseline text-right w-full">
|
||||||
|
<div class="opacity-50">LED</div>
|
||||||
|
<div class="flex flex-row items-center space-x-2 text-notice">
|
||||||
|
<div class="size-5 bg-notice rounded-full"></div>
|
||||||
|
<div class="text-3xl">ON</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="flex flex-col items-baseline text-right w-full ml-4">
|
||||||
|
<div class="opacity-50">FAN</div>
|
||||||
|
<div class="flex flex-row items-center space-x-2 text-notice">
|
||||||
|
<div class="size-5 bg-notice rounded-full"></div>
|
||||||
|
<div class="text-3xl">ON</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 벌통 Spot Light -->
|
||||||
|
<div class="dashboard-group bg-base-content">
|
||||||
|
<div class="flex flex-col justify-between h-full space-y-2">
|
||||||
|
<div class="flex flex-row justify-between w-full">
|
||||||
|
<div class="flex flex-row space-x-4 items-center">
|
||||||
|
<i class="fa-solid fa-timeline text-etc-color text-4xl text-left"></i>
|
||||||
|
<div class="items-baseline">
|
||||||
|
<span class="text-2xl">벌통 Spot Light</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<hr>
|
||||||
|
<div class="flex flex-row justify-between items-baseline w-full divide-x divide-base-border">
|
||||||
|
<div class="flex flex-col items-baseline text-right w-full">
|
||||||
|
<div class="opacity-50">상태</div>
|
||||||
|
<div class="flex flex-row items-center space-x-2 text-notice">
|
||||||
|
<div class="size-5 bg-notice rounded-full"></div>
|
||||||
|
<div class="text-3xl">ON</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="flex-1 grid grid-cols-1 gap-4">
|
||||||
|
<!-- 환기용 FAN -->
|
||||||
|
<div class="dashboard-group bg-base-content">
|
||||||
<div class="flex flex-col justify-between h-full space-y-2">
|
<div class="flex flex-col justify-between h-full space-y-2">
|
||||||
<div class="flex flex-row justify-between w-full">
|
<div class="flex flex-row justify-between w-full">
|
||||||
<div class="flex flex-row space-x-4 items-center">
|
<div class="flex flex-row space-x-4 items-center">
|
||||||
<i class="fa-solid fa-fan text-etc-color text-4xl text-left"></i>
|
<i class="fa-solid fa-fan text-etc-color text-4xl text-left"></i>
|
||||||
<div class="items-baseline">
|
<div class="items-baseline">
|
||||||
<span class="text-2xl">FAN</span>
|
<span class="text-2xl">환기용 FAN</span>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<hr>
|
<hr>
|
||||||
<div class="flex flex-row justify-between items-baseline w-full divide-x divide-base-border">
|
<div class="flex-1 grid grid-cols-2 xl:grid-cols-8 gap-2">
|
||||||
<div class="flex flex-col items-baseline text-right w-full">
|
<div class="card px-3 py-1.5 rounded-lg cursor-pointer">
|
||||||
<div class="opacity-50">모드</div>
|
<div class="opacity-50">1번</div>
|
||||||
<div class="flex flex-row items-center space-x-2">
|
<div class="flex flex-row items-center space-x-2 text-notice">
|
||||||
<div class="size-5 bg-warning rounded-full"></div>
|
<div class="size-5 bg-notice rounded-full"></div>
|
||||||
<div class="font-bold text-3xl text-warning">수동</div>
|
<div class="text-3xl">ON</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="card px-3 py-1.5 rounded-lg cursor-pointer">
|
||||||
|
<div class="opacity-50">2번</div>
|
||||||
|
<div class="flex flex-row items-center space-x-2 text-notice">
|
||||||
|
<div class="size-5 bg-notice rounded-full"></div>
|
||||||
|
<div class="text-3xl">ON</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="card px-3 py-1.5 rounded-lg cursor-pointer">
|
||||||
|
<div class="opacity-50">3번</div>
|
||||||
|
<div class="flex flex-row items-center space-x-2 text-notice">
|
||||||
|
<div class="size-5 bg-notice rounded-full"></div>
|
||||||
|
<div class="text-3xl">ON</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="card px-3 py-1.5 rounded-lg cursor-pointer">
|
||||||
|
<div class="opacity-50">4번</div>
|
||||||
|
<div class="flex flex-row items-center space-x-2 text-notice">
|
||||||
|
<div class="size-5 bg-notice rounded-full"></div>
|
||||||
|
<div class="text-3xl">ON</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="card px-3 py-1.5 rounded-lg cursor-pointer">
|
||||||
|
<div class="opacity-50">5번</div>
|
||||||
|
<div class="flex flex-row items-center space-x-2 text-notice">
|
||||||
|
<div class="size-5 bg-notice rounded-full"></div>
|
||||||
|
<div class="text-3xl">ON</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="card px-3 py-1.5 rounded-lg cursor-pointer">
|
||||||
|
<div class="opacity-50">6번</div>
|
||||||
|
<div class="flex flex-row items-center space-x-2 text-notice">
|
||||||
|
<div class="size-5 bg-notice rounded-full"></div>
|
||||||
|
<div class="text-3xl">ON</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="card px-3 py-1.5 rounded-lg cursor-pointer">
|
||||||
|
<div class="opacity-50">7번</div>
|
||||||
|
<div class="flex flex-row items-center space-x-2 text-notice">
|
||||||
|
<div class="size-5 bg-notice rounded-full"></div>
|
||||||
|
<div class="text-3xl">ON</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="card px-3 py-1.5 rounded-lg cursor-pointer">
|
||||||
|
<div class="opacity-50">8번</div>
|
||||||
|
<div class="flex flex-row items-center space-x-2 text-notice">
|
||||||
|
<div class="size-5 bg-notice rounded-full"></div>
|
||||||
|
<div class="text-3xl">ON</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="card px-3 py-1.5 rounded-lg cursor-pointer">
|
||||||
|
<div class="opacity-50">9번</div>
|
||||||
|
<div class="flex flex-row items-center space-x-2 text-notice">
|
||||||
|
<div class="size-5 bg-notice rounded-full"></div>
|
||||||
|
<div class="text-3xl">ON</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="card px-3 py-1.5 rounded-lg cursor-pointer">
|
||||||
|
<div class="opacity-50">10번</div>
|
||||||
|
<div class="flex flex-row items-center space-x-2 text-notice">
|
||||||
|
<div class="size-5 bg-notice rounded-full"></div>
|
||||||
|
<div class="text-3xl">ON</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="card px-3 py-1.5 rounded-lg cursor-pointer">
|
||||||
|
<div class="opacity-50">11번</div>
|
||||||
|
<div class="flex flex-row items-center space-x-2 text-notice">
|
||||||
|
<div class="size-5 bg-notice rounded-full"></div>
|
||||||
|
<div class="text-3xl">ON</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="card px-3 py-1.5 rounded-lg cursor-pointer">
|
||||||
|
<div class="opacity-50">12번</div>
|
||||||
|
<div class="flex flex-row items-center space-x-2 text-notice">
|
||||||
|
<div class="size-5 bg-notice rounded-full"></div>
|
||||||
|
<div class="text-3xl">ON</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="card px-3 py-1.5 rounded-lg cursor-pointer">
|
||||||
|
<div class="opacity-50">13번</div>
|
||||||
|
<div class="flex flex-row items-center space-x-2 text-notice">
|
||||||
|
<div class="size-5 bg-notice rounded-full"></div>
|
||||||
|
<div class="text-3xl">ON</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="card px-3 py-1.5 rounded-lg cursor-pointer">
|
||||||
|
<div class="opacity-50">14번</div>
|
||||||
|
<div class="flex flex-row items-center space-x-2 text-notice">
|
||||||
|
<div class="size-5 bg-notice rounded-full"></div>
|
||||||
|
<div class="text-3xl">ON</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="card px-3 py-1.5 rounded-lg cursor-pointer">
|
||||||
|
<div class="opacity-50">15번</div>
|
||||||
|
<div class="flex flex-row items-center space-x-2 text-notice">
|
||||||
|
<div class="size-5 bg-notice rounded-full"></div>
|
||||||
|
<div class="text-3xl">ON</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div class="card px-3 py-1.5 rounded-lg cursor-pointer">
|
||||||
|
<div class="opacity-50">16번</div>
|
||||||
|
<div class="flex flex-row items-center space-x-2 text-notice">
|
||||||
|
<div class="size-5 bg-notice rounded-full"></div>
|
||||||
|
<div class="text-3xl">ON</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
|
||||||
|
|
@ -1,6 +1,6 @@
|
||||||
<header class="flex header justify-between items-center px-4" data-controller="timer">
|
<header class="flex header justify-between items-center px-4" data-controller="timer">
|
||||||
<div class="flex items-center space-x-4">
|
<div class="flex items-center space-x-4">
|
||||||
<div data-timer-target="output" class="hidden lg:block"></div>
|
<!-- <div data-timer-target="output" class="hidden lg:block"></div>-->
|
||||||
<button data-action="click->sidebar#toggle" class="block lg:hidden p-2 cursor-pointer">
|
<button data-action="click->sidebar#toggle" class="block lg:hidden p-2 cursor-pointer">
|
||||||
<i class="fa-solid fa-bars text-2xl"></i>
|
<i class="fa-solid fa-bars text-2xl"></i>
|
||||||
</button>
|
</button>
|
||||||
|
|
|
||||||
|
|
@ -3,11 +3,20 @@
|
||||||
<div class="flex flex-row items-center justify-center">
|
<div class="flex flex-row items-center justify-center">
|
||||||
<%= image_tag "svg/svg_logo.svg", class: "w-auto h-8 mr-4" %>
|
<%= image_tag "svg/svg_logo.svg", class: "w-auto h-8 mr-4" %>
|
||||||
<%= link_to root_path do %>
|
<%= link_to root_path do %>
|
||||||
<div class="flex h-full items-center text-center tracking-[0.5rem]"><span class="text-logo-color">FARM</span>ITRY</div>
|
<div class="flex h-full items-center text-center tracking-[0.5rem] text-2xl"><span class="text-logo-color">FARM</span>ITRY</div>
|
||||||
<% end %>
|
<% end %>
|
||||||
</div>
|
</div>
|
||||||
<div class="mt-8">
|
<div class="mt-8">
|
||||||
<%= link_to environment_index_path(id: 1), class: "menu-group #{'menu-group-active' if current_page?(environment_index_path(id: 1))}" do %>
|
<%= link_to "#", class: "menu-group #{'menu-group-active' if false}" do %>
|
||||||
|
<div class="menu-group-icon">
|
||||||
|
<i class="fa-solid fa-chart-line text-2xl"></i>
|
||||||
|
</div>
|
||||||
|
<div class="menu-group-name">
|
||||||
|
양액부
|
||||||
|
</div>
|
||||||
|
<% end %>
|
||||||
|
<hr>
|
||||||
|
<%= link_to "#", class: "menu-group menu-group-active" do %>
|
||||||
<div class="menu-group-icon">
|
<div class="menu-group-icon">
|
||||||
<i class="fa-solid fa-leaf text-2xl"></i>
|
<i class="fa-solid fa-leaf text-2xl"></i>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -16,16 +25,7 @@
|
||||||
</div>
|
</div>
|
||||||
<% end %>
|
<% end %>
|
||||||
<hr>
|
<hr>
|
||||||
<%= link_to nutrient_index_path(id: 1), class: "menu-group #{'menu-group-active' if current_page?(nutrient_index_path(id: 1))}" do %>
|
<%= link_to "#", class: "menu-group #{'menu-group-active' if false}" do %>
|
||||||
<div class="menu-group-icon">
|
|
||||||
<i class="fa-solid fa-chart-line text-2xl"></i>
|
|
||||||
</div>
|
|
||||||
<div class="menu-group-name">
|
|
||||||
1동 양액부
|
|
||||||
</div>
|
|
||||||
<% end %>
|
|
||||||
<hr>
|
|
||||||
<%= link_to environment_index_path(id: 2), class: "menu-group #{'menu-group-active' if current_page?(environment_index_path(id: 2))}" do %>
|
|
||||||
<div class="menu-group-icon">
|
<div class="menu-group-icon">
|
||||||
<i class="fa-solid fa-leaf text-2xl"></i>
|
<i class="fa-solid fa-leaf text-2xl"></i>
|
||||||
</div>
|
</div>
|
||||||
|
|
@ -33,34 +33,5 @@
|
||||||
2동 환경부
|
2동 환경부
|
||||||
</div>
|
</div>
|
||||||
<% end %>
|
<% end %>
|
||||||
<hr>
|
|
||||||
<%= link_to nutrient_index_path(id: 2), class: "menu-group #{'menu-group-active' if current_page?(nutrient_index_path(id: 2))}" do %>
|
|
||||||
<div class="menu-group-icon">
|
|
||||||
<i class="fa-solid fa-chart-line text-2xl"></i>
|
|
||||||
</div>
|
</div>
|
||||||
<div class="menu-group-name">
|
|
||||||
2동 양액부
|
|
||||||
</div>
|
|
||||||
<% end %>
|
|
||||||
<hr>
|
|
||||||
<%= link_to rack_index_path, class: "menu-group #{'menu-group-active' if current_page?(rack_index_path)}" do %>
|
|
||||||
<div class="menu-group-icon">
|
|
||||||
<i class="fa-solid fa-timeline text-2xl"></i>
|
|
||||||
</div>
|
|
||||||
<div class="menu-group-name">
|
|
||||||
통합 랙 정보
|
|
||||||
</div>
|
|
||||||
<% end %>
|
|
||||||
</div>
|
|
||||||
<%# @controllers.each do |c| %>
|
|
||||||
<%#= link_to view_schedule_path(c.id), class: "menu-group #{'menu-group-active' if current_page?(view_schedule_path(c.id))}" do %>
|
|
||||||
<!-- <div class="menu-group-icon">-->
|
|
||||||
<!-- <i class="fa-solid fa-temperature-high text-2xl"></i>-->
|
|
||||||
<!-- </div>-->
|
|
||||||
<!-- <div class="menu-group-name">-->
|
|
||||||
<%#= c.name %>
|
|
||||||
<!-- </div>-->
|
|
||||||
<%# end %>
|
|
||||||
<!-- <hr>-->
|
|
||||||
<%# end %>
|
|
||||||
</nav>
|
</nav>
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue