@simitgroup/simpleapp-generator 1.6.0-alpha → 1.6.2-alpha

package/templates/nuxt/components/calendar/CalendarInput.vue.eta

@@ -0,0 +1,24 @@
+<template>
+    <div class="flex flex-col ">
+      <label v-if="label" :for="inputid">{{ label }}</label>
+      <Calendar 
+        v-model="modelValue" 
+        class="w-full" 
+        :inputid="inputid"
+        :date-format="getPrimevueCalendarDateFormat()"
+        />
+    </div>
+</template>
+<script setup lang="ts">
+/**
+ * This file was automatically generated by simpleapp generator during initialization.
+ * IT IS NOT CHANGABLE
+ * last change 2024-04-16
+ * author: Ks Tan
+ */
+const modelValue = defineModel<Date>({required:true})
+const inputid=randomUUID()
+const props = defineProps<{
+    label?:string
+}>()
+</script>

package/templates/nuxt/components/calendar/CalendarSmall.vue.eta

@@ -13,11 +13,13 @@
     @view-change="viewChange"
     :events="allevents"
     @cell-focus="chooseDate"
+
     xsmall
   >
     <template #today-button>
       <!-- Using Vuetify (but we prefer Wave UI 🤘) -->
-      <div @click="chooseDate(new Date(), true)">{{ t("today") }}</div>
+      <div      
+       @click="chooseDate(new Date(), true)">{{ t("today") }}</div>
     </template>
     <template #cell-content="{ cell, events }">
       <div>
@@ -31,7 +33,7 @@
           <span v-else>{{ cell.content }} </span>
         </div>
         <div>
-          <slot name="default" :cell="cell" events="events">
+          <slot name="default" :cell="cell" :events="events">
             <Badge
               v-if="events.length > 0"
               @contextmenu="(mouseevent) => onRightClickDate(mouseevent, cell)"
@@ -75,8 +77,14 @@ const allevents = computed(() => {
   const list = props.items.map((item) => {
     if (item.start instanceof Date)
       item.start = item.start.format("YYYY-MM-DD HH:mm");
+    else if (typeof item.start == 'string' ){
+      item.start = item.start.substring(0,16).replace('T',' ');
+    }
     if (item.end instanceof Date)
       item.end = item.end.format("YYYY-MM-DD HH:mm");
+    else if (typeof item.end == 'string' ){
+      item.end = item.end.substring(0,16).replace('T',' ');
+    }
     return item;
   });
   return list;
@@ -84,6 +92,7 @@ const allevents = computed(() => {
 const viewChange = (event: CalViewChange) => {
   viewStatus.value = event;
 };
+
 const chooseDate = (date1: Date, force?: boolean) => {
   if (force || !viewStatus.value || viewStatus.value.view == "month") {
     selectedDate.value = date1;

package/templates/nuxt/components/debug/DebugDocumentData.vue.eta

@@ -1,5 +1,5 @@
 <template>
-    <div :class="`p-0 absolute bg-yellow-200 bottom-0 right-0`" v-if="isdebug=='1'">
+    <div :class="`p-0 absolute bg-yellow-200 bottom-100 right-0`" v-if="isdebug=='1'">
         <button @click="visible=true"  class=" text-white text-xs bg-warning-800 p-0 m-0">
             <i class="pi pi-code"></i>{{ label }}</button>      
         <Sidebar v-model:visible="visible" class="text-red-100">

package/templates/nuxt/components/list/ListView.vue.eta

@@ -1,21 +1,29 @@
 <template>
   <div class="relative">
-    <div v-if="withFilter" class="flex flex-row">
-      <InputText
-        :placeholder="t('searchKeyword')"
-        v-model="searchvalue"
-        class="w-full dark:text-white"
-        type="search"
-        ref="listviewfilter"
-      />
-      <template v-if="withAddNew">
-        <ButtonText v-if="isMobile()" @click="emits('add')"
-          ><i class="pi pi-plus"></i
-        ></ButtonText>
-        <ButtonPrimary v-else @click="emits('add')"
-          ><i class="pi pi-plus"></i
-        ></ButtonPrimary>
-      </template>
+    <div v-if="withFilter" class="flex flex-row p-2">
+      <InputGroup>
+          <InputGroupAddon v-if="filter">
+
+             <ButtonDefault @click="showMoreFilter" v-if="Object.keys(filter)==0">
+              <i class="pi pi-filter"></i>
+            </ButtonDefault>
+            <ButtonWarning @click="showMoreFilter" v-else>
+              <i class="pi pi-filter"></i>
+            </ButtonWarning>
+          </InputGroupAddon>
+          <InputText
+              :placeholder="t('searchKeyword')"
+              v-model="searchvalue"
+              class="w-full dark:text-white text-sm "
+              type="search"
+              ref="listviewfilter"
+            />
+          <InputGroupAddon v-if="withAddNew">            
+            <ButtonPrimary @click="emits('add')">
+              <i class="pi pi-plus"></i>
+            </ButtonPrimary>
+          </InputGroupAddon>
+      </InputGroup>
     </div>
 
     <div
@@ -51,9 +59,9 @@
               index > 0 ? 'border-t-2' : ''
             }`"
           >
-            <NuxtLink :to="getUrl(item)"
-            
-              class="p-2"
+            <NuxtLink
+              :to="getUrl(item)"
+              :class="`p-2 ${showClickEffect ? 'listlink' : ''}`"
             >
               <slot name="default" :item="item" :index="index">
                 <div class="flex flex-row">
@@ -79,6 +87,23 @@
         </slot>
       </div>
     </div>
+
+
+    <Dialog v-model:visible="visibleMoreFilter" :header="t('filter')">
+      <slot name="filter">
+        define filter in #filter
+      </slot>
+      <template #footer>
+        <div class="flex flex-row">
+          <ButtonDefault @click="clearFilter" class="flex flex-row p-2">
+            <i class="pi pi-times mr-1"/> <span class="mr-1">{{t('clear')}}</span>
+          </ButtonDefault>
+          <ButtonPrimary  @click="runFilter" class="flex flex-row p-2">
+            <i class="pi pi-filter mr-1"/> <span class="mr-1">{{t('ok')}}</span>
+          </ButtonPrimary>
+        </div>
+      </template>
+    </Dialog>
   </div>
 </template>
 <script setup lang="ts" generic="T extends { [key: string]: any }">
@@ -90,7 +115,8 @@
  */
 import { ref } from "vue";
 import { ListItem } from "~/types/listview";
-import _ from 'lodash'
+import _ from "lodash";
+const visibleMoreFilter = ref(false)
 const listviewfilter = ref();
 const props = withDefaults(
   defineProps<{
@@ -100,8 +126,10 @@ const props = withDefaults(
     idField?: string;
     subTitleField?: string;
     withFilter?: boolean;
+    filter?:Object;
     withAddNew?: boolean;
     showIndex?: boolean;
+    showClickEffect?: boolean;
   }>(),
   {
     idField: "_id",
@@ -110,21 +138,20 @@ const props = withDefaults(
 const letters = ref<string[]>([]);
 let lastchar = "";
 
-const emits = defineEmits(["add", "click"]);
+const emits = defineEmits(["add", "runFilter", "clearFilter","click"]);
 const searchvalue = ref("");
 const selecteditem = ref("");
 const clickRow = (item: ListItem) => {
   // emit('clickitem',item)
   // selecteditem.value = item.code
 };
-const getUrl = (item:any)=>{
-  if(props.url && props.idField) {
-    if(_.last(props.url)=='/') return `${props.url}${item[props.idField]}`
-    else return `${props.url}/${item[props.idField]}`
-  }
-  else return undefined
+const getUrl = (item: any) => {
+  if (props.url && props.idField) {
+    if (_.last(props.url) == "/") return `${props.url}${item[props.idField]}`;
+    else return `${props.url}/${item[props.idField]}`;
+  } else return undefined;
   // :to="url ? `${url}/${item[idField]}` : undefined"
-}
+};
 const filterlist = computed(() => {
   let newlist: T[] = [];
   if (!Array.isArray(props.list)) {
@@ -175,6 +202,17 @@ const onClick = (index: number, data: T) => {
   emits("click", index, data);
 };
 
+const showMoreFilter = ()=>{
+  visibleMoreFilter.value=true
+}
+const clearFilter = () =>{  
+  visibleMoreFilter.value = false
+  emits('clearFilter')
+}
+const runFilter = () => {
+  visibleMoreFilter.value = false
+  emits('runFilter')
+}
 onMounted(() => {
   // if(props.withFilter) listviewfilter.value.$el.focus()
 });

package/templates/nuxt/components/renderer/RendererMoney.vue.eta

@@ -1,10 +1,8 @@
 <template>
-  <span v-if="typeof modelValue=='undefined' || typeof modelValue=='string' ">-</span>
-  <span v-else-if="showCurrency">
-    {{
-      currenyValue
-    }}</span
+  <span v-if="typeof modelValue == 'undefined' || typeof modelValue == 'string'"
+    >-</span
   >
+  <span v-else-if="showCurrency"> {{ currenyValue }}</span>
   <span v-else>
     {{ modelValue.toLocaleString(useI18n().defaultLocale, options) }}</span
   >
@@ -16,14 +14,14 @@
  * last change 2024-02-04
  * author: Ks Tan
  */
-const currenyValue = computed(()=>{
-  if(modelValue.value === undefined) return '-'
+const currenyValue = computed(() => {
+  if (modelValue.value === undefined) return "-";
   return Intl.NumberFormat(useI18n().defaultLocale, {
-        // style: "currency",
-        // currency: getUserProfile()?.currency ?? '',
-        // currencyDisplay: "symbol",
-      }).format(modelValue.value)
-})
+    // style: "currency",
+    // currency: getUserProfile()?.currency ?? '',
+    // currencyDisplay: "symbol",
+  }).format(modelValue.value);
+});
 const options = {
   style: "decimal", // Other options: 'currency', 'percent', etc.
   minimumFractionDigits: 2,
@@ -31,4 +29,5 @@ const options = {
 };
 const modelValue = defineModel<number>({ required: true });
 const props = defineProps<{ showCurrency?: boolean }>();
+
 </script>

package/templates/nuxt/components/select/SelectTemplate.vue.eta

@@ -1,12 +1,36 @@
 <template>
-  <Dropdown
-    @update:modelValue="change"
-    v-model="modelValue"
-    :options="options"
-    optionLabel="label"
-    optionValue="value"
-    :placeholder="placeholder"
-  />
+  <div>
+    <div class="flex flex-row ">
+      <label v-if="!hideLabel" :for="fieldid" class="pt-2">
+      {{t(documentName)}}
+      </label>
+      <ButtonText v-if="allowAddNew" @click="addnew" class="text-xs text-blue-600">
+        <span>{{t('new')}}</span>
+      </ButtonText>
+    </div>
+    <MultiSelect
+      :input-id="fieldid"
+      v-if="multiple"
+      display="chip"
+      @update:modelValue="change"
+      v-model="modelValue"
+      :options="options"
+      optionLabel="label"
+      optionValue="value"
+      :placeholder="placeholder"
+    />
+    <Dropdown
+
+      :input-id="fieldid"
+      v-else
+      @update:modelValue="change"
+      v-model="modelValue"
+      :options="options"
+      optionLabel="label"
+      optionValue="value"
+      :placeholder="placeholder"
+    />
+  </div>
 </template>
 <script setup lang="ts">
 /**
@@ -18,15 +42,17 @@
 import Dropdown from "primevue/dropdown";
 import { ForeignKey, FormCrudEvent } from "~/types";
 const emits = defineEmits(["change"]);
-const modelValue = defineModel<string>();
+const modelValue = defineModel<string | string[]>();
 const list = ref<ForeignKey[]>([]);
-
+const fieldid = randomUUID()
 const props = defineProps<{
   documentName: string;
   placeholder?: string;
   showNull?: boolean;
   allowAddNew?: boolean;
-  filter?: any
+  filter?: any;
+  multiple?: boolean;
+  hideLabel?:boolean
 }>();
 const options = ref<
   {
@@ -35,12 +61,12 @@ const options = ref<
   }[]
 >([]);
 const getListOptions = async () => {
-  const filter = props.filter ?? {}
+  const filter = props.filter ?? {};
   const res = await getDocumentApi(props.documentName).autoComplete("", filter);
   list.value = res.data as ForeignKey[];
-  if (props.allowAddNew)
-    list.value.unshift({ _id: "new", code: "", label: t("addNew") });
-  if (props.showNull)
+  // if (!props.multiple && props.allowAddNew)
+  //   list.value.unshift({ _id: "new", code: "", label: t("addNew") });
+  if (!props.multiple && props.showNull)
     list.value.unshift({ _id: "", code: "", label: t("null") });
   options.value = list.value.map((item) => ({
     value: item._id,
@@ -55,7 +81,12 @@ const getItem = (id: string) => list.value?.find((item) => item._id == id);
 
 const change = (id: string) => {
   const selectedItem = getItem(id);
-  if (selectedItem?._id == "new") {
+  emits("change", id, selectedItem);
+  
+};
+
+const addnew=()=>{
+  
     const doc = getDocument(props.documentName)?.docClass;
     if (doc) {
       const tmpdata = doc?.getReactiveData();
@@ -71,9 +102,7 @@ const change = (id: string) => {
           }
         },
       );
-    }
-  } else {
-    emits("change", id, selectedItem);
+   
   }
-};
+}
 </script>

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

@@ -83,7 +83,7 @@
               </ButtonText>
             </template>
             <template #center>
-              <TextTitle>{{ t(docname) }}</TextTitle>
+              <TextTitle class="text-white">{{ t(docname) }}</TextTitle>
             </template>
             <template #end>
               <div></div>

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

@@ -1,14 +1,16 @@
 <template>
   <div class="flex flex-col">
-    <div class="flex flex-row">
-      <div class="p-2 flex-1">
-        <TextTitle v-if="title">{{ title }}</TextTitle>
-      </div>
-      <div class="pr-2">
-        <ButtonDefault v-if="!readOnly" @click="addRow"
-          ><i class="pi pi-plus"></i
-        ></ButtonDefault>
-      </div>
+    <div class="flex flex-row gap-2">
+      
+        <TextTitle v-if="title" class="flex-1">{{ title }}</TextTitle>
+      
+        <div class="flex flex-row"><slot name="buttons"></slot></div>
+      
+        <div>
+          <ButtonDefault v-if="!readOnly" @click="addRow">
+            <i class="pi pi-plus"></i>
+          </ButtonDefault>
+        </div>
     </div>
     <ListView
       class="p-2 dark:bg-slate-900 bg-slate-200 rounded-lg"
@@ -61,10 +63,9 @@ const updateItem = () => {
   showDialog.value = false;
   emits("itemupdated", rowIndex.value);
 };
-const addRow = (event:MouseEvent) =>{
-
-  emits('addrow', MouseEvent)
-  const lineno =  props.list.length -1
-  showRow(lineno, props.list[lineno])
-}
+const addRow = (event: MouseEvent) => {
+  emits("addrow", MouseEvent);
+  const lineno = props.list.length - 1;
+  showRow(lineno, props.list[lineno]);
+};
 </script>

package/templates/nuxt/components/simpleApp/SimpleAppFormToolBar.vue._eta

@@ -66,7 +66,7 @@
     <ConfirmPopup></ConfirmPopup>
   </div>
   <Dialog v-model:visible="visiblePrintFormats" :header="t('printFormats')">
-    <div>      
+    <div>
       <ListView
         :list="printformats"
         #default="{ item, index }"
@@ -84,16 +84,16 @@
     :header="t('printPreview')"
     position="bottom"
   >
-  
     <TextDanger v-if="printservererror || !printstr">
       {{ t("printServerError") }}
     </TextDanger>
-    <vue-pdf-embed v-else-if="isMobile()" 
-        :source="printstr" 
-        :disableTextLayer="true" 
-        />
+    <vue-pdf-embed
+      class="w-11/12"
+      v-else-if="isMobile()"
+      :source="printstr"
+      :disableTextLayer="true"
+    />
     <iframe v-else width="100%" height="100%" :src="printstr"></iframe>
-    
   </Sidebar>
 </template>
 <script setup lang="ts">
@@ -103,7 +103,7 @@
  * last change 2024-04-02
  * author: Ks Tan
  */
- import VuePdfEmbed from 'vue-pdf-embed'
+import VuePdfEmbed from "vue-pdf-embed";
 
 // import VuePdfKit from 'vue-pdf-kit'
 // import 'vue-pdf-kit/dist/style.css'
@@ -190,9 +190,7 @@ const printPdf = async (index: number, format: any) => {
     const tmp: any = await doc
       .getApi()
       .runPrint(data.value._id ?? "", formatid);
-    printstr.value = 
-        "data:application/pdf;base64," + 
-        tmp.data;
+    printstr.value = "data:application/pdf;base64," + tmp.data;
   } catch (e) {
     printservererror.value = true;
     printstr.value = "";
@@ -245,7 +243,7 @@ const emitEvent = async (menu: FormMenu, clickEvent: Event | MouseEvent) => {
       message: `${t("deleteThisRecord?")}`,
 
       // icon: "pi pi-exclamation-triangle gap-4",
-      acceptClass: "p-button-danger",
+      acceptClass: "bg-danger-600 text-white",
       accept: async () => {
         if (await deleteData()) emits("on", FormCrudEvent.delete);
       },
@@ -339,12 +337,12 @@ const getActionIcon = (actionName: string) => {
 };
 </script>
 <style>
-  .vue-pdf-embed {
-    @apply p-4
-  }
-  .vue-pdf-embed > div {
-    @apply mb-4;
-    /* margin-bottom: 8px;
+.vue-pdf-embed {
+  @apply p-4;
+}
+.vue-pdf-embed > div {
+  @apply mb-4;
+  /* margin-bottom: 8px;
     box-shadow: 0 2px 8px 4px rgba(0, 0, 0, 0.1); */
-  }
-</style>
+}
+</style>

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

@@ -134,6 +134,23 @@
       @change="onChange"
     />
 
+
+    <MultiSelect
+      v-model="modelValue"
+      :pt="pt"
+      v-else-if="SimpleAppInputType.selectmultiple == inputType"
+      :inputId="slotprops.uuid"
+      :path="setting.instancepath"
+      :readonly="isReadonly"
+      class="w w-full lg:w-full"
+      :disabled="isReadonly"
+      :options="getListOptions()"
+      optionLabel="label"
+      optionValue="value"
+      :placeholder="placeholder"
+      v-bind="componentProps"
+      @change="onChange"
+    />
     <!-- radio component -->
     <div v-else-if="inputType == SimpleAppInputType.radio">
       <div v-for="(item, index) in getListOptions()">
@@ -236,7 +253,6 @@
       :class="!pt ? 'w-full flex flex-col' : ''"
       :inputId="slotprops.uuid"
       @update:modelValue="onChange"
-      
       :path="setting.instancepath"
       v-bind="componentProps as InputNumber"
       :placeholder="placeholder"
@@ -288,6 +304,8 @@
       v-bind="componentProps as InputTextProps"
     />
     <!-- component require special treatment -->
+
+    <slot name="footer"></slot>
   </SimpleAppFieldContainer>
 </template>
 
@@ -443,10 +461,16 @@ const setFocus = (ev: any) => {
 };
 
 const getListOptions = () => {
-  const options = [];
-  if (props.setting.fieldsetting.enum) {
-    for (let i = 0; i < props.setting.fieldsetting.enum.length; i++) {
-      const v = props.setting.fieldsetting.enum[i];
+  const options = [];  
+  const enumlist = props.setting.fieldsetting.type == 'array' 
+      ? props.setting.fieldsetting.items.enum 
+      : props.setting.fieldsetting.enum 
+
+  
+
+  if (enumlist) {
+    for (let i = 0; i < enumlist.length; i++) {
+      const v = enumlist[i];
       if (typeof v == "string") {
         options.push({ value: v, label: t(v) });
       } else {
@@ -523,7 +547,6 @@ onMounted(() => {
 });
 
 const onChange = () => {
-  console.log("On change ", props.inputType)
   pt.value = undefined;
   resetcount.value++;
   emits("change", modelValue.value);

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

@@ -33,8 +33,15 @@
  */
 import { ref } from "vue";
 import { AxiosResponse } from "axios";
+import {EventType,NotificationStatus} from "~/types"
 const visible = ref(false);
-const data = ref({ tenantName: "" });
+const data = ref({
+  tenantName: "",
+  timeZone: Intl.DateTimeFormat().resolvedOptions().timeZone,
+  utcOffset: new Date().getTimezoneOffset()
+});
+
+
 
 const createtitle = ref("Create My Company");
 const errCreateTenant = ref();
@@ -55,7 +62,16 @@ const createTenant = async () => {
     })
     .catch((err) => {
       errCreateTenant.value = err["message"];
-      console.error("errCreateTenant", err);
+      console.error("errCreateTenant", err.response.data.data);
+
+      useNuxtApp().$event('Notification',{
+        documentName:'tenant',
+        status: NotificationStatus.error,
+        summary:t('createError'),
+        data:err.response?.data?.data
+
+      })
+
     })
     .finally(() => {
       onhold.value = false;

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

@@ -21,6 +21,7 @@ export const dateToISOString = (date:Date) => useDayjs()(date).toISOString()
 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().utc(date).format('YYYY-MM-DD HH:mm:ss')
+export const toLocalDate = (date:string | Date)=> useDayjs().utc(date).format(getDateFormat())
 export const toUTCDate = (date:string | Date)=> useDayjs().utc(date).format(getDateFormat())
 export const toUTCDateTime = (date:string | Date)=> useDayjs().utc(date).format(getDateTimeFormat())
 export const toUTCTime = (date:string | Date)=> useDayjs().utc(date).format('HH:mm')

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

@@ -14,7 +14,7 @@ export const reloadUserStore = async () =>{
     const {$userstore} = useNuxtApp()
     await $userstore.loadRemoteUserInfo()
 }
-
+export const getCurrency = () =>getUserStore()?.currency ?? '$$'
 export const getUserProfile =  () =>{    
     const userstore = getUserStore()
     

package/templates/nuxt/simpleapp/generate/clients/SimpleAppClient.ts.eta

@@ -30,6 +30,7 @@ export class SimpleAppClient<
   TApi extends crudType,
 > {
   // protected defaultTimeOut=5000
+  protected unwantchobj;
   protected docapi;
   public event:Function|null=null;
   public listen:Function|null=null;
@@ -66,18 +67,20 @@ export class SimpleAppClient<
   };
   
   async getById(id?: string) {
+    if(this.unwantchobj)this.unwantchobj()
     return await this.docapi.runFindOne(id,this.axios)
     .then((res: AxiosResponse) => {
       // if(this.event){this.event('info:getById',res.data)}
       this.data.value={} as TData
       Object.assign(this.data.value, res.data);
+      this.setWatchChange()
       return res;
     }).catch((res:any)=>{
       // if(this.event){this.event('error:getById',res)}
       return Promise.reject(res)
     });
   }
-
+  setWatchChange(){}
 
   async runDefault(){
     const res = await this.docapi.runDefault()