1
src/
2
├── pages/accounting/          # 记账页面
3
│   ├── index.vue             # 记账主页
4
│   └── components/           # 记账页面组件
5
├── components/Keyboard/      # 键盘组件
6
│   ├── Keyboard.vue          # 主键盘
7
│   ├── BattleKeyboard.vue    # 战斗键盘
8
│   └── TransferKeyboard.vue  # 转账键盘
9
├── store/accounting.ts       # 记账状态管理
10
├── store/accountingCategory.ts # 记账分类状态
11
├── services/api/accounting.ts # 记账API服务
12
├── services/api/category.ts   # 分类API服务
13
├── utils/savingCalculator.ts  # 储蓄计算器
14
├── types/accounting.ts        # 记账类型定义
15
└── types/accountingCategoryModel.ts # 分类模型

1
// 记账类型枚举
2
const AccountingType = {
3
  INCOME: 'income',       // 收入
4
  EXPENSE: 'expense',     // 支出
5
  TRANSFER: 'transfer'    // 转账
6
} as const
7

8
type AccountingType = typeof AccountingType[keyof typeof AccountingType]

1
// 记账记录接口
2
interface AccountingRecord {
3
  id: string;                    // 记录ID
4
  type: AccountingType;         // 记账类型
5
  amountCents: number;          // 金额（分）
6
  categoryCode: string;         // 分类代码
7
  assetId: string;              // 资产ID
8
  targetAssetId?: string;       // 目标资产ID（转账时使用）
9
  remark?: string;              // 备注
10
  date: number;                 // 记账日期
11
  shouldCountAmortization?: boolean; // 是否计入摊销
12
  createdAt: number;            // 创建时间
13
  updatedAt: number;            // 更新时间
14
}
15

16
// 记账表单数据
17
interface AccountingFormData {
18
  type: AccountingType;
19
  amount: string;               // 金额字符串
20
  categoryCode: string;
21
  assetId: string;
22
  targetAssetId?: string;
23
  remark: string;
24
  date: Date;
25
  shouldCountAmortization: boolean;
26
}

1
// 创建记账记录
2
async function createAccountingRecord(data: AccountingFormData): Promise<AccountingRecord> {
3
  // 验证表单数据
4
  const validation = validateAccountingForm(data)
5
  if (!validation.isValid) {
6
    throw new Error(validation.errors.join(', '))
7
  }
8

9
  // 转换数据格式
10
  const recordData: Omit<AccountingRecord, 'id' | 'createdAt' | 'updatedAt'> = {
11
    type: data.type,
12
    amountCents: parseFloat(data.amount) * 100,
13
    categoryCode: data.categoryCode,
14
    assetId: data.assetId,
15
    targetAssetId: data.targetAssetId,
16
    remark: data.remark,
17
    date: data.date.getTime(),
18
    shouldCountAmortization: data.shouldCountAmortization
19
  }
20

21
  // 发送请求
22
  const response = await accountingApi.createRecord(recordData)
23
  if (response.code === 200) {
24
    return response.data
25
  }
26
  throw new Error(response.message)
27
}
28

29
// 表单验证
30
function validateAccountingForm(data: AccountingFormData): ValidationResult {
31
  const errors: string[] = []
32

33
  if (!data.amount || parseFloat(data.amount) <= 0) {
34
    errors.push('金额必须大于0')
35
  }
36

37
  if (!data.categoryCode) {
38
    errors.push('请选择分类')
39
  }
40

41
  if (!data.assetId) {
42
    errors.push('请选择资产账户')
43
  }
44

45
  if (data.type === AccountingType.TRANSFER && !data.targetAssetId) {
46
    errors.push('转账必须选择目标账户')
47
  }
48

49
  if (data.type === AccountingType.TRANSFER && data.assetId === data.targetAssetId) {
50
    errors.push('转出和转入账户不能相同')
51
  }
52

53
  return {
54
    isValid: errors.length === 0,
55
    errors
56
  }
57
}

1
// 分类推荐接口
2
interface CategoryRecommendation {
3
  categoryCode: string;
4
  categoryName: string;
5
  confidence: number;        // 推荐置信度 0-1
6
  reason: string;           // 推荐原因
7
}
8

9
// 获取分类推荐
10
async function getCategoryRecommendations(
11
  type: AccountingType,
12
  amount: number
13
): Promise<CategoryRecommendation[]> {
14
  const response = await categoryApi.getRecommendations({
15
    type,
16
    amount,
17
    userId: getCurrentUserId()
18
  })
19

20
  return response.data.recommendations
21
}
22

23
// 计算分类使用频率
24
function calculateCategoryFrequency(
25
  records: AccountingRecord[],
26
  type: AccountingType
27
): Map<string, number> {
28
  const frequency = new Map<string, number>()
29

30
  records
31
    .filter(record => record.type === type)
32
    .forEach(record => {
33
      const count = frequency.get(record.categoryCode) || 0
34
      frequency.set(record.categoryCode, count + 1)
35
    })
36

37
  return frequency
38
}

1
// 批量操作请求
2
interface BatchOperationRequest {
3
  action: 'create' | 'update' | 'delete';
4
  records: AccountingRecord[];
5
}
6

7
// 批量创建记录
8
async function batchCreateRecords(records: Omit<AccountingRecord, 'id'>[]): Promise<BatchOperationResult> {
9
  const results: BatchOperationResult = {
10
    success: [],
11
    failed: []
12
  }
13

14
  for (const record of records) {
15
    try {
16
      const createdRecord = await createAccountingRecord(record)
17
      results.success.push(createdRecord)
18
    } catch (error) {
19
      results.failed.push({
20
        record,
21
        error: error.message
22
      })
23
    }
24
  }
25

26
  return results
27
}
28

29
// 批量删除记录
30
async function batchDeleteRecords(recordIds: string[]): Promise<BatchOperationResult> {
31
  const results: BatchOperationResult = {
32
    success: [],
33
    failed: []
34
  }
35

36
  for (const id of recordIds) {
37
    try {
38
      await accountingApi.deleteRecord(id)
39
      results.success.push({ id })
40
    } catch (error) {
41
      results.failed.push({
42
        record: { id },
43
        error: error.message
44
      })
45
    }
46
  }
47

48
  return results
49
}

1
// 离线记账管理
2
export const offlineAccountingManager = {
3
  // 检查网络状态
4
  isOnline(): boolean {
5
    return uni.getNetworkType().then(res => res.networkType !== 'none')
6
  },
7

8
  // 保存离线记录
9
  async saveOfflineRecord(record: AccountingFormData): Promise<void> {
10
    const offlineRecords = await this.getOfflineRecords()
11
    offlineRecords.push({
12
      ...record,
13
      id: 'offline_' + Date.now(),
14
      isOffline: true
15
    })
16
    await uni.setStorageSync('offline_accounting_records', offlineRecords)
17
  },
18

19
  // 获取离线记录
20
  async getOfflineRecords(): Promise<AccountingFormData[]> {
21
    return uni.getStorageSync('offline_accounting_records') || []
22
  },
23

24
  // 同步离线记录
25
  async syncOfflineRecords(): Promise<void> {
26
    const offlineRecords = await this.getOfflineRecords()
27
    const syncResults = await batchCreateRecords(offlineRecords)
28

29
    // 清除已同步的记录
30
    const remainingRecords = offlineRecords.filter(record =>
31
      !syncResults.success.some(success => success.id === record.id)
32
    )
33

34
    await uni.setStorageSync('offline_accounting_records', remainingRecords)
35
  }
36
}

1
<template>
2
  <view class="keyboard-container">
3
    <!-- 操作栏 -->
4
    <view class="action-bar">
5
      <view class="action-button" :class="{ active: shouldCountAmortization }" @click="toggleAmortization">
6
        <Iconify icon="i-mdi-check-bold" size="14" />
7
        <text>计入成本</text>
8
      </view>
9
      <view class="action-button asset-button" @click="openAssetSelector">
10
        <Iconify icon="i-mdi-wallet" size="14" />
11
        <text>{{ getAssetDisplayName(selectedAssetId) }}</text>
12
      </view>
13
    </view>
14

15
    <!-- 金额显示 -->
16
    <view class="display">
17
      <view class="record-type" @click="toggleRecordType">
18
        <view :class="{ active: !isIncome }">支出</view>
19
        <view class="type-split">/</view>
20
        <view :class="{ active: isIncome }">收入</view>
21
      </view>
22
      <view class="result">{{ amountValue || '0' }}</view>
23
    </view>
24

25
    <!-- 数字键盘 -->
26
    <view class="keyboard">
27
      <view class="row" v-for="(row, rowIndex) in keyboardRows" :key="rowIndex">
28
        <view
29
          v-for="key in row"
30
          :key="key"
31
          class="key"
32
          :class="getKeyClass(key)"
33
          @click="handleKeyPress(key)"
34
        >
35
          {{ key }}
36
        </view>
37
      </view>
38
    </view>
39

40
    <!-- 分类选择 -->
41
    <view class="category-row">
42
      <view class="category-key" @click="openCategorySelector">
43
        <Iconify :icon="getCategoryIcon(selectedCategoryCode)" size="16" />
44
        <text>{{ getCategoryName(selectedCategoryCode) }}</text>
45
      </view>
46
      <view class="remark-key">
47
        <input v-model="remark" placeholder="添加备注..." />
48
      </view>
49
    </view>
50

51
    <!-- 日期选择 -->
52
    <view class="date-row">
53
      <view class="date-key" @click="openDateSelector">
54
        <Iconify icon="i-mdi-calendar" size="16" />
55
        <text>{{ formatDate(selectedDate) }}</text>
56
      </view>
57
      <view class="confirm-key" @click="confirmRecord">
58
        <text>确定</text>
59
      </view>
60
    </view>
61
  </view>
62
</template>
63

64
<script setup lang="ts">
65
interface Props {
66
  initialType?: AccountingType;
67
  initialAmount?: string;
68
  initialCategory?: string;
69
  initialAsset?: string;
70
}
71

72
interface Emits {
73
  confirm: [data: AccountingFormData];
74
  cancel: [];
75
}
76

77
const props = withDefaults(defineProps<Props>(), {
78
  initialType: AccountingType.EXPENSE
79
})
80

81
const emit = defineEmits<Emits>()
82

83
// 响应式数据
84
const isIncome = ref(props.initialType === AccountingType.INCOME)
85
const amountValue = ref(props.initialAmount || '')
86
const selectedCategoryCode = ref(props.initialCategory || '')
87
const selectedAssetId = ref(props.initialAsset || '')
88
const remark = ref('')
89
const selectedDate = ref(new Date())
90
const shouldCountAmortization = ref(false)
91

92
// 键盘布局
93
const keyboardRows = [
94
  ['7', '8', '9'],
95
  ['4', '5', '6'],
96
  ['1', '2', '3'],
97
  ['0', '.', '⌫']
98
]
99

100
// 处理按键
101
function handleKeyPress(key: string) {
102
  if (key === '⌫') {
103
    amountValue.value = amountValue.value.slice(0, -1)
104
  } else if (key === '.') {
105
    if (!amountValue.value.includes('.')) {
106
      amountValue.value += '.'
107
    }
108
  } else {
109
    amountValue.value += key
110
  }
111
}
112

113
// 切换记账类型
114
function toggleRecordType() {
115
  isIncome.value = !isIncome.value
116
}
117

118
// 确认记录
119
function confirmRecord() {
120
  const formData: AccountingFormData = {
121
    type: isIncome.value ? AccountingType.INCOME : AccountingType.EXPENSE,
122
    amount: amountValue.value,
123
    categoryCode: selectedCategoryCode.value,
124
    assetId: selectedAssetId.value,
125
    remark: remark.value,
126
    date: selectedDate.value,
127
    shouldCountAmortization: shouldCountAmortization.value
128
  }
129

130
  emit('confirm', formData)
131
}
132
</script>

1
<template>
2
  <view class="transfer-keyboard">
3
    <!-- 转账信息显示 -->
4
    <view class="transfer-info">
5
      <view class="from-asset">
6
        <text class="label">从</text>
7
        <view class="asset-info" @click="selectFromAsset">
8
          <Iconify :icon="getAssetIcon(fromAssetId)" size="20" />
9
          <text>{{ getAssetName(fromAssetId) }}</text>
10
        </view>
11
      </view>
12

13
      <view class="transfer-arrow">
14
        <Iconify icon="i-mdi-arrow-right" size="24" />
15
      </view>
16

17
      <view class="to-asset">
18
        <text class="label">到</text>
19
        <view class="asset-info" @click="selectToAsset">
20
          <Iconify :icon="getAssetIcon(toAssetId)" size="20" />
21
          <text>{{ getAssetName(toAssetId) }}</text>
22
        </view>
23
      </view>
24
    </view>
25

26
    <!-- 金额输入 -->
27
    <view class="amount-display">
28
      <text class="amount">{{ amountValue || '0' }}</text>
29
      <text class="currency">元</text>
30
    </view>
31

32
    <!-- 数字键盘 -->
33
    <view class="keyboard">
34
      <!-- 键盘行 -->
35
    </view>
36

37
    <!-- 操作按钮 -->
38
    <view class="actions">
39
      <button class="btn-secondary" @click="handleCancel">取消</button>
40
      <button class="btn-primary" @click="confirmTransfer">确认转账</button>
41
    </view>
42
  </view>
43
</template>
44

45
<script setup lang="ts">
46
interface Emits {
47
  confirm: [data: TransferFormData];
48
  cancel: [];
49
}
50

51
const emit = defineEmits<Emits>()
52

53
const fromAssetId = ref('')
54
const toAssetId = ref('')
55
const amountValue = ref('')
56
const remark = ref('')
57

58
// 确认转账
59
function confirmTransfer() {
60
  const formData: TransferFormData = {
61
    fromAssetId: fromAssetId.value,
62
    toAssetId: toAssetId.value,
63
    amount: amountValue.value,
64
    remark: remark.value,
65
    date: new Date()
66
  }
67

68
  emit('confirm', formData)
69
}
70
</script>

1
// 分类接口
2
interface AccountingCategory {
3
  code: string;              // 分类代码
4
  name: string;             // 分类名称
5
  type: AccountingType;      // 分类类型
6
  parentCode?: string;      // 父分类代码
7
  icon: string;             // 分类图标
8
  color: string;            // 分类颜色
9
  isDefault: boolean;       // 是否默认分类
10
  isActive: boolean;        // 是否激活
11
  sortOrder: number;        // 排序
12
}
13

14
// 分类树结构
15
interface CategoryTree {
16
  category: AccountingCategory;
17
  children: CategoryTree[];
18
}

1
// 分类管理服务
2
export const categoryService = {
3
  // 获取分类列表
4
  async getCategoryList(type?: AccountingType): Promise<AccountingCategory[]> {
5
    const response = await categoryApi.getCategoryList({ type })
6
    return response.data.list
7
  },
8

9
  // 创建分类
10
  async createCategory(categoryData: Omit<AccountingCategory, 'code'>): Promise<AccountingCategory> {
11
    const response = await categoryApi.createCategory(categoryData)
12
    return response.data
13
  },
14

15
  // 更新分类
16
  async updateCategory(code: string, data: Partial<AccountingCategory>): Promise<AccountingCategory> {
17
    const response = await categoryApi.updateCategory(code, data)
18
    return response.data
19
  },
20

21
  // 删除分类
22
  async deleteCategory(code: string): Promise<void> {
23
    const response = await categoryApi.deleteCategory(code)
24
    if (response.code !== 200) {
25
      throw new Error(response.message)
26
    }
27
  },
28

29
  // 构建分类树
30
  buildCategoryTree(categories: AccountingCategory[]): CategoryTree[] {
31
    const categoryMap = new Map<string, CategoryTree>()
32
    const roots: CategoryTree[] = []
33

34
    // 创建所有节点
35
    categories.forEach(category => {
36
      categoryMap.set(category.code, {
37
        category,
38
        children: []
39
      })
40
    })
41

42
    // 构建树结构
43
    categories.forEach(category => {
44
      const node = categoryMap.get(category.code)!
45

46
      if (category.parentCode) {
47
        const parent = categoryMap.get(category.parentCode)
48
        if (parent) {
49
          parent.children.push(node)
50
        }
51
      } else {
52
        roots.push(node)
53
      }
54
    })
55

56
    return roots
57
  }
58
}

1
// 记账状态管理
2
export const useAccountingStore = defineStore('accounting', () => {
3
  // 状态
4
  const records = ref<AccountingRecord[]>([])
5
  const categories = ref<AccountingCategory[]>([])
6
  const isLoading = ref(false)
7
  const currentRecord = ref<AccountingRecord | null>(null)
8

9
  // 计算属性
10
  const incomeRecords = computed(() =>
11
    records.value.filter(record => record.type === AccountingType.INCOME)
12
  )
13

14
  const expenseRecords = computed(() =>
15
    records.value.filter(record => record.type === AccountingType.EXPENSE)
16
  )
17

18
  const transferRecords = computed(() =>
19
    records.value.filter(record => record.type === AccountingType.TRANSFER)
20
  )
21

22
  const totalIncome = computed(() =>
23
    incomeRecords.value.reduce((sum, record) => sum + record.amountCents, 0)
24
  )
25

26
  const totalExpense = computed(() =>
27
    expenseRecords.value.reduce((sum, record) => sum + record.amountCents, 0)
28
  )
29

30
  // 操作
31
  const fetchRecords = async (params?: AccountingListRequest): Promise<void> => {
32
    isLoading.value = true
33
    try {
34
      const response = await accountingApi.getRecordList(params)
35
      records.value = response.data.list
36
    } catch (error) {
37
      console.error('获取记账记录失败:', error)
38
      throw error
39
    } finally {
40
      isLoading.value = false
41
    }
42
  }
43

44
  const createRecord = async (data: AccountingFormData): Promise<AccountingRecord> => {
45
    try {
46
      const record = await accountingService.createRecord(data)
47
      records.value.unshift(record)
48
      return record
49
    } catch (error) {
50
      console.error('创建记账记录失败:', error)
51
      throw error
52
    }
53
  }
54

55
  const updateRecord = async (id: string, data: Partial<AccountingRecord>): Promise<AccountingRecord> => {
56
    try {
57
      const updatedRecord = await accountingService.updateRecord(id, data)
58
      const index = records.value.findIndex(record => record.id === id)
59
      if (index !== -1) {
60
        records.value[index] = updatedRecord
61
      }
62
      return updatedRecord
63
    } catch (error) {
64
      console.error('更新记账记录失败:', error)
65
      throw error
66
    }
67
  }
68

69
  const deleteRecord = async (id: string): Promise<void> => {
70
    try {
71
      await accountingService.deleteRecord(id)
72
      records.value = records.value.filter(record => record.id !== id)
73
    } catch (error) {
74
      console.error('删除记账记录失败:', error)
75
      throw error
76
    }
77
  }
78

79
  const fetchCategories = async (type?: AccountingType): Promise<void> => {
80
    try {
81
      const categoryList = await categoryService.getCategoryList(type)
82
      categories.value = categoryList
83
    } catch (error) {
84
      console.error('获取分类列表失败:', error)
85
      throw error
86
    }
87
  }
88

89
  return {
90
    records,
91
    categories,
92
    isLoading,
93
    currentRecord,
94
    incomeRecords,
95
    expenseRecords,
96
    transferRecords,
97
    totalIncome,
98
    totalExpense,
99
    fetchRecords,
100
    createRecord,
101
    updateRecord,
102
    deleteRecord,
103
    fetchCategories
104
  }
105
})