Merge remote-tracking branch 'origin/master'
12 files modified
2 files added
| | |
| | | |
| | | //set options from constructor parameter or set defaults |
| | | options = options || {}; |
| | | this.spatialRef = options.spatialReference || new SpatialReference({"wkid": 102100}); |
| | | this.spatialRef = options.spatialReference || new SpatialReference({ |
| | | "wkid": 102100 |
| | | }); |
| | | this.preClustered = options.preClustered === true; |
| | | this.clusterRatio = options.clusterRatio || 75; |
| | | |
| | |
| | | this.map.infoWindow.setFeatures([graphic]); |
| | | |
| | | //when getting screen point make sure we use the location of the flare on screen, by converting the map point on the object. |
| | | var sp = this.map.toScreen({x: flareObject.mapPoint.x, y: flareObject.mapPoint.y}); |
| | | var sp = this.map.toScreen({ |
| | | x: flareObject.mapPoint.x, |
| | | y: flareObject.mapPoint.y |
| | | }); |
| | | |
| | | //Could do something with the anchor of the info window here if wanted. The offsets can be a bit wacky as well. |
| | | //var anchor = this._getInfoWindowAnchor(flareObject.degree); |
| | |
| | | } |
| | | |
| | | //get an extent that is in web mercator to make sure it's flat for extent checking |
| | | var webExtent = webMercatorUtils.project(map.extent, new SpatialReference({"wkid": 102100})); |
| | | var webExtent = webMercatorUtils.project(map.extent, new SpatialReference({ |
| | | "wkid": 102100 |
| | | })); |
| | | if (!this.gridClusters || this.gridClusters.length === 0) { |
| | | this._createClusterGrid(); |
| | | } |
| | |
| | | } |
| | | } |
| | | if (!subTypeExists) { |
| | | cl.subTypeCounts.push({name: obj[this.subTypeFlareProperty], count: 1}); |
| | | cl.subTypeCounts.push({ |
| | | name: obj[this.subTypeFlareProperty], |
| | | count: 1 |
| | | }); |
| | | } |
| | | |
| | | cl.singles.push(obj); |
| | |
| | | //The webextent will need to be normalized since panning over the international dateline will cause |
| | | //cause the extent to shift outside the -180 to 180 degree window. If we don't normalize then the |
| | | //clusters will not be drawn if the map pans over the international dateline. |
| | | var webExtent = !this.map.extent.spatialReference.isWebMercator() ? webMercatorUtils.project(this.map.extent, new SpatialReference({"wkid": 102100})) : this.map.extent; |
| | | var webExtent = !this.map.extent.spatialReference.isWebMercator() ? webMercatorUtils.project(this.map.extent, new SpatialReference({ |
| | | "wkid": 102100 |
| | | })) : this.map.extent; |
| | | var normalizedWebExtent = webExtent.normalize(); |
| | | webExtent = normalizedWebExtent[0]; |
| | | |
| | |
| | | } |
| | | } |
| | | if (!subTypeExists) { |
| | | cl.subTypeCounts.push({name: obj[this.subTypeFlareProperty], count: 1}); |
| | | cl.subTypeCounts.push({ |
| | | name: obj[this.subTypeFlareProperty], |
| | | count: 1 |
| | | }); |
| | | } |
| | | |
| | | cl.singles.push(obj); |
| | |
| | | for (var j = 0; j < yCount; j++) { |
| | | gsymin = webExtent.ymin + (yh * j); |
| | | gsymax = gsymin + yh; |
| | | var ext = new Extent({xmin: gsxmin, xmax: gsxmax, ymin: gsymin, ymax: gsymax}); |
| | | ext.setSpatialReference(new SpatialReference({"wkid": 102100})); |
| | | var ext = new Extent({ |
| | | xmin: gsxmin, |
| | | xmax: gsxmax, |
| | | ymin: gsymin, |
| | | ymax: gsymax |
| | | }); |
| | | ext.setSpatialReference(new SpatialReference({ |
| | | "wkid": 102100 |
| | | })); |
| | | this.gridClusters.push({ |
| | | extent: ext, |
| | | clusterCount: 0, |
| | |
| | | _createSingle: function (single) { |
| | | this.singles.push(single); |
| | | delete single.graphic; |
| | | var symbol; |
| | | console.log(single.onlineStatus, 898989); |
| | | if (single.onlineStatus == 1) { |
| | | symbol = new esri.symbol.PictureMarkerSymbol("./images/zx-jingbao.png", 40, 40); |
| | | } else { |
| | | symbol = new esri.symbol.PictureMarkerSymbol("./images/dx-jingbao.png", 40, 40); |
| | | } |
| | | var point = new Point(single[this.xPropertyName], single[this.yPropertyName], this.spatialRef); |
| | | var attributes = lang.clone(single); |
| | | var graphic = new Graphic(point, null, attributes, null); |
| | | var graphic = new Graphic(point, symbol, attributes, null); |
| | | single.graphic = graphic; |
| | | this.add(graphic); |
| | | }, |
| | |
| | | var create = fx.animateTransform({ |
| | | duration: 200, |
| | | shape: groupShape, |
| | | transform: [ |
| | | { |
| | | transform: [{ |
| | | name: "scaleAt", |
| | | start: [0, 0, shapeCenter.x, shapeCenter.y], |
| | | end: [1, 1, shapeCenter.x, shapeCenter.y] |
| | | } |
| | | ], |
| | | }], |
| | | onEnd: dojo.partial(this._animationEnd, this) |
| | | }); |
| | | anims.push(create); |
| | |
| | | var areaCreate = fx.animateTransform({ |
| | | duration: 200, |
| | | shape: areaShape, |
| | | transform: [ |
| | | { |
| | | transform: [{ |
| | | name: "scaleAt", |
| | | start: [0, 0, areaCenter.x, areaCenter.y], |
| | | end: [1, 1, areaCenter.x, areaCenter.y] |
| | | } |
| | | ], |
| | | }], |
| | | onEnd: dojo.partial(this._animationEnd, this) |
| | | }); |
| | | anims.push(areaCreate); |
| | |
| | | var areaDisplay = fx.animateTransform({ |
| | | duration: 300, |
| | | shape: cluster.areaGraphic.getShape(), |
| | | transform: [ |
| | | {name: "scaleAt", start: [0, 0, center.x, center.y], end: [1, 1, center.x, center.y]} |
| | | ], |
| | | transform: [{ |
| | | name: "scaleAt", |
| | | start: [0, 0, center.x, center.y], |
| | | end: [1, 1, center.x, center.y] |
| | | }], |
| | | onEnd: dojo.partial(this._animationEnd, this) |
| | | }); |
| | | scaleAnims.push(areaDisplay); |
| | |
| | | var scaleUp = fx.animateTransform({ |
| | | duration: 400, |
| | | shape: groupShape, |
| | | transform: [ |
| | | {name: "scaleAt", start: [1, 1, center.x, center.y], end: [1.3, 1.3, center.x, center.y]} |
| | | ], |
| | | transform: [{ |
| | | name: "scaleAt", |
| | | start: [1, 1, center.x, center.y], |
| | | end: [1.3, 1.3, center.x, center.y] |
| | | }], |
| | | onEnd: dojo.partial(this._animationEnd, this) |
| | | }); |
| | | |
| | |
| | | |
| | | //create a transparent circle that contains the boundary of the flares, this is to make sure the mouse events don't fire moving in between flares |
| | | var conCircleRadius = (center.x - (bbox.x - radius - buffer)) + radius; //get the radius of the circle to contain everything |
| | | var containerCircle = groupShape.createCircle({cx: center.x, cy: center.y, r: conCircleRadius}) |
| | | var containerCircle = groupShape.createCircle({ |
| | | cx: center.x, |
| | | cy: center.y, |
| | | r: conCircleRadius |
| | | }) |
| | | //.setStroke({ width: 1, color: "000" }) |
| | | .setFill(new Color([0, 0, 0, 0])); |
| | | containerCircle.rawNode.setAttribute("class", "flare-object cluster-object"); |
| | |
| | | if (fo.flareText) { |
| | | //if displaying text in the flare, |
| | | flareGroup.flareText = { |
| | | location: {x: fo.center.x, y: fo.center.y + (radius / 2 - 1)}, |
| | | location: { |
| | | x: fo.center.x, |
| | | y: fo.center.y + (radius / 2 - 1) |
| | | }, |
| | | text: !isSummaryFlare ? fo.flareText : "...", |
| | | textSize: !isSummaryFlare ? 7 : 10 |
| | | }; |
| | | } |
| | | |
| | | flareGroup.setTransform({xx: 0, yy: 0});//scale to 0 to start with |
| | | flareGroup.setTransform({ |
| | | xx: 0, |
| | | yy: 0 |
| | | }); //scale to 0 to start with |
| | | flareGroup.rawNode.setAttribute("class", "flare-object cluster-object"); |
| | | flareCircle.rawNode.setAttribute("class", "flare-graphic cluster-object"); |
| | | flareGroup.rawNode.setAttribute("data-tooltip", tooltipText); |
| | |
| | | var anim = fx.animateTransform({ |
| | | duration: 50, |
| | | shape: flareGroup, |
| | | transform: [ |
| | | { |
| | | transform: [{ |
| | | name: "scaleAt", |
| | | start: [0, 0, fo.center.x, fo.center.y], |
| | | end: [1, 1, fo.center.x, fo.center.y] |
| | | } |
| | | ], |
| | | }], |
| | | onEnd: dojo.partial(this._animationEnd, this) |
| | | }); |
| | | |
| | |
| | | var areaHide = fx.animateTransform({ |
| | | duration: 600, |
| | | shape: cluster.areaGraphic.getShape(), |
| | | transform: [ |
| | | {name: "scaleAt", start: [1, 1, center.x, center.y], end: [0, 0, center.x, center.y]} |
| | | ], |
| | | transform: [{ |
| | | name: "scaleAt", |
| | | start: [1, 1, center.x, center.y], |
| | | end: [0, 0, center.x, center.y] |
| | | }], |
| | | onEnd: dojo.partial(this._animationEnd, this) |
| | | }); |
| | | |
| | |
| | | var scaleDown = fx.animateTransform({ |
| | | duration: 400, |
| | | shape: groupShape, |
| | | transform: [ |
| | | {name: "scaleAt", start: [1.3, 1.3, center.x, center.y], end: [1, 1, center.x, center.y]} |
| | | ], |
| | | transform: [{ |
| | | name: "scaleAt", |
| | | start: [1.3, 1.3, center.x, center.y], |
| | | end: [1, 1, center.x, center.y] |
| | | }], |
| | | onEnd: dojo.partial(this._animationEnd, this) |
| | | }); |
| | | |
| | |
| | | var yPos = parseInt(shape.rawNode.getAttribute("data-center-y")) + 18; //align underneath, could be changed to be wherever |
| | | |
| | | //create a group to hold the tooltip elements |
| | | var tooltipGroup = shape.createGroup({x: xPos, y: yPos}); |
| | | var tooltipGroup = shape.createGroup({ |
| | | x: xPos, |
| | | y: yPos |
| | | }); |
| | | tooltipGroup.rawNode.setAttribute("class", "tooltip-text"); |
| | | |
| | | var textShapes = []; |
| | | for (var i = 0, len = lines.length; i < len; i++) { |
| | | var textShape = tooltipGroup.createText({x: xPos, y: yPos + (i * 10), text: lines[i], align: 'middle'}) |
| | | var textShape = tooltipGroup.createText({ |
| | | x: xPos, |
| | | y: yPos + (i * 10), |
| | | text: lines[i], |
| | | align: 'middle' |
| | | }) |
| | | .setFill("#000") |
| | | .setFont({size: 8, family: this.textSymbol.font.family, weight: this.textSymbol.font.weight}); |
| | | .setFont({ |
| | | size: 8, |
| | | family: this.textSymbol.font.family, |
| | | weight: this.textSymbol.font.weight |
| | | }); |
| | | textShapes.push(textShape); |
| | | textShape.rawNode.setAttribute("pointer-events", "none"); |
| | | } |
| | |
| | | r: 0 |
| | | }) |
| | | .setFill(new Color([255, 255, 255, 0.9])) |
| | | .setStroke({color: "#000", width: 0.5}); |
| | | .setStroke({ |
| | | color: "#000", |
| | | width: 0.5 |
| | | }); |
| | | rectShape.rawNode.setAttribute("pointer-events", "none"); |
| | | |
| | | shape.moveToFront(); |
| | |
| | | var bbox = shape.getBoundingBox(); |
| | | x = bbox.x + bbox.width / 2; |
| | | y = bbox.y + bbox.height / 2 |
| | | return {x: x, y: y}; |
| | | return { |
| | | x: x, |
| | | y: y |
| | | }; |
| | | }, |
| | | |
| | | _getSurfaceTranslate: function () { |
| | |
| | | //put this in a slight timeout, otherwise the display can get a tiny bit jittery. |
| | | setTimeout(function () { |
| | | if (elem.__gfxObject__) { |
| | | elem.__gfxObject__.setTransform({xx: 1, yy: 1}); |
| | | elem.__gfxObject__.setTransform({ |
| | | xx: 1, |
| | | yy: 1 |
| | | }); |
| | | } |
| | | }, 50); |
| | | }); |
| | |
| | | "esri/layers/ImageParameters", |
| | | "esri/geometry/geometryEngine", |
| | | "esri/dijit/PopupTemplate", |
| | | "widgets/clientManagement/FlareClusterLayer_v3", |
| | | "widgets/supervisoryMap/FlareClusterLayer_v3", |
| | | "dojo/domReady!" |
| | | ], function ( |
| | | dojo, |
| | |
| | | import request from '@/router/axios'; |
| | | |
| | | export const getList = () => { |
| | | export const getList = (res) => { |
| | | return request({ |
| | | url: '/api/blade-jfpts/equipment/equipment/listAll', |
| | | method: 'get', |
| | | params: {} |
| | | params: {...res} |
| | | }) |
| | | } |
| | |
| | | `https://web.byisf.com:18000/GetPlayUrl?deviceCode=${that.form.serialNumber}&chl=${that.form.channelNumber}` |
| | | ) |
| | | .then((result) => { |
| | | axios({ |
| | | method: "post", |
| | | url: `/api/blade-jfpts/rvideo/rVoids`, |
| | | params: { |
| | | url: result.data.data.flv, |
| | | }, |
| | | }).then((resdata) => {}); |
| | | // axios({ |
| | | // method: "post", |
| | | // url: `/api/blade-jfpts/rvideo/rVoids`, |
| | | // params: { |
| | | // url: result.data.data.flv, |
| | | // }, |
| | | // }).then((resdata) => {}); |
| | | }); |
| | | }); |
| | | if ( |
| | |
| | | .then(function () { |
| | | that.dialogTableVisible = false; |
| | | |
| | | axios({ |
| | | method: "post", |
| | | url: `/api/blade-jfpts/rvideo/stop`, |
| | | params: { |
| | | jid: row.id, |
| | | }, |
| | | }).then((resdata) => {}); |
| | | // axios({ |
| | | // method: "post", |
| | | // url: `/api/blade-jfpts/rvideo/stop`, |
| | | // params: { |
| | | // jid: row.id, |
| | | // }, |
| | | // }).then((resdata) => {}); |
| | | |
| | | that.$router.push({ |
| | | path: "/policeTracking/track", |
| | |
| | | font-size: 14px; |
| | | } |
| | | |
| | | .avue-data-cardText .item-footer span:nth-child(2) { |
| | | color: red; |
| | | } |
| | | |
| | | //预警类型占比 |
| | | .alarmTypePro { |
| | | background-color: #ffffff; |
| | |
| | | top: 24px; |
| | | } |
| | | |
| | | //预警平均速度排行 |
| | | //预警平均确认速度排行 |
| | | .confirmAverageSpeed { |
| | | background-color: #ffffff; |
| | | width: 35%; |
| | |
| | | left: 64.4%; |
| | | } |
| | | |
| | | .confirmAverageSpeedTitle span { |
| | | position: relative; |
| | | left: 5%; |
| | | top: 20px; |
| | | } |
| | | |
| | | .confirmAverageSpeed .avue-crud { |
| | | width: 90%; |
| | | position: relative; |
| | |
| | | </div> |
| | | <!-- 预警平均确认速度排行 --> |
| | | <div class="confirmAverageSpeed"> |
| | | <div class="confirmAverageSpeedTitle"><span>预警平均确认速度排行</span></div> |
| | | <avue-crud :data="confirmAverageSpeedData" :option="confirmAverageSpeedOption"></avue-crud> |
| | | </div> |
| | | <!-- 预警时间分布 --> |
| | |
| | | timeChange(){ |
| | | //清空选项按钮标记 |
| | | var that = this; |
| | | var time = this.dateTime; |
| | | var startTime = time[0]+""; |
| | | if(startTime.indexOf("-")==-1){ |
| | | //修改时间格式 |
| | | time[0]=this.timeFormat(time[0]); |
| | | time[1]=this.timeFormat(time[1]); |
| | | } |
| | | //如果开始时间和结束时间相同,则修改结束时间 |
| | | if(time[0]==time[1]){ |
| | | time[1]= time[0].substring(0,10)+" 23:59:59"; |
| | | } |
| | | that.activeClass = 0; |
| | | var data = {}; |
| | | data ={ |
| | | startTime:this.timeFormat(this.dateTime[0]), |
| | | endTime:this.timeFormat(this.dateTime[1]) |
| | | startTime:time[0], |
| | | endTime:time[1] |
| | | } |
| | | this.getStatisData(data); |
| | | }, |
| | |
| | | selectIndexCount(data).then(res => { |
| | | var that = this; |
| | | var time = this.dateTime; |
| | | var startTime = time[0]+""; |
| | | if(startTime.indexOf("-")==-1){ |
| | | //修改时间格式 |
| | | time[0]=this.timeFormat(time[0]); |
| | | time[1]=this.timeFormat(time[1]); |
| | | } |
| | | //如果开始时间和结束时间相同,则修改结束时间 |
| | | if(time[0]==time[1]){ |
| | | time[1]= time[0].substring(0,10)+" 23:59:59"; |
| | | } |
| | | that.statisToTalData.data = [ |
| | | { |
| | | click: function (item) { |
| | |
| | | }) |
| | | }, |
| | | |
| | | //预警平均速度排行(table) |
| | | //预警平均确认速度排行(table) |
| | | confirmAverageSpeedStatis(data){ |
| | | var that = this; |
| | | that.confirmAverageSpeedData=[ |
| | |
| | | } |
| | | ]; |
| | | that.confirmAverageSpeedOption={ |
| | | title:'表格的标题', |
| | | title:'预警平均确认速度排行', |
| | | titleSize:'h3', |
| | | titleStyle:{ |
| | | color:'red' |
| | |
| | | getAlarmTimeDisEchars(data){ |
| | | selAlarmTimeDis(data).then(res =>{ |
| | | var data = res.data; |
| | | var time = this.dateTime; |
| | | let echarts = require('echarts'); |
| | | let myChart = echarts.init(document.getElementById('alarmTimeDisEchars')); |
| | | //图表数据点击事件 |
| | | myChart.on('click', function (params) { |
| | | var data = []; |
| | | if(params.seriesName=='一键求助'){ |
| | | window.parent.handleStartAlarm(data); |
| | | data.push({ |
| | | startTime:time[0], |
| | | endTime:time[1], |
| | | waringType:'紧急求救', |
| | | timeDesc: params.name |
| | | }) |
| | | window.parent.handleStartAlarm(data); |
| | | } |
| | | |
| | | if(params.seriesName=='违禁品'){ |
| | | data.push({ |
| | | startTime:time[0], |
| | | endTime:time[1], |
| | | decisioDiagramResult:"contraband", |
| | | timeDesc: params.name |
| | | }); |
| | | window.parent.handleStartParcelKind(data); |
| | | } |
| | | |
| | | if(params.seriesName=='红色健康码'){ |
| | | data.push({ |
| | | startTime:time[0], |
| | | endTime:time[1], |
| | | type:3, |
| | | timeDesc: params.name |
| | | }); |
| | | window.parent.handleStartHealthcode(data); |
| | | } |
| | | |
| | | if(params.seriesName=='体温异常'){ |
| | | data.push({ |
| | | startTime:time[0], |
| | | endTime:time[1], |
| | | status:1, |
| | | timeDesc: params.name |
| | | }); |
| | | window.parent.handleStartAnimalHeat(data); |
| | | } |
| | | }) |
| | | var colors = ['#FF9836', '#1E90FF', '#F34A4A', '#8058A5']; |
| | | let option = { |
| | | color: colors, |
| | |
| | | { |
| | | name: '一键求助', |
| | | type: 'line', |
| | | stack: '总量', |
| | | data: data.data.alarmTimeDis |
| | | }, |
| | | { |
| | | name: '违禁品', |
| | | type: 'line', |
| | | stack: '总量', |
| | | data: data.data.parcelTimeDis |
| | | }, |
| | | { |
| | | name: '红色健康码', |
| | | type: 'line', |
| | | stack: '总量', |
| | | data: data.data.healthcodeTimeDis |
| | | }, |
| | | { |
| | | name: '体温异常', |
| | | type: 'line', |
| | | stack: '总量', |
| | | data: data.data.animalTimeDis |
| | | } |
| | | ] |
| | |
| | | this.getStatisData(data); |
| | | }, |
| | | |
| | | //调用方法,获取统计数据 |
| | | getStatisData(data){ |
| | | //统计预警总数 |
| | | this.getStatisTotalData(data); |
| | |
| | | return days; |
| | | }, |
| | | |
| | | |
| | | //计算时间 |
| | | getDate(date){ |
| | | var that = this; |
| | | var today = new Date(); |
| | |
| | | ...this.query, |
| | | }; |
| | | } |
| | | |
| | | if (this.$route.query.timeDesc) { |
| | | values = { |
| | | ...params, |
| | | timeDesc: this.$route.query.timeDesc, |
| | | ...this.query, |
| | | }; |
| | | } |
| | | |
| | | this.loading = true; |
| | | getList(page.currentPage, page.pageSize, values).then(res => { |
| | | const data = res.data.data; |
| | |
| | | }; |
| | | } |
| | | |
| | | if (this.$route.query.timeDesc) { |
| | | values = { |
| | | ...params, |
| | | timeDesc: this.$route.query.timeDesc, |
| | | ...this.query, |
| | | }; |
| | | } |
| | | |
| | | this.loading = true; |
| | | getList(page.currentPage, page.pageSize,values).then(res => { |
| | | const data = res.data.data; |
| | |
| | | }; |
| | | } |
| | | |
| | | if (this.$route.query.timeDesc) { |
| | | values = { |
| | | ...params, |
| | | timeDesc: this.$route.query.timeDesc, |
| | | ...this.query, |
| | | }; |
| | | } |
| | | |
| | | this.loading = true; |
| | | getKindList(page.currentPage, page.pageSize,values).then(res => { |
| | | const data = res.data.data; |
| | |
| | | * @Author: Morpheus |
| | | * @Date: 2021-03-17 15:21:33 |
| | | * @Last Modified by: Morpheus |
| | | * @Last Modified time: 2021-04-07 17:36:33 |
| | | * @Last Modified time: 2021-04-09 09:59:32 |
| | | */ |
| | | <template> |
| | | <basic-container> |
| | |
| | | }; |
| | | } |
| | | |
| | | if (this.$route.query.timeDesc) { |
| | | values = { |
| | | ...params, |
| | | timeDesc: this.$route.query.timeDesc, |
| | | ...this.query, |
| | | }; |
| | | } |
| | | |
| | | this.loading = true; |
| | | getList(page.currentPage, page.pageSize, values).then((res) => { |
| | | const data = res.data.data; |
| | |
| | | .then(function () { |
| | | that.dialogTableVisible = false; |
| | | |
| | | axios({ |
| | | method: "post", |
| | | url: `/api/blade-jfpts/rvideo/stop`, |
| | | params: { |
| | | jid: row.id, |
| | | }, |
| | | }).then((resdata) => {}); |
| | | // axios({ |
| | | // method: "post", |
| | | // url: `/api/blade-jfpts/rvideo/stop`, |
| | | // params: { |
| | | // jid: row.id, |
| | | // }, |
| | | // }).then((resdata) => {}); |
| | | |
| | | that.onLoad(that.page, that.query); |
| | | that.$router.push({ |
| | |
| | | v-model="inputSearchValue" |
| | | class="input-with-select" |
| | | > |
| | | <el-button slot="append" icon="el-icon-search"></el-button> |
| | | <el-button |
| | | slot="append" |
| | | icon="el-icon-search" |
| | | @click.stop="inputSearchBtn" |
| | | ></el-button> |
| | | </el-input> |
| | | </div> |
| | | <div class="radio"> |
| | | <el-radio-group v-model="radio" @change="siteStatus"> |
| | | <el-radio label="仅显示设备在线">仅显示设备在线</el-radio> |
| | | <el-radio label="全部">全部</el-radio> |
| | | <el-radio label="仅显示预警设备">仅显示预警设备</el-radio> |
| | | <el-radio label="仅显示设备掉线">仅显示设备掉线</el-radio> |
| | | <el-radio label="仅显示设备故障">仅显示设备故障</el-radio> |
| | | </el-radio-group> |
| | |
| | | option: [], |
| | | count: [], |
| | | loading: false, |
| | | radio: "仅显示设备在线", |
| | | radio: "全部", |
| | | inputSearchValue: "", |
| | | }; |
| | | }, |
| | |
| | | }, |
| | | }, |
| | | created() { |
| | | getList().then((res) => { |
| | | var a = [], |
| | | b = [], |
| | | c = []; |
| | | |
| | | res.data.data.forEach((item) => { |
| | | if (item.state != "") a.push(item); |
| | | if (item.state == "" && item.onlineStatus != 1) b.push(item); |
| | | if (item.state == "" && item.onlineStatus == 1) c.push(item); |
| | | }); |
| | | |
| | | var d = a.concat(c.concat(b)); |
| | | |
| | | d.forEach((item) => { |
| | | this.count.push(item); |
| | | }); |
| | | this.option = []; |
| | | for (var i = 0; i <= 24; i++) { |
| | | if (this.count.length > 0) { |
| | | this.option.push(this.count[0]); |
| | | this.count.shift(); |
| | | } |
| | | } |
| | | }); |
| | | this.getEquipmentLists(); |
| | | }, |
| | | |
| | | methods: { |
| | |
| | | siteStatus(value, e) { |
| | | console.log(this.radio, value); |
| | | }, |
| | | goToDetails(data) { |
| | | this.$router.push({ path: "/dataL ", query: data }); |
| | | inputSearchBtn() { |
| | | this.getEquipmentLists(); |
| | | }, |
| | | |
| | | siteStatus() { |
| | | this.inputSearchValue = ""; |
| | | this.getEquipmentLists(); |
| | | }, |
| | | |
| | | getEquipmentLists() { |
| | | getList({ deviceName: this.inputSearchValue }).then((res) => { |
| | | var a = [], |
| | | b = [], |
| | | c = []; |
| | | if (this.radio == "全部") { |
| | | res.data.data.forEach((item) => { |
| | | if (item.state != "") a.push(item); |
| | | if (item.state == "" && item.onlineStatus == 1) c.push(item); |
| | | if (item.state == "" && item.onlineStatus != 1) b.push(item); |
| | | }); |
| | | } else if (this.radio == "仅显示预警设备") { |
| | | res.data.data.forEach((item) => { |
| | | if (item.jtype == 1) c.push(item); |
| | | }); |
| | | } else if (this.radio == "仅显示设备掉线") { |
| | | res.data.data.forEach((item) => { |
| | | if (item.onlineStatus != 1) b.push(item); |
| | | }); |
| | | } else if (this.radio == "仅显示设备故障") { |
| | | res.data.data.forEach((item) => { |
| | | if (item.state != "") a.push(item); |
| | | }); |
| | | } |
| | | |
| | | var d = a.concat(c.concat(b)); |
| | | |
| | | d.forEach((item) => { |
| | | this.count.push(item); |
| | | }); |
| | | this.option = []; |
| | | for (var i = 0; i <= 24; i++) { |
| | | if (this.count.length > 0) { |
| | | this.option.push(this.count[0]); |
| | | this.count.shift(); |
| | | } |
| | | } |
| | | this.inputSearchValue = ""; |
| | | }); |
| | | }, |
| | | }, |
| | | }; |
| | |
| | | var that = this; |
| | | getList().then((res) => { |
| | | res.data.data.forEach((item) => { |
| | | if (item.waringType == "紧急求救") { |
| | | that.tableData.push({ |
| | | waringType: |
| | | item.waringType == "紧急求救" ? "一键求助" : item.waringType, |
| | |
| | | onePhone: item.onePhone, |
| | | galarmPeople: item.galarmPeople, |
| | | jtype: |
| | | item.jtype == 0 ? "未处理" : item.jtype == 1 ? "处理中" : "已处理", |
| | | item.jtype == 0 |
| | | ? "未处理" |
| | | : item.jtype == 1 |
| | | ? "处理中" |
| | | : "已处理", |
| | | alarmPeople: item.alarmPeople, |
| | | }); |
| | | } |
| | | }); |
| | | }); |
| | | |
| | |
| | | background-color: #29c093; |
| | | } |
| | | &:nth-child(3)::before { |
| | | background-color: #F48F57; |
| | | background-color: #f48f57; |
| | | } |
| | | &:nth-child(4)::before { |
| | | background-color: #dfdfdf; |
| | |
| | | color: #29c194; |
| | | } |
| | | .active-list:nth-child(2) > div:nth-child(1) span { |
| | | border: 1px solid #F48F57; |
| | | color: #F48F57; |
| | | border: 1px solid #f48f57; |
| | | color: #f48f57; |
| | | } |
| | | .active-list:nth-child(1) > div:nth-child(1) span:hover { |
| | | background: rgba(41, 192, 147, 0.15); |
| | |
| | | color: #29c194; |
| | | } |
| | | .active-list:nth-child(2) > div:nth-child(2) span { |
| | | color: #F48F57; |
| | | color: #f48f57; |
| | | } |
| | | } |
| | | .info-active-top, |