Files
DiceCloud/app/imports/ui/library/LibraryCollectionHeader.vue
Stefan Zermatten f8e9131bdd Vastly improved new character UX
Characters now can limit which libraries they allow
2022-07-18 13:45:14 +02:00

100 lines
2.2 KiB
Vue

<template lang="html">
<v-list-item
style="min-height: 60px; min-width: 0;"
class="px-0 font-weight-bold"
:class="isSelected && !disabled && 'primary--text v-list-item--active'"
>
<v-list-item-action
v-if="selection"
>
<v-checkbox
:disabled="disabled"
:input-value="disabled || isSelected"
@change="e => $emit('select', e)"
@click.stop
/>
</v-list-item-action>
<v-list-item-avatar v-else>
<shared-icon :model="model" />
</v-list-item-avatar>
<v-list-item-title class="d-flex align-center">
<div
class="text-truncate text-no-wrap"
style="opacity: 0.7"
>
{{ model.name }}
</div>
<template v-if="!selection && !dense">
<v-spacer />
<v-btn
v-if="canEdit"
icon
style="flex-grow: 0"
@click.stop="editLibraryCollection"
>
<v-icon>
mdi-pencil
</v-icon>
</v-btn>
<v-btn
icon
style="flex-grow: 0"
:to="{name: 'libraryCollection', params: {id: model._id}}"
@click.stop
>
<v-icon>
mdi-forward
</v-icon>
</v-btn>
</template>
</v-list-item-title>
</v-list-item>
</template>
<script lang="js">
import { assertDocEditPermission } from '/imports/api/sharing/sharingPermissions.js';
import SharedIcon from '/imports/ui/components/SharedIcon.vue';
export default {
components: {
SharedIcon,
},
props: {
model: {
type: Object,
required: true,
},
open: Boolean,
selection: Boolean,
dense: Boolean,
isSelected: Boolean,
disabled: Boolean,
},
data(){return {
renaming: false,
}},
meteor: {
canEdit(){
try {
assertDocEditPermission(this.model, Meteor.userId());
return true
} catch (e) {
return false;
}
}
},
methods: {
editLibraryCollection() {
this.$store.commit('pushDialogStack', {
data: { _id: this.model._id},
component: 'library-collection-edit-dialog',
elementId: `library-collection-${this.model._id}`,
});
}
}
}
</script>
<style lang="css" scoped>
</style>