Unify category autocomplete fields
All checks were successful
Deploy Sokko G / deploy (push) Successful in 17s
All checks were successful
Deploy Sokko G / deploy (push) Successful in 17s
This commit is contained in:
parent
e3d823d0b1
commit
055fb78d60
21 changed files with 739 additions and 168 deletions
|
|
@ -1,5 +1,6 @@
|
|||
// Rôle : fournit l'outil checklist avec quantités, catégories et échange texte.
|
||||
import { useState } from "react";
|
||||
import { CategoryAutocompleteInput } from "../../../components/CategoryAutocompleteInput.jsx";
|
||||
import { Icon } from "../../../components/Icon.jsx";
|
||||
import { useGroupedReorder, moveItem } from "../../../hooks/useGroupedReorder.js";
|
||||
import { ChecklistSection } from "./ChecklistParts.jsx";
|
||||
|
|
@ -22,6 +23,7 @@ export function ChecklistModule({ toolboxId, moduleId, context, editing, textExc
|
|||
const [sectionTitle, setSectionTitle] = useState("");
|
||||
const [qty, setQty] = useState(1);
|
||||
const namedSections = data.sections.filter((section) => section.title);
|
||||
const categoryOptions = namedSections.map((section) => section.title);
|
||||
const completedSectionsMode = data.hideCompletedSectionsFully ? "hidden" : data.hideCompletedSections ? "reduced" : "visible";
|
||||
const reorderItems = getChecklistReorderItems(data.sections);
|
||||
const {
|
||||
|
|
@ -113,7 +115,7 @@ export function ChecklistModule({ toolboxId, moduleId, context, editing, textExc
|
|||
{editing && (
|
||||
<div className="module-add-panel">
|
||||
<form className="inline-form checklist-add-form" onSubmit={addItem}>
|
||||
<input className="nds-input" data-size="sm" name="section" type="text" placeholder={textContent.sectionPlaceholder || "Catégorie"} value={sectionTitle} onChange={(event) => setSectionTitle(event.target.value)} />
|
||||
<CategoryAutocompleteInput className="nds-input" data-size="sm" name="section" placeholder={textContent.sectionPlaceholder || "Catégorie"} value={sectionTitle} onChange={(event) => setSectionTitle(event.target.value)} options={categoryOptions} />
|
||||
<input className="nds-input" data-size="sm" name="label" type="text" placeholder={textContent.itemPlaceholder || "Nouvel item"} value={label} onChange={(event) => setLabel(event.target.value)} />
|
||||
<input className="checklist-qty-input nds-input" data-size="sm" name="qty" type="number" min="1" value={qty} onChange={(event) => setQty(event.target.value)} aria-label={textContent.quantityLabel || "Quantité cible"} />
|
||||
<button className="nds-button" data-size="sm" data-variant="primary">{textContent.addButton || "Ajouter"}</button>
|
||||
|
|
@ -172,6 +174,7 @@ export function ChecklistModule({ toolboxId, moduleId, context, editing, textExc
|
|||
onUpdateItem={updateItem}
|
||||
onMoveItemToCategory={moveItemToCategory}
|
||||
onDeleteItem={deleteItem}
|
||||
categoryOptions={categoryOptions}
|
||||
/>,
|
||||
showBoundaryDropZones && isLastSection ? (
|
||||
<li
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue