202 lines
4.4 KiB
Markdown
202 lines
4.4 KiB
Markdown
# RMO一站式临床试验风险管理网站
|
||
|
||
## 项目简介
|
||
|
||
RMO（Risk Management Outsourcing）一站式临床试验风险管理网站，旨在介绍RMO模式，清晰展示申办者、研究机构、SMO、CRO在临床试验中各自应承担的职责，说明保险和保证金方式如何保障受试者安全。
|
||
|
||
## 技术栈
|
||
|
||
- **前端框架**: React 18.2.0
|
||
- **开发语言**: TypeScript
|
||
- **路由**: React Router DOM 6.20.0
|
||
- **构建工具**: Vite 5.0.8
|
||
- **样式**: CSS3 (原生CSS，无UI框架依赖)
|
||
|
||
## 项目结构
|
||
|
||
```
|
||
rmo-website/
|
||
├── public/ # 静态资源
|
||
├── src/
|
||
│ ├── components/ # 公共组件
|
||
│ │ ├── Header.tsx # 导航头部
|
||
│ │ ├── Footer.tsx # 页脚
|
||
│ │ └── Layout.tsx # 布局组件
|
||
│ ├── pages/ # 页面组件
|
||
│ │ ├── Home.tsx # 首页
|
||
│ │ ├── Company.tsx # 公司介绍
|
||
│ │ ├── Services.tsx # 我们的服务
|
||
│ │ ├── Sponsor.tsx # 申办方专区
|
||
│ │ ├── Institution.tsx # 试验机构专区
|
||
│ │ ├── Participant.tsx # 受试者专区
|
||
│ │ └── ServiceProvider.tsx # 服务方专区
|
||
│ ├── App.tsx # 主应用组件
|
||
│ ├── main.tsx # 入口文件
|
||
│ └── index.css # 全局样式
|
||
├── index.html # HTML模板
|
||
├── package.json # 项目配置
|
||
├── tsconfig.json # TypeScript配置
|
||
├── vite.config.ts # Vite配置
|
||
└── README.md # 项目说明
|
||
```
|
||
|
||
## 功能特性
|
||
|
||
### 主要页面
|
||
|
||
1. **首页**
|
||
- 一站式风险管理模式图展示
|
||
- RMO模式/理念/价值介绍
|
||
- RMO模式服务方介绍
|
||
- 快速导航到各角色专区
|
||
|
||
2. **公司介绍**
|
||
- 临研安公司简介
|
||
- 活动动态（研讨会、发布会、展会、培训会）
|
||
- 资源中心（法律法规、条款标准、行业共识、视频）
|
||
|
||
3. **我们的服务**
|
||
- 自保（专项风险管理基金）
|
||
- 风险减量服务
|
||
- 外溢风险管理服务
|
||
- 保险服务
|
||
|
||
4. **申办方专区**
|
||
- 风险管理体系（风险识别、风险评估、风险管理策略）
|
||
- RMO模式解决方案
|
||
- 操作流程
|
||
|
||
5. **试验机构专区**
|
||
- 试验机构关注要点
|
||
- 研究者支持
|
||
- 伦理委员会支持
|
||
|
||
6. **受试者专区**
|
||
- 临床试验介绍
|
||
- 受试者权益
|
||
- 损害救济
|
||
|
||
7. **服务方专区**
|
||
- CRO支持
|
||
- CDMO支持
|
||
- SMO支持
|
||
|
||
## 安装和运行
|
||
|
||
### 前置要求
|
||
|
||
- Node.js >= 16.0.0
|
||
- npm >= 7.0.0 或 yarn >= 1.22.0
|
||
|
||
### 安装依赖
|
||
|
||
```bash
|
||
npm install
|
||
```
|
||
|
||
或
|
||
|
||
```bash
|
||
yarn install
|
||
```
|
||
|
||
### 开发模式运行
|
||
|
||
```bash
|
||
npm run dev
|
||
```
|
||
|
||
或
|
||
|
||
```bash
|
||
yarn dev
|
||
```
|
||
|
||
项目将在 `http://localhost:3000` 启动，浏览器会自动打开。
|
||
|
||
### 构建生产版本
|
||
|
||
```bash
|
||
npm run build
|
||
```
|
||
|
||
或
|
||
|
||
```bash
|
||
yarn build
|
||
```
|
||
|
||
构建产物将输出到 `dist` 目录。
|
||
|
||
### 预览生产版本
|
||
|
||
```bash
|
||
npm run preview
|
||
```
|
||
|
||
或
|
||
|
||
```bash
|
||
yarn preview
|
||
```
|
||
|
||
## 开发说明
|
||
|
||
### 添加新页面
|
||
|
||
1. 在 `src/pages/` 目录下创建新的页面组件
|
||
2. 在 `src/App.tsx` 中添加路由配置
|
||
3. 在 `src/components/Header.tsx` 中添加导航链接
|
||
|
||
### 样式规范
|
||
|
||
- 使用CSS变量定义主题色和通用样式（见 `src/index.css`）
|
||
- 每个组件/页面有独立的CSS文件
|
||
- 遵循响应式设计，支持移动端访问
|
||
|
||
### 代码规范
|
||
|
||
- 使用TypeScript进行类型检查
|
||
- 遵循React Hooks最佳实践
|
||
- 组件采用函数式组件
|
||
|
||
## 浏览器支持
|
||
|
||
- Chrome (最新版本)
|
||
- Firefox (最新版本)
|
||
- Safari (最新版本)
|
||
- Edge (最新版本)
|
||
|
||
## 项目特点
|
||
|
||
- ✅ 响应式设计，支持PC、平板、手机访问
|
||
- ✅ 现代化UI设计，专业美观
|
||
- ✅ 清晰的导航结构
|
||
- ✅ 完整的内容展示
|
||
- ✅ 快速加载，性能优化
|
||
- ✅ TypeScript类型安全
|
||
|
||
## 待完善功能
|
||
|
||
- [ ] 添加实际的一站式风险管理模式图（图片/可视化图表）
|
||
- [ ] 实现资源中心的文件下载功能
|
||
- [ ] 添加在线咨询功能
|
||
- [ ] 实现服务申请表单提交
|
||
- [ ] 添加数据统计展示
|
||
- [ ] 实现用户登录系统（如需要）
|
||
|
||
## 许可证
|
||
|
||
本项目为内部项目，版权归临研安所有。
|
||
|
||
## 联系方式
|
||
|
||
如有问题或建议，请联系：
|
||
- 邮箱：info@rmo.com
|
||
- 电话：400-XXX-XXXX
|
||
|
||
---
|
||
|
||
**最后更新**: 2025年1月
|
||
|