Skip to content

B
BookingMyHrManagement
Commit 3a891af1 by DESKTOP-HF0LVOG\myhr
Options

Update หน้ารายการอุปกรณ์

parent 86191ddf
Showing with 146 additions and 92 deletions
src/app/pages/equipment/equipment.component.html
......@@ -17,49 +17,68 @@
<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>
<div class="form-group">
<label for="exampleFormControlInput1">ชื่อ</label>
<input type="model" class="form-control" id="exampleFormControlInput1"
placeholder="">
<ng-template #content let-modal style="padding: 0; ">
<div class=" col-md-12">
<div class="card">
<div class=" card-header">
<h5 class=" title">Add Equirment</h5>
</div>
<div class="form-group">
<label for="exampleFormControlSelect1">ประเภท</label>
<select class="form-control" id="exampleFormControlSelect1">
<option>ห้อง</option>
<option>รถ</option>
<option>อุปกรณ์</option>
</select>
<div class=" card-body">
<form>
<div class=" row">
<div class=" col-md-12">
<div class=" form-group">
<label> Name </label>
<input class=" form-control" placeholder="" type="text"
value="" />
</div>
</div>
</div>
<div class=" row">
<div class=" col-md-6 mb-2">
<div class=" form-group">
<label> Type </label>
<br>
<select class="form-select"
aria-label="Default select example">
<option selected>Open this select type</option>
<option value="1">Rooms</option>
<option value="2">Cars</option>
<option value="3">Company</option>
</select>
</div>
<label> Type </label>
<br>
<select class="form-select"
aria-label="Default select example">
<option selected>Open this select type</option>
<option value="4">IT</option>
<option value="5">Company</option>
</select>
</div>
</div>
<div class=" row">
<div class=" col-md-12">
<div class=" form-group">
<label> Details </label>
<textarea class="form-control"
id="exampleFormControlTextarea1"
rows="3"></textarea>
</div>
</div>
</div>
<label for="exampleFormControlFile">แนบไฟล์รูปภาพ</label>
<input type="file" class="form-control-file"
id="exampleFormControlFile">
</form>
</div>
<div class="form-group">
<label for="exampleFormControlTextarea1">รายละเอียด</label>
<textarea class="form-control" id="exampleFormControlTextarea1"
rows="20"></textarea>
<div class=" card-footer">
<button class=" btn btn-fill btn-danger" type="submit">Save</button>
<button class=" btn btn-fill btn-danger" type="cancel">Cancel</button>
</div>
</form>
</div>
<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>
</div>
</ng-template>
......@@ -68,23 +87,44 @@
<div class="row">
<div class="col-sm-3" *ngFor="let item of listRoomModel">
<div class="card" style="padding: 10px;">
<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.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>
<button class="btn btn-sm btn-primary" type="button">ยืม</button>
<button class="btn btn-sm btn-primary" type="button">ยกเลิก</button>
</div>
</div>
</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">
......@@ -112,77 +152,91 @@
<div class="col-sm-12">
<div class="">
<div class="card-body">
<ng-template #content let-modal>
<div class="col-sm-12">
<ng-template #content let-modal style="padding: 0; ">
<div class=" col-md-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 class=" card-header">
<h5 class=" title">Add Equirment</h5>
</div>
<div class=" card-body">
<form>
<div class=" row">
<div class=" col-md-12">
<div class=" form-group">
<label> Name </label>
<input class=" form-control" placeholder="" type="text"
value="" />
</div>
</div>
<div class="form-group">
<label for="exampleFormControlSelect1">ประเภท</label>
<select class="form-control" id="exampleFormControlSelect1">
<option>ห้อง</option>
<option>รถ</option>
<option>อุปกรณ์</option>
</div>
<div class=" row">
<div class=" col-md-6 mb-2">
<div class=" form-group">
<label> Type </label>
<br>
<select class="form-select"
aria-label="Default select example">
<option selected>Open this select type</option>
<option value="1">Rooms</option>
<option value="2">Cars</option>
<option value="3">Company</option>
</select>
</div>
<label> Type </label>
<br>
<select class="form-select"
aria-label="Default select example">
<option selected>Open this select type</option>
<option value="4">IT</option>
<option value="5">Company</option>
</select>
</div>
<div class="form-group">
<label for="exampleFormControlTextarea1">รายละเอียด</label>
<textarea class="form-control"
id="exampleFormControlTextarea1" rows="20"></textarea>
</div>
<div class=" row">
<div class=" col-md-12">
<div class=" form-group">
<label> Details </label>
<textarea class="form-control"
id="exampleFormControlTextarea1"
rows="3"></textarea>
</div>
</div>
</form>
</div>
</div>
<label for="exampleFormControlFile">แนบไฟล์รูปภาพ</label>
<input type="file" class="form-control-file"
id="exampleFormControlFile">
</form>
</div>
<div class=" card-footer">
<button class=" btn btn-fill btn-danger" type="submit">Save</button>
<button class=" btn btn-fill btn-danger" type="cancel">Cancel</button>
</div>
</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" style="padding: 10px;">
<div class="card" style="
padding: 10px;">
<div class="card-body">
<img style="height: 200px;
width: 200px;" [src]="item.pic" class="nav justify-content-center"
width: 200px;" [src]="item.pic" class="nav justify-content-center"
alt="...">
</div>
</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.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 class="d-grid gap-2 a-md-flex justify-content-md-end">
<button class="btn btn-sm btn-primary" type="button">ยืม</button>
<button class="btn btn-sm btn-primary" type="button">ยกเลิก</button>
</div>
</div>
</div>
</div>
......
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