From fb8d693a15338a5d140538a22925cb40378bf7a8 Mon Sep 17 00:00:00 2001
From: KharchenkoVV <vv.harchenko@autodrilling.ru>
Date: Mon, 30 Aug 2021 15:53:08 +0500
Subject: [PATCH] Added filters to WellOperations Plan/Fact tables

---
 src/components/Table/index.ts                 |  9 ++++++++
 .../WellOperations/WellOperationsEditor.jsx   | 21 ++++++++++++++++---
 2 files changed, 27 insertions(+), 3 deletions(-)

diff --git a/src/components/Table/index.ts b/src/components/Table/index.ts
index fe5fe21..ff22c51 100644
--- a/src/components/Table/index.ts
+++ b/src/components/Table/index.ts
@@ -92,6 +92,15 @@ export const makeStringSorter = (key: string) => (a: any, b: any) =>
   return 0
 }
 
+export const makeDateSorter = (key: string) => (a: any, b: any) =>  {
+  const date = new Date(a[key])
+
+  if(Number.isNaN(date.getTime()))
+    throw new Error('Date column contains not date formatted string(s)')
+
+  return date.getTime() - new Date(b[key]).getTime()
+}
+
 export const makeGroupColumn = (title: string, children: object[]) => ({  
   title: title,
   children: children,
diff --git a/src/pages/WellOperations/WellOperationsEditor.jsx b/src/pages/WellOperations/WellOperationsEditor.jsx
index 3220d67..a49b653 100644
--- a/src/pages/WellOperations/WellOperationsEditor.jsx
+++ b/src/pages/WellOperations/WellOperationsEditor.jsx
@@ -1,7 +1,14 @@
 import { useState, useEffect } from 'react'
 import { Input } from 'antd'
 import moment from 'moment'
-import { EditableTable, DatePickerWrapper, SelectFromDictionary, numericColumnOptions, makeColumn } from "../../components/Table"
+import { 
+  EditableTable, 
+  DatePickerWrapper, 
+  SelectFromDictionary, 
+  makeColumn, 
+  numericColumnOptions, 
+  makeNumericSorter, 
+  makeDateSorter } from "../../components/Table"
 import LoaderPortal from '../../components/LoaderPortal'
 import { invokeWebApiWrapperAsync } from '../../components/factory'
 import { WellOperationService} from '../../services/api'
@@ -12,6 +19,11 @@ const { TextArea } = Input;
 const basePageSize = 160;
 const format='YYYY.MM.DD HH:mm'
 
+const numericSortColumnOptions = Object.assign({
+  sorter: makeNumericSorter('wellDepth')
+}, numericColumnOptions)
+
+
 export const WellOperationsEditor = ({idWell, idType}) => {
   const [pageNumAndPageSize, setPageNumAndPageSize] = useState({current:1, pageSize:basePageSize})
   const [paginationTotal, setPaginationTotal] = useState(0)
@@ -31,7 +43,9 @@ export const WellOperationsEditor = ({idWell, idType}) => {
     async () => {
       const skip = ((pageNumAndPageSize.current - 1) * pageNumAndPageSize.pageSize) || 0
       const take = pageNumAndPageSize.pageSize
-      const paginatedOperations = await WellOperationService.getOperations(idWell, idType, undefined, undefined, undefined, undefined, undefined, undefined, skip, take )
+      const paginatedOperations = await WellOperationService.getOperations(idWell, 
+        idType, undefined, undefined, undefined, undefined, 
+        undefined, undefined, skip, take )
       const operations = paginatedOperations?.items ?? []
       setOperations(operations)
       const total = paginatedOperations.count?? paginatedOperations.items?.length ?? 0      
@@ -57,11 +71,12 @@ export const WellOperationsEditor = ({idWell, idType}) => {
       render:(_, record)=>getByKeyOrReturnKey(dictionaryOperationCategory, record.idCategory)
     }),
     makeColumn('Доп. инфо','categoryInfo', {editable:true, width:300, input:<TextArea/>}),
-    makeColumn('Глубина забоя','wellDepth', numericColumnOptions),
+    makeColumn('Глубина забоя','wellDepth', numericSortColumnOptions),
     makeColumn('Время начала','startDate', {
       editable:true, 
       width:200, 
       input:<DatePickerWrapper/>,
+      sorter: makeDateSorter('startDate'),
       render:(_, record) => moment.utc(record.startDate).local().format(format)
     }),
     makeColumn('Часы','durationHours', numericColumnOptions),