interface updated
This commit is contained in:
@@ -3,40 +3,48 @@
|
||||
{% block title %}Create Template{% endblock %}
|
||||
|
||||
{% block content %}
|
||||
<div class="card-container" style="display: flex; gap: 20px;">
|
||||
<!-- Left Column -->
|
||||
<div class="left-column" style="flex: 1; display: flex; flex-direction: column; gap: 20px;">
|
||||
<!-- Card 1: Dimensions -->
|
||||
<div class="left-column" style="flex: 1; max-width: 33%;">
|
||||
<div class="dashboard-card">
|
||||
<h3>Dimensions</h3>
|
||||
<p>Set the dimensions of the label template:</p>
|
||||
<form id="dimensions-form">
|
||||
<label for="label-width">Width (mm):</label>
|
||||
<input type="number" id="label-width" name="label_width" required>
|
||||
|
||||
<label for="label-height">Height (mm):</label>
|
||||
<input type="number" id="label-height" name="label_height" required>
|
||||
|
||||
<button type="button" id="set-dimensions-btn" class="btn">Set Dimensions</button>
|
||||
</form>
|
||||
</div>
|
||||
|
||||
<!-- Card 2: Get Database Headers -->
|
||||
<div class="dashboard-card">
|
||||
<h3>Get Database Headers</h3>
|
||||
<p>Retrieve column names from a selected database table:</p>
|
||||
<button type="button" id="get-tables-btn" class="btn">Get Database Tables</button>
|
||||
<div id="tables-container" style="margin-top: 10px;">
|
||||
<!-- Tables will be dynamically populated here -->
|
||||
<h3>Template Settings</h3>
|
||||
<p>Set the dimensions and retrieve database headers for the label template:</p>
|
||||
|
||||
<!-- Dimensions Section -->
|
||||
<div>
|
||||
<h4>Dimensions</h4>
|
||||
<form id="dimensions-form">
|
||||
<div style="margin-bottom: 10px;">
|
||||
<label for="label-width">Width (mm):</label>
|
||||
<input type="number" id="label-width" name="label_width" required>
|
||||
</div>
|
||||
<div style="margin-bottom: 10px;">
|
||||
<label for="label-height">Height (mm):</label>
|
||||
<input type="number" id="label-height" name="label_height" required>
|
||||
</div>
|
||||
<button type="button" id="set-dimensions-btn" class="btn">Set Dimensions</button>
|
||||
</form>
|
||||
</div>
|
||||
<div id="columns-container" style="margin-top: 10px;">
|
||||
<!-- Columns will be dynamically populated here -->
|
||||
|
||||
<hr style="margin: 20px 0;">
|
||||
|
||||
<!-- Get Database Headers Section -->
|
||||
<div>
|
||||
<h4>Get Database Headers</h4>
|
||||
<p>Retrieve column names from a selected database table:</p>
|
||||
<button type="button" id="get-tables-btn" class="btn">Get Database Tables</button>
|
||||
<div id="tables-container" style="margin-top: 10px;">
|
||||
<!-- Tables will be dynamically populated here -->
|
||||
</div>
|
||||
<div id="columns-container" style="margin-top: 10px;">
|
||||
<!-- Columns will be dynamically populated here -->
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<!-- Right Column -->
|
||||
<div class="right-column" style="flex: 1;">
|
||||
<!-- Card 3: Interactive Label Preview -->
|
||||
<div class="right-column" style="flex: 2;">
|
||||
<div class="dashboard-card">
|
||||
<h3>Interactive Label Preview</h3>
|
||||
<p>Preview the label with selected headers:</p>
|
||||
|
||||
Reference in New Issue
Block a user