添加功能
This commit is contained in:
孙诚
287
Web/src/components/SmartClassifyButton.vue
Normal file
287
Web/src/components/SmartClassifyButton.vue
Normal file
@@ -0,0 +1,287 @@
|
||||
<template>
|
||||
<van-button
|
||||
v-if="hasTransactions"
|
||||
:type="hasClassifiedResults ? 'success' : 'primary'"
|
||||
size="small"
|
||||
:loading="loading || saving"
|
||||
:disabled="loading || saving"
|
||||
@click="handleClick"
|
||||
class="smart-classify-btn"
|
||||
>
|
||||
<template v-if="!loading && !saving">
|
||||
<van-icon :name="hasClassifiedResults ? 'success' : 'fire'" />
|
||||
<span style="margin-left: 4px;">{{ hasClassifiedResults ? '保存分类' : '智能分类' }}</span>
|
||||
</template>
|
||||
<template v-else>
|
||||
{{ saving ? '保存中...' : '分类中...' }}
|
||||
</template>
|
||||
</van-button>
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, computed } from 'vue'
|
||||
import { showToast, closeToast } from 'vant'
|
||||
import { smartClassify, batchUpdateClassify } from '@/api/transactionRecord'
|
||||
|
||||
const props = defineProps({
|
||||
transactions: {
|
||||
type: Array,
|
||||
default: () => []
|
||||
}
|
||||
})
|
||||
|
||||
const emit = defineEmits(['update', 'save'])
|
||||
|
||||
const loading = ref(false)
|
||||
const saving = ref(false)
|
||||
const classifiedResults = ref([])
|
||||
let toastInstance = null
|
||||
|
||||
const hasTransactions = computed(() => {
|
||||
return props.transactions && props.transactions.length > 0
|
||||
})
|
||||
|
||||
const hasClassifiedResults = computed(() => {
|
||||
return classifiedResults.value.length > 0
|
||||
})
|
||||
|
||||
/**
|
||||
* 点击按钮处理
|
||||
*/
|
||||
const handleClick = () => {
|
||||
if (hasClassifiedResults.value) {
|
||||
handleSaveClassify()
|
||||
} else {
|
||||
handleSmartClassify()
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 保存分类结果
|
||||
*/
|
||||
const handleSaveClassify = async () => {
|
||||
try {
|
||||
saving.value = true
|
||||
showToast({
|
||||
message: '正在保存...',
|
||||
duration: 0,
|
||||
forbidClick: true,
|
||||
loadingType: 'spinner'
|
||||
})
|
||||
|
||||
// 准备批量更新数据
|
||||
const items = classifiedResults.value.map(item => ({
|
||||
id: item.id,
|
||||
classify: item.classify,
|
||||
type: item.type
|
||||
}))
|
||||
|
||||
const response = await batchUpdateClassify(items)
|
||||
|
||||
closeToast()
|
||||
|
||||
if (response.success) {
|
||||
showToast({
|
||||
type: 'success',
|
||||
message: `保存成功，已更新 ${items.length} 条记录`,
|
||||
duration: 2000
|
||||
})
|
||||
|
||||
// 清空已分类结果
|
||||
classifiedResults.value = []
|
||||
|
||||
// 通知父组件刷新数据
|
||||
emit('save')
|
||||
} else {
|
||||
showToast({
|
||||
type: 'fail',
|
||||
message: response.message || '保存失败',
|
||||
duration: 2000
|
||||
})
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('保存分类失败:', error)
|
||||
closeToast()
|
||||
showToast({
|
||||
type: 'fail',
|
||||
message: '保存失败，请重试',
|
||||
duration: 2000
|
||||
})
|
||||
} finally {
|
||||
saving.value = false
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 处理智能分类
|
||||
*/
|
||||
const handleSmartClassify = async () => {
|
||||
if (!props.transactions || props.transactions.length === 0) {
|
||||
showToast('没有可分类的交易记录')
|
||||
return
|
||||
}
|
||||
|
||||
// 清空之前的分类结果
|
||||
classifiedResults.value = []
|
||||
|
||||
const transactionIds = props.transactions.map(t => t.id)
|
||||
|
||||
try {
|
||||
loading.value = true
|
||||
// 清除之前的Toast
|
||||
if (toastInstance) {
|
||||
closeToast()
|
||||
}
|
||||
|
||||
toastInstance = showToast({
|
||||
message: '正在智能分类...',
|
||||
duration: 0,
|
||||
forbidClick: true,
|
||||
loadingType: 'spinner'
|
||||
})
|
||||
|
||||
const response = await smartClassify(transactionIds)
|
||||
|
||||
if (!response.ok) {
|
||||
throw new Error('智能分类请求失败')
|
||||
}
|
||||
|
||||
// 读取流式响应
|
||||
const reader = response.body.getReader()
|
||||
const decoder = new TextDecoder()
|
||||
let buffer = ''
|
||||
let processedCount = 0
|
||||
|
||||
while (true) {
|
||||
const { done, value } = await reader.read()
|
||||
|
||||
if (done) break
|
||||
|
||||
buffer += decoder.decode(value, { stream: true })
|
||||
|
||||
// 处理完整的事件（SSE格式：event: type\ndata: data\n\n）
|
||||
const events = buffer.split('\n\n')
|
||||
buffer = events.pop() || '' // 保留最后一个不完整的部分
|
||||
|
||||
for (const eventBlock of events) {
|
||||
if (!eventBlock.trim()) continue
|
||||
|
||||
try {
|
||||
const lines = eventBlock.split('\n')
|
||||
let eventType = ''
|
||||
let eventData = ''
|
||||
|
||||
for (const line of lines) {
|
||||
if (line.startsWith('event: ')) {
|
||||
eventType = line.slice(7).trim()
|
||||
} else if (line.startsWith('data: ')) {
|
||||
eventData = line.slice(6).trim()
|
||||
}
|
||||
}
|
||||
|
||||
if (eventType === 'start') {
|
||||
// 开始分类
|
||||
closeToast()
|
||||
toastInstance = showToast({
|
||||
message: eventData,
|
||||
duration: 0,
|
||||
forbidClick: true,
|
||||
loadingType: 'spinner'
|
||||
})
|
||||
} else if (eventType === 'data') {
|
||||
// 收到分类结果
|
||||
const data = JSON.parse(eventData)
|
||||
processedCount++
|
||||
|
||||
// 记录分类结果
|
||||
classifiedResults.value.push({
|
||||
id: data.id,
|
||||
classify: data.Classify,
|
||||
type: data.Type
|
||||
})
|
||||
|
||||
// 实时更新交易记录的分类信息
|
||||
const index = props.transactions.findIndex(t => t.id === data.id)
|
||||
if (index !== -1) {
|
||||
const transaction = props.transactions[index]
|
||||
transaction.upsetedClassify = data.Classify
|
||||
transaction.upsetedType = data.Type
|
||||
}
|
||||
|
||||
// 更新进度
|
||||
closeToast()
|
||||
toastInstance = showToast({
|
||||
message: `已分类 ${processedCount} 条`,
|
||||
duration: 0,
|
||||
forbidClick: true,
|
||||
loadingType: 'spinner'
|
||||
})
|
||||
} else if (eventType === 'end') {
|
||||
// 分类完成
|
||||
closeToast()
|
||||
toastInstance = null
|
||||
showToast({
|
||||
type: 'success',
|
||||
message: `分类完成，请点击"保存分类"按钮保存结果`,
|
||||
duration: 3000
|
||||
})
|
||||
} else if (eventType === 'error') {
|
||||
// 处理错误
|
||||
closeToast()
|
||||
toastInstance = null
|
||||
showToast({
|
||||
type: 'fail',
|
||||
message: eventData || '分类失败',
|
||||
duration: 2000
|
||||
})
|
||||
}
|
||||
} catch (e) {
|
||||
console.error('解析SSE事件失败:', e, eventBlock)
|
||||
}
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('智能分类失败:', error)
|
||||
closeToast()
|
||||
toastInstance = null
|
||||
showToast({
|
||||
type: 'fail',
|
||||
message: '智能分类失败，请重试',
|
||||
duration: 2000
|
||||
})
|
||||
} finally {
|
||||
loading.value = false
|
||||
// 确保Toast被清除
|
||||
if (toastInstance) {
|
||||
setTimeout(() => {
|
||||
closeToast()
|
||||
toastInstance = null
|
||||
}, 100)
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
/**
|
||||
* 重置组件状态
|
||||
*/
|
||||
const reset = () => {
|
||||
classifiedResults.value = []
|
||||
loading.value = false
|
||||
saving.value = false
|
||||
}
|
||||
|
||||
defineExpose({
|
||||
reset
|
||||
});
|
||||
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.smart-classify-btn {
|
||||
display: inline-flex;
|
||||
align-items: center;
|
||||
white-space: nowrap;
|
||||
border-radius: 16px;
|
||||
padding: 6px 12px;
|
||||
}
|
||||
</style>
|
||||
@@ -1,4 +1,4 @@
|
||||
/* eslint-disable no-console */
|
||||
|
||||
|
||||
export function register() {
|
||||
if ('serviceWorker' in navigator) {
|
||||
|
||||
@@ -17,15 +17,26 @@
|
||||
position="bottom"
|
||||
:style="{ height: '85%' }"
|
||||
round
|
||||
closeable
|
||||
>
|
||||
<div class="popup-container">
|
||||
<div class="popup-header-fixed">
|
||||
<h3>{{ selectedDateText }}</h3>
|
||||
<p v-if="dateTransactions.length">
|
||||
共 {{ dateTransactions.length }} 笔交易，
|
||||
<span v-html="getBalance(dateTransactions)" />
|
||||
</p>
|
||||
<van-icon
|
||||
name="cross"
|
||||
class="close-icon"
|
||||
@click="listVisible = false"
|
||||
/>
|
||||
<h3 class="date-title">{{ selectedDateText }}</h3>
|
||||
<div class="header-stats">
|
||||
<p v-if="dateTransactions.length">
|
||||
共 {{ dateTransactions.length }} 笔交易，
|
||||
<span v-html="getBalance(dateTransactions)" />
|
||||
</p>
|
||||
<SmartClassifyButton
|
||||
ref="smartClassifyButtonRef"
|
||||
:transactions="dateTransactions"
|
||||
@save="onSmartClassifySave"
|
||||
/>
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div class="popup-scroll-content">
|
||||
@@ -56,6 +67,7 @@ import request from "@/api/request";
|
||||
import { getTransactionDetail, getTransactionsByDate } from "@/api/transactionRecord";
|
||||
import TransactionList from "@/components/TransactionList.vue";
|
||||
import TransactionDetail from "@/components/TransactionDetail.vue";
|
||||
import SmartClassifyButton from "@/components/SmartClassifyButton.vue";
|
||||
|
||||
const dailyStatistics = ref({});
|
||||
const listVisible = ref(false);
|
||||
@@ -107,6 +119,7 @@ const fetchDailyStatistics = async (year, month) => {
|
||||
}
|
||||
};
|
||||
|
||||
const smartClassifyButtonRef = ref(null);
|
||||
// 获取指定日期的交易列表
|
||||
const fetchDateTransactions = async (date) => {
|
||||
try {
|
||||
@@ -122,6 +135,8 @@ const fetchDateTransactions = async (date) => {
|
||||
dateTransactions.value = response
|
||||
.data
|
||||
.sort((a, b) => b.amount - a.amount);
|
||||
// 重置智能分类按钮
|
||||
smartClassifyButtonRef.value.reset()
|
||||
} else {
|
||||
dateTransactions.value = [];
|
||||
showToast(response.message || "获取交易列表失败");
|
||||
@@ -205,6 +220,17 @@ const onDetailSave = () => {
|
||||
fetchDailyStatistics(now.getFullYear(), now.getMonth() + 1);
|
||||
};
|
||||
|
||||
// 智能分类保存回调
|
||||
const onSmartClassifySave = async () => {
|
||||
// 保存完成后重新加载数据
|
||||
if (selectedDate.value) {
|
||||
await fetchDateTransactions(selectedDate.value);
|
||||
}
|
||||
// 重新加载统计数据
|
||||
const now = selectedDate.value || new Date();
|
||||
fetchDailyStatistics(now.getFullYear(), now.getMonth() + 1);
|
||||
};
|
||||
|
||||
const formatterCalendar = (day) => {
|
||||
const dayCopy = { ...day };
|
||||
if (dayCopy.date.toDateString() === new Date().toDateString()) {
|
||||
@@ -264,4 +290,45 @@ fetchDailyStatistics(now.getFullYear(), now.getMonth() + 1);
|
||||
background: transparent !important;
|
||||
}
|
||||
|
||||
/* 弹窗头部样式 */
|
||||
.popup-header-fixed {
|
||||
padding: 16px;
|
||||
position: relative;
|
||||
}
|
||||
|
||||
.close-icon {
|
||||
position: absolute;
|
||||
top: 16px;
|
||||
left: 16px;
|
||||
font-size: 18px;
|
||||
color: #969799;
|
||||
cursor: pointer;
|
||||
z-index: 10;
|
||||
}
|
||||
|
||||
.date-title {
|
||||
text-align: center;
|
||||
margin: 0 0 12px;
|
||||
font-size: 16px;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.header-stats {
|
||||
display: flex;
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
gap: 12px;
|
||||
}
|
||||
|
||||
.header-stats p {
|
||||
flex: 1;
|
||||
margin: 0;
|
||||
font-size: 14px;
|
||||
color: #646566;
|
||||
}
|
||||
|
||||
.popup-scroll-content {
|
||||
padding-top: 8px;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
@@ -56,6 +56,9 @@
|
||||
{{ group.sampleClassify }}
|
||||
</van-tag>
|
||||
<span class="count-text">{{ group.count }} 条记录</span>
|
||||
<span class="amount-text" v-if="group.totalAmount">
|
||||
¥{{ Math.abs(group.totalAmount).toFixed(2) }}
|
||||
</span>
|
||||
</div>
|
||||
</template>
|
||||
<template #right-icon>
|
||||
@@ -483,6 +486,12 @@ onMounted(() => {
|
||||
opacity: 0.6;
|
||||
}
|
||||
|
||||
.amount-text {
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
color: #ff976a;
|
||||
}
|
||||
|
||||
.unclassified-stat {
|
||||
padding-left: 16px;
|
||||
padding-top: 12px;
|
||||
|
||||
@@ -10,42 +10,70 @@
|
||||
<div class="scroll-content" style="padding-top: 5px;">
|
||||
<!-- 统计信息 -->
|
||||
<div class="stats-info">
|
||||
<span class="stats-label">未分类账单：</span>
|
||||
<span class="stats-value">{{ records.length }} / {{ unclassifiedCount }}</span>
|
||||
<span class="stats-label">未分类账单 </span>
|
||||
<span class="stats-value">{{ unclassifiedCount }} 条，本次分类 {{ reasonGroups.length }} 组</span>
|
||||
</div>
|
||||
|
||||
<!-- 账单列表 -->
|
||||
<TransactionList
|
||||
:transactions="records"
|
||||
:loading="false"
|
||||
:show-delete="false"
|
||||
:show-checkbox="true"
|
||||
:selected-ids="selectedIds"
|
||||
@click="viewDetail"
|
||||
@update:selected-ids="selectedIds = $event"
|
||||
/>
|
||||
<!-- 分组列表 -->
|
||||
<van-empty v-if="reasonGroups.length === 0 && !loading" description="暂无未分类账单" />
|
||||
|
||||
<van-cell-group v-else inset>
|
||||
<van-cell
|
||||
v-for="group in reasonGroups"
|
||||
:key="group.reason"
|
||||
clickable
|
||||
>
|
||||
<template #title>
|
||||
<div class="group-header">
|
||||
<van-checkbox
|
||||
:model-value="selectedReasons.has(group.reason)"
|
||||
@click.stop="toggleGroupSelection(group.reason)"
|
||||
/>
|
||||
<div class="group-title">
|
||||
{{ group.reason }}
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
<template #label>
|
||||
<div class="group-info">
|
||||
<van-tag
|
||||
:type="getTypeColor(group.sampleType)"
|
||||
size="medium"
|
||||
style="margin-right: 8px;"
|
||||
>
|
||||
{{ getTypeName(group.sampleType) }}
|
||||
</van-tag>
|
||||
<van-tag
|
||||
v-if="group.sampleClassify"
|
||||
type="primary"
|
||||
size="medium"
|
||||
style="margin-right: 8px;"
|
||||
>
|
||||
{{ group.sampleClassify }}
|
||||
</van-tag>
|
||||
<span class="count-text">{{ group.count }} 条</span>
|
||||
<span class="amount-text" v-if="group.totalAmount">
|
||||
¥{{ Math.abs(group.totalAmount).toFixed(2) }}
|
||||
</span>
|
||||
</div>
|
||||
</template>
|
||||
</van-cell>
|
||||
</van-cell-group>
|
||||
|
||||
<!-- 底部安全距离 -->
|
||||
<div style="height: calc(50px + env(safe-area-inset-bottom, 0px))"></div>
|
||||
</div>
|
||||
|
||||
<!-- 详情/编辑弹出层 -->
|
||||
<TransactionDetail
|
||||
v-model:show="detailVisible"
|
||||
:transaction="currentTransaction"
|
||||
@save="onDetailSave"
|
||||
/>
|
||||
|
||||
<!-- 底部操作按钮 -->
|
||||
<div class="action-bar">
|
||||
<van-button
|
||||
type="primary"
|
||||
:loading="classifying"
|
||||
:disabled="selectedIds.size === 0"
|
||||
:disabled="selectedReasons.size === 0"
|
||||
@click="startClassify"
|
||||
class="action-btn"
|
||||
>
|
||||
{{ classifying ? '分类中...' : `开始分类 (${selectedIds.size}/${records.length})` }}
|
||||
{{ classifying ? '分类中...' : `开始分类 (${selectedReasons.size}组)` }}
|
||||
</van-button>
|
||||
|
||||
<van-button
|
||||
@@ -66,22 +94,18 @@ import { useRouter } from 'vue-router'
|
||||
import { showToast, showLoadingToast, closeToast, showConfirmDialog } from 'vant'
|
||||
import {
|
||||
getUnclassifiedCount,
|
||||
getUnclassified,
|
||||
getReasonGroups,
|
||||
smartClassify,
|
||||
batchUpdateClassify,
|
||||
getTransactionDetail
|
||||
batchUpdateClassify
|
||||
} from '@/api/transactionRecord'
|
||||
import TransactionList from '@/components/TransactionList.vue'
|
||||
import TransactionDetail from '@/components/TransactionDetail.vue'
|
||||
|
||||
const router = useRouter()
|
||||
const unclassifiedCount = ref(0)
|
||||
const records = ref([])
|
||||
const selectedIds = ref(new Set()) // 选中的账单ID集合
|
||||
const reasonGroups = ref([]) // 改为分组数据
|
||||
const selectedReasons = ref(new Set()) // 选中的分组摘要集合
|
||||
const loading = ref(false)
|
||||
const classifying = ref(false)
|
||||
const hasChanges = ref(false)
|
||||
const detailVisible = ref(false)
|
||||
const currentTransaction = ref(null)
|
||||
const classifyBuffer = ref('') // SSE数据缓冲区
|
||||
|
||||
const onClickLeft = () => {
|
||||
@@ -109,37 +133,80 @@ const loadUnclassifiedCount = async () => {
|
||||
}
|
||||
}
|
||||
|
||||
// 加载未分类账单列表
|
||||
const loadUnclassified = async () => {
|
||||
// 加载分组数据
|
||||
const loadReasonGroups = async () => {
|
||||
showLoadingToast({
|
||||
message: '加载中...',
|
||||
forbidClick: true,
|
||||
duration: 0
|
||||
})
|
||||
|
||||
loading.value = true
|
||||
|
||||
try {
|
||||
const res = await getUnclassified(10)
|
||||
// 获取所有未分类的分组，设置较大的pageSize以获取所有数据
|
||||
const res = await getReasonGroups(1, 20)
|
||||
if (res.success) {
|
||||
records.value = res.data
|
||||
// 默认全选所有账单
|
||||
selectedIds.value = new Set(res.data.map(r => r.id))
|
||||
// 后端已经按数量排序，我们需要计算每个分组的总金额并重新排序
|
||||
// 但是后端DTO没有返回总金额，我们先按数量排序即可
|
||||
reasonGroups.value = res.data || []
|
||||
// 默认全选所有分组
|
||||
selectedReasons.value = new Set(reasonGroups.value.map(g => g.reason))
|
||||
} else {
|
||||
showToast(res.message || '加载失败')
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('加载账单失败', error)
|
||||
console.error('加载分组失败', error)
|
||||
showToast('加载失败')
|
||||
} finally {
|
||||
loading.value = false
|
||||
closeToast()
|
||||
}
|
||||
}
|
||||
|
||||
// 切换分组选择状态
|
||||
const toggleGroupSelection = (reason) => {
|
||||
if (selectedReasons.value.has(reason)) {
|
||||
selectedReasons.value.delete(reason)
|
||||
} else {
|
||||
selectedReasons.value.add(reason)
|
||||
}
|
||||
// 触发响应式更新
|
||||
selectedReasons.value = new Set(selectedReasons.value)
|
||||
}
|
||||
|
||||
// 获取类型名称
|
||||
const getTypeName = (type) => {
|
||||
const typeMap = {
|
||||
0: '支出',
|
||||
1: '收入',
|
||||
2: '不计收支'
|
||||
}
|
||||
return typeMap[type] || '未知'
|
||||
}
|
||||
|
||||
// 获取类型对应的标签颜色
|
||||
const getTypeColor = (type) => {
|
||||
const colorMap = {
|
||||
0: 'danger', // 支出 - 红色
|
||||
1: 'success', // 收入 - 绿色
|
||||
2: 'default' // 不计收支 - 灰色
|
||||
}
|
||||
return colorMap[type] || 'default'
|
||||
}
|
||||
|
||||
// 开始智能分类
|
||||
const startClassify = async () => {
|
||||
const idsToClassify = Array.from(selectedIds.value)
|
||||
// 获取所有选中分组的账单ID
|
||||
const idsToClassify = []
|
||||
for (const group of reasonGroups.value) {
|
||||
if (selectedReasons.value.has(group.reason)) {
|
||||
idsToClassify.push(...group.transactionIds)
|
||||
}
|
||||
}
|
||||
|
||||
if (idsToClassify.length === 0) {
|
||||
showToast('请先选择要分类的账单')
|
||||
showToast('请先选择要分类的账单组')
|
||||
return
|
||||
}
|
||||
|
||||
@@ -152,6 +219,9 @@ const startClassify = async () => {
|
||||
classifying.value = true
|
||||
classifyBuffer.value = '' // 重置缓冲区
|
||||
|
||||
// 用于存储分类结果的临时对象
|
||||
const classifyResults = new Map() // id -> {classify, type}
|
||||
|
||||
try {
|
||||
const response = await smartClassify(idsToClassify)
|
||||
|
||||
@@ -182,7 +252,7 @@ const startClassify = async () => {
|
||||
const eventType = eventMatch[1]
|
||||
const data = dataMatch[1]
|
||||
|
||||
handleSSEEvent(eventType, data)
|
||||
handleSSEEvent(eventType, data, classifyResults)
|
||||
}
|
||||
}
|
||||
}
|
||||
@@ -197,19 +267,17 @@ const startClassify = async () => {
|
||||
}
|
||||
|
||||
// 处理SSE事件
|
||||
const handleSSEEvent = (eventType, data) => {
|
||||
const handleSSEEvent = (eventType, data, classifyResults) => {
|
||||
if (eventType === 'data') {
|
||||
try {
|
||||
// 累积AI输出的JSON片段
|
||||
classifyBuffer.value += data
|
||||
|
||||
// 尝试查找并提取完整的JSON对象
|
||||
// 使用更精确的方式：查找 { 和匹配的 }
|
||||
let startIndex = 0
|
||||
while (startIndex < classifyBuffer.value.length) {
|
||||
const openBrace = classifyBuffer.value.indexOf('{', startIndex)
|
||||
if (openBrace === -1) {
|
||||
// 没有找到开始的 {，清理前面的无用字符
|
||||
classifyBuffer.value = ''
|
||||
break
|
||||
}
|
||||
@@ -229,32 +297,37 @@ const handleSSEEvent = (eventType, data) => {
|
||||
}
|
||||
|
||||
if (closeBrace !== -1) {
|
||||
// 找到了完整的JSON
|
||||
const jsonStr = classifyBuffer.value.substring(openBrace, closeBrace + 1)
|
||||
|
||||
try {
|
||||
const result = JSON.parse(jsonStr)
|
||||
|
||||
if (result.id) {
|
||||
const record = records.value.find(r => r.id === result.id)
|
||||
if (record) {
|
||||
record.classify = result.classify || ''
|
||||
// 如果AI返回了type字段，也更新type
|
||||
if (result.type !== undefined && result.type !== null) {
|
||||
record.type = result.type
|
||||
// 存储分类结果
|
||||
classifyResults.set(result.id, {
|
||||
classify: result.classify || '',
|
||||
type: result.type !== undefined ? result.type : null
|
||||
})
|
||||
|
||||
// 更新对应分组的显示状态
|
||||
for (const group of reasonGroups.value) {
|
||||
if (group.transactionIds.includes(result.id)) {
|
||||
group.sampleClassify = result.classify || ''
|
||||
if (result.type !== undefined && result.type !== null) {
|
||||
group.sampleType = result.type
|
||||
}
|
||||
hasChanges.value = true
|
||||
break
|
||||
}
|
||||
hasChanges.value = true
|
||||
}
|
||||
}
|
||||
} catch (e) {
|
||||
console.error('JSON解析失败:', e)
|
||||
}
|
||||
|
||||
// 移除已处理的部分
|
||||
classifyBuffer.value = classifyBuffer.value.substring(closeBrace + 1)
|
||||
startIndex = 0 // 从头开始查找下一个JSON
|
||||
startIndex = 0
|
||||
} else {
|
||||
// 没有找到闭合括号，说明JSON还不完整，等待更多数据
|
||||
break
|
||||
}
|
||||
}
|
||||
@@ -274,13 +347,20 @@ const handleSSEEvent = (eventType, data) => {
|
||||
|
||||
// 保存分类
|
||||
const saveClassifications = async () => {
|
||||
const itemsToUpdate = records.value
|
||||
.filter(r => r.classify)
|
||||
.map(r => ({
|
||||
id: r.id,
|
||||
classify: r.classify,
|
||||
type: r.type
|
||||
}))
|
||||
// 收集所有已分类的账单
|
||||
const itemsToUpdate = []
|
||||
for (const group of reasonGroups.value) {
|
||||
if (group.sampleClassify) {
|
||||
// 为该分组的所有账单添加分类
|
||||
for (const id of group.transactionIds) {
|
||||
itemsToUpdate.push({
|
||||
id: id,
|
||||
classify: group.sampleClassify,
|
||||
type: group.sampleType
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
if (itemsToUpdate.length === 0) {
|
||||
showToast('没有需要保存的分类')
|
||||
@@ -300,7 +380,7 @@ const saveClassifications = async () => {
|
||||
hasChanges.value = false
|
||||
// 重新加载数据
|
||||
await loadUnclassifiedCount()
|
||||
await loadUnclassified()
|
||||
await loadReasonGroups()
|
||||
} else {
|
||||
showToast(res.message || '保存失败')
|
||||
}
|
||||
@@ -312,32 +392,9 @@ const saveClassifications = async () => {
|
||||
}
|
||||
}
|
||||
|
||||
// 查看详情
|
||||
const viewDetail = async (transaction) => {
|
||||
try {
|
||||
const response = await getTransactionDetail(transaction.id)
|
||||
if (response.success) {
|
||||
currentTransaction.value = response.data
|
||||
detailVisible.value = true
|
||||
} else {
|
||||
showToast(response.message || '获取详情失败')
|
||||
}
|
||||
} catch (error) {
|
||||
console.error('获取详情出错:', error)
|
||||
showToast('获取详情失败')
|
||||
}
|
||||
}
|
||||
|
||||
// 详情保存后的回调
|
||||
const onDetailSave = async () => {
|
||||
// 重新加载数据
|
||||
await loadUnclassifiedCount()
|
||||
await loadUnclassified()
|
||||
}
|
||||
|
||||
onMounted(() => {
|
||||
loadUnclassifiedCount()
|
||||
loadUnclassified()
|
||||
loadReasonGroups()
|
||||
})
|
||||
</script>
|
||||
|
||||
@@ -353,6 +410,39 @@ onMounted(() => {
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
/* 分组头部 */
|
||||
.group-header {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.group-title {
|
||||
flex: 1;
|
||||
font-size: 15px;
|
||||
font-weight: 500;
|
||||
line-height: 1.4;
|
||||
}
|
||||
|
||||
.group-info {
|
||||
display: flex;
|
||||
align-items: center;
|
||||
gap: 8px;
|
||||
margin-top: 4px;
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.count-text {
|
||||
font-size: 13px;
|
||||
color: #969799;
|
||||
}
|
||||
|
||||
.amount-text {
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
color: #ff976a;
|
||||
}
|
||||
|
||||
/* 底部操作栏 */
|
||||
.action-bar {
|
||||
position: fixed;
|
||||
|
||||
Reference in New Issue
Block a user