2025-9-24-21:10

miniprogram/pages/chat/chat.wxml

@@ -1,95 +1,4 @@
 <view class="message-container">
-  <!-- 搜索栏 -->
-  <view class="search-bar">
-    <view class="search-input">
-      <icon type="search" size="16" color="#999"></icon>
-      <input placeholder="搜索聊天记录" placeholder-class="placeholder-style"/>
-    </view>
-  </view>
 
-  <!-- 消息列表 - 不按日期分组 -->
-  <scroll-view class="message-list" scroll-y>
-    <!-- 消息项1 - 个人聊天（有未读） -->
-    <view class="message-item" bindtap="goToChat">
-      <view class="avatar-container">
-        <image class="avatar" src="https://picsum.photos/id/64/200/200" mode="cover"></image>
-        <view class="unread-dot"></view>
-      </view>
-      <view class="message-content">
-        <view class="content-top">
-          <text class="username">王小明</text>
-          <text class="time">10:23</text>
-        </view>
-        <view class="content-bottom">
-          <text class="last-message">我们明天上午9点在公司楼下集合吧</text>
-        </view>
-      </view>
-    </view>
-
-    <!-- 消息项2 - 群聊 -->
-    <view class="message-item" bindtap="goToChat">
-      <view class="avatar-container">
-        <image class="avatar" src="https://picsum.photos/id/26/200/200" mode="cover"></image>
-      </view>
-      <view class="message-content">
-        <view class="content-top">
-          <text class="username">产品研发群</text>
-          <text class="time">昨天</text>
-        </view>
-        <view class="content-bottom">
-          <text class="last-message"><text class="sender">李设计</text>：新的UI稿已经上传到群文件了</text>
-        </view>
-      </view>
-    </view>
-
-    <!-- 消息项3 - 系统通知 -->
-    <view class="message-item" bindtap="goToChat">
-      <view class="avatar-container">
-        <image class="avatar" src="https://picsum.photos/id/91/200/200" mode="cover"></image>
-        <view class="unread-count">3</view>
-      </view>
-      <view class="message-content">
-        <view class="content-top">
-          <text class="username">系统通知</text>
-          <text class="time">周一</text>
-        </view>
-        <view class="content-bottom">
-          <text class="last-message">您有3条新的系统通知待查看</text>
-        </view>
-      </view>
-    </view>
-
-    <!-- 消息项4 - 个人聊天 -->
-    <view class="message-item" bindtap="goToChat">
-      <view class="avatar-container">
-        <image class="avatar" src="https://picsum.photos/id/65/200/200" mode="cover"></image>
-      </view>
-      <view class="message-content">
-        <view class="content-top">
-          <text class="username">张小红</text>
-          <text class="time">09-12</text>
-        </view>
-        <view class="content-bottom">
-          <text class="last-message">上次你说的那个电影资源能发我一下吗？</text>
-        </view>
-      </view>
-    </view>
-
-    <!-- 消息项5 - 服务号消息 -->
-    <view class="message-item" bindtap="goToChat">
-      <view class="avatar-container">
-        <image class="avatar" src="https://picsum.photos/id/62/200/200" mode="cover"></image>
-      </view>
-      <view class="message-content">
-        <view class="content-top">
-          <text class="username">生活服务号</text>
-          <text class="time">09-10</text>
-        </view>
-        <view class="content-bottom">
-          <text class="last-message">您订阅的服务已更新，点击查看详情</text>
-        </view>
-      </view>
-    </view>
-  </scroll-view>
 </view>
     

miniprogram/pages/home/home.ts

@@ -1,8 +1,55 @@
 Component({
     data: {
-  
+      // 用对象存储多个卡片的选中状态，键为卡片ID，值为选中的选项ID
+      selectedOptions: {} as Record<string, string>
     },
     methods: {
+      /**
+       * 选择选项
+       * @param e 事件对象，包含卡片ID和选项ID
+       */
+      selectOption(e: WechatMiniprogram.TouchEvent) {
+        const { card, id } = e.currentTarget.dataset as { card: string; id: string };
         
+        // 更新选中状态（使用对象展开语法保持响应式）
+        this.setData({
+          selectedOptions: {
+            ...this.data.selectedOptions,
+            [card]: id
+          }
+        });
       },
-})
+      
+      /**
+       * 提交投票
+       * @param e 事件对象，包含卡片ID
+       */
+      submitVote(e: WechatMiniprogram.TouchEvent) {
+        const { card } = e.currentTarget.dataset as { card: string };
+        const selected = this.data.selectedOptions[card];
+        
+        if (!selected) {
+          wx.showToast({
+            title: '请先选择一个选项',
+            icon: 'none',
+            duration: 2000
+          });
+          return;
+        }
+        
+        // 可以通过triggerEvent向父组件传递投票结果
+        this.triggerEvent('voteSuccess', {
+          cardId: card,
+          selectedOption: selected,
+          timestamp: Date.now()
+        });
+        
+        wx.showToast({
+          title: '投票成功',
+          icon: 'success',
+          duration: 2000
+        });
+      }
+    }
+  });
+  

miniprogram/pages/home/home.wxml

@@ -1,13 +1,17 @@
-<view class="search-bar">
+<view style="height: 80vh;">
-    <view class="search-input">
+<scroll-view 
-      <icon type="search" size="16" color="#999"></icon>
+  class="scroll-container" 
-      <input placeholder="搜索聊天记录" placeholder-class="placeholder-style"/>
+  scroll-y="true"
-    </view>
+  enable-flex="true"
-  </view>
+  show-scrollbar="true"
-<view style="width: 100vw;display: flex;justify-content: center;">
+  enhanced="true"
-
+  scroll-with-animation="true"
+>
+  <!-- 卡片容器，使用纵向布局 -->
+  <view class="cards-container">
+    <!-- 第一个卡片 -->
     <view class="voting-card">
-    <!-- 卡片头部 -->
+      <!-- 卡片内容保持不变 -->
       <view class="card-header">
         <view class="user-info">
           <image src="https://picsum.photos/id/64/200/200" mode="widthFix" class="avatar" alt="发起者头像"></image>
@@ -29,7 +33,7 @@
       <!-- 选项区域 -->
       <view class="options-container">
         <!-- 选项1 -->
-      <view class="option-item {{selectedOption === '1' ? 'selected' : ''}}" bindtap="selectOption" data-id="1">
+        <view class="option-item {{selectedOption1 === '1' ? 'selected' : ''}}" bindtap="selectOption" data-id="1" data-card="1">
           <view class="option-info">
             <view class="option-icon bg-red">
               <text class="iconfont icon-cutlery"></text>
@@ -45,13 +49,13 @@
             <view class="progress-value" style="width: 42%"></view>
           </view>
           
-        <view class="vote-indicator {{selectedOption === '1' ? 'show' : ''}}">
+          <view class="vote-indicator {{selectedOption1 === '1' ? 'show' : ''}}">
             <text class="iconfont icon-check-circle"></text>
           </view>
         </view>
         
         <!-- 选项2 -->
-      <view class="option-item {{selectedOption === '2' ? 'selected' : ''}}" bindtap="selectOption" data-id="2">
+        <view class="option-item {{selectedOption1 === '2' ? 'selected' : ''}}" bindtap="selectOption" data-id="2" data-card="1">
           <view class="option-info">
             <view class="option-icon bg-yellow">
               <text class="iconfont icon-coffee"></text>
@@ -67,13 +71,13 @@
             <view class="progress-value" style="width: 28%"></view>
           </view>
           
-        <view class="vote-indicator {{selectedOption === '2' ? 'show' : ''}}">
+          <view class="vote-indicator {{selectedOption1 === '2' ? 'show' : ''}}">
             <text class="iconfont icon-check-circle"></text>
           </view>
         </view>
         
         <!-- 选项3 -->
-      <view class="option-item {{selectedOption === '3' ? 'selected' : ''}}" bindtap="selectOption" data-id="3">
+        <view class="option-item {{selectedOption1 === '3' ? 'selected' : ''}}" bindtap="selectOption" data-id="3" data-card="1">
           <view class="option-info">
             <view class="option-icon bg-green">
               <text class="iconfont icon-leaf"></text>
@@ -89,7 +93,7 @@
             <view class="progress-value" style="width: 30%"></view>
           </view>
           
-        <view class="vote-indicator {{selectedOption === '3' ? 'show' : ''}}">
+          <view class="vote-indicator {{selectedOption1 === '3' ? 'show' : ''}}">
             <text class="iconfont icon-check-circle"></text>
           </view>
         </view>
@@ -101,12 +105,73 @@
       </view>
       
       <!-- 投票按钮 -->
-    <button class="vote-btn" bindtap="submitVote">
+      <button class="vote-btn" bindtap="submitVote" data-card="1">
         <text class="iconfont icon-thumbs-up"></text>
         <text class="btn-text">投我一票</text>
       </button>
     </view>
+
+    <!-- 第二个卡片 -->
+    <view class="voting-card">
+      <!-- 卡片内容保持不变 -->
+      <view class="card-header">
+        <view class="user-info">
+          <image src="https://picsum.photos/id/91/200/200" mode="widthFix" class="avatar" alt="发起者头像"></image>
+          <view class="user-details">
+            <text class="username">李小强</text>
+            <text class="user-status">团队活动投票</text>
+          </view>
+        </view>
+        <view class="vote-status">进行中</view>
+      </view>
+      
+      <!-- 其余内容省略（与原代码一致） -->
+      <view class="divider"></view>
+      <view class="vote-title-section">
+        <text class="vote-title">周末团建活动选哪个？</text>
+        <text class="vote-desc">大家踊跃投票，少数服从多数~</text>
+      </view>
+      <!-- 选项区域（省略） -->
+      <view class="vote-stats">
+        <text class="stats-text">已有 38 人参与投票</text>
+        <text class="stats-text">剩余 45 小时结束</text>
+      </view>
+      <button class="vote-btn" bindtap="submitVote" data-card="2">
+        <text class="iconfont icon-thumbs-up"></text>
+        <text class="btn-text">投我一票</text>
+      </button>
+    </view>
+
+    <!-- 第三个卡片 -->
+    <view class="voting-card">
+      <!-- 卡片内容保持不变 -->
+      <view class="card-header">
+        <view class="user-info">
+          <image src="https://picsum.photos/id/26/200/200" mode="widthFix" class="avatar" alt="发起者头像"></image>
+          <view class="user-details">
+            <text class="username">王小花</text>
+            <text class="user-status">购物选择投票</text>
+          </view>
+        </view>
+        <view class="vote-status">进行中</view>
+      </view>
+      
+      <!-- 其余内容省略（与原代码一致） -->
+      <view class="divider"></view>
+      <view class="vote-title-section">
+        <text class="vote-title">买哪个牌子的笔记本电脑？</text>
+        <text class="vote-desc">主要用于办公和轻度设计</text>
+      </view>
+      <!-- 选项区域（省略） -->
+      <view class="vote-stats">
+        <text class="stats-text">已有 76 人参与投票</text>
+        <text class="stats-text">剩余 12 小时结束</text>
+      </view>
+      <button class="vote-btn" bindtap="submitVote" data-card="3">
+        <text class="iconfont icon-thumbs-up"></text>
+        <text class="btn-text">投我一票</text>
+      </button>
+    </view>
+  </view>
+</scroll-view>
 </view>
-
-
-  

miniprogram/pages/home/home.wxss

@@ -7,28 +7,14 @@
   background-color: #f5f7fa;
   padding: 20rpx;
 }
+.scroll-container {
+    width: 100%;
 
-.search-bar {
+  }
-  padding: 16rpx 24rpx;
+  .voting-card {
-  background-color: #f5f5f7;
+    min-width: calc(100% - 30px); /* 确保在手机上卡片占满宽度 */
-}
+    /* 其他原有样式保持不变 */
-
+  }
-.search-input {
-  display: flex;
-  align-items: center;
-  background-color: #eaeaea;
-  border-radius: 30rpx;
-  padding: 14rpx 24rpx;
-}
-
-.search-input input {
-  margin-left: 12rpx;
-  font-size: 28rpx;
-  flex: 1;
-  color: #333;
-  height: 40rpx;
-  line-height: 40rpx;
-}
 
 /* 投票卡片卡片样式 */
 .voting-card {

project.private.config.json

@@ -1,6 +1,6 @@
 {
   "description": "项目私有配置文件。此文件中的内容将覆盖 project.config.json 中的相同字段。项目的改动优先同步到此文件中。详见文档：https://developers.weixin.qq.com/miniprogram/dev/devtools/projectconfig.html",
-  "projectname": "toutoukan",
+  "projectname": "%E6%8A%95%E6%8A%95%E7%9C%8B%E5%B0%8F%E7%A8%8B%E5%BA%8F",
   "setting": {
     "compileHotReLoad": true,
     "urlCheck": false,
@@ -19,5 +19,5 @@
     "checkInvalidKey": true,
     "ignoreDevUnusedFiles": true
   },
-  "libVersion": "3.9.0"
+  "libVersion": "3.10.1"
 }