360 lines
18 KiB
Plaintext
360 lines
18 KiB
Plaintext
<%- include('_header'); -%>
|
|
|
|
<nav class="breadcrumb">
|
|
<ul>
|
|
<li><a href="<%= urlPrefix %>/dashboard">Home</a></li>
|
|
<li>
|
|
<a href="<%= urlPrefix %>/workOrders">
|
|
<span class="icon is-small"><i class="fas fa-hard-hat" aria-hidden="true"></i></span>
|
|
<span>Work Orders</span>
|
|
</a>
|
|
</li>
|
|
<li class="is-active">
|
|
<a href="#" aria-current="page">
|
|
Work Order #<%= workOrder.workOrderNumber || "(No Number)" %>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</nav>
|
|
|
|
<h1 class="title is-1">
|
|
Work Order
|
|
#<%= workOrder.workOrderNumber || "(No Number)" %>
|
|
</h1>
|
|
|
|
<div class="level is-fixed-bottom is-mobile has-background-white has-shadow is-hidden-print">
|
|
<div class="level-left">
|
|
<span class="level-item has-text-weight-bold">
|
|
Work Order
|
|
#<%= workOrder.workOrderNumber || "(No Number)" %>
|
|
</span>
|
|
</div>
|
|
<div class="level-right">
|
|
<% if (configFunctions.getProperty("settings.workOrders.prints").length > 0) { %>
|
|
<% if (configFunctions.getProperty("settings.workOrders.prints").length === 1) { %>
|
|
<div class="level-item">
|
|
<a href="<%= urlPrefix %>/print/<%= configFunctions.getProperty("settings.workOrders.prints")[0] %>/?workOrderId=<%= workOrder.workOrderId %>" 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>
|
|
</button>
|
|
</div>
|
|
<div class="dropdown-menu">
|
|
<div class="dropdown-content">
|
|
<% for (const printName of configFunctions.getProperty("settings.workOrders.prints")) { %>
|
|
<% const printConfig = printFunctions.getPrintConfig(printName); %>
|
|
<% if (printConfig) { %>
|
|
<a class="dropdown-item" href="<%= urlPrefix %>/print/<%= printName %>/?workOrderId=<%= workOrder.workOrderId %>" 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 (user.userProperties.canUpdate) { %>
|
|
<div class="level-item">
|
|
<% if (workOrder.workOrderCloseDate) { %>
|
|
<button class="button is-warning" id="button--reopenWorkOrder" data-work-order-id="<%= workOrder.workOrderId %>" type="button">
|
|
Reopen Work Order
|
|
</button>
|
|
<% } else { %>
|
|
<a class="button is-primary"
|
|
href="<%= urlPrefix %>/workOrders/<%= workOrder.workOrderId %>/edit"
|
|
accesskey="e">
|
|
<span class="icon"><i class="fas fa-pencil-alt" aria-hidden="true"></i></span>
|
|
<span>Switch to Edit Mode</span>
|
|
</a>
|
|
<% } %>
|
|
</div>
|
|
<% } %>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="columns is-desktop">
|
|
<div class="column">
|
|
<div class="panel">
|
|
<div class="panel-block is-block">
|
|
<div class="columns">
|
|
<div class="column">
|
|
<p class="mb-2">
|
|
<strong>Work Order Type</strong><br />
|
|
<%= workOrder.workOrderType %>
|
|
</p>
|
|
<p>
|
|
<strong>Description</strong><br />
|
|
<% if (workOrder.workOrderDescription) { %>
|
|
<%= workOrder.workOrderDescription %>
|
|
<% } else { %>
|
|
<span class="has-text-grey">(No Description)</span>
|
|
<% } %>
|
|
</p>
|
|
</div>
|
|
<div class="column">
|
|
<p class="mb-2">
|
|
<strong><%= configFunctions.getProperty("aliases.workOrderOpenDate") %></strong><br />
|
|
<%= workOrder.workOrderOpenDateString %>
|
|
</p>
|
|
<p>
|
|
<strong><%= configFunctions.getProperty("aliases.workOrderCloseDate") %></strong><br />
|
|
<% if (workOrder.workOrderCloseDate) { %>
|
|
<%= workOrder.workOrderCloseDateString %>
|
|
<% } else { %>
|
|
<span class="has-text-grey">(No <%= configFunctions.getProperty("aliases.workOrderCloseDate") %>)</span>
|
|
<% } %>
|
|
</p>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="panel">
|
|
<h2 class="panel-heading">Related <%= configFunctions.getProperty("aliases.lots") %></h2>
|
|
<div class="panel-block is-block">
|
|
<%
|
|
const tabToSelect = (workOrder.workOrderLotOccupancies.length > 0 || workOrder.workOrderLots.length === 0 ? "lotOccupancies" : "lots");
|
|
%>
|
|
<div class="tabs is-boxed">
|
|
<ul>
|
|
<li class="<%= (tabToSelect === "lotOccupancies" ? "is-active" : "") %>">
|
|
<a href="#relatedTab--lotOccupancies">
|
|
<span><%= configFunctions.getProperty("aliases.occupancies") %></span>
|
|
<span class="ml-2 tag"><%= workOrder.workOrderLotOccupancies.length %></span>
|
|
</a>
|
|
</li>
|
|
<li class="<%= (tabToSelect === "lots" ? "is-active" : "") %>">
|
|
<a href="#relatedTab--lots">
|
|
<span><%= configFunctions.getProperty("aliases.lots") %></span>
|
|
<span class="ml-2 tag"><%= workOrder.workOrderLots.length %></span>
|
|
</a>
|
|
</li>
|
|
</ul>
|
|
</div>
|
|
<div class="tab-container">
|
|
<div class="<%= (tabToSelect === "lotOccupancies" ? "" : "is-hidden") %>" id="relatedTab--lotOccupancies">
|
|
<% if (workOrder.workOrderLotOccupancies.length === 0) { %>
|
|
<div class="message is-info">
|
|
<p class="message-body">
|
|
There are no
|
|
<%= configFunctions.getProperty("aliases.lot").toLowerCase() %>
|
|
<%= configFunctions.getProperty("aliases.occupancy").toLowerCase() %>
|
|
records associated with this work order.
|
|
</p>
|
|
</div>
|
|
<% } else { %>
|
|
<% const currentDate = dateTimeFunctions.dateToInteger(new Date()); %>
|
|
<table class="table is-fullwidth is-striped is-hoverable">
|
|
<thead>
|
|
<tr>
|
|
<th class="has-width-1"></th>
|
|
<th><%= configFunctions.getProperty("aliases.occupancy") %> Type</th>
|
|
<th><%= configFunctions.getProperty("aliases.lot") %></th>
|
|
<th><%= configFunctions.getProperty("aliases.occupancyStartDate") %></th>
|
|
<th>End Date</th>
|
|
<th><%= configFunctions.getProperty("aliases.occupants") %></th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<% for (const lotOccupancy of workOrder.workOrderLotOccupancies) { %>
|
|
<% const isActive = !(lotOccupancy.occupancyEndDate && lotOccupancy.occupancyEndDate < currentDate); %>
|
|
<tr>
|
|
<td class="has-text-centered">
|
|
<% if (isActive) { %>
|
|
<i class="fas fa-play" title="Current <%= configFunctions.getProperty("aliases.occupancy") %>"></i>
|
|
<% } else { %>
|
|
<i class="fas fa-stop" title="Previous <%= configFunctions.getProperty("aliases.occupancy") %>"></i>
|
|
<% } %>
|
|
</td>
|
|
<td>
|
|
<a class="has-text-weight-bold"
|
|
href="<%= urlPrefix %>/lotOccupancies/<%= lotOccupancy.lotOccupancyId %>">
|
|
<%= lotOccupancy.occupancyType %>
|
|
</a>
|
|
</td>
|
|
<td>
|
|
<% if (lotOccupancy.lotId) { %>
|
|
<%= lotOccupancy.lotName %>
|
|
<% } else { %>
|
|
<span class="has-text-grey">(No <%= configFunctions.getProperty("aliases.lot") %>)</span>
|
|
<% } %>
|
|
</td>
|
|
<td><%= lotOccupancy.occupancyStartDateString %></td>
|
|
<td>
|
|
<% if (lotOccupancy.occupancyEndDate) { %>
|
|
<%= lotOccupancy.occupancyEndDateString %>
|
|
<% } else { %>
|
|
<span class="has-text-grey">(No End Date)</span>
|
|
<% } %>
|
|
</td>
|
|
<td>
|
|
<% if (lotOccupancy.lotOccupancyOccupants.length === 0) { %>
|
|
<span class="has-text-grey">(No <%= configFunctions.getProperty("aliases.occupants") %>)</span>
|
|
<% } else { %>
|
|
<% for (const occupant of lotOccupancy.lotOccupancyOccupants) { %>
|
|
<span class="has-tooltip-left" data-tooltip="<%= occupant.lotOccupantType %>">
|
|
<i class="fas fa-fw fa-<%= occupant.fontAwesomeIconClass || 'user' %>" aria-hidden="true"></i>
|
|
<%= occupant.occupantName %>
|
|
<%= occupant.occupantFamilyName %>
|
|
</span><br />
|
|
<% } %>
|
|
<% } %>
|
|
</td>
|
|
</tr>
|
|
<% } %>
|
|
</tbody>
|
|
</table>
|
|
<% } %>
|
|
</div>
|
|
<div class="<%= (tabToSelect === "lots" ? "" : "is-hidden") %>" id="relatedTab--lots">
|
|
<% if (workOrder.workOrderLots.length === 0) { %>
|
|
<div class="message is-info">
|
|
<p class="message-body">
|
|
There are no
|
|
<%= configFunctions.getProperty("aliases.lots").toLowerCase() %>
|
|
records associated with this work order.
|
|
</p>
|
|
</div>
|
|
<% } else { %>
|
|
<table class="table is-fullwidth is-striped is-hoverable">
|
|
<thead>
|
|
<tr>
|
|
<th><%= configFunctions.getProperty("aliases.lot") %></th>
|
|
<th><%= configFunctions.getProperty("aliases.map") %></th>
|
|
<th><%= configFunctions.getProperty("aliases.lot") %> Type</th>
|
|
<th>Status</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<% for (const lot of workOrder.workOrderLots) { %>
|
|
<tr>
|
|
<td>
|
|
<a class="has-text-weight-bold" href="<%= urlPrefix %>/lots/<%= lot.lotId %>"><%= lot.lotName %></a>
|
|
</td>
|
|
<td><%= lot.mapName %></td>
|
|
<td><%= lot.lotType %></td>
|
|
<td><%= lot.lotStatus %></td>
|
|
</tr>
|
|
<% } %>
|
|
</tbody>
|
|
</table>
|
|
<% } %>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<% if (workOrder.workOrderComments.length > 0) { %>
|
|
<div class="panel">
|
|
<h2 class="panel-heading">Work Order Comments</h2>
|
|
<div class="panel-block is-block">
|
|
<table class="table is-fullwidth is-striped is-hoverable">
|
|
<thead>
|
|
<tr>
|
|
<th>Commentor</th>
|
|
<th>Comment Date</th>
|
|
<th>Comment</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody>
|
|
<% for (const workOrderComment of workOrder.workOrderComments) { %>
|
|
<tr>
|
|
<td><%= workOrderComment.recordCreate_userName %></td>
|
|
<td>
|
|
<%= workOrderComment.workOrderCommentDateString %>
|
|
<%= (workOrderComment.workOrderCommentTime === 0 ? "" : workOrderComment.workOrderCommentTimeString) %>
|
|
</td>
|
|
<td><%= workOrderComment.workOrderComment %></td>
|
|
</tr>
|
|
<% } %>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
</div>
|
|
<% } %>
|
|
</div>
|
|
<% if (workOrder.workOrderMilestones.length > 0) { %>
|
|
<div class="column is-4-desktop">
|
|
<div class="panel">
|
|
<div class="panel-heading">
|
|
<div class="level is-mobile">
|
|
<div class="level-left">
|
|
<div class="level-item">
|
|
<h2 class="title is-5 has-text-weight-bold">Milestones</h2>
|
|
</div>
|
|
</div>
|
|
<div class="level-right">
|
|
<div class="level-item">
|
|
<div class="dropdown is-right has-text-weight-normal">
|
|
<div class="dropdown-trigger">
|
|
<button class="button is-small has-tooltip-left" type="button" data-tooltip="Milestone Options" aria-label="Options">
|
|
<i class="fas fa-ellipsis-v" aria-hidden="true"></i>
|
|
</button>
|
|
</div>
|
|
<div class="dropdown-menu">
|
|
<div class="dropdown-content">
|
|
<a class="dropdown-item" href="<%= urlPrefix %>/api/<%= user.userProperties.apiKey %>/milestoneICS/?workOrderId=<%= workOrder.workOrderId %>">
|
|
<span class="icon is-small"><i class="fas fa-calendar" aria-hidden="true"></i></span>
|
|
<span>Download iCalendar</span>
|
|
</a>
|
|
<a class="dropdown-item" href="<%= urlPrefix %>/reports/workOrderMilestones-byWorkOrderId/?workOrderId=<%= workOrder.workOrderId %>" target="_blank" download>
|
|
<span class="icon is-small"><i class="fas fa-download" aria-hidden="true"></i></span>
|
|
<span>Export as CSV</span>
|
|
</a>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<% for (const milestone of workOrder.workOrderMilestones) { %>
|
|
<div class="panel-block is-block">
|
|
<div class="columns is-mobile">
|
|
<div class="column is-narrow">
|
|
<% if (milestone.workOrderMilestoneCompletionDate) { %>
|
|
<span class="icon is-small" data-tooltip="Completed <%= milestone.workOrderMilestoneCompletionDateString %>">
|
|
<i class="fas fa-check" aria-label="Completed <%= milestone.workOrderMilestoneCompletionDateString %>"></i>
|
|
</span>
|
|
<% } else { %>
|
|
<span class="icon is-small">
|
|
<i class="far fa-square has-text-grey" aria-label="Incomplete"></i>
|
|
</span>
|
|
<% } %>
|
|
</div>
|
|
<div class="column">
|
|
<% if (milestone.workOrderMilestoneTypeId) { %>
|
|
<strong><%= milestone.workOrderMilestoneType %></strong><br />
|
|
<% } %>
|
|
<%= milestone.workOrderMilestoneDateString %>
|
|
<% if (milestone.workOrderMilestoneTime !== 0) { %>
|
|
<%= milestone.workOrderMilestoneTimeString %>
|
|
<% } %>
|
|
<br />
|
|
<span class="is-size-7"><%= milestone.workOrderMilestoneDescription %></span>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
<% } %>
|
|
</div>
|
|
</div>
|
|
<% } %>
|
|
</div>
|
|
|
|
<%- include('_footerA'); -%>
|
|
|
|
<script src="<%= urlPrefix %>/javascripts/workOrderView.min.js"></script>
|
|
|
|
<%- include('_footerB'); -%> |