<template>
    <view class='container'>
		<view>
			<u-input v-model="userNickName" :customStyle="{'height': '80rpx'}" placeholder="请输入昵称" border="surround"></u-input>
		</view>
		
		<view @click="onSubmit" class="btn">
			<text>保存</text>
		</view>
    </view>
</template>

<script>
import {
		mapState
	} from "vuex"
export default {
    data() {
    	return {
    		userNickName: ''
    	};
    },
    onLoad(options) {
    	this.userNickName = this.user.userInfo.nickname
    },
    computed: {
    	...mapState(['user'])
    },
    methods: {
    	onSubmit(){
    		if(!this.userNickName) {
    			return this.$u.toast('请填写昵称')
    		}
    		
    		const params = {
    			url: '/api/user/profile',
    			loadingTip: '',
    			data: {
    				nickname: this.userNickName
    			}
    		}
    		this.$request(params).then(res => {
    			// console.log(res)
    			this.$u.toast(res.msg || '修改成功')
    			setTimeout(() => {
					this.$wskj.goBack(1)
    			}, 600)
    		}).catch(err => {
    			// console.log(err)
    			this.$u.toast(err.msg || '修改失败')
    		})
    	}
    },
};
</script>

<style scoped>
	.container {
		height: 100%;
		padding: 30rpx 30rpx 0;
	}
	
	.btn{
		width: 94%;
		height: 80rpx;
		text-align: center;
		line-height: 80rpx;
		position: absolute;
		bottom: 100rpx;
		left: 50%;
		margin-left: -47%;
		background-color: #FE2C24;
		color: #FFF;
		border-radius: 8rpx;
	}
</style>
