feat(approve): 添加我发起审批功能并优化界面样式

- 新增“我发起”标签页，支持查看我发起的审批
- 优化搜索框和标签样式，提升用户体验
- 重构数据获取和分页逻辑，支持多标签页数据管理

assets/css/approve/index.scss

 .approve-page {
-  min-height: 100vh;
-  background: #f5f7fa;
-  padding-bottom: 158rpx;
+  height: 100vh;
+  background: #f3f6fb;
+  display: flex;
+  flex-direction: column;
+  overflow: hidden;
 
-  .search-bar {
-    padding: 20rpx 28rpx 0 28rpx;
+  .approve-fixed {
+    flex-shrink: 0;
     background: #ffffff;
+    border-bottom: 1rpx solid #e9eef6;
+    position: relative;
+    z-index: 2;
+  }
+
+  .search-bar {
+    padding: 18rpx 28rpx 10rpx;
   }
 
   .tabs-wrap {
-    background: #ffffff;
-    margin-bottom: 20rpx;
-    position: relative;
+    padding: 0 28rpx;
 
     .custom-tabs {
       display: flex;
       width: 100%;
+      background: #f5f7fa;
+      border-radius: 12rpx;
+      padding: 4rpx;
+      box-sizing: border-box;
     }
 
     .tab-item {
       flex: 1;
-      padding: 24rpx 20rpx;
+      min-width: 0;
+      min-height: 56rpx;
+      padding: 0 10rpx;
       display: flex;
       align-items: center;
       justify-content: center;
       position: relative;
-      cursor: pointer;
-      transition: all 0.25s ease;
-      min-height: 80rpx;
+      border: 1rpx solid transparent;
+      border-radius: 10rpx;
+      transition: background 0.2s ease, color 0.2s ease;
 
       .tab-text {
-        font-size: 28rpx;
-        font-weight: 400;
-        color: #909399;
-        transition: all 0.25s ease;
+        font-size: 26rpx;
+        font-weight: 500;
+        color: #59697c;
         line-height: 1.2;
+        transition: all 0.2s ease;
       }
 
       .count-badge {
-        position: relative;
-        margin-left: 10rpx;
-        min-width: 32rpx;
-        height: 32rpx;
-        padding: 0 8rpx;
+        margin-left: 8rpx;
+        min-width: 26rpx;
+        height: 26rpx;
+        padding: 0 7rpx;
         display: flex;
         align-items: center;
         justify-content: center;
-        background: linear-gradient(135deg, #ff6b6b 0%, #ee5a6f 100%);
-        border-radius: 16rpx;
-        box-shadow: 0 2rpx 8rpx rgba(255, 107, 107, 0.25);
-        transition: all 0.3s ease;
+        background: #ff5470;
+        border-radius: 999rpx;
+        box-sizing: border-box;
 
         .count-text {
-          font-size: 20rpx;
+          font-size: 19rpx;
           font-weight: 600;
           color: #ffffff;
           line-height: 1;
-          transform: scale(0.95);
-        }
-
-        .badge-pulse {
-          display: none;
         }
       }
 
       &.active {
+        background: #ffffff;
+        border-color: #e3e8ef;
+
         .tab-text {
-          color: #3b82f6;
-          font-weight: 600;
-          font-size: 32rpx;
+          color: #1f2d3d;
+          font-weight: 700;
         }
       }
     }
-
-    .tab-line {
-      position: absolute;
-      bottom: 0;
-      left: 25%;
-      width: 20%;
-      height: 4rpx;
-      background: #3b82f6;
-      border-radius: 2rpx;
-      transition: all 0.3s ease;
-      transform-origin: center;
-    }
   }
 
-  .filter-bar {
-    padding: 20rpx 28rpx;
-    background: #ffffff;
-    margin-bottom: 20rpx;
+  .type-tabs-wrap {
+    display: flex;
+    gap: 12rpx;
+    padding: 16rpx 28rpx 18rpx;
+    overflow-x: auto;
+    white-space: nowrap;
 
-    .filter-btn {
-      padding: 12rpx 24rpx;
-      background: #f5f7fa;
-      border-radius: 32rpx;
+    .type-tab {
+      flex-shrink: 0;
+      min-height: 46rpx;
+      padding: 0 20rpx;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      border: 1rpx solid #d7e2ef;
+      border-radius: 999rpx;
+      background: #ffffff;
+      color: #59697c;
+      font-size: 24rpx;
+      font-weight: 500;
+      box-sizing: border-box;
+      transition: all 0.2s ease;
 
-      .filter-text {
-        font-size: 26rpx;
-        color: #606266;
-        margin-right: 8rpx;
+      &.active {
+        border-color: #2f73ff;
+        background: #2f73ff;
+        color: #ffffff;
+        font-weight: 600;
       }
     }
   }
 
+  .list-scroll {
+    flex: 1;
+    height: 0;
+  }
+
   .list-wrap {
-    padding: 0 28rpx;
+    padding: 22rpx 28rpx 158rpx;
+    box-sizing: border-box;
 
     .skeleton-card {
       background: #ffffff;
-      border-radius: 16rpx;
-      margin-bottom: 24rpx;
+      border-radius: 14rpx;
+      margin-bottom: 22rpx;
       padding: 28rpx;
-      box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.05);
+      box-shadow: 0 8rpx 22rpx rgba(30, 41, 59, 0.06);
     }
   }
 
   .approve-card {
     background: #ffffff;
-    border-radius: 16rpx;
-    margin-bottom: 24rpx;
+    border-radius: 14rpx;
+    margin-bottom: 22rpx;
     overflow: hidden;
-    box-shadow: 0 4rpx 16rpx rgba(0, 0, 0, 0.05);
+    box-shadow: 0 8rpx 24rpx rgba(30, 41, 59, 0.07);
 
     .card-header {
-      padding: 24rpx 28rpx 12rpx;
+      padding: 26rpx 28rpx 12rpx;
     }
 
     .card-title {
       font-size: 30rpx;
-      font-weight: 600;
-      color: #1e293b;
+      font-weight: 700;
+      color: #172033;
     }
 
     .status-badge {
       font-size: 22rpx;
-      font-weight: 500;
+      font-weight: 600;
       padding: 8rpx 16rpx;
-      border-radius: 20rpx;
+      border-radius: 999rpx;
 
       &.approved {
-        color: #10b981;
-        background: rgba(16, 185, 129, 0.1);
+        color: #0f9f6e;
+        background: rgba(15, 159, 110, 0.1);
       }
 
       &.rejected {
-        color: #f56c6c;
-        background: rgba(245, 108, 108, 0.1);
+        color: #e5484d;
+        background: rgba(229, 72, 77, 0.1);
       }
     }
 
     .card-body {
-      padding: 0 28rpx 20rpx;
+      padding: 0 28rpx 22rpx;
 
       .card-row {
         margin-bottom: 10rpx;
 
         .card-label {
           font-size: 26rpx;
-          color: #909399;
+          color: #8a97a8;
           width: 160rpx;
           flex-shrink: 0;
         }
 
         .card-value {
           font-size: 26rpx;
-          color: #303133;
+          color: #263447;
           flex: 1;
           word-break: break-all;
         }
 
         .card-time {
           font-size: 24rpx;
-          color: #909399;
+          color: #98a4b3;
           margin-left: 8rpx;
         }
 
         .card-tag {
           font-size: 24rpx;
-          color: #e6a23c;
-          font-weight: 500;
+          color: #d8891d;
+          font-weight: 600;
         }
       }
     }
 
     .card-footer {
-      border-top: 1rpx solid #f0f1f5;
+      border-top: 1rpx solid #edf1f6;
       padding: 20rpx 28rpx;
 
       .action-btn {
         flex: 1;
         text-align: center;
         font-size: 28rpx;
-        font-weight: 500;
+        font-weight: 600;
         padding: 16rpx 0;
-        border-radius: 8rpx;
+        border-radius: 10rpx;
         transition: all 0.2s ease;
 
         &.approve {
           color: #ffffff;
-          background: linear-gradient(135deg, #3b82f6 0%, #2563eb 100%);
+          background: #2f73ff;
 
           &:active {
-            opacity: 0.8;
+            opacity: 0.82;
           }
         }
 
         &.detail {
-          color: #3b82f6;
-          background: rgba(59, 130, 246, 0.1);
-          border: 1rpx solid rgba(59, 130, 246, 0.2);
+          color: #2563eb;
+          background: #edf4ff;
+          border: 1rpx solid #cfe0ff;
 
           &:active {
-            background: rgba(59, 130, 246, 0.15);
+            background: #e2edff;
           }
         }
       }