55 lines
2.5 KiB
JavaScript
55 lines
2.5 KiB
JavaScript
function createConsumptionHeaderView({ createCloseIcon, formatOracleResponseDate, environment }) {
|
|
const { document } = environment;
|
|
function createHeader({ titleId, customerLabel, closeLabel, onClose, titleText = "Cloud Consumption" }) {
|
|
const header = document.createElement("header");
|
|
header.className = "opportunities-extension-account-plans-header";
|
|
const heading = document.createElement("div");
|
|
const title = document.createElement("h2");
|
|
title.id = titleId;
|
|
title.textContent = titleText;
|
|
const subtitle = document.createElement("p");
|
|
subtitle.textContent = customerLabel;
|
|
heading.append(title, subtitle);
|
|
const closeButton = document.createElement("button");
|
|
closeButton.type = "button";
|
|
closeButton.className = "opportunities-extension-icon-button";
|
|
closeButton.setAttribute("aria-label", closeLabel);
|
|
closeButton.title = "Close";
|
|
closeButton.append(createCloseIcon());
|
|
closeButton.addEventListener("click", onClose);
|
|
header.append(heading, closeButton);
|
|
return header;
|
|
}
|
|
function createDetails(plan, { contractAction = null } = {}) {
|
|
const details = document.createElement("dl");
|
|
details.className = "opportunities-extension-account-plan-details";
|
|
const fields = [
|
|
{ label: "Booking Customer", value: plan.bookingCustomer },
|
|
{ label: "Sold To Party Name", value: plan.soldToPartyName },
|
|
{ label: "Contract ID", value: plan.contractId },
|
|
{ label: "Header Status", value: plan.hdrStatusCode },
|
|
{ label: "Start Date", value: formatOracleResponseDate(plan.startDate) },
|
|
{ label: "End Date", value: formatOracleResponseDate(plan.endDate) }
|
|
];
|
|
fields.forEach(field => {
|
|
const group = document.createElement("div");
|
|
const term = document.createElement("dt");
|
|
const description = document.createElement("dd");
|
|
term.textContent = field.label;
|
|
description.textContent = field.value === null || field.value === undefined || field.value === "" ? "-" : String(field.value);
|
|
if (field.label === "Contract ID" && contractAction) {
|
|
group.className = "opportunities-extension-contract-row";
|
|
const value = document.createElement("span");
|
|
value.textContent = description.textContent;
|
|
description.textContent = "";
|
|
description.className = "opportunities-extension-contract-ratecard";
|
|
description.append(value, contractAction);
|
|
}
|
|
group.append(term, description);
|
|
details.append(group);
|
|
});
|
|
return details;
|
|
}
|
|
return { createHeader, createDetails };
|
|
}
|