forked from MapComplete/MapComplete
63 lines
2 KiB
Svelte
63 lines
2 KiB
Svelte
<script lang="ts">
|
|
/**
|
|
* Opens the 'Opening hours input' in another top level window
|
|
*/
|
|
import { UIEventSource } from "../../../Logic/UIEventSource"
|
|
import PublicHolidaySelector from "../../OpeningHours/PublicHolidaySelector.svelte"
|
|
import OHTable from "./OpeningHours/OHTable.svelte"
|
|
import OpeningHoursState from "../../OpeningHours/OpeningHoursState"
|
|
import Popup from "../../Base/Popup.svelte"
|
|
import Tr from "../../Base/Tr.svelte"
|
|
import Translations from "../../i18n/Translations"
|
|
import Check from "@babeard/svelte-heroicons/mini/Check"
|
|
import { CloseButton } from "flowbite-svelte"
|
|
import Cross from "../../../assets/svg/Cross.svelte"
|
|
import XMark from "@babeard/svelte-heroicons/mini/XMark"
|
|
|
|
export let value: UIEventSource<string>
|
|
export let args: string
|
|
let prefix = ""
|
|
let postfix = ""
|
|
if (args) {
|
|
try {
|
|
const data = JSON.stringify(args)
|
|
if (data["prefix"]) {
|
|
prefix = data["prefix"]
|
|
}
|
|
if (data["postfix"]) {
|
|
postfix = data["postfix"]
|
|
}
|
|
} catch (e) {
|
|
console.error("Could not parse arguments")
|
|
}
|
|
}
|
|
|
|
const state = new OpeningHoursState(value, prefix, postfix)
|
|
let expanded = new UIEventSource(false)
|
|
|
|
function abort() {
|
|
expanded.set(false)
|
|
}
|
|
</script>
|
|
|
|
<Popup bodyPadding="p-0" shown={expanded}>
|
|
<OHTable value={state.normalOhs} />
|
|
<div class="absolute flex w-full justify-center" style="bottom: -3rem">
|
|
<button on:click={() => abort()}>
|
|
<XMark class="m-0 h-6 w-6" />
|
|
<Tr t={Translations.t.general.cancel} />
|
|
</button>
|
|
<button class=" primary" on:click={() => expanded.set(false)}>
|
|
<Check class="m-0 h-6 w-6 shrink-0 p-0" color="white" />
|
|
<Tr t={Translations.t.general.confirm} />
|
|
</button>
|
|
</div>
|
|
<CloseButton
|
|
class="absolute right-0 top-0 z-10"
|
|
style="margin-top: -1.0rem"
|
|
on:click={() => abort()}
|
|
/>
|
|
</Popup>
|
|
|
|
<button on:click={() => expanded.set(true)}>Pick opening hours</button>
|
|
<PublicHolidaySelector value={state.phSelectorValue} />
|