Commit a83c1fac947f9427a9186cedadeff0bf903d75a0
1 parent
58b5a128
车辆设备搜索添加高级选项功能-排序字段选取:
1、搜索框带箭头,点击弹出排序选项 2、点击排序选项,弹出排序字段选项对话框,对话框内部使用saOrderOption自定义指令
Showing
9 changed files
with
573 additions
and
6 deletions
src/main/resources/static/pages/scheduleApp/Gruntfile.js
| ... | ... | @@ -89,6 +89,7 @@ module.exports = function (grunt) { |
| 89 | 89 | 'module/common/dts2/bcGroup/saBcgroup.js', // 班次选择整合指令 |
| 90 | 90 | 'module/common/dts2/ttinfotable/saTimeTable.js', // 时刻表显示指令 |
| 91 | 91 | 'module/common/dts2/ttinfotable/saTimeTableScrolly1.js', // 时刻表滚动1显示指令 |
| 92 | + 'module/common/dts2/queryOption/saOrderOption.js', // saOrderoption指令,搜索时的排序选项(在搜索时可以使用,通用的) | |
| 92 | 93 | 'module/common/dts2/scheduleplan/saScpdate.js', // saScpdate指令(非通用指令,只在排班计划form中使用) |
| 93 | 94 | 'module/common/dts2/scheduleplan/saSrule.js', // saSrule指令(非通用指令,只在排班计划form中使用) |
| 94 | 95 | 'module/common/dts2/scheduleplan/saPlaninfoedit.js', // saPlaninfoedit指令(非通用指令,只在调度执勤日报中使用) | ... | ... |
src/main/resources/static/pages/scheduleApp/module/basicInfo/deviceInfoManage/list.html
| 1 | 1 | <!-- ui-route deviceInfoManage.list --> |
| 2 | 2 | <div ng-controller="DeviceInfoManageListCtrl as ctrl"> |
| 3 | + <style> | |
| 4 | + .dropdown-menu { | |
| 5 | + border-color: #32c5d2; | |
| 6 | + } | |
| 7 | + .btn-group > .dropdown-menu:before { | |
| 8 | + border-bottom-color: #32c5d2; | |
| 9 | + } | |
| 10 | + </style> | |
| 11 | + | |
| 12 | + | |
| 3 | 13 | <div style="width: 100%; height: 100%; overflow: auto"> |
| 4 | 14 | <table class="fixTable table table-striped table-bordered table-hover table-checkable order-column"> |
| 5 | 15 | <thead> |
| ... | ... | @@ -43,9 +53,24 @@ |
| 43 | 53 | </label> |
| 44 | 54 | </td> |
| 45 | 55 | <td> |
| 46 | - <button class="btn btn-sm green btn-outline filter-submit margin-bottom" | |
| 47 | - ng-click="ctrl.doPage()"> | |
| 48 | - <i class="fa fa-search"></i> 搜索</button> | |
| 56 | + <div class="btn-group"> | |
| 57 | + <button class="btn btn-sm green btn-outline filter-submit margin-bottom" style="margin-right: 0;" | |
| 58 | + ng-click="ctrl.doPage()"> | |
| 59 | + <i class="fa fa-search"></i> 搜索</button> | |
| 60 | + <button class="btn btn-sm green btn-outline filter-submit margin-bottom dropdown-toggle" | |
| 61 | + data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"> | |
| 62 | + <span class="caret"></span> | |
| 63 | + <span class="sr-only">dropdown</span> | |
| 64 | + </button> | |
| 65 | + <ul class="dropdown-menu pull-right"> | |
| 66 | + <li> | |
| 67 | + <a href="javascript:" class="tool-action" ng-click="ctrl.customOrder()"> | |
| 68 | + <i class="fa fa-sort-amount-asc" aria-hidden="true"></i> | |
| 69 | + 排序选项 | |
| 70 | + </a> | |
| 71 | + </li> | |
| 72 | + </ul> | |
| 73 | + </div> | |
| 49 | 74 | |
| 50 | 75 | <button class="btn btn-sm red btn-outline filter-cancel" |
| 51 | 76 | ng-click="ctrl.reset()"> | ... | ... |
src/main/resources/static/pages/scheduleApp/module/basicInfo/deviceInfoManage/module.js
| ... | ... | @@ -20,6 +20,20 @@ angular.module('ScheduleApp').factory( |
| 20 | 20 | uiToRecord: 0 // 页面绑定,当前页到第几条记录 |
| 21 | 21 | }; |
| 22 | 22 | |
| 23 | + // 字段描述 | |
| 24 | + var columns = [ | |
| 25 | + {name: "xl", desc: "线路名称"}, | |
| 26 | + {name: "clZbh", desc: "车辆内部编号"}, | |
| 27 | + {name: "qyrq", desc: "启用日期"}, | |
| 28 | + {name: "oldDeviceNo", desc: "旧设备编号"}, | |
| 29 | + {name: "newDeviceNo", desc: "新终端号"} | |
| 30 | + ]; | |
| 31 | + // 排序字段 | |
| 32 | + var orderColumns = { | |
| 33 | + order: "xl,clZbh,qyrq", | |
| 34 | + direction: "ASC,ASC,DESC" | |
| 35 | + }; | |
| 36 | + | |
| 23 | 37 | // 查询对象 |
| 24 | 38 | var queryClass = service; |
| 25 | 39 | |
| ... | ... | @@ -27,6 +41,12 @@ angular.module('ScheduleApp').factory( |
| 27 | 41 | getQueryClass: function() { |
| 28 | 42 | return queryClass; |
| 29 | 43 | }, |
| 44 | + getColumns: function() { | |
| 45 | + return columns; | |
| 46 | + }, | |
| 47 | + getOrderColumns: function() { | |
| 48 | + return orderColumns; | |
| 49 | + }, | |
| 30 | 50 | getSearchCondition: function() { |
| 31 | 51 | currentSearchCondition.page = currentPage.uiNumber - 1; |
| 32 | 52 | |
| ... | ... | @@ -34,6 +54,10 @@ angular.module('ScheduleApp').factory( |
| 34 | 54 | currentSearchCondition["cgsbm_in"] = UserPrincipal.getGsStrs().join(","); |
| 35 | 55 | } |
| 36 | 56 | |
| 57 | + // 重置排序字段条件 | |
| 58 | + currentSearchCondition.order = orderColumns.order; | |
| 59 | + currentSearchCondition.direction = orderColumns.direction; | |
| 60 | + | |
| 37 | 61 | return currentSearchCondition; |
| 38 | 62 | }, |
| 39 | 63 | getPage: function(page) { |
| ... | ... | @@ -92,7 +116,8 @@ angular.module('ScheduleApp').controller( |
| 92 | 116 | 'DeviceInfoManageListCtrl', |
| 93 | 117 | [ |
| 94 | 118 | 'DeviceInfoManageService', |
| 95 | - function(service) { | |
| 119 | + '$uibModal', | |
| 120 | + function(service, $uibModal) { | |
| 96 | 121 | var self = this; |
| 97 | 122 | var CarDevice = service.getQueryClass(); |
| 98 | 123 | |
| ... | ... | @@ -127,11 +152,55 @@ angular.module('ScheduleApp').controller( |
| 127 | 152 | |
| 128 | 153 | self.doPage(); |
| 129 | 154 | |
| 155 | + self.customOrder = function() { | |
| 156 | + // large方式弹出模态对话框 | |
| 157 | + var modalInstance = $uibModal.open({ | |
| 158 | + templateUrl: '/pages/scheduleApp/module/basicInfo/deviceInfoManage/orderOptionOpen.html', | |
| 159 | + size: "sm", | |
| 160 | + animation: true, | |
| 161 | + backdrop: 'static', | |
| 162 | + resolve: { | |
| 163 | + }, | |
| 164 | + windowClass: 'center-modal', | |
| 165 | + controller: "DeviceInfoManageListOrderOptionModalInstanceCtrl", | |
| 166 | + controllerAs: "$ctrl", | |
| 167 | + bindToController: true | |
| 168 | + }); | |
| 169 | + modalInstance.result.then( | |
| 170 | + function(result) { | |
| 171 | + console.log("dataImport.html打开"); | |
| 172 | + }, | |
| 173 | + function() { | |
| 174 | + console.log("dataImport.html消失"); | |
| 175 | + } | |
| 176 | + ); | |
| 177 | + }; | |
| 130 | 178 | |
| 131 | 179 | } |
| 132 | 180 | ] |
| 133 | 181 | ); |
| 134 | 182 | |
| 183 | +angular.module('ScheduleApp').controller( | |
| 184 | + "DeviceInfoManageListOrderOptionModalInstanceCtrl", | |
| 185 | + [ | |
| 186 | + "DeviceInfoManageService", | |
| 187 | + "$modalInstance", | |
| 188 | + function(service, $modalInstance) { | |
| 189 | + var self = this; | |
| 190 | + | |
| 191 | + self.columns = service.getColumns(); | |
| 192 | + self.orderColumns = service.getOrderColumns(); | |
| 193 | + | |
| 194 | + self.confirm = function(result) { | |
| 195 | + // console.log(result); | |
| 196 | + // console.log(service.getOrderColumns()); | |
| 197 | + $modalInstance.dismiss("cancel"); | |
| 198 | + | |
| 199 | + } | |
| 200 | + } | |
| 201 | + ] | |
| 202 | +); | |
| 203 | + | |
| 135 | 204 | // form.html控制器 |
| 136 | 205 | angular.module('ScheduleApp').controller( |
| 137 | 206 | 'DeviceInfoManageFormCtrl', | ... | ... |
src/main/resources/static/pages/scheduleApp/module/basicInfo/deviceInfoManage/orderOptionOpen.html
0 → 100644
| 1 | +<div class="modal-header"> | |
| 2 | + <div class="modal-title"> | |
| 3 | + <h3> | |
| 4 | + <i class="fa fa-sort-amount-asc" aria-hidden="true"></i> | |
| 5 | + <span class="caption-subject bold uppercase">排序字段选择</span> | |
| 6 | + </h3> | |
| 7 | + </div> | |
| 8 | +</div> | |
| 9 | +<div class="modal-body"> | |
| 10 | + <!--order={{$ctrl.orderColumns.order}}--> | |
| 11 | + <!--<br>--> | |
| 12 | + <!--direction={{$ctrl.orderColumns.direction}}--> | |
| 13 | + <sa-Orderoption name="orderOptions" columns="$ctrl.columns" ordercolumns="$ctrl.orderColumns"> | |
| 14 | + </sa-Orderoption> | |
| 15 | +</div> | |
| 16 | +<div class="modal-footer"> | |
| 17 | + <button class="btn btn-primary" ng-click="$ctrl.confirm($ctrl.orderColumns)">确定</button> | |
| 18 | +</div> | |
| 0 | 19 | \ No newline at end of file | ... | ... |
src/main/resources/static/pages/scheduleApp/module/basicInfo/deviceInfoManage/service.js
| ... | ... | @@ -2,7 +2,7 @@ |
| 2 | 2 | angular.module('ScheduleApp').factory('DeviceInfoManageService_g', ['$resource', function($resource) { |
| 3 | 3 | return $resource( |
| 4 | 4 | '/cde_sc/:id', |
| 5 | - {order: 'xl,isCancel,cl,qyrq', direction: 'ASC,ASC,ASC,DESC', id: '@id'}, | |
| 5 | + {order: 'xl,clZbh,qyrq', direction: 'ASC,ASC,DESC', id: '@id'}, | |
| 6 | 6 | { |
| 7 | 7 | list: { |
| 8 | 8 | method: 'GET', | ... | ... |
src/main/resources/static/pages/scheduleApp/module/common/dts2/queryOption/saOrderOption.js
0 → 100644
| 1 | +/** | |
| 2 | + * saOrderoption指令,搜索时的排序选项(在搜索时可以使用,通用的) | |
| 3 | + * 属性如下: | |
| 4 | + * name(必须):控件的名字 | |
| 5 | + * columns(必须,独立作用域):字段名字列表,格式:[{name:[字段名],desc:[字段描述]}...] | |
| 6 | + * ordercolumns(必须,独立作用域):字段排序列表,格式:{order: '字段1,字段2',direction: 'ASC,DESC'} | |
| 7 | + */ | |
| 8 | +angular.module('ScheduleApp').directive( | |
| 9 | + 'saOrderoption', | |
| 10 | + [ | |
| 11 | + function() { | |
| 12 | + return { | |
| 13 | + restrict: 'E', | |
| 14 | + templateUrl: '/pages/scheduleApp/module/common/dts2/queryOption/saOrderOptionTemplate.html', | |
| 15 | + scope: { | |
| 16 | + columns: '=', | |
| 17 | + ordercolumns: '=' | |
| 18 | + }, | |
| 19 | + controllerAs: '$saOrderOptionCtrl', | |
| 20 | + bindToController: true, | |
| 21 | + controller: function() { | |
| 22 | + var self = this; | |
| 23 | + | |
| 24 | + // 字段列表是否预载入 | |
| 25 | + self.$$columns_loaded = false; | |
| 26 | + // 字段排序是否预载入 | |
| 27 | + self.$$ordercolumns_loaded = false; | |
| 28 | + | |
| 29 | + | |
| 30 | + // 每组选项内部数据源 | |
| 31 | + // 格式:[{column:[选中的字段名],dir:[ASC/DESC]}] | |
| 32 | + self.$$selectgroupds = []; | |
| 33 | + | |
| 34 | + // TODO:选择事件 | |
| 35 | + | |
| 36 | + self.$$select_column_change = function() { | |
| 37 | + self.$$refresh_selectgroupds(); | |
| 38 | + }; | |
| 39 | + | |
| 40 | + self.$$select_dir_change = function() { | |
| 41 | + self.$$refresh_selectgroupds(); | |
| 42 | + }; | |
| 43 | + | |
| 44 | + self.$$add_option_click = function(index) { | |
| 45 | + self.$$selectgroupds.splice(index, 0, { | |
| 46 | + column: self.columns[0].name, | |
| 47 | + dir: "ASC" | |
| 48 | + }); | |
| 49 | + self.$$refresh_selectgroupds(); | |
| 50 | + }; | |
| 51 | + self.$$del_option_click = function(index) { | |
| 52 | + self.$$selectgroupds.splice(index, 1); | |
| 53 | + self.$$refresh_selectgroupds(); | |
| 54 | + }; | |
| 55 | + | |
| 56 | + // 刷新选项内部数据源 | |
| 57 | + self.$$refresh_selectgroupds = function() { | |
| 58 | + if (!self.$$columns_loaded || !self.$$ordercolumns_loaded || self.columns.length == 0) { | |
| 59 | + // 没有载入完成,或者字段列表为空 | |
| 60 | + return; | |
| 61 | + } | |
| 62 | + | |
| 63 | + if (self.$$selectgroupds.length == 0) { // 默认添加一组排序 | |
| 64 | + self.$$selectgroupds.push({ | |
| 65 | + column: self.columns[0].name, | |
| 66 | + dir: "ASC" | |
| 67 | + }); | |
| 68 | + } | |
| 69 | + | |
| 70 | + // 重新计算ordercolumns | |
| 71 | + | |
| 72 | + var aColumn = []; | |
| 73 | + var aDir = []; | |
| 74 | + for (var i = 0; i < self.$$selectgroupds.length; i++) { | |
| 75 | + aColumn.push(self.$$selectgroupds[i].column); | |
| 76 | + aDir.push(self.$$selectgroupds[i].dir); | |
| 77 | + } | |
| 78 | + if (self.ordercolumns) { | |
| 79 | + self.ordercolumns.order = aColumn.join(","); | |
| 80 | + self.ordercolumns.direction = aDir.join(","); | |
| 81 | + } else { | |
| 82 | + self.ordercolumns = {order: aColumn.join(","), direction: aDir.join(",")} | |
| 83 | + } | |
| 84 | + | |
| 85 | + } | |
| 86 | + }, | |
| 87 | + compile: function(tElem, tAttrs) { | |
| 88 | + // 获取所有属性,并验证 | |
| 89 | + var $name_attr = tAttrs['name']; // 控件的名字 | |
| 90 | + if (!$name_attr) { | |
| 91 | + throw "必须有名称属性"; | |
| 92 | + } | |
| 93 | + | |
| 94 | + // controlAs名字 | |
| 95 | + var ctrlAs = '$saOrderOptionCtrl'; | |
| 96 | + | |
| 97 | + // TODO: | |
| 98 | + | |
| 99 | + | |
| 100 | + | |
| 101 | + return { | |
| 102 | + pre: function(scope, element, attr) { | |
| 103 | + | |
| 104 | + }, | |
| 105 | + | |
| 106 | + post: function(scope, element, attr) { | |
| 107 | + | |
| 108 | + //--------------------- 监控属性方法 -------------------// | |
| 109 | + // 监控字段名字列表 | |
| 110 | + scope.$watch( | |
| 111 | + function() { | |
| 112 | + return scope[ctrlAs].columns; | |
| 113 | + }, | |
| 114 | + function(newValue, oldValue) { | |
| 115 | + if (!scope[ctrlAs].$$columns_loaded) { | |
| 116 | + // TODO:格式判定以后做,假设格式是对的 | |
| 117 | + | |
| 118 | + | |
| 119 | + } | |
| 120 | + | |
| 121 | + scope[ctrlAs].$$columns_loaded = true; | |
| 122 | + scope[ctrlAs].$$refresh_selectgroupds(); | |
| 123 | + }, | |
| 124 | + true | |
| 125 | + ); | |
| 126 | + // 监控字段排序列表 | |
| 127 | + scope.$watch( | |
| 128 | + function() { | |
| 129 | + return scope[ctrlAs].ordercolumns; | |
| 130 | + }, | |
| 131 | + function(newValue, oldValue) { | |
| 132 | + if (!scope[ctrlAs].$$ordercolumns_loaded) { | |
| 133 | + if (newValue) { | |
| 134 | + var aColumns = []; // 排序的字段 | |
| 135 | + var aDirs = []; // 排序字段对应的排序方向 | |
| 136 | + | |
| 137 | + if (newValue.order) { | |
| 138 | + aColumns = newValue.order.split(","); | |
| 139 | + } | |
| 140 | + if (newValue.direction) { | |
| 141 | + aDirs = newValue.direction.split(","); | |
| 142 | + } | |
| 143 | + | |
| 144 | + for (var i = 0; i < aColumns.length; i++) { | |
| 145 | + if (i < aDirs.length) { | |
| 146 | + scope[ctrlAs].$$selectgroupds.push({ | |
| 147 | + column: aColumns[i], | |
| 148 | + dir: aDirs[i] | |
| 149 | + }); | |
| 150 | + } else { | |
| 151 | + scope[ctrlAs].$$selectgroupds.push({ | |
| 152 | + column: aColumns[i], | |
| 153 | + dir: 'ASC' | |
| 154 | + }); | |
| 155 | + } | |
| 156 | + } | |
| 157 | + } | |
| 158 | + } | |
| 159 | + scope[ctrlAs].$$ordercolumns_loaded = true; | |
| 160 | + scope[ctrlAs].$$refresh_selectgroupds(); | |
| 161 | + | |
| 162 | + }, | |
| 163 | + true | |
| 164 | + ); | |
| 165 | + } | |
| 166 | + | |
| 167 | + }; | |
| 168 | + } | |
| 169 | + }; | |
| 170 | + } | |
| 171 | + ] | |
| 172 | +); | |
| 0 | 173 | \ No newline at end of file | ... | ... |
src/main/resources/static/pages/scheduleApp/module/common/dts2/queryOption/saOrderOptionTemplate.html
0 → 100644
| 1 | +<style> | |
| 2 | + .option_panel { | |
| 3 | + height: 100%; | |
| 4 | + margin: 0; | |
| 5 | + padding: 0; | |
| 6 | + } | |
| 7 | + .option_panel .detail-wrap { | |
| 8 | + padding: 0; | |
| 9 | + max-height: 300px; | |
| 10 | + border: 1px solid #ddd; | |
| 11 | + background: #fafafa; | |
| 12 | + border-radius: 10px !important; | |
| 13 | + moz-user-select: -moz-none; | |
| 14 | + -moz-user-select: none; | |
| 15 | + -o-user-select: none; | |
| 16 | + -khtml-user-select: none; | |
| 17 | + -webkit-user-select: none; | |
| 18 | + -ms-user-select: none; | |
| 19 | + user-select: none; | |
| 20 | + overflow: auto; | |
| 21 | + } | |
| 22 | + | |
| 23 | + .option_panel .detail-wrap > .option { | |
| 24 | + margin-top: 5px; | |
| 25 | + } | |
| 26 | + | |
| 27 | + .option_panel .detail-wrap > .option:nth-last-child(1) { | |
| 28 | + margin-bottom: 5px; | |
| 29 | + } | |
| 30 | + | |
| 31 | + .option_panel .detail-wrap > .option .option_column { | |
| 32 | + padding-left: 3px; | |
| 33 | + padding-right: 5px; | |
| 34 | + } | |
| 35 | + .option_panel .detail-wrap > .option .option_dir { | |
| 36 | + padding-left: 0px; | |
| 37 | + padding-right: 5px; | |
| 38 | + } | |
| 39 | + .option_panel .detail-wrap > .option .option_opt { | |
| 40 | + width: 70px; | |
| 41 | + padding-left: 0px; | |
| 42 | + padding-right: 0px; | |
| 43 | + } | |
| 44 | + | |
| 45 | + .option_panel .detail-wrap .option .form-control { | |
| 46 | + font-size: 10px; | |
| 47 | + } | |
| 48 | + | |
| 49 | + | |
| 50 | + .option_scrollbar::-webkit-scrollbar { | |
| 51 | + width: 18px; | |
| 52 | + height: 18px; | |
| 53 | + } | |
| 54 | + | |
| 55 | + .option_scrollbar::-webkit-scrollbar-track, ::-webkit-scrollbar-thumb { | |
| 56 | + border-radius: 999px; | |
| 57 | + border: 5px solid transparent; | |
| 58 | + } | |
| 59 | + | |
| 60 | + .option_scrollbar::-webkit-scrollbar-track { | |
| 61 | + box-shadow: 1px 1px 5px rgba(0, 0, 0, .2) inset; | |
| 62 | + } | |
| 63 | + | |
| 64 | + .option_scrollbar::-webkit-scrollbar-thumb { | |
| 65 | + min-height: 20px; | |
| 66 | + background-clip: content-box; | |
| 67 | + box-shadow: 0 0 0 5px rgba(0, 0, 0, .2) inset; | |
| 68 | + } | |
| 69 | + | |
| 70 | + .option_scrollbar::-webkit-scrollbar-corner { | |
| 71 | + background: transparent; | |
| 72 | + } | |
| 73 | + | |
| 74 | +</style> | |
| 75 | + | |
| 76 | +<div> | |
| 77 | + <div class="option_panel"> | |
| 78 | + <div class="detail-wrap option_scrollbar"> | |
| 79 | + | |
| 80 | + <div class="col-md-12 option" ng-repeat="$option in $saOrderOptionCtrl.$$selectgroupds track by $index" ng-init="rowIndex = $index"> | |
| 81 | + <div class="col-md-5 option_column"> | |
| 82 | + <select class="form-control aria-invalid="false" ng-model="$option.column" ng-change="$saOrderOptionCtrl.$$select_column_change()"> | |
| 83 | + <option ng-repeat="$column in $saOrderOptionCtrl.columns track by $index" | |
| 84 | + ng-init="colIndex = $index" | |
| 85 | + ng-selected="$option.column==$column.name" | |
| 86 | + value="{{$column.name}}"> | |
| 87 | + {{$column.desc}} | |
| 88 | + </option> | |
| 89 | + </select> | |
| 90 | + </div> | |
| 91 | + <div class="col-md-3 option_dir"> | |
| 92 | + <select class="form-control aria-invalid="false" ng-model="$option.dir" ng-change="$saOrderOptionCtrl.$$select_dir_change()"> | |
| 93 | + <option value="ASC" ng-selected="$option.dir=='ASC'">升序</option> | |
| 94 | + <option value="DESC" ng-selected="$option.dir=='DESC'">降序</option> | |
| 95 | + </select> | |
| 96 | + </div> | |
| 97 | + <div class="col-md-3 btn-group option_opt"> | |
| 98 | + <button type="button" class="btn btn-default" ng-click="$saOrderOptionCtrl.$$add_option_click(rowIndex)">+</button> | |
| 99 | + <button type="button" class="btn btn-default" ng-click="$saOrderOptionCtrl.$$del_option_click(rowIndex)">-</button> | |
| 100 | + </div> | |
| 101 | + | |
| 102 | + </div> | |
| 103 | + | |
| 104 | + | |
| 105 | + </div> | |
| 106 | + | |
| 107 | + | |
| 108 | + </div> | |
| 109 | + | |
| 110 | +</div> | |
| 0 | 111 | \ No newline at end of file | ... | ... |
src/main/resources/static/pages/scheduleApp/module/common/prj-common-directive.js
| ... | ... | @@ -4451,6 +4451,178 @@ angular.module('ScheduleApp').directive( |
| 4451 | 4451 | } |
| 4452 | 4452 | ] |
| 4453 | 4453 | ); |
| 4454 | +/** | |
| 4455 | + * saOrderoption指令,搜索时的排序选项(在搜索时可以使用,通用的) | |
| 4456 | + * 属性如下: | |
| 4457 | + * name(必须):控件的名字 | |
| 4458 | + * columns(必须,独立作用域):字段名字列表,格式:[{name:[字段名],desc:[字段描述]}...] | |
| 4459 | + * ordercolumns(必须,独立作用域):字段排序列表,格式:{order: '字段1,字段2',direction: 'ASC,DESC'} | |
| 4460 | + */ | |
| 4461 | +angular.module('ScheduleApp').directive( | |
| 4462 | + 'saOrderoption', | |
| 4463 | + [ | |
| 4464 | + function() { | |
| 4465 | + return { | |
| 4466 | + restrict: 'E', | |
| 4467 | + templateUrl: '/pages/scheduleApp/module/common/dts2/queryOption/saOrderOptionTemplate.html', | |
| 4468 | + scope: { | |
| 4469 | + columns: '=', | |
| 4470 | + ordercolumns: '=' | |
| 4471 | + }, | |
| 4472 | + controllerAs: '$saOrderOptionCtrl', | |
| 4473 | + bindToController: true, | |
| 4474 | + controller: function() { | |
| 4475 | + var self = this; | |
| 4476 | + | |
| 4477 | + // 字段列表是否预载入 | |
| 4478 | + self.$$columns_loaded = false; | |
| 4479 | + // 字段排序是否预载入 | |
| 4480 | + self.$$ordercolumns_loaded = false; | |
| 4481 | + | |
| 4482 | + | |
| 4483 | + // 每组选项内部数据源 | |
| 4484 | + // 格式:[{column:[选中的字段名],dir:[ASC/DESC]}] | |
| 4485 | + self.$$selectgroupds = []; | |
| 4486 | + | |
| 4487 | + // TODO:选择事件 | |
| 4488 | + | |
| 4489 | + self.$$select_column_change = function() { | |
| 4490 | + self.$$refresh_selectgroupds(); | |
| 4491 | + }; | |
| 4492 | + | |
| 4493 | + self.$$select_dir_change = function() { | |
| 4494 | + self.$$refresh_selectgroupds(); | |
| 4495 | + }; | |
| 4496 | + | |
| 4497 | + self.$$add_option_click = function(index) { | |
| 4498 | + self.$$selectgroupds.splice(index, 0, { | |
| 4499 | + column: self.columns[0].name, | |
| 4500 | + dir: "ASC" | |
| 4501 | + }); | |
| 4502 | + self.$$refresh_selectgroupds(); | |
| 4503 | + }; | |
| 4504 | + self.$$del_option_click = function(index) { | |
| 4505 | + self.$$selectgroupds.splice(index, 1); | |
| 4506 | + self.$$refresh_selectgroupds(); | |
| 4507 | + }; | |
| 4508 | + | |
| 4509 | + // 刷新选项内部数据源 | |
| 4510 | + self.$$refresh_selectgroupds = function() { | |
| 4511 | + if (!self.$$columns_loaded || !self.$$ordercolumns_loaded || self.columns.length == 0) { | |
| 4512 | + // 没有载入完成,或者字段列表为空 | |
| 4513 | + return; | |
| 4514 | + } | |
| 4515 | + | |
| 4516 | + if (self.$$selectgroupds.length == 0) { // 默认添加一组排序 | |
| 4517 | + self.$$selectgroupds.push({ | |
| 4518 | + column: self.columns[0].name, | |
| 4519 | + dir: "ASC" | |
| 4520 | + }); | |
| 4521 | + } | |
| 4522 | + | |
| 4523 | + // 重新计算ordercolumns | |
| 4524 | + | |
| 4525 | + var aColumn = []; | |
| 4526 | + var aDir = []; | |
| 4527 | + for (var i = 0; i < self.$$selectgroupds.length; i++) { | |
| 4528 | + aColumn.push(self.$$selectgroupds[i].column); | |
| 4529 | + aDir.push(self.$$selectgroupds[i].dir); | |
| 4530 | + } | |
| 4531 | + if (self.ordercolumns) { | |
| 4532 | + self.ordercolumns.order = aColumn.join(","); | |
| 4533 | + self.ordercolumns.direction = aDir.join(","); | |
| 4534 | + } else { | |
| 4535 | + self.ordercolumns = {order: aColumn.join(","), direction: aDir.join(",")} | |
| 4536 | + } | |
| 4537 | + | |
| 4538 | + } | |
| 4539 | + }, | |
| 4540 | + compile: function(tElem, tAttrs) { | |
| 4541 | + // 获取所有属性,并验证 | |
| 4542 | + var $name_attr = tAttrs['name']; // 控件的名字 | |
| 4543 | + if (!$name_attr) { | |
| 4544 | + throw "必须有名称属性"; | |
| 4545 | + } | |
| 4546 | + | |
| 4547 | + // controlAs名字 | |
| 4548 | + var ctrlAs = '$saOrderOptionCtrl'; | |
| 4549 | + | |
| 4550 | + // TODO: | |
| 4551 | + | |
| 4552 | + | |
| 4553 | + | |
| 4554 | + return { | |
| 4555 | + pre: function(scope, element, attr) { | |
| 4556 | + | |
| 4557 | + }, | |
| 4558 | + | |
| 4559 | + post: function(scope, element, attr) { | |
| 4560 | + | |
| 4561 | + //--------------------- 监控属性方法 -------------------// | |
| 4562 | + // 监控字段名字列表 | |
| 4563 | + scope.$watch( | |
| 4564 | + function() { | |
| 4565 | + return scope[ctrlAs].columns; | |
| 4566 | + }, | |
| 4567 | + function(newValue, oldValue) { | |
| 4568 | + if (!scope[ctrlAs].$$columns_loaded) { | |
| 4569 | + // TODO:格式判定以后做,假设格式是对的 | |
| 4570 | + | |
| 4571 | + | |
| 4572 | + } | |
| 4573 | + | |
| 4574 | + scope[ctrlAs].$$columns_loaded = true; | |
| 4575 | + scope[ctrlAs].$$refresh_selectgroupds(); | |
| 4576 | + }, | |
| 4577 | + true | |
| 4578 | + ); | |
| 4579 | + // 监控字段排序列表 | |
| 4580 | + scope.$watch( | |
| 4581 | + function() { | |
| 4582 | + return scope[ctrlAs].ordercolumns; | |
| 4583 | + }, | |
| 4584 | + function(newValue, oldValue) { | |
| 4585 | + if (!scope[ctrlAs].$$ordercolumns_loaded) { | |
| 4586 | + if (newValue) { | |
| 4587 | + var aColumns = []; // 排序的字段 | |
| 4588 | + var aDirs = []; // 排序字段对应的排序方向 | |
| 4589 | + | |
| 4590 | + if (newValue.order) { | |
| 4591 | + aColumns = newValue.order.split(","); | |
| 4592 | + } | |
| 4593 | + if (newValue.direction) { | |
| 4594 | + aDirs = newValue.direction.split(","); | |
| 4595 | + } | |
| 4596 | + | |
| 4597 | + for (var i = 0; i < aColumns.length; i++) { | |
| 4598 | + if (i < aDirs.length) { | |
| 4599 | + scope[ctrlAs].$$selectgroupds.push({ | |
| 4600 | + column: aColumns[i], | |
| 4601 | + dir: aDirs[i] | |
| 4602 | + }); | |
| 4603 | + } else { | |
| 4604 | + scope[ctrlAs].$$selectgroupds.push({ | |
| 4605 | + column: aColumns[i], | |
| 4606 | + dir: 'ASC' | |
| 4607 | + }); | |
| 4608 | + } | |
| 4609 | + } | |
| 4610 | + } | |
| 4611 | + } | |
| 4612 | + scope[ctrlAs].$$ordercolumns_loaded = true; | |
| 4613 | + scope[ctrlAs].$$refresh_selectgroupds(); | |
| 4614 | + | |
| 4615 | + }, | |
| 4616 | + true | |
| 4617 | + ); | |
| 4618 | + } | |
| 4619 | + | |
| 4620 | + }; | |
| 4621 | + } | |
| 4622 | + }; | |
| 4623 | + } | |
| 4624 | + ] | |
| 4625 | +); | |
| 4454 | 4626 | /** |
| 4455 | 4627 | * saScpdate指令(非通用指令,只在排班计划form中使用)。 |
| 4456 | 4628 | * 属性如下: | ... | ... |
src/main/resources/static/pages/scheduleApp/module/common/prj-common-globalservice.js
| ... | ... | @@ -84,7 +84,7 @@ angular.module('ScheduleApp').factory( |
| 84 | 84 | angular.module('ScheduleApp').factory('DeviceInfoManageService_g', ['$resource', function($resource) { |
| 85 | 85 | return $resource( |
| 86 | 86 | '/cde_sc/:id', |
| 87 | - {order: 'xl,isCancel,cl,qyrq', direction: 'ASC,ASC,ASC,DESC', id: '@id'}, | |
| 87 | + {order: 'xl,clZbh,qyrq', direction: 'ASC,ASC,DESC', id: '@id'}, | |
| 88 | 88 | { |
| 89 | 89 | list: { |
| 90 | 90 | method: 'GET', | ... | ... |