forked from verdnatura/salix-front
role updates
This commit is contained in:
parent
bbd51c5773
commit
026997a369
|
|
@ -1,181 +1,33 @@
|
|||
<script setup>
|
||||
import { ref } from 'vue';
|
||||
import { useRoute } from 'vue-router';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import VnSelect from 'src/components/common/VnSelect.vue';
|
||||
import FetchData from 'components/FetchData.vue';
|
||||
import FormModel from 'components/FormModel.vue';
|
||||
import VnRow from 'components/ui/VnRow.vue';
|
||||
import VnInput from 'src/components/common/VnInput.vue';
|
||||
import VnInputDate from 'components/common/VnInputDate.vue';
|
||||
|
||||
import axios from 'axios';
|
||||
import { useSession } from 'src/composables/useSession';
|
||||
|
||||
const route = useRoute();
|
||||
const { t } = useI18n();
|
||||
const { getTokenMultimedia } = useSession();
|
||||
const token = getTokenMultimedia();
|
||||
|
||||
const accountFilter = {
|
||||
fields: [
|
||||
'id',
|
||||
'clientFk',
|
||||
'created',
|
||||
'workerFk',
|
||||
'accountStateFk',
|
||||
'packages',
|
||||
'pickup',
|
||||
],
|
||||
include: [
|
||||
{
|
||||
relation: 'client',
|
||||
scope: {
|
||||
fields: ['name'],
|
||||
},
|
||||
},
|
||||
],
|
||||
};
|
||||
|
||||
const accountStates = ref([]);
|
||||
const accountStatesCopy = ref([]);
|
||||
const optionsList = ref([]);
|
||||
|
||||
const workersOptions = ref([]);
|
||||
|
||||
function setAccountStates(data) {
|
||||
accountStates.value = data;
|
||||
accountStatesCopy.value = data;
|
||||
}
|
||||
|
||||
async function getEnumValues() {
|
||||
optionsList.value = [{ id: null, description: t('account.basicData.null') }];
|
||||
const { data } = await axios.get(`Applications/get-enum-values`, {
|
||||
params: {
|
||||
schema: 'vn',
|
||||
table: 'account',
|
||||
column: 'pickup',
|
||||
},
|
||||
});
|
||||
for (let value of data)
|
||||
optionsList.value.push({
|
||||
id: value,
|
||||
description: t(`account.basicData.${value}`),
|
||||
});
|
||||
}
|
||||
|
||||
getEnumValues();
|
||||
|
||||
const statesFilter = {
|
||||
options: accountStates,
|
||||
filterFn: (options, value) => {
|
||||
const search = value.toLowerCase();
|
||||
|
||||
if (value === '') return accountStatesCopy.value;
|
||||
|
||||
return options.value.filter((row) => {
|
||||
const description = row.description.toLowerCase();
|
||||
|
||||
return description.indexOf(search) > -1;
|
||||
});
|
||||
},
|
||||
};
|
||||
</script>
|
||||
<template>
|
||||
<FetchData
|
||||
url="Workers/activeWithInheritedRole"
|
||||
:filter="{ where: { role: 'salesPerson' } }"
|
||||
@on-fetch="(data) => (workersOptions = data)"
|
||||
auto-load
|
||||
/>
|
||||
<FetchData url="AccountStates" @on-fetch="setAccountStates" auto-load />
|
||||
<FormModel
|
||||
:url="`Accounts/${route.params.id}`"
|
||||
:url-update="`Accounts/updateAccount/${route.params.id}`"
|
||||
:filter="accountFilter"
|
||||
model="account"
|
||||
auto-load
|
||||
>
|
||||
<template #form="{ data, validate, filter }">
|
||||
<FormModel :url="`VnRoles/${route.params.id}`" model="VnRole" auto-load>
|
||||
<template #form="{ data }">
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<div class="col">
|
||||
<VnInput
|
||||
v-model="data.client.name"
|
||||
:label="t('account.basicData.customer')"
|
||||
:label="t('role.basicData.name')"
|
||||
disable
|
||||
/>
|
||||
</div>
|
||||
</VnRow>
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<div class="col">
|
||||
<VnInputDate
|
||||
v-model="data.created"
|
||||
:label="t('account.basicData.created')"
|
||||
:label="t('role.basicData.description')"
|
||||
/>
|
||||
</div>
|
||||
</VnRow>
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<div class="col">
|
||||
<VnSelect
|
||||
:label="t('account.basicData.assignedTo')"
|
||||
v-model="data.workerFk"
|
||||
:options="workersOptions"
|
||||
option-value="id"
|
||||
option-label="name"
|
||||
emit-value
|
||||
auto-load
|
||||
:rules="validate('account.accountStateFk')"
|
||||
>
|
||||
<template #before>
|
||||
<QAvatar color="orange">
|
||||
<QImg
|
||||
v-if="data.workerFk"
|
||||
:src="`/api/Images/user/160x160/${data.workerFk}/download?access_token=${token}`"
|
||||
spinner-color="white"
|
||||
/>
|
||||
</QAvatar>
|
||||
</template>
|
||||
</VnSelect>
|
||||
</div>
|
||||
<div class="col">
|
||||
<QSelect
|
||||
v-model="data.accountStateFk"
|
||||
:options="accountStates"
|
||||
option-value="id"
|
||||
option-label="description"
|
||||
emit-value
|
||||
:label="t('account.basicData.state')"
|
||||
map-options
|
||||
use-input
|
||||
@filter="(value, update) => filter(value, update, statesFilter)"
|
||||
:rules="validate('account.accountStateFk')"
|
||||
:input-debounce="0"
|
||||
>
|
||||
</QSelect>
|
||||
</div>
|
||||
</VnRow>
|
||||
<VnRow class="row q-gutter-md q-mb-md">
|
||||
<div class="col">
|
||||
<QInput
|
||||
v-model.number="data.packages"
|
||||
:label="t('globals.packages')"
|
||||
:rules="validate('account.packages')"
|
||||
type="number"
|
||||
/>
|
||||
</div>
|
||||
<div class="col">
|
||||
<QSelect
|
||||
v-model="data.pickup"
|
||||
:options="optionsList"
|
||||
option-value="id"
|
||||
option-label="description"
|
||||
emit-value
|
||||
:label="t('account.basicData.pickup')"
|
||||
map-options
|
||||
use-input
|
||||
:input-debounce="0"
|
||||
>
|
||||
</QSelect>
|
||||
</div>
|
||||
</VnRow>
|
||||
</template>
|
||||
</FormModel>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -5,7 +5,7 @@ import RoleDescriptor from './RoleDescriptor.vue';
|
|||
<template>
|
||||
<VnCard
|
||||
data-key="Role"
|
||||
base-url="Roles"
|
||||
base-url="VnRoles"
|
||||
:descriptor="RoleDescriptor"
|
||||
searchbar-data-key="RoleList"
|
||||
searchbar-url="Roles/filter"
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
<script setup>
|
||||
import { ref, computed, onMounted } from 'vue';
|
||||
import { useRoute } from 'vue-router';
|
||||
import { useRoute, useRouter } from 'vue-router';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import { toDate, toPercentage } from 'src/filters';
|
||||
import { useState } from 'src/composables/useState';
|
||||
|
|
@ -9,7 +9,10 @@ import VnLv from 'src/components/ui/VnLv.vue';
|
|||
import useCardDescription from 'src/composables/useCardDescription';
|
||||
import VnUserLink from 'src/components/ui/VnUserLink.vue';
|
||||
import { getUrl } from 'src/composables/getUrl';
|
||||
import { useQuasar } from 'quasar';
|
||||
|
||||
import axios from 'axios';
|
||||
import useNotify from 'src/composables/useNotify.js';
|
||||
const $props = defineProps({
|
||||
id: {
|
||||
type: Number,
|
||||
|
|
@ -19,122 +22,66 @@ const $props = defineProps({
|
|||
});
|
||||
|
||||
const route = useRoute();
|
||||
|
||||
const quasar = useQuasar();
|
||||
const router = useRouter();
|
||||
|
||||
const { notify } = useNotify();
|
||||
const state = useState();
|
||||
const { t } = useI18n();
|
||||
const salixUrl = ref();
|
||||
const entityId = computed(() => {
|
||||
return $props.id || route.params.id;
|
||||
});
|
||||
const data = ref(useCardDescription());
|
||||
const setData = (entity) => (data.value = useCardDescription(entity.name, entity.id));
|
||||
const filter = {
|
||||
where: { id: entityId },
|
||||
fields: ['id', 'nickname', 'name', 'role'],
|
||||
include: { relation: 'role', scope: { fields: ['id', 'name'] } },
|
||||
};
|
||||
const removeRole = () => {
|
||||
quasar
|
||||
.dialog({
|
||||
title: 'Are you sure you want to delete it?',
|
||||
message: 'Delete department',
|
||||
ok: {
|
||||
push: true,
|
||||
color: 'primary',
|
||||
},
|
||||
cancel: true,
|
||||
})
|
||||
.onOk(async () => {
|
||||
try {
|
||||
await axios.post(
|
||||
`/Departments/${entityId.value}/removeChild`,
|
||||
entityId.value
|
||||
);
|
||||
router.push({ name: 'WorkerDepartment' });
|
||||
notify('department.departmentRemoved', 'positive');
|
||||
} catch (err) {
|
||||
console.error('Error removing department');
|
||||
}
|
||||
});
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<CardDescriptor
|
||||
ref="descriptor"
|
||||
:url="`VnUsers/preview`"
|
||||
:url="`VnRoles`"
|
||||
:filter="filter"
|
||||
module="Account"
|
||||
@on-fetch="setData"
|
||||
data-key="accountData"
|
||||
:title="data.title"
|
||||
:subtitle="data.subtitle"
|
||||
>
|
||||
<template #menu="{ entity }">
|
||||
{{ entity }}
|
||||
<template #menu>
|
||||
<QItem v-ripple clickable @click="removeRole()">
|
||||
<QItemSection>{{ t('Delete') }}</QItemSection>
|
||||
</QItem>
|
||||
</template>
|
||||
<template #body="{ entity }">
|
||||
<VnLv v-if="entity.accountState" :label="t('account.card.state')">
|
||||
<template #value>
|
||||
<QBadge
|
||||
:color="stateColor(entity.accountState.code)"
|
||||
text-color="black"
|
||||
dense
|
||||
>
|
||||
{{ entity.accountState.description }}
|
||||
</QBadge>
|
||||
</template>
|
||||
</VnLv>
|
||||
<VnLv :label="t('account.card.created')" :value="toDate(entity.created)" />
|
||||
<VnLv :label="t('account.card.commercial')">
|
||||
<template #value>
|
||||
<VnUserLink
|
||||
:name="entity.client?.salesPersonUser?.name"
|
||||
:worker-id="entity.client?.salesPersonFk"
|
||||
/>
|
||||
</template>
|
||||
</VnLv>
|
||||
<VnLv
|
||||
v-if="entity.worker"
|
||||
:label="t('account.card.attendedBy')"
|
||||
:value="entity.worker.user.name"
|
||||
>
|
||||
<template #value>
|
||||
<VnUserLink
|
||||
:name="entity.worker.user.nickname"
|
||||
:worker-id="entity.worker.id"
|
||||
/>
|
||||
</template>
|
||||
</VnLv>
|
||||
<VnLv :label="t('account.card.zone')">
|
||||
<template #value>
|
||||
<span class="link">
|
||||
{{ entity.ticket?.zone?.name }}
|
||||
</span>
|
||||
</template>
|
||||
</VnLv>
|
||||
<VnLv
|
||||
:label="t('account.card.province')"
|
||||
:value="entity.ticket?.address?.province?.name"
|
||||
/>
|
||||
<VnLv :label="t('account.card.ticketId')">
|
||||
<template #value>
|
||||
<span class="link">
|
||||
{{ entity.ticketFk }}
|
||||
</span>
|
||||
</template>
|
||||
</VnLv>
|
||||
<VnLv
|
||||
:label="t('accountRate')"
|
||||
:value="toPercentage(entity.client?.accountsRatio?.accountingRate)"
|
||||
/>
|
||||
</template>
|
||||
<template #actions="{ entity }">
|
||||
<QCardActions>
|
||||
<QBtn
|
||||
size="md"
|
||||
icon="vn:client"
|
||||
color="primary"
|
||||
:to="{ name: 'CustomerCard', params: { id: entity.clientFk } }"
|
||||
>
|
||||
<QTooltip>{{ t('account.card.customerSummary') }}</QTooltip>
|
||||
</QBtn>
|
||||
<QBtn
|
||||
size="md"
|
||||
icon="vn:ticket"
|
||||
color="primary"
|
||||
:to="{ name: 'TicketCard', params: { id: entity.ticketFk } }"
|
||||
>
|
||||
<QTooltip>{{ t('account.card.accountedTicket') }}</QTooltip>
|
||||
</QBtn>
|
||||
<QBtn
|
||||
size="md"
|
||||
icon="assignment"
|
||||
color="primary"
|
||||
:href="salixUrl + 'ticket/' + entity.ticketFk + '/sale-tracking'"
|
||||
>
|
||||
<QTooltip>{{ t('account.card.saleTracking') }}</QTooltip>
|
||||
</QBtn>
|
||||
<QBtn
|
||||
size="md"
|
||||
icon="visibility"
|
||||
color="primary"
|
||||
:href="salixUrl + 'ticket/' + entity.ticketFk + '/tracking/index'"
|
||||
>
|
||||
<QTooltip>{{ t('account.card.ticketTracking') }}</QTooltip>
|
||||
</QBtn>
|
||||
</QCardActions>
|
||||
<VnLv :label="t('role.card.description')" :value="entity.description" />
|
||||
</template>
|
||||
</CardDescriptor>
|
||||
</template>
|
||||
|
|
|
|||
|
|
@ -12,6 +12,7 @@ import VnUserLink from 'src/components/ui/VnUserLink.vue';
|
|||
import VnTitle from 'src/components/common/VnTitle.vue';
|
||||
import axios from 'axios';
|
||||
import dashIfEmpty from 'src/filters/dashIfEmpty';
|
||||
import { useArrayData } from 'src/composables/useArrayData';
|
||||
|
||||
const route = useRoute();
|
||||
const router = useRouter();
|
||||
|
|
@ -26,76 +27,37 @@ const $props = defineProps({
|
|||
},
|
||||
});
|
||||
|
||||
const { store } = useArrayData('Role');
|
||||
const role = ref(store.data);
|
||||
const entityId = computed(() => $props.id || route.params.id);
|
||||
|
||||
onMounted(async () => {});
|
||||
|
||||
const detailsColumns = ref([
|
||||
{
|
||||
name: 'item',
|
||||
label: 'account.summary.item',
|
||||
field: (row) => row.sale.itemFk,
|
||||
sortable: true,
|
||||
},
|
||||
{
|
||||
name: 'landed',
|
||||
label: 'account.summary.landed',
|
||||
field: (row) => row.sale.ticket.landed,
|
||||
format: (value) => toDate(value),
|
||||
sortable: true,
|
||||
},
|
||||
{
|
||||
name: 'quantity',
|
||||
label: 'account.summary.quantity',
|
||||
field: (row) => row.sale.quantity,
|
||||
sortable: true,
|
||||
},
|
||||
{
|
||||
name: 'accounted',
|
||||
label: 'account.summary.accounted',
|
||||
field: (row) => row.quantity,
|
||||
sortable: true,
|
||||
},
|
||||
{
|
||||
name: 'description',
|
||||
label: 'globals.description',
|
||||
field: (row) => row.sale.concept,
|
||||
},
|
||||
{
|
||||
name: 'price',
|
||||
label: 'account.summary.price',
|
||||
field: (row) => row.sale.price,
|
||||
sortable: true,
|
||||
},
|
||||
{
|
||||
name: 'discount',
|
||||
label: 'account.summary.discount',
|
||||
field: (row) => row.sale.discount,
|
||||
format: (value) => `${value} %`,
|
||||
sortable: true,
|
||||
},
|
||||
{
|
||||
name: 'total',
|
||||
label: 'account.summary.total',
|
||||
field: ({ sale }) =>
|
||||
toCurrency(sale.quantity * sale.price * ((100 - sale.discount) / 100)),
|
||||
sortable: true,
|
||||
},
|
||||
]);
|
||||
const filter = {
|
||||
where: { id: entityId },
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<CardSummary
|
||||
ref="summary"
|
||||
:url="`VnRoles`"
|
||||
:entity-id="entityId"
|
||||
@on-fetch="getAccountDms"
|
||||
:filter="filter"
|
||||
@on-fetch="(data) => (role = data)"
|
||||
>
|
||||
<!-- <template #header="{ entity: { account } }">
|
||||
{{ account.id }} - {{ account.client.name }} ({{ account.client.id }})
|
||||
</template> -->
|
||||
<template #body="{ entity }">
|
||||
{{ entity }}
|
||||
<template #header> {{ role.id }} - {{ role.name }} </template>
|
||||
<template #body>
|
||||
<QCard class="vn-one">
|
||||
<QCardSection class="q-pa-none">
|
||||
<a
|
||||
class="header header-link"
|
||||
:href="`#/VnUser/${entityId}/basic-data`"
|
||||
>
|
||||
{{ t('globals.pageTitles.basicData') }}
|
||||
<QIcon name="open_in_new" />
|
||||
</a>
|
||||
</QCardSection>
|
||||
<VnLv :label="t('role.card.id')" :value="role.id" />
|
||||
<VnLv :label="t('role.card.name')" :value="role.name" />
|
||||
<VnLv :label="t('role.card.description')" :value="role.description" />
|
||||
</QCard>
|
||||
</template>
|
||||
</CardSummary>
|
||||
</template>
|
||||
|
|
|
|||
Loading…
Reference in New Issue