孟祥光的简历
编码是一门严谨而优雅的艺术。代码写的越急,程序跑得越慢。
个人信息
- 姓名:孟祥光
- 性别:男
- 年龄:27岁
- 工作意向:Web前端开发工程师
- 工作经验:6年
工作经历
- 2019年03月 ~ 2022年11月: 合肥市光感芯科技有限公司(3年7个月)
- 2023年01月 ~ 2023年12月: 合肥市渡鸦科技有限公司(1年)
- 2024年01月 ~ 2024年02月: 人和数智科技有限公司
- 2024年03月 ~ 现在: 方田教育有限公司
教育经历
- 合肥通用职业技术学院 计算机应用技术
- 云南大学 视觉传达设计
技能/亮点
- 从 0-1 实现的 vue3-vant4-mobile Github 开源的项⽬,有 500+ star
- 熟练掌握 Js、Vue3、Vite5、TypeScript、ES6、ES7等 Web 技术栈
- 熟练掌握 Element Plus、Arco、AntdV、Vant、Naive UI、Echarts、DataV等 UI 框架
- 熟练掌握 Less、Sass、Tailwind CSS、UnoCss、WindiCss 等Css预处理工具
- 熟练掌握 Openlayers、高德、百度等地图 Api 框架
- 熟练掌握 原生小程序、Uni-app 小程序 / webApp
- 熟练掌握 PromiseMirror、Tiptap、CKEditor、TinyMCE、Quill、Froala Editor 等富文本编辑器
- 熟练掌握 Vue3 + TS + Vite + Pinia + Tailwind CSS,有多年实际项⽬经验
- 有项目重构、Webpack / Vite优化经验、组件二次封装经验(BasicForm)并产出规范化开发文档(前端开发风格指南)
- 有 Nginx、Https证书、域名、CDN、Jenkins自动化部署经验
- 有参与社区开源贡献并提交过相应 pr
项目经历
虚拟站点缺陷管理系统
2023/09 ~ 2023/11:负责 Web 前端开发
项目基于 .Net、C#、Blazor、HttpClient、Bootstrap Blazor UI、构建的无 Js Web 应用程序
描述:缺陷管理系统基于视觉算法对芯片行业中生产的硅片自动进行缺陷检测,方便生产者了解芯片生产过程中的晶圆缺陷。此系统是根据AI检测后进行二次人工判定的中间平台。
负责的项目模块:
- 检测报告
- 查询模块
- Job列表模块
- 灰度图模块
- Wafer列表模块
- 叠图模块
- 缺陷对比模块
- 粗糙度分析模块
- 帕雷托图模块
- 配置
- Map图检测参数设定
- 聚集类缺陷参数设定
- 缺陷类型
- 系统设置
- 云盘存储管理(输入远程路径账户密码进行连接测试和定时任务配置)
- 用户权限
- License管理
项目使用.Net C#、Blazor等技术栈开发,首页使用grid + flex布局,模块以 Component 形式编写,提高维护性。模块之间交互对外暴露接口/props
AI工控系统
2023/03 ~ 2023/09:负责 Web 前端开发
项目基于 Vue3.2、Pinia、Vite、Antdv、TypeScript、Echarts、Vueuse、Unocss、SpringCloud 等技术栈开发
描述:AI 工控平台构建智能化产线,包含电池从原料到成品整个生产过程的监测,包含工艺数据、物料管理、操作日志、工序管理、质量管理、BOM管理、OEE管理、制程检验等模块。打造闭环式的数字化研发、制造、管理平台
负责的部分模块:
- 生产报表
- 看板管理
- 环境数据可视化大屏
- 生产日报可视化大屏
- 设备参数趋势图
- 安灯数据可视化大屏
- 工序设备实时产量看板
- 工序实时产量看板
- 环境趋势图
- 生产数据差异化大屏
- 生产实际数据可视化大屏
- 生产大屏
- 质量管理
- 生产追溯
- OEE管理
- 组织管理
等
- 看板管理
成果:
项目开始采用 vue3/vuex/webPack 技术栈,随着项目越来越大,打包速度也越来越慢并且 dev 环境下WebPack 热更新太慢,项目目录混乱,代码零规范等各种问题,决定对前端架构进行重构:
1、采用 Vue3.2 setup语法糖、Pinia状态管理、Vite构建工具、UnoCss等技术栈进行重构
2、对 Vite 配置大量优化如:自动导入/打包分块/依赖预构建/gzip压缩/打包视图分析等方案
3、重写路由守卫逻辑移除冗余代码
4、系统图标从IconFont 迁移至 Iconify
5、封装常用hooks,如:useEcharts
6、对目录架构进行重写,从 main 入口文件中剥离Plugin、Styles、Directives、I18n、Router、Store等模块,在 Src 下建立对应的模块文件夹,使项目结构更加清晰
7、配置 eslint 预设规则,约束团队开发规范,提高代码可维护性
激光多气体监测预警系统
2022/03 ~ 2022/08:负责 Web 前端开发
项目基于 Vue3、Pinia、Vite、Naive UI、TypeScript、Echarts、Openlayers,使用了最新的前端技术栈。
描述:激光多气体监测预警系统的数据来源是一台激光多气体检测仪,主要用于煤矿行业,通过 C 与硬件交互采集数据传至后端 Java,后端通过接口返回至前端,通过 Ws 或者轮询实现实时数据更新。
负责的项目模块:
- 监控大屏模块
- 监测地图(实时地图、区域 分站 监测点 实时状态、最新告警列表)
- 历史查询(历史气体趋势表格、历史气体趋势曲线图表)
- 历史报警信息
- 设备管理模块 (区域管理、分站管理、监测点管理、气泵管理)、系统管理(菜单、角色、用户、参数、字典、密码)
项目完全采用 Vue 风格指南编写,组件化思想,flex、grid布局,且具备响应式,支持 Dark 模式。因项目中多次用到地图,对 Openlayers 进行了二次封装,减少大量重复代码,提高开发速度。
热力管道安全监测系统
2021/10 ~ 2022/02:负责 Web 前端开发
项目基于 Vue2.x、Element UI、DataV、svg绘制、Echarts、openlayers
描述:热力管道安全监测系统是一套以分布式光纤传感系统为核心的安全监控系统,运用现代光学、传感器、通讯技术、自动分析等技术,对长距离热力管道安全运行状态进行实时监测。
负责的项目模块:
- 管道大屏模块
- 监测地图(实时地图、路段、分站 管道)、统计信息、告警信息
- 通道温度(历史通道图表展示)
- 历史报警(表格展示)
- 配置管理
- 查询统计(实时数据监测、告警查询导出、历史区域查询、通道单日曲线、通道多日曲线)
- 设备参数(主机管理、通道管理)
- 管道监测(区域管理、线路管理(绘制修改线路)、设备管理)
该项目是在分布式测温系统基础添加的一个大模块,大屏采用 flex 布局,使用 dataV 全屏容器编写,这样的好处是在大屏上可以获得更好的展示效果(防止变形)
客户关系管理系统
2021/07 ~ 2021/09:负责 Web 前端开发
项目基于 Vue2.x、Element UI、Echarts
描述:该系统为公司内部使用,帮助营销人员记录客户信息,该可为各个子公司使用,其中包含一个顶级账户(总公司)可以查看各个子公司的客户统计记录。
负责的项目模块:
- 首页包含 客户拜访次数、合同签订次数、产品需求统计、合同回款金额统计图表(每年)
- 客户管理(客户单位、客户信息、客户拜访、拜访统计、产品需求)
- 合同管理
- 企业管理(企业部门、企业员工、企业文档)
- 企业信息(顶级账户显示)
注:因系统包含客户信息暂无法提供截图
激光甲烷遥距监测系统
2021/05 ~ 2021/07:负责 Web 前端开发
项目基于 Vue2.x、Element UI、Echarts、Websocket、高德Api
描述:激光甲烷遥测系统是遥测设备数据采集后的展示平台,主要功能包括实时监测、历史查询、告警查询、巡检设备配置、巡检线路配置、巡检人员管理、巡检记录查询等功能。
负责的项目模块:
- 系统首页(高德地图展示实时轨迹与监测点 ws、历史轨迹巡航)
- 查询统计(日报统计、报警查询、历史查询、历史演变)
- 设备参数(设备型号、遥测设备、参数配置)
- 巡航管理(巡检路线、巡检人员、巡检记录)
分布式测温系统 + webApp
2020/11 ~ 2021/04:负责 Web 前端开发
项目基于 Vue2.x、Element UI、Echarts、Vant、Websocket
描述:分布式光纤测温系统也称为光纤测温,依据光时域反射(OTDR)原理和喇曼(Raman)散射效应对温度的敏感从而实现温度监测。全系统采用光纤作为敏感信息传感和信号传输的载体,具有连续测温、分布式测温、实时测温、抗电磁干扰、本征安全、远程监控、高灵敏度、安装简便、长寿命等特点,广泛应用于市政综合管廊、管道、隧道、电缆、石油石化、煤矿等行业。
负责的项目模块:
- 系统首页(采区工作面 ws)
- 查询统计(通道比较曲线、通道单点曲线、日报统计查询、数据监测报表)
- 设备参数(主机管理、通道管理、采区管理、光纤参数、传感器参数、参数配置)
- 系统管理(用户、菜单、角色、日志)
webApp 开发主要是方便用户可以快捷查看某些信息,数据与 admin 同步(通道实时信息、历史信息、告警信息、我的)
煤矿安全监控系统 2.0
2020/09 ~ 2020/10:负责 Web 前端开发
项目基于 Vue2.x、Element UI、Echarts、Websocket
描述:该项目是煤矿安全监控系统重构版本,主要对配置管理模块进行了重构
负责的项目模块:
- 系统首页(传感器实时数据 ws)
- 历史查询(历史数据、历史报警)
- 设备参数(主机管理、通道管理、寄存器管理、传感器管理)
公司及子公司官网
2020/05 ~ 2020/08:负责 Web 前端开发
项目基于 Bootstrap、Jquery、Ajax、Animate.css、Swiper.js
描述:公司网站
煤矿顶板光纤监测系统
2019/11 ~ 2020/04:负责 Web 前端开发
项目基于 Vue2.x、Element UI、Echarts、Websocket
描述:本系统平台是一个利用光纤光栅及分布式光纤传感技术,业务配置模块对数据采集的主机、通道、传感器等基本信息进行配置管理;数据采集模块对温度、压力、位移、振动、浓度等多种传感器的产生数据进行实时采集。
负责的项目模块:
- 系统首页(工作面、传感器实时数据 ws)
- 查询统计(监测报表、日报统计、通道管理、采区管理)
- 设备参数(主机管理、通道管理、采区管理、传感器管理)
- 系统管理(用户、菜单、角色)
由于项目有大量 form,且都是些基本的 form,要书写过多的 template,为避免代码冗余则对 form 进行封装
详情见博客文章:el-form 表单组件封装
煤矿安全监控系统
2019/4 ~ 2019/09:负责 Web 前端开发
项目基于 Bootstrap、Jquery、Ajax、Echarts
描述:全光纤传感监测平台处理各监测数据的采集、传输、处理、存储和展示,业务上分为监测数据采集、业务配置、平台数据展示三大模块,在服务器端使用Java 定时调用主机 ModBus 接口获取实时数据,供前台页面展示。
负责的项目模块:
- 监控大屏
- 实时监测
- 历史查询(历史数据、历史报警)
- 设备参数(主机管理、通道管理、寄存器管理、传感器管理)
开源贡献
naive-ui-admin
三次 pr 提交记录
- 修复 useECharts Hooks 报错和暗色模式 bug
- BaseTable Action 新增 icon 配置项 + 表格斑马纹工具
- 修复 clickMenuItem 事件在子组件 emits 中未定义而引起警告的问题
vue3-vant4-mobile
基于Vue3.2
、Vite3
、Vant4
、Pinia2
、Typescript
、Windicss
等主流技术自己从零搭建的 webapp 模板,详细请点击标题查看 github
与我联系
目前状态为:在职,月内可到岗。
xiangshu233@outlook.com
185-5655-6056