Commit 46b1fbdc authored by Johannes Zellner's avatar Johannes Zellner

Show list of last releases of all projects if a user has tracked projects

parent df9f4e52
......@@ -29,3 +29,7 @@ a:hover, a:focus {
.el-table a {
color: rgb(96, 98, 102);
}
.el-table a:hover {
color: #66b1ff;
}
......@@ -27,8 +27,8 @@
</el-header>
<el-main>
<div v-if="activeView === 'login'">
<el-row type="flex" class="row-bg" justify="center">
<el-col :span="6">
<el-row type="flex" justify="center">
<el-col style="max-width: 400px">
<el-form ref="form" :model="login" label-position="top" @submit.native.prevent>
<el-form-item label="Username"><el-input v-model="login.username" ref="loginInput" required></el-input></el-form-item>
<el-form-item label="Password"><el-input v-model="login.password" type="password" required></el-input></el-form-item>
......@@ -38,8 +38,8 @@
</el-row>
</div>
<div v-else-if="activeView === 'projects'">
<el-row type="flex" class="row-bg" justify="center">
<el-col :span="12">
<el-row type="flex" justify="center">
<el-col style="max-width: 1024px">
<center v-show="projects === null"><h1><i class="el-icon-loading"></i></h1></center>
<center v-show="projects && projects.length === 0">No projects found.</center>
<el-table :data="projects" v-show="projects && projects.length" stripe style="width: 100%" :default-sort="{ prop: 'name', order: 'ascending' }">
......@@ -58,8 +58,8 @@
</el-row>
</div>
<div v-else-if="activeView === 'profile'">
<el-row type="flex" class="row-bg" justify="center">
<el-col :span="10">
<el-row type="flex" justify="center">
<el-col style="max-width: 600px">
<el-form ref="form" label-width="120px" @submit.native.prevent>
<el-form-item label="Email" required><el-input v-model="profile.email" type="email"></el-input></el-form-item>
<el-form-item label="GitHub token">
......@@ -72,10 +72,28 @@
</el-row>
</div>
<div v-else-if="activeView === 'welcome'">
<center>
<h1><i class="el-icon-bell"></i> Welcome to Release Bell</h1>
<p>Set a GitHub token in your <a href="" @click.prevent="handleViewSelect('profile')">profile</a> to start receiving new release notifcations for your starred repos.</p>
</center>
<el-row type="flex" justify="center">
<el-col style="max-width: 1024px">
<center v-show="projects === null"><h1><i class="el-icon-loading"></i></h1></center>
<center v-show="projects && projects.length === 0">
<h1><i class="el-icon-bell"></i> Welcome to Release Bell</h1>
<p>Set a GitHub token in your <a href="" @click.prevent="handleViewSelect('profile')">profile</a> to start receiving new release notifcations for your starred repos.</p>
</center>
<el-table :data="projects" v-show="projects && projects.length" stripe style="width: 100%" :default-sort="{ prop: 'createdAt', order: 'descending' }">
<el-table-column prop="name" label="Project Name" sortable>
<template slot-scope="scope">
<a :href="'https://github.com/' + scope.row.name" target="_blank">{{ scope.row.name }}</a>
</template>
</el-table-column>
<el-table-column prop="version" align="center" label="Last Version" sortable>
<template slot-scope="scope">
<a :href="'https://github.com/' + scope.row.name + '/releases/tag/' + scope.row.version" target="_blank">{{ scope.row.version }}</a>
</template>
</el-table-column>
<el-table-column prop="createdAt" align="right" label="Released at" sortable :formatter="prettyDate"></el-table-column>
</el-table>
</el-col>
</el-row>
</div>
<div v-else>
<center><h1><i class="el-icon-loading"></i></h1></center>
......
......@@ -86,7 +86,7 @@ new Vue({
if (!this.profile) this.activeView = 'login';
else this.activeView = key;
if (this.activeView === 'projects') {
if (this.activeView === 'projects' || this.activeView === 'welcome') {
this.projects = null;
superagent.get('/api/v1/projects').auth(this.login.username, this.login.password).end(function (error, result) {
......@@ -100,6 +100,26 @@ new Vue({
this.login.password = '';
}
},
prettyDate: function (row, column, cellValue, index) {
var date = new Date(cellValue),
diff = (((new Date()).getTime() - date.getTime()) / 1000),
day_diff = Math.floor(diff / 86400);
if (isNaN(day_diff) || day_diff < 0)
return;
return day_diff === 0 && (
diff < 60 && 'just now' ||
diff < 120 && '1 minute ago' ||
diff < 3600 && Math.floor( diff / 60 ) + ' minutes ago' ||
diff < 7200 && '1 hour ago' ||
diff < 86400 && Math.floor( diff / 3600 ) + ' hours ago') ||
day_diff === 1 && 'Yesterday' ||
day_diff < 7 && day_diff + ' days ago' ||
day_diff < 31 && Math.ceil( day_diff / 7 ) + ' weeks ago' ||
day_diff < 365 && Math.round( day_diff / 30 ) + ' months ago' ||
Math.round( day_diff / 365 ) + ' years ago';
},
setProjectState: function (projectId, state, scope) {
var that = this;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment