From a04dbde977dd2d7250c9cc65a680adbb06da60a6 Mon Sep 17 00:00:00 2001
From: crrashh1542 <kotsuki@crrashh.com>
Date: Tue, 20 Feb 2024 09:36:17 +0800
Subject: [PATCH] =?UTF-8?q?refactor:=20=E4=BD=BF=E7=94=A8`setup`=E8=AF=AD?=
=?UTF-8?q?=E6=B3=95=E7=B3=96?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit
Signed-off-by: crrashh1542 <kotsuki@crrashh.com>
---
src/components/Appbar.vue | 66 ++++++++++++++++---------------------
src/components/Card.vue | 10 +++---
src/components/Catalog.vue | 6 ++--
src/components/Footer.vue | 6 ++--
src/components/LoadAnim.vue | 6 ++--
src/components/Navbar.vue | 49 +++++++++++++--------------
src/components/TopNav.vue | 6 ++--
src/views/MainAbout.vue | 20 +++--------
src/views/MainCategory.vue | 8 ++---
src/views/NotFound.vue | 14 ++------
10 files changed, 71 insertions(+), 120 deletions(-)
diff --git a/src/components/Appbar.vue b/src/components/Appbar.vue
index 904a635..a738798 100644
--- a/src/components/Appbar.vue
+++ b/src/components/Appbar.vue
@@ -1,33 +1,23 @@
-<script>
-const linkList =
- [{
- 'name': '主页',
- 'link': 'https://www.crrashh.com/',
- 'type': 'link'
- }, {
- 'name': '分类',
- 'link': '/category',
- 'type': 'route'
- }, {
- 'name': '关于',
- 'link': '/about',
- 'type': 'route'
- }]
-
-export default {
- name: 'MainAppbar',
- data() {
- return {
- title: 'Windows Up-to-Date',
- link: linkList
- }
- },
- methods: {
- dialogOpen(){
- let dialogEl = document.getElementById('setting')
- dialogEl.hidden = false
- }
- }
+<script setup>
+defineOptions({ name: 'WidgetAppbar' })
+
+const linkList = [{
+ 'name': '主页',
+ 'link': 'https://www.crrashh.com/',
+ 'type': 'link'
+}, {
+ 'name': '分类',
+ 'link': '/category',
+ 'type': 'route'
+}, {
+ 'name': '关于',
+ 'link': '/about',
+ 'type': 'route'
+}]
+
+function dialogOpen() {
+ let dialogEl = document.getElementById('setting')
+ dialogEl.hidden = false
}
</script>
@@ -35,18 +25,17 @@ export default {
<div class="appbar">
<!-- 左侧标题 -->
- <router-link to="/" class="title">{{ title }}</router-link>
+ <router-link to="/" class="title">Windows Up-to-Date</router-link>
<!-- 左右分隔 -->
<div class="grow"></div>
<!-- 右侧链接 -->
<div class="external">
- <span v-for="i in link" :key="i.name">
-
+ <span v-for="i in linkList" :key="i.name">
+
<!-- 如果类型是外部链接 → <a> -->
- <a v-if="i.type == 'link'" :href="i.link"
- class="link item" target="_blank">{{ i.name }}</a>
+ <a v-if="i.type == 'link'" :href="i.link" class="link item" target="_blank">{{ i.name }}</a>
<!-- 如果类型是项目内路由 → <router-link> -->
<router-link class="item" v-if="i.type == 'route'" :to="i.link">
@@ -56,7 +45,7 @@ export default {
<span><!-- 保留节目，选项必须在！ -->
<a href="#" class="item stable" @click="dialogOpen">选项</a>
</span>
-
+
</div>
</div>
</template>
@@ -96,7 +85,7 @@ export default {
display: none;
}
- .external > span > a.item {
+ .external>span>a.item {
// 链接
margin: 0 15px;
font-size: 17px;
@@ -136,4 +125,5 @@ export default {
.appbar {
--appbar-link-display: none;
}
-}</style>
+}
+</style>
diff --git a/src/components/Card.vue b/src/components/Card.vue
index 20192d7..40da480 100644
--- a/src/components/Card.vue
+++ b/src/components/Card.vue
@@ -1,10 +1,8 @@
-<script>
-import { provideFluentDesignSystem, fluentCard } from "@fluentui/web-components"
-provideFluentDesignSystem().register(fluentCard())
+<script setup>
+defineOptions({ name: 'WidgetCard' })
-export default {
- name: 'WidgetCard'
-}
+import { provideFluentDesignSystem, fluentCard } from '@fluentui/web-components'
+provideFluentDesignSystem().register(fluentCard())
</script>
<template>
diff --git a/src/components/Catalog.vue b/src/components/Catalog.vue
index 8485018..42a5bef 100644
--- a/src/components/Catalog.vue
+++ b/src/components/Catalog.vue
@@ -1,7 +1,5 @@
-<script>
-export default {
- name: 'WidgetCatalog'
-}
+<script setup>
+defineOptions({ name: 'WidgetCatalog' })
</script>
<template>
diff --git a/src/components/Footer.vue b/src/components/Footer.vue
index 763c834..9584a41 100644
--- a/src/components/Footer.vue
+++ b/src/components/Footer.vue
@@ -1,7 +1,5 @@
-<script>
-export default {
- name: 'MainFooter'
-}
+<script setup>
+defineOptions({ name: 'MainFooter' })
</script>
<template>
diff --git a/src/components/LoadAnim.vue b/src/components/LoadAnim.vue
index 19a20fe..820a1bf 100644
--- a/src/components/LoadAnim.vue
+++ b/src/components/LoadAnim.vue
@@ -1,10 +1,8 @@
-<script>
+<script setup>
import { fluentProgressRing, provideFluentDesignSystem } from '@fluentui/web-components'
provideFluentDesignSystem().register(fluentProgressRing())
-export default {
- name: 'MainLoadAnim'
-}
+defineOptions({ name: 'MainLoadAnim' })
</script>
<template>
diff --git a/src/components/Navbar.vue b/src/components/Navbar.vue
index eedcebb..63c591d 100644
--- a/src/components/Navbar.vue
+++ b/src/components/Navbar.vue
@@ -1,35 +1,27 @@
-<script>
-const navSections = [
- {
- "path": "/",
- "icon": "icon-home",
- "text": "主页"
- },
- {
- "path": "/category",
- "icon": "icon-tag",
- "text": "分类"
- },
- {
- "path": "/about",
- "icon": "icon-about",
- "text": "关于"
- }
-]
+<script setup>
+defineOptions({ name: 'WidgetNavBar' })
-export default {
- name: 'WidgetNavBar',
- data() {
- return { navSections }
- }
-}
+const navSections = [{
+ "path": "/",
+ "icon": "icon-home",
+ "text": "主页"
+},
+{
+ "path": "/category",
+ "icon": "icon-tag",
+ "text": "分类"
+},
+{
+ "path": "/about",
+ "icon": "icon-about",
+ "text": "关于"
+}]
</script>
<template>
<div class="navbar flex flex-row fixed bottom-0 left-0 w-full">
- <router-link v-for="s in navSections" :to="s.path"
- :key="s.value" class="inline text-center basis-1/3 py-2">
+ <router-link v-for="s in navSections" :to="s.path" :key="s.value" class="inline text-center basis-1/3 py-2">
<span class="icon block text-xl pt-1 pb-0.5" :class="s.icon"></span>
<span class="block text-sm py-0.5">{{ s.text }}</span>
@@ -47,9 +39,12 @@ export default {
background-color: @wu-color-bar;
backdrop-filter: blur(3px);
border-top: 1px solid @wu-color-split-line;
- .path-active { // router 活跃状态（处于当前页时）的配置 class
+
+ .path-active {
+ // router 活跃状态（处于当前页时）的配置 class
color: @wu-color-theme;
}
+
.icon::before {
height: 40px;
}
diff --git a/src/components/TopNav.vue b/src/components/TopNav.vue
index 7adce43..5777b81 100644
--- a/src/components/TopNav.vue
+++ b/src/components/TopNav.vue
@@ -1,7 +1,5 @@
-<script>
-export default {
- name: 'WidgetTopNav'
-}
+<script setup>
+defineOptions({ name: 'WidgetTopNav' })
</script>
<template>
diff --git a/src/views/MainAbout.vue b/src/views/MainAbout.vue
index 2aa27a5..729f9ad 100644
--- a/src/views/MainAbout.vue
+++ b/src/views/MainAbout.vue
@@ -1,27 +1,17 @@
-<script>
-import buildInfo from '../scripts/parseRepoInfo'
+<script setup>
+// 引入组件
import Banner from '../components/Banner.vue'
import Card from '../components/Card.vue'
+// 设定数据
+document.title = '关于项目 / Windows Up-to-Date'
+import buildInfo from '../scripts/parseRepoInfo'
const sources = [
['https://msbuilds.rg-adguard.net', 'MSFT BUFFET DATABASE'],
['https://changewindows.org', 'ChangeWindows'],
['https://bbs.pcbeta.com/viewthread-1941423-1-1.html', '远景论坛 - 2262x(2263x).2715/2700更新包和修复包下载 & 内部版本进度 & .NET CU'],
['https://community.wvbtech.com', 'wvbCommunity']
]
-
-export default {
- name: 'MainAbout',
- components: { Banner, Card },
- data() {
- return {
- buildInfo, sources
- }
- },
- setup() {
- document.title = '关于项目 / Windows Up-to-Date'
- }
-}
</script>
<template>
diff --git a/src/views/MainCategory.vue b/src/views/MainCategory.vue
index 4c41aa6..771579e 100644
--- a/src/views/MainCategory.vue
+++ b/src/views/MainCategory.vue
@@ -1,15 +1,11 @@
-<script>
+<script setup>
// 引入组件
import Card from '../components/Card.vue'
-export default {
- name: 'MainCategory',
- components: { Card }
-}
</script>
<template>
- <!-- PlaceHolder 2024-02-01 by crrashh1542 -->
+ <!-- PlaceHolder 2024-02-19 by crrashh1542 -->
</template>
<style lang="less" scoped>
diff --git a/src/views/NotFound.vue b/src/views/NotFound.vue
index 806760d..498df45 100644
--- a/src/views/NotFound.vue
+++ b/src/views/NotFound.vue
@@ -1,18 +1,8 @@
-<script>
+<script setup>
import { provideFluentDesignSystem, fluentButton } from "@fluentui/web-components"
provideFluentDesignSystem().register(fluentButton())
-export default {
- name: 'OtherNotFound',
- setup() {
- document.title = '内容不见啦！ / Windows Up-to-Date'
- },
- methods: {
- routerToHome() {
- this.$router.push('/')
- }
- }
-}
+document.title = '内容不见啦！ / Windows Up-to-Date'
</script>
<template>