@simitgroup/simpleapp-generator 1.6.6-i-alpha → 1.6.6-k-alpha

package/templates/nest/src/simpleapp/simpleapp.module.ts.eta

@@ -8,8 +8,6 @@ import { Module } from '@nestjs/common';
 import { MongooseModule } from '@nestjs/mongoose';
 import {DocNumberFormatGenerator} from './generate/commons/docnogenerator.service'
 import { AuditTrail } from './generate/commons/audittrail.service';
-import { CloudapiModule } from '../cloudapi/cloudapi.module';
-import { PrintapiModule } from '../printapi/printapi.module';
 import { RunWebhookService } from '../simpleapp/generate/commons/runwebhook.service'
 import { UserResolverService } from './services/userresolver.service';
 // auto import modules
@@ -35,14 +33,27 @@ import { <%=capitalizeFirstLetter(bpmn)%>ListenerService } from 'src/simpleapp/w
 // import {ServiceModule} from  "../services/service.module"
 //import { <%= it.typename %>Service } from '../../generate/<%= it.doctype %>/<%= it.doctype %>.service';
 
+// ------------------------ Start additionalNestModules ------------------------
+<% const nestmodules = it.configs.additionalNestModules%>
+<% for(let i=0; i<nestmodules.length;i++){ %>
+<% const modulename = capitalizeFirstLetter(nestmodules[i]) %>
+  import {<%= modulename %>Module } from  '../<%=nestmodules[i]%>/<%=nestmodules[i]%>.module';
+<%}%>
+// ------------------------- End additionalNestModules -------------------------
 
 //<%if(it.doctype != 'autoinc'){%>import {AutoincreamentModule} from '../autoinc/autoinc.module'<%}%>
 //encryption use for model (not class and cant inject, use singleton instead and init as early as possible)
 
 @Module({
   imports: [
-  CloudapiModule,
-  PrintapiModule,
+
+  // ------------------------ Start additionalNestModules ------------------------
+  <% for(let i=0; i<nestmodules.length;i++){ %>
+  <% const modulename = capitalizeFirstLetter(nestmodules[i]) %>
+    <%= modulename %>Module,
+  <%}%>
+  // ------------------------- End additionalNestModules -------------------------
+
    MongooseModule.forFeature([
         <% for(let i=0;i<it.modules.length; i++){ %>
           <% let obj = it.modules[i]%>

package/templates/nuxt/assets/css/style.css._eta

@@ -60,6 +60,7 @@ body {
     @apply font-medium  text-gray-50 dark:text-gray-300 border
 }
 
+/*
 .btn-primary {
     @apply btn bg-primary-600 hover:bg-primary-400 dark:!bg-primary-700 dark:hover:bg-primary-800 
 }
@@ -75,34 +76,79 @@ body {
 .btn-warn {
     @apply btn bg-warning-600 hover:bg-warning-400 
 }
-
-
-
-
-.p-component-overlay-enter {
-    animation: p-component-overlay-enter-animation 150ms forwards;
+*/
+
+/* Primary and Surface Palettes */
+:root {
+    --p-primary-50: #ecfdf5;
+    --p-primary-100: #d1fae5;
+    --p-primary-200: #a7f3d0;
+    --p-primary-300: #6ee7b7;
+    --p-primary-400: #34d399;
+    --p-primary-500: #10b981;
+    --p-primary-600: #059669;
+    --p-primary-700: #047857;
+    --p-primary-800: #065f46;
+    --p-primary-900: #064e3b;
+    --p-primary-950: #022c22;
+    --p-surface-0: #ffffff;
+    --p-surface-50: #f8fafc;
+    --p-surface-100: #f1f5f9;
+    --p-surface-200: #e2e8f0;
+    --p-surface-300: #cbd5e1;
+    --p-surface-400: #94a3b8;
+    --p-surface-500: #64748b;
+    --p-surface-600: #475569;
+    --p-surface-700: #334155;
+    --p-surface-800: #1e293b;
+    --p-surface-900: #0f172a;
+    --p-surface-950: #020617;
+    --p-content-border-radius: 6px;
+    --p-primary: var(--p-primary-500);
+    --p-icon-size: 1rem;
+}
+
+/* Light Mode */
+:root {
+    --p-primary-color: var(--p-primary-500);
+    --p-primary-contrast-color: var(--p-surface-0);
+    --p-primary-hover-color: var(--p-primary-600);
+    --p-primary-active-color: var(--p-primary-700);
+    --p-content-border-color: var(--p-surface-200);
+    --p-content-hover-background: var(--p-surface-100);
+    --p-content-hover-color: var(--p-surface-800);
+    --p-highlight-background: var(--p-primary-50);
+    --p-highlight-color: var(--p-primary-700);
+    --p-highlight-focus-background: var(--p-primary-100);
+    --p-highlight-focus-color: var(--p-primary-800);
+    --p-text-color: var(--p-surface-700);
+    --p-text-hover-color: var(--p-surface-800);
+    --p-text-muted-color: var(--p-surface-500);
+    --p-text-hover-muted-color: var(--p-surface-600);
 }
 
-.p-component-overlay-leave {
-    animation: p-component-overlay-leave-animation 150ms forwards;
-}
-
-.p-component-overlay {
-    @keyframes p-component-overlay-enter-animation {
-        from {
-            background-color: transparent;
-        }
-        to {
-            background-color: var(--maskbg);
-        }
-    }
-    
-    @keyframes p-component-overlay-leave-animation {
-        from {
-            background-color: var(--maskbg);
-        }
-        to {
-            background-color: transparent;
-        }
-    }
+/* 
+ * Dark Mode
+ * Change the .p-dark to match the darkMode in tailwind.config.
+ * For example; 
+ *  darkMode: ['selector', '[class*="app-dark"]'] 
+ *  should match;
+ * :root.app-dark
+*/
+:root.p-dark {
+    --p-primary-color: var(--p-primary-400);
+    --p-primary-contrast-color: var(--p-surface-900);
+    --p-primary-hover-color: var(--p-primary-300);
+    --p-primary-active-color: var(--p-primary-200);
+    --p-content-border-color: var(--p-surface-700);
+    --p-content-hover-background: var(--p-surface-800);
+    --p-content-hover-color: var(--p-surface-0);
+    --p-highlight-background: color-mix(in srgb, var(--p-primary-400), transparent 84%);
+    --p-highlight-color: rgba(255,255,255,.87);
+    --p-highlight-focus-background: color-mix(in srgb, var(--p-primary-400), transparent 76%);
+    --p-highlight-focus-color: rgba(255,255,255,.87);
+    --p-text-color: var(--p-surface-0);
+    --p-text-hover-color: var(--p-surface-0);
+    --p-text-muted-color: var(--p-surface-400);
+    --p-text-hover-muted-color: var(--p-surface-300);
 }

package/templates/nuxt/components/button/ButtonMultiple.vue._eta

@@ -1,6 +1,6 @@
 <template>
   <div class="flex flex-row gap-2">
-    <div v-for="o in options" >
+    <div v-for="o in options">
       <ButtonPrimary v-if="value == o.value" @click="switchButton(o.value)">{{
         o.label
       }}</ButtonPrimary>

package/templates/nuxt/components/calendar/{CalendarByResource.vue.eta → CalendarByResource.vue._eta}

@@ -62,8 +62,8 @@
 </template>
 <script setup lang="ts" generic="T">
 /**
- * This file was automatically generated by simpleapp generator during initialization.
- * IT IS NOT CHANGABLE
+ * This file was automatically generated by simpleapp generator during initialization. It is changable.
+ * --remove-this-line-to-prevent-override--
  * last change 2024-02-22
  * author: Ks Tan
  */

package/templates/nuxt/components/calendar/{CalendarInput.vue.eta → CalendarInput.vue._eta}

@@ -1,7 +1,7 @@
 <template>
   <div class="flex flex-col">
     <label v-if="label" :for="inputid">{{ label }}</label>
-    <Calendar
+    <DatePicker
       v-model="modelValue"
       class="w-full"
       :inputid="inputid"
@@ -13,8 +13,8 @@
 </template>
 <script setup lang="ts">
 /**
- * This file was automatically generated by simpleapp generator during initialization.
- * IT IS NOT CHANGABLE
+ * This file was automatically generated by simpleapp generator during initialization. It is changable.
+ * --remove-this-line-to-prevent-override--
  * last change 2024-04-16
  * author: Ks Tan
  */

package/templates/nuxt/components/calendar/{CalendarSmall.vue.eta → CalendarSmall.vue._eta}

@@ -1,5 +1,5 @@
 <template>    
-  <Calendar 
+  <DatePicker 
       v-model="selectedDate"
       inline            
       @update:modelValue="chooseDate"
@@ -33,10 +33,16 @@
               />
           </div>
       </template>
-  </Calendar>
+  </DatePicker>
 </template>
 <script setup lang="ts" generic="T">
-import { CalendarDateSlotOptions,CalendarMonthChangeEvent } from "primevue/calendar";
+/**
+ * This file was automatically generated by simpleapp generator during initialization. It is changable.
+ * --remove-this-line-to-prevent-override--
+ * last change 2024-04-16
+ * author: Ks Tan
+ */
+import { DatePickerDateSlotOptions, DatePickerMonthChangeEvent } from "primevue/datepicker";
 
 import {
 CalEventType,
@@ -76,7 +82,7 @@ const disableDays=computed(()=>{
   })
 })
 
-function isHoliday(date:CalendarDateSlotOptions){
+function isHoliday(date: DatePickerDateSlotOptions) {
 
   for(let i = 0 ; i<props.holidays.length;i++){
       const item = props.holidays[i]
@@ -111,13 +117,13 @@ const getEventQty = (date:CalendarDateSlotOptions)=>{
   const recordlength =  props.items.filter(item=>item.start==checkdate).length
   return recordlength
 }
-const viewChange = (event: CalendarMonthChangeEvent) => {    
-emits("viewChange", event);
+const viewChange = (event: DatePickerMonthChangeEvent) => {    
+  emits("viewChange", event);
 };
 
 
 onMounted(() => {
-offdays.value = getCurrentBranch()?.branch.offdays ?? [];
+  offdays.value = getCurrentBranch()?.branch.offdays ?? [];
 });
 </script>
 <style >

package/templates/nuxt/components/debug/{DebugDocumentData.vue.eta → DebugDocumentData.vue._eta}

@@ -7,7 +7,7 @@
       <i class="pi pi-code"></i>
       <span>{{ label }}</span>
     </div>
-    <Sidebar
+    <Drawer
       v-model:visible="visible"
       :pt="{ root: { class: 'w-5/6' } }"
       class="text-red-100"
@@ -23,21 +23,20 @@
                 </pre
         >
       </template>
-    </Sidebar>
+    </Drawer>
   </div>
 </template>
 
 <script setup lang="ts">
 /**
- * This file was automatically generated by simpleapp generator during initialization.
- * IT IS NOT CHANGABLE
+ * This file was automatically generated by simpleapp generator during initialization. It is changable.
+ * --remove-this-line-to-prevent-override--
  * last change 2024-02-22
  * author: Ks Tan
  */
 // import Panel from 'primevue/panel';
 // import ScrollPanel from 'primevue/scrollpanel';
 import Dialog from "primevue/dialog";
-import Sidebar from "primevue/sidebar";
 
 import { ref } from "vue";
 const modelValue = defineModel();

package/templates/nuxt/components/form/{FormDocnoformat.vue.eta → FormDocnoformat.vue._eta}

@@ -70,7 +70,8 @@
 
 <script setup lang="ts">
 /**
- * This file was automatically generated by simpleapp generator.
+ * This file was automatically generated by simpleapp generator during initialization. It is changable.
+ * --remove-this-line-to-prevent-override--
  * last change 2024-02-16
  * Author: Ks Tan
  */

package/templates/nuxt/components/form/user/{FormUserPermission.vue.eta → FormUserPermission.vue._eta}

@@ -17,6 +17,12 @@
   </div>
 </template>
 <script lang="ts" setup>
+/**
+ * This file was automatically generated by simpleapp generator during initialization. It is changable.
+ * --remove-this-line-to-prevent-override--
+ * last change 2024-02-22
+ * author: Ks Tan
+ */
 import {
   Branch,
   Permission,

package/templates/nuxt/components/header/{HeaderBreadcrumb.vue.eta → HeaderBreadcrumb.vue._eta}

@@ -1,11 +1,11 @@
 <script setup lang="ts">
 /**
- * This file was automatically generated by simpleapp generator. Every
- * MODIFICATION OVERRIDE BY GENERATEOR
+ * This file was automatically generated by simpleapp generator during initialization. It is changable.
+ * --remove-this-line-to-prevent-override--
  * last change 2023-10-28
  * Author: Ks Tan
  */
-import OverlayPanel from 'primevue/overlaypanel';
+import Popover from 'primevue/popover';
 const op = ref()
 
 const home = ref({
@@ -63,7 +63,7 @@ const getBranches = ()=>{
                         </NuxtLink>
                         <div v-else>
                             <span class="cursor-pointer dark:text-white" @click="showSwitcher">{{ item.label }}</span>
-                            <OverlayPanel ref="op">
+                            <Popover ref="op">
                                 <div>
                                     <ul class="flex flex-col">
                                         <li  v-for="b in getBranches()" class="p-1 route-link-list ">
@@ -73,7 +73,7 @@ const getBranches = ()=>{
                                         </li>
                                     </ul>
                                 </div>
-                            </OverlayPanel>
+                            </Popover>
                         </div>
 
                 </template>

package/templates/nuxt/components/header/button/{HeaderButtonProfile.vue.eta → HeaderButtonProfile.vue._eta}

@@ -1,7 +1,7 @@
 <script setup lang="ts">
 /**
- * This file was automatically generated by simpleapp generator. Every
- * MODIFICATION OVERRIDE BY GENERATEOR
+ * This file was automatically generated by simpleapp generator during initialization. It is changable.
+ * --remove-this-line-to-prevent-override--
  * last change 2024-07-11
  * Author: Ks Tan
  * Last Modified By: Yong Xiang

package/templates/nuxt/components/header/button/task/{HeaderButtonTaskList.vue.eta → HeaderButtonTaskList.vue._eta}

@@ -4,12 +4,12 @@
             <Badge :value="taskqty" severity="danger"></Badge>
         </i>
 
-        <Sidebar v-model:visible="visible" position="right"  :modal="false" :dismissable="false">            
+        <Drawer v-model:visible="visible" position="right"  :modal="false" :dismissable="false">            
             <template #header>
                 <div class="text text-lg font-bold">{{ t('mytasks') }}</div>
             </template>
             <HeaderButtonTaskItem  v-for="task in tasklist" :task="task" @click="viewTask"></HeaderButtonTaskItem>                                                
-        </Sidebar>
+        </Drawer>
         <Dialog v-model:visible="dialogvisible" 
             @update:visible="closeDialog" 
             :pt="{root:{class:'w-1/2 h-5/6'}}"
@@ -37,8 +37,8 @@
 </template>
 <script setup lang="ts">
 /**
- * This file was automatically generated by simpleapp generator. Every
- * MODIFICATION OVERRIDE BY GENERATEOR
+ * This file was automatically generated by simpleapp generator during initialization. It is changable.
+ * --remove-this-line-to-prevent-override--
  * last change 2023-10-28
  * Author: Ks Tan
  */

package/templates/nuxt/components/image/ImageAvatar.vue.eta

@@ -0,0 +1,56 @@
+<template>
+  <ImageToBase64Uploader
+    v-if="changable"
+    #default
+    :style="`width:${size}px; height:${size} px`"
+    :class="`place-content-center `"
+    @image-uploaded="handleBase64"
+    :imagePath="imagepath"
+  >
+    <NuxtImg
+      class="w-full h-full border-4 rounded-full"
+      :src="imagepath"
+      :key="imageKey"
+    />
+  </ImageToBase64Uploader>
+  <div
+    v-else
+    class="inline-block text-black"
+    :style="`width:${size}px; height:${size} px`"
+  >
+    <NuxtImg
+      class="w-full h-full border rounded-full"
+      :key="refreshkey"
+      :src="imagepath"
+    />
+  </div>
+</template>
+<script lang="ts" setup>
+import { updateAvatarVersion } from "~/composables/stringHelper.generate";
+
+// import {KeyValue} from ''
+const props = defineProps<{
+  changable?: boolean;
+  size?: number;
+  uid?: string;
+  refreshkey?: number;
+}>();
+const size = computed(() => props.size ?? 36);
+const imageKey = ref(0);
+const uid = computed(() => props.uid ?? getUserProfile()?.uid);
+// const xorgpath = getCurrentXorg() ? `${getCurrentXorg()}/` : "MC0wLTA/";
+
+const imagepath = computed(() => getAvatarByUid(uid.value)); //`${xorgpath}images/organization/${orgRecordId.value}`;
+
+const handleBase64 = async (data: string) => {
+  await fetch(`/api/profile/avatar`, {
+    method: "POST",
+    body: data.split("base64,")[1],
+  }).then(async (res) => {
+    await fetch(imagepath.value, { cache: "reload", credentials: "include" });
+    imageKey.value++;
+    updateAvatarVersion();
+    // useNuxtApp().$event('RefreshUser',uid.value)
+  });
+};
+</script>

package/templates/nuxt/components/image/{ImageOrganization.vue.eta.vue → ImageOrganization.vue.eta}

@@ -2,11 +2,13 @@
   <ImageToBase64Uploader
     v-if="changable"
     #default
-    :class="`w-${sizenumber} h-${sizenumber} place-content-center bg-white`"
+    :class="`w-${sizenumber} h-${sizenumber} place-content-center bg-white rounded-md`"
     @image-uploaded="handleBase64"
+    :imagePath="imagepath"
   >
+    <!-- {{console.log("imagepath",imagepath)}} -->
     <NuxtImg
-      class="w-full h-full"
+      class="w-full h-full rounded-md"
       :key="imageKey"
       provider="myProvider"
       :src="imagepath"
@@ -14,9 +16,15 @@
   </ImageToBase64Uploader>
   <div
     v-else
-    :class="`inline-block border rounded-lg w-${sizenumber} h-${sizenumber} bg-white`"
+    :class="`inline-block rounded-md w-${sizenumber} h-${sizenumber} bg-white text-black`"
   >
-    <NuxtImg class="w-full h-full" provider="myProvider" :src="imagepath" />
+    <!-- {{console.log("imagepath",imagepath)}} -->
+
+    <NuxtImg
+      class="rounded-md min-w-10 min-h-10"
+      provider="myProvider"
+      :src="imagepath"
+    />
   </div>
 </template>
 <script lang="ts" setup>
@@ -30,11 +38,9 @@ const imageKey = ref(0);
 const orgRecordId = computed(
   () => props.orgRecordId ?? getUserProfile()?.orgRecordId,
 );
-const xorgpath= getCurrentXorg() ? `${getCurrentXorg()}/` : 'MC0wLTA/'
+const xorgpath = getCurrentXorg() ? `${getCurrentXorg()}/` : "MC0wLTA/";
 
-const imagepath = `${xorgpath}images/organization/${
-  orgRecordId.value
-}`;
+const imagepath = `${xorgpath}images/organization/${orgRecordId.value}`;
 const sizenumber = props.size ?? 16;
 const imageData = ref("");
 watch(
@@ -46,7 +52,7 @@ const handleBase64 = async (data: string) => {
     key: "org-" + props.orgRecordId,
     value: data,
   };
-  console.log("upload logo ", data);
+  // console.log("upload logo ", data);
   const uploadok = await useNuxtApp()
     .$OrganizationDoc()
     .getApi()

package/templates/nuxt/components/image/{ImageToBase64Uploader.vue.eta.vue → ImageToBase64Uploader.vue.eta}

@@ -11,30 +11,40 @@
       </slot>
 
       <Dialog
-        v-if="dialogVisible" modal
+        v-if="dialogVisible"
+        modal
         v-model:visible="dialogVisible"
         header="Image Upload"
         :pt="{ root: { class: 'w-11/12' } }"
       >
         <div class="w-full grid grid-cols-2 gap-2">
           <div class="w-7/8 border rounded p-4">
-            <TabView lazy>
-              <TabPanel :header="t('upload')">
-                <div class="upload-container">
-                  <input
-                    type="file"
-                    ref="fileInput"
-                    accept="image/*"
-                    @change="handleImageUpload"
-                  />
-                </div>
-              </TabPanel>
-              <TabPanel :header="t('webcam')">
-                <div class="webcam-container h h-1/6">
-                  <WebCamUI :fullscreenState="false" @photoTaken="photoTaken" />
-                </div>
-              </TabPanel>
-            </TabView>
+            <Tabs value="upload" lazy>
+              <TabList>
+                <Tab value="upload">{{ t("upload") }}</Tab>
+                <Tab value="webcam">{{ t("webcam") }}</Tab>
+              </TabList>
+              <TabPanels>
+                <TabPanel value="upload">
+                  <div class="upload-container">
+                    <input
+                      type="file"
+                      ref="fileInput"
+                      accept="image/*"
+                      @change="handleImageUpload"
+                    />
+                  </div>
+                </TabPanel>
+                <TabPanel value="webcam">
+                  <div class="webcam-container h h-1/6">
+                    <WebCamUI
+                      :fullscreenState="false"
+                      @photoTaken="photoTaken"
+                    />
+                  </div>
+                </TabPanel>
+              </TabPanels>
+            </Tabs>
           </div>
           <div id="preview" class="w-7/8 border rounded p-4">
             <Cropper

package/templates/nuxt/components/list/{ListDocumentTable.vue.eta → ListDocumentTable.vue._eta}

@@ -57,13 +57,13 @@
 </template>
 <script setup lang="ts" generic="T">
 /**
- * This file was automatically generated by simpleapp generator. Every
- * MODIFICATION OVERRIDE BY GENERATEOR
+ * This file was automatically generated by simpleapp generator during initialization. It is changable.
+ * --remove-this-line-to-prevent-override--
  * last change 2023-10-28
  * Author: Ks Tan
  */
 // import { CellSetting } from "~/types";
-import { FilterMatchMode } from "primevue/api";
+import { FilterMatchMode } from "@primevue/core/api";
 import DataTable from "primevue/datatable";
 import Column from "primevue/column";
 import renderComponent from "~/components/renderer";

package/templates/nuxt/components/list/{ListItem.vue.eta → ListItem.vue._eta}

@@ -12,8 +12,8 @@
 </template>
 <script lang="ts" setup>
 /**
- * This file was automatically generated by simpleapp generator. Every
- * MODIFICATION OVERRIDE BY GENERATEOR
+ * This file was automatically generated by simpleapp generator during initialization. It is changable.
+ * --remove-this-line-to-prevent-override--
  * last change 2023-04-24
  * Author: Ks Tan
  */

package/templates/nuxt/components/list/{ListMessages.vue.eta → ListMessages.vue._eta}

@@ -1,6 +1,6 @@
 <template>
   <div>
-    <Sidebar v-model:visible="messagesvisible" position="right" :header="t('messages')">
+    <Drawer v-model:visible="messagesvisible" position="right" :header="t('messages')">
       <ListView :list="list" #default="{ item, index }" @click="openMessage">
         <div class="flex flex-col">
           <TextBold v-if="!item.read">{{ item.messageTitle }}</TextBold>
@@ -29,10 +29,16 @@
         </template>
       </Dialog>
       <ConfirmPopup></ConfirmPopup>
-    </Sidebar>
+    </Drawer>
   </div>
 </template>
 <script setup lang="ts">
+/**
+ * This file was automatically generated by simpleapp generator during initialization. It is changable.
+ * --remove-this-line-to-prevent-override--
+ * last change 2024-02-22
+ * author: Ks Tan
+ */
 // import { sysMessage } from "~/composables/messages.generate";
 import { Systemmessage } from "~/simpleapp/generate/openapi";
 import { useConfirm } from "primevue/useconfirm";

package/templates/nuxt/components/list/{ListView.vue.eta → ListView.vue._eta}

@@ -116,8 +116,8 @@
 </template>
 <script setup lang="ts" generic="T extends { [key: string]: any }">
 /**
- * This file was automatically generated by simpleapp generator. Every
- * MODIFICATION OVERRIDE BY GENERATEOR
+ * This file was automatically generated by simpleapp generator during initialization. It is changable.
+ * --remove-this-line-to-prevent-override--
  * last change 2023-10-28
  * Author: Ks Tan
  */

package/templates/nuxt/components/overlay/{OverlayPanelWithToolBar.vue.eta → OverlayPanelWithToolBar.vue._eta}

@@ -1,12 +1,12 @@
 <template>
-  <Sidebar
+  <Drawer
     :position="position ?? 'right'"
     v-if="showDialog"
     v-model:visible="showDialog"
     modal
     :show-close-icon="false"
     :dismissable="dismissable"
-    :pt="{root:{class:'w-2/3 border-0 border-l border-l-gray-500'}}"
+    :pt="{root:{class:'!w-2/3 border-0 border-l border-l-gray-500'}}"
     #container
   >
     <div class="overflow-y-scroll">
@@ -25,12 +25,12 @@
         <slot name="default"></slot>
       </div>
     </div>
-  </Sidebar>
+  </Drawer>
 </template>
 <script lang="ts" setup>
 /**
- * This file was automatically generated by simpleapp generator. Every
- * MODIFICATION OVERRIDE BY GENERATEOR
+ * This file was automatically generated by simpleapp generator during initialization. It is changable.
+ * --remove-this-line-to-prevent-override--
  * last change 2023-10-28
  * Author: Ks Tan
  */