Add ปุ่มค้นหาสามารถเอาข้อมูลมา

src/app/app.module.ts

@@ -23,6 +23,8 @@ import { AdminPendingComponent } from './pages/admin-pending/admin-pending.compo
 import { PendingComponent } from './pages/pending/pending.component';
 import { AdminEquirmentComponent } from './pages/admin-equirment/admin-equirment.component';
 
+import { ReactiveFormsModule } from '@angular/forms';
+
 FullCalendarModule.registerPlugins([ // register FullCalendar plugins
   dayGridPlugin,
   interactionPlugin
@@ -39,6 +41,7 @@ FullCalendarModule.registerPlugins([ // register FullCalendar plugins
     AppRoutingModule,
     ToastrModule.forRoot(),
     FullCalendarModule,
+    ReactiveFormsModule,
   ],
   declarations: [AppComponent, AdminLayoutComponent, AuthLayoutComponent, HomePageComponent, EquipmentComponent, CalenRoomComponent, AdminPendingComponent, PendingComponent, AdminEquirmentComponent],
   providers: [],

src/app/models/rooms.model.ts

@@ -11,6 +11,7 @@ export class Room {
         Object.assign(this, init);
         this.rId = 0;
         this.rName = '';
+        this.rType = '';
         this.rPic = '';
         this.roomLimit = 0;
         this.rDesc = '';

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

@@ -39,7 +39,8 @@
                                                 <div class="d-grid gap-2 a-md-flex justify-content-md-end ">
                                                     <button class="btn btn-sm btn-outline-primary"
                                                         (click)="bookRoom(editroom,item)">แก้ไข</button>
-                                                    <button class="btn btn-sm btn-danger" type="button.dispose" (click)="modal.close()">ลบ</button>
+                                                    <button class="btn btn-sm btn-danger" type="button.dispose"
+                                                        (click)="modal.close()">ลบ</button>
                                                 </div>
                                             </div>
                                         </div>
@@ -94,7 +95,8 @@
                                                 <div class="d-grid gap-2 a-md-flex justify-content-md-end">
                                                     <button class="btn btn-sm btn-outline-primary"
                                                         (click)="bookEquir(editLend,item)">แก้ไข</button>
-                                                    <button class="btn btn-sm btn-danger" type="button.dispose">ลบ</button>
+                                                    <button class="btn btn-sm btn-danger"
+                                                        type="button.dispose">ลบ</button>
                                                 </div>
                                             </div>
                                         </div>
@@ -114,7 +116,6 @@
                                     <option [ngValue]="100">100 items per page</option>
                                 </select>
                             </div>
-
                         </div>
                     </div>
                 </div>
@@ -124,7 +125,7 @@
     <div [ngbNavOutlet]="nav"></div>
 </div>
 
-<ng-template #contentroom let-modal >
+<ng-template #contentroom let-modal>
     <div class=" col-md-12" style="padding: 0; ">
         <div class="card" style="margin: 0; ">
             <div class=" card-header">
@@ -145,7 +146,8 @@
                             <div class=" form-group">
                                 <label> ประเภท </label>
                                 <br>
-                                <select class="form-select" aria-label="Default select example" [(ngModel)]="modelRoom.rType">
+                                <select class="form-select" aria-label="Default select example"
+                                    [(ngModel)]="modelRoom.rType">
                                     <option selected>เลือกประเภท</option>
                                     <option value="1">ห้อง</option>
                                     <option value="2">รถ</option>
@@ -168,13 +170,14 @@
             </div>
             <div class=" card-footer">
                 <button class=" btn btn-fill btn-danger" type="submit" (click)="saveRoom()">Save</button>
-                <button class=" btn btn-fill btn-danger" type="cancel" (click)="modal.dismiss('Cross click')">Cancel</button>
+                <button class=" btn btn-fill btn-danger" type="cancel"
+                    (click)="modal.dismiss('Cross click')">Cancel</button>
             </div>
         </div>
     </div>
 </ng-template>
 
-<ng-template #contentequirment let-modal >
+<ng-template #contentequirment let-modal>
     <div class=" col-md-12" style="padding: 0; ">
         <div class="card" style="margin: 0; ">
             <div class=" card-header">
@@ -186,8 +189,8 @@
                         <div class=" col-md-12">
                             <div class=" form-group">
                                 <label> ชื่อ </label>
-                                <input class=" form-control" placeholder="" type="text" [(ngModel)]="modelEquirment.eqName"
-                                    value="" />
+                                <input class=" form-control" placeholder="" type="text"
+                                    [(ngModel)]="modelEquirment.eqName" value="" />
                             </div>
                         </div>
                     </div>
@@ -196,8 +199,8 @@
                             <div class=" form-group">
                                 <label> หมวดหมู่ </label>
                                 <br>
-                                <select class="form-select"
-                                    aria-label="Default select example" [(ngModel)]="modelEquirment.eqType">
+                                <select class="form-select" aria-label="Default select example"
+                                    [(ngModel)]="modelEquirment.eqType">
                                     <option selected>เลือกหมวดหมู่</option>
                                     <option value="4">IT</option>
                                     <option value="5">Company</option>
@@ -209,26 +212,25 @@
                         <div class=" col-md-12">
                             <div class=" form-group">
                                 <label> รายละเอียด</label>
-                                <textarea class="form-control"
-                                    id="exampleFormControlTextarea1" rows="3"
+                                <textarea class="form-control" id="exampleFormControlTextarea1" rows="3"
                                     placeholder="......" [(ngModel)]="modelEquirment.eqDesc"></textarea>
                             </div>
                         </div>
                     </div>
                     <label for="exampleFormControlFile">แนบไฟล์รูปภาพ</label>
-                    <input type="file" class="form-control-file"
-                        id="exampleFormControlFile">
+                    <input type="file" class="form-control-file" id="exampleFormControlFile">
                 </form>
             </div>
             <div class=" card-footer">
                 <button class=" btn btn-fill btn-danger" type="submit" (click)="saveEquirment()">Save</button>
-                <button class=" btn btn-fill btn-danger" type="cancel" (click)="modal.dismiss('Cross click')">Cancel</button>
+                <button class=" btn btn-fill btn-danger" type="cancel"
+                    (click)="modal.dismiss('Cross click')">Cancel</button>
             </div>
         </div>
     </div>
 </ng-template>
 
-<ng-template #editroom let-modal >
+<ng-template #editroom let-modal>
     <div class=" col-md-12" style="padding: 0; ">
         <div class="card" style="margin: 0; ">
             <div class=" card-header">
@@ -240,7 +242,8 @@
                         <div class=" col-md-12">
                             <div class=" form-group">
                                 <label> ชื่อ </label>
-                                <input class=" form-control" type="text"  [(ngModel)]="modelroomDetail.room.rName">
+                                <input class=" form-control" type="text" [(ngModel)]="modelroomDetail.room.rName"
+                                    value="" />
                             </div>
                         </div>
                     </div>
@@ -261,17 +264,32 @@
                             </div>
                         </div>
                     </div>
+                    <form [formGroup]="myForm">
+                        Value: {{ myForm.value | json }}
+                        <hr>
+                        <input placeholder="First name" formControlName="firstName">
+                        <input placeholder="Last name" formControlName="lastName">
+                        <input placeholder="email" formControlName="email">
+                        <input placeholder="phone" formControlName="phone">
+                        <div formGroupName="address">
+                            <input placeholder="house number, road" formControlName="address1">
+                            <input placeholder="sub districe, district" formControlName="address2">
+                            <input placeholder="province" formControlName="province">
+                            <input placeholder="postalCode" formControlName="postalCode">
+                        </div>
+                    </form>
                 </form>
             </div>
             <div class=" card-footer">
                 <button class=" btn btn-fill btn-danger" type="submit" (click)="editRoom()">Save</button>
-                <button class=" btn btn-fill btn-danger" type="cancel" (click)="modal.dismiss('Cross click')">Cancel</button>
+                <button class=" btn btn-fill btn-danger" type="cancel"
+                    (click)="modal.dismiss('Cross click')">Cancel</button>
             </div>
         </div>
     </div>
 </ng-template>
 
-<ng-template #editLend let-modal >
+<ng-template #editLend let-modal>
     <div class=" col-md-12" style="padding: 0; ">
         <div class="card" style="margin: 0; ">
             <div class=" card-header">
@@ -309,13 +327,14 @@
             </div>
             <div class=" card-footer">
                 <button class=" btn btn-fill btn-danger" type="submit" (click)="saveEquirment()">Save</button>
-                <button class=" btn btn-fill btn-danger" type="cancel" (click)="modal.dismiss('Cross click')">Cancel</button>
+                <button class=" btn btn-fill btn-danger" type="cancel"
+                    (click)="modal.dismiss('Cross click')">Cancel</button>
             </div>
         </div>
     </div>
 </ng-template>
 
-<ng-template #Room let-modal >
+<ng-template #Room let-modal>
     <div class=" col-md-12" style="padding: 0; ">
         <div class="card" style="margin: 0; ">
             <div class=" card-header">

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

@@ -7,6 +7,7 @@ import { Room } from 'src/app/models/rooms.model';
 import { EquirmentService } from 'src/app/service/equirment.service';
 import { RoomService } from 'src/app/service/room.service';
 import { roomDetailService } from 'src/app/service/room-detail.service';
+import { FormBuilder, FormGroup } from '@angular/forms';
 
 @Component({
   selector: 'app-admin-equirment',
@@ -14,6 +15,7 @@ import { roomDetailService } from 'src/app/service/room-detail.service';
   styleUrls: ['./admin-equirment.component.scss']
 })
 export class AdminEquirmentComponent implements OnInit {
+  myForm: FormGroup;
   time = { hour: 13, minute: 30 };
   page = 1;
   pageSize = 10;
@@ -33,8 +35,21 @@ export class AdminEquirmentComponent implements OnInit {
   modelitemDetail = new itemDetail();
   modelroomDetail = new roomDetail();
 
-  constructor(private modalService: NgbModal, private equirmentService: EquirmentService, private roomService: RoomService, private roomDetailService : roomDetailService) {
-
+  constructor(private modalService: NgbModal, private equirmentService: EquirmentService, private roomService: RoomService, private roomDetailService: roomDetailService, private fb: FormBuilder
+  ) {
+    this.myForm = this.fb.group({
+      firstName: '',
+      lastName: '',
+      email: '',
+      phone: '',
+      address: this.fb.group({
+        address1: '',
+        address2: '',
+        province: '',
+        postalCode: ''
+      })
+    });
+    this.myForm.valueChanges.subscribe(console.log);
   }
 
   ngOnInit() {
@@ -144,7 +159,7 @@ export class AdminEquirmentComponent implements OnInit {
   }
 
   editRoom() {
-    this.roomService.editroom(this.modelRoom);
+    this.roomDetailService.editroomDetail(this.modelroomDetail);
     this.modalService.dismissAll();
     this.ngOnInit();
   }

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

@@ -60,6 +60,16 @@ export class AdminPendingComponent implements OnInit {
   fromDate: NgbDate | null;
   toDate: NgbDate | null;
 
+  thStime: string;
+  thEtime: string;
+  thtimeChange (time:string,item:any){
+    let timeSplit = time.split(":")
+    item.hour = parseInt(timeSplit[0])
+    item.minute = parseInt(timeSplit[1])
+    console.log(this.modelroomDetail)
+  }
+
+
   constructor(private calendar: NgbCalendar, public formatter: NgbDateParserFormatter, private modalService: NgbModal, private itemDetailService: itemDetailService, private roomDetailService: roomDetailService) {
     this.fromDate = calendar.getToday();
     this.toDate = calendar.getNext(calendar.getToday(), 'd', 10);
@@ -90,10 +100,20 @@ export class AdminPendingComponent implements OnInit {
       this.closeResult = `Dismissed ${this.getDismissReason(reason)}`;
     });
   }
-
+  date='10-12-2561'
+  show(a:string){
+    console.log(a)
+  }
+  sDate = ""
+  eDate = ""
   openItemDetail(content : string ,item : itemDetail) {
     this.modelitemDetail = item ;
-    console.log(item);
+    this.thStime= this.modelitemDetail.sTime.hour + ':' + this.modelitemDetail.sTime.minute 
+    this.thEtime= this.modelitemDetail.eTime.hour + ':' + this.modelitemDetail.eTime.minute
+    let SDate = this.modelitemDetail.sDate.split('/')
+    this.sDate = SDate[2]+"-"+SDate[1]+"-"+SDate[0]
+    let EDate = this.modelitemDetail.eDate.split('/')
+    this.eDate = EDate[2]+"-"+EDate[1]+"-"+EDate[0]
     this.modalService.open(content, { ariaLabelledBy: 'modal-basic-title' }).result.then((result) => {
       this.closeResult = `Closed with: ${result}`;
     }, (reason) => {
@@ -101,9 +121,27 @@ export class AdminPendingComponent implements OnInit {
     });
   }
 
+  rDate(item: string, item2: string){
+    let Dates = item.split("-")
+    let dates = Dates[2]+"/"+Dates[1]+"/"+Dates[0]
+    
+    if(item2=="sdate"){
+      this.modelitemDetail.sDate = dates
+    }
+    if(item2=="edate"){
+      this.modelitemDetail.eDate = dates
+    }
+    console.log(this.sDate)
+  } 
+
   openRoomDetail(content : string ,item : roomDetail) {
     this.modelroomDetail = item ;
-    console.log(item);
+    this.thStime= this.modelroomDetail.sTime.hour + ':' + this.modelroomDetail.sTime.minute 
+    this.thEtime= this.modelroomDetail.eTime.hour + ':' + this.modelroomDetail.eTime.minute 
+    let SDate = this.modelroomDetail.sDate.split('/')
+    this.sDate = SDate[2]+"-"+SDate[1]+"-"+SDate[0]
+    let EDate = this.modelroomDetail.eDate.split('/')
+    this.eDate = EDate[2]+"-"+EDate[1]+"-"+EDate[0]
     this.modalService.open(content, { ariaLabelledBy: 'modal-basic-title' }).result.then((result) => {
       this.closeResult = `Closed with: ${result}`;
     }, (reason) => {

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

@@ -13,7 +13,7 @@ export class roomDetailService {
             room: {
                 rId: 1,
                 rName: "ห้องเดียว",
-                rType : "ห้อง",
+                rType: "ห้อง",
                 rPic: "assets/img/room.jpg",
                 roomLimit: 25,
                 rDesc: "จำนวนคน 25 คน",
@@ -39,7 +39,7 @@ export class roomDetailService {
             room: {
                 rId: 2,
                 rName: "ห้องคู่",
-                rType : "ห้อง",
+                rType: "ห้อง",
                 rPic: "assets/img/room.jpg",
                 roomLimit: 50,
                 rDesc: "จำนวนคน 50 คน",

src/app/service/room.service.ts

@@ -3,8 +3,6 @@ import { HttpClient, HttpHeaders } from '@angular/common/http';
 import { Room, SearchRoomModel } from '../models/rooms.model';
 import { roomDetail } from '../models/roomDetail.model';
 
-
-
 @Injectable({ providedIn: 'root' })
 export class RoomService {