@mixd-id/web-scaffold 0.1.230406249 → 0.1.230406251

package/package.json

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

package/src/components/Chart.vue

@@ -119,8 +119,20 @@ export default{
       else{
         for(let key in items[0] ?? {}){
           if(key !== xAxis[0].key){
+
+            let label = key
+
+            const columnKey = yAxis[0].key
+            const column = this.preset.columns.find(column => column.key === columnKey)
+            switch(column.type){
+              case 'enum':
+                label = column.typeParams.find(_ => `${_.value}` === `${key}`)?.text ?? label
+                break
+            }
+
             datasets.push({
-              label: key,
+              key,
+              label,
               data: [],
               borderColor: this.borderColors[datasets.length % this.borderColors.length],
               backgroundColor: this.backgroundColors[datasets.length % this.backgroundColors.length],
@@ -138,7 +150,7 @@ export default{
         }
         else{
           for(let i in datasets){
-            datasets[i].data.push(item[datasets[i].label])
+            datasets[i].data.push(item[datasets[i].key])
           }
         }
       }
@@ -230,7 +242,6 @@ export default{
     }, 1000, { leading:true }),
 
     onSignal(event, items){
-      console.log('onSignal', event, items)
 
       const hasData = items.some(item => item._data)
       if(hasData){

package/src/components/List.vue

@@ -26,7 +26,6 @@
 
         <slot name="head"
               :preset="preset"
-              :badge-count="badgeCount"
               :presetSelector="$refs.presetSelector"
               :compPrefix="compPrefix">
           <div class="flex flex-col md:flex-row gap-3 md:items-start overflow-hidden leading-tight p-3 md:p-0 md:pl-3"
@@ -38,9 +37,6 @@
                 <h4 class="cursor-pointer whitespace-nowrap text-ellipsis overflow-hidden group hover:text-primary"
                     @click="openPreset">
                   {{ preset.name ?? 'Preset Name' }}
-                  <span v-if="badgeCount > 0" class="inline mx-1 min-w-[19px] px-2 h-[19px] relative top-[-2px] rounded-full bg-primary text-white inline-flex items-center justify-center">
-                    {{ badgeCount }}
-                  </span>
                   <svg v-if="computedPresetMode === 'sidebar'" width="14" height="14" class="ml-1 inline fill-text pointer-events-none group-hover:fill-primary" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><!--! Font Awesome Pro 6.0.0-alpha3 by @fontawesome - https://fontawesome.com License - https://fontawesome.com/license (Commercial License) --><path d="M280.3 134.4c-9.719-9-24.91-8.438-33.94 1.25c-9 9.719-8.469 24.88 1.25 33.94L314.9 232H144C130.8 232 120 242.8 120 256S130.8 280 144 280h170.9l-67.21 62.41c-9.719 9.062-10.25 24.22-1.25 33.94c9.031 9.688 24.22 10.25 33.94 1.25l112-104C397.2 269 400 262.7 400 256s-2.781-13.03-7.656-17.59L280.3 134.4zM256 0C114.6 0 0 114.6 0 256s114.6 256 256 256s256-114.6 256-256S397.4 0 256 0zM256 464c-114.7 0-208-93.31-208-208S141.3 48 256 48s208 93.31 208 208S370.7 464 256 464z"/></svg>
                   <svg v-else-if="![ 'external' ].includes(computedPresetMode)" width="14" height="14" class="inline fill-text pointer-events-none group-hover:fill-primary" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><path d="M31.3 192h257.3c17.8 0 26.7 21.5 14.1 34.1L174.1 354.8c-7.8 7.8-20.5 7.8-28.3 0L17.2 226.1C4.6 213.5 13.5 192 31.3 192z"/></svg>
                 </h4>
@@ -51,7 +47,7 @@
               <slot name="toolbar"></slot>
             </div>
 
-            <div class="flex flex-row gap-2 gap-1">
+            <div class="flex flex-row gap-2 gap-1" v-if="Boolean(toolbar)">
               <Textbox class="flex-1 bg-base-500 md:w-[240px]" placeholder="Search..." clearable="1"
                        v-model="preset.search"
                        @clear="delete preset.search; load()"
@@ -165,6 +161,10 @@ export default{
     headerClass: String,
     presetMode: String,
     containerClass: String,
+    toolbar: {
+      type: [ String, Boolean ],
+      default: true
+    },
   },
 
   methods: {
@@ -215,6 +215,8 @@ export default{
               }
 
               this.data = data
+
+              this.$emit('after-load')
             })
             .catch(err => this.toast(err))
       }
@@ -325,6 +327,7 @@ export default{
 
         default:
           this.socket.send(this.src, {
+            ...this.preset,
             id: items.map(item => item.id)
           })
             .then(({ items:nextItems }) => {
@@ -340,7 +343,7 @@ export default{
 
   components: {PresetSelector, VirtualTable},
 
-  emits: [ 'open-preset' ],
+  emits: [ 'after-load', 'open-preset' ],
 
   inject: [ 'socket', 'toast' ],
 
@@ -456,7 +459,6 @@ export default{
 
   data(){
     return {
-      badgeCount: 0,
       readyState: 0,
       data: {
         itemsPerPage: 15,

package/src/utils/preset-selector.js

@@ -527,7 +527,7 @@ const chartToSequelizeWhere = async (chart, opt) => {
           attributes.push([literal(`SUM(CASE WHEN ${field} = '' THEN 1 ELSE 0 END)`), 'EMPTY'])
         }
         else{
-          attributes.push([literal(`SUM(CASE WHEN ${field} = '${group[yAxis[0].key]}' THEN 1 ELSE 0 END)`), group[yAxis[0].key]])
+          attributes.push([literal(`SUM(CASE WHEN ${field} = '${group[yAxis[0].key]}' THEN 1 ELSE 0 END)`), `${group[yAxis[0].key]}` ])
         }
       })
 

package/src/widgets/PresetBar.vue

@@ -85,7 +85,7 @@
                     body-class="divide-y divide-text-50"
                     @reorder="(from, to) => { presetColumns.splice(to, 0, presetColumns.splice(from, 1)[0]); }">
             <template v-slot="{ item }">
-              <div class="flex flex-row items-center gap-3 px-3 p-2 hover:bg-primary-100">
+              <div v-if="!item.key.startsWith('_') || (item.key.startsWith('_') && (preset.pivot && preset.pivot.enabled))" class="flex flex-row items-center gap-3 px-3 p-2 hover:bg-primary-100">
                 <div data-reorder>
                   <svg width="14" height="14" class="fill-text-300" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512"><path d="M496 288H16c-8.8 0-16 7.2-16 16v32c0 8.8 7.2 16 16 16h480c8.8 0 16-7.2 16-16v-32c0-8.8-7.2-16-16-16zm0-128H16c-8.8 0-16 7.2-16 16v32c0 8.8 7.2 16 16 16h480c8.8 0 16-7.2 16-16v-32c0-8.8-7.2-16-16-16z"/></svg>
                 </div>
@@ -104,7 +104,7 @@
 
           <div class="flex-1 flex flex-col">
 
-            <div v-for="(filter, idx) in preset.filters" class="p-5">
+            <div v-for="(filter, idx) in preset.filters">
 
               <div class="flex flex-row items-start gap-2">
                 <Checkbox v-model="filter.enabled" :default="true" />
@@ -522,10 +522,7 @@ export default{
         this.preset.columns = JSON.parse(JSON.stringify(this.config.columns))
       }
 
-      if(this.preset.pivot && this.preset.pivot.enabled){
-        return this.preset.columns
-      }
-      return this.preset.columns.filter(_ => !_.key.startsWith('_'))
+      return this.preset.columns
     },
 
     presetPivot(){