Skip to content

M
myhr-portal
Commit 6242f8d4 by Nakarin Luankla
Options

UPDATE หน้ารายการเอกสาร ,อนุมัติรายการเอกสาร ยิงAPI

parent b83119d7
Showing with 1957 additions and 860 deletions
src/app/app.module.ts
......@@ -5,7 +5,7 @@ import {
} from '@angular/common';
import { NgModule } from '@angular/core';
import { FormsModule, ReactiveFormsModule } from '@angular/forms';
import { HttpClientModule } from '@angular/common/http';
import { HTTP_INTERCEPTORS, HttpClientModule } from '@angular/common/http';
import { RouterModule } from '@angular/router';
import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
......@@ -36,6 +36,7 @@ import { PerfectScrollbarConfigInterface } from 'ngx-perfect-scrollbar';
import { TranslateLoader, TranslateModule } from '@ngx-translate/core';
import { TranslateHttpLoader } from '@ngx-translate/http-loader';
import { HttpClient } from '@angular/common/http';
import { HttpRequestInterceptor } from './service/http-request.interceptor';
export function HttpLoaderFactory(http: HttpClient) {
......@@ -93,6 +94,11 @@ const DEFAULT_PERFECT_SCROLLBAR_CONFIG: PerfectScrollbarConfigInterface = {
],
providers: [
{
provide: HTTP_INTERCEPTORS,
useClass: HttpRequestInterceptor,
multi: true,
},
{
provide: PERFECT_SCROLLBAR_CONFIG,
useValue: DEFAULT_PERFECT_SCROLLBAR_CONFIG
}
......
src/app/apps/alert-modal/alert-modal.component.html 0 → 100644
<div class="modal-header">
<h5 class="modal-title" id="editLabel">ข้อความแจ้งเตือน</h5>
<button type="button" class="close" (click)="activeModal.dismiss('dismiss')" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<ng-container *ngIf="innerHTML!=undefined then InnerHTML else Message"></ng-container>
<ng-template #Message>
<div class="modal-body">
{{message}}
</div>
</ng-template>
<ng-template #InnerHTML>
<div class="modal-body" [innerHTML]="innerHTML">
</div>
</ng-template>
\ No newline at end of file
src/app/apps/alert-modal/alert-modal.component.spec.ts 0 → 100644
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { AlertModalComponent } from './alert-modal.component';
describe('AlertModalComponent', () => {
let component: AlertModalComponent;
let fixture: ComponentFixture<AlertModalComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ AlertModalComponent ]
})
.compileComponents();
});
beforeEach(() => {
fixture = TestBed.createComponent(AlertModalComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
src/app/apps/alert-modal/alert-modal.component.ts 0 → 100644
import { Component, Input, OnInit } from '@angular/core';
import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
@Component({
selector: 'app-alert-modal',
templateUrl: './alert-modal.component.html',
styleUrls: ['./alert-modal.component.scss']
})
export class AlertModalComponent implements OnInit {
@Input() message: string = ""
@Input() innerHTML?: string
constructor(public activeModal: NgbActiveModal) { }
ngOnInit(): void {
}
}
src/app/apps/approve-course/approve-course.component.html 0 → 100644
<div class="row">
<div class="col-12">
<div class="card card-body">
<h4 class="card-title">รายการหลักสูตร</h4>
<div class="d-flex mb-3 mt-3">
<input type="text" class="form-control w-25" placeholder="ค้นหา" [(ngModel)]="search" >
</div>
<div class="table-responsive">
<table class="table table-striped mb-0 no-wrap v-middle ">
<thead class="bg-info text-white">
<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">ลิงค์</th>
<th scope="col">สถานะ</th>
<th scope="col"></th>
</tr>
</thead>
<tbody>
<tr *ngIf="listCourse.length == 0">
<td colspan="8" class="text-center">ไม่พบข้อมูล</td>
</tr>
<tr *ngFor="let data of filterListCourse() | 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.thumbnail}}"></td>
<td>{{ data.thName }}</td>
<td class="text-wrap">{{ data.thDesc }}</td>
<td>{{data.ctype}}</td>
<td><a href="{{data.link1}}" target="_blank">คลิก</a></td>
<td>{{ getStatus(data.status) }}</td>
<td>
<button type="button" class="btn btn-circle btn-success rounded-circle btn-sm mr-2" (click)="onApprove(data)"><i class="fa fa-check"></i></button>
<button type="button" class="btn btn-circle btn-danger rounded-circle btn-sm mr-2" (click)="onCancelApprove(data)"><i class="fas fa-times"></i></button>
</td>
</tr>
</tbody>
</table>
</div>
<div class="d-flex justify-content-end py-2">
<select class="custom-select m-r-5" style="width: auto" [(ngModel)]="pageSize" (ngModelChange)="page">
<option [ngValue]="10">รายการต่อหน้า: 10</option>
<option [ngValue]="50">รายการต่อหน้า: 50</option>
<option [ngValue]="100">รายการต่อหน้า: 100</option>
</select>
<ngb-pagination [(page)]="page" [pageSize]="pageSize" [collectionSize]="listCourse.length" [maxSize]="3" [rotate]="true">
<ng-template ngbPaginationPrevious>ก่อนหน้า</ng-template>
<ng-template ngbPaginationNext>ถัดไป</ng-template>
</ngb-pagination>
</div>
</div>
</div>
</div>
\ No newline at end of file
src/app/apps/approve-course/approve-course.component.spec.ts 0 → 100644
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { ApproveCourseComponent } from './approve-course.component';
describe('ApproveCourseComponent', () => {
let component: ApproveCourseComponent;
let fixture: ComponentFixture<ApproveCourseComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ ApproveCourseComponent ]
})
.compileComponents();
});
beforeEach(() => {
fixture = TestBed.createComponent(ApproveCourseComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
src/app/apps/approve-course/approve-course.component.ts 0 → 100644
import { Component, OnInit } from '@angular/core';
import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
import { CourseModel } from 'src/app/model/course.model';
import { CourseService } from 'src/app/service/course.service';
import { ConfirmModalComponent } from '../confirm-modal/confirm-modal.component';
import { AlertModalComponent } from '../alert-modal/alert-modal.component';
@Component({
selector: 'app-approve-course',
templateUrl: './approve-course.component.html',
styleUrls: ['./approve-course.component.scss']
})
export class ApproveCourseComponent implements OnInit {
page = 1;
pageSize = 10;
listCourse:CourseModel[]=[]
search:string = ''
constructor(private modalService: NgbModal,private courseService:CourseService) {
}
getStatus(status:string){
if(status == '0'){
return 'รออนุมัติ'
} else if(status == '1'){
return 'เปิดใช้งาน'
} else if(status == '2'){
return 'ไม่อนุมัติ'
}
}
filterListCourse(){
return this.listCourse.filter(x => x.thName.toLowerCase().includes(this.search.toLowerCase())||x.engName.toLowerCase().includes(this.search.toLowerCase()))
}
async getListCourse(){
try {
const data = await this.courseService.getListCourse('0').toPromise();
this.listCourse = data
} catch (error) {
console.error('Error loading data:', error);
}
}
onApprove(item:CourseModel){
const modalRef = this.modalService.open(ConfirmModalComponent, {
centered: true,
backdrop: 'static',
})
modalRef.componentInstance.message = 'คุณต้องการอนุมัติข้อมูลหรือไม่'
modalRef.result.then(result => {
item.status = 1
this.courseService.approve(item).subscribe(result => {
if (result) {
this.openAlertModal('บันทึกข้อมูลสำเร็จ')
this.getListCourse();
} else {
this.openAlertModal('ไม่สามารถบันทึกข้อมูลได้')
}
}, error => {
this.openAlertModal(error.message)
})
}, reject => { })
}
onCancelApprove(item:CourseModel){
const modalRef = this.modalService.open(ConfirmModalComponent, {
centered: true,
backdrop: 'static',
})
modalRef.componentInstance.message = 'คุณต้องการไม่อนุมัติข้อมูลหรือไม่'
modalRef.result.then(result => {
item.status = 2
this.courseService.approve(item).subscribe(result => {
if (result) {
this.openAlertModal('บันทึกข้อมูลสำเร็จ')
this.getListCourse();
} else {
this.openAlertModal('ไม่สามารถบันทึกข้อมูลได้')
}
}, error => {
this.openAlertModal(error.message)
})
}, reject => { })
}
ngOnInit() {
this.getListCourse();
}
openAlertModal(message?: string) {
const modalRef = this.modalService.open(AlertModalComponent, {
centered: true,
backdrop: 'static'
})
modalRef.componentInstance.message = message ? message : ""
modalRef.result.then(result => {
this.modalService.dismissAll()
}, reason => {
this.modalService.dismissAll()
})
}
}
src/app/apps/approve-doc/approve-doc.component.html 0 → 100644
<div class="row">
<div class="col-12">
<div class="card card-body">
<h4 class="card-title">รายการเอกสาร</h4>
<div class="d-flex mb-3 mt-3">
<input type="text" class="form-control w-25" placeholder="ค้นหา" [(ngModel)]="search" >
</div>
<div class="table-responsive">
<table class="table table-striped mb-0 no-wrap v-middle ">
<thead class="bg-info text-white">
<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">ลิงค์</th>
<th scope="col">สถานะ</th>
<!-- <th scope="col">ไฟล์</th> -->
<th scope="col"></th>
</tr>
</thead>
<tbody>
<tr *ngIf="listDoc.length == 0">
<td colspan="7" class="text-center">ไม่พบข้อมูล</td>
</tr>
<tr *ngFor="let data of filterListDoc() | 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.thumbnail}}"></td>
<!-- <td >{{data.id}}</td> -->
<td>{{ data.thName }}</td>
<td>{{ data.thDesc }}</td>
<td><a href="{{data.link1}}" target="_blank">คลิก</a></td>
<td>{{ getStatus(data.status) }}</td>
<!-- <td><a (click)="downloadFile(data.logId)">ดาวน์โหลด</a></td> -->
<td>
<button type="button" class="btn btn-circle btn-success rounded-circle btn-sm mr-2" (click)="onApprove(data)"><i class="fa fa-check"></i></button>
<button type="button" class="btn btn-circle btn-danger rounded-circle btn-sm mr-2" (click)="onCancelApprove(data)"><i class="fas fa-times"></i></button>
</td>
</tr>
</tbody>
</table>
</div>
<div class="d-flex justify-content-end py-2">
<select class="custom-select m-r-5" style="width: auto" [(ngModel)]="pageSize" (ngModelChange)="page">
<option [ngValue]="10">รายการต่อหน้า: 10</option>
<option [ngValue]="50">รายการต่อหน้า: 50</option>
<option [ngValue]="100">รายการต่อหน้า: 100</option>
</select>
<ngb-pagination [(page)]="page" [pageSize]="pageSize" [collectionSize]="listDoc.length" [maxSize]="3" [rotate]="true">
<ng-template ngbPaginationPrevious>ก่อนหน้า</ng-template>
<ng-template ngbPaginationNext>ถัดไป</ng-template>
</ngb-pagination>
</div>
</div>
</div>
</div>
\ No newline at end of file
src/app/apps/approve-doc/approve-doc.component.spec.ts 0 → 100644
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { ApproveDocComponent } from './approve-doc.component';
describe('ApproveDocComponent', () => {
let component: ApproveDocComponent;
let fixture: ComponentFixture<ApproveDocComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ ApproveDocComponent ]
})
.compileComponents();
});
beforeEach(() => {
fixture = TestBed.createComponent(ApproveDocComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
src/app/apps/approve-doc/approve-doc.component.ts 0 → 100644
import { Component, OnInit } from '@angular/core';
import { ConfirmModalComponent } from '../confirm-modal/confirm-modal.component';
import { DocumentModel } from 'src/app/model/document.model';
import { AlertModalComponent } from '../alert-modal/alert-modal.component';
import { DocumentService } from 'src/app/service/document.service';
import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
@Component({
selector: 'app-approve-doc',
templateUrl: './approve-doc.component.html',
styleUrls: ['./approve-doc.component.scss']
})
export class ApproveDocComponent implements OnInit {
page = 1;
pageSize = 10;
listDoc:DocumentModel[]=[]
search:string = ''
constructor(private modalService: NgbModal,private documentService:DocumentService) {
}
getStatus(status:string){
if(status == '0'){
return 'รออนุมัติ'
} else if(status == '1'){
return 'เปิดใช้งาน'
} else if(status == '2'){
return 'ไม่อนุมัติ'
}
}
filterListDoc(){
return this.listDoc.filter(x => x.thName.toLowerCase().includes(this.search.toLowerCase())||x.engName.toLowerCase().includes(this.search.toLowerCase()))
}
async getListDoc(){
try {
const data = await this.documentService.getListDoc('0').toPromise();
this.listDoc = data
} catch (error) {
console.error('Error loading data:', error);
}
}
onApprove(item:DocumentModel){
const modalRef = this.modalService.open(ConfirmModalComponent, {
centered: true,
backdrop: 'static',
})
modalRef.componentInstance.message = 'คุณต้องการอนุมัติข้อมูลหรือไม่'
modalRef.result.then(result => {
item.status = 1
this.documentService.approve(item).subscribe(result => {
if (result) {
this.openAlertModal('บันทึกข้อมูลสำเร็จ')
this.getListDoc();
} else {
this.openAlertModal('ไม่สามารถบันทึกข้อมูลได้')
}
}, error => {
this.openAlertModal(error.message)
})
}, reject => { })
}
onCancelApprove(item:DocumentModel){
const modalRef = this.modalService.open(ConfirmModalComponent, {
centered: true,
backdrop: 'static',
})
modalRef.componentInstance.message = 'คุณต้องการไม่อนุมัติข้อมูลหรือไม่'
modalRef.result.then(result => {
item.status = 2
this.documentService.approve(item).subscribe(result => {
if (result) {
this.openAlertModal('บันทึกข้อมูลสำเร็จ')
this.getListDoc();
} else {
this.openAlertModal('ไม่สามารถบันทึกข้อมูลได้')
}
}, error => {
this.openAlertModal(error.message)
})
}, reject => { })
}
ngOnInit() {
this.getListDoc();
}
openAlertModal(message?: string) {
const modalRef = this.modalService.open(AlertModalComponent, {
centered: true,
backdrop: 'static'
})
modalRef.componentInstance.message = message ? message : ""
modalRef.result.then(result => {
this.modalService.dismissAll()
}, reason => {
this.modalService.dismissAll()
})
}
}
src/app/apps/approve-excel/approve-excel.component.html
<div class="row">
<div class="col-12">
<div class="card card-body">
<h4 class="card-title">รายการ Excel</h4>
<div class="d-flex mb-3 mt-3">
<input type="text" class="form-control w-25" placeholder="ค้นหา" [(ngModel)]='searchTerm'>
<!-- <button class="btn btn-primary ml-auto" (click)="openModal(editTemplateModal)">เพิ่มไฟล์ Excel</button> -->
</div>
<div class="table-responsive table-bordered">
<table class="table table-striped mb-0 no-wrap v-middle ">
<thead>
<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">วันที่อัพโหลด</th>
<th scope="col">สถานะ</th>
<th scope="col">ลิงค์</th>
<th scope="col"></th>
</tr>
</thead>
<tbody>
<tr *ngFor="let data of testdata | 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.img}}"></td>
<td >{{data.id}}</td>
<td>{{ data.name }}</td>
<td>{{ data.detail }}</td>
<td>{{ data.dateupload }}</td>
<td>{{ data.status }}</td>
<td><a href="{{data.link}}" target="_blank">คลิก</a></td>
<td>
<button type="button" class="btn btn-circle btn-success rounded-circle btn-sm mr-2"><i class="fa fa-check"></i></button>
<button type="button" class="btn btn-circle btn-danger rounded-circle btn-sm mr-2"><i class="fas fa-times"></i></button>
</td>
</tr>
</tbody>
</table>
</div>
<div class="d-flex justify-content-center mt-5">
<ngb-pagination [(page)]="page" [pageSize]="pageSize" [collectionSize]="testdata.length"></ngb-pagination>
</div>
<div class="col-12">
<div class="card card-body">
<h4 class="card-title">รายการ Excel</h4>
<div class="d-flex mb-3 mt-3">
<input type="text" class="form-control w-25" placeholder="ค้นหา" [(ngModel)]="search" >
</div>
</div>
</div>
<ng-template #editTemplateModal let-modal>
<div class="modal-header">
<h5 class="modal-title" id="edittemplateLabel">เพิ่มไฟล์ Excel</h5>
<button type="button" class="close" (click)="closeBtnClick()" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<div class="form-group row">
<label for="name" class="col-sm-4 col-form-label">ชื่อรายงาน (ไทย)</label>
<div class="col-sm-8">
<input type="text" class="form-control" id="nameth">
</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="text" class="form-control" id="nameeng">
</div>
</div>
<div class="form-group row">
<label for="position" class="col-sm-4 col-form-label">รายละเอียดรายงาน (ไทย)</label>
<div class="col-sm-8">
<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">
<textarea class="form-control"></textarea>
</div>
</div>
<div class="table-responsive">
<table class="table table-striped mb-0 no-wrap v-middle ">
<thead class="bg-info text-white">
<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">ลิงค์</th>
<th scope="col">สถานะ</th>
<!-- <th scope="col">ไฟล์</th> -->
<th scope="col"></th>
</tr>
</thead>
<tbody>
<tr *ngIf="listExcel.length == 0">
<td colspan="7" class="text-center">ไม่พบข้อมูล</td>
</tr>
<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.thumbnail}}"></td>
<!-- <td >{{data.id}}</td> -->
<td>{{ data.thName }}</td>
<td>{{ data.thDesc }}</td>
<td><a href="{{data.link1}}" target="_blank">คลิก</a></td>
<td>{{ getStatus(data.status) }}</td>
<!-- <td><a (click)="downloadFile(data.logId)">ดาวน์โหลด</a></td> -->
<td>
<button type="button" class="btn btn-circle btn-success rounded-circle btn-sm mr-2" (click)="onApprove(data)"><i class="fa fa-check"></i></button>
<button type="button" class="btn btn-circle btn-danger rounded-circle btn-sm mr-2" (click)="onCancelApprove(data)"><i class="fas fa-times"></i></button>
</td>
</tr>
</tbody>
</table>
</div>
<div class="d-flex justify-content-end py-2">
<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>
<select class="custom-select m-r-5" style="width: auto" [(ngModel)]="pageSize" (ngModelChange)="page">
<option [ngValue]="10">รายการต่อหน้า: 10</option>
<option [ngValue]="50">รายการต่อหน้า: 50</option>
<option [ngValue]="100">รายการต่อหน้า: 100</option>
</select>
<ngb-pagination [(page)]="page" [pageSize]="pageSize" [collectionSize]="listExcel.length" [maxSize]="3" [rotate]="true">
<ng-template ngbPaginationPrevious>ก่อนหน้า</ng-template>
<ng-template ngbPaginationNext>ถัดไป</ng-template>
</ngb-pagination>
<div class="form-group row">
<label for="name" class="col-sm-4 col-form-label">ลิงค์ตัวอย่าง</label>
<div class="col-sm-8">
<input type="text" class="form-control" id="nameeng">
</div>
</div>
<div class="form-group row">
<label for="position" class="col-sm-4 col-form-label">หมายเหตุ</label>
<div class="col-sm-8">
<textarea class="form-control"></textarea>
</div>
</div>
</div>
<div class="modal-footer ">
<button type="submit" class="btn btn-info" [disabled]="edittemplate.invalid">บันทึก</button>
<button type="button" class="btn btn-danger" (click)="closeBtnClick()">ปิด</button>
</div>
</div>
</ng-template>
\ No newline at end of file
</div>
</div>
\ No newline at end of file
src/app/apps/approve-excel/approve-excel.component.ts
import { Component, OnInit } from '@angular/core';
import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
import { ExcelModel } from 'src/app/model/excel.model';
import { ExcelService } from 'src/app/service/excel.service';
import { AlertModalComponent } from '../alert-modal/alert-modal.component';
import { ConfirmModalComponent } from '../confirm-modal/confirm-modal.component';
@Component({
selector: 'app-approve-excel',
......@@ -7,81 +11,86 @@ import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
styleUrls: ['./approve-excel.component.scss']
})
export class ApproveExcelComponent implements OnInit {
get searchTerm(): string {
return this._searchTerm;
page = 1;
pageSize = 10;
listExcel:ExcelModel[]=[]
search:string = ''
constructor(private modalService: NgbModal,private excelService:ExcelService) {
}
set searchTerm(val: string) {
this._searchTerm = val;
this.filterArray = this.filter(val);
getStatus(status:string){
if(status == '0'){
return 'รออนุมัติ'
} else if(status == '1'){
return 'เปิดใช้งาน'
} else if(status == '2'){
return 'ไม่อนุมัติ'
}
}
page = 1;
pageSize = 7;
filterArray: {
id:string;
name: String;
detail: String;
dateupload: String;
status: String;
link: String;
}[] = [];
_searchTerm = '';
testdata: {
id:string;
name: String;
detail: String;
dateupload: String;
status: String;
link: String;
img:string
}[] = [];
constructor(private modalService: NgbModal) {
filterListExcel(){
return this.listExcel.filter(x => x.thName.toLowerCase().includes(this.search.toLowerCase())||x.engName.toLowerCase().includes(this.search.toLowerCase()))
}
ngOnInit() {
this.testdata = [
{
id:'2024-1101',
name: "Template Excel ข้อมูลพนักงาน",
detail: "แสดงรายชื่อพนักงานทั้งหมด",
dateupload: "11/06/2024",
status: "รออนุมัติ",
link: "https://www.youtube.com/watch?v=wOK9j3q20tw",
img:'assets/images/phototest/9a60ef19-7813-4094-bc45-17b7d9decc70.jpg'
},
{
id:'2024-1102',
name: "หนังสือรับรองเงินเดือน Word",
detail: "เอกสารใบรับรองเงินเดือน",
dateupload: "10/06/2024",
status: "รออนุมัติ",
link: "https://www.youtube.com/watch?v=wOK9j3q20tw",
img:'assets/images/phototest/3daddc9f-f69a-470b-8275-7db59db1a89b.jpg'
},
];
this.filterArray = this.testdata
async getListExcel(){
try {
const data = await this.excelService.getListExcel('0').toPromise();
this.listExcel = data
} catch (error) {
console.error('Error loading data:', error);
}
}
filter(v: string) {
return this.testdata.filter(x => x.name.toLowerCase().indexOf(v.toLowerCase()) !== -1);
onApprove(item:ExcelModel){
const modalRef = this.modalService.open(ConfirmModalComponent, {
centered: true,
backdrop: 'static',
})
modalRef.componentInstance.message = 'คุณต้องการอนุมัติข้อมูลหรือไม่'
modalRef.result.then(result => {
item.status = 1
this.excelService.approve(item).subscribe(result => {
if (result) {
this.openAlertModal('บันทึกข้อมูลสำเร็จ')
this.getListExcel();
} else {
this.openAlertModal('ไม่สามารถบันทึกข้อมูลได้')
}
}, error => {
this.openAlertModal(error.message)
})
}, reject => { })
}
openModal(targetModal: NgbModal,) {
this.modalService.open(targetModal, {
onCancelApprove(item:ExcelModel){
const modalRef = this.modalService.open(ConfirmModalComponent, {
centered: true,
backdrop: 'static',
size: 'lg'
});
})
modalRef.componentInstance.message = 'คุณต้องการไม่อนุมัติข้อมูลหรือไม่'
modalRef.result.then(result => {
item.status = 2
this.excelService.approve(item).subscribe(result => {
if (result) {
this.openAlertModal('บันทึกข้อมูลสำเร็จ')
this.getListExcel();
} else {
this.openAlertModal('ไม่สามารถบันทึกข้อมูลได้')
}
}, error => {
this.openAlertModal(error.message)
})
}, reject => { })
}
ngOnInit() {
this.getListExcel();
}
closeBtnClick() {
this.modalService.dismissAll();
this.ngOnInit();
openAlertModal(message?: string) {
const modalRef = this.modalService.open(AlertModalComponent, {
centered: true,
backdrop: 'static'
})
modalRef.componentInstance.message = message ? message : ""
modalRef.result.then(result => {
this.modalService.dismissAll()
}, reason => {
this.modalService.dismissAll()
})
}
}
src/app/apps/apps.module.ts
......@@ -85,6 +85,11 @@ import { PortalCreateCategoryComponent } from './portal-create-category/portal-c
import { ListDocComponent } from './list-doc/list-doc.component';
import { ApproveExcelComponent } from './approve-excel/approve-excel.component';
import { ListExcelComponent } from './list-excell/list-excell.component';
import { ConfirmModalComponent } from './confirm-modal/confirm-modal.component';
import { AlertModalComponent } from './alert-modal/alert-modal.component';
import { ListCourseComponent } from './list-course/list-course.component';
import { ApproveDocComponent } from './approve-doc/approve-doc.component';
import { ApproveCourseComponent } from './approve-course/approve-course.component';
@NgModule({
......@@ -147,7 +152,12 @@ import { ListExcelComponent } from './list-excell/list-excell.component';
PortalCreateCategoryComponent,
ListDocComponent,
ApproveExcelComponent,
ListExcelComponent
ListExcelComponent,
ConfirmModalComponent,
AlertModalComponent,
ListCourseComponent,
ApproveDocComponent,
ApproveCourseComponent
],
providers: [
ContactService,
......
src/app/apps/apps.routing.ts
......@@ -40,6 +40,9 @@ import { PortalCreateCategoryComponent } from "./portal-create-category/portal-c
import { ListDocComponent } from "./list-doc/list-doc.component";
import { ApproveExcelComponent } from "./approve-excel/approve-excel.component";
import { ListExcelComponent } from "./list-excell/list-excell.component";
import { ListCourseComponent } from "./list-course/list-course.component";
import { ApproveDocComponent } from "./approve-doc/approve-doc.component";
import { ApproveCourseComponent } from "./approve-course/approve-course.component";
export const AppsRoutes: Routes = [
{
path: "",
......@@ -185,9 +188,9 @@ export const AppsRoutes: Routes = [
path: "portal-category-list-approve",
component: PortalCategoryListApproveComponent,
data: {
title: "Category List Approve",
title: "รายการเอกสารรอการอนุมัติ",
urls: [
{ title: "Category List Approve" },
{ title: "รายการเอกสารรอการอนุมัติ" },
],
},
},
......@@ -195,10 +198,32 @@ export const AppsRoutes: Routes = [
path: "approve-excel",
component: ApproveExcelComponent,
data: {
title: "Approve Excel",
title: "อนุมัติ Excel",
urls: [
{ title: "Category List Approve" ,url: "apps/portal-category-list-approve"},
{ title: "Approve Excel" },
{ title: "รายการเอกสารรอการอนุมัติ" ,url: "apps/portal-category-list-approve"},
{ title: "อนุมัติ Excel" },
],
},
},
{
path: "approve-doc",
component: ApproveDocComponent,
data: {
title: "อนุมัติเอกสาร",
urls: [
{ title: "รายการเอกสารรอการอนุมัติ" ,url: "apps/portal-category-list-approve"},
{ title: "อนุมัติเอกสาร" },
],
},
},
{
path: "approve-course",
component: ApproveCourseComponent,
data: {
title: "อนุมัติหลักสูตร",
urls: [
{ title: "รายการเอกสารรอการอนุมัติ" ,url: "apps/portal-category-list-approve"},
{ title: "อนุมัติหลักสูตร" },
],
},
},
......@@ -216,9 +241,9 @@ export const AppsRoutes: Routes = [
path: "portal-category-list",
component: PortalCategoryListComponent,
data: {
title: "Category List",
title: "รายการเอกสาร",
urls: [
{ title: "Category List" },
{ title: "รายการเอกสาร" },
],
},
},
......@@ -236,9 +261,9 @@ export const AppsRoutes: Routes = [
path: "portal-create-category",
component: PortalCreateCategoryComponent,
data: {
title: "Create Category",
title: "รายการเอกสาร",
urls: [
{ title: "Create Category" },
{ title: "รายการเอกสาร" },
],
},
},
......@@ -266,10 +291,10 @@ export const AppsRoutes: Routes = [
path: "list-doc",
component: ListDocComponent,
data: {
title: "List",
title: "รายการเอกสาร",
urls: [
{ title: "Create Category", url: "apps/portal-create-category" },
{ title: "List" },
{ title: "รายการเอกสาร", url: "apps/portal-create-category" },
{ title: "รายการเอกสาร" },
],
},
},
......@@ -277,10 +302,21 @@ export const AppsRoutes: Routes = [
path: "list-excel",
component: ListExcelComponent,
data: {
title: "List Excell",
title: "รายการ Excel",
urls: [
{ title: "รายการเอกสาร", url: "apps/portal-create-category" },
{ title: "รายการ Excel" },
],
},
},
{
path: "list-course",
component: ListCourseComponent,
data: {
title: "รายการหลักสูตร",
urls: [
{ title: "Create Category", url: "apps/portal-create-category" },
{ title: "List" },
{ title: "รายการเอกสาร", url: "apps/portal-create-category" },
{ title: "รายการหลักสูตร" },
],
},
},
......
src/app/apps/confirm-modal/confirm-modal.component.html 0 → 100644
<div class="modal-header">
<h5 class="modal-title" id="editLabel">ข้อความแจ้งเตือน</h5>
<button type="button" class="close" (click)="activeModal.dismiss('dismiss')" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
{{message}}
</div>
<div class="modal-footer">
<button type="button" class="btn btn-info" (click)="activeModal.close('close')">
ยืนยัน
</button>
<button type="button" class="btn btn-danger" (click)="activeModal.dismiss('dismiss')">
ยกเลิก
</button>
</div>
\ No newline at end of file
src/app/apps/confirm-modal/confirm-modal.component.spec.ts 0 → 100644
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { ConfirmModalComponent } from './confirm-modal.component';
describe('ConfirmModalComponent', () => {
let component: ConfirmModalComponent;
let fixture: ComponentFixture<ConfirmModalComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ ConfirmModalComponent ]
})
.compileComponents();
});
beforeEach(() => {
fixture = TestBed.createComponent(ConfirmModalComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
src/app/apps/confirm-modal/confirm-modal.component.ts 0 → 100644
import { Component, Input, OnInit } from '@angular/core';
import { NgbActiveModal } from '@ng-bootstrap/ng-bootstrap';
@Component({
selector: 'app-confirm-modal',
templateUrl: './confirm-modal.component.html',
styleUrls: ['./confirm-modal.component.scss']
})
export class ConfirmModalComponent implements OnInit {
@Input() message: string = "";
constructor(public activeModal: NgbActiveModal) { }
ngOnInit(): void {
}
}
src/app/apps/list-course/list-course.component.html 0 → 100644
<div class="row">
<div class="col-12">
<div class="card card-body">
<h4 class="card-title">รายการหลักสูตร</h4>
<div class="d-flex mb-3 mt-3">
<input type="text" class="form-control w-25" placeholder="ค้นหา" [(ngModel)]="search" >
<button class="btn btn-primary ml-auto" (click)="openModal(editTemplateModal)">เพิ่มไฟล์หลักสูตร</button>
</div>
<div class="table-responsive ">
<table class="table table-striped mb-0 no-wrap v-middle ">
<thead class="bg-info text-white">
<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">ลิงค์</th>
<th scope="col">สถานะ</th>
<th scope="col"></th>
</tr>
</thead>
<tbody>
<tr *ngFor="let data of filterListCourse() | 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.thumbnail}}"></td>
<!-- <td >{{data.id}}</td> -->
<td>{{ data.thName }}</td>
<td class="text-wrap">{{ data.thDesc }}</td>
<td>{{data.ctype}}</td>
<td><a href="{{data.link1}}" target="_blank">คลิก</a></td>
<td>{{ getStatus(data.status) }}</td>
<!-- <td><a (click)="downloadFile(data.logId)">ดาวน์โหลด</a></td> -->
<td>
<button type="button" [disabled]="data.status != 0" class="btn btn-circle btn-primary rounded-circle btn-sm mr-2" (click)="openModal(editTemplateModal,data)" placement="top" ngbTooltip="แก้ไข">
<i class="fas fa-edit"></i>
</button>
<button type="button" [disabled]="data.status != 0" class="btn btn-circle btn-danger rounded-circle btn-sm mr-2" (click)="deleteFile(data)" placement="top" ngbTooltip="ลบ">
<i class="fas fa-trash-alt"></i>
</button>
<!-- <a href="javascript: void(0);" (click)="openModal(editTemplateModal,data)" class="link mr-2"
placement="top" ngbTooltip="แก้ไข">
<i-feather name="edit-2" class="feather-sm text-primary"></i-feather>
</a>
<a href="javascript: void(0);" class="link" (click)="deleteFile(data)" placement="top"
ngbTooltip="ลบ">
<i-feather name="trash-2" class="feather-sm text-danger"></i-feather>
</a> -->
</td>
</tr>
</tbody>
</table>
</div>
<div class="d-flex justify-content-end py-2">
<select class="custom-select m-r-5" style="width: auto" [(ngModel)]="pageSize" (ngModelChange)="page">
<option [ngValue]="10">รายการต่อหน้า: 10</option>
<option [ngValue]="50">รายการต่อหน้า: 50</option>
<option [ngValue]="100">รายการต่อหน้า: 100</option>
</select>
<ngb-pagination [(page)]="page" [pageSize]="pageSize" [collectionSize]="listCourse.length" [maxSize]="3" [rotate]="true">
<ng-template ngbPaginationPrevious>ก่อนหน้า</ng-template>
<ng-template ngbPaginationNext>ถัดไป</ng-template>
</ngb-pagination>
</div>
</div>
</div>
</div>
<ng-template #editTemplateModal let-modal>
<div class="modal-header">
<h5 class="modal-title" id="edittemplateLabel">{{checkEdit?"แก้ไขไฟล์หลักสูตร":"เพิ่มไฟล์หลักสูตร"}}</h5>
<button type="button" class="close" (click)="closeBtnClick()" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<div class="form-group row">
<label for="nameth" class="col-sm-4 col-form-label">ชื่อหลักสูตร (ไทย)</label>
<div class="col-sm-8">
<input type="text" class="form-control" id="nameth" [(ngModel)]="modelCourse.thName">
</div>
</div>
<div class="form-group row">
<label for="nameeng" class="col-sm-4 col-form-label">ชื่อหลักสูตร (อังกฤษ)</label>
<div class="col-sm-8">
<input type="text" class="form-control" id="nameeng" [(ngModel)]="modelCourse.engName">
</div>
</div>
<div class="form-group row">
<label for="position" class="col-sm-4 col-form-label">รายละเอียดหลักสูตร (ไทย)</label>
<div class="col-sm-8">
<textarea class="form-control" [(ngModel)]="modelCourse.thDesc"></textarea>
</div>
</div>
<div class="form-group row">
<label for="position" class="col-sm-4 col-form-label">รายละเอียดหลักสูตร (อังกฤษ)</label>
<div class="col-sm-8">
<textarea class="form-control" [(ngModel)]="modelCourse.engDesc"></textarea>
</div>
</div>
<div class="form-group row">
<label for="position" class="col-sm-4 col-form-label">วัตถุประสงค์</label>
<div class="col-sm-8">
<textarea class="form-control" [(ngModel)]="modelCourse.objective"></textarea>
</div>
</div>
<div class="form-group row">
<label for="position" class="col-sm-4 col-form-label">ตัวอย่างบนเรียน</label>
<div class="col-sm-8">
<textarea class="form-control" [(ngModel)]="modelCourse.courseOutline"></textarea>
</div>
</div>
<div class="form-group row">
<label for="position" class="col-sm-4 col-form-label">ประเภทหลักสูตร</label>
<div class="col-sm-8">
<input type="text" class="form-control" [(ngModel)]="modelCourse.courseType" >
</div>
</div>
<div class="form-group row">
<label for="position" class="col-sm-4 col-form-label">ระดับผู้เรียน</label>
<div class="col-sm-8">
<input type="text" class="form-control" [(ngModel)]="modelCourse.courseLevel" >
</div>
</div>
<div class="form-group row">
<label for="position" class="col-sm-4 col-form-label">ระยะเวลาในการเรียนรู้ (ชั่วโมง)</label>
<div class="col-sm-8">
<input type="text" class="form-control" [(ngModel)]="modelCourse.courseTime">
</div>
</div>
<div class="form-group row">
<label for="position" class="col-sm-4 col-form-label">ชื่อผู้สอน</label>
<div class="col-sm-8">
<input type="text" class="form-control" [(ngModel)]="modelCourse.courseTrainer" >
</div>
</div>
<div class="form-group row">
<label for="position" class="col-sm-4 col-form-label">ประวัติผู้สอน</label>
<div class="col-sm-8">
<textarea class="form-control" [(ngModel)]="modelCourse.courseTrainerDetail"></textarea>
</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" (change)="onSelectFile($event)">
</div>
</div>
<div class="form-group row">
<label for="name" class="col-sm-4 col-form-label">Link รูปภาพตัวอย่างรายงาน</label>
<div class="col-sm-8">
<input type="text" class="form-control"[(ngModel)]="modelCourse.thumbnail">
</div>
</div>
<div class="form-group row">
<label for="name" class="col-sm-4 col-form-label">Link ตัวอย่าง</label>
<div class="col-sm-8">
<input type="text" class="form-control" id="nameeng" [(ngModel)]="modelCourse.link1">
</div>
</div>
<div class="form-group row">
<label for="position" class="col-sm-4 col-form-label">หมายเหตุ</label>
<div class="col-sm-8">
<textarea class="form-control"[(ngModel)]="modelCourse.remark"></textarea>
</div>
</div>
<div class="modal-footer ">
<button type="submit" class="btn btn-info" (click)="onSumit()" [disabled]="!modelCourse.tname||!modelCourse.ename">บันทึก</button>
<button type="button" class="btn btn-danger" (click)="closeBtnClick()">ปิด</button>
</div>
</div>
</ng-template>
\ No newline at end of file
src/app/apps/list-course/list-course.component.spec.ts 0 → 100644
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { ListCourseComponent } from './list-course.component';
describe('ListCourseComponent', () => {
let component: ListCourseComponent;
let fixture: ComponentFixture<ListCourseComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ ListCourseComponent ]
})
.compileComponents();
});
beforeEach(() => {
fixture = TestBed.createComponent(ListCourseComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
src/app/apps/list-course/list-course.component.ts 0 → 100644
import { Component, OnInit } from '@angular/core';
import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
import { ExcelService } from 'src/app/service/excel.service';
import { ConfirmModalComponent } from '../confirm-modal/confirm-modal.component';
import { AlertModalComponent } from '../alert-modal/alert-modal.component';
import { CourseModel } from 'src/app/model/course.model';
import { CourseService } from 'src/app/service/course.service';
@Component({
selector: 'app-list-course',
templateUrl: './list-course.component.html',
styleUrls: ['./list-course.component.scss']
})
export class ListCourseComponent implements OnInit {
page = 1;
pageSize = 10;
listCourse:CourseModel[]=[]
modelCourse:CourseModel = new CourseModel({});
checkEdit:boolean = false
search:string = ''
constructor(private modalService: NgbModal,private courseService:CourseService) {
}
onSelectFile(event:any) {
if (event.target.files && event.target.files[0]) {
let reader = new FileReader();
reader.readAsDataURL(event.target.files[0]); // read file as data url
reader.onload = (event) => { // called once readAsDataURL is completed
if(event){
let base64 = event.target!.result as string
this.modelCourse.courseObj = base64.split(',')[1];
}
}
}
}
async downloadFile(logId:string){
try {
const data = await this.courseService.downloadFile(logId).toPromise();
} catch (error) {
console.error('Error loading data:', error);
}
}
deleteFile(item:CourseModel){
const modalRef = this.modalService.open(ConfirmModalComponent, {
centered: true,
backdrop: 'static',
})
modalRef.componentInstance.message = 'คุณต้องการลบข้อมูลหรือไม่'
modalRef.result.then(result => {
this.courseService.deleteCourse(item).subscribe(result => {
if (result) {
this.openAlertModal('ลบข้อมูลสำเร็จ')
this.getListCourse();
} else {
this.openAlertModal('ไม่สามารถลบข้อมูลได้')
}
}, error => {
this.openAlertModal(error.message)
})
}, reject => { })
}
openAlertModal(message?: string) {
const modalRef = this.modalService.open(AlertModalComponent, {
centered: true,
backdrop: 'static'
})
modalRef.componentInstance.message = message ? message : ""
modalRef.result.then(result => {
this.modalService.dismissAll()
}, reason => {
this.modalService.dismissAll()
})
}
onUpdate(){
const modalRef = this.modalService.open(ConfirmModalComponent, {
centered: true,
backdrop: 'static',
})
modalRef.componentInstance.message = 'คุณต้องการอัพเดทข้อมูลหรือไม่'
modalRef.result.then(result => {
console.log(this.modelCourse);
this.courseService.createCourse(this.modelCourse).subscribe(result => {
if (result) {
this.openAlertModal('อัพเดทข้อมูลสำเร็จ')
this.getListCourse();
} else {
this.openAlertModal('ไม่สามารถอัพเดทข้อมูลได้')
}
}, error => {
this.openAlertModal(error.message)
})
}, reject => { })
}
onCreate(){
const modalRef = this.modalService.open(ConfirmModalComponent, {
centered: true,
backdrop: 'static',
})
modalRef.componentInstance.message = 'คุณต้องการบันทึกข้อมูลหรือไม่'
modalRef.result.then(result => {
this.courseService.createCourse(this.modelCourse).subscribe(result => {
if (result) {
this.openAlertModal('บันทึกข้อมูลสำเร็จ')
this.getListCourse();
} else {
this.openAlertModal('ไม่สามารถสร้างเอกสารได้')
}
}, error => {
this.openAlertModal(error.message)
})
}, reject => { })
}
onSumit() {
if(this.checkEdit){
this.onUpdate();
}else{
this.onCreate();
}
}
async getExcelById(targetModal: NgbModal,id:string){
try {
const data = await this.courseService.getCourseById(id).toPromise();
this.modelCourse = new CourseModel(data)
if(data){
this.modalService.open(targetModal, {
centered: true,
backdrop: 'static',
size: 'lg'
});
}
} catch (error) {
console.error('Error loading data:', error);
}
}
openModal(targetModal: NgbModal,item?:CourseModel) {
if(item){
this.getExcelById(targetModal,item.logId)
this.checkEdit = true
}else{
this.modelCourse = new CourseModel({});
this.checkEdit = false
this.modalService.open(targetModal, {
centered: true,
backdrop: 'static',
size: 'lg'
});
}
}
getStatus(status:string){
if(status == '0'){
return 'รออนุมัติ'
} else if(status == '1'){
return 'เปิดใช้งาน'
} else if(status == '2'){
return 'ไม่อนุมัติ'
}
}
async getListCourse(){
try {
const data = await this.courseService.getListCourse().toPromise();
this.listCourse = data
} catch (error) {
console.error('Error loading data:', error);
}
}
filterListCourse(){
return this.listCourse.filter(x => x.thName.toLowerCase().includes(this.search.toLowerCase())||x.engName.toLowerCase().includes(this.search.toLowerCase()))
}
ngOnInit() {
this.getListCourse();
}
closeBtnClick() {
this.modalService.dismissAll();
this.ngOnInit();
}
}
src/app/apps/list-doc/list-doc.component.ts
import { Component, OnInit } from '@angular/core';
import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
import { FormBuilder, FormGroup, Validators } from '@angular/forms';
import { DatePipe } from '@angular/common';
import { UserService } from '../users/userService.service';
import { User } from '../users/user';
import { ConfirmModalComponent } from '../confirm-modal/confirm-modal.component';
import { AlertModalComponent } from '../alert-modal/alert-modal.component';
import { DocumentService } from 'src/app/service/document.service';
import { DocumentModel } from 'src/app/model/document.model';
@Component({
selector: 'app-list-doc',
......@@ -11,89 +11,166 @@ import { User } from '../users/user';
styleUrls: ['./list-doc.component.scss']
})
export class ListDocComponent implements OnInit {
get searchTerm(): string {
return this._searchTerm;
page = 1;
pageSize = 10;
listDoc:DocumentModel[]=[]
modelDoc:DocumentModel = new DocumentModel({});
checkEdit:boolean = false
search:string = ''
constructor(private modalService: NgbModal,private documentService:DocumentService) {
}
set searchTerm(val: string) {
this._searchTerm = val;
this.filterArray = this.filter(val);
onSelectFile(event:any) {
if (event.target.files && event.target.files[0]) {
let reader = new FileReader();
reader.readAsDataURL(event.target.files[0]); // read file as data url
reader.onload = (event) => { // called once readAsDataURL is completed
if(event){
let base64 = event.target!.result as string
this.modelDoc.doclObj = base64.split(',')[1];
}
}
}
}
page = 1;
pageSize = 7;
filterArray: {
id:string;
name: String;
detail: String;
dateupload: String;
status: String;
link: String;
}[] = [];
_searchTerm = '';
testdata: {
id:string;
name: String;
detail: String;
dateupload: String;
status: String;
link: String;
}[] = [];
constructor(private modalService: NgbModal) {
async downloadFile(logId:string){
try {
const data = await this.documentService.downloadFile(logId).toPromise();
} catch (error) {
console.error('Error loading data:', error);
}
}
deleteFile(item:DocumentModel){
const modalRef = this.modalService.open(ConfirmModalComponent, {
centered: true,
backdrop: 'static',
})
modalRef.componentInstance.message = 'คุณต้องการลบข้อมูลหรือไม่'
modalRef.result.then(result => {
this.documentService.deleteExcel(item).subscribe(result => {
if (result) {
this.openAlertModal('ลบข้อมูลสำเร็จ')
this.getListDoc();
} else {
this.openAlertModal('ไม่สามารถลบข้อมูลได้')
}
}, error => {
this.openAlertModal(error.message)
})
}, reject => { })
ngOnInit() {
this.testdata = [
{
id:'2024-1101',
name: "Template Excel ข้อมูลพนักงาน",
detail: "แสดงรายชื่อพนักงานทั้งหมด",
dateupload: "11/06/2024",
status: "รออนุมัติ",
link: "https://www.youtube.com/watch?v=wOK9j3q20tw",
},
{
id:'2024-1102',
name: "หนังสือรับรองเงินเดือน Word",
detail: "เอกสารใบรับรองเงินเดือน",
dateupload: "10/06/2024",
status: "รออนุมัติ",
link: "https://www.youtube.com/watch?v=wOK9j3q20tw",
},
{
id:'2024-1103',
name: "Resume",
detail: "ตัวอย่าง Resume",
dateupload: "09/06/2024",
status: "เปิดใช้งาน",
link: "https://www.youtube.com/watch?v=wOK9j3q20tw",
},
{
id:'2024-1104',
name: "Template Excel เวลาการทำงาน",
detail: "ข้อมูลเวลาการทำงาน ",
dateupload: "09/06/2024",
status: "ไม่อนุมัติ",
link: "https://www.youtube.com/watch?v=wOK9j3q20tw",
},
];
this.filterArray = this.testdata
}
filter(v: string) {
return this.testdata.filter(x => x.name.toLowerCase().indexOf(v.toLowerCase()) !== -1);
openAlertModal(message?: string) {
const modalRef = this.modalService.open(AlertModalComponent, {
centered: true,
backdrop: 'static'
})
modalRef.componentInstance.message = message ? message : ""
modalRef.result.then(result => {
this.modalService.dismissAll()
}, reason => {
this.modalService.dismissAll()
})
}
openModal(targetModal: NgbModal, user: User | null) {
this.modalService.open(targetModal, {
onUpdate(){
const modalRef = this.modalService.open(ConfirmModalComponent, {
centered: true,
backdrop: 'static',
size: 'lg'
});
})
modalRef.componentInstance.message = 'คุณต้องการอัพเดทข้อมูลหรือไม่'
modalRef.result.then(result => {
console.log(this.modelDoc);
this.documentService.createDoc(this.modelDoc).subscribe(result => {
if (result) {
this.openAlertModal('อัพเดทข้อมูลสำเร็จ')
this.getListDoc();
} else {
this.openAlertModal('ไม่สามารถอัพเดทข้อมูลได้')
}
}, error => {
this.openAlertModal(error.message)
})
}, reject => { })
}
onCreate(){
const modalRef = this.modalService.open(ConfirmModalComponent, {
centered: true,
backdrop: 'static',
})
modalRef.componentInstance.message = 'คุณต้องการบันทึกข้อมูลหรือไม่'
modalRef.result.then(result => {
this.documentService.createDoc(this.modelDoc).subscribe(result => {
if (result) {
this.openAlertModal('บันทึกข้อมูลสำเร็จ')
this.getListDoc();
} else {
this.openAlertModal('ไม่สามารถสร้างเอกสารได้')
}
}, error => {
this.openAlertModal(error.message)
})
}, reject => { })
}
onSumit() {
if(this.checkEdit){
this.onUpdate();
}else{
this.onCreate();
}
}
async getExcelById(targetModal: NgbModal,id:string){
try {
const data = await this.documentService.getDocById(id).toPromise();
this.modelDoc = new DocumentModel(data)
if(data){
this.modalService.open(targetModal, {
centered: true,
backdrop: 'static',
size: 'lg'
});
}
} catch (error) {
console.error('Error loading data:', error);
}
}
openModal(targetModal: NgbModal,item?:DocumentModel) {
if(item){
this.getExcelById(targetModal,item.logId)
this.checkEdit = true
}else{
this.modelDoc = new DocumentModel({});
this.checkEdit = false
this.modalService.open(targetModal, {
centered: true,
backdrop: 'static',
size: 'lg'
});
}
}
getStatus(status:string){
if(status == '0'){
return 'รออนุมัติ'
} else if(status == '1'){
return 'เปิดใช้งาน'
} else if(status == '2'){
return 'ไม่อนุมัติ'
}
}
async getListDoc(){
try {
const data = await this.documentService.getListDoc().toPromise();
this.listDoc = data
} catch (error) {
console.error('Error loading data:', error);
}
}
filterListDoc(){
return this.listDoc.filter(x => x.thName.toLowerCase().includes(this.search.toLowerCase())||x.engName.toLowerCase().includes(this.search.toLowerCase()))
}
ngOnInit() {
this.getListDoc();
}
......@@ -101,4 +178,5 @@ export class ListDocComponent implements OnInit {
this.modalService.dismissAll();
this.ngOnInit();
}
}
src/app/apps/list-excell/list-excell.component.html
......@@ -3,52 +3,60 @@
<div class="card card-body">
<h4 class="card-title">รายการ Excel</h4>
<div class="d-flex mb-3 mt-3">
<input type="text" class="form-control w-25" placeholder="ค้นหา" [(ngModel)]='searchTerm'>
<input type="text" class="form-control w-25" placeholder="ค้นหา" [(ngModel)]="search" >
<button class="btn btn-primary ml-auto" (click)="openModal(editTemplateModal)">เพิ่มไฟล์ Excel</button>
</div>
<div class="table-responsive table-bordered">
<div class="table-responsive">
<table class="table table-striped mb-0 no-wrap v-middle ">
<thead>
<thead class="bg-info text-white">
<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">รายละเอียด</th>
<th scope="col">วันที่อัพโหลด</th>
<th scope="col">สถานะ</th>
<th scope="col">ลิงค์</th>
<th scope="col">สถานะ</th>
<!-- <th scope="col">ไฟล์</th> -->
<th scope="col"></th>
</tr>
</thead>
<tbody>
<tr *ngFor="let data of testdata | slice: (page-1) * pageSize : (page-1) * pageSize + pageSize ; let i = index">
<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.img}}"></td>
<td >{{data.id}}</td>
<td>{{ data.name }}</td>
<td>{{ data.detail }}</td>
<td>{{ data.dateupload }}</td>
<td>{{ data.status }}</td>
<td><a href="{{data.link}}" target="_blank">คลิก</a></td>
<td><img width="100" class="border p-1" src="{{data.thumbnail}}"></td>
<!-- <td >{{data.id}}</td> -->
<td>{{ data.thName }}</td>
<td>{{ data.thDesc }}</td>
<td><a href="{{data.link1}}" target="_blank">คลิก</a></td>
<td>{{ getStatus(data.status) }}</td>
<!-- <td><a (click)="downloadFile(data.logId)">ดาวน์โหลด</a></td> -->
<td>
<a href="javascript: void(0);" (click)="openModal(editTemplateModal, template)" class="link mr-2"
placement="top" ngbTooltip="แก้ไข">
<i-feather name="edit-2" class="feather-sm text-primary"></i-feather>
</a>
<a href="javascript: void(0);" class="link" (click)="deletetemplate(template.id)" placement="top"
ngbTooltip="ลบ">
<i-feather name="trash-2" class="feather-sm text-danger"></i-feather>
</a>
<button type="button" [disabled]="data.status != 0" class="btn btn-circle btn-primary rounded-circle btn-sm mr-2" (click)="openModal(editTemplateModal,data)" placement="top" ngbTooltip="แก้ไข">
<i class="fas fa-edit"></i>
</button>
<button type="button" [disabled]="data.status != 0" class="btn btn-circle btn-danger rounded-circle btn-sm mr-2" (click)="deleteFile(data)" placement="top" ngbTooltip="ลบ">
<i class="fas fa-trash-alt"></i>
</button>
</td>
</tr>
</tbody>
</table>
</div>
<div class="d-flex justify-content-center mt-5">
<ngb-pagination [(page)]="page" [pageSize]="pageSize" [collectionSize]="testdata.length"></ngb-pagination>
<div class="d-flex justify-content-end py-2">
<select class="custom-select m-r-5" style="width: auto" [(ngModel)]="pageSize" (ngModelChange)="page">
<option [ngValue]="10">รายการต่อหน้า: 10</option>
<option [ngValue]="50">รายการต่อหน้า: 50</option>
<option [ngValue]="100">รายการต่อหน้า: 100</option>
</select>
<ngb-pagination [(page)]="page" [pageSize]="pageSize" [collectionSize]="listExcel.length" [maxSize]="3" [rotate]="true">
<ng-template ngbPaginationPrevious>ก่อนหน้า</ng-template>
<ng-template ngbPaginationNext>ถัดไป</ng-template>
</ngb-pagination>
</div>
</div>
</div>
</div>
......@@ -56,7 +64,7 @@
<ng-template #editTemplateModal let-modal>
<div class="modal-header">
<h5 class="modal-title" id="edittemplateLabel">เพิ่มไฟล์ Excel</h5>
<h5 class="modal-title" id="edittemplateLabel">{{checkEdit?"แก้ไขไฟล์ Excel":"เพิ่มไฟล์ Excel"}}</h5>
<button type="button" class="close" (click)="closeBtnClick()" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
......@@ -64,57 +72,71 @@
<div class="modal-body">
<div class="form-group row">
<label for="name" class="col-sm-4 col-form-label">ชื่อรายงาน (ไทย)</label>
<label for="nameth" class="col-sm-4 col-form-label">ชื่อรายงาน (ไทย)</label>
<div class="col-sm-8">
<input type="text" class="form-control" id="nameth">
<input type="text" class="form-control" id="nameth" [(ngModel)]="modelExcel.thName">
</div>
</div>
<div class="form-group row">
<label for="name" class="col-sm-4 col-form-label">ชื่อรายงาน (อังกฤษ)</label>
<label for="nameeng" class="col-sm-4 col-form-label">ชื่อรายงาน (อังกฤษ)</label>
<div class="col-sm-8">
<input type="text" class="form-control" id="nameeng">
<input type="text" class="form-control" id="nameeng" [(ngModel)]="modelExcel.engName">
</div>
</div>
<div class="form-group row">
<label for="position" class="col-sm-4 col-form-label">รายละเอียดรายงาน (ไทย)</label>
<div class="col-sm-8">
<textarea class="form-control"></textarea>
<textarea class="form-control" [(ngModel)]="modelExcel.thDesc"></textarea>
</div>
</div>
<div class="form-group row">
<label for="position" class="col-sm-4 col-form-label">รายละเอียดรายงาน (อังกฤษ)</label>
<div class="col-sm-8">
<textarea class="form-control" [(ngModel)]="modelExcel.engDesc"></textarea>
</div>
</div>
<div class="form-group row">
<label for="position" class="col-sm-4 col-form-label">รายละเอียดรายงาน (อังกฤษ)</label>
<label for="position" class="col-sm-4 col-form-label">ดาต้าเบสที่รองรับ</label>
<div class="col-sm-8">
<textarea class="form-control"></textarea>
<input type="text" class="form-control" id="nameeng" [(ngModel)]="modelExcel.dbSupport">
</div>
</div>
</div>
<div class="form-group row">
<label for="name" class="col-sm-4 col-form-label">รูปภาพตัวอย่างรายงาน</label>
<label for="name" class="col-sm-4 col-form-label">ไฟล์อัพโหลด</label>
<div class="col-sm-8">
<input type="file" class="form-control" (change)="onSelectFile($event)">
</div>
</div>
<div class="form-group row">
<label for="name" class="col-sm-4 col-form-label">Link รูปภาพตัวอย่างรายงาน</label>
<div class="col-sm-8">
<input type="file" class="form-control">
<input type="text" class="form-control"[(ngModel)]="modelExcel.thumbnail">
</div>
</div>
<div class="form-group row">
<label for="name" class="col-sm-4 col-form-label">ลิงค์ตัวอย่าง</label>
<label for="name" class="col-sm-4 col-form-label">Link ตัวอย่าง</label>
<div class="col-sm-8">
<input type="text" class="form-control" id="nameeng">
<input type="text" class="form-control" id="nameeng" [(ngModel)]="modelExcel.link1">
</div>
</div>
<div class="form-group row">
<label for="position" class="col-sm-4 col-form-label">หมายเหตุ</label>
<div class="col-sm-8">
<textarea class="form-control"></textarea>
<textarea class="form-control"[(ngModel)]="modelExcel.remark"></textarea>
</div>
</div>
<div class="modal-footer ">
<button type="submit" class="btn btn-info" [disabled]="edittemplate.invalid">บันทึก</button>
<button type="submit" class="btn btn-info" (click)="onSumit()" [disabled]="!modelExcel.tname||!modelExcel.ename">บันทึก</button>
<button type="button" class="btn btn-danger" (click)="closeBtnClick()">ปิด</button>
</div>
</div>
......
src/app/apps/list-excell/list-excell.component.ts
import { Component, OnInit } from '@angular/core';
import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
import { ExcelModel } from 'src/app/model/excel.model';
import { ExcelService } from 'src/app/service/excel.service';
import { ConfirmModalComponent } from '../confirm-modal/confirm-modal.component';
import { AlertModalComponent } from '../alert-modal/alert-modal.component';
@Component({
selector: 'app-list-excel',
......@@ -7,95 +11,166 @@ import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
styleUrls: ['./list-excell.component.scss']
})
export class ListExcelComponent implements OnInit {
get searchTerm(): string {
return this._searchTerm;
page = 1;
pageSize = 10;
listExcel:ExcelModel[]=[]
modelExcel:ExcelModel = new ExcelModel({});
checkEdit:boolean = false
search:string = ''
constructor(private modalService: NgbModal,private excelService:ExcelService) {
}
set searchTerm(val: string) {
this._searchTerm = val;
this.filterArray = this.filter(val);
onSelectFile(event:any) {
if (event.target.files && event.target.files[0]) {
let reader = new FileReader();
reader.readAsDataURL(event.target.files[0]); // read file as data url
reader.onload = (event) => { // called once readAsDataURL is completed
if(event){
let base64 = event.target!.result as string
this.modelExcel.excelObj = base64.split(',')[1];
}
}
}
}
page = 1;
pageSize = 7;
filterArray: {
id:string;
name: String;
detail: String;
dateupload: String;
status: String;
link: String;
}[] = [];
_searchTerm = '';
testdata: {
id:string;
name: String;
detail: String;
dateupload: String;
status: String;
link: String;
img:string
}[] = [];
constructor(private modalService: NgbModal) {
async downloadFile(logId:string){
try {
const data = await this.excelService.downloadFile(logId).toPromise();
} catch (error) {
console.error('Error loading data:', error);
}
}
deleteFile(item:ExcelModel){
const modalRef = this.modalService.open(ConfirmModalComponent, {
centered: true,
backdrop: 'static',
})
modalRef.componentInstance.message = 'คุณต้องการลบข้อมูลหรือไม่'
modalRef.result.then(result => {
this.excelService.deleteExcel(item).subscribe(result => {
if (result) {
this.openAlertModal('ลบข้อมูลสำเร็จ')
this.getListExcel();
} else {
this.openAlertModal('ไม่สามารถลบข้อมูลได้')
}
}, error => {
this.openAlertModal(error.message)
})
}, reject => { })
ngOnInit() {
this.testdata = [
{
id:'2024-1101',
name: "Template Excel ข้อมูลพนักงาน",
detail: "แสดงรายชื่อพนักงานทั้งหมด",
dateupload: "11/06/2024",
status: "รออนุมัติ",
link: "https://www.youtube.com/watch?v=wOK9j3q20tw",
img:'assets/images/phototest/9a60ef19-7813-4094-bc45-17b7d9decc70.jpg'
},
{
id:'2024-1102',
name: "หนังสือรับรองเงินเดือน Word",
detail: "เอกสารใบรับรองเงินเดือน",
dateupload: "10/06/2024",
status: "รออนุมัติ",
link: "https://www.youtube.com/watch?v=wOK9j3q20tw",
img:'assets/images/phototest/3daddc9f-f69a-470b-8275-7db59db1a89b.jpg'
},
{
id:'2024-1103',
name: "Resume",
detail: "ตัวอย่าง Resume",
dateupload: "09/06/2024",
status: "เปิดใช้งาน",
link: "https://www.youtube.com/watch?v=wOK9j3q20tw",
img:'assets/images/phototest/acb4b666-437e-47d1-94ca-4dbce9ce0761.jpg'
},
{
id:'2024-1104',
name: "Template Excel เวลาการทำงาน",
detail: "ข้อมูลเวลาการทำงาน ",
dateupload: "09/06/2024",
status: "ไม่อนุมัติ",
link: "https://www.youtube.com/watch?v=wOK9j3q20tw",
img:'assets/images/phototest/3daddc9f-f69a-470b-8275-7db59db1a89b.jpg'
},
];
this.filterArray = this.testdata
}
filter(v: string) {
return this.testdata.filter(x => x.name.toLowerCase().indexOf(v.toLowerCase()) !== -1);
openAlertModal(message?: string) {
const modalRef = this.modalService.open(AlertModalComponent, {
centered: true,
backdrop: 'static'
})
modalRef.componentInstance.message = message ? message : ""
modalRef.result.then(result => {
this.modalService.dismissAll()
}, reason => {
this.modalService.dismissAll()
})
}
openModal(targetModal: NgbModal) {
this.modalService.open(targetModal, {
onUpdate(){
const modalRef = this.modalService.open(ConfirmModalComponent, {
centered: true,
backdrop: 'static',
})
modalRef.componentInstance.message = 'คุณต้องการอัพเดทข้อมูลหรือไม่'
modalRef.result.then(result => {
console.log(this.modelExcel);
this.excelService.createExcel(this.modelExcel).subscribe(result => {
if (result) {
this.openAlertModal('อัพเดทข้อมูลสำเร็จ')
this.getListExcel();
} else {
this.openAlertModal('ไม่สามารถอัพเดทข้อมูลได้')
}
}, error => {
this.openAlertModal(error.message)
})
}, reject => { })
}
onCreate(){
const modalRef = this.modalService.open(ConfirmModalComponent, {
centered: true,
backdrop: 'static',
size: 'lg'
});
})
modalRef.componentInstance.message = 'คุณต้องการบันทึกข้อมูลหรือไม่'
modalRef.result.then(result => {
this.excelService.createExcel(this.modelExcel).subscribe(result => {
if (result) {
this.openAlertModal('บันทึกข้อมูลสำเร็จ')
this.getListExcel();
} else {
this.openAlertModal('ไม่สามารถสร้างเอกสารได้')
}
}, error => {
this.openAlertModal(error.message)
})
}, reject => { })
}
onSumit() {
if(this.checkEdit){
this.onUpdate();
}else{
this.onCreate();
}
}
async getExcelById(targetModal: NgbModal,id:string){
try {
const data = await this.excelService.getExcelById(id).toPromise();
this.modelExcel = new ExcelModel(data)
if(data){
this.modalService.open(targetModal, {
centered: true,
backdrop: 'static',
size: 'lg'
});
}
} catch (error) {
console.error('Error loading data:', error);
}
}
openModal(targetModal: NgbModal,item?:ExcelModel) {
if(item){
this.getExcelById(targetModal,item.logId)
this.checkEdit = true
}else{
this.modelExcel = new ExcelModel({});
this.checkEdit = false
this.modalService.open(targetModal, {
centered: true,
backdrop: 'static',
size: 'lg'
});
}
}
getStatus(status:string){
if(status == '0'){
return 'รออนุมัติ'
} else if(status == '1'){
return 'เปิดใช้งาน'
} else if(status == '2'){
return 'ไม่อนุมัติ'
}
}
async getListExcel(){
try {
const data = await this.excelService.getListExcel().toPromise();
this.listExcel = data
} catch (error) {
console.error('Error loading data:', error);
}
}
filterListExcel(){
return this.listExcel.filter(x => x.thName.toLowerCase().includes(this.search.toLowerCase())||x.engName.toLowerCase().includes(this.search.toLowerCase()))
}
ngOnInit() {
this.getListExcel();
}
......
src/app/apps/portal-category-list-approve/portal-category-list-approve.component.html
<div class="row">
<div class="col-12">
<div class="card card-body">
<h4 class="card-title">Category List Approve</h4>
<div class="d-flex mb-1 mt-1">
<input type="text" class="form-control w-25" placeholder="Search" [(ngModel)]='searchTerm'>
<!-- <button class="btn btn-primary ml-auto" (click)="openModal(editTemplateModal)">Add File Type Category</button> -->
</div>
</div>
</div>
</div>
<div class="row justify-content-center">
<div class="col-md-4" *ngFor="let c of testdata|slice: (page-1) * pageSize : (page-1) * pageSize + pageSize">
<div class="card">
<div class="card-body text-center">
<img src="{{ c.img }}" class="rounded-circle border p-1" width="100">
<h3 class="card-title mt-3 mb-0">{{c.name}}</h3>
<div class="mt-1 pt-1">
<h4 class="card-title mt-3 mb-0">{{c.details}}</h4>
<br />
</div>
<div class="mt-3">
<a (click)="openView(c.id)">
<button class="btn btn-info">View</button>
</a>
<!-- <button class="btn btn-warning">Edit</button>
<button class="btn btn-danger">Delete</button> -->
<!-- <button class="btn btn-light">Follow</button> -->
</div>
</div>
<div class="d-flex text-center justify-content-md-center bg-light border-top">
<div class="col-12 border-bottom py-3">
{{ c.document }}
<h4 class="card-title">รายการเอกสารรอการอนุมัติ</h4>
<div class="row justify-content-center">
<div class="col-md-4 " *ngFor="let c of testdata|slice: (page-1) * pageSize : (page-1) * pageSize + pageSize">
<div class="card border border-2">
<div class="card-body text-center">
<img src="{{ c.img }}" class="rounded-circle border p-1" width="100">
<h3 class="card-title mt-3 mb-0">{{c.name}}</h3>
</div>
<div class="d-flex justify-content-between bg-light border-top p-3">
<div>
<span class="align-middle">{{ c.document }}</span>
</div>
<div >
<button class="btn btn-info btn-sm text-nowrap" (click)="openView(c.id)">รายละเอียด</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="d-flex justify-content-center mt-5">
<ngb-pagination [(page)]="page" [pageSize]="pageSize" [collectionSize]="testdata.length"></ngb-pagination>
</div>
<!-- Add File -->
<ng-template #editTemplateModal let-modal>
<div class="modal-header">
<h5 class="modal-title" id="edittemplateLabel">Add File Type Category</h5>
<button type="button" class="close" (click)="closeBtnClick()" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<form [formGroup]="edittemplate" (ngSubmit)="onSubmit()">
<div class="form-group row">
<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(edittemplate)>
</div>
</div>
<div class="form-group row">
<label for="position" class="col-sm-4 col-form-label">รายละเอียด</label>
<div class="col-sm-8">
<textarea class="form-control"></textarea>
</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="modal-footer">
<button type="button" class="btn btn-secondary" (click)="closeBtnClick()">Close</button>
<button type="submit" class="btn btn-primary" >Save</button>
</div>
</form>
</div>
</ng-template>
</div>
\ No newline at end of file
src/app/apps/portal-category-list-approve/portal-category-list-approve.component.ts
......@@ -41,21 +41,21 @@ export class PortalCategoryListApproveComponent implements OnInit {
{
id:'1',
img: "assets/images/icon/excel.png",
name: "ประเภทไฟล์: Excel",
name: "Excel",
details: "xxxxxxxxxxxxxxxxxxxxxxxxxxx",
document: "จำนวนเอกสาร 8 ฉบับ"
},
{
id:'2',
img: "assets/images/icon/document.png",
name: "ประเภทไฟล์: Document",
name: "Document",
details: "xxxxxxxxxxxxxxxxxxxxxxxxxxx",
document: "จำนวนเอกสาร 3 ฉบับ"
},
{
id:'3',
img: "assets/images/icon/course.png",
name: "ประเภทไฟล์: Course",
name: "Course",
details: "xxxxxxxxxxxxxxxxxxxxxxxxxxx",
document: "จำนวนเอกสาร 5 ฉบับ"
},
......@@ -64,6 +64,10 @@ export class PortalCategoryListApproveComponent implements OnInit {
openView(id:string){
if(id =='1'){
this.router.navigate(['apps/approve-excel']);
} else if(id =='2'){
this.router.navigate(['apps/approve-doc']);
}else if(id =='3'){
this.router.navigate(['apps/approve-course']);
}
}
openModal(targetModal: NgbModal) {
......
src/app/apps/portal-category-list/portal-category-list.component.html
<div class="row">
<div class="col-12">
<div class="card card-body">
<h4 class="card-title">Category List</h4>
<div class="d-flex mb-1 mt-1">
<input type="text" class="form-control w-25" placeholder="Search" [(ngModel)]='searchTerm'>
<!-- <button class="btn btn-primary ml-auto" (click)="openModal(editTemplateModal)">Add File Type Category</button> -->
</div>
</div>
</div>
</div>
<div class="row justify-content-center">
<div class="col-md-4" *ngFor="let c of testdata|slice: (page-1) * pageSize : (page-1) * pageSize + pageSize">
<div class="card">
<div class="card-body text-center">
<img src="{{ c.img }}" class="rounded-circle border p-1" width="100">
<h3 class="card-title mt-3 mb-0">{{c.name}}</h3>
<div class="mt-1 pt-1">
<h4 class="card-title mt-3 mb-0">{{c.details}}</h4>
<br />
</div>
<div class="mt-3">
<a (click)="routerLink('/apps/portal-template-list',c.type)">
<button class="btn btn-info">View</button>
</a>
<!-- <button class="btn btn-warning">Edit</button>
<button class="btn btn-danger">Delete</button> -->
<!-- <button class="btn btn-light">Follow</button> -->
</div>
</div>
<div class="d-flex text-center justify-content-md-center bg-light border-top">
<div class="col-12 border-bottom py-3">
{{ c.document }}
<h4 class="card-title">รายการเอกสาร</h4>
<div class="row justify-content-center">
<div class="col-md-4 " *ngFor="let c of testdata|slice: (page-1) * pageSize : (page-1) * pageSize + pageSize">
<div class="card border border-2">
<div class="card-body text-center">
<img src="{{ c.img }}" class="rounded-circle border p-1" width="100">
<h3 class="card-title mt-3 mb-0">{{c.name}}</h3>
</div>
<div class="d-flex justify-content-between bg-light border-top p-3">
<div>
<span class="align-middle">{{ c.document }}</span>
</div>
<div >
<button class="btn btn-info btn-sm text-nowrap" (click)="openView(c.id)">รายละเอียด</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="d-flex justify-content-center mt-5">
<ngb-pagination [(page)]="page" [pageSize]="pageSize" [collectionSize]="testdata.length"></ngb-pagination>
</div>
<!-- Add File -->
<ng-template #editTemplateModal let-modal>
<div class="modal-header">
<h5 class="modal-title" id="edittemplateLabel">Add File Type Category</h5>
<button type="button" class="close" (click)="closeBtnClick()" aria-label="Close">
<span aria-hidden="true">&times;</span>
</button>
</div>
<div class="modal-body">
<form [formGroup]="edittemplate" (ngSubmit)="onSubmit()">
<div class="form-group row">
<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(edittemplate)>
</div>
</div>
<div class="form-group row">
<label for="position" class="col-sm-4 col-form-label">รายละเอียด</label>
<div class="col-sm-8">
<textarea class="form-control"></textarea>
</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="modal-footer">
<button type="button" class="btn btn-secondary" (click)="closeBtnClick()">Close</button>
<button type="submit" class="btn btn-primary" >Save</button>
</div>
</form>
</div>
</ng-template>
</div>
\ No newline at end of file
src/app/apps/portal-category-list/portal-category-list.component.ts
import { Component, OnInit } from '@angular/core';
import { NgbModal } from "@ng-bootstrap/ng-bootstrap";
import { FormBuilder, FormGroup, Validators } from "@angular/forms";
import { Router } from '@angular/router';
@Component({
......@@ -11,18 +9,8 @@ import { Router } from '@angular/router';
export class PortalCategoryListComponent implements OnInit {
constructor(
private fb: FormBuilder,
private modalService: NgbModal,
private router:Router
private routes: Router
) {}
get searchTerm(): string {
return this._searchTerm;
}
set searchTerm(val: string) {
this._searchTerm = val;
}
_searchTerm = "";
page = 1;
pageSize = 7;
......@@ -41,41 +29,35 @@ export class PortalCategoryListComponent implements OnInit {
{
id:'1',
img: "assets/images/icon/excel.png",
name: "ประเภทไฟล์: Excel",
name: "Excel",
details: "xxxxxxxxxxxxxxxxxxxxxxxxxxx",
document: "จำนวนเอกสาร 8 ฉบับ"
},
{
id:'2',
img: "assets/images/icon/document.png",
name: "ประเภทไฟล์: Document",
name: "Document",
details: "xxxxxxxxxxxxxxxxxxxxxxxxxxx",
document: "จำนวนเอกสาร 3 ฉบับ"
},
{
id:'3',
img: "assets/images/icon/course.png",
name: "ประเภทไฟล์: Course",
name: "Course",
details: "xxxxxxxxxxxxxxxxxxxxxxxxxxx",
document: "จำนวนเอกสาร 5 ฉบับ"
},
];
}
openModal(targetModal: NgbModal) {
this.modalService.open(targetModal, {
centered: true,
backdrop: "static",
});
}
closeBtnClick() {
this.modalService.dismissAll();
this.ngOnInit();
}
routerLink(path: String, type: String){
this.router.navigate([path,{type:type}])
openView(id:string){
if(id =='1'){
this.routes.navigate(['apps/list-excel']);
}else if(id =='2'){
this.routes.navigate(['apps/list-doc']);
}else if(id =='3'){
this.routes.navigate(['apps/list-course']);
}
}
}
src/app/apps/portal-create-category/portal-create-category.component.html
<div class="row">
<div class="col-12">
<div class="card card-body">
<h4 class="card-title">Create Category</h4>
<div class="d-flex mb-3 mt-3">
<input type="text" class="form-control w-25" placeholder="Search" [(ngModel)]='searchTerm'>
<!-- <button class="btn btn-primary ml-auto" (click)="openModal(editTemplateModal)">Add File Type Category</button> -->
</div>
</div>
</div>
</div>
<div class="row justify-content-center">
<div class="col-md-4" *ngFor="let c of testdata|slice: (page-1) * pageSize : (page-1) * pageSize + pageSize">
<div class="card">
<div class="card-body text-center">
<img src="{{ c.img }}" class="rounded-circle border p-1" width="100">
<h3 class="card-title mt-3 mb-0">{{c.name}}</h3>
<div class="mt-1 pt-1">
<h4 class="card-title mt-3 mb-0">{{c.details}}</h4>
<br />
</div>
<div class="mt-3">
<button class="btn btn-info" (click)="openView(c.id)">View</button>
</div>
</div>
<div class="d-flex text-center justify-content-md-center bg-light border-top">
<div class="col-12 border-bottom py-3">
{{ c.document }}
<h4 class="card-title">รายการเอกสาร</h4>
<!-- <div class="d-flex mb-3 mt-3">
<input type="text" class="form-control w-25" placeholder="ค้นหาเอกสาร" >
<button class="btn btn-primary ml-auto" (click)="openModal(editTemplateModal)">Add File Type Category</button>
</div> -->
<div class="row justify-content-center">
<div class="col-md-4 " *ngFor="let c of testdata|slice: (page-1) * pageSize : (page-1) * pageSize + pageSize">
<div class="card border border-2">
<div class="card-body text-center">
<img src="{{ c.img }}" class="rounded-circle border p-1" width="100">
<h3 class="card-title mt-3 mb-0">{{c.name}}</h3>
</div>
<div class="d-flex justify-content-between bg-light border-top p-3">
<div>
<span class="align-middle">{{ c.document }}</span>
</div>
<div >
<button class="btn btn-info btn-sm text-nowrap" (click)="openView(c.id)">รายละเอียด</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="d-flex justify-content-center mt-5">
<ngb-pagination [(page)]="page" [pageSize]="pageSize" [collectionSize]="testdata.length"></ngb-pagination>
</div>
......
src/app/apps/portal-create-category/portal-create-category.component.ts
......@@ -12,15 +12,8 @@ import { Router } from '@angular/router';
export class PortalCreateCategoryComponent implements OnInit {
constructor(private fb: FormBuilder, private modalService: NgbModal, private datePipe: DatePipe,private routes: Router,) {}
get searchTerm(): string {
return this._searchTerm;
}
set searchTerm(val: string) {
this._searchTerm = val;
}
page = 1;
pageSize = 9;
pageSize = 10;
testdata: {
id:string;
......@@ -30,43 +23,26 @@ export class PortalCreateCategoryComponent implements OnInit {
document: String;
}[] = [];
_searchTerm = "";
formsErrors = [];
ngOnInit() {
// this.editUser = this.fb.group({
// id: [""],
// Name: ["", Validators.required],
// Position: ["", Validators.required],
// Email: ["", Validators.required],
// Mobile: ["", Validators.required],
// DateOfJoining: ["", Validators.required],
// Salary: ["", Validators.required],
// Projects: ["", Validators.required],
// });
this.testdata = [
{
id:'1',
img: "assets/images/icon/excel.png",
name: "ประเภทไฟล์: Excel",
name: "Excel",
details: "xxxxxxxxxxxxxxxxxxxxxxxxxxx",
document: "จำนวนเอกสาร 8 ฉบับ"
},
{
id:'2',
img: "assets/images/icon/document.png",
name: "ประเภทไฟล์: Document",
name: "Document",
details: "xxxxxxxxxxxxxxxxxxxxxxxxxxx",
document: "จำนวนเอกสาร 3 ฉบับ"
},
{
id:'3',
img: "assets/images/icon/course.png",
name: "ประเภทไฟล์: Course",
name: "Course",
details: "xxxxxxxxxxxxxxxxxxxxxxxxxxx",
document: "จำนวนเอกสาร 5 ฉบับ"
},
......@@ -75,7 +51,11 @@ export class PortalCreateCategoryComponent implements OnInit {
openView(id:string){
if(id =='1'){
this.routes.navigate(['apps/list-excel/']);
this.routes.navigate(['apps/list-excel']);
}else if(id =='2'){
this.routes.navigate(['apps/list-doc']);
}else if(id =='3'){
this.routes.navigate(['apps/list-course']);
}
}
openModal(targetModal: NgbModal) {
......
src/app/authentication/login/login.component.html
......@@ -32,7 +32,7 @@
</div>
<div class="form-group text-center">
<div class="col-xs-12 p-b-20">
<a class="btn btn-block btn-lg btn-info" href="/apps/portal-create-category">Log In</a>
<a class="btn btn-block btn-lg btn-info" (click)="login()">Log In</a>
</div>
</div>
<div class="row">
......
src/app/authentication/login/login.component.ts
import { Component } from '@angular/core';
import { Router } from '@angular/router';
@Component({
selector: 'app-login',
templateUrl: './login.component.html'
})
export class LoginComponent {
constructor() {}
constructor(private routes: Router) {}
loginform = true;
recoverform = false;
......@@ -14,4 +15,7 @@ export class LoginComponent {
this.loginform = !this.loginform;
this.recoverform = !this.recoverform;
}
login(){
this.routes.navigate(['apps/portal-create-category']);
}
}
src/app/layouts/full/full.component.html
......@@ -116,8 +116,7 @@
<!-- footer -->
<!-- ============================================================== -->
<footer class="footer text-center">
All Rights Reserved by Xtreme Admin. Designed and Developed by
<a href="https://wrappixel.com">WrapPixel</a>.
myHR Portal
</footer>
<!-- ============================================================== -->
<!-- End footer -->
......@@ -127,9 +126,9 @@
<!-- End Page wrapper -->
<!-- ============================================================== -->
<aside class="customizer" [ngClass]="{'show-service-panel': showSettings}">
<a href="javascript:void(0)" class="service-panel-toggle" (click)="showSettings = !showSettings">
<!-- <a href="javascript:void(0)" class="service-panel-toggle" (click)="showSettings = !showSettings">
<i class="fa fa-spin fa-cog"></i>
</a>
</a> -->
<div class="customizer-body custom-pills" [perfectScrollbar]="config">
......
src/app/layouts/full/full.component.ts
......@@ -33,7 +33,7 @@ export class FullComponent implements OnInit {
boxed: 'full', // two possible values: full, boxed
navbarbg: 'skin1', // six possible values: skin(1/2/3/4/5/6)
sidebarbg: 'skin6', // six possible values: skin(1/2/3/4/5/6)
logobg: 'skin6' // six possible values: skin(1/2/3/4/5/6)
logobg: 'skin1' // six possible values: skin(1/2/3/4/5/6)
};
Logo() {
......
src/app/model/course.model.ts 0 → 100644
export interface CourseModel {
logId: string
objective: string
thumbnail: string
link1: string
courseObj: string
uploadBy: string
remark: string
status: number
approveBy: string
thName: string
engName: string
thDesc: string
engDesc: string
courseOutline: string
courseType: string
courseLevel: string
courseTime: string
courseTrainer: string
courseTrainerDetail: string
}
export class CourseModel implements CourseModel {
logId: string
objective: string
thumbnail: string
link1: string
courseObj: string
uploadBy: string
remark: string
status: number
approveBy: string
thName: string
engName: string
thDesc: string
engDesc: string
courseOutline: string
courseType: string
courseLevel: string
courseTime: string
courseTrainer: string
courseTrainerDetail: string
constructor(data: Partial<any>) {
this.logId = data.logId?data.logId:''
this.objective = data.objective?data.objective:''
this.thumbnail = data.thumbnail?data.thumbnail:''
this.link1 = data.link1?data.link1:''
this.courseObj = data.courseObj?data.courseObj:''
this.uploadBy = data.uploadBy?data.uploadBy:''
this.remark = data.remark?data.remark:''
this.status = data.status?data.status:0
this.approveBy = data.approveBy?data.approveBy:''
this.thName = data.thName?data.thName:''
this.engName = data.engName?data.engName:''
this.thDesc = data.thDesc?data.thDesc:''
this.engDesc = data.engDesc?data.engDesc:''
this.courseOutline = data.courseOutline?data.courseOutline:''
this.courseType = data.courseType?data.courseType:''
this.courseLevel = data.courseLevel?data.courseLevel:''
this.courseTime = data.courseTime?data.courseTime:''
this.courseTrainer = data.courseTrainer?data.courseTrainer:''
this.courseTrainerDetail = data.courseTrainerDetail?data.courseTrainerDetail:''
}
}
\ No newline at end of file
src/app/model/document.model.ts 0 → 100644
export interface DocumentModel {
logId: string
thumbnail: string
link1: string
langSupport: string
doclObj: string
uploadBy: string
remark: string
status: number
approveBy: string
thName: string
engName: string
thDesc: string
engDesc: string
}
export class DocumentModel implements DocumentModel {
logId: string
thumbnail: string
link1: string
langSupport: string
doclObj: string
uploadBy: string
remark: string
status: number
approveBy: string
thName: string
engName: string
thDesc: string
engDesc: string
constructor(data: Partial<any>) {
this.logId = data.logId?data.logId:''
this.thumbnail = data.thumbnail?data.thumbnail:''
this.link1 = data.link1?data.link1:''
this.langSupport = data.langSupport?data.langSupport:''
this.doclObj = data.doclObj?data.doclObj:''
this.uploadBy = data.uploadBy?data.uploadBy:''
this.remark = data.remark?data.remark:''
this.status = data.status?data.status:0
this.approveBy = data.approveBy?data.approveBy:''
this.thName = data.thName?data.thName:''
this.engName = data.engName?data.engName:''
this.thDesc = data.thDesc?data.thDesc:''
this.engDesc = data.engDesc?data.engDesc:''
}
}
\ No newline at end of file
src/app/model/excel.model.ts 0 → 100644
export interface ExcelModel {
logId: string
thumbnail: string
link1: string
dbSupport: string
excelObj: string
uploadBy: string
remark: string
status: number
approveBy: string
thName: string
engName: string
thDesc: string
engDesc: string
}
export class ExcelModel implements ExcelModel {
logId: string
thumbnail: string
link1: string
dbSupport: string
excelObj: string
uploadBy: string
remark: string
status: number
approveBy: string
thName: string
engName: string
thDesc: string
engDesc: string
constructor(data: Partial<any>) {
this.logId = data.logId?data.logId:''
this.thumbnail = data.thumbnail?data.thumbnail:''
this.link1 = data.link1?data.link1:''
this.dbSupport = data.dbSupport?data.dbSupport:''
this.excelObj = data.excelObj?data.excelObj:''
this.uploadBy = data.uploadBy?data.uploadBy:''
this.remark = data.remark?data.remark:''
this.status = data.status?data.status:0
this.approveBy = data.approveBy?data.approveBy:''
this.thName = data.thName?data.thName:''
this.engName = data.engName?data.engName:''
this.thDesc = data.thDesc?data.thDesc:''
this.engDesc = data.engDesc?data.engDesc:''
}
}
\ No newline at end of file
src/app/service/course.service.ts 0 → 100644
import { Injectable } from '@angular/core';
import { environment } from 'src/environments/environment';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { Observable, of } from 'rxjs';
import { map, tap } from 'rxjs/operators';
import { CourseModel } from '../model/course.model';
@Injectable({
providedIn: 'root'
})
export class CourseService {
url = environment.url
createStatus: boolean = true
constructor(private http: HttpClient) { }
getListCourse(status?:string): Observable<CourseModel[]> {
if(status){
return this.http.get<CourseModel[]>(this.url + "course-center/upload/lists?status="+status)
}else{
return this.http.get<CourseModel[]>(this.url + "course-center/upload/lists")
}
}
getCourseById(logId:string): Observable<CourseModel> {
return this.http.get<CourseModel>(this.url + "course-center/upload/"+logId)
}
downloadFile(logId:string){
return this.http.get<CourseModel>(this.url + "course-center/files/download/"+logId)
}
createCourse(model: CourseModel): Observable<boolean> {
if (this.createStatus) {
this.createStatus = false
return this.http.post(this.url + 'course-center', model, { observe: 'response' })
.pipe(
tap(x => this.createStatus = true),
map(r => r.status == 200)
);
} else {
return of(false)
}
}
deleteCourse(model: CourseModel): Observable<any> {
let body = {
logId: model.logId
}
let option = {
headers: new HttpHeaders({
"Content-Type": "application/json",
}),
body: body
}
return this.http.delete<any>(this.url + 'course-center/upload', option)
}
approve(model: CourseModel): Observable<any> {
let body = {
logId: model.logId,
status: model.status
}
return this.http.put<any>(this.url + "course-center/approve",body)
}
}
src/app/service/document.service.ts 0 → 100644
import { Injectable } from '@angular/core';
import { environment } from 'src/environments/environment';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { Observable, of } from 'rxjs';
import { map, tap } from 'rxjs/operators';
import { DocumentModel } from '../model/document.model';
@Injectable({
providedIn: 'root'
})
export class DocumentService {
url = environment.url
createStatus: boolean = true
constructor(private http: HttpClient) { }
getListDoc(status?:string): Observable<DocumentModel[]> {
if(status){
return this.http.get<DocumentModel[]>(this.url + "document-center/upload/lists?status="+status)
}else{
return this.http.get<DocumentModel[]>(this.url + "document-center/upload/lists")
}
}
getDocById(logId:string): Observable<DocumentModel> {
return this.http.get<DocumentModel>(this.url + "document-center/upload/"+logId)
}
downloadFile(logId:string){
return this.http.get<DocumentModel>(this.url + "document-center/files/download/"+logId)
}
createDoc(model: DocumentModel): Observable<boolean> {
if (this.createStatus) {
this.createStatus = false
return this.http.post(this.url + 'document-center', model, { observe: 'response' })
.pipe(
tap(x => this.createStatus = true),
map(r => r.status == 200)
);
} else {
return of(false)
}
}
deleteExcel(model: DocumentModel): Observable<any> {
let body = {
logId: model.logId
}
let option = {
headers: new HttpHeaders({
"Content-Type": "application/json",
}),
body: body
}
return this.http.delete<any>(this.url + 'document-center/upload', option)
}
approve(model: DocumentModel): Observable<any> {
let body = {
logId: model.logId,
status: model.status
}
return this.http.put<any>(this.url + "document-center/approve",body)
}
}
src/app/service/excel.service.ts 0 → 100644
import { Injectable } from '@angular/core';
import { environment } from 'src/environments/environment';
import { HttpClient, HttpHeaders } from '@angular/common/http';
import { Observable, of } from 'rxjs';
import { ExcelModel } from '../model/excel.model';
import { map, tap } from 'rxjs/operators';
@Injectable({
providedIn: 'root'
})
export class ExcelService {
url = environment.url
createStatus: boolean = true
constructor(private http: HttpClient) { }
getListExcel(status?: string): Observable<ExcelModel[]> {
if(status){
return this.http.get<ExcelModel[]>(this.url + "excel-center/upload/lists?status="+status)
}else{
return this.http.get<ExcelModel[]>(this.url + "excel-center/upload/lists")
}
}
getExcelById(logId:string): Observable<ExcelModel> {
return this.http.get<ExcelModel>(this.url + "excel-center/upload/"+logId)
}
downloadFile(logId:string){
return this.http.get<ExcelModel>(this.url + "excel-center/files/download/"+logId)
}
createExcel(model: ExcelModel): Observable<boolean> {
if (this.createStatus) {
this.createStatus = false
return this.http.post(this.url + 'excel-center', model, { observe: 'response' })
.pipe(
tap(x => this.createStatus = true),
map(r => r.status == 200)
);
} else {
return of(false)
}
}
deleteExcel(model: ExcelModel): Observable<any> {
let body = {
logId: model.logId
}
let option = {
headers: new HttpHeaders({
"Content-Type": "application/json",
}),
body: body
}
return this.http.delete<any>(this.url + 'excel-center/upload', option)
}
approve(model: ExcelModel): Observable<any> {
let body = {
logId: model.logId,
status: model.status
}
return this.http.put<any>(this.url + "excel-center/approve",body)
}
}
src/app/service/http-request.interceptor.ts 0 → 100644
import { Injectable } from '@angular/core';
import { HttpEvent, HttpHandler, HttpRequest } from '@angular/common/http';
import { Observable } from 'rxjs';
import { environment } from 'src/environments/environment';
@Injectable()
export class HttpRequestInterceptor {
token= 'eyJhbGciOiJIUzI1NiJ9.eyJzdWIiOiJBdXRoIiwidWlkIjoiOGFhNDUzMzAtMzE0Yy0xMWU3LWJhZjMtMmQ3ZDA5ODc3NzQ0Iiwicm9sZSI6InVzZXIiLCJpc3MiOiJDb21wdXRlciBTY2llbmNlIENvcnBvcmF0aW9uIExpbWl0ZWQiLCJmdWxsTmFtZSI6InRlZXJhZGFjaCBrdWhhdGFuYXNhdGllbiIsIm1lbWJlcklkIjoiOGFhNDUzMzAtMzE0Yy0xMWU3LWJhZjMtMmQ3ZDA5ODc3NzQ0In0.FO7u8g7KfzkmZFTuuniBCEQxduPjcvzMbH7iug3DT90'
constructor() { }
intercept(req: HttpRequest<any>, next: HttpHandler): Observable<HttpEvent<any>> {
let authHeader = localStorage.getItem('accessToken') ? localStorage.getItem('accessToken')! : "Bearer "+this.token
const overideReq = {
headers: req.headers.set('Authorization', authHeader),
url: req.url
}
const authReq = req.clone(overideReq)
return next.handle(authReq)
}
}
\ No newline at end of file
src/app/shared/vertical-header/vertical-navigation.component.html
......@@ -10,148 +10,17 @@
<!-- ============================================================== -->
<!-- mega menu -->
<!-- ============================================================== -->
<li class="nav-item mega-dropdown" ngbDropdown [autoClose]="false">
<a ngbDropdownToggle class="nav-link waves-effect waves-dark" href="javascript:void(0)" data-toggle="dropdown" aria-haspopup="true"
aria-expanded="false">
<span class="d-none d-md-block">Mega
<i class="fa fa-angle-down"></i>
</span>
<span class="d-block d-md-none">
<i class="mdi mdi-dialpad font-24"></i>
</span>
</a>
<div class="dropdown-menu" ngbDropdownMenu>
<div class="mega-dropdown-menu row">
<div class="col-lg-3 col-xlg-2 m-b-30">
<h4 class="m-b-20">CAROUSEL</h4>
<!-- CAROUSEL -->
<ngb-carousel>
<ng-template ngbSlide>
<img src="assets/images/big/img1.jpg" class="img-fluid" alt="Random first slide">
<div class="carousel-caption">
<h3 class="text-white font-bold">First slide label</h3>
</div>
</ng-template>
<ng-template ngbSlide>
<img src="assets/images/big/img2.jpg" class="img-fluid" alt="Random second slide">
<div class="carousel-caption">
<h3 class="text-white font-bold">Second slide label</h3>
</div>
</ng-template>
<ng-template ngbSlide>
<img src="assets/images/big/img3.jpg" class="img-fluid" alt="Random third slide">
<div class="carousel-caption">
<h3 class="text-white font-bold">Third slide label</h3>
</div>
</ng-template>
</ngb-carousel>
<!-- End CAROUSEL -->
</div>
<div class="col-lg-3 m-b-30">
<h4 class="m-b-20">ACCORDION</h4>
<!-- Accordian -->
<ngb-accordion [closeOthers]="true" activeIds="static-1" class="accordion nav-accordion">
<ngb-panel id="static-1" title="Simple">
<ng-template ngbPanelContent>
Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid.
</ng-template>
</ngb-panel>
<ngb-panel id="static-2">
<ng-template ngbPanelTitle>
<span>&#9733;
<b>Fancy</b> title &#9733;</span>
</ng-template>
<ng-template ngbPanelContent>
Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid.
</ng-template>
</ngb-panel>
<ngb-panel id="static-3" title="Disabled" [disabled]="true">
<ng-template ngbPanelContent>
Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid.
</ng-template>
</ngb-panel>
</ngb-accordion>
</div>
<div class="col-lg-3 m-b-30">
<h4 class="m-b-20">CONTACT US</h4>
<!-- Contact -->
<form>
<div class="form-group">
<input type="text" class="form-control" id="exampleInputname1" placeholder="Enter Name"> </div>
<div class="form-group">
<input type="email" class="form-control" placeholder="Enter email"> </div>
<div class="form-group">
<textarea class="form-control" id="exampleTextarea" rows="3" placeholder="Message"></textarea>
</div>
<button type="submit" class="btn btn-info">Submit</button>
</form>
</div>
<div class="col-lg-3 col-xlg-4 m-b-30">
<h4 class="m-b-20">List style</h4>
<!-- List style -->
<ul class="list-style-none">
<li>
<a href="javascript:void(0)">
<i class="fa fa-check text-success"></i> You can give link</a>
</li>
<li>
<a href="javascript:void(0)">
<i class="fa fa-check text-success"></i> Give link</a>
</li>
<li>
<a href="javascript:void(0)">
<i class="fa fa-check text-success"></i> Another Give link</a>
</li>
<li>
<a href="javascript:void(0)">
<i class="fa fa-check text-success"></i> Forth link</a>
</li>
<li>
<a href="javascript:void(0)">
<i class="fa fa-check text-success"></i> Another fifth link</a>
</li>
</ul>
</div>
</div>
</div>
</li>
<!-- ============================================================== -->
<!-- End mega menu -->
<!-- ============================================================== -->
<!-- ============================================================== -->
<!-- create new -->
<!-- ============================================================== -->
<li class="nav-item dropdown" ngbDropdown>
<a ngbDropdownToggle class="nav-link dropdown-toggle" href="javascript:void(0)" id="navbarDropdown" role="button" data-toggle="dropdown"
aria-haspopup="true" aria-expanded="false">
<span class="d-none d-md-block">Create New
<i class="fa fa-angle-down"></i>
</span>
<span class="d-block d-md-none">
<i class="fa fa-plus"></i>
</span>
</a>
<div class="dropdown-menu" aria-labelledby="navbarDropdown" ngbDropdownMenu>
<a class="dropdown-item" href="#">Action</a>
<a class="dropdown-item" href="#">Another action</a>
<div class="dropdown-divider"></div>
<a class="dropdown-item" href="#">Something else here</a>
</div>
</li>
<!-- ============================================================== -->
<!-- Search -->
<!-- ============================================================== -->
<li class="nav-item search-box">
<a (click)="showSearch = !showSearch" class="nav-link waves-effect waves-dark" href="javascript:void(0)">
<i class="ti-search"></i>
</a>
<form class="app-search position-absolute" [ngClass]="{'show-search': showSearch}">
<input type="text" class="form-control" placeholder="Search &amp; enter">
<a class="srh-btn" (click)="showSearch = !showSearch">
<i class="ti-close"></i>
</a>
</form>
</li>
</ul>
<!-- ============================================================== -->
<!-- Right side toggle and nav items -->
......
src/app/shared/vertical-sidebar/vertical-menu-items.ts
import { RouteInfo } from "./vertical-sidebar.metadata";
export const ROUTES: RouteInfo[] = [
{
path: "manage",
title: "Manage",
icon: "Home",
class: "has-arrow",
extralink: false,
label: "",
labelClass: "badge badge-info sidebar-badge",
submenu: [
{
path: '/apps/portal-category-manage',
title: 'Category Manage',
path: '/apps/portal-create-category',
title: 'รายการเอกสาร',
icon: 'mdi mdi-adjust',
class: '',
label: "",
......@@ -21,18 +13,8 @@ export const ROUTES: RouteInfo[] = [
submenu: []
},
{
path: '/apps/portal-template-manage',
title: 'Template Manage',
icon: 'mdi mdi-adjust',
class: '',
label: "",
labelClass: "",
extralink: true,
submenu: []
},
{
path: '/apps/portal-category-list-approve',
title: 'Category List Approve',
path: '/apps/import-template',
title: 'นำเข้า Template',
icon: 'mdi mdi-adjust',
class: '',
label: "",
......@@ -41,18 +23,8 @@ export const ROUTES: RouteInfo[] = [
submenu: []
},
{
path: '/apps/portal-template-approve',
title: 'Template List Approve',
icon: 'mdi mdi-adjust',
class: '',
label: "",
labelClass: "",
extralink: true,
submenu: []
},
{
path: '/apps/portal-category-list',
title: 'Category List',
path: '/apps/export-template',
title: 'ส่งออก Template',
icon: 'mdi mdi-adjust',
class: '',
label: "",
......@@ -61,22 +33,18 @@ export const ROUTES: RouteInfo[] = [
submenu: []
},
{
path: '/apps/portal-template-list',
title: 'Template List',
icon: 'mdi mdi-adjust',
class: '',
path: "",
title: "การจัดการ",
icon: "edit",
class: "has-arrow",
extralink: false,
label: "",
labelClass: "",
extralink: true,
submenu: []
},
]
},
labelClass: "badge badge-info sidebar-badge",
submenu: [
{
path: '/apps/portal-create-category',
title: 'Create Category',
icon: 'mdi mdi-adjust',
path: '/apps/portal-category-list-approve',
title: 'รายการอนุมัติ',
icon: '',
class: '',
label: "",
labelClass: "",
......@@ -84,25 +52,18 @@ export const ROUTES: RouteInfo[] = [
submenu: []
},
{
path: '/apps/import-template',
title: 'Import Template',
icon: 'mdi mdi-adjust',
path: '/apps/portal-category-list',
title: 'รายการเอกสาร',
icon: '',
class: '',
label: "",
labelClass: "",
extralink: false,
submenu: []
},
{
path: '/apps/export-template',
title: 'Export Template',
icon: 'mdi mdi-adjust',
class: '',
label: "",
labelClass: "",
extralink: false,
submenu: []
]
},
//
// {
......
src/environments/environment.ts
......@@ -3,6 +3,7 @@
// The list of file replacements can be found in `angular.json`.
export const environment = {
url:'http://192.168.40.35:30537/',
production: false
};
......
src/index.html
......@@ -8,10 +8,10 @@
<meta name="keywords" content="wrappixel, admin dashboard, html css dashboard, web dashboard, angular admin, angular, css3 dashboard, angular dashboard, xtreme admin angular dashboard, frontend, responsive angular admin template, material design, material dashboard angular dashboard template">
<meta name="description" content="Xtreme is powerful and clean admin dashboard template, inpired from Bootstrap Framework">
<meta name="robots" content="noindex,nofollow">
<title>Xtreme Admin Template by WrapPixel</title>
<title>myHR Portal</title>
<link rel="canonical" href="https://www.wrappixel.com/templates/xtreme-angular-admin/" />
<!-- Favicon icon -->
<link rel="icon" type="image/png" sizes="16x16" href="assets/images/favicon.png">
<link rel="icon" type="image/png" sizes="16x16" href="assets/images/logo-myhr-dark.png">
<link
href="https://fonts.googleapis.com/css2?family=Nunito:wght@300;400;600;700;800&display=swap"
rel="stylesheet"
......
src/styles.scss
/* You can add global styles to this file, and also import other style files */
@import url('https://fonts.googleapis.com/css?family=Nunito+Sans:300,400,600,700,800');
\ No newline at end of file
@import url('https://fonts.googleapis.com/css?family=Nunito+Sans:300,400,600,700,800');
@import url("https://fonts.googleapis.com/css?family=Kanit:300,400,600,700,800");
@import url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css");
body {
font-family: "Kanit", sans-serif !important;
}
\ 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