Como adicionar data / hora do serviço OData corretamente à interface do usuário?
Estou criando uma pequena página de demonstração que exibe algumas funcionalidades diretas da UI5. Esta página consiste em duas páginas principais:
Na primeira página, há uma lista de operadoras que podem ser criadas, excluídas e atualizadas. Essas operadoras têm um ID (Carrid
)Se alguém clicar em uma transportadora, ela será encaminhada para a segunda página, na qual todos os voos da transportadora selecionada são mostrados em uma tabela (com algumas informações sobre os voos).A tabela fica assim:
<Table id="detailTable" inset="false" class="sapUiResponsiveMargin">
<columns>
<Column>
<Text text="ID" />
</Column>
<Column>
<Text text="Flightnumber" />
</Column>
<Column>
<Text text="Starts in" />
</Column>
<Column>
<Text text="Departs at" />
</Column>
<Column>
<Text text="Lands in" />
</Column>
<Column>
<Text text="Lands at" />
</Column>
</columns>
</Table>
Os dados são vinculados às colunas com este código:
// Get routing data and show only entrys with the matched primary key (Carrid)
_onRouteMatched: function(oEvent) {
// ...
var oArgs = oEvent.getParameter("arguments");
var oFlightTable = oView.byId("detailTable");
oFlightTable.bindAggregation("items", {
path: "/CarrierSet(" + "'" + oArgs.flightPath + "'" + ")/FlightSet",
template: new sap.m.ColumnListItem({
cells: [
new sap.m.Text({
text: "{Carrid}"
}),
new sap.m.Text({
text: "{Connid}"
}),
new sap.m.Text({
text: "{Cityfrom}"
}),
new sap.m.Text({
text: "{Deptime}"
}),
new sap.m.Text({
text: "{Cityto}"
}),
new sap.m.Text({
text: "{Arrtime}"
})
]
})
});
}
ProblemaO código funciona bem se os dados puderem ser mostrados sem manipulá-los primeiro. Mas os campos{Deptime}
e{Arrtime}
tem o tipoEdm.Time que preciso converter primeiro para exibi-lo em uma forma legível por humanos.
Consegui fazer isso com esse código (eu sei, não da maneira mais eficiente, mas ainda estou aprendendo. Portanto, se você tiver alguma melhoria, fique à vontade para publicá-la):
pageTable.addEventDelegate({
onAfterRendering: function() {
var mTable = this.getView("FilterBarSimple").byId("detailTable");
var mModel = mTable.getModel();
var aItems = mTable.getItems();
// ----- TIME CONVERSION ----
var arrayTime = [];
for (var iTime = 0; iTime < aItems.length; iTime++) {
var iAdded = mModel.getProperty("Deptime", aItems[iTime].getBindingContext());
arrayTime.push(iAdded);
}
var timeFormat = sap.ui.core.format.DateFormat.getTimeInstance({
pattern: "kk:mm:ss"
});
var tz = new Date(0).getTimezoneOffset() * 60 * 1000;
var arrayTimeClean = [];
$.each(arrayTime, function(ii, ee) {
var timeStr = timeFormat.format(new Date(ee.ms + tz));
arrayTimeClean.push(timeStr);
});
}
});
Isso gera esta saída que está correta:
Mas não consigo vincular corretamente esses dados manipulados à tabela novamente. Eu tentei com oOData.read()
função e algumas outras abordagens bastante invasivas, mas nunca tive sucesso e estou com esse problema há algum tempo.
Se alguém tiver uma ideia ou sugestão, ficaria mais do que agradecido se você me informar.