Commit 81d51eb9 by Natthaphat

เพิ่ม เมนู รายการเอกสารผ่านการอนุมัติ ของ myPortal

parent 5eacc6c2
......@@ -153,6 +153,41 @@ export const admin: Routes = [
loadComponent: () =>
import('./myportal/management/portal-category-list-approve/approve-course/approve-course.component').then((m) => m.ApproveCourseComponent),
},
{
path: 'approved-list',
loadComponent: () =>
import('./myportal/management/approved-list/approved-list.component').then((m) => m.ApprovedListComponent),
},
{
path: 'view-list-excel',
loadComponent: () =>
import('./myportal/management/approved-list/view-list-excel/view-list-excel.component').then((m) => m.ViewListExcelComponent),
},
{
path: 'view-list-excel/:type',
loadComponent: () =>
import('./myportal/management/approved-list/view-list-excel/view-list-excel.component').then((m) => m.ViewListExcelComponent),
},
{
path: 'view-list-doc',
loadComponent: () =>
import('./myportal/management/approved-list/view-list-doc/view-list-doc.component').then((m) => m.ViewListDocComponent),
},
{
path: 'view-list-doc/:type',
loadComponent: () =>
import('./myportal/management/approved-list/view-list-doc/view-list-doc.component').then((m) => m.ViewListDocComponent),
},
{
path: 'view-list-course',
loadComponent: () =>
import('./myportal/management/approved-list/view-list-course/view-list-course.component').then((m) => m.ViewListCourseComponent),
},
{
path: 'view-list-course/:type',
loadComponent: () =>
import('./myportal/management/approved-list/view-list-course/view-list-course.component').then((m) => m.ViewListCourseComponent),
},
//////////////emp/////////////////
{
path: 'emp/department',
......@@ -164,7 +199,6 @@ export const admin: Routes = [
loadComponent: () =>
import('./employee/position/position.component').then((m) => m.PositionComponent),
},
]
}
];
......
<app-page-header [title]="'รายการเอกสารผ่านการอนุมัติ'" [activeTitle]="'รายการเอกสารผ่านการอนุมัติ'" [title1]="'อนุมัติหลักสูตร'"></app-page-header>
<!-- <div class="row">
<div class="col-12">
<div class="card card-body">
<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="max-w-7xl mx-auto">
<div class="box p-4">
<h4 class="text-xl font-semibold text-gray-800 mb-6">รายการเอกสาร</h4>
<!-- Flex แทน Grid -->
<div class="flex flex-wrap justify-center gap-6">
<div
class=" bg-white rounded-xl shadow-lg overflow-hidden transform hover:scale-105 transition duration-300 ease-in-out flex flex-col" style="width: 30%;"
*ngFor="let c of testdata | slice: (page-1) * pageSize : (page-1) * pageSize + pageSize"
>
<div class="p-8 text-center">
<div class="w-24 h-24 mx-auto rounded-full bg-green-100 flex items-center justify-center shadow-inner">
<img src="{{ c.img }}" class="" alt="" />
</div>
<h3 class="text-2xl font-bold text-gray-800 mt-6 mb-2">{{ c.name }}</h3>
</div>
<!-- Footer -->
<div class="mt-auto">
<div class="flex justify-between items-center bg-gray-50 border-t border-gray-200 p-4">
<div>
<span class="text-sm text-gray-700">จำนวนเอกสาร {{ c.document }} ฉบับ</span>
</div>
<div>
<button
class="bg-primary inline-flex items-center px-4 py-2 bg-blue-600 hover:bg-blue-700 text-white text-sm font-medium rounded-md shadow-md transition duration-150 ease-in-out focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-opacity-50"
(click)="openView(c.id)"
>
รายละเอียด
</button>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
\ No newline at end of file
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { ApprovedListComponent } from './approved-list.component';
describe('ApprovedListComponent', () => {
let component: ApprovedListComponent;
let fixture: ComponentFixture<ApprovedListComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ ApprovedListComponent ]
})
.compileComponents();
});
beforeEach(() => {
fixture = TestBed.createComponent(ApprovedListComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
import { Component, OnInit } from '@angular/core';
import { Router, RouterModule } from '@angular/router';
import { DocumentService } from '../../../../services/document.service';
import { CourseService } from '../../../../services/course.service';
import { ExcelService } from '../../../../services/excel.service';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { TranslateModule } from '@ngx-translate/core';
import { SharedModule } from '../../../../../shared/shared.module';
@Component({
selector: 'app-approved-list',
templateUrl: './approved-list.component.html',
styleUrls: ['./approved-list.component.scss'],
standalone: true,
imports: [
CommonModule,
FormsModule,
RouterModule,
TranslateModule,
SharedModule,
],
})
export class ApprovedListComponent implements OnInit {
constructor(
private routes: Router,
private excelService:ExcelService,private documentService:DocumentService,private courseService:CourseService
) {}
page = 1;
pageSize = 10;
testdata: {
id:string;
img: String;
name: String;
details: String;
document: String;
}[] = [];
ngOnInit() {
this.testdata = [
{
id:'1',
img: "assets/images/icons/excel.png",
name: "Excel",
details: "xxxxxxxxxxxxxxxxxxxxxxxxxxx",
document: "0"
},
{
id:'2',
img: "assets/images/icons/document.png",
name: "Document",
details: "xxxxxxxxxxxxxxxxxxxxxxxxxxx",
document: "0"
},
{
id:'3',
img: "assets/images/icons/course.png",
name: "Course",
details: "xxxxxxxxxxxxxxxxxxxxxxxxxxx",
document: "0"
},
];
this.getListCount();
}
async getListCount(){
try {
const countExcel = await this.excelService.getCountContent().toPromise();
const countDoc = await this.documentService.getCountContent().toPromise();
const countCourse = await this.courseService.getCountContent().toPromise();
this.testdata.forEach((x ,i) => {
if(i == 0){
x.document = (countExcel ?? 0).toString()
}else if(i == 1){
x.document = (countDoc ?? 0).toString()
}else if(i == 2){
x.document = (countCourse ?? 0).toString()
}
})
} catch (error) {
console.error('Error loading data:', error);
}
}
openView(id:string){
if(id =='1'){
this.routes.navigate(['/admin/view-list-excel/1']);
}else if(id =='2'){
this.routes.navigate(['/admin/view-list-doc/1']);
}else if(id =='3'){
this.routes.navigate(['/admin/view-list-course/1']);
}
}
}
import { Component, OnInit } from '@angular/core';
import { NgbModal, NgbPaginationModule } from '@ng-bootstrap/ng-bootstrap';
import { ActivatedRoute } from '@angular/router';
import { OpenImageComponent } from '../../../open-image/open-image.component';
import { ConfirmModalComponent } from '../../../confirm-modal/confirm-modal.component';
import { AlertModalComponent } from '../../../alert-modal/alert-modal.component';
import { firstValueFrom } from 'rxjs';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { RouterModule } from '@angular/router';
import { NgSelectModule } from '@ng-select/ng-select';
import { SharedModule } from '../../../../../../shared/shared.module';
import { MatDialogModule } from '@angular/material/dialog';
import { TranslateModule } from '@ngx-translate/core';
import { CourseContentModel } from '../../../../../models/course-content.model';
import { CourseService } from '../../../../../services/course.service';
declare var require: any
import FileSaver from 'file-saver';
@Component({
selector: 'app-view-list-course',
templateUrl: './view-list-course.component.html',
styleUrls: ['./view-list-course.component.scss'],
standalone: true,
imports: [
CommonModule,
FormsModule,
RouterModule,
NgSelectModule,
SharedModule,
MatDialogModule,
TranslateModule,
NgbPaginationModule,
],
})
export class ViewListCourseComponent implements OnInit {
page = 0;
pageSize = 10;
listCourse: CourseContentModel[] = []
search: string = ''
checkType: string = '0'
pagedItems: CourseContentModel[];
constructor(private modalService: NgbModal, private courseService: CourseService, private activatedRoute: ActivatedRoute) {
this.activatedRoute.paramMap.subscribe(result => {
this.checkType = result.get("type")!;
});
}
get totalItems(): number {
return this.search == ''
? this.listCourse.length
: this.filterListCourse().length;
}
get totalPages(): number {
return Math.ceil(this.totalItems / this.pageSize);
}
get totalPagesArray(): number[] {
return Array(this.totalPages).fill(0);
}
goToPage(index: number): void {
if (index < 0 || index >= this.totalPages) return;
this.page = index;
this.updatePagedItems();
}
updatePagedItems() {
const data: CourseContentModel[] = this.search === '' ? this.listCourse : this.filterListCourse();
const start = this.page * this.pageSize;
const end = start + this.pageSize;
this.pagedItems = data.slice(start, end);
}
openEmployeeModal(image: string) {
const modalRef = this.modalService.open(OpenImageComponent, {
centered: true,
windowClass: 'my-dialog-img-preview'
})
modalRef.componentInstance.linkImage = image
modalRef.result.then(result => {
}, reason => {
this.modalService.dismissAll()
})
}
async downloadFile(logId: string) {
try {
const data = await this.courseService.downloadFileContent(logId).toPromise();
if (data) {
FileSaver.saveAs(new Blob([data]), "file_download.json");
}
} 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()))
}
async getListCourse() {
try {
const data = await firstValueFrom(this.courseService.getListCourseContent('0'));
this.listCourse = data.map(x => new CourseContentModel(x))
console.log("🚀 ~ ViewListCourseComponent ~ getListCourse ~ this.listCourse :", this.listCourse)
} catch (error) {
console.error('Error loading data:', error);
}
}
deleteFile(item: CourseContentModel) {
const modalRef = this.modalService.open(ConfirmModalComponent, {
centered: true,
backdrop: 'static',
})
modalRef.componentInstance.message = 'คุณต้องการลบข้อมูลหรือไม่'
modalRef.result.then(result => {
this.courseService.deleteCourseContent(item).subscribe(result => {
if (result) {
this.openAlertModal('ลบข้อมูลสำเร็จ')
this.getListCourse();
} else {
this.openAlertModal('ไม่สามารถลบข้อมูลได้')
}
}, error => {
this.openAlertModal(error.message)
})
}, reject => { })
}
ngOnInit() {
this.getListCourse();
}
openLink(url: string) {
window.open(url, "_blank");
}
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()
})
}
coverDate(date: string) {
return date.split('-').reverse().join('/')
}
}
import { Component, OnInit } from '@angular/core';
import { NgbModal, NgbPaginationModule } from '@ng-bootstrap/ng-bootstrap';
import { ActivatedRoute } from '@angular/router';
import { OpenImageComponent } from '../../../open-image/open-image.component';
import { ConfirmModalComponent } from '../../../confirm-modal/confirm-modal.component';
import { AlertModalComponent } from '../../../alert-modal/alert-modal.component';
import { firstValueFrom } from 'rxjs';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { RouterModule } from '@angular/router';
import { NgSelectModule } from '@ng-select/ng-select';
import { SharedModule } from '../../../../../../shared/shared.module';
import { MatDialogModule } from '@angular/material/dialog';
import { TranslateModule } from '@ngx-translate/core';
import { DocumentContentModel } from '../../../../../models/document-content.model';
import { DocumentService } from '../../../../../services/document.service';
declare var require: any
import FileSaver from 'file-saver';
@Component({
selector: 'app-view-list-doc',
templateUrl: './view-list-doc.component.html',
styleUrls: ['./view-list-doc.component.scss'],
standalone: true,
imports: [
CommonModule,
FormsModule,
RouterModule,
NgSelectModule,
SharedModule,
MatDialogModule,
TranslateModule,
NgbPaginationModule,
],
})
export class ViewListDocComponent implements OnInit {
page = 0;
pageSize = 10;
listDoc: DocumentContentModel[] = []
search: string = ''
checkType: string = '0'
pagedItems: DocumentContentModel[] = [];
constructor(private modalService: NgbModal, private documentService: DocumentService, private activatedRoute: ActivatedRoute) {
this.activatedRoute.paramMap.subscribe(result => {
this.checkType = result.get("type")!;
});
}
get totalItems(): number {
return this.search == ''
? this.listDoc.length
: this.filterListDoc().length;
}
get totalPages(): number {
return Math.ceil(this.totalItems / this.pageSize);
}
get totalPagesArray(): number[] {
return Array(this.totalPages).fill(0);
}
goToPage(index: number): void {
if (index < 0 || index >= this.totalPages) return;
this.page = index;
this.updatePagedItems();
}
updatePagedItems() {
const data: DocumentContentModel[] = this.search === '' ? this.listDoc : this.filterListDoc();
const start = this.page * this.pageSize;
const end = start + this.pageSize;
this.pagedItems = data.slice(start, end);
}
openEmployeeModal(image: string) {
const modalRef = this.modalService.open(OpenImageComponent, {
centered: true,
windowClass: 'my-dialog-img-preview'
})
modalRef.componentInstance.linkImage = image
modalRef.result.then(result => {
}, reason => {
this.modalService.dismissAll()
})
}
deleteFile(item: DocumentContentModel) {
const modalRef = this.modalService.open(ConfirmModalComponent, {
centered: true,
backdrop: 'static',
})
modalRef.componentInstance.message = 'คุณต้องการลบข้อมูลหรือไม่'
modalRef.result.then(result => {
this.documentService.deleteExcelContent(item).subscribe(result => {
if (result) {
this.openAlertModal('ลบข้อมูลสำเร็จ')
this.getListDoc();
} else {
this.openAlertModal('ไม่สามารถลบข้อมูลได้')
}
}, error => {
this.openAlertModal(error.message)
})
}, reject => { })
}
async downloadFile(logId: string, lang: string) {
try {
const data = await this.documentService.downloadFileContent(logId, lang).toPromise();
if (data) {
FileSaver.saveAs(new Blob([data]), "file_download.doc");
}
} 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()))
}
async getListDoc() {
try {
const data = await firstValueFrom(this.documentService.getListExcelContent('0'));
this.listDoc = data.map(x => new DocumentContentModel(x))
} catch (error) {
console.error('Error loading data:', error);
}
}
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()
})
}
openLink(url: string) {
window.open(url, "_blank");
}
coverDate(date: string) {
return date.split('-').reverse().join('/')
}
}
import { Component, OnInit } from '@angular/core';
import { NgbModal, NgbPaginationModule } from '@ng-bootstrap/ng-bootstrap';
import { ActivatedRoute } from '@angular/router';
import { ExcelContentModel } from '../../../../../models/excel-content.model';
import { ExcelService } from '../../../../../services/excel.service';
import { OpenImageComponent } from '../../../open-image/open-image.component';
import { ConfirmModalComponent } from '../../../confirm-modal/confirm-modal.component';
import { AlertModalComponent } from '../../../alert-modal/alert-modal.component';
import { firstValueFrom } from 'rxjs';
import { CommonModule } from '@angular/common';
import { FormsModule } from '@angular/forms';
import { RouterModule } from '@angular/router';
import { NgSelectModule } from '@ng-select/ng-select';
import { SharedModule } from '../../../../../../shared/shared.module';
import { MatDialogModule } from '@angular/material/dialog';
import { TranslateModule } from '@ngx-translate/core';
declare var require: any
import FileSaver from 'file-saver';
@Component({
selector: 'app-view-list-excel',
templateUrl: './view-list-excel.component.html',
styleUrls: ['./view-list-excel.component.scss'],
standalone: true,
imports: [
CommonModule,
FormsModule,
RouterModule,
NgSelectModule,
SharedModule,
MatDialogModule,
TranslateModule,
NgbPaginationModule,
],
})
export class ViewListExcelComponent implements OnInit {
page = 0;
pageSize = 10;
listExcel: ExcelContentModel[] = []
search: string = ''
checkType: string = '0'
pagedItems: ExcelContentModel[] = [];
constructor(private modalService: NgbModal, private excelService: ExcelService, private activatedRoute: ActivatedRoute,) {
this.activatedRoute.paramMap.subscribe(result => {
this.checkType = result.get("type")!;
});
}
get totalItems(): number {
return this.search == ''
? this.listExcel.length
: this.filterListExcel().length;
}
get totalPages(): number {
return Math.ceil(this.totalItems / this.pageSize);
}
get totalPagesArray(): number[] {
return Array(this.totalPages).fill(0);
}
goToPage(index: number): void {
if (index < 0 || index >= this.totalPages) return;
this.page = index;
this.updatePagedItems();
}
updatePagedItems() {
const data: ExcelContentModel[] = this.search === '' ? this.listExcel : this.filterListExcel();
const start = this.page * this.pageSize;
const end = start + this.pageSize;
this.pagedItems = data.slice(start, end);
}
openEmployeeModal(image: string) {
const modalRef = this.modalService.open(OpenImageComponent, {
centered: true,
windowClass: 'my-dialog-img-preview'
})
modalRef.componentInstance.linkImage = image
modalRef.result.then(result => {
}, reason => {
this.modalService.dismissAll()
})
}
deleteFile(item: ExcelContentModel) {
const modalRef = this.modalService.open(ConfirmModalComponent, {
centered: true,
backdrop: 'static',
})
modalRef.componentInstance.message = 'คุณต้องการลบข้อมูลหรือไม่'
modalRef.result.then(result => {
this.excelService.deleteExcelContent(item).subscribe(result => {
if (result) {
this.openAlertModal('ลบข้อมูลสำเร็จ')
this.getListExcel();
} else {
this.openAlertModal('ไม่สามารถลบข้อมูลได้')
}
}, error => {
this.openAlertModal(error.message)
})
}, reject => { })
}
async downloadFile(logId: string) {
try {
const data = await this.excelService.downloadFileContent(logId).toPromise();
if (data) {
FileSaver.saveAs(new Blob([data]), "file_download.xlsx");
}
} catch (error) {
console.error('Error loading data:', error);
}
}
getStatus(status: string): string {
if (status === '0') {
return 'รออนุมัติ';
} else if (status === '1') {
return 'เปิดใช้งาน';
} else if (status === '2') {
return 'ไม่อนุมัติ';
} else {
return 'ไม่ทราบสถานะ'; // สำหรับกรณีที่ไม่ตรงกับเงื่อนไขใดเลย
}
}
filterListExcel() {
return this.listExcel.filter(x => x.thName.toLowerCase().includes(this.search.toLowerCase()) || x.engName.toLowerCase().includes(this.search.toLowerCase()))
}
async getListExcel() {
try {
const data = await firstValueFrom(this.excelService.getListExcelContent('0'));
this.listExcel = data.map(x => new ExcelContentModel(x))
} catch (error) {
console.error('Error loading data:', error);
}
}
ngOnInit() {
this.getListExcel();
}
openLink(url: string) {
window.open(url, "_blank");
}
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()
})
}
coverDate(date: string) {
return date.split('-').reverse().join('/')
}
}
......@@ -131,35 +131,35 @@
<!-- <td >{{data.id}}</td> -->
<td>{{ data.thName }}</td>
<td>{{ data.thDesc }}</td>
<td class="text-center"><i class="fas fa-link pointer" (click)="openLink(data.link1)"></i></td>
<td class="text-center"> <i class="fas fa-download pointer" (click)="downloadFile(data.logId)"></i></td>
<td class="text-center"><i class="ri-links-line text-base font-bold cursor-pointer hover:text-primary" (click)="openLink(data.link1)"></i></td>
<td class="text-center"> <i class="fa fa-download text-base font-bold cursor-pointer hover:text-primary" (click)="downloadFile(data.logId)"></i></td>
<td class="text-center">
<span class="fa-stack rt_anim" *ngIf="data.status == 0" ngbTooltip="รออนุมัติ" container="body"
tooltipClass="myhrcolor-1">
<i class="fa fa-circle fa-stack-2x text-info"></i>
<i class=" fas fa-hourglass-half fa-stack-1x fa-inverse"></i>
<i class=" fa fa-hourglass-half fa-stack-1x fa-inverse"></i>
</span>
<span class="fa-stack rt_anim" *ngIf="data.status == 1" ngbTooltip="เปิดใช้งาน" container="body"
tooltipClass="myhrcolor-2">
<i class="fa fa-circle fa-stack-2x text-success"></i>
<i class=" fas fa-check fa-stack-1x fa-inverse"></i>
<i class=" fa fa-check fa-stack-1x fa-inverse"></i>
</span>
<span class="fa-stack rt_anim" *ngIf="data.status == 2" ngbTooltip="ไม่อนุมัติ" container="body"
tooltipClass="myhrcolor-3">
<i class="fa fa-circle fa-stack-2x text-danger"></i>
<i class="fas fa-times fa-stack-1x fa-inverse" style="font-size: 1.25em;"></i>
<i class="fa fa-times fa-stack-1x fa-inverse" style="font-size: 1.25em;"></i>
</span>
</td>
<td>
<button type="button" class="btn btn-circle btn-success rounded-circle btn-sm mr-2"
<button type="button" class="bg-success hover:bg-success text-white text-sm ml-5 w-10 h-10 flex items-center justify-center rounded-full"
(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>
<button type="button" 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>
<button type="button" class="bg-danger hover:bg-danger text-white text-sm ml-5 w-10 h-10 flex items-center justify-center rounded-full"
(click)="onCancelApprove(data)"><i class="fa fa-times"></i></button>
<button type="button" class="bg-danger hover:bg-danger text-white text-sm ml-5 w-10 h-10 flex items-center justify-center rounded-full"
(click)="deleteFile(data)" placement="top" ngbTooltip="ลบ"><i class="fa fa-trash"></i></button>
</td>
</tr>
</tbody>
......
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