Skip to content

B
BookingMyHrManagement
Commit 86191ddf by Chanachai
Options

อัพเดทงานแก้

parent 338172a6
Showing with 105 additions and 86 deletions
src/app/pages/equipment/equipment.component.html
......@@ -36,21 +36,20 @@
</div>
<div class="form-group">
<label for="exampleFormControlInput1">ชื่อรุ่นอุปกรณ์</label>
<label for="exampleFormControlInput1">ชื่อ</label>
<input type="model" class="form-control" id="exampleFormControlInput1"
placeholder="">
</div>
<div class="form-group">
<label for="exampleFormControlSelect1">ชื่ออุปกรณ์</label>
<label for="exampleFormControlSelect1">ประเภท</label>
<select class="form-control" id="exampleFormControlSelect1">
<option>จอคอมพิวเตอร์</option>
<option>โน๊ตบุ๊ค</option>
<option>เมาส์</option>
<option>คีย์บอร์ด</option>
<option>ห้อง</option>
<option>รถ</option>
<option>อุปกรณ์</option>
</select>
</div>
<div class="form-group">
<label for="exampleFormControlTextarea1">รายละเอียดอุปกรณ์</label>
<label for="exampleFormControlTextarea1">รายละเอียด</label>
<textarea class="form-control" id="exampleFormControlTextarea1"
rows="20"></textarea>
</div>
......@@ -68,67 +67,24 @@
(click)="open(content)">เพิ่มรายการ</button>
<div class="row">
<div class="col-sm-3" *ngFor="let item of listEquirment">
<div class="card-body">
<img [src]="item.pic" class="nav justify-content-center" alt="...">
</div>
<p class="text-left">{{item.name}}</p>
<p class="text-left">{{item.desc}}</p>
<p class="text-left">{{item.type}}</p>
<div class="d-grid gap-2 a-md-flex justify-content-md-end">
<button class="btn btn-primary" type="button">ยืม</button>
<button class="btn btn-primary" type="button">ยกเลิก</button>
</div>
</div>
<!-- <div class="col-sm-3" *ngFor="let item of listEquirment">
<div class="card-body">
<img src="assets\img\mou.jpg" class="nav justify-content-center" alt="...">
</div>
<div class="col-sm-3" *ngFor="let item of listRoomModel">
<div class="card" style="padding: 10px;">
<div class="card-body">
<img style="height: 200px;
width: 200px;" [src]="item.rpic" class="nav justify-content-center"
alt="...">
</div>
<p class="text-left">{{item.name}}</p>
<p class="text-left">{{item.desc}}</p>
<p class="text-left">{{item.type}}</p>
<p class="text-left">{{item.rname}}</p>
<p class="text-left">{{item.rdesc}}</p>
<div class="d-grid gap-2 a-md-flex justify-content-md-end">
<button class="btn btn-primary" type="button">ยืม</button>
<button class="btn btn-primary" type="button">ยกเลิก</button>
<div class="d-grid gap-2 a-md-flex justify-content-md-end">
<button class="btn btn-primary" type="button">ยืม</button>
<button class="btn btn-primary" type="button">ยกเลิก</button>
</div>
</div>
</div> -->
<!-- <div class="col-sm-3" *ngFor="let item of listEquirment">
<img src="assets\img\notebook.jpg" class="nav justify-content-center" alt="...">
</div>
<p class="text-left">{{item.name}}</p>
<p class="text-left">{{item.desc}}</p>
<p class="text-left">{{item.type}}</p>
<div class="d-grid gap-2 a-md-flex justify-content-md-end">
<button class="btn btn-primary" type="button">ยืม</button>
<button class="btn btn-primary" type="button">ยกเลิก</button>
</div> -->
</div>
<!-- <div class="card-body" style="width: 50rem,">
<div class="col-sm-4" style="width: 200px;">
<img src="assets\img\keyboard.png" class="nav justify-content-center" alt="...">
</div>
<p class="text-left">ชื่อรุ่นอุปกรณ์ : logitech </p>
<p class="text-left">ชื่ออุปกรณ์ : คีย์บอร์ด </p>
<p class="text-left">รายละเอียดอุปกรณ์ </p>
<p class="text-left">ประเภทการเชื่อมต่อ : ไร้สาย</p>
<p class="text-left">อุปกรณ์ที่เสียบพอร์ต : USB</p>
<div class="d-grid gap-2 a-md-flex justify-content-md-end">
<button class="btn btn-primary" type="button">ยืม</button>
<button class="btn btn-primary" type="button">ยกเลิก</button>
</div>
</div> -->
</div>
<div class="d-flex justify-content-between p-2">
......@@ -154,40 +110,70 @@
<div class="row">
<div class="col-sm-12">
<div class="card">
<div class="">
<div class="card-body">
<ng-template #content let-modal>
<div class="modal-header">
<h4 class="modal-title" id="modal-basic-title">เพิ่มรายการ</h4>
<button type="button" class="close" aria-label="Close"
(click)="modal.dismiss('Cross click')">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<form>
<div class="form-group">
<label for="exampleFormControlFile">แนบไฟล์รูปภาพ</label>
<input type="file" class="form-control-file"
id="exampleFormControlFile">
<div class="col-sm-12">
<div class="card">
<div class="card-body">
<div class="modal-header">
<h4 class="modal-title" id="modal-basic-title">เพิ่มรายการ</h4>
<button type="button" class="close" aria-label="Close"
(click)="modal.dismiss('Cross click')">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<form>
<div class="form-group">
<label for="exampleFormControlFile">แนบไฟล์รูปภาพ</label>
<input type="file" class="form-control-file"
id="exampleFormControlFile">
</div>
<div class="form-group">
<label for="exampleFormControlInput1">ชื่อ</label>
<input type="model" class="form-control"
id="exampleFormControlInput1" placeholder="">
</div>
<div class="form-group">
<label for="exampleFormControlSelect1">ประเภท</label>
<select class="form-control" id="exampleFormControlSelect1">
<option>ห้อง</option>
<option>รถ</option>
<option>อุปกรณ์</option>
</select>
</div>
<div class="form-group">
<label for="exampleFormControlTextarea1">รายละเอียด</label>
<textarea class="form-control"
id="exampleFormControlTextarea1" rows="20"></textarea>
</div>
</form>
</div>
</div>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-outline-dark"
(click)="modal.close('Save click')">Save</button>
</div>
</div>
</ng-template>
<div class="modal-footer">
<button type="button" class="btn btn-outline-dark"
(click)="modal.close('Save click')">Save</button>
<button type="button" class="btn btn-outline-dark"
(click)="modal.close('Cancel click')">Cancel</button>
</div>
<button class="btn btn-lg btn-outline-primary"
(click)="open(content)">เพิ่มรายการ</button>
<div class="row">
<div class="col-sm-3" *ngFor="let item of listEquirment">
<div class="card-body">
<img src="assets\img\room.jpg" class="nav justify-content-center" alt="...">
<div class="card" style="padding: 10px;">
<div class="card-body">
<img style="height: 200px;
width: 200px;" [src]="item.pic" class="nav justify-content-center"
alt="...">
</div>
</div>
<p class="text-left">{{item.name}}</p>
......
src/app/pages/equipment/equipment.component.ts
......@@ -8,6 +8,12 @@ interface EquirmentModel {
type: string;
pic: string;
}
interface RoomModel{
rid : number;
rname : string;
rdesc : string;
rpic : string;
}
@Component({
selector: 'app-equipment',
......@@ -50,6 +56,33 @@ export class EquipmentComponent implements OnInit {
pic: "assets/img/keyboard.png"
}
]
listRoomModel: RoomModel[] = [
{
rid: 1,
rname: "ห้องเดียว",
rdesc: "จำนวนคน 25 คน",
rpic: "assets/img/room.jpg"
},
{
rid: 2,
rname: "ห้องคู่",
rdesc: "จำนวนคน 50 คน",
rpic: "assets/img/room.jpg"
},
{
rid: 3,
rname: "ห้องรวม",
rdesc: "จำนวนคน 100 คน",
rpic: "assets/img/room.jpg"
},
{
rid: 4,
rname: "รถ",
rdesc: "รถบริษัท",
rpic: "assets/img/car.jpg"
},
]
collectionSize = this.listEquirment.length;
constructor(private modalService: NgbModal) { }
......
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