feat(WEB): 회계 폼 useDevFill 훅 추가 및 출금 필드 편집 가능하게 변경

- DepositDetailClientV2: 입금 폼 자동채우기 훅 추가
- WithdrawalDetailClientV2: 출금 폼 자동채우기 훅 추가
- withdrawalDetailConfig: 출금일, 출금계좌, 수취인명, 출금금액 편집 가능하게 변경
- DocumentCreate: 매입(지출결의서) 폼 자동채우기 훅 추가

src/components/accounting/DepositManagement/DepositDetailClientV2.tsx

@@ -13,6 +13,7 @@ import {
   updateDeposit,
   deleteDeposit,
 } from './actions';
+import { useDevFill, generateDepositData } from '@/components/dev';
 
 // ===== Props =====
 interface DepositDetailClientV2Props {
@@ -29,6 +30,15 @@ export default function DepositDetailClientV2({
   const [deposit, setDeposit] = useState<DepositRecord | null>(null);
   const [isLoading, setIsLoading] = useState(initialMode !== 'create');
 
+  // ===== DevFill: 자동 입력 기능 =====
+  useDevFill('deposit', useCallback(() => {
+    if (initialMode === 'create') {
+      const mockData = generateDepositData();
+      setDeposit(mockData as unknown as DepositRecord);
+      toast.success('입금 데이터가 자동 입력되었습니다.');
+    }
+  }, [initialMode]));
+
   // ===== 데이터 로드 =====
   useEffect(() => {
     const loadDeposit = async () => {

src/components/accounting/WithdrawalManagement/WithdrawalDetailClientV2.tsx

@@ -13,6 +13,7 @@ import {
   updateWithdrawal,
   deleteWithdrawal,
 } from './actions';
+import { useDevFill, generateWithdrawalData } from '@/components/dev';
 
 // ===== Props =====
 interface WithdrawalDetailClientV2Props {
@@ -29,6 +30,15 @@ export default function WithdrawalDetailClientV2({
   const [withdrawal, setWithdrawal] = useState<WithdrawalRecord | null>(null);
   const [isLoading, setIsLoading] = useState(initialMode !== 'create');
 
+  // ===== DevFill: 자동 입력 기능 =====
+  useDevFill('withdrawal', useCallback(() => {
+    if (initialMode === 'create') {
+      const mockData = generateWithdrawalData();
+      setWithdrawal(mockData as unknown as WithdrawalRecord);
+      toast.success('출금 데이터가 자동 입력되었습니다.');
+    }
+  }, [initialMode]));
+
   // ===== 데이터 로드 =====
   useEffect(() => {
     const loadWithdrawal = async () => {

src/components/accounting/WithdrawalManagement/withdrawalDetailConfig.ts

@@ -6,37 +6,37 @@ import { getVendors } from './actions';
 
 // ===== 필드 정의 =====
 const fields: FieldDefinition[] = [
-  // 출금일 (readonly)
+  // 출금일
   {
     key: 'withdrawalDate',
     label: '출금일',
-    type: 'text',
-    readonly: true,
-    placeholder: '-',
+    type: 'date',
+    placeholder: '출금일을 선택해주세요',
+    disabled: (mode) => mode === 'view',
   },
-  // 출금계좌 (readonly)
+  // 출금계좌
   {
     key: 'accountName',
     label: '출금계좌',
     type: 'text',
-    readonly: true,
-    placeholder: '-',
+    placeholder: '출금계좌를 입력해주세요',
+    disabled: (mode) => mode === 'view',
   },
-  // 수취인명 (readonly)
+  // 수취인명
   {
     key: 'recipientName',
     label: '수취인명',
     type: 'text',
-    readonly: true,
-    placeholder: '-',
+    placeholder: '수취인명을 입력해주세요',
+    disabled: (mode) => mode === 'view',
   },
-  // 출금금액 (readonly)
+  // 출금금액
   {
     key: 'withdrawalAmount',
     label: '출금금액',
-    type: 'text',
-    readonly: true,
-    placeholder: '-',
+    type: 'number',
+    placeholder: '출금금액을 입력해주세요',
+    disabled: (mode) => mode === 'view',
   },
   // 적요 (editable)
   {
@@ -115,6 +115,12 @@ export const withdrawalDetailConfig: DetailConfig = {
   },
   transformSubmitData: (formData: Record<string, unknown>): Partial<WithdrawalRecord> => {
     return {
+      withdrawalDate: formData.withdrawalDate as string,
+      accountName: formData.accountName as string,
+      recipientName: formData.recipientName as string,
+      withdrawalAmount: typeof formData.withdrawalAmount === 'string'
+        ? parseInt(formData.withdrawalAmount.replace(/,/g, ''), 10)
+        : formData.withdrawalAmount as number,
       note: formData.note as string,
       vendorId: formData.vendorId as string,
       withdrawalType: formData.withdrawalType as WithdrawalRecord['withdrawalType'],

src/components/approval/DocumentCreate/index.tsx

@@ -42,6 +42,7 @@ import type {
   ExpenseEstimateData,
 } from './types';
 import { isNextRedirectError } from '@/lib/utils/redirect-error';
+import { useDevFill, generatePurchaseApprovalData } from '@/components/dev';
 
 // 초기 데이터 - SSR에서는 빈 문자열, 클라이언트에서 날짜 설정
 const getInitialBasicInfo = (): BasicInfo => ({
@@ -119,6 +120,23 @@ export function DocumentCreate() {
   // 미리보기 모달 상태
   const [isPreviewOpen, setIsPreviewOpen] = useState(false);
 
+  // ===== DevFill: 자동 입력 기능 =====
+  useDevFill('purchaseApproval', useCallback(() => {
+    if (!isEditMode && !isCopyMode) {
+      const mockData = generatePurchaseApprovalData();
+      setBasicInfo(prev => ({
+        ...prev,
+        ...mockData.basicInfo,
+        draftDate: prev.draftDate || mockData.basicInfo.draftDate,
+      }));
+      setProposalData(prev => ({
+        ...prev,
+        ...mockData.proposalData,
+      }));
+      toast.success('지출결의서 데이터가 자동 입력되었습니다.');
+    }
+  }, [isEditMode, isCopyMode]));
+
   // 수정 모드: 문서 로드
   useEffect(() => {
     if (!isEditMode || !documentId) return;