@mixd-id/web-scaffold 0.1.230406012 → 0.1.230406014

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@mixd-id/web-scaffold",
   "private": false,
-  "version": "0.1.230406012",
+  "version": "0.1.230406014",
   "scripts": {
     "dev": "vite serve",
     "build": "vite build",

package/src/components/ListPage1.vue

@@ -60,8 +60,8 @@
 				</div>
 			</div>
 
-			<div class="flex-1 relative flex" v-if="!hideDetails">
-				<VirtualTable v-if="!hideDetails" ref="table1" :class="$style.vtable" :columns="presetColumns" :items="items"
+			<div :class="$style.contentArea" v-if="!hideDetails">
+				<VirtualTable v-if="!hideDetails" ref="table1" :columns="presetColumns" :items="items"
 						:appearances="presetAppearances" @scroll-end="loadNext" :pinned="pinned">
 					<template v-for="column in presetColumns" #[colOf(column.key)]="{}">
 						<div :class="getHeader(column)" @click="openColumnOptions(column.key, $event.target.closest('.' + $style.header))">
@@ -101,9 +101,10 @@
 						<slot name="mobileItem" :item="item"></slot>
 					</template>
 				</VirtualScroll>
-				<div v-if="isLoading" :class="$style.overlay">
-					<svg class="animate-spin aspect-square w-[48px] h-[48px] text-primary" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"><circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle><path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path></svg>
-				</div>
+			</div>
+
+			<div v-if="isLoading" :class="$style.overlay">
+				<svg class="animate-spin aspect-square w-[48px] h-[48px] text-primary" xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24"><circle class="opacity-25" cx="12" cy="12" r="10" stroke="currentColor" stroke-width="4"></circle><path class="opacity-75" fill="currentColor" d="M4 12a8 8 0 018-8V0C5.373 0 0 5.373 0 12h4zm2 5.291A7.962 7.962 0 014 12H0c0 3.042 1.135 5.824 3 7.938l3-2.647z"></path></svg>
 			</div>
 
 			<ContextMenu ref="columnMenu" :dismiss="false">
@@ -1345,6 +1346,13 @@ export default{
 	@apply flex flex-row gap-3 items-center;
 }
 
+.contentArea{
+	@apply flex-1 relative flex;
+}
+.contentArea>*:last-child{
+	@apply hidden
+}
+
 .overlay{
 	@apply absolute top-0 right-0 bottom-0 left-0 flex items-center justify-center;
 	background-color: rgba(var(--base-500), .7);
@@ -1368,18 +1376,18 @@ export default{
 		@apply px-6 py-4;
 	}
 
-	.vtable{
-		@apply hidden;
+	.contentArea>*:first-child{
+		@apply hidden
+	}
+	.contentArea>*:last-child{
+		@apply flex
 	}
 
 	.vscroll{
 		@apply flex-1 flex border-t-[1px] border-b-[1px] border-text-50;
 	}
-	.vscroll>*{
-		@apply divide-y divide-text-50;
-	}
 	.vscroll>*>*{
-		@apply bg-base-500;
+		@apply bg-base-500 divide-y divide-text-50;
 	}
 
 	.optArea{

package/src/components/VirtualTable.vue

@@ -321,7 +321,7 @@ export default{
 		formatColumn(item, column){
 
 			let value
-			if(column.key.indexOf('.') > -1){
+			if((column.key ?? '').toString().indexOf('.') > -1){
 				const columnKeys = column.key.split('.')
 				const columnAs = columnKeys[0]
 				const columnKey = columnKeys[1]
@@ -448,6 +448,10 @@ export default{
 	width: 100%;
 }
 
+.table tr{
+	vertical-align: top;
+}
+
 .table th{
 	@apply relative text-left;
 }

package/src/utils/helpers.js

@@ -1,6 +1,7 @@
 const md5 = require("md5");
 const fs = require("fs");
 const { Op } = module.parent.require('sequelize')
+const axios = module.parent.require('axios')
 
 
 const ceil = (num, precision = 0) => {
@@ -96,7 +97,7 @@ const saveBuffer = async(buffer, dir = '/storage/files/images') => {
 
   const type = await fileTypeFromBuffer(buffer)
 
-  const storagePath = process.env.ROOT_PATH + (dir)
+  const storagePath = process.env.ROOT_PATH + dir
   const ext = type && type.ext ? '.' + type.ext : ''
   const filename = md5(buffer) + ext
   const to = storagePath + '/' + filename

package/src/utils/listpage1.js

@@ -477,6 +477,13 @@ let ListPage1 = {
       }
     }
 
+    if(typeof this['loadFilters'] === 'function'){
+      where = {
+        ...where,
+        ...(await this['loadFilters']() ?? {})
+      }
+    }
+
     if(preset.sorts){
       const { order:presetOrder } = this.getPresetSortParams(preset, includes)
       if(presetOrder){