initial upload
This commit is contained in:
parent
ac114da487
commit
7c1cfdff51
63 changed files with 6883 additions and 0 deletions
213
ui/printer.njk
Normal file
213
ui/printer.njk
Normal file
|
|
@ -0,0 +1,213 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="de">
|
||||
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>Label Print</title>
|
||||
<link rel="icon" type="image/x-icon" href="/img/Favicon.ico">
|
||||
<link rel="stylesheet" href="/css/bootstrap.min.css">
|
||||
<link rel="stylesheet" href="/css/tabler-icons.min.css">
|
||||
<script src="/js/jquery-3.6.4.min.js"></script>
|
||||
<style>
|
||||
body,
|
||||
html {
|
||||
width: 100svw;
|
||||
height: 100svh;
|
||||
|
||||
user-select: none;
|
||||
background: var(--bs-body-bg);
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
|
||||
<body>
|
||||
|
||||
<header>
|
||||
<div class="navbar navbar-dark bg-dark shadow-sm">
|
||||
<div class="container">
|
||||
<div class="navbar-brand d-flex align-items-center">
|
||||
<img src="/img/AO-Logo.svg" style="height: 2rem; margin-right: 1rem;">
|
||||
<strong>Label Print</strong>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</header>
|
||||
|
||||
<main class="py-5">
|
||||
<!-- Settings -->
|
||||
<div class="py-2">
|
||||
<div class="container" style="max-width: 60rem">
|
||||
<div class="card shadow m-4">
|
||||
<div class="card-header py-3">
|
||||
<p class="text-primary m-0 fw-bold">Settings</p>
|
||||
</div>
|
||||
<div class="card-body px-2 py-3 d-flex flex-row">
|
||||
<div class="col-6 px-2">
|
||||
<label for="selectLabel" class="form-label">Label</label>
|
||||
<select class="form-select" id="selectLabel">
|
||||
<option value="1">One</option>
|
||||
<option value="2">Two</option>
|
||||
<option value="3">Three</option>
|
||||
</select>
|
||||
</div>
|
||||
<div class="col-6 px-2">
|
||||
<label for="selectPrinter" class="form-label">Printer</label>
|
||||
<select class="form-select" id="selectPrinter">
|
||||
<option value="1">One</option>
|
||||
<option value="2">Two</option>
|
||||
<option value="3">Three</option>
|
||||
</select>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<!-- Printer List -->
|
||||
<div class="py-2">
|
||||
<div class="container" style="max-width: 60rem">
|
||||
<div class="card shadow m-4">
|
||||
<div class="card-header py-3">
|
||||
<p class="text-primary m-0 fw-bold">Printer</p>
|
||||
</div>
|
||||
<div class="card-body p-0">
|
||||
<div class="table-responsive table mt-2" id="dataTable" role="grid"
|
||||
aria-describedby="dataTable_info">
|
||||
<table class="table my-0" id="dataTable">
|
||||
<thead>
|
||||
<tr>
|
||||
<th class="col-9 ps-5">Name</th>
|
||||
<th class="pe-5 py-2 d-flex justify-content-end">
|
||||
<a class="btn btn-outline-primary" data-bs-toggle="modal"
|
||||
@click="CreatePrinter()">
|
||||
<i class="ti ti-plus"></i>
|
||||
</a>
|
||||
</th>
|
||||
</tr>
|
||||
</thead>
|
||||
<tfoot>
|
||||
<tr v-for="Printer in PrinterList">
|
||||
<td class="ps-5 py-2">
|
||||
{{ Printer.name }}
|
||||
</td>
|
||||
<td class="pe-5 py-2 d-flex justify-content-end" style="gap: 0.6rem;">
|
||||
<a class="btn btn-outline-primary" @click="" data-bs-toggle="tooltip"
|
||||
title="Select Printer">
|
||||
<i class="ti ti-printer"></i>
|
||||
</a>
|
||||
<a class="btn btn-outline-primary" @click="EditPrinter(Printer.uid)"
|
||||
data-bs-toggle="tooltip" title="Edit Printer">
|
||||
<i class="ti ti-settings"></i>
|
||||
</a>
|
||||
</td>
|
||||
</tr>
|
||||
</tfoot>
|
||||
</table>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Label Modal -->
|
||||
<div class="modal fade" id="labelModal" tabindex="-1" data-bs-backdrop="static" aria-hidden="true">
|
||||
<div class="modal-dialog modal-dialog-centered">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h1 class="modal-title fs-5" id="labelModalLabel" v-if="LabelEditor.uid == null">Create Label
|
||||
</h1>
|
||||
<h1 class="modal-title fs-5" id="labelModalLabel" v-if="LabelEditor.uid != null">Label {{
|
||||
LabelEditor.uid }}</h1>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="modal-body mx-2">
|
||||
<div class="mb-3">
|
||||
<label for="labelNameInput" class="form-label">Label Name</label>
|
||||
<input type="text" class="form-control" id="labelNameInput" placeholder="Useful Label 1"
|
||||
v-model="LabelEditor.name">
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-6 mb-3">
|
||||
<label for="labelWidth" class="form-label">Label Width</label>
|
||||
<input type="text" class="form-control" id="labelWidth" placeholder="10.0.0.1"
|
||||
v-model="LabelEditor.size.width">
|
||||
</div>
|
||||
<div class="col-6 mb-3">
|
||||
<label for="labelHeight" class="form-label">Label Height</label>
|
||||
<input type="text" class="form-control" id="labelHeight" placeholder="9100"
|
||||
v-model="LabelEditor.size.height">
|
||||
</div>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="templateInput" class="form-label">Template</label>
|
||||
<textarea class="form-control" id="templateInput" rows="10"
|
||||
v-model="LabelEditor.template"></textarea>
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<a class="btn btn-outline-danger" @click="DeleteLabel()" title="Delete Label">
|
||||
<i class="me-2 ti ti-trash"></i>Delete
|
||||
</a>
|
||||
<a class="btn btn-outline-primary" @click="SaveLabel()" title="Save Label">
|
||||
<i class="me-2 ti ti-device-floppy"></i>Save
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Printer Modal -->
|
||||
<div class="modal fade" id="printerModal" tabindex="-1" data-bs-backdrop="static" aria-hidden="true">
|
||||
<div class="modal-dialog modal-dialog-centered">
|
||||
<div class="modal-content">
|
||||
<div class="modal-header">
|
||||
<h1 class="modal-title fs-5" id="labelModalLabel" v-if="PrinterEditor.uid == null">Create
|
||||
Printer</h1>
|
||||
<h1 class="modal-title fs-5" id="labelModalLabel" v-if="PrinterEditor.uid != null">Printer {{
|
||||
PrinterEditor.uid }}</h1>
|
||||
<button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
|
||||
</div>
|
||||
<div class="modal-body mx-2">
|
||||
<div class="mb-3">
|
||||
<label for="printerNameInput" class="form-label">Printer Name</label>
|
||||
<input type="text" class="form-control" id="printerNameInput" placeholder="Useful Printer 1"
|
||||
v-model="PrinterEditor.name">
|
||||
</div>
|
||||
<div class="row">
|
||||
<div class="col-8 mb-3">
|
||||
<label for="printerDPIInput" class="form-label">Printer IP-Address</label>
|
||||
<input type="text" class="form-control" id="printerDPIInput" placeholder="10.0.0.1"
|
||||
v-model="PrinterEditor.socketaddr">
|
||||
</div>
|
||||
<div class="col-4 mb-3">
|
||||
<label for="printerDPIInput" class="form-label">Printer Port</label>
|
||||
<input type="text" class="form-control" id="printerDPIInput" placeholder="9100"
|
||||
v-model="PrinterEditor.socketport">
|
||||
</div>
|
||||
</div>
|
||||
<div class="mb-3">
|
||||
<label for="printerDPIInput" class="form-label">Printer DPI</label>
|
||||
<input type="text" class="form-control" id="printerDPIInput" placeholder="203"
|
||||
v-model="PrinterEditor.dpi">
|
||||
</div>
|
||||
</div>
|
||||
<div class="modal-footer">
|
||||
<a class="btn btn-outline-danger" @click="DeletePrinter()" title="Delete Printer">
|
||||
<i class="me-2 ti ti-trash"></i>Delete
|
||||
</a>
|
||||
<a class="btn btn-outline-primary" @click="SavePrinter()" title="Save Printer">
|
||||
<i class="me-2 ti ti-device-floppy"></i>Save
|
||||
</a>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
</main>
|
||||
|
||||
|
||||
<script src="/js/bootstrap.bundle.min.js"></script>
|
||||
<script src="/js/vue.global.prod.js"></script>
|
||||
<script src="/settings.app.js"></script>
|
||||
</body>
|
||||
|
||||
</html>
|
||||
Loading…
Add table
Add a link
Reference in a new issue