Fix displaying for list items

This commit is contained in:
Viet Anh Nguyen 2024-03-12 16:32:04 +07:00
parent 43cfb1e898
commit 123efb7524
2 changed files with 144 additions and 14 deletions

View File

@ -117,12 +117,6 @@ const EditableCell: React.FC<EditableCellProps> = ({
<Form.Item
style={{ margin: 0 }}
name={dataIndex}
rules={[
{
required: true,
message: `${title} is required.`,
},
]}
>
<Input ref={inputRef} onPressEnter={save} onBlur={save} />
</Form.Item>
@ -333,7 +327,7 @@ const InferencePage = () => {
};
const updateRevisedData = async (newRevisedData: any) => {
const requestID = newRevisedData.request_id;
const requestID = currentRequest.RequestID;
const token = localStorage.getItem('sbt-token') || '';
await fetch(`${baseURL}/ctel/request/${requestID}/`, {
method: 'POST',
@ -376,9 +370,32 @@ const InferencePage = () => {
const newData = [...dataSource];
const newRevisedData = {};
for (let i = 0; i < newData.length; i++) {
if (newData[i].revised === "<empty>") {
newData[i].revised = null;
}
if (typeof(newData[i].revised) === "string") {
newData[i].revised = newData[i].revised.trim();
}
if (newData[i].revised === "" || newData[i].revised === null || newData[i].revised === undefined) {
newData[i].revised = null;
}
if ((newData[i].key === "imei_number" || newData[i].key === "purchase_date") && typeof(newData[i].revised) === "string") {
// Convert to list
newData[i].revised = new Array(newData[i].revised.split(","));
}
if (Array.isArray(newData[i].revised)) {
// Trim all empty strings
for (let j = 0; j < newData[i].revised.length; j++) {
if (typeof(newData[i].revised[j]) === "string") {
newData[i].revised[j] = newData[i].revised[j].trim();
}
if (newData[i].revised[j] === "<empty>") {
newData[i].revised[j] = null;
}
}
}
newRevisedData[newData[i].key] = newData[i].revised;
}
console.log(currentRequest)
updateRevisedData(newRevisedData).then(() => {
// "[Is Reviewed]" => true
setCurrentRequest({
@ -400,6 +417,25 @@ const InferencePage = () => {
title: 'Predicted',
dataIndex: 'predicted',
key: 'predicted',
render: (text) => {
if (!text) return <span style={{ color: '#888' }}>{"<empty>"}</span>;
const displayedContent = text;
if (typeof(displayedContent) === "string") {
return <span style={{ color: '#000000' }}>{displayedContent}</span>;
} else if (typeof(displayedContent) === "object") {
if (displayedContent.length === 0) {
return <span style={{ color: '#888' }}>{"<empty>"}</span>;
}
// Set all empty values to "<empty>"
for (const key in displayedContent) {
if (!displayedContent[key]) {
displayedContent[key] = "<empty>";
}
}
return <span style={{ color: '#000000' }}>{displayedContent.join(", ")}</span>;
}
return <span style={{ color: '#000000' }}>{displayedContent}</span>;
},
},
{
title: (<div style={{
@ -426,6 +462,25 @@ const InferencePage = () => {
dataIndex: 'revised',
key: 'revised',
editable: ENABLE_REVIEW,
render: (text) => {
if (!text) return <span style={{ color: '#888' }}>{"<empty>"}</span>;
const displayedContent = text;
if (typeof(displayedContent) === "string") {
return <span style={{ color: '#000000' }}>{displayedContent}</span>;
} else if (typeof(displayedContent) === "object") {
if (displayedContent.length === 0) {
return <span style={{ color: '#888' }}>{"<empty>"}</span>;
}
// Set all empty values to "<empty>"
for (const key in displayedContent) {
if (!displayedContent[key]) {
displayedContent[key] = "<empty>";
}
}
return <span style={{ color: '#000000' }}>{displayedContent.join(", ")}</span>;
}
return <span style={{ color: '#000000' }}>{displayedContent}</span>;
},
},
];

View File

@ -430,9 +430,32 @@ const ReviewPage = () => {
const newData = [...dataSource];
const newRevisedData = {};
for (let i = 0; i < newData.length; i++) {
if (newData[i].revised === "<empty>") {
newData[i].revised = null;
}
if (typeof(newData[i].revised) === "string") {
newData[i].revised = newData[i].revised.trim();
}
if (newData[i].revised === "" || newData[i].revised === null || newData[i].revised === undefined) {
newData[i].revised = null;
}
if ((newData[i].key === "imei_number" || newData[i].key === "purchase_date") && typeof(newData[i].revised) === "string") {
// Convert to list
newData[i].revised = new Array(newData[i].revised.split(","));
}
if (Array.isArray(newData[i].revised)) {
// Trim all empty strings
for (let j = 0; j < newData[i].revised.length; j++) {
if (typeof(newData[i].revised[j]) === "string") {
newData[i].revised[j] = newData[i].revised[j].trim();
}
if (newData[i].revised[j] === "<empty>") {
newData[i].revised[j] = null;
}
}
}
newRevisedData[newData[i].key] = newData[i].revised;
}
console.log(currentRequest)
updateRevisedData(newRevisedData).then(() => {
// "[Is Reviewed]" => true
setCurrentRequest({
@ -443,6 +466,7 @@ const ReviewPage = () => {
};
const defaultColumns = [
{
title: 'Key',
@ -454,11 +478,49 @@ const ReviewPage = () => {
title: 'Predicted',
dataIndex: 'predicted',
key: 'predicted',
render: (text) => {
if (!text) return <span style={{ color: '#888' }}>{"<empty>"}</span>;
const displayedContent = text;
if (typeof(displayedContent) === "string") {
return <span style={{ color: '#000000' }}>{displayedContent}</span>;
} else if (typeof(displayedContent) === "object") {
if (displayedContent.length === 0) {
return <span style={{ color: '#888' }}>{"<empty>"}</span>;
}
// Set all empty values to "<empty>"
for (const key in displayedContent) {
if (!displayedContent[key]) {
displayedContent[key] = "<empty>";
}
}
return <span style={{ color: '#000000' }}>{displayedContent.join(", ")}</span>;
}
return <span style={{ color: '#000000' }}>{displayedContent}</span>;
},
},
{
title: 'Submitted',
dataIndex: 'submitted',
key: 'submitted',
render: (text) => {
if (!text) return <span style={{ color: '#888' }}>{"<empty>"}</span>;
const displayedContent = text;
if (typeof(displayedContent) === "string") {
return <span style={{ color: '#000000' }}>{displayedContent}</span>;
} else if (typeof(displayedContent) === "object") {
if (displayedContent.length === 0) {
return <span style={{ color: '#888' }}>{"<empty>"}</span>;
}
// Set all empty values to "<empty>"
for (const key in displayedContent) {
if (!displayedContent[key]) {
displayedContent[key] = "<empty>";
}
}
return <span style={{ color: '#000000' }}>{displayedContent.join(", ")}</span>;
}
return <span style={{ color: '#000000' }}>{displayedContent}</span>;
},
},
{
title: (<div style={{
@ -499,11 +561,24 @@ const ReviewPage = () => {
dataIndex: 'revised',
key: 'revised',
editable: true,
render: (text, record) => {
return <div style={{
color: '#000',
fontWeight: 'bold',
}}>{text}</div>;
render: (text) => {
if (!text) return <span style={{ color: '#888' }}>{"<empty>"}</span>;
const displayedContent = text;
if (typeof(displayedContent) === "string") {
return <span style={{ color: '#000000' }}>{displayedContent}</span>;
} else if (typeof(displayedContent) === "object") {
if (displayedContent.length === 0) {
return <span style={{ color: '#888' }}>{"<empty>"}</span>;
}
// Set all empty values to "<empty>"
for (const key in displayedContent) {
if (!displayedContent[key]) {
displayedContent[key] = "<empty>";
}
}
return <span style={{ color: '#000000' }}>{displayedContent.join(", ")}</span>;
}
return <span style={{ color: '#000000' }}>{displayedContent}</span>;
},
},
];