<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>我的身边店</title>
    <meta name="description" content="">
    <meta name="keywords" content="">
    <meta name="viewport" content="width=device-width,initial-scale=1.0">
    <link type="image/x-icon" rel="icon" href="//static.shenbd.com/lib/img/favicon-hd.ico" />
    <link type="image/x-icon" rel="shortcut icon" href="//static.shenbd.com/lib/img/favicon.ico" />
    <style>
        body,blockquote,h1,h2,h3,h4,h5,h6,p,pre,dd,form,figure{margin:0}
        legend{padding:0}
        menu,ol,ul,dl,fieldset,input,textarea{margin:0;padding:0}
        audio,video,canvas{*display:inline;*zoom:1}
        :link,:visited{text-decoration:none}
        [hidden],template{display:none}
        a{text-decoration:none;background-color:transparent;-webkit-text-decoration-skip:objects}
        address,cite,em{font-style:normal}
        code,kbd,samp,tt{font-family:inherit;font-size:100%}
        img{border-style:none;vertical-align:middle}
        svg:not(:root){overflow:hidden}
        summary{display:list-item}
        h1,h2,h3,h4,h5,h6{font-size:100%}
        small{font-size:83.3%}
        sub,sup{position:relative;font-size:75%;line-height:0;vertical-align:baseline}
        table{border-collapse:collapse;border-spacing:0}
        menu,ol,ul{list-style:none outside none}
        fieldset{border:0}
        textarea{-webkit-appearance:none;overflow-y:auto}
        button,input,select,textarea{margin:0;font-family:inherit;font-size:100%}
        button,input{overflow:visible}
        button,select{text-transform:none}
        button::-moz-focus-inner,[type="button"]::-moz-focus-inner,[type="reset"]::-moz-focus-inner,[type="submit"]::-moz-focus-inner{border-style:none;padding:0}
        button:-moz-focusring,[type="button"]:-moz-focusring,[type="reset"]:-moz-focusring,[type="submit"]:-moz-focusring{outline:none}
        [type="checkbox"],[type="radio"]{box-sizing:border-box;padding:0}
        [type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}
        [type="search"]{-webkit-appearance:textfield;outline-offset:-2px}
        ::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}
        article,aside,details,figcaption,figure,footer,header,main,menu,nav,section{display:block}
        mark{background:#ff0;color:#000}
        progress{display:inline-block;vertical-align:baseline}
        .fl{float:left}
        .fr{float:right}
        *html .clearfix{zoom:1}
        *+html .clearfix{zoom:1}
        .clearfix:after{content:'\0020';display:table;clear:both}
        .fs12{font-size:12px}
        .fs14{font-size:14px}
        .fb{font-weight:bolder}
        .tc{text-align:center}
        .tl{text-align:left}
        .tr{text-align:right}
        .global-footer{line-height:2;text-align:center}
        .global-footer a:link{text-decoration:none}
        .global-footer a:visited{text-decoration:none}
        .global-footer a:hover{text-decoration:underline}
        .global-footer a:active{text-decoration:underline}

        .header .address:before, .header .follow:before, .notice:before, .footer:before { background-image: url("//static.shenbd.com/www/index/2018/img/app-share/sprite-app-share.png"); background-repeat: no-repeat; display: inline-block; vertical-align: middle; overflow: hidden; }

        body { background: #fff; font-size: 14px; line-height: 1.5; font-family: "Helvetica Neue", Tahoma, "Microsoft Yahei", "PingFang SC", "ST Heiti", SimHei, sans-serif, "Helvetica Neue", Tahoma, SimSun, "PingFang SC", "ST Heiti", sans-serif; }

        .wrap { max-width: 750px; margin: 0 auto; }

        .header .address:before, .header .follow:before, .notice:before, .footer:before { background-image: url("//static.shenbd.com/www/index/2018/img/app-share/sprite-app-share.png"); background-repeat: no-repeat; display: inline-block; vertical-align: middle; overflow: hidden; }

        body { background: #fff; font-size: 14px; line-height: 1.5; font-family: "Helvetica Neue", Tahoma, "Microsoft Yahei", "PingFang SC", "ST Heiti", SimHei, sans-serif, "Helvetica Neue", Tahoma, SimSun, "PingFang SC", "ST Heiti", sans-serif; }

        .wrap { max-width: 750px; margin: 0 auto; }

        .header { background-position: top center; background-repeat: no-repeat; font-size: 22px; }
        .header-c1 { position: relative; }
        .header-c2 { padding: 16px 4% 30px; }
        .header .header-bg { width: 750px; height: 314px; display: block; }
        .header .address { font-size: 30px; position: absolute; top: 30px; left: 4%; padding-left: 34px; text-shadow: 1px 1px 1px rgba(255,255,255,.8);}
        .header .address:before { position: absolute; content: ''; width: 24px; height: 28px; left: 0; top: 8px; }
        .header .info { overflow: hidden; line-height: 60px; }
        .header .follow { float: right; color: #ff3419; border: 1px solid #ff3b1a; border: 1px solid rgba(255, 59, 26, 0.5); line-height: 36px; padding: 0 8px 0 36px; border-radius: 18px; margin: 11px 0 0 1em; font-size: 20px; position: relative; }
        .header .follow:before { content: ''; width: 30px; height: 20px; background-position: -30px 0; position: absolute; left: 8px; top: 50%; margin-top: -10px; }
        .header .shop-name { overflow: hidden; font-size: 40px; }
        .header .time { margin-top: 12px; }
        .header .tag { font-size: 0; margin: 10px -10px 0; }
        .header .tag p { display: inline-block; font-size: 22px; padding: 0 .72em; border-radius: .8em; border: 1px solid #212121; border: 1px solid rgba(50, 43, 34, 0.5); margin: 20px 10px 0; white-space: nowrap; line-height: 1.6; }

        .notice { position: relative; padding-left: 65px; color: #ff8b25; font-size: 22px; }
        .notice:before { content: ''; width: 48px; height: 40px; background-position: 0 -40px; position: absolute; left: 0; top: 15px; }
        .notice-in { border: 1px solid #ff8b25; padding: 12px 3.2258064516% 6px; border-radius: 12px; position: relative; }
        .notice-in:before, .notice-in:after { content: ''; position: absolute; }
        .notice-in:before { color: #ff8b25; left: -16px; border-left: 8px dashed transparent; border-top: 8px dashed transparent; border-bottom-style: solid; border-bottom-width: 8px; border-right-style: solid; border-right-width: 8px; top: 9px; }
        .notice-in:after { color: #fff; left: -14px; top: 8px; z-index: 2; border-left: 8px dashed transparent; border-top: 8px dashed transparent; border-right-style: solid; border-right-width: 8px; border-bottom-style: solid; border-bottom-width: 8px; }
        .notice-hd { text-align: center; position: relative; z-index: 2; line-height: 1; }
        .notice-hd:before { content: ''; position: absolute; width: 100%; left: 0; height: 10px; top: 50%; margin-top: -5px; z-index: -1; background: #ffeddd; }
        .notice-hd .title { line-height: 1.5; font-size: 24px; display: inline-block; padding: 0 .5rem; background: #fff; vertical-align: middle; }
        .notice-bd { padding-top: 12px; }

        .pn-share { padding: 20px 4% 0; }
        .pn-share .code-box { position: relative; margin-top: 90px; padding: 0 4%; text-align: center; }
        .pn-share .code-box .code-in img { position: absolute; top: 50%; left: 50%; margin-left:-125px; margin-top:-125px; width:250px; height:250px;
            display: block;}
        .pn-share .code-box .code-txt { position: absolute; left: 0; right: 0; bottom: -1.5em; text-align: center; font-size: 22px; }
        .pn-share .code-box .code1 { width: 320px; height: 320px; margin-left: -160px; margin-top: -160px; }
        .pn-share .code-box .code2 { width: 260px; height: 260px; margin-left: -125px; margin-top: -125px; }

        .footer { color: #bbb; font-size: 20px; text-align: center; margin-top: 136px; padding: 30px 0; }
        .footer:before { content: ''; width: 23px; height: 28px; background-position: -60px 0; margin: 0 10px 6px 0; }
    </style>
    <!--<style>-->
    <!--.header{ background-color: #ffa62e;}-->
    <!--</style>-->
</head>
<script type="text/javascript" src="/data/js/qrcode.min.js"></script>
<body>
<div class="wrap">
    <div class="header" style="background-color: #ffa62e;">
        <div class="header-c1">
            <div class="address"><?php echo $params['address'];?></div>
            <img src="<?php echo $params['imgUrl'];?>" alt="" class="header-bg">
        </div>
        <div class="header-c2">
            <div class="info">
                <p class="follow">关注</p>
                <div class="shop-name"><?php echo $params['storeName'];?></div>
            </div>
            <p class="time">营业时间：<?php echo $params['storeStartTime'].'-'.$params['storeCloseTime'];?></p>
            <div class="tag">
                <?php echo $params['buyerDistribution']?'<p>支持自提</p>':'';?>
                <?php echo $params['sellerDistribution']?'<p>商家配送</p>':'';?>
                <?php echo $params['startShippingPrice']?'<p>'.$params['startShippingPrice'].'起送</p>':'';?>
                <?php echo $params['freeShippingPrice']?'<p>满'.$params['freeShippingPrice'].'免费配送</p>':'';?>
            </div>
        </div>
    </div>
    <div class="pn-share">
        <div class="notice">
            <div class="notice-in">
                <div class="notice-hd">
                    <div class="title">店铺公告</div>
                </div>
                <div class="notice-bd">
                    <p><?php echo $params['desc'];?></p>
                </div>
            </div>
        </div>
        <!--        <div class="code-box">-->
        <!--            <img src="//static.shenbd.com/www/index/2018/img/app-share/bg-code1.jpg" alt="">-->
        <!--            <div class="code-in">-->
        <!--                <img src="//static.shenbd.com/www/index/2018/img/app-share/code1.png" alt="" class="code1">-->
        <!--            </div>-->
        <!--            <p class="code-txt">长按图片识别二维码</p>-->
        <!--        </div>-->
        <div class="code-box">
            <img src="/data/images/bg-code2.jpg" alt="">
            <div id="qrcodeImg" class="code-in" >
                               <img id="qrcodeImg" src="<?php echo $params['qrCode']."?x-oss-process=image/resize,m_fill,h_250,w_250";?>" alt="" width="250" height="250">
            </div>
            <p class="code-txt">长按图片识别二维码</p>
        </div>
    </div>
    <div class="footer">我的身边店提供技术服务</div>
</div>
</body>
<script>
//    new QRCode(document.getElementById('qrcodeImg'), {
//        text: '<?php //echo $params['qrCode']."?x-oss-process=image/resize,m_fill,h_186,w_186";?>//',
//        width: 250,
//        height: 250
//
//    });
</script>
</html>