拼团详情页修改

@@ -16,44 +16,59 @@
             {{#if empty}}
             <div class="meb-item empty"></div>
             {{else}}
-                <div class="meb-item">
-                    <img class="avatar" src="{{image2 headUrl w=160 h=160}}" alt="">
-                    {{#if @first}}
-                    <span class="leader-badge"></span>
-                    {{/if}}
-                </div>
+            <div class="meb-item">
+                <img class="avatar" src="{{image2 headUrl w=160 h=160}}" alt="">
+                {{#if @first}}
+                <span class="leader-badge"></span>
+                {{/if}}
+            </div>
             {{/if}}
             {{/membershipItems}}
         </div>
 
-        {{#ifcond pageGo '===' 7}}
-            <div class="status-text">拼团失败</div>
-            <div class="status-btn">查看更多拼团活动</div>
+        {{#ifcond pageGo '===' 1}}
+        <div class="status-text">还差{{lackNum}}人拼团成功，剩余时间</div>
+        <div class="status-btn positive">邀请小伙伴拼团</div>
         {{/ifcond}}
 
-        {{#ifcond pageGo '===' 6}}
-            <div class="status-text">拼团失败</div>
+        {{#ifcond pageGo '===' 2}}
+        <div class="status-text">还差{{lackNum}}人拼团成功，剩余时间</div>
+        {{/ifcond}}
+
+        {{#ifcond pageGo '===' 3}}
+        <div class="status-text">还差{{lackNum}}人拼团成功，剩余时间</div>
+        <div class="status-btn positive">邀请小伙伴拼团</div>
         {{/ifcond}}
 
         {{#ifcond pageGo '===' 4}}
-            <div class="status-text">拼团成功</div>
+        <div class="status-text">拼团成功</div>
         {{/ifcond}}
 
         {{#ifcond pageGo '===' 5}}
-            <div class="status-text">你来晚了 你的好友拼团已经成功</div>
+        <div class="status-text">你来晚了 你的好友拼团已经成功</div>
+        {{/ifcond}}
+
+
+        {{#ifcond pageGo '===' 6}}
+        <div class="status-text">拼团失败</div>
+        {{/ifcond}}
+
+        {{#ifcond pageGo '===' 7}}
+        <div class="status-text">拼团失败</div>
+        <div class="status-btn">查看更多拼团活动</div>
         {{/ifcond}}
 
         <a class="tip" href="http://m.yohobuy.com/activity/group">支付开团-支付参团-凑齐人数发货-凑不齐退款 玩法介绍》</a>
     </div>
     {{/data}}
     <div class="divide"></div>
-    <div class="banner"></div>
+    <div class="banner official-account"></div>
     <div class="divide zero-margin"></div>
     <div class="recommend">
         <p class="rec-title">看看其他拼团商品</p>
         {{# @root.data.recommend.collageProductVoList}}
         <div class="product-item">
-            <img src="{{image2 defaultImages w=200 h=282}}" alt="" class="prd-item-img">
+            <img data-original="{{image2 defaultImages w=200 h=282}}" alt="商品图片" class="prd-item-img lazy">
             <div class="prd-info">
                 <div class="prd-name">{{productName}}</div>
                 <div class="price">
@@ -71,4 +86,5 @@
         </div>
         {{/@root.data.recommend.collageProductVoList}}
     </div>
+    <a href="../group"><img class="browse-more" src="https://cdn.yoho.cn/uploads/1544494149810/more.png"></img></a>
 </div>

 import 'scss/activity/group/group-progress.page.scss';
+import $ from 'yoho-jquery';
+import Page from 'js/yoho-page';
+import Clipboard from 'clipboard';
+import share from 'js/common/share';
+import dialog from 'js/plugin/dialog';
+import lazyLoad from 'yoho-jquery-lazyload';
+
+class GroupProgress extends Page {
+    constructor() {
+        super();
+
+        this.selector = {
+            $page: $('.group-progress'),
+            $copyAccount: $('.official-account'),
+        };
+
+        this.init();
+    }
+
+    init() {
+        lazyLoad(this.selector.$page.find('img.lazy'));
+        share({});
+        this.bindEvents();
+    }
+
+    bindEvents() {
+        this.selector.$copyAccount.on('click', this.copyAccount.bind(this));
+    }
+
+    copyAccount() {
+        let clipboard = new Clipboard('.official-account', {
+            text: function() {
+                return '有货有';
+            }
+        });
+
+        clipboard.on('success', function() {
+            dialog.showDialog({
+                dialogText: '成功复制公众号，赶紧去关注吧',
+                hasFooter: {
+                    centerBtnText: '确认'
+                }
+            }, function() {
+                window.location.href = 'weixin://';
+            });
+        });
+    }
+}
+
+$(() => {
+    new GroupProgress();
+});
+
+
+

@@ -35,6 +35,10 @@
         border-radius: 40px;
         background-color: #000;
         transform: translateX(-50%);
+
+        &.positive {
+            background: #d0021b;
+        }
     }
 
     .inner-card {
@@ -241,4 +245,12 @@
             border-bottom-right-radius: 30px;
         }
     }
+
+    .browse-more {
+        position: fixed;
+        right: 16px;
+        bottom: 100px;
+        width: 104px;
+        height: 110px;
+    }
 }