网页端：修复教育学习中学时精度问题

oa-ui/CMC_OA_架构文档.md

@@ -0,0 +1,336 @@
+# CMC智联云枢办公系统(oa-ui) 技术架构文档
+
+## 1. 项目概述
+
+CMC智联云枢办公系统前端(oa-ui)是基于Vue.js 2.x构建的企业级办公管理系统，主要服务于CMC企业的日常办公管理需求，包括项目管理、车辆管理、设备管理、合同管理、流程审批等多个业务模块。
+
+### 1.1 基本信息
+- **项目名称**: CMC智联云枢办公系统
+- **版本**: 3.8.7
+- **描述**: CMC智联云枢办公系统
+- **开发框架**: Vue.js 2.6.12 + Element UI 2.15.14
+- **构建工具**: Vue CLI 4.4.6
+
+## 2. 技术栈
+
+### 2.1 核心技术
+- **前端框架**: Vue.js 2.6.12
+- **UI组件库**: Element UI 2.15.14
+- **状态管理**: Vuex 3.6.0
+- **路由管理**: Vue Router 3.4.9
+- **HTTP客户端**: Axios 0.24.0
+- **构建工具**: Vue CLI 4.4.6
+- **样式预处理器**: Sass 1.32.13
+
+### 2.2 特色功能库
+- **流程图设计**: bpmn-js 11.1.0 (支持BPMN流程设计)
+- **地图组件**: OpenLayers 7.1.0 (GIS地图功能)
+- **图表可视化**: ECharts 5.4.0 + ECharts GL 2.0.9
+- **富文本编辑**: Quill 1.3.7 + TinyMCE
+- **文档预览**: @vue-office系列 (支持PDF、Excel、Word预览)
+- **视频播放**: Video.js 8.21.0
+
+### 2.3 工具库
+- **文件操作**: file-saver 2.0.5
+- **加密解密**: jsencrypt 3.0.0-rc.1
+- **剪贴板**: clipboard 2.0.8
+- **日期处理**: 内置日期工具
+- **拖拽功能**: vuedraggable 2.24.3 + sortablejs 1.10.2
+
+## 3. 项目架构
+
+### 3.1 目录结构
+```
+oa-ui/
+├── public/                 # 静态资源
+├── src/
+│   ├── api/               # API接口层
+│   │   ├── flowable/      # 工作流相关接口
+│   │   ├── oa/            # 办公系统业务接口
+│   │   ├── system/        # 系统管理接口
+│   │   └── monitor/       # 系统监控接口
+│   ├── assets/            # 静态资源
+│   │   ├── icons/         # SVG图标
+│   │   ├── images/        # 图片资源
+│   │   ├── styles/        # 全局样式
+│   │   └── datas/         # 静态数据
+│   ├── components/        # 公共组件
+│   │   ├── Process/       # 流程设计组件
+│   │   ├── FileUpload/    # 文件上传组件
+│   │   ├── ImageUpload/   # 图片上传组件
+│   │   └── ...           # 其他通用组件
+│   ├── directive/         # 自定义指令
+│   ├── layout/           # 布局组件
+│   ├── plugins/          # 插件配置
+│   ├── router/           # 路由配置
+│   ├── store/            # Vuex状态管理
+│   ├── utils/            # 工具类
+│   ├── views/            # 页面组件
+│   │   ├── oa/           # 办公系统业务页面
+│   │   ├── flowable/     # 工作流页面
+│   │   ├── system/       # 系统管理页面
+│   │   └── monitor/      # 系统监控页面
+│   ├── App.vue           # 根组件
+│   ├── main.js           # 入口文件
+│   └── permission.js     # 权限控制
+├── package.json          # 项目配置
+└── babel.config.js       # Babel配置
+```
+
+### 3.2 分层架构
+
+#### 3.2.1 表现层 (Presentation Layer)
+- **Views层**: 业务页面组件，负责用户界面展示和交互
+- **Components层**: 可复用的UI组件
+- **Layout层**: 页面布局组件(侧边栏、导航栏、内容区域)
+
+#### 3.2.2 业务逻辑层 (Business Logic Layer)
+- **Store/Vuex**: 全局状态管理，包含用户信息、权限、应用配置等
+- **Router**: 路由管理，支持动态路由和权限控制
+- **Directive**: 自定义指令，如权限指令、拖拽指令等
+
+#### 3.2.3 数据访问层 (Data Access Layer)
+- **API层**: 封装HTTP请求，统一管理后端接口调用
+- **Utils层**: 工具函数，包含请求拦截器、数据处理、权限验证等
+
+## 4. 核心模块详解
+
+### 4.1 认证与权限模块
+
+#### 4.1.1 认证机制
+- 基于JWT Token的认证方式
+- 支持Token自动刷新
+- 登录状态持久化存储
+
+#### 4.1.2 权限控制
+```javascript
+// 权限指令示例
+v-hasPermi="['system:user:add']"  // 菜单权限
+v-hasRole="['admin']"             // 角色权限
+```
+
+#### 4.1.3 路由守卫
+- 全局前置守卫验证登录状态
+- 动态路由生成基于用户权限
+- 白名单路由支持
+
+### 4.2 状态管理 (Vuex)
+
+#### 4.2.1 模块结构
+```javascript
+store/
+├── modules/
+│   ├── app.js           # 应用配置状态
+│   ├── user.js          # 用户信息状态
+│   ├── permission.js    # 权限路由状态
+│   ├── tagsView.js      # 标签页状态
+│   ├── settings.js      # 系统设置状态
+│   ├── dict.js          # 字典数据状态
+│   ├── projectProcess.js # 项目流程状态
+│   └── ol.js            # 地图组件状态
+├── getters.js           # 全局getter
+└── index.js             # store入口
+```
+
+#### 4.2.2 核心状态
+- **用户信息**: 包含用户基本信息、角色、权限等
+- **应用配置**: 侧边栏状态、设备类型、主题设置等
+- **路由权限**: 动态路由、菜单权限等
+- **字典数据**: 系统字典缓存
+
+### 4.3 网络请求模块
+
+#### 4.3.1 请求拦截器
+- 自动添加Authorization header
+- 请求重复提交控制
+- 请求参数处理
+
+#### 4.3.2 响应拦截器
+- 统一错误处理
+- 登录状态过期处理
+- 文件下载处理
+
+#### 4.3.3 API组织结构
+```javascript
+api/
+├── flowable/          # 工作流相关
+├── oa/               # 业务模块
+│   ├── project/      # 项目管理
+│   ├── car/          # 车辆管理
+│   ├── device/       # 设备管理
+│   ├── contract/     # 合同管理
+│   └── ...           # 其他业务模块
+├── system/           # 系统管理
+└── monitor/          # 系统监控
+```
+
+### 4.4 组件体系
+
+#### 4.4.1 全局组件
+- **Pagination**: 分页组件
+- **RightToolbar**: 表格工具栏
+- **DictTag**: 字典标签
+- **FileUpload**: 文件上传
+- **ImageUpload**: 图片上传
+- **Editor**: 富文本编辑器
+
+#### 4.4.2 业务组件
+- **Process**: BPMN流程设计器
+- **Calendar**: 日历组件
+- **IconSelect**: 图标选择器
+- **HeaderSearch**: 头部搜索
+
+#### 4.4.3 布局组件
+- **Sidebar**: 侧边栏导航
+- **Navbar**: 顶部导航栏
+- **TagsView**: 标签页导航
+- **AppMain**: 主内容区域
+
+## 5. 业务模块架构
+
+### 5.1 工作流模块 (Flowable)
+- **流程定义**: 支持BPMN 2.0标准的流程设计
+- **任务管理**: 待办、已办、我的流程
+- **表单管理**: 动态表单配置和渲染
+- **流程监控**: 流程实例跟踪和管理
+
+### 5.2 项目管理模块
+- **项目台账**: 项目基础信息管理
+- **项目预算**: 预算编制和管控
+- **项目进度**: 进度跟踪和报告
+- **项目变更**: 变更申请和审批
+
+### 5.3 资源管理模块
+- **车辆管理**: 车辆信息、使用申请、费用管理
+- **设备管理**: 设备台账、领用归还、维修保养
+- **人员管理**: 员工信息、薪资管理、绩效考核
+
+### 5.4 合同管理模块
+- **承接合同**: 合同基础信息、支付管理
+- **分包合同**: 分包管理、结算管理
+- **合同档案**: 合同文档管理
+
+### 5.5 财务管理模块
+- **借款管理**: 借款申请、审批、还款
+- **费用管理**: 各类费用申请和报销
+- **预算管控**: 预算编制、执行、分析
+
+## 6. 技术特色
+
+### 6.1 工作流集成
+- 深度集成Flowable工作流引擎
+- 支持复杂业务流程的可视化设计
+- 提供完整的流程生命周期管理
+
+### 6.2 GIS地图功能
+- 基于OpenLayers的地图组件
+- 支持多种地图底图和图层
+- 提供空间数据的可视化展示
+
+### 6.3 多媒体支持
+- 支持多种文档格式在线预览
+- 集成视频播放功能
+- 提供图片预览和编辑功能
+
+### 6.4 移动端适配
+- 响应式布局设计
+- 支持移动端设备访问
+- 提供良好的移动端用户体验
+
+## 7. 性能优化
+
+### 7.1 代码分割
+- 路由级别的代码分割
+- 组件异步加载
+- 第三方库按需引入
+
+### 7.2 缓存策略
+- 字典数据缓存
+- 用户权限信息缓存
+- 静态资源缓存
+
+### 7.3 请求优化
+- 请求防抖处理
+- 重复请求取消
+- 批量请求合并
+
+## 8. 安全机制
+
+### 8.1 前端安全
+- XSS攻击防护
+- CSRF攻击防护
+- 敏感信息加密传输
+
+### 8.2 权限控制
+- 基于RBAC的权限模型
+- 前端路由权限控制
+- 接口级别的权限验证
+
+### 8.3 数据安全
+- 前端数据脱敏
+- 安全的文件上传处理
+- 用户操作日志记录
+
+## 9. 开发规范
+
+### 9.1 代码规范
+- ESLint代码质量检查
+- 统一的代码格式化
+- Git提交规范
+
+### 9.2 组件规范
+- 组件命名规范
+- Props和Events定义规范
+- 组件文档化要求
+
+### 9.3 API规范
+- 统一的接口命名规范
+- 标准的请求响应格式
+- 完整的错误码定义
+
+## 10. 部署架构
+
+### 10.1 开发环境
+- 本地开发服务器
+- 热重载支持
+- 开发调试工具集成
+
+### 10.2 生产环境
+- 静态资源CDN部署
+- Gzip压缩优化
+- 缓存策略配置
+
+### 10.3 持续集成
+- 自动化构建流程
+- 代码质量检查
+- 自动化部署
+
+## 11. 扩展性设计
+
+### 11.1 插件化架构
+- 组件插件化
+- 功能模块插件化
+- 第三方集成插件化
+
+### 11.2 国际化支持
+- 多语言切换
+- 本地化资源管理
+- 区域化配置
+
+### 11.3 主题定制
+- 多主题切换
+- 自定义主题配置
+- 品牌化定制支持
+
+## 12. 总结
+
+CMC综合办公系统前端架构采用了现代化的Vue.js技术栈，通过模块化、组件化的设计理念，构建了一个功能完善、扩展性强、维护性好的企业级办公管理系统。系统具有以下特点：
+
+1. **技术先进**: 采用Vue.js 2.x + Element UI构建，技术栈成熟稳定
+2. **功能丰富**: 涵盖项目管理、资源管理、流程审批等多个业务领域
+3. **架构清晰**: 分层架构设计，职责分离，便于开发和维护
+4. **扩展性强**: 插件化设计，支持功能模块的灵活扩展
+5. **用户体验**: 响应式设计，支持PC和移动端访问
+6. **安全可靠**: 完善的权限控制和安全防护机制
+
+该架构为企业数字化办公提供了强有力的技术支撑，能够满足企业不断增长的业务需求和技术演进要求。

oa-ui/src/views/oa/study/components/studyHead.vue

@@ -2,7 +2,7 @@
  * @Author: ysh
  * @Date: 2025-03-05 14:19:02
  * @LastEditors: Please set LastEditors
- * @LastEditTime: 2025-03-27 13:57:08
+ * @LastEditTime: 2025-08-12 16:40:17
 -->
 <template>
   <div class="head-bg">
@@ -62,7 +62,7 @@ export default {
         }, 0)
       }
       console.log(approvalHours);
-      this.hours = studyHours + approvalHours;
+      this.hours = (studyHours + approvalHours).toFixed(1);
     }
   },
 }

oa-ui/src/views/oa/study/record.vue

@@ -2,7 +2,7 @@
  * @Author: ysh
  * @Date: 2025-03-12 10:06:03
  * @LastEditors: Please set LastEditors
- * @LastEditTime: 2025-04-22 13:45:22
+ * @LastEditTime: 2025-08-12 16:39:40
 -->
 <template>
   <div class="app-container">
@@ -78,7 +78,7 @@
                   <span v-if="data.type === 'department'">
                     <!-- <i class="el-icon-office-building"></i> -->
                     {{ data.deptName }}
-                    <span class="total-hours">(总学时：{{ data.totalHours }}h)</span>
+                    <span class="total-hours">(总学时：{{ (data.totalHours).toFixed(1) }}h)</span>
                   </span>
                   <!-- 人员节点 -->
                   <span v-else class="user-node">