vxe-pc-ui 4.20.34 → 4.20.35

package/lib/step-item/index.js

@@ -0,0 +1,47 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var step_item_exports = {};
+__export(step_item_exports, {
+  StepItem: () => StepItem,
+  VxeStepItem: () => VxeStepItem,
+  default: () => step_item_default
+});
+module.exports = __toCommonJS(step_item_exports);
+var import_core = require("@vxe-ui/core");
+var import_step_item = __toESM(require("../steps/src/step-item"));
+var import_dynamics = require("../dynamics");
+const VxeStepItem = Object.assign({}, import_step_item.default, {
+  install(app) {
+    app.component(import_step_item.default.name, import_step_item.default);
+  }
+});
+import_dynamics.dynamicApp.use(VxeStepItem);
+import_core.VxeUI.component(import_step_item.default);
+const StepItem = VxeStepItem;
+var step_item_default = VxeStepItem;

package/lib/steps/src/step-info.js

@@ -0,0 +1,49 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
+var step_info_exports = {};
+__export(step_info_exports, {
+  StepItemInfo: () => StepItemInfo
+});
+module.exports = __toCommonJS(step_info_exports);
+var import_xe_utils = __toESM(require("xe-utils"));
+class StepItemInfo {
+  constructor($xeSteps, _vm) {
+    __publicField(this, "id", import_xe_utils.default.uniqueId("step_item_"));
+    Object.assign(this, {
+      title: _vm.title,
+      content: _vm.content,
+      status: _vm.status
+    });
+  }
+  update(name, value) {
+    this[name] = value;
+  }
+}

package/lib/steps/src/step-item.js

@@ -0,0 +1,59 @@
+"use strict";
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var step_item_exports = {};
+__export(step_item_exports, {
+  default: () => step_item_default
+});
+module.exports = __toCommonJS(step_item_exports);
+var import_vue = require("vue");
+var import_comp = require("../../ui/src/comp");
+var import_util = require("./util");
+var step_item_default = (
+  /* define-vxe-component start */
+  (0, import_comp.defineVxeComponent)({
+    name: "VxeStepItem",
+    props: {
+      title: [String, Number],
+      content: [String, Number],
+      status: String
+    },
+    setup(props, context) {
+      const { slots } = context;
+      const refElem = (0, import_vue.ref)();
+      const $xeSteps = (0, import_vue.inject)("$xeSteps", {});
+      const itemConfig = (0, import_util.createStepItem)($xeSteps, props);
+      itemConfig.slots = slots;
+      (0, import_util.watchStepItem)(props, itemConfig);
+      (0, import_vue.onMounted)(() => {
+        const el = refElem.value;
+        if (el) {
+          (0, import_util.assembleStepItem)($xeSteps, el, itemConfig);
+        }
+      });
+      (0, import_vue.onUnmounted)(() => {
+        (0, import_util.destroyStepItem)($xeSteps, itemConfig);
+      });
+      return () => {
+        return (0, import_vue.h)("div", {
+          ref: refElem
+        });
+      };
+    }
+  })
+);

package/lib/steps/src/steps.js

@@ -35,50 +35,302 @@ var import_vue = require("vue");
 var import_comp = require("../../ui/src/comp");
 var import_xe_utils = __toESM(require("xe-utils"));
 var import_core = require("@vxe-ui/core");
-const { createEvent } = import_core.VxeUI;
-var steps_default = (0, import_comp.defineVxeComponent)({
-  name: "VxeSteps",
-  props: {},
-  emits: [],
-  setup(props, context) {
-    const { emit } = context;
-    const xID = import_xe_utils.default.uniqueId();
-    const refElem = (0, import_vue.ref)();
-    const reactData = (0, import_vue.reactive)({});
-    const refMaps = {
-      refElem
-    };
-    const computeMaps = {};
-    const $xeSteps = {
-      xID,
-      props,
-      context,
-      reactData,
-      getRefMaps: () => refMaps,
-      getComputeMaps: () => computeMaps
-    };
-    const dispatchEvent = (type, params, evnt) => {
-      emit(type, createEvent(evnt, { $steps: $xeSteps }, params));
-    };
-    const stepsMethods = {
-      dispatchEvent
-    };
-    const stepsPrivateMethods = {};
-    Object.assign($xeSteps, stepsMethods, stepsPrivateMethods);
-    const renderVN = () => {
-      return (0, import_vue.h)(
-        "div",
-        {
-          ref: refElem,
-          class: "vxe-steps"
-        },
-        []
+var import_utils = require("../../ui/src/utils");
+const { getConfig, getIcon, useFns, createEvent } = import_core.VxeUI;
+function createInternalData() {
+  return {
+    fullData: []
+  };
+}
+function createReactData() {
+  return {
+    itemList: [],
+    staticItems: [],
+    isOptConf: false
+  };
+}
+var steps_default = (
+  /* define-vxe-component start */
+  (0, import_comp.defineVxeComponent)({
+    name: "VxeSteps",
+    props: {
+      modelValue: [Number, String],
+      size: {
+        type: String,
+        default: () => getConfig().steps.size
+      },
+      options: Array,
+      type: {
+        type: String,
+        default: () => getConfig().steps.type
+      },
+      vertical: {
+        type: Boolean,
+        default: () => getConfig().steps.vertical
+      },
+      optionProps: Object,
+      separator: {
+        type: [String, Number],
+        default: () => getConfig().steps.separator
+      },
+      showNumber: {
+        type: Boolean,
+        default: () => getConfig().steps.showNumber
+      },
+      showIcon: {
+        type: Boolean,
+        default: () => getConfig().steps.showIcon
+      }
+    },
+    emits: [
+      "update:modelValue"
+    ],
+    setup(props, context) {
+      const { slots, emit } = context;
+      const xID = import_xe_utils.default.uniqueId();
+      const { computeSize } = useFns.useSize(props);
+      const refElem = (0, import_vue.ref)();
+      const reactData = (0, import_vue.reactive)(createReactData());
+      const internalData = createInternalData();
+      const refMaps = {
+        refElem
+      };
+      const computeMaps = {};
+      const $xeSteps = {
+        xID,
+        props,
+        context,
+        reactData,
+        internalData,
+        getRefMaps: () => refMaps,
+        getComputeMaps: () => computeMaps
+      };
+      const computePropsOpts = (0, import_vue.computed)(() => {
+        return Object.assign({}, getConfig().steps.optionProps, props.optionProps);
+      });
+      const computeTitleField = (0, import_vue.computed)(() => {
+        const propsOpts = computePropsOpts.value;
+        return propsOpts.title || "title";
+      });
+      const computeContentField = (0, import_vue.computed)(() => {
+        const propsOpts = computePropsOpts.value;
+        return propsOpts.content || "content";
+      });
+      const computeStatusField = (0, import_vue.computed)(() => {
+        const propsOpts = computePropsOpts.value;
+        return propsOpts.status || "status";
+      });
+      const computeSeparatorText = (0, import_vue.computed)(() => {
+        const { separator } = props;
+        return import_xe_utils.default.toValueString(separator) || "";
+      });
+      const computeCurrentNum = (0, import_vue.computed)(() => {
+        const { modelValue } = props;
+        return modelValue ? import_xe_utils.default.toNumber(modelValue) : 0;
+      });
+      const dispatchEvent = (type, params, evnt) => {
+        emit(type, createEvent(evnt, { $steps: $xeSteps }, params));
+      };
+      const loadData = (opts, isOptConf) => {
+        reactData.isOptConf = isOptConf;
+        internalData.fullData = opts || [];
+        updateItems();
+      };
+      const updateItems = () => {
+        const { fullData } = internalData;
+        reactData.itemList = fullData.slice(0);
+      };
+      const stepsMethods = {
+        dispatchEvent
+      };
+      const stepsPrivateMethods = {};
+      Object.assign($xeSteps, stepsMethods, stepsPrivateMethods);
+      const renderIcon = (itemStatus, isCurrent, isFinish, index) => {
+        const { showNumber, showIcon } = props;
+        if (!showNumber) {
+          return (0, import_vue.h)("span", {
+            class: "vxe-steps--item-icon-dot"
+          });
+        }
+        if (showIcon && (isFinish || itemStatus === "finish" || itemStatus === "error")) {
+          return (0, import_vue.h)("span", {
+            class: "vxe-steps--item-icon-status"
+          }, [
+            (0, import_vue.h)("i", {
+              class: itemStatus === "error" ? isCurrent ? getIcon().STEPS_STATUS_ERROR_CURRENT : getIcon().STEPS_STATUS_ERROR : isCurrent ? getIcon().STEPS_STATUS_FINISH_CURRENT : getIcon().STEPS_STATUS_FINISH
+            })
+          ]);
+        }
+        return (0, import_vue.h)("span", {
+          class: "vxe-steps--item-icon-num"
+        }, `${index + 1}`);
+      };
+      const renderItem = (item, index) => {
+        const { itemList, isOptConf } = reactData;
+        const titleField = computeTitleField.value;
+        const contentField = computeContentField.value;
+        const currentNum = computeCurrentNum.value;
+        const statusField = computeStatusField.value;
+        const titleVal = (0, import_utils.getText)(isOptConf ? item[titleField] : item.title);
+        const contentVal = (0, import_utils.getText)(isOptConf ? item[contentField] : item.content);
+        const customStatus = (0, import_utils.getText)(isOptConf ? item[statusField] : item.status);
+        const titleSlot = slots.title;
+        const contentSlot = slots.content;
+        const isFinish = currentNum > index;
+        const isCurrent = currentNum === index;
+        return (0, import_vue.h)(
+          "div",
+          {
+            key: index,
+            class: [
+              "vxe-steps--item",
+              {
+                [`status--${customStatus}`]: customStatus,
+                "is--finish": isFinish,
+                "is--current": currentNum === index,
+                "is--last": index === itemList.length - 1
+              }
+            ]
+          },
+          [
+            (0, import_vue.h)("div", {
+              class: "vxe-steps--item-line"
+            }),
+            (0, import_vue.h)(
+              "div",
+              {
+                class: "vxe-steps--item-icon"
+              },
+              [
+                renderIcon(customStatus, isCurrent, isFinish, index)
+              ]
+            ),
+            (0, import_vue.h)(
+              "div",
+              {
+                class: "vxe-steps--item-wrapper"
+              },
+              [
+                (0, import_vue.h)("div", {
+                  class: "vxe-steps--item-title"
+                }, titleSlot ? titleSlot({ item }) : titleVal),
+                (0, import_vue.h)("div", {
+                  class: "vxe-steps--item-content"
+                }, contentSlot ? contentSlot({ item }) : contentVal)
+              ]
+            )
+          ]
+        );
+      };
+      const renderSeparator = (index) => {
+        const separatorText = computeSeparatorText.value;
+        const separatorSlot = slots.separator;
+        return (0, import_vue.h)(
+          "div",
+          {
+            key: `s${index}`,
+            class: "vxe-steps--item-separator"
+          },
+          separatorSlot ? separatorSlot({}) : [
+            separatorText ? (0, import_vue.h)("span", {
+              key: "st"
+            }, separatorText) : (0, import_vue.h)("span", {
+              key: "si",
+              class: getIcon().STEPS_SEPARATOR
+            })
+          ]
+        );
+      };
+      const renderItems = () => {
+        const { type, vertical } = props;
+        const { itemList } = reactData;
+        const isSimple = type === "simple";
+        const list = [];
+        itemList.forEach((item, index) => {
+          list.push(renderItem(item, index));
+          if (isSimple && !vertical && index < itemList.length - 1) {
+            list.push(renderSeparator(index));
+          }
+        });
+        return list;
+      };
+      const renderVN = () => {
+        const { showNumber, vertical, type } = props;
+        const vSize = computeSize.value;
+        const defaultSlot = slots.default;
+        return (0, import_vue.h)(
+          "div",
+          {
+            ref: refElem,
+            class: [
+              "vxe-steps",
+              {
+                [`size--${vSize}`]: vSize,
+                "is--number": showNumber,
+                "is--vertical": vertical,
+                "is--horizontal": !vertical,
+                "is--simple": type === "simple"
+              }
+            ]
+          },
+          [
+            (0, import_vue.h)(
+              "div",
+              {
+                class: "vxe-steps--slots"
+              },
+              defaultSlot ? defaultSlot({}) : []
+            ),
+            (0, import_vue.h)(
+              "div",
+              {
+                class: "vxe-steps--body"
+              },
+              renderItems()
+            )
+          ]
+        );
+      };
+      (0, import_vue.watch)(
+        () => reactData.staticItems,
+        (val) => {
+          loadData(val, false);
+        }
       );
-    };
-    $xeSteps.renderVN = renderVN;
-    return $xeSteps;
-  },
-  render() {
-    return this.renderVN();
-  }
-});
+      const refOptsFlag = (0, import_vue.ref)(0);
+      (0, import_vue.watch)(
+        () => props.options,
+        () => {
+          refOptsFlag.value++;
+        }
+      );
+      (0, import_vue.watch)(
+        () => props.options ? props.options.length : -1,
+        () => {
+          refOptsFlag.value++;
+        }
+      );
+      (0, import_vue.watch)(refOptsFlag, () => {
+        loadData(props.options || [], true);
+      });
+      (0, import_vue.onMounted)(() => {
+        const { staticItems } = reactData;
+        if (staticItems.length) {
+          loadData(staticItems, false);
+        } else {
+          loadData(props.options || [], true);
+        }
+      });
+      (0, import_vue.onBeforeUnmount)(() => {
+        import_xe_utils.default.assign(reactData, createReactData());
+        import_xe_utils.default.assign(internalData, createInternalData());
+      });
+      (0, import_vue.provide)("$xeSteps", $xeSteps);
+      $xeSteps.renderVN = renderVN;
+      return $xeSteps;
+    },
+    render() {
+      return this.renderVN();
+    }
+  })
+);

package/lib/steps/src/util.js

@@ -0,0 +1,74 @@
+"use strict";
+var __create = Object.create;
+var __defProp = Object.defineProperty;
+var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
+var __getOwnPropNames = Object.getOwnPropertyNames;
+var __getProtoOf = Object.getPrototypeOf;
+var __hasOwnProp = Object.prototype.hasOwnProperty;
+var __export = (target, all) => {
+  for (var name in all)
+    __defProp(target, name, { get: all[name], enumerable: true });
+};
+var __copyProps = (to, from, except, desc) => {
+  if (from && typeof from === "object" || typeof from === "function") {
+    for (let key of __getOwnPropNames(from))
+      if (!__hasOwnProp.call(to, key) && key !== except)
+        __defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
+  }
+  return to;
+};
+var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
+  // If the importer is in node compatibility mode or this is not an ESM
+  // file that has been converted to a CommonJS file using a Babel-
+  // compatible transform (i.e. "__esModule" has not been set), then set
+  // "default" to the CommonJS "module.exports" for node compatibility.
+  isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
+  mod
+));
+var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
+var util_exports = {};
+__export(util_exports, {
+  assembleStepItem: () => assembleStepItem,
+  createStepItem: () => createStepItem,
+  destroyStepItem: () => destroyStepItem,
+  isStepItem: () => isStepItem,
+  watchStepItem: () => watchStepItem
+});
+module.exports = __toCommonJS(util_exports);
+var import_vue = require("vue");
+var import_xe_utils = __toESM(require("xe-utils"));
+var import_step_info = require("./step-info");
+function isStepItem(item) {
+  return item instanceof import_step_info.StepItemInfo;
+}
+function createStepItem($xeSteps, _vm) {
+  return isStepItem(_vm) ? _vm : new import_step_info.StepItemInfo($xeSteps, _vm);
+}
+function watchStepItem(props, itemInfo) {
+  Object.keys(props).forEach((name) => {
+    (0, import_vue.watch)(
+      () => props[name],
+      (value) => {
+        itemInfo.update(name, value);
+      }
+    );
+  });
+}
+function assembleStepItem($xeSteps, el, itemInfo) {
+  const reactData = $xeSteps.reactData;
+  const { staticItems } = reactData;
+  const parentElem = el.parentNode;
+  if (parentElem && staticItems) {
+    staticItems.splice(import_xe_utils.default.arrayIndexOf(parentElem.children, el), 0, itemInfo);
+    reactData.staticItems = staticItems.slice(0);
+  }
+}
+function destroyStepItem($xeSteps, itemInfo) {
+  const { reactData } = $xeSteps;
+  const { staticItems } = reactData;
+  const index = import_xe_utils.default.findIndexOf(staticItems, (item) => item.id === itemInfo.id);
+  if (index > -1) {
+    staticItems.splice(index, 1);
+  }
+  reactData.staticItems = staticItems.slice(0);
+}