label multi shows color, sharing shows avatars
Signed-off-by: Jakob <jakob.roehrl@web.de>
This commit is contained in:
@@ -3,7 +3,8 @@
|
|||||||
<multiselect v-model="addAcl" :options="unallocatedSharees" label="label"
|
<multiselect v-model="addAcl" :options="unallocatedSharees" label="label"
|
||||||
@input="clickAddAcl" @search-change="asyncFind">
|
@input="clickAddAcl" @search-change="asyncFind">
|
||||||
<template #option="scope">
|
<template #option="scope">
|
||||||
{{ scope.option.label }}
|
<avatar :user="scope.option.value.shareWith" />
|
||||||
|
<span class="avatarLabel">{{ scope.option.label }} </span>
|
||||||
</template>
|
</template>
|
||||||
</multiselect>
|
</multiselect>
|
||||||
|
|
||||||
@@ -129,4 +130,7 @@ export default {
|
|||||||
padding: 12px 9px;
|
padding: 12px 9px;
|
||||||
flex-grow: 1;
|
flex-grow: 1;
|
||||||
}
|
}
|
||||||
|
.avatarLabel {
|
||||||
|
padding: 6px
|
||||||
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
@@ -36,7 +36,7 @@
|
|||||||
:taggable="true" label="title"
|
:taggable="true" label="title"
|
||||||
track-by="id" @select="addLabelToCard" @remove="removeLabelFromCard">
|
track-by="id" @select="addLabelToCard" @remove="removeLabelFromCard">
|
||||||
<template #option="scope">
|
<template #option="scope">
|
||||||
<span>{{ scope.option.title }}</span>
|
<div :style="{ color: '#' + scope.option.color}">{{ scope.option.title }}</div>
|
||||||
</template>
|
</template>
|
||||||
</multiselect>
|
</multiselect>
|
||||||
</div>
|
</div>
|
||||||
@@ -50,7 +50,8 @@
|
|||||||
track-by="primaryKey"
|
track-by="primaryKey"
|
||||||
@select="assignUserToCard" @remove="removeUserFromCard">
|
@select="assignUserToCard" @remove="removeUserFromCard">
|
||||||
<template #option="scope">
|
<template #option="scope">
|
||||||
{{ scope.option.displayname }}
|
<avatar :user="scope.option.primaryKey" />
|
||||||
|
<span class="avatarLabel">{{ scope.option.displayname }} </span>
|
||||||
</template>
|
</template>
|
||||||
</multiselect>
|
</multiselect>
|
||||||
</div>
|
</div>
|
||||||
@@ -86,7 +87,7 @@
|
|||||||
</template>
|
</template>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
import { AppSidebar, AppSidebarTab, Multiselect, DatetimePicker } from 'nextcloud-vue'
|
import { AppSidebar, AppSidebarTab, Multiselect, DatetimePicker, Avatar } from 'nextcloud-vue'
|
||||||
import { mapState } from 'vuex'
|
import { mapState } from 'vuex'
|
||||||
import VueEasymde from 'vue-easymde'
|
import VueEasymde from 'vue-easymde'
|
||||||
import { Actions } from 'nextcloud-vue/dist/Components/Actions'
|
import { Actions } from 'nextcloud-vue/dist/Components/Actions'
|
||||||
@@ -103,7 +104,8 @@ export default {
|
|||||||
DatetimePicker,
|
DatetimePicker,
|
||||||
VueEasymde,
|
VueEasymde,
|
||||||
Actions,
|
Actions,
|
||||||
ActionButton
|
ActionButton,
|
||||||
|
Avatar
|
||||||
},
|
},
|
||||||
props: {
|
props: {
|
||||||
id: {
|
id: {
|
||||||
@@ -317,4 +319,8 @@ export default {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.avatarLabel {
|
||||||
|
padding: 6px
|
||||||
|
}
|
||||||
|
|
||||||
</style>
|
</style>
|
||||||
|
|||||||
Reference in New Issue
Block a user