Initial commit

BookieClient/src/app/features/crud/crud-form-dialog.component.html

@@ -0,0 +1,62 @@
+<h2 mat-dialog-title>{{ isEdit ? 'Edit' : 'New' }} {{ data.config.singular }}</h2>
+
+<mat-dialog-content>
+  <form [formGroup]="form" class="dialog-form">
+    @for (f of data.config.fields; track f.key) {
+      @switch (f.type) {
+        @case ('select') {
+          <mat-form-field class="full-width">
+            <mat-label>{{ f.label }}</mat-label>
+            <mat-select [formControlName]="f.key">
+              <mat-option [value]="null">—</mat-option>
+              @for (opt of optionsFor(f.key); track opt.value) {
+                <mat-option [value]="opt.value">{{ opt.label }}</mat-option>
+              }
+            </mat-select>
+          </mat-form-field>
+        }
+        @case ('date') {
+          <mat-form-field class="full-width">
+            <mat-label>{{ f.label }}</mat-label>
+            <input matInput [matDatepicker]="dp" [formControlName]="f.key" />
+            <mat-datepicker-toggle matSuffix [for]="dp"></mat-datepicker-toggle>
+            <mat-datepicker #dp></mat-datepicker>
+          </mat-form-field>
+        }
+        @case ('datetime') {
+          <mat-form-field class="full-width">
+            <mat-label>{{ f.label }}</mat-label>
+            <input matInput type="datetime-local" [formControlName]="f.key" />
+          </mat-form-field>
+        }
+        @case ('number') {
+          <mat-form-field class="full-width">
+            <mat-label>{{ f.label }}</mat-label>
+            <input matInput type="number" [formControlName]="f.key" [min]="f.min ?? null" [max]="f.max ?? null" />
+            @if (f.hint) { <mat-hint>{{ f.hint }}</mat-hint> }
+          </mat-form-field>
+        }
+        @case ('textarea') {
+          <mat-form-field class="full-width">
+            <mat-label>{{ f.label }}</mat-label>
+            <textarea matInput rows="3" [formControlName]="f.key"></textarea>
+          </mat-form-field>
+        }
+        @default {
+          <mat-form-field class="full-width">
+            <mat-label>{{ f.label }}</mat-label>
+            <input matInput [formControlName]="f.key" [maxlength]="f.maxLength ?? null" />
+            @if (f.hint) { <mat-hint>{{ f.hint }}</mat-hint> }
+          </mat-form-field>
+        }
+      }
+    }
+  </form>
+</mat-dialog-content>
+
+<mat-dialog-actions align="end">
+  <button mat-button (click)="cancel()">Cancel</button>
+  <button mat-flat-button color="primary" (click)="save()" [disabled]="form.invalid">
+    {{ isEdit ? 'Save' : 'Create' }}
+  </button>
+</mat-dialog-actions>