如何使用甘特图与OData模型而不是JSON

问题描述 投票:0回答:1

我试图使用带有树表的甘特图和OData模型。不幸的是,我只能找到JSON模型的例子。我在我的OData模型中构建了层次结构,如示例https://blogs.sap.com/2015/10/23/treetable-odata-binding/ - 我使用了注释选项。

树表似乎是正确的,但甘特图中的形状不适合相关行中的起始结束日期。在JSON示例中,始终在“shapeDataName”属性中使用“children”,但我不知道使用OData在那里写什么。有人可以帮忙吗?

如果我在浏览器中调用它,你可以在这里看到我的OData模型的结构:

在我的onInit方法中,我做了以下事情:

为了构建形状,我编写了以下方法:

我的结果看起来像这样:

sapui5
1个回答
0
投票

我的onInit方法如下所示:

        onInit: function () {

        var oGantt = new sap.gantt.GanttChartContainer({ ganttCharts: [ 
            new sap.gantt.GanttChartWithTable({
                id: "gantt",
                columns: [ new sap.ui.table.Column({ label: "Id", template: "Aufgabenid" }), 
                           new sap.ui.table.Column({ label: "Bezeichnung", template: "Aufgabenbez" }),
                           new sap.ui.table.Column({ label: "Start", template: new sap.m.DatePicker({ value: {path: "Berstartstring"}, valueFormat: "yyyyMMdd" }) }), 
                           new sap.ui.table.Column({ label: "Ende", template: new sap.m.DatePicker({ value: {path: "Berendestring"}, valueFormat: "yyyyMMdd" }) })
                ],
                rowSettingsTemplate: new sap.gantt.simple.GanttRowSettings( {rowId: "{Aufgabenid}" }) 
            })
        ]});

        var oGanttTable = oGantt.getGanttCharts()[0],
        sServiceUrl = "/sap/opu/odata/sap/Z_PPM_Projekt_SRV/",
        oModel = new sap.ui.model.odata.v2.ODataModel(sServiceUrl);

        oGantt.setModel(oModel);
        oGanttTable.bindRows({
            path : "/TimingAnnoSet",
            parameters: {
                operationMode: "Server",
                numberOfExpandedLevels: 0
            }
        });

        oGanttTable.setShapeDataNames(["top"]);
        oGanttTable.setShapes(this.configShape());
        oGantt.placeAt("content");}

这里我的configShape方法作为代码:

        configShape: function () {
        var aShapes = [];
        Rectangle.extend("sap.gantt.ppm.Rectangle", {
            getFill: function(oRawData) {
                switch (oRawData.Hierarchie) {
                    case "0":
                        return "black";
                    case "1":
                        return "#FF9999";
                    default:
                        return "#FAC364";
                }
            }
        });

        var oTopShape = new sap.gantt.config.Shape({
            key: "top",
            shapeDataName: "metadata",
            shapeClassName: "sap.gantt.ppm.Rectangle",
            level: 1,
            shapeProperties: {
                time: "{Berstartstring}",
                endTime: "{Berendestring}",
                height: 20,
                isDuration: true,
                enableDnD: true
            }
        });

        aShapes = [oTopShape];
        return aShapes;
    }
© www.soinside.com 2019 - 2024. All rights reserved.