Feature: Inbox greeting message (#927)

Co-authored-by: Pranav Raj S <pranav@thoughtwoot.com>
This commit is contained in:
Sojan Jose
2020-06-09 23:54:35 +05:30
committed by GitHub
parent 8b022311c0
commit 432dad203b
48 changed files with 262 additions and 120 deletions

View File

@@ -18,7 +18,7 @@
<woot-input
v-if="isAWidgetInbox"
v-model.trim="selectedInboxName"
class="medium-12 columns"
class="medium-9 columns"
:label="$t('INBOX_MGMT.ADD.WEBSITE_CHANNEL.CHANNEL_NAME.LABEL')"
:placeholder="
$t('INBOX_MGMT.ADD.WEBSITE_CHANNEL.CHANNEL_NAME.PLACEHOLDER')
@@ -27,7 +27,7 @@
<woot-input
v-if="isAWidgetInbox"
v-model.trim="channelWebsiteUrl"
class="medium-12 columns"
class="medium-9 columns"
:label="$t('INBOX_MGMT.ADD.WEBSITE_CHANNEL.CHANNEL_DOMAIN.LABEL')"
:placeholder="
$t('INBOX_MGMT.ADD.WEBSITE_CHANNEL.CHANNEL_DOMAIN.PLACEHOLDER')
@@ -36,7 +36,7 @@
<woot-input
v-if="isAWidgetInbox"
v-model.trim="channelWelcomeTitle"
class="medium-12 columns"
class="medium-9 columns"
:label="
$t('INBOX_MGMT.ADD.WEBSITE_CHANNEL.CHANNEL_WELCOME_TITLE.LABEL')
"
@@ -46,46 +46,61 @@
)
"
/>
<woot-input
v-if="isAWidgetInbox"
v-model.trim="channelWelcomeTagline"
class="medium-12 columns"
:label="
$t('INBOX_MGMT.ADD.WEBSITE_CHANNEL.CHANNEL_WELCOME_TAGLINE.LABEL')
"
:placeholder="
$t(
'INBOX_MGMT.ADD.WEBSITE_CHANNEL.CHANNEL_WELCOME_TAGLINE.PLACEHOLDER'
)
"
/>
<woot-input
v-if="isAWidgetInbox"
v-model.trim="channelAgentAwayMessage"
class="medium-12 columns"
:label="
$t(
'INBOX_MGMT.ADD.WEBSITE_CHANNEL.CHANNEL_AGENT_AWAY_MESSAGE.LABEL'
)
"
:placeholder="
$t(
'INBOX_MGMT.ADD.WEBSITE_CHANNEL.CHANNEL_AGENT_AWAY_MESSAGE.PLACEHOLDER'
)
"
/>
<label v-if="isAWidgetInbox" class="medium-12 columns">
<label v-if="isAWidgetInbox" class="medium-9 columns">
{{ $t('INBOX_MGMT.ADD.WEBSITE_CHANNEL.WIDGET_COLOR.LABEL') }}
<woot-color-picker v-model="inbox.widget_color" />
</label>
<label class="medium-12 columns">
<label class="medium-9 columns">
{{
$t('INBOX_MGMT.ADD.WEBSITE_CHANNEL.CHANNEL_GREETING_TOGGLE.LABEL')
}}
<select v-model="greetingEnabled">
<option :value="true">
{{
$t(
'INBOX_MGMT.ADD.WEBSITE_CHANNEL.CHANNEL_GREETING_TOGGLE.ENABLED'
)
}}
</option>
<option :value="false">
{{
$t(
'INBOX_MGMT.ADD.WEBSITE_CHANNEL.CHANNEL_GREETING_TOGGLE.DISABLED'
)
}}
</option>
</select>
<p class="help-text">
{{
$t(
'INBOX_MGMT.ADD.WEBSITE_CHANNEL.CHANNEL_GREETING_TOGGLE.HELP_TEXT'
)
}}
</p>
</label>
<woot-input
v-if="greetingEnabled"
v-model.trim="greetingMessage"
class="medium-9 columns"
:label="
$t('INBOX_MGMT.ADD.WEBSITE_CHANNEL.CHANNEL_GREETING_MESSAGE.LABEL')
"
:placeholder="
$t(
'INBOX_MGMT.ADD.WEBSITE_CHANNEL.CHANNEL_GREETING_MESSAGE.PLACEHOLDER'
)
"
/>
<label class="medium-9 columns">
{{ $t('INBOX_MGMT.SETTINGS_POPUP.AUTO_ASSIGNMENT') }}
<select v-model="autoAssignment">
<option value="true">
<option :value="true">
{{ $t('INBOX_MGMT.EDIT.AUTO_ASSIGNMENT.ENABLED') }}
</option>
<option value="false">
<option :value="false">
{{ $t('INBOX_MGMT.EDIT.AUTO_ASSIGNMENT.DISABLED') }}
</option>
</select>
@@ -183,13 +198,14 @@ export default {
avatarFile: null,
avatarUrl: '',
selectedAgents: [],
greetingEnabled: true,
greetingMessage: '',
autoAssignment: false,
isAgentListUpdating: false,
selectedInboxName: '',
channelWebsiteUrl: '',
channelWelcomeTitle: '',
channelWelcomeTagline: '',
channelAgentAwayMessage: '',
autoAssignmentOptions: [
{
value: true,
@@ -247,11 +263,12 @@ export default {
this.fetchAttachedAgents();
this.avatarUrl = this.inbox.avatar_url;
this.selectedInboxName = this.inbox.name;
this.greetingEnabled = this.inbox.greeting_enabled;
this.greetingMessage = this.inbox.greeting_message;
this.autoAssignment = this.inbox.enable_auto_assignment;
this.channelWebsiteUrl = this.inbox.website_url;
this.channelWelcomeTitle = this.inbox.welcome_title;
this.channelWelcomeTagline = this.inbox.welcome_tagline;
this.channelAgentAwayMessage = this.inbox.agent_away_message;
});
},
async fetchAttachedAgents() {
@@ -294,12 +311,13 @@ export default {
id: this.currentInboxId,
name: this.selectedInboxName,
enable_auto_assignment: this.autoAssignment,
greeting_enabled: this.greetingEnabled,
greeting_message: this.greetingMessage,
channel: {
widget_color: this.inbox.widget_color,
website_url: this.channelWebsiteUrl,
welcome_title: this.channelWelcomeTitle,
welcome_tagline: this.channelWelcomeTagline,
agent_away_message: this.channelAgentAwayMessage,
},
};
if (this.avatarFile) {

View File

@@ -6,9 +6,8 @@
/>
<woot-loading-state
v-if="uiFlags.isCreating"
:message="$('INBOX_MGMT.ADD.WEBSITE_CHANNEL.LOADING_MESSAGE')"
>
</woot-loading-state>
:message="$t('INBOX_MGMT.ADD.WEBSITE_CHANNEL.LOADING_MESSAGE')"
/>
<form
v-if="!uiFlags.isCreating"
class="row"
@@ -76,19 +75,43 @@
/>
</label>
</div>
<div class="medium-12 columns">
<label>
<label class="medium-12 columns">
{{ $t('INBOX_MGMT.ADD.WEBSITE_CHANNEL.CHANNEL_GREETING_TOGGLE.LABEL') }}
<select v-model="greetingEnabled">
<option :value="true">
{{
$t(
'INBOX_MGMT.ADD.WEBSITE_CHANNEL.CHANNEL_GREETING_TOGGLE.ENABLED'
)
}}
</option>
<option :value="false">
{{
$t(
'INBOX_MGMT.ADD.WEBSITE_CHANNEL.CHANNEL_GREETING_TOGGLE.DISABLED'
)
}}
</option>
</select>
<p class="help-text">
{{
$t(
'INBOX_MGMT.ADD.WEBSITE_CHANNEL.CHANNEL_AGENT_AWAY_MESSAGE.LABEL'
'INBOX_MGMT.ADD.WEBSITE_CHANNEL.CHANNEL_GREETING_TOGGLE.HELP_TEXT'
)
}}
</p>
</label>
<div v-if="greetingEnabled" class="medium-12 columns">
<label>
{{
$t('INBOX_MGMT.ADD.WEBSITE_CHANNEL.CHANNEL_GREETING_MESSAGE.LABEL')
}}
<input
v-model.trim="channelAgentAwayMessage"
v-model.trim="greetingMessage"
type="text"
:placeholder="
$t(
'INBOX_MGMT.ADD.WEBSITE_CHANNEL.CHANNEL_AGENT_AWAY_MESSAGE.PLACEHOLDER'
'INBOX_MGMT.ADD.WEBSITE_CHANNEL.CHANNEL_GREETING_MESSAGE.PLACEHOLDER'
)
"
/>
@@ -124,7 +147,8 @@ export default {
channelWidgetColor: '#009CE0',
channelWelcomeTitle: '',
channelWelcomeTagline: '',
channelAgentAwayMessage: '',
greetingEnabled: false,
greetingMessage: '',
};
},
computed: {
@@ -138,13 +162,14 @@ export default {
'inboxes/createWebsiteChannel',
{
name: this.inboxName,
greeting_enabled: this.greetingEnabled,
greeting_message: this.greetingMessage,
channel: {
type: 'web_widget',
website_url: this.channelWebsiteUrl,
widget_color: this.channelWidgetColor,
welcome_title: this.channelWelcomeTitle,
welcome_tagline: this.channelWelcomeTagline,
agent_away_message: this.channelAgentAwayMessage,
},
}
);