piexlmax
3 years ago
5 changed files with 250 additions and 167 deletions
-
54web/src/components/dashbordTable/dashbordTable.vue
-
42web/src/view/dashboard/dashbordCharts/echartsLine.vue
-
112web/src/view/dashboard/dashbordTable/dashbordTable.vue
-
77web/src/view/dashboard/index.vue
@ -1,54 +0,0 @@ |
|||||
<template> |
|
||||
<div class="commit-table"> |
|
||||
<div class="commit-table-title">Gva 仓库commit 记录</div> |
|
||||
<el-table v-loading="loading" :data="dataTimeline" style="width: 100%"> |
|
||||
<el-table-column prop="from" show-overflow-tooltip label="日期" width="180" /> |
|
||||
<el-table-column prop="title" show-overflow-tooltip label="推送者" width="120" /> |
|
||||
<el-table-column prop="message" show-overflow-tooltip label="commit 信息" /> |
|
||||
</el-table> |
|
||||
</div> |
|
||||
</template> |
|
||||
|
|
||||
<script> |
|
||||
import { Commits } from '@/api/github' |
|
||||
export default { |
|
||||
data() { |
|
||||
return { |
|
||||
loading: true, |
|
||||
dataTimeline: [], |
|
||||
} |
|
||||
}, |
|
||||
created() { |
|
||||
this.loadCommits() |
|
||||
}, |
|
||||
methods: { |
|
||||
loadCommits() { |
|
||||
Commits(0).then(({ data }) => { |
|
||||
this.loading = false |
|
||||
data.forEach((element, index) => { |
|
||||
if (element.commit.message && index < 6) { |
|
||||
this.dataTimeline.push({ |
|
||||
from: new Date(element.commit.author.date), |
|
||||
title: element.commit.author.name, |
|
||||
showDayAndMonth: true, |
|
||||
message: element.commit.message, |
|
||||
}) |
|
||||
} |
|
||||
}) |
|
||||
}) |
|
||||
}, |
|
||||
} |
|
||||
} |
|
||||
</script> |
|
||||
<style lang="scss" scoped> |
|
||||
.commit-table{ |
|
||||
padding: 20px; |
|
||||
background-color: #fff; |
|
||||
height: 400px; |
|
||||
&-title{ |
|
||||
color: rgb(56,137,206); |
|
||||
font-size: 18px; |
|
||||
margin-bottom: 20px; |
|
||||
} |
|
||||
} |
|
||||
</style> |
|
||||
@ -0,0 +1,112 @@ |
|||||
|
<template> |
||||
|
<div class="commit-table"> |
||||
|
<div class="commit-table-title"> |
||||
|
更新日志 |
||||
|
</div> |
||||
|
<div class="log"> |
||||
|
<div v-for="(item,key) in dataTimeline" :key="key" class="log-item"> |
||||
|
<div class="flex-1 flex"><span class="key" :class="key<3&&'top'">{{ key+1 }}</span></div> |
||||
|
<div class="flex-5 flex message">{{ item.message }}</div> |
||||
|
<div class="flex-3 flex form">{{ item.from }}</div> |
||||
|
</div> |
||||
|
</div> |
||||
|
<!-- <el-table v-loading="loading" :data="dataTimeline" style="width: 100%"> |
||||
|
<el-table-column prop="from" show-overflow-tooltip label="日期" width="180" /> |
||||
|
<el-table-column prop="title" show-overflow-tooltip label="推送者" width="120" /> |
||||
|
<el-table-column prop="message" show-overflow-tooltip label="commit 信息" /> |
||||
|
</el-table> --> |
||||
|
</div> |
||||
|
</template> |
||||
|
|
||||
|
<script> |
||||
|
import { Commits } from '@/api/github' |
||||
|
import { formatTimeToStr } from '@/utils/date.js' |
||||
|
export default { |
||||
|
data() { |
||||
|
return { |
||||
|
loading: true, |
||||
|
dataTimeline: [], |
||||
|
} |
||||
|
}, |
||||
|
created() { |
||||
|
this.loadCommits() |
||||
|
}, |
||||
|
methods: { |
||||
|
loadCommits() { |
||||
|
Commits(0).then(({ data }) => { |
||||
|
this.loading = false |
||||
|
data.forEach((element, index) => { |
||||
|
if (element.commit.message && index < 10) { |
||||
|
this.dataTimeline.push({ |
||||
|
from: formatTimeToStr(element.commit.author.date, 'yyyy-MM-dd'), |
||||
|
title: element.commit.author.name, |
||||
|
showDayAndMonth: true, |
||||
|
message: element.commit.message, |
||||
|
}) |
||||
|
} |
||||
|
}) |
||||
|
}) |
||||
|
}, |
||||
|
} |
||||
|
} |
||||
|
</script> |
||||
|
<style lang="scss" scoped> |
||||
|
.commit-table{ |
||||
|
background-color: #fff; |
||||
|
height: 400px; |
||||
|
&-title{ |
||||
|
font-weight: 600; |
||||
|
margin-bottom: 12px; |
||||
|
} |
||||
|
.log{ |
||||
|
&-item{ |
||||
|
display: flex; |
||||
|
justify-content: space-between; |
||||
|
margin-top: 14px; |
||||
|
.key{ |
||||
|
&.top{ |
||||
|
background: #314659; |
||||
|
color: #FFFFFF;; |
||||
|
} |
||||
|
display: inline-flex; |
||||
|
justify-content: center; |
||||
|
align-items: center; |
||||
|
width: 20px; |
||||
|
height: 20px; |
||||
|
border-radius: 50%; |
||||
|
background: #F0F2F5; |
||||
|
text-align: center; |
||||
|
color:rgba($color: #000000, $alpha: 0.65) |
||||
|
} |
||||
|
.message{ |
||||
|
color: rgba(0, 0, 0, 0.65); |
||||
|
} |
||||
|
.form{ |
||||
|
color: rgba(0, 0, 0, 0.65); |
||||
|
margin-left: 12px; |
||||
|
} |
||||
|
.flex{ |
||||
|
line-height: 20px; |
||||
|
overflow: hidden; |
||||
|
text-overflow: ellipsis; |
||||
|
white-space: nowrap; |
||||
|
} |
||||
|
.flex-1{ |
||||
|
flex:1; |
||||
|
} |
||||
|
.flex-2{ |
||||
|
flex:2; |
||||
|
} |
||||
|
.flex-3{ |
||||
|
flex:3; |
||||
|
} |
||||
|
.flex-4{ |
||||
|
flex:4; |
||||
|
} |
||||
|
.flex-5{ |
||||
|
flex:5; |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
} |
||||
|
</style> |
||||
Write
Preview
Loading…
Cancel
Save
Reference in new issue