Merge branch 'overlap-page' into 'master'

fix : overlap page in view and index pages

See merge request mohit.panjvani/crater-web!1299
This commit is contained in:
Mohit Panjwani
2021-12-01 12:26:50 +00:00
13 changed files with 112 additions and 63 deletions

View File

@ -23,9 +23,11 @@
@click.stop
>
<div class="flex relative justify-between mb-2">
<label class="flex-1 text-base font-medium text-left text-gray-900">
{{ selectedCustomer.name }}
</label>
<BaseText
:text="selectedCustomer.name"
:length="30"
class="flex-1 text-base font-medium text-left text-gray-900"
/>
<div class="flex">
<a
class="
@ -302,8 +304,10 @@
</span>
<div class="flex flex-col justify-center text-left">
<label
<BaseText
v-if="customer.name"
:text="customer.name"
:length="30"
class="
m-0
text-base
@ -311,12 +315,11 @@
leading-tight
cursor-pointer
"
>
{{ customer.name }}
</label>
<label
/>
<BaseText
v-if="customer.contact_name"
:text="customer.contact_name"
:length="30"
class="
m-0
text-sm
@ -324,9 +327,7 @@
text-gray-400
cursor-pointer
"
>
{{ customer.contact_name }}
</label>
/>
</div>
</li>
<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

@ -149,14 +149,19 @@
</template>
<template #cell-name="{ row }">
<router-link
:to="{ path: `customers/${row.data.id}/view` }"
<router-link :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"
>
{{ row.data.name }}
<span class="text-xs text-gray-400">
{{ 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>
</template>

View File

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

View File

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

View File

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

View File

@ -186,7 +186,10 @@
</template>
<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 #cell-notes="{ row }">

View File

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

View File

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

View File

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

View File

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

View File

@ -198,19 +198,24 @@
<!-- Customer -->
<template #cell-customer="{ row }">
<router-link
:to="{ path: `recurring-invoices/${row.data.id}/view` }"
<router-link :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"
>
{{ row.data.customer.name }}
/>
<span class="text-xs text-gray-400">
{{
<BaseText
:text="
row.data.customer.contact_name
? row.data.customer.contact_name
: ''
}}
</span>
"
:length="30"
tag="span"
class="text-xs text-gray-400"
/>
</router-link>
</template>

View File

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