Fix Datasource (#224)

Author: ajivanyandev

src/app/pages/tasks/tasks.component.html

@@ -14,58 +14,43 @@ <h2>Tasks</h2>
   <dxo-data-grid-filter-row [visible]="true"></dxo-data-grid-filter-row>
 
   <dxi-data-grid-column
-    dataField="Task_ID"
+    dataField="id"
     [width]="90"
-    [hidingPriority]="2">
+    [hidingPriority]="1">
   </dxi-data-grid-column>
   <dxi-data-grid-column
-    dataField="Task_Subject"
+    dataField="text"
     [width]="190"
     caption="Subject"
-    [hidingPriority]="8">
-  </dxi-data-grid-column>
-  <dxi-data-grid-column
-    dataField="Task_Status"
-    caption="Status"
     [hidingPriority]="6">
   </dxi-data-grid-column>
   <dxi-data-grid-column
-    dataField="Task_Priority"
-    caption="Priority"
-    [hidingPriority]="5">
-    <dxo-data-grid-lookup
-      [dataSource]="priority"
-      valueExpr="value"
-      displayExpr="name">
-    </dxo-data-grid-lookup>
+    dataField="status"
+    caption="Status"
+    [hidingPriority]="4">
   </dxi-data-grid-column>
   <dxi-data-grid-column
-    dataField="ResponsibleEmployee.Employee_Full_Name"
+    dataField="owner"
     caption="Assigned To"
     [allowSorting]="false"
-    [hidingPriority]="7">
+    [hidingPriority]="5">
   </dxi-data-grid-column>
   <dxi-data-grid-column
-    dataField="Task_Start_Date"
+    dataField="startDate"
     caption="Start Date"
     dataType="date"
-    [hidingPriority]="3">
+    [hidingPriority]="2">
   </dxi-data-grid-column>
   <dxi-data-grid-column
-    dataField="Task_Due_Date"
+    dataField="dueDate"
     caption="Due Date"
     dataType="date"
-    [hidingPriority]="4">
+    [hidingPriority]="3">
   </dxi-data-grid-column>
   <dxi-data-grid-column
-    dataField="Task_Priority"
+    dataField="priority"
     caption="Priority"
     name="Priority"
-    [hidingPriority]="1">
-  </dxi-data-grid-column>
-  <dxi-data-grid-column
-    dataField="Task_Completion"
-    caption="Completion"
     [hidingPriority]="0">
   </dxi-data-grid-column>
-</dx-data-grid>
+</dx-data-grid>

src/app/pages/tasks/tasks.component.ts

@@ -1,5 +1,6 @@
 import { Component } from '@angular/core';
 import { DxDataGridModule } from 'devextreme-angular/ui/data-grid';
+import { CustomStore } from 'devextreme-angular/common/data';
 
 @Component({
   templateUrl: 'tasks.component.html',
@@ -10,33 +11,25 @@ import { DxDataGridModule } from 'devextreme-angular/ui/data-grid';
 
 export class TasksComponent {
   dataSource: any;
-  priority: any[];
 
   constructor() {
     this.dataSource = {
-      store: {
-        version: 2,
-        type: 'odata',
-        key: 'Task_ID',
-        url: 'https://js.devexpress.com/Demos/DevAV/odata/Tasks'
-      },
-      expand: 'ResponsibleEmployee',
-      select: [
-        'Task_ID',
-        'Task_Subject',
-        'Task_Start_Date',
-        'Task_Due_Date',
-        'Task_Status',
-        'Task_Priority',
-        'Task_Completion',
-        'ResponsibleEmployee/Employee_Full_Name'
-      ]
+      store: new CustomStore({
+        key: 'id',
+        async load() {
+          try {
+            const response = await fetch(`https://js.devexpress.com/Demos/RwaService/api/Employees/AllTasks`);
+
+            const result = await response.json();
+
+            return {
+              data: result,
+            };
+          } catch (err) {
+            throw new Error('Data Loading Error');
+          }
+        },
+      }),
     };
-    this.priority = [
-      { name: 'High', value: 4 },
-      { name: 'Urgent', value: 3 },
-      { name: 'Normal', value: 2 },
-      { name: 'Low', value: 1 }
-    ];
   }
 }