@keqi.gress/plugin-ui 1.0.0 → 1.3.0

package/dist/index.js

@@ -1,4 +1,4 @@
-import { ref, computed, onMounted, onUnmounted, defineComponent, openBlock, createElementBlock, createElementVNode, toDisplayString, createCommentVNode, renderSlot } from "vue";
+import { ref, computed, onMounted, onUnmounted, defineComponent, openBlock, createElementBlock, renderSlot, createElementVNode, toDisplayString, createCommentVNode, normalizeClass, Fragment, renderList, watch, nextTick, createTextVNode, withDirectives, createStaticVNode, vModelSelect, withKeys, createVNode, Transition, withCtx, normalizeStyle, useSlots, createBlock, withModifiers } from "vue";
 function useLoadingState(options = {}) {
   const { initialLoading = false, onError } = options;
   const loading = ref(initialLoading);
@@ -172,6 +172,946 @@ function useResponsive() {
     breakpoints
   };
 }
+const _hoisted_1$9 = { class: "page-container" };
+const _sfc_main$a = /* @__PURE__ */ defineComponent({
+  __name: "PageContainer",
+  setup(__props) {
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1$9, [
+        renderSlot(_ctx.$slots, "default", {}, void 0, true)
+      ]);
+    };
+  }
+});
+const _export_sfc = (sfc, props) => {
+  const target = sfc.__vccOpts || sfc;
+  for (const [key, val] of props) {
+    target[key] = val;
+  }
+  return target;
+};
+const PageContainer = /* @__PURE__ */ _export_sfc(_sfc_main$a, [["__scopeId", "data-v-65bd80d8"]]);
+const _hoisted_1$8 = { class: "page-content" };
+const _sfc_main$9 = /* @__PURE__ */ defineComponent({
+  __name: "PageContent",
+  setup(__props) {
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1$8, [
+        renderSlot(_ctx.$slots, "default", {}, void 0, true)
+      ]);
+    };
+  }
+});
+const PageContent = /* @__PURE__ */ _export_sfc(_sfc_main$9, [["__scopeId", "data-v-7bbf9d25"]]);
+const _hoisted_1$7 = { class: "page-header" };
+const _hoisted_2$7 = { class: "page-header__content" };
+const _hoisted_3$6 = {
+  key: 0,
+  class: "page-header__prefix"
+};
+const _hoisted_4$6 = {
+  key: 1,
+  class: "page-header__left"
+};
+const _hoisted_5$6 = { class: "page-header__breadcrumb" };
+const _hoisted_6$4 = {
+  key: 0,
+  class: "breadcrumb-item"
+};
+const _hoisted_7$4 = {
+  key: 1,
+  class: "breadcrumb-separator"
+};
+const _hoisted_8$3 = { class: "breadcrumb-item breadcrumb-item--current" };
+const _hoisted_9$2 = {
+  key: 2,
+  class: "page-header__actions"
+};
+const _sfc_main$8 = /* @__PURE__ */ defineComponent({
+  __name: "PageHeader",
+  props: {
+    title: {},
+    breadcrumb: {}
+  },
+  setup(__props) {
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1$7, [
+        createElementVNode("div", _hoisted_2$7, [
+          _ctx.$slots.prefix ? (openBlock(), createElementBlock("div", _hoisted_3$6, [
+            renderSlot(_ctx.$slots, "prefix", {}, void 0, true)
+          ])) : (openBlock(), createElementBlock("div", _hoisted_4$6, [
+            createElementVNode("div", _hoisted_5$6, [
+              __props.breadcrumb ? (openBlock(), createElementBlock("div", _hoisted_6$4, [
+                createElementVNode("span", null, toDisplayString(__props.breadcrumb), 1)
+              ])) : createCommentVNode("", true),
+              __props.breadcrumb ? (openBlock(), createElementBlock("span", _hoisted_7$4, "/")) : createCommentVNode("", true),
+              createElementVNode("div", _hoisted_8$3, [
+                createElementVNode("span", null, toDisplayString(__props.title), 1)
+              ])
+            ])
+          ])),
+          _ctx.$slots.actions ? (openBlock(), createElementBlock("div", _hoisted_9$2, [
+            renderSlot(_ctx.$slots, "actions", {}, void 0, true)
+          ])) : createCommentVNode("", true)
+        ])
+      ]);
+    };
+  }
+});
+const PageHeader = /* @__PURE__ */ _export_sfc(_sfc_main$8, [["__scopeId", "data-v-4d82a654"]]);
+const _sfc_main$7 = /* @__PURE__ */ defineComponent({
+  __name: "CardList",
+  props: {
+    size: { default: "medium" },
+    minWidth: { default: "380px" }
+  },
+  setup(__props) {
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass(["card-list", { [`card-list--${__props.size}`]: __props.size }])
+      }, [
+        renderSlot(_ctx.$slots, "default", {}, void 0, true)
+      ], 2);
+    };
+  }
+});
+const CardList = /* @__PURE__ */ _export_sfc(_sfc_main$7, [["__scopeId", "data-v-f199a048"]]);
+const _hoisted_1$6 = {
+  key: 0,
+  class: "page-pagination"
+};
+const _hoisted_2$6 = { class: "pagination-controls" };
+const _hoisted_3$5 = ["disabled"];
+const _hoisted_4$5 = { class: "pagination-info" };
+const _hoisted_5$5 = ["disabled"];
+const _hoisted_6$3 = ["value"];
+const _hoisted_7$3 = ["value"];
+const _sfc_main$6 = /* @__PURE__ */ defineComponent({
+  __name: "PagePagination",
+  props: {
+    page: {},
+    pageSize: {},
+    total: {},
+    pageSizes: { default: () => [10, 20, 50, 100] },
+    showSizePicker: { type: Boolean, default: true }
+  },
+  emits: ["update:page", "update:pageSize"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const pageCount = computed(() => Math.ceil(props.total / props.pageSize));
+    function handlePageChange(page) {
+      if (page >= 1 && page <= pageCount.value) {
+        emit("update:page", page);
+      }
+    }
+    function handlePageSizeChange(pageSize) {
+      emit("update:pageSize", pageSize);
+      if (props.page > 1) {
+        emit("update:page", 1);
+      }
+    }
+    return (_ctx, _cache) => {
+      return __props.total > 0 ? (openBlock(), createElementBlock("div", _hoisted_1$6, [
+        renderSlot(_ctx.$slots, "default", {
+          page: __props.page,
+          pageSize: __props.pageSize,
+          pageCount: pageCount.value,
+          total: __props.total,
+          onPageChange: handlePageChange,
+          onPageSizeChange: handlePageSizeChange
+        }, () => [
+          createElementVNode("div", _hoisted_2$6, [
+            createElementVNode("button", {
+              class: "pagination-btn",
+              disabled: __props.page === 1,
+              onClick: _cache[0] || (_cache[0] = ($event) => handlePageChange(__props.page - 1))
+            }, " 上一页 ", 8, _hoisted_3$5),
+            createElementVNode("span", _hoisted_4$5, " 第 " + toDisplayString(__props.page) + " / " + toDisplayString(pageCount.value) + " 页，共 " + toDisplayString(__props.total) + " 条 ", 1),
+            createElementVNode("button", {
+              class: "pagination-btn",
+              disabled: __props.page === pageCount.value,
+              onClick: _cache[1] || (_cache[1] = ($event) => handlePageChange(__props.page + 1))
+            }, " 下一页 ", 8, _hoisted_5$5),
+            __props.showSizePicker ? (openBlock(), createElementBlock("select", {
+              key: 0,
+              class: "pagination-select",
+              value: __props.pageSize,
+              onChange: _cache[2] || (_cache[2] = ($event) => handlePageSizeChange(Number($event.target.value)))
+            }, [
+              (openBlock(true), createElementBlock(Fragment, null, renderList(__props.pageSizes, (size) => {
+                return openBlock(), createElementBlock("option", {
+                  key: size,
+                  value: size
+                }, toDisplayString(size) + " 条/页 ", 9, _hoisted_7$3);
+              }), 128))
+            ], 40, _hoisted_6$3)) : createCommentVNode("", true)
+          ])
+        ], true)
+      ])) : createCommentVNode("", true);
+    };
+  }
+});
+const PagePagination = /* @__PURE__ */ _export_sfc(_sfc_main$6, [["__scopeId", "data-v-bf918fa3"]]);
+const _hoisted_1$5 = { class: "log-toolbar" };
+const _hoisted_2$5 = { class: "toolbar-group" };
+const _hoisted_3$4 = { class: "btn-icon" };
+const _hoisted_4$4 = {
+  key: 0,
+  class: "log-loading"
+};
+const _hoisted_5$4 = {
+  key: 1,
+  class: "log-list"
+};
+const _hoisted_6$2 = { class: "log-timestamp" };
+const _hoisted_7$2 = {
+  key: 0,
+  class: "log-thread"
+};
+const _hoisted_8$2 = { class: "log-level" };
+const _hoisted_9$1 = {
+  key: 1,
+  class: "log-class"
+};
+const _hoisted_10$1 = { class: "log-message" };
+const _hoisted_11 = {
+  key: 2,
+  class: "log-error-detail"
+};
+const _hoisted_12 = { class: "log-error-message" };
+const _hoisted_13 = {
+  key: 2,
+  class: "log-empty"
+};
+const _sfc_main$5 = /* @__PURE__ */ defineComponent({
+  __name: "LogViewer",
+  props: {
+    logs: { default: () => [] },
+    loading: { type: Boolean, default: false },
+    autoScroll: { type: Boolean, default: true },
+    defaultTheme: { default: "light" }
+  },
+  emits: ["refresh", "clear"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const scrollbarRef = ref();
+    const filterLevel = ref("");
+    const theme = ref(props.defaultTheme);
+    const filteredLogs = computed(() => {
+      if (!filterLevel.value || filterLevel.value === "") {
+        return props.logs;
+      }
+      return props.logs.filter((log) => {
+        const logLevel = getLogLevel(log);
+        return logLevel === filterLevel.value;
+      });
+    });
+    watch(
+      () => props.logs.length,
+      () => {
+        if (props.autoScroll) {
+          nextTick(() => {
+            if (scrollbarRef.value) {
+              scrollbarRef.value.scrollTop = scrollbarRef.value.scrollHeight;
+            }
+          });
+        }
+      }
+    );
+    function handleRefresh() {
+      emit("refresh");
+    }
+    function handleClear() {
+      emit("clear");
+    }
+    function toggleTheme() {
+      theme.value = theme.value === "dark" ? "light" : "dark";
+    }
+    function getLogLevel(log) {
+      var _a;
+      if (log.level) return log.level.toUpperCase();
+      if ((_a = log.body) == null ? void 0 : _a.level) return String(log.body.level).toUpperCase();
+      const content = log.message || log.logContent || "";
+      const levelMatch = content.match(/\b(TRACE|DEBUG|INFO|WARN|ERROR|FATAL)\b/);
+      if (levelMatch) return levelMatch[1];
+      return "INFO";
+    }
+    function getThreadName(log) {
+      var _a;
+      if ((_a = log.body) == null ? void 0 : _a.threadName) return String(log.body.threadName);
+      if (log.threadName) return log.threadName;
+      return "";
+    }
+    function getLoggerName(log) {
+      var _a, _b;
+      if (log.logger) return log.logger;
+      if ((_a = log.body) == null ? void 0 : _a.logger) return String(log.body.logger);
+      if (log.className) return log.className;
+      if ((_b = log.body) == null ? void 0 : _b.className) return String(log.body.className);
+      return "";
+    }
+    function formatTimestamp(time) {
+      if (!time) return "--";
+      try {
+        const date = new Date(time);
+        const year = date.getFullYear();
+        const month = String(date.getMonth() + 1).padStart(2, "0");
+        const day = String(date.getDate()).padStart(2, "0");
+        const hours = String(date.getHours()).padStart(2, "0");
+        const minutes = String(date.getMinutes()).padStart(2, "0");
+        const seconds = String(date.getSeconds()).padStart(2, "0");
+        const ms = String(date.getMilliseconds()).padStart(3, "0");
+        return `${year}-${month}-${day} ${hours}:${minutes}:${seconds}.${ms}`;
+      } catch (error) {
+        return time;
+      }
+    }
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: normalizeClass(["log-viewer", { "log-viewer--dark": theme.value === "dark" }])
+      }, [
+        createElementVNode("div", _hoisted_1$5, [
+          createElementVNode("div", _hoisted_2$5, [
+            createElementVNode("button", {
+              class: "toolbar-btn",
+              onClick: handleRefresh
+            }, [..._cache[1] || (_cache[1] = [
+              createElementVNode("span", { class: "btn-icon" }, "↻", -1),
+              createTextVNode(" 刷新 ", -1)
+            ])]),
+            createElementVNode("button", {
+              class: "toolbar-btn",
+              onClick: handleClear
+            }, [..._cache[2] || (_cache[2] = [
+              createElementVNode("span", { class: "btn-icon" }, "🗑", -1),
+              createTextVNode(" 清空 ", -1)
+            ])]),
+            withDirectives(createElementVNode("select", {
+              "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => filterLevel.value = $event),
+              class: "toolbar-select"
+            }, [..._cache[3] || (_cache[3] = [
+              createStaticVNode('<option value="" data-v-c4c4657a>全部级别</option><option value="TRACE" data-v-c4c4657a>TRACE</option><option value="DEBUG" data-v-c4c4657a>DEBUG</option><option value="INFO" data-v-c4c4657a>INFO</option><option value="WARN" data-v-c4c4657a>WARN</option><option value="ERROR" data-v-c4c4657a>ERROR</option><option value="FATAL" data-v-c4c4657a>FATAL</option>', 7)
+            ])], 512), [
+              [vModelSelect, filterLevel.value]
+            ]),
+            createElementVNode("button", {
+              class: "toolbar-btn",
+              onClick: toggleTheme
+            }, [
+              createElementVNode("span", _hoisted_3$4, toDisplayString(theme.value === "dark" ? "☀" : "🌙"), 1),
+              createTextVNode(" " + toDisplayString(theme.value === "dark" ? "浅色" : "深色"), 1)
+            ])
+          ])
+        ]),
+        createElementVNode("div", {
+          class: "log-content",
+          ref_key: "scrollbarRef",
+          ref: scrollbarRef
+        }, [
+          __props.loading ? (openBlock(), createElementBlock("div", _hoisted_4$4, [..._cache[4] || (_cache[4] = [
+            createElementVNode("div", { class: "loading-spinner" }, null, -1),
+            createElementVNode("span", null, "加载中...", -1)
+          ])])) : filteredLogs.value.length > 0 ? (openBlock(), createElementBlock("div", _hoisted_5$4, [
+            (openBlock(true), createElementBlock(Fragment, null, renderList(filteredLogs.value, (log) => {
+              var _a, _b, _c;
+              return openBlock(), createElementBlock("div", {
+                key: log.id,
+                class: normalizeClass(["log-line", [`log-level-${(_a = getLogLevel(log)) == null ? void 0 : _a.toLowerCase()}`]])
+              }, [
+                createElementVNode("span", _hoisted_6$2, toDisplayString(formatTimestamp(log.timestamp || log.createTime)), 1),
+                getThreadName(log) ? (openBlock(), createElementBlock("span", _hoisted_7$2, "[" + toDisplayString(getThreadName(log)) + "]", 1)) : createCommentVNode("", true),
+                createElementVNode("span", _hoisted_8$2, toDisplayString(getLogLevel(log)), 1),
+                getLoggerName(log) ? (openBlock(), createElementBlock("span", _hoisted_9$1, toDisplayString(getLoggerName(log)), 1)) : createCommentVNode("", true),
+                _cache[6] || (_cache[6] = createElementVNode("span", { class: "log-separator" }, "-", -1)),
+                createElementVNode("span", _hoisted_10$1, toDisplayString(log.message || log.logContent), 1),
+                log.errorMessage || ((_b = log.body) == null ? void 0 : _b.errorMessage) ? (openBlock(), createElementBlock("div", _hoisted_11, [
+                  _cache[5] || (_cache[5] = createElementVNode("span", { class: "log-error-label" }, "错误:", -1)),
+                  createElementVNode("span", _hoisted_12, toDisplayString(log.errorMessage || ((_c = log.body) == null ? void 0 : _c.errorMessage)), 1)
+                ])) : createCommentVNode("", true)
+              ], 2);
+            }), 128))
+          ])) : (openBlock(), createElementBlock("div", _hoisted_13, [..._cache[7] || (_cache[7] = [
+            createElementVNode("div", { class: "empty-icon" }, "📋", -1),
+            createElementVNode("div", { class: "empty-text" }, "暂无日志", -1)
+          ])]))
+        ], 512)
+      ], 2);
+    };
+  }
+});
+const LogViewer = /* @__PURE__ */ _export_sfc(_sfc_main$5, [["__scopeId", "data-v-c4c4657a"]]);
+const _hoisted_1$4 = { class: "filter-card" };
+const _hoisted_2$4 = { class: "filter-inline" };
+const _hoisted_3$3 = { class: "filter-inline__fields" };
+const _hoisted_4$3 = {
+  key: 0,
+  class: "field-label"
+};
+const _hoisted_5$3 = ["value", "placeholder", "onInput"];
+const _hoisted_6$1 = { class: "toggle-icon" };
+const _hoisted_7$1 = {
+  key: 0,
+  class: "filter-grid"
+};
+const _hoisted_8$1 = {
+  key: 0,
+  class: "field-label"
+};
+const _hoisted_9 = ["value", "placeholder", "onInput"];
+const _hoisted_10 = {
+  key: 0,
+  class: "filter-grid__hint"
+};
+const TRANSITION_DURATION = 220;
+const _sfc_main$4 = /* @__PURE__ */ defineComponent({
+  __name: "FilterPanel",
+  props: {
+    filters: {},
+    basicFields: {},
+    advancedFields: { default: () => [] },
+    showAdvanced: { type: Boolean, default: false },
+    searchText: { default: "查询" },
+    resetText: { default: "重置" },
+    expandText: { default: "展开" },
+    collapseText: { default: "收起" },
+    actionAlign: { default: "right" }
+  },
+  emits: ["update:filters", "update:showAdvanced", "search", "reset"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const hasAdvancedFields = computed(
+      () => {
+        var _a;
+        return (((_a = props.advancedFields) == null ? void 0 : _a.length) ?? 0) > 0;
+      }
+    );
+    const showAdvanced = computed(() => props.showAdvanced ?? false);
+    const actionAlign = computed(() => props.actionAlign ?? "right");
+    function getValue(key) {
+      var _a;
+      return (_a = props.filters) == null ? void 0 : _a[key];
+    }
+    function updateField(key, value) {
+      emit("update:filters", {
+        ...props.filters,
+        [key]: value
+      });
+    }
+    function slotUpdater(key) {
+      return (value) => updateField(key, value);
+    }
+    function toggleAdvanced() {
+      emit("update:showAdvanced", !showAdvanced.value);
+    }
+    function emitSearch() {
+      emit("search");
+    }
+    function emitReset() {
+      emit("reset");
+    }
+    function beforeExpand(el) {
+      const element = el;
+      element.style.height = "0";
+      element.style.opacity = "0";
+    }
+    function onExpand(el) {
+      const element = el;
+      requestAnimationFrame(() => {
+        element.style.transition = `height ${TRANSITION_DURATION}ms ease, opacity ${TRANSITION_DURATION}ms ease`;
+        element.style.height = `${element.scrollHeight}px`;
+        element.style.opacity = "1";
+      });
+    }
+    function afterExpand(el) {
+      const element = el;
+      element.style.height = "";
+      element.style.opacity = "";
+      element.style.transition = "";
+    }
+    function beforeCollapse(el) {
+      const element = el;
+      element.style.height = `${element.scrollHeight}px`;
+      element.style.opacity = "1";
+    }
+    function onCollapse(el, done) {
+      const element = el;
+      requestAnimationFrame(() => {
+        element.style.transition = `height ${TRANSITION_DURATION}ms ease, opacity ${TRANSITION_DURATION}ms ease`;
+        element.style.height = "0";
+        element.style.opacity = "0";
+        setTimeout(done, TRANSITION_DURATION);
+      });
+    }
+    function afterCollapse(el) {
+      const element = el;
+      element.style.height = "";
+      element.style.opacity = "";
+      element.style.transition = "";
+    }
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", _hoisted_1$4, [
+        createElementVNode("div", _hoisted_2$4, [
+          createElementVNode("div", _hoisted_3$3, [
+            (openBlock(true), createElementBlock(Fragment, null, renderList(__props.basicFields, (field) => {
+              return openBlock(), createElementBlock("div", {
+                key: field.key,
+                class: "filter-inline__field"
+              }, [
+                field.label ? (openBlock(), createElementBlock("span", _hoisted_4$3, toDisplayString(field.label) + "：", 1)) : createCommentVNode("", true),
+                renderSlot(_ctx.$slots, field.slotName || `field-${field.key}`, {
+                  field,
+                  value: getValue(field.key),
+                  update: slotUpdater(field.key)
+                }, () => [
+                  !field.type || field.type === "input" ? (openBlock(), createElementBlock("input", {
+                    key: 0,
+                    value: getValue(field.key) ?? "",
+                    placeholder: field.placeholder,
+                    class: "filter-input",
+                    onInput: ($event) => updateField(field.key, $event.target.value),
+                    onKeyup: withKeys(emitSearch, ["enter"])
+                  }, null, 40, _hoisted_5$3)) : createCommentVNode("", true)
+                ], true)
+              ]);
+            }), 128))
+          ]),
+          createElementVNode("div", {
+            class: normalizeClass(["filter-inline__actions", `align-${actionAlign.value}`])
+          }, [
+            renderSlot(_ctx.$slots, "actions", {
+              onReset: emitReset,
+              onSearch: emitSearch
+            }, () => [
+              createElementVNode("button", {
+                class: "filter-btn filter-btn--secondary",
+                onClick: emitReset
+              }, toDisplayString(__props.resetText), 1),
+              createElementVNode("button", {
+                class: "filter-btn filter-btn--primary",
+                onClick: emitSearch
+              }, toDisplayString(__props.searchText), 1)
+            ], true),
+            hasAdvancedFields.value ? (openBlock(), createElementBlock("button", {
+              key: 0,
+              class: "inline-toggle",
+              onClick: toggleAdvanced
+            }, [
+              createTextVNode(toDisplayString(showAdvanced.value ? __props.collapseText : __props.expandText) + " ", 1),
+              createElementVNode("span", _hoisted_6$1, toDisplayString(showAdvanced.value ? "▲" : "▼"), 1)
+            ])) : createCommentVNode("", true)
+          ], 2)
+        ]),
+        createVNode(Transition, {
+          onBeforeEnter: beforeExpand,
+          onEnter: onExpand,
+          onAfterEnter: afterExpand,
+          onBeforeLeave: beforeCollapse,
+          onLeave: onCollapse,
+          onAfterLeave: afterCollapse
+        }, {
+          default: withCtx(() => [
+            showAdvanced.value && hasAdvancedFields.value ? (openBlock(), createElementBlock("div", _hoisted_7$1, [
+              (openBlock(true), createElementBlock(Fragment, null, renderList(__props.advancedFields, (field) => {
+                return openBlock(), createElementBlock("div", {
+                  key: field.key,
+                  class: "filter-grid__field",
+                  style: normalizeStyle(field.span ? { gridColumn: `span ${field.span}` } : void 0)
+                }, [
+                  field.label ? (openBlock(), createElementBlock("span", _hoisted_8$1, toDisplayString(field.label) + "：", 1)) : createCommentVNode("", true),
+                  renderSlot(_ctx.$slots, field.slotName || `field-${field.key}`, {
+                    field,
+                    value: getValue(field.key),
+                    update: slotUpdater(field.key)
+                  }, () => [
+                    !field.type || field.type === "input" ? (openBlock(), createElementBlock("input", {
+                      key: 0,
+                      value: getValue(field.key) ?? "",
+                      placeholder: field.placeholder,
+                      class: "filter-input",
+                      onInput: ($event) => updateField(field.key, $event.target.value)
+                    }, null, 40, _hoisted_9)) : createCommentVNode("", true)
+                  ], true)
+                ], 4);
+              }), 128)),
+              _ctx.$slots["advanced-hint"] ? (openBlock(), createElementBlock("div", _hoisted_10, [
+                renderSlot(_ctx.$slots, "advanced-hint", {}, void 0, true)
+              ])) : createCommentVNode("", true)
+            ])) : createCommentVNode("", true)
+          ]),
+          _: 3
+        })
+      ]);
+    };
+  }
+});
+const FilterPanel = /* @__PURE__ */ _export_sfc(_sfc_main$4, [["__scopeId", "data-v-8db9aa68"]]);
+const _hoisted_1$3 = { class: "header-content" };
+const _hoisted_2$3 = {
+  key: 0,
+  class: "header-icon"
+};
+const _hoisted_3$2 = ["src"];
+const _hoisted_4$2 = { class: "header-info" };
+const _hoisted_5$2 = {
+  key: 0,
+  class: "header-subtitle"
+};
+const _hoisted_6 = { class: "header-title" };
+const _hoisted_7 = {
+  key: 0,
+  class: "header-actions"
+};
+const _hoisted_8 = {
+  key: 0,
+  class: "footer-actions"
+};
+const _sfc_main$3 = /* @__PURE__ */ defineComponent({
+  __name: "UniversalModal",
+  props: {
+    show: { type: Boolean },
+    title: { default: "" },
+    subtitle: { default: "" },
+    iconUrl: {},
+    iconSize: {},
+    width: { default: "500px" },
+    height: { default: "auto" },
+    maxWidth: { default: "90vw" },
+    maxHeight: { default: "90vh" },
+    position: { default: "right" },
+    top: { default: "24px" },
+    bottom: { default: "24px" },
+    left: { default: "24px" },
+    right: { default: "24px" },
+    showMask: { type: Boolean, default: false },
+    maskClosable: { type: Boolean, default: true },
+    hideHeader: { type: Boolean, default: false },
+    hideFooter: { type: Boolean, default: true },
+    hideClose: { type: Boolean, default: false },
+    showCancel: { type: Boolean, default: false },
+    showConfirm: { type: Boolean, default: false },
+    showFullscreen: { type: Boolean, default: true },
+    resizable: { type: Boolean, default: true },
+    cancelText: { default: "取消" },
+    confirmText: { default: "确定" },
+    headerClass: {},
+    bodyClass: {},
+    footerClass: {},
+    customClass: {},
+    zIndex: { default: 9999 },
+    fullscreen: { type: Boolean, default: false }
+  },
+  emits: ["update:show", "close", "cancel", "confirm"],
+  setup(__props, { emit: __emit }) {
+    const props = __props;
+    const emit = __emit;
+    const slots = useSlots();
+    const isFullscreen = ref(false);
+    const modalRef = ref(null);
+    const resizing = ref(false);
+    const resizeDirection = ref("");
+    const modalSize = ref({
+      width: 0,
+      height: 0,
+      top: 0,
+      left: 0,
+      right: 0,
+      bottom: 0
+    });
+    const shouldShowFooter = computed(() => {
+      if (props.hideFooter) return false;
+      if (slots.footer) return true;
+      if (props.showCancel || props.showConfirm) return true;
+      return false;
+    });
+    const transitionName = computed(() => {
+      switch (props.position) {
+        case "left":
+          return "slide-left";
+        case "right":
+          return "slide-right";
+        case "top":
+          return "slide-top";
+        case "bottom":
+          return "slide-bottom";
+        case "center":
+        default:
+          return "fade-scale";
+      }
+    });
+    const wrapperClass = computed(() => {
+      return [
+        `position-${props.position}`,
+        props.fullscreen ? "fullscreen" : "",
+        props.showMask ? "with-mask" : "no-mask"
+      ];
+    });
+    const wrapperStyle = computed(() => {
+      const style = {};
+      if (!props.showMask) {
+        style.background = "transparent";
+        style.pointerEvents = "none";
+      }
+      return style;
+    });
+    const modalClass = computed(() => {
+      return [
+        `modal-${props.position}`,
+        props.customClass,
+        props.fullscreen ? "modal-fullscreen" : ""
+      ];
+    });
+    const modalStyle = computed(() => {
+      const style = {
+        zIndex: String(props.zIndex)
+      };
+      if (props.fullscreen) return style;
+      if (props.width) {
+        style.width = typeof props.width === "number" ? `${props.width}px` : props.width;
+      }
+      if (props.height && props.height !== "auto") {
+        style.height = typeof props.height === "number" ? `${props.height}px` : props.height;
+      }
+      if (props.maxWidth) {
+        style.maxWidth = typeof props.maxWidth === "number" ? `${props.maxWidth}px` : props.maxWidth;
+      }
+      if (props.maxHeight) {
+        style.maxHeight = typeof props.maxHeight === "number" ? `${props.maxHeight}px` : props.maxHeight;
+      }
+      if (props.position !== "center") {
+        if (props.top) style.top = typeof props.top === "number" ? `${props.top}px` : props.top;
+        if (props.bottom) style.bottom = typeof props.bottom === "number" ? `${props.bottom}px` : props.bottom;
+        if (props.left && props.position === "left") style.left = typeof props.left === "number" ? `${props.left}px` : props.left;
+        if (props.right && props.position === "right") style.right = typeof props.right === "number" ? `${props.right}px` : props.right;
+      }
+      return style;
+    });
+    const bodyStyle = computed(() => {
+      const style = {};
+      if (props.height && props.height !== "auto") {
+        style.overflowY = "auto";
+      }
+      return style;
+    });
+    const computedModalStyle = computed(() => {
+      const style = { ...modalStyle.value };
+      if (isFullscreen.value) {
+        return {
+          ...style,
+          width: "100vw !important",
+          height: "100vh !important",
+          maxWidth: "100vw !important",
+          maxHeight: "100vh !important",
+          top: "0 !important",
+          left: "0 !important",
+          right: "0 !important",
+          bottom: "0 !important"
+        };
+      }
+      if (resizing.value || modalSize.value.width > 0) {
+        if (modalSize.value.width > 0) style.width = `${modalSize.value.width}px`;
+        if (modalSize.value.height > 0) style.height = `${modalSize.value.height}px`;
+        if (props.position === "right" && modalSize.value.right >= 0) style.right = `${modalSize.value.right}px`;
+        if (props.position === "left" && modalSize.value.left >= 0) style.left = `${modalSize.value.left}px`;
+        if (modalSize.value.top >= 0) style.top = `${modalSize.value.top}px`;
+        if (modalSize.value.bottom >= 0) style.bottom = `${modalSize.value.bottom}px`;
+      }
+      return style;
+    });
+    function handleClose() {
+      emit("update:show", false);
+      emit("close");
+    }
+    function handleCancel() {
+      emit("cancel");
+      handleClose();
+    }
+    function handleConfirm() {
+      emit("confirm");
+    }
+    function handleMaskClick() {
+      if (props.maskClosable) {
+        handleClose();
+      }
+    }
+    function toggleFullscreen() {
+      isFullscreen.value = !isFullscreen.value;
+    }
+    function startResize(direction) {
+      if (!modalRef.value) return;
+      resizing.value = true;
+      resizeDirection.value = direction;
+      const rect = modalRef.value.getBoundingClientRect();
+      modalSize.value = {
+        width: rect.width,
+        height: rect.height,
+        top: rect.top,
+        left: rect.left,
+        right: window.innerWidth - rect.right,
+        bottom: window.innerHeight - rect.bottom
+      };
+      document.addEventListener("mousemove", handleResize);
+      document.addEventListener("mouseup", stopResize);
+      document.body.style.cursor = getCursor(direction);
+      document.body.style.userSelect = "none";
+    }
+    function handleResize(e) {
+      if (!resizing.value || !modalRef.value) return;
+      const direction = resizeDirection.value;
+      if (direction === "right") {
+        if (props.position === "right") {
+          const newRight = window.innerWidth - e.clientX;
+          modalSize.value.right = Math.max(0, newRight);
+          modalSize.value.width = e.clientX - modalSize.value.left;
+        } else {
+          modalSize.value.width = e.clientX - modalSize.value.left;
+        }
+      } else if (direction === "left") {
+        if (props.position === "left") {
+          modalSize.value.left = e.clientX;
+          modalSize.value.width = window.innerWidth - e.clientX - modalSize.value.right;
+        } else {
+          const newWidth = modalSize.value.width + (modalSize.value.left - e.clientX);
+          modalSize.value.width = newWidth;
+          modalSize.value.left = e.clientX;
+        }
+      } else if (direction === "top") {
+        const newHeight = modalSize.value.height + (modalSize.value.top - e.clientY);
+        modalSize.value.height = Math.max(200, newHeight);
+        modalSize.value.top = e.clientY;
+      } else if (direction === "bottom") {
+        modalSize.value.height = e.clientY - modalSize.value.top;
+        modalSize.value.bottom = window.innerHeight - e.clientY;
+      }
+    }
+    function stopResize() {
+      resizing.value = false;
+      resizeDirection.value = "";
+      document.removeEventListener("mousemove", handleResize);
+      document.removeEventListener("mouseup", stopResize);
+      document.body.style.cursor = "";
+      document.body.style.userSelect = "";
+    }
+    function getCursor(direction) {
+      switch (direction) {
+        case "top":
+        case "bottom":
+          return "ns-resize";
+        case "left":
+        case "right":
+          return "ew-resize";
+        default:
+          return "default";
+      }
+    }
+    onUnmounted(() => {
+      if (resizing.value) {
+        stopResize();
+      }
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createBlock(Transition, { name: transitionName.value }, {
+        default: withCtx(() => [
+          __props.show ? (openBlock(), createElementBlock("div", {
+            key: 0,
+            class: normalizeClass(["universal-modal-wrapper", wrapperClass.value]),
+            style: normalizeStyle(wrapperStyle.value),
+            onClick: withModifiers(handleMaskClick, ["self"])
+          }, [
+            createElementVNode("div", {
+              ref_key: "modalRef",
+              ref: modalRef,
+              class: normalizeClass(["universal-modal", modalClass.value]),
+              style: normalizeStyle(computedModalStyle.value)
+            }, [
+              !isFullscreen.value && __props.resizable && (__props.position === "right" || __props.position === "left") ? (openBlock(), createElementBlock("div", {
+                key: 0,
+                class: "resize-handle resize-handle-left",
+                onMousedown: _cache[0] || (_cache[0] = ($event) => startResize("left"))
+              }, null, 32)) : createCommentVNode("", true),
+              !isFullscreen.value && __props.resizable && (__props.position === "right" || __props.position === "left") ? (openBlock(), createElementBlock("div", {
+                key: 1,
+                class: "resize-handle resize-handle-right",
+                onMousedown: _cache[1] || (_cache[1] = ($event) => startResize("right"))
+              }, null, 32)) : createCommentVNode("", true),
+              !isFullscreen.value && __props.resizable ? (openBlock(), createElementBlock("div", {
+                key: 2,
+                class: "resize-handle resize-handle-top",
+                onMousedown: _cache[2] || (_cache[2] = ($event) => startResize("top"))
+              }, null, 32)) : createCommentVNode("", true),
+              !isFullscreen.value && __props.resizable ? (openBlock(), createElementBlock("div", {
+                key: 3,
+                class: "resize-handle resize-handle-bottom",
+                onMousedown: _cache[3] || (_cache[3] = ($event) => startResize("bottom"))
+              }, null, 32)) : createCommentVNode("", true),
+              !__props.hideHeader ? (openBlock(), createElementBlock("div", {
+                key: 4,
+                class: normalizeClass(["modal-header", __props.headerClass])
+              }, [
+                renderSlot(_ctx.$slots, "header", {}, () => [
+                  createElementVNode("div", _hoisted_1$3, [
+                    __props.iconUrl ? (openBlock(), createElementBlock("div", _hoisted_2$3, [
+                      createElementVNode("img", {
+                        src: __props.iconUrl,
+                        class: "header-icon-img",
+                        alt: "icon"
+                      }, null, 8, _hoisted_3$2)
+                    ])) : createCommentVNode("", true),
+                    createElementVNode("div", _hoisted_4$2, [
+                      __props.subtitle ? (openBlock(), createElementBlock("div", _hoisted_5$2, toDisplayString(__props.subtitle), 1)) : createCommentVNode("", true),
+                      createElementVNode("div", _hoisted_6, toDisplayString(__props.title), 1)
+                    ])
+                  ])
+                ], true),
+                !__props.hideClose ? (openBlock(), createElementBlock("div", _hoisted_7, [
+                  renderSlot(_ctx.$slots, "header-actions", {}, void 0, true),
+                  __props.showFullscreen ? (openBlock(), createElementBlock("button", {
+                    key: 0,
+                    class: "header-btn",
+                    onClick: toggleFullscreen
+                  }, toDisplayString(isFullscreen.value ? "⊡" : "⊞"), 1)) : createCommentVNode("", true),
+                  createElementVNode("button", {
+                    class: "header-btn",
+                    onClick: handleClose
+                  }, " ✕ ")
+                ])) : createCommentVNode("", true)
+              ], 2)) : createCommentVNode("", true),
+              createElementVNode("div", {
+                class: normalizeClass(["modal-body", __props.bodyClass]),
+                style: normalizeStyle(bodyStyle.value)
+              }, [
+                renderSlot(_ctx.$slots, "default", {}, void 0, true)
+              ], 6),
+              shouldShowFooter.value ? (openBlock(), createElementBlock("div", {
+                key: 5,
+                class: normalizeClass(["modal-footer", __props.footerClass])
+              }, [
+                renderSlot(_ctx.$slots, "footer", {}, () => [
+                  __props.showCancel || __props.showConfirm ? (openBlock(), createElementBlock("div", _hoisted_8, [
+                    __props.showCancel ? (openBlock(), createElementBlock("button", {
+                      key: 0,
+                      class: "footer-btn footer-btn--cancel",
+                      onClick: handleCancel
+                    }, toDisplayString(__props.cancelText), 1)) : createCommentVNode("", true),
+                    __props.showConfirm ? (openBlock(), createElementBlock("button", {
+                      key: 1,
+                      class: "footer-btn footer-btn--confirm",
+                      onClick: handleConfirm
+                    }, toDisplayString(__props.confirmText), 1)) : createCommentVNode("", true)
+                  ])) : createCommentVNode("", true)
+                ], true)
+              ], 2)) : createCommentVNode("", true)
+            ], 6)
+          ], 6)) : createCommentVNode("", true)
+        ]),
+        _: 3
+      }, 8, ["name"]);
+    };
+  }
+});
+const UniversalModal = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["__scopeId", "data-v-c1a551dc"]]);
 const _hoisted_1$2 = { class: "loading-container" };
 const _hoisted_2$2 = {
   key: 0,
@@ -191,14 +1131,7 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const _export_sfc = (sfc, props) => {
-  const target = sfc.__vccOpts || sfc;
-  for (const [key, val] of props) {
-    target[key] = val;
-  }
-  return target;
-};
-const LoadingState = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-88be2f1a"]]);
+const LoadingState = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["__scopeId", "data-v-d3a7a28f"]]);
 const _hoisted_1$1 = { class: "empty-state" };
 const _hoisted_2$1 = { class: "empty-icon" };
 const _hoisted_3$1 = { class: "empty-title" };
@@ -249,7 +1182,7 @@ const _sfc_main$1 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const EmptyState = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-12ee016f"]]);
+const EmptyState = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["__scopeId", "data-v-a29f92b8"]]);
 const _hoisted_1 = { class: "error-container" };
 const _hoisted_2 = { class: "error-icon" };
 const _hoisted_3 = { class: "error-title" };
@@ -315,11 +1248,19 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const ErrorState = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-9bbae138"]]);
+const ErrorState = /* @__PURE__ */ _export_sfc(_sfc_main, [["__scopeId", "data-v-c6d5c909"]]);
 export {
+  CardList,
   EmptyState,
   ErrorState,
-  LoadingState as LoadingStateComponent,
+  FilterPanel,
+  LoadingState,
+  LogViewer,
+  PageContainer,
+  PageContent,
+  PageHeader,
+  PagePagination,
+  UniversalModal,
   breakpoints,
   useLoadingState,
   useResponsive