rayyy-vue-table-components 1.3.17 → 1.3.19

package/dist/src/{views/demo/BaseMultipleInputDemo.vue.d.ts → components/LanguageSwitcher.vue.d.ts}

@@ -1,2 +1,2 @@
-declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, any>;
+declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, HTMLDivElement>;
 export default _default;

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

@@ -3,7 +3,6 @@ export { default as BaseBtn } from './items/BaseBtn.vue';
 export { default as BaseInput } from './form/BaseInput.vue';
 export { default as BaseDialog } from './items/BaseDialog.vue';
 export { default as BaseWaringDialog } from './items/BaseWaringDialog.vue';
-export { default as BaseMultipleInput } from './form/BaseMultipleInput.vue';
 export { default as SortTable } from './tables/SortTable.vue';
 export { default as TitleTable } from './tables/TitleTable.vue';
 export { default as SearchBar } from './items/SearchBar.vue';
@@ -14,7 +13,8 @@ export { default as MainPanel } from './layout/MainPanel.vue';
 export { default as SearchableListPanel } from './layout/SearchableListPanel.vue';
 export { default as DetailLayout } from './layout/DetailLayout.vue';
 export { default as FilterLayout } from './layout/FilterLayout.vue';
-export type { BaseTableProps, BaseTableEmits, BaseTableInstance, BaseBtnProps, BaseBtnEmits, BaseBtnInstance, BaseDialogProps, BaseDialogEmits, BaseDialogInstance, BaseWaringDialogProps, BaseWaringDialogEmits, BaseWaringDialogInstance, BaseInputProps, BaseInputEmits, BaseInputInstance, SortTableProps, SortTableEmits, SortTableInstance, TitleTableProps, TitleTableEmits, TitleTableInstance, SearchBarProps, SearchBarEmits, SearchBarInstance, SearchBarSlots, TransferDialogProps, TransferDialogEmits, TransferDialogInstance, TransferItemProps, TransferItemEmits, TransferItemInstance, MainPanelProps, MainPanelEmits, MainPanelInstance, SearchableListPanelProps, SearchableListPanelEmits, SearchableListPanelInstance, SearchableListPanelSlots, FunctionHeaderProps, FunctionHeaderEmits, FunctionHeaderInstance, DetailLayoutProps, DetailLayoutEmits, DetailLayoutInstance, FilterLayoutProps, FilterLayoutEmits, FilterLayoutInstance, PluginOptions, VueTableComponentsPlugin } from '../types/components.d';
+export { default as LanguageSwitcher } from './LanguageSwitcher.vue';
+export type { BaseTableProps, BaseTableEmits, BaseTableInstance, BaseBtnProps, BaseBtnEmits, BaseBtnInstance, BaseDialogProps, BaseDialogEmits, BaseDialogInstance, BaseWaringDialogProps, BaseWaringDialogEmits, BaseWaringDialogInstance, BaseInputProps, BaseInputEmits, BaseInputInstance, SortTableProps, SortTableEmits, SortTableInstance, TitleTableProps, TitleTableEmits, TitleTableInstance, SearchBarProps, SearchBarEmits, SearchBarInstance, SearchBarSlots, TransferDialogProps, TransferDialogEmits, TransferDialogInstance, TransferItemProps, TransferItemEmits, TransferItemInstance, MainPanelProps, MainPanelEmits, MainPanelInstance, SearchableListPanelProps, SearchableListPanelEmits, SearchableListPanelInstance, SearchableListPanelSlots, FunctionHeaderProps, FunctionHeaderEmits, FunctionHeaderInstance, DetailLayoutProps, DetailLayoutEmits, DetailLayoutInstance, FilterLayoutProps, FilterLayoutEmits, FilterLayoutInstance, PluginOptions, VueTableComponentsPlugin, } from '../types/components.d';
 export type { default as BaseTableType } from './tables/BaseTable.vue';
 export type { default as BaseBtnType } from './items/BaseBtn.vue';
 export type { default as BaseInputType } from './form/BaseInput.vue';
@@ -26,7 +26,6 @@ export type { default as SearchBarType } from './items/SearchBar.vue';
 export type { default as TransferDialogType } from './transfer/TransferDialog.vue';
 export type { default as TransferItemType } from './transfer/transferItem.vue';
 export type { default as SearchableListPanelType } from './layout/SearchableListPanel.vue';
-export type { default as BaseMultipleInputType } from './form/BaseMultipleInput.vue';
 export type { default as FunctionHeaderType } from './layout/FunctionHeader.vue';
 export type { default as MainPanelType } from './layout/MainPanel.vue';
 export type { default as DetailLayoutType } from './layout/DetailLayout.vue';

package/dist/src/const/tableConst.d.ts

@@ -1,28 +1,3 @@
-export declare const NAVIGATION_ITEMS: readonly [{
-    readonly id: "transfer-dialog";
-    readonly title: "TransferDialog 示範";
-    readonly description: "表格列配置功能";
-    readonly icon: "⚙️";
-    readonly section: "transfer-demo";
-}, {
-    readonly id: "sort-table";
-    readonly title: "排序表格示範";
-    readonly description: "排序和選擇功能";
-    readonly icon: "📊";
-    readonly section: "sort-table-demo";
-}, {
-    readonly id: "search-bar";
-    readonly title: "搜尋欄示範";
-    readonly description: "搜尋和篩選功能";
-    readonly icon: "🔍";
-    readonly section: "search-bar-demo";
-}, {
-    readonly id: "buttons-dialogs";
-    readonly title: "按鈕和對話框示範";
-    readonly description: "基礎組件展示";
-    readonly icon: "🎯";
-    readonly section: "buttons-dialogs-demo";
-}];
 export declare const DEMO_CONSTANTS: {
     readonly LOADING_DURATION: 2000;
     readonly STATUS_CONFIG: {
@@ -55,29 +30,3 @@ export interface User extends Record<string, unknown> {
     joinDate: string;
 }
 export declare const DEMO_USER_DATA: User[];
-export declare const DEPARTMENT_OPTIONS: readonly [{
-    readonly label: "全部";
-    readonly value: "";
-}, {
-    readonly label: "工程部";
-    readonly value: "engineering";
-}, {
-    readonly label: "設計部";
-    readonly value: "design";
-}, {
-    readonly label: "行銷部";
-    readonly value: "marketing";
-}];
-export declare const STATUS_OPTIONS: readonly [{
-    readonly label: "全部";
-    readonly value: "";
-}, {
-    readonly label: "啟用";
-    readonly value: "active";
-}, {
-    readonly label: "停用";
-    readonly value: "inactive";
-}, {
-    readonly label: "待處理";
-    readonly value: "pending";
-}];

package/dist/src/index.d.ts

@@ -8,6 +8,7 @@ import { default as TitleTable } from './components/tables/TitleTable.vue';
 import { default as SearchBar } from './components/items/SearchBar.vue';
 export * from './types';
 export * from './utils/tableHelper';
+export { switchLanguage, getCurrentLocale, availableLocales, getLanguageName, initLanguageSwitcher, type LocaleCode } from './utils/languageSwitcher';
 export { BaseTable, BaseBtn, BaseInput, BaseDialog, SortTable, TitleTable, SearchBar };
 export type { BaseTableProps, BaseTableEmits, BaseTableInstance, BaseBtnProps, BaseBtnEmits, BaseBtnInstance, BaseDialogProps, BaseDialogEmits, BaseDialogInstance, PluginOptions, VueTableComponentsPlugin, } from './types/components';
 export * from './components';

package/dist/src/plugins/i18n.d.ts

@@ -0,0 +1,79 @@
+export declare const i18n: import('vue-i18n').I18n<{
+    'zh-TW': {
+        "common.select": string;
+        "common.confirm": string;
+        "common.cancel": string;
+        "dialog.confirmRemoveUser": string;
+        "common.warning": string;
+        "search.placeholder": string;
+        "common.execute": string;
+        "common.reset": string;
+        "common.loading": string;
+        "common.view": string;
+        "common.edit": string;
+        "common.column": string;
+        "common.back": string;
+        "demo.componentDemo": string;
+        "button.title": string;
+        "button.primary ": string;
+        "button.default": string;
+        "button.danger": string;
+        "button.success": string;
+        "button.warning": string;
+        "button.info": string;
+        "button.style": string;
+        "button.size": string;
+        "button.small": string;
+        "button.medium": string;
+        "button.large ": string;
+        "status.title": string;
+        "status.normal ": string;
+        "status.loading": string;
+        "status.disabled": string;
+        "button.withIcon ": string;
+        "button.add": string;
+        "button.delete": string;
+    };
+    'en-US': {
+        "common.select": string;
+        "common.confirm": string;
+        "common.cancel": string;
+        "dialog.confirmRemoveUser": string;
+        "common.warning": string;
+        "search.placeholder": string;
+        "common.execute": string;
+        "common.reset": string;
+        "common.loading": string;
+        "common.view": string;
+        "common.edit": string;
+        "common.column": string;
+        "common.back": string;
+        "demo.componentDemo": string;
+        "button.title": string;
+        "button.primary ": string;
+        "button.default": string;
+        "button.danger": string;
+        "button.success": string;
+        "button.warning": string;
+        "button.info": string;
+        "button.style": string;
+        "button.size": string;
+        "button.small": string;
+        "button.medium": string;
+        "button.large ": string;
+        "status.title": string;
+        "status.normal ": string;
+        "status.loading": string;
+        "status.disabled": string;
+        "button.withIcon ": string;
+        "button.add": string;
+        "button.delete": string;
+    };
+}, {}, {}, string, false>;
+export declare const switchLanguage: (locale: "zh-TW" | "en-US") => void;
+export declare const getCurrentLocale: () => "zh-TW" | "en-US";
+export declare const availableLocales: {
+    code: string;
+    name: string;
+}[];
+export declare const initLocale: () => void;

package/dist/src/router/constants.d.ts

@@ -5,7 +5,7 @@ export declare const ROUTES: {
     readonly INSTALL_GUIDE: "/install-guide";
     readonly DOCS_CENTER: "/docs-center";
     readonly SEARCHABLE_LIST_PANEL: "/demo/searchable-list-panel";
-    readonly BASE_MULTIPLE_INPUT: "/demo/base-multiple-input";
+    readonly I18N_DEMO: "/demo/i18n-demo";
     readonly TRANSFER_DIALOG: "/demo/transfer-dialog";
     readonly BASE_TABLE: "/demo/base-table";
     readonly BASE_BTN: "/demo/base-btn";
@@ -28,7 +28,7 @@ export declare const ROUTE_NAMES: {
     readonly INSTALL_GUIDE: "InstallGuide";
     readonly DOCS_CENTER: "DocsCenter";
     readonly SEARCHABLE_LIST_PANEL: "SearchableListPanel";
-    readonly BASE_MULTIPLE_INPUT: "BaseMultipleInput";
+    readonly I18N_DEMO: "I18nDemo";
     readonly TRANSFER_DIALOG: "TransferDialog";
     readonly BASE_TABLE: "BaseTable";
     readonly BASE_BTN: "BaseBtn";

package/dist/src/utils/languageSwitcher.d.ts

@@ -0,0 +1,16 @@
+/**
+ * 語言切換工具
+ * 供外部專案使用的語言切換功能
+ */
+export declare const availableLocales: readonly [{
+    readonly code: "zh-TW";
+    readonly name: "繁體中文";
+}, {
+    readonly code: "en-US";
+    readonly name: "English";
+}];
+export type LocaleCode = typeof availableLocales[number]['code'];
+export declare const switchLanguage: (locale: LocaleCode) => void;
+export declare const getCurrentLocale: () => LocaleCode;
+export declare const getLanguageName: (locale: LocaleCode) => string;
+export declare const initLanguageSwitcher: () => "zh-TW" | "en-US";

package/dist/src/views/demo/I18nDemo.vue.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import('vue').DefineComponent<{}, {}, {}, {}, {}, import('vue').ComponentOptionsMixin, import('vue').ComponentOptionsMixin, {}, string, import('vue').PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import('vue').ComponentProvideOptions, true, {}, HTMLDivElement>;
+export default _default;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rayyy-vue-table-components",
-  "version": "1.3.17",
+  "version": "1.3.19",
   "description": "Vue 3 + Element Plus 表格組件庫",
   "type": "module",
   "main": "./dist/index.umd.js",
@@ -84,7 +84,8 @@
     "prepublishOnly": "npm run build",
     "release:patch": "./scripts/release.sh patch",
     "release:minor": "./scripts/release.sh minor",
-    "release:major": "./scripts/release.sh major"
+    "release:major": "./scripts/release.sh major",
+    "fetchI18n": "node ./scripts/fetch-i18n.js"
   },
   "peerDependencies": {
     "element-plus": "^2.9.3",
@@ -129,5 +130,8 @@
     "vue-router": "^4.5.0",
     "vue-tsc": "^2.2.8",
     "vuedraggable": "^4.1.0"
+  },
+  "dependencies": {
+    "vue-i18n": "^11.1.12"
   }
 }

package/src/components/LanguageSwitcher.vue

@@ -0,0 +1,53 @@
+<script setup lang="ts">
+import { computed } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { switchLanguage, availableLocales } from '@/plugins/i18n'
+
+const {  locale } = useI18n()
+
+// 切換語言
+const handleLanguageChange = (newLocale: "zh-TW" | "en-US") => {
+  switchLanguage(newLocale)
+}
+
+// 當前語言顯示名稱
+const currentLanguageName = computed(() => {
+  const currentLocale = availableLocales.find(l => l.code === locale.value)
+  return currentLocale?.name || '繁體中文'
+})
+</script>
+
+<template>
+  <div class="language-switcher">
+    <el-dropdown @command="handleLanguageChange" trigger="click">
+      <el-button type="text" class="flex items-center">
+        <svg class="w-4 h-4 mr-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+          <path
+            stroke-linecap="round"
+            stroke-linejoin="round"
+            stroke-width="2"
+            d="M3 5h12M9 3v2m1.048 9.5A18.022 18.022 0 016.412 9m6.088 9h7M11 21l5-10 5 10M12.751 5C11.783 10.77 8.07 15.61 3 18.129"
+          />
+        </svg>
+        {{ currentLanguageName }}
+        <svg class="w-4 h-4 ml-1" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+          <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 9l-7 7-7-7" />
+        </svg>
+      </el-button>
+      <template #dropdown>
+        <el-dropdown-menu>
+          <el-dropdown-item
+            v-for="item in availableLocales"
+            :key="item.code"
+            :command="item.code"
+          >
+            {{ item.name }}
+          </el-dropdown-item>
+        </el-dropdown-menu>
+      </template>
+    </el-dropdown>
+  </div>
+</template>
+
+<style scoped>
+</style>

package/src/components/index.ts

@@ -4,7 +4,6 @@ export { default as BaseBtn } from './items/BaseBtn.vue'
 export { default as BaseInput } from './form/BaseInput.vue'
 export { default as BaseDialog } from './items/BaseDialog.vue'
 export { default as BaseWaringDialog } from './items/BaseWaringDialog.vue'
-export { default as BaseMultipleInput } from './form/BaseMultipleInput.vue'
 export { default as SortTable } from './tables/SortTable.vue'
 export { default as TitleTable } from './tables/TitleTable.vue'
 export { default as SearchBar } from './items/SearchBar.vue'
@@ -15,6 +14,7 @@ export { default as MainPanel } from './layout/MainPanel.vue'
 export { default as SearchableListPanel } from './layout/SearchableListPanel.vue'
 export { default as DetailLayout } from './layout/DetailLayout.vue'
 export { default as FilterLayout } from './layout/FilterLayout.vue'
+export { default as LanguageSwitcher } from './LanguageSwitcher.vue'
 
 // 導出組件類型
 export type {
@@ -82,7 +82,7 @@ export type {
   FilterLayoutInstance,
   // 插件類型
   PluginOptions,
-  VueTableComponentsPlugin
+  VueTableComponentsPlugin,
 } from '../types/components.d'
 
 // 重新導出組件定義類型
@@ -97,7 +97,6 @@ export type { default as SearchBarType } from './items/SearchBar.vue'
 export type { default as TransferDialogType } from './transfer/TransferDialog.vue'
 export type { default as TransferItemType } from './transfer/transferItem.vue'
 export type { default as SearchableListPanelType } from './layout/SearchableListPanel.vue'
-export type { default as BaseMultipleInputType } from './form/BaseMultipleInput.vue'
 export type { default as FunctionHeaderType } from './layout/FunctionHeader.vue'
 export type { default as MainPanelType } from './layout/MainPanel.vue'
 export type { default as DetailLayoutType } from './layout/DetailLayout.vue'

package/src/components/items/BaseDialog.vue

@@ -81,13 +81,13 @@ const handleSubmit = () => {
       <footer>
         <slot name="customFooter">
           <base-btn
-            text="確定"
+            :text="$t('common.confirm')"
             type="primary"
             is-fill
             @click="handleSubmit"
             :loading="submitLoading"
           />
-          <base-btn text="取消" type="primary" @click="handleCancel" />
+          <base-btn :text="$t('common.cancel')" type="primary" @click="handleCancel" />
         </slot>
       </footer>
     </template>

package/src/components/layout/FunctionHeader.vue

@@ -42,6 +42,7 @@ const handleClick = () => {
       </div>
       <div class="font-bold text-text text-xl md:text-2xl;">{{ props.title }}</div>
     </div>
+
     <div class="flex items-center gap-3">
       <slot />
     </div>

package/src/components/tables/SortTable.vue

@@ -69,14 +69,13 @@ const handleEditClick = (row: T) => {
     </div>
 
     <base-table
-      v-loading="loading"
-      element-loading-text="數據加載中..."
+      :loading="loading"
       :data="data"
       :columns="columns"
+      :show-selection="showSelection"
       :show-summary="showSummary"
       :show-over-flow-tooltip="showOverFlowTooltip"
       :summary-method="summaryMethod"
-      :show-selection="showSelection"
       :base-table-row-class-name="sortTableRowClassName"
       :show-check-btn="showCheckBtn"
       :show-edit-btn="showEditBtn"

package/src/components/tables/TitleTable.vue

@@ -76,8 +76,7 @@ const handleEditClick = (row: T) => {
 
     <!-- 表格主體 -->
     <base-table
-      v-loading="loading"
-      element-loading-text="數據加載中..."
+      :loading="loading"
       :data="data"
       :columns="columns"
       :show-summary="showSummary"

package/src/utils/languageSwitcher.ts

@@ -0,0 +1,49 @@
+/**
+ * 語言切換工具
+ * 供外部專案使用的語言切換功能
+ */
+
+// 可用的語言列表
+export const availableLocales = [
+  { code: 'zh-TW', name: '繁體中文' },
+  { code: 'en-US', name: 'English' },
+] as const
+
+export type LocaleCode = typeof availableLocales[number]['code']
+
+// 語言切換功能
+export const switchLanguage = (locale: LocaleCode) => {
+  // 保存到 localStorage
+  localStorage.setItem('locale', locale)
+
+  // 觸發自定義事件，讓外部專案監聽
+  window.dispatchEvent(new CustomEvent('languageChanged', {
+    detail: { locale }
+  }))
+}
+
+// 獲取當前語言
+export const getCurrentLocale = (): LocaleCode => {
+  const savedLocale = localStorage.getItem('locale') as LocaleCode
+  return savedLocale && availableLocales.some(l => l.code === savedLocale)
+    ? savedLocale
+    : 'zh-TW'
+}
+
+// 獲取語言顯示名稱
+export const getLanguageName = (locale: LocaleCode): string => {
+  const language = availableLocales.find(l => l.code === locale)
+  return language?.name || '繁體中文'
+}
+
+// 初始化語言設定（供外部專案調用）
+export const initLanguageSwitcher = () => {
+  const currentLocale = getCurrentLocale()
+
+  // 觸發初始化事件
+  window.dispatchEvent(new CustomEvent('languageInitialized', {
+    detail: { locale: currentLocale }
+  }))
+
+  return currentLocale
+}