@simitgroup/simpleapp-generator 1.0.59 → 1.0.61

package/templates/nest/src/simpleapp/services/branch.service.ts.eta

@@ -9,19 +9,19 @@ import { Model } from 'mongoose';
 import { Injectable, InternalServerErrorException } from '@nestjs/common';
 import { BranchProcessor } from '../generate/processors/branch.processor';
 import { Branch } from '../generate/types/branch.type';
-import {alldocuments} from '../generate/commons/dicts/documents'
+import { alldocuments } from '../generate/commons/dicts/documents';
 export { Branch } from '../generate/types/branch.type';
 import { AutoincreamentService } from './autoinc.service';
 import { UserContext } from '../generate/commons/user.context';
-import { Docnoformat,DocnoformatService } from './docno.service';
+import { Docnoformat, DocnoformatService } from './docno.service';
 // import { Docnoformat } from '../generate/types/docno.type';
 @Injectable()
 export class BranchService extends BranchProcessor {
   protected strictIsolation = false;
   constructor(
     @InjectModel('Branch') mydoc: Model<Branch>,
-    private increament: AutoincreamentService,    
-    private docnoservice:DocnoformatService
+    private increament: AutoincreamentService,
+    private docnoservice: DocnoformatService,
   ) {
     super(mydoc);
   }
@@ -46,9 +46,9 @@ export class BranchService extends BranchProcessor {
         );
         data.branchId = searchresult.nextno;
         break;
-              case 'afterCreate':
-                await this.generateDefaultDocNumbers(appuser,data);
-              break;
+      case 'afterCreate':
+        await this.generateDefaultDocNumbers(appuser, data);
+        break;
       //         case 'beforeUpdate':
       //         break;
       //         case 'afterUpdate':
@@ -67,40 +67,41 @@ export class BranchService extends BranchProcessor {
     return true;
   };
 
-  generateDefaultDocNumbers =async (appuser,data) => {
-    const branchName = data.branchName
-    const branchCode = data.branchCode
-    const recordId = data._id
-    const branchId= data.branchId
-    const orgId = data.orgId
-    const tenantId = data.tenantId
-    const docformats = alldocuments.filter((item)=>item.docNumber)
-    for(let i=0; i< docformats.length; i++){
-      const doc = docformats[i]
-      const pattern = `${doc.docType}-${branchCode}-[00000]`
-      const formatdata:Docnoformat = {
-        _id:crypto.randomUUID(),
-        docNoFormatNo:'Default',
-        docNoFormatName:'Default',        
+  generateDefaultDocNumbers = async (appuser, data) => {
+    const branchName = data.branchName;
+    const branchCode = data.branchCode;
+    const recordId = data._id;
+    const branchId = data.branchId;
+    const orgId = data.orgId;
+    const tenantId = data.tenantId;
+    const docformats = alldocuments.filter((item) => item.docNumber);
+    for (let i = 0; i < docformats.length; i++) {
+      const doc = docformats[i];
+      const pattern = `${doc.docType}-${branchCode}-[00000]`;
+      const formatdata: Docnoformat = {
+        _id: crypto.randomUUID(),
+        docNoFormatNo: doc.docType,
+        docNoFormatName: `Default ${doc.docType}`,
         docNoType: doc.docType,
-        docNoPattern:  pattern,
-        branch:{_id:recordId,branchId:branchId,label:branchName},
-        branchId:branchId,
-        orgId:orgId,
-        tenantId:tenantId,
-        nextNumber:1,              
-      } as Docnoformat
-      try{
-        const result = await this.docnoservice.create(appuser,formatdata)
-        if(!result){
-          throw new InternalServerErrorException(`Generate default document number for "${branchCode}" failed. Pattern: ${pattern}`,'generateDefaultDocNumbers')
+        docNoPattern: pattern,
+        branch: { _id: recordId, branchId: branchId, label: branchName },
+        branchId: branchId,
+        orgId: orgId,
+        tenantId: tenantId,
+        nextNumber: 1,
+      } as Docnoformat;
+      try {
+        const result = await this.docnoservice.create(appuser, formatdata);
+        if (!result) {
+          throw new InternalServerErrorException(
+            `Generate default document number for "${branchCode}" failed. Pattern: ${pattern}`,
+            'generateDefaultDocNumbers',
+          );
         }
-
-      }catch(err){
-        this.logger.error(err)
-        throw new InternalServerErrorException(err)
+      } catch (err) {
+        this.logger.error(err);
+        throw new InternalServerErrorException(err);
       }
-            
-    }    
-  }
+    }
+  };
 }

package/templates/nest/src/simpleapp/services/user.service.ts.eta

@@ -14,7 +14,6 @@ import { User } from '../generate/types/user.type';
 
 export { User } from '../generate/types/user.type';
 
-
 @Injectable()
 export class UserService extends UserProcessor {
   protected strictIsolation = false;
@@ -45,14 +44,16 @@ export class UserService extends UserProcessor {
       //         break;
       //         case 'afterUpdate':
       //         break;
-      //         case 'beforeDelete':
-      //         break;
-      case 'afterDelete':
-        const result = await this.permdoc.deleteMany({
-          user_id: data['data']['_id'], //delete hook data = _id
-        });
-        this.logger.log(result, 'user deleteHook');
-        break;
+              case 'beforeDelete':
+                console.log("before delete",data)
+                const result = await this.permdoc.deleteMany({
+                  user_id: data['data'], //delete hook data = _id
+                });
+                this.logger.log(result, 'user deleteHook');
+              break;
+      // case 'afterDelete':
+        
+        // break;
       //         case 'beforeFetchRecord':
       //         break;
       //         case 'afterFetchRecord':

package/templates/nuxt/app.vue.eta

@@ -9,7 +9,8 @@
 <template>
   <div>
     <NuxtLayout>      
-      <EventMonitor/>
+      <EventDecision/>
+      <EventNotification/>
       <NuxtPage />
     </NuxtLayout>
     </div>

package/templates/nuxt/assets/css/style.css._eta

@@ -1,12 +1,3 @@
-.btn {
-    @apply p-2  border-2 m-1
-}
-.btn-primary{
-    @apply bg-primary-600 text-white
-}
-.btn-danger{
-    @apply bg-danger-600 text-white
-}
-.btn-warning{
-    @apply bg-danger-600 text-white
-}
+.router-link-exact-active{
+    @apply  bg-primary-100 block
+}

package/templates/nuxt/assets/primevue/passthrough.ts._eta

@@ -5,29 +5,33 @@ import Tailwind from "primevue/passthrough/tailwind";
 const CustomTailwind = usePassThrough(
     Tailwind,
     {
-        button:{
-            root:{
-                class:['p-2 m-2 border']
-            }
+        
+        toast:{
+            root:{ class:'w-1/3 '},
+            message:{},
+            container:{class:'w-full ' },
+            content:{class:'flex flex-row-reverse w-full'},
+            buttonContainer:{class:'hidden'},
         },
-        dialog:{
-            root:{
-               class:['bg-white border p-2' ]
-            }
+        card:{root:{class:'shadow p-4'}},       
+        tabpanel:{headerTitle:{class:'m-3 p-3 bg bg-text-300'},},
+        selectbutton:{
+            root:{class:'flex flex-row gap-1'},
+            button: ({ context }) => ({
+                class: ['text-center border rounded  p-2 cursor-pointer hover:bg-primary-400 hover:text-white', context.active ? 'bg-primary-600 text-white' : '']
+            }),
+            label:{class: 'text-sm'},
+        },
+        button:{root:{class: 'focus:outline-none transition duration-150 ease-in-out rounded px-8 py-2 m-1 border'}},
+        dialog:{root:{class:['border p-2']}},
+        sidebar:{
+            root:{class:'w-1/2 bg-white border p-2 h-full'}
         },
         panel: {
-            root:{
-                class:['border']
-            },
-            title: {
-                class: ['leading-none font-light text-2xl']
-            },
-            header:{
-                class:['bg bg-gray-200 h-10 content-middle']
-            },
-            content:{
-                class:['']
-            }
+            root:{class:['border']},
+            title: {class: ['leading-none font-light text-2xl']},
+            header:{class:['bg bg-gray-200 h-10 content-middle']},
+            content:{class:['']}
         }
     },
 );

package/templates/nuxt/components/ButtonCreateTenant.vue.eta

@@ -1,31 +1,38 @@
 <template>
   <div>
-      <Button class="btn-primary " @click="visible = true">
-        <i class="pi pi-sitemap mr-2"></i>Create My Company 
-      </Button>
-      <Dialog
-        v-model:visible="visible"
-        modal
-        :header="createtitle"
-        class="crudsimple-dialog"
-      >
-        <form @submit.prevent="true" class="flex flex-col text-center">
-          <div v-if="errCreateTenant" class="text-error">
-            {{ errCreateTenant }}
-          </div>
-          <InputText
-            v-else
-            type="text"
-            autofocus="true"
-            v-model:model-value="data.tenantName"
-            placeholder="Organization Name"
-          />
 
-          <Button class=" btn-primary" type="submit" @click="createTenant" :loading="onhold">
-            Create <span class="pi pi-save"></span>
+    <div class="mt-8 md:flex justify-start md:gap-4">
+        <!-- <input  placeholder="Company Name" 
+          class="placeholder-gray-600 dark:bg-gray-800 dark:border-transparent dark:placeholder-gray-200 dark:text-white w-full md:w-1/2 p-4 grid place-items-center border rounded-md focus:outline-none" 
+          v-model:model-value="data.tenantName"
+          /> -->
+         
+        <!-- <button class="">Create</button> -->
+        <form @submit.prevent="true" class="flex flex-row text-center">
+          <div class="flex flex-col">
+            <InputText            
+              type="text"
+              autofocus="true"
+              v-model:model-value="data.tenantName"
+              placeholder="Organization Name"
+            />
+            <div v-if="errCreateTenant" class="text-error">{{ errCreateTenant }}</div>
+          </div>
+          <Button class="w-full md:w-auto bg-primary-800 dark:border-transparent text-white px-8 py-4 border rounded-md hover:bg-primary-800 grid place-items-center font-semibold mt-4 md:mt-0 focus:outline-none focus:ring-2 focus:ring-primary-700 focus:ring-primary-50" type="submit" @click="createTenant" :loading="onhold">
+            Create
           </Button>
         </form>
-      </Dialog>
+    </div>
+
+
+
+
+
+<!-- 
+      <Button @click="visible = true"  v-bind="$attrs">
+        <slot>Create Company</slot>        
+      </Button> -->
+      
   </div>
   
 </template>

package/templates/nuxt/components/ButtonHome.vue.eta

@@ -1,5 +1,5 @@
 <template>
-    <button class="flex flex-row">
+    <button class="flex flex-row" @click="goHome">
         <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke-width="1.5" stroke="currentColor" class="w-6 h-6">
             <path stroke-linecap="round" stroke-linejoin="round" d="M2.25 12l8.954-8.955c.44-.439 1.152-.439 1.591 0L21.75 12M4.5 9.75v10.125c0 .621.504 1.125 1.125 1.125H9.75v-4.875c0-.621.504-1.125 1.125-1.125h2.25c.621 0 1.125.504 1.125 1.125V21h4.125c.621 0 1.125-.504 1.125-1.125V9.75M8.25 21h8.25" />
             </svg>
@@ -7,4 +7,17 @@
         <span>{{ getUserProfile().orgName }}</span>
 
     </button>
-</template>
+</template>
+<script setup lang="ts">
+
+const goHome = () =>{
+    
+    if(getCurrentXorg()){
+        navigateTo(`/${getCurrentXorg()}`)
+    }else{
+        navigateTo(`/`)
+    }
+}
+
+
+</script>

package/templates/nuxt/components/ButtonMenuPicker.vue.eta

@@ -21,13 +21,12 @@ const selectMenu = (menu:MenuData) =>{
     </button>
 
      <Dialog v-model:visible="visible" modal header="Pick Document" >
-      <div class="desktop-shortcut-link">
-          
-          <Button v-for="menu in menus[1].items" @click="selectMenu(menu)">
-            <div v-if="menu.isolationType == 'none'" class="adminmenu">
+      <div class="">
+          <Button v-for="menu in menus" @click="selectMenu(menu)">
+            <div v-if="menu.isolationType == 'none'" class="">
               * {{ camelCaseToWords(menu.label) }}
             </div>
-            <div v-else class="usermenu">{{ camelCaseToWords(menu.label) }}</div>
+            <div v-else class="">{{ camelCaseToWords(menu.label) }}</div>
           </Button>
         </div>
     </Dialog>
@@ -37,19 +36,5 @@ const selectMenu = (menu:MenuData) =>{
   </div>
 </template>
 <style scoped>
-.desktop-shortcut-link {
-  @apply m-2 p-2 space-x-2 rounded-sm text-center grid grid-cols-4 gap-4;
-}
-.desktop-shortcut-link .adminmenu {
-  @apply bg-red-300 p-2;
-}
-.desktop-shortcut-link .adminmenu:hover {
-  @apply bg-red-600 p-2;
-}
-.desktop-shortcut-link .usermenu {
-  @apply bg-teal-300 p-2;
-}
-.desktop-shortcut-link .usermenu:hover {
-  @apply bg-teal-600 p-2;
-}
+
 </style>

package/templates/nuxt/components/ButtonPermissionInfo.vue.eta

@@ -1,20 +1,18 @@
 <template>
     
   <div>        
-        <Button
-              class="btn-primary pi pi-question"
-              @click="previewPermission"
-            >          
-        </Button>
+        <button class="" @click="previewPermission">
+            <i class="pi pi-question-circle" ></i>
+        </button>
         <Sidebar
                 v-model:visible="showpermissioninfo"
-                modal
+                modal                
                 :header="permissiontitle"
                 position="right"
             >
             <SelectButton v-model="selectedgroup"  @change="selectGroup" :options="grouplist" option-label="label" option-value="value"></SelectButton>                                          
             <div v-if="selectedgroup">
-                    <div  v-if="useRuntimeConfig().public.DEBUGDATA" class="flex flex-row gap-2 p-2">
+                    <div  v-if="useRuntimeConfig().public.DEBUGDATA" class="flex flex-row gap-2 p-2 ">
                         <div class="flex align-items-center">
                             <RadioButton v-model="mode" inputId="modepreview" name="pizza" value="preview" />
                             <label for="modepreview" class="ml-2">Preview</label>

package/templates/nuxt/components/ButtonProfile.vue.eta

@@ -5,7 +5,21 @@ import {ref} from 'vue'
 
 const userprofileoverlay = ref();
 const toggle = (event:any) => {
-    userprofileoverlay.value.toggle(event);
+    userprofileoverlay.value.toggle(event);   
+}
+const toProfile = ()=>{    
+    userprofileoverlay.value.toggle();   
+
+    if(getCurrentXorg()){
+        navigateTo(`/${getCurrentXorg()}/profile`)
+    }else{
+        navigateTo(`/profile`)
+    }
+    
+}
+const toFrontpage = () =>{
+    userprofileoverlay.value.toggle();   
+    navigateTo('/')
 }
 
 </script>
@@ -16,37 +30,40 @@ const toggle = (event:any) => {
             
             <div class="flex flex-row-reverse  cursor-pointer border-none w-full" @click="toggle">                    
                 <p>{{ getUserProfile().fullName }}</p>
-                <Avatar :image="getUserStore().getAvatarLink(32)" class="" size="normal" shape="circle" />                
+                <!-- <Avatar :image="getUserStore().getAvatarLink(32)" class="" size="normal" shape="circle" />                 -->
+                <div class="w-8 h-8 bg-cover bg-center rounded-md">
+                    <img :src="getAvatarLink(getUserProfile().email,32)" alt="" class="h-full w-full overflow-hidden object-cover rounded-full border-2 border-white dark:border-gray-700 shadow" />
+                </div>
             </div>
             
         </div>
-        <OverlayPanel ref="userprofileoverlay">                    
-            <div class="flex flex-col">
-                <div class="flex flex-row">
-                    <div class="content-center	border">            
-                        <Avatar :image="getUserStore().getAvatarLink(60)" class="mr-2" size="xlarge" shape="circle" />            
-                    </div>
-                    <div>
-                        <div  class="text text-center border">
-                            {{getUserProfile().fullName }}
-                        </div>
-                        <div  class="text text-center text-sm border" >
-                            {{getUserProfile().group }}
+        <OverlayPanel :pt="{root:{class:'w w-80'}}" ref="userprofileoverlay">                    
+            <div>
+                <div class="py-2 transition duration-150 ease-in-out z-10 absolute top-0 right-0 bottom-0 left-0" id="modal">
+                    <div role="alert" class="container mx-auto w-full md:w-full max-w-lg">
+                        <div class="relative p-4 md:p-8 bg-white dark:bg-gray-800 shadow-md rounded border border-gray-400">
+                            <div class="w-full flex items-center justify-start text-gray-600 dark:text-gray-400 mb-5 cursor-pointer" @click="toProfile">
+                                <div class="w-12 h-12 bg-cover bg-center rounded-md">
+                                    <img :src="getAvatarLink(getUserProfile().email,32)" alt="" class="h-full w-full overflow-hidden object-cover rounded-full border-2 border-white dark:border-gray-700 shadow" />
+                                </div>
+                                <div class="flex flex-col cursor-pointer" >
+                                    <h1 class="text-left text-gray-800 dark:text-gray-100 font-lg font-bold tracking-normal leading-tight ml-2">{{ getUserProfile().fullName }}</h1>
+                                    <p  class="text-gray-400 dark:text-gray-100 font-normal text-base tracking-normal ml-2 mr-4">{{getUserProfile().group }}</p>
+                                </div>
+                                
+                            </div>
+                            
+                            <div class="flex items-center justify-start w-full">
+                                <button class="focus:outline-none transition duration-150 ease-in-out hover:bg-gray-600 bg-gray-700 rounded text-white px-8 py-2 text-sm" @click="toFrontpage">Tenant</button>
+                                <!-- <button class="focus:outline-none transition duration-150 ease-in-out bg-gray-600  rounded text-white px-8 py-2 text-sm" @click="toFrontpage">Pick Tenant</button> -->
+                                <button class="focus:outline-none ml-3 bg-warning-100 dark:bg-warning-700 dark:border-warning-700 dark:hover:bg-warning-600 transition duration-150 text-gray-600 dark:text-gray-400 ease-in-out hover:border-gray-400 hover:bg-gray-300 border rounded px-8 py-2 text-sm" @click="logout()">Logout</button>
+                            </div>                            
                         </div>
                     </div>
                 </div>
-            
-            
-            <div class="flex flex-row gap-2 border">
-                <Button class="border">
-                    <i class="pi pi-user"></i>profile
-                </Button>    
-                <Button class="border" @click="logout()">
-                    <i class="pi pi-sign-out"></i>logout
-                </Button>    
+                
             </div>
-            
-        </div>
+
         </OverlayPanel>
     </div>
 </template>

package/templates/nuxt/components/CrudSimple.vue.eta

@@ -156,7 +156,7 @@ onNuxtReady(()=>{
       <DebugDocumentData v-model="data"/>
     </div>
 
-    <Dialog v-model:visible="visible" modal :header="popuptitle" class="crudsimple-dialog" :autoZIndex="false" :style="{zIndex:100, width: '80vw' }">        
+    <Dialog v-model:visible="visible" modal :header="popuptitle" class="crudsimple-dialog" :autoZIndex="false" :pt="{root:{class:'h-full w-full bg-white'}}">        
         <SimpleAppForm :document="obj"  #default="o">     
             <div class="simpleapp-tool-bar   col-span-4 text-left gap-4"  >
               <Button class=" btn-default" :disabled="disabled" @click="newData" type="button" v-if="canPerform(resourcename,'create')">New</Button>

package/templates/nuxt/components/EventDecision.vue.eta

@@ -0,0 +1,115 @@
+<script setup lang="ts">
+/**
+ * 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 {Notification, EventType} from '~/types'
+import { useToast, } from 'primevue/usetoast';
+import type {  ToastMessageOptions } from 'primevue/toast';
+import Toast from 'primevue/toast';
+import { stringify } from 'ajv';
+import {upperFirst, last } from 'lodash'
+
+// const toast = useToast();
+// const { $event,$listen } = useNuxtApp()
+// WildcardHandler<Record<EventType, unknown>>
+// let resmsg:ToastMessageOptions = {} as ToastMessageOptions
+
+
+// $listen('*',(type:key of EventType,data:any)=>{ 
+//     console.log("Event type",type,'data',data)
+//     let arrupdate = type.split(':')
+//     let eventdata = data
+//     let duration = 3000
+//     let severity:typeof resmsg['severity'] 
+//     let isshow=true
+//     let toastgroup='default'
+//     let eventname = arrupdate[1]
+//     let eventtype = arrupdate[0]
+//     let title = ''
+//     if(type.indexOf('error')>=0){
+//         duration = 0
+//         severity='error'
+//         title=upperFirst(eventname) +' failed'
+//     }
+//     else if(type.indexOf('warn')>=0){
+//         duration = 10000
+//         severity='warn'
+//         title=upperFirst(eventname) +' with warning'
+//     }
+//     else if(type.indexOf('info')>=0){
+//         duration = 3000
+//         severity='info'
+//         isshow=false
+//         title='Info'
+//     }
+//     else if(type.indexOf('success')>=0){
+//         duration = 3000
+//         severity='success'
+//         title= upperFirst(eventname) +' successfully'
+//     }
+//     if(Array.isArray(data)){
+//         toastgroup='list'
+//     }else if(typeof data == 'object'){
+//         // title = camelCaseToWords(useCamelCase(title.replace(":","-")))
+//         eventdata = data.message
+//     }
+    
+    
+//     if(isshow && severity){
+//         console.log("isshow",isshow,"event:",severity,eventdata)
+//         toast.removeAllGroups()
+//         resmsg = { severity: severity, summary: title, detail :eventdata, life: duration, group:toastgroup}
+//         toast.add(resmsg)
+//     }
+//     isshow=false
+    
+// })
+
+
+// const getFieldName = (path:string)=>{
+//     const lastword :string= last<string>(path.split('/'))??''
+//     return camelCaseToWords(lastword)
+//     // const lastField = path.split
+// }
+</script>
+<template>
+    <div></div>
+    <!-- <Toast group="default" :pt="{}">
+        <template #message="p">
+            <div class="bg-gray-200 dark:bg-gray-900 h-full w-full border">                
+                <div class=" flex content content-end w-full">
+                    <div role="alert" class="w-full bg-white dark:bg-gray-800 shadow-lg rounded flex flex-row  transition duration-150 ease-in-out" id="notification">
+                        <div class=" flex items-center justify-center bg-primary-500 sm:rounded-tl sm:rounded-bl  h-12 sm:h-auto sm:w-auto text-white">
+                            <svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24" width="40" height="40" fill="currentColor">
+                                <path class="heroicon-ui" d="M12 22a10 10 0 1 1 0-20 10 10 0 0 1 0 20zm0-2a8 8 0 1 0 0-16 8 8 0 0 0 0 16zm-2.3-8.7l1.3 1.29 3.3-3.3a1 1 0 0 1 1.4 1.42l-4 4a1 1 0 0 1-1.4 0l-2-2a1 1 0 0 1 1.4-1.42z" />
+                            </svg>
+                        </div>
+                        <div class="flex flex-col justify-center  pl-4 xl:pl-1 w-96 pt-4 sm:pb-4 pb-2">
+                            <p class="text-lg text-gray-800 dark:text-gray-100 font-semibold pb-1">{{ p.message.summary }}</p>
+                            <p class="text-sm text-gray-600 dark:text-gray-400 font-normal"></p>
+                        </div>
+                        <div class="flex sm:flex-col sm:justify-center sm:border-l dark:border-gray-700  w w-36 items-center border-gray-300 pl-4">
+                            <div class="sm:pt-4 pb-4 sm:border-b dark:border-gray-700 border-gray-300 w w-full flex sm:justify-center">
+                                <span class="sm:text-sm text-xs text-green-400 font-bold mr-4 sm:mr-0 cursor-pointer">View</span>
+                            </div>
+                            <div class="sm:pt-4 pb-4 flex sm:justify-center w w-full cursor-pointer" >
+                                <span class="sm:text-sm text-xs text-gray-600 dark:text-gray-400 cursor-pointer" @click="toast.remove(p.message)">Dismiss</span>
+                            </div>
+                        </div>
+                    </div>
+                </div>
+            </div>
+        </template>
+    </Toast>
+    <Toast group="list">
+        <template #message="p">
+            
+            <ol>
+                <li v-for="(item,index) in  p.message.detail" :key="index"><b>{{getFieldName(item.instancePath)}}</b>: {{ item.message }}</li>
+            </ol>            
+        </template>
+    </Toast> -->
+</template>