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">

![](/media/202404/2024-04-29_153913_033177.png)

------------
数据维护: 新增、删除、修改

------------
代码示例如下
```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"> 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>