import { IsNotEmpty, IsOptional, IsString } from 'class-validator';

export class TemplateOrderData {
  @IsNotEmpty()
  @IsString()
  project: string;

  @IsNotEmpty()
  @IsString()
  screenScene: string;

  @IsNotEmpty()
  @IsString()
  screenSceneTop: string;

  @IsNotEmpty()
  profile: any;

  @IsNotEmpty()
  innerprice: string;

  @IsString()
  comment: string;

  @IsOptional()
  order?: any[];

  @IsOptional()
  montage?: { rate_chf: number; total_hours: number };

  @IsOptional()
  planung?: { rate_chf: number; total_hours: number };

  @IsOptional()
  colors?: { label: string; name: string }[];

  @IsOptional()
  totalPrice?: number;
}

export class TemplateEmailData {
  @IsNotEmpty()
  @IsString()
  firstName: string;

  @IsNotEmpty()
  @IsString()
  lastName: string;

  @IsNotEmpty()
  @IsString()
  email: string;

  @IsNotEmpty()
  @IsString()
  phone: string;

  @IsNotEmpty()
  @IsString()
  postcode: string;

  @IsOptional()
  location: any;
}

export const TemplateOrderMail = (data: TemplateOrderData, baseUrl: string) => {
  const origin = baseUrl.replace(/\/+$/, '');
  const projectLink = data.project
    ? `<p>Ihr Projekt jederzeit weiter bearbeiten: <a href="${origin}/?project=${data.project}">${origin}/?project=${data.project}</a></p>`
    : '';

  return `
      <p>Guten Tag</p>
      <p>Herzlichen Dank für Ihr Interesse an unseren Überdachungslösungen. Als erfahrener Anbieter von Überdachungslösungen freuen wir uns sehr über Ihr Interesse an unseren Produkten. Wir haben Ihre Anfrage erhalten und werden uns schnellstmöglich mit Ihrem Design auseinandersetzen.</p>
      <p>Hiermit erhalten Sie den unverbindlichen Richtpreis sowie eine Ansicht Ihres Designs. Falls Sie noch weitere Fragen haben oder Änderungen wünschen, können Sie uns gerne jederzeit kontaktieren. Wir stehen Ihnen mit Rat und Tat zur Seite und freuen uns darauf, Ihnen schon bald Ihre individuelle Überdachungslösung präsentieren zu dürfen.<p>
      <p>${data.innerprice}</p>
      <p>ein Kommentar: ${data.comment}</p>
      ${projectLink}
      <p>Beratungstermin gleich reservieren:</p>
      <p> <a href="https://outlook.office365.com/owa/calendar/ThermogreenAG1@thermogreen.ch/bookings/">Online-Termin</a>oder <a href="tel:+41448506769">+41 44 850 67 69</a> </p>
      <p>Seit über 30 Jahren sind wir führende Anbieter von Sonnen- und Wetterschutzlösungen in der Schweiz und transformieren Ideen, Wünsche und Vorstellungen von unseren Kunden in massgeschneiderte Konzepte. Mit unseren hochwertigen Glas- und Lamellendächern schaffen wir einzigartige Lieblingsplätze und Freiräume auf Terrassen und in Gärten. Hingucker in jeder Hinsicht!</p>
      <p>Dürfen wir auch für Sie einen Lieblingsplatz planen und bauen? Wir sind auf Ihr Projekt gespannt und freuen uns von Ihnen zu hören.</p>
      <p>Freundliche Grüsse</p>
      <p>Ihr Thermogreen Team</p>
  
   `;
};

export const TemplateOrderMail2 = (data: TemplateOrderData, baseUrl: string) => {
  const origin = baseUrl.replace(/\/+$/, '');
  const projectLink = data.project
    ? `<p>Projekt öffnen: <a href="${origin}/?project=${data.project}">${origin}/?project=${data.project}</a></p>`
    : '';

  return `
    <p>Anfrage erhalten!</p>
    <p>Sie können sich unter <a href="${origin}">${origin}</a>  erneuert einloggen um Ihre Konfigurationen zu bearbeiten.<p>
    ${projectLink}
    <p>
      <table style="width: 100%; display: flex">

      <tr style="display: flex">
        <th style=" text-align: left; font-weight: 300;">Adresse:</th>
      </tr>
      <tr style="display: flex;">
          <th style=" font-weight: 300;  text-align: left"> ${
            data?.profile?.firstName ? data?.profile?.firstName : '-'
          }</th>
          <th style="font-weight: 300; text-align: left"> ${
            data?.profile?.lastName ? data?.profile?.lastName : '-'
          }</th>
        </tr>
        <tr style="display: flex;">
          <th style=" font-weight: 300; text-align: left"> ${
            data?.profile?.street ? data?.profile?.street : '-'
          }  ${data?.profile?.stNumber ? data?.profile?.stNumber : '-'}</th>
        </tr>
        <tr style="display: flex; font-weight: 300;">
          <th style=" font-weight: 300; text-align: left"> ${
            data?.profile?.postcode ? data?.profile?.postcode : '-'
          } ${data?.profile?.location ? data?.profile?.location : '-'}</th>
        </tr>
      </table>
    <p>
    <p>
      <table>
        <tr style="display: flex;">
          <th style="  font-weight: 300; text-align: left">Email:</th>
          <th style="  font-weight: 300; text-align: left"> ${
            data?.profile?.email ? data?.profile?.email : '-'
          }</th>
        </tr>
          <tr style="display: flex;">
          <th style="  font-weight: 300; text-align: left">Telefon:</th>
          <th style=" font-weight: 300; text-align: left"> ${
            data?.profile?.phone ? data?.profile?.phone : '-'
          }</th>
        </tr>
      </table>
    </p>
    <p>ein Kommentar: ${data?.comment ? data?.comment : '-'}</p>
  `;
};