gi-component 0.0.26 → 0.0.28

package/package.json

@@ -1,60 +1,60 @@
-{
-  "name": "gi-component",
-  "type": "module",
-  "version": "0.0.26",
-  "description": "Vue3中基于Element Plus二次封装基础组件库",
-  "author": "lin",
-  "license": "MIT",
-  "repository": {
-    "type": "git",
-    "url": "https://github.com/lin-97/gi-component.git"
-  },
-  "keywords": [
-    "element-plus",
-    "vitepress",
-    "vue3",
-    "gi-component",
-    "二次封装组件",
-    "封装组件"
-  ],
-  "main": "dist/index.umd.js",
-  "module": "dist/index.es.js",
-  "types": "dist/index.d.ts",
-  "files": [
-    "dist",
-    "packages"
-  ],
-  "scripts": {
-    "dev": "vite --host",
-    "docs:dev": "cd docs && pnpm dev",
-    "docs:build": "cd docs && pnpm build",
-    "docs:preview": "cd docs && pnpm preview",
-    "build:lib": "vite build",
-    "build:docs": "cd docs && pnpm build",
-    "lint": "eslint .",
-    "lint:fix": "eslint . --fix"
-  },
-  "peerDependencies": {
-    "element-plus": "^2.11.0",
-    "vue": "^3.4.0"
-  },
-  "devDependencies": {
-    "@antfu/eslint-config": "^5.2.1",
-    "@element-plus/icons-vue": "^2.3.1",
-    "@types/node": "^24.2.0",
-    "@vitejs/plugin-vue": "^5.2.4",
-    "@vitejs/plugin-vue-jsx": "^4.2.0",
-    "element-plus": "^2.11.2",
-    "eslint": "^9.27.0",
-    "sass": "^1.89.0",
-    "sass-loader": "^16.0.5",
-    "terser": "^5.44.0",
-    "typescript": "^5.8.3",
-    "unplugin-vue-components": "^28.8.0",
-    "vite": "6.3.5",
-    "vite-plugin-dts": "^4.5.4",
-    "vue": "^3.5.15",
-    "vue-tsc": "^2.2.10",
-    "xe-utils": "^3.7.9"
-  }
-}
+{
+  "name": "gi-component",
+  "type": "module",
+  "version": "0.0.28",
+  "description": "Vue3中基于Element Plus二次封装基础组件库",
+  "author": "lin",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/lin-97/gi-component.git"
+  },
+  "keywords": [
+    "element-plus",
+    "vitepress",
+    "vue3",
+    "gi-component",
+    "二次封装组件",
+    "封装组件"
+  ],
+  "main": "dist/index.umd.js",
+  "module": "dist/index.es.js",
+  "types": "dist/index.d.ts",
+  "files": [
+    "dist",
+    "packages"
+  ],
+  "scripts": {
+    "dev": "vite --host",
+    "docs:dev": "cd docs && pnpm dev",
+    "docs:build": "cd docs && pnpm build",
+    "docs:preview": "cd docs && pnpm preview",
+    "build:lib": "vite build",
+    "build:docs": "cd docs && pnpm build",
+    "lint": "eslint .",
+    "lint:fix": "eslint . --fix"
+  },
+  "peerDependencies": {
+    "element-plus": "^2.11.0",
+    "vue": "^3.4.0"
+  },
+  "devDependencies": {
+    "@antfu/eslint-config": "^7.2.0",
+    "@element-plus/icons-vue": "^2.3.1",
+    "@types/node": "^24.2.0",
+    "@vitejs/plugin-vue": "^5.2.4",
+    "@vitejs/plugin-vue-jsx": "^4.2.0",
+    "element-plus": "^2.11.2",
+    "eslint": "^9.39.2",
+    "sass": "^1.89.0",
+    "sass-loader": "^16.0.5",
+    "terser": "^5.44.0",
+    "typescript": "^5.8.3",
+    "unplugin-vue-components": "^28.8.0",
+    "vite": "6.3.5",
+    "vite-plugin-dts": "^4.5.4",
+    "vue": "^3.5.15",
+    "vue-tsc": "^2.2.10",
+    "xe-utils": "^3.7.9"
+  }
+}

package/packages/components/edit-table/src/edit-table.vue

@@ -10,10 +10,11 @@
             <template v-if="column.slotName">
               <slot :name="column.slotName" v-bind="scope"></slot>
             </template>
-            <template v-else-if="!column.type">{{ scope.row[column.prop] }}</template>
+            <template v-else-if="!column.type">
+              {{ scope.row[column.prop] }}
+            </template>
             <component :is="COMP_MAP[column.type] || column.type" v-else v-bind="getComponentBindProps(column)"
-              v-model="scope.row[column.prop]" class="w-full" :disabled="isDisabled(scope)">
-            </component>
+              v-model="scope.row[column.prop]" class="w-full" :disabled="isDisabled(scope)" />
           </ElFormItem>
         </template>
       </ElTableColumn>
@@ -109,36 +110,38 @@ const STATIC_PROPS = new Map([
   ['title', {}]
 ])
 
+/** 占位符文本映射 */
+const PLACEHOLDER_MAP = new Map<EditTableColumnItemType, (label?: string) => string | undefined>([
+  ['input', (label) => `请输入${label}`],
+  ['input-number', (label) => `请输入${label}`],
+  ['input-tag', (label) => `请输入${label}`],
+  ['textarea', (label) => `请填写${label}`],
+  ['select', (label) => `请选择${label}`],
+  ['select-v2', (label) => `请选择${label}`],
+  ['tree-select', (label) => `请选择${label}`],
+  ['cascader', (label) => `请选择${label}`],
+  ['time-select', (label) => `请选择${label}`],
+  ['input-search', (label) => `请选择${label}`],
+  ['date-picker', () => '请选择日期'],
+  ['time-picker', () => '请选择时间']
+])
+
 /** 获取占位文本 */
-const getPlaceholder = (item: EditTableColumnItem) => {
+const getPlaceholder = (item: EditTableColumnItem): string | undefined => {
   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
+  const placeholderFn = PLACEHOLDER_MAP.get(item.type)
+  return placeholderFn ? placeholderFn(item.label) : undefined
 }
 
-// 组件的默认props配置
+/** 组件的默认props配置 */
 function getComponentBindProps(item: EditTableColumnItem) {
   // 获取默认配置
-  const defaultProps: any = STATIC_PROPS.get(item.type || '') || {}
-  defaultProps.placeholder = getPlaceholder(item)
+  const defaultProps: Record<string, any> = { ...(STATIC_PROPS.get(item.type || '') || {}) }
+  const placeholder = getPlaceholder(item)
+  if (placeholder) {
+    defaultProps.placeholder = placeholder
+  }
+  // 日期选择器格式化
   if (item.type === 'date-picker') {
     defaultProps.valueFormat = item?.componentProps?.type === 'datetime' ? 'YYYY-MM-DD HH:mm:ss' : 'YYYY-MM-DD'
   }
@@ -148,10 +151,11 @@ function getComponentBindProps(item: EditTableColumnItem) {
 
 /** 表单项校验规则 */
 function getFormItemRules(item: EditTableColumnItem) {
+  const rules = Array.isArray(item.rules) ? item.rules : []
   if (item.required) {
     return [
       { required: true, message: `${item.label}为必填项` },
-      ...(Array.isArray(item.rules) ? item.rules : [])
+      ...rules
     ]
   }
   return item.rules
@@ -164,8 +168,10 @@ function getLabelClassName(item: EditTableColumnItem) {
 }
 
 /** 判断是否禁用 */
-const isDisabled = (p: any) => {
-  if (typeof props?.cellDisabled === 'function') return props.cellDisabled(p)
+const isDisabled = (scope: any): boolean => {
+  if (typeof props?.cellDisabled === 'function') {
+    return props.cellDisabled(scope)
+  }
   return false
 }