108 lines
5.6 KiB
Plaintext
108 lines
5.6 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:{}}" -->
|
|
<dmx-serverconnect id="DBSC1" url="/api/dbQuery"></dmx-serverconnect>
|
|
<script is="dmx-flow" id="DSflow1" type="text/dmx-flow">{
|
|
confirm: {
|
|
name: "DSConfirm",
|
|
outputType: "boolean",
|
|
message: "{{datastore1.data[0].da_fullName}}",
|
|
then: {
|
|
steps: {
|
|
toast.showSimple: {message: "This will remove record"}
|
|
}
|
|
}
|
|
}
|
|
}</script>
|
|
<dmx-value id="dataID"></dmx-value>
|
|
<dmx-json-datasource id="stateJSON" is="dmx-serverconnect" url="/states.json"></dmx-json-datasource>
|
|
<dmx-datastore id="datastore1"></dmx-datastore>
|
|
<div class="modal" id="modal1" is="dmx-bs5-modal" tabindex="-1">
|
|
<div class="modal-dialog" 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 id="form1">
|
|
<div class="form-group mb-3 row">
|
|
<label for="input1" class="col-sm-2 col-form-label">Full Name</label>
|
|
<div class="col-sm-10">
|
|
<input type="text" class="form-control" id="input1" name="input1" aria-describedby="input1_help">
|
|
<small id="input1_help" class="form-text text-muted">*Enter your full name</small>
|
|
</div>
|
|
</div>
|
|
<div class="form-group mb-3 row">
|
|
<label for="input2" class="col-sm-2 col-form-label">License no.</label>
|
|
<div class="col-sm-10">
|
|
<input type="text" class="form-control" id="input2" name="input2" aria-describedby="input1_help">
|
|
<small id="input1_help1" class="form-text text-muted">*Enter your driver license number</small>
|
|
</div>
|
|
</div>
|
|
<div class="form-group mb-3 row">
|
|
<label for="input3" class="col-sm-2 col-form-label">License State</label>
|
|
<div class="col">
|
|
<div class="form-group mb-3">
|
|
<label for="input3" class="form-label">Select</label>
|
|
<select id="input3" class="form-select" dmx-bind:options="stateJSON.data.states" optiontext="name" optionvalue="abbreviation">
|
|
<option value="1">Option One</option>
|
|
<option value="2">Option Two</option>
|
|
<option value="3">Option Three</option>
|
|
</select>
|
|
<small id="select1Help" class="form-text text-muted">Pick the state your License is issued from</small>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</form>
|
|
</div>
|
|
<p>Today Date </p>
|
|
</div>
|
|
<div class="modal-footer">
|
|
<button type="button" class="btn btn-secondary" data-bs-dismiss="modal">Close</button>
|
|
<button type="button" class="btn btn-primary" dmx-on:click="datastore1.insert({da_fullName: form1.input1.value, da_driverLicense: form1.input2.value, da_driverLicenseState: form1.input3.selectedValue})">Save changes</button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
|
|
<div class="container">
|
|
<h1 class="text-center">Lets Begin. 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>
|
|
</div>
|
|
<div class="text-center offset-2 col-3" id="cRight">
|
|
<button id="btn2" class="btn lh-lg btn-warning">Driver Trainers</button>
|
|
</div>
|
|
</div>
|
|
<div class="row" dmx-hide="datastore1.data.isEmpty()">
|
|
<table class="table table-striped table-sm">
|
|
<thead>
|
|
<tr>
|
|
<th>$id</th>
|
|
<th>Da full name</th>
|
|
<th>Da driver license</th>
|
|
<th dmx-on:click="datastore1.clear()">Da driver license state</th>
|
|
</tr>
|
|
</thead>
|
|
<tbody is="dmx-repeat" dmx-generator="bs5table" dmx-bind:repeat="datastore1.data" id="tableRepeat1">
|
|
<tr>
|
|
<td>
|
|
<button id="btn3" class="btn btn-sm btn-warning" dmx-bind:value="$id" dmx-on:click="datastore1.delete({$id: $id})" data-bs-toggle="button">{{$id}}</button>
|
|
|
|
</td>
|
|
<td dmx-text="da_fullName"></td>
|
|
<td dmx-text="da_driverLicense"></td>
|
|
<td dmx-text="da_driverLicenseState"></td>
|
|
</tr>
|
|
</tbody>
|
|
</table>
|
|
</div>
|
|
<div class="row">
|
|
<h3 dmx-show="datastore1.data.isEmpty()">No Records</h3>
|
|
</div>
|
|
</div>
|
|
|
|
<meta name="ac:route" content="/"> |