Merge branch 'master' of gitlab.com:mohit.panjvani/crater-web

This commit is contained in:
Mohit Panjwani
2019-11-18 19:56:04 +05:30
25 changed files with 3367 additions and 384 deletions

View File

@ -75,9 +75,19 @@ class EnvironmentController extends Controller
'mail_port' => config('mail.port'), 'mail_port' => config('mail.port'),
'mail_username' => config('mail.username'), 'mail_username' => config('mail.username'),
'mail_password' => config('mail.password'), 'mail_password' => config('mail.password'),
'mail_encryption' => config('mail.encryption') 'mail_encryption' => config('mail.encryption'),
'from_name' => config('mail.from.name'),
'from_mail' => config('mail.from.address'),
'mail_mailgun_endpoint' => config('services.mailgun.endpoint'),
'mail_mailgun_domain' => config('services.mailgun.domain'),
'mail_mailgun_secret' => config('services.mailgun.secret'),
'mail_sparkpost_secret' => config('services.sparkpost.secret'),
'mail_ses_key' => config('services.ses.key'),
'mail_ses_secret' => config('services.ses.secret'),
'mail_mandrill_secret' => config('services.mandrill.secret'),
]; ];
return response()->json($MailData); return response()->json($MailData);
} }

View File

@ -23,13 +23,85 @@ class MailEnvironmentRequest extends FormRequest
*/ */
public function rules() public function rules()
{ {
return [ switch ($this->get('mail_driver')) {
'mail_driver' => 'required|string|max:50', case 'smtp':
'mail_host' => 'required|string|max:50', return [
'mail_port' => 'required|max:50', 'mail_driver' => 'required|string|max:50',
'mail_username' => 'required|string|max:50', 'mail_host' => 'required|string|max:50',
'mail_password' => 'required|string|max:50', 'mail_port' => 'required|max:50',
'mail_encryption' => 'required|string|max:50', 'mail_username' => 'required|string|max:50',
]; 'mail_password' => 'required|string|max:50',
'mail_encryption' => 'required|string|max:50',
'from_name' => 'required|string|max:50',
'from_mail' => 'required|string|max:50',
];
break;
case 'mailgun':
return [
'mail_driver' => 'required|string|max:50',
'mail_host' => 'required|string|max:50',
'mail_port' => 'required|max:50',
'mail_mailgun_domain' => 'required|string|max:50',
'mail_mailgun_secret' => 'required|string|max:50',
'mail_mailgun_endpoint' => 'required|string|max:50',
'mail_encryption' => 'required|string|max:50',
'from_name' => 'required|string|max:50',
'from_mail' => 'required|string|max:50',
];
break;
case 'sparkpost':
return [
'mail_driver' => 'required|string|max:50',
'mail_host' => 'required|string|max:50',
'mail_port' => 'required|max:50',
'mail_sparkpost_secret' => 'required|string|max:50',
'mail_encryption' => 'required|string|max:50',
'from_name' => 'required|string|max:50',
'from_mail' => 'required|string|max:50',
];
break;
case 'ses':
return [
'mail_driver' => 'required|string|max:50',
'mail_host' => 'required|string|max:50',
'mail_port' => 'required|max:50',
'mail_ses_key' => 'required|string|max:50',
'mail_ses_secret' => 'required|string|max:50',
'mail_encryption' => 'required|string|max:50',
'from_name' => 'required|string|max:50',
'from_mail' => 'required|string|max:50',
];
break;
case 'mail':
return [
'from_name' => 'required|string|max:50',
'from_mail' => 'required|string|max:50',
];
break;
case 'sendmail':
return [
'from_name' => 'required|string|max:50',
'from_mail' => 'required|string|max:50',
];
break;
case 'mandrill':
return [
'mail_driver' => 'required|string|max:50',
'mail_host' => 'required|string|max:50',
'mail_port' => 'required|max:50',
'mail_mandrill_secret' => 'required|string|max:50',
'mail_encryption' => 'required|string|max:50',
'from_name' => 'required|string|max:50',
'from_mail' => 'required|string|max:50',
];
break;
}
} }
} }

View File

@ -94,33 +94,14 @@ class EnvironmentManager
*/ */
public function saveMailVariables(MailEnvironmentRequest $request) public function saveMailVariables(MailEnvironmentRequest $request)
{ {
$oldMailData =
'MAIL_DRIVER='.config('mail.driver')."\n".
'MAIL_HOST='.config('mail.host')."\n".
'MAIL_PORT='.config('mail.port')."\n".
'MAIL_USERNAME='.config('mail.username')."\n".
'MAIL_PASSWORD='.config('mail.password')."\n".
'MAIL_ENCRYPTION='.config('mail.encryption')."\n\n";
$newMailData =
'MAIL_DRIVER='.$request->mail_driver."\n".
'MAIL_HOST='.$request->mail_host."\n".
'MAIL_PORT='.$request->mail_port."\n".
'MAIL_USERNAME='.$request->mail_username."\n".
'MAIL_PASSWORD='.$request->mail_password."\n".
'MAIL_ENCRYPTION='.$request->mail_encryption."\n\n";
$mailData = $this->getMailData($request);
dd($mailData);
try { try {
file_put_contents($this->envPath, str_replace( file_put_contents($this->envPath, str_replace(
$oldMailData, $mailData['old_mail_data'],
$newMailData, $mailData['new_mail_data'],
file_get_contents($this->envPath)
));
file_put_contents($this->envPath, str_replace(
$oldMailData,
$newMailData,
file_get_contents($this->envPath) file_get_contents($this->envPath)
)); ));
@ -135,6 +116,131 @@ class EnvironmentManager
]; ];
} }
private function getMailData($request)
{
$mailCredential = "";
$otherCredential = "";
$oldMailOtherCredential = "";
if(env('MAIL_FROM_ADDRESS') && env('MAIL_FROM_NAME')) {
$oldMailOtherCredential =
'MAIL_FROM_ADDRESS='.config('mail.from.address')."\n".
'MAIL_FROM_NAME='.config('mail.from.name')."\n\n";
}
$oldMailCredential =
'MAIL_USERNAME='.config('mail.username')."\n".
'MAIL_PASSWORD='.config('mail.password')."\n";
$resetCredential =
'MAIL_USERNAME='."\n".
'MAIL_PASSWORD='."\n";
switch ($request->mail_driver) {
case 'smtp':
$mailCredential=
'MAIL_USERNAME='.$request->mail_username."\n".
'MAIL_PASSWORD='.$request->mail_password."\n";
break;
case 'mailgun':
$mailCredential = $resetCredential;
$otherCredential=
'MAILGUN_DOMAIN='.$request->mail_mailgun_domain."\n".
'MAILGUN_SECRET='.$request->mail_mailgun_secret."\n".
'MAILGUN_ENDPOINT='.$request->mail_mailgun_endpoint."\n\n";
if(env('MAILGUN_DOMAIN') && env('MAILGUN_SECRET') && env('MAILGUN_ENDPOINT')) {
$oldMailOtherCredential =
'MAILGUN_DOMAIN='.config('services.mailgun.domain')."\n".
'MAILGUN_SECRET='.config('services.mailgun.secret')."\n".
'MAILGUN_ENDPOINT='.config('services.mailgun.endpoint')."\n\n";
}
break;
case 'sparkpost':
$mailCredential = $resetCredential;
$otherCredential=
'SPARKPOST_SECRET='.$request->mail_sparkpost_secret."\n\n";
if(env('SPARKPOST_SECRET')) {
$oldMailOtherCredential =
'SPARKPOST_SECRET='.config('services.sparkpost.secret')."\n\n";
}
break;
case 'ses':
$mailCredential = $resetCredential;
$otherCredential=
'SES_KEY='.$request->mail_ses_key."\n".
'SES_SECRET='.$request->mail_ses_secret."\n\n";
if(env('SES_KEY') && env('SES_SECRET')) {
$oldMailOtherCredential =
'SES_KEY='.config('services.ses.key')."\n".
'SES_SECRET='.config('services.ses.secret')."\n\n";
}
break;
case 'mail':
$existMailData = 'MAIL_DRIVER='.$request->mail_driver."\n".
'MAIL_HOST='.config('mail.host')."\n".
'MAIL_PORT='.config('mail.port')."\n".
$resetCredential.
'MAIL_ENCRYPTION='.config('mail.encryption')."\n\n".
'MAIL_FROM_ADDRESS='.$request->from_mail."\n".
'MAIL_FROM_NAME='.$request->from_name."\n\n".
$otherCredential;
break;
case 'sendmail':
$existMailData = 'MAIL_DRIVER='.$request->mail_driver."\n".
'MAIL_HOST='.config('mail.host')."\n".
'MAIL_PORT='.config('mail.port')."\n".
$resetCredential.
'MAIL_ENCRYPTION='.config('mail.encryption')."\n\n".
'MAIL_FROM_ADDRESS='.$request->from_mail."\n".
'MAIL_FROM_NAME='.$request->from_name."\n\n".
$otherCredential;
break;
case 'mandrill':
$mailCredential = $oldMailCredential;
$otherCredential=
'MANDRILL_API_KEY='.$request->mail_mandrill_secret."\n\n";
if(env('MANDRILL_API_KEY')) {
$oldMailOtherCredential =
'MANDRILL_API_KEY='.config('services.mandrill.secret')."\n\n";
}
break;
}
$oldMailData =
'MAIL_DRIVER='.config('mail.driver')."\n".
'MAIL_HOST='.config('mail.host')."\n".
'MAIL_PORT='.config('mail.port')."\n".
$oldMailCredential.
'MAIL_ENCRYPTION='.config('mail.encryption')."\n\n".
$oldMailOtherCredential;
$newMailData = $existMailData ??
'MAIL_DRIVER='.$request->mail_driver."\n".
'MAIL_HOST='.$request->mail_host."\n".
'MAIL_PORT='.$request->mail_port."\n".
$mailCredential.
'MAIL_ENCRYPTION='.$request->mail_encryption."\n\n".
'MAIL_FROM_ADDRESS='.$request->from_mail."\n".
'MAIL_FROM_NAME='.$request->from_name."\n\n".
$otherCredential;
return [
'old_mail_data' => $oldMailData,
'new_mail_data' => $newMailData
];
}
/** /**
* *
* @param DatabaseEnvironmentRequest $request * @param DatabaseEnvironmentRequest $request

View File

@ -34,6 +34,10 @@ return [
'api_key' => env('SENDGRID_API_KEY'), 'api_key' => env('SENDGRID_API_KEY'),
], ],
'mandrill' => [
'secret' => env('MANDRILL_API_KEY'),
],
'stripe' => [ 'stripe' => [
'model' => Crater\User::class, 'model' => Crater\User::class,
'key' => env('STRIPE_KEY'), 'key' => env('STRIPE_KEY'),

View File

@ -565,9 +565,19 @@ export default {
host: 'Mail Host', host: 'Mail Host',
port: 'Mail Port', port: 'Mail Port',
driver: 'Mail Driver', driver: 'Mail Driver',
domain: 'Domain',
secret: 'Secret',
sparkpost_secret: 'Sparkpost Secret',
mailgin_secret: 'Mailgun Secret',
ses_secret: 'SES Secret',
mandrill_secret: 'Mandrill Secret',
ses_key: 'SES Key',
password: 'Mail Password', password: 'Mail Password',
username: 'Mail Username', username: 'Mail Username',
endpoint: 'Mail Endpoint',
mail_config: 'Mail Configuration', mail_config: 'Mail Configuration',
from_name: 'From Mail Name',
from_mail: 'From Mail Address',
encryption: 'Mail Encryption', encryption: 'Mail Encryption',
mail_config_desc: 'Below details will be used to update the mail environment. Also you can change the details anytime after logging in.' mail_config_desc: 'Below details will be used to update the mail environment. Also you can change the details anytime after logging in.'
}, },
@ -733,9 +743,19 @@ export default {
host: 'Mail Host', host: 'Mail Host',
port: 'Mail Port', port: 'Mail Port',
driver: 'Mail Driver', driver: 'Mail Driver',
domain: 'Domain',
secret: 'Secret',
sparkpost_secret: 'Sparkpost Secret',
mailgin_secret: 'Mailgun Secret',
ses_secret: 'SES Secret',
mandrill_secret: 'Mandrill Secret',
ses_key: 'SES Key',
password: 'Mail Password', password: 'Mail Password',
username: 'Mail Username', username: 'Mail Username',
endpoint: 'Mail Endpoint',
mail_config: 'Mail Configuration', mail_config: 'Mail Configuration',
from_name: 'From Mail Name',
from_mail: 'From Mail Address',
encryption: 'Mail Encryption', encryption: 'Mail Encryption',
mail_config_desc: 'Below details will be used to update the mail environment. Also you can change the details anytime after logging in.' mail_config_desc: 'Below details will be used to update the mail environment. Also you can change the details anytime after logging in.'
}, },

View File

@ -3,7 +3,7 @@ import * as types from './mutation-types'
export const loadData = ({ commit, dispatch, state }, params) => { export const loadData = ({ commit, dispatch, state }, params) => {
return new Promise((resolve, reject) => { return new Promise((resolve, reject) => {
window.axios.get(`/api/dashboard`, {params}).then((response) => { window.axios.get(`/api/dashboard`, { params }).then((response) => {
commit(types.SET_INITIAL_DATA, response.data) commit(types.SET_INITIAL_DATA, response.data)
commit(types.GET_INITIAL_DATA, true) commit(types.GET_INITIAL_DATA, true)
resolve(response) resolve(response)
@ -23,3 +23,108 @@ export const getChart = ({ commit, dispatch, state }) => {
}) })
}) })
} }
export const sendEmail = ({ commit, dispatch, state }, data) => {
return new Promise((resolve, reject) => {
window.axios.post(`/api/invoices/send`, data).then((response) => {
commit(types.UPDATE_INVOICE_STATUS, { id: data.id, status: 'SENT' })
resolve(response)
}).catch((err) => {
reject(err)
})
})
}
export const markAsSent = ({ commit, dispatch, state }, data) => {
return new Promise((resolve, reject) => {
window.axios.post(`/api/invoices/mark-as-sent`, data).then((response) => {
commit(types.UPDATE_INVOICE_STATUS, { id: data.id, status: 'SENT' })
resolve(response)
}).catch((err) => {
reject(err)
})
})
}
export const deleteInvoice = ({ commit, dispatch, state }, id) => {
return new Promise((resolve, reject) => {
window.axios.delete(`/api/invoices/${id}`).then((response) => {
if (response.data.error) {
resolve(response)
} else {
commit(types.DELETE_INVOICE, id)
resolve(response)
}
}).catch((err) => {
reject(err)
})
})
}
export const sendEstimateEmail = ({ commit, dispatch, state }, data) => {
return new Promise((resolve, reject) => {
window.axios.post(`/api/estimates/send`, data).then((response) => {
commit(types.UPDATE_ESTIMATE_STATUS, { id: data.id, status: 'SENT' })
resolve(response)
}).catch((err) => {
reject(err)
})
})
}
export const markAsAccepted = ({ commit, dispatch, state }, data) => {
return new Promise((resolve, reject) => {
window.axios.post(`/api/estimates/accept`, data).then((response) => {
commit(types.UPDATE_ESTIMATE_STATUS, { id: data.id, status: 'ACCEPTED' })
resolve(response)
}).catch((err) => {
reject(err)
})
})
}
export const markAsRejected = ({ commit, dispatch, state }, data) => {
return new Promise((resolve, reject) => {
window.axios.post(`/api/estimates/reject`, data).then((response) => {
commit(types.UPDATE_ESTIMATE_STATUS, { id: data.id, status: 'REJECTED' })
resolve(response)
}).catch((err) => {
reject(err)
})
})
}
export const markEstimateAsSent = ({ commit, dispatch, state }, data) => {
return new Promise((resolve, reject) => {
window.axios.post(`/api/estimates/mark-as-sent`, data).then((response) => {
commit(types.UPDATE_ESTIMATE_STATUS, { id: data.id, status: 'SENT' })
resolve(response)
}).catch((err) => {
reject(err)
})
})
}
export const convertToInvoice = ({ commit, dispatch, state }, id) => {
return new Promise((resolve, reject) => {
window.axios.post(`/api/estimates/${id}/convert-to-invoice`).then((response) => {
// commit(types.UPDATE_INVOICE, response.data)
resolve(response)
}).catch((err) => {
reject(err)
})
})
}
export const deleteEstimate = ({ commit, dispatch, state }, id) => {
return new Promise((resolve, reject) => {
window.axios.delete(`/api/estimates/${id}`).then((response) => {
commit(types.DELETE_ESTIMATE, id)
resolve(response)
}).catch((err) => {
reject(err)
})
})
}

View File

@ -1,2 +1,6 @@
export const SET_INITIAL_DATA = 'SET_INITIAL_DATA' export const SET_INITIAL_DATA = 'SET_INITIAL_DATA'
export const GET_INITIAL_DATA = 'GET_INITIAL_DATA' export const GET_INITIAL_DATA = 'GET_INITIAL_DATA'
export const DELETE_INVOICE = 'DELETE_INVOICE'
export const UPDATE_INVOICE_STATUS = 'UPDATE_INVOICE_STATUS'
export const DELETE_ESTIMATE = 'DELETE_ESTIMATE'
export const UPDATE_ESTIMATE_STATUS = 'UPDATE_ESTIMATE_STATUS'

View File

@ -1,7 +1,7 @@
import * as types from './mutation-types' import * as types from './mutation-types'
export default { export default {
[types.SET_INITIAL_DATA] (state, data) { [types.SET_INITIAL_DATA](state, data) {
state.contacts = data.customersCount state.contacts = data.customersCount
state.invoices = data.invoicesCount state.invoices = data.invoicesCount
state.estimates = data.estimatesCount state.estimates = data.estimatesCount
@ -30,7 +30,29 @@ export default {
state.netProfit = data.netProfit state.netProfit = data.netProfit
}, },
[types.GET_INITIAL_DATA] (state, data) { [types.GET_INITIAL_DATA](state, data) {
state.isDataLoaded = data state.isDataLoaded = data
} },
[types.UPDATE_INVOICE_STATUS](state, data) {
let pos = state.dueInvoices.findIndex(invoice => invoice.id === data.id)
state.dueInvoices[pos].status = data.status
},
[types.DELETE_INVOICE](state, id) {
let index = state.dueInvoices.findIndex(invoice => invoice.id === id)
state.dueInvoices.splice(index, 1)
},
[types.DELETE_ESTIMATE](state, id) {
let index = state.recentEstimates.findIndex(estimate => estimate.id === id)
state.recentEstimates.splice(index, 1)
},
[types.UPDATE_ESTIMATE_STATUS](state, data) {
let pos = state.recentEstimates.findIndex(estimate => estimate.id === data.id)
state.recentEstimates[pos].status = data.status
},
} }

View File

@ -160,7 +160,7 @@
</div> </div>
<div class="dashboard-table"> <div class="dashboard-table">
<table-component <table-component
ref="table" ref="inv_table"
:data="getDueInvoices" :data="getDueInvoices"
:show-filter="false" :show-filter="false"
table-class="table" table-class="table"
@ -168,6 +168,15 @@
> >
<table-column :label="$t('dashboard.recent_invoices_card.due_on')" show="formattedDueDate" /> <table-column :label="$t('dashboard.recent_invoices_card.due_on')" show="formattedDueDate" />
<table-column :label="$t('dashboard.recent_invoices_card.customer')" show="user.name" /> <table-column :label="$t('dashboard.recent_invoices_card.customer')" show="user.name" />
<table-column
:label="$t('invoices.status')"
sort-as="status"
>
<template slot-scope="row" >
<span> {{ $t('invoices.status') }}</span>
<span :class="'inv-status-'+row.status.toLowerCase()">{{ (row.status != 'PARTIALLY_PAID')? row.status : row.status.replace('_', ' ') }}</span>
</template>
</table-column>
<table-column :label="$t('dashboard.recent_invoices_card.amount_due')" show="due_amount" sort-as="due_amount"> <table-column :label="$t('dashboard.recent_invoices_card.amount_due')" show="due_amount" sort-as="due_amount">
<template slot-scope="row"> <template slot-scope="row">
<span>{{ $t('dashboard.recent_invoices_card.amount_due') }}</span> <span>{{ $t('dashboard.recent_invoices_card.amount_due') }}</span>
@ -235,13 +244,21 @@
</div> </div>
<div class="dashboard-table"> <div class="dashboard-table">
<table-component <table-component
ref="table" ref="est_table"
:data="getRecentEstimates" :data="getRecentEstimates"
:show-filter="false" :show-filter="false"
table-class="table" table-class="table"
> >
<table-column :label="$t('dashboard.recent_estimate_card.date')" show="formattedExpiryDate" /> <table-column :label="$t('dashboard.recent_estimate_card.date')" show="formattedExpiryDate" />
<table-column :label="$t('dashboard.recent_estimate_card.customer')" show="user.name" /> <table-column :label="$t('dashboard.recent_estimate_card.customer')" show="user.name" />
<table-column
:label="$t('estimates.status')"
show="status" >
<template slot-scope="row" >
<span> {{ $t('estimates.status') }}</span>
<span :class="'est-status-'+row.status.toLowerCase()">{{ row.status }}</span>
</template>
</table-column>
<table-column :label="$t('dashboard.recent_estimate_card.amount_due')" show="total" sort-as="total"> <table-column :label="$t('dashboard.recent_estimate_card.amount_due')" show="total" sort-as="total">
<template slot-scope="row"> <template slot-scope="row">
<span>{{ $t('dashboard.recent_estimate_card.amount_due') }}</span> <span>{{ $t('dashboard.recent_estimate_card.amount_due') }}</span>
@ -288,6 +305,24 @@
{{ $t('estimates.mark_as_sent') }} {{ $t('estimates.mark_as_sent') }}
</a> </a>
</v-dropdown-item> </v-dropdown-item>
<v-dropdown-item v-if="row.status !== 'SENT'">
<a class="dropdown-item" href="#" @click.self="sendEstimate(row.id)">
<font-awesome-icon icon="paper-plane" class="dropdown-item-icon" />
{{ $t('estimates.send_estimate') }}
</a>
</v-dropdown-item>
<v-dropdown-item v-if="row.status !== 'ACCEPTED'">
<a class="dropdown-item" href="#" @click.self="onMarkAsAccepted(row.id)">
<font-awesome-icon icon="check-circle" class="dropdown-item-icon" />
{{ $t('estimates.mark_as_accepted') }}
</a>
</v-dropdown-item>
<v-dropdown-item v-if="row.status !== 'REJECTED'">
<a class="dropdown-item" href="#" @click.self="onMarkAsRejected(row.id)">
<font-awesome-icon icon="times-circle" class="dropdown-item-icon" />
{{ $t('estimates.mark_as_rejected') }}
</a>
</v-dropdown-item>
</v-dropdown> </v-dropdown>
</template> </template>
</table-column> </table-column>
@ -369,16 +404,16 @@ export default {
methods: { methods: {
...mapActions('dashboard', [ ...mapActions('dashboard', [
'getChart', 'getChart',
'loadData' 'loadData',
]),
...mapActions('estimate', [
'deleteEstimate',
'convertToInvoice'
]),
...mapActions('invoice', [
'deleteInvoice', 'deleteInvoice',
'sendEmail', 'sendEmail',
'markAsSent' 'markAsSent',
'sendEstimateEmail',
'deleteEstimate',
'markAsAccepted',
'markAsRejected',
'markEstimateAsSent',
'convertToInvoice'
]), ]),
async loadChart () { async loadChart () {
@ -404,7 +439,7 @@ export default {
let res = await this.deleteEstimate(this.id) let res = await this.deleteEstimate(this.id)
if (res.data.success) { if (res.data.success) {
window.toastr['success'](this.$tc('estimates.deleted_message', 1)) window.toastr['success'](this.$tc('estimates.deleted_message', 1))
this.$refs.table.refresh() this.refreshEstTable()
} else if (res.data.error) { } else if (res.data.error) {
window.toastr['error'](res.data.message) window.toastr['error'](res.data.message)
} }
@ -412,6 +447,14 @@ export default {
}) })
}, },
refreshInvTable () {
this.$refs.inv_table.refresh()
},
refreshEstTable () {
this.$refs.est_table.refresh()
},
async convertInToinvoice (id) { async convertInToinvoice (id) {
swal({ swal({
title: this.$t('general.are_you_sure'), title: this.$t('general.are_you_sure'),
@ -432,6 +475,7 @@ export default {
} }
}) })
}, },
async onMarkAsSent (id) { async onMarkAsSent (id) {
swal({ swal({
title: this.$t('general.are_you_sure'), title: this.$t('general.are_you_sure'),
@ -444,8 +488,8 @@ export default {
const data = { const data = {
id: id id: id
} }
let response = await this.markAsSent(data) let response = await this.markEstimateAsSent(data)
this.$refs.table.refresh() this.refreshEstTable()
if (response.data) { if (response.data) {
window.toastr['success'](this.$tc('estimates.mark_as_sent_successfully')) window.toastr['success'](this.$tc('estimates.mark_as_sent_successfully'))
} }
@ -466,7 +510,7 @@ export default {
let res = await this.deleteInvoice(this.id) let res = await this.deleteInvoice(this.id)
if (res.data.success) { if (res.data.success) {
window.toastr['success'](this.$tc('invoices.deleted_message')) window.toastr['success'](this.$tc('invoices.deleted_message'))
this.$refs.table.refresh() this.refreshInvTable()
} else if (res.data.error) { } else if (res.data.error) {
window.toastr['error'](res.data.message) window.toastr['error'](res.data.message)
} }
@ -487,13 +531,14 @@ export default {
id: id id: id
} }
let response = await this.sendEmail(data) let response = await this.sendEmail(data)
this.$refs.table.refresh() this.refreshInvTable()
if (response.data) { if (response.data) {
window.toastr['success'](this.$tc('invoices.send_invoice_successfully')) window.toastr['success'](this.$tc('invoices.send_invoice_successfully'))
} }
} }
}) })
}, },
async sentInvoice (id) { async sentInvoice (id) {
swal({ swal({
title: this.$t('general.are_you_sure'), title: this.$t('general.are_you_sure'),
@ -507,12 +552,77 @@ export default {
id: id id: id
} }
let response = await this.markAsSent(data) let response = await this.markAsSent(data)
this.$refs.table.refresh() this.refreshInvTable()
if (response.data) { if (response.data) {
window.toastr['success'](this.$tc('invoices.mark_as_sent_successfully')) window.toastr['success'](this.$tc('invoices.mark_as_sent_successfully'))
} }
} }
}) })
},
async onMarkAsAccepted (id) {
swal({
title: this.$t('general.are_you_sure'),
text: this.$t('estimates.confirm_mark_as_accepted'),
icon: '/assets/icon/check-circle-solid.svg',
buttons: true,
dangerMode: true
}).then(async (markedAsRejected) => {
if (markedAsRejected) {
const data = {
id: id
}
let response = await this.markAsAccepted(data)
this.refreshEstTable()
if (response.data) {
this.refreshEstTable()
window.toastr['success'](this.$tc('estimates.marked_as_accepted_message'))
}
}
})
},
async onMarkAsRejected (id) {
swal({
title: this.$t('general.are_you_sure'),
text: this.$t('estimates.confirm_mark_as_rejected'),
icon: '/assets/icon/times-circle-solid.svg',
buttons: true,
dangerMode: true
}).then(async (markedAsRejected) => {
if (markedAsRejected) {
const data = {
id: id
}
let response = await this.markAsRejected(data)
this.refreshEstTable()
if (response.data) {
this.refreshEstTable()
window.toastr['success'](this.$tc('estimates.marked_as_rejected_message'))
}
}
})
},
async sendEstimate (id) {
swal({
title: this.$t('general.are_you_sure'),
text: this.$t('estimates.confirm_send_estimate'),
icon: '/assets/icon/paper-plane-solid.svg',
buttons: true,
dangerMode: true
}).then(async (willSendEstimate) => {
if (willSendEstimate) {
const data = {
id: id
}
let response = await this.sendEstimateEmail(data)
this.refreshEstTable()
if (response.data) {
window.toastr['success'](this.$tc('estimates.send_estimate_successfully'))
}
}
})
} }
} }

View File

@ -127,7 +127,7 @@
<a :class="['tab-link', {'a-active': filters.status === 'SENT'}]" href="#" >{{ $t('general.sent') }}</a> <a :class="['tab-link', {'a-active': filters.status === 'SENT'}]" href="#" >{{ $t('general.sent') }}</a>
</li> </li>
<li class="tab" @click="getStatus('')"> <li class="tab" @click="getStatus('')">
<a :class="['tab-link', {'a-active': filters.status === '' || filters.status === null}]" href="#">{{ $t('general.all') }}</a> <a :class="['tab-link', {'a-active': filters.status === '' || filters.status !== 'DRAFT' && filters.status !== 'SENT'}]" href="#">{{ $t('general.all') }}</a>
</li> </li>
</ul> </ul>
<transition name="fade"> <transition name="fade">
@ -426,7 +426,7 @@ export default {
if (response.data) { if (response.data) {
this.filters.status = 'ACCEPTED' this.filters.status = 'ACCEPTED'
this.$refs.table.refresh() this.$refs.table.refresh()
window.toastr['success'](this.$tc('estimates.confirm_mark_as_accepted')) window.toastr['success'](this.$tc('estimates.marked_as_accepted_message'))
} }
} }
}) })

View File

@ -47,13 +47,8 @@
<label class="input-label">{{ $tc('settings.company_info.phone') }}</label> <label class="input-label">{{ $tc('settings.company_info.phone') }}</label>
<base-input <base-input
v-model="formData.phone" v-model="formData.phone"
:invalid="$v.formData.phone.$error"
:placeholder="$t('settings.company_info.phone')" :placeholder="$t('settings.company_info.phone')"
@input="$v.formData.phone.$touch()"
/> />
<div v-if="$v.formData.phone.$error">
<span v-if="!$v.formData.phone.phone" class="text-danger">{{ $tc('validation.numbers_only') }}</span>
</div>
</div> </div>
<div class="col-md-6 mb-4"> <div class="col-md-6 mb-4">
<label class="input-label">{{ $tc('settings.company_info.country') }}</label><span class="text-danger"> * </span> <label class="input-label">{{ $tc('settings.company_info.country') }}</label><span class="text-danger"> * </span>
@ -260,9 +255,6 @@ export default {
email: { email: {
email email
}, },
phone: {
numeric
},
address_street_1: { address_street_1: {
maxLength: maxLength(255) maxLength: maxLength(255)
}, },

View File

@ -7,175 +7,49 @@
{{ $t('settings.mail.mail_config_desc') }} {{ $t('settings.mail.mail_config_desc') }}
</p> </p>
</div> </div>
<form action="" @submit.prevent="saveEmailConfig()"> <div v-if="mailConfigData">
<div class="row"> <component
<div class="col-md-6 my-2"> :is="mail_driver"
<label class="form-label">{{ $t('settings.mail.driver') }}</label> :config-data="mailConfigData"
<span class="text-danger"> *</span>
<base-select
v-model="mailConfigData.mail_driver"
:invalid="$v.mailConfigData.mail_driver.$error"
:options="mail_drivers"
:searchable="true"
:show-labels="false"
@change="$v.mailConfigData.mail_driver.$touch()"
/>
<div v-if="$v.mailConfigData.mail_driver.$error">
<span v-if="!$v.mailConfigData.mail_driver.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('settings.mail.host') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_host.$error"
v-model.trim="mailConfigData.mail_host"
type="text"
name="mail_host"
@input="$v.mailConfigData.mail_host.$touch()"
/>
<div v-if="$v.mailConfigData.mail_host.$error">
<span v-if="!$v.mailConfigData.mail_host.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<div class="row my-2">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('settings.mail.username') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_username.$error"
v-model.trim="mailConfigData.mail_username"
type="text"
name="db_name"
@input="$v.mailConfigData.mail_username.$touch()"
/>
<div v-if="$v.mailConfigData.mail_username.$error">
<span v-if="!$v.mailConfigData.mail_username.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('settings.mail.password') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_password.$error"
v-model.trim="mailConfigData.mail_password"
type="password"
name="name"
show-password
@input="$v.mailConfigData.mail_password.$touch()"
/>
<div v-if="$v.mailConfigData.mail_password.$error">
<span v-if="!$v.mailConfigData.mail_password.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<div class="row my-2">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('settings.mail.port') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_port.$error"
v-model.trim="mailConfigData.mail_port"
type="text"
name="mail_port"
@input="$v.mailConfigData.mail_port.$touch()"
/>
<div v-if="$v.mailConfigData.mail_port.$error">
<span v-if="!$v.mailConfigData.mail_port.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
<span v-if="!$v.mailConfigData.mail_port.numeric" class="text-danger">
{{ $tc('validation.numbers_only') }}
</span>
</div>
</div>
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('settings.mail.encryption') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_encryption.$error"
v-model.trim="mailConfigData.mail_encryption"
type="text"
name="name"
@input="$v.mailConfigData.mail_encryption.$touch()"
/>
<div v-if="$v.mailConfigData.mail_encryption.$error">
<span v-if="!$v.mailConfigData.mail_encryption.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<base-button
:loading="loading" :loading="loading"
class="pull-right mt-4" :mail-drivers="mail_drivers"
icon="save" @on-change-driver="(val) => mail_driver = mailConfigData.mail_driver = val"
color="theme" @submit-data="saveEmailConfig"
type="submit" />
> </div>
{{ $t('general.save') }}
</base-button>
</form>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import MultiSelect from 'vue-multiselect' import MultiSelect from 'vue-multiselect'
import { validationMixin } from 'vuelidate' import { validationMixin } from 'vuelidate'
import Ls from '../../services/ls' import Smtp from './mailDriver/Smtp'
const { required, email, numeric } = require('vuelidate/lib/validators') import Mailgun from './mailDriver/Mailgun'
import Sparkpost from './mailDriver/Sparkpost'
import Ses from './mailDriver/Ses'
import Basic from './mailDriver/Basic'
import Mandrill from './mailDriver/Mandrill'
export default { export default {
components: { components: {
MultiSelect MultiSelect,
Smtp,
Mailgun,
Sparkpost,
Ses,
sendmail: Basic,
mail: Basic,
Mandrill
}, },
mixins: [validationMixin], mixins: [validationMixin],
data () { data () {
return { return {
mailConfigData: { mailConfigData: null,
mail_driver: '', mail_driver: 'smtp',
mail_host: '',
mail_port: null,
mail_username: '',
mail_password: '',
mail_encryption: ''
},
loading: false, loading: false,
mail_drivers: [] mail_drivers: []
} }
}, },
validations: {
mailConfigData: {
mail_driver: {
required
},
mail_host: {
required
},
mail_port: {
required,
numeric
},
mail_username: {
required
},
mail_password: {
required
},
mail_encryption: {
required
}
}
},
mounted () { mounted () {
this.loadData() this.loadData()
}, },
@ -191,17 +65,14 @@ export default {
} }
if (mailData.data) { if (mailData.data) {
this.mailConfigData = mailData.data this.mailConfigData = mailData.data
this.mail_driver = mailData.data.mail_driver
} }
this.loading = false this.loading = false
}, },
async saveEmailConfig () { async saveEmailConfig (mailConfigData) {
this.$v.mailConfigData.$touch()
if (this.$v.mailConfigData.$invalid) {
return true
}
this.loading = true this.loading = true
try { try {
let response = await window.axios.post('/api/settings/environment/mail', this.mailConfigData) let response = await window.axios.post('/api/settings/environment/mail', mailConfigData)
if (response.data.success) { if (response.data.success) {
window.toastr['success'](this.$t('wizard.success.' + response.data.success)) window.toastr['success'](this.$t('wizard.success.' + response.data.success))
} else { } else {

View File

@ -0,0 +1,156 @@
<template>
<form @submit.prevent="saveEmailConfig()">
<div class="row">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.driver') }}</label>
<span class="text-danger"> *</span>
<base-select
v-model="mailConfigData.mail_driver"
:invalid="$v.mailConfigData.mail_driver.$error"
:options="mailDrivers"
:searchable="true"
:show-labels="false"
@input="onChangeDriver"
/>
<div v-if="$v.mailConfigData.mail_driver.$error">
<span v-if="!$v.mailConfigData.mail_driver.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
<!-- <div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.host') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_host.$error"
v-model.trim="mailConfigData.mail_host"
type="text"
name="mail_host"
@input="$v.mailConfigData.mail_host.$touch()"
/>
<div v-if="$v.mailConfigData.mail_host.$error">
<span v-if="!$v.mailConfigData.mail_host.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div> -->
</div>
<div class="row my-2">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.from_mail') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.from_mail.$error"
v-model.trim="mailConfigData.from_mail"
type="text"
name="from_mail"
@input="$v.mailConfigData.from_mail.$touch()"
/>
<div v-if="$v.mailConfigData.from_mail.$error">
<span v-if="!$v.mailConfigData.from_mail.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.from_name') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.from_name.$error"
v-model.trim="mailConfigData.from_name"
type="text"
name="name"
@input="$v.mailConfigData.from_name.$touch()"
/>
<div v-if="$v.mailConfigData.from_name.$error">
<span v-if="!$v.mailConfigData.from_name.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<base-button
:loading="loading"
class="pull-right mt-4"
icon="save"
color="theme"
type="submit"
>
{{ $t('general.save') }}
</base-button>
</form>
</template>
<script>
import MultiSelect from 'vue-multiselect'
import { validationMixin } from 'vuelidate'
const { required, email } = require('vuelidate/lib/validators')
export default {
components: {
MultiSelect
},
mixins: [validationMixin],
props: {
configData: {
type: Object,
require: true,
default: Object
},
loading: {
type: Boolean,
require: true,
default: false
},
mailDrivers: {
type: Array,
require: true,
default: Array
}
},
data () {
return {
mailConfigData: {
mail_driver: '',
mail_host: '',
from_mail: '',
from_name: ''
}
}
},
validations: {
mailConfigData: {
mail_driver: {
required
},
from_mail: {
required,
email
},
from_name: {
required
}
}
},
mounted () {
for (const key in this.mailConfigData) {
if (this.configData.hasOwnProperty(key)) {
this.mailConfigData[key] = this.configData[key]
}
}
},
methods: {
async saveEmailConfig () {
this.$v.mailConfigData.$touch()
if (!this.$v.mailConfigData.$invalid) {
this.$emit('submit-data', this.mailConfigData)
}
return false
},
onChangeDriver () {
this.$v.mailConfigData.mail_driver.$touch()
this.$emit('on-change-driver', this.mailConfigData.mail_driver)
}
}
}
</script>

View File

@ -0,0 +1,278 @@
<template>
<form @submit.prevent="saveEmailConfig()">
<div class="row">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.driver') }}</label>
<span class="text-danger"> *</span>
<base-select
v-model="mailConfigData.mail_driver"
:invalid="$v.mailConfigData.mail_driver.$error"
:options="mailDrivers"
:searchable="true"
:show-labels="false"
@input="onChangeDriver"
/>
<div v-if="$v.mailConfigData.mail_driver.$error">
<span v-if="!$v.mailConfigData.mail_driver.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.host') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_host.$error"
v-model.trim="mailConfigData.mail_host"
type="text"
name="mail_host"
@input="$v.mailConfigData.mail_host.$touch()"
/>
<div v-if="$v.mailConfigData.mail_host.$error">
<span v-if="!$v.mailConfigData.mail_host.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<div class="row my-2">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.port') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_port.$error"
v-model.trim="mailConfigData.mail_port"
type="text"
name="mail_port"
@input="$v.mailConfigData.mail_port.$touch()"
/>
<div v-if="$v.mailConfigData.mail_port.$error">
<span v-if="!$v.mailConfigData.mail_port.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
<span v-if="!$v.mailConfigData.mail_port.numeric" class="text-danger">
{{ $tc('validation.numbers_only') }}
</span>
</div>
</div>
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.encryption') }}</label>
<span class="text-danger"> *</span>
<base-select
v-model.trim="mailConfigData.mail_encryption"
:invalid="$v.mailConfigData.mail_encryption.$error"
:options="encryptions"
:searchable="true"
:show-labels="false"
@input="$v.mailConfigData.mail_encryption.$touch()"
/>
<div v-if="$v.mailConfigData.mail_encryption.$error">
<span v-if="!$v.mailConfigData.mail_encryption.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<div class="row my-2">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.from_mail') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.from_mail.$error"
v-model.trim="mailConfigData.from_mail"
type="text"
name="from_mail"
@input="$v.mailConfigData.from_mail.$touch()"
/>
<div v-if="$v.mailConfigData.from_mail.$error">
<span v-if="!$v.mailConfigData.from_mail.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
<span v-if="!$v.mailConfigData.from_mail.numeric" class="text-danger">
{{ $tc('validation.numbers_only') }}
</span>
</div>
</div>
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.from_name') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.from_name.$error"
v-model.trim="mailConfigData.from_name"
type="text"
name="name"
@input="$v.mailConfigData.from_name.$touch()"
/>
<div v-if="$v.mailConfigData.from_name.$error">
<span v-if="!$v.mailConfigData.from_name.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<div class="row my-2">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.domain') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_mailgun_domain.$error"
v-model.trim="mailConfigData.mail_mailgun_domain"
type="text"
name="db_name"
@input="$v.mailConfigData.mail_mailgun_domain.$touch()"
/>
<div v-if="$v.mailConfigData.mail_mailgun_domain.$error">
<span v-if="!$v.mailConfigData.mail_mailgun_domain.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.mailgin_secret') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_mailgun_secret.$error"
v-model.trim="mailConfigData.mail_mailgun_secret"
type="password"
name="name"
show-password
@input="$v.mailConfigData.mail_mailgun_secret.$touch()"
/>
<div v-if="$v.mailConfigData.mail_mailgun_secret.$error">
<span v-if="!$v.mailConfigData.mail_mailgun_secret.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<div class="row my-2">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.endpoint') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_mailgun_endpoint.$error"
v-model.trim="mailConfigData.mail_mailgun_endpoint"
type="text"
name="mail_mailgun_endpoint"
@input="$v.mailConfigData.mail_mailgun_endpoint.$touch()"
/>
<div v-if="$v.mailConfigData.mail_mailgun_endpoint.$error">
<span v-if="!$v.mailConfigData.mail_mailgun_endpoint.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
<span v-if="!$v.mailConfigData.mail_mailgun_endpoint.numeric" class="text-danger">
{{ $tc('validation.numbers_only') }}
</span>
</div>
</div>
</div>
<base-button
:loading="loading"
class="pull-right mt-4"
icon="save"
color="theme"
type="submit"
>
{{ $t('general.save') }}
</base-button>
</form>
</template>
<script>
import MultiSelect from 'vue-multiselect'
import { validationMixin } from 'vuelidate'
const { required, email, numeric } = require('vuelidate/lib/validators')
export default {
components: {
MultiSelect
},
mixins: [validationMixin],
props: {
configData: {
type: Object,
require: true,
default: Object
},
loading: {
type: Boolean,
require: true,
default: false
},
mailDrivers: {
type: Array,
require: true,
default: Array
}
},
data () {
return {
mailConfigData: {
mail_driver: '',
mail_host: '',
mail_port: null,
mail_mailgun_domain: '',
mail_mailgun_secret: '',
mail_mailgun_endpoint: '',
mail_encryption: 'tls',
from_mail: '',
from_name: ''
},
encryptions: ['tls', 'ssl', 'starttls']
}
},
validations: {
mailConfigData: {
mail_driver: {
required
},
mail_host: {
required
},
mail_port: {
required,
numeric
},
mail_mailgun_domain: {
required
},
mail_mailgun_endpoint: {
required
},
mail_mailgun_secret: {
required
},
mail_encryption: {
required
},
from_mail: {
required,
email
},
from_name: {
required
}
}
},
mounted () {
for (const key in this.mailConfigData) {
if (this.configData.hasOwnProperty(key)) {
this.mailConfigData[key] = this.configData[key]
}
}
},
methods: {
async saveEmailConfig () {
this.$v.mailConfigData.$touch()
if (!this.$v.mailConfigData.$invalid) {
this.$emit('submit-data', this.mailConfigData)
}
return false
},
onChangeDriver () {
this.$v.mailConfigData.mail_driver.$touch()
this.$emit('on-change-driver', this.mailConfigData.mail_driver)
}
}
}
</script>

View File

@ -0,0 +1,230 @@
<template>
<form @submit.prevent="saveEmailConfig()">
<div class="row">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.driver') }}</label>
<span class="text-danger"> *</span>
<base-select
v-model="mailConfigData.mail_driver"
:invalid="$v.mailConfigData.mail_driver.$error"
:options="mailDrivers"
:searchable="true"
:show-labels="false"
@input="onChangeDriver"
/>
<div v-if="$v.mailConfigData.mail_driver.$error">
<span v-if="!$v.mailConfigData.mail_driver.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.host') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_host.$error"
v-model.trim="mailConfigData.mail_host"
type="text"
name="mail_host"
@input="$v.mailConfigData.mail_host.$touch()"
/>
<div v-if="$v.mailConfigData.mail_host.$error">
<span v-if="!$v.mailConfigData.mail_host.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<div class="row my-2">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.port') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_port.$error"
v-model.trim="mailConfigData.mail_port"
type="text"
name="mail_port"
@input="$v.mailConfigData.mail_port.$touch()"
/>
<div v-if="$v.mailConfigData.mail_port.$error">
<span v-if="!$v.mailConfigData.mail_port.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.encryption') }}</label>
<span class="text-danger"> *</span>
<base-select
v-model.trim="mailConfigData.mail_encryption"
:invalid="$v.mailConfigData.mail_encryption.$error"
:options="encryptions"
:searchable="true"
:show-labels="false"
@input="$v.mailConfigData.mail_encryption.$touch()"
/>
<div v-if="$v.mailConfigData.mail_encryption.$error">
<span v-if="!$v.mailConfigData.mail_encryption.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<div class="row my-2">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.from_mail') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.from_mail.$error"
v-model.trim="mailConfigData.from_mail"
type="text"
name="from_mail"
@input="$v.mailConfigData.from_mail.$touch()"
/>
<div v-if="$v.mailConfigData.from_mail.$error">
<span v-if="!$v.mailConfigData.from_mail.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
<span v-if="!$v.mailConfigData.from_mail.numeric" class="text-danger">
{{ $tc('validation.numbers_only') }}
</span>
</div>
</div>
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.from_name') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.from_name.$error"
v-model.trim="mailConfigData.from_name"
type="text"
name="name"
@input="$v.mailConfigData.from_name.$touch()"
/>
<div v-if="$v.mailConfigData.from_name.$error">
<span v-if="!$v.mailConfigData.from_name.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<div class="row my-2">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.mandrill_secret') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_mandrill_secret.$error"
v-model.trim="mailConfigData.mail_mandrill_secret"
type="password"
name="name"
show-password
@input="$v.mailConfigData.mail_mandrill_secret.$touch()"
/>
<div v-if="$v.mailConfigData.mail_mandrill_secret.$error">
<span v-if="!$v.mailConfigData.mail_mandrill_secret.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<base-button
:loading="loading"
class="pull-right mt-4"
icon="save"
color="theme"
type="submit"
>
{{ $t('general.save') }}
</base-button>
</form>
</template>
<script>
import MultiSelect from 'vue-multiselect'
import { validationMixin } from 'vuelidate'
const { required, email, numeric } = require('vuelidate/lib/validators')
export default {
components: {
MultiSelect
},
mixins: [validationMixin],
props: {
configData: {
type: Object,
require: true,
default: Object
},
loading: {
type: Boolean,
require: true,
default: false
},
mailDrivers: {
type: Array,
require: true,
default: Array
}
},
data () {
return {
mailConfigData: {
mail_driver: '',
mail_host: '',
mail_port: null,
mail_mandrill_secret: '',
mail_encryption: 'tls',
from_mail: '',
from_name: ''
},
encryptions: ['tls', 'ssl', 'starttls']
}
},
validations: {
mailConfigData: {
mail_driver: {
required
},
mail_host: {
required
},
mail_port: {
required,
numeric
},
mail_mandrill_secret: {
required
},
mail_encryption: {
required
},
from_mail: {
required,
email
},
from_name: {
required
}
}
},
mounted () {
for (const key in this.mailConfigData) {
if (this.configData.hasOwnProperty(key)) {
this.mailConfigData[key] = this.configData[key]
}
}
},
methods: {
async saveEmailConfig () {
this.$v.mailConfigData.$touch()
if (!this.$v.mailConfigData.$invalid) {
this.$emit('submit-data', this.mailConfigData)
}
return false
},
onChangeDriver () {
this.$v.mailConfigData.mail_driver.$touch()
this.$emit('on-change-driver', this.mailConfigData.mail_driver)
}
}
}
</script>

View File

@ -0,0 +1,253 @@
<template>
<form @submit.prevent="saveEmailConfig()">
<div class="row">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.driver') }}</label>
<span class="text-danger"> *</span>
<base-select
v-model="mailConfigData.mail_driver"
:invalid="$v.mailConfigData.mail_driver.$error"
:options="mailDrivers"
:searchable="true"
:show-labels="false"
@input="onChangeDriver"
/>
<div v-if="$v.mailConfigData.mail_driver.$error">
<span v-if="!$v.mailConfigData.mail_driver.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.host') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_host.$error"
v-model.trim="mailConfigData.mail_host"
type="text"
name="mail_host"
@input="$v.mailConfigData.mail_host.$touch()"
/>
<div v-if="$v.mailConfigData.mail_host.$error">
<span v-if="!$v.mailConfigData.mail_host.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<div class="row my-2">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.port') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_port.$error"
v-model.trim="mailConfigData.mail_port"
type="text"
name="mail_port"
@input="$v.mailConfigData.mail_port.$touch()"
/>
<div v-if="$v.mailConfigData.mail_port.$error">
<span v-if="!$v.mailConfigData.mail_port.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
<span v-if="!$v.mailConfigData.mail_port.numeric" class="text-danger">
{{ $tc('validation.numbers_only') }}
</span>
</div>
</div>
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.encryption') }}</label>
<span class="text-danger"> *</span>
<base-select
v-model.trim="mailConfigData.mail_encryption"
:invalid="$v.mailConfigData.mail_encryption.$error"
:options="encryptions"
:searchable="true"
:show-labels="false"
@input="$v.mailConfigData.mail_encryption.$touch()"
/>
<div v-if="$v.mailConfigData.mail_encryption.$error">
<span v-if="!$v.mailConfigData.mail_encryption.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<div class="row my-2">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.from_mail') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.from_mail.$error"
v-model.trim="mailConfigData.from_mail"
type="text"
name="from_mail"
@input="$v.mailConfigData.from_mail.$touch()"
/>
<div v-if="$v.mailConfigData.from_mail.$error">
<span v-if="!$v.mailConfigData.from_mail.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
<span v-if="!$v.mailConfigData.from_mail.numeric" class="text-danger">
{{ $tc('validation.numbers_only') }}
</span>
</div>
</div>
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.from_name') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.from_name.$error"
v-model.trim="mailConfigData.from_name"
type="text"
name="name"
@input="$v.mailConfigData.from_name.$touch()"
/>
<div v-if="$v.mailConfigData.from_name.$error">
<span v-if="!$v.mailConfigData.from_name.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<div class="row my-2">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.ses_key') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_ses_key.$error"
v-model.trim="mailConfigData.mail_ses_key"
type="text"
name="name"
@input="$v.mailConfigData.mail_ses_key.$touch()"
/>
<div v-if="$v.mailConfigData.mail_ses_key.$error">
<span v-if="!$v.mailConfigData.mail_ses_key.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.ses_secret') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_ses_secret.$error"
v-model.trim="mailConfigData.mail_ses_secret"
type="password"
name="name"
show-password
@input="$v.mailConfigData.mail_ses_secret.$touch()"
/>
<div v-if="$v.mailConfigData.mail_ses_secret.$error">
<span v-if="!$v.mailConfigData.mail_ses_secret.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<base-button
:loading="loading"
class="pull-right mt-4"
icon="save"
color="theme"
type="submit"
>
{{ $t('general.save') }}
</base-button>
</form>
</template>
<script>
import MultiSelect from 'vue-multiselect'
import { validationMixin } from 'vuelidate'
const { required, email, numeric } = require('vuelidate/lib/validators')
export default {
components: {
MultiSelect
},
mixins: [validationMixin],
props: {
configData: {
type: Object,
require: true,
default: Object
},
loading: {
type: Boolean,
require: true,
default: false
},
mailDrivers: {
type: Array,
require: true,
default: Array
}
},
data () {
return {
mailConfigData: {
mail_driver: '',
mail_host: '',
mail_port: null,
mail_ses_key: '',
mail_ses_secret: '',
mail_encryption: 'tls',
from_mail: '',
from_name: ''
},
encryptions: ['tls', 'ssl', 'starttls']
}
},
validations: {
mailConfigData: {
mail_driver: {
required
},
mail_host: {
required
},
mail_port: {
required,
numeric
},
mail_ses_key: {
required
},
mail_ses_secret: {
required
},
mail_encryption: {
required
},
from_mail: {
required,
email
},
from_name: {
required
}
}
},
mounted () {
for (const key in this.mailConfigData) {
if (this.configData.hasOwnProperty(key)) {
this.mailConfigData[key] = this.configData[key]
}
}
},
methods: {
async saveEmailConfig () {
this.$v.mailConfigData.$touch()
if (!this.$v.mailConfigData.$invalid) {
this.$emit('submit-data', this.mailConfigData)
}
return false
},
onChangeDriver () {
this.$v.mailConfigData.mail_driver.$touch()
this.$emit('on-change-driver', this.mailConfigData.mail_driver)
}
}
}
</script>

View File

@ -0,0 +1,253 @@
<template>
<form @submit.prevent="saveEmailConfig()">
<div class="row">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.driver') }}</label>
<span class="text-danger"> *</span>
<base-select
v-model="mailConfigData.mail_driver"
:invalid="$v.mailConfigData.mail_driver.$error"
:options="mailDrivers"
:searchable="true"
:show-labels="false"
@input="onChangeDriver"
/>
<div v-if="$v.mailConfigData.mail_driver.$error">
<span v-if="!$v.mailConfigData.mail_driver.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.host') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_host.$error"
v-model.trim="mailConfigData.mail_host"
type="text"
name="mail_host"
@input="$v.mailConfigData.mail_host.$touch()"
/>
<div v-if="$v.mailConfigData.mail_host.$error">
<span v-if="!$v.mailConfigData.mail_host.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<div class="row my-2">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.username') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_username.$error"
v-model.trim="mailConfigData.mail_username"
type="text"
name="db_name"
@input="$v.mailConfigData.mail_username.$touch()"
/>
<div v-if="$v.mailConfigData.mail_username.$error">
<span v-if="!$v.mailConfigData.mail_username.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.password') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_password.$error"
v-model.trim="mailConfigData.mail_password"
type="password"
name="name"
show-password
@input="$v.mailConfigData.mail_password.$touch()"
/>
<div v-if="$v.mailConfigData.mail_password.$error">
<span v-if="!$v.mailConfigData.mail_password.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<div class="row my-2">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.port') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_port.$error"
v-model.trim="mailConfigData.mail_port"
type="text"
name="mail_port"
@input="$v.mailConfigData.mail_port.$touch()"
/>
<div v-if="$v.mailConfigData.mail_port.$error">
<span v-if="!$v.mailConfigData.mail_port.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
<span v-if="!$v.mailConfigData.mail_port.numeric" class="text-danger">
{{ $tc('validation.numbers_only') }}
</span>
</div>
</div>
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.encryption') }}</label>
<span class="text-danger"> *</span>
<base-select
v-model.trim="mailConfigData.mail_encryption"
:invalid="$v.mailConfigData.mail_encryption.$error"
:options="encryptions"
:searchable="true"
:show-labels="false"
@input="$v.mailConfigData.mail_encryption.$touch()"
/>
<div v-if="$v.mailConfigData.mail_encryption.$error">
<span v-if="!$v.mailConfigData.mail_encryption.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<div class="row my-2">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.from_mail') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.from_mail.$error"
v-model.trim="mailConfigData.from_mail"
type="text"
name="from_mail"
@input="$v.mailConfigData.from_mail.$touch()"
/>
<div v-if="$v.mailConfigData.from_mail.$error">
<span v-if="!$v.mailConfigData.from_mail.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
<span v-if="!$v.mailConfigData.from_mail.numeric" class="text-danger">
{{ $tc('validation.numbers_only') }}
</span>
</div>
</div>
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.from_name') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.from_name.$error"
v-model.trim="mailConfigData.from_name"
type="text"
name="name"
@input="$v.mailConfigData.from_name.$touch()"
/>
<div v-if="$v.mailConfigData.from_name.$error">
<span v-if="!$v.mailConfigData.from_name.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<base-button
:loading="loading"
class="pull-right mt-4"
icon="save"
color="theme"
type="submit"
>
{{ $t('general.save') }}
</base-button>
</form>
</template>
<script>
import MultiSelect from 'vue-multiselect'
import { validationMixin } from 'vuelidate'
const { required, email, numeric } = require('vuelidate/lib/validators')
export default {
components: {
MultiSelect
},
mixins: [validationMixin],
props: {
configData: {
type: Object,
require: true,
default: Object
},
loading: {
type: Boolean,
require: true,
default: false
},
mailDrivers: {
type: Array,
require: true,
default: Array
}
},
data () {
return {
mailConfigData: {
mail_driver: '',
mail_host: '',
mail_port: null,
mail_username: '',
mail_password: '',
mail_encryption: 'tls',
from_mail: '',
from_name: ''
},
encryptions: ['tls', 'ssl', 'starttls']
}
},
validations: {
mailConfigData: {
mail_driver: {
required
},
mail_host: {
required
},
mail_port: {
required,
numeric
},
mail_username: {
required
},
mail_password: {
required
},
mail_encryption: {
required
},
from_mail: {
required,
email
},
from_name: {
required
}
}
},
mounted () {
for (const key in this.mailConfigData) {
if (this.configData.hasOwnProperty(key)) {
this.mailConfigData[key] = this.configData[key]
}
}
},
methods: {
async saveEmailConfig () {
this.$v.mailConfigData.$touch()
if (!this.$v.mailConfigData.$invalid) {
this.$emit('submit-data', this.mailConfigData)
}
return false
},
onChangeDriver () {
this.$v.mailConfigData.mail_driver.$touch()
this.$emit('on-change-driver', this.mailConfigData.mail_driver)
}
}
}
</script>

View File

@ -0,0 +1,233 @@
<template>
<form @submit.prevent="saveEmailConfig()">
<div class="row">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.driver') }}</label>
<span class="text-danger"> *</span>
<base-select
v-model="mailConfigData.mail_driver"
:invalid="$v.mailConfigData.mail_driver.$error"
:options="mailDrivers"
:searchable="true"
:show-labels="false"
@input="onChangeDriver"
/>
<div v-if="$v.mailConfigData.mail_driver.$error">
<span v-if="!$v.mailConfigData.mail_driver.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.host') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_host.$error"
v-model.trim="mailConfigData.mail_host"
type="text"
name="mail_host"
@input="$v.mailConfigData.mail_host.$touch()"
/>
<div v-if="$v.mailConfigData.mail_host.$error">
<span v-if="!$v.mailConfigData.mail_host.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<div class="row my-2">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.port') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_port.$error"
v-model.trim="mailConfigData.mail_port"
type="text"
name="mail_port"
@input="$v.mailConfigData.mail_port.$touch()"
/>
<div v-if="$v.mailConfigData.mail_port.$error">
<span v-if="!$v.mailConfigData.mail_port.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
<span v-if="!$v.mailConfigData.mail_port.numeric" class="text-danger">
{{ $tc('validation.numbers_only') }}
</span>
</div>
</div>
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.encryption') }}</label>
<span class="text-danger"> *</span>
<base-select
v-model.trim="mailConfigData.mail_encryption"
:invalid="$v.mailConfigData.mail_encryption.$error"
:options="encryptions"
:searchable="true"
:show-labels="false"
@input="$v.mailConfigData.mail_encryption.$touch()"
/>
<div v-if="$v.mailConfigData.mail_encryption.$error">
<span v-if="!$v.mailConfigData.mail_encryption.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<div class="row my-2">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.from_mail') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.from_mail.$error"
v-model.trim="mailConfigData.from_mail"
type="text"
name="from_mail"
@input="$v.mailConfigData.from_mail.$touch()"
/>
<div v-if="$v.mailConfigData.from_mail.$error">
<span v-if="!$v.mailConfigData.from_mail.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
<span v-if="!$v.mailConfigData.from_mail.numeric" class="text-danger">
{{ $tc('validation.numbers_only') }}
</span>
</div>
</div>
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.from_name') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.from_name.$error"
v-model.trim="mailConfigData.from_name"
type="text"
name="name"
@input="$v.mailConfigData.from_name.$touch()"
/>
<div v-if="$v.mailConfigData.from_name.$error">
<span v-if="!$v.mailConfigData.from_name.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<div class="row my-2">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.sparkpost_secret') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_sparkpost_secret.$error"
v-model.trim="mailConfigData.mail_sparkpost_secret"
type="password"
name="name"
show-password
@input="$v.mailConfigData.mail_sparkpost_secret.$touch()"
/>
<div v-if="$v.mailConfigData.mail_sparkpost_secret.$error">
<span v-if="!$v.mailConfigData.mail_sparkpost_secret.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<base-button
:loading="loading"
class="pull-right mt-4"
icon="save"
color="theme"
type="submit"
>
{{ $t('general.save') }}
</base-button>
</form>
</template>
<script>
import MultiSelect from 'vue-multiselect'
import { validationMixin } from 'vuelidate'
const { required, email, numeric } = require('vuelidate/lib/validators')
export default {
components: {
MultiSelect
},
mixins: [validationMixin],
props: {
configData: {
type: Object,
require: true,
default: Object
},
loading: {
type: Boolean,
require: true,
default: false
},
mailDrivers: {
type: Array,
require: true,
default: Array
}
},
data () {
return {
mailConfigData: {
mail_driver: '',
mail_host: '',
mail_port: null,
mail_sparkpost_secret: '',
mail_encryption: 'tls',
from_mail: '',
from_name: ''
},
encryptions: ['tls', 'ssl', 'starttls']
}
},
validations: {
mailConfigData: {
mail_driver: {
required
},
mail_host: {
required
},
mail_port: {
required,
numeric
},
mail_sparkpost_secret: {
required
},
mail_encryption: {
required
},
from_mail: {
required,
email
},
from_name: {
required
}
}
},
mounted () {
for (const key in this.mailConfigData) {
if (this.configData.hasOwnProperty(key)) {
this.mailConfigData[key] = this.configData[key]
}
}
},
methods: {
async saveEmailConfig () {
this.$v.mailConfigData.$touch()
if (!this.$v.mailConfigData.$invalid) {
this.$emit('submit-data', this.mailConfigData)
}
return false
},
onChangeDriver () {
this.$v.mailConfigData.mail_driver.$touch()
this.$emit('on-change-driver', this.mailConfigData.mail_driver)
}
}
}
</script>

View File

@ -3,184 +3,49 @@
<form action="" @submit.prevent="next()"> <form action="" @submit.prevent="next()">
<p class="form-title">{{ $t('wizard.mail.mail_config') }}</p> <p class="form-title">{{ $t('wizard.mail.mail_config') }}</p>
<p class="form-desc">{{ $t('wizard.mail.mail_config_desc') }}</p> <p class="form-desc">{{ $t('wizard.mail.mail_config_desc') }}</p>
<div class="row my-2 mt-5"> <component
<div class="col-md-6 my-2"> :is="mail_driver"
<label class="form-label">{{ $t('wizard.mail.driver') }}</label> :config-data="mailConfigData"
<span class="text-danger"> *</span> :loading="loading"
<base-select :mail-drivers="mail_drivers"
v-model="mailConfigData.mail_driver" @on-change-driver="(val) => mail_driver = mailConfigData.mail_driver = val"
:invalid="$v.mailConfigData.mail_driver.$error" @submit-data="next"
:options="mail_drivers" />
:searchable="true"
:show-labels="false"
@change="$v.mailConfigData.mail_driver.$touch()"
/>
<div v-if="$v.mailConfigData.mail_driver.$error">
<span v-if="!$v.mailConfigData.mail_driver.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.host') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_host.$error"
v-model.trim="mailConfigData.mail_host"
type="text"
name="mail_host"
@input="$v.mailConfigData.mail_host.$touch()"
/>
<div v-if="$v.mailConfigData.mail_host.$error">
<span v-if="!$v.mailConfigData.mail_host.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<div class="row my-2">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.username') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_username.$error"
v-model.trim="mailConfigData.mail_username"
type="text"
name="db_name"
@input="$v.mailConfigData.mail_username.$touch()"
/>
<div v-if="$v.mailConfigData.mail_username.$error">
<span v-if="!$v.mailConfigData.mail_username.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.password') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_password.$error"
v-model.trim="mailConfigData.mail_password"
type="password"
show-password
name="name"
@input="$v.mailConfigData.mail_password.$touch()"
/>
<div v-if="$v.mailConfigData.mail_password.$error">
<span v-if="!$v.mailConfigData.mail_password.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<div class="row my-2">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.port') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_port.$error"
v-model.trim="mailConfigData.mail_port"
type="text"
name="mail_port"
@input="$v.mailConfigData.mail_port.$touch()"
/>
<div v-if="$v.mailConfigData.mail_port.$error">
<span v-if="!$v.mailConfigData.mail_port.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
<span v-if="!$v.mailConfigData.mail_port.numeric" class="text-danger">
{{ $tc('validation.numbers_only') }}
</span>
</div>
</div>
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.encryption') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_encryption.$error"
v-model.trim="mailConfigData.mail_encryption"
type="text"
name="name"
@input="$v.mailConfigData.mail_encryption.$touch()"
/>
<div v-if="$v.mailConfigData.mail_encryption.$error">
<span v-if="!$v.mailConfigData.mail_encryption.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<div class="row mt-5">
<base-button
:loading="loading"
class="pull-right"
icon="save"
color="theme"
type="submit"
>
{{ $t('wizard.save_cont') }}
</base-button>
<base-button
:loading="loading"
class="pull-right ml-4"
outline
color="theme"
@click="$emit('next')"
>
{{ $t('wizard.skip') }}
</base-button>
</div>
</form> </form>
</div> </div>
</template> </template>
<script> <script>
import MultiSelect from 'vue-multiselect' import MultiSelect from 'vue-multiselect'
import { validationMixin } from 'vuelidate' import { validationMixin } from 'vuelidate'
import Ls from '../../services/ls' import Smtp from './mailDriver/Smtp'
const { required, email, numeric } = require('vuelidate/lib/validators') import Mailgun from './mailDriver/Mailgun'
import Sparkpost from './mailDriver/Sparkpost'
import Ses from './mailDriver/Ses'
import Basic from './mailDriver/Basic'
import Mandrill from './mailDriver/Mandrill'
export default { export default {
components: { components: {
MultiSelect MultiSelect,
Smtp,
Mailgun,
Sparkpost,
Ses,
sendmail: Basic,
mail: Basic,
Mandrill
}, },
mixins: [validationMixin], mixins: [validationMixin],
data () { data () {
return { return {
mailConfigData: { mailConfigData: {
mail_driver: 'smtp', mail_driver: 'smtp'
mail_host: 'mailtrap.io',
mail_port: null,
mail_username: null,
mail_password: null,
mail_encryption: null
}, },
mail_driver: 'smtp',
loading: false, loading: false,
mail_drivers: [] mail_drivers: []
} }
}, },
validations: {
mailConfigData: {
mail_driver: {
required
},
mail_host: {
required
},
mail_port: {
required,
numeric
},
mail_username: {
required
},
mail_password: {
required
},
mail_encryption: {
required
}
}
},
created () { created () {
this.getMailDrivers() this.getMailDrivers()
}, },
@ -195,14 +60,10 @@ export default {
this.loading = false this.loading = false
} }
}, },
async next () { async next (mailConfigData) {
this.$v.mailConfigData.$touch()
if (this.$v.mailConfigData.$invalid) {
return true
}
this.loading = true this.loading = true
try { try {
let response = await window.axios.post('/api/admin/onboarding/environment/mail', this.mailConfigData) let response = await window.axios.post('/api/settings/environment/mail', mailConfigData)
if (response.data.success) { if (response.data.success) {
this.$emit('next') this.$emit('next')
window.toastr['success'](this.$t('wizard.success.' + response.data.success)) window.toastr['success'](this.$t('wizard.success.' + response.data.success))

View File

@ -0,0 +1,156 @@
<template>
<form @submit.prevent="saveEmailConfig()">
<div class="row">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.driver') }}</label>
<span class="text-danger"> *</span>
<base-select
v-model="mailConfigData.mail_driver"
:invalid="$v.mailConfigData.mail_driver.$error"
:options="mailDrivers"
:searchable="true"
:show-labels="false"
@input="onChangeDriver"
/>
<div v-if="$v.mailConfigData.mail_driver.$error">
<span v-if="!$v.mailConfigData.mail_driver.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
<!-- <div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.host') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_host.$error"
v-model.trim="mailConfigData.mail_host"
type="text"
name="mail_host"
@input="$v.mailConfigData.mail_host.$touch()"
/>
<div v-if="$v.mailConfigData.mail_host.$error">
<span v-if="!$v.mailConfigData.mail_host.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div> -->
</div>
<div class="row my-2">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.from_mail') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.from_mail.$error"
v-model.trim="mailConfigData.from_mail"
type="text"
name="from_mail"
@input="$v.mailConfigData.from_mail.$touch()"
/>
<div v-if="$v.mailConfigData.from_mail.$error">
<span v-if="!$v.mailConfigData.from_mail.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.from_name') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.from_name.$error"
v-model.trim="mailConfigData.from_name"
type="text"
name="name"
@input="$v.mailConfigData.from_name.$touch()"
/>
<div v-if="$v.mailConfigData.from_name.$error">
<span v-if="!$v.mailConfigData.from_name.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<base-button
:loading="loading"
class="pull-right mt-4"
icon="save"
color="theme"
type="submit"
>
{{ $t('general.save') }}
</base-button>
</form>
</template>
<script>
import MultiSelect from 'vue-multiselect'
import { validationMixin } from 'vuelidate'
const { required, email } = require('vuelidate/lib/validators')
export default {
components: {
MultiSelect
},
mixins: [validationMixin],
props: {
configData: {
type: Object,
require: true,
default: Object
},
loading: {
type: Boolean,
require: true,
default: false
},
mailDrivers: {
type: Array,
require: true,
default: Array
}
},
data () {
return {
mailConfigData: {
mail_driver: '',
mail_host: '',
from_mail: '',
from_name: ''
}
}
},
validations: {
mailConfigData: {
mail_driver: {
required
},
from_mail: {
required,
email
},
from_name: {
required
}
}
},
mounted () {
for (const key in this.mailConfigData) {
if (this.configData.hasOwnProperty(key)) {
this.mailConfigData[key] = this.configData[key]
}
}
},
methods: {
async saveEmailConfig () {
this.$v.mailConfigData.$touch()
if (!this.$v.mailConfigData.$invalid) {
this.$emit('submit-data', this.mailConfigData)
}
return false
},
onChangeDriver () {
this.$v.mailConfigData.mail_driver.$touch()
this.$emit('on-change-driver', this.mailConfigData.mail_driver)
}
}
}
</script>

View File

@ -0,0 +1,278 @@
<template>
<form @submit.prevent="saveEmailConfig()">
<div class="row">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.driver') }}</label>
<span class="text-danger"> *</span>
<base-select
v-model="mailConfigData.mail_driver"
:invalid="$v.mailConfigData.mail_driver.$error"
:options="mailDrivers"
:searchable="true"
:show-labels="false"
@input="onChangeDriver"
/>
<div v-if="$v.mailConfigData.mail_driver.$error">
<span v-if="!$v.mailConfigData.mail_driver.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.host') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_host.$error"
v-model.trim="mailConfigData.mail_host"
type="text"
name="mail_host"
@input="$v.mailConfigData.mail_host.$touch()"
/>
<div v-if="$v.mailConfigData.mail_host.$error">
<span v-if="!$v.mailConfigData.mail_host.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<div class="row my-2">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.port') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_port.$error"
v-model.trim="mailConfigData.mail_port"
type="text"
name="mail_port"
@input="$v.mailConfigData.mail_port.$touch()"
/>
<div v-if="$v.mailConfigData.mail_port.$error">
<span v-if="!$v.mailConfigData.mail_port.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
<span v-if="!$v.mailConfigData.mail_port.numeric" class="text-danger">
{{ $tc('validation.numbers_only') }}
</span>
</div>
</div>
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.encryption') }}</label>
<span class="text-danger"> *</span>
<base-select
v-model.trim="mailConfigData.mail_encryption"
:invalid="$v.mailConfigData.mail_encryption.$error"
:options="encryptions"
:searchable="true"
:show-labels="false"
@input="$v.mailConfigData.mail_encryption.$touch()"
/>
<div v-if="$v.mailConfigData.mail_encryption.$error">
<span v-if="!$v.mailConfigData.mail_encryption.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<div class="row my-2">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.from_mail') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.from_mail.$error"
v-model.trim="mailConfigData.from_mail"
type="text"
name="from_mail"
@input="$v.mailConfigData.from_mail.$touch()"
/>
<div v-if="$v.mailConfigData.from_mail.$error">
<span v-if="!$v.mailConfigData.from_mail.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
<span v-if="!$v.mailConfigData.from_mail.numeric" class="text-danger">
{{ $tc('validation.numbers_only') }}
</span>
</div>
</div>
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.from_name') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.from_name.$error"
v-model.trim="mailConfigData.from_name"
type="text"
name="name"
@input="$v.mailConfigData.from_name.$touch()"
/>
<div v-if="$v.mailConfigData.from_name.$error">
<span v-if="!$v.mailConfigData.from_name.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<div class="row my-2">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.domain') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_mailgun_domain.$error"
v-model.trim="mailConfigData.mail_mailgun_domain"
type="text"
name="db_name"
@input="$v.mailConfigData.mail_mailgun_domain.$touch()"
/>
<div v-if="$v.mailConfigData.mail_mailgun_domain.$error">
<span v-if="!$v.mailConfigData.mail_mailgun_domain.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.mailgin_secret') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_mailgun_secret.$error"
v-model.trim="mailConfigData.mail_mailgun_secret"
type="password"
name="name"
show-password
@input="$v.mailConfigData.mail_mailgun_secret.$touch()"
/>
<div v-if="$v.mailConfigData.mail_mailgun_secret.$error">
<span v-if="!$v.mailConfigData.mail_mailgun_secret.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<div class="row my-2">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.endpoint') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_mailgun_endpoint.$error"
v-model.trim="mailConfigData.mail_mailgun_endpoint"
type="text"
name="mail_mailgun_endpoint"
@input="$v.mailConfigData.mail_mailgun_endpoint.$touch()"
/>
<div v-if="$v.mailConfigData.mail_mailgun_endpoint.$error">
<span v-if="!$v.mailConfigData.mail_mailgun_endpoint.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
<span v-if="!$v.mailConfigData.mail_mailgun_endpoint.numeric" class="text-danger">
{{ $tc('validation.numbers_only') }}
</span>
</div>
</div>
</div>
<base-button
:loading="loading"
class="pull-right mt-4"
icon="save"
color="theme"
type="submit"
>
{{ $t('general.save') }}
</base-button>
</form>
</template>
<script>
import MultiSelect from 'vue-multiselect'
import { validationMixin } from 'vuelidate'
const { required, email, numeric } = require('vuelidate/lib/validators')
export default {
components: {
MultiSelect
},
mixins: [validationMixin],
props: {
configData: {
type: Object,
require: true,
default: Object
},
loading: {
type: Boolean,
require: true,
default: false
},
mailDrivers: {
type: Array,
require: true,
default: Array
}
},
data () {
return {
mailConfigData: {
mail_driver: '',
mail_host: '',
mail_port: null,
mail_mailgun_domain: '',
mail_mailgun_secret: '',
mail_mailgun_endpoint: '',
mail_encryption: 'tls',
from_mail: '',
from_name: ''
},
encryptions: ['tls', 'ssl', 'starttls']
}
},
validations: {
mailConfigData: {
mail_driver: {
required
},
mail_host: {
required
},
mail_port: {
required,
numeric
},
mail_mailgun_domain: {
required
},
mail_mailgun_endpoint: {
required
},
mail_mailgun_secret: {
required
},
mail_encryption: {
required
},
from_mail: {
required,
email
},
from_name: {
required
}
}
},
mounted () {
for (const key in this.mailConfigData) {
if (this.configData.hasOwnProperty(key)) {
this.mailConfigData[key] = this.configData[key]
}
}
},
methods: {
async saveEmailConfig () {
this.$v.mailConfigData.$touch()
if (!this.$v.mailConfigData.$invalid) {
this.$emit('submit-data', this.mailConfigData)
}
return false
},
onChangeDriver () {
this.$v.mailConfigData.mail_driver.$touch()
this.$emit('on-change-driver', this.mailConfigData.mail_driver)
}
}
}
</script>

View File

@ -0,0 +1,230 @@
<template>
<form @submit.prevent="saveEmailConfig()">
<div class="row">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.driver') }}</label>
<span class="text-danger"> *</span>
<base-select
v-model="mailConfigData.mail_driver"
:invalid="$v.mailConfigData.mail_driver.$error"
:options="mailDrivers"
:searchable="true"
:show-labels="false"
@input="onChangeDriver"
/>
<div v-if="$v.mailConfigData.mail_driver.$error">
<span v-if="!$v.mailConfigData.mail_driver.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.host') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_host.$error"
v-model.trim="mailConfigData.mail_host"
type="text"
name="mail_host"
@input="$v.mailConfigData.mail_host.$touch()"
/>
<div v-if="$v.mailConfigData.mail_host.$error">
<span v-if="!$v.mailConfigData.mail_host.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<div class="row my-2">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.port') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_port.$error"
v-model.trim="mailConfigData.mail_port"
type="text"
name="mail_port"
@input="$v.mailConfigData.mail_port.$touch()"
/>
<div v-if="$v.mailConfigData.mail_port.$error">
<span v-if="!$v.mailConfigData.mail_port.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.encryption') }}</label>
<span class="text-danger"> *</span>
<base-select
v-model.trim="mailConfigData.mail_encryption"
:invalid="$v.mailConfigData.mail_encryption.$error"
:options="encryptions"
:searchable="true"
:show-labels="false"
@input="$v.mailConfigData.mail_encryption.$touch()"
/>
<div v-if="$v.mailConfigData.mail_encryption.$error">
<span v-if="!$v.mailConfigData.mail_encryption.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<div class="row my-2">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.from_mail') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.from_mail.$error"
v-model.trim="mailConfigData.from_mail"
type="text"
name="from_mail"
@input="$v.mailConfigData.from_mail.$touch()"
/>
<div v-if="$v.mailConfigData.from_mail.$error">
<span v-if="!$v.mailConfigData.from_mail.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
<span v-if="!$v.mailConfigData.from_mail.numeric" class="text-danger">
{{ $tc('validation.numbers_only') }}
</span>
</div>
</div>
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.from_name') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.from_name.$error"
v-model.trim="mailConfigData.from_name"
type="text"
name="name"
@input="$v.mailConfigData.from_name.$touch()"
/>
<div v-if="$v.mailConfigData.from_name.$error">
<span v-if="!$v.mailConfigData.from_name.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<div class="row my-2">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.mandrill_secret') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_mandrill_secret.$error"
v-model.trim="mailConfigData.mail_mandrill_secret"
type="password"
name="name"
show-password
@input="$v.mailConfigData.mail_mandrill_secret.$touch()"
/>
<div v-if="$v.mailConfigData.mail_mandrill_secret.$error">
<span v-if="!$v.mailConfigData.mail_mandrill_secret.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<base-button
:loading="loading"
class="pull-right mt-4"
icon="save"
color="theme"
type="submit"
>
{{ $t('general.save') }}
</base-button>
</form>
</template>
<script>
import MultiSelect from 'vue-multiselect'
import { validationMixin } from 'vuelidate'
const { required, email, numeric } = require('vuelidate/lib/validators')
export default {
components: {
MultiSelect
},
mixins: [validationMixin],
props: {
configData: {
type: Object,
require: true,
default: Object
},
loading: {
type: Boolean,
require: true,
default: false
},
mailDrivers: {
type: Array,
require: true,
default: Array
}
},
data () {
return {
mailConfigData: {
mail_driver: '',
mail_host: '',
mail_port: null,
mail_mandrill_secret: '',
mail_encryption: 'tls',
from_mail: '',
from_name: ''
},
encryptions: ['tls', 'ssl', 'starttls']
}
},
validations: {
mailConfigData: {
mail_driver: {
required
},
mail_host: {
required
},
mail_port: {
required,
numeric
},
mail_mandrill_secret: {
required
},
mail_encryption: {
required
},
from_mail: {
required,
email
},
from_name: {
required
}
}
},
mounted () {
for (const key in this.mailConfigData) {
if (this.configData.hasOwnProperty(key)) {
this.mailConfigData[key] = this.configData[key]
}
}
},
methods: {
async saveEmailConfig () {
this.$v.mailConfigData.$touch()
if (!this.$v.mailConfigData.$invalid) {
this.$emit('submit-data', this.mailConfigData)
}
return false
},
onChangeDriver () {
this.$v.mailConfigData.mail_driver.$touch()
this.$emit('on-change-driver', this.mailConfigData.mail_driver)
}
}
}
</script>

View File

@ -0,0 +1,253 @@
<template>
<form @submit.prevent="saveEmailConfig()">
<div class="row">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.driver') }}</label>
<span class="text-danger"> *</span>
<base-select
v-model="mailConfigData.mail_driver"
:invalid="$v.mailConfigData.mail_driver.$error"
:options="mailDrivers"
:searchable="true"
:show-labels="false"
@input="onChangeDriver"
/>
<div v-if="$v.mailConfigData.mail_driver.$error">
<span v-if="!$v.mailConfigData.mail_driver.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.host') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_host.$error"
v-model.trim="mailConfigData.mail_host"
type="text"
name="mail_host"
@input="$v.mailConfigData.mail_host.$touch()"
/>
<div v-if="$v.mailConfigData.mail_host.$error">
<span v-if="!$v.mailConfigData.mail_host.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<div class="row my-2">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.port') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_port.$error"
v-model.trim="mailConfigData.mail_port"
type="text"
name="mail_port"
@input="$v.mailConfigData.mail_port.$touch()"
/>
<div v-if="$v.mailConfigData.mail_port.$error">
<span v-if="!$v.mailConfigData.mail_port.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
<span v-if="!$v.mailConfigData.mail_port.numeric" class="text-danger">
{{ $tc('validation.numbers_only') }}
</span>
</div>
</div>
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.encryption') }}</label>
<span class="text-danger"> *</span>
<base-select
v-model.trim="mailConfigData.mail_encryption"
:invalid="$v.mailConfigData.mail_encryption.$error"
:options="encryptions"
:searchable="true"
:show-labels="false"
@input="$v.mailConfigData.mail_encryption.$touch()"
/>
<div v-if="$v.mailConfigData.mail_encryption.$error">
<span v-if="!$v.mailConfigData.mail_encryption.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<div class="row my-2">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.from_mail') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.from_mail.$error"
v-model.trim="mailConfigData.from_mail"
type="text"
name="from_mail"
@input="$v.mailConfigData.from_mail.$touch()"
/>
<div v-if="$v.mailConfigData.from_mail.$error">
<span v-if="!$v.mailConfigData.from_mail.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
<span v-if="!$v.mailConfigData.from_mail.numeric" class="text-danger">
{{ $tc('validation.numbers_only') }}
</span>
</div>
</div>
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.from_name') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.from_name.$error"
v-model.trim="mailConfigData.from_name"
type="text"
name="name"
@input="$v.mailConfigData.from_name.$touch()"
/>
<div v-if="$v.mailConfigData.from_name.$error">
<span v-if="!$v.mailConfigData.from_name.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<div class="row my-2">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.ses_key') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_ses_key.$error"
v-model.trim="mailConfigData.mail_ses_key"
type="text"
name="name"
@input="$v.mailConfigData.mail_ses_key.$touch()"
/>
<div v-if="$v.mailConfigData.mail_ses_key.$error">
<span v-if="!$v.mailConfigData.mail_ses_key.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.ses_secret') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_ses_secret.$error"
v-model.trim="mailConfigData.mail_ses_secret"
type="password"
name="name"
show-password
@input="$v.mailConfigData.mail_ses_secret.$touch()"
/>
<div v-if="$v.mailConfigData.mail_ses_secret.$error">
<span v-if="!$v.mailConfigData.mail_ses_secret.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<base-button
:loading="loading"
class="pull-right mt-4"
icon="save"
color="theme"
type="submit"
>
{{ $t('general.save') }}
</base-button>
</form>
</template>
<script>
import MultiSelect from 'vue-multiselect'
import { validationMixin } from 'vuelidate'
const { required, email, numeric } = require('vuelidate/lib/validators')
export default {
components: {
MultiSelect
},
mixins: [validationMixin],
props: {
configData: {
type: Object,
require: true,
default: Object
},
loading: {
type: Boolean,
require: true,
default: false
},
mailDrivers: {
type: Array,
require: true,
default: Array
}
},
data () {
return {
mailConfigData: {
mail_driver: '',
mail_host: '',
mail_port: null,
mail_ses_key: '',
mail_ses_secret: '',
mail_encryption: 'tls',
from_mail: '',
from_name: ''
},
encryptions: ['tls', 'ssl', 'starttls']
}
},
validations: {
mailConfigData: {
mail_driver: {
required
},
mail_host: {
required
},
mail_port: {
required,
numeric
},
mail_ses_key: {
required
},
mail_ses_secret: {
required
},
mail_encryption: {
required
},
from_mail: {
required,
email
},
from_name: {
required
}
}
},
mounted () {
for (const key in this.mailConfigData) {
if (this.configData.hasOwnProperty(key)) {
this.mailConfigData[key] = this.configData[key]
}
}
},
methods: {
async saveEmailConfig () {
this.$v.mailConfigData.$touch()
if (!this.$v.mailConfigData.$invalid) {
this.$emit('submit-data', this.mailConfigData)
}
return false
},
onChangeDriver () {
this.$v.mailConfigData.mail_driver.$touch()
this.$emit('on-change-driver', this.mailConfigData.mail_driver)
}
}
}
</script>

View File

@ -0,0 +1,253 @@
<template>
<form @submit.prevent="saveEmailConfig()">
<div class="row">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.driver') }}</label>
<span class="text-danger"> *</span>
<base-select
v-model="mailConfigData.mail_driver"
:invalid="$v.mailConfigData.mail_driver.$error"
:options="mailDrivers"
:searchable="true"
:show-labels="false"
@input="onChangeDriver"
/>
<div v-if="$v.mailConfigData.mail_driver.$error">
<span v-if="!$v.mailConfigData.mail_driver.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.host') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_host.$error"
v-model.trim="mailConfigData.mail_host"
type="text"
name="mail_host"
@input="$v.mailConfigData.mail_host.$touch()"
/>
<div v-if="$v.mailConfigData.mail_host.$error">
<span v-if="!$v.mailConfigData.mail_host.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<div class="row my-2">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.username') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_username.$error"
v-model.trim="mailConfigData.mail_username"
type="text"
name="db_name"
@input="$v.mailConfigData.mail_username.$touch()"
/>
<div v-if="$v.mailConfigData.mail_username.$error">
<span v-if="!$v.mailConfigData.mail_username.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.password') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_password.$error"
v-model.trim="mailConfigData.mail_password"
type="password"
name="name"
show-password
@input="$v.mailConfigData.mail_password.$touch()"
/>
<div v-if="$v.mailConfigData.mail_password.$error">
<span v-if="!$v.mailConfigData.mail_password.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<div class="row my-2">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.port') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_port.$error"
v-model.trim="mailConfigData.mail_port"
type="text"
name="mail_port"
@input="$v.mailConfigData.mail_port.$touch()"
/>
<div v-if="$v.mailConfigData.mail_port.$error">
<span v-if="!$v.mailConfigData.mail_port.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
<span v-if="!$v.mailConfigData.mail_port.numeric" class="text-danger">
{{ $tc('validation.numbers_only') }}
</span>
</div>
</div>
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.encryption') }}</label>
<span class="text-danger"> *</span>
<base-select
v-model.trim="mailConfigData.mail_encryption"
:invalid="$v.mailConfigData.mail_encryption.$error"
:options="encryptions"
:searchable="true"
:show-labels="false"
@input="$v.mailConfigData.mail_encryption.$touch()"
/>
<div v-if="$v.mailConfigData.mail_encryption.$error">
<span v-if="!$v.mailConfigData.mail_encryption.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<div class="row my-2">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.from_mail') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.from_mail.$error"
v-model.trim="mailConfigData.from_mail"
type="text"
name="from_mail"
@input="$v.mailConfigData.from_mail.$touch()"
/>
<div v-if="$v.mailConfigData.from_mail.$error">
<span v-if="!$v.mailConfigData.from_mail.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
<span v-if="!$v.mailConfigData.from_mail.numeric" class="text-danger">
{{ $tc('validation.numbers_only') }}
</span>
</div>
</div>
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.from_name') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.from_name.$error"
v-model.trim="mailConfigData.from_name"
type="text"
name="name"
@input="$v.mailConfigData.from_name.$touch()"
/>
<div v-if="$v.mailConfigData.from_name.$error">
<span v-if="!$v.mailConfigData.from_name.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<base-button
:loading="loading"
class="pull-right mt-4"
icon="save"
color="theme"
type="submit"
>
{{ $t('general.save') }}
</base-button>
</form>
</template>
<script>
import MultiSelect from 'vue-multiselect'
import { validationMixin } from 'vuelidate'
const { required, email, numeric } = require('vuelidate/lib/validators')
export default {
components: {
MultiSelect
},
mixins: [validationMixin],
props: {
configData: {
type: Object,
require: true,
default: Object
},
loading: {
type: Boolean,
require: true,
default: false
},
mailDrivers: {
type: Array,
require: true,
default: Array
}
},
data () {
return {
mailConfigData: {
mail_driver: '',
mail_host: '',
mail_port: null,
mail_username: '',
mail_password: '',
mail_encryption: 'tls',
from_mail: '',
from_name: ''
},
encryptions: ['tls', 'ssl', 'starttls']
}
},
validations: {
mailConfigData: {
mail_driver: {
required
},
mail_host: {
required
},
mail_port: {
required,
numeric
},
mail_username: {
required
},
mail_password: {
required
},
mail_encryption: {
required
},
from_mail: {
required,
email
},
from_name: {
required
}
}
},
mounted () {
for (const key in this.mailConfigData) {
if (this.configData.hasOwnProperty(key)) {
this.mailConfigData[key] = this.configData[key]
}
}
},
methods: {
async saveEmailConfig () {
this.$v.mailConfigData.$touch()
if (!this.$v.mailConfigData.$invalid) {
this.$emit('submit-data', this.mailConfigData)
}
return false
},
onChangeDriver () {
this.$v.mailConfigData.mail_driver.$touch()
this.$emit('on-change-driver', this.mailConfigData.mail_driver)
}
}
}
</script>

View File

@ -0,0 +1,233 @@
<template>
<form @submit.prevent="saveEmailConfig()">
<div class="row">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.driver') }}</label>
<span class="text-danger"> *</span>
<base-select
v-model="mailConfigData.mail_driver"
:invalid="$v.mailConfigData.mail_driver.$error"
:options="mailDrivers"
:searchable="true"
:show-labels="false"
@input="onChangeDriver"
/>
<div v-if="$v.mailConfigData.mail_driver.$error">
<span v-if="!$v.mailConfigData.mail_driver.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.host') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_host.$error"
v-model.trim="mailConfigData.mail_host"
type="text"
name="mail_host"
@input="$v.mailConfigData.mail_host.$touch()"
/>
<div v-if="$v.mailConfigData.mail_host.$error">
<span v-if="!$v.mailConfigData.mail_host.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<div class="row my-2">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.port') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_port.$error"
v-model.trim="mailConfigData.mail_port"
type="text"
name="mail_port"
@input="$v.mailConfigData.mail_port.$touch()"
/>
<div v-if="$v.mailConfigData.mail_port.$error">
<span v-if="!$v.mailConfigData.mail_port.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
<span v-if="!$v.mailConfigData.mail_port.numeric" class="text-danger">
{{ $tc('validation.numbers_only') }}
</span>
</div>
</div>
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.encryption') }}</label>
<span class="text-danger"> *</span>
<base-select
v-model.trim="mailConfigData.mail_encryption"
:invalid="$v.mailConfigData.mail_encryption.$error"
:options="encryptions"
:searchable="true"
:show-labels="false"
@input="$v.mailConfigData.mail_encryption.$touch()"
/>
<div v-if="$v.mailConfigData.mail_encryption.$error">
<span v-if="!$v.mailConfigData.mail_encryption.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<div class="row my-2">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.from_mail') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.from_mail.$error"
v-model.trim="mailConfigData.from_mail"
type="text"
name="from_mail"
@input="$v.mailConfigData.from_mail.$touch()"
/>
<div v-if="$v.mailConfigData.from_mail.$error">
<span v-if="!$v.mailConfigData.from_mail.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
<span v-if="!$v.mailConfigData.from_mail.numeric" class="text-danger">
{{ $tc('validation.numbers_only') }}
</span>
</div>
</div>
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.from_name') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.from_name.$error"
v-model.trim="mailConfigData.from_name"
type="text"
name="name"
@input="$v.mailConfigData.from_name.$touch()"
/>
<div v-if="$v.mailConfigData.from_name.$error">
<span v-if="!$v.mailConfigData.from_name.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<div class="row my-2">
<div class="col-md-6 my-2">
<label class="form-label">{{ $t('wizard.mail.sparkpost_secret') }}</label>
<span class="text-danger"> *</span>
<base-input
:invalid="$v.mailConfigData.mail_sparkpost_secret.$error"
v-model.trim="mailConfigData.mail_sparkpost_secret"
type="password"
name="name"
show-password
@input="$v.mailConfigData.mail_sparkpost_secret.$touch()"
/>
<div v-if="$v.mailConfigData.mail_sparkpost_secret.$error">
<span v-if="!$v.mailConfigData.mail_sparkpost_secret.required" class="text-danger">
{{ $tc('validation.required') }}
</span>
</div>
</div>
</div>
<base-button
:loading="loading"
class="pull-right mt-4"
icon="save"
color="theme"
type="submit"
>
{{ $t('general.save') }}
</base-button>
</form>
</template>
<script>
import MultiSelect from 'vue-multiselect'
import { validationMixin } from 'vuelidate'
const { required, email, numeric } = require('vuelidate/lib/validators')
export default {
components: {
MultiSelect
},
mixins: [validationMixin],
props: {
configData: {
type: Object,
require: true,
default: Object
},
loading: {
type: Boolean,
require: true,
default: false
},
mailDrivers: {
type: Array,
require: true,
default: Array
}
},
data () {
return {
mailConfigData: {
mail_driver: '',
mail_host: '',
mail_port: null,
mail_sparkpost_secret: '',
mail_encryption: 'tls',
from_mail: '',
from_name: ''
},
encryptions: ['tls', 'ssl', 'starttls']
}
},
validations: {
mailConfigData: {
mail_driver: {
required
},
mail_host: {
required
},
mail_port: {
required,
numeric
},
mail_sparkpost_secret: {
required
},
mail_encryption: {
required
},
from_mail: {
required,
email
},
from_name: {
required
}
}
},
mounted () {
for (const key in this.mailConfigData) {
if (this.configData.hasOwnProperty(key)) {
this.mailConfigData[key] = this.configData[key]
}
}
},
methods: {
async saveEmailConfig () {
this.$v.mailConfigData.$touch()
if (!this.$v.mailConfigData.$invalid) {
this.$emit('submit-data', this.mailConfigData)
}
return false
},
onChangeDriver () {
this.$v.mailConfigData.mail_driver.$touch()
this.$emit('on-change-driver', this.mailConfigData.mail_driver)
}
}
}
</script>