@ramathibodi/nuxt-commons 0.0.1 → 0.0.3

package/dist/module.json

@@ -4,5 +4,5 @@
   "compatibility": {
     "nuxt": "^3.0.0"
   },
-  "version": "0.0.1"
+  "version": "0.0.3"
 }

package/dist/runtime/components/Alert.vue

@@ -1,5 +1,6 @@
 <script lang="ts" setup>
 import { ref, watch } from 'vue'
+import { isEmpty } from 'lodash-es'
 import { useAlert } from '../composables/alert'
 import type { AlertItem } from '../types/alert'
 
@@ -28,25 +29,25 @@ watch(() => alert?.hasAlert(), (hasAlert) => {
 
 <template>
   <VSnackbar
-    v-if="currentItem"
-    v-model="isAlertOpen"
-    :timeout="timeout"
-    location="center"
-    multi-line
-    variant="text"
-    @update:model-value="renewAlert()"
+      v-if="currentItem"
+      v-model="isAlertOpen"
+      :timeout="timeout"
+      location="center"
+      multi-line
+      variant="text"
+      @update:model-value="renewAlert()"
   >
     <!-- @vue-expected-error Type conversion problem -->
     <VAlert
-      v-model="isAlertOpen"
-      closable
-      :type="currentItem.alertType"
-      elevation="2"
-      theme="dark"
-      variant="flat"
-      @click:close="renewAlert()"
+        v-model="isAlertOpen"
+        closable
+        :type="currentItem.alertType"
+        elevation="2"
+        theme="dark"
+        variant="flat"
+        @click:close="renewAlert()"
     >
-      {{ currentItem.statusCode ? currentItem.statusCode + ' ' : '' }}{{ currentItem.message }}{{ currentItem.data ? ' ' + currentItem.data : '' }}
+      {{ currentItem.statusCode ? currentItem.statusCode + ' ' : '' }} {{ currentItem.message }} {{ !isEmpty(currentItem.data) ? currentItem.data : '' }}
     </VAlert>
   </VSnackbar>
 </template>

package/dist/runtime/components/Pdf/View.vue

@@ -1,6 +1,9 @@
 <script setup lang="ts">
-import PDF from 'pdf-vue3'
-import { uid } from 'uid'
+import PDF from 'pdf-vue3';
+import { uid } from 'uid';
+import { useAlert } from '../../composables/alert'
+import printJS from 'print-js'
+import {ref, computed} from 'vue'
 
 const props = defineProps<{
   base64String?: string
@@ -10,6 +13,8 @@ const props = defineProps<{
 }>()
 
 const emit = defineEmits(['closeDialog'])
+const base64 = ref(props.base64String)
+const alert = useAlert()
 
 const generateUniqueId = (): string => {
   const uniqueId: string = uid()
@@ -35,7 +40,32 @@ const downloadPdf = (): void => {
   anchorElement.click()
   URL.revokeObjectURL(link)
   document.body.removeChild(anchorElement)
+  base64.value = ""
 }
+
+const printPdf = () => {
+  printJS({
+    printable: props.base64String,
+    type: 'pdf',
+    base64: true,
+    onPrintDialogClose: endLoadPdf,
+    onError: (error: any) => {
+      alert?.addAlert({ message: error, alertType: 'error' })
+    },
+  })
+  base64.value = ""
+}
+
+const endLoadPdf = () => {
+  emit('closeDialog', false)
+  base64.value = ""
+}
+
+const isMobile = computed(() => {
+  if(/Android|Mobi|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini|Macintosh/i.test(navigator.userAgent)){
+    return true
+  }
+})
 </script>
 
 <template>
@@ -44,27 +74,31 @@ const downloadPdf = (): void => {
       <v-toolbar-title>{{ props.title }}</v-toolbar-title>
       <v-spacer />
       <v-btn
-        v-if="!props.disabled"
-        icon="mdi mdi-download"
-        variant="plain"
-        @click="downloadPdf"
+          v-if="!isMobile"
+          icon="mdi mdi-printer"
+          variant="plain"
+          @click="printPdf"
+      />
+      <v-btn
+          v-if="!props.disabled"
+          icon="mdi mdi-download"
+          variant="plain"
+          @click="downloadPdf"
       />
       <v-btn
-        icon="mdi mdi-close"
-        variant="plain"
-        @click="emit('closeDialog', false)"
+          icon="mdi mdi-close"
+          variant="plain"
+          @click="endLoadPdf"
       />
     </v-toolbar>
-    <v-card-text>
-      <v-row justify="center">
-        <PDF
-            :show-progress="true"
-            pdf-width="100%"
-            :src="props.base64String"
-            :show-page-tooltip="false"
-            :show-back-to-top-btn="false"
-        />
-      </v-row>
+    <v-card-text class="justify-center">
+      <PDF
+          :show-progress="true"
+          pdf-width="100%"
+          :src="base64"
+          :showPageTooltip="false"
+          :show-back-to-top-btn="false"
+      />
     </v-card-text>
   </v-card>
-</template>
+</template>

package/dist/runtime/components/dialog/Loading.vue

@@ -5,13 +5,19 @@ interface DialogProps {
   modelValue: boolean
   color?: string
 }
+const emit = defineEmits(['update:modelValue'])
 
 const props = defineProps<DialogProps>()
-const dialogVisible = ref<boolean>(false)
+const dialogVisible = ref<boolean>(props.modelValue)
 
 watch(() => props.modelValue, (newValue) => {
   dialogVisible.value = newValue
 })
+
+watch(() => dialogVisible.value, (newValue) => {
+  console.log("dialogVisible.value = ", newValue)
+  emit('update:modelValue', newValue)
+})
 </script>
 
 <template>
@@ -24,7 +30,7 @@ watch(() => props.modelValue, (newValue) => {
       <v-card-text>
         <v-row>
           <v-col class="text-center">
-            กรุณารอสักครู่
+            <slot>กรุณารอสักครู่</slot>
           </v-col>
         </v-row>
       </v-card-text>

package/dist/runtime/components/label/FormatMoney.vue

@@ -11,7 +11,7 @@ interface Props {
 const props = withDefaults(defineProps<Props>(), {
   modelValue: 0,
   decimal: 2,
-  currency: 'USD',
+  currency: '',
 })
 
 const formattedCurrency = computed(() => {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ramathibodi/nuxt-commons",
-  "version": "0.0.1",
+  "version": "0.0.3",
   "description": "Ramathibodi Nuxt modules for common components",
   "repository": {
     "type": "git",
@@ -64,7 +64,7 @@
     "uid": "^2.0.2",
     "vue": "^3.4.25",
     "vue-signature-pad": "^3.0.2",
-    "vuetify": "^3.5.17",
+    "vuetify": "^3.6.6",
     "xlsx": "https://cdn.sheetjs.com/xlsx-0.20.0/xlsx-0.20.0.tgz"
   },
   "devDependencies": {