1
This commit is contained in:
SunWuyuan
@@ -8,57 +8,162 @@
|
||||
</v-card-item>
|
||||
|
||||
<v-card-text>
|
||||
<v-row justify="center" align="center">
|
||||
<v-col cols="12" md="8" class="text-center">
|
||||
<v-avatar size="120" class="mb-4">
|
||||
<v-img
|
||||
src="https://avatars.githubusercontent.com/u/88357633?v=4"
|
||||
alt="Sunwuyuan"
|
||||
/>
|
||||
</v-avatar>
|
||||
<v-row>
|
||||
<v-col cols="12" md="8" class="mx-auto">
|
||||
<div class="d-flex flex-column align-start">
|
||||
<v-avatar size="120" class="mb-4">
|
||||
<v-img
|
||||
src="https://github.com/Sunwuyuan.png"
|
||||
alt="Sunwuyuan"
|
||||
/>
|
||||
</v-avatar>
|
||||
|
||||
<h2 class="text-h5 mb-2">Classworks</h2>
|
||||
<p class="text-body-1 mb-4">
|
||||
由 <a
|
||||
href="https://github.com/sunwuyuan"
|
||||
target="_blank"
|
||||
class="text-decoration-none font-weight-medium"
|
||||
>Sunwuyuan</a> 开发
|
||||
</p>
|
||||
<h2 class="text-h5 mb-2">Classworks</h2>
|
||||
<p class="text-body-1 mb-4">适用于班级大屏的作业板小工具</p>
|
||||
|
||||
<div class="d-flex gap-2 flex-wrap mb-6">
|
||||
<v-btn
|
||||
color="red"
|
||||
variant="tonal"
|
||||
href="https://github.com/ClassworksDev/Classworks/issues"
|
||||
target="_blank"
|
||||
prepend-icon="mdi-bug"
|
||||
>
|
||||
报告问题
|
||||
</v-btn>
|
||||
<v-btn
|
||||
variant="text"
|
||||
href="https://github.com/ClassworksDev/Classworks"
|
||||
target="_blank"
|
||||
prepend-icon="mdi-github"
|
||||
>
|
||||
前端
|
||||
</v-btn>
|
||||
<v-btn
|
||||
variant="text"
|
||||
href="https://github.com/ClassworksDev/ClassworksServer"
|
||||
target="_blank"
|
||||
prepend-icon="mdi-github"
|
||||
>
|
||||
后端
|
||||
</v-btn>
|
||||
</div>
|
||||
|
||||
<v-divider class="mb-4 w-100"></v-divider>
|
||||
|
||||
<h3 class="text-h6 mb-2">备注与致谢</h3>
|
||||
<v-list class="mb-4 bg-transparent">
|
||||
<v-list-item
|
||||
href="https://github.com/EnderWolf006/HomeworkBoard"
|
||||
target="_blank"
|
||||
append-icon="mdi-link"
|
||||
>
|
||||
<v-list-item-title>
|
||||
本项目受到 HomeworkBoard 的启发而开发
|
||||
</v-list-item-title>
|
||||
<v-list-item-subtitle>
|
||||
感谢 EnderWolf006 (@EnderWolf) fhzit(@Hellofhz) KeyFac
|
||||
等人的贡献
|
||||
</v-list-item-subtitle>
|
||||
</v-list-item>
|
||||
<v-list-item
|
||||
href="https://houlangs.com"
|
||||
target="_blank"
|
||||
append-icon="mdi-link"
|
||||
>
|
||||
<v-list-item-title>
|
||||
Classworks 由<strong>厚浪云</strong>提供
|
||||
</v-list-item-title>
|
||||
<v-list-item-subtitle>
|
||||
长江后浪推前浪 浮事新人换旧人
|
||||
</v-list-item-subtitle>
|
||||
</v-list-item>
|
||||
<v-list-item
|
||||
href="https://zerocat.houlangs.com"
|
||||
target="_blank"
|
||||
append-icon="mdi-link"
|
||||
>
|
||||
<v-list-item-title>
|
||||
感谢 ZeroCat 社区的开发者们
|
||||
</v-list-item-title>
|
||||
<v-list-item-subtitle>
|
||||
新一代，开源，编程社区
|
||||
</v-list-item-subtitle>
|
||||
</v-list-item>
|
||||
<v-divider class="ma-1"></v-divider>
|
||||
<v-list-item
|
||||
href="https://github.com/HUSX100/IslandCaller"
|
||||
target="_blank"
|
||||
append-icon="mdi-link"
|
||||
>
|
||||
<v-list-item-title>
|
||||
本项目与 IslandCaller 无关
|
||||
</v-list-item-title>
|
||||
<v-list-item-subtitle>
|
||||
IslandCaller 是由 HUSX100 开发的基于 ClassIsland
|
||||
提醒服务的轻量级点名器
|
||||
</v-list-item-subtitle>
|
||||
</v-list-item>
|
||||
<v-list-item
|
||||
href="https://classisland.tech"
|
||||
target="_blank"
|
||||
append-icon="mdi-link"
|
||||
>
|
||||
<v-list-item-title>
|
||||
本项目与 ClassIsland 无关
|
||||
</v-list-item-title>
|
||||
<v-list-item-subtitle>
|
||||
ClassIsland 是由 HelloWRC
|
||||
开发的适用于班级大屏的课表信息显示工具
|
||||
</v-list-item-subtitle>
|
||||
</v-list-item>
|
||||
</v-list>
|
||||
|
||||
<div class="d-flex justify-center gap-2 flex-wrap">
|
||||
<v-btn
|
||||
color="primary"
|
||||
variant="outlined"
|
||||
href="https://github.com/ClassworksDev/Classworks"
|
||||
target="_blank"
|
||||
prepend-icon="mdi-github"
|
||||
variant="text"
|
||||
class="mb-4"
|
||||
prepend-icon="mdi-package-variant"
|
||||
@click="showDeps = true"
|
||||
>
|
||||
前端 GitHub
|
||||
查看使用的第三方库
|
||||
</v-btn>
|
||||
<v-btn
|
||||
color="primary"
|
||||
variant="outlined"
|
||||
href="https://github.com/ClassworksDev/ClassworksServer"
|
||||
target="_blank"
|
||||
prepend-icon="mdi-github"
|
||||
|
||||
<v-dialog
|
||||
v-model="showDeps"
|
||||
transition="dialog-bottom-transition"
|
||||
fullscreen
|
||||
>
|
||||
后端 GitHub
|
||||
</v-btn>
|
||||
<v-btn
|
||||
color="primary"
|
||||
variant="outlined"
|
||||
href="https://github.com/ClassworksDev/Classworks/issues"
|
||||
target="_blank"
|
||||
prepend-icon="mdi-bug"
|
||||
>
|
||||
报告问题
|
||||
</v-btn>
|
||||
<v-card
|
||||
><v-toolbar>
|
||||
<v-btn icon="mdi-close" @click="showDeps = false"></v-btn>
|
||||
<v-toolbar-title>使用的第三方库</v-toolbar-title>
|
||||
<v-spacer></v-spacer>
|
||||
</v-toolbar>
|
||||
<v-card-text>
|
||||
<v-list>
|
||||
<v-list-item
|
||||
v-for="dep in Dependencies"
|
||||
:key="dep.name"
|
||||
:href="'https://www.npmjs.com/package/' + dep.name"
|
||||
target="_blank"
|
||||
append-icon="mdi-link"
|
||||
>
|
||||
<v-list-item-title>
|
||||
{{ dep.name }}
|
||||
</v-list-item-title>
|
||||
<v-list-item-subtitle>
|
||||
v{{ dep.version }}
|
||||
</v-list-item-subtitle>
|
||||
</v-list-item>
|
||||
</v-list>
|
||||
</v-card-text>
|
||||
</v-card>
|
||||
</v-dialog>
|
||||
|
||||
<p class="text-caption text-medium-emphasis">
|
||||
Copyright © {{ new Date().getFullYear() }} Sunwuyuan
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<p class="mt-4 text-caption text-medium-emphasis">
|
||||
GPL License © 2024
|
||||
</p>
|
||||
</v-col>
|
||||
</v-row>
|
||||
</v-card-text>
|
||||
@@ -66,7 +171,57 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import { ref, onMounted } from "vue";
|
||||
import packageJson from "../../../package.json";
|
||||
|
||||
export default {
|
||||
name: 'AboutCard'
|
||||
}
|
||||
name: "AboutCard",
|
||||
setup() {
|
||||
const Dependencies = ref([]);
|
||||
const showDeps = ref(false); // 添加对话框显示状态
|
||||
|
||||
const loadDependencies = () => {
|
||||
try {
|
||||
// 合并 dependencies 和 devDependencies
|
||||
const allDependencies = {
|
||||
...(packageJson.dependencies || {}),
|
||||
...(packageJson.devDependencies || {}),
|
||||
};
|
||||
|
||||
// 转换为数组并过滤掉不需要显示的依赖
|
||||
const deps = Object.entries(allDependencies).map(([name, version]) => ({
|
||||
name,
|
||||
version: version.replace(/[\^~]/g, ""),
|
||||
description: getDependencyDescription(name),
|
||||
}));
|
||||
|
||||
Dependencies.value = deps;
|
||||
} catch (error) {
|
||||
console.error("加载依赖信息失败:", error);
|
||||
Dependencies.value = [];
|
||||
}
|
||||
};
|
||||
|
||||
const getDependencyDescription = (name) => {
|
||||
const descriptions = {
|
||||
vue: "渐进式 JavaScript 框架",
|
||||
vuetify: "材料设计组件框架",
|
||||
axios: "Promise 基础的 HTTP 客户端",
|
||||
pinia: "Vue 状态管理库",
|
||||
"vue-router": "Vue.js 官方路由管理器",
|
||||
"@vitejs/plugin-vue": "Vite 的 Vue 插件",
|
||||
};
|
||||
return descriptions[name] || "";
|
||||
};
|
||||
|
||||
onMounted(() => {
|
||||
loadDependencies();
|
||||
});
|
||||
|
||||
return {
|
||||
Dependencies,
|
||||
showDeps,
|
||||
};
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
Reference in New Issue
Block a user