Files
tk-mini-program/pages/Setting/Setting.vue
pengxiaolong 6107739077 登录
2025-05-20 00:10:07 +08:00

137 lines
3.0 KiB
Vue

<template>
<view class="container">
<button class="login-btn" open-type="chooseAvatar" @chooseavatar="Userinfo">
<image class="avatar" :src="userinfo"></image>
</button>
<input
type="nickname"
class="weui-input"
placeholder="请输入昵称"
@blur="inputName"
/>
<button class="weui-btn" @click="wxLogin">修改</button>
</view>
</template>
<script>
import request from "../../components/request.js";
export default {
inject: ["$global"],
data() {
return {
userinfo:"",
name: "",
id: "",
info: {},
userSig: "",
};
},
onLoad(option) {
uni.getStorage({
key: "userinfo",
success: (res) => {
this.id = res.data.id;
this.name = res.data.nickName;
this.userinfo = res.data.headerIcon;
},
});
uni.getStorage({
key: "userSig",
success: (res) => {
this.userSig = res.data;
},
});
},
methods: {
// 输入昵称
inputName(e) {
this.name = e.detail.value;
},
// 选择头像
async Userinfo(e) {
const { avatarUrl } = e.detail;
this.userinfo = avatarUrl;
},
// 微信登录
async wxLogin(e) {
uni.showLoading({
title: "登录中...",
mask: true,
});
console.log("userinfo", this.userinfo);
console.log("name", this.name);
console.log("id", this.id);
console.log("userSig", this.userSig);
const res = await request({
url: "user/updateUserInfo",
method: "POST",
data: {
id: this.id,
headerIcon: this.userinfo,
nickName: this.name,
usersig: this.userSig,
},
userInfo: false,
});
console.log("res", res);
if (res.code === 200) {
uni.showToast({
title: "修改成功",
icon: "success",
});
console.log("修改成功", res.data);
uni.setStorageSync("userinfo", res.data.info);
uni.hideLoading();
//```````````````````````````````````````````````````````````````````````登录成功后跳转回原页面 或 首页
uni.navigateBack({
delta: 1
});
//````````````````````````````````````````````````````````````````````
} else {
uni.showToast({
title: "修改失败",
icon: "none",
});
}
},
},
};
</script>
<style scoped>
.container {
width: 100%;
height: 100%;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
background: linear-gradient(to bottom, #11cb2a6e, #2574fc6d);
}
.login-btn {
width: 200rpx;
height: 200rpx;
border-radius: 50%;
padding: 0px;
margin-bottom: 60rpx;
}
.avatar {
width: 100%;
height: 100%;
border-radius: 50%;
}
.weui-input {
width: 80%;
text-align: center;
margin-bottom: 40rpx;
}
.weui-btn {
width: 40%;
margin-top: 20rpx;
background-color: #11cb2a00;
color: #fff;
}
</style>