Finish report issue page
This commit is contained in:
parent
50f07bb32c
commit
60d6aa50fa
31
src/lib/navigation/done.svelte
Normal file
31
src/lib/navigation/done.svelte
Normal file
@ -0,0 +1,31 @@
|
|||||||
|
<div id="container">
|
||||||
|
<p id="tick">✔</p>
|
||||||
|
<p>Done</p>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<style>
|
||||||
|
#tick {
|
||||||
|
font-size: 45px;
|
||||||
|
margin: 0;
|
||||||
|
padding: 0;
|
||||||
|
}
|
||||||
|
#container {
|
||||||
|
position:fixed;
|
||||||
|
top:50%;
|
||||||
|
left:50%;
|
||||||
|
transform:translate(-50%,-50%);
|
||||||
|
margin:auto;
|
||||||
|
background-color:var(--overlay-color);
|
||||||
|
border-radius:15px;
|
||||||
|
padding:20px;
|
||||||
|
padding-bottom:1px;
|
||||||
|
min-width:90px;
|
||||||
|
max-width:90px
|
||||||
|
}
|
||||||
|
p {
|
||||||
|
padding-top:0px;
|
||||||
|
font-weight:bolder;
|
||||||
|
overflow-wrap:normal;
|
||||||
|
color: white;
|
||||||
|
}
|
||||||
|
</style>
|
@ -4,9 +4,12 @@
|
|||||||
import Nav from "$lib/navigation/nav.svelte";
|
import Nav from "$lib/navigation/nav.svelte";
|
||||||
import { onMount } from "svelte";
|
import { onMount } from "svelte";
|
||||||
import Loading from "$lib/navigation/loading.svelte";
|
import Loading from "$lib/navigation/loading.svelte";
|
||||||
|
import Done from "$lib/navigation/done.svelte";
|
||||||
|
|
||||||
const title = "Report Issue";
|
const title = "Report Issue";
|
||||||
let isLoading = false;
|
let isLoading = false;
|
||||||
|
let isDone = false;
|
||||||
|
let isError = false;
|
||||||
|
|
||||||
let reportType = "", reportSubject = "", reportMsg = "", reportCollected
|
let reportType = "", reportSubject = "", reportMsg = "", reportCollected
|
||||||
onMount(async () => {
|
onMount(async () => {
|
||||||
@ -30,7 +33,7 @@
|
|||||||
console.log("SEND DATA REQUESTED")
|
console.log("SEND DATA REQUESTED")
|
||||||
isLoading = true
|
isLoading = true
|
||||||
const formData = JSON.stringify({
|
const formData = JSON.stringify({
|
||||||
labels: [reportType],
|
label: reportType,
|
||||||
subject: reportSubject,
|
subject: reportSubject,
|
||||||
msg: `User Agent: ${reportCollected.userAgent}\n` +
|
msg: `User Agent: ${reportCollected.userAgent}\n` +
|
||||||
`Browser: ${reportCollected.browser}\n` +
|
`Browser: ${reportCollected.browser}\n` +
|
||||||
@ -43,14 +46,28 @@
|
|||||||
const url = `https://owlboard.info/misc/issue`
|
const url = `https://owlboard.info/misc/issue`
|
||||||
const options = {
|
const options = {
|
||||||
method: "POST",
|
method: "POST",
|
||||||
|
headers: {
|
||||||
|
"Content-Type": "application/json"
|
||||||
|
},
|
||||||
body: formData
|
body: formData
|
||||||
}
|
}
|
||||||
const res = await fetch(url, options)
|
const res = await fetch(url, options)
|
||||||
console.log(formData)
|
if (res.status == 200) {
|
||||||
|
isLoading = false;
|
||||||
|
isDone = true;
|
||||||
|
await new Promise(r => setTimeout(r, 2000));
|
||||||
|
window.location.href = "/";
|
||||||
|
} else {
|
||||||
|
isLoading = false;
|
||||||
|
isError = true;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
async function cancel() {
|
async function cancel() {
|
||||||
preFlight = false;
|
preFlight = false;
|
||||||
|
isLoading = false;
|
||||||
|
isDone = false;
|
||||||
|
isError = false;
|
||||||
}
|
}
|
||||||
|
|
||||||
</script>
|
</script>
|
||||||
@ -60,13 +77,18 @@
|
|||||||
<Loading />
|
<Loading />
|
||||||
{/if}
|
{/if}
|
||||||
|
|
||||||
{#if !preFlight}
|
{#if isDone}
|
||||||
|
<Done />
|
||||||
|
{/if}
|
||||||
|
|
||||||
|
{#if !preFlight && !isDone}
|
||||||
<p>Any data that you enter here will be visible publicly
|
<p>Any data that you enter here will be visible publicly
|
||||||
<a href="https://git.fjla.uk/OwlBoard/backend/issues" target="_blank">here</a>
|
<a href="https://git.fjla.uk/OwlBoard/backend/issues" target="_blank">here</a>
|
||||||
</p>
|
</p>
|
||||||
<p>You will be shown all of the collected data before the form is submitted.</p>
|
<p>You will be shown all of the collected data before the form is submitted.</p>
|
||||||
<form on:submit={submit}>
|
<form on:submit={submit}>
|
||||||
<select class="formInputs" name="type" bind:value={reportType} placeholder="Choose Category">
|
<select class="formInputs" name="type" bind:value={reportType} placeholder="Choose Category">
|
||||||
|
<option value="" disabled selected>Choose an Issue Type</option>
|
||||||
<option value="bug">Problem</option>
|
<option value="bug">Problem</option>
|
||||||
<option value="enhancement">Feature Request</option>
|
<option value="enhancement">Feature Request</option>
|
||||||
<option value="question">Question</option>
|
<option value="question">Question</option>
|
||||||
|
Loading…
Reference in New Issue
Block a user