Newer
Older
<template>
<div class="col q-gutter-md">
<q-list dense>
<q-item>
<q-item-section side>
<q-item-label caption>
Uploaded by
</q-item-label>
<q-item-section avatar>
<div class="text-center">
<router-link :to="`/users/${project.owner.uid}`">
<q-img
basic
:src="project.owner.avatarURL"
/>
<br>
<div class="text-caption">
{{ project.owner.name }}
</div>
</div>
</q-item-section>
</q-item>
</q-list>
<q-list>
@click="()=>this.$emit('action', 'showDocumentation')"
<q-icon
name="book"
color="teal-3"
/>
<q-item-label class="text-teal-6 text-weight-bold">
Documentation
</q-item-label>
@click="()=>this.$emit('action', 'showDownloads')"
<q-icon
name="save"
color="teal-3"
/>
</q-item-section>
<q-item-section class="text-teal-6 text-weight-bold">
Download files
@click="() => this.$emit('action', 'addBookmark')"
>
<q-item-section side>
<q-icon
name="bookmark"
color="teal-3"
/>
</q-item-section>
<q-item-section class="text-teal-6 text-weight-bold">
Add to collection
</q-item-section>
</q-item>
</q-list>
<q-list>
<q-item>
<q-item-section side>
<q-item-label caption>
Category
</q-item-label>
<q-item-label>
<router-link :to="`/catalogue/category/${category_link}`">
{{ category_label }}
</router-link>
</q-item-label>
</q-item-section>
</q-item>
<q-item>
<q-item-section side>
<q-item-label caption>
Created
</q-item-label>
<q-item-label>{{ formatted_date }}</q-item-label>
<q-item v-if="project.tags && project.tags.length > 0">
<q-item-section side>
<q-item-label caption>
Tags
</q-item-label>
<q-item v-if="project.tags && project.tags.length > 0">
<div class="flex row">
<router-link
class="text-caption q-mr-sm"
style="text-decoration: none"
v-for="tag in project.tags"
v-bind:key="tag"
:to="`/catalogue/tags/${tag}`"
>#{{tag}}</router-link>
<q-card
flat
class="text-center"
>
<q-icon
size="64px"
name="star"
color="grey-3"
/>
<div class="text-center text-caption">
Stars
</div>
<div class="text-center text-h6 text-grey text-weight-bold">
0
</div>
<q-card
flat
class="text-center"
>
<q-icon
size="64px"
name="save"
color="grey-3"
/>
<div class="text-center text-caption">
Downloads
</div>
<div class="text-center text-h6 text-grey text-weight-bold">
{{ project.downloadsCount || 0 }}
</div>
openURL,
searchTag (tag) {
let _tag = '/catalogue/tags/' + tag
this.$router.push(_tag)
},
searchCategory (category) {
this.$router.push(`/catalogue/categories/${category}`)
},
category_label () {
if (!this.project) return '';
console.log(this.project.category);
const cat = this.getCategory(this.project.category);
category_link () {
if (!this.project) return '';
return this.project.category
},
formatted_date () {
if (!this.project) return '';
const createdDate = this.project.created.toDate();
console.log(createdDate);
return this.$niceTime(createdDate);
...mapGetters({ getCategory: 'categories/categoryByName' })