feat： 解锁展示;

pages/video/detail.wxml

@@ -72,12 +72,20 @@
                 mode="aspectFill"
               />
               <view class="play-button-container">
-                <view class="play-button">
+                <view class="play-button" wx:if="{{ !item.lock }}">
                   <image
                     class="play-icon"
                     src="/assets/images/icon-video-play.png"
                   ></image>
                 </view>
+
+                <view class="play-button-lock" wx:else>
+                  <image
+                    class="play-icon"
+                    src="/assets/images/icon-lock.png"
+                  ></image>
+                  <view class="play-button-lock-title">观看广告解锁完整内容</view>
+                </view>
               </view>
             </view>
   

pages/video/detail.wxss

@@ -437,6 +437,21 @@ page {
   justify-content: center;
 }
 
+.play-button-lock {
+  /* width: 100rpx; */
+  height: 100rpx;
+  text-align: center;
+  /* display: flex;
+  align-items: center;
+  justify-content: center; */
+}
+
+.play-button-lock-title {
+  width: 100%;
+  color: yellow;
+  font-weight: 600;
+}
+
 .play-icon {
   width: 100rpx;
   height: 100rpx;

pages/video/video.wxml

@@ -46,12 +46,20 @@
                 mode="aspectFill"
               />
               <view class="play-button-container">
-                <view class="play-button">
+                <view class="play-button" wx:if="{{ !item.lock }}">
                   <image
                     class="play-icon"
                     src="/assets/images/icon-video-play.png"
                   ></image>
                 </view>
+
+                <view class="play-button-lock" wx:else>
+                  <image
+                    class="play-icon"
+                    src="/assets/images/icon-lock.png"
+                  ></image>
+                  <view class="play-button-lock-title">观看广告解锁完整内容</view>
+                </view>
               </view>
             </view>
 

pages/video/video.wxss

@@ -134,6 +134,21 @@
   justify-content: center;
 }
 
+.play-button-lock {
+  /* width: 100rpx; */
+  height: 100rpx;
+  text-align: center;
+  /* display: flex;
+  align-items: center;
+  justify-content: center; */
+}
+
+.play-button-lock-title {
+  width: 100%;
+  color: yellow;
+  font-weight: 600;
+}
+
 .play-icon {
   width: 100rpx;
   height: 100rpx;