0
0
Fork 0
mirror of https://github.com/VueTubeApp/VueTube synced 2024-11-23 19:55:16 +00:00
VueTube/NUXT/pages/mods/updates.vue
2022-03-19 17:23:09 -04:00

84 lines
2 KiB
Vue

<template>
<div class="py-2">
<v-list-item v-for="(item, index) in commits" :key="index" class="my-1">
<v-card class="card my-2">
<v-card-title style="padding: 0 0.25em 0 0.75em;">
{{ item.author ? item.author.login : item.commit.author.name }}
<span v-text="`• ${item.sha.substring(0, 7)}`" class="subtitle" />
<v-spacer />
<v-chip outlined class="tags" color="orange" v-if="index == 0">Latest</v-chip>
<v-chip outlined class="tags" color="green" v-if="item.sha == installedVersion">Installed</v-chip>
</v-card-title>
<div style="margin-left: 1em;">
<div class="date" v-text="new Date(item.commit.committer.date).toLocaleString()" />
{{ item.commit.message }}
</div>
<v-card-actions>
<v-spacer />
<v-btn @click="openExternal(item)"><v-icon class="btn-icon">mdi-github</v-icon>View</v-btn>
<v-btn disabled @click="install(item)"><v-icon class="btn-icon">mdi-download</v-icon>Install</v-btn>
</v-card-actions>
</v-card>
</v-list-item>
</div>
</template>
<style scoped>
.card {
width: 100%;
}
.subtitle {
margin: 0.4em;
font-size: 0.75em;
transform: translateY(5%);
color: #999;
}
.date {
color: #999;
transform: translateY(-40%);
}
.btn-icon {
margin-right: 0.25em;
}
.tags {
margin-left: 0.5em;
}
</style>
<script>
import { Browser } from '@capacitor/browser';
export default {
data() {
return {
commits: new Array(),
installedVersion: process.env.appVersion
}
},
async mounted() {
const commits = await this.$vuetube.commits;
if (commits[0].sha) { //If Commit Valid
this.commits = commits;
} else {
console.log(commits)
}
},
methods: {
async openExternal(item) {
await Browser.open({ url: item.html_url });
},
install(item) {
this.$vuetube.getRuns(item, (data) => {
console.log(data)
});
}
}
}
</script>