116 lines
3.1 KiB
Vue
116 lines
3.1 KiB
Vue
|
<script setup>
|
||
|
|
const mail = useMail()
|
||
|
|
|
||
|
|
const info = reactive({
|
||
|
|
title: undefined,
|
||
|
|
slug: undefined,
|
||
|
|
url: undefined,
|
||
|
|
icon: undefined,
|
||
|
|
desc: undefined,
|
||
|
|
docs: undefined,
|
||
|
|
repo: undefined,
|
||
|
|
owner: undefined,
|
||
|
|
email: undefined,
|
||
|
|
test: undefined,
|
||
|
|
sent: false
|
||
|
|
})
|
||
|
|
|
||
|
|
const submit = async() => {
|
||
|
|
|
||
|
|
let details = `
|
||
|
|
|
||
|
|
Website added from 'Submit Site' page
|
||
|
|
|
||
|
|
---
|
||
|
|
title: ${ info.title }
|
||
|
|
slug: ${ info.slug }
|
||
|
|
icon: ${ info.icon }
|
||
|
|
description: ${ info.desc }
|
||
|
|
offline: false
|
||
|
|
handshake:
|
||
|
|
url: ${ info.url }
|
||
|
|
docs: ${ info.docs }
|
||
|
|
repo: ${ info.repo }
|
||
|
|
owner: ${ info.owner }
|
||
|
|
priority:
|
||
|
|
---
|
||
|
|
|
||
|
|
Reply to me please: ${ email }
|
||
|
|
|
||
|
|
`
|
||
|
|
|
||
|
|
if (info.test === undefined) {
|
||
|
|
mail.send({
|
||
|
|
from: 'submit@hns.ws',
|
||
|
|
subject: info.title + ' - Site Submission',
|
||
|
|
text: details,
|
||
|
|
})
|
||
|
|
|
||
|
|
info.sent = true
|
||
|
|
}
|
||
|
|
}
|
||
|
|
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<template>
|
||
|
|
<div class="submit">
|
||
|
|
|
||
|
|
<ContentDoc class="content" />
|
||
|
|
|
||
|
|
<!-- Submit form -->
|
||
|
|
<form v-if="!info.sent" :state="info" @submit.prevent="onSubmit">
|
||
|
|
<div class="group">
|
||
|
|
<label for="title">Title</label>
|
||
|
|
<input v-model="info.title" id="title" type="text" placeholder="Awesome Website" required="true" />
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="group">
|
||
|
|
<label for="slug">Slug</label>
|
||
|
|
<input v-model="info.slug" id="slug" type="text" placeholder="awesome" required="true" />
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="group">
|
||
|
|
<label for="url">URL</label>
|
||
|
|
<input v-model="info.url" id="url" type="text" placeholder="https://awesome/" required="true" />
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="group">
|
||
|
|
<label for="icon">Icon<sub>(optional)</sub></label>
|
||
|
|
<input v-model="info.icon" id="icon" type="text" placeholder="some.jpg" />
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="group desc">
|
||
|
|
<label for="desc">Description<sub>(optional)</sub></label>
|
||
|
|
<textarea v-model="info.desc" id="desc" placeholder="Short description of website and services offered" ></textarea>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="group">
|
||
|
|
<label for="docs">Documentation<sub>(optional)</sub></label>
|
||
|
|
<input v-model="info.docs" id="docs" type="text" placeholder="https://docs.awesome/" />
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="group">
|
||
|
|
<label for="repo">Git Repo<sub>(optional)</sub></label>
|
||
|
|
<input v-model="info.repo" id="repo" type="text" placeholder="https://github.com/handsha..." />
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="group">
|
||
|
|
<label for="owner">Website Owner<sub>(optional)</sub></label>
|
||
|
|
<input v-model="info.owner" id="owner" type="text" placeholder="https://twitter.com/awesome_" />
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<div class="group">
|
||
|
|
<label for="email">E-mail<sub>(optional)</sub></label>
|
||
|
|
<input v-model="info.email" id="email" type="email" placeholder="support@awesome.dev" />
|
||
|
|
</div>
|
||
|
|
|
||
|
|
<button @click="submit()" >Submit</button>
|
||
|
|
</form>
|
||
|
|
|
||
|
|
<div class="success" v-if="info.sent">
|
||
|
|
<h4>🎉 Success 🎉</h4>
|
||
|
|
<p>Your website was submitted and will be added soon. If provided, we will email you when added. Thank you for supporting our directory.</p>
|
||
|
|
</div>
|
||
|
|
|
||
|
|
</div>
|
||
|
|
</template>
|