﻿// 个人资料编辑页 v3 - 头像/昵称/ID/手机/退出
const { useState, useEffect } = React;

function ProfileEditPage() {
  var _f = useState({ nickname: '', avatar: '' });
  var f = _f[0], sf = _f[1];
  var _ld = useState(true); var ld = _ld[0], sld = _ld[1];
  var _sv = useState(false); var sv = _sv[0], ssv = _sv[1];
  var _er = useState(''); var er = _er[0], ser = _er[1];
  var _ok = useState(''); var ok = _ok[0], sok = _ok[1];
  var _uq = useState(false); var uq = _uq[0], suq = _uq[1];
  var _user = useState(null); var user = _user[0], setUser = _user[1];
  var _pwd = useState({ oldPassword: '', newPassword: '', confirmPassword: '', smsCode: '' }); var pwd = _pwd[0], setPwd = _pwd[1];
  var _pwdBusy = useState(false); var pwdBusy = _pwdBusy[0], setPwdBusy = _pwdBusy[1];
  var _cooldown = useState(0); var cooldown = _cooldown[0], setCooldown = _cooldown[1];
  var h = React.createElement;
function svgArrL(c){return h('svg',{width:20,height:20,viewBox:'0 0 24 24',fill:'none',stroke:c||'#334155',strokeWidth:1.875,strokeLinecap:'round',strokeLinejoin:'round'},h('path',{d:'M15 18l-6-6 6-6'}));}


  useEffect(function() {
    if (!NK.Store.isLoggedIn()) return;
    var u = NK.Store.get('user');
    setUser(u);
    NK.Api.User.profile().then(function(r) {
      if (r && r.code === 0 && r.data) {
        sf({ nickname: r.data.nickname || '', avatar: r.data.avatar || '' });
        setUser(r.data);
        var stored = NK.Store.get('user') || {};
        NK.Store.set('user', Object.assign({}, stored, r.data));
      } else ser((r && r.message) || '加载失败');
    }).catch(function() { ser('网络错误'); })
    .finally(function() { sld(false); });
  }, []);

  useEffect(function() {
    if (cooldown <= 0) return;
    var timer = setTimeout(function() { setCooldown(cooldown - 1); }, 1000);
    return function() { clearTimeout(timer); };
  }, [cooldown]);

  function sF(k, v) { sf(function(p) { var n = {}; for (var x in p) n[x] = p[x]; n[k] = v; return n; }); }
  function setPwdField(k, v) { setPwd(function(p) { return Object.assign({}, p, { [k]: v }); }); }

  function sendPasswordCode() {
    if (!user || Number(user.has_password) === 1 || cooldown > 0) return;
    ser('');
    NK.Api.Sms.sendCode(user.phone, 'set_password').then(function(r) {
      if (r && r.code === 0) setCooldown((r.data && r.data.cooldownSeconds) || 60);
      else ser((r && r.message) || '验证码发送失败');
    }).catch(function() { ser('网络错误'); });
  }

  function submitPassword() {
    var hasPassword = user && Number(user.has_password) === 1;
    if (!pwd.newPassword || pwd.newPassword.length < 6) { ser('新密码至少6位'); return; }
    if (pwd.newPassword !== pwd.confirmPassword) { ser('两次输入的新密码不一致'); return; }
    if (hasPassword && !pwd.oldPassword) { ser('请输入原密码'); return; }
    if (!hasPassword && !pwd.smsCode) { ser('请输入手机验证码'); return; }
    ser(''); setPwdBusy(true);
    NK.Api.Auth.setPassword({
      oldPassword: hasPassword ? pwd.oldPassword : undefined,
      smsCode: hasPassword ? undefined : pwd.smsCode,
      newPassword: pwd.newPassword
    }).then(function(r) {
      if (r && r.code === 0) {
        var nextUser = Object.assign({}, user, { has_password: 1 });
        setUser(nextUser);
        NK.Store.set('user', Object.assign({}, NK.Store.get('user') || {}, { has_password: 1 }));
        setPwd({ oldPassword: '', newPassword: '', confirmPassword: '', smsCode: '' });
        alert(r.message || '密码设置成功');
      } else ser((r && r.message) || '密码设置失败');
    }).catch(function() { ser('网络错误'); })
    .finally(function() { setPwdBusy(false); });
  }

  function upImg(key) {
    var inp = document.createElement('input'); inp.type = 'file'; inp.accept = 'image/jpeg,image/png,image/webp';
    inp.onchange = function() {
      var file = inp.files[0];
      if (!file) return;
      if (file.size > 5 * 1024 * 1024) { ser('图片不超过5MB'); return; }
      suq(true); ser('');
      NK.Api.Upload.image(file).then(function(r) {
        if (r && r.code === 0 && r.data) {
          var url = r.data.url || r.data.image_url || '';
          if (url) sF(key, url);
        } else ser((r && r.message) || '上传失败');
      }).catch(function(e) { ser('上传失败: ' + (e.message || '')); })
      .finally(function() { suq(false); });
    };
    inp.click();
  }

  function submit() {
    if (!f.nickname || !f.nickname.trim()) { ser('昵称不能为空'); return; }
    ser(''); ssv(true);
    NK.Api.User.updateProfile({ nickname: f.nickname.trim(), avatar: f.avatar || '' }).then(function(r) {
      if (r && r.code === 0) {
        var u = NK.Store.get('user');
        if (u) { u.nickname = f.nickname.trim(); u.avatar = f.avatar || ''; NK.Store.set('user', u); }
        sok('保存成功');
      } else ser((r && r.message) || '保存失败');
    }).catch(function() { ser('网络错误'); })
    .finally(function() { ssv(false); });
  }

  function handleLogout() {
    if (!confirm('确定要退出当前账号吗？')) return;
    NK.Api.clearToken();
    NK.Store.setAll({user:null,page:'home'});
  }

  function maskPhone(phone) {
    if (!phone) return '未绑定';
    if (phone.length <= 4) return phone;
    return phone.substring(0, 3) + '****' + phone.substring(phone.length - 4);
  }

  if (!NK.Store.isLoggedIn()) return h('div',{className:'detail-page'},h('div',{className:'empty-state',style:{paddingTop:80}},h('div',{className:'eicon'},'🔒'),h('div',null,'请先登录'),h('div',{style:{color:'#1677ff',marginTop:12,cursor:'pointer',fontSize:14},onClick:function(){NK.Store.navigate('login')}},'去登录')));

  if (ld) return h('div',{className:'detail-page'},h('div',{className:'back-header'},h('div',{className:'bbtn',onClick:function(){NK.Store.back('mine')}},svgArrL()),h('div',{className:'btitle'},'编辑资料')),h('div',{className:'empty-state',style:{paddingTop:80}},h('div',null,'加载中...')));

  var uid = (user && user.user_no) ? user.user_no : '-';
  var phone = (user && user.phone) || '';
  var hasPassword = user && Number(user.has_password) === 1;

  return h('div',{className:'detail-page',style:{paddingBottom:80}},
    h('div',{className:'back-header'},h('div',{className:'bbtn',onClick:function(){NK.Store.back('mine')}},svgArrL()),h('div',{className:'btitle'},'编辑资料')),
    ok ? h('div',{style:{textAlign:'center',padding:'60px 24px'}},h('div',{style:{fontSize:56,marginBottom:12}},'✅'),h('div',{style:{fontSize:18,fontWeight:700,color:'#52c41a',marginBottom:8}},ok),h('button',{className:'pub3-btn primary',style:{width:'auto',padding:'0 36px'},onClick:function(){NK.Store.back('mine')}},'返回')) :
    h('div',{style:{padding:12}},
      h('div',{className:'pub3-card'},
        // Avatar
        h('div',{style:{textAlign:'center',marginBottom:16}},
          h('div',{style:{width:72,height:72,borderRadius:'50%',background:f.avatar?'transparent':'#e6f4ff',margin:'0 auto 8px',overflow:'hidden',display:'flex',alignItems:'center',justifyContent:'center',fontSize:28,fontWeight:700,color:'#1677ff'}},
            f.avatar ? h('img',{src:f.avatar,style:{width:'100%',height:'100%',objectFit:'cover'},onError:function(e){e.target.style.display='none'}}) : (f.nickname||'U')[0].toUpperCase()
          ),
          h('div',{style:{display:'flex',gap:8,justifyContent:'center'}},
            h('span',{style:{fontSize:13,color:'#1677ff',cursor:'pointer'},onClick:function(){upImg('avatar')}},f.avatar?'更换头像':'上传头像'),
            f.avatar ? h('span',{style:{fontSize:13,color:'#ff4d4f',cursor:'pointer'},onClick:function(){sF('avatar','')}},'删除') : null
          )
        ),
        // Nickname
        h('div',{className:'pub3-row'},h('div',{className:'pub3-label'},'昵称'),h('input',{className:'pub3-input',value:f.nickname,onChange:function(e){sF('nickname',e.target.value)},placeholder:'请输入昵称'})),
        // Public user number - read only
        h('div',{className:'pub3-row'},
          h('div',{className:'pub3-label'},'用户号'),
          h('div',{style:{flex:1,fontSize:14,color:'#333',padding:'8px 0'}},uid)
        ),
        // Phone - masked, clickable
        h('div',{className:'pub3-row',style:{cursor:'pointer'},onClick:function(){alert('绑定手机号功能正在接入中');}},
          h('div',{className:'pub3-label'},'绑定手机号'),
          h('div',{style:{flex:1,fontSize:14,color:phone?'#333':'#ccc',padding:'8px 0',display:'flex',alignItems:'center',justifyContent:'space-between'}},
            h('span',null,maskPhone(phone)),
            h('span',{style:{color:'#bbb',fontSize:16}},'›')
          )
        ),
        er ? h('div',{style:{color:'#ff4d4f',fontSize:13,marginBottom:8}},er) : null
      ),
      h('div',{className:'pub3-card',style:{marginTop:12}},
        h('div',{style:{fontSize:16,fontWeight:700,marginBottom:12}},'账号安全'),
        h('div',{className:'pub3-row'},
          h('div',{className:'pub3-label'},'登录密码'),
          h('div',{style:{flex:1,fontSize:14,color:hasPassword?'#52c41a':'#fa8c16',padding:'8px 0'}},hasPassword?'已设置':'未设置')
        ),
        hasPassword ? h('input',{className:'pub3-input',type:'password',value:pwd.oldPassword,onChange:function(e){setPwdField('oldPassword',e.target.value);},placeholder:'原密码',style:{width:'100%',boxSizing:'border-box',marginBottom:10}}) : null,
        !hasPassword ? h('div',{style:{display:'flex',gap:8,marginBottom:10}},
          h('input',{className:'pub3-input',value:pwd.smsCode,onChange:function(e){setPwdField('smsCode',e.target.value.replace(/\D/g,''));},placeholder:'手机验证码',maxLength:6,style:{flex:1}}),
          h('button',{type:'button',disabled:cooldown>0,onClick:sendPasswordCode,style:{border:0,borderRadius:8,padding:'0 12px',color:'#fff',background:cooldown>0?'#bbb':'#1677ff'}},cooldown>0?(cooldown+'s'):'获取验证码')
        ) : null,
        h('input',{className:'pub3-input',type:'password',value:pwd.newPassword,onChange:function(e){setPwdField('newPassword',e.target.value);},placeholder:hasPassword?'新密码':'设置密码',style:{width:'100%',boxSizing:'border-box',marginBottom:10}}),
        h('input',{className:'pub3-input',type:'password',value:pwd.confirmPassword,onChange:function(e){setPwdField('confirmPassword',e.target.value);},placeholder:'确认新密码',style:{width:'100%',boxSizing:'border-box',marginBottom:10}}),
        h('button',{className:'pub3-btn primary',type:'button',disabled:pwdBusy,onClick:submitPassword,style:{width:'100%'}},pwdBusy?'处理中...':(hasPassword?'修改密码':'设置密码'))
      ),
      // Save button
      h('div',{className:'pub3-bottom-bar'},h('button',{className:'pub3-btn primary',onClick:submit,disabled:sv||uq},sv?'保存中...':'保存')),

      // Logout section
      h('div',{style:{marginTop:24,padding:12}},
        h('div',{style:{padding:'14px 0',textAlign:'center',color:'#ff4d4f',fontSize:15,fontWeight:500,cursor:'pointer',borderRadius:12,background:'#fff'},onClick:handleLogout},'退出账户')
      )
    )
  );
}
window.NK = window.NK || {}; NK.ProfileEditPage = ProfileEditPage;
