generate 401 report

CAFECA-IO · Aug 15, 2024 · 3cedcab · 3cedcab
2 parents ca65b06 + 5fa00e0
commit 3cedcab
Show file tree

Hide file tree

Showing 16 changed files with 533 additions and 205 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "iSunFA",
-  "version": "0.8.0+8",
+  "version": "0.8.0+7",
   "private": false,
   "scripts": {
     "dev": "next dev",

diff --git a/src/components/journal_upload_area/journal_upload_area.tsx b/src/components/journal_upload_area/journal_upload_area.tsx
@@ -9,12 +9,20 @@ import { useGlobalCtx } from '@/contexts/global_context';
 import { useAccountingCtx } from '@/contexts/accounting_context';
 import { ProgressStatus } from '@/constants/account';
 import { MessageType } from '@/interfaces/message_modal';
+import { ToastType } from '@/interfaces/toastify';
+import { getTimestampNow } from '@/lib/utils/common';
+
+interface FileInfo {
+  file: File;
+  name: string;
+  size: string;
+}
 
 const JournalUploadArea = () => {
   const { t } = useTranslation('common');
   const { selectedCompany } = useUserCtx();
-  const { setInvoiceIdHandler } = useAccountingCtx();
-  const { messageModalDataHandler, messageModalVisibilityHandler } = useGlobalCtx();
+  const { setInvoiceIdHandler, addOCRHandler } = useAccountingCtx();
+  const { messageModalDataHandler, messageModalVisibilityHandler, toastHandler } = useGlobalCtx();
 
   const {
     trigger: uploadInvoice,
@@ -24,9 +32,9 @@ const JournalUploadArea = () => {
   } = APIHandler<IAccountResultStatus[]>(APIName.OCR_UPLOAD);
 
   // Info: (20240711 - Julian) 上傳的檔案
-  const [uploadFile, setUploadFile] = useState<File | null>(null);
+  const [uploadFile, setUploadFile] = useState<FileInfo | null>(null);
   // Info: (20240711 - Julian) 決定是否顯示 modal 的 flag
-  const [isShowSuccessModal, setIsShowSuccessModal] = useState<boolean>(false);
+  // const [isShowSuccessModal, setIsShowSuccessModal] = useState<boolean>(false);
   // Info: (20240711 - Julian) 拖曳的樣式
   const [isDragOver, setIsDragOver] = useState<boolean>(false);
 
@@ -35,7 +43,12 @@ const JournalUploadArea = () => {
     event.preventDefault();
     const { files } = event.target;
     if (files && files.length > 0) {
-      setUploadFile(files[0]);
+      const file = files[0];
+      setUploadFile({
+        file,
+        name: file.name,
+        size: file.size.toString(),
+      });
     }
   };
   // Info: (20240711 - Julian) 處理拖曳上傳檔案
@@ -50,26 +63,32 @@ const JournalUploadArea = () => {
 
   const handleDrop = (event: React.DragEvent<HTMLDivElement>) => {
     event.preventDefault();
-    const droppedFile = event.dataTransfer.files[0]; // Info: 如果有多個檔案，只取第一個檔案 (20240701 - Shirley)
+    const droppedFile = event.dataTransfer.files[0];
     if (droppedFile) {
-      setUploadFile(droppedFile);
+      setUploadFile({
+        file: droppedFile,
+        name: droppedFile.name,
+        size: droppedFile.size.toString(),
+      });
       setIsDragOver(false);
     }
   };
 
   useEffect(() => {
     if (uploadFile && selectedCompany) {
       const formData = new FormData();
-      formData.append('image', uploadFile);
+      formData.append('image', uploadFile.file);
 
       // Info: (20240711 - Julian) 點擊上傳後才升起 flag
-      setIsShowSuccessModal(true);
+      // setIsShowSuccessModal(true);
+      addOCRHandler(`${getTimestampNow()}`, uploadFile.name, uploadFile.size);
+
       uploadInvoice({ params: { companyId: selectedCompany.id }, body: formData });
     }
   }, [uploadFile]);
 
   useEffect(() => {
-    if (uploadSuccess && results && isShowSuccessModal) {
+    if (uploadSuccess && results) {
       results.forEach((result) => {
         const { resultId } = result;
         /* Info: (20240805 - Anna) 將狀態的翻譯key值存到變數 */
@@ -82,21 +101,31 @@ const JournalUploadArea = () => {
           result.status === ProgressStatus.PAUSED ||
           result.status === ProgressStatus.IN_PROGRESS
         ) {
-          messageModalDataHandler({
-            // title: 'Upload Successful',
-            title: t('JOURNAL.UPLOAD_SUCCESSFUL'),
-            /* Info: (20240805 - Anna) 將上傳狀態替換為翻譯過的 */
-            // content: result.status,
+          toastHandler({
+            id: `uploadInvoice-${result.status}`,
             content: translatedStatus,
-            messageType: MessageType.SUCCESS,
-            submitBtnStr: t('JOURNAL.DONE'),
-            submitBtnFunction: () => {
-              setInvoiceIdHandler(resultId);
-              messageModalVisibilityHandler();
-            },
+            closeable: true,
+            type: ToastType.SUCCESS,
           });
-          messageModalVisibilityHandler();
-          setIsShowSuccessModal(false); // Info: (20240528 - Julian) 顯示完後將 flag 降下
+          setInvoiceIdHandler(resultId);
+          // if (uploadFile) {
+          //   addOCRHandler(resultId, uploadFile.name, uploadFile.size);
+          // }
+          // messageModalDataHandler({
+          //   // title: 'Upload Successful',
+          //   title: t('JOURNAL.UPLOAD_SUCCESSFUL'),
+          //   /* Info: (20240805 - Anna) 將上傳狀態替換為翻譯過的 */
+          //   // content: result.status,
+          //   content: translatedStatus,
+          //   messageType: MessageType.SUCCESS,
+          //   submitBtnStr: t('JOURNAL.DONE'),
+          //   submitBtnFunction: () => {
+          //     setInvoiceIdHandler(resultId);
+          //     messageModalVisibilityHandler();
+          //   },
+          // });
+          // messageModalVisibilityHandler();
+          // setIsShowSuccessModal(false); // Info: (20240528 - Julian) 顯示完後將 flag 降下
         } else {
           // Info: (20240522 - Julian) 顯示上傳失敗的錯誤訊息
           messageModalDataHandler({
@@ -120,7 +149,7 @@ const JournalUploadArea = () => {
       });
       messageModalVisibilityHandler();
     }
-  }, [uploadSuccess, results, isShowSuccessModal]);
+  }, [uploadSuccess, results]);
 
   return (
     <div

diff --git a/src/components/step_one_tab/step_one_tab.tsx b/src/components/step_one_tab/step_one_tab.tsx
@@ -33,7 +33,8 @@ const StepOneTab = () => {
   const { t } = useTranslation('common');
   const { cameraScannerVisibilityHandler, toastHandler } = useGlobalCtx();
   const { selectedCompany } = useUserCtx();
-  const { OCRList, OCRListStatus, updateOCRListHandler, selectOCRHandler } = useAccountingCtx();
+  const { OCRList, OCRListStatus, updateOCRListHandler, selectOCRHandler, deleteOCRHandler } =
+    useAccountingCtx();
   // Info: (20240809 - Shirley) disabled for now , 分頁功能在 alpha release 還沒實作
   // eslint-disable-next-line @typescript-eslint/no-unused-vars
   const [currentFilePage, setCurrentFilePage] = useState<number>(1);
@@ -64,6 +65,9 @@ const StepOneTab = () => {
     if (OCRListStatus.listSuccess) {
       setFileList(OCRList);
     }
+    // TODO: in dev (20240814 - Shirley)
+    // eslint-disable-next-line no-console
+    console.log('OCRList in StepOneTab:', OCRList);
 
     return () => {};
   }, [OCRList, OCRListStatus]);
@@ -114,6 +118,7 @@ const StepOneTab = () => {
         closeable: true,
       });
     } else if (success) {
+      deleteOCRHandler(aichResultId);
       toastHandler({
         id: `deleteUnprocessedOCR-${code}`,
         /* Info: (20240805 - Anna) 將上傳憑證的吐司通知翻譯 */
@@ -155,6 +160,7 @@ const StepOneTab = () => {
       pauseHandler={fileItemPauseHandler}
       deleteHandler={fileItemDeleteHandler}
       clickHandler={handleOCRClick}
+      isPending={data.status === ProgressStatus.WAITING_FOR_UPLOAD}
     />
   ));
 

diff --git a/src/components/tax_report_body_all/tax_report_body_all.tsx b/src/components/tax_report_body_all/tax_report_body_all.tsx
@@ -22,7 +22,11 @@ const TaxReportBodyAll = ({ reportId }: ITaxReportBodyAllProps) => {
   useEffect(() => {
     const fetchReport = async () => {
       if (selectedCompany) {
-        const reportData = await generate401Report(selectedCompany.id, Date.now() / 1000);
+         const reportData = await generate401Report(
+           selectedCompany.id,
+           Date.now() / 1000,
+           Date.now() / 1000
+         );
         // eslint-disable-next-line no-console
         // console.log('Fetched report401 data:', reportData);
         setReport401(reportData);
@@ -121,8 +125,7 @@ const TaxReportBodyAll = ({ reportId }: ITaxReportBodyAllProps) => {
           <p className="text-xs">(一般稅額計算-專營應稅營業人使用)</p>
           <div className="flex justify-between text-xs">
             <p className="flex-1 text-center">
-              所屬年月份:{report401?.basicInfo.currentYear || 'N/A'}年
-              {report401?.basicInfo.currentMonth || 'N/A'}月
+              所屬年月份:{report401?.basicInfo.currentYear || 'N/A'}年 月
             </p>
             <p className="text-right">金額單位:新臺幣元</p>
           </div>
@@ -221,7 +224,6 @@ const TaxReportBodyAll = ({ reportId }: ITaxReportBodyAllProps) => {
             </td>
             <td className="border border-black px-2 py-0">1</td>
             <td className="border border-black px-2 py-0">
-              {report401?.sales.breakdown.triplicateAndElectronic.amount || 'N/A'}
             </td>
             <td className="border border-black px-2 py-0">2</td>
             <td className="border border-black px-2 py-0">
@@ -241,7 +243,6 @@ const TaxReportBodyAll = ({ reportId }: ITaxReportBodyAllProps) => {
             </td>
             <td className="border border-black px-2 py-0">5</td>
             <td className="border border-black px-2 py-0">
-              {report401?.sales.breakdown.cashRegisterTriplicate.amount || 'N/A'}
             </td>
             <td className="border border-black px-2 py-0">6</td>
             <td className="border border-black px-2 py-0">
@@ -260,7 +261,6 @@ const TaxReportBodyAll = ({ reportId }: ITaxReportBodyAllProps) => {
             </td>
             <td className="border border-black px-2 py-0">9</td>
             <td className="border border-black px-2 py-0">
-              {report401?.sales.breakdown.duplicateAndCashRegister.amount || 'N/A'}
             </td>
             <td className="border border-black px-2 py-0">10</td>
             <td className="border border-black px-2 py-0">
@@ -280,11 +280,9 @@ const TaxReportBodyAll = ({ reportId }: ITaxReportBodyAllProps) => {
             </td>
             <td className="border border-black px-2 py-0">13</td>
             <td className="border border-black px-2 py-0">
-              {report401?.sales.breakdown.taxExempt.amount || 'N/A'}
             </td>
             <td className="border border-black px-2 py-0">14</td>
             <td className="border border-black px-2 py-0">
-              {report401?.sales.breakdown.taxExempt.tax || 'N/A'}
             </td>
             <td className="border border-black px-2 py-0">15</td>
             <td className="border border-black px-2 py-0"></td>
@@ -299,7 +297,6 @@ const TaxReportBodyAll = ({ reportId }: ITaxReportBodyAllProps) => {
             </td>
             <td className="border border-black px-2 py-0">17</td>
             <td className="border border-black px-2 py-0">
-              {report401?.sales.breakdown.returnsAndAllowances.amount || 'N/A'}
             </td>
             <td className="border border-black px-2 py-0">18</td>
             <td className="border border-black px-2 py-0">
@@ -318,7 +315,6 @@ const TaxReportBodyAll = ({ reportId }: ITaxReportBodyAllProps) => {
             </td>
             <td className="border border-black px-2 py-0">21①</td>
             <td className="border border-black px-2 py-0">
-              {report401?.sales.breakdown.total.amount || 'N/A'}
             </td>
             <td className="border border-black px-2 py-0">22②</td>
             <td className="border border-black px-2 py-0">

diff --git a/src/components/uploaded_file_item/uploaded_file_item.tsx b/src/components/uploaded_file_item/uploaded_file_item.tsx
@@ -5,19 +5,22 @@ import { ProgressStatus } from '@/constants/account';
 import { useTranslation } from 'next-i18next';
 import { useState } from 'react';
 import { Button } from '@/components/button/button';
+import Skeleton from '@/components/skeleton/skeleton';
 
 interface IUploadedFileItemProps {
   itemData: IOCR;
   pauseHandler: (id: number) => void;
   deleteHandler: (aichResultId: string) => void;
   clickHandler: (unprocessedJournal: IOCR) => void;
+  isPending?: boolean;
 }
 
 const UploadedFileItem = ({
   itemData,
   pauseHandler,
   deleteHandler,
   clickHandler,
+  isPending = false,
 }: IUploadedFileItemProps) => {
   const { t } = useTranslation('common');
   const { id, aichResultId, imageName, imageUrl, imageSize, progress, status } = itemData;
@@ -70,7 +73,31 @@ const UploadedFileItem = ({
   // const displayedProgress = progress === 100 ? 'Completed' : `${progress}%`;
   const displayedProgress = progress === 100 ? t('PROJECT.COMPLETED') : `${progress}%`;
 
-  return (
+  const displayedFileItem = isPending ? (
+    <div
+      className={`relative inline-flex w-90vw flex-col gap-10px rounded-sm border border-file-uploading-stroke-outline bg-white p-5 hover:cursor-pointer hover:border-slider-surface-bar disabled:hover:border-file-uploading-stroke-outline md:w-full`}
+    >
+      <div className="relative inline-flex w-full items-center gap-20px">
+        <Skeleton width={56} height={56} /> {/* Info: 掃描動畫 (20240814 - Shirley) */}
+        <Skeleton width={64} height={64} /> {/* Info: 文件縮略圖 (20240814 - Shirley) */}
+        <div className="flex shrink grow flex-col items-start">
+          <Skeleton width={100} height={24} /> {/* Info: 文件名 (20240814 - Shirley) */}
+          <Skeleton width={50} height={16} /> {/* Info: 文件大小 (20240814 - Shirley) */}
+        </div>
+        <div className="absolute right-0 z-10 flex items-center gap-10px">
+          <Skeleton width={20} height={20} /> {/* Info: 狀態圖標 (20240814 - Shirley) */}
+          <Skeleton width={20} height={20} /> {/* Info: 刪除按鈕 (20240814 - Shirley) */}
+        </div>
+      </div>
+      <div className="inline-flex w-full items-center gap-16px">
+        <Skeleton width={150} height={20} /> {/* Info: AI 識別文字 (20240814 - Shirley) */}
+        <div className="relative h-5px flex-1 rounded-full">
+          <Skeleton width={100} height={5} /> {/* Info: 進度條 (20240814 - Shirley) */}
+        </div>
+        <Skeleton width={40} height={16} /> {/* Info: 進度百分比 (20240814 - Shirley) */}
+      </div>
+    </div>
+  ) : (
     <div
       // Info: (20240523 - Julian) 達成 100% 後，點擊將 invoiceId 寫入 context
       onClick={itemClickHandler}
@@ -125,6 +152,8 @@ const UploadedFileItem = ({
       </div>
     </div>
   );
+
+  return <div className="w-full">{displayedFileItem}</div>;
 };
 
 export default UploadedFileItem;
diff --git a/src/constants/account.ts b/src/constants/account.ts
@@ -10,6 +10,7 @@ export enum ProgressStatus {
   SYSTEM_ERROR = 'systemError',
   PAUSED = 'paused',
   HAS_BEEN_USED = 'hasBeenUsed',
+  WAITING_FOR_UPLOAD = 'waitingForUpload',
 }
 
 export enum EventType {
@@ -18,27 +19,6 @@ export enum EventType {
   TRANSFER = 'transfer',
 }
 
-export enum InvoiceType {
-  PURCHASE_TRIPLICATE_AND_ELECTRONIC = 'PurchaseTriplicateAndElectronic', // 進項三聯式、電子計算機統一發票
-  PURCHASE_DUPLICATE_CASH_REGISTER_AND_OTHER = 'PurchaseDuplicateCashRegisterAndOther', // 進項二聯式收銀機統一發票、載有稅額之其他憑證
-  PURCHASE_RETURNS_TRIPLICATE_AND_ELECTRONIC = 'PurchaseReturnsTriplicateAndElectronic', // 三聯式、電子計算機、三聯式收銀機統一發票及一般稅額計算之電子發票之進貨退出或折讓證明單
-  PURCHASE_RETURNS_DUPLICATE_CASH_REGISTER_AND_OTHER = 'PurchaseReturnsDuplicateCashRegisterAndOther', // 二聯式收銀機統一發票及載有稅額之其他憑證之進貨退出或折讓證明單
-  PURCHASE_TRIPLICATE_CASH_REGISTER_AND_ELECTRONIC = 'PurchaseTriplicateCashRegisterAndElectronic', // 進項三聯式收銀機統一發票及一般稅額計算之電子發票，每張稅額五百元以下之進項三聯式收銀機統一發票及一般稅額計算之電子發票
-  PURCHASE_UTILITY_ELECTRONIC_INVOICE = 'PurchaseUtilityElectronicInvoice', // 進項公用事業電子發票字軌號碼得以公用事業產製抬頭為一百零五年一月以後已繳納之繳費通知單或已繳費憑證之載具流水號替代登錄
-  PURCHASE_SUMMARIZED_TRIPLICATE_AND_ELECTRONIC = 'PurchaseSummarizedTriplicateAndElectronic', // 彙總登錄每張稅額五百元以下之進項三聯式、電子計算機統一發票
-  PURCHASE_SUMMARIZED_DUPLICATE_CASH_REGISTER_AND_OTHER = 'PurchaseSummarizedDuplicateCashRegisterAndOther', // 彙總登錄每張稅額五百元以下之進項二聯式收銀機統一發票、載有稅額之其他憑證
-  PURCHASE_CUSTOMS_DUTY_PAYMENT = 'PurchaseCustomsDutyPayment', // 進項海關代徵營業稅繳納證
-  PURCHASE_CUSTOMS_DUTY_REFUND = 'PurchaseCustomsDutyRefund', // 進項海關退還溢繳營業稅申報單
-  SALES_TRIPLICATE_INVOICE = 'SalesTriplicateInvoice', // 銷項三聯式統一發票
-  SALES_DUPLICATE_CASH_REGISTER_INVOICE = 'SalesDuplicateCashRegisterInvoice', // 銷項二聯式、二聯式收銀機統一發票
-  SALES_RETURNS_TRIPLICATE_AND_ELECTRONIC = 'SalesReturnsTriplicateAndElectronic', // 三聯式、電子計算機、三聯式收銀機統一發票及一般稅額計算之電子發票之銷貨退回或折讓證明單
-  SALES_RETURNS_DUPLICATE_AND_NON_UNIFORM = 'SalesReturnsDuplicateAndNonUniform', // 二聯式、二聯式收銀機統一發票及銷項免用統一發票之銷貨退回或折讓證明單
-  SALES_TRIPLICATE_CASH_REGISTER_AND_ELECTRONIC = 'SalesTriplicateCashRegisterAndElectronic', // 銷項三聯式收銀機統一發票及一般稅額計算之電子發票
-  SALES_NON_UNIFORM_INVOICE = 'SalesNonUniformInvoice', // 銷項免用統一發票
-  SPECIAL_TAX_CALCULATION = 'SpecialTaxCalculation', // 銷項憑證、特種稅額計算之電子發票
-  SPECIAL_TAX_RETURNS = 'SpecialTaxReturns', // 銷貨退回或折讓證明單
-}
-
 export enum AccountType {
   ASSET = 'asset',
   LIABILITY = 'liability',
@@ -373,6 +353,18 @@ export const SPECIAL_ACCOUNTS: {
     rootCode: '3XXX',
     level: 0,
   },
+  FIXED_ASSET: {
+    system: 'IFRS',
+    type: AccountType.ASSET,
+    debit: true,
+    liquidity: false,
+    code: '1600',
+    name: '不動產、廠房及設備',
+    forUser: false,
+    parentCode: '15XX',
+    rootCode: '1600',
+    level: 2,
+  },
   LIABILITY_AND_EQUITY_TOTAL: {
     system: 'IFRS',
     type: AccountType.LIABILITY,