前端Uniapp开源java版客户关系管理系统|CRM源码

　　CRM系统为公司管理客户信息，可以有效地细分客户，与客户建立和维持长期关系。通过创造和更好地利用客户知识，客户关系和客户忠诚度应该得到改善。开源CRM管理系统软件通过知情和卓越的客户体验，支持强大、高效、忠诚的客户关系。通过提供让您的客户不断回来的体验来提高客户获得率和保留率。开源CRM管理系统是一种工具，更是一种战略。

　　源码及演示：m.certerm.top/cs

　　一、环境准备

　　1.1开发工具清单

　　JDK 17+：推荐使用OpenJDK或Oracle JDK

　　IDE：IntelliJ IDEA（后端）+HBuilderX（前端）

　　数据库：MySQL 8.0+

　　构建工具：Maven 3.6+

　　版本控制：Git

　　其他：Node.js 16+、Postman（接口测试）

　　1.2开发框架与编程语言

　　Java

　　优势：跨平台兼容性强，安全性高，社区庞大，适合复杂企业级系统。

　　框架：Spring Boot（微服务）、Hibernate（ORM）。

　　Python

　　优势：语法简洁，开发效率高，适合快速迭代和数据分析。

　　框架：Django、Flask。

　　PHP

　　优势：Web开发友好，开源生态丰富。

　　框架：Laravel、Symfony。

　　C#

　　优势：与微软生态（如Azure、Office）深度集成，性能强劲。

　　框架：.NET Core。

　　JavaScript（Node.js）

　　优势：前后端统一语言，适合实时交互系统。

　　框架：Express.js、NestJS。

　　1.3环境配置

　　1.Java环境：安装JDK后配置`JAVA_HOME`环境变量

　　2.Node.js：使用npm管理前端依赖

　　3.MySQL：创建数据库`crm_db`，建议开启InnoDB引擎

　　4.HBuilderX：安装uni-app插件和SCSS编译支持

　　二、前端开发（Uniapp）

　　2.1创建Uniapp项目

　　1.打开HBuilderX→新建项目→选择"uni-app"模板

　　2.项目名称：`crm-frontend`，勾选Vue3+TypeScript选项

　　3.安装必要依赖：

npm install uview-ui @uni/apis axios

　　2.2目录结构

├── pages
│   ├── customer
│   │   ├── list.vue    # 客户列表
│   │   └── detail.vue  # 客户详情
│   └── dashboard.vue   # 数据看板
├── static              # 静态资源
├── store               # Pinia状态管理
├── utils
│   └── request.ts      # 封装请求方法
└── uni.scss            # 全局样式

　　2.3关键功能实现

　　客户列表页（pages/customer/list.vue）：

<template>
  <u-table :data="customers">
    <u-table-column label="姓名" prop="name"></u-table-column>
    <u-table-column label="电话" prop="phone"></u-table-column>
    <u-button @click="loadData">刷新</u-button>
  </u-table>
</template>

<script setup>
import { ref } from 'vue';
import { getCustomerList } from '@/api/customer';

const customers = ref([]);

const loadData = async () => {
  const res = await getCustomerList({ page: 1 });
  customers.value = res.data;
};
</script>

　　2.4 API请求封装（utils/request.ts）

import axios from 'axios';

const service = axios.create({
  baseURL: 'http://localhost:8080/api',
  timeout: 5000
});

// 请求拦截
service.interceptors.request.use(config => {
  config.headers['Authorization'] = localStorage.getItem('token');
  return config;
});

export default service;

　　三、后端开发（Spring Boot）

　　3.1创建项目

　　1.使用Spring Initializr生成项目：

　　依赖：Spring Web,JPA,MySQL Driver,Lombok

　　2.项目结构：

src
├── main
│   ├── java/com.crm
│   │   ├── controller
│   │   ├── service
│   │   ├── repository
│   │   └── entity
│   └── resources
│       └── application.yml

　　3.2数据库配置（application.yml）

spring:
  datasource:
    url: jdbc:mysql://localhost/crm_db?useSSL=false
    username: root
    password: 123456
    driver-class-name: com.mysql.cj.jdbc.Driver
  jpa:
    hibernate.ddl-auto: update
    show-sql: true

　　3.3实体类示例

@Entity
@Data
public class Customer {
    @Id
    @GeneratedValue(strategy = GenerationType.IDENTITY)
    private Long id;
    
    private String name;
    private String phone;
    
    @Enumerated(EnumType.STRING)
    private CustomerType type; // 枚举类型
}

　　3.4 RESTful接口示例

@RestController
@RequestMapping("/api/customer")
public class CustomerController {
    
    @Autowired
    private CustomerService customerService;

    @GetMapping
    public Page<Customer> list(@RequestParam int page) {
        return customerService.getCustomers(page);
    }
}

　　四、数据库设计

　　核心表结构

CREATE TABLE `customer` (
  `id` BIGINT PRIMARY KEY AUTO_INCREMENT,
  `name` VARCHAR(50) NOT NULL,
  `phone` VARCHAR(20),
  `type` ENUM('PERSON','COMPANY') DEFAULT 'PERSON',
  `create_time` DATETIME DEFAULT CURRENT_TIMESTAMP
);

CREATE TABLE `contact` (
  `id` BIGINT PRIMARY KEY AUTO_INCREMENT,
  `customer_id` BIGINT,
  `content` TEXT,
  FOREIGN KEY (customer_id) REFERENCES customer(id)
);

　　五、接口联调

　　5.1跨域解决方案

　　Spring Boot配置类：

@Configuration
public class CorsConfig implements WebMvcConfigurer {
    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**")
                .allowedOrigins("http://localhost:9000")
                .allowedMethods("*");
    }
}

　　5.2接口测试示例

GET http://localhost/api/customer?page=1
Headers: 
  Authorization: Bearer {token}

　　六、系统部署

　　6.1前端部署

　　1.编译Uniapp项目：

npm run build:h5

　　2.部署到Nginx：

server {
    listen       80;
    server_name  crm.example.com;
    root         /www/crm-frontend;
}

　　6.2后端部署

　　1.打包JAR：

mvn clean package

　　2.启动服务：

java -jar crm-backend.jar --spring.profiles.active=prod

　　客户关系管理系统发展展望

　　客户关系管理系统（CRM）是指利用技术、流程和策略来管理和分析客户互动和数据的工具。目前，CRM系统的发展现状可以总结如下：

　　云端CRM：越来越多的公司选择将他们的CRM系统部署在云端，这样可以实现更高的灵活性和便捷性，同时减少了IT基础设施的成本和管理负担。

　　移动CRM：随着移动设备的普及，很多CRM系统都提供了移动应用程序，允许用户在手机或平板电脑上访问和更新客户数据，从而实现随时随地管理客户关系。

　　数据驱动的CRM：现代CRM系统不仅仅是用来存储和管理客户信息，更重要的是通过分析这些数据来提供洞察和预测，帮助企业更好地了解客户需求并制定更有效的营销策略。

　　社交CRM：随着社交媒体的兴起，很多CRM系统已经整合了社交媒体功能，帮助企业更好地与客户互动，并及时回应他们在社交媒体平台上的反馈和评价。

　　人工智能（AI）和机器学习：越来越多的CRM系统开始应用人工智能和机器学习技术，例如通过自动化客户服务、个性化推荐和预测分析等功能来提升客户体验和销售效率。

　　总的来说，CRM系统在不断演进和发展，越来越多的功能和技术被应用到其中，帮助企业更好地管理客户关系并实现业务增长。