﻿// 资金流水页面
const { useState, useEffect } = React;

var TX_LABELS = { income:'交易收入', expense:'支付', refund:'退款', withdraw_freeze:'提现冻结', withdraw:'提现', withdraw_reject:'提现退回', recharge:'充值', commission:'佣金' };

function WalletTransactionsPage() {
  var _l = useState([]); var list = _l[0], setList = _l[1];
  var _p = useState(1); var page = _p[0], setPage = _p[1];
  var _t = useState(0); var total = _t[0], setTotal = _t[1];
  var _ld = useState(true); var loading = _ld[0], setLoading = _ld[1];
  var pageSize = 20;

  function fetch(p) {
    setLoading(true);
    NK.Api.Wallet.transactions(p || 1, pageSize).then(function(r) {
      if (r && r.code === 0) {
        setList(p > 1 ? function(prev) { return prev.concat(r.data.list); } : r.data.list);
        setTotal(r.data.total);
        setPage(p || 1);
      }
    }).finally(function() { setLoading(false); });
  }

  useEffect(function() {
    if (NK.Store.isLoggedIn()) fetch(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'}));}

  var fmt = function(n) { return '\u00A5' + Math.abs(Number(n)||0).toFixed(2); };
  var fmtTime = function(t) { return t ? new Date(t).toLocaleString('zh-CN') : ''; };
  var isPlus = function(t) { return t === 'income' || t === 'refund' || t === 'withdraw_reject'; };

  if (!NK.Store.isLoggedIn()) return h('div',{className:'detail-page'},h('div',{className:'empty-state',style:{paddingTop:80}},h('div',{className:'eicon'},'\uD83D\uDD12'),h('div',null,'请先登录')));

  return h('div',{className:'detail-page'},
    h('div',{className:'back-header'},h('div',{className:'bbtn',onClick:function(){NK.Store.navigate('wallet')}},svgArrL()),h('div',{className:'btitle'},'资金明细')),
    list.length === 0 && !loading ? h('div',{className:'empty-state',style:{paddingTop:60}},h('div',{className:'eicon'},'\uD83D\uDCB0'),h('div',null,'暂无资金流水')) :
    h('div',{style:{padding:12}},
      h('div',{className:'tx-list'},
        list.map(function(item, i) {
          return h('div',{key:item.id||i,className:'tx-item'},
            h('div',{className:'tx-left'},
              h('div',{className:'tx-type'},TX_LABELS[item.type]||item.type),
              h('div',{className:'tx-time'},fmtTime(item.createTime)),
              item.orderId ? h('div',{className:'tx-order'},'订单: '+item.orderId) : null,
              item.remark ? h('div',{className:'tx-remark'},item.remark) : null
            ),
            h('div',{className:'tx-right'},
              h('div',{className:'tx-amount',style:{color:isPlus(item.type)?'#52c41a':'#ff4d4f'}},
                (isPlus(item.type)?'+':'-') + fmt(item.amount)),
              h('div',{className:'tx-balance'},'余额: \u00A5'+(Number(item.balanceAfter)||0).toFixed(2))
            )
          );
        })
      ),
      loading && h('div',{style:{textAlign:'center',padding:16,color:'#999',fontSize:13}},'加载中...'),
      list.length > 0 && list.length < total ? h('div',{style:{textAlign:'center',padding:'8px 0'}},
        h('button',{onClick:function(){fetch(page+1)},className:'pub3-add-btn'},'加载更多')
      ) : null
    )
  );
}
window.NK = window.NK || {}; NK.WalletTransactionsPage = WalletTransactionsPage;
