Merge branch 'develop' into feature/mobile_upload

CAFECA-IO · Oct 11, 2024 · 3484a11 · 3484a11
2 parents 27e37ed + 964dc9b
commit 3484a11
Show file tree

Hide file tree

Showing 10 changed files with 272 additions and 233 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "iSunFA",
-  "version": "0.8.2+43",
+  "version": "0.8.2+45",
   "private": false,
   "scripts": {
     "dev": "next dev",

diff --git a/src/components/income_statement_report_body/income_statement_report_body_all.tsx b/src/components/income_statement_report_body/income_statement_report_body_all.tsx
@@ -9,6 +9,7 @@ import Image from 'next/image';
 import React, { useState } from 'react';
 import { format } from 'date-fns';
 import CollapseButton from '@/components/button/collapse_button';
+import IncomeStatementReportTableRow from './income_statement_report_table_row';
 
 interface IIncomeStatementReportBodyAllProps {
   reportId: string;
@@ -180,31 +181,9 @@ const IncomeStatementReportBodyAll = ({ reportId }: IIncomeStatementReportBodyAl
             <tbody>
               {reportFinancial &&
                 reportFinancial.general &&
-                reportFinancial.general.slice(0, 10).map((value) => (
-                  <tr key={value.code} className="h-40px">
-                    <td className="border border-stroke-brand-secondary-soft p-10px text-xs">
-                      {value.code}
-                    </td>
-                    <td
-                      className="border border-stroke-brand-secondary-soft p-10px text-xs"
-                      style={{ width: '200px' }}
-                    >
-                      {value.name}
-                    </td>
-                    <td className="border border-stroke-brand-secondary-soft p-10px text-end text-xs">
-                      {value.curPeriodAmount}
-                    </td>
-                    <td className="border border-stroke-brand-secondary-soft p-10px text-center text-xs">
-                      {value.curPeriodPercentage}
-                    </td>
-                    <td className="border border-stroke-brand-secondary-soft p-10px text-end text-xs">
-                      {value.prePeriodAmount}
-                    </td>
-                    <td className="border border-stroke-brand-secondary-soft p-10px text-center text-xs">
-                      {value.prePeriodPercentage}
-                    </td>
-                  </tr>
-                ))}
+                reportFinancial.general
+                  .slice(0, 10)
+                  .map((value) => <IncomeStatementReportTableRow {...value} />)}
             </tbody>
           </table>
         )}
@@ -277,28 +256,9 @@ const IncomeStatementReportBodyAll = ({ reportId }: IIncomeStatementReportBodyAl
           <tbody>
             {reportFinancial &&
               reportFinancial.general &&
-              reportFinancial.general.slice(10, 24).map((value) => (
-                <tr key={value.code} className="h-40px">
-                  <td className="border border-stroke-brand-secondary-soft p-10px text-xs">
-                    {value.code}
-                  </td>
-                  <td className="min-w-177px border border-stroke-brand-secondary-soft p-10px text-xs">
-                    {value.name}
-                  </td>
-                  <td className="border border-stroke-brand-secondary-soft p-10px text-end text-xs">
-                    {value.curPeriodAmount}
-                  </td>
-                  <td className="border border-stroke-brand-secondary-soft p-10px text-center text-xs">
-                    {value.curPeriodPercentage}
-                  </td>
-                  <td className="border border-stroke-brand-secondary-soft p-10px text-end text-xs">
-                    {value.prePeriodAmount}
-                  </td>
-                  <td className="border border-stroke-brand-secondary-soft p-10px text-center text-xs">
-                    {value.prePeriodPercentage}
-                  </td>
-                </tr>
-              ))}
+              reportFinancial.general
+                .slice(10, 24)
+                .map((value) => <IncomeStatementReportTableRow {...value} />)}
           </tbody>
         </table>
       </section>
@@ -368,28 +328,9 @@ const IncomeStatementReportBodyAll = ({ reportId }: IIncomeStatementReportBodyAl
           <tbody>
             {reportFinancial &&
               reportFinancial.general &&
-              reportFinancial.general.slice(24, 33).map((value) => (
-                <tr key={value.code} className="h-40px">
-                  <td className="border border-stroke-brand-secondary-soft p-10px text-xs">
-                    {value.code}
-                  </td>
-                  <td className="w-177px border border-stroke-brand-secondary-soft p-10px text-xs">
-                    {value.name}
-                  </td>
-                  <td className="border border-stroke-brand-secondary-soft p-10px text-end text-xs">
-                    {value.curPeriodAmount}
-                  </td>
-                  <td className="border border-stroke-brand-secondary-soft p-10px text-center text-xs">
-                    {value.curPeriodPercentage}
-                  </td>
-                  <td className="border border-stroke-brand-secondary-soft p-10px text-end text-xs">
-                    {value.prePeriodAmount}
-                  </td>
-                  <td className="border border-stroke-brand-secondary-soft p-10px text-center text-xs">
-                    {value.prePeriodPercentage}
-                  </td>
-                </tr>
-              ))}
+              reportFinancial.general
+                .slice(24, 33)
+                .map((value) => <IncomeStatementReportTableRow {...value} />)}
 
             <tr>
               <td className="border border-stroke-brand-secondary-soft p-10px text-xs">&nbsp;</td>
@@ -411,28 +352,9 @@ const IncomeStatementReportBodyAll = ({ reportId }: IIncomeStatementReportBodyAl
           <tbody>
             {reportFinancial &&
               reportFinancial.general &&
-              reportFinancial.general.slice(34, 36).map((value) => (
-                <tr key={value.code} className="h-40px">
-                  <td className="border border-stroke-brand-secondary-soft p-10px text-xs font-semibold">
-                    {value.code}
-                  </td>
-                  <td className="w-177px border border-stroke-brand-secondary-soft p-10px text-xs font-semibold">
-                    {value.name}
-                  </td>
-                  <td className="border border-stroke-brand-secondary-soft p-10px text-end text-xs font-semibold">
-                    {value.curPeriodAmount}
-                  </td>
-                  <td className="border border-stroke-brand-secondary-soft p-10px text-center text-xs font-semibold">
-                    &nbsp;
-                  </td>
-                  <td className="border border-stroke-brand-secondary-soft p-10px text-end text-xs font-semibold">
-                    {value.prePeriodAmount}
-                  </td>
-                  <td className="border border-stroke-brand-secondary-soft p-10px text-center text-xs font-semibold">
-                    &nbsp;
-                  </td>
-                </tr>
-              ))}
+              reportFinancial.general
+                .slice(34, 36)
+                .map((value) => <IncomeStatementReportTableRow {...value} />)}
           </tbody>
         </table>
         <div className="relative mt-6">
@@ -515,28 +437,9 @@ const IncomeStatementReportBodyAll = ({ reportId }: IIncomeStatementReportBodyAl
             <tbody>
               {reportFinancial &&
                 reportFinancial.details &&
-                reportFinancial.details.slice(0, 15).map((value) => (
-                  <tr key={value.code} className="h-40px">
-                    <td className="border border-stroke-brand-secondary-soft p-10px text-xs">
-                      {value.code}
-                    </td>
-                    <td className="w-177px border border-stroke-brand-secondary-soft p-10px text-xs">
-                      {value.name}
-                    </td>
-                    <td className="border border-stroke-brand-secondary-soft p-10px text-end text-xs">
-                      {value.curPeriodAmount}
-                    </td>
-                    <td className="border border-stroke-brand-secondary-soft p-10px text-center text-xs">
-                      {value.curPeriodPercentage}
-                    </td>
-                    <td className="border border-stroke-brand-secondary-soft p-10px text-end text-xs">
-                      {value.prePeriodAmount}
-                    </td>
-                    <td className="border border-stroke-brand-secondary-soft p-10px text-center text-xs">
-                      {value.prePeriodPercentage}
-                    </td>
-                  </tr>
-                ))}
+                reportFinancial.details
+                  .slice(0, 15)
+                  .map((value) => <IncomeStatementReportTableRow {...value} />)}
             </tbody>
           </table>
         )}
@@ -607,28 +510,9 @@ const IncomeStatementReportBodyAll = ({ reportId }: IIncomeStatementReportBodyAl
           <tbody>
             {reportFinancial &&
               reportFinancial.details &&
-              reportFinancial.details.slice(15, 28).map((value) => (
-                <tr key={value.code} className="h-40px">
-                  <td className="border border-stroke-brand-secondary-soft p-10px text-xs">
-                    {value.code}
-                  </td>
-                  <td className="w-177px border border-stroke-brand-secondary-soft p-10px text-xs">
-                    {value.name}
-                  </td>
-                  <td className="border border-stroke-brand-secondary-soft p-10px text-end text-xs">
-                    {value.curPeriodAmount}
-                  </td>
-                  <td className="border border-stroke-brand-secondary-soft p-10px text-center text-xs">
-                    {value.curPeriodPercentage}
-                  </td>
-                  <td className="border border-stroke-brand-secondary-soft p-10px text-end text-xs">
-                    {value.prePeriodAmount}
-                  </td>
-                  <td className="border border-stroke-brand-secondary-soft p-10px text-center text-xs">
-                    {value.prePeriodPercentage}
-                  </td>
-                </tr>
-              ))}
+              reportFinancial.details
+                .slice(15, 28)
+                .map((value) => <IncomeStatementReportTableRow {...value} />)}
           </tbody>
         </table>
       </section>
@@ -698,28 +582,9 @@ const IncomeStatementReportBodyAll = ({ reportId }: IIncomeStatementReportBodyAl
           <tbody>
             {reportFinancial &&
               reportFinancial.details &&
-              reportFinancial.details.slice(28, 39).map((value) => (
-                <tr key={value.code} className="h-40px">
-                  <td className="border border-stroke-brand-secondary-soft p-10px text-xs">
-                    {value.code}
-                  </td>
-                  <td className="w-177px border border-stroke-brand-secondary-soft p-10px text-xs">
-                    {value.name}
-                  </td>
-                  <td className="border border-stroke-brand-secondary-soft p-10px text-end text-xs">
-                    {value.curPeriodAmount}
-                  </td>
-                  <td className="border border-stroke-brand-secondary-soft p-10px text-center text-xs">
-                    {value.curPeriodPercentage}
-                  </td>
-                  <td className="border border-stroke-brand-secondary-soft p-10px text-end text-xs">
-                    {value.prePeriodAmount}
-                  </td>
-                  <td className="border border-stroke-brand-secondary-soft p-10px text-center text-xs">
-                    {value.prePeriodPercentage}
-                  </td>
-                </tr>
-              ))}
+              reportFinancial.details
+                .slice(28, 39)
+                .map((value) => <IncomeStatementReportTableRow {...value} />)}
           </tbody>
         </table>
       </section>
@@ -791,28 +656,9 @@ const IncomeStatementReportBodyAll = ({ reportId }: IIncomeStatementReportBodyAl
           <tbody>
             {reportFinancial &&
               reportFinancial.details &&
-              reportFinancial.details.slice(39, 49).map((value) => (
-                <tr key={value.code} className="h-40px">
-                  <td className="border border-stroke-brand-secondary-soft p-10px text-xs">
-                    {value.code}
-                  </td>
-                  <td className="w-177px min-w-177px border border-stroke-brand-secondary-soft p-10px text-xs">
-                    {value.name}
-                  </td>
-                  <td className="border border-stroke-brand-secondary-soft p-10px text-end text-xs">
-                    {value.curPeriodAmount}
-                  </td>
-                  <td className="border border-stroke-brand-secondary-soft p-10px text-center text-xs">
-                    {value.curPeriodPercentage}
-                  </td>
-                  <td className="border border-stroke-brand-secondary-soft p-10px text-end text-xs">
-                    {value.prePeriodAmount}
-                  </td>
-                  <td className="border border-stroke-brand-secondary-soft p-10px text-center text-xs">
-                    {value.prePeriodPercentage}
-                  </td>
-                </tr>
-              ))}
+              reportFinancial.details
+                .slice(39, 49)
+                .map((value) => <IncomeStatementReportTableRow {...value} />)}
           </tbody>
         </table>
       </section>
@@ -882,28 +728,9 @@ const IncomeStatementReportBodyAll = ({ reportId }: IIncomeStatementReportBodyAl
           <tbody>
             {reportFinancial &&
               reportFinancial.details &&
-              reportFinancial.details.slice(49, 58).map((value) => (
-                <tr key={value.code} className="h-40px">
-                  <td className="border border-stroke-brand-secondary-soft p-10px text-xs">
-                    {value.code}
-                  </td>
-                  <td className="w-177px border border-stroke-brand-secondary-soft p-10px text-xs">
-                    {value.name}
-                  </td>
-                  <td className="border border-stroke-brand-secondary-soft p-10px text-end text-xs">
-                    {value.curPeriodAmount}
-                  </td>
-                  <td className="border border-stroke-brand-secondary-soft p-10px text-center text-xs">
-                    {value.curPeriodPercentage}
-                  </td>
-                  <td className="border border-stroke-brand-secondary-soft p-10px text-end text-xs">
-                    {value.prePeriodAmount}
-                  </td>
-                  <td className="border border-stroke-brand-secondary-soft p-10px text-center text-xs">
-                    {value.prePeriodPercentage}
-                  </td>
-                </tr>
-              ))}
+              reportFinancial.details
+                .slice(49, 58)
+                .map((value) => <IncomeStatementReportTableRow {...value} />)}
           </tbody>
           <tbody>
             {reportFinancial &&

diff --git a/src/components/income_statement_report_body/income_statement_report_table_row.tsx b/src/components/income_statement_report_body/income_statement_report_table_row.tsx
@@ -0,0 +1,48 @@
+import { FinancialReportItem } from '@/interfaces/report';
+import { numberBeDashIfFalsy } from '@/lib/utils/common';
+
+function IncomeStatementReportTableRow({
+  code,
+  curPeriodAmount,
+  curPeriodPercentage,
+  prePeriodAmount,
+  prePeriodPercentage,
+  name,
+}: FinancialReportItem) {
+  /**
+   * Info: (20241011 - Murky)
+   * 將Income statement 當中沒有code 的欄位，呈現的數字變成空字串
+   */
+  const isCodeExist = code.length > 0;
+  const idCode = isCodeExist ? code : Math.random().toString(36).slice(0, 4);
+  const displayCode = isCodeExist ? code : '';
+  const displayCurPeriodAmount: string = isCodeExist ? numberBeDashIfFalsy(curPeriodAmount) : '';
+  const displayCurPeriodPercentage: string = isCodeExist
+    ? numberBeDashIfFalsy(curPeriodPercentage)
+    : '';
+  const displayPrePeriodAmount: string = isCodeExist ? numberBeDashIfFalsy(prePeriodAmount) : '';
+  const displayPrePeriodPercentage: string = isCodeExist
+    ? numberBeDashIfFalsy(prePeriodPercentage)
+    : '';
+
+  return (
+    <tr key={idCode} className="h-40px">
+      <td className="border border-stroke-brand-secondary-soft p-10px text-xs">{displayCode}</td>
+      <td className="w-177px border border-stroke-brand-secondary-soft p-10px text-xs">{name}</td>
+      <td className="border border-stroke-brand-secondary-soft p-10px text-end text-xs">
+        {displayCurPeriodAmount}
+      </td>
+      <td className="border border-stroke-brand-secondary-soft p-10px text-center text-xs">
+        {displayCurPeriodPercentage}
+      </td>
+      <td className="border border-stroke-brand-secondary-soft p-10px text-end text-xs">
+        {displayPrePeriodAmount}
+      </td>
+      <td className="border border-stroke-brand-secondary-soft p-10px text-center text-xs">
+        {displayPrePeriodPercentage}
+      </td>
+    </tr>
+  );
+}
+
+export default IncomeStatementReportTableRow;
diff --git a/src/constants/account.ts b/src/constants/account.ts
@@ -306,6 +306,18 @@ export const SPECIAL_ACCOUNTS: {
     rootCode: '3350',
     level: 3,
   },
+  ACCUMULATED_PROFIT_AND_LOSS: {
+    system: 'IFRS',
+    type: AccountType.EQUITY,
+    debit: false,
+    liquidity: false,
+    code: '3351',
+    name: '累積盈虧',
+    forUser: true,
+    parentCode: '3350',
+    rootCode: '3350',
+    level: 3,
+  },
   OTHER_EQUITY_OTHER: {
     system: 'IFRS',
     type: AccountType.EQUITY,

diff --git a/src/interfaces/accounting_account.ts b/src/interfaces/accounting_account.ts
@@ -38,6 +38,7 @@ export interface IAccountForSheetDisplay {
   amount: number | null;
   percentage: number | null;
   indent: number;
+  children: IAccountForSheetDisplay[];
   debit?: boolean;
 }