@simitgroup/simpleapp-generator 1.3.3-alpha → 1.3.4-alpha

package/templates/nuxt/components/simpleApp/SimpleAppInput.vue.eta

@@ -20,6 +20,7 @@
       v-model="modelValue"
       :binary="true"
       v-bind="componentProps as CheckboxProps"
+      @change="onChange"
     />
     <InputSwitch
       v-else-if="inputType == SimpleAppInputType.switch"
@@ -30,8 +31,9 @@
       v-model="modelValue as boolean"
       :binary="true"
       v-bind="componentProps as InputSwitchProps"
+      @change="onChange"
     />
-
+    <!--
     <InputText
       type="date"
       :pt="pt"
@@ -43,19 +45,24 @@
       :readonly="isReadonly"
       :placeholder="placeholder"
       v-bind="componentProps as InputTextProps"
-    />
+    /> -->
     <!-- calendar component -->
     <Calendar
       type="date"
       :pt="pt"
-      class="flex flex-col"
-      v-else-if="SimpleAppInputType.calendar == inputType"
+      v-else-if="
+        SimpleAppInputType.calendar == inputType ||
+        inputType == SimpleAppInputType.date
+      "
       :inputId="slotprops.uuid"
       :path="setting.instancepath"
       v-model="datevalue"
       @update:modelValue="updateDate"
+      :touchUI="isMobile()"
+      showButtonBar
       :readonly="isReadonly"
       :placeholder="placeholder"
+      :date-format="getDateFormat()"
       v-bind="componentProps as CalendarProps"
     />
 
@@ -69,7 +76,7 @@
       @update:modelValue="updateTime"
       :inputId="slotprops.uuid"
       :path="setting.instancepath"
-      v-model="modelValue as string"
+      v-model="timevalue"
       :readonly="isReadonly"
       :placeholder="placeholder"
       v-bind="componentProps as CalendarProps"
@@ -90,6 +97,7 @@
       optionValue="value"
       :placeholder="placeholder"
       v-bind="componentProps as ListboxProps"
+      @change="onChange"
     />
 
     <Dropdown
@@ -106,6 +114,7 @@
       optionValue="value"
       :placeholder="placeholder"
       v-bind="componentProps"
+      @change="onChange"
     />
 
     <!-- radio component -->
@@ -118,6 +127,7 @@
           name="smaple"
           :value="item.value"
           :readonly="isReadonly"
+          @change="onChange"
         />
         {{ " " }}
         <label :for="setting.key + '-' + index"> {{ item.label }} </label>
@@ -136,6 +146,8 @@
       :path="setting.instancepath"
       :readonly="isReadonly"
       :placeholder="placeholder"
+      :autocompleteFilter="autocompleteFilter"
+      @change="onChange"
     />
     <!-- v-bind:attributes="componentProps" -->
     <!--  document no input-->
@@ -149,6 +161,7 @@
       :pt="pt"
       :path="setting.instancepath"
       v-bind="componentProps as any"
+      @change="onChange"
     />
     <!-- use componentProps as any at the moment, no ideal yet, and for compatibility -->
 
@@ -163,6 +176,7 @@
       class="flex flex-col"
       :inputId="slotprops.uuid"
       :path="setting.instancepath"
+      @change="onChange"
       :placeholder="placeholder"
       v-bind="componentProps as PasswordProps"
     />
@@ -176,6 +190,7 @@
       :readonly="isReadonly"
       :inputId="slotprops.uuid"
       :path="setting.instancepath"
+      @change="onChange"
       v-bind="componentProps as RatingProps"
     />
 
@@ -189,10 +204,11 @@
       :inputId="slotprops.uuid"
       :path="setting.instancepath"
       :placeholder="placeholder"
+      @update:modelValue="onChange"
       v-bind="componentProps as ChipsProps"
     />
     <!-- simple component  -->
-    
+
     <InputNumber
       v-else-if="inputType == SimpleAppInputType.number"
       :type="type"
@@ -202,10 +218,27 @@
       :pt="pt"
       :class="!pt ? 'w-full flex flex-col' : ''"
       :inputId="slotprops.uuid"
+      @update:modelValue="onChange"
       :path="setting.instancepath"
       v-bind="componentProps as InputNumber"
       :placeholder="placeholder"
     />
+    <InputNumber
+      v-else-if="inputType == SimpleAppInputType.money"
+      :type="type"
+      v-model="modelValue as number"
+      @focus="setFocus"
+      :max-fraction-digits="2"
+      :min-fraction-digits="2"
+      :readonly="isReadonly"
+      :pt="pt"
+      :class="!pt ? 'w-full flex flex-col' : ''"
+      :inputId="slotprops.uuid"
+      :path="setting.instancepath"
+      @change="onChange"
+      v-bind="componentProps as InputNumber"
+      :placeholder="placeholder"
+    />
     <Textarea
       v-else-if="inputType == SimpleAppInputType.textarea"
       v-model="modelValue as string"
@@ -216,6 +249,7 @@
       class="w-full flex flex-col"
       :inputId="slotprops.uuid"
       :path="setting.instancepath"
+      @change="onChange"
       :placeholder="placeholder"
       v-bind="componentProps as TextareaProps"
     />
@@ -229,11 +263,12 @@
       :type="type"
       class="w-full flex flex-col"
       :inputId="slotprops.uuid"
+      @change="onChange"
       :path="setting.instancepath"
       :placeholder="placeholder"
       v-bind="componentProps as InputTextProps"
     />
-    <!-- component require special treatment -->        
+    <!-- component require special treatment -->
   </SimpleAppFieldContainer>
 </template>
 
@@ -267,9 +302,10 @@ import { SimpleAppInputType } from "~/types";
 
 const instancepath = ref("");
 const modelValue = defineModel({ required: true });
-const datevalue = ref("");
-const timevalue = ref<Date>();
 
+const datevalue = ref<Date>();
+const timevalue = ref<Date>();
+let watchOnChange=0
 const props = withDefaults(
   defineProps<{
     inputType: SimpleAppInputType;
@@ -284,6 +320,7 @@ const props = withDefaults(
     autofocus?: boolean;
     pt?: any;
     placeholder?: string;
+    autocompleteFilter?: any;
     componentProps?:
       | InputNumberProps
       | InputSwitchProps
@@ -296,45 +333,55 @@ const props = withDefaults(
   { type: "text" },
 );
 
-const pt =ref(props.pt)
+const pt = ref(props.pt);
 
 if (props.inputType == SimpleAppInputType.date && modelValue.value) {
-  datevalue.value = moment(modelValue.value as string).format("YYYY-MM-DD");
+  datevalue.value = stringToDate(<string>modelValue.value); //.format("YYYY-MM-DD");
 } else {
-  datevalue.value = "";
+  datevalue.value = undefined;
+}
+
+if (props.inputType == SimpleAppInputType.time) {
+  if (modelValue.value) {
+    timevalue.value = stringToDate(
+      (today() + "T" + modelValue.value) as string,
+    ); //.format("YYYY-MM-DD");
+  } else {
+    timevalue.value = undefined;
+  }
 }
 
 if (props?.instancepath) instancepath.value = props.instancepath;
-  else if (props.setting?.instancepath)
-    instancepath.value = props.setting.instancepath;
-  else instancepath.value = "/unknown";
+else if (props.setting?.instancepath)
+  instancepath.value = props.setting.instancepath;
+else instancepath.value = "/unknown";
 
 watch(props.setting.errors, (newvalue, oldvalue) => {
-  let errmsg = ''
+  let errmsg = "";
   if (newvalue[instancepath.value]) {
-    const errlist: any[] = newvalue[instancepath.value];    
+    const errlist: any[] = newvalue[instancepath.value];
     for (let i = 0; i < errlist.length; i++) {
       errmsg += errlist[i].message + ",";
-    }    
+    }
   } else {
-    errmsg = "";    
+    errmsg = "";
   }
-  if(errmsg!=''){
-    const errorstyle = { style:'border-color: lightcoral; color:white '}
-    if(!pt.value)pt.value = {}
+  if (errmsg != "") {
+    const errorstyle = { style: "border-color: lightcoral; color:white " };
+    if (!pt.value) pt.value = {};
 
-    if(props.inputType == SimpleAppInputType.text) pt.value={ root: errorstyle}
-    else if(props.inputType == SimpleAppInputType.autocomplete) pt.value={ input:errorstyle} 
-    else  if(props.inputType == SimpleAppInputType.number) pt.value={ input: {root:errorstyle}  } 
-    else pt.value = {root: errorstyle, input:{root:errorstyle}}
+    if (props.inputType == SimpleAppInputType.text)
+      pt.value = { root: errorstyle };
+    else if (props.inputType == SimpleAppInputType.autocomplete)
+      pt.value = { input: errorstyle };
+    else if (props.inputType == SimpleAppInputType.number)
+      pt.value = { input: { root: errorstyle } };
+    else pt.value = { root: errorstyle, input: { root: errorstyle } };
     //some component still not working
-
-  }else{
-   pt.value=props.pt 
+  } else {
+    pt.value = props.pt;
   }
-    
-  
-})
+});
 const isReadonly = computed(() => {
   if (props.readonly) {
     return props.readonly;
@@ -344,15 +391,18 @@ const isReadonly = computed(() => {
     return false;
   }
 });
-const updateTime = () => {
-  modelValue.value = moment(timevalue.value).format("HH:mm:ss");
+const updateTime = (value: Date) => {
+  value.setSeconds(0);
+  modelValue.value = dateToTimeString(value);
+  onChange()
 };
 const updateDate = (value: any) => {
   if (value) {
-    modelValue.value = moment(value).format("YYYY-MM-DD");
+    modelValue.value = dateToString(value);
   } else {
     modelValue.value = "";
   }
+  onChange()
 };
 
 const setFocus = (ev: any) => {
@@ -380,6 +430,10 @@ const emits = defineEmits([
   "update:docNoFormat",
 ]);
 
+const getDateFormat = () => {
+  return getPrimevueCalendarDateFormat();
+};
+
 watch(modelValue, (newvalue: any) => {
   if (
     [SimpleAppInputType.date, SimpleAppInputType.calendar].includes(
@@ -387,14 +441,21 @@ watch(modelValue, (newvalue: any) => {
     )
   ) {
     if (modelValue.value) {
-      datevalue.value = moment(modelValue.value as string).format("YYYY-MM-DD");
+      datevalue.value = stringToDate(modelValue.value as string);
+    } else {
+      timevalue.value = undefined;
+    }
+  } else if (props.inputType == SimpleAppInputType.time) {
+    if (modelValue.value) {
+      timevalue.value = stringToDate(
+        (today() + "T" + modelValue.value) as string,
+      );
     } else {
-      datevalue.value = "";
+      timevalue.value = undefined;
     }
   }
-
-  emits("change", modelValue.value);
-  emits("update:modelValue", modelValue.value);
+ 
+  
 });
 onMounted(() => {
   if (
@@ -403,13 +464,26 @@ onMounted(() => {
     )
   ) {
     if (modelValue.value) {
-      datevalue.value = moment(modelValue.value as string).format("YYYY-MM-DD");
+      datevalue.value = stringToDate(modelValue.value as string);
+    } else {
+      datevalue.value = undefined;
+    }
+  } else if (props.inputType == SimpleAppInputType.time) {
+    if (modelValue.value) {
+      timevalue.value = stringToDate(
+        (today() + "T" + modelValue.value) as string,
+      );
     } else {
-      datevalue.value = "";
+      timevalue.value = undefined;
     }
   }
+  
 });
 
+const onChange=()=>{
+  emits("change",  modelValue.value); 
+}
+
 /************ start autocomplete only ***************/
 
 /************ end autocomplete only ***************/

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

@@ -0,0 +1,13 @@
+<template>
+  <div class="text-base text-primary-600 dark:text-primary-500">
+    <slot name="default"></slot>
+  </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
+ */
+</script>

package/templates/nuxt/components/user/UserButtonCreateTenant.vue._eta

@@ -0,0 +1,68 @@
+<template>
+  <div>
+    <div class="mt-8 md:flex justify-start md:gap-4">
+      <form @submit.prevent="true" class="w-full">
+        <div>{{ t('createNewCompany') }}</div>
+        <div class="p-inputgroup flex flex-row">
+          <InputText
+            class="flex-1"
+            :placeholder="t('yourCompanyName')"
+            v-model:model-value="data.tenantName"
+          />
+          <div class="p-inputgroup-addon p p-0">
+            <button
+              :label="t('create')"
+              class="border rounded-tl-none rounded-bl-none btn btn-primary -ml-1 h-full p-3 rounded-r-md"
+              @click="createTenant"
+              :loading="onhold"
+            >
+              {{ t("create") }}
+            </button>
+          </div>
+        </div>
+      </form>
+
+    </div>
+
+  
+  </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-03-05
+ * author: Ks Tan
+ */
+import { ref } from "vue";
+import { AxiosResponse } from "axios";
+const visible = ref(false);
+const data = ref({ tenantName: "" });
+
+const createtitle = ref("Create My Company");
+const errCreateTenant = ref();
+const onhold = ref(false);
+
+const createTenant = async () => {
+  onhold.value = true;
+
+
+  getPorfileApi()
+    .createTenant(data.value)
+    .then((res: AxiosResponse) => {
+      if (res && res.status && res.status == 201) {
+        if (res.data && res.data["xOrg"]) {
+          const xorg = res.data["xOrg"];
+          navigateTo("/" + xorg, { external: true });
+        }
+      }
+    })
+    .catch((err) => {
+      errCreateTenant.value = err["message"];
+      console.error("errCreateTenant", err);
+    })
+    .finally(() => {
+      onhold.value = false;
+    });
+};
+</script>

package/templates/nuxt/components/user/UserTenantPicker.vue.eta

@@ -1,61 +1,72 @@
 <template>
-    <div v-if="alltenants" v-for="tenant in alltenants">
-    <card  :pt="{ header:{class:'text-xl text-gray-600'}}">
-        
+  <div class="w-full">
+    <div v-if="waiting" class="p-4  w-full">
+        waiting..
+    </div>
+    <div v-else  class="w-full p-4">
+      
+      <div v-for="tenant in alltenants" class="border rounded-lg p-2 m-2">
+        <TextTitle>{{ tenant.tenantName }}</TextTitle>
+        <ListView :list="tenant.permissions" url="/" idField="xOrg">
+          <template #default="{item,index}">
+            <div class="flex flex-row w-full justify-end">
+              <TextPrimary class="flex-1">{{ item.orgName }}</TextPrimary>
+              <TextPrimary>{{ item.branchCode }}</TextPrimary>
+              
+            </div>
+          </template>
+        </ListView>
+      </div>
+     
+      <!-- <card :pt="{ header: { class: 'text-xl text-gray-600' } }">
         <template #header>
-            {{tenant.tenantName }}
+          {{ tenant.tenantName }}
         </template>
-        <template #content>   
-            
-            <ul >
-                <li v-for="o in getOrglist(tenant)">
-                    <h1 class="subtitle-text">{{ o.orgName }}</h1>
-                    <ul role="list" class="divide-y divide-gray-100 rounded-md border border-gray-200">
-                        <li v-for="b in getBranchlist(tenant)"   class="w-full items-center justify-between py-4 pl-4 pr-4  text-sm route-link-list">
-                            <NuxtLink :href="`/${b.xOrg }`"  v-if="o.orgId==b.orgId" :external="true" >                    
-                                <div class="flex w-full flex-1 items-center ">
-                                    <!-- <i class="pi pi-sitemap"></i> -->
-                                    <p class="flex-1 flex-shrink-0 font-bold text-primary-600 ">
-                                        {{ b.branchCode }}
-                                    </p>
-                                    <p class=" text-right min-w-0 flex-1 gap-2">
-                                        <span href="#" class="font-medium text-gray-600 ">{{ b.group }}</span>    
-                                    </p>
-                                </div>
-                                <div class=" flex-shrink-0">
-                                    
-                                    <span class=" font-medium text-gray-400">{{useRuntimeConfig().public.APP_URL}}/{{b.xOrg }}</span>
-                                    
-                                </div>
-                                    
-                                </NuxtLink>
-                            </li>
-                    </ul>
-
-                </li>
-            </ul>
-            
-           <!-- <ul>
-            <li v-for="b in branches" class="border border-b-1">
-                <NuxtLink :href="`/${b.xOrg }`" :external="true">
-
-                    <div class="flex flex-col">
-                        <div class="flex">
-                            <p class="flex-1">{{b.branch.branchCode}}</p>
-                            <p class="flex-1 text-right">{{b.group }}</p>
-                        </div>
-                        
-                        
-                        <p class="text-gray-500">{{useRuntimeConfig().public.APP_URL}}/{{b.xOrg }}</p>
-                        
+        <template #content>
+          <ul>
+            <li v-for="o in getOrglist(tenant)">
+              <h1 class="subtitle-text">{{ o.orgName }}</h1>
+              <ul
+                role="list"
+                class="divide-y divide-gray-100 rounded-md border border-gray-200"
+              >
+                <li
+                  v-for="b in getBranchlist(tenant)"
+                  class="w-full items-center justify-between py-4 pl-4 pr-4 text-sm route-link-list"
+                >
+                  <NuxtLink
+                    :href="`/${b.xOrg}`"
+                    v-if="o.orgId == b.orgId"
+                    :external="true"
+                  >
+                    <div class="flex w-full flex-1 items-center">
+                      <p class="flex-1 flex-shrink-0 font-bold text-primary-600">
+                        {{ b.branchCode }}
+                      </p>
+                      <p class="text-right min-w-0 flex-1 gap-2">
+                        <span href="#" class="font-medium text-gray-600">{{
+                          b.group
+                        }}</span>
+                      </p>
+                    </div>
+                    <div class="flex-shrink-0">
+                      <span class="font-medium text-gray-400"
+                        >{{ useRuntimeConfig().public.APP_URL }}/{{
+                          b.xOrg
+                        }}</span
+                      >
                     </div>
-                    
-                </NuxtLink>
+                  </NuxtLink>
+                </li>
+              </ul>
             </li>
-           </ul> -->
+          </ul>
+
         </template>
-    </card>
+      </card> -->
     </div>
+    
+  </div>
 </template>
 <script setup lang="ts">
 /**
@@ -64,29 +75,29 @@
  * last change 2023-10-28
  * Author: Ks Tan
  */
-import _ from 'lodash'
-const profileapi = getAllApi().PROFILEApi;
-const alltenants = ref() 
-
-
+import _ from "lodash";
+import TextPrimary from "../text/TextPrimary.vue";
+const waiting = ref(true)
+const alltenants = ref();
 
-
-const loadAllTenants = async () =>{
-    const api = new profileapi(undefined,useRuntimeConfig().public.API_URL,)
-    alltenants.value =  (await api.getAllTenants()).data
-}
+const loadAllTenants = async () => {
+  waiting.value=false
+  alltenants.value = (await getPorfileApi().getAllTenants()).data;
+};
 
 // const props = defineProps<{
 //    tenant:any
 // }>()
-const getBranchlist = (tenant:any)=>tenant.permissions
-
-
-const getOrglist = (tenant:any) => _.uniqBy(getBranchlist(tenant),'orgId')
-        .map((item:any)=>({ orgId:item.orgId,orgCode:item.orgCode,orgName:item.orgName}) ) 
+const getBranchlist = (tenant: any) => tenant.permissions;
 
+const getOrglist = (tenant: any) =>
+  _.uniqBy(getBranchlist(tenant), "orgId").map((item: any) => ({
+    orgId: item.orgId,
+    orgCode: item.orgCode,
+    orgName: item.orgName,
+  }));
 
-onNuxtReady(()=>{
-    loadAllTenants()
-})
-</script>
+onNuxtReady(() => {
+  loadAllTenants();
+});
+</script>

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

@@ -15,6 +15,8 @@ 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 dateToTimeString = (date:Date) => useDayjs()(date).format('HH:mm:ss')
+export const stringToDate = (datestr:string) => new Date(datestr)
 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'

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

@@ -1,10 +1,43 @@
 /**
  * This file was automatically generated by simpleapp generator. Every
  * MODIFICATION OVERRIDE BY GENERATEOR
- * last change 2023-10-28
+ * last change 2024-02-24
  * Author: Ks Tan
  */
 import {getAllDocuments} from '~/simpleapp/generate/commons/documents'
+import { FormCrudEvent } from '~/types'
 export const getDocument = (docname:string) =>{
         return getAllDocuments().find((item)=>item.docName==docname)   //?.docClass
-}
+}
+
+// (appuser: UserContext, filter: any) => Promise<void>;
+export const onScreenAddDocument = <T>(docname:string,paras?:T,after?:(eventType:FormCrudEvent, data:T)=>Promise<void>)=>{
+        useNuxtApp().$event('ViewRecord',{
+            documentName: docname,
+            eventId:randomUUID(),
+            _id:'new',
+            paras:paras,
+            document: getDocument(docname)?.docClass,
+            viewer: getDocument(docname)?.viewer,    
+            after: (eventType:FormCrudEvent, data: any) => {
+                //do nothing
+                 if(after)after(eventType,data as T)
+            },
+            label:t(docname)
+        
+          })
+    }
+    export const onScreenEditDocument = <T>(docname:string,_id:string,after?:(eventType:FormCrudEvent, data:T)=>Promise<void>)=>{
+        useNuxtApp().$event('ViewRecord',{
+            documentName: docname,
+            eventId:randomUUID(),
+            _id:_id,
+            document: getDocument(docname)?.docClass,
+            viewer: getDocument(docname)?.viewer,    
+            after: async (eventType:FormCrudEvent, data: any) => {
+                //do nothing
+                 if(after)after(eventType,data as T)
+            },
+            label:t(docname)        
+          })
+    }

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

@@ -55,4 +55,8 @@ export const getAllApi=()=>{
 export const getWorkflowApi = () => {
   return new o.WorkflowApi(getAxiosConfig())
   
-}
+}
+
+export const getPorfileApi = () => {
+  return new o.PROFILEApi(getAxiosConfig())
+}