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

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

@@ -0,0 +1,64 @@
+<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('enterYourCompanyName')"
+            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())
+}

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

@@ -1,7 +1,19 @@
 /**
  * This file was automatically generated by simpleapp generator. Every
  * MODIFICATION OVERRIDE BY GENERATEOR
- * last change 2023-10-28
+ * last change 2024-03-07
  * Author: Ks Tan
  */
-export const refreshDocumentList = (docName:string)=>useNuxtApp().$event('RefreshDocumentList',{documentName:docName})
+export const refreshDocumentList = (docName:string)=>useNuxtApp().$event('RefreshDocumentList',{documentName:docName})
+export const refreshDocument = (docName:string)=>useNuxtApp().$event('RefreshDocument',docName)
+
+export const listenDocument =  (docName:string,callback:Function) =>{
+    useNuxtApp().$listen('RefreshDocument',async (eventdocname:string)=>{
+        if(eventdocname==docName) await callback()
+    })
+}
+export const listenDocumentList =  (docName:string,callback:Function) =>{
+    useNuxtApp().$listen('RefreshDocumentList',async (eventdata)=>{
+        if(eventdata.documentName == docName) await callback()
+    })
+}

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

@@ -11,7 +11,9 @@ export default {
     //auto generate from schema
     <% for(let i=0; i< it.allfields.length; i++){ %>
     <% let f = it.allfields[i] %>
-        '<%= f %>' : '<%= camelCaseToWords(f) %>',
+        <% if(!it.lang[f]){%>        
+            '<%= f %>' : '<%= camelCaseToWords(f) %>',
+        <%}%>
     <%}%>    
 
 }

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

@@ -105,6 +105,9 @@ devServer: {
   auth: {
     globalAppMiddleware: false
   },
+  dayjs:{
+    plugins: [ 'utc', 'duration']
+  },
   // security: {
     // corsHandler:{
       //  origin: '*' //| 'null' | (string | RegExp)[] | ((origin: string) => boolean);

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

@@ -1,47 +1,69 @@
 <template>
-  <title>{{ t("organization") }}</title>
-  <div class="w-full flex-col flex">     
-      <MobileToolbar>
-        <template #center>{{ t('organization') }}</template>
-        <template #end>
-          <ButtonText @click="showEditOrg=true"><i class="pi pi-pencil"></i></ButtonText>
-        </template>
-      </MobileToolbar>
-      <div class="w-full flex flex-row p-2">        
-        <div class="p-4">
-            <div class="border w-12 h-12 md:w-24 md:h24"></div>
-        </div>
-        <div class="flex flex-col flex-1 ">
-            <TextTitle>{{ data.orgName }} / {{ data.orgCode }}</TextTitle>            
-            <div class="text-gray-600 dark:text-gray-400 text-sm">{{ data.description }}</div>
-            <div class="text-gray-600 dark:text-gray-400 text-sm">
-              {{ data.country }}/{{ data.currency }}/{{ data.timeZone }}//{{ data.offsetMinute }}
-            </div>
-            
-        </div>
+  
+  <div class="w-full flex-col flex">
+    <title>{{ t("organization") }}</title>
+    <MobileToolbar class="bg-gray-600">
+      <template #center><TextTitle class="text-white">{{ t("organization") }}</TextTitle></template>
+      <template #end>
+        <ButtonText @click="showEditOrg = true" class="text-white"
+          ><i class="pi pi-pencil"></i
+        ></ButtonText>
+      </template>
+    </MobileToolbar>
+    
+    <div class="w-full flex flex-row p-2 border-b border-gray-300 ">
+      <div class="p-4">
+        <div class="border w-12 h-12 md:w-24 md:h24"></div>
       </div>
+      <div class="flex flex-col flex-1 ">
+        <TextTitle>{{ data.orgName }} / {{ data.orgCode }}</TextTitle>
+        <TextSubtitle>
+          {{ data.description }}
+        </TextSubtitle>        
+      </div>
+    </div>
 
-
-      <div class="w-full p-2">
-          <h1>Branches</h1>
-          <ButtonText @click="goBranch('new')">{{ t('addBranch') }}</ButtonText>
-          <ListView
-            :list="branchlist"
-            title-field="branchName"
-            sub-title-field="branchCode"
-            :url="getDocumentUrl('organization', id)"
-          >            
-          </ListView>          
+    <div class="w-full p-2 flex flex-col ">
+      
+      <div class="flex flex-row justify-end">
+        <TextTitle class="flex-1 p-2">{{ t('branches') }}</TextTitle>
+        <div>
+          <ButtonPrimary @click="goBranch('new')">
+            <i class="pi pi-plus"></i> <span>{{ t("addBranches") }}</span>
+          </ButtonPrimary>
+        </div>
       </div>
-          
+      <ListView class="border rounded-lg border-gray-400 dark:border-gray-600"        
+        :list="branchlist"
+        title-field="branchName"
+        sub-title-field="branchCode"
+        :url="getDocumentUrl('organization', id)"
+        #default="{item}"
+      >
+        <div class="flex flex-row">
+          <div class="flex-col flex flex-1">
+            <TextPrimary>{{ item.branchName }}</TextPrimary>
+            <TextSubtitle>{{ item.description }}</TextSubtitle>
+          </div>
+          <div class="flex-col flex text-right">
+            <div>{{ item.branchCode }}</div>
+            <renderer-boolean v-model="item.active"></renderer-boolean>
+          </div>
+        </div>
       
-      <OverlaySideBarCrud v-model="showEditOrg" close-event-name="organization">
-        <FormOrganization :_id="getUserProfile()?.orgRecordId" @after="afterOrganization"></FormOrganization> 
-      </OverlaySideBarCrud>
-
-      <OverlaySideBarCrud v-model="showEditBranch" close-event-name="branch">
-        <NuxtPage :_id="id"></NuxtPage> 
-      </OverlaySideBarCrud>
+      </ListView>
+    </div>
+
+    <OverlaySideBarCrud v-model="showEditOrg" close-event-name="organization">
+      <FormOrganization
+        :_id="getUserProfile()?.orgRecordId"
+        @after="afterOrganization"
+      ></FormOrganization>
+    </OverlaySideBarCrud>
+
+    <OverlaySideBarCrud v-model="showEditBranch" close-event-name="branch">
+      <NuxtPage :_id="id"></NuxtPage>
+    </OverlaySideBarCrud>
   </div>
 </template>
 
@@ -56,12 +78,12 @@ import { FormCrudEvent, SimpleAppInputType } from "~/types";
 import ConfirmPopup from "primevue/confirmpopup";
 import { useConfirm } from "primevue/useconfirm";
 const confirm = useConfirm();
-const showEditOrg = ref<boolean>(false)
-const showEditBranch = ref<boolean>(false)
+const showEditOrg = ref<boolean>(false);
+const showEditBranch = ref<boolean>(false);
 
 const { $OrganizationDoc, $BranchDoc, $event, $listen } = useNuxtApp();
 
-const orgId = computed(()=><string>getUserProfile()?.orgRecordId)
+const orgId = computed(() => <string>getUserProfile()?.orgRecordId);
 const doc = $OrganizationDoc();
 const brancdoc = $BranchDoc();
 const data = doc.getReactiveData();
@@ -69,7 +91,7 @@ const branchlist = ref([]);
 const isReadOnly = ref(true);
 const getCurrentOrg = async () => {
   await doc.getById(orgId.value);
-  await fetchRecord()
+  await fetchRecord();
 };
 const fetchRecord = async () => {
   //fetch org
@@ -79,41 +101,38 @@ const fetchRecord = async () => {
     filter: { orgId: data.value.orgId },
   });
 
-  console.log("reload data",branchlist)
+  console.log("reload data", branchlist);
 };
 
 const id = computed((): string => String(useRoute().params.id ?? ""));
 
-
 definePageMeta({
   menuPath: "setting/organization",
 });
 
 //branch record update then reload
 $listen("RefreshDocumentList", async (data) => {
-  console.log("trigger RefreshDocumentList",data)
+  console.log("trigger RefreshDocumentList", data);
   if (data.documentName == "branch" || data.documentName == "organization") {
     await fetchRecord();
   }
 });
 
+const showBranchDialogIfRequired = () => {
+  if (useRoute().path.includes("/new") || id.value) showEditBranch.value = true;
+};
 
-
-const showBranchDialogIfRequired = () =>{
-  if(useRoute().path.includes('/new') || id.value) showEditBranch.value=true
-}
-
-const afterOrganization = (actionName:FormCrudEvent)=>{
-  if(actionName==FormCrudEvent.update){
-    showEditOrg.value=false
-    getCurrentOrg()
+const afterOrganization = (actionName: FormCrudEvent) => {
+  if (actionName == FormCrudEvent.update) {
+    showEditOrg.value = false;
+    getCurrentOrg();
   }
-}
+};
 
-watch(()=>useRoute().path,()=>showBranchDialogIfRequired())
-onMounted(()=>showBranchDialogIfRequired())
+watch(
+  () => useRoute().path,
+  () => showBranchDialogIfRequired(),
+);
+onMounted(() => showBranchDialogIfRequired());
 getCurrentOrg();
-
-
-
 </script>

package/templates/nuxt/pages/index.vue._eta

@@ -1,65 +1,19 @@
 <script lang="ts" setup>
 /**
- * This file was automatically generated by simpleapp generator during initialization. It is changable.
+ * This file was automatically generated by simpleapp generator.
  * --remove-this-line-to-prevent-override--
- * last change 2024-02-22
+ * last change 2024-03-05
  * author: Ks Tan
  */
+const alltenants = ref<any[]>([])
+const totaltenant = ref(0)
+  const list = (await getPorfileApi().getAllTenants()).data as any[];
+  if(list.length==0 || list.length>1) navigateTo('/picktenant')
+  else navigateTo (`/${list[0].permissions[0].xOrg}`)
+  
 </script>
 <template>
-  <div class="grid place-content-center">
-  <title>{{ t('home')}} </title>
-    <ClientOnly><div class="flex flex-row">
-      <div class="block">
-        <h1
-          class="font-bold text-3xl md:text-5xl text-gray-800 dark:text-white"
-        >
-          {{ t("welcomeSimpleApp") }}
-        </h1>
-        <p class="text-gray-600 dark:text-gray-200">
-          {{ t("changeHomePageMsg",{fullName:getProfileFullName()}) }}
-        </p>
-        <div class="">
-          <UserButtonCreateTenant></UserButtonCreateTenant>
-        </div>
-      </div>
-      <div class="hidden lg:block">      
-        <svg
-          :fill="getAvatarColor"
-          viewBox="0 0 512 512"
-          xmlns="http://www.w3.org/2000/svg"
-        >
-          <g id="SVGRepo_bgCarrier" stroke-width="0"></g>
-          <g
-            id="SVGRepo_tracerCarrier"
-            stroke-linecap="round"
-            stroke-linejoin="round"
-          ></g>
-          <g id="SVGRepo_iconCarrier">
-            <g id="Anonymous">
-              <path
-                d="M475.3571,413.24a69.9,69.9,0,0,0-39.8845-57.4407l-39.9287-18.7987,21.5791-44.5621a89.4527,89.4527,0,0,0,.0025-77.9684L359.7988,96.0682C317.7933,9.3105,194.2088,9.31,152.2019,96.0666L94.87,214.4745a89.445,89.445,0,0,0,.0049,77.9692l21.581,44.5569L76.5256,355.8a69.898,69.898,0,0,0-39.8831,57.439l-3.612,43.3773a22.5157,22.5157,0,0,0,22.4381,24.3842H456.5337A22.5134,22.5134,0,0,0,478.97,456.6187ZM364,260.1205a107.9746,107.9746,0,0,1-98.1035,107.5V341.1249a9.8965,9.8965,0,0,0-19.793,0v26.4957A107.9746,107.9746,0,0,1,148,260.1205V203.44a28.8192,28.8192,0,0,1,28.8193-28.8193H335.1806A28.8193,28.8193,0,0,1,364,203.44Z"
-              ></path>
-              <path
-                d="M321.8213,275.9979a9.91,9.91,0,0,0-12.3135,6.6709,13.5776,13.5776,0,0,1-26.0156,0,9.9026,9.9026,0,1,0-18.9844,5.6426,33.3877,33.3877,0,0,0,63.9844,0A9.9125,9.9125,0,0,0,321.8213,275.9979Z"
-              ></path>
-              <path
-                d="M240.8213,275.9979a9.8908,9.8908,0,0,0-12.3135,6.6709,13.5776,13.5776,0,0,1-26.0156,0,9.9026,9.9026,0,1,0-18.9844,5.6426,33.3877,33.3877,0,0,0,63.9844,0A9.9125,9.9125,0,0,0,240.8213,275.9979Z"
-              ></path>
-              <path
-                d="M319,227.4384H283a9.8965,9.8965,0,1,0,0,19.7929h36a9.8965,9.8965,0,1,0,0-19.7929Z"
-              ></path>
-              <path
-                d="M193,247.2313h36a9.8965,9.8965,0,1,0,0-19.7929H193a9.8965,9.8965,0,1,0,0,19.7929Z"
-              ></path>
-            </g>
-          </g>
-        </svg>
-        <p class="text-gray-500 dark:text-gray-200">{{ t('realman') }}</p>
-      </div>
-    </div></ClientOnly>
-    <div class="grid grid-cols-1 lg:grid-cols-2 2xl:grid-cols-3">
-      <UserTenantPicker></UserTenantPicker>
-    </div>
+  <div>
+    redirecting...
   </div>
 </template>

package/templates/nuxt/pages/picktenant.vue._eta

@@ -0,0 +1,19 @@
+<template>
+  <div class="flex flex-col w-full">
+    <TextTitle class="text-center p-2">{{ t("pickYourDatabase") }}</TextTitle>
+    <div class="flex flex-col">
+      <div class="p-4">
+        <UserButtonCreateTenant></UserButtonCreateTenant>
+      </div>
+      <UserTenantPicker></UserTenantPicker>
+    </div>
+  </div>
+</template>
+<script lang="ts" setup>
+/**
+ * This file was automatically generated by simpleapp generator.
+ * --remove-this-line-to-prevent-override--
+ * last change 2023-09-09
+ * author: Ks Tan
+ */
+</script>

package/templates/nuxt/plugins/10.simpleapp-event.ts.eta

@@ -29,8 +29,16 @@ export default defineNuxtPlugin( async(nuxtApp) => {
         return  response
       }, 
       (error) => {
-        if(error.code && error.code == 'ERR_BAD_REQUEST'){
-          console.error("axios ERR_BAD_REQUEST, redirect to relogin")
+        // console.log("error catch",error)
+
+        if(error?.code && error.code == 'ERR_BAD_REQUEST'){
+          // console.log("error.code",error.response.status, error)
+          if(error.response && error.response.status==403){
+            console.warn("error status 403, redirect to external link /" )
+            navigateTo('/',{external:true})
+          }else{
+            console.error("axios ERR_BAD_REQUEST",error)
+          }          
         }        
         else if(error.code){        
           throw createError({