From 307b17ef15c73a071912a262834f2a5f68e1fa87 Mon Sep 17 00:00:00 2001 From: riku <risaku@163.com> Date: 星期四, 11 九月 2025 15:20:35 +0800 Subject: [PATCH] 完成走航季度报告自动生成 --- public/underway_season_report - 副本.docx | 0 public/underway_season_report.docx | 0 src/utils/chart/chart-map.js | 92 ---------------------- src/views/historymode/component/MissionReport.vue | 122 +++++++++++++++++------------- 4 files changed, 71 insertions(+), 143 deletions(-) diff --git "a/public/underway_season_report - \345\211\257\346\234\254.docx" "b/public/underway_season_report - \345\211\257\346\234\254.docx" new file mode 100644 index 0000000..1a822ce --- /dev/null +++ "b/public/underway_season_report - \345\211\257\346\234\254.docx" Binary files differ diff --git a/public/underway_season_report.docx b/public/underway_season_report.docx index a29e88d..879f419 100644 --- a/public/underway_season_report.docx +++ b/public/underway_season_report.docx Binary files differ diff --git a/src/utils/chart/chart-map.js b/src/utils/chart/chart-map.js index fb72feb..0918317 100644 --- a/src/utils/chart/chart-map.js +++ b/src/utils/chart/chart-map.js @@ -115,16 +115,6 @@ chart.setOption(option); - // 灏嗗儚绱犲潗鏍囪浆鎹负缁忕含搴� - // const convert = (x, y) => { - // return chart.convertFromPixel( - // { - // geoIndex: 0 - // }, - // [x, y] - // ); - // }; - // 灏嗙粡绾害杞崲涓哄儚绱犲潗鏍� const convert = (lng, lat) => { return chart.convertToPixel( @@ -162,88 +152,12 @@ pixelRatio: 2, backgroundColor: '#fff' }); + // 閿�姣佸疄渚嬪苟绉婚櫎涓存椂DOM + chart.dispose(); + document.body.removeChild(div); resolve(url); }, 1000); }); - // return captureMapByBounds({ - // chart: chart, - // bounds: bounds - // }).catch((err) => { - // console.error('鎴浘澶辫触:', err); - // }); } - -/** - * 鏍规嵁缁忕含搴﹁寖鍥存埅鍙栧湴鍥惧尯鍩� - * @param {Object} params - 鎴彇鍙傛暟 - * @param {Array} params.bounds - 缁忕含搴﹁寖鍥� [minLng, minLat, maxLng, maxLat] - * @param {Object} params.chart - ECharts瀹炰緥 - * @returns {Promise<string>} 鎴彇鍖哄煙鐨刡ase64鍥剧墖 - */ -// function captureMapByBounds(params) { -// const { bounds, chart } = params; -// const [minLng, minLat, maxLng, maxLat] = bounds; - -// // 鑾峰彇鍦板浘鍧愭爣绯� -// // const geo = chart.getModel().getComponent('geo'); -// // if (!geo) return Promise.reject('鏈壘鍒板湴鍥剧粍浠�'); - -// // 灏嗙粡绾害杞崲涓哄儚绱犲潗鏍� -// const convert = (lng, lat) => { -// return chart.convertToPixel( -// { -// geoIndex: 0 -// }, -// [lng, lat] -// ); -// }; - -// // 璁$畻鍥涗釜瑙掔殑鍍忕礌鍧愭爣 -// const topLeft = convert(minLng, maxLat); -// const bottomRight = convert(maxLng, minLat); - -// // 鍒涘缓涓存椂Canvas -// const canvas = document.createElement('canvas'); -// const ctx = canvas.getContext('2d'); - -// // 鑾峰彇鍘熷鍥捐〃Canvas -// const originalCanvas = chart.getDom().querySelector('canvas'); - -// // 璁剧疆Canvas灏哄涓烘埅鍙栧尯鍩熷ぇ灏� -// topLeft[0] -= 10; -// topLeft[1] -= 10; -// bottomRight[0] += 10; -// bottomRight[1] += 10; -// topLeft[0] = Math.max(topLeft[0], 0); -// topLeft[1] = Math.max(topLeft[1], 0); -// bottomRight[0] = Math.min(bottomRight[0], originalCanvas.width); -// bottomRight[1] = Math.min(bottomRight[1], originalCanvas.height); -// const width = bottomRight[0] - topLeft[0]; -// const height = bottomRight[1] - topLeft[1]; -// canvas.width = width; -// canvas.height = height; - -// // 瑁佸壀鎸囧畾鍖哄煙 -// ctx.drawImage( -// originalCanvas, -// topLeft[0], -// topLeft[1], // 婧愬浘鍍忚鍓捣鐐� -// width, -// height, // 婧愬浘鍍忚鍓昂瀵� -// 0, -// 0, // 鐩爣鍥惧儚缁樺埗璧风偣 -// width, -// height // 鐩爣鍥惧儚缁樺埗灏哄 -// ); - -// // 杞崲涓篵ase64鍥剧墖 -// return new Promise((resolve) => { -// // 寤惰繜鎵ц纭繚缁樺埗瀹屾垚 -// setTimeout(() => { -// const base64 = canvas.toDataURL('image/png', 1.0); -// resolve(base64); -// }, 100); -// }); -// } export default { generateGridMap }; diff --git a/src/views/historymode/component/MissionReport.vue b/src/views/historymode/component/MissionReport.vue index 8168286..8cb9b57 100644 --- a/src/views/historymode/component/MissionReport.vue +++ b/src/views/historymode/component/MissionReport.vue @@ -123,6 +123,7 @@ srySceneCount: 5, sryProbByFactor: '棰楃矑鐗╋紙PM锛夌浉鍏砐澶勶紝鍗犳瘮 %锛屼富瑕佹秹鍙婂伐鍦版壃灏樻薄鏌撻棶棰樸�侀亾璺壃灏樻薄鏌撻棶棰樼瓑锛沄OC鐩稿叧X澶勶紝鍗犳瘮 %锛屼富瑕佹秹鍙婂姞娌圭珯娌规皵娉勯湶銆侀楗补鐑熸薄鏌撶瓑', + sryFocusRegion: '鑱氱劍鍖哄煙', missionInfoList: [ { missionCode: '', @@ -131,7 +132,8 @@ _airQulity: 'AQI锛�30锛堜紭锛�', mainFactor: '', _abnormalFactors: '', - sceneCount: 0 + sceneCount: 0, + _kilometres: '1000' } ], missionDetailList: [ @@ -149,6 +151,7 @@ avgValue: 38 } ], + _airQulity: 'AQI锛�30锛堜紭锛�', aqi: 30, pollutionDegree: '浼�' } @@ -246,6 +249,7 @@ return `${item.first}鐩稿叧${item.second}澶勶紝鍗犳瘮 ${Math.round(item.third * 1000) / 10}%锛屼富瑕佹秹鍙�${getPollutingProblemTypes(item.first)}绛塦; }) .join('锛�'); + templateParam.sryFocusRegion = res.data.focusRegion.join('銆�'); }); } @@ -257,18 +261,6 @@ item._abnormalFactors = item.abnormalFactors .map((factor) => factor) .join('銆�'); - return item; - }); - }); -} - -function generateMissionDetail(param) { - return dataAnalysisApi.fetchMissionDetail(param).then((res) => { - templateParam.missionDetailList = res.data.map((item, index) => { - const t = formatDateTimeRange(item.startTime, item.endTime).split(' '); - item._index = index + 1; - item._startTime = t[0]; - item._time = t[1]; item._kilometres = Math.round(item.kilometres / 1000); const keySceneMap = new Map(); @@ -285,16 +277,35 @@ `${info.count}涓�${type}锛�${info.scenes.map((s) => s.name).join('銆�')}锛塦 ) .join('銆�'); - item._dataStat = item.dataStatistics - .map( - (e) => - `${e.factor.des}锛堣寖鍥�${e.minValue}鈥�${e.maxValue}渭g/m鲁锛屽潎鍊�${e.avgValue}渭g/m鲁锛塦 - ) - .join('銆�'); + item._focusScene = + item.scenes.length > 0 + ? item.scenes.map((s) => s.name).join('銆�') + : '閬撹矾浜ら�氬瘑闆嗗尯鍜岄儴鍒嗘柦宸ュ懆杈�'; + return item; + }); + }); +} + +function generateMissionDetail(param) { + return dataAnalysisApi.fetchMissionDetail(param).then((res) => { + templateParam.missionDetailList = res.data.map((item, index) => { + const t = formatDateTimeRange(item.startTime, item.endTime).split(' '); + item._index = index + 1; + item._startTime = t[0]; + item._time = t[1]; + item._kilometres = Math.round(item.kilometres / 1000); + item._airQulity = `AQI锛�${item.aqi}锛�${item.pollutionDegree}锛塦; const factorNames = radioOptions(TYPE0).map((e) => e.name); item._dataStatistics = item.dataStatistics.filter((e) => { return factorNames.indexOf(e.factor) != -1; + }); + + radioOptions(TYPE0).forEach((f) => { + const _factor = item.dataStatistics.find((e) => e.factor == f.name); + item[`avgValue_${f.name}`] = _factor?.avgValue ?? '-'; + item[`maxValue_${f.name}`] = _factor?.maxValue ?? '-'; + item[`minValue_${f.name}`] = _factor?.minValue ?? '-'; }); return item; @@ -307,7 +318,7 @@ templateParam.clueByAreaList = res.data.map((item, index) => { return { _index: index + 1, - _area: item.sceneInfo.name + '鍛ㄨ竟', + _area: `${item.sceneInfo.type}${item.sceneInfo.name}鍛ㄨ竟`, clueByFactorList: item.clueByFactorList.map((cbf) => { return { factor: cbf.factor, @@ -395,10 +406,12 @@ pollutionDegree: item.pollutionDegree, _areaDes: `璧拌埅鍖哄煙缁忚繃${scenes.join('銆�')}`, _gridDes: `${item.gridLen}绫虫鏂瑰舰缃戞牸`, - _missionDes: `${item.missionList.map((m) => m.missioncode).join('銆�')}${item.missionList.length}娆 + _missionDes: `${item.missionList.map((m) => m.missionCode).join('銆�')}鍏�${item.missionList.length}娆 }; const _highRiskGridList = []; item.highRiskGridList.forEach((g, i) => { + // const g = item.highRiskGridList[0]; + // const i = 0; const p = generateGridFusionImg(g.factorType, item.gridFusionList).then( (url) => { const { url1, url2 } = url; @@ -414,7 +427,10 @@ _boundsDes: `缁忓害${g.bounds[0]}鑷�${g.bounds[1]}锛岀含搴�${g.bounds[2]}鑷�${g.bounds[3]}`, // 娑夊強琛楅晣 town: g.town, - _scenesDes: g.highRiskScenes.map((s) => s.name).join('銆�') + _scenesDes: + g.highRiskScenes.length > 0 + ? `娑夊強鐨勬薄鏌撳満鏅寘鎷�${g.highRiskScenes.map((s) => s.name).join('銆�')}` + : '缃戞牸鍐呭彲鑳藉瓨鍦ㄩ殣钘忛闄╂簮' }); } ); @@ -466,14 +482,16 @@ } async function generateGridFusionImg(factorName, dataList) { - var min = 1000000; - var max = 0; + let min = 1000000; + let max = 0; dataList.forEach((v) => { min = Math.min(min, getGridDataDetailFactorValue(v.data, factorName)); max = Math.max(max, getGridDataDetailFactorValue(v.data, factorName)); }); - const gridData = dataList.map((v) => { + const gridDataStand = []; + const gridDataCustom = []; + dataList.forEach((v) => { const data = getGridDataDetailFactorValue(v.data, factorName); const grid = v.cell; @@ -503,36 +521,32 @@ nextColor.map((v) => v * 255), ratio ); - return [ - { - centerLng: grid.longitude, - centerLat: grid.latitude, - value: _color1, - coordinates: [ - [grid.point1Lon, grid.point1Lat], - [grid.point2Lon, grid.point2Lat], - [grid.point3Lon, grid.point3Lat], - [grid.point4Lon, grid.point4Lat] - ] - }, - { - centerLng: grid.longitude, - centerLat: grid.latitude, - value: _color, - coordinates: [ - [grid.point1Lon, grid.point1Lat], - [grid.point2Lon, grid.point2Lat], - [grid.point3Lon, grid.point3Lat], - [grid.point4Lon, grid.point4Lat] - ] - } - ]; + + gridDataStand.push({ + centerLng: grid.longitude, + centerLat: grid.latitude, + value: _color1, + coordinates: [ + [grid.point1Lon, grid.point1Lat], + [grid.point2Lon, grid.point2Lat], + [grid.point3Lon, grid.point3Lat], + [grid.point4Lon, grid.point4Lat] + ] + }); + gridDataCustom.push({ + centerLng: grid.longitude, + centerLat: grid.latitude, + value: _color, + coordinates: [ + [grid.point1Lon, grid.point1Lat], + [grid.point2Lon, grid.point2Lat], + [grid.point3Lon, grid.point3Lat], + [grid.point4Lon, grid.point4Lat] + ] + }); }); - if (gridData[0] == undefined || gridData[1] == undefined) { - console.log(gridData); - } - const url1 = await chartMap.generateGridMap(gridData[0]); - const url2 = await chartMap.generateGridMap(gridData[1]); + const url1 = await chartMap.generateGridMap(gridDataStand); + const url2 = await chartMap.generateGridMap(gridDataCustom); if (gridBase64Url.value == null) { gridBase64Url.value = url1; } -- Gitblit v1.9.3