UI/src/components/setting/SetName.vue
2024-06-15 14:59:52 +07:00

73 lines
2.1 KiB
Vue

<script setup>
import { ref, reactive, watch } from "vue";
import axios from "@/axios";
import API from "@/api";
import { handleRequest } from "@/helpers/request";
import { showFailToast } from "vant";
import { useRouter } from "vue-router";
import { useUserStore } from "@/store/user";
import { storeToRefs } from "pinia";
const router = useRouter();
const userStore = useUserStore();
const { userInfo } = storeToRefs(userStore);
const formData = reactive({
fullname: userInfo.value?.fullname,
});
const showPassword = ref(false);
function submit() {
handleRequest(axios.post(API.USER_SET_FULLNAME, formData)).then((res) => {
if (res.success) {
router.go(-1);
} else {
showFailToast(res.message ?? "Lỗi");
}
});
}
</script>
<template>
<div class="container page">
<div class="nav-bar van-nav-bar van-hairline--bottom">
<div class="van-nav-bar__content">
<div @click="$router.go(-1)" class="van-nav-bar__left">
<i
class="van-icon van-icon-arrow-left"
style="color: rgb(255, 255, 255)"
></i>
</div>
<div class="van-nav-bar__title van-ellipsis">Sửa tên thật </div>
<div class="van-nav-bar__right" @click="submit">
<span class="nav-right">Xác nhận</span>
</div>
</div>
</div>
<div class="van-cell-group van-hairline--top-bottom">
<div class="van-cell van-field">
<div class="van-cell__title van-field__label"><span>Tên</span></div>
<div class="van-cell__value van-field__value">
<div class="van-field__body">
<input
v-model="formData.fullname"
type="text"
placeholder="Vui lòng nhập tên thật của bạn"
class="van-field__control"
style="color: #323233"
/>
</div>
</div>
</div>
</div>
<p>
Để đảm bảo an toàn cho tài khoản của bạn, tên thật cần phải nhất quán với
tên trên thẻ ngân hàng bị ràng buộc
</p>
</div>
</template>