불필요한 코드 정리 및 modal 추가
This commit is contained in:
parent
8041453c5e
commit
4a3d0313a2
|
|
@ -53,6 +53,7 @@
|
|||
<orderEntry type="library" scope="PROVIDED" name="builder (v3.3.0, rbenv: 3.4.2) [gem]" level="application" />
|
||||
<orderEntry type="library" scope="PROVIDED" name="bundler (v2.6.6, rbenv: 3.4.2) [gem]" level="application" />
|
||||
<orderEntry type="library" scope="PROVIDED" name="capybara (v3.40.0, rbenv: 3.4.2) [gem]" level="application" />
|
||||
<orderEntry type="library" scope="PROVIDED" name="ccutrer-serialport (v1.1.0, rbenv: 3.4.2) [gem]" level="application" />
|
||||
<orderEntry type="library" scope="PROVIDED" name="concurrent-ruby (v1.3.5, rbenv: 3.4.2) [gem]" level="application" />
|
||||
<orderEntry type="library" scope="PROVIDED" name="connection_pool (v2.5.0, rbenv: 3.4.2) [gem]" level="application" />
|
||||
<orderEntry type="library" scope="PROVIDED" name="crass (v1.0.6, rbenv: 3.4.2) [gem]" level="application" />
|
||||
|
|
@ -66,6 +67,7 @@
|
|||
<orderEntry type="library" scope="PROVIDED" name="erb_lint (v0.9.0, rbenv: 3.4.2) [gem]" level="application" />
|
||||
<orderEntry type="library" scope="PROVIDED" name="erubi (v1.13.1, rbenv: 3.4.2) [gem]" level="application" />
|
||||
<orderEntry type="library" scope="PROVIDED" name="et-orbi (v1.2.11, rbenv: 3.4.2) [gem]" level="application" />
|
||||
<orderEntry type="library" scope="PROVIDED" name="ffi (v1.17.2, rbenv: 3.4.2) [gem]" level="application" />
|
||||
<orderEntry type="library" scope="PROVIDED" name="foreman (v0.88.1, rbenv: 3.4.2) [gem]" level="application" />
|
||||
<orderEntry type="library" scope="PROVIDED" name="fugit (v1.11.1, rbenv: 3.4.2) [gem]" level="application" />
|
||||
<orderEntry type="library" scope="PROVIDED" name="globalid (v1.2.1, rbenv: 3.4.2) [gem]" level="application" />
|
||||
|
|
|
|||
23
Gemfile.lock
23
Gemfile.lock
|
|
@ -129,6 +129,7 @@ GEM
|
|||
et-orbi (1.2.11)
|
||||
tzinfo
|
||||
ffi (1.17.2-aarch64-linux-gnu)
|
||||
ffi (1.17.2-arm64-darwin)
|
||||
foreman (0.88.1)
|
||||
fugit (1.11.1)
|
||||
et-orbi (~> 1, >= 1.2.11)
|
||||
|
|
@ -192,18 +193,8 @@ GEM
|
|||
nio4r (2.7.4)
|
||||
nokogiri (1.18.7-aarch64-linux-gnu)
|
||||
racc (~> 1.4)
|
||||
nokogiri (1.18.7-aarch64-linux-musl)
|
||||
racc (~> 1.4)
|
||||
nokogiri (1.18.7-arm-linux-gnu)
|
||||
racc (~> 1.4)
|
||||
nokogiri (1.18.7-arm-linux-musl)
|
||||
racc (~> 1.4)
|
||||
nokogiri (1.18.7-arm64-darwin)
|
||||
racc (~> 1.4)
|
||||
nokogiri (1.18.7-x86_64-linux-gnu)
|
||||
racc (~> 1.4)
|
||||
nokogiri (1.18.7-x86_64-linux-musl)
|
||||
racc (~> 1.4)
|
||||
ostruct (0.6.1)
|
||||
parallel (1.27.0)
|
||||
parser (3.3.8.0)
|
||||
|
|
@ -328,12 +319,7 @@ GEM
|
|||
railties (>= 7.1)
|
||||
thor (~> 1.3.1)
|
||||
sqlite3 (2.6.0-aarch64-linux-gnu)
|
||||
sqlite3 (2.6.0-aarch64-linux-musl)
|
||||
sqlite3 (2.6.0-arm-linux-gnu)
|
||||
sqlite3 (2.6.0-arm-linux-musl)
|
||||
sqlite3 (2.6.0-arm64-darwin)
|
||||
sqlite3 (2.6.0-x86_64-linux-gnu)
|
||||
sqlite3 (2.6.0-x86_64-linux-musl)
|
||||
sshkit (1.24.0)
|
||||
base64
|
||||
logger
|
||||
|
|
@ -348,7 +334,6 @@ GEM
|
|||
thruster (0.1.12)
|
||||
thruster (0.1.12-aarch64-linux)
|
||||
thruster (0.1.12-arm64-darwin)
|
||||
thruster (0.1.12-x86_64-linux)
|
||||
timeout (0.4.3)
|
||||
turbo-rails (2.0.13)
|
||||
actionpack (>= 7.1.0)
|
||||
|
|
@ -377,13 +362,7 @@ GEM
|
|||
PLATFORMS
|
||||
aarch64-linux
|
||||
aarch64-linux-gnu
|
||||
aarch64-linux-musl
|
||||
arm-linux-gnu
|
||||
arm-linux-musl
|
||||
arm64-darwin-24
|
||||
x86_64-linux
|
||||
x86_64-linux-gnu
|
||||
x86_64-linux-musl
|
||||
|
||||
DEPENDENCIES
|
||||
amazing_print
|
||||
|
|
|
|||
|
|
@ -0,0 +1,5 @@
|
|||
class ModalsController < ApplicationController
|
||||
def open
|
||||
render partial: "partials/modals_open", locals: { type: params[:type], close_button: params[:close_button] }
|
||||
end
|
||||
end
|
||||
|
|
@ -0,0 +1,2 @@
|
|||
module ModalsHelper
|
||||
end
|
||||
|
|
@ -7,5 +7,8 @@ import { application } from "./application"
|
|||
import HelloController from "./hello_controller"
|
||||
application.register("hello", HelloController)
|
||||
|
||||
import ModalsController from "./modals_controller"
|
||||
application.register("modals", ModalsController)
|
||||
|
||||
import TimerController from "./timer_controller"
|
||||
application.register("timer", TimerController)
|
||||
|
|
|
|||
|
|
@ -0,0 +1,55 @@
|
|||
import { Controller } from "@hotwired/stimulus"
|
||||
import { useClickOutside } from 'stimulus-use'
|
||||
|
||||
// Connects to data-controller="modals"
|
||||
export default class extends Controller {
|
||||
connect() {
|
||||
// useClickOutside(this)
|
||||
this.boundHandleKeydown = this.handleKeydown.bind(this)
|
||||
document.addEventListener("keydown", this.boundHandleKeydown)
|
||||
window.addEventListener('modals:close', this.close.bind(this))
|
||||
|
||||
const panelElement = document.getElementById("modals-panel")
|
||||
const backdropElement = document.getElementById("modals-backdrop")
|
||||
|
||||
if (panelElement && backdropElement) {
|
||||
setTimeout(() => {
|
||||
panelElement.classList.remove('opacity-0', 'translate-y-4', 'sm:scale-95')
|
||||
panelElement.classList.add('opacity-100', 'translate-y-0', 'sm:scale-100')
|
||||
backdropElement.classList.remove('opacity-0')
|
||||
backdropElement.classList.add('opacity-75')
|
||||
}, 10) // 애니메이션이 바로 시작되도록 약간의 지연 추가
|
||||
}
|
||||
}
|
||||
|
||||
disconnect() {
|
||||
document.removeEventListener('keydown', this.boundHandleKeydown)
|
||||
}
|
||||
|
||||
handleKeydown(event) {
|
||||
if (event.key === "Escape") {
|
||||
this.close()
|
||||
}
|
||||
}
|
||||
|
||||
close(event) {
|
||||
const panelElement = document.getElementById("modals-panel")
|
||||
const backdropElement = document.getElementById("modals-backdrop")
|
||||
|
||||
if (panelElement && backdropElement) {
|
||||
panelElement.classList.remove("opacity-100", "translate-y-0", "sm:scale-100")
|
||||
panelElement.classList.add("opacity-0", "translate-y-4", "sm:scale-95")
|
||||
|
||||
backdropElement.classList.remove("opacity-75")
|
||||
backdropElement.classList.add("opacity-0")
|
||||
|
||||
setTimeout(() => {
|
||||
const modalsFrame = document.querySelector("turbo-frame#modals")
|
||||
if (modalsFrame) {
|
||||
modalsFrame.innerHTML = ""
|
||||
window.location.reload()
|
||||
}
|
||||
}, 300) // 닫힘 애니메이션 시간과 동일하게 300ms 지연 후 모달 제거
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
@ -1,4 +1,4 @@
|
|||
import { Controller } from "@hotwired/stimulus"
|
||||
import {Controller} from "@hotwired/stimulus"
|
||||
|
||||
// Connects to data-controller="timer"
|
||||
export default class extends Controller {
|
||||
|
|
@ -15,8 +15,7 @@ export default class extends Controller {
|
|||
|
||||
updateTime() {
|
||||
const now = new Date()
|
||||
const formatted = `${now.getFullYear()}년 ${String(now.getMonth() + 1).padStart(2, '0')}월 ${String(now.getDate()).padStart(2, '0')}일 ` +
|
||||
this.outputTarget.textContent = `${now.getFullYear()}년 ${String(now.getMonth() + 1).padStart(2, '0')}월 ${String(now.getDate()).padStart(2, '0')}일 ` +
|
||||
`${String(now.getHours()).padStart(2, '0')}시 ${String(now.getMinutes()).padStart(2, '0')}분 ${String(now.getSeconds()).padStart(2, '0')}초`
|
||||
this.outputTarget.textContent = formatted
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -24,10 +24,10 @@
|
|||
</head>
|
||||
|
||||
<body class="h-screen">
|
||||
<%= turbo_frame_tag :modals %>
|
||||
<main class="flex flex-col h-full divide-y divide-border-table-border">
|
||||
<%= render "partials/header" %>
|
||||
<div class="flex flex-row flex-1 w-full divide-x divide-border-table-border">
|
||||
<%#= render "partials/sidebar" %>
|
||||
<div class="w-full h-full">
|
||||
<%= yield %>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -11,7 +11,9 @@
|
|||
<% @schedule.each do |s| %>
|
||||
<tr>
|
||||
<td><%= s.hour %>시</td>
|
||||
<td><%= number_field_tag "schedule[#{s.id}][temperature]", s.temperature, step: "0.1", inputmode: "decimal", class: "border px-2 py-1 rounded" %> °C</td>
|
||||
<td><%= number_field_tag "schedule[#{s.id}][temperature]", s.temperature, step: "0.1", inputmode: "decimal", class: "border px-2 py-1 rounded" %>
|
||||
°C
|
||||
</td>
|
||||
</tr>
|
||||
<% end %>
|
||||
</tbody>
|
||||
|
|
@ -22,3 +24,11 @@
|
|||
<%= submit_tag "업데이트", class: "btn bg-primary" %>
|
||||
</div>
|
||||
<% end %>
|
||||
<div class="flex p-4">
|
||||
<%= button_to "추가하기", open_modals_path(type: "add_schedule"),
|
||||
class: "btn btn-default",
|
||||
data: {
|
||||
turbo_method: :post,
|
||||
turbo_frame: "modals"
|
||||
} %>
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -4,8 +4,4 @@
|
|||
<div class="flex h-full items-center tracking-[0.5rem]">FARMITRY</div>
|
||||
</div>
|
||||
<div data-timer-target="output" class="text-gray-600"></div>
|
||||
<!-- <div class="flex flex-row items-center gap-x-4">-->
|
||||
<!-- <i class="fa-solid fa-circle-user text-4xl text-default-slate-dark leading-10"></i>-->
|
||||
<%#= link_to "로그아웃", '', class: "btn" %>
|
||||
<!-- </div>-->
|
||||
</header>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,44 @@
|
|||
<%= turbo_frame_tag :modals do %>
|
||||
<div class="relative z-40" aria-labelledby="modal-title" role="dialog" aria-modal="true">
|
||||
<!--
|
||||
Background backdrop, show/hide based on modal state.
|
||||
|
||||
Entering: "ease-out duration-300"
|
||||
From: "opacity-0"
|
||||
To: "opacity-100"
|
||||
Leaving: "ease-in duration-200"
|
||||
From: "opacity-100"
|
||||
To: "opacity-0"
|
||||
-->
|
||||
<div id="modals-backdrop" class="fixed inset-0 bg-default-slate-dark transition-opacity opacity-0 ease-out duration-500" aria-hidden="true"></div>
|
||||
|
||||
<div class="fixed inset-0 z-40 w-screen overflow-y-auto py-8">
|
||||
<div class="flex min-h-full items-center justify-center text-center sm:items-center">
|
||||
<!--
|
||||
Modal panel, show/hide based on modal state.
|
||||
|
||||
Entering: "ease-out duration-300"
|
||||
From: "opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
|
||||
To: "opacity-100 translate-y-0 sm:scale-100"
|
||||
Leaving: "ease-in duration-200"
|
||||
From: "opacity-100 translate-y-0 sm:scale-100"
|
||||
To: "opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95"
|
||||
-->
|
||||
<div id="modals-panel" class="p-4 space-y-4 z-40 relative transform overflow-hidden rounded-md bg-white text-left shadow-xl transition-all w-full max-w-full mx-2 sm:mx-10 opacity-0 translate-y-4 sm:translate-y-0 sm:scale-95 ease-out duration-500" data-controller="modals" data-action="modals:click:outside->modals#close">
|
||||
<div>
|
||||
<%= render "partials/modals/#{type}" %>
|
||||
</div>
|
||||
<% if close_button != "false" %>
|
||||
<%= button_tag type: 'button',
|
||||
data: {
|
||||
action: 'modals#close'
|
||||
},
|
||||
class: 'inline-flex btn w-full' do %>
|
||||
<div class="items-center"><i class="fa-solid fa-square-caret-down"></i> 닫기</div>
|
||||
<% end %>
|
||||
<% end %>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<% end %>
|
||||
|
|
@ -1,42 +0,0 @@
|
|||
<nav class="side-bar overflow-y-auto">
|
||||
<div class="menu-group">
|
||||
<div class="menu-group-icon">
|
||||
<i class="fa-solid fa-house text-default-slate-dark text-4xl"></i>
|
||||
</div>
|
||||
<div class="menu-group-name">
|
||||
HOME
|
||||
</div>
|
||||
</div>
|
||||
<div class="menu-group">
|
||||
<div class="menu-group-icon">
|
||||
<i class="fa-solid fa-temperature-high text-default-slate-dark text-4xl"></i>
|
||||
</div>
|
||||
<div class="menu-group-name">
|
||||
메뉴 2
|
||||
</div>
|
||||
</div>
|
||||
<div class="menu-group">
|
||||
<div class="menu-group-icon">
|
||||
<i class="fa-solid fa-fan text-default-slate-dark text-4xl"></i>
|
||||
</div>
|
||||
<div class="menu-group-name">
|
||||
메뉴 3
|
||||
</div>
|
||||
</div>
|
||||
<div class="menu-group">
|
||||
<div class="menu-group-icon">
|
||||
<i class="fa-solid fa-arrows-spin text-default-slate-dark text-4xl"></i>
|
||||
</div>
|
||||
<div class="menu-group-name">
|
||||
메뉴 4
|
||||
</div>
|
||||
</div>
|
||||
<div class="menu-group">
|
||||
<div class="menu-group-icon">
|
||||
<i class="fa-solid fa-gear text-default-slate-dark text-4xl"></i>
|
||||
</div>
|
||||
<div class="menu-group-name">
|
||||
설청
|
||||
</div>
|
||||
</div>
|
||||
</nav>
|
||||
|
|
@ -0,0 +1 @@
|
|||
스케쥴 추가
|
||||
|
|
@ -20,4 +20,10 @@ Rails.application.routes.draw do
|
|||
post "schedule_edit_update"
|
||||
end
|
||||
end
|
||||
|
||||
resources :modals do
|
||||
collection do
|
||||
post :open
|
||||
end
|
||||
end
|
||||
end
|
||||
|
|
|
|||
|
|
@ -12,6 +12,7 @@
|
|||
"@hotwired/stimulus": "^3.2.2",
|
||||
"@hotwired/turbo-rails": "^8.0.13",
|
||||
"@tailwindcss/cli": "^4.1.4",
|
||||
"tailwindcss": "^4.1.4"
|
||||
"tailwindcss": "^4.1.4",
|
||||
"stimulus-use": "^0.52.2"
|
||||
}
|
||||
}
|
||||
|
|
|
|||
|
|
@ -0,0 +1,7 @@
|
|||
require "test_helper"
|
||||
|
||||
class ModalsControllerTest < ActionDispatch::IntegrationTest
|
||||
# test "the truth" do
|
||||
# assert true
|
||||
# end
|
||||
end
|
||||
|
|
@ -571,6 +571,11 @@ picomatch@^2.3.1:
|
|||
resolved "https://registry.yarnpkg.com/picomatch/-/picomatch-2.3.1.tgz#3ba3833733646d9d3e4995946c1365a67fb07a42"
|
||||
integrity sha512-JU3teHTNjmE2VCGFzuY8EXzCDVwEqB2a8fsIvwaStHhAWJEeVd1o1QD80CU6+ZdEXXSLbSsuLwJjkCBWqRQUVA==
|
||||
|
||||
stimulus-use@^0.52.2:
|
||||
version "0.52.3"
|
||||
resolved "https://registry.yarnpkg.com/stimulus-use/-/stimulus-use-0.52.3.tgz#d6f35fa93277274957a2ed98a7b04b4d702cb1d6"
|
||||
integrity sha512-stZ5dID6FUrGCR/ChWUa0FT5Z8iqkzT6lputOAb50eF+Ayg7RzJj4U/HoRlp2NV333QfvoRidru9HLbom4hZVw==
|
||||
|
||||
tailwindcss@4.1.4, tailwindcss@^4.1.4:
|
||||
version "4.1.4"
|
||||
resolved "https://registry.yarnpkg.com/tailwindcss/-/tailwindcss-4.1.4.tgz#27b3c910c6f1a47f4540451f3faf7cdd6d977a69"
|
||||
|
|
|
|||
Loading…
Reference in New Issue