From 08b7897081a887295ccca03cc2b08fb44c9af9b2 Mon Sep 17 00:00:00 2001
From: Maksim Zakharov <max89701@gmail.com>
Date: Sun, 4 Aug 2024 13:43:17 +0300
Subject: [PATCH] MonthRender

---
 src/index.less                              | 36 ++++++---
 src/pages/Diary/components/MobileSearch.tsx | 86 +++++++++++----------
 2 files changed, 70 insertions(+), 52 deletions(-)

diff --git a/src/index.less b/src/index.less
index 6e0b6d5..77013c4 100644
--- a/src/index.less
+++ b/src/index.less
@@ -364,6 +364,8 @@ h1.ant-typography {
   display: none;
   flex-direction: column;
   gap: 16px;
+  position: relative;
+  background-color: rgba(var(--pro-app-background-color), 1);
   /*position: sticky;*/
   /*z-index: 12;*/
   /*left: 0;*/
@@ -374,6 +376,20 @@ h1.ant-typography {
   /*overflow: auto;*/
   /*height: calc(100vh - 137px);*/
 
+  .search-result{
+    display: flex;
+    gap: 16px;
+    flex-direction: column;
+    background-color: rgba(var(--pro-app-background-color), 1);
+    z-index: 20;
+    right: 0px;
+    left: 0px;
+    position: absolute;
+    top: 48px;
+    height: calc(100vh - 186px);
+    padding: 0 16px;
+  }
+
   .input-container {
     display: flex;
     gap: 12px;
@@ -2283,16 +2299,16 @@ html.dark .container > div.qty.negative, html.dark .container > div.loss-or-prof
   transition: none;
 }
 
-//html {
-//  height  : 100%;
-//  overflow: hidden;
-//  position: relative;
-//}
-//body {
-//  height  : 100%;
-//  overflow: auto;
-//  position: relative;
-//}
+html {
+  height  : 100%;
+  overflow: hidden;
+  position: relative;
+}
+body {
+  height  : 100%;
+  //overflow: auto;
+  position: relative;
+}
 
 .ant-drawer .ant-drawer-content-wrapper .drawer-slider {
   height: 20px;
diff --git a/src/pages/Diary/components/MobileSearch.tsx b/src/pages/Diary/components/MobileSearch.tsx
index 36f342e..193083e 100644
--- a/src/pages/Diary/components/MobileSearch.tsx
+++ b/src/pages/Diary/components/MobileSearch.tsx
@@ -82,53 +82,55 @@ const MobileSearch = ({getIsinBySymbol}) => {
                    onFocus={onFocus} onBlur={onBlur}/>
             {value && <Button type="link" onClick={() => setValue('')}>Отменить</Button>}
         </div>
-        {boardsWithLabel.filter(bwl => securitiesGroupByBoard[bwl.value]?.length).map(bwl =>
-            <div className="MobilePosition" key={bwl.value}>
-                <div className="widget">
-                    <div style={{display: 'flex', alignItems: 'end'}}>
-                        <div className="title-container">
-                            <div className="title">{bwl.label}</div>
-                            {(securitiesGroupByBoard[bwl.value] || []).length > 3 && <div style={{
-                                display: 'inline-flex',
-                                alignItems: 'end'
-                            }}>
-                                {!hideMap[bwl.value] && <Button type="link"
-                                                                onClick={() => setHideMap(prevState => ({
-                                                                    ...prevState,
-                                                                    [bwl.value]: true
-                                                                }))}>Больше</Button>}
-                                {hideMap[bwl.value] && <Button type="link" onClick={() => setHideMap(prevState => ({
-                                    ...prevState,
-                                    [bwl.value]: false
-                                }))}>Меньше</Button>}
-                            </div>}
+        {data.length > 0 && <div className="search-result">
+            {boardsWithLabel.filter(bwl => securitiesGroupByBoard[bwl.value]?.length).map(bwl =>
+                <div className="MobilePosition" key={bwl.value}>
+                    <div className="widget">
+                        <div style={{display: 'flex', alignItems: 'end'}}>
+                            <div className="title-container">
+                                <div className="title">{bwl.label}</div>
+                                {(securitiesGroupByBoard[bwl.value] || []).length > 3 && <div style={{
+                                    display: 'inline-flex',
+                                    alignItems: 'end'
+                                }}>
+                                    {!hideMap[bwl.value] && <Button type="link"
+                                                                    onClick={() => setHideMap(prevState => ({
+                                                                        ...prevState,
+                                                                        [bwl.value]: true
+                                                                    }))}>Больше</Button>}
+                                    {hideMap[bwl.value] && <Button type="link" onClick={() => setHideMap(prevState => ({
+                                        ...prevState,
+                                        [bwl.value]: false
+                                    }))}>Меньше</Button>}
+                                </div>}
+                            </div>
                         </div>
-                    </div>
-                    {(securitiesGroupByBoard[bwl.value] || []).filter((_, i) => !hideMap[bwl.value] ? i < 3 : true).map(dp =>
-                        <div className="ticker-info" key={dp.ISIN} onClick={() => handleSelectTicker(dp)}>
-                            <div style={{display: 'flex'}}>
-                                <TickerImg getIsinBySymbol={getIsinBySymbol} key={dp?.symbol} board={dp?.primary_board}
-                                           symbol={dp?.symbol}/>
-                                <div className="ticker_name">
-                                    <div className="ticker_name_title">{dp?.description}</div>
-                                    <div className="ticker_name_description">
-                                        {dp?.symbol}
+                        {(securitiesGroupByBoard[bwl.value] || []).filter((_, i) => !hideMap[bwl.value] ? i < 3 : true).map(dp =>
+                            <div className="ticker-info" key={dp.ISIN} onClick={() => handleSelectTicker(dp)}>
+                                <div style={{display: 'flex'}}>
+                                    <TickerImg getIsinBySymbol={getIsinBySymbol} key={dp?.symbol} board={dp?.primary_board}
+                                               symbol={dp?.symbol}/>
+                                    <div className="ticker_name">
+                                        <div className="ticker_name_title">{dp?.description}</div>
+                                        <div className="ticker_name_description">
+                                            {dp?.symbol}
+                                        </div>
                                     </div>
                                 </div>
-                            </div>
-                            {/*<div className="ticker_actions">*/}
-                            {/*    <div className="ticker_name_title"*/}
-                            {/*         style={{color: dp?.PnL > 0 ? 'rgba(var(--table-profit-color),1)' : 'rgba(var(--table-loss-color),1)'}}>*/}
-                            {/*        <span>{moneyFormat(dp?.PnL || 0)}</span>*/}
-                            {/*        <span>{`${numberToPercent(dp?.PnLPercent)}%`}</span>*/}
-                            {/*    </div>*/}
-                            {/*    <div className="ticker_name_description">на сумму {moneyFormat(dp?.volume, 0)}</div>*/}
-                            {/*</div>*/}
-                        </div>)}
+                                {/*<div className="ticker_actions">*/}
+                                {/*    <div className="ticker_name_title"*/}
+                                {/*         style={{color: dp?.PnL > 0 ? 'rgba(var(--table-profit-color),1)' : 'rgba(var(--table-loss-color),1)'}}>*/}
+                                {/*        <span>{moneyFormat(dp?.PnL || 0)}</span>*/}
+                                {/*        <span>{`${numberToPercent(dp?.PnLPercent)}%`}</span>*/}
+                                {/*    </div>*/}
+                                {/*    <div className="ticker_name_description">на сумму {moneyFormat(dp?.volume, 0)}</div>*/}
+                                {/*</div>*/}
+                            </div>)}
 
+                    </div>
                 </div>
-            </div>
-        )}
+            )}
+        </div>}
     </div>
 }