fast-vue3-ui/es/src/upload/dragger.mjs

<h1 align="center"> fast-ui </h1>

import { defineComponent as d, ref as t, onMounted as f, openBlock as c, createElementBlock as p, normalizeClass as v, createElementVNode as r, createVNode as m, createTextVNode as g } from "vue";
import "./style/drag.css";
import _ from "../icon/icon.mjs";
const k = { class: "k-upload-content" }, E = /* @__PURE__ */ r("div", { class: "k-upload-dragger-text" }, [
  /* @__PURE__ */ g("\u5C06\u6587\u4EF6\u62D6\u5230\u6B64\u5904\u6216"),
  /* @__PURE__ */ r("em", null, "\u70B9\u51FB\u4E0A\u4F20")
], -1), C = /* @__PURE__ */ d({
  __name: "dragger",
  emits: ["getFilesList", "fileUpload"],
  setup(B, { emit: n }) {
    const o = t(), l = t(!1), a = t(null), u = t([]);
    f(() => {
      o.value.addEventListener("drop", (e) => {
        e.preventDefault(), u.value.push(...Array.from(e.dataTransfer.files)), n("getFilesList", u.value);
      }, !1), o.value.addEventListener("dragover", i, !1);
    });
    const i = (e) => {
      l.value = !0, a.value !== null && clearTimeout(a.value), a.value = window.setTimeout(() => {
        l.value = !1, a.value = null;
      }, 100), e.stopPropagation(), e.preventDefault();
    };
    return (e, s) => (c(), p("div", {
      class: v(["k-upload-dragger", { ["k-upload-draggerenter"]: l.value }]),
      ref_key: "fileArea",
      ref: o,
      onClick: s[0] || (s[0] = (F) => n("fileUpload"))
    }, [
      r("div", k, [
        m(_, {
          class: "k-upload-icon",
          name: l.value ? "file-open" : "folder-close"
        }, null, 8, ["name"]),
        E
      ])
    ], 2));
  }
});
export {
  C as default
};