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:
parent
fe2af370e0
commit
d21c1c773b
17 changed files with 562 additions and 32 deletions
|
@ -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>
|
||||
|
|
|
@ -41,10 +41,6 @@ export default {
|
|||
},
|
||||
|
||||
props: {
|
||||
conversationId: {
|
||||
type: [String, Number],
|
||||
required: true,
|
||||
},
|
||||
accountLabels: {
|
||||
type: Array,
|
||||
default: () => [],
|
||||
|
|
|
@ -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);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue