feat: Add send message, fix issues with message conditions (#4423)
Co-authored-by: Tejaswini <tejaswini@chatwoot.com>
This commit is contained in:
@@ -7,7 +7,7 @@
|
||||
<select
|
||||
v-model="action_name"
|
||||
class="action__question"
|
||||
:class="{ 'full-width': !inputType }"
|
||||
:class="{ 'full-width': !showActionInput }"
|
||||
@change="resetAction()"
|
||||
>
|
||||
<option
|
||||
@@ -61,6 +61,18 @@
|
||||
@click="removeAction"
|
||||
/>
|
||||
</div>
|
||||
<automation-action-team-message-input
|
||||
v-if="inputType === 'team_message'"
|
||||
v-model="action_params"
|
||||
:teams="dropdownValues"
|
||||
/>
|
||||
<textarea
|
||||
v-if="inputType === 'textarea'"
|
||||
v-model="action_params"
|
||||
rows="4"
|
||||
:placeholder="$t('AUTOMATION.ACTION.TEAM_MESSAGE_INPUT_PLACEHOLDER')"
|
||||
class="action-message"
|
||||
></textarea>
|
||||
<p
|
||||
v-if="v.action_params.$dirty && v.action_params.$error"
|
||||
class="filter-error"
|
||||
@@ -71,7 +83,11 @@
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import AutomationActionTeamMessageInput from './AutomationActionTeamMessageInput.vue';
|
||||
export default {
|
||||
components: {
|
||||
AutomationActionTeamMessageInput,
|
||||
},
|
||||
props: {
|
||||
value: {
|
||||
type: Object,
|
||||
@@ -211,4 +227,7 @@ export default {
|
||||
.multiselect {
|
||||
margin-bottom: var(--space-zero);
|
||||
}
|
||||
.action-message {
|
||||
margin: var(--space-small) 0 0;
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -0,0 +1,62 @@
|
||||
<template>
|
||||
<div>
|
||||
<div class="multiselect-wrap--small">
|
||||
<multiselect
|
||||
v-model="selectedTeams"
|
||||
track-by="id"
|
||||
label="name"
|
||||
:placeholder="$t('AUTOMATION.ACTION.TEAM_DROPDOWN_PLACEHOLDER')"
|
||||
:multiple="true"
|
||||
selected-label
|
||||
:select-label="$t('FORMS.MULTISELECT.ENTER_TO_SELECT')"
|
||||
deselect-label=""
|
||||
:max-height="160"
|
||||
:options="teams"
|
||||
:allow-empty="false"
|
||||
@input="updateValue"
|
||||
/>
|
||||
<textarea
|
||||
v-model="message"
|
||||
rows="4"
|
||||
:placeholder="$t('AUTOMATION.ACTION.TEAM_MESSAGE_INPUT_PLACEHOLDER')"
|
||||
@input="updateValue"
|
||||
></textarea>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
export default {
|
||||
// The value types are dynamic, hence prop validation removed to work with our action schema
|
||||
// eslint-disable-next-line vue/require-prop-types
|
||||
props: ['teams', 'value'],
|
||||
data() {
|
||||
return {
|
||||
selectedTeams: [],
|
||||
message: '',
|
||||
};
|
||||
},
|
||||
mounted() {
|
||||
const { team_ids: teamIds } = this.value;
|
||||
this.selectedTeams = teamIds;
|
||||
this.message = this.value.message;
|
||||
},
|
||||
methods: {
|
||||
updateValue() {
|
||||
this.$emit('input', {
|
||||
team_ids: this.selectedTeams.map(team => team.id),
|
||||
message: this.message,
|
||||
});
|
||||
},
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.multiselect {
|
||||
margin: var(--space-smaller) var(--space-zero);
|
||||
}
|
||||
textarea {
|
||||
margin-bottom: var(--space-zero);
|
||||
}
|
||||
</style>
|
||||
@@ -89,7 +89,9 @@
|
||||
"DELETE_MESSAGE": "You need to have atleast one condition to save"
|
||||
},
|
||||
"ACTION": {
|
||||
"DELETE_MESSAGE": "You need to have atleast one action to save"
|
||||
"DELETE_MESSAGE": "You need to have atleast one action to save",
|
||||
"TEAM_MESSAGE_INPUT_PLACEHOLDER": "Enter your message here",
|
||||
"TEAM_DROPDOWN_PLACEHOLDER": "Select teams"
|
||||
},
|
||||
"TOGGLE": {
|
||||
"ACTIVATION_TITLE": "Activate Automation Rule",
|
||||
|
||||
@@ -192,10 +192,11 @@ export default {
|
||||
$each: {
|
||||
action_params: {
|
||||
required: requiredIf(prop => {
|
||||
if (prop.action_name === 'send_email_to_team') return true;
|
||||
return !(
|
||||
prop.action_name === 'mute_conversation' ||
|
||||
prop.action_name === 'snooze_conversation' ||
|
||||
prop.action_name === 'resolve_convresation'
|
||||
prop.action_name === 'resolve_conversation'
|
||||
);
|
||||
}),
|
||||
},
|
||||
@@ -361,6 +362,7 @@ export default {
|
||||
getActionDropdownValues(type) {
|
||||
switch (type) {
|
||||
case 'assign_team':
|
||||
case 'send_email_to_team':
|
||||
return this.$store.getters['teams/getTeams'];
|
||||
case 'add_label':
|
||||
return this.$store.getters['labels/getLabels'].map(i => {
|
||||
@@ -443,6 +445,8 @@ export default {
|
||||
return true;
|
||||
},
|
||||
showActionInput(actionName) {
|
||||
if (actionName === 'send_email_to_team' || actionName === 'send_message')
|
||||
return false;
|
||||
const type = AUTOMATION_ACTION_TYPES.find(
|
||||
action => action.key === actionName
|
||||
).inputType;
|
||||
|
||||
@@ -199,7 +199,7 @@ export default {
|
||||
return !(
|
||||
prop.action_name === 'mute_conversation' ||
|
||||
prop.action_name === 'snooze_conversation' ||
|
||||
prop.action_name === 'resolve_convresation'
|
||||
prop.action_name === 'resolve_conversation'
|
||||
);
|
||||
}),
|
||||
},
|
||||
@@ -360,6 +360,7 @@ export default {
|
||||
getActionDropdownValues(type) {
|
||||
switch (type) {
|
||||
case 'assign_team':
|
||||
case 'send_email_to_team':
|
||||
return this.$store.getters['teams/getTeams'];
|
||||
case 'add_label':
|
||||
return this.$store.getters['labels/getLabels'].map(i => {
|
||||
@@ -475,6 +476,15 @@ export default {
|
||||
actionParams = [
|
||||
...this.getActionDropdownValues(action.action_name),
|
||||
].filter(item => [...action.action_params].includes(item.id));
|
||||
} else if (inputType === 'team_message') {
|
||||
actionParams = {
|
||||
team_ids: [
|
||||
...this.getActionDropdownValues(action.action_name),
|
||||
].filter(item =>
|
||||
[...action.action_params[0].team_ids].includes(item.id)
|
||||
),
|
||||
message: action.action_params[0].message,
|
||||
};
|
||||
} else actionParams = [...action.action_params];
|
||||
}
|
||||
return {
|
||||
@@ -489,6 +499,8 @@ export default {
|
||||
};
|
||||
},
|
||||
showActionInput(actionName) {
|
||||
if (actionName === 'send_email_to_team' || actionName === 'send_message')
|
||||
return false;
|
||||
const type = AUTOMATION_ACTION_TYPES.find(
|
||||
action => action.key === actionName
|
||||
).inputType;
|
||||
|
||||
@@ -253,7 +253,7 @@ export default {
|
||||
: this.$t('AUTOMATION.TOGGLE.ACTIVATION_DESCRIPTION', {
|
||||
automationName: automation.name,
|
||||
});
|
||||
// Check if uses confirms to proceed
|
||||
// Check if user confirms to proceed
|
||||
const ok = await this.$refs.confirmDialog.showConfirmation();
|
||||
if (ok) {
|
||||
await await this.$store.dispatch('automations/update', {
|
||||
|
||||
@@ -76,11 +76,16 @@ export const AUTOMATIONS = {
|
||||
name: 'Add a label',
|
||||
attributeI18nKey: 'ADD_LABEL',
|
||||
},
|
||||
// {
|
||||
// key: 'send_email_to_team',
|
||||
// name: 'Send an email to team',
|
||||
// attributeI18nKey: 'SEND_MESSAGE',
|
||||
// },
|
||||
{
|
||||
key: 'send_email_to_team',
|
||||
name: 'Send an email to team',
|
||||
attributeI18nKey: 'SEND_EMAIL_TO_TEAM',
|
||||
},
|
||||
{
|
||||
key: 'send_message',
|
||||
name: 'Send a message',
|
||||
attributeI18nKey: 'SEND_MESSAGE',
|
||||
},
|
||||
{
|
||||
key: 'send_email_transcript',
|
||||
name: 'Send an email transcript',
|
||||
@@ -96,8 +101,9 @@ export const AUTOMATIONS = {
|
||||
name: 'Snooze conversation',
|
||||
attributeI18nKey: 'MUTE_CONVERSATION',
|
||||
},
|
||||
|
||||
{
|
||||
key: 'resolve_convresation',
|
||||
key: 'resolve_conversation',
|
||||
name: 'Resolve conversation',
|
||||
attributeI18nKey: 'RESOLVE_CONVERSATION',
|
||||
},
|
||||
@@ -106,6 +112,11 @@ export const AUTOMATIONS = {
|
||||
name: 'Send Webhook Event',
|
||||
attributeI18nKey: 'SEND_WEBHOOK_EVENT',
|
||||
},
|
||||
// {
|
||||
// key: 'send_attachment',
|
||||
// name: 'Send Attachment',
|
||||
// attributeI18nKey: 'SEND_ATTACHMENT',
|
||||
// },
|
||||
],
|
||||
},
|
||||
conversation_created: {
|
||||
@@ -132,7 +143,7 @@ export const AUTOMATIONS = {
|
||||
filterOperators: OPERATOR_TYPES_1,
|
||||
},
|
||||
{
|
||||
key: 'referrer',
|
||||
key: 'referer',
|
||||
name: 'Referrer Link',
|
||||
attributeI18nKey: 'REFERER_LINK',
|
||||
inputType: 'plain_text',
|
||||
@@ -150,11 +161,16 @@ export const AUTOMATIONS = {
|
||||
name: 'Assign an agent',
|
||||
attributeI18nKey: 'ASSIGN_AGENT',
|
||||
},
|
||||
// {
|
||||
// key: 'send_email_to_team',
|
||||
// name: 'Send an email to team',
|
||||
// attributeI18nKey: 'SEND_MESSAGE',
|
||||
// },
|
||||
{
|
||||
key: 'send_email_to_team',
|
||||
name: 'Send an email to team',
|
||||
attributeI18nKey: 'SEND_EMAIL_TO_TEAM',
|
||||
},
|
||||
{
|
||||
key: 'send_message',
|
||||
name: 'Send a message',
|
||||
attributeI18nKey: 'SEND_MESSAGE',
|
||||
},
|
||||
{
|
||||
key: 'send_email_transcript',
|
||||
name: 'Send an email transcript',
|
||||
@@ -171,7 +187,7 @@ export const AUTOMATIONS = {
|
||||
attributeI18nKey: 'MUTE_CONVERSATION',
|
||||
},
|
||||
{
|
||||
key: 'resolve_convresation',
|
||||
key: 'resolve_conversation',
|
||||
name: 'Resolve conversation',
|
||||
attributeI18nKey: 'RESOLVE_CONVERSATION',
|
||||
},
|
||||
@@ -180,6 +196,11 @@ export const AUTOMATIONS = {
|
||||
name: 'Send Webhook Event',
|
||||
attributeI18nKey: 'SEND_WEBHOOK_EVENT',
|
||||
},
|
||||
// {
|
||||
// key: 'send_attachment',
|
||||
// name: 'Send Attachment',
|
||||
// attributeI18nKey: 'SEND_ATTACHMENT',
|
||||
// },
|
||||
],
|
||||
},
|
||||
conversation_updated: {
|
||||
@@ -238,11 +259,16 @@ export const AUTOMATIONS = {
|
||||
name: 'Assign an agent',
|
||||
attributeI18nKey: 'ASSIGN_AGENT',
|
||||
},
|
||||
// {
|
||||
// key: 'send_email_to_team',
|
||||
// name: 'Send an email to team',
|
||||
// attributeI18nKey: 'SEND_MESSAGE',
|
||||
// },
|
||||
{
|
||||
key: 'send_email_to_team',
|
||||
name: 'Send an email to team',
|
||||
attributeI18nKey: 'SEND_EMAIL_TO_TEAM',
|
||||
},
|
||||
{
|
||||
key: 'send_message',
|
||||
name: 'Send a message',
|
||||
attributeI18nKey: 'SEND_MESSAGE',
|
||||
},
|
||||
{
|
||||
key: 'send_email_transcript',
|
||||
name: 'Send an email transcript',
|
||||
@@ -259,7 +285,7 @@ export const AUTOMATIONS = {
|
||||
attributeI18nKey: 'MUTE_CONVERSATION',
|
||||
},
|
||||
{
|
||||
key: 'resolve_convresation',
|
||||
key: 'resolve_conversation',
|
||||
name: 'Resolve conversation',
|
||||
attributeI18nKey: 'RESOLVE_CONVERSATION',
|
||||
},
|
||||
@@ -268,6 +294,11 @@ export const AUTOMATIONS = {
|
||||
name: 'Send Webhook Event',
|
||||
attributeI18nKey: 'SEND_WEBHOOK_EVENT',
|
||||
},
|
||||
// {
|
||||
// key: 'send_attachment',
|
||||
// name: 'Send Attachment',
|
||||
// attributeI18nKey: 'SEND_ATTACHMENT',
|
||||
// },
|
||||
],
|
||||
},
|
||||
};
|
||||
@@ -298,11 +329,11 @@ export const AUTOMATION_ACTION_TYPES = [
|
||||
label: 'Add a label',
|
||||
inputType: 'multi_select',
|
||||
},
|
||||
// {
|
||||
// key: 'send_email_to_team',
|
||||
// label: 'Send an email to team',
|
||||
// inputType: 'multi_select',
|
||||
// },
|
||||
{
|
||||
key: 'send_email_to_team',
|
||||
label: 'Send an email to team',
|
||||
inputType: 'team_message',
|
||||
},
|
||||
{
|
||||
key: 'send_email_transcript',
|
||||
label: 'Send an email transcript',
|
||||
@@ -319,7 +350,7 @@ export const AUTOMATION_ACTION_TYPES = [
|
||||
inputType: null,
|
||||
},
|
||||
{
|
||||
key: 'resolve_convresation',
|
||||
key: 'resolve_conversation',
|
||||
label: 'Resolve conversation',
|
||||
inputType: null,
|
||||
},
|
||||
@@ -328,4 +359,14 @@ export const AUTOMATION_ACTION_TYPES = [
|
||||
label: 'Send Webhook Event',
|
||||
inputType: 'url',
|
||||
},
|
||||
// {
|
||||
// key: 'send_attachment',
|
||||
// label: 'Send Attachment',
|
||||
// inputType: 'file',
|
||||
// },
|
||||
{
|
||||
key: 'send_message',
|
||||
label: 'Send a message',
|
||||
inputType: 'textarea',
|
||||
},
|
||||
];
|
||||
|
||||
Reference in New Issue
Block a user