style:样式修改

pages/activity/index.vue

@@ -1,17 +1,17 @@
 <template>
-  <view class="activity" catchtouchmove="true" :style="pageIndex == 1 ? 'background-image:none;background-color:#e03519' : ''">
+  <view class="activity" catchtouchmove="true" :style="pageIndex == 1 ? 'background-image:none;background-color:#e03519;padding:0 0 120rpx' : ''">
     <!-- <view class="rule" @click="showRule">活动规则</view> -->
 
     <!-- logo与跑马灯 -->
     <view class="header">
-      <img :src="acticve_detail.logo" class="logo" v-if="pageIndex == 1" />
-      <view class="barrage-box">
+      <img :src="acticve_detail.logo" class="logo" v-if="pageIndex == 1" mode="widthFix" />
+      <view class="barrage-box" :style="pageIndex == 1 ? 'margin-top:0' : ''">
         <view class="text">{{ lottery_list }}</view>
       </view>
     </view>
 
     <!-- 立即参与页面 -->
-    <view class="page-1" v-if="pageIndex == 1">
+    <view class="page-1" v-if="pageIndex == 1" style="padding: 0 16rpx">
       <view class="activity-info">
         <text class="title">{{ acticve_detail?.name }}</text>
         <view class="active-rule">
@@ -24,7 +24,11 @@
     <!-- 答题页面 -->
     <view class="page-2" v-if="pageIndex == 2">
       <!-- 题干区域 -->
-      <view class="question">{{ question.title }}</view>
+      <view class="question">
+        <text>猜灯谜：{{ question.title }}</text>
+        <br />
+        <view style="margin-top: 20rpx">(请从下面选择正确答案提交)</view>
+      </view>
       <!-- 选项区域 -->
       <view class="options">
         <view :class="['option', { active: answer_id == item.id }]" v-for="item in question.answer_list" :key="item.id" @click="_handleSelectAnswer(item.id)">{{ item.value }}</view>
@@ -136,7 +140,6 @@ onShow(() => {
   console.log("回到小程序");
 
   if (detialId.value) {
-    console.log(1111);
     _getDeatail(detialId.value);
   }
 });
@@ -163,11 +166,10 @@ const _getDeatail = (id) => {
       acticve_detail.value = response.data;
       if (response.data.join_last > 0) {
         _getQuestion();
-        pageIndex.value = 2;
+        pageIndex.value = 1;
       }
       http.request("api/lottery_riddle_record/get_list_all", { lottery_id: response.data.lottery_id }).then((res) => {
         if (res.code == "success") {
-          console.log(res);
           if (res.data?.length > 0) {
             let str = "";
 
@@ -233,9 +235,11 @@ const _goLottery = () => {
     return;
   }
   uni.navigateTo({
-    url: `/pages/activity/lottery?id=${acticve_detail.value.lottery_id}`,
+    url: `/pages/activity/lottery?id=${acticve_detail.value.lottery_id}&activity_id=${detialId.value}`,
   });
-  pageIndex.value = 1;
+  setTimeout(() => {
+    pageIndex.value = 1;
+  }, 1000);
 };
 
 const _handleChangePage = (index) => {
@@ -264,7 +268,6 @@ const _handleChangePage = (index) => {
   .header {
     .logo {
       width: 100%;
-      height: 300rpx;
     }
     .barrage-box {
       padding: 10rpx;
@@ -308,6 +311,7 @@ const _handleChangePage = (index) => {
     align-items: center;
     flex-direction: column;
     justify-content: center;
+    box-sizing: border-box;
     .activity-info {
       padding-top: 100rpx;
       display: flex;
@@ -387,15 +391,15 @@ const _handleChangePage = (index) => {
         width: 100%;
         box-sizing: border-box;
         &.active {
-          background-color: #e7522f;
+          background-color: #ffd6a0;
         }
       }
     }
     .submit-btn {
       width: 100%;
       height: 80rpx;
-      background-color: #e7522f;
-      color: #fff;
+      background-color: #ffd6a0;
+      color: #7e4304;
       border-radius: 60rpx;
       display: flex;
       justify-content: center;

pages/activity/lottery.vue

@@ -26,6 +26,7 @@
           <text class="lottery_record_text">中奖记录</text>
         </button>
       </view>
+      <button open-type="share" class="share-btn">分享好友再答一次题</button>
     </view>
     <uni-popup ref="lotteryRule" type="center">
       <view class="lottery_rule_box">
@@ -108,12 +109,14 @@ export default {
       // 请求参数
       requestParam: {
         id: 0,
+        activity_id: 0,
       },
     };
   },
   onLoad(param) {
     // 接收参数
     this.requestParam.id = param.id;
+    this.requestParam.activity_id = param.activity_id;
     // 如果有scene参数的话，获取其中的ID
     if (param.scene) {
       // 转键值对参数
@@ -130,8 +133,20 @@ export default {
       // 地址列表
       this.addrList = data.list;
     });
+    // #ifdef MP-WEIXIN
+    //分享按钮
+    uni.showShareMenu({
+      withShareTicket: true,
+      menus: ["shareAppMessage", "shareTimeline"],
+    });
+    // #endif
+  },
+  onShareAppMessage(obj) {
+    return {
+      title: "正月十五猜灯谜",
+      path: "/pages/activity/index?id=" + this.requestParam.activity_id,
+    };
   },
-
   onShow() {
     // 没有数据的话，或者请求中，不允许刷新
     if (this.isReqing) return;
@@ -313,6 +328,20 @@ export default {
   margin: 0 auto;
   position: relative;
   background: linear-gradient(to bottom, #fc335f 0%, #fb7224 80%, #ffffff 100%);
+  .share-btn {
+    width: 80%;
+    height: 80rpx;
+    background-color: #f0370e;
+    color: #fff;
+    border-radius: 60rpx;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    padding: 16rpx;
+    margin-top: 60rpx;
+    box-sizing: border-box;
+    z-index: 100;
+  }
   .lottery_time {
     top: 0rpx;
     left: 35rpx;
@@ -330,7 +359,6 @@ export default {
   }
   .lottery_info {
     width: 750rpx;
-    height: 240rpx;
     overflow: hidden;
     margin: 0rpx auto;
     position: relative;