<div class="main">

    <div class="flex flex-row">
        <div *ngIf="CandidateTypeName" class="justify-center text-center text-red-600 w-full fontHeadsummary">
            {{CandidateTypeName}}
        </div>
        <div *ngIf="!CandidateTypeName" class="justify-center text-center text-red-600 w-full fontHeadsummary">
            โปรดระบุ ประเภทผู้สอบ
        </div>
        <div class="justify-end">
            <button class="delete-button w-1/12" style="min-width:153px !important;" (click)="logoutcounter()">
                ออกเคาเตอร์
            </button>
        </div>
    </div>
    <div class="flex flex-col sm:flex-row justify-between">
        <div class="flex flex-col sm:w-33% w-full mt-2">
            <mat-card>
                <mat-card-content class="text-center">
                    <label class="fontHeadsummary">
                        ยอดเงินรวม
                    </label>
                    <!--          <input type="text" placeholder="รหัสนักศึกษา" [value]="this.totalfee" [disabled]="this.totalfee != null">-->
                    <br><br>
                    <label class="fontsummary" *ngIf="counterDetail">
                        {{this.counterDetail[0]?.total_money}}
                    </label>
                </mat-card-content>

            </mat-card>
        </div>
        <div class="flex flex-col sm:w-33% w-full mt-2">
            <mat-card>
                <mat-card-content class="text-center">
                    <label class="fontHeadsummary">
                        จำนวนนักศึกษาที่ลงทะเบียน
                    </label>
                    <br><br>
                    <!--      <input type="text" [value]="this.studentcount" [disabled]="this.studentcount != null">-->
                    <label class="fontsummary" *ngIf="counterDetail">
                        {{this.counterDetail[0]?.count}}
                    </label>
                </mat-card-content>
            </mat-card>
        </div>
        <div class="flex flex-col sm:w-33% w-full mt-2">
            <mat-card>
                <mat-card-content class="text-center">
                    <label class="fontHeadsummary">
                        หมายเลขเคาเตอร์
                    </label>
                    <!--      <input type="text" placeholder="รหัสนักศึกษา" [value]="this.subjectcount" [disabled]="this.subjectcount != null">-->
                    <br><br>
                    <label class="fontsummary">
                        {{ this.userData.counter_no}}
                    </label>
                </mat-card-content>
            </mat-card>
        </div>
    </div>
</div>
