mirror of
https://github.com/crater-invoice/crater.git
synced 2025-10-27 11:41:09 -04:00
Merge branch 'fix_all_customer_load' into 'master'
Fix all customer load See merge request mohit.panjvani/crater-web!1435
This commit is contained in:
Mohit Panjwani
@ -17,6 +17,7 @@ export const useCategoryStore = (useWindow = false) => {
|
||||
name: '',
|
||||
description: '',
|
||||
},
|
||||
editCategory: null
|
||||
}),
|
||||
|
||||
getters: {
|
||||
|
||||
@ -25,6 +25,7 @@ export const useCustomerStore = (useWindow = false) => {
|
||||
currentCustomer: {
|
||||
...customerStub(),
|
||||
},
|
||||
editCustomer: null
|
||||
}),
|
||||
|
||||
getters: {
|
||||
|
||||
@ -7,7 +7,7 @@
|
||||
hidden
|
||||
h-full
|
||||
pt-16
|
||||
pb-4
|
||||
pb-[6.6rem]
|
||||
ml-56
|
||||
bg-white
|
||||
xl:ml-64
|
||||
@ -107,18 +107,18 @@
|
||||
</div>
|
||||
|
||||
<div
|
||||
ref="customerListSection"
|
||||
class="
|
||||
h-full
|
||||
pb-32
|
||||
overflow-y-scroll
|
||||
border-l border-gray-200 border-solid
|
||||
sidebar
|
||||
base-scroll
|
||||
"
|
||||
>
|
||||
<div v-for="(customer, index) in customerStore.customers" :key="index">
|
||||
<div v-for="(customer, index) in customerList" :key="index">
|
||||
<router-link
|
||||
v-if="customer && !isFetching"
|
||||
v-if="customer"
|
||||
:id="'customer-' + customer.id"
|
||||
:to="`/admin/customers/${customer.id}/view`"
|
||||
:class="[
|
||||
@ -145,7 +145,7 @@
|
||||
truncate
|
||||
"
|
||||
/>
|
||||
|
||||
|
||||
<BaseText
|
||||
v-if="customer.contact_name"
|
||||
:text="customer.contact_name"
|
||||
@ -162,20 +162,19 @@
|
||||
</div>
|
||||
<div class="flex-1 font-bold text-right whitespace-nowrap">
|
||||
<BaseFormatMoney
|
||||
:amount="customer.due_amount"
|
||||
:amount="customer.due_amount!==null ? customer.due_amount : 0"
|
||||
:currency="customer.currency"
|
||||
/>
|
||||
</div>
|
||||
</router-link>
|
||||
</div>
|
||||
<div class="flex justify-center p-4 items-center">
|
||||
<div v-if="isFetching" class="flex justify-center p-4 items-center">
|
||||
<LoadingIcon
|
||||
v-if="isFetching"
|
||||
class="h-6 m-1 animate-spin text-primary-400"
|
||||
/>
|
||||
</div>
|
||||
<p
|
||||
v-if="!customerStore.customers.length && !isFetching"
|
||||
v-if="!customerList?.length && !isFetching"
|
||||
class="flex justify-center px-4 mt-5 text-sm text-gray-600"
|
||||
>
|
||||
{{ $t('customers.no_matching_customers') }}
|
||||
@ -185,7 +184,7 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { computed, ref, reactive, watch, inject } from 'vue'
|
||||
import { computed, ref, reactive } from 'vue'
|
||||
import { useI18n } from 'vue-i18n'
|
||||
import { useRoute } from 'vue-router'
|
||||
import { useCustomerStore } from '@/scripts/admin/stores/customer'
|
||||
@ -193,20 +192,22 @@ import LoadingIcon from '@/scripts/components/icons/LoadingIcon.vue'
|
||||
import { debounce } from 'lodash'
|
||||
|
||||
const customerStore = useCustomerStore()
|
||||
const title = 'Customer View'
|
||||
const route = useRoute()
|
||||
const { t } = useI18n()
|
||||
|
||||
let isSearching = ref(false)
|
||||
|
||||
let isFetching = ref(false)
|
||||
|
||||
let searchData = reactive({
|
||||
orderBy: '',
|
||||
orderByField: '',
|
||||
searchText: '',
|
||||
orderBy: null,
|
||||
orderByField: null,
|
||||
searchText: null,
|
||||
})
|
||||
|
||||
const customerList = ref(null)
|
||||
const currentPageNumber = ref(1)
|
||||
const lastPageNumber = ref(1)
|
||||
const customerListSection = ref(null)
|
||||
|
||||
onSearch = debounce(onSearch, 500)
|
||||
|
||||
const getOrderBy = computed(() => {
|
||||
@ -224,16 +225,64 @@ function hasActiveUrl(id) {
|
||||
return route.params.id == id
|
||||
}
|
||||
|
||||
async function loadCustomers() {
|
||||
async function loadCustomers(pageNumber, fromScrollListener = false) {
|
||||
if (isFetching.value) {
|
||||
return
|
||||
}
|
||||
|
||||
let params = {}
|
||||
if (
|
||||
searchData.searchText !== '' &&
|
||||
searchData.searchText !== null &&
|
||||
searchData.searchText !== undefined
|
||||
) {
|
||||
params.display_name = searchData.searchText
|
||||
}
|
||||
|
||||
if (searchData.orderBy !== null && searchData.orderBy !== undefined) {
|
||||
params.orderBy = searchData.orderBy
|
||||
}
|
||||
|
||||
if (
|
||||
searchData.orderByField !== null &&
|
||||
searchData.orderByField !== undefined
|
||||
) {
|
||||
params.orderByField = searchData.orderByField
|
||||
}
|
||||
|
||||
isFetching.value = true
|
||||
|
||||
await customerStore.fetchCustomers({ limit: 'all' })
|
||||
|
||||
let response = await customerStore.fetchCustomers({
|
||||
page: pageNumber,
|
||||
...params,
|
||||
limit: 15
|
||||
})
|
||||
isFetching.value = false
|
||||
|
||||
setTimeout(() => {
|
||||
scrollToCustomer()
|
||||
}, 500)
|
||||
customerList.value = customerList.value ? customerList.value : []
|
||||
customerList.value = [...customerList.value, ...response.data.data]
|
||||
|
||||
currentPageNumber.value = pageNumber ? pageNumber : 1
|
||||
lastPageNumber.value = response.data.meta.last_page
|
||||
let customerFound = customerList.value.find(
|
||||
(cust) => cust.id == route.params.id
|
||||
)
|
||||
|
||||
if (
|
||||
fromScrollListener == false &&
|
||||
!customerFound &&
|
||||
currentPageNumber.value < lastPageNumber.value &&
|
||||
Object.keys(params).length === 0
|
||||
) {
|
||||
loadCustomers(++currentPageNumber.value)
|
||||
}
|
||||
|
||||
if (customerFound) {
|
||||
setTimeout(() => {
|
||||
if (fromScrollListener == false) {
|
||||
scrollToCustomer()
|
||||
}
|
||||
}, 500)
|
||||
}
|
||||
}
|
||||
|
||||
function scrollToCustomer() {
|
||||
@ -242,41 +291,27 @@ function scrollToCustomer() {
|
||||
if (el) {
|
||||
el.scrollIntoView({ behavior: 'smooth' })
|
||||
el.classList.add('shake')
|
||||
addScrollListener()
|
||||
}
|
||||
}
|
||||
|
||||
async function onSearch() {
|
||||
let data = {}
|
||||
if (
|
||||
searchData.searchText !== '' &&
|
||||
searchData.searchText !== null &&
|
||||
searchData.searchText !== undefined
|
||||
) {
|
||||
data.display_name = searchData.searchText
|
||||
}
|
||||
|
||||
if (searchData.orderBy !== null && searchData.orderBy !== undefined) {
|
||||
data.orderBy = searchData.orderBy
|
||||
}
|
||||
|
||||
if (
|
||||
searchData.orderByField !== null &&
|
||||
searchData.orderByField !== undefined
|
||||
) {
|
||||
data.orderByField = searchData.orderByField
|
||||
}
|
||||
|
||||
isSearching.value = true
|
||||
|
||||
try {
|
||||
let response = await customerStore.fetchCustomers(data)
|
||||
isSearching.value = false
|
||||
if (response.data) {
|
||||
customerStore.customers = response.data.data
|
||||
function addScrollListener() {
|
||||
customerListSection.value.addEventListener('scroll', (ev) => {
|
||||
if (
|
||||
ev.target.scrollTop > 0 &&
|
||||
ev.target.scrollTop + ev.target.clientHeight >
|
||||
ev.target.scrollHeight - 200
|
||||
) {
|
||||
if (currentPageNumber.value < lastPageNumber.value) {
|
||||
loadCustomers(++currentPageNumber.value, true)
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
isSearching.value = false
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
async function onSearch() {
|
||||
customerList.value = []
|
||||
loadCustomers()
|
||||
}
|
||||
|
||||
function sortData() {
|
||||
|
||||
@ -23,7 +23,6 @@
|
||||
estimateData.status === 'DRAFT' &&
|
||||
userStore.hasAbilities(abilities.SEND_ESTIMATE)
|
||||
"
|
||||
:disabled="isSendingEmail"
|
||||
:content-loading="isLoadingEstimate"
|
||||
variant="primary"
|
||||
class="text-sm"
|
||||
@ -45,7 +44,7 @@
|
||||
hidden
|
||||
h-full
|
||||
pt-16
|
||||
pb-4
|
||||
pb-[6.4rem]
|
||||
ml-56
|
||||
bg-white
|
||||
xl:ml-64
|
||||
@ -156,18 +155,17 @@
|
||||
</div>
|
||||
|
||||
<div
|
||||
v-if="estimateStore && estimateStore.estimates"
|
||||
ref="estimateListSection"
|
||||
class="
|
||||
h-full
|
||||
pb-32
|
||||
overflow-y-scroll
|
||||
border-l border-gray-200 border-solid
|
||||
base-scroll
|
||||
"
|
||||
>
|
||||
<div v-for="(estimate, index) in estimateStore.estimates" :key="index">
|
||||
<div v-for="(estimate, index) in estimateList" :key="index">
|
||||
<router-link
|
||||
v-if="estimate && !isLoading"
|
||||
v-if="estimate"
|
||||
:id="'estimate-' + estimate.id"
|
||||
:to="`/admin/estimates/${estimate.id}/view`"
|
||||
:class="[
|
||||
@ -248,14 +246,11 @@
|
||||
</div>
|
||||
</router-link>
|
||||
</div>
|
||||
<div class="flex justify-center p-4 items-center">
|
||||
<LoadingIcon
|
||||
v-if="isLoading"
|
||||
class="h-6 m-1 animate-spin text-primary-400"
|
||||
/>
|
||||
<div v-if="isLoading" class="flex justify-center p-4 items-center">
|
||||
<LoadingIcon class="h-6 m-1 animate-spin text-primary-400" />
|
||||
</div>
|
||||
<p
|
||||
v-if="!estimateStore.estimates.length && !isLoading"
|
||||
v-if="!estimateList?.length && !isLoading"
|
||||
class="flex justify-center px-4 mt-5 text-sm text-gray-600"
|
||||
>
|
||||
{{ $t('estimates.no_matching_estimates') }}
|
||||
@ -283,49 +278,40 @@
|
||||
|
||||
<script setup>
|
||||
import { useI18n } from 'vue-i18n'
|
||||
import { computed, reactive, ref, watch, inject } from 'vue'
|
||||
import { computed, reactive, ref, watch } from 'vue'
|
||||
import { useRoute, useRouter } from 'vue-router'
|
||||
import EstimateDropDown from '@/scripts/admin/components/dropdowns/EstimateIndexDropdown.vue'
|
||||
import { debounce } from 'lodash'
|
||||
|
||||
import { useEstimateStore } from '@/scripts/admin/stores/estimate'
|
||||
import { useModalStore } from '@/scripts/stores/modal'
|
||||
import { useNotificationStore } from '@/scripts/stores/notification'
|
||||
import { useDialogStore } from '@/scripts/stores/dialog'
|
||||
import { useUserStore } from '@/scripts/admin/stores/user'
|
||||
|
||||
import EstimateDropDown from '@/scripts/admin/components/dropdowns/EstimateIndexDropdown.vue'
|
||||
import SendEstimateModal from '@/scripts/admin/components/modal-components/SendEstimateModal.vue'
|
||||
import LoadingIcon from '@/scripts/components/icons/LoadingIcon.vue'
|
||||
|
||||
import abilities from '@/scripts/admin/stub/abilities'
|
||||
|
||||
const modalStore = useModalStore()
|
||||
const estimateStore = useEstimateStore()
|
||||
const notificationStore = useNotificationStore()
|
||||
const dialogStore = useDialogStore()
|
||||
const userStore = useUserStore()
|
||||
|
||||
const { t } = useI18n()
|
||||
const utils = inject('$utils')
|
||||
const id = ref(null)
|
||||
const count = ref(null)
|
||||
const estimateData = ref(null)
|
||||
const currency = ref(null)
|
||||
const route = useRoute()
|
||||
const router = useRouter()
|
||||
const status = ref([
|
||||
'DRAFT',
|
||||
'SENT',
|
||||
'VIEWED',
|
||||
'EXPIRED',
|
||||
'ACCEPTED',
|
||||
'REJECTED',
|
||||
])
|
||||
|
||||
const isMarkAsSent = ref(false)
|
||||
const isSendingEmail = ref(false)
|
||||
const isRequestOnGoing = ref(false)
|
||||
const isSearching = ref(false)
|
||||
const isLoading = ref(false)
|
||||
const isLoadingEstimate = ref(false)
|
||||
|
||||
const estimateList = ref(null)
|
||||
const currentPageNumber = ref(1)
|
||||
const lastPageNumber = ref(1)
|
||||
const estimateListSection = ref(null)
|
||||
|
||||
const searchData = reactive({
|
||||
orderBy: null,
|
||||
orderByField: null,
|
||||
@ -374,14 +360,63 @@ function hasActiveUrl(id) {
|
||||
return route.params.id == id
|
||||
}
|
||||
|
||||
async function loadEstimates() {
|
||||
async function loadEstimates(pageNumber, fromScrollListener = false) {
|
||||
if (isLoading.value) {
|
||||
return
|
||||
}
|
||||
|
||||
let params = {}
|
||||
if (
|
||||
searchData.searchText !== '' &&
|
||||
searchData.searchText !== null &&
|
||||
searchData.searchText !== undefined
|
||||
) {
|
||||
params.search = searchData.searchText
|
||||
}
|
||||
|
||||
if (searchData.orderBy !== null && searchData.orderBy !== undefined) {
|
||||
params.orderBy = searchData.orderBy
|
||||
}
|
||||
|
||||
if (
|
||||
searchData.orderByField !== null &&
|
||||
searchData.orderByField !== undefined
|
||||
) {
|
||||
params.orderByField = searchData.orderByField
|
||||
}
|
||||
|
||||
isLoading.value = true
|
||||
await estimateStore.fetchEstimates(route.params.id)
|
||||
let response = await estimateStore.fetchEstimates({
|
||||
page: pageNumber,
|
||||
...params,
|
||||
})
|
||||
isLoading.value = false
|
||||
|
||||
setTimeout(() => {
|
||||
scrollToEstimate()
|
||||
}, 500)
|
||||
estimateList.value = estimateList.value ? estimateList.value : []
|
||||
estimateList.value = [...estimateList.value, ...response.data.data]
|
||||
|
||||
currentPageNumber.value = pageNumber ? pageNumber : 1
|
||||
lastPageNumber.value = response.data.meta.last_page
|
||||
let estimateFound = estimateList.value.find(
|
||||
(est) => est.id == route.params.id
|
||||
)
|
||||
|
||||
if (
|
||||
fromScrollListener == false &&
|
||||
!estimateFound &&
|
||||
currentPageNumber.value < lastPageNumber.value &&
|
||||
Object.keys(params).length === 0
|
||||
) {
|
||||
loadEstimates(++currentPageNumber.value)
|
||||
}
|
||||
|
||||
if (estimateFound) {
|
||||
setTimeout(() => {
|
||||
if (fromScrollListener == false) {
|
||||
scrollToEstimate()
|
||||
}
|
||||
}, 500)
|
||||
}
|
||||
}
|
||||
|
||||
function scrollToEstimate() {
|
||||
@ -389,9 +424,24 @@ function scrollToEstimate() {
|
||||
if (el) {
|
||||
el.scrollIntoView({ behavior: 'smooth' })
|
||||
el.classList.add('shake')
|
||||
addScrollListener()
|
||||
}
|
||||
}
|
||||
|
||||
function addScrollListener() {
|
||||
estimateListSection.value.addEventListener('scroll', (ev) => {
|
||||
if (
|
||||
ev.target.scrollTop > 0 &&
|
||||
ev.target.scrollTop + ev.target.clientHeight >
|
||||
ev.target.scrollHeight - 200
|
||||
) {
|
||||
if (currentPageNumber.value < lastPageNumber.value) {
|
||||
loadEstimates(++currentPageNumber.value, true)
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
async function loadEstimate() {
|
||||
isLoadingEstimate.value = true
|
||||
let response = await estimateStore.fetchEstimate(route.params.id)
|
||||
@ -403,30 +453,8 @@ async function loadEstimate() {
|
||||
}
|
||||
|
||||
async function onSearched() {
|
||||
let data = ''
|
||||
if (
|
||||
searchData.searchText !== '' &&
|
||||
searchData.searchText !== null &&
|
||||
searchData.searchText !== undefined
|
||||
) {
|
||||
data += `search=${searchData.searchText}&`
|
||||
}
|
||||
|
||||
if (searchData.orderBy !== null && searchData.orderBy !== undefined) {
|
||||
data += `orderBy=${searchData.orderBy}&`
|
||||
}
|
||||
if (
|
||||
searchData.orderByField !== null &&
|
||||
searchData.orderByField !== undefined
|
||||
) {
|
||||
data += `orderByField=${searchData.orderByField}`
|
||||
}
|
||||
isSearching.value = true
|
||||
let response = await estimateStore.searchEstimate(data)
|
||||
isSearching.value = false
|
||||
if (response.data) {
|
||||
estimateStore.estimates = response.data.data
|
||||
}
|
||||
estimateList.value = []
|
||||
loadEstimates()
|
||||
}
|
||||
|
||||
function sortData() {
|
||||
|
||||
@ -77,6 +77,7 @@
|
||||
label="name"
|
||||
track-by="id"
|
||||
:options="searchCategory"
|
||||
v-if="!isFetchingInitialData"
|
||||
:filter-results="false"
|
||||
resolve-on-load
|
||||
:delay="500"
|
||||
@ -180,6 +181,7 @@
|
||||
label="name"
|
||||
track-by="id"
|
||||
:options="searchCustomer"
|
||||
v-if="!isFetchingInitialData"
|
||||
:filter-results="false"
|
||||
resolve-on-load
|
||||
:delay="500"
|
||||
@ -280,7 +282,7 @@
|
||||
</template>
|
||||
|
||||
<script setup>
|
||||
import { ref, computed, onMounted } from 'vue'
|
||||
import { ref, computed, onMounted, onBeforeUnmount } from 'vue'
|
||||
import { useRoute, useRouter } from 'vue-router'
|
||||
import { useI18n } from 'vue-i18n'
|
||||
import {
|
||||
@ -415,11 +417,25 @@ function onCurrencyChange(v) {
|
||||
|
||||
async function searchCategory(search) {
|
||||
let res = await categoryStore.fetchCategories({ search })
|
||||
if(res.data.data.length>0 && categoryStore.editCategory) {
|
||||
let categoryFound = res.data.data.find((c) => c.id==categoryStore.editCategory.id)
|
||||
if(!categoryFound) {
|
||||
let edit_category = Object.assign({}, categoryStore.editCategory)
|
||||
res.data.data.unshift(edit_category)
|
||||
}
|
||||
}
|
||||
return res.data.data
|
||||
}
|
||||
|
||||
async function searchCustomer(search) {
|
||||
let res = await customerStore.fetchCustomers({ search })
|
||||
if(res.data.data.length>0 && customerStore.editCustomer) {
|
||||
let customerFound = res.data.data.find((c) => c.id==customerStore.editCustomer.id)
|
||||
if(!customerFound) {
|
||||
let edit_customer = Object.assign({}, customerStore.editCustomer)
|
||||
res.data.data.unshift(edit_customer)
|
||||
}
|
||||
}
|
||||
return res.data.data
|
||||
}
|
||||
|
||||
@ -435,10 +451,21 @@ async function loadData() {
|
||||
await expenseStore.fetchPaymentModes({ limit: 'all' })
|
||||
|
||||
if (isEdit.value) {
|
||||
await expenseStore.fetchExpense(route.params.id)
|
||||
const expenseData = await expenseStore.fetchExpense(route.params.id)
|
||||
|
||||
expenseStore.currentExpense.currency_id =
|
||||
expenseStore.currentExpense.selectedCurrency.id
|
||||
|
||||
if(expenseData.data) {
|
||||
if(!categoryStore.editCategory && expenseData.data.data.expense_category) {
|
||||
categoryStore.editCategory = expenseData.data.data.expense_category
|
||||
}
|
||||
|
||||
if(!customerStore.editCustomer && expenseData.data.data.customer) {
|
||||
customerStore.editCustomer = expenseData.data.data.customer
|
||||
}
|
||||
}
|
||||
|
||||
} else if (route.query.customer) {
|
||||
expenseStore.currentExpense.customer_id = route.query.customer
|
||||
}
|
||||
@ -477,4 +504,10 @@ async function submitForm() {
|
||||
return
|
||||
}
|
||||
}
|
||||
|
||||
onBeforeUnmount(() => {
|
||||
expenseStore.resetCurrentExpenseData()
|
||||
customerStore.editCustomer = null
|
||||
categoryStore.editCategory = null
|
||||
})
|
||||
</script>
|
||||
|
||||
@ -1,46 +1,37 @@
|
||||
<script setup>
|
||||
import { useI18n } from 'vue-i18n'
|
||||
import { computed, reactive, ref, watch, inject } from 'vue'
|
||||
import InvoiceDropdown from '@/scripts/admin/components/dropdowns/InvoiceIndexDropdown.vue'
|
||||
import { useRoute, useRouter } from 'vue-router'
|
||||
import { computed, reactive, ref, watch } from 'vue'
|
||||
import { useRoute } from 'vue-router'
|
||||
import { debounce } from 'lodash'
|
||||
|
||||
import { useInvoiceStore } from '@/scripts/admin/stores/invoice'
|
||||
import { useModalStore } from '@/scripts/stores/modal'
|
||||
import { useNotificationStore } from '@/scripts/stores/notification'
|
||||
import { useUserStore } from '@/scripts/admin/stores/user'
|
||||
import { useDialogStore } from '@/scripts/stores/dialog'
|
||||
|
||||
import SendInvoiceModal from '@/scripts/admin/components/modal-components/SendInvoiceModal.vue'
|
||||
import InvoiceDropdown from '@/scripts/admin/components/dropdowns/InvoiceIndexDropdown.vue'
|
||||
import LoadingIcon from '@/scripts/components/icons/LoadingIcon.vue'
|
||||
|
||||
import abilities from '@/scripts/admin/stub/abilities'
|
||||
|
||||
const modalStore = useModalStore()
|
||||
const invoiceStore = useInvoiceStore()
|
||||
const notificationStore = useNotificationStore()
|
||||
const userStore = useUserStore()
|
||||
const dialogStore = useDialogStore()
|
||||
|
||||
const { t } = useI18n()
|
||||
const utils = inject('$utils')
|
||||
const id = ref(null)
|
||||
const count = ref(null)
|
||||
const invoiceData = ref(null)
|
||||
const currency = ref(null)
|
||||
const route = useRoute()
|
||||
const router = useRouter()
|
||||
const status = ref([
|
||||
'DRAFT',
|
||||
'SENT',
|
||||
'VIEWED',
|
||||
'EXPIRED',
|
||||
'ACCEPTED',
|
||||
'REJECTED',
|
||||
])
|
||||
|
||||
const isMarkAsSent = ref(false)
|
||||
const isSendingEmail = ref(false)
|
||||
const isRequestOnGoing = ref(false)
|
||||
const isSearching = ref(false)
|
||||
const isLoading = ref(false)
|
||||
|
||||
const invoiceList = ref(null)
|
||||
const currentPageNumber = ref(1)
|
||||
const lastPageNumber = ref(1)
|
||||
const invoiceListSection = ref(null)
|
||||
|
||||
const searchData = reactive({
|
||||
orderBy: null,
|
||||
orderByField: null,
|
||||
@ -118,14 +109,61 @@ function hasActiveUrl(id) {
|
||||
return route.params.id == id
|
||||
}
|
||||
|
||||
async function loadInvoices() {
|
||||
async function loadInvoices(pageNumber, fromScrollListener = false) {
|
||||
if (isLoading.value) {
|
||||
return
|
||||
}
|
||||
|
||||
let params = {}
|
||||
if (
|
||||
searchData.searchText !== '' &&
|
||||
searchData.searchText !== null &&
|
||||
searchData.searchText !== undefined
|
||||
) {
|
||||
params.search = searchData.searchText
|
||||
}
|
||||
|
||||
if (searchData.orderBy !== null && searchData.orderBy !== undefined) {
|
||||
params.orderBy = searchData.orderBy
|
||||
}
|
||||
|
||||
if (
|
||||
searchData.orderByField !== null &&
|
||||
searchData.orderByField !== undefined
|
||||
) {
|
||||
params.orderByField = searchData.orderByField
|
||||
}
|
||||
|
||||
isLoading.value = true
|
||||
await invoiceStore.fetchInvoices()
|
||||
let response = await invoiceStore.fetchInvoices({
|
||||
page: pageNumber,
|
||||
...params,
|
||||
})
|
||||
isLoading.value = false
|
||||
|
||||
setTimeout(() => {
|
||||
scrollToInvoice()
|
||||
}, 500)
|
||||
invoiceList.value = invoiceList.value ? invoiceList.value : []
|
||||
invoiceList.value = [...invoiceList.value, ...response.data.data]
|
||||
|
||||
currentPageNumber.value = pageNumber ? pageNumber : 1
|
||||
lastPageNumber.value = response.data.meta.last_page
|
||||
let invoiceFound = invoiceList.value.find((inv) => inv.id == route.params.id)
|
||||
|
||||
if (
|
||||
fromScrollListener == false &&
|
||||
!invoiceFound &&
|
||||
currentPageNumber.value < lastPageNumber.value &&
|
||||
Object.keys(params).length === 0
|
||||
) {
|
||||
loadInvoices(++currentPageNumber.value)
|
||||
}
|
||||
|
||||
if (invoiceFound) {
|
||||
setTimeout(() => {
|
||||
if (fromScrollListener == false) {
|
||||
scrollToInvoice()
|
||||
}
|
||||
}, 500)
|
||||
}
|
||||
}
|
||||
|
||||
function scrollToInvoice() {
|
||||
@ -133,9 +171,24 @@ function scrollToInvoice() {
|
||||
if (el) {
|
||||
el.scrollIntoView({ behavior: 'smooth' })
|
||||
el.classList.add('shake')
|
||||
addScrollListener()
|
||||
}
|
||||
}
|
||||
|
||||
function addScrollListener() {
|
||||
invoiceListSection.value.addEventListener('scroll', (ev) => {
|
||||
if (
|
||||
ev.target.scrollTop > 0 &&
|
||||
ev.target.scrollTop + ev.target.clientHeight >
|
||||
ev.target.scrollHeight - 200
|
||||
) {
|
||||
if (currentPageNumber.value < lastPageNumber.value) {
|
||||
loadInvoices(++currentPageNumber.value, true)
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
async function loadInvoice() {
|
||||
let response = await invoiceStore.fetchInvoice(route.params.id)
|
||||
if (response.data) {
|
||||
@ -144,30 +197,8 @@ async function loadInvoice() {
|
||||
}
|
||||
|
||||
async function onSearched() {
|
||||
let data = ''
|
||||
if (
|
||||
searchData.searchText !== '' &&
|
||||
searchData.searchText !== null &&
|
||||
searchData.searchText !== undefined
|
||||
) {
|
||||
data += `search=${searchData.searchText}&`
|
||||
}
|
||||
|
||||
if (searchData.orderBy !== null && searchData.orderBy !== undefined) {
|
||||
data += `orderBy=${searchData.orderBy}&`
|
||||
}
|
||||
if (
|
||||
searchData.orderByField !== null &&
|
||||
searchData.orderByField !== undefined
|
||||
) {
|
||||
data += `orderByField=${searchData.orderByField}`
|
||||
}
|
||||
isSearching.value = true
|
||||
let response = await invoiceStore.searchInvoice(data)
|
||||
isSearching.value = false
|
||||
if (response.data) {
|
||||
invoiceStore.invoices = response.data.data
|
||||
}
|
||||
invoiceList.value = []
|
||||
loadInvoices()
|
||||
}
|
||||
|
||||
function sortData() {
|
||||
@ -211,7 +242,6 @@ onSearched = debounce(onSearched, 500)
|
||||
invoiceData.status === 'DRAFT' &&
|
||||
userStore.hasAbilities(abilities.SEND_INVOICE)
|
||||
"
|
||||
:disabled="isSendingEmail"
|
||||
variant="primary"
|
||||
class="text-sm"
|
||||
@click="onSendInvoice"
|
||||
@ -254,7 +284,7 @@ onSearched = debounce(onSearched, 500)
|
||||
hidden
|
||||
h-full
|
||||
pt-16
|
||||
pb-4
|
||||
pb-[6.4rem]
|
||||
ml-56
|
||||
bg-white
|
||||
xl:ml-64
|
||||
@ -359,18 +389,17 @@ onSearched = debounce(onSearched, 500)
|
||||
</div>
|
||||
|
||||
<div
|
||||
v-if="invoiceStore && invoiceStore.invoices"
|
||||
ref="invoiceListSection"
|
||||
class="
|
||||
h-full
|
||||
pb-32
|
||||
overflow-y-scroll
|
||||
border-l border-gray-200 border-solid
|
||||
base-scroll
|
||||
"
|
||||
>
|
||||
<div v-for="(invoice, index) in invoiceStore.invoices" :key="index">
|
||||
<div v-for="(invoice, index) in invoiceList" :key="index">
|
||||
<router-link
|
||||
v-if="invoice && !isLoading"
|
||||
v-if="invoice"
|
||||
:id="'invoice-' + invoice.id"
|
||||
:to="`/admin/invoices/${invoice.id}/view`"
|
||||
:class="[
|
||||
@ -449,14 +478,11 @@ onSearched = debounce(onSearched, 500)
|
||||
</div>
|
||||
</router-link>
|
||||
</div>
|
||||
<div class="flex justify-center p-4 items-center">
|
||||
<LoadingIcon
|
||||
v-if="isLoading"
|
||||
class="h-6 m-1 animate-spin text-primary-400"
|
||||
/>
|
||||
<div v-if="isLoading" class="flex justify-center p-4 items-center">
|
||||
<LoadingIcon class="h-6 m-1 animate-spin text-primary-400" />
|
||||
</div>
|
||||
<p
|
||||
v-if="!invoiceStore.invoices.length && !isLoading"
|
||||
v-if="!invoiceList?.length && !isLoading"
|
||||
class="flex justify-center px-4 mt-5 text-sm text-gray-600"
|
||||
>
|
||||
{{ $t('invoices.no_matching_invoices') }}
|
||||
|
||||
@ -84,9 +84,9 @@
|
||||
<BaseCustomerSelectInput
|
||||
v-model="paymentStore.currentPayment.customer_id"
|
||||
:content-loading="isLoadingContent"
|
||||
v-if="!isLoadingContent"
|
||||
:invalid="v$.currentPayment.customer_id.$error"
|
||||
:placeholder="$t('customers.select_a_customer')"
|
||||
:fetch-all="isEdit"
|
||||
show-action
|
||||
@update:modelValue="
|
||||
selectNewCustomer(paymentStore.currentPayment.customer_id)
|
||||
@ -446,6 +446,9 @@ function onCustomerChange(customer_id) {
|
||||
paymentStore.currentPayment.selectedCustomer = res2.data.data
|
||||
paymentStore.currentPayment.customer = res2.data.data
|
||||
paymentStore.currentPayment.currency = res2.data.data.currency
|
||||
if(isEdit.value && !customerStore.editCustomer && paymentStore.currentPayment.customer_id) {
|
||||
customerStore.editCustomer = res2.data.data
|
||||
}
|
||||
}
|
||||
|
||||
if (paymentStore.currentPayment.invoice_id) {
|
||||
@ -482,6 +485,7 @@ function onCustomerChange(customer_id) {
|
||||
onBeforeUnmount(() => {
|
||||
paymentStore.resetCurrentPayment()
|
||||
invoiceList.value = []
|
||||
customerStore.editCustomer = null
|
||||
})
|
||||
|
||||
async function submitPaymentData() {
|
||||
|
||||
@ -5,7 +5,6 @@
|
||||
<template #actions>
|
||||
<BaseButton
|
||||
v-if="userStore.hasAbilities(abilities.SEND_PAYMENT)"
|
||||
:disabled="isSendingEmail"
|
||||
:content-loading="isFetching"
|
||||
variant="primary"
|
||||
@click="onPaymentSend"
|
||||
@ -30,7 +29,7 @@
|
||||
hidden
|
||||
h-full
|
||||
pt-16
|
||||
pb-4
|
||||
pb-[6rem]
|
||||
ml-56
|
||||
bg-white
|
||||
xl:ml-64
|
||||
@ -139,17 +138,12 @@
|
||||
</div>
|
||||
|
||||
<div
|
||||
v-if="paymentStore && paymentStore.payments"
|
||||
class="
|
||||
h-full
|
||||
pb-32
|
||||
overflow-y-scroll
|
||||
border-l border-gray-200 border-solid
|
||||
"
|
||||
ref="paymentListSection"
|
||||
class="h-full overflow-y-scroll border-l border-gray-200 border-solid"
|
||||
>
|
||||
<div v-for="(payment, index) in paymentStore.payments" :key="index">
|
||||
<div v-for="(payment, index) in paymentList" :key="index">
|
||||
<router-link
|
||||
v-if="payment && !isLoading"
|
||||
v-if="payment"
|
||||
:id="'payment-' + payment.id"
|
||||
:to="`/admin/payments/${payment.id}/view`"
|
||||
:class="[
|
||||
@ -228,14 +222,11 @@
|
||||
</div>
|
||||
</router-link>
|
||||
</div>
|
||||
<div class="flex justify-center p-4 items-center">
|
||||
<LoadingIcon
|
||||
v-if="isLoading"
|
||||
class="h-6 m-1 animate-spin text-primary-400"
|
||||
/>
|
||||
<div v-if="isLoading" class="flex justify-center p-4 items-center">
|
||||
<LoadingIcon class="h-6 m-1 animate-spin text-primary-400" />
|
||||
</div>
|
||||
<p
|
||||
v-if="!paymentStore?.payments?.length && !isLoading"
|
||||
v-if="!paymentList?.length && !isLoading"
|
||||
class="flex justify-center px-4 mt-5 text-sm text-gray-600"
|
||||
>
|
||||
{{ $t('payments.no_matching_payments') }}
|
||||
@ -260,44 +251,43 @@
|
||||
<script setup>
|
||||
import { useI18n } from 'vue-i18n'
|
||||
import { debounce } from 'lodash'
|
||||
import { ref, reactive, computed, inject, onMounted, watch } from 'vue'
|
||||
import { useRoute, useRouter } from 'vue-router'
|
||||
import { ref, reactive, computed, watch } from 'vue'
|
||||
import { useRoute } from 'vue-router'
|
||||
import moment from 'moment'
|
||||
|
||||
import { useDialogStore } from '@/scripts/stores/dialog'
|
||||
import { usePaymentStore } from '@/scripts/admin/stores/payment'
|
||||
import { useModalStore } from '@/scripts/stores/modal'
|
||||
import PaymentDropdown from '@/scripts/admin/components/dropdowns/PaymentIndexDropdown.vue'
|
||||
import moment from 'moment'
|
||||
import { useUserStore } from '@/scripts/admin/stores/user'
|
||||
|
||||
import PaymentDropdown from '@/scripts/admin/components/dropdowns/PaymentIndexDropdown.vue'
|
||||
import SendPaymentModal from '@/scripts/admin/components/modal-components/SendPaymentModal.vue'
|
||||
import abilities from '@/scripts/admin/stub/abilities'
|
||||
import LoadingIcon from '@/scripts/components/icons/LoadingIcon.vue'
|
||||
|
||||
import abilities from '@/scripts/admin/stub/abilities'
|
||||
|
||||
const route = useRoute()
|
||||
const router = useRouter()
|
||||
|
||||
const { t } = useI18n()
|
||||
let id = ref(null)
|
||||
let count = ref(null)
|
||||
let payment = reactive({})
|
||||
let currency = ref(null)
|
||||
let searchData = reactive({
|
||||
orderBy: null,
|
||||
orderByField: null,
|
||||
searchText: null,
|
||||
})
|
||||
|
||||
let isSearching = ref(false)
|
||||
let isSendingEmail = ref(false)
|
||||
let isMarkingAsSent = ref(false)
|
||||
let isLoading = ref(false)
|
||||
let isFetching = ref(false)
|
||||
|
||||
const $utils = inject('utils')
|
||||
|
||||
const paymentStore = usePaymentStore()
|
||||
const modalStore = useModalStore()
|
||||
const userStore = useUserStore()
|
||||
|
||||
const paymentList = ref(null)
|
||||
const currentPageNumber = ref(1)
|
||||
const lastPageNumber = ref(1)
|
||||
const paymentListSection = ref(null)
|
||||
|
||||
const pageTitle = computed(() => {
|
||||
return payment.payment_number || ''
|
||||
})
|
||||
@ -346,14 +336,63 @@ function hasAbilities() {
|
||||
|
||||
const dialogStore = useDialogStore()
|
||||
|
||||
async function loadPayments() {
|
||||
async function loadPayments(pageNumber, fromScrollListener = false) {
|
||||
if (isLoading.value) {
|
||||
return
|
||||
}
|
||||
|
||||
let params = {}
|
||||
if (
|
||||
searchData.searchText !== '' &&
|
||||
searchData.searchText !== null &&
|
||||
searchData.searchText !== undefined
|
||||
) {
|
||||
params.search = searchData.searchText
|
||||
}
|
||||
|
||||
if (searchData.orderBy !== null && searchData.orderBy !== undefined) {
|
||||
params.orderBy = searchData.orderBy
|
||||
}
|
||||
|
||||
if (
|
||||
searchData.orderByField !== null &&
|
||||
searchData.orderByField !== undefined
|
||||
) {
|
||||
params.orderByField = searchData.orderByField
|
||||
}
|
||||
|
||||
isLoading.value = true
|
||||
await paymentStore.fetchPayments({ limit: 'all' })
|
||||
let response = await paymentStore.fetchPayments({
|
||||
page: pageNumber,
|
||||
...params,
|
||||
})
|
||||
isLoading.value = false
|
||||
|
||||
setTimeout(() => {
|
||||
scrollToPayment()
|
||||
}, 500)
|
||||
paymentList.value = paymentList.value ? paymentList.value : []
|
||||
paymentList.value = [...paymentList.value, ...response.data.data]
|
||||
|
||||
currentPageNumber.value = pageNumber ? pageNumber : 1
|
||||
lastPageNumber.value = response.data.meta.last_page
|
||||
let paymentFound = paymentList.value.find(
|
||||
(paym) => paym.id == route.params.id
|
||||
)
|
||||
|
||||
if (
|
||||
fromScrollListener == false &&
|
||||
!paymentFound &&
|
||||
currentPageNumber.value < lastPageNumber.value &&
|
||||
Object.keys(params).length === 0
|
||||
) {
|
||||
loadPayments(++currentPageNumber.value)
|
||||
}
|
||||
|
||||
if (paymentFound) {
|
||||
setTimeout(() => {
|
||||
if (fromScrollListener == false) {
|
||||
scrollToPayment()
|
||||
}
|
||||
}, 500)
|
||||
}
|
||||
}
|
||||
|
||||
async function loadPayment() {
|
||||
@ -375,42 +414,27 @@ function scrollToPayment() {
|
||||
if (el) {
|
||||
el.scrollIntoView({ behavior: 'smooth' })
|
||||
el.classList.add('shake')
|
||||
addScrollListener()
|
||||
}
|
||||
}
|
||||
|
||||
async function onSearch() {
|
||||
let data = {}
|
||||
|
||||
if (
|
||||
searchData.searchText !== '' &&
|
||||
searchData.searchText !== null &&
|
||||
searchData.searchText !== undefined
|
||||
) {
|
||||
data.search = searchData.searchText
|
||||
}
|
||||
|
||||
if (searchData.orderBy !== null && searchData.orderBy !== undefined) {
|
||||
data.orderBy = searchData.orderBy
|
||||
}
|
||||
|
||||
if (
|
||||
searchData.orderByField !== null &&
|
||||
searchData.orderByField !== undefined
|
||||
) {
|
||||
data.orderByField = searchData.orderByField
|
||||
}
|
||||
|
||||
isSearching.value = true
|
||||
try {
|
||||
let response = await paymentStore.searchPayment(data)
|
||||
isSearching.value = false
|
||||
|
||||
if (response.data.data) {
|
||||
paymentStore.payments = response.data.data
|
||||
function addScrollListener() {
|
||||
paymentListSection.value.addEventListener('scroll', (ev) => {
|
||||
if (
|
||||
ev.target.scrollTop > 0 &&
|
||||
ev.target.scrollTop + ev.target.clientHeight >
|
||||
ev.target.scrollHeight - 200
|
||||
) {
|
||||
if (currentPageNumber.value < lastPageNumber.value) {
|
||||
loadPayments(++currentPageNumber.value, true)
|
||||
}
|
||||
}
|
||||
} catch (error) {
|
||||
isSearching.value = false
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
async function onSearch() {
|
||||
paymentList.value = []
|
||||
loadPayments()
|
||||
}
|
||||
|
||||
function sortData() {
|
||||
|
||||
@ -1,38 +1,24 @@
|
||||
<script setup>
|
||||
import { useI18n } from 'vue-i18n'
|
||||
import { computed, reactive, ref, watch, inject } from 'vue'
|
||||
import { useRoute, useRouter } from 'vue-router'
|
||||
import { computed, reactive, ref } from 'vue'
|
||||
import { useRoute } from 'vue-router'
|
||||
import { debounce } from 'lodash'
|
||||
|
||||
import { useRecurringInvoiceStore } from '@/scripts/admin/stores/recurring-invoice'
|
||||
import { useModalStore } from '@/scripts/stores/modal'
|
||||
import { useNotificationStore } from '@/scripts/stores/notification'
|
||||
import { useUserStore } from '@/scripts/admin/stores/user'
|
||||
import { useDialogStore } from '@/scripts/stores/dialog'
|
||||
|
||||
import LoadingIcon from '@/scripts/components/icons/LoadingIcon.vue'
|
||||
|
||||
const modalStore = useModalStore()
|
||||
const recurringInvoiceStore = useRecurringInvoiceStore()
|
||||
const notificationStore = useNotificationStore()
|
||||
const userStore = useUserStore()
|
||||
const dialogStore = useDialogStore()
|
||||
|
||||
const { t } = useI18n()
|
||||
const id = ref(null)
|
||||
const count = ref(null)
|
||||
const currency = ref(null)
|
||||
const route = useRoute()
|
||||
const router = useRouter()
|
||||
const status = ref([
|
||||
'DRAFT',
|
||||
'SENT',
|
||||
'VIEWED',
|
||||
'EXPIRED',
|
||||
'ACCEPTED',
|
||||
'REJECTED',
|
||||
])
|
||||
const isSearching = ref(false)
|
||||
const isLoading = ref(false)
|
||||
|
||||
const invoiceList = ref(null)
|
||||
const currentPageNumber = ref(1)
|
||||
const lastPageNumber = ref(1)
|
||||
const invoiceListSection = ref(null)
|
||||
|
||||
const searchData = reactive({
|
||||
orderBy: null,
|
||||
orderByField: null,
|
||||
@ -50,14 +36,61 @@ function hasActiveUrl(id) {
|
||||
return route.params.id == id
|
||||
}
|
||||
|
||||
async function loadRecurringInvoices() {
|
||||
async function loadRecurringInvoices(pageNumber, fromScrollListener = false) {
|
||||
if (isLoading.value) {
|
||||
return
|
||||
}
|
||||
|
||||
let params = {}
|
||||
if (
|
||||
searchData.searchText !== '' &&
|
||||
searchData.searchText !== null &&
|
||||
searchData.searchText !== undefined
|
||||
) {
|
||||
params.search = searchData.searchText
|
||||
}
|
||||
|
||||
if (searchData.orderBy !== null && searchData.orderBy !== undefined) {
|
||||
params.orderBy = searchData.orderBy
|
||||
}
|
||||
|
||||
if (
|
||||
searchData.orderByField !== null &&
|
||||
searchData.orderByField !== undefined
|
||||
) {
|
||||
params.orderByField = searchData.orderByField
|
||||
}
|
||||
|
||||
isLoading.value = true
|
||||
await recurringInvoiceStore.fetchRecurringInvoices()
|
||||
let response = await recurringInvoiceStore.fetchRecurringInvoices({
|
||||
page: pageNumber,
|
||||
...params,
|
||||
})
|
||||
isLoading.value = false
|
||||
|
||||
setTimeout(() => {
|
||||
scrollToRecurringInvoice()
|
||||
}, 500)
|
||||
invoiceList.value = invoiceList.value ? invoiceList.value : []
|
||||
invoiceList.value = [...invoiceList.value, ...response.data.data]
|
||||
|
||||
currentPageNumber.value = pageNumber ? pageNumber : 1
|
||||
lastPageNumber.value = response.data.meta.last_page
|
||||
let invoiceFound = invoiceList.value.find((inv) => inv.id == route.params.id)
|
||||
|
||||
if (
|
||||
fromScrollListener == false &&
|
||||
!invoiceFound &&
|
||||
currentPageNumber.value < lastPageNumber.value &&
|
||||
Object.keys(params).length === 0
|
||||
) {
|
||||
loadRecurringInvoices(++currentPageNumber.value)
|
||||
}
|
||||
|
||||
if (invoiceFound) {
|
||||
setTimeout(() => {
|
||||
if (fromScrollListener == false) {
|
||||
scrollToRecurringInvoice()
|
||||
}
|
||||
}, 500)
|
||||
}
|
||||
}
|
||||
|
||||
function scrollToRecurringInvoice() {
|
||||
@ -65,34 +98,27 @@ function scrollToRecurringInvoice() {
|
||||
if (el) {
|
||||
el.scrollIntoView({ behavior: 'smooth' })
|
||||
el.classList.add('shake')
|
||||
addScrollListener()
|
||||
}
|
||||
}
|
||||
|
||||
async function onSearched() {
|
||||
let data = ''
|
||||
if (
|
||||
searchData.searchText !== '' &&
|
||||
searchData.searchText !== null &&
|
||||
searchData.searchText !== undefined
|
||||
) {
|
||||
data += `search=${searchData.searchText}&`
|
||||
}
|
||||
function addScrollListener() {
|
||||
invoiceListSection.value.addEventListener('scroll', (ev) => {
|
||||
if (
|
||||
ev.target.scrollTop > 0 &&
|
||||
ev.target.scrollTop + ev.target.clientHeight >
|
||||
ev.target.scrollHeight - 200
|
||||
) {
|
||||
if (currentPageNumber.value < lastPageNumber.value) {
|
||||
loadRecurringInvoices(++currentPageNumber.value, true)
|
||||
}
|
||||
}
|
||||
})
|
||||
}
|
||||
|
||||
if (searchData.orderBy !== null && searchData.orderBy !== undefined) {
|
||||
data += `orderBy=${searchData.orderBy}&`
|
||||
}
|
||||
if (
|
||||
searchData.orderByField !== null &&
|
||||
searchData.orderByField !== undefined
|
||||
) {
|
||||
data += `orderByField=${searchData.orderByField}`
|
||||
}
|
||||
isSearching.value = true
|
||||
let response = await recurringInvoiceStore.searchRecurringInvoice(data)
|
||||
isSearching.value = false
|
||||
if (response.data) {
|
||||
recurringInvoiceStore.recurringInvoices = response.data.data
|
||||
}
|
||||
async function onSearched() {
|
||||
invoiceList.value = []
|
||||
loadRecurringInvoices()
|
||||
}
|
||||
|
||||
function sortData() {
|
||||
@ -120,7 +146,7 @@ onSearched = debounce(onSearched, 500)
|
||||
hidden
|
||||
h-full
|
||||
pt-16
|
||||
pb-4
|
||||
pb-[6.4rem]
|
||||
ml-56
|
||||
bg-white
|
||||
xl:ml-64
|
||||
@ -211,21 +237,17 @@ onSearched = debounce(onSearched, 500)
|
||||
</div>
|
||||
|
||||
<div
|
||||
v-if="recurringInvoiceStore && recurringInvoiceStore.recurringInvoices"
|
||||
ref="invoiceListSection"
|
||||
class="
|
||||
h-full
|
||||
pb-32
|
||||
overflow-y-scroll
|
||||
border-l border-gray-200 border-solid
|
||||
base-scroll
|
||||
"
|
||||
>
|
||||
<div
|
||||
v-for="(invoice, index) in recurringInvoiceStore.recurringInvoices"
|
||||
:key="index"
|
||||
>
|
||||
<div v-for="(invoice, index) in invoiceList" :key="index">
|
||||
<router-link
|
||||
v-if="invoice && !isLoading"
|
||||
v-if="invoice"
|
||||
:id="'recurring-invoice-' + invoice.id"
|
||||
:to="`/admin/recurring-invoices/${invoice.id}/view`"
|
||||
:class="[
|
||||
@ -253,7 +275,7 @@ onSearched = debounce(onSearched, 500)
|
||||
truncate
|
||||
"
|
||||
/>
|
||||
|
||||
|
||||
<div
|
||||
class="
|
||||
mt-1
|
||||
@ -305,14 +327,11 @@ onSearched = debounce(onSearched, 500)
|
||||
</div>
|
||||
</router-link>
|
||||
</div>
|
||||
<div class="flex justify-center p-4 items-center">
|
||||
<LoadingIcon
|
||||
v-if="isLoading"
|
||||
class="h-6 m-1 animate-spin text-primary-400"
|
||||
/>
|
||||
<div v-if="isLoading" class="flex justify-center p-4 items-center">
|
||||
<LoadingIcon class="h-6 m-1 animate-spin text-primary-400" />
|
||||
</div>
|
||||
<p
|
||||
v-if="!recurringInvoiceStore.recurringInvoices.length && !isLoading"
|
||||
v-if="!invoiceList?.length && !isLoading"
|
||||
class="flex justify-center px-4 mt-5 text-sm text-gray-600"
|
||||
>
|
||||
{{ $t('invoices.no_matching_invoices') }}
|
||||
|
||||
@ -82,6 +82,13 @@ async function searchCustomers(search) {
|
||||
}
|
||||
|
||||
let res = await customerStore.fetchCustomers(data)
|
||||
if(res.data.data.length>0 && customerStore.editCustomer) {
|
||||
let customerFound = res.data.data.find((c) => c.id==customerStore.editCustomer.id)
|
||||
if(!customerFound) {
|
||||
let edit_customer = Object.assign({}, customerStore.editCustomer)
|
||||
res.data.data.unshift(edit_customer)
|
||||
}
|
||||
}
|
||||
|
||||
return res.data.data
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user