@mixd-id/web-scaffold 0.1.230406368 → 0.1.230406370

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@mixd-id/web-scaffold",
   "private": false,
-  "version": "0.1.230406368",
+  "version": "0.1.230406370",
   "scripts": {
     "dev": "vite serve",
     "build": "vite build",
@@ -55,7 +55,7 @@
     "md5": "^2.3.0",
     "mitt": "^3.0.1",
     "nprogress": "^0.2.0",
-    "pinia": "^2.0.2",
+    "pinia": "^2.3.0",
     "prismjs": "^1.28.0",
     "redis": "^4.6.13",
     "serve-static": "^1.15.0",

package/src/components/VirtualGrid.vue

@@ -82,6 +82,8 @@ export default{
           this.isOnEndScroll = false
         }
       }
+
+      this.scrolled = this.scrollTop > 0
     }, 16),
 
     init(){
@@ -218,6 +220,8 @@ export default{
       isOnEndScroll: false,
       selectedIndex: -1,
       state: 1,
+      scrolled: false,
+      scrollerCache: {}
     }
   },
 
@@ -227,11 +231,11 @@ export default{
 
   watch: {
 
-    column(to){
+    column(){
       this.resize()
     },
 
-    gap(to){
+    gap(){
       this.resize()
     },
 
@@ -246,6 +250,19 @@ export default{
       }
     },
 
+    scrollerStyle(to){
+      if(this.scrolled && this.scrollerCache?.id){
+        const index = this.items.findIndex(_ => _.id === this.scrollerCache.id)
+        const addToScroll = (index - this.scrollerCache.index) * this.itemHeight
+        this.scrollTop = this.$el.scrollTop = this.scrollTop + addToScroll
+      }
+
+      this.scrollerCache = {
+        id: this.items[this.visibleStartIndex].id,
+        index: this.visibleStartIndex
+      }
+    },
+
   }
 
 }

package/src/components/VirtualTable.vue

@@ -139,7 +139,9 @@ export default{
 			maxVisibleItems: 0,
 			isOnEndScroll: false,
 			selectedIndex: -1,
-			state: 1
+			state: 1,
+      scrolled: false,
+      scrollerCache: {}
 		}
 	},
 
@@ -318,6 +320,8 @@ export default{
 					this.isOnEndScroll = false
 				}
 			}
+
+      this.scrolled = this.scrollTop > 0
 		}, 16),
 
 		passiveScrollSupported() {
@@ -600,7 +604,20 @@ export default{
 			handler(){
 				this.resize()
 			}
-		}
+		},
+
+    scrollerStyle(to){
+      if(this.scrolled && this.scrollerCache?.id){
+        const index = this.items.findIndex(_ => _.id === this.scrollerCache.id)
+        const addToScroll = (index - this.scrollerCache.index) * this.itemHeight
+        this.scrollTop = this.$refs.cont.scrollTop = this.scrollTop + addToScroll
+      }
+
+      this.scrollerCache = {
+        id: this.items[this.visibleStartIndex].id,
+        index: this.visibleStartIndex
+      }
+    },
 
 	}
 

package/src/index.js

@@ -618,7 +618,7 @@ export default{
     app.component('Header1', defineAsyncComponent(() => import("./widgets/Header1.vue")))
     app.component('Header2', defineAsyncComponent(() => import("./widgets/Header2.vue")))
     app.component('HeaderSetting', defineAsyncComponent(() => import("./widgets/HeaderSetting.vue")))
-    app.component('Header1Setting', defineAsyncComponent(() => import("./widgets/Header1Setting.vue")))
+    //app.component('Header1Setting', defineAsyncComponent(() => import("./widgets/Header1Setting.vue")))
     app.component('Header2Setting', defineAsyncComponent(() => import("./widgets/Header2Setting.vue")))
     app.component('IconList', defineAsyncComponent(() => import("./widgets/IconList.vue")))
     app.component('IconListSetting', defineAsyncComponent(() => import("./widgets/IconListSetting.vue")))

package/src/utils/helpers.js

@@ -530,6 +530,19 @@ function capitalize(str) {
   });
 }
 
+const removeUnderscoredKey = (obj) => {
+  if(typeof obj === 'object' && obj !== null){
+    for(let key in obj){
+      if(key.startsWith('_')){
+        delete obj[key]
+      }
+      else if(Array.isArray(obj[key])){
+        obj[key].forEach(_ => removeUnderscoredKey(_))
+      }
+    }
+  }
+}
+
 module.exports = {
   capitalize,
   ceil,
@@ -559,4 +572,5 @@ module.exports = {
   datasourceGet,
   datasourceLoad,
   dayTimeRange,
+  removeUnderscoredKey
 }

package/src/widgets/Dashboard/DataTableSetting.vue

@@ -73,6 +73,11 @@
         </VirtualGrid>
 
       </div>
+
+      <div v-else-if="value.tabIndex === 3" class="flex-1 flex flex-col gap-5 p-6">
+
+      </div>
+
     </div>
 
 	</div>
@@ -119,6 +124,9 @@ export default{
       return [
         { text:'General', value:1 },
         this.value.props.datasourceUid ? { text:'Columns', value:2 } : null,
+        this.value.props.datasourceUid ? { text:'Filters', value:3 } : null,
+        this.value.props.datasourceUid ? { text:'Sorts', value:4 } : null,
+        this.value.props.datasourceUid ? { text:'Pivot', value:5 } : null,
       ]
         .filter(_ => _)
     },

package/src/widgets/PresetSelector.vue

@@ -53,7 +53,7 @@
 
     <div v-if="mode === 'select'" class="flex-1 flex flex-col">
       <div class="flex flex-col bg-base-300 border-t-[1px] border-b-[1px] border-text-50 divide-y divide-text-50">
-        <button v-for="(preset, idx) in config.presets" type="button"
+        <div v-for="(preset, idx) in config.presets"
                 class="px-6 text-left hover:bg-primary-200 hover:text-white flex flex-row items-center">
           <div class="flex-1 py-4" @click="select(idx)">
             {{ preset.name }}
@@ -64,7 +64,7 @@
                   @click="$refs.contextMenu.open($refs.btn[idx], { idx })">
             <svg width="16" height="16" class="fill-text-300 hover:fill-primary" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 128 512"><path d="M64 208c26.5 0 48 21.5 48 48s-21.5 48-48 48-48-21.5-48-48 21.5-48 48-48zM16 104c0 26.5 21.5 48 48 48s48-21.5 48-48-21.5-48-48-48-48 21.5-48 48zm0 304c0 26.5 21.5 48 48 48s48-21.5 48-48-21.5-48-48-48-48 21.5-48 48z"/></svg>
           </button>
-        </button>
+        </div>
       </div>
 
       <ContextMenu ref="contextMenu" position="bottom-right">