Merge pull request '[AURORA-1966]: Справочники ГК и организаций приведение к макету' (#219) from fix/1966-update-design into main

web/src/index.css

@@ -156,3 +156,8 @@ body {
 	font-family: "Geist", "Gill Sans MT", Calibri, "Trebuchet MS", sans-serif;
 	margin: 0px;
 }
+
+/* Подписи полей во всех формах полужирные */
+.ant-form-item-label > label {
+	font-weight: 600;
+}

web/src/index.tsx

@@ -50,7 +50,7 @@ createRoot(rootElement).render(
 				},
 				Form: {
 					labelFontSize: 12,
-					labelColor: '#667085',
+					labelColor: '#101828',
 				},
 			},
 		}}>

web/src/widgets/CatalogueCompanyGroup/CatalogueCompanyGroupTabs/CatalogueCompanyGroupTabs.css

@@ -1,9 +1,67 @@
-.ant-tabs-tab-active {
+.catalogue-company-group-tabs {
+	padding-top: 8px;
+}
+
+.catalogue-company-group-tabs .ant-tabs-nav {
+	margin: 0 !important;
+}
+
+.catalogue-company-group-tabs .ant-tabs-nav-list {
+	gap: 8px;
+}
+
+.catalogue-company-group-tabs .ant-tabs-tab {
+	padding: 8px 12px !important;
+	margin: 0 !important;
+	border-radius: 8px !important;
+	display: flex;
+	align-items: center;
+}
+
+.catalogue-company-group-tabs .ant-tabs-tab-active {
 	background-color: #ecfdf3 !important;
 }
 
-.ant-tabs-tab {
-	padding: 8px 12px !important;
-	margin: 10px 0 0 0 !important;
-	border-radius: 8px !important;
+.catalogue-company-group-tabs .ant-tabs-tab-btn {
+	display: flex;
+	align-items: center;
+	font-size: 14px;
+	line-height: 1;
+	color: #667085 !important;
 }
+
+.catalogue-company-group-tabs .ant-tabs-tab-active .ant-tabs-tab-btn {
+	color: #166534 !important;
+	font-weight: 600;
+}
+
+.catalogue-company-group-tabs .ant-tabs-ink-bar {
+	display: none !important;
+}
+
+.catalogue-company-group-tabs__label {
+	display: inline-flex;
+	align-items: center;
+	gap: 8px;
+}
+
+.catalogue-company-group-tabs__count {
+	display: inline-flex;
+	align-items: center;
+	justify-content: center;
+	min-width: 20px;
+	height: 20px;
+	padding: 0 6px;
+	border-radius: 10px;
+	background-color: #f0f2f5;
+	color: #667085;
+	font-size: 12px;
+	line-height: 1;
+	font-weight: 500;
+}
+
+.catalogue-company-group-tabs .ant-tabs-tab-active .catalogue-company-group-tabs__count {
+	background-color: transparent;
+	color: #166534;
+	font-weight: 600;
+}

web/src/widgets/CatalogueCompanyGroup/CatalogueCompanyGroupTabs/CatalogueCompanyGroupTabs.tsx

@@ -11,22 +11,34 @@ interface CatalogueCompanyGroupTabsI {
 
 export type CatalogueCompanyGroupTabKey = 'legal_entities' | 'gsk' | 'gsz';
 
+const TabLabel = ({ title, count }: { title: string; count: number }) => (
+	<span className='catalogue-company-group-tabs__label'>
+		<span>{title}</span>
+		<span className='catalogue-company-group-tabs__count'>{count}</span>
+	</span>
+);
+
 export const CatalogueCompanyGroupTabs = ({ activeTab, setActiveTab, gskData, gszData }: CatalogueCompanyGroupTabsI) => {
 	const activeCompanyGroup = useAppSelector((state) => state.catalogue_jur.activeCompanyGroup);
 
 	return (
 		<Tabs
+			className='catalogue-company-group-tabs'
 			activeKey={activeTab}
 			onChange={(key) => setActiveTab(key as CatalogueCompanyGroupTabKey)}
-			tabBarStyle={{ margin: 0, marginBottom: 0 }}
-			style={{ marginBottom: 0 }}
 			items={[
 				{
 					key: 'legal_entities',
-					label: `ЮЛ ${activeCompanyGroup?.legal_entities_count ?? 0}`,
+					label: <TabLabel title='ЮЛ' count={activeCompanyGroup?.legal_entities_count ?? 0} />,
+				},
+				{
+					key: 'gsk',
+					label: <TabLabel title='ГСК' count={gskData.length} />,
+				},
+				{
+					key: 'gsz',
+					label: <TabLabel title='ГСЗ' count={gszData.length} />,
 				},
-				{ key: 'gsk', label: `ГСК ${gskData?.length ?? 0}` },
-				{ key: 'gsz', label: `ГСЗ ${gszData?.length ?? 0}` },
 			]}
 		/>
 	);

web/src/widgets/CatalogueJur/CatalogueJurTable/config.tsx

@@ -39,7 +39,7 @@ export const catalogueJurConfig: TableConfig<ICatalogueJur> = {
 			title: 'Тип',
 			features: { multiselect: true, sort: true },
 			render: (val) => {
-				const preset = val === 'ЮЛ' ? TAG_PRESETS.orange : TAG_PRESETS.purple;
+				const preset = val === 'ЮЛ' ? TAG_PRESETS.purple : TAG_PRESETS.orange;
 				return <TableTag text={val as string} {...preset} />;
 			},
 		},

web/src/widgets/RelatedGroup/RelatedGroupForm/RelatedGroupForm.tsx

@@ -111,7 +111,7 @@ export const RelatedGroupForm: React.FC<Props> = ({ open, onCancel, onOk, relate
 			loading={initialDataLoading}
 			confirmLoading={confirmLoading}>
 			<Form form={form} layout='vertical'>
-				<FormItem name='crm_id' label='ID в CRM'>
+				<FormItem name='crm_id' label={`ID ${kind === 'gsk' ? 'ГСК' : 'ГСЗ'} в CRM`}>
 					<Input />
 				</FormItem>
 				<FormItem name='name' label='Наименование' rules={[{ required: true, message: 'Укажите наименование' }]}>