import '@das-fed/ui/packages/business-components/app-container/style.css';
import { withInstall as U } from "@das-fed/utils/with-install/index";
import { defineComponent as $, computed as k, ref as M, watch as z, onMounted as O, createBlock as f, openBlock as a, unref as i, withCtx as h, createElementVNode as l, normalizeStyle as x, normalizeClass as G, createElementBlock as r, Fragment as g, renderList as _, createCommentVNode as D, toDisplayString as y, withDirectives as q, createTextVNode as j } from "vue";
import { ElRow as J, ElCol as K } from "element-plus";
import "element-plus/es/components/row/style/css";
import "element-plus/es/components/col/style/css";
import { DasEmpty as Q } from "@das-fed/ui/packages/components/empty/index";
import { vDasTooltip as T } from "@das-fed/ui/packages/components/text-tooltip/index";
import { DasScrollbar as X } from "@das-fed/ui/packages/components/scrollbar/index";
import { pureImageSrc as E } from "@das-fed/utils/pure-image-src";
import { setThemeRule as Y } from "@das-fed/web/packages/theme/index";
const H = {
  "--das-application-app-bg-color": {
    kjl: "#2673DC",
    cjb: "#343848",
    ssl: "#2D314F"
  },
  "--das-application-app-color": {
    kjl: "#FFFFFF",
    cjb: "#FFFFFF",
    ssl: "#FFFFFF"
  }
}, Z = {
  key: 0,
  class: "application-list"
}, A = { class: "table" }, tt = { class: "table-cell column_1" }, et = { class: "app-name" }, ot = { class: "table-cell column_2" }, nt = { class: "column_2_content" }, ct = ["onClick"], at = { class: "sub-app-item" }, st = ["src"], lt = { class: "sub-app-item-content" }, it = { class: "name" }, rt = { class: "describe" }, pt = /* @__PURE__ */ $({
  __name: "index",
  props: {
    theme: { default: "default" },
    appCategorys: { default: () => [] }
  },
  emits: ["open-app"],
  setup(N, { emit: b }) {
    const p = N, I = b, L = k(() => {
      const t = {};
      return p.theme === "default" || Object.keys(H).forEach((e) => {
        var o;
        t[e] = (o = H[e]) == null ? void 0 : o[p.theme];
      }), t;
    }), R = (t) => I("open-app", t), S = M("18px"), F = (t, e) => {
      if (!e) return;
      if (e.offsetWidth > t) {
        const s = parseInt(window.getComputedStyle(e).fontSize) - 1;
        e.style.fontSize = s + "px", S.value = s + "px", F(t, e);
      }
    }, V = () => new Promise((t) => {
      const e = () => {
        const o = document.querySelectorAll(".application-content .column_1 .app-name");
        if (o != null && o.length && o.length === p.appCategorys.length) return t();
        setTimeout(() => e(), 50);
      };
      e();
    }), C = async () => {
      await V();
      const t = document.querySelectorAll(".application-content .column_1 .app-name")[0];
      if (!t) return;
      const e = parseInt(getComputedStyle(t).paddingLeft) || 0, o = parseInt(getComputedStyle(t).paddingRight) || 0, c = t.clientWidth - e - o;
      let s = 0, n = null;
      document.querySelectorAll(".application-content .column_1 .app-name > .text").forEach((d) => {
        const u = d.offsetWidth;
        u > s && (s = u, n = d);
      }), F(c, n);
    }, W = () => new Promise((t) => {
      const e = () => {
        const o = document.querySelectorAll(".application-content .column_1"), c = document.querySelectorAll(".application-content .column_2");
        if (o != null && o.length && o.length === p.appCategorys.length && (c != null && c.length) && c.length === p.appCategorys.length)
          return t();
        setTimeout(() => e(), 50);
      };
      e();
    }), v = async () => {
      await W(), document.querySelectorAll(".application-content .application-list .table .table-row").forEach((e) => {
        const o = e.querySelector(".column_1"), c = e.querySelector(".column_2>.column_2_content"), s = o.offsetHeight, n = c.offsetHeight;
        if (s > n) {
          const m = s - n, d = c.querySelectorAll(".app-row"), u = d.length;
          d.forEach((w) => {
            const P = w.offsetHeight;
            w.style.height = P + m / u + "px";
          });
        }
      });
    }, B = k(() => p.appCategorys.map((t) => t.name));
    return z(() => B.value, C, { deep: !0 }), z(() => p.appCategorys, v, { deep: !0 }), O(() => {
      C(), v();
    }), (t, e) => (a(), f(i(X), null, {
      default: h(() => [
        l(
          "div",
          {
            class: G(["application-content", `theme-${t.theme}`]),
            style: x(L.value)
          },
          [
            t.appCategorys && t.appCategorys.length ? (a(), r("div", Z, [
              (a(!0), r(
                g,
                null,
                _(t.appCategorys, (o, c) => (a(), r("div", A, [
                  (a(), r("div", {
                    key: c,
                    class: "table-row"
                  }, [
                    D(" 第一列 "),
                    l("div", tt, [
                      l("div", et, [
                        l(
                          "span",
                          {
                            class: "text",
                            style: x({ fontSize: S.value })
                          },
                          y(o.name),
                          5
                          /* TEXT, STYLE */
                        )
                      ])
                    ]),
                    D(" 第二列 "),
                    l("div", ot, [
                      l("div", nt, [
                        (a(!0), r(
                          g,
                          null,
                          _(o.apps, (s) => (a(), f(
                            i(J),
                            {
                              class: "app-row",
                              gutter: 20
                            },
                            {
                              default: h(() => [
                                (a(!0), r(
                                  g,
                                  null,
                                  _(s, (n, m) => (a(), f(
                                    i(K),
                                    {
                                      class: "app-col",
                                      key: m,
                                      span: 6
                                    },
                                    {
                                      default: h(() => [
                                        l("div", {
                                          class: "sub-app",
                                          onClick: (d) => R(n)
                                        }, [
                                          l("div", at, [
                                            l("img", {
                                              class: "img",
                                              src: n != null && n.iconDomain ? n.iconDomain + i(E)(n == null ? void 0 : n.iconUrl) : i(E)(n == null ? void 0 : n.iconUrl),
                                              alt: ""
                                            }, null, 8, st),
                                            l("div", lt, [
                                              q((a(), r("div", it, [
                                                j(
                                                  y(n.name),
                                                  1
                                                  /* TEXT */
                                                )
                                              ])), [
                                                [i(T)]
                                              ]),
                                              q((a(), r("div", rt, [
                                                j(
                                                  y(n.description),
                                                  1
                                                  /* TEXT */
                                                )
                                              ])), [
                                                [i(T)]
                                              ])
                                            ])
                                          ])
                                        ], 8, ct)
                                      ]),
                                      _: 2
                                      /* DYNAMIC */
                                    },
                                    1024
                                    /* DYNAMIC_SLOTS */
                                  ))),
                                  128
                                  /* KEYED_FRAGMENT */
                                ))
                              ]),
                              _: 2
                              /* DYNAMIC */
                            },
                            1024
                            /* DYNAMIC_SLOTS */
                          ))),
                          256
                          /* UNKEYED_FRAGMENT */
                        ))
                      ])
                    ])
                  ]))
                ]))),
                256
                /* UNKEYED_FRAGMENT */
              ))
            ])) : (a(), f(i(Q), {
              key: 1,
              size: "large"
            }))
          ],
          6
          /* CLASS, STYLE */
        )
      ]),
      _: 1
      /* STABLE */
    }));
  }
}), dt = {
  "--das-application-app-bg-color": "#343848",
  "--das-application-app-color": "#ffffff",
  "--das-application-subapp-bg-color": "#ffffff",
  "--das-application-subapp-name-color": "#212121",
  "--das-application-subapp-describe-color": "#999999"
};
Y(dt);
const vt = U(pt);
export {
  vt as DasAppContainer
};
