最近动态

src/pagesBank/dashboard/index.vue

@@ -21,6 +21,103 @@ const quickActions = [
   { icon: 'i-carbon-settings', label: '设置', path: '/pagesBank/me/index' },
 ]
 
+// 最近动态数据
+interface RecentActivity {
+  id: number
+  type: 'audit' | 'visit' | 'customer' | 'withdraw'
+  title: string
+  description: string
+  time: string
+  status?: 'pending' | 'approved' | 'rejected' | 'completed'
+}
+
+const recentActivities = ref<RecentActivity[]>([
+  {
+    id: 1,
+    type: 'audit',
+    title: '贷款审核',
+    description: '商户"张三便利店"提交的贷款申请待审核',
+    time: '10分钟前',
+    status: 'pending',
+  },
+  {
+    id: 2,
+    type: 'visit',
+    title: '拜访计划',
+    description: '已安排拜访"李四超市"了解经营情况',
+    time: '30分钟前',
+    status: 'completed',
+  },
+  {
+    id: 3,
+    type: 'audit',
+    title: '提现审核',
+    description: '商户"王五五金店"提现申请已通过',
+    time: '1小时前',
+    status: 'approved',
+  },
+  {
+    id: 4,
+    type: 'customer',
+    title: '客户入驻',
+    description: '新商户"赵六服装店"提交入驻申请',
+    time: '2小时前',
+    status: 'pending',
+  },
+  {
+    id: 5,
+    type: 'audit',
+    title: '贷款审核',
+    description: '商户"孙七水果店"的贷款申请已拒绝',
+    time: '3小时前',
+    status: 'rejected',
+  },
+])
+
+// 获取动态类型对应的图标
+function getActivityIcon(type: string) {
+  const iconMap: Record<string, string> = {
+    audit: 'i-carbon-task-approved',
+    visit: 'i-carbon-calendar',
+    customer: 'i-carbon-group',
+    withdraw: 'i-carbon-wallet',
+  }
+  return iconMap[type] || 'i-carbon-information'
+}
+
+// 获取动态类型对应的颜色
+function getActivityColor(type: string) {
+  const colorMap: Record<string, string> = {
+    audit: '#ff8f0d',
+    visit: '#00c05a',
+    customer: '#3b82f6',
+    withdraw: '#8b5cf6',
+  }
+  return colorMap[type] || '#666'
+}
+
+// 获取状态对应的文本
+function getStatusText(status?: string) {
+  const statusMap: Record<string, string> = {
+    pending: '待审核',
+    approved: '已通过',
+    rejected: '已拒绝',
+    completed: '已完成',
+  }
+  return status ? statusMap[status] : ''
+}
+
+// 获取状态对应的颜色
+function getStatusColor(status?: string) {
+  const colorMap: Record<string, string> = {
+    pending: '#ff8f0d',
+    approved: '#00c05a',
+    rejected: '#ef4444',
+    completed: '#3b82f6',
+  }
+  return status ? colorMap[status] : ''
+}
+
 function handleAction(path: string) {
   if (!path) {
     uni.showToast({ title: '功能开发中', icon: 'none' })
@@ -29,6 +126,20 @@ function handleAction(path: string) {
   uni.navigateTo({ url: path })
 }
 
+function handleActivityClick(activity: RecentActivity) {
+  // 根据动态类型跳转到对应页面
+  const pathMap: Record<string, string> = {
+    audit: '/pagesBank/audit/list',
+    visit: '/pagesBank/visit/list',
+    customer: '/pagesBank/customer/list',
+    withdraw: '/pagesBank/audit/list',
+  }
+  const path = pathMap[activity.type]
+  if (path) {
+    uni.navigateTo({ url: path })
+  }
+}
+
 onMounted(() => {
   bankStore.fetchStats()
 })
@@ -116,15 +227,37 @@ onMounted(() => {
       </view>
     </view>
     
-    <!-- 最近动态 (Placeholder) -->
+    <!-- 最近动态 -->
     <view class="section">
       <view class="section-header">
         <text class="section-title">最近动态</text>
-        <text class="more">更多 ></text>
+        <text class="more" @click="handleAction('/pagesBank/audit/list')">更多 ></text>
       </view>
-      <view class="empty-dynamic">
-        <text class="i-carbon-reminder-attendance"></text>
-        <text>暂无新的审核动态</text>
+      <view class="activity-list">
+        <view
+          v-for="activity in recentActivities"
+          :key="activity.id"
+          class="activity-item"
+          @click="handleActivityClick(activity)"
+        >
+          <view class="activity-icon" :style="{ background: `${getActivityColor(activity.type)}15` }">
+            <text :class="getActivityIcon(activity.type)" :style="{ color: getActivityColor(activity.type) }"></text>
+          </view>
+          <view class="activity-content">
+            <view class="activity-header">
+              <text class="activity-title">{{ activity.title }}</text>
+              <text
+                v-if="activity.status"
+                class="activity-status"
+                :style="{ color: getStatusColor(activity.status) }"
+              >
+                {{ getStatusText(activity.status) }}
+              </text>
+            </view>
+            <text class="activity-description">{{ activity.description }}</text>
+            <text class="activity-time">{{ activity.time }}</text>
+          </view>
+        </view>
       </view>
     </view>
   </view>
@@ -334,21 +467,74 @@ onMounted(() => {
   }
 }
 
-.empty-dynamic {
+.activity-list {
   display: flex;
   flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  padding: 40rpx 0;
-  color: #adb5bd;
-  gap: 16rpx;
+  gap: 24rpx;
   
-  text:first-child {
-    font-size: 64rpx;
-  }
-  
-  text:last-child {
-    font-size: 26rpx;
+  .activity-item {
+    display: flex;
+    gap: 20rpx;
+    padding: 24rpx;
+    background: #f8f9fa;
+    border-radius: 16rpx;
+    transition: all 0.2s;
+    
+    &:active {
+      background: #e9ecef;
+      transform: scale(0.98);
+    }
+    
+    .activity-icon {
+      width: 72rpx;
+      height: 72rpx;
+      border-radius: 16rpx;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      flex-shrink: 0;
+      
+      text {
+        font-size: 36rpx;
+      }
+    }
+    
+    .activity-content {
+      flex: 1;
+      display: flex;
+      flex-direction: column;
+      gap: 8rpx;
+      
+      .activity-header {
+        display: flex;
+        justify-content: space-between;
+        align-items: center;
+        
+        .activity-title {
+          font-size: 28rpx;
+          font-weight: 600;
+          color: #333;
+        }
+        
+        .activity-status {
+          font-size: 22rpx;
+          padding: 4rpx 12rpx;
+          background: rgba(0, 0, 0, 0.05);
+          border-radius: 8rpx;
+        }
+      }
+      
+      .activity-description {
+        font-size: 24rpx;
+        color: #666;
+        line-height: 1.5;
+      }
+      
+      .activity-time {
+        font-size: 22rpx;
+        color: #999;
+      }
+    }
   }
 }
 </style>