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

This commit is contained in:
Uyarn 2022-07-27 15:41:24 +08:00
commit 0dffd28a46
13 changed files with 31 additions and 24 deletions

View File

@ -2,6 +2,7 @@
"extends": [ "extends": [
"plugin:@typescript-eslint/recommended", "plugin:@typescript-eslint/recommended",
"eslint-config-airbnb-base", "eslint-config-airbnb-base",
"@vue/typescript/recommended",
"plugin:vue/vue3-recommended", "plugin:vue/vue3-recommended",
"plugin:vue-scoped-css/base", "plugin:vue-scoped-css/base",
"plugin:prettier/recommended" "plugin:prettier/recommended"

View File

@ -20,5 +20,6 @@
"[javascript]": { "[javascript]": {
"editor.formatOnSave": true, "editor.formatOnSave": true,
"editor.defaultFormatter": "dbaeumer.vscode-eslint" "editor.defaultFormatter": "dbaeumer.vscode-eslint"
} },
"cSpell.words": ["tdesign", "tvision", "echarts", "nprogress", "commitlint", "stylelint", "pinia", "qrcode"]
} }

View File

@ -17,7 +17,7 @@
### 项目简介 ### 项目简介
TDesign Vue Next Starter 是一个基于 TDesign使用 `Vue3`、`Vite2`、`Pinia`、`TypeScript` 开发,可进行个性化主题配置,旨在提供项目开箱即用的、配置式的中后台项目。 TDesign Vue Next Starter 是一个基于 TDesign使用 `Vue3`、`Vite2`、`Pinia`、`TypeScript` 开发,可进行个性化主题配置,旨在提供项目开箱即用的、配置式的中后台项目。
<p> <p>
<a href="http://tdesign.tencent.com/starter/vue-next/">在线预览</a> <a href="http://tdesign.tencent.com/starter/vue-next/">在线预览</a>

View File

@ -27,15 +27,15 @@
"qrcode.vue": "^3.2.2", "qrcode.vue": "^3.2.2",
"qs": "^6.10.5", "qs": "^6.10.5",
"tdesign-icons-vue-next": "^0.1.1", "tdesign-icons-vue-next": "^0.1.1",
"tdesign-vue-next": "0.18.0", "tdesign-vue-next": "0.18.1",
"tvision-color": "^1.3.1", "tvision-color": "^1.3.1",
"vue": "^3.2.31", "vue": "^3.2.31",
"vue-clipboard3": "^2.0.0", "vue-clipboard3": "^2.0.0",
"vue-router": "~4.0.11" "vue-router": "~4.0.11"
}, },
"devDependencies": { "devDependencies": {
"@commitlint/cli": "^16.2.1", "@commitlint/cli": "^17.0.3",
"@commitlint/config-conventional": "^16.2.1", "@commitlint/config-conventional": "^17.0.3",
"@types/echarts": "^4.9.10", "@types/echarts": "^4.9.10",
"@types/lodash": "^4.14.182", "@types/lodash": "^4.14.182",
"@types/qs": "^6.9.7", "@types/qs": "^6.9.7",
@ -45,6 +45,7 @@
"@vitejs/plugin-vue": "^2.3.1", "@vitejs/plugin-vue": "^2.3.1",
"@vitejs/plugin-vue-jsx": "^1.1.7", "@vitejs/plugin-vue-jsx": "^1.1.7",
"@vue/compiler-sfc": "^3.0.5", "@vue/compiler-sfc": "^3.0.5",
"@vue/eslint-config-typescript": "^11.0.0",
"commitizen": "^4.2.4", "commitizen": "^4.2.4",
"cz-conventional-changelog": "^3.3.0", "cz-conventional-changelog": "^3.3.0",
"eslint": "^7.32.0", "eslint": "^7.32.0",
@ -52,7 +53,7 @@
"eslint-config-prettier": "^8.3.0", "eslint-config-prettier": "^8.3.0",
"eslint-plugin-import": "^2.24.2", "eslint-plugin-import": "^2.24.2",
"eslint-plugin-prettier": "^4.0.0", "eslint-plugin-prettier": "^4.0.0",
"eslint-plugin-vue": "^7.16.0", "eslint-plugin-vue": "^9.2.0",
"eslint-plugin-vue-scoped-css": "^2.2.0", "eslint-plugin-vue-scoped-css": "^2.2.0",
"husky": "^7.0.4", "husky": "^7.0.4",
"less": "^4.1.1", "less": "^4.1.1",

View File

@ -3,7 +3,7 @@
<t-head-menu :class="menuCls" :theme="theme" expand-type="popup" :value="active"> <t-head-menu :class="menuCls" :theme="theme" expand-type="popup" :value="active">
<template #logo> <template #logo>
<span v-if="showLogo" class="header-logo-container" @click="handleNav('/dashboard/base')"> <span v-if="showLogo" class="header-logo-container" @click="handleNav('/dashboard/base')">
<LogoFull class="t-logo" /> <logo-full class="t-logo" />
</span> </span>
<div v-else class="header-operate-left"> <div v-else class="header-operate-left">
<t-button theme="default" shape="square" variant="text" @click="changeCollapsed"> <t-button theme="default" shape="square" variant="text" @click="changeCollapsed">
@ -12,7 +12,7 @@
<search :layout="layout" /> <search :layout="layout" />
</div> </div>
</template> </template>
<MenuContent v-show="layout !== 'side'" class="header-menu" :nav-data="menu" /> <menu-content v-show="layout !== 'side'" class="header-menu" :nav-data="menu" />
<template #operations> <template #operations>
<div class="operations-container"> <div class="operations-container">
<!-- 搜索框 --> <!-- 搜索框 -->

View File

@ -3,8 +3,8 @@ import { useRouter } from 'vue-router';
import { prefix } from '@/config/global'; import { prefix } from '@/config/global';
import pgk from '../../../package.json'; import pgk from '../../../package.json';
import MenuContent from './MenuContent'; import MenuContent from './MenuContent';
import tLogo from '@/assets/assets-t-logo.svg?component'; import AssetLogo from '@/assets/assets-t-logo.svg?component';
import tLogoFull from '@/assets/assets-logo-full.svg?component'; import AssetLogoFull from '@/assets/assets-logo-full.svg?component';
import { useSettingStore } from '@/store'; import { useSettingStore } from '@/store';
import { getActive } from '@/router'; import { getActive } from '@/router';
@ -61,8 +61,9 @@ const useComputed = (props) => {
export default defineComponent({ export default defineComponent({
name: 'SideNav', name: 'SideNav',
components: { components: {
tLogoFull, AssetLogoFull,
tLogo, AssetLogo,
MenuContent,
}, },
props: { props: {
menu: { menu: {
@ -144,9 +145,9 @@ export default defineComponent({
this.showLogo && ( this.showLogo && (
<span class={`${prefix}-side-nav-logo-wrapper`} onClick={this.goHome}> <span class={`${prefix}-side-nav-logo-wrapper`} onClick={this.goHome}>
{this.collapsed ? ( {this.collapsed ? (
<tLogo class={`${prefix}-side-nav-logo-t-logo`} /> <asset-logo class={`${prefix}-side-nav-logo-t-logo`} />
) : ( ) : (
<t-logo-full class={`${prefix}-side-nav-logo-tdesign-logo`} /> <asset-logo-full class={`${prefix}-side-nav-logo-tdesign-logo`} />
)} )}
</span> </span>
), ),
@ -157,7 +158,7 @@ export default defineComponent({
), ),
}} }}
> >
<MenuContent navData={this.menu} /> <menu-content navData={this.menu} />
</t-menu> </t-menu>
<div class={`${prefix}-side-nav-placeholder${this.collapsed ? '-hidden' : ''}`}></div> <div class={`${prefix}-side-nav-placeholder${this.collapsed ? '-hidden' : ''}`}></div>
</div> </div>

View File

@ -54,7 +54,7 @@
:value="COLOR_OPTIONS[COLOR_OPTIONS.length - 1]" :value="COLOR_OPTIONS[COLOR_OPTIONS.length - 1]"
class="setting-layout-color-group dynamic-color-btn" class="setting-layout-color-group dynamic-color-btn"
> >
<ColorContainer :value="COLOR_OPTIONS[COLOR_OPTIONS.length - 1]" /> <color-container :value="COLOR_OPTIONS[COLOR_OPTIONS.length - 1]" />
</t-radio-button> </t-radio-button>
</t-popup> </t-popup>
</div> </div>
@ -64,7 +64,7 @@
<t-radio-group v-model="formData.layout"> <t-radio-group v-model="formData.layout">
<div v-for="(item, index) in LAYOUT_OPTION" :key="index" class="setting-layout-drawer"> <div v-for="(item, index) in LAYOUT_OPTION" :key="index" class="setting-layout-drawer">
<t-radio-button :key="index" :value="item"> <t-radio-button :key="index" :value="item">
<Thumbnail :src="getThumbnailUrl(item)" /> <thumbnail :src="getThumbnailUrl(item)" />
</t-radio-button> </t-radio-button>
</div> </div>
</t-radio-group> </t-radio-group>

View File

@ -7,7 +7,7 @@
<!-- 列表排名 --> <!-- 列表排名 -->
<rank-list class="row-container" /> <rank-list class="row-container" />
<!-- 出入库概览 --> <!-- 出入库概览 -->
<over-view class="row-container" /> <output-overview class="row-container" />
</div> </div>
</template> </template>
@ -18,10 +18,10 @@ export default {
</script> </script>
<script setup lang="ts"> <script setup lang="ts">
import TopPanel from './components/top-panel.vue'; import TopPanel from './components/TopPanel.vue';
import MiddleChart from './components/middle-chart.vue'; import MiddleChart from './components/MiddleChart.vue';
import RankList from './components/rank-list.vue'; import RankList from './components/RankList.vue';
import OverView from './components/overview.vue'; import OutputOverview from './components/OutputOverview.vue';
</script> </script>
<style scoped> <style scoped>

View File

@ -42,7 +42,6 @@ p {
a { a {
color: var(--td-brand-color); color: var(--td-brand-color);
text-decoration: none; text-decoration: none;
margin-right: @spacer-3;
cursor: pointer; cursor: pointer;
transition: color @anim-duration-base @anim-time-fn-easing; transition: color @anim-duration-base @anim-time-fn-easing;
@ -61,8 +60,12 @@ a {
&:focus { &:focus {
text-decoration: none; text-decoration: none;
} }
}
.t-button-link {
margin-right: @spacer-3;
&:last-child { &:last-child {
margin-right: 0; margin-right: 0;
} }
} }