수기발행 / 현금영수증 용도변경

src/entities/transaction/ui/cash-receipt-hand-written-issuance-step2.tsx

@@ -1,15 +1,37 @@
+import { ChangeEvent } from 'react';
 import { useSetOnBack } from '@/widgets/sub-layout/use-sub-layout';
 import { ProcessStep } from '../model/types';
 
 export interface CashReceiptHandWrittenIssuanceStep2Props {
-  setProcessStep: ((processStep: ProcessStep) => void);
+  setProcessStep: (processStep: ProcessStep) => void;
+  supplyAmount: number | string;
+  vatAmount: number | string;
+  taxFreeAmount: number | string;
+  serviceCharge: number | string;
+  setSupplyAmount: (supplyAmount: number | string) => void;
+  setVatAmount: (vatAmount: number | string) => void;
+  setTaxFreeAmount: (taxFreeAmount: number | string) => void;
+  setServiceCharge: (serviceCharge: number | string) => void;
 };
 export const CashReceiptHandWrittenIssuanceStep2 = ({
-  setProcessStep
+  setProcessStep,
+  supplyAmount,
+  vatAmount,
+  taxFreeAmount,
+  serviceCharge,
+  setSupplyAmount,
+  setVatAmount,
+  setTaxFreeAmount,
+  setServiceCharge
 }: CashReceiptHandWrittenIssuanceStep2Props) => {
   useSetOnBack(() => {
     setProcessStep(ProcessStep.One);
   });
+
+  const onClickToVatCalculate = () => {
+
+  };
+
   return (
     <>
       <h2 className="issue-title">발행 금액 입력</h2>
@@ -27,6 +49,7 @@ export const CashReceiptHandWrittenIssuanceStep2 = ({
               <button
                 className="btn-40 btn-white"
                 type="button"
+                onClick={ () => onClickToVatCalculate() }
               >VAT자동계산</button>
             </div>
           </div>
@@ -39,6 +62,8 @@ export const CashReceiptHandWrittenIssuanceStep2 = ({
               className="error"
               type="text"
               placeholder=""
+              value={ supplyAmount }
+              onChange={ (e: ChangeEvent<HTMLInputElement>) => setSupplyAmount(e.target.value) }
             />
           </div>
         </div>
@@ -49,26 +74,32 @@ export const CashReceiptHandWrittenIssuanceStep2 = ({
               className="error"
               type="text"
               placeholder=""
+              value={ vatAmount }
+              onChange={ (e: ChangeEvent<HTMLInputElement>) => setVatAmount(e.target.value) }
             />
           </div>
         </div>
         <div className="issue-row">
-          <div className="issue-label">발행번호</div>
+          <div className="issue-label">면세금액</div>
           <div className="issue-field">
             <input
               className="error"
               type="text"
               placeholder=""
+              value={ taxFreeAmount }
+              onChange={ (e: ChangeEvent<HTMLInputElement>) => setTaxFreeAmount(e.target.value) }
             />
           </div>
         </div>
         <div className="issue-row">
-          <div className="issue-label">이메일 주소</div>
+          <div className="issue-label">봉사료</div>
           <div className="issue-field">
             <input
-              type="email"
               className="error"
+              type="text"
               placeholder=""
+              value={ serviceCharge }
+              onChange={ (e: ChangeEvent<HTMLInputElement>) => setServiceCharge(e.target.value) }
             />
           </div>
         </div>