Hacktoberfest 2026: le issue che i maintainer hanno segnato per ottobre, aperte e adatte ai principianti. Sfoglia le issue Hacktoberfest

Add Template

Aperta
#363 0 commenti 0 reazioni 0 assegnatari Vedi su GitHub

Nessuno ha ancora preso questa issue.

Valutazione

Difficoltà
4/5
Tempo stimato
3-5 giorni
Idoneità per principianti
30/100
Tipo di issue
Funzionalità
Chiarezza
Abbastanza chiara
Stato di attività
Ferma
Stack tecnologico
typescript

Direzione di ricerca

Inizia dalla scheda Template-uri e esamina i riferimenti Figma Add Template e Add Terms Modal, quindi segui il flusso create-template attraverso Header, Body, Footer, preview, rich-text modal e save redirect. Il lavoro è completato quando gli utenti possono creare e modificare il template, visualizzare i dati dell’organizzazione nei campi disabilitati, salvare correttamente e seguire i link specificati.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Descrizione

enhancement :rocket: web-app
  • #380

User Story

As a user, I want to create contract templates, so that I can efficiently and easily generate volunteer contracts.

Description

This feature enables users to create contract templates for volunteers. The page is divided into three sections: Header, Body, and Footer.

The Header section includes a text containing key details about NGO such as the official name, address, CUI, the name of the legal representative, and their role within the organization.

The Body section contains the contract terms, featuring a text field, an "Add Text" button, and a hyperlink.

The Footer section includes the NGO's name, the legal representative's name, and empty fields for the volunteer's information and, if applicable, the legal representative for volunteers under 16.

All three sections collectively form the contract, which is displayed as a unified preview.

Actors

  • Web Users

Preconditions

  • User must be logged in and have navigated to the 'Template-uri' tab

Main Flow (create template)

  1. User clicks the "Creeaza template" button to start creating a new template.
  2. The system displays the 'Creeaza Template' page, divided into Header, Body, and Footer sections.
  3. The system auto-fills the Header and Footer sections with the organization's data.
  4. In the Preview Panel, the user can hover over highlighted text to view a tooltip.
  5. User clicks the 'Adauga text' button from the Body section.
  6. The system opens a modal with a rich text editor.
  7. User enters the contract terms and clicks 'Salveaza modificarile' button.
  8. The system updates the Body section with the entered text.
  9. User clicks the 'Salveaza' button.
  10. The system saves the template and redirects the user to the 'Template-uri' page.

Business Rules

  1. The contract template must maintain a structure with a Header, Body, and Footer.
  2. The Header and Footer sections inputs should be prefilled with the NGO data present in the NGO Hub application.
  3. The Header and Footer sections inputs must be disabled.
  4. The Body section must display an "Editeaza text" button when content has been added.

Acceptance Criteria

  1. The rich text editor should provides a full range of formatting options (bold, italic, underline, alignment, lists, etc.).
  2. Clicking the "Editeaza text" button in Body section should open the content in a modal for modifications.
  3. The contract template can be successfully created and saved after completing all steps.
  4. The 'Vezi profilul organizatiei' hyperlink must redirect user to the NGO Profile in NGO Hub application.
  5. The 'Afla Mai Multe', 'Trimite feedback-ul tau,' and 'contract de voluntariat' hyperlinks must direct users to the correct URLs, which will be provided at a later time.

Additional Information

  • Figma references:
    • Add Template Page: here
    • Add Terms Modal: here
Lingua principale
TypeScript
Stelle
3
Fork
2
Metriche di merge delle PR
Nessuna PR unita negli ultimi 30g

Preparare l'ambiente

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Altre issue di code4romania/vic

Tutte le issue di code4romania/vic

Issue simili

Altre issue su TypeScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.