2024-06-07 20:17:03 +03:00
|
|
|
import clsx from 'clsx';
|
|
|
|
|
2024-09-23 11:48:02 +03:00
|
|
|
import { CstClass, IConstituenta } from '@/models/rsform';
|
2024-06-07 20:17:03 +03:00
|
|
|
import { isMockCst } from '@/models/rsformAPI';
|
|
|
|
import { colorFgCstStatus, IColorTheme } from '@/styling/color';
|
|
|
|
|
2024-09-06 13:49:36 +03:00
|
|
|
import { CProps } from '../props';
|
2024-06-26 19:47:05 +03:00
|
|
|
import TooltipConstituenta from './TooltipConstituenta';
|
|
|
|
|
2024-09-06 13:49:36 +03:00
|
|
|
interface BadgeConstituentaProps extends CProps.Styling {
|
2024-06-07 20:17:03 +03:00
|
|
|
prefixID?: string;
|
|
|
|
value: IConstituenta;
|
|
|
|
theme: IColorTheme;
|
|
|
|
}
|
|
|
|
|
2024-09-06 13:49:36 +03:00
|
|
|
function BadgeConstituenta({ value, prefixID, className, style, theme }: BadgeConstituentaProps) {
|
2024-06-07 20:17:03 +03:00
|
|
|
return (
|
|
|
|
<div
|
2024-09-18 15:09:17 +03:00
|
|
|
id={`${prefixID}${value.id}`}
|
2024-06-07 20:17:03 +03:00
|
|
|
className={clsx(
|
2024-09-06 13:49:36 +03:00
|
|
|
'min-w-[3.1rem] max-w-[3.1rem]',
|
2024-06-07 20:17:03 +03:00
|
|
|
'px-1',
|
|
|
|
'border rounded-md',
|
2024-08-01 00:35:49 +03:00
|
|
|
value.is_inherited && 'border-dashed',
|
2024-09-06 13:49:36 +03:00
|
|
|
'text-center font-medium whitespace-nowrap',
|
|
|
|
className
|
2024-06-07 20:17:03 +03:00
|
|
|
)}
|
|
|
|
style={{
|
|
|
|
borderColor: colorFgCstStatus(value.status, theme),
|
|
|
|
color: colorFgCstStatus(value.status, theme),
|
2024-09-23 11:48:02 +03:00
|
|
|
backgroundColor: isMockCst(value)
|
|
|
|
? theme.bgWarning
|
|
|
|
: value.cst_class === CstClass.BASIC
|
|
|
|
? theme.bgGreen25
|
|
|
|
: theme.bgInput,
|
2024-09-06 13:49:36 +03:00
|
|
|
...style
|
2024-06-07 20:17:03 +03:00
|
|
|
}}
|
|
|
|
>
|
|
|
|
{value.alias}
|
2024-09-18 15:09:17 +03:00
|
|
|
<TooltipConstituenta anchor={`#${prefixID}${value.id}`} data={value} />
|
2024-06-07 20:17:03 +03:00
|
|
|
</div>
|
|
|
|
);
|
|
|
|
}
|
|
|
|
|
|
|
|
export default BadgeConstituenta;
|