2017-05-06 04:15:04 +00:00
|
|
|
<script>
|
2017-05-30 09:25:53 +00:00
|
|
|
/* eslint-disable no-alert */
|
|
|
|
|
2017-05-08 20:22:26 +00:00
|
|
|
import eventHub from '../event_hub';
|
|
|
|
|
2017-05-06 04:15:04 +00:00
|
|
|
export default {
|
|
|
|
props: {
|
|
|
|
group: {
|
|
|
|
type: Object,
|
|
|
|
required: true,
|
2017-05-08 20:22:26 +00:00
|
|
|
},
|
2017-05-25 02:04:31 +00:00
|
|
|
baseGroup: {
|
|
|
|
type: Object,
|
|
|
|
required: false,
|
|
|
|
},
|
2017-05-08 20:22:26 +00:00
|
|
|
},
|
|
|
|
methods: {
|
2017-05-30 22:01:48 +00:00
|
|
|
onClickRowGroup(e) {
|
2017-05-31 02:23:03 +00:00
|
|
|
e.stopPropagation();
|
2017-05-30 22:01:48 +00:00
|
|
|
|
|
|
|
// Skip for buttons
|
2017-05-31 02:23:03 +00:00
|
|
|
if (!(e.target.tagName === 'A') && !(e.target.tagName === 'I' && e.target.parentElement.tagName === 'A')) {
|
2017-05-30 22:01:48 +00:00
|
|
|
if (this.group.hasSubgroups) {
|
|
|
|
eventHub.$emit('toggleSubGroups', this.group);
|
|
|
|
} else {
|
|
|
|
window.location.href = this.group.webUrl;
|
|
|
|
}
|
2017-05-16 14:29:38 +00:00
|
|
|
}
|
|
|
|
|
2017-05-30 22:01:48 +00:00
|
|
|
return false;
|
2017-05-16 14:29:38 +00:00
|
|
|
},
|
2017-05-30 08:12:06 +00:00
|
|
|
onLeaveGroup(e) {
|
|
|
|
e.preventDefault();
|
|
|
|
|
|
|
|
if (confirm(`Are you sure you want to leave the "${this.group.fullName}" group?`)) {
|
|
|
|
this.leaveGroup();
|
|
|
|
}
|
2017-05-30 22:01:48 +00:00
|
|
|
|
|
|
|
return false;
|
2017-05-30 08:12:06 +00:00
|
|
|
},
|
|
|
|
leaveGroup() {
|
|
|
|
eventHub.$emit('leaveGroup', this.group.leavePath);
|
2017-05-30 09:25:53 +00:00
|
|
|
},
|
2017-05-16 14:29:38 +00:00
|
|
|
},
|
|
|
|
computed: {
|
2017-05-26 00:49:46 +00:00
|
|
|
groupDomId() {
|
|
|
|
return `group-${this.group.id}`;
|
|
|
|
},
|
2017-05-16 14:29:38 +00:00
|
|
|
rowClass() {
|
|
|
|
return {
|
|
|
|
'group-row': true,
|
|
|
|
'is-open': this.group.isOpen,
|
2017-05-30 08:53:40 +00:00
|
|
|
'has-subgroups': this.group.hasSubgroups,
|
2017-05-16 14:29:38 +00:00
|
|
|
'no-description': !this.group.description,
|
|
|
|
};
|
|
|
|
},
|
2017-05-30 22:22:30 +00:00
|
|
|
visibilityIcon() {
|
|
|
|
return {
|
|
|
|
fa: true,
|
|
|
|
'fa-globe': this.group.visibility === 'public',
|
|
|
|
'fa-shield': this.group.visibility === 'internal',
|
|
|
|
'fa-lock': this.group.visibility === 'private',
|
|
|
|
};
|
|
|
|
},
|
2017-05-25 02:04:31 +00:00
|
|
|
fullPath() {
|
|
|
|
let fullPath = '';
|
|
|
|
|
|
|
|
if (this.group.isOrphan) {
|
|
|
|
// check if current group is baseGroup
|
|
|
|
if (this.baseGroup) {
|
|
|
|
// Remove baseGroup prefix from our current group.fullName. e.g:
|
|
|
|
// baseGroup.fullName: `level1`
|
|
|
|
// group.fullName: `level1 / level2 / level3`
|
|
|
|
// Result: `level2 / level3`
|
|
|
|
const gfn = this.group.fullName;
|
|
|
|
const bfn = this.baseGroup.fullName;
|
|
|
|
const length = bfn.length;
|
|
|
|
const start = gfn.indexOf(bfn);
|
|
|
|
|
2017-05-26 00:49:46 +00:00
|
|
|
fullPath = gfn.substr(start + length + 3);
|
2017-05-25 02:04:31 +00:00
|
|
|
} else {
|
|
|
|
fullPath = this.group.fullName;
|
|
|
|
}
|
|
|
|
} else {
|
|
|
|
fullPath = this.group.name;
|
|
|
|
}
|
|
|
|
|
|
|
|
return fullPath;
|
|
|
|
},
|
2017-05-31 20:33:27 +00:00
|
|
|
hasGroups() {
|
|
|
|
return Object.keys(this.group.subGroups).length > 0;
|
|
|
|
},
|
2017-05-08 20:22:26 +00:00
|
|
|
},
|
2017-05-06 04:15:04 +00:00
|
|
|
};
|
|
|
|
</script>
|
|
|
|
|
|
|
|
<template>
|
2017-05-12 08:36:08 +00:00
|
|
|
<li
|
2017-05-30 22:01:48 +00:00
|
|
|
@click.stop="onClickRowGroup"
|
2017-05-26 00:49:46 +00:00
|
|
|
:id="groupDomId"
|
2017-05-16 14:29:38 +00:00
|
|
|
:class="rowClass"
|
2017-05-12 08:36:08 +00:00
|
|
|
>
|
2017-05-16 14:29:38 +00:00
|
|
|
<div class="controls">
|
2017-05-30 08:29:21 +00:00
|
|
|
<a
|
|
|
|
v-show="group.canEdit"
|
|
|
|
class="edit-group btn"
|
|
|
|
:href="group.editPath">
|
2017-05-16 14:29:38 +00:00
|
|
|
<i aria-hidden="true" class="fa fa-cogs"></i>
|
|
|
|
</a>
|
2017-05-30 08:12:06 +00:00
|
|
|
<a @click="onLeaveGroup"
|
|
|
|
:href="group.leavePath"
|
|
|
|
class="leave-group btn"
|
|
|
|
title="Leave this group">
|
2017-05-16 14:29:38 +00:00
|
|
|
<i aria-hidden="true" class="fa fa-sign-out"></i>
|
|
|
|
</a>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div class="stats">
|
2017-05-26 00:49:46 +00:00
|
|
|
<span class="number-projects">
|
2017-05-16 14:29:38 +00:00
|
|
|
<i aria-hidden="true" class="fa fa-bookmark"></i>
|
|
|
|
{{group.numberProjects}}
|
|
|
|
</span>
|
2017-05-30 09:25:53 +00:00
|
|
|
<span class="number-users">
|
2017-05-16 14:29:38 +00:00
|
|
|
<i aria-hidden="true" class="fa fa-users"></i>
|
2017-05-30 09:25:53 +00:00
|
|
|
{{group.numberUsers}}
|
2017-05-16 14:29:38 +00:00
|
|
|
</span>
|
2017-05-26 00:49:46 +00:00
|
|
|
<span class="group-visibility">
|
2017-05-30 22:22:30 +00:00
|
|
|
<i aria-hidden="true" :class="visibilityIcon"></i>
|
2017-05-16 14:29:38 +00:00
|
|
|
</span>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div class="folder-toggle-wrap">
|
|
|
|
<span class="folder-caret">
|
|
|
|
<i
|
|
|
|
v-show="group.isOpen"
|
|
|
|
class="fa fa-caret-down" />
|
|
|
|
<i
|
|
|
|
v-show="!group.isOpen"
|
|
|
|
class="fa fa-caret-right" />
|
|
|
|
</span>
|
|
|
|
|
|
|
|
<span class="folder-icon">
|
|
|
|
<i
|
|
|
|
v-show="group.isOpen"
|
|
|
|
class="fa fa-folder-open"
|
|
|
|
aria-hidden="true" />
|
|
|
|
<i
|
|
|
|
v-show="!group.isOpen"
|
|
|
|
class="fa fa-folder" />
|
|
|
|
</span>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div class="avatar-container s40">
|
|
|
|
<a href="/h5bp">
|
|
|
|
<img class="avatar s40 hidden-xs" src="http://localhost:3000/uploads/group/avatar/2/logo-extra-whitespace.png" alt="Logo extra whitespace">
|
|
|
|
</a>
|
|
|
|
</div>
|
|
|
|
|
|
|
|
<div class="title">
|
2017-05-25 02:04:31 +00:00
|
|
|
<a :href="group.webUrl">{{fullPath}}</a>
|
2017-05-16 14:29:38 +00:00
|
|
|
</div>
|
|
|
|
|
|
|
|
<div class="description">
|
|
|
|
{{group.description}}
|
|
|
|
</div>
|
2017-05-09 23:10:19 +00:00
|
|
|
|
2017-05-31 20:33:27 +00:00
|
|
|
<group-folder v-if="group.isOpen && hasGroups" :groups="group.subGroups" :baseGroup="group" />
|
2017-05-09 23:10:19 +00:00
|
|
|
</li>
|
2017-05-06 04:15:04 +00:00
|
|
|
</template>
|