<script setup>

import router from '@/router/index.js'

const addMerch = async () => {
  router.push({ name: 'collection' })
}

</script>

<template>
  <n-card title="Add merch">
    <n-form>
      <n-divider title-placement="left">Main</n-divider>
      <div class="mb-20">
        <h3>Name</h3>
        <n-input class="mt-10" clearable placeholder="Name" />
      </div>

      <n-divider title-placement="left">Origins</n-divider>
      <div>
        <h3>Surugaya</h3>
        <n-input class="mt-10" clearable placeholder="Link" />
        <n-input class="mt-10" clearable placeholder="Cookie values" />
      </div>

      <div>
        <h3>Mandarake</h3>
        <n-input class="mt-10" clearable placeholder="Link" />
      </div>

      <div class="mt-10 c-center">
        <n-button class="w360" type="primary" @click="addMerch">Add</n-button>
      </div>
    </n-form>
  </n-card>
</template>

<style scoped></style>
