Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Ajout d'un bouton dupliquer ligne sur saisie des espèces #98

Merged
merged 12 commits into from
Oct 15, 2024
Merged

Ajout d'un bouton dupliquer ligne sur saisie des espèces #98

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
12 commits
Select commit Hold shift + click to select a range
2b5b8b1
Extraction de la ligne de saisie des données oiseaux atteints du tabl…
DavidBruant Oct 3, 2024
2f59efc
Affichage de la ligne OiseauRow lors de l'autocomplétion
DavidBruant Oct 7, 2024
076fdd3
Ça pré-rempli automatiquement de manière groupée
DavidBruant Oct 7, 2024
6b36189
Extraction de FauneNonOiseauRow
DavidBruant Oct 8, 2024
314b54d
Pré-remplissage complet faune non-oiseau
DavidBruant Oct 8, 2024
8d8ade0
Extraction FloreRow
DavidBruant Oct 8, 2024
ba4b4fb
Ajout d'un bouton dupliquer ligne sur saisie des espèces
Ynote Oct 10, 2024
37d4eaf
Merge branch 'main' of github.com:betagouv/pitchou into dupliquer-lig…
Ynote Oct 15, 2024
d836d61
Utilise rem plutôt que px
Ynote Oct 15, 2024
d199fac
Petit amélioration de syntaxe
Ynote Oct 15, 2024
5289f4b
Renomme les fichiers des lignes pour chaque espèce atteinte
Ynote Oct 15, 2024
490a8b4
Change la signature de onDupliquerLigne
Ynote Oct 15, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
38 changes: 35 additions & 3 deletions ...ts/SaisieEspèces/FauneNonOiseauRow.svelte → ...èces/FauneNonOiseauAtteinteEditRow.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,8 +3,9 @@

import { makeEspèceToKeywords, makeEspèceToLabel, fourchettesIndividus } from "../../espèceFieldset.js";
import AutocompleteEspeces from "../AutocompleteEspèces.svelte"
import CopyFileIcon from "../icons/CopyFileIcon.svelte"

/** @import {EspèceProtégée, ActivitéMenançante, MéthodeMenançante, TransportMenançant} from "../../../types/especes.js" */
/** @import {FauneNonOiseauAtteinte, EspèceProtégée, ActivitéMenançante, MéthodeMenançante, TransportMenançant} from "../../../types/especes.js" */

/** @type {EspèceProtégée | undefined} */
export let espèce = undefined
Expand All @@ -19,6 +20,9 @@
/** @type {number | undefined} */
export let surfaceHabitatDétruit = undefined

/** @param {FauneNonOiseauAtteinte} fauneNonOiseauAtteinte */
export let onDupliquerLigne

/** @param {EspèceProtégée} _espèce */
export let onSupprimerLigne

Expand All @@ -43,6 +47,16 @@
/** @param {EspèceProtégée} esp */
const autocompleteLabelFunction = esp => espècesToLabel.get(esp)

const dupliquerLigne = () => onDupliquerLigne(
{
espèce,
activité,
méthode,
transport,
nombreIndividus,
surfaceHabitatDétruit
},
)
</script>

<tr>
Expand Down Expand Up @@ -99,9 +113,17 @@
<input type="number" bind:value={surfaceHabitatDétruit} min="0" step="1" class="fr-input">
</td>

{#if onDupliquerLigne}
<td class="icon-cell">
<button type="button" on:click={dupliquerLigne}>
<CopyFileIcon />
</button>
</td>
{/if}

{#if onSupprimerLigne}
<td>
<button type="button" on:click={() => onSupprimerLigne(espèce)}>❌</button>
<button type="button" on:click={onSupprimerLigne}>❌</button>
</td>
{/if}
</tr>
Expand Down Expand Up @@ -135,5 +157,15 @@
select{
max-width: 10rem;
}

.icon-cell {
text-align: center;
vertical-align: middle;

button {
height: 1.5rem;
width: 1.5rem;
}
}
}
</style>
</style>
18 changes: 15 additions & 3 deletions scripts/front-end/components/SaisieEspèces/FieldsetFlore.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@

import { makeEspèceToKeywords, makeEspèceToLabel} from "../../espèceFieldset.js";
import AutocompleteEspeces from "../AutocompleteEspèces.svelte"
import FloreRow from "./FloreRow.svelte"
import FloreAtteinteEditRow from "./FloreAtteinteEditRow.svelte"

/** @import {FloreAtteinte, EspèceProtégée, ActivitéMenançante} from "../../../types/especes.d.ts" */

Expand Down Expand Up @@ -47,6 +47,15 @@

rerender()
}

/**
* @param {FloreAtteinte} floreAtteinte
*/
function onDupliquerLigne(floreAtteinte) {
floresAtteintes.push(floreAtteinte)

rerender()
}
</script>

<div class="fr-grid-row fr-mb-4w fr-grid-row--center">
Expand All @@ -61,16 +70,18 @@
<th>Type d’impact</th>
<th>Nombre d'individus</th>
<th>Surface habitat détruit (m²)</th>
<th>Dupliquer la ligne</th>
<th>Supprimer la ligne</th>
</tr>
</thead>

<tbody>
{#each floresAtteintes as {espèce, activité, nombreIndividus, surfaceHabitatDétruit}}
<FloreRow
<FloreAtteinteEditRow
bind:espèce bind:activité bind:nombreIndividus bind:surfaceHabitatDétruit
{espècesProtégéesFlore} {activitésMenaçantes}
{onSupprimerLigne}
{onDupliquerLigne}
/>
{/each}

Expand All @@ -94,6 +105,7 @@
<input disabled type="number" class="fr-input">
</td>
<td></td>
<td></td>
</tr>
</tbody>
</table>
Expand Down Expand Up @@ -160,4 +172,4 @@
}
}
}
</style>
</style>
18 changes: 15 additions & 3 deletions scripts/front-end/components/SaisieEspèces/FieldsetNonOiseau.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@

import { makeEspèceToKeywords, makeEspèceToLabel} from "../../espèceFieldset.js";
import AutocompleteEspeces from "../AutocompleteEspèces.svelte"
import FauneNonOiseauRow from "./FauneNonOiseauRow.svelte"
import FauneNonOiseauAtteinteEditRow from "./FauneNonOiseauAtteinteEditRow.svelte"

/** @import {FauneNonOiseauAtteinte, EspèceProtégée, ActivitéMenançante, MéthodeMenançante, TransportMenançant} from "../../../types/especes.d.ts" */

Expand Down Expand Up @@ -53,6 +53,15 @@

rerender()
}

/**
* @param {FauneNonOiseauAtteinte} fauneNonOiseauAtteinte
*/
function onDupliquerLigne(fauneNonOiseauAtteinte) {
faunesNonOiseauxAtteintes.push(fauneNonOiseauAtteinte)

rerender()
}
</script>

<div class="fr-grid-row fr-mb-4w fr-grid-row--center">
Expand All @@ -69,16 +78,18 @@
<th>Moyen de poursuite</th>
<th>Nombre d'individus</th>
<th>Surface habitat détruit (m²)</th>
<th>Dupliquer la ligne</th>
<th>Supprimer la ligne</th>
</tr>
</thead>

<tbody>
{#each faunesNonOiseauxAtteintes as {espèce, activité, méthode, transport, nombreIndividus, surfaceHabitatDétruit}}
<FauneNonOiseauRow
<FauneNonOiseauAtteinteEditRow
bind:espèce bind:activité bind:méthode bind:transport bind:nombreIndividus bind:surfaceHabitatDétruit
{espècesProtégéesFauneNonOiseau} {activitésMenaçantes} {méthodesMenaçantes} {transportMenaçants}
{onSupprimerLigne}
{onDupliquerLigne}
/>
{/each}

Expand Down Expand Up @@ -106,6 +117,7 @@
</td>
<td><input disabled type="number" class="fr-input"></td>
<td></td>
<td></td>
</tr>
</tbody>
</table>
Expand Down Expand Up @@ -162,4 +174,4 @@
}
}
}
</style>
</style>
18 changes: 15 additions & 3 deletions scripts/front-end/components/SaisieEspèces/FieldsetOiseau.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,7 +3,7 @@

import { makeEspèceToKeywords, makeEspèceToLabel } from "../../espèceFieldset.js";
import AutocompleteEspeces from "../AutocompleteEspèces.svelte"
import OiseauRow from "./OiseauRow.svelte"
import OiseauAtteintEditRow from "./OiseauAtteintEditRow.svelte"

/** @import {OiseauAtteint, EspèceProtégée, ActivitéMenançante, MéthodeMenançante, TransportMenançant} from "../../../types/especes.d.ts" */

Expand Down Expand Up @@ -53,6 +53,15 @@

rerender()
}

/**
* @param {OiseauAtteint} oiseauAtteint
*/
function onDupliquerLigne(oiseauAtteint) {
oiseauxAtteints.push(oiseauAtteint)
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

ah ouais, voilà ! C'est ce que je me disais, ça simplifie plutôt bien le code (même si on ne parle que d'une ligne...)


rerender()
}
</script>

<div class="fr-grid-row fr-mb-4w fr-grid-row--center">
Expand All @@ -71,16 +80,18 @@
<th>Nids</th>
<th>Œufs</th>
<th>Surface habitat détruit (m²)</th>
<th>Dupliquer la ligne</th>
<th>Supprimer la ligne</th>
</tr>
</thead>
<tbody>

{#each oiseauxAtteints as {espèce, activité, méthode, transport, nombreIndividus, nombreNids, nombreOeufs, surfaceHabitatDétruit}}
<OiseauRow
<OiseauAtteintEditRow
bind:espèce bind:activité bind:méthode bind:transport bind:nombreIndividus bind:nombreNids bind:nombreOeufs bind:surfaceHabitatDétruit
{espècesProtégéesOiseau} {activitésMenaçantes} {méthodesMenaçantes} {transportMenaçants}
{onSupprimerLigne}
{onDupliquerLigne}
/>
{/each}

Expand Down Expand Up @@ -111,6 +122,7 @@
<td><input disabled type="number" class="fr-input"></td>
<td><input disabled type="number" class="fr-input"></td>
<td></td>
<td></td>
</tr>
</tbody>
</table>
Expand Down Expand Up @@ -159,4 +171,4 @@
overflow: initial;
}
}
</style>
</style>
36 changes: 33 additions & 3 deletions .../components/SaisieEspèces/FloreRow.svelte → ...SaisieEspèces/FloreAtteinteEditRow.svelte
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -3,8 +3,9 @@

import { makeEspèceToKeywords, makeEspèceToLabel, fourchettesIndividus } from "../../espèceFieldset.js";
import AutocompleteEspeces from "../AutocompleteEspèces.svelte"
import CopyFileIcon from "../icons/CopyFileIcon.svelte"

/** @import {EspèceProtégée, ActivitéMenançante} from "../../../types/especes.js" */
/** @import {FloreAtteinte, EspèceProtégée, ActivitéMenançante} from "../../../types/especes.js" */

/** @type {EspèceProtégée | undefined} */
export let espèce = undefined
Expand All @@ -15,6 +16,9 @@
/** @type {number | undefined} */
export let surfaceHabitatDétruit = undefined

/** @param {FloreAtteinte} floreAtteinte */
export let onDupliquerLigne

/** @param {EspèceProtégée} _espèce */
export let onSupprimerLigne

Expand All @@ -33,6 +37,14 @@
/** @param {EspèceProtégée} esp */
const autocompleteLabelFunction = esp => espècesToLabel.get(esp)

const dupliquerLigne = () => onDupliquerLigne(
{
espèce,
activité,
nombreIndividus,
surfaceHabitatDétruit
},
)
</script>

<tr>
Expand Down Expand Up @@ -71,9 +83,17 @@
<input type="number" bind:value={surfaceHabitatDétruit} min="0" step="1" class="fr-input">
</td>

{#if onDupliquerLigne}
<td class="icon-cell">
<button type="button" on:click={dupliquerLigne}>
<CopyFileIcon />
</button>
</td>
{/if}

{#if onSupprimerLigne}
<td>
<button type="button" on:click={() => onSupprimerLigne(espèce) }>❌</button>
<button type="button" on:click={onSupprimerLigne}>❌</button>
</td>
{/if}
</tr>
Expand Down Expand Up @@ -105,5 +125,15 @@
select{
max-width: 10rem;
}

.icon-cell {
text-align: center;
vertical-align: middle;

button {
height: 1.5rem;
width: 1.5rem;
}
}
}
</style>
</style>
Loading