合并代码

src/views/Transfers.vue

@@ -206,7 +206,7 @@
                 </div>
                 <!-- 确认收款操作按钮 -->
                 <div 
-                  v-if="transfer.status === 'pending' && transfer.to_user_id === userStore.user.id" 
+                  v-if="transfer.status === 'confirmed' && transfer.to_user_id === userStore.user.id" 
                   class="transfer-actions"
                 >
                   <el-button 
@@ -234,20 +234,6 @@
             <el-empty :description="statusFilter === 'pending' ? '暂无待确认的转账' : '暂无转账记录'" />
           </div>
         </div>
-        
-        <!-- 分页 -->
-        <div class="pagination" v-if="pagination.total > 0">
-          <el-pagination
-            v-model:current-page="pagination.page"
-            v-model:page-size="pagination.limit"
-            :page-sizes="[10, 20, 50]"
-            :total="pagination.total"
-            :layout="paginationLayout"
-            :small="isMobile"
-            @size-change="loadTransferHistory"
-            @current-change="loadTransferHistory"
-          />
-        </div>
       </el-card>
     </div>
 
@@ -285,30 +271,34 @@ const returnForm = reactive({
 
 const pendingTransfers = ref([])
 const pendingAllocations = ref([])
-const transferHistory = ref([])
+const allTransferHistory = ref([])
+const filteredTransferHistory = ref([])
 const userList = ref([])
 
-const pagination = reactive({
+// 移动端检测
-  page: 1,
-  limit: 10,
-  total: 0
-})
-
-// 移动端检测和分页布局
 const windowWidth = ref(window.innerWidth)
 
 const isMobile = computed(() => {
   return windowWidth.value <= 768
 })
 
-const paginationLayout = computed(() => {
+// 计算属性
-  if (windowWidth.value <= 480) {
+const totalCount = computed(() => allTransferHistory.value.length)
-    return 'prev, pager, next'
+const pendingCount = computed(() => {
-  } else if (windowWidth.value <= 768) {
+  return allTransferHistory.value.filter(t => 
-    return 'total, prev, pager, next'
+    t.status === 'pending' && 
-  } else {
+    t.to_user_id === userStore.user.id
-    return 'total, sizes, prev, pager, next, jumper'
+  ).length
-  }
+})
+const confirmedCount = computed(() => {
+  return allTransferHistory.value.filter(t => 
+    t.status === 'confirmed'
+  ).length
+})
+const rejectedCount = computed(() => {
+  return allTransferHistory.value.filter(t => 
+    t.status === 'rejected'
+  ).length
 })
 
 // 窗口大小变化监听
@@ -316,11 +306,6 @@ const handleResize = () => {
   windowWidth.value = window.innerWidth
 }
 
-// 上传配置
-const uploadUrl = ref(uploadURL)
-const uploadHeaders = computed(() => getUploadConfig().headers)
-
-// 生命周期
 onMounted(() => {
   loadPendingTransfers()
   loadPendingAllocations()
@@ -336,34 +321,22 @@ onUnmounted(() => {
 
 // 监听状态筛选
 watch(statusFilter, () => {
-  pagination.page = 1
+  filteredTransferHistory.value = filterTransfers(allTransferHistory.value)
-  loadTransferHistory()
-})
-
-// 计算属性
-const filteredTransferHistory = computed(() => {
-  if (!statusFilter.value) return transferHistory.value
-  
-  return transferHistory.value.filter(transfer => {
-    if (statusFilter.value === 'pending') {
-      return transfer.status === 'pending' && transfer.to_user_id === userStore.user.id
-    }
-    return transfer.status === statusFilter.value
-  })
-})
-
-const totalCount = computed(() => pagination.total)
-const pendingCount = computed(() => {
-  return transferHistory.value.filter(t => t.status === 'pending' && t.to_user_id === userStore.user.id).length
-})
-const confirmedCount = computed(() => {
-  return transferHistory.value.filter(t => t.status === 'confirmed').length
-})
-const rejectedCount = computed(() => {
-  return transferHistory.value.filter(t => t.status === 'rejected').length
 })
 
 // 方法
+const filterTransfers = (transfers) => {
+  if (!statusFilter.value) return transfers
+  
+  return transfers.filter(transfer => {
+    if (statusFilter.value === 'pending') {
+      return transfer.status === 'pending' && 
+             transfer.to_user_id === userStore.user.id
+    }
+    return transfer.status === statusFilter.value
+  })
+}
+
 const loadPendingTransfers = async () => {
   try {
     const response = await api.get('/transfers/pending', {
@@ -397,16 +370,10 @@ const loadPendingAllocations = async () => {
 const loadTransferHistory = async () => {
   try {
     loading.value = true
-    const params = {
+    const response = await api.get(`/transfers/user/${userStore.user.id}`)
-      page: pagination.page,
-      limit: pagination.limit,
-      status: statusFilter.value || undefined
-    }
-    
-    const response = await api.get(`/transfers/user/${userStore.user.id}`, { params })
     if (response.data.success) {
-      transferHistory.value = response.data.data.transfers
+      allTransferHistory.value = response.data.data.transfers || []
-      Object.assign(pagination, response.data.data.pagination)
+      filteredTransferHistory.value = filterTransfers(allTransferHistory.value)
     }
   } catch (error) {
     console.error('加载转账记录失败:', error)
@@ -564,10 +531,10 @@ const confirmReturn = async () => {
 
 const confirmReceived = async (transferId) => {
   try {
-    const transfer = transferHistory.value.find(t => t.id === transferId)
+    const transfer = allTransferHistory.value.find(t => t.id === transferId);
     if (!transfer) {
-      ElMessage.error('转账记录不存在')
+      ElMessage.error('转账记录不存在');
-      return
+      return;
     }
 
     await ElMessageBox.confirm(
@@ -578,25 +545,30 @@ const confirmReceived = async (transferId) => {
         cancelButtonText: '取消',
         type: 'warning'
       }
-    )
+    );
     
-    confirmLoading.value = true
+    confirmLoading.value = true;
-    const response = await api.post(`/transfers/confirm-received/${transferId}`)
+    
+    // 使用 transferAPI.confirmReceived 方法
+    const response = await transferAPI.confirmReceived(transferId);
     
     if (response.data.success) {
-      ElMessage.success('收款确认成功')
+      ElMessage.success('收款确认成功');
-      await loadTransferHistory()
+      await loadTransferHistory();
-      await loadPendingTransfers()
+      await loadPendingTransfers();
     }
   } catch (error) {
     if (error !== 'cancel') {
-      console.error('确认收款失败:', error)
+      console.error('确认收款失败:', error);
-      ElMessage.error(error.response?.data?.message || '确认收款失败')
+      const errorMsg = error.response?.data?.message || 
+                      error.response?.data?.error?.message || 
+                      '确认收款失败';
+      ElMessage.error(errorMsg);
     }
   } finally {
-    confirmLoading.value = false
+    confirmLoading.value = false;
   }
-}
+};
 
 const confirmNotReceived = async (transferId) => {
   try {
@@ -608,24 +580,30 @@ const confirmNotReceived = async (transferId) => {
         cancelButtonText: '取消',
         type: 'warning'
       }
-    )
+    );
     
-    confirmLoading.value = true
+    confirmLoading.value = true;
-    const response = await transferAPI.confirmNotReceived(transferId)
+    
+    // 使用 transferAPI.confirmNotReceived 方法
+    const response = await transferAPI.confirmNotReceived(transferId);
     
     if (response.data.success) {
-      ElMessage.success(response.data.message)
+      ElMessage.success(response.data.message || '操作成功');
-      loadTransferHistory()
+      await loadTransferHistory();
+      await loadPendingTransfers();
     }
   } catch (error) {
     if (error !== 'cancel') {
-      console.error('确认未收款失败:', error)
+      console.error('确认未收款失败:', error);
-      ElMessage.error(error.response?.data?.message || '操作失败')
+      const errorMsg = error.response?.data?.message || 
+                      error.response?.data?.error?.message || 
+                      '操作失败';
+      ElMessage.error(errorMsg);
     }
   } finally {
-    confirmLoading.value = false
+    confirmLoading.value = false;
   }
-}
+};
 </script>
 
 <style lang="scss" scoped>
@@ -643,9 +621,9 @@ const confirmNotReceived = async (transferId) => {
   background: white;
   position: sticky;
   top: 0;
-  z-index: 1000; /* 增加z-index确保在最上层 */
+  z-index: 1000;
-  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1); /* 添加阴影效果 */
+  box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
-  border-bottom: 1px solid #ebeef5; /* 添加底部边框 */
+  border-bottom: 1px solid #ebeef5;
 }
 
 .nav-title {
@@ -674,7 +652,7 @@ const confirmNotReceived = async (transferId) => {
   margin-top: 15px;
   
   .filter-item {
-    flex: 1;  // 均分空间
+    flex: 1;
     text-align: center;
     padding: 8px 0;
     cursor: pointer;
@@ -804,7 +782,6 @@ const confirmNotReceived = async (transferId) => {
   gap: 10px;
 }
 
-/* 待转账相关样式 */
 .timeout-item {
   border-left: 3px solid #f56c6c;
   background-color: #fef0f0;
@@ -876,7 +853,6 @@ const confirmNotReceived = async (transferId) => {
   font-weight: 500;
 }
 
-/* 回款时间状态样式 */
 .return-time-status {
   font-size: 13px;
   font-weight: 500;
@@ -895,7 +871,6 @@ const confirmNotReceived = async (transferId) => {
   color: #909399;
 }
 
-/* 订单状态标签样式优化 */
 .transfer-header .el-tag {
   margin-left: 8px;
   font-size: 11px;
@@ -909,12 +884,6 @@ const confirmNotReceived = async (transferId) => {
   padding: 40px;
 }
 
-.pagination {
-  margin-top: 20px;
-  text-align: center;
-}
-
-/* 移动端适配 */
 @media (max-width: 768px) {
   .status-filter-nav {
     overflow-x: auto;
@@ -922,7 +891,7 @@ const confirmNotReceived = async (transferId) => {
     padding-bottom: 5px;
     
     .filter-item {
-      min-width: 80px;  // 在移动端保持最小宽度
+      min-width: 80px;
       flex: none;
       padding: 6px 0;
       
@@ -980,62 +949,6 @@ const confirmNotReceived = async (transferId) => {
     width: 60px;
     height: 60px;
   }
-  
-  /* 小屏幕分页优化 */
-  .pagination {
-    margin: 10px 0;
-    padding: 0;
-  }
-  
-  .pagination :deep(.el-pagination) {
-    gap: 4px;
-  }
-  
-  .pagination :deep(.el-pagination__total) {
-    font-size: 12px;
-    order: 1;
-    width: 100%;
-    text-align: center;
-    margin-bottom: 8px;
-  }
-  
-  .pagination :deep(.el-pagination__sizes) {
-    order: 2;
-    margin: 4px;
-  }
-  
-  .pagination :deep(.el-pagination__sizes .el-select) {
-    width: 80px;
-  }
-  
-  .pagination :deep(.el-pagination__jump) {
-    order: 4;
-    margin: 4px;
-    font-size: 12px;
-  }
-  
-  .pagination :deep(.el-pagination__jump .el-input) {
-    width: 50px;
-  }
-  
-  .pagination :deep(.el-pager) {
-    order: 3;
-    margin: 4px 0;
-  }
-  
-  .pagination :deep(.el-pager .number),
-  .pagination :deep(.btn-prev),
-  .pagination :deep(.btn-next) {
-    min-width: 28px;
-    height: 28px;
-    font-size: 12px;
-    margin: 1px;
-  }
-  
-  /* 隐藏跳转功能以节省空间 */
-  .pagination :deep(.el-pagination__jump) {
-    display: none;
-  }
 }
 
 .el-card {
@@ -1046,5 +959,4 @@ const confirmNotReceived = async (transferId) => {
     border-radius: 12px 12px 0 0 !important;
   }
 }
-
 </style>