更新记录

1.0（2025-04-11） 下载此版本

1、初始化

平台兼容性

crm-mobile 仓库分析

一、 仓库架构

• 核心技术:

  • 前端框架: Vue 3 (使用 Composition API 和 <script setup>)
  • 跨端框架: uni-app (支持编译到 H5、App、小程序等)
  • 开发语言: TypeScript
  • UI 库: Tuniao UI (提供丰富的 UI 组件和样式)
  • 构建工具: Vite
  • 包管理: npm
  • Node.js 版本管理: nvm (当前使用 v20.17.0)

• 项目结构 (推测):

  crm-mobile/
  ├── src/
  │   ├── pages/                 # 页面目录
  │   │   ├── login/index.vue    # 登录页
  │   │   ├── dial/index.vue     # 拨号页 (TabBar)
  │   │   ├── contact/           # 联系人模块
  │   │   │   ├── index.vue      # 联系人列表 (TabBar)
  │   │   │   └── add/index.vue  # 新增联系人页
  │   │   ├── message/index.vue  # 消息页 (TabBar)
  │   │   ├── mine/index.vue     # 我的页面 (TabBar)
  │   │   ├── customer/          # 客户模块
  │   │   │   ├── index.vue      # 客户列表
  │   │   │   └── add/index.vue  # 新增客户页
  │   │   ├── customer-public/index.vue # 客户公海页
  │   │   ├── contact-detail/index.vue # 联系人详情页
  │   │   ├── call-records/index.vue   # 通话记录/统计页
  │   │   ├── visit-plan/index.vue   # (推测) 拜访计划页
  │   │   ├── sales-data/index.vue   # (推测) 销售数据页
  │   │   ├── contract/index.vue     # (推测) 合同管理页
  │   │   ├── leads/index.vue        # (推测) 销售线索页
  │   │   ├── leads-public/index.vue # (推测) 线索公海页
  │   │   ├── notification/index.vue # (推测) 消息通知页
  │   │   ├── favorites/index.vue    # (推测) 收藏夹页
  │   │   ├── settings/index.vue     # (推测) 设置页
  │   │   └── about/index.vue        # (推测) 关于我们页
  │   ├── static/                # 静态资源 (图片, 字体等)
  │   │   ├── images/            # (推测) 图片资源
  │   │   └── tabbar/            # TabBar 图标
  │   ├── components/            # (推测) 可复用组件目录
  │   ├── store/                 # (推测) 状态管理目录 (如果使用 Pinia)
  │   ├── api/                   # (推测) API 请求封装目录
  │   ├── utils/                 # (推测) 工具函数目录
  │   ├── App.vue                # 应用根组件 (全局样式/逻辑)
  │   ├── main.ts                # 应用入口文件
  │   └── pages.json             # 页面路由、窗口样式、TabBar 配置
  ├── package.json             # 项目依赖和脚本配置
  ├── package-lock.json        # 锁定依赖版本
  └── ...                      # 其他配置文件 (如 tsconfig.json, vite.config.ts 等)

二、 主要页面及其功能

1. pages/login/index.vue (登录页):

   • 提供用户输入账号密码进行登录的界面。
   • 处理登录逻辑，验证用户信息。

2. pages/dial/index.vue (拨号页 - TabBar):

   • 提供一个模拟手机拨号盘的界面。
   • 包含数字键、删除键、拨号键。
   • 实现了按键音效和震动反馈。

3. pages/contact/index.vue (联系人列表页 - TabBar):

   • 展示联系人列表，按首字母分组。
   • 提供搜索功能。
   • 显示联系人姓名、头像（首字）、电话、公司。
   • 在姓名后显示状态标签（如 "已签约", "跟进中"）和分类标签（如 "我的客户"）。
   • 提供右侧字母索引导航。
   • 列表项右侧有拨打电话的快捷操作按钮。
   • 列表为空时显示"新增联系人"按钮。
   • 右下角有悬浮的"新增联系人"按钮。

4. pages/contact/add/index.vue (新增联系人页):

   • 提供表单用于添加新的联系人信息。
   • 包含字段：姓名、手机、邮箱、公司、职位、备注。
   • 提供"保存"按钮，包含简单的表单验证。

5. pages/message/index.vue (消息页 - TabBar):

   • (功能细节未知，推测用于展示系统通知、聊天消息等)。

6. pages/mine/index.vue (我的页面 - TabBar):

   • 展示当前登录用户的基本信息（头像、姓名、职位、电话）。
   • 显示简单的业绩统计概览（目前为静态数据）。
   • 提供分组的功能菜单入口，包括：
     • 客户管理 (我的客户、客户公海、销售线索、线索公海)
     • 业务管理 (通话统计、拜访计划、销售数据、合同管理)
     • 系统设置 (消息通知、收藏夹、设置、关于我们)
   • 提供"退出登录"功能。
   • 显示应用版本号。

7. pages/customer/index.vue (客户列表页):

   • 展示企业客户列表。
   • 提供顶部搜索栏（搜索企业名称/联系人/电话）。
   • 提供筛选功能（按客户类型、行业类型过滤）。
   • 显示客户公司名称、标签（类型）、联系人、电话、行业、更新时间。
   • 列表项右侧有拨打电话和发送消息的操作按钮。
   • 列表为空时显示"新增客户"按钮。
   • 右下角有悬浮的"新增企业客户"按钮 (受权限控制)。

8. pages/customer/add/index.vue (新增客户页):

   • 提供表单用于添加新的企业客户信息。
   • 包含字段：企业名称、联系人、、行业类型（选择）、客户类型（选择）、备注。
   • 提供"保存"按钮，包含表单验证。

9. pages/customer-public/index.vue (客户公海页):

   • (功能细节未知，推测用于展示和管理公共客户资源，可能包含"认领"等操作)。

10. pages/contact-detail/index.vue (联系人详情页):

    • 展示单个联系人的详细信息。
    • 顶部显示头像、姓名、分类标签，以及可能的"释放"按钮。
    • 中部有快捷操作按钮：拨打电话、发送短信、添（复制）。
    • 使用标签页 (Tabs) 组织信息：
      • 资料: 显示电话号码、邮箱、公司信息、地址、备注等。
      • 跟进: 以时间线形式展示跟进记录。
      • 通话: 展示与该联系人的通话记录。
    • 底部有"编辑联系人"和"更多"操作按钮。

11. pages/call-records/index.vue (通话记录/统计页):

    • (功能细节未知，之前作为"通话记录"入口，现在菜单显示为"通话统计"，推测用于展示通话列表或统计图表)。