cc390fc756
- 添加导航栏组件及直播回放按钮 - 实现视频播放模态框 - 配置赛博朋克风格主题 - 添加课程首页和课程页面 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
100 lines
3.2 KiB
Markdown
100 lines
3.2 KiB
Markdown
# 外贸业务核心流程及关键角色教学网页
|
||
|
||
## 📖 项目简介
|
||
|
||
这是一个基于React和TypeScript开发的外贸业务基础课程教学网页，采用现代化的玻璃风格UI设计，为大专院校国际贸易专业学生提供优质的学习体验。
|
||
|
||
## 🎯 课程内容
|
||
|
||
### 核心模块
|
||
- **外贸业务全景图**：跨境交易定义、目标、发展历程及面临的关键挑战
|
||
- **外贸业务框架**：政策支持、产业链协作与服务支撑体系
|
||
- **外贸核心流程**：客户开发、风险筛查、合同签订、生产备货、物流通关、货款回收
|
||
- **关键角色职责图谱**：出口商、进口商、外贸经理、货代、银行、海关等角色定位
|
||
|
||
### 学生能力培养目标
|
||
- 掌握外贸业务全流程操作能力
|
||
- 具备客户开发与商务谈判技能
|
||
- 理解国际物流与报关操作
|
||
- 掌握外汇管理与风险控制
|
||
|
||
### 职业发展方向
|
||
- **外贸业务主管**：需求量大，发展前景好
|
||
- **外贸业务员**：入门岗位，成长空间广阔
|
||
- **物流单证员**：专业性强，薪资稳定
|
||
- **外贸跟单员**：综合能力要求高
|
||
- **国际采购助理**：供应链管理核心岗位
|
||
|
||
## 🎨 设计特色
|
||
|
||
- **现代玻璃风格UI**：采用最新的玻璃拟态设计，视觉效果现代时尚
|
||
- **响应式布局**：完美适配各种设备尺寸
|
||
- **流畅交互动画**：使用Framer Motion提供丝滑的用户体验
|
||
- **渐变色彩搭配**：精心设计的色彩方案，营造专业学习氛围
|
||
|
||
## 🚀 技术栈
|
||
|
||
- **前端框架**: React 18 + TypeScript
|
||
- **样式系统**: Tailwind CSS + 自定义玻璃效果
|
||
- **动画库**: Framer Motion
|
||
- **路由管理**: React Router DOM
|
||
- **图标系统**: Lucide React
|
||
- **构建工具**: Create React App
|
||
|
||
## 📱 页面结构
|
||
|
||
### 主要页面
|
||
- **首页**: 课程概览与模块导航
|
||
- **学习目标**: 详细的能力培养目标
|
||
- **职业发展**: 外贸相关职业路径介绍
|
||
- **课程总结**: 知识点梳理与总结
|
||
- **课堂测试**: 多种题型的在线测试
|
||
|
||
### 课程章节
|
||
- **外贸业务全景图**: 跨境交易基础认知与模式分类
|
||
- **外贸业务框架**: 生态系统、政策支持与产业协作
|
||
- **外贸核心流程**: 六大核心环节详细解析
|
||
- **关键角色职责图谱**: 各角色定位与协作关系
|
||
|
||
## 🎯 教学特色
|
||
|
||
### 实践案例教学
|
||
- **智能手表出口案例**: 完整业务流程演示
|
||
- **文具出口实操**: 订单执行全流程跟踪
|
||
- **茶叶出口案例**: 国际物流与报关实务
|
||
|
||
### 互动学习体验
|
||
- **课堂测试系统**: 选择题、填空题、连线题、排序题
|
||
- **作业练习平台**: 拖拽式业务流程构建
|
||
- **进度跟踪功能**: 学习进度可视化展示
|
||
|
||
### 知识点覆盖
|
||
- B2B/B2C/C2C贸易模式对比
|
||
- 国际贸易术语与结算方式
|
||
- 跨境物流与报关实务
|
||
- 外汇管理与风险防范
|
||
- 客户开发与商务谈判
|
||
|
||
## 🔧 本地开发
|
||
|
||
```bash
|
||
# 克隆项目
|
||
git clone [repository-url]
|
||
|
||
# 安装依赖
|
||
npm install
|
||
|
||
# 启动开发服务器
|
||
npm start
|
||
|
||
# 构建生产版本
|
||
npm run build
|
||
```
|
||
|
||
## 📄 许可证
|
||
|
||
本项目采用 MIT 许可证 - 查看 [LICENSE](LICENSE) 文件了解详情
|
||
|
||
## 🙏 致谢
|
||
|
||
**致谢**：感谢所有为外贸教育事业贡献力量的教育工作者和行业专家！ |