feat: 交互优化与代码质量改进

- SvgIcon 改为 PNG 图标方案，组件重命名为 Icon
- 修复 TransactionItem tap 事件名冲突，改为 item-tap
- 修复 Stats 页面切换 tab 时 overview 不更新
- 修复 CategoryIcon bgColor 必填问题
- 修复 ChartWrapper import 顺序
- 修复 budget onDelete 空字符串问题
- 清理 profile 页面未使用 CSS
- 统一所有页面 header 为 sticky 定位
- 修复导航栏返回按钮不统一
- 添加导出功能 loading 状态
- 优化 scroll-into-view 延迟

client/src/pages/profile/index.vue

@@ -1,11 +1,13 @@
 <template>
   <view class="page">
-    <view class="status-bar" :style="{ height: statusBarHeight + 'px' }"></view>
-    <text class="page-title">我的</text>
+    <view class="header-fixed">
+      <view class="status-bar" :style="{ height: statusBarHeight + 'px' }"></view>
+      <text class="page-title">我的</text>
+    </view>
 
     <view class="profile-card">
       <view class="p-avatar">
-        <SvgIcon name="user" :size="64" color="#FFFFFF" />
+        <Icon name="user" :size="64" color="#FFFFFF" />
       </view>
       <view class="p-info">
         <text class="p-name">小菜</text>
@@ -31,22 +33,22 @@
       <view class="menu-item" @tap="goBudget">
         <text class="mi-label">预算设置</text>
         <text class="mi-extra" v-if="budget">{{ formatAmount(budget.amount) }}</text>
-        <SvgIcon name="chevronRight" :size="24" color="#BFB3B3" />
+        <Icon name="chevronRight" :size="24" color="#BFB3B3" />
       </view>
       <view class="menu-item" @tap="goCategoryManage">
         <text class="mi-label">分类管理</text>
-        <SvgIcon name="chevronRight" :size="24" color="#BFB3B3" />
+        <Icon name="chevronRight" :size="24" color="#BFB3B3" />
       </view>
       <view class="menu-item" @tap="exportData">
         <text class="mi-label">数据导出</text>
-        <SvgIcon name="chevronRight" :size="24" color="#BFB3B3" />
+        <Icon name="chevronRight" :size="24" color="#BFB3B3" />
       </view>
     </view>
 
     <view class="menu-card mt">
       <view class="menu-item" @tap="showAbout = true">
         <text class="mi-label">关于小菜</text>
-        <SvgIcon name="chevronRight" :size="24" color="#BFB3B3" />
+        <Icon name="chevronRight" :size="24" color="#BFB3B3" />
       </view>
     </view>
 
@@ -55,7 +57,7 @@
       <view class="modal" @tap.stop>
         <text class="about-title">小菜记账</text>
         <text class="about-version">v1.0.0</text>
-        <text class="about-desc">可爱 x 高级的个人记账小程序</text>
+        <text class="about-desc">温暖 x 轻松的个人记账小程序</text>
         <text class="about-desc">让记账从负担变成享受</text>
         <view class="modal-btns" style="margin-top: 40rpx;">
           <view class="modal-btn confirm" @tap="showAbout = false">知道了</view>
@@ -73,7 +75,7 @@ import { useBudgetStore } from '@/stores/budget'
 import { formatAmount } from '@/utils/format'
 import { statusBarHeight } from '@/utils/system'
 import { request } from '@/utils/request'
-import SvgIcon from '@/components/SvgIcon/SvgIcon.vue'
+import Icon from '@/components/Icon/Icon.vue'
 
 const txStore = useTransactionStore()
 const statsStore = useStatsStore()
@@ -115,6 +117,7 @@ function getLocalDateStr(): string {
 }
 
 async function exportData() {
+  uni.showLoading({ title: '导出中...' })
   try {
     const data = await request<any>({ url: '/transactions', data: { page: 1, pageSize: 9999 } })
     const list = data.list
@@ -149,6 +152,7 @@ async function exportData() {
     a.download = `小菜记账_${getLocalDateStr()}.csv`
     a.click()
     URL.revokeObjectURL(url)
+    uni.hideLoading()
     uni.showToast({ title: '导出成功', icon: 'success' })
     // #endif
 
@@ -156,6 +160,7 @@ async function exportData() {
     const fs = uni.getFileSystemManager()
     const filePath = `${wx.env.USER_DATA_PATH}/小菜记账_${getLocalDateStr()}.csv`
     fs.writeFileSync(filePath, csv, 'utf-8')
+    uni.hideLoading()
     uni.openDocument({
       filePath,
       fileType: 'csv',
@@ -164,6 +169,7 @@ async function exportData() {
     })
     // #endif
   } catch {
+    uni.hideLoading()
     uni.showToast({ title: '导出失败', icon: 'none' })
   }
 }
@@ -176,6 +182,13 @@ async function exportData() {
   padding: 0 0 180rpx;
 }
 
+.header-fixed {
+  position: sticky;
+  top: 0;
+  z-index: 100;
+  background: #FFF8F0;
+}
+
 .status-bar {
   background: #FFF8F0;
 }
@@ -346,24 +359,6 @@ async function exportData() {
   padding: 48rpx;
 }
 
-.modal-title {
-  font-size: 32rpx;
-  font-weight: 600;
-  color: #2D1B1B;
-  display: block;
-  text-align: center;
-  margin-bottom: 32rpx;
-}
-
-.modal-input {
-  height: 96rpx;
-  background: #FFF8F0;
-  border-radius: 24rpx;
-  padding: 0 32rpx;
-  font-size: 28rpx;
-  margin-bottom: 32rpx;
-}
-
 .modal-btns {
   display: flex;
   gap: 24rpx;
@@ -379,11 +374,6 @@ async function exportData() {
   font-size: 28rpx;
   font-weight: 600;
 
-  &.cancel {
-    background: #FFF8F0;
-    color: #8B7E7E;
-  }
-
   &.confirm {
     background: linear-gradient(135deg, #FF8C69, #E67355);
     color: #FFFFFF;