0
0
Fork 0

refactor: refs #6977 use VnImg

This commit is contained in:
Jon Elias 2024-06-21 07:24:23 +02:00
parent b60fa62c99
commit f41161a28e
10 changed files with 39 additions and 76 deletions

View File

@ -11,6 +11,7 @@ import VnSelect from 'src/components/common/VnSelect.vue';
import VnRow from 'components/ui/VnRow.vue';
import FetchData from 'components/FetchData.vue';
import { useClipboard } from 'src/composables/useClipboard';
import VnImg from 'src/components/ui/VnImg.vue';
const state = useState();
const session = useSession();
@ -47,7 +48,6 @@ const darkMode = computed({
});
const user = state.getUser();
const token = session.getTokenMultimedia();
const warehousesData = ref();
const companiesData = ref();
const accountBankData = ref();
@ -149,10 +149,7 @@ function saveUserData(param, value) {
<div class="col column items-center q-mb-sm">
<QAvatar size="80px">
<QImg
:src="`/api/Images/user/160x160/${user.id}/download?access_token=${token}`"
spinner-color="white"
/>
<VnImg :id="user.id" collection="user" size="160x160" />
</QAvatar>
<div class="text-subtitle1 q-mt-md">

View File

@ -3,10 +3,14 @@ import { ref, computed, onMounted } from 'vue';
import { useSession } from 'src/composables/useSession';
const $props = defineProps({
collection: {
storage: {
type: [String, Number],
default: 'Images',
},
collection: {
type: String,
default: 'catalog',
},
size: {
type: String,
default: '200x200',
@ -26,9 +30,8 @@ const token = useSession().getTokenMultimedia();
const timeStamp = ref(`timestamp=${Date.now()}`);
const url = computed(
() =>
`/api/${$props.collection}/catalog/${$props.size}/${$props.id}/download?access_token=${token}&${timeStamp.value}`
`/api/${$props.storage}/${$props.collection}/${$props.size}/${$props.id}/download?access_token=${token}&${timeStamp.value}`
);
const emits = defineEmits(['refresh']);
const reload = (emit = false) => {
timeStamp.value = `timestamp=${Date.now()}`;
};

View File

@ -6,8 +6,8 @@ import CardDescriptor from 'components/ui/CardDescriptor.vue';
import VnLv from 'src/components/ui/VnLv.vue';
import useCardDescription from 'src/composables/useCardDescription';
import AccountDescriptorMenu from './AccountDescriptorMenu.vue';
import { useSession } from 'src/composables/useSession';
import FetchData from 'src/components/FetchData.vue';
import VnImg from 'src/components/ui/VnImg.vue';
const $props = defineProps({
id: {
@ -19,7 +19,6 @@ const $props = defineProps({
const route = useRoute();
const { t } = useI18n();
const { getTokenMultimedia } = useSession();
const entityId = computed(() => {
return $props.id || route.params.id;
});
@ -31,10 +30,6 @@ const filter = {
fields: ['id', 'nickname', 'name', 'role'],
include: { relation: 'role', scope: { fields: ['id', 'name'] } },
};
function getAccountAvatar() {
const token = getTokenMultimedia();
return `/api/Images/user/160x160/${entityId.value}/download?access_token=${token}`;
}
const hasAccount = ref(false);
</script>
@ -72,7 +67,8 @@ const hasAccount = ref(false);
<AccountDescriptorMenu :has-account="hasAccount" />
</template>
<template #before>
<QImg :src="getAccountAvatar()" class="photo">
<!-- falla id :id="entityId.value" collection="user" size="160x160" -->
<VnImg :id="entityId" collection="user" size="160x160" class="photo">
<template #error>
<div
class="absolute-full picture text-center q-pa-md flex flex-center"
@ -87,7 +83,7 @@ const hasAccount = ref(false);
</div>
</div>
</template>
</QImg>
</VnImg>
</template>
<template #body="{ entity }">
<VnLv :label="t('account.card.nickname')" :value="entity.nickname" />

View File

@ -10,12 +10,13 @@ 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';
// import { useSession } from 'src/composables/useSession';
import VnImg from 'src/components/ui/VnImg.vue';
const route = useRoute();
const { t } = useI18n();
const { getTokenMultimedia } = useSession();
const token = getTokenMultimedia();
// const { getTokenMultimedia } = useSession();
// const token = getTokenMultimedia();
const claimFilter = {
fields: [
@ -118,9 +119,11 @@ const statesFilter = {
>
<template #before>
<QAvatar color="orange">
<QImg
<VnImg
v-if="data.workerFk"
:src="`/api/Images/user/160x160/${data.workerFk}/download?access_token=${token}`"
:size="'160x160'"
:id="data.workerFk"
collection="user"
spinner-color="white"
/>
</QAvatar>

View File

@ -3,16 +3,14 @@ import { ref } from 'vue';
import { useRoute } from 'vue-router';
import { useI18n } from 'vue-i18n';
import { useSession } from 'src/composables/useSession';
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 VnImg from 'src/components/ui/VnImg.vue';
const route = useRoute();
const { t } = useI18n();
const { getTokenMultimedia } = useSession();
const token = getTokenMultimedia();
const workers = ref([]);
const workersCopy = ref([]);
@ -143,10 +141,11 @@ const filterOptions = {
>
<template #prepend>
<QAvatar color="orange">
<QImg
:src="`/api/Images/user/160x160/${data.salesPersonFk}/download?access_token=${token}`"
spinner-color="white"
<VnImg
v-if="data.salesPersonFk"
:id="user.id"
collection="user"
spinner-color="white"
/>
</QAvatar>
</template>

View File

@ -16,14 +16,15 @@ import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
import { useStateStore } from 'stores/useStateStore';
import { toDate, toCurrency } from 'src/filters';
import { useSession } from 'composables/useSession';
// import { useSession } from 'composables/useSession';
import { dashIfEmpty } from 'src/filters';
import { useArrayData } from 'composables/useArrayData';
import RightMenu from 'src/components/common/RightMenu.vue';
import VnImg from 'src/components/ui/VnImg.vue';
const router = useRouter();
const { getTokenMultimedia } = useSession();
const token = getTokenMultimedia();
// const { getTokenMultimedia } = useSession();
// const token = getTokenMultimedia();
const stateStore = useStateStore();
const { t } = useI18n();
@ -695,14 +696,7 @@ onUnmounted(() => (stateStore.rightDrawer = false));
</template>
<template #body-cell-picture="{ row }">
<QTd>
<QImg
:src="`/api/Images/catalog/50x50/${row.itemFk}/download?access_token=${token}`"
spinner-color="primary"
:ratio="1"
height="50px"
width="50px"
class="image"
/>
<VnImg :id="row.itemFk" size="50x50" class="image" />
</QTd>
</template>
<template #body-cell-itemFk="{ row }">

View File

@ -13,7 +13,6 @@ import ItemDescriptorImage from 'src/pages/Item/Card/ItemDescriptorImage.vue';
import { useState } from 'src/composables/useState';
import useCardDescription from 'src/composables/useCardDescription';
import { useSession } from 'src/composables/useSession';
import { getUrl } from 'src/composables/getUrl';
import axios from 'axios';
import { dashIfEmpty } from 'src/filters';
@ -42,14 +41,12 @@ const quasar = useQuasar();
const route = useRoute();
const router = useRouter();
const { t } = useI18n();
const { getTokenMultimedia } = useSession();
const state = useState();
const user = state.getUser();
const entityId = computed(() => {
return $props.id || route.params.id;
});
const image = ref(null);
const regularizeStockFormDialog = ref(null);
const item = ref(null);
const available = ref(null);
@ -67,17 +64,10 @@ const warehouseFk = computed({
});
onMounted(async () => {
await getItemAvatar();
warehouseFk.value = user.value.warehouseFk;
salixUrl.value = await getUrl('');
});
const getItemAvatar = async () => {
const token = getTokenMultimedia();
const timeStamp = `timestamp=${Date.now()}`;
image.value = `/api/Images/catalog/200x200/${entityId.value}/download?access_token=${token}&${timeStamp}`;
};
const data = ref(useCardDescription());
const setData = (entity) => {
if (!entity) return;

View File

@ -16,17 +16,15 @@ import ItemListFilter from './ItemListFilter.vue';
import { useStateStore } from 'stores/useStateStore';
import { toDateFormat } from 'src/filters/date.js';
import { useSession } from 'composables/useSession';
import { dashIfEmpty } from 'src/filters';
import { useSummaryDialog } from 'src/composables/useSummaryDialog';
import { useVnConfirm } from 'composables/useVnConfirm';
import axios from 'axios';
import RightMenu from 'src/components/common/RightMenu.vue';
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
import VnImg from 'src/components/ui/VnImg.vue';
const router = useRouter();
const { getTokenMultimedia } = useSession();
const token = getTokenMultimedia();
const stateStore = useStateStore();
const { t } = useI18n();
const { viewSummary } = useSummaryDialog();
@ -491,10 +489,9 @@ onUnmounted(() => (stateStore.rightDrawer = false));
</template>
<template #body-cell-picture="{ row }">
<QTd>
<QImg
:src="`/api/Images/catalog/50x50/${row.id}/download?access_token=${token}`"
spinner-color="primary"
:ratio="1"
<VnImg
size="50x50"
:id="row.id"
height="50px"
width="50px"
class="image"

View File

@ -1,14 +1,12 @@
<script setup>
import { ref, onMounted } from 'vue';
import { useSession } from 'src/composables/useSession';
import { useI18n } from 'vue-i18n';
import { useQuasar } from 'quasar';
import VnConfirm from 'components/ui/VnConfirm.vue';
import VnImg from 'src/components/ui/VnImg.vue';
const quasar = useQuasar();
const { t } = useI18n();
const { getTokenMultimedia } = useSession();
const token = getTokenMultimedia();
const counters = ref({
alquilerBandeja: { count: 0, id: 96001, title: 'CC Bandeja', isTray: true },
@ -35,10 +33,6 @@ onMounted(() => {
}
});
function getUrl(id) {
return `/api/Images/catalog/200x200/${id}/download?access_token=${token}`;
}
async function handleEvent(type, action, amount) {
const counter = counters.value[type].count;
let isOk = true;
@ -70,11 +64,7 @@ function confirm() {
<QList class="row q-mx-auto q-mt-xl">
<QItem v-for="(props, name) in counters" :key="name" class="col-6">
<QItemSection>
<QImg
:src="getUrl(props.id)"
width="130px"
@click="handleEvent(name, 'add')"
/>
<VnImg :id="props.id" width="130px" @click="handleEvent(name, 'add')" />
<p class="title">{{ props.title }}</p>
</QItemSection>
<QItemSection class="q-ma-none">

View File

@ -2,7 +2,6 @@
import { computed, ref, watch } from 'vue';
import { useRoute } from 'vue-router';
import { useI18n } from 'vue-i18n';
import { useSession } from 'src/composables/useSession';
import CardDescriptor from 'src/components/ui/CardDescriptor.vue';
import VnLv from 'src/components/ui/VnLv.vue';
import VnLinkPhone from 'src/components/ui/VnLinkPhone.vue';
@ -10,6 +9,7 @@ import WorkerChangePasswordForm from 'src/pages/Worker/Card/WorkerChangePassword
import useCardDescription from 'src/composables/useCardDescription';
import { useState } from 'src/composables/useState';
import axios from 'axios';
import VnImg from 'src/components/ui/VnImg.vue';
const $props = defineProps({
id: {
@ -25,7 +25,6 @@ const $props = defineProps({
const route = useRoute();
const { t } = useI18n();
const { getTokenMultimedia } = useSession();
const state = useState();
const user = state.getUser();
const changePasswordFormDialog = ref(null);
@ -73,11 +72,6 @@ watch(
}
);
function getWorkerAvatar() {
const token = getTokenMultimedia();
return `/api/Images/user/160x160/${entityId.value}/download?access_token=${token}`;
}
const data = ref(useCardDescription());
const setData = (entity) => {
if (!entity) return;
@ -155,7 +149,7 @@ const refetch = async () => await cardDescriptorRef.value.getData();
</QItem>
</template>
<template #before>
<QImg :src="getWorkerAvatar()" class="photo">
<VnImg :id="entityId" collection="user" size="160x160" class="photo">
<template #error>
<div
class="absolute-full picture text-center q-pa-md flex flex-center"
@ -170,7 +164,7 @@ const refetch = async () => await cardDescriptorRef.value.getData();
</div>
</div>
</template>
</QImg>
</VnImg>
</template>
<template #body="{ entity }">
<VnLv :label="t('worker.card.name')" :value="entity.user?.nickname" />