Added Pages

py_app/app/templates/create_template.html

@@ -0,0 +1,50 @@
+{% extends "base.html" %}
+
+{% block title %}Create Template{% endblock %}
+
+{% block content %}
+    <!-- Left Column -->
+    <div class="left-column" style="flex: 1; display: flex; flex-direction: column; gap: 20px;">
+        <!-- Card 1: Dimensions -->
+        <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 -->
+            </div>
+            <div id="columns-container" style="margin-top: 10px;">
+                <!-- Columns will be dynamically populated here -->
+            </div>
+        </div>
+    </div>
+
+    <!-- Right Column -->
+    <div class="right-column" style="flex: 1;">
+        <!-- Card 3: Interactive Label Preview -->
+        <div class="dashboard-card">
+            <h3>Interactive Label Preview</h3>
+            <p>Preview the label with selected headers:</p>
+            <div id="label-preview" style="border: 1px solid #ddd; padding: 10px; min-height: 200px;">
+                <!-- Label preview will be dynamically updated here -->
+            </div>
+            <button type="button" id="save-template-btn" class="btn">Save Template</button>
+        </div>
+    </div>
+</div>
+{% endblock %}