fix : overlap page in view and index pages

This commit is contained in:
Yash
2021-12-01 16:04:55 +05:30
parent f57fa41640
commit e16e4c6d52
13 changed files with 108 additions and 54 deletions

View File

@ -302,8 +302,10 @@
</span> </span>
<div class="flex flex-col justify-center text-left"> <div class="flex flex-col justify-center text-left">
<label <BaseText
v-if="customer.name" v-if="customer.name"
:text="customer.name"
:length="30"
class=" class="
m-0 m-0
text-base text-base
@ -311,12 +313,11 @@
leading-tight leading-tight
cursor-pointer cursor-pointer
" "
> />
{{ customer.name }} <BaseText
</label>
<label
v-if="customer.contact_name" v-if="customer.contact_name"
:text="customer.contact_name"
:length="30"
class=" class="
m-0 m-0
text-sm text-sm
@ -324,9 +325,7 @@
text-gray-400 text-gray-400
cursor-pointer cursor-pointer
" "
> />
{{ customer.contact_name }}
</label>
</div> </div>
</li> </li>
<div <div

View File

@ -0,0 +1,31 @@
<template>
<BaseCustomTag :tag="tag" :title="text">
{{ displayText }}
</BaseCustomTag>
</template>
<script setup>
import { computed } from "vue"
const props = defineProps({
tag: {
type: String,
default: 'div',
},
text: {
type: String,
default: '',
},
length: {
type: Number,
default: 0,
}
})
const displayText = computed(() => {
return props.text.length < props.length ? props.text : `${props.text.substring(0 , props.length)}...`
})
</script>

View File

@ -151,12 +151,21 @@
<template #cell-name="{ row }"> <template #cell-name="{ row }">
<router-link <router-link
:to="{ path: `customers/${row.data.id}/view` }" :to="{ path: `customers/${row.data.id}/view` }"
>
<BaseText
:text="row.data.name"
:length="30"
tag="span"
class="font-medium text-primary-500 flex flex-col" class="font-medium text-primary-500 flex flex-col"
> >
{{ row.data.name }} {{ row.data.name }}
<span class="text-xs text-gray-400"> </BaseText>
{{ row.data.contact_name ? row.data.contact_name : '' }}</span <BaseText
> :text="row.data.contact_name ? row.data.contact_name : ''"
:length="30"
tag="span"
class="text-xs text-gray-400"
/>
</router-link> </router-link>
</template> </template>

View File

@ -131,7 +131,9 @@
style="border-top: 1px solid rgba(185, 193, 209, 0.41)" style="border-top: 1px solid rgba(185, 193, 209, 0.41)"
> >
<div> <div>
<div <BaseText
:text="customer.name"
:length="30"
class=" class="
pr-2 pr-2
text-sm text-sm
@ -142,11 +144,12 @@
capitalize capitalize
truncate truncate
" "
> />
{{ customer.name }}
</div> <BaseText
<div
v-if="customer.contact_name" v-if="customer.contact_name"
:text="customer.contact_name"
:length="30"
class=" class="
mt-1 mt-1
text-xs text-xs
@ -155,9 +158,7 @@
leading-5 leading-5
text-gray-600 text-gray-600
" "
> />
{{ customer.contact_name }}
</div>
</div> </div>
<div class="flex-1 font-bold text-right whitespace-nowrap"> <div class="flex-1 font-bold text-right whitespace-nowrap">
<BaseFormatMoney <BaseFormatMoney

View File

@ -197,9 +197,10 @@
</template> </template>
<template #cell-name="{ row }"> <template #cell-name="{ row }">
<div> <BaseText
{{ row.data.customer.name }} :text="row.data.customer.name"
</div> :length="30"
/>
</template> </template>
<template #cell-status="{ row }"> <template #cell-status="{ row }">

View File

@ -180,7 +180,9 @@
style="border-bottom: 1px solid rgba(185, 193, 209, 0.41)" style="border-bottom: 1px solid rgba(185, 193, 209, 0.41)"
> >
<div class="flex-2"> <div class="flex-2">
<div <BaseText
:text="estimate.customer.name"
:length="30"
class=" class="
pr-2 pr-2
mb-2 mb-2
@ -192,10 +194,8 @@
capitalize capitalize
truncate truncate
" "
> />
{{ estimate.customer.name }}
</div>
<div <div
class=" class="
mt-1 mt-1

View File

@ -186,7 +186,10 @@
</template> </template>
<template #cell-user_name="{ row }"> <template #cell-user_name="{ row }">
{{ row.data.customer ? row.data.customer.name : '-' }} <BaseText
:text="row.data.customer ? row.data.customer.name : '-' "
:length="30"
/>
</template> </template>
<template #cell-notes="{ row }"> <template #cell-notes="{ row }">

View File

@ -179,7 +179,10 @@
</template> </template>
<template #cell-name="{ row }"> <template #cell-name="{ row }">
{{ row.data.customer.name }} <BaseText
:text="row.data.customer.name"
:length="30"
/>
</template> </template>
<!-- Invoice Number --> <!-- Invoice Number -->

View File

@ -381,7 +381,9 @@ onSearched = debounce(onSearched, 500)
style="border-bottom: 1px solid rgba(185, 193, 209, 0.41)" style="border-bottom: 1px solid rgba(185, 193, 209, 0.41)"
> >
<div class="flex-2"> <div class="flex-2">
<div <BaseText
:text="invoice.customer.name"
:length="30"
class=" class="
pr-2 pr-2
mb-2 mb-2
@ -393,9 +395,7 @@ onSearched = debounce(onSearched, 500)
capitalize capitalize
truncate truncate
" "
> />
{{ invoice.customer.name }}
</div>
<div <div
class=" class="

View File

@ -161,9 +161,11 @@
</template> </template>
<template #cell-name="{ row }"> <template #cell-name="{ row }">
<span> <BaseText
{{ row.data.customer.name }} :text="row.data.customer.name"
</span> :length="30"
tag="span"
/>
</template> </template>
<template #cell-payment_mode="{ row }"> <template #cell-payment_mode="{ row }">

View File

@ -162,7 +162,9 @@
style="border-bottom: 1px solid rgba(185, 193, 209, 0.41)" style="border-bottom: 1px solid rgba(185, 193, 209, 0.41)"
> >
<div class="flex-2"> <div class="flex-2">
<div <BaseText
:text="payment?.customer?.name "
:length="30"
class=" class="
pr-2 pr-2
mb-2 mb-2
@ -174,9 +176,7 @@
capitalize capitalize
truncate truncate
" "
> />
{{ payment?.customer?.name }}
</div>
<div <div
class=" class="

View File

@ -196,17 +196,22 @@
<template #cell-customer="{ row }"> <template #cell-customer="{ row }">
<router-link <router-link
:to="{ path: `recurring-invoices/${row.data.id}/view` }" :to="{ path: `recurring-invoices/${row.data.id}/view` }"
>
<BaseText
:text="row.data.customer.name"
:length="30"
tag="span"
class="font-medium text-primary-500 flex flex-col" class="font-medium text-primary-500 flex flex-col"
> >
{{ row.data.customer.name }} {{ row.data.customer.name }}
</BaseText>
<span class="text-xs text-gray-400">
{{ <BaseText
row.data.customer.contact_name :text="row.data.customer.contact_name ? row.data.customer.contact_name: ''"
? row.data.customer.contact_name :length="30"
: '' tag="span"
}} class="text-xs text-gray-400"
</span> />
</router-link> </router-link>
</template> </template>

View File

@ -238,7 +238,9 @@ onSearched = debounce(onSearched, 500)
style="border-bottom: 1px solid rgba(185, 193, 209, 0.41)" style="border-bottom: 1px solid rgba(185, 193, 209, 0.41)"
> >
<div class="flex-2"> <div class="flex-2">
<div <BaseText
:text="invoice.customer.name"
:length="30"
class=" class="
pr-2 pr-2
mb-2 mb-2
@ -250,10 +252,8 @@ onSearched = debounce(onSearched, 500)
capitalize capitalize
truncate truncate
" "
> />
{{ invoice.customer.name }}
</div>
<div <div
class=" class="
mt-1 mt-1