直播分享功能开发

README.md

@@ -10,7 +10,7 @@ images svn 地址
 svn://39.106.86.127:28386/projects/xd/proj_src/shop/frontend/web/xd
 svn://39.106.86.127:28386/projects/xd/proj_src/branches/dev_v2.0/shop/frontend/web/xd/
 
-(/images/)(\S*(?=["|']))
+(/images/)(\S\*(?=["|']))
 {{imageUrl}}$2?t={{Timestamp}}
 
 ui问题
@@ -24,7 +24,7 @@ showModel颜色统一
 wx.showModal({
   confirmColor: '#8c75d0',
   cancelColor: '#141515',
-});
+})
 ```
 
 审核账号

project.private.config.json

@@ -23,11 +23,18 @@
     "miniprogram": {
       "list": [
         {
+          "name": "patient/pages/liveResult/index",
+          "pathName": "patient/pages/liveResult/index",
+          "query": "id=30&rewardScore=undefined",
+          "scene": null,
+          "launchMode": "default"
+        },
+        {
           "name": "医生-患者详情",
           "pathName": "pages/d_patientDetail/index",
           "query": "id=21",
-          "scene": null,
-          "launchMode": "default"
+          "launchMode": "default",
+          "scene": null
         },
         {
           "name": "患者-qol结果",

src/components/popup/index.scss

@@ -126,6 +126,15 @@
   }
 }
 
+.popup6 {
+  width: 590rpx;
+  height: 880rpx;
+  .p-img {
+    width: 100%;
+    height: 100%;
+  }
+}
+
 .close {
   margin: 48rpx auto 0;
   display: block;

src/components/popup/index.wxml

@@ -23,7 +23,9 @@
           <view class="nickname">{{params.Name}}医生</view>
           <view class="hostipal">
             {{params.HospitalName}}
-            <view class="tag" wx:if="{{params.HospitalClassificationName || params.HospitalLevel}}">{{params.HospitalClassificationName}}{{params.HospitalLevel}}</view>
+            <view class="tag" wx:if="{{params.HospitalClassificationName || params.HospitalLevel}}">
+              {{params.HospitalClassificationName}}{{params.HospitalLevel}}
+            </view>
           </view>
         </view>
       </view>
@@ -52,6 +54,9 @@
       <view class="btn" bind:tap="handleOk">继续</view>
     </view>
   </view>
+  <view class="popup6" wx:if="{{type==='popup6'}}">
+    <image class="p-img" src="{{imageUrl}}bg20.png?t={{Timestamp}}" show-menu-by-longpress></image>
+  </view>
 
   <image
     wx:if="{{params.close}}"

src/patient/pages/liveDetail/index.json

@@ -7,6 +7,7 @@
     "van-icon": "@vant/weapp/icon/index",
     "customPoster": "/components/customPoster/index",
     "navbar": "/components/navbar/index",
-    "van-popup": "@vant/weapp/popup/index"
+    "van-popup": "@vant/weapp/popup/index",
+    "popup": "/components/popup/index"
   }
 }

src/patient/pages/liveDetail/index.scss

@@ -116,6 +116,14 @@
         z-index: 1;
       }
     }
+    .answer {
+      margin-top: 32rpx;
+      .a-img {
+        display: block;
+        width: 100%;
+        height: 230rpx;
+      }
+    }
     .content {
       margin-top: 24rpx;
       .c-title {
@@ -138,7 +146,31 @@
     box-sizing: border-box;
     background-color: #fff;
     box-shadow: 0rpx 8rpx 48rpx 0rpx rgba(0, 0, 0, 0.19);
+    .btn-wrap {
+      display: flex;
+      align-items: center;
+      justify-content: space-between;
+      gap: 22rpx;
+      .office {
+        width: 220rpx;
+        height: 88rpx;
+        border: 1px solid #b982ff;
+        display: flex;
+        align-items: center;
+        justify-content: center;
+        gap: 14rpx;
+        font-size: 32rpx;
+        color: #b982ff;
+        box-sizing: border-box;
+        border-radius: 100rpx;
+        .icon {
+          width: 40rpx;
+          height: 40rpx;
+        }
+      }
+    }
     .btn {
+      flex: 1;
       height: 88rpx;
       background: linear-gradient(197deg, #ffbcf9 0%, #b982ff 100%);
       border-radius: 44rpx;
@@ -151,8 +183,8 @@
         background: #e7e7e7;
       }
       &.active1 {
-        color: #B982FF;
-        background: #F2E8FF;
+        color: #b982ff;
+        background: #f2e8ff;
       }
     }
   }

src/patient/pages/liveDetail/index.ts

@@ -11,6 +11,12 @@ Page({
     posterUrl: '',
     params: {},
     play: false,
+
+    popupShow: false,
+    popupType: 'popup6', // 登录失败弹窗
+    popupParams: {
+      close: true,
+    } as any,
   },
   videoContext: {} as WechatMiniprogram.VideoContext,
   onLoad(options) {
@@ -302,6 +308,25 @@ Page({
       },
     })
   },
+  handleOffice() {
+    this.setData({
+      popupShow: true,
+      popupType: 'popup6',
+      popupParams: {
+        close: true,
+      },
+    })
+  },
+  handlePopupCancel() {
+    this.setData({
+      popupShow: false,
+    })
+  },
+  handleAnswer() {
+    wx.navigateTo({
+      url: `/pages/webview/index?url=${encodeURIComponent('https://shop.show.hbsaas.com/statics/#/?nId=bz56')}`,
+    })
+  },
   onShareAppMessage() {
     this.saveShare()
     return {

src/patient/pages/liveDetail/index.wxml

@@ -55,6 +55,9 @@
         </swiper-item>
       </swiper>
     </view>
+    <view class="answer" bind:tap="handleAnswer">
+      <image class="a-img" src="/images/bg21.png"></image>
+    </view>
     <view class="content">
       <view class="c-title">详情介绍</view>
       <image class="c-img" mode="widthFix" src="{{item.url}}" wx:for="{{detail.DetailJson}}" wx:key="name"></image>
@@ -71,7 +74,13 @@
         <block wx:elif="{{detail.SignUpStatus==2}}">
           <view class="btn" wx:if="{{detail.BeginTimeValue * 1 < dateValue * 1}}" bind:tap="handleLive">点此参加</view>
           <!-- <view class="btn" wx:else bind:tap="handleResult">已报名,查看活动码</view> -->
-          <view class="btn active1" wx:else bind:tap="handleShare">已报名,查看活动码</view>
+          <view class="btn-wrap" wx:else>
+            <view class="office" bind:tap="handleOffice">
+              <image class="icon" src="{{imageUrl}}icon75.png?t={{Timestamp}}"></image>
+              提醒我
+            </view>
+            <view class="btn active1" bind:tap="handleShare">已报名,查看活动码</view>
+          </view>
         </block>
         <block wx:elif="{{detail.SignUpStatus==3}}">
           <view
@@ -131,4 +140,13 @@
     <view class="tip" bind:tap="handleDownload">长按图片保存或分享</view>
   </view>
 </van-popup>
+
 <customPoster wx:if="{{detail.PosterUrl}}" params="{{params}}" bind:finish="handlePosterFinish"></customPoster>
+
+<popup
+  show="{{popupShow}}"
+  type="{{popupType}}"
+  params="{{popupParams}}"
+  bind:ok="handlePopupOk"
+  bind:cancel="handlePopupCancel"
+></popup>

src/patient/pages/liveResult/index.scss

@@ -2,13 +2,20 @@ page {
   background: linear-gradient(180deg, #f9f9f9 0%, #f9f9f9 100%);
 }
 .page {
-  min-height: 100vh;
+  width: 100vw;
+  overflow-x: hidden;
+  min-height: 120vh;
   position: relative;
   padding-bottom: 100rpx;
   .bg {
+    position: absolute;
+    left: 50%;
+    top: 0;
+    transform: translateX(-50%);
     background: linear-gradient(197deg, #ffbcf9 0%, #b982ff 100%);
-    height: 776rpx;
-    border-radius: 0 0 100rpx 100rpx;
+    width: 120vw;
+    height: 656rpx;
+    border-radius: 0 0 140rpx 140rpx;
   }
   .page-container {
     position: absolute;
@@ -47,17 +54,44 @@ page {
         color: #484848;
       }
     }
+    .office {
+      margin: 24rpx 40rpx 0;
+      padding: 48rpx 0 32rpx;
+      background: #ffffff;
+      border-radius: 24rpx 24rpx 24rpx 24rpx;
+      .o-title {
+        font-size: 32rpx;
+        color: #211d2e;
+        text-align: center;
+      }
+      .code {
+        margin: 24rpx auto 0;
+        display: block;
+        width: 284rpx;
+        height: 284rpx;
+      }
+      .btn {
+        margin: 24rpx auto 0;
+        width: 286rpx;
+        height: 56rpx;
+        text-align: center;
+        line-height: 56rpx;
+        background: #b982ff;
+        border-radius: 74rpx 74rpx 74rpx 74rpx;
+        font-size: 32rpx;
+        color: #ffffff;
+      }
+    }
     .container {
       position: relative;
-      margin: 64rpx 40rpx 0;
+      margin: 12rpx 40rpx 0;
       width: calc(100% - 80rpx);
 
       .c-content {
         padding: 40rpx;
         position: relative;
         top: 20rpx;
-        left: 20rpx;
-        width: calc(100% - 40rpx);
+        left: 0;
         background: #fff;
         box-shadow: 0rpx 4rpx 40rpx 0rpx rgba(0, 0, 0, 0.06);
         border-radius: 24rpx;

src/patient/pages/liveResult/index.wxml

@@ -1,5 +1,11 @@
 <navbar fixed title="" custom-style="background:{{background}}">
-  <van-icon name="arrow-left" slot="left"  size="18px" color="background=='#FFFFFF'?'#000':'#fff'" bind:tap="handleBack" />
+  <van-icon
+    name="arrow-left"
+    slot="left"
+    size="18px"
+    color="background=='#FFFFFF'?'#000':'#fff'"
+    bind:tap="handleBack"
+  />
 </navbar>
 <!-- padding-top:{{pageTop+22}}px; -->
 <view class="page" style="background: url('{{imageUrl}}bg10.png?t={{Timestamp}}') no-repeat top center/100% 610rpx">
@@ -8,6 +14,11 @@
     <image class="badge" mode="aspectFit" src="{{imageUrl}}icon43.png?t={{Timestamp}}"></image>
     <view class="status">报名成功</view>
     <view class="tip">欢迎您参与此次活动</view>
+    <view class="office">
+      <view class="o-title">关注公众号，活动提醒不错过</view>
+      <image class="code" src="{{imageUrl}}code1.png?t={{Timestamp}}" show-menu-by-longpress></image>
+      <view class="btn">长按识别二维码</view>
+    </view>
     <view class="container">
       <view class="c-content">
         <image class="banner" src="{{liveDetail.IntroductionUrl}}"></image>