forked from verdnatura/salix-front
feat: remove future itemFixedPrices
This commit is contained in:
parent
8a4b3302cf
commit
77c7a9e03a
|
|
@ -1,6 +1,7 @@
|
|||
<script setup>
|
||||
import { onMounted, ref, reactive, computed, onUnmounted, watch, nextTick } from 'vue';
|
||||
import { onMounted, ref, reactive, onUnmounted, watch, nextTick } from 'vue';
|
||||
import { useI18n } from 'vue-i18n';
|
||||
import VnSubToolbar from 'src/components/ui/VnSubToolbar.vue';
|
||||
|
||||
import FetchData from 'components/FetchData.vue';
|
||||
import FetchedTags from 'components/ui/FetchedTags.vue';
|
||||
|
|
@ -21,7 +22,9 @@ import axios from 'axios';
|
|||
import { useArrayData } from 'composables/useArrayData';
|
||||
import { isLower, isBigger } from 'src/filters/date.js';
|
||||
import RightMenu from 'src/components/common/RightMenu.vue';
|
||||
import { QCheckbox } from 'quasar';
|
||||
|
||||
const checked = ref(false);
|
||||
const stateStore = useStateStore();
|
||||
const { t } = useI18n();
|
||||
const { openConfirmationModal } = useVnConfirm();
|
||||
|
|
@ -302,7 +305,7 @@ async function saveOnRowChange(_, row) {
|
|||
}
|
||||
const tableRef = ref();
|
||||
function checkLastVisibleRow() {
|
||||
const tableBody = tableRef.value.$el.querySelector('tbody.q-virtual-scroll__content');
|
||||
const tableBody = tableRef.value.$el.querySelector('tbody');
|
||||
if (!tableBody) return;
|
||||
const rows = tableBody.querySelectorAll('tr');
|
||||
let lastVisibleRow = null;
|
||||
|
|
@ -351,7 +354,7 @@ const addRow = () => {
|
|||
});
|
||||
};
|
||||
function highlightNewRow(index) {
|
||||
const tableBody = tableRef.value.$el.querySelector('tbody.q-virtual-scroll__content');
|
||||
const tableBody = tableRef.value.$el.querySelector('tbody');
|
||||
const row = tableBody.querySelectorAll('tr')[index];
|
||||
if (row) {
|
||||
row.classList.add('highlight');
|
||||
|
|
@ -365,11 +368,15 @@ const openEditTableCellDialog = () => {
|
|||
};
|
||||
async function showBadDates() {
|
||||
try {
|
||||
const { data } = await axios.get('FixedPrices/filter', {
|
||||
params: {
|
||||
showBadDates: true,
|
||||
},
|
||||
});
|
||||
if (!checked.value) fixedPrices.value = fixedPricesOriginalData.value;
|
||||
else {
|
||||
const { data } = await axios.get('FixedPrices/filter', {
|
||||
params: {
|
||||
showBadDates: checked.value,
|
||||
},
|
||||
});
|
||||
fixedPrices.value = data;
|
||||
}
|
||||
} catch (error) {
|
||||
console.error(error);
|
||||
}
|
||||
|
|
@ -388,6 +395,16 @@ const onWarehousesFetched = (data) => {
|
|||
warehouseField.attrs.options = data;
|
||||
};
|
||||
|
||||
const removeFuturePrice = async () => {
|
||||
try {
|
||||
rowsSelected.value.forEach(({ id }) => {
|
||||
const rowIndex = fixedPrices.value.findIndex((r) => r.id === id);
|
||||
removePrice(id, rowIndex);
|
||||
});
|
||||
} catch (err) {
|
||||
console.error('Error removing price', err);
|
||||
}
|
||||
};
|
||||
const removePrice = async (id, rowIndex) => {
|
||||
try {
|
||||
await axios.delete(`FixedPrices/${id}`);
|
||||
|
|
@ -399,10 +416,6 @@ const removePrice = async (id, rowIndex) => {
|
|||
}
|
||||
};
|
||||
|
||||
function onScroll({ to, ref }) {
|
||||
console.log(to, ref);
|
||||
}
|
||||
|
||||
const updateMinPrice = async (value, props) => {
|
||||
// El checkbox hasMinPrice se encuentra en la misma columna que el input hasMinPrice
|
||||
// Por lo tanto le mandamos otro objeto con las mismas propiedades pero con el campo 'field' cambiado
|
||||
|
|
@ -438,12 +451,20 @@ onUnmounted(() => (stateStore.rightDrawer = false));
|
|||
/>
|
||||
</template>
|
||||
</RightMenu>
|
||||
<VnSubToolbar>
|
||||
<template #st-data>
|
||||
<QCheckbox
|
||||
size="sm"
|
||||
v-model="checked"
|
||||
:label="t(`Show future items`)"
|
||||
@update:model-value="showBadDates"
|
||||
>
|
||||
</QCheckbox>
|
||||
</template>
|
||||
</VnSubToolbar>
|
||||
<QPage class="column items-center q-pa-md">
|
||||
{{ rowsSelected }}
|
||||
<QTable
|
||||
ref="tableRef"
|
||||
@virtual-scroll="onScroll"
|
||||
virtual-scroll
|
||||
dense
|
||||
:rows="fixedPrices"
|
||||
:columns="columns"
|
||||
|
|
@ -454,7 +475,6 @@ onUnmounted(() => (stateStore.rightDrawer = false));
|
|||
class="full-width q-mt-md"
|
||||
:no-data-label="t('globals.noResults')"
|
||||
@row-click="saveOnRowChange"
|
||||
:virtual-scroll-item-size="48"
|
||||
>
|
||||
<template #top-row="{ cols }">
|
||||
<QTr>
|
||||
|
|
@ -489,6 +509,19 @@ onUnmounted(() => (stateStore.rightDrawer = false));
|
|||
{{ t('Add fixed price') }}
|
||||
</QTooltip>
|
||||
</QIcon>
|
||||
<!-- <QIcon
|
||||
v-if="!(checked && rowsSelected.length > 0)"
|
||||
v-else-if="tableRef?.rows?.length > 0"
|
||||
@click.stop="removeFuturePrice()"
|
||||
class="fill-icon-on-hover"
|
||||
color="primary"
|
||||
name="delete"
|
||||
size="sm"
|
||||
>
|
||||
<QTooltip>
|
||||
{{ t('Add fixed price') }}
|
||||
</QTooltip>
|
||||
</QIcon>-->
|
||||
</QTh>
|
||||
<QTh
|
||||
v-for="col in props.cols"
|
||||
|
|
@ -593,7 +626,6 @@ onUnmounted(() => (stateStore.rightDrawer = false));
|
|||
:show-event="false"
|
||||
v-model="props.row.started"
|
||||
v-on="getRowUpdateInputEvents(props, false, 'date')"
|
||||
:options="(date) => date > props.row.ended"
|
||||
v-bind="
|
||||
isBigger(props.row.started)
|
||||
? {
|
||||
|
|
@ -611,7 +643,6 @@ onUnmounted(() => (stateStore.rightDrawer = false));
|
|||
style="max-width: 125px"
|
||||
:show-event="false"
|
||||
v-model="props.row.ended"
|
||||
:options="isLower(props.row.started)"
|
||||
v-on="getRowUpdateInputEvents(props, false, 'date')"
|
||||
v-bind="
|
||||
isLower(props.row.started)
|
||||
|
|
@ -673,24 +704,38 @@ onUnmounted(() => (stateStore.rightDrawer = false));
|
|||
</QTd>
|
||||
</template>
|
||||
</QTable>
|
||||
<QPageSticky :offset="[20, 20]">
|
||||
<QBtn @click="showBadDates()" color="primary" fab icon="edit" />
|
||||
<QTooltip>
|
||||
{{ t('Edit fixed price(s)') }}
|
||||
</QTooltip>
|
||||
</QPageSticky>
|
||||
<QPageSticky :offset="[20, -20]">
|
||||
<QPageSticky :offset="[20, 0]">
|
||||
<QBtn @click="addRow()" color="primary" fab icon="add" />
|
||||
<QTooltip>
|
||||
{{ t('Add') }}
|
||||
</QTooltip>
|
||||
</QPageSticky>
|
||||
<QPageSticky v-if="rowsSelected.length" :offset="[20, 20]">
|
||||
<QPageSticky v-if="rowsSelected.length" :offset="[20, 60]">
|
||||
<QBtn @click="openEditTableCellDialog()" color="primary" fab icon="edit" />
|
||||
<QTooltip>
|
||||
{{ t('Edit fixed price(s)') }}
|
||||
</QTooltip>
|
||||
</QPageSticky>
|
||||
<QPageSticky
|
||||
:offset="[20, 120]"
|
||||
v-if="tableRef?.rows?.length > 0 && checked && rowsSelected.length > 0"
|
||||
>
|
||||
<QBtn
|
||||
color="primary"
|
||||
fab
|
||||
icon="delete"
|
||||
@click.stop="
|
||||
openConfirmationModal(
|
||||
t('This row will be removed'),
|
||||
t('Do you want to clone this item?'),
|
||||
() => removeFuturePrice()
|
||||
)
|
||||
"
|
||||
/>
|
||||
<QTooltip>
|
||||
{{ t('Add') }}
|
||||
</QTooltip>
|
||||
</QPageSticky>
|
||||
<QDialog ref="editTableCellDialogRef">
|
||||
<EditTableCellValueForm
|
||||
edit-url="FixedPrices/editFixedPrice"
|
||||
|
|
@ -712,27 +757,6 @@ onUnmounted(() => (stateStore.rightDrawer = false));
|
|||
}
|
||||
/* height or max-height is important */
|
||||
|
||||
.q-table__top,
|
||||
.q-table__bottom,
|
||||
tbody tr:first-child td {
|
||||
/* bg color is important for th; just specify one */
|
||||
background-color: #00b4ff;
|
||||
}
|
||||
thead tr th {
|
||||
position: sticky;
|
||||
z-index: 1;
|
||||
}
|
||||
thead tr:first-child th {
|
||||
top: 0;
|
||||
}
|
||||
|
||||
/* this is when the loading indicator appears */
|
||||
|
||||
/* prevent scrolling behind sticky top row on focus */
|
||||
tbody
|
||||
/* height of all previous header rows */ {
|
||||
scroll-margin-top: 148px;
|
||||
}
|
||||
tbody tr.highlight .q-td {
|
||||
animation: highlight-animation 4s ease-in-out;
|
||||
}
|
||||
|
|
|
|||
Loading…
Reference in New Issue