File size: 2,554 Bytes
1123781
46bd9ac
1123781
 
 
 
ff9325e
f45636e
d6fedfa
1123781
46bd9ac
1123781
46bd9ac
 
1123781
 
6a5df00
 
 
 
3207814
d6fedfa
3207814
0b5ceff
3207814
d6fedfa
3207814
d6fedfa
f45636e
 
1123781
 
 
 
6a5df00
 
 
 
46bd9ac
6a5df00
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
<script lang="ts">
  import type { Fields } from '$lib/types';
  import { FieldType } from '$lib/types';
  import InputRange from './InputRange.svelte';
  import SeedInput from './SeedInput.svelte';
  import TextArea from './TextArea.svelte';
  import Checkbox from './Checkbox.svelte';
  import Selectlist from './Selectlist.svelte';
  import { pipelineValues } from '$lib/store';

  export let pipelineParams: Fields;

  $: advanceOptions = Object.values(pipelineParams)?.filter((e) => e?.hide == true);
  $: featuredOptions = Object.values(pipelineParams)?.filter((e) => e?.hide !== true);
</script>

<div class="flex flex-col gap-3">
  <div class="grid grid-cols-1 items-center gap-3">
    {#if featuredOptions}
      {#each featuredOptions as params}
        {#if params.field === FieldType.RANGE}
          <InputRange {params} bind:value={$pipelineValues[params.id]}></InputRange>
        {:else if params.field === FieldType.SEED}
          <SeedInput {params} bind:value={$pipelineValues[params.id]}></SeedInput>
        {:else if params.field === FieldType.TEXTAREA}
          <TextArea {params} bind:value={$pipelineValues[params.id]}></TextArea>
        {:else if params.field === FieldType.CHECKBOX}
          <Checkbox {params} bind:value={$pipelineValues[params.id]}></Checkbox>
        {:else if params.field === FieldType.SELECT}
          <Selectlist {params} bind:value={$pipelineValues[params.id]}></Selectlist>
        {/if}
      {/each}
    {/if}
  </div>

  <details>
    <summary class="cursor-pointer font-medium">Advanced Options</summary>
    <div
      class="grid grid-cols-1 items-center gap-3 {Object.values(pipelineParams).length > 5
        ? 'sm:grid-cols-2'
        : ''}"
    >
      {#if advanceOptions}
        {#each advanceOptions as params}
          {#if params.field === FieldType.RANGE}
            <InputRange {params} bind:value={$pipelineValues[params.id]}></InputRange>
          {:else if params.field === FieldType.SEED}
            <SeedInput {params} bind:value={$pipelineValues[params.id]}></SeedInput>
          {:else if params.field === FieldType.TEXTAREA}
            <TextArea {params} bind:value={$pipelineValues[params.id]}></TextArea>
          {:else if params.field === FieldType.CHECKBOX}
            <Checkbox {params} bind:value={$pipelineValues[params.id]}></Checkbox>
          {:else if params.field === FieldType.SELECT}
            <Selectlist {params} bind:value={$pipelineValues[params.id]}></Selectlist>
          {/if}
        {/each}
      {/if}
    </div>
  </details>
</div>