diff --git a/src/views/stationOperation/components/MapMarker.vue b/src/views/stationOperation/components/MapMarker.vue index 662ce29..83b15e6 100644 --- a/src/views/stationOperation/components/MapMarker.vue +++ b/src/views/stationOperation/components/MapMarker.vue @@ -136,7 +136,7 @@ export default { img.draggable = false img.src = MarkerIcon[stationInfo.stationType] img.addEventListener('click', () => { - this.$emit('markerClick') + this.$emit('markerClick', stationInfo) }) img.addEventListener('mouseover', () => { diff --git a/src/views/stationOperation/components/MapPane.vue b/src/views/stationOperation/components/MapPane.vue index 5dcf50f..5f62093 100644 --- a/src/views/stationOperation/components/MapPane.vue +++ b/src/views/stationOperation/components/MapPane.vue @@ -14,7 +14,7 @@
- +
-
- Stations -
+
Stations
@@ -58,7 +56,7 @@ >
- +
@@ -72,17 +70,13 @@
-
- Infomation -
+
Infomation

Radius

- - Search - + Search
-
- Filter -
+
Filter
- +
- - Particulate Station - + Station
@@ -177,9 +167,7 @@
- - Attribute Configuration - + Attribute Configuration
@@ -233,10 +221,26 @@
-
+
@@ -265,44 +269,44 @@ const filterList = [ title: 'IMS RN Station(P)', type: MarkerType.ImsRnStationP, icon: FilterIcon[MarkerType.ImsRnStationP], - checked: true + checked: true, }, { title: 'IMS RN Station(G)', type: MarkerType.ImsRnStationG, icon: FilterIcon[MarkerType.ImsRnStationG], - checked: true + checked: true, }, { title: 'NRL', type: MarkerType.NRL, icon: FilterIcon[MarkerType.NRL], - checked: true + checked: true, }, { title: 'Nuclear Facilities', type: MarkerType.NuclearFacility, icon: FilterIcon[MarkerType.NuclearFacility], - checked: true + checked: true, }, { title: 'Groud monitoring station', type: MarkerType.GroudMonitoringStation, icon: FilterIcon[MarkerType.GroudMonitoringStation], - checked: true + checked: true, }, { title: 'car', type: MarkerType.Car, icon: FilterIcon[MarkerType.Car], - checked: true + checked: true, }, { title: 'ship', type: MarkerType.Ship, icon: FilterIcon[MarkerType.Ship], - checked: true - } + checked: true, + }, ] // Filter中的数据质量列表 @@ -310,23 +314,23 @@ const dataQualityList = [ { title: 'Excellent data quality', icon: FilterIcon.State1, - checked: true + checked: true, }, { title: 'Good data quality', icon: FilterIcon.State2, - checked: true + checked: true, }, { title: 'Poor data quality', icon: FilterIcon.State3, - checked: true + checked: true, }, { title: 'Signal interruption', icon: FilterIcon.State4, - checked: true - } + checked: true, + }, ] // infomation-radius 表格列 @@ -335,57 +339,57 @@ const columns = [ title: 'nuclearfaclity', dataIndex: 'nuclearFacilityName', width: 100, - ellipsis: true + ellipsis: true, }, { title: 'station', dataIndex: 'stationName', width: 70, - ellipsis: true + ellipsis: true, }, { title: 'distance', dataIndex: 'radius', width: 80, - ellipsis: true - } + ellipsis: true, + }, ] // Attribute Configuration 检验规则(自定义，非a-form校验) const rules = { cacheTime: { required: true, - message: 'Please Input Cache Time' + message: 'Please Input Cache Time', }, scaleInterval: { required: true, - message: 'Please Input Scale Interval' + message: 'Please Input Scale Interval', }, timelineLength: { required: true, - message: 'Please Input Timeline Length' + message: 'Please Input Timeline Length', }, updateIntervalTime: { required: true, - message: 'Please Input Update Interval' - } + message: 'Please Input Update Interval', + }, } export default { props: { panMovePix: { type: Number, - default: 500 + default: 500, }, treeData: { - type: Array - } + type: Array, + }, }, components: { CustomModal, CustomTree, - RealTimeDataChart + RealTimeDataChart, }, data() { this.columns = columns @@ -409,7 +413,7 @@ export default { cacheTime: 15, scaleInterval: 120, timelineLength: 1440, - updateIntervalTime: 5 + updateIntervalTime: 5, }, // 数据接收状态配置 isSavingDataRecieveSettings: false, @@ -423,7 +427,9 @@ export default { showPane: true, spinLoading: false, - maskVisi: false + maskVisi: false, + + stationInfo: undefined, } }, created() { @@ -446,9 +452,9 @@ export default { this.map = map this.circleLayer = new VectorLayer({ source: new VectorSource({ - features: [] + features: [], }), - properties: { name: 'eventCircle' } + properties: { name: 'eventCircle' }, }) this.map.addLayer(this.circleLayer) }, @@ -496,12 +502,12 @@ export default { // 根据 Filter 筛选Marker emitFilter() { - const filterType = this.filterList.filter(item => item.checked).map(item => item.type) - const filterDataQuality = this.dataQualityList.filter(item => item.checked).map(item => item.title) + const filterType = this.filterList.filter((item) => item.checked).map((item) => item.type) + const filterDataQuality = this.dataQualityList.filter((item) => item.checked).map((item) => item.title) this.$emit('filterMarker', { filterType, - filterDataQuality + filterDataQuality, }) }, @@ -514,7 +520,7 @@ export default { handleSelectAll() { this.checkedKeys = this.treeData.reduce((prev, curr) => { prev.push(curr.stationId) - prev.push(...curr.children.map(child => child.stationId)) + prev.push(...curr.children.map((child) => child.stationId)) return prev }, []) }, @@ -547,16 +553,16 @@ export default { return } - const stationIds = this.checkedKeys.filter(key => -1 == key.toString().indexOf('root_')) + const stationIds = this.checkedKeys.filter((key) => -1 == key.toString().indexOf('root_')) try { this.isGettingInfomationList = true const { success, result: { GIS: markerList, table }, - message + message, } = await postAction('/jeecg-station-operation/stationOperation/getHitEquList', { radius: this.radius, - stationIds + stationIds, }) if (success) { const source = this.circleLayer.getSource() @@ -571,7 +577,7 @@ export default { this.dataSource = data // 设置Infomation表格内容 this.stationList = [] // 台站列表 - markerList.forEach(markerItem => { + markerList.forEach((markerItem) => { // 返回的数据类型不符合要求，根据stationId判断是否是台站，增加台站类型和转换字段，以便进行marker的绘制 if (markerItem.stationId) { // 是台站 @@ -616,7 +622,8 @@ export default { }, // 打开分析弹窗 - handleOpenAnalyzeModal() { + handleOpenAnalyzeModal(stationInfo) { + this.stationInfo = stationInfo this.dataStatusModalVisible = true }, @@ -653,13 +660,13 @@ export default { try { await this.validateForm(this.dataRecieveStatusModel, rules) try { - const stationIds = this.dataStatusCheckedKeys.filter(key => -1 == key.toString().indexOf('root_')) + const stationIds = this.dataStatusCheckedKeys.filter((key) => -1 == key.toString().indexOf('root_')) this.isSavingDataRecieveSettings = true const { success, message } = await postAction( '/jeecg-station-operation/sysUserFocusStation/saveUserFocusByUserId', { stationIds, - ...this.dataRecieveStatusModel + ...this.dataRecieveStatusModel, } ) if (success) { @@ -701,7 +708,7 @@ export default { const { success, result, message } = await getAction( '/jeecg-station-operation/sysUserFocusStation/findUserFocusByUserId', { - userId: this.$store.getters.userInfo.id + userId: this.$store.getters.userInfo.id, } ) if (success) { @@ -737,20 +744,25 @@ export default { const { success, result, message } = await getAction( '/jeecg-station-operation/stationOperation/getDataReceivingStatus', { - userId: this.$store.getters.userInfo.id + userId: this.$store.getters.userInfo.id, + oneStationId: (this.stationInfo && this.stationInfo.stationId) || '', } ) this.maskVisi = false this.spinLoading = false if (success) { + // 如果从地图的Marker上点开，且点开的为已关注的台站，则把这个台站放到前面 + if (this.stationInfo) { + result.sort(({ stationId }) => (stationId == this.stationInfo.stationId ? -1 : 1)) // chrome 和 firefox下表现不同，但都能将目标值排到第一个 + } const statusList = [] - result.forEach(item => { + result.forEach((item) => { const detectorArr = item.detectors[item.stationId] - detectorArr.forEach(detector => { - Object.values(detector).forEach(value => { + detectorArr.forEach((detector) => { + Object.values(detector).forEach((value) => { statusList.push({ title: `${item.stationCode} ${value.detectorId}`, - dataList: value.dataList + dataList: value.dataList, }) }) }) @@ -770,27 +782,27 @@ export default { handleResize() { this.$refs.realtimeChartRef.resize() - } + }, }, watch: { dataStatusModalVisible(val) { if (val) { - this.dataStatusCheckedKeys = this.initialDataRecieveSettings.sysUserFocusStations.map(item => + this.dataStatusCheckedKeys = this.initialDataRecieveSettings.sysUserFocusStations.map((item) => parseInt(item.stationId) ) this.dataRecieveStatusModel = { cacheTime: this.initialDataRecieveSettings.cacheTime, scaleInterval: this.initialDataRecieveSettings.scaleInterval, timelineLength: this.initialDataRecieveSettings.timelineLength, - updateIntervalTime: this.initialDataRecieveSettings.updateIntervalTime + updateIntervalTime: this.initialDataRecieveSettings.updateIntervalTime, } this.startGetDataReceiveStatusList() } else { clearInterval(this.timer) } - } - } + }, + }, }