水滴客表产品系统

在日常的商业分析、市场调研或销售线索挖掘工作中，用户常常需要同时查询成百上千家企业的工商信息。如果依赖企查查、天眼查等平台逐一搜索，不仅操作繁琐、耗时极长，而且无法将零散的信息整合在一起进行横向对比和筛选。客表项目正是为解决这一痛点而生，它允许用户一次性批量输入企业名单，快速获取结构化的表格数据，极大提升了企业信息服务领域的数据采集与分析效率。

1. 批量企业名称输入：支持用户在表格首列一次性输入大量企业名称，既可从Excel中批量复制粘贴，也支持手动逐条录入。
2.批量数据拉取：系统将用户输入的企业名称按队列分组，向服务端批量请求并拉取对应的企业公示信息（如工商注册号、法人、状态等），所有数据以表格形式统一展示。
3.多字段筛选：用户可根据表格中已展示的任意数据字段进行筛选，快速过滤出符合条件的企业数据，精准定位目标信息。
4.自定义列展示：允许用户自由勾选关心的数据字段，隐藏无关列，让信息呈现更加聚焦和个性化。
5.请求队列控制：针对上千条数据的请求场景，前端内置了请求队列管理机制，将大量请求分批次发送，避免浏览器并发限制和页面卡顿。

我的职责：独立负责该项目的前端架构设计及全部核心功能开发，包括批量输入交互、队列请求控制、动态筛选系统、表格列管理以及界面UI实现。
技术栈：项目基于 Vue3 框架开发，使用 Pinia 进行全局状态管理，UI组件库选用 Element Plus，网络请求基于 axios 封装。
实现亮点与难点：
队列请求控制：为应对单次输入上千家企业的场景，设计了一套队列请求机制。系统将庞大的企业名单拆分为多个小批次，按序发送请求，有效规避了浏览器对同一域名的并发连接数限制，同时通过排队和合并策略大幅降低了服务端压力，保证了页面的流畅响应。
面向对象的筛选体系：面对不同数据字段多样的筛选逻辑（如文本模糊匹配、数值范围筛选、下拉选项等），使用TypeScript将筛选行为抽象为基类，各字段继承并实现各自的筛选算法，彻底消除了冗余的条件判断语句，使代码更易维护和扩展。
单例模式的列管理：采用单例模式设计了列管理器，统一负责各列筛选实例的创建、配置和销毁，确保全局筛选状态的一致性和可控性。
组合式API开发：充分利用Vue3的组合式API，将批量导入、表格渲染、筛选逻辑等封装为独立的可复用函数，提升了代码的模块化程度。