Răsfoiți Sursa

feat: 增加优惠弹框

cuiyalong 4 ani în urmă
părinte
comite
3e2bd2b244

+ 50 - 0
src/jfw/modules/app/src/web/staticres/jyapp/vipsubscribe/css/vip_purchase.css

@@ -938,20 +938,26 @@
   margin-top: .26rem!important;
 }
 
+/* 优惠弹框 */
+.discount-details .weui-half-screen-dialog__hd,
 .coupon-picker .weui-half-screen-dialog__hd {
   padding-left: 0;
   padding-right: 0;
 }
+
+.discount-details .icon-del-grey,
 .coupon-picker .icon-del-grey {
   padding-left: 0;
   padding-right: 0;
   order: 2;
 }
 
+.discount-details .weui-picker__bd,
 .coupon-picker .weui-picker__bd {
   padding: 0 0.2rem;
 }       
 
+.discount-details .weui-picker__group,
 .coupon-picker .weui-picker__group {
   position: relative;
   display: flex;
@@ -962,6 +968,50 @@
   border-bottom: 1px solid rgba(0, 0, 0, 0.05);
 }
 
+.discount-details .weui-mask,
+.discount-details .weui-picker {
+  bottom: 3.1rem;
+  min-height: unset;
+  transform: unset;
+}
+.discount-details .weui-picker__bd {
+  padding: 0;
+  padding-bottom: .36rem;
+  flex-direction: column;
+}
+.discount-details .details-bd-item {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding: .24rem 0;
+  font-size: .28rem;
+  line-height: .4rem;
+  color: #171826;
+}
+.discount-details .d-b-right .dis-price {
+    text-decoration: unset;
+}
+
+.discount-button {
+  display: none;
+  margin-right: .16rem;
+  padding: .03rem .06rem;
+  font-size: .2rem;
+  line-height: .28rem;
+  color: #9B9CA3;
+  background-color: #F5F7F7;
+  border-radius: 2px;
+}
+.discount-button .icon-arrow {
+  display: inline-block;
+  font-size: .2rem;
+  transform: rotate(90deg);
+}
+
+.text-red {
+  color: #FB483D;
+}
+
 .free-7day-tip {
   justify-content: space-between;
 }

+ 1 - 1
src/jfw/modules/app/src/web/templates/vipsubscribe/vip_introduce.html

@@ -48,7 +48,7 @@
                         <div class="active-r-text">2、活动期间,用户第一次购买超级订阅的订单参与此活动,多次购买无效。</div>
                         <div class="active-r-text">3、每个用户赠送1次超级订阅时长,赠送时长与购买时长相等,最多送1年。</div>
                         <div class="active-r-text">4、每个用户赠送剑鱼大会员专家版15天使用时长,仅在活动时间内领取有效。</div>
-                        <div class="active-r-text">5、此活动最终解释权归剑鱼标讯。</div>
+                        <div class="active-r-text">5、此活动最终解释权归剑鱼标讯所有。</div>
                     </div>
                 </div>
                 <div class="group-title">

+ 50 - 5
src/jfw/modules/app/src/web/templates/vipsubscribe/vip_purchase.html

@@ -214,6 +214,10 @@
                 </div>
                 {{if not .T.isTrial }}
                     <div class="origin-price" style="display:none;">
+                        <span class="discount-button">
+                            <span>优惠明细</span>
+                            <span class="iconfont icon-arrow"></span>
+                        </span>
                         <span class="price-label">原价:</span>
                         <div class="price-container">
                             <span class="currency-type">&yen;</span>
@@ -371,6 +375,43 @@
                     </div>
                 </div>
             </div>
+            <!-- 优惠明细 -->
+            <div class="j-picker adaption discount-details" style="display:none;">
+                <div class="weui-mask"></div>
+                <div class="weui-half-screen-dialog weui-picker">
+                    <div class="weui-half-screen-dialog__hd">
+                        <div class="weui-half-screen-dialog__hd__main">
+                            <strong class="weui-half-screen-dialog__title">优惠明细</strong>
+                        </div>
+                        <span class="j-icon icon-del-grey cancel"></span>
+                    </div>
+                    <div class="weui-half-screen-dialog__bd">
+                        <div class="weui-picker__bd">
+                            <div class="details-bd-item origin-price">
+                                <div class="d-b-left">原价</div>
+                                <div class="d-b-right">
+                                    <span class="dis-mon">&yen;</span>
+                                    <span class="dis-price price-num">0</span>
+                                </div>
+                            </div>
+                            <div class="details-bd-item">
+                                <div class="d-b-left">限时优惠</div>
+                                <div class="d-b-right text-red">
+                                    <span class="dis-mon">-&yen;</span>
+                                    <span class="dis-price">0</span>
+                                </div>
+                            </div>
+                            <div class="details-bd-item">
+                                <div class="d-b-left">实付</div>
+                                <div class="d-b-right text-red">
+                                    <span class="dis-mon">&yen;</span>
+                                    <span class="dis-price">0</span>
+                                </div>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
         </div>
         <script src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/local/jquery.min.js"></script>
         <script src="{{Cdns .Host "seo" "cdn"|SafeUrl}}/jyapp/local/weui.min.js"></script>
@@ -382,7 +423,14 @@
                     $(".j-notice-bar.bar-red.free-7day-tip.give").css('display', 'flex')
                     $("#giveTimeBox").show()
                     $(".origin-price").css('display', 'flex')
-
+                    $('.discount-button').show().on('click', function () {
+                        var details = $('.discount-details')
+                        if (details.is(':hidden')) {
+                            $('.discount-details').show()
+                        } else {
+                            $('.discount-details').hide()
+                        }
+                    })
                 } else {
                     $(".j-notice-bar.bar-red.free-7day-tip.give").hide()
                     $("#giveTimeBox").hide()
@@ -878,6 +926,7 @@
                 $('#pay_way').hide(200);
                 $('#time_cycle').hide(200);
                 $('.coupon-picker').hide()
+                $('.discount-details').hide()
             }
 
 
@@ -911,10 +960,6 @@
                         $(".industry_warn").css("display", "block");
                     }
                 }
-                // else {
-                //     $(".area_warn").css("display", "");
-                //     $(".industry_warn").css("display", "");
-                // }
 
                 sessionStorage.setItem("vipSub_read", checked)
 

+ 1 - 1
src/web/templates/weixin/vipsubscribe/vip_introduce.html

@@ -43,7 +43,7 @@
                             <div class="active-r-text">2、活动期间,用户第一次购买超级订阅的订单参与此活动,多次购买无效。</div>
                             <div class="active-r-text">3、每个用户赠送1次超级订阅时长,赠送时长与购买时长相等,最多送1年。</div>
                             <div class="active-r-text">4、每个用户赠送剑鱼大会员专家版15天使用时长,仅在活动时间内领取有效。</div>
-                            <div class="active-r-text">5、此活动最终解释权归剑鱼标讯。</div>
+                            <div class="active-r-text">5、此活动最终解释权归剑鱼标讯所有。</div>
                         </div>
                     </div>
                     <div class="group-title">