smarteye-e-components 0.0.23 → 0.0.25

package/dist/smarteye-e-components.mjs

@@ -1,325 +1,325 @@
-import { defineComponent as F, computed as M, openBlock as p, createElementBlock as b, renderSlot as y, createElementVNode as _, toDisplayString as O, h as L, inject as te, ref as z, resolveComponent as $, normalizeClass as B, createVNode as I, withCtx as C, createBlock as P, createCommentVNode as j, Fragment as H, renderList as A, provide as oe, pushScopeId as ne, popScopeId as se } from "vue";
+import { defineComponent as j, computed as H, openBlock as g, createElementBlock as S, renderSlot as $, createElementVNode as v, toDisplayString as D, h as V, ref as y, normalizeStyle as O, Fragment as E, renderList as T, inject as it, resolveComponent as k, normalizeClass as x, createVNode as I, withCtx as C, createBlock as G, createCommentVNode as M, provide as st, pushScopeId as rt, popScopeId as at } from "vue";
 var N;
-((e) => {
+((t) => {
   ((o) => {
-    function s(a) {
-      const i = [];
-      for (let l = 0; l < a; l++)
-        i.push({
+    function i(r) {
+      const a = [];
+      for (let l = 0; l < r; l++)
+        a.push({
           id: "testId",
           pid: "",
           name: `device-${l}`,
           online: l % 2 == 0,
           channels: []
         });
-      return i;
+      return a;
     }
-    function t(a) {
-      const i = [];
-      for (let l = 0; l < a; l++)
-        i.push({
+    function e(r) {
+      const a = [];
+      for (let l = 0; l < r; l++)
+        a.push({
           id: `groupid-${l}`,
           name: `group-${l}`,
           pid: "",
           onlineCount: 0,
           totalCount: 0,
-          devices: s(10),
-          items: t(a - l - 1)
+          devices: i(4),
+          items: e(r - l - 1)
         });
-      return i;
+      return a;
     }
-    function r(a) {
+    function s(r) {
       return {
         name: "hah",
         onlineCount: 0,
         totalCount: 0,
-        items: t(a)
+        items: e(r)
       };
     }
-    o.RandomDeviceGroup = r;
-  })(e.Test || (e.Test = {}));
-  function n(o, s) {
-    for (let t = 0; t < o.length; t++)
-      s(o[t]), n(o[t].items, s);
+    o.RandomDeviceGroup = s;
+  })(t.Test || (t.Test = {}));
+  function n(o, i) {
+    for (let e = 0; e < o.length; e++)
+      i(o[e]), n(o[e].items, i);
   }
   ((o) => {
-    function s(t) {
-      const r = {}, a = {};
-      return n(t.items, (i) => {
-        r[i.id] = i;
-        for (let l = 0; l < i.devices.length; l++)
-          a[i.devices[l].id] = i.devices[l];
+    function i(e) {
+      const s = {}, r = {};
+      return n(e.items, (a) => {
+        s[a.id] = a;
+        for (let l = 0; l < a.devices.length; l++)
+          r[a.devices[l].id] = a.devices[l];
       }), {
-        getGroup(i) {
-          return r[i];
+        getGroup(a) {
+          return s[a];
         },
-        getDevice(i) {
-          return a[i];
+        getDevice(a) {
+          return r[a];
         },
-        foreachGroup(i) {
-          for (let l in r)
-            i(r[l]);
+        foreachGroup(a) {
+          for (let l in s)
+            a(s[l]);
         }
       };
     }
-    o.AccessSession = s;
-  })(e.Utils || (e.Utils = {}));
+    o.AccessSession = i;
+  })(t.Utils || (t.Utils = {}));
 })(N || (N = {}));
-const re = F({
+const lt = j({
   props: {
     countInfo: Object,
     controlParams: Object
   },
-  setup(e) {
-    function n(t, r) {
-      if (r) {
-        let a = 0;
-        return r.items.forEach((i) => {
-          a += n(t, i);
-        }), t(r) + a;
+  setup(t) {
+    function n(e, s) {
+      if (s) {
+        let r = 0;
+        return s.items.forEach((a) => {
+          r += n(e, a);
+        }), e(s) + r;
       }
       return 0;
     }
-    const o = M(() => n((t) => t.onlineCount, e.countInfo));
+    const o = H(() => n((e) => e.onlineCount, t.countInfo));
     return {
-      totalCount: M(() => n((t) => t.totalCount, e.countInfo)),
+      totalCount: H(() => n((e) => e.totalCount, t.countInfo)),
       onlineCount: o
     };
   }
 });
-const E = (e, n) => {
-  const o = e.__vccOpts || e;
-  for (const [s, t] of n)
-    o[s] = t;
+const F = (t, n) => {
+  const o = t.__vccOpts || t;
+  for (const [i, e] of n)
+    o[i] = e;
   return o;
-}, ie = { class: "root" }, le = { class: "count-show" };
-function ae(e, n, o, s, t, r) {
-  return p(), b("div", ie, [
-    y(e.$slots, "default", {}, void 0, !0),
-    _("span", le, O(e.onlineCount) + "/" + O(e.totalCount), 1)
+}, ct = { class: "root" }, ut = { class: "count-show" };
+function dt(t, n, o, i, e, s) {
+  return g(), S("div", ct, [
+    $(t.$slots, "default", {}, void 0, !0),
+    v("span", ut, D(t.onlineCount) + "/" + D(t.totalCount), 1)
   ]);
 }
-const q = /* @__PURE__ */ E(re, [["render", ae], ["__scopeId", "data-v-56ab9f59"]]), J = Object.freeze(
+const X = /* @__PURE__ */ F(lt, [["render", dt], ["__scopeId", "data-v-6a3c7483"]]), Y = Object.freeze(
   {
     left: 0,
     top: 0,
     width: 16,
     height: 16
   }
-), Q = Object.freeze({
+), Z = Object.freeze({
   rotate: 0,
   vFlip: !1,
   hFlip: !1
-}), T = Object.freeze({
-  ...J,
-  ...Q
+}), A = Object.freeze({
+  ...Y,
+  ...Z
 });
 Object.freeze({
-  ...T,
+  ...A,
   body: "",
   hidden: !1
 });
 ({
-  ...J
+  ...Y
 });
-const X = Object.freeze({
+const tt = Object.freeze({
   width: null,
   height: null
-}), Y = Object.freeze({
-  ...X,
-  ...Q
+}), et = Object.freeze({
+  ...tt,
+  ...Z
 });
-function ce(e, n) {
+function ht(t, n) {
   const o = {
-    ...e
+    ...t
   };
-  for (const s in n) {
-    const t = n[s], r = typeof t;
-    s in X ? (t === null || t && (r === "string" || r === "number")) && (o[s] = t) : r === typeof o[s] && (o[s] = s === "rotate" ? t % 4 : t);
+  for (const i in n) {
+    const e = n[i], s = typeof e;
+    i in tt ? (e === null || e && (s === "string" || s === "number")) && (o[i] = e) : s === typeof o[i] && (o[i] = i === "rotate" ? e % 4 : e);
   }
   return o;
 }
-const ue = /[\s,]+/;
-function de(e, n) {
-  n.split(ue).forEach((o) => {
+const ft = /[\s,]+/;
+function pt(t, n) {
+  n.split(ft).forEach((o) => {
     switch (o.trim()) {
       case "horizontal":
-        e.hFlip = !0;
+        t.hFlip = !0;
         break;
       case "vertical":
-        e.vFlip = !0;
+        t.vFlip = !0;
         break;
     }
   });
 }
-function he(e, n = 0) {
-  const o = e.replace(/^-?[0-9.]*/, "");
-  function s(t) {
-    for (; t < 0; )
-      t += 4;
-    return t % 4;
+function gt(t, n = 0) {
+  const o = t.replace(/^-?[0-9.]*/, "");
+  function i(e) {
+    for (; e < 0; )
+      e += 4;
+    return e % 4;
   }
   if (o === "") {
-    const t = parseInt(e);
-    return isNaN(t) ? 0 : s(t);
-  } else if (o !== e) {
-    let t = 0;
+    const e = parseInt(t);
+    return isNaN(e) ? 0 : i(e);
+  } else if (o !== t) {
+    let e = 0;
     switch (o) {
       case "%":
-        t = 25;
+        e = 25;
         break;
       case "deg":
-        t = 90;
+        e = 90;
     }
-    if (t) {
-      let r = parseFloat(e.slice(0, e.length - o.length));
-      return isNaN(r) ? 0 : (r = r / t, r % 1 === 0 ? s(r) : 0);
+    if (e) {
+      let s = parseFloat(t.slice(0, t.length - o.length));
+      return isNaN(s) ? 0 : (s = s / e, s % 1 === 0 ? i(s) : 0);
     }
   }
   return n;
 }
-const fe = /(-?[0-9.]*[0-9]+[0-9.]*)/g, pe = /^-?[0-9.]*[0-9]+[0-9.]*$/g;
-function R(e, n, o) {
+const vt = /(-?[0-9.]*[0-9]+[0-9.]*)/g, mt = /^-?[0-9.]*[0-9]+[0-9.]*$/g;
+function B(t, n, o) {
   if (n === 1)
-    return e;
-  if (o = o || 100, typeof e == "number")
-    return Math.ceil(e * n * o) / o;
-  if (typeof e != "string")
-    return e;
-  const s = e.split(fe);
-  if (s === null || !s.length)
-    return e;
-  const t = [];
-  let r = s.shift(), a = pe.test(r);
+    return t;
+  if (o = o || 100, typeof t == "number")
+    return Math.ceil(t * n * o) / o;
+  if (typeof t != "string")
+    return t;
+  const i = t.split(vt);
+  if (i === null || !i.length)
+    return t;
+  const e = [];
+  let s = i.shift(), r = mt.test(s);
   for (; ; ) {
-    if (a) {
-      const i = parseFloat(r);
-      isNaN(i) ? t.push(r) : t.push(Math.ceil(i * n * o) / o);
+    if (r) {
+      const a = parseFloat(s);
+      isNaN(a) ? e.push(s) : e.push(Math.ceil(a * n * o) / o);
     } else
-      t.push(r);
-    if (r = s.shift(), r === void 0)
-      return t.join("");
-    a = !a;
+      e.push(s);
+    if (s = i.shift(), s === void 0)
+      return e.join("");
+    r = !r;
   }
 }
-function ge(e, n) {
+function _t(t, n) {
   const o = {
-    ...T,
-    ...e
-  }, s = {
-    ...Y,
+    ...A,
+    ...t
+  }, i = {
+    ...et,
     ...n
-  }, t = {
+  }, e = {
     left: o.left,
     top: o.top,
     width: o.width,
     height: o.height
   };
-  let r = o.body;
-  [o, s].forEach((g) => {
-    const h = [], f = g.hFlip, c = g.vFlip;
-    let w = g.rotate;
-    f ? c ? w += 2 : (h.push(
-      "translate(" + (t.width + t.left).toString() + " " + (0 - t.top).toString() + ")"
-    ), h.push("scale(-1 1)"), t.top = t.left = 0) : c && (h.push(
-      "translate(" + (0 - t.left).toString() + " " + (t.height + t.top).toString() + ")"
-    ), h.push("scale(1 -1)"), t.top = t.left = 0);
-    let S;
-    switch (w < 0 && (w -= Math.floor(w / 4) * 4), w = w % 4, w) {
+  let s = o.body;
+  [o, i].forEach((m) => {
+    const h = [], f = m.hFlip, c = m.vFlip;
+    let _ = m.rotate;
+    f ? c ? _ += 2 : (h.push(
+      "translate(" + (e.width + e.left).toString() + " " + (0 - e.top).toString() + ")"
+    ), h.push("scale(-1 1)"), e.top = e.left = 0) : c && (h.push(
+      "translate(" + (0 - e.left).toString() + " " + (e.height + e.top).toString() + ")"
+    ), h.push("scale(1 -1)"), e.top = e.left = 0);
+    let w;
+    switch (_ < 0 && (_ -= Math.floor(_ / 4) * 4), _ = _ % 4, _) {
       case 1:
-        S = t.height / 2 + t.top, h.unshift(
-          "rotate(90 " + S.toString() + " " + S.toString() + ")"
+        w = e.height / 2 + e.top, h.unshift(
+          "rotate(90 " + w.toString() + " " + w.toString() + ")"
         );
         break;
       case 2:
         h.unshift(
-          "rotate(180 " + (t.width / 2 + t.left).toString() + " " + (t.height / 2 + t.top).toString() + ")"
+          "rotate(180 " + (e.width / 2 + e.left).toString() + " " + (e.height / 2 + e.top).toString() + ")"
         );
         break;
       case 3:
-        S = t.width / 2 + t.left, h.unshift(
-          "rotate(-90 " + S.toString() + " " + S.toString() + ")"
+        w = e.width / 2 + e.left, h.unshift(
+          "rotate(-90 " + w.toString() + " " + w.toString() + ")"
         );
         break;
     }
-    w % 2 === 1 && (t.left !== t.top && (S = t.left, t.left = t.top, t.top = S), t.width !== t.height && (S = t.width, t.width = t.height, t.height = S)), h.length && (r = '<g transform="' + h.join(" ") + '">' + r + "</g>");
+    _ % 2 === 1 && (e.left !== e.top && (w = e.left, e.left = e.top, e.top = w), e.width !== e.height && (w = e.width, e.width = e.height, e.height = w)), h.length && (s = '<g transform="' + h.join(" ") + '">' + s + "</g>");
   });
-  const a = s.width, i = s.height, l = t.width, d = t.height;
-  let v, u;
-  return a === null ? (u = i === null ? "1em" : i === "auto" ? d : i, v = R(u, l / d)) : (v = a === "auto" ? l : a, u = i === null ? R(v, d / l) : i === "auto" ? d : i), {
+  const r = i.width, a = i.height, l = e.width, u = e.height;
+  let p, d;
+  return r === null ? (d = a === null ? "1em" : a === "auto" ? u : a, p = B(d, l / u)) : (p = r === "auto" ? l : r, d = a === null ? B(p, u / l) : a === "auto" ? u : a), {
     attributes: {
-      width: v.toString(),
-      height: u.toString(),
-      viewBox: t.left.toString() + " " + t.top.toString() + " " + l.toString() + " " + d.toString()
+      width: p.toString(),
+      height: d.toString(),
+      viewBox: e.left.toString() + " " + e.top.toString() + " " + l.toString() + " " + u.toString()
     },
-    body: r
+    body: s
   };
 }
-const ve = /\sid="(\S+)"/g, me = "IconifyId" + Date.now().toString(16) + (Math.random() * 16777216 | 0).toString(16);
-let we = 0;
-function _e(e, n = me) {
+const wt = /\sid="(\S+)"/g, St = "IconifyId" + Date.now().toString(16) + (Math.random() * 16777216 | 0).toString(16);
+let bt = 0;
+function yt(t, n = St) {
   const o = [];
-  let s;
-  for (; s = ve.exec(e); )
-    o.push(s[1]);
-  return o.length && o.forEach((t) => {
-    const r = typeof n == "function" ? n(t) : n + (we++).toString(), a = t.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
-    e = e.replace(
-      new RegExp('([#;"])(' + a + ')([")]|\\.[a-z])', "g"),
-      "$1" + r + "$3"
+  let i;
+  for (; i = wt.exec(t); )
+    o.push(i[1]);
+  return o.length && o.forEach((e) => {
+    const s = typeof n == "function" ? n(e) : n + (bt++).toString(), r = e.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+    t = t.replace(
+      new RegExp('([#;"])(' + r + ')([")]|\\.[a-z])', "g"),
+      "$1" + s + "$3"
     );
-  }), e;
+  }), t;
 }
-function Se(e, n) {
-  let o = e.indexOf("xlink:") === -1 ? "" : ' xmlns:xlink="http://www.w3.org/1999/xlink"';
-  for (const s in n)
-    o += " " + s + '="' + n[s] + '"';
-  return '<svg xmlns="http://www.w3.org/2000/svg"' + o + ">" + e + "</svg>";
+function $t(t, n) {
+  let o = t.indexOf("xlink:") === -1 ? "" : ' xmlns:xlink="http://www.w3.org/1999/xlink"';
+  for (const i in n)
+    o += " " + i + '="' + n[i] + '"';
+  return '<svg xmlns="http://www.w3.org/2000/svg"' + o + ">" + t + "</svg>";
 }
-function be(e) {
-  return e.replace(/"/g, "'").replace(/%/g, "%25").replace(/#/g, "%23").replace(/</g, "%3C").replace(/>/g, "%3E").replace(/\s+/g, " ");
+function Ct(t) {
+  return t.replace(/"/g, "'").replace(/%/g, "%25").replace(/#/g, "%23").replace(/</g, "%3C").replace(/>/g, "%3E").replace(/\s+/g, " ");
 }
-function ye(e) {
-  return 'url("data:image/svg+xml,' + be(e) + '")';
+function kt(t) {
+  return 'url("data:image/svg+xml,' + Ct(t) + '")';
 }
-const V = {
-  ...Y,
+const R = {
+  ...et,
   inline: !1
-}, Ce = {
+}, It = {
   xmlns: "http://www.w3.org/2000/svg",
   "xmlns:xlink": "http://www.w3.org/1999/xlink",
   "aria-hidden": !0,
   role: "img"
-}, $e = {
+}, Pt = {
   display: "inline-block"
-}, D = {
+}, L = {
   backgroundColor: "currentColor"
-}, Z = {
+}, ot = {
   backgroundColor: "transparent"
-}, x = {
+}, U = {
   Image: "var(--svg)",
   Repeat: "no-repeat",
   Size: "100% 100%"
-}, U = {
-  webkitMask: D,
-  mask: D,
-  background: Z
+}, W = {
+  webkitMask: L,
+  mask: L,
+  background: ot
 };
-for (const e in U) {
-  const n = U[e];
-  for (const o in x)
-    n[e + o] = x[o];
+for (const t in W) {
+  const n = W[t];
+  for (const o in U)
+    n[t + o] = U[o];
 }
-const G = {};
-["horizontal", "vertical"].forEach((e) => {
-  const n = e.slice(0, 1) + "Flip";
-  G[e + "-flip"] = n, G[e.slice(0, 1) + "-flip"] = n, G[e + "Flip"] = n;
+const z = {};
+["horizontal", "vertical"].forEach((t) => {
+  const n = t.slice(0, 1) + "Flip";
+  z[t + "-flip"] = n, z[t.slice(0, 1) + "-flip"] = n, z[t + "Flip"] = n;
 });
-function W(e) {
-  return e + (e.match(/^[-0-9.]+$/) ? "px" : "");
+function K(t) {
+  return t + (t.match(/^[-0-9.]+$/) ? "px" : "");
 }
-const ke = (e, n) => {
-  const o = ce(V, n), s = { ...Ce }, t = n.mode || "svg", r = {}, a = n.style, i = typeof a == "object" && !(a instanceof Array) ? a : {};
+const Ot = (t, n) => {
+  const o = ht(R, n), i = { ...It }, e = n.mode || "svg", s = {}, r = n.style, a = typeof r == "object" && !(r instanceof Array) ? r : {};
   for (let f in n) {
     const c = n[f];
     if (c !== void 0)
@@ -335,224 +335,323 @@ const ke = (e, n) => {
           o[f] = c === !0 || c === "true" || c === 1;
           break;
         case "flip":
-          typeof c == "string" && de(o, c);
+          typeof c == "string" && pt(o, c);
           break;
         case "color":
-          r.color = c;
+          s.color = c;
           break;
         case "rotate":
-          typeof c == "string" ? o[f] = he(c) : typeof c == "number" && (o[f] = c);
+          typeof c == "string" ? o[f] = gt(c) : typeof c == "number" && (o[f] = c);
           break;
         case "ariaHidden":
         case "aria-hidden":
-          c !== !0 && c !== "true" && delete s["aria-hidden"];
+          c !== !0 && c !== "true" && delete i["aria-hidden"];
           break;
         default: {
-          const w = G[f];
-          w ? (c === !0 || c === "true" || c === 1) && (o[w] = !0) : V[f] === void 0 && (s[f] = c);
+          const _ = z[f];
+          _ ? (c === !0 || c === "true" || c === 1) && (o[_] = !0) : R[f] === void 0 && (i[f] = c);
         }
       }
   }
-  const l = ge(e, o), d = l.attributes;
-  if (o.inline && (r.verticalAlign = "-0.125em"), t === "svg") {
-    s.style = {
-      ...r,
-      ...i
-    }, Object.assign(s, d);
+  const l = _t(t, o), u = l.attributes;
+  if (o.inline && (s.verticalAlign = "-0.125em"), e === "svg") {
+    i.style = {
+      ...s,
+      ...a
+    }, Object.assign(i, u);
     let f = 0, c = n.id;
-    return typeof c == "string" && (c = c.replace(/-/g, "_")), s.innerHTML = _e(l.body, c ? () => c + "ID" + f++ : "iconifyVue"), L("svg", s);
+    return typeof c == "string" && (c = c.replace(/-/g, "_")), i.innerHTML = yt(l.body, c ? () => c + "ID" + f++ : "iconifyVue"), V("svg", i);
   }
-  const { body: v, width: u, height: m } = e, g = t === "mask" || (t === "bg" ? !1 : v.indexOf("currentColor") !== -1), h = Se(v, {
-    ...d,
-    width: u + "",
-    height: m + ""
+  const { body: p, width: d, height: b } = t, m = e === "mask" || (e === "bg" ? !1 : p.indexOf("currentColor") !== -1), h = $t(p, {
+    ...u,
+    width: d + "",
+    height: b + ""
   });
-  return s.style = {
-    ...r,
-    "--svg": ye(h),
-    width: W(d.width),
-    height: W(d.height),
-    ...$e,
-    ...g ? D : Z,
-    ...i
-  }, L("span", s);
-}, ee = /* @__PURE__ */ Object.create(null);
-function k(e, n) {
-  ee[e] = n;
+  return i.style = {
+    ...s,
+    "--svg": kt(h),
+    width: K(u.width),
+    height: K(u.height),
+    ...Pt,
+    ...m ? L : ot,
+    ...a
+  }, V("span", i);
+}, nt = /* @__PURE__ */ Object.create(null);
+function P(t, n) {
+  nt[t] = n;
 }
-const Ie = F({
+const Gt = j({
   inheritAttrs: !1,
   render() {
-    const e = this.$attrs, n = e.icon, o = typeof n == "string" ? ee[n] : typeof n == "object" ? n : null;
-    return o === null || typeof o != "object" || typeof o.body != "string" ? this.$slots.default ? this.$slots.default() : null : ke({
-      ...T,
+    const t = this.$attrs, n = t.icon, o = typeof n == "string" ? nt[n] : typeof n == "object" ? n : null;
+    return o === null || typeof o != "object" || typeof o.body != "string" ? this.$slots.default ? this.$slots.default() : null : Ot({
+      ...A,
       ...o
-    }, e);
+    }, t);
+  }
+});
+var zt = Object.defineProperty, q = Object.getOwnPropertySymbols, Ht = Object.prototype.hasOwnProperty, Dt = Object.prototype.propertyIsEnumerable, J = (t, n, o) => n in t ? zt(t, n, { enumerable: !0, configurable: !0, writable: !0, value: o }) : t[n] = o, jt = (t, n) => {
+  for (var o in n || (n = {}))
+    Ht.call(n, o) && J(t, o, n[o]);
+  if (q)
+    for (var o of q(n))
+      Dt.call(n, o) && J(t, o, n[o]);
+  return t;
+};
+const Ft = {
+  name: "VirtualList",
+  props: {
+    listData: {
+      type: Object,
+      default: () => []
+    },
+    itemSize: {
+      type: Number,
+      default: 200
+    }
+  },
+  computed: {
+    listHeight() {
+      return this.listData.length * this.itemSize;
+    },
+    visibleCount() {
+      return Math.ceil(this.screenHeight / this.itemSize);
+    },
+    getTransform() {
+      return `translate3d(0,${this.startOffset}px,0)`;
+    },
+    visibleData() {
+      return this.listData.slice(this.start, Math.min(this.end, this.listData.length));
+    }
+  },
+  setup() {
+    const t = {
+      screenHeight: y(0),
+      startOffset: y(0),
+      start: y(0),
+      end: y(0)
+    }, n = y();
+    return jt({
+      virList: n
+    }, t);
+  },
+  mounted() {
+    this.screenHeight = this.$el.clientHeight, this.screenHeight == 0 && (this.screenHeight = 400), this.start = 0, this.end = this.start + this.visibleCount, console.log("x");
+  },
+  methods: {
+    scrollEvent() {
+      if (this.virList) {
+        let t = this.virList.scrollTop;
+        this.start = Math.floor(t / this.itemSize), this.end = this.start + this.visibleCount, this.startOffset = t - t % this.itemSize;
+      }
+    }
   }
-}), Pe = F({
+};
+function Mt(t, n, o, i, e, s) {
+  return g(), S("div", {
+    ref: "virList",
+    class: "infinite-list-container",
+    onScroll: n[0] || (n[0] = (r) => s.scrollEvent())
+  }, [
+    v("div", {
+      class: "infinite-list-phantom",
+      style: O({ height: s.listHeight + "px" })
+    }, null, 4),
+    v("div", {
+      class: "infinite-list",
+      style: O({ transform: s.getTransform })
+    }, [
+      (g(!0), S(E, null, T(s.visibleData, (r) => (g(), S("div", {
+        ref_for: !0,
+        ref: "items",
+        class: "infinite-list-item",
+        key: r.id,
+        style: O({ height: o.itemSize + "px", lineHeight: o.itemSize + "px" })
+      }, [
+        $(t.$slots, "default", { data: r }, void 0, !0)
+      ], 4))), 128))
+    ], 4)
+  ], 544);
+}
+const Lt = /* @__PURE__ */ F(Ft, [["render", Mt], ["__scopeId", "data-v-aa3fae6b"]]), Et = j({
   components: {
-    CountShow: q,
-    Icon: Ie
+    VirtualList: Lt,
+    CountShow: X,
+    Icon: Gt
   },
   name: "group-show",
   props: {
     deviceGroup: Object,
     controlParams: Object
   },
-  setup(e) {
-    const n = te("theme");
-    function o(r) {
+  setup(t) {
+    const n = it("theme"), o = H(() => {
+      var r;
+      return i((r = t.deviceGroup) == null ? void 0 : r.devices);
+    });
+    function i(r) {
       var a;
-      return ((a = r && r.filter((i) => {
-        var l;
-        return !((l = e.controlParams) != null && l.onlyShowOnline) || i.online;
-      })) == null ? void 0 : a.filter((i) => {
-        var l, d;
-        return e.controlParams ? i.name.indexOf((l = e.controlParams) == null ? void 0 : l.searchStr) >= 0 || i.id.indexOf((d = e.controlParams) == null ? void 0 : d.searchStr) >= 0 : !0;
+      return ((a = r && r.filter((l) => {
+        var u;
+        return !((u = t.controlParams) != null && u.onlyShowOnline) || l.online;
+      })) == null ? void 0 : a.filter((l) => {
+        var u, p;
+        return t.controlParams ? l.name.indexOf((u = t.controlParams) == null ? void 0 : u.searchStr) >= 0 || l.id.indexOf((p = t.controlParams) == null ? void 0 : p.searchStr) >= 0 : !0;
       })) || [];
     }
-    const s = M(() => {
+    const e = H(() => {
       var r, a;
-      const i = e.controlParams.searchStr;
-      return i.length == 0 || e.deviceGroup && ((r = e.deviceGroup) == null ? void 0 : r.name.indexOf(i)) > 0 ? !0 : (a = e.deviceGroup) == null ? void 0 : a.devices.find((l) => l.name.indexOf(e.controlParams.searchStr) >= 0 || l.id.indexOf(e.controlParams.searchStr) >= 0);
-    }), t = z(!1);
+      const l = t.controlParams.searchStr;
+      return l.length == 0 || t.deviceGroup && ((r = t.deviceGroup) == null ? void 0 : r.name.indexOf(l)) > 0 ? !0 : (a = t.deviceGroup) == null ? void 0 : a.devices.find((u) => u.name.indexOf(t.controlParams.searchStr) >= 0 || u.id.indexOf(t.controlParams.searchStr) >= 0);
+    }), s = y(!1);
     return {
-      showGroup: s,
-      FilterDevice: o,
-      bShow: t,
+      filteredDevices: o,
+      showGroup: e,
+      FilterDevice: i,
+      bShow: s,
       theme: n
     };
   }
 });
-const Ge = {
+const Tt = {
   key: 0,
   class: "head-op"
-}, Oe = ["title"], Fe = { class: "group-slot" }, je = {
+}, At = ["title"], Vt = { class: "group-slot" }, xt = {
   key: 0,
   style: { "margin-left": "26px" }
-}, Me = { class: "device-show-div" }, ze = ["title"], He = { class: "device-slot" };
-function Ae(e, n, o, s, t, r) {
-  var a, i;
-  const l = $("Icon"), d = $("CountShow"), v = $("group-show");
-  return e.showGroup ? (p(), b("div", {
+}, Nt = ["title"], Bt = { class: "device-slot" };
+function Rt(t, n, o, i, e, s) {
+  var r;
+  const a = k("Icon"), l = k("CountShow"), u = k("group-show"), p = k("VirtualList");
+  return t.showGroup ? (g(), S("div", {
     key: 0,
-    class: B("group " + e.theme)
+    class: x("group " + t.theme)
   }, [
-    I(d, {
-      countInfo: e.deviceGroup,
-      controlParams: e.controlParams
+    I(l, {
+      countInfo: t.deviceGroup,
+      controlParams: t.controlParams
     }, {
       default: C(() => {
-        var u, m, g, h, f;
+        var d, b, m, h, f;
         return [
-          e.deviceGroup && e.deviceGroup.devices.length + e.deviceGroup.items.length > 0 ? (p(), b("span", Ge, [
-            e.bShow ? (p(), P(l, {
+          t.deviceGroup && t.deviceGroup.devices.length + t.deviceGroup.items.length > 0 ? (g(), S("span", Tt, [
+            t.bShow ? (g(), G(a, {
               key: 1,
               icon: "minus",
               width: "20",
-              onClick: n[1] || (n[1] = (c) => e.bShow = !e.bShow),
+              onClick: n[1] || (n[1] = (c) => t.bShow = !t.bShow),
               class: "handle-ls-svg"
-            })) : (p(), P(l, {
+            })) : (g(), G(a, {
               key: 0,
               icon: "plus",
               width: "20",
-              onClick: n[0] || (n[0] = (c) => e.bShow = !e.bShow),
+              onClick: n[0] || (n[0] = (c) => t.bShow = !t.bShow),
               class: "handle-ls-svg"
             }))
-          ])) : j("", !0),
-          _("span", {
+          ])) : M("", !0),
+          v("span", {
             class: "group-head-db-click",
-            onDblclick: n[2] || (n[2] = (c) => e.bShow = !e.bShow)
+            onDblclick: n[2] || (n[2] = (c) => t.bShow = !t.bShow)
           }, [
-            I(l, {
+            I(a, {
               icon: "group",
               width: "24",
               class: "group-avatar"
             }),
-            _("span", {
+            v("span", {
               class: "group-name",
-              title: (u = e.deviceGroup) == null ? void 0 : u.name
-            }, O(((m = e.deviceGroup) == null ? void 0 : m.name) && ((g = e.deviceGroup) == null ? void 0 : g.name.length) > 0 ? (h = e.deviceGroup) == null ? void 0 : h.name : (f = e.deviceGroup) == null ? void 0 : f.id), 9, Oe)
+              title: (d = t.deviceGroup) == null ? void 0 : d.name
+            }, D(((b = t.deviceGroup) == null ? void 0 : b.name) && ((m = t.deviceGroup) == null ? void 0 : m.name.length) > 0 ? (h = t.deviceGroup) == null ? void 0 : h.name : (f = t.deviceGroup) == null ? void 0 : f.id), 9, At)
           ], 32),
-          _("div", Fe, [
-            y(e.$slots, "group", { group: e.deviceGroup }, void 0, !0)
+          v("div", Vt, [
+            $(t.$slots, "group", { group: t.deviceGroup }, void 0, !0)
           ])
         ];
       }),
       _: 3
     }, 8, ["countInfo", "controlParams"]),
-    e.bShow ? (p(), b("div", je, [
-      (p(!0), b(H, null, A((a = e.deviceGroup) == null ? void 0 : a.items, (u, m) => (p(), P(v, {
-        key: m,
-        deviceGroup: u,
-        controlParams: e.controlParams
+    t.bShow ? (g(), S("div", xt, [
+      (g(!0), S(E, null, T((r = t.deviceGroup) == null ? void 0 : r.items, (d, b) => (g(), G(u, {
+        key: b,
+        deviceGroup: d,
+        controlParams: t.controlParams
       }, {
-        group: C(({ group: g }) => [
-          y(e.$slots, "group", { group: g }, void 0, !0)
+        group: C(({ group: m }) => [
+          $(t.$slots, "group", { group: m }, void 0, !0)
         ]),
-        device: C(({ device: g, group: h }) => [
-          y(e.$slots, "device", {
-            device: g,
+        device: C(({ device: m, group: h }) => [
+          $(t.$slots, "device", {
+            device: m,
             group: h
           }, void 0, !0)
         ]),
         _: 2
       }, 1032, ["deviceGroup", "controlParams"]))), 128)),
-      _("div", Me, [
-        (p(!0), b(H, null, A(e.FilterDevice((i = e.deviceGroup) == null ? void 0 : i.devices), (u, m) => (p(), b("div", {
-          key: m,
-          class: B(["device", u.online && "online-device"])
-        }, [
-          I(l, {
-            icon: "user",
-            width: "16",
-            class: "device-avatar"
-          }),
-          _("span", {
-            title: u.id,
-            class: "device-name"
-          }, O(u.name.length > 0 ? u.name : u.id), 9, ze),
-          _("div", He, [
-            y(e.$slots, "device", {
-              device: u,
-              group: e.deviceGroup
-            }, void 0, !0)
-          ])
-        ], 2))), 128))
-      ])
-    ])) : j("", !0)
-  ], 2)) : j("", !0);
+      v("div", {
+        class: "device-show-div",
+        style: O(`height: ${t.filteredDevices.length > 10 ? "400px" : `${t.filteredDevices.length * 40}px`}`)
+      }, [
+        I(p, {
+          "list-data": t.filteredDevices,
+          "item-size": 40
+        }, {
+          default: C(({ data: d }) => [
+            v("div", {
+              class: x(d.online && "online-device")
+            }, [
+              I(a, {
+                icon: "user",
+                width: "16",
+                class: "device-avatar"
+              }),
+              v("span", {
+                title: d.id,
+                class: "device-name"
+              }, D(d.name.length > 0 ? d.name : d.id), 9, Nt),
+              v("div", Bt, [
+                $(t.$slots, "device", {
+                  device: d,
+                  group: t.deviceGroup
+                }, void 0, !0)
+              ])
+            ], 2)
+          ]),
+          _: 3
+        }, 8, ["list-data"])
+      ], 4)
+    ])) : M("", !0)
+  ], 2)) : M("", !0);
 }
-const De = /* @__PURE__ */ E(Pe, [["render", Ae], ["__scopeId", "data-v-100c06ff"]]), Ee = {
+const Ut = /* @__PURE__ */ F(Et, [["render", Rt], ["__scopeId", "data-v-3b55c8be"]]), Wt = {
   width: 1024,
   height: 1024,
   body: '<path fill="currentColor" d="M384 192v640l384-320.064z"/>'
-}, Te = {
+}, Kt = {
   width: 1024,
   height: 1024,
   body: '<path fill="currentColor" d="M878.08 448H241.92l-96 384h636.16l96-384zM832 384v-64H485.76L357.504 192H128v448l57.92-231.744A32 32 0 0 1 216.96 384H832zm-24.96 512H96a32 32 0 0 1-32-32V160a32 32 0 0 1 32-32h287.872l128.384 128H864a32 32 0 0 1 32 32v96h23.04a32 32 0 0 1 31.04 39.744l-112 448A32 32 0 0 1 807.04 896z"/>'
-}, Le = {
+}, qt = {
   width: 1024,
   height: 1024,
   body: '<path fill="currentColor" d="M628.736 528.896A416 416 0 0 1 928 928H96a415.872 415.872 0 0 1 299.264-399.104L512 704l116.736-175.104zM720 304a208 208 0 1 1-416 0a208 208 0 0 1 416 0z"/>'
-}, Be = {
+}, Jt = {
   width: 1024,
   height: 1024,
   body: '<path fill="currentColor" d="M480 480V128a32 32 0 0 1 64 0v352h352a32 32 0 1 1 0 64H544v352a32 32 0 1 1-64 0V544H128a32 32 0 0 1 0-64h352z"/>'
-}, Ne = {
+}, Qt = {
   width: 1024,
   height: 1024,
   body: '<path fill="currentColor" d="M128 544h768a32 32 0 1 0 0-64H128a32 32 0 0 0 0 64z"/>'
 };
-k("right", Ee);
-k("group", Te);
-k("user", Le);
-k("plus", Be);
-k("minus", Ne);
-const Re = F({
+P("right", Wt);
+P("group", Kt);
+P("user", qt);
+P("plus", Jt);
+P("minus", Qt);
+const Xt = j({
   components: {
-    CountShow: q,
-    GroupShow: De
+    CountShow: X,
+    GroupShow: Ut
   },
   props: {
     deviceGroup: Object,
@@ -566,57 +665,57 @@ const Re = F({
       this.controlParams.onlyShowOnline = !this.controlParams.onlyShowOnline;
     },
     onSearchChange() {
-      var e;
-      this.inputSearchRef && (this.controlParams.searchStr = (e = this.inputSearchRef) == null ? void 0 : e.value);
+      var t;
+      this.inputSearchRef && (this.controlParams.searchStr = (t = this.inputSearchRef) == null ? void 0 : t.value);
     },
-    search(e) {
-      this.controlParams.searchStr = e;
+    search(t) {
+      this.controlParams.searchStr = t;
     }
   },
-  setup(e) {
-    oe("theme", e.theme);
-    const n = z({
+  setup(t) {
+    st("theme", t.theme);
+    const n = y({
       onlyShowOnline: !1,
       searchStr: ""
     });
     return {
-      inputSearchRef: z(),
+      inputSearchRef: y(),
       controlParams: n
     };
   }
 });
-const Ve = (e) => (ne("data-v-7e0a8034"), e = e(), se(), e), xe = { class: "device-group-list" }, Ue = { class: "search-panel" }, We = /* @__PURE__ */ Ve(() => /* @__PURE__ */ _("label", { for: "onlineShow" }, "\u53EA\u663E\u793A\u5728\u7EBF\u8BBE\u5907", -1)), Ke = { class: "device-panel" };
-function qe(e, n, o, s, t, r) {
-  var a;
-  const i = $("CountShow"), l = $("group-show");
-  return p(), b("div", xe, [
-    _("div", Ue, [
-      I(i, { countInfo: e.deviceGroup }, {
+const Yt = (t) => (rt("data-v-7e0a8034"), t = t(), at(), t), Zt = { class: "device-group-list" }, te = { class: "search-panel" }, ee = /* @__PURE__ */ Yt(() => /* @__PURE__ */ v("label", { for: "onlineShow" }, "\u53EA\u663E\u793A\u5728\u7EBF\u8BBE\u5907", -1)), oe = { class: "device-panel" };
+function ne(t, n, o, i, e, s) {
+  var r;
+  const a = k("CountShow"), l = k("group-show");
+  return g(), S("div", Zt, [
+    v("div", te, [
+      I(a, { countInfo: t.deviceGroup }, {
         default: C(() => [
-          _("input", {
+          v("input", {
             type: "checkbox",
             id: "onlineShow",
             value: "onlineShow",
-            onChange: n[0] || (n[0] = (...d) => e.onCheckBoxChange && e.onCheckBoxChange(...d))
+            onChange: n[0] || (n[0] = (...u) => t.onCheckBoxChange && t.onCheckBoxChange(...u))
           }, null, 32),
-          We
+          ee
         ]),
         _: 1
       }, 8, ["countInfo"])
     ]),
-    _("div", Ke, [
-      (p(!0), b(H, null, A((a = e.deviceGroup) == null ? void 0 : a.items, (d, v) => (p(), P(l, {
-        controlParams: e.controlParams,
-        key: v,
-        deviceGroup: d
+    v("div", oe, [
+      (g(!0), S(E, null, T((r = t.deviceGroup) == null ? void 0 : r.items, (u, p) => (g(), G(l, {
+        controlParams: t.controlParams,
+        key: p,
+        deviceGroup: u
       }, {
-        group: C(({ group: u }) => [
-          y(e.$slots, "group", { group: u }, void 0, !0)
+        group: C(({ group: d }) => [
+          $(t.$slots, "group", { group: d }, void 0, !0)
         ]),
-        device: C(({ device: u, group: m }) => [
-          y(e.$slots, "device", {
-            device: u,
-            group: m
+        device: C(({ device: d, group: b }) => [
+          $(t.$slots, "device", {
+            device: d,
+            group: b
           }, void 0, !0)
         ]),
         _: 2
@@ -624,18 +723,18 @@ function qe(e, n, o, s, t, r) {
     ])
   ]);
 }
-const Je = /* @__PURE__ */ E(Re, [["render", qe], ["__scopeId", "data-v-7e0a8034"]]), K = {
-  RecursionDeviceGroup: Je
-}, Xe = {
-  install(e) {
-    for (const n in K) {
-      const o = K[n];
-      e.component(n, o);
+const ie = /* @__PURE__ */ F(Xt, [["render", ne], ["__scopeId", "data-v-7e0a8034"]]), Q = {
+  RecursionDeviceGroup: ie
+}, re = {
+  install(t) {
+    for (const n in Q) {
+      const o = Q[n];
+      t.component(n, o);
     }
   }
 };
 export {
   N as RecursionDeviceGroup,
-  Xe as default
+  re as default
 };
 //# sourceMappingURL=smarteye-e-components.mjs.map