Development

docker/routlin-dash/app/view_page.py

@@ -1205,65 +1205,76 @@ def _render_item(item, tokens, inherited_req=None):
         value = e(apply_tokens(item.get('value', ''), tokens))
         return f'<input type="hidden" name="{name}" value="{value}"/>'
 
-    if t == 'identity_builder':
-        label = e(item.get('label', 'Self Ident(s):'))
+    if t == 'record_editor':
+        label     = e(item.get('label', ''))
+        name      = e(item.get('name', ''))
+        empty     = e(item.get('empty_message', 'No records added.'))
+        fields    = item.get('fields', [])
+        col_count = len(fields) + 1
+
+        ths = ''.join(f'<th>{e(f.get("label",""))}</th>' for f in fields) + '<th></th>'
+
+        form_rows = ''
+        for f in fields:
+            f_label       = e(f.get('label', ''))
+            f_name        = e(f.get('name', ''))
+            f_placeholder = e(f.get('placeholder', ''))
+            f_required    = 'true' if f.get('required') else 'false'
+            f_validate    = f.get('validate', '')
+            f_valtype     = f.get('valtype', '')
+            f_attrs       = f.get('attrs', {})
+
+            attr_str = f' data-field="{f_name}" data-required="{f_required}"'
+            if f_validate:
+                attr_str += f' data-validate="{e(f_validate)}"'
+            if f_valtype:
+                attr_str += f' data-valtype="{e(f_valtype)}"'
+            for ak, av in f_attrs.items():
+                attr_str += f' {e(ak)}="{e(str(av))}"'
+
+            inp = f'<input type="text" class="form-input"{attr_str} placeholder="{f_placeholder}"/>'
+            if f_validate or f_valtype:
+                field_inner = (
+                    '<div class="field-wrap">'
+                    + inp +
+                    '<p class="form-hint field-dyn-hint hidden"></p>'
+                    '</div>'
+                )
+            else:
+                field_inner = inp
+
+            form_rows += (
+                f'<div class="form-group">'
+                f'<label class="form-label">{f_label}</label>'
+                f'{field_inner}'
+                f'</div>'
+            )
+
+        n = len(fields)
+        grid_class = f'form-row-{n}' if n in (2, 3, 4) else 'form-row-3'
+
         return (
-            '<div class="form-group identity-builder">'
+            f'<div class="form-group record-editor" data-name="{name}" data-empty-message="{empty}">'
             f'<label class="form-label">{label}</label>'
-            '<div class="identity-builder-body">'
-            '<div class="identity-builder-list">'
-            '<table class="data-table identity-list-table">'
-            '<thead><tr><th>IP Address</th><th>Description</th><th>Hostname</th><th></th></tr></thead>'
-            '<tbody class="identity-builder-rows">'
-            '<tr class="identity-empty-row">'
-            '<td colspan="4" class="table-empty">No identities added.</td>'
-            '</tr>'
-            '</tbody>'
-            '</table>'
-            '</div>'
-            '<div class="identity-builder-form">'
-            '<table class="inline-edit-labeled-table">'
-            '<thead><tr><th></th><th></th></tr></thead>'
-            '<tbody>'
-            '<tr>'
-            '<td class="identity-input-label">IP Address:</td>'
-            '<td>'
-            '<div class="field-wrap">'
-            '<input type="text" class="form-input inline-edit-input identity-ip-input"'
-            ' placeholder="x.x.x.x"'
-            ' data-valtype="address"'
-            ' data-dep-subnet="[name=\'subnet\']"'
-            ' data-dep-mask=".subnet-prefix-input"/>'
-            '<p class="form-hint field-dyn-hint hidden"></p>'
-            '</div>'
-            '</td>'
-            '</tr>'
-            '<tr>'
-            '<td class="identity-input-label">Description (Opt):</td>'
-            '<td><input type="text" class="form-input inline-edit-input identity-desc-input"/></td>'
-            '</tr>'
-            '<tr>'
-            '<td class="identity-input-label">Hostname (Opt):</td>'
-            '<td>'
-            '<div class="form-group field-wrap" style="margin:0">'
-            '<input type="text" class="form-input inline-edit-input identity-host-input"'
-            ' data-validate="networkname"/>'
-            '<p class="form-hint field-dyn-hint hidden"></p>'
-            '</div>'
-            '</td>'
-            '</tr>'
-            '<tr>'
-            '<td></td>'
-            '<td><button type="button" class="btn btn-secondary btn-sm identity-add-btn">Add</button></td>'
-            '</tr>'
-            '</tbody>'
-            '</table>'
-            '</div>'
-            '</div>'
-            '<textarea name="server_identity_ips" class="hidden"></textarea>'
-            '<textarea name="server_identity_descriptions" class="hidden"></textarea>'
-            '<textarea name="server_identity_hostnames" class="hidden"></textarea>'
-            '</div>'
+            f'<div class="record-editor-body">'
+            f'<table class="data-table record-editor-table">'
+            f'<thead><tr>{ths}</tr></thead>'
+            f'<tbody class="record-editor-rows">'
+            f'<tr class="record-editor-empty-row">'
+            f'<td colspan="{col_count}" class="table-empty">{empty}</td>'
+            f'</tr>'
+            f'</tbody>'
+            f'</table>'
+            f'<div class="record-editor-form">'
+            f'<div class="{grid_class}">{form_rows}</div>'
+            f'<div style="margin-top:0.5rem">'
+            f'<button type="button" class="btn btn-secondary btn-sm record-editor-add-btn">Add</button>'
+            f'<button type="button" class="btn btn-ghost btn-sm record-editor-cancel-btn hidden" style="margin-left:0.5rem">Cancel</button>'
+            f'</div>'
+            f'</div>'
+            f'</div>'
+            f'<input type="hidden" name="{name}" class="record-editor-hidden" value="[]"/>'
+            f'</div>'
         )
 
     if t == 'field':