DockerERTFF/views/index.ejs

208 lines
11 KiB
Plaintext

<!-- Wappler include head-page="layouts/main" fontawesome_5="cdn" bootstrap5="local" is="dmx-app" id="index" appConnect="local" components="{dmxBootstrap5Navigation:{},dmxAnimateCSS:{},dmxStateManagement:{},dmxDatastore:{},dmxBootstrap5Modal:{},dmxFormatter:{},dmxBootstrap5TableGenerator:{},dmxBootstrap5Toasts:{},dmxBootbox5:{},dmxBrowser:{},dmxBootstrap5Tooltips:{}}" -->
<div is="dmx-browser" id="browser1"></div>
<dmx-datetime id="DateTimeNow" interval="minutes"></dmx-datetime>
<script is="dmx-flow" id="delConfirm" type="text/dmx-flow">{
bootbox.confirm: {
name: "confirmYesNo",
message: "Delete ",
title: "Remove list item",
buttons: {
confirm: {label: "Delete", className: "btn-danger"},
cancel: {label: "Cancel", className: "btn-warning"}
},
then: {
steps: {
serverConnect: {
name: "pageFlowSC1",
outputType: "object",
url: "/api/delRecord",
site: "ERTFastFiller"
}
}
}
}
}</script>
<dmx-serverconnect id="DBInsert" url="/api/insert" noload="true"></dmx-serverconnect>
<div is="dmx-bs5-toasts" id="toasts1"></div>
<dmx-serverconnect id="DBSC1" url="/api/query"></dmx-serverconnect>
<dmx-value id="dataID"></dmx-value>
<dmx-json-datasource id="stateJSON" is="dmx-serverconnect" url="/states.json"></dmx-json-datasource>
<dmx-json-datasource id="trainerJSON" is="dmx-serverconnect" url="/trainer.json"></dmx-json-datasource>
<div class="modal" id="SignatureModal1" is="dmx-bs5-modal" tabindex="-1">
<div class="modal-dialog modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Signature Capture</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body text-center">
<p>Driver must sign for Road Test</p>
<canvas id="signatureCanvas" width="700" height="200" style="border:1px solid #000;" onmousedown="startDrawing(event)" onmouseup="endDrawing()" onmousemove="draw(event)"></canvas>
</div>
<div class="modal-footer">
<button id="btn4" class="btn btn-warning w-25" data-bs-toggle="button" onclick="clearCanvas()">Clear Signature</button>
<button type="button" class="btn btn-danger w-auto" data-bs-dismiss="modal" dmx-bs-tooltip="'Close Signature Panel'" data-bs-trigger="hover" data-bs-placement="top">Close</button>
<button type="button" class="btn btn-success w-auto">Save</button>
</div>
</div>
</div>
</div>
<div class="modal" id="modal1" is="dmx-bs5-modal" tabindex="-1">
<div class="modal-dialog modal-dialog-centered modal-lg" role="document">
<div class="modal-content">
<div class="modal-header">
<h5 class="modal-title">Driver Information</h5>
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
</div>
<div class="modal-body">
<div class="container">
<form is="dmx-serverconnect-form" id="serverconnectform1" method="post" action="/api/insert" dmx-generator="bootstrap5" dmx-form-type="horizontal" dmx-on:done="modal1.hide();DBSC1.load({})" dmx-on:submit="">
<div class="form-group mb-3 row">
<label for="inp_db_fullName" class="col-sm-2 col-form-label">full name</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="inp_db_fullName" name="db_fullName" aria-describedby="inp_db_fullName_help" placeholder="Enter Db full name">
</div>
</div>
<div class="form-group mb-3 row">
<label for="inp_db_licenseNumber" class="col-sm-2 col-form-label">license number</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="inp_db_licenseNumber" name="db_licenseNumber" aria-describedby="inp_db_licenseNumber_help" placeholder="Enter Db license number">
</div>
</div>
<div class="form-group mb-3 row">
<label for="db_stateIssue" class="col-sm-2 col-form-label">state issue</label>
<div class="col-sm-4">
<select id="db_stateIssue" class="form-select" dmx-bind:options="stateJSON.data.states" optiontext="name" optionvalue="abbreviation" name="db_stateIssue" dmx-bind:value="selectedValue">
</select>
</div>
<div class="col-6">
<small id="bs5-form-group-help1" class="form-text text-muted">Your great help text.</small>
</div>
</div>
<div class="form-group mb-3 row">
<label for="inp_db_employeeID" class="col-sm-2 col-form-label">Trainer</label>
<div class="col-sm-3">
<input type="number" class="form-control" id="inp_db_employeeID" name="db_employeeID" aria-describedby="inp_db_employeeID_help" placeholder="Enter Db employee" dmx-bind:value="select1.selectedValue" readonly="true">
</div>
<div class="col-6 offset-1">
<select id="select1" class="form-select" dmx-bind:options="trainerJSON.data.Trainer" name="db_trainerID" optiontext="Name" optionvalue="ID" dmx-bind:value="selectedValue">
</select>
</div>
</div>
<div class="form-group mb-3 row">
<label for="inp_owner" class="col-sm-2 col-form-label">Date</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="inp_owner" name="owner" aria-describedby="inp_owner_help" placeholder="Enter Owner" dmx-bind:value="DateTimeNow.datetime.formatDate('MM-dd-yyyy')" readonly="true">
</div>
</div>
<div class="form-group mb-3 row">
<div class="col-sm-2">&nbsp;</div>
<div class="col-sm-10">
<button type="submit" class="btn btn-success" dmx-bind:disabled="state.executing">Save <span class="spinner-border spinner-border-sm" role="status" dmx-show="state.executing"></span></button>
<button id="xbtn4" class="btn btn-secondary" data-bs-dismiss="modal">Cancel</button>
</div>
</div>
</form>
</div>
</div>
<div class="modal-footer">{{DateTimeNow.datetime.formatDate('MM-dd-yyyy')}}</div>
</div>
</div>
</div>
<div class="container">
<h1 class="text-center">Lets Begin.&nbsp;What is your Role?</h1>
</div>
<div class="container">
<div class="row">
<div class="text-center col-4 offset-1" id="cLeft">
<button id="btn1" class="btn text-center lh-lg btn-success" dmx-on:click="modal1.show()">Delivery Associate</button>
<button id="btn5" class="btn btn-warning" data-bs-target="undefined" dmx-on:click="browser1.goto('/signature',true,'Get Signature')">Signature</button>
</div>
<div class="text-center offset-2 col-3" id="cRight">
<button id="btn2" class="btn lh-lg btn-warning" data-bs-toggle="modal" data-bs-target="#SignatureModal1">Driver Trainers</button>
</div>
</div>
<div class="row" dmx-hide="datastore1.data.isEmpty()">
</div>
<div class="row" id="daForm">
<div class="col">
<form is="dmx-serverconnect-form" id="serverconnectform2" method="post" action="/api/insert" dmx-generator="bootstrap5" dmx-form-type="horizontal">
<div class="form-group mb-3 row">
<div class="col-sm-7">
<input type="text" class="form-control" id="inp_db_fullName" name="db_fullName" aria-describedby="inp_db_fullName_help" placeholder="Enter Db full name">
</div>
</div>
<div class="form-group mb-3 row">
<div class="col-sm-7">
<input type="text" class="form-control" id="inp_db_licenseNumber" name="db_licenseNumber" aria-describedby="inp_db_licenseNumber_help" placeholder="Enter Db license number">
</div>
</div>
<div class="form-group mb-3 row">
<div class="col-sm-7">
<input type="number" class="form-control" id="inp_db_employeeID" name="db_employeeID" aria-describedby="inp_db_employeeID_help" placeholder="Enter Db employee">
</div>
</div>
<div class="form-group mb-3 row">
<div class="col-sm-6">
<input type="text" class="form-control" id="inp_owner" name="owner" aria-describedby="inp_owner_help" placeholder="Enter Owner">
</div>
</div>
<div class="form-group mb-3 row">
<div class="col-sm-7">
<input type="text" class="form-control" id="inp_db_stateIssue" name="db_stateIssue" aria-describedby="inp_db_stateIssue_help" placeholder="Enter Db state issue">
</div>
</div>
</form>
</div>
<div class="col">
<h1>Display Area.</h1>
</div>
</div>
<div class="row" id="eSignature">
<p>This area will display the signature.</p>
</div>
<table class="table">
<thead>
<tr>
<th>DELETE</th>
<th>DA Name</th>
<th>license number</th>
<th>state issue</th>
<th>Trainer #</th>
<th>Date</th>
</tr>
</thead>
<tbody is="dmx-repeat" dmx-generator="bs5table" dmx-bind:repeat="DBSC1.data.query" id="tableRepeat1">
<tr>
<td dmx-bs-tooltip="'Click will delete without confirmation'" data-bs-trigger="hover" data-bs-placement="left">
<form action="/api/delRecord" method="post" dmx-on:success="DBSC1.load({})" is="dmx-serverconnect-form" id="serverconnectform3">
<input id="deleteid" name="deleteid" type="hidden" class="form-control" dmx-bind:value="ID">
<button id="btn3" class="btn btn-sm btn-outline-danger" dmx-text="ID" type="submit" dmx-on:mouseover="">Button</button>
</form>
</td>
<td dmx-text="db_fullName"></td>
<td dmx-text="db_licenseNumber"></td>
<td dmx-text="db_stateIssue"></td>
<td dmx-text="db_employeeID"></td>
<td dmx-text="owner"></td>
</tr>
</tbody>
</table>
<div class="row">
<h3>{{DBSC1.data.query.count()+" Training records"}}</h3>
</div>
</div>
<!--
<script src="/PDF/pdfLibSignature.js"></script>
-->
<meta name="ac:route" content="/">