@mixd-id/web-scaffold 0.1.2301231352 → 0.1.2301231354

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@mixd-id/web-scaffold",
   "private": false,
-  "version": "0.1.2301231352",
+  "version": "0.1.2301231354",
   "scripts": {
     "dev": "vite serve",
     "build": "vite build",
@@ -24,6 +24,7 @@
     "@vueuse/core": "^9.0.2",
     "adm-zip": "^0.5.10",
     "axios": "^1.3.4",
+    "chart.js": "^4.2.1",
     "compression": "^1.7.4",
     "cookie-parser": "^1.4.6",
     "cors": "^2.8.5",
@@ -41,13 +42,13 @@
     "serve-static": "^1.15.0",
     "tailwindcss": "^3.2.4",
     "vue": "^3.2.25",
+    "vue-chartjs": "^5.2.0",
     "vue-router": "^4.0.14"
   },
   "devDependencies": {
     "@vitejs/plugin-vue": "^2.2.0",
     "autoprefixer": "^10.4.4",
     "postcss": "^8.4.12",
-    "sequelize": "^6.29.0",
     "vite": "^2.8.0"
   },
   "description": "This scaffold based on express vitejs vuejs",

package/src/components/ContextMenu.vue

@@ -56,7 +56,8 @@ export default {
 		return {
 			computedStyle: null,
 			isOpen: false,
-			context: null
+			context: null,
+			closing: false
 		}
 	},
 
@@ -80,16 +81,17 @@ export default {
 			if(typeof window === 'undefined') return
 
 			const transitionEnd = () => {
-				this.$emit('open')
 				window.addEventListener('click', this.onDismiss)
 				window.addEventListener('scroll', this.onDismiss)
 				this.$refs.contextMenu.removeEventListener('transitionend', transitionEnd)
+				this.$emit('open')
 			}
 
+			this.$refs.contextMenu.removeEventListener('transitionend', transitionEnd)
 			this.$refs.contextMenu.addEventListener('transitionend', transitionEnd)
-			window.setTimeout(() => {
+			this.$nextTick(() => {
 				this.$refs.contextMenu.classList.add(this.$style.active)
-			}, 77)
+			})
 		},
 
 		onDismiss(e){
@@ -104,6 +106,14 @@ export default {
 
 		open(caller, context){
 
+			if(this.isOpen){
+				return this.close(() => {
+					window.setTimeout(() => {
+						this.open(caller, context)
+					}, 30)
+				})
+			}
+
 			if(caller){
 				this.isOpen = true
 			}
@@ -181,10 +191,9 @@ export default {
 			else{
 				console.warn('Invalid context menu caller', this.caller)
 			}
-
 		},
 
-		close(){
+		close(fn){
 			const transitionEnd = () => {
 				window.removeEventListener('click', this.onDismiss)
 				window.removeEventListener('scroll', this.onDismiss)
@@ -194,7 +203,9 @@ export default {
 				this.computedStyle = null
 				this.isOpen = false
 				this.$emit('dismiss')
+				if(fn) fn()
 			}
+			this.$refs.contextMenu.removeEventListener('transitionend', transitionEnd)
 			this.$refs.contextMenu.addEventListener('transitionend', transitionEnd)
 			this.$refs.contextMenu.classList.remove(this.$style.active)
 		}

package/src/components/ListPage1.vue

@@ -43,16 +43,13 @@
 					</div>
 				</div>
 
-				<VirtualScroll v-if="isMobile.value" :items="items" class="flex-1" @scroll-end="loadNext">
-					<template #item="{ item, index }">
-						<slot v-if="$slots.mobile" name="mobile" :item="item" :index="index"></slot>
-						<div v-else>
-							<div class="h-[2rem] bg-base-300 rounded-lg my-2"></div>
-						</div>
-					</template>
-				</VirtualScroll>
+				<div class="flex-1 mb-4 flex flex-col bg-base-500 border-text-50 border-[1px]" v-if="summary">
+					<VirtualTable v-if="preset.summary.mode === 'table'" :items="summaryItems" :columns="summaryColumns" class="flex-1"></VirtualTable>
+					<Bar v-else-if="preset.summary.mode === 'bar'" :data="chartData" :options="chartOptions" class="flex-1 w-full p-2"/>
+					<Line v-else-if="preset.summary.mode === 'line'" :data="chartData" :options="chartOptions" class="flex-1 w-full p-2"/>
+				</div>
 
-				<VirtualTable v-else class="flex-1" :columns="presetColumns" :items="items"
+				<VirtualTable v-if="!hideDetails" class="flex-1" :columns="presetColumns" :items="items"
 											:appearances="appearances" @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))">
@@ -163,7 +160,7 @@
 					</div>
 
 					<div class="flex justify-center">
-						<Tabs v-model="layout.presetTab" :items="[{text:'Columns',value:'column'},{text:'Filters',value:'filter'},{text:'Sorts',value:'sort'}]" />
+						<Tabs v-model="layout.presetTab" :items="tabItems" />
 					</div>
 				</div>
 
@@ -187,7 +184,7 @@
 						</ListItem>
 					</div>
 
-					<div class="flex flex-col" v-if="layout.presetTab === 'filter'">
+					<div class="flex flex-col" v-else-if="layout.presetTab === 'filter'">
 						<div v-if="filterableColumns.length > 0">
 							<ListPage1Filter v-if="preset.filters" v-for="filter in preset.filters"
 															 :filter="filter" :column="columns[filter.key]"
@@ -206,7 +203,7 @@
 						</div>
 					</div>
 
-					<div class="flex flex-col" v-if="layout.presetTab === 'sort'">
+					<div class="flex flex-col" v-else-if="layout.presetTab === 'sort'">
 						<div v-if="sortableColumns.length > 0" class="my-8">
 							<div v-for="sort in preset.sorts" class="py-4">
 								<div class="flex flex-row items-center gap-2">
@@ -244,9 +241,85 @@
 						</div>
 					</div>
 
-				</div>
+					<div class="flex flex-col gap-3 py-8" v-else-if="layout.presetTab === 'summary'">
+
+						<div class="flex flex-row items-center p-3">
+							<label class="text-text-400 flex-1">Enabled</label>
+							<Checkbox v-model="preset.summary.enabled" @change="load"/>
+						</div>
+
+						<div class="flex flex-row items-center p-3">
+							<label class="text-text-400 flex-1">Hide Details</label>
+							<Checkbox v-model="preset.summary.hideDetails" @change="load"/>
+						</div>
+
+						<div class="p-3">
+							<label class="text-text-400 flex-1">Type</label>
+							<div class="mt-2">
+								<Dropdown v-model="preset.summary.mode" class="flex-1" @change="load">
+									<option value="table">{{ $t('Table') }}</option>
+									<option value="bar">{{ $t('Bar Chart') }}</option>
+									<option value="line">{{ $t('Line Chart') }}</option>
+								</Dropdown>
+							</div>
+						</div>
+
+						<div class="p-3">
+							<label class="text-text-400 flex-1">{{ preset.summary.mode === 'table' ? $t('Row') : $t('X-axis') }}</label>
+							<div class="flex flex-row mt-2 gap-2">
+								<Dropdown v-model="preset.summary.rows[0].key" class="flex-1" @change="load">
+									<option value="" disabled selected>{{ $t('Add Column') }}</option>
+									<option v-for="column in filterableColumns" :value="column.key">{{ column.label }}</option>
+								</Dropdown>
+								<Dropdown v-model="preset.summary.rows[0].format" class="w-[100px]" @change="load">
+									<option value="">{{ $t('Default') }}</option>
+									<option value="date">{{ $t('Date') }}</option>
+									<option value="month">{{ $t('Month') }}</option>
+									<option value="year">{{ $t('Year') }}</option>
+								</Dropdown>
+							</div>
+							<Checkbox class="mt-2" v-if="preset.summary.mode === 'table'" v-model="preset.summary.showRowTotal">
+								Row Total
+							</Checkbox>
+						</div>
 
-				<div class="px-6 py-3 flex flex-row gap-2"></div>
+						<div class="p-3">
+							<label class="text-text-400 flex-1">{{ preset.summary.mode === 'table' ? $t('Column') : $t('Dimension') }}</label>
+							<div class="flex flex-row mt-2 gap-2">
+								<Dropdown v-model="preset.summary.columns[0].key" class="flex-1" @change="load">
+									<option value="" disabled selected>{{ $t('Add Column') }}</option>
+									<option value="(none)">{{ $t('None') }}</option>
+									<option v-for="column in filterableColumns" :value="column.key">{{ column.label }}</option>
+								</Dropdown>
+								<Dropdown v-model="preset.summary.columns[0].format" class="w-[100px]" @change="load">
+									<option value="">{{ $t('Default') }}</option>
+									<option value="date">{{ $t('Date') }}</option>
+								</Dropdown>
+							</div>
+							<Checkbox class="mt-2" v-if="preset.summary.mode === 'table'" v-model="preset.summary.showColumnTotal">
+								Column Total
+							</Checkbox>
+							<Checkbox class="mt-2" v-else-if="preset.summary.mode === 'bar'" v-model="preset.summary.stacked">
+								Stacked
+							</Checkbox>
+						</div>
+
+						<div class="p-3">
+							<label class="text-text-400 flex-1">Values</label>
+							<div class="flex flex-row mt-2 gap-2">
+								<Dropdown v-model="preset.summary.values[0].aggregrate" class="flex-1" @change="load">
+									<option value="" disabled selected>{{ $t('Select') }}</option>
+									<option value="count">{{ $t('Count') }}</option>
+									<option value="max">{{ $t('Max') }}</option>
+									<option value="min">{{ $t('Min') }}</option>
+									<option value="avg">{{ $t('Avg') }}</option>
+								</Dropdown>
+							</div>
+						</div>
+
+					</div>
+
+				</div>
 
 			</div>
 
@@ -261,9 +334,14 @@
 
 import throttle from "lodash/throttle";
 import {urlQuery} from "../utils/helpers.mjs";
+import { Bar, Line } from 'vue-chartjs'
+import Chart from 'chart.js/auto'
+import dayjs from "dayjs";
 
 export default{
 
+	components: { Bar, Line },
+
 	inject: [ 'socket', 'confirm', 'alert', 'socketEmit', 'toast' ],
 
 	props:{
@@ -345,12 +423,169 @@ export default{
 		currentFilters(){
 			if(!this.preset.filters) return []
 			return this.preset.filters.filter((_) => _.key === this.selectedColumn)
+		},
+
+		chartOptions(){
+
+			var style = getComputedStyle(document.body)
+			var gridColor = style.getPropertyValue('--text-50')
+			var gridColor2 = style.getPropertyValue('--text-200')
+
+			const baseColumn = this.summary.columns[0]
+			const baseColumnType = baseColumn.type
+
+			let highGrids = []
+			if(baseColumnType === 'date'){
+				this.summary.items.forEach((item) => {
+					if(dayjs(item.dfDate).day() === 1){
+						highGrids.push(dayjs(item.dfDate).format('D MMM'))
+					}
+				})
+			}
+
+			return {
+				responsive: true,
+				maintainAspectRatio: false,
+				plugins: {
+					legend: true
+				},
+				scales: {
+					x: {
+						grid: {
+							color: function(context){
+								if(baseColumnType === 'date' && context.tick && highGrids.includes(context.tick.label)){
+									return `rgb(${gridColor2})`
+								}
+								return `rgb(${gridColor})`
+							}
+						},
+						stacked: this.preset.summary.stacked
+					},
+					y: {
+						grid: {
+							color: function(context){
+								return `rgb(${gridColor})`
+							}
+						}
+					}
+				}
+			}
+		},
+
+		chartData(){
+
+			//console.log(this.summary)
+
+			const column = this.summary.columns.filter((_) => _.key === 'dfDate').pop()
+
+			const labels = []
+			this.summary.items.forEach((item) => {
+
+				let label = item.dfDate
+				switch(column.type){
+
+					case 'date':
+						const dateFormat = column.format ?? 'D MMM YY HH:mm:ss'
+						const djs = dayjs(item.dfDate)
+						label = djs.isValid() ? djs.format(dateFormat) : item.dfDate
+						break
+				}
+				labels.push(label)
+			})
+
+			const datasets = []
+			this.summary.columns.forEach((column) => {
+				if(column.key === 'dfDate') return
+
+				const data = []
+				this.summary.items.forEach((item) => {
+					data.push(parseInt(item[column.key]))
+				})
+
+				const dataset = {
+					label: column.key,
+					data,
+					backgroundColor: this.chartOpt.backgroundColors[datasets.length % 9],
+					borderColor: this.chartOpt.borderColors[datasets.length % 9]
+				}
+
+				datasets.push(dataset)
+			})
+
+			//console.log(labels)
+			//console.log(datasets)
+
+			return {
+				labels,
+				datasets
+			}
+
+			/*return {
+				labels: [ 'January', 'February', 'March' ],
+				datasets: [ { data: [40, 20, 12] } ]
+			}*/
+		},
+
+		hideDetails(){
+			if(this.preset && this.preset.summary && this.preset.summary.hideDetails)
+				return this.preset.summary.hideDetails
+			return false;
+		},
+
+		summaryColumns(){
+
+			const columns = [ ...this.summary.columns ]
+
+			if(this.preset.summary.showColumnTotal){
+				columns.push({ key:"_total", label:"Total", visible:true, type:"number" })
+			}
+
+			return columns
+		},
+
+		summaryItems(){
+
+			const items = [ ...this.summary.items ]
+
+			//console.log('#1', this.preset.summary.showColumnTotal, this.preset.summary.showRowTotal, items.length)
+
+			if(this.preset.summary.showColumnTotal){
+				items.forEach((item) => {
+					let total = 0
+					for(let key in item){
+						if([ 'dfDate', '_total' ].includes(key)) continue
+						total += parseInt(item[key])
+					}
+					item._total = total
+				})
+			}
+
+			if(this.preset.summary.showRowTotal){
+				const totalItem = { dfDate:"Total" }
+				this.summary.items.forEach((item) => {
+
+					for(let key in item){
+						if([ 'dfDate' ].includes(key)) continue
+
+						if(!(key in totalItem))
+							totalItem[key] = 0
+						totalItem[key] += parseInt(item[key])
+					}
+				})
+				items.push(totalItem)
+			}
+
+			return items
 		}
 
 	},
 
 	data(){
 		return {
+			chartOpt: {
+				backgroundColors: [ '#5D9CEC', '#4FC1E9', '#48CFAD', '#A0D468', '#FFCE54', '#FC6E51', '#ED5565', '#AC92EC', '#EC87C0' ],
+				borderColors: [ '#4A89DC', '#3BAFDA', '#37BC9B', '#8CC152', '#F6BB42', '#E9573F', '#DA4453', '#967ADC', '#D770AD' ],
+			},
 			layout: {
 				presetOpen: false,
 				presetTab: 'column',
@@ -358,12 +593,19 @@ export default{
 				presetFilterSelector: null,
 				presetSortSelector: null,
 			},
+			tabItems: [
+				{ text:'Columns', value:'column' },
+				{ text:'Filters', value:'filter' },
+				{ text:'Sorts', value:'sort' },
+				{ text:'Summary', value:'summary' },
+			],
 			name: null,
 			columns: [],
 			selectedColumn: null,
 			presets: [],
 			presetIdx: -1,
 			items: [],
+			summary: null,
 			count: null,
 			hasNext: false,
 			modal: null
@@ -399,6 +641,7 @@ export default{
 				this.patchPresets()
 				this.$nextTick(() => {
 					this.items = data.items
+					this.summary = data.summary
 					this.hasNext = data.hasNext
 					this.count = data.count
 				})
@@ -452,8 +695,10 @@ export default{
 				preset: this.preset
 			}, (res) => {
 				const data = res.data ? res.data : res
-				//console.log('load', data)
-				Object.assign(this.$data, data)
+				this.items = data.items
+				this.summary = data.summary
+				this.hasNext = data.hasNext
+				this.count = data.count
 			})
 		},
 

package/src/components/VirtualTable.vue

@@ -331,12 +331,13 @@ export default{
 			}
 
 			let text = value
+			let dateFormat, val
 			switch(column.type){
 
 				case 'date':
-					const dateFormat = column.format ?? 'DD MMM YY HH:mm'
-					const val = dayjs(value)
-					text = val.isValid() ? val.format(dateFormat) : ''
+					dateFormat = column.format ?? 'D MMM YY HH:mm:ss'
+					val = dayjs(value)
+					text = val.isValid() ? val.format(dateFormat) : value
 					break
 
 				case 'currency':

package/src/utils/listpage1.js

@@ -1,5 +1,5 @@
-const { Op } = require('sequelize')
-const Sequelize = require('sequelize')
+const { Op } = module.parent.require('sequelize')
+const Sequelize = module.parent.require('sequelize')
 const dayjs = require("dayjs");
 const util = require("util");
 
@@ -107,11 +107,12 @@ let ListPage1 = {
     }
 
     if(preset.search){
+      const tableName = this.model.tableName
       where = {
         ...where,
-        [Op.and]: Sequelize.literal('MATCH(tag) AGAINST (? IN BOOLEAN MODE)')
+        [Op.and]: Sequelize.literal(`MATCH(\`${tableName}\`.tag) AGAINST (? IN BOOLEAN MODE)`)
       }
-      replacements.push(ftW)
+      replacements.push(preset.search)
     }
 
     if(afterItem){
@@ -124,7 +125,7 @@ let ListPage1 = {
 
     let attributeIncludes
     if(this.getAttributeIncludes){
-      attributeIncludes = this.getAttributeIncludes()
+      attributeIncludes = this.getAttributeIncludes(preset)
     }
 
     const { rows:items, count } = await this.model.findAndCountAll({
@@ -136,7 +137,7 @@ let ListPage1 = {
       order,
       limit: itemsPerPage + 1,
       replacements,
-      include: this.getModelIncludes ? this.getModelIncludes() : undefined
+      include: this.getModelIncludes ? this.getModelIncludes(preset) : undefined
     })
 
     const hasNext = items.length > itemsPerPage
@@ -144,6 +145,14 @@ let ListPage1 = {
       items.splice(items.length - 1, 1)
     }
 
+    let summary
+    if(!afterItem && preset.summary && preset.summary.enabled){
+      summary = await this.loadSummary(preset, {
+        where,
+        replacements
+      })
+    }
+
     if(this.socket){
       this.socket.joinWithArgs(this.channel, { preset })
     }
@@ -151,8 +160,157 @@ let ListPage1 = {
     return {
       items,
       hasNext,
-      count
+      count,
+      summary
+    }
+  },
+
+  async loadSummary(preset, modelParams){
+
+    const { columns, rows, values } = preset.summary
+
+    if(!Array.isArray(columns) || columns.length !== 1) return
+    if(!Array.isArray(rows) || rows.length !== 1) return
+    if(!Array.isArray(values) || values.length !== 1) return
+
+    const col = columns[0]
+    let columnValues = []
+    let colKey
+    if(col.key !== '(none)'){
+      colKey = this.model.rawAttributes[col.key].field
+      columnValues = await this.model.findAll({
+        attributes: [
+          [ Sequelize.fn("DISTINCT", Sequelize.col(colKey)), 'cols' ]
+        ],
+        order: [
+          [ colKey, 'asc' ]
+        ],
+        ...modelParams
+      })
+      //console.log(columnValues)
+    }
+
+    const attributes = []
+    const group = []
+    const summaryColumns = [
+      /*{ key:"dfDate", label:"Date", width:"200px", visible:true },
+      { key:"type-1", label:"Type 1", type:"number", visible:true },
+      { key:"type-2", label:"Type 2", type:"number", visible:true },
+      { key:"type-3", label:"Type 3", type:"number", visible:true },
+      { key:"type-4", label:"Type 4", type:"number", visible:true },
+      { key:"type-8", label:"Type 8", type:"number", visible:true },*/
+    ]
+
+    const row = rows[0]
+    const rowKey = this.model.rawAttributes[row.key].field
+    const rowLabel = this.columns[row.key].label
+    switch(row.format){
+      case 'date':
+        attributes.push([Sequelize.fn("DATE_FORMAT", Sequelize.col(rowKey), '%Y-%m-%d'), "dfDate"])
+        group.push([Sequelize.fn("DATE_FORMAT", Sequelize.col(rowKey), '%Y-%m-%d'), "dfDate"])
+        summaryColumns.push({ key:"dfDate", label:rowLabel, width:"200px", visible:true, type:"date", format:"D MMM" })
+        break
+
+      case 'month':
+        attributes.push([Sequelize.fn("DATE_FORMAT", Sequelize.col(rowKey), '%Y-%m'), "dfDate"])
+        group.push([Sequelize.fn("DATE_FORMAT", Sequelize.col(rowKey), '%Y-%m'), "dfDate"])
+        summaryColumns.push({ key:"dfDate", label:rowLabel, width:"200px", visible:true, type:"date", format:"MMM YYYY" })
+        break
+
+      case 'year':
+        attributes.push([Sequelize.fn("DATE_FORMAT", Sequelize.col(rowKey), '%Y'), "dfDate"])
+        group.push([Sequelize.fn("DATE_FORMAT", Sequelize.col(rowKey), '%Y'), "dfDate"])
+        summaryColumns.push({ key:"dfDate", label:rowLabel, width:"200px", visible:true, type:"date", format:"YYYY" })
+        break
+
+      default:
+        attributes.push([Sequelize.col(rowKey), "dfDate"])
+        group.push([Sequelize.col(rowKey), "dfDate"])
+        summaryColumns.push({ key:"dfDate", label:rowLabel, width:"200px", visible:true })
+        break
     }
+
+    const value = values[0]
+    if(columnValues.length > 0){
+      columnValues.forEach((obj) => {
+        const columnValue = obj.dataValues['cols']
+
+        switch(value.aggregrate){
+          case 'count':
+            attributes.push([Sequelize.fn("SUM", Sequelize.fn("IF", Sequelize.literal(`${colKey} = '${columnValue}'`), 1, 0)), colKey + "-" + columnValue])
+            summaryColumns.push({ key:colKey + "-" + columnValue, label:(columnValue ?? '').toString(), visible:true, aggregrate:"count" })
+            break
+
+          case 'min':
+            attributes.push([Sequelize.fn("MIN", colKey), colKey + "-" + columnValue])
+            summaryColumns.push({ key:colKey + "-" + columnValue, label:(columnValue ?? '').toString(), visible:true, aggregrate:"count" })
+            break
+
+          case 'max':
+            attributes.push([Sequelize.fn("MAX", colKey), colKey + "-" + columnValue])
+            summaryColumns.push({ key:colKey + "-" + columnValue, label:(columnValue ?? '').toString(), visible:true, aggregrate:"count" })
+            break
+
+          case 'avg':
+            attributes.push([Sequelize.fn("AVG", colKey), colKey + "-" + columnValue])
+            summaryColumns.push({ key:colKey + "-" + columnValue, label:(columnValue ?? '').toString(), visible:true, aggregrate:"count" })
+            break
+        }
+      })
+    }
+    else{
+      switch(value.aggregrate) {
+        case 'count':
+        default:
+          attributes.push([Sequelize.fn('count', '*'), 'Count'])
+          summaryColumns.push({ key:'Count', label:'Count', type:"number", visible:true, aggregrate:"count" })
+      }
+    }
+
+    //console.log(attributes)
+
+    const summaryItems = await this.model.findAll({
+      attributes,
+      group,
+      order: [
+        [ 'dfDate', 'asc' ]
+      ],
+      ...modelParams
+    })
+    /*const summaryItems = await this.model.findAll({
+      attributes: [
+        [Sequelize.fn("DATE_FORMAT", Sequelize.col("created_at"), '%Y-%m-%d'), "dfDate"],
+        [Sequelize.fn("SUM", Sequelize.fn("IF", Sequelize.literal("type = 1"), 1, 0)), "type-1"],
+        [Sequelize.literal("SUM(IF(type =  2, 1, 0))"), "type-2"],
+        [Sequelize.literal("SUM(IF(type =  3, 1, 0))"), "type-3"],
+        [Sequelize.literal("SUM(IF(type =  4, 1, 0))"), "type-4"],
+        [Sequelize.literal("SUM(IF(type =  8, 1, 0))"), "type-8"],
+      ],
+      group: [
+        [Sequelize.fn("DATE_FORMAT", Sequelize.col("created_at"), '%Y-%m-%d')]
+      ],
+      order: [
+        [ 'dfDate', 'asc' ]
+      ],
+      ...modelParams
+    })*/
+    //console.log(summaryItems)
+
+    const summary = {
+      type: "table",
+      columns: summaryColumns,
+      items: summaryItems
+      /*items: [
+        { date:"21 Jan 23", "type-1":12, "type-2":11, "type-3":16, "type-4":2, "type-8":8 },
+        { date:"22 Jan 23", "type-1":51, "type-2":87, "type-3":86, "type-4":3, "type-8":9 },
+        { date:"23 Jan 23", "type-1":14, "type-2":66, "type-3":77, "type-4":4, "type-8":18 },
+        { date:"24 Jan 23", "type-1":7, "type-2":3, "type-3":63, "type-4":5, "type-8":28 },
+        { date:"25 Jan 23", "type-1":88, "type-2":55, "type-3":68, "type-4":6, "type-8":38 },
+        { date:"26 Jan 23", "type-1":172, "type-2":13, "type-3":6, "type-4":7, "type-8":48 }
+      ]*/
+    }
+
+    return summary
   },
 
   async subscribe(params, socket){