Skip to content

B
BookingMyHrManagement
Commit b6a6c8fd by Your Name
Options

Enter

parent 42d08acf
Showing with 125 additions and 69 deletions
src/app/pages/equipment/equipment.component.ts
......@@ -44,8 +44,6 @@ export class EquipmentComponent implements OnInit {
myFormRoom: FormGroup;
myFormEquir: FormGroup;
ctrl = new FormControl(null, Validators.required);
constructor(private modalService: NgbModal, private equirmentService: EquirmentService, private roomService: RoomService, private ItemDetailService : ItemDetailService, private RoomDetailService : RoomDetailService
,private fb: FormBuilder) {
......@@ -231,8 +229,6 @@ export class EquipmentComponent implements OnInit {
this.RoomDetailService.addRoomDetail(this.modelRoomDetail);
this.modalService.dismissAll();
this.ngOnInit();
}
}
}
\ No newline at end of file
src/app/pages/home-page/home-page-calendar.component.html
<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">
<div class=" row">
<div class=" col-md-12">
<div class=" form-group">
<label> ชื่อผู้จอง </label>
<input readonly class=" form-control" type="text" value={{name}} style="color: aliceblue;" />
<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">
<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>
<div class=" row">
<div class=" col-md-12">
<div class=" form-group">
<label> เบอร์โทร </label>
<input readonly class=" form-control" type="text" value={{telephone}} style="color: aliceblue;" />
<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>
<div class="row">
<div class="col-sm-12 mb-1">
<label for="exampleFormControlSelect1">ชื่อห้อง</label>
<input readonly class="form-control" type="text" value={{rName}} style="color: aliceblue;">
<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>
<div class="row">
<div class="col-6 mb-1">
<label for="exampleFormControlSelect1">เวลาที่เริ่มต้น</label>
<input readonly class="form-control" type="time" value={{sTime}} style="color: aliceblue;">
<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" [checked]='roomSelect.allDay' />
<span class=" form-check-sign">
<span class="check">ทั้งวัน</span>
</span>
</label>
</div>
</div>
</div>
<div class="col-6 mb-1">
<label readonly for="exampleFormControlSelect1">เวลาที่สิ้นสุด</label>
<input readonly class="form-control" type="time" value={{eTime}} style="color: aliceblue;">
<div class="row" disabled='roomSelect.allDay.valid'>
<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>
\ No newline at end of file
src/app/pages/home-page/home-page.component.ts
import { Component, Input, OnInit, ViewChild } from '@angular/core';
import { Component, Input, OnInit, SimpleChanges, ViewChild } from '@angular/core';
import { FullCalendarComponent, CalendarOptions } from '@fullcalendar/angular';
import { NgbDate, NgbCalendar, NgbDateParserFormatter, NgbNavChangeEvent, NgbModal, ModalDismissReasons, NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
import { Equirment } from 'src/app/models/equirment.model';
......@@ -9,7 +9,6 @@ import { MyRoom } from 'src/app/models/rooms.model';
import { EquirmentService } from 'src/app/service/equirment.service';
import { RoomService } from 'src/app/service/room.service';
import { RoomDetail } from 'src/app/models/RoomDetail.model';
import { FormControl, FormGroup } from '@angular/forms';
@Component({
selector: 'ngbd-modal-content',
......@@ -17,13 +16,26 @@ import { FormControl, FormGroup } from '@angular/forms';
})
export class NgbdModalContent {
@Input() name;
@Input() roomSelect: RoomDetail;
telephone;
rName;
sTime;
eTime;
sDate;
eDate;
allDay;
modelItemDetail = new ItemDetail();
modelRoomDetail = new RoomDetail();
constructor(public activeModal: NgbActiveModal) {
console.log("name", this.roomSelect)
}
ngOnChanges(changes: SimpleChanges) {
console.log("sssssssssss", this.roomSelect)
}
constructor(public activeModal: NgbActiveModal) { }
}
@Component({
......@@ -36,8 +48,11 @@ export class NgbdModalLendContent {
telephone;
eqName;
quantity;
sDate;
constructor(public activeModal: NgbActiveModal) {
constructor(public activeModal: NgbActiveModal) { }
}
}
@Component({
......@@ -105,10 +120,6 @@ export class HomePageComponent implements OnInit {
closeResult = '';
myFormRoom: FormGroup;
myFormEquir: FormGroup;
calendarRoom: CalendarOptions = {
initialView: 'dayGridMonth',
dateClick: this.handleDateClick.bind(this), // bind is important!
......@@ -235,16 +246,16 @@ export class HomePageComponent implements OnInit {
locale: "th",
events: this.eventRoom,
eventClick: this.handleDateClick.bind(this),
// this.selectedRoomDetail = info.event.extendedProps;
// console.log(this.selectedRoomDetail)
// this.test();
// // alert('Coordinates: ' + info.jsEvent.pageX + ',' + info.jsEvent.pageY);
// // alert('View: ' + info.view.type);
// this.selectedRoomDetail = info.event.extendedProps;
// console.log(this.selectedRoomDetail)
// this.test();
// // alert('Coordinates: ' + info.jsEvent.pageX + ',' + info.jsEvent.pageY);
// // alert('View: ' + info.view.type);
// // // change the border color just for fun
// // info.el.style.borderColor = 'red';
// // // change the border color just for fun
// // info.el.style.borderColor = 'red';
// }
// }
};
this.calendarEquirment = {
......@@ -257,7 +268,7 @@ export class HomePageComponent implements OnInit {
};
}
test(){
test() {
alert("sssssssss");
}
......@@ -269,25 +280,23 @@ export class HomePageComponent implements OnInit {
}
eventShow() {
this.listRoomDetail = this.RoomDetailService.getListRoomDetail();
const modalRef = this.modalService.open(NgbdModalContent);
modalRef.componentInstance.name = this.selectedRoomDetail.userName;
modalRef.componentInstance.telephone = this.selectedRoomDetail.rTelephone;
modalRef.componentInstance.rName = this.selectedRoomDetail.room.rName;
modalRef.componentInstance.sTime = this.selectedRoomDetail.sTime;
modalRef.componentInstance.eTime = this.selectedRoomDetail.eTime;
modalRef.componentInstance.roomSelect = this.selectedRoomDetail;
// modalRef.componentInstance.telephone = this.selectedRoomDetail.rTelephone;
// modalRef.componentInstance.rName = this.selectedRoomDetail.room.rName;
// modalRef.componentInstance.sTime = this.selectedRoomDetail.sTime;
// modalRef.componentInstance.eTime = this.selectedRoomDetail.eTime;
// modalRef.componentInstance.sDate = this.selectedRoomDetail.sDate;
// modalRef.componentInstance.eDate = this.selectedRoomDetail.eDate;
// modalRef.componentInstance.allDay = this.selectedRoomDetail.allDay;
}
eventLendShow() {
this.listItemDetail = this.ItemDetailService.getListItemDetail();
const modalRef = this.modalService.open(NgbdModalLendContent);
modalRef.componentInstance.name = this.selectedItemDetail.userName;
modalRef.componentInstance.telephone = this.selectedItemDetail.eTelephone;
modalRef.componentInstance.eqName = this.selectedItemDetail.equirment.eqName;
modalRef.componentInstance.quantity = this.selectedItemDetail.Quantity;
modalRef.componentInstance.sDate = this.selectedRoomDetail.sDate;
}
}
function content(content: any, arg1: { ariaLabelledBy: string; }) {
throw new Error('Function not implemented.');
}
}
\ No newline at end of file
src/app/service/room-detail.service.ts
......@@ -20,19 +20,40 @@ export class RoomDetailService {
rDesc: "จำนวนคน 25 คน",
},
userName: 'เกม',
sDate: '2021-12-15',
eDate: '2021-12-15',
sDate: '2021-12-16',
eDate: '2021-12-16',
sTime: '22:30',
eTime: '22:30',
rStatus: 0,
rTelephone: '0123456789',
email: 'qwerty@qwerty',
remark: 'test',
allDay: false
allDay: true
},
{
id: 2,
room: {
rId: 1,
rName: "ห้องเดียว",
rType: "ห้อง",
rPic: "assets/img/room.jpg",
roomLimit: 25,
rDesc: "จำนวนคน 25 คน",
},
userName: 'ริว',
sDate: '2021-12-16',
eDate: '2021-12-16',
sTime: '22:30',
eTime: '22:30',
rStatus: 0,
rTelephone: '0123456789',
email: 'qwerty@qwerty',
remark: 'test',
allDay: false
},
{
id: 3,
room: {
rId: 2,
rName: "ห้องคู่",
rType: "ห้อง",
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment