<script setup>
import {
  TAX_EVALUATION_PERIOD_OPTIONS,
  normalizeTaxEvaluationPeriod
} from "~/composables/useTaxEvaluation"

const auth = useAuthStore()
const defaultFeatures = {
  objects: true,
  calendar: true,
  contacts: true,
  projects: true,
  vehicles: true,
  contracts: true,
  inventory: true,
  accounting: true,
  timeTracking: true,
  planningBoard: true,
  workingTimeTracking: true,
  dashboard: true,
  historyitems: true,
  tasks: true,
  wiki: true,
  files: true,
  createdletters: true,
  documentboxes: true,
  helpdesk: true,
  email: true,
  members: true,
  customers: true,
  vendors: true,
  contactsList: true,
  staffTime: true,
  createDocument: true,
  serialInvoice: true,
  incomingInvoices: true,
  costcentres: true,
  branches: true,
  accounts: true,
  ownaccounts: true,
  banking: true,
  spaces: true,
  customerspaces: true,
  customerinventoryitems: true,
  inventoryitems: true,
  inventoryitemgroups: true,
  products: true,
  productcategories: true,
  services: true,
  servicecategories: true,
  memberrelations: true,
  staffProfiles: true,
  hourrates: true,
  projecttypes: true,
  contracttypes: true,
  plants: true,
  settingsNumberRanges: true,
  settingsEmailAccounts: true,
  settingsBanking: true,
  settingsTexttemplates: true,
  settingsTenant: true,
  export: true,
}
const featureOptions = [
  { key: "dashboard", label: "Dashboard" },
  { key: "historyitems", label: "Logbuch" },
  { key: "tasks", label: "Aufgaben" },
  { key: "planningBoard", label: "Plantafel" },
  { key: "wiki", label: "Wiki" },
  { key: "files", label: "Dateien" },
  { key: "createdletters", label: "Anschreiben" },
  { key: "documentboxes", label: "Boxen" },
  { key: "helpdesk", label: "Helpdesk" },
  { key: "email", label: "E-Mail" },
  { key: "members", label: "Mitglieder" },
  { key: "customers", label: "Kunden" },
  { key: "vendors", label: "Lieferanten" },
  { key: "contactsList", label: "Ansprechpartner" },
  { key: "staffTime", label: "Mitarbeiter: Zeiten" },
  { key: "createDocument", label: "Buchhaltung: Ausgangsbelege" },
  { key: "serialInvoice", label: "Buchhaltung: Serienvorlagen" },
  { key: "incomingInvoices", label: "Buchhaltung: Eingangsbelege" },
  { key: "costcentres", label: "Buchhaltung: Kostenstellen" },
  { key: "branches", label: "Stammdaten: Niederlassungen" },
  { key: "accounts", label: "Buchhaltung: Buchungskonten" },
  { key: "ownaccounts", label: "Buchhaltung: Zusätzliche Buchungskonten" },
  { key: "banking", label: "Buchhaltung: Bank" },
  { key: "spaces", label: "Lagerplätze" },
  { key: "customerspaces", label: "Kundenlagerplätze" },
  { key: "customerinventoryitems", label: "Kundeninventar" },
  { key: "inventoryitems", label: "Inventar" },
  { key: "inventoryitemgroups", label: "Inventargruppen" },
  { key: "products", label: "Stammdaten: Artikel" },
  { key: "productcategories", label: "Stammdaten: Artikelkategorien" },
  { key: "services", label: "Stammdaten: Leistungen" },
  { key: "servicecategories", label: "Stammdaten: Leistungskategorien" },
  { key: "memberrelations", label: "Stammdaten: Mitgliedsverhältnisse" },
  { key: "staffProfiles", label: "Stammdaten: Mitarbeiter" },
  { key: "hourrates", label: "Stammdaten: Stundensätze" },
  { key: "projecttypes", label: "Stammdaten: Projekttypen" },
  { key: "contracttypes", label: "Stammdaten: Vertragstypen" },
  { key: "vehicles", label: "Stammdaten: Fahrzeuge" },
  { key: "projects", label: "Projekte" },
  { key: "contracts", label: "Verträge" },
  { key: "plants", label: "Objekte" },
  { key: "settingsNumberRanges", label: "Einstellungen: Nummernkreise" },
  { key: "settingsEmailAccounts", label: "Einstellungen: E-Mail Konten" },
  { key: "settingsBanking", label: "Einstellungen: Bankkonten" },
  { key: "settingsTexttemplates", label: "Einstellungen: Textvorlagen" },
  { key: "settingsTenant", label: "Einstellungen: Firmeneinstellungen" },
  { key: "export", label: "Einstellungen: Export" },
]

const itemInfo = ref({
  features: {},
  businessInfo: {},
  projectTypes: []
})

const setupPage = async () => {
  itemInfo.value = auth.activeTenantData
  console.log(itemInfo.value)
}

const features = ref({ ...defaultFeatures, ...(auth.activeTenantData?.features || {}) })
const businessInfo = ref(auth.activeTenantData.businessInfo)
const accountChart = ref(auth.activeTenantData.accountChart || "skr03")
const taxEvaluationPeriod = ref(normalizeTaxEvaluationPeriod(auth.activeTenantData.taxEvaluationPeriod))
const accountChartOptions = [
  { label: "SKR 03", value: "skr03" },
  { label: "Verein", value: "verein" }
]

const updateTenant = async (newData) => {

  const res = await useNuxtApp().$api(`/api/tenant/other/${auth.activeTenant}`, {
    method: "PUT",
    body: {
      data: newData,
    }
  })

  if (res) {
    itemInfo.value = res
    auth.activeTenantData = res
    features.value = { ...defaultFeatures, ...(res?.features || {}) }
    taxEvaluationPeriod.value = normalizeTaxEvaluationPeriod(res?.taxEvaluationPeriod)
  }
}
const saveFeatures = async () => {
  await updateTenant({features: features.value})
}

setupPage()
</script>

<template>
  <UDashboardNavbar title="Firmeneinstellungen">

  </UDashboardNavbar>
  <UTabs
      class="p-5"
      :items="[
        {
          label: 'Dokubox'
        },{
          label: 'Rechnung & Kontakt'
        },{
          label: 'Funktionen'
        }
    ]"
  >
    <template #content="{item}">
      <div v-if="item.label === 'Dokubox'">
        <UAlert
            class="mt-5"
            title="DOKUBOX"
            color="neutral"
            variant="outline"
        >
          <template #description>
            <p>Die Dokubox ist eine E-Mail Inbox um deine Anhänge direkt als Dokumente zu importieren. Leite Deine E-Mails einfach an die folgende E-Mail Adresse weiter, diese ist für dein Unternehmen einzigartig. Die E-Mails werden dann alle 5 min abgerufen.</p>
            <br><br>
            <a
                v-if="itemInfo.id"
                :href="`mailto:${itemInfo.dokuboxkey}@fedeo-dokubox.de`"
            >
              {{itemInfo.dokuboxkey}}@fedeo-dokubox.de
            </a>
          </template>
        </UAlert>

      </div>
      <div v-if="item.label === 'Rechnung & Kontakt'">
          <UCard class="mt-5">
            <UForm class="w-1/2">
            <UFormField
                label="Firmenname:"
            >
              <UInput v-model="businessInfo.name"/>
            </UFormField>
            <UFormField
                label="Straße + Hausnummer:"
            >
              <UInput v-model="businessInfo.street"/>
            </UFormField>
            <UFormField
                label="PLZ + Ort"
                class="w-full"
            >
              <InputGroup class="w-full">
                <UInput v-model="businessInfo.zip"/>
                <UInput v-model="businessInfo.city" class="flex-auto"/>
              </InputGroup>
            </UFormField>
            <UButton
                class="mt-3"
                @click="updateTenant({businessInfo: businessInfo})"
            >
              Speichern
            </UButton>
            <UFormField
                label="Kontenrahmen:"
                class="mt-6"
            >
              <USelectMenu
                  v-model="accountChart"
                  :items="accountChartOptions"
                  label-key="label"
                  value-key="value"
              />
            </UFormField>
            <UButton
                class="mt-3"
                @click="updateTenant({accountChart: accountChart})"
            >
              Kontenrahmen speichern
            </UButton>
            <UFormField
                label="USt-Auswertung:"
                class="mt-6"
            >
              <USelectMenu
                  v-model="taxEvaluationPeriod"
                  :items="TAX_EVALUATION_PERIOD_OPTIONS"
                  label-key="label"
                  value-key="value"
              />
            </UFormField>
            <UButton
                class="mt-3"
                @click="updateTenant({taxEvaluationPeriod: taxEvaluationPeriod})"
            >
              Zeitraum speichern
            </UButton>
          </UForm>
        </UCard>

      </div>
      <div v-else-if="item.label === 'Funktionen'">
        <UCard class="mt-5">
          <UAlert
              title="Funktionen ausblenden"
              description="Nur Funktionen mit gesetztem Haken sind im Unternehmen verfügbar. Diese Einstellungen gelten für alle Mitarbeiter und sind unabhängig von Berechtigungen."
              color="error"
              variant="outline"
              class="mb-5"
          />
          <UCheckbox
              v-for="option in featureOptions"
              :key="option.key"
              :label="option.label"
              v-model="features[option.key]"
              @change="saveFeatures"
          />
        </UCard>
      </div>
    </template>
  </UTabs>
</template>

<style scoped>

</style>
