/*
 * This file is part of the kernelstudio package.
 *
 * (c) 2014-2026 zlin <admin@kernelstudio.com>
 *
 * For the full copyright and license information, please view the LICENSE file
 * that was distributed with this source code.
 */

import type { GraphRect, GraphTaskElement } from '../graph';
import { generateKey } from '@/utils/strings';
import type { PlatformWithComponents } from './types';

export const createGraphTaskElementFromScenario = (
  platform: PlatformWithComponents,
  rect?: GraphRect,
): GraphTaskElement => {
  let realRect = { width: 120, height: 80, x: 0, y: 0, ...rect || {} };
  console.info('rect', rect);
  return {
    id: 0,
    key: generateKey(),
    type: 'scenario',
    name: platform.name,
    platformId: platform.id,
    scenarioId: platform.scenarioId,
    components: platform.components ?? [],
    template: 0,
    templateType: null,
    category: null,
    group: null,
    description: platform.description,
    order: 0,
    position: {
      x: realRect.x ?? 0,
      y: realRect.y ?? 0,
    },
    width: realRect.width,
    height: realRect.height,
    inputs: null,
    outputs: null,
    parameters: [],
    variables: [],
  } as GraphTaskElement;
};

const portsGroups = {
  in: {
    position: 'left', // 入桩在左侧
    attrs: {
      circle: {
        r: 6,
        magnet: 'passive', // 被动吸附（仅作为连线目标）
        stroke: '#5da1df',
        strokeWidth: 2,
        fill: '#fff',
      },
    },
  },
  out: {
    position: 'right', // 出桩在右侧
    attrs: {
      circle: {
        r: 6,
        magnet: 'active', // 主动吸附（作为连线源）
        stroke: '#5da1df',
        strokeWidth: 2,
        fill: '#5da1df',
      },
    },
  },
};

export const createGraphScenarioElement = (element: GraphTaskElement): any => {
  let realHeight = 120;
  let width: number = 250;
  if (!realHeight) {
    realHeight = 120;
  }
  if(element?.components){
    if(element?.components?.length > 2){
      realHeight = 90 + element?.components?.length * 25
    } else if(element?.components?.length <=1){
      realHeight = 120
    }
  }

  // const portsItems = (element.components || []).map((comp, index) => {
  //   const compId = comp.id || index;
  //   return [
  //     // 入桩（对应 DOM: data-port="in-${compId}"）
  //     {
  //       id: `in-${compId}`, // portId 必须和 DOM 的 data-port 一致
  //       group: 'in',
  //       data: comp, // 直接存储 port 数据，避免后续解析 DOM
  //     },
  //     // 出桩（对应 DOM: data-port="out-${compId}"）
  //     {
  //       id: `out-${compId}`,
  //       group: 'out',
  //       data: comp,
  //     },
  //   ];
  // }).flat(); // 扁平化数组

  return {
    shape: 'scenario',
    id: element.key,
    position: {
      x: element.position?.x || 0,
      y: element.position?.y || 0,
    },
    size: {
      width: width,
      height: realHeight,
    },
    attrs: {
      label: {
        text: element.name,
      },
    },
    data: element,
    // ports: {
    //   groups: portsGroups,
    //   items: portsItems,
    // },
  };
};