Index.cshtml 10 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272
  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/GetRecordJson",
  30. datatype: "json",
  31. height: $(window).height() - 138.5,
  32. autowidth: true,
  33. colModel: [
  34. { label: '主键', name: 'OrganizeId', hidden: true },
  35. { label: "区域名称", name: "area", width: 300, align: "left", sortable: false },
  36. { label: "表地址", name: "ElecAddress", width: 200, align: "left", sortable: false },
  37. {
  38. label: "净累计(m³)", name: "Total", width: 100, align: "left", sortable: false,
  39. formatter: function (cellvalue, options, rowObject) {
  40. return "295.36";
  41. }
  42. },
  43. {
  44. label: "正累计(m³)", name: "TotalUp", width: 100, align: "left", sortable: false,
  45. formatter: function (cellvalue, options, rowObject) {
  46. return "308.89";
  47. }
  48. },
  49. {
  50. label: "负累计(m³)", name: "TotalDown", width: 100, align: "left", sortable: false,
  51. formatter: function (cellvalue, options, rowObject) {
  52. return "13.53";
  53. }
  54. },
  55. {
  56. label: "瞬时流量(L/H)", name: "Instance", width: 100, align: "left", sortable: false,
  57. formatter: function (cellvalue, options, rowObject) {
  58. return "2015";
  59. }
  60. },
  61. {
  62. label: "抄表时间", name: "ReadingDT", width: 180, align: "left", sortable: false,
  63. formatter: function (cellvalue, options, rowObject) {
  64. return formatDate(cellvalue, 'yyyy-MM-dd hh:mm:ss');
  65. }
  66. },
  67. {
  68. label: "报警类型", name: "ValveStatus", width: 100, align: "left", sortable: false,
  69. formatter: function (cellvalue, options, rowObject) {
  70. return "过流报警";
  71. }
  72. }
  73. ],
  74. viewrecords: true,
  75. rowNum: 1,
  76. rowList: [30, 50, 100],
  77. pager: "#gridPager",
  78. gridview: true,
  79. rownumbers: true,
  80. gridComplete: function () {
  81. $("#" + this.id).setSelection(selectedRowIndex, false);
  82. }
  83. });
  84. //$gridTable.authorizeColModel();
  85. //查询条件设置
  86. }
  87. var value = "";
  88. function initControl() {
  89. //小区
  90. $("#AreaId").ComboBox({
  91. url: "/NBManage/NBHistorySearch/GetAreaListJson",
  92. id: "AreaId",
  93. text: "AreaName",
  94. description: "选择小区",
  95. height: "170px"
  96. }).bind("change", function () {
  97. value = $(this).attr('data-value');
  98. SetComboxInit("BldgId", "选择楼宇");
  99. SetComboxInit("ApmtId", "选择单元");
  100. SetComboxInit("RoomId", "选择房间");
  101. $("#BldgId").ComboBox({
  102. url: "/NBManage/NBHistorySearch/GetBldgListJson",
  103. param: { parentId: value },
  104. id: "BldgId",
  105. text: "BldgName",
  106. description: "选择楼宇",
  107. height: "170px"
  108. }).bind("change", function () {
  109. value = $(this).attr('data-value');
  110. SetComboxInit("ApmtId", "选择单元");
  111. SetComboxInit("RoomId", "选择房间");
  112. $("#ApmtId").ComboBox({
  113. url: "/NBManage/NBHistorySearch/GetApmtListJson",
  114. param: { parentId: value },
  115. id: "ApmtId",
  116. text: "ApmtName",
  117. description: "选择单元",
  118. height: "170px"
  119. }).bind("change", function () {
  120. value = $(this).attr('data-value');
  121. SetComboxInit("RoomId", "选择房间");
  122. $("#RoomId").ComboBox({
  123. url: "/NBManage/NBHistorySearch/GetRoomListJson",
  124. param: { parentId: value },
  125. id: "RoomID",
  126. text: "RoomName",
  127. description: "选择房间",
  128. height: "170px"
  129. });
  130. });
  131. })
  132. });
  133. function SetComboxInit(domId, text) {
  134. $("#" + domId).removeAttr('data-value');
  135. $("#" + domId).removeAttr('data-text');
  136. $("#" + domId + " .ui-select-text").text(text);
  137. $("#" + domId).ComboBoxTree({
  138. height: "170px"
  139. })
  140. }
  141. $("#RoomId").ComboBox({
  142. description: "选择房间",
  143. height: "170px"
  144. })
  145. $("#ApmtId").ComboBox({
  146. description: "选择单元",
  147. height: "170px"
  148. })
  149. $("#BldgId").ComboBox({
  150. description: "选择楼宇",
  151. height: "170px"
  152. })
  153. //报警类型
  154. $("#AlarmType").ComboBoxTree({
  155. url: "/NBManage/AlarmHis/GetAlarmType",
  156. id: "ItemValue",
  157. text: "ItemName",
  158. description: "请选择报警类型",
  159. height: "170px"
  160. });
  161. }
  162. function btn_Search() {
  163. var areaId = $("#AreaId").attr('data-value');
  164. var bldgId = $('#BldgId').attr('data-value');
  165. var apmtId = $('#ApmtId').attr('data-value');
  166. var roomId = $('#RoomId').attr('data-value');
  167. var thisDate = $('#ThisDate').val();
  168. var lastDate = $('#LastDate').val();
  169. var queryType = 1;
  170. var queryValue = "";
  171. var userNo = $("#txt_userno").val();
  172. var imei = $("#txt_imei").val();
  173. if (!areaId) {
  174. queryType = 1;
  175. queryValue = "";
  176. } else {
  177. if (!bldgId) {
  178. queryType = 1;
  179. queryValue = areaId;
  180. } else {
  181. if (!apmtId) {
  182. queryType = 2;
  183. queryValue = bldgId;
  184. } else {
  185. if (!roomId) {
  186. queryType = 3;
  187. queryValue = apmtId;
  188. } else {
  189. queryType = 4;
  190. queryValue = roomId;
  191. }
  192. }
  193. }
  194. }
  195. $("#gridTable").jqGrid('setGridParam', {
  196. postData: {
  197. queryType: queryType,
  198. queryValue: queryValue,
  199. userNo: userNo,
  200. imei: imei,
  201. thisDate: thisDate,
  202. lastDate: lastDate,
  203. searchFlag: 1
  204. }
  205. }).trigger('reloadGrid');
  206. }
  207. //导出
  208. function btn_export() {
  209. var datavalue = $("#gridTable").jqGrid('getRowData'); //获取全部数据
  210. dialogOpen({
  211. id: "ExcelIExportDialog",
  212. title: '导出',
  213. url: '/Utility/ExcelExportForm?gridId=gridTable&filename=历史记录',
  214. width: "500px",
  215. height: "380px",
  216. callBack: function (iframeId) {
  217. top.frames[iframeId].AcceptClick();
  218. }, btn: ['导出Excel', '关闭']
  219. });
  220. }
  221. </script>
  222. <div class="titlePanel">
  223. <div class="title-search">
  224. <table>
  225. <tr>
  226. <td>
  227. <div id="queryCondition">
  228. <div id="AreaId" type="select" class="ui-select" style="float: left; min-width: 100px; margin-right: 1px;"></div>
  229. <div id="BldgId" type="select" class="ui-select" style="float: left; min-width: 100px; margin-right: 1px;"></div>
  230. <div id="ApmtId" type="select" class="ui-select" style="float: left; min-width: 100px; margin-right: 1px;"></div>
  231. <div id="RoomId" type="select" class="ui-select" style="float: left; min-width: 100px; margin-right: 1px;"></div>
  232. </div>
  233. </td>
  234. <td style="padding-left: 2px;">
  235. <div id="AlarmType" type="select" class="ui-select" style="float: left; min-width: 150px; margin-right: 1px;"></div>
  236. </td>
  237. <td>开始日期</td>
  238. <td>
  239. <input id="ThisDate" type="text" class="form-control input-wdatepicker" onfocus="WdatePicker()" />
  240. </td>
  241. <td>结束日期</td>
  242. <td>
  243. <input id="LastDate" type="text" class="form-control input-wdatepicker" onfocus="WdatePicker()" />
  244. </td>
  245. <td style="padding-left: 5px;">
  246. <a id="btn_Search" class="btn btn-primary" onclick="btn_Search()"><i class="fa fa-search"></i>&nbsp;查询</a>
  247. </td>
  248. </tr>
  249. </table>
  250. </div>
  251. <div class="toolbar">
  252. <div class="btn-group">
  253. <a id="lr-replace" class="btn btn-default" onclick="reload();"><i class="fa fa-refresh"></i>&nbsp;刷新</a>
  254. <a id="lr-edit" class="btn btn-default" onclick="btn_export()"><i class="fa fa-file-excel-o"></i>&nbsp;导出</a>
  255. </div>
  256. </div>
  257. </div>
  258. <div class="gridPanel">
  259. <table id="gridTable"></table>
  260. <div id="gridPager"></div>
  261. </div>