aotds/aotds-docks
1
0
Fork 0
Code Issues 28 Pull Requests Projects 2 Releases Wiki Activity

carrier component

Browse Source
This commit is contained in:
Yanick Champoux 2023-03-21 13:57:43 -04:00
parent 7a72407e49
commit 1255e05420
4 changed files with 50 additions and 40 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

8
src/lib/components/ShipEdit/Carrier.story.svelte Normal file
View File

@ -0,0 +1,8 @@
<Hst.Story title="ShipEdit/Carrier">
<Carrier />
</Hst.Story>
<script>
export let Hst;
import Carrier from "./Carrier.svelte";
</script>

34
src/lib/components/ShipEdit/Carrier.svelte Normal file
View File

@ -0,0 +1,34 @@
<Section label="carrier">
<ShipItem {...reqs}>
<Field label="bays">
<input class="short" type="number" min="0" bind:value={bays} />
</Field>
</ShipItem>
{#each squadrons as squadron, id (id)}
<Squadron {...squadron} id={id + 1} />
{/each}
</Section>
<script lang="ts">
import { getContext } from "svelte";
import Field from "$lib/components/Field.svelte";
import ShipItem from "$lib/components/ShipItem.svelte";
import Section from "$lib/components/Section.svelte";
import Squadron from "./Carrier/Squadron.svelte";
export let bays = 0;
export let reqs = { cost: 0, mass: 0 };
export let squadrons = [];
export let api = getContext("api");
$: api?.dispatch?.setCarrierBays?.(bays);
</script>
<style>
input {
width: 5em;
}
</style>

14
src/lib/components/ShipEdit/Carrier/Squadron.svelte
View File

@ -1,4 +1,5 @@
<ShipItem {...reqs}> <ShipItem {...reqs}>
<!--
<Field label={`squadron ${id}`}> <Field label={`squadron ${id}`}>
<select bind:value={type}> <select bind:value={type}>
{#each types as type (type)} {#each types as type (type)}
@ -6,23 +7,24 @@
{/each} {/each}
</select> </select>
</Field> </Field>
-->
</ShipItem> </ShipItem>
<script> <script>
import { getContext } from "svelte"; import { getContext } from "svelte";
import Section from "$lib/components/Section/index.svelte"; import Section from "$lib/components/Section.svelte";
import Field from "$lib/components/Field/index.svelte"; import Field from "$lib/components/Field.svelte";
import ShipItem from "$lib/components/ShipItem/index.svelte"; import ShipItem from "$lib/components/ShipItem.svelte";
import { squadronTypes } from "$lib/shipDux/carrier"; // import { squadronTypes } from "$lib/shipDux/carrier";
const types = squadronTypes.map(({ type }) => type); const types = squadronTypes.map(({ type }) => type);
export let id = 1; export let id = 1;
export let type = types[0].type; export let type = ""; //types[0].type;
export let reqs = {}; export let reqs = {};
export let { dispatch } = getContext("ship"); export let { dispatch } = getContext("api");
$: console.log(type); $: console.log(type);
$: dispatch.setSquadronType({ type, id }); $: dispatch.setSquadronType({ type, id });

34
src/lib/components/ShipEdit/Carrier/index.svelte
View File

@ -1,34 +0,0 @@
<Section label="carrier">
<ShipItem {...reqs}>
<Field label="bays">
<input class="short" type="number" min="0" bind:value={bays} />
</Field>
</ShipItem>
{#each squadrons as squadron,id (id)}
<Squadron {...squadron} id={id+1} />
{/each}
</Section>
<script lang="ts">
import { getContext } from 'svelte';
import Field from '$lib/components/Field/index.svelte';
import ShipItem from '$lib/components/ShipItem/index.svelte';
import Section from '$lib/components/Section/index.svelte';
import Squadron from './Squadron.svelte';
export let bays = 0;
export let reqs = {};
export let squadrons = [];
const { dispatch } = getContext('ship');
$: dispatch.setCarrierBays(bays);
</script>
<style>
input {
width: 5em;
}
</style>