lfk/selfservice
3
0
Fork 0
Code Issues Pull Requests Actions Projects Releases Wiki Activity

Added confirmation for profile deletion

Browse Source
This commit is contained in:
Nicolai Ort
2021-04-01 19:31:19 +02:00
parent fc04e71311
commit 85b0549a11
1 changed files with 100 additions and 47 deletions
Download Patch File Download Diff File Expand all files Collapse all files

147
src/views/Profile.vue
View File

@@ -12,53 +12,105 @@
<p class="text-md whitespace-nowrap">{{ state.group }}</p>
</div>
<div class="inline-flex md:ml-auto md:mr-0 mx-auto items-center">
<button
type="button"
class="focus:border-black focus:ring-2 focus:ring-black text-white text-sm py-2.5 px-5 rounded-md bg-blue-500 hover:bg-blue-600 hover:shadow-lg"
>
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
class="feather feather-download"
style="display: inline;height: 1rem;vertical-align: sub;"
<div v-if="(state.delete_active === false)">
<button
type="button"
class="focus:border-black focus:ring-2 focus:ring-black text-white text-sm py-2.5 px-5 rounded-md bg-blue-500 hover:bg-blue-600 hover:shadow-lg"
>
<path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" />
<polyline points="7 10 12 15 17 10" />
<line x1="12" y1="15" x2="12" y2="3" />
</svg>
{{ $t('download_certificate') }}
</button>
<button
type="button"
class="focus:border-black focus:ring-2 focus:ring-black text-white text-sm py-2.5 px-5 rounded-md bg-red-600 hover:bg-red-700 hover:shadow-lg ml-1"
@click="delete_me"
>
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
class="feather feather-download"
style="display: inline;height: 1rem;vertical-align: sub;"
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
class="feather feather-download"
style="display: inline;height: 1rem;vertical-align: sub;"
>
<path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" />
<polyline points="7 10 12 15 17 10" />
<line x1="12" y1="15" x2="12" y2="3" />
</svg>
{{ $t('download_certificate') }}
</button>
<button
type="button"
class="focus:border-black focus:ring-2 focus:ring-black text-white text-sm py-2.5 px-5 rounded-md bg-red-600 hover:bg-red-700 hover:shadow-lg ml-1"
@click="() => { state.delete_active = true }"
>
<path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" />
<polyline points="7 10 12 15 17 10" />
<line x1="12" y1="15" x2="12" y2="3" />
</svg>
{{ $t('delete-all-of-my-data') }}
</button>
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
class="feather feather-download"
style="display: inline;height: 1rem;vertical-align: sub;"
>
<path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" />
<polyline points="7 10 12 15 17 10" />
<line x1="12" y1="15" x2="12" y2="3" />
</svg>
{{ $t('delete-all-of-my-data') }}
</button>
</div>
<div v-if="(state.delete_active === true)">
<button
type="button"
class="focus:border-black focus:ring-2 focus:ring-black text-white text-sm py-2.5 px-5 rounded-md bg-blue-500 hover:bg-blue-600 hover:shadow-lg"
@click="() => { state.delete_active = false }"
>
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
class="feather feather-download"
style="display: inline;height: 1rem;vertical-align: sub;"
>
<path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" />
<polyline points="7 10 12 15 17 10" />
<line x1="12" y1="15" x2="12" y2="3" />
</svg>
Cancel, keep my data
</button>
<button
type="button"
class="focus:border-black focus:ring-2 focus:ring-black text-white text-sm py-2.5 px-5 rounded-md bg-red-600 hover:bg-red-700 hover:shadow-lg ml-1"
@click="delete_me"
>
<svg
xmlns="http://www.w3.org/2000/svg"
width="24"
height="24"
viewBox="0 0 24 24"
fill="none"
stroke="currentColor"
stroke-width="2"
stroke-linecap="round"
stroke-linejoin="round"
class="feather feather-download"
style="display: inline;height: 1rem;vertical-align: sub;"
>
<path d="M21 15v4a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2v-4" />
<polyline points="7 10 12 15 17 10" />
<line x1="12" y1="15" x2="12" y2="3" />
</svg>
Confirm, delete all of my data
</button>
</div>
</div>
</div>
</section>
@@ -202,6 +254,7 @@ const state = reactive({
scans: [],
group: "",
activetab: "profile",
delete_active: false,
})
const toast = useToast();
const props = defineProps({
@@ -230,10 +283,10 @@ axios.get(`${config.baseurl}api/runners/me/${accesstoken}/scans`)
}).catch((error) => {
toast.error("An error occured while loading your profile data");
})
function delete_me () {
function delete_me() {
toast("deletion in progress...");
const browserlocale = ((navigator.languages && navigator.languages[0]) || '').substr(0, 2);
let url = `${config.baseurl}api/runners/me/${accesstoken}?force=true`
let url = `${config.baseurl}api/runners/me/${accesstoken}?force=true`
axios.delete(url)
.then(() => {
location.replace(`${config.baseurl_selfservice}`);