dev: hotfix, rigid consts + minor data table

app/components/pub/my-ui/data-table/data-table.vue

@@ -22,7 +22,7 @@ const selected = ref<any[]>([])
 function toggleSelection(row: any, event?: Event) {
   if (event) event.stopPropagation() // cegah event bubble ke TableRow
 
-  const isMultiple = props.selectMode === 'multiple' // props.selectMode === 'multi' || 
+  const isMultiple = props.selectMode === 'multiple' // props.selectMode === 'multi' ||
 
   // gunakan pembanding berdasarkan id atau stringify data
   const findIndex = selected.value.findIndex((r) => JSON.stringify(r) === JSON.stringify(row))
@@ -85,7 +85,7 @@ function handleActionCellClick(event: Event, _cellRef: string) {
           v-for="(th, idx) in headers[hrIdx]"
           :key="`head-${idx}`"
           :class="`border ${th.classVal || ''}`"
-          :style="{ width: cols[idx]?.width ? `${cols[idx].width}px` : undefined }"
+          :style="{ width: cols[idx]?.width ? `${cols[idx].width}${cols[idx].widthUnit ?? 'px'}` : '' }"
         >
           {{ th.label }}
         </TableHead>
@@ -128,7 +128,7 @@ function handleActionCellClick(event: Event, _cellRef: string) {
           'bg-green-50':
             props.selectMode === 'single' && selected.some((r) => JSON.stringify(r) === JSON.stringify(row)),
           'bg-blue-50':
-            (props.selectMode === 'multiple') && // props.selectMode === 'multi' || 
+            (props.selectMode === 'multiple') && // props.selectMode === 'multi' ||
             selected.some((r) => JSON.stringify(r) === JSON.stringify(row)),
         }"
         @click="toggleSelection(row)"