hrms-publish/src/stores/mixin.ts

import { defineStore } from 'pinia'
import CustomComponent from '@/components/CustomDialog.vue'
import { Loading, QSpinnerCube } from 'quasar'

export const useCounterMixin = defineStore('mixin', () => {
  function date2Thai(srcDate: Date, isFullMonth = false, isTime = false) {
    if (srcDate == null) {
      return null
      ;`
        `
    }
    const date = new Date(srcDate)
    const isValidDate = Boolean(+date)
    if (!isValidDate) return srcDate.toString()
    if (isValidDate && date.getFullYear() < 1000) return srcDate.toString()
    const fullMonthThai = [
      'มกราคม',
      'กุมภาพันธ์',
      'มีนาคม',
      'เมษายน',
      'พฤษภาคม',
      'มิถุนายน',
      'กรกฎาคม',
      'สิงหาคม',
      'กันยายน',
      'ตุลาคม',
      'พฤศจิกายน',
      'ธันวาคม',
    ]
    const abbrMonthThai = [
      'ม.ค.',
      'ก.พ.',
      'มี.ค.',
      'เม.ย.',
      'พ.ค.',
      'มิ.ย.',
      'ก.ค.',
      'ส.ค.',
      'ก.ย.',
      'ต.ค.',
      'พ.ย.',
      'ธ.ค.',
    ]
    let dstYear = 0
    if (date.getFullYear() > 2500) {
      dstYear = date.getFullYear()
    } else {
      dstYear = date.getFullYear() + 543
    }
    let dstMonth = ''
    if (isFullMonth) {
      dstMonth = fullMonthThai[date.getMonth()]
    } else {
      dstMonth = abbrMonthThai[date.getMonth()]
    }
    let dstTime = ''
    if (isTime) {
      const H = date.getHours().toString().padStart(2, '0')
      const M = date.getMinutes().toString().padStart(2, '0')
      // const S = date.getSeconds().toString().padStart(2, "0")
      // dstTime = " " + H + ":" + M + ":" + S + " น."
      dstTime = ' ' + H + ':' + M + ' น.'
    }
    return (
      date.getDate().toString().padStart(2, '0') +
      ' ' +
      dstMonth +
      ' ' +
      dstYear +
      dstTime
    )
  }

  const showLoader = () => {
    Loading.show({
      spinner: QSpinnerCube,
      spinnerSize: 140,
      spinnerColor: 'primary',
      backgroundColor: 'white',
    })
  }

  const hideLoader = () => {
    Loading.hide()
  }

  function covertDateObject(date: string) {
    if (date) {
      const dateParts = date.split('/')
      // ประกาศตัวแปรเพื่อเก็บค่าวันที่, เดือน, และ ปี
      const day = parseInt(dateParts[0], 10)
      const month = parseInt(dateParts[1], 10) - 1
      const year = parseInt(dateParts[2], 10) + 2500
      // สร้างอ็อบเจ็กต์ Date ด้วยค่าที่ได้
      const dateObject = new Date(year, month, day)
      return date2Thai(dateObject)
    }
  }

  type OkCallback = () => void
  type CancelCallback = () => void
  function dialogConfirm(
    q: any,
    ok?: OkCallback,
    title?: string, // ถ้ามี cancel action ใส่เป็น null
    desc?: string, // ถ้ามี cancel action ใส่เป็น null
    cancel?: CancelCallback
  ) {
    q.dialog({
      component: CustomComponent,
      componentProps: {
        title: title && title != null ? title : 'ยืนยันการบันทึก',
        message:
          desc && desc != null
            ? desc
            : 'ต้องการยืนยันการบันทึกข้อมูลนี้ใช่หรือไม่?',
        icon: 'info',
        color: 'public',
        textOk: 'ตกลง',
        onlycancel: false,
      },
    })
      .onOk(() => {
        if (ok) ok()
      })
      .onCancel(() => {
        if (cancel) cancel()
      })
  }

  const messageError = (q: any, e: any = '') => {
    // q.dialog.hide();
    if (e.response !== undefined) {
      if (e.response.data.status !== undefined) {
        if (e.response.data.status == 401) {
          //invalid_token
          q.dialog({
            component: CustomComponent,
            componentProps: {
              title: `พบข้อผิดพลาด`,
              message: `ล็อกอินหมดอายุ กรุณาล็อกอินใหม่อีกครั้ง`,
              icon: 'warning',
              color: 'red',
              onlycancel: true,
            },
          })
        } else {
          const message = e.response.data.result ?? e.response.data.message
          q.dialog({
            component: CustomComponent,
            componentProps: {
              title: `พบข้อผิดพลาด`,
              message: `${message}`,
              icon: 'warning',
              color: 'red',
              onlycancel: true,
            },
          })
        }
      } else {
        if (e.response.status == 401) {
          //invalid_token
          q.dialog({
            component: CustomComponent,
            componentProps: {
              title: `พบข้อผิดพลาด`,
              message: `ล็อกอินหมดอายุ กรุณาล็อกอินใหม่อีกครั้ง`,
              icon: 'warning',
              color: 'red',
              onlycancel: true,
            },
          })
        } else if (e.response.data.successful === false) {
          q.dialog({
            component: CustomComponent,
            componentProps: {
              title: `พบข้อผิดพลาด`,
              message: e.response.data.message,
              icon: 'warning',
              color: 'red',
              onlycancel: true,
            },
          })
        } else {
          q.dialog({
            component: CustomComponent,
            componentProps: {
              title: `พบข้อผิดพลาด`,
              message: `ข้อมูลผิดพลาดทำให้เกิดการไม่ตอบสนองต่อการเรียกใช้งานดูเว็บไซต์`,
              icon: 'warning',
              color: 'red',
              onlycancel: true,
            },
          })
        }
      }
    } else {
      q.dialog({
        component: CustomComponent,
        componentProps: {
          title: `พบข้อผิดพลาด`,
          message: `ข้อมูลผิดพลาดทำให้เกิดการไม่ตอบสนองต่อการเรียกใช้งานดูเว็บไซต์`,
          icon: 'warning',
          color: 'red',
          onlycancel: true,
        },
      })
    }
  }

  const success = (q: any, val: string) => {
    // useQuasar ไม่สามารถใช้นอกไฟล์ .vue
    if (val !== '') {
      return q.notify({
        message: val,
        color: 'primary',
        icon: 'mdi-information',
        position: 'bottom-right',
        multiLine: true,
        timeout: 1000,
        badgeColor: 'positive',
        classes: 'my-notif-class',
      })
    }
  }

  function notify(q: any, val: string) {
    if (val !== '') {
      q.notify({
        color: 'teal-10',
        message: val,
        icon: 'mdi-information',
        position: 'bottom-right',
        multiLine: true,
        timeout: 7000,
        actions: [{ label: 'ปิด', color: 'white', handler: () => {} }],
      })
    }
  }

  function dialogRemove(
    q: any,
    ok?: () => void,
    title?: string, // ถ้ามี cancel action ใส่เป็น null
    desc?: string, // ถ้ามี cancel action ใส่เป็น null
    cancel?: () => void
  ) {
    q.dialog({
      component: CustomComponent,
      componentProps: {
        title: title && title != null ? title : 'ยืนยันการลบข้อมูล',
        message:
          desc && desc != null
            ? desc
            : 'ต้องการยืนยันการลบข้อมูลนี้ใช่หรือไม่?',
        icon: 'delete',
        color: 'red',
        textOk: 'ตกลง',
        onlycancel: false,
      },
    })
      .onOk(() => {
        if (ok) ok()
      })
      .onCancel(() => {
        if (cancel) cancel()
      })
  }

  function monthYear2Thai(month: number, year: number, isFullMonth = false) {
    const date = new Date(`${year}-${month + 1}-1`)
    const fullMonthThai = [
      'มกราคม',
      'กุมภาพันธ์',
      'มีนาคม',
      'เมษายน',
      'พฤษภาคม',
      'มิถุนายน',
      'กรกฎาคม',
      'สิงหาคม',
      'กันยายน',
      'ตุลาคม',
      'พฤศจิกายน',
      'ธันวาคม',
    ]
    const abbrMonthThai = [
      'ม.ค.',
      'ก.พ.',
      'มี.ค.',
      'เม.ย.',
      'พ.ค.',
      'มิ.ย.',
      'ก.ค.',
      'ส.ค.',
      'ก.ย.',
      'ต.ค.',
      'พ.ย.',
      'ธ.ค.',
    ]
    let dstYear = 0
    if (date.getFullYear() > 2500) {
      dstYear = date.getFullYear()
    } else {
      dstYear = date.getFullYear() + 543
    }
    let dstMonth = ''
    if (isFullMonth) {
      dstMonth = fullMonthThai[date.getMonth()]
    } else {
      dstMonth = abbrMonthThai[date.getMonth()]
    }
    return dstMonth + ' ' + dstYear
  }

  return {
    date2Thai,
    monthYear2Thai,
    showLoader,
    hideLoader,
    covertDateObject,
    dialogConfirm,
    messageError,
    success,
    notify,
    dialogRemove,
  }
})