+
+ {/* Row 1 Recurring Id and Status */}
+
+
+ {data?.recurringPaymentUID}
+
+ {data?.status?.name || "N/A"}
+
+
+
+ {/* Row 2 Category*/}
+
+
+
+
+
{data?.expenseCategory?.name || "N/A"}
+
+
+
+
+
+ {/* Row 3 Amount and Project */}
+
+
+
+
+
+ {data?.amount != null
+ ? `${data?.currency?.symbol ?? "¥"} ${Number(data.amount).toFixed(2)} ${data?.currency?.currencyCode ?? "CN"}`
+ : "N/A"}
+
+
+
+
+
+
+
+
{data?.project?.name || "N/A"}
+
+
+
+ {/* Row 4 Created At and Title*/}
+
+
+
+
+ {/*
+ {formatUTCToLocalTime(data?.createdAt, true)}
+
*/}
+
+
+ {data?.createdAt
+ ? formatUTCToLocalTime(data.createdAt, true)
+ : "N/A"}
+
+
+
+
+
+
+
+
{data?.title || "N/A"}
+
+
+
+ {/* Row 5 Payee and Notify*/}
+
+
+
+
+
{data?.payee || "N/A"}
+
+
+
+
+
+
+
+
+ {data?.notifyTo?.length > 0
+ ? data.notifyTo.map((user, index) => (
+
+ {user.email}
+ {index < data.notifyTo.length - 1 && ", "}
+
+ ))
+ : "N/A"}
+
+
+
+
+ {/* Row 6 Strike Date*/}
+
+
+
+
+ {/*
+ {formatUTCToLocalTime(data?.strikeDate)}
+
*/}
+
+ {data?.strikeDate
+ ? formatUTCToLocalTime(data.strikeDate, true)
+ : "N/A"}
+
+
+
+
+ {/* Row 7 Frequency and Buffer Days*/}
+
+
+
+
+
+ {data?.frequency !== undefined
+ ? FREQUENCY_FOR_RECURRING[data.frequency]
+ : "N/A"}
+
+
+
+
+
+
+
+
{data?.paymentBufferDays || "N/A"}
+
+
+
+ {/* Row 8 Updated At and Number of Iteration*/}
+
+
+
+
+
+ {data?.updatedAt
+ ? formatUTCToLocalTime(data.updatedAt, true)
+ : "N/A"}
+
+
+
+
+
+
+
+
{data?.numberOfIteration || "N/A"}
+
+
+
+
+ {/* Row 9 Created By and Updated By*/}
+
+
+
+
+
+
+ {`${data?.createdBy?.firstName ?? ""} ${data?.createdBy?.lastName ?? ""}`.trim() || "N/A"}
+
+
+
+
+
+
+
+ {data?.updatedBy ? (
+ <>
+
+
+ {`${data.updatedBy.firstName ?? ""} ${data.updatedBy.lastName ?? ""}`.trim() || "N/A"}
+
+
+ ) : (
+
N/A
+ )}
+
+
+
+ {/* Row 10 Description */}
+
+
+
+
+ {data?.description || "N/A"}
+
+
+