Hacktoberfest 2026: los issues que los mantenedores marcaron para octubre, abiertos y aptos para principiantes. Explorar issues de Hacktoberfest

Add Template

Abierto
#363 0 comentarios 0 reacciones 0 asignados Ver en GitHub

Nadie ha tomado este issue todavía.

Evaluación

Dificultad
4/5
Tiempo estimado
3-5 días
Aptitud para principiantes
30/100
Tipo de issue
Nueva funcionalidad
Claridad
Bastante claro
Estado de actividad
Estancado
Stack tecnológico
typescript

Línea de trabajo

Comienza en la pestaña Template-uri y revisa las referencias de Figma Add Template y Add Terms Modal; después, sigue el flujo de create-template a través de Header, Body, Footer, preview, rich-text modal y save redirect. La tarea estará terminada cuando los usuarios puedan crear y editar el template, ver los datos de la organización en campos deshabilitados, guardar correctamente y seguir los enlaces especificados.

Escrito por el modelo de indexación a partir del texto del issue.

Descripción

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
Lenguaje dominante
TypeScript
Estrellas
3
Forks
2
Métricas de merge de PR
Sin PR fusionados en 30 d

Preparar el entorno

Primeros pasos

  1. Lee el issue completo y luego la guía de contribución del proyecto.
  2. Comenta en el issue que vas a ocuparte — evita que dos personas hagan lo mismo.
  3. Haz un fork del repositorio y trabaja en una rama.
  4. Abre un pull request que haga referencia al número del issue.

Más de code4romania/vic

Todos los issues de code4romania/vic

Issues similares

Más issues de TypeScript

Recibe los nuevos issues en tu correo

Un resumen breve de issues de GitHub para principiantes.