@simitgroup/simpleapp-generator 1.2.8 → 1.3.0-alpha

package/templates/nuxt/components/table/TableDocuments.vue.eta

@@ -22,7 +22,7 @@
                     </div>
                     <div class="flex-1">
                         <slot name="title">
-                            <h1 class="text text-2xl pt-2 text-center">{{ t(title) }}</h1>
+                            <h1 class="text text-2xl pt-2 text-center dark:text-white">{{ t(title) }}</h1>
                         </slot>
                         
                     </div>                    
@@ -95,7 +95,7 @@
             </slot>
     </Datatable>
 </template>
-<script setup lang="ts">
+<script setup lang="ts" generic="T">
 import {CellSetting} from '~/types'
 import { FilterMatchMode } from 'primevue/api';
 import DataTable from 'primevue/datatable';
@@ -103,7 +103,7 @@ import Column from 'primevue/column';
 import renderComponent from '~/components/renderer'
 import { emit } from 'process';
 const props = defineProps<{
-    value:any[]
+    value:T[]
     columns: CellSetting[]    
     title:string    
     

package/templates/nuxt/components/text/TextDanger.vue._eta

@@ -0,0 +1,5 @@
+<template>
+  <div class="text-red-600 dark:text-red-500">
+    <slot name="default"></slot>
+  </div>
+</template>

package/templates/nuxt/components/text/TextSubtitle.vue._eta

@@ -0,0 +1,5 @@
+<template>
+  <div class="text-base text-gray-600 dark:text-gray-500">
+    <slot name="default"></slot>
+  </div>
+</template>

package/templates/nuxt/components/text/TextTitle.vue._eta

@@ -0,0 +1,5 @@
+<template>
+    <div class="text-xl  text-black dark:text-white content-center">
+        <slot name="default"></slot>
+    </div>
+</template>

package/templates/nuxt/composables/date.generate.ts.eta

@@ -1,16 +1,21 @@
-import moment from "moment";
 
+
+
+export const setDateLocale = (localename:string) =>  useDayjs().locale(localename)
 export const dateExists = (date:Date,listDate:Date[]) => {
     const existsrecord = listDate.find(item=>{
       return date.getTime()===item.getTime()
     })
     return existsrecord===undefined ? false :true
   }
-export const getMoment = (startTime:string)=> moment(startTime)
-export const lastDateOfMonth = (datestr:string) => moment(datestr).endOf('month').format('YYYY-MM-DD');
-export const today = () => moment().format('YYYY-MM-DD')
-export const dateToString = (date:Date) => moment(date).format('YYYY-MM-DD')
-export const dateToDateTimeString = (date:Date)=> moment(date).format('YYYY-MM-DD HH:mm:ss')
-export const toLocalDate = (dateiso8601:string)=> new Date(String(dateiso8601)).toLocaleDateString()
-
-
+export const getDayJs = ()=>useDayjs()
+export const lastDateOfMonth = (datestr:string) =>  useDayjs()(datestr).endOf('month').format('YYYY-MM-DD');
+export const today = () => useDayjs()().format('YYYY-MM-DD')
+export const dateToString = (date:Date) => useDayjs()(date).format('YYYY-MM-DD')
+export const dateToDateTimeString = (date:Date)=> useDayjs()(date).format('YYYY-MM-DD HH:mm:ss')
+export const toLocalDate = (date:string | Date)=> useDayjs()(date).format(getDateFormat())
+export const getDateFormat = ():string=> 'DD-MM-YYYY'
+export const getPrimevueCalendarDateFormat = () => {
+  const country = <string>getUserProfile()?.country
+  return 'dd/mm/yy'
+}

package/templates/nuxt/i18n.config.ts.eta

@@ -1,5 +1,5 @@
 export default defineI18nConfig(() => ({
     legacy: false,
-    locale: 'df',
+    locale: 'en',
     
   }))

package/templates/nuxt/lang/en.ts.eta

@@ -0,0 +1,16 @@
+export default {
+    //auto generate from lang/default.ts
+    <%let langkeys = Object.keys(it.lang) %>
+    <% for(let l=0; l< langkeys.length; l++){ %>
+    <% let key = langkeys[l] %>
+        '<%=key%>' : '<%= it.lang[key] %>',
+    <%}%>    
+
+
+    //auto generate from schema
+    <% for(let i=0; i< it.allfields.length; i++){ %>
+    <% let f = it.allfields[i] %>
+        '<%= f %>' : '<%= camelCaseToWords(f) %>',
+    <%}%>    
+
+}

package/templates/nuxt/layouts/default.vue._eta

@@ -1,18 +1,22 @@
 <template>
     <div class="h-full flex flex-row">
-        <div class="flex flex-col justify justify-between">
-            <div  > 
-                <HeaderButtonMenuPicker class="cursor-pointer p-2  text-6xl "></HeaderButtonMenuPicker>
+        <div class="flex flex-col h-screen ">        
+            <div class="flex-1">            
                 <div class="" v-for="item in menus">
-                    <div class="">                    
-                        <NuxtLink 
-                            :class="`pi ${item.iconClass} p-2  text-6xl cursor-pointer`"
-                            :to="getDocumentUrl(item.path)"
-                            ></NuxtLink>
-                    </div>
-                </div> 
+                        <div class="">                    
+                            <NuxtLink   v-if="item.path !==undefined"
+                                :class="`pi ${item.iconClass} p-2  text-6xl cursor-pointer`"
+                                :to="getDocumentUrl(item.path)"
+                                ></NuxtLink>
+                            <div v-else-if="item.command" :class="`pi ${item.iconClass} p-2  text-6xl cursor-pointer`" @click="item.command">
+                        </div>
+                    </div> 
+                </div>
+            </div>                    
+            <div class="p-2 text-6xl cursor-pointer pi pi-user dark:text-white" @click="openProfile">
+                <HeaderButtonProfile v-model="showProfile"/>           
             </div>
-            <HeaderButtonProfile class="p-6"/>           
+            
         </div>        
         <div class="flex-1">
             <HeaderBar />
@@ -20,15 +24,26 @@
             <slot></slot>
         </div>                
     </div>
+    <div >
+        <HeaderButtonMenuPicker v-model="showMenu"></HeaderButtonMenuPicker>
+    </div>
     
 </template>
 <script setup lang="ts">
-const menus=[
-    // {iconClass:'pi-bars',path:'managestudents/profile'},
-    {iconClass:'pi-home text-white',path:''},
-    {iconClass:'pi-users text-white',path:'managestudents/profile'},
-    {iconClass:'pi-calendar text-white',path:`manageclasses`},
+const showMenu =ref(false)
+const showProfile =ref(false)
+
+const openMenu = ()=>showMenu.value=true
+const openProfile = ()=>showProfile.value=true
+
+const menus=[    
+    {iconClass:'pi-home dark:text-white',path:''},
+    //{iconClass:'pi-users dark:text-white',path:'managestudents/new'},
+    //{iconClass:'pi-calendar dark:text-white',path:`manageclasses`},
     // {iconClass:'pi-database',path:'managedata'},
-    {iconClass:'pi-chart-pie text-white',path:'reports'},
+    {iconClass:'pi-chart-pie dark:text-white',path:'reports'},
+    {iconClass:'pi-bars dark:text-white',command: openMenu},    
+ 
+
 ]
 </script>

package/templates/nuxt/layouts/mobile.vue._eta

@@ -1,29 +1,52 @@
 <template>
     <div class="h-screen flex flex-col">
-        <div class="flex flex-col grow">
-              <slot></slot>            
+        
+        <div class="flex flex-col grow overflow-y-auto">
+            <div class="flex flex-row mb-36 w-full">
+            <slot></slot>                          
+            </div>
+                        
+              
         </div> 
         <!-- fixed -->
-        <div v-if="getCurrentXorg()" class="flex h-20 border-t-2 dark:border-t-gray-700  text-4xl  flex-row   left-0 w-full  justify justify-between bottom-0 z-50 bg-white dark:bg-gray-600 pl-2 pr-2" >                                
-                <NuxtLink v-for="item in menus"
-                        :class="`pi ${item.iconClass} pb-6 pt-6 cursor-pointer inline-block align-middle`"
+        <div v-if="getCurrentXorg()" class="flex h-16  border-t-2 dark:border-t-gray-700  text-3xl  flex-row   left-0 w-full  justify justify-between bottom-0 fixed z-50 bg-white dark:bg-slate-800 opacity opacity-95 " > 
+                <div v-for="item in menus">
+                    <NuxtLink v-if="item.path !== undefined"
+                        :class="`pi ${item.iconClass} p-4 cursor-pointer inline-block align-middle`"
                         :to="getDocumentUrl(item.path)"
-                        ></NuxtLink>                
-                <HeaderButtonMenuPicker class=" cursor-pointer"></HeaderButtonMenuPicker>
-                <HeaderButtonProfile class=""/>
+                        >
+                            
+                    </NuxtLink>         
+                    <div v-else-if="item.command" :class="`pi ${item.iconClass} p-4 cursor-pointer inline-block align-middle`" @click="item.command">
+                    </div>       
+                </div>
+                
+                <HeaderButtonMenuPicker v-model="showMenu"></HeaderButtonMenuPicker>
+                <HeaderButtonProfile v-model="showProfile"/>
                 <UserInvitation/>
         </div> 
+        
         <!-- <HeaderBar class="border flex flex-row h-10 fixed left-0 w-full  justify justify-between top-0 z-50 bg-white  dark:bg-gray-800"/> -->
      
     </div>
 </template>
 <script setup lang="ts">
+const showMenu =ref(false)
+const showProfile =ref(false)
+
+const openMenu = ()=>showMenu.value=true
+const openProfile = ()=>showProfile.value=true
 const menus=[
     // {iconClass:'pi-bars',path:'managestudents/profile'},
-    {iconClass:'pi-home text-white',path:''},
-    // {iconClass:'pi-users text-white',path:'managestudents/profile'},
-    // {iconClass:'pi-calendar text-white',path:`manageclasses`},
+    {iconClass:'pi-home dark:text-white',path:''},
+    //{iconClass:'pi-users  dark:text-white',path:'managestudents'},
+    //{iconClass:'pi-calendar dark:text-white',path:`manageclasses`},
+    {iconClass:'pi-chart-pie dark:text-white',path:'reports'},
+    {iconClass:'pi-bars dark:text-white',command: openMenu},    
+    {iconClass:'pi-user  dark:text-white',command: openProfile},
     // {iconClass:'pi-database',path:'managedata'},
-    // {iconClass:'pi-chart-pie text-white',path:'reports'},
+    
 ]
+
+
 </script>

package/templates/nuxt/nuxt.config.ts._eta

@@ -38,6 +38,7 @@ devServer: {
     '@nuxtjs/color-mode',
      '@nuxtjs/device',
     '@nuxtjs/i18n',
+    'dayjs-nuxt',
     '@sidebase/nuxt-auth',
     'nuxt-primevue',
     // '@nuxtjs/pwa', //cannot turn on, will cause nuxt cant start
@@ -63,12 +64,7 @@ devServer: {
     langDir: "lang/",
     strategy: "no_prefix",
     locales: [
-      {
-        code: "df",
-        iso: "df",
-        name: "Default",
-        file: "df.ts",
-      },
+  
       {
         code: "en",
         iso: "en",
@@ -83,7 +79,7 @@ devServer: {
       
       },
     ],
-    defaultLocale: "df",    
+    defaultLocale: "en",    
   },
   primevue: {
     options: {

package/templates/nuxt/pages/[xorg]/organization/[id].vue.eta

@@ -0,0 +1,39 @@
+<template>
+  <LazyFormBranch :_id="_id" @after="after" />
+</template>
+
+<script setup lang="ts">
+/**
+ * This file was automatically generated by simpleapp generator.
+ * last change 2023-09-09
+ * author: Ks Tan
+ */
+
+import { Branch } from "~/simpleapp/generate/types";
+const doc = useNuxtApp().$BranchDoc();
+
+const props = defineProps<{ _id: string }>();
+const after = (actionName: string, data: Branch) => {
+  console.log("Branch capture after emits ", actionName,doc.getDocName().toLowerCase());
+  switch (actionName) {
+    case "new":
+      goTo('organization');
+      break;
+    case "create":
+      goTo('organization');
+      refreshDocumentList('branch');
+      useNuxtApp().$event("CloseDialog", doc.getDocName().toLowerCase());
+      break;
+    case "update":
+      goTo('organization');
+      refreshDocumentList('branch');
+      useNuxtApp().$event("CloseDialog", doc.getDocName().toLowerCase());      
+      break;
+    case "delete":
+      goTo('organization');
+      refreshDocumentList('branch');
+      useNuxtApp().$event("CloseDialog", doc.getDocName().toLowerCase());
+      break;
+  }
+};
+</script>

package/templates/nuxt/pages/[xorg]/organization/new.vue.eta

@@ -1,151 +1,38 @@
+<template>
+  <LazyFormBranch _id="new" @after="after" />
+</template>
+
 <script setup lang="ts">
 /**
- * This file was automatically generated by simpleapp everytime regenerate code.
- * delete file "delete-me-for-avoid-override" if you want to modify this file and
- * prevent regenerate code override it.
+ * This file was automatically generated by simpleapp generator.
  * last change 2023-09-09
  * author: Ks Tan
  */
- import { SimpleAppInputType } from "~/types";
-import ConfirmPopup from "primevue/confirmpopup";
-import { useConfirm } from "primevue/useconfirm";
-const confirm = useConfirm();
-
-const { $BranchDoc, $OrganizationDoc, $event } = useNuxtApp();
-const orgdoc = $OrganizationDoc();
-const doc = $BranchDoc();
-const data = doc.getReactiveData();
-const bid = ref(String(useRoute().params.bid ?? ""));
-const isReadOnly = ref(true);
-const fetchRecord = async (id: string) => {
-  await doc.getById(id);
-};
-
-const disabled = computed(() => {
-  return false;
-});
-
-const createData = async () => {
-  doc
-    .create()
-    .then((res) => {
-      refresh();
-      goBranch(res.data._id);
-    })
-    .catch((err) => {
-      console.error(err);
-    });
-};
-const updateData = async () => {
-  doc
-    .update()
-    .then(() => {
-      // visible.value=false
-      refresh();
-    })
-    .catch((err) => {
-      console.error(err);
-    });
-};
-const deleteData = (event: Event) => {
-  confirm.require({
-    target: event.currentTarget as HTMLElement,
-    message: "Delete?",
-    icon: "pi pi-exclamation-triangle",
-    acceptClass: "p-button-danger",
-    accept: () => {
-      // disabled.value=true
-      doc.delete(data.value._id ?? "").then((res) => {
-        refresh();
-
-        goTo(doc.getDocName());
-      });
-    },
-    reject: () => {
-      console.log("Cancel delete");
-    },
-  });
-};
 
-const refresh = () => {
-  $event("RefreshDocumentList", { documentName: doc.getDocName() });
-  isReadOnly.value = true;
+import { Branch } from "~/simpleapp/generate/types";
+const doc = useNuxtApp().$BranchDoc();
+
+
+const after = (actionName: string, data: Branch) => {
+  console.log("Branch capture after emits ", actionName,'branch');
+  switch (actionName) {
+    case "create":
+      goTo('organization');
+      refreshDocumentList('branch');
+      useNuxtApp().$event("CloseDialog", 'branch');
+      break;
+    case "update":
+      goTo('organization');
+      refreshDocumentList('branch');
+      useNuxtApp().$event("CloseDialog", 'branch');
+      
+
+      break;
+    case "delete":
+      goTo('organization');
+      refreshDocumentList('branch');
+      useNuxtApp().$event("CloseDialog", 'branch');
+      break;
+  }
 };
-
-if (bid.value) {
-  fetchRecord(bid.value);
-} else {
-  // const orgRecordid = ref(String(useRoute().params.id));
-  // const orgdata = (await orgdoc.getById(orgRecordid.value)).data;
-  doc.setNew();
-  isReadOnly.value = false;
-  data.value.tenantId = getUserProfile().tenantId;
-  data.value.orgId = getUserProfile().orgId;
-  data.value.organization._id = getUserProfile().orgRecordId;
-  data.value.organization.label = getUserProfile().orgName;
-  data.value.organization.orgId = getUserProfile().orgId;
-  data.value.organization.code = getUserProfile().orgCode;
-}
 </script>
-<template>
-  <div class="grid grid-cols2">
-    <SimpleAppForm :document="doc" #default="o" :readonly="isReadOnly">
-      <div v-if="!isReadOnly" class="col-span-4 text-left gap-4">
-        <Button
-          class="btn btn-primary"
-          :isReadOnly="isReadOnly"
-          @click="createData"
-          type="button"
-          v-if="canPerform(doc.getDocName(), 'create') && doc.isNew()"
-          >Create</Button
-        >
-        <Button
-          class="btn btn-primary"
-          @click="updateData"
-          type="button"
-          v-if="canPerform(doc.getDocName(), 'update') && !doc.isNew()"
-          >Update</Button
-        >
-        <Button
-          class="btn btn-danger"
-          @click="deleteData($event)"
-          type="button"
-          v-if="canPerform(doc.getDocName(), 'delete') && !doc.isNew()"
-          >Delete</Button
-        >
-
-        <ConfirmPopup></ConfirmPopup>
-      </div>
-      <div v-else class="col-span-4 text-left gap-4">
-        <Button
-          class="btn btn-primary"
-          @click="isReadOnly = false"
-          type="button"
-          >Edit</Button
-        >
-      </div>
-
-      <SimpleAppInput
-        :input-type="SimpleAppInputType.text"
-        v-model="data.branchCode"
-        :setting="o.getField('#/properties/branchCode')"
-      />
-      <SimpleAppInput
-        :input-type="SimpleAppInputType.text"
-        v-model="data.branchName"
-        :setting="o.getField('#/properties/branchName')"
-      />
-      <SimpleAppInput
-        :input-type="SimpleAppInputType.checkbox"
-        v-model="data.active"
-        :setting="o.getField('#/properties/active')"
-      />
-      <SimpleAppInput
-        :input-type="SimpleAppInputType.textarea"
-        v-model="data.description"
-        :setting="o.getField('#/properties/description')"
-      />
-    </SimpleAppForm>
-    <DebugDocumentData v-model="data" label="branch" />
-  </div>
-</template>

package/templates/nuxt/pages/[xorg]/organization/viewer.vue.eta

@@ -0,0 +1,3 @@
+<template>
+  <div>no org viewer</div>
+</template>