ele-admin-plus 1.3.0 → 1.4.0-beta.1

package/lib/ele-crud/props.cjs

@@ -0,0 +1,59 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const crudProps = {
+  /** 字段数据 */
+  fields: Array,
+  /** 列表配置 */
+  listConfig: Object,
+  /** 搜索栏配置 */
+  searchConfig: {
+    type: [Object, Boolean],
+    default: () => {
+      return null;
+    }
+  },
+  /** 添加配置 */
+  addConfig: {
+    type: [Object, Boolean],
+    default: () => {
+      return null;
+    }
+  },
+  /** 修改配置 */
+  editConfig: {
+    type: [Object, Boolean],
+    default: () => {
+      return null;
+    }
+  },
+  /** 页面配置 */
+  pageConfig: Object,
+  /** 高级表单组件 */
+  proFormComponent: [String, Object, Function],
+  /** 表格数据接口 */
+  listApi: [Array, Function, String],
+  /** 删除数据接口 */
+  deleteApi: [Function, String],
+  /** 添加数据接口 */
+  addApi: [Function, String],
+  /** 修改数据接口 */
+  editApi: [Function, String],
+  /** 侧栏树组件数据接口 */
+  treeListApi: [Array, Function, String],
+  /** 消息提示组件属性 */
+  messageOptions: Object,
+  /** 高级表单组件类型数据 */
+  itemTypeData: Array,
+  /** 远程数据源请求工具 */
+  httpRequest: [Object, Function],
+  /** 屏幕尺寸 */
+  screenSize: String,
+  /** 国际化 */
+  locale: Object
+};
+const crudEmits = {
+  /** 表格多选数据改变事件 */
+  tableSelectionsChange: (_selections) => true
+};
+exports.crudEmits = crudEmits;
+exports.crudProps = crudProps;

package/lib/ele-crud/props.d.ts

@@ -0,0 +1,64 @@
+import { PropType, ExtractPropTypes } from 'vue';
+import { UserComponent } from '../ele-app/types';
+import { EleMessageOptions } from '../ele-app/plus';
+import { DataItem } from '../ele-data-table/types';
+import { Datasource } from '../ele-pro-table/types';
+import { ProFormItemTypeData, ScreenSize } from '../ele-pro-form/types';
+import { CrudField, ListConfig, SearchConfig, EditConfig, PageConfig, DeleteApi, EditApi, TreeListApi, CrudLocale } from './types';
+
+/**
+ * 属性
+ */
+export declare const crudProps: {
+    /** 字段数据 */
+    fields: PropType<CrudField[]>;
+    /** 列表配置 */
+    listConfig: PropType<ListConfig>;
+    /** 搜索栏配置 */
+    searchConfig: {
+        type: PropType<SearchConfig | boolean>;
+        default: () => null;
+    };
+    /** 添加配置 */
+    addConfig: {
+        type: PropType<EditConfig | boolean>;
+        default: () => null;
+    };
+    /** 修改配置 */
+    editConfig: {
+        type: PropType<EditConfig | boolean>;
+        default: () => null;
+    };
+    /** 页面配置 */
+    pageConfig: PropType<PageConfig>;
+    /** 高级表单组件 */
+    proFormComponent: PropType<UserComponent>;
+    /** 表格数据接口 */
+    listApi: PropType<Datasource | string>;
+    /** 删除数据接口 */
+    deleteApi: PropType<DeleteApi | string>;
+    /** 添加数据接口 */
+    addApi: PropType<EditApi | string>;
+    /** 修改数据接口 */
+    editApi: PropType<EditApi | string>;
+    /** 侧栏树组件数据接口 */
+    treeListApi: PropType<Array<Record<string, any>> | TreeListApi | string>;
+    /** 消息提示组件属性 */
+    messageOptions: PropType<EleMessageOptions>;
+    /** 高级表单组件类型数据 */
+    itemTypeData: PropType<ProFormItemTypeData[]>;
+    /** 远程数据源请求工具 */
+    httpRequest: (ObjectConstructor | FunctionConstructor)[];
+    /** 屏幕尺寸 */
+    screenSize: PropType<ScreenSize>;
+    /** 国际化 */
+    locale: PropType<Partial<CrudLocale>>;
+};
+export type CrudProps = ExtractPropTypes<typeof crudProps>;
+/**
+ * 事件
+ */
+export declare const crudEmits: {
+    /** 表格多选数据改变事件 */
+    tableSelectionsChange: (_selections: DataItem[]) => boolean;
+};

package/lib/ele-crud/style/index.cjs

@@ -0,0 +1,18 @@
+"use strict";
+require("element-plus/es/components/button/style/index");
+require("element-plus/es/components/link/style/index");
+require("element-plus/es/components/divider/style/index");
+require("element-plus/es/components/input/style/index");
+require("element-plus/es/components/tree/style/index");
+require("element-plus/es/components/empty/style/index");
+require("element-plus/es/components/message-box/style/index");
+require("../../ele-page/style/index");
+require("../../ele-card/style/index");
+require("../../ele-pro-table/style/index");
+require("../../ele-pro-form/style/index");
+require("../../ele-modal/style/index");
+require("../../ele-loading/style/index");
+require("../../ele-split-panel/style/index");
+require("../../ele-popconfirm/style/index");
+require("../../ele-app/style/message/index");
+require("./index.scss");

package/lib/ele-crud/style/index.d.ts

@@ -0,0 +1 @@
+

package/lib/ele-crud/style/index.scss

@@ -0,0 +1,50 @@
+@use '../../style/themes/default.scss' as *;
+@use '../../style/util.scss' as *;
+
+/* 折叠面板 */
+.ele-crud-split-panel.ele-split-panel {
+  height: 100%;
+
+  &.is-flex-table {
+    overflow: hidden;
+  }
+
+  & > .ele-split-panel-wrap > .ele-split-panel-side {
+    border-width: 0 1px 0 0;
+  }
+
+  &.is-responsive > .ele-split-panel-wrap > div.ele-split-panel-side {
+    background: none;
+  }
+
+  & > .ele-split-panel-body {
+    overflow: hidden;
+  }
+
+  &.is-collapse > .ele-split-collapse-button {
+    margin-left: 2px;
+  }
+}
+
+/* 侧栏搜索栏 */
+.ele-crud-search-bar {
+  flex-shrink: 0;
+  padding: 16px 16px 12px 16px;
+  box-sizing: border-box;
+
+  & > .el-input .el-input__prefix-inner > .el-input__icon {
+    transform: translateY(-0.5px);
+  }
+}
+
+/* 侧栏树组件 */
+.ele-crud-tree-wrapper {
+  flex: 1;
+  padding: 0 16px 16px 16px;
+  box-sizing: border-box;
+  overflow: auto;
+
+  & > .ele-crud-tree {
+    #{eleVarName('tree', 'item-height')}: 34px;
+  }
+}

package/lib/ele-crud/types.d.ts

@@ -0,0 +1,248 @@
+import type { ComponentProps } from '../ele-app/types';
+import type {
+  ElButtonProps,
+  ElLinkProps,
+  ElTreeProps,
+  ElInputProps,
+  ElEmptyProps
+} from '../ele-app/el';
+import type {
+  ElePageProps,
+  EleCardProps,
+  EleProTableProps,
+  EleProFormProps,
+  EleSplitPanelProps,
+  EleLoadingProps,
+  EleModalProps,
+  ElePopconfirmProps,
+  EleMessageBoxOptions
+} from '../ele-app/plus';
+import type { ProFormItemProps } from '../ele-pro-form/types';
+import type { DataItem, DataKey, Column } from '../ele-data-table/types';
+
+/**
+ * 字段
+ */
+export interface CrudField {
+  /** 唯一值 */
+  key?: string;
+  /** 属性名 */
+  prop: string;
+  /** 字段名 */
+  label?: string;
+  /** 不显示在列表中 */
+  hideInList?: boolean | 'flat';
+  /** 不显示在搜索栏中 */
+  hideInSearch?: boolean | 'flat';
+  /** 不显示在添加中 */
+  hideInAdd?: boolean | 'flat';
+  /** 不显示在修改中 */
+  hideInEdit?: boolean | 'flat';
+  /** 表格列属性 */
+  columnProps?: Column;
+  /** 搜索表单项属性 */
+  searchItemProps?: ProFormItemProps;
+  /** 添加表单项属性 */
+  addItemProps?: ProFormItemProps;
+  /** 修改表单项属性 */
+  editItemProps?: ProFormItemProps;
+  /** 子级 */
+  children?: Array<Partial<CrudField>>;
+}
+
+/**
+ * 删除确认框属性
+ */
+export type DelConfirmProps = ElePopconfirmProps | EleMessageBoxOptions;
+
+/**
+ * 删除气泡确认框属性
+ */
+export type DelPopConfirmProps = DelConfirmProps & {
+  /** 是否是气泡确认框 */
+  isPopConfirm?: boolean;
+};
+
+/**
+ * 列表配置
+ */
+export interface ListConfig {
+  /** 卡片属性 */
+  cardProps?: boolean | EleCardProps;
+  /** 卡片插槽 */
+  cardSlots?: Record<string, string>;
+  /** 表格属性 */
+  tableProps?: EleProTableProps;
+  /** 表格插槽 */
+  tableSlots?: Record<string, any>;
+  /** 表格多选列属性 */
+  selectionColumnProps?: boolean | Column;
+  /** 表格序号列属性 */
+  indexColumnProps?: boolean | Column;
+  /** 表格操作列属性 */
+  actionColumnProps?: boolean | Column;
+  /** 添加按钮属性 */
+  addBtnProps?: boolean | ElButtonProps;
+  /** 批量删除按钮属性 */
+  delBtnProps?: boolean | ElButtonProps;
+  /** 修改按钮属性 */
+  editLinkProps?: boolean | ElLinkProps;
+  /** 删除按钮属性 */
+  delLinkProps?: boolean | ElLinkProps;
+  /** 删除气泡确认框属性 */
+  delPopConfirmProps?: boolean | DelPopConfirmProps;
+  /** 删除确认框属性 */
+  delConfirmProps?: boolean | EleMessageBoxOptions;
+}
+
+/**
+ * 搜索栏配置
+ */
+export interface SearchConfig {
+  /** 卡片属性 */
+  cardProps?: boolean | EleCardProps;
+  /** 卡片插槽 */
+  cardSlots?: Record<string, string>;
+  /** 表单属性 */
+  formProps?: EleProFormProps;
+  /** 表单插槽 */
+  formSlots?: Record<string, string>;
+}
+
+/**
+ * 修改配置
+ */
+export interface EditConfig {
+  /** 弹窗属性 */
+  modalProps?: EleModalProps;
+  /** 弹窗插槽 */
+  modalSlots?: Record<string, string>;
+  /** 表单属性 */
+  formProps?: EleProFormProps;
+  /** 表单插槽 */
+  formSlots?: Record<string, string>;
+  /** 取消按钮属性 */
+  cancelBtnProps?: boolean | ElButtonProps;
+  /** 保存按钮属性 */
+  saveBtnProps?: boolean | ElButtonProps;
+}
+
+/**
+ * 侧栏配置
+ */
+export interface SideConfig {
+  /** 搜索栏属性 */
+  searchProps?: boolean | ComponentProps<{}>;
+  /** 搜索输入框属性 */
+  searchInputProps?: ElInputProps;
+  /** 搜索输入框插槽 */
+  searchInputSlots?: Record<string, string>;
+  /** 树组件属性 */
+  treeProps?: ElTreeProps;
+  /** 树组件插槽 */
+  treeSlots?: Record<string, string>;
+  /** 加载组件属性 */
+  loadingProps?: EleLoadingProps;
+  /** 空组件属性 */
+  emptyProps?: ElEmptyProps;
+}
+
+/**
+ * 页面配置
+ */
+export interface PageConfig {
+  /** 页面容器组件属性 */
+  pageProps?: boolean | ElePageProps;
+  /** 卡片属性 */
+  cardProps?: boolean | EleCardProps;
+  /** 卡片插槽 */
+  cardSlots?: Record<string, string>;
+  /** 分割面板属性 */
+  splitPanelProps?: boolean | EleSplitPanelProps;
+  /** 分割面板插槽 */
+  splitPanelSlots?: Record<string, string>;
+  /** 侧栏配置 */
+  sideConfig?: SideConfig;
+  /** 侧栏对表格筛选的字段名 */
+  tableFilterField?: string;
+}
+
+/**
+ * 操作按钮点击动作
+ */
+export type BtnClickAction =
+  | 'add'
+  | 'edit'
+  | 'del'
+  | 'delSelections'
+  | 'delConfirm';
+
+/**
+ * 删除气泡配置
+ */
+export interface DeletePopOption {
+  /** 删除气泡数据 */
+  item?: DataItem;
+  /** 删除气泡触发节点 */
+  triggerEl?: any;
+  /** 删除气泡属性 */
+  confirmProps?: DelPopConfirmProps;
+}
+
+/**
+ * 删除数据接口
+ */
+export type DeleteApi = (
+  dataKeys: DataKey[],
+  data: DataItem[]
+) => Promise<string | undefined>;
+
+/**
+ * 修改数据接口
+ */
+export type EditApi = (data: DataItem) => Promise<string | undefined>;
+
+/**
+ * 侧栏树组件数据接口
+ */
+export type TreeListApi = (
+  searchValue?: string
+) => Promise<Array<Record<string, any>> | undefined>;
+
+/**
+ * 获取并缓存代码解析结果的方法
+ */
+export type GetFieldsFormItemsFunction = (
+  fields?: CrudField[]
+) => ProFormItemProps[];
+
+/**
+ * 获取并缓存代码解析结果的方法
+ */
+export type GetAndCacheCodeFunction = (code: string, codeResult?: any) => any;
+
+/**
+ * 国际化
+ */
+export interface CrudLocale {
+  save: string;
+  cancel: string;
+  action: string;
+  add: string;
+  edit: string;
+  delete: string;
+  deleteConfirm: string;
+  deleteConfirmTitle: string;
+  deleteBatch: string;
+  deleteBatchConfirm: string;
+  deleteBatchConfirmTitle: string;
+  deleteBatchTip: string;
+  deleteLoading: string;
+  deleteSuccess: string;
+  deleteError: string;
+  editSuccess: string;
+  editError: string;
+  addSuccess: string;
+  addError: string;
+  search: string;
+}

package/lib/ele-crud/util.cjs

@@ -0,0 +1,117 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const common = require("../utils/common");
+const codeStringPrefix = "/*__PRO_CRUD__*/";
+function getDefaultSearchFormProps() {
+  const config = {
+    grid: { lg: 6, md: 8, sm: 12, xs: 24 },
+    footer: true,
+    footerProps: { labelWidth: 16 },
+    autoFooterCol: true
+  };
+  return config;
+}
+function getFieldsSearchFormItems(fields) {
+  return common.mapTree(
+    fields || [],
+    (field, index) => {
+      if (field.hideInSearch === "flat") {
+        return "flatChildren";
+      } else if (!field.hideInSearch) {
+        return {
+          key: field.key ?? `${index}-${field.prop}`,
+          prop: field.prop,
+          label: field.label,
+          ...field.searchItemProps || {}
+        };
+      }
+    },
+    "children",
+    "children",
+    (item) => {
+      var _a;
+      return {
+        type: ((_a = item.children) == null ? void 0 : _a.length) ? "div" : "input",
+        ...item
+      };
+    }
+  );
+}
+function getFieldsAddFormItems(fields) {
+  return common.mapTree(
+    fields || [],
+    (field, index) => {
+      if (field.hideInAdd === "flat") {
+        return "flatChildren";
+      } else if (!field.hideInAdd) {
+        return {
+          key: field.key ?? `${index}-${field.prop}`,
+          prop: field.prop,
+          label: field.label,
+          ...field.addItemProps || {}
+        };
+      }
+    },
+    "children",
+    "children",
+    (item) => {
+      var _a;
+      return {
+        type: ((_a = item.children) == null ? void 0 : _a.length) ? "div" : "input",
+        ...item
+      };
+    }
+  );
+}
+function getFieldsEditFormItems(fields) {
+  return common.mapTree(
+    fields || [],
+    (field, index) => {
+      if (field.hideInEdit === "flat") {
+        return "flatChildren";
+      } else if (!field.hideInEdit) {
+        return {
+          key: field.key ?? `${index}-${field.prop}`,
+          prop: field.prop,
+          label: field.label,
+          ...field.editItemProps || {}
+        };
+      }
+    },
+    "children",
+    "children",
+    (item) => {
+      var _a;
+      return {
+        type: ((_a = item.children) == null ? void 0 : _a.length) ? "div" : "input",
+        ...item
+      };
+    }
+  );
+}
+const defaultTreeNodeKey = "value";
+function getTreeValueField(sideConfig) {
+  var _a;
+  return ((_a = sideConfig == null ? void 0 : sideConfig.treeProps) == null ? void 0 : _a.nodeKey) ?? defaultTreeNodeKey;
+}
+function getTreeLabelField(sideConfig) {
+  var _a, _b;
+  const field = (_b = (_a = sideConfig == null ? void 0 : sideConfig.treeProps) == null ? void 0 : _a.props) == null ? void 0 : _b.label;
+  return typeof field === "string" ? field : "label";
+}
+function getCodeResult(code, httpRequest) {
+  try {
+    return new Function("httpRequest", `return (${code})`)(httpRequest);
+  } catch (e) {
+    console.error(e);
+  }
+}
+exports.codeStringPrefix = codeStringPrefix;
+exports.defaultTreeNodeKey = defaultTreeNodeKey;
+exports.getCodeResult = getCodeResult;
+exports.getDefaultSearchFormProps = getDefaultSearchFormProps;
+exports.getFieldsAddFormItems = getFieldsAddFormItems;
+exports.getFieldsEditFormItems = getFieldsEditFormItems;
+exports.getFieldsSearchFormItems = getFieldsSearchFormItems;
+exports.getTreeLabelField = getTreeLabelField;
+exports.getTreeValueField = getTreeValueField;

package/lib/ele-crud/util.d.ts

@@ -0,0 +1,47 @@
+import { EleProFormProps } from '../ele-app/plus';
+import { ProFormItemProps } from '../ele-pro-form/types';
+import { CrudField, SideConfig } from './types';
+
+/**
+ * 代码字符串前缀
+ */
+export declare const codeStringPrefix = "/*__PRO_CRUD__*/";
+/**
+ * 获取搜索表单默认属性
+ */
+export declare function getDefaultSearchFormProps(): EleProFormProps;
+/**
+ * 获取字段数据对应的搜索表单项数据
+ * @param fields 字段数据
+ */
+export declare function getFieldsSearchFormItems(fields?: CrudField[]): ProFormItemProps[];
+/**
+ * 获取字段数据对应的添加表单项数据
+ * @param fields 字段数据
+ */
+export declare function getFieldsAddFormItems(fields?: CrudField[]): ProFormItemProps[];
+/**
+ * 获取字段数据对应的修改表单项数据
+ * @param fields 字段数据
+ */
+export declare function getFieldsEditFormItems(fields?: CrudField[]): ProFormItemProps[];
+/**
+ * 树组件默认的节点值字段名
+ */
+export declare const defaultTreeNodeKey = "value";
+/**
+ * 获取树组件数据值的字段名
+ * @param sideConfig 侧栏配置
+ */
+export declare function getTreeValueField(sideConfig?: SideConfig): string;
+/**
+ * 获取树组件显示文本的字段名
+ * @param sideConfig 侧栏配置
+ */
+export declare function getTreeLabelField(sideConfig?: SideConfig): string;
+/**
+ * 执行代码字符串
+ * @param code 代码字符串
+ * @param httpRequest 远程数据源请求工具
+ */
+export declare function getCodeResult(code: string, httpRequest?: any): any;