Browse Source
Merge branch 'gin-vue-admin_v2_dev' of https://github.com/flipped-aurora/gin-vue-admin into gin-vue-admin_v2_dev
main
Merge branch 'gin-vue-admin_v2_dev' of https://github.com/flipped-aurora/gin-vue-admin into gin-vue-admin_v2_dev
main
rainyan
5 years ago
8 changed files with 241 additions and 29 deletions
-
3web/package.json
-
33web/src/api/github.js
-
BINweb/src/assets/flipped-aurora.png
-
3web/src/main.js
-
2web/src/view/layout/aside/historyComponent/history.vue
-
2web/src/view/layout/aside/index.vue
-
48web/src/view/layout/index.vue
-
179web/src/view/test/index.vue
@ -0,0 +1,33 @@ |
|||||
|
import axios from "axios"; |
||||
|
import { Loading } from "element-ui"; |
||||
|
|
||||
|
let loadingInstance; |
||||
|
let service = axios.create(); |
||||
|
|
||||
|
service.interceptors.request.use((config) => { |
||||
|
loadingInstance = Loading.service({ fullscreen: true }); |
||||
|
return config; |
||||
|
}); |
||||
|
|
||||
|
service.interceptors.response.use((resp) => { |
||||
|
loadingInstance.close(); |
||||
|
return resp; |
||||
|
}, (error) => { |
||||
|
loadingInstance.close(); |
||||
|
return error; |
||||
|
}); |
||||
|
|
||||
|
export function Commits(page) { |
||||
|
return service({ |
||||
|
url: "https://api.github.com/repos/flipped-aurora/gin-vue-admin/commits?page=" + |
||||
|
page, |
||||
|
method: "get", |
||||
|
}); |
||||
|
} |
||||
|
|
||||
|
export function Members() { |
||||
|
return service({ |
||||
|
url: "https://api.github.com/orgs/FLIPPED-AURORA/members", |
||||
|
method: "get", |
||||
|
}); |
||||
|
} |
||||
|
After Width: 1200 | Height: 1200 | Size: 71 KiB |
@ -1,16 +1,181 @@ |
|||||
<template> |
<template> |
||||
<div> |
|
||||
动态路由测试 |
|
||||
</div> |
|
||||
|
<div> |
||||
|
<el-row :gutter="10"> |
||||
|
<el-col :span="12"> |
||||
|
<el-card> |
||||
|
<div slot="header">gin-vue-admin</div> |
||||
|
<div> |
||||
|
<el-row> |
||||
|
<el-col :span="8" :offset="8"> |
||||
|
<a href="https://github.com/flipped-aurora/gin-vue-admin"> |
||||
|
<img |
||||
|
class="org-img dom-center" |
||||
|
src="@/assets/logo.png" |
||||
|
alt="gin-vue-admin" |
||||
|
/> |
||||
|
</a> |
||||
|
</el-col> |
||||
|
</el-row> |
||||
|
<el-row :gutter="10"> |
||||
|
<el-col :span="8"> |
||||
|
<a href="https://github.com/flipped-aurora/gin-vue-admin"> |
||||
|
<img |
||||
|
class="dom-center" |
||||
|
src="https://img.shields.io/github/watchers/flipped-aurora/gin-vue-admin.svg?label=Watch" |
||||
|
alt="" |
||||
|
/> |
||||
|
</a> |
||||
|
</el-col> |
||||
|
<el-col :span="8"> |
||||
|
<a href="https://github.com/flipped-aurora/gin-vue-admin"> |
||||
|
<img |
||||
|
class="dom-center" |
||||
|
src="https://img.shields.io/github/stars/flipped-aurora/gin-vue-admin.svg?style=social" |
||||
|
alt=""/></a |
||||
|
></el-col> |
||||
|
<el-col :span="8"> |
||||
|
<a href="https://github.com/flipped-aurora/gin-vue-admin"> |
||||
|
<img |
||||
|
class="dom-center" |
||||
|
src="https://img.shields.io/github/forks/flipped-aurora/gin-vue-admin.svg?label=Fork" |
||||
|
alt=""/></a |
||||
|
></el-col> |
||||
|
</el-row> |
||||
|
</div> |
||||
|
</el-card> |
||||
|
<el-card style="margin-top: 20px"> |
||||
|
<div slot="header">flipped-aurora团队</div> |
||||
|
<div> |
||||
|
<el-row> |
||||
|
<el-col :span="8" :offset="8"> |
||||
|
<a href="https://github.com/flipped-aurora"> |
||||
|
<img |
||||
|
class="org-img dom-center" |
||||
|
src="@/assets/flipped-aurora.png" |
||||
|
alt="flipped-aurora" |
||||
|
/> |
||||
|
</a> |
||||
|
</el-col> |
||||
|
</el-row> |
||||
|
<el-row style="margin-left: 40px" :gutter="20"> |
||||
|
<template v-for="(item, index) in members"> |
||||
|
<el-col :span="8" :key="index"> |
||||
|
<a :href="item.html_url"> |
||||
|
<img class="avatar-img" :src="item.avatar_url" /> |
||||
|
<a class="author-name" style="">{{ item.login }}</a> |
||||
|
</a> |
||||
|
</el-col> |
||||
|
</template> |
||||
|
</el-row> |
||||
|
</div> |
||||
|
</el-card> |
||||
|
</el-col> |
||||
|
<el-col :span="12"> |
||||
|
<el-card> |
||||
|
<div slot="header"> |
||||
|
提交记录 |
||||
|
</div> |
||||
|
<div> |
||||
|
<Timeline |
||||
|
:timeline-items="dataTimeline" |
||||
|
:message-when-no-items="messageWhenNoItems" |
||||
|
:uniqueTimeline="true" |
||||
|
:unique-year="true" |
||||
|
:show-day-and-month="true" |
||||
|
order="desc" |
||||
|
dateLocale="zh-CN" |
||||
|
/> |
||||
|
</div> |
||||
|
<el-button class="load-more" @click="loadMore" type="text" |
||||
|
>Load more</el-button |
||||
|
> |
||||
|
</el-card> |
||||
|
</el-col> |
||||
|
</el-row> |
||||
|
</div> |
||||
</template> |
</template> |
||||
|
|
||||
<script> |
<script> |
||||
|
import { Commits, Members } from "@/api/github"; |
||||
|
import Timeline from "timeline-vuejs"; |
||||
export default { |
export default { |
||||
name:"Test" |
|
||||
|
|
||||
} |
|
||||
|
name: "Test", |
||||
|
components: { |
||||
|
Timeline, |
||||
|
}, |
||||
|
data() { |
||||
|
return { |
||||
|
messageWhenNoItems: "There arent commits", |
||||
|
members: [], |
||||
|
dataTimeline: [], |
||||
|
page: 0, |
||||
|
}; |
||||
|
}, |
||||
|
created() { |
||||
|
this.loadCommits(); |
||||
|
this.loadMembers(); |
||||
|
}, |
||||
|
methods: { |
||||
|
loadMore() { |
||||
|
this.page++; |
||||
|
this.loadCommits(); |
||||
|
}, |
||||
|
loadCommits() { |
||||
|
Commits(this.page).then(({ data }) => { |
||||
|
data.forEach((element) => { |
||||
|
if (element.commit.message) { |
||||
|
this.dataTimeline.push({ |
||||
|
from: new Date(element.commit.author.date), |
||||
|
title: element.commit.author.name, |
||||
|
showDayAndMonth: true, |
||||
|
description: `<a style="color: #26191b" href="${element.html_url}">${element.commit.message}</a>`, |
||||
|
}); |
||||
|
} |
||||
|
}); |
||||
|
}); |
||||
|
}, |
||||
|
loadMembers() { |
||||
|
Members().then(({ data }) => { |
||||
|
this.members = data; |
||||
|
this.members.sort(); |
||||
|
}); |
||||
|
}, |
||||
|
}, |
||||
|
}; |
||||
</script> |
</script> |
||||
|
|
||||
<style scoped> |
<style scoped> |
||||
|
.load-more { |
||||
|
margin-left: 120px; |
||||
|
} |
||||
|
|
||||
</style> |
|
||||
|
.avatar-img { |
||||
|
float: left; |
||||
|
height: 40px; |
||||
|
width: 40px; |
||||
|
border-radius: 50%; |
||||
|
-webkit-border-radius: 50%; |
||||
|
-moz-border-radius: 50%; |
||||
|
margin-top: 15px; |
||||
|
} |
||||
|
|
||||
|
.org-img { |
||||
|
height: 150px; |
||||
|
width: 150px; |
||||
|
} |
||||
|
|
||||
|
.author-name { |
||||
|
float: left; |
||||
|
line-height: 65px !important; |
||||
|
margin-left: 10px; |
||||
|
color: darkblue; |
||||
|
line-height: 100px; |
||||
|
font-family: "Lucida Sans", "Lucida Sans Regular", "Lucida Grande", |
||||
|
"Lucida Sans Unicode", Geneva, Verdana, sans-serif; |
||||
|
} |
||||
|
|
||||
|
.dom-center { |
||||
|
margin-left: 50%; |
||||
|
transform: translateX(-50%); |
||||
|
} |
||||
|
</style> |
||||
Write
Preview
Loading…
Cancel
Save
Reference in new issue