rayyy-vue-table-components 1.0.29 → 1.0.31

package/dist/src/types/components.d.ts

@@ -0,0 +1,210 @@
+import { App, DefineComponent, VNode } from 'vue';
+import { TableColumnCtx } from 'element-plus';
+import { SortChangValue, TableColumn } from './index';
+// ==================== BaseTable 組件類型 ====================
+
+/** BaseTable 組件 Props 類型 */
+export interface BaseTableProps<T extends Record<string, unknown> = Record<string, unknown>> {
+  /** 是否顯示加載狀態 */
+  loading?: boolean
+  /** 表格數據 */
+  data: T[]
+  /** 表格列配置 */
+  columns: TableColumn<T>[]
+  /** 是否顯示選擇列 */
+  showSelection?: boolean
+  /** 是否顯示匯總行 */
+  showSummary?: boolean
+  /** 是否顯示溢出提示 */
+  showOverFlowTooltip?: boolean
+  /** 匯總方法 */
+  summaryMethod?: (param: {
+    columns: TableColumnCtx<Record<string, unknown>>[];
+    data: T[]
+  }) => (string | VNode)[]
+  /** 行樣式類名 */
+  baseTableRowClassName?: (data: { row: T; rowIndex: number }) => string
+}
+
+/** BaseTable 組件 Emits 類型 */
+export interface BaseTableEmits<T extends Record<string, unknown> = Record<string, unknown>> {
+  /** 選擇變更事件 */
+  'selection-change': (selection: T[]) => void
+  /** 當前行變更事件 */
+  'current-change': (currentRow: T) => void
+  /** 單元格點擊事件 */
+  'cell-click': (column: TableColumn<T>, row: T) => void
+  /** 列排序變更事件 */
+  'column-sort-change': (value: SortChangValue<T>) => void
+}
+
+/** BaseTable 組件實例類型 */
+export interface BaseTableInstance<T extends Record<string, unknown> = Record<string, unknown>> {
+  /** 組件 Props */
+  $props: BaseTableProps<T>
+  /** 組件 Emits */
+  $emit: BaseTableEmits<T>
+}
+
+// ==================== BaseBtn 組件類型 ====================
+
+/** BaseBtn 組件 Props 類型 */
+export interface BaseBtnProps {
+  /** 按鈕文字 */
+  text?: string
+  /** 按鈕類型 */
+  type?: 'default' | 'primary' | 'success' | 'warning' | 'info' | 'danger'
+  /** 按鈕尺寸 */
+  size?: 'default' | 'small' | 'large'
+  /** 是否為樸素按鈕 */
+  plain?: boolean
+  /** 自定義 CSS 類名 */
+  class?: string
+  /** 是否禁用 */
+  disabled?: boolean
+  /** 是否為文字按鈕 */
+  textBtn?: boolean
+  /** 圖標 */
+  icon?: object
+  /** 是否為鏈接按鈕 */
+  link?: boolean
+  /** 是否填充樣式 */
+  isFill?: boolean
+  /** 是否顯示加載狀態 */
+  loading?: boolean
+  /** 測試屬性 */
+  dataCy?: string
+}
+
+/** BaseBtn 組件 Emits 類型 */
+export interface BaseBtnEmits {
+  /** 點擊事件 */
+  (e: 'click', evt: MouseEvent): void
+}
+
+/** BaseBtn 組件實例類型 */
+export interface BaseBtnInstance {
+  /** 組件 Props */
+  $props: BaseBtnProps
+  /** 組件 Emits */
+  $emit: BaseBtnEmits
+}
+
+// ==================== BaseDialog 組件類型 ====================
+
+/** BaseDialog 組件 Props 類型 */
+export interface BaseDialogProps {
+  /** 是否顯示對話框 */
+  modelValue: boolean
+  /** 對話框標題 */
+  title?: string
+  /** 副標題 */
+  subTitle?: string
+  /** 關閉前回調 */
+  beforeClose?: () => void
+  /** 自定義寬度 */
+  customWidth?: string
+  /** 是否為警告對話框 */
+  isWaring?: boolean
+  /** 是否為主要對話框 */
+  isPrimary?: boolean
+  /** 內容區域加載狀態 */
+  bodyLoading?: boolean
+  /** 提交按鈕加載狀態 */
+  submitLoading?: boolean
+}
+
+/** BaseDialog 組件 Emits 類型 */
+export interface BaseDialogEmits {
+  /** 更新 modelValue */
+  (e: 'update:modelValue', data: boolean): void
+  /** 提交按鈕點擊事件 */
+  (e: 'click:submit'): void
+}
+
+/** BaseDialog 組件實例類型 */
+export interface BaseDialogInstance {
+  /** 組件 Props */
+  $props: BaseDialogProps
+  /** 組件 Emits */
+  $emit: BaseDialogEmits
+}
+
+// ==================== 組件定義類型 ====================
+
+/** BaseTable 組件定義 */
+export declare const BaseTable: DefineComponent<
+  BaseTableProps<any>,
+  {},
+  {},
+  {},
+  {},
+  {},
+  {},
+  BaseTableEmits<any>
+> & {
+  /** 安裝方法 */
+  install: (app: App) => void
+}
+
+/** BaseBtn 組件定義 */
+export declare const BaseBtn: DefineComponent<
+  BaseBtnProps,
+  {},
+  {},
+  {},
+  {},
+  {},
+  {},
+  BaseBtnEmits
+> & {
+  /** 安裝方法 */
+  install: (app: App) => void
+}
+
+/** BaseDialog 組件定義 */
+export declare const BaseDialog: DefineComponent<
+  BaseDialogProps,
+  {},
+  {},
+  {},
+  {},
+  {},
+  {},
+  BaseDialogEmits
+> & {
+  /** 安裝方法 */
+  install: (app: App) => void
+}
+
+// ==================== 插件類型 ====================
+
+/** 插件安裝選項 */
+export interface PluginOptions {
+  /** 是否自動導入樣式 */
+  autoImportStyles?: boolean
+  /** 自定義前綴 */
+  prefix?: string
+}
+
+/** 插件實例類型 */
+export interface VueTableComponentsPlugin {
+  /** 安裝方法 */
+  install: (app: App, options?: PluginOptions) => void
+  /** BaseTable 組件 */
+  BaseTable: typeof BaseTable
+  /** BaseBtn 組件 */
+  BaseBtn: typeof BaseBtn
+  /** BaseDialog 組件 */
+  BaseDialog: typeof BaseDialog
+}
+
+// ==================== 全局類型擴展 ====================
+
+declare module '@vue/runtime-core' {
+  export interface GlobalComponents {
+    BaseTable: typeof BaseTable
+    BaseBtn: typeof BaseBtn
+    BaseDialog: typeof BaseDialog
+  }
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rayyy-vue-table-components",
-  "version": "1.0.29",
+  "version": "1.0.31",
   "description": "Vue 3 + Element Plus 表格組件庫",
   "type": "module",
   "main": "./dist/index.umd.js",
@@ -24,10 +24,6 @@
     "./types/components": {
       "types": "./src/types/components.d.ts",
       "import": "./src/types/components.d.ts"
-    },
-    "./utils": {
-      "types": "./src/utils/tableHelper.ts",
-      "import": "./src/utils/tableHelper.ts"
     }
   },
   "files": [
@@ -36,7 +32,6 @@
     "src/components/index.ts",
     "src/types/*",
     "src/types/components.d.ts",
-    "src/utils/*",
     "README.md"
   ],
   "keywords": [
@@ -80,11 +75,6 @@
     "element-plus": "^2.0.0",
     "vue": "^3.0.0"
   },
-  "peerDependenciesMeta": {
-    "vue": {
-      "optional": false
-    }
-  },
   "devDependencies": {
     "@tsconfig/node22": "^22.0.0",
     "@types/jsdom": "^21.1.7",
@@ -109,7 +99,6 @@
     "postcss": "^8.5.3",
     "postcss-import": "^16.1.0",
     "prettier": "3.5.3",
-    "rollup-plugin-external-globals": "^0.13.0",
     "sass-embedded": "^1.86.0",
     "start-server-and-test": "^2.0.10",
     "tailwindcss": "^3.4.17",
@@ -125,6 +114,6 @@
     "vue-tsc": "^2.2.8"
   },
   "dependencies": {
-    "vuedraggable": "^4.1.0"
+    "vuedraggable": "^2.24.3"
   }
 }

package/src/components/index.ts

@@ -4,8 +4,6 @@ export { default as BaseBtn } from './items/BaseBtn.vue'
 export { default as BaseDialog } from './BaseDialog.vue'
 export { default as SortTable } from './tables/SortTable.vue'
 export { default as SearchBar } from './SearchBar.vue'
-export { default as TransferDialog } from './transfer/TransferDialog.vue'
-export { default as TransferItem } from './transfer/transferItem.vue'
 
 // 導出組件類型
 export type {
@@ -28,5 +26,3 @@ export type { default as BaseBtnType } from './items/BaseBtn.vue'
 export type { default as BaseDialogType } from './BaseDialog.vue'
 export type { default as SortTableType } from './tables/SortTable.vue'
 export type { default as SearchBarType } from './SearchBar.vue'
-export type { default as TransferDialogType } from './transfer/TransferDialog.vue'
-export type { default as TransferItemType } from './transfer/transferItem.vue'

package/src/components/items/FilterBtn.vue

@@ -47,7 +47,7 @@ const submitFilter = () => {
     </template>
 
     <div class="flex justify-between items-center pb-5 font-semibold">
-      <div class="text-base text-black">篩選條件</div>
+      <div class="text-base">篩選條件</div>
       <div class="text-base text-primary cursor-pointer" @click="resetValue">重置</div>
     </div>
 
@@ -66,7 +66,7 @@ const submitFilter = () => {
 .filter-btn {
   @apply text-sky-800;
   p {
-    @apply ml-2 font-bold;
+    @apply text-black ml-2 font-bold;
   }
   i {
     @apply text-xl;

package/src/components/transfer/TransferDialog.vue

@@ -5,8 +5,8 @@ import draggable from 'vuedraggable'
 import _ from 'lodash'
 import type { CheckboxValueType } from 'element-plus'
 import BaseDialog from '@/components/BaseDialog.vue'
-import SearchBar from '@/components/SearchBar.vue'
 import TransferItem from '@/components/transfer/transferItem.vue'
+import SearchBar from '@/components/SearchBar.vue'
 
 const props = defineProps<{
   modelValue: boolean
@@ -110,7 +110,7 @@ const resetFilterColumn = () => {
 const doFilterColumn = (keyword: string) => {
   if (keyword.length > 0) {
     const cloneList = _.cloneDeep(state.localColumns)
-    state.localColumns = cloneList.filter((item: any) => item.label.includes(keyword))
+    state.localColumns = cloneList.filter((item) => item.label.includes(keyword))
   } else {
     resetFilterColumn()
   }