签到需要优化

pages/discover/punch.vue

@@ -1,6 +1,8 @@
 <script setup>
   import { ref } from 'vue'
 
+  const weekList = ['一', '二', '三', '四', '五', '六', '日']
+
   const indexData = ref([1, 2, 3, 4])
 
   const onItem = item => {
@@ -43,8 +45,20 @@
           <text>天</text>
         </view>
       </view>
+      <!-- 切换 -->
+      <view class="switch-box">
+        <text class="date">2025年12月</text>
+        <view class="btn">
+          <uni-icons type="left" size="22" color="#666666"></uni-icons>
+          <uni-icons type="right" size="22" color="#666666"></uni-icons>
+        </view>
+      </view>
+
       <!-- 签到列表 -->
       <view class="list-box">
+        <view v-for="(item, index) in weekList" :key="index" class="item">
+          <text class="bottom-name">{{ item }}</text>
+        </view>
         <view
           v-for="item in 30"
           :key="item"
@@ -69,15 +83,18 @@
 
 <style lang="scss" scoped>
   @import './styles/index.scss';
+  .right-icon {
+    right: -86rpx !important;
+  }
   .punch-box {
     padding: 0 24rpx;
     .top-title {
       font-family: PingFang SC, PingFang SC;
-
       font-style: normal;
       text-transform: none;
       display: flex;
       align-items: center;
+      justify-content: space-between;
       .title {
         font-weight: bold;
         font-size: 32rpx;
@@ -99,6 +116,26 @@
       }
     }
 
+    .switch-box {
+      margin: 50rpx 0 40rpx;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+      .date {
+        font-family: PingFang SC, PingFang SC;
+        font-weight: 500;
+        font-size: 32rpx;
+        color: #666666;
+        font-style: normal;
+        text-transform: none;
+      }
+      .btn {
+        width: 180rpx;
+        display: flex;
+        justify-content: space-between;
+      }
+    }
+
     .list-box {
       margin-top: 38rpx;
       font-family: PingFang SC, PingFang SC;