0
0
Fork 0

chore: refs #7353 use Vue component nomenclature

This commit is contained in:
Jorge Penadés 2024-08-22 13:41:53 +02:00
parent 79c96199f3
commit b0c27027c0
6 changed files with 42 additions and 35 deletions

View File

@ -1,26 +1,9 @@
<script setup> <script setup>
import { useI18n } from 'vue-i18n'; import SalesClientTable from './MonitorSaleClients.vue';
import { useStateStore } from 'stores/useStateStore'; import SalesOrdersTable from './MonitorSaleOrders.vue';
import SalesClientTable from './SalesClientsTable.vue';
import SalesOrdersTable from './SalesOrdersTable.vue';
import VnSearchbar from 'components/ui/VnSearchbar.vue';
import VnRow from 'src/components/ui/VnRow.vue'; import VnRow from 'src/components/ui/VnRow.vue';
const { t } = useI18n();
const stateStore = useStateStore();
</script> </script>
<template> <template>
<template v-if="stateStore.isHeaderMounted()">
<Teleport to="#searchbar">
<VnSearchbar
data-key="SalesMonitorTickets"
url="SalesMonitors/salesFilter"
:redirect="false"
:label="t('searchBar.label')"
:info="t('searchBar.info')"
/>
</Teleport>
</template>
<VnRow <VnRow
class="q-pa-md" class="q-pa-md"
:style="{ 'flex-direction': $q.screen.lt.lg ? 'column' : 'row', gap: '0px' }" :style="{ 'flex-direction': $q.screen.lt.lg ? 'column' : 'row', gap: '0px' }"
@ -28,14 +11,14 @@ const stateStore = useStateStore();
<div style="flex: 0.25"> <div style="flex: 0.25">
<span <span
class="q-ml-md text-body1" class="q-ml-md text-body1"
v-text="t('salesMonitor.clientsOnWebsite')" v-text="$t('salesMonitor.clientsOnWebsite')"
/> />
<SalesClientTable /> <SalesClientTable />
</div> </div>
<div style="flex: 0.75"> <div style="flex: 0.75">
<span <span
class="q-ml-md text-body1" class="q-ml-md text-body1"
v-text="t('salesMonitor.recentOrderActions')" v-text="$t('salesMonitor.recentOrderActions')"
/> />
<SalesOrdersTable /> <SalesOrdersTable />
</div> </div>

View File

@ -112,7 +112,6 @@ const columns = computed(() => [
url="SalesMonitors/clientsFilter" url="SalesMonitors/clientsFilter"
search-url="SalesMonitorClients" search-url="SalesMonitorClients"
:order="['dated DESC', 'hour DESC']" :order="['dated DESC', 'hour DESC']"
:limit="6"
:expr-builder="exprBuilder" :expr-builder="exprBuilder"
:filter="filter" :filter="filter"
:offset="50" :offset="50"
@ -122,7 +121,6 @@ const columns = computed(() => [
default-mode="table" default-mode="table"
:disable-option="{ card: true }" :disable-option="{ card: true }"
dense dense
style="max-height: 380px; overflow-y: scroll"
> >
<template #top-left> <template #top-left>
<VnRow> <VnRow>

View File

@ -111,7 +111,6 @@ const openTab = (id) =>
url="SalesMonitors/ordersFilter" url="SalesMonitors/ordersFilter"
search-url="SalesMonitorOrders" search-url="SalesMonitorOrders"
order="date_send DESC" order="date_send DESC"
:limit="6"
:right-search="false" :right-search="false"
:expr-builder="exprBuilder" :expr-builder="exprBuilder"
auto-load auto-load
@ -125,7 +124,6 @@ const openTab = (id) =>
:row-click="({ id }) => openTab(id)" :row-click="({ id }) => openTab(id)"
v-model:selected="selectedRows" v-model:selected="selectedRows"
:disable-option="{ card: true }" :disable-option="{ card: true }"
style="max-height: 380px; overflow-y: scroll"
> >
<template #top-left> <template #top-left>
<QBtn <QBtn

View File

@ -12,9 +12,12 @@ import VnTable from 'components/VnTable/VnTable.vue';
import { useSummaryDialog } from 'src/composables/useSummaryDialog'; import { useSummaryDialog } from 'src/composables/useSummaryDialog';
import { toDateFormat } from 'src/filters/date.js'; import { toDateFormat } from 'src/filters/date.js';
import { toCurrency, dateRange } from 'src/filters'; import { toCurrency, dateRange } from 'src/filters';
import { useStateStore } from 'stores/useStateStore';
import VnSearchbar from 'components/ui/VnSearchbar.vue';
const DEFAULT_AUTO_REFRESH = 2 * 60 * 1000; // 2min in ms const DEFAULT_AUTO_REFRESH = 2 * 60 * 1000; // 2min in ms
const { t } = useI18n(); const { t } = useI18n();
const stateStore = useStateStore();
const autoRefresh = ref(false); const autoRefresh = ref(false);
const tableRef = ref(null); const tableRef = ref(null);
const provinceOpts = ref([]); const provinceOpts = ref([]);
@ -322,6 +325,17 @@ const openTab = (id) =>
auto-load auto-load
@on-fetch="(data) => (zoneOpts = data)" @on-fetch="(data) => (zoneOpts = data)"
/> />
<template v-if="stateStore.isHeaderMounted()">
<Teleport to="#searchbar">
<VnSearchbar
data-key="SalesMonitorTickets"
url="SalesMonitors/salesFilter"
:redirect="false"
:label="$t('searchBar.label')"
:info="$t('searchBar.info')"
/>
</Teleport>
</template>
<VnTable <VnTable
ref="tableRef" ref="tableRef"
data-key="SalesMonitorTickets" data-key="SalesMonitorTickets"
@ -339,11 +353,21 @@ const openTab = (id) =>
:disable-option="{ card: true }" :disable-option="{ card: true }"
> >
<template #top-left> <template #top-left>
<QBtn
icon="refresh"
size="md"
color="primary"
dense
flat
@click="$refs.tableRef.reload()"
/>
<QCheckbox <QCheckbox
v-model="autoRefresh" v-model="autoRefresh"
:label="t('salesTicketsTable.autoRefresh')" :label="$t('salesTicketsTable.autoRefresh')"
@update:model-value="autoRefreshHandler" @update:model-value="autoRefreshHandler"
/> >
<QTooltip>{{ $t('refreshInfo') }}</QTooltip>
</QCheckbox>
</template> </template>
<template #column-totalProblems="{ row }"> <template #column-totalProblems="{ row }">
<QTd class="no-padding" style="max-width: 50px"> <QTd class="no-padding" style="max-width: 50px">
@ -353,7 +377,7 @@ const openTab = (id) =>
color="primary" color="primary"
size="xs" size="xs"
> >
<QTooltip>{{ t('salesTicketsTable.noVerifiedData') }}</QTooltip> <QTooltip>{{ $t('salesTicketsTable.noVerifiedData') }}</QTooltip>
</QIcon> </QIcon>
<QIcon <QIcon
v-if="row.hasTicketRequest" v-if="row.hasTicketRequest"
@ -361,7 +385,7 @@ const openTab = (id) =>
color="primary" color="primary"
size="xs" size="xs"
> >
<QTooltip>{{ t('salesTicketsTable.purchaseRequest') }}</QTooltip> <QTooltip>{{ $t('salesTicketsTable.purchaseRequest') }}</QTooltip>
</QIcon> </QIcon>
<QIcon <QIcon
v-if="row.itemShortage" v-if="row.itemShortage"
@ -369,10 +393,10 @@ const openTab = (id) =>
color="primary" color="primary"
size="xs" size="xs"
> >
<QTooltip>{{ t('salesTicketsTable.notVisible') }}</QTooltip> <QTooltip>{{ $t('salesTicketsTable.notVisible') }}</QTooltip>
</QIcon> </QIcon>
<QIcon v-if="row.isFreezed" name="vn:frozen" color="primary" size="xs"> <QIcon v-if="row.isFreezed" name="vn:frozen" color="primary" size="xs">
<QTooltip>{{ t('salesTicketsTable.clientFrozen') }}</QTooltip> <QTooltip>{{ $t('salesTicketsTable.clientFrozen') }}</QTooltip>
</QIcon> </QIcon>
<QIcon <QIcon
v-if="row.risk" v-if="row.risk"
@ -380,7 +404,9 @@ const openTab = (id) =>
:color="row.hasHighRisk ? 'negative' : 'primary'" :color="row.hasHighRisk ? 'negative' : 'primary'"
size="xs" size="xs"
> >
<QTooltip>{{ t('salesTicketsTable.risk') }}: {{ row.risk }}</QTooltip> <QTooltip
>{{ $t('salesTicketsTable.risk') }}: {{ row.risk }}</QTooltip
>
</QIcon> </QIcon>
<QIcon <QIcon
v-if="row.hasComponentLack" v-if="row.hasComponentLack"
@ -388,7 +414,7 @@ const openTab = (id) =>
color="primary" color="primary"
size="xs" size="xs"
> >
<QTooltip>{{ t('salesTicketsTable.componentLack') }}</QTooltip> <QTooltip>{{ $t('salesTicketsTable.componentLack') }}</QTooltip>
</QIcon> </QIcon>
<QIcon <QIcon
v-if="row.isTooLittle" v-if="row.isTooLittle"
@ -396,7 +422,7 @@ const openTab = (id) =>
color="primary" color="primary"
size="xs" size="xs"
> >
<QTooltip>{{ t('salesTicketsTable.tooLittle') }}</QTooltip> <QTooltip>{{ $t('salesTicketsTable.tooLittle') }}</QTooltip>
</QIcon> </QIcon>
</QTd> </QTd>
</template> </template>
@ -451,7 +477,7 @@ const openTab = (id) =>
<template #column-isFragile="{ row }"> <template #column-isFragile="{ row }">
<QTd class="no-padding"> <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> </QTd>
</template> </template>

View File

@ -44,3 +44,4 @@ salesTicketsTable:
searchBar: searchBar:
label: Search tickets label: Search tickets
info: Search tickets by id or alias info: Search tickets by id or alias
refreshInfo: Toggle auto-refresh every 2 minutes

View File

@ -44,3 +44,4 @@ salesTicketsTable:
searchBar: searchBar:
label: Buscar tickets label: Buscar tickets
info: Buscar tickets por identificador o alias info: Buscar tickets por identificador o alias
refreshInfo: Conmuta el refresco automático cada 2 minutos