# 负责整个看板的前端工作 ，使用的若依框架，主要技术栈是vue2+element-ui 1.使用ECharts渲染页面两个看板，结合后端数据接口实时渲染更新数据 2.amap实现高德地图的地址回显，传值给父表单进行数据筛选 3.xlsx实现table数据的导出 4.vuex以及bus组件通信传值将多个子dialog的数据传递给父组件 5.el-tree的懒加载以及loading的页面优化 6.CDN打包优化 7.el-input的模糊搜索，主页面的点击搜索和多条件的input搜索同时渲染在一个table上，并使用Pagination 分页

技术栈 - 前端框架: Vue 3 + TypeScript + Vite - UI 组件库: Element Plus - 状态管理: Pinia + pinia-plugin-persistedstate - 路由管理: Vue Router 4 - 样式方案: SCSS + UnoCSS + PostCSS - 数据可视化: ECharts - 动画库: GSAP - 工具库: Axios、Day.js、Mitt - 构建工具: Vite + ESLint + Prettier - 开发工具: Vue DevTools、Auto Import、Components 自动导入 项目概述 1. 大屏适配：使用 `v-scale-screen` 和 `autofit.js` 实现多分辨率适配，保证不同屏幕下显示一致。 2. 数据可视化：集成 ECharts，支持地图、图表等展示，并封装通用图表组件。 3. 无缝滚动：自定义 `useSeamlessScroll`，支持多方向、悬停暂停、内容克隆，提升大屏滚动体验。 4. 模块化架构：按功能拆分（学情分布、教育均衡、教师画像、学生画像），组件化设计，便于维护与扩展。 5. 性能优化：路由懒加载、组件按需导入、图片资源优化，提升加载与运行性能。 6. 开发体验：TypeScript 类型约束、ESLint + Prettier 规范、自动导入减少样板代码。 7. 响应式设计：结合 SCSS 与 UnoCSS，适配不同设备，保证交互与视觉一致。

Vue 3 + TypeScript + Vite + Element Plus 状态管理：Pinia + pinia-plugin-persistedstate 路由：Vue Router 构建：Vite + unplugin-auto-import + unplugin-vue-components 样式：Sass + SCSS 模块化 图表：ECharts + @antv/g2plot 工具：Axios、Lodash、Day.js、Crypto-js 项目亮点 多租户架构：统一门户、运营管理、机构管理、开发者中心；基于角色的动态菜单与权限；多环境配置与代理。 低代码平台：动态表单引擎（30+ 组件）、可视化配置、数据源（静态/字典）、自定义校验与联动。 组件化设计：40+ 业务组件、通用表格/表单/图表、动态组件渲染、统一设计规范。 数据可视化：ECharts 集成、9 种图表、响应式布局、实时数据更新。 权限与安全：JWT 认证、AES 加密、细粒度权限、统一身份认证对接。 工程化：TypeScript 严格模式、ESLint + Prettier、自动导入、按需加载、多环境构建。 性能优化：路由懒加载、组件缓存、图片懒加载、请求去重与取消、Pinia 持久化。