easy-elplus 1.0.0

package/es/packages/components/ImageUpload/src/ImageUpload.vue.mjs

@@ -0,0 +1,258 @@
+import { ref, computed, watch, resolveComponent, openBlock, createElementBlock, createVNode, normalizeClass, withCtx, unref, createTextVNode, Fragment, createElementVNode, toDisplayString, createCommentVNode } from 'vue';
+import { ElMessage } from 'element-plus';
+import { Plus } from '@element-plus/icons-vue';
+import { isString } from '../../../utils/type.mjs';
+import { UPDATE_MODEL_EVENT } from '../../../constants/event.mjs';
+import './ImageUpload.vue2.mjs';
+import _export_sfc from '../../../../_virtual/_plugin-vue_export-helper.mjs';
+
+const _hoisted_1 = { class: "component-upload-image" };
+const _hoisted_2 = {
+  key: 0,
+  class: "el-upload__tip"
+};
+const _hoisted_3 = { style: {"color":"#f56c6c"} };
+const _hoisted_4 = { style: {"color":"#f56c6c"} };
+const _hoisted_5 = ["src"];
+
+
+const _sfc_main = /*@__PURE__*/Object.assign({ name: "EasyImageUpload" }, {
+  __name: 'ImageUpload',
+  props: {
+  modelValue: [String, Object, Array],
+  limit: { type: Number, default: 5 },
+  fileSize: { type: Number, default: 5 },
+  fileType: { type: Array, default: () => ["png", "jpg", "jpeg"] },
+  isShowTip: { type: Boolean, default: true },
+  action: { type: String, required: true },
+  headers: { type: Object, default: () => ({}) },
+  baseUrl: { type: String, default: "" },
+
+  checkSuccess: {
+    type: Function,
+    default: res => res.code === 200 || res.success === true
+  },
+  // 自定义提取图片地址的路径，支持 "data.url" 这种深层嵌套
+  responsePath: {
+    type: String,
+    default: "data"
+  },
+  // 错误消息提取字段
+  errorField: {
+    type: String,
+    default: "msg"
+  }
+},
+  emits: [UPDATE_MODEL_EVENT],
+  setup(__props, { emit: __emit }) {
+
+
+
+const props = __props;
+
+const emit = __emit;
+
+const number = ref(0);
+const uploadList = ref([]);
+const dialogImageUrl = ref("");
+const dialogVisible = ref(false);
+const fileList = ref([]);
+const imageUploadRef = ref(null);
+
+const showTip = computed(() => props.isShowTip && (props.fileType || props.fileSize));
+
+// 深度解析对象属性 (例如把 res["data.imgUrl"] 转为 res.data.imgUrl)
+const getDeepValue = (obj, path) => {
+  if (!path) return obj
+  return path.split(".").reduce((acc, key) => (acc && acc[key] !== undefined ? acc[key] : undefined), obj)
+};
+
+watch(
+  () => props.modelValue,
+  val => {
+    if (val) {
+      const list = Array.isArray(val) ? val : val.split(",");
+      fileList.value = list.map(item => {
+        if (isString(item)) {
+          let url = item;
+          if (!/^https?:\/\//.test(url) && props.baseUrl) {
+            url = props.baseUrl + item;
+          }
+          item = { name: getFileName(item), url: url };
+        }
+        return item
+      });
+    } else {
+      fileList.value = [];
+    }
+  },
+  { deep: true, immediate: true }
+);
+
+function handleBeforeUpload(file) {
+  let isImg = false;
+  if (props.fileType.length) {
+    const fileExtension = file.name.slice(file.name.lastIndexOf(".") + 1).toLowerCase();
+    isImg = props.fileType.map(t => t.toLowerCase()).includes(fileExtension);
+  } else {
+    isImg = file.type.indexOf("image") > -1;
+  }
+
+  if (!isImg) {
+    ElMessage.error(`格式不正确, 请上传${props.fileType.join("/")}图片!`);
+    return false
+  }
+  if (props.fileSize && file.size / 1024 / 1024 > props.fileSize) {
+    ElMessage.error(`大小不能超过 ${props.fileSize} MB!`);
+    return false
+  }
+  number.value++;
+  return true
+}
+
+function handleExceed() {
+  ElMessage.error(`上传数量不能超过 ${props.limit} 个!`);
+}
+
+// 修改后的核心逻辑
+function handleUploadSuccess(res, file) {
+  // 1. 使用传入的校验函数
+  if (props.checkSuccess(res)) {
+    // 2. 动态提取 URL
+    const url = getDeepValue(res, props.responsePath);
+
+    if (url) {
+      uploadList.value.push({ name: getFileName(url), url: url });
+      uploadedSuccessfully();
+    } else {
+      handleUploadError(`无法从响应中解析图片路径: ${props.responsePath}`);
+    }
+  } else {
+    number.value--;
+    const errorMsg = getDeepValue(res, props.errorField) || "上传失败";
+    ElMessage.error(errorMsg);
+    imageUploadRef.value.handleRemove(file);
+    uploadedSuccessfully();
+  }
+}
+
+function handleRemove(file) {
+  const findex = fileList.value.findIndex(f => f.name === file.name);
+  if (findex > -1) {
+    fileList.value.splice(findex, 1);
+    emit(UPDATE_MODEL_EVENT, listToString(fileList.value));
+  }
+}
+
+function uploadedSuccessfully() {
+  if (number.value > 0 && uploadList.value.length === number.value) {
+    fileList.value = fileList.value.filter(f => f.url !== undefined).concat(uploadList.value);
+    uploadList.value = [];
+    number.value = 0;
+    emit(UPDATE_MODEL_EVENT, listToString(fileList.value));
+  }
+}
+
+function handleUploadError(msg) {
+  ElMessage.error(isString(msg) ? msg : "上传图片失败");
+  number.value--;
+}
+
+function handlePictureCardPreview(file) {
+  dialogImageUrl.value = file.url;
+  dialogVisible.value = true;
+}
+
+function getFileName(name) {
+  if (!isString(name)) return ""
+  return name.slice(name.lastIndexOf("/") + 1)
+}
+
+function listToString(list, separator = ",") {
+  return list
+    .filter(item => item.url && item.url.indexOf("blob:") !== 0)
+    .map(item => {
+      let url = item.url;
+      if (props.baseUrl && url.indexOf(props.baseUrl) === 0) {
+        url = url.replace(props.baseUrl, "");
+      }
+      return url
+    })
+    .join(separator)
+}
+
+return (_ctx, _cache) => {
+  const _component_el_icon = resolveComponent("el-icon");
+  const _component_el_upload = resolveComponent("el-upload");
+  const _component_el_dialog = resolveComponent("el-dialog");
+
+  return (openBlock(), createElementBlock("div", _hoisted_1, [
+    createVNode(_component_el_upload, {
+      ref_key: "imageUploadRef",
+      ref: imageUploadRef,
+      multiple: "",
+      action: __props.action,
+      "list-type": "picture-card",
+      "on-success": handleUploadSuccess,
+      "before-upload": handleBeforeUpload,
+      limit: __props.limit,
+      "on-error": handleUploadError,
+      "on-exceed": handleExceed,
+      "on-remove": handleRemove,
+      "show-file-list": true,
+      headers: __props.headers,
+      "file-list": fileList.value,
+      "on-preview": handlePictureCardPreview,
+      class: normalizeClass({ hide: fileList.value.length >= __props.limit })
+    }, {
+      default: withCtx(() => [
+        createVNode(_component_el_icon, { class: "avatar-uploader-icon" }, {
+          default: withCtx(() => [
+            createVNode(unref(Plus))
+          ]),
+          _: 1 /* STABLE */
+        })
+      ]),
+      _: 1 /* STABLE */
+    }, 8 /* PROPS */, ["action", "limit", "headers", "file-list", "class"]),
+    (showTip.value)
+      ? (openBlock(), createElementBlock("div", _hoisted_2, [
+          _cache[3] || (_cache[3] = createTextVNode(" 请上传 ", -1 /* CACHED */)),
+          (__props.fileSize)
+            ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
+                _cache[1] || (_cache[1] = createTextVNode(" 大小不超过 ", -1 /* CACHED */)),
+                createElementVNode("b", _hoisted_3, toDisplayString(__props.fileSize) + "MB", 1 /* TEXT */)
+              ], 64 /* STABLE_FRAGMENT */))
+            : createCommentVNode("v-if", true),
+          (__props.fileType)
+            ? (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+                _cache[2] || (_cache[2] = createTextVNode(" 格式为 ", -1 /* CACHED */)),
+                createElementVNode("b", _hoisted_4, toDisplayString(__props.fileType.join("/")), 1 /* TEXT */)
+              ], 64 /* STABLE_FRAGMENT */))
+            : createCommentVNode("v-if", true),
+          _cache[4] || (_cache[4] = createTextVNode(" 的文件 ", -1 /* CACHED */))
+        ]))
+      : createCommentVNode("v-if", true),
+    createVNode(_component_el_dialog, {
+      modelValue: dialogVisible.value,
+      "onUpdate:modelValue": _cache[0] || (_cache[0] = $event => ((dialogVisible).value = $event)),
+      title: "预览",
+      width: "800px",
+      "append-to-body": ""
+    }, {
+      default: withCtx(() => [
+        createElementVNode("img", {
+          src: dialogImageUrl.value,
+          style: {"display":"block","max-width":"100%","margin":"0 auto"}
+        }, null, 8 /* PROPS */, _hoisted_5)
+      ]),
+      _: 1 /* STABLE */
+    }, 8 /* PROPS */, ["modelValue"])
+  ]))
+}
+}
+
+});
+var ImageUpload = /*#__PURE__*/_export_sfc(_sfc_main, [['__scopeId',"data-v-9ac7dd1b"]]);
+
+export { ImageUpload as default };

package/es/packages/components/ImageUpload/src/ImageUpload.vue2.mjs

@@ -0,0 +1,4 @@
+import styleInject from '../../../../node_modules/.pnpm/style-inject@0.3.0/node_modules/style-inject/dist/style-inject.es.mjs';
+
+var css_248z = "\n/* 保持原有样式 */\n.component-upload-image[data-v-9ac7dd1b] .el-upload--picture-card {\n  width: 100px;\n  height: 100px;\n  line-height: 110px;\n}\n.component-upload-image[data-v-9ac7dd1b] .el-upload-list--picture-card .el-upload-list__item {\n  width: 100px;\n  height: 100px;\n}\n.component-upload-image[data-v-9ac7dd1b] .hide .el-upload--picture-card {\n  display: none;\n}\n";
+styleInject(css_248z);

package/es/packages/components/button/index.mjs

@@ -0,0 +1,10 @@
+import { withInstall } from '../../utils/vue/install.mjs';
+import _sfc_main from './src/button.vue.mjs';
+
+// 用来整合组件的，最终实现导出组件
+
+
+// 通过 withInstall 方法给 button 添加了一个 Vue3 插件所需的 install 方法
+const EasyButton = withInstall(_sfc_main);
+
+export { EasyButton, EasyButton as default };

package/es/packages/components/button/src/button.vue.mjs

@@ -0,0 +1,42 @@
+import { ref, useAttrs, openBlock, createBlock, unref, mergeProps, withCtx, renderSlot } from 'vue';
+import { ElButton } from 'element-plus';
+import { isFunction } from '../../../../node_modules/.pnpm/@vue_shared@3.5.27/node_modules/@vue/shared/dist/shared.esm-bundler.mjs';
+import omit from '../../../../node_modules/.pnpm/lodash-es@4.17.23/node_modules/lodash-es/omit.mjs';
+
+const _sfc_main = /*@__PURE__*/Object.assign({
+  inheritAttrs: false,
+  name: "EasyButton"
+}, {
+  __name: 'button',
+  setup(__props) {
+
+
+
+const loading = ref(false);
+
+const attrs = useAttrs();
+const onClick = async () => {
+  try {
+    loading.value = true;
+
+    if (isFunction(attrs.onClick)) {
+      await attrs.onClick();
+    }
+  } finally {
+    loading.value = false;
+  }
+};
+
+return (_ctx, _cache) => {
+  return (openBlock(), createBlock(unref(ElButton), mergeProps({ loading: loading.value }, unref(omit)(unref(attrs), 'onClick'), { onClick: onClick }), {
+    default: withCtx(() => [
+      renderSlot(_ctx.$slots, "default")
+    ]),
+    _: 3 /* FORWARDED */
+  }, 16 /* FULL_PROPS */, ["loading"]))
+}
+}
+
+});
+
+export { _sfc_main as default };

package/es/packages/components/descriptions/index.mjs

@@ -0,0 +1,10 @@
+import { withInstall } from '../../utils/vue/install.mjs';
+import _sfc_main from './src/descriptions.vue.mjs';
+
+// 用来整合组件的，最终实现导出组件
+
+
+// 通过 withInstall 方法给 button 添加了一个 Vue3 插件所需的 install 方法
+const EasyDescriptions = withInstall(_sfc_main);
+
+export { EasyDescriptions, EasyDescriptions as default };

package/es/packages/components/descriptions/src/comp.vue.mjs

@@ -0,0 +1,51 @@
+import { useModel, renderSlot, openBlock, createBlock, resolveDynamicComponent, unref, mergeProps, normalizeProps, mergeModels } from 'vue';
+import { useDynamicComponent } from '../../../hooks/src/useDynamicComponent.mjs';
+
+const _sfc_main = /*@__PURE__*/Object.assign({
+  name: "EasyDescriptionsComp"
+}, {
+  __name: 'comp',
+  props: /*@__PURE__*/mergeModels({
+  id: {
+    type: String,
+    default: ""
+  },
+  components: {
+    type: [String, Number, Function, Object],
+    default: ""
+  },
+  props: {
+    type: Object,
+    default: () => ({})
+  }
+}, {
+    "modelValue": {},
+    "modelModifiers": {},
+  }),
+  emits: ["update:modelValue"],
+  setup(__props) {
+
+
+
+
+
+const descriptionsData = useModel(__props, "modelValue");
+
+const { getComponent } = useDynamicComponent();
+
+return (_ctx, _cache) => {
+  return renderSlot(_ctx.$slots, __props.components, {}, () => [
+    (__props.id)
+      ? (openBlock(), createBlock(resolveDynamicComponent(unref(getComponent)(__props.components, descriptionsData.value)), mergeProps({
+          key: 0,
+          modelValue: descriptionsData.value[__props.id],
+          "onUpdate:modelValue": _cache[0] || (_cache[0] = $event => ((descriptionsData.value[__props.id]) = $event))
+        }, __props.props), null, 16 /* FULL_PROPS */, ["modelValue"]))
+      : (openBlock(), createBlock(resolveDynamicComponent(unref(getComponent)(__props.components)), normalizeProps(mergeProps({ key: 1 }, __props.props)), null, 16 /* FULL_PROPS */))
+  ])
+}
+}
+
+});
+
+export { _sfc_main as default };

package/es/packages/components/descriptions/src/descriptions.vue.mjs

@@ -0,0 +1,178 @@
+import { useModel, computed, openBlock, createElementBlock, Fragment, renderList, createBlock, unref, mergeProps, createSlots, withCtx, resolveDynamicComponent, h, createTextVNode, toDisplayString, renderSlot, mergeModels } from 'vue';
+import { ElDescriptions, ElDescriptionsItem } from 'element-plus';
+import { isFunction, isObject } from '../../../../node_modules/.pnpm/@vue_shared@3.5.27/node_modules/@vue/shared/dist/shared.esm-bundler.mjs';
+import _sfc_main$1 from './comp.vue.mjs';
+
+const _hoisted_1 = { class: "epl-descriptions" };
+
+
+const _sfc_main = /*@__PURE__*/Object.assign({
+  name: "EasyDescriptions"
+}, {
+  __name: 'descriptions',
+  props: /*@__PURE__*/mergeModels({
+  items: {
+    type: Array,
+    default: () => []
+  }
+}, {
+    "modelValue": {},
+    "modelModifiers": {},
+  }),
+  emits: ["update:modelValue"],
+  setup(__props, { expose: __expose }) {
+
+
+
+const props = __props;
+
+const descriptionsData = useModel(__props, "modelValue");
+
+// 内部处理单个列表的函数
+const normalizeItems = list => {
+  return list.reduce((prev, item) => {
+    const isHidden = isFunction(item.hidden) ? item.hidden(descriptionsData.value) : item.hidden;
+
+    if (isHidden) return prev
+
+    prev.push({
+      ...item,
+      label: isObject(item.label)
+        ? item.label
+        : {
+            components: item.label
+          },
+      value: isObject(item.value)
+        ? item.value
+        : {
+            id: item.value,
+            components: item.value
+          }
+    });
+
+    return prev
+  }, [])
+};
+
+const renderList$1 = computed(() => {
+  if (!props.items || props.items.length === 0) return []
+
+  // 判断是否为分组模式：第一项包含 items 字段且是一个数组
+  // 为了兼容性更好，这里假设如果 item 内部有 items 属性，则认为是分组
+  const isGroup = props.items.some(item => item.items && Array.isArray(item.items));
+
+  if (isGroup) {
+    // 分组模式
+    return props.items
+      .filter(group => {
+        const isHidden = isFunction(group.hidden) ? group.hidden(descriptionsData.value) : group.hidden;
+        return !isHidden
+      })
+      .map(group => {
+        // 分离出内部使用的属性，其他的属性放入 bindProps 透传给 el-descriptions
+        // eslint-disable-next-line no-unused-vars
+        const { extra, items, hidden, ...rest } = group;
+        return {
+          ...group,
+          rows: normalizeItems(group.items),
+          bindProps: rest
+        }
+      })
+  } else {
+    // 单组模式：包装成一个默认分组
+    return [
+      {
+        rows: normalizeItems(props.items),
+        bindProps: {}
+      }
+    ]
+  }
+});
+
+__expose({});
+
+return (_ctx, _cache) => {
+  return (openBlock(), createElementBlock("div", _hoisted_1, [
+    (openBlock(true), createElementBlock(Fragment, null, renderList(renderList$1.value, (group, index) => {
+      return (openBlock(), createBlock(unref(ElDescriptions), mergeProps({
+        key: index,
+        ref_for: true
+      }, { ..._ctx.$attrs, ...group.bindProps }, { style: {"margin-bottom":"20px"} }), createSlots({
+        default: withCtx(() => [
+          (openBlock(true), createElementBlock(Fragment, null, renderList(group.rows, (item) => {
+            return (openBlock(), createBlock(unref(ElDescriptionsItem), mergeProps({
+              key: item.label
+            }, { ref_for: true }, item), {
+              label: withCtx(() => [
+                (openBlock(), createBlock(resolveDynamicComponent(
+                h(
+                  _sfc_main$1,
+                  {
+                    modelValue: descriptionsData.value,
+                    ...item.label
+                  },
+                  _ctx.$slots
+                )
+              )))
+              ]),
+              default: withCtx(() => [
+                (openBlock(), createBlock(resolveDynamicComponent(
+                h(
+                  _sfc_main$1,
+                  {
+                    modelValue: descriptionsData.value,
+                    ...item.value
+                  },
+                  _ctx.$slots
+                )
+              )))
+              ]),
+              _: 2 /* DYNAMIC */
+            }, 1040 /* FULL_PROPS, DYNAMIC_SLOTS */))
+          }), 128 /* KEYED_FRAGMENT */))
+        ]),
+        _: 2 /* DYNAMIC */
+      }, [
+        (group.title || _ctx.$slots.title)
+          ? {
+              name: "title",
+              fn: withCtx(() => [
+                (group.title)
+                  ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
+                      createTextVNode(toDisplayString(group.title), 1 /* TEXT */)
+                    ], 64 /* STABLE_FRAGMENT */))
+                  : renderSlot(_ctx.$slots, "title", {
+                      key: 1,
+                      group: group,
+                      index: index
+                    })
+              ]),
+              key: "0"
+            }
+          : undefined,
+        (group.extra || _ctx.$slots.extra)
+          ? {
+              name: "extra",
+              fn: withCtx(() => [
+                (group.extra)
+                  ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
+                      createTextVNode(toDisplayString(group.extra), 1 /* TEXT */)
+                    ], 64 /* STABLE_FRAGMENT */))
+                  : renderSlot(_ctx.$slots, "extra", {
+                      key: 1,
+                      group: group,
+                      index: index
+                    })
+              ]),
+              key: "1"
+            }
+          : undefined
+      ]), 1040 /* FULL_PROPS, DYNAMIC_SLOTS */))
+    }), 128 /* KEYED_FRAGMENT */))
+  ]))
+}
+}
+
+});
+
+export { _sfc_main as default };

package/es/packages/components/dialog/index.mjs

@@ -0,0 +1,11 @@
+import { useDialog } from './src/useDialog.mjs';
+
+// Dialog 是一个命令式 API（函数式调用），而非 Vue 组件
+// 用法: const dialog = useDialog(component, props, options)
+// 或者: import { EasyDialog } from "@easy-elplus"; EasyDialog(...)
+
+
+// 导出命名函数，保持与其他组件命名一致性
+const EasyDialog = useDialog;
+
+export { EasyDialog, useDialog };

package/es/packages/components/dialog/src/appContext.mjs

@@ -0,0 +1,25 @@
+/**
+ * 全局应用上下文管理
+ * 用于在非组件上下文中访问主应用的配置、插件和全局组件
+ */
+
+let globalAppContext = null;
+
+/**
+ * 设置全局应用上下文
+ * 应该在主应用初始化时调用（通常在 app.use() 中）
+ * @param {AppContext} context - Vue 应用上下文
+ */
+function setGlobalAppContext(context) {
+  globalAppContext = context;
+}
+
+/**
+ * 获取全局应用上下文
+ * @returns {AppContext | null}
+ */
+function getGlobalAppContext() {
+  return globalAppContext
+}
+
+export { getGlobalAppContext, setGlobalAppContext };