Files
tk-mini-program/pages/UserInformation/UserInformation.vue
pengxiaolong 36a240f854 优化
2025-06-23 22:00:46 +08:00

174 lines
4.1 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";
import postFile from "../../components/postFile.js";
import generateFileName from "../../components/generateFileName.js";
import { useCounterStore } from "@/stores/counter";
const counter = useCounterStore();
export default {
inject: ["$global"],
data() {
return {
userinfo:"",
name: "",
id: "",
info: {},
userSig: "",
lastPage: "",
picture: "",
Filename: generateFileName(),
};
},
onLoad(option) {
uni.getStorage({
key: "userinfo",
success: (res) => {
this.id = res.data.id;
},
});
uni.getStorage({
key: "userSig",
success: (res) => {
this.userSig = res.data;
},
});
uni.getStorage({
key: "lastPage",
success: (res) => {
this.lastPage = "/" + res.data;
},
fail: () => {
this.lastPage = "/pages/Home/Home";
},
});
// const { info } = option;
// this.id = JSON.parse(info).id
},
methods: {
// 输入昵称
inputName(e) {
this.name = e.detail.value;
},
// 选择头像
async Userinfo(e) {
const { avatarUrl } = e.detail;
this.userinfo = avatarUrl;
},
// 微信登录
async wxLogin(e) {
if (
this.name !== "" &&
this.userinfo !== ""
) {
uni.showLoading({
title: "登录中...",
mask: true,
});
const { code } = await uni.login({
provider: "weixin",
onlyAuthorize: true,
});
postFile({
path: this.userinfo,
name: this.Filename,
})
.then((ress) => {
this.picture = ress.split("/").pop();
const res = request({
url: "user/inputUserInfo",
method: "POST",
data: {
id: this.id,
headerIcon: this.Filename,
nickName: this.name,
code,
usersig: this.userSig.userSig,
},
userInfo: false,
}).then((res) => {
if (res.code === 200) {
uni.showToast({
title: "登录成功",
icon: "success",
});
uni.setStorageSync("userinfo", res.data.info);
counter.$patch({ myitem: res.data.info });
uni.hideLoading();
//```````````````````````````````````````````````````````````````````````登录成功后跳转回原页面 或 首页
uni.reLaunch({
url: this.lastPage,
});
//````````````````````````````````````````````````````````````````````
} else {
uni.showToast({
title: res.msg,
icon: "none",
});
}
});
})
.catch((err) => {
console.log(err);
});
} else {
uni.showToast({
title: "请填写头像昵称",
icon: "success",
duration: 3000,
});
}
},
},
};
</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>