feat: Ability to add label for contact page (#2350)

* feat: Ability to add label for contact page

Co-authored-by: Muhsin Keloth <muhsinkeramam@gmail.com>
Co-authored-by: Pranav Raj S <pranav@chatwoot.com>
Co-authored-by: Nithin David Thomas <webofnithin@gmail.com>
This commit is contained in:
Sivin Varghese 2021-06-14 10:36:00 +05:30 committed by GitHub
parent fe2af370e0
commit d21c1c773b
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
17 changed files with 562 additions and 32 deletions

View file

@ -2,7 +2,7 @@
<woot-button variant="link" class="label--add" @click="addLabel">
<woot-label
color-scheme="secondary"
:title="$t('CONTACT_PANEL.LABELS.MODAL.ADD_BUTTON')"
:title="$t('CONTACT_PANEL.LABELS.CONVERSATION.ADD_BUTTON')"
icon="ion-plus-round"
/>
</woot-button>

View file

@ -41,10 +41,6 @@ export default {
},
props: {
conversationId: {
type: [String, Number],
required: true,
},
accountLabels: {
type: Array,
default: () => [],

View file

@ -9,9 +9,11 @@
class="label-color--display"
:style="{ backgroundColor: color }"
/>
<span>{{ title }}</span>
<span class="label-text" :title="title">{{ title }}</span>
</div>
<div>
<i v-if="selected" class="icon ion-checkmark-round" />
</div>
<i v-if="selected" class="icon ion-checkmark-round" />
</div>
</woot-button>
</div>
@ -47,9 +49,14 @@ export default {
.item-wrap {
display: flex;
::v-deep .button__content {
width: 100%;
}
.button-wrap {
display: flex;
justify-content: space-between;
width: 100%;
&.active {
display: flex;
@ -59,14 +66,24 @@ export default {
.name-label-wrap {
display: flex;
}
min-width: 0;
width: 100%;
.label-color--display {
margin-right: var(--space-small);
}
.label-color--display {
margin-right: var(--space-small);
}
.icon {
font-size: var(--font-size-small);
.label-text {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
line-height: 1.1;
padding-right: var(--space-small);
}
.icon {
font-size: var(--font-size-small);
}
}
}