Files
buy-lite/wxmp/src/mods/AppAuth/AppAuth.vue
2023-01-13 11:42:08 +08:00

60 lines
1.4 KiB
Vue

<template>
<section class="AppAuth">
<ai-item label="头像">
<button class="avatarBtn" open-type="chooseAvatar" @chooseavatar="handleAvatar">
<image class="avatar" :src="form.avatar"/>
</button>
</ai-item>
<ai-item label="昵称">
<input type="nickname" v-model="form.name" placeholder="设置用户名" class="rtl"/>
</ai-item>
<ai-bottom text="登录" @click="handleSignIn"/>
</section>
</template>
<script>
import {mainStore} from "../../utils/pinia";
import AiItem from "../../components/AiItem";
import AiBottom from "../../components/AiBottom";
import {mapActions} from "pinia/dist/pinia";
export default {
name: "AppAuth",
components: {AiBottom, AiItem},
appName: "用户登录",
data() {
return {
form: {
avatar: "https://mmbiz.qpic.cn/mmbiz/icTdbqWNOwNRna42FI242Lcia07jQodd2FJGIYQfG0LAJGFxM4FbnQP6yfMxBgJ0F3YRqJCJ1aPAK2dQagdusBZg/0",
name: ""
}
}
},
methods: {
...mapActions(mainStore, ['getToken', 'getCode']),
handleAvatar({detail}) {
this.form.avatar = detail.avatarUrl
},
handleSignIn() {
this.getCode().then(code => this.getToken({...this.form, code})).then(() => uni.navigateBack())
}
}
}
</script>
<style lang="scss" scoped>
.AppAuth {
.w100 {
width: 100%;
}
.avatarBtn {
padding: 0;
width: initial;
height: 40px;
flex-shrink: 0;
}
}
</style>