angular.module('app') .directive('devManage', ['$filter', '$http', '$stateParams', '$timeout', 'uiGridConstants', 'i18nService', 'toaster', 'QRCodeOptions', '$rootScope', '$localStorage', function ($filter, $http, $stateParams, $timeout, uiGridConstants, i18nService, toaster, QRCodeOptions, $rootScope, $localStorage) { return { restrict: 'AEC', templateUrl: 'js/directives/tpl/devManage.html', // 独立作用域,并暴露配置属性 scope: {}, link: function ($scope, el, attrs) { i18nService.setCurrentLang("zh-cn");//汉化 moment.locale('zh-cn'); var dealerId = ""; var searchKey = ""; function initDevList() { //可能是由路由跳转,则获取url参数 if ($stateParams.dealerId) { $scope.dealerId = dealerId = $stateParams.dealerId; } if ($stateParams.searchKey) { searchKey = $stateParams.searchKey; } // 更新查询条件到界面 condition.searchKey = searchKey; setColumnDefs(); initDataGrid(); } $scope.$on('initDevList', function (evt, data) { //先获取广播参数 if (data && data.dealerId) { $scope.dealerId = dealerId = data.dealerId; } if (data && data.searchKey) { searchKey = data.searchKey || ""; } initDevList(); }); $scope.gridOptions = { data: 'myData', showGridFooter: true, //是否显示grid footer // rowHeight: 80, //-------- 分页属性 ---------------- paginationPageSizes: [10, 20, 50, 100], //每页显示个数可选项 paginationCurrentPage: 1, //当前页码 paginationPageSize: 10, //每页显示个数 totalItems: 0,// 总数量 useExternalPagination: true,//是否使用分页按钮 //过滤 // enableFiltering: true, columnDefs: [], //---------------api--------------------- onRegisterApi: function (gridApi) { $scope.gridApi = gridApi; gridApi.pagination.on.paginationChanged($scope, function (newPage, pageSize) { if ($scope.setPagingData) { $scope.getPagedDataAsync(newPage, pageSize); } }); } }; //查询条件 var condition = $scope.condition = { searchKey: searchKey, startLogicalCode: '', endLogicalCode: '', }; //枚举常量 $scope.enum = {}; //事件 $scope.event = { search: function () { dealerId = "";//清空跳转带入的条件 $scope.getPagedDataAsync(1, $scope.gridOptions.paginationPageSize); } }; //截止日期选择 $scope.dateOptions = { formatYear: 'yy', startingDay: 1, class: 'datepicker' }; $scope.expireDate = null; $scope.format = 'yyyy-MM-dd'; $scope.minDate = new Date(); var maxDate = new Date(); $scope.maxDate = maxDate.setFullYear(maxDate.getFullYear() + 10); $scope.opened = true; $scope.open = function ($event) { $event.preventDefault(); $event.stopPropagation(); $scope.opened = true; }; function setColumnDefs() { var cols = $scope.gridOptions.columnDefs = [ {field: 'logicalCode', displayName: '逻辑编号'}, {field: 'devType', displayName: '设备类型'}, { field: 'imei', displayName: '电子标签', minWidth: 160, cellTemplate: '
' }, { field: 'createdTime', displayName: '注册时间', width: 160, cellTemplate: '
' }, { field: 'dealerName', displayName: '商户', minWidth: 160, cellTemplate: '
' }, { field: 'address', displayName: '设备地址', minWidth: 160, cellTemplate: '
' }, { field: 'serverAddress', displayName: '服务器', }, { field: 'online', displayName: '设备状态', cellTemplate: '
{{row.entity.online}}
' }, { field: 'lastOffTime', displayName: '最近离线时间', cellTemplate: '
', width: 160 }, { field: 'signal', displayName: '信号', cellTemplate: '
' }, { field: 'detail', displayName: '详细信息', cellTemplate: '
{{row.entity.detail}}
' } ]; var feature_map = $scope.feature_map = $localStorage.feature_map if (feature_map && feature_map.disableDevice) { cols.push( { field: 'disableDevice', displayName: '禁用状态', cellTemplate: '
{{row.entity.disableDevice?\'已禁用\':\'已启用\'}}
' } ) } cols.push({ field: 'oper', displayName: '操作', enableFiltering: false, enableSorting: false, enableHiding: false,//禁止在列选择器中隐藏 enableColumnMenu: false,// 是否显示列头部菜单按钮 width: 450, cellTemplate: '
' + '' + '' + '' + '' + ((feature_map && feature_map.disableDevice) ? ('') : ('')) + '' + '
' }) var fields = $scope.gridOptions.columnDefs; for (var index in fields) { var item = fields[index]; if (item && item['minWidth'] == null) { item['minWidth'] = 100; } } } $scope.refreshSignal = function (entity) { $http.get('/device/sendSignal', { params: {logicalCode: entity.logicalCode} }).then(function (data) { data = data.data if (data.result == 1) { var signal = data.para; entity.signal = signal; if (entity.signal == 0) { toaster.pop("info", "设备离线!"); } } }).catch(function (data) { toaster.pop("error", "提示", "操作失败!"); }); }; $scope.setPagingData = function (data, curPage, pageSize) { var firstRow = (curPage - 1) * pageSize; var pagedData = data.data.dataList; $scope.myData = pagedData; $scope.gridOptions.totalItems = data.data.total; }; $scope.getPagedDataAsync = function (curPage, pageSize) { if ($scope.gridOptionsLoading) { return; } var params = { pageSize: pageSize, pageIndex: curPage }; if (condition.searchKey != "") { params.searchKey = condition.searchKey } if (condition.startLogicalCode != "") { params.startLogicalCode = condition.startLogicalCode } if (condition.endLogicalCode != "") { params.endLogicalCode = condition.endLogicalCode } if (dealerId) { params.dealerId = dealerId; } $scope.gridOptionsLoading = true; $http.get('/manager/getDevDetailList', { params: params }).then(function (data) { data = data.data $scope.gridOptionsLoading = false; $scope.setPagingData(data, curPage, pageSize); setTimeout(function () { $(window).trigger("resize"); }, 50); }).catch(function (data) { toaster.pop("error", "提示", "获取数据列表失败"); }); }; function initDataGrid() { //首次加载表格 $scope.getPagedDataAsync($scope.gridOptions.paginationCurrentPage, $scope.gridOptions.paginationPageSize); } if (attrs.autoInit !== "false") { initDevList(); } //展示详情 $scope.showInfoDetail = function (title, content) { var data = $.extend(true, {}, JSON.parse(content.detail)) $scope.infoDetail = { title: title, content: data }; $(".devManageMain #detailInfoPanel").modal(); }; $scope.closeDetailInfoPanel = function () { $(".devManageMain #detailInfoPanel").modal("hide"); }; var dialogData = $scope.dialogData = {}; //发送指令 $scope.sendCommand = function (entity) { $scope.commandInfoPanel.$setPristine(); $scope.commandInfoPanel.$setUntouched(); $http.get('/manager/getCommandByDevice', { params: {logicalCode: entity.logicalCode} }).then(function (data) { data = data.data if (data.result == 1) { dialogData.commandList = data.payload.dataList $scope.currentCmdIndex = -1 $scope.currentCmd = null; } }).catch(function (data) { toaster.pop("error", "提示", "获取常用命令列表失败"); }); $(".devManageMain #commandInfoPanel").modal(); }; $scope.selectCommand = function (index, item) { $scope.currentCmdIndex = index $scope.currentCmd = item; }; //确认发送指令 $scope.sendCommandConfirm = function () { if ($scope.commandInfoPanel.$invalid) { return; } var currentCmd = $scope.currentCmd if(!$scope.currentCmd.id){ toaster.pop("info", "提示", "请选择指令!"); return } var params = [] for(var index in currentCmd.params) { var item = currentCmd.params[index] params.push({ id: item.id, default: item.default, }) } $http({ method: 'POST', url: '/manager/sendCommand', data: {id: currentCmd.id, devNo: currentCmd.IMEI, params: params} }).then(function (response) { var data = response.data; if (data.result == 1) { toaster.pop("success", "提示", "操作成功!"); $scope.currentResult = JSON.parse(data.data); } }, function (response) { toaster.pop("error", "提示", "操作失败!"); }); }; $scope.closeCommandPanel = function () { $(".devManageMain #commandInfoPanel").modal("hide"); delete dialogData.command; }; // 查看端口信息 $scope.portList = []; $scope.onOpenPort = function (entity) { $(".devManageMain #portInfoPanel").modal(); $http.get('/device/getDevicePort', { params: {logicalCode: entity.logicalCode} }).then(function (response) { let data = response.data; let payload = data.payload; $scope.portList = payload.portList || []; }).catch(function (data) { toaster.pop("error", "提示", "获取端口信息失败!"); }); }; $scope.closePortInfoPanel = function () { $(".devManageMain #portInfoPanel").modal("hide"); }; $scope.qiangStatusMap = { yes: '是', no: '否', unknow: '未知' } $scope.getPayTypeEnum = function (item, type) { // 单位后台确定 var payTypeEnum = { 'mobile': '扫码付费' + (item.coins || 0), 'mobile_vcard': '虚拟卡抵扣', 'monthlyPackage': '包月卡抵扣', 'coin': '投币' + (item.coins || 0), 'card': '刷卡' + (item.coins || 0), 'serverBilling': '后台计费', 'powerBilling': '功率计费', 'postpaid': '后付费', null: "未知" } return payTypeEnum[type] } $scope.getPortStatusDom = function (status) { var statusMap = { // 这三个状态根据配置来确定是否可用 idle: { name: '空闲', style: 'text-success' }, busy: { name: '繁忙', style: 'text-warning' }, finished: { name: '完成', style: 'text-success' }, connected: { name: '连接', style: 'text-warning' }, // 以下两个状态 完全不能用 fault: { name: '故障', style: 'text-danger' }, ban: { name: '禁用', style: 'font-4' }, estop: { name: '急停状态', style: 'text-danger' }, ready: { name: '就绪', style: 'text-warning' }, // 0:'空闲', // 1:'繁忙', // 2:'故障', // 3:'禁用', // 4:'暂停', // 5:'已连接', // 6:'充电完成', // 7:'维护中', // 8:'预约中', 0: { name: '空闲', style: 'text-success' }, 1: { name: '繁忙', style: 'text-warning' }, 2: { name: '故障', style: 'text-danger' }, 3: { name: '禁用', style: 'text-danger' }, 4: { name: '暂停', style: 'text-warning' }, 5: { name: '已连接', style: 'text-success' }, 6: { name: '充电完成', style: 'text-success' }, 7: { name: '维护中', style: 'text-danger' }, 8: { name: '预约中', style: 'text-danger' }, 10: { name: '占位状态', style: 'text-warning' }, 11: { name: '急停状态', style: 'text-danger' }, 12: { name: '就绪', style: 'text-success' }, 13: { name: '继电器粘连', style: 'text-danger' }, } var item = statusMap[status] // 普通充电桩 if (item) { return "" + item.name + "" } else { return "未知" } } // 切换禁用状态 $scope.disableDeviceToggle = function (entity) { $http.get('/manager/disableDevice', { params: {logicalCode: entity.logicalCode, disable: !entity.disableDevice} }).then(function (data) { data = data.data if (data.result == 1) { entity.disableDevice = !entity.disableDevice toaster.pop("success", "操作成功!"); } }).catch(function (data) { toaster.pop("error", "提示", "操作失败!"); }); }; function getSelectRows() { var rows = $scope.gridApi.selection.getSelectedRows(); if (rows.length === 0) { toaster.pop("info", "提示", "请选择数据!"); return false; } var ids = []; for (var i = 0; i < rows.length; i++) { ids.push(rows[i].logicalCode); } $scope.selectedIds = ids; return ids } // 禁用启用选中设备 $scope.disableDeviceSelected = function (target) { var ids = getSelectRows() if (ids) { $http.post('/manager/disableSelectedDevice', { logicalCode: ids, disable: target }).then(function (data) { toaster.pop("success", "操作成功!"); $scope.getPagedDataAsync($scope.gridOptions.paginationCurrentPage, $scope.gridOptions.paginationPageSize); }).catch(function (data) { toaster.pop("error", "提示", "操作失败!"); }); } }; // 禁用启用全部设备 $scope.disableAllDevice = function (target) { $http.post('/manager/disableAllDevice', { disable: target, dealerId: $scope.dealerId }).then(function (data) { toaster.pop("success", "操作成功!"); $scope.getPagedDataAsync($scope.gridOptions.paginationCurrentPage, $scope.gridOptions.paginationPageSize); }).catch(function (data) { toaster.pop("error", "提示", "操作失败!"); }); }; $scope.getQRCode = function (entity) { $(".devManageMain #devQRCodePanel").modal(); var currentDomain = location.protocol + "//" + location.host; var dataURL = QRCodeOptions.getQRCodeImageData({ text: currentDomain + "/userLogin?l=" + entity.logicalCode, label: entity.logicalCode, // logoDom: $("#qrcodeOptPreviewLogo")[0] }); $(".devManageMain #previewImg").attr({ "width": 200, "height": 240, "src": dataURL }); }; $scope.closeQRCode = function () { $(".devManageMain #devQRCodePanel").modal('hide'); }; /*********设备参数配置*************/ //弹窗内部折叠状态 $scope.devParamDialogStatus = { open1: true, open2: true, open3: true, }; var logicalCode; $scope.openDeviceFunctionParam = function (entity) { //重置表单状态 $scope.devParamForm.$setPristine(); $scope.devParamForm.$setUntouched(); logicalCode = entity.logicalCode; //目前只有沥森 100500 需要这么设置 $(".devManageMain #devParamPanel").modal(); $scope.devParamDialogData = {} //非沥森 待实现 todo if (entity.code != 100500) { var url = "/device/getDeviceFunction"; $http({ method: 'POST', url: url, data: {id: entity.id} }).then(function (response) { var data = response.data if (data.result == 1) { $scope.devParamDialogData = data.payload; } }, function (response) { toaster.pop("error", "提示", "获取失败!"); }); } }; $scope.getDevParam = function (key) { var url = "/device/getDeviceFunctionByKey"; $http({ method: 'POST', url: url, data: {key: key, logicalCode: logicalCode} }).then(function (response) { var data = response.data if (data.result == 1) { $scope.devParamDialogData[key] = data.payload[key]; $(".devManageMain #devParamPanel").modal(); } }, function (response) { toaster.pop("error", "提示", "获取失败!"); }); } $scope.setDevParam = function (key) { var url = "/device/setDeviceFunctionByKey"; if ($scope.devParamDialogData[key] == null || $scope.devParamDialogData[key] == '') { toaster.pop("warning", "请填写正确的数据。"); return } var data = { logicalCode: logicalCode, config: {} }; data.config[key] = $scope.devParamDialogData[key] $http({ method: 'POST', url: url, data: data }).then(function (response) { toaster.pop("success", "提示", "设置成功!"); }, function (response) { toaster.pop("error", "提示", "保存失败!"); }); } $scope.closeDevParam = function () { $('.devManageMain #devParamPanel').modal('hide'); } /********************设备端口充电状态变化曲线*****************************/ $scope.realtimeConfig = { startTimeOpen: false, endTimeOpen: false, timeChange: function () { this.startTimeOpen = false this.endTimeOpen = false } } $scope.realtimeEnity = null; $scope.realtimeCondition = { // 默认今天,后台需要 智能采样 优化性能 startTime: moment().format("YYYY-MM-DD"), endTime: moment().format("YYYY-MM-DD"), port: 1,// 默认为1 logicalCode: null, } $scope.portList = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10] // 暂时写死10路 $scope.realtimeConditionChange = function (port) { $scope.realtimeCondition.port = port } var showRealtimeChart = echarts.init(document.getElementById('realtimeDataChart')); $scope.showRealtimeData = function (entity) { $scope.realtimeCondition.logicalCode = entity.logicalCode $(".devManageMain #realtimeDialog").modal(); $scope.loadRealtimeData(); } $scope.loadRealtimeData = function () { $http.get('/manager/getDeviceRealtimeData', { params: $scope.realtimeCondition }).then(function (data) { data = data.data var payload = data.payload; var dataList = payload.dataList var option = getRealtimeDataOption(dataList, { 'voltage': { name: "电压" }, 'electricity': { name: "电流" }, 'temperature': { name: "温度" }, }) showRealtimeChart.setOption(option) showRealtimeChart.resize(); }).catch(function (data) { toaster.pop("error", "提示", "获取数据列表失败"); }); } function getRealtimeDataOption(list, dataConfig) { var xData = []; var seriesMap = {}; var markAreaData = [] var prevStatus = '' var leng = list.length for (var index in list) { var item = list[index]; xData.push(item.dateStr); var status = item.status // 如果发现状态值变化 或是 循环已经结束,则结束上一轮的markArea if (prevStatus !== status || index === leng - 1) { prevStatus = status // 如果发现有上一轮的 markArea 则设置其结束坐标 if (markAreaItem) { markAreaItem[1].xAxis = item.dateStr } var markAreaItem = [{ xAxis: item.dateStr, itemStyle: {} }, { xAxis: null }] // 繁忙标记为绿色 if (status === 'busy') { markAreaItem[0].itemStyle.color = 'rgba(7,193,96,.8)' } // 故障标记为红色 else if (status === 'fault') { markAreaItem[0].itemStyle.color = 'rgba(255,82,76,.8)' } else { //空闲或其他状态暂时标记为白色 markAreaItem[0].itemStyle.color = '#fff' } markAreaData.push(markAreaItem) } for (var key in dataConfig) { var value = item[key]; if (!seriesMap[key]) { seriesMap[key] = []; } seriesMap[key].push(value); } } var option = { tooltip: { trigger: 'axis', axisPointer: { lineStyle: { color: '#108EE9', width: .3, } } }, legend: { bottom: 0, data: [] }, grid: { x: 20, x2: 20, y: 20, y2: 45, }, xAxis: [ { type: 'category', axisLabel: { textStyle: { color: "#aaa", fontSize: "12px" } }, axisTick: { show: false, }, axisLine: { show: false, }, data: xData } ], yAxis: [ { type: 'value', axisLabel: { textStyle: { color: "#aaa", fontSize: "12px" } }, axisTick: { show: false, }, axisLine: { show: false, }, splitLine: { show: false, }, }, ], series: [] }; var legend = [] var index = 0; for (var key in seriesMap) { var dataList = seriesMap[key]; var serie = { name: dataConfig[key].name, smooth: true, symbolSize: 0, type: 'line', data: dataList } // 只有电压一个坐标设置 markArea ,否则重复了 if (key === 'voltage') { serie.markArea = {data: markAreaData} } option.series.push(serie); legend.push(dataConfig[key].name) index++; } option.legend.data = legend return option; } /********************查看设备上投放的广告*****************************/ $scope.adGridOptions = { data: 'adGridData', showGridFooter: true, //是否显示grid footer //-------- 分页属性 ---------------- paginationPageSizes: [10, 20, 50, 100], //每页显示个数可选项 paginationCurrentPage: 1, //当前页码 paginationPageSize: 100, //每页显示个数 totalItems: 0,// 总数量 useExternalPagination: true,//是否使用分页按钮 //过滤 enableFiltering: true, columnDefs: [], // 菜单 enableGridMenu: true, //---------------api--------------------- onRegisterApi: function (gridApi) { $scope.adGridApi = gridApi; gridApi.pagination.on.paginationChanged($scope, function (newPage, pageSize) { if ($scope.setAdGridPagingData) { $scope.getAdGridPagedData(newPage, pageSize); } }); } }; function setAdGridColumnDefs() { $scope.adGridOptions.columnDefs = [ { field: 'adId', displayName: '编号', cellClass: "text-center" }, {field: 'name', displayName: '名称'}, {field: 'word', displayName: '广告词'}, {field: 'startTime', enableFiltering: false, displayName: '开始时间'}, {field: 'endTime', enableFiltering: false, displayName: '结束时间'}, { field: 'img', displayName: '图片', enableFiltering: false, enableSorting: false, cellTemplate: '' }, { field: 'status', displayName: '状态', enableSorting: false, cellTemplate: '在线下线' + '' }, ]; var fields = $scope.adGridOptions.columnDefs; for (var index in fields) { var item = fields[index]; if (item && item['minWidth'] == null) { item['minWidth'] = 100; } } } setAdGridColumnDefs(); $scope.getAdGridPagedData = function (curPage, pageSize) { var adByLogicalCode = $scope.adByLogicalCode; if (!adByLogicalCode) { toaster.pop("error", "提示", "设备逻辑码错误"); return } var params = { pageSize: pageSize, pageIndex: curPage, logicalCode: adByLogicalCode }; $http.get('/ad/getDeviceAllocatedAds', { params: params }).then(function (data) { data = data.data if (data.result == 1) { $scope.setAdGridPagingData(data, curPage, pageSize); setTimeout(function () { $(window).trigger("resize"); }, 100); } else { toaster.pop("error", "提示", data.description); } }).catch(function (data) { toaster.pop("error", "提示", "获取数据列表失败"); }); }; $scope.setAdGridPagingData = function (data, curPage, pageSize) { var pagedData = data.data.dataList; $scope.adGridData = pagedData; $scope.adGridOptions.totalItems = data.data.total; }; function initAdDataGrid() { $scope.getAdGridPagedData($scope.gridOptions.paginationCurrentPage, $scope.gridOptions.paginationPageSize); } $scope.openAdDataGrid = function (entity) { $scope.adByLogicalCode = entity.logicalCode; $(".devManageMain #adDataGrid").modal(); initAdDataGrid() } $scope.closeAdDataGrid = function () { $(".devManageMain #adDataGrid").modal('hide') } /**end***/ } }; }]);