vue-admin-core/lib/formily/array-base/src/index.js

A Component Library for Vue 3

'use strict';

var vue = require('vue');
var vue$1 = require('@formily/vue');
var shared = require('@formily/shared');
var elementPlus = require('element-plus');
var iconsVue = require('@element-plus/icons-vue');
var index = require('../../__builtins__/configs/index.js');
require('../../__builtins__/shared/index.js');
var index$1 = require('element-plus/es/utils/index');
var lodashEs = require('lodash-es');
var resolveComponent = require('../../__builtins__/shared/resolve-component.js');
var utils = require('../../__builtins__/shared/utils.js');

const ArrayBaseSymbol = Symbol("ArrayBaseContext");
const ItemSymbol = Symbol("ItemContext");
const useArray = () => {
  return vue.inject(ArrayBaseSymbol, null);
};
const useIndex = (index) => {
  const { index: indexRef } = vue.toRefs(vue.inject(ItemSymbol));
  return indexRef != null ? indexRef : vue.ref(index);
};
const useRecord = (record) => {
  var _a;
  const { record: recordRef } = vue.toRefs(vue.inject(ItemSymbol));
  return (_a = recordRef.value) != null ? _a : vue.ref(record);
};
const useItemScope = () => {
  return vue.toRef(vue.inject(ItemSymbol));
};
const isObjectValue = (schema) => {
  var _a, _b;
  if (Array.isArray(schema == null ? void 0 : schema.items))
    return isObjectValue(schema.items[0]);
  if (((_a = schema == null ? void 0 : schema.items) == null ? void 0 : _a.type) === "array" || ((_b = schema == null ? void 0 : schema.items) == null ? void 0 : _b.type) === "object") {
    return true;
  }
  return false;
};
const useKey = (schema) => {
  const isObject = isObjectValue(schema);
  let keyMap = null;
  if (isObject) {
    keyMap = /* @__PURE__ */ new WeakMap();
  } else {
    keyMap = [];
  }
  vue.onBeforeUnmount(() => {
    keyMap = null;
  });
  return {
    keyMap,
    getKey: (record, index) => {
      if (keyMap instanceof WeakMap) {
        if (!keyMap.has(record)) {
          keyMap.set(record, shared.uid());
        }
        return `${keyMap.get(record)}-${index}`;
      }
      if (keyMap && !keyMap[index]) {
        keyMap[index] = shared.uid();
      }
      return keyMap ? `${keyMap[index]}-${index}` : void 0;
    }
  };
};
const getDefaultValue = (defaultValue, schema) => {
  var _a, _b, _c, _d, _e, _f, _g;
  if (shared.isValid(defaultValue))
    return shared.clone(defaultValue);
  if (Array.isArray(schema == null ? void 0 : schema.items))
    return getDefaultValue(defaultValue, schema.items[0]);
  if (((_a = schema == null ? void 0 : schema.items) == null ? void 0 : _a.type) === "array")
    return [];
  if (((_b = schema == null ? void 0 : schema.items) == null ? void 0 : _b.type) === "boolean")
    return true;
  if (((_c = schema == null ? void 0 : schema.items) == null ? void 0 : _c.type) === "date")
    return "";
  if (((_d = schema == null ? void 0 : schema.items) == null ? void 0 : _d.type) === "datetime")
    return "";
  if (((_e = schema == null ? void 0 : schema.items) == null ? void 0 : _e.type) === "number")
    return 0;
  if (((_f = schema == null ? void 0 : schema.items) == null ? void 0 : _f.type) === "object")
    return {};
  if (((_g = schema == null ? void 0 : schema.items) == null ? void 0 : _g.type) === "string")
    return "";
  return null;
};
const ArrayBaseInner = vue.defineComponent({
  name: "ArrayBase",
  props: {
    disabled: {
      type: Boolean,
      default: false
    },
    keyMap: {
      type: [WeakMap, Array]
    }
  },
  setup(props, { slots, attrs }) {
    const field = vue$1.useField();
    const schema = vue$1.useFieldSchema();
    vue.provide(ArrayBaseSymbol, {
      field,
      schema,
      props,
      attrs,
      keyMap: props.keyMap
    });
    return () => {
      return vue.h(vue$1.FragmentComponent, {}, slots);
    };
  }
});
const ArrayBaseButton = vue.defineComponent({
  name: "ArrayBaseButton",
  props: {
    ...elementPlus.ElButton.props,
    popconfirmProps: {
      type: Object
    },
    messageBoxOptions: {
      type: Object
    },
    title: {
      type: String
    },
    link: {
      type: Boolean,
      default: true
    },
    size: {
      type: String,
      default: "small"
    },
    onClick: {
      type: Function
    }
  },
  emits: ["click"],
  setup(props, { attrs }) {
    const scope = useItemScope();
    const field = vue$1.useField();
    const base = useArray();
    const schema = vue$1.useFieldSchema();
    const buttonProps = lodashEs.omit(props, ["popconfirmProps", "messageBoxOptions"]);
    const popconfirmProps2 = vue.computed(() => props.popconfirmProps);
    const messageBoxOptions = vue.computed(() => props.messageBoxOptions);
    const loading = vue.ref(false);
    return () => {
      if ((base == null ? void 0 : base.field.value.pattern) !== "editable")
        return null;
      const ButtonNode = vue.h(
        elementPlus.ElButton,
        {
          ...buttonProps,
          ...attrs,
          type: buttonProps.type || "primary",
          loading: loading.value,
          onClick: async (e) => {
            e.stopPropagation();
            if (messageBoxOptions.value) {
              elementPlus.ElMessageBox.confirm("", {
                type: "warning",
                ...messageBoxOptions.value
              }).then(async () => {
                var _a, _b;
                loading.value = true;
                await ((_b = (_a = messageBoxOptions.value) == null ? void 0 : _a.onConfirm) == null ? void 0 : _b.call(_a, e, scope.value));
                loading.value = false;
              }).catch(async (action) => {
                var _a, _b;
                loading.value = true;
                await ((_b = (_a = messageBoxOptions.value) == null ? void 0 : _a.onCancel) == null ? void 0 : _b.call(_a, e, scope.value, action));
                loading.value = false;
              });
            } else {
              if (typeof props.onClick === "function") {
                loading.value = true;
                await props.onClick(e, scope.value);
                loading.value = false;
              }
            }
          }
        },
        {
          default: () => {
            var _a, _b;
            return [
              resolveComponent.resolveComponent((_b = (_a = schema.value)["x-render"]) == null ? void 0 : _b.call(_a, scope.value)) || field.value.title || props.title
            ];
          }
        }
      );
      if (popconfirmProps2.value) {
        return vue.h(
          elementPlus.ElPopconfirm,
          {
            ...popconfirmProps2.value,
            onCancel: async (e) => {
              var _a, _b;
              loading.value = true;
              await ((_b = (_a = popconfirmProps2.value) == null ? void 0 : _a.onCancel) == null ? void 0 : _b.call(_a, e, scope.value));
              loading.value = false;
            },
            onConfirm: async (e) => {
              var _a, _b;
              loading.value = true;
              (_b = (_a = popconfirmProps2.value) == null ? void 0 : _a.onConfirm) == null ? void 0 : _b.call(_a, e, scope.value);
              loading.value = false;
            }
          },
          {
            reference: () => ButtonNode
          }
        );
      }
      return ButtonNode;
    };
  }
});
const ArrayBaseItem = vue.defineComponent({
  name: "ArrayBaseItem",
  props: ["index", "record"],
  setup(props, { slots }) {
    vue.provide(ItemSymbol, props);
    return () => {
      return vue.h(vue$1.FragmentComponent, {}, slots);
    };
  }
});
const ArrayBaseSortHandle = vue.defineComponent({
  name: "ArrayBaseSortHandle",
  props: ["index"],
  setup(props, { attrs }) {
    const array = useArray();
    const prefixCls = `${index.stylePrefix}-array-base`;
    return () => {
      var _a;
      if (!array)
        return null;
      if (((_a = array.field.value) == null ? void 0 : _a.pattern) !== "editable")
        return null;
      return vue.h(
        elementPlus.ElButton,
        {
          directives: [{ name: "handle" }],
          size: "small",
          type: "primary",
          text: true,
          icon: iconsVue.Rank,
          ...attrs,
          class: [`${prefixCls}-sort-handle`].concat(attrs.class)
        },
        {}
      );
    };
  }
});
const ArrayBaseIndex = vue.defineComponent({
  name: "ArrayBaseIndex",
  setup(props, { attrs }) {
    const index$1 = useIndex();
    const prefixCls = `${index.stylePrefix}-array-base`;
    return () => {
      const { class: className, ...other } = attrs;
      return vue.h(
        "span",
        {
          class: [`${prefixCls}-index`, className],
          ...other
        },
        {
          default: () => [`${index$1.value + 1}`]
        }
      );
    };
  }
});
const ArrayBaseAddition = vue.defineComponent({
  name: "ArrayBaseAddition",
  props: ["method", "defaultValue", "title"],
  setup(props, { attrs }) {
    const self = vue$1.useField();
    const array = useArray();
    const prefixCls = `${index.stylePrefix}-array-base`;
    return () => {
      if (!array)
        return null;
      if ((array == null ? void 0 : array.field.value.pattern) !== "editable")
        return null;
      const { class: className, ...other } = attrs;
      return vue.h(
        elementPlus.ElButton,
        {
          class: [`${prefixCls}-addition`, className],
          icon: iconsVue.Plus,
          ...other,
          ...props,
          onClick: (e) => {
            var _a, _b, _c, _d, _e, _f, _g, _h, _i, _j;
            if ((_a = array.props) == null ? void 0 : _a.disabled)
              return;
            const defaultValue = getDefaultValue(props.defaultValue, array == null ? void 0 : array.schema.value);
            if (props.method === "unshift") {
              (_b = array == null ? void 0 : array.field) == null ? void 0 : _b.value.unshift(defaultValue);
              (_d = (_c = array.attrs) == null ? void 0 : _c.add) == null ? void 0 : _d.call(_c, 0);
            } else {
              (_e = array == null ? void 0 : array.field) == null ? void 0 : _e.value.push(defaultValue);
              (_j = (_f = array.attrs) == null ? void 0 : _f.add) == null ? void 0 : _j.call(_f, ((_i = (_h = (_g = array == null ? void 0 : array.field) == null ? void 0 : _g.value) == null ? void 0 : _h.value) == null ? void 0 : _i.length) - 1);
            }
            if (typeof attrs.onClick === "function") {
              attrs.onClick(e);
            }
          }
        },
        {
          default: () => [self.value.title || props.title]
        }
      );
    };
  }
});
const ArrayBaseRemove = vue.defineComponent({
  name: "ArrayBaseRemove",
  props: {
    ...ArrayBaseButton.props,
    index: {
      type: Number
    },
    onClick: {
      type: Function
    }
  },
  setup(props, { attrs }) {
    const indexRef = useIndex(props.index);
    const self = vue$1.useField();
    const base = useArray();
    const prefixCls = `${index.stylePrefix}-array-base`;
    const remove = async (e) => {
      var _a, _b;
      e.stopPropagation();
      if (typeof props.onClick === "function") {
        const fn = await props.onClick(e);
        if (index$1.isPromise(fn)) {
          await fn;
        }
      }
      base == null ? void 0 : base.field.value.remove(indexRef.value);
      (_b = (_a = base == null ? void 0 : base.attrs) == null ? void 0 : _a.remove) == null ? void 0 : _b.call(_a, indexRef.value);
    };
    const popconfirmProps2 = {
      title: "\u662F\u5426\u8BE5\u5220\u9664\u6570\u636E",
      ...props.popconfirmProps,
      onConfirm: async (...args) => {
        var _a, _b, _c, _d;
        await ((_b = (_a = props.popconfirmProps) == null ? void 0 : _a.onConfirm) == null ? void 0 : _b.call(_a, ...args));
        base == null ? void 0 : base.field.value.remove(indexRef.value);
        (_d = (_c = base == null ? void 0 : base.attrs) == null ? void 0 : _c.remove) == null ? void 0 : _d.call(_c, indexRef.value);
      }
    };
    const messageBoxOptions = {
      message: "\u662F\u5426\u8BE5\u5220\u9664\u6570\u636E",
      ...props.messageBoxOptions,
      onConfirm: async (...args) => {
        var _a, _b, _c, _d;
        await ((_b = (_a = props.messageBoxOptions) == null ? void 0 : _a.onConfirm) == null ? void 0 : _b.call(_a, ...args));
        base == null ? void 0 : base.field.value.remove(indexRef.value);
        (_d = (_c = base == null ? void 0 : base.attrs) == null ? void 0 : _c.remove) == null ? void 0 : _d.call(_c, indexRef.value);
      }
    };
    return () => {
      if ((base == null ? void 0 : base.field.value.pattern) !== "editable")
        return null;
      const { class: className, ...other } = attrs;
      return vue.h(
        ArrayBaseButton,
        {
          class: [`${prefixCls}-remove`, className],
          link: true,
          size: "small",
          icon: iconsVue.Delete,
          ...props,
          ...other,
          type: props.type ? props.type : "danger",
          onClick: props.popconfirmProps || props.messageBoxOptions ? () => {
          } : remove,
          popconfirmProps: props.popconfirmProps ? popconfirmProps2 : null,
          messageBoxOptions: props.messageBoxOptions ? messageBoxOptions : null
        },
        {
          default: () => [self.value.title || props.title]
        }
      );
    };
  }
});
const ArrayBaseMoveDown = vue.defineComponent({
  name: "ArrayBaseMoveDown",
  props: ["index", "title"],
  setup(props, { attrs }) {
    const indexRef = useIndex(props.index);
    const self = vue$1.useField();
    const base = useArray();
    const prefixCls = `${index.stylePrefix}-array-base`;
    return () => {
      if ((base == null ? void 0 : base.field.value.pattern) !== "editable")
        return null;
      const { class: className, ...other } = attrs;
      return vue.h(
        elementPlus.ElButton,
        {
          class: [`${prefixCls}-move-down`, className],
          size: "small",
          type: "primary",
          link: true,
          icon: iconsVue.ArrowDown,
          ...other,
          onClick: async (e) => {
            var _a, _b;
            e.stopPropagation();
            if (typeof attrs.onClick === "function") {
              const fn = attrs.onClick(e);
              if (index$1.isPromise(fn)) {
                await fn;
              }
            }
            if (Array.isArray(base == null ? void 0 : base.keyMap)) {
              base.keyMap.splice(indexRef.value + 1, 0, base.keyMap.splice(indexRef.value, 1)[0]);
            }
            base == null ? void 0 : base.field.value.moveDown(indexRef.value);
            (_b = (_a = base == null ? void 0 : base.attrs) == null ? void 0 : _a.moveDown) == null ? void 0 : _b.call(_a, indexRef.value);
          }
        },
        {
          default: () => [self.value.title || props.title]
        }
      );
    };
  }
});
const ArrayBaseMoveUp = vue.defineComponent({
  name: "ArrayBaseMoveUp",
  props: ["index", "title"],
  setup(props, { attrs }) {
    const indexRef = useIndex(props.index);
    const self = vue$1.useField();
    const base = useArray();
    const prefixCls = `${index.stylePrefix}-array-base`;
    return () => {
      if ((base == null ? void 0 : base.field.value.pattern) !== "editable")
        return null;
      const { class: className, ...other } = attrs;
      return vue.h(
        elementPlus.ElButton,
        {
          class: [`${prefixCls}-move-up`, className],
          size: "small",
          type: "primary",
          link: true,
          icon: iconsVue.ArrowUp,
          ...other,
          onClick: async (e) => {
            var _a, _b;
            e.stopPropagation();
            if (typeof attrs.onClick === "function") {
              const fn = attrs.onClick(e);
              if (index$1.isPromise(fn)) {
                await fn;
              }
            }
            if (Array.isArray(base == null ? void 0 : base.keyMap)) {
              base.keyMap.splice(indexRef.value - 1, 0, base.keyMap.splice(indexRef.value, 1)[0]);
            }
            base == null ? void 0 : base.field.value.moveUp(indexRef.value);
            (_b = (_a = base == null ? void 0 : base.attrs) == null ? void 0 : _a.moveUp) == null ? void 0 : _b.call(_a, indexRef.value);
          }
        },
        {
          default: () => [self.value.title || props.title]
        }
      );
    };
  }
});
const ArrayBaseButtonGroup = vue.defineComponent({
  name: "ArrayBaseButtonGroup",
  inheritAttrs: false,
  props: ["index"],
  setup(props) {
    const indexRef = useIndex(props.index);
    const record = useRecord();
    const schema = vue$1.useFieldSchema();
    const base = useArray();
    return () => {
      if ((base == null ? void 0 : base.field.value.pattern) !== "editable")
        return null;
      return vue.h(
        vue$1.FragmentComponent,
        {},
        {
          default: () => {
            var _a, _b;
            return resolveComponent.resolveComponent((_b = (_a = schema.value)["x-render"]) == null ? void 0 : _b.call(_a, { row: record, $index: indexRef.value }));
          }
        }
      );
    };
  }
});
const ArrayBase = utils.composeExport(ArrayBaseInner, {
  Index: ArrayBaseIndex,
  Item: ArrayBaseItem,
  SortHandle: ArrayBaseSortHandle,
  Addition: ArrayBaseAddition,
  Remove: ArrayBaseRemove,
  MoveDown: ArrayBaseMoveDown,
  MoveUp: ArrayBaseMoveUp,
  Button: ArrayBaseButton,
  ButtonGroup: ArrayBaseButtonGroup,
  useArray,
  useIndex,
  useKey,
  useRecord
});

exports.ArrayBase = ArrayBase;
//# sourceMappingURL=index.js.map