Update จองทั้งวัน เหลือเบิก

src/app/models/itemDetail.model.ts

@@ -13,6 +13,7 @@ export class ItemDetail {
     eTelephone: string;
     email: string;
     remark: string;
+    allDay: boolean;
     constructor(init?: ItemDetail) {
         Object.assign(this, init);
         this.id = 1;
@@ -25,6 +26,7 @@ export class ItemDetail {
         this.eTelephone = '';
         this.email = '';
         this.remark = '';
+        this.allDay = true;
     }
 }
 

src/app/models/roomDetail.model.ts

@@ -12,6 +12,7 @@ export class RoomDetail {
     rTelephone: string;
     email: string;
     remark: string;
+    allDay: boolean;
     constructor(init?: RoomDetail) {
         Object.assign(this, init);
         this.id = 1;
@@ -23,6 +24,7 @@ export class RoomDetail {
         this.rTelephone = '';
         this.email = '';
         this.remark = '';
+        this.allDay = true;
     }
 }
 

src/app/pages/admin-pending/admin-pending.component.html

@@ -149,7 +149,7 @@
                                     </thead>
                                     <tbody>
                                         <tr *ngFor="let item of listItemDetail">
-                                            <th scope="row">{{ item.Id }}</th>
+                                            <th scope="row">{{ item.id }}</th>
                                             <td>{{ item.equirment.eqType }}</td>
                                             <td>{{ item.equirment.eqName }}</td>
                                             <td>{{ item.equirment.eqDesc }}</td>
@@ -249,6 +249,18 @@
                         </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" [(ngModel)]="modelRoomDetail.allDay" formControlName="allDay"  />
+                                    <span class=" form-check-sign">
+                                        <span class="check">ทั้งวัน</span>
+                                    </span>
+                                </label>
+                            </div>
+                        </div>
+                    </div>
+                    <div class="row" *ngIf="!modelRoomDetail.allDay">
                         <div class="col-6 mb-1">
                             <label for="exampleFormControlSelect1">วันที่เริ่มต้น</label>
                             <input type="date" class="form-control" [(ngModel)]="sDate"
@@ -431,7 +443,7 @@
                                     <option value="0" style="color: black;">รอดำเนินการ</option>
                                     <option value="1" style="color: black;">อนุมัติ</option>
                                     <option value="2" style="color: black;">ยกเลิก</option>
-                                    <option value="3" style="color: black;">สำเร็จแล้ว</option>
+                                    <option value="3" style="color: black;">คืนแล้ว</option>
                                 </select>
                             </div>
                         </div>

src/app/pages/admin-pending/admin-pending.component.ts

@@ -125,7 +125,8 @@ export class AdminPendingComponent implements OnInit {
       eTime: new FormControl(this.modelItemDetail.eTime, [Validators.required]),
       Quantity: new FormControl(this.modelItemDetail.Quantity, [Validators.required]),
       Remark: new FormControl(this.modelItemDetail.remark),
-      eStatus: new FormControl(this.modelItemDetail.eStatus)
+      eStatus: new FormControl(this.modelItemDetail.eStatus),
+      allDay: new FormControl(this.modelItemDetail.allDay)
     })
     this.modalService.open(content, { ariaLabelledBy: 'modal-basic-title' }).result.then((result) => {
       this.closeResult = `Closed with: ${result}`;
@@ -167,7 +168,8 @@ export class AdminPendingComponent implements OnInit {
       sTime: new FormControl(this.modelRoomDetail.sTime, [Validators.required]),
       eTime: new FormControl(this.modelRoomDetail.eTime, [Validators.required]),
       remark: new FormControl(this.modelRoomDetail.remark),
-      rStatus: new FormControl(this.modelRoomDetail.rStatus)
+      rStatus: new FormControl(this.modelRoomDetail.rStatus),
+      allDay: new FormControl(this.modelRoomDetail.allDay)
     });
     this.modalService.open(content, { ariaLabelledBy: 'modal-basic-title' }).result.then((result) => {
       this.closeResult = `Closed with: ${result}`;
@@ -241,6 +243,7 @@ export class AdminPendingComponent implements OnInit {
     this.modelRoomDetail.eTime  = this.myFormRoom.value.eTime
     this.modelRoomDetail.remark  = this.myFormRoom.value.remark
     this.modelRoomDetail.rStatus  = this.myFormRoom.value.rStatus
+    this.modelRoomDetail.allDay = this.myFormRoom.value.allDay
     console.log("this.modelRoomDetail", this.modelRoomDetail)
     this.RoomDetailService.updateRoomDetail(this.modelRoomDetail)
     this.modalService.dismissAll();
@@ -263,6 +266,7 @@ export class AdminPendingComponent implements OnInit {
     this.modelItemDetail.eTime  = this.myFormEquir.value.eTime
     this.modelItemDetail.remark  = this.myFormEquir.value.remark
     this.modelItemDetail.eStatus  = this.myFormEquir.value.eStatus
+    this.modelItemDetail.allDay = this.myFormEquir.value.allDay
     console.log("this.modelItemDetail", this.modelItemDetail)
     this.ItemDetailService.updateItemDetail(this.modelItemDetail)
     this.modalService.dismissAll();

src/app/pages/equipment/equipment.component.html

@@ -317,7 +317,7 @@
                         <div class="col-12 mb-1">
                             <div class=" form-check">
                                 <label class=" form-check-label">
-                                    <input class=" form-check{{readonly ? 'danger' : 'success'}}" type="checkbox" value="" (click)="readonly = !readonly" />
+                                    <input class=" form-check" type="checkbox" [(ngModel)]="modelRoomDetail.allDay" formControlName="allDay"  />
                                     <span class=" form-check-sign">
                                         <span class="check">ทั้งวัน</span>
                                     </span>
@@ -325,12 +325,11 @@
                             </div>
                         </div>
                     </div>
-                    <div class="row">
+                    <div class="row" *ngIf="!modelRoomDetail.allDay">
                         <div class="col-6 mb-1">
                             <label for="exampleFormControlSelect1">เวลาที่เริ่มต้น</label>
                             <input class="form-control" type="time" [(ngModel)]="modelRoomDetail.sTime"
-                                formControlName="sTime" [readonly]="readonly"/>
-
+                                formControlName="sTime"/>
                             <div style="color: red;" *ngIf="myFormRoom.controls.sTime.status=='INVALID'">
                                 กรุณากรอกเวลาที่เริ่มต้นการจอง.
                             </div>
@@ -339,7 +338,7 @@
                         <div class="col-6 mb-1">
                             <label for="exampleFormControlSelect1">เวลาที่สิ้นสุด</label>
                             <input class="form-control" type="time" [(ngModel)]="modelRoomDetail.eTime"
-                                formControlName="eTime" [readonly]="readonly"/>
+                                formControlName="eTime" />
 
                             <div style="color: red;" *ngIf="myFormRoom.controls.eTime.status=='INVALID'">
                                 กรุณากรอกเวลาที่สิ้นสุดการจอง.

src/app/pages/equipment/equipment.component.ts

@@ -79,7 +79,8 @@ export class EquipmentComponent implements OnInit {
       eDate : new FormControl('',[Validators.required]),
       sTime : new FormControl('',[Validators.required]),
       eTime : new FormControl('',[Validators.required]),
-      Remark : new FormControl()
+      Remark : new FormControl(),
+      allDay: new FormControl()
     });
     this.myFormEquir = new FormGroup({
       userNameForm : new FormControl('',[Validators.required]),

src/app/pages/home-page/home-page.component.html

@@ -71,13 +71,15 @@
                         <li [ngbNavItem]="1">
                             <a ngbNavLink>ปฏิทินการจองห้อง</a>
                             <ng-template ngbNavContent>
-                                <full-calendar #calendarBook [options]="calendarRoom"></full-calendar>
+                                <full-calendar #calendarBook [options]="calendarRoom" style="
+                                margin-top: 20px;"></full-calendar>
                             </ng-template>
                         </li>
                         <li [ngbNavItem]="2">
                             <a ngbNavLink>ปฏิทินการยืมรถ</a>
                             <ng-template ngbNavContent>
-                                <full-calendar #calendar [options]="calendarEquirment"></full-calendar>
+                                <full-calendar #calendar [options]="calendarEquirment" style="
+                                margin-top: 20px;"></full-calendar>
                             </ng-template>
                         </li>
                     </ul>

src/app/pages/home-page/home-page.component.ts

@@ -143,8 +143,7 @@ export class HomePageComponent implements OnInit {
           end: '2021-12-16T11:30:00',
           extendedProps: this.listRoomDetail[i],
           description: this.listRoomDetail[i].remark,
-          color: 'rgb(250,250,250)',
-          textColor: 'white'
+          allDay : this.listRoomDetail[i].allDay
         }
         )
       }
@@ -171,6 +170,7 @@ export class HomePageComponent implements OnInit {
     this.calendarRoom = {
       initialView: 'dayGridMonth',
       themeSystem: 'bootstrap',
+      dayMaxEventRows: true, 
       dateClick: this.handleDateClick.bind(this), // bind is important!
       locale: "th",
       events: this.eventRoom
@@ -179,6 +179,7 @@ export class HomePageComponent implements OnInit {
     this.calendarEquirment = {
       initialView: 'dayGridMonth',
       themeSystem: 'bootstrap',
+      dayMaxEventRows: true, 
       dateClick: this.handleDateClick.bind(this), // bind is important!
       locale: "th",
       events: this.eventEquirment

src/app/pages/pending/pending.component.html

@@ -150,7 +150,7 @@
                                     </thead>
                                     <tbody>
                                         <tr *ngFor="let item of listItemDetail">
-                                            <th scope="row">{{ item.Id }}</th>
+                                            <th scope="row">{{ item.id }}</th>
                                             <td>{{ item.equirment.eqType }}</td>
                                             <td>{{ item.equirment.eqName }}</td>
                                             <td>{{ item.equirment.eqDesc }}</td>

src/app/service/item-detail.service.ts

@@ -27,6 +27,7 @@ export class ItemDetailService {
       eTelephone: '0123456789',
       email: 'qwerty@qwerty',
       remark: 'test',
+      allDay: false
     },
     {
       id : 2,
@@ -47,6 +48,7 @@ export class ItemDetailService {
       eTelephone: '0123456789',
       email: 'qwerty@qwerty',
       remark: 'test',
+      allDay: false
     },
 
   ]

src/app/service/room-detail.service.ts

@@ -28,6 +28,7 @@ export class RoomDetailService {
             rTelephone: '0123456789',
             email: 'qwerty@qwerty',
             remark: 'test',
+            allDay: false
         },
         {
             id: 2,
@@ -48,6 +49,7 @@ export class RoomDetailService {
             rTelephone: '0123456789',
             email: 'qwerty@qwerty',
             remark: 'test',
+            allDay: true
         },
 
     ]