Skip to content

M
mySkill-x
Commit 0b1de934 by Nattana Chaiyamat
Options

การจัดการตัวชี้วัดเเละหลักสูตร

parent 458c215e
Showing with 28 additions and 175 deletions
src/app/components/competency-assessment/competency-management/indicators-and-curriculum/edit-group-indicators/edit-group-indicators.component.html
...@@ -101,7 +101,7 @@ ...@@ -101,7 +101,7 @@
</tbody> </tbody>
<tbody *ngIf="dataListFilter().length"> <tbody *ngIf="dataListFilter().length">
<tr <tr
*ngFor="let data of dataListFilter() | slice:((currentPage-1) * 10) : (((currentPage-1) * 10) + 10);let i = index"> *ngFor="let data of dataListFilter() | slice:((currentPage-1) * pageSize) : (((currentPage-1) * pageSize) + pageSize);let i = index">
<td class="text-center align-center"> <td class="text-center align-center">
{{ data.code }} {{ data.code }}
</td> </td>
...@@ -149,7 +149,7 @@ ...@@ -149,7 +149,7 @@
class="ti-btn rounded-sm ti-btn-secondary text-center m-0 hs-tooltip ti-main-tooltip flex" class="ti-btn rounded-sm ti-btn-secondary text-center m-0 hs-tooltip ti-main-tooltip flex"
[ngClass]="{'cursor-default [--trigger:click]': m < 3, [ngClass]="{'cursor-default [--trigger:click]': m < 3,
' cursor-pointer [--trigger:hover]': m == 3}" style="height: 15px; width: 45px" ' cursor-pointer [--trigger:hover]': m == 3}" style="height: 15px; width: 45px"
(click)="(m < 3 ? null :dataSelectIndex=i);(m < 3 ? null :assessmentToolsSelectIndex=[l,m])" (click)="searchModal = '';pageSizeModal =10; currentPageModal = 1;assessmentToolsModalSearchChange();(m < 3 ? null :dataSelectIndex=i);(m < 3 ? null :assessmentToolsSelectIndex=[l,m])"
[attr.data-hs-overlay]="m < 3 ? null : '#assessment-tools-modal'"> [attr.data-hs-overlay]="m < 3 ? null : '#assessment-tools-modal'">
<ng-container [ngSwitch]="m < 3"> <ng-container [ngSwitch]="m < 3">
<ng-container *ngSwitchCase="true"> <ng-container *ngSwitchCase="true">
...@@ -179,14 +179,14 @@ ...@@ -179,14 +179,14 @@
<button type="button" class="flex text-start items-center cursor-default" <button type="button" class="flex text-start items-center cursor-default"
*ngIf="!seeTab"> *ngIf="!seeTab">
<i class="ti ti-circle-plus text-green-500 cursor-pointer" <i class="ti ti-circle-plus text-green-500 cursor-pointer"
(click)="dataSelectIndex=i;dataSelect=data;assessmentToolsSelectIndex=[l,data.assessmentTools.length]" (click)="searchModal = '';pageSizeModal =10; currentPageModal = 1;assessmentToolsModalSearchChange();dataSelectIndex=i;dataSelect=data;assessmentToolsSelectIndex=[l,data.assessmentTools.length]"
data-hs-overlay="#assessment-tools-modal"></i> data-hs-overlay="#assessment-tools-modal"></i>
</button> </button>
</span> </span>
<button *ngIf="!data.assessmentTools.length&&!seeTab" type="button" <button *ngIf="!data.assessmentTools.length&&!seeTab" type="button"
class="flex text-start items-center cursor-default"> class="flex text-start items-center cursor-default">
<i class="ti ti-circle-plus text-green-500 cursor-pointer" <i class="ti ti-circle-plus text-green-500 cursor-pointer"
(click)="dataSelectIndex=i;dataSelect=data;assessmentToolsSelectIndex=[0,data.assessmentTools.length]" (click)="searchModal = '';pageSizeModal =10; currentPageModal = 1;assessmentToolsModalSearchChange();dataSelectIndex=i;dataSelect=data;assessmentToolsSelectIndex=[0,data.assessmentTools.length]"
data-hs-overlay="#assessment-tools-modal"></i> data-hs-overlay="#assessment-tools-modal"></i>
</button> </button>
</div> </div>
...@@ -194,7 +194,8 @@ ...@@ -194,7 +194,8 @@
<td class="items-center justify-center"> <td class="items-center justify-center">
<div class="flex items-center w-full space-x-2"> <div class="flex items-center w-full space-x-2">
<i *ngIf="!seeTab" class="ti ti ti-book cursor-pointer i-gray px-1" style="font-size: 28px;" <i *ngIf="!seeTab" class="ti ti ti-book cursor-pointer i-gray px-1" style="font-size: 28px;"
(click)="dataSelectIndex=i" data-hs-overlay="#curriculum-modal"></i> (click)="searchModal = '';pageSizeModal =10; currentPageModal = 1;curriculumModalSearchChange();dataSelectIndex=i"
data-hs-overlay="#curriculum-modal"></i>
<div class="flex flex-col flex-grow" *ngIf="data.curriculum.length"> <div class="flex flex-col flex-grow" *ngIf="data.curriculum.length">
<div class="grid grid-cols-1 gap-1"> <div class="grid grid-cols-1 gap-1">
<span *ngFor="let item of data.curriculum;let l=index" <span *ngFor="let item of data.curriculum;let l=index"
...@@ -227,50 +228,15 @@ ...@@ -227,50 +228,15 @@
</tbody> </tbody>
</table> </table>
</div> </div>
<nav class="pagination-style-3 overflow-auto my-5" *ngIf="page.length"> <app-pagination [totalItems]="dataListFilter().length" [pageSize]="pageSize" (pageChange)="currentPage = $event"
<ul class="ti-pagination"> (pageSizeChange)="pageSize = $event;currentPage = 1"></app-pagination>
<li>
<a aria-label="anchor" class="page-link !pl-0" href="javascript:void(0);"
(click)="currentPage = (currentPage-1 || 1)">
<i class="ri-arrow-left-s-line align-middle rtl:rotate-180"></i>
</a>
</li>
<li *ngFor="let item of page;let f = first;let l = last">
<ng-container *ngIf="item==3&&currentPage!=1&&currentPage!=2&&currentPage!=3">
<a aria-label="anchor" class="page-link" href="javascript:void(0);"><i class="ri-more-line"></i>
</a>
</ng-container>
<ng-container *ngIf="(f||l)||(item==currentPage-1||item==currentPage||item==currentPage+1)">
<a class="page-link" href="javascript:void(0);" [class.active]="item==currentPage"
(click)="currentPage=item">{{item}}
</a>
</ng-container>
<ng-container
*ngIf="item==page.length-2&&currentPage!=page.length&&currentPage!=page.length-1&&currentPage!=page.length-2">
<a aria-label="anchor" class="page-link" href="javascript:void(0);"><i class="ri-more-line"></i>
</a>
</ng-container>
</li>
<li>
<a aria-label="anchor" class="page-link" href="javascript:void(0);"
(click)="currentPage = (currentPage > page.length-1 ? currentPage: currentPage+1 )">
<i class="ri-arrow-right-s-line align-middle rtl:rotate-180"></i>
</a>
</li>
</ul>
<ul class="nav-tabs mt-3">
<span>Show {{((currentPage-1) * 10)+1}} to {{dataListFilter().length<10 ?dataListFilter().length:
(currentPage==page.length ? ((currentPage * 10) - ((currentPage * 10) - dataListFilter().length) )
:(currentPage * 10) ) }} of {{dataListFilter().length}} items</span>
</ul>
</nav>
</div> </div>
<div id="assessment-tools-modal" class="hs-overlay hidden ti-modal"> <div id="assessment-tools-modal" class="hs-overlay hidden ti-modal">
<div class="hs-overlay-open:mt-7 ti-modal-box mt-0 ease-out lg:!max-w-4xl lg:w-full m-3 lg:!mx-auto"> <div class="hs-overlay-open:mt-7 ti-modal-box mt-0 ease-out lg:!max-w-4xl lg:w-full m-3 lg:!mx-auto !max-w-3/4">
<div class="ti-modal-content"> <div class="ti-modal-content">
<div class="ti-modal-header"> <div class="ti-modal-header">
<h3 class="text-xxl font-bold text-primary"> <h3 class="text-xxl font-bold text-primary">
...@@ -299,12 +265,12 @@ ...@@ -299,12 +265,12 @@
</div> </div>
</div> </div>
</div> </div>
<div class="px-1"> <!-- <div class="px-1">
<button href="javascript:void(0);" class="ti-btn ti-btn-soft-warning h-45px m-0 shadow-md"> <button href="javascript:void(0);" class="ti-btn ti-btn-soft-warning h-45px m-0 shadow-md">
<i class="ti ti-book fs-l"></i> <i class="ti ti-book fs-l"></i>
Help Help
</button> </button>
</div> </div> -->
</div> </div>
</div> </div>
<div class="page px-rem"> <div class="page px-rem">
...@@ -343,7 +309,7 @@ ...@@ -343,7 +309,7 @@
</tbody> </tbody>
<tbody *ngIf="!assessmentToolsLoading&&assessmentToolsListFilter().length"> <tbody *ngIf="!assessmentToolsLoading&&assessmentToolsListFilter().length">
<tr <tr
*ngFor="let item of assessmentToolsListFilter() | slice:((currentPageModal-1) * 10) : (((currentPageModal-1) * 10) + 10);let i = index"> *ngFor="let item of assessmentToolsListFilter() | slice:((currentPageModal-1) * pageSizeModal) : (((currentPageModal-1) * pageSizeModal) + pageSizeModal);let i = index">
<td class="flex justify-center">{{item.code}}</td> <td class="flex justify-center">{{item.code}}</td>
<td>{{item.name}}</td> <td>{{item.name}}</td>
<td>{{item.nameShow}}</td> <td>{{item.nameShow}}</td>
...@@ -363,49 +329,9 @@ ...@@ -363,49 +329,9 @@
</tbody> </tbody>
</table> </table>
</div> </div>
<nav class="pagination-style-3 my-5" *ngIf="pageModal.length"> <app-pagination [totalItems]="assessmentToolsListFilter().length" [pageSize]="pageSizeModal"
<ul class="ti-pagination"> (pageChange)="currentPageModal = $event"
<li> (pageSizeChange)="pageSizeModal = $event;currentPageModal = 1"></app-pagination>
<a aria-label="anchor" class="page-link !pl-0" href="javascript:void(0);"
(click)="currentPageModal = (currentPageModal-1 || 1)">
<i class="ri-arrow-left-s-line align-middle rtl:rotate-180"></i>
</a>
</li>
<li *ngFor="let item of page;let f = first;let l = last">
<ng-container
*ngIf="item==3&&currentPageModal!=1&&currentPageModal!=2&&currentPageModal!=3">
<a aria-label="anchor" class="page-link" href="javascript:void(0);"><i
class="ri-more-line"></i>
</a>
</ng-container>
<ng-container
*ngIf="(f||l)||(item==currentPageModal-1||item==currentPageModal||item==currentPageModal+1)">
<a class="page-link" href="javascript:void(0);"
[class.active]="item==currentPageModal" (click)="currentPageModal=item">{{item}}
</a>
</ng-container>
<ng-container
*ngIf="item==pageModal.length-2&&currentPageModal!=pageModal.length&&currentPageModal!=pageModal.length-1&&currentPageModal!=pageModal.length-2">
<a aria-label="anchor" class="page-link" href="javascript:void(0);"><i
class="ri-more-line"></i>
</a>
</ng-container>
</li>
<li>
<a aria-label="anchor" class="page-link" href="javascript:void(0);"
(click)="currentPageModal = (currentPageModal > pageModal.length-1 ? currentPageModal: currentPageModal+1 )">
<i class="ri-arrow-right-s-line align-middle rtl:rotate-180"></i>
</a>
</li>
</ul>
<ul class="nav-tabs mt-3">
<span>Show {{((currentPageModal-1) * 10)+1}} to {{assessmentToolsListFilter().length<10
?assessmentToolsListFilter().length: (currentPageModal==pageModal.length ?
((currentPageModal * 10) - ((currentPageModal * 10) -
assessmentToolsListFilter().length) ) :(currentPageModal * 10) ) }} of
{{assessmentToolsListFilter().length}} items</span>
</ul>
</nav>
</div> </div>
</div> </div>
</div> </div>
...@@ -414,7 +340,7 @@ ...@@ -414,7 +340,7 @@
<div id="curriculum-modal" class="hs-overlay hidden ti-modal"> <div id="curriculum-modal" class="hs-overlay hidden ti-modal">
<div class="hs-overlay-open:mt-7 ti-modal-box mt-0 ease-out lg:!max-w-4xl lg:w-full m-3 lg:!mx-auto"> <div class="hs-overlay-open:mt-7 ti-modal-box mt-0 ease-out lg:!max-w-4xl lg:w-full m-3 lg:!mx-auto !max-w-3/4">
<div class="ti-modal-content"> <div class="ti-modal-content">
<div class="ti-modal-header"> <div class="ti-modal-header">
<h3 class="text-xxl font-bold text-primary"> <h3 class="text-xxl font-bold text-primary">
...@@ -442,12 +368,12 @@ ...@@ -442,12 +368,12 @@
</div> </div>
</div> </div>
</div> </div>
<div class="px-1"> <!-- <div class="px-1">
<button href="javascript:void(0);" class="ti-btn ti-btn-soft-warning h-45px m-0 shadow-md"> <button href="javascript:void(0);" class="ti-btn ti-btn-soft-warning h-45px m-0 shadow-md">
<i class="ti ti-book fs-l"></i> <i class="ti ti-book fs-l"></i>
Help Help
</button> </button>
</div> </div> -->
</div> </div>
</div> </div>
<div class="page px-rem"> <div class="page px-rem">
...@@ -476,7 +402,7 @@ ...@@ -476,7 +402,7 @@
</tbody> </tbody>
<tbody *ngIf="curriculumListFilter().length"> <tbody *ngIf="curriculumListFilter().length">
<tr <tr
*ngFor="let item of curriculumListFilter() | slice:((currentPageModal-1) * 10) : (((currentPageModal-1) * 10) + 10);let i = index"> *ngFor="let item of curriculumListFilter() | slice:((currentPageModal-1) * pageSizeModal) : (((currentPageModal-1) * pageSizeModal) + pageSizeModal);let i = index">
<td class="flex justify-center">{{item.code}}</td> <td class="flex justify-center">{{item.code}}</td>
<td>{{item.name}}</td> <td>{{item.name}}</td>
<td class="flex justify-center items-center"> <td class="flex justify-center items-center">
...@@ -493,48 +419,9 @@ ...@@ -493,48 +419,9 @@
</tbody> </tbody>
</table> </table>
</div> </div>
<nav class="pagination-style-3 my-5" *ngIf="pageModal.length"> <app-pagination [totalItems]="curriculumListFilter().length" [pageSize]="pageSizeModal"
<ul class="ti-pagination"> (pageChange)="currentPageModal = $event"
<li> (pageSizeChange)="pageSizeModal = $event;currentPageModal = 1"></app-pagination>
<a aria-label="anchor" class="page-link !pl-0" href="javascript:void(0);"
(click)="currentPageModal = (currentPageModal-1 || 1)">
<i class="ri-arrow-left-s-line align-middle rtl:rotate-180"></i>
</a>
</li>
<li *ngFor="let item of page;let f = first;let l = last">
<ng-container
*ngIf="item==3&&currentPageModal!=1&&currentPageModal!=2&&currentPageModal!=3">
<a aria-label="anchor" class="page-link" href="javascript:void(0);"><i
class="ri-more-line"></i>
</a>
</ng-container>
<ng-container
*ngIf="(f||l)||(item==currentPageModal-1||item==currentPageModal||item==currentPageModal+1)">
<a class="page-link" href="javascript:void(0);"
[class.active]="item==currentPageModal" (click)="currentPageModal=item">{{item}}
</a>
</ng-container>
<ng-container
*ngIf="item==pageModal.length-2&&currentPageModal!=pageModal.length&&currentPageModal!=pageModal.length-1&&currentPageModal!=pageModal.length-2">
<a aria-label="anchor" class="page-link" href="javascript:void(0);"><i
class="ri-more-line"></i>
</a>
</ng-container>
</li>
<li>
<a aria-label="anchor" class="page-link" href="javascript:void(0);"
(click)="currentPageModal = (currentPageModal > pageModal.length-1 ? currentPageModal: currentPageModal+1 )">
<i class="ri-arrow-right-s-line align-middle rtl:rotate-180"></i>
</a>
</li>
</ul>
<ul class="nav-tabs mt-3">
<span>Show {{((currentPageModal-1) * 10)+1}} to {{curriculumListFilter().length<10
?curriculumListFilter().length: (currentPageModal==pageModal.length ?
((currentPageModal * 10) - ((currentPageModal * 10) - curriculumListFilter().length)
) :(currentPageModal * 10) ) }} of {{curriculumListFilter().length}} items</span>
</ul>
</nav>
</div> </div>
</div> </div>
</div> </div>
......
src/app/components/competency-assessment/competency-management/indicators-and-curriculum/edit-group-indicators/edit-group-indicators.component.ts
...@@ -38,6 +38,7 @@ export class EditGroupIndicators implements OnInit { ...@@ -38,6 +38,7 @@ export class EditGroupIndicators implements OnInit {
@Output() sendEdit: EventEmitter<boolean> = new EventEmitter<boolean>(); @Output() sendEdit: EventEmitter<boolean> = new EventEmitter<boolean>();
search = "" search = ""
currentPage = 1 currentPage = 1
pageSize = 10
page = Array.from({ length: 1 }, (_, i) => i + 1); page = Array.from({ length: 1 }, (_, i) => i + 1);
dataList: DataModel[] = [] dataList: DataModel[] = []
dataSelect: DataModel = { dataSelect: DataModel = {
...@@ -51,6 +52,7 @@ export class EditGroupIndicators implements OnInit { ...@@ -51,6 +52,7 @@ export class EditGroupIndicators implements OnInit {
dataSelectAssessmentToolsIndex: number = -1 dataSelectAssessmentToolsIndex: number = -1
searchModal = "" searchModal = ""
currentPageModal = 1 currentPageModal = 1
pageSizeModal = 10
pageModal = Array.from({ length: 1 }, (_, i) => i + 1); pageModal = Array.from({ length: 1 }, (_, i) => i + 1);
assessmentToolsLoading = false assessmentToolsLoading = false
assessmentToolsList: AssessmentToolsModal[] = [] assessmentToolsList: AssessmentToolsModal[] = []
...@@ -60,7 +62,6 @@ export class EditGroupIndicators implements OnInit { ...@@ -60,7 +62,6 @@ export class EditGroupIndicators implements OnInit {
curriculumSelectIndex: number = -1 curriculumSelectIndex: number = -1
dataLoading = false dataLoading = false
constructor(private assessmentService: AssessmentService, constructor(private assessmentService: AssessmentService,
private cdr: ChangeDetectorRef, private cdr: ChangeDetectorRef,
private toastr: ToastrService, private toastr: ToastrService,
......
src/app/components/competency-assessment/competency-management/indicators-and-curriculum/indicators-and-curriculum.component.html
...@@ -62,7 +62,7 @@ ...@@ -62,7 +62,7 @@
</tbody> </tbody>
<tbody *ngIf="!dataLoading&&dataListFilter().length"> <tbody *ngIf="!dataLoading&&dataListFilter().length">
<tr <tr
*ngFor="let item of dataListFilter() | slice:((currentPage-1) * 10) : (((currentPage-1) * 10) + 10);let i = index"> *ngFor="let item of dataListFilter() | slice:((currentPage-1) * pageSize) : (((currentPage-1) * pageSize) + pageSize);let i = index">
<td class="text-center"> <td class="text-center">
{{item.code}} {{item.code}}
</td> </td>
...@@ -80,43 +80,8 @@ ...@@ -80,43 +80,8 @@
</tbody> </tbody>
</table> </table>
</div> </div>
<nav class="pagination-style-3 overflow-auto my-5" *ngIf="page.length"> <app-pagination [totalItems]="dataListFilter().length" [pageSize]="pageSize" (pageChange)="currentPage = $event"
<ul class="ti-pagination"> (pageSizeChange)="pageSize = $event;currentPage = 1"></app-pagination>
<li>
<a aria-label="anchor" class="page-link !pl-0" href="javascript:void(0);"
(click)="currentPage = (currentPage-1 || 1)">
<i class="ri-arrow-left-s-line align-middle rtl:rotate-180"></i>
</a>
</li>
<li *ngFor="let item of page;let f = first;let l = last">
<ng-container *ngIf="item==3&&currentPage!=1&&currentPage!=2&&currentPage!=3">
<a aria-label="anchor" class="page-link" href="javascript:void(0);"><i class="ri-more-line"></i>
</a>
</ng-container>
<ng-container *ngIf="(f||l)||(item==currentPage-1||item==currentPage||item==currentPage+1)">
<a class="page-link" href="javascript:void(0);" [class.active]="item==currentPage"
(click)="currentPage=item">{{item}}
</a>
</ng-container>
<ng-container
*ngIf="item==page.length-2&&currentPage!=page.length&&currentPage!=page.length-1&&currentPage!=page.length-2">
<a aria-label="anchor" class="page-link" href="javascript:void(0);"><i class="ri-more-line"></i>
</a>
</ng-container>
</li>
<li>
<a aria-label="anchor" class="page-link" href="javascript:void(0);"
(click)="currentPage = (currentPage > page.length-1 ? currentPage: currentPage+1 )">
<i class="ri-arrow-right-s-line align-middle rtl:rotate-180"></i>
</a>
</li>
</ul>
<ul class="nav-tabs mt-3">
<span>Show {{((currentPage-1) * 10)+1}} to {{dataListFilter().length<10 ?dataListFilter().length:
(currentPage==page.length ? ((currentPage * 10) - ((currentPage * 10) - dataListFilter().length) )
:(currentPage * 10) ) }} of {{dataListFilter().length}} items</span>
</ul>
</nav>
</div> </div>
</ng-container> </ng-container>
......
src/app/components/competency-assessment/competency-management/indicators-and-curriculum/indicators-and-curriculum.component.ts
...@@ -21,7 +21,7 @@ export class IndicatorsAndCurriculumComponent { ...@@ -21,7 +21,7 @@ export class IndicatorsAndCurriculumComponent {
currentPage = 1 currentPage = 1
search = "" search = ""
page = Array.from({ length: 1 }, (_, i) => i + 1); page = Array.from({ length: 1 }, (_, i) => i + 1);
pageSize = 10
dataList: DataModel[] = [] dataList: DataModel[] = []
indicatorsCoursesList: CompetencytopicModel[] = [] indicatorsCoursesList: CompetencytopicModel[] = []
indicatorsCourses: CompetencytopicModel = new MyCompetencytopicModel({}) indicatorsCourses: CompetencytopicModel = new MyCompetencytopicModel({})
......
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