Обновлены стили страницы "Статистика использования уставок"

src/pages/Well/Telemetry/TelemetryView/LimitingParameterStatistics/index.jsx

@@ -13,15 +13,15 @@ import { useElementSize } from '@utils'
 
 import { makeGetColor } from '@pages/Well/WellOperations/Tvd'
 
-import '@styles/limiting_parameter_statistics.less'
+import '@styles/pages/limiting_parameter_statistics.less'
 
 const columns = [
     makeColumn('Цвет', 'color', { width: 50, render: (d) => (
         <div style={{ backgroundColor: d, padding: '5px 0' }} />
     ) }),
     makeTextColumn('Уставка', 'nameFeedRegulator'),
-    makeNumericColumn('Проходка, м', 'depth'),
+    makeNumericColumn('Проходка, м', 'depth', undefined, undefined, 140),
-    makeNumericColumn('Кол-во включений', 'numberInclusions', undefined, undefined, makeNumericRender(0)),
+    makeNumericColumn('Кол-во включений', 'numberInclusions', makeNumericRender(0), undefined, 150),
 ]
 
 export const LimitingParameterStatistics = memo(() => {
@@ -59,16 +59,16 @@ export const LimitingParameterStatistics = memo(() => {
             }
         }
         if (record.idFeedRegulator === selectedRegulator)
-            out.style = { background: '#FAFAFA', fontSize: '16px', fontWeight: '600' }
+            out.className = 'dd-selected-row'
         return out
     }, [selectedRegulator])
 
-    const onPieOver = useCallback(function (e, d) {
+    const onPieOver = useCallback(function (_, d) { // Стрелочная функция не подойдёт из-за использования `this`
         setSelectedRegulator(d.data.idFeedRegulator)
         d3.select(this).attr('transform', 'scale(1.05)')
     }, [])
 
-    const onPieOut = useCallback(function (e, d) {
+    const onPieOut = useCallback(function () { // Стрелочная функция не подойдёт из-за использования `this`
         setSelectedRegulator(null)
         d3.select(this).attr('transform', 'scale(1)')
     }, [])
@@ -181,15 +181,15 @@ export const LimitingParameterStatistics = memo(() => {
             <Button onClick={() => setIsOpen(true)}>Статистика использования уставок</Button>
             <Modal
                 centered
-                width={1024}
+                width={950}
                 footer={false}
                 title={'Статистика использования уставок'}
                 onCancel={() => setIsOpen(false)}
                 open={isOpen}
             >
-                <LoaderPortal show={isLoading}>
+                <LoaderPortal show={isLoading} className={'limit-parameter-stats-page'}>
                     <div className={'filter-groups'}>
-                        <Input.Group compact style={{ flex: 1 }}>
+                        <Input.Group compact style={{ flex: 2 }}>
                             <Input
                                 addonBefore={(
                                     <Radio
@@ -203,7 +203,7 @@ export const LimitingParameterStatistics = memo(() => {
                                 disabled={mode !== 'depth'}
                                 prefix={'От'}
                                 suffix={'м'}
-                                style={{ width: 'calc(50% + 113px / 2)', textAlign: 'right' }}
+                                style={{ width: 'calc(50% + 128px / 2)', textAlign: 'right' }}
                                 onChange={(e) => onDepthChanged(e, 'from')}
                                 value={depthFilter.from}
                             />
@@ -212,12 +212,12 @@ export const LimitingParameterStatistics = memo(() => {
                                 disabled={mode !== 'depth'}
                                 prefix={'До'}
                                 suffix={'м'}
-                                style={{ width: 'calc(50% - 113px / 2)', textAlign: 'right' }}
+                                style={{ width: 'calc(50% - 128px / 2)', textAlign: 'right' }}
                                 onChange={(e) => onDepthChanged(e, 'to')}
                                 value={depthFilter.to}
                             />
                         </Input.Group>
-                        <Input.Group compact style={{ flex: 1 }}>
+                        <Input.Group compact style={{ flex: 3 }}>
                             <Input style={{ width: 128 }} addonBefore={(
                                 <Radio
                                     checked={mode === 'time'}
@@ -240,9 +240,9 @@ export const LimitingParameterStatistics = memo(() => {
                         {data ? (
                             <svg ref={setSvgRef} width={'100%'} height={'100%'}>
                                 <g transform={`translate(${width / 2}, ${height / 2})`}>
-                                    <g className={'slices'} stroke={'#0005'} />
+                                    <g className={'slices'} />
-                                    <g className={'labels'} fill={'black'} />
+                                    <g className={'labels'} />
-                                    <g className={'lines'} fill={'none'} stroke={'black'} />
+                                    <g className={'lines'} />
                                 </g>
                             </svg>
                         ) : (

src/styles/limiting_parameter_statistics.less

@@ -1,29 +0,0 @@
-.filter-groups {
-    display: flex;
-    gap: 10px;
-
-    & .filter-label {
-        display: flex;
-        align-items: center;
-    }
-
-    & .date-filter {
-        display: flex;
-        width: 100%;
-        height: 100%;
-        justify-content: center;
-        align-items: center;
-    }
-}
-
-.modal-label {
-    width: 100%;
-    margin: 20px 0;
-    font-size: 1rem;
-    text-align: center;
-}
-
-.lps-pie-chart {
-    min-height: 30vh;
-    max-height: 50vh;
-}

src/styles/pages/limiting_parameter_statistics.less

@@ -0,0 +1,54 @@
+@import '../include/antd_theme';
+@import '../mixins';
+
+.limit-parameter-stats-page {
+    & .filter-groups {
+        display: flex;
+        gap: 10px;
+    
+        & .filter-label {
+            display: flex;
+            align-items: center;
+        }
+    
+        & .date-filter {
+            display: flex;
+            width: 100%;
+            height: 100%;
+            justify-content: center;
+            align-items: center;
+        }
+    }
+
+    & .modal-label {
+        width: 100%;
+        margin: 20px 0;
+        font-size: 1rem;
+        text-align: center;
+    }
+
+    .dd-selected-row {
+        background: @primary;
+        font-size: 16px;
+        font-weight: 600;
+    }
+
+    & .lps-pie-chart {
+        min-height: 30vh;
+        max-height: 50vh;
+    
+        & .slices {
+            stroke: #0005;
+        }
+    
+        & .labels {
+            fill: white;
+        }
+    
+        & .lines {
+            fill: none;
+            stroke: white;
+            .no-events();
+        }
+    }
+}