基于Vue和Quasar的前端SPA项目实战业务数据（7）回顾通过上篇文章介绍的Vue和Quasar的前端SPA项目实战表关系（六），已经实现了所有的元数据设计功能。本文主要介绍业务数据的CRUD增删改查功能。介绍在crudapi系统中，元数据是通过配置表单来定义的。配置表单后，自动生成对应的CRUD接口，前端集成RESTfulAPI即可实现业务数据的CRUD功能。如果配置了表关系，也支持主子表的级联操作。UI界面业务数据列表编辑业务数据省区主分表API业务数据API包含基本的CRUD操作，可通过swagger文档查看。通过axios封装api，名称为tableimport{axiosInstance}from"boot/axios";consttable={create:function(tableName,data){returnaxiosInstance.post("/api/business/"+tableName,data);},update:function(tableName,id,data){returnaxiosInstance.patch("/api/business/"+tableName+"/"+id,data);},list:function(tableName,page,rowsPerPage,search,query,filter){if(!page){page=1}if(!rowsPerPage){rowsPerPage=10}letfilterStrEncode;if(filter){让filterStr=JSON.stringify(filter);filterStrEncode=encodeURIComponent(filterStr);}returnaxiosInstance.get("/api/business/"+tableName,{params:{offset:(page-1)*rowsPerPage,limit:rowsPerPage,search:search,...query,filter:filterStrEncode}});},count:function(tableName,search,query){返回axiosInstance.get("/api/business/"+tableName+"/count",{params:{search:search,...query}});},get:function(tableName,id){returnaxiosInstance.get("/api/business/"+tableName+"/"+id,{params:{}});},delete:function(tableName,id){returnaxiosInstance.delete("/api/business/"+tableName+"/"+id);},batchDelete:function(tableName,ids){returnaxiosInstance.delete("/api/business/"+tableName,{data:ids});}};导出{表};核心代码代码结构代码结构下拉选择q-selectformanypairs一对一（次主方向）选择数据使用q-selectCFile组件使用q-file组件上传和显示附件。表单组件包括四种类型：CTableNew、CTableEdit、CTableList、CTableListEditCTableNew在创建新数据时使用该组件。CTableNew以扁平化方式展示主表字段，然后可以嵌套CTableNew（一对一主子表）和CTableList（一对多主子表）。CTableEdit在编辑数据时使用该组件。CTableEdit平铺主表的字段，然后可以嵌套CTableNew（一对一主子表）、CTableEdit（一对一主子表）、CTableList（一对多主子表）、CTableListEdit（一对多主子表）。CTableList在创建新数据时使用此组件作为子表。CTableList使用q-table支持多行子表数据，然后可以嵌套CTableNew（一对一主子表）和CTableList（一对多主子表）。CTableListEdit在编辑数据时使用此组件作为子表。CTableListEdit使用q-table支持多行子表数据，然后可以嵌套CTableNew（一对一主子表）、CTableEdit（一对一主子表）、CTableList（一对多主子表）子表）、CTableListEdit（一对多主子表）。通过以上四类组件的嵌套，可以支持主分表无限级联存储，如省市三级分表，目录文件无限级分表。列表查询和分页数据查询主要是指根据输入的条件，检索出符合要求的列表数据。如果数据量很大，需要考虑分页。API为/api/business/{name}，其中name为对象名称的复数形式（与对象名称兼容），查询参数如下：查询，默认查询所有字段和关联子表expandstring选择需要展开的关联主表。默认情况下，关联的主表字段只查询id和namesearchstring全文搜索关键字。filterstring智能查询条件是通过内置的系统字段全文索引fullTextBody实现的。格式为Condition对象Sorting方法、ASC和DESCoffsetint32分页起始位置limitint32每页数量Field1对象最后转换为mysql=operator字段2对象最后转换为mysql=operator...object最后转换为mysql=operatorfield1,field2,...之间的关系是AND关系。详细内容可参考上一篇文章数据条件查询与分页总结本文主要介绍业务数据的增删改查功能。实现了crudapi的完整功能。通过配置，可以零代码实现业务数据的基本增删改查功能。如果需要复杂的功能，可以进行二次开发。下篇文章将介绍前端打包和docker部署相关内容。Demo演示官网地址：https://crudapi.cn测试地址：https://demo.crudapi.cn/crudapi/login附源码地址GitHub地址https://github.com/crudapi/crudapi-admin-webGitee地址https://gitee.com/crudapi/crudapi-admin-web由于网络原因，GitHub可能会比较慢，改访问Gitee即可，代码会同步更新。
