ui improvements

apps/web/Components/Calculation/Form/ELT/Components/ReloadButton.tsx

@@ -3,6 +3,7 @@ import { useStore } from '@/stores/hooks';
 import { observer } from 'mobx-react-lite';
 import { Button } from 'ui/antd';
 import { ReloadOutlined } from 'ui/elements/icons';
+import { Flex } from 'ui/grid';
 
 export const ReloadButton = observer(
   ({ storeSelector, onClick }: { onClick: () => void; storeSelector: StoreSelector }) => {
@@ -12,12 +13,14 @@ export const ReloadButton = observer(
     const hasErrors = validation.hasErrors;
 
     return (
-      <Button
-        onClick={onClick}
-        disabled={hasErrors || rows.some((x) => x.status === 'fetching')}
-        shape="circle"
-        icon={<ReloadOutlined />}
-      />
+      <Flex justifyContent="center">
+        <Button
+          onClick={onClick}
+          disabled={hasErrors || rows.some((x) => x.status === 'fetching')}
+          shape="circle"
+          icon={<ReloadOutlined />}
+        />
+      </Flex>
     );
   }
 );

apps/web/Components/Calculation/Form/ELT/lib/config.tsx

@@ -1,6 +1,7 @@
 import type { RowSchema } from '@/config/schema/elt';
 import { CloseOutlined, LoadingOutlined } from 'ui/elements/icons';
 import type { ColumnsType } from 'ui/elements/table';
+import { Flex } from 'ui/grid';
 import type { z } from 'zod';
 
 type Row = z.infer<typeof RowSchema>;
@@ -14,6 +15,7 @@ export const columns: ColumnsType<Row> = [
   {
     dataIndex: 'name',
     title: 'Страховая компания',
+    width: '50%',
   },
   {
     dataIndex: 'sum',
@@ -21,20 +23,33 @@ export const columns: ColumnsType<Row> = [
     sortDirections: ['descend', 'ascend'],
     sorter: (a, b) => a.sum - b.sum,
     title: 'Сумма',
+    width: '20%',
   },
   {
     dataIndex: 'totalFranchise',
     render: formatter,
     title: 'Франшиза',
+    width: '20%',
   },
   {
     dataIndex: 'status',
     render: (value) => {
-      if (value === 'fetching') return <LoadingOutlined spin />;
-      if (value === 'error') return <CloseOutlined />;
+      if (value === 'fetching')
+        return (
+          <Flex justifyContent="center">
+            <LoadingOutlined spin />
+          </Flex>
+        );
+      if (value === 'error')
+        return (
+          <Flex justifyContent="center">
+            <CloseOutlined />
+          </Flex>
+        );
 
       return false;
     },
     title: undefined,
+    width: '5%',
   },
 ];