Add Resend Email Option

This commit is contained in:
radhu587
2020-05-09 14:22:13 +05:30
parent b30e3a9b11
commit 3c096f1386
7 changed files with 647 additions and 263 deletions

View File

@ -1,7 +1,7 @@
<template>
<div v-if="invoice" class="main-content invoice-view-page">
<div class="page-header">
<h3 class="page-title"> {{ invoice.invoice_number }}</h3>
<h3 class="page-title">{{ invoice.invoice_number }}</h3>
<div class="page-actions row">
<div class="col-xs-2 mr-3">
<base-button
@ -24,26 +24,47 @@
>
{{ $t('invoices.send_invoice') }}
</base-button>
<router-link v-if="invoice.status === 'SENT'" :to="`/admin/payments/${$route.params.id}/create`">
<base-button
color="theme"
>
<router-link
v-if="invoice.status === 'SENT'"
:to="`/admin/payments/${$route.params.id}/create`"
>
<base-button color="theme">
{{ $t('payments.record_payment') }}
</base-button>
</router-link>
<v-dropdown :close-on-select="false" align="left" class="filter-container">
<v-dropdown
:close-on-select="true"
align="left"
class="filter-container"
>
<a slot="activator" href="#">
<base-button color="theme">
<font-awesome-icon icon="ellipsis-h" />
</base-button>
</a>
<v-dropdown-item>
<router-link :to="{path: `/admin/invoices/${$route.params.id}/edit`}" class="dropdown-item">
<font-awesome-icon :icon="['fas', 'pencil-alt']" class="dropdown-item-icon"/>
<div class="dropdown-item" @click="copyPdfUrl">
<font-awesome-icon
:icon="['fas', 'link']"
class="dropdown-item-icon"
/>
{{ $t('general.copy_pdf_url') }}
</div>
<router-link
:to="{ path: `/admin/invoices/${$route.params.id}/edit` }"
class="dropdown-item"
>
<font-awesome-icon
:icon="['fas', 'pencil-alt']"
class="dropdown-item-icon"
/>
{{ $t('general.edit') }}
</router-link>
<div class="dropdown-item" @click="removeInvoice($route.params.id)">
<font-awesome-icon :icon="['fas', 'trash']" class="dropdown-item-icon" />
<font-awesome-icon
:icon="['fas', 'trash']"
class="dropdown-item-icon"
/>
{{ $t('general.delete') }}
</div>
</v-dropdown-item>
@ -61,14 +82,18 @@
align-icon="right"
@input="onSearch"
/>
<div
class="btn-group ml-3"
role="group"
aria-label="First group"
>
<v-dropdown :close-on-select="false" align="left" class="filter-container">
<div class="btn-group ml-3" role="group" aria-label="First group">
<v-dropdown
:close-on-select="false"
align="left"
class="filter-container"
>
<a slot="activator" href="#">
<base-button class="inv-button inv-filter-fields-btn" color="default" size="medium">
<base-button
class="inv-button inv-filter-fields-btn"
color="default"
size="medium"
>
<font-awesome-icon icon="filter" />
</base-button>
</a>
@ -84,8 +109,10 @@
class="inv-radio"
value="invoice_date"
@change="onSearch"
>
<label class="inv-label" for="filter_invoice_date">{{ $t('invoices.invoice_date') }}</label>
/>
<label class="inv-label" for="filter_invoice_date">{{
$t('invoices.invoice_date')
}}</label>
</div>
<div class="filter-items">
<input
@ -96,8 +123,10 @@
class="inv-radio"
value="due_date"
@change="onSearch"
>
<label class="inv-label" for="filter_due_date">{{ $t('invoices.due_date') }}</label>
/>
<label class="inv-label" for="filter_due_date">{{
$t('invoices.due_date')
}}</label>
</div>
<div class="filter-items">
<input
@ -108,11 +137,19 @@
class="inv-radio"
value="invoice_number"
@change="onSearch"
>
<label class="inv-label" for="filter_invoice_number">{{ $t('invoices.invoice_number') }}</label>
/>
<label class="inv-label" for="filter_invoice_number">{{
$t('invoices.invoice_number')
}}</label>
</div>
</v-dropdown>
<base-button v-tooltip.top-center="{ content: getOrderName }" class="inv-button inv-filter-sorting-btn" color="default" size="medium" @click="sortData">
<base-button
v-tooltip.top-center="{ content: getOrderName }"
class="inv-button inv-filter-sorting-btn"
color="default"
size="medium"
@click="sortData"
>
<font-awesome-icon v-if="getOrderBy" icon="sort-amount-up" />
<font-awesome-icon v-else icon="sort-amount-down" />
</base-button>
@ -121,7 +158,7 @@
<base-loader v-if="isSearching" />
<div v-else class="side-content">
<router-link
v-for="(invoice,index) in invoices"
v-for="(invoice, index) in invoices"
:to="`/admin/invoices/${invoice.id}/view`"
:key="index"
class="side-invoice"
@ -129,10 +166,20 @@
<div class="left">
<div class="inv-name">{{ invoice.user.name }}</div>
<div class="inv-number">{{ invoice.invoice_number }}</div>
<div :class="'inv-status-'+invoice.status.toLowerCase()" class="inv-status">{{ invoice.status }}</div>
<div
:class="'inv-status-' + invoice.status.toLowerCase()"
class="inv-status"
>
{{ invoice.status }}
</div>
</div>
<div class="right">
<div class="inv-amount" v-html="$utils.formatMoney(invoice.due_amount, invoice.user.currency)" />
<div
class="inv-amount"
v-html="
$utils.formatMoney(invoice.due_amount, invoice.user.currency)
"
/>
<div class="inv-date">{{ invoice.formattedInvoiceDate }}</div>
</div>
</router-link>
@ -141,8 +188,8 @@
</p>
</div>
</div>
<div class="invoice-view-page-container" >
<iframe :src="`${shareableLink}`" class="frame-style"/>
<div class="invoice-view-page-container">
<iframe :src="`${shareableLink}`" class="frame-style" />
</div>
</div>
</template>
@ -291,6 +338,14 @@ export default {
}
})
},
copyPdfUrl () {
let pdfUrl = `${window.location.origin}/invoices/pdf/${this.invoice.unique_hash}`
let response = this.$utils.copyTextToClipboard(pdfUrl)
window.toastr['success'](this.$tc('Copied PDF url to clipboard!'))
},
async removeInvoice (id) {
this.selectInvoice([parseInt(id)])
this.id = id