Коммит de65ee7e создал по автору avathar's avatar avathar
Просмотр файлов

Merge branch 'develop' into 'develop' 

#22 Сделано изменение email в странице профиля

See merge request teknokomo/universo-monorepo!85
владельцы 0fc0295e a1ca2ad3
Скрыть пробелы
Построчно Рядом
universo-frontend/src/components/ChangeEmailDialog.vue 0 → 100644
Просмотр файла @ de65ee7e
<template>
<div>
<q-btn class="color-icons" flat icon="edit" round size="md" @click="showDialog = true">
<q-tooltip class="bg-primary text-white">Изменить</q-tooltip>
</q-btn>
<q-dialog v-model="showDialog" :maximized="!$q.screen.gt.xs" persistent width="380">
<q-card :dark="dark" flat class="main-block-with-cropped relative-position">
<q-btn class="absolute-top-right z-top" flat dense color="red" icon="close" label="" v-close-popup
@click="step === 3 ? onReset() : null" />
<q-card-section horizontal>
<q-item :dark="dark">
<q-item-section>
<q-item-label class="text-h6">Изменение адреса электронной почты</q-item-label>
</q-item-section>
</q-item>
</q-card-section>
<q-card-section>
<q-stepper ref="stepper" v-model="step" :contracted="!$q.screen.gt.xs" :dark="dark" animated color="primary"
flat vertical class="bg-transparent">
<q-step :dark="dark" :done="step > 1" :name="1" :step="1" :title="steps[0].text" icon="settings">
<q-input ref="email" v-model="newEmail" :dark="dark" :rules="emailRules" label="Адрес электронной почты"
outlined></q-input>
</q-step>
<q-step :name="2" :step="2" :title="steps[1].text" icon="settings">
<q-input v-model="confirmCode" :dark="dark" label="Код подтверждения" outlined></q-input>
</q-step>
<q-step :name="3" :step="3" :title="steps[2].text" icon="settings">
</q-step>
<template v-slot:navigation>
<q-stepper-navigation>
<div class="row justify-end" v-if="step < 3">
<q-btn outline color="primary" @click="step === 1 ? sendCode() : sendConfirmCode()">
<template v-slot:default>
<div class="flex no-wrap">
<span>{{
step === 1
? "Изменить почту"
: "Отправить код подтверждения"
}}</span>
<q-icon v-if="!progress" style="margin-left: 0.25rem" color="primary" name="send"></q-icon>
<q-circular-progress v-else style="margin-left: 0.25rem" indeterminate size="28" />
</div>
</template>
</q-btn>
</div>
</q-stepper-navigation>
</template>
<template v-slot:message>
<q-banner v-if="step === 1" :dark="dark" class="q-px-lg bg-transparent">
Введите новый адрес и получите код подтверждения
</q-banner>
<q-banner v-else-if="step === 2" :dark="dark" class="q-px-lg bg-transparent">
Введите код подтверждения отправленный на почту
</q-banner>
<q-banner v-else :dark="dark" class="q-px-lg bg-transparent">
Адрес электронной почты успешно изменен.
</q-banner>
</template>
<!-- оставил заготовку, чтоб можно было двигаться по шагам регистрации
произвольно
<template v-slot:navigation>
<q-stepper-navigation>
<q-btn
:label="step === 4 ? 'Finish' : 'Continue'"
color="primary"
@click="$refs.stepper.next()"
/>
<q-btn
v-if="step > 1"
class="q-ml-sm"
color="primary"
flat
label="Back"
@click="$refs.stepper.previous()"
/>
</q-stepper-navigation>
</template> -->
</q-stepper>
</q-card-section>
</q-card>
</q-dialog>
</div>
</template>
<script>
import { useUiStore } from '../stores/UI';
import { useUsersStore } from '../stores/users';
import { mapActions, mapState } from 'pinia';
export default {
// name: 'ChangeEmailDialog',
components: {},
data() {
return {
dark: false,
progress: false,
showDialog: false,
steps: [
{ step: 1, text: 'Новый адрес' },
{ step: 2, text: 'Код подтверждения' },
{ step: 3, text: 'Адрес изменён' },
],
step: 1,
confirmCode: null,
newEmail: null,
emailRules: [
(v) => !!v || 'Поле обязательно для заполнения',
(v) => /^[^@]+@[^@]+\.[^@]+$/.test(v) || 'Указан некорректный e-mail',
(v) =>
!Object.prototype.hasOwnProperty.call(
this.errors,
'chefaRetposhto'
) || this.errors.chefaRetposhto,
],
errors: {},
};
},
methods: {
...mapActions(useUsersStore, ['changeTelephoneOrEmail']),
sendCode() {
if (!this.newEmail) return;
if (!this.$refs.email.validate()) {
return;
}
const params = {
retposhto: this.newEmail,
};
this.progress = true;
this.changeTelephoneOrEmail(params).then((resp) => {
if (resp.status) {
this.$q.notify({
type: 'positive',
message: resp.message,
});
this.step++;
this.progress = false;
} else {
this.$q.notify({
type: 'negative',
message: resp.message,
});
this.progress = false;
}
});
},
sendConfirmCode() {
if (!this.confirmCode) return;
const params = {
retposhto: this.newEmail,
konfirmaKodo: this.confirmCode,
};
this.progress = true;
this.changeTelephoneOrEmail(params).then((resp) => {
if (resp.status) {
this.$q.notify({
type: 'positive',
message: message,
});
this.step++;
this.progress = false;
} else {
this.$q.notify({
type: 'negative',
message: message,
});
this.progress = false;
}
});
},
onReset() {
this.step = 1;
this.showDialog = false;
},
},
computed: {
...mapState(useUiStore, ['dark']),
},
};
</script>
<style></style>
universo-frontend/src/pages/UserProfilePage.vue
Просмотр файла @ de65ee7e
......@@ -14,8 +14,8 @@
</q-avatar>
</q-item-section>
<q-item-section>
<q-file ref="fileInput" v-model="avatar" accept="image/*" style="display: none"></q-file>
<q-btn outline label="Добавить фото" class="text-capitalize" rounded color="primary"
<!-- <q-file ref="fileInput" v-model="avatar" accept="image/*" style="display: none"></q-file> -->
<q-btn outline label="Добавить фото" class="text-capitalize" color="primary" rounded
style="max-width: 120px" @click="openFileDialog"></q-btn>
</q-item-section>
</q-item>
......@@ -24,11 +24,18 @@
<q-item class="col-lg-6 col-md-6 col-sm-12 col-xs-12">
<q-item-section>
<q-input v-model="user_details.user_name" label="Имя пользователя" />
</q-item-section>
</q-item>
<q-item class="col-lg-6 col-md-6 col-sm-12 col-xs-12">
<q-item-section>
<q-input v-model="user_details.email" label="Адрес электронной почты" />
<q-input v-model="user_details.email" readonly label="Адрес электронной почты">
<template v-slot:default>
<change-email-btn class="q-px-sm" />
</template>
</q-input>
</q-item-section>
</q-item>
<q-item class="col-lg-6 col-md-6 col-sm-12 col-xs-12">
......@@ -41,7 +48,7 @@
<q-input type="text" v-model="user_details.last_name" label="Фамилия" />
</q-item-section>
</q-item>
<q-item class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<!-- <q-item class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<q-item-section>
<q-input autogrow v-model="user_details.address" label="Адрес" />
</q-item-section>
......@@ -55,7 +62,7 @@
<q-item-section>
<q-input v-model="user_details.post_code" label="Почтовый индекс" />
</q-item-section>
</q-item>
</q-item> -->
<q-item class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
<q-item-section>
<q-input type="textarea" v-model="user_details.about" label="обо мне" />
......@@ -122,7 +129,7 @@ import { defineComponent } from 'vue';
import { useUsersStore } from 'src/stores/users';
import { mapActions, mapState } from 'pinia';
import { useCurrentUserStore } from '../stores/current-user';
import ChangeEmailBtn from '../components/ChangeEmailDialog';
export default defineComponent({
data() {
......@@ -133,6 +140,7 @@ export default defineComponent({
last_name: '',
// city: '',
email: '',
about: '',
},
currentPassword: '',
......@@ -153,25 +161,35 @@ export default defineComponent({
],
};
},
components: {
ChangeEmailBtn
},
watch: {
user: {
handler(val) {
this.user_details.first_name = val.unuaNomo.enhavo;
this.user_details.last_name = val.familinomo.enhavo;
// this.user_details.city = val.regiono.enhavo;
}, immediate: true
},
userEmail: {
handler(val) {
this.user_details.email = val.chefaRetposhto;
this.user_details.email = this.userEmail;
}, immediate: true
},
userAbout: {
handler(val) {
this.user_details.about = val.statuso.enhavo;
}, immediate: true
},
userName: {
handler(val) {
this.user_details.user_name = val.retnomo;
this.user_details.user_name = this.userName;
this.user_details.user_name = val;
}, immediate: true
},
......@@ -184,8 +202,9 @@ export default defineComponent({
computed: {
...mapState(useCurrentUserStore, ['getAvatar']),
...mapState(useCurrentUserStore, { user: 'getUser' }),
...mapState(useCurrentUserStore, { userEmail: 'getUserEmail' }),
...mapState(useCurrentUserStore, { userName: 'getUserName' })
...mapState(useCurrentUserStore, { userEmail: 'getUser' }),
...mapState(useCurrentUserStore, { userName: 'getUserName' }),
...mapState(useCurrentUserStore, { userAbout: 'getUser' })
},
methods: {
onChangePassword() {
......@@ -234,15 +253,39 @@ export default defineComponent({
...mapActions(useUsersStore, ['changeUzanto', 'changeTelephoneNumberOrEmail']),
...mapActions(useCurrentUserStore, ['addUniversoUzanto']),
updateUserName() {
if (this.userName === this.user_details.user_name) return;
this.addUniversoUzanto({ retnomo: this.user_details.user_name, uuid: this.user.universoUzanto.uuid })
.then(() => {
this.$q.notify({
color: 'positive',
message: 'Ваши данные успешно обновлены!'
});
})
.catch(error => {
this.$q.notify({
color: 'negative',
message: 'Ошибка при изменении данных! '
});
});
},
updateUser() {
const payload = {};
if (this.user_details.first_name !== this.user.unuaNomo.enhavo) payload.unuaNomo = this.user_details.first_name;
if (this.user_details.last_name !== this.user.familinomo.enhavo) payload.familinomo = this.user_details.last_name;
if (this.user_details.email === this.userEmail.chefaRetposhto) payload.chefaRetposhto = this.user_details.email;
// if (this.user_details.user_name === this.userName.retnomo) payload.retnomo = this.user_details.user_name;
if (this.user_details.about !== this.user.statuso.enhavo) payload.statuso = this.user_details.about;
this.updateUserName();
if (!Object.keys(payload).length) return;
this.changeUzanto(payload)
this.changeUzanto(payload);
this.addUniversoUzanto(payload)
.then(() => {
this.$q.notify({
color: 'positive',
......@@ -253,7 +296,7 @@ export default defineComponent({
.catch(error => {
this.$q.notify({
color: 'negative',
message: 'Ошибка при изменении данных: ' + error.message
message: 'Ошибка при изменении данных! '
});
});
......
universo-frontend/src/queries/mutations.js
Просмотр файла @ de65ee7e
......@@ -39,12 +39,11 @@ export const redaktuKanvasojKanvasoObjekto = gql`
$uuid: UUID
$ligiloPosedantoUuid: String
$ligiloTipoId: Int = 1
$pozicio: Int
$koordinatoX: Int
$koordinatoY: Int
$longo: Int
$largxo: Int
) {
$pozicio: Int # $koordinatoX: Int
) # $koordinatoY: Int
# $longo: Int
# $largxo: Int
{
redaktuKanvasojKanvasoObjekto(
nomo: $nomo
priskribo: $priskribo
......@@ -56,12 +55,11 @@ export const redaktuKanvasojKanvasoObjekto = gql`
uuid: $uuid
ligiloPosedantoUuid: $ligiloPosedantoUuid
ligiloTipoId: $ligiloTipoId
pozicio: $pozicio
koordinatoX: $koordinatoX
koordinatoY: $koordinatoY
largxo: $largxo
longo: $longo
) {
pozicio: $pozicio # koordinatoX: $koordinatoX
) # koordinatoY: $koordinatoY
# largxo: $largxo
# longo: $longo
{
status
message
kanvasoObjekto {
......@@ -706,14 +704,14 @@ export const changeTasko = gql`
//изменение телефона или электронной почты
export const changeTelephoneNumberOrEmail = gql`
mutation shanghiPoshtonTelefonon(
$tel: String
$code: String
$email: String
$telefonaNombro: String
$konfirmaKodo: String
$retposhto: String
) {
shanghiPoshtonTelefonon(
telefonaNombro: $tel
konfirmaKodo: $code
retposhto: $email
telefonaNombro: $telefonaNombro
konfirmaKodo: $konfirmaKodo
retposhto: $retposhto
) {
status
message
......
Поддерживает Markdown
0% или .
You are about to add 0 people to the discussion. Proceed with caution.
Сначала завершите редактирование этого сообщения!
Пожалуйста, зарегистрируйтесь или чтобы прокомментировать