<template>
    <view>
        <!-- <cu-custom bgColor="bg-white" :isBack="true">
			<block slot="content">
				用户名
			</block>
            <block slot="right"></block>
            <block slot="right">
				<view class="text-main font-32" style="padding-right:35rpx;" @tap="save()">完成</view>
			</block>
 		</cu-custom> -->

         <view class="box">
             <view class="name flex align-end ">
                 <u-input v-model="name" placeholder="请输入昵称" class="flex-sub" maxlength="16"/>
             </view>
             <view style="padding-left:4rpx;margin-top:25rpx;" class="color-99 text-sm">注：字数限1-4个字符。</view>
         </view>
		 <view class="btn-box flex justify-center" @click="save">
		     <view class="btn">完成</view>
		 </view>
    </view>
</template>
<script>
export default {
components: {},
   data() {
      return {
          name: "",
          id: "",
      }
   },
 watch: {
},
// 接收 上个页面传递过来的参数
onLoad(option) {
    if(option.name != 'null' && option.name != 'undefined' && option.name != null && option.name != undefined && option.name != ''){
      this.name = option.name;
    }
    this.id = option.id;
    // this.id = option.id;
},
created(){
},
mounted(){
},
methods:{
    save() {
        if(this.name.length<1||this.name.length>4) {
            this.$api.msg("字数限1-4个字符")
            return
        }
		
		 var reg = /[\uD83C|\uD83D|\uD83E][\uDC00-\uDFFF][\u200D|\uFE0F]|[\uD83C|\uD83D|\uD83E][\uDC00-\uDFFF]|[0-9|*|#]\uFE0F\u20E3|[0-9|#]\u20E3|[\u203C-\u3299]\uFE0F\u200D|[\u203C-\u3299]\uFE0F|[\u2122-\u2B55]|\u303D|[\A9|\AE]\u3030|\uA9|\uAE|\u3030/ig

		if(reg.test(this.name)){
			this.$api.msg("昵称不能带有emoji表情")
			return
		}
        this.$u.api.updateUserInfo({serverId: this.id,nikeName:this.name}).then(res => {
          if (res.code === 200) {
            uni.navigateTo({
              url: '../main/main'
            })
          }
        })

      // uni.navigateBack({
      //     delta: 1
      // });
    }
}


}
</script>
<style lang='scss' scoped>
page {
    background: #fff;
}
.box {
    padding: 0 35rpx;
    border-top: 2rpx solid #eee;
}
.name {
    height: 106rpx;
    border-bottom: 2rpx solid #eee;
}
/deep/ .uni-input-input {
    font-weight: bold;
}
.btn-box {
	position: fixed;
	bottom: 100rpx;
	left: calc(50% - 300rpx);
    /* margin-top: 43rpx; */
    padding-bottom: 40rpx;
    .btn {
        width: 600rpx;
        height: 90rpx;
        color: #EE4A2B;
        line-height: 90rpx;
        text-align: center;
        font-size: 32rpx;
        background: #F6F6F6;
        border-radius: 45rpx;
        border: 2rpx solid #FC6035;
    }
}
</style>

