xwl2023/Yi.Framework
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: 完善基础页面

Browse Source
This commit is contained in:
橙子
2023-03-10 22:02:19 +08:00
parent 30ab479315
commit 733ff867e9
385 changed files with 1815 additions and 45473 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
Yi.BBS.Vue3/src/views/AddArticle.vue
View File

@@ -3,7 +3,12 @@
<el-form label-width="120px" label-position="left">
<el-form-item label="分类：">
<el-input placeholder="请输入" />
<el-radio-group v-model="radio">
<el-radio-button label="1" >文章</el-radio-button>
<el-radio-button label="2" >主题</el-radio-button>
<el-radio-button label="3" >板块</el-radio-button>
<el-radio-button label="4" >其他</el-radio-button>
</el-radio-group>
</el-form-item>
<el-form-item label="标题：">
<el-input placeholder="请输入" />
@@ -13,10 +18,9 @@
</el-form-item>
<el-form-item label="内容：">
<MavonEdit />
<MavonEdit height="30rem" v-model="text" :codeStyle="codeStyle"/>
</el-form-item>
<el-form-item label="分面：">
<el-form-item label="封面：">
<el-input placeholder="请输入" />
</el-form-item>
<el-form-item label="标签：">
@@ -28,7 +32,10 @@
</template>
<script setup>
import MavonEdit from '@/components/MavonEdit.vue'
import { ref } from 'vue';
const text=ref("")
const radio=ref(1)
const codeStyle=ref("atom-one-dark");
</script>
<style scoped>
.submit-btn
@@ -42,4 +49,5 @@ import MavonEdit from '@/components/MavonEdit.vue'
margin: 1.5rem;
padding: 1.5rem;
}
</style>

86
Yi.BBS.Vue3/src/views/Article.vue
View File

@@ -3,16 +3,16 @@
<el-col :span="17">
<el-row class="left-div">
<el-col :span="24" >
<AvatarInfo :size="50"></AvatarInfo>
<el-col :span="24">
<AvatarInfo :size="50" :showWatching="true" :time="'2023-03-08 21:09:02'"></AvatarInfo>
<el-divider />
<h2>面试题挑战</h2>
文章详情
<el-divider class="tab-divider" />
<el-divider class="tab-divider" />
<el-space :size="10" :spacer="spacer">
<el-button icon="Pointer" text>
@@ -21,7 +21,7 @@
0</el-button>
<el-button icon="Share" text>
分享</el-button>
<el-button icon="Operation" text>
<el-button icon="Operation" text>
操作</el-button>
</el-space>
@@ -37,14 +37,54 @@
<el-col :span="7">
<el-row class="right-div">
<el-col :span="24">
<InfoCard class="art-info-right" header="文章信息" text="更多" hideDivider="true">
<template #content>
<div>
<ul class="art-info-ul">
<li>
分类： <span>文章</span>
</li>
标签： <el-tag type="success">文章</el-tag>
<el-tag type="info">资源</el-tag>
</ul>
</div>
</template>
</InfoCard>
</el-col>
<el-col :span="24">
<InfoCard class="art-info-right" header="目录" hideDivider="true">
<template #content>
<div>
<ul class="art-info-ul">
<li v-for="i in 6">
<el-button style="width: 100%;
justify-content: left" :key="你好" type="primary" text>{{i}}：第一小结</el-button>
</li>
</ul>
</div>
</template>
</InfoCard>
</el-col>
<el-col :span="24">
<InfoCard :items=items header="推荐好友" text="更多">
<template #item="temp">
<AvatarInfo />
</template>
</InfoCard>
</el-col>
<el-col :span="24">
<InfoCard :items=items header="推荐好友" text="更多">
<template #item="temp">
<AvatarInfo />
</template>
</InfoCard>
</el-col>
<el-col :span="24">
<InfoCard :items=items header="推荐好友" text="更多">
<template #item="temp">
<AvatarInfo />
</template>
</InfoCard>
</el-col>
</el-row>
</el-col>
@@ -53,9 +93,32 @@
<script setup>
import { h, ref } from 'vue'
import AvatarInfo from '@/components/AvatarInfo.vue'
import InfoCard from '../components/InfoCard.vue';
const spacer = h(ElDivider, { direction: 'vertical' })
const items = [{ user: "用户1" }, { user: "用户2" }, { user: "用户3" }]
</script>
<style scoped >
.art-info-ul span {
margin-left: 1rem;
}
.art-info-ul .el-tag {
margin-left: 1rem;
}
.art-info-ul {
padding: 0;
}
li {
list-style: none;
margin-bottom: 1rem;
}
.art-info-right {
height: 100%;
}
.left-div .el-col {
background-color: #FFFFFF;
min-height: 12rem;
@@ -98,13 +161,14 @@ h2 {
padding: 1.4rem 1.4rem 0.5rem 1.4rem;
}
.el-space {
display: flex ;
vertical-align: top ;
justify-content: space-evenly ;
display: flex;
vertical-align: top;
justify-content: space-evenly;
}
.tab-divider
{
.tab-divider {
margin-bottom: 0.5rem;
}
</style>

26
Yi.BBS.Vue3/src/views/Index.vue
View File

@@ -1,5 +1,4 @@
<template >
<el-row :gutter="20" class="top-div" >
<el-col :span="17">
@@ -36,9 +35,13 @@
</el-col>
<el-col :span="24" >
<InfoCard header="用户" text="详情">
<template #content>
你好啊。好兄弟
<InfoCard header="简介" text="详情">
<template #content >
<div class="introduce">
没有什么能够阻挡，人类对代码<span style="color: #1890ff;">优雅</span>的最求
</div>
</template>
</InfoCard>
</el-col>
@@ -46,7 +49,12 @@
<el-col :span="24" >
<InfoCard :items=items header="本月排行" text="更多">
<template #item="temp">
{{temp}}
<AvatarInfo>
<template #bottom>
本月积分：680
</template>
</AvatarInfo>
</template>
</InfoCard>
</el-col>
@@ -55,7 +63,7 @@
<el-col :span="24" >
<InfoCard :items=items header="推荐好友" text="更多">
<template #item="temp">
{{temp}}
<AvatarInfo/>
</template>
</InfoCard>
</el-col>
@@ -77,9 +85,15 @@ import DisscussCard from '@/components/DisscussCard.vue'
import InfoCard from '@/components/InfoCard.vue'
import PlateCard from '@/components/PlateCard.vue'
import ScrollbarInfo from '@/components/ScrollbarInfo.vue'
import AvatarInfo from '@/components/AvatarInfo.vue'
const items=[{user:"用户1"},{user:"用户2"},{user:"用户3"}]
</script>
<style scoped >
.introduce
{
color: rgba(0,0,0,.45);
font-size: small;
}
.plate
{
background: transparent !important;