RealTimeData.cshtml 5.2 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131
  1. @{
  2. ViewBag.Title = "抄表历史查询";
  3. Layout = "~/Views/Shared/_Index.cshtml";
  4. }
  5. <script>
  6. $(document).ready(function () {
  7. initControl();
  8. initialPage();
  9. GetGrid();
  10. //表格表头居中显示
  11. $(".ui-th-column").css("text-align", "center");
  12. });
  13. //重设(表格)宽高
  14. function initialPage() {
  15. //resize重设(表格、树形)宽高
  16. $(window).resize(function (e) {
  17. window.setTimeout(function () {
  18. $('#gridTable').setGridWidth(($('.gridPanel').width()));
  19. $("#gridTable").setGridHeight($(window).height() - 108.5);
  20. }, 200);
  21. e.stopPropagation();
  22. });
  23. }
  24. //加载表格
  25. function GetGrid() {
  26. var selectedRowIndex = 0;
  27. var $gridTable = $('#gridTable');
  28. $gridTable.jqGrid({
  29. url: "/NBManage/NBHistorySearch/GetRealTimeData",
  30. datatype: "json",
  31. height: $(window).height() - 138.5,
  32. autowidth: true,
  33. colModel: [
  34. { label: '主键', name: 'OrganizeId', hidden: true ,fixed:true},
  35. { label: "区域名称", name: "area", width: 300, align: "left", sortable: false, fixed: true },
  36. { label: "门牌号", name: "room", width: 100, align: "left", sortable: false, fixed: true },
  37. { label: "用户编号", name: "UserNo", width: 150, align: "left", sortable: false, fixed: true },
  38. { label: "用户名称", name: "UserName", width: 150, align: "left", sortable: false, fixed: true },
  39. { label: "表类型", name: "MeterType", width: 100, align: "left", sortable: false, hidden: true, fixed: true },
  40. { label: "抄表时间", name: "NowRadingDT", width: 165, align: "right", formatter: "date", formatoptions: { srcformat: 'Y-m-d H:i:s', newformat: 'Y-m-d H:i:s' }, fixed: true },
  41. { label: "表地址", name: "ElecAddress", width: 150, align: "right", fixed: true },
  42. { label: "净累计(m³)", name: "NowReading", width: 150, align: "right", formatter: 'number', formatoptions: { decimalPlaces: 2, defaulValue: "", thousandsSeparator: "," }, fixed: true },
  43. {
  44. label: "阀门状态", name: "ValveStatus", width: 100, align: "left", sortable: false,
  45. formatter: function (cellvalue, options, rowObject) {
  46. if (cellvalue == "00") { return "开" }
  47. if (cellvalue == "01") { return "关" }
  48. if (cellvalue == "11") { return "异常" }
  49. }
  50. , fixed: true
  51. }
  52. ],
  53. viewrecords: true,
  54. rowNum: 30,
  55. rowList: [30, 50, 100],
  56. pager: "#gridPager",
  57. gridview: true,
  58. sortable: true,
  59. sortname: "NowRadingDT",
  60. sortorder: "desc",
  61. rownumbers: true,
  62. gridComplete: function () {
  63. $("#" + this.id).setSelection(selectedRowIndex, false);
  64. }
  65. });
  66. }
  67. function initControl() {
  68. //小区
  69. $("#AreaId").ComboBox({
  70. url: "/NBManage/NBHistorySearch/GetAreaListJson",
  71. id: "AreaId",
  72. text: "AreaName",
  73. description: "选择小区",
  74. height: "170px"
  75. });
  76. }
  77. function btn_Search() {
  78. var areaId = $("#AreaId").attr('data-value');
  79. $("#gridTable").jqGrid('setGridParam', {
  80. postData: {
  81. areaId: areaId
  82. }
  83. }).trigger('reloadGrid');
  84. }
  85. //导出
  86. function btn_export() {
  87. var datavalue = $("#gridTable").jqGrid('getRowData'); //获取全部数据
  88. dialogOpen({
  89. id: "ExcelIExportDialog",
  90. title: '导出',
  91. url: '/Utility/ExcelExportForm?gridId=gridTable&filename=历史记录',
  92. width: "500px",
  93. height: "380px",
  94. callBack: function (iframeId) {
  95. top.frames[iframeId].AcceptClick();
  96. }, btn: ['导出Excel', '关闭']
  97. });
  98. }
  99. </script>
  100. <div class="titlePanel">
  101. <div class="title-search">
  102. <table>
  103. <tr>
  104. <td>
  105. <div id="queryCondition" >
  106. <div id="AreaId" type="select" class="ui-select" style="float: left; min-width: 150px; margin-right: 1px;"></div>
  107. </div>
  108. </td>
  109. <td style="padding-left: 5px;">
  110. <a id="btn_Search" class="btn btn-primary" onclick="btn_Search()"><i class="fa fa-search"></i>&nbsp;查询</a>
  111. </td>
  112. </tr>
  113. </table>
  114. </div>
  115. <div class="toolbar">
  116. <div class="btn-group">
  117. <a id="lr-replace" class="btn btn-default" onclick="reload();"><i class="fa fa-refresh"></i>&nbsp;刷新</a>
  118. <a id="lr-edit" class="btn btn-default" onclick="btn_export()"><i class="fa fa-file-excel-o"></i>&nbsp;导出</a>
  119. </div>
  120. </div>
  121. </div>
  122. <div class="gridPanel">
  123. <table id="gridTable"></table>
  124. <div id="gridPager"></div>
  125. </div>