格点雨量

src/api/globalMap/gridPointRainfall.ts

@@ -0,0 +1,20 @@
+import request from '@/utils/request';
+
+export const getRainfallCode = (data) => {
+  return request({
+    url: '/api/gateway/v2/get_rainfall_code',
+    method: 'post',
+    data: {
+      query: {
+        ...data
+      }
+    }
+  });
+};
+
+export const getRainfallInfo = (code) => {
+  return request({
+    url: '/api/rainfall/gdyl/info/' + code,
+    method: 'get'
+  });
+};

src/types/components.d.ts

@@ -20,6 +20,8 @@ declare module 'vue' {
     ElBreadcrumb: typeof import('element-plus/es')['ElBreadcrumb']
     ElBreadcrumbItem: typeof import('element-plus/es')['ElBreadcrumbItem']
     ElButton: typeof import('element-plus/es')['ElButton']
+    ElCard: typeof import('element-plus/es')['ElCard']
+    ElCheckbox: typeof import('element-plus/es')['ElCheckbox']
     ElCol: typeof import('element-plus/es')['ElCol']
     ElColorPicker: typeof import('element-plus/es')['ElColorPicker']
     ElConfigProvider: typeof import('element-plus/es')['ElConfigProvider']
@@ -40,15 +42,28 @@ declare module 'vue' {
     ElMenuItem: typeof import('element-plus/es')['ElMenuItem']
     ElOption: typeof import('element-plus/es')['ElOption']
     ElPagination: typeof import('element-plus/es')['ElPagination']
+    ElPopover: typeof import('element-plus/es')['ElPopover']
+    ElRadio: typeof import('element-plus/es')['ElRadio']
+    ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup']
     ElRow: typeof import('element-plus/es')['ElRow']
     ElScrollbar: typeof import('element-plus/es')['ElScrollbar']
     ElSelect: typeof import('element-plus/es')['ElSelect']
+    ElSkeleton: typeof import('element-plus/es')['ElSkeleton']
+    ElSkeletonItem: typeof import('element-plus/es')['ElSkeletonItem']
     ElSlider: typeof import('element-plus/es')['ElSlider']
+    ElStep: typeof import('element-plus/es')['ElStep']
+    ElSteps: typeof import('element-plus/es')['ElSteps']
     ElSubMenu: typeof import('element-plus/es')['ElSubMenu']
     ElSwitch: typeof import('element-plus/es')['ElSwitch']
+    ElTable: typeof import('element-plus/es')['ElTable']
+    ElTableColumn: typeof import('element-plus/es')['ElTableColumn']
+    ElTabPane: typeof import('element-plus/es')['ElTabPane']
+    ElTabs: typeof import('element-plus/es')['ElTabs']
     ElTimeline: typeof import('element-plus/es')['ElTimeline']
     ElTimelineItem: typeof import('element-plus/es')['ElTimelineItem']
+    ElTooltip: typeof import('element-plus/es')['ElTooltip']
     ElTree: typeof import('element-plus/es')['ElTree']
+    ElTreeSelect: typeof import('element-plus/es')['ElTreeSelect']
     ElUpload: typeof import('element-plus/es')['ElUpload']
     FileUpload: typeof import('./../components/FileUpload/index.vue')['default']
     FooterSection: typeof import('./../components/FooterSection/index.vue')['default']
@@ -59,6 +74,7 @@ declare module 'vue' {
     HikvisionPlayer: typeof import('./../components/HKVideo/hikvision-player.vue')['default']
     HKVideo: typeof import('./../components/HKVideo/index.vue')['default']
     IconSelect: typeof import('./../components/IconSelect/index.vue')['default']
+    IEpUploadFilled: typeof import('~icons/ep/upload-filled')['default']
     IFrame: typeof import('./../components/iFrame/index.vue')['default']
     ImagePreview: typeof import('./../components/ImagePreview/index.vue')['default']
     ImageUpload: typeof import('./../components/ImageUpload/index.vue')['default']
@@ -94,4 +110,7 @@ declare module 'vue' {
     YMapold: typeof import('./../components/Map/YMapold.vue')['default']
     YztMap: typeof import('./../components/Map/YztMap/index.vue')['default']
   }
+  export interface ComponentCustomProperties {
+    vLoading: typeof import('element-plus/es')['ElLoadingDirective']
+  }
 }

src/views/globalMap/RightMenu/GridPointRainfall.vue

@@ -8,6 +8,7 @@
 <script lang="ts" setup name="GridPointRainfall">
 import { option9 } from '@/views/globalMap/RightMenu/echartOptions';
 import AMapLoader from '@amap/amap-jsapi-loader';
+import { getRainfallCode, getRainfallInfo } from '@/api/globalMap/gridPointRainfall';
 
 interface Props {
   modelValue: boolean;
@@ -38,11 +39,30 @@ onMounted(() => {
       }
     });
   });
-  chartOption.value.series[0].data = [820, 932, 901, 934, 1290, 1330];
-  chartOption.value.series[1].data = ['', '', '', '', '', 1330, 901, 934, 1290, 1330, 1320];
+  getRainfallCode({
+    longitude: props.location[0],
+    latitude: props.location[1]
+  }).then((res) => {
+    getRainfallInfo(res.rows[0].code).then((res2) => {
+      const data = res2.data.rainfallHistory;
+      const data2 = res2.data.rainfallFuture;
+      const data3 = [];
+      data.forEach(() => {
+        data3.push('');
+      });
+      data3[data3.length - 1] = data[data2.length - 1].value;
+      data2.forEach((item) => {
+        data3.push(item.hour);
+      });
+      chartOption.value.series[0].data = res2.data.rainfallHistory;
+      chartOption.value.series[1].data = data3;
+    });
+  });
+
 });
-</script>
+onMounted(() => {
 
-<style lang="scss" scoped>
+});
+</script>
 
-</style>
+<style lang="scss" scoped></style>