# crudapi增删改查接口零代码产品成功案例之客户关系管理CRM
# 简介
# 需求
某公司现在需要将EXCEL中的客户资料通过CRM系统进行管理起来，核心需求包括
- 数据的增删改查
- 数据导入，导出
- 和第三方拨号系统进行集成（IFrame页面嵌入），点击客户联系方式，可以跳转到拨号页面进行打电话，不需要手工复制号码，提升工作效率
- 数据好保证安全
# 现状
目前市场上CRM系统有主要缺点：
- 功能太多，很多功能用不到，按年维护，长期使用成本高
- 不支持定制开发
- 数据都在SAAS云端，不安全，容易泄漏
# 解决方案
采用crudapi源码进行定制，购买一台服务器本地部署，优点如下：
- 一次性投入即可，成本低
- 上线周期快，80%工作量零代码配置，剩余20%工作量定制开发
- 既可以满足功能需求，也可以确保数据安全
# UI界面原型
配置客户表单，包括基本资料和联系方式
定制录入页面
录入客户数据
客户列表数据，查询，数据导出到EXCEL表格，从EXCEL表格导入数据
拨打电话，电话号码自动填充
# 技术框架
项目采用前后端分离的方式，数据库采用MySql，后端API采用Java+Spring boot，前端H5采用Vue+Quasar, 由于该项目业务逻辑主要就是基本表单的crud增删改查，所以非常适合用crudapi进行二次开发，通过配置实现RESTful API和后台管理Web，拨号页面单独定制开发即可。
# 核心代码
拨号页面通过iframe嵌入，
<q-dialog v-model="showEdbDialog" full-width full-height persistent>
<q-card class="q-dialog-plugin">
<div class="q-pa-md" style="height: 600px;">
<iframe
id="iframeEdb"
frameborder="0"
scrolling="no"
:src="edbUrl"
allowfullscreen="true" style="width: 100%;height: 100%;">
<p>您的浏览器不支持iframes，请使用chrome浏览器.</p >
</iframe>
</div>
<q-card-actions align="center">
<q-btn class="q-mx-lg" color="primary" label="回到登录页面" unelevated no-caps
@click="onLoginEdbDialogClickAction" />
<q-btn class="q-mx-lg" color="negative" label="关闭" unelevated no-caps
@click="onHideEdbDialogClickAction" />
</q-card-actions>
</q-card>
</q-dialog>
通过getElementById设置电话号码元素的值，实现自动填充号码
setEdbDialogMobile(mobile) {
try {
var iframeEdbDocument = window.frames["iframeEdb"].contentDocument || window.frames["iframeEdb"].contentWindow.document;
iframeEdbDocument.getElementById("call-dialout-input").value = mobile;
} catch (error) {
console.error(error);
}
}
# 数据库表单
主要业务表单只有一张客户资料表
客户customer表，主要包括姓名、手机、备注等字段
包含设计表单到配置，工作量大概5分钟左右。
# 后端API
表单好了，对应的crud增删改查RESTful API也就自动生成了，后端基本完成了80%工作量，然后再集成一下拨打电话功能就可以了，剩余工作1天之内完成，
# 后台管理Web
crudapi自带的Web UI就可以满足要求了，不需要定制。
# 小结
本文主要介绍了客户关系CRM项目，利用了crudapi增删改查接口零代码产品进行二次开发，节约了大量时间，最终按时并高质量完成任务，总共开发时间1天之内完成。
| 名称 | 采用框架 | 类型 | 时间 |
|---|---|---|---|
| Java API | crudapi | Java SDK集成 | 5分钟 |
| 后台管理Web | crudapi-admin-web | 少量定制 | 1天 |
综上所述，利用crudapi系统可以极大地提高工作效率和节约成本，让数据处理变得更简单！
# crudapi简介
crudapi是crud+api组合，表示增删改查接口，是一款零代码可配置的产品。使用crudapi可以告别枯燥无味的增删改查代码，让您更加专注业务，节约大量成本，从而提高工作效率。 crudapi的目标是让处理数据变得更简单，所有人都可以使用！ 无需编程，通过配置自动生成crud增删改查RESTful API，提供后台UI管理业务数据。基于主流的开源框架，拥有自主知识产权，支持二次开发。
# demo演示
crudapi属于产品级的零代码平台，不同于自动代码生成器，不需要生成Controller、Service、Repository、Entity等业务代码，程序运行起来就可以使用，真正0代码，可以覆盖基本的和业务无关的CRUD RESTful API。
官网地址：https://crudapi.cn (opens new window)
测试地址：https://demo.crudapi.cn/crudapi/login (opens new window)
# 附源码地址
# GitHub地址
https://github.com/crudapi/crudapi-admin-web (opens new window)
# Gitee地址
https://gitee.com/crudapi/crudapi-admin-web (opens new window)
由于网络原因，GitHub可能速度慢，改成访问Gitee即可，代码同步更新。