Qimin.Huang
/
course


      
        
          
            
              
              {% load staticfiles %}

<!DOCTYPE html>
<html lang="zh-CN">
    <head>
        <meta charset="utf-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
        <meta name="format-detection" content="telephone=no,email=no,address=no">
        <meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no">
        <title>课程兑换</title>

        <link href="//res.wx.qq.com/open/libs/weui/0.4.3/weui.min.css" rel="stylesheet" type="text/css" />
{#        <link href="{% static 'page/css/weui.ext.css' %}?v=1" rel="stylesheet" type="text/css" />#}

        <style>
            .code-cover, .code-cover>img {
                width: 100%;
            }
            .code-area {
                padding: 5px 10px;
            }
            .code-label {
                width: 70%;
                color: #646464;
                font-size: 13px;
                margin: 15px auto;
            }
            .code-input, .code-input>input, .code-submit {
                width: 80%;
                height: 40px;
                line-height: 40px;
                margin: 5px auto;
                border-radius: 25px;
                box-sizing: border-box;
            }
            .code-input>input {
                width: 100% !important;
                font-size: 13px;
                border: 1px solid #c6c6c6 !important;
                padding: 0 15px !important;
{#                outline: medium;#}
            }
            .code-submit {
                text-align: center;
                background: #20a1f5;
                color: #c6eaf9;
                margin-top: 15px;
            }
        </style>
    </head>
    <body>
        <div class="container">
            <div class="code-cover"><img src="{% static 'page/img/code_cover.png' %}"></div>
            <div class="code-area">
                <div class="code-label">输入兑换码兑换课程</div>
                <div class="code-input"><input id="code" class="weui_input" placeholder="请输入兑换码"></div>
                <div id="submit" class="code-submit">确认兑换</div>
            </div>

            <div class="weui_dialog_alert" id="dialog" style="display: none">
                <div class="weui_mask"></div>
                <div class="weui_dialog">
                    <div class="weui_dialog_hd"><strong id="title" class="weui_dialog_title">弹窗标题</strong></div>
                    <div id="content" class="weui_dialog_bd">弹窗内容，告知当前页面信息等</div>
                    <div class="weui_dialog_ft">
                        <a href="javascript:;" class="weui_btn_dialog primary">确定</a>
                    </div>
                </div>
            </div>
        </div>

        <script src="//cdn.bootcss.com/zepto/1.1.6/zepto.min.js"></script>
        <script>
            $(function() {
                function show_error_dialog(title, content) {
                    $('#dialog #title').text(title);
                    $('#dialog #content').text(content);
                    $('#dialog').show();
                }

                function data_check() {
                    var user_id = '{{ user_info.user_id }}';
                    if (!user_id) {
                        show_error_dialog('微信授权', '微信授权失败，请重新打开页面');
                        return false;
                    }

                    var code = $('#code').val();
                    if (!code) {
                        show_error_dialog('兑换码', '兑换码错误，请检查重新输入');
                        return false;
                    }

                    return {
                        user_id: user_id,
                        code: code,
                    }
                }

                $('#submit').click(function () {
                    var check_result = data_check();
                    if (check_result){
                        $.ajax({
                            type: 'POST',
                            url: '{{ domain }}/api/code/exchange',
                            data: check_result,
                            success: function(data) {
                                if (data.status == 200) {
                                    window.location.href = '{{ domain }}/page/course/list?{{ params|safe }}';
                                } else {
                                    show_error_dialog('错误', data.description);
                                }
                            }
                        })
                    }
                });

                $('#dialog .weui_btn_dialog').click(function () {
                    $('#dialog').hide();
                })
            });
        </script>
        <script type="text/javascript" src="//res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
        <script type="text/javascript" src="{% static 'course/js/jswe-0.0.1.js' %}"></script>
        <script>
            V.initWxData({
                imgUrl: 'http://pai.ai/static/pai2/img/paiai_96_96.png',
                link: 'http://pai.ai/we/o?redirect_url=http://xfoto.com.cn/api/3rd/or',
                desc: '兰海说成长',
                title: '兰海说成长',
                timeLine: ''
            }, true);
        </script>
    </body>
</html>