<div id="fix-bonus" class="page-layout simple fullwidth" fxLayout="column">
  <!-- <div id="orders" class="page-layout carded fullwidth inner-scroll"> -->
  <!-- HEADER -->
  <div
    class="header accent p-24 h-160"
    fxLayout="row"
    fxLayoutAlign="start center"
  >
    <div fxLayout="column" fxLayoutAlign="center start">
      <div fxLayout="row" fxLayoutAlign="start center">
        <mat-icon class="secondary-text s-18">home</mat-icon>
        <mat-icon class="secondary-text s-16">chevron_right</mat-icon>
        <span class="secondary-text">User Interface</span>
      </div>
      <div class="h1 mt-16">룰렛쿠폰관리</div>
    </div>
  </div>
  <!-- / HEADER -->

  <!-- CONTENT -->
  <div class="content p-24">
    <div class="h1">
      고정보너스
    </div>

    <div
      class="mb-24"
      fxLayout="column"
      fxLayoutAlign="start"
      fxLayout.gt-md="row"
    >
      <div
        class="mat-elevation-z8 p-24 mr-24"
        fxFlex="3 0 auto"
        fxLayout="column"
      >
        <form
          name="fixBonusForm"
          [formGroup]="mtformgroup"
          (ngSubmit)="fixBonusUpdate()"
          novalidate
        >
          <mat-table
            class="fix-bonus-table"
            #table
            [dataSource]="dataSource"
            [@animateStagger]="{ value: '50' }"
            matSort
            formArrayName="formarray"
          >
            <!-- Game Type Column [formGroupName] -->
            <ng-container matColumnDef="gameType">
              <mat-header-cell *matHeaderCellDef>타입</mat-header-cell>
              <mat-cell
                *matCellDef="let fixBonus; let i = index"
                [formGroupName]="i"
                >{{ fixBonus.gameType }}</mat-cell
              >
            </ng-container>

            <!-- Game Description Column -->
            <ng-container matColumnDef="gameDescription">
              <mat-header-cell *matHeaderCellDef>설명</mat-header-cell>
              <mat-cell
                *matCellDef="let fixBonus; let i = index"
                [formGroupName]="i"
              >
                {{ fixBonus.gameDescription }}
              </mat-cell>
            </ng-container>

            <!-- User Description Column -->
            <ng-container matColumnDef="userDescription">
              <mat-header-cell *matHeaderCellDef>설명</mat-header-cell>
              <mat-cell
                *matCellDef="let fixBonus; let i = index"
                [formGroupName]="i"
              >
                <mat-form-field appearance="outline">
                  <input
                    name="inputUserDescription={{ fixBonus.userDescription }}"
                    matInput
                    type="text"
                    formControlName="userDescription"
                  />
                </mat-form-field>
              </mat-cell>
            </ng-container>

            <!-- Odds Column -->
            <ng-container matColumnDef="odds">
              <mat-header-cell *matHeaderCellDef>배당설정</mat-header-cell>
              <mat-cell
                *matCellDef="let fixBonus; let i = index"
                [formGroupName]="i"
              >
                <mat-form-field appearance="outline">
                  <input
                    name="inputHolder={{ fixBonus.odds }}"
                    matInput
                    type="text"
                    formControlName="odds"
                  />
                </mat-form-field>
              </mat-cell>
            </ng-container>

            <!-- Folder Column -->
            <ng-container matColumnDef="folder">
              <mat-header-cell *matHeaderCellDef>폴더설정</mat-header-cell>
              <mat-cell
                *matCellDef="let fixBonus; let i = index"
                [formGroupName]="i"
              >
                <mat-form-field appearance="outline">
                  <input
                    name="inputFolder={{ fixBonus.folder }}"
                    matInput
                    type="text"
                    formControlName="folder"
                  />
                </mat-form-field>
              </mat-cell>
            </ng-container>

            <!-- Allow Column -->
            <ng-container matColumnDef="allow">
              <mat-header-cell *matHeaderCellDef>허용불가</mat-header-cell>
              <mat-cell
                *matCellDef="let fixBonus; let i = index"
                [formGroupName]="i"
              >
                <mat-form-field appearance="outline">
                  <input
                    name="inputFolder={{ fixBonus.allow }}"
                    matInput
                    type="text"
                    formControlName="allow"
                  />
                </mat-form-field>
              </mat-cell>
            </ng-container>

            <mat-header-row
              *matHeaderRowDef="displayedColumns"
            ></mat-header-row>
            <mat-row
              *matRowDef="let row; columns: displayedColumns"
              class="fix-bonus"
              matRipple
            ></mat-row>
          </mat-table>
        </form>
      </div>
    </div>
  </div>
  <!-- / CONTENT -->
</div>
