mirror of
https://github.com/grey-cat-1908/formaptix-web.git
synced 2024-09-22 19:21:59 +03:00
Update Profile.vue
This commit is contained in:
parent
ab5766d776
commit
f47e6d1b6a
1 changed files with 58 additions and 3 deletions
|
@ -8,7 +8,7 @@ import { makeAPIRequest } from '@/utils/http'
|
||||||
const authStore = useAuthStore()
|
const authStore = useAuthStore()
|
||||||
const userForms = ref([])
|
const userForms = ref([])
|
||||||
|
|
||||||
import { PhEye, PhPen, PhPencil, PhTrash } from '@phosphor-icons/vue'
|
import {PhEye, PhInfo, PhPen, PhPencil, PhTrash} from '@phosphor-icons/vue'
|
||||||
|
|
||||||
onMounted(async () => {
|
onMounted(async () => {
|
||||||
await authStore.prepareStore()
|
await authStore.prepareStore()
|
||||||
|
@ -50,8 +50,17 @@ async function createForm() {
|
||||||
<template>
|
<template>
|
||||||
<div class="profile" v-if="authStore.isAuthorized">
|
<div class="profile" v-if="authStore.isAuthorized">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<h1 class="profile-title">Управление формами</h1>
|
<h1 class="profile-title">Профиль пользователя</h1>
|
||||||
<button @click="createForm">Создать</button>
|
<div class="profile-ctrl-card">
|
||||||
|
<div class="profile-ctrl-buttons">
|
||||||
|
<button @click="createForm" class="default-button profile-ctrl-btn profile-ctrl-btn--create">Создать форму</button>
|
||||||
|
<!-- <button @click="createForm" class="default-button profile-ctrl-btn profile-ctrl-btn--creat">Очистить все формы</button>-->
|
||||||
|
<button @click="createForm" class="default-button profile-ctrl-btn profile-ctrl-btn--deleteacc">Удалить аккаунт</button>
|
||||||
|
<div class="view-form-info">
|
||||||
|
<PhInfo :size="22" class="view-form-info--sign" /> После удаления аккаунта вернуть данные невозможно
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
<div class="profile-cards">
|
<div class="profile-cards">
|
||||||
<div class="profile-card" v-for="(form, index) in userForms" v-if="userForms.length > 0">
|
<div class="profile-card" v-for="(form, index) in userForms" v-if="userForms.length > 0">
|
||||||
<div class="profile-card-title">
|
<div class="profile-card-title">
|
||||||
|
@ -82,6 +91,52 @@ async function createForm() {
|
||||||
.profile {
|
.profile {
|
||||||
margin: 40px 0;
|
margin: 40px 0;
|
||||||
|
|
||||||
|
&-ctrl {
|
||||||
|
|
||||||
|
&-card {
|
||||||
|
margin-top: 30px;
|
||||||
|
width: 100%;
|
||||||
|
//border: 1px solid var(--color-main-border);
|
||||||
|
//background: var(--color-secondary-background);
|
||||||
|
//padding: 25px;
|
||||||
|
border-radius: 1rem;
|
||||||
|
}
|
||||||
|
|
||||||
|
&-buttons {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
flex-wrap: wrap;
|
||||||
|
gap: 10px 20px;
|
||||||
|
}
|
||||||
|
|
||||||
|
&-btn {
|
||||||
|
//width: 100%;
|
||||||
|
padding: 15px 30px;
|
||||||
|
border-radius: 1rem;
|
||||||
|
|
||||||
|
&:hover {
|
||||||
|
border: 1px solid var(--color-third-border);
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
@media (max-width: 500px) {
|
||||||
|
width: 100%;
|
||||||
|
}
|
||||||
|
|
||||||
|
&--create {
|
||||||
|
color: var(--color-main);
|
||||||
|
|
||||||
|
}
|
||||||
|
|
||||||
|
&--deleteacc {
|
||||||
|
color: var(--color-red);
|
||||||
|
//border: 1px solid var(--color-red);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
&-cards {
|
&-cards {
|
||||||
margin-top: 30px;
|
margin-top: 30px;
|
||||||
display: flex;
|
display: flex;
|
||||||
|
|
Loading…
Reference in a new issue