From 67bd18e43ccf926beea89793ad3968e7eb47b431 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=D0=A4=D1=80=D0=BE=D0=BB=D0=BE=D0=B2?=
 <nikita.grigorevich@gmail.com>
Date: Tue, 1 Jun 2021 15:28:05 +0500
Subject: [PATCH] new LoadPortal component

---
 src/components/LoaderPortal.jsx | 13 +++++++++++++
 src/pages/Wells.jsx             |  9 +++++----
 2 files changed, 18 insertions(+), 4 deletions(-)
 create mode 100644 src/components/LoaderPortal.jsx

diff --git a/src/components/LoaderPortal.jsx b/src/components/LoaderPortal.jsx
new file mode 100644
index 0000000..deed9ee
--- /dev/null
+++ b/src/components/LoaderPortal.jsx
@@ -0,0 +1,13 @@
+import Loader from './Loader'
+
+export default function LoaderPortal({show, children}){
+  return(
+    <div className='loader-container'>
+      <div className='loader-content'>
+        123456{/* {children} */}
+      </div>
+      {/* {show && <div className='loader-overlay'><Loader/></div>} */}
+      <div className='loader-overlay'>qqqq</div>
+      {/* {show && <Loader className='loader-overlay'/>} */}
+    </div>)
+}
\ No newline at end of file
diff --git a/src/pages/Wells.jsx b/src/pages/Wells.jsx
index 333344d..33bdc2f 100644
--- a/src/pages/Wells.jsx
+++ b/src/pages/Wells.jsx
@@ -1,6 +1,6 @@
 import { useState, useEffect } from 'react'
 import { WellService } from '../services/api'
-import Loader from '../components/Loader'
+import LoaderPortal from '../components/LoaderPortal'
 import { Table } from 'antd' // TreeSelect 
 import { useHistory } from 'react-router-dom'
 import notify from '../components/notify'
@@ -44,14 +44,15 @@ export default function Wells(props){
       notify('Не удалось загрузить список скважин', 'error')
       console.error(`${e}`);
     }
-    setLoader(false)
+    //setLoader(false)
   }
 
   useEffect(()=>updateWellsList(), [])
 
   return(<>
       <h2>Скважины</h2>
-      <Table 
+      <LoaderPortal show={loader}>
+        <Table 
         dataSource={wells} 
         columns={columns}
         onRow={(record) => {
@@ -59,6 +60,6 @@ export default function Wells(props){
             onClick: event => {history.push(`/well/${record.id}/`)},
           };
         }}/>
-      {loader&&<Loader/>}
+      </LoaderPortal>
     </>)
 }
\ No newline at end of file