国家能源集团水电调度可视化平台 (vue)
项目描述:集团内部系统,全国子公司数据采集管理,数据实时展示,图表可视化交互。
项目职责:相关数据的曲线图交互页面,数据表格交互页面。
应用技术:
1. 项目使用集团内部框架搭建,整体使用 vue 全家桶(vue+vue-router)+ TS + lass + axios 实现。
2. 登录注册的表单格式验证使用 Regexp 验证,使用 session 后台验证登录状态。
3. UI部分使用 element 二次插件封装,页面交互采用 Ts + vue 开发。
4. 数据接口交互使用 axios 二次封装,图表采用 echarts 图开发,部分进行二次封装。
学生管理系统
项目描述:该项目是重构某学院的后台管理系统,服务于学院各层级管理工作人员,处理不同的工作事务
应用技术:
1. 项目采用 react 框架结合 antd-admin UI 重构。
2. 信息总览页,采用 ECharts 展示所有的图标统计信息,使用 axios 进行异步操作
3. 在权限管理中设置员工的权限以及用户名和密码,在员工登录成功后,后台返回权限列表
4. 使用 HTML5 新特性 LocalStorage 进行本地存储,保存权限列表信息,用于渲染所有页面的侧导航栏
5. 对于页面内重复调用的代码,封装成函数使用,提高代码利用率,减少冗余
宗申机车官方商城(vue)
项目描述: 该项目是宗申官方商城网站,主要销售宗申品牌旗下的机车及延伸产品,兼容 PC 和移动端。
网址:shop.zongshenmotor.com
项目职责:
1. 负责将 UI 原图转换为页面,与后端开发人员商讨需要实现的功能接口,约定所需要的参数。
2. 完成与后端的数据联调,实现前后端数据交
3. 测试维护并优化项目,修复 bug,提高前端的用户体验及性能。
4. 负责后期的项目维护的迭代工作。
主要技术:
1. 项目使用 Vue 全家桶进行开发,使用 vue-cli3搭建,通过 axios 进行数据交互。
2. vant 配合 sass 将 ui 原图还原为页面,并且保证页面美观,增强用户体验性。
3. 运用了 vue 的 vue-router 进行路由的设置同时运用了 VueX 进行状态的集中式管理。
4. 采用图片懒加载技术,减少用户的流量消耗,提升用户体验性。
5. 登录注册使用 Local Storage 存储服务器返回的 token 进行校验。
6. 后台管理使用 element UI 的后台模板结合 ECharts 图表插件完成构建
玩意手工
项目描述:该项目是一基于微信开发的小程序项目,主要提供手工类产品的制作过程,给予示范步骤。
应用技术:
1. 项目使用小程序提供的 wxml+wxss 编写前端页面。
2. 通过 App() 函数用来注册一个小程序,Page() 函数用来注册各个页面
3. 在入口文件 app.json 中生成需要使用的模块,并在 window 中进行公共样式设置
4. 通过 tabBar 配置项指定 tab 栏的表现,以及 tab 切换时显示的对应页面。
5. 在 onLoad 中通过 wx.request()获取接口数据,放入初始数据 data 中,然后对初始列表数据渲染。
6. 使用 wx.getUserInfo 获取微信用户的头像和昵称,通过 setData 把获取到的信息显示到界面上
7. 使用 onPullDownRefresh 来实现下拉刷新,onReachBottom 来实现分类列表页的上拉加载
8. 页面间的跳转通过 wx.navigateTo 或者页面重定向 wx.redirectTo 来实现
9. 所有单位尺寸,采用小程序自定的 rpx 来实现宽度自适应(基于 iPhone6,与 px 成 2 倍关系)