name:实验室审批
description:实验室信息增删改操作及审批流业务功能模块。
1.总体要求
IDEA:实验室安全智慧化管控系统
LOGO:LOGO图标
THEME:深蓝科幻风,内容布局与排版设计遵循后台统一设计规范要求。
CONTENT:展示系统模块及菜单,本项目仅生成“实验室管理”子系统模块下的“实验室信息管理”下的页面。
2.整体布局
整体分为上下两部分,上方顶部导航栏,下方分为左右两侧:左侧菜单结构,右侧为内容区,每个区域由上到下分别显示不同内容区块。
上方顶部导航栏
- 导航栏在整个页面最上面,分为左、中、右三个区域,显示区域比例按2:6:2划分。
- 左侧区域:左对齐显示LOGO图标+标题。
- 中间区域:右对齐显示子系统模块名称切换按钮(数据可视化、安全教育考试、实验室准入、化学品智能管控、危废回收处置、安全检查管理、实验室管理、更多+下拉图标),默认选中实验室管理。
- 右侧区域:功能图标(消息、首页、帮助)、登录账号头像+名称(下拉图标,点击弹窗显示个人中心、退出按钮)。
下方左侧菜单结构
每个子系统模块下最多两级菜单层级(一级菜单、二级菜单),一级菜单下没有二级菜单的点击直接展示该菜单页面,有二级菜单的点击展开所有二级菜单页面列表,展示菜单如下:
- 实验室数据总览
- 实验室信息管理
- 实验室进出记录
- 安全信息牌管理
- 实验室值班表
- 实验室巡查记录
下方右侧内容区
点击选中左侧菜单页面展示对应页面功能内容,详见具体菜单页面说明。
3.实验室管理模块功能说明
实验室新增、删除、修改的审批业务流程,根据不同用户角色(校级管理员、院级管理员、实验室负责人及管理员)执行不同的审批流程并分别单独生成展示界面。主要申请与审批业务流程如下(系统同步更新每个审批进度及结果):
新增/启用/停用/变更操作流程:
院级管理员操作新增/启用/停用/变更>提交修改>系统生成变更审批>校级管理员审批>通过(驳回需填写驳回原因,操作失败,流程结束)>操作成功
降级流程:
实验室负责人或管理员手动降低实验室分级>提交修改>系统生成变更审批>院级管理员审批>通过(驳回需填写驳回原因,降级失败,流程结束)>校级管理员审批>通过(驳回同上)>实验室降级成功
实验室负责人或管理员修改实验室危险源>系统生成变更审批>院级管理员审批>通过(驳回同上)>校级管理员审批>通过(驳回同上)>实验室降级成功
3.1实验室数据总览
- 内容标签页切换:实验室总览(点击实验室管理模块后的默认展示页面)、实验室基本情况、国资数据中间库、分级分类情况、教学实验室情况、科研实验室情况
3.2实验室信息管理
页面布局
- 从上到下分为:上方区域(左侧面包屑、右侧操作按钮),下方区域(正文内容)。
- 标签页切换:实验室、功能房、科研设施、其他、房间配置,此处房间类型标签来源于“房间配置”。
操作按钮
- 二级页面右侧展示返回按钮,点击可返回到上一个或上一级页面。
- 编辑操作页面显示取消、保存或提交等操作按钮。
3.2.1实验室负责人及管理员
- 实验室负责人及管理员用户权限包括:所负责实验室的新增、启用/停用、升降级、修改操作。
- 标签页切换:实验室、功能房、科研设施、其他。
- 菜单页面及业务功能与校级管理员相同,单独生成该用户角色的页面。
3.2.2院级管理员
- 院级管理员用户权限包括:所属学院单位实验室的新增、启用/停用、升降级、修改操作,并按流程规定节点审批。
- 标签页切换:实验室、功能房、科研设施、其他。
- 菜单页面及业务功能与校级管理员相同,单独生成该用户角色的页面。
3.2.3校级管理员
- 校级管理员用户权限包括:全校实验室的新增、启用/停用、升降级、修改操作,并按流程规定节点审批。
- 标签页切换:实验室、功能房、科研设施、其他、房间配置。
- 单独生成该用户角色的页面。
3.1.1.1实验室(切换标签)
实验室类型子分类:教学实验室、科研实验室、公共平台
列表
- 筛选查询
- 功能按钮
- 列表表头
- 操作列
操作功能展示:查看、编辑、更多(下拉 展示:关联配置、准入配置、关闭准入、信息牌下载、实验室设备)。
3.1.1.2功能房(切换标签)
4.通用功能
- 自动全屏:初次进入页面时默认全屏显示
- 弹窗:当触发系统提示或操作确认时弹窗显示。
- 面包屑:子系统模块 > 一级菜单页名称 > 二级菜单页名称,点击菜单页名称可快速跳转至该页面。
- 列表页码切换:每页数据展示条数切换;统计显示每页数据条数,比如:共666条,20条/页(下拉可选每页10、20、30、50条),页码可点击切换及跳转。
5.设计规范
- 设计分辨率:要求1920×1080px,自适应屏幕显示(UI元素尺寸均按此分辨率设计)
- 主色调:标题、菜单选中、关键按钮,深蓝科幻风(#0045af)
- 辅助色:提示及操作按钮(--提交成功:#52c41a,--失败提示:#ff5454,--警告提示:#ff9000,--开关按钮:#0183fa)
- 背景色:#ffffff
- 字体:Microsoft YaHei(--zhuyao 主要字体颜色:#333333,--次要字体颜色:#999999,,--提示不可交互字体颜色:#cccccc)
- 图表库:ECharts 5.4.3
- 布局:CSS Grid(grid-template-columns:2fr 1.5fr 4.5fr 2fr)
- 面板圆角:15px,边框:rgba(30,144,255,0.22)
- 图标:分为功能性和示意性图标,图标尺寸大小不能使用奇数,风格统一为线性、单色图标,不可混用
6.输出要求
- 输出完整的HTML文件,内联CSS+JavaScript,无需构建工具
7.质检要求
生成后检查是否满足: