@simitgroup/simpleapp-generator 1.0.63 → 1.1.0

package/templates/nuxt/components/{SimpleAppText.vue.eta → simpleApp/pending/SimpleAppText.vue}

@@ -1,14 +1,13 @@
 
 <template>
     <FieldContainer :hidelabel="hidelabel" v-model="modelValue" :label="label" :description="description" :setting="setting" :instancepath="instancepath" :error="error" #default="slotprops">        
-       
-        
         <InputText v-if="slotprops.error"
             class="simpleapp-inputfield simpleapp-invalid-input"
             :id="slotprops.uuid"
             v-model="modelValue"
             :path="setting.instancepath"
             :type="type"
+            :readonly="isReadonly"
          ></InputText>         
          <InputText v-else
             class="simpleapp-inputfield"
@@ -16,13 +15,14 @@
             v-model="modelValue"
             :path="setting.instancepath"
             :type="type"
+            :readonly="isReadonly"
          ></InputText>  
     </FieldContainer>
 </template>
 <script lang="ts" setup>
 import {computed,watch,ref} from 'vue'
 import InputText from 'primevue/inputtext';
-import FieldContainer from './SimpleFieldContainer.vue'
+import FieldContainer from './SimpleAppFieldContainer.vue'
 const modelValue = defineModel()
 const props = withDefaults( defineProps<{
     label?:string,
@@ -32,11 +32,20 @@ const props = withDefaults( defineProps<{
     type?:string,
     instancepath?:string,
     hidelabel?: boolean
+    readonly?: boolean
 }>(),{type:'text'})
 
 // const modelValue = defineModel<{modelValue?:string}>()
 // console.log(modelValue.value)
-
+const isReadonly = computed(()=>{
+    if(props.readonly){
+        return props.readonly
+    }else if(props.setting.readonly){
+        return props.setting.readonly
+    }else{
+        return false
+    }
+})
 const emits = defineEmits(['change'])
 // const onchange=(e:any)=>{    
 //     emits('update:modelValue',e.target.value)

package/templates/nuxt/components/{SimpleAppTextarea.vue.eta → simpleApp/pending/SimpleAppTextarea.vue}

@@ -8,6 +8,7 @@
             v-bind="$attrs"
             :autoResize="autoResize"
             :path="setting.instancepath"
+            :readonly="isReadonly"
          ></Textarea>         
     </FieldContainer>
 </template>
@@ -15,7 +16,7 @@
 import {computed,watch,ref} from 'vue'
 import Textarea from 'primevue/textarea';
 
-import FieldContainer from './SimpleFieldContainer.vue'
+import FieldContainer from './SimpleAppFieldContainer.vue'
 const modelValue = defineModel()
 const props = defineProps<{
     label?:string,
@@ -25,6 +26,16 @@ const props = defineProps<{
     setting:any,
     autoResize?:boolean,
     instancepath?:string,
-}>()
+    readonly?:boolean
 
+}>()
+const isReadonly = computed(()=>{
+    if(props.readonly){
+        return props.readonly
+    }else if(props.setting.readonly){
+        return props.setting.readonly
+    }else{
+        return false
+    }
+})
 </script>

package/templates/nuxt/components/{SimpleAppDatatable.vue.eta → table/TableDocuments.vue.eta}

@@ -1,59 +1,9 @@
-<!-- <template>
-    <DataTable v-bind="$attrs" 
-    stripedRows 
-    dataKey="_id"
-    :pt="{
-             bodyRow:{class:'bg-blue-200'},
-             wrapper:{class:'bg-red-100'},
-            
-             root:{class:'bg-green-100'},
-             header:{class:'bg-blue-600'},
-             pagebutton:{class:'bg-red-800'},
-
-             tfoot:{class:'bg-red-800  boder round m-4 gap-4'},  
-    }"
-
-    :value="valueModel" 
-    :filters="filters"
-    :paginator="true" :rows="20"
-    :rowsPerPageOptions="[20,40,60,100]"
-    filterDisplay="row"
-    >
-
-        <template #empty> <div class="text-center">No record found.</div> </template>
-        <template #header><slot name="header">
-            <div class="flex flex-wrap gap-2 align-items-center justify-content-between">
-                <h4 class="m-0 flex-1">Records</h4>
-                <span class="p-input-icon-left">
-                    <i class="pi pi-search" />
-                    <InputText v-model="filters['global'].value" placeholder="Search..." />
-                </span>    
-            </div>
-            
-        </slot></template>
-        <Column v-for="(col,index) in columns" :field="col" :header="camelCaseToWords(col)"></Column>                        
-        <slot >
-
-        </slot>
-    </DataTable>
-</template>
-<script setup lang="ts">
-import { FilterMatchMode } from 'primevue/api';
-import DataTable from 'primevue/datatable';
-import Column from 'primevue/column';
-import {camelCaseToWords} from './helper'
-const props = defineProps<{columns:string[]|string[][]}>()
-const valueModel = defineModel<Object[]>()
-    const filters = ref({
-    'global': {value: null, matchMode: FilterMatchMode.CONTAINS},
-});
-
-</script> -->
 <template>
     <DataTable v-bind="$attrs" 
             stripedRows 
             dataKey="_id"
             :showGridlines="true"
+            size="small"
             :pt="{
                 // header:{ class:'border bg-gray-100'},
                 headerRow:{ class:'border bg-gray-200'},                                
@@ -90,9 +40,11 @@ const valueModel = defineModel<Object[]>()
                 </div>
             </template>
 
-            <Column v-for="(col,index) in columns"  :field="typeof col == 'string' ? col : col.field">
+            <Column v-for="(col,index) in columns" sortable :field="typeof col == 'string' ? col : col.field"
+                
+                >
                 <template v-if="typeof col == 'string'" #header>            
-                    <p >{{ col }}</p>
+                    <p >{{ t(col) }}</p>
                 </template>               
                 <template v-else-if="typeof col =='object'" #header>            
                     <span>{{ col.title }} </span>
@@ -105,11 +57,11 @@ const valueModel = defineModel<Object[]>()
                     <p >{{ data[col] }}</p>
                 </template>                
                 <template v-else-if="typeof col =='object'" #body="{index,data}">            
-                    <div v-if="col.component && col.field=='*'">
-                        <component  :is="col.component" :value="data" :fields="col.moreFields" :class="col.cssClass" :setting="col.componentSetting"></component>                        
+                    <div v-if="col.rendererName && col.field=='*'">                        
+                        <component  :is="renderComponent[col.rendererName]" :value="data" :fields="col.moreFields" :class="col.cssClass" :setting="col.rendererSetting"></component>                        
                     </div>
-                    <div v-else-if="col.component && col.field!='*'">                        
-                        <component :is="col.component" v-model="data[col.field]" :moreFields="col.moreFields" :class="col.cssClass" :setting="col.componentSetting" ></component>                    
+                    <div v-else-if="col.rendererName && col.field!='*'">                         
+                        <component :is="renderComponent[col.rendererName]" v-model="data[col.field]" :moreFields="col.moreFields" :class="col.cssClass" :setting="col.rendererSetting" ></component>                    
                     </div>
                     <div v-else class="flex flex-col">                                
                         <div :class="col.class">{{ data[col.field] }}</div>
@@ -118,11 +70,11 @@ const valueModel = defineModel<Object[]>()
                             <div v-if="typeof f == 'string'" :class="'text-gray-400 text-sm' + f.cssClass??'' ">{{ data[f] }}</div>
                             <!-- additional field define as object -->
                             <div v-else>                                
-                                <div v-if="f.component && f.field=='*'">
-                                    <component  :is="f.component" :value="data"  :class="f.cssClass" :setting="f.componentSetting"></component>                        
+                                <div v-if="f.rendererName && f.field=='*'">
+                                    <component  :is="renderComponent[f.rendererName]" :value="data"  :class="f.cssClass" :setting="f.rendererSetting"></component>                        
                                 </div>
-                                <div v-else-if="f.component && f.field!='*'">              
-                                    <component :is="f.component" v-model="data[f.field]" :class="f.cssClass" :setting="f.componentSetting" ></component>                    
+                                <div v-else-if="f.rendererName && f.field!='*'">              
+                                    <component :is="renderComponent[f.rendererName]" v-model="data[f.field]" :class="f.cssClass" :setting="f.rendererSetting" ></component>                    
                                 </div>
                                 <div v-else>                                    
                                     <div :class="f.cssClass">{{ data[f.field] }}</div>
@@ -143,11 +95,11 @@ const valueModel = defineModel<Object[]>()
     </Datatable>
 </template>
 <script setup lang="ts">
-import {SearchBody,CellSetting} from '~/types'
+import {CellSetting} from '~/types'
 import { FilterMatchMode } from 'primevue/api';
 import DataTable from 'primevue/datatable';
 import Column from 'primevue/column';
-
+import renderComponent from '~/components/renderer'
 const props = defineProps<{
     value:any[]
     columns: CellSetting[]

package/templates/nuxt/components/{UserProfileListItem.vue.eta → user/UserProfileListItem.vue.eta}

@@ -5,7 +5,7 @@
         <div class="flex min-w-0 gap-x-4">
           <img class="h-12 w-12 flex-none rounded-full bg-gray-50" :src="`${getAvatarLink(data.email,32)}`" alt="" />
           <div class="min-w-0 flex-auto">
-            <p class="text-sm font-semibold leading-6 text-gray-900">{{ data.fullname }}</p>
+            <p class="text-sm font-semibold leading-6 text-gray-900">{{ data.fullName }}</p>
             <p class="mt-1 truncate text-xs leading-5 text-gray-500">{{ data.email }}</p>
           </div>
         </div>

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

@@ -10,6 +10,9 @@ import {getAllDocuments} from '../simpleapp/generate/commons/documents'
 export const getDocTypes = ()=>{
   return getAllDocuments().filter(item=>item.page!='')
 }
+export const getAllDocFormats = ()=>{
+  return getAllDocuments().filter(item=>item.docNumber)
+}
 
 export const getPublicResource = (xorg:string) : MenuData[] => {
   // const xorg = getUserStore().getCurrentXorg()
@@ -44,7 +47,7 @@ export const getMenus =() :MenuData[]=>{
     // if(m.label)
    
     if(getUserStore().haveAccess(keyword)){
-      const m:MenuData = {label: keyword, url:`/${xorg}/${keyword}`, isolationType:allmenus[i].isolationType}
+      const m:MenuData = {label: t(keyword), url:`/${xorg}/${keyword}`, isolationType:allmenus[i].isolationType}
       allowmenus.push(m)
     }     
   }

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

@@ -1,6 +1,37 @@
+/**
+ * This file was automatically generated by simpleapp generator during initialization.
+ * DO NOT MODIFY IT BY HAND.
+ * last change 2023-09-09
+ * author: Ks Tan
+ */
+ 
 import * as o from "../simpleapp/generate/openapi";
 import axios from 'axios'
+export const getDocumentApi = (apiname: string): any => {
+  //const { csrf } = useCsrf()    
+  //axios.defaults.headers.common = {"CSRF-TOKEN": csrf};
+  const route = useRoute();
 
-export const getApi=()=>{
+  const config: o.Configuration = {
+    basePath: `${useRuntimeConfig().public.APP_URL}/api/${route.params.xorg}`,
+    isJsonMime: () => true,
+  };
+  const docsOpenapi: any = {
+            <% for(let i=0;i<it.modules.length; i++){ %>
+                '<%=it.modules[i].docname.toLowerCase()%>': new o.<%=it.modules[i].doctype.toUpperCase()%>Api(config),                
+              <%}%>
+          };
+  if (!docsOpenapi[apiname]) {
+    console.error(
+      `api for '${apiname}' does not exists, most probably define wrong x-foreignkey`,
+    );
+    return undefined;
+  } else {
+    return docsOpenapi[apiname];
+  }
+};
+
+
+export const getAllApi=()=>{
     return o
 }

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

@@ -13,3 +13,10 @@ export const getDocumentUrl = (document:string,id?:string,querystr?:string)=>{
 export const goTo = (document:string,id?:string,querystr?:string)=>{    
     navigateTo(getDocumentUrl(document,id,querystr))   
 }
+
+
+export const goBranch = (branchRecordId: string) => {
+    const parenturl = getDocumentUrl("organization");
+    const branchUrl = `${parenturl}/${branchRecordId}`;
+    navigateTo(branchUrl);
+  };

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

@@ -1,6 +1,6 @@
 import {NotificationStatus} from '~/types'
 export const getStatusColor = (status:NotificationStatus) => {
-    console.log("get status color",status)
+    //console.log("get status color",status)
     switch(status){
         case NotificationStatus.error:
             return 'bg bg-danger-600 text-white';

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

@@ -13,3 +13,4 @@ export const getAvatarLink = (email:string, size:number):string=>{
 }
 
 export const toLocalDate = (dateiso8601:string)=> new Date(String(dateiso8601)).toLocaleDateString()
+export const t = (txt:string):string=> camelCaseToWords(txt)

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

@@ -4,7 +4,7 @@
 <template>
     <div>
         <HeaderBar />
-        <Invitation/>
+        <UserInvitation/>
         <slot></slot>
     </div>
 </template>

package/templates/nuxt/layouts/documentlist.vue.eta

@@ -93,7 +93,7 @@ import {SearchBody,CellSetting} from '~/types'
         tablecolumns.value= !useRoute().meta.columns ? [] : useRoute().meta.columns as CellSetting[] 
         documentName.value = String(useRoute().meta.documentName)
         const searchbody: SearchBody = {
-            fields: tablecolumns.value.concat(['created']),
+            fields: getWantedFields(tablecolumns.value),
             sorts:  metas.sorts as string[][]
         }
         obj = getDocument(documentName.value)
@@ -118,6 +118,24 @@ import {SearchBody,CellSetting} from '~/types'
         // }
     }
 
+    const getWantedFields = (selectedCols:CellSetting[]) =>{
+        let cols:string[] = []
+        
+        selectedCols.forEach((item)=>{
+
+            if(typeof item=='string'){
+                cols.push(item)
+            }else if(typeof item =='object'){
+                if(item.field !='*'){
+                    cols.push(item.field)
+                }
+                if(item.moreFields && item.moreFields.length>0){
+                    cols = cols.concat(item.moreFields)
+                }                
+            }
+        })        
+        return cols
+    }
 watch(()=> useRoute().meta ,(newvalue,oldvalue)=>{
     refresh()
 })
@@ -130,8 +148,8 @@ watch(()=> useRoute().meta ,(newvalue,oldvalue)=>{
     <div>
 
         <HeaderBar />
-        <Invitation/>      
-         <SimpleAppDatatable :value="recordlist" :columns="tablecolumns" :title="String(useRoute().meta.name)"> 
+        <UserInvitation/>      
+         <TableDocuments :value="recordlist" :columns="tablecolumns" :title="String(useRoute().meta.name)"> 
             <template #toolbar>
                 <div class="w-full text-left">
                     <slot>
@@ -143,13 +161,11 @@ watch(()=> useRoute().meta ,(newvalue,oldvalue)=>{
                 <Button class="bg-secondary-600 hover:bg-secondary-400 text-white" @click="refresh()" type="button" >Refresh</Button>                                                                            
             </template>
             <Column header=" ">
-                <template #body="{index,data}">
-                    <NuxtLink :to="getDocumentUrl(String(useRoute().meta.documentName),data._id)">
-                        <Button icon="pi pi-pencil" class="bg-primary-600 hover:bg-primary-400 text-white" >Edit</Button>
-                    </NuxtLink>            
+                <template #body="{index,data}">                    
+                        <Button @click="goTo(String(useRoute().meta.documentName),data._id)" icon="pi pi-pencil" class="btn btn-primary" >Edit</Button>                    
                 </template>
             </Column>
-        </SimpleAppDatatable>  
+        </TableDocuments>  
         <!--      
         <DebugDocumentData v-model="data"/>
         -->

package/templates/nuxt/layouts/sidelist.vue.eta

@@ -0,0 +1,68 @@
+<script lang="ts" setup>
+/**
+ * This file was automatically generated by simpleapp generator during initialization.
+ * You may modify it
+ * last change 2023-09-09
+ * author: Ks Tan
+ */
+
+import Menus from '~/components/Menus.vue'
+const {$listen,$event} = useNuxtApp()
+
+
+const documentName = ref(String(useRoute().meta.documentName))
+let obj = getDocument(documentName.value)
+
+const list = ref([])
+
+$listen("RefreshDocumentList", (data) => {  
+    if(data.documentName == documentName.value){
+        refresh()
+    }    
+});
+
+watch(()=>useRoute().fullPath,()=>{
+    refresh()
+})
+
+const refresh = async ()=>{
+    
+    
+    documentName.value = String(useRoute().meta.documentName)
+    obj = getDocument(documentName.value)
+    list.value = await obj?.search({})
+    console.log("refreshrefreshrefresh",documentName.value)
+}
+// // $listen('*',(type:any,data:any)=>{ //simple use case, use any to prevent error
+// $listen('listloaded',(newlist)=>{
+//     primarylist.value = newlist
+// })
+
+const selectItem=(item:any)=>{
+    // $event('',item)
+}
+
+refresh()
+
+</script>
+<template>
+    <div>
+        <HeaderBar />
+        <UserInvitation/>
+        <div class="grid grid-cols-3">
+            <div>
+                <ListView 
+                    :list="list"  :withFilter="true"
+                    :url="getDocumentUrl('organization')" 
+                    :titleField="String(useRoute().meta.titleField)"
+                    :subTitleField="String(useRoute().meta.subTitleField)" ></ListView>
+
+                </div>                        
+            <div class="col-span-2">
+                <slot></slot>
+            </div>
+            
+        </div>
+        
+    </div>
+</template>

package/templates/nuxt/layouts/sidelistcrud.vue.eta

@@ -26,7 +26,7 @@ const selectItem=(item:any)=>{
     <div>
 
         <HeaderBar />
-        <Invitation/>
+        <UserInvitation/>
         <div class="grid grid-cols-4">
             <div class="col col-span-1  ">
                 <ListView :list="primarylist" @clickitem="selectItem"></ListView>

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

@@ -9,7 +9,6 @@ export default defineNuxtConfig({
   // colorMode: {}  ,  
   runtimeConfig:{    
     public:{
-      SIMPLEAPP_BACKEND_URL: process.env.SIMPLEAPP_BACKEND_URL,
       APP_URL: process.env.APP_URL,
       API_URL: process.env.API_URL,
       DEBUGDATA: process.env.DEBUGDATA,      

package/templates/nuxt/pages/[xorg]/branch/index.vue.etax

@@ -20,8 +20,8 @@ const columns = [
   /* skip system columns doctype*/
   /* skip system columns created*/
   /* skip system columns updated*/
-  /* skip system columns createdby*/
-  /* skip system columns updatedby*/
+  /* skip system columns createdBy*/
+  /* skip system columns updatedBy*/
   /* skip system columns tenantId*/
   /* skip system columns orgId*/
 ];

package/templates/nuxt/pages/[xorg]/docnoformat/{[id].vue.eta → [doctype]/[id].vue.eta}

@@ -6,12 +6,9 @@
  * last change 2023-09-09
  * author: Ks Tan
  */
-import Index from "./index.vue";
-definePageMeta({
-  layout: 'sidelistcrud',
-});
+import Crud from "./new.vue";
 
 </script>
 <template>
-  <Index />
+  <Crud/>
 </template>