Browse Source

Merge branch 'websocket' of 121.43.114.153:/home/git/repositories/shopnc into websocket

stanley-king 7 years ago
parent
commit
e0d7f29623

+ 109 - 19
data/resource/mobile/bargain/css/main.css

@@ -6,7 +6,6 @@ body {
     color: #000000;
     font: 26px PingFang SC;
     line-height: 1;
-    background: #ef3c3e;
 }
 img {
     width: 100%;
@@ -30,24 +29,37 @@ ul,li {
     width: 750px;
     max-height: 100%;
     overflow: hidden;
+    background: #e93d4a;
 }
 .goods {
     display: flex;
     position: relative;
-    margin-top: 20px;
+    padding-top: 39px;
+    padding-bottom: 45px;
+    background: #ffffff;
+    border-bottom-left-radius: 30px;
+    border-bottom-right-radius: 30px;
 }
 .thumbnail {
-    width: 220px;
-    height: 220px;
-    margin-left: 33px;
+    width: 207px;
+    height: 194px;
+    margin-left: 88px;
     border: 1px solid #f4f4f4;
 }
+.thumbnail img {
+    border-radius: 10px;
+}
 .introduce {
-    width: 380px;
-    margin-left: 68px;
-    padding-top: 15px;
+    width: 350px;
+    margin-left: 22px;
+    padding-top: 10px;
 }
 .introduce .goods_name {
+    overflow : hidden;
+    text-overflow: ellipsis;
+    display: -webkit-box;
+    -webkit-line-clamp: 2;
+    -webkit-box-orient: vertical;
     line-height: 1.5;
     margin-bottom: 20px;
 }
@@ -117,7 +129,7 @@ ul,li {
     width: 718px;
     box-sizing: border-box;
     color: #ffffff;
-    background: url(../images/bargain_btn.png) no-repeat;
+    background: url(../images/bargain_btn.png?v=1) no-repeat;
     background-size: 100% 100%;
 }
 .join_btn {
@@ -183,7 +195,7 @@ ul,li {
     color: #fad952;
 }
 .users_list li .user {
-    width: 350px;
+    width: 340px;
     font-size: 28px;
     line-height: 1.3;
 }
@@ -319,10 +331,15 @@ ul,li {
     margin-left: 10px;
     padding-left: 25px;
 }
+.send_input p {
+    text-align: left;
+    color: #6d6d6d;
+}
 .send_msg {
     border: 0;
     font-size: 24px;
     height: 60px;
+    line-height: 60px;
     width: 138px;
     background: #f44056;
     color: #fff;
@@ -369,8 +386,8 @@ ul,li {
     }
 }
 .main {
-    background: url("../images/bg.jpg") no-repeat;
-    padding-top: 299px;
+    background: url("../images/bg.jpg?v=1") no-repeat;
+    padding-top: 352px;
     box-sizing: border-box;
 }
 .bargain_details {
@@ -379,8 +396,6 @@ ul,li {
     width: 714px;
     margin: 0 auto;
     border-radius: 20px;
-    background: #fff;
-    padding: 0 22px 22px 22px;
 }
 .bargain_details .head_portrait {
     position: absolute;
@@ -389,7 +404,7 @@ ul,li {
     width: 124px;
     height: 124px;
     border-radius: 100px;
-    border: 3px solid #ffffff;
+    border: 3px solid #ffe53f;
     box-sizing: border-box;
 }
 .bargain_details .sponsor {
@@ -397,9 +412,10 @@ ul,li {
     top: -154px;
     left: 200px;
     width: 306px;
-    height: 182px;
+    height: 177px;
     background: url(../images/light.png) no-repeat;
     background-size: 100%;
+    z-index: 100;
 }
 .bargain_details .sponsor_name {
     position: absolute;
@@ -411,16 +427,20 @@ ul,li {
     color: #999999;
     font-size: 34px;
     text-align: center;
-    padding-top: 134px;
+    padding-top: 117px;
+    background:rgba(255,255,255,0.8);
+    border-top-left-radius: 30px;
+    border-top-right-radius: 30px;
 }
 .bargain_details .title:after {
     content: "";
     position: absolute;
-    left: 0;
+    left: 20px;
     bottom: 0;
     width: 670px;
     height: 1px;
-    background: #f3f3f3;
+    border-bottom: 2px dashed #f7f5f0;
+    z-index: 100;
 }
 .bargain_details .title h3 {
     font-size: 39px;
@@ -504,4 +524,74 @@ ul,li {
     height: 100px;
     background: url("../images/join_btn2.jpg") no-repeat;
     background-size: 100% 100%;
+}
+
+.input_pop {
+    position: fixed;
+    top: 0;
+    left: 0;
+    bottom: 0;
+    right: 0;
+    background: rgba(0,0,0,0.7);
+    z-index: 999;
+}
+
+.answer_comments {
+    position: absolute;
+    width: 650px;
+    height: auto;
+    top: 360px;
+    left: 50%;
+    margin-left: -325px;
+    margin-top: -180px;
+    z-index: 16000; }
+.answer_comments .comments_box {
+    width: 650px;
+    height: auto;
+    margin: 0 auto; }
+.answer_comments .comments_box .comments {
+    display: block;
+    width: 650px;
+    height: 240px;
+    font-size: 26px;
+    padding: 50px 30px;
+    resize: none;
+    outline: none;
+    border-radius: 0;
+    border: none; }
+.answer_comments .comments_submit {
+    overflow: hidden;
+    background: #F2F2F2;
+    text-align: right;
+    padding: 19px; }
+.answer_comments .comments_submit .submit {
+    vertical-align: middle;
+    text-align: center;
+    background: #e93d4a;
+    color: #fff;
+    width: 120px;
+    height: 50px;
+    border: 1px solid #e93d4a;
+    border-radius: 10px;
+    padding: 1px 25px;
+    font-size: 24px; }
+.answer_comments .comments_submit .submit.submited {
+    background: #c7c7c7; }
+.answer_comments .handle {
+    background: #F2F2F2; }
+.answer_comments .handle:after {
+    content: '';
+    bottom: 0;
+    left: 0;
+    width: 100%;
+    height: 1px;
+    background: #c7c7c7; }
+.input_pop .close_btn {
+    position: absolute;
+    top: -22px;
+    right: -27px;
+    width: 72px;
+    height: 72px;
+    background: url("../images/close_btn.png") no-repeat;
+    background-size: 100% 100%;
 }

BIN
data/resource/mobile/bargain/images/bargain_btn.png


BIN
data/resource/mobile/bargain/images/bg.jpg


+ 1 - 1
mobile/control/control.php

@@ -300,7 +300,7 @@ class mbMemberControl extends mobileControl
 
 function bonus_version()
 {
-    return "v=20171226";
+    return "v=20180130";
 }
 function shop_version()
 {

+ 52 - 24
mobile/templates/default/bargain/bargain.php

@@ -19,10 +19,7 @@
                     <img class="head_portrait" src="<?php echo $output['tpl']->creator_avatar();?>">
                     <span class="sponsor_name">熊猫美妆</span>
                 </div>
-                <header class="title">
-                    <h3>我在<span class="logo">熊猫美妆</span>发现一件好货</h3>
-                    <p>帮我砍到0元免费拿吧!</p>
-                </header>
+                <header class="title"></header>
                 <?php $output['tpl']->show_goods(); ?>
             </div>
 
@@ -52,11 +49,11 @@
     </div>
 </div>
 <div class="fixed_bottom" id="fixed_bottom">
-    <div>
-        <input type="text" placeholder="我想说几句" class="send_input" id="send_msg">
+    <div class="send_input">
+        <p>我想说几句</p>
     </div>
     <div>
-        <button class="send_msg" id="send_btn">发送</button>
+        <div class="send_msg">发送</div>
     </div>
     <div>
         <button class="download_app" id="download_app">下载app</button>
@@ -72,6 +69,18 @@
     </div>
 </div>
 
+<div class="input_pop hide">
+    <div class="answer_comments">
+        <div class="comments_box">
+            <textarea id="send_msg" cols="30" rows="10" maxlength="150" minlength="1" class="comments" placeholder="我来说几句"></textarea>
+        </div>
+        <div class="comments_submit">
+            <button type="button" id="send_btn" class="comments_submit submit">发送</button>
+        </div>
+        <span class="close_btn"></span>
+    </div>
+</div>
+
 <script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js?<?php echo bonus_version(); ?>"></script>
 <script type="text/javascript" src="<?php echo RESOURCE_SITE_URL; ?>/mobile/comm/wx_share.js?<?php echo bonus_version(); ?>"></script>
 <script type="text/javascript" src="<?php echo RESOURCE_SITE_URL; ?>/mobile/shake/js/zepto.min.js"></script>
@@ -292,26 +301,10 @@
         });
     };
 
-    //砍价按钮
-    $('#bargain_btn').on('click',function(){
-        $(this).addClass('hide');
-        $('.pop').removeClass('hide');
-        $('.join_btn').removeClass('hide');
-        websocket.bargain();
-    });
-
     $('.close_btn').on('click',function(){
         $('.pop').addClass('hide');
     });
 
-    //发送信息
-    $('#send_btn').on('click',function(){
-        var sendMsg = $('#send_msg').val();
-        if(!sendMsg){return;}
-        websocket.send(sendMsg);
-        $('#send_msg').val('');
-    });
-
     //判断用户设备下载app
     var bridge = new Bridge();
     function download_app(){
@@ -332,7 +325,8 @@
         download_app();
     });
 
-    var room    =  <?php echo $output['room']['room']; ?>;
+    //var room    =  <?php //echo $output['room']['room']; ?>;
+    var room    =  null;
     var roomkey = "<?php echo $output['room']['room_key']; ?>";
     var addr    = "<?php echo $output['room']['addr']; ?>";
 
@@ -396,6 +390,40 @@
             alert(e.message)
         }
     }
+
+    //砍价按钮
+    $('#bargain_btn').on('click',function(){
+        $(this).addClass('hide');
+        $('.pop').removeClass('hide');
+        $('.join_btn').removeClass('hide');
+        websocket.bargain();
+    });
+
+    //发送信息
+    $('#send_btn').on('click',function(){
+        var sendMsg = $('#send_msg').val();
+        if(!sendMsg){return;}
+        websocket.send(sendMsg);
+        $('#send_msg').val('');
+        $('.input_pop').addClass('hide');
+    });
+
+    //弹起输入框
+    $('.send_input').on('click',function(){
+        $('.input_pop').removeClass('hide');
+        $('#send_msg').focus();
+    });
+
+    $('.send_msg').on('click',function(){
+        $('.input_pop').removeClass('hide');
+        $('#send_msg').focus();
+    });
+
+    //关闭输入框
+    $('.close_btn').on('click',function(){
+        $('.input_pop').addClass('hide');
+    });
+
 </script>
 </body>
 </html>