feat: add page breadcrumb
parent
bf864b9b3c
commit
fb3a7f1b97
|
|
@ -14,7 +14,7 @@ export default [
|
||||||
icon: { icon: 'tabler-topology-bus' },
|
icon: { icon: 'tabler-topology-bus' },
|
||||||
children: [
|
children: [
|
||||||
{
|
{
|
||||||
title: 'BL not sent',
|
title: 'BL not sent list',
|
||||||
to: { name: 'flux-bl-not-sent' },
|
to: { name: 'flux-bl-not-sent' },
|
||||||
icon: { icon: 'tabler-unlink' },
|
icon: { icon: 'tabler-unlink' },
|
||||||
},
|
},
|
||||||
|
|
|
||||||
|
|
@ -14,7 +14,7 @@ export default [
|
||||||
icon: { icon: 'tabler-topology-bus' },
|
icon: { icon: 'tabler-topology-bus' },
|
||||||
children: [
|
children: [
|
||||||
{
|
{
|
||||||
title: 'BL not sent',
|
title: 'BL not sent list',
|
||||||
to: { name: 'flux-bl-not-sent' },
|
to: { name: 'flux-bl-not-sent' },
|
||||||
icon: { icon: 'tabler-unlink' },
|
icon: { icon: 'tabler-unlink' },
|
||||||
},
|
},
|
||||||
|
|
|
||||||
|
|
@ -147,155 +147,164 @@ const exportEXCEL = () => {
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
|
<VBreadcrumbs
|
||||||
|
class="px-0 py-2"
|
||||||
|
:items="[
|
||||||
|
{ title: t('Home'), to: { name: 'root' } },
|
||||||
|
{ title: t('BL not sent list') },
|
||||||
|
]"
|
||||||
|
/>
|
||||||
<div>
|
<div>
|
||||||
<!-- 👉 Statistics Widgets -->
|
<div>
|
||||||
<VCard class="mb-6">
|
<!-- 👉 Statistics Widgets -->
|
||||||
<VCardText>
|
<VCard class="mb-6">
|
||||||
<VRow>
|
<VCardText>
|
||||||
<template
|
<VRow>
|
||||||
v-for="(data, id) in widgetData"
|
<template
|
||||||
:key="id"
|
v-for="(data, id) in widgetData"
|
||||||
>
|
:key="id"
|
||||||
|
>
|
||||||
|
<VCol
|
||||||
|
cols="12"
|
||||||
|
sm="6"
|
||||||
|
md="3"
|
||||||
|
class="px-6"
|
||||||
|
>
|
||||||
|
<div class="d-flex justify-space-between">
|
||||||
|
<div class="d-flex flex-column gap-y-1">
|
||||||
|
<h4
|
||||||
|
class="text-h4 text-high-emphasis"
|
||||||
|
:class="{ 'text-error': id === 3 }"
|
||||||
|
>
|
||||||
|
{{ data.value }}
|
||||||
|
</h4>
|
||||||
|
<div class="text-body-1 text-capitalize">
|
||||||
|
{{ data.title }}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<VAvatar
|
||||||
|
color="rgba(var(--v-theme-on-background), var(--v-hover-opacity))"
|
||||||
|
rounded
|
||||||
|
class="text-high-emphasis"
|
||||||
|
size="38"
|
||||||
|
>
|
||||||
|
<VIcon
|
||||||
|
:icon="data.icon"
|
||||||
|
size="26"
|
||||||
|
/>
|
||||||
|
</VAvatar>
|
||||||
|
</div>
|
||||||
|
</VCol>
|
||||||
|
<VDivider
|
||||||
|
v-if="$vuetify.display.mdAndUp ? id !== widgetData.length - 1
|
||||||
|
: $vuetify.display.smAndUp ? id % 2 === 0
|
||||||
|
: false"
|
||||||
|
vertical
|
||||||
|
inset
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
</VRow>
|
||||||
|
</VCardText>
|
||||||
|
</VCard>
|
||||||
|
|
||||||
|
<VCard
|
||||||
|
:title="$t('Filters')"
|
||||||
|
class="mb-6"
|
||||||
|
>
|
||||||
|
<VCardText>
|
||||||
|
<VRow>
|
||||||
|
<!-- 👉 Select distributor -->
|
||||||
<VCol
|
<VCol
|
||||||
cols="12"
|
cols="12"
|
||||||
sm="6"
|
sm="4"
|
||||||
md="3"
|
|
||||||
class="px-6"
|
|
||||||
>
|
>
|
||||||
<div class="d-flex justify-space-between">
|
<AppSelect
|
||||||
<div class="d-flex flex-column gap-y-1">
|
v-model="selectedDistributor"
|
||||||
<h4
|
:placeholder="$t('Distributor')"
|
||||||
class="text-h4 text-high-emphasis"
|
:items="distributor"
|
||||||
:class="{ 'text-error': id === 3 }"
|
clearable
|
||||||
>
|
clear-icon="tabler-x"
|
||||||
{{ data.value }}
|
/>
|
||||||
</h4>
|
|
||||||
<div class="text-body-1 text-capitalize">
|
|
||||||
{{ data.title }}
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<VAvatar
|
|
||||||
color="rgba(var(--v-theme-on-background), var(--v-hover-opacity))"
|
|
||||||
rounded
|
|
||||||
class="text-high-emphasis"
|
|
||||||
size="38"
|
|
||||||
>
|
|
||||||
<VIcon
|
|
||||||
:icon="data.icon"
|
|
||||||
size="26"
|
|
||||||
/>
|
|
||||||
</VAvatar>
|
|
||||||
</div>
|
|
||||||
</VCol>
|
</VCol>
|
||||||
<VDivider
|
|
||||||
v-if="$vuetify.display.mdAndUp ? id !== widgetData.length - 1
|
|
||||||
: $vuetify.display.smAndUp ? id % 2 === 0
|
|
||||||
: false"
|
|
||||||
vertical
|
|
||||||
inset
|
|
||||||
/>
|
|
||||||
</template>
|
|
||||||
</VRow>
|
|
||||||
</VCardText>
|
|
||||||
</VCard>
|
|
||||||
|
|
||||||
<VCard
|
<!-- 👉 Select store -->
|
||||||
:title="$t('Filters')"
|
<VCol
|
||||||
class="mb-6"
|
cols="12"
|
||||||
>
|
sm="4"
|
||||||
<VCardText>
|
>
|
||||||
<VRow>
|
<AppSelect
|
||||||
<!-- 👉 Select distributor -->
|
v-model="selectedStore"
|
||||||
<VCol
|
:placeholder="$t('Store')"
|
||||||
cols="12"
|
:items="store"
|
||||||
sm="4"
|
clearable
|
||||||
>
|
clear-icon="tabler-x"
|
||||||
<AppSelect
|
/>
|
||||||
v-model="selectedDistributor"
|
</VCol>
|
||||||
:placeholder="$t('Distributor')"
|
|
||||||
:items="distributor"
|
|
||||||
clearable
|
|
||||||
clear-icon="tabler-x"
|
|
||||||
/>
|
|
||||||
</VCol>
|
|
||||||
|
|
||||||
<!-- 👉 Select store -->
|
<!-- 👉 Select Reference R -->
|
||||||
<VCol
|
<VCol
|
||||||
cols="12"
|
cols="12"
|
||||||
sm="4"
|
sm="4"
|
||||||
>
|
>
|
||||||
<AppSelect
|
<AppSelect
|
||||||
v-model="selectedStore"
|
v-model="selectedRefr"
|
||||||
:placeholder="$t('Store')"
|
:placeholder="$t('Item')"
|
||||||
:items="store"
|
:items="filterRefr"
|
||||||
clearable
|
clearable
|
||||||
clear-icon="tabler-x"
|
clear-icon="tabler-x"
|
||||||
/>
|
/>
|
||||||
</VCol>
|
</VCol>
|
||||||
|
</VRow>
|
||||||
|
</VCardText>
|
||||||
|
</VCard>
|
||||||
|
|
||||||
<!-- 👉 Select Reference R -->
|
<!-- 👉 BL not sent -->
|
||||||
<VCol
|
<VCard
|
||||||
cols="12"
|
:title="$t('BL not sent list')"
|
||||||
sm="4"
|
class="mb-6"
|
||||||
>
|
>
|
||||||
<AppSelect
|
<div class="d-flex flex-wrap gap-4 mx-5">
|
||||||
v-model="selectedRefr"
|
<div class="d-flex align-center">
|
||||||
:placeholder="$t('Item')"
|
<!-- 👉 Search -->
|
||||||
:items="filterRefr"
|
<AppTextField
|
||||||
clearable
|
v-model="searchQuery"
|
||||||
clear-icon="tabler-x"
|
:placeholder="$t('Search')"
|
||||||
|
density="compact"
|
||||||
|
style="inline-size: 200px;"
|
||||||
|
class="me-3"
|
||||||
/>
|
/>
|
||||||
</VCol>
|
</div>
|
||||||
</VRow>
|
|
||||||
</VCardText>
|
|
||||||
</VCard>
|
|
||||||
|
|
||||||
<!-- 👉 BL not sent -->
|
<VSpacer />
|
||||||
<VCard
|
|
||||||
:title="$t('BL not sent list')"
|
<div class="d-flex gap-4 flex-wrap align-center">
|
||||||
class="mb-6"
|
<!-- 👉 Export button -->
|
||||||
>
|
<VBtn
|
||||||
<div class="d-flex flex-wrap gap-4 mx-5">
|
variant="tonal"
|
||||||
<div class="d-flex align-center">
|
color="primary"
|
||||||
<!-- 👉 Search -->
|
prepend-icon="tabler-upload"
|
||||||
<AppTextField
|
@click="exportEXCEL"
|
||||||
v-model="searchQuery"
|
>
|
||||||
:placeholder="$t('Search')"
|
Export
|
||||||
density="compact"
|
</VBtn>
|
||||||
style="inline-size: 200px;"
|
</div>
|
||||||
class="me-3"
|
</div>
|
||||||
|
|
||||||
|
<VDivider class="mt-4" />
|
||||||
|
|
||||||
|
<VCol cols="12">
|
||||||
|
<!-- 👉 Datatable -->
|
||||||
|
<VDataTable
|
||||||
|
class="dt-row-striped"
|
||||||
|
:headers="headers"
|
||||||
|
:items="filteredData"
|
||||||
|
:items-per-page="options.itemsPerPage"
|
||||||
|
:page="options.page"
|
||||||
|
:options="options"
|
||||||
/>
|
/>
|
||||||
</div>
|
</VCol>
|
||||||
|
</Vcard>
|
||||||
<VSpacer />
|
</div>
|
||||||
|
|
||||||
<div class="d-flex gap-4 flex-wrap align-center">
|
|
||||||
<!-- 👉 Export button -->
|
|
||||||
<VBtn
|
|
||||||
variant="tonal"
|
|
||||||
color="primary"
|
|
||||||
prepend-icon="tabler-upload"
|
|
||||||
@click="exportEXCEL"
|
|
||||||
>
|
|
||||||
Export
|
|
||||||
</VBtn>
|
|
||||||
</div>
|
|
||||||
</div>
|
|
||||||
|
|
||||||
<VDivider class="mt-4" />
|
|
||||||
|
|
||||||
<VCol cols="12">
|
|
||||||
<!-- 👉 Datatable -->
|
|
||||||
<VDataTable
|
|
||||||
class="dt-row-striped"
|
|
||||||
:headers="headers"
|
|
||||||
:items="filteredData"
|
|
||||||
:items-per-page="options.itemsPerPage"
|
|
||||||
:page="options.page"
|
|
||||||
:options="options"
|
|
||||||
/>
|
|
||||||
</VCol>
|
|
||||||
</Vcard>
|
|
||||||
</div>
|
</div>
|
||||||
</template>
|
</template>
|
||||||
|
|
|
||||||
|
|
@ -25,6 +25,14 @@ const { data: storeData } = await useApi<any>(`/stores/${route.query.storeId}/de
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
|
<VBreadcrumbs
|
||||||
|
class="px-0 py-2"
|
||||||
|
:items="[
|
||||||
|
{ title: t('Home'), to: { name: 'root' } },
|
||||||
|
{ title: t('List of stores'), to: { name: 'store-list' } },
|
||||||
|
{ title: t('Store visualization') },
|
||||||
|
]"
|
||||||
|
/>
|
||||||
<div>
|
<div>
|
||||||
<StoreHeader
|
<StoreHeader
|
||||||
class="mb-5"
|
class="mb-5"
|
||||||
|
|
|
||||||
|
|
@ -124,6 +124,13 @@ const reloadStores = async () => {
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
|
<VBreadcrumbs
|
||||||
|
class="px-0 py-2"
|
||||||
|
:items="[
|
||||||
|
{ title: t('Home'), to: { name: 'root' } },
|
||||||
|
{ title: t('List of stores') },
|
||||||
|
]"
|
||||||
|
/>
|
||||||
<div>
|
<div>
|
||||||
<!-- 👉 filters -->
|
<!-- 👉 filters -->
|
||||||
<VCard
|
<VCard
|
||||||
|
|
|
||||||
|
|
@ -238,6 +238,13 @@ const exportEXCEL = () => {
|
||||||
</script>
|
</script>
|
||||||
|
|
||||||
<template>
|
<template>
|
||||||
|
<VBreadcrumbs
|
||||||
|
class="px-0 py-2"
|
||||||
|
:items="[
|
||||||
|
{ title: t('Home'), to: { name: 'root' } },
|
||||||
|
{ title: t('Logs list') },
|
||||||
|
]"
|
||||||
|
/>
|
||||||
<div>
|
<div>
|
||||||
<!-- 👉 Statistics Widgets -->
|
<!-- 👉 Statistics Widgets -->
|
||||||
<VCard class="mb-6">
|
<VCard class="mb-6">
|
||||||
|
|
|
||||||
|
|
@ -6,6 +6,7 @@
|
||||||
"OBI": "OBI",
|
"OBI": "OBI",
|
||||||
"Dotsoft": "Dotsoft",
|
"Dotsoft": "Dotsoft",
|
||||||
"List of stores": "قائمة المتاجر",
|
"List of stores": "قائمة المتاجر",
|
||||||
|
"Store visualization": "عرض المتاجر",
|
||||||
"BL not sent list": "قائمة البيانات الخارجية غير المرسلة",
|
"BL not sent list": "قائمة البيانات الخارجية غير المرسلة",
|
||||||
"BL not sent": "بيانات البيانات الخارجية غير المرسلة",
|
"BL not sent": "بيانات البيانات الخارجية غير المرسلة",
|
||||||
"ST ID": "ST ID",
|
"ST ID": "ST ID",
|
||||||
|
|
|
||||||
|
|
@ -6,6 +6,7 @@
|
||||||
"OBI": "OBI",
|
"OBI": "OBI",
|
||||||
"Dotsoft": "Dotsoft",
|
"Dotsoft": "Dotsoft",
|
||||||
"List of stores": "List of stores",
|
"List of stores": "List of stores",
|
||||||
|
"Store visualization": "Store visualization",
|
||||||
"BL not sent list": "BL not sent list",
|
"BL not sent list": "BL not sent list",
|
||||||
"BL not sent": "BL not sent",
|
"BL not sent": "BL not sent",
|
||||||
"ST ID": "ST ID",
|
"ST ID": "ST ID",
|
||||||
|
|
|
||||||
|
|
@ -6,8 +6,9 @@
|
||||||
"OBI": "OBI",
|
"OBI": "OBI",
|
||||||
"Dotsoft": "Dotsoft",
|
"Dotsoft": "Dotsoft",
|
||||||
"List of stores": "Liste des boutiques",
|
"List of stores": "Liste des boutiques",
|
||||||
"BL not sent list": "Liste des BL non envoyés",
|
"Store visualization": "Visualisation boutique",
|
||||||
"BL not sent": "BL non envoyé",
|
"BL not sent list": "Liste BL non envoyés",
|
||||||
|
"BL not sent": "BL non envoyés",
|
||||||
"ST ID": "ID ST",
|
"ST ID": "ID ST",
|
||||||
"Exp ID": "ID Exp",
|
"Exp ID": "ID Exp",
|
||||||
"BL ID": "ID BL",
|
"BL ID": "ID BL",
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue