gi-component 0.0.14 → 0.0.15

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "gi-component",
   "type": "module",
-  "version": "0.0.14",
+  "version": "0.0.15",
   "description": "Vue3中基于Element Plus二次封装基础组件库",
   "author": "lin",
   "license": "MIT",

package/packages/components/dialog/src/dialog.ts

@@ -116,7 +116,8 @@ export function createDialog() {
         ...options,
         content: () => h(DialogContent, { type: 'error', content: options.content as string }),
         simple: true,
-        style: { maxWidth: '420px', ...options.style }
+        style: { maxWidth: '420px', ...options.style },
+        lockScroll: false
       })
     }
   }

package/packages/components/form/src/form.vue

@@ -194,6 +194,36 @@ onMounted(() => {
   loadDictData()
 })
 
+/** 获取占位文本 */
+const getPlaceholder = (item: FormColumnItem) => {
+  if (!item.type) return undefined
+  if (['input', 'input-number', 'input-tag'].includes(item.type)) {
+    return `请输入${item.label}`
+  }
+  if (['textarea'].includes(item.type)) {
+    return `请填写${item.label}`
+  }
+  if (
+    [
+      'select',
+      'select-v2',
+      'tree-select',
+      'cascader',
+      'time-select',
+      'input-search'
+    ].includes(item.type)
+  ) {
+    return `请选择${item.label}`
+  }
+  if (['date-picker'].includes(item.type)) {
+    return `请选择日期`
+  }
+  if (['time-picker'].includes(item.type)) {
+    return `请选择时间`
+  }
+  return undefined
+}
+
 // 组件的默认props配置
 function getComponentBindProps(item: FormColumnItem) {
   // 获取默认配置
@@ -263,36 +293,6 @@ const CompMap: Record<Exclude<FormColumnType, 'slot'>, any> = {
 
 const formRef = ref<FormInstance>()
 
-/** 获取占位文本 */
-const getPlaceholder = (item: FormColumnItem) => {
-  if (!item.type) return undefined
-  if (['input', 'input-number', 'input-tag'].includes(item.type)) {
-    return `请输入${item.label}`
-  }
-  if (['textarea'].includes(item.type)) {
-    return `请填写${item.label}`
-  }
-  if (
-    [
-      'select',
-      'select-v2',
-      'tree-select',
-      'cascader',
-      'time-select',
-      'input-search'
-    ].includes(item.type)
-  ) {
-    return `请选择${item.label}`
-  }
-  if (['date-picker'].includes(item.type)) {
-    return `请选择日期`
-  }
-  if (['time-picker'].includes(item.type)) {
-    return `请选择时间`
-  }
-  return undefined
-}
-
 /** 表单项校验规则 */
 function getFormItemRules(item: FormColumnItem) {
   if (item.required) {
@@ -332,9 +332,10 @@ function isDisabled(item: FormColumnItem) {
 
 /** 表单数据更新  */
 function updateModelValue(value: any, item: FormColumnItem) {
+  const val = item?.format ? item.format(value) : value
   emit(
     'update:modelValue',
-    Object.assign(props.modelValue, { [item.field]: value })
+    Object.assign(props.modelValue, { [item.field]: val })
   )
 }
 

package/packages/components/form/src/type.ts

@@ -7,30 +7,30 @@ import type { InputSearchInstance } from '../../input-search'
 
 export type FormColumnType
   = | 'input'
-    | 'textarea'
-    | 'input-number'
-    | 'input-tag'
-    | 'input-search'
-    | 'select'
-    | 'select-v2'
-    | 'tree-select'
-    | 'cascader'
-    | 'slider'
-    | 'switch'
-    | 'rate'
-    | 'checkbox-group'
-    | 'checkbox'
-    | 'radio-group'
-    | 'radio'
-    | 'date-picker'
-    | 'time-picker'
-    | 'time-select'
-    | 'color-picker'
-    | 'transfer'
-    | 'autocomplete'
-    | 'upload'
-    | 'title'
-    | 'slot'
+  | 'textarea'
+  | 'input-number'
+  | 'input-tag'
+  | 'input-search'
+  | 'select'
+  | 'select-v2'
+  | 'tree-select'
+  | 'cascader'
+  | 'slider'
+  | 'switch'
+  | 'rate'
+  | 'checkbox-group'
+  | 'checkbox'
+  | 'radio-group'
+  | 'radio'
+  | 'date-picker'
+  | 'time-picker'
+  | 'time-select'
+  | 'color-picker'
+  | 'transfer'
+  | 'autocomplete'
+  | 'upload'
+  | 'title'
+  | 'slot'
 
 /**
  * 表单列属性类型，根据组件类型使用对应的属性类型
@@ -69,6 +69,7 @@ export interface FormColumnItem<F = any> {
   slotName?: string
   slots?: FormColumnSlots
   extra?: string | (() => VNode) // 右侧额外内容
+  format?: (value: string) => string | number
 }
 
 export interface FormProps extends Partial<ElFormProps> {