Merge pull request 'Se crea la tarjeta de creditos, listado y creacion' (#75) from features/ms_119_credits_card into dev
Reviewed-on: hyervoni/salix-front-mindshore#75
This commit is contained in:
commit
039a9332a9
|
|
@ -1,3 +1,154 @@
|
|||
<script setup>
|
||||
import { ref, computed, onBeforeMount, onMounted } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useRouter } from 'vue-router';
|
||||
|
||||
import { date, QBtn } from 'quasar';
|
||||
|
||||
import { toCurrency, toDate } from 'src/filters';
|
||||
import { useArrayData } from 'composables/useArrayData';
|
||||
import { useStateStore } from 'stores/useStateStore';
|
||||
|
||||
import WorkerDescriptorProxy from 'src/pages/Worker/Card/WorkerDescriptorProxy.vue';
|
||||
|
||||
const { t } = useI18n();
|
||||
const router = useRouter();
|
||||
const stateStore = useStateStore();
|
||||
|
||||
const arrayData = ref(null);
|
||||
const workerId = ref(0);
|
||||
|
||||
onBeforeMount(async () => {
|
||||
const filter = {
|
||||
include: [
|
||||
{
|
||||
relation: 'worker',
|
||||
scope: {
|
||||
fields: ['id'],
|
||||
include: { relation: 'user', scope: { fields: ['name'] } },
|
||||
},
|
||||
},
|
||||
],
|
||||
where: { clientFk: '1' },
|
||||
order: ['created DESC'],
|
||||
limit: 20,
|
||||
};
|
||||
arrayData.value = useArrayData('CustomerCreditsCard', {
|
||||
url: 'ClientCredits',
|
||||
filter,
|
||||
});
|
||||
await arrayData.value.fetch({ append: false });
|
||||
stateStore.rightDrawer = true;
|
||||
});
|
||||
|
||||
onMounted(() => {
|
||||
const filteredColumns = columns.value.filter(
|
||||
(col) => col.name !== 'actions' && col.name !== 'customerStatus'
|
||||
);
|
||||
allColumnNames.value = filteredColumns.map((col) => col.name);
|
||||
});
|
||||
|
||||
const rows = computed(() => arrayData.value.store.data);
|
||||
const allColumnNames = ref([]);
|
||||
|
||||
const tableColumnComponents = {
|
||||
created: {
|
||||
component: 'span',
|
||||
props: () => {},
|
||||
event: () => {},
|
||||
},
|
||||
employee: {
|
||||
component: QBtn,
|
||||
props: () => ({ flat: true, color: 'blue' }),
|
||||
event: (prop) => {
|
||||
selectWorkerId(prop.row.clientFk);
|
||||
},
|
||||
},
|
||||
amount: {
|
||||
component: 'span',
|
||||
props: () => {},
|
||||
event: () => {},
|
||||
},
|
||||
};
|
||||
|
||||
const columns = computed(() => [
|
||||
{
|
||||
align: 'left',
|
||||
field: 'created',
|
||||
label: t('Since'),
|
||||
name: 'created',
|
||||
format: (value) => date.formatDate(value, 'DD/MM/YYYY hh:mm:ss'),
|
||||
},
|
||||
{
|
||||
align: 'left',
|
||||
field: (value) => value.worker.user.name,
|
||||
label: t('Employee'),
|
||||
name: 'employee',
|
||||
},
|
||||
{
|
||||
align: 'left',
|
||||
field: 'amount',
|
||||
label: t('Credit'),
|
||||
name: 'amount',
|
||||
format: (value) => toCurrency(value),
|
||||
},
|
||||
]);
|
||||
|
||||
const selectWorkerId = (id) => {
|
||||
workerId.value = id;
|
||||
};
|
||||
|
||||
const toCustomerCreditCreate = () => {
|
||||
router.push({ name: 'CustomerCreditCreate' });
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="flex justify-center">Credits</div>
|
||||
<QPage class="column items-center q-pa-md">
|
||||
<QTable
|
||||
:columns="columns"
|
||||
:pagination="{ rowsPerPage: 12 }"
|
||||
:rows="rows"
|
||||
class="full-width q-mt-md"
|
||||
row-key="id"
|
||||
>
|
||||
<template #body-cell="props">
|
||||
<QTd :props="props">
|
||||
<QTr :props="props" class="cursor-pointer">
|
||||
<component
|
||||
:is="tableColumnComponents[props.col.name].component"
|
||||
class="col-content"
|
||||
v-bind="tableColumnComponents[props.col.name].props(props)"
|
||||
@click="tableColumnComponents[props.col.name].event(props)"
|
||||
>
|
||||
{{ props.value }}
|
||||
<WorkerDescriptorProxy :id="workerId" />
|
||||
</component>
|
||||
</QTr>
|
||||
</QTd>
|
||||
</template>
|
||||
</QTable>
|
||||
</QPage>
|
||||
|
||||
<QPageSticky :offset="[18, 18]">
|
||||
<QBtn @click.stop="toCustomerCreditCreate()" color="primary" fab icon="add" />
|
||||
<QTooltip>
|
||||
{{ t('New credit') }}
|
||||
</QTooltip>
|
||||
</QPageSticky>
|
||||
</template>
|
||||
|
||||
<style lang="scss" scoped>
|
||||
.col-content {
|
||||
border-radius: 4px;
|
||||
padding: 6px;
|
||||
}
|
||||
</style>
|
||||
|
||||
<i18n>
|
||||
es:
|
||||
Since: Desde
|
||||
Employee: Empleado
|
||||
Credit: Credito
|
||||
New credit: Nuevo credito
|
||||
</i18n>
|
||||
|
|
|
|||
|
|
@ -485,7 +485,6 @@ const selectCustomerId = (id) => {
|
|||
};
|
||||
|
||||
const selectSalesPersonId = (id) => {
|
||||
console.log('selectedSalesPersonId:: ', selectedSalesPersonId.value);
|
||||
selectedSalesPersonId.value = id;
|
||||
};
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -95,7 +95,6 @@ const onDataSaved = () => {
|
|||
const payload = {
|
||||
creates: notes.value,
|
||||
};
|
||||
console.log(payload);
|
||||
axios.post('AddressObservations/crud', payload);
|
||||
};
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,51 @@
|
|||
<script setup>
|
||||
import { reactive } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { useRoute, useRouter } from 'vue-router';
|
||||
|
||||
import FormModel from 'components/FormModel.vue';
|
||||
import VnRow from 'components/ui/VnRow.vue';
|
||||
|
||||
const { t } = useI18n();
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
|
||||
const initialData = reactive({
|
||||
credit: null,
|
||||
});
|
||||
|
||||
const toCustomerCredits = () => {
|
||||
router.push({
|
||||
name: 'CustomerCredits',
|
||||
params: {
|
||||
id: route.params.id,
|
||||
},
|
||||
});
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<FormModel
|
||||
:form-initial-data="initialData"
|
||||
:observe-form-changes="false"
|
||||
:url-update="`/Clients/${route.params.id}`"
|
||||
@on-data-saved="toCustomerCredits()"
|
||||
>
|
||||
<template #form="{ data }">
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<div class="col">
|
||||
<QInput
|
||||
:label="t('Credit')"
|
||||
type="number"
|
||||
v-model.number="data.credit"
|
||||
/>
|
||||
</div>
|
||||
</VnRow>
|
||||
</template>
|
||||
</FormModel>
|
||||
</template>
|
||||
|
||||
<i18n>
|
||||
es:
|
||||
Credit: Crédito
|
||||
</i18n>
|
||||
|
|
@ -18,8 +18,6 @@ const initialData = reactive({
|
|||
});
|
||||
|
||||
const onDataSaved = (dataSaved) => {
|
||||
console.log('onDataSaved()');
|
||||
console.log(dataSaved);
|
||||
emit('onDataSaved', dataSaved);
|
||||
};
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -19,7 +19,6 @@ onMounted(() => {
|
|||
});
|
||||
|
||||
const toCustomerNotes = () => {
|
||||
console.log('toCustomerNotes()');
|
||||
router.push({
|
||||
name: 'CustomerNotes',
|
||||
params: {
|
||||
|
|
|
|||
|
|
@ -226,13 +226,31 @@ export default {
|
|||
},
|
||||
{
|
||||
path: 'credits',
|
||||
name: 'CustomerCredits',
|
||||
meta: {
|
||||
title: 'credits',
|
||||
icon: 'vn:credit',
|
||||
},
|
||||
component: () =>
|
||||
import('src/pages/Customer/Card/CustomerCredits.vue'),
|
||||
name: 'CreditsCard',
|
||||
redirect: { name: 'CustomerCredits' },
|
||||
children: [
|
||||
{
|
||||
path: '',
|
||||
name: 'CustomerCredits',
|
||||
meta: {
|
||||
title: 'credits',
|
||||
icon: 'vn:credit',
|
||||
},
|
||||
component: () =>
|
||||
import('src/pages/Customer/Card/CustomerCredits.vue'),
|
||||
},
|
||||
{
|
||||
path: 'create',
|
||||
name: 'CustomerCreditCreate',
|
||||
meta: {
|
||||
title: 'credit-create',
|
||||
},
|
||||
component: () =>
|
||||
import(
|
||||
'src/pages/Customer/components/CustomerCreditCreate.vue'
|
||||
),
|
||||
},
|
||||
],
|
||||
},
|
||||
{
|
||||
path: 'greuges',
|
||||
|
|
|
|||
Loading…
Reference in New Issue