yc-pro-components 0.0.42 → 0.0.44

package/lib/components/virtual-table/src/use-virtual-selection.js

@@ -0,0 +1,114 @@
+'use strict';
+
+var vue = require('vue');
+var elementPlus = require('element-plus');
+
+function useVirtualSelection(options) {
+  const selectedKeys = vue.ref(/* @__PURE__ */ new Set());
+  const getRowKey = (row) => {
+    const key = options.rowKey();
+    return row[key];
+  };
+  const dataLength = vue.computed(() => options.data().length);
+  const isAllSelected = vue.computed(() => {
+    if (dataLength.value === 0) return false;
+    return selectedKeys.value.size === dataLength.value;
+  });
+  const isIndeterminate = vue.computed(() => {
+    const size = selectedKeys.value.size;
+    return size > 0 && size < dataLength.value;
+  });
+  const getSelectionRows = () => {
+    const data = options.data();
+    const keys = selectedKeys.value;
+    if (keys.size === 0) return [];
+    return data.filter((row) => keys.has(getRowKey(row)));
+  };
+  const clearSelection = () => {
+    var _a;
+    selectedKeys.value = /* @__PURE__ */ new Set();
+    (_a = options.onSelectionChange) == null ? void 0 : _a.call(options, []);
+  };
+  const toggleRowSelection = (row, selected) => {
+    var _a, _b;
+    const key = getRowKey(row);
+    const newSet = new Set(selectedKeys.value);
+    const shouldSelect = selected != null ? selected : !newSet.has(key);
+    if (shouldSelect) {
+      newSet.add(key);
+    } else {
+      newSet.delete(key);
+    }
+    selectedKeys.value = newSet;
+    const selection = getSelectionRows();
+    (_a = options.onSelect) == null ? void 0 : _a.call(options, selection, row);
+    (_b = options.onSelectionChange) == null ? void 0 : _b.call(options, selection);
+  };
+  const toggleAllSelection = (selected) => {
+    var _a, _b;
+    const shouldSelectAll = selected != null ? selected : !isAllSelected.value;
+    if (shouldSelectAll) {
+      const data = options.data();
+      selectedKeys.value = new Set(data.map((row) => getRowKey(row)));
+    } else {
+      selectedKeys.value = /* @__PURE__ */ new Set();
+    }
+    const selection = getSelectionRows();
+    (_a = options.onSelectAll) == null ? void 0 : _a.call(options, selection);
+    (_b = options.onSelectionChange) == null ? void 0 : _b.call(options, selection);
+  };
+  vue.watch(
+    () => options.data(),
+    (newData) => {
+      var _a;
+      if (selectedKeys.value.size === 0) return;
+      const currentKeys = new Set(newData.map((row) => getRowKey(row)));
+      const filtered = /* @__PURE__ */ new Set();
+      for (const key of selectedKeys.value) {
+        if (currentKeys.has(key)) {
+          filtered.add(key);
+        }
+      }
+      if (filtered.size !== selectedKeys.value.size) {
+        selectedKeys.value = filtered;
+        (_a = options.onSelectionChange) == null ? void 0 : _a.call(options, getSelectionRows());
+      }
+    }
+  );
+  const selectionCellRenderer = (params) => {
+    const row = params.rowData;
+    const key = getRowKey(row);
+    const checked = selectedKeys.value.has(key);
+    return vue.h(elementPlus.ElCheckbox, {
+      modelValue: checked,
+      onChange: (value) => {
+        toggleRowSelection(row, !!value);
+      },
+      onClick: (e) => {
+        e.stopPropagation();
+      }
+    });
+  };
+  const selectionHeaderRenderer = (_params) => {
+    return vue.h(elementPlus.ElCheckbox, {
+      modelValue: isAllSelected.value,
+      indeterminate: isIndeterminate.value,
+      onChange: (value) => {
+        toggleAllSelection(!!value);
+      }
+    });
+  };
+  return {
+    selectedKeys,
+    isAllSelected,
+    isIndeterminate,
+    getSelectionRows,
+    clearSelection,
+    toggleRowSelection,
+    toggleAllSelection,
+    selectionCellRenderer,
+    selectionHeaderRenderer
+  };
+}
+
+exports.useVirtualSelection = useVirtualSelection;

package/lib/components/virtual-table/src/virtual-table-action-bar.d.ts

@@ -0,0 +1,11 @@
+import { VirtualTableColumn } from './type';
+import { ActionBarProps, ButtonsCallBackParams } from 'yc-pro-components/es/components/table';
+
+/**
+ * 创建操作栏列配置
+ *
+ * @param actionBar - 操作栏配置
+ * @param onClickAction - 按钮点击回调（冒泡到父组件）
+ * @returns VirtualTableColumn 配置
+ */
+export declare function createActionBarColumn(actionBar: Partial<ActionBarProps>, onClickAction?: (params: ButtonsCallBackParams) => void): VirtualTableColumn;

package/lib/components/virtual-table/src/virtual-table-action-bar.js

@@ -0,0 +1,123 @@
+'use strict';
+
+var vue = require('vue');
+var elementPlus = require('element-plus');
+
+function resolveButtonText(button, row, index) {
+  var _a, _b;
+  const {
+    text
+  } = button;
+  if (typeof text === "function") {
+    return String((_a = vue.unref(text(row, index, button))) != null ? _a : "");
+  }
+  return String((_b = vue.unref(text)) != null ? _b : "");
+}
+function resolveButtonShow(button, row, index) {
+  const {
+    show
+  } = button;
+  if (show === void 0) return true;
+  if (typeof show === "function") {
+    return !!vue.unref(show(row, index, button));
+  }
+  return !!vue.unref(show);
+}
+function resolveButtonProps(button, row, index) {
+  const {
+    props
+  } = button;
+  if (!props) return {};
+  if (typeof props === "function") {
+    return props(row, index, button) || {};
+  }
+  return vue.unref(props) || {};
+}
+function createActionBarColumn(actionBar, onClickAction) {
+  const label = typeof actionBar.label === "string" ? actionBar.label : vue.unref(actionBar.label) || "\u64CD\u4F5C\u680F";
+  const width = typeof actionBar.width === "number" ? actionBar.width : parseInt(String(actionBar.width || "200"), 10) || 200;
+  const showNumber = typeof actionBar.showNumber === "number" ? actionBar.showNumber : 3;
+  const buttons = actionBar.buttons || [];
+  return {
+    key: "__action__",
+    dataKey: "__action__",
+    title: label,
+    width,
+    fixed: actionBar.fixed === "right" || actionBar.fixed === void 0 ? elementPlus.TableV2FixedDir.RIGHT : void 0,
+    align: "center",
+    cellRenderer: (params) => {
+      const {
+        rowData,
+        rowIndex
+      } = params;
+      const visibleButtons = buttons.filter((btn) => resolveButtonShow(btn, rowData, rowIndex));
+      if (visibleButtons.length === 0) return "";
+      const currentShowNumber = typeof actionBar.showNumber === "function" ? actionBar.showNumber(rowData, rowIndex) : showNumber;
+      const directButtons = visibleButtons.slice(0, currentShowNumber);
+      const moreButtons = visibleButtons.slice(currentShowNumber);
+      const handleClick = (button, e) => {
+        var _a;
+        const callbackParams = {
+          row: rowData,
+          index: rowIndex,
+          rowIndex,
+          buttonRow: button,
+          text: resolveButtonText(button, rowData, rowIndex),
+          e,
+          column: {},
+          cellIndex: 0,
+          store: {},
+          expanded: false,
+          _self: {}
+        };
+        (_a = button.onClick) == null ? void 0 : _a.call(button, callbackParams);
+        onClickAction == null ? void 0 : onClickAction(callbackParams);
+      };
+      const renderButton = (button, idx) => {
+        var _a;
+        const text = resolveButtonText(button, rowData, rowIndex);
+        const btnProps = resolveButtonProps(button, rowData, rowIndex);
+        return vue.h(elementPlus.ElButton, {
+          key: (_a = button.code) != null ? _a : idx,
+          link: true,
+          type: "primary",
+          size: "small",
+          ...btnProps,
+          onClick: (e) => handleClick(button, e)
+        }, () => text);
+      };
+      const nodes = directButtons.map(renderButton);
+      if (moreButtons.length > 0) {
+        const dropdownNode = vue.h(elementPlus.ElDropdown, {
+          trigger: "hover"
+        }, {
+          default: () => vue.h(elementPlus.ElButton, {
+            link: true,
+            type: "primary",
+            size: "small"
+          }, () => "\u66F4\u591A"),
+          dropdown: () => vue.h(elementPlus.ElDropdownMenu, null, () => moreButtons.map((btn, idx) => {
+            var _a;
+            const text = resolveButtonText(btn, rowData, rowIndex);
+            return vue.h(elementPlus.ElDropdownItem, {
+              key: (_a = btn.code) != null ? _a : `more-${idx}`,
+              onClick: (e) => handleClick(btn, e)
+            }, () => text);
+          }))
+        });
+        nodes.push(dropdownNode);
+      }
+      return vue.h("div", {
+        class: "plus-virtual-table-action-bar",
+        style: {
+          display: "flex",
+          alignItems: "center",
+          justifyContent: "center",
+          gap: "4px"
+        }
+      }, nodes);
+    }
+  };
+}
+
+exports.createActionBarColumn = createActionBarColumn;

package/lib/components/virtual-table/src/virtual-table-cell-renderer.d.ts

@@ -0,0 +1,16 @@
+import { VirtualTableColumn } from './type';
+import { PlusColumn } from 'yc-pro-components/es/types';
+
+/**
+ * 创建单元格渲染器
+ *
+ * 将 PlusColumn 的渲染配置适配为 el-table-v2 的 cellRenderer。
+ * 参数差异对照：
+ * - PlusColumn.render(value, { row, column, index })
+ * - el-table-v2.cellRenderer({ cellData, rowData, column, rowIndex, columnIndex, columns })
+ *
+ * @param plusColumn - 原始 PlusColumn 配置
+ * @param globalEmptyText - 全局空值文本
+ * @returns el-table-v2 兼容的 cellRenderer 函数
+ */
+export declare function createCellRenderer(plusColumn: PlusColumn, globalEmptyText?: string): VirtualTableColumn['cellRenderer'];

package/lib/components/virtual-table/src/virtual-table-cell-renderer.js

@@ -0,0 +1,172 @@
+'use strict';
+
+var vue = require('vue');
+var elementPlus = require('element-plus');
+
+function _isSlot(s) {
+  return typeof s === "function" || Object.prototype.toString.call(s) === "[object Object]" && !vue.isVNode(s);
+}
+function isEmpty(value) {
+  return value === null || value === void 0 || value === "";
+}
+function findOptionByValue(options, value) {
+  const arr = vue.unref(options);
+  if (!Array.isArray(arr)) return void 0;
+  return arr.find((opt) => opt.value === value);
+}
+function renderOptionStatus(option) {
+  const {
+    label,
+    color,
+    type: statusType
+  } = option;
+  const colorMap = {
+    success: "#67c23a",
+    warning: "#e6a23c",
+    info: "#909399",
+    primary: "#409eff",
+    danger: "#f56c6c"
+  };
+  const dotColor = color || (statusType ? colorMap[statusType] : void 0);
+  if (dotColor) {
+    return vue.createVNode("span", {
+      "class": "plus-table-column-status"
+    }, [vue.createVNode("span", {
+      "class": "plus-table-column-status__dot",
+      "style": {
+        backgroundColor: dotColor
+      }
+    }, null), vue.createVNode("span", {
+      "class": "plus-table-column-status__text"
+    }, [label != null ? label : ""])]);
+  }
+  return vue.createVNode("span", null, [label != null ? label : ""]);
+}
+function renderByValueType(valueType, value, column, _row) {
+  switch (valueType) {
+    case "img": {
+      const imgProps = {
+        src: value,
+        "preview-src-list": [value],
+        fit: "cover",
+        class: "plus-display-item__image",
+        style: {
+          width: "40px",
+          height: "40px"
+        }
+      };
+      return vue.createVNode(elementPlus.ElImage, imgProps, null);
+    }
+    case "link": {
+      const linkProps = {
+        href: value,
+        type: "primary",
+        class: "plus-display-item__link"
+      };
+      return vue.createVNode(elementPlus.ElLink, linkProps, {
+        default: () => [column.linkText || value]
+      });
+    }
+    case "tag": {
+      let _slot;
+      const tagOption = findOptionByValue(column.options, value);
+      if (tagOption) {
+        const tagProps = {
+          type: tagOption.type || ""
+        };
+        return vue.createVNode(elementPlus.ElTag, tagProps, {
+          default: () => {
+            var _a;
+            return [(_a = tagOption.label) != null ? _a : value];
+          }
+        });
+      }
+      return vue.createVNode(elementPlus.ElTag, null, _isSlot(_slot = String(value != null ? value : "")) ? _slot : {
+        default: () => [_slot]
+      });
+    }
+    case "money":
+      return vue.createVNode("span", null, [formatMoney(value)]);
+    case "progress": {
+      const progressProps = {
+        percentage: Number(value) || 0
+      };
+      return vue.createVNode(elementPlus.ElProgress, progressProps, null);
+    }
+    case "avatar": {
+      const avatarProps = {
+        src: value
+      };
+      return vue.createVNode(elementPlus.ElAvatar, avatarProps, null);
+    }
+    case "code":
+      return vue.createVNode("span", {
+        "class": "plus-display-item__pre"
+      }, [String(value != null ? value : "")]);
+    default:
+      return String(value != null ? value : "");
+  }
+}
+function formatMoney(value) {
+  if (isEmpty(value)) return "";
+  const num = Number(value);
+  if (isNaN(num)) return String(value);
+  return num.toLocaleString("zh-CN", {
+    minimumFractionDigits: 2,
+    maximumFractionDigits: 2
+  });
+}
+function createCellRenderer(plusColumn, globalEmptyText = "-") {
+  var _a;
+  const emptyText = (_a = plusColumn.emptyText) != null ? _a : globalEmptyText;
+  return (params) => {
+    const {
+      rowData,
+      rowIndex
+    } = params;
+    const value = rowData[plusColumn.prop];
+    if (plusColumn.render && typeof plusColumn.render === "function") {
+      return plusColumn.render(value, {
+        row: rowData,
+        column: plusColumn,
+        index: rowIndex
+      });
+    }
+    if (plusColumn.renderHTML && typeof plusColumn.renderHTML === "function") {
+      const html = plusColumn.renderHTML(value, {
+        row: rowData,
+        column: plusColumn,
+        index: rowIndex
+      });
+      return vue.createVNode("span", {
+        "innerHTML": html
+      }, null);
+    }
+    if (plusColumn.formatter && typeof plusColumn.formatter === "function") {
+      const formatted = plusColumn.formatter(value, {
+        row: rowData,
+        column: plusColumn,
+        index: rowIndex
+      });
+      return vue.createVNode("span", null, [isEmpty(formatted) ? emptyText : formatted]);
+    }
+    if (plusColumn.valueType) {
+      if (isEmpty(value)) return vue.createVNode("span", null, [emptyText]);
+      return renderByValueType(plusColumn.valueType, value, plusColumn);
+    }
+    if (plusColumn.options) {
+      const option = findOptionByValue(plusColumn.options, value);
+      if (option) {
+        return renderOptionStatus(option);
+      }
+    }
+    if (isEmpty(value)) {
+      return vue.createVNode("span", {
+        "class": "plus-table-column-empty"
+      }, [emptyText]);
+    }
+    return vue.createVNode("span", null, [String(value)]);
+  };
+}
+
+exports.createCellRenderer = createCellRenderer;

package/lib/components/virtual-table/src/virtual-table-header-renderer.d.ts

@@ -0,0 +1,10 @@
+import { VirtualTableColumn } from './type';
+import { PlusColumn } from 'yc-pro-components/es/types';
+
+/**
+ * 创建表头渲染器
+ *
+ * @param plusColumn - 原始 PlusColumn 配置
+ * @returns el-table-v2 兼容的 headerCellRenderer 函数
+ */
+export declare function createHeaderRenderer(plusColumn: PlusColumn): VirtualTableColumn['headerCellRenderer'];

package/lib/components/virtual-table/src/virtual-table-header-renderer.js

@@ -0,0 +1,53 @@
+'use strict';
+
+var vue = require('vue');
+var elementPlus = require('element-plus');
+var ElementPlusIconsVue = require('@element-plus/icons-vue');
+
+function resolveTooltip(tooltip) {
+  if (!tooltip) return null;
+  const resolved = vue.unref(tooltip);
+  if (typeof resolved === "string") {
+    return {
+      content: resolved
+    };
+  }
+  if (typeof resolved === "object" && resolved !== null) {
+    return resolved;
+  }
+  return null;
+}
+function getLabel(label) {
+  var _a;
+  if (typeof label === "string") return label;
+  return String((_a = vue.unref(label)) != null ? _a : "");
+}
+function createHeaderRenderer(plusColumn) {
+  return (_params) => {
+    const label = getLabel(plusColumn.label);
+    if (plusColumn.renderHeader && typeof plusColumn.renderHeader === "function") {
+      return plusColumn.renderHeader(label, plusColumn);
+    }
+    const tooltipConfig = resolveTooltip(plusColumn.tooltip);
+    if (tooltipConfig) {
+      const tooltipProps = {
+        placement: "top",
+        ...tooltipConfig
+      };
+      const iconProps = {
+        class: "plus-table-column__header__icon",
+        size: 16
+      };
+      return vue.createVNode("span", {
+        "class": "plus-table-column__header"
+      }, [vue.createVNode("span", null, [label]), vue.createVNode(elementPlus.ElTooltip, tooltipProps, {
+        default: () => [vue.createVNode(elementPlus.ElIcon, iconProps, {
+          default: () => [vue.createVNode(ElementPlusIconsVue.QuestionFilled, null, null)]
+        })]
+      })]);
+    }
+    return vue.createVNode("span", null, [label]);
+  };
+}
+
+exports.createHeaderRenderer = createHeaderRenderer;

package/lib/components/virtual-table/style/css.d.ts

@@ -0,0 +1,3 @@
+import "element-plus/es/components/table-v2/style/css";
+import "element-plus/es/components/checkbox/style/css";
+import "element-plus/es/components/loading/style/css";

package/lib/components/virtual-table/style/css.js

@@ -0,0 +1,2 @@
+'use strict';
+

package/lib/components/virtual-table/style/index.d.ts

@@ -0,0 +1,12 @@
+import "element-plus/es/components/table-v2/style/css";
+import "element-plus/es/components/checkbox/style/css";
+import "element-plus/es/components/loading/style/css";
+import "element-plus/es/components/icon/style/css";
+import "element-plus/es/components/button/style/css";
+import "element-plus/es/components/dropdown/style/css";
+import "element-plus/es/components/tag/style/css";
+import "element-plus/es/components/tooltip/style/css";
+import "element-plus/es/components/image/style/css";
+import "element-plus/es/components/link/style/css";
+import "element-plus/es/components/progress/style/css";
+import "element-plus/es/components/avatar/style/css";

package/lib/components/virtual-table/style/index.js

@@ -0,0 +1,2 @@
+'use strict';
+

package/lib/components/yc-dialog/index.d.ts

@@ -6,12 +6,12 @@ export * from './src/type';
 export type YcDialogInstance = InstanceType<typeof YcDialogComponent>;
 export declare const YcDialog: {
     new (...args: any[]): CreateComponentPublicInstance<Readonly< ExtractPropTypes<{
-        size: {
-            type: PropType<DialogSize>;
-        };
         width: {
             type: PropType<string | number>;
         };
+        size: {
+            type: PropType<DialogSize>;
+        };
         maxHeight: {
             type: PropType<string | number | false>;
             default: string;
@@ -21,12 +21,12 @@ export declare const YcDialog: {
             default: boolean;
         };
     }>>, {}, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, VNodeProps & AllowedComponentProps & ComponentCustomProps & Readonly< ExtractPropTypes<{
-        size: {
-            type: PropType<DialogSize>;
-        };
         width: {
             type: PropType<string | number>;
         };
+        size: {
+            type: PropType<DialogSize>;
+        };
         maxHeight: {
             type: PropType<string | number | false>;
             default: string;
@@ -46,12 +46,12 @@ export declare const YcDialog: {
         M: {};
         Defaults: {};
     }, Readonly< ExtractPropTypes<{
-        size: {
-            type: PropType<DialogSize>;
-        };
         width: {
             type: PropType<string | number>;
         };
+        size: {
+            type: PropType<DialogSize>;
+        };
         maxHeight: {
             type: PropType<string | number | false>;
             default: string;
@@ -68,12 +68,12 @@ export declare const YcDialog: {
     __isTeleport?: undefined;
     __isSuspense?: undefined;
 } & ComponentOptionsBase<Readonly< ExtractPropTypes<{
-    size: {
-        type: PropType<DialogSize>;
-    };
     width: {
         type: PropType<string | number>;
     };
+    size: {
+        type: PropType<DialogSize>;
+    };
     maxHeight: {
         type: PropType<string | number | false>;
         default: string;
@@ -94,12 +94,12 @@ export declare const YcDialog: {
 });
 export declare const ReDialog: {
     new (...args: any[]): CreateComponentPublicInstance<Readonly< ExtractPropTypes<{
-        size: {
-            type: PropType<DialogSize>;
-        };
         width: {
             type: PropType<string | number>;
         };
+        size: {
+            type: PropType<DialogSize>;
+        };
         maxHeight: {
             type: PropType<string | number | false>;
             default: string;
@@ -109,12 +109,12 @@ export declare const ReDialog: {
             default: boolean;
         };
     }>>, {}, unknown, {}, {}, ComponentOptionsMixin, ComponentOptionsMixin, {}, VNodeProps & AllowedComponentProps & ComponentCustomProps & Readonly< ExtractPropTypes<{
-        size: {
-            type: PropType<DialogSize>;
-        };
         width: {
             type: PropType<string | number>;
         };
+        size: {
+            type: PropType<DialogSize>;
+        };
         maxHeight: {
             type: PropType<string | number | false>;
             default: string;
@@ -134,12 +134,12 @@ export declare const ReDialog: {
         M: {};
         Defaults: {};
     }, Readonly< ExtractPropTypes<{
-        size: {
-            type: PropType<DialogSize>;
-        };
         width: {
             type: PropType<string | number>;
         };
+        size: {
+            type: PropType<DialogSize>;
+        };
         maxHeight: {
             type: PropType<string | number | false>;
             default: string;
@@ -156,12 +156,12 @@ export declare const ReDialog: {
     __isTeleport?: undefined;
     __isSuspense?: undefined;
 } & ComponentOptionsBase<Readonly< ExtractPropTypes<{
-    size: {
-        type: PropType<DialogSize>;
-    };
     width: {
         type: PropType<string | number>;
     };
+    size: {
+        type: PropType<DialogSize>;
+    };
     maxHeight: {
         type: PropType<string | number | false>;
         default: string;