yuang-framework-ui-pc 1.1.44 → 1.1.45

package/lib/ele-file-list/components/file-grid.cjs

@@ -0,0 +1,134 @@
+"use strict";
+const vue = require("vue");
+const ReceiverView = require("../../ele-config-provider/components/receiver-view");
+const FileGridItem = require("./file-grid-item");
+const _sfc_main = vue.defineComponent({
+  name: "FileGrid",
+  components: { ReceiverView, FileGridItem },
+  props: {
+    /** 文件数据 */
+    data: Array,
+    /** 后缀对应的图标 */
+    icons: Array,
+    /** 选择框类型 */
+    selectionType: String,
+    /** 已选中的数据 */
+    selections: Array,
+    /** 单选选中数据 */
+    current: Object,
+    /** 是否是全选 */
+    isCheckAll: Boolean,
+    /** 是否是半选 */
+    isIndeterminate: Boolean,
+    /** 全选按钮文字 */
+    checkAllText: String,
+    /** 选中后的文字 */
+    selectedText: String,
+    /** 文件右键菜单是否打开 */
+    ctxMenuDropdownVisible: Boolean,
+    /** 当前打开的右键菜单对应的文件数据 */
+    contextMenuFileItem: Object
+  },
+  emits: {
+    checkAllChange: () => true,
+    itemClick: (_item) => true,
+    itemCheckChange: (_item) => true,
+    itemContextOpen: (_option) => true
+  },
+  setup(props, { emit }) {
+    const headerText = vue.computed(() => {
+      if (!props.selections || !props.selections.length) {
+        return props.checkAllText;
+      }
+      if (!props.selectedText) {
+        return "";
+      }
+      return props.selectedText.replace(
+        /\{\s*total\s*\}/g,
+        String(props.selections.length)
+      );
+    });
+    const handleCheckAllChange = () => {
+      emit("checkAllChange");
+    };
+    const handleItemClick = (item) => {
+      emit("itemClick", item);
+    };
+    const handleItemCheckChange = (item) => {
+      emit("itemCheckChange", item);
+    };
+    const handleItemContextOpen = (option) => {
+      emit("itemContextOpen", option);
+    };
+    return {
+      headerText,
+      handleCheckAllChange,
+      handleItemClick,
+      handleItemCheckChange,
+      handleItemContextOpen
+    };
+  }
+});
+const _export_sfc = (sfc, props) => {
+  const target = sfc.__vccOpts || sfc;
+  for (const [key, val] of props) {
+    target[key] = val;
+  }
+  return target;
+};
+const _hoisted_1 = {
+  key: 0,
+  class: "ele-file-list-header"
+};
+const _hoisted_2 = { class: "ele-file-list-body" };
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_FileGridItem = vue.resolveComponent("FileGridItem");
+  const _component_ReceiverView = vue.resolveComponent("ReceiverView");
+  return vue.openBlock(), vue.createBlock(_component_ReceiverView, { class: "ele-file-list" }, {
+    default: vue.withCtx(() => [
+      _ctx.selectionType === "checkbox" ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
+        vue.createElementVNode("div", {
+          class: "ele-file-list-selection",
+          onClick: _cache[0] || (_cache[0] = vue.withModifiers((...args) => _ctx.handleCheckAllChange && _ctx.handleCheckAllChange(...args), ["stop"]))
+        }, [
+          vue.createElementVNode("i", {
+            class: vue.normalizeClass([
+              "ele-file-list-checkbox",
+              { "is-checked": _ctx.isCheckAll },
+              { "is-indeterminate": _ctx.isIndeterminate }
+            ])
+          }, null, 2),
+          vue.createElementVNode("div", null, vue.toDisplayString(_ctx.headerText), 1)
+        ])
+      ])) : vue.createCommentVNode("", true),
+      vue.createElementVNode("div", _hoisted_2, [
+        (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.data, (item) => {
+          return vue.openBlock(), vue.createBlock(_component_FileGridItem, {
+            key: item.key,
+            item,
+            selectionType: _ctx.selectionType,
+            selections: _ctx.selections,
+            current: _ctx.current,
+            icons: _ctx.icons,
+            ctxMenuDropdownVisible: _ctx.ctxMenuDropdownVisible && _ctx.contextMenuFileItem === item,
+            onClick: _ctx.handleItemClick,
+            onCheckChange: _ctx.handleItemCheckChange,
+            onContextOpen: _ctx.handleItemContextOpen
+          }, vue.createSlots({ _: 2 }, [
+            vue.renderList(Object.keys(_ctx.$slots), (name) => {
+              return {
+                name,
+                fn: vue.withCtx((slotProps) => [
+                  vue.renderSlot(_ctx.$slots, name, vue.mergeProps({ ref_for: true }, slotProps || {}))
+                ])
+              };
+            })
+          ]), 1032, ["item", "selectionType", "selections", "current", "icons", "ctxMenuDropdownVisible", "onClick", "onCheckChange", "onContextOpen"]);
+        }), 128))
+      ])
+    ]),
+    _: 3
+  });
+}
+const fileGrid = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
+module.exports = fileGrid;

package/lib/ele-file-list/components/file-sort.cjs

@@ -0,0 +1,34 @@
+"use strict";
+const vue = require("vue");
+const _sfc_main = vue.defineComponent({
+  name: "FileSort",
+  props: {
+    /** 当前排序字段 */
+    sort: String,
+    /** 当前排序方式 */
+    order: String,
+    /** 排序字段名称 */
+    name: {
+      type: String,
+      required: true
+    }
+  }
+});
+const _export_sfc = (sfc, props) => {
+  const target = sfc.__vccOpts || sfc;
+  for (const [key, val] of props) {
+    target[key] = val;
+  }
+  return target;
+};
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  return vue.openBlock(), vue.createElementBlock("i", {
+    class: vue.normalizeClass([
+      "ele-file-list-item-sort",
+      { "is-asc": _ctx.name === _ctx.sort && "asc" === _ctx.order },
+      { "is-desc": _ctx.name === _ctx.sort && "desc" === _ctx.order }
+    ])
+  }, null, 2);
+}
+const fileSort = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
+module.exports = fileSort;

package/lib/ele-file-list/components/file-table-item.cjs

@@ -0,0 +1,182 @@
+"use strict";
+const vue = require("vue");
+const _sfc_main = vue.defineComponent({
+  name: "FileTableItem",
+  props: {
+    /** 数据 */
+    item: {
+      type: Object,
+      required: true
+    },
+    /** 选择框类型 */
+    selectionType: String,
+    /** 多选选中数据 */
+    selections: Array,
+    /** 单选选中数据 */
+    current: Object,
+    /** 后缀对应的图标 */
+    icons: Array,
+    /** 自定义列配置 */
+    columns: Array,
+    /** 右键下拉菜单是否显示 */
+    ctxMenuDropdownVisible: Boolean
+  },
+  emits: {
+    click: (_item) => true,
+    checkChange: (_item) => true,
+    contextOpen: (_option) => true
+  },
+  setup(props, { emit }) {
+    const dropdownTriggerRef = vue.ref(null);
+    const selectable = vue.computed(() => {
+      return props.selectionType === "checkbox" || props.selectionType === "radio";
+    });
+    const selected = vue.computed(() => {
+      if (!selectable.value || !props.item) {
+        return false;
+      }
+      if (props.selectionType === "checkbox") {
+        return !!(props.selections && props.selections.some((t) => t.key === props.item.key));
+      }
+      return !!(props.current && props.current.key === props.item.key);
+    });
+    const icon = vue.computed(() => {
+      var _a, _b, _c;
+      if (props.item.thumbnail) {
+        return props.item.thumbnail;
+      }
+      if (!props.icons) {
+        return;
+      }
+      if (props.item.isDirectory) {
+        return (_a = props.icons.find((d) => d.type === "dir")) == null ? void 0 : _a.icon;
+      }
+      if (props.item.name) {
+        const icon2 = (_b = props.icons.find((d) => {
+          if (!d.suffixes) {
+            return false;
+          }
+          return !!d.suffixes.find((t) => !!props.item.name.endsWith(t));
+        })) == null ? void 0 : _b.icon;
+        if (icon2) {
+          return icon2;
+        }
+      }
+      return (_c = props.icons.find((d) => d.type === "file")) == null ? void 0 : _c.icon;
+    });
+    const handleClick = () => {
+      emit("click", props.item);
+    };
+    const handleCheckChange = () => {
+      emit("checkChange", props.item);
+    };
+    const handleContextmenu = (e) => {
+      if (dropdownTriggerRef.value != null) {
+        emit("contextOpen", {
+          item: props.item,
+          triggerEl: dropdownTriggerRef.value,
+          e
+        });
+      }
+    };
+    return {
+      dropdownTriggerRef,
+      selectable,
+      selected,
+      icon,
+      handleClick,
+      handleCheckChange,
+      handleContextmenu
+    };
+  }
+});
+const _export_sfc = (sfc, props) => {
+  const target = sfc.__vccOpts || sfc;
+  for (const [key, val] of props) {
+    target[key] = val;
+  }
+  return target;
+};
+const _hoisted_1 = {
+  key: 0,
+  class: "ele-file-list-item-checkbox"
+};
+const _hoisted_2 = { class: "ele-file-list-item-name" };
+const _hoisted_3 = { class: "ele-file-list-item-icon" };
+const _hoisted_4 = ["src"];
+const _hoisted_5 = ["title"];
+const _hoisted_6 = {
+  key: 0,
+  class: "ele-file-list-item-tools"
+};
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  return vue.openBlock(), vue.createElementBlock("div", {
+    class: vue.normalizeClass([
+      "ele-file-list-item",
+      { "is-checked": _ctx.selected },
+      { "is-active": _ctx.ctxMenuDropdownVisible }
+    ]),
+    onClick: _cache[3] || (_cache[3] = vue.withModifiers((...args) => _ctx.handleClick && _ctx.handleClick(...args), ["stop"]))
+  }, [
+    vue.createElementVNode("div", {
+      class: "ele-file-list-item-body",
+      onContextmenu: _cache[1] || (_cache[1] = (...args) => _ctx.handleContextmenu && _ctx.handleContextmenu(...args))
+    }, [
+      _ctx.selectable ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_1, [
+        vue.createElementVNode("i", {
+          class: vue.normalizeClass([
+            "ele-file-list-checkbox",
+            { "is-radio": _ctx.selectionType === "radio" },
+            { "is-checked": _ctx.selected }
+          ]),
+          onClick: _cache[0] || (_cache[0] = vue.withModifiers((...args) => _ctx.handleCheckChange && _ctx.handleCheckChange(...args), ["stop"]))
+        }, null, 2)
+      ])) : vue.createCommentVNode("", true),
+      vue.createElementVNode("div", _hoisted_2, [
+        vue.createElementVNode("div", _hoisted_3, [
+          vue.renderSlot(_ctx.$slots, "icon", {
+            icon: _ctx.icon,
+            item: _ctx.item
+          }, () => [
+            vue.createElementVNode("img", {
+              src: _ctx.icon,
+              class: vue.normalizeClass({ "ele-file-list-item-image": !!_ctx.item.thumbnail })
+            }, null, 10, _hoisted_4)
+          ]),
+          vue.renderSlot(_ctx.$slots, "title", { item: _ctx.item }, () => [
+            vue.createElementVNode("div", {
+              title: _ctx.item.name,
+              class: "ele-file-list-item-title"
+            }, vue.toDisplayString(_ctx.item.name), 9, _hoisted_5)
+          ])
+        ]),
+        _ctx.$slots.tool ? (vue.openBlock(), vue.createElementBlock("div", _hoisted_6, [
+          vue.renderSlot(_ctx.$slots, "tool", { item: _ctx.item })
+        ])) : vue.createCommentVNode("", true)
+      ]),
+      (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.columns, (col) => {
+        return vue.openBlock(), vue.createElementBlock("div", {
+          key: col.prop,
+          style: vue.normalizeStyle(col.style),
+          class: "ele-file-list-item-cell"
+        }, [
+          col.slot && !["icon", "title", "tool", "contextMenu"].includes(col.slot) && _ctx.$slots[col.slot] ? vue.renderSlot(_ctx.$slots, col.slot, {
+            key: 0,
+            item: _ctx.item,
+            col
+          }) : _ctx.item && col && col.prop ? (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 1 }, [
+            vue.createTextVNode(vue.toDisplayString(_ctx.item[col.prop]), 1)
+          ], 64)) : vue.createCommentVNode("", true)
+        ], 4);
+      }), 128))
+    ], 32),
+    vue.createElementVNode("div", {
+      ref: "dropdownTriggerRef",
+      class: "ele-file-list-item-dropdown",
+      onClick: _cache[2] || (_cache[2] = vue.withModifiers(() => {
+      }, ["stop"]))
+    }, null, 512)
+  ], 2);
+}
+const fileTableItem = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);
+module.exports = fileTableItem;

package/lib/ele-file-list/icons.cjs

@@ -0,0 +1,130 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const localSmallIcons = [
+  {
+    icon: "/ele-file-list/ic_file_misc_sm.png",
+    type: "file"
+  },
+  {
+    icon: "/ele-file-list/ic_file_folder_sm.png",
+    type: "dir"
+  },
+  {
+    icon: "/ele-file-list/ic_file_code_sm.png",
+    suffixes: [
+      ".java",
+      ".js",
+      ".css",
+      ".vue",
+      ".ts",
+      ".tsx",
+      ".scss",
+      ".less",
+      ".c",
+      ".cpp",
+      ".cs",
+      ".jsp",
+      ".php",
+      ".asp",
+      ".py",
+      ".go",
+      ".kt",
+      ".lua"
+    ]
+  },
+  {
+    icon: "/ele-file-list/ic_file_htm_sm.png",
+    suffixes: [".html", ".htm"]
+  },
+  {
+    icon: "/ele-file-list/ic_file_text_sm.png",
+    suffixes: [".txt"]
+  },
+  {
+    icon: "/ele-file-list/ic_file_pdf_sm.png",
+    suffixes: [".pdf"]
+  },
+  {
+    icon: "/ele-file-list/ic_file_word_sm.png",
+    suffixes: [".doc", ".docx"]
+  },
+  {
+    icon: "/ele-file-list/ic_file_excel_sm.png",
+    suffixes: [".xls", ".xlsx"]
+  },
+  {
+    icon: "/ele-file-list/ic_file_ppt_sm.png",
+    suffixes: [".ppt", ".pptx"]
+  },
+  {
+    icon: "/ele-file-list/ic_file_visio_sm.png",
+    suffixes: [".vsd"]
+  },
+  {
+    icon: "/ele-file-list/ic_file_ps_sm.png",
+    suffixes: [".psd"]
+  },
+  {
+    icon: "/ele-file-list/ic_file_cad_sm.png",
+    suffixes: [".dwg"]
+  },
+  {
+    icon: "/ele-file-list/ic_file_flash_sm.png",
+    suffixes: [".swf"]
+  },
+  {
+    icon: "/ele-file-list/ic_file_music_sm.png",
+    suffixes: [".mp3", ".wav"]
+  },
+  {
+    icon: "/ele-file-list/ic_file_video_sm.png",
+    suffixes: [".mp4", ".rmvb", ".flv", ".avi", ".3gp"]
+  },
+  {
+    icon: "/ele-file-list/ic_file_picture_sm.png",
+    suffixes: [".png", ".jpg", ".jpeg", ".gif", ".bmp"]
+  },
+  {
+    icon: "/ele-file-list/ic_file_fonts_sm.png",
+    suffixes: [".ttf", ".woff"]
+  },
+  {
+    icon: "/ele-file-list/ic_file_bt_sm.png",
+    suffixes: [".torrent"]
+  },
+  {
+    icon: "/ele-file-list/ic_file_android_sm.png",
+    suffixes: [".apk"]
+  },
+  {
+    icon: "/ele-file-list/ic_file_exe_sm.png",
+    suffixes: [".exe"]
+  },
+  {
+    icon: "/ele-file-list/ic_file_ipa_sm.png",
+    suffixes: [".ipa", ".dmg"]
+  },
+  {
+    icon: "/ele-file-list/ic_file_zip_sm.png",
+    suffixes: [".zip", ".rar", ".7z"]
+  }
+];
+const localIcons = localSmallIcons.map((d) => {
+  return { ...d, icon: d.icon.replace("_sm.png", ".png") };
+});
+const smallIcons = localSmallIcons.map((d) => {
+  return {
+    ...d,
+    icon: d.icon.replace(
+      "/ele-file-list/",
+      "https://cdn.eleadmin.com/20200609/"
+    )
+  };
+});
+const icons = smallIcons.map((d) => {
+  return { ...d, icon: d.icon.replace("_sm.png", ".png") };
+});
+exports.icons = icons;
+exports.localIcons = localIcons;
+exports.localSmallIcons = localSmallIcons;
+exports.smallIcons = smallIcons;

package/lib/ele-file-list/props.cjs

@@ -0,0 +1,62 @@
+"use strict";
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const icons = require("./icons");
+const fileListProps = {
+  /** 数据 */
+  data: {
+    type: Array,
+    required: true
+  },
+  /** 选择框类型 */
+  selectionType: String,
+  /** 多选选中数据 */
+  selections: Array,
+  /** 单选选中数据 */
+  current: Object,
+  /** 是否网格展示 */
+  grid: {
+    type: Boolean,
+    default: true
+  },
+  /** 表格模式默认的列是否可以排序 */
+  sortable: Boolean,
+  /** 排序字段 */
+  sort: String,
+  /** 排序方式 */
+  order: String,
+  /** 网格模式后缀对应图标 */
+  icons: {
+    type: Array,
+    default: () => {
+      return icons.icons;
+    }
+  },
+  /** 表格模式后缀对应图标 */
+  smallIcons: Array,
+  /** 表格模式自定义列配置 */
+  columns: Array,
+  /** 多选时是否支持鼠标框选 */
+  boxChoose: Boolean,
+  /** 右键菜单 */
+  contextMenus: [Array, Function],
+  /** 右键菜单属性 */
+  contextMenuProps: Object,
+  /** 国际化 */
+  locale: Object
+};
+const fileListEmits = {
+  /** item 点击事件 */
+  itemClick: (_item) => true,
+  /** 排序方式改变事件 */
+  sortChange: (_sorter) => true,
+  /** 更新多选选中数据 */
+  "update:selections": (_selection) => true,
+  /** 更新单选选中数据 */
+  "update:current": (_current) => true,
+  /** item 右键菜单项点击事件 */
+  itemContextMenu: (_option) => true,
+  /** item 右键菜单打开事件 */
+  itemContextOpen: (_dropdownRef, _item) => true
+};
+exports.fileListEmits = fileListEmits;
+exports.fileListProps = fileListProps;

package/lib/ele-file-list/style/css-var.scss

@@ -0,0 +1,8 @@
+@use '../../style/util.scss' as *;
+
+/* 文件列表主题变量 */
+@mixin set-file-var($var) {
+  .ele-file-list-group {
+    @include set-ele-var('file', $var);
+  }
+}

package/lib/ele-file-list/style/index.cjs

@@ -0,0 +1,3 @@
+"use strict";
+require("../../ele-dropdown/style/index");
+require("./index.scss");