verdnatura/salix-front
verdnatura
/
salix-front
2
2
Fork 1
Code Issues Pull Requests 99 Releases Wiki Activity

Changes
gitea/salix-front/pipeline/head There was a failure building this commit Details

This commit is contained in:
Joan Sanchez 2023-02-21 15:05:57 +01:00
parent 984b1f9e24
commit 08c60b3da0
9 changed files with 144 additions and 84 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
src/components/ui/VnFilterPanel.vue
View File

@ -23,12 +23,21 @@ const userParams = ref({});
onMounted(() => {
const params = store.userParams;
if (params) {
userParams.value = params;
userParams.value = Object.assign({}, params);
}
});
async function search() {
const params = userParams.value;
for (const param in params) {
if (params[param] === '' || params[param] === null) {
delete userParams.value[param];
delete store.userParams[param];
}
}
// if (Object.keys(params))
await arrayData.addFilter({ params });
}
@ -64,7 +73,7 @@ async function remove(key) {
removable
>
<slot name="tags" :tag="chip">
<div class="q-gutter-md">
<div class="q-gutter-x-xs">
<strong>{{ chip.label }}:</strong>
<span>"{{ chip.value }}"</span>
</div>
@ -97,17 +106,17 @@ async function remove(key) {
</q-item>
</div>
<q-separator />
<slot name="body" :params="userParams"></slot>
<slot name="body" :params="userParams" :search-fn="search"></slot>
</q-form>
</template>
<i18n>
{
{
"en": {
"appliedFilters": "Applied filters"
},
"es": {
"appliedFilters": "Filtros aplicados"
}
}
</i18n>
}
</i18n>

8
src/components/ui/VnSearchbar.vue
View File

@ -69,6 +69,14 @@ async function search() {
<template #prepend>
<q-icon name="search" />
</template>
<template #append>
<q-icon
v-if="searchText !== ''"
name="close"
@click="searchText = ''"
class="cursor-pointer"
/>
</template>
</q-input>
</q-form>
</template>

2
src/composables/useArrayData.js
View File

@ -123,7 +123,7 @@ export function useArrayData(key, userOptions) {
}
async function refresh() {
// TODO: Refresh
await fetch({ append: false });
}
function updateStateParams() {

2
src/layouts/MainLayout.vue
View File

@ -16,7 +16,7 @@ const stateStore = useStateStore();
v-model="stateStore.rightDrawer"
side="right"
:width="256"
:breakpoint="800"
:breakpoint="1000"
:persistent="false"
>
<q-scroll-area class="fit text-grey-8">

15
src/pages/Customer/Card/CustomerCard.vue
View File

@ -1,4 +1,5 @@
<script setup>
import { useI18n } from 'vue-i18n';
import { useState } from 'src/composables/useState';
import CustomerDescriptor from './CustomerDescriptor.vue';
import LeftMenu from 'components/LeftMenu.vue';
@ -6,10 +7,11 @@ import TeleportSlot from 'components/ui/TeleportSlot.vue';
import VnSearchbar from 'src/components/ui/VnSearchbar.vue';
const state = useState();
const { t } = useI18n();
</script>
<template>
<teleport-slot to="#searchbar">
<VnSearchbar data-key="CustomerList" />
<VnSearchbar data-key="CustomerList" :label="t('searchLabel')" />
</teleport-slot>
<q-drawer v-model="state.drawer.value" show-if-above :width="256" :breakpoint="500">
<q-scroll-area class="fit">
@ -24,3 +26,14 @@ const state = useState();
</q-page>
</q-page-container>
</template>
<i18n>
{
"en": {
"searchLabel": "Search by customer id or name"
},
"es": {
"searchLabel": "Buscar por id o nombre del cliente"
}
}
</i18n>

119
src/pages/Customer/CustomerFilter.vue
View File

@ -1,8 +1,10 @@
<script setup>
import { ref } from 'vue';
import { useI18n } from 'vue-i18n';
import FetchData from 'components/FetchData.vue';
import VnFilterPanel from 'src/components/ui/VnFilterPanel.vue';
const { t } = useI18n();
const props = defineProps({
dataKey: {
type: String,
@ -10,10 +12,10 @@ const props = defineProps({
},
});
const provinces = ref([]);
const workers = ref([]);
const workersCopy = ref([]);
const zones = ref([]);
const provinces = ref();
const workers = ref();
const workersCopy = ref();
const zones = ref();
function setWorkers(data) {
workers.value = data;
@ -30,35 +32,12 @@ function setWorkers(data) {
@on-fetch="setWorkers"
auto-load
/>
<VnFilterPanel :data-key="props.dataKey">
<template #body="{ params }">
<VnFilterPanel :data-key="props.dataKey" :search-button="true">
<template #body="{ params, searchFn }">
<q-list>
<!-- <q-item>
<q-item-section>
<q-input
v-model="params.search"
label="Search by id or name"
class="full-width"
lazy-rules
autofocus
/>
</q-item-section>
</q-item>
<q-item>
<q-item-section>
<q-btn
label="Search"
type="submit"
color="primary"
class="full-width"
rounded
/>
</q-item-section>
</q-item>
<q-separator /> -->
<q-item>
<q-item-section>
<q-input label="Fiscal ID" v-model="params.fi" lazy-rules>
<q-input :label="t('fi')" v-model="params.fi" lazy-rules>
<template #prepend>
<q-icon name="badge" size="sm"></q-icon>
</template>
@ -67,27 +46,30 @@ function setWorkers(data) {
</q-item>
<q-item>
<q-item-section>
<q-input label="Name" v-model="params.name" lazy-rules />
<q-input :label="t('name')" v-model="params.name" lazy-rules />
</q-item-section>
</q-item>
<q-item>
<q-item-section>
<q-input
label="Social name"
:label="t('socialName')"
v-model="params.socialName"
lazy-rules
/>
</q-item-section>
</q-item>
<q-item>
<q-item-section>
<q-item-section v-if="!workers">
<q-skeleton type="QInput" class="full-width" />
</q-item-section>
<q-item-section v-if="workers">
<q-select
v-model="params.salesPersonFk"
:options="workers"
option-value="id"
option-label="name"
emit-value
label="Salesperson"
:label="t('salesPersonFk')"
map-options
use-input
:input-debounce="0"
@ -104,6 +86,30 @@ function setWorkers(data) {
</q-select>
</q-item-section>
</q-item>
<q-item>
<q-item-section v-if="!provinces">
<q-skeleton type="QInput" class="full-width" />
</q-item-section>
<q-item-section v-if="provinces">
<q-select
label="Province"
v-model="params.provinceFk"
:options="provinces"
@update:model-value="searchFn"
option-value="id"
option-label="name"
emit-value
map-options
/>
</q-item-section>
</q-item>
<q-item class="q-mb-md">
<q-item-section>
<q-input label="City" v-model="params.city" lazy-rules />
</q-item-section>
</q-item>
<q-separator />
<q-expansion-item label="More options" expand-separator>
<q-item>
<q-item-section>
<q-input label="Phone" v-model="params.phone" lazy-rules>
@ -123,23 +129,10 @@ function setWorkers(data) {
</q-item-section>
</q-item>
<q-item>
<q-item-section>
<q-select
label="Province"
v-model="params.provinceFk"
:options="provinces"
option-value="id"
option-label="name"
emit-value
map-options
/>
<q-item-section v-if="!zones">
<q-skeleton type="QInput" class="full-width" />
</q-item-section>
<q-item-section>
<q-input label="City" v-model="params.city" lazy-rules />
</q-item-section>
</q-item>
<q-item>
<q-item-section>
<q-item-section v-if="zones">
<q-select
label="Zone"
v-model="params.zoneFk"
@ -150,11 +143,35 @@ function setWorkers(data) {
map-options
/>
</q-item-section>
</q-item>
<q-item>
<q-item-section>
<q-input label="Postcode" v-model="params.postcode" lazy-rules />
<q-input
label="Postcode"
v-model="params.postcode"
lazy-rules
/>
</q-item-section>
</q-item>
</q-expansion-item>
</q-list>
</template>
</VnFilterPanel>
</template>
<i18n>
{
"en": {
"fi": "FI",
"name": "Name",
"socialName": "Social Name",
"salesPersonFk": "Salesperson"
},
"es": {
"fi": "NIF",
"name": "Nombre",
"socialName": "Razón social",
"salesPersonFk": "Comercial"
}
}
</i18n>

13
src/pages/Customer/CustomerList.vue
View File

@ -35,7 +35,7 @@ function viewSummary(id) {
<template>
<teleport-slot to="#searchbar">
<VnSearchbar data-key="CustomerList" label="Search by customer id or name" />
<VnSearchbar data-key="CustomerList" :label="t('searchLabel')" />
</teleport-slot>
<teleport-slot to="#rightPanel">
<CustomerFilter data-key="CustomerList" />
@ -126,3 +126,14 @@ function viewSummary(id) {
</paginate>
</q-page>
</template>
<i18n>
{
"en": {
"searchLabel": "Search by customer id or name"
},
"es": {
"searchLabel": "Buscar por id o nombre del cliente"
}
}
</i18n>

1
src/pages/Login/LoginMain.vue
View File

@ -138,6 +138,7 @@ async function onSubmit() {
color="primary"
class="full-width"
rounded
unelevated
/>
</div>
</q-form>

3
src/pages/Ticket/TicketFilter.vue
View File

@ -41,7 +41,7 @@ function setWorkers(data) {
<span>"{{ tag.value }}"</span>
</div>
</template>
<template #body="{ params }">
<template #body="{ params, searchFn }">
<q-list dense>
<q-item>
<q-item-section>
@ -159,6 +159,7 @@ function setWorkers(data) {
<q-checkbox
v-model="params.myTeam"
label="My team"
@update:model-value="searchFn()"
toggle-indeterminate
/>
</q-item-section>