@mixd-id/web-scaffold 0.1.240411029 → 0.1.240411031

package/package.json

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

package/src/components/Datepicker.vue

@@ -1,7 +1,7 @@
 <template>
 
 	<div v-if="mode === ''" :class="compClass" class="divide-x divide-text-50">
-    <div class="w-[50px] flex flex-row items-center relative">
+    <div class="w-[80px] flex flex-row items-center relative">
       <select v-model="DD" class="text-left w-full flex-1 px-3">
         <option disabled selected>Tanggal</option>
         <option v-for="d in 31" :value="d.toString().padStart(2, '0')">{{ d }}</option>
@@ -14,7 +14,7 @@
       </div>
     </div>
 
-    <div class="w-[60px] flex flex-row items-center relative">
+    <div class="w-[120px] flex flex-row items-center relative">
       <select v-model="MM" class="text-left w-full flex-1 px-3">
         <option disabled selected>Bulan</option>
         <option v-for="mmm in months" :value="mmm[0]">{{ mmm[1] }}</option>
@@ -27,7 +27,7 @@
       </div>
     </div>
 
-    <div class="w-[70px] flex flex-row items-center relative">
+    <div class="w-[100px] flex flex-row items-center relative">
       <select v-model="YYYY" class="text-left w-full flex-1 px-3">
         <option disabled selected>Tahun</option>
         <option v-for="yyyy in years" :value="yyyy">{{ yyyy }}</option>
@@ -127,8 +127,6 @@ for(let i = -100 ; i < 50 ; i++){
 	YEARS.push(currentYear + i)
 }
 
-const currentDate = dayjs().format('YYYY-MM-DD')
-
 export default{
 
   setup(props, { emit }){

package/src/components/List.vue

@@ -985,8 +985,15 @@ export default{
     },
 
     preset(){
-      return this.configPresets.find(_ => _.uid === this.configParams.presetIdx) ??
+      const preset = this.configPresets.find(_ => _.uid === this.configParams.presetIdx) ??
           this.configSharedPresets.find(_ => _.uid === this.configParams.presetIdx)
+
+      if(preset){
+        if(this.$route.query?.search)
+          preset.search = this.$route.query.search
+      }
+
+      return preset
     },
 
     presetSrc(){

package/src/utils/importer.js

@@ -5,6 +5,27 @@ const glob = require("glob");
 const Exceljs = require("exceljs")
 const { saveBuffer, unflatten } = require('./helpers.js')
 
+const getCellText = (cell) => {
+  if(!cell) return ''
+
+  let value = ''
+  if(cell.formulaType === 1){
+    value = cell.result
+  }
+  else if(cell.value?.error){
+    value = '#ERR'
+  }
+  else if(cell.value?.hyperlink){
+    value = cell.value.hyperlink
+  }
+  else{
+    value = cell.value
+  }
+
+  return value
+
+}
+
 const analyseRequest = async(req) => {
 
   const file = req.files[0]
@@ -161,9 +182,7 @@ const importRequest = async(req) => {
         const key = keys[idx]
         if(key.value && columnAddress[key.value]){
           const cell = row.getCell(columnAddress[key.value])
-          let value = cell.formulaType === 1 ? cell.result : cell.value
-          if(value && value.error) value = ''
-          obj[key.key] = value
+          obj[key.key] = getCellText(cell)
         }
       }
 

package/src/utils/wss.js

@@ -131,10 +131,6 @@ class WSS extends EventEmitter2{
         if(subscriber){
           subscriber.unsubscribe(channel, listener)
         }
-
-        if(process.verbose){
-          process.verbose('wss.leave', channel)
-        }
       }
 
       socket.join = (channel) => {
@@ -146,10 +142,6 @@ class WSS extends EventEmitter2{
         if(subscriber) {
           subscriber.subscribe(channel, listener)
         }
-
-        if(process.verbose){
-          process.verbose('wss.join', channel)
-        }
       }
 
       socket.to = (channel) => {
@@ -297,15 +289,6 @@ class WSS extends EventEmitter2{
 
     for(let channel of channels){
       await this._client.publish(channel, JSON.stringify({ model, event, items }))
-
-      if(process.verbose){
-        process.verbose('wss.broadcast', {
-          channel,
-          model,
-          event,
-          items
-        })
-      }
     }
   }
 

package/src/utils/wss.mjs

@@ -186,6 +186,8 @@ class WSS extends EventEmitter2{
     Object.assign(this._opt, opt)
 
     await this.connect(true)
+
+    console.log('RECONNECTED')
   }
 
   sendSync(path, params, cb, err, override){
@@ -222,12 +224,12 @@ class WSS extends EventEmitter2{
           t1: new Date().getTime()
         }
 
-        const timeout = (override ?? {}).timeout ?? this._opt.timeout
+        /*const timeout = (override ?? {}).timeout ?? this._opt.timeout
         setTimeout(() => {
           if(this._callbacks[_requestId] && this._instance.readyState === 1){
             err({ message: 'Timeout' })
           }
-        }, timeout)
+        }, timeout)*/
       })
   }
 

package/src/widgets/WebLayoutSelector.vue

@@ -1,5 +1,5 @@
 <template>
-	<Modal ref="modal" :width="computedWidth" height="600">
+	<Modal ref="modal" width="420" height="480">
 		<template v-slot:head>
 			<div class="relative p-6">
 				<h3>{{ $t('Create Layout') }}</h3>
@@ -23,13 +23,10 @@
 
         <div>
           <label class="text-text-400">Layouts</label>
-          <div class="grid grid-cols-4 gap-2">
-            <div v-for="template in templates"
-                 :class="$style.templateItem + (instance === template ? ' ' + $style.active : '')"
-                 @click="applyTemplate(template)">
-              <Image :src="template.imageUrl" class="aspect-[1/2]"/>
-              <label>{{ template.layout.name }} </label>
-            </div>
+          <div class="grid grid-cols-4 gap-2 mt-3">
+            <Radio v-for="(template, index) in templates" v-model="instance.templateIndex" :value="index">
+              {{ template.layout.name }}
+            </Radio>
           </div>
         </div>
 
@@ -37,7 +34,7 @@
 		</template>
 
     <template v-slot:foot>
-      <div class="p-5 flex justify-end">
+      <div class="p-5 flex">
         <Button class="w-[100px]"
                 ref="applyBtn"
                 :state="canApply ? 1 : -1"
@@ -68,182 +65,6 @@ export default{
 						footers: []
 					}
 				},
-				{
-					imageUrl: '/assets/templates/layout1.png',
-					layout: {
-						name: 'Nike',
-						headers: [
-							{
-								"type": "Flex",
-								"name": "Flex",
-								"group": "Layouts",
-								"items": [
-									{
-										"type": "Image",
-										"name": "Image",
-										"group": "Components",
-										"props": {
-											"src": [
-												"66aafad893b123b69dfcf4ef0f850537.png"
-											],
-											"enabled": true,
-											"aspectRatio": [],
-											"display": [],
-											"opacity": [],
-											"padding": [],
-											"margin": [],
-											"width": [],
-											"minWidth": [],
-											"maxWidth": [],
-											"height": [
-												"h-10vh"
-											],
-											"minHeight": [],
-											"maxHeight": [],
-											"overflow": [],
-											"colSpan": [],
-											"bgColors": [],
-											"bgImage": [
-												{},
-												{}
-											],
-											"bgSize": [],
-											"bgPosition": [],
-											"bgRepeat": [],
-											"bdSize": [],
-											"bdColor": [],
-											"bdRadius": [],
-											"bdStyle": [],
-											"boxShadow": []
-										},
-										"uid": "e9431764daac79e6d12eaaffb6db048b",
-										"instance": {
-											"type": "Image",
-											"uid": "e9431764daac79e6d12eaaffb6db048b",
-											"class": "h-10vh",
-											"src": [
-												"66aafad893b123b69dfcf4ef0f850537.png"
-											],
-											"bgImage": [
-												{},
-												{}
-											]
-										}
-									}
-								],
-								"props": {
-									"flexColumns": [],
-									"direction": [
-										"flex-col"
-									],
-									"gap": [],
-									"enabled": true,
-									"display": [],
-									"opacity": [],
-									"padding": [],
-									"margin": [],
-									"width": [],
-									"minWidth": [],
-									"maxWidth": [],
-									"height": [],
-									"minHeight": [],
-									"maxHeight": [],
-									"overflow": [],
-									"colSpan": [],
-									"bgColors": [
-										"bg-white"
-									],
-									"bgImage": [
-										{},
-										{}
-									],
-									"bgSize": [],
-									"bgPosition": [],
-									"bgRepeat": [],
-									"bdSize": [],
-									"bdColor": [],
-									"bdRadius": [],
-									"bdStyle": [],
-									"boxShadow": []
-								},
-								"uid": "f121447f5dbb20f624b2cc1c45508005",
-								"instance": {
-									"type": "Flex",
-									"uid": "f121447f5dbb20f624b2cc1c45508005",
-									"class": "bg-white flex-col",
-									"flexColumns": [],
-									"bgImage": [
-										{},
-										{}
-									],
-									"items": [
-										{
-											"type": "Image",
-											"name": "Image",
-											"group": "Components",
-											"props": {
-												"src": [
-													"66aafad893b123b69dfcf4ef0f850537.png"
-												],
-												"enabled": true,
-												"aspectRatio": [],
-												"display": [],
-												"opacity": [],
-												"padding": [],
-												"margin": [],
-												"width": [],
-												"minWidth": [],
-												"maxWidth": [],
-												"height": [
-													"h-10vh"
-												],
-												"minHeight": [],
-												"maxHeight": [],
-												"overflow": [],
-												"colSpan": [],
-												"bgColors": [],
-												"bgImage": [
-													{},
-													{}
-												],
-												"bgSize": [],
-												"bgPosition": [],
-												"bgRepeat": [],
-												"bdSize": [],
-												"bdColor": [],
-												"bdRadius": [],
-												"bdStyle": [],
-												"boxShadow": []
-											},
-											"uid": "e9431764daac79e6d12eaaffb6db048b",
-											"instance": {
-												"type": "Image",
-												"uid": "e9431764daac79e6d12eaaffb6db048b",
-												"class": "h-10vh",
-												"src": [
-													"66aafad893b123b69dfcf4ef0f850537.png"
-												],
-												"bgImage": [
-													{},
-													{}
-												]
-											}
-										}
-									]
-								}
-							}
-						],
-						footers: []
-					}
-				},
-				{
-					imageUrl: '/assets/templates/layout2.png',
-					layout: {
-						name: 'Apple',
-						headers: [],
-						footers: []
-					}
-				},
 			]
 		}
 
@@ -262,17 +83,15 @@ export default{
       this.$refs.modal.open()
 		},
 
-    applyTemplate(template){
-      Object.assign(this.instance, template.layout)
-    },
-
 		close(){
       this.$refs.modal.close()
 		},
 
 		apply(){
-			this.$emit('apply', this.instance)
-			this.close()
+			this.$emit('apply', {
+        title: this.instance.title,
+        ...(this.templates[this.instance.templateIndex].layout)
+      })
 		}
 
 	},
@@ -284,7 +103,7 @@ export default{
 		},
 
 		computedWidth(){
-			return 800;
+			return 520;
 		}
 
 	},

package/src/widgets/WebPageBuilder.vue

@@ -180,12 +180,6 @@
 
             <div v-else-if="store.tabIndex === 2" class="flex-1 overflow-y-auto p-6 flex flex-col gap-6">
 
-              <div v-if="store.layoutMode && layout" class="flex flex-row gap-2">
-                <label class="flex-1 text-text-400">{{ $t('Style')}}</label>
-                <button type="button" class="text-primary"
-                        @click="store.selectedComponent = [ 'style' ]">Edit Style</button>
-              </div>
-
               <div>
                 <div class="flex flex-row gap-1 items-end cursor-pointer">
                   <small class="flex-1 text-text-400 text-overflow-ellipsis">{{ $t('Components')}}</small>
@@ -740,7 +734,9 @@ export default{
           .then(layout => {
             this.loadLayouts()
             this.page.layoutId = layout.id
+            this.$refs.webLayoutSelector.close()
           })
+          .catch(err => this.alert(err))
     },
 
     createStyleSheet(styles){