dayuan
/
manyi


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528
							<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <meta name="description" content=""/>
    <meta name="keywords" content="扫码支付，线上投币，运营数据，物联网"/>
    <meta name="format-detection" content="telphone=no,email=no"/>
    <meta name="viewport"
          content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no"/>
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="cache-control" content="no-cache">
    <meta http-equiv="expires" content="0">
    <title id="title">代理商：经销商设备注册</title>
    <link rel="stylesheet" href="/components/lib/mui.min.css"/>
    <link rel="stylesheet" href="/components/lib/mui.picker.min.css"/>
    <link rel="stylesheet" href="/components/custom/css/common.css"/>
    <link rel="stylesheet" href="/app/css/xyf.common.min.css">
    <style>
        textarea {
            font-size: 14px;
        }
    </style>
</head>
<body class="reg-bg">
<div id="progress" class="mui-progressbar mui-progressbar-infinite" style="display: none;top: 0">
    <span></span>
</div>
<div style="padding-bottom: 80px" class="font-14">
    <div class="mui-content">
        <!-- 头部 -->
        <div class="mui-content reg">
            <div class="mui-input-group custom-bottom">
                <div class="mui-input-row">
                    <label>设备编号</label>
                    <input type="tel" id="uniqueCode" readonly class="mui-text-right">
                </div>
                <div class="mui-input-row">
                    <label>设备IMEI</label>
                    <input type="tel" id="imeiCode" readonly class="mui-text-right">
                </div>
            </div>
            <div class="mui-input-group reg-hd">
                <div class="mui-input-row">
                    <label>经销商</label>
                    <input type="text" id="customer" placeholder="请填写" readonly class="mui-text-right padding-r-25">
                    <span class="mui-navigate-right"></span>
                    <input type="hidden" id="customerId"/>
                </div>
                <div class="mui-input-row">
                    <label>投放地址</label>
                    <input type="text" id="location" placeholder="请填写" readonly class="mui-text-right padding-r-25">
                    <span class="mui-navigate-right"></span>
                </div>
                <div class="mui-input-row">
                    <label>设备类型</label>
                    <input type="text" id="type" placeholder="请填写" readonly class="mui-text-right padding-r-25"
                           value="">
                    <input type="hidden" id="typeId" value="">
                    <span class="mui-navigate-right"></span>
                </div>
            </div>
        </div>

        <!-- 套餐 -->
        <div class="mui-hidden" id="wash">
            <h5 class="mui-content-padded">请设置服务套餐（在整个投放地址生效）</h5>
            <ul class="reg-wash">
                <div id="packageSetting"></div>
            </ul>
        </div>

        <h5 class="mui-content-padded">请选择或输入组内地址/编号</h5>
        <div class="" id="groupNumberSelect">
            <div class="mui-input-group reg-hd">
                <div class="mui-input-row ">
                    <label>组内地址/编号</label>
                    <input type="text" id="groupNumber" placeholder="组内地址/编号" class="mui-text-right ">
                </div>
            </div>
            <div class="mui-input-group reg-bd">
                <div class="mui-input-row">
                    <ol>
                        <li>快速选择组内地址/编号</li>
                    </ol>
                    <div class="mui-row">
                        <div class="mui-col-xs-4 mui-col-sm-4">
                            <span class="mui-inline done"></span>已注册
                        </div>
                        <div class="mui-col-xs-4 mui-col-sm-4">
                            <span class="mui-inline option"></span>可选
                        </div>
                        <div class="mui-col-xs-4 mui-col-sm-4">
                            <span class="mui-inline active"></span>选中
                        </div>
                    </div>
                </div>
                <div class="mui-input-row reg-list">
                    <!-- 分组编号列表 -->
                    <div class="mui-row option-list"></div>
                </div>
            </div>
        </div>


        <!--设备备注 说明-->
        <div class="mui-content custom-top">
            <div class="mui-input-group custom-bottom reg-hd">
                <div class="mui-input-row ">
                    <label>备注</label>
                    <input type="text" id="remarks" placeholder="非必填" class="mui-text-right ">
                </div>
                <div class="mui-input-row" style="min-height: 62px">
                    <label>使用说明</label>
                    <textarea type="text" id="instructions" placeholder="非必填" class="mui-text-right"></textarea>
                </div>
            </div>
        </div>

    </div>
</div>
<div class="custom-btn-area custom-fixed-b cf">
    <a href="javascript:register();" class="custom-btn custom-btn-primary">提交注册</a>
</div>

<script type="text/javascript" src="/components/lib/vue.min.js"></script>
<script src="/components/lib/jquery.min.js"></script>
<script src="/components/lib/mui.min.js"></script>
<script src="/components/lib/mui.picker.min.js"></script>
<script src="/app/js/xyf.common.js"></script>
<script src="/components/custom/js/common.js"></script>
<script src="/app/js/package-setting.js"></script>
<script>

    //全局-是否有弹出框，用于阻止点击事件
    (function () {
        //ios返回刷新
        var isPageHide = false;
        window.addEventListener('pageshow', function () {
            if (isPageHide) {
                window.location.reload();
            }
        });
        window.addEventListener('pagehide', function () {
            isPageHide = true;
        });
    })();

    var DEVICE_REG_PARAM = getSessionStorage("DEVICE_REG_PARAM") || {};// 使用缓存数据，避免传来传去

    //设备分组ID
    var groupId = DEVICE_REG_PARAM.groupId;
    //分组地址信息
    var groupName = DEVICE_REG_PARAM.groupName;

    //设备编号 = devNo
    var eid = DEVICE_REG_PARAM.devNo;
    var logicalCode = DEVICE_REG_PARAM.logicalCode;
    var qrCodeUrl = DEVICE_REG_PARAM.qrCodeUrl;// 需要传带域名的完整url

    var customerId = DEVICE_REG_PARAM.customerId;
    var customer = DEVICE_REG_PARAM.customer;

    //设备类型code
    var code = "";//设备code
    var unit = '分钟';

    var typePicker;
    var typeList = [];
    (function (mui, doc) {
        mui.init();
        mui.ready(function () {
            //type 选择
            typePicker = new mui.PopPicker();

            var showType = doc.getElementById('type');
            var typeIdDom = doc.getElementById('typeId');

            showType.addEventListener('tap', function (event) {
                if (customerId == null) {
                    mui.alert("请先选择经销商", '温馨提示', '我知道了');
                    return null;
                }

                sendRequest("/agent/dealer/findDevTypeCandidate", "GET",
                    { logicalCode: logicalCode, customerId: customerId}, function (res) {
                    typeList = res.data.dataList || [];

                    //适配数据
                    for (var i = 0; i < typeList.length; i++) {
                        var item = typeList[i];
                        item.text = item.alias;
                        item.value = item.id;
                    }
                    typePicker.setData(typeList);

                    typePicker.show(function (items) {
                        showType.value = (items[0] || {}).text;
                        typeIdDom.value = (items[0] || {}).value;
                        var obj = (items[0] || {})
                        unit = obj.unit ? obj.unit : (obj.timeBased == true ? "分钟" : "次");
                        code = obj.code;

                        serviceData(typeIdDom.value);
                    });
                });
            }, false);
        });

    })(mui, document);

    //初始化动作
    $(function () {
        //展示经销商名称
        if (customer != null) {
            $("#customer").val(customer);
        }
        //写入经销商编号
        if (customerId != null) {
            $("#customerId").val(customerId);
        }
        //展示地址
        if (groupId != null && groupName != null) {
            $("#location").val(groupName);
            groupNumberData(groupId);
        }
        if (eid != null) {
            $("#imeiCode").val(eid);
        }
        if (logicalCode != null) {
            $("#uniqueCode").val(logicalCode);
        }

        // 同步刷新快速选择器
        $('#groupNumber').on('input', function () {
            // 取消其他的选中
            $('.reg-list a.active').removeClass('active').addClass('option');
            // 选中当前
            var nowValue = $(this).val()
            $('.reg-list a').each(function () {
                var eachVal = $(this).text()
                if (nowValue == eachVal) {
                    $(this).not('.done').removeClass('option').addClass('active');
                }
            })
        })
    });

    //加载经销商
    (function ($, doc) {
        $.init();
        $.ready(function () {
            sendRequest("/agent/getCustomerList", "GET", {}, function (res) {
                if (res && res.para && res.para.dataList) {

                    //经销商列表
                    var customerPicker = new $.PopPicker();
                    customerPicker.setData(res.para.dataList);
                    var customerDom = doc.getElementById('customer');
                    var customerIdDom = doc.getElementById('customerId');

                    //picker事件绑定
                    customerDom.addEventListener('tap', function (event) {
                        if (res.para.dataList.length < 1) {
                            mui.toast("您还未添加经销商，请先为其开户");
                            return;
                        }
                        customerPicker.show(function (items) {
                            customer = customerDom.value = (items[0] || {}).text;
                            customerId = customerIdDom.value = (items[0] || {}).value;

                            if (customerIdDom.value) {
                                sendRequest("/device/defaultEquipmentGroup", "GET", {'customerId': customerId},
                                    function (res) {
                                        if (res.result === 1) {
                                            if (res.para.gid) {
                                                //自动填充默认地址
                                                jQuery("#location").val(res.para.name);
                                                //设置地址ID到全局变量
                                                groupId = res.para.gid;

                                                // 加载groupNumber的选择器
                                                groupNumberData(groupId);
                                            }
                                        }
                                    });
                            }
                        });
                    }, false);


                    // 从增加地址跳转获取customerId ，当url获取到customerId时，自动设置经销商名字
                    if (customerId) {
                        var filtered = res.para.dataList.filter(function (_) {
                            return _.value === customerId
                        });
                        if (filtered.length === 1) {
                            customerDom.value = filtered[0].text;
                            customerIdDom.value = customerId;
                        }
                    }
                }
            });
        });
    })(mui, document);

    //加载分组编号
    function groupNumberData(groupId) {
        var data = {"groupId": groupId};
        //获取哪些分组编号已经占用
        sendRequest("/device/groupUsedNumber", "GET", data, function (res) {
            if (res.result == 1) {
                var groupNumberHtml = "";
                var classValue = "";
                var isDefual = false;
                var length = res.para.length;
                var nowSelect = 1;
                for (var i = 1, j = 0; j < length, i <= 32; i++) {
                    if (length == j) {
                        if (!isDefual) {
                            classValue = "active";
                            nowSelect = i;
                            isDefual = true;
                        } else {
                            classValue = "option";
                        }
                    } else {
                        if (res.para[j].groupNumber == i) {
                            classValue = "done";
                            j++;
                        } else {
                            if (!isDefual) {
                                classValue = "active";
                                isDefual = true;
                                nowSelect = i;
                            } else {
                                classValue = "option";
                            }
                        }
                    }
                    groupNumberHtml += '<div class="mui-col-xs-3 mui-col-sm-3 option-list-item">' +
                        '<a href="javascript:;" class=' + classValue + '>' + i + '</a>' +
                        '</div>';
                }
                groupNumberHtml += '';
                $(".option-list").html(groupNumberHtml);
                //按钮选择
                $('.option-list-item a').tap(function () {
                    var other = $(this).parent().siblings().find('a');
                    if ($(this).is('.option')) {
                        $(this).removeClass('option').addClass('active');
                        other.not('.done').removeClass('active').addClass('option');

                        // 马上刷新输入框的编号
                        $('#groupNumber').val($(this).text())
                    }
                });

                // 刷新默认的选中到输入框
                $('#groupNumber').val(nowSelect)

            } else {
                mui.toast(res.description);
            }
        });
    }

    // 套餐组件
    var packageModal;

    //加载服务套餐
    function serviceData(typeId) {
        if (!groupId) {
            mui.toast("请选择投放地址");
        } else {
            if (!typeId) {
                mui.toast("请选择投放类型");
                return;
            }
            var payload = {
                'dealerId': $("#customerId").val(),
                'devNo': eid,
                'typeId': typeId
            };

            sendRequest("/agent/getDefaultPackageList", "GET", payload,
                function (res) {
                    if (res.result == 1) {
                        $("#wash").removeClass();
                        $("#addWash").siblings().remove();

                        if (packageModal) {
                            packageModal.update({
                                devData: {code: code},
                                unit: unit,
                                packages: res.para
                            });
                        } else {
                            packageModal = new PackageComponent({
                                el: "#packageSetting",
                                devData: {code: code},
                                unit: unit,
                                packages: res.para
                            });
                        }
                    } else {
                        mui.toast(res.description);
                    }
                });
        }
    }

    //投放地址
    $('#location').tap(function (e) {
        e.preventDefault();
        var customerIdVal = $('#customerId').val();
        if (!customerIdVal) {
            mui.alert("请先选择经销商", '温馨提示', '我知道了');
            return null;
        }
        if ($("#location").val()) {
            var url = 'location-option.html?eid=' + eid + '&logicalCode=' + logicalCode +
                "&customerId=" + customerIdVal + "&customer=" + customer;
            goPage(url);
        } else {
            var url = 'location-add.html?eid=' + eid + '&logicalCode=' + logicalCode +
                "&customerId=" + customerIdVal + "&customer=" + customer;
            goPage(url);
        }

        // 缓存数据，避免后退丢失
        var cache = {customerId: customerId, customer: customer}
        setSessionStorage("DEVICE_REG_PARAM", $.extend(true, getSessionStorage("DEVICE_REG_PARAM"), cache), 1000 * 60 * 30);
    });

    var registerFlag = false;

    function register() {
        if (!registerFlag) {
            var location = $("#location").val();
            var customerId = $("#customerId").val();
            var typeId = $("#typeId").val();

            var groupNumber = $("#groupNumber").val();
            var remarks = $("#remarks").val();
            var instructions = $("#instructions").val();

            if (!logicalCode) {
                mui.toast("请输入设备编码，或是扫码注册");
                return;
            }
            if (customerId === null || customerId === "" || customerId === undefined) {
                mui.toast("请选择经销商");
                return;
            }
            if (!location) {
                mui.toast("请选择投放地址");
                return;
            }
            if (!typeId) {
                mui.toast("请选择设备类型");
                return;
            }

            if (groupNumber === '') {
                mui.toast("请输入组内地址/编号");
                return;
            }

            var washServiceData = packageModal.getPackages();
            var displaySwitchs = packageModal.getDisplaySwitchs();
            if (code == 110000 || code == 111000) {
                // 售货柜不需要套餐
            } else {
                if (!packageModal) {
                    mui.toast("默认套餐未加载，请刷新重试");
                    return;
                }

                if (washServiceData.length < 1) {
                    mui.toast("请添加服务套餐");
                    return;
                }
            }

            registerFlag = true;
            var href = window.location.href;
            var url = "/device/registerEquipment";
            var data = {
                "customerId": customerId,

                "logicalCode": logicalCode,
                "devNo": eid,// 扫码注册时才有
                "qrCodeUrl": qrCodeUrl,// 扫码注册时才有
                "groupId": groupId,
                "typeId": typeId,
                "washConfigs": washServiceData,
                "displaySwitchs": displaySwitchs,
                "href": href,

                "groupNumber": groupNumber,
                remarks: remarks,
                instructions: instructions
            };
            $("#progress").show();
            sendRequest(url, "POST", data, function (res) {

                if (res.result == 1) {
                    var btnArray = ['返回', '继续注册'];
                    mui.confirm('线上手机收费套餐已设置成功，线下投币收费套餐请在投币箱或者设备上设置', '注册成功', btnArray, function (e) {
                        if (e.index == 0) {
                            history.back();
                        } else if (e.index == 1) {
                            scanQRCodeToReg();
                        }
                    });
                } else {
                    registerFlag = false;
                    mui.alert(res.description, '温馨提示', '我知道了');
                }
            }, "json", null, function () {
                $("#progress").hide();
            });
        }
    }

</script>
</body>
</html>