mirror of
https://github.com/Tencent/tdesign-vue-next-starter.git
synced 2024-11-10 13:18:40 +08:00
feat: 将请求分类至api文件夹 (#221)
* feat: 将请求分类至api文件夹 * chore: 修改接口的导入方式为类型,防止vite打包错误
This commit is contained in:
parent
6abf4ccbb3
commit
88feed0e8c
19
src/api/detail.ts
Normal file
19
src/api/detail.ts
Normal file
|
@ -0,0 +1,19 @@
|
|||
import { request } from '@/utils/request';
|
||||
import type { ProjectListResult, PurchaseListResult } from '@/api/model/detailModel';
|
||||
|
||||
const Api = {
|
||||
PurchaseList: '/get-purchase-list',
|
||||
ProjectList: '/get-project-list',
|
||||
};
|
||||
|
||||
export function getPurchaseList() {
|
||||
return request.get<PurchaseListResult>({
|
||||
url: Api.PurchaseList,
|
||||
});
|
||||
}
|
||||
|
||||
export function getProjectList() {
|
||||
return request.get<ProjectListResult>({
|
||||
url: Api.ProjectList,
|
||||
});
|
||||
}
|
19
src/api/list.ts
Normal file
19
src/api/list.ts
Normal file
|
@ -0,0 +1,19 @@
|
|||
import { request } from '@/utils/request';
|
||||
import type { CardListResult, ListResult } from '@/api/model/listModel';
|
||||
|
||||
const Api = {
|
||||
BaseList: '/get-list',
|
||||
CardList: '/get-card-list',
|
||||
};
|
||||
|
||||
export function getList() {
|
||||
return request.get<ListResult>({
|
||||
url: Api.BaseList,
|
||||
});
|
||||
}
|
||||
|
||||
export function getCardList() {
|
||||
return request.get<CardListResult>({
|
||||
url: Api.CardList,
|
||||
});
|
||||
}
|
23
src/api/model/detailModel.ts
Normal file
23
src/api/model/detailModel.ts
Normal file
|
@ -0,0 +1,23 @@
|
|||
export interface PurchaseListResult {
|
||||
list: Array<PurchaseInfo>;
|
||||
}
|
||||
export interface PurchaseInfo {
|
||||
adminName: string;
|
||||
index: string;
|
||||
pdName: string;
|
||||
pdNum: string;
|
||||
pdType: string;
|
||||
purchaseNum: number;
|
||||
updateTime: Date;
|
||||
}
|
||||
|
||||
export interface ProjectListResult {
|
||||
list: Array<ProjectInfo>;
|
||||
}
|
||||
export interface ProjectInfo {
|
||||
adminName: string;
|
||||
adminPhone: string;
|
||||
index: number;
|
||||
name: string;
|
||||
updateTime: Date;
|
||||
}
|
26
src/api/model/listModel.ts
Normal file
26
src/api/model/listModel.ts
Normal file
|
@ -0,0 +1,26 @@
|
|||
export interface ListResult {
|
||||
list: Array<ListModel>;
|
||||
}
|
||||
export interface ListModel {
|
||||
adminName: string;
|
||||
amount: string;
|
||||
contractType: number;
|
||||
index: number;
|
||||
name: string;
|
||||
no: string;
|
||||
paymentType: number;
|
||||
status: number;
|
||||
updateTime: Date;
|
||||
}
|
||||
|
||||
export interface CardListResult {
|
||||
list: Array<CardList>;
|
||||
}
|
||||
export interface CardList {
|
||||
banner: string;
|
||||
description: string;
|
||||
index: number;
|
||||
isSetup: boolean;
|
||||
name: string;
|
||||
type: number;
|
||||
}
|
|
@ -120,8 +120,7 @@ export default {
|
|||
import { ref, onMounted } from 'vue';
|
||||
import { prefix } from '@/config/global';
|
||||
import { BASE_INFO_DATA, TABLE_COLUMNS_DATA as columns, PRODUCT_LIST } from './constants';
|
||||
import { request } from '@/utils/request';
|
||||
import { ResDataType } from '@/types/interface';
|
||||
import { getPurchaseList } from '@/api/detail';
|
||||
|
||||
import Product from './components/Product.vue';
|
||||
|
||||
|
@ -145,15 +144,12 @@ const stepUpdate = () => {
|
|||
|
||||
const fetchData = async () => {
|
||||
try {
|
||||
const res: ResDataType = await request.get({ url: '/api/get-purchase-list' });
|
||||
if (res.code === 0) {
|
||||
const { list = [] } = res.data;
|
||||
data.value = list;
|
||||
pagination.value = {
|
||||
...pagination.value,
|
||||
total: list.length,
|
||||
};
|
||||
}
|
||||
const { list } = await getPurchaseList();
|
||||
data.value = list;
|
||||
pagination.value = {
|
||||
...pagination.value,
|
||||
total: list.length,
|
||||
};
|
||||
} catch (e) {
|
||||
console.log(e);
|
||||
}
|
||||
|
|
|
@ -89,8 +89,7 @@ import { BASE_INFO_DATA, TABLE_COLUMNS as columns } from './constants';
|
|||
import { changeChartsTheme } from '@/utils/color';
|
||||
|
||||
import { prefix } from '@/config/global';
|
||||
import { ResDataType } from '@/types/interface';
|
||||
import { request } from '@/utils/request';
|
||||
import { getProjectList } from '@/api/detail';
|
||||
|
||||
echarts.use([
|
||||
TitleComponent,
|
||||
|
@ -115,15 +114,12 @@ const pagination = ref({
|
|||
|
||||
const fetchData = async () => {
|
||||
try {
|
||||
const res: ResDataType = await request.get({ url: '/api/get-project-list' });
|
||||
if (res.code === 0) {
|
||||
const { list = [] } = res.data;
|
||||
data.value = list;
|
||||
pagination.value = {
|
||||
...pagination.value,
|
||||
total: list.length,
|
||||
};
|
||||
}
|
||||
const { list } = await getProjectList();
|
||||
data.value = list;
|
||||
pagination.value = {
|
||||
...pagination.value,
|
||||
total: list.length,
|
||||
};
|
||||
} catch (e) {
|
||||
console.log(e);
|
||||
}
|
||||
|
|
|
@ -81,8 +81,7 @@ import { MessagePlugin } from 'tdesign-vue-next';
|
|||
|
||||
import { CONTRACT_STATUS, CONTRACT_TYPES, CONTRACT_PAYMENT_TYPES } from '@/constants';
|
||||
import Trend from '@/components/trend/index.vue';
|
||||
import { ResDataType } from '@/types/interface';
|
||||
import { request } from '@/utils/request';
|
||||
import { getList } from '@/api/list';
|
||||
import { useSettingStore } from '@/store';
|
||||
|
||||
import { COLUMNS } from './constants';
|
||||
|
@ -102,15 +101,12 @@ const dataLoading = ref(false);
|
|||
const fetchData = async () => {
|
||||
dataLoading.value = true;
|
||||
try {
|
||||
const res: ResDataType = await request.get({ url: '/api/get-list' });
|
||||
if (res.code === 0) {
|
||||
const { list = [] } = res.data;
|
||||
data.value = list;
|
||||
pagination.value = {
|
||||
...pagination.value,
|
||||
total: list.length,
|
||||
};
|
||||
}
|
||||
const { list } = await getList();
|
||||
data.value = list;
|
||||
pagination.value = {
|
||||
...pagination.value,
|
||||
total: list.length,
|
||||
};
|
||||
} catch (e) {
|
||||
console.log(e);
|
||||
} finally {
|
||||
|
|
|
@ -73,8 +73,7 @@ import { SearchIcon } from 'tdesign-icons-vue-next';
|
|||
import { MessagePlugin } from 'tdesign-vue-next';
|
||||
import ProductCard from '@/components/product-card/index.vue';
|
||||
import DialogForm from './components/DialogForm.vue';
|
||||
import { request } from '@/utils/request';
|
||||
import { ResDataType } from '@/types/interface';
|
||||
import { getCardList } from '@/api/list';
|
||||
|
||||
const INITIAL_DATA = {
|
||||
name: '',
|
||||
|
@ -93,15 +92,12 @@ const dataLoading = ref(true);
|
|||
|
||||
const fetchData = async () => {
|
||||
try {
|
||||
const res: ResDataType = await request.get({ url: '/api/get-card-list' });
|
||||
if (res.code === 0) {
|
||||
const { list = [] } = res.data;
|
||||
productList.value = list;
|
||||
pagination.value = {
|
||||
...pagination.value,
|
||||
total: list.length,
|
||||
};
|
||||
}
|
||||
const { list } = await getCardList();
|
||||
productList.value = list;
|
||||
pagination.value = {
|
||||
...pagination.value,
|
||||
total: list.length,
|
||||
};
|
||||
} catch (e) {
|
||||
console.log(e);
|
||||
} finally {
|
||||
|
|
|
@ -116,8 +116,7 @@
|
|||
import { ref, computed, onMounted } from 'vue';
|
||||
import { MessagePlugin } from 'tdesign-vue-next';
|
||||
import Trend from '@/components/trend/index.vue';
|
||||
import { request } from '@/utils/request';
|
||||
import { ResDataType } from '@/types/interface';
|
||||
import { getList } from '@/api/list';
|
||||
import { useSettingStore } from '@/store';
|
||||
|
||||
import {
|
||||
|
@ -198,15 +197,12 @@ const dataLoading = ref(false);
|
|||
const fetchData = async () => {
|
||||
dataLoading.value = true;
|
||||
try {
|
||||
const res: ResDataType = await request.get({ url: '/api/get-list' });
|
||||
if (res.code === 0) {
|
||||
const { list = [] } = res.data;
|
||||
data.value = list;
|
||||
pagination.value = {
|
||||
...pagination.value,
|
||||
total: list.length,
|
||||
};
|
||||
}
|
||||
const { list } = await getList();
|
||||
data.value = list;
|
||||
pagination.value = {
|
||||
...pagination.value,
|
||||
total: list.length,
|
||||
};
|
||||
} catch (e) {
|
||||
console.log(e);
|
||||
} finally {
|
||||
|
|
4
src/types/axios.d.ts
vendored
4
src/types/axios.d.ts
vendored
|
@ -19,9 +19,7 @@ export interface RequestOptions {
|
|||
|
||||
export interface Result<T = any> {
|
||||
code: number;
|
||||
type: 'success' | 'error' | 'warning';
|
||||
message: string;
|
||||
result: T;
|
||||
data: T;
|
||||
}
|
||||
|
||||
export interface AxiosRequestConfigRetry extends AxiosRequestConfig {
|
||||
|
|
5
src/types/interface.d.ts
vendored
5
src/types/interface.d.ts
vendored
|
@ -1,11 +1,6 @@
|
|||
import { RouteRecordName } from 'vue-router';
|
||||
import STYLE_CONFIG from '@/config/style';
|
||||
|
||||
export interface ResDataType {
|
||||
code: number;
|
||||
data: any;
|
||||
}
|
||||
|
||||
export interface MenuRoute {
|
||||
path: string;
|
||||
title?: string;
|
||||
|
|
|
@ -40,16 +40,16 @@ const transform: AxiosTransform = {
|
|||
throw new Error('请求接口错误');
|
||||
}
|
||||
|
||||
// 这里 message为 后台统一的字段,需要在 types.ts内修改为项目自己的接口返回格式
|
||||
const { message } = data;
|
||||
// 这里 code为 后台统一的字段,需要在 types.ts内修改为项目自己的接口返回格式
|
||||
const { code } = data;
|
||||
|
||||
// 这里逻辑可以根据项目进行修改
|
||||
const hasSuccess = data && !Reflect.has(data, 'error');
|
||||
const hasSuccess = data && code === 0;
|
||||
if (hasSuccess) {
|
||||
return data;
|
||||
return data.data;
|
||||
}
|
||||
|
||||
throw new Error(message);
|
||||
throw new Error(`请求接口错误, 错误码: ${code}`);
|
||||
},
|
||||
|
||||
// 请求前处理配置
|
||||
|
@ -162,7 +162,7 @@ function createAxios(opt?: Partial<CreateAxiosOptions>) {
|
|||
// 接口地址
|
||||
apiUrl: host,
|
||||
// 是否自动添加接口前缀
|
||||
isJoinPrefix: false,
|
||||
isJoinPrefix: true,
|
||||
// 接口前缀
|
||||
// 例如: https://www.baidu.com/api
|
||||
// urlPrefix: '/api'
|
||||
|
|
Loading…
Reference in New Issue
Block a user