Merge branch 'develop' of github.com:Tencent/tdesign-vue-next-starter into main

This commit is contained in:
Uyarn 2022-07-12 14:31:06 +08:00
commit 1138652bf4
23 changed files with 181 additions and 136 deletions

View File

@ -1,6 +1,6 @@
{
"name": "tdesign-vue-next-starter",
"version": "0.3.0",
"version": "0.3.5",
"scripts": {
"dev:mock": "vite --open --mode mock",
"dev": "vite --open --mode development",
@ -27,7 +27,7 @@
"qrcode.vue": "^3.2.2",
"qs": "^6.10.5",
"tdesign-icons-vue-next": "^0.1.1",
"tdesign-vue-next": "0.17.3",
"tdesign-vue-next": "0.17.4",
"tvision-color": "^1.3.1",
"vue": "^3.2.31",
"vue-clipboard3": "^2.0.0",

19
src/api/detail.ts Normal file
View 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
View 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,
});
}

View 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;
}

View 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;
}

View File

@ -17,6 +17,11 @@ const crumbs = computed(() => {
pathArray.shift();
const breadcrumbs = pathArray.reduce((breadcrumbArray, path, idx) => {
// hiddenBreadcrumb
if (route.matched[idx]?.meta?.hiddenBreadcrumb || Object.values(route.params).includes(path)) {
return breadcrumbArray;
}
breadcrumbArray.push({
path,
to: breadcrumbArray[idx - 1] ? `/${breadcrumbArray[idx - 1].path}/${path}` : `/${path}`,

View File

@ -7,6 +7,10 @@ const getMenuList = (list: MenuRoute[], basePath?: string): MenuRoute[] => {
if (!list) {
return [];
}
// 如果meta中有orderNo则按照从小到大排序
list.sort((a, b) => {
return (a.meta?.orderNo || 0) - (b.meta?.orderNo || 0);
});
return list
.map((item) => {
const path = basePath ? `${basePath}/${item.path}` : item.path;

View File

@ -37,7 +37,7 @@
</div>
</div>
</template>
<t-badge :count="unreadMsg.length" :offset="[15, 21]">
<t-badge :count="unreadMsg.length" :offset="[12, 8]">
<t-button theme="default" shape="square" variant="text">
<t-icon name="mail" />
</t-button>

View File

@ -41,12 +41,8 @@ export function constructInitDashboardDataset(type: string) {
{ type: 'min', name: '最小值' },
],
},
itemStyle: {
normal: {
lineStyle: {
width: 2,
},
},
lineStyle: {
width: 2,
},
},
],
@ -278,15 +274,11 @@ export function getLineChartDataSet({
symbol: 'circle',
symbolSize: 8,
itemStyle: {
normal: {
borderColor,
borderWidth: 1,
},
borderColor,
borderWidth: 1,
},
areaStyle: {
normal: {
opacity: 0.1,
},
opacity: 0.1,
},
},
{
@ -298,10 +290,8 @@ export function getLineChartDataSet({
symbol: 'circle',
symbolSize: 8,
itemStyle: {
normal: {
borderColor,
borderWidth: 1,
},
borderColor,
borderWidth: 1,
},
},
],
@ -352,7 +342,6 @@ export function getPieChartDataSet({
radius: ['48%', '60%'],
avoidLabelOverlap: true,
selectedMode: true,
hoverAnimation: true,
silent: true,
itemStyle: {
borderColor: containerColor,
@ -377,6 +366,7 @@ export function getPieChartDataSet({
},
},
emphasis: {
scale: true,
label: {
show: true,
formatter: ['{value|{d}%}', '{name|{b}渠道占比}'].join('\n'),

View File

@ -188,10 +188,8 @@ export function getFolderLineDataSet({
],
type: 'line',
itemStyle: {
normal: {
borderColor,
borderWidth: 1,
},
borderColor,
borderWidth: 1,
},
},
{
@ -211,10 +209,8 @@ export function getFolderLineDataSet({
],
type: 'line',
itemStyle: {
normal: {
borderColor,
borderWidth: 1,
},
borderColor,
borderWidth: 1,
},
},
{
@ -234,10 +230,8 @@ export function getFolderLineDataSet({
],
type: 'line',
itemStyle: {
normal: {
borderColor,
borderWidth: 1,
},
borderColor,
borderWidth: 1,
},
},
{
@ -257,10 +251,8 @@ export function getFolderLineDataSet({
],
type: 'line',
itemStyle: {
normal: {
borderColor,
borderWidth: 1,
},
borderColor,
borderWidth: 1,
},
},
],

View File

@ -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);
}

View File

@ -82,9 +82,7 @@ export function getSmoothLineDataSet({
symbol: 'circle',
symbolSize: 8,
areaStyle: {
normal: {
opacity: 0.1,
},
opacity: 0.1,
},
},
{

View File

@ -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);
}

View File

@ -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 {

View File

@ -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 {

View File

@ -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 {

View File

@ -77,10 +77,8 @@ export function getFolderLineDataSet({
],
type: 'line',
itemStyle: {
normal: {
borderColor,
borderWidth: 1,
},
borderColor,
borderWidth: 1,
},
},
{
@ -100,10 +98,8 @@ export function getFolderLineDataSet({
],
type: 'line',
itemStyle: {
normal: {
borderColor,
borderWidth: 1,
},
borderColor,
borderWidth: 1,
},
},
{
@ -123,10 +119,8 @@ export function getFolderLineDataSet({
],
type: 'line',
itemStyle: {
normal: {
borderColor,
borderWidth: 1,
},
borderColor,
borderWidth: 1,
},
},
{
@ -146,10 +140,8 @@ export function getFolderLineDataSet({
],
type: 'line',
itemStyle: {
normal: {
borderColor,
borderWidth: 1,
},
borderColor,
borderWidth: 1,
},
},
],

View File

@ -1,13 +1,21 @@
import { useRoute, createRouter, createWebHashHistory, RouteRecordRaw } from 'vue-router';
import baseRouters from './modules/base';
import componentsRouters from './modules/components';
import othersRouters from './modules/others';
// 自动导入modules文件夹下所有ts文件
const modules = import.meta.globEager('./modules/**/*.ts');
// 路由暂存
const routeModuleList: Array<RouteRecordRaw> = [];
Object.keys(modules).forEach((key) => {
const mod = modules[key].default || {};
const modList = Array.isArray(mod) ? [...mod] : [mod];
routeModuleList.push(...modList);
});
// 关于单层路由meta 中设置 { single: true } 即可为单层路由,{ hidden: true } 即可在侧边栏隐藏该路由
// 存放动态路由
export const asyncRouterList: Array<RouteRecordRaw> = [...baseRouters, ...componentsRouters, ...othersRouters];
export const asyncRouterList: Array<RouteRecordRaw> = [...routeModuleList];
// 存放固定的路由
const defaultRouterList: Array<RouteRecordRaw> = [

View File

@ -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 {

View File

@ -10,13 +10,6 @@ declare module '*.vue' {
declare type ClassName = { [className: string]: any } | ClassName[] | string;
declare interface ImportMeta {
env: {
MODE: 'mock' | 'development' | 'test' | 'release';
};
glob: (url: string) => { url };
}
declare module '*.svg' {
const CONTENT: string;
export default CONTENT;

View File

@ -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;

View File

@ -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'

View File

@ -7,7 +7,10 @@
"sourceMap": true,
"resolveJsonModule": true,
"esModuleInterop": true,
"skipLibCheck": true,
"allowSyntheticDefaultImports": true,
"lib": ["esnext", "dom"],
"types": ["vite/client"],
"noEmit": true,
"baseUrl": "./",
"paths": {