activity-detail

nova-werun/pages/activity/detail-activity/index.js

@@ -1,4 +1,6 @@
 // nova-werun/pages/activity/detail-activity/index.js
+const Parse = getApp().Parse;
+const company = getApp().globalData.company;
 Page({
 
     /**
@@ -13,7 +15,10 @@ Page({
         contentHeight2: 0,
         contentpadding: 0, //顶部padding高度
 
-        objectId:"",
+        objectId: "",
+        activity:{},
+        active:0,
+        showpopup:false,
     },
 
     /**
@@ -40,9 +45,11 @@ Page({
         });
 
         this.setData({
-            objectId:options.id
+            objectId: options.id
         })
         console.log(this.data.objectId);
+
+        this.getactivity()
     },
 
     /**
@@ -92,5 +99,40 @@ Page({
      */
     onShareAppMessage: function () {
 
-    }
+    },
+    //获取活动详细信息
+    async getactivity() {
+        let Activityquery = new Parse.Query('Activity');
+        Activityquery.equalTo('company', company);
+        Activityquery.equalTo('objectId', this.data.objectId);
+        Activityquery.notEqualTo('isDeleted', true);
+        Activityquery.equalTo('isEnabled', true);
+
+        let P = await Activityquery.find();
+        let activity = P.map(item => item.toJSON());
+        this.setData({
+            activity:activity[0]
+        })
+        console.log(this.data.activity);
+    },
+    //切换
+    async changeTab(e) {
+        if (e.detail.name == 1) {
+            this.getactivity()
+        }
+        this.setData({
+          active: e.detail.name
+        })
+        console.log(this.data.active);
+      },
+      open(){
+          this.setData({
+            showpopup:true,
+          })
+      },
+      onClose(){
+        this.setData({
+            showpopup:false,
+          })
+      }
 })

nova-werun/pages/activity/detail-activity/index.json

@@ -1,3 +1,12 @@
 {
-  "usingComponents": {}
+  "usingComponents": {
+    "van-popup": "@vant/weapp/popup/index",
+    "van-field": "@vant/weapp/field/index",
+    "van-datetime-picker": "@vant/weapp/datetime-picker/index",
+    "van-overlay": "@vant/weapp/overlay/index",
+    "van-calendar": "@vant/weapp/calendar/index",
+    "van-picker": "@vant/weapp/picker/index",
+    "van-tab": "@vant/weapp/tab/index",
+    "van-tabs": "@vant/weapp/tabs/index"
+  }
 }

nova-werun/pages/activity/detail-activity/index.less

@@ -1,4 +1,119 @@
 /* nova-werun/pages/activity/detail-activity/index.wxss */
 .all{
     width: 100vw;
+    .box {
+
+        // position: relative;
+        .swiper {
+          height: 500rpx;
+        }
+      
+        .detail {
+          position: absolute;
+          background: white;
+          width: 100%;
+          // top: 400rpx;
+          border-radius: 30rpx 30rpx 0 0;
+          padding: 20rpx;
+      
+          .name {
+            margin: 20rpx 0;
+      
+            .title {
+              font-size: 40rpx;
+              font-weight: bold;
+              font-family: "华文琥珀";
+            }
+      
+            .desc {
+              margin: 20rpx;
+              font-size: 25rpx;
+              // white-space: nowrap;
+              // text-overflow: ellipsis;
+              // overflow: hidden;
+            }
+          }
+          .detailbox{
+            width: 100%;
+            height: auto;
+            // position: relative;
+            .item {
+                display: flex;
+                align-items: center;
+                padding: 30rpx 0 20rpx 0rpx;
+                margin: 0 30rpx;
+                border-bottom: 1rpx solid rgb(224, 224, 224);
+          
+                .title {
+                  font-size: 30rpx;
+                  margin-right: 20rpx;
+                  align-items: center;
+                  font-weight: bold;
+          
+                  van-icon {
+                    font-size: 30rpx;
+                  }
+                }
+          
+                .common {
+                  font-size: 28rpx;
+          
+                  van-icon {
+                    margin-right: 10rpx;
+                  }
+          
+                  .arLog {
+                    display: flex;
+                    align-items: center;
+                    padding: 10rpx 0;
+                    color: #7F56B2;
+                    font-weight: bold;
+                  }
+                }
+              }
+              .item2{
+                display: flex;
+                padding: 30rpx 0 20rpx 0rpx;
+                margin: 0 30rpx;
+                border-bottom: 1rpx solid rgb(224, 224, 224);
+                .title {
+                    font-size: 30rpx;
+                    margin-right: 20rpx;
+                    align-items: center;
+                    font-weight: bold;
+                  }
+                  .common{
+                    width: 510rpx;
+                    font-size: 28rpx;
+                  }
+              }
+              .btn {
+                // width: 500rpx;
+                // height: 80rpx;
+                margin: 30rpx 0;
+                background: #4F9AF7;
+                font-size: 35rpx;
+                // position: fixed;
+              }
+          }
+          .popup{
+            width: 100%;
+            height: 70vh;
+            .submit{
+                width: 90%;
+                display: flex;
+                justify-content: center;
+                align-items: center;
+                height: 80rpx;
+                font-size: 35rpx;
+                background: #4F9AF7;
+                position: absolute;
+                bottom: 0;
+                left: 5%;
+                border-radius: 15rpx;
+            }
+          }
+        }
+      }
+
 }

nova-werun/pages/activity/detail-activity/index.wxml

@@ -2,4 +2,110 @@
 <nav type="back" title="活动详情" background-color="{{'#4F9AF7'}}" front-color="{{'#ffffff'}}"></nav>
 <view class="all" style="height: {{contentHeight}}rpx;">
 
-</view>
+    <view class="box" style="height: {{contentHeight}}rpx;">
+        <view class="banner">
+            <swiper class="swiper" indicator-dots="true" autoplay="true" circular="ture">
+                <swiper-item wx:for="{{activity.cover}}" wx:key="index">
+                    <image data-img="{{item}}" bindtap="imagePreview" src="{{item}}" style="width: 100vw;height: 100%;" mode="aspectFill" />
+                </swiper-item>
+            </swiper>
+            <view class="linear"></view>
+        </view>
+        <view class="detail">
+            <view class="name">
+                <view class="title" bindtap="getThumbs">
+                    {{activity.title}}
+                </view>
+                <view wx:if="{{userInfo}}" style="float: right;font-size: 25rpx;">
+                    <van-icon bindtap="thumbs" name="{{countObj.uCount?'like':'like-o'}}" size='20' color="#7F56B2" />
+                    <text style="color: #7F56B2;margin: 0 20rpx 0 0;">{{countObj.count||''}}</text>
+                    <van-icon wx:if="{{active==1}}" bindtap="getReply" name="comment-o" size='20' />
+                </view>
+                <view class="desc">
+                    {{activity.desc}}
+                </view>
+            </view>
+            <block>
+                <van-tabs active="{{ active }}" bind:change="changeTab" color="#4F9AF7">
+                    <van-tab title="活动详细"></van-tab>
+                    <van-tab title="排行榜"></van-tab>
+                </van-tabs>
+
+                <block wx:if="{{active==0}}">
+                    <view class="detailbox">
+                        <view class="item">
+                            <view class="title">
+                                报名时间
+                            </view>
+                            <view>
+                                <view class="common">2025.01.14 00:00 - 2025.01.14 14:00 </view>
+                            </view>
+
+                        </view>
+                        <block wx:if="{{activity.merber>0}}">
+                            <view class="item">
+                                <view class="title">
+                                    报名人数
+                                </view>
+                                <view class="common">50人 /{{activity.merber}}</view>
+                            </view>
+                        </block>
+                        <block>
+                            <view class="item">
+                                <view class="title">
+                                    活动时间
+                                </view>
+                                <view class="common">2025.01.14 00:00 - 2025.01.14 14:00</view>
+                            </view>
+                        </block>
+                        <block>
+                            <view class="item">
+                                <view class="title">
+                                    活动状态
+                                </view>
+                                <view class="common">报名中</view>
+                            </view>
+                        </block>
+
+                        <block>
+                            <view class="item">
+                                <view class="title">
+                                    联系电话
+                                </view>
+                                <view class="common">15888888888</view>
+                            </view>
+                        </block>
+
+                        <block>
+                            <view class="item2">
+                                <view class="title">
+                                    活动规则
+                                </view>
+                                <view class="common">本次跑步活动全程 [X] 公里，参与者需在规定的 [起始时间] 于指定起点出发，沿既定路线前进，途中设置多个打卡点，参与者务必按顺序在各打卡点完成打卡，最终于 [截止时间] 前抵达终点，以完成全程且打卡完整、用时短者为优胜，活动过程中严禁借助交通工具，须全程保持跑步或步行状态，违反规则将取消参赛资格 。</view>
+                            </view>
+                        </block>
+
+                        <button class="btn" bindtap="open">
+                            报名中
+                        </button>
+                    </view>
+                </block>
+                <!-- 填写报名信息 -->
+                <van-popup style="height: 70vh;" show="{{ showpopup }}" bind:click-overlay='onClose' round position="bottom" bind:close="onClose">
+                    <view class="popup">
+                        <view style="padding: 20rpx;border-bottom: 1rpx solid rgb(206, 206, 206);text-align: center;font-weight: bold;">填写报名信息</view>
+                        <van-cell-group>
+                            <van-field model:value="{{ name }}" required clearable label="姓名" placeholder="请输入姓名" />
+                            <!-- <van-field model:value="{{ college }}" clearable label="学院" placeholder="请输入学院" /> -->
+                            <van-field model:value="{{ mobile }}" type="number" required clearable label="手机号" placeholder="请输入手机号" />
+                        </van-cell-group>
+                        <view class="submit">立即报名</view>
+                    </view>
+                </van-popup>
+                <block wx:if="{{active==1}}">
+
+                </block>
+            </block>
+        </view>
+    </view>
+</view>

nova-werun/pages/activity/detail-activity/index.wxss

@@ -1 +1 @@
-.all{width:100vw}
+.all{width:100vw}.all .box .swiper{height:500rpx}.all .box .detail{position:absolute;background:white;width:100%;border-radius:30rpx 30rpx 0 0;padding:20rpx}.all .box .detail .name{margin:20rpx 0}.all .box .detail .name .title{font-size:40rpx;font-weight:bold;font-family:"华文琥珀"}.all .box .detail .name .desc{margin:20rpx;font-size:25rpx}.all .box .detail .detailbox{width:100%;height:auto}.all .box .detail .detailbox .item{display:flex;align-items:center;padding:30rpx 0 20rpx 0rpx;margin:0 30rpx;border-bottom:1rpx solid #e0e0e0}.all .box .detail .detailbox .item .title{font-size:30rpx;margin-right:20rpx;align-items:center;font-weight:bold}.all .box .detail .detailbox .item .title van-icon{font-size:30rpx}.all .box .detail .detailbox .item .common{font-size:28rpx}.all .box .detail .detailbox .item .common van-icon{margin-right:10rpx}.all .box .detail .detailbox .item .common .arLog{display:flex;align-items:center;padding:10rpx 0;color:#7F56B2;font-weight:bold}.all .box .detail .detailbox .item2{display:flex;padding:30rpx 0 20rpx 0rpx;margin:0 30rpx;border-bottom:1rpx solid #e0e0e0}.all .box .detail .detailbox .item2 .title{font-size:30rpx;margin-right:20rpx;align-items:center;font-weight:bold}.all .box .detail .detailbox .item2 .common{width:510rpx;font-size:28rpx}.all .box .detail .detailbox .btn{margin:30rpx 0;background:#4F9AF7;font-size:35rpx}.all .box .detail .popup{width:100%;height:70vh}.all .box .detail .popup .submit{width:90%;display:flex;justify-content:center;align-items:center;height:80rpx;font-size:35rpx;background:#4F9AF7;position:absolute;bottom:0;left:5%;border-radius:15rpx}

nova-werun/pages/activity/index.js

@@ -109,4 +109,11 @@ Page({
 
         console.log(ActivityList);
     },
+    gourl(e) {
+        const url = e.currentTarget.dataset.url
+        const id = e.currentTarget.dataset.id
+            wx.navigateTo({
+                url: `${url}?id=` + id // 目标页面的路径
+            });
+    },
 })

nova-werun/pages/activity/index.wxml

@@ -2,7 +2,7 @@
 <nav type="back" title="全部活动" background-color="{{'#4F9AF7'}}" front-color="{{'#ffffff'}}"></nav>
 <view class="all" style="height: {{contentHeight}}rpx;">
     <block wx:for="{{ActivityList}}">
-        <view class="cardbox">
+        <view class="cardbox" bindtap="gourl" data-url="../activity/detail-activity/index" data-id="{{item.objectId}}">
             <view class="card">
                 <image src="{{item.cover[0]}}" mode="aspectFit"></image>
                 <view class="infobox">