NBDXSY/LeaRun.Application/LeaRun.Application.Web/Areas/PipeNetworkManage/Views/RealTimeMonitoring/Index.cshtml

@{
    ViewBag.Title = "Index";
    Layout = "~/Views/Shared/_LayoutIndex.cshtml";
}

<script>
    var checkedIds = [];

    $(function () {
        InitialPage();
        GetTree();
        GetGrid();
        //device.init();
    });

    //初始化页面
    function InitialPage() {
        //layout布局
        $('#layout').layout({
            applyDemoStyles: true,
            onresize: function () {
                $(window).resize();
            }
        });
        //resize重设(表格、树形)宽高
        $(window).resize(function (e) {
            window.setTimeout(function () {
                $('#gridTable').setGridWidth(($('.gridPanel').width()));
                $("#gridTable").setGridHeight($(window).height() - 141);
                $("#itemTree").setTreeHeight($(window).height() - 52);
            }, 200);
            e.stopPropagation();
        });
    }

    //加载树
    function GetTree() {
        var item = {
            height: $(window).height() - 52,
            url: "/PipeNetworkManage/Meter/GetMeterTreeJson?showcheck=true&checkstate=1",
            onnodeclick: function (item) {
                //展开下级
                $(".bbit-tree-selected").children('.bbit-tree-ec-icon').trigger("click");
            },
            oncheckboxclick: function (item, status) {
                GetAllCheckNodes(item.id, status, item.text);//维护 选中元素id的数组                
            }
        };
        //初始化
        $("#itemTree").treeview(item);
        getNodes();
    }

    function getNodes() {
        var nodes = $("#itemTree").getTSNs(true);//获取所有勾选节点包括半勾选

        $.each(nodes, function (i, value) {
            var id = value.id;
            checkedIds.push(id);
        });
    }

    //被选中元素的ID,TEXT 数组维护
    function GetAllCheckNodes(id, status, text) {
        //数据加入数组
        if (status == 1) {
            if (!checkedIds.contain(id)) {
                checkedIds.push(id);
            }
        }

        if (status == 0) {
            if (checkedIds.contain(id)) {
                checkedIds.splice(checkedIds.indexOf(id), 1);
            }
        }
    }


    //AutoComplete
    var device = {
        init: function () {

            var width = $('#device').width();

            $('#device').autocomplete({
                source: function (request, response) {
                    $.ajax({
                        url: "/IPm/DeviceInfo/GetDeviceBySearch",
                        type: "GET",
                        data: { q: $('#device').val() },
                        dataType: "json",
                        success: function (data) {
                            response($.map(data, function (item) {
                                console.log(item);
                                return {
                                    label: item.label,
                                    value: "dev" + item.value
                                }
                            }));
                        }
                    });
                },
                select: function (event, ui) {
                    DepartmentId = "";
                    TypeID = "";
                    DeviceID = "";
                    $("#device").val(ui.item.label);
                    DeviceID = ui.item.value.substring(3);
                    PointTreeCode = ui.item.value;
                    return false;
                }
            });
        }
    };

    function returnFloat(value) {
        var value = Math.round(parseFloat(value) * 100) / 100;
        var xsd = value.toString().split(".");
        if (xsd.length == 1) {
            value = value.toString() + ".00";
            return value;
        }
        if (xsd.length > 1) {
            if (xsd[1].length < 2) {
                value = value.toString() + "0";
            }
            return value;
        }
    }
    function GetGrid() {
        var $gridTable = $('#gridTable');
        $gridTable.jqGrid({
            url: "/PipeNetworkManage/RealTimeMonitoring/GetRealTimeData",
            postData: { devId: checkedIds.toString() },
            datatype: "json",
            height: $(window).height() - 170,
            autowidth: true,
            rownumbers: true,
            colModel: [
                { name: "DevName", label: "测点名称", align: "left" },
                { name: "采集时间", label: "采集时间", align: "right" },
                {
                    name: "净累计流量", label: "净累计流量(m³)", align: "right",
                    formatter: function (cellvalue, options, rowObject) {
                        if (cellvalue != null && cellvalue != "" && cellvalue!="--") {
                            return cellvalue = returnFloat(cellvalue)
                        } else {
                            return cellvalue;
                        }
                    }
                },
                {
                    name: "正累计流量", label: "正累计流量(m³)", align: "right",
                    formatter: function (cellvalue, options, rowObject) {
                        if (cellvalue != null && cellvalue != "" && cellvalue!="--") {
                            return cellvalue = returnFloat(cellvalue)
                        } else {
                            return cellvalue;
                        }
                    }
                },
                {
                    name: "负累计流量", label: "负累计流量(m³)", align: "right",
                    formatter: function (cellvalue, options, rowObject) {
                        if (cellvalue != null && cellvalue != "" && cellvalue!="--") {
                            return cellvalue = returnFloat(cellvalue)
                        } else {
                            return cellvalue;
                        }
                    }
                },
                {
                    name: "瞬时流量", label: "瞬时流量(m³/h)", align: "right",
                    formatter: function (cellvalue, options, rowObject) {
                        if (cellvalue != null && cellvalue != "" && cellvalue!="--") {
                            return cellvalue = returnFloat(cellvalue)
                        } else {
                            return cellvalue;
                        }
                    }
                },
                {
                    name: "压力", label: "压力(MPa)", align: "right",
                    formatter: function (cellvalue, options, rowObject) {
                        if (cellvalue != null && cellvalue != "" && cellvalue!="--") {
                            return cellvalue = returnFloat(cellvalue)
                        } else {
                            return cellvalue;
                        }
                    }
                },
                {
                    name: "压力上限报警", label: "压力上限报警", align: "right",
                    formatter: function (cellvalue, options, rowObject) {
                        if (cellvalue != null && cellvalue != "" && cellvalue!="--") {
                            return cellvalue = returnFloat(cellvalue)
                        } else {
                            return cellvalue;
                        }
                    }
                },
                {
                    name: "压力下限报警", label: "压力下限报警", align: "right",
                    formatter: function (cellvalue, options, rowObject) {
                        if (cellvalue != null && cellvalue != "" && cellvalue!="--") {
                            return cellvalue = returnFloat(cellvalue)
                        } else {
                            return cellvalue;
                        }
                    }
                },
                {
                    name: "电池电压", label: "电池电压(v)", align: "right",
                    formatter: function (cellvalue, options, rowObject) {
                        if (cellvalue != null && cellvalue != "" && cellvalue!="--") {
                            return cellvalue = returnFloat(cellvalue)
                        } else {
                            return cellvalue;
                        }
                    }
                },
                { name: "测控箱开门报警", label: "测控箱开门报警", align: "center" }
            ],
            viewrecords: true,
            rowNum: 30,
            rowList: [30, 50, 100],
            pager: "#gridPager",
            gridview: true,
            gridComplete: function () {

            }
        });

        //查询事件
        $("#btn_Search").click(function () {

            if (checkedIds.length == 0) {
                dialogMsg('请选择测点！', 0);
                return;
            }
            $gridTable.jqGrid("clearGridData");
            $gridTable.jqGrid('setGridParam', {
                postData: { devId: checkedIds.toString() },
                page: 1
            }).trigger('reloadGrid');
        });
    }

</script>
<div class="ui-layout" id="layout" style="height: 100%; width: 100%;">
    <div class="ui-layout-west">
        <div class="west-Panel">
            <div class="panel-Title">测点列表</div>
            <div id="itemTree"></div>
        </div>
    </div>
    <div class="ui-layout-center">
        <div class="center-Panel">
            <div class="panel-Title">实时信息</div>
            <div class="titlePanel">
                <div class="title-search">
                    <table>
                        <tr>
                            @*<td style="padding-left: 10px;">测点名称：
                            </td>
                            <td style="padding-left: 10px;">
                                <input type="text" id="device" name="device" class="form-control" style="width: 130px;" />
                            </td>*@
                            <td style="padding-left: 10px;">
                                <a id="btn_Search" class="btn btn-primary">&nbsp;查&nbsp;&nbsp;询</a>
                            </td>
                        </tr>
                    </table>
                </div>
            </div>
            <div class="gridPanel">
                <table id="gridTable"></table>
                <div id="gridPager"></div>
            </div>
        </div>
    </div>
</div>