การประเมินจัดการประสิทธิภาพ>ทะเบียนกำหนดชื่อ

src/app/components/performance-management-evaluation/name-registration-perfomance/assessment-topics/assessment-topics.component.ts

@@ -76,6 +76,7 @@ export class AssessmentTopicsComponent {
   selectPmstype(data?: PmstypeModel) {
     this.pmstopic.select.pmsType = new MyPmstypeModel(data)
   }
+  
   getPmstopicList() {
     this.pmstopic.loading = true
     this.pmstopicService.getList().subscribe({

src/app/components/performance-management-evaluation/name-registration-perfomance/assessment-types/assessment-types.component.ts

@@ -3,20 +3,39 @@ import { ToastrService } from 'ngx-toastr';
 import { MyPmstypeModel, PmstypeModel } from 'src/app/shared/model/pmstype.model';
 import { FileService } from 'src/app/shared/services/file.service';
 import { PmstypeService } from 'src/app/shared/services/pmstype.service';
+import { ColumnModel } from '@syncfusion/ej2-grids';
 @Component({
   selector: 'app-assessment-types',
   templateUrl: './assessment-types.component.html',
   styleUrls: ['./assessment-types.component.scss']
 })
 export class AssessmentTypesComponent {
-  currentPage = 1
-  page = Array.from({ length: 1 }, (_, i) => i + 1);
+
+  pmstype: { loading: boolean, select: PmstypeModel, dataList: PmstypeModel[] } = { loading: false, select: new MyPmstypeModel(), dataList: [] }
+  modalStatus: "add" | "edit" | 'delete' = "add"
+  columns: ColumnModel[] = [{
+    field: "pmsTypeId",
+    headerText: "รหัส",
+    type: "string",
+    isPrimaryKey: true,
+  },
+  {
+    field: "tdesc",
+    headerText: "ชื่อประเภท",
+    type: "string"
+  },
+  {
+    field: "shortName",
+    headerText: "ชื่อย่อ",
+    type: "string"
+  }]
+  searchSettings = {
+    fields: ['pmsTypeId', 'tdesc', 'shortName'],
+    operator: 'contains',
+    ignoreCase: false
+  };
   search = ""
-  numDataListChecked = 0
-  isDataListChecked = false
-  isDataListCheckedAll = false
-  pmstype: { loading: boolean, select: PmstypeModel, dataList: { check: boolean, data: PmstypeModel }[] } = { loading: false, select: new MyPmstypeModel(), dataList: [] }
-  modalStatus: "add" | "edit" | 'delete' | 'deleteGroup' = "add"
+  selectedItems: { key: string, count: number, data: Map<string, boolean> } = { key: '', count: 0, data: new Map<string, boolean>() };
 
   selectedFile: File | null = null;
   selectedFileName: string = 'กรุณาเลือกไฟล์';
@@ -33,13 +52,16 @@ export class AssessmentTypesComponent {
 
   getPmstypeList() {
     this.pmstype.loading = true
+    this.selectedItems.data.clear()
     this.pmstypeService.getList().subscribe({
       next: response => {
-        this.pmstype.dataList = response.map(x => ({ check: false, data: new MyPmstypeModel(x) }))
-        this.isDataListCheckedAll = false
-        this.dataListCheckAll()
+        this.pmstype.dataList = response.map(x => {
+          this.selectedItems.data.set(x.pmsTypeId, false)
+          return new MyPmstypeModel(x)
+        })
+        this.selectedItems.key = 'pmsTypeId'
+        this.selectedItems.count = 0
         this.pmstype.loading = false
-        this.searchChange()
         this.cdr.detectChanges()
       }, error: error => {
         this.pmstype.loading = false
@@ -47,27 +69,24 @@ export class AssessmentTypesComponent {
       }
     })
   }
-  pmstypeListFilter() {
-    return this.pmstype.dataList.filter(x => {
-      const data = x.data
-      const match = data.pmsTypeId.toLowerCase().includes(this.search.toLowerCase()) ||
-        data.tdesc.toLowerCase().includes(this.search.toLowerCase()) ||
-        data.shortName.toLowerCase().includes(this.search.toLowerCase())
-      return match
-    })
-  }
+
+ 
   selectPmstype(data?: PmstypeModel) {
-    this.pmstype.select = new MyPmstypeModel(data)
+    if (data) {
+      this.pmstype.select = new MyPmstypeModel(data)
+    } else if (this.modalStatus == 'add') {
+      this.pmstype.select = new MyPmstypeModel()
+    } else if (this.modalStatus == 'edit') {
+      this.pmstype.select = new MyPmstypeModel({ pmsTypeId: this.pmstype.select.pmsTypeId })
+    }
   }
+
   updatePmstype(typeApi: 'post' | 'delete') {
     let body: PmstypeModel | PmstypeModel[]
     switch (this.modalStatus) {
       case ('delete'): {
-        body = [new MyPmstypeModel(this.pmstype.select)]
-        break;
-      }
-      case ('deleteGroup'): {
-        body = this.pmstype.dataList.filter(x => x.check).map(x => new MyPmstypeModel(x.data))
+        const selectedKeys = Array.from(this.selectedItems.data.keys());
+        body = this.pmstype.dataList.filter(x => selectedKeys.includes(x.pmsTypeId) && this.selectedItems.data.get(x.pmsTypeId)).map(x => new MyPmstypeModel(x))
         break;
       }
       default: {
@@ -80,7 +99,6 @@ export class AssessmentTypesComponent {
         if (response.success) {
           this.showAlert(response.message, 'success')
           this.getPmstypeList()
-          this.searchChange()
         } else {
           this.showAlert(response.message, 'error')
           this.pmstype.loading = false
@@ -152,25 +170,6 @@ export class AssessmentTypesComponent {
 
   }
 
-
-  dataListCheckAll() {
-    const selectAll = this.isDataListCheckedAll;
-    this.pmstype.dataList.filter(x => {
-      const data = x.data
-      const match = data.pmsTypeId.toLowerCase().includes(this.search.toLowerCase()) ||
-        data.tdesc.toLowerCase().includes(this.search.toLowerCase()) ||
-        data.shortName.toLowerCase().includes(this.search.toLowerCase())
-      return match
-    }).forEach(x => x.check = selectAll);
-    this.dataListCheck();
-  }
-
-  dataListCheck() {
-    const dataCheck = this.pmstypeListFilter();
-    this.isDataListCheckedAll = dataCheck.length ? dataCheck.every(x => x.check) : false;
-    this.numDataListChecked = this.pmstype.dataList.filter(x => x.check).length;
-    this.isDataListChecked = Boolean(this.numDataListChecked)
-  }
   clearPmstype(modalStatus: string) {
     if (modalStatus == 'add') {
       this.selectPmstype()
@@ -178,12 +177,20 @@ export class AssessmentTypesComponent {
       this.selectPmstype(new MyPmstypeModel({ pmsTypeId: this.pmstype.select.pmsTypeId }))
     }
   }
-  searchChange() {
-    this.currentPage = 1
-    this.page = Array.from({ length: Math.ceil(this.pmstypeListFilter().length / 10) }, (_, i) => i + 1);
-    this.dataListCheck()
+  checkPrimary() {
+    return this.pmstype.dataList.find(x => x.pmsTypeId == this.pmstype.select.pmsTypeId)
+  }
+  numSelectItem() {
+    const selectedKeys = Array.from(this.selectedItems.data.keys());
+    const num = this.pmstype.dataList.filter(x => selectedKeys.includes(x.pmsTypeId) && this.selectedItems.data.get(x.pmsTypeId)).length
+    return num
   }
 
+  onSelectItemChange(arg: any) {
+    this.selectedItems = arg
+  }
 
 }
 
+
+