fuma 0.4.3 → 0.4.5
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -7,7 +7,6 @@ import { Icon } from "../icon/index.js";
|
|
|
7
7
|
import { subscibeDrawerLayers } from "./layers.js";
|
|
8
8
|
import { contextContainer } from "../context.js";
|
|
9
9
|
import { drawerFly } from "./drawerFly.js";
|
|
10
|
-
import { writable } from "svelte/store";
|
|
11
10
|
export let title = "";
|
|
12
11
|
export let key;
|
|
13
12
|
let klass = "";
|
|
@@ -18,6 +17,7 @@ export let classBody = "";
|
|
|
18
17
|
export let duration = 180;
|
|
19
18
|
export let noOverlay = false;
|
|
20
19
|
export let transitionX = 0;
|
|
20
|
+
export let zIndex = 50;
|
|
21
21
|
export function open(value = 1, options = {}) {
|
|
22
22
|
return goto($urlParam.with({ [key]: value }), {
|
|
23
23
|
...options,
|
|
@@ -43,7 +43,7 @@ onMount(() => {
|
|
|
43
43
|
on:click={() => close()}
|
|
44
44
|
on:keyup={() => close()}
|
|
45
45
|
transition:fade={{ duration }}
|
|
46
|
-
style="z-index: {
|
|
46
|
+
style="z-index: {zIndex + $index};"
|
|
47
47
|
class="fixed inset-0 bg-black/15 backdrop-blur-[1.5px] dark:bg-white/15"
|
|
48
48
|
/>
|
|
49
49
|
{/if}
|
|
@@ -60,7 +60,7 @@ onMount(() => {
|
|
|
60
60
|
}
|
|
61
61
|
}}
|
|
62
62
|
style="
|
|
63
|
-
z-index: {
|
|
63
|
+
z-index: {zIndex + $index};
|
|
64
64
|
max-width: min(100%, {maxWidth});
|
|
65
65
|
transform: translateX({-$offset * 4}rem);
|
|
66
66
|
transition-duration: {duration}ms;
|
|
@@ -10,6 +10,7 @@ declare const __propDef: {
|
|
|
10
10
|
duration?: number | undefined;
|
|
11
11
|
noOverlay?: boolean | undefined;
|
|
12
12
|
transitionX?: number | undefined;
|
|
13
|
+
zIndex?: number | undefined;
|
|
13
14
|
open?: ((value?: number, options?: {
|
|
14
15
|
replaceState?: boolean | undefined;
|
|
15
16
|
noScroll?: boolean | undefined;
|
|
@@ -1,22 +1,18 @@
|
|
|
1
1
|
<script>import { mdiCalendarMonthOutline, mdiClose } from "@mdi/js";
|
|
2
2
|
import dayjs from "dayjs";
|
|
3
3
|
import { goto } from "$app/navigation";
|
|
4
|
-
import { page } from "$app/stores";
|
|
5
4
|
import { urlParam } from "../../store/param.js";
|
|
6
5
|
import { formatRange } from "./format.js";
|
|
7
6
|
import { Icon } from "../icon/index.js";
|
|
8
7
|
import { DropDown } from "../menu/index.js";
|
|
9
8
|
import { InputTime } from "../input/index.js";
|
|
10
9
|
import { RangePicker } from "./index.js";
|
|
10
|
+
import { jsonParse } from "../../utils/jsonParse.js";
|
|
11
11
|
export let minDate = void 0;
|
|
12
12
|
export let maxDate = void 0;
|
|
13
13
|
let dropDown;
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
export let range = {
|
|
17
|
-
start: start ? new Date(start) : void 0,
|
|
18
|
-
end: end ? new Date(end) : void 0
|
|
19
|
-
};
|
|
14
|
+
export let key = "range";
|
|
15
|
+
export let range = jsonParse($urlParam.get(key), { start: null, end: null });
|
|
20
16
|
$:
|
|
21
17
|
isValidPeriod = !!range.start && !!range.end;
|
|
22
18
|
function getLabel(_range) {
|
|
@@ -30,16 +26,18 @@ function handleSubmit() {
|
|
|
30
26
|
return;
|
|
31
27
|
goto(
|
|
32
28
|
$urlParam.with({
|
|
33
|
-
|
|
34
|
-
|
|
29
|
+
[key]: JSON.stringify({
|
|
30
|
+
start: range.start?.toJSON(),
|
|
31
|
+
end: range.end?.toJSON()
|
|
32
|
+
})
|
|
35
33
|
}),
|
|
36
34
|
{ replaceState: true, noScroll: true }
|
|
37
35
|
);
|
|
38
36
|
}
|
|
39
37
|
function handleReset() {
|
|
40
38
|
dropDown.hide();
|
|
41
|
-
range = { start:
|
|
42
|
-
goto($urlParam.without(
|
|
39
|
+
range = { start: null, end: null };
|
|
40
|
+
goto($urlParam.without(key), { replaceState: true, noScroll: true });
|
|
43
41
|
}
|
|
44
42
|
</script>
|
|
45
43
|
|
|
@@ -56,22 +54,9 @@ function handleReset() {
|
|
|
56
54
|
{/if}
|
|
57
55
|
</div>
|
|
58
56
|
|
|
59
|
-
<form class="flex flex-col" on:submit|preventDefault={handleSubmit}
|
|
57
|
+
<form class="flex flex-col" on:submit|preventDefault={handleSubmit}>
|
|
60
58
|
<RangePicker numberOfMonths={1} bind:range {minDate} {maxDate} />
|
|
61
59
|
|
|
62
|
-
<input
|
|
63
|
-
class="hidden"
|
|
64
|
-
type="text"
|
|
65
|
-
name="start"
|
|
66
|
-
value={range.start ? dayjs(range.start).toJSON() : ''}
|
|
67
|
-
/>
|
|
68
|
-
<input
|
|
69
|
-
class="hidden"
|
|
70
|
-
type="text"
|
|
71
|
-
name="end"
|
|
72
|
-
value={range.end ? dayjs(range.end).toJSON() : ''}
|
|
73
|
-
/>
|
|
74
|
-
|
|
75
60
|
<div class="flex gap-2 p-2">
|
|
76
61
|
<InputTime
|
|
77
62
|
label="A partir de"
|