Press n or j to go to the next uncovered block, b, p or k for the previous block.
| 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 | 66x 10x 9x 9x 9x 9x 4x 4x 4x 4x 9x 9x 63x 63x 48x 63x 9x | import React, { ReactElement, useEffect, useState } from 'react';
import {
PlusCircleOutlined, CheckCircleOutlined, MinusCircleOutlined,
PauseCircleOutlined, ExclamationCircleOutlined
} from '@ant-design/icons';
import { Popover, Tag } from 'antd';
import { useTranslation } from 'react-i18next';
import ObjectPopup from './ObjectPopup';
import { fetchCurrentValue, fetchFormIdAndExtInfoByType } from '@utils/FetchUtils';
import { emptyMethod } from '@utils/Constants';
export type IdsCellValueProps = {
insertedIds: string;
updatedIds: string;
deletedIds: string;
noUpdateIds: string;
conflictIds: string;
dbUpdatedCsvNoUpdateIds: string;
failedIds: string;
};
export type IdsCellProps = {
value: IdsCellValueProps;
domainClassId: number;
zIndex: number;
}
const IdsCell = (props: IdsCellProps): ReactElement => {
const { value, domainClassId, zIndex } = props;
const { t } = useTranslation();
const [domainName, setDomainName] = useState<string>("");
const [formId, setFormId] = useState<number>(-1);
useEffect(() => {
fetchCurrentValue("DomainClass", domainClassId).then(json => {
setDomainName(json.shortName);
fetchFormIdAndExtInfoByType(json.shortName, "Update").then(formInfo => {
setFormId(formInfo?.id);
});
}).catch(e => {
console.error(`Failed to get current value for DomainClass ${domainClassId}: ${e}`);
});
}, [domainClassId]);
const {
insertedIds, updatedIds, deletedIds, noUpdateIds, conflictIds,
dbUpdatedCsvNoUpdateIds, failedIds
} = (value == null) ? {
insertedIds: "",
updatedIds: "",
deletedIds: "",
noUpdateIds: "",
conflictIds: "",
dbUpdatedCsvNoUpdateIds: "",
failedIds: ""
} : value;
const render = (
title: string, content: string, Icon: typeof PlusCircleOutlined, color: string
): ReactElement => {
const idsArray = content?.split(',');
const tags = idsArray?.map(id =>
<ObjectPopup
domainName={domainName}
id={id}
formId={formId}
style={{ marginBottom: "0.2rem", marginTop: "0.2rem" }}
key={id}
zIndex={zIndex + 1}
/>
);
return content?.length > 0 ? (
<Popover
overlayStyle={{ zIndex: zIndex + 1 }}
onOpenChange={emptyMethod}
title={`${title}(${t("click id to open object detail page")})`}
content={
<div className='ids-cell-display'>
{tags}
</div>
}
trigger="click"
>
<Tag style={{
color,
border: `1px solid ${color}`
}}
className="action-tag ids-tag"
title={t("Click to show list of ids")}
>
<Icon /> {idsArray?.length}
</Tag>
</Popover>) : <></>;
};
return (<div className="update-ids-cell">
{render(t("Conflict objects"), conflictIds, ExclamationCircleOutlined, "#FFA500")}
{render(t("Inserted objects"), insertedIds, PlusCircleOutlined, "green")}
{render(t("DB updated CSV no update objects"), dbUpdatedCsvNoUpdateIds, PauseCircleOutlined, "blue")}
{render(t("Updated objects"), updatedIds, CheckCircleOutlined, "green")}
{render(t("Deleted objects"), deletedIds, MinusCircleOutlined, "yellow")}
{render(t("No update objects"), noUpdateIds, PauseCircleOutlined, "grey")}
{render(t("Failed objects"), failedIds, ExclamationCircleOutlined, "red")}
</div>
);
};
export default IdsCell;
|