/* global Page, wx, require, console, module */

const {
  createServerSeed,
  listServers,
  saveServers,
  upsertServer,
  removeServer,
  markServerConnected,
  appendLog,
  getSettings
} = require("../../utils/storage");
const { getTerminalSessionSnapshot } = require("../../utils/terminalSession");
const {
  isTerminalSessionAiHighlighted,
  isTerminalSessionConnecting,
  isTerminalSessionHighlighted
} = require("../../utils/terminalSessionState");
const { buildThemeStyle, applyNavigationBarTheme } = require("../../utils/themeStyle");
const { buildButtonIconThemeMaps, resolveButtonIcon } = require("../../utils/themedIcons");
const { openTerminalPage: navigateTerminalPage } = require("../../utils/terminalNavigation");
const { buildPageCopy, formatTemplate, normalizeUiLanguage } = require("../../utils/i18n");
const { subscribeSyncConfigApplied } = require("../../utils/syncConfigBus");
const { buildSvgButtonPressData, createSvgButtonPressMethods } = require("../../utils/svgButtonFeedback");
const { getWindowMetrics } = require("../../utils/systemInfoCompat");

const SWIPE_AXIS_LOCK_THRESHOLD_PX = 8;
const SERVER_SWIPE_ACTION_WIDTH_RPX = 240;
const SERVER_SWIPE_FALLBACK_WIDTH_PX = 120;

function resolveTouchClientPoint(event) {
  const point =
    (event && event.touches && event.touches[0]) ||
    (event && event.changedTouches && event.changedTouches[0]) ||
    null;
  if (!point) return null;
  const x = Number(point.clientX);
  const y = Number(point.clientY);
  if (!Number.isFinite(x) || !Number.isFinite(y)) return null;
  return { x, y };
}

function resolveTouchClientY(event) {
  const point = resolveTouchClientPoint(event);
  return point ? point.y : null;
}

/**
 * 服务器左滑动作区露出“复制 + 删除”两个按钮，整体宽度按设计稿 `240rpx` 换算：
 * 1. 统一在 JS 内转成 px，便于与 touch `clientX` 直接比较；
 * 2. 老环境拿不到窗口宽度时回退到保守值，避免手势完全失效。
 */
function resolveServerSwipeRevealPx(windowWidth) {
  const width = Number(windowWidth);
  if (!Number.isFinite(width) || width <= 0) {
    return SERVER_SWIPE_FALLBACK_WIDTH_PX;
  }
  return Math.round((width * SERVER_SWIPE_ACTION_WIDTH_RPX) / 750);
}

function clampServerSwipeOffset(offset, revealPx) {
  const numeric = Number(offset);
  if (!Number.isFinite(numeric)) return 0;
  if (numeric < -revealPx) return -revealPx;
  if (numeric > 0) return 0;
  return numeric;
}

function shouldOpenServerSwipe(offset, revealPx) {
  return clampServerSwipeOffset(offset, revealPx) <= -revealPx * 0.45;
}

const loggedRenderProbeKeys = new Set();

function shouldUseTextIcons() {
  if (!wx || typeof wx.getAppBaseInfo !== "function") return false;
  try {
    const info = wx.getAppBaseInfo() || {};
    return (
      String(info.platform || "")
        .trim()
        .toLowerCase() === "devtools"
    );
  } catch {
    return false;
  }
}

function inspectRenderPayload(payload) {
  const stats = {
    stringCount: 0,
    dataImageCount: 0,
    svgPathCount: 0,
    urlCount: 0,
    maxLength: 0,
    samples: []
  };
  const walk = (value, path, depth) => {
    if (depth > 5) return;
    if (typeof value === "string") {
      stats.stringCount += 1;
      if (value.includes("data:image")) stats.dataImageCount += 1;
      if (value.includes(".svg")) stats.svgPathCount += 1;
      if (value.includes("url(")) stats.urlCount += 1;
      if (value.length > stats.maxLength) stats.maxLength = value.length;
      if (
        stats.samples.length < 6 &&
        (value.includes("data:image") ||
          value.includes(".svg") ||
          value.includes("url(") ||
          value.length >= 120)
      ) {
        stats.samples.push({
          path,
          length: value.length,
          preview: value.slice(0, 120)
        });
      }
      return;
    }
    if (!value || typeof value !== "object") return;
    if (Array.isArray(value)) {
      value.forEach((item, index) => walk(item, `${path}[${index}]`, depth + 1));
      return;
    }
    Object.keys(value).forEach((key) => walk(value[key], path ? `${path}.${key}` : key, depth + 1));
  };
  walk(payload, "", 0);
  return stats;
}

function logRenderProbeOnce(key, label, payload) {
  const normalizedKey = String(key || label || "");
  if (!normalizedKey || loggedRenderProbeKeys.has(normalizedKey)) return;
  loggedRenderProbeKeys.add(normalizedKey);
  console.warn(`[render_probe] ${label}`, inspectRenderPayload(payload));
}

/**
 * 服务器列表页（对齐 Web ConnectView）：
 * 1. 顶部三图标：新增、删除已选、全选/取消全选；
 * 2. 搜索框 + 单层列表；
 * 3. 每行保留 ai/connect 图标位，排序改为长按拖拽。
 */
const connectPageOptions = {
  data: {
    ...buildSvgButtonPressData(),
    themeStyle: "",
    icons: {},
    activeIcons: {},
    accentIcons: {},
    copy: buildPageCopy("zh-Hans", "connect"),
    textIconMode: false,
    query: "",
    servers: [],
    filteredServers: [],
    selectedServerIds: [],
    isAllSelected: false,
    activeServerId: "",
    connectingServerId: "",
    dragActive: false,
    dragServerId: ""
  },

  dragRuntime: null,
  dragTapLockUntil: 0,
  syncConfigUnsub: null,
  swipeRuntime: null,
  swipeOffsets: null,
  serverSwipeRevealPx: 0,

  onLoad() {
    /**
     * 首次启动时，云端 bootstrap 可能晚于首页首帧完成：
     * 1. 首页先按旧本地快照渲染是正常的；
     * 2. 一旦 bootstrap 合并回 storage，需要立刻重读服务器列表和主题；
     * 3. 否则用户会误以为同步没生效，必须手动重进页面才看到更新。
     */
    this.syncConfigUnsub = subscribeSyncConfigApplied(() => {
      this.applyThemeStyle();
      this.reloadServers();
    });
  },

  onShow() {
    this.applyThemeStyle();
    this.reloadServers();
  },

  onHide() {
    this.swipeRuntime = null;
    this.closeAllServerRows();
    if (this.data.dragActive) {
      this.clearDragState();
    }
  },

  onUnload() {
    if (typeof this.syncConfigUnsub === "function") {
      this.syncConfigUnsub();
      this.syncConfigUnsub = null;
    }
  },

  applyThemeStyle() {
    const settings = getSettings();
    const language = normalizeUiLanguage(settings.uiLanguage);
    const copy = buildPageCopy(language, "connect");
    const { icons, activeIcons, accentIcons } = buildButtonIconThemeMaps(settings);
    applyNavigationBarTheme(settings);
    wx.setNavigationBarTitle({ title: copy.navTitle || "服务器" });
    const payload = {
      themeStyle: buildThemeStyle(settings),
      icons,
      activeIcons,
      accentIcons,
      copy,
      textIconMode: shouldUseTextIcons() && Object.keys(icons).length === 0
    };
    logRenderProbeOnce("connect.applyThemeStyle", "connect.applyThemeStyle", payload);
    this.setData(payload);
  },

  reloadServers() {
    const rows = listServers();
    this.reconcileServerSwipeState(rows);
    this.setData({ servers: rows }, () => {
      this.applyFilter(this.data.query);
      this.syncSelectState();
    });
  },

  applyFilter(query) {
    const text = String(query || "")
      .trim()
      .toLowerCase();
    const selected = new Set(this.data.selectedServerIds);
    const sessionSnapshot = getTerminalSessionSnapshot();
    const fallbackThemeMaps = buildButtonIconThemeMaps(getSettings());
    const iconMap =
      this.data.icons && Object.keys(this.data.icons).length ? this.data.icons : fallbackThemeMaps.icons;
    const activeIconMap =
      this.data.activeIcons && Object.keys(this.data.activeIcons).length
        ? this.data.activeIcons
        : fallbackThemeMaps.activeIcons;
    const accentIconMap =
      this.data.accentIcons && Object.keys(this.data.accentIcons).length
        ? this.data.accentIcons
        : fallbackThemeMaps.accentIcons;
    this.reconcileServerSwipeState(this.data.servers);
    const next = this.data.servers
      .filter((item) => {
        if (!text) return true;
        return [
          item.name,
          item.host,
          item.username,
          String(item.port),
          item.authType,
          this.resolveDisplayTags(item)
            .map((tag) => tag.label)
            .join(" ")
        ]
          .join(" ")
          .toLowerCase()
          .includes(text);
      })
      .map((item) => {
        const tags = this.resolveTags(item);
        const displayTags = this.resolveDisplayTags(item);
        const isConnected = isTerminalSessionHighlighted(sessionSnapshot, item.id);
        const isAiConnected = isTerminalSessionAiHighlighted(sessionSnapshot, item.id);
        return {
          ...item,
          selected: selected.has(item.id),
          swipeOffsetX:
            this.swipeOffsets && Number.isFinite(Number(this.swipeOffsets[item.id]))
              ? this.clampServerSwipeOffset(this.swipeOffsets[item.id])
              : 0,
          tags,
          displayTags,
          lastConnectedText: this.formatLastConnected(item.lastConnectedAt),
          authTypeLabel:
            (this.data.copy &&
              this.data.copy.authTypeLabels &&
              this.data.copy.authTypeLabels[item.authType]) ||
            item.authType ||
            "-",
          isConnected,
          isAiConnected,
          isConnecting:
            this.data.connectingServerId === item.id || isTerminalSessionConnecting(sessionSnapshot, item.id),
          aiPressKey: `connect-ai:${item.id}`,
          connectPressKey: `connect-open:${item.id}`,
          aiIcon: resolveButtonIcon("/assets/icons/ai.svg", isAiConnected ? activeIconMap : iconMap),
          aiPressedIcon: resolveButtonIcon(
            "/assets/icons/ai.svg",
            isAiConnected ? activeIconMap : accentIconMap
          ),
          connectIcon: resolveButtonIcon("/assets/icons/connect.svg", isConnected ? activeIconMap : iconMap),
          connectPressedIcon: resolveButtonIcon(
            "/assets/icons/connect.svg",
            isConnected ? activeIconMap : accentIconMap
          ),
          dragOffsetY: 0,
          dragging: false
        };
      });
    const payload = { query, filteredServers: next };
    logRenderProbeOnce("connect.applyFilter", "connect.applyFilter", payload);
    this.setData(payload, () => this.refreshDragVisual());
  },

  syncSelectState() {
    const ids = this.data.servers.map((item) => item.id);
    const selected = this.data.selectedServerIds.filter((id) => ids.includes(id));
    const isAllSelected = ids.length > 0 && selected.length === ids.length;
    this.setData({ selectedServerIds: selected, isAllSelected }, () => this.applyFilter(this.data.query));
  },

  onQueryInput(event) {
    this.closeAllServerRows();
    this.applyFilter(event.detail.value || "");
  },

  onSearchTap() {
    this.closeAllServerRows();
    this.applyFilter(this.data.query);
  },

  onCreateServer() {
    this.closeAllServerRows();
    const seed = createServerSeed();
    const prefix =
      (this.data.copy && this.data.copy.fallback && this.data.copy.fallback.newServerPrefix) || "server";
    upsertServer({ ...seed, name: `${prefix}-${this.data.servers.length + 1}` });
    this.reloadServers();
    wx.navigateTo({ url: `/pages/server-settings/index?id=${seed.id}` });
  },

  onToggleServerSelect(event) {
    this.closeAllServerRows();
    const id = event.currentTarget.dataset.id;
    if (!id) return;
    const selected = new Set(this.data.selectedServerIds);
    if (selected.has(id)) {
      selected.delete(id);
    } else {
      selected.add(id);
    }
    this.setData({ selectedServerIds: [...selected] }, () => this.syncSelectState());
  },

  onToggleSelectAll() {
    this.closeAllServerRows();
    if (this.data.isAllSelected) {
      this.setData({ selectedServerIds: [] }, () => this.syncSelectState());
      return;
    }
    const all = this.data.servers.map((item) => item.id);
    this.setData({ selectedServerIds: all }, () => this.syncSelectState());
  },

  onRemoveSelected() {
    this.closeAllServerRows();
    const targets = this.data.selectedServerIds;
    if (!targets.length) return;
    const copy = this.data.copy || {};
    wx.showModal({
      title: copy?.modal?.removeTitle || "删除服务器",
      content: formatTemplate(copy?.modal?.removeContent, { count: targets.length }),
      success: (res) => {
        if (!res.confirm) return;
        targets.forEach((id) => removeServer(id));
        this.setData({ selectedServerIds: [] });
        this.reloadServers();
      }
    });
  },

  onOpenSettings(event) {
    if (this.data.dragActive || Date.now() < this.dragTapLockUntil) return;
    this.closeAllServerRows();
    const serverId = event.currentTarget.dataset.id;
    this.setData({ activeServerId: serverId || "" });
    wx.navigateTo({ url: `/pages/server-settings/index?id=${serverId}` });
  },

  onConnect(event) {
    if (this.data.dragActive || Date.now() < this.dragTapLockUntil) return;
    this.closeAllServerRows();
    const serverId = event.currentTarget.dataset.id;
    if (!serverId) return;

    const sessionSnapshot = getTerminalSessionSnapshot();
    if (
      isTerminalSessionHighlighted(sessionSnapshot, serverId) ||
      isTerminalSessionConnecting(sessionSnapshot, serverId)
    ) {
      this.setData({ activeServerId: serverId }, () => this.applyFilter(this.data.query));
      this.openTerminalPage(serverId, true);
      return;
    }

    this.setData({ activeServerId: serverId, connectingServerId: serverId }, () =>
      this.applyFilter(this.data.query)
    );
    markServerConnected(serverId);
    appendLog({
      serverId,
      status: "connecting",
      summary: (this.data.copy && this.data.copy.summary && this.data.copy.summary.connectFromList) || ""
    });
    this.setData({ connectingServerId: "" });
    this.openTerminalPage(serverId, false);
  },

  /**
   * 若当前页下方已经是终端页，优先直接返回，避免重复压入新的终端实例。
   */
  openTerminalPage(serverId, reuseExisting, options) {
    navigateTerminalPage(serverId, reuseExisting, options);
  },

  onAiTap(event) {
    if (this.data.dragActive || Date.now() < this.dragTapLockUntil) return;
    this.closeAllServerRows();
    const serverId = event.currentTarget.dataset.id;
    if (!serverId) return;

    const server = this.data.servers.find((item) => item.id === serverId);
    if (!server) {
      wx.showToast({ title: this.data.copy?.toast?.serverNotFound || "服务器不存在", icon: "none" });
      return;
    }

    const sessionSnapshot = getTerminalSessionSnapshot();
    this.setData({ activeServerId: serverId }, () => this.applyFilter(this.data.query));

    if (
      isTerminalSessionHighlighted(sessionSnapshot, serverId) ||
      isTerminalSessionConnecting(sessionSnapshot, serverId)
    ) {
      this.openTerminalPage(serverId, true, { openCodex: true });
      return;
    }

    this.setData({ connectingServerId: serverId }, () => this.applyFilter(this.data.query));
    markServerConnected(serverId);
    appendLog({
      serverId,
      status: "connecting",
      summary: (this.data.copy && this.data.copy.summary && this.data.copy.summary.aiFromList) || ""
    });
    this.setData({ connectingServerId: "" });
    this.openTerminalPage(serverId, false, { openCodex: true });
  },

  /**
   * 复制服务器配置（含认证信息）：
   * 1. 基于当前服务器快照复制全部字段；
   * 2. 重新生成唯一 ID，避免覆盖原记录；
   * 3. 名称按“原服务器名+copy”落库，便于用户二次编辑。
   */
  onCopyServer(event) {
    if (this.data.dragActive || Date.now() < this.dragTapLockUntil) return;
    this.closeAllServerRows();
    const serverId = event.currentTarget.dataset.id;
    if (!serverId) return;

    const source = this.data.servers.find((item) => item.id === serverId);
    if (!source) {
      wx.showToast({
        title: this.data.copy?.toast?.serverToCopyNotFound || "未找到待复制服务器",
        icon: "none"
      });
      return;
    }

    const seed = createServerSeed();
    const copySuffix = String(this.data.copy?.labels?.copyNameSuffix || " copy");
    const copied = {
      ...source,
      id: seed.id,
      name: `${String(source.name || this.data.copy?.unnamedServer || "未命名服务器")}${copySuffix}`,
      sortOrder: Date.now(),
      lastConnectedAt: ""
    };
    upsertServer(copied);
    this.setData({ activeServerId: copied.id }, () => this.reloadServers());
    wx.showToast({ title: this.data.copy?.toast?.serverCopied || "服务器已复制", icon: "none" });
  },

  onStartDrag(event) {
    this.closeAllServerRows();
    this.swipeRuntime = null;
    const serverId = event.currentTarget.dataset.id;
    if (!serverId) return;
    if (this.data.dragActive) return;
    if (String(this.data.query || "").trim()) {
      wx.showToast({
        title: this.data.copy?.toast?.clearSearchBeforeSort || "请清空搜索后再调整顺序",
        icon: "none"
      });
      return;
    }
    if (this.data.filteredServers.length <= 1) return;
    const fromIndex = this.data.filteredServers.findIndex((item) => item.id === serverId);
    if (fromIndex < 0) return;

    const query = wx.createSelectorQuery().in(this);
    query.selectAll(".server-list-row").boundingClientRect((rects) => {
      if (!Array.isArray(rects) || rects.length !== this.data.filteredServers.length) return;
      const startRect = rects[fromIndex];
      if (!startRect) return;
      const startY = resolveTouchClientY(event) || startRect.top + startRect.height / 2;
      this.dragRuntime = {
        serverId,
        fromIndex,
        toIndex: fromIndex,
        startY,
        offsetY: 0,
        orderIds: this.data.filteredServers.map((item) => item.id),
        rects: rects.map((item) => ({
          top: Number(item.top) || 0,
          height: Number(item.height) || 0,
          center: (Number(item.top) || 0) + (Number(item.height) || 0) / 2
        }))
      };
      this.setData(
        {
          dragActive: true,
          dragServerId: serverId
        },
        () => this.refreshDragVisual()
      );
    });
    query.exec();
  },

  onDragTouchMove(event) {
    if (!this.data.dragActive || !this.dragRuntime) return;
    const touchY = resolveTouchClientY(event);
    if (touchY == null) return;

    const runtime = this.dragRuntime;
    runtime.offsetY = touchY - runtime.startY;

    const sourceRect = runtime.rects[runtime.fromIndex];
    if (!sourceRect) return;
    const center = sourceRect.center + runtime.offsetY;
    let targetIndex = runtime.fromIndex;
    let minDistance = Number.POSITIVE_INFINITY;
    for (let i = 0; i < runtime.rects.length; i += 1) {
      const distance = Math.abs(center - runtime.rects[i].center);
      if (distance < minDistance) {
        minDistance = distance;
        targetIndex = i;
      }
    }
    runtime.toIndex = targetIndex;
    this.refreshDragVisual();
  },

  onDragTouchEnd() {
    if (!this.data.dragActive || !this.dragRuntime) return;
    const runtime = this.dragRuntime;
    const moved = runtime.toIndex !== runtime.fromIndex;
    const dragServerId = runtime.serverId;
    this.clearDragState();

    if (!moved || !dragServerId) return;

    const rows = this.data.servers.slice();
    const fromIndex = rows.findIndex((item) => item.id === dragServerId);
    if (fromIndex < 0) return;
    const [current] = rows.splice(fromIndex, 1);
    if (!current) return;
    const targetIndex = Math.max(0, Math.min(rows.length, runtime.toIndex));
    rows.splice(targetIndex, 0, current);
    this.persistServerOrder(rows, dragServerId);
  },

  clearDragState() {
    this.dragRuntime = null;
    this.dragTapLockUntil = Date.now() + 240;
    const next = this.data.filteredServers.map((item) => {
      if (!item.dragOffsetY && !item.dragging) return item;
      return {
        ...item,
        dragOffsetY: 0,
        dragging: false
      };
    });
    this.setData({
      dragActive: false,
      dragServerId: "",
      filteredServers: next
    });
  },

  buildDragOffsetMap() {
    if (!this.data.dragActive || !this.dragRuntime) return {};
    const runtime = this.dragRuntime;
    const from = runtime.fromIndex;
    const to = runtime.toIndex;
    const offsets = {
      [runtime.serverId]: runtime.offsetY
    };
    if (to > from) {
      for (let i = from + 1; i <= to; i += 1) {
        const id = runtime.orderIds[i];
        if (!id) continue;
        const prev = runtime.rects[i - 1];
        const current = runtime.rects[i];
        offsets[id] = (prev ? prev.top : 0) - (current ? current.top : 0);
      }
    } else if (to < from) {
      for (let i = to; i < from; i += 1) {
        const id = runtime.orderIds[i];
        if (!id) continue;
        const current = runtime.rects[i];
        const next = runtime.rects[i + 1];
        offsets[id] = (next ? next.top : 0) - (current ? current.top : 0);
      }
    }
    return offsets;
  },

  refreshDragVisual() {
    if (!this.data.dragActive || !this.dragRuntime) return;
    const offsets = this.buildDragOffsetMap();
    const dragId = this.data.dragServerId;
    const next = this.data.filteredServers.map((item) => {
      const dragOffsetY = Number(offsets[item.id] || 0);
      const dragging = item.id === dragId;
      if (item.dragOffsetY === dragOffsetY && item.dragging === dragging) {
        return item;
      }
      return {
        ...item,
        dragOffsetY,
        dragging
      };
    });
    this.setData({ filteredServers: next });
  },

  persistServerOrder(rows, activeServerId) {
    const base = Date.now();
    const next = rows.map((item, index) => ({
      ...item,
      sortOrder: base + index
    }));
    saveServers(next);
    this.setData(
      {
        servers: next,
        activeServerId: activeServerId || this.data.activeServerId
      },
      () => {
        this.applyFilter(this.data.query);
        this.syncSelectState();
      }
    );
  },

  resolveTouchPoint(event) {
    return resolveTouchClientPoint(event);
  },

  getServerSwipeRevealPx() {
    if (Number.isFinite(this.serverSwipeRevealPx) && this.serverSwipeRevealPx > 0) {
      return this.serverSwipeRevealPx;
    }
    const metrics = getWindowMetrics(wx);
    this.serverSwipeRevealPx = resolveServerSwipeRevealPx(metrics.windowWidth);
    return this.serverSwipeRevealPx;
  },

  clampServerSwipeOffset(offset) {
    return clampServerSwipeOffset(offset, this.getServerSwipeRevealPx());
  },

  reconcileServerSwipeState(rows) {
    const list = Array.isArray(rows) ? rows : [];
    const validIds = new Set(list.map((item) => item.id));
    const nextOffsets = {};
    Object.keys(this.swipeOffsets || {}).forEach((id) => {
      if (!validIds.has(id)) return;
      nextOffsets[id] = this.clampServerSwipeOffset(this.swipeOffsets[id]);
    });
    this.swipeOffsets = nextOffsets;
    if (this.swipeRuntime && !validIds.has(this.swipeRuntime.id)) {
      this.swipeRuntime = null;
    }
  },

  findFilteredServerIndexById(id) {
    return this.data.filteredServers.findIndex((item) => item.id === id);
  },

  updateServerSwipeOffset(id, offset) {
    const index = this.findFilteredServerIndexById(id);
    if (index < 0) return;
    const normalized = this.clampServerSwipeOffset(offset);
    this.swipeOffsets = this.swipeOffsets || {};
    this.swipeOffsets[id] = normalized;
    this.setData({ [`filteredServers[${index}].swipeOffsetX`]: normalized });
  },

  closeOtherServerRows(exceptId) {
    this.swipeOffsets = this.swipeOffsets || {};
    const updates = {};
    this.data.filteredServers.forEach((item, index) => {
      if (item.id === exceptId) return;
      if (item.swipeOffsetX === 0) return;
      this.swipeOffsets[item.id] = 0;
      updates[`filteredServers[${index}].swipeOffsetX`] = 0;
    });
    if (Object.keys(updates).length > 0) {
      this.setData(updates);
    }
  },

  closeAllServerRows() {
    this.swipeOffsets = this.swipeOffsets || {};
    const updates = {};
    this.data.filteredServers.forEach((item, index) => {
      if (item.swipeOffsetX === 0) return;
      this.swipeOffsets[item.id] = 0;
      updates[`filteredServers[${index}].swipeOffsetX`] = 0;
    });
    if (Object.keys(updates).length > 0) {
      this.setData(updates);
    }
  },

  onListTap() {
    this.closeAllServerRows();
  },

  /**
   * 服务器列表沿用闪念页的横向手势模型：
   * 1. `touchstart` 仅记录起点和当前开合态；
   * 2. `touchmove` 再做横纵轴锁定，避免和列表纵向滚动打架；
   * 3. 只允许向左露出删除按钮，不支持向右拖出正偏移。
   */
  onServerTouchStart(event) {
    if (this.data.dragActive) return;
    const id = String(event.currentTarget.dataset.id || "");
    if (!id) return;
    const point = this.resolveTouchPoint(event);
    if (!point) return;
    this.closeOtherServerRows(id);
    this.swipeOffsets = this.swipeOffsets || {};
    this.swipeRuntime = {
      id,
      startX: point.x,
      startY: point.y,
      startOffsetX: this.clampServerSwipeOffset(this.swipeOffsets[id] || 0),
      dragging: false,
      blocked: false
    };
  },

  onServerTouchMove(event) {
    if (this.data.dragActive) return;
    const runtime = this.swipeRuntime;
    if (!runtime || runtime.blocked) return;
    const id = String(event.currentTarget.dataset.id || "");
    if (!id || id !== runtime.id) return;
    const point = this.resolveTouchPoint(event);
    if (!point) return;

    const deltaX = point.x - runtime.startX;
    const deltaY = point.y - runtime.startY;
    if (!runtime.dragging) {
      if (
        Math.abs(deltaX) < SWIPE_AXIS_LOCK_THRESHOLD_PX &&
        Math.abs(deltaY) < SWIPE_AXIS_LOCK_THRESHOLD_PX
      ) {
        return;
      }
      if (Math.abs(deltaY) > Math.abs(deltaX)) {
        runtime.blocked = true;
        return;
      }
      runtime.dragging = true;
    }

    this.updateServerSwipeOffset(id, runtime.startOffsetX + deltaX);
  },

  onServerTouchEnd(event) {
    if (this.data.dragActive) return;
    const runtime = this.swipeRuntime;
    this.swipeRuntime = null;
    if (!runtime || runtime.blocked) return;
    const id = String(event.currentTarget.dataset.id || "");
    if (!id || id !== runtime.id) return;
    const current = this.clampServerSwipeOffset((this.swipeOffsets && this.swipeOffsets[id]) || 0);
    const shouldOpen = shouldOpenServerSwipe(current, this.getServerSwipeRevealPx());
    this.updateServerSwipeOffset(id, shouldOpen ? -this.getServerSwipeRevealPx() : 0);
  },

  onSwipeDeleteServer(event) {
    const serverId = String(event.currentTarget.dataset.id || "");
    if (!serverId) return;
    const server = this.data.servers.find((item) => item.id === serverId);
    const serverName = String(
      (server && server.name) || this.data.copy?.unnamedServer || event.currentTarget.dataset.name || ""
    ).trim();
    const copy = this.data.copy || {};
    wx.showModal({
      title: copy?.modal?.removeTitle || "删除服务器",
      content: formatTemplate(copy?.modal?.removeSingleContent, {
        name: serverName || copy?.unnamedServer || "未命名服务器"
      }),
      success: (res) => {
        if (!res.confirm) return;
        removeServer(serverId);
        if (this.swipeOffsets) {
          delete this.swipeOffsets[serverId];
        }
        this.setData(
          {
            activeServerId: this.data.activeServerId === serverId ? "" : this.data.activeServerId,
            selectedServerIds: this.data.selectedServerIds.filter((id) => id !== serverId)
          },
          () => {
            this.reloadServers();
            wx.showToast({
              title: copy?.toast?.serverDeleted || "服务器已删除",
              icon: "success"
            });
          }
        );
      }
    });
  },

  /**
   * 服务器标签对齐 Web 语义：
   * 1. 只展示用户明确配置的 tags；
   * 2. 不再按服务器名称猜测标签，避免与真实标签混淆。
   */
  resolveTags(server) {
    return Array.isArray(server && server.tags)
      ? server.tags.map((item) => String(item || "").trim()).filter((item) => !!item)
      : [];
  },

  /**
   * 提取项目目录最后一级名称：
   * 1. 先清理空白与尾部斜杠；
   * 2. 同时兼容 Unix/Windows 路径；
   * 3. 列表里只展示短目录名，避免胶囊过长。
   */
  resolveProjectDirectoryName(projectPath) {
    const normalized = String(projectPath || "")
      .trim()
      .replace(/[\\/]+$/g, "");
    if (!normalized) return "";
    const segments = normalized.split(/[\\/]+/).filter(Boolean);
    if (!segments.length) {
      return normalized === "~" ? "~" : "";
    }
    return segments[segments.length - 1] || "";
  },

  /**
   * 卡片底部标签组装：
   * 1. project 胶囊固定排在最前面；
   * 2. 原始 tags 继续跟在后面；
   * 3. 返回对象数组，便于模板按类型切换底色。
   */
  resolveDisplayTags(server) {
    const displayTags = [];
    const projectDirectoryName = this.resolveProjectDirectoryName(server && server.projectPath);
    if (projectDirectoryName) {
      displayTags.push({
        type: "project",
        label: `${(this.data.copy && this.data.copy.display && this.data.copy.display.projectPrefix) || "pro"}:${projectDirectoryName}`
      });
    }
    this.resolveTags(server).forEach((tag) => {
      displayTags.push({
        type: "tag",
        label: tag
      });
    });
    return displayTags;
  },

  /**
   * 最近连接时间统一格式：
   * - 空值显示“无连接”；
   * - 非法时间显示“无连接”；
   * - 合法时间输出 YYYY-MM-DD HH:mm:ss。
   */
  formatLastConnected(input) {
    if (!input) return this.data.copy?.fallback?.noConnection || "无连接";
    const date = new Date(input);
    if (Number.isNaN(+date)) return this.data.copy?.fallback?.noConnection || "无连接";
    const pad = (n) => String(n).padStart(2, "0");
    return `${date.getFullYear()}-${pad(date.getMonth() + 1)}-${pad(date.getDate())} ${pad(date.getHours())}:${pad(date.getMinutes())}:${pad(date.getSeconds())}`;
  },

  ...createSvgButtonPressMethods()
};

Page(connectPageOptions);

module.exports = {
  __test__: {
    pageOptions: connectPageOptions,
    SWIPE_AXIS_LOCK_THRESHOLD_PX,
    SERVER_SWIPE_ACTION_WIDTH_RPX,
    SERVER_SWIPE_FALLBACK_WIDTH_PX,
    resolveServerSwipeRevealPx,
    clampServerSwipeOffset,
    shouldOpenServerSwipe
  }
};