Make showing of rangeBox based on parameter

This commit is contained in:
Henrik Giesel 2020-12-22 22:36:39 +01:00
parent 5d117cf1a0
commit ebc1a86b2e
2 changed files with 38 additions and 33 deletions

View file

@ -13,6 +13,7 @@
export let search: string; export let search: string;
export let days: number; export let days: number;
export let withRangeBox: boolean;
let sourceData: pb.BackendProto.GraphsOut | null = null; let sourceData: pb.BackendProto.GraphsOut | null = null;
@ -95,44 +96,46 @@
} }
</style> </style>
<div class="range-box"> {#if withRangeBox}
<div class="spin {refreshing ? 'active' : ''}"></div> <div class="range-box">
<div class="spin {refreshing ? 'active' : ''}"></div>
<div class="range-box-inner">
<label>
<input type="radio" bind:group={searchRange} value={SearchRange.Deck} />
{deck}
</label>
<label>
<input
type="radio"
bind:group={searchRange}
value={SearchRange.Collection} />
{collection}
</label>
<div class="range-box-inner">
<label>
<input type="radio" bind:group={searchRange} value={SearchRange.Deck} />
{deck}
</label>
<label>
<input <input
type="radio" type="text"
bind:group={searchRange} bind:value={displayedSearch}
value={SearchRange.Collection} /> on:keyup={searchKeyUp}
{collection} on:focus={() => {
</label>
<input
type="text"
bind:value={displayedSearch}
on:keyup={searchKeyUp}
on:focus={() => {
searchRange = SearchRange.Custom; searchRange = SearchRange.Custom;
}} }}
placeholder={searchLabel} /> placeholder={searchLabel} />
</div> </div>
<div class="range-box-inner"> <div class="range-box-inner">
<label> <label>
<input type="radio" bind:group={revlogRange} value={RevlogRange.Year} /> <input type="radio" bind:group={revlogRange} value={RevlogRange.Year} />
{year} {year}
</label> </label>
<label> <label>
<input type="radio" bind:group={revlogRange} value={RevlogRange.All} /> <input type="radio" bind:group={revlogRange} value={RevlogRange.All} />
{all} {all}
</label> </label>
</div>
</div> </div>
</div> <div class="range-box-pad" />
<div class="range-box-pad" /> {/if}
<div tabindex="-1" class="no-focus-outline"> <div tabindex="-1" class="no-focus-outline">
{#if sourceData} {#if sourceData}

View file

@ -21,6 +21,7 @@ export function graphs(
graphs: any[], { graphs: any[], {
search = "deck:current", search = "deck:current",
days = 31, days = 31,
withRangeBox = true,
} = {}, } = {},
): void { ): void {
const nightMode = checkNightMode(); const nightMode = checkNightMode();
@ -34,6 +35,7 @@ export function graphs(
nightMode, nightMode,
search, search,
days, days,
withRangeBox,
}, },
}); });
}); });