update...

潘钊
1 parent 40d61184
Showing 3 changed files with 566 additions and 1 deletions
src/main/resources/static/pages/control/lineallot_v2/iframe_wrap.html
src/main/resources/static/pages/control/lineallot_v2/main.html
src/main/resources/static/real_control_v2/js/north/toolbar.js
+<!-- 线路选择 -->
+<iframe src="/pages/control/lineallot_v2/main.html?origin=real_control_iframe" frameborder="0" style="height: 100%;width: 100%;"></iframe>
 \ No newline at end of file
+<!DOCTYPE html>
+<html lang="zh-cn">
+
+<head>
+    <meta charset="UTF-8">
+    <link rel="stylesheet" href="/assets/plugins/uk3.0/uikit.min.css"/>
+    <link rel="stylesheet" href="/real_control_v2/assets/plugins/perfect-scrollbar/perfect-scrollbar.css"/>
+    <!-- flatpickr -->
+    <link rel="stylesheet" href="/real_control_v2/assets/plugins/flatpickr/flatpickr.min.css">
+    <style>
+        html, body {
+            height: 100%;
+        }
+
+        .ct_page {
+            padding: 25px 15px;
+            height: 100%;
+            height: calc(100% - 65px);
+        }
+
+        .ct_cont {
+            height: calc(100% - 41px);
+        }
+
+        .ct_cont > div > div.uk-card {
+            height: 99%;
+        }
+
+        .loading {
+            height: 100%;
+            text-align: center;
+        }
+
+        .loading .uk-spinner {
+            margin-top: 200px;
+        }
+
+        .loading circle {
+            stroke: red;
+        }
+
+        .ps-container > .ps-scrollbar-x-rail, .ps-container > .ps-scrollbar-y-rail {
+            opacity: 0.6 !important;
+            padding: 0 !important;
+        }
+
+        .line_list_all_wrap {
+            height: 200px;
+            overflow: auto;
+            position: relative;
+            -webkit-user-select:none;
+            -moz-user-select:none;
+            -ms-user-select:none;
+            user-select:none;
+        }
+
+        .line_list_all_wrap > .item {
+            background: #fff;
+            color: #666;
+            box-shadow: 0px 3px 12px rgba(0, 0, 0, 0.08);
+            padding: 7px 12px;
+            border: 1px solid #ececec;
+            display: inline-block;
+            margin: 5px;
+            min-width: 70px;
+            text-align: center;
+            cursor: default;
+        }
+
+        .line_list_all_wrap > .item.active{
+            background: #ffe9a5;
+        }
+
+        .checked_list {
+            padding-left: 4px;
+            -webkit-user-select:none;
+            -moz-user-select:none;
+            -ms-user-select:none;
+            user-select:none;
+        }
+
+        .checked_list > .item {
+            color: #fbfbfb;
+            box-shadow: 0px 3px 12px rgba(50, 197, 210, 0.3);
+            padding: 7px 12px;
+            border: 1px solid #ececec;
+            display: inline-block;
+            margin: 5px 2px;
+            min-width: 70px;
+            text-align: center;
+            background: #32C5D2;
+            cursor: move;
+        }
+
+        .company_search_wrap {
+            width: 610px;
+            margin-left: 6px;
+        }
+
+        .company_search_wrap select {
+            display: inline-block;
+            width: 128px;
+            margin-right: 12px;
+        }
+
+        .uk-card {
+            border: 1px solid #eeeeee;
+        }
+
+        .footer_tools_card {
+            margin-top: 20px;
+            padding: 20px 40px;
+        }
+
+        .footer_tools_card label {
+            vertical-align: bottom;
+            display: inline-block;
+            font-size: 13px;
+            margin-left: 13px;
+            margin-bottom: 3px !important;
+        }
+
+        .uk-button-default{
+            background: #e0e0e0 !important;
+        }
+    </style>
+</head>
+
+<body>
+<div class="loading">
+    <div uk-spinner></div>
+</div>
+<div class="ct_page" style="display: none;">
+    <h2 class="uk-heading-line uk-heading-bullet"><span>线调 <h5 style="display: inline-block;">-选择线路</h5></span></h2>
+    <div class="ct_cont">
+        <div class="allot_wrap uk-flex-center" uk-grid>
+            <div class="uk-card uk-card-hover uk-card-body uk-width-2-3@m"
+                 style="padding-top: 20px;padding-bottom: 20px;">
+                <div class="company_search_wrap">
+                    <select class="uk-select company_search_select"></select>
+                    <select class="uk-select fgs_search_select" disabled>
+                        <option value="">分公司搜索</option>
+                    </select>
+                    <div class="uk-inline">
+                        <span class="uk-form-icon uk-form-icon-flip" uk-icon="icon: search"></span>
+                        <input class="uk-input line_search_input" style="width: 310px;" placeholder="搜索线路">
+                    </div>
+                </div>
+                <hr>
+                <div class="line_list_all_wrap"></div>
+                <hr>
+                <div class="checked_list" uk-sortable> </div>
+            </div>
+
+            <div class="uk-card uk-card-hover uk-card-body uk-width-2-3@m footer_tools_card">
+                <button class="uk-button uk-button-default uk-button-large" style="font-size: 16px" id="go_to_real_system_btn"><i
+                        uk-icon=" icon: sign-in" style="margin-right: 5px;" ></i>进入线路调度
+                </button>
+                <label class="pattern_type_label"><input class="uk-checkbox" type="checkbox" > 主调模式登录</label>
+                <label class="new_window_open_label" title="可能会被浏览器阻止新建窗口" uk-tooltip><input class="uk-checkbox" type="checkbox"> 新窗口打开</label>
+            </div>
+
+            <div class="uk-alert-warning uk-width-2-3@m " uk-alert>
+                <p>注意！！！ 相关“设备调试人员”和“测试人员”不要以主调模式进入线调。</p>
+            </div>
+        </div>
+    </div>
+</div>
+
+<script id="line_list_items_temp" type="text/html">
+    {{each list as obj i}}
+    <span class="item" data-id="{{obj.lineCode}}" data-gsbm="{{obj.company}}_{{obj.brancheCompany}}">{{obj.name}}</span>
+    {{/each}}
+</script>
+
+<script src="/metronic_v4.5.4/plugins/jquery.min.js"></script>
+<script src="/assets/plugins/uk3.0/uikit.min.js"></script>
+<script src="/assets/plugins/uk3.0/uikit-icons.min.js"></script>
+<script src="/real_control_v2/assets/plugins/perfect-scrollbar/perfect-scrollbar.jquery.js"></script>
+<!-- EventProxy  -->
+<script src="/assets/js/eventproxy.js"></script>
+<!-- art-template 模版引擎 -->
+<script src="/assets/plugins/template.js"></script>
+<script src="/real_control_v2/assets/plugins/moment/moment.min.js"></script>
+<script src="/assets/plugins/pinyin.js"></script>
+<script>
+    var allMapps = {};//线路搜索映射
+    var companyData = {};
+    var codeMapps={}; //线路编码映射
+    //滚动条
+    $('.line_list_all_wrap').perfectScrollbar();
+
+    var ep = EventProxy.create('all_lines', 'user_author', 'company_data', function (allLines, userAuthor, company_data) {
+        //按用户权限过滤线路
+        var authArray = userAuthor.lineCodeStr.split(','),
+                newArray = [];
+        $.each(allLines, function () {
+            if (this.lineCode && authArray.indexOf(this.lineCode) != -1) {
+                newArray.push(this);
+                codeMapps[this.lineCode] = this;
+            }
+        });
+        //排序
+        newArray.sort(function (a, b) {
+            return a.name.localeCompare(b.name);
+        });
+        //创建线路搜索映射
+        createLineSearchMapps(newArray);
+
+        var htmlStr = template('line_list_items_temp', {list: newArray});
+        $('.line_list_all_wrap').html(htmlStr);
+
+        //过滤公司编码数据
+        filter_company_data.filter(newArray, convert_buss_data(company_data));
+        initCompanySelect();
+        //更新滚动条高度
+        setTimeout(function () {
+            $('.line_list_all_wrap').perfectScrollbar('update');
+        }, 1000);
+
+        //登录模式
+        changePattern(userAuthor.pattern);
+        if(!userAuthor.pattern)
+            $('.pattern_type_label').hide().find('input')[0].checked=false;
+        else
+            $('input','.pattern_type_label')[0].checked=true;
+
+        $('.loading').remove();
+        $('.ct_page').show();
+
+        //默认选中上次记录
+        var lineControlItems = window.localStorage.getItem('lineControlItems');
+        if (lineControlItems) {
+            var array = JSON.parse(lineControlItems);
+            $.each(array, function (i, line) {
+                $('.item[data-id='+line.lineCode+']','.line_list_all_wrap').trigger('click');
+            });
+        }
+    });
+
+    $('.pattern_type_label').on('click', function () {
+        var checked = $('input',this)[0].checked;
+        changePattern(checked);
+    });
+
+    function changePattern(status) {
+        var btn = $('#go_to_real_system_btn'),
+                def='uk-button-default',
+                prim='uk-button-primary';
+        if(status){
+            btn.removeClass(def).addClass(prim);
+        }
+        else{
+            btn.removeClass(prim).addClass(def);
+        }
+    }
+
+    /**
+     * 查询所有线路
+     */
+    $.get('/line/all', {destroy_eq: 0}, function (list) {
+        ep.emit('all_lines', list);
+    });
+
+    /**用户分配的线路*/
+    $.get('/realControAuthority/findByCurrentUser', function (t) {
+        ep.emit('user_author', t);
+    });
+
+    /** 查询公司编码 */
+    $.get('/business/all', function (rs) {
+        ep.emit('company_data', rs);
+    });
+
+    //点击选择线路
+    $('.line_list_all_wrap').on('click', 'span.item', function () {
+        var lineCode = $(this).data('id'),
+                name = $(this).text();
+        if ($(this).hasClass('active')) {
+            $(this).removeClass('active');
+
+            $('.item[data-id='+lineCode+']','.checked_list').remove();
+        }
+        else {
+            $(this).addClass('active');
+            $('.checked_list').append('<span data-id="'+lineCode+'" class="item uk-card uk-card-default">'+name+'</span>');
+        }
+    });
+
+    $('.checked_list').on('click', '.item', function () {
+        var lineCode = $(this).data('id');
+        $('.item[data-id='+lineCode+']','.line_list_all_wrap').removeClass('active');
+        $(this).remove();
+    });
+
+    /**
+     *  搜索线路
+     */
+    function search_line_list() {
+        var comp = $('select.company_search_select').val(),
+                fgs = $('select.fgs_search_select').val(),
+                gsbm = comp + '_' + fgs;
+
+        if(gsbm=='_')
+            gsbm=null;
+        var allDoms = $('.line_list_all_wrap span.item');
+        //线路
+        var lineCodeArray = [];
+        var t = $('.line_search_input').val();
+        if(t){
+            t = t.toUpperCase();
+            for(var m in allMapps){
+                if(m.indexOf(t)!=-1)
+                    lineCodeArray.push(allMapps[m]);
+            }
+        }
+
+        //搜索
+        var show_elems = [];
+        for (var i=0, dom; dom = allDoms[i++];) {
+            if(gsbm && $(dom).data('gsbm').indexOf(gsbm)==-1)
+                continue;
+
+            if(t && lineCodeArray.indexOf($(dom).data('id')+'') == -1)
+                continue;
+
+            show_elems.push($(dom));
+        }
+
+        //show
+        allDoms.hide();
+        for(var j=0,$dom;$dom=show_elems[j++];)
+            $dom.show();
+    }
+
+    function createLineSearchMapps(list) {
+        allMapps = {};
+        var name, code;
+        for (var i = 0, line; line = list[i++];) {
+            name = line.name;
+            code = line.lineCode;
+            //拼音映射
+            allMapps[pinyin.getCamelChars(name)] = code;
+            allMapps[pinyin.getFullChars(name).toUpperCase()] = code;
+            //中文映射
+            allMapps[name] = code;
+        }
+    }
+
+
+    //构建公司级联下拉框
+    function initCompanySelect() {
+        var opts = '<option value="">公司搜索</option>';
+        for (var k in companyData) {
+            opts += '<option value="' + k + '">' + companyData[k].name + '</option>';
+        }
+        $('select.company_search_select').html(opts);
+    }
+
+    //公司切换
+    $('select.company_search_select').on('change', function () {
+        var opts = '<option value="">分公司搜索</option>',
+                t = $(this).val(),
+                fgsSelect = $('select.fgs_search_select');
+        if (!t) {
+            fgsSelect.html(opts).attr('disabled', 'disabled');
+        }
+        else{
+            var array = companyData[t].childs;
+            for (var i = 0, fgs; fgs = array[i++];) {
+                opts += '<option value="' + fgs.businessCode + '">' + fgs.businessName + '</option>';
+            }
+
+            fgsSelect.html(opts).removeAttr('disabled');
+        }
+        search_line_list();
+    });
+
+    //分公司切换
+    $('select.fgs_search_select').on('change', search_line_list);
+
+    //线路文本框输入
+    var flag;
+    $('.line_search_input').on('input', function () {
+        if(flag)
+            return;
+        flag = true;
+        setTimeout(function () {
+            //延迟
+            search_line_list();
+            flag = false;
+        }, 200);
+    });
+
+    function convert_buss_data(rs) {
+        var baseCode;
+        //找到跟节点
+        $.each(rs, function () {
+            if (this.upCode == 0) {
+                baseCode = this.businessCode;
+                return false;
+            }
+        });
+        if (!baseCode)return;
+        //提取二级节点
+        var secondMap = {};
+        $.each(rs, function () {
+            if (this.upCode == baseCode)
+                secondMap[this.businessCode] = {name: this.businessName, childs: []};
+        });
+        //分公司节点
+        $.each(rs, function () {
+            if (secondMap[this.upCode])
+                secondMap[this.upCode].childs.push(this);
+        });
+        //排序
+        for (var sid in secondMap)
+            secondMap[sid].childs.sort(naturalSort);
+        return secondMap;
+    }
+
+    var naturalSort = function (a, b) {
+        return a.businessName.localeCompare(b.businessName);
+    };
+
+    /**
+     * 根据用户线路权限过滤公司编码数据
+     */
+    var filter_company_data = (function () {
+        var filter = function (lineArray, data) {
+            companyData = {};
+            var com, fCom;
+            $.each(lineArray, function () {
+                com = this.company;
+                fCom = this.brancheCompany;
+                if (!companyData[com]) {
+                    companyData[com] = {name: data[com].name, childs: []};
+                }
+
+                if (!get(fCom, companyData[com].childs)) {
+                    companyData[com].childs.push(get(fCom, data[com].childs));
+                }
+            });
+        };
+
+        function get(fgsCode, fgsArray) {
+            for (var i = 0, fgs; fgs = fgsArray[i++];) {
+                if (fgs.businessCode == fgsCode)
+                    return fgs;
+            }
+            return null;
+        }
+
+        return {
+            filter: filter
+        }
+    })();
+    var storage = window.localStorage;
+    $('#go_to_real_system_btn').on('click', go_to_xd_sys);
+    /**
+     * 进入线调
+     */
+    function go_to_xd_sys() {
+        var items = $('.checked_list .item');
+        if(items.length==0)
+            return UIkit.notification({message: '你还没有选择线路！', pos: 'bottom-center', status: 'danger'});
+        $(this).attr('disabled', 'disabled');
+
+        show_btn_load(this, '更新缓存数据...');
+        (function () {
+            var ls_line_data = [];
+            $.each(items, function () {
+                ls_line_data.push(codeMapps[$(this).data('id')]);
+            });
+            //将线路基础信息写入localStorage
+            storage.setItem('lineControlItems', JSON.stringify(ls_line_data));
+            //监控模式还是主调模式
+            storage.setItem('operationMode', $('.pattern_type_label>input')[0].checked?1:0);
+
+            //进入线调
+            var eq = EventProxy.create('cache_route', 'check_line_config', function () {
+                var newWinOpen = $('input','.new_window_open_label')[0].checked;
+                if(!newWinOpen)
+                    top.window.location.href = "/real_control/v2";
+                else{
+                    window.open("/real_control/v2");
+                    $('#go_to_real_system_btn').html('已经尝试打开新窗口，如看不到，可能被浏览器阻止了');
+                }
+            });
+
+            //拼接线路编码
+            var idx='';
+            $.each(ls_line_data, function () {
+                idx+=(this.lineCode + ',');
+            });
+            //缓存路由
+            idx=idx.substr(0, idx.length - 1);
+            $.get('/realMap/findRouteByLine', {idx: idx}, function (rs) {
+                if (rs) {
+                    for(var lineCode in rs)
+                        storage.setItem(lineCode + '_route', JSON.stringify(rs[lineCode]));
+
+                    eq.emit('cache_route');
+                }
+            });
+
+            //检查线路配置
+            checkLineConfig(ls_line_data, function (rs) {
+                if (rs.status == 0)
+                    eq.emit('check_line_config');
+                else if (rs.status == 1){
+                    initLineConfig(rs.not, function () {
+                        eq.emit('check_line_config');
+                    });
+                }
+            })
+        })();
+    }
+
+    function checkLineConfig(lsData, cb) {
+        var lineCodeArray = [];
+        $.each(lsData, function () {
+            lineCodeArray.push(this.lineCode);
+        });
+
+        $.ajax({
+            url: '/lineConfig/check',
+            traditional: true,
+            data: {codeArray: lineCodeArray},
+            method: 'POST',
+            success: cb
+        });
+    }
+
+    function initLineConfig(arr, cb) {
+        var i = 0;
+        (function () {
+            if (i >= arr.length) {
+                cb && cb();
+                return;
+            }
+            var f = arguments.callee
+                    , lineCode = arr[i];
+
+            //showLoad('初始化' + lineIds[lineCode] + '配置信息...');
+            $.post('/lineConfig/init/' + lineCode, function (rs) {
+                if (rs == 1) {
+                    i++;
+                    f();
+                }
+            });
+        })();
+    }
+
+    /**
+     * 按钮转菊花
+     */
+    function show_btn_load(btn, msg) {
+        $(btn).html('<div uk-spinner></div> ' + msg);
+    }
+</script>
+</body>
+</html>
 \ No newline at end of file
@@ -48,7 +48,7 @@ var gb_northToolbar = (function () {
         $('.north .north-toolbar .exit-system').on('click', function () {
             //关闭websocket 连接
             gb_sch_websocket.sock().close(1000, '退出线调');
-            window.location.href = '/pages/control/lineallot/allot.html';
+            window.location.href = '/pages/control/lineallot_v2/iframe_wrap.html';
         });
  
         //console.log('xd_auth', xd_auth, 'data', data);