<template>
  <view class="container">
    <view class="header">
      <u-upload @afterRead="afterReadImg" :deletable="false" :maxCount="1">
        <image class="avatar_pic" :src="avatarInfo.url" alt="" />
      </u-upload>
      <view>点击更换头像</view>
    </view>
		<view class="main">
			<view class="tabel">
				<view class="left">姓名</view>
				<view class="right">
					<input
						type="text"
						placeholder="请填写昵称"
						:value="name"
						:data-name="name"
						@input="headerInputClick"
					/>
				</view>
			</view>
			<view class="tabel">
				<view class="left">性别</view>
				<view class="right">
					<radio
						value="2"
						:checked="sex == 2"
						@click="headerRadioClick(2)"
					/>女
					<view class="right_radio">
						<radio
							value="1"
							:checked="sex == 1"
							@click="headerRadioClick(1)"
						/>男
					</view>
				</view>
			</view>
			<view class="tabel">
				<view class="left">Email</view>
				<view class="right no_border">
					<input
						type="text"
						placeholder="请填写邮箱地址"
						:value="eMail"
						:data-name="eMail"
						@input="headerInputClick"
					/>
				</view>
			</view>
		</view>
		<view class="btn">保存设置</view>
		<view class="main">
			<view class="tabel">
				<view class="left">刷新登录</view>
				<view class="right">
					<u-icon name="arrow-right" />
				</view>
			</view>

			<view class="tabel no_border" @click="headerSettingClick">
				<view class="left">设置授权</view>
				<view class="right">
					<u-icon name="arrow-right" />
				</view>
			</view>
		</view>
    <nav-footer />
  </view>
</template>

<script>
import { NavgateTo, request, picUrl, upload } from "../../../utils/index";
import { apiArr } from "../../../api/login";
import { apiArr as apiArr2 } from "../../../api/v2User";
export default {
  data() {
    return {
      avatarInfo: {},
      userInfoList: [
        {
          pic: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/User/_assets/Group_422.png",
          desc: "上传头像",
          url: "/packages/user/uploadAvatar/index",
          isShowPic: true,
        },
        {
          pic: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/User/_assets/Classroom.png",
          desc: "当前账户",
          url: "",
          text: "微信用户",
        },
        {
          pic: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/User/_assets/Group_423.png",
          desc: "修改登录密码",
          type: "login",
          url: "/packages/user/resetPwd/index",
          isShowPic: true,
        },
        {
          pic: "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/User/_assets/Group_424.png",
          desc: "修改支付密码",
          type: "pay",
          url: "/packages/user/resetPwd/index",
          isShowPic: true,
          isLast: true,
        },
      ],
      name: "",
      mobile: "",
      eMail: "",
      sex: 2,
    };
  },
  methods: {
    // 上传图片
    async afterReadImg(e) {
      console.log("eeee", e);
      const { file } = e;
      upload(file.url, (res) => {
        console.log("1111", res);
        this.avatarInfo = {
          url: picUrl + res.data.path,
          picUrl: res.data.path,
        };
      });
      uni.showToast({
        title: "上传成功",
        icon: "success",
      });
    },
    headerInputClick(e) {
      console.log("ee", e);
      const { name } = e.currentTarget.dataset;
      const { value } = e.detail;
      this[name] = value;
    },

		headerSettingClick() {
			uni.openSetting({
				success(res) {
					console.log(res.authSetting)
				}
			});
		},

    headerRadioClick(item) {
      console.log("item", item);
      this.sex = item;
    },
    async init() {
      const res = await request(apiArr2.getUserInfo, "POST", {});
      console.log("111211", res);
      this.avatarInfo = {
        url: res.avatar
          ? picUrl + res.avatar
          : "https://wechat-img-file.oss-cn-beijing.aliyuncs.com/person/Group_309.png",
        picUrl: res.avatar,
      };
      this.name = res.nick_name;
      this.mobile = res.mobile;
      this.sex = res.gender;
      this.eMail = res.email;
    },
  },

  onLoad() {
    this.init();
  },
};
</script>

<style>
@import url("./index.css");
</style>
