<form [formGroup]="form">
  <div class="p-3 space-y-4">
    <div *ngIf="isEdit" class="flex flex-col w-full">
      <label>code</label>
      <input type="text" formControlName="branch_code" readonly>
    </div>

    <div class="flex flex-col w-full">
      <label>ชื่อศูนย์สอบ</label>
      <input type="text" formControlName="branch_name_th">
    </div>

    <div class="flex flex-col w-full">
      <label>ภาค</label>
      <select formControlName="region_uid" (ngModelChange)="setProvince($event)">
        <option>
          -- เลือกภาค --
        </option>
        <option *ngFor="let x of regionMock" [value]="x.region_uid" >
          {{x.region_name_th}}
        </option>
      </select>
    </div>

    <div class="flex flex-col w-full">
      <label>จังหวัด</label>
      <select formControlName="province_uid">
        <option>
          -- เลือกจังหวัด --
        </option>
        <option *ngFor="let x of provinceMock" [ngValue]="x.province_uid">
          {{x.province_name_th}}
        </option>
      </select>
    </div>

    <div class="flex flex-col w-full">
      <label>สถานะ</label>
      <select formControlName="status_id">
        <option *ngFor="let x of statusMock" [ngValue]="x.id">
          {{x.name}}
        </option>
      </select>
    </div>

    <div class="flex flex-row justify-center mt-3 w-full ">
      <button class="search-button mr-3" [disabled]="form.invalid" (click)="save()">บันทึก</button>
      <button class="clear-button" (click)="cancel()">ยกเลิก</button>
    </div>
  </div>
</form>

<!-- <pre>{{form.getRawValue() | json}}</pre>-->

