Big Change

wangjuncheng

2025-04-16 d3513d94f668cc1ab85b180001854b7652afee83

Big Change

 src/api/hpApi.js

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,48 @@
import axios from "./requestHT";

// èŽ·å–Token
export async function fetchToken() {
  try {
    const response = await axios.post("/hp/auth/getToken", {
      username: "yxxx",
      password: "c2d6bba7f0a67701a97550684e39fa5f",
      systemName: "RS_SYSTEM",
    });
    const token = response.data.data.token;
    // console.log("Token fetched:", token);
    localStorage.setItem("HPToken", token);
    return token;
  } catch (error) {
    console.error("Failed to fetch token:", error);
  }
}
// è‡ªåŠ¨é‡æ–°èŽ·å–token
export function setupTokenRefresh() {
  const intervalTime = 28 * 60 * 1000;
  fetchToken().catch((error) => {
    console.error("Initial token fetch failed:", error);
  });
  setInterval(() => {
    fetchToken().catch((error) => {
      console.error("Periodic token fetch failed:", error);
    });
  }, intervalTime);
}
// èŽ·å–雨量数据
export async function getRainfallData(year) {
  try {
    const response = await axios.post("/hp/rainfallCountyCity/getData", {
      filterObject: {
        year: 2024, // åŠ¨æ€ä¼ å…¥çš„年份参数
      },
    });
    console.log("Response:", response); // æ‰“印完整响应（调试用）
    return response.data; // å‡è®¾åŽç«¯è¿”回的数据在 response.data ä¸­
  } catch (error) {
    console.error(
      "Error fetching rainfall data:",
      error.response ? error.response.data : error.message
    );
    throw error; // æŠ›å‡ºé”™è¯¯ä»¥ä¾¿è°ƒç”¨æ–¹å¤„理
  }
}

 src/api/requestHT.js

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,64 @@
import axios from "axios";

// åˆ›å»º Axios å®žä¾‹
const instance = axios.create({
  baseURL: "/", // ä½¿ç”¨ä½ é…ç½®çš„ /auth ä»£ç†
  timeout: 1000 * 60, // è¯·æ±‚超时时间（单位：毫秒）
  headers: {
    "Content-Type": "application/json", // é»˜è®¤è¯·æ±‚头
  },
});
// è¯·æ±‚拦截器
instance.interceptors.request.use(
  (config) => {
    // åœ¨å‘送请求之前做些什么
    // ä¾‹å¦‚：添加 token æˆ–其他自定义逻辑
    const token = localStorage.getItem('HPToken'); // å‡è®¾ token å­˜å‚¨åœ¨ localStorage ä¸­
    if (token) {
      config.headers.Authorization = `Bearer ${token}`;
    }
    return config;
  },
  (error) => {
    // å¤„理请求错误
    return Promise.reject(error);
  }
);

// // å“åº”拦截器
// instance.interceptors.response.use(
//   (response) => {
//     // å¯¹å“åº”数据做点什么
//     // ä¾‹å¦‚：直接返回 data éƒ¨åˆ†
//     return response.data;
//   },
//   (error) => {
//     // å¯¹å“åº”错误做点什么
//     if (error.response) {
//       // æ ¹æ®çŠ¶æ€ç å¤„理错误
//       switch (error.response.status) {
//         case 401:
//           console.error('未授权，请重新登录');
//           break;
//         case 403:
//           console.error('禁止访问');
//           break;
//         case 404:
//           console.error('请求资源不存在');
//           break;
//         case 500:
//           console.error('服务器内部错误');
//           break;
//         default:
//           console.error('未知错误');
//       }
//     } else if (error.request) {
//       console.error('请求未收到响应');
//     } else {
//       console.error('请求出错:', error.message);
//     }
//     return Promise.reject(error);
//   }
// );

export default instance;

 src/api/requestTR.js

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,64 @@
import axios from "axios";

// åˆ›å»º Axios å®žä¾‹
const instance = axios.create({
  baseURL: "/api", // ä½¿ç”¨ä½ é…ç½®çš„ /auth ä»£ç†
  timeout: 1000 * 60, // è¯·æ±‚超时时间（单位：毫秒）
  headers: {
    "Content-Type": "application/x-www-form-urlencoded", // é»˜è®¤è¯·æ±‚头
  },
});
// è¯·æ±‚拦截器
// instance.interceptors.request.use(
//   (config) => {
//     // åœ¨å‘送请求之前做些什么
//     // ä¾‹å¦‚：添加 token æˆ–其他自定义逻辑
//     const token = localStorage.getItem('HPToken'); // å‡è®¾ token å­˜å‚¨åœ¨ localStorage ä¸­
//     if (token) {
//       config.headers.Authorization = `Bearer ${token}`;
//     }
//     return config;
//   },
//   (error) => {
//     // å¤„理请求错误
//     return Promise.reject(error);
//   }
// );

// // å“åº”拦截器
// instance.interceptors.response.use(
//   (response) => {
//     // å¯¹å“åº”数据做点什么
//     // ä¾‹å¦‚：直接返回 data éƒ¨åˆ†
//     return response.data;
//   },
//   (error) => {
//     // å¯¹å“åº”错误做点什么
//     if (error.response) {
//       // æ ¹æ®çŠ¶æ€ç å¤„理错误
//       switch (error.response.status) {
//         case 401:
//           console.error('未授权，请重新登录');
//           break;
//         case 403:
//           console.error('禁止访问');
//           break;
//         case 404:
//           console.error('请求资源不存在');
//           break;
//         case 500:
//           console.error('服务器内部错误');
//           break;
//         default:
//           console.error('未知错误');
//       }
//     } else if (error.request) {
//       console.error('请求未收到响应');
//     } else {
//       console.error('请求出错:', error.message);
//     }
//     return Promise.reject(error);
//   }
// );

export default instance;

 src/api/trApi.js

¶Ô±ÈÐÂÎļþ
@@ -0,0 +1,12 @@
import axios from "./requestTR.js";

// èŽ·å–雨量数据
export async function getData() {
    try {
      const response = await axios.get("/api/region/selectPage", {
      });
      console.log("Response:", response);
    } catch (error) {
      console.error("Error fetching data:", error);
    }
  }

 src/views/Home.vue

@@ -31,7 +31,7 @@
</template>

<script setup>
import { computed } from "vue";
import { computed, onMounted } from "vue";
import { useRoute } from "vue-router";
import { useSimStore } from "@/store/simulation";
import { storeToRefs } from "pinia";
@@ -60,6 +60,8 @@
import ResultAssess from "@/components/monifangzhen/ResultAssess.vue";
// import DangerAssess from "@/components/monifangzhen/DangerAssess.vue";
import { showDeviceDetail } from "@/store";
import { setupTokenRefresh  } from "@/api/hpApi.js"
import { getData  } from "@/api/trApi.js"

const route = useRoute();
const simStore = useSimStore();
@@ -79,7 +81,10 @@

// è®¡ç®—属性
const showDetail = computed(() => showDeviceDetail.value);

onMounted(() => {
  setupTokenRefresh()// èŽ·å–宏图token
  getData() //测试tr后端
});
// åˆå§‹åŒ–
init();
</script>

 src/views/left/KGSimOption/HistorySimulation.vue

@@ -1,7 +1,7 @@
<template>
  <div class="history-simulation">
    <div class="left-top">
      <span>历史模拟</span>
      <span @click="getRainData">历史模拟</span>
      <span class="clickable-text" @click="toggleDetails">{{
        isCollapsed ? "展开" : "收起"
      }}</span>
@@ -10,46 +10,26 @@
      <div class="input-group">
        <div class="input-item">
          <label>历史雨情:</label>
          <el-select
            v-model="rainfallHistory"
            placeholder="请选择"
            popper-class="mySelectStyle"
          >
            <el-option
              v-for="item in HistoricalRainData"
              :key="item.id"
              :label="item.name"
              :value="item.id"
            ></el-option>
          <el-select v-model="rainfallHistory" placeholder="请选择" popper-class="mySelectStyle">
            <el-option v-for="item in HistoricalRainData" :key="item.id" :label="item.name"
              :value="item.id"></el-option>
          </el-select>
        </div>
      </div>
      <div class="input-group">
        <div class="input-item">
          <label>降雨总量:</label>
          <el-input
            v-model="totalRainfall"
            type="number"
            placeholder="请输入"
          ></el-input>
          <el-input v-model="totalRainfall" type="number" placeholder="请输入"></el-input>
          <span>mm</span>
        </div>
        <div class="input-item">
          <label>降雨强度:</label>
          <el-input
            v-model="rainfallIntensity"
            type="number"
            placeholder="请输入"
          ></el-input>
          <el-input v-model="rainfallIntensity" type="number" placeholder="请输入"></el-input>
          <span>mm/h</span>
        </div>
        <div class="input-item">
          <label>降雨时长:</label>
          <el-input
            v-model="rainfallDuration"
            type="number"
            placeholder="请输入"
          ></el-input>
          <el-input v-model="rainfallDuration" type="number" placeholder="请输入"></el-input>
          <span>h</span>
        </div>
      </div>
@@ -64,13 +44,8 @@
    </div>

    <!-- ä¿å­˜æ–¹æ¡ˆå¯¹è¯æ¡† -->
    <el-dialog
      v-model="saveDialogVisible"
      title="保存方案"
      width="50%"
      :before-close="handleClose"
      custom-class="custom-dialog"
    >
    <el-dialog v-model="saveDialogVisible" title="保存方案" width="50%" :before-close="handleClose"
      custom-class="custom-dialog">
      <div class="dialog-content">
        <p><strong>所选重点沟：</strong>{{ props.selectedArea }}</p>
        <p><strong>模拟类型：</strong>历史模拟</p>
@@ -94,9 +69,16 @@
import { ElMessage } from "element-plus";
import { initeWaterPrimitiveView } from "@/utils/water";
import { useSimStore } from "@/store/simulation.js"; // å¼•å…¥ Store

import { getRainfallData  } from "@/api/hpApi.js"
// èŽ·å– Store å®žä¾‹
const simStore = useSimStore();
// æµ‹è¯•èŽ·å–雨量数据
// const getRainData = () => {
//   getRainfallData()
//     .then((a) => {
//       console.log(a, 'aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa');
//     })
// };

// æ³¨å…¥æ¨¡æ‹Ÿæ“ä½œæ–¹æ³•
const { startSimulate, endSimulate } = inject("simulateActions");

 vue.config.js

@@ -1,13 +1,41 @@
const { defineConfig } = require('@vue/cli-service');
const path = require("path");
const path = require('path');

module.exports = defineConfig({
  runtimeCompiler: false,     //新增
  productionSourceMap: false, //新增
  transpileDependencies: true,
  configureWebpack: {
    resolve: {
      alias: {
        "@": path.resolve("src")
        '@': path.resolve(__dirname, 'src')
      }
    }
  },
  //新增
  devServer: {
    port: 8080, 
    open: true, 
    host: '0.0.0.0',
    https: false, 
    hot: true, 
    proxy: {
      '/api': {
        target: 'http://192.168.1.106:8079',
        changeOrigin: true,
        pathRewrite: {
          '^/api': '' 
        },
        secure: false 
      },
      '/hp': {
        target: 'http://192.168.56.106:9511',
        changeOrigin: true,
        pathRewrite: {
          '^/hp': ''
        },
        secure: false
      }
    }
  }
})
});