@mythpe/quasar-ui-qui 0.1.33 → 0.1.35

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@mythpe/quasar-ui-qui",
-  "version": "0.1.33",
+  "version": "0.1.35",
   "description": "MyTh Quasar UI Kit App Extension",
   "author": {
     "name": "MyTh Ahmed Faiz",

package/src/components/form/MDate.vue

@@ -14,10 +14,11 @@ import type { MDateProps as Props, MInputSlots } from '../../types'
 import { useTemplateRef } from 'vue'
 import MPicker from './MPicker.vue'
 
-type P = {
+interface P {
   name: Props['name'];
   rules?: Props['rules'];
 }
+
 withDefaults(defineProps<P>(), {
   name: () => '',
   rules: undefined

package/src/components/form/MPicker.vue

@@ -16,6 +16,7 @@ import { useBindInput, useMyth } from '../../composable'
 import { useField } from 'vee-validate'
 import type { QFieldSlots } from 'quasar'
 import { QDate, QField, QTime } from 'quasar'
+import { useI18n } from 'vue-i18n'
 
 const defSeparator = ' - '
 
@@ -47,6 +48,8 @@ interface P {
   readonly?: Props['readonly'];
   disable?: Props['disable'];
   fieldOptions?: Props['fieldOptions'];
+  locale?: Props['locale'];
+  noDefaultLocale?: boolean;
 }
 
 const props = withDefaults(defineProps<P>(), {
@@ -76,7 +79,9 @@ const props = withDefaults(defineProps<P>(), {
   btnProps: undefined,
   readonly: undefined,
   disable: undefined,
-  fieldOptions: undefined
+  fieldOptions: undefined,
+  locale: undefined,
+  noDefaultLocale: !1
 })
 
 defineModel<Props['modelValue']>({ required: !1, default: undefined })
@@ -101,6 +106,35 @@ const isDate = computed(() => props.type !== 'time')
 // })
 const format = computed(() => isDate.value ? 'YYYY/MM/DD' : 'HH:mm')
 const dateRef = ref<string | null>(null)
+
+const { t, te } = useI18n({ useScope: 'global' })
+const daysShort = computed(() => {
+  if (!te('const.days.0')) {
+    return undefined
+  }
+  const l: string[] = []
+  for (let i = 0; i < 7; i++) {
+    l.push(t(`const.days.${i}`) as string)
+  }
+  return l
+})
+const monthsShort = computed(() => {
+  if (!te('const.months.1')) {
+    return undefined
+  }
+  const l: string[] = []
+  for (let i = 1; i <= 12; i++) {
+    l.push(t(`const.months.${i}`) as string)
+  }
+  return l
+})
+const localeComputed = computed(() => {
+  if (props.noDefaultLocale) {
+    return props.locale
+  }
+  return { ...props.locale, daysShort: daysShort.value, monthsShort: monthsShort.value }
+})
+
 const onBeforeShow = () => {
   dateRef.value = value.value || null
 }
@@ -236,7 +270,8 @@ defineOptions({
                   mask: format,
                   multiple,
                   range,
-                  modelValue: dateRef ?? null
+                  modelValue: dateRef ?? null,
+                  locale: localeComputed
                 }"
                 @update:model-value="dateRef = $event ?? null"
               >
@@ -265,7 +300,8 @@ defineOptions({
                   ...$attrs,
                   mask: format,
                   nowBtn: getProp('nowBtn') === undefined? !0 : getProp('nowBtn'),
-                  modelValue: dateRef ?? null
+                  modelValue: dateRef ?? null,
+                  locale: localeComputed
                 }"
                 @update:model-value="dateRef = $event ?? null"
               >

package/src/types/components.d.ts

@@ -399,7 +399,7 @@ export type MRadioProps = Omit<QRadioProps, 'name' | 'modelValue' | 'label'> & B
 
 export type MRadioSlots = MCheckboxSlots
 
-export type MPickerProps = BaseInputsProps & Omit<QDateProps, 'modelValue' | 'options'> & Omit<QTimeProps, 'modelValue'> & {
+export interface MPickerProps extends BaseInputsProps, Omit<QDateProps, 'modelValue' | 'options'>, Omit<QTimeProps, 'modelValue'> {
   /**
    * Initial value of the picker.
    * Default is: null.
@@ -419,11 +419,18 @@ export type MPickerProps = BaseInputsProps & Omit<QDateProps, 'modelValue' | 'op
    * Default is: ' - '.
    */
   rangeSeparator?: string;
+  /**
+   * User long days & months names.
+   * Only work for 'date' type.
+   */
+  noDefaultLocale?: boolean;
 }
 
 export type MPickerSlots = MInputSlots
 
-export type MDateProps = Omit<MPickerProps, 'type'>
+export interface MDateProps extends Omit<MPickerProps, 'type'> {
+  type?: 'date'
+}
 
 export type MDateSlots = MPickerSlots
 

package/src/utils/vee-rules.ts

@@ -14,7 +14,7 @@ const { testPattern } = patterns
 export const veeRules = {
   float: (v: any) => lodash.isNumber(parseInt(v)) && !isNaN(parseInt(v)) && v?.toString()
     .split('.')?.length <= 2 && (/(\d)+/g.test(v) && !/[a-zA-Z]/.test(
-    v)),
+    v)) && v !== undefined && v !== null,
   date: (v: any) => /^-?[\d]+-[0-1]\d-[0-3]\d$/.test(v),
   time: (v: any) => testPattern.time(v),
   fulltime: (v: any) => testPattern.fulltime(v),