easy-ep-ui 0.1.1 → 0.2.0

package/lib/index.d.ts

@@ -1,15 +1,63 @@
 import { App } from 'vue';
+import { AxiosInstance } from 'axios';
+import { ComponentSize } from './components/ee-form-table/types';
 import { default as EeDictSelect } from './components/ee-dict-select';
 import { default as EeStatusTag } from './components/ee-status-tag';
 import { default as EeSearchBar } from './components/ee-search-bar';
 import { default as EeFormDialog } from './components/ee-form-dialog';
 import { default as EeFormTable } from './components/ee-form-table';
+import { default as EeRemoteSelect } from './components/ee-remote-select';
+import { default as EeDeptCascader } from './components/ee-dept-cascader';
+import { default as EeUserSelect } from './components/ee-user-select';
+import { default as EeRoleSelect } from './components/ee-role-select';
+import { EeBaseBar, EeBaseLine, EeBasePie, EeBaseRadar } from './charts';
+import { Locale } from './locale';
+export type { Locale };
+/** 全局 requestInstance 注入 key，组件通过 inject 获取 */
+export declare const EE_REQUEST_KEY = "eeRequestInstance";
+/** Easy EP UI 全局配置选项 */
+export interface EasyEpUIOptions {
+    /** 全局 axios 请求实例，所有选择组件共享，组件内通过 inject 获取 */
+    requestInstance?: AxiosInstance;
+    size?: ComponentSize;
+    readOnly?: boolean;
+    locale?: string | Partial<Locale>;
+    formTable?: Record<string, unknown>;
+    searchBar?: Record<string, unknown>;
+    formDialog?: Record<string, unknown>;
+    dictSelect?: Record<string, unknown>;
+    statusTag?: Record<string, unknown>;
+    remoteSelect?: Record<string, unknown>;
+    deptCascader?: Record<string, unknown>;
+    userSelect?: Record<string, unknown>;
+    roleSelect?: Record<string, unknown>;
+    /** 图表组件全局默认配置覆盖 */
+    baseChart?: Record<string, unknown>;
+}
 export type { DictOption, SearchField, TableColumn, FormField, Pagination, StatusMapping } from './utils/types';
 export type { ColumnSearchItem, SearchConfig, PaginationConfig, ActionConfig, ActionButton, ToolbarConfig, ToolbarButton, CrudConfig, CrudApi, SelectionConfig, ExportConfig, DrawerConfig, ColumnSettingConfig, AutoHeightConfig, } from './components/ee-form-table/types';
 export type { EeFormTableProps } from './components/ee-form-table/types';
-export declare function install(app: App): void;
+/**
+ * 全局注册 Easy EP UI 组件和配置
+ *
+ * @param app - Vue 应用实例
+ * @param options - 全局配置（locale / requestInstance / size / per-component 配置）
+ */
+export declare function install(app: App, options?: EasyEpUIOptions): void;
 declare const EasyEpUI: {
     install: typeof install;
 };
 export default EasyEpUI;
-export { EeDictSelect, EeStatusTag, EeSearchBar, EeFormDialog, EeFormTable, };
+export { EeDictSelect, EeStatusTag, EeSearchBar, EeFormDialog, EeFormTable, EeRemoteSelect, EeDeptCascader, EeUserSelect, EeRoleSelect, EeBaseBar, EeBaseLine, EeBasePie, EeBaseRadar, };
+export { GLOBAL_CHART_CONFIG, deepMerge } from './charts/config';
+export { useChart } from './charts/useChart';
+export { EE_LOCALE_KEY } from './locale/useLocale';
+export { mergeLocale } from './locale';
+export { useRemoteSelectPagination, useSelectEcho } from './hooks';
+export type { RemotePaginationOption, RemoteSelectOption } from './hooks';
+export type { EchoOption } from './hooks';
+export type { EeRemoteSelectProps, EeRemoteSelectEmits } from './components/ee-remote-select/type';
+export type { EeDictSelectProps, EeDictSelectEmits } from './components/ee-dict-select/type';
+export type { EeDeptCascaderProps, EeDeptCascaderEmits } from './components/ee-dept-cascader/type';
+export type { EeUserSelectProps, EeUserSelectEmits } from './components/ee-user-select/type';
+export type { EeRoleSelectProps, EeRoleSelectEmits } from './components/ee-role-select/type';

package/lib/locale/en.d.ts

@@ -0,0 +1,3 @@
+import { Locale } from '.';
+declare const en: Locale;
+export default en;

package/lib/locale/index.d.ts

@@ -0,0 +1,91 @@
+/**
+ * 国际化语言包类型定义和合并工具
+ *
+ * 所有组件 UI 字符串集中管理，支持中文（zh-cn）和英文（en）两种内置语言，
+ * 可自定义/覆盖部分文字。
+ */
+export interface Locale {
+    formTable: {
+        operation: string;
+        add: string;
+        edit: string;
+        delete: string;
+        view: string;
+        import: string;
+        export: string;
+        batchDelete: string;
+        refresh: string;
+        columnSetting: string;
+        search: string;
+        reset: string;
+        expand: string;
+        collapse: string;
+        empty: string;
+        confirm: string;
+        cancel: string;
+        close: string;
+        confirmDelete: string;
+        confirmDeleteMsg: string;
+        confirmBatchDelete: string;
+        confirmBatchDeleteMsg: string;
+        addTitle: string;
+        editTitle: string;
+        viewTitle: string;
+        addSuccess: string;
+        editSuccess: string;
+        deleteSuccess: string;
+        batchDeleteSuccess: string;
+        refreshSuccess: string;
+        exportSuccess: string;
+        exportFail: string;
+        requestFailed: string;
+        deleteFailed: string;
+        batchDeleteFailed: string;
+        installXlsx: string;
+        exportFileName: string;
+        inputPlaceholder: string;
+        selectPlaceholder: string;
+        dateRangeTo: string;
+        dateRangeStart: string;
+        dateRangeEnd: string;
+        version: string;
+        versionTitle: string;
+        moreActions: string;
+        rowIndex: string;
+        selectionLabel: string;
+    };
+    searchBar: {
+        search: string;
+        reset: string;
+        expand: string;
+        collapse: string;
+        inputPlaceholder: string;
+        selectPlaceholder: string;
+        dateRangeTo: string;
+        dateRangeStart: string;
+        dateRangeEnd: string;
+    };
+    formDialog: {
+        confirm: string;
+        cancel: string;
+        title: string;
+        inputPlaceholder: string;
+        textareaPlaceholder: string;
+        selectPlaceholder: string;
+        datePickerPlaceholder: string;
+    };
+    remoteSelect: {
+        loading: string;
+        noMore: string;
+        loadMore: string;
+        searchPlaceholder: string;
+        requestFailed: string;
+        noData: string;
+    };
+}
+export { default as zhCn } from './zh-cn';
+export { default as en } from './en';
+/**
+ * 浅合并 locale 对象，目标字段为 undefined 时使用默认值
+ */
+export declare function mergeLocale(target: Partial<Locale> | undefined, fallback: Locale): Locale;

package/lib/locale/useLocale.d.ts

@@ -0,0 +1,13 @@
+import { Locale } from '.';
+/** 全局 locale 的注入 key */
+export declare const EE_LOCALE_KEY = "eeLocale";
+/**
+ * 获取当前 locale 上下文
+ *
+ * 组件中可通过 useLocale() 获取 t 函数和当前语言包对象。
+ * t(key) 支持 {placeholder} 模板变量替换。
+ */
+export declare function useLocale(): {
+    locale: Locale;
+    t: (section: string, key: string, args?: Record<string, string | number>) => string;
+};

package/lib/locale/zh-cn.d.ts

@@ -0,0 +1,3 @@
+import { Locale } from '.';
+declare const zhCn: Locale;
+export default zhCn;

package/lib/style.css

@@ -1 +1 @@
-.ee-search-bar[data-v-b65c74a4]{margin-bottom:16px}.ee-search-bar .el-form-item[data-v-b65c74a4]{margin-bottom:0}.ee-form-dialog-footer[data-v-560e642c]{display:flex;justify-content:flex-end;gap:12px}.ee-form-table{display:flex;flex-direction:column;height:100%;background:#fff;border-radius:4px}.ee-search-area{padding:16px 16px 0;border-bottom:1px solid #ebeef5}.ee-search-area .el-form-item{margin-bottom:16px}.ee-toolbar{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;flex-shrink:0}.ee-toolbar-left{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.ee-toolbar-right{display:flex;align-items:center;gap:8px}.ee-table-wrapper{flex:1;overflow:auto;padding:0 16px}.ee-table-wrapper .el-table{width:100%}.ee-pagination{display:flex;justify-content:flex-end;padding:12px 16px;border-top:1px solid #ebeef5;flex-shrink:0}.ee-size--small{font-size:13px}.ee-size--large{font-size:16px}
+.ee-search-bar[data-v-fe481020]{margin-bottom:16px}.ee-search-bar .el-form-item[data-v-fe481020]{margin-bottom:0}.ee-form-dialog-footer[data-v-929d8568]{display:flex;justify-content:flex-end;gap:12px}.ee-column-setting[data-v-951992f2]{max-height:320px;overflow-y:auto}.ee-column-setting-item[data-v-951992f2]{display:flex;align-items:center;justify-content:space-between;padding:4px 4px 4px 8px;cursor:grab;border-radius:4px;-webkit-user-select:none;user-select:none}.ee-column-setting-item[data-v-951992f2]:hover{background:var(--el-color-primary-light-9, #f0f5ff)}.ee-column-setting-item--drag-over[data-v-951992f2]{background:var(--el-color-primary-light-7, #d9ecff)}.ee-column-setting-drag[data-v-951992f2]{cursor:grab;color:#c0c4cc;font-size:14px}.ee-column-setting-drag[data-v-951992f2]:hover{color:#909399}.ee-column-setting-special[data-v-951992f2]{padding-bottom:4px}.ee-column-setting-item--special[data-v-951992f2]{cursor:default}.ee-column-setting-item--special[data-v-951992f2]:hover{background:transparent}.ee-form-table{display:flex;flex-direction:column;height:100%;background:#fff;border-radius:4px}.ee-search-area{padding:16px 16px 0;border-bottom:1px solid #ebeef5}.ee-search-area .el-form-item{margin-bottom:16px}.ee-toolbar{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;flex-shrink:0}.ee-toolbar-left{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.ee-toolbar-right{display:flex;align-items:center;gap:8px}.ee-table-wrapper{flex:1;overflow:auto;padding:0 16px}.ee-table-wrapper .el-table{width:100%}.ee-table-wrapper .el-table th.el-table__cell{background-color:#f5f7fa}.app-root.dark .ee-table-wrapper .el-table th.el-table__cell{background-color:#2a2a2a}.ee-pagination{display:flex;justify-content:flex-end;padding:12px 16px;border-top:1px solid #ebeef5;flex-shrink:0}.ee-size--small{font-size:13px}.ee-size--large{font-size:16px}.ee-action-btns{display:flex;align-items:center;justify-content:center;gap:2px;flex-wrap:nowrap}.ee-action-btn{white-space:nowrap!important}.ee-action-btn .el-icon{margin-right:0}.ee-load-more[data-v-21c5d143],.ee-no-more[data-v-21c5d143]{display:flex;align-items:center;justify-content:center;padding:8px 0;font-size:12px;color:#999;cursor:pointer}.ee-load-more[data-v-21c5d143]:hover{color:#409eff}.ee-loading-tip[data-v-21c5d143]{display:flex;align-items:center;justify-content:center;padding:8px 0;font-size:12px;color:#999}.ee-load-more[data-v-6e78b80d],.ee-no-more[data-v-6e78b80d]{display:flex;align-items:center;justify-content:center;padding:8px 0;font-size:12px;color:#999;cursor:pointer}.ee-load-more[data-v-6e78b80d]:hover{color:#409eff}.ee-loading-tip[data-v-6e78b80d]{display:flex;align-items:center;justify-content:center;padding:8px 0;font-size:12px;color:#999}.ee-load-more[data-v-58cd12c9],.ee-no-more[data-v-58cd12c9]{display:flex;align-items:center;justify-content:center;padding:8px 0;font-size:12px;color:#999;cursor:pointer}.ee-load-more[data-v-58cd12c9]:hover{color:#409eff}.ee-loading-tip[data-v-58cd12c9]{display:flex;align-items:center;justify-content:center;padding:8px 0;font-size:12px;color:#999}

package/lib/utils/types.d.ts

@@ -1,48 +1,87 @@
 import { VNode } from 'vue';
+/** 下拉选项项 */
 export interface DictOption {
+    /** 选项值 */
     value: string | number;
+    /** 显示文本 */
     label: string;
+    /** 是否禁用 */
     disabled?: boolean;
     [key: string]: unknown;
 }
+/** 搜索栏字段配置 */
 export interface SearchField {
+    /** 字段 key */
     prop: string;
+    /** 字段标签 */
     label: string;
+    /** 字段类型：输入框/下拉/日期/日期范围/级联 */
     type?: 'input' | 'select' | 'date' | 'date-range' | 'cascader';
+    /** 占位符 */
     placeholder?: string;
+    /** 下拉/级联选项（type=select/cascader 时使用） */
     options?: DictOption[];
+    /** 栅格占宽，默认 6 */
     span?: number;
+    /** 自定义渲染组件 */
     component?: VNode;
 }
+/** 表格列配置 */
 export interface TableColumn {
+    /** 字段 key */
     prop: string;
+    /** 列标题 */
     label: string;
+    /** 列宽 */
     width?: string | number;
+    /** 最小列宽 */
     minWidth?: string | number;
+    /** 固定列（left/right） */
     fixed?: 'left' | 'right';
+    /** 是否可排序 */
     sortable?: boolean;
+    /** 对齐方式 */
     align?: 'left' | 'center' | 'right';
+    /** 自定义格式化函数 */
     formatter?: (row: Record<string, unknown>, column: TableColumn, cellValue: unknown, index: number) => VNode | string;
     [key: string]: unknown;
 }
+/** 表单字段配置 */
 export interface FormField {
+    /** 字段 key */
     prop: string;
+    /** 字段标签 */
     label: string;
+    /** 字段类型 */
     type?: 'input' | 'textarea' | 'select' | 'radio' | 'checkbox' | 'date' | 'switch';
+    /** 占位符 */
     placeholder?: string;
+    /** 校验规则 */
     rules?: Record<string, unknown>[];
+    /** 选项数据 */
     options?: DictOption[];
+    /** 栅格占宽 */
     span?: number;
+    /** 自定义渲染组件 */
     component?: VNode;
 }
+/** 分页信息 */
 export interface Pagination {
+    /** 当前页 */
     current: number;
+    /** 每页条数 */
     pageSize: number;
+    /** 总条数 */
     total: number;
 }
+/** 状态映射（用于 EeStatusTag） */
 export interface StatusMapping {
+    /** 状态值 */
     value: string | number;
+    /** 显示文字 */
     label: string;
+    /** Element Plus Tag 类型 */
     type?: 'primary' | 'success' | 'warning' | 'danger' | 'info';
+    /** 主题效果 */
     effect?: 'dark' | 'light' | 'plain';
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "easy-ep-ui",
-  "version": "0.1.1",
+  "version": "0.2.0",
   "description": "Enterprise Element Plus 二次封装组件库 - Easy EP UI",
   "type": "module",
   "main": "lib/index.cjs",
@@ -24,7 +24,6 @@
   },
   "scripts": {
     "dev": "vitepress dev docs",
-    "docs:dev": "vitepress dev docs",
     "docs:build": "vitepress build docs",
     "docs:serve": "vitepress serve docs",
     "clean": "rm -rf dist es lib",
@@ -38,11 +37,15 @@
     "prepublishOnly": "npm run clean && npm run build"
   },
   "peerDependencies": {
+    "axios": "^1.7.0",
+    "echarts": "^6.0.0",
     "element-plus": "^2.8.0",
     "vue": "^3.4.0"
   },
   "devDependencies": {
     "@vitejs/plugin-vue": "^5.1.0",
+    "axios": "^1.7.0",
+    "echarts": "^6.1.0",
     "element-plus": "^2.8.0",
     "typescript": "^5.5.0",
     "vite": "^5.4.0",