honeymoose
/
sp-dev-fx-webparts
mirror of https://github.com/pnp/sp-dev-fx-webparts.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Restructered renderData function to human readable compact version

This commit is contained in:
Danny Engelman 2017-05-18 13:26:51 +02:00 committed by GitHub
parent 62e2dd7e6e
commit e23419ce15
1 changed files with 19 additions and 23 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

42
samples/aad-api-spo-cookie/src/webparts/latestOrders/LatestOrdersWebPart.ts
View File

@ -71,31 +71,27 @@ export default class LatestOrdersWebPart extends BaseClientSideWebPart<ILatestOr
});
}
private renderData(): void {
if (this.orders === null) {
return;
private renderData(): void {
if (this.orders) {
const className = styles.number; // GLOBAL!
const table: Element = this.domElement.querySelector(".data");
table.removeAttribute("style"); //could use standard HTML5 'hidden' attribute instead of whole Style
table.querySelector("tbody").innerHTML =
this.orders.map(order =>
`<tr>
<td class="${className}">${order.id}</td>
<td class="${className}">${new Date(order.orderDate).toLocaleDateString()}</td>
<td>${order.region.toString()}</td>
<td>${order.rep}</td>
<td>${order.item}</td>
<td class="${className}">${order.units}</td>
<td class="${className}">$${order.unitCost.toFixed(2)}</td>
<td class="${className}">$${order.total.toFixed(2)}</td>
</tr>`
).join('');
}
}
let ordersString: string = "";
this.orders.forEach(order => {
ordersString += `
<tr>
<td class="${styles.number}">${order.id}</td>
<td class="${styles.number}">${new Date(order.orderDate).toLocaleDateString()}</td>
<td>${order.region.toString()}</td>
<td>${order.rep}</td>
<td>${order.item}</td>
<td class="${styles.number}">${order.units}</td>
<td class="${styles.number}">$${order.unitCost.toFixed(2)}</td>
<td class="${styles.number}">$${order.total.toFixed(2)}</td>
</tr>`;
});
const table: Element = this.domElement.querySelector(".data");
table.removeAttribute("style");
table.querySelector("tbody").innerHTML = ordersString;
}
private executeOrDelayUntilRemotePartyLoaded(func: Function): void {
if (this.remotePartyLoaded) {
func();