[AURORA-1966]: Справочники ГК и организаций приведение к макету
This commit is contained in:
parent
967fa01fb6
commit
bb047a95f4
@ -156,3 +156,8 @@ body {
|
|||||||
font-family: "Geist", "Gill Sans MT", Calibri, "Trebuchet MS", sans-serif;
|
font-family: "Geist", "Gill Sans MT", Calibri, "Trebuchet MS", sans-serif;
|
||||||
margin: 0px;
|
margin: 0px;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
/* Подписи полей во всех формах полужирные */
|
||||||
|
.ant-form-item-label > label {
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
|||||||
@ -50,7 +50,7 @@ createRoot(rootElement).render(
|
|||||||
},
|
},
|
||||||
Form: {
|
Form: {
|
||||||
labelFontSize: 12,
|
labelFontSize: 12,
|
||||||
labelColor: '#667085',
|
labelColor: '#101828',
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
}}>
|
}}>
|
||||||
|
|||||||
@ -1,9 +1,67 @@
|
|||||||
.ant-tabs-tab-active {
|
.catalogue-company-group-tabs {
|
||||||
background-color: #ecfdf3 !important;
|
padding-top: 8px;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-tabs-nav {
|
||||||
|
margin: 0 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-tabs-nav-list {
|
||||||
|
gap: 8px;
|
||||||
}
|
}
|
||||||
|
|
||||||
.ant-tabs-tab {
|
.ant-tabs-tab {
|
||||||
padding: 8px 12px !important;
|
padding: 8px 12px !important;
|
||||||
margin: 10px 0 0 0 !important;
|
margin: 0 !important;
|
||||||
border-radius: 8px !important;
|
border-radius: 8px !important;
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.ant-tabs-tab-active {
|
||||||
|
background-color: #ecfdf3 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-tabs-tab-btn {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
font-size: 14px;
|
||||||
|
line-height: 1;
|
||||||
|
color: #667085 !important;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-tabs-tab-active .ant-tabs-tab-btn {
|
||||||
|
color: #166534 !important;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
|
|
||||||
|
.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: 50%;
|
||||||
|
background-color: #f0f2f5;
|
||||||
|
color: #667085;
|
||||||
|
font-size: 12px;
|
||||||
|
line-height: 1;
|
||||||
|
font-weight: 500;
|
||||||
|
}
|
||||||
|
|
||||||
|
.ant-tabs-tab-active .catalogue-company-group-tabs__count {
|
||||||
|
background-color: transparent;
|
||||||
|
color: #166534;
|
||||||
|
font-weight: 600;
|
||||||
|
}
|
||||||
@ -11,22 +11,34 @@ interface CatalogueCompanyGroupTabsI {
|
|||||||
|
|
||||||
export type CatalogueCompanyGroupTabKey = 'legal_entities' | 'gsk' | 'gsz';
|
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) => {
|
export const CatalogueCompanyGroupTabs = ({ activeTab, setActiveTab, gskData, gszData }: CatalogueCompanyGroupTabsI) => {
|
||||||
const activeCompanyGroup = useAppSelector((state) => state.catalogue_jur.activeCompanyGroup);
|
const activeCompanyGroup = useAppSelector((state) => state.catalogue_jur.activeCompanyGroup);
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<Tabs
|
<Tabs
|
||||||
|
className='catalogue-company-group-tabs'
|
||||||
activeKey={activeTab}
|
activeKey={activeTab}
|
||||||
onChange={(key) => setActiveTab(key as CatalogueCompanyGroupTabKey)}
|
onChange={(key) => setActiveTab(key as CatalogueCompanyGroupTabKey)}
|
||||||
tabBarStyle={{ margin: 0, marginBottom: 0 }}
|
|
||||||
style={{ marginBottom: 0 }}
|
|
||||||
items={[
|
items={[
|
||||||
{
|
{
|
||||||
key: 'legal_entities',
|
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}` },
|
|
||||||
]}
|
]}
|
||||||
/>
|
/>
|
||||||
);
|
);
|
||||||
|
|||||||
@ -39,7 +39,7 @@ export const catalogueJurConfig: TableConfig<ICatalogueJur> = {
|
|||||||
title: 'Тип',
|
title: 'Тип',
|
||||||
features: { multiselect: true, sort: true },
|
features: { multiselect: true, sort: true },
|
||||||
render: (val) => {
|
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} />;
|
return <TableTag text={val as string} {...preset} />;
|
||||||
},
|
},
|
||||||
},
|
},
|
||||||
|
|||||||
@ -111,7 +111,7 @@ export const RelatedGroupForm: React.FC<Props> = ({ open, onCancel, onOk, relate
|
|||||||
loading={initialDataLoading}
|
loading={initialDataLoading}
|
||||||
confirmLoading={confirmLoading}>
|
confirmLoading={confirmLoading}>
|
||||||
<Form form={form} layout='vertical'>
|
<Form form={form} layout='vertical'>
|
||||||
<FormItem name='crm_id' label='ID в CRM'>
|
<FormItem name='crm_id' label={`ID ${kind === 'gsk' ? 'ГСК' : 'ГСЗ'} в CRM`}>
|
||||||
<Input />
|
<Input />
|
||||||
</FormItem>
|
</FormItem>
|
||||||
<FormItem name='name' label='Наименование' rules={[{ required: true, message: 'Укажите наименование' }]}>
|
<FormItem name='name' label='Наименование' rules={[{ required: true, message: 'Укажите наименование' }]}>
|
||||||
|
|||||||
Loading…
x
Reference in New Issue
Block a user