nexus/vuefilemanager
2
0
Fork 0
mirror of https://github.com/VueFileManager/vuefilemanager.git synced 2026-04-28 02:50:39 +00:00
Code Issues Packages Projects Releases Wiki Activity

TypedAvatar.vue colored background

Browse Source
This commit is contained in:
Peter Papp
2021-08-31 09:52:22 +02:00
parent ac62a432fe
commit f44e262d6e
26 changed files with 115 additions and 524 deletions
Download Patch File Download Diff File Expand all files Collapse all files
resources/js/components/Teams/Components/TeamList.vue
+1 -1
View File
@@ -7,7 +7,7 @@
<div class="member-preview">
<div class="avatar">
<img v-if="entry.avatar" :src="entry.avatar" alt="avatar">
<TypedAvatar v-else :size="38" :letter="entry.email.substr(0, 1)" />
<TypedAvatar v-else :size="38" :letter="entry.email.substr(0, 1)" :color="entry.color"/>
</div>
<div v-if="entry.type === 'member'" class="info">
<b class="title">{{ entry.name }}</b>
resources/js/components/Teams/Components/TeamMembersButton.vue
+1 -1
View File
@@ -32,7 +32,7 @@
width: 107px;
.widget {
justify-content: flex-end;
justify-content: center;
}
}
resources/js/components/Teams/Components/TeamMembersPreview.vue
+3 -3
View File
@@ -1,12 +1,12 @@
<template>
<div class="team-folder">
<span v-if="limit" class="member-count">
{{ membersCount > 3 ? '3+' : membersCount }}
<span v-if="limit && membersCount > 3" class="member-count">
3+
</span>
<div class="members">
<div v-for="member in members" :key="member.data.id" :title="member.data.attributes.email" class="member-preview">
<img v-if="member.data.attributes.avatar" :src="member.data.attributes.avatar" class="member" alt="avatar">
<TypedAvatar v-else :size="avatarSize" :letter="member.data.attributes.email.substr(0, 1)" />
<TypedAvatar v-else :size="avatarSize" :letter="member.data.attributes.email.substr(0, 1)" :color="member.data.attributes.color" />
</div>
</div>
</div>
resources/js/components/Teams/CreateTeamFolderPopup.vue
+13 -6
View File
@@ -16,14 +16,14 @@
<!--Set folder name-->
<ValidationProvider v-if="isNewFolderTeamCreation" tag="div" mode="passive" class="input-wrapper password" name="Name" rules="required" v-slot="{ errors }">
<label class="input-label">{{ $t('popup_create_folder.label') }}:</label>
<input v-model="name" :class="{'is-error': errors[0]}" type="text" ref="input" :placeholder="$t('popup_create_folder.placeholder')">
<input v-model="name" :class="{'is-error': errors[0]}" type="text" ref="name" class="focus-border-theme" :placeholder="$t('popup_create_folder.placeholder')">
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
<!--Add Member-->
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="Email" v-slot="{ errors }">
<label class="input-label">{{ $t('Add Member') }}:</label>
<input @keypress.enter.stop.prevent="addMember" v-model="email" :class="{'is-error': errors[0]}" type="email" class="focus-border-theme" :placeholder="$t('Type member email...')">
<input @keypress.enter.stop.prevent="addMember" ref="email" v-model="email" :class="{'is-error': errors[0]}" type="email" class="focus-border-theme" :placeholder="$t('Type member email...')">
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
@@ -121,7 +121,7 @@
let route = this.name
? `/api/teams/folders`
: `/api/teams/convert/${this.item.id}`
: `/api/teams/convert/${this.item.data.id}`
let payload = this.name
? {
@@ -176,9 +176,16 @@
events.$on('popup:open', args => {
if (args.name !== 'create-team-folder') return
if (args.item) {
this.item = args.item
}
this.item = args.item
this.$nextTick(() => {
if (this.item)
this.$refs.email.focus()
if (! this.item)
this.$refs.name.focus()
})
})
events.$on('popup:close', () => {
resources/js/components/Teams/EditTeamFolderPopup.vue
+7 -1
View File
@@ -16,7 +16,7 @@
<!--Add Member-->
<ValidationProvider tag="div" mode="passive" class="input-wrapper" name="Email" v-slot="{ errors }">
<label class="input-label">{{ $t('Add Member') }}:</label>
<input @keypress.enter.stop.prevent="addMember" v-model="email" :class="{'is-error': errors[0]}" type="email" class="focus-border-theme" :placeholder="$t('Type member email...')">
<input @keypress.enter.stop.prevent="addMember" ref="email" v-model="email" :class="{'is-error': errors[0]}" type="email" class="focus-border-theme" :placeholder="$t('Type member email...')">
<span class="error-message" v-if="errors[0]">{{ errors[0] }}</span>
</ValidationProvider>
@@ -160,6 +160,7 @@
email: member.data.attributes.email,
name: member.data.attributes.name,
avatar: member.data.attributes.avatar,
color: member.data.attributes.color,
permission: member.data.attributes.permission,
}
})
@@ -169,9 +170,14 @@
id: member.data.id,
type: 'invitation',
email: member.data.attributes.email,
color: member.data.attributes.color,
permission: member.data.attributes.permission,
}
})
this.$nextTick(() => {
this.$refs.email.focus()
})
})
events.$on('popup:close', () => {