<script lang='ts' setup>
import useLoginAndDownload from '../../useLoginAndDownload'

const { onSubmitRequest } = useLoginAndDownload()
</script>

<template>
  <div>
    <div class="custom-title-font text-24px fw-800 text-#333 mb-10px">
      Submit Catalog Request
    </div>
    <div class="text-14px text-#1A1A1A lh-22px mb-22px">
      You are requesting the catalog with your EJET Spark account below.
    </div>
    <div class="flex flex-col gap-20px">
      <div class="flex py-15px px-35px b-rd-10px b-#D8D8D b-1px b-solid cursor-pointer hover:b-#9B6CFF">
        <!-- 获取首字母 -->
        <div class="w-50px h-50px bg-#F2E5F2 text-#9B6CFF text-24px flex justify-center b-rd-50% items-center mr-28px">
          E
        </div>
        <div>
          <div class="text-18px fw-bold text-#333 custom-title-font">
            EJET Spark
          </div>
          <div class="text-#9B6CFF mt-8px">
            spark@ejet.com
          </div>
        </div>
      </div>
    </div>
    <el-button
      class="!w-full !h-50px mt-24px !text-16px !fw-500 !b-rd-10px !bg-#9B6CFF !text-#fff"
      @click="onSubmitRequest"
    >
      Request Catalog
    </el-button>
  </div>
</template>

<style lang='less' scoped>
::v-deep(.login-input) {
   .el-input__wrapper{
    border-radius: 10px;
   }
}
</style>
