gdsx/WebRoot/Html5/Script/control.js

var dialog = new ht.widget.Dialog();

function setNumberControl(x, y, varName, quality, maxValue, minValue, desc, groupid) {
    if (!isdowncontrol()) {
        return;
    }
    if (isAuthEnable == "True" && groupid >= 0) {
        getAuthInfoByGroupId(groupid, function (data) {
            if (data) {
                showDialog(x, y, varName, quality, maxValue, minValue, desc, groupid);
            }
        });
    } else {
        showDialog(x, y, varName, quality, maxValue, minValue, desc, groupid);
    }
}

function showDialog(x, y, varName, quality, maxValue, minValue, desc, groupid) {
    var w = $(window).width(),
        h = $(window).height();

    x += 40;
    y += 40;
    if (x + 290 > w) {
        x = x - 380;
    } 
    if (y + 190 > h) {
        y = y - 280;
    }
    var content = '<div style="text-align: center;"><label style="font-size: 18px; font-weight: 600;">'+ desc +'：</label><input focus type="number" style="height: 36px; font-size: 16px; width: 140px;" id="isetnumber" /></div>';
    GD.createMessageDialog(300, 200, content, function () {
        var value = $("#isetnumber").val();
        if (checkNumber(value) == true && value.length > 0) {
            if (value-0 > maxValue-0) {
                GD.createErrorDialog(300, 200, '设定值不能高于上限值！');
            } else if (value-0 < minValue-0) {
                GD.createErrorDialog(300, 200, '设定值不能低于下限值！');
            } else {
                submitAddSingle(varName, value, "", quality, desc + ' ' + value, groupid);
            }
        } else {
            $("#isetnumber").val("");
        }
    }, function (){}, null, null, ' ', x, y);
    $('#isetnumber').focus();
}

var openPageDialog = new ht.widget.Dialog();
function setPageDialogControl(x, y, width, height, src, center, titleshow, autoAdaptX, autoAdaptY) {
    var clientWidth = browserSize.width,
        clientHeight = browserSize.height;

    var ratioX = clientWidth / backSize.width,
        ratioY = clientHeight / backSize.height;

    var savedTags = GD.getParams('trendtags') || {},
        savedTagsStr = '',
        searchObj = GD.getSearchObjFromUrl(src) || {},
        tag = searchObj.tagName || '';

    savedTags = savedTags.trendTags || [];

    if (savedTags.indexOf(tag) !== -1) {
        savedTags.splice(savedTags.indexOf(tag), 1);
    }
    if (savedTags.length > 0)
        savedTagsStr = ',' + savedTags.join(',');

    if (height > clientHeight) {
        center = "false";
    }

    if (!titleshow) {
        var positionX = x + width * 0.5;
        var positionY = y + height * 0.5;
        width *= ratioX;
        height *= ratioY;
        positionX *= ratioX;
        positionY *= ratioY;

        if (!!autoAdaptX) {
            width = clientWidth;
            positionX = width * 0.5;
        }
        if (!!autoAdaptY) {
            height = clientHeight;
            positionY = height * 0.5;
        }
        if (center === 'true') {
            positionX = clientWidth * 0.5;
            positionY = clientHeight * 0.5;
        }
        src = PAGEROOTDIR + src + savedTagsStr;
        var content = "<iframe src='" + src + "' name='' width='" + width + "' height='" + height + "' scrolling='no'  frameborder='0'></iframe>";
        openPageDialog = new ht.HtmlNode();
        openPageDialog.setPosition(positionX, positionY);
        openPageDialog.setSize(width, height);
        openPageDialog.setHtml(content);

        dataModel.add(openPageDialog);
        // resizeOneNodes(openPageDialog, ratioX, ratioY);
    } else {
        if (width > clientWidth) {
            width = document.body.clientWidth;
        }

        if (!!autoAdaptX) {
            width = clientWidth;
            x = 0;
        }
        if (!!autoAdaptY) {
            height = clientHeight;
            y = 0;
        }
        src = PAGEROOTDIR + src + savedTagsStr;
        var content = "<iframe src='" + src + "' name='' width='100%' height='100%' scrolling='no'  frameborder='0'></iframe>";
        var obj = {
            titleAlign: "left",
            closable: true,
            maximizable: true,
            draggable: true,
            width: width,
            height: height,
            content: content
        };

        if (center == "true") {
            openPageDialog.setConfig(obj);
        } else {
            obj.position = { x: x, y: y };
        }
        openPageDialog.setConfig(obj);
        openPageDialog.setModal(false);
        openPageDialog.show();
    }
    openPageDialog.onHidden = function (e) {
        GD.removeParams('trendtags');
    }
    $('.main').off('click').on('click', function () {
        (typeof openPageDialog.hide === 'function') && openPageDialog.hide(true);
        setTimeout(function () {
            savedTags.push(tag);
            savedTags = GD.removeRepeated(savedTags);
            GD.setParams({ trendTags: savedTags }, 'trendtags');
        }, 500);
    });
}

var customEventMap = {
    "jumpPage": "customEventJump", //跳转页面
    "resizeNodes": "customEventResizeNodes", // 重新设置元素大小
    "setPageSize": "customEventSetPageSizeWithRatio", // 能过设置比例改变页面大小
}

/**
 * data = e.data;
 * data {
 *      action: '',
 *      args: {
 *          foo: 'bar',
 *          url: 'XXX'   
 *      }
 * }
 */

window.addEventListener('message', function (e) {
    var data = e.data || {};
    if (data == 'close') {
        closePageDialogControl()
    }
    if (data === 'getZoom') {
        e.source.postMessage({
            action: 'resizeNodes',
            args: {
                ratioX: 1,
                ratioY: 1,
                zoom: graphView.getZoom()
            }
        }, '*');
    }
    if (customEventMap[data.action]) {
        $(window).trigger(customEventMap[data.action], data.args)
    }
});

//关闭弹出面板
function closePageDialogControl() {
    if (typeof openPageDialog.isShowing == "function") {
        if (openPageDialog.isShowing()) {
            //隐藏对话框
            openPageDialog.hide();
        }
    } else {

        dataModel.remove(openPageDialog);
    }
}


function initData(data, direct, nodeArrows, nodeArrowe) {
    var arrowNames = [nodeArrows];
    var arrowNamee = [nodeArrowe];

    var fromArrow = {
        position: 16,
        names: arrowNames,
        rotation: Math.PI,
        keepOrien: true,
        offsetX: -60,
        offsetY: 5
    };
    var endArrow = {
        position: 19,
        names: arrowNamee,
        keepOrien: true,
        offsetX: 10,
        offsetY: -5
    }

    if (direct == "start") { endArrow = {} };
    if (direct == "end") { fromArrow = {} };
    if (direct == "no") { fromArrow = {}; endArrow = {} };

    data.s({
        'icons': {
            fromArrow: fromArrow,
            toArrow: endArrow
        }
    });
}

function createMessageDialog(width, height, content, surefunc, canclefunc) {
    var messageDialog = new ht.widget.Dialog();
    var content = '<p class="dialog-content-custom">' + content + '</p>';
    messageDialog.setConfig({
        title: "提示",
        titleIcon: 'node_image',
        titleAlign: "left",
        closable: true,
        draggable: true,
        //maximizable: true,
        width: width,
        height: height,
        content: content,
        contentPadding: 20,
        buttons: [{
            label: "确认",
            className: 'dialog-button-confirm'
        }, {
            label: "取消",
            className: 'dialog-button-cancel'
        }],
        buttonsAlign: "center",
        action: function (item, e) {
            if (item.label == "确认") {
                surefunc();
                messageDialog.hide();
            }
            else {
                canclefunc();
                messageDialog.hide();
            }
        }
    });
    messageDialog.setModal(false);
    messageDialog.show();
}

function getChartLineFeed(title, datas, fontSize, barContainerWidth, xWidth, x2Width, insertContent) {
    if (!datas || datas.length == 0) {
        //alert("用于计算柱状图柱子个数的参数datas不合法！"); 
        return false;
    }
    if (isNaN(barContainerWidth)) {
        //alert("柱状图初始化所在的容器的宽度不是一个数字"); 
        return false;
    }
    if (!fontSize) {
        fontSize = 12;
    }
    if (isNaN(xWidth)) {
        xWidth = 80;//默认与echarts的默认值一致
    }
    if (isNaN(x2Width)) {
        x2Width = 80;//默认与echarts的默认值一致
    }
    if (!insertContent) {
        insertContent = "\n";
    }

    var xAxisWidth = parseInt(barContainerWidth) - (parseInt(xWidth) + parseInt(x2Width));//柱状图x轴宽度=统计页面宽度-柱状图x轴的空白间隙(x + x2)
    var barCount = datas.length;								//x轴单元格的个数（即为获取x轴的数据的条数）
    var preBarWidth = Math.floor(xAxisWidth / barCount);		//统计x轴每个单元格的间隔
    var preBarFontCount = Math.floor(preBarWidth / fontSize);	//柱状图每个柱所在x轴间隔能容纳的字数 = 每个柱子 x 轴间隔宽度 / 每个字的宽度（12px）
    if (preBarFontCount > 3) {	//为了x轴标题显示美观，每个标题显示留两个字的间隙，如：原本一个格能一样显示5个字，处理后一行就只显示3个字
        preBarFontCount -= 2;
    } else if (preBarFontCount <= 3 && preBarFontCount >= 2) {//若每个间隔距离刚好能放两个或者字符时，则让其只放一个字符
        preBarFontCount -= 1;
    }

    var newTitle = "";		//拼接每次截取的内容，直到最后为完整的值
    var titleSuf = "";		//用于存放每次截取后剩下的部分
    var rowCount = Math.ceil(title.length / preBarFontCount);	//标题显示需要换行的次数
    if (rowCount > 1) {		//标题字数大于柱状图每个柱子x轴间隔所能容纳的字数，则将标题换行
        for (var j = 1; j <= rowCount; j++) {
            if (j == 1) {

                newTitle += title.substring(0, preBarFontCount) + insertContent;
                titleSuf = title.substring(preBarFontCount);	//存放将截取后剩下的部分，便于下次循环从这剩下的部分中又从头截取固定长度
            } else {
                var startIndex = 0;
                var endIndex = preBarFontCount;
                if (titleSuf.length > preBarFontCount) {	//检查截取后剩下的部分的长度是否大于柱状图单个柱子间隔所容纳的字数
                    newTitle += titleSuf.substring(startIndex, endIndex) + insertContent;
                    titleSuf = titleSuf.substring(endIndex);	//更新截取后剩下的部分，便于下次继续从这剩下的部分中截取固定长度
                } else if (titleSuf.length > 0) {
                    newTitle += titleSuf.substring(startIndex);
                }
            }
        }
    } else {
        newTitle = title;
    }
    return newTitle;
}

function vectorMoveRotate(nodename, sx, sy, x_relat, y_relat, min, max, directFun) {
    //var rotation=nodename.getRotation();
    //var relatXPosition=sx*Math.cos(rotation),relatYPosition=sy*(Math.sin(rotation));

    var relatXPosition = sx, relatYPosition = sy;
    if (x_relat) {
        relatXPosition = relatXPosition + nodename.getPosition().x;
    }
    if (y_relat) {
        relatYPosition = relatYPosition + nodename.getPosition().y;
    }

    if (directFun == "Horizontal") {
        relatXPosition = relatXPosition >= max ? max : relatXPosition;
        relatXPosition = relatXPosition <= min ? min : relatXPosition;
    }

    if (directFun == "Vertical") {
        relatYPosition = relatYPosition >= max ? max : relatYPosition;
        relatYPosition = relatYPosition <= min ? min : relatYPosition;
    }
    nodename.setPosition(relatXPosition, relatYPosition);
}

function createTagProperty(dic, tagname, width, height) {
    var tagPropsDialog = new ht.widget.Dialog();
    var tagprop = dic[tagname.toLowerCase()];
    var content = "";
    if (typeof (tagprop) == "undefined") {
        content = "<p style='color:cadetblue;font-size:15px'>" + "标签名称:" + tagname + "<br/>" + "描述:" + "" + "<br/>" + "单位:" + "" + "<br/>" + "量程上限:" + "" + "<br/>" + "量程下限:"
            + "" + "<br/>" + "快照时间:" + "" + "</p>";
    } else {
        content = "<p style='color:cadetblue;font-size:15px'>" + "标签名称:" + tagprop.TableDotTag + "<br/>" + "描述:" + tagprop.Desc + "<br/>" + "单位:" + tagprop.Unit + "<br/>" + "量程上限:" + tagprop.HighLimit + "<br/>" + "量程下限:"
            + tagprop.LowLimit + "<br/>" + "快照时间:" + VarSnapshotTime[tagname.toLowerCase()] + "</p>";
    }

    var tagpropConfig = {
        title: "属性",
        titleAlign: "left",
        closable: true,
        draggable: true,
        width: width,
        height: height,
        content: content,
        contentPadding: 0
    };

    tagPropsDialog.setConfig(tagpropConfig);
    tagPropsDialog.setModal(false);
    tagPropsDialog.show();

    var interval = setInterval(function () {
        if (typeof (tagprop) == "undefined") {
            return;
        }
        var content = "<p style='color:cadetblue;font-size:15px'>" + "标签名称:" + tagprop.TableDotTag + "<br/>" + "描述:" + tagprop.Desc + "<br/>" + "单位:" + tagprop.Unit + "<br/>" + "量程上限:" + tagprop.HighLimit + "<br/>" + "量程下限:"
            + tagprop.LowLimit + "<br/>" + "快照时间:" + VarSnapshotTime[tagname.toLowerCase()] + "</p>";
        tagpropConfig.content = content;

        if (tagPropsDialog.isShowing()) {
            tagPropsDialog.setConfig(tagpropConfig);
        } else {
            return;
        }

        tagPropsDialog.setModal(false);
    }, 2000);

    tagPropsDialog.onHidden = function () {
        tagPropsDialog.hide();
        clearInterval(interval);
    }
}

function PointSelectDialog(width, height, backcolor, dm, partdm, formPane, pageSize) {
    var pointSelectformPane = new ht.widget.FormPane();
    var pointSelectTags = new ht.DataModel();
    var pointSelecttablePane = new ht.widget.TablePane(pointSelectTags);
    var pointSelectAttr = [
        {
            name: 'id',
            displayName: 'Id',
            align: 'center',
            width: 50
        },
        {
            name: 'configPointDesc',
            displayName: '描述',
            align: 'center',
            accessType: 'attr',
            width: 200
        },
        {
            name: 'configPointName',
            displayName: '标签名',
            align: 'center',
            accessType: 'attr',
            width: 250
        }
    ];
    pointSelecttablePane.addColumns(pointSelectAttr);
    var pointSelecttableView = pointSelecttablePane.getTableView();
    pointSelecttableView.setCheckMode(true);

    var pointSelectPageIndex = 1;
    var pointSelectPageSize = 100;
    document.body.appendChild(pointSelectformPane.getView());
    pointSelectformPane.addRow([
        '表名称:',
        {
            id: 'tablename',
            textField: {
                text: '*'
            }
        },
        '标签点描述:',
        {
            id: 'pointDesc',
            textField: {
                text: '*'
            }
        },
        {
            button: {
                label: '查找',
                onClicked: function () {
                    pointSelectTags.clear();
                    var tagDesc = pointSelectformPane.v('pointDesc');
                    var tablename = pointSelectformPane.v('tablename');
                    pointSelectPageIndex = 1;
                    pointSelectformPane.v('pageindex', pointSelectPageIndex.toString());
                    getPointsSelect(pointSelectPageIndex, pointSelectPageSize, tablename, tagDesc, pointSelectTags, pointSelectformPane);
                }
            },
        }
    ],
        [0.12, 0.3, 0.2, 0.3, 0.3]);
    pointSelectformPane.addRow([pointSelecttablePane], [0.1], 0.1);
    pointSelectformPane.addRow([
        {
            button: {
                label: '<<',
                onClicked: function () {
                    pointSelectTags.clear();
                    pointSelectPageIndex = 1;
                    pointSelectformPane.v('pageindex', pointSelectPageIndex.toString());
                    var tagDesc = pointSelectformPane.v('pointDesc');
                    var tablename = pointSelectformPane.v('tablename');
                    getPointsSelect(pointSelectPageIndex, pointSelectPageSize, tablename, tagDesc, pointSelectTags, pointSelectformPane);
                }
            }
        },
        {
            button: {
                label: '<',
                onClicked: function () {
                    pointSelectTags.clear();
                    if (pointSelectPageIndex > 1) {
                        pointSelectPageIndex = pointSelectPageIndex - 1;
                    }
                    pointSelectformPane.v('pageindex', pointSelectPageIndex.toString());
                    var tagDesc = pointSelectformPane.v('pointDesc');
                    var tablename = pointSelectformPane.v('tablename');
                    getPointsSelect(pointSelectPageIndex, pointSelectPageSize, tablename, tagDesc, pointSelectTags, pointSelectformPane);
                }
            }
        },
        {
            id: "pageindex",
            element: pointSelectPageIndex.toString()
        },
        {
            element: "/",
        },
        {
            id: "pagecount",
            element: "1"
        },
        {
            button: {
                label: '>',
                onClicked: function () {
                    pointSelectTags.clear();
                    if (pointSelectPageIndex < pointSelectformPane.v('pagecount')) {
                        pointSelectPageIndex = pointSelectPageIndex + 1;
                    }
                    pointSelectformPane.v('pageindex', pointSelectPageIndex.toString());
                    var tagDesc = pointSelectformPane.v('pointDesc');
                    var tablename = pointSelectformPane.v('tablename');
                    getPointsSelect(pointSelectPageIndex, pointSelectPageSize, tablename, tagDesc, pointSelectTags, pointSelectformPane);
                }
            },
        },
        {
            button: {
                label: '>>',
                onClicked: function () {
                    pointSelectTags.clear();
                    pointSelectPageIndex = pointSelectformPane.v('pagecount');
                    pointSelectformPane.v('pageindex', pointSelectPageIndex.toString());
                    var tagDesc = pointSelectformPane.v('pointDesc');
                    var tablename = pointSelectformPane.v('tablename');     //tablename;
                    getPointsSelect(pointSelectPageIndex, pointSelectPageSize, tablename, tagDesc, pointSelectTags, pointSelectformPane);
                }
            }
        }
    ],
        [0.05, 0.05, 0.02, 0.02, 0.02, 0.05, 0.05]);

    getPointsSelect(pointSelectPageIndex, pointSelectPageSize, "*", "*", pointSelectTags, pointSelectformPane);
    pointSelectformPane.getView().style.background = backcolor;
    var pointSelect = new ht.widget.Dialog();

    var pointSelectConfigObj = {
        title: "标签点选择",
        titleAlign: "left",
        closable: true,
        draggable: true,
        contentPadding: 5,
        width: width,
        height: height,
        content: pointSelectformPane,
        buttons: [
            {
                label: "确认",
                className: "button-yes"
            },
            {
                label: "取消",
                className: "button-yes"
            }
        ],
        buttonsAlign: "center",
        action: function (item, e) {
            if (item.label == "确认") {
                var selectpoint = pointSelecttableView.sm()._map;
                for (var key in selectpoint) {
                    var pointspros = selectpoint[key];
                    var data = new ht.Data();
                    //data.setId(i+1);
                    data.a('index', dm._datas._as.length + 1);
                    data.a('configPointDesc', pointspros.a('configPointDesc'));
                    data.a('configPointName', pointspros.a('configPointName'));
                    data.a('pintunit', pointspros.a('pintunit'));
                    data.a('pointtype', pointspros.a('pointtype'));
                    data.a('snapvalue', "");
                    data.a('timestamp', "");
                    dm.add(data);
                }
                GetModelByPage(1, pageSize, dm, partdm, formPane);

                pointSelect.hide();
            }
            else {
                pointSelect.hide();
            }
        }
    }
    pointSelect.setConfig(pointSelectConfigObj);
    pointSelect.setModal(false);
    pointSelect.show();
}

function PointSnapPropsTable(width, height, backcolor, dm, partdm) {
    var pointSelectformPane = new ht.widget.FormPane();
    var pointSelecttablePane = new ht.widget.TablePane(partdm);
    var pointSelectAttr = [
        {
            name: 'index',
            displayName: 'ID',
            align: 'center',
            accessType: 'attr',
            width: 50
        },
        {
            name: 'configPointName',
            displayName: '标签名',
            align: 'center',
            accessType: 'attr',
            width: 250
        },
        {
            name: 'configPointDesc',
            displayName: '描述',
            align: 'center',
            accessType: 'attr',
            width: 200
        },
        {
            name: 'snapvalue',
            displayName: '值',
            align: 'center',
            accessType: 'attr',
            width: 200
        },
        {
            name: 'pintunit',
            displayName: '工程单位',
            align: 'center',
            accessType: 'attr',
            width: 100
        },
        {
            name: 'timestamp',
            displayName: '时间戳',
            align: 'center',
            accessType: 'attr',
            width: 150
        },
        {
            name: 'pointtype',
            displayName: '数值类型',
            align: 'center',
            accessType: 'attr',
            width: 100
        }
    ];
    pointSelecttablePane.addColumns(pointSelectAttr);

    var pointSelectPageIndex = 1;
    var pointSelectPageSize = 100;
    document.body.appendChild(pointSelectformPane.getView());
    pointSelectformPane.addRow([
        "",
        {
            button: {
                label: '追加',
                onClicked: function () {
                    var pageSize = parseInt(pageRows.getValue());
                    PointSelectDialog(600, 500, 'rgba(240,248,255,1)', dm, partdm, pointSelectformPane, pageSize);
                }
            }
        },
        {
            button: {
                label: '选择文件',
                width: 64,
                onClicked: function () {
                    var input = document.createElement('input');
                    input.type = 'file';
                    input.style.display = "none";
                    input.onchange = function () {
                        dm.clear();
                        partdm.clear();
                        var fileSelector = input.files;
                        var file = fileSelector[0];
                        var reader = new FileReader();
                        reader.readAsText(file);
                        reader.onload = function () {
                            var str = this.result;
                            var lineArr;
                            if (str.length >= 0) {
                                lineArr = str.split('\n');
                                for (var i = 1; i < lineArr.length - 1; i++) {
                                    var pointInfo = lineArr[i].split(',');
                                    var data = new ht.Data();
                                    data.a('index', pointInfo[0]);
                                    data.a('configPointDesc', pointInfo[2]);
                                    data.a('configPointName', pointInfo[1]);
                                    data.a('pintunit', pointInfo[4]);
                                    data.a('pointtype', pointInfo[6]);
                                    data.a('snapvalue', pointInfo[3]);
                                    data.a('timestamp', pointInfo[5]);
                                    dm.add(data);
                                }

                                pointSelectformPane.v('pageindex', "1");
                                var pageSize = parseInt(pageRows.getValue());
                                GetModelByPage(1, pageSize, dm, partdm, pointSelectformPane);
                                //GetModelByPage(pointSelectPageIndex,pageSize,dm,partdm,pointSelectformPane);
                            }
                        }
                    };
                    document.body.appendChild(input);
                    input.click();
                }
            }
        },
        {
            button: {
                label: '清除选择',
                onClicked: function () {
                    pointSelectformPane.v('pagecount', "1");
                    pointSelectformPane.v('pageindex', "1");
                    dm.clear();
                    partdm.clear();
                }
            }
        }
    ],
        [0.6, 0.05, 0.05, 0.05]);
    pointSelectformPane.addRow([pointSelecttablePane], [0.1], 0.1);

    var pageRows = new ht.widget.ComboBox();
    pageRows.setValues([10, 20, 30, 50, 100, 200, 300, 400, 500]);
    pageRows.setValue(50);
    pageRows.setEditable(true);
    //pageRows.setWidth(50);
    pageRows.setDropDownWidth(140);
    pageRows.onValueChanged = function () {
        pointSelectformPane.v('pageindex', "1");
        var pageSize = parseInt(pageRows.getValue());
        GetModelByPage(1, pageSize, dm, partdm, pointSelectformPane);
        //重新刷新数据
    };

    pointSelectformPane.addRow([
        "",
        {
            button: {
                label: '<<',
                onClicked: function () {
                    pointSelectPageIndex = 1;
                    pointSelectformPane.v('pageindex', pointSelectPageIndex.toString());
                    var pageSize = parseInt(pageRows.getValue());
                    GetModelByPage(pointSelectPageIndex, pageSize, dm, partdm, pointSelectformPane);
                }
            }
        },
        {
            button: {
                label: '<',
                onClicked: function () {
                    pointSelectPageIndex = pointSelectformPane.v('pageindex');
                    if (pointSelectPageIndex > 1) {
                        pointSelectPageIndex = pointSelectPageIndex - 1;
                    }
                    pointSelectformPane.v('pageindex', pointSelectPageIndex.toString());
                    var pageSize = parseInt(pageRows.getValue());
                    GetModelByPage(pointSelectPageIndex, pageSize, dm, partdm, pointSelectformPane);
                }
            }
        },
        {
            id: "pageindex",
            element: pointSelectPageIndex.toString()
        },
        {
            element: "/",
        },
        {
            id: "pagecount",
            element: "1"
        },
        {
            button: {
                label: '>',
                onClicked: function () {
                    pointSelectPageIndex = parseInt(pointSelectformPane.v('pageindex'));
                    if (pointSelectPageIndex < pointSelectformPane.v('pagecount')) {
                        pointSelectPageIndex = pointSelectPageIndex + 1;
                    }
                    pointSelectformPane.v('pageindex', pointSelectPageIndex.toString());
                    var pageSize = parseInt(pageRows.getValue());
                    GetModelByPage(pointSelectPageIndex, pageSize, dm, partdm, pointSelectformPane);
                }
            },
        },
        {
            button: {
                label: '>>',
                onClicked: function () {
                    pointSelectPageIndex = pointSelectformPane.v('pagecount');
                    if (pointSelectPageIndex == 0) {
                        pointSelectPageIndex = 1;
                    } else {
                        pointSelectformPane.v('pagecount', "1");
                    }

                    pointSelectformPane.v('pageindex', pointSelectPageIndex.toString());
                    var pageSize = parseInt(pageRows.getValue());
                    GetModelByPage(pointSelectPageIndex, pageSize, dm, partdm, pointSelectformPane);
                }
            }
        },
        "rows:",
        {
            element: pageRows
        },
        {
            button: {
                label: '导出',
                onClicked: function () {
                    var title = ["ID", "标签点", "描述", "值", "工程单位", "时间戳", "数值类型"];
                    var titleKey = ["index", "configPointName", "configPointDesc", "snapvalue", "pintunit", "timestamp", "pointtype"];
                    var csvdata = [];
                    var datas = dm._datas._as;

                    if (datas.length == 0) {

                    } else {
                        for (var i = 0; i < datas.length; i++) {
                            var tagname = datas[i].a("configPointName");
                            var json = {
                                index: datas[i].a("index"),
                                configPointName: tagname,
                                configPointDesc: datas[i].a("configPointDesc"),
                                snapvalue: getVarValue(tagname),
                                pintunit: datas[i].a("pintunit"),
                                timestamp: VarSnapshotTime[tagname.toLowerCase()],
                                pointtype: datas[i].a("pointtype")
                            };
                            csvdata.push(json);
                        }
                    }

                    var obj = { title: title, titleForKey: titleKey, data: csvdata };
                    exportCsv(obj);
                }
            }
        },
        ""
    ],
        [0.3, 0.1, 0.1, 0.04, 0.02, 0.04, 0.1, 0.1, 0.05, 0.1, 0.1, 0.3]);
    //getPointsSelect(pointSelectPageIndex,pointSelectPageSize,"*","*",dm,pointSelectformPane);

    pointSelectformPane.getView().style.background = backcolor;
    return pointSelectformPane;
}

function GetModelByPage(pageIndex, pageSize, dm, partdm, formpane) {
    //改变页的条数
    var dataCount = dm._datas._as.length;
    var pageCount = 1;
    if (dataCount % pageSize == 0) {
        pageCount = dataCount / pageSize;
    } else {
        pageCount = Math.ceil(dataCount / pageSize);
    }

    if (pageCount == 0) { pageCount = 1 }
    formpane.v('pagecount', pageCount.toString());

    partdm.clear();
    var index = (pageIndex - 1) * pageSize;
    var pointspros = dm._datas._as;

    for (var i = index; i < index + pageSize; i++) {
        var data = new ht.Data();
        data.a('index', partdm._datas._as.length + 1);
        data.a('configPointDesc', pointspros[i].a('configPointDesc'));
        data.a('configPointName', pointspros[i].a('configPointName'));
        data.a('pintunit', pointspros[i].a('pintunit'));
        data.a('pointtype', pointspros[i].a('pointtype'));
        data.a('snapvalue', "");
        data.a('timestamp', "");
        partdm.add(data);
    }
}

function DirectPointDialogShow(data, callback) {
    var pointSelectformPane = new ht.widget.FormPane();
    var pointSelectTags = new ht.DataModel();
    var pointSelecttablePane = new ht.widget.TablePane(pointSelectTags);
    var pointSelectAttr = [
        {
            name: 'id',
            displayName: 'Id',
            align: 'center',
            width: 50
        },
        {
            name: 'configPointDesc',
            displayName: '描述',
            align: 'center',
            accessType: 'attr',
            width: 200
        },
        {
            name: 'configPointName',
            displayName: '标签名',
            align: 'center',
            accessType: 'attr',
            width: 250
        }
    ];
    pointSelecttablePane.addColumns(pointSelectAttr);
    var pointSelecttableView = pointSelecttablePane.getTableView();
    pointSelecttableView.setCheckMode(true);

    var pointSelectPageIndex = 1;
    var pointSelectPageSize = 100;
    document.body.appendChild(pointSelectformPane.getView());
    pointSelectformPane.addRow([
        '表名称:',
        {
            id: 'tablename',
            textField: {
                text: '*'
            }
        },
        '标签点描述:',
        {
            id: 'pointDesc',
            textField: {
                text: '*'
            }
        },
        {
            button: {
                label: '查找',
                onClicked: function () {
                    pointSelectTags.clear();
                    var tagDesc = pointSelectformPane.v('pointDesc');
                    var tablename = pointSelectformPane.v('tablename');
                    pointSelectPageIndex = 1;
                    pointSelectformPane.v('pageindex', pointSelectPageIndex.toString());
                    getPointsSelect(pointSelectPageIndex, pointSelectPageSize, tablename, tagDesc, pointSelectTags, pointSelectformPane);
                }
            },
        }
    ],
        [0.12, 0.3, 0.2, 0.3, 0.3]);
    pointSelectformPane.addRow([pointSelecttablePane], [0.1], 0.1);
    pointSelectformPane.addRow([
        {
            button: {
                label: '<<',
                onClicked: function () {
                    pointSelectTags.clear();
                    pointSelectPageIndex = 1;
                    pointSelectformPane.v('pageindex', pointSelectPageIndex.toString());
                    var tagDesc = pointSelectformPane.v('pointDesc');
                    var tablename = pointSelectformPane.v('tablename');
                    getPointsSelect(pointSelectPageIndex, pointSelectPageSize, tablename, tagDesc, pointSelectTags, pointSelectformPane);
                }
            }
        },
        {
            button: {
                label: '<',
                onClicked: function () {
                    pointSelectTags.clear();
                    if (pointSelectPageIndex > 1) {
                        pointSelectPageIndex = pointSelectPageIndex - 1;
                    }
                    pointSelectformPane.v('pageindex', pointSelectPageIndex.toString());
                    var tagDesc = pointSelectformPane.v('pointDesc');
                    var tablename = pointSelectformPane.v('tablename');
                    getPointsSelect(pointSelectPageIndex, pointSelectPageSize, tablename, tagDesc, pointSelectTags, pointSelectformPane);
                }
            }
        },
        {
            id: "pageindex",
            element: pointSelectPageIndex.toString()
        },
        {
            element: "/",
        },
        {
            id: "pagecount",
            element: "1"
        },
        {
            button: {
                label: '>',
                onClicked: function () {
                    pointSelectTags.clear();
                    if (pointSelectPageIndex < pointSelectformPane.v('pagecount')) {
                        pointSelectPageIndex = pointSelectPageIndex + 1;
                    }
                    pointSelectformPane.v('pageindex', pointSelectPageIndex.toString());
                    var tagDesc = pointSelectformPane.v('pointDesc');
                    var tablename = pointSelectformPane.v('tablename');
                    getPointsSelect(pointSelectPageIndex, pointSelectPageSize, tablename, tagDesc, pointSelectTags, pointSelectformPane);
                }
            },
        },
        {
            button: {
                label: '>>',
                onClicked: function () {
                    pointSelectTags.clear();
                    pointSelectPageIndex = pointSelectformPane.v('pagecount');
                    pointSelectformPane.v('pageindex', pointSelectPageIndex.toString());
                    var tagDesc = pointSelectformPane.v('pointDesc');
                    var tablename = pointSelectformPane.v('tablename');     //tablename;
                    getPointsSelect(pointSelectPageIndex, pointSelectPageSize, tablename, tagDesc, pointSelectTags, pointSelectformPane);
                }
            }
        }
    ],
        [0.05, 0.05, 0.02, 0.02, 0.02, 0.05, 0.05]);

    getPointsSelect(pointSelectPageIndex, pointSelectPageSize, "*", "*", pointSelectTags, pointSelectformPane);
    pointSelectformPane.getView().style.background = "rgba(240,248,255,1)";
    var pointSelect = new ht.widget.Dialog();

    var pointSelectConfigObj = {
        title: "标签点选择",
        titleAlign: "left",
        closable: true,
        draggable: true,
        contentPadding: 5,
        width: 600,
        height: 500,
        content: pointSelectformPane,
        buttons: [
            {
                label: "确认",
                className: "button-yes"
            },
            {
                label: "取消",
                className: "button-yes"
            }
        ],
        buttonsAlign: "center",
        action: function (item, e) {
            if (item.label == "确认") {
                var selectpoint = pointSelecttableView.sm()._map;
                //console.log(selectpoint);
                var str = "";
                for (var key in selectpoint) {
                    var tagInfo = selectpoint[key].a("configPointName") + ":" + selectpoint[key].a("configPointDesc") + ":true";

                    str = str + tagInfo + ",";
                }
                if (str[str.length - 1] == ",") str = str.substring(0, str.length - 1);
                data.setName(str);
                callback();
                pointSelect.hide();
            }
            else {
                pointSelect.hide();
            }
        }
    }
    pointSelect.setConfig(pointSelectConfigObj);
    pointSelect.setModal(false);
    pointSelect.show();
}

//创建表格基本信息
function createBaseTable(node, tableDataModel, rowheight, rowlinevisible, rowaltercolor, isrowalter, headcolor, headGradientcolor,
    columnlinevisible, linecolor, backcolor, fontsize, fontcolor, fontfamily) {
    var tableAttr = createTableAttr(rowheight, rowlinevisible, rowaltercolor, isrowalter, headcolor, headGradientcolor,
        columnlinevisible, linecolor, backcolor, fontsize, fontcolor, fontfamily);
    setTableStyle(node, tableAttr);
    return node;
}

function createTableByObj(node, tableAttr) {
    setTableStyle(node, tableAttr);
    return node;
}

//根据指标，标签点前缀信息获取标签点全名称
function getTagInfos(indicator, tagFirstHalfInfos) {
    var tagnames = "";
    var indicatorStr = indicator.split(',');
    var tagFirstHalfs = tagFirstHalfInfos.split(',');// column
    // Node3RowVarName="Demo.A01:A01:true,Demo.A02:A02:true,Demo.A03:A03:true";
    // Node3ColVarName="Speed:风速:true,State:状态:true,Line:线路:true";
    if (indicatorStr.length > 0) {
        for (var i = 0; i < tagFirstHalfs.length; i++) {
            if (tagFirstHalfs[i].split(':').length >= 1) {
                for (var j = 0; j < indicatorStr.length; j++) {
                    if (indicatorStr[j].split(':').length >= 1) {
                        tagnames += tagFirstHalfs[i].split(':')[0] + indicatorStr[j].split(':')[0] + ",";
                    }
                }
            }
        }
    }
    else {
        for (var j = 0; j < tagFirstHalfs.length; j++) {
            if (tagFirstHalfs[j].split(':').length >= 1) {
                tagnames += tagFirstHalfs[j].split(':')[0] + ",";
            }
        }
    }

    if (tagnames[tagnames.length - 1] == ",") {
        tagnames = tagnames.substr(0, tagnames.length - 1);
    }
    return tagnames;
}
//初始化列
function getColumnsInfo(columns, rows, title, ishis) {
    var shotTablecolumns = [];
    if (ishis) {
        shotTablecolumns.push({ name: "time", displayName: title, accessType: 'attr', align: 'center', width: 100 });
        if (columns != "") {
            shotTablecolumns.push({ name: "shebei", displayName: "设备", accessType: 'attr', align: 'center', width: 100 });
        }

    } else {
        shotTablecolumns.push({ name: "title", displayName: title, accessType: 'attr', align: 'center', width: 100 });
    }

    if (columns == "") {
        columns = rows;
    }

    var columnsArr = columns.split(',');
    if (columnsArr.length > 0) {
        for (var i = 0; i < columnsArr.length; i++) {
            var columnsHeader = columnsArr[i].split(':');
            if (columnsHeader.length >= 2) {
                //width=columnsHeader[2]=="0"?100:Number(columnsHeader[2]);
                if (columnsHeader[2] == "true") {
                    shotTablecolumns.push({ name: columnsHeader[0], displayName: columnsHeader[1], accessType: 'attr', align: 'center', width: 100 });
                }
            }
        }
    }
    return shotTablecolumns;
}

function getColumnsOrRowInfo(dmshow, notdmshow) {
    var datashow = dmshow._datas._as;
    var datanotshow = notdmshow._datas._as;
    var str = "";
    if (datashow.length > 0) {
        for (var i = 0; i < datashow.length; i++) {
            var data = datashow[i];
            str = str + data.a("name") + ":" + data.a("desc") + ":true" + ",";
        }
    }
    if (datanotshow.length > 0) {
        for (var j = 0; j < datanotshow.length; j++) {
            var data = datanotshow[j];
            str = str + data.a("name") + ":" + data.a("desc") + ":false" + ",";
        }
    }
    str = str.substr(0, str.length - 1);
    return str;
}

function getCellsStr(columns, cells) {
    var shotTablecells = [];
    var tagSecondHalf = [];
    var columnsArr = columns.split(',');
    if (columnsArr.length > 0) {
        for (var i = 0; i < columnsArr.length; i++) {
            var columnsHeader = columnsArr[i].split(':');
            if (columnsHeader[2] == "true") {
                tagSecondHalf.push(columnsHeader[0]);
            }
        }
    }

    var taginfos = cells.split(',');
    if (taginfos.length > 0) {
        for (var i = 0; i < taginfos.length; i++) {
            var tagFirstHalf = taginfos[i].split(':')[0];
            var isShow = taginfos[i].split(':')[2];
            if (typeof tagFirstHalf != undefined && isShow == "true") {
                var dicvalue = {};
                dicvalue["tagFirstHalf"] = tagFirstHalf;
                dicvalue["title"] = taginfos[i].split(':')[1];
                for (var j = 0; j < tagSecondHalf.length; j++) {
                    dicvalue[tagSecondHalf[j]] = getVarValue(tagFirstHalf + tagSecondHalf[j]);
                }
                shotTablecells.push(dicvalue);
            }
        }
    }
    return shotTablecells;
}
//快照表格数据初始化
function tableDataInit(node, columns, cells, tableDataModel, title, ischeck) {
    node.getColumnModel().clear();
    tableDataModel.clear();
    var shotTablecolumns = getColumnsInfo(columns, title);
    node.addColumns(shotTablecolumns);
    var cellsStr = getCellsStr(columns, cells);

    if (ischeck) {
        var tableView = node.getTableView();
        tableView.setCheckMode(true);
        var checkColumn = tableView.getCheckColumn();
        checkColumn.setWidth(100);
    }

    for (var i = 0; i < cellsStr.length; i++) {
        var data = new ht.Data();
        data.a(cellsStr[i]);
        data.setId(i);
        tableDataModel.add(data);
    }
}

function tableHisDataInit(node, columns, rows, tableDataModel, title) {
    node.getColumnModel().clear();
    tableDataModel.clear();
    var shotTablecolumns = getColumnsInfo(columns, rows, title, true);
    node.addColumns(shotTablecolumns);
}

//表格快照数据刷新
function tableRefresh(tableModel, columns, cells) {
    var cellsStr = getCellsStr(columns, cells);
    for (var i = 0; i < cellsStr.length; i++) {
        var data = tableModel.getDataById(i);
        data.a(cellsStr[i]);
    }
}

function getIndicatorArr(indicators) {
    var indicatorsAttr = [];
    var indicatorsArr = indicators.split(',');
    if (indicatorsArr.length >= 1) {
        for (var i = 0; i < indicatorsArr.length; i++) {
            var indicatorsFirst = indicatorsArr[i].split(':')[0];
            if (indicatorsFirst.length > 0) {
                indicatorsAttr.push(indicatorsFirst);
            }
        }
    }
    return indicatorsAttr;
}

function getHisData(indicators, tagfirstHalf, tableDataModel) {
    tableDataModel.clear();
    if (typeof (start) == "undefined") {
        return;
    }
    if (typeof (end) == "undefined") {
        return;
    }
    if (typeof (interval) == "undefined") {
        return;
    }

    if (start == "") start = moment(new Date()).format("YYYY-MM-DD H:mm:ss");
    if (end == "") end = moment(new Date(start)).add(30, 'seconds').format("YYYY-MM-DD H:mm:ss");

    var taginfos = getTagInfos(indicators, tagfirstHalf);
    var shotTableCmdStr = taginfos + '&beginTime=' + start + '&endTime=' + end + '&interval=' + interval + '&count=0';
    var indicatorArr = getIndicatorArr(indicators);
    getTableHisData(shotTableCmdStr, tableDataModel, indicatorArr);
}

function createTableHistory(tableNode, tableDataModel, indicators, tagfirstHalf, tableAttr) {
    tableDataModel.clear();
    var columns = getColumnsInfo(indicators, "time", true);
    var taginfos = getTagInfos(indicators, tagfirstHalf);

    setTableStyle(tableNode, tableAttr);
    columnModel = tableNode.getColumnModel();

    tableNode.setColumns(columns);
    var tags = taginfos.split(",");
    for (var i = 0; i < tags.length; i++) {
        var data = new ht.Data();
        data.a('time', "");
        data.a('rowId', (i + 1).toString());
        tableDataModel.add(data);
    }
    return tableNode;
}

function initFileSelector() {

}

function getIndicators(dmshow, dmhide, str) {
    dmshow.clear();
    dmhide.clear();
    var datas = str.split(',');
    if (datas.length > 0) {
        for (var i = 0; i < datas.length; i++) {
            var strArr = datas[i].split(":");
            if (strArr.length == 3) {
                var json = { "name": strArr[0], "desc": strArr[1] };
                var data = new ht.Data();
                data.a(json);

                if (strArr[2] == "true") {
                    dmshow.add(data);
                } else {
                    dmhide.add(data);
                }
            }
        }
    }
}
function listViewInit(listView) {
    listView.setRowHeight(30);
    listView.setRowLineVisible(true);
    listView.setLabelColor('white');
    listView.setLabelFont('黑体');
    listView.setRowLineColor('#006666');
    listView.setScrollBarColor('#27C5DB');
    listView.getIcon = function (data) {
        return 'productIcon';
    };
    listView.drawRowBackground = function (g, data, selected, x, y, width, height) {
        g.fillStyle = 'rgb(8,44,50)';
        g.beginPath();
        g.rect(x, y, width, height);
        g.fill();
    };
    listView.getLabel = function (data) {
        return data.a('desc');
    };
}

//指标设备面板选择框
/*function createSelectDialog(dmshow,dmnotshow,str,callback){
    var controlDialog = new ht.widget.Dialog();
    var borderPane = new ht.widget.BorderPane();

    var listViewShow = new ht.widget.ListView(dmshow);
    var listViewNotShow = new ht.widget.ListView(dmnotshow);
    listViewInit(listViewShow);
    listViewInit(listViewNotShow);

    listViewShow.onDataDoubleClicked=function(data){
        dmshow.remove(data);
        dmnotshow.add(data);
    };

    listViewNotShow.onDataDoubleClicked=function(data){
        dmnotshow.remove(data);
        dmshow.add(data);
    };

    var formPane = new ht.widget.FormPane();
    formPane.setHeight(40);
    formPane.addRow([
            {
                element: '可见列信息',
                color: 'white'
            },
            {
                button: {
                    label: '清除全部',
                    labelColor: 'white',
                    borderColor:'transparent',
                    background: '',
                    onClicked: function(){
                        var datas=dmshow._datas._as;
                        for(var i=0;i<datas.length;i++){
                            var data=new ht.Data();
                            var json={"name":datas[i].a("name"),"desc":datas[i].a("desc")};
                            data.a(json);
                            dmnotshow.add(data);
                        }
                        dmshow.clear();
                    }
                }
            },
            {
                element: '隐藏列信息',
                color: 'white'
            },
            {
                button: {
                    label: '添加全部',
                    labelColor: 'white',
                    borderColor:'transparent',
                    background: '',
                    onClicked: function() {
                        var datas=dmnotshow._datas._as;
                        for(var i=0;i<datas.length;i++){
                            var data=new ht.Data();
                            var json={"name":datas[i].a("name"),"desc":datas[i].a("desc")};
                            data.a(json);
                            dmshow.add(data);
                        }
                        dmnotshow.clear();
                    }
                }
            }
        ],
        [0.01, 0.01,0.01, 0.01],25);

    borderPane.setTopView(formPane);
    borderPane.setLeftView(listViewShow,250-10);
    borderPane.setCenterView(createDiv('#0c4D55'),'',20);
    borderPane.setRightView(listViewNotShow,250-10);

    borderPane.getView().style.backgroundColor="rgb(23,69,75)";

    controlDialog.setConfig({
        title: "选择列",
        titleIcon:'node_image',
        titleAlign: "left",
        titleBackground:'rgb(12,77,85)',
        background:'red',
        closable: true,	    //关闭是否可用
        draggable: true,
        maximizable: false, //设置不可以被最大化
        width:500,
        height:300,
        position:{x:400,y:100},//对话框的位置
        content:borderPane,
        buttons: [{
            label: "恢复默认",
            action: function(item, e) {
                dmshow.clear();
                dmnotshow.clear();
                getIndicators(dmshow,dmnotshow,str);
            }
        }, {
            label: "确定",
            action: function(item, e) {
                controlDialog.hide();
                callback();

            }
        },{
            label: "取消",
            action:function(item,e){
                getIndicators(dmshow,dmnotshow,str);
                controlDialog.hide();
            }
        }]
    });

    controlDialog.setModal(false);
    controlDialog.show();
    //创建显示按钮，并设置点击事件

    function createDiv(background, text,padding){
        var div = document.createElement('div');
        div.style.position = 'absolute';
        div.style.background = background;
        div.style.paddingLeft=padding;
        div.style.lineHeight = '40px';
        if(text) div.innerHTML = text;
        return div;
    }
}*/

function createSelectDialog(dm, controlDialog, callback, paneStyle, limit) {
    if (controlDialog.isShowing()) {
        controlDialog.hide();
    }
    limit = limit || 1000000;
    var borderPane = new ht.widget.BorderPane();
    var _datas = dm.getDatas()._as;
    var datas = [];
    (function () {
        var _data;
        for (var i = 0, len = _datas.length; i < len; i++) {
            _data = _datas[i];
            if (_data.a('isFrozenColumn')) continue;
            datas.push(_data);
        }
    })();
    var datalength = datas.length;
    var formPane = new ht.widget.FormPane();
    var selBtnsFormPane = new ht.widget.FormPane();
    var dialogWidth = 860, dialogHeight = 460, colCount = 4, maxLength = 0;
    var setValue = formPane.setValue,
        getValue = formPane.getValue;
    // formPane.setHeight(360);
    // borderPane.setBackground("red");
    borderPane.getView().style.background = paneStyle.paneBackColor;
    $count = $('<span class="top-count">已选指标（<strong>6</strong>）项</span>');
    $count.setValue = function (value) {
        $count.find('strong').text(value);
    }
    $count.getValue = function () {
        return $count.find('strong').text();
    }
    formPane.setValue = function (id, value) {
        if (id === 'indicatorCount') {
            $count.setValue(value);
        } else {
            setValue.call(formPane, id, value);
        }
    }
    formPane.getValue = function (id) {
        if (id === 'indicatorCount') {
            return $count.getValue();
        } else {
            return getValue.cal(formPane, id);
        }
    }

    formPane.addRow([
        {
            element: $('<span class="top-title">功能列表:</span>')[0]
        },
        {
            id: 'selectall',
            button: {
                label: '全选',
                labelColor: typeof (paneStyle) == "undefined" ? "black" : paneStyle.btnFontColor,
                borderColor: 'transparent',
                labelFont: 'bold 14px "苹方 粗体"',
                background: 'rgba(0,0,0,0)',
                icon: PAGEROOTDIR + 'script/image/noselected.png',
                selectBackground: 'rgba(0,0,0,0)',
                onClicked: function () {
                    selectAll(selBtnsFormPane, 'all');
                    formPane.getItemById('multiple').element.setIcon(PAGEROOTDIR + 'script/image/noselected.png');
                    formPane.getItemById('clear').element.setIcon(PAGEROOTDIR + 'script/image/noselected.png');
                    this.setIcon(PAGEROOTDIR + 'script/image/selected.png');
                }
            }
        },
        {
            id: 'multiple',
            button: {
                label: '反选',
                borderColor: 'transparent',
                labelFont: 'bold 14px "苹方 粗体"',
                labelColor: paneStyle.btnFontColor,
                background: 'rgba(0,0,0,0)',
                icon: PAGEROOTDIR + 'script/image/noselected.png',
                selectBackground: 'rgba(0,0,0,0)',
                onClicked: function () {
                    reverseSelect(selBtnsFormPane)
                    formPane.getItemById('selectall').element.setIcon(PAGEROOTDIR + 'script/image/noselected.png');
                    formPane.getItemById('clear').element.setIcon(PAGEROOTDIR + 'script/image/noselected.png');
                    this.setIcon(PAGEROOTDIR + 'script/image/selected.png');
                }
            }
        }, {
            id: 'clear',
            button: {
                label: '清除',
                labelColor: paneStyle.btnFontColor,
                borderColor: 'transparent',
                labelFont: 'bold 14px "苹方 粗体"',
                background: 'rgba(0,0,0,0)',
                icon: PAGEROOTDIR + 'script/image/noselected.png',
                selectBackground: 'rgba(0,0,0,0)',
                onClicked: function () {
                    clearSelect(selBtnsFormPane);
                    formPane.getItemById('selectall').element.setIcon(PAGEROOTDIR + 'script/image/noselected.png');
                    formPane.getItemById('multiple').element.setIcon(PAGEROOTDIR + 'script/image/noselected.png');
                    this.setIcon(PAGEROOTDIR + 'script/image/selected.png');
                }
            }
        },null,
        {
            element: $count[0]
        }
    ],[0.1, 0.1, 0.1, 0.1, 0.4, 0.2], 20, { index: 1 });
   
    for (var i = 0, len = datas.length; i < len; i++) {
        var l = datas[i].a('displayName') && GD.getStrLength(datas[i].a('displayName'));
        maxLength = l > maxLength ? l : maxLength;
    }
    var initCount = 0, colCount = Math.floor(dialogWidth / (maxLength * 5 + 50));
    var rowscount = Math.ceil(datas.length / colCount);
    for (var m = 0; m < rowscount; m++) {
        var buttonList = [];
        var buttonWidthPercents = [];

        for (var j = m * colCount; j < (m + 1) * colCount; j++) {
            if (j < datas.length) {
                buttonList.push({ id: datas[j].a("name"), element: createButton(datas[j].a("displayName"), datas[j].a("visible"), formPane, paneStyle, limit) });
                if (datas[j].a("visible")) {
                    initCount = initCount + 1;
                }
                buttonWidthPercents.push(0.1);
            } else {
                buttonList.push(null);
                buttonWidthPercents.push(0.1);
            }
        }
        selBtnsFormPane.addRow(buttonList, buttonWidthPercents, 30, { index: m + 2 });
        $count.setValue(initCount);
        
    }
    borderPane.setTopView(formPane, 50);
    borderPane.setCenterView(selBtnsFormPane);
    borderPane.setBottomView($('<div"></div>')[0], 9)
    controlDialog.setConfig({
        title: "设置名称",
        titleBackground: paneStyle.paneTitleBackColor,
        titleIcon: '',
        titleColor: paneStyle.paneTitleFontColor,
        //background:'red',
        closable: true,	    //关闭是否可用
        draggable: true,
        maximizable: false, //设置不可以被最大化
        width: dialogWidth,
        height: dialogHeight,
        // position: { x: 200, y: 100 },//对话框的位置
        content: borderPane,
        buttonsAlign: "left",
        buttons: [
            {
                label: "确认",
                className: 'dialog-confirm',
                action: function (item, e) {
                    for (var i = 0; i < datalength; i++) {
                        var nameId = datas[i].a("name");
                        if (selBtnsFormPane.getItemById(nameId)["element"].isSelected()) {
                            datas[i].a("visible", true);
                        } else {
                            datas[i].a("visible", false);
                        }
                    }
                    var rows = selBtnsFormPane._rows,
                        items, element, row, item;
                    for (var i = 0, len = rows.length; i < len; i++) {
                        row = rows[i];
                        items = row.items || [];
                        for (var j = 0, l = items.length; j < l; j++) {

                        }
                    }
                    controlDialog.hide();
                    callback();
                }
            }, {
                label: "取消",
                width: 50,
                height: 30,
                className: 'dialog-cancel',
                action: function (item, e) {
                    controlDialog.hide();
                }
            }]
    });
    
    function setStyle () {
        var $topview = $(formPane.getView()),
            $selBtnsPaneView = $(selBtnsFormPane.getView()),
            $dialogView = $(controlDialog.getView()),
            $borderPaneView = $(borderPane.getView());

        $dialogView.find('.dialog-container').css({
            padding: 0,
            border: '1px solid rgb(31,90,150)',
            borderRadius: 4,
            padding: '5px 20px'           
        }).find('.dialog-content').css({
            overflow: 'visible'
        })
        $topview.css({
            border: '1px solid rgb(31,90,150)',
            boxShadow: '0 2px 6px rgb(1,8,24)',
            borderRadius: 4,
            overflow: 'visible',
            backgroundColor: 'rgb(7,45,118)',
            minWidth: 860,
            marginLeft: -22,
            marginTop: 10,
            maxHeight: 40
        }).addClass('pane-topview').find('div').css({
            cursor: 'pointer'
        }).end().parent().css({
            overflow: 'visible'
        }).find('.top-title').css({
            fontFamily: '苹方 粗体',
            fontSize: 14,
            color: 'rgb(18,203,249)',
            fontWeight: 600,
            lineHeight: '25px',
            textAlign: 'center'
        })
        $count.css({
            fontFamily: '苹方 粗体',
            fontSize: 14,
            color: 'rgb(18,203,249)',
            fontWeight: 600,
            lineHeight: '25px',
            paddingLeft: 30
        })
        $borderPaneView.css({
            // backgroundColor: 'rgb(5,32,87)'
        })
        $selBtnsPaneView.css({
            backgroundColor: 'rgb(5,32,87)',
            boxShadow: '0 0 8px rgb(4,4,4) inset',
            borderRadius: 2,
            height: 310
        }).addClass('pane-container');
        $dialogView.find('.dialog-container-buttons').css({
            backgroundColor: paneStyle.paneBackColor,
            textAlign: 'right'
        }).find('.dialog-button').css({
            backgroundColor: paneStyle.btnBackColor,
            width: 100,
            height: 30,
            marginRight: 20,
            marginBottom: 2,
            position: 'relative',
            cursor: 'pointer',
            color: 'rgb(255,255,255)',
            borderRadius: 2,
            boxShadow: '1px 1px 4px #000',
            fontFamily: '苹方 粗体',
            fontWeight: 600,
            fontSize: 14,
        }).hover(function () {
            $(this).css({
                color: 'rgb(255,255,255)',
                boxShadow: '0 0 8px rgb(66,160,194)'
            })
        }, function () {
            $(this).css({
                color: 'rgb(255,255,255)',
                boxShadow: '1px 1px 4px #000',
            })
        }).end().find('.dialog-confirm').css({
            
        }).prepend('<span style="position: absolute; line-height: 30px; width: 100px; text-align: center;">确认</span>').end().find('.dialog-cancel').css({

        }).prepend('<span style="position: absolute; line-height: 30px; width: 100px; text-align: center;">取消</span>').end().find('canvas').css({
            visibility: 'hidden'
        })
    }
    setStyle();
    controlDialog.setModal(true);
    $(controlDialog.getView()).find('.dialog-overlay').css({
        backgroundColor: 'rgba(20,20,20,0.6)'
    })
    controlDialog.show();
    function selectAll(formPane, opt) {
        var rows = formPane._rows || [];
        var row, items, item, element, button, isSelected;

        for (var i = 0, len = rows.length; i < len; i++) {
            row = rows[i] || {};
            items = row.items || [];
            for (var j = 0, l = items.length; j < l; j++) {
                item = items[j];
                if (!item) continue;
                element = item.element || {};
                switch(opt) {
                    case 'all':
                        if (!element.isSelected()) {
                            element.setSelected(true);
                            element.onClicked && element.onClicked();
                        }
                        break;
                    case 'clear':
                        if (element.isSelected()) {
                            element.setSelected(false);
                            element.onClicked && element.onClicked();
                        }
                        break;
                    case 'reverse':
                        isSelected = !element.isSelected();
                        element.setSelected(isSelected);
                        element.onClicked && element.onClicked();
                        break;
                }
            }
        }
    }
    function reverseSelect (formPane) {
        selectAll(formPane, 'reverse');
    }
    function clearSelect(formPane) {
        selectAll(formPane, 'clear');
    }
}

function createHistorySelectDialog(deviceDM, indicatorDM, tagDM, controlDialog, selectedLimit, callback, hideExportButton, paneStyleParams) {
    if (controlDialog.isShowing()) {
        controlDialog.hide();
    }
    paneStyleParams = paneStyleParams || {}
    var paneStyle = {
        paneBackColor: 'rgb(7,42,114)',
        paneTitleBackColor: 'rgb(7,42,114)',
        paneTitleFontColor: 'rgb(195,208,241)',
        paneTitleBtnFontColor: 'rgb(156,163,172)',
        paneTitleBtnCheckedFontColor: 'rgb(7,164,234)',
        btnBackColor: 'rgb(7,42,114)',
        btnFontColor: 'rgb(255,255,255)',
        btnBorderColor: 'rgba(0,0,0,0)',
        btnCheckedFontColor: 'rgb(255,255,255)',
        btnCheckedBackColor: 'rgb(18,172,221)',
        tagBtnBackColor: 'rgba(0,0,0,0)',
        tagBtnBorderColor: 'rgba(0,0,0,0)',
        tagBtnFontColor: 'rgb(168,193,219)',
        paneBorderColor: 'rgb(4,94,137)',
        paneTopBarBackColor: 'rgb(7,42,114)',
        paneTopBarBorderColor: 'rgb(4,94,137)',
        paneShadowColor: 'rgb(1,13,33)',
        formPaneBackColor: 'rgb(4,33,89)',
        bottomButtonColor: 'rgb(255,255,255)',
        bottomButtonHoverColor: 'white',
        bottomButtonBackColor: 'rgb(7,41,107)',
        bottomButtonHoverShadowColor: 'rgb(36,128,172)',
        scrollBarColor: 'rgb(18,75,147)'
    }
    // $.extend(paneStyle, paneStyleParams);
    var paneBackColor = paneStyle.paneBackColor;
    var btnBackColor = paneStyle.btnBackColor;
    var btnFontColor = paneStyle.btnFontColor;
    
    selectedLimit = selectedLimit <= 0 ? 20 : selectedLimit;
    var borderPane = new ht.widget.BorderPane();
    borderPane.getView().style.background = paneBackColor;
    var datas = deviceDM.getDatas()._as;
    var indicatorDatas = indicatorDM.getDatas()._as;

    var deviceArr = [];
    var indicatorArr = [];
    var tagArr = [];
    var buttonMap = {};
    function DMToArr(DM, arr) {
        DM.each(function (data) {
            if (data.a('name') != 'time' && data.a('name') != 'device') {
                var d = {};
                d.name = data.a('name');
                d.displayName = data.a('displayName');
                d.visible = data.a('visible');
                d.Low = data.a('Low');
                d.High = data.a('High');
                d.width = data.a('width');
                d.color = data.a('color');
                data.a('position') && (d.position = data.a('position'));
                arr.push(d);
            }
        });
    }
    DMToArr(deviceDM, deviceArr);
    DMToArr(indicatorDM, indicatorArr);
    DMToArr(tagDM, tagArr);

    var datalength = datas.length;
    var formPane = new ht.widget.FormPane();

    var leftPane = new ht.widget.FormPane();
    var rightPane = new ht.widget.FormPane();
    var bottomPane = new ht.widget.FormPane();
    var innerBorderPane = new ht.widget.BorderPane();
    var innerTopBorderPane = new ht.widget.BorderPane();
    // var innerTopFormPane = new ht.widget.FormPane();

    var initCount = 0;
    var rowscount = Math.ceil(datas.length / 4);

    leftPane.setAutoHideScrollBar(false);
    rightPane.setAutoHideScrollBar(false);
    bottomPane.setAutoHideScrollBar(false);
    leftPane.setScrollBarColor(paneStyle.scrollBarColor);
    rightPane.setScrollBarColor(paneStyle.scrollBarColor);
    bottomPane.setScrollBarColor(paneStyle.scrollBarColor);

    var buttonIconMap = {
        'tagButton': 'sub.png',
        'deviceButton': 'DuiHao.png',
        'indicatorButton': 'plus.png',
    }

    function addButtonsToForm(form, datas, columnsCount, buttonType, cb) {
        var maxLength = 0, formWidth = $(form.getView()).width(), l;
        for (var i = 0, len = datas.length; i < len; i++) {
            l = datas[i].displayName && GD.getStrLength(datas[i].displayName);
            maxLength = l > maxLength ? l : maxLength;
        }
        columnsCount = Math.floor(formWidth / (maxLength * 5 + 50));
        var rowsCount = Math.ceil(datas.length / columnsCount);
        form.clear();
        for (var i = 0; i < rowsCount; i++) {
            var buttonList = [];
            var buttonWidthList = [],
                btn;
            for (var j = i * columnsCount; j < ((i + 1) * columnsCount); j++) {
                if (datas[j]) {
                    datas[j].buttonType = buttonType;
                    btn = createHistoryButton(datas[j], buttonType, cb);
                    buttonList.push(btn);
                    buttonWidthList.push(0.1);
                } else {
                    buttonList.push(null);
                    buttonWidthList.push(0.1);
                }
            }
            form.addRow(buttonList, buttonWidthList, 30);
        }
    }

    function mergeToTagArr(obj, iArr, tArr) {
        tArr = tArr || tagArr;
        var tempArr = [];
        if (!obj) {
            return [];
        }
        for (var j = 0, leng = iArr.length; j < leng; j++) {
            var ia = iArr[j];
            if (!ia.isSelected) {
                continue;
            }
            var t = {};
            t.name = obj.type === 'device' ? obj.name + ia.name : ia.name + obj.name;
            t.isSelected = true;
            t.displayName = obj.type === 'device' ? obj.displayName + ' ' + ia.displayName : ia.displayName + ' ' + obj.displayName;
            t.visible = true;
            t.deviceName = obj.type === 'device' ? obj.name : ia.name;
            t.indicatorName = obj.type === 'device' ? ia.name : obj.name;
            t.Low = obj.type === 'device' ? ia.Low : obj.Low;
            t.High = obj.type === 'device' ? ia.High : obj.High;
            t.width = obj.type === 'device' ? ia.width : obj.width;
            t.color = ia.color || obj.color;
            t.position = ia.position || obj.position;
            ia.inArr = ia.inArr || [];
            if (obj.isSelected) {
                ia.inArr.push(obj);
                tArr.push(t);
            } else {
                deleteItemFromArray(ia.inArr, obj);
                deleteItemFromArray(tArr, t);
            }
        }
        deleteRepetition(tArr);
        $rightPaneTitle.find('strong').text(tArr.length);
    }

    function tagButtonClicked() {
        var isSelected = this.isSelected();
        var label = $.trim(this.getLabel());
        var tagObj, indicatorObj;
        for (var i = 0, len = tagArr.length; i < len; i++) {
            if (tagArr[i].displayName === label) {
                tagObj = tagArr[i];
                tagArr.splice(i, 1);
                break;
            }
        }
        for (var j = 0, leng = indicatorArr.length; j < leng; j++) {
            if (indicatorArr[j].name === tagObj.indicatorName) {
                indicatorArr[j].isSelected = false;
                indicatorObj = indicatorArr[j];
                break;
            }
        }
        for (var k = 0, lengt = deviceArr.length; k < lengt; k++) {
            if (deviceArr[k].name === tagObj.deviceName) {
                if (deviceArr[k].inArr && deviceArr[k].inArr.length > 0) {
                    deleteItemFromArray(deviceArr[k].inArr, indicatorObj);
                }
            }
        }
        refreshButtonFrom(leftPane, deviceArr);
        refreshButtonFrom(rightPane, indicatorArr);
        addButtonsToForm(bottomPane, tagArr, 8, 'tagButton', tagButtonClicked);
        $rightPaneTitle.find('strong').text(tagArr.length);
    }

    function createHistoryButton(data, buttonType, buttonOnClickedCB) {
        var button = new ht.widget.Button(),
            $buttonView = $(button.getView());
        var lable = data.displayName,
            show = data.visible,
            id = data.name;
        button.setLabel(lable);
        button.setTogglable(true);
        button.setWidth(100);
        button.setHeight(40);
        $buttonView.addClass('history-button');
        $buttonView.prepend('<div class="button-icon"></div>')
        button.__id = id;
        var labelColor,
            backColor,
            checkedBackColor,
            broderColor,
            icon;

        switch (buttonType) {
            case 'tagButton':
                backColor = paneStyle.tagBtnBackColor;
                checkedBackColor = paneStyle.tagBtnBackColor;
                broderColor = paneStyle.tagBtnBorderColor;
                // icon = buttonIconMap['tagButton'];
                icon = null;
                button.setSelected(true);
                button.setLabelSelectColor(paneStyle.tagBtnFontColor);
                button.setClickable(false);
                break;
            case 'deviceButton':
                backColor = paneStyle.btnBackColor;
                checkedBackColor = paneStyle.btnCheckedBackColor;
                broderColor = paneStyle.btnBorderColor;
                // icon = buttonIconMap['deviceButton'];
                icon = null;
                break;
            case 'indicatorButton':
                backColor = paneStyle.btnBackColor;
                checkedBackColor = paneStyle.btnCheckedBackColor;
                broderColor = paneStyle.btnBorderColor;
                icon = buttonIconMap['indicatorButton'];
                break;
        }

        if (show) {
            button.setSelected(true);
            button.setSelectBackground(checkedBackColor);
            button.setLabelSelectColor(paneStyle.btnCheckedFontColor);
            button.setBorderColor(broderColor);
            if (icon) {
                button.setIcon(imagePath + icon);
                button.setLabel("  " + lable);
            } else {
                button.setIcon(null);
                button.setLabel(lable);
            }
        } else {
            button.setSelected(false);
            button.setIcon(null);
            button.setLabel(lable);
            button.setBackground(backColor);
            button.setLabelColor(paneStyle.btnFontColor);
            button.setBorderColor(broderColor);
        }
        button.onClicked = function (e) {
            buttonOnClickedCB.call(this, e);
        };
        if (buttonType === 'tagButton') {
            button.setLabel(lable + "  ");
            $(button.getView()).find('.button-icon').off('click').on('click', function (e) {
                buttonOnClickedCB.call(button, e);
            })
        }
        buttonMap[id] = button;
        return button;
    }

    function deleteRepetition(arr) {
        if (!arr) {
            return;
        }
        var temp = {}, a;
        var result = [];
        for (var i = 0, len = arr.length; i < len; i++) {
            a = arr[i];
            if (temp[a.displayName]) {

            } else {
                temp[a.displayName] = true;
                result.push(a);
            }
        }
        arr.length = 0;
        for (i = 0, len = result.length; i < len; i++) {
            arr[i] = result[i];
        }
        return result;
    }

    function deleteItemFromArray(arr, item) {
        var tempArr = [], a;
        for (var i = 0, len = arr.length; i < len; i++) {
            a = arr[i];
            if ($.trim(a.displayName) != $.trim(item.displayName)) {
                tempArr.push(a);
            }
        }
        arr.length = 0;
        for (i = 0, len = tempArr.length; i < len; i++) {
            arr[i] = tempArr[i];
        }
    }

    function refreshButtonFrom(pane, dataArr) {
        var isSelected, icon, btn, btnType;
        for (var i = 0, len = dataArr.length; i < len; i++) {
            btn = buttonMap[(dataArr[i].name)];
            if (!btn) continue;
            btnType = dataArr[i].buttonType;
            if (dataArr[i].isSelected) {
                isSelected = true;
                icon = imagePath + buttonIconMap[btnType];
                if (btnType === 'deviceButton') {
                    icon = null;
                }
            } else {
                isSelected = false;
                icon = null;
            }
            btn.setSelected(isSelected);
            btn.setIcon(icon);
        }
    }

    function clearButtonForm(pane, dataArr) {
        var btn;
        for (var i = 0, len = dataArr.length; i < len; i++) {
            btn = buttonMap[(dataArr[i].name)];
            if (btn) {
                btn.setSelected(false);
                btn.setIcon(null);
            }
        }
    }

    function exportTagsToCSV(e) {
        if (tagArr.length <= 0) {
            return alert('请先选择测点指标！');
        }
        var result = '';
        var tempArr, tag, titleArr = [];
        for (var i = 0, len = tagArr.length; i < len; i++) {
            tag = tagArr[i];
            tempArr = [];

            for (var key in tag) {
                if (tag.hasOwnProperty(key)) {
                    tempArr.push(tag[key]);
                    if (i === 0) {
                        titleArr.push(key);
                    }
                }
            }
            result += tempArr.join(',') + '\r\n';
        }
        result = '\uFEFF' + titleArr.join(',') + '\r\n' + result;
        // var encodeResult = new TextEncoder('windows-1252').encode(result);
        var blob = new Blob([result], { type: 'text/csv;charset=UTF-8' });//
        saveAs(blob, 'data' + Date.now() + '.csv');
    }

    function importTagsFromCSV(e) {
        var $fileInput = $('<input type="file" accept=".csv" id="fileInput">');
        $(window.body).append($fileInput);
        $fileInput.trigger('click');
        $fileInput.change(function (e) {
            var files = e.target.files;
            for (var i = 0, len = files.length; i < len; i++) {
                var file = files[i];
                if (!(file && file.type.match('application/vnd.ms-excel'))) {
                    alert('不支持的文件格式！');
                    continue;
                }
                var reader = new FileReader();
                reader.onload = function (evt) {
                    // var resultStr = e.target && e.target.result;

                    var data = evt.target.result;
                    var encoding = checkEncoding(data);
                    //转换成二维数组，需要引入Papaparse.js
                    Papa.parse(file, {
                        encoding: encoding,
                        complete: function (results) {        // UTF8 \r\n与\n混用时有可能会出问题
                            var res = results.data;
                            if (res[res.length - 1] == "") {    //去除最后的空行
                                res.pop();
                            }
                            addTagToTagArr(res);
                        }
                    });

                };
                reader.readAsDataURL(file);
            }
        });
    }

    function checkEncoding(base64Str) {
        //这种方式得到的是一种二进制串
        var str = atob(base64Str.split(";base64,")[1]);
        //要用二进制格式
        var encoding = jschardet.detect(str);
        encoding = encoding.encoding;
        if (encoding == "windows-1252") {    //有时会识别错误（如UTF8的中文二字）
            encoding = "ANSI";
        }
        return encoding;
    }

    function addTagToTagArr(resultArr) {
        try {
            tagArr = [];
            var titleArr = resultArr[0];
            for (var i = 1, len = resultArr.length; i < len; i++) {
                var tagObj = {};
                if (!resultArr[i]) {
                    continue;
                }
                var tempArr = resultArr[i];
                for (var j = 0, leng = tempArr.length; j < leng; j++) {
                    var temp = tempArr[j];
                    if (temp.toLowerCase() === 'true') {
                        temp = true;
                    } else if (temp.toLowerCase() === 'false') {
                        temp = false;
                    }
                    tagObj[$.trim(titleArr[j])] = temp;
                }
                if (tagObj.isSelected)
                    tagArr.push(tagObj);
            }
            deleteRepetition(tagArr);
            addButtonsToForm(bottomPane, tagArr, 8, 'tagButton', tagButtonClicked);
        } catch (error) {
            alert('导入的文件格式错误，请重新编辑后导入！');
            console.log(error);
        }
    }

    function confirmAndSearch() {
        tagDM.clear();
        for (var i = 0, len = tagArr.length; i < len; i++) {
            var dt = new ht.Data();
            var ta = tagArr[i];
            dt.a('displayName', ta.displayName);
            dt.a('name', ta.name);
            dt.a('visible', ta.visible);
            dt.a('Low', ta.Low);
            dt.a('High', ta.High);
            dt.a('width', ta.width);
            dt.a('position', ta.position);
            dt.a('color', ta.color);
            dt.setName(ta.name);
            dt.setDisplayName(ta.displayName);
            dt.setTag(ta.name);
            tagDM.add(dt);
        }
        controlDialog.hide();
        // var device, indicator, name, data;
        // for (var i = 0, len = deviceArr.length; i < len; i++) {
        //     device = deviceArr[i];
        //     if (device) {
        //         name = device.name;
        //         data = deviceDM.getDataByTag(name);
        //         data.a('visible', !!device.isSelected);
        //     }
        // }
        // for (var j = 0, len = indicatorArr.length; j < len; j++) {
        //     indicator = indicatorArr[j];
        //     if (indicator) {
        //         name = indicator.name;
        //         data = indicatorDM.getDataByTag(name);
        //         data.a('visible', !!indicator.isSelected);
        //     }
        // }
        callback('search');
    }

    function confirmAndExport() {
        tagDM.clear();
        for (var i = 0, len = tagArr.length; i < len; i++) {
            var dt = new ht.Data();
            var ta = tagArr[i];
            dt.a('displayName', ta.displayName);
            dt.a('name', ta.name);
            dt.a('visible', ta.visible);
            dt.setName(ta.name);
            dt.setDisplayName(ta.displayName);
            dt.setTag(ta.name);
            tagDM.add(dt);
        }
        controlDialog.hide();
        callback('export');
    }

    function cancel () {
        controlDialog.hide();
    }

    function addButtonsToDialogBottom(dialog) {
        var $bottomContainer = $(dialog.getView()).find('.dialog-container-buttons'),
            $searchBtn = $('<div data-role="confirmandsearch" class="pull-left pane-bottom-btn-right"><a class="btn btn-defuault">确认并查询</a></div>'),
            $exportBtn = $('<div data-role="confirmandexport" class="pull-left pane-bottom-btn-right"><a class="btn btn-defuault">确认并导出</a></div>'),
            $cancelBtn = $('<div data-role="cancel" class="pull-left pane-bottom-btn-right"><a class="btn btn-defuault">取消</a></div>'),
            $uploadBtn = $('<div data-role="upload" class="pull-left cursor-pointer pane-bottom-btn-left"><a>上传</a></div>'),
            $downloadBtn = $('<div data-role="download" class="pull-left cursor-pointer pane-bottom-btn-left"><a>下载</a></div>'),
            $clearBtn = $('<div data-role="clearall" class="pull-left cursor-pointer pane-bottom-btn-left"><a>清空</a></div>'),
            $rightContainer = $('<div class="pull-right pane-bottom-container-right"></div>'),
            $leftContainer = $('<div class="pull-left pane-bottom-container-left"></div>');

        $bottomContainer.find('.dialog-button').remove();
        $rightContainer.append($searchBtn).append($exportBtn).append($cancelBtn);
        $leftContainer.append($uploadBtn).append($downloadBtn).append($clearBtn);
        $bottomContainer.append($rightContainer).append($leftContainer);

        if (hideExportButton) {
            $searchBtn.find('a.btn').text('确认');
            $exportBtn.css('display', 'none');
            $uploadBtn.css('display', 'none');
            $downloadBtn.css('display', 'none');
        }

        $bottomContainer.find('.pane-bottom-btn-right').css({
            backgroundColor: paneStyle.bottomButtonBackColor,
        }).hover(function () {
            $(this).css({
                
            }).find('a').css({
                color: paneStyle.bottomButtonHoverColor
            })
        }, function() {
            $(this).css({

            }).find('a').css({
                color: paneStyle.bottomButtonColor
            })
        }).find('a').css({
            color: paneStyle.bottomButtonColor,
        });
        $bottomContainer.find('.pane-bottom-btn-left').css({

        }).hover(function() {
            $(this).css({

            }).find('a').css({
                color: paneStyle.bottomButtonHoverColor
            })
        }, function () {
            $(this).css({

            }).find('a').css({
                color: paneStyle.bottomButtonColor
            })
        }).find('a').css({
            color: paneStyle.bottomButtonColor,
        });
        $bottomContainer.find('div div.pull-left').off('click').on('click', function (e) {
            var $this = $(this),
                role = $this.data('role');
            switch (role) {
                case 'confirmandsearch':
                    confirmAndSearch();
                    break;
                case 'confirmandexport':
                    confirmAndExport();
                    break;
                case 'cancel':
                    cancel(e);
                    break;
                case 'upload':
                    importTagsFromCSV(e);
                    break;
                case 'download':
                    exportTagsToCSV(e);
                    break;
                case 'clearall':
                    clearAllBtn(bottomPane);
                    break;
            }
        });
    }

    function selectAllBtn (formpane, opt) {
        var rows = formpane._rows, row, items, item, element, selected;
        for (var i = 0, len = rows.length; i < len; i++) {
            row = rows[i];
            if (row.items) {
                items = row.items;
                for (var j = 0, l = items.length; j < l; j++) {
                    item = items[j]; 
                    element = item && item.element;
                    if (element && typeof element.onClicked === 'function') {
                        // element._selected = !selected;
                        // element.onClicked();
                        switch(opt) {
                            case 'all':
                                if (element._selected === false) {
                                    element._selected = true;
                                    element.onClicked();
                                }
                                break;
                            case 'reverse':
                                element._selected = !element._selected;
                                element.onClicked();
                                break;
                            case 'clear':
                                if (element._selected === true) {
                                    element._selected = false;
                                    element.onClicked();
                                }
                                break;
                        }
                    }
                } 
            }
        }
    }
    function clearAllBtn (formpane) {
        selectAllBtn(formpane, 'clear');
    }
    function multipleSelectBtn (formpane) {

    }
    function reverseSelectBtn(formpane) {
        selectAllBtn(formpane, 'reverse');
    }
    var indicatorRowCount = Math.ceil(indicatorDatas.length / 4);

    bottomPane.getView().className = "bottom-pane";

    leftPane.setWidth(400);
    rightPane.setWidth(400);
    bottomPane.setWidth(840);

    var $paneTitleContainer = $('<div class="pane-title-container"></div>'),
        $leftPaneTitle = $('<div class="pane-title pane-title-left" ></div>'),
        $rightPaneTitle = $('<div class="pane-title pane-title-right noselect"><span class="pull-left">功能列表：</span><ul class="pull-left"><li data-role="selectall"><a>全选</a></li><li data-role="reverseselect"><a>反选</a></li><li data-role="clearall"><a>清除</a></li></ul><div class="pull-right">已选指标（ <strong>0</strong> ）项</div></div>');
    
    $leftPaneTitle.css({
        'box-shadow': '0 2px 10px ' + paneStyle.paneShadowColor
    })
    $rightPaneTitle.css({
        'box-shadow': '0 2px 10px ' + paneStyle.paneShadowColor
    }).find('li').off('click').on('click', function () {
        var $this = $(this),
            role = $this.data('role');
        $rightPaneTitle.find('li').removeClass('active').find('a').css({color: paneStyle.paneTitleBtnFontColor});
        $this.addClass('active').find('a').css({
            color: paneStyle.paneTitleBtnCheckedFontColor
        });
        switch(role) {
            case 'selectall':
                selectAllBtn(rightPane, 'all');
                break;
            case 'reverseselect':
                reverseSelectBtn(rightPane);
                break;
            case 'clearall':
                clearAllBtn(rightPane);
                break;
        }
    }).find('a').css({
        color: paneStyle.paneTitleBtnFontColor
    })
    $rightPaneTitle.find('li.active a').css({color: paneStyle.paneTitleBtnCheckedFontColor});

    function setStyle() {
        $(leftPane.getView()).css({
            backgroundColor: paneStyle.formPaneBackColor,
            'box-shadow': '2px 2px 5px '+ paneStyle.paneShadowColor +' inset'
        }).addClass('pane-left');
        $(rightPane.getView()).css({
            backgroundColor: paneStyle.formPaneBackColor,
            'box-shadow': '2px 2px 5px '+ paneStyle.paneShadowColor +' inset'
        }).addClass('pane-right');
        $(bottomPane.getView()).css({
            backgroundColor: paneStyle.formPaneBackColor,
            'box-shadow': '2px 2px 5px '+ paneStyle.paneShadowColor +' inset'
        }).addClass('pane-bottom');
        $(controlDialog.getView()).find('.dialog-container').css({
            borderWidth: '1px',
            borderStyle: 'solid',
            borderColor: paneStyle.paneBorderColor,
            borderRadius: '4px',
            zIndex: 99,
        })
    }

    $paneTitleContainer.append($leftPaneTitle);
    $paneTitleContainer.append($rightPaneTitle);

    innerTopBorderPane.setTopView($paneTitleContainer[0], 35);
    innerTopBorderPane.setLeftView(leftPane, 430);
    innerTopBorderPane.setCenterView(rightPane);

    // innerBorderPane.setTopView(innerTopFormPane, 35);
    innerBorderPane.setCenterView(bottomPane);

    borderPane.setCenterView(innerTopBorderPane);
    borderPane.setBottomView(innerBorderPane, 280);

    var dialogButtons = [
        // {
        //     label: "确认并查询",
        //     className: 'dialog-button-confirm dialog-button-confirm-and-search',
        //     action: function (item, e) {
               
        //     }
        // },
        // {
        //     label: "确认并导出",
        //     className: 'dialog-button-confirm dialog-button-confirm-and-export',
        //     action: function (item, e) {
                
        //     }
        // },
        {
            label: "取消",
            className: 'dialog-button-cancel',
            action: function (item, e) {
                
            }
        }
    ];
    
    controlDialog.setConfig({
        title: "设置名称",
        titleBackground: paneStyle.paneTitleBackColor,
        titleIcon: '',
        titleColor: paneStyle.paneTitleFontColor,
        //background:'red',
        closable: true,	    //关闭是否可用
        draggable: true,
        maximizable: false, //设置不可以被最大化
        width: 860,
        height: 600,
        position: { x: ($(window).innerWidth() - 860) / 2, y: ($(window).innerHeight() - 600) / 2 },//对话框的位置
        content: borderPane,
        buttonsAlign: "left",
        buttons: dialogButtons
    });

    controlDialog.setModal(true);
    $(controlDialog.getView()).find('.dialog-overlay').css({
        backgroundColor: 'rgba(20,20,20,0.6)'
    })
    addButtonsToForm(leftPane, deviceArr, 4, 'deviceButton', function () {
        var label = $.trim(this.getLabel());
        var isSelected = this.isSelected();
        if (isSelected) {
            this.setSelectBackground(paneStyle.btnCheckedBackColor);
            this.setLabelSelectColor(paneStyle.btnCheckedFontColor);
            // this.setIcon(imagePath + "DuiHao.png");
            this.setIcon(null);
            this.setLabel(label);
        } else {
            this.setBackground(paneStyle.btnBackColor);
            this.setIcon(null);
            this.setLabel(label);
            this.setLabelColor(paneStyle.btnFontColor);
        }
        var deviceObj;
        for (var i = 0, len = deviceArr.length; i < len; i++) {
            if (deviceArr[i].displayName === label) {
                deviceArr[i].isSelected = isSelected;
                deviceObj = deviceArr[i];
            } else {
                deviceArr[i].isSelected = false;
            }
        }
        for (var j = 0, leng = indicatorArr.length; j < leng; j++) {
            indicatorArr[j].isSelected = false;
            if (deviceObj.inArr) {
                for (var k = 0, lengt = deviceObj.inArr.length; k < lengt; k++) {
                    if (deviceObj.inArr[k].name === indicatorArr[j].name) {
                        indicatorArr[j].isSelected = true;
                    }
                }
            } else {
                indicatorArr[j].isSelected = false;
            }
        }
        deviceObj.type = 'device';
        clearButtonForm(rightPane, indicatorArr);
        refreshButtonFrom(leftPane, deviceArr);
        if (!isSelected) {
            deviceObj.inArr && (deviceObj.inArr.length = 0);
            mergeToTagArr(deviceObj, indicatorArr, tagArr);
            addButtonsToForm(bottomPane, tagArr, 8, 'tagButton', tagButtonClicked);
        } else {
            refreshButtonFrom(rightPane, indicatorArr);
        }
    });
    addButtonsToForm(rightPane, indicatorArr, 4, 'indicatorButton', function () {
        var label = $.trim(this.getLabel());
        var isSelected = this.isSelected();
        var self = this;
        // 设置选择个数限制
        if (tagArr.length >= selectedLimit && isSelected) {
            dialogTip('已选择的指标超过' + selectedLimit + '个了，最多选择' + selectedLimit + '个！');
            this.setSelected(false);
            return;
        }
        if (isSelected) {
            this.setSelectBackground(paneStyle.btnCheckedBackColor);
            this.setLabelSelectColor(paneStyle.btnCheckedFontColor);
            this.setIcon(imagePath + "plus.png");
            this.setLabel("  " + label);
        } else {
            this.setBackground(paneStyle.btnBackColor);
            this.setLabelColor(paneStyle.btnFontColor);
            this.setIcon(null);
            this.setLabel(label);
        }
        var indicatorObj = {};
        for (var i = 0, len = indicatorArr.length; i < len; i++) {
            if (indicatorArr[i].displayName === label) {
                indicatorArr[i].isSelected = isSelected;
                indicatorObj = indicatorArr[i];
                break;
            }
        }
        indicatorObj.type = 'indicator';

        mergeToTagArr(indicatorObj, deviceArr, tagArr);
        addButtonsToForm(bottomPane, tagArr, 8, 'tagButton', tagButtonClicked);
    });
    addButtonsToForm(bottomPane, tagArr, 8, 'tagButton', tagButtonClicked);
    addButtonsToDialogBottom(controlDialog);
    setStyle();
    controlDialog.show();
    $('.dialog-container-buttons').css('background', paneStyle.paneBackColor);
    $('.dialog-button-confirm').css('background', paneStyle.btnBackColor);
    //创建显示按钮，并设置点击事件
}

//历史趋势指标列表弹窗
function createchartSelectDialog(dm, controlDialog, selectedLimit, callback) {
    if (controlDialog.isShowing()) {
        controlDialog.hide();
    }

    var borderPane = new ht.widget.BorderPane();
    // var datas=tags;
    var datas = dm.getDatas()._as;
    var datalength = datas.length;
    var formPane = new ht.widget.FormPane();
    formPane.setHeight(360);

    formPane.addRow([
        '已选择个数:',
        {
            id: "indicatorCount",

            textField: {
                text: '0',
                editable: false,
                width: 100,
                border: 0
            }
        },
        "",
        {
            button: {
                label: '清除',
                labelColor: 'blue',
                borderColor: 'transparent',
                background: '',
                onClicked: function () {
                    for (var i = 0; i < datalength; i++) {
                        var nameId = datas[i].a("name");

                        formPane.getItemById(nameId)["button"].setSelected(false);
                        formPane.getItemById(nameId)["button"].setBackground('rgb(255,255,255)');
                        formPane.getItemById(nameId)["button"].setIcon(null);
                        formPane.getItemById(nameId)["button"].setLabel(datas[i].a("displayName"));
                    }
                    formPane.setValue("indicatorCount", "0");
                }
            }
        }
    ], [0.1, 0.1, 0.8, 0.05, 0.05, 0.05], 25, {
            index: 1
        });
    formPane.addRow([], [0.1], 1.01, {
        background: 'rgb(243,243,250)',
        index: 2
    });

    var initCount = 0;
    var rowscount = Math.ceil(datas.length / 8);
    for (var m = 0; m < rowscount; m++) {
        var buttonList = [];
        var buttonWidthPercents = [];

        for (var j = m * 8; j < (m + 1) * 8; j++) {
            if (j < datas.length) {


                buttonList.push({
                    id: datas[j].a("name"),
                    button: createChartButton(datas[j].a("displayName"), datas[j].a("visible"), formPane)
                });
                if (datas[j].a("visible")) {
                    initCount = initCount + 1;
                }
                buttonWidthPercents.push(0.1);

            } else {
                buttonList.push(null);
                buttonWidthPercents.push(0.1);
            }
        }
        formPane.addRow(buttonList, buttonWidthPercents, 30, {
            index: m + 2
        });

        formPane.setValue("indicatorCount", initCount);
    }

    borderPane.setTopView(formPane);

    controlDialog.setConfig({
        title: "设置名称",
        titleIcon: '',
        titleColor: "black",
        //background:'red',
        closable: true, //关闭是否可用
        draggable: true,
        maximizable: false, //设置不可以被最大化
        width: 860,
        height: 460,
        position: {
            x: 200,
            y: 100
        }, //对话框的位置
        content: borderPane,
        buttonsAlign: "left",
        buttons: [{
            label: "确认",
            className: 'dialog-button-confirm',
            action: function (item, e) {
                var dictags = {};
                var tagsArray = [];
                var tags = "";
                for (var i = 0; i < datalength; i++) {
                    var nameId = datas[i].a("name");
                    if (formPane.getItemById(nameId)["button"].isSelected()) {
                        datas[i].a("visible", true);
                        tagsArray.push(nameId);
                        dictags[datas[i].a("name")] = datas[i].a("displayName");
                    } else {
                        datas[i].a("visible", false);
                    }
                }
                controlDialog.hide();
                for (var i = 0; i < tagsArray.length; i++) {
                    tags += tagsArray[i] + ",";
                    if (i == (tagsArray.length - 1)) {
                        tags = tags.substring(0, tags.length - 1);
                    }
                }
                callback(tags, dictags);
            }
        }, {
            label: "取消",
            className: 'dialog-button-cancel',
            action: function (item, e) {
                controlDialog.hide();
            }
        }]
    });

    controlDialog.setModal(false);
    controlDialog.show();
    //创建显示按钮，并设置点击事件
    function createChartButton(lable, show, formPane) {
        var button = new ht.widget.Button();
        button.setLabel(lable);
        button.setTogglable(true);
        button.setWidth(100);
        button.setHeight(40);

        if (show) {
            button.setSelected(true);
            button.setSelectBackground('rgb(53,199,122)');
            //button.setBackground('rgb(53,199,122)');
            button.setIcon(imagePath + "DuiHao.png");
            button.setLabel("  " + lable);
        } else {
            button.setBackground('rgb(255,255,255)');
            button.setSelected(false);
            button.setIcon(null);
            button.setLabel(lable);
        }

        button.onClicked = function () {
            // 设置选择个数限制
            if (parseInt(formPane.getValue("indicatorCount")) >= 5 && this.isSelected()) {
                dialogTip('已选择的指标超过' + selectedLimit + '个了，最多选择5个！');
                this.setSelected(false);
                this.setBackground('rgb(255,255,255)');
                this.setIcon(null);
                this.setLabel(lable);
                return button;

            }
            if (this.isSelected()) {

                formPane.setValue("indicatorCount", parseInt(formPane.getValue("indicatorCount")) + 1);
                this.setSelectBackground('rgb(53,199,122)');
                this.setIcon(imagePath + "DuiHao.png");
                this.setLabel("  " + lable);


            } else {
                formPane.setValue("indicatorCount", parseInt(formPane.getValue("indicatorCount")) - 1);
                this.setBackground('rgb(255,255,255)');
                this.setIcon(null);
                this.setLabel(lable);
            }


        }
        return button;
    }
}
// 弹出提示框
function dialogTip(content, callback) {
    GD.createErrorDialog(360, 240, content, callback);
}

function createButton(lable, show, formPane, paneStyle, limit) {
    var button = new ht.widget.Button();
    button.setLabel(lable);
    button.setTogglable(true);
    button.setWidth(100);
    button.setHeight(40);
    button.setLabelFont('bold 12px "苹方 粗体"');
    button.setBorderColor('rgba(0,0,0,0)');
    limit = limit || 1000000;
    if (show) {
        button.setSelected(true);
        button.setIcon(imagePath + "DuiHao.png");
        button.setLabel("  " + lable);
    } else {
        button.setSelected(false);
        button.setIcon(null);
        button.setLabel(lable);
    }

    button.setSelectBackground(paneStyle.btnCheckedBackColor);
    button.setBackground(paneStyle.btnBackColor);
    button.setLabelSelectColor(paneStyle.btnCheckedFontColor);
    button.setLabelColor(paneStyle.btnFontColor);

    button.onClicked = function () {
        if (this.isSelected()) {
            if (formPane.getValue("indicatorCount") >= limit) {
                dialogTip('选择的太多啦, 最多可选择' + limit + '个!');
                this.setSelected(false);
                this.setBackground(paneStyle.btnBackColor);
                this.setIcon(null);
                this.setLabel(lable);
                this.setLabelColor(paneStyle.btnFontColor);
                return;
            }
            formPane.setValue("indicatorCount", parseInt(formPane.getValue("indicatorCount")) + 1);
            this.setIcon(imagePath + "DuiHao.png");
            this.setLabel("  " + lable);
        } else {
            formPane.setValue("indicatorCount", parseInt(formPane.getValue("indicatorCount")) - 1);
            this.setIcon(null);
            this.setLabel(lable);
        }
    }
    $(button.getView()).css({
        boxShadow: '1px 1px 4px #000'
    })
    return button;
}