| Server IP : 167.235.224.122 / Your IP : 216.73.216.110 Web Server : Apache/2.4.58 (Ubuntu) System : Linux newplayground 6.8.0-136-generic #136-Ubuntu SMP PREEMPT_DYNAMIC Wed Jul 1 21:33:11 UTC 2026 aarch64 User : deploy ( 1000) PHP Version : 8.4.23 Disable Function : NONE MySQL : OFF | cURL : ON | WGET : ON | Perl : ON | Python : OFF | Sudo : ON | Pkexec : OFF Directory : /var/www/html/jungly/src/components/interface/ |
Upload File : |
<template>
<div class="graph-list mr-2 ml-2">
<ul>
<template v-for="(graph, index) in orderBy(list, order.property, order.direction)">
<li
class="bg-white mb-3"
:key="index"
v-if="check(graph)"
>
<div class="graph-svg col-6">
<div class="tag" v-if="editor || followed || assigned">
<template v-if="!editor && !graph.meta.public">
<span class="bg-info">
Shared Draft
</span>
</template>
<template v-else-if="graph.meta.public">
<span class="bg-primary">
Public
</span>
</template>
<template v-else-if="editor">
<span class="bg-warning">
Draft
</span>
</template>
</div>
<router-link
class="text-reset"
:to="{
name: 'viewer:node',
params: {
graph_id: graph.id
}
}"
>
<renderer
:content="graph"
version="minigraph"
:events="false"
:key="index"
/>
</router-link>
</div>
<div class="graph-meta">
<div class="information">
<div>
<h6 class="mb-1 font-weight-bold">
<router-link class="text-body"
:to="{
name: 'viewer',
params: {
graph_id: graph.id,
node_id: graph.root_id
}
}"
>
{{ graph.title | truncate(25, '...') }}
</router-link>
</h6>
<div class="text-smaller mb-2">
<span class="text-muted">
by
</span>
<strong>
{{ graph.author.username }}
</strong>
</div>
</div>
<ul class="stats">
<li v-if="graph.language">
<language-badge :locale="graph.language.id" />
</li>
<li>
<b-tooltip type="is-dark" :label="'Last updated at'" position="is-top">
<i class="fas fa-clock" />
<span class="text-smaller">
{{ graph.updated_at | date }}
</span>
</b-tooltip>
</li>
<li v-if="graph.meta.public">
<b-tooltip type="is-dark" :label="'Current Followers: ' + graph.followers" position="is-top" v-if="graph.followers != 0">
<i class="fas fa-star pr-1" />
{{ graph.followers }}
</b-tooltip>
</li>
</ul>
</div>
<ul class="actions pt-2 pb-2">
<li v-if="editor || graph.can_edit">
<router-link class="btn btn-sm btn-primary" :to="{
name: 'editor',
params: {
graph_id: graph.id,
node_id: graph.root_id
}
}">
Edit
</router-link>
</li>
<li>
<router-link class="btn btn-sm btn-secondary" :to="{
name: 'viewer',
params: {
graph_id: graph.id,
node_id: graph.root_id
}
}">
View
</router-link>
</li>
</ul>
</div>
</li>
</template>
</ul>
</div>
</template>
<script>
import orderBy from 'lodash/orderBy';
import language_badge from '@/components/interface/language-badge';
import renderer from '@/components/rendering/engine';
import { mapGetters } from 'vuex';
export default {
props: {
discover: { // List at Discover
type: Boolean,
default: false
},
editor: { // List in Dashboard (user)
type: Boolean,
default: false
},
followed: { // Followed List in Dashboard
type: Boolean,
default: false
},
assigned: {
type: Boolean,
default: false
},
home: { // List at Home
type: Boolean,
default: false
},
limit: {
type: Number,
default: null
},
list: Array,
order: {
type: Object,
default: () => {
return {
property: 'updated_at',
direction: 'desc'
};
}
}
},
components: {
'language-badge': language_badge,
renderer
},
computed: {
...mapGetters({
user: 'auth/user'
})
},
methods: {
check(graph) {
if(this.discover && graph.author.email != this.user.email) {
if(graph.meta.followed) { return false; }
return true;
}
else if(this.followed || this.editor || this.home || this.assigned) {
return true;
}
}
},
data() {
return {
orderBy: orderBy
};
}
};
</script>