Skip to content

M
myhr-portal
Commit 2a1273b8 by Nakarin Luankla
Options

UPDATE mdel ใหม่ ,download file

parent 6242f8d4
Showing with 897 additions and 230 deletions
package-lock.json
This source diff could not be displayed because it is too large. You can view the blob instead.
package.json
......@@ -3,7 +3,7 @@
"version": "0.0.0",
"scripts": {
"ng": "ng",
"start": "ng serve",
"start": "ng serve --host 192.168.68.85",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
......@@ -51,6 +51,7 @@
"dom-autoscroller": "^2.3.4",
"dom-plane": "^1.0.2",
"dom-set": "^1.1.1",
"file-saver": "^2.0.5",
"flatpickr": "^4.6.6",
"handlebars": "^4.7.7",
"lodash": "^4.17.19",
......
src/app/apps/approve-course/approve-course.component.html
......@@ -25,7 +25,7 @@
</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><img width="100" class="border p-1" src="{{data.getImage()}}"></td>
<td>{{ data.thName }}</td>
<td class="text-wrap">{{ data.thDesc }}</td>
<td>{{data.ctype}}</td>
......
src/app/apps/approve-course/approve-course.component.ts
......@@ -32,7 +32,7 @@ export class ApproveCourseComponent implements OnInit {
async getListCourse(){
try {
const data = await this.courseService.getListCourse('0').toPromise();
this.listCourse = data
this.listCourse = data.map(x => new CourseModel(x))
} catch (error) {
console.error('Error loading data:', error);
}
......
src/app/apps/approve-doc/approve-doc.component.html
......@@ -26,7 +26,7 @@
</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><img width="100" class="border p-1" src="{{data.getImage()}}"></td>
<!-- <td >{{data.id}}</td> -->
<td>{{ data.thName }}</td>
<td>{{ data.thDesc }}</td>
......
src/app/apps/approve-doc/approve-doc.component.ts
......@@ -32,7 +32,7 @@ export class ApproveDocComponent implements OnInit {
async getListDoc(){
try {
const data = await this.documentService.getListDoc('0').toPromise();
this.listDoc = data
this.listDoc = data.map(x => new DocumentModel(x))
} catch (error) {
console.error('Error loading data:', error);
}
......
src/app/apps/approve-excel/approve-excel.component.html
......@@ -14,9 +14,9 @@
<!-- <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" class="text-center">ลิงค์</th>
<th scope="col" class="text-center">สถานะ</th>
<th scope="col" class="text-center">ไฟล์</th>
<th scope="col"></th>
</tr>
</thead>
......@@ -26,13 +26,30 @@
</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><img width="100" class="border p-1" src="{{data.getImage()}}"></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 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">
<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>
</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>
</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>
</span>
</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>
......
src/app/apps/approve-excel/approve-excel.component.spec.ts deleted 100644 → 0
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { ApproveExcelComponent } from './approve-excel.component';
describe('ApproveExcelComponent', () => {
let component: ApproveExcelComponent;
let fixture: ComponentFixture<ApproveExcelComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ ApproveExcelComponent ]
})
.compileComponents();
});
beforeEach(() => {
fixture = TestBed.createComponent(ApproveExcelComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
src/app/apps/approve-excel/approve-excel.component.ts
......@@ -4,7 +4,8 @@ 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';
declare var require: any
const FileSaver = require('file-saver');
@Component({
selector: 'app-approve-excel',
templateUrl: './approve-excel.component.html',
......@@ -17,13 +18,14 @@ export class ApproveExcelComponent implements OnInit {
search:string = ''
constructor(private modalService: NgbModal,private excelService:ExcelService) {
}
getStatus(status:string){
if(status == '0'){
return 'รออนุมัติ'
} else if(status == '1'){
return 'เปิดใช้งาน'
} else if(status == '2'){
return 'ไม่อนุมัติ'
async downloadFile(logId:string){
try {
const data = await this.excelService.downloadFile(logId).toPromise();
if(data){
FileSaver.saveAs(new Blob([data]), "file_download.xlsx");
}
} catch (error) {
console.error('Error loading data:', error);
}
}
filterListExcel(){
......@@ -32,7 +34,7 @@ export class ApproveExcelComponent implements OnInit {
async getListExcel(){
try {
const data = await this.excelService.getListExcel('0').toPromise();
this.listExcel = data
this.listExcel = data.map(x => new ExcelModel(x))
} catch (error) {
console.error('Error loading data:', error);
}
......@@ -93,4 +95,7 @@ export class ApproveExcelComponent implements OnInit {
this.modalService.dismissAll()
})
}
openLink(url:string){
window.open(url, "_blank");
}
}
src/app/apps/apps.module.ts
......@@ -90,6 +90,9 @@ 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';
import { ViewListExcelComponent } from './view-list-excel/view-list-excel.component';
import { ViewListDocComponent } from './view-list-doc/view-list-doc.component';
import { ViewListCourseComponent } from './view-list-course/view-list-course.component';
@NgModule({
......@@ -157,7 +160,10 @@ import { ApproveCourseComponent } from './approve-course/approve-course.componen
AlertModalComponent,
ListCourseComponent,
ApproveDocComponent,
ApproveCourseComponent
ApproveCourseComponent,
ViewListExcelComponent,
ViewListDocComponent,
ViewListCourseComponent
],
providers: [
ContactService,
......
src/app/apps/apps.routing.ts
......@@ -43,6 +43,9 @@ 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";
import { ViewListCourseComponent } from "./view-list-course/view-list-course.component";
import { ViewListExcelComponent } from "./view-list-excel/view-list-excel.component";
import { ViewListDocComponent } from "./view-list-doc/view-list-doc.component";
export const AppsRoutes: Routes = [
{
path: "",
......@@ -248,6 +251,39 @@ export const AppsRoutes: Routes = [
},
},
{
path: "view-list-excel",
component: ViewListExcelComponent,
data: {
title: "รายการ Excel",
urls: [
{ title: "รายการเอกสาร" ,url: "apps/portal-category-list"},
{title:"รายการ Excel"}
],
},
},
{
path: "view-list-doc",
component: ViewListDocComponent,
data: {
title: "รายการเอกสาร",
urls: [
{ title: "รายการเอกสาร" ,url: "apps/portal-category-list"},
{title:"รายการเอกสาร"}
],
},
},
{
path: "view-list-course",
component: ViewListCourseComponent,
data: {
title: "รายการหลักสูตร",
urls: [
{ title: "รายการเอกสาร" ,url: "apps/portal-category-list"},
{title:"รายการหลักสูตร"}
],
},
},
{
path: "portal-template-list",
component: PortalTemplateListComponent,
data: {
......@@ -261,9 +297,9 @@ export const AppsRoutes: Routes = [
path: "portal-create-category",
component: PortalCreateCategoryComponent,
data: {
title: "รายการเอกสาร",
title: "รายการอัพโหลดเอกสาร",
urls: [
{ title: "รายการเอกสาร" },
{ title: "รายการอัพโหลดเอกสาร" },
],
},
},
......@@ -293,7 +329,7 @@ export const AppsRoutes: Routes = [
data: {
title: "รายการเอกสาร",
urls: [
{ title: "รายการเอกสาร", url: "apps/portal-create-category" },
{ title: "รายการอัพโหลดเอกสาร", url: "apps/portal-create-category" },
{ title: "รายการเอกสาร" },
],
},
......@@ -304,7 +340,7 @@ export const AppsRoutes: Routes = [
data: {
title: "รายการ Excel",
urls: [
{ title: "รายการเอกสาร", url: "apps/portal-create-category" },
{ title: "รายการอัพโหลดเอกสาร", url: "apps/portal-create-category" },
{ title: "รายการ Excel" },
],
},
......@@ -315,7 +351,7 @@ export const AppsRoutes: Routes = [
data: {
title: "รายการหลักสูตร",
urls: [
{ title: "รายการเอกสาร", url: "apps/portal-create-category" },
{ title: "รายการอัพโหลดเอกสาร", url: "apps/portal-create-category" },
{ title: "รายการหลักสูตร" },
],
},
......
src/app/apps/confirm-modal/confirm-modal.component.spec.ts deleted 100644 → 0
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/list-course/list-course.component.html
......@@ -23,11 +23,11 @@
<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><img width="100" class="border p-1" src="{{data.getImage()}}"></td>
<!-- <td >{{data.id}}</td> -->
<td>{{ data.thName }}</td>
<td class="text-wrap">{{ data.thDesc }}</td>
<td>{{data.ctype}}</td>
<td>{{data.courseType}}</td>
<td><a href="{{data.link1}}" target="_blank">คลิก</a></td>
<td>{{ getStatus(data.status) }}</td>
<!-- <td><a (click)="downloadFile(data.logId)">ดาวน์โหลด</a></td> -->
......@@ -162,13 +162,12 @@
</div>
</div>
<div class="form-group row">
<label for="name" class="col-sm-4 col-form-label">Link รูปภาพตัวอย่างรายงาน</label>
<label for="name" class="col-sm-4 col-form-label">รูปภาพตัวอย่าง</label>
<div class="col-sm-8">
<input type="text" class="form-control"[(ngModel)]="modelCourse.thumbnail">
<input type="file" class="form-control" (change)="onUploadImage($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">
......@@ -186,7 +185,7 @@
<div class="modal-footer ">
<button type="submit" class="btn btn-info" (click)="onSumit()" [disabled]="!modelCourse.tname||!modelCourse.ename">บันทึก</button>
<button type="submit" class="btn btn-info" (click)="onSumit()" [disabled]="!modelCourse.thName||!modelCourse.engName">บันทึก</button>
<button type="button" class="btn btn-danger" (click)="closeBtnClick()">ปิด</button>
</div>
</div>
......
src/app/apps/list-course/list-course.component.spec.ts deleted 100644 → 0
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
......@@ -5,6 +5,7 @@ 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';
import { UploadService } from 'src/app/service/upload.service';
@Component({
selector: 'app-list-course',
......@@ -18,9 +19,23 @@ export class ListCourseComponent implements OnInit {
modelCourse:CourseModel = new CourseModel({});
checkEdit:boolean = false
search:string = ''
constructor(private modalService: NgbModal,private courseService:CourseService) {
constructor(private modalService: NgbModal,private courseService:CourseService,private uploadService:UploadService) {
}
async onUploadImage(event:any){
try{
if (event.target.files.length > 0) {
let fileData = event.target.files[0];
const formData = new FormData();
formData.append('file', fileData);
const data = await this.uploadService.uploadImage(formData).toPromise();
if(data){
this.modelCourse.thumbnail = data.body.fileId
}
}
} catch (error) {
console.error('Error loading data:', error);
}
}
onSelectFile(event:any) {
if (event.target.files && event.target.files[0]) {
let reader = new FileReader();
......@@ -161,7 +176,7 @@ export class ListCourseComponent implements OnInit {
async getListCourse(){
try {
const data = await this.courseService.getListCourse().toPromise();
this.listCourse = data
this.listCourse = data.map(x => new CourseModel(x))
} catch (error) {
console.error('Error loading data:', error);
}
......@@ -177,7 +192,6 @@ export class ListCourseComponent implements OnInit {
closeBtnClick() {
this.modalService.dismissAll();
this.ngOnInit();
}
}
src/app/apps/list-doc/list-doc.component.html
......@@ -15,22 +15,41 @@
<!-- <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" class="text-center">ลิงค์</th>
<th scope="col" class="text-center">ไฟล์ (ไทย)</th>
<th scope="col" class="text-center">ไฟล์ (อังกฤษ)</th>
<th scope="col" class="text-center">สถานะ</th>
<th scope="col"></th>
</tr>
</thead>
<tbody>
<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><img width="100" class="border p-1" src="{{data.getImage()}}"></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 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,'tha')"></i></td>
<td class="text-center"> <i class="fas fa-download pointer" (click)="downloadFile(data.logId,'eng')"></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>
</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>
</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>
</span>
</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>
......@@ -72,27 +91,27 @@
<div class="modal-body">
<div class="form-group row">
<label for="nameth" 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" [(ngModel)]="modelDoc.thName">
</div>
</div>
<div class="form-group row">
<label for="nameeng" 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" [(ngModel)]="modelDoc.engName">
</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" [(ngModel)]="modelDoc.thDesc"></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" [(ngModel)]="modelDoc.engDesc"></textarea>
</div>
......@@ -107,15 +126,24 @@
<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,'th')">
<div class="msg-detail">ไฟล์ที่อนุญาต:*.doc</div>
</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)">
<input type="file" class="form-control" (change)="onSelectFile($event,'eng')">
<div class="msg-detail">ไฟล์ที่อนุญาต:*.doc</div>
</div>
</div>
<div class="form-group row">
<label for="name" class="col-sm-4 col-form-label">Link รูปภาพตัวอย่างรายงาน</label>
<label for="name" class="col-sm-4 col-form-label">รูปภาพตัวอย่าง</label>
<div class="col-sm-8">
<input type="text" class="form-control"[(ngModel)]="modelDoc.thumbnail">
<input type="file" class="form-control" (change)="onUploadImage($event)">
<div class="msg-detail">ไฟล์ที่อนุญาต:*.jpeg, *.jpg, *.png</div>
</div>
</div>
......@@ -136,7 +164,7 @@
<div class="modal-footer ">
<button type="submit" class="btn btn-info" (click)="onSumit()" [disabled]="!modelDoc.tname||!modelDoc.ename">บันทึก</button>
<button type="submit" class="btn btn-info" (click)="onSumit()" [disabled]="!modelDoc.thName||!modelDoc.engName">บันทึก</button>
<button type="button" class="btn btn-danger" (click)="closeBtnClick()">ปิด</button>
</div>
</div>
......
src/app/apps/list-doc/list-doc.component.ts
......@@ -4,7 +4,9 @@ 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';
import { UploadService } from 'src/app/service/upload.service';
declare var require: any
const FileSaver = require('file-saver');
@Component({
selector: 'app-list-doc',
templateUrl: './list-doc.component.html',
......@@ -17,24 +19,56 @@ export class ListDocComponent implements OnInit {
modelDoc:DocumentModel = new DocumentModel({});
checkEdit:boolean = false
search:string = ''
constructor(private modalService: NgbModal,private documentService:DocumentService) {
constructor(private modalService: NgbModal,private documentService:DocumentService, private uploadService:UploadService) {
}
onSelectFile(event:any) {
async onUploadImage(event:any){
try{
if (event.target.files.length > 0) {
let fileData = event.target.files[0];
const formData = new FormData();
formData.append('file', fileData);
const allowedTypes = ['image/png', 'image/jpeg', 'image/jpg'];
if (!allowedTypes.includes(fileData.type)) {
this.openAlertModal('อัพโหลดได้เฉพาะไฟล์ *.jpeg, *.jpg, *.png เท่านั้น')
} else {
const data = await this.uploadService.uploadImage(formData).toPromise();
if(data){
this.modelDoc.thumbnail = data.body.fileId
}
}
}
} catch (error) {
console.error('Error loading data:', error);
}
}
onSelectFile(event:any,lang:string) {
if (event.target.files && event.target.files[0]) {
let reader = new FileReader();
const reader = new FileReader();
const file: File = event.target.files[0];
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];
const allowedTypes = ['application/vnd.openxmlformats-officedocument.wordprocessingml.document'];
if (!allowedTypes.includes(file.type)) {
this.openAlertModal('อัพโหลดได้เฉพาะไฟล์ *.doc เท่านั้น')
} else {
let base64 = event.target!.result as string
if(lang == 'th'){
this.modelDoc.thDocObj = base64.split(',')[1];
}else {
this.modelDoc.engDocObj = base64.split(',')[1];
}
}
}
}
}
}
async downloadFile(logId:string){
async downloadFile(logId:string,lang:string){
try {
const data = await this.documentService.downloadFile(logId).toPromise();
const data = await this.documentService.downloadFile(logId,lang).toPromise();
if(data){
FileSaver.saveAs(new Blob([data]), "file_download.doc");
}
} catch (error) {
console.error('Error loading data:', error);
}
......@@ -66,9 +100,9 @@ export class ListDocComponent implements OnInit {
})
modalRef.componentInstance.message = message ? message : ""
modalRef.result.then(result => {
this.modalService.dismissAll()
// this.modalService.dismissAll()
}, reason => {
this.modalService.dismissAll()
// this.modalService.dismissAll()
})
}
......@@ -82,6 +116,7 @@ export class ListDocComponent implements OnInit {
console.log(this.modelDoc);
this.documentService.createDoc(this.modelDoc).subscribe(result => {
if (result) {
this.modalService.dismissAll()
this.openAlertModal('อัพเดทข้อมูลสำเร็จ')
this.getListDoc();
} else {
......@@ -101,6 +136,7 @@ export class ListDocComponent implements OnInit {
modalRef.result.then(result => {
this.documentService.createDoc(this.modelDoc).subscribe(result => {
if (result) {
this.modalService.dismissAll()
this.openAlertModal('บันทึกข้อมูลสำเร็จ')
this.getListDoc();
} else {
......@@ -160,7 +196,7 @@ export class ListDocComponent implements OnInit {
async getListDoc(){
try {
const data = await this.documentService.getListDoc().toPromise();
this.listDoc = data
this.listDoc = data.map(x => new DocumentModel(x))
} catch (error) {
console.error('Error loading data:', error);
}
......@@ -176,7 +212,8 @@ export class ListDocComponent implements OnInit {
closeBtnClick() {
this.modalService.dismissAll();
this.ngOnInit();
}
openLink(url:string){
window.open(url, "_blank");
}
}
src/app/apps/list-excell/list-excell.component.html
......@@ -15,22 +15,40 @@
<!-- <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" class="text-center">ลิงค์</th>
<th scope="col" class="text-center">ไฟล์</th>
<th scope="col" class="text-center">สถานะ</th>
<th scope="col"></th>
</tr>
</thead>
<tbody>
<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><img width="100" class="border p-1" src="{{data.getImage()}}"></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 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">
<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>
</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>
</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>
</span>
</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>
......@@ -72,27 +90,27 @@
<div class="modal-body">
<div class="form-group row">
<label for="nameth" 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" [(ngModel)]="modelExcel.thName">
</div>
</div>
<div class="form-group row">
<label for="nameeng" 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" [(ngModel)]="modelExcel.engName">
</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" [(ngModel)]="modelExcel.thDesc"></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" [(ngModel)]="modelExcel.engDesc"></textarea>
</div>
......@@ -105,17 +123,20 @@
</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 class="msg-detail">ไฟล์ที่อนุญาต:*.xlsx</div>
</div>
</div>
<div class="form-group row">
<label for="name" class="col-sm-4 col-form-label">Link รูปภาพตัวอย่างรายงาน</label>
<label for="name" class="col-sm-4 col-form-label">รูปภาพตัวอย่าง</label>
<div class="col-sm-8">
<input type="text" class="form-control"[(ngModel)]="modelExcel.thumbnail">
<input type="file" class="form-control" (change)="onUploadImage($event)">
<div class="msg-detail">ไฟล์ที่อนุญาต:*.jpeg, *.jpg, *.png</div>
</div>
</div>
......@@ -136,7 +157,7 @@
<div class="modal-footer ">
<button type="submit" class="btn btn-info" (click)="onSumit()" [disabled]="!modelExcel.tname||!modelExcel.ename">บันทึก</button>
<button type="submit" class="btn btn-info" (click)="onSumit()" [disabled]="!modelExcel.thName||!modelExcel.engName">บันทึก</button>
<button type="button" class="btn btn-danger" (click)="closeBtnClick()">ปิด</button>
</div>
</div>
......
src/app/apps/list-excell/list-excell.component.spec.ts deleted 100644 → 0
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { ListExcelComponent } from './list-excell.component';
describe('ListExcelComponent', () => {
let component: ListExcelComponent;
let fixture: ComponentFixture<ListExcelComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ ListExcelComponent ]
})
.compileComponents();
});
beforeEach(() => {
fixture = TestBed.createComponent(ListExcelComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
it('should create', () => {
expect(component).toBeTruthy();
});
});
src/app/apps/list-excell/list-excell.component.ts
......@@ -4,7 +4,9 @@ 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';
import { UploadService } from 'src/app/service/upload.service';
declare var require: any
const FileSaver = require('file-saver');
@Component({
selector: 'app-list-excel',
templateUrl: './list-excell.component.html',
......@@ -17,28 +19,60 @@ export class ListExcelComponent implements OnInit {
modelExcel:ExcelModel = new ExcelModel({});
checkEdit:boolean = false
search:string = ''
constructor(private modalService: NgbModal,private excelService:ExcelService) {
constructor(private modalService: NgbModal,private excelService:ExcelService,private uploadService:UploadService) {
}
async onUploadImage(event:any){
try{
if (event.target.files.length > 0) {
let fileData = event.target.files[0];
const formData = new FormData();
formData.append('file', fileData);
const allowedTypes = ['image/png', 'image/jpeg', 'image/jpg'];
if (!allowedTypes.includes(fileData.type)) {
this.openAlertModal('อัพโหลดได้เฉพาะไฟล์ *.jpeg, *.jpg, *.png เท่านั้น')
} else {
const data = await this.uploadService.uploadImage(formData).toPromise();
if(data){
this.modelExcel.thumbnail = data.body.fileId
}
}
}
} catch (error) {
console.error('Error loading data:', error);
}
}
onSelectFile(event:any) {
if (event.target.files && event.target.files[0]) {
let reader = new FileReader();
const reader = new FileReader();
const file: File = event.target.files[0];
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];
const allowedTypes = ['application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'];
if (!allowedTypes.includes(file.type)) {
this.openAlertModal('อัพโหลดได้เฉพาะไฟล์ *.xlsx เท่านั้น')
} else {
let base64 = event.target!.result as string
this.modelExcel.excelObj = base64.split(',')[1];
}
}
}
}
}
async downloadFile(logId:string){
async downloadFile(logId:string){
try {
const data = await this.excelService.downloadFile(logId).toPromise();
if(data){
FileSaver.saveAs(new Blob([data]), "file_download.xlsx");
}
} catch (error) {
console.error('Error loading data:', error);
}
}
deleteFile(item:ExcelModel){
const modalRef = this.modalService.open(ConfirmModalComponent, {
centered: true,
......@@ -66,9 +100,9 @@ export class ListExcelComponent implements OnInit {
})
modalRef.componentInstance.message = message ? message : ""
modalRef.result.then(result => {
this.modalService.dismissAll()
// this.modalService.dismissAll()
}, reason => {
this.modalService.dismissAll()
// this.modalService.dismissAll()
})
}
......@@ -82,6 +116,7 @@ export class ListExcelComponent implements OnInit {
console.log(this.modelExcel);
this.excelService.createExcel(this.modelExcel).subscribe(result => {
if (result) {
this.modalService.dismissAll()
this.openAlertModal('อัพเดทข้อมูลสำเร็จ')
this.getListExcel();
} else {
......@@ -101,6 +136,7 @@ export class ListExcelComponent implements OnInit {
modalRef.result.then(result => {
this.excelService.createExcel(this.modelExcel).subscribe(result => {
if (result) {
this.modalService.dismissAll()
this.openAlertModal('บันทึกข้อมูลสำเร็จ')
this.getListExcel();
} else {
......@@ -148,6 +184,9 @@ export class ListExcelComponent implements OnInit {
}
}
openLink(url:string){
window.open(url, "_blank");
}
getStatus(status:string){
if(status == '0'){
return 'รออนุมัติ'
......@@ -160,7 +199,7 @@ export class ListExcelComponent implements OnInit {
async getListExcel(){
try {
const data = await this.excelService.getListExcel().toPromise();
this.listExcel = data
this.listExcel = data.map(x => new ExcelModel(x))
} catch (error) {
console.error('Error loading data:', error);
}
......@@ -176,7 +215,6 @@ export class ListExcelComponent implements OnInit {
closeBtnClick() {
this.modalService.dismissAll();
this.ngOnInit();
}
}
src/app/apps/portal-category-list/portal-category-list.component.ts
......@@ -52,11 +52,11 @@ export class PortalCategoryListComponent implements OnInit {
openView(id:string){
if(id =='1'){
this.routes.navigate(['apps/list-excel']);
this.routes.navigate(['apps/view-list-excel']);
}else if(id =='2'){
this.routes.navigate(['apps/list-doc']);
this.routes.navigate(['apps/view-list-doc']);
}else if(id =='3'){
this.routes.navigate(['apps/list-course']);
this.routes.navigate(['apps/view-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">รายการเอกสาร</h4>
<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>
......
src/app/apps/view-list-course/view-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" >
</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>
</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>
</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 → src/app/apps/view-list-course/view-list-course.component.spec.ts
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { ApproveCourseComponent } from './approve-course.component';
import { ViewListCourseComponent } from './view-list-course.component';
describe('ApproveCourseComponent', () => {
let component: ApproveCourseComponent;
let fixture: ComponentFixture<ApproveCourseComponent>;
describe('ViewListCourseComponent', () => {
let component: ViewListCourseComponent;
let fixture: ComponentFixture<ViewListCourseComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ ApproveCourseComponent ]
declarations: [ ViewListCourseComponent ]
})
.compileComponents();
});
beforeEach(() => {
fixture = TestBed.createComponent(ApproveCourseComponent);
fixture = TestBed.createComponent(ViewListCourseComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
......
src/app/apps/view-list-course/view-list-course.component.ts 0 → 100644
import { Component, OnInit } from '@angular/core';
import { AlertModalComponent } from '../alert-modal/alert-modal.component';
import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
import { CourseService } from 'src/app/service/course.service';
import { CourseModel } from 'src/app/model/course.model';
@Component({
selector: 'app-view-list-course',
templateUrl: './view-list-course.component.html',
styleUrls: ['./view-list-course.component.scss']
})
export class ViewListCourseComponent 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);
}
}
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/view-list-doc/view-list-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> -->
</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> -->
</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 → src/app/apps/view-list-doc/view-list-doc.component.spec.ts
import { ComponentFixture, TestBed } from '@angular/core/testing';
import { ApproveDocComponent } from './approve-doc.component';
import { ViewListDocComponent } from './view-list-doc.component';
describe('ApproveDocComponent', () => {
let component: ApproveDocComponent;
let fixture: ComponentFixture<ApproveDocComponent>;
describe('ViewListDocComponent', () => {
let component: ViewListDocComponent;
let fixture: ComponentFixture<ViewListDocComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [ ApproveDocComponent ]
declarations: [ ViewListDocComponent ]
})
.compileComponents();
});
beforeEach(() => {
fixture = TestBed.createComponent(ApproveDocComponent);
fixture = TestBed.createComponent(ViewListDocComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
......
src/app/apps/view-list-doc/view-list-doc.component.ts 0 → 100644
import { Component, OnInit } from '@angular/core';
import { AlertModalComponent } from '../alert-modal/alert-modal.component';
import { ConfirmModalComponent } from '../confirm-modal/confirm-modal.component';
import { DocumentModel } from 'src/app/model/document.model';
import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
import { DocumentService } from 'src/app/service/document.service';
@Component({
selector: 'app-view-list-doc',
templateUrl: './view-list-doc.component.html',
styleUrls: ['./view-list-doc.component.scss']
})
export class ViewListDocComponent 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);
}
}
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/view-list-excel/view-list-excel.component.html 0 → 100644
<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)]="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" class="text-center">ลิงค์</th>
<th scope="col" class="text-center">ไฟล์</th>
<th scope="col" class="text-center">จำนวนดาวน์โหลด</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.getImage()}}"></td>
<!-- <td >{{data.id}}</td> -->
<td>{{ data.thName }}</td>
<td>{{ data.thDesc }}</td>
<td class="text-center"><i class="fas fa-link pointer" (click)="openLink(data.link1)"></i></td>
<td class="text-center"> <i class="fas fa-download pointer" (click)="downloadFile(data.excelId)"></i></td>
<td class="text-center">{{data.dwTime}} ครั้ง</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]="listExcel.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/view-list-excel/view-list-excel.component.ts 0 → 100644
import { Component, OnInit } from '@angular/core';
import { ConfirmModalComponent } from '../confirm-modal/confirm-modal.component';
import { NgbModal } from '@ng-bootstrap/ng-bootstrap';
import { ExcelService } from 'src/app/service/excel.service';
import { AlertModalComponent } from '../alert-modal/alert-modal.component';
import { ExcelContentModel } from 'src/app/model/excel-content.model';
declare var require: any
const FileSaver = require('file-saver');
@Component({
selector: 'app-view-list-excel',
templateUrl: './view-list-excel.component.html',
styleUrls: ['./view-list-excel.component.scss']
})
export class ViewListExcelComponent implements OnInit {
page = 1;
pageSize = 10;
listExcel:ExcelContentModel[]=[]
search:string = ''
constructor(private modalService: NgbModal,private excelService:ExcelService) {
}
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){
if(status == '0'){
return 'รออนุมัติ'
} else if(status == '1'){
return 'เปิดใช้งาน'
} else if(status == '2'){
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 this.excelService.getListExcelContent().toPromise();
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()
})
}
}
src/app/model/course.model.ts
import { environment } from "src/environments/environment"
export interface CourseModel {
logId: string
objective: string
......@@ -61,4 +63,11 @@ export class CourseModel implements CourseModel {
this.courseTrainer = data.courseTrainer?data.courseTrainer:''
this.courseTrainerDetail = data.courseTrainerDetail?data.courseTrainerDetail:''
}
getImage(){
if(this.thumbnail){
return environment.url+"files/image/"+this.thumbnail
}else{
return 'assets/images/big/auth-bg.jpg'
}
}
}
\ No newline at end of file
src/app/model/document.model.ts
import { environment } from "src/environments/environment"
export interface DocumentModel {
logId: string
thumbnail: string
link1: string
langSupport: string
doclObj: string
thDocObj: string
engDocObj: string
uploadBy: string
remark: string
status: number
......@@ -19,7 +22,8 @@ export class DocumentModel implements DocumentModel {
thumbnail: string
link1: string
langSupport: string
doclObj: string
thDocObj: string
engDocObj: string
uploadBy: string
remark: string
status: number
......@@ -33,7 +37,8 @@ export class DocumentModel implements DocumentModel {
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.thDocObj = data.thDocObj?data.thDocObj:''
this.engDocObj = data.engDocObj?data.engDocObj:''
this.uploadBy = data.uploadBy?data.uploadBy:''
this.remark = data.remark?data.remark:''
this.status = data.status?data.status:0
......@@ -45,4 +50,11 @@ export class DocumentModel implements DocumentModel {
}
getImage(){
if(this.thumbnail){
return environment.url+"files/image/"+this.thumbnail
}else{
return 'assets/images/big/auth-bg.jpg'
}
}
}
\ No newline at end of file
src/app/model/excel-content.model.ts 0 → 100644
import { environment } from "src/environments/environment"
export interface ExcelContentModel { excelId: string
thName: string
engName: string
thDesc: string
engDesc: string
thumbnail: string
link1: string
dbSupport: string
excelObj: any
uploadBy: string
dwTime: number
remark: string
referId: string
approveBy: string
}
export class ExcelContentModel implements ExcelContentModel {
excelId: string
thName: string
engName: string
thDesc: string
engDesc: string
thumbnail: string
link1: string
dbSupport: string
excelObj: any
uploadBy: string
dwTime: number
remark: string
referId: string
approveBy: string
constructor(data: Partial<any>) {
this.excelId = data.excelId?data.excelId:''
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.dwTime = data.dwTime?data.dwTime: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.referId = data.referId?data.referId:''
}
getImage(){
if(this.thumbnail){
return environment.url+"files/image/"+this.thumbnail
}else{
return 'assets/images/big/auth-bg.jpg'
}
}
}
\ No newline at end of file
src/app/model/excel.model.ts
import { environment } from "src/environments/environment"
import { TagModel } from "./tag.mmodel"
export interface ExcelModel {
logId: string
thumbnail: string
......@@ -12,6 +15,7 @@ export interface ExcelModel {
engName: string
thDesc: string
engDesc: string
tags: TagModel[]
}
export class ExcelModel implements ExcelModel {
......@@ -28,6 +32,7 @@ export class ExcelModel implements ExcelModel {
engName: string
thDesc: string
engDesc: string
tags: TagModel[]
constructor(data: Partial<any>) {
this.logId = data.logId?data.logId:''
this.thumbnail = data.thumbnail?data.thumbnail:''
......@@ -42,7 +47,13 @@ export class ExcelModel implements ExcelModel {
this.engName = data.engName?data.engName:''
this.thDesc = data.thDesc?data.thDesc:''
this.engDesc = data.engDesc?data.engDesc:''
this.tags = data.tags?data.tags:[]
}
getImage(){
if(this.thumbnail){
return environment.url+"files/image/"+this.thumbnail
}else{
return 'assets/images/big/auth-bg.jpg'
}
}
}
\ No newline at end of file
src/app/model/tag.mmodel.ts 0 → 100644
export interface TagModel {
display: string
value: string
}
export class TagModel implements TagModel {
display: string
value: string
constructor(data: Partial<any>) {
this.display = data.display?data.display:''
this.value = data.value?data.value:''
}
}
\ No newline at end of file
src/app/service/document.service.ts
......@@ -21,9 +21,12 @@ export class DocumentService {
}
getDocById(logId:string): Observable<DocumentModel> {
return this.http.get<DocumentModel>(this.url + "document-center/upload/"+logId)
}
downloadFile(logId:string,lang:string):Observable<any>{
return this.http.get(this.url + "document-center/files/download/"+logId+'?lang='+lang, { responseType: 'blob' })
}
downloadFile(logId:string){
return this.http.get<DocumentModel>(this.url + "document-center/files/download/"+logId)
downloadFileContent(logId:string):Observable<any>{
return this.http.get(this.url + "document-center/files/download/content/"+logId, { responseType: 'blob' });
}
createDoc(model: DocumentModel): Observable<boolean> {
if (this.createStatus) {
......
src/app/service/excel.service.ts
......@@ -4,6 +4,7 @@ import { HttpClient, HttpHeaders } from '@angular/common/http';
import { Observable, of } from 'rxjs';
import { ExcelModel } from '../model/excel.model';
import { map, tap } from 'rxjs/operators';
import { ExcelContentModel } from '../model/excel-content.model';
@Injectable({
providedIn: 'root'
......@@ -20,12 +21,19 @@ export class ExcelService {
return this.http.get<ExcelModel[]>(this.url + "excel-center/upload/lists")
}
}
getListExcelContent(status?: string): Observable<ExcelContentModel[]> {
return this.http.get<ExcelContentModel[]>(this.url + "excel-center/content/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)
downloadFile(logId:string):Observable<any>{
return this.http.get(this.url + "excel-center/files/download/"+logId, { responseType: 'blob' })
}
downloadFileContent(logId:string):Observable<any>{
return this.http.get(this.url + "excel-center/files/download/content/"+logId, { responseType: 'blob' });
}
createExcel(model: ExcelModel): Observable<boolean> {
if (this.createStatus) {
this.createStatus = false
......
src/app/service/upload.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 UploadService {
url = environment.url
createStatus: boolean = true
constructor(private http: HttpClient) { }
uploadImage(file: any): Observable<any> {
return this.http.post<any>(this.url + 'files/upload/image', file, { observe: 'response' })
}
}
src/app/shared/vertical-sidebar/vertical-menu-items.ts
......@@ -3,7 +3,7 @@ import { RouteInfo } from "./vertical-sidebar.metadata";
export const ROUTES: RouteInfo[] = [
{
path: '/apps/portal-create-category',
path: '/apps/portal-category-list',
title: 'รายการเอกสาร',
icon: 'mdi mdi-adjust',
class: '',
......@@ -13,6 +13,16 @@ export const ROUTES: RouteInfo[] = [
submenu: []
},
{
path: '/apps/portal-create-category',
title: 'รายการอัพโหลดเอกสาร',
icon: 'mdi mdi-adjust',
class: '',
label: "",
labelClass: "",
extralink: false,
submenu: []
},
{
path: '/apps/import-template',
title: 'นำเข้า Template',
icon: 'mdi mdi-adjust',
......@@ -51,16 +61,16 @@ export const ROUTES: RouteInfo[] = [
extralink: false,
submenu: []
},
{
path: '/apps/portal-category-list',
title: 'รายการเอกสาร',
icon: '',
class: '',
label: "",
labelClass: "",
extralink: false,
submenu: []
},
// {
// path: '/apps/portal-category-list',
// title: 'รายการเอกสาร',
// icon: '',
// class: '',
// label: "",
// labelClass: "",
// extralink: false,
// submenu: []
// },
]
},
......
src/styles.scss
......@@ -5,4 +5,72 @@
@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
}
.msg-detail{
width: 100%;
margin-top: 0.25rem;
font-size: 0.875em;
color: #f62d51;
}
.myhrcolor-1 .tooltip-inner {
background-color: #fff;
color: #2962ff;
font-weight: 400;
border-style: solid;
border-color: #2962ff;
border-width: 1px;
}
.myhrcolor-1 .arrow::before {
border-top-color: #2962ff;
}
.myhrcolor-2 .tooltip-inner {
background-color: #fff;
color: #36bea6;
font-weight: 400;
border-style: solid;
border-color: #36bea6;
border-width: 1px;
}
.myhrcolor-2 .arrow::before {
border-top-color: #36bea6;
}
.myhrcolor-3 .tooltip-inner {
background-color: #fff;
color: #f62d51;
font-weight: 400;
border-style: solid;
border-color: #f62d51;
border-width: 1px;
}
.myhrcolor-3 .arrow::before {
border-top-color: #f62d51;
}
.myhrcolor-4 .tooltip-inner {
background-color: #fff;
color: #ffbc34;
font-weight: 400;
border-style: solid;
border-color: #ffbc34;
border-width: 1px;
}
.myhrcolor-4 .arrow::before {
border-top-color: #ffbc34;
}
.myhrcolor-date .tooltip-inner {
background-color: #fff;
color: #a1aab2;
font-weight: 400;
border-style: solid;
border-color: #a1aab2;
border-width: 1px;
}
.myhrcolor-date .arrow::before {
border-top-color: #a1aab2;
}
.pointer{
cursor: pointer;
}
.pointer:hover{
color: #2962ff;
}
\ 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