云筑文档(桌面端)
开发指南
快速上手
辅助
Utility辅助类
DataSet 数据集
dataHelper 数据请求助手
通用
icons svg
布局
grid 栅格
综合布局
表单
表 单
树
查找定义
下拉网格
扫码枪
复选框
级联选择
树选择
地图选择
baidu地图
上传
图片
组件
分页
下推
横向面板
纵向面板
排序面板
数据列表
条件面板
Excel导入
树查询面板
编辑器
表达式
上下文菜单
表格
工具条
流程测试
任务中心
图表
图片
对话框
动态组件
流程图
甘特图
calendar
进度条
导航菜单
折叠面板
本文档使用 MrDoc 发布
-
+
首页
DataSet 数据集
## DataSet 数据集 数据集类,用于本地数据管理(新增、删除、修改、提交) ### 何时使用 需要客户端管理数据时。 批量提交数据。 ### 初始化 <div class="textDiv"> <p>new DataSetContainer({ request: request, saveUrl: "/data/save", queryUrl: "/data/query", exportUrl:"/export/dataexcelnew", exportParamUrl:"/export/dataexcel/path", datasetUrl: "/data/GetEntityConfig", }); </p> ------------ 创建数据集容器 ------------ 代码示例如下 ```javascript new DataSetContainer({ request: request, saveUrl: "/data/save", queryUrl: "/data/query", exportUrl:"/export/dataexcelnew", exportParamUrl:"/export/dataexcel/path", datasetUrl: "/data/GetEntityConfig", }); ``` </div> ### 代码演示 <div class="textDiv">  ------------ 数据维护: 新增、删除、修改 ------------ 代码示例如下 ```html <template> <div v-if="ds1Store "> <hi-toolbar :source="ds1Store" ref="dbtoolbar"></hi-toolbar> <div class="toolbar"> <ul> <li> <el-button size="mini" @click="openUrl">openUrl</el-button> </li> <li> <el-button size="mini" @click="saveTemporary">保存暂存</el-button> </li> <li> <el-button size="mini" @click="restoreData">还原暂存</el-button> </li> <li> <el-button size="mini" @click="dispose">关闭暂存</el-button> </li> <li> <el-button size="mini" @click="loadAll">一口气加载</el-button> </li> <li> <el-button size="mini" @click="addAll">一口气添加</el-button> </li> <li> <el-button size="mini" @click="update">批量更新</el-button> </li> <li> <el-button size="mini" @click="bug">debugger</el-button> </li> <li> <el-button size="mini" @click="reset">还原</el-button> </li> <li> <el-button size="mini" @click="clearup">清理</el-button> </li> <li> <el-button size="mini" @click="exportData">导出</el-button> </li> <li> <el-button size="mini" @click="save">保存</el-button> </li> <li> <el-button size="mini" @click="moveDown">下移</el-button> </li> <li> <el-button size="mini" @click="moveUp">上移</el-button> </li> <li> <el-button size="mini" @click="moveTop">置顶</el-button> </li> <li> <el-button size="mini" @click="moveBottom">置底</el-button> </li> <li> <el-button size="mini" @click="localQuery">本地过滤</el-button> </li> <li> <el-button size="mini" @click="importData">导入</el-button> </li> <li> <el-button size="mini" @click="importSubData">从表导入</el-button> </li> <li> <el-button size="mini" @click="test1">小测</el-button> </li> </ul> </div> <br /><br /><br /> <div style="height:150px"> <hi-form :dataSource="ds1Store" ref="form" :model="ds1Store.curRecord" :items="formItems" :columnsTotal="2" labelPosition="left" labelWidth="100px" ></hi-form> </div> <div style="height:350px"> <hi-table v-if="ds1Store" :data-source="ds1Store" :model="ds1Store.data" v-bind="table1Cfg" size="mini" isEdit isFill></hi-table> </div> <div style="height:200px"> <hi-table v-if="ds2Store" :data-source="ds2Store" :model="ds2Store.data" v-bind="table2Cfg" size="mini" isEdit isFill></hi-table> </div> <div style="height:200px"> ds3Store <hi-table v-if="ds3Store" :data-source="ds3Store" :model="ds3Store.data" v-bind="table3Cfg" size="mini" isEdit isFill></hi-table> </div> <div style="height:200px"> <hi-table v-if="ds4Store" :data-source="ds4Store" :model="ds4Store.data" v-bind="table4Cfg" size="mini" isEdit isFill></hi-table> </div> </div> </template> <script> export default { data() { return { formItems: [ { name: "id", }, { name: "desc", }], table1Cfg:{ columns: [{ name: "id", }, { name: "desc", }, { name: "bol", element: "el-checkbox", }], }, table2Cfg: { columns: [{ name: "id", } ,{ name: "sid", },{ name: "desc", } ], }, table3Cfg: { columns: [{ name: "id", } ,{ name: "desc", } ], }, table4Cfg: { columns: [{ name: "id", } ,{ name: "desc", } ], }, dsContainer: null, //部门数据集实例 ds1Store: null, //部门数据集配置 ds1Cfg: { //autoTemporary:true, //temporaryTime:5000, saveNewTemporary:false, //字段元素 "element": {"eleInputOrder":{"field":"desc"}}, modelFile: "ds1.xml", //数据集配置 部门 id:"id1", entityid: "ds1", //自动消除空格 autoTrim:true, //主键 primary: ["id"], //操作权限 operations: ["oinsert", "odelete", "oquery", "omodify"], //字段顺序,自动填充的顺充 sortFields: ["id", "desc"], action:"autoAction", defaultCdions:{ "queryCdions": { "join": "and", "items": [ { "join": "and", "items": [ { "sign": "eq", "name": "userid_PK", "tablefilter": false, "ignoreNull": true, "dataType": "dbString", "value": null }, { "join": "and", "items": [ { "sign": "eq", "name": "Telephone_PK", "tablefilter": false, "ignoreNull": false, "dataType": "dbString", "value": 1 } ] } ] } ] } }, // dynamic:{ // data:[{ // id1:"FID", // id2:"唯一" // },{ // id1:"FNAME", // id2:"名称" // }], // modelFile:"dynamic.xml", // nameField:"id1", // labelField:"id2" // }, fields: { id: { name: "id", //字段ID label: "id", //字段描述 length:2, "dbtype": "dbDouble", required: true, rules: [], "validateList": [ // { // "expr": function (value, dataset, data, options) { // //返回false时验证不通过 // //参数==>值:value,数据集:dataset,数据:data,扩展参数:options // if (value<10) { // throw new Error("必须大于10"); // } // }, // }, ], }, desc: { name: "desc", //字段ID label: "desc", //字段描述 "default": { "rule": "", "execPolicy":"emptyExec", "exps": function (data, model, dataset) { return (new Date()).valueOf(); } }, length: 10, }, bol:{ name: "bol", //字段ID label: "bol", //字段描述 dbtype:"dbBoolean" } }, }, //部门数据集实例 ds2Store: null, //人员数据集配置 ds2Cfg: { modelFile: "ds2.xml", relation: { type:"ONE_MANY", selfField: ["id"], parentField: ["id"] }, //数据集配置 部门 id:"id2", entityid: "ds2", //主键 primary: ["sid"], //操作权限 operation: ["insert", "delete", "query", "modify"], fields: { id: { name: "id", //字段ID label: "id", //字段描述 dbtype: "dbString", //数据类型 }, sid: { name: "sid", //字段ID label: "sid", //字段描述 dbtype: "dbString", //数据类型 "default": { "rule": "", "exps": function (data, model, dataset) { return (new Date()).valueOf(); } }, }, desc: { name: "desc", //字段ID label: "desc", //字段描述 dbtype: "dbString", //数据类型 }, }, }, ds3Store: null, //部门数据集配置 ds3Cfg: { modelFile: "ds3.xml", relation: { selfField: ["id"], parentField: ["id"] }, //数据集配置 部门 id:"id3", entityid: "ds3", //主键 primary: ["sid"], //操作权限 operations: ["oinsert", "odelete", "oquery", "omodify"], //字段顺序,自动填充的顺充 sortFields: ["id", "desc"], fields: { id: { name: "id", //字段ID label: "id", //字段描述 required: true, length: 50, rules: [], }, sid: { name: "sid", //字段ID label: "sid", //字段描述 dbtype: "dbString", //数据类型 "default": { "rule": "", "exps": function (data, model, dataset) { return (new Date()).valueOf(); } }, }, desc: { name: "desc", //字段ID label: "desc", //字段描述 length: 10, }, }, }, ds4Store: null, //部门数据集配置 ds4Cfg: { modelFile: "ds4.xml", relation: { selfField: ["id"], parentField: ["id"] }, //数据集配置 部门 id:"id4", entityid: "ds1", //主键 primary: ["id"], //操作权限 operations: ["oinsert", "odelete", "oquery", "omodify"], //字段顺序,自动填充的顺充 sortFields: ["id", "desc"], fields: { id: { name: "id", //字段ID label: "id", //字段描述 required: true, length: 50, rules: [], }, desc: { name: "desc", //字段ID label: "desc", //字段描述 length: 10, }, }, }, dsData:[{ "id": "1", "desc": "1ss ", "ds2": [ { "id": "1", "desc": "21", "ds3": [ { "id": "1", "desc": "31", "ds4": [ { "id": "1", "desc": "41" } ] }, // { // "id": "1", // "desc": "131", // "ds4": [ // { // "id": "1", // "desc": "141" // }, // { // "id": "1", // "desc": "142" // } // ] // } ] }, // { // "id": "1", // "desc": "22", // "ds3": [ // { // "id": "1", // "desc": "32", // "ds4": [ // { // "id": "1", // "desc": "42" // } // ] // }, // { // "id": "1", // "desc": "232", // "ds4": [ // { // "id": "1", // "desc": "241" // }, // { // "id": "1", // "desc": "242" // } // ] // } // ] // } ] }] }; }, methods: { dispose(){ this.ds1Store.dispose() }, restoreData(){ this.ds1Store.restoreData({ "data": [ { "id": "1", "desc": "x1", "$state": "rsNormal" }, { "id": "2", "desc": "x2", "$state": "rsNormal" }, { "id": "3", "desc": "x3", "$state": "rsNormal" }, { "id": "4", "desc": "x4", "$state": "rsNormal" }, { "id": "5", "desc": "x5", "$state": "rsNormal" }, { "$index": 5, "$id": "51643B07-EF36-8FB8-DC26-19E880B6EF97", "ds1": { "data": [ { "id": "6", "ds1": "[]", "$index": 0, "$id": "A77950DC-8D9C-8867-3E1A-95B45894F638", "$state": "rsInsert" }, { "id": "6", "ds1": "[]", "$index": 1, "$id": "95B7F0D6-BBC6-C232-2AD7-615721ABFE57", "$state": "rsInsert" } ], "modelFilePath": "ds2.xml" }, "$state": "rsUpdate", "$old": { "id": "6", "desc": "x6" } }, { "id": "7", "desc": "x7", "ds1": "[]", "$index": 6, "$id": "6FACA5CE-13EF-F0A7-063E-EFA12E40F853", "$state": "rsInsert" } ], "modelFilePath": "ds1.xml" }); }, openUrl(){ debugger; //var desc = this.ds1Store.data[1].desc //this.$utils.bom.openUrl("http://faq.hieap.cn") //this.$utils.bom.openUrl("http://open.hieap.cn/hiroute/download.html?pn=eapdev/0000221", {}, "get", "_blank") }, saveTemporary(){ let i = this.ds1Store.indexOf(this.ds1Store.models[2]) console.log(i); debugger; //this.ds1Store.saveTemporary(); }, moveDown(){ this.ds1Store.getModel(this.ds1Store.curRecord).moveDown(); }, moveUp(){ this.ds1Store.getModel(this.ds1Store.curRecord).moveUp(); }, moveBottom(){ let data = this.ds1Store.curRecord this.ds1Store.moveBottom(data); }, moveTop(){ let data = this.ds1Store.curRecord this.ds1Store.moveTop(data); }, localQuery(){ this.ds1Store._testlocalQuery(); }, importData(){ let data=[{id:333,desc:"导入的1"},{id:332,desc:"导入的2"}] this.ds1Store.importData(data,true,true) }, importSubData(){ let data=[ { id:333,desc:"导入的2", ds2:[ {sid:1,desc:"从表的2",ds3:[{sid:1,desc:"从表的3333"}]}, {desc:"从表的112111111111111111"}, //{sid:3,desc:"从表的33"} ]}, {id:4444,desc:"导入的4"}] let result =this.ds1Store.importData(data,true,true) console.log(result) }, test1(){ this.ds1Store.remove(this.ds1Store.data[0]) this.ds1Store.add({bol:1}) }, save(){ this.ds1Store.save() }, exportData(){ this.ds1Store.exportData(null, null, {__slaveExport:true}) }, loadAll(){ let data=[ { "id": "1", "desc": "x1" },{ "id": "2", "desc": "x2" },{ "id": "3", "desc": "x3" },{ "id": "4", "desc": "x4" },{ "id": "5", "desc": "x5" },{ "id": "6", "desc": "x6", "ds1":[ { "id": "1", "desc": "21", "ds1": [ { "id": "1", "desc": "31", "ds1": [ { "id": "1", "desc": "41" } ] } ] } ] }, ] this.ds1Store.setData(data); }, addAll(){ let data=[ { "id": "1", "desc": "" },{ "id": "2", "desc": "x2" },{ "id": "3", "desc": "x3" },{ "id": "4", "desc": "x4" },{ "id": "5", "desc": "x5" },{ "id": "6", "desc": "x6", "ds1":[ { "id": "1", "desc": "21", "ds1": [ { "id": "1", "desc": "31", "ds1": [ { "id": "1", "desc": "41" } ] } ] } ] }, ] debugger; this.ds1Store.add(data,{isRaw:true}); }, reset(){ this.ds1Store.reset(); }, clearup(){ this.ds1Store.clearUp(); }, bug(){ debugger; var index = this.ds1Store.indexOf(this.ds1Store.models[1].data) console.log(index) }, update(){ this.ds1Store.update([ { "id": "1", "desc": "x11", "index": 0 }, { "id": "2", "desc": "x22", "index": 1 }, { "id": "3", "desc": "x33", "index": 2 }, { "id": "4", "desc": "x44", "index": 3 }, { "id": "5", "desc": "x55", "index": 4 }, { "id": "6", "desc": "x66" } ]) } }, mounted() { // this.dscStore = this.$dsContainer.createDataSet({}); // this.dscStore.add({fc1:1}) // this.dscStore.data[0].fc1=2 debugger; window.ds1Store = this.ds1Store = this.$dsContainer.createDataSet(this.ds1Cfg); debugger; window.ds2Store = this.ds2Store = this.$dsContainer.createDataSet(this.ds2Cfg, this.ds1Store); window.ds3Store = this.ds3Store = this.$dsContainer.createDataSet(this.ds3Cfg, this.ds2Store); window.ds4Store = this.ds4Store = this.$dsContainer.createDataSet(this.ds4Cfg, this.ds3Store); // let param1 = this.createParam() // param1.where = this.createWhere() // param1.where.eq("id", "1") // let param2 =this.createParam() // param2.where = this.createWhere() // param2.modelFilePath = "2.xml" // param2.where.eq("id", "2") // param1.setSlaveEntities([param2]) // this.ds1Store.load(param1) this.ds1Store.add({bol:0}) console.log(this.ds1Store.data[0]) //this.ds1Store.setData([{id:333,desc:"导入的1",ds2:[{sid:1,desc:"从表的1",ds3:[{sid:1,desc:"从表的3"}]},{sid:2,desc:"从表的11"}]},{id:4444,desc:"导入的4"}]) //this.ds1Store.setData([{id:333,desc:"导入的1",ds2:[{sid:1,desc:"从表的1",ds3:[{sid:1,desc:"从表的3"}]}]}]) //this.ds1Store.setData([{id:333,desc:"导入的1",ds2:[{sid:1,desc:"从表的1"}]}]) }, }; </script> <style> ul { padding: 0; margin: 0; } li { list-style: none; display: inline-block; } .toolbar { height: 30px; line-height: 30px; } </style> ``` </div> ### Events | 事件名称 | 说明 | 回调参数 | | --- | --- | --- | | dirtychange | 数据状态改变时触发 | 数据集, 值, 选项参数 | | recordchange | 当前记录改变时触发 | 数据集, 记录, 记录对象 | | beginload | 数据加载前 | 条件参数, 数据集 | | afterload | 数据加载后 | 请求响应对象, 数据, 数据集 | | loaderror | 数据加载失败 | 请求响应对象, 数据集 | | beforeadd | 添加前事件 | 数据, 数据集 | | afteradd | 添加后事件 | 数据, 数据集 | | beforechange | 修改前事件 | 记录模型, 数据集, 选项参数 | | afterchange | 修改后事件 | 记录模型, 数据集, 选项参数 | | beforeremove | 删除前事件 | 数据, 数据集 | | afterremove | 删除后事件 | 数据, 数据集 | | clear | 清空后事件 | 数据集 | | reset | 数据重置(还原)后事件 | 数据集 | | readonlychange | 设置只读事件 | 数据集, 值 | | fieldreadonlychange | 设置字段只读事件 | 数据集, 字段, 值 | | validateerror | 验证出错事件 | 数据集, 验证策略 | | fieldvalidateerror | 字段验证出错事件 | 值, 数据集, 数据模型, 验证策略 | | beforesave | 提交保存前事件 | 数据集, 选项参数({ field, oldValue, value }) | | aftersave | 提交保存后事件 | 请求响应对象, 数据集, 选项参数({ field, oldValue, value }) | 详细说明请<a href="https://doc.hieap.cn/web/#/8?page_id=933">查看 API 文档</a> <style> .textDiv{ border:1px solid #F5F5F5; padding: 20px 35px; border-radius: 4px; } .textDiv:hover{ border-color:#1890ff; } </style>
admin
2024年4月30日 10:58
分享文档
收藏文档
上一篇
下一篇
微信扫一扫
复制链接
手机扫一扫进行分享
复制链接
关于 MrDoc
鲲鹭文档MrDoc
是
州的先生
开发并开源的在线文档系统,其适合作为个人和小型团队的云笔记、文档和知识库管理工具。
如果鲲鹭文档给你或你的团队带来了帮助,欢迎对作者进行一些打赏捐助,这将有力支持作者持续投入精力更新和维护鲲鹭文档,感谢你的捐助!
>>>捐助鸣谢列表
微信
支付宝
QQ
PayPal
Markdown文件
分享
链接
类型
密码
更新密码