xiuli.gao
/
seafood


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281
							<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0,minimum-scale=1.0,user-scalable=0"
    />
    <title>海鲜阿嫂</title>
    <script type="text/javascript" src="../common/jquery-2.1.0.js"></script>
    <script type="text/javascript">
        document.documentElement.style.fontSize = 100 * (document.documentElement.clientWidth / 375) + "px";
        window.onresize = function () {
            document.documentElement.style.fontSize = 100 * (document.documentElement.clientWidth / 375) + "px";
        } 
    </script>
</head>
<style>
    body,div,ul,ol,dl,dd,h1,h2,h3,h4,h5,h6,figure,form,fieldset,legend,input,textarea,button,p,blockquote,th,td,pre,xmp{margin:0;padding:0;-webkit-overflow-scrolling: touch;}
    body,input,textarea,button,select,pre,xmp,tt,code,kbd,samp{line-height:1.5;font-family: -apple-system,SF UI Text,Helvetica Neue,Helvetica,Arial,sans-serif;}
    h1,h2,h3,h4,h5,h6{font-family:tahoma,arial,"Hiragino Sans GB","微软雅黑",simsun,sans-serif}
    .loading {
        position: fixed;
        top: 0;
        left: 0;
        display: none;
        width: 100%;
        height: 100vh;
        z-index: 99;
    }
    .loading img {
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        margin: auto;
        width: 0.3rem;
        height: 0.3rem;
    }
    .alert-info {
        position: fixed;
        top: 1.74rem;
        right: 0;
        left: 0;
        bottom: 0;
        text-align: center;
        z-index: 9;
    }
    .alert-info p {
        display: inline-block;
        text-align: left;
        height: 0.38rem;
        color: #fff;
        font-size: 0.14rem;
        line-height: 0.38rem!important;
        padding: 0 0.10rem;
        background-color: rgba(0, 0, 0, 0.7);
        border-radius: 5px;
    }
    body{
        width: 100%;
        height: 100%;
        background: #ffffff;
        padding-top: 0.1rem;
    }
    .content{
        width: calc(100% - 0.2rem);
        margin: auto;
        font-size: 0.14rem;
        line-height: 0.2rem;
        letter-spacing:0.1em;
        padding-bottom: 0.4rem;
    }
    img{
        width: 100%;
        margin: 0.1rem 0;
    }
    p{
        margin: 0.1rem 0;
    }
    .content_evm{
        text-align: center;
    }
    .content_evm img{
        width: 1.64rem;
        display:inline-block ;
        vertical-align: middle;
    }
    .content_evm .evm{
        width: 1.4rem;
    }
    .bottom{
        height: 0.5rem;
        width: 100%;
        background: #06af06;
        color: #ffffff;
        font-size: 0.14rem;
        line-height: 0.5rem;
        text-align: center;
        position: fixed;
        bottom: 0;
        left: 0;
    }
    .elasticFrameMask{
        position: fixed;
        left: 0;
        top: 0;
        width: 100%;
        height: 100vh;
        background: rgba(0, 0, 0, 0.7);
        display: none;
        text-align: center;
    }
    .elasticFrameMask .elasticFrame{
        width: 3rem;
        height: 2rem;
        position: absolute;
        top: 0;
        bottom: 0;
        left: 0;
        right: 0;
        margin: auto;
        background: #fff;
        border-radius: 0.06rem;
    }
    .elasticFrameMask .elasticFrame .content_evm{
        line-height: 0;
        margin-top: 0.1rem;
    }
    .elasticFrameMask .elasticFrame .content_evm .evm{
        width: 1.1rem;
        margin: 0;
    }
    .elasticFrameMask .elasticFrame .content_evm img{
        width: 1.3rem;
        margin: 0;
    }
    .elasticFrameMask .elasticFrame .hint{
        line-height: 0.2rem;
        font-size: 0.16rem;
        margin: 0;
        margin-top: 0.28rem;
        font-weight: bold;
    }
    .elasticFrameMask .elasticFrame .close{
        width: 0.3rem;
        height: 0.3rem;
        position: absolute;
        top: 0rem;
        right: 0.1rem;
    }
    #wechat_icon{
        position: fixed;
        right: 0.15rem;
        bottom: 2rem;
        width: 0.6rem;
        height: 0.6rem;
    }
</style>
<body>
    <section class="content"></section>
    <img src="./img/wechat-icon.gif" id="wechat_icon" onclick="$('.elasticFrameMask').show()"/>
    <div class="bottom" onclick="$('.elasticFrameMask').show()">点击添加专人客服，享立减10元优惠！</div>
    <!-- 弹框 -->
    <div class='elasticFrameMask'>
        <div class="elasticFrame">
            <img src="../template_img/close.jpg" class="close" onClick="$('.elasticFrameMask').hide()"/>
            <p class="hint">长按识别二维码加微信</p>
            <div class="content_evm"><img class="evm LongPress elasticFrameEvm" src=""/><img class="LongPress" src="https://seafood-h5.oss-cn-beijing.aliyuncs.com/img/fingerprint.png"/></div>
        </div>
    </div>
    <div class="alert-info" style="display: none;">
        <!-- tip提示,3s后消失 -->
        <p>请在浏览器中打开</p>
    </div>
    <!-- loading -->
    <div class="loading">
        <img src="../common/loading.gif" />
    </div>
</body>
<script>
    var qs = parseQueryString(window.location.href);
    var qrode_data = '';//接口传过来的数据
    var html = '';//模版文章
    $().ready(function () {
        getQrcode();

        var timeOutEvent = null;
        $(".content_evm").on({
            touchstart: function (e) {
                timeOutEvent = setTimeout(function () {
                    //此处为长按事件
                    addLongLog()
                }, 700);
            },
            touchmove: function () {
                clearTimeout(timeOutEvent);
            },
            touchend: function (e) {
                clearTimeout(timeOutEvent);
                return false;
            }
        });
    })

    function getQrcode() {
        if(!qs.id){
            showMsg('模版未找到！')
            return false;
        }
        $(".loading").show()
        $.ajax({
            url: '/api/template/qrcode',
            methods: 'get',
            data: {
                t_id: qs.id
            },
            success: function (res) {
                $(".loading").hide()
                if (res && res.errno == 0) {
                    qrode_data = res.rst;
                    if(res.rst.is_html == 1){
                        html = res.rst.article_html;
                        $('.elasticFrameEvm').attr('src',res.rst.qrcode)
                        html = html.replace(/\*\*酷炫海鲜销售二维码\*\*/g,'<div class="content_evm"><img class="evm LongPress" src="'+res.rst.qrcode+'"/><img class="LongPress" src="https://seafood-h5.oss-cn-beijing.aliyuncs.com/img/fingerprint.png"/></div>')
                        document.getElementsByClassName('content')[0].innerHTML = html;
                    }else{
                        showMsg('非文章模版')
                    }
                }else{
                    showMsg(res.err)
                }
            },
            error: function (err) {
                $(".loading").hide()
                showMsg('服务器错误')
            }
        })
    }
    function addLongLog() {
        //长按
        $.ajax({
            url: '/api/template/addLongLog',
            methods: 'get',
            data: {
                t_id: qs.id,
                ip: qrode_data.ip,
                saler_id: qrode_data.saler_id
            },
            success: function (res) {
                if (res && res.errno == 0) {
                    console.log('长按统计成功')
                }
            },
            error: function (err) {
            }
        })
    }

    // 展示错误提示信息
    function showMsg(msg) {
        var msgBox = document.getElementsByClassName('alert-info')[0];
        msgBox.getElementsByTagName("p")[0].innerHTML = msg;
        msgBox.style.display = "block";

        setTimeout(function () {
            msgBox.style.display = "none";

        }, 2000);
    }
    //获取地址栏参数
    function parseQueryString(url) {
        var urlObj = {};
        var reg = /([^?=&]+)=([^?=&]+)/g;
        url.replace(reg, function ($0, $1, $2) {
            urlObj[$1] = decodeURIComponent($2);
        })
        return urlObj;
    }
</script>