Merge pull request 'fix: refs #7353 horizontal scroll' (!735) from 7353-hotfix-fixUI into master
gitea/salix-front/pipeline/head This commit looks good
Details
gitea/salix-front/pipeline/head This commit looks good
Details
Reviewed-on: #735 Reviewed-by: Javier Segarra <jsegarra@verdnatura.es>
This commit is contained in:
commit
e8beebff32
|
@ -415,7 +415,7 @@ function handleOnDataSaved(_, res) {
|
||||||
<QBtn
|
<QBtn
|
||||||
v-if="$props.rightSearch"
|
v-if="$props.rightSearch"
|
||||||
icon="filter_alt"
|
icon="filter_alt"
|
||||||
class="bg-vn-section-color q-ml-md"
|
class="bg-vn-section-color q-ml-sm"
|
||||||
dense
|
dense
|
||||||
@click="stateStore.toggleRightDrawer()"
|
@click="stateStore.toggleRightDrawer()"
|
||||||
/>
|
/>
|
||||||
|
@ -502,8 +502,9 @@ function handleOnDataSaved(_, res) {
|
||||||
:key="index"
|
:key="index"
|
||||||
:title="btn.title"
|
:title="btn.title"
|
||||||
:icon="btn.icon"
|
:icon="btn.icon"
|
||||||
class="q-px-sm"
|
class="q-pa-xs"
|
||||||
flat
|
flat
|
||||||
|
dense
|
||||||
:class="
|
:class="
|
||||||
btn.isPrimary ? 'text-primary-light' : 'color-vn-text '
|
btn.isPrimary ? 'text-primary-light' : 'color-vn-text '
|
||||||
"
|
"
|
||||||
|
@ -745,10 +746,16 @@ es:
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.q-table th {
|
.q-table {
|
||||||
padding: 0;
|
th {
|
||||||
}
|
padding: 0;
|
||||||
|
}
|
||||||
|
|
||||||
|
&__top {
|
||||||
|
padding: 12px 0px;
|
||||||
|
top: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
.vnTable {
|
.vnTable {
|
||||||
thead tr th {
|
thead tr th {
|
||||||
position: sticky;
|
position: sticky;
|
||||||
|
@ -757,9 +764,6 @@ es:
|
||||||
thead tr:first-child th {
|
thead tr:first-child th {
|
||||||
top: 0;
|
top: 0;
|
||||||
}
|
}
|
||||||
.q-table__top {
|
|
||||||
top: 0;
|
|
||||||
}
|
|
||||||
tbody {
|
tbody {
|
||||||
.q-checkbox {
|
.q-checkbox {
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|
|
@ -135,7 +135,7 @@ onMounted(async () => {
|
||||||
});
|
});
|
||||||
</script>
|
</script>
|
||||||
<template>
|
<template>
|
||||||
<QBtn icon="vn:visible_columns" class="bg-vn-section-color q-mr-md q-px-sm" dense>
|
<QBtn icon="vn:visible_columns" class="bg-vn-section-color q-mr-sm q-px-sm" dense>
|
||||||
<QPopupProxy ref="popupProxyRef">
|
<QPopupProxy ref="popupProxyRef">
|
||||||
<QCard class="column q-pa-md">
|
<QCard class="column q-pa-md">
|
||||||
<QIcon name="info" size="sm" class="info-icon">
|
<QIcon name="info" size="sm" class="info-icon">
|
||||||
|
|
|
@ -139,7 +139,11 @@ const columns = computed(() => [
|
||||||
</VnTable>
|
</VnTable>
|
||||||
</template>
|
</template>
|
||||||
<style lang="scss" scoped>
|
<style lang="scss" scoped>
|
||||||
.full-width .vn-row > * {
|
.full-width .vn-row {
|
||||||
flex: 0.4;
|
margin-bottom: 0;
|
||||||
|
flex-direction: row;
|
||||||
|
> * {
|
||||||
|
max-width: 125px;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
</style>
|
</style>
|
||||||
|
|
|
@ -132,7 +132,6 @@ const openTab = (id) =>
|
||||||
:table="{
|
:table="{
|
||||||
'row-key': 'id',
|
'row-key': 'id',
|
||||||
selection: 'multiple',
|
selection: 'multiple',
|
||||||
'hide-bottom': true,
|
|
||||||
}"
|
}"
|
||||||
default-mode="table"
|
default-mode="table"
|
||||||
:row-click="({ id }) => openTab(id)"
|
:row-click="({ id }) => openTab(id)"
|
||||||
|
|
|
@ -54,7 +54,6 @@ const columns = computed(() => [
|
||||||
label: t('salesTicketsTable.problems'),
|
label: t('salesTicketsTable.problems'),
|
||||||
name: 'totalProblems',
|
name: 'totalProblems',
|
||||||
align: 'left',
|
align: 'left',
|
||||||
|
|
||||||
columnFilter: false,
|
columnFilter: false,
|
||||||
attrs: {
|
attrs: {
|
||||||
dense: true,
|
dense: true,
|
||||||
|
@ -65,7 +64,6 @@ const columns = computed(() => [
|
||||||
name: 'id',
|
name: 'id',
|
||||||
field: 'id',
|
field: 'id',
|
||||||
align: 'left',
|
align: 'left',
|
||||||
|
|
||||||
columnFilter: {
|
columnFilter: {
|
||||||
component: 'number',
|
component: 'number',
|
||||||
name: 'id',
|
name: 'id',
|
||||||
|
@ -108,9 +106,7 @@ const columns = computed(() => [
|
||||||
{
|
{
|
||||||
label: t('salesTicketsTable.date'),
|
label: t('salesTicketsTable.date'),
|
||||||
name: 'shippedDate',
|
name: 'shippedDate',
|
||||||
style: { 'max-width': '100px' },
|
|
||||||
align: 'left',
|
align: 'left',
|
||||||
|
|
||||||
columnFilter: {
|
columnFilter: {
|
||||||
component: 'date',
|
component: 'date',
|
||||||
name: 'shippedDate',
|
name: 'shippedDate',
|
||||||
|
@ -164,7 +160,6 @@ const columns = computed(() => [
|
||||||
label: t('salesTicketsTable.state'),
|
label: t('salesTicketsTable.state'),
|
||||||
name: 'state',
|
name: 'state',
|
||||||
align: 'left',
|
align: 'left',
|
||||||
style: { 'max-width': '100px' },
|
|
||||||
columnFilter: {
|
columnFilter: {
|
||||||
component: 'select',
|
component: 'select',
|
||||||
name: 'stateFk',
|
name: 'stateFk',
|
||||||
|
@ -193,7 +188,6 @@ const columns = computed(() => [
|
||||||
label: t('salesTicketsTable.zone'),
|
label: t('salesTicketsTable.zone'),
|
||||||
name: 'zoneFk',
|
name: 'zoneFk',
|
||||||
align: 'left',
|
align: 'left',
|
||||||
|
|
||||||
columnFilter: {
|
columnFilter: {
|
||||||
component: 'select',
|
component: 'select',
|
||||||
name: 'zoneFk',
|
name: 'zoneFk',
|
||||||
|
@ -210,8 +204,6 @@ const columns = computed(() => [
|
||||||
name: 'totalWithVat',
|
name: 'totalWithVat',
|
||||||
field: 'totalWithVat',
|
field: 'totalWithVat',
|
||||||
align: 'left',
|
align: 'left',
|
||||||
style: { 'max-width': '75px' },
|
|
||||||
|
|
||||||
columnFilter: {
|
columnFilter: {
|
||||||
component: 'number',
|
component: 'number',
|
||||||
name: 'totalWithVat',
|
name: 'totalWithVat',
|
||||||
|
@ -370,7 +362,7 @@ const openTab = (id) =>
|
||||||
</QCheckbox>
|
</QCheckbox>
|
||||||
</template>
|
</template>
|
||||||
<template #column-totalProblems="{ row }">
|
<template #column-totalProblems="{ row }">
|
||||||
<QTd class="no-padding" style="max-width: 60px">
|
<span>
|
||||||
<QIcon
|
<QIcon
|
||||||
v-if="row.isTaxDataChecked === 0"
|
v-if="row.isTaxDataChecked === 0"
|
||||||
name="vn:no036"
|
name="vn:no036"
|
||||||
|
@ -424,46 +416,40 @@ const openTab = (id) =>
|
||||||
>
|
>
|
||||||
<QTooltip>{{ $t('salesTicketsTable.tooLittle') }}</QTooltip>
|
<QTooltip>{{ $t('salesTicketsTable.tooLittle') }}</QTooltip>
|
||||||
</QIcon>
|
</QIcon>
|
||||||
</QTd>
|
</span>
|
||||||
</template>
|
</template>
|
||||||
<template #column-id="{ row }">
|
<template #column-id="{ row }">
|
||||||
<QTd class="no-padding">
|
<span class="link" @click.stop.prevent>
|
||||||
<span class="link" @click.stop.prevent>
|
{{ row.id }}
|
||||||
{{ row.id }}
|
<TicketDescriptorProxy :id="row.id" />
|
||||||
<TicketDescriptorProxy :id="row.id" />
|
</span>
|
||||||
</span>
|
|
||||||
</QTd>
|
|
||||||
</template>
|
</template>
|
||||||
<template #column-clientFk="{ row }">
|
<template #column-clientFk="{ row }">
|
||||||
<QTd class="no-padding" @click.stop :title="row.nickname">
|
<div @click.stop :title="row.nickname">
|
||||||
<span class="link">{{ row.nickname }}</span>
|
<span class="link" v-text="row.nickname" />
|
||||||
<CustomerDescriptorProxy :id="row.clientFk" />
|
<CustomerDescriptorProxy :id="row.clientFk" />
|
||||||
</QTd>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<template #column-salesPersonFk="{ row }">
|
<template #column-salesPersonFk="{ row }">
|
||||||
<QTd class="no-padding" @click.stop :title="row.userName">
|
<div @click.stop :title="row.userName">
|
||||||
<span class="link" v-text="dashIfEmpty(row.userName)" />
|
<span class="link" v-text="dashIfEmpty(row.userName)" />
|
||||||
<WorkerDescriptorProxy :id="row.salesPersonFk" />
|
<WorkerDescriptorProxy :id="row.salesPersonFk" />
|
||||||
</QTd>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<template #column-shippedDate="{ row }">
|
<template #column-shippedDate="{ row }">
|
||||||
<QTd class="no-padding">
|
<QBadge
|
||||||
<QBadge
|
v-bind="getBadgeAttrs(row.shippedDate)"
|
||||||
v-bind="getBadgeAttrs(row.shippedDate)"
|
class="q-pa-sm"
|
||||||
class="q-pa-sm"
|
style="font-size: 14px"
|
||||||
style="font-size: 14px"
|
>
|
||||||
>
|
{{ formatShippedDate(row.shippedDate) }}
|
||||||
{{ formatShippedDate(row.shippedDate) }}
|
</QBadge>
|
||||||
</QBadge>
|
|
||||||
</QTd>
|
|
||||||
</template>
|
</template>
|
||||||
<template #column-provinceFk="{ row }">
|
<template #column-provinceFk="{ row }">
|
||||||
<QTd class="no-padding">
|
<span :title="row.province" v-text="row.province" />
|
||||||
<span :title="row.province" v-text="row.province" />
|
|
||||||
</QTd>
|
|
||||||
</template>
|
</template>
|
||||||
<template #column-state="{ row }">
|
<template #column-state="{ row }">
|
||||||
<QTd class="no-padding" @click.stop.prevent>
|
<div @click.stop.prevent>
|
||||||
<div v-if="row.refFk">
|
<div v-if="row.refFk">
|
||||||
<span class="link">{{ row.refFk }}</span>
|
<span class="link">{{ row.refFk }}</span>
|
||||||
<InvoiceOutDescriptorProxy :id="row.invoiceOutId" />
|
<InvoiceOutDescriptorProxy :id="row.invoiceOutId" />
|
||||||
|
@ -477,32 +463,33 @@ const openTab = (id) =>
|
||||||
>
|
>
|
||||||
{{ row.state }}
|
{{ row.state }}
|
||||||
</QBadge>
|
</QBadge>
|
||||||
</QTd>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<template #column-isFragile="{ row }">
|
<template #column-isFragile="{ row }">
|
||||||
<QTd class="no-padding">
|
<QIcon v-if="row.isFragile" name="local_bar" color="primary" size="sm">
|
||||||
<QIcon v-if="row.isFragile" name="local_bar" color="primary" size="sm">
|
<QTooltip>{{ $t('salesTicketsTable.isFragile') }}</QTooltip>
|
||||||
<QTooltip>{{ $t('salesTicketsTable.isFragile') }}</QTooltip>
|
</QIcon>
|
||||||
</QIcon>
|
|
||||||
</QTd>
|
|
||||||
</template>
|
</template>
|
||||||
<template #column-zoneFk="{ row }">
|
<template #column-zoneFk="{ row }">
|
||||||
<QTd class="no-padding" @click.stop.prevent :title="row.zoneName">
|
<div @click.stop.prevent :title="row.zoneName">
|
||||||
<span class="link">{{ row.zoneName }}</span>
|
<span class="link">{{ row.zoneName }}</span>
|
||||||
<ZoneDescriptorProxy :id="row.zoneFk" />
|
<ZoneDescriptorProxy :id="row.zoneFk" />
|
||||||
</QTd>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
<template #column-totalWithVat="{ row }">
|
<template #column-totalWithVat="{ row }">
|
||||||
<QTd class="no-padding">
|
<QBadge
|
||||||
<QBadge
|
:color="totalPriceColor(row) || 'transparent'"
|
||||||
:color="totalPriceColor(row) || 'transparent'"
|
:text-color="totalPriceColor(row) ? 'black' : 'white'"
|
||||||
:text-color="totalPriceColor(row) ? 'black' : 'white'"
|
class="q-pa-sm"
|
||||||
class="q-pa-sm"
|
style="font-size: 14px"
|
||||||
style="font-size: 14px"
|
>
|
||||||
>
|
{{ toCurrency(row.totalWithVat) }}
|
||||||
{{ toCurrency(row.totalWithVat) }}
|
</QBadge>
|
||||||
</QBadge>
|
|
||||||
</QTd>
|
|
||||||
</template>
|
</template>
|
||||||
</VnTable>
|
</VnTable>
|
||||||
</template>
|
</template>
|
||||||
|
<style lang="scss" scoped>
|
||||||
|
td .q-icon {
|
||||||
|
margin: 0 2px;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
Loading…
Reference in New Issue