스케줄러 edit view 반응형 디테일 수정

This commit is contained in:
2025-04-28 15:12:55 +09:00
parent 02932e8b79
commit fc61bc87f6
7 changed files with 99 additions and 88 deletions

View File

@@ -7,54 +7,61 @@
<div class="text-2xl font-bold"><%= @controller.name %> 컨트롤러</div>
<%= submit_tag "업데이트", class: "btn bg-primary" %>
</div>
<ul class="divide-y divide-base-border whitespace-nowrap">
<% @schedule.each do |s| %>
<li class="flex justify-between items-center px-4 py-2 space-x-4">
<div class="flex items-center space-x-4 basis-3/5">
<!-- 시간 -->
<div class="flex flex-col md:flex-row basis-2/3 items-center space-x-0 space-y-2 md:space-x-4 md:space-y-0">
<div class="text-white text-left w-full md:w-auto">시간</div>
<div class="text-xl flex items-center space-x-1 w-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 text-white" %>
<div>:</div>
<%= number_field_tag "schedule[#{s.id}][minute]", s.minute, min: 0, max: 59, step: 1, inputmode: "decimal", class: "input-style" %>
</div>
</div>
<!-- 온도 -->
<div class="flex flex-col md:flex-row basis-2/5 items-center space-x-0 space-y-2 md:space-x-4 md:space-y-0">
<div class="text-white text-left w-full md:w-auto">온도</div>
<div class="text-xl flex items-center space-x-2">
<div>
<%= number_field_tag "schedule[#{s.id}][temperature]", s.temperature, step: "0.1", inputmode: "decimal", class: "input-style" %>
<ul class="divide-y divide-base-border whitespace-nowrap h-full relative">
<% if @schedule.present? %>
<% @schedule.each do |s| %>
<li class="flex justify-between items-stretch 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 basis-2/5 h-full items-center space-x-0 space-y-2 lg:space-x-4 lg:space-y-0">
<div class="text-white text-left w-full lg:w-auto">시간</div>
<div class="text-xl flex items-center space-x-1 w-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 text-white min-w-[68px]" %>
<div>:</div>
<%= number_field_tag "schedule[#{s.id}][minute]",
s.minute, min: 0, max: 59, step: 1, inputmode: "decimal",
class: "input-style min-w-[68px]" %>
</div>
</div>
<!-- 온도 -->
<div class="flex flex-col lg:flex-row basis-2/5 h-full items-center space-x-0 space-y-2 lg:space-x-4 lg:space-y-0">
<div class="text-white text-left w-full lg:w-auto">온도</div>
<div class="text-xl flex items-center space-x-2">
<%= number_field_tag "schedule[#{s.id}][temperature]", s.temperature, step: "0.1", inputmode: "decimal", class: "input-style min-w-[78px]" %>
<div class="text-white text-xl leading-8">°C</div>
</div>
<div class="text-white text-xl leading-8">°C</div>
</div>
</div>
</div>
<div class="flex items-center space-x-6 basis-1/3 justify-end">
<div class="flex items-center space-x-4 basis-2/5 justify-end h-full">
<!-- 사용 여부 -->
<div class="flex flex-col md:flex-row items-center space-x-0 space-y-2 md:space-x-4 md:space-y-0">
<div class="text-white">사용여부</div>
<label class="relative inline-flex items-center cursor-pointer">
<%= 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="toggle_btn"></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">
<div class="text-white">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="toggle_btn"></div>
</label>
</div>
<!-- 삭제 -->
<%= link_to "삭제", schedule_path(s),
data: {
turbo_method: :delete,
turbo_confirm: "정말 삭제하시겠습니까?"
},
class: "btn bg-danger text-sm" %>
</div>
</li>
<!-- 삭제 -->
<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="text-white">&nbsp;</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-2 lg:px-4 lg:py-2 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>

View File

@@ -6,44 +6,48 @@
<%= link_to "수정", schedule_edit_schedule_path(@controller.id), class: "btn bg-default-slate" %>
</div>
<ul class="divide-y divide-base-border">
<% @schedule.each do |s| %>
<li class="flex justify-between items-center px-4 py-2 space-x-4">
<div class="flex items-center space-x-6">
<!-- 시간 -->
<div class="flex flex-col md:flex-row items-baseline space-x-2">
<div class="text-white">시간</div>
<div class="text-3xl flex items-baseline space-x-1">
<div><%= s.hour.to_s.rjust(2, '0') %></div>
<div>:</div>
<div><%= s.minute.to_s.rjust(2, '0') %></div>
</div>
</div>
<% if @schedule.present? %>
<% @schedule.each do |s| %>
<li class="flex justify-between items-center px-4 py-2 space-x-4">
<div class="flex items-center space-x-6">
<!-- 시간 -->
<div class="flex flex-col lg:flex-row items-baseline space-x-2">
<div class="text-white">시간</div>
<div class="text-3xl flex items-baseline space-x-1">
<div><%= s.hour.to_s.rjust(2, '0') %></div>
<div>:</div>
<div><%= s.minute.to_s.rjust(2, '0') %></div>
</div>
</div>
<!-- 온도 -->
<div class="flex flex-col md:flex-row items-baseline space-x-4">
<div class="text-white">온도</div>
<div class="text-3xl flex items-end space-x-2">
<div><%= s.temperature %></div>
<div class="text-white text-xl leading-8">°C</div>
<!-- 온도 -->
<div class="flex flex-col lg:flex-row items-baseline space-x-4">
<div class="text-white">온도</div>
<div class="text-3xl flex items-end space-x-2">
<div><%= s.temperature %></div>
<div class="text-white text-xl leading-8">°C</div>
</div>
</div>
</div>
</div>
</div>
<!-- 사용 여부 -->
<div class="flex flex-col md:flex-row items-baseline space-x-4">
<div class="text-white mb-1">사용여부</div>
<div class="text-3xl">
<%#= s.is_active %>
<% if s.is_active %>
<i class="fa-solid fa-check text-notice"></i>
<% else %>
<i class="fa-solid fa-xmark text-danger"></i>
<% end %>
</div>
</div>
</li>
<% end %>
</ul>
<!-- 사용 여부 -->
<div class="flex flex-col lg:flex-row items-baseline space-x-4">
<div class="text-white mb-1">ON/OFF</div>
<div class="text-3xl">
<%#= s.is_active %>
<% if s.is_active %>
<i class="fa-solid fa-check text-notice"></i>
<% else %>
<i class="fa-solid fa-xmark text-danger"></i>
<% end %>
</div>
</div>
</li>
<% end %>
<% else %>
<li class="text-center p-4 w-full">저장된 스케줄이 없습니다.</li>
<% end %>
</ul>
<!-- <table class="base-table">-->
<!-- <thead>-->