wangrui
/
llpt_orderchannel-s1h5


			
				
					
						
						
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299
							<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=no">
    <meta content="yes" name="apple-mobile-web-app-capable">
    <meta content="black" name="apple-mobile-web-app-status-bar-style">
    <meta content="telephone=no" name="format-detection">
    <title>联通头条流量包</title>
    <link rel="stylesheet" href="../tt/css/basexc.css">
    <link rel="stylesheet" href="../tt/css/pagexc.css">
    <script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
    <script src="https://s3.pstatp.com/inapp/toutiao.js"></script>
    <script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
    <style>
        #jh {
            position: relative;
            margin-top: 1rem;
            /* overflow: hidden; */
            font-size: 0.75rem;
            color: #fff;
        }
        
        #jh a {
            color: #ffeb3b;
        }
        
        .login_btn {
            background-size: 100% 100%;
            width: 92%;
            position: absolute;
            left: 4%;
            top: 1%;
        }
        
        .red_btn {
            padding-bottom: 2.2rem;
            display: block;
            width: 100%;
            height: 4.8rem;
            line-height: 1rem;
            background: url(../tt/images/login_btncj.png) no-repeat;
            background-size: 100% 100%;
            font-size: 1.1rem;
            color: #ffdd62;
            text-align: center;
            border: none;
            border-radius: 3px;
        }
        /* 将取号页面显示在订购页面之上 */
        
        iframe {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            border: 0px;
        }
    </style>
    <script>
        $(document).ready(function() {
            getDeviceId(
                function(device_id) {
                    $("#useraccount_tt").attr("value", device_id);
                }
            );
        });

        const inputItems = document.querySelectorAll("input");
        inputItems.forEach(function(ele) {
            ele.addEventListener("blur", function() {
                window.scrollTo(0, 0)
            })
        })
    </script>
</head>

<body>
    <div class="main">
        <input type="hidden" id="useraccount_tt" value="" />
        <input type="hidden" id="fog_tt" />
        <div class="banner">
            <img src="images/banner1xc.jpg" />
        </div>
        <div class="banner2">
            <img src="images/banner2xc.jpg" />
            <div class="login_btn">
                <!-- <img src="images/login_btnxc.png" />  -->
                <input type="button" id="major" value="立即开通" class="red_btn">
            </div>
            <div class="login kaitong">
                <div class="login_foot" id="jh">
                    <p>
                        若您已经订购，请<a id="aj" onclick="gotoUrl('tt/activate')">点击激活..</a>
                    </p>
                </div>
            </div>
        </div>
        <div class="banner">
            <img src="images/banner3xc.jpg" />
        </div>
        <div class="tips_bg">
            <div class="tips">
                <ul>
                    <li class="tips_item">
                        <div class="num num_pic1">1</div> <span>
							春节2月1日-2月10日期间，订购今日头条9元10GB流量包，本月月底即可获赠9元联通话费，话费将充值到您订购免流包的手机号码中，以短信告知；
					</span>
                    </li>
                    <li class="tips_item">
                        <div>
                            <div class="num num_pic2">2</div>
                        </div> <span>
							中国联通手机4G（除冰激凌套餐、懂我卡等）用户，广东、上海2/3G用户均可订购，4G套餐中的共享类套餐不共享该月包，需单独订购（暂不支持携号转网用户订购）；
					</span>
                    </li>
                    <li class="tips_item">
                        <div class="num num_pic3">3</div> <span>
							定向免流量包适用范围包含：今日头条、今日头条lite版本、西瓜视频、火山小视频、抖音短视频。免流内容不包含第三方提供的广告、视频、图片及直播类视频上传、在线观看/下载/缓存第三方视频所产生的流量；
					</span>
                    </li>
                    <li class="tips_item">
                        <div class="num num_pic4">4</div> <span>
							流量包订购成功后即刻生效，该月流量月底失效，下月自动续费，本流量包不支持重复订购；已订购9元10GB流量包的用户申请退订该产品，退订成功后月底生效且当月不支持再次订购，请于次月重新订购；
					</span>
                    </li>
                    <li class="tips_item">
                        <div class="num num_pic5">5</div> <span> UNINET、3GNET
							、WONET接入点访问能使用该定向流量，其他接入点不能免流使用； </span>
                    </li>
                    <li class="tips_item">
                        <div class="num num_pic6">6</div> <span>
							如您为头条相关免流卡用户，如蚂蚁宝卡、阿里宝卡或工商银行e卡等其他免头条系产品卡类，将优先使用免流卡产品的流量，免流卡流量用罄后将消耗定向流量包的流量；
					</span>
                    </li>
                    <li class="tips_item">
                        <div class="num num_pic6">7</div> <span>
							用户成功订购该头条系流量包后，如果遇到页面提示不免流，敬请忽略，正常使用； </span>
                    </li>
                    <li class="tips_item">
                        <div class="num num_pic6">8</div> <span> 如您已成功订购流量包，点此<a onclick="gotoUrl('tt/cancel')"  style="color: #ffeb3b">退订</a>。 </span>
                    </li>
                    <li class="tips_item">
                        <div class="num num_pic6">9</div> <span>
							关于免流量如有疑问请咨询联通客服：10010。 </span>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</body>
<script>
    $('#major')
        .unbind('click')
        .on(
            'click',
            function() {
                //获取用户头条标示
                $("#useraccount_tt").attr("value", getDecice());
                $("#major").attr('disabled', true);
                var $iframe = $('<iframe id="uniauthframe" src="https://cap.chinaunicom.cn/CAP-AUTH/auth-tt.html?_=1480405186462"></iframe>');
                $("html").css("overflow", "hidden");
                $("body").css("overflow", "hidden");
                $("iframe").css("overflow", "hidden");
                var params = {
                    "PRODUCT_NAME": "今日头条定向流量9元10G月包",
                    "PRODUCT_PRICE": "9.00元",
                    "CLIENT_ID": "",
                    "CLIENT": "3",
                    "SERVICE_ID": "",
                    "AUTH_NO": "",
                    "CLIENT_SECRET": "",
                    "VERSION": "1.0",
                    "SERVICE_PHONE": "",
                    "THEME": "",
                    "PRODUCT_ID": "8434545",
                    "PRODUCT_TYPE": "1"
                }
                $iframe.on(
                    'load',
                    function() {
                        $
                            .ajax({
                                //请求后项定向服务获取
                                url: getRootPath() + "-s1api" +
                                    "/ini/clientsecret",
                                dataType: "JSON",
                                method: "GET",
                                success: function(data) {
                                    params.CLIENT_ID = data.client_id;
                                    params.AUTH_NO = data.auth_no;
                                    params.CLIENT_SECRET = data.client_secret;
                                    console
                                        .log(JSON
                                            .stringify(params))
                                    $('#uniauthframe')[0].contentWindow
                                        .postMessage(
                                            JSON
                                            .stringify(params),
                                            "https://cap.chinaunicom.cn/CAP-AUTH/")
                                }
                            })
                    })
                $('body').append($iframe);

                function order(data, product) {
                    $("#major").val("正在开通请稍等....！");
                    //活动页面的订购的逻辑               
                    $
                        .ajax({
                            type: "POST",
                            contentType: "application/json; charset=utf-8",
                            dataType: "Json",
                            url: getRootPath() + "-s1api" + '/com/buyc',
                            data: JSON.stringify(GetMasData(
                                product, data.SERVICE_ID,
                                data.RSP.DATA[0].TOKEN)),
                            success: function(msg) {
                                var resCode = eval(msg["resultCode"]);
                                switch (resCode) {
                                    case (0000):
                                        $("#major").attr('disabled', false);
                                        $("#major").val("订购成功！");
                                        break;
                                    case (0013):
                                        $("#major").css("font-size", "1rem");
                                        $("#major").val("该号码归属省分2/3G暂未开通此产品！");
                                        break;
                                    case (6611):
                                        $("#major").attr('disabled', false);
                                        $("#major").val("订购失败，请重试！");
                                        break;
                                    case (6615):
                                        $("#major").val("订购失败，请确定用户套餐！");
                                        break;
                                    case (6622):
                                        $("#major").attr('disabled', false);
                                        $("#major").val("用户已订购过此产品！");
                                        break;
                                    default:
                                        $("#major").attr('disabled',
                                            false);
                                        $("#major").val(
                                            msg["errorInfo"]);
                                }
                            },
                            error: function(XMLHttpRequest,
                                textStatus, errorThrown) {
                                $("#major").attr('disabled', false);
                                $("#major").val("请求失败，请确认网络是否正常！");
                            },
                        });
                }
                /**
                 * 订购发送信息包装
                 * @param product
                 * @returns {___anonymous5356_5582}
                 */
                function GetMasData(product, phone, tok) {
                    var data = {
                        "fog": getMemoValbyId(product, "fog"),
                        "usermob": phone,
                        "useraccount": getMemoValbyId(product,
                            "useraccount"),
                        "fes": getUrlParam("fes"),
                        "sou": getUrlParam("sou"),
                        "token": tok
                    };
                    return data;
                }

                //监听统一认证结果
                window.addEventListener('message', function(e) {
                    var data = JSON.parse(e.data);
                    switch (data.RSP.RSP_CODE) {
                        case "0000": //处理成功
                            $('iframe').remove();
                            order(data, 'tt');
                            break;
                        case "0001": //auth_no无效 （入参流水）
                            $("#major").val("认证失败！");
                        case "0003": //client_id不存在 （注册id存在问题）
                            $("#major").val("认证失败！");
                        case "4444": //服务暂时不可用（系统忙/系统队列满）
                            $("#major").val("服务暂时不可用!");
                        case "9001": //关闭H5认证页面
                            $("#major").attr('disabled', false);
                            $('iframe').remove();
                            break;
                    }
                }, false);
            })
</script>
<script type="text/javascript" src="../tt/js/tuil.js?_=1480"></script>
<script type="text/javascript" src="../tt/js/wechatxc.min.js"></script>

</html>