Add Template

未关闭
  • 哪里不对？
#363 0 条评论 0 个 reaction 已指派 0 人 在 GitHub 查看

还没有人认领这个 Issue。

评估

难度
4/5
预计耗时
3-5 天
新手友好度
30/100
Issue 类型
功能
描述清晰度
基本清楚
活跃度
停滞
技术栈
typescript
领域
frontend, full-stack

调研方向

从 Template-uri 标签页开始，查看 Add Template 和 Add Terms Modal 的 Figma 参考，然后跟踪 create-template 流程，依次经过 Header、Body、Footer、preview、rich-text modal 和 save redirect。完成的标准是用户可以创建和编辑 template，在禁用字段中看到组织数据，成功保存，并访问指定的链接。

由索引模型根据 Issue 内容生成。

描述

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
主要语言
TypeScript
星标
3
派生
2
30 天内没有已合并 PR

环境准备

  • 没有 Dockerfile 或 Docker Compose 文件
  • 没有 Pull Request 模板
  • 阅读贡献指南

从这里开始

  1. 先读完整个 Issue，再读项目的贡献指南。
  2. 在 Issue 下留言说明你要接手 —— 这能避免两个人做同样的事。
  3. Fork 仓库，在一个分支上完成修改。
  4. 提交 Pull Request，并在描述里引用这个 Issue 编号。

code4romania/vic 的其他 Issue

查看 code4romania/vic 的全部 Issue

相似的 Issue

更多 TypeScript Issue

把新 issue 发到你的邮箱

精选适合新手参与的 GitHub issue 摘要。