WindowBird/ct
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

使用统一的路由基地址配置

Browse Source
This commit is contained in:
WindowBird 2025-10-13 09:32:00 +08:00
parent dac7e6f727
commit 4b747006e4
4 changed files with 75 additions and 68 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

62
app/components/news/new.vue
View File

@ -1,5 +1,8 @@
<script lang="ts" setup>
import {onMounted, ref, watch} from "vue";
import {onMounted, ref} from "vue";
// 导入API配置
import {getArticleApiUrl} from '~/config/api'
// 组件属性
interface Props {
@ -40,9 +43,6 @@ const props = withDefaults(defineProps<Props>(), {
error: ''
})
// API基础地址
const API_BASE_URL = 'http://192.168.2.77:4101'
// 内部文章数据（当没有外部传入时使用）
const internalArticleData = ref({
title: '',
@ -74,7 +74,7 @@ const fetchArticle = async (id: number) => {
internalLoading.value = true
internalError.value = ''
const response = await fetch(`${API_BASE_URL}/app/owArticle/get/${id}`)
const response = await fetch(getArticleApiUrl('GET', id))
if (!response.ok) {
throw new Error(`HTTP error! status: ${response.status}`)
@ -124,58 +124,6 @@ const hotTags = ref([
'共享汽车软件开发', '共享雨伞APP开发', '共享雨伞软件开发', '共享货车开发'
])
// 推荐文章数据
const recommendedArticles = ref({
solutions: [
{
title: '创特景区SaaS平台 打造专业景区共享出行综合解决方案',
date: '2025-07-08',
url: '/article/437'
},
{title: '景区共享自行车运营方案都有哪些？', date: '2023-05-12', url: '/article/407'},
{
title: '为什么说景区共享代步车的未来发展空间巨大？',
date: '2023-05-08',
url: '/article/401'
},
{
title: '景区共享单车具备什么功能特点和收费标准？',
date: '2023-04-14',
url: '/article/394'
},
{title: '新冠疫情成为共享电单车行业新契机！', date: '2020-09-08', url: '/article/300'}
],
knowledge: [
{
title: '共享电动车为何能在共享经济中独树一帜？',
date: '2023-06-29',
url: '/article/426'
},
{title: '共享经济项目为何能受到大众的青睐？', date: '2023-05-16', url: '/article/409'},
{title: '景区共享智能代步车运营方案有哪些？', date: '2023-05-10', url: '/article/402'},
{
title: '创特景区共享代步车系统具备什么样的优势？',
date: '2023-04-07',
url: '/article/391'
},
{title: '做共享电动车能赚到钱吗', date: '2020-03-07', url: '/article/308'}
],
industry: [
{
title: '景区共享电动代步车如何引领景区发展趋势？',
date: '2024-12-11',
url: '/article/432'
},
{title: '景区共享电动代步车有几种合作模式?', date: '2023-07-19', url: '/article/431'},
{title: '景区共享观光代步车为何如此火爆？', date: '2023-07-13', url: '/article/430'},
{
title: '2023年了，共享电动车项目还具备投资价值吗？',
date: '2023-07-04',
url: '/article/428'
},
{title: '共享电动车项目投资大吗？', date: '2023-07-03', url: '/article/427'}
]
})
onMounted(() => {
// 加载CSS样式文件

12
app/composables/useArticleApi.ts
View File

@ -1,4 +1,7 @@
// 文章API服务
// 导入API配置
import {getApiUrl, API_CONFIG} from '~/config/api'
export interface Article {
id: string
title: string
@ -23,9 +26,6 @@ export interface ArticleListParams {
pageSize?: number
}
// API基础地址
const API_BASE_URL = 'http://192.168.2.77:4101'
/**
* 获取文章列表
* @param params 查询参数
@ -42,13 +42,11 @@ export const fetchArticleList = async (params: ArticleListParams = {}): Promise<
if (params.pageNum) queryParams.append('pageNum', params.pageNum.toString())
if (params.pageSize) queryParams.append('pageSize', params.pageSize.toString())
const url = `${API_BASE_URL}/app/owArticle/list?${queryParams.toString()}`
const url = `${getApiUrl(API_CONFIG.ENDPOINTS.ARTICLE.LIST)}?${queryParams.toString()}`
const response = await fetch(url, {
method: 'GET',
headers: {
'Content-Type': 'application/json',
},
headers: API_CONFIG.REQUEST.HEADERS,
})
if (!response.ok) {

61
app/config/api.ts Normal file
View File

@ -0,0 +1,61 @@
/**
* API配置文件
* 统一管理所有API相关配置
*/
// API基础地址配置
export const API_CONFIG = {
// 开发环境API地址
BASE_URL: 'http://192.168.2.77:4101',
// API端点配置
ENDPOINTS: {
// 文章相关API
ARTICLE: {
LIST: '/app/owArticle/list',
GET: '/app/owArticle/get',
CREATE: '/app/owArticle/create',
UPDATE: '/app/owArticle/update',
DELETE: '/app/owArticle/delete'
}
},
// 请求配置
REQUEST: {
TIMEOUT: 10000, // 请求超时时间（毫秒）
RETRY_COUNT: 3, // 重试次数
HEADERS: {
'Content-Type': 'application/json',
'Accept': 'application/json'
}
}
} as const
/**
* 获取完整的API URL
* @param endpoint API端点
* @returns 完整的API URL
*/
export const getApiUrl = (endpoint: string): string => {
return `${API_CONFIG.BASE_URL}${endpoint}`
}
/**
* 获取文章API URL
* @param action 操作类型
* @param id 文章ID（可选）
* @returns 文章API URL
*/
export const getArticleApiUrl = (action: keyof typeof API_CONFIG.ENDPOINTS.ARTICLE, id?: string | number): string => {
const endpoint = API_CONFIG.ENDPOINTS.ARTICLE[action]
const baseUrl = getApiUrl(endpoint)
if (id && (action === 'GET' || action === 'UPDATE' || action === 'DELETE')) {
return `${baseUrl}/${id}`
}
return baseUrl
}
// 导出默认配置
export default API_CONFIG

8
app/pages/article/[id].vue
View File

@ -1,5 +1,8 @@
<script lang="ts" setup>
// 设置页面布局
// 导入API配置
import {getArticleApiUrl} from '~/config/api'
definePageMeta({
layout: 'no-navigation'
})
@ -28,16 +31,13 @@ const articleData = ref({
const loading = ref(true)
const error = ref('')
// API基础地址
const API_BASE_URL = 'http://192.168.2.77:4101'
// 获取文章详情
const fetchArticle = async (id: string) => {
try {
loading.value = true
error.value = ''
const response = await fetch(`${API_BASE_URL}/app/owArticle/get/${id}`)
const response = await fetch(getArticleApiUrl('GET', id))
if (!response.ok) {
throw new Error(`HTTP error! status: ${response.status}`)