Skip to content

M
myhr-portal
Commit c177089a by Nakarin Luankla
Options

UPDATE รายการ Excel หน้าUI ใหม่

parent 1658eb7e
Showing with 48 additions and 3 deletions
src/app/apps/view-list-excel/view-list-excel.component.html
<div class="row">
<div class="row" *ngIf="checkType == '1'">
<div class="col-12">
<div class="card card-body">
<h4 class="card-title">รายการ Excel</h4>
......@@ -11,7 +11,6 @@
<tr>
<th class="text-center" scope="col">#</th>
<th scope="col">รูปภาพ</th>
<!-- <th scope="col">รหัสเอกสาร</th> -->
<th scope="col">ชื่อ</th>
<th scope="col">รายละเอียด</th>
<th scope="col" class="text-center">ลิงค์</th>
......@@ -29,7 +28,6 @@
<tr *ngFor="let data of filterListExcel() | slice: (page-1) * pageSize : (page-1) * pageSize + pageSize ; let i = index">
<td class="text-center">{{i+1}}</td>
<td><img width="100" class="border p-1" src="{{data.getImage()}}" (click)="openEmployeeModal(data.getImage())"></td>
<!-- <td >{{data.id}}</td> -->
<td>{{ data.thName }}</td>
<td>{{ data.thDesc }}</td>
<td class="text-center"><i class="fas fa-link pointer" (click)="openLink(data.link1)"></i></td>
......@@ -60,4 +58,25 @@
</div>
</div>
</div>
<div class="row" *ngIf="checkType != '1'">
<div class="col-12">
<div class="py-3">
<input type="text" class="form-control w-25" placeholder="ค้นหา" [(ngModel)]="search" >
</div>
</div>
<div class="col-4" *ngFor="let data of filterListExcel()">
<div class="card border-5 border border-excel" >
<div class=" p-2 border-5">
<img width="100" class="card-img-top cover" src="{{data.getImage()}}" (click)="openEmployeeModal(data.getImage())">
</div>
<div class="card-body">
<h4 class="card-title">{{ data.thName }}</h4>
<p class="card-text view-detail">{{ data.thDesc }}</p>
<p class="text-info pointer" (click)="downloadFile(data.excelId)"><i class="fas fa-download mr-1"></i> ดาวน์โหลด</p>
<p class="text-info pointer" (click)="openLink(data.link1)"><i class="fas fa-link mr-1"></i> ตัวอย่างวิธีใช้งาน</p>
</div>
</div>
</div>
</div>
\ No newline at end of file
src/index.html
......@@ -16,6 +16,7 @@
href="https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;600;700;800&display=swap"
rel="stylesheet"
/>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.3/font/bootstrap-icons.css">
</head>
<body>
......
src/styles.scss
......@@ -72,6 +72,7 @@ body {
cursor: pointer;
}
.pointer:hover{
font-weight: 700;
color: #2962ff;
}
.my-dialog-img-preview .modal-dialog {
......@@ -82,4 +83,26 @@ body {
border: none !important;
width: auto !important;
}
}
.cover {
border-radius: 4%;
border: 10px solid #ccc;
object-fit: cover;
height: 200px;
}
.border-excel {
border:1px solid #21a366 !important;
border-color: #21a366 !important;
}
.border-5{
border-radius: 5%
}
.no-bg{
background-color: #fff0;
}
.view-detail{
display: -webkit-box;
-webkit-line-clamp: 4;
-webkit-box-orient: vertical;
overflow: hidden;
}
\ No newline at end of file
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