perf: order components

src/pages/Item/ItemFixedPrice.vue

@@ -24,24 +24,31 @@ import RightMenu from 'src/components/common/RightMenu.vue';
 import VnTable from 'src/components/VnTable/VnTable.vue';
 import { QCheckbox } from 'quasar';
 
+const quasar = useQuasar();
 const stateStore = useStateStore();
 const { t } = useI18n();
 const { openConfirmationModal } = useVnConfirm();
 const state = useState();
 const { notify } = useNotify();
-
+const tableRef = ref();
 const editTableCellDialogRef = ref(null);
 const user = state.getUser();
 const fixedPrices = ref([]);
 const warehousesOptions = ref([]);
 const rowsSelected = ref([]);
 
+const itemFixedPriceFilterRef = ref();
+
 const params = reactive({});
 const defaultColumnAttrs = {
     align: 'left',
     sortable: true,
 };
-
+onMounted(async () => {
+    stateStore.rightDrawer = true;
+    params.warehouseFk = user.value.warehouseFk;
+});
+onUnmounted(() => (stateStore.rightDrawer = false));
 const columns = computed(() => [
     {
         label: t('item.fixedPrice.itemId'),
@@ -255,13 +262,12 @@ const updateMinPrice = async (value, props) => {
     });
 };
 
-const upsertPrice = async ({ row, col, rowIndex }, resetMinPrice = false) => {
+const upsertPrice = async ({ row }, resetMinPrice = false) => {
     // if (!validations(row, rowIndex, col)) return;
 
     try {
         if (resetMinPrice) row.hasMinPrice = 0;
         row = await upsertFixedPrice(row);
-        // fixedPricesOriginalData.value[rowIndex][col.field] = row[col.field];
     } catch (err) {
         console.error('Error editing price', err);
     }
@@ -281,14 +287,11 @@ async function saveOnRowChange(row) {
         await upsertFixedPrice(rowsSelected.value[0]);
     rowsSelected.value = [row];
 }
-const tableRef = ref();
+
 function checkLastVisibleRow() {
-    const rows = document
-        .getElementsByClassName('q-table')[0]
-        .querySelectorAll('tr.cursor-pointer');
     let lastVisibleRow = null;
 
-    rows.forEach((row, index) => {
+    getTableRows().forEach((row, index) => {
         const rect = row.getBoundingClientRect();
         if (rect.top >= 0 && rect.bottom <= window.innerHeight) {
             lastVisibleRow = index;
@@ -337,10 +340,10 @@ const addRow = (original = null) => {
         };
     return { original, copy };
 };
+const getTableRows = () =>
+    document.getElementsByClassName('q-table')[0].querySelectorAll('tr.cursor-pointer');
 function highlightNewRow({ $index: index }) {
-    const row = document
+    const row = getTableRows()[index];
-        .getElementsByClassName('q-table')[0]
-        .querySelectorAll('tr.cursor-pointer')[index];
     if (row) {
         row.classList.add('highlight');
         setTimeout(() => {
@@ -365,8 +368,6 @@ const removeFuturePrice = async () => {
         console.error('Error removing price', err);
     }
 };
-const quasar = useQuasar();
-
 function confirmRemove(item, isFuture) {
     const promise = async () =>
         isFuture ? removeFuturePrice(item.id) : removePrice(item.id);
@@ -389,10 +390,6 @@ const removePrice = async (id) => {
     }
 };
 
-onMounted(async () => {
-    stateStore.rightDrawer = true;
-    params.warehouseFk = user.value.warehouseFk;
-});
 function handleOnDataSave({ CrudModelRef }) {
     const { original, copy } = addRow(CrudModelRef.formData[checkLastVisibleRow()]);
     if (original) {
@@ -404,8 +401,6 @@ function handleOnDataSave({ CrudModelRef }) {
         highlightNewRow(original ?? { $index: 0 });
     });
 }
-onUnmounted(() => (stateStore.rightDrawer = false));
-const itemFixedPriceFilterRef = ref();
 </script>
 
 <template>
@@ -629,7 +624,7 @@ const itemFixedPriceFilterRef = ref();
                         "
                     >
                         <QTooltip class="text-no-wrap">
-                            {{ t('Delete') }}
+                            {{ t('globals.delete') }}
                         </QTooltip>
                     </QIcon>
                 </QTd>
@@ -644,8 +639,6 @@ const itemFixedPriceFilterRef = ref();
                 @on-data-saved="onEditCellDataSaved()"
             />
         </QDialog>
-        {{ rowsSelected }}
-        **{{ editTableFieldsOptions }}
     </QPage>
 </template>
 <style lang="scss">
@@ -694,6 +687,4 @@ tbody tr.highlight .q-td {
 es:
     Add fixed price: Añadir precio fijado
     Edit fixed price(s): Editar precio(s) fijado(s)
-    Are you sure you want to continue?: ¿Seguro que quieres continuar?
-    Delete: Eliminar
 </i18n>