<div class="modal-content">
    <div class="modal-header">
        <h4 class="modal-title">รายละเอียดการจอง</h4>
        <button type="button" class="close" aria-label="Close" (click)="activeModal.dismiss('Cross click')">
            <span aria-hidden="true">&times;</span>
        </button>
    </div>
    <div class=" modal-body">
        <img style="object-fit: cover;" [src]="roomSelect.room.rPic"  width="150px" height="150px" 
        class="nav justify-content-center" ><br>
        <div class=" row">
            <div class=" col-md-12">
                <div class=" form-group">
                    <label> ชื่อผู้จอง </label>
                    <input readonly class=" form-control" type="text" [value]="roomSelect.userName"
                        style="color: aliceblue;" />
                </div>
            </div>
        </div>
        <div class=" row">
            <div class=" col-md-12">
                <div class=" form-group">
                    <label> เบอร์โทร </label>
                    <input readonly class=" form-control" type="text" value={{roomSelect.rTelephone}}
                        style="color: aliceblue;" />
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-sm-12 mb-1">
                <label for="exampleFormControlSelect1">ชื่อห้อง</label>
                <input readonly class="form-control" type="text" value={{roomSelect.room.rName}}
                    style="color: aliceblue;">
            </div>
        </div>
        <div class="row">
            <div class="col-6 mb-1">
                <label for="exampleFormControlSelect1">วันที่เริ่มต้น</label>
                <input readonly class="form-control" type="date" value={{roomSelect.sDate}} style="color: aliceblue;">
            </div>
            <div class="col-6 mb-1">
                <label readonly for="exampleFormControlSelect1">วันที่สิ้นสุด</label>
                <input readonly class="form-control" type="date" value={{roomSelect.eDate}} style="color: aliceblue;">
            </div>
        </div>
        <div class="row">
            <div class="col-12 mb-1">
                <div class=" form-check">
                    <label class=" form-check-label">
                        <input class=" form-check" type="checkbox" disabled [checked]='roomSelect.allDay' />
                        <span class=" form-check-sign">
                            <span class="check">ทั้งวัน</span>
                        </span>
                    </label>
                </div>
            </div>
        </div>
        <div class="row" >
            <div class="col-6 mb-1">
                <label for="exampleFormControlSelect1">เวลาที่เริ่มต้น</label>
                <input readonly class="form-control" type="time" value={{roomSelect.sTime}} style="color: aliceblue;">
            </div>
            <div class="col-6 mb-1">
                <label readonly for="exampleFormControlSelect1">เวลาที่สิ้นสุด</label>
                <input readonly class="form-control" type="time" value={{roomSelect.eTime}} style="color: aliceblue;">
            </div>
        </div>
    </div>
</div>