faet: 添加bbs vue3前端

Yi.BBS.Vue3/src/components/DisscussCard.vue

@@ -0,0 +1,88 @@
+<template>
+    <el-card class="box-card" shadow="never">
+
+        <div class="card-header">
+            <el-avatar :size="50" />
+            <span class="ml-2">你好</span>
+            <el-tag class="ml-2" type="warning">V6</el-tag>
+            <el-tag class="ml-2" type="danger">管理员</el-tag>
+        </div>
+
+
+
+        <div class=" item item-title "> <el-link size="100" :underline="false" @click="enterDiscuss">Alibaba Java
+                技术图谱</el-link></div>
+        <div class=" item item-description">一个适合新手的Java学习平台</div>
+        <div class=" item item-tag"><el-tag v-for="i in 4" :key="i">教程</el-tag></div>
+        <div class=" item item-bottom">
+            <el-space :size="10" :spacer="spacer">
+                <div class="item-description">
+                    2022-12-26 15:01:35
+                </div>
+
+
+                <el-button icon="Pointer" text>
+                    点赞</el-button>
+                <el-button icon="Star" text>
+                    收藏</el-button>
+
+                <el-button icon="ChatDotRound" text>
+                    评论</el-button>
+
+
+            </el-space>
+        </div>
+    </el-card>
+</template>
+<script setup>
+import { h, ref } from 'vue'
+import { useRouter } from 'vue-router'
+const router = useRouter()
+const spacer = h(ElDivider, { direction: 'vertical' })
+const enterDiscuss = () => {
+    router.push("/article")
+}
+</script>
+<style scoped>
+.item-bottom .el-icon {
+    margin-right: 0.4rem;
+}
+
+.card-header {
+    display: flex;
+    margin-bottom: 1.5rem;
+    align-items: center;
+}
+
+.item {
+    font-size: 14px;
+    margin-bottom: 18px;
+}
+
+.box-card {
+    width: 100%;
+    min-height: 15rem;
+}
+
+.item-title {
+    /* font-size: var(--el-font-size-large); */
+}
+
+.item-description {
+    font-size: var(--el-font-size-small);
+    color: #8C8C8C;
+}
+
+.item .el-tag {
+    margin-right: 1rem;
+}
+
+.ml-2 {
+    margin-left: 1.2rem;
+}
+
+.el-link {
+    font-size: initial;
+    font-weight: 700;
+}
+</style>