refactor: refs #6897 update component attributes and improve checkbox integration in tables

src/components/VnTable/VnTable.vue

@@ -712,14 +712,14 @@ const checkbox = ref(null);
                                     "
                                     style="color: var(--vn-text-color)"
                                     :class="hasEditableFormat(col)"
-                                    size="17px"
+                                    size="14px"
                                 />
                                 <QIcon
                                     v-else-if="col?.component === 'checkbox'"
                                     :name="getCheckboxIcon(row[col?.name])"
                                     style="color: var(--vn-text-color)"
                                     :class="hasEditableFormat(col)"
-                                    size="17px"
+                                    size="14px"
                                 />
                                 <span
                                     v-else
@@ -878,9 +878,12 @@ const checkbox = ref(null);
                         <QTh
                             v-for="col of cols.filter((cols) => cols.visible ?? true)"
                             :key="col?.id"
-                            class="text-center"
+                            :class="getColAlign(col)"
                         >
-                            <slot :name="`column-footer-${col.name}`" />
+                            <slot
+                                :name="`column-footer-${col.name}`"
+                                :isEditableColumn="isEditableColumn(col)"
+                            />
                         </QTh>
                     </QTr>
                 </template>
@@ -994,8 +997,8 @@ es:
     }
 }
 .side-padding {
-    padding-left: 10px;
+    padding-left: 1px;
-    padding-right: 10px;
+    padding-right: 1px;
 }
 .editable-text:hover {
     border-bottom: 1px dashed var(--q-primary);

src/components/common/VnComponent.vue

@@ -45,7 +45,6 @@ function toValueAttrs(attrs) {
 }
 </script>
 <template>
-    <slot name="test" />
     <span
         v-for="toComponent of componentArray"
         :key="toComponent.name"

src/pages/Customer/CustomerList.vue

@@ -264,6 +264,7 @@ const columns = computed(() => [
         align: 'left',
         name: 'isActive',
         label: t('customer.summary.isActive'),
+        component: 'checkbox',
         chip: {
             color: null,
             condition: (value) => !value,
@@ -302,6 +303,7 @@ const columns = computed(() => [
         align: 'left',
         name: 'isFreezed',
         label: t('customer.extendedList.tableVisibleColumns.isFreezed'),
+        component: 'checkbox',
         chip: {
             color: null,
             condition: (value) => value,

src/pages/Entry/Card/EntryBuys.vue

@@ -98,7 +98,7 @@ const columns = [
         align: 'center',
         label: 'Id',
         name: 'itemFk',
-        component: 'input',
+        component: 'number',
         isEditable: false,
         width: '40px',
     },
@@ -142,6 +142,7 @@ const columns = [
         labelAbbreviation: t('Siz.'),
         label: t('Size'),
         toolTip: t('Size'),
+        component: 'number',
         name: 'size',
         width: '35px',
         isEditable: false,
@@ -655,7 +656,7 @@ onMounted(() => {
             <FetchedTags :item="row" :columns="3" />
         </template>
         <template #column-stickers="{ row }">
-            <span :class="editableMode ? 'editable-text' : ''">
+            <span class="editable-text">
                 <span style="color: var(--vn-label-color)">
                     {{ row.printedStickers }}
                 </span>