@mx-sose-front/mx-sose-graph 1.0.0

package/src/utils/compartment.ts

@@ -0,0 +1,534 @@
+// utils/compartment.ts
+import type { Bounds, CompartmentRecord, Shape } from '@/types'
+import _ from 'lodash'
+import { toRaw } from 'vue';
+
+export type Rect = { x: number; y: number; width: number; height: number }
+export type Zones = {
+  header: Rect
+  content: Rect
+  childrenArea: Rect
+  parentBounds: Rect
+}
+
+// 标记值缓存
+let taggedValueLabelsCache: string[] = []
+let COMPARTMENT_KEY_SET = new Set<string>()
+
+export function setTaggedValueLabelsCache(labels: string[]) {
+  taggedValueLabelsCache = labels ?? []
+  // 同时更新 Set，全部转小写
+  COMPARTMENT_KEY_SET = new Set(
+    taggedValueLabelsCache.map(k => k.toLowerCase())
+  )
+}
+// 缓存 packagesTypes
+let packageTypesCache: string[] = []
+let PACKAGE_TYPES_SET = new Set<string>()
+
+// 由外部（组件里 watch props.packages）调用
+export function setPackageTypesCache(types: string[]) {
+  packageTypesCache = types ?? []
+  PACKAGE_TYPES_SET = new Set(
+    packageTypesCache.map(t => t.toLowerCase())
+  )
+}
+export const isShapeTypeNotInPackageTypes = (s?: Shape): boolean => {
+  if (!s || !s.shapeKey) return false
+  return !PACKAGE_TYPES_SET.has(String(s.shapeKey).toLowerCase())
+}
+export const CANVAS_LEFT = 0
+export const CANVAS_TOP = 0
+const INSET = 6
+const DIVIDER = 1
+
+// 从 meta 读头/内容高度
+function readHeaderH(p: Shape) {
+  return Number(p.meta?.headerH) ||
+    Number((p.meta as any)?.upperHeight) || 30
+}
+function readContentH(p: Shape) {
+  return Number(p.meta?.contentH) ||
+    Number((p as any).keywordsBounds?.height) ||
+    Math.ceil((Number((p as any).keywordsStyle?.fontSize) || 14) * 1.3)
+}
+
+// 单个子所需的四向扩容
+function growNeedForChildRect(parent: Shape, child: { x: number; y: number; width: number; height: number }) {
+  const pb = parent.bounds!
+  const pX = pb.x ?? 0, pY = pb.y ?? 0, pW = pb.width ?? 0, pH = pb.height ?? 0
+  const pRight = pX + pW, pBottom = pY + pH
+
+  const headerH = readHeaderH(parent)
+  const contentH = readContentH(parent)
+  // children 可放置区的可见顶（子必须在它之下）
+  const childrenTop = pY + headerH + DIVIDER + contentH + INSET
+
+  // 理想扩容（不考虑画布边界）
+  let needLeft = Math.max(0, pX - (child.x - INSET))
+  let needUp = Math.max(0, childrenTop - child.y)
+  let needRight = Math.max(0, (child.x + child.width + INSET) - pRight)
+  let needDown = Math.max(0, (child.y + child.height + INSET) - pBottom)
+
+  // 画布裁剪：向左/向上受边界限制
+  const availLeft = Math.max(0, pX - CANVAS_LEFT)
+  const availUp = Math.max(0, pY - CANVAS_TOP)
+  needLeft = Math.min(needLeft, availLeft)
+  needUp = Math.min(needUp, availUp)
+
+  return { needLeft, needRight, needUp, needDown }
+}
+
+// 聚合父下所有子，统一扩父
+export function ensureCompartmentAfterParentMoved(
+  shapes: Shape[],
+  parent: Shape,
+  updateShape: (id: string, u: Partial<Shape>) => void
+) {
+  if (!isCompartment(parent)) return
+
+  // 只统计“非隔间”的亲子，避免把其它隔间当成子去触发扩容
+  const kids = shapes.filter(
+    x => x.parenShapeId === parent.id && x.bounds && !isCompartment(x)
+  )
+
+  let L = 0, R = 0, U = 0, D = 0
+  for (const k of kids) {
+    const g = growNeedForChildRect(parent, k.bounds as any)
+    L = Math.max(L, g.needLeft)
+    R = Math.max(R, g.needRight)
+    U = Math.max(U, g.needUp)
+    D = Math.max(D, g.needDown)
+  }
+
+  if (L || R || U || D) {
+    const pb = parent.bounds!
+    updateShape(parent.id, {
+      bounds: {
+        x: (pb.x ?? 0) - L,
+        y: (pb.y ?? 0) - U,
+        width: (pb.width ?? 0) + L + R,
+        height: (pb.height ?? 0) + U + D,
+      }
+    })
+  }
+}
+// 用于缓存每个隔间组件的几何分区：header / content / childrenArea 
+const zonesMap = new Map<string, Zones>()
+// 注册或更新某个隔间的分区信息
+export function setCompartmentZones(shapeId: string, z: Zones) {
+  zonesMap.set(shapeId, z)
+}
+// 读取某个隔间的分区信息；不存在时返回 null（
+export const getCompartmentZones = (id: string) => zonesMap.get(id) ?? null
+// 清除某个隔间的分区信息（组件卸载/重建时调用）
+export const clearCompartmentZones = (id: string) => zonesMap.delete(id)
+// 隔间类型判断
+export const isCompartment = (s?: Shape): boolean => {
+  if (!s || !s.shapeKey) return false
+  return COMPARTMENT_KEY_SET.has(String(s.shapeKey).toLowerCase())
+}
+/** 该 shape 目前是否位于某个隔间内（沿父链向上找） */
+export function isInsideAnyCompartment(shapes: Shape[], s?: Shape | null): boolean {
+  if (!s) return false
+  let p = shapes.find(x => x.id === s.parenShapeId) || null
+  while (p) {
+    if (isCompartment(p)) return true
+    const parentId = p.parenShapeId
+    p = shapes.find(x => x.id === parentId) || null
+  }
+  return false
+}
+/** 该 shape 目前是否允许被当做“父容器” */
+export function allowAsParent(shapes: Shape[], s: Shape): boolean {
+  // 规则：在隔间里的任何元素都不能当父容器；隔间本身是否允许当父由你现有逻辑决定
+  return !isInsideAnyCompartment(shapes, s)
+}
+const MIN_CHILD_AREA = 8
+export function clampCompartmentResize(
+  shapes: Shape[],
+  parent: Shape,
+  next: { x: number; y: number; width: number; height: number },
+  handle: "nw" | "ne" | "sw" | "se"
+) {
+  const pb = parent.bounds!
+  const headerH = readHeaderH(parent)
+  const contentH = readContentH(parent)
+
+  // 常量与顶区计算保持一致
+  const minTopSpace = headerH + DIVIDER + contentH + INSET
+  // 仅用于 bottom 方向最小高度的约束（子区至少预留 MIN_CHILD_AREA）
+  const minHeightIfNeed = minTopSpace + MIN_CHILD_AREA + INSET
+
+  // 顶部 handle：nw / ne（保持你原逻辑）
+  if (handle === 'nw' || handle === 'ne') {
+    // children 顶 = next.y + minTopSpace
+    let nextChildrenTop = next.y + minTopSpace
+
+    // 现有“非隔间”的子（避免子又是隔间的情况）
+    const kids = shapes.filter(
+      k => k.parenShapeId === parent.id && k.bounds && k.id !== parent.id && k.shapeKey !== 'EnterpriseGoal'
+    )
+    const minChildTop = kids.length ? Math.min(...kids.map(k => (k.bounds!.y ?? 0))) : Infinity
+
+    // 不把 children 顶压过现有子元素
+    if (minChildTop !== Infinity && nextChildrenTop > minChildTop) {
+      const delta = nextChildrenTop - minChildTop
+      // 从上边缩 → 用“回退 y + 增加 height”的方式抵消
+      next.y -= delta
+      next.height += delta
+      // 重新计算 children 顶
+      nextChildrenTop = next.y + minTopSpace
+    }
+
+    // 顶部基础高度不能被压没（至少保留 minTopSpace）
+    const currentTopSpace = (nextChildrenTop - next.y)
+    if (currentTopSpace < minTopSpace) {
+      const need = (minTopSpace - currentTopSpace)
+      next.y -= need
+      next.height += need
+    }
+
+    // 预留最小 children 区高度
+    if (next.height < minHeightIfNeed) {
+      const need = (minHeightIfNeed - next.height)
+      next.y -= need
+      next.height += need
+    }
+
+    // 防御
+    if (next.width < 1) next.width = 1
+    if (next.height < 1) next.height = 1
+    return next
+  }
+
+  // 底部 handle：sw / se
+  // 仅当“没有任何子元素”时，才需要预留头部+内容区+最小子区高度
+  if (handle === 'sw' || handle === 'se') {
+    const hasAnyChild = shapes.some(k => k.parenShapeId === parent.id && k.id !== parent.id)
+    if (!hasAnyChild) {
+      // 从底部缩放不改 y，只限制最小高度
+      if (next.height < minHeightIfNeed) {
+        next.height = minHeightIfNeed
+      }
+      if (next.width < 1) next.width = 1
+      if (next.height < 1) next.height = 1
+      return next
+    }
+    // 有子元素时，不特殊处理（保持原有行为）
+    if (next.width < 1) next.width = 1
+    if (next.height < 1) next.height = 1
+    return next
+  }
+
+  // 其他（理论上不会到这，兜底）
+  return next
+}
+// 根据 shape 的几何与量测到的头/内容高度
+export function buildZones(shape: Shape, m?: { headerH: number; contentH: number }) {
+  // 规范化父边界
+  const b = shape.bounds ?? { x: 0, y: 0, width: 0, height: 0 }
+  const bx = Number(b.x ?? 0)
+  const by = Number(b.y ?? 0)
+  const bwidth = Number(b.width ?? 0)
+  const bheight = Number(b.height ?? 0)
+  // 输入的量测高度（header / content），优先使用入参，其次读 meta 兜底 
+  const headerH = m?.headerH ?? Number(shape.meta?.headerH) ?? 0
+  const contentH = m?.contentH ?? Number(shape.meta?.contentH) ?? 0
+  //布局常量（与视觉设计保持一致）
+  const DIVIDER = 1  // 头部与内容区之间的分隔线高度
+  const INSET = 6  // childrenArea 左右内边距（避免贴边）
+  const PAD_TOP = 6  // childrenArea 顶部留白（与内容区分隔）
+  // 头部区域：从父容器顶部开始，占用 headerH 高度
+  const header = { x: bx, y: by, width: bwidth, height: headerH }
+  // 内容区域：紧随 header，下方预留 DIVIDER 作为分隔
+  const content = { x: bx, y: by + headerH + DIVIDER, width: bwidth, height: contentH }
+  // 子元素可放置区：在内容区下方再留 PAD_TOP 顶部留白
+  const childrenAreaTop = by + headerH + DIVIDER + contentH + PAD_TOP
+  const childrenArea = {
+    x: bx + INSET,
+    y: childrenAreaTop,
+    width: Math.max(0, bwidth - INSET * 2),
+    height: Math.max(0, by + bheight - INSET - childrenAreaTop)
+  }
+  // 父容器整体边界（用于统一判定“放不下时扩父”等逻辑）
+  const parentBounds = { x: bx, y: by, width: bwidth, height: bheight }
+  return { header, content, childrenArea, parentBounds }
+}
+/** 运行时数组：不存在就建出来 */
+function ensureComparentsArray(parent: Shape): CompartmentRecord[] {
+  const any = parent as any
+  if (!Array.isArray(any.comparents)) {
+    any.comparents = [emptyRecord(parent)]
+  } else if (any.comparents.length === 0) {
+    any.comparents = [emptyRecord(parent)]
+  } else if (!isRecord(any.comparents[0])) {
+    // 兼容：若是旧结构（如 Shape[] 或奇怪内容），迁移成新结构
+    any.comparents = migrateUnknownComparentsToRecords(any.comparents, parent)
+  }
+  return any.comparents as CompartmentRecord[]
+}
+
+/** 持久化字符串：不存在就设为空字符串 */
+function ensureComparentsJSON(parent: Shape): string {
+  const any = parent as any
+  if (typeof any.comparentsJSON !== 'string') any.comparentsJSON = ''
+  return any.comparentsJSON as string
+}
+
+/** 生成“可持久化”的 Shape 快照（去除会导致循环/膨胀的字段） */
+function makePersistableSnapshot(s: Shape): Shape {
+  const raw = toRaw(s)
+  const snap = JSON.parse(JSON.stringify(raw))
+  delete (snap as any).comparents
+  delete (snap as any).comparentsJSON
+  // delete (snap as any).showComparents
+  return snap
+}
+
+/** 新建一个空记录（从 parent 初始化 bounds/model 信息） */
+function emptyRecord(parent: Shape): CompartmentRecord {
+  return {
+    bounds: '' as Bounds,
+    modelId: '',
+    modelName: '',
+    comparentShapes: [],
+  }
+}
+
+/** 类型守卫：是否为 CompartmentRecord */
+function isRecord(val: any): val is CompartmentRecord {
+  return !!val && typeof val === 'object' && Array.isArray(val.comparentShapes)
+}
+
+/** 解析旧 JSON 结构或异常值，统一转为 CompartmentRecord[] */
+function parseComparentsJSONCompat(json: string, parent: Shape): CompartmentRecord[] {
+  if (!json) return [emptyRecord(parent)]
+  try {
+    const data = JSON.parse(json)
+
+    // 新结构：数组，首项为 CompartmentRecord
+    if (Array.isArray(data) && data[0] && isRecord(data[0])) {
+      return data as CompartmentRecord[]
+    }
+
+    // 老结构：[{ comparent_shapes: [...] }]
+    if (Array.isArray(data) && data[0] && Array.isArray(data[0].comparent_shapes)) {
+      const rec = emptyRecord(parent)
+      rec.comparentShapes = data[0].comparent_shapes
+      return [rec]
+    }
+
+    // 兜底：非法/未知结构
+    return [emptyRecord(parent)]
+  } catch {
+    return [emptyRecord(parent)]
+  }
+}
+
+/** 将未知的运行时 comparents 迁移为新结构记录数组 */
+function migrateUnknownComparentsToRecords(unknown: any, parent: Shape): CompartmentRecord[] {
+  // 旧运行时可能是 Shape[]
+  if (Array.isArray(unknown) && (unknown.length === 0 || unknown[0]?.id)) {
+    const rec = emptyRecord(parent)
+    rec.comparentShapes = (unknown as Shape[]).map(makePersistableSnapshot)
+    return [rec]
+  }
+  // 其他情况直接兜底空记录
+  return [emptyRecord(parent)]
+}
+
+/** 写回 comparentsJSON（新结构：CompartmentRecord[]） */
+function writeComparentsJSONFromRuntime(
+  parent: Shape,
+  updateShape: (id: string, u: Partial<Shape>) => void
+) {
+  const list = ensureComparentsArray(parent)
+  // 同步父的 bounds / model 信息（保持最新）
+  // list[0].bounds = '' as Bounds
+  list[0].modelId = ''
+  list[0].modelName = ''
+
+  // 子形状使用快照，避免把 Proxy/循环结构写入
+  const snapped = list[0].comparentShapes.map(makePersistableSnapshot)
+  const next: CompartmentRecord[] = [{
+    ...list[0],
+    comparentShapes: snapped,
+  }]
+  // 同步 showComparents
+  const show = calcShowComparentsFlag({ ...(parent as any), comparents: next } as Shape)
+  updateShape(parent.id, {
+    comparents: next,
+    comparentsJSON: JSON.stringify(next),
+    showComparents: show,
+  } as any)
+}
+
+// ===================== 对外 API（方法名保持不变） =====================
+
+/** 把运行时 comparents[] 同步到 comparentsJSON（新结构：CompartmentRecord[]） */
+export function syncComparentsJSON(
+  parent: Shape,
+  updateShape: (id: string, u: Partial<Shape>) => void
+) {
+  if (!isCompartment(parent)) return
+  writeComparentsJSONFromRuntime(parent, updateShape)
+}
+
+/** 启动/刷新后：compar entsJSON → 运行时 comparents（新结构） */
+export function hydrateComparentsFromJSON(
+  parent: Shape,
+  updateShape: (id: string, u: Partial<Shape>) => void
+) {
+  if (!isCompartment(parent)) return
+  const json = ensureComparentsJSON(parent)
+  const recs = parseComparentsJSONCompat(json, parent)
+  // 运行时直接等于记录数组
+  updateShape(parent.id, { comparents: recs } as any)
+  // 同步 showComparents
+  const show = calcShowComparentsFlag({ ...(parent as any), comparents: recs } as Shape)
+  updateShape(parent.id, { showComparents: show } as any)
+
+  // 若解析到老结构立刻迁移
+  try {
+    const parsed = JSON.parse(json)
+    if (!(Array.isArray(parsed) && parsed[0] && isRecord(parsed[0]))) {
+      updateShape(parent.id, { comparentsJSON: JSON.stringify(recs) } as any)
+    }
+  } catch {
+    updateShape(parent.id, { comparentsJSON: JSON.stringify(recs) } as any)
+  }
+}
+
+/** 添加一个“整个子 Shape 快照”到 comparents[0].comparentShapes，并同步 JSON */
+export function addChildShapeToCompartment(
+  parent: Shape,
+  child: Shape,
+  updateShape: (id: string, u: Partial<Shape>) => void
+) {
+  if (!isShapeTypeNotInPackageTypes(parent)) return
+
+  const list = ensureComparentsArray(parent)
+  const rec = list[0] || emptyRecord(parent)
+
+  const cid = (child as any)?.id
+  if (!cid) return
+  if (rec.comparentShapes.some(x => x?.id === cid)) return
+  const snap = makePersistableSnapshot(child)
+    //被加入隔间的“子快照”一律 false（它不是隔间）
+    ; (snap as any).showComparents = false
+
+  rec.comparentShapes = [...rec.comparentShapes, snap]
+  list[0] = rec
+
+  updateShape(parent.id, { comparents: list } as any)
+  updateShape(parent.id, { showComparents: true } as any)
+  writeComparentsJSONFromRuntime(parent, updateShape)
+}
+
+/** 从 comparents[0].comparentShapes 移除一个子（按 id），并同步 JSON */
+export function removeChildShapeFromCompartment(
+  parent: Shape,
+  child: Shape,
+  updateShape: (id: string, u: Partial<Shape>) => void
+) {
+  if (!isShapeTypeNotInPackageTypes(parent)) return
+
+  const list = ensureComparentsArray(parent)
+  const rec = list[0] || emptyRecord(parent)
+
+  const cid = (child as any)?.id
+  if (!cid) return
+
+  const nextChildren = rec.comparentShapes.filter(x => x?.id !== cid)
+  if (nextChildren.length === rec.comparentShapes.length) return
+
+  rec.comparentShapes = nextChildren
+  list[0] = rec
+
+  updateShape(parent.id, { comparents: list } as any)
+  const show = nextChildren.length > 0
+  updateShape(parent.id, { showComparents: show } as any)
+  writeComparentsJSONFromRuntime(parent, updateShape)
+}
+
+/** 兜底：按 parenShapeId 重建 comparents[0].comparentShapes（启动/恢复后） */
+export function rebuildAllCompartmentChildrenAsShapes(
+  shapes: Shape[],
+  updateShape: (id: string, u: Partial<Shape>) => void
+) {
+  for (const p of shapes) {
+    if (!isShapeTypeNotInPackageTypes(p)) continue
+
+    const children = shapes.filter(ch => ch.parenShapeId === p.id)
+    const snaps = children.map(makePersistableSnapshot)
+
+    // 运行时：确保有记录，再覆盖其 comparentShapes
+    const list = ensureComparentsArray(p)
+    const rec = list[0] || emptyRecord(p)
+    rec.modelId = ''
+    rec.modelName = ''
+    rec.comparentShapes = snaps
+    list[0] = rec
+
+    updateShape(p.id, { comparents: list } as any)
+    updateShape(p.id, { comparentsJSON: JSON.stringify(list) } as any)
+    updateShape(p.id, { showComparents: snaps.length > 0 } as any)
+  }
+}
+
+
+// 同步comparentShapes中的数据到shapes当中
+export function syncComparentShapesIntoRuntime(input: Shape[]): Shape[] {
+  // 先用 Map 去重并保留传入的最新实体
+  const byId = new Map<string, Shape>()
+  for (const s of input) byId.set(s.id, _.cloneDeep(s))
+
+  for (const parent of input) {
+    const comps = (parent as any)?.comparents
+    if (!Array.isArray(comps)) continue
+
+    for (const rec of comps) {
+      const children = Array.isArray(rec?.comparentShapes) ? rec.comparentShapes : []
+      for (const snap of children as any[]) {
+        if (!snap || !snap.id) continue
+        const child = _.cloneDeep(snap)
+
+        // 确保父子与画布归属
+        if (!child.parenShapeId) child.parenShapeId = parent.id
+        if (!child.diagramId) child.diagramId = parent.diagramId
+
+        // Upsert：已存在则合并（以后端快照为主，但保留已有 bounds/style 的结构）
+        const existed = byId.get(child.id)
+        if (existed) {
+          byId.set(child.id, {
+            ...existed,
+            ...child,
+            bounds: child.bounds ? { ...(existed as any).bounds, ...child.bounds } : existed.bounds,
+            style: child.style ? { ...((existed as any).style || {}), ...child.style } : existed.style,
+          } as Shape)
+        } else {
+          byId.set(child.id, child as Shape)
+        }
+      }
+    }
+  }
+  //  统一修正 showComparents
+  for (const s of byId.values()) {
+    if (isShapeTypeNotInPackageTypes(s)) {
+      ; (s as any).showComparents = calcShowComparentsFlag(s)
+    } else {
+      ; (s as any).showComparents = false
+    }
+  }
+
+  return Array.from(byId.values())
+}
+//处理showComparents字段
+function calcShowComparentsFlag(parent: Shape): boolean {
+  if (!isShapeTypeNotInPackageTypes(parent)) return false
+  const comps = (parent as any)?.comparents
+  if (!Array.isArray(comps) || comps.length === 0) return false
+  const rec = comps[0]
+  return Array.isArray(rec?.comparentShapes) && rec.comparentShapes.length > 0
+}