sunrise-cms/views/lotOccupancy-edit.ejs

418 lines
24 KiB
Plaintext

<%- include('_header'); -%>
<nav class="breadcrumb">
<ul>
<li><a href="<%= urlPrefix %>/dashboard">Home</a></li>
<li>
<a href="<%= urlPrefix %>/lotOccupancies">
<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><%= configFunctions.getProperty("aliases.lot") %> <%= configFunctions.getProperty("aliases.occupancies") %></span>
</a>
</li>
<% if (!isCreate) { %>
<li>
<a href="<%= urlPrefix %>/lotOccupancies/<%= lotOccupancy.lotOccupancyId %>" accesskey="v">
<%= configFunctions.getProperty("aliases.occupancy") %>: <%= lotOccupancy.lotName || ("(No " + configFunctions.getProperty("aliases.lot") + ")") %>
</a>
</li>
<% } %>
<li class="is-active">
<a href="#" aria-current="page">
<% if (isCreate) { %>
Create a New <%= configFunctions.getProperty("aliases.occupancy") %> Record
<% } else { %>
Update <%= configFunctions.getProperty("aliases.occupancy") %>
<% } %>
</a>
</li>
</ul>
</nav>
<% if (isCreate) { %>
<h1 class="title is-1">
Create a New <%= configFunctions.getProperty("aliases.occupancy") %> Record
</h1>
<% } else { %>
<div class="level">
<div class="level-left">
<div class="level-item is-justify-content-left">
<h1 class="title is-1">
Update <%= configFunctions.getProperty("aliases.occupancy") %>
</h1>
</div>
</div>
<% if (configFunctions.getProperty("settings.lotOccupancy.prints").length > 0) { %>
<div class="level-right is-hidden-print">
<div class="level-item is-justify-content-right">
<% if (configFunctions.getProperty("settings.lotOccupancy.prints").length === 1) { %>
<a class="button is-link" href="<%= urlPrefix %>/print/<%= configFunctions.getProperty("settings.lotOccupancy.prints")[0] %>/?lotOccupancyId=<%= lotOccupancy.lotOccupancyId %>" target="_blank">
<span class="icon is-small"><i class="fas fa-print" aria-hidden="true"></i></span>
<span>Print</span>
</a>
<% } else { %>
<div class="dropdown is-right">
<div class="dropdown-trigger">
<button class="button is-link" type="button">
<span class="icon is-small"><i class="fas fa-print" aria-hidden="true"></i></span>
<span>Print</span>
<span class="icon is-small"><i class="fas fa-caret-down" aria-hidden="true"></i></span>
</button>
</div>
<div class="dropdown-menu">
<div class="dropdown-content">
<% for (const printName of configFunctions.getProperty("settings.lotOccupancy.prints")) { %>
<% const printConfig = printFunctions.getPrintConfig(printName); %>
<% if (printConfig) { %>
<a class="dropdown-item" href="<%= urlPrefix %>/print/<%= printName %>/?lotOccupancyId=<%= lotOccupancy.lotOccupancyId %>" target="_blank">
<span class="icon is-small"><i class="fas fa-print" aria-hidden="true"></i></span>
<span><%= printConfig.title %></span>
</a>
<% } %>
<% } %>
</div>
</div>
</div>
<% } %>
</div>
</div>
<% } %>
</div>
<% } %>
<form id="form--lotOccupancy">
<input id="lotOccupancy--lotOccupancyId" name="lotOccupancyId" type="hidden" value="<%= lotOccupancy.lotOccupancyId %>" />
<div class="panel">
<div class="panel-block is-block">
<div class="columns">
<div class="column">
<label class="label" for="lotOccupancy--occupancyTypeId">
<%= configFunctions.getProperty("aliases.occupancy") %> Type
</label>
<div class="field has-addons">
<div class="control is-expanded">
<div class="select is-fullwidth">
<select
<% if (!isCreate) { %>
class="is-readonly"
<% } %>
id="lotOccupancy--occupancyTypeId" name="occupancyTypeId"
required accesskey="f"
<%= (isCreate ? " autofocus" : "") %>>
<% if (isCreate) { %>
<option value="">(No Type)</option>
<% } %>
<% let typeIsFound = false; %>
<% for (const occupancyType of occupancyTypes) { %>
<%
if (lotOccupancy.occupancyTypeId === occupancyType.occupancyTypeId) {
typeIsFound = true;
}
%>
<option value="<%= occupancyType.occupancyTypeId %>"
<%= (lotOccupancy.occupancyTypeId === occupancyType.occupancyTypeId ? " selected" : "") %>
<%= (!isCreate && lotOccupancy.occupancyTypeId !== occupancyType.occupancyTypeId ? " disabled" : "") %>>
<%= occupancyType.occupancyType %>
</option>
<% } %>
<% if (lotOccupancy.occupancyTypeId && !typeIsFound) { %>
<option value="<%= lotOccupancy.occupancyTypeId %>" selected>
<%= lotOccupancy.occupancyType %>
</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 <%= configFunctions.getProperty("aliases.occupancy") %> Type Field">
<i class="fas fa-unlock" aria-hidden="true"></i>
</button>
</div>
</div>
<input id="lotOccupancy--lotId" name="lotId" type="hidden" value="<%= lotOccupancy.lotId %>" />
<label class="label" for="lotOccupancy--lotName">
<%= configFunctions.getProperty("aliases.lot") %>
</label>
<div class="field has-addons">
<div class="control is-expanded">
<input class="input is-clickable has-text-left <%= (isCreate ? "" : " is-readonly") %>" id="lotOccupancy--lotName" type="button" value="<%= lotOccupancy.lotName || "(No " + configFunctions.getProperty("aliases.lot") + ")" %>"
<%= (configFunctions.getProperty("settings.lotOccupancy.lotIdIsRequired") ? " required" : "") %>
<%= (isCreate ? "" : " disabled readonly") %> />
</div>
<div class="control is-hidden-print">
<button class="button is-clear-lot-button" data-tooltip="Clear" type="button" aria-label="Clear <%= configFunctions.getProperty("aliases.lot") %></button> 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 <%= configFunctions.getProperty("aliases.lot") %></button> Field">
<i class="fas fa-unlock" aria-hidden="true"></i>
</button>
</div>
<div class="control is-hidden-print">
<button class="button is-lot-view-button" data-tooltip="Open <%= configFunctions.getProperty("aliases.lot") %>" type="button" aria-label="Open <%= configFunctions.getProperty("aliases.lot") %>">
<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="lotOccupancy--occupancyStartDateString"><%= configFunctions.getProperty("aliases.occupancyStartDate") %></label>
<div class="control has-icons-left">
<input class="input" id="lotOccupancy--occupancyStartDateString" name="occupancyStartDateString" type="date"
value="<%= lotOccupancy.occupancyStartDateString %>" 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="lotOccupancy--occupancyEndDateString">End Date</label>
<div class="control has-icons-left">
<input class="input" id="lotOccupancy--occupancyEndDateString" name="occupancyEndDateString" type="date"
value="<%= lotOccupancy.occupancyEndDateString %>"
min="<%= lotOccupancy.occupancyStartDateString %>"
<%= (configFunctions.getProperty("settings.lotOccupancy.occupancyEndDateIsRequired") ? " 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--lotOccupancyFields">
<% if (isCreate) { %>
<div class="message is-info">
<p class="message-body">
Select the <%= configFunctions.getProperty("aliases.occupancy").toLowerCase() %> type to load the available fields.
</p>
</div>
<% } else if (lotOccupancy.lotOccupancyFields.length === 0) { %>
<div class="message is-info">
<p class="message-body">
The current <%= configFunctions.getProperty("aliases.occupancy").toLowerCase() %> type has no additional fields.
</p>
</div>
<% } else { %>
<% let occupancyTypeFieldIds = ""; %>
<% for (const lotOccupancyField of lotOccupancy.lotOccupancyFields) { %>
<% occupancyTypeFieldIds += "," + lotOccupancyField.occupancyTypeFieldId; %>
<div class="field">
<label class="label" for="lotOccupancy--lotOccupancyFieldValue_<%= lotOccupancyField.occupancyTypeFieldId %>">
<%= lotOccupancyField.occupancyTypeField %>
</label>
<div class="control">
<% if (lotOccupancyField.occupancyTypeFieldValues === "") { %>
<input class="input"
id="lotOccupancy--lotOccupancyFieldValue_<%= lotOccupancyField.occupancyTypeFieldId %>"
name="lotOccupancyFieldValue_<%= lotOccupancyField.occupancyTypeFieldId %>"
type="text"
value="<%= lotOccupancyField.lotOccupancyFieldValue %>"
<% if (lotOccupancyField.pattern !== "") { %>
pattern="<%= lotOccupancyField.pattern %>"
<% } %>
minlength="<%= lotOccupancyField.minimumLength %>"
maxlength="<%= lotOccupancyField.maximumLength %>"
<%= lotOccupancyField.isRequired ? " required" : "" %> />
<% } else { %>
<%
const fieldValues = lotOccupancyField.occupancyTypeFieldValues.split("\n");
let valueFound = false;
%>
<div class="select is-fullwidth">
<select id="lotOccupancy--lotOccupancyFieldValue_<%= lotOccupancyField.occupancyTypeFieldId %>"
name="lotOccupancyFieldValue_<%= lotOccupancyField.occupancyTypeFieldId %>">
<% if (!lotOccupancyField.isRequired || lotOccupancyField.lotOccupancyFieldValue === "") { %>
<option value="">(Not Set)</option>
<% } %>
<% for (const fieldValue of fieldValues) { %>
<%
if (fieldValue === lotOccupancyField.lotOccupancyFieldValue) {
valueFound = true;
}
%>
<option value="<%= fieldValue %>"
<%= (fieldValue === lotOccupancyField.lotOccupancyFieldValue ? " selected" : "") %>>
<%= fieldValue %>
</option>
<% } %>
<% if (!valueFound && lotOccupancyField.lotOccupancyFieldValue !== "") { %>
<option value="<%= lotOccupancyField.lotOccupancyFieldValue %>" selected>
<%= lotOccupancyField.lotOccupancyFieldValue %>
</option>
<% } %>
</select>
</div>
<% } %>
</div>
</div>
<% } %>
<input id="lotOccupancy--occupancyTypeFieldIds" name="occupancyTypeFieldIds" type="hidden" value="<%= occupancyTypeFieldIds.slice(1) %>" />
<% } %>
</div>
</div>
</div>
</div>
<div class="panel-block is-justify-content-right is-hidden-print">
<button class="button is-primary" type="submit">
<span class="icon is-small"><i class="fas fa-save" aria-hidden="true"></i></span>
<span>
<%= (isCreate ? "Create" : "Update") %>
<%= configFunctions.getProperty("aliases.occupancy") %>
Record
</span>
</button>
<% if (!isCreate) { %>
<div class="dropdown is-right ml-2">
<div class="dropdown-trigger">
<button class="button" type="button">
<span>More Options</span>
<span class="icon is-small">
<i class="fas fa-angle-down" aria-hidden="true"></i>
</span>
</button>
</div>
<div class="dropdown-menu">
<div class="dropdown-content">
<a class="dropdown-item" id="button--deleteLotOccupancy" href="#">
<span class="icon is-small"><i class="fas fa-trash has-text-danger" aria-hidden="true"></i></span>
<span>Delete <%= configFunctions.getProperty("aliases.occupancy") %> Record</span>
</a>
</div>
</div>
</div>
<% } %>
</div>
</div>
</form>
<% if (isCreate) { %>
<% } else { %>
<div class="panel mt-5">
<div class="panel-heading">
<div class="level is-mobile">
<div class="level-left">
<div class="level-item">
<h2 class="title is-4">
<%= configFunctions.getProperty("aliases.occupants") %>
</h2>
</div>
</div>
<div class="level-right">
<div class="level-item">
<button class="button is-small is-success is-hidden-print" id="button--addOccupant" type="button">
<span class="icon is-small"><i class="fas fa-plus" aria-hidden="true"></i></span>
<span>Add <%= configFunctions.getProperty("aliases.occupant") %></span>
</button>
</div>
</div>
</div>
</div>
<div class="panel-block is-block" id="container--lotOccupancyOccupants"></div>
</div>
<div class="panel">
<div class="panel-heading">
<div class="level is-mobile">
<div class="level-left">
<div class="level-item">
<h2 class="title is-4">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--lotOccupancyComments"></div>
</div>
<div class="columns">
<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="title is-4">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--lotOccupancyFees"></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="title is-4">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--lotOccupancyTransactions"></div>
</div>
</div>
</div>
<% } %>
<%- include('_footerA'); -%>
<script>
<% if (!isCreate) { %>
exports.occupantCityDefault = "<%= configFunctions.getProperty("settings.lotOccupancy.occupantCityDefault") %>";
exports.occupantProvinceDefault = "<%= configFunctions.getProperty("settings.lotOccupancy.occupantProvinceDefault") %>";
exports.lotOccupantTypes = <%- JSON.stringify(lotOccupantTypes) %>;
exports.lotOccupancyOccupants = <%- JSON.stringify(lotOccupancy.lotOccupancyOccupants) %>;
exports.lotOccupancyComments = <%- JSON.stringify(lotOccupancy.lotOccupancyComments) %>;
exports.lotOccupancyFees = <%- JSON.stringify(lotOccupancy.lotOccupancyFees) %>;
exports.lotOccupancyTransactions = <%- JSON.stringify(lotOccupancy.lotOccupancyTransactions) %>;
<% } %>
<% if (configFunctions.getProperty("settings.lot.lotNamePattern")) { %>
exports.lotNamePattern = /<%= configFunctions.getProperty("settings.lot.lotNamePattern").source %>/;
<% } %>
exports.lotTypes = <%- JSON.stringify(lotTypes) %>;
exports.lotStatuses = <%- JSON.stringify(lotStatuses) %>;
exports.maps = <%- JSON.stringify(maps) %>;
</script>
<script src="<%= urlPrefix %>/javascripts/lotOccupancyEdit.min.js"></script>
<%- include('_footerB'); -%>