C++课程设计:2-设计程序

Home Doc Changelog Download About

Prompt

我准备设计一个程序,用于项目管理。负责记录项目执行事件并可视化监视我的项目执行时间分布。

这个程序可以增,删,查,改项目,并记录某个项目的每一段开始,结束时间,存储在markdown文件构成的数据日志上。

每个项目存储为一个markdown .md文件。项目具有“In Planing”,"In Process", “Done”等属性,并可以输入“#”形式的标签并支持后续编辑。具有若干条“执行”,每条执行包括了“开始日期-时间”,“结束日期-时间”,“用时(结束-开始时间)”以及对上述所有条目的“日统计”,“周统计”,“月统计”,“年统计”。

当打开程序时,程序自动读取文件目录下所有项目的markdown文件。

整体为视图页面,展示“当日”的统计数据,并可以切换为:“本周”“本月”“本年度”视图。当日的统计数据按照“总时间”降序排行榜地形式显示{项目名称}:{HH/MM/SS},其中{HH/MM/SS}表示当日总用时,为属于当日所有事件持续时间的总和,按照HH/MM/SS的时间格式显示。
点击排行榜中的项目名称,开始计时,作为新的“执行”的“开始时间”记录到.md文件中,并在再次点击时

视图页面最下方为一个“+”号按钮,用于新建项目,输入项目名称并选择“In Planing”,"In Process", “Done”之一的属性后会在对应的属性文件夹下新建{项目名}.md文件,当修改其属性时,就会从原来属性所在的文件夹移动到目标属性的文件夹。

给出需要用到的技术栈,markdown数据存储的文件树,程序项目的文件树和每个代码文件的功能职责,以及关于数据展示的细节解释。

Technical Stack

Frontend: React or Vue for building the UI components
Backend: Node.js + Express for the server and API
Database: Markdown files stored locally to persist project data

File Structure

├── server/
│   ├── api/
│   │   └── projects.js // CRUD APIs for projects
│   └── index.js // Express app
├── client/
│   ├── src/
│   │   ├── components/ // React/Vue components
│   │   ├── App.jsx
│   │   └── index.js
│   └── public/
│       └── index.html  
├── data/
│   ├── inPlanning/ // Markdown files for 'In Planning' projects
│   ├── inProgress/ // Markdown files for 'In Progress' projects  
│   └── done/ // Markdown files for completed projects

组件职责

App - 父组件,管理状态和子组件
ProjectList - 显示按今日总时间排序的项目排行榜
ProjectDetail - 显示项目的详细信息和历史记录
ProjectForm - 用于创建/编辑项目的表单
项目数据展示

主页的 ProjectList 根据今日总时间对项目排行
点击项目会显示 ProjectDetail 组件,展示历史记录和元数据
通过 ProjectForm 组件创建新项目
从 /data 文件夹中的 Markdown 文件加载数据
当改变项目状态时,调用 API 将项目文件移动


如果使用Python GNU或者基于Python的web Demo,应该如何设计?全部重新设计。

技术栈

前端:Vue + Element UI
后端:Python + 统一架构/大二下项目/Python/Flask
数据库:SQLite

project_manager
├─ app.py # Flask应用入口
├─ requirements.txt # 依赖包列表
├─ manage.py # Flask项目命令脚本
├─ config.py # 配置文件

├─ app/
|  ├─ __init__.py 
|  ├─ views.py # 视图函数
|  ├─ models.py # 数据模型
|  ├─ util.py # 工具函数

├─ migrations/ # 数据库迁移脚本

├─ static/
|  ├─ css/ 
|  ├─ js/
|  └─ images/

├─ templates/ # HTML模板
|  ├─ index.html 
|  ├─ project.html
|  └─ base.html

└─ vue-app/ # Vue前端
   ├─ ...

组件设计

App.vue - 根组件,包含导航栏和路由
ProjectList.vue - 项目列表排行组件
ProjectDetail.vue - 项目详情组件
ProjectEdit.vue - 项目编辑组件
接口设计

GET /api/projects - 获取所有项目
GET /api/projects/:id - 获取单个项目
POST /api/projects - 新建项目
PUT /api/projects/:id - 更新项目
DELETE /api/projects/:id - 删除项目


使用Python GNU或者基于Python的web Demo,后端最好也使用Python或者C++,数据库采用纯本地文件夹+MarkDown体系,基于这个技术栈,提供软件开发的工程部署和分工。

技术栈

前端:Vue
后端:Python + C++ flask
数据库:本地文件夹 + Markdown文件 yaml

工程部署

前后端代码在一个仓库,采用分支开发
master分支 - 生产环境代码
dev分支 - 开发环境代码
feature分支 - 开发新功能时创建的分支
目录结构

project_manager
├─ frontend/ # 前端代码
│  ├─ src
│  ├─ public
│  ├─ package.json
│  └─ ...
├─ backend/
│  ├─ app.py # Python后端主入口  
│  ├─ cpp_modules/ # C++模块
│  ├─ api/ 
│  ├─ model/
│  ├─ utils.py
│  └─ ...
└─ docs/ # 项目文档
   ├─ README.md
   └─ ...

分工

1名前端工程师:负责Vue应用的开发
1名后端工程师:负责Python后端和C++模块开发 @时子延
1名全栈工程师:负责系统设计,接口设计,工程部署等
1名产品经理:负责需求管理,跟进调度等 @时子延

工作流程

产品提出需求,分配任务
开发人员在feature分支上开发功能
开发完成后,发起pull request
review代码,通过测试后merge到dev分支
dev环境测试通过后,merge到master发布新版本

Task

  1. 项目数据模块
    • 设计项目数据模型,包含项目名称、状态、时间日志等字段
    • 使用Markdown文件存储格式持久化项目数据
    • 实现项目CRUD操作的接口
  2. 项目业务模块
    • 实现添加/停止时间日志的功能
    • 实现修改项目状态的功能
    • 计算项目时间统计(日/周/月/年)的功能
  3. 数据分析模块
    • 按时间统计给项目排行的功能
    • 项目详情数据可视化的功能
  4. Web应用模块
    • 使用Vue/React等构建前端应用
    • 展示项目排行榜、项目详情、新建项目等页面
    • 调用后端接口获取和操作数据
  5. 数据库模块
    • 设计本地文件系统存储项目Markdown文件
    • 根据项目状态在不同目录存储
    • 提供接口用于CRUD文件
  6. 后端服务模块
    • 使用Python/Flask提供Web API接口
    • 接收并处理前端请求
    • 负责业务逻辑和数据处理
  7. 测试及部署模块
    • 对功能和接口进行测试
    • CI/CD部署流程
    • 配置生产环境

2023-08-08 17:55