AreaIndex.cshtml 7.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200
  1. @{
  2. ViewBag.Title = "区域管理";
  3. Layout = "~/Views/Shared/_LayoutIndex.cshtml";
  4. }
  5. <script>
  6. var itemId, itemName,areaLevel;
  7. $(function () {
  8. InitialPage();
  9. GetTree();
  10. GetPointGrid();
  11. $("#tabs").tabs();
  12. //device.init();
  13. });
  14. function getSelectedTabIndex() {
  15. return $("#tabs").tabs('option', 'active');
  16. }
  17. //初始化页面
  18. function InitialPage() {
  19. //layout布局
  20. $('#layout').layout({
  21. applyDemoStyles: true,
  22. onresize: function () {
  23. $(window).resize();
  24. }
  25. });
  26. //resize重设(表格、树形)宽高
  27. $(window).resize(function (e) {
  28. window.setTimeout(function () {
  29. $("#itemTree").setTreeHeight($(window).height() - 52);
  30. }, 200);
  31. e.stopPropagation();
  32. });
  33. }
  34. //加载树
  35. function GetTree() {
  36. var item = {
  37. height: $(window).height() - 52,
  38. url: "/JiangSuWaterResource/AreaAndDevice/GetAreaTreeJson?showcheck=false&checkstate=1",
  39. onnodeclick: function (item) {
  40. itemId = item.id;
  41. itemName = item.text;
  42. areaLevel = item.areaLevel;
  43. console.log(item);
  44. }
  45. };
  46. //初始化
  47. $("#itemTree").treeview(item);
  48. }
  49. function GetPointGrid() {
  50. var selectedRowIndex = 0;
  51. var $gridTable = $('#pointGridTable');
  52. $gridTable.jqGrid({
  53. url: "/JiangSuWaterResource/AreaAndDevice/GetAreaGridData",
  54. datatype: "json",
  55. height: $(window).height() - 170,
  56. width: $('.gridPanel').width(),
  57. autowidth: true,
  58. rownumbers: true,
  59. colModel: [
  60. { name: "id", label: "id", align: "center", hidden: true },
  61. { name: "上级id", label: "上级id", align: "center", hidden: true },
  62. { name: "名称", label: "区域名称", align: "left" },
  63. { name: "级别名称", label: "所属级别", align: "left" },
  64. { name: "上级名称", label: "上级名称", align: "left" },
  65. { name: "编码", label: "编码", align: "left" }
  66. ],
  67. viewrecords: true,
  68. rowNum: 30,
  69. rowList: [30, 50, 100],
  70. pager: "#gridPager",
  71. gridview: true,
  72. onSelectRow: function () {
  73. selectedRowIndex = $("#" + this.id).getGridParam('selrow');
  74. },
  75. gridComplete: function () {
  76. $("#" + this.id).setSelection(selectedRowIndex, false);
  77. }
  78. });
  79. //查询事件
  80. $("#btn_point_Search").click(function () {
  81. var PointStartTime = $("#PointStartTime").val();
  82. var PointEndTime = $("#PointEndTime").val();
  83. if (PointStartTime.length <= 0 || PointEndTime.length <= 0) {
  84. dialogMsg('请选择时间!', 0);
  85. return;
  86. }
  87. $gridTable.jqGrid('setGridParam', {
  88. postData: { deviceId: checkedIds.toString(), startT: PointStartTime, endT: PointEndTime },
  89. page: 1
  90. }).trigger('reloadGrid');
  91. });
  92. }
  93. //新增
  94. function btn_add() {
  95. if (areaLevel < 3) {
  96. dialogOpen({
  97. id: "Form",
  98. title: '添加区域',
  99. url: '/JiangSuWaterResource/AreaAndDevice/AreaForm?id=' + itemId + '&name=' + escape(itemName) + '&areaLevel=' + areaLevel,
  100. width: "750px",
  101. height: "460px",
  102. callBack: function (iframeId) {
  103. top.frames[iframeId].AcceptClick();
  104. }
  105. });
  106. }
  107. };
  108. //编辑
  109. function btn_edit() {
  110. var keyValue = $("#gridTable").jqGridRowValue("id");
  111. if (checkedRow(keyValue)) {
  112. dialogOpen({
  113. id: "Form",
  114. title: '编辑区域',
  115. url: '/PipeNetworkManage/Meter/MeterForm?keyValue=' + keyValue,
  116. width: "750px",
  117. height: "460px",
  118. callBack: function (iframeId) {
  119. top.frames[iframeId].AcceptClick();
  120. }
  121. });
  122. }
  123. }
  124. //删除
  125. function btn_delete() {
  126. var keyValue = $("#gridTable").jqGridRowValue("id");
  127. if (keyValue) {
  128. $.RemoveForm({
  129. url: "/PipeNetworkManage/Meter/DeleteMeter",
  130. param: { keyValue: keyValue },
  131. success: function (data) {
  132. $("#gridTable").trigger("reloadGrid");
  133. }
  134. })
  135. } else {
  136. dialogMsg('请选择需要删除的数据项!', 0);
  137. }
  138. }
  139. </script>
  140. <div class="ui-layout" id="layout" style="height: 100%; width: 100%;">
  141. <div class="ui-layout-west">
  142. <div class="west-Panel">
  143. <div class="panel-Title">区域管理</div>
  144. <div id="itemTree"></div>
  145. </div>
  146. </div>
  147. <div class="ui-layout-center">
  148. <div class="center-Panel">
  149. <div class="panel-Title">区域管理列表</div>
  150. <div class="titlePanel">
  151. <div class="title-search">
  152. <table>
  153. <tr>
  154. @* <td style="padding-left: 10px;">测点名称:
  155. </td>
  156. <td style="padding-left: 10px;">
  157. <input type="text" id="device" name="device" class="form-control" style="width: 130px;" />
  158. </td>*@
  159. <td style="padding-left: 10px;">
  160. 区域名称:
  161. </td>
  162. <td style="padding-left: 10px;">
  163. <input id="AreaName" type="text" class="form-control " style="width:175px">
  164. </td>
  165. <td style="padding-left: 10px;">
  166. <a id="btn_point_Search" class="btn btn-primary">&nbsp;查&nbsp;&nbsp;询</a>
  167. </td>
  168. </tr>
  169. </table>
  170. </div>
  171. <div class="toolbar">
  172. <div class="btn-group">
  173. <a id="lr-replace" class="btn btn-default" onclick="reload();"><i class="fa fa-refresh"></i>&nbsp;刷新</a>
  174. <a id="lr-export" class="btn btn-default" onclick="btn_add()"><i class="fa fa-plus"></i>&nbsp;新增</a>
  175. <a id="lr-export" class="btn btn-default" onclick="btn_edit()"><i class="fa fa-pencil-square-o"></i>&nbsp;编辑</a>
  176. <a id="lr-export" class="btn btn-default" onclick="btn_delete()"><i class="fa fa-trash-o"></i>&nbsp;删除</a>
  177. </div>
  178. </div>
  179. </div>
  180. <div class="gridPanel">
  181. <table id="pointGridTable"></table>
  182. <div id="gridPager"></div>
  183. </div>
  184. </div>
  185. </div>
  186. </div>