ss_new_ui_skin_and_page/js/vue/ss-components.js

import { ssIcon, commonIcon } from "./icon-config.js";
import * as IndexComponents from "./ss-index-components.js";
import * as EchartComponents from "./ss-echarts-compnents.js";
import { isNum, toStyleStr } from "./tools.js";
import { EVEN_VAR } from "./EventBus.js";

// import * as elements from "../lib/element-plus.js";
(function () {
  const {
    createApp,
    ref,
    reactive,
    watch,
    onMounted,
    onBeforeUnmount,
    h,
    computed,
    resolveComponent,
    watchEffect,
    nextTick,
    onVnodeMounted,
    Teleport,
    inject,
    provide,
  } = Vue;

  // 弹窗默认遮罩z-index
  let currentZIndex = 100;
  //   目前已存在的弹窗
  const topWindow = window.top;
  topWindow.dialogInstances = topWindow.dialogInstances || [];
  // 新建弹窗
  function createSsDialogInstance(setting, callbackEvent) {
    currentZIndex += 10; // 动态提升 z-index
    const container = document.createElement("div");
    document.body.appendChild(container);
    const app = Vue.createApp({
      render() {
        return h(SsDialog, {
          ...setting,
          zIndex: currentZIndex,
          onClose() {
            document.body.removeChild(container); // 仅移除弹窗容器
            const index = topWindow.dialogInstances.indexOf(app);
            if (index > -1) {
              topWindow.dialogInstances.splice(index, 1); // 移除实例
            }
            // 关闭后的回调
            if (callbackEvent && typeof callbackEvent === "function") {
              callbackEvent();
            }
            app.unmount(); // 仅卸载弹窗实例
            if (container.parentNode) {
              container.parentNode.removeChild(container); // 确保移除容器
            }
          },
        });
      },
    });
    topWindow.dialogInstances.push({ app, callbackEvent, container });
    app.component("ss-mark", SsMark); // 注册 ss-mark 组件
    app.component("ss-icon", SsIcon);
    app.component("ss-full-style-header", SsFullStyleHeader); // 注册 ss-full-style-header 组件
    app.mount(container);
  }
  // ss-breadcrumb 一级菜单页面面包屑
  const SsBreadcrumb = {
    name: "SsBreadcrumb",
    props: {
      level: {
        type: Object,
        default: null,
      },
    },
    setup(props) {
      const currentMenu = ref(null);
      const folderPath = ref([]);
      const eventBus = window.parent.sharedEventBus;

      // 监听页面变化
      onMounted(() => {
        // 获取初始页面
        currentMenu.value = eventBus.getState(EVEN_VAR.currentPage);
        folderPath.value = eventBus.getState("folderPath") || [];

        // 订阅页面变化
        eventBus.subscribe(EVEN_VAR.currentPage, (page) => {
          currentMenu.value = page;
        });
        eventBus.subscribe("folderPath", (path) => {
          folderPath.value = path || [];
        });
      });
      // 修改点击处理函数
      const handlePathClick = (index) => {
        if (props.level?.onBack) {
          // 截取到点击的位置，后面的路径会被销毁
          const newPath = folderPath.value.slice(0, index + 1);
          eventBus.publish("folderPath", newPath);
          // 返回到对应层级
          const targetFolder = newPath[newPath.length - 1]?.folder || null;
          props.level.onBack(targetFolder);
        }
      };
      const SsCommonIcon = resolveComponent("SsCommonIcon");
      return () =>
          h("div", { class: "bread-crumb" }, [
            currentMenu.value &&
            h(
                "div",
                {
                  onClick: () => {
                    if (props.level?.onBack) {
                      eventBus.publish("folderPath", []);
                      props.level.onBack(null); // 返回到根目录
                    } else {
                      eventBus.publish(EVEN_VAR.currentPage, currentMenu.value);
                    }
                  },
                },
                currentMenu.value.label || currentMenu.value.name
            ),

            ...(folderPath.value || [])
                .map((folder, index) => [
                  h(SsCommonIcon, { class: "common-icon-arrow-right" }),
                  h(
                      "div",
                      {
                        class: "bread-crumb-item",
                        onClick: () => handlePathClick(index),
                        style: { cursor: "pointer" },
                      },
                      folder.title
                  ),
                ])
                .flat(),
          ]);
    },
  };

  // ss-input form表单的输入
  const SsInput = {
    name: "SsInp",//把SsInput改为SsInp Ben(20251225)
    inheritAttrs: false, // 不直接继承属性到组件根元素
    props: {
      name: {
        type: String,
        required: true,
        default: "",
      },
      // 接收 v-model 绑定的值
      errTip: {
        type: String,
      },
      required: {
        type: Boolean,
        default: false,
      },
      placeholder: {
        type: String,
        default: "请输入",
      },
      defaultValue: [String, Number],
      modelValue: [String, Number],
      // 新增：附件配置
      fj: {
        type: Object,
        default: null,
      },
      // 新增：param 配置（用于附件功能）
      param: {
        type: Object,
        default: null,
      },
      // 新增：高度配置
      height: {
        type: String,
        default: "",
      },
      // 新增：是否允许回车换行，默认false禁止换行 by xu 20251212
      multiline: {
        type: Boolean,
        default: false,
      },
    },
    emits: ["update:modelValue", "input", "blur", "change"], // 允许更新 v-model 绑定的值
    setup(props, { emit }) {

      const errMsg = ref("");
      const inputRef = ref(null);
      const textareaRef = ref(null);
      const inputValue = ref(props.modelValue || props.defaultValue || "");
      const contentFloatingDiv = ref(false); // 控制浮动 DIV 的显示
      const floatingDivPosition = ref("bottom"); // 'bottom' 或 'top'
      const isFocused = ref(false); // 跟踪焦点状态

      // 附件相关变量（仅在传入 param 时初始化）
      let fjid = ref(null);
      let fjName = null;
      let mode = null;
      if (props.param && props.param.button) {
        fjid = ref(props.param.button.val);
        fjName = props.param.button.desc;
        mode = props.param.mode;
      }

      const showRequired = computed(() => {
        // 检查是否有验证规则（通过 window.ssVm 判断）
        const hasValidationRule = window.ssVm?.validations?.has(props.name);

        if (!hasValidationRule) return false;
        if (errMsg.value) return true;
        if (!inputValue.value) return true;
        return false;
      });

      // 计算floatdiv应该向上还是向下展开
      const calculateFloatingDivPosition = () => {
        nextTick(() => {
          const textarea = inputRef.value;
          if (!textarea) return;

          const rect = textarea.getBoundingClientRect();
          const viewportHeight = window.innerHeight;

          // 预估floatdiv的高度(最多5行 * 20px + 上下padding + border)
          const estimatedFloatDivHeight = 20 * 5 + 10 + 2; // 5行 + padding + border = 112px

          // 检查下方空间
          const spaceBelow = viewportHeight - rect.bottom;

          // 如果下方空间不足,且上方空间足够,则向上展开
          if (spaceBelow < estimatedFloatDivHeight && rect.top > estimatedFloatDivHeight) {
            floatingDivPosition.value = "top";
          } else {
            floatingDivPosition.value = "bottom";
          }
        });
      };

      // 计算floatdiv的top偏移量
      const getFloatingDivTop = computed(() => {
        if (props.height) {
          // 有height时,padding是5px
          return '5px';
        } else {
          // 没有height时是单行居中,需要计算居中位置
          // 假设input-container高度是32px(或者从CSS读取),单行20px
          // 居中偏移 = (容器高度 - 行高) / 2 = (32 - 20) / 2 = 6px
          return '6px';
        }
      });

      const validate = () => {
        if (window.ssVm) {
          const result = window.ssVm.validateField(props.name);
          console.log(result);

          errMsg.value = result.valid ? "" : result.message;
        }
      };

      // 使用 watch 监听 props.errTip 和 props.modelValue 的变化
      watch(
          () => props.errTip,
          (newVal) => {
            errMsg.value = newVal;
          },
          { immediate: true }
      );
      watch(
          () => props.modelValue,
          (newVal) => {
            inputValue.value = newVal;
          }
      );

      // 挂载时的逻辑
      onMounted(() => {
        errMsg.value = props.errTip;
        inputValue.value = props.modelValue || props.defaultValue || "";
      });
      // 计算并调整textarea的高度
      const adjustHeight = () => {
        nextTick(() => {
          const textarea = textareaRef.value;
          if (!textarea) return;

          // floatDiv的textarea始终自动计算高度,不受props.height影响
          // 重置高度以获得正确的scrollHeight
          textarea.style.height = "auto";
          // 计算新高度 - 统一限制为5行
          const lineHeight = parseInt(getComputedStyle(textarea).lineHeight, 10);
          const maxHeight = lineHeight * 5; // 统一为5行
          const newHeight = Math.min(textarea.scrollHeight, maxHeight);
          textarea.style.height = `${newHeight}px`;
        });
      };

      // 检查是否应该显示浮动窗口（需要同时满足：有焦点 + 内容超出）
      // 修复新增页面点击就出现floatdiv的问题 by xu 20251212
      const checkShouldShowFloatingDiv = () => {
        const textarea = inputRef.value;
        if (!textarea) return false;

        // 首先检查是否有内容，没有内容时不显示floatdiv by xu 20251212
        if (!inputValue.value || inputValue.value.toString().trim() === '') {
          console.log('[floatdiv] 内容为空，不显示floatdiv');
          return false;
        }

        // 判断内容是否超出 by xu 20251212
        // 同时检查横向和纵向溢出，任一方向溢出都应显示floatdiv
        // 纵向溢出需要加容差值，避免padding/border导致的误判 by xu 20251212
        const verticalTolerance = 5; // 容差值5px
        const isHorizontalOverflow = textarea.scrollWidth > textarea.clientWidth;
        const isVerticalOverflow = textarea.scrollHeight > textarea.clientHeight + verticalTolerance;
        const isOverflow = isHorizontalOverflow || isVerticalOverflow;

        console.log('[floatdiv] 溢出检测 - scrollWidth:', textarea.scrollWidth, 'clientWidth:', textarea.clientWidth, 'horizontalOverflow:', isHorizontalOverflow);
        console.log('[floatdiv] 溢出检测 - scrollHeight:', textarea.scrollHeight, 'clientHeight:', textarea.clientHeight, 'tolerance:', verticalTolerance, 'verticalOverflow:', isVerticalOverflow);

        const shouldShow = isFocused.value && isOverflow;
        console.log('[floatdiv] 最终判断 - isFocused:', isFocused.value, 'isOverflow:', isOverflow, 'shouldShow:', shouldShow);

        // 需要同时满足：有焦点 + 内容超出
        return shouldShow;
      };

      // 定义事件处理函数
      const onInput = (event) => {
        const newValue = event.target.value;
        inputValue.value = newValue;
        emit("update:modelValue", newValue);
        validate(); // 输入时验证

        nextTick(() => {
          // 检查是否需要显示浮动div
          contentFloatingDiv.value = checkShouldShowFloatingDiv();

          // 如果需要显示floatdiv,计算其位置
          if (contentFloatingDiv.value) {
            calculateFloatingDivPosition();
          }
        });
        adjustHeight();
      };
      const onFocus = (event) => {
        // 设置焦点状态为true
        isFocused.value = true;
        adjustHeight();

        // 检查是否应该显示浮动窗口
        nextTick(() => {
          contentFloatingDiv.value = checkShouldShowFloatingDiv();
          if (contentFloatingDiv.value) {
            calculateFloatingDivPosition();
          }
        });
      };

      // 失去焦点时进行验证
      const onBlur = (event) => {
        emit("blur", event.target);
        validate(); // 失焦时验证

        nextTick(() => {
          // 如果焦点不在 textarea 上,则隐藏浮动 div
          if (!document.activeElement.classList.contains("input-control")) {
            isFocused.value = false;
            contentFloatingDiv.value = false;
          }
        });
      };
      const onChange = (event) => {
        inputValue.value = event.target.value || "";
        emit("change", inputValue.value);
      };
      const onMouseover = (event) => {
        nextTick(() => {
          // setTimeout(contentFloatingDiv.value = true, 500)
        });
      };
      const onMouseleave = (event) => {
        // contentFloatingDiv.value = false
      };

      // 处理键盘按下事件，禁止回车换行 by xu 20251212
      const onKeydown = (event) => {
        // 如果不允许多行且按下的是回车键，阻止默认行为
        if (!props.multiline && event.key === 'Enter') {
          event.preventDefault();
        }
      };

      // 附件按钮点击处理（从 SsEditor 搬运）
      const onAttachmentClick = (e) => {
        e.preventDefault();

        if (!props.param || !props.param.button) {
          console.warn("未配置 param 参数");
          return;
        }

        console.log("附件点击了");
        console.log("param", props.param);
        console.log("cmsAddUrl", props.param.button.cmsAddUrl);

        // 如果 fjid 为空，先调用 cmsAddUrl 创建
        if (fjid.value == null || fjid.value == "") {
          $.ajax({
            type: "post",
            url: props.param.button.cmsAddUrl,
            async: false,
            data: {
              name: "fjid",
              ssNrObjName: "sh",
              ssNrObjId: "",
            },
            success: function (_fjid) {
              console.log("cmsAddUrl success", _fjid);
              fjid.value = _fjid;
            },
          });
        }

        // 构建参数字符串
        var str =
            "&nrid=T-" +
            fjid.value +
            "&objectId=" +
            fjid.value +
            "&objectName=" +
            fjName +
            "&callback=" +
            (window["fjidCallbackName"] || "");

        console.log("str", str);

        // 打开附件编辑对话框
        SS.openDialog({
          src: props.param.button.cmsUpdUrl + str,
          headerTitle: "编辑",
          width: 900,
          high: 664,
          zIndex: 51,
        });
      };

      return {
        errMsg,
        inputValue,
        showRequired,
        onInput,
        onBlur,
        onChange,
        onMouseover,
        onMouseleave,
        onKeydown, // 新增：键盘事件处理 by xu 20251212
        contentFloatingDiv,
        floatingDivPosition,
        getFloatingDivTop,
        inputRef,
        textareaRef,
        onFocus,
        onAttachmentClick,
        fjid, // 附件 ID，用于隐藏字段
      };
    },
    render() {
      const { resolveComponent, h } = Vue;
      const SsIcon = resolveComponent("ss-icon");
      const SsEditorIcon = resolveComponent("SsEditorIcon");


      // 构建主textarea的样式
      const mainTextareaStyle = {};
      if (this.height) {
        mainTextareaStyle.height = "auto"
        // mainTextareaStyle.paddingTop = '5px'; // 有高度时加上padding-top
        // mainTextareaStyle.paddingBottom = '5px'; // 有高度时加上padding-bottom
      } else {
        // 没有指定height时,固定为单行高度
        mainTextareaStyle.height = '20px'; // 行高20px
        mainTextareaStyle.lineHeight = '20px'; // 确保单行垂直居中
        mainTextareaStyle.display = 'flex';
        mainTextareaStyle.marginBottom  = '5px';
      }

      // 如果有附件按钮,为按钮留出空间
      if (this.fj || (this.param&&this.param.button)) {//加上&&this.param.button条件 Ben(20251221)
        mainTextareaStyle.paddingRight = '75px';

      }

      const mainTextareaRows = this.height ? Math.floor(parseFloat('80px') / 20) : 1

      return h("div", { class: "input" }, [
        h("div", { class: "input-container", }, [
          h("div", { class: "input",style:"padding:5px 0"  }, [
            h("textarea", {
              ref: "inputRef",
              class: "input-control",
              name: this.name,
              value: this.inputValue,
              onInput: this.onInput,
              onFocus: this.onFocus,
              onBlur: this.onBlur,
              onChange: this.onChange,
              onKeydown: this.onKeydown, // 新增：禁止回车换行 by xu 20251212
              placeholder: this.placeholder,
              onMouseover: this.onMouseover, // 监听鼠标悬停
              onMouseleave: this.onMouseleave, // 监听鼠标离开
              rows:mainTextareaRows,
              ...this.$attrs,
              style: mainTextareaStyle,
              autocomplete: "off",
            }),
            // 附件按钮（优先使用 param，兼容旧的 fj）
            this.fj||(this.param&&this.param.button)//加上&&this.param.button条件 Ben(20251221)
                ? h(
                    "button",
                    {
                      type: "button",
                      class: "fj-button",
                      onClick: this.param ? this.onAttachmentClick : (e) => {
                        e.preventDefault();
                        console.log("附件配置:", this.fj);
                      },
                    },
                    [

                      h(SsEditorIcon, {
                        class: "editor-icon-link",
                      }),
                      h("span", { class: "fj-button-text" }, "附件")

                    ]
                )
                : null,
            // this.showRequired ? h("div", { class: "required" }) : null,
          ]),
          this.contentFloatingDiv || ""
              ? h("div", {
                class: "floating-div",
                style: this.floatingDivPosition === "bottom"
                    ? {
                      // 向下展开: 覆盖原输入框,top对齐首行
                      top: this.getFloatingDivTop,
                      bottom: 'auto',
                    }
                    : {
                      // 向上展开: 同样覆盖原输入框,但从底部开始计算
                      top: 'auto',
                      bottom: this.height ? '5px' : '6px', // 对齐到原textarea的底部padding位置
                    }
              }, [
                h("textarea", {
                  ref: "textareaRef",
                  class: "input-control",
                  value: this.inputValue,
                  onInput: this.onInput,
                  onBlur: this.onBlur,
                  onFocus: this.onFocus,
                  onKeydown: this.onKeydown, // 新增：禁止回车换行 by xu 20251212
                  onMouseover: this.onMouseover, // 监听鼠标悬停
                  onMouseleave: this.onMouseleave, // 监听鼠标离开
                  autocomplete: "off",
                  onVnodeMounted: (vnode) => {
                    vnode.el.focus();
                  },
                }),
              ])
              : null,
          // this.errMsg ? h(SsValidate, { errMsg: this.errMsg }) : null,
        ]),
        // 附件相关的隐藏字段（仅在有 param 时才渲染）
        this.param && [
          // fjid 隐藏字段（只有当 fjid 有值时才渲染）
          this.fjid && this.fjid.value &&
          h("input", {
            type: "hidden",
            name: "fjid",
            value: this.fjid.value,
          }),
          // 其他隐藏字段根据 name 生成
          /* 去掉。文本框不需要（这是富文本才有的） Ben 20251205
          h("input", {
          type: "hidden",
          name: this.name.replace(/wj$/, "") + "Edit",
          value: this.inputValue
          }),
          */
          // h("input", {
          //   type: "hidden",
          //   name: this.name.replace(/wj$/, "") + "wj",
          //   value: this.inputValue
          // }),
          /* 去掉。文本框不需要（这是富文本才有的） Ben 20251205
          h("input", {
          type: "hidden",
          name: "ueditorpath",
          value: this.name
          }),
          */
        ],
      ]);
    },
  };
  // ss-normal-input 登录输入
  const SsLoginInput = {
    name: "SsLoginInput",
    inheritAttrs: false,
    props: {
      errTip: {
        type: String,
      },

      type: {
        type: String,
        default: "text",
      },
      required: {
        type: Boolean,
        default: false,
      },
      placeholder: {
        type: String,
        default: "请输入",
      },
      name: {
        type: String,
        default: "",
      },
      defaultValue: [String, Number],
      modelValue: [String, Number],
    },
    emits: ["update:modelValue", "input", "blur", "change"], // 允许更新 v-model 绑定的值
    setup(props, { emit }) {
      const errMsg = ref("");
      const inputRef = ref(null);
      const textareaRef = ref(null);
      const inputValue = ref(props.modelValue || props.defaultValue || "");

      // 使用 watch 监听 props.errTip 和 props.modelValue 的变化
      watch(
          () => props.errTip,
          (newVal) => {
            errMsg.value = newVal;
          },
          { immediate: true }
      );
      watch(
          () => props.modelValue,
          (newVal) => {
            inputValue.value = newVal;
          }
      );

      // 挂载时的逻辑
      onMounted(() => {
        errMsg.value = props.errTip;
        inputValue.value = props.modelValue || props.defaultValue || "";
      });

      // 定义事件处理函数
      const onInput = (event) => {
        const newValue = event.target.value;
        inputValue.value = newValue;
        emit("update:modelValue", newValue);
      };
      return { inputValue, onInput, inputRef, textareaRef };
    },
    render() {
      return h("div", { class: "input" }, [
        h("div", { class: "input-container" }, [
          h("div", { class: "input" }, [
            h("input", {
              ref: "inputRef",
              class: "input-control",
              name: this.name,
              value: this.inputValue,
              onInput: this.onInput,
              type: this.type,
              placeholder: this.placeholder,
              required: this.required,
              ...this.$attrs,
              autocomplete: "off",
            }),
            this.required ? h("div", { class: "required" }) : null,
          ]),
        ]),
      ]);
    },
  };
  // ss-login-button
  const SsLoginButton = {
    name: "SsLoginButton",
    inheritAttrs: false,
    props: {
      class: {
        type: String,
        default: "",
      },
      text: {
        type: String,
        default: "",
      },
      type: {
        type: String,
        default: "button",
      },
    },
    emits: ["click"],
    setup(props, { emit }) {
      // 定义事件处理函数
      const onClick = (event) => {
        // 发射一个 'click' 事件，你可以传递所需的参数
        emit("click", event);
      };

      return { props, onClick };
    },
    render() {
      const SsIcon = resolveComponent("ss-icon");
      const SsLoginIcon = resolveComponent("ss-login-icon");
      return h(
          "button",
          { class: "login-button", type: this.type, onClick: this.onClick },
          [
            h("span", [h(SsLoginIcon, { class: this.class })]),
            h("span", {}, this.text),
          ]
      );
    },
  };
  // ss-objp 下拉选择
  const SsObjp = {
    name: "SsObjp",
    inheritAttrs: false,
    props: {
      onchange: { //在此属性传入onChange的window全局回调函数，函数唯一参数是当前选中值 Ben(20251217)
        type: String,
        required: false,
      },
      filter: {
        type: String,
        required: false,
      },
      cb: {
        type: String,
        required: true,
      },
      url: {
        type: String,
        required: true,
      },
      name: {
        type: String,
        required: true,
      },
      width: {
        type: String,
        default: "100%",
      },
      placeholder: {
        type: String,
        default: "请选择",
      },
      inp: {
        type: Boolean,
        default: false,
      },
      opt: {
        type: Array,
        default: () => [],
      },
      errTip: String,
      defaultValue: [String, Number],
      modelValue: [String, Number],
      direction: {
        type: String,
        default: "bottom",
      },
    },
    emits: ["update:modelValue", "input", "blur", "change"],
    setup(props, { emit }) {
      const canInput = props.inp;
      const errMsg = Vue.ref(props.errTip);
      const selectItem = Vue.ref({});
      let inputText = Vue.ref(""); // 用于存储输入框的文本
      const popupWinVisible = Vue.ref(false);

      const filteredOptions = Vue.ref(props.opt);
      const popupDirection = Vue.ref("bottom");
      const popupMaxHeight = Vue.ref("none"); // popup最大高度，用于空间不足时限制高度并出滚动条 by xu 20251212

      // const showRequired = Vue.computed(() => {
      //   const hasValidationRule = window.ssVm?.validations?.has(props.name);
      //   if (!hasValidationRule) return false;
      //   if (errMsg.value) return true;
      //   if (!selectItem.value?.value) return true;
      //   return false;
      // });

      const validate = () => {
        if (window.ssVm) {
          const result = window.ssVm.validateField(props.name);
          // console.log("validate", window.ssVm.validateField(props.name));
          errMsg.value = result.valid ? "" : result.message;
        }
      };

      //在objPicker界面，选中value对应的项
      const updateSelectItem = () => {
        // console.log(props.opt);
        const item = props.opt.find((it) => it.value === props.modelValue);
        if (item) {
          selectItem.value = item;
          inputText.value = item.label;
        } else {
          selectItem.value = { label: "", value: "" };
          inputText.value = "";
        }
        // validate();
      };

      Vue.watch(
          () => props.errTip,
          (newVal) => {
            errMsg.value = newVal;
          }
      );

      Vue.watch(() => props.modelValue, updateSelectItem, { immediate: true });
      Vue.watch(
          () => props.opt,
          (newVal) => {
            updateSelectItem();
            filteredOptions.value = [...newVal];
            // console.log("filteredOptions", filteredOptions.value);
          }
      );

      //初始化objPicker在页面刚打开时的默认值
      async function initDefaultValue() {
        try {
          if (props.url && props.cb && props.modelValue) {

            let objectPickerParam;
            let url = props.url;

            //如果有定义过滤器
            if (props.filter) {
              //包含HTML实体的JSON字符串转为JSON对象,如原字符串是{&quot;dwid&quot;:&quot;88&quot;},注意key也必需用单引号包着
              // const decodedString = props.filter.replace(/&quot;/g, '"'); // 转换为: {"dwid":"88"}
              // objectPickerParam = JSON.parse(decodedString); // 转为json对象

              const filterObj = props.filter; // 转为json对象
              for (let k in filterObj) {
                let v = filterObj[k];
                url += "&" + k + "=" + v;
              }

              objectPickerParam = props.filter; // 转为json对象
              objectPickerParam["input"] = props.inp;
              objectPickerParam["codebook"] = props.cb;


              // alert(url);
            } else {
              objectPickerParam = { input: props.inp, codebook: props.cb };
            }

            const objectPickerParamStr = JSON.stringify(objectPickerParam);

            const params = new URLSearchParams();
            params.append("objectpickerparam", objectPickerParamStr);
            params.append("objectpickertype", "2");
            params.append("objectpickervalue", props.modelValue); //需回显的值

            // alert("1params:"+JSON.stringify(params));

            axios
                .post(props.url, params, {
                  headers: {
                    "Content-Type": "application/x-www-form-urlencoded", // 必须手动设置！
                  },
                })
                .then((response) => {
                  // alert(JSON.stringify(response.data));

                  if ("timeout" == response.data.statusText) {
                    alert("网络超时!");
                    return;
                  }

                  if (response.data.result) {
                    const keys = Object.keys(response.data.result);
                    if (keys.length === 1) {
                      let code = keys[0];
                      let desc = response.data.result[keys[0]];
                      if (props.opt)
                        props.opt.length = 0; //通过修改数组的length属性，直接清空数组元素，内存会被自动释放。这是性能最优的方式
                      else {
                        props.opt = [];
                      }
                      props.opt.push({ label: desc, value: code });
                      updateSelectItem();

                      // alert('props.opt:'+JSON.stringify(props.opt));
                    }
                  }
                });
          }
        } catch (error) {
          // callback(null, error.message); // 失败回调，传递错误
        }
      }

      // Vue.onMounted(updateSelectItem);

      const doSelectItem = (item) => {

        emit("update:modelValue", item.value);
        selectItem.value = item;
        inputText.value = item.label;
        hidePopup();
        nextTick(() => {
          console.log(item.value + "@@@props.modelValue:" + props.modelValue);
          validate();
          if (window.ssVm) {
            // 遍历所有验证规则，找到依赖当前字段的规则
            for (const [field, rules] of window.ssVm.validations.entries()) {
              for (const rule of rules) {
                if (rule.opt?.relField === props.name) {
                  // console.log("Found dependent field:", field); // 调试日志
                  window.ssVm.validateField(field);
                }
              }
            }
          }
        });

        callGlobalOnchg(item.value,item.label); // 值变化时尝试调用全局onchange回调函数 Ben(20251217)
      };

      // 用于调用全局onchange回调函数 Ben(20251217)
      const callGlobalOnchg = (value,desc) => {
        // 检查 onchange 属性是否提供了有效的函数名
        if (props.onchange && typeof props.onchange === 'string') {
          // 检查 window 对象上是否存在该函数
          if (typeof window !== 'undefined' && window[props.onchange] && typeof window[props.onchange] === 'function') {
            try {
              window[props.onchange](value,desc) // 调用全局函数，并传入当前选中值
            } catch (error) {
              console.error(`调用全局函数 ${props.onchange} 时出错:`, error)
            }
          } else {
            console.warn(`全局函数 ${props.onchange} 未定义或不是一个函数。`)
          }
        }
      }

      //可录入的objPicker，更新下拉菜单选项
      async function updateOptionBYInputText(inpTxt) {
        try {
          let objectPickerParam;
          let url = props.url;

          if (props.url && props.cb) {
            //如果有定义过滤器
            if (props.filter) {

              const filterObj = props.filter; // 转为json对象
              for (let k in filterObj) {
                let v = filterObj[k];
                url += "&" + k + "=" + v;
              }

              //包含HTML实体的JSON字符串转为JSON对象,如原字符串是{&quot;dwid&quot;:&quot;88&quot;},注意key也必需用单引号包着
              // const decodedString = props.filter.replace(/&quot;/g, '"'); // 转换为: {"dwid":"88"}
              // objectPickerParam = JSON.parse(decodedString); // 转为json对象
              objectPickerParam = props.filter;
              objectPickerParam["input"] = props.inp;
              objectPickerParam["codebook"] = props.cb;


              // alert(url);
            } else {
              objectPickerParam = { input: props.inp, codebook: props.cb };
            }

            const objectPickerParamStr = JSON.stringify(objectPickerParam);
            const params = new URLSearchParams();
            params.append("objectpickerparam", objectPickerParamStr);
            params.append("objectpickertype", "1");
            if (props.inp && props.inp === true) {//把"true"改为true Ben(20251209)
              params.append("objectpickersearchAll", 0); //只查录入的值
              params.append("objectpickerinput", inpTxt); //录入的值
            } else {
              params.append("objectpickersearchAll", 1);
            }

            axios
                .post(url, params, {
                  headers: {
                    "Content-Type": "application/x-www-form-urlencoded", // 必须手动设置！
                  },
                })
                .then((response) => {
                  if ("timeout" == response.data.statusText) {
                    alert("网络超时!");
                    return;
                  }

                  // 先清空选项 by xu 20251212
                  if (props.opt) {
                    props.opt.length = 0;
                  } else {
                    props.opt = [];
                  }

                  if (response.data.result) {
                    const keys = Object.keys(response.data.result);
                    // console.log("params:"+params+"@@response.data:"+JSON.stringify(response.data));
                    if (keys.length > 0) {
                      for (let k in response.data.result) {
                        props.opt.push({
                          label: response.data.result[k],
                          value: k,
                        });
                      }

                      // console.log('###inpTxt:'+inpTxt+';');
                      if (
                          props.inp &&
                          props.inp === true && //把"true"改为true Ben(20251209)
                          inpTxt.length > 0
                      ) {
                        //对于可录入的，用已录入的值作过滤

                        filteredOptions.value = props.opt.filter((option) =>
                            option.label
                                .toLowerCase()
                                .includes(inputText.value.toLowerCase())
                        );

                        // 可录入的objPicker，当搜索结果只有一项时，自动选中这一项 by xu 20251212
                        if (filteredOptions.value.length === 1) {
                          const autoSelectItem = filteredOptions.value[0];
                          console.log("[objp] 搜索结果只有一项，自动选中:", autoSelectItem);
                          doSelectItem(autoSelectItem);
                          return; // 自动选中后直接返回，不需要显示popup
                        }

                        filteredOptions.value.unshift({ label: "", value: "" });

                        // console.log('###做了过滤:'+inputText.value.toLowerCase()+';');
                      } else {
                        filteredOptions.value = props.opt;
                        filteredOptions.value.unshift({ label: "", value: "" });
                      }

                      console.log("props.opt11:" + JSON.stringify(props.opt));
                    } else {
                      // 没有数据时，清空过滤选项 by xu 20251212
                      filteredOptions.value = [];
                      console.log("[objp] 接口返回空数据");
                    }
                  } else {
                    // result不存在时，清空过滤选项 by xu 20251212
                    filteredOptions.value = [];
                    console.log("[objp] 接口返回无result");
                  }

                  // 无论是否有数据，都显示popup by xu 20251212
                  if (!popupWinVisible.value) {
                    popupWinVisible.value = true;
                  }
                });
          }
        } catch (error) {
          // callback(null, error.message); // 失败回调，传递错误
        }
      }

      // 计算弹出方向和最大高度的方法 by xu 20251212
      // 当空间不足时限制popup高度并显示滚动条
      const calculatePopupDirection = () => {
        // 1. 获取select容器元素
        const selectEl = document
            .querySelector(`[name="${props.name}"]`)
            ?.closest(".select-container");
        if (!selectEl) return;

        // 2. 获取位置信息
        const selectRect = selectEl.getBoundingClientRect();
        const viewportHeight = window.innerHeight;

        // 3. 计算上下可用空间
        const spaceBelow = viewportHeight - selectRect.bottom - 10; // 减10px留边距
        const spaceAbove = selectRect.top - 10; // 减10px留边距

        // 4. popup预估高度（假设每项36px，最多显示8项 + padding）
        const estimatedPopupHeight = 300;
        const minPopupHeight = 100; // 最小高度

        console.log('[popup] 空间计算 - spaceAbove:', spaceAbove, 'spaceBelow:', spaceBelow, 'estimatedHeight:', estimatedPopupHeight);

        // 5. 判断方向和最大高度 by xu 20251212
        if (spaceBelow >= estimatedPopupHeight) {
          // 下方空间足够，向下展开，不限制高度
          popupDirection.value = "bottom";
          popupMaxHeight.value = "none";
          console.log('[popup] 向下展开，空间充足');
        } else if (spaceAbove >= estimatedPopupHeight) {
          // 上方空间足够，向上展开，不限制高度
          popupDirection.value = "top";
          popupMaxHeight.value = "none";
          console.log('[popup] 向上展开，空间充足');
        } else {
          // 上下空间都不足，选择空间大的方向，并限制高度出滚动条
          if (spaceBelow >= spaceAbove) {
            popupDirection.value = "bottom";
            popupMaxHeight.value = Math.max(spaceBelow, minPopupHeight) + "px";
            console.log('[popup] 向下展开，空间不足，限制高度:', popupMaxHeight.value);
          } else {
            popupDirection.value = "top";
            popupMaxHeight.value = Math.max(spaceAbove, minPopupHeight) + "px";
            console.log('[popup] 向上展开，空间不足，限制高度:', popupMaxHeight.value);
          }
        }
      };

      //点击下拉菜单的文本区域时，会触发的方法
      function togglePopup() {
        // 可录入的 objPicker，更新下拉菜单选项
        updateOptionBYInputText(inputText.value);
        // popupWinVisible.value = !popupWinVisible.value;
        Vue.nextTick(() => {
          calculatePopupDirection();
        });
      }

      const hidePopup = () => {
        popupWinVisible.value = false;
      };

      //点击下拉菜单的三角形时，会触发的方法
      // 添加toggle逻辑，点击时切换显示/隐藏 by xu 20251212
      const suffixClick = () => {
        // 如果popup已显示，则关闭 by xu 20251212
        if (popupWinVisible.value) {
          hidePopup();
          console.log("[objp] 点三角关闭popup");
          return;
        }

        //可录入的objPicker，更新下拉菜单选项
        updateOptionBYInputText("");
        Vue.nextTick(() => {
          calculatePopupDirection();
        });
        console.log("[objp] 点三角打开popup");
      };

      //可录入的objPicker，录入项变化时，会触发
      async function handleInputChange(event) {
        inputText.value = event.target.value;
        if (!inputText.value) {
          inputText.value = "";
        }

        //可录入的objPicker，更新下拉菜单选项
        updateOptionBYInputText(inputText.value);

        // filteredOptions.value = props.opt.filter((option) =>
        //     option.label.toLowerCase().includes(inputText.value.toLowerCase())
        // );
        // if (!popupWinVisible.value) {
        //   popupWinVisible.value = true; // 确保下拉框在输入时打开
        // }
      }
      Vue.onMounted(() => {
        initDefaultValue();
        window.addEventListener("resize", calculatePopupDirection);
      });
      Vue.onUnmounted(() => {
        window.removeEventListener("resize", calculatePopupDirection);
      });

      return {
        errMsg,
        selectItem,
        inputText,
        canInput,
        filteredOptions,
        popupWinVisible,
        popupDirection,
        popupMaxHeight, // 添加popup最大高度 by xu 20251212
        suffixClick,
        togglePopup,
        hidePopup,
        doSelectItem,
        handleInputChange,
      };
    },

    template: `
      <div class="input" style="position: relative" :style="{width: width}">
        <div class="select-container" @mouseleave="hidePopup">
          <div class="input" @click="togglePopup">
            <input 
              type="hidden"
              :name="name"
              :value="selectItem.value"
              .value="selectItem.value" 
            />
            <input
              v-model="inputText"
              @input="handleInputChange"
              v-if="canInput"
              :placeholder="placeholder"
              
            />
            
            <input
              v-else
              :placeholder="placeholder"
              :value="selectItem.label"
              
              disabled
              style="pointer-events: none;"
            />
           
            <div class="suffix" @click.stop="suffixClick">
              <ss-form-icon :class="popupWinVisible ? 'form-icon-transform-select select' : 'form-icon-select'" />
              
            </div>
          </div>
         
            
          <!-- popup弹出层，添加maxHeight和overflowY支持空间不足时滚动 by xu 20251212 -->
          <div v-show="popupWinVisible" class="popup-win" :class="popupDirection" :style="{ maxHeight: popupMaxHeight, overflowY: popupMaxHeight !== 'none' ? 'auto' : 'visible' }">
            <div v-if="opt && opt.length && filteredOptions.length > 0" class="popup-content">
              <div class="content-area">
                <div v-for="(item, index) in filteredOptions" :key="index" @click="doSelectItem(item)" :class="{ active: item.value === selectItem.value }">
                  <span class="check-icon">
                   
                    <ss-form-icon class="form-icon-select-checked" />
                  </span>
                  <span>{{ item.label }}</span>
                </div>
              </div>
            </div>
            <div v-else class="popup-content"><div class="content-area"><div class="content-area"> <span>无选项</span></div></div></div>
          </div>
        </div>
      </div>

    `,
  };
  // ss-hidden 隐藏字段组件
  const SsHidden = {
    name: "SsHidden",
    props: {
      modelValue: String,
      name: {
        type: String,
        required: true,
      },
      rule: {
        type: String,
        required: true,
      },

      param: {
        type: String,
        required: true,
      },
      url: {
        type: String,
        required: true,
      },
    },
    emits: ["update:modelValue"],

    setup(props, { emit }) {
      const errMsg = Vue.ref("");
      const validate = () => {
        if (window.ssVm) {
          const result = window.ssVm.validateField(props.name);
          console.log("validate", window.ssVm.validateField(props.name));
          errMsg.value = result.valid ? "" : result.message;
        }
      };
      Vue.onMounted(() => {
        /**
         * 初始化级联菜单值初始值思路：
         * 1. 带隐藏字段（即带编码规则）的级联菜单
         *  在隐藏字段这，可以取到要回显的值和编码规则，从而计算出各级下拉菜单要回显的值。
         *  然后通过ajax取各级级联菜单的值回显。
         *  2. 不带隐藏字段的级联，只能在各个下拉菜单的setup事件中通过ajax取回显值回显
         */

        // 当同组级联下拉菜单选中值变化时，会调用本隐藏字段下面这方法设置隐藏字段值
        window.addEventListener(
            "cascader-setHiddenVal-" + props.name,
            (event) => {
              const { value } = event.detail;
              emit("update:modelValue", value);
              console.log(value);
              setTimeout(() => {
                validate();
              }, 50);
            }
        );

        // 如果有初始值，触发回显过程
        if (props.modelValue) {
          console.log("级联隐藏字段，开始回显，初始值:", props.modelValue);
          triggerCascaderEcho(props.modelValue);
          validate();
        }
      });

      // 触发级联回显
      const triggerCascaderEcho = (code) => {
        /**
         * 开始回显，初始值: 440304
         * 解析后的所有值: Array(3)0: "440000"1: "440300"2: "440304"length: 3[[Prototype]]: Array(0)
         */
        const values = parseHiddenCodeForAll(code, props.rule);
        console.log("解析后的所有值:", values);

        // 转换为 JSON 对象
        // const paramObj = JSON.parse(props.param);
        const paramObj = props.param;
        let selectArr = paramObj.fieldOrd; //保存本组级联菜单项的数组，如：['hksheng','hkshi','hkxian']
        if (selectArr.length != values.length) {
          // alert('属性'+props.name+'的值'+code+'与级联菜单中下拉菜单的数目不匹配!');
          return;
        }

        // 按顺序触发回显，并增加延迟确保数据加载
        /**
         * 通过隐藏字段的setup事件，
         * 循环遍历各级下拉菜单，并触发定义在下拉菜单中的'cascader-echo'事件，
         * 在此事件中完成每个下拉菜单回显值操作（只取当前要回显的键值对显示，
         * 下拉菜单所有的值，在点击下拉菜单时，才通过ajax取）。
         */
        values.forEach((value, index) => {
          if (value) {
            setTimeout(() => {
              let upperVal = undefined;
              if (index != 0) {
                upperVal = values[index - 1];
              }

              const echoEvent = new CustomEvent(
                  "cascader-echo-" + selectArr[index],
                  {
                    detail: {
                      name: props.name,
                      value: value,
                      // level: index + 1,
                      isAuto: true, // 标记为自动回显
                      upperVal: upperVal,
                    },
                  }
              );

              console.log(props.name + "--upperValue:" + upperVal);

              window.dispatchEvent(echoEvent);
            }, index * 500); // 每级增加500ms延迟
          }
        });
      };

      // 解析所有级别的代码
      const parseHiddenCodeForAll = (code, rule) => {
        if (!code || !rule) return [];

        // 获取规则中每段的长度
        const segments = [];
        let currentChar = rule[0];
        let currentLength = 1;

        for (let i = 1; i < rule.length; i++) {
          if (rule[i] === currentChar) {
            currentLength++;
          } else {
            segments.push(currentLength);
            currentChar = rule[i];
            currentLength = 1;
          }
        }
        segments.push(currentLength);

        // 解析每一级的值
        const values = [];
        let position = 0;

        segments.forEach((length, index) => {
          const value = code
              .substring(0, position + length)
              .padEnd(rule.length, "0");
          values.push(value);
          position += length;
        });

        return values;
      };
      watchEffect(() => {});
      return {};
    },
    template: `<input type="hidden" :name="name" :value="modelValue">`,
  };
  // ss-cascader 级联选择器
  const SsCcp = {
    name: "SsCcp",
    inheritAttrs: false,
    props: {
      modelValue: String,

      name: {
        type: String,
        required: true,
      },
      level: {
        type: Number,
        required: true,
      },
      opt: {
        type: Array,
        default: () => [],
      },
      placeholder: {
        type: String,
        default: "请选择",
      },
      width: {
        type: String,
        default: "150px",
      },
      direction: {
        type: String,
        default: "bottom",
      },
      mode: {
        type: String,
        default: "1",
      },

      //级联菜单配置参数，如果是数组，则代表本下拉菜单是多套级联菜单共用的第一级菜单。如果是对象，则只有一套级联菜单用此下拉菜单。
      param: {
        type: String,
        required: true,
      },
      //向后台拿数据的url
      url: {
        type: String,
        required: true,
      },
    },
    emits: ["update:modelValue", "change"],

    setup(props, { emit }) {
      // alert('级联菜单初始化：'+props.name+':--:'+props.modelValue);
      const selectItem = Vue.ref({ label: props.placeholder, value: "" });
      const popupWinVisible = Vue.ref(false);
      const isAutoEcho = Vue.ref(false); // 用于标记是否是自动回显
      const upperValue = Vue.ref(""); //上级下拉菜单当前值，在初始化下拉菜单默认值时，和上级下拉菜单的值变化时，修改此upperValue变量
      const popupDirection = Vue.ref("bottom");
      const popupMaxHeight = Vue.ref("none"); // popup最大高度，用于空间不足时限制高度并出滚动条 by xu 20251212

      //有隐藏字段的下拉菜单，加载菜单项并展开事件
      // 被上级下拉菜单选中值后，触发本下拉菜单刷新菜单项并弹出显示
      window.addEventListener("cascader-open-" + props.name, async (event) => {
        const { upperVal } = event.detail;
        upperValue.value = upperVal;
        console.log(
            "22props.name:" +
            props.name +
            ",22props.upperValue:" +
            upperValue.value
        );

        selectItem.value = ""; //清除本下拉菜单当前选中的值
        emit("update:modelValue", ""); //通知父级

        //清空下拉菜单，并设置第一项的值为placeholder
        clearAndInit1stOpt();

        //下个下拉菜单名
        let nextSelName = getNextSel(props.name, props.param.fieldOrd);
        if (nextSelName) {
          //清下个下拉菜单选中值和选项
          event = new CustomEvent("cascader-cleanOpt-" + nextSelName, {
            detail: {},
          });
          window.dispatchEvent(event);
        }

        showPopup();
      });

      //设置mode2的下级下拉菜单的上级菜单当前值
      function setNextSelectUpperValue() {
        //设置下级菜单的上级菜单当前值upperValue
        let paramArr = undefined;
        if (Array.isArray(props.param)) {
          paramArr = props.param;
        } else {
          paramArr = [];
          paramArr.push(props.param);
        }

        for (const oneParam of paramArr) {
          //下个下拉菜单名
          const nextSelName = getNextSel(props.name, oneParam.fieldOrd);
          if (nextSelName) {
            setTimeout(() => {
              const openNextEvent = new CustomEvent(
                  "cascade-setUpperVal-" + nextSelName,
                  {
                    detail: {
                      upperVal: props.modelValue,
                    },
                  }
              );
              window.dispatchEvent(openNextEvent);
            }, 100);
          }
        } // end for
      }

      // 把上级 级联下拉菜单的值，设置进本组件的事件
      window.addEventListener("cascade-setUpperVal-" + props.name, (event) => {
        // alert('props.name:'+props.name+',props.upperValue:'+event.detail.upperVal);
        const { upperVal } = event.detail;
        upperValue.value = upperVal;

        // console.log('props.name:'+props.name+',props.upperValue:'+upperValue.value);
      });

      //清空下拉菜单，并设置第一项的值为空
      function clearAndInit1stOpt() {
        if (props.opt)
          props.opt.length = 0; //通过修改数组的length属性，直接清空数组元素，内存会被自动释放。这是性能最优的方式
        else {
          props.opt = [];
        }
        props.opt.push({ label: "", value: "" });
      }

      //获取下一级下拉菜单，如果下一级下拉菜单不存在，则返回undefined
      function getNextSel(selName, selNameArr) {
        // 检查参数有效性
        if (!Array.isArray(selNameArr) || selNameArr.length === 0) {
          return undefined;
        }

        // 查找当前元素的索引
        const currentIndex = selNameArr.indexOf(selName);

        // 如果元素不存在或已经是最后一个元素，返回undefined
        if (currentIndex === -1 || currentIndex === selNameArr.length - 1) {
          return undefined;
        }

        // 返回下一个元素
        return selNameArr[currentIndex + 1];
      }

      // 处理选择事件
      const doSelectItem = (item) => {
        selectItem.value = item;
        emit("update:modelValue", item.value); //修改本下拉菜单在vue中保存的值

        // alert('item.value:'+item.value);
        if (props.mode === "1") {
          // mode 1 模式：修改隐藏字段值

          let event = new CustomEvent(
              "cascader-setHiddenVal-" + props.param.combField,
              {
                detail: {
                  value: item.value,
                },
              }
          );
          window.dispatchEvent(event);
        }
        emit("change", item.value); //触发配置的change方法

        //设置下级菜单的上级菜单当前值upperValue
        let paramArr = undefined;
        if (Array.isArray(props.param)) {
          paramArr = props.param;
        } else {
          paramArr = [];
          paramArr.push(props.param);
        }

        for (const oneParam of paramArr) {
          //下个下拉菜单名
          const nextSelName = getNextSel(props.name, oneParam.fieldOrd);
          if (nextSelName) {
            setTimeout(() => {
              const openNextEvent = new CustomEvent(
                  "cascader-open-" + nextSelName,
                  {
                    detail: {
                      upperVal: item.value,
                    },
                  }
              );
              window.dispatchEvent(openNextEvent);
            }, 100);
          }
        } // end for

        hidePopup();

        //下个下拉菜单名
        // let nextSelName = getNextSel(props.name, props.param.fieldOrd);
        // if(nextSelName){
        //   // //设置下一级下拉菜单中保存的本下拉菜单值（upperValue）
        //   // event = new CustomEvent('cascade-setUpperVal-'+nextSelName, {
        //   //   detail: {
        //   //     value: item.value
        //   //   }
        //   // });
        //   // window.dispatchEvent(event);
        //
        //   //触发下一级下拉菜单，重新初始化下拉菜单项并弹出显示
        //   event = new CustomEvent('cascader-open-' +nextSelName, {
        //     detail: {
        //       upperVal: item.value
        //     }
        //   });
        //   window.dispatchEvent(event);
        // }

        // 只在手动选择时自动展开下一级
        // if (!isAutoEcho.value) {
        //   const nextLevel = props.level + 1;
        //   setTimeout(() => {
        //     const openNextEvent = new CustomEvent('open-next-cascader', {
        //       detail: {
        //         name: props.name,
        //         level: nextLevel
        //       }
        //     });
        //     window.dispatchEvent(openNextEvent);
        //   }, 100);
        // }
      };

      // 监听下一级展开事件 (仅 mode 2)
      window.addEventListener("cascade-open", (event) => {
        if (props.mode === "2") {
          const { level } = event.detail;
          if (level === props.level) {
            popupWinVisible.value = true;
          }
        }
      });

      if (props.mode === "1") {
        //如果是有隐藏字段的下拉菜单
        // 监听回显事件
        window.addEventListener(
            "cascader-echo-" + props.name,
            async (event) => {
              const { name, value, isAuto, upperVal } = event.detail;
              // level,
              if (upperVal) {
                upperValue.value = upperVal;
                console.log(
                    "value:" +
                    value +
                    ",upperValue:" +
                    upperValue +
                    ",初始化级联组件时props.name:" +
                    props.name
                );
              }

              // if (name === props.name && level === props.level) {
              // 设置自动回显标记
              isAutoEcho.value = true;

              // if (props.opt.length === 0) {
              // const loadDataEvent = new CustomEvent('cascader-load-data', {
              //   detail: {
              //     name: props.name,
              //     level: props.level,
              //     value: value
              //   }
              // });
              // window.dispatchEvent(loadDataEvent);

              //下面的代码只用于页面刚打开时，初始化级联菜单的回显值。

              //Vue.watch用于监听数据的变化，并在数据变化时执行特定的回调函数。
              //这段代码使用了 Vue.js 的 watch API 来监听 props.opt 的变化，如果props.opt有变化，则自动

              //   const unwatch = Vue.watch(
              //       () => props.opt,                // 监听的数据源（props.opt）
              //       (newOptions) => {              // 回调函数
              //         if (newOptions.length > 0) { // 条件判断
              //           matchAndSelect(value);     // 执行逻辑
              //           unwatch();                 // 停止监听
              //         }
              //       },
              //       { immediate: true }            // 配置：立即触发一次
              //   );
              // } else {
              //   matchAndSelect(value);
              // }

              // 初始化级联菜单在页面刚打开时的默认值
              async function initDefaultValue(value) {
                try {
                  // alert(1);
                  if (props.url && props.param
                      // && props.modelValue 对于有rule编码规则的级联菜单（即mode=1），modelValue一定是空的，所以注释掉，修复mode=1的级联菜单无法回显问题。Ben(20251124)
                  ) {
                    // alert(2);
                    /**
                     *         let objectPickerParam=
                     *             {"objectpickerparam":"{\"input\":\"false\",\"cascadingLevel\":\"hksheng,hkshi,hkxian\"," +
                     *                     "\"name\":\"hksheng\"," +
                     *                     "\"cascadingName\":\"dq\",\"cascadingInputsName\":\"hkdqm\"," +
                     *                     "\"codebook\":\"sheng\"}",
                     *                 "objectpickertype":2,
                     *                 "objectpickervalue":"440000"
                     *             };
                     */

                    const objectPickerParam = {
                      input: "false",
                      cascadingLevel: props.param.fieldOrd.join(","), //如："hksheng,hkshi,hkxian"
                      name: props.name, //本下拉菜单名
                      cascadingName: props.param.name, //级联菜单名
                      cascadingInputsName: props.param.combField, //对象属性，即隐藏字段名，如：hkdqm
                      codebook: props.param.codebook,
                    };

                    const objectPickerParamStr =
                        JSON.stringify(objectPickerParam);

                    const params = new URLSearchParams();
                    params.append("objectpickerparam", objectPickerParamStr);
                    params.append("objectpickertype", "2");
                    params.append("objectpickervalue", value); //需回显的值

                    axios
                        .post(props.url, params, {
                          headers: {
                            "Content-Type": "application/x-www-form-urlencoded", // 必须手动设置！
                          },
                        })
                        .then((response) => {
                          // alert(JSON.stringify(response.data));

                          if ("timeout" == response.data.statusText) {
                            alert("网络超时!");
                            return;
                          }

                          if (response.data.result) {
                            const keys = Object.keys(response.data.result);
                            if (keys.length === 1) {
                              let code = keys[0];
                              let desc = response.data.result[keys[0]];
                              clearAndInit1stOpt();
                              props.opt.push({ label: desc, value: code });

                              if (value) matchAndSelect(value);
                              // updateSelectItem();

                              // alert('props.opt:'+JSON.stringify(props.opt));
                            }
                          }
                        });
                  }
                } catch (error) {
                  alert(error);
                  // callback(null, error.message); // 失败回调，传递错误
                }
              }

              //下面的代码只用于页面刚打开时，初始化级联菜单的回显值。
              initDefaultValue(value);

              // 延迟重置自动回显标记
              setTimeout(() => {
                isAutoEcho.value = false;
              }, 500);
            }
        );

        // 被上级下拉菜单触发的，清除选中值和下拉菜单选项
        window.addEventListener(
            "cascader-cleanOpt-" + props.name,
            async (event) => {
              upperValue.value = "";

              selectItem.value = ""; //清除本下拉菜单当前选中的值
              emit("update:modelValue", ""); //通知父级

              //清空所有下拉菜单项
              if (props.opt) {
                props.opt.length = 0;
              } else {
                props.opt = [];
              }

              //下个下拉菜单名
              let nextSelName = getNextSel(props.name, props.param.fieldOrd);
              // alert('nextSelName:'+nextSelName+'--,props.name:'+props.name);
              if (nextSelName) {
                //清下个下拉菜单选中值和选项
                event = new CustomEvent("cascader-cleanOpt-" + nextSelName, {
                  detail: {},
                });
                window.dispatchEvent(event);
              }
            }
        );
      } else if (props.mode === "2") {
        //没隐藏字段的下拉菜单，在这初始化默认值

        let needInitParam = undefined;
        if (Array.isArray(props.param)) {
          needInitParam = props.param[props.param.length - 1]; //只初始化数组最后一项
          console.log("needInitParam最后一项:" + JSON.stringify(needInitParam));
        } else {
          needInitParam = props.param;
        }

        // 初始化级联菜单在页面刚打开时的默认值
        async function initDefaultValue(value, param) {
          try {
            // alert(1);
            if (props.url && param && props.modelValue) {
              // alert(2);
              /**
               *        let param=
               *             {"objectpickerparam":"{\"input\":\"false\",\"cascadingLevel\":\"rylbm,gwid\"," +
               *                     "\"name\":\"gwid\",\"cascadingName\":\"rylb_gw\"," +
               *                     "\"codebook\":\"gwByRylb\"}",
               *                 "objectpickertype":2,
               *                 "objectpickervalue":"102121"};
               */

                  // alert('props.name:'+props.name+',props.param.fieldOrd:'+props.param.fieldOrd);

              const objectPickerParam = {
                    input: "false",
                    cascadingLevel: param.fieldOrd.join(","), //如："hksheng,hkshi,hkxian"
                    name: props.name, //本下拉菜单名
                    cascadingName: param.name, //级联菜单名
                    codebook: param.codebook,
                  };

              const objectPickerParamStr = JSON.stringify(objectPickerParam);

              const sendParams = new URLSearchParams();
              sendParams.append("objectpickerparam", objectPickerParamStr);
              sendParams.append("objectpickertype", "2");
              sendParams.append("objectpickervalue", value); //需回显的值

              axios
                  .post(props.url, sendParams, {
                    headers: {
                      "Content-Type": "application/x-www-form-urlencoded", // 必须手动设置！
                    },
                  })
                  .then((response) => {
                    // alert(JSON.stringify(response.data));

                    if ("timeout" == response.data.statusText) {
                      alert("网络超时!");
                      return;
                    }

                    if (response.data.result) {
                      const keys = Object.keys(response.data.result);

                      console.log(
                          "name:" +
                          props.name +
                          ",@@级联初始化默认值value：" +
                          value +
                          "--param:" +
                          JSON.stringify(param) +
                          "--objectPickerParamStr:" +
                          objectPickerParamStr +
                          "--response.data:" +
                          JSON.stringify(response.data)
                      );

                      if (keys.length === 1) {
                        let code = keys[0];
                        let desc = response.data.result[keys[0]];

                        if (props.opt)
                          props.opt.length = 0; //通过修改数组的length属性，直接清空数组元素，内存会被自动释放。这是性能最优的方式
                        else {
                          props.opt = [];
                        }
                        props.opt.push({ label: desc, value: code });

                        if (value) matchAndSelect(value);

                        console.log(
                            "GOOD mode2回显的默认值：" +
                            JSON.stringify({ label: desc, value: code }) +
                            "--props.param:" +
                            JSON.stringify(param)
                        );

                        // updateSelectItem();

                        // alert('props.opt:'+JSON.stringify(props.opt));
                      }
                    }
                  });
            }
          } catch (error) {
            alert(error);
            // callback(null, error.message); // 失败回调，传递错误
          }

          // 重置自动回显标记
          isAutoEcho.value = false;
        }

        // 初始化级联菜单在页面刚打开时的默认值
        initDefaultValue(props.modelValue, needInitParam);

        //设置mode2的下级下拉菜单的上级菜单当前值
        setNextSelectUpperValue();
      }

      //选中要回显的默认值
      const matchAndSelect = (value) => {
        const matchedOption = props.opt.find((opt) => opt.value === value);
        if (matchedOption) {
          selectItem.value = matchedOption;
          emit("update:modelValue", value);
          emit("change", value);
        }
      };

      // 计算弹出方向和最大高度的方法 by xu 20251212
      // 当空间不足时限制popup高度并显示滚动条
      const calculatePopupDirection = () => {
        // 1. 获取select容器元素
        const selectEl = document.querySelector(
            `[name="${props.name}"]`
        )?.nextElementSibling;
        console.log("selectEl:" + selectEl, props.name);
        if (!selectEl) return;

        // 2. 获取位置信息
        const selectRect = selectEl.getBoundingClientRect();
        const viewportHeight = window.innerHeight;

        // 3. 计算上下可用空间 by xu 20251212
        const spaceBelow = viewportHeight - selectRect.bottom - 10; // 减10px留边距
        const spaceAbove = selectRect.top - 10; // 减10px留边距

        // 4. popup预估高度（假设每项36px，最多显示8项 + padding）
        const estimatedPopupHeight = 300;
        const minPopupHeight = 100; // 最小高度

        console.log('[popup] 空间计算 - spaceAbove:', spaceAbove, 'spaceBelow:', spaceBelow, 'estimatedHeight:', estimatedPopupHeight);

        // 5. 判断方向和最大高度 by xu 20251212
        if (spaceBelow >= estimatedPopupHeight) {
          // 下方空间足够，向下展开，不限制高度
          popupDirection.value = "bottom";
          popupMaxHeight.value = "none";
          console.log('[popup] 向下展开，空间充足');
        } else if (spaceAbove >= estimatedPopupHeight) {
          // 上方空间足够，向上展开，不限制高度
          popupDirection.value = "top";
          popupMaxHeight.value = "none";
          console.log('[popup] 向上展开，空间充足');
        } else {
          // 上下空间都不足，选择空间大的方向，并限制高度出滚动条
          if (spaceBelow >= spaceAbove) {
            popupDirection.value = "bottom";
            popupMaxHeight.value = Math.max(spaceBelow, minPopupHeight) + "px";
            console.log('[popup] 向下展开，空间不足，限制高度:', popupMaxHeight.value);
          } else {
            popupDirection.value = "top";
            popupMaxHeight.value = Math.max(spaceAbove, minPopupHeight) + "px";
            console.log('[popup] 向上展开，空间不足，限制高度:', popupMaxHeight.value);
          }
        }
      };
      //级联菜单点击事件
      const togglePopup = () => {
        if (!popupWinVisible.value) {
          //如果当前下拉菜单是隐藏的，先ajax重新加载下拉菜单项，再显示。

          showPopup();
        } else {
          hidePopup();
        }
      };

      //显示下拉菜单，在此之前先清除下拉菜单项
      const showPopup = () => {
        //清空下拉菜单，并设置第一项的值为空
        clearAndInit1stOpt();
        Vue.nextTick(() => {
          calculatePopupDirection();
        });
        let url = props.url;
        let filterObj = props.param.filter;

        if (filterObj) {
          for (let k in filterObj) {
            let v = filterObj[k];
            url += "&" + k + "=" + v;
          }
        }

        if (props.mode === "1") {
          //如果是有隐藏字段的下拉菜单

          console.log("666url:" + url);

          // alert('url:'+url);

          // 获取级联菜单所有下拉菜单项
          async function getSelectItems(value) {
            try {
              // alert(1);
              if (props.url && props.param) {
                // alert(2);
                /**
                 *            param={"objectpickerparam":"{\"input\":\"false\",\"cascadingLevel\":\"hksheng,hkshi,hkxian\"," +
                 *                     "\"name\":\"hksheng\",\"cascadingName\":\"dq\"," +
                 *                     "\"cascadingInputsName\":\"hkdqm\",\"codebook\":\"sheng\"}",
                 *                 "objectpickertype":1,//2表示获取要回显的一项，1表示获取所有下拉菜单项
                 *                 "upperValue":"440000"
                 *             };
                 */

                const objectPickerParam = {
                  input: "false",
                  cascadingLevel: props.param.fieldOrd.join(","), //如："hksheng,hkshi,hkxian"
                  name: props.name, //本下拉菜单名
                  cascadingName: props.param.name, //级联菜单名
                  cascadingInputsName: props.param.combField, //对象属性，即隐藏字段名，如：hkdqm
                  codebook: props.param.codebook,
                };

                console.log("mode1 upperValue.value:" + upperValue.value);

                const objectPickerParamStr = JSON.stringify(objectPickerParam);

                const params = new URLSearchParams();
                params.append("objectpickerparam", objectPickerParamStr);
                params.append("objectpickertype", "1");
                if (upperValue.value) {
                  params.append("upperValue", upperValue.value);
                }
                // params.append('objectpickervalue', value); //需回显的值

                axios
                    .post(url, params, {
                      headers: {
                        "Content-Type": "application/x-www-form-urlencoded", // 必须手动设置！
                      },
                    })
                    .then((response) => {
                      if ("timeout" == response.data.statusText) {
                        alert("网络超时!");
                        return;
                      }

                      if (response.data.result) {
                        const keys = Object.keys(response.data.result);
                        console.log(
                            "params:" +
                            params +
                            "@@response.data:" +
                            JSON.stringify(response.data)
                        );

                        if (keys.length > 0) {
                          for (let k in response.data.result) {
                            props.opt.push({
                              label: response.data.result[k],
                              value: k,
                            });
                          }

                          console.log("props.opt11:" + JSON.stringify(props.opt));
                        } else {
                          // 没有数据时打印日志 by xu 20251212
                          console.log("[ccp mode1] 接口返回空数据");
                        }
                      } else {
                        // result不存在时打印日志 by xu 20251212
                        console.log("[ccp mode1] 接口返回无result");
                      }

                      // 无论是否有数据，都显示popup by xu 20251212
                      if (!popupWinVisible.value) {
                        popupWinVisible.value = true;
                      }
                    });
              }
            } catch (error) {
              alert(error);
              // callback(null, error.message); // 失败回调，传递错误
            }
          }

          getSelectItems(props.modelValue);
        } else if (props.mode === "2") {
          //没隐藏字段的下拉菜单

          let needInitParam = undefined;
          if (Array.isArray(props.param)) {
            needInitParam = props.param[props.param.length - 1]; //只初始化数组最后一项
            console.log(
                "needInitParam最后一项:" + JSON.stringify(needInitParam)
            );
          } else {
            needInitParam = props.param;
          }

          // 获取级联菜单所有下拉菜单项
          async function getSelectItems(value, sendParam) {
            try {
              // alert(1);
              if (props.url && sendParam) {
                // alert(2);
                /**
                 *            param="{\"input\":\"false\",\"cascadingLevel\":\"dwid,sjryid\",
                 *            \"ryid\":\"111121\",\"name\":\"sjryid\",
                 *            \"cascadingName\":\"dw_sjry\",\"codebook\":\"sjryByDw\"}"
                 */

                const objectPickerParam = {
                  input: "false",
                  cascadingLevel: sendParam.fieldOrd.join(","), //如："hksheng,hkshi,hkxian"
                  name: props.name, //本下拉菜单名
                  cascadingName: sendParam.name, //级联菜单名
                  codebook: sendParam.codebook,
                };

                console.log("mode2 upperValue.value:" + upperValue.value);

                const objectPickerParamStr = JSON.stringify(objectPickerParam);

                const params = new URLSearchParams();
                params.append("objectpickerparam", objectPickerParamStr);
                params.append("objectpickertype", "1");
                if (upperValue.value) {
                  params.append("upperValue", upperValue.value);
                }
                // params.append('objectpickervalue', value); //需回显的值

                axios
                    .post(url, params, {
                      headers: {
                        "Content-Type": "application/x-www-form-urlencoded", // 必须手动设置！
                      },
                    })
                    .then((response) => {
                      if ("timeout" == response.data.statusText) {
                        alert("网络超时!");
                        return;
                      }

                      if (response.data.result) {
                        const keys = Object.keys(response.data.result);
                        console.log(
                            "params:" +
                            params +
                            "@@response.data:" +
                            JSON.stringify(response.data)
                        );

                        if (keys.length > 0) {
                          for (let k in response.data.result) {
                            props.opt.push({
                              label: response.data.result[k],
                              value: k,
                            });
                          }

                          console.log("props.opt11:" + JSON.stringify(props.opt));
                        } else {
                          // 没有数据时打印日志 by xu 20251212
                          console.log("[ccp mode2] 接口返回空数据");
                        }
                      } else {
                        // result不存在时打印日志 by xu 20251212
                        console.log("[ccp mode2] 接口返回无result");
                      }

                      // 无论是否有数据，都显示popup by xu 20251212
                      if (!popupWinVisible.value) {
                        popupWinVisible.value = true;
                      }
                    });
              }
            } catch (error) {
              alert(error);
              // callback(null, error.message); // 失败回调，传递错误
            }
          }

          getSelectItems(props.modelValue, needInitParam);

          // popupWinVisible.value = !popupWinVisible.value;
        }
      };

      const hidePopup = () => {
        popupWinVisible.value = false;
      };

      // 合并所有的 onMounted 逻辑
      Vue.onMounted(() => {
        window.addEventListener("resize", calculatePopupDirection);

        // 1. 监听展开下一级事件
        window.addEventListener("open-next-cascader", (event) => {
          const { name, level } = event.detail;
          if (name === props.name && level === props.level) {
            popupWinVisible.value = true;
          }
        });

        // 2. 监听级联事件
        window.addEventListener("cascader-change", (event) => {
          const { name, level, value } = event.detail;
          if (name === props.name && level < props.level) {
            selectItem.value = { label: "", value: "" };
            emit("update:modelValue", "");
            if (ssHidden) {
              ssHidden.updateValue(value);
            }
          }
        });
      });
      Vue.onUnmounted(() => {
        window.removeEventListener("resize", calculatePopupDirection);
      });
      // 监听值变化，处理回显 (mode 2)
      Vue.watch(
          () => props.modelValue,
          (newVal) => {
            if (props.mode === "2" && newVal) {
              // 使用 watchEffect 替代嵌套的 watch
              Vue.watchEffect(() => {
                if (props.opt.length > 0) {
                  const matchedOption = props.opt.find(
                      (opt) => opt.value === newVal
                  );
                  if (matchedOption) {
                    selectItem.value = matchedOption;
                  }
                }
              });
            } else {
              // 原有的值变化处理
              const item = props.opt.find((it) => it.value === newVal);
              if (item) {
                selectItem.value = item;
              } else {
                selectItem.value = { label: "", value: "" };
              }
            }
          },
          { immediate: true }
      );

      // 监听选项变化，当数据加载完成时进行匹配
      Vue.watch(
          () => props.opt,
          (newOptions) => {
            if (newOptions.length > 0) {
              const matchedOption = newOptions.find(
                  (opt) => opt.value === selectItem.value.value
              );
              if (matchedOption) {
                selectItem.value = matchedOption;
                emit("update:modelValue", matchedOption.value);
                emit("change", matchedOption.value);
              }
            }
          }
      );

      return {
        selectItem,
        popupWinVisible,
        popupDirection,
        popupMaxHeight, // 添加popup最大高度 by xu 20251212
        togglePopup,
        hidePopup,
        doSelectItem,
      };
    },

    template: `
      <div class="input ss-ccp-container" style="position: relative" :style="{width: width}">
        <input type="hidden" :name="name" :value="modelValue">
        <div class="select-container" @mouseleave="hidePopup">
          <div class="input" @click="togglePopup">
            <input 
              type="hidden"
              :name="name"
              :value="selectItem.value"
            />
            <input
              :placeholder="placeholder"
              :value="selectItem.label"
              disabled
              style="pointer-events: none;"
            />
            <div class="suffix">
              <ss-form-icon :class="popupWinVisible ? 'form-icon-transform-select select' : 'form-icon-select'" />
            </div>
          </div>

          <!-- popup弹出层，添加maxHeight和overflowY支持空间不足时滚动 by xu 20251212 -->
          <div v-show="popupWinVisible" class="popup-win " :class="popupDirection" :style="{ maxHeight: popupMaxHeight, overflowY: popupMaxHeight !== 'none' ? 'auto' : 'visible' }">
            <div v-if="opt && opt.length > 0" class="popup-content">
              <div class="content-area">
                <div 
                  v-for="(item, index) in opt" 
                  :key="index" 
                  @click="doSelectItem(item)" 
                  :class="{ active: item.value === selectItem.value }"
                >
                  <span class="check-icon">
                    <ss-form-icon class="form-icon-select-checked" />
                  </span>
                  <span>{{ item.label }}</span>
                </div>
              </div>
            </div>
            <div v-else class="popup-content">
              <div class="content-area">
                <div class="content-area">
                  <span>无选项</span>
                </div>
              </div>
            </div>
          </div>
        </div>
      </div>
    `,
  };
  // ss-date-picker 日期时间选择器组件
  const SsDatePicker = {
    name: "SsDatePicker",
    props: {
      modelValue: {
        type: [String, Number, Date],
        default: "",
      },
      name: {
        type: String,
        required: true,
      },
      type: {
        type: String,
        default: "date",
        validator: (value) => ["date", "datetime", "time"].includes(value),
      },
      fmt: {
        type: String,
        default: null,
      },
      placeholder: {
        type: String,
        default: "",
      },
      width: {
        type: String,
        default: "100%",
      },
    },

    emits: ["update:modelValue"],

    setup(props, { emit }) {
      const errMsg = ref("");
      const validate = () => {
        if (window.ssVm) {
          const result = window.ssVm.validateField(props.name);
          console.log("validate", window.ssVm.validateField(props.name));
          errMsg.value = result.valid ? "" : result.message;
        }
      };
      // 根据type确定默认格式
      const defaultFormat = computed(() => {
        switch (props.type) {
          case "datetime":
            return "YYYY-MM-DD HH:mm:ss";
          case "date":
            return "YYYY-MM-DD";
          case "time":
            return "HH:mm:ss";
        }
      });
      const convertJavaFormatToElement = (javaFormat) => {
        if (!javaFormat) return null;
        return javaFormat
            .replace("yyyy", "YYYY")
            .replace("MM", "MM")
            .replace("dd", "DD")
            .replace("HH", "HH")
            .replace("mm", "mm")
            .replace("ss", "ss");
      };

      const finalFormat = computed(() => {
        if (props.fmt) {
          return convertJavaFormatToElement(props.fmt);
        }
        return defaultFormat.value;
      });

      // 使用 resolveComponent 获取组件
      const ElDatePicker = resolveComponent("ElDatePicker");
      const ElTimePicker = resolveComponent("ElTimePicker");
      const SsFormIcon = resolveComponent("SsFormIcon");
      const ElIcon = resolveComponent("ElIcon");

      const handleValueUpdate = (val) => {
        emit("update:modelValue", val);
        emit("change", val); // 同时触发 change 事件
        setTimeout(() => {
          validate();
        }, 50);
      };
      const dateType = computed(() => {
        const fmt = props.fmt || "";
        if (fmt.includes("HH:mm:ss")) {
          return "datetime";
        } else if (fmt.includes("HH:mm")) {
          return "datetime";
        } else if (fmt.includes("mm:ss")) {
          return "time";
        }
        return "date";
      });

      let useTimePicker = true;
      //"yyyy-MM-dd HH:mm:ss";  "日期字符串格式在java的写法",传到本组件fmt属性也是按这个格式
      if (props.fmt) {
        //有fmt属性，则以fmt属性优先判断类型
        if (/[dMy]/.test(props.fmt)) {
          //如果有传入日期格式，且含年月日
          useTimePicker = false;
        } else {
          useTimePicker = true;
        }
      } else if (props.type !== "time") {
        useTimePicker = false;
      }

      return () =>
          h("div", { class: "ss-date-picker", style: { width: props.width } }, [
            h("input", {
              type: "hidden",
              name: props.name,
              value: props.modelValue,
            }),
            // 选择组件
            h(useTimePicker ? ElTimePicker : ElDatePicker, {
              modelValue: props.modelValue,
              "onUpdate:modelValue": handleValueUpdate,
              type: dateType.value,
              format: finalFormat.value,
              "value-format": finalFormat.value,
              clearable: true,
              placeholder: props.placeholder,
              class: "custom-date-picker", // 用于自定义样式
              "time-arrow-control": props.type === "datetime", // 修改这里
              size: "large", // 添加这一行，改为 large 尺寸
              style: { width: "100%" },
              "prefix-icon": h(SsFormIcon, { class: "form-icon-time" }),
            }),
          ]);
    },
  };
  // ss-icon 图标
  // v3.0 增加 class 属性分支：有 class 走新逻辑，否则走 v1.0 逻辑 by xu 20251212
  // v3.0 用法: <ss-icon class="icon-obj-ry menu-icon" />
  // v1.0 用法: <ss-icon name="setting" size="20px" />
  const SsIcon = {
    name: "SsIcon",
    // v3.0 禁用 class 透传，手动处理 by xu 20251215
    inheritAttrs: false,
    props: {
      // v1.0: 以下为旧属性
      name: { type: String },
      size: { type: [Number, String], default: 16 },
      unit: { type: String, default: "px" },
      color: String,
      type: {
        type: String,
        default: ssIcon.name,
        validator: function (value) {
          return [ssIcon, commonIcon].some((icon) => icon.name === value);
        },
      },
    },
    emits: ["update:modelValue", "input", "blur", "change"],
    setup(props, { emit, attrs }) {
      // v3.0 分支：有 class 属性时直接渲染（从 attrs 获取） by xu 20251215
      if (attrs.class) {
        return () => h("i", { ...attrs, class: attrs.class + ' icon-container' });
      }

      // v1.0 分支：原有逻辑
      const useIconType = computed(() => {
        return [ssIcon, commonIcon].find(
            (iconConfig) => iconConfig.name === props.type
        );
      });
      const iconName = computed(() => {
        const iconConfig = useIconType.value; // 注意：使用 .value 来访问响应式引用的值
        if (!iconConfig) {
          console.error(`Icon type "${props.type}" not found.`);
          return "";
        }
        const iconType = iconConfig.types[props.name];
        if (!iconType) {
          console.error(
              `Icon name "${props.name}" not found in type "${props.type}".`
          );
          return "";
        }
        return `${iconConfig.prefix}${iconType}`;
      });

      // 类似地，你可以计算 fontFamily 和 style
      const fontFamily = computed(() => {
        return useIconType.value ? useIconType.value.family : "";
      });
      // console.log(iconName.value,fontFamily.value)
      const style = computed(() => {
        const sizeStyle = isNum(props.size)
            ? `${props.size}${props.unit}`
            : props.size;
        const styleObj = {
          fontSize: sizeStyle,
          color: props.color || "",
        };
        return toStyleStr(styleObj);
      });

      // 使用渲染函数定义模板逻辑
      return () =>
          h("i", {
            class: ["icon-container", iconName.value, fontFamily.value],
            style: style.value,
          });
    },
  };
  // 通用icon
  const SsCommonIcon = {
    name: "SsCommonIcon",
    props: {
      class: {
        type: String,
        required: true,
      },
    },
    setup(props) {
      return () =>
          h("i", {
            class: props.class + " common-icon",
          });
    },
  };
  // 登录页icon
  const SsLoginIcon = {
    name: "SsLoginIcon",
    props: {
      class: {
        type: String,
        required: true,
      },
    },
    setup(props) {
      return () =>
          h("div", {
            class: props.class + " login-icon",
          });
    },
  };
  // 弹窗icon
  const SsDialogIcon = {
    name: "SsDialogIcon",
    props: {
      class: {
        type: String,
        required: true,
      },
    },
    setup(props) {
      return () =>
          h("i", {
            class: props.class + " dialog-icon",
          });
    },
  };
  // 全局左侧导航图标组件
  const SsNavIcon = {
    name: "SsNavIcon",
    props: {
      class: {
        type: String,
        required: true,
      },
    },
    setup(props) {
      return () =>
          h("div", {
            class: props.class + " nav-icon",
          });
    },
  };
  // 顶部工具栏图标组件
  const SsHeaderIcon = {
    name: "SsHeaderIcon",
    props: {
      class: {
        type: String,
        required: true,
      },
    },
    setup(props) {
      return () =>
          h("div", {
            class: props.class + " header-icon",
          });
    },
  };

  // 全局菜单图标组件
  const SsGolbalMenuIcon = {
    name: "SsGolbalMenuIcon",
    props: {
      class: {
        type: String,
        required: true,
      },
    },
    setup(props) {
      return () =>
          h("div", {
            class: props.class + " global-menu-icon",
          });
    },
  };
  // 全局查询列表卡片图标
  const SsCartListIcon = {
    name: "SsCartListIcon",
    props: {
      class: {
        type: String,
        required: true,
      },
    },
    setup(props) {
      return () =>
          h("div", {
            class: props.class + " cart-list-icon",
          });
    },
  };
  // 全局底部工具栏图标组件
  const SsQuickIcon = {
    name: "SsQuickIcon",
    props: {
      class: {
        type: String,
        required: true,
      },
    },
    setup(props) {
      return () =>
          h("div", {
            class: props.class + " quick-icon",
          });
    },
  };
  // 表单组件icon
  const SsFormIcon = {
    name: "SsFormIcon",
    props: {
      class: {
        type: String,
        required: true,
      },
    },
    setup(props) {
      return () =>
          h("div", {
            class: props.class + " form-icon",
          });
    },
  };
  // 弹窗底部按钮icon
  const SsBottomDivIcon = {
    name: "SsBottomDivIcon",
    props: {
      class: {
        type: String,
        required: true,
      },
    },
    setup(props) {
      return () =>
          h("div", {
            class: props.class + " bottom-div-icon",
          });
    },
  };
  // editor组件icon
  const SsEditorIcon = {
    name: "SsEditorIcon",
    props: {
      class: {
        type: String,
        required: true,
      },
    },
    setup(props) {
      return () =>
          h("i", {
            class: props.class + " editor-icon",
          });
    },
  };
  // ss-validate校验器
  const SsValidate = {
    name: "SsValidate",
    props: {
      errMsg: { type: String },
      textAlign: { type: String, default: "left" },
      style: { type: Object, default: () => ({}) },
    },
    template: `<div class="validate-vline"></div>
    <div class="validate-tip" :style="style">
      <div class="tip" :style="{ textAlign: textAlign }">{{ errMsg }}</div>
      <div class="tip-more" :style="{ textAlign: textAlign }">{{ errMsg }}</div>
    </div>`,
  };
  // ss-onoff-array 多选按钮 数组形式
  const SsonoffArray = {
    name: "SsonoffArray",
    props: {
      name: {
        type: String,
        required: true,
      },
      opt: {
        type: Array,
        default: () => [],
      },
      defaultValue: [String, Number, Array],
      modelValue: [String, Number, Array],
      multiple: {
        // 新增多选模式属性
        type: Boolean,
        default: false,
      },
      // 是否允许一项都不选，默认true允许 by xu 20251212
      null: {
        type: Boolean,
        default: true,
      },
    },
    emits: ["update:modelValue"], // 允许更新 v-model 绑定的值
    setup(props, { emit }) {
      console.log("多选按钮", props.opt);
      // 使用数组来存储选中值
      const checkedValue = ref(
          props.multiple
              ? Array.isArray(props.defaultValue)
                  ? props.defaultValue
                  : []
              : props.defaultValue
      );
      const errMsg = ref(props.errTip);

      // 生成icon名字
      const genIconName = (itemValue) => {
        if (props.multiple) {
          return checkedValue.value.includes(itemValue)
              ? "form-icon-onoff-checked"
              : "form-icon-onoff-unchecked";
        }
        return checkedValue.value === itemValue
            ? "form-icon-onoff-checked"
            : "form-icon-onoff-unchecked";
      };
      // 选中项
      const selectItem = (value) => {
        if (props.multiple) {
          // 多选模式
          const index = checkedValue.value.indexOf(value);
          if (index === -1) {
            checkedValue.value = [...checkedValue.value, value];
          } else {
            // 取消选中当前项
            const newValue = checkedValue.value.filter((v) => v !== value);
            // 如果不允许为空且取消后为空，则阻止取消操作 by xu 20251212
            if (!props.null && newValue.length === 0) {
              return; // 阻止取消最后一项
            }
            checkedValue.value = newValue;
          }
        } else {
          // 单选模式
          // 如果点击的是当前已选中的项，判断是否允许取消 by xu 20251212
          if (checkedValue.value === value) {
            if (!props.null) {
              return; // 不允许为空时，阻止取消
            }
            checkedValue.value = ""; // 允许为空时，取消选中
          } else {
            checkedValue.value = value;
          }
        }

        emit("update:modelValue", checkedValue.value);
        nextTick(() => {
          // 触发验证
          if (window.ssVm) {
            window.ssVm.validateField(props.name);
          }
        });
      };

      return { checkedValue, genIconName, selectItem };
    },
    // 使用渲染函数定义模板逻辑
    render() {
      const SsFormIcon = resolveComponent("ss-form-icon");
      return h("div", { class: "radio-container" }, [
        // 根据情况创建 input
        this.multiple
            ? this.checkedValue.length
                ? // 多选且有选中值：为选中项创建 input
                this.checkedValue.map((value) =>
                    h("input", {
                      type: "checkbox",
                      name: this.name,
                      value: value,
                      checked: true,
                      style: { display: "none" },
                    })
                )
                : // 多选但没有选中值：创建一个空值 input
                h("input", {
                  type: "hidden",
                  name: this.name,
                  value: "",
                })
            : // 单选模式：创建一个 input
            h("input", {
              type: "hidden",
              name: this.name,
              value: this.checkedValue || "",
            }),

        this.opt.map((item, i) =>
            h(
                "div",
                {
                  key: i,
                  class: {
                    checked: this.multiple
                        ? this.checkedValue.includes(item.value)
                        : this.checkedValue === item.value,
                  },
                  style: { width: item.width },
                  onClick: () => this.selectItem(item.value),
                },
                [
                  h("span", null, item.label),
                  h("div", { class: "mark" }, [
                    h(SsFormIcon, {
                      class: this.genIconName(item.value),
                    }),
                  ]),
                ]
            )
        ),
      ]);
    },
  };

  // ss-onoff 一个按钮
  const Ssonoff = {
    name: "Ssonoff",
    props: {
      name: {
        type: String,
        required: true,
      },
      label: {
        type: String,
        required: true,
      },
      value: {
        type: [String, Number],
        required: true,
      },
      width: {
        type: String,
        default: "",
      },
      modelValue: [String, Number, Array],
      multiple: {
        type: Boolean,
        default: false,
      },
      null: {
        type: Boolean,
        default: true,
      },
    },
    emits: ["update:modelValue"],

    setup(props, { emit }) {
      const parseModelValue = (val) => {
        if (!val) return [];
        // 如果以逗号开头，去掉开头的逗号
        const cleanValue = val.toString().replace(/^,+/, "");
        if (cleanValue.includes("|")) {
          return cleanValue.split("|");
        }
        if (cleanValue.includes(",")) {
          return cleanValue.split(",");
        }
        return [cleanValue];
      };
      // 判断当前按钮是否选中
      const isChecked = computed(() => {
        if (props.multiple) {
          const currentValue = parseModelValue(props.modelValue);
          return currentValue.includes(props.value.toString());

          // return Array.isArray(props.modelValue) && props.modelValue.includes(props.value);
        }
        return (props.modelValue+'') === (props.value+'');//强转为字符串类型再比较（改之前是数字类型和字符串类型作比较，永远为false） Ben 20251206
      });

      // 切换选中状态
      const toggleSelect = () => {
        if (props.multiple) {
          const currentValue = parseModelValue(props.modelValue);
          const index = currentValue.indexOf(props.value.toString());
          let newValue;

          if (index === -1) {
            // 选中当前项
            newValue = [...currentValue, props.value];
          } else {
            // 取消选中当前项
            const filteredValue = currentValue.filter((v) => v !== props.value.toString());

            // 如果不允许为空且取消后为空，则阻止取消操作
            if (!props.null && filteredValue.length === 0) {
              return; // 阻止取消最后一项
            }

            newValue = filteredValue;
          }
          emit("update:modelValue", newValue.join(","));
        } else {
          // 单选模式
          const currentValue = parseModelValue(props.modelValue);
          const isCurrentlySelected = currentValue.includes(props.value.toString());

          if (!isCurrentlySelected) {
            // 选中当前项
            emit("update:modelValue", props.value);
          } else {
            // 取消选中当前项
            // 如果不允许为空且当前只有这一项被选中，则阻止取消操作
            if (!props.null && currentValue.length === 1) {
              return; // 阻止取消唯一选中项
            }
            emit("update:modelValue", "");
          }
        }

        nextTick(() => {
          // 触发验证
          if (window.ssVm) {
            window.ssVm.validateField(props.name);
          }
        });
      };

      return { isChecked, toggleSelect };
    },

    render() {
      const SsFormIcon = resolveComponent("ss-form-icon");
      return h("div", { class: "radio-container2" }, [
        // 隐藏的表单元素
        this.multiple
            ? h("input", {
              type: "hidden",
              name: `${this.name}`, // 多选模式下使用数组形式的 name
              value: this.isChecked ? this.value : "",
            })
            : this.isChecked &&
            h("input", {
              // 只有当前按钮被选中时才创建 input
              type: "hidden",
              name: this.name,
              value: this.value,
            }),

        // 按钮显示
        h(
            "div",
            {
              class: { checked: this.isChecked },
              style: { width: this.width },
              onClick: this.toggleSelect,
            },
            [
              h("span", null, this.label),
              h("div", { class: "mark" }, [
                h(SsFormIcon, {
                  class: this.isChecked
                      ? "form-icon-onoff-checked"
                      : "form-icon-onoff-unchecked",
                }),
              ]),
            ]
        ),
      ]);
    },
  };

  // ss-textarea
  const SsTextarea = {
    name: "SsTextarea",
    props: {
      name: {
        type: String,
        required: true,
      },
      placeholder: {
        type: String,
        default: "请输入",
      },
      defaultValue: [String, Number],
      modelValue: [String, Number],
    },
    emits: ["update:modelValue"],
    setup(props, { emit }) {
      const inputValue = ref(props.modelValue || props.defaultValue || "");

      // 监听 modelValue 变化
      watch(
          () => props.modelValue,
          (newVal) => {
            inputValue.value = newVal;
          }
      );

      // 输入事件处理
      const onInput = (event) => {
        const newValue = event.target.value;
        inputValue.value = newValue;
        emit("update:modelValue", newValue);
        // 触发验证
        if (window.ssVm) {
          window.ssVm.validateField(props.name);
        }
      };

      // 失焦时验证
      const onBlur = () => {
        if (window.ssVm) {
          window.ssVm.validateField(props.name);
        }
      };

      return { inputValue, onInput, onBlur };
    },
    render() {
      return h("div", { class: "textarea-container" }, [
        h("div", { class: "textarea" }, [
          // 添加隐藏的 input 用于验证
          h("input", {
            type: "hidden",
            name: this.name,
            value: this.inputValue || "",
          }),
          h("textarea", {
            placeholder: this.placeholder,
            value: this.inputValue,
            onInput: this.onInput,
            onBlur: this.onBlur,
          }),
        ]),
      ]);
    },
  };
  // ss-editor 富文本编辑器 基于Jodit
  const SsEditor = {
    name: "SsEditor",
    props: {
      modelValue: {
        type: String,
        default: "",
      },
      name: {
        type: String,
        default: "",
      },
      url: {
        type: String,
        default: "",
      },
      height: {
        type: [Number, String],
        default: 400,
      },
      placeholder: {
        type: String,
        default: "请输入内容",
      },
      readonly: {
        type: Boolean,
        default: false,
      },
      uploadUrl: {
        type: String,
        default: "/ulByHttp",//原值为“upload” Ben(20251205)
      },
      param: {
        type: Object,
        default: () => ({}),
      },
    },

    emits: ["update:modelValue", "ready", "change"],

    setup(props, { emit }) {
      const SsEditorIcon = resolveComponent("SsEditorIcon");
      const editorRef = ref(null);
      let editorContent = '';//保存富文本编辑器里面的富文本内容
      const uniqueId = "editor-" + Date.now();
      const errMsg = Vue.ref("");
      let fjid = ref(props.param.button.val);
      let fjName = props.param.button.desc;
      let mode = props.param.mode;
      const validate = () => {
        if (window.ssVm) {
          const result = window.ssVm.validateField(props.name);
          console.log("validate", window.ssVm.validateField(props.name));
          errMsg.value = result.valid ? "" : result.message;
        }
      };
      onMounted(() => {
        validate();
        const editor = Jodit.make(`#${uniqueId}`, {
          height: props.height,
          placeholder: props.placeholder,
          readonly: props.readonly,
          language: "zh_cn",
          i18n: {
            zh_cn: {
              Link: "链接",
              URL: "链接",
              "No follow": "无跟踪",
              "Class name": "类名",
              Image: "图片",
              File: "文件",
              "Line height": "行高",
              Alternative: "描述",
              "Alternative text": "描述",
              "Lower Alpha": "小写字母",
              "Upper Alpha": "大写字母",
              "Upper Roman": "大写罗马数字",
              "Lower Roman": "小写罗马数字",
              "Lower Greek": "小写希腊字母",
              "Lower Letter": "小写字母",
              "Upper Letter": "大写字母",
            },
          },
          showXPathInStatusbar: false,
          showCharsCounter: false,
          showWordsCounter: false,
          allowResizeY: false,
          toolbarSticky: false,

          statusbar: false,
          uploader: {
            url: props.uploadUrl,
            format: "json",
            method: "POST",
            filesVariableName: function (i) {
              return "imgs[" + i + "]";
            },
            headers: {
              Accept: "application/json",
            },
            prepareData: function (formData) {
              // 这里可以在发送前处理表单数据
              return formData;
            },
            isSuccess: function (resp) {
              console.log("isSuccess resp:", resp);
              return resp.code === 0;
            },
            getMessage: function (resp) {
              console.log("getMessage resp:", resp);
              return resp.msg || "上传失败";
            },
            process: function (resp) {
              console.log("process resp:", resp);
              return resp.data.url;
            },
            error: function (e) {
              console.error("上传失败:", e.message);
            },
            defaultHandlerSuccess: function (resp) {
              console.log("上传成功:", resp);
            },
            defaultHandlerError: function (err) {
              console.error("上传错误:", err);
            },
            contentType: function (requestData) {
              // 可以根据需要修改 Content-Type
              return false; // 让浏览器自动设置
            },
          },

          // 自定义字体列表
          controls: {
            font: {
              list: {
                Arial: "Arial",
                SimSun: "宋体",
                SimHei: "黑体",
                "Microsoft YaHei": "微软雅黑",
                KaiTi: "楷体",
                FangSong: "仿宋",
                "Times New Roman": "Times New Roman",
                "Courier New": "Courier New",
              },
            },
            customLinkButton: {
              name: "link",
              tooltip: "附件",
              exec: function (editor) {
                // 按钮点击时的处理函数
                console.log("附件点击了");
                console.log("param", props.param);
                console.log("cmsAddUrl",props.param.button.cmsAddUrl);

                if (fjid.value == null || fjid.value == "") {
                  $.ajax({
                    type: "post",
                    url: props.param.button.cmsAddUrl,
                    async: false,
                    data: {
                      name: "fjid",
                      ssNrObjName: "sh",
                      ssNrObjId: "",
                    },
                    success: function (_fjid) {
                      console.log("cmsAddUrl success", _fjid);
                      fjid.value = _fjid;
                    },
                  });
                }
                var str =
                    "&nrid=T-" +
                    fjid.value +
                    "&objectId=" +
                    fjid.value +
                    "&objectName=" +
                    fjName +
                    "&callback=" +
                    (window["fjidCallbackName"] || "");
                console.log("str", str);
                SS.openDialog({
                  src: props.param.button.cmsUpdUrl + str,
                  headerTitle: "编辑",
                  width: 900,
                  high: 664,
                  zIndex:51
                });
                // ss.display.showComponent({
                //   show: ["wdDialog"],
                //   url: props.param.button.cmsUpdUrl + str,
                //   title: "编辑",
                //   width: 900,
                //   high: 664,
                // });
              },
            },
          },
          toolbarAdaptive: true,
          buttons: [
            "fullsize",
            "bold",
            "italic",
            "underline",
            "strikethrough",
            "eraser",
            "|",
            "font",
            "fontsize",
            "brush",
            "paragraph",
            "|",
            "left",
            "center",
            "right",
            "justify",
            "|",
            "ul",
            "ol",
            "indent",
            "outdent",
            "|",
            "image",
            "table",
            "customLinkButton",
            "print",
            "|",
            "undo",
            "redo",
            "find",
          ],
          // 中等宽度时显示的按钮
          buttonsMD: [
            "fullsize",
            "bold",
            "italic",
            "underline",
            "strikethrough",
            "eraser",
            "|",
            "font",
            "fontsize",
            "brush",
            "paragraph",
            "|",
            "font",
            "fontsize",
            "|",
            "left",
            "center",
            "right",
            "justify",
            "|",
            "image",
            "customLinkButton",
            "|",
            "dots", // 其余按钮会自动进入 dots 菜单
          ],

          // 小屏幕时显示的按钮
          buttonsSM: ["fullsize", "bold", "italic", "|", "image", "|", "dots"],

          // 超小屏幕时显示的按钮
          buttonsXS: ["fullsize", "bold", "|", "dots"],
          // 设置响应式断点
          sizeLG: 1024, // 大屏幕
          sizeMD: 768, // 中等屏幕
          sizeSM: 576, // 小屏幕
          // 自定义图标
          getIcon: function (name, clearName) {
            // 定义图标映射
            const iconMap = {
              bold: "editor-icon-bold",
              italic: "editor-icon-italic",
              underline: "editor-icon-underline",
              strikethrough: "editor-icon-strikethrough",
              eraser: "editor-icon-eraser",
              copyformat: "editor-icon-copyformat",
              font: "editor-icon-font",
              fontsize: "editor-icon-fontsize",
              brush: "editor-icon-brush",
              paragraph: "editor-icon-paragraph",
              left: "editor-icon-align-left",
              center: "editor-icon-align-center",
              right: "editor-icon-align-right",
              justify: "editor-icon-align-justify",
              ul: "editor-icon-ul",
              ol: "editor-icon-ol",
              indent: "editor-icon-indent",
              outdent: "editor-icon-outdent",
              image: "editor-icon-image",
              file: "editor-icon-file",
              video: "editor-icon-video",
              table: "editor-icon-table",
              link: "editor-icon-link",
              source: "editor-icon-source",
              eye: "editor-icon-preview",
              fullsize: "editor-icon-fullsize",
              shrink: "editor-icon-fullsize-exit", // 添加退出全屏图标

              print: "editor-icon-print",
              undo: "editor-icon-undo",
              redo: "editor-icon-redo",
              search: "editor-icon-find",
              selectall: "editor-icon-selectall",
            };
            // 获取对应的图标类名
            const iconClass = iconMap[clearName] || iconMap[name];

            if (iconClass) {
              // 返回带有我们自定义图标类的 span 元素
              return `<span class="editor-icon ${iconClass}"></span>`;
            }

            return null;
          },
        });



        // 设置初始值
        editor.value = editorContent;
        // editor.value = props.modelValue;

        // 监听变化
        editor.events.on("change", () => {
          // emit("update:modelValue", editor.value);
          editorContent = editor.value;
          // alert('editorContent:'+editorContent);
          let contentElements = document.getElementsByName(props.name.replace(/wj$/, "") + "Edit");
          if(contentElements.length>0){
            contentElements[0].value = editorContent;
          }
          emit("change", editor.value);
          setTimeout(() => {
            validate();
          }, 50);
        });

        // 保存编辑器实例
        editorRef.value = editor;

        emit("ready", editor);

        //回显编辑器富文本文件
        if (props.url ) {
          const params = new URLSearchParams();

          if(mode)
            params.append("mode", mode);

          if(props.modelValue)
            params.append("path", props.modelValue);

          // alert('props.url:'+props.url+',props.modelValue:'+props.modelValue);

          axios
              .post(props.url, params, {
                headers: {
                  "Content-Type": "application/x-www-form-urlencoded", // 必须手动设置！
                },
              })
              .then((response) => {
                // alert(JSON.stringify(response.data));

                if ("timeout" == response.data.statusText) {
                  alert("网络超时!");
                  return;
                }

                let content = response.data.content;
                if (content) {
                  // editor.value = content;
                  editorRef.value.value = content;
                  editorContent = content;
                  // alert('editor.value:'+editor.value)
                }

                let filePath = response.data.path;
                // alert('response.data:'+JSON.stringify(response.data));
                if(filePath){
                  props.modelValue = filePath;
                  emit("update:modelValue", filePath);
                }
              });
        }
      });

      // 监听值变化
      watch(
          // () => props.modelValue,
          () => editorContent,
          (newValue) => {
            if (editorRef.value && newValue !== editorRef.value.value) {
              editorRef.value.value = newValue || "";
            }
          }
      );

      // 监听只读状态变化
      watch(
          () => props.readonly,
          (newValue) => {
            if (editorRef.value) {
              editorRef.value.setReadOnly(newValue);
            }
          }
      );

      // 组件销毁时清理
      onBeforeUnmount(() => {
        if (editorRef.value) {
          editorRef.value.destruct();
        }
      });

      return () =>
          h("div", { class: "ss-editor-container" }, [
            fjid.value &&
            h("input", {
              type: "hidden",
              name: "fjid",
              value: fjid.value,
            }),
            h("input", {
              type: "hidden",
              name: props.name.replace(/wj$/, "") + "Edit",
              value: editorContent
              // value: props.modelValue,
            }),
            h("input", {
              type: "hidden",
              name: props.name.replace(/wj$/, "") + "wj",
              value: props.modelValue
              // value: props.url
            }),
            h("input", { type: "hidden", name: "ueditorpath", value: "mswj" }),
            h("textarea", { id: uniqueId }),
          ]);
    },
  };
  // 弹窗右边图标
  const SsFullStyleHeader = {
    name: "SsFullStyleHeader",
    props: {
      title: {
        type: String,
        default: "标题",
      },
    },
    emits: ["close"],
    setup(props, { emit }) {
      // console.log(props.title)
      const onClose = () => {
        emit("close");
      };
      const SsIcon = resolveComponent("ss-icon");
      return () =>
          h("div", { class: "header-container" }, [
            h("div", { class: "title" }, props.title),
            h("div", { class: "handle-bar" }, [
              h("div", { class: "left-bar" }, [
                h(SsDialogIcon, { class: "dialog-icon-download" }),
                h(SsDialogIcon, { class: "dialog-icon-print" }),
                h(SsDialogIcon, { class: "dialog-icon-setting" }),
                h(SsDialogIcon, { class: "dialog-icon-collect" }),
                h(SsDialogIcon, { class: "dialog-icon-help" }),
                h(SsDialogIcon, { class: "dialog-icon-full-screen" }),
                h(SsDialogIcon, { class: "dialog-icon-lock" }),
              ]),
              h("div", { class: "close-bar", onClick: onClose }, [
                h(SsDialogIcon, { class: "dialog-icon-close" }),
              ]),
            ]),
          ]);
    },
  };
  // ss-dialog弹窗
  const SsDialog = {
    name: "SsDialog",
    props: {
      src: {
        type: String,
      },
      headerTitle: {
        type: String,
        // required: true,
        default: "弹窗",
      },
      width: {
        type: String,
        default: "1400",
      },
      height: {
        type: String,
        default: "600",
      },
      params: {
        type: Object,
        default: () => ({}),
      },
      zIndex: {
        type: Number,
        default: 1000,
      },
    },
    emits: ["close"],
    setup(props, { slots, emit }) {
      // 关闭窗口方法
      const onClose = () => {
        emit("close");
      };
      const showHeader = ref(true);
      const headerVisible = ref(false);
      const popupHieght = ref(props.height);
      // 状态：存储位置信息
      const position = reactive({
        // 页面居中
        x: (window.innerWidth - props.width) / 2,
        y: (window.innerHeight - popupHieght.value) / 2,
        isDragging: false,
        offsetX: 0,
        offsetY: 0,
      });
      // 鼠标按下时设置起始坐标并开始拖拽
      const startDrag = (event) => {
        position.isDragging = true;
        position.offsetX = event.clientX - position.x;
        position.offsetY = event.clientY - position.y;
      };
      // 鼠标移动时更新位置
      const onDrag = (event) => {
        if (position.isDragging) {
          position.x = event.clientX - position.offsetX;
          position.y = event.clientY - position.offsetY;
        }
      };
      // 鼠标放开时结束拖拽
      const endDrag = () => {
        position.isDragging = false;
      };
      // 监听来自 iframe 的消息
      const handleMessage = (event) => {
        //  顶天立地
        if (event.data && typeof event.data.hasScrollBar !== "undefined") {
          if (event.data.hasScrollBar) {
            //   console.log(event);
            position.y = 10;
            showHeader.value = false;
            headerVisible.value = true;
            popupHieght.value = window.innerHeight - 20;
            //   console.log(popupHieght.value);
            document.querySelector(".body").style.height = "100%";
            document.querySelector(".body").style.paddingTop = "30px";
            document.querySelector(".header-container ").style.position =
                "absolute";
            document.querySelector(".header-container ").style.zIndex = "10";
          }
        }
      };
      // 鼠标移入关闭按钮区域时显示头部
      const onMouseEnterCloseButton = () => {
        headerVisible.value = false;
      };
      // 鼠标移出关闭按钮区域时隐藏头部
      const onMouseLeaveCloseButton = () => {
        headerVisible.value = true;
      };
      // 在组件挂载时添加全局事件监听器
      Vue.onMounted(() => {
        // 如果传过来的高度大于窗口高度，则设置为窗口高度减去20 否则保持传过来的高度
        popupHieght.value =
            popupHieght.value > window.innerHeight
                ? window.innerHeight - 20
                : popupHieght.value;
        const container = document.querySelector(".header-container");
        if (container) {
          container.addEventListener("mousedown", startDrag);
        }
        document.addEventListener("mousemove", onDrag);
        document.addEventListener("mouseup", endDrag);
        window.addEventListener("message", handleMessage);
      });

      // 在组件卸载时移除全局事件监听器
      Vue.onUnmounted(() => {
        document.removeEventListener("mousemove", onDrag);
        document.removeEventListener("mouseup", endDrag);
        window.removeEventListener("message", handleMessage);
      });
      const SsMark = resolveComponent("ss-mark");
      const SsFullStyleHeader = resolveComponent("ss-full-style-header");
      // render函数定义组件结构
      return () =>
          h(
              Teleport,
              { to: "body" }, // 使用 Teleport 将弹窗内容挂载到 body
              h(SsMark, { }, [
                h(
                    "div",
                    {
                      class: "popup-container",
                      style: {
                        position: "absolute",
                        left: `${position.x}px`,
                        top: `${position.y}px`,
                        width: props.width + "px",
                        height: popupHieght.value + "px",
                        zIndex: props.zIndex, // 确保弹窗在最上层
                      },
                    },
                    [
                      h(SsFullStyleHeader, {
                        class: "header",
                        title: props.headerTitle,
                        onClose: onClose,
                        onMousedown: startDrag, // 绑定拖动事件
                        onMouseUp: endDrag,
                        ...(!showHeader.value && {
                          onMouseenter: onMouseEnterCloseButton,
                          onMouseleave: onMouseLeaveCloseButton,
                        }),
                        style: {
                          cursor: position.isDragging ? "grabbing" : "grab",
                          visibility: headerVisible.value ? "hidden" : "visible",
                        },
                      }),
                      h(
                          "div",
                          {
                            class: "body",
                            style: {},
                          },
                          [
                            h("iframe", {
                              src: props.src,
                              frameborder: 0,
                              style: { width: "100%", height: "100%" },
                            }),
                          ]
                      ),
                      headerVisible.value &&
                      h("div", {
                        class: "close-button",

                        onMouseenter: onMouseEnterCloseButton,
                        onMouseleave: onMouseLeaveCloseButton,
                        style: {
                          position: "absolute",
                          top: "0",
                          right: "0",
                          // background: 'black',
                          width: "60px",
                          height: "60px",
                          cursor: "pointer",
                        },
                      }),
                    ]
                ),
              ])
          );
    },
  };
  // ss-mark遮罩层
  const SsMark = {
    name: "SsMark",

    setup(props, { slots, emit }) {
      return () =>
          h("div", { class: "dialog-container" }, [
            h("div", { class: "mark-content" }, [
              h("div", { class: "dialog-contianer" }, [
                slots.default ? slots.default() : "",
              ]),
            ]),
          ]);
    },
  };
  // ss-bottom-button 底部按钮 
  // 修改支持更多按钮 by xu 20251211
  const SsBottomButton = {
    name: "SsBottomButton",
    props: {
      text: {
        type: String,
        required: false,
      },
      type: {
        type: String,
        default: "button",
      },
      iconClass: {
        type: String,
      },
      class: {
        type: String,
        default: "",
      },
      onclick: {
        type: [Function, String],
        default: null,
      },
      // 修改支持更多按钮 by xu 20251211
      more: {
        type: [Boolean, String],
        default: false,
      },
    },
    setup(props, { emit }) {
      const SsBottomDivIcon = Vue.resolveComponent("ss-bottom-div-icon");
      const showDropdown = Vue.ref(false);
      // 修改支持更多按钮 by xu 20251211
      const moreKey = Vue.computed(() => {
        const val = props.more;
        if (val === false || val === null || typeof val === "undefined") {
          return null;
        }
        if (val === true || val === "" || val === "true") {
          return "moreChg";
        }
        return val;
      });

      // 从配置中读取按钮信息和下拉选项
      const config = Vue.computed(() => {
        if (moreKey.value && window.ss && window.ss.dom && window.ss.dom.btnElemConfig) {
          return window.ss.dom.btnElemConfig[moreKey.value] || {};
        }
        return {};
      });

      const buttonText = Vue.computed(() => {
        return props.text || config.value.desc || '';
      });

      const dropOptions = Vue.computed(() => {
        return config.value.dropOptions || [];
      });

      const hasDropdown = Vue.computed(() => {
        return dropOptions.value.length > 0;
      });

      const handleMouseEnter = () => {
        if (hasDropdown.value) {
          showDropdown.value = true;
        }
      };

      const handleMouseLeave = () => {
        showDropdown.value = false;
      };

      const handleDropItemClick = (option) => {
        if (option.callback && typeof option.callback === 'function') {
          option.callback();
        }
        showDropdown.value = false;
      };

      return () =>
          h(
              "div",
              {
                class: "ss-bottom-button-wrapper",
                onMouseenter: handleMouseEnter,
                onMouseleave: handleMouseLeave,
              },
              [
                h(
                    "button",
                    {
                      class: props.class,
                      onClick: (e) => {
                        e.stopPropagation();
                        if (props.onclick) {
                          // 如果是函数直接调用
                          if (typeof props.onclick === "function") {
                            props.onclick(e);
                          } else if (typeof props.onclick === "string") {
                            // 如果是字符串，使用直接的方法执行
                            // 临时存储按钮元素到全局变量
                            window.__ss_current_button = e.currentTarget;

                            // 直接执行代码，使用eval以保留原始上下文
                            try {
                              eval(props.onclick);
                            } finally {
                              // 清理全局变量
                              delete window.__ss_current_button;
                            }
                          }
                        }
                      },
                      type: props.type,
                    },
                    [
                      h("span", null, [
                        h(SsBottomDivIcon, {
                          class: props.iconClass,
                        }),
                      ]),
                      h("span", null, buttonText.value),
                    ]
                ),
                // 渲染下拉菜单
                hasDropdown.value && showDropdown.value
                    ? h(
                        "div",
                        {
                          class: "ss-bottom-button-dropdown",
                        },
                        dropOptions.value.map((option) =>
                            h(
                                "div",
                                {
                                  class: "ss-bottom-button-dropdown-item",
                                  onClick: (e) => {
                                    e.stopPropagation();
                                    handleDropItemClick(option);
                                  },
                                },
                                option.desc
                            )
                        )
                    )
                    : null,
              ]
          );
    },
  };
  // ss-search搜索框
  const SsSearch = {
    name: "SsSearch",
    props: {
      theme: {
        type: String,
        default: "light",
        validator: function (value) {
          return ["dark", "light"].includes(value);
        },
      },
      placeholder: {
        type: String,
        default: "请输入搜索条件",
      },
    },
    setup(props, { emit }) {
      const onClick = () => {
        console.log("Search clicked");
        emit("click");
      };
      const SsIcon = Vue.resolveComponent("ss-icon");
      return () =>
          Vue.h(
              "div",
              {
                class: ["search-container", props.theme],
                onClick: onClick,
              },
              [
                Vue.h("input", {
                  placeholder: props.placeholder,
                  disabled: true,
                }),
                Vue.h(SsIcon, {
                  name: "search-result",
                  size: "20px",
                }),
              ]
          );
    },
  };
  // ss-cart-item 菜单页面的卡片 左右结构
  const SsCartItem = {
    name: "SsCartItem",
    props: {
      active: Boolean,
      item: {
        type: Object,
        default: () => ({
          thumb: "images/example/project-img.png",
          title: "广州（国际）科技成果转化天河基地专",
          description: "佳能中国广州分公司",
          all: 50,
          finish: 5,
        }),
      },
    },
    setup(props, { emit }) {
      const item = props.item;

      const itemWidth = Vue.computed(() => {
        const containerWidth =
            document.body.clientWidth || document.body.scrollWidth - 520;
        const halfWidth = containerWidth / 2;
        if (halfWidth < 480) {
          return Math.min(containerWidth, 702) + "px";
        } else {
          return Math.min(halfWidth, 702) + "px";
        }
      });

      const onItemClick = (e) => {
        emit("click", e);
      };

      return {
        item,
        itemWidth,
        onItemClick,
      };
    },
    render() {
      const SsIcon = Vue.resolveComponent("ss-icon");
      return Vue.h(
          "div",
          {
            class: { "item-container": true, active: this.active },
            onClick: this.onItemClick,
            style: { width: this.itemWidth },
          },
          [
            Vue.h("div", { class: "header" }, [
              Vue.h(SsIcon, { name: "setting", size: "20px" }),
            ]),
            Vue.h("div", { class: "body" }, [
              Vue.h("div", { class: "left" }, [
                Vue.h("img", {
                  src: this.item.thumb,
                  alt: "Thumbnail",
                  class: "imgUnHandle",
                  style: { "object-fit": "cover", width: "100%", height: "100%" },
                }),
              ]),
              Vue.h("div", { class: "right" }, [
                Vue.h("div", { class: "title" }, this.item.title),
                Vue.h("div", { class: "desc" }, this.item.description),
                Vue.h("div", { class: "progress" }, [
                  Vue.h(
                      "div",
                      {
                        style: {
                          width: `${(this.item.finish / this.item.all) * 100}%`,
                        },
                      },
                      [Vue.h("div", `${this.item.finish}/${this.item.all}`)]
                  ),
                ]),
              ]),
            ]),
          ]
      );
    },
  };
  // ss-cart-item2 菜单页面的卡片 上下结构
  const SsCartItem2 = {
    name: "SsCartItem2",
    props: {
      active: Boolean,
      item: {
        type: Object,
        default: () => ({
          thumb: "images/example/project-img.png",
          title: "广州（国际）科技成果转化天河基地专",
          description: "佳能中国广州分公司",
          all: 50,
          finish: 5,
        }),
      },
    },
    setup(props, { emit }) {
      const item = props.item;
      const itemWidth = Vue.computed(() => {
        const containerWidth =
            document.body.clientWidth || document.body.scrollWidth - 520;
        const halfWidth = containerWidth / 2;
        if (halfWidth < 480) {
          return Math.min(containerWidth, 702) + "px";
        } else {
          return Math.min(halfWidth, 702) + "px";
        }
      });

      const onItemClick = (e) => {
        emit("click", e);
      };

      return {
        item,
        itemWidth,
        onItemClick,
      };
    },

    render() {
      const SsIcon = Vue.resolveComponent("ss-icon");
      return Vue.h(
          "div",
          {
            class: { "item-container2": true, active: this.active },
            onClick: this.onItemClick,
            style: { width: this.itemWidth },
          },
          [
            Vue.h("div", { class: "action-bar" }, [
              Vue.h(SsIcon, { name: "setting", size: "20px" }),
            ]),
            Vue.h("div", { class: "header" }, [
              Vue.h("div", { class: "title" }, `${this.item.title}`),
            ]),
            Vue.h("div", { class: "body" }, [
              Vue.h("div", { class: "left" }, [
                Vue.h("img", {
                  src: this.item.thumb,
                  alt: "Thumbnail",
                  class: "imgUnHandle",
                  style: { "object-fit": "cover", width: "100%", height: "100%" },
                }),
              ]),
              Vue.h("div", { class: "right" }, [
                Vue.h("div", { class: "content" }, this.item.description),
                Vue.h("div", { class: "tip" }, [
                  Vue.h("div", { class: "progress" }, [
                    Vue.h(
                        "div",
                        {
                          style: {
                            width: `${(this.item.finish / this.item.all) * 100}%`,
                          },
                        },
                        [Vue.h("div", `${this.item.finish}/${this.item.all}`)]
                    ),
                  ]),
                ]),
              ]),
            ]),
          ]
      );
    },
  };

  /**
   * SsListCard - 列表卡片组件
   *
   * @description 用于显示列表项的卡片组件，支持缩略图、标签、状态、操作按钮和选择功能
   *
   * @prop {Object} item - 卡片数据对象
   * @prop {String} item.title - 卡片标题
   * @prop {String} [item.thumb] - 缩略图 URL（可选）
   * @prop {String} [item.thumbType] - 缩略图类型：'thumbnail'（缩略图）或默认（证件照）
   * @prop {String} [item.status] - 卡片状态：'available'（可用-绿色）、'unavailable'（不可用-黄色）、'disabled'（禁用-红色）
   * @prop {Array} item.tags - 标签数组，格式：[{键: 值}, ...]
   * @prop {Function} item.onclick - 点击卡片的回调函数
   * @prop {Array} [item.buttons] - 操作按钮数组（可选），显示在右上角齿轮
   * @prop {Array} [item.statusIcons] - 状态图标数组（可选），显示在右上角，格式：[{class: '图标类名', title: '提示文字'}, ...]
   *
   * @example
   * // 基础用法
   * const item = {
   *   title: "卡片标题",
   *   tags: [
   *     { 类型: '文档' },
   *     { 状态: '进行中' }
   *   ],
   *   onclick: () => console.log('点击了卡片')
   * };
   *
   * @example
   * // 带缩略图和状态
   * const item = {
   *   title: "场地预定",
   *   thumbType: 'thumbnail',
   *   thumb: "https://example.com/image.jpg",
   *   status: "available",  // 绿色背景
   *   tags: [{ 容量: '50人' }],
   *   onclick: () => {}
   * };
   *
   * @example
   * // 带操作按钮和状态图标
   * const item = {
   *   title: "会议室A",
   *   tags: [{ 楼层: '3F' }],
   *   onclick: () => {},
   *   // 右上角操作按钮（齿轮）
   *   buttons: [{
   *     class: 'cart-list-setting',
   *     title: '编辑',
   *     onclick: () => console.log('编辑')
   *   }],
   *   // 右上角状态图标（在齿轮右边）
   *   statusIcons: [{
   *     class: 'icon-emoji',
   *     title: '清洁中'
   *   }]
   * };
   *
   * @features
   * - 卡片选择：鼠标悬停右下角显示选择角标，点击切换选中状态，选中后显示底部深灰色线条
   * - 状态颜色：根据 status 字段显示不同背景色（可用/不可用/禁用）
   * - 图片类型：支持证件照（73×100px）和缩略图（180×100px）两种尺寸
   * - 操作按钮：右上角齿轮，hover 显示，支持多个按钮下拉菜单
   * - 状态图标：右上角显示状态图标，齿轮会根据图标数量自动左移
   *
   * @author xu
   * @date 20260105
   */
	  // 组件文档补全（JSDoc） by xu 20260108
	  /**
	   * SsListCard（左侧对象卡片）
	   *
	   * 用途：
	   * - 渲染左侧卡片（标题 + tags）
	   * - 右下角“角标”用于选中/取消选中（不会触发卡片 click）
	   *
	   * 调用示例：
	   * ```html
	   * <ss-list-card :item="item" @toggle-select="handleToggleSelect" @click="openDetail"></ss-list-card>
	   * ```
	   *
	   * Props：
	   * - `item`：卡片数据对象（建议含 `id/title/tags[]`；内部会读写 `item._ssSelected` 作为选中态）
	   *
	   * Emits：
	   * - `toggle-select`：点击角标触发，参数 `{ item, selected }`
	   * - `click`：点击卡片主体触发（用于打开详情等）
	   */
			  const SsListCard = {
		    name: "SsListCard",
		    props: {
		      ssObjName: { type: String, default: "" }, // 功能：业务对象名（用于默认缩略图 icon） by xu 20260109
		      cardClickAction: { type: String, default: "view" }, // 功能：卡片主体点击动作（view=查看；single=单选互斥） by xu 20260109
		      item: {
		        type: Object,
		        required: true,
		      },
		    },
	    emits: ["click", "change", "toggle-select"],
	    setup(props, { emit }) {
	      const item = props.item;
      // 移除 itemWidth 计算属性，不再需要 by xu 20260105
	      // 判断卡片类型 by xu 20260105
	      const cardType = Vue.computed(() => {
	        // 支持“无图但保留缩略图占位”（同一业务列表图片形态一致） by xu 20260109
	        if (!item.thumb && !item.thumbType) return ''; // 业务列表“无图”形态
	        // 根据 thumbType 字段判断，如果没有则默认为证件照
	        return item.thumbType === 'thumbnail' ? 'card-thumbnail' : 'card-photo';
	      });
      // 判断状态类型 - 场地预定状态 by xu 20260105
      const statusClass = Vue.computed(() => {
        if (!item.status) return ''; // 无状态，默认白色
        // 映射状态值到 CSS 类名
        const statusMap = {
          'available': 'status-available',
          'unavailable': 'status-unavailable',
          'disabled': 'status-disabled'
        };
        return statusMap[item.status] || '';
      });
		      const onItemClick = (e) => {
		        // 清除所有类型卡片的 active 状态（卡片主体点击仅做 active 高亮） by xu 20260109
		        const allListCards = document.querySelectorAll(
		            ".knowledge-item-container"
		        );
		        const allFolderCards = document.querySelectorAll(".ss-folder-list");

        allListCards.forEach((card) => card.classList.remove("active"));
        allFolderCards.forEach((card) => card.classList.remove("active"));

		        // 设置当前项的 active 状态
		        e.currentTarget.classList.add("active");
		        // 卡片主体点击动作由页面级配置控制 by xu 20260109
		        if (props.cardClickAction === "view") {
		          props.item.onclick?.();
		          // 通知父级：卡片点击（查看） by xu 20260109
		          emit("click", props.item);
		        }
		      };
      const onItemChange = (e, icon, index) => {
        e.stopPropagation(); // 阻止事件冒泡到卡片
        props.item.buttons[0].onclick();
        // emit("change", { item: props.item, icon, index });
      };
      return {
        item,
        cardType,
        statusClass,
        onItemClick,
        onItemChange,
      };
    },

			    data() {
			      return {
			        showButtons: false,
			        selected: false, // 选择状态 by xu 20260105
			        showTextPopover: false, // 功能：右侧文字区 hover 展示全量 by xu 20260108
			        textPopoverType: "", // second-summary / second-tags / third / third-full by xu 20260108
			        textPopoverBottom: 0, // 功能：popover 从当前省略行位置向上展开 by xu 20260108
			        hideTextPopoverTimer: null, // 功能：鼠标从省略行移到浮层的缓冲 by xu 20260108
			        textPopoverPayload: null, // { kind, text?, lines? } by xu 20260108
			        ellipsisVisible: { // 功能：只在真实出现 ... 时才显示命中区/允许 goheight by xu 20260109
			          secondSummary: false,
			          secondTags: false,
			          third: false,
			          thirdFull: false,
			        },
			      };
			    },

					    methods: {
		      // 切换选择状态（对外 emit，支持方案A父级 state 中转） by xu 20260106
			      toggleSelect(e) {
			        e.stopPropagation();
			        // 使用 item 上的状态，便于父级/右侧边栏反向同步 by xu 20260106
			        this.item._ssSelected = !this.item?._ssSelected;
			        this.$emit("toggle-select", { item: this.item, selected: !!this.item?._ssSelected });
			      },
					      // 卡片主体点击=单选互斥：只有“本次切到选中”才清理其他选中 by xu 20260109
					      toggleSelectExclusive(e) {
					        e?.stopPropagation?.();
					        this.item._ssSelected = !this.item?._ssSelected;
					        const selected = !!this.item?._ssSelected;
					        this.$emit("toggle-select", { item: this.item, selected, exclusive: true });
					      },
					      // 功能：无缩略图时，用业务对象 icon 做默认图（ss-icon + icon-obj-xx） by xu 20260109
					      getBizThumbIconClass() {
					        const name = String(
					            this.ssObjName ||
					            this.item?.ssObjName ||
					            this.$root?.ssObjName ||
					            window?.ss?.dom?.ssObjName ||
					            ""
					        ).trim();
					        if (!name) return "";
					        return `icon-obj-${name}`;
					      },
				      // 功能：构造右侧文字区 4 行（摘要/类目或标签/对象号） by xu 20260108
					      buildRightTextLines() {
				        const item = this.item || {};
				        const summary = String(item?.desc ?? "").trim(); // 后端字段后续映射 by xu 20260108
				        const objNum = String(item?.objNum ?? "").trim(); // 后端字段后续映射 by xu 20260108
				        const categoryArr = Array.isArray(item?.category) ? item.category : [];
				        const tagsArr = Array.isArray(item?.tags) ? item.tags : [];
				        const hasTags = tagsArr.length > 0;
				        const hasCategory = categoryArr.length > 0;

				        // 第二部分（L1-L3）：摘要优先，其次物品参数 by xu 20260108
				        const secondKind = summary ? "summary" : hasTags ? "tags" : "";
				        const hasSecond = !!secondKind;

				        // 第三部分（L4）：对象号优先，其次类目 by xu 20260108
				        const thirdKind = objNum ? "objNum" : hasCategory ? "category" : "";
				        const hasThird = !!thirdKind;
				        const thirdFull = !hasSecond && hasThird; // 第二部分为空则第三部分占满 4 行 by xu 20260108
				        const secondFull = hasSecond && !hasThird && secondKind === "tags"; // 仅标签时占满 4 行（不留空行） by xu 20260109

				        const toValueText = (obj) => { // 功能：类目/标签回显统一只保留 value（去掉 key:） by xu 20260109
				          const [k, v] = Object.entries(obj || {})[0] || ["", ""];
				          if (v !== undefined && v !== null && String(v).trim() !== "") return String(v);
				          // 兼容后端可能只给 key 没给 value 的情况：退化为显示 key by xu 20260109
				          if (k !== undefined && k !== null && String(k).trim() !== "") return String(k);
				          return "";
				        };

				        const toLineList = (arr) =>
				          (arr || [])
				              .map(toValueText)
				              .map((s) => String(s ?? "").trim())
				              .filter(Boolean);

				        const flat = (arr) => toLineList(arr).join(" ");

				        // 第二部分 tags：默认 3 行；仅标签时占满 4 行（避免底部空一行） by xu 20260109
				        const secondTagsMaxLines = secondFull ? 4 : 3;
				        const secondTagsLinesFull = toLineList(tagsArr);
				        const secondTagsHead = secondTagsLinesFull.slice(0, Math.max(0, secondTagsMaxLines - 1));
				        const secondTagsTail = secondTagsLinesFull.slice(Math.max(0, secondTagsMaxLines - 1));
				        const secondTagsLast =
				          secondTagsTail.length <= 1 ? (secondTagsTail[0] || "") : secondTagsTail.join(" "); // 功能：最后一行平铺剩余 by xu 20260108

				        // 第三部分类目：卡片上串成一行；goheight 展开时一条一行 by xu 20260109
				        const categoryLinesFull = toLineList(categoryArr);
				        const categoryLine = categoryLinesFull.join(" ");

				        const thirdText = thirdKind === "objNum" ? objNum : thirdKind === "category" ? categoryLine : "";

				        return {
				          secondKind,
				          thirdKind,
				          hasSecond,
				          hasThird,
				          thirdFull,
				          secondFull,
				          summary,
				          secondTagsMaxLines,
				          secondTagsHead,
				          secondTagsLast,
				          secondTagsLinesFull,
				          objNum,
				          categoryLine,
				          categoryLinesFull,
				          thirdText,
				        };
				      },
			      measureTextOverflowByLines(text, maxLines, width) {
			        const w = Number(width) || 0;
			        if (!w || !text) return false;
			        const probe = document.createElement("div");
			        probe.style.position = "fixed";
			        probe.style.left = "-99999px";
			        probe.style.top = "0";
			        probe.style.width = w + "px";
			        probe.style.fontSize = "18px";
			        probe.style.lineHeight = "24px";
			        probe.style.whiteSpace = "normal";
			        probe.style.wordBreak = "break-word";
			        probe.style.visibility = "hidden";
			        probe.textContent = text;
			        document.body.appendChild(probe);
			        const h = probe.getBoundingClientRect().height || 0;
			        document.body.removeChild(probe);
			        return h > maxLines * 24 + 1;
			      },
				      measureSingleLineOverflow(text, width) {
				        const w = Number(width) || 0;
				        if (!w || !text) return false;
			        const probe = document.createElement("span");
			        probe.style.position = "fixed";
			        probe.style.left = "-99999px";
			        probe.style.top = "0";
			        probe.style.display = "inline-block";
			        probe.style.maxWidth = w + "px";
			        probe.style.fontSize = "18px";
			        probe.style.lineHeight = "24px";
			        probe.style.whiteSpace = "nowrap";
			        probe.style.visibility = "hidden";
			        probe.textContent = text;
			        document.body.appendChild(probe);
			        const overflow = (probe.scrollWidth || 0) > (probe.clientWidth || w) + 1;
				        document.body.removeChild(probe);
				        return overflow;
				      },
				      // 功能：根据当前卡片宽度刷新「是否出现 ...」状态（用于控制命中区显示） by xu 20260109
				      refreshEllipsisVisible() {
				        try {
				          const right = this.$el?.querySelector?.(".right");
				          const rawWidth = right?.getBoundingClientRect?.().width || right?.clientWidth || 0;
				          const width = Math.max(0, Math.round(rawWidth)); // 修复：内容区不再使用 padding-right 预留，测量按真实宽度 by xu 20260109
				          const model = this.buildRightTextLines();

				          const next = {
				            secondSummary: false,
				            secondTags: false,
				            third: false,
				            thirdFull: false,
				          };

				          if (model.secondKind === "summary" && model.summary) {
				            next.secondSummary = this.measureTextOverflowByLines(model.summary, 3, width);
				          }
				          if (model.secondKind === "tags") {
				            // 第二部分 tags：只有最后一行允许出现 ...；超出行数或最后一行过长才认为会出现 ... by xu 20260109
				            next.secondTags =
				                (Array.isArray(model.secondTagsLinesFull) && model.secondTagsLinesFull.length > (model.secondTagsMaxLines || 3)) ||
				                this.measureSingleLineOverflow(model.secondTagsLast, width);
				          }
				          if (model.hasThird && !model.thirdFull) {
				            next.third = this.measureSingleLineOverflow(model.thirdText, width);
				          }
				          if (model.hasThird && model.thirdFull) {
				            next.thirdFull = this.measureTextOverflowByLines(model.thirdText, 4, width);
				          }

				          const prev = this.ellipsisVisible || {};
				          const changed =
				              prev.secondSummary !== next.secondSummary ||
				              prev.secondTags !== next.secondTags ||
				              prev.third !== next.third ||
				              prev.thirdFull !== next.thirdFull;
				          if (changed) this.ellipsisVisible = next;
				        } catch (e) {
				          // ignore by xu 20260109
				        }
				      },
				      showTextPopoverFor(el, kind) {
			        // 调试开关：window.__SS_LISTCARD_DEBUG__ = true 时打印 hover/溢出判断日志 by xu 20260108
			        const debug = typeof window !== "undefined" && !!window.__SS_LISTCARD_DEBUG__;
			        if (debug) {
			          console.log("[SsListCard] ellipsis hover", {
			            kind,
			            el: el?.className,
			          });
			        }
				        const model = this.buildRightTextLines();
				        const lineEl = el?.closest?.(".ss-card-text__line") || el;
				        const right = lineEl?.closest?.(".right") || el?.closest?.(".right");
				        const rawWidth = right?.getBoundingClientRect?.().width || right?.clientWidth || 0;
				        const width = Math.max(0, Math.round(rawWidth)); // 修复：内容区不再预留 padding-right，测量按真实宽度 by xu 20260109

			        const textEl =
			          kind === "second-summary"
			            ? lineEl?.querySelector?.(".ss-card-text__secondSummary")
			            : kind === "second-tags"
			                ? lineEl?.querySelector?.(".ss-card-text__tagLineLast")
			                : kind === "third"
			                    ? lineEl?.querySelector?.(".ss-card-text__thirdLine")
			                    : lineEl?.querySelector?.(".ss-card-text__thirdFull");

				        let payload = null;
				        // 仅当真实会出现 ... 时才允许 goheight（避免“没超出也能出 goheight”） by xu 20260109
				        const overflowed =
				            kind === "second-summary"
				              ? this.measureTextOverflowByLines(model.summary, 3, width)
				              : kind === "second-tags"
				                  ? ((Array.isArray(model.secondTagsLinesFull) && model.secondTagsLinesFull.length > (model.secondTagsMaxLines || 3)) ||
				                      this.measureSingleLineOverflow(model.secondTagsLast, width))
				                  : kind === "third"
				                      ? this.measureSingleLineOverflow(model.thirdText, width)
				                      : this.measureTextOverflowByLines(model.thirdText, 4, width);
				        if (!overflowed) return;

				        if (kind === "second-summary") {
				          if (model.summary) payload = { kind, text: model.summary };
				        } else if (kind === "second-tags") {
				          if (Array.isArray(model.secondTagsLinesFull) && model.secondTagsLinesFull.length) {
				            payload = { kind, lines: model.secondTagsLinesFull };
				          }
				        } else if (kind === "third") {
				          if (model.thirdKind === "category" && Array.isArray(model.categoryLinesFull) && model.categoryLinesFull.length) {
				            payload = { kind, lines: model.categoryLinesFull }; // 功能：类目展开一条一行 by xu 20260109
				          } else if (model.thirdText) {
				            payload = { kind, text: model.thirdText };
				          }
				        } else if (kind === "third-full") {
				          if (model.thirdKind === "category" && Array.isArray(model.categoryLinesFull) && model.categoryLinesFull.length) {
				            payload = { kind, lines: model.categoryLinesFull }; // 功能：类目占满模式展开一条一行 by xu 20260109
				          } else if (model.thirdText) {
				            payload = { kind, text: model.thirdText };
				          }
				        }
			        if (debug) {
			          console.log("[SsListCard] ellipsis decide", {
			            kind,
			            rawWidth: Math.round(rawWidth),
			            width,
			            hasPayload: !!payload,
			            textEl: textEl?.className,
			            textClient: textEl ? { cw: textEl.clientWidth, ch: textEl.clientHeight, sw: textEl.scrollWidth, sh: textEl.scrollHeight } : null,
			          });
			        }
			        if (!payload) return;

			        this.clearHideTextPopoverTimer();
			        const container = lineEl?.closest?.(".right");
			        const containerRect = container?.getBoundingClientRect?.();
			        const lineRect = lineEl?.getBoundingClientRect?.();
			        if (containerRect && lineRect) {
			          const bottom = Math.max(0, Math.round(containerRect.bottom - lineRect.bottom));
			          this.textPopoverBottom = bottom;
			        } else {
			          this.textPopoverBottom = 0;
			        }
			        this.textPopoverPayload = payload;
			        this.textPopoverType = kind;
			        this.showTextPopover = true;
			        if (debug) console.log("[SsListCard] goheight show", payload);
			      },
		      isOverflowing(el) {
		        if (!el) return false;
		        // 单行/多行省略统一判断：scroll 尺寸大于 client 尺寸即认为有 ... by xu 20260108
		        return (el.scrollWidth && el.clientWidth && el.scrollWidth > el.clientWidth + 1) ||
		            (el.scrollHeight && el.clientHeight && el.scrollHeight > el.clientHeight + 1);
		      },
		      isSummaryOverflowing(el) {
		        if (!el) return false;
		        // -webkit-line-clamp 场景下 scrollHeight 不稳定，改用“无 clamp 的离屏测量”判断是否超过 2 行 by xu 20260108
		        const text = String(this.item?.desc ?? "").trim();
		        if (!text) return false;
		        const rect = el.getBoundingClientRect?.();
		        const width = rect?.width || el.clientWidth || 0;
		        if (!width) return false;
		        const probe = document.createElement("div");
		        probe.style.position = "fixed";
		        probe.style.left = "-99999px";
		        probe.style.top = "0";
		        probe.style.width = width + "px";
		        probe.style.fontSize = "18px";
		        probe.style.lineHeight = "24px";
		        probe.style.whiteSpace = "normal";
		        probe.style.wordBreak = "break-word";
		        probe.style.visibility = "hidden";
		        probe.textContent = text;
		        document.body.appendChild(probe);
		        const h = probe.getBoundingClientRect().height || 0;
		        document.body.removeChild(probe);
		        return h > 48 + 1;
		      },
				      clearHideTextPopoverTimer() {
				        if (this.hideTextPopoverTimer) {
				          clearTimeout(this.hideTextPopoverTimer);
				          this.hideTextPopoverTimer = null;
				        }
				      },
			      // 修复 goheight hover 无响应：移除重复方法覆盖，统一使用上面的 showTextPopoverFor(el, kind) by xu 20260109
				      hideTextPopoverLater() {
				        this.clearHideTextPopoverTimer();
				        this.hideTextPopoverTimer = setTimeout(() => {
				          this.showTextPopover = false;
				          this.textPopoverType = "";
			          this.textPopoverPayload = null;
			        }, 120);
			      },
			      hideTextPopover() {
			        this.clearHideTextPopoverTimer();
			        this.showTextPopover = false;
			        this.textPopoverType = "";
			        this.textPopoverPayload = null;
			      },
			      // 功能：新需求下不在 updated 内做测量，避免死循环 by xu 20260108
				    },

			    mounted() {
			      // 无需在 mounted/updated 里做 overflow 测量（避免死循环），只在 hover 触发时判断 by xu 20260108
			      // 仅用于控制“...命中区是否显示”，不会触发循环更新 by xu 20260109
			      this.$nextTick?.(() => {
			        requestAnimationFrame(() => this.refreshEllipsisVisible?.());
			      });
			      this.__ssListCardResizeHandler = () => this.refreshEllipsisVisible?.(); // 功能：窗口变化时刷新 ... 显示 by xu 20260109
			      window.addEventListener?.("resize", this.__ssListCardResizeHandler);
			    },
			    updated() {
			      // 卡片数据更新后刷新一次 ... 显示状态（避免“宽度/内容变了但命中区不变”） by xu 20260109
			      this.$nextTick?.(() => {
			        requestAnimationFrame(() => this.refreshEllipsisVisible?.());
			      });
			    },
			    beforeUnmount() {
			      // 清理 timer，避免残留导致异常 by xu 20260108
			      this.clearHideTextPopoverTimer?.();
			      if (this.__ssListCardResizeHandler) {
			        window.removeEventListener?.("resize", this.__ssListCardResizeHandler);
			        this.__ssListCardResizeHandler = null;
			      }
			    },

		    render() {
	      const SsCartListIcon = Vue.resolveComponent("ss-cart-list-icon");
	      const SsIcon = Vue.resolveComponent("ss-icon");
	      const hasThumbArea = !!(this.item?.thumb || this.item?.thumbType); // 功能：无图但有 thumbType 时仍保留占位 by xu 20260109
	      return Vue.h(
	          "div",
          {
            class: {
              "knowledge-item-container": true,
              active: this.item.active,
              [this.cardType]: !!this.cardType, // 动态添加卡片类型类名 by xu 20260105
              [this.statusClass] : !!this.statusClass
            },
	            onClick: (e) => {
	              this.onItemClick?.(e);
	              if (this.cardClickAction === "single") {
	                this.toggleSelectExclusive?.(e);
	              }
	            }, // 功能：卡片主体点击动作（view/single） by xu 20260109
	            // 移除固定宽度，由 CSS min-width 控制 by xu 20260105
	          },
          [
            // 右上角状态图标区域 by xu 20260105
            this.item?.statusIcons?.length > 0 &&
            Vue.h(
                "div",
                { class: "card-status-icons" },
                this.item.statusIcons.map((icon) =>
                    Vue.h(SsIcon, {
                      class: `status-icon ${icon.class}`,
                      title: icon.title,
                    })
                )
            ),

            this.item?.buttons?.length > 0 &&
            Vue.h(
                "div",
                {
                  class: "header",
                  style: this.item?.statusIcons?.length > 0
                    ? {
                        right: `${this.item.statusIcons.length * 48}px`,
                        borderTopRightRadius: '0'
                      }
                    : {},
                  onMouseenter: () => (this.showButtons = true),
                  onMouseleave: () => (this.showButtons = false),
                  onClick: (e) => this.onItemChange(e, this.item.buttons[0], 0),
                },
                [
                  // 只在有按钮时渲染设置图标
                  // this.item?.buttons?.length > 0 &&
                  Vue.h("div", {
                    class: "cart-list-setting cart-list-icon",
                    title: this.item?.buttons?.[0]?.title,
                  }),

                  // 鼠标移入时显示按钮列表，与图标同级
                  // this.item?.buttons?.length > 0 &&
                  this.showButtons &&
                  this.item?.buttons?.length > 1 &&
                  Vue.h(
                      "div",
                      {
                        class: "cart-list-button-popup",
                      },
                      this.item.buttons.map((btn) =>
                          Vue.h(
                              "div",
                              {
                                onClick: (e) => {
                                  e.stopPropagation();
                                  btn.onclick?.();
                                },
                              },
                              [
                                // 如果有 class，显示对应的图标
                                btn.class &&
                                Vue.h(SsCartListIcon, {
                                  class: [btn.class],
                                }),
                                // 显示按钮文本
                                Vue.h("span", null, btn.title),
                              ]
                          )
                      )
                  ),
                ]
            ),

            Vue.h("div", { class: "body" }, [
              Vue.h("div", { class: "box-header" }, [
                Vue.h("div", `${this.item.title}`),
              ]),
	              Vue.h(
	                  "div",
	                  {
	                    class: !hasThumbArea ? "no-thumb box-body" : "box-body",
	                  },
	                  [
	                    hasThumbArea
	                      ? this.item.thumb
	                        ? Vue.h("div", { class: "left" }, [
	                          Vue.h("img", {
	                            src: this.item.thumb,
	                            alt: "Thumbnail",
	                            class: "imgUnHandle",
	                            style: {
	                              "object-fit": "cover",
	                              width: "100%",
	                              height: "100%",
	                            },
	                          }),
	                        ])
	                        : Vue.h( // 功能：无图占位（ss-icon + biz icon，居中） by xu 20260109
	                            "div",
	                            { class: "left ss-objlist-thumbPlaceholder" },
	                            [
	                              Vue.h(SsIcon, {
	                                class: `${this.getBizThumbIconClass()} ss-objlist-thumbIcon`,
	                              }),
	                            ]
	                          )
	                      : null,
			                    Vue.h(
			                        "div",
			                        {
		                          class: "right",
		                        },
			                        (() => {
			                          const model = this.buildRightTextLines(); // 功能：右侧文字区新规则（第二部分/第三部分优先级） by xu 20260108
			                          const hasAny = !!(model?.hasSecond || model?.hasThird);

			                          if (!hasAny) return [];

			                          const children = [];

				                          // 第二部分：L1-L3（摘要优先，其次 tags；不足留空；超出 L3 ...） by xu 20260108
				                          if (model.hasSecond) {
				                            if (model.secondKind === "summary") {
				                              children.push(
				                                  Vue.h("div", { class: "ss-card-text__line ss-card-text__secondBlock" }, [
				                                    Vue.h("div", { class: "ss-card-text__secondSummary", title: model.summary }, model.summary),
				                                    Vue.h("span", {
				                                      class: ["ss-card-text__ellipsisHit", "ss-card-text__ellipsisHit--second", this.ellipsisVisible?.secondSummary ? "is-on" : ""],
				                                      title: "查看完整摘要",
				                                      onMouseenter: (e) => this.showTextPopoverFor(e?.currentTarget, "second-summary"),
				                                      onClick: (e) => { e?.stopPropagation?.(); this.showTextPopoverFor(e?.currentTarget, "second-summary"); }, // 功能：点击 ... 也可展开（避免 hover 受遮挡） by xu 20260109
				                                      onMouseleave: () => this.hideTextPopoverLater(),
				                                    }),
				                                  ])
				                              );
				                            } else if (model.secondKind === "tags") {
				                              children.push(
				                                  Vue.h("div", { class: ["ss-card-text__line", model.secondFull ? "ss-card-text__secondFullBlock" : "ss-card-text__secondBlock"] }, [ // 功能：仅标签时占满 4 行 by xu 20260109
				                                    Vue.h(
				                                        "div",
				                                        { class: "ss-card-text__secondTags" },
				                                        [
				                                          ...model.secondTagsHead.map((t) =>
			                                              Vue.h("div", { class: "ss-card-text__tagLine", title: t }, t)
			                                          ),
			                                          // 第三行：平铺剩余（可能为空） by xu 20260108
			                                          Vue.h("div", { class: "ss-card-text__tagLine is-last ss-card-text__tagLineLast", title: model.secondTagsLast }, model.secondTagsLast),
			                                        ].filter(Boolean)
			                                    ),
				                                    // 只在最后一行出现 ... 时才触发 goheight by xu 20260108
				                                    Vue.h("span", {
				                                      class: ["ss-card-text__ellipsisHit", "ss-card-text__ellipsisHit--second", this.ellipsisVisible?.secondTags ? "is-on" : ""],
				                                      title: "查看完整物品参数",
				                                      onMouseenter: (e) => this.showTextPopoverFor(e?.currentTarget, "second-tags"),
				                                      onClick: (e) => { e?.stopPropagation?.(); this.showTextPopoverFor(e?.currentTarget, "second-tags"); }, // 功能：点击 ... 也可展开（避免 hover 受遮挡） by xu 20260109
				                                      onMouseleave: () => this.hideTextPopoverLater(),
				                                    }),
				                                  ])
				                              );
				                            }
				                          }

			                          // 第三部分：默认 L4；第二部分为空则占满 L1-L4 by xu 20260108
			                          if (model.hasThird) {
			                            if (model.thirdFull) {
			                              children.push(
			                                  Vue.h("div", { class: "ss-card-text__line ss-card-text__thirdFullBlock" }, [
				                                    Vue.h("div", { class: "ss-card-text__thirdFull", title: model.thirdText }, model.thirdText),
				                                    Vue.h("span", {
				                                      class: ["ss-card-text__ellipsisHit", "ss-card-text__ellipsisHit--third", this.ellipsisVisible?.thirdFull ? "is-on" : ""],
				                                      title: "查看完整信息",
				                                      onMouseenter: (e) => this.showTextPopoverFor(e?.currentTarget, "third-full"),
				                                      onClick: (e) => { e?.stopPropagation?.(); this.showTextPopoverFor(e?.currentTarget, "third-full"); }, // 功能：点击 ... 也可展开（避免 hover 受遮挡） by xu 20260109
				                                      onMouseleave: () => this.hideTextPopoverLater(),
				                                    }),
				                                  ])
				                              );
				                            } else {
			                              children.push(
			                                  Vue.h("div", { class: "ss-card-text__line ss-card-text__thirdLineWrap" }, [
				                                    Vue.h("div", { class: "ss-card-text__thirdLine", title: model.thirdText }, model.thirdText),
				                                    Vue.h("span", {
				                                      class: ["ss-card-text__ellipsisHit", "ss-card-text__ellipsisHit--third", this.ellipsisVisible?.third ? "is-on" : ""],
				                                      title: "查看完整信息",
				                                      onMouseenter: (e) => this.showTextPopoverFor(e?.currentTarget, "third"),
				                                      onClick: (e) => { e?.stopPropagation?.(); this.showTextPopoverFor(e?.currentTarget, "third"); }, // 功能：点击 ... 也可展开（避免 hover 受遮挡） by xu 20260109
				                                      onMouseleave: () => this.hideTextPopoverLater(),
				                                    }),
				                                  ])
				                              );
				                            }
				                          }

			                          // hover 展开浮层：宽度=右侧文字区，底对齐向上展开，带阴影 by xu 20260108
			                          // popover 作为 `.right` 的 sibling 渲染，避免被 `.ss-card-text{overflow:hidden}` 裁剪 by xu 20260108
				                          const popover =
				                              this.showTextPopover &&
			                              Vue.h(
			                                  "div",
			                                  {
		                                    class: "ss-card-text-popover",
		                                    style: { bottom: this.textPopoverBottom + "px" },
		                                    onMouseenter: () => {
		                                      this.clearHideTextPopoverTimer();
		                                      this.showTextPopover = true;
		                                    },
		                                    onMouseleave: () => this.hideTextPopoverLater(),
		                                  },
				                                  (() => {
				                                    const p = this.textPopoverPayload || {};
				                                    if (p.kind === "second-summary" && p.text) {
				                                      return [Vue.h("div", { class: "ss-card-text-popover__summary" }, p.text)];
				                                    }
				                                    if (Array.isArray(p.lines)) {
				                                      return [
				                                        Vue.h(
				                                            "div",
				                                            { class: "ss-card-text-popover__kvlist" },
				                                            p.lines.map((t) => Vue.h("div", { class: "ss-card-text-popover__kv" }, t))
				                                        ),
				                                      ];
				                                    }
				                                    if ((p.kind === "third" || p.kind === "third-full") && p.text) {
				                                      return [Vue.h("div", { class: "ss-card-text-popover__objno" }, p.text)];
				                                    }
				                                    return [];
				                                  })()
			                              );

			                          return [
			                            Vue.h("div", { class: "ss-card-text" }, children),
			                            popover,
			                          ];
			                        })()
			                    ),
		                  ]
		              ),
		            ]),

	            // 右下角卡片选择图标 by xu 20260105
	            Vue.h(SsIcon, {
	              class: this.item?._ssSelected ? "card-icon icon-cardChk-on" : "card-icon icon-cardChk",
	              onClick: this.toggleSelect,
	            }),

	            // 选中后底部线条 by xu 20260105
	            this.item?._ssSelected && Vue.h("div", { class: "select-bottom-line" }),
	          ]
	      );
	    },
	  };

	  // ss-sidebar 右侧边栏（容器 + 子组件），用于 objList 右侧区域 by xu 20260106
	  // 组件文档补全（JSDoc） by xu 20260108
	  /**
	   * SsSidebarButtons（右侧边栏顶部按钮栏）
	   *
	   * 用途：
	   * - 渲染 objList 右侧顶部快捷操作（预定/入住/退房/清洁...）
	   * - 内部复用 `ss-search-button`（项目现有按钮样式/交互）
	   *
	   * 调用示例：
	   * ```html
	   * <ss-sidebar-buttons :items="sidebarButtons" />
	   * ```
	   *
	   * Props：
	   * - `items`: 按钮配置数组
	   *   - `{ id, text, icon?, onClick? }`
	   *
	   * Emits：
	   * - `click`：点击按钮时触发，参数为按钮对象
	   */
	  const SsSidebarButtons = {
	    name: "SsSidebarButtons",
	    props: {
	      items: { type: Array, default: () => [] },
	    },
	    emits: ["click"],
	    render() {
	      const SsSearchButton = Vue.resolveComponent("ss-search-button");
	      const items = this.items || [];
	      if (!items.length) return null;
	      return Vue.h(
	          "div",
	          { class: "ss-sidebar-actions" },
	          items.map((btn) =>
	              // 顶部操作按钮复用 ss-search-button（先 mock 固定按钮） by xu 20260106
	              Vue.h(SsSearchButton, {
	                text: btn?.text ?? "",
	                iconClass: btn?.iconClass ?? "",
	                opt: btn?.opt ?? [],
	                checkId: btn?.checkId ?? "0",
	                width: btn?.width,
	                id: btn?.id,
	                onClick: (e) => {
	                  e?.stopPropagation?.();
	                  btn?.onClick?.(btn);
	                  this.$emit("click", btn);
	                },
	              })
	          )
	      );
	    },
	  };

		  // 组件文档补全（JSDoc） by xu 20260108
		  /**
		   * SsSidebarChart（ECharts 容器渲染）
		   *
		   * 用途：
		   * - 仅负责 echarts init / setOption / resize / dispose
		   * - 被 `ss-sidebar-chart-hover` 与图表面板复用
		   *
		   * 调用示例：
		   * ```html
		   * <ss-sidebar-chart :options="option" height="220px" />
		   * ```
		   *
		   * Props：
		   * - `options`：ECharts option（Object）
		   * - `height`：容器高度（String）
		   */
		  const SsSidebarChart = {
		    name: "SsSidebarChart",
	    props: {
	      options: { type: Object, default: () => ({}) },
	      height: { type: String, default: "200px" },
	    },
	    setup(props) {
	      const elRef = Vue.ref(null);
	      let chart = null;

	      const renderChart = () => {
	        if (!elRef.value || !window.echarts) return;
	        if (!chart) {
	          chart = window.echarts.init(elRef.value);
	        }
	        chart.setOption(props.options || {}, true);
	      };

	      const resizeChart = () => {
	        chart?.resize?.();
	      };

	      Vue.onMounted(() => {
	        renderChart();
	        window.addEventListener("resize", resizeChart);
	      });

	      Vue.onBeforeUnmount(() => {
	        window.removeEventListener("resize", resizeChart);
	        chart?.dispose?.();
	        chart = null;
	      });

	      Vue.watch(
	          () => props.options,
	          () => {
	            renderChart();
	          },
	          { deep: true }
	      );

	      return { elRef };
	    },
	    render() {
	      return Vue.h("div", {
	        ref: "elRef",
	        style: {
	          width: "100%",
	          height: this.height,
	          // 图表容器不加 padding/border，由外层布局控制 by xu 20260106
	          background: "transparent",
	          border: "none",
	          "border-radius": "0",
	        },
	      });
	    },
	  };

		  // ss-sidebar-chart-hover：hover 弹出左侧大图（支持图钉/全屏） by xu 20260106
		  // 组件文档补全（JSDoc） by xu 20260108
		  /**
		   * SsSidebarChartHover（小图 + hover 左侧大图预览 + 图钉固定 + 全屏）
		   *
		   * 用途：
		   * - 右侧统计图小卡片：hover 时在左侧弹出大图预览
		   * - 预览头部：左侧图标+标题；右侧固定/全屏按钮（icon-base）
		   * - 全屏：方案A（浏览器 Fullscreen API）
		   *
		   * 调用示例（由 ss-sidebar chart panel 内部调用）：
		   * ```html
		   * <ss-sidebar-chart-hover
		   *   title="校舍建筑面积和总体分布"
		   *   icon-class="menu-icon icon-obj-jzw"
		   *   :options="option"
		   *   height="220px"
		   * />
		   * ```
		   *
		   * Props：
		   * - `title/iconClass/icon`：用于预览/全屏 header 显示（与面板 header 一致）
		   * - `options`：ECharts option
		   * - `height`：小图高度
		   * - `previewWidth/previewHeight`：预览建议尺寸（会按视口自适应）
		   */
		  const SsSidebarChartHover = {
		    name: "SsSidebarChartHover",
		    props: {
		      // hover 大图标题/图标（与小图面板 header 一致） by xu 20260108
		      title: { type: String, default: "" },
		      iconClass: { type: String, default: "" },
		      icon: { type: String, default: "" },
		      options: { type: Object, default: () => ({}) },
		      height: { type: String, default: "220px" },
		      // hover 弹窗建议尺寸：约 1000x650 by xu 20260108
		      previewWidth: { type: Number, default: 1000 },
		      previewHeight: { type: Number, default: 650 },
		    },
		    setup(props) {
		      const triggerRef = Vue.ref(null);
		      const fullscreenRef = Vue.ref(null);
		      const open = Vue.ref(false);
		      const pinned = Vue.ref(false);
		      const fullscreen = Vue.ref(false);
		      const hoveringTrigger = Vue.ref(false);
		      const hoveringPreview = Vue.ref(false);
		      const previewStyle = Vue.ref({});
		      let closeTimer = null;

		      const updatePreviewPosition = () => {
		        const el = triggerRef.value;
		        if (!el) return;
		        const rect = el.getBoundingClientRect();
		        const vw = window.innerWidth;
		        const vh = window.innerHeight;

		        // 预览窗尺寸：优先用 props 的建议值，但确保距离视口边缘留空 by xu 20260108
		        const viewportPaddingX = 40;
		        const viewportPaddingY = 60;
		        const width = Math.min(props.previewWidth, Math.max(320, vw - viewportPaddingX));
		        const height = Math.min(props.previewHeight, Math.max(240, vh - viewportPaddingY));

		        // 默认贴着小图左侧弹出，右边缘与小图左边缘轻微重叠，避免 1px 缝隙导致 hover 闪断 by xu 20260108
		        const overlap = 2;
		        const gapFromSidebar = 14; // 功能说明：弹窗与右侧边栏留出距离（更不贴近） by xu 20260108
		        let left = rect.left - width - gapFromSidebar + overlap;
		        // 如果左侧空间不足，则贴右侧（兜底，同样重叠） by xu 20260108
		        if (left < 0) left = rect.right + gapFromSidebar - overlap;
		        left = Math.max(0, Math.min(left, vw - width));

		        // top 对齐 header 顶部：向上查找 .ss-sidebar-panel__header 元素 by xu 20260108
		        const viewportPaddingTop = 20;
		        const viewportPaddingBottom = 10; // 功能说明：弹窗 bottom 留 10px 左右 by xu 20260108
		        let headerEl = el;
		        while (headerEl && !headerEl.classList?.contains("ss-sidebar-panel")) {
		          headerEl = headerEl.parentElement;
		        }
		        let headerRect = headerEl?.querySelector(".ss-sidebar-panel__header")?.getBoundingClientRect();
		        let top = headerRect?.top ?? rect.top;
		        top = Math.max(viewportPaddingTop, Math.min(top, vh - height - viewportPaddingBottom));

		        previewStyle.value = {
		          position: "fixed",
		          left: `${Math.round(left)}px`,
		          top: `${Math.round(top)}px`,
		          width: `${width}px`,
		          height: `${height}px`,
		          zIndex: 3000,
		        };
		      };
		     

	      const clearCloseTimer = () => {
	        if (closeTimer) {
	          clearTimeout(closeTimer);
	          closeTimer = null;
	        }
	      };

		      const scheduleClose = () => {
		        clearCloseTimer();
		        if (pinned.value || fullscreen.value) return;
		        if (hoveringTrigger.value || hoveringPreview.value) return; // 功能：鼠标在小图/大图之间移动不关闭 by xu 20260108
		        closeTimer = setTimeout(() => {
		          open.value = false;
		        }, 100);
		      };

		      const openPreview = () => {
		        clearCloseTimer();
		        updatePreviewPosition();
		        open.value = true;
		      };

	      const togglePin = () => {
	        pinned.value = !pinned.value;
	        if (pinned.value) {
	          open.value = true;
	          updatePreviewPosition();
	        }
	      };

		      const toggleFullscreen = () => {
		        // 全屏：采用浏览器 Fullscreen API（方案A），不使用遮罩弹窗 by xu 20260108
		        if (!fullscreen.value) {
		          open.value = false; // 避免同时渲染预览与全屏 by xu 20260108
		          fullscreen.value = true;
		          Vue.nextTick(() => {
		            const el = fullscreenRef.value;
		            if (el?.requestFullscreen) {
		              el.requestFullscreen().catch(() => {
		                // requestFullscreen 失败则回退为非全屏状态 by xu 20260108
		                fullscreen.value = false;
		              });
		            } else {
		              fullscreen.value = false;
		            }
		          });
		        } else {
		          if (document?.exitFullscreen) {
		            document.exitFullscreen().catch(() => {});
		          }
		        }
		      };

		      const handleFullscreenChange = () => {
		        const isFs = !!document.fullscreenElement;
		        fullscreen.value = isFs; // 功能说明：同步 ESC/系统退出全屏状态 by xu 20260108
		        if (isFs) {
		          open.value = false;
		          clearCloseTimer();
		          return;
		        }
		        // 退出全屏后：若固定或仍 hover，则恢复预览，否则关闭 by xu 20260108
		        if (pinned.value || hoveringTrigger.value || hoveringPreview.value) {
		          open.value = true;
		          updatePreviewPosition();
		        } else {
		          open.value = false;
		        }
		      };

		      Vue.onMounted(() => {
		        window.addEventListener("resize", updatePreviewPosition);
		        window.addEventListener("scroll", updatePreviewPosition, true);
		        document.addEventListener("fullscreenchange", handleFullscreenChange); // 功能说明：监听全屏状态变化 by xu 20260108
		      });

		      Vue.onBeforeUnmount(() => {
		        clearCloseTimer();
		        window.removeEventListener("resize", updatePreviewPosition);
		        window.removeEventListener("scroll", updatePreviewPosition, true);
		        document.removeEventListener("fullscreenchange", handleFullscreenChange);
		      });

		      return {
		        triggerRef,
		        fullscreenRef,
		        open,
		        pinned,
		        fullscreen,
		        hoveringTrigger,
		        hoveringPreview,
		        previewStyle,
		        openPreview,
		        scheduleClose,
		        clearCloseTimer,
		        togglePin,
	        toggleFullscreen,
	      };
	    },
		    render() {
		      const SsIcon = Vue.resolveComponent("ss-icon");
		      const Chart = Vue.resolveComponent("ss-sidebar-chart");
		      const hasHeader = !!(this.title || this.iconClass || this.icon); // 功能：hover 大图显示左侧图标+标题 by xu 20260108

		      const previewContent = Vue.h(
		          "div",
		          {
		            class: { "ss-sidebar-chart-preview": true, "is-pinned": this.pinned },
		            style: this.previewStyle,
		            onMouseenter: () => {
		              this.hoveringPreview = true;
		              this.clearCloseTimer();
		            },
		            onMouseleave: () => {
		              this.hoveringPreview = false;
		              this.scheduleClose();
		            },
		          },
		          [
		            hasHeader
		              ? Vue.h("div", { class: "ss-sidebar-panel__header ss-sidebar-chart-preview__header" }, [
		                  Vue.h("div", { class: "ss-sidebar-panel__title" }, [
		                    this.iconClass
		                      ? Vue.h(SsIcon, { class: this.iconClass + " ss-sidebar-panel__icon" })
		                      : this.icon
		                          ? Vue.h(SsIcon, { name: this.icon, size: "16px", class: "ss-sidebar-panel__icon" })
		                          : null,
		                    Vue.h("span", null, this.title || "统计图"),
		                  ]),
			                  Vue.h("div", { class: "ss-sidebar-panel__tools" }, [
			                    Vue.h(
			                        "button",
			                        {
			                          type: "button",
			                          class: { "ss-sidebar-chart-tool": true, "is-active": this.pinned },
			                          title: this.pinned ? "取消固定" : "固定",
			                          onClick: (e) => {
			                            e.stopPropagation();
			                            this.togglePin();
			                          },
			                        },
			                        // 固定图标：未固定 icon-fix，固定 icon-fix-bold（icon-base） by xu 20260108
			                        [Vue.h(SsIcon, { class: this.pinned ? "menu-base-icon icon-fix-bold" : "menu-base-icon icon-fix" })]
			                    ),
			                    Vue.h(
			                        "button",
			                        {
			                          type: "button",
			                          class: "ss-sidebar-chart-tool",
			                          title: "全屏",
			                          onClick: (e) => {
			                            e.stopPropagation();
			                            this.toggleFullscreen();
			                          },
			                        },
			                        // 全屏图标：未展开 icon-chk，展开 icon-chk-on（icon-base） by xu 20260108
			                        [Vue.h(SsIcon, { class: this.fullscreen ? "menu-base-icon icon-tuichuquanping" : "menu-base-icon icon-a-quanping_xi" })]
			                    ),
			                  ]),
			                ])
			              : Vue.h("div", { class: "ss-sidebar-chart-preview__header ss-sidebar-chart-preview__header--simple" }, [
		                  Vue.h("div", { class: "ss-sidebar-panel__tools" }, [
			                    Vue.h(
			                        "button",
			                        {
			                          type: "button",
			                          class: { "ss-sidebar-chart-tool": true, "is-active": this.pinned },
			                          title: this.pinned ? "取消固定" : "固定",
			                          onClick: (e) => {
			                            e.stopPropagation();
			                            this.togglePin();
			                          },
			                        },
			                        // 固定图标：未固定 icon-fix，固定 icon-fix-bold（icon-base） by xu 20260108
			                        [Vue.h(SsIcon, { class: this.pinned ? "menu-base-icon icon-fix-bold" : "menu-base-icon icon-fix" })]
			                    ),
			                    Vue.h(
			                        "button",
			                        {
			                          type: "button",
			                          class: "ss-sidebar-chart-tool",
			                          title: "全屏",
			                          onClick: (e) => {
			                            e.stopPropagation();
			                            this.toggleFullscreen();
			                          },
			                        },
			                        // 全屏图标：未展开 icon-chk，展开 icon-chk-on（icon-base） by xu 20260108
			                        [Vue.h(SsIcon, { class: this.fullscreen ? "menu-base-icon icon-chk-on" : "menu-base-icon icon-chk" })]
			                    ),
			                  ]),
			                ]),
		            Vue.h("div", { class: "ss-sidebar-chart-preview__body" }, [
		              Vue.h(Chart, { options: this.options, height: "100%" }),
		            ]),
		          ]
		      );

		      const fullscreenContent =
		          this.fullscreen &&
		          Vue.h(
		              "div",
		              {
		                ref: "fullscreenRef",
		                class: "ss-sidebar-chart-fullscreen",
		              },
		              [
		                Vue.h("div", { class: "ss-sidebar-panel__header ss-sidebar-chart-fullscreen__header" }, [
		                  Vue.h("div", { class: "ss-sidebar-panel__title" }, [
		                    this.iconClass
		                      ? Vue.h(SsIcon, { class: this.iconClass + " ss-sidebar-panel__icon" })
		                      : this.icon
		                          ? Vue.h(SsIcon, { name: this.icon, size: "16px", class: "ss-sidebar-panel__icon" })
		                          : null,
		                    Vue.h("span", null, this.title || "统计图"),
		                  ]),
		                  Vue.h("div", { class: "ss-sidebar-panel__tools" }, [
		                    Vue.h(
		                        "button",
		                        {
		                          type: "button",
		                          class: { "ss-sidebar-chart-tool": true, "is-active": this.pinned },
		                          title: this.pinned ? "取消固定" : "固定",
		                          onClick: (e) => {
		                            e.stopPropagation();
		                            this.togglePin();
		                          },
		                        },
		                        [Vue.h(SsIcon, { class: this.pinned ? "menu-base-icon icon-fix-bold" : "menu-base-icon icon-fix" })]
		                    ),
		                    Vue.h(
		                        "button",
		                        {
		                          type: "button",
		                          class: "ss-sidebar-chart-tool",
		                          title: "退出全屏",
		                          onClick: (e) => {
		                            e.stopPropagation();
		                            this.toggleFullscreen();
		                          },
		                        },
		                        [Vue.h(SsIcon, { class: "menu-base-icon icon-tuichuquanping" })]
		                    ),
		                  ]),
		                ]),
		                Vue.h("div", { class: "ss-sidebar-chart-fullscreen__body" }, [
		                  Vue.h(Chart, { options: this.options, height: "100%" }),
		                ]),
		              ]
		          );

		      return Vue.h("div", { class: "ss-sidebar-chart-hover" }, [
		        Vue.h(
		            "div",
		            {
		              ref: "triggerRef",
		              class: "ss-sidebar-chart-hover__trigger",
		              onMouseenter: () => {
		                this.hoveringTrigger = true;
		                this.openPreview();
		              },
		              onMouseleave: () => {
		                this.hoveringTrigger = false;
		                this.scheduleClose();
		              },
		            },
		            [Vue.h(Chart, { options: this.options, height: this.height })]
		        ),
		        (this.open || this.fullscreen) &&
		          Vue.h(Vue.Teleport, { to: "body" }, [
		            this.open ? previewContent : null,
		            fullscreenContent || null,
		          ]),
		      ]);
		    },
		  };

	  // 组件文档补全（JSDoc） by xu 20260108
	  /**
	   * SsSidebarList（右侧业务面板：人员/已选/服务/预定...）
	   *
	   * 用途：
	   * - 统一渲染面板 header（图标/标题/数量/右侧按钮）
	   * - 统一渲染 list（固定行高、hover、右侧移除按钮等）
	   *
	   * 调用示例（由 ss-sidebar 通过 panels 配置驱动）：
	   * ```js
	   * { type:'list', title:'已选', iconClass:'menu-icon icon-obj-xcd', mode:'selected', items:selectedItems, closable:true }
	   * ```
	   *
	   * Props（核心）：
	   * - `title`：header 标题
	   * - `iconClass/icon`：header 图标（优先 iconClass）
	   * - `count`：数量回显（图表面板可不传）
	   * - `closable`：是否显示“清空”按钮（触发 emit clear）
	   * - `headerFilters`：header 条件数组（组件名 + props），用于联调接口搜索
	   * - `headerSearchButton`：是否显示搜索按钮（触发 emit search）
	   * - `items`：列表数据
	   * - `mode`：`selected` 时右侧按钮语义为“移除”
	   * - `itemLayout`：`simple` / `person`（人员号槽位）
	   * - `itemAction`：是否显示 item 右侧操作按钮（hover 才出现）
	   *
	   * Emits：
	   * - `remove(item)`：点击 item 右侧移除
	   * - `clear()`：点击 header 清空
	   * - `search({keyword, filters})`：点击 header 搜索
	   */
	  const SsSidebarList = {
	    name: "SsSidebarList",
	    props: {
	      title: { type: String, default: "" },
	      // header 图标：优先使用 iconClass（走 ss-icon v3.0 class 分支） by xu 20260106
	      iconClass: { type: String, default: "" },
	      icon: { type: String, default: "" }, // 兼容旧写法（ss-icon name）
	      count: { type: [Number, String], default: "" },
	      // 选中类分区：右侧关闭按钮=清空分区数据 by xu 20260106
	      closable: { type: Boolean, default: false },
	      searchable: { type: Boolean, default: false },
	      // 搜索框是否放在 header 内（人员块需要该布局） by xu 20260106
	      searchInHeader: { type: Boolean, default: false },
	      // header 搜索：下拉条件 + 搜索按钮（适合“人员”块） by xu 20260106
	      headerFilters: { type: Array, default: () => [] },
	      headerSearchButton: { type: Boolean, default: false },
	      searchPlaceholder: { type: String, default: "搜索" },
	      // 列表项布局：simple(仅标题) / person(标题+人员号槽位) by xu 20260106
	      itemLayout: { type: String, default: "simple" },
	      itemAction: { type: Boolean, default: true },
	      items: { type: Array, default: () => [] },
	      mode: { type: String, default: "search" }, // search / selected
	    },
	    emits: ["select", "remove", "clear", "search"],
	    data() {
	      return { keyword: "", filterValues: {} };
	    },
	    created() {
	      // header 下拉条件默认值初始化 by xu 20260106
	      (this.headerFilters || []).forEach((f) => {
	        if (!f || !f.key) return;
	        if (this.filterValues[f.key] !== undefined) return;
	        const first = f?.options?.[0]?.value ?? "";
	        this.filterValues[f.key] = f.value !== undefined ? f.value : first;
	      });
	    },
	    render() {
	      const items = this.items || [];
	      const SsIcon = Vue.resolveComponent("ss-icon");
	      const isSelectedMode = this.mode === "selected";
	      const activeKeyword = this.filterValues?.keyword ?? this.keyword; // 功能：keyword 优先取 headerFilters.keyword by xu 20260106
	      const hasHeaderKeyword = (this.headerFilters || []).some((f) => f?.key === "keyword"); // 功能：header 内 keyword 过滤 by xu 20260106
	      const renderHeaderFilter = (f) => {
	        if (!f) return null;
	        const key = f.key;
	        const componentName = f.component;
	        if (!key || !componentName) return null;
	        const Comp = Vue.resolveComponent(componentName);
	        if (!Comp) return null;
	        const modelValue = this.filterValues[key];
	        const props = f.props || {};
	        return Vue.h(Comp, {
	          ...props,
	          modelValue,
	          "onUpdate:modelValue": (v) => {
	            this.filterValues[key] = v;
	          },
	        });
	      };
	      const filteredItems =
	          this.searchable && activeKeyword
	              ? items.filter((it) =>
	                  String(it?.title ?? "")
	                      .toLowerCase()
	                      .includes(String(activeKeyword).toLowerCase())
	                )
	              : items;

	      if (!filteredItems.length && !this.title) return null;

	      return Vue.h("div", { class: "ss-sidebar-panel" }, [
	        this.title
	          ? Vue.h("div", { class: "ss-sidebar-panel__header" }, [
	              Vue.h("div", { class: "ss-sidebar-panel__title" }, [
	                // 图标 + 标题（每个分区都有） by xu 20260106
	                this.iconClass
	                  ? Vue.h(SsIcon, { class: this.iconClass + " ss-sidebar-panel__icon" })
	                  : this.icon
	                      ? Vue.h(SsIcon, { name: this.icon, size: "16px", class: "ss-sidebar-panel__icon" })
	                      : null,
	                Vue.h("span", null, this.title),
	                // 数量回显：图表分区可不传 count by xu 20260106
	                this.count !== "" ? Vue.h("span", { class: "ss-sidebar-panel__count" }, `(${this.count})`) : null,
	              ]),
	              Vue.h("div", { class: "ss-sidebar-panel__tools" }, [
	                // header 条件（例如下拉框）+ 右侧搜索按钮 by xu 20260106
	                this.headerFilters?.length
	                  ? Vue.h(
	                      "div",
	                      { class: "ss-sidebar-panel__filters" },
	                      this.headerFilters.map(renderHeaderFilter).filter(Boolean)
	                    )
	                  : null,
	                this.headerSearchButton
	                  ? Vue.h(
	                      "button",
	                      {
	                        type: "button",
	                        class: "ss-sidebar-icon-btn",
	                        title: "搜索",
	                        onClick: (e) => {
	                          e.stopPropagation();
	                          this.$emit("search", {
	                            // headerFilters 内也可能包含 keyword by xu 20260106
	                            keyword: activeKeyword,
	                            filters: { ...(this.filterValues || {}) },
	                          });
	                        },
	                      },
	                      [Vue.h(SsIcon, { name: "search", size: "14px" })]
	                    )
	                  : null,
	                // 人员块：搜索框在 header 内 by xu 20260106
	                this.searchable && this.searchInHeader && !this.headerSearchButton
	                  ? Vue.h("div", { class: "ss-sidebar-panel__searchInline" }, [
	                      Vue.h("div", { class: "ss-sidebar-search is-inline" }, [
	                        Vue.h(SsIcon, { name: "search", size: "14px", class: "ss-sidebar-search__prefix" }),
	                        Vue.h("input", {
	                          class: "ss-sidebar-search__input",
	                          value: this.keyword,
	                          placeholder: this.searchPlaceholder,
	                          onInput: (e) => {
	                            this.keyword = e?.target?.value ?? "";
	                          },
	                        }),
	                      ]),
	                    ])
	                  : null,
	                this.closable
	                  ? Vue.h(
	                      "button",
	                      {
	                        type: "button",
	                        class: "ss-sidebar-icon-btn ss-sidebar-header-btn",
	                        title: "清空",
	                        onClick: (e) => {
	                          e.stopPropagation();
	                          this.$emit("clear");
	                        },
	                      },
	                      // 清空按钮使用 icon-base 的 icon-cl by xu 20260106
	                      [Vue.h(SsIcon, { class: "menu-base-icon icon-cl" })]
	                    )
	                  : null,
	              ]),
	            ])
	          : null,
	        // 非 header 内搜索：独立一行 by xu 20260106
	        // headerSearchButton/headerFilters 已覆盖搜索能力时，不再额外渲染独立搜索行 by xu 20260106
	        this.searchable && !this.searchInHeader && !this.headerSearchButton && !hasHeaderKeyword
	          ? Vue.h("div", { class: "ss-sidebar-panel__search" }, [
	              Vue.h("div", { class: "ss-sidebar-search" }, [
	                Vue.h(SsIcon, { name: "search", size: "14px", class: "ss-sidebar-search__prefix" }),
	                Vue.h("input", {
	                  class: "ss-sidebar-search__input",
	                  value: this.keyword,
	                  placeholder: this.searchPlaceholder,
	                  onInput: (e) => {
	                    this.keyword = e?.target?.value ?? "";
	                  },
	                }),
	              ]),
	            ])
	          : null,
	        Vue.h(
	            "div",
	            { class: "ss-sidebar-list" },
	            filteredItems.map((item, idx) => {
	              const title = item?.title ?? "";
	              const tags = item?.tags || [];
	              const isPersonLayout = this.itemLayout === "person";
	              const hasTags = !isPersonLayout && (tags?.length > 0); // 列表项垂直对齐：有 tags 顶对齐 by xu 20260106

	              return Vue.h(
	                  "div",
	                  {
	                    class: {
	                      "ss-sidebar-list-item": true,
	                      "is-first": idx === 0,
	                      "is-person": isPersonLayout,
	                      "has-tags": hasTags,
	                    },
	                  },
	                  [
	                    Vue.h("div", { class: "ss-sidebar-list-item__main" }, [
	                      Vue.h(
	                          "div",
	                          { class: "ss-sidebar-list-item__title" },
	                          Vue.h(
	                              "span",
	                              {
	                                style: {
	                                  "white-space": "nowrap",
	                                  overflow: "hidden",
	                                  "text-overflow": "ellipsis",
	                                },
	                              },
	                              title
	                          )
	                      ),
	                      // 非人员布局才显示 tags by xu 20260106
	                      !isPersonLayout && tags?.length
	                        ? Vue.h(
	                            "div",
	                            { class: "ss-sidebar-list-item__tags" },
	                            tags.map((tag) => {
	                              const [k, v] = Object.entries(tag)[0] || ["", ""];
	                              return Vue.h("span", { class: "ss-sidebar-tag", title: `${k}: ${v}` }, `${k}: ${v}`);
	                            })
	                          )
	                        : null,
	                    ]),
	                    // 人员布局：中间保留“人员号”槽位 by xu 20260106
	                    isPersonLayout
	                      ? Vue.h(
	                          "div",
	                          { class: "ss-sidebar-list-item__meta", title: String(item?.meta ?? "") },
	                          item?.meta ?? ""
	                        )
	                      : null,
	                    this.itemAction
	                      ? Vue.h(
	                          "button",
	                          {
	                            type: "button",
	                            class: {
	                              // item 操作按钮：默认无背景/无边框，hover 才高亮 by xu 20260106
	                              "ss-sidebar-item-btn": true,
	                            },
	                            title: isSelectedMode ? "移除" : "选择",
	                            onClick: (e) => {
	                              e.stopPropagation();
	                              if (isSelectedMode) this.$emit("remove", item);
	                              else this.$emit("select", item);
	                            },
	                          },
	                          [
	                            // item 移除图标使用 icon-base 的 icon-cl by xu 20260106
	                            isSelectedMode
	                              ? Vue.h(SsIcon, { class: "menu-base-icon icon-cl" })
	                              : Vue.h(SsIcon, { name: "check", size: "14px" }),
	                          ]
	                        )
	                      : null,
	                  ]
	              );
	            })
	        ),
	      ]);
	    },
	  };

	  // 组件文档补全（JSDoc） by xu 20260108
	  /**
	   * SsSidebar（objList 右侧边栏容器）
	   *
	   * 用途：
	   * - 统一渲染顶部按钮栏（buttons）
	   * - 统一渲染中间业务面板（list panels，可拖拽调高度）
	   * - 统一渲染底部图表（chart panels，内部用 ss-sidebar-chart-hover）
	   *
	   * 调用示例：
	   * ```html
	   * <ss-sidebar :buttons="sidebarButtons" :panels="sidebarPanels" @remove="handleSidebarRemove" />
	   * ```
	   *
	   * Props：
	   * - `buttons`：顶部按钮配置数组
	   * - `panels`：分区配置数组（`type: 'list' | 'chart'`）
	   *
	   * Events（向外透传）：
	   * - `remove(item)`：来自 list 面板移除
	   * - `select(item)`：来自 list 面板选择（如后续需要）
	   */
	  const SsSidebar = {
	    name: "SsSidebar",
	    props: {
	      buttons: { type: Array, default: () => [] },
	      charts: { type: Array, default: () => [] },
	      list: { type: Array, default: () => [] }, // legacy
	      listMode: { type: String, default: "search" }, // legacy
	      panels: { type: Array, default: () => [] },
	    },
	    emits: ["select", "remove"],
	    data() {
	      return {
	        // 业务面板高度（索引 -> px） by xu 20260106
	        sectionHeights: [],
	        resizeTimer: null,
	        resizing: false,
	        resizeIndex: -1,
	        resizeStartY: 0,
	        resizeStartPrev: 0,
	        resizeStartNext: 0,
	      };
	    },
	    methods: {
	      // 初始化默认高度（只在第一次/面板数量变化时补齐） by xu 20260106
	      ensureSectionHeights(sectionCount) {
	        if (!Array.isArray(this.sectionHeights)) this.sectionHeights = [];
	        if (this.sectionHeights.length === sectionCount) return;
	        const next = [];
	        for (let i = 0; i < sectionCount; i++) {
	          next[i] = this.sectionHeights[i] ?? 190; // 默认高度 by xu 20260106
	        }
	        this.sectionHeights = next;
	      },
	      startResize(index, e) {
	        if (e?.preventDefault) e.preventDefault();
	        if (e?.stopPropagation) e.stopPropagation();
	        if (this.resizing) return;

	        // 长按 0.5s 后才进入拖拽调高度 by xu 20260106
	        clearTimeout(this.resizeTimer);
	        const startY = e?.clientY ?? 0;
	        const gapEl = e?.currentTarget;
	        this.resizeTimer = setTimeout(() => {
	          this.resizing = true;
	          this.resizeIndex = index;
	          this.resizeStartY = startY;
	          this.resizeStartPrev = this.sectionHeights[index] ?? 190;
	          this.resizeStartNext = this.sectionHeights[index + 1] ?? 190;

	          gapEl?.classList?.add("is-active");

	          window.addEventListener("pointermove", this.onResizeMove, { passive: false });
	          window.addEventListener("pointerup", this.endResize, { passive: false, once: true });
	        }, 500);
	      },
	      onResizeMove(e) {
	        if (!this.resizing) return;
	        if (e?.preventDefault) e.preventDefault();
	        const dy = (e?.clientY ?? 0) - this.resizeStartY;

	        const minPanelHeight = 83; // header(35) + listMin(48) by xu 20260106
	        const prev = Math.max(minPanelHeight, this.resizeStartPrev + dy);
	        const next = Math.max(minPanelHeight, this.resizeStartNext - dy);

	        // 若其中一个达到最小值，则停止继续挤压 by xu 20260106
	        const adjustedDy = prev - this.resizeStartPrev;
	        const nextAdjusted = this.resizeStartNext - adjustedDy;
	        this.sectionHeights.splice(this.resizeIndex, 1, prev);
	        this.sectionHeights.splice(this.resizeIndex + 1, 1, Math.max(minPanelHeight, nextAdjusted));
	      },
	      endResize(e) {
	        clearTimeout(this.resizeTimer);
	        this.resizeTimer = null;
	        if (!this.resizing) return;
	        if (e?.preventDefault) e.preventDefault();

	        const activeGaps = document.querySelectorAll(".ss-sidebar-gap.is-active");
	        activeGaps.forEach((g) => g.classList.remove("is-active"));

	        this.resizing = false;
	        this.resizeIndex = -1;
	        window.removeEventListener("pointermove", this.onResizeMove);
	      },
	    },
	    mounted() {
	      clearTimeout(this.resizeTimer);
	      this.resizeTimer = null;
	    },
	    beforeUnmount() {
	      clearTimeout(this.resizeTimer);
	      this.resizeTimer = null;
	      window.removeEventListener("pointermove", this.onResizeMove);
	    },
	    render() {
	      const SsSidebarButtonsComp = Vue.resolveComponent("ss-sidebar-buttons");
	      const SsSidebarChartComp = Vue.resolveComponent("ss-sidebar-chart");
	      const SsSidebarListComp = Vue.resolveComponent("ss-sidebar-list");
	      const SsIcon = Vue.resolveComponent("ss-icon");

	      // 支持 panels（多分区），list/listMode 作为 legacy 兜底 by xu 20260106
	      const panels = (this.panels || []).length
	          ? this.panels
	          : this.list?.length
	              ? [{ type: "list", title: "已选", icon: "", mode: this.listMode, items: this.list }]
	              : [];
	      const sectionPanels = panels.filter((p) => p?.type !== "chart");
	      const chartPanels = panels.filter((p) => p?.type === "chart");
	      this.ensureSectionHeights(sectionPanels.length);

	      return Vue.h("div", { class: "ss-sidebar" }, [
	        this.buttons?.length ? Vue.h(SsSidebarButtonsComp, { items: this.buttons }) : null,
	        Vue.h(
	            "div",
	            { class: "ss-sidebar__inner" },
	            [
	              ...(this.charts || []).map((c) =>
	                  Vue.h(SsSidebarChartComp, { options: c?.options || {}, height: c?.height || "200px" })
	              ),
	              // 可拖拽的业务面板容器 by xu 20260106
	              Vue.h(
	                  "div",
	                  { class: "ss-sidebar-sections" },
	                  sectionPanels.flatMap((p, idx) => {
	                    const section = Vue.h(
	                        "div",
	                        {
	                          class: "ss-sidebar-section",
	                          style: { height: (this.sectionHeights[idx] ?? 190) + "px" },
	                        },
	                        [
	                          Vue.h("div", { class: "ss-sidebar-section__content" }, [
	                            Vue.h(SsSidebarListComp, {
	                              title: p?.title ?? "",
	                              icon: p?.icon ?? "",
	                              count: p?.count ?? (p?.items?.length ?? ""),
	                              closable: !!p?.closable,
	                              searchable: !!p?.searchable,
	                              searchInHeader: !!p?.searchInHeader,
	                              headerFilters: p?.headerFilters || [],
	                              headerSearchButton: !!p?.headerSearchButton,
	                              searchPlaceholder: p?.searchPlaceholder ?? "搜索",
	                              itemLayout: p?.itemLayout ?? "simple",
	                              iconClass: p?.iconClass ?? "",
	                              items: p?.items || [],
	                              mode: p?.mode || "search",
	                              onSelect: (item) => this.$emit("select", item),
	                              onRemove: (item) => this.$emit("remove", item),
	                              // closable = 清空分区数据 by xu 20260106
	                              onClear: () => p?.onClear?.(),
	                              onSearch: (payload) => p?.onSearch?.(payload),
	                            }),
	                          ]),
	                        ]
	                    );

	                    const gap =
	                        idx < sectionPanels.length - 1
	                            ? Vue.h("div", {
	                                class: "ss-sidebar-gap",
	                                onPointerdown: (e) => this.startResize(idx, e),
	                              })
	                            : null;

	                    return gap ? [section, gap] : [section];
	                  })
	              ),
	              // 图表区固定在底部（hover 弹出大图） by xu 20260106
		              ...chartPanels.map((p) =>
		                  Vue.h("div", { class: "ss-sidebar-panel" }, [
		                    p?.title
		                      ? Vue.h("div", { class: "ss-sidebar-panel__header" }, [
		                          Vue.h("div", { class: "ss-sidebar-panel__title" }, [
	                            p?.iconClass
	                              ? Vue.h(SsIcon, { class: p.iconClass + " ss-sidebar-panel__icon" })
	                              : p?.icon
	                                  ? Vue.h(SsIcon, { name: p.icon, size: "16px", class: "ss-sidebar-panel__icon" })
	                                  : null,
	                            Vue.h("span", null, p.title),
	                          ]),
		                          Vue.h("div", { class: "ss-sidebar-panel__tools" }),
		                        ])
		                      : null,
		                    // hover 大图也展示与 header 一致的图标/标题 by xu 20260108
		                    Vue.h(Vue.resolveComponent("ss-sidebar-chart-hover"), {
		                      title: p?.title ?? "",
		                      iconClass: p?.iconClass ?? "",
		                      icon: p?.icon ?? "",
		                      options: p?.options || {},
		                      height: p?.height || "240px",
		                    }),
		                  ])
		              ),
		            ].filter(Boolean)
		        ),
		      ]);
	    },
	  };

	  // ss-folder-card 文件夹卡片
	  const SsFolderCard = {
	    name: "SsFolderCard",
    props: {
      item: {
        type: Object,
        required: true,
      },
    },
    data() {
      return {
        showButtons: false,
      };
    },
    emits: ["click", "change"],
    setup(props, { emit }) {
      const item = props.item;
      const showChildren = ref(false);
      const eventBus = window.parent.sharedEventBus;

      const itemWidth = Vue.computed(() => {
        const containerWidth =
            document.body.clientWidth || document.body.scrollWidth;
        return containerWidth > 1200 ? "45%" : "90%";
      });
      onMounted(() => {
        eventBus.subscribe("folderPath", (path) => {
          const currentPath = path || [];
          // 如果当前文件夹不在路径中，则销毁视图
          if (
              !currentPath.some((item) => item.folder.title === props.item.title)
          ) {
            showChildren.value = false;
          }
        });
      });
      const onItemClick = (e) => {
        if (e && e.stopPropagation) {
          e.stopPropagation();
        }
        // 单击只处理 active 状态
        if (e && e.currentTarget) {
          const allListCards = document.querySelectorAll(
              ".knowledge-item-container"
          );
          const allFolderCards = document.querySelectorAll(".ss-folder-list");

          allListCards.forEach((card) => card.classList.remove("active"));
          allFolderCards.forEach((card) => card.classList.remove("active"));

          e.currentTarget.classList.add("active");
        } else {
          // 如果是数据对象，需要找到对应的 DOM 元素
          const allListCards = document.querySelectorAll(
              ".knowledge-item-container"
          );
          const allFolderCards = document.querySelectorAll(".ss-folder-list");
          allListCards.forEach((card) => card.classList.remove("active"));
          allFolderCards.forEach((card) => card.classList.remove("active"));
          // 找到标题匹配的文件夹元素
          const targetFolder = Array.from(allFolderCards).find((card) =>
              card.textContent.includes(e.title)
          );

          if (targetFolder) {
            targetFolder.classList.add("active");
          }
        }
        emit("click", item);
      };
      // 修改双击处理函数
      const handleFolderDblClick = (folder, e) => {
        if (e) e.stopPropagation();
        if (folder.children?.length) {
          showChildren.value = true;
          const pathInfo = {
            title: folder.title,
            folder: folder,
          };
          const currentPath = eventBus.getState("folderPath") || [];
          if (!currentPath.some((item) => item.title === folder.title)) {
            eventBus.publish("folderPath", [...currentPath, pathInfo]);
          }
        }
      };
      const onItemChange = (e, icon, index) => {
        e.stopPropagation();
        props.item.buttons[0].onclick();
        // emit("change", { item: props.item, icon, index });
      };
      return {
        item,
        itemWidth,
        showChildren,
        onItemClick,
        onItemChange,
        handleFolderDblClick,
      };
    },
    render() {
      const SsCartListIcon = Vue.resolveComponent("ss-cart-list-icon");
      if (this.showChildren) {
        return h(SsFolderCartView, {
          folder: this.item,
        });
      }
      return Vue.h(
          "div",
          {
            class: { "ss-folder-list": true, active: this.item.active },
            onClick: (e) => {
              e.stopPropagation();
              this.onItemClick(e);
            },
            onDblclick: (e) => this.handleFolderDblClick(this.item, e),
            style: { width: this.itemWidth },
          },
          [
            // 文件夹特有的装饰元素
            Vue.h("div", { class: "ss-folder-list-trapezoid" }),
            Vue.h("div", { class: "ss-folder-list-top-transparent" }),
            Vue.h("div", { class: "ss-folder-list-top" }),
            Vue.h("div", { class: "ss-folder-list-right" }),

            // header 部分（按钮）
            this.item?.buttons?.length > 0 &&
            Vue.h(
                "div",
                {
                  class: "header",
                  onMouseenter: () => (this.showButtons = true),
                  onMouseleave: () => (this.showButtons = false),
                  onClick: (e) => this.onItemChange(e, this.item.buttons[0], 0),
                },
                [
                  // this.item?.buttons?.length > 0 &&
                  Vue.h("div", {
                    class: "cart-list-setting cart-list-icon",
                    title: this.item?.buttons?.[0]?.title,
                  }),

                  // this.item?.buttons?.length > 0 &&
                  this.showButtons &&
                  this.item?.buttons?.length > 1 &&
                  Vue.h(
                      "div",
                      {
                        class: "cart-list-button-popup",
                      },
                      this.item.buttons.map((btn) =>
                          Vue.h(
                              "div",
                              {
                                onClick: (e) => {
                                  e.stopPropagation();
                                  btn.onclick?.();
                                },
                              },
                              [
                                btn.class &&
                                Vue.h(SsCartListIcon, {
                                  class: [btn.class],
                                }),
                                Vue.h("span", null, btn.title),
                              ]
                          )
                      )
                  ),
                ]
            ),
            // body 部分
            Vue.h("div", { class: "body" }, [
              Vue.h("div", { class: "box-header" }, [
                Vue.h("div", null, this.item.title),
              ]),
              Vue.h(
                  "div",
                  {
                    class: !this.item.thumb ? "no-thumb box-body" : "box-body",
                  },
                  [
                    this.item.thumb
                        ? Vue.h("div", { class: "left" }, [
                          Vue.h("img", {
                            src: this.item.thumb,
                            alt: "Thumbnail",
                            class: "imgUnHandle",
                            style: {
                              "object-fit": "cover",
                              width: "100%",
                              height: "100%",
                            },
                          }),
                        ])
                        : null,
                    Vue.h("div", { class: "right" }, [
                      ...this.item.tags.map((tag) => {
                        const [key, value] = Object.entries(tag)[0];
                        return Vue.h(
                            "div",
                            {
                              class: "title",
                              title: `${key}: ${value}`,
                            },
                            `${key}: ${value}`
                        );
                      }),
                    ]),
                  ]
              ),
            ]),
          ]
      );
    },
  };
  // SsFolderCartView 组件 - 用于显示文件夹内容
  const SsFolderCartView = {
    name: "SsFolderCartView",
    props: {
      folder: {
        type: Object,
        required: true,
      },
    },
    emits: ["click"],
    setup(props, { emit }) {
      const eventBus = window.parent.sharedEventBus;
      const currentFolder = ref(props.folder);
      const showChildren = ref(false);

      const onItemClick = (e) => {
        if (e && e.stopPropagation) {
          e.stopPropagation();
        }
        // 单击只处理 active 状态
        if (e && e.currentTarget) {
          const allListCards = document.querySelectorAll(
              ".knowledge-item-container"
          );
          const allFolderCards = document.querySelectorAll(".ss-folder-list");

          allListCards.forEach((card) => card.classList.remove("active"));
          allFolderCards.forEach((card) => card.classList.remove("active"));

          e.currentTarget.classList.add("active");
        } else {
          // 如果是数据对象，需要找到对应的 DOM 元素
          const allListCards = document.querySelectorAll(
              ".knowledge-item-container"
          );
          const allFolderCards = document.querySelectorAll(".ss-folder-list");

          allListCards.forEach((card) => card.classList.remove("active"));
          allFolderCards.forEach((card) => card.classList.remove("active"));

          // 找到标题匹配的文件夹元素
          const targetFolder = Array.from(allFolderCards).find((card) =>
              card.textContent.includes(e.title)
          );

          if (targetFolder) {
            targetFolder.classList.add("active");
          }
        }
        emit("click", props.folder);
      };
      const handleFolderDblClick = (folder, e) => {
        if (e) e.stopPropagation();
        if (folder.children?.length) {
          showChildren.value = true;
          const pathInfo = {
            title: folder.title,
            folder: folder,
          };
          const currentPath = eventBus.getState("folderPath") || [];
          if (!currentPath.some((item) => item.title === folder.title)) {
            eventBus.publish("folderPath", [...currentPath, pathInfo]);
            currentFolder.value = folder;
          }
        }
      };

      const goBack = (targetFolder) => {
        if (targetFolder === null) {
          // 返回根目录
          eventBus.publish("folderPath", []);
        } else {
          currentFolder.value = targetFolder;
        }
      };

      return {
        currentFolder,
        showChildren,
        onItemClick,
        handleFolderDblClick,
        goBack,
      };
    },

    render() {
      return h(
          "div",
          {
            class: "page-container",
            style: {
              position: "fixed",
              top: 0,
              left: 0,
              width: "100%",
              height: "100%",
              background: "var(--lightgray)",
              padding: "20px 0",
              zIndex: 1000,
            },
          },
          [
            // 搜索栏
            h("div", { class: "search-bar" }, [
              h("div", { class: "search-bar-contaienr" }, [
                h(SsBreadcrumb, {
                  level: {
                    onBack: this.goBack,
                  },
                }),
              ]),
            ]),

            // 内容区域
            h(
                "div",
                {
                  class: "content-area item-content-area",
                  style: { gap: "20px" },
                },
                [
                  ...(this.currentFolder.children || []).map((child, index) =>
                      h(child.children ? SsFolderCard : SsListCard, {
                        key: index,
                        item: child,
                        onClick: (e) => this.onItemClick(e),
                        onDblclick: (e) => this.handleFolderDblClick(child, e),
                      })
                  ),
                ]
            ),
          ]
      );
    },
  };

  // ss-page分页
  const SsPage = {
    name: "SsPage",
    props: {
      total: {
        type: Number,
        required: true,
      },

      size: {
        type: Number,
        default: 10,
      },
      page: {
        type: Number,
        default: 1,
      },
      onChange: {
        type: Function,
        default: () => {},
      },
    },
    setup(props) {
      const totalItems = ref(props.total); // 总条目数
      const totalPages = ref(Math.ceil(props.total / props.size));
      const currentPage = ref(props.page); // 当前页码

      // 计算显示的信息
      const pageInfo = ref(
          `共${totalItems.value}条，第 ${currentPage.value}/${totalPages.value} 页`
      );

      // 上一页的逻辑
      const goToPreviousPage = (e) => {
        e.preventDefault(); // 阻止默认行为
        if (currentPage.value > 1) {
          currentPage.value -= 1;
          updatePageInfo();
          props.onChange?.({
            pageNo: currentPage.value, // 当前页码
            rowNumPer: props.size, // 每页条数
            rowNum: props.total, // 总记录数
          });
        }
      };

      // 下一页的逻辑
      const goToNextPage = (e) => {
        e.preventDefault(); // 阻止默认行为
        if (currentPage.value < totalPages.value) {
          currentPage.value += 1;
          updatePageInfo();
          props.onChange?.({
            pageNo: currentPage.value, // 当前页码
            rowNumPer: props.size, // 每页条数
            rowNum: props.total, // 总记录数
          });
        }
      };

      // 更新页码信息的函数
      const updatePageInfo = () => {
        pageInfo.value = `共${totalItems.value}条，第 ${currentPage.value}/${totalPages.value} 页`;
      };

      return {
        pageInfo,
        totalPages,
        goToPreviousPage,
        goToNextPage,
      };
    },

    render(props, { slots, emit }) {
      return Vue.h("div", { class: "pager-container" }, [
        Vue.h("input", { type: "hidden", name: "rowNum", value: props.total }),
        Vue.h("input", {
          type: "hidden",
          name: "rowNumPer",
          value: props.size,
        }),
        Vue.h("input", {
          type: "hidden",
          name: "pageCount",
          value: this.totalPages,
        }),
        Vue.h("input", { type: "hidden", name: "pageNo", value: props.page }),
        Vue.h("div", { class: "pager-content" }, [
          Vue.h("div", { class: "info" }, this.pageInfo),
          Vue.h(
              "div",
              { class: "btn" },
              Vue.h(
                  "button",
                  { onClick: (e) => this.goToPreviousPage(e) },
                  "上一页"
              )
          ),
          Vue.h(
              "div",
              { class: "btn" },
              Vue.h("button", { onClick: (e) => this.goToNextPage(e) }, "下一页")
          ),
        ]),
      ]);
    },
  };
  // ss-right-info 一级页面右边栏
  const SSRightInfo = {
    name: "SSRightInfo",
    setup() {
      // 初始化响应式数据
      const item = ref({
        thumb: "images/example/project-img.png", // 更换为适合你项目的实际路径
        title: "工业和信息化产业高质量发展资金",
      });

      return {
        item,
      };
    },
    render() {
      return Vue.h("div", { class: "info-container" }, [
        Vue.h("div", { class: "header" }, [
          Vue.h("div", [
            Vue.h("img", {
              src: this.item.thumb,
              class: "imgUnHandle",
              style: { "object-fit": "cover", width: "100%", height: "100%" },
            }), // 将 ImageViewer 替换为 img 标签
          ]),
          Vue.h("div", [Vue.h("div", this.item.title)]),
        ]),
        Vue.h("div", { class: "section-container" }, [
          Vue.h("div", { class: "section" }, [
            Vue.h("div", { class: "title" }, "合同"),
            Vue.h("div", { class: "text" }, "合同总金额：42,399,320"),
            Vue.h(
                "div",
                { class: "a" },
                "《工业和信息化产业高质量发展资金补助合同》"
            ),
          ]),
          Vue.h("div", { class: "section" }, [
            Vue.h("div", { class: "title" }, "发票"),
            Vue.h("div", { class: "text" }, "应开发票总额：42,399,320"),
            Vue.h("div", { class: "text" }, "已开发票金额：17,235,345"),
            Vue.h("div", { class: "text" }, "未开发票金额：25,163,975"),
          ]),
          Vue.h("div", { class: "section" }, [
            Vue.h("div", { class: "title" }, "项目组成员"),
            Vue.h("div", { class: "text" }, "我司：3人"),
            Vue.h("div", { class: "text" }, "对方：2人"),
            Vue.h("div", { class: "text" }, "项目负责人：张三"),
          ]),
          Vue.h("div", { class: "section" }, [
            Vue.h("div", { class: "title" }, "采购"),
            Vue.h("div", { class: "text" }, "总额：999,320"),
            Vue.h("div", { class: "text" }, "已付金额：335,345"),
            Vue.h("div", { class: "text" }, "未付金额：663,975"),
          ]),
        ]),
      ]);
    },
  };
  //
  const SsSuccessPopup = {
    name: "SsSuccessPopup",
    props: {
      right: {
        type: String,
        default: "20px",
      },
      bottom: {
        type: String,
        default: "calc(100% + 5px)",
      },
    },
    setup(props, { expose }) {
      // 响应式状态：是否可见
      const visible = ref(false);

      // 计算样式
      const style = computed(() => {
        return {
          "--message-dialog-right": props.right,
          "--message-dialog-bottom": props.bottom,
        };
      });

      // 显示对话框的方法
      const show = () => {
        visible.value = true;
      };

      // 隐藏对话框的方法
      const hide = () => {
        visible.value = false;
      };

      // 将方法暴露给外部使用
      expose({ show, hide });

      // 返回渲染函数
      return () => {
        if (!visible.value) return null;
        const SsIcon = resolveComponent("ss-icon");
        return h(
            "div",
            {
              class: "success-popup",
              style: style.value,
              onClick: (e) => e.stopPropagation(),
            },
            [
              h("div", { class: "left" }, [
                h("div", { class: "icon" }, [
                  h(SsIcon, { name: "check", size: "36px" }),
                ]),
              ]),
              h("div", { class: "right" }, [
                h("div", { class: "title" }, "提交成功"),
                h("div", { class: "desc" }, "您的信息已成功提交。"),
              ]),
            ]
        );
      };
    },
  };
  const SsErrorDialog = {
    name: "SsErrorDialog",
    setup(props, { emit }) {
      const visible = ref(false);

      const style = computed(() => {
        return {};
      });

      const show = () => {
        visible.value = true;
      };

      const hide = () => {
        visible.value = false;
      };

      const onBack = () => {
        emit("back");
        hide();
      };

      return {
        visible,
        style,
        show,
        hide,
        onBack,
      };
    },
    render() {
      const SsIcon = resolveComponent("ss-icon");
      return this.visible
          ? h(
              "div",
              {
                class: "errorDialog",
                style: this.style,
                onClick: (event) => event.stopPropagation(),
              },
              [
                h("div", { class: "body" }, [
                  h("div", { class: "left" }, [
                    h("div", { class: "icon" }, [
                      h(SsIcon, { name: "close", size: "36px" }),
                    ]),
                  ]),
                  h("div", { class: "right" }, [
                    h("div", { class: "title" }, "操作失败"),
                    h("div", { class: "desc" }, "请点击返回以继续。"),
                  ]),
                ]),
                h("div", { class: "footer" }, [
                  h("div", { class: "left" }),
                  h("div", { class: "right" }, [
                    h(
                        "div",
                        {
                          class: "btn",
                          onClick: this.onBack,
                        },
                        [h(SsIcon, { name: "arrow-left-line" }), h("div", "返回")]
                    ),
                  ]),
                ]),
              ]
          )
          : null;
    },
  };
  /**
   * 审核链条
   * @name ss-verify
   * @param { Array } verify-list 审核节点列表
   * @property { Array } verify-list 审核节点列表
   * @example <ss-verify :verify-list="verifyList"></ss-verify>
   * verify-list [
   *    {
   *        groupName: "",  // 群组名称
   *        open: true, // 默认是否展开
   *        children:[ //群组里的人员
   *           {
   *            thumb: "images/example/user-4.png", // 头像
   *             name: "李丽思 ", // 姓名
   *             role: "人事处处长",  // 角色
   *             description: "同意。",  // 审核意见
   *             time: "09:38 08/11", // 审核时间
   *             video: false,  // false不显示/true显示 视频icon
   *             link: false,  // false不显示/true显示 链接icon 后续应该是附件
   *           }
   *        ]
   *    }
   *  ]
   */
  const SsVerify = {
    name: "SsVerify",
    props: {
      verifyList: {
        type: Array,
        required: true,
      },
    },
    setup(props) {
      const toggleOpen = (item) => {
        item.open = !item.open;
      };
      onMounted(() => {
        setTimeout(() => {
          const lastOpenGroup = document.querySelector(".group-item-last-open");
          console.log("lastOpenGroup", lastOpenGroup);
          if (lastOpenGroup) {
            const nodes = $(lastOpenGroup).find(".verify-node-container");
            if (nodes.length) {
              let totalHeight = 0;
              const gudingHeight = 100;

              if (nodes.length === 1) {
                totalHeight = gudingHeight;
              } else {
                // 累加除最后一个节点外的所有节点高度
                for (let i = 0; i < nodes.length - 1; i++) {
                  totalHeight += $(nodes[i]).outerHeight();
                }
                totalHeight += gudingHeight;
              }

              console.log("节点信息:", {
                节点总数: nodes.length,
                计算后的高度: totalHeight,
              });

              lastOpenGroup.style.setProperty(
                  "--group-line-height",
                  `${totalHeight}px`
              );
            }
          }
        }, 0);
      });
      return {
        toggleOpen,
      };
    },
    render() {
      const SsIcon = resolveComponent("ss-icon");
      const SsCommonIcon = resolveComponent("ss-common-icon");
      const SsVerifyNode = resolveComponent("ss-verify-node");
      return h(
          "div",
          { class: "verify-nodes" },
          this.verifyList.map((item, i) =>
              h(
                  "div",
                  {
                    key: i,
                    class: {
                      "group-item": true,
                      "group-item-last-open":
                          i === this.verifyList.length - 1 && item.open,
                    },
                  },
                  [
                    h(
                        "div",
                        {
                          class: "group-item-title",
                          onClick: () => this.toggleOpen(item),
                        },
                        [
                          h("div", { class: "icon" }, [
                            item.open
                                ? h(SsCommonIcon, { class: "common-icon-folder-open" })
                                : h(SsCommonIcon, { class: "common-icon-folder-close" }),
                            h(
                                "div",
                                {
                                  class: "num",
                                  style: { top: item.open ? "60%" : "55%" },
                                },
                                item.children?.length || 0
                            ),
                          ]),
                          h("div", { class: "name" }, item.groupName),
                        ]
                    ),
                    item.open && item.children?.length > 0
                        ? h(
                            "div",
                            { class: "group-item-children" },
                            item.children.map((citem, j) =>
                                h(SsVerifyNode, {
                                  key: j,
                                  item: citem,
                                  // isGroup: i + 1 !== this.verifyList.length,
                                  isGroup: true,
                                })
                            )
                        )
                        : null,
                  ]
              )
          )
      );
    },
  };

  /**
   * 审核页面的审核节点
   * @name ss-verify-node
   * @param {Object} item 审核节点信息
   * @param {Boolean} isGroup 是否为分组节点
   */
  const SsVerifyNode = {
    name: "SsVerifyNode",
    props: {
      item: {
        type: Object,
        required: true,
      },
      isGroup: {
        type: Boolean,
        default: false,
      },
    },
    render() {
      const SsIcon = resolveComponent("ss-icon");
      const SsCommonIcon = resolveComponent("ss-common-icon");
      return Vue.h("div", { class: "verify-node-container" }, [
        Vue.h("div", { class: "info" }, [
          Vue.h("div", { class: "avatar" }, [
            Vue.h("img", {
              src: this.item.thumb,
              style: {
                width: "50px",
                height: "50px",
                borderRadius: "50%",
              },
            }),
          ]),
          Vue.h("div", { class: "desc" }, [
            Vue.h("div", this.item.name),
            Vue.h("div", this.item.role),
          ]),
          Vue.h("div", { class: "link" }, [
            Vue.h("div", [
              this.item.video
                  ? Vue.h(SsCommonIcon, { class: "common-icon-video" })
                  : null,
              this.item.link
                  ? Vue.h(SsCommonIcon, {
                    class: "common-icon-paper-clip",
                  })
                  : null,
            ]),
          ]),
        ]),
        Vue.h(
            "div",
            {
              class: {
                description: true,
                link: this.isGroup,
              },
              attrs: { "data-num": "3" },
            },
            [Vue.h("div", this.item.description)]
        ),
        Vue.h("div", { class: "time" }, this.item.time),
      ]);
    },
  };
  /**
   * 智能识别图片的左侧图片播放 可以放大缩小旋转图片
   * @name ss-orc-img-box
   * @param { Object } image-obj 包含图片的url, 和图片的名称
   *
   */
  const SsOrcImgBox = {
    name: "SsOrcImgBox",
    props: {
      imageObj: {
        type: Object,
        required: true,
      },
    },
    setup(props) {
      const zoom = ref(1);
      const rotation = ref(0);
      const containerWidth = ref(0);
      const containerHeight = ref(0);
      const container = ref(null);
      const imgPosition = ref({ x: 0, y: 0 });
      const isDragging = ref(false);
      const lastMousePosition = ref({ x: 0, y: 0 });
      const imgStyle = computed(() => ({
        width: `${zoom.value * 100}%`,
        height: `${zoom.value * 100}%`,
        transform: `rotate(${rotation.value}deg) translate(${imgPosition.value.x}px, ${imgPosition.value.y}px)`,
        transformOrigin: "center center",
        cursor: isDragging.value ? "grabbing" : "grab",
      }));

      const resetZoom = () => {
        zoom.value = 1;
        rotation.value = rotation.value + 90;
        imgPosition.value = { x: 0, y: 0 };
      };

      const handleRangeChange = (event) => {
        const value = event.target.value / 50; // 0 到 100 映射到 0 到 2 的缩放
        zoom.value = Math.max(value, 0.1); // 设置最小缩放值为 0.1
      };
      const updateImgBoxDimensions = () => {
        if (container.value) {
          containerWidth.value = container.value.clientWidth;
          containerHeight.value = container.value.clientHeight;
        }
      };
      const onMouseDown = (event) => {
        isDragging.value = true;
        lastMousePosition.value = { x: event.clientX, y: event.clientY };
      };

      const onMouseMove = (event) => {
        if (isDragging.value) {
          const dx = event.clientX - lastMousePosition.value.x;
          const dy = event.clientY - lastMousePosition.value.y;

          // 防止旋转后拖动的x,y反转
          // 首先将当前旋转角度从度数转换为弧度，因为 JavaScript 的 Math 库使用弧度
          const angle = rotation.value * (Math.PI / 180);
          // 使用基本的二维旋转矩阵将原始位移 dx 和 dy 转换为旋转后的位移 rotatedDx 和 rotatedDy。
          const rotatedDx = dx * Math.cos(angle) + dy * Math.sin(angle);
          const rotatedDy = dy * Math.cos(angle) - dx * Math.sin(angle);

          imgPosition.value = {
            x: imgPosition.value.x + rotatedDx,
            y: imgPosition.value.y + rotatedDy,
          };
          lastMousePosition.value = { x: event.clientX, y: event.clientY };
        }
      };

      const onMouseUp = () => {
        isDragging.value = false;
      };
      onMounted(() => {
        nextTick(() => {
          updateImgBoxDimensions();
          window.addEventListener("resize", updateImgBoxDimensions);
          window.addEventListener("mousemove", onMouseMove);
          window.addEventListener("mouseup", onMouseUp);
        });
      });

      return {
        zoom,
        rotation,
        container,
        imgStyle,
        resetZoom,
        handleRangeChange,
        containerWidth,
        containerHeight,
        onMouseDown,
        imgPosition,
      };
    },
    render() {
      const SsIcon = resolveComponent("ss-icon");
      return h("div", { class: "ocr-img-box" }, [
        h("div", { class: "img-bar" }, [
          h("div", this.imageObj.name),
          h("div", { class: "action-bar" }, [
            h("div", { class: "ocr-img-range-box" }, [
              h("input", {
                type: "range",
                min: 0,
                max: 100,
                value: this.zoom * 50, // 初始位置为50
                onInput: this.handleRangeChange,
              }),
              h("span", { class: "line" }),
            ]),
            h(SsIcon, {
              name: "reset",
              size: "26px",
              onClick: this.resetZoom,
            }),
          ]),
        ]),
        h("div", { class: "img-viewer", ref: "container" }, [
          h(
              "div",
              {
                class: "img-box",
                style: {
                  width: `${this.containerWidth}px`,
                  height: `${this.containerHeight}px`,
                  overflow: "hidden",
                  position: "relative",
                },
              },
              [
                h("img", {
                  src: this.imageObj.thumb,
                  style: this.imgStyle,
                  class: "zoomable-img",
                  onMousedown: this.onMouseDown,
                }),
              ]
          ),
        ]),
      ]);
    },
  };
  // 搜索输入框组件
  const SsSearchInput = {
    name: "SsSearchInput",
    props: {
      name: String,
      placeholder: String,
      width: {
        type: String,
        default: "100px",
      },
      modelValue: String,
    },
    emits: ["update:modelValue", "search"],
    setup(props, { emit }) {
      const handleInput = (e) => {
        emit("update:modelValue", e.target.value);
      };
      const handleKeyup = (e) => {
        if (e.key === "Enter") {
          emit("search");
        }
      };

      return { handleInput, handleKeyup };
    },
    render() {
      return h(
          "div",
          {
            class: "input",
            style: this.width ? { width: this.width } : undefined,
          },
          [
            h("input", {
              name: this.name,
              placeholder: this.placeholder,
              value: this.modelValue,
              onInput: this.handleInput,
              onKeyup: this.handleKeyup,
            }),
          ]
      );
    },
  };
  // ss-search-date-picker 日期时间选择器组件
  const SsSearchDatePicker = {
    name: "SsSearchDatePicker",
    props: {
      modelValue: {
        type: [String, Number, Date],
        default: "",
      },
      name: {
        type: String,
        required: true,
      },
      type: {
        type: String,
        default: "date",
        validator: (value) => ["date", "datetime", "time"].includes(value),
      },
      fmt: {
        type: String,
        default: null,
      },
      placeholder: {
        type: String,
        default: "",
      },
      width: {
        type: String,
        default: "100%",
      },
    },

    emits: ["update:modelValue"],

    setup(props, { emit }) {
      const errMsg = ref("");
      const validate = () => {
        if (window.ssVm) {
          const result = window.ssVm.validateField(props.name);
          console.log("validate", window.ssVm.validateField(props.name));
          errMsg.value = result.valid ? "" : result.message;
        }
      };
      // 根据type确定默认格式
      const defaultFormat = computed(() => {
        switch (props.type) {
          case "datetime":
            return "YYYY-MM-DD HH:mm:ss";
          case "date":
            return "YYYY-MM-DD";
          case "time":
            return "HH:mm:ss";
        }
      });

      const convertJavaFormatToElement = (javaFormat) => {
        if (!javaFormat) return null;
        return javaFormat
            .replace("yyyy", "YYYY")
            .replace("MM", "MM")
            .replace("dd", "DD")
            .replace("HH", "HH")
            .replace("mm", "mm")
            .replace("ss", "ss");
      };

      const finalFormat = computed(() => {
        if (props.fmt) {
          return convertJavaFormatToElement(props.fmt);
        }
        return defaultFormat.value;
      });

      // 使用 resolveComponent 获取组件
      const ElDatePicker = resolveComponent("ElDatePicker");
      const ElTimePicker = resolveComponent("ElTimePicker");
      const SsFormIcon = resolveComponent("SsFormIcon");
      const ElIcon = resolveComponent("ElIcon");
      let useTimePicker = true;
      //"yyyy-MM-dd HH:mm:ss";  "日期字符串格式在java的写法",传到本组件fmt属性也是按这个格式
      if (props.fmt) {
        //有fmt属性，则以fmt属性优先判断类型
        if (/[dMy]/.test(props.fmt)) {
          //如果有传入日期格式，且含年月日
          useTimePicker = false;
        } else {
          useTimePicker = true;
        }
      } else if (props.type !== "time") {
        useTimePicker = false;
      }
      const dateType = computed(() => {
        const fmt = props.fmt || "";
        if (fmt.includes("HH:mm:ss")) {
          return "datetime";
        } else if (fmt.includes("HH:mm")) {
          return "datetime";
        } else if (fmt.includes("mm:ss")) {
          return "time";
        }
        return "date";
      });
      const handleValueUpdate = (val) => {
        emit("update:modelValue", val);
        emit("change", val); // 同时触发 change 事件
        setTimeout(() => {
          validate();
        }, 50);
      };
      return () =>
          h(
              "div",
              { class: "ss-search-date-picker", style: { width: props.width } },
              [
                h("input", {
                  type: "hidden",
                  name: props.name,
                  value: props.modelValue,
                }),
                h(useTimePicker ? ElTimePicker : ElDatePicker, {
                  modelValue: props.modelValue,
                  "onUpdate:modelValue": handleValueUpdate,
                  type: dateType.value,
                  format: finalFormat.value,
                  "value-format": finalFormat.value,
                  clearable: true,
                  placeholder: props.placeholder,
                  class: "custom-date-picker", // 用于自定义样式
                  "time-arrow-control": props.type === "datetime", // 修改这里
                  size: "large", // 添加这一行，改为 large 尺寸
                  style: { width: "100%" },
                  "prefix-icon": h(SsFormIcon, { class: "form-icon-time" }),
                }),
              ]
          );
    },
  };
  // 搜索按钮组件(包含下拉按钮)
  const SsSearchButton = {
    name: "SsSearchButton",
    props: {
      text: {
        type: String,
        required: true,
      },
      iconClass: {
        type: String,
        required: false,
      },
      opt: {
        type: Array,
        default: () => [],
      },
      checkId: {
        type: String,
        default: "0",
      },
      width: { //add by Ben(20251225)
        type: String,
        required: false
      },
      id: { //add by Ben(20251225)
        type: String,
        required: false
      },
    },
    emits: ["click"],
    setup(props, { emit }) {
      const currentId = ref(props.checkId || "0");
      const showPopup = ref(false);

      const handleMouseEnter = () => {
        showPopup.value = true;
      };

      const handleMouseLeave = () => {
        showPopup.value = false;
      };

      // 添加点击事件处理，阻止默认行为
      const handleClick = (e) => {
        e.preventDefault();
        if (props.opt?.length > 0) {
          const selectedOption =
              currentId.value === "0"
                  ? props.opt[0]
                  : props.opt.find((opt) => opt.id === currentId.value);

          if (selectedOption) {
            selectedOption.callback?.();
          }
        } else {
          emit("click", e);
        }
      };
      // 获取显示文本
      const getDisplayText = () => {
        if (!props.opt?.length) return props.text;

        const selectedOption =
            currentId.value === "0"
                ? props.opt[0]
                : props.opt.find((opt) => opt.id === currentId.value);

        return selectedOption ? selectedOption.desc : props.opt[0].desc;
      };

      return () =>
          h(
              "button",
              {
                class:
                    props.opt?.length > 0
                        ? "ss-drop-button ss-drop-button-more"
                        : "ss-drop-button",
                type: "button", // 明确指定按钮类型为 button
                onMouseenter: handleMouseEnter,
                onMouseleave: handleMouseLeave,
                onClick: handleClick, // 添加点击事件处理
                style: { width: props.width }, //add by Ben(20251225)
                id:props.id //add by Ben(20251225)
              },
              [
                props.iconClass
                    ? h("span", {
                      class: props.iconClass,
                      style: { fontFamily: "iconfont", marginRight: "5px" },
                    })
                    : null,
                h("span", getDisplayText()),
                props.opt.length > 0 &&
                showPopup.value &&
                h(
                    "div",
                    {
                      class: "popup",
                    },
                    props.opt.map((item) =>
                        h(
                            "div",
                            {
                              onClick: (e) => {
                                e.preventDefault(); // 选项点击也阻止默认行为
                                e.stopPropagation(); // 阻止事件冒泡
                                currentId.value = item.id; // 更新当前选中的ID
                                item.callback();
                                showPopup.value = false; // 选择后关闭弹窗
                              },
                            },
                            item.desc
                        )
                    )
                ),
              ]
          );
    },
  };
  // 下拉按钮组件
  const SsDropButton = {
    name: "SsDropButton",
    props: {
      text: {
        type: String,
        required: true,
      },
      iconClass: {
        type: String,
        required: true,
      },
      opt: {
        type: Array,
        default: () => [],
      },
      checkId: {
        type: String,
        default: "0",
      },
      onclick: {
        type: Function,
        default: null,
      },
    },
    setup(props) {
      const currentId = ref(props.checkId || "0");
      const showPopup = ref(false);

      const handleMouseEnter = () => {
        showPopup.value = true;
      };

      const handleMouseLeave = () => {
        showPopup.value = false;
      };

      // 添加点击事件处理，阻止默认行为
      const handleClick = (e) => {
        e.preventDefault();
        if (props.opt?.length > 0) {
          const selectedOption =
              currentId.value === "0"
                  ? props.opt[0]
                  : props.opt.find((opt) => opt.id === currentId.value);

          if (selectedOption) {
            selectedOption.callback?.();
          }
        } else if (props.onclick) {
          props.onclick();
        }
      };
      // 获取显示文本
      const getDisplayText = () => {
        if (!props.opt?.length) return props.text;

        const selectedOption =
            currentId.value === "0"
                ? props.opt[0]
                : props.opt.find((opt) => opt.id === currentId.value);

        return selectedOption ? selectedOption.desc : props.opt[0].desc;
      };

      return () =>
          h(
              "button",
              {
                class:
                    props.opt?.length > 0
                        ? "ss-drop-button ss-drop-button-more"
                        : "ss-drop-button",
                type: "button", // 明确指定按钮类型为 button
                onMouseenter: handleMouseEnter,
                onMouseleave: handleMouseLeave,
                onClick: handleClick, // 添加点击事件处理
              },
              [
                h("span", {
                  class: props.iconClass,
                  style: { fontFamily: "iconfont" },
                }),
                h("span", getDisplayText()),
                props.opt.length > 0 &&
                showPopup.value &&
                h(
                    "div",
                    {
                      class: "popup",
                    },
                    props.opt.map((item) =>
                        h(
                            "div",
                            {
                              onClick: (e) => {
                                e.preventDefault(); // 选项点击也阻止默认行为
                                e.stopPropagation(); // 阻止事件冒泡
                                currentId.value = item.id; // 更新当前选中的ID
                                item.callback();
                                showPopup.value = false; // 选择后关闭弹窗
                              },
                            },
                            item.desc
                        )
                    )
                ),
              ]
          );
    },
  };
  /**
   * 二级页面标签组件
   * @name ss-sub-tab
   * @description 用于展示二级页面的布局组件，包含左侧垂直标签导航（支持分组）和右侧iframe内容区
   * @property {String} headerImage - 左侧顶部图片地址
   * @property {Array} menuList - 菜单配置列表
   * @property {Object} [activeMenu] - 当前选中的菜单项，不传则自动选择第一个可选菜单
   * @property {Array} footerButtons - 底部按钮配置列表

   */
  /**
   * SsSubTab 左侧菜单+iframe内容组件
   * v3.0 改造：去掉顶部图片，改为图标+悬浮模式，iframe懒加载 by xu 20251216
   */
  const SsSubTab = {
    name: "SsSubTab",
    props: {
      menuList: {
        type: Array,
        required: true,
      },
      activeMenu: {
        type: String,
        default: "",
      },
      footerButtons: {
        type: Array,
        default: () => [],
      },
      leftDisplay: {
        type: Boolean,
        default: true,
      },
      // v3.0 新增：菜单模式 collapse(悬浮展开) / fixed(始终收起) by xu 20251216
      initialMode: {
        type: String,
        default: 'collapse',
      },
    },
    emits: ["menu-change", "footer-click"],
    setup(props, { emit }) {
      // v3.0 新增：默认图标映射，使用icon-biz图标 by xu 20251216
      const defaultIcons = [
        'icon-obj-ry',       // 人员
        'icon-obj-dw',       // 单位
        'icon-obj-gw',       // 岗位
        'icon-biz-rc',       // 人才
        'icon-biz-xc',       // 巡查
        'icon-biz-cl',       // 材料
        'icon-biz-men',      // 门
        'icon-obj-xy'        // 协议
      ];
      //功能: SsSubTab 支持后端下发 iconName + pobj/cobj 两级菜单 by xu 20251222
      const isTrue = (v) => v === true || v === "true" || v === 1 || v === "1"; //功能 by xu 20251222
      const resolveIconClass = (iconNameOrClass, fallbackIndex) => { //功能 by xu 20251222
        const fallback = `menu-icon ${defaultIcons[fallbackIndex % defaultIcons.length]}`;
        if (!iconNameOrClass) {
          return fallback;
        }
        // 已经是完整 class（可能包含 menu-icon / menu-base-icon / 多个 class）
        if (typeof iconNameOrClass === "string" && iconNameOrClass.indexOf(" ") > -1) {
          return iconNameOrClass;
        }
        const iconName = iconNameOrClass;
        if (iconName === "menu-icon" || iconName === "menu-base-icon") {
          return fallback;
        }
        // 业务图标库：icon-biz / icon-obj -> menu-icon
        if (
            typeof iconName === "string" &&
            (iconName.indexOf("icon-obj-") === 0 || iconName.indexOf("icon-biz-") === 0)
        ) {
          return `menu-icon ${iconName}`;
        }
        // 默认认为是 icon-base 图标 -> menu-base-icon
        return `menu-base-icon ${iconName}`;
      };
      const getMenuIcon = (item, index) => { //功能 by xu 20251222
        if (!item) {
          return resolveIconClass(null, index);
        }
        //功能: 变动图标后端暂不正确，前端先写死为 icon-chg by xu 20251223
        if (item.title === "变动" || item.name === "sys_bd") {
          return resolveIconClass("icon-chg", index);
        }
        // 兼容旧字段 icon（优先使用）
        if (item.icon) return resolveIconClass(item.icon, index);
        // v3.0 使用后端下发 iconName
        if (item.iconName) return resolveIconClass(item.iconName, index);
        return resolveIconClass(null, index);
      };

      //功能: SsSubTab 底部按钮支持 icon+文字（icon-base）by xu 20251224
      const getFooterIcon = (button) => { //功能 by xu 20251224
        if (!button) return "menu-base-icon icon-save";
        const iconNameOrClass = button.iconClass || button.iconName || button.icon;
        if (!iconNameOrClass) return "menu-base-icon icon-save";
        if (typeof iconNameOrClass === "string" && iconNameOrClass.indexOf(" ") > -1) {
          return iconNameOrClass;
        }
        return `menu-base-icon ${iconNameOrClass}`;
      };

      //功能: pobj/cobj 扁平结构转换为 children 树结构，兼容原 children 结构 by xu 20251222
      const normalizeMenuList = (rawList) => {
        if (!Array.isArray(rawList) || rawList.length === 0) {
          return [];
        }
        const hasTree = rawList.some((it) => Array.isArray(it?.children) && it.children.length > 0);
        if (hasTree) {
          return rawList.map((it) => ({
            ...it,
            __level: 1,
            children: Array.isArray(it.children)
                ? it.children.map((c) => ({ ...c, __level: 2 }))
                : it.children,
          }));
        }
        const hasMarker = rawList.some((it) => it && ("pobj" in it || "cobj" in it));
        if (!hasMarker) {
          return rawList.map((it) => ({ ...it, __level: 1 }));
        }
        const result = [];
        let currentGroup = null;
        for (const item of rawList) {
          //功能: “变动”始终按一级处理（即使后端误传 pobj/cobj）by xu 20251223
          const isChgItem = item && (item.title === "变动" || item.name === "sys_bd");
          if (isChgItem) {
            result.push({ ...item, __level: 1 });
            continue;
          }
          const isParent = isTrue(item?.pobj);
          const isChild = isTrue(item?.cobj);
          if (isParent) {
            currentGroup = {
              ...item,
              __level: 1,
              children: [],
            };
            result.push(currentGroup);
            continue;
          }
          if (isChild && currentGroup) {
            currentGroup.children.push({ ...item, __level: 2 });
            continue;
          }
          //功能: 变动等无 pobj/cobj 的选项按一级展示（不挂到 children，也不打断当前分组）by xu 20251223
          result.push({ ...item, __level: 1 });
        }
        return result;
      };
      const menuListComputed = computed(() => normalizeMenuList(props.menuList)); //功能 by xu 20251222
      //功能: 分组展开状态（默认展开），避免 computed 生成对象导致 open 状态丢失 by xu 20251222
      const groupOpenState = reactive({}); // { [key]: boolean }
      const getGroupKey = (item) => (item?.name || item?.title || ""); //功能 by xu 20251222
      const isGroupOpen = (item) => { //功能 by xu 20251222
        const key = getGroupKey(item);
        if (!key) return true;
        return groupOpenState[key] !== false;
      };
      const toggleGroupOpen = (item) => { //功能 by xu 20251222
        const key = getGroupKey(item);
        if (!key) return;
        groupOpenState[key] = !isGroupOpen(item);
      };
      const getLevelClass = (item, fallbackLevel) => { //功能 by xu 20251222
        //功能: “变动”始终按一级样式处理 by xu 20251223
        if (item && (item.title === "变动" || item.name === "sys_bd")) {
          return "level-1";
        }
        const level = item?.__level || fallbackLevel || 1;
        return level === 2 ? "level-2" : "level-1";
      };

      // v3.0 新增：菜单模式管理 by xu 20251216
      const menuMode = ref(props.initialMode);
      const isHovering = ref(false);

      const toggleMenuMode = () => {
        menuMode.value = menuMode.value === 'collapse' ? 'fixed' : 'collapse';
      };

      //功能: 提供给旧UI弹窗顶部按钮调用的 API（替代点击 .menu-mode-toggle DOM）by xu 20251224
      const registerSsSubTabApi = () => { //功能 by xu 20251224
        try {
          window.SS = window.SS || {};
          window.SS.dom = window.SS.dom || {};
          //功能: 兼容小写 ss 命名空间（部分页面只引用 window.ss）by xu 20251224
          window.ss = window.ss || window.SS;
          window.ss.dom = window.ss.dom || window.SS.dom;
          const api = {
            toggleMenuMode,
            getMenuMode: () => menuMode.value,
          };
          window.SS.dom.ssSubTabApi = api;
          window.ss.dom.ssSubTabApi = api;
          //功能: 多层弹窗(如 objPlay -> objInfo) 场景，将 API 注册到 topWindow 供按钮跨层调用 by xu 20251224
          try {
            const wdDialogId = window.wd && wd.display && wd.display.getwdDialogId && wd.display.getwdDialogId();
            if (wdDialogId && window.top) {
              window.top.__ssSubTabApiMap = window.top.__ssSubTabApiMap || {};
              window.top.__ssSubTabApiMap[wdDialogId] = api;
            }
          } catch (e) { }
          try { console.log("[SsSubTabApi] registered", window.location && window.location.pathname); } catch (e) { }
        } catch (e) { }
      };
      const unregisterSsSubTabApi = () => { //功能 by xu 20251224
        try {
          //功能: 从 topWindow 解绑（避免弹窗关闭后残留）by xu 20251224
          try {
            const wdDialogId = window.wd && wd.display && wd.display.getwdDialogId && wd.display.getwdDialogId();
            if (wdDialogId && window.top && window.top.__ssSubTabApiMap && window.top.__ssSubTabApiMap[wdDialogId]) {
              delete window.top.__ssSubTabApiMap[wdDialogId];
            }
          } catch (e) { }
          if (window.SS?.dom?.ssSubTabApi?.toggleMenuMode === toggleMenuMode) {
            delete window.SS.dom.ssSubTabApi;
          }
          if (window.ss?.dom?.ssSubTabApi?.toggleMenuMode === toggleMenuMode) {
            delete window.ss.dom.ssSubTabApi;
          }
        } catch (e) { }
      };
      //功能: 立即注册，避免 enable 早于 onMounted 导致“api not ready”by xu 20251224
      registerSsSubTabApi(); //功能 by xu 20251224
      onBeforeUnmount(unregisterSsSubTabApi); //功能 by xu 20251224

      const onMouseEnter = () => {
        if (menuMode.value === 'collapse') {
          isHovering.value = true;
        }
      };
      const onMouseLeave = () => {
        isHovering.value = false;
      };

      const isExpanded = computed(() => {
        return menuMode.value === 'collapse' && isHovering.value;
      });

      // v3.0 新增：iframe 懒加载，点击才加载 by xu 20251216
      const loadedMenus = ref(new Set());

      const isMenuLoaded = (menuName) => {
        return loadedMenus.value.has(menuName);
      };

      // 根据标题找到对应的菜单项
      const findMenuByTitle = (title) => {
        for (const item of menuListComputed.value) { //功能 by xu 20251222
          if (item.children?.length > 0) {
            const child = item.children.find((c) => c.title === title);
            if (child) return child;
          } else if (item.title === title) {
            return item;
          }
        }
        return null;
      };

      // 计算默认选中的菜单项
      const defaultActiveMenu = computed(() => {
        if (props.activeMenu) {
          const menu = findMenuByTitle(props.activeMenu);
          if (menu) return menu;
        }
        const firstItem = menuListComputed.value[0]; //功能 by xu 20251222
        if (!firstItem) return null;
        //功能: 默认选中第一个一级菜单（不默认跳到第一个二级）by xu 20251224
        return firstItem;
      });

      const currentMenu = ref(defaultActiveMenu.value);

      // 监听外部activeMenu变化
      watch(
          () => props.activeMenu,
          (newTitle) => {
            if (newTitle) {
              const menu = findMenuByTitle(newTitle);
              if (menu) {
                currentMenu.value = menu;
              }
            }
          }
      );

      // 初始化：默认选中项加入已加载集合
      watch(currentMenu, (menu) => {
        if (menu?.name) {
          loadedMenus.value.add(menu.name);
        }
      }, { immediate: true });

      // 选择菜单项时触发 menu-change 钩子
      const selectItem = (item) => {
        currentMenu.value = item;
        // 标记为已加载
        if (item.name) {
          loadedMenus.value.add(item.name);
        }
        emit("menu-change", item);
      };

      // 处理底部按钮点击
      const handleFooterClick = (button, index) => {
        emit("footer-click", { button, index });
      };

      return {
        menuListComputed, //功能 by xu 20251222
        currentMenu,
        selectItem,
        handleFooterClick,
        getFooterIcon, //功能: SsSubTab 底部按钮支持 icon+文字（icon-base）by xu 20251224
        menuMode,
        isHovering,
        isExpanded,
        toggleMenuMode,
        onMouseEnter,
        onMouseLeave,
        isMenuLoaded,
        getMenuIcon,
        isGroupOpen, //功能 by xu 20251222
        toggleGroupOpen, //功能 by xu 20251222
        getLevelClass, //功能 by xu 20251222
      };
    },
    template: `
	          <div class="project-edit-container">
              <div class="left-side"
                   v-if="leftDisplay"
                   :data-mode="menuMode"
                   :class="{ 'is-expanded': isExpanded }"
                   @mouseenter="onMouseEnter"
                   @mouseleave="onMouseLeave">

                  <!-- 菜单内容 -->
	                  <div class="menu-content">
	                      <div class="scroll-view">
		                          <template v-for="(menuItem, i) in menuListComputed" :key="i">
		                              <!-- 分组菜单 -->
		                              <div v-if="menuItem.children?.length > 0" class="group">
		                                  <!-- 功能: 一级(pobj)可点击进入，箭头仅控制展开/收起；二级点击不影响一级选中状态 by xu 20251223 -->
		                                  <div class="menu-item"
		                                       :class="[getLevelClass(menuItem, 1), { active: menuItem.name === currentMenu?.name }]"
		                                       @click="selectItem(menuItem)">
		                                      <ss-icon :class="getMenuIcon(menuItem, i)" />
		                                      <span class="menu-label">{{ menuItem.title }}</span>
		                                      <!-- 功能: 一级菜单有子项时显示 dot（参考全局左侧菜单）by xu 20251224 -->
		                                      <div class="has-children-dot"></div>
		                                      <div class="menu-tooltip">{{ menuItem.title }}</div>
		                                  </div>
		                                  <!-- 功能: 二级菜单始终展示，不做收缩展开 by xu 20251223 -->
		                                  <div class="group-detail">
		                                      <div v-for="(item, j) in menuItem.children"
		                                          :key="j"
		                                          class="menu-item"
		                                          :class="[getLevelClass(item, 2), { active: item.name === currentMenu?.name }]"
		                                          @click.stop="selectItem(item)">
		                                          <ss-icon :class="getMenuIcon(item, j)" />
		                                          <span class="menu-label">{{ item.title }}</span>
		                                      </div>
	                                  </div>
	                              </div>
                              <!-- 普通菜单项 -->
		                              <div v-else
		                                  class="menu-item"
		                                  :class="[getLevelClass(menuItem, 1), { active: menuItem.name === currentMenu?.name }]"
		                                  @click="selectItem(menuItem)">
		                                  <ss-icon :class="getMenuIcon(menuItem, i)" />
		                                  <span class="menu-label">{{ menuItem.title }}</span>
	                                  <div class="menu-tooltip">{{ menuItem.title }}</div>
	                              </div>
                          </template>
                      </div>
                  </div>

	                  <!-- 底部按钮 -->
		                  <div v-if="footerButtons.length > 0"
		                      class="sub-tab-menu-footer"
		                      :class="{ 'has-text': !!footerButtons[0].text }"
		                      @click="footerButtons[0].onclick">
	                      <ss-icon :class="getFooterIcon(footerButtons[0])" />
	                      <div class="footer-label" v-if="footerButtons[0].text">{{ footerButtons[0].text }}</div>
	                      <ss-icon v-if="footerButtons.length > 1" class="footer-arrow" name="arrow-up" size="24px" />
	                      <div v-if="footerButtons.length > 1" class="sub-tab-menu-popup">
	                          <div v-for="(button, index) in footerButtons.slice(1)"
	                              :key="index"
	                              @click.stop="button.onclick">
	                              {{ button.text }}
	                          </div>
	                      </div>
	                  </div>

              </div>

              <!-- 右侧内容区域 - 懒加载 iframe -->
              <div class="content-area fit-height-content" style="overflow: hidden;" :style="!leftDisplay ? { width: '100%' } : {}">
                  <template v-for="(menuItem, i) in menuList" :key="i">
                      <iframe
                          v-if="isMenuLoaded(menuItem.name)"
                          :src="menuItem.url"
                          style="height: 100%;width: 100%;"
                          frameborder="0"
                          class="sub-tab-iframe"
                          :id="i === 0 ? 'sub-tab-iframe' : ''"
                          v-show="currentMenu?.name === menuItem.name"
                      />
                  </template>
              </div>
          </div>
      `,
  };
  // <iframe
  //     v-if="currentMenu?.url"
  //     :src="currentMenu.url"
  //     style="height: 100%;width: 100%;"
  //     frameborder="0"
  //     id="sub-tab-iframe"
  // />

  // ss-photo-upload 通用图片上传组件
  const SsImgUpload = {
    name: "SsImgUpload",
    props: {
      name: {
        type: String,
        required: true,
      },
      // 图片URL，用于回显
      // url: {
      //   type: String,
      //   default: "",
      // },
      // 样式类名
      class: {
        type: String,
        required: true,
      },
      // 裁剪配置
      cropperOpt: {
        type: Object,
        default: () => ({
          width: 360,
          height: 360,
          aspectRatio: 1,
        }),
      },
      //上传图片url(未加图片名参数之前的部分)
      ulUrl: {
        type: String,
        required: true,
      },
      //下载图片url(未加图片名参数之前的部分)
      dlUrl: {
        type: String,
        required: true,
      },
      modelValue: [String, Number],
    },

    emits: ["update:modelValue"],

    setup(props, { emit }) {
      const inputId = Vue.computed(
          () => `file_${Vue.getCurrentInstance().uid}`
      );
      //修改图片初始显示路径
      let pathVal = ref(props.modelValue);
      let picUrl = ref("");
      if (props.modelValue) {
        picUrl.value = props.dlUrl + "&path=" + props.modelValue;
      }

      Vue.onMounted(() => {
        window.SS.cropper.init({
          el: $(`#${inputId.value}`),
          photoSize: {
            width: props.cropperOpt.width,
            height: props.cropperOpt.height,
          },
          aspectRatio: props.cropperOpt.aspectRatio,
          uploadUrl: props.ulUrl,
          success: (path) => {
            pathVal.value = path;
            picUrl.value = props.dlUrl + "&path=" + path;
            emit("update:modelValue", path);
          },
        });
      });

      return () =>
          h("div", { class: [props.class] }, [
            h("input", {
              type: "file",
              accept: "image/*",
              id: inputId.value,
              style: { display: "none" },
            }),
            h("input", {
              type: "hidden",
              name: props.name,
              value: pathVal.value,
            }),
            h(
                "div",
                {
                  style: {
                    width: "100%",
                    height: "100%",
                  },
                  onClick: () => $(`#${inputId.value}`).click(),
                },
                [
                  picUrl.value &&
                  h("img", {
                    src: picUrl.value,
                    style:
                        "width: 100%; height: 100%;object-fit: inherit;position: relative;z-index: 11;",
                  }),
                ]
            ),
          ]);
    },
  };

  // 初始化函数，负责创建和挂载 Vue 应用
  // window.SS = { dom: {} };
  /**
   * 获取当前窗口的父窗口
   * @returns {Window} 父窗口对象
   */
  window.SS.topWin = (function (p, c) {
    while (p != c) {
      c = p;
      p = p.parent;
    }
    return c;
  })(window.parent, window);

  window.SS.createSsDialogInstance = createSsDialogInstance;
  /**
   * 创建弹窗
   * @param {Object} setting
   * @param {Function} callbackEvent
   */
  window.SS.openDialog = function (setting, callbackEvent) {
    if (setting.params) {
      const encodedParams = encodeURIComponent(JSON.stringify(setting.params));
      setting.src +=
          (setting.src.includes("?") ? "&" : "?") + "params=" + encodedParams;
    }

    if (window.parent && window.parent !== window) {
      window.parent.SS.createSsDialogInstance(setting, callbackEvent);
    } else {
      createSsDialogInstance(setting, callbackEvent);
    }
  };
  //关闭弹窗
  window.SS.closeDialog = function () {
    console.log("关闭弹窗");
    if (topWindow.dialogInstances.length > 0) {
      const instance = topWindow.dialogInstances.pop();
      console.log("instance", instance);
      console.log("instance.callbackEvent", instance.callbackEvent);
      console.log(
          "instance.callbackEvent.end",
          typeof instance.callbackEvent === "function"
      );
      if (instance.callbackEvent) {
        // 判断是否有end回调并执行
        if (typeof instance.callbackEvent === "function") {
          instance.callbackEvent();
        }
        if (typeof instance.callbackEvent.end === "function") {
          instance.callbackEvent.end();
        }
      }
      instance.app.unmount(); // 卸载最后一个实例
      if (instance.container && instance.container.parentNode) {
        instance.container.parentNode.removeChild(instance.container); // 移除容器
      }
    }
  };

  /**
   * 裁剪插件
   */
  window.SS.cropper = {
    init: function (setting) {
      if (!window.top.SS) window.top.SS = {};
      // 重要：确保 cropper 对象的完整初始化
      if (!window.top.SS.cropper) {
        window.top.SS.cropper = {
          settings: new Map(),
          _backupSettings: {},
          getSetting: this.getSetting,
          clearSetting: this.clearSetting,
          debug: this.debug,
        };
      } else if (!window.top.SS.cropper.settings) {
        // 如果 cropper 存在但 settings 不存在，重新初始化 settings
        window.top.SS.cropper.settings = new Map();
        window.top.SS.cropper._backupSettings = {};
      }
      const uploaderId = `uploader_${Date.now()}_${Math.random()
          .toString(36)
          .substr(2, 9)}`;

      window.top.SS.cropper.settings.set(uploaderId, setting);
      window.top.SS.cropper._backupSettings[uploaderId] = setting;

      setting.box = setting.box || "1";
      var winSetting = {
        headerTitle: "图片裁剪",
        src: "/js/cropper/cropper.jsp",//原来在"/newUI/page/cropper.jsp" Ben(20251205)
        width: "900",
        height: "500",
      };

      $(setting.el).change(function () {
        if (!window.SS.cropper.verify(setting)) {
          $(setting.el).val(""); // 清空文件选择
          return false;
        }
        var files = this.files;
        if (files && files.length) {
          if (!window.SS.cropper.verifySize($(setting.el)[0], 5)) {
            $(setting.el).val(""); // 清空文件选择
            alert("文件大小不能超过5M，请重新选择");
            return false;
          }
          var URL = window.URL || window.webkitURL;
          var file = files[0];
          setting.file = file;

          if (
              /^image\/\w+$/.test(file.type) &&
              /\.(jpg|jpeg|png|)$/i.test(file.name)
          ) {
            var uploadedImageURL = URL.createObjectURL(file);
            setting.data = uploadedImageURL;
            setting.fileName = file.name;
            // console.log()
            winSetting.params = {
              ...setting,
              uploaderId,
            };
            console.log("ss-componets中change之后的winSetting", winSetting);
            SS.openDialog(winSetting, {
              success: function (win) {
                console.log("裁剪插件成功");
                // win.cropperSetting = setting;
              },
              end: function () {
                console.log("裁剪插件结束");
                $(setting.el).val(""); // 清空文件选择
              },
            });
          } else {
            alert("请选择图片文件，支持jpg、jpeg、png格式");
          }
        }
      });
      return uploaderId;
    },
    verify: function (setting) {
      if (!setting) {
        console.error(" cropper setting is not undefined! ");
        return false;
      }
      if (!setting.el) {
        console.error(" cropper setting.el is not undefined! ");
        return false;
      }
      if (setting.photoSize) {
        if (
            (!setting.photoSize.width && setting.photoSize.height) ||
            (!setting.photoSize.height && setting.photoSize.width)
        ) {
          console.error(
              " cropper setting.photoSize { width, height } is not undefined! "
          );
          return false;
        }
      }
      if (!setting.box) {
        setting.box = "1";
      }

      if (!setting.aspectRatio) {
        setting.aspectRatio = 1 / 1;
      }

      return true;
    },
    verifySize: function (fileEl, maxSize) {
      // 判断是否为IE浏览器： /msie/i.test(navigator.userAgent) 为一个简单正则
      var isIE = /msie/i.test(navigator.userAgent) && !window.opera;
      var fileSize = 0;
      if (isIE && !fileEl.files) {
        // IE浏览器
        var filePath = fileEl.value; // 获得上传文件的绝对路径
        var fileSystem = new ActiveXObject("Scripting.FileSystemObject");
        var file = fileSystem.GetFile(filePath);
        fileSize = file.Size; // 文件大小，单位：b
      } else {
        // 非IE浏览器
        fileSize = fileEl.files[0].size;
      }

      var size = fileSize / 1024 / 1024;
      return !(size > maxSize);
    },
    // 获取特定上传组件的setting
    getSetting: function (uploaderId) {
      if (!window.top.SS?.cropper) {
        console.warn("顶层窗口中未找到 SS.cropper");
        return null;
      }

      // 优先从 Map 中获取
      let setting = window.top.SS.cropper.settings.get(uploaderId);

      // 如果 Map 中没有，尝试从备份中获取
      if (!setting && window.top.SS.cropper._backupSettings[uploaderId]) {
        console.log("从备份中恢复 setting");
        setting = window.top.SS.cropper._backupSettings[uploaderId];
        // 恢复到 Map 中
        window.top.SS.cropper.settings.set(uploaderId, setting);
      }

      return setting;
    },

    // 清理特定上传组件的setting
    clearSetting: function (uploaderId) {
      if (!window.top.SS?.cropper) return;

      window.top.SS.cropper.settings.delete(uploaderId);
      delete window.top.SS.cropper._backupSettings[uploaderId];
      console.log(
          "清理设置后的 Map size:",
          window.top.SS.cropper.settings.size
      );
    },
  };

  /**
   * 获取url中的参数
   * @returns {Object}
   */
  window.SS.getQueryParams = function () {
    const params = {};
    const queryString = window.location.search.substring(1);
    const pairs = queryString.split("&");
    for (let i = 0; i < pairs.length; i++) {
      const pair = pairs[i].split("=");
      params[decodeURIComponent(pair[0])] = decodeURIComponent(pair[1]);
    }
    if (params.params) {
      try {
        params.params = JSON.parse(params.params);
      } catch (e) {
        console.error("Failed to parse params:", e);
      }
    }

    return params;
  };

  /**
   * 创建vue应用
   * @param {Object} config 配置项
   * @values {String} config.el 挂载的元素
   * @values {Boolean} config.isDialogPage 是否是弹窗页面 决定了是否可以使用顶天立地
   * @values {Object} config.vueOptions vue配置项
   * @returns {Object} vue实例
   */
  window.SS.dom.initializeFormApp = function (config) {
    const { el, isDialogPage = false, ...vueOptions } = config;
    const app = createApp({
      ...vueOptions,
    });
    // 如果是弹窗iframe里面的html的话 给当前的页面挂上事件 实现顶天立地的效果
    if (isDialogPage) {
      function checkScroll() {
        // 选出所有fit-height-content的元素 如果有滚动条
        const elements = document.querySelectorAll(".fit-height-content");
        let hasScrollBar = false;
        // 检查元素是否有滚动条 检查当前窗口的所有元素
        // 如果有滚动条，则将结果设置为true
        elements.forEach((el) => {
          if (el.scrollHeight > el.clientHeight) {
            hasScrollBar = true;
          }
        });
        // 将结果发送给父窗口
        window.parent.postMessage({ hasScrollBar }, "*");
      }

      function addScrollListeners() {
        const elements = document.querySelectorAll("div");
        elements.forEach((el) => {
          el.addEventListener("scroll", checkScroll);
        });
      }
      const observer = new MutationObserver((mutations) => {
        addScrollListeners();
        checkScroll();
      });

      observer.observe(document.body, {
        childList: true,
        subtree: true,
      });

      window.addEventListener("resize", checkScroll);
    }
    // 注册组件
    app.component("SsLoginIcon", SsLoginIcon);
    app.component("SsMark", SsMark);
    app.component("SsFullStyleHeader", SsFullStyleHeader);
    app.component("SsDialog", SsDialog);
    app.component("SsInp", SsInput);//把SsInput改为SsInp Ben(20251225)
    app.component("SsObjp", SsObjp);
    app.component("SsHidden", SsHidden);
    app.component("SsCcp", SsCcp);
    app.component("SsDatePicker", SsDatePicker);
    app.component("SsIcon", SsIcon);
    app.component("SsCommonIcon", SsCommonIcon);
    app.component("SsBreadcrumb", SsBreadcrumb);
    app.component("SsEditor", SsEditor);
    app.component("SsDialogIcon", SsDialogIcon);
    app.component("SsBottomButton", SsBottomButton);
    app.component("SsNavIcon", SsNavIcon);
    app.component("SsHeaderIcon", SsHeaderIcon);
    app.component("SsGolbalMenuIcon", SsGolbalMenuIcon);
    app.component("SsCartListIcon", SsCartListIcon);
    app.component("SsQuickIcon", SsQuickIcon);
    app.component("SsFormIcon", SsFormIcon);
    app.component("SsBottomDivIcon", SsBottomDivIcon);
    app.component("SsEditorIcon", SsEditorIcon);
    app.component("SsValidate", SsValidate);
    app.component("SsOnoff", Ssonoff);
    app.component("SsonoffArray", SsonoffArray);
    app.component("SsTextarea", SsTextarea);
    app.component("SsLoginInput", SsLoginInput);
    app.component("SsLoginButton", SsLoginButton);
    app.component("SsSearch", SsSearch);
    app.component("SsCartItem", SsCartItem);
    app.component("SsCartItem2", SsCartItem2);
    app.component("SsListCard", SsListCard);
    app.component("SsFolderCard", SsFolderCard);
    // 注册右侧边栏组件（ss-sidebar） by xu 20260106
    app.component("ss-sidebar", SsSidebar);
    app.component("ss-sidebar-buttons", SsSidebarButtons);
    app.component("ss-sidebar-chart", SsSidebarChart);
    app.component("ss-sidebar-chart-hover", SsSidebarChartHover);
    app.component("ss-sidebar-list", SsSidebarList);
    app.component("SsFolderCartView", SsFolderCartView);
    app.component("SsPage", SsPage);
    app.component("SsRightInfo", SSRightInfo);
    app.component("SsSuccessPopup", SsSuccessPopup);
    app.component("SsErrorDialog", SsErrorDialog);
    app.component("SsVerify", SsVerify);
    app.component("SsVerifyNode", SsVerifyNode);
    app.component("SsOrcImgBox", SsOrcImgBox);
    app.component("ss-search-input", SsSearchInput);
    app.component("ss-search-date-picker", SsSearchDatePicker);

    app.component("ss-search-button", SsSearchButton);
    app.component("ss-drop-button", SsDropButton);
    app.component("ss-sub-tab", SsSubTab);
    app.component("ss-img", SsImgUpload);

    // 设置为中文
    app.use(ElementPlus, {
      locale: ElementPlusLocaleZhCn,
    });
    // console.log(ElementPlus);
    // 确保 ElementPlusIconsVue
    // if (window.ElementPlusIconsVue) {
    //   // 注册 Element Plus 图标组件
    //   for (const [key, component] of Object.entries(
    //     window.ElementPlusIconsVue
    //   )) {
    //     console.log(key, component);
    //     app.component(key, component);
    //   }
    // }
    // 挂载首页的组件
    for (const componentName in IndexComponents) {
      app.component(componentName, IndexComponents[componentName]);
    }
    // 挂载echarts的组件
    for (const componentName in EchartComponents) {
      app.component(componentName, EchartComponents[componentName]);
    }
    // 挂载 Vue 应用
    let vm ;
    try {
      vm = app.mount(el);
      vm.data = vueOptions.data();
      console.log("vm:",vm)
      console.log("vueOptions:",vueOptions)
    } catch (error) {
      alert('Mount failed:'+ error);//vue Mount失败报错 Ben(20251206)
    }


    return vm;
  };
})();