 import { Injectable } from '@angular/core';

// Interfaces
export interface HelpTooltip {
  field: string;
  message: string;
}

export interface GridCell {
  row: number;
  col: number;
  selected: boolean;
}

export type FieldType = 'text' | 'number' | 'select' | 'radio' | 'checkbox' | 'textarea';

export interface FormElementBase {
  id: string;
  name: string;
  label: string;
  required: boolean;
  type: FieldType;
}

export interface SelectElement extends FormElementBase {
  type: 'select' | 'radio';
  options: string[];
}

export interface NumberElement extends FormElementBase {
  type: 'number';
  min: number;
  max: number;
}



export type FormElement =
  | FormElementBase
  | SelectElement
  | NumberElement;

// Servicio
@Injectable({ providedIn: 'root' })
export class HelpService {
  private helpTooltips: HelpTooltip[] = [
    { field: 'formTitle', message: 'Nombre que aparecerá en la parte superior del formulario' },
    { field: 'rows', message: 'Número de filas horizontales en la cuadrícula (máximo 10)' },
    { field: 'columns', message: 'Número de columnas verticales en la cuadrícula (máximo 10)' },
    { field: 'label', message: 'Texto que se mostrará como título del campo' },
    { field: 'fieldId', message: 'Identificador único del campo (se genera automáticamente)' },
    { field: 'fieldName', message: 'Nombre interno del campo para procesar los datos' },
    { field: 'required', message: 'Si está marcado, el usuario debe completar este campo obligatoriamente' },
    { field: 'placeholder', message: 'Texto de ayuda que aparece dentro del campo cuando está vacío' },
    { field: 'minValue', message: 'Valor mínimo permitido para este número' },
    { field: 'maxValue', message: 'Valor máximo permitido para este número' },
    { field: 'pattern', message: 'Formato específico que debe seguir el texto (ejemplo: solo números, solo letras)' },
    { field: 'options', message: 'Lista de opciones disponibles para que el usuario seleccione' },
    { field: 'description', message: 'Descripción adicional o instrucciones para el usuario' },
    { field: 'defaultValue', message: 'Valor que aparecerá por defecto cuando se cargue el formulario' },
    { field: 'textShort', message: 'Campo para escribir texto corto como nombres, títulos, etc.' },
    { field: 'optionsList', message: 'Lista desplegable donde el usuario puede elegir una opción' },
    { field: 'singleSelection', message: 'Botones circulares donde solo se puede seleccionar una opción' },
    { field: 'checkboxField', message: 'Casilla que se puede marcar o desmarcar (Sí/No)' },
    { field: 'textLong', message: 'Campo para escribir texto extenso como comentarios, descripciones, etc.' },
    { field: 'numberField', message: 'Campo que solo acepta números' },
    { field: 'emailField', message: 'Campo especial para direcciones de correo electrónico' },
    { field: 'dateField', message: 'Selector de fecha con calendario' }
  ];

  getHelpMessage(field: string): string {
    return this.helpTooltips.find(t => t.field === field)?.message || '';
  }

  generateGrid(rows: number, cols: number): GridCell[][] {
    return Array(rows).fill(null).map((_, i) =>
      Array(cols).fill(null).map((_, j) => ({
        row: i, col: j, selected: false
      }))
    );
  }

  createElement(type: FieldType): FormElement {
  const baseElement: FormElementBase = {
    id: '',
    name: '',
    label: '',
    required: false,
    type: type,
  };

  switch(type) {
    case 'select':
    case 'radio':
      return { ...baseElement, options: ['Opción 1', 'Opción 2'] } as SelectElement;
    case 'number':
      return { ...baseElement, min: 0, max: 100 } as NumberElement;
    default:
      return baseElement;
  }
}

}
