fix: 增强错误处理与组件逻辑优化

- 在 App.vue 中添加 JSON 解析错误处理，确保站点信息获取的稳定性。 - 更新多个 API 请求，添加 loading 状态管理，提升用户体验。 - 在 Search.vue 中优化热词列表的解析逻辑，增强容错性。 - 改进购物车、地址管理等 API 请求参数，确保一致性与可用性。 - 新增用户中心布局组件，提升用户界面的一致性与可读性。
2026-08-06 10:57:26 +08:00 · 2026-07-03 18:29:41 +08:00
parent 99de0d4722
commit bd9a5f75b0
79 changed files with 2382 additions and 1207 deletions
--- a/buyer/src/pages/home/userCenter/Coupons.vue
+++ b/buyer/src/pages/home/userCenter/Coupons.vue
@@ -1,8 +1,13 @@
 <template>
  <div class="wrapper">
-    <card _Title="优惠券列表" :_Tabs="statusNameList" @_Change="change" />
-    <empty v-if="list.length == 0" />
-    <ul class="coupon-list" v-else>
+    <UserCenterLayout
+      title="优惠券列表"
+      :tabs="statusNameList"
+      :active-tab="activeStatusIndex"
+      @tab-change="change"
+    >
+      <empty v-if="list.length == 0" />
+      <ul class="coupon-list" v-else>
      <li v-for="(item, index) in list" class="coupon-item" :key="index">
        <div class="c-left">
          <div>
@@ -29,14 +34,18 @@
        <i class="circle-top"></i>
        <i class="circle-bottom"></i>
      </li>
-    </ul>
-    <el-pagination       :total="total"
-      @current-change="changePageNum"
-      class="pageration"
-      @size-change="changePageSize"
-      :page-size="params.pageSize"
-     layout="total, sizes, prev, pager, next"></el-pagination>
-    <el-skeleton v-if="loading" fix></el-skeleton>
+      </ul>
+      <div class="pageration">
+        <el-pagination
+          :total="total"
+          @current-change="changePageNum"
+          @size-change="changePageSize"
+          :page-size="params.pageSize"
+          layout="total, sizes, prev, pager, next, jumper"
+        />
+      </div>
+      <el-skeleton v-if="loading" fix></el-skeleton>
+    </UserCenterLayout>
  </div>
 </template>

@@ -64,6 +73,12 @@ export default {
      list: [], // 优惠券列表
    };
  },
+  computed: {
+    activeStatusIndex() {
+      const index = this.statusList.indexOf(this.params.memberCouponStatus);
+      return index > -1 ? index : 0;
+    },
+  },
  methods: {
    getList() {
      // 获取优惠券列表
@@ -204,6 +219,7 @@ export default {
 }

 .pageration {
-  text-align: right;
+  display: flex;
+  justify-content: flex-end;
 }
 </style>
--- a/buyer/src/pages/home/userCenter/MoneyManagement.vue
+++ b/buyer/src/pages/home/userCenter/MoneyManagement.vue
@@ -1,6 +1,6 @@
 <template>
  <div class="wrapper">
-    <card _Title="资金管理"/>
+    <UserCenterLayout title="资金管理" :tabs="['资金管理']">

    <div class="box">
      <div class="mb_20 account-price">
@@ -90,7 +90,7 @@
    <!-- 余额日志 -->
    <el-tabs v-model="activeWalletTab" @tab-click="(tab) => tabPaneChange(tab.paneName)">
      <el-tab-pane label="余额日志" name="log">
-        <el-table :data="logColumnsData.records || []">
+        <el-table ref="logTable" :data="logColumnsData.records || []">
          <el-table-column prop="createTime" label="时间" width="190" />
          <el-table-column label="金额" width="180">
            <template #default="{ row }">
@@ -106,15 +106,14 @@
            :page-size="walletForm.pageSize"
            :page-sizes="[10, 20, 50]"
            :total="logColumnsData.total"
-            small
            @current-change="changePage"
            @size-change="changePageSize"
-           layout="total, sizes, prev, pager, next"></el-pagination>
+           layout="total, sizes, prev, pager, next, jumper"></el-pagination>
        </div>
      </el-tab-pane>
      <!-- 充值记录 -->
      <el-tab-pane label="充值记录" name="recharge">
-        <el-table :data="rechargeListData.records || []">
+        <el-table ref="rechargeTable" :data="rechargeListData.records || []">
          <el-table-column prop="createTime" label="充值时间" width="168" />
          <el-table-column prop="rechargeSn" label="支付单号" width="200" />
          <el-table-column label="充值金额">
@@ -145,15 +144,14 @@
            :page-size="rechargeForm.pageSize"
            :page-sizes="[10, 20, 50]"
            :total="rechargeListData.total"
-            small
            @current-change="rechargeChangePage"
            @size-change="rechargeChangePageSize"
-           layout="total, sizes, prev, pager, next"></el-pagination>
+           layout="total, sizes, prev, pager, next, jumper"></el-pagination>
        </div>
      </el-tab-pane>

      <el-tab-pane label="提现记录" name="withdrawApply">
-        <el-table :data="withdrawApplyColumnsListData.records || []">
+        <el-table ref="withdrawTable" :data="withdrawApplyColumnsListData.records || []">
          <el-table-column prop="createTime" label="申请时间" width="168" />
          <el-table-column prop="sn" label="提现单号" width="200" />
          <el-table-column label="提现金额" width="110">
@@ -180,13 +178,13 @@
            :page-size="withdrawApplyForm.pageSize"
            :page-sizes="[10, 20, 50]"
            :total="withdrawApplyColumnsListData.total"
-            small
            @current-change="withdrawChangePage"
            @size-change="withdrawChangePageSize"
-           layout="total, sizes, prev, pager, next"></el-pagination>
+           layout="total, sizes, prev, pager, next, jumper"></el-pagination>
        </div>
      </el-tab-pane>
    </el-tabs>
+    </UserCenterLayout>
  </div>
 </template>

@@ -281,6 +279,7 @@ export default {
      getDepositLog(this.walletForm).then((res) => {
        if (res.message === 'success') {
          this.logColumnsData = res.result;
+          this.refreshActiveTableLayout();
        }
      });
    },
@@ -297,12 +296,14 @@ export default {
      if (v === 'withdrawApply') {
        this.getWithdrawApplyData();
      }
+      this.refreshActiveTableLayout();
    },
    // 充值记录
    getRechargeData() {
      getRecharge(this.rechargeForm).then((res) => {
        if (res.message === 'success') {
          this.rechargeListData = res.result;
+          this.refreshActiveTableLayout();
        }
      });
    },
@@ -311,9 +312,20 @@ export default {
      getWithdrawApply(this.withdrawApplyForm).then((res) => {
        if (res.message === 'success') {
          this.withdrawApplyColumnsListData = res.result;
+          this.refreshActiveTableLayout();
        }
      });
    },
+    refreshActiveTableLayout() {
+      this.$nextTick(() => {
+        const tableMap = {
+          log: this.$refs.logTable,
+          recharge: this.$refs.rechargeTable,
+          withdrawApply: this.$refs.withdrawTable
+        };
+        tableMap[this.activeWalletTab]?.doLayout?.();
+      });
+    },
    // 余额日志
    changePage(v) {
      this.walletForm.pageNumber = v;
--- a/buyer/src/pages/home/userCenter/MyGiftCards.vue
+++ b/buyer/src/pages/home/userCenter/MyGiftCards.vue
@@ -1,6 +1,6 @@
 <template>
  <div class="wrapper my-gift-cards">
-    <card _Title="我的礼品卡" />
+    <UserCenterLayout title="我的礼品卡" :tabs="['我的礼品卡']">

    <div class="bind-section mb_20">
      <div class="section-title">兑换礼品卡</div>
@@ -77,10 +77,9 @@
        :page-size="params.pageSize"
        :page-sizes="[10, 20, 50]"
        :total="total"
-        small
        @current-change="changePage"
        @size-change="changePageSize"
-       layout="total, sizes, prev, pager, next" />
+       layout="total, sizes, prev, pager, next, jumper" />
    </div>

    <el-dialog v-model="noticeModal" title="使用须知" footer-hide width="520">
@@ -90,6 +89,7 @@
      <div class="gcc-notice-footer">
        <el-button type="primary" @click="noticeModal = false">我知道了</el-button>
      </div></el-dialog>
+    </UserCenterLayout>
  </div>
 </template>

@@ -441,8 +441,9 @@ export default {
    background: #f7f7f7;
  }
  .page-size {
+    display: flex;
+    justify-content: flex-end;
    margin-top: 20px;
-    text-align: right;
  }
 }
 .gcc-notice-text {
--- a/buyer/src/pages/home/userCenter/MyTracks.vue
+++ b/buyer/src/pages/home/userCenter/MyTracks.vue
@@ -1,8 +1,9 @@
 <template>
  <div class="wrapper">
-    <!-- 卡片组件 -->
-    <card _Title="我的足迹" :_Size="16"></card>
-    <el-button class="del-btn" @click="clearAll" type="primary">删除全部</el-button>
+    <UserCenterLayout title="我的足迹" :tabs="['我的足迹']">
+      <template #extra>
+        <el-button class="del-btn" @click="clearAll" type="primary">删除全部</el-button>
+      </template>
    <!-- 订单列表 -->
    <empty v-if="list.length === 0" />
    <ul class="track-list" v-else>
@@ -25,8 +26,9 @@
        @current-change="changePageNum"
        @size-change="changePageSize"
        :page-size="params.pageSize"
-       layout="sizes, prev, pager, next"></el-pagination>
+       layout="sizes, prev, pager, next, jumper"></el-pagination>
    </div>
+    </UserCenterLayout>
  </div>
 </template>