Home Erkunden Hilfe
Registrieren Anmelden
Kodo
/
kodo
Beobachten 2
Markieren 0
Fork 0
Issues 0 Pull-Anforderung 0 Commits 637 Veröffentlichungen 0

Keine Beschreibung

ZIP TAR.GZ

clerk_sale.html 18KB
Verlauf Roh 

    {% 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" />
    </head>
    <body>
        <div class="container" >
            <div id="machine_info">
                <div class="weui_cells_title">机器信息</div>
                <div class="weui_cells weui_cells_form">
                    <div class="weui_cell">
                        <div class="weui_cell_hd"><label for="" class="weui_label">型号</label></div>
                        <div class="weui_cell_bd weui_cell_primary">
                            <input id="model" class="weui_input" type="text" value="" placeholder="请选择相机型号" disabled>
                        </div>
                    </div>
                    <div id="model_radio" class="weui_cells weui_cells_radio radio_cells">
                        {% for model in models %}
                        <div>
                            <input type="radio" class="weui_check" name="model" id="{{ model.model_id }}" value="{{ model.model_id }}" {% if forloop.first %}checked="checked"{% endif %}>
                            <label class="weui_cell weui_check_label quartern" for="{{ model.model_id }}">
                                <div class="weui_cell_bd weui_cell_primary">{{ model.model_name }}</div>
                            </label>
                        </div>
                        {% endfor %}
                    </div>
                    <div class="weui_cell">
                        <div class="weui_cell_hd"><label for="" class="weui_label">卡口</label></div>
                        <div class="weui_cell_bd weui_cell_primary">
                            <input id="mount" class="weui_input" type="text" value="" placeholder="请选择相机卡口" disabled>
                        </div>
                    </div>
                    <div id="mount_radio" class="weui_cells weui_cells_radio radio_cells">
                        <div>
                            <input type="radio" class="weui_check" name="mount" id="e" value="E" checked="checked">
                            <label class="weui_cell weui_check_label quartern" for="e">
                                <div class="weui_cell_bd weui_cell_primary">E</div>
                            </label>
                        </div>
                        <div>
                            <input type="radio" class="weui_check" name="mount" id="n" value="N">
                            <label class="weui_cell weui_check_label quartern" for="n">
                                <div class="weui_cell_bd weui_cell_primary">N</div>
                            </label>
                        </div>
                        <div>
                            <input type="radio" class="weui_check" name="mount" id="s" value="S">
                            <label class="weui_cell weui_check_label quartern" for="s">
                                <div class="weui_cell_bd weui_cell_primary">S</div>
                            </label>
                        </div>
                        <div>
                            <input type="radio" class="weui_check" name="mount" id="p" value="P">
                            <label class="weui_cell weui_check_label quartern" for="p">
                                <div class="weui_cell_bd weui_cell_primary">P</div>
                            </label>
                        </div>
                    </div>
                    <div class="weui_cell">
                        <div class="weui_cell_hd"><label for="" class="weui_label">机身码</label></div>
                        <div class="weui_cell_bd weui_cell_primary">
                            <input id="code" class="weui_input" type="text" value="" placeholder="请输入机身码">
                        </div>
                        <div class="weui_cell_ft">
                            <a id="scan" href="javascript:;" class="weui_btn weui_btn_mini weui_btn_default">扫码</a>
                        </div>
                    </div>
                </div>

                <br>

                <button id="submit1" class="weui_btn weui_btn_warn">确认</button>
            </div>

            <div id="customer_info" style="display: none;">
                <div class="weui_cells_title">消费者信息</div>
                <div class="weui_cells weui_cells_form">
                    <div class="weui_cell">
                        <div class="weui_cell_hd"><label for="" class="weui_label">姓名</label></div>
                        <div class="weui_cell_bd weui_cell_primary">
                            <input id="name" class="weui_input" type="text" value="" placeholder="请输入消费者姓名">
                        </div>
                    </div>
                    <div class="weui_cell">
                        <div class="weui_cell_hd"><label for="" class="weui_label">性别</label></div>
                        <div class="weui_cell_bd weui_cell_primary">
                            <input id="sex" class="weui_input" type="text" value="" placeholder="请选择消费者性别" disabled>
                        </div>
                    </div>
                    <div id="sex_radio" class="weui_cells weui_cells_radio radio_cells">
                        <div>
                            <input type="radio" class="weui_check" name="sex" id="male" value="1" checked="checked">
                            <label class="weui_cell weui_check_label quartern" for="male">
                                <div class="weui_cell_bd weui_cell_primary">先生</div>
                            </label>
                        </div>
                        <div>
                            <input type="radio" class="weui_check" name="sex" id="female" value="0">
                            <label class="weui_cell weui_check_label quartern" for="female">
                                <div class="weui_cell_bd weui_cell_primary">女士</div>
                            </label>
                        </div>
                    </div>
                    <div class="weui_cell">
                        <div class="weui_cell_hd"><label for="" class="weui_label">年龄段</label></div>
                        <div class="weui_cell_bd weui_cell_primary">
                            <input id="age" class="weui_input" type="text" value="" placeholder="请选择消费者年龄段" disabled>
                        </div>
                    </div>
                    <div id="age_radio" class="weui_cells weui_cells_radio radio_cells">
                        <div>
                            <input type="radio" class="weui_check" name="age" id="age1" value="1" checked="checked">
                            <label class="weui_cell weui_check_label quartern" for="age1">
                                <div class="weui_cell_bd weui_cell_primary">20岁以下</div>
                            </label>
                        </div>
                        <div>
                            <input type="radio" class="weui_check" name="age" id="age2" value="2">
                            <label class="weui_cell weui_check_label quartern" for="age2">
                                <div class="weui_cell_bd weui_cell_primary">20~30岁</div>
                            </label>
                        </div>
                        <div>
                            <input type="radio" class="weui_check" name="age" id="age3" value="3">
                            <label class="weui_cell weui_check_label quartern" for="age3">
                                <div class="weui_cell_bd weui_cell_primary">30~40岁</div>
                            </label>
                        </div>
                        <div>
                            <input type="radio" class="weui_check" name="age" id="age4" value="4">
                            <label class="weui_cell weui_check_label quartern" for="age4">
                                <div class="weui_cell_bd weui_cell_primary">40~50岁</div>
                            </label>
                        </div>
                        <div>
                            <input type="radio" class="weui_check" name="age" id="age5" value="5">
                            <label class="weui_cell weui_check_label quartern" for="age5">
                                <div class="weui_cell_bd weui_cell_primary">50岁以上</div>
                            </label>
                        </div>
                    </div>
                    <div class="weui_cell">
                        <div class="weui_cell_hd"><label for="" class="weui_label">手机号</label></div>
                        <div class="weui_cell_bd weui_cell_primary">
                            <input id="phone" class="weui_input" type="text" required="required" pattern="1[0-9]{10}" value="" placeholder="请输入消费者手机号">
                        </div>
                    </div>
                </div>

                <br>

                <button id="submit2" class="weui_btn weui_btn_warn">确认</button>
            </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 class="weui_dialog_alert" id="dialog2" 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 class="weui_dialog_alert" id="dialog3" 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 id="toast" style="display: none;">
                <div class="weui_mask_transparent"></div>
                <div class="weui_toast">
                    <i class="weui_icon_toast"></i>
                    <p class="weui_toast_content">已完成</p>
                </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 show_error_dialog2(title, content) {
                    $('#dialog2 #title').text(title);
                    $('#dialog2 #content').text(content);
                    $('#dialog2').show();
                }

                function show_error_dialog3(title, content) {
                    $('#dialog3 #title').text(title);
                    $('#dialog3 #content').text(content);
                    $('#dialog3').show();
                }

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

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

                    return {
                        step: 1,
                        clerk_id: clerk_id,
                        model_id: $("#model_radio input[name='model']:checked").val(),
                        mount: $("#mount_radio input[name='mount']:checked").val(),
                        code: code,
                    }
                }

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

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

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

                    var phone = $('#phone').val();
                    var phone_valid = $('#phone').is(':valid');
                    if (!(phone && phone_valid)) {
                        show_error_dialog('手机号', '手机号错误，请检查重新输入');
                        return false;
                    }

                    return {
                        step: 2,
                        clerk_id: clerk_id,
                        model_id: $("#model_radio input[name='model']:checked").val(),
                        mount: $("#mount_radio input[name='mount']:checked").val(),
                        code: code,
                        name: name,
                        sex: $("#sex_radio input[name='sex']:checked").val(),
                        age: $("#age_radio input[name='age']:checked").val(),
                        phone: phone,
                    }
                }

                $('#submit1').click(function () {
                    var check_result = data_check();
                    if (check_result){
                        $.ajax({
                            type: 'POST',
                            url: '{{ domain }}/api/clerk/sale/submit',
                            data: check_result,
                            success: function(data) {
                                if (data.status == 200) {
{#                                    $('#toast').show();#}
{#                                    setTimeout(function () {#}
{#                                        $('#toast').hide();#}
{#                                    }, 1000);#}
                                    show_error_dialog2('成功', '机器信息提交成功');
                                } else {
                                    show_error_dialog('错误', data.description);
                                }
                            }
                        })
                    }
                });

                $('#submit2').click(function () {
                    var check_result = data_check2();
                    if (check_result){
                        $.ajax({
                            type: 'POST',
                            url: '{{ domain }}/api/clerk/sale/submit',
                            data: check_result,
                            success: function(data) {
                                if (data.status == 200) {
                                    show_error_dialog3('成功', '消费者信息提交成功');
                                } else {
                                    show_error_dialog('错误', data.description);
                                }
                            }
                        })
                    }
                });

                $('#dialog .weui_btn_dialog').click(function () {
                    $('#dialog').hide();
                })

                $('#dialog2 .weui_btn_dialog').click(function () {
                    $('#dialog2').hide();
                    $('#machine_info').hide();
                    $('#customer_info').show();
                })

                $('#dialog3 .weui_btn_dialog').click(function () {
                    $('#dialog').hide();
                    window.location.reload();
                })
            });
        </script>
        <script type="text/javascript" src="//res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
        <script type="text/javascript" src="{% static 'kodo/js/jswe-0.0.4.js' %}"></script>
        <script>
            V.initWxData({
                imgUrl: 'http://pai.ai/static/kodo/img/paiai_96_96.png',
                link: 'http://pai.ai/w/o?r=http%3A%2F%2Fkodo.xfoto.com.cn%2Fp%2Fclerk%2Fsale',
                desc: '店员授权',
                title: '店员授权',
                timeLine: ''
            }, true);
            V.hideOptionMenu();

            $('#scan').click(function () {
                V.scanQRCode({
                    needResult: 1
                });
            });
            V.wxScanQRCodeSuccess = function (res) {
                $('#code').val(V.parseScanQRCodeResultStr(res.resultStr));
            }
        </script>
    </body>
</html>