项目简介： 该项目主要用于对前台商品的数据进行管理，包含对商品库存数据进行修改的模块，介绍商品的图片和视频的上传和更改，以及不同用户的权限管理，订单管理模块等等项目职责： 参与项目需求分析 对用户进行权限管理 商品管理的增删改查技术栈： Vue3、Element-Plus、pinia、Vue-Router、TS、echarts技术实现：1. 利用 ECharts 构建首页项目成本变更、无效成本、供材价格月度变动等数据可视化展示；2.使用路由全局前置守卫（beforeEach）对用户登陆状态进行校验，并获取用户信息；3.采取持久化存储（localStorage）的方式实现用户自动登录；4.通过不同职级用户携带的路由权限信息，使用深拷贝（cloneDeep）配合数组方法(concat）处理动态路由，动态添加路由(addRoute)实现菜单权限的控制；5.借助深拷贝（cloneDeep）解决取消修改数据时，列表数据回显问题 ;6.通过递归对用户路由数组进行遍历，动态生成侧边栏用户菜单；7.通过自定义插件实现自定义指令 v-rights，对用户是否有相应按钮权限进行鉴权；8.通过二次封装 Upload 组件，对上传文件进行 slice 切片并利用 hash 添加编号，结合http 的可并发性，实现合同、清单、图片等附件的大文件上传；9.利用 nextTick 实现 DOM 异步更新后的元素获取，如按钮切换 input 时自动获取焦点，表单验证后清除上一次输入的校验结果；