Commit 889a506d by Ooh-Ao

export

parent da09ad77
<div class="row">
<div class="col-12">
<div class="card card-body">
<h4 class="card-title">Employee Table</h4>
<h5 class="card-subtitle">Here is the employee list you can add, edit or delet the emplyee</h5>
<h4 class="card-title">Template List</h4>
<div class="d-flex mb-3 mt-3">
<input type="text" class="form-control w-25" placeholder="Search by Name or Email" [(ngModel)]='searchTerm'>
<button class="btn btn-primary ml-auto" (click)="openModal(editUserModal, null)">Add User</button>
<input type="text" class="form-control w-25" placeholder="Search" [(ngModel)]='searchTerm'>
<!-- <button class="btn btn-primary ml-auto" (click)="openModal(editTemplateModal, null)">Add template</button> -->
</div>
<div class="table-responsive table-bordered">
<table class="table table-striped mb-0 no-wrap v-middle">
......@@ -13,45 +12,41 @@
<tr>
<th class="text-center" scope="col">#</th>
<th scope="col">Name</th>
<th scope="col">Email</th>
<th scope="col">Mobile</th>
<th scope="col">Date of Joining</th>
<th scope="col">Salary</th>
<th scope="col">Projects</th>
<th scope="col">Description</th>
<th scope="col">Upload Date</th>
<th scope="col">Status</th>
<th scope="col">Type</th>
<th scope="col">File</th>
<th scope="col">Action</th>
</tr>
</thead>
<tbody>
<tr *ngFor="let user of filterArray | slice: (page-1) * pageSize : (page-1) * pageSize + pageSize">
<tr *ngFor="let template of filterArray | slice: (page-1) * pageSize : (page-1) * pageSize + pageSize">
<td class="text-center">
{{user.id}}
{{template.id}}
</td>
<td>
<td>{{ template.Name }}</td>
<!-- <td>
<div class="d-flex align-items-center">
<img class="rounded-circle" [src]='user.imagePath' height=" 50px" width="50px">
<img class="rounded-circle" [src]='template.imagePath' height=" 50px" width="50px">
<div class="ml-3">
<p class="font-medium mb-0">{{ user.Name }}</p>
<small>{{user.Position}}</small>
<p class="font-medium mb-0">{{ template.Name }}</p>
<small>{{template.Position}}</small>
</div>
</div>
</td>
<td>{{ user.Email }}</td>
</td> -->
<td>{{ template.Email }}</td>
<td>{{ user.Mobile }}</td>
<td>{{ user.DateOfJoining |date :'fullDate' }}</td>
<td>{{ template.DateOfJoining |date :'fullDate' }}</td>
<td>{{ template.Mobile }}</td>
<td>{{ user.Salary }}</td>
<td>{{ user.Projects }}</td>
<td>{{ template.Salary }}</td>
<td><a style="color: blue;">{{ template.imagePath }}</a></td>
<td>
<a href="javascript: void(0);" (click)="openModal(editUserModal, user)" class="link mr-2"
placement="top" ngbTooltip="Edit">
<i-feather name="edit-2" class="feather-sm"></i-feather>
</a>
<a href="javascript: void(0);" class="link" (click)="deleteUser(user.id)" placement="top"
ngbTooltip="Delete">
<i-feather name="trash-2" class="feather-sm"></i-feather>
<a href="javascript: void(0);" (click)="openModal(editTemplateModal, template)" class="link mr-2"
placement="top" ngbTooltip="Download">
<i-feather name="download" class="feather-sm"></i-feather>
</a>
</td>
</tr>
......@@ -59,18 +54,18 @@
</table>
</div>
<div class="d-flex justify-content-center mt-5">
<ngb-pagination [(page)]="page" [pageSize]="pageSize" [collectionSize]="userList.length"></ngb-pagination>
<ngb-pagination [(page)]="page" [pageSize]="pageSize" [collectionSize]="templateList.length"></ngb-pagination>
</div>
</div>
</div>
</div>
<ng-template #editUserModal let-modal>
<ng-template #editTemplateModal let-modal>
<div class="modal-header">
<h5 class="modal-title" id="editUserLabel">Edit User</h5>
<h5 class="modal-title" id="edittemplateLabel">Edit template</h5>
<button type="button" class="close" (click)="closeBtnClick()" aria-label="Close">
<span aria-hidden="true">&times;</span>
......@@ -80,35 +75,59 @@
<div class="modal-body">
<form [formGroup]="editUser" (ngSubmit)="onSubmit()">
<form [formGroup]="edittemplate" (ngSubmit)="onSubmit()">
<div class="form-group row">
<label for="name" class="col-sm-4 col-form-label">Name</label>
<label for="name" class="col-sm-4 col-form-label">ชื่อ</label>
<div class="col-sm-8">
<input type="text" class="form-control" formControlName="Name" id="name" (blur)=logValidationErrors(editUser)>
<input type="text" class="form-control" formControlName="Name" id="name" (blur)=logValidationErrors(edittemplate)>
<span class="help-block" *ngIf="formsErrors.Name">
{{formsErrors.Name}}
</span>
</div>
</div>
<div class="form-group row">
<label for="name" class="col-sm-4 col-form-label">ไฟล์เทมเพลต</label>
<div class="col-sm-8">
<input type="file" class="form-control">
</div>
</div>
<div class="form-group row">
<label for="position" class="col-sm-4 col-form-label">Position</label>
<label for="position" class="col-sm-4 col-form-label">รายละเอียด</label>
<div class="col-sm-8">
<input type="text" class="form-control" formControlName="Position" id="position"
(blur)=logValidationErrors(editUser)>
<span class="help-block" *ngIf="formsErrors.Position">
{{formsErrors.Position}}
</span>
<textarea class="form-control"></textarea>
</div>
</div>
<div class="form-group row">
<label for="position" class="col-sm-4 col-form-label">ประเภท</label>
<div class="col-sm-8">
<select class="form-control">
<option>Excel</option>
<option>Mail Merge</option>
<option>Resume</option>
</select>
</div>
</div>
<div class="form-group row">
<label for="position" class="col-sm-4 col-form-label">สถานะ</label>
<div class="col-sm-8">
<select class="form-control">
<option>เปิดใช้งาน</option>
<option>ปิดการใช้งาน</option>
</select>
</div>
</div>
<!-- <div class="form-group row">
<label for="email" class="col-sm-4 col-form-label">Email</label>
<div class="col-sm-8">
<input type="email" class="form-control" formControlName="Email" id="email"
(blur)=logValidationErrors(editUser)>
(blur)=logValidationErrors(edittemplate)>
<span class="help-block" *ngIf="formsErrors.Email">
{{formsErrors.Email}}
</span>
......@@ -119,7 +138,7 @@
<label for="mobile" class="col-sm-4 col-form-label">Mobile</label>
<div class="col-sm-8">
<input type="text" class="form-control" formControlName="Mobile" id="mobile"
(blur)=logValidationErrors(editUser)>
(blur)=logValidationErrors(edittemplate)>
<span class="help-block" *ngIf="formsErrors.Mobile">
{{formsErrors.Mobile}}
</span>
......@@ -130,7 +149,7 @@
<label for="doj" class="col-sm-4 col-form-label">Date Of Joining</label>
<div class="col-sm-8">
<input type="date" class="form-control" formControlName="DateOfJoining" [(ngModel)]="joiningDate" id="doj"
(blur)=logValidationErrors(editUser)>
(blur)=logValidationErrors(edittemplate)>
<span class="help-block" *ngIf="formsErrors.DateOfJoining">
{{formsErrors.DateOfJoining}}
</span>
......@@ -141,7 +160,7 @@
<label for="salary" class="col-sm-4 col-form-label">Salary</label>
<div class="col-sm-8">
<input type="number" class="form-control" formControlName="Salary" id="salary"
(blur)=logValidationErrors(editUser)>
(blur)=logValidationErrors(edittemplate)>
<span class="help-block" *ngIf="formsErrors.Salary">
{{formsErrors.Salary}}
</span>
......@@ -152,12 +171,12 @@
<label for="projects" class="col-sm-4 col-form-label">Projects</label>
<div class="col-sm-8">
<input type="number" class="form-control" formControlName="Projects" id="projects"
(blur)=logValidationErrors(editUser)>
(blur)=logValidationErrors(edittemplate)>
<span class="help-block" *ngIf="formsErrors.Projects">
{{formsErrors.Projects}}
</span>
</div>
</div>
</div> -->
......@@ -166,7 +185,7 @@
<div class="modal-footer">
<button type="button" class="btn btn-secondary" (click)="closeBtnClick()">Close</button>
<button type="submit" class="btn btn-primary" [disabled]="editUser.invalid">Save</button>
<button type="submit" class="btn btn-primary" [disabled]="edittemplate.invalid">Save</button>
</div>
......
......@@ -13,7 +13,7 @@ import { User } from '../user';
export class ListTemplateExportComponent implements OnInit {
constructor(private userService: UserService, private fb: FormBuilder, private modalService: NgbModal, private datePipe: DatePipe) {
this.filterArray = this.userList;
this.filterArray = this.templateList;
}
get searchTerm(): string {
return this._searchTerm;
......@@ -26,7 +26,7 @@ export class ListTemplateExportComponent implements OnInit {
pageSize = 7;
userList: User[] = this.userService.getUser();
templateList: User[] = this.userService.getUser();
config: any;
editUser: FormGroup | null = null;
userDetail: User | null = null;
......@@ -78,7 +78,7 @@ export class ListTemplateExportComponent implements OnInit {
}
filter(v: string) {
return this.userList.filter(x => x.Name.toLowerCase().
return this.templateList.filter(x => x.Name.toLowerCase().
indexOf(v.toLowerCase()) !== -1 || x.Email.toLowerCase().indexOf(v.toLowerCase()) !== -1);
}
......
......@@ -4,7 +4,7 @@
<h4 class="card-title">Template</h4>
<h5 class="card-subtitle">Here is the template list you can add, edit or delet the template</h5>
<div class="d-flex mb-3 mt-3">
<input type="text" class="form-control w-25" placeholder="Search by Name or Email" [(ngModel)]='searchTerm'>
<input type="text" class="form-control w-25" placeholder="Search" [(ngModel)]='searchTerm'>
<button class="btn btn-primary ml-auto" (click)="openModal(editTemplateModal, null)">Add template</button>
</div>
<div class="table-responsive table-bordered">
......@@ -27,8 +27,8 @@
<td class="text-center">
{{template.id}}
</td>
<td>
<td>{{ template.Name }}</td>
<!-- <td>
<div class="d-flex align-items-center">
<img class="rounded-circle" [src]='template.imagePath' height=" 50px" width="50px">
<div class="ml-3">
......@@ -36,14 +36,14 @@
<small>{{template.Position}}</small>
</div>
</div>
</td>
</td> -->
<td>{{ template.Email }}</td>
<td>{{ template.Mobile }}</td>
<td>{{ template.DateOfJoining |date :'fullDate' }}</td>
<td>{{ template.Mobile }}</td>
<td>{{ template.Salary }}</td>
<td>{{ template.Projects }}</td>
<td><a style="color: blue;">{{ template.imagePath }}</a></td>
<td>
<a href="javascript: void(0);" (click)="openModal(editTemplateModal, template)" class="link mr-2"
placement="top" ngbTooltip="Edit">
......
......@@ -3,101 +3,46 @@ import { User } from './user';
export const users: User[] = [
{
id: 1,
Name: 'Johnathan Deo',
Name: 'Template Excel ข้อมูลพนักงาน',
Position: 'Seo Expert',
Email: 'r@gmail.com',
Mobile: 9786838,
Email: 'แสดงรายชื่อพนักงานทั้งหมด',
Mobile: 'เปิดใช้งาน',
DateOfJoining: new Date('01-2-2020'),
Salary: 12000,
Salary: 'Excel',
Projects: 10,
imagePath: 'assets/images/users/2.jpg'
imagePath: '111.xlxs'
},
{
id: 2,
Name: 'Mark Zukerburg',
Name: 'หนังสือรับรองเงินเดือน Word',
Position: 'Web Developer',
Email: 'mark@gmail.com',
Mobile: 8786838,
Email: 'เอกสารใบรับรองเงินเดือน',
Mobile: 'เปิดใช้งาน',
DateOfJoining: new Date('04-2-2020'),
Salary: 12000,
Salary: 'Mail Merge',
Projects: 10,
imagePath: 'assets/images/users/3.jpg'
imagePath: '111.doc'
},
{
id: 3,
Name: 'Sam smith',
Name: 'Resume',
Position: 'Web Designer',
Email: 'sam@gmail.com',
Mobile: 7788838,
Email: 'ตัวอย่าง Resume',
Mobile: 'เปิดใช้งาน',
DateOfJoining: new Date('02-2-2020'),
Salary: 12000,
Salary: 'Resume',
Projects: 10,
imagePath: 'assets/images/users/4.jpg'
imagePath: '111.pdf'
},
{
id: 4,
Name: 'John Deo',
Name: 'Template Excel เวลาการทำงาน',
Position: 'Tester',
Email: 'john@gmail.com',
Mobile: 8786838,
Email: 'ข้อมูลเวลาการทำงาน',
Mobile: 'เปิดใช้งาน',
DateOfJoining: new Date('03-2-2020'),
Salary: 12000,
Salary: 'Excel',
Projects: 11,
imagePath: 'assets/images/users/5.jpg'
imagePath: '111.xlxs'
},
{
id: 5,
Name: 'Genilia',
Position: 'Actor',
Email: 'genilia@gmail.com',
Mobile: 8786838,
DateOfJoining: new Date('05-2-2020'),
Salary: 12000,
Projects: 19,
imagePath: 'assets/images/users/6.jpg'
},
{
id: 6,
Name: 'Jack Sparrow',
Position: 'Content Writer',
Email: 'jac@gmail.com',
Mobile: 8786838,
DateOfJoining: new Date('05-21-2020'),
Salary: 12000,
Projects: 5,
imagePath: 'assets/images/users/7.jpg'
},
{
id: 7,
Name: 'Tom Cruise',
Position: 'Actor',
Email: 'tom@gmail.com',
Mobile: 8786838,
DateOfJoining: new Date('02-15-2019'),
Salary: 12000,
Projects: 9,
imagePath: 'assets/images/users/3.jpg'
},
{
id: 8,
Name: 'Hary Porter',
Position: 'Actor',
Email: 'hary@gmail.com',
Mobile: 8786838,
DateOfJoining: new Date('07-3-2019'),
Salary: 12000,
Projects: 7,
imagePath: 'assets/images/users/6.jpg'
},
{
id: 9,
Name: 'Kristen Ronaldo',
Position: 'Player',
Email: 'kristen@gmail.com',
Mobile: 8786838,
DateOfJoining: new Date('01-15-2019'),
Salary: 12000,
Projects: 1,
imagePath: 'assets/images/users/5.jpg'
}
];
......@@ -3,9 +3,9 @@ export class User {
public Name = '';
public Position = '';
public Email = '';
public Mobile = 0;
public Mobile = '';
public DateOfJoining: Date | null = null;
public Salary = 0;
public Salary = '';
public Projects = 0;
public imagePath = '';
}
\ No newline at end of file
}
......@@ -32,12 +32,12 @@
</div>
</div>
</li>
<li class="p-15 m-t-10">
<!-- <li class="p-15 m-t-10">
<a href="javascript:void(0)" class="btn btn-block create-btn text-white no-block d-flex align-items-center">
<i class="fa fa-plus-square"></i>
<span class="hide-menu m-l-5">Create New</span>
</a>
</li>
</li> -->
<!-- First level menu -->
<li class="sidebar-item" [class.active]="showMenu === sidebarnavItem.title"
*ngFor="let sidebarnavItem of sidebarnavItems"
......@@ -89,4 +89,4 @@
</ul>
</li>
</ul>
</nav>
\ No newline at end of file
</nav>
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