@simitgroup/simpleapp-generator 1.2.8 → 1.3.0-alpha

package/templates/basic/nuxt/pages.landing.vue.eta

@@ -1,55 +1,62 @@
+<% const skipcolumns = ['_id','createdBy','created','updatedBy','updated','orgId','branchId','tenantId','doctype'] %>  
 <template>
 
-   <DocPageList :document="doc" :columns="columns" :sorts="sorts">
-    <title v-if="!id">{{ t(doc.getDocName())  }} </title>
-    <div>    
-                <NuxtPage :_id="id ?? 'new'"/>
-  
-    
-    </div>
-  </DocPageList>
+   <PageDocList :document="doc" :columns="columns" :data="docdata" :sorts="sorts">
+   <template #mobileList="{index,item}">
+   </template>
+   <template #dataTableColumns>
+    <%Object.keys(it.jsonschema.properties).forEach(function(key) { %>
+          <%let obj=it.jsonschema.properties[key] %>
+          <%let config=it.jsonschema['x-simpleapp-config'] %>
+          <%if(skipcolumns.indexOf(key)>=0){%>
+          <%} else if(config['uniqueKey'] && (config['uniqueKey']==key || config['documentTitle']==key)  ){%>
+          <Column #body="{index,data}" :header="t('<%=key%>')">
+            <RendererLink :value="data" :setting="{path:'<%=it.name%>'}" :fields="['<%=key%>']">{{ data.<%=key%> }}</RendererLink>
+          </Column>
+
+          <%} else if(['string','number','integer','boolean'].indexOf(obj.type)>=0){%>
+            <Column #body="{index,data}" :header="t('<%=key%>')">
+              {{data.<%=key%>}}
+            </Column>          
+          <%} else if(obj.type =='object' && obj['x-foreignkey'] ){%>
+            <Column #body="{index,data}" :header="t('<%=key%>')">
+              <RendererViewer :value="data.<%=key%>" :setting="{documentName:'<%=obj["x-foreignkey"]%>'}" :fields="['<%=key%>']">{{ data.label }}</RendererViewer>
+            </Column>            
+          <%}%>
+      <%})%>
+   </template>
+   <template #default><div><NuxtPage :_id="id ?? 'new'"/></div></template>    
+  </PageDocList>
 </template>
 <script setup lang="ts">
 /**
- * This file was automatically generated by simpleapp everytime regenerate code.
- * delete file "delete-me.txt" if you want to modify this file and 
- * prevent regenerate code override it.
+ * This file was automatically generated by simpleapp generator.
+ * --remove-this-line-to-prevent-override--
  * last change 2023-09-09
  * author: Ks Tan
  */
-<% const skipcolumns = ['_id','createdBy','created','updatedBy','updated','orgId','branchId','tenantId','doctype'] %>  
+
   
-  import { CellSetting } from "~/types";
   const {$<%= it.typename %>Doc,$listen } = useNuxtApp();
   const doc = $<%= it.typename %>Doc()
-  const data = doc.getReactiveData();
+  const docdata = doc.getReactiveData();
   
   definePageMeta({
-    menuPath:'sample/<%= it.name %>'    
+    menuPath:'nocategory/<%= it.name %>'    
   });
 
-  const columns:CellSetting[] = [<%Object.keys(it.jsonschema.properties).forEach(function(key) { %>
+  const columns= [<%Object.keys(it.jsonschema.properties).forEach(function(key) { %>
         <%let obj=it.jsonschema.properties[key] %>
         <%let config=it.jsonschema['x-simpleapp-config'] %>
-        <%if(skipcolumns.indexOf(key)>=0){%>/* skip system columns <%=key%>*/
-        <%} else if(config['uniqueKey'] && (config['uniqueKey']==key || config['documentTitle']==key)  ){%>
-          {
-            title: '<%=key%>',
-            field: '*',
-            moreFields:['<%=key%>'],
-            rendererName: "RendererLink",
-            rendererSetting: { path: "<%=config['documentName']%>" },
-          },
-        <%} else if(['string','number','integer'].indexOf(obj.type)>=0){%>'<%=key%>',
-        <%} else if(obj.type =='object' && obj['x-foreignkey'] ){%>
-            { 
-              title:'<%=key%>', 
-              field:'<%=key%>',
-              rendererName:'RendererForeignKey',
-              rendererSetting:{collection:'<%=obj["x-foreignkey"]%>' }
-            },
-        <%}%>
-    <%})%>]  as CellSetting[]
+        <%if(skipcolumns.indexOf(key)>=0){%>
+        <%}else if(['string','number','integer','boolean'].indexOf(obj.type)>=0){%>'<%=key%>',
+        <%} %>
+    <%})%>]
+
+
+
+
+
   const sorts:string[][] = [
     <%if(it.jsonschema['x-simpleapp-config'] && it.jsonschema['x-simpleapp-config']['uniqueKey']){%>
         ['<%=it.jsonschema['x-simpleapp-config']['uniqueKey']%>','asc'],

package/templates/basic/nuxt/pages.viewer.vue.eta

@@ -1,20 +1,18 @@
 <template>
-    <Crud :_id="_id" @after="after" :paras="paras"/>
+    <LazyForm<%=it.typename%> :_id="_id" @after="after" :paras="paras"/>
 </template>
 <script setup lang="ts">
 /**
  * This file was automatically generated by simpleapp everytime regenerate code.
- * delete file "delete-me-for-avoid-override" if you want to modify this file and 
- * prevent regenerate code override it.
+ * --remove-this-line-to-prevent-override--
  * last change 2023-09-09
  * author: Ks Tan
  */
-import Crud from './form.vue'
 import {<%= it.typename %>} from '~/simpleapp/generate/types'
 const props = defineProps<{_id:string,paras?:<%= it.typename %>}>();
 const emits = defineEmits(["afterCreate","after"]);
 
-const after = (actionName: string, data: <%= it.typename %>, result: any) => {
+const after = (actionName: string, data: <%= it.typename %>) => {
   switch (actionName) {
     case "new":
       break;
@@ -26,6 +24,6 @@ const after = (actionName: string, data: <%= it.typename %>, result: any) => {
     case "delete":
       break;
   }
-  emits("after",actionName,data,result)
+  emits("after",actionName,data)
 };
 </script>

package/templates/nest/.env._eta

@@ -33,7 +33,6 @@ AUTH_SECRET_KEY=<%=it.configs.oauthSetting.oauthAuthSecretKey%>
 
 BACKEND_URL=http://localhost:<%=it.configs.backendPort%>
 
-AUTH_ORIGIN=http://localhost:8080
 
 ADMIN_EMAIL= 
 TEST_OAUTH2_USERNAME=

package/templates/nest/src/simpleapp/generate/commons/user.context.ts.eta

@@ -56,6 +56,8 @@ export class UserContext {
   protected orgCode: string = '';
   protected orgName: string = '';
   protected timeZone: string = '';
+  protected country: string = '';
+  protected offsetMinute: number =0;
   protected currency: string = '';
   protected branches: any[] = [];
   protected lastActivity: string = new Date().toISOString();
@@ -88,6 +90,8 @@ export class UserContext {
   getBranchId = () => this.branchId;
   getEmail = () => this.email;
   getTimeZone = () => this.timeZone;
+  getCountry = () => this.country
+  getOffsetMinute = () => this.offsetMinute
   getGroup = () => this.group;
   getCurrency = () => this.currency;
   getMoreProps = () => this.moreProps;
@@ -212,6 +216,8 @@ export class UserContext {
           userinfo.orgName = myperm.currentorg[0].orgName;
           userinfo.timeZone = myperm.currentorg[0].timeZone;
           userinfo.currency = myperm.currentorg[0].currency;
+          userinfo.country =  myperm.currentorg[0].country;
+          userinfo.offsetMinute =  myperm.currentorg[0].offsetMinute;
         }
       } else {
         userinfo.group = '';
@@ -262,7 +268,9 @@ export class UserContext {
       this.orgCode = userinfo['orgCode'] ?? '';
       this.orgName = userinfo['orgName'] ?? '';
       this.timeZone = userinfo['timeZone'] ?? '';
-      this.currency= userinfo['currency'] ?? '';
+      this.currency = userinfo['currency'] ?? '';
+      this.country = userinfo['country'] ?? '';
+      this.offsetMinute = userinfo['offsetMinute'] ?? '';      
       this.orgRecordId = userinfo['orgRecordId'] ?? '';
       this.branchRecordId = userinfo['branchRecordId'] ?? '';
       this.group = userinfo['group'] ?? '';
@@ -384,6 +392,8 @@ export class UserContext {
       orgName: this.orgName,
       timeZone: this.getTimeZone(),
       currency: this.getCurrency(),
+      country : this.getCountry(),
+      offsetMinute: this.getOffsetMinute(), 
       email: this.getEmail(),
       uid: this.getUid(),
       fullName: this.getFullname(),
@@ -681,8 +691,10 @@ export class UserContext {
       'orgName',
       'timeZone',
       'currency',
+      'country',
+      'offsetMinute',
       'tenantId',
-      'lastActivity',      
+      'lastActivity',
       'group',
       '__v',
       'uid',

package/templates/nest/src/simpleapp/generate/controllers/simpleapp.controller.ts.eta

@@ -15,8 +15,8 @@ import {
   Type,
 } from '@nestjs/common';
 // import { ApiTags, ApiBody, ApiResponse, ApiOperation } from '@nestjs/swagger';
-import {UserContext} from '../commons/user.context'
-import {SearchBody} from '../types';
+import { UserContext } from '../commons/user.context';
+import { SearchBody } from '../types';
 const doctype = 'person'.toUpperCase();
 type ServiceType = {
   list: Function;
@@ -27,13 +27,18 @@ type ServiceType = {
   findById: Function;
   findIdThenDelete: Function;
   findIdThenUpdate: Function;
+  findIdThenPatch: Function;
   setData: Function;
   getAutoComplete: Function;
 };
 
 // @ApiTags(doctype)
 // @Controller(doctype.toLowerCase())
-export class SimpleAppAbstractController<TService extends ServiceType, TApiSchema, T> {
+export class SimpleAppAbstractController<
+  TService extends ServiceType,
+  TApiSchema,
+  T,
+> {
   protected service: TService;
   protected tryno: number;
   //   protected apiSchemaClass=
@@ -42,36 +47,45 @@ export class SimpleAppAbstractController<TService extends ServiceType, TApiSchem
     this.service = service;
   }
 
-  async _list(appuser:UserContext) {
-    return this.service.list(appuser,);
+  async _list(appuser: UserContext) {
+    return this.service.list(appuser);
   }
-  async _search(appuser:UserContext,searchObject:SearchBody) {
-    
-    return this.service.search(appuser,searchObject['filter'], searchObject['fields'],searchObject['sorts']);
+  async _search(appuser: UserContext, searchObject: SearchBody) {
+    return this.service.search(
+      appuser,
+      searchObject['filter'],
+      searchObject['fields'],
+      searchObject['sorts'],
+    );
   }
-  async _autocomplete(appuser:UserContext,keyword: string) {
-    return this.service.getAutoComplete(appuser,keyword);
+  async _autocomplete(appuser: UserContext, keyword: string) {
+    return this.service.getAutoComplete(appuser, keyword);
   }
-  async _findOne(appuser:UserContext,id: string) {
-    const result = (await this.service.findById(appuser,id)) as TApiSchema;
+  async _findOne(appuser: UserContext, id: string) {
+    const result = (await this.service.findById(appuser, id)) as TApiSchema;
 
     return result as Type<TApiSchema>;
   }
 
-  async _create(appuser:UserContext,data: TApiSchema) {
+  async _create(appuser: UserContext, data: TApiSchema) {
     //const newdata: persontype.Person = { ...data };
     const newdata: T = {} as T; //= { ...data };
     Object.assign(newdata, data); //
-    return this.service.create(appuser,newdata) as TApiSchema;
+    return this.service.create(appuser, newdata) as TApiSchema;
   }
 
-  async _update(appuser:UserContext,id: string, data: TApiSchema) {
+  async _update(appuser: UserContext, id: string, data: TApiSchema) {
     const newdata: T = {} as T; //= { ...data };
     Object.assign(newdata, data); //
-    return this.service.findIdThenUpdate(appuser,id, newdata) as TApiSchema;
+    return this.service.findIdThenUpdate(appuser, id, newdata) as TApiSchema;
+  }
+  async _patch(appuser: UserContext, id: string, data: TApiSchema) {
+    const newdata: T = {} as T; //= { ...data };
+    Object.assign(newdata, data); //
+    return this.service.findIdThenPatch(appuser, id, newdata) as TApiSchema;
   }
 
-  async _delete(appuser:UserContext,id: string) {
-    return this.service.findIdThenDelete(appuser,id);
+  async _delete(appuser: UserContext, id: string) {
+    return this.service.findIdThenDelete(appuser, id);
   }
 }

package/templates/nest/src/simpleapp/generate/processors/simpleapp.processor.ts.eta

@@ -32,7 +32,12 @@ import {
 } from '@nestjs/common/exceptions';
 import { UserContext } from '../commons/user.context';
 import { DocNumberFormatGenerator } from '../commons/docnogenerator.service';
-import { IsolationType, DefaultHooks, MoreProjectionType,DeleteResultType } from '../types';
+import {
+  IsolationType,
+  DefaultHooks,
+  MoreProjectionType,
+  DeleteResultType,
+} from '../types';
 @Injectable()
 export class SimpleAppService<T extends { _id?: string }> {
   @Inject(EventEmitter2)
@@ -447,7 +452,7 @@ export class SimpleAppService<T extends { _id?: string }> {
     try {
       if (this.hooks.beforeDelete) await this.hooks.beforeDelete(appuser, id);
       this.logger.debug('delete record', this.documentName, id);
-      dependency = await this.getRelatedRecords(appuser,id);
+      dependency = await this.getRelatedRecords(appuser, id);
       //console.log('dependency', dependency);
       if (!dependency) {
         let filterIsolation = this.getIsolationFilter(appuser);
@@ -460,7 +465,10 @@ export class SimpleAppService<T extends { _id?: string }> {
           .session(dbsession);
 
         appuser.addDeletedRecordId(this.documentName, id);
-        const deleteresult:DeleteResultType<T> = { result: result, data: deletedata };
+        const deleteresult: DeleteResultType<T> = {
+          result: result,
+          data: deletedata,
+        };
         this.logger.debug(
           deleteresult,
           ' delete result' + this.doc.collection.name,
@@ -472,9 +480,9 @@ export class SimpleAppService<T extends { _id?: string }> {
         //this.doc.findByIdAndDelete(id);
         return deleteresult;
       } else {
-        console.log("reject query",dependency)
+        console.log('reject query', dependency);
 
-        throw new ForbiddenException(dependency,'Foreignkey constraint');
+        throw new ForbiddenException(dependency, 'Foreignkey constraint');
       }
     } catch (err) {
       throw new InternalServerErrorException(err);
@@ -504,13 +512,13 @@ export class SimpleAppService<T extends { _id?: string }> {
     if (!dbsession.inTransaction()) {
       dbsession.startTransaction();
     }
-
     // try {
     Object.assign(data, appuser.getUpdateFilter());
-    Object.assign(existingdata, data);
+    // Object.assign(existingdata, data);
     delete data['_id'];
 
     this.reCalculateValue(data);
+
     // existingdata['_id']=''
     // console.log("newdata",data)
     await this.validateData(appuser, data);
@@ -520,10 +528,63 @@ export class SimpleAppService<T extends { _id?: string }> {
 
     isolationFilter['_id'] = id;
     this.applyNestedDateTime(appuser, data, 'update');
+
     try {
-      const result = await this.doc
-        .findOneAndUpdate(isolationFilter, data)
-        .session(dbsession);
+      const result = await this.doc.findOneAndReplace(isolationFilter, data, {
+        session: dbsession,
+      });
+
+      appuser.addUpdatedRecordId(this.documentName, data._id);
+
+      if (this.hooks.afterUpdate)
+        await this.hooks.afterUpdate(appuser, id, result);
+      return await this.findById(appuser, id);
+    } catch (err) {
+      throw new InternalServerErrorException(err.message);
+    }
+  };
+  
+  findIdThenPatch = async (
+    appuser: UserContext,
+    id: string,
+    data: T,
+    session: mongo.ClientSession = undefined,
+  ) => {
+    const existingdata = await this.findById(appuser, id);
+    if (!existingdata) {
+      throw new NotFoundException(`${id} not found`, 'not found');
+    }
+
+    if (this.hooks.beforeUpdate)
+      await this.hooks.beforeUpdate(appuser, id, data);
+
+    const dbsession = appuser.getDBSession();
+    if (!dbsession.inTransaction()) {
+      dbsession.startTransaction();
+    }
+    // try {
+    Object.assign(data, appuser.getUpdateFilter());
+    // Object.assign(existingdata, data);
+    delete data['_id'];
+
+    this.reCalculateValue(data);
+
+    // existingdata['_id']=''
+    // console.log("newdata",data)
+    //path record no validation
+    // await this.validateData(appuser, data);
+
+    const isolationFilter = { ...this.getIsolationFilter(appuser) };
+    this.polishIsolationFilter(isolationFilter);
+
+    isolationFilter['_id'] = id;
+    this.applyNestedDateTime(appuser, data, 'update');
+
+    try {
+      const result = await this.doc.findOneAndUpdate(isolationFilter, data, {
+        session: dbsession,
+      });
+
       appuser.addUpdatedRecordId(this.documentName, data._id);
 
       if (this.hooks.afterUpdate)
@@ -535,9 +596,9 @@ export class SimpleAppService<T extends { _id?: string }> {
   };
 
   //find what foreign key constraint
-  async getRelatedRecords(appuser:UserContext,id: string) {
+  async getRelatedRecords(appuser: UserContext, id: string) {
     this.logger.debug('get foreignkey for delete:', id);
-    console.log("session modifeds",appuser.getModifieds())
+    console.log('session modifeds', appuser.getModifieds());
     if (foreignkeys === undefined) {
       this.logger.error('foreignkeys object undetected');
       throw new InternalServerErrorException('foreignkeys object undetected');
@@ -562,7 +623,9 @@ export class SimpleAppService<T extends { _id?: string }> {
           //not deleted in current session, check from database
           let filter = {};
           filter[fkey] = id;
-          const result = await collection.findOne(filter,{session:appuser.getDBSession()});
+          const result = await collection.findOne(filter, {
+            session: appuser.getDBSession(),
+          });
           if (result) {
             this.logger.error(result, 'related result found');
             return result;

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

@@ -1,6 +1,6 @@
 
 [disabled] ,[readonly]{
-    @apply bg-gray-300 dark:bg-gray-900
+    @apply bg-gray-300 dark:bg-gray-600
 }
 
 [aria-selected=true]{
@@ -13,21 +13,27 @@
 [data-pc-section=pagebutton]{
     @apply p-3 m-0 border
 }
+html {
+    overflow: hidden;
+    overscroll-behavior: none;
+    touch-action: manipulation;
+}
+/* #__nuxt{
+
+} */
 
 body {
-    @apply bg-gray-50  dark:bg-gray-800  h-screen w-screen overflow-y-scroll 
+    @apply bg-gray-100  dark:bg-slate-950 dark:text-gray-300 h-screen w-screen 
+    /* overflow-y-scroll  overflow-x-scroll  */    
 }
 
-input {
-    @apply  bg-opacity-0	 bg-black
-}
 
 .route-link-list {
- @apply hover:bg-secondary-200  dark:hover:bg-gray-800 
+ @apply text-black hover:text-secondary-200  dark:hover:text-primary-400 
 }
 
 .router-link-exact-active{
-    @apply  bg-primary-100  dark:bg-gray-800  block
+    @apply  text-primary-100  dark:text-primary-600  block
 }
 
 .invisible{
@@ -39,6 +45,10 @@ input {
 .subtitle-text{
     @apply text-base text-gray-500
 }
+.p-inputnumber-input{
+    @apply text-right
+}
+
 
 .btn {
     @apply font-medium  text-gray-50 dark:text-gray-300 border
@@ -56,3 +66,5 @@ input {
 .btn-warn {
     @apply btn bg-warning-600 hover:bg-warning-400 
 }
+
+

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

@@ -16,13 +16,17 @@ const CustomTailwind = usePassThrough(
             // buttonContainer:{class:'hidden'},
         },
         card:{
-            root:{class:'bg-white dark:bg-gray-600  shadow p-4 rounded-2xl m-2'},
+            root:{class:'bg-white dark:bg-gray-800  shadow p-4 rounded-2xl'},
             // title:{class:''},
             // header:{class:''}
         },       
         tabpanel:{
             headerTitle:{class:'m-0 p-0'},            
         },
+        accordiontab:{
+            content:{style:'padding: 0.7rem;'}
+            
+        },
         selectbutton:{
             root:{class:'flex flex-row gap-1 '},
             button: ({ context }) => ({
@@ -41,7 +45,7 @@ const CustomTailwind = usePassThrough(
         },
         button:{root:{class: 'focus:outline-none transition duration-150 ease-in-out rounded p-2 m-1 border dark:border-gray-600'}},
         dialog:{
-            root:{class:['border w-full max-h-full max-w-full md:h-3/4 lg:h-1/2']},
+            root:{class:[' w-full max-h-full max-w-full md:h-3/4 lg:h-1/2 p-2']},
             header:{class: 'p-dialog-header flex items-center  text-2xl justify-between shrink-0 bg-white text-gray-800 border-t-0  rounded-tl-lg rounded-tr-lg p-6 dark:bg-gray-900  dark:text-white/80'},
             content:{class:'p-dialog-content overflow-y-auto bg-white text-gray-700 px-6 pb-8 pt-0 dark:bg-gray-900  dark:text-white/80 rounded-bl-lg rounded-br-lg h-full'}
         },        
@@ -50,14 +54,22 @@ const CustomTailwind = usePassThrough(
             input:{class:'w-full p-inputtext p-component font-sans text-base text-gray-600 dark:text-white/80 bg-white dark:bg-gray-900 p-3 border border-gray-300 dark:border-blue-900/40 transition-colors duration-200 appearance-none hover:border-blue-500 rounded-lg'},
         },
         autocomplete:{
-            root:{class:'border border-gray-400 dark:!border-blue-900/40  rounded-lg flex flex-row'},
-            loadingIcon:{class:'hidden'},
+            // root:{class:'border border-gray-400 dark:!border-blue-900/40  rounded-lg flex flex-row'},
+            // loadingIcon:{class:'hidden'},
+            panel:{
+                class:'p-autocomplete-panel p-component p-2 w-full md:max-w-[500px] p-input-filled bg-white text-gray-700 border-0 rounded-md shadow-lg max-h-[200px] overflow-auto dark:bg-gray-900 dark:text-white/80'
+            },
             dropdownbutton: {
                 root:' btn-primary dark:shadow-primary-800 dark:border-primary-900 text-white rounded-lg flex flex-row  p-3 rounded-tl-none rounded-bl-none '
             }
         },
+        column:{
+            bodycell:{
+                style:'padding:5px;'
+            },
+        },
         sidebar:{
-            root:{class:'w-full md:w-1/2 xl:w-1/4   bg-white dark:bg-gray-800 border p-0 h-full'},
+            root:{class:'w-full md:w-2/3  bg-white dark:bg-slate-950  p-0 h-full'},
             header:{class:'dark:text-white text-2xl p-2'},
             content:{class:'p-0 pt-0 h-full w-full grow overflow-y-auto'}
         },        
@@ -70,10 +82,9 @@ const CustomTailwind = usePassThrough(
         breadcrumb:{
             root:{class:''}
         },
-        inputnumber:{
-            // root:{class:''},
-            input:{class:'bg-white dark:bg-white text-black dark-text-black'}
-        }
+        // inputnumber:{            
+            // input:{class:'text-right text-yellow-700'}
+        // }
     },
 );
 

package/templates/nuxt/components/button/ButtonDefault.vue._eta

@@ -1,6 +1,5 @@
 <template>
-    <!-- this component allow modify -->
-    <Button>
+    <Button class="dark:text-white">
         <slot></slot>
     </Button>
 </template>

package/templates/nuxt/components/button/ButtonMultiple.vue._eta

@@ -0,0 +1,21 @@
+<template>
+  <div v-for="o in options">
+    <ButtonPrimary v-if="value == o.value" @click="switchButton(o.value)">{{
+      o.label
+    }}</ButtonPrimary>
+    <ButtonDefault v-else @click="switchButton(o.value)">{{
+      o.label
+    }}</ButtonDefault>
+  </div>
+</template>
+<script setup lang="ts">
+type keyvalue = { label: string; value: string };
+const emits = defineEmits(["switch"]);
+const props = defineProps<{
+  options: keyvalue[];
+  value: string;
+}>();
+const switchButton = (v: string) => {
+  if (v != props.value) emits("switch", v);
+};
+</script>

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

@@ -1,8 +1,7 @@
 <template>
-    <div class="p-0 top-0  absolute left-1/2 text-right bg-yellow-200" v-if="isdebug=='1'">
-        <Button @click="visible=true"  class=" text-white bg-warning-800">
-            <i class="pi pi-code"></i>
-            {{ label }}</Button>      
+    <div :class="`p-0 absolute bg-yellow-200 bottom-0 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">
             
             <template #header >