From 9783c32fcbf2ff796c193612c587208076fcc478 Mon Sep 17 00:00:00 2001 From: nightdays Date: Wed, 19 Nov 2025 17:47:20 +0800 Subject: [PATCH 01/10] =?UTF-8?q?feat:=20=E5=86=B0=E9=9B=AA=E9=98=BB?= =?UTF-8?q?=E6=96=AD=E5=A4=A7=E5=B1=8F=E6=9B=B4=E6=96=B0?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/views/cockpit/api/commonHttp.js | 44 +++++- .../cockpit/components/CockpitLayout.vue | 65 ++++++++- .../cockpit/components/EmergencyResources.vue | 12 +- .../components/ImageMarkTooltip/index.js | 26 ++-- .../components/ImageMarkTooltip/riskRoad.vue | 18 +++ .../ImageMarkTooltip/serviceFacility.vue | 51 ------- ...Tooltip.vue => serviceFacilityTooltip.vue} | 131 +++++++++++------- .../cockpit/components/WeatherWarning.vue | 31 ++++- .../cockpit/composables/ImageMarkData.js | 12 +- .../views/cockpit/composables/useMapBase.js | 61 ++++++-- .../cockpit/composables/useMapImageMark.js | 78 +++++++++-- 11 files changed, 372 insertions(+), 157 deletions(-) delete mode 100644 packages/screen/src/views/cockpit/components/ImageMarkTooltip/serviceFacility.vue rename packages/screen/src/views/cockpit/components/ImageMarkTooltip/{ImageMarkTooltip.vue => serviceFacilityTooltip.vue} (78%) diff --git a/packages/screen/src/views/cockpit/api/commonHttp.js b/packages/screen/src/views/cockpit/api/commonHttp.js index a31e253..a436756 100644 --- a/packages/screen/src/views/cockpit/api/commonHttp.js +++ b/packages/screen/src/views/cockpit/api/commonHttp.js @@ -2,7 +2,6 @@ import { request } from '@shared/utils/request' // 获取业务底图 export function getBaseMap() { - // return [...ddt] return request({ url: '/snow-ops-platform/dataDirectory/queryCatalog', method: 'GET', @@ -14,7 +13,6 @@ export function getBaseMap() { // 获取业务图 export function getBusinessMap() { - // return [...si] return request({ url: '/snow-ops-platform/dataDirectory/queryCatalog', method: 'GET', @@ -24,6 +22,48 @@ export function getBusinessMap() { }) } +// 获取所有的养护站 +export function getAllYHZList() { + return request({ + url: '/snow-ops-platform/yhz/listByDistrict', + method: 'get', + params: { + qxmc: '' + } + }) +} + + +export function getYHZDetail(params) { + return request({ + url: '/snow-ops-platform/yhz/getById', + method: 'get', + params + }) +} + +// 获得高海拔路段图 high-altitude road +export function getHighAltitudeRoadMap () { + return request({ + url: '/snow-ops-platform/dataDirectory/queryCatalog', + method: 'GET', + params: { + pcatalog: 'GHBMAP' + } + }) +} + +// 获取天气预警统计 +export function getWeatherWarningStatistics (params) { + return request({ + url: '/snow-ops-platform/weatherWarning/statistics', + method: 'GET', + params + }) +} + + + diff --git a/packages/screen/src/views/cockpit/components/CockpitLayout.vue b/packages/screen/src/views/cockpit/components/CockpitLayout.vue index 36beaf8..6b43946 100644 --- a/packages/screen/src/views/cockpit/components/CockpitLayout.vue +++ b/packages/screen/src/views/cockpit/components/CockpitLayout.vue @@ -13,8 +13,8 @@
- - + +
@@ -26,7 +26,7 @@
- + { // 加载地图业务底图 并 聚焦中心点 mapBase.loadBaseData() + + weatherWarningRef.value.loadData() }) // ==================== 常量定义 ==================== @@ -79,6 +81,9 @@ const EMERGENCY_FORCE_LAYER_ID = 'legend:emergencyForce' */ const EMERGENCY_FORCE_CACHE_TTL = 60 * 1000 +// ==================== 组件实例 ==================== +const weatherWarningRef = ref(null) + // ==================== 状态管理 ==================== const mapStore = useMapStore() @@ -101,7 +106,7 @@ const mapBase = useMapBase(mapStore) /** * 标记图hook,搭配lengendToolbar使用, 作用是点击某个图例项时,在地图上显示所有该图例的图 */ -const mapImageMark = useMapImageMark(mapStore) +const mapImageMarkHook = useMapImageMark(mapStore) /** * 应急力量数据加载状态 @@ -131,9 +136,22 @@ const emergencyForceAbortController = ref(null) /** * 工具图标列表通过key关联 * key具体有哪些,请根据LegendToolbar.vue中定义的defaultLegendItems + * 后续的ImageMarkData中也需要与这里的key值对应 */ const legendKeys = ref(['serviceFacility','riskRoad','blockEvent','weatherAlert','emergencyForce']) +/** + * 过滤标记对象,存放当前需要过滤的关键字 + */ +const filterMark = ref({ + serviceFacility: [] +}) + +/** + * 图例项 + */ +const legendToolActiveItem = ref([]) + // ==================== 工具函数 ==================== /** @@ -413,6 +431,34 @@ const renderEmergencyForcePoints = async (entityService, points, markerIcon) => // ==================== 事件处理 ==================== +/** + * 应急资源表格行被点击时触发 + */ +const handleEmergencyResourceClick = (resource) => { + // 根据区县名称,过滤养护站 + const filterList = filterMark.value.serviceFacility + const index = filterList.findIndex((item) => item == resource.qxmc) + // 实现第一次点击表示选中,第二次点击表示取消选中 + if(index > -1) filterList.splice(index, 1) + else filterList.push(resource.qxmc) + + // 当点击了某个区县,需要将养护站的legend也点亮 + const legendIndex = legendToolActiveItem.value.indexOf('serviceFacility') + // 如果过滤列表存在数据,则需要点亮legend + if(filterList.length && legendIndex == -1) { + legendToolActiveItem.value.push('serviceFacility') + } + // 如果过滤列表不存在,则需要关闭legend + if(!filterList.length && legendIndex > -1) { + legendToolActiveItem.value.splice(legendIndex, 1) + } + + mapImageMarkHook.filterYHZMark("serviceFacility", (item)=>{ + return filterList.find((filterItem) => filterItem == item.qxmc) + }) + +} + /** * 处理图例工具栏的标记切换事件 * @@ -422,10 +468,19 @@ const renderEmergencyForcePoints = async (entityService, points, markerIcon) => * @param {string} [payload.markerIcon] - 标记图标 */ const handleLegendMarkerToggle = async ({ key, active, markerIcon }) => { + if(key === 'riskRoad') { + mapBase.toggleHighAltitudeRoadMap(active) + return + } + + // 只处理应急力量图例项 if (key !== 'emergencyForce') { + if(active == false) { + filterMark.value[key] = [] + } - mapImageMark.toggleMark({ key, active, markerIcon }) + mapImageMarkHook.toggleMark({ key, active, markerIcon }) return } diff --git a/packages/screen/src/views/cockpit/components/EmergencyResources.vue b/packages/screen/src/views/cockpit/components/EmergencyResources.vue index f94967f..5a44a18 100644 --- a/packages/screen/src/views/cockpit/components/EmergencyResources.vue +++ b/packages/screen/src/views/cockpit/components/EmergencyResources.vue @@ -21,7 +21,7 @@ :class="{ 'row-alt': index % 2 === 0 }" >
{{ index + 1 }}
- {{ resource.qxmc }} + {{ resource.qxmc }} {{ resource.yhzCount }} {{ resource.wzCount }}
@@ -43,7 +43,9 @@ import { ref, onMounted } from 'vue' import { request } from '@shared/utils/request' -const resources = ref([ +const emit = defineEmits(['clickEmergencyResource']) + +const testData = [ { id: 1, name: '万州区', @@ -98,7 +100,9 @@ const resources = ref([ equipmentClass: 'red', hasAlert: false } -]) +] + +const resources = ref([]) // 请求后端接口 /district/statistics const getDistrictStatistics = async () => { @@ -106,7 +110,6 @@ const getDistrictStatistics = async () => { url: '/snow-ops-platform/district/statistics', method: 'GET' }) - console.log(res) if(res.code === '00000') { resources.value = res.data } else { @@ -240,6 +243,7 @@ onMounted(() => { .district-name { text-align: left; + cursor: pointer; } .count { diff --git a/packages/screen/src/views/cockpit/components/ImageMarkTooltip/index.js b/packages/screen/src/views/cockpit/components/ImageMarkTooltip/index.js index ab102aa..df70602 100644 --- a/packages/screen/src/views/cockpit/components/ImageMarkTooltip/index.js +++ b/packages/screen/src/views/cockpit/components/ImageMarkTooltip/index.js @@ -1,8 +1,13 @@ import { createVNode, render } from 'vue' -import ImageMarkTooltip from './ImageMarkTooltip.vue' +import serviceFacility from './serviceFacilityToolTip.vue' -class ImageMarkTooltipUI { - constructor() { +const UIMap = { + serviceFacility +} + +class ImageMarkTooltip { + constructor({ key }) { + this.key = key this.instance = null this.container = null this.entity = null @@ -22,8 +27,10 @@ class ImageMarkTooltipUI { this.entity = options.entity + const UIInstance = UIMap[this.key] + // 创建 VNode - const vnode = createVNode(ImageMarkTooltip, { + const vnode = createVNode(UIInstance, { visible: true, position: options.position || { x: 0, y: 0 }, data: options.data || {}, @@ -37,6 +44,9 @@ class ImageMarkTooltipUI { // 渲染到容器 render(vnode, this.container) this.instance = vnode.component + if(this.instance.exposed.init) { + this.instance.exposed.init() + } return this.instance } @@ -68,11 +78,7 @@ class ImageMarkTooltipUI { } } -// 创建单例实例 -const instance = new ImageMarkTooltipUI() -export const CommonTooltip = instance - -export const newImageMarkTooltip = () => { - return new ImageMarkTooltipUI() +export const newImageMarkTooltip = ({ key }) => { + return new ImageMarkTooltip({ key }) } \ No newline at end of file diff --git a/packages/screen/src/views/cockpit/components/ImageMarkTooltip/riskRoad.vue b/packages/screen/src/views/cockpit/components/ImageMarkTooltip/riskRoad.vue index 0dde344..45f33c8 100644 --- a/packages/screen/src/views/cockpit/components/ImageMarkTooltip/riskRoad.vue +++ b/packages/screen/src/views/cockpit/components/ImageMarkTooltip/riskRoad.vue @@ -1,5 +1,23 @@ - \ No newline at end of file diff --git a/packages/screen/src/views/cockpit/components/ImageMarkTooltip/ImageMarkTooltip.vue b/packages/screen/src/views/cockpit/components/ImageMarkTooltip/serviceFacilityTooltip.vue similarity index 78% rename from packages/screen/src/views/cockpit/components/ImageMarkTooltip/ImageMarkTooltip.vue rename to packages/screen/src/views/cockpit/components/ImageMarkTooltip/serviceFacilityTooltip.vue index 1b7dfd1..1626400 100644 --- a/packages/screen/src/views/cockpit/components/ImageMarkTooltip/ImageMarkTooltip.vue +++ b/packages/screen/src/views/cockpit/components/ImageMarkTooltip/serviceFacilityTooltip.vue @@ -11,8 +11,32 @@ -
- +
+ +
+ 名称: + {{ detail.mc }} +
+ +
+ 所属区县: + {{ detail.qxmc }} +
+ +
+ 应急设备: + {{ detail.sbsl }} +
+ +
+ 应急物资: + {{ detail.wzsl }} +
+ +
+ 应急人员: + {{ detail.rysl }} +
@@ -36,11 +60,7 @@ diff --git a/packages/screen/src/views/cockpit/components/PageHeader.vue b/packages/screen/src/views/cockpit/components/PageHeader.vue index c8655d6..9c55989 100644 --- a/packages/screen/src/views/cockpit/components/PageHeader.vue +++ b/packages/screen/src/views/cockpit/components/PageHeader.vue @@ -1,8 +1,6 @@ @@ -14,7 +12,7 @@ @use '@/styles/mixins.scss' as *; .page-header { - height: vh(137); + height: vw(111); background: url(../assets/img/header-bg.png) no-repeat; background-size: 100% 100%; display: flex; @@ -23,15 +21,6 @@ position: relative; } -.header-bg { - background-image: url(../assets/img/header-title-bg.png); - width: 100%; - height: vh(107); - display: flex; - align-items: center; - justify-content: center; - position: relative; -} .title { color: rgba(255, 255, 255, 1); @@ -43,24 +32,4 @@ text-align: center; } -.app-button { - position: absolute; - right: vw(40); - top: 50%; - transform: translateY(-50%); - width: vw(165); - height: vh(44); - background: url(../assets/img/header-btn-app-bg.png) no-repeat; - background-size: 100% 100%; - color: rgba(255, 255, 255, 1); - font-size: fs(16); - font-family: SourceHanSansCN-Regular, sans-serif; - border: none; - cursor: pointer; - transition: opacity 0.3s; - - &:hover { - opacity: 0.8; - } -} From 1ae5b8d1cc0bafef17dbf7cbfa170ed342537785 Mon Sep 17 00:00:00 2001 From: nightdays Date: Wed, 19 Nov 2025 18:12:53 +0800 Subject: [PATCH 04/10] =?UTF-8?q?bugfix:=20=E6=9A=82=E6=97=B6=E5=8E=BB?= =?UTF-8?q?=E6=8E=89=E5=BC=B9=E7=AA=97=E7=BB=84=E4=BB=B6?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/views/cockpit/components/ImageMarkTooltip/index.js | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/packages/screen/src/views/cockpit/components/ImageMarkTooltip/index.js b/packages/screen/src/views/cockpit/components/ImageMarkTooltip/index.js index df70602..065f926 100644 --- a/packages/screen/src/views/cockpit/components/ImageMarkTooltip/index.js +++ b/packages/screen/src/views/cockpit/components/ImageMarkTooltip/index.js @@ -1,8 +1,8 @@ import { createVNode, render } from 'vue' -import serviceFacility from './serviceFacilityToolTip.vue' +// import serviceFacility from './serviceFacilityToolTip.vue' const UIMap = { - serviceFacility + // serviceFacility } class ImageMarkTooltip { From 3d124963f97c3d265a2a719074216dab33599b15 Mon Sep 17 00:00:00 2001 From: nightdays Date: Wed, 19 Nov 2025 18:15:14 +0800 Subject: [PATCH 05/10] =?UTF-8?q?bugfi:=20=E5=86=8D=E6=AC=A1=E6=81=A2?= =?UTF-8?q?=E5=A4=8D=E5=BC=B9=E7=AA=97?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/views/cockpit/components/ImageMarkTooltip/index.js | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/screen/src/views/cockpit/components/ImageMarkTooltip/index.js b/packages/screen/src/views/cockpit/components/ImageMarkTooltip/index.js index 065f926..9355e13 100644 --- a/packages/screen/src/views/cockpit/components/ImageMarkTooltip/index.js +++ b/packages/screen/src/views/cockpit/components/ImageMarkTooltip/index.js @@ -1,8 +1,8 @@ import { createVNode, render } from 'vue' -// import serviceFacility from './serviceFacilityToolTip.vue' +import serviceFacility from './serviceFacilityToolTip.vue' const UIMap = { - // serviceFacility + serviceFacility } class ImageMarkTooltip { @@ -44,7 +44,7 @@ class ImageMarkTooltip { // 渲染到容器 render(vnode, this.container) this.instance = vnode.component - if(this.instance.exposed.init) { + if(this.instance.exposed?.init) { this.instance.exposed.init() } return this.instance From 0802468c7565c99f08e51d660e8dfbdd4a32d3b6 Mon Sep 17 00:00:00 2001 From: nightdays Date: Wed, 19 Nov 2025 18:19:41 +0800 Subject: [PATCH 06/10] =?UTF-8?q?bugfix:=20=E6=96=B0=E5=A2=9E=E5=85=BB?= =?UTF-8?q?=E6=8A=A4=E7=AB=99=E5=BC=B9=E7=AA=97?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../ImageMarkTooltip/YHZTooltip.vue | 391 ++++++++++++++++++ .../components/ImageMarkTooltip/index.js | 2 +- 2 files changed, 392 insertions(+), 1 deletion(-) create mode 100644 packages/screen/src/views/cockpit/components/ImageMarkTooltip/YHZTooltip.vue diff --git a/packages/screen/src/views/cockpit/components/ImageMarkTooltip/YHZTooltip.vue b/packages/screen/src/views/cockpit/components/ImageMarkTooltip/YHZTooltip.vue new file mode 100644 index 0000000..1626400 --- /dev/null +++ b/packages/screen/src/views/cockpit/components/ImageMarkTooltip/YHZTooltip.vue @@ -0,0 +1,391 @@ + + + + + diff --git a/packages/screen/src/views/cockpit/components/ImageMarkTooltip/index.js b/packages/screen/src/views/cockpit/components/ImageMarkTooltip/index.js index 9355e13..081f799 100644 --- a/packages/screen/src/views/cockpit/components/ImageMarkTooltip/index.js +++ b/packages/screen/src/views/cockpit/components/ImageMarkTooltip/index.js @@ -1,5 +1,5 @@ import { createVNode, render } from 'vue' -import serviceFacility from './serviceFacilityToolTip.vue' +import serviceFacility from './YHZTooltip.vue' const UIMap = { serviceFacility From 09dc7a61193dfb5c817301c20aced7d497473368 Mon Sep 17 00:00:00 2001 From: nightdays Date: Thu, 20 Nov 2025 11:08:08 +0800 Subject: [PATCH 07/10] =?UTF-8?q?feat:=20=E5=86=B0=E9=9B=AA=E9=98=BB?= =?UTF-8?q?=E6=96=AD=E5=A4=A7=E5=B1=8F=E6=96=B0=E5=A2=9E=E8=81=9A=E7=84=A6?= =?UTF-8?q?=E5=8A=9F=E8=83=BD?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- packages/screen/package.json | 19 +- .../cockpit/components/CockpitLayout.vue | 24 +- .../serviceFacilityTooltip.vue | 391 ------------------ .../cockpit/composables/useMapImageMark.js | 33 +- 4 files changed, 61 insertions(+), 406 deletions(-) delete mode 100644 packages/screen/src/views/cockpit/components/ImageMarkTooltip/serviceFacilityTooltip.vue diff --git a/packages/screen/package.json b/packages/screen/package.json index 00a2548..9091471 100644 --- a/packages/screen/package.json +++ b/packages/screen/package.json @@ -9,17 +9,18 @@ "preview": "vite preview" }, "dependencies": { - "vue": "^3.5.18", - "vue-router": "^4.6.3", - "pinia": "^3.0.3", - "element-plus": "^2.11.5", "@element-plus/icons-vue": "^2.3.2", - "echarts": "^6.0.0", - "vue-echarts": "^8.0.1", - "cesium": "^1.135.0", - "axios": "^1.13.2", + "@h5/shared": "workspace:*", + "@turf/turf": "^7.3.0", "@vueuse/core": "^14.0.0", - "@h5/shared": "workspace:*" + "axios": "^1.13.2", + "cesium": "^1.135.0", + "echarts": "^6.0.0", + "element-plus": "^2.11.5", + "pinia": "^3.0.3", + "vue": "^3.5.18", + "vue-echarts": "^8.0.1", + "vue-router": "^4.6.3" }, "devDependencies": { "@vitejs/plugin-vue": "^6.0.1", diff --git a/packages/screen/src/views/cockpit/components/CockpitLayout.vue b/packages/screen/src/views/cockpit/components/CockpitLayout.vue index 1db6ed6..69834bd 100644 --- a/packages/screen/src/views/cockpit/components/CockpitLayout.vue +++ b/packages/screen/src/views/cockpit/components/CockpitLayout.vue @@ -433,12 +433,19 @@ const renderEmergencyForcePoints = async (entityService, points, markerIcon) => * 应急资源表格行被点击时触发 */ const handleEmergencyResourceClick = (resource) => { + let focusKey = null + // 根据区县名称,过滤养护站 const filterList = filterMark.value.serviceFacility const index = filterList.findIndex((item) => item == resource.qxmc) // 实现第一次点击表示选中,第二次点击表示取消选中 - if (index > -1) filterList.splice(index, 1) - else filterList.push(resource.qxmc) + if (index > -1) { + filterList.splice(index, 1) + } + else { + filterList.push(resource.qxmc) + focusKey = resource.qxmc + } // 当点击了某个区县,需要将养护站的legend也点亮 const legendIndex = legendToolActiveItem.value.indexOf('serviceFacility') @@ -451,9 +458,16 @@ const handleEmergencyResourceClick = (resource) => { legendToolActiveItem.value.splice(legendIndex, 1) } - mapImageMarkHook.filterYHZMark("serviceFacility", (item) => { - return filterList.find((filterItem) => filterItem == item.qxmc) - }) + // 调用图例hook来进行数据的请求与图例的绘制,第一个回调函数是过滤点位,第二个是聚焦点位 + mapImageMarkHook.filterYHZMark( + "serviceFacility", + (item) => { + return filterList.find((filterItem) => filterItem == item.qxmc) + }, + (item) => { + return item.qxmc == focusKey + } + ) } diff --git a/packages/screen/src/views/cockpit/components/ImageMarkTooltip/serviceFacilityTooltip.vue b/packages/screen/src/views/cockpit/components/ImageMarkTooltip/serviceFacilityTooltip.vue deleted file mode 100644 index 1626400..0000000 --- a/packages/screen/src/views/cockpit/components/ImageMarkTooltip/serviceFacilityTooltip.vue +++ /dev/null @@ -1,391 +0,0 @@ - - - - - diff --git a/packages/screen/src/views/cockpit/composables/useMapImageMark.js b/packages/screen/src/views/cockpit/composables/useMapImageMark.js index 55535f0..135b755 100644 --- a/packages/screen/src/views/cockpit/composables/useMapImageMark.js +++ b/packages/screen/src/views/cockpit/composables/useMapImageMark.js @@ -3,6 +3,7 @@ import { getAllYHZList } from '@/views/cockpit/api/commonHttp' import ImageMarkData from './ImageMarkData' import * as Cesium from 'cesium' +import * as turf from '@turf/turf' import serviceFacilityMarkerIcon from '../assets/legendTool/服务设施icon定位.png' @@ -134,6 +135,28 @@ export const useMapImageMark = (mapStore) => { imageMarkData.tooltip.close() } + /** + * 聚焦到图片实例的中心点 + */ + const focusOnMarkers = (dataList) => { + if (!dataList || dataList.length === 0) return + const positions = dataList.map((item) => { + return [item.mapData.position[0], item.mapData.position[1]] + }) + const features = turf.points(positions) + const center = turf.center(features) + const position = center.geometry.coordinates + mapStore.viewer.camera.setView({ + destination: Cesium.Cartesian3.fromDegrees(position[0], position[1], 160000), + orientation: { + heading: Cesium.Math.toRadians(0), // 方向角 + pitch: Cesium.Math.toRadians(-90), // 俯仰角(-90 为垂直向下看) + roll: 0 // 翻滚角 + } + }) + } + + /** * 根据图标名称请求后台服务,动态加载图标列表 */ @@ -165,7 +188,7 @@ export const useMapImageMark = (mapStore) => { /** * 过滤养护站图标 */ - const filterYHZMark = async (key, filterFn) => { + const filterYHZMark = async (key, filterFn, focusFn) => { const imageMarkData = imageMarkMap[key] if (!imageMarkData) return // 取消上一次请求 @@ -175,7 +198,15 @@ export const useMapImageMark = (mapStore) => { return filterFn(item) }) clearLayerEntity(key) + // 绘制过滤出来的点 drawImageEntities(dataList) + // 聚焦聚焦函数过滤出来的点 + const focusDataList = dataList.filter((item)=>{ + return focusFn(item) + }) + if(focusDataList) { + focusOnMarkers(focusDataList) + } } /** From fad125d84328988cba9fe8fe00d164d10ecd2b79 Mon Sep 17 00:00:00 2001 From: huangchenhao <123673748@qq.com> Date: Thu, 20 Nov 2025 11:16:27 +0800 Subject: [PATCH 08/10] =?UTF-8?q?=E6=B5=8B=E8=AF=95=E4=BD=BF=E7=94=A8?= =?UTF-8?q?=E9=AB=98=E5=BE=B7=E5=9C=B0=E5=9B=BEApi=E8=8E=B7=E5=8F=96?= =?UTF-8?q?=E5=AE=9A=E4=BD=8D=E5=9D=90=E6=A0=87?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- packages/mobile/index.html | 34 ++++++--- .../src/views/Material/MaterialManagement.vue | 75 +++++++++---------- packages/shared/utils/aMap.js | 24 ++++++ 3 files changed, 81 insertions(+), 52 deletions(-) create mode 100644 packages/shared/utils/aMap.js diff --git a/packages/mobile/index.html b/packages/mobile/index.html index c408d1e..d0c1457 100644 --- a/packages/mobile/index.html +++ b/packages/mobile/index.html @@ -1,14 +1,24 @@ - - - - - - H5移动端 - - -
- - - + + + + + + + H5移动端 + + + + + +
+ + + + \ No newline at end of file diff --git a/packages/mobile/src/views/Material/MaterialManagement.vue b/packages/mobile/src/views/Material/MaterialManagement.vue index 4f4ab58..97dab2c 100644 --- a/packages/mobile/src/views/Material/MaterialManagement.vue +++ b/packages/mobile/src/views/Material/MaterialManagement.vue @@ -211,6 +211,7 @@ import { ref, onMounted, reactive, toRaw, watch } from "vue"; import { useRouter, useRoute } from "vue-router"; import { showToast, showLoadingToast } from "vant"; import { request } from "../../../../shared/utils/request"; +import { loadAMap } from "../../../../shared/utils/amap"; const router = useRouter(); const route = useRoute(); @@ -218,7 +219,7 @@ const searchValue = ref(""); // 搜索框输入值 const showPopup = ref(false); // 控制弹出层显示隐藏 const yhzDetail = ref({}); // 养护站详情数据 const materialList = ref([]); // 物资列表数据 -const INIT_FORM = { +const getInitForm = () => ({ material: { jd: "", // 物资经度 wd: "", // 物资纬度 @@ -238,8 +239,8 @@ const INIT_FORM = { remark: "", // 备注 }, photos: [], -}; -const form = reactive({ ...INIT_FORM }); // 表单 +}); +const form = reactive(getInitForm()); // 根据养护站rid获取物资列表 const getMaterialList = async (wzmc) => { @@ -281,15 +282,6 @@ onMounted(() => { // 购置日期相关 const showTimePicker = ref(false); -const currentDate = ref([ - new Date().getFullYear(), - new Date().getMonth() + 1, - new Date().getDate(), -]); -const onDateConfirm = ({ selectedValues }) => { - form.rkrq = selectedValues.join("-"); - showTimePicker.value = false; -}; // 选择单位相关 const dwField = ref(null); @@ -338,7 +330,6 @@ const handleSubmit = async () => { message: "新增成功", }); onPopupClose(); - Object.assign(form, { ...INIT_FORM }); getMaterialList(searchValue.value); } else { throw new Error(res.message); @@ -423,37 +414,38 @@ const afterRead = async (file) => { }; // 获取经纬度 -const handleGetLocation = () => { - if (!navigator.geolocation) { - showToast("您的浏览器不支持地理位置获取"); - return; +const handleGetLocation = async () => { + // 确保AMap完成加载 + if (!window.AMap) { + await loadAMap(); } - - showLoadingToast({ - message: "定位中...", + const loadingToast = showLoadingToast({ + message: "正在获取位置", forbidClick: true, + duration: 0, // 设置为0表示不会自动关闭 + zIndex: 9999, }); - navigator.geolocation.getCurrentPosition( - (position) => { - form.material.jd = position.coords.longitude.toFixed(6); - form.material.wd = position.coords.latitude.toFixed(6); - }, - (error) => { - const errorMessage = - { - 1: "位置服务被拒绝", - 2: "暂时无法获取位置", - 3: "定位超时", - }[error.code] || "定位失败"; - showToast(errorMessage); - }, - { - enableHighAccuracy: true, // 高精度模式 - timeout: 5000, // 超时时间 - maximumAge: 0, // 不缓存位置 - } - ); + AMap.plugin("AMap.Geolocation", () => { + const geolocation = new AMap.Geolocation({ + enableHighAccuracy: true, + timeout: 5000, + showMarker: false, + zoomToAccuracy: true, + }); + + geolocation.getCurrentPosition((status, result) => { + if (status === "complete") { + form.material.jd = result.position.lng.toFixed(6); + form.material.wd = result.position.lat.toFixed(6); + loadingToast.close(); + } else { + loadingToast.close(); + showToast("定位失败 请检查网络情况后重试"); + console.log("result", result); + } + }); + }); }; watch( @@ -505,6 +497,9 @@ const handleAdd = async () => { }; const onPopupClose = () => { + Object.assign(form, getInitForm()); + fileList.value = []; + [showDwPicker, showFzrPicker].forEach((v) => (v.value = false)); showPopup.value = false; }; diff --git a/packages/shared/utils/aMap.js b/packages/shared/utils/aMap.js new file mode 100644 index 0000000..62f0251 --- /dev/null +++ b/packages/shared/utils/aMap.js @@ -0,0 +1,24 @@ +export function loadAMap() { + return new Promise((resolve, reject) => { + if (window.AMap) return resolve(); + + // 确保AMapLoader存在 + if (!window.AMapLoader) { + return reject(new Error("AMapLoader未正确加载")); + } + + window.AMapLoader.load({ + key: "848ab05db2a57a7782c153119f50dcef", + version: "2.0", + }) + .then((AMap) => { + window.AMap = AMap; + console.log("AMap初始化完成", AMap); + resolve(); + }) + .catch((err) => { + console.error("AMap加载失败:", err); + reject(new Error("地图加载失败,请检查网络连接")); + }); + }); +}; \ No newline at end of file From 259eb1f1a80b60a161af7cedf401f2475fdde798 Mon Sep 17 00:00:00 2001 From: huangchenhao <123673748@qq.com> Date: Thu, 20 Nov 2025 11:23:12 +0800 Subject: [PATCH 09/10] =?UTF-8?q?=E5=BC=95=E7=94=A8=E8=B7=AF=E5=BE=84?= =?UTF-8?q?=E5=9C=B0=E5=9D=80=E4=BF=AE=E6=94=B9?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- packages/mobile/src/views/Material/MaterialManagement.vue | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/mobile/src/views/Material/MaterialManagement.vue b/packages/mobile/src/views/Material/MaterialManagement.vue index 97dab2c..d777c81 100644 --- a/packages/mobile/src/views/Material/MaterialManagement.vue +++ b/packages/mobile/src/views/Material/MaterialManagement.vue @@ -211,7 +211,7 @@ import { ref, onMounted, reactive, toRaw, watch } from "vue"; import { useRouter, useRoute } from "vue-router"; import { showToast, showLoadingToast } from "vant"; import { request } from "../../../../shared/utils/request"; -import { loadAMap } from "../../../../shared/utils/amap"; +import { loadAMap } from "../../../../shared/utils/aMap"; const router = useRouter(); const route = useRoute(); From 695c4b75b092e726de6606814508797d93152b5e Mon Sep 17 00:00:00 2001 From: huangchenhao <123673748@qq.com> Date: Thu, 20 Nov 2025 11:25:24 +0800 Subject: [PATCH 10/10] + --- packages/mobile/src/views/Material/MaterialManagement.vue | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/mobile/src/views/Material/MaterialManagement.vue b/packages/mobile/src/views/Material/MaterialManagement.vue index d777c81..7caea4b 100644 --- a/packages/mobile/src/views/Material/MaterialManagement.vue +++ b/packages/mobile/src/views/Material/MaterialManagement.vue @@ -441,7 +441,7 @@ const handleGetLocation = async () => { loadingToast.close(); } else { loadingToast.close(); - showToast("定位失败 请检查网络情况后重试"); + showToast(result); console.log("result", result); } });