已完成API地址的科学管理:

创建了API配置文件 ( src/config/api.js ):

集中管理API服务器基础地址
定义所有API端点,便于维护和扩展
使用命名常量避免硬编码
更新了主组件 ( index.vue ):

导入API配置文件
使用 API_CONFIG.BASE_URL 和 API_CONFIG.ENDPOINTS.PARETO_ANALYSIS 替换硬编码的URL
更新了帕累托分析组件 ( ParetoAnalysis.vue ):

导入API配置文件,为将来可能的API调用做好准备
这种方法的优点:

集中管理:所有API配置在一个地方,修改地址只需更改一处
易于维护:清晰的结构使代码更易理解和修改
类型安全:避免因拼写错误导致的API调用失败
环境适配:可以根据不同环境(开发、测试、生产)使用不同的配置
将来如果需要更改API地址,只需修改 src/config/api.js 文件中的 BASE_URL 即可,无需在代码中查找所有硬编码的地址。
master
huangjinysf 3 months ago
parent ab4256c90b
commit 7805a035c9

@ -0,0 +1,11 @@
// API配置文件
export const API_CONFIG = {
// API服务器基础地址
BASE_URL: 'http://192.168.110.38:8100',
// API端点
ENDPOINTS: {
HELLO: '/api/hello',
PARETO_ANALYSIS: '/api/qc/pareto'
}
}

@ -71,6 +71,7 @@
<script setup>
import { ref } from 'vue'
import { API_CONFIG } from "@/config/api"
const props = defineProps({
selectedTimeRange: {

@ -104,6 +104,7 @@
<script setup name="WmsImportResult">
import { ref, reactive, toRefs, getCurrentInstance, shallowRef } from 'vue'
import { listWmsImportResult, getWmsImportResult, delWmsImportResult, addWmsImportResult, updateWmsImportResult } from "@/api/warehouse/WmsImportResult"
import { API_CONFIG } from "@/config/api"
import ParetoAnalysis from './ParetoAnalysis.vue'
import EmptyContent from './EmptyContent.vue'
@ -187,7 +188,7 @@ function handlePareto() {
console.log(startDateStr, endDateStr);
// API
fetch(`http://192.168.110.38:8100/api/qc/pareto?start_date=${startDateStr}&end_date=${endDateStr}`)
fetch(`${API_CONFIG.BASE_URL}${API_CONFIG.ENDPOINTS.PARETO_ANALYSIS}?start_date=${startDateStr}&end_date=${endDateStr}`)
.then(response => response.json())
.then(data => {
message.value = data.message || `质检数据获取成功 (${queryForm.value.selectedTimeRange})`

Loading…
Cancel
Save