diff --git a/.gitattributes b/.gitattributes
new file mode 100644
index 0000000..326caac
--- /dev/null
+++ b/.gitattributes
@@ -0,0 +1,6 @@
+*.ts text eol=lf
+*.vue text eol=lf
+*.tsx text eol=lf
+*.jsx text eol=lf
+*.html text eol=lf
+*.json text eol=lf
\ No newline at end of file
diff --git a/.github/workflows/pull-request.yml b/.github/workflows/pull-request.yml
index e456b38..280a82f 100644
--- a/.github/workflows/pull-request.yml
+++ b/.github/workflows/pull-request.yml
@@ -1,15 +1,14 @@
-# 文件名建议统一为 pull-request.yml
+# 文件名建议统一为 pull-request.yml
# 应用 test-build.yml 的 demo
name: MAIN_PULL_REQUEST
on:
pull_request:
- branches: [develop, main]
+ branches: [develop, main, site]
types: [opened, synchronize, reopened]
jobs:
call-test-build:
uses: Tencent/tdesign/.github/workflows/test-build.yml@main
-
-# install lint
\ No newline at end of file
+# install lint
diff --git a/.vscode/settings.json b/.vscode/settings.json
index 9f7e7d1..02a0913 100644
--- a/.vscode/settings.json
+++ b/.vscode/settings.json
@@ -1,4 +1,6 @@
{
+ "files.eol":"\n",
+ "editor.tabSize": 2,
"eslint.format.enable": true,
"eslint.validate": ["javascript", "javascriptreact", "typescript", "typescriptreact", "vue"],
"[vue]": {
diff --git a/package.json b/package.json
index d29b745..9952028 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
{
"name": "tdesign-vue-next-starter",
- "version": "0.7.4",
+ "version": "0.7.5",
"scripts": {
"dev:mock": "vite --open --mode mock",
"dev": "vite --open --mode development",
diff --git a/src/layouts/components/Header.vue b/src/layouts/components/Header.vue
index bffa0ba..c74bce7 100644
--- a/src/layouts/components/Header.vue
+++ b/src/layouts/components/Header.vue
@@ -48,7 +48,7 @@
-
+
@@ -71,7 +71,7 @@ import { useRouter } from 'vue-router';
import LogoFull from '@/assets/assets-logo-full.svg?component';
import { prefix } from '@/config/global';
import { getActive } from '@/router';
-import { useSettingStore } from '@/store';
+import { useSettingStore, useUserStore } from '@/store';
import type { MenuRoute } from '@/types/interface';
import MenuContent from './MenuContent.vue';
@@ -111,6 +111,7 @@ const props = defineProps({
const router = useRouter();
const settingStore = useSettingStore();
+const user = useUserStore();
const toggleSettingPanel = () => {
settingStore.updateConfig({
diff --git a/src/main.ts b/src/main.ts
index f2c8c01..5569f42 100644
--- a/src/main.ts
+++ b/src/main.ts
@@ -1,7 +1,4 @@
-import 'tdesign-vue-next/es/style/index.css';
-import '@/style/index.less';
-import './permission';
-
+/* eslint-disable simple-import-sort/imports */
import TDesign from 'tdesign-vue-next';
import { createApp } from 'vue';
@@ -9,6 +6,10 @@ import App from './App.vue';
import router from './router';
import { store } from './store';
+import 'tdesign-vue-next/es/style/index.css';
+import '@/style/index.less';
+import './permission';
+
const app = createApp(App);
app.use(TDesign);
diff --git a/src/pages/dashboard/base/components/OutputOverview.vue b/src/pages/dashboard/base/components/OutputOverview.vue
index d342d1c..a71dac0 100644
--- a/src/pages/dashboard/base/components/OutputOverview.vue
+++ b/src/pages/dashboard/base/components/OutputOverview.vue
@@ -198,8 +198,8 @@ const onStokeDataChange = (checkedValues: string[]) => {
&__content {
&-title {
- font: var(--td-font-headline-medium);
- font-weight: 400;
+ font-size: var(--td-font-size-headline-medium);
+ line-height: var(--td-line-height-headline-medium);
}
&-footer {
diff --git a/src/pages/dashboard/base/components/TopPanel.vue b/src/pages/dashboard/base/components/TopPanel.vue
index 864401f..dd139c6 100644
--- a/src/pages/dashboard/base/components/TopPanel.vue
+++ b/src/pages/dashboard/base/components/TopPanel.vue
@@ -191,8 +191,8 @@ watch(
> span {
display: inline-block;
color: var(--td-text-color-primary);
- font: var(--td-font-headline-medium);
- font-weight: 400;
+ font-size: var(--td-font-size-headline-medium);
+ line-height: var(--td-line-height-headline-medium);
}
}
diff --git a/src/pages/dashboard/detail/index.vue b/src/pages/dashboard/detail/index.vue
index 98e082d..7d28a40 100644
--- a/src/pages/dashboard/detail/index.vue
+++ b/src/pages/dashboard/detail/index.vue
@@ -29,7 +29,7 @@
@change="onMaterialChange"
/>
-
+
@@ -37,7 +37,7 @@
v-for="(item, index) in PRODUCT_LIST"
:key="index"
:product="item"
- :class="{ 'row-margin': index !== 0 }"
+ :class="{ 'row-margin': index !== 0, 'product-card': true }"
/>
@@ -166,6 +166,23 @@ const onMaterialChange = (value: string[]) => {
margin-top: 16px;
}
+.product-card {
+ padding: var(--td-comp-paddingTB-xl) var(--td-comp-paddingTB-xl);
+
+ :deep(.t-card__header) {
+ padding: 0;
+ }
+
+ :deep(.t-card__body) {
+ padding: 0;
+ margin-top: var(--td-comp-margin-xxl);
+ margin-bottom: var(--td-comp-margin-xxl);
+ }
+
+ :deep(.t-card__footer) {
+ padding: 0;
+ }
+}
// 统一增加8px;
.dashboard-detail-card {
padding: var(--td-comp-paddingTB-xxl) var(--td-comp-paddingLR-xxl);
@@ -223,8 +240,8 @@ const onMaterialChange = (value: string[]) => {
}
&__number {
- font: var(--td-font-headline-large);
- font-weight: 400;
+ font-size: var(--td-font-size-headline-medium);
+ line-height: var(--td-font-size-headline-medium);
color: var(--td-text-color-primary);
margin-bottom: var(--td-comp-margin-xxl);
}
diff --git a/src/pages/detail/advanced/components/Product.vue b/src/pages/detail/advanced/components/Product.vue
index d7128c9..c48ab97 100644
--- a/src/pages/detail/advanced/components/Product.vue
+++ b/src/pages/detail/advanced/components/Product.vue
@@ -65,7 +65,7 @@ export default defineComponent({
height: 240px;
.operator-title-icon {
- background: var(--td-brand-color-focus);
+ background: var(--td-brand-color-light);
color: var(--td-brand-color);
font-size: var(--td-comp-size-xxxl);
padding: calc(var(--td-comp-size-xxxl) - var(--td-comp-size-xl));
diff --git a/src/pages/detail/advanced/index.less b/src/pages/detail/advanced/index.less
index 0a6714d..9af9963 100644
--- a/src/pages/detail/advanced/index.less
+++ b/src/pages/detail/advanced/index.less
@@ -56,7 +56,7 @@
border-radius: var(--td-radius-medium);
.product-sub-icon {
- background: var(--td-brand-color-focus);
+ background: var(--td-brand-color-light);
color: var(--td-brand-color);
font-size: var(--td-comp-size-xxxl);
padding: calc(var(--td-comp-size-xxxl) - var(--td-comp-size-xl));
diff --git a/src/pages/detail/secondary/index.vue b/src/pages/detail/secondary/index.vue
index 05e5455..cde49dc 100644
--- a/src/pages/detail/secondary/index.vue
+++ b/src/pages/detail/secondary/index.vue
@@ -104,7 +104,7 @@ const setReadStatus = (item: NotificationItem) => {
const changeMsg = msgData.value;
changeMsg.forEach((e: NotificationItem) => {
if (e.id === item.id) {
- if (e.status) e.status = false;
+ e.status = !e.status;
}
});
store.setMsgData(changeMsg);
diff --git a/src/permission.ts b/src/permission.ts
index b22d8dc..bde2890 100644
--- a/src/permission.ts
+++ b/src/permission.ts
@@ -4,6 +4,7 @@ import NProgress from 'nprogress'; // progress bar
import { MessagePlugin } from 'tdesign-vue-next';
import { RouteRecordRaw } from 'vue-router';
+import { TOKEN_NAME } from '@/config/global';
import router from '@/router';
import { getPermissionStore, getUserStore } from '@/store';
import { PAGE_NOT_FOUND_ROUTE } from '@/utils/route/constant';
@@ -17,41 +18,39 @@ router.beforeEach(async (to, from, next) => {
const { whiteListRouters } = permissionStore;
const userStore = getUserStore();
- const { token } = userStore;
- if (token) {
+
+ if (userStore[TOKEN_NAME]) {
if (to.path === '/login') {
next();
return;
}
-
- const { asyncRoutes } = permissionStore;
-
- if (asyncRoutes && asyncRoutes.length === 0) {
- const routeList = await permissionStore.buildAsyncRoutes();
- routeList.forEach((item: RouteRecordRaw) => {
- router.addRoute(item);
- });
-
- if (to.name === PAGE_NOT_FOUND_ROUTE.name) {
- // 动态添加路由后，此处应当重定向到fullPath，否则会加载404页面内容
- next({ path: to.fullPath, replace: true, query: to.query });
- } else {
- const redirect = decodeURIComponent((from.query.redirect || to.path) as string);
- next(to.path === redirect ? { ...to, replace: true } : { path: redirect });
- return;
- }
- }
-
try {
await userStore.getUserInfo();
+ const { asyncRoutes } = permissionStore;
+
+ if (asyncRoutes && asyncRoutes.length === 0) {
+ const routeList = await permissionStore.buildAsyncRoutes();
+ routeList.forEach((item: RouteRecordRaw) => {
+ router.addRoute(item);
+ });
+
+ if (to.name === PAGE_NOT_FOUND_ROUTE.name) {
+ // 动态添加路由后，此处应当重定向到fullPath，否则会加载404页面内容
+ next({ path: to.fullPath, replace: true, query: to.query });
+ } else {
+ const redirect = decodeURIComponent((from.query.redirect || to.path) as string);
+ next(to.path === redirect ? { ...to, replace: true } : { path: redirect });
+ return;
+ }
+ }
if (router.hasRoute(to.name)) {
next();
} else {
next(`/`);
}
} catch (error) {
- MessagePlugin.error(error);
+ MessagePlugin.error(error.message);
next({
path: '/login',
query: { redirect: encodeURIComponent(to.fullPath) },
diff --git a/src/store/modules/user.ts b/src/store/modules/user.ts
index b1590a1..57bed86 100644
--- a/src/store/modules/user.ts
+++ b/src/store/modules/user.ts
@@ -4,12 +4,13 @@ import { TOKEN_NAME } from '@/config/global';
import { store, usePermissionStore } from '@/store';
const InitUserInfo = {
+ name: '', // 用户名，用于展示在页面右上角头像处
roles: [], // 前端权限模型使用 如果使用请配置modules/permission-fe.ts使用
};
export const useUserStore = defineStore('user', {
state: () => ({
- token: localStorage.getItem(TOKEN_NAME) || 'main_token', // 默认token不走权限
+ [TOKEN_NAME]: 'main_token', // 默认token不走权限
userInfo: { ...InitUserInfo },
}),
getters: {
@@ -48,7 +49,7 @@ export const useUserStore = defineStore('user', {
const res = await mockLogin(userInfo);
if (res.code === 200) {
- this.token = res.data;
+ this.setToken(res.data);
} else {
throw res;
}
@@ -57,7 +58,7 @@ export const useUserStore = defineStore('user', {
const mockRemoteUserInfo = async (token: string) => {
if (token === 'main_token') {
return {
- name: 'td_main',
+ name: 'Tencent',
roles: ['all'], // 前端权限模型使用 如果使用请配置modules/permission-fe.ts使用
};
}
@@ -66,17 +67,19 @@ export const useUserStore = defineStore('user', {
roles: ['UserIndex', 'DashboardBase', 'login'], // 前端权限模型使用 如果使用请配置modules/permission-fe.ts使用
};
};
- const res = await mockRemoteUserInfo(this.token);
+ const res = await mockRemoteUserInfo(this[TOKEN_NAME]);
this.userInfo = res;
},
async logout() {
- localStorage.removeItem(TOKEN_NAME);
- this.token = '';
+ this.removeToken();
this.userInfo = { ...InitUserInfo };
},
async removeToken() {
- this.token = '';
+ this.setToken('');
+ },
+ async setToken(token: string) {
+ this[TOKEN_NAME] = token;
},
},
persist: {
@@ -84,6 +87,8 @@ export const useUserStore = defineStore('user', {
const permissionStore = usePermissionStore();
permissionStore.initRoutes();
},
+ key: 'user',
+ paths: [TOKEN_NAME],
},
});
diff --git a/src/style/layout.less b/src/style/layout.less
index fb4cd83..f6c305f 100644
--- a/src/style/layout.less
+++ b/src/style/layout.less
@@ -55,14 +55,6 @@
background: var(--td-gray-color-13);
}
-.t-default-menu:not(.t-menu--dark) .t-menu__item.t-is-active:not(.t-is-opened) {
- background-color: var(--td-brand-color-1);
- color: var(--td-brand-color);
- .t-icon {
- color: var(--td-brand-color);
- }
-}
-
.@{starter-prefix} {
// 布局元素调整
&-wrapper {
diff --git a/src/utils/request/index.ts b/src/utils/request/index.ts
index 3dc7ed8..dfa538f 100644
--- a/src/utils/request/index.ts
+++ b/src/utils/request/index.ts
@@ -5,6 +5,7 @@ import merge from 'lodash/merge';
import { TOKEN_NAME } from '@/config/global';
import { ContentTypeEnum } from '@/constants';
+import { getUserStore } from '@/store';
import { VAxios } from './Axios';
import type { AxiosTransform, CreateAxiosOptions } from './AxiosTransform';
@@ -113,7 +114,9 @@ const transform: AxiosTransform = {
// 请求拦截器处理
requestInterceptors: (config, options) => {
// 请求之前处理config
- const token = localStorage.getItem(TOKEN_NAME);
+ const userStore = getUserStore();
+ const token = userStore[TOKEN_NAME];
+
if (token && (config as Recordable)?.requestOptions?.withToken !== false) {
// jwt token
(config as Recordable).headers.Authorization = options.authenticationScheme