106 lines
2.0 KiB
Vue
106 lines
2.0 KiB
Vue
<template>
|
|
<div
|
|
v-if="isLoading"
|
|
class="circle"
|
|
>
|
|
<i class="fa fa-spinner fa-spin fa-3x fa-fw" />
|
|
<span class="sr-only">Loading …</span>
|
|
</div>
|
|
<div
|
|
v-else
|
|
class="row"
|
|
>
|
|
<div class="col-sm-12">
|
|
<!-- {% if is_granted('ROLE_ADMIN') %}
|
|
<div class="d-flex justify-content-end">
|
|
<a :to="id"><i class="fa fa-3x fa-fw fa-edit"></i></a>
|
|
<a :to="project.id"><i class="fa fa-3x fa-fw fa-trash"></i></a>
|
|
</div>
|
|
{% endif %}-->
|
|
|
|
<div class="show-article-container p-3 mt-4">
|
|
<div class="show-article-title-container d-inline-block pl-3 align-middle">
|
|
<h2>{{ project.name }}</h2>
|
|
</div>
|
|
<div>
|
|
Source: <b-link
|
|
:to="project.url"
|
|
target="_blank"
|
|
>
|
|
{{ project.url }}
|
|
</b-link> 
|
|
<i
|
|
class="fa fa-external-link"
|
|
aria-hidden="true"
|
|
/>
|
|
</div>
|
|
<div class="row mt-5">
|
|
<div class="col-sm-12">
|
|
<div
|
|
class="article-text"
|
|
v-html="readmeToHtml"
|
|
>
|
|
{{ }}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</template>
|
|
|
|
<script>
|
|
|
|
import axios from 'axios'
|
|
import { marked } from 'marked';
|
|
import Author from '@/components/users/UserCard'
|
|
|
|
export default {
|
|
Name: 'ProjectDetails',
|
|
components: {
|
|
Author,
|
|
marked
|
|
},
|
|
data: () => ({
|
|
project: null,
|
|
readme: null,
|
|
isLoading: true
|
|
}),
|
|
computed: {
|
|
readmeToHtml() {
|
|
if (!this.isLoading) {
|
|
return marked(this.readme)
|
|
}
|
|
}
|
|
},
|
|
mounted() {
|
|
const { id } = this.$route.params
|
|
console.log(id)
|
|
axios
|
|
.get(`/api/projects/${id}`)
|
|
.then((response) => {
|
|
console.log(response)
|
|
this.project = response.data
|
|
console.log(this.project);
|
|
axios
|
|
.get(`${this.project.url}/raw/branch/master/README.md`)
|
|
.then((response) => {
|
|
this.readme = response.data
|
|
this.isLoading = false;
|
|
console.log(response)
|
|
})
|
|
.catch((error) => {
|
|
console.log(error)
|
|
})
|
|
})
|
|
.catch((error) => {
|
|
console.log(error)
|
|
})
|
|
},
|
|
methods: {
|
|
getProjects() {
|
|
}
|
|
}
|
|
};
|
|
</script>
|