sunrise-cms/views/contract-edit.ejs

862 lines
38 KiB
Plaintext

<%- include('_header'); -%>
<nav class="breadcrumb">
<ul>
<li><a href="<%= urlPrefix %>/dashboard">Home</a></li>
<li>
<a href="<%= urlPrefix %>/contracts">
<span class="icon is-small">
<span class="fa-layers fa-fw" aria-hidden="true">
<i class="fas fa-vector-square"></i>
<i class="fas fa-user" data-fa-transform="shrink-10"></i>
</span>
</span>
<span>Contracts</span>
</a>
</li>
<% if (!isCreate) { %>
<li>
<a href="<%= urlPrefix %>/contracts/<%= contract.contractId %>" accesskey="v">
Contract #<%= contract.contractId %>: <%= contract.burialSiteName || ("(No Burial Site)") %>
</a>
</li>
<% } %>
<li class="is-active">
<a href="#" aria-current="page">
<% if (isCreate) { %>
Create a New Contract
<% } else { %>
Update Contract
<% } %>
</a>
</li>
</ul>
</nav>
<% if (isCreate) { %>
<h1 class="title is-1">
Create a New Contract
</h1>
<% } else { %>
<h1 class="title is-1">
Update Contract #<%= contract.contractId %>
</h1>
<% } %>
<div class="level is-fixed-bottom is-mobile has-background-white has-shadow is-hidden-print">
<div class="level-left">
<% if (!isCreate) { %>
<span class="level-item has-text-weight-bold">
Contract #<%= contract.contractId %>:
<%= contract.burialSiteName || ("(No Burial Site)") %>
</span>
<% } %>
</div>
<div class="level-right">
<% if (!isCreate && contractTypePrints.length > 0) { %>
<% if (contractTypePrints.length === 1) { %>
<div class="level-item">
<a href="<%= urlPrefix %>/print/<%= contractTypePrints[0] %>/?contractId=<%= contract.contractId %>" target="_blank" aria-label="Print">
<span class="icon"><i class="fas fa-print" aria-hidden="true"></i></span>
<span class="is-hidden-touch">Print</span>
</a>
</div>
<% } else { %>
<div class="level-item">
<div class="dropdown is-right is-up">
<div class="dropdown-trigger">
<button class="button" type="button" aria-label="Print">
<span class="icon"><i class="fas fa-print" aria-hidden="true"></i></span>
<span class="is-hidden-touch">Print</span>
<span class="icon"><i class="fas fa-angle-up" aria-hidden="true"></i></span>
</a>
</div>
<div class="dropdown-menu">
<div class="dropdown-content">
<% for (const printName of contractTypePrints) { %>
<% const printConfig = printFunctions.getPrintConfig(printName); %>
<% if (printConfig) { %>
<a class="dropdown-item" href="<%= urlPrefix %>/print/<%= printName %>/?contractId=<%= contract.contractId %>" target="_blank">
<span class="icon"><i class="fas fa-print" aria-hidden="true"></i></span>
<span><%= printConfig.title %></span>
</a>
<% } %>
<% } %>
</div>
</div>
</div>
</div>
<% } %>
<% } %>
<% if (isCreate) { %>
<div class="level-item">
<a class="button is-danger is-inverted" href="<%= urlPrefix %>/contracts">
Cancel
</a>
</div>
<% } else { %>
<div class="level-item">
<div class="dropdown is-right is-up">
<div class="dropdown-trigger">
<button class="button" type="button">
<span>
<span class="is-hidden-touch">More</span>
Options
</span>
<span class="icon">
<i class="fas fa-angle-up" aria-hidden="true"></i>
</span>
</button>
</div>
<div class="dropdown-menu">
<div class="dropdown-content">
<a class="dropdown-item" id="button--copyContract" href="#">
<span class="icon"><i class="far fa-copy" aria-hidden="true"></i></span>
<span>Copy Contract as New</span>
</a>
<a class="dropdown-item" id="button--deleteContract" href="#">
<span class="icon"><i class="fas fa-trash has-text-danger" aria-hidden="true"></i></span>
<span>Delete Contract</span>
</a>
</div>
</div>
</div>
</div>
<% } %>
<div class="level-item">
<button class="button is-primary is-light" type="submit" form="form--contract">
<span class="icon is-small"><i class="fas fa-save" aria-hidden="true"></i></span>
<span>
<%= (isCreate ? "Create" : "Update") %>
<span class="is-hidden-touch">
Contract
</span>
</span>
</button>
</div>
</div>
</div>
<form id="form--contract">
<input id="contract--contractId" name="contractId" type="hidden" value="<%= contract.contractId %>" />
<div class="panel">
<div class="panel-block is-block">
<div class="columns">
<div class="column">
<label class="label" for="contract--contractTypeId">
Contract Type
</label>
<div class="field has-addons">
<div class="control is-expanded">
<div class="select is-fullwidth">
<select
<% if (!isCreate) { %>
class="is-readonly"
<% } %>
id="contract--contractTypeId" name="contractTypeId"
required accesskey="f"
<%= (isCreate ? " autofocus" : "") %>>
<% if (isCreate) { %>
<option value="" data-is-preneed="false">(No Type)</option>
<% } %>
<% let typeIsFound = false; %>
<% for (const contractType of contractTypes) { %>
<%
if (contract.contractTypeId === contractType.contractTypeId) {
typeIsFound = true;
}
%>
<option value="<%= contractType.contractTypeId %>"
<%- (contractType.isPreneed ? ' data-is-preneed="true"' : ' data-is-preneed="false"') %>
<%= (contract.contractTypeId === contractType.contractTypeId ? ' selected' : '') %>
<%= (!isCreate && contract.contractTypeId !== contractType.contractTypeId ? " disabled" : "") %>>
<%= contractType.contractType %>
</option>
<% } %>
<% if (contract.contractTypeId && !typeIsFound) { %>
<option value="<%= contract.contractTypeId %>"
<%- (contract.isPreneed ? ' data-is-preneed="true"' : ' data-is-preneed="false"') %>
selected>
<%= contract.contractType %>
</option>
<% } %>
</select>
</div>
</div>
<div class="control is-hidden-print">
<button class="button is-unlock-field-button" data-tooltip="Unlock Field" type="button" aria-label="Unlock Contract Type Field">
<i class="fas fa-unlock" aria-hidden="true"></i>
</button>
</div>
</div>
<input id="contract--burialSiteId" name="burialSiteId" type="hidden" value="<%= contract.burialSiteId %>" />
<label class="label" for="contract--burialSiteName">
Burial Site
</label>
<div class="field has-addons">
<div class="control is-expanded">
<input class="input is-clickable has-text-left <%= (isCreate ? "" : " is-readonly") %>"
id="contract--burialSiteName" type="button"
value="<%= contract.burialSiteName || "(No Burial Site)" %>"
<%= (configFunctions.getConfigProperty("settings.contracts.burialSiteIdIsRequired") ? " required" : "") %>
<%= (isCreate ? "" : " disabled readonly") %> />
</div>
<div class="control is-hidden-print">
<button class="button is-clear-burial-site-button" data-tooltip="Clear" type="button" aria-label="Clear Burial Site Field">
<i class="fas fa-eraser" aria-hidden="true"></i>
</button>
</div>
<div class="control is-hidden-print">
<button class="button is-unlock-field-button" data-tooltip="Unlock Field" type="button" aria-label="Unlock Burial Site Field">
<i class="fas fa-unlock" aria-hidden="true"></i>
</button>
</div>
<div class="control is-hidden-print">
<button class="button is-burial-site-view-button" data-tooltip="Open Burial Site" type="button" aria-label="Open Burial Site">
<i class="fas fa-external-link-alt" aria-hidden="true"></i>
</button>
</div>
</div>
</div>
<div class="column is-3">
<div class="field">
<label class="label" for="contract--contractStartDateString">Contract Date</label>
<div class="control has-icons-left">
<input class="input" id="contract--contractStartDateString" name="contractStartDateString" type="date"
value="<%= contract.contractStartDateString %>" required />
<span class="icon is-left">
<i class="fas fa-calendar" aria-hidden="true"></i>
</span>
</div>
</div>
<div class="field">
<label class="label" for="contract--contractEndDateString">End Date</label>
<div class="control has-icons-left">
<input class="input" id="contract--contractEndDateString" name="contractEndDateString" type="date"
value="<%= contract.contractEndDateString %>"
min="<%= contract.contractStartDateString %>"
<%= (configFunctions.getConfigProperty("settings.contracts.contractEndDateIsRequired") ? " required" : "") %> />
<span class="icon is-left">
<i class="fas fa-calendar" aria-hidden="true"></i>
</span>
</div>
</div>
</div>
<div class="column">
<div id="container--contractFields">
<% if (isCreate) { %>
<div class="message is-info">
<p class="message-body">
Select the contract type to load the available fields.
</p>
</div>
<% } else if (contract.contractFields.length === 0) { %>
<div class="message is-info">
<p class="message-body">
The current contract type has no additional fields.
</p>
</div>
<% } else { %>
<% let contractTypeFieldIds = ""; %>
<% for (const contractField of contract.contractFields) { %>
<% contractTypeFieldIds += "," + contractField.contractTypeFieldId; %>
<div class="field">
<label class="label" for="contract--fieldValue_<%= contractField.contractTypeFieldId %>">
<%= contractField.contractTypeField %>
</label>
<div class="control">
<% if (contractField.fieldType === 'select' || (contractField.fieldValues ?? '') !== "") { %>
<%
const fieldValues = contractField.fieldValues.split("\n");
let valueFound = false;
%>
<div class="select is-fullwidth">
<select id="contract--fieldValue_<%= contractField.contractTypeFieldId %>"
name="fieldValue_<%= contractField.contractTypeFieldId %>">
<% if (!contractField.isRequired || contractField.contractFieldValue === "") { %>
<option value="">(Not Set)</option>
<% } %>
<% for (const fieldValue of fieldValues) { %>
<%
if (fieldValue === contractField.fieldValue) {
valueFound = true;
}
%>
<option value="<%= fieldValue %>"
<%= (fieldValue === contractField.fieldValue ? " selected" : "") %>>
<%= fieldValue %>
</option>
<% } %>
<% if (!valueFound && contractField.fieldValue !== "") { %>
<option value="<%= contractField.fieldValue %>" selected>
<%= contractField.fieldValue %>
</option>
<% } %>
</select>
</div>
<% } else { %>
<input class="input"
id="contract--fieldValue_<%= contractField.contractTypeFieldId %>"
name="fieldValue_<%= contractField.contractTypeFieldId %>"
type="<%= contractField.fieldType %>"
value="<%= contractField.fieldValue %>"
<% if (contractField.pattern !== "") { %>
pattern="<%= contractField.pattern %>"
<% } %>
minlength="<%= contractField.minLength %>"
maxlength="<%= contractField.maxLength %>"
<%= contractField.isRequired ? " required" : "" %>
/>
<% } %>
</div>
</div>
<% } %>
<input id="contract--contractTypeFieldIds" name="contractTypeFieldIds" type="hidden" value="<%= contractTypeFieldIds.slice(1) %>" />
<% } %>
</div>
</div>
</div>
</div>
</div>
<div class="panel">
<h2 class="panel-heading">Funeral</h2>
<div class="panel-block is-block">
<div class="columns">
<div class="column">
<div class="field">
<label class="label" for="contract--funeralHomeId">
Funeral Home
</label>
<div class="control">
<div class="select is-fullwidth">
<select id="contract--funeralHomeId" name="funeralHomeId">
<option value="">(No Funeral Home)</option>
<% let funeralHomeIsFound = false; %>
<% for (const funeralHome of funeralHomes) { %>
<%
if (contract.funeralHomeId === funeralHome.funeralHomeId) {
funeralHomeIsFound = true;
}
%>
<option value="<%= funeralHome.funeralHomeId %>"
<%= (contract.funeralHomeId === funeralHome.funeralHomeId ? " selected" : "") %>>
<%= funeralHome.funeralHomeName %>
</option>
<% } %>
<% if (contract.funeralHomeId && !funeralHomeIsFound) { %>
<option value="<%= contract.funeralHomeId %>" selected>
<%= contract.funeralHomeName %>
</option>
<% } %>
</select>
</div>
</div>
</div>
<div class="field">
<label class="label" for="contract--funeralDirectorName">
Funeral Director's Name
</label>
<div class="control">
<input class="input" id="contract--funeralDirectorName" name="funeralDirectorName" type="text" maxlength="100" autocomplete="off" value="<%= contract.funeralDirectorName %>" />
</div>
</div>
</div>
<div class="column">
<div class="columns is-mobile mb-0">
<div class="column">
<div class="field">
<label class="label" for="contract--funeralDateString">Funeral Date</label>
<div class="control has-icons-left">
<input class="input" id="contract--funeralDateString" name="funeralDateString" type="date"
value="<%= contract.funeralDateString %>" />
<span class="icon is-left">
<i class="fas fa-calendar" aria-hidden="true"></i>
</span>
</div>
</div>
</div>
<div class="column">
<div class="field">
<label class="label" for="contract--funeralTimeString">Time</label>
<div class="control has-icons-left">
<input class="input" id="contract--funeralTimeString" name="funeralTimeString" type="time" value="<%= contract.funeralTimeString %>" />
<span class="icon is-left">
<i class="fas fa-clock" aria-hidden="true"></i>
</span>
</div>
</div>
</div>
</div>
<div class="field">
<label class="label" for="contract--committalTypeId">Committal Type</label>
<div class="control">
<div class="select is-fullwidth">
<select id="contract--committalTypeId" name="committalTypeId">
<option value="">(No Type)</option>
<% let committalTypeIsFound = false; %>
<% for (const committalType of committalTypes) { %>
<%
if (contract.committalTypeId === committalType.committalTypeId) {
committalTypeIsFound = true;
}
%>
<option value="<%= committalType.committalTypeId %>"
<%= (contract.committalTypeId === committalType.committalTypeId ? " selected" : "") %>>
<%= committalType.committalType %>
</option>
<% } %>
<% if (contract.committalTypeId && !committalTypeIsFound) { %>
<option value="<%= contract.committalTypeId %>" selected>
<%= contract.committalType %>
</option>
<% } %>
</select>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="columns">
<div class="column">
<div class="panel">
<h2 class="panel-heading">Purchaser</h2>
<div class="panel-block is-block">
<div class="field">
<label class="label" for="contract--purchaserName">
Purchaser Name
</label>
<div class="control">
<input class="input" id="contract--purchaserName" name="purchaserName" type="text" maxlength="100" autocomplete="off" required value="<%= contract.purchaserName %>" />
</div>
</div>
<div class="field">
<label class="label" for="contract--purchaserAddress1">Address</label>
<div class="control">
<input class="input" id="contract--purchaserAddress1" name="purchaserAddress1" type="text" maxlength="50" placeholder="Line 1" autocomplete="off" value="<%= contract.purchaserAddress1 %>" />
</div>
</div>
<div class="field">
<div class="control">
<input class="input" id="contract--purchaserAddress2" name="purchaserAddress2" type="text" maxlength="50" placeholder="Line 2" autocomplete="off" aria-label="Address Line 2" value="<%= contract.purchaserAddress2 %>" />
</div>
</div>
<div class="columns">
<div class="column">
<div class="field">
<label class="label" for="contract--purchaserCity">City</label>
<div class="control">
<input class="input" id="contract--purchaserCity" name="purchaserCity" type="text" maxlength="20" value="<%= contract.purchaserCity %>" />
</div>
</div>
</div>
<div class="column">
<div class="field">
<label class="label" for="contract--purchaserProvince">Province</label>
<div class="control">
<input class="input" id="contract--purchaserProvince" name="purchaserProvince" type="text" maxlength="2" value="<%= contract.purchaserProvince %>" />
</div>
</div>
</div>
<div class="column">
<div class="field">
<label class="label" for="contract--purchaserPostalCode">Postal Code</label>
<div class="control">
<input class="input" id="contract--purchaserPostalCode" name="purchaserPostalCode" type="text" maxlength="7" autocomplete="off" value="<%= contract.purchaserPostalCode %>" />
</div>
</div>
</div>
</div>
<div class="columns">
<div class="column">
<div class="field">
<label class="label" for="contract--purchaserPhoneNumber">Phone Number</label>
<div class="control">
<input class="input" id="contract--purchaserPhoneNumber" name="purchaserPhoneNumber" type="text" maxlength="30" autocomplete="off" value="<%= contract.purchaserPhoneNumber %>" />
</div>
</div>
</div>
<div class="column">
<div class="field">
<label class="label" for="contract--purchaserEmail">Email Address</label>
<div class="control">
<input class="input" id="contract--purchaserEmail" name="purchaserEmail" type="email" maxlength="100" autocomplete="off" value="<%= contract.purchaserEmail %>" />
</div>
</div>
</div>
</div>
<div class="field">
<label class="label" for="contract--purchaserRelationship">
Relationship to
<span class="is-recipient-or-deceased">
<%= (contract.isPreneed ? "Recipient" : "Deceased") %>
</span>
</label>
<div class="control">
<input class="input" id="contract--purchaserRelationship" name="purchaserRelationship" type="text" maxlength="100" autocomplete="off" value="<%= contract.purchaserRelationship %>" />
</div>
</div>
</div>
</div>
</div>
<div class="column">
<% if (isCreate) { %>
<div class="panel">
<div class="panel-heading">
<div class="level is-mobile">
<div class="level-left">
<div class="level-item">
<h2 class="has-text-weight-bold is-size-5 is-recipient-or-deceased">
<%= (contract.isPreneed ? "Recipient" : "Deceased") %>
</h2>
</div>
</div>
<div class="level-right">
<div class="level-item">
<button class="button is-small is-hidden-print" id="button--copyFromPurchaser" type="button">
<span class="icon is-small"><i class="far fa-copy" aria-hidden="true"></i></span>
<span>Copy from Purchaser</span>
</button>
</div>
</div>
</div>
</div>
<div class="panel-block is-block">
<div class="field">
<label class="label" for="contract--deceasedName">
<span class="is-recipient-or-deceased"><%= (contract.isPreneed ? "Recipient" : "Deceased") %></span>
Name
</label>
<div class="control">
<input class="input" id="contract--deceasedName" name="deceasedName" type="text" maxlength="100" autocomplete="off" required value="<%= contract.deceasedName %>" />
</div>
</div>
<div class="field">
<label class="label" for="contract--deceasedAddress1">Address</label>
<div class="control">
<input class="input" id="contract--deceasedAddress1" name="deceasedAddress1" type="text" maxlength="50" placeholder="Line 1" autocomplete="off" value="<%= contract.deceasedAddress1 %>" />
</div>
</div>
<div class="field">
<div class="control">
<input class="input" id="contract--deceasedAddress2" name="deceasedAddress2" type="text" maxlength="50" placeholder="Line 2" autocomplete="off" aria-label="Address Line 2" value="<%= contract.deceasedAddress2 %>" />
</div>
</div>
<div class="columns">
<div class="column">
<div class="field">
<label class="label" for="contract--deceasedCity">City</label>
<div class="control">
<input class="input" id="contract--deceasedCity" name="deceasedCity" type="text" maxlength="20" value="<%= contract.deceasedCity %>" />
</div>
</div>
</div>
<div class="column">
<div class="field">
<label class="label" for="contract--deceasedProvince">Province</label>
<div class="control">
<input class="input" id="contract--deceasedProvince" name="deceasedProvince" type="text" maxlength="2" value="<%= contract.deceasedProvince %>" />
</div>
</div>
</div>
<div class="column">
<div class="field">
<label class="label" for="contract--deceasedPostalCode">Postal Code</label>
<div class="control">
<input class="input" id="contract--deceasedPostalCode" name="deceasedPostalCode" type="text" maxlength="7" autocomplete="off" value="<%= contract.deceasedPostalCode %>" />
</div>
</div>
</div>
</div>
<div class="columns">
<div class="column">
<div class="field">
<label class="label" for="contract--birthDateString">
Date of Birth
</label>
<div class="control has-icons-left">
<input class="input" id="contract--birthDateString" name="birthDateString" type="date" value="<%= contract.birthDateString %>" />
<span class="icon is-left">
<i class="fas fa-calendar" aria-hidden="true"></i>
</span>
</div>
</div>
</div>
<div class="column">
<div class="field">
<label class="label" for="contract--birthPlace">
Place of Birth
</label>
<div class="control">
<input class="input" id="contract--birthPlace" name="birthPlace" type="text" maxlength="100" autocomplete="off" value="<%= contract.deceasedPlaceOfBirth %>" />
</div>
</div>
</div>
</div>
<div class="columns">
<div class="column">
<div class="field">
<label class="label" for="contract--deathDateString">
Date of Death
</label>
<div class="control has-icons-left">
<input class="input" id="contract--deathDateString" name="deathDateString" type="date" value="<%= contract.deceasedDateOfDeathString %>" />
<span class="icon is-left">
<i class="fas fa-calendar" aria-hidden="true"></i>
</span>
</div>
</div>
</div>
<div class="column">
<div class="field">
<label class="label" for="contract--deathPlace">
Place of Death
</label>
<div class="control">
<input class="input" id="contract--deathPlace" name="deathPlace" type="text" maxlength="100" autocomplete="off" value="<%= contract.deceasedPlaceOfDeath %>" />
</div>
</div>
</div>
</div>
<div class="field">
<label class="label" for="contract--intermentContainerTypeId">Container</label>
<div class="select is-fullwidth">
<select id="contract--intermentContainerTypeId" name="intermentContainerTypeId">
<option value="">(No Container)</option>
<optgroup label="Non-Cremated">
<%
let containerIsFound = false;
let isCremationType = false;
%>
<% for (const container of intermentContainerTypes) { %>
<% if (container.isCremationType && !isCremationType) { %>
</optgroup>
<optgroup label="Cremated">
<% isCremationType = true; %>
<% } %>
<%
if (contract.intermentContainerTypeId === container.intermentContainerTypeId) {
containerIsFound = true;
}
%>
<option value="<%= container.intermentContainerTypeId %>">
<%= (contract.intermentContainerTypeId === container.intermentContainerTypeId ? " selected" : "") %>
<%= container.intermentContainerType %>
</option>
<% } %>
</optgroup>
<% if (contract.intermentContainerTypeId && !containerIsFound) { %>
<option value="<%= contract.intermentContainerTypeId %>" selected>
<%= contract.intermentContainerType %>
</option>
<% } %>
</select>
</div>
</div>
<div class="message is-info is-small">
<p class="message-body">
Any additional interments associated with this contract can be added after the contract is created.
</p>
</div>
</div>
</div>
<% } else { %>
<div class="panel">
<div class="panel-heading">
<div class="level is-mobile">
<div class="level-left">
<div class="level-item">
<h2 class="has-text-weight-bold is-size-5">
<%= (contract.isPreneed ? "Recipient" : "Deceased") %>
</h2>
</div>
</div>
<div class="level-right">
<div class="level-item">
<button class="button is-small is-success is-hidden-print" id="button--addInterment" type="button">
<span class="icon is-small"><i class="fas fa-plus" aria-hidden="true"></i></span>
<span>Add Additional <%= (contract.isPreneed ? "Recipient" : "Deceased") %></span>
</button>
</div>
</div>
</div>
</div>
<div class="panel-block is-block" id="container--contractInterments"></div>
</div>
<% } %>
</div>
</div>
</form>
<% if (!isCreate) { %>
<div class="columns is-desktop mt-4">
<div class="column is-7-desktop">
<div class="panel">
<div class="panel-heading">
<div class="level is-mobile">
<div class="level-left">
<div class="level-item">
<h2 class="has-text-weight-bold is-size-5">Fees</h2>
</div>
</div>
<div class="level-right">
<div class="level-item">
<button class="button is-small is-success is-hidden-print" id="button--addFee" type="button">
<span class="icon is-small"><i class="fas fa-plus" aria-hidden="true"></i></span>
<span>Add Fee</span>
</button>
</div>
</div>
</div>
</div>
<div class="panel-block is-block" id="container--contractFees"></div>
</div>
</div>
<div class="column">
<div class="panel">
<div class="panel-heading">
<div class="level is-mobile">
<div class="level-left">
<div class="level-item">
<h2 class="has-text-weight-bold is-size-5">Transactions</h2>
</div>
</div>
<div class="level-right">
<div class="level-item">
<button class="button is-small is-success is-hidden-print" id="button--addTransaction" type="button">
<span class="icon is-small"><i class="fas fa-plus" aria-hidden="true"></i></span>
<span>Add Transaction</span>
</button>
</div>
</div>
</div>
</div>
<div class="panel-block is-block" id="container--contractTransactions"></div>
</div>
</div>
</div>
<%
const workOrderOpenDateAlias = configFunctions.getConfigProperty("aliases.workOrderOpenDate");
const workOrderCloseDateAlias = configFunctions.getConfigProperty("aliases.workOrderCloseDate");
%>
<div class="panel">
<div class="panel-heading">
<div class="level is-mobile">
<div class="level-left">
<h2 class="has-text-weight-bold is-size-5">Work Orders</h2>
</div>
<div class="level-right">
<div class="level-item">
<button class="button is-small is-success is-hidden-print" id="button--createWorkOrder" type="button">
<span class="icon is-small"><i class="fas fa-plus" aria-hidden="true"></i></span>
<span>Create a Work Order</span>
</button>
</div>
</div>
</div>
</div>
<div class="panel-block is-block">
<% if (contract.workOrders.length === 0) { %>
<div class="message is-info">
<p class="message-body">
There are no work orders associated with this record.
</p>
</div>
<% } else { %>
<table class="table is-fullwidth is-striped is-hoverable">
<thead>
<tr>
<th>Work Order Number</th>
<th>Description</th>
<th>Date</th>
</tr>
</thead>
<tbody>
<% for (const workOrder of contract.workOrders) { %>
<tr>
<td>
<a class="has-text-weight-bold" href="<%= urlPrefix %>/workOrders/<%= workOrder.workOrderId %>">
<%= workOrder.workOrderNumber %>
</a>
</td>
<td>
<%= workOrder.workOrderType %><br />
<span class="is-size-7"><%= workOrder.workOrderDescription %></span>
</td>
<td class="is-nowrap">
<span class="has-tooltip-left" data-tooltip="<%= workOrderOpenDateAlias %>">
<i class="fas fa-fw fa-play" aria-label="<%= workOrderOpenDateAlias %>"></i>
<%= workOrder.workOrderOpenDateString %>
</span><br />
<span class="has-tooltip-left" data-tooltip="<%= workOrderCloseDateAlias %>">
<i class="fas fa-fw fa-stop" aria-label="<%= workOrderCloseDateAlias %>"></i>
<% if (workOrder.workOrderCloseDate) { %>
<%= workOrder.workOrderCloseDateString %>
<% } else { %>
<span class="has-text-grey">(No <%= workOrderCloseDateAlias %>)</span>
<% } %>
</span>
</td>
</tr>
<% } %>
</tbody>
</table>
<% } %>
</div>
</div>
<div class="panel">
<div class="panel-heading">
<div class="level is-mobile">
<div class="level-left">
<div class="level-item">
<h2 class="has-text-weight-bold is-size-5">Comments</h2>
</div>
</div>
<div class="level-right">
<div class="level-item">
<button class="button is-small is-success is-hidden-print" id="button--addComment" type="button">
<span class="icon is-small"><i class="fas fa-plus" aria-hidden="true"></i></span>
<span>Add Comment</span>
</button>
</div>
</div>
</div>
</div>
<div class="panel-block is-block" id="container--contractComments"></div>
</div>
<% } %>
<%- include('_footerA'); -%>
<script>
<% if (!isCreate) { %>
exports.cityDefault = "<%= configFunctions.getConfigProperty('settings.cityDefault') %>";
exports.provinceDefault = "<%= configFunctions.getConfigProperty('settings.provinceDefault') %>";
exports.contractInterments = <%- JSON.stringify(contract.contractInterments) %>;
exports.intermentContainerTypes = <%- JSON.stringify(intermentContainerTypes) %>;
exports.contractComments = <%- JSON.stringify(contract.contractComments) %>;
exports.contractFees = <%- JSON.stringify(contract.contractFees) %>;
exports.contractTransactions = <%- JSON.stringify(contract.contractTransactions) %>;
exports.workOrderTypes = <%- JSON.stringify(workOrderTypes) %>;
<% } %>
</script>
<script src="<%= urlPrefix %>/javascripts/contract.edit.js"></script>
<% if (!isCreate) { %>
<script src="<%= urlPrefix %>/javascripts/contract.editInterments.js"></script>
<script src="<%= urlPrefix %>/javascripts/contract.editFees.js"></script>
<script src="<%= urlPrefix %>/javascripts/contract.editWorkOrders.js"></script>
<script src="<%= urlPrefix %>/javascripts/contract.editComments.js"></script>
<% } %>
<%- include('_footerB'); -%>