Skip to content

V
vue3-element-admin

有来技术 / vue3-element-admin

通知 3
Star 1
Fork 0
V
vue3-element-admin

体验新版 GitCode，发现更多精彩内容 >>

提交 37e53383 编写于 作者: 郝 郝先瑞
浏览文件
操作

feat(dashboard/index.vue): 完善控制台的团队信息

上级 6c2b343b
隐藏空白更改
内联 并排
Showing with 105 addition and 57 deletion
src/views/dashboard/components/Project/index.vue
浏览文件 @ 37e53383
......@@ -45,7 +45,7 @@
</el-col>
<el-col :span="20">
Spring Boot、Spring Cloud & Alibaba、Spring Security
OAuth2、Sentinel、Elastic Stack ...
OAuth2、JWT、Elastic Stack ...
</el-col>
</el-row>
<el-divider/>
......@@ -76,14 +76,13 @@ export default {
&__main {
line-height: 28px;
height: 315px;
}
}
.fw-b {
font-weight: bold;
}
}
</style>
\ No newline at end of file
src/views/dashboard/components/Team/index.vue
浏览文件 @ 37e53383
......@@ -9,57 +9,38 @@
<el-tab-pane label="开发者「无回」" name="developer">
<div class="developers">
<ul class="developers__content">
<li class="developer">
<li class="developer" v-for="(item,index) in developers">
<div class="developer__content">
<el-image
class="developer-img"
src="https://gitee.com/haoxr/image/raw/master/hxr.jpg"
:preview-src-list="['https://gitee.com/haoxr/image/raw/master/hxr.jpg']">
:src="item.imgUrl"
:preview-src-list="[item.imgUrl]">
</el-image>
<div class="developer-info">
<span class="developer-info-nickname">郝先瑞</span>
<span class="developer-info-nickname">{{ item.nickname }}</span>
<div class="developer-info-position">
<el-tag type="primary" size="mini">后端</el-tag>
<el-tag type="success" class="f-ml" size="mini">前端</el-tag>
<el-tag type="danger" class="f-ml" size="mini">运维</el-tag>
<el-tag v-for="(position,i) in item.positions"
:type="colors[i%colors.length]"
:class="i!==0?'f-ml':''"
size="mini">
{{ position }}
</el-tag>
</div>
</div>
</div>
</li>
<li class="developer">
<div class="developer__content">
<el-image
class="developer-img"
src="https://gitee.com/haoxr/image/raw/master/hxr.jpg"
:preview-src-list="['https://gitee.com/haoxr/image/raw/master/hxr.jpg']">
</el-image>
<div class="developer-info">
<span class="developer-info-nickname">XLSS</span>
<div class="developer-info-position">
<el-tag type="primary" class="f-ml" size="mini">DevOps</el-tag>
<div class="developer-info-homepage">
<a :href="item.homepage" target="_blank">
个人主页
</a>
</div>
</div>
</div>
</li>
<li class="developer">
<div class="developer__content">
<el-image
class="developer-img"
src="https://gitee.com/haoxr/image/raw/master/hxr.jpg"
:preview-src-list="['https://gitee.com/haoxr/image/raw/master/hxr.jpg']">
</el-image>
<div class="developer-info">
<span class="developer-info-nickname">总有刁民要害朕</span>
<div class="developer-info-position">
<el-tag size="mini">后端</el-tag>
<el-tag type="success" class="f-ml" size="mini">前端</el-tag>
</div>
</div>
<li class="pointer">
<el-image src="https://gitee.com/haoxr/image/raw/master/default/left.png"/>
<div class="pointer-tip">
欢迎添加开发者微信🤗🤗🤗
</div>
</li>
</ul>
</div>
</el-tab-pane>
......@@ -68,6 +49,12 @@
</el-tab-pane>
<el-tab-pane label="加入我们" name="3">
<div class="join-us">
<p>1. 人品良好、善于思考、执行力强；</p>
<p>2. 至少给项目提交过一个PR(无论大小)； </p>
<p>3. Git代码库活跃，个人主页、博客完善者优先；</p>
<p>4. 过份优秀者我们会主动联系您...</p>
</div>
</el-tab-pane>
</el-tabs>
......@@ -81,12 +68,33 @@ import {nextTick, onMounted, reactive, toRefs, watchEffect} from "vue";
import BScroll from "better-scroll";
const state = reactive({
teamActiveName: 'developer'
teamActiveName: 'developer',
developers: [
{
imgUrl: 'https://gitee.com/haoxr/image/raw/master/hxr.jpg',
nickname: '郝先瑞',
positions: ['后端', '前端', '打杂'],
homepage: 'https://www.cnblogs.com/haoxianrui/'
},
{
imgUrl: 'https://gitee.com/haoxr/image/raw/master/default/%E5%BE%AE%E4%BF%A1%E5%9B%BE%E7%89%87_20220128222910_gaitubao_841x841.jpg',
nickname: '张加林',
positions: ['DevOps'],
homepage: 'https://gitee.com/ximy'
},
{
imgUrl: 'https://gitee.com/haoxr/image/raw/master/default/ba695a5e70410a066b7052c5dc9db5c.jpg',
nickname: '张川',
positions: ['后端', '前端'],
homepage: 'https://blog.csdn.net/qq_41595149'
},
],
colors: ['', 'success', 'warning', 'danger']
})
const {teamActiveName} = toRefs(state)
const {teamActiveName, developers, colors} = toRefs(state)
let bScroll = reactive({})
/*let bScroll = reactive({})
onMounted(() => {
bScroll = new BScroll(document.querySelector('.developer-wrapper') as any, {
......@@ -102,7 +110,7 @@ watchEffect(() => {
nextTick(() => {
bScroll && (bScroll as any).refresh()
})
})
})*/
</script>
<style lang="scss" scoped>
......@@ -118,18 +126,36 @@ watchEffect(() => {
display: flex;
justify-content: flex-start;
.pointer {
list-style: none;
width: 180px;
min-width: 180px;
align-items: center;
margin-left: 50px;
&-tip {
position: absolute;
min-width: 180px;
top: 18px;
color: #5959d0;
}
}
.developer {
margin-left: 20px;
&:not(:first-child) {
margin-left: 20px;
}
align-items: center;
list-style: none;
width: 200px;
height: 206px;
width: 180px;
min-width: 180px;
&__content {
border: 1px solid #cccccc;
border-radius: 5px;
box-shadow: 10px 10px 5px #CCC;
padding: 23px;
box-shadow: 6px 6px 6px #AAA;
padding: 8px;
text-align: center;
.developer-img {
......@@ -139,19 +165,41 @@ watchEffect(() => {
.developer-info {
padding: 6px;
font-size: 14px;
&-nickname {
font-size: 14px;
&-position {
margin-top: 10px;
}
&-position {
margin-top: 5px;
&-homepage {
margin-top: 16px;
a {
display: inline-block;
padding: 4px 10px;
color: #409EFF;
border: 1px solid #409EFF;
border-radius: 5px;
background: #ecf5ff;
&:hover {
background: #409EFF;
color: #FFFFFF;
}
}
}
}
}
}
}
}
.join-us{
height: 247px;
p{
font-weight: bold;
}
}
}
.fw-b {
......
src/views/dashboard/index.vue
浏览文件 @ 37e53383
......@@ -68,12 +68,12 @@
<el-row :gutter="40">
<!-- 项目介绍 -->
<el-col :sm="24" :lg="12">
<el-col :md="12" :lg="12">
<Project/>
</el-col>
<!-- 团队介绍 -->
<el-col :sm="24" :lg="12">
<el-col :md="12" :lg="12">
<Team/>
</el-col>
</el-row>
......
src/views/system/user/index.vue
浏览文件 @ 37e53383
......@@ -369,13 +369,14 @@ const state = reactive({
multiple: true,
// 总条数
total: 0,
// 用户表格数据
// 用户分页数据
pageList: [],
// 弹窗属性
dialog: {
title: '',
visible: false
},
deptName:undefined,
// 部门树选项
deptOptions: [],
// 部门名称
......@@ -446,11 +447,11 @@ const {
dialog,
formData,
rules,
deptName,
deptOptions,
roleOptions
} = toRefs(state)
/**
* 部门筛选
**/
......
Markdown is supported
0% 或 .
You are about to add 0 people to the discussion. Proceed with caution.
先完成此消息的编辑！
想要评论请 注册 或