Improved closing days. Add more than one closing days interval is now possible.
parent
2cb0a31abf
commit
0f940a9f5e
@ -0,0 +1,116 @@
|
||||
use chrono::Local;
|
||||
use leptos::*;
|
||||
use crate::backend::data::ClosingTime;
|
||||
use crate::backend::opening_hours::{get_closing_times, DeleteClosingTime, InsertClosingTime};
|
||||
use crate::components::data_form::{DataForm, QuestionDialog};
|
||||
use crate::components::modal_box::DialogOpener;
|
||||
use crate::locales::{loc_date, trl};
|
||||
|
||||
#[component]
|
||||
pub fn del_closing_day(closing_time: ReadSignal<ClosingTime>, opener: DialogOpener) -> impl IntoView {
|
||||
let delete = create_server_action::<DeleteClosingTime>();
|
||||
|
||||
view! {
|
||||
<QuestionDialog opener=opener action=delete title="Delete closing days">
|
||||
<input type="hidden" prop:value={move || closing_time.get().id()} name="id"/>
|
||||
<div>{trl("Are you sure you want to delete closing days from ")}{move || loc_date(closing_time.get().from_date)}{trl(" to ")}{move || loc_date(closing_time.get().to_date)}"?"</div>
|
||||
</QuestionDialog>
|
||||
}
|
||||
}
|
||||
|
||||
#[component]
|
||||
pub fn insert_closing_days(opener: DialogOpener) -> impl IntoView {
|
||||
let insert_day = create_server_action::<InsertClosingTime>();
|
||||
|
||||
view! {
|
||||
<DataForm opener=opener action=insert_day title="Closing days">
|
||||
<input type="hidden" value=0 name="time[id]"/>
|
||||
<div class="row">
|
||||
<div class="col mb-3">
|
||||
<label for="from_day" class="form-label">{trl("From")}</label>
|
||||
<input
|
||||
type="date"
|
||||
id="from_day"
|
||||
class="form-control"
|
||||
prop:value={move || Local::now().date_naive().format("%Y-%m-%d").to_string()}
|
||||
name="time[from_date]"
|
||||
/>
|
||||
<label for="to_day" class="form-label">{trl("To")}</label>
|
||||
<input
|
||||
type="date"
|
||||
id="to_day"
|
||||
class="form-control"
|
||||
prop:value={move || Local::now().date_naive().format("%Y-%m-%d").to_string()}
|
||||
name="time[to_date]"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
</DataForm>
|
||||
}
|
||||
}
|
||||
#[component]
|
||||
pub fn closing_days() -> impl IntoView {
|
||||
let delete_dialog = DialogOpener::new();
|
||||
let editor = DialogOpener::new();
|
||||
let times = create_blocking_resource(move || editor.visible() || delete_dialog.visible(), move |_| {get_closing_times()});
|
||||
let time_to_del = create_rw_signal(ClosingTime::default());
|
||||
view! {
|
||||
<DelClosingDay closing_time=time_to_del.read_only() opener=delete_dialog/>
|
||||
<InsertClosingDays opener=editor/>
|
||||
<div class="card mb-3">
|
||||
<div class="card-body">
|
||||
<h5 class="card-title"><i class="bx bx-calendar-x"></i>" "{trl("Closing days")}</h5>
|
||||
<Transition fallback=move || view! {<p>{trl("Loading...")}</p> }>
|
||||
<table class="table card-table">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>{trl("From")}</th>
|
||||
<th>{trl("To")}</th>
|
||||
<th>{trl("Actions")}</th>
|
||||
</tr>
|
||||
</thead>
|
||||
{move || {
|
||||
times.get().map(|c| match c {
|
||||
Err(e) => {
|
||||
let err = if e.to_string().contains("403") {
|
||||
"Only admin can edit closing times".to_string()
|
||||
} else {
|
||||
e.to_string()
|
||||
};
|
||||
view! {<tbody class="table-border-bottom-0">
|
||||
<tr><td colspan=3>{trl(&err)}</td></tr></tbody>}}
|
||||
Ok(c) => {
|
||||
view! {<tbody class="table-border-bottom-0">
|
||||
<For each=move || c.clone()
|
||||
key=|ct| ct.id()
|
||||
children=move |ct: ClosingTime| {
|
||||
let ct_delete = ct.clone();
|
||||
view! {
|
||||
<tr>
|
||||
<td>{loc_date(ct.from_date)}</td>
|
||||
<td>{loc_date(ct.to_date)}</td>
|
||||
<td>
|
||||
<a class="dropdown-item text-danger" href="javascript:void(0);" on:click=move |_| {
|
||||
time_to_del.set(ct_delete.clone());
|
||||
delete_dialog.show();
|
||||
}>
|
||||
<i class="bx bx-trash me-1"></i> {trl("Delete")}</a>
|
||||
|
||||
</td>
|
||||
</tr>
|
||||
}
|
||||
}/></tbody>
|
||||
}
|
||||
}
|
||||
})
|
||||
}}
|
||||
</table>
|
||||
</Transition>
|
||||
<a href="#" class="card-link" on:click=move |_| editor.show()>
|
||||
<i class="bx bx-plus-circle fs-4 lh-0"></i>
|
||||
</a>
|
||||
|
||||
</div>
|
||||
</div>
|
||||
}
|
||||
}
|
||||
Loading…
Reference in New Issue