(function () {
  'use strict';

  const { useEffect, useState } = React;
  const UI = NK.AdminUI;
  const PAGE_SIZE = 15;
  const STATUS = {
    0: { label: '待处理', tone: 'warning' },
    1: { label: '处理中', tone: 'info' },
    2: { label: '已完成', tone: 'success' },
    3: { label: '已关闭', tone: 'neutral' },
  };
  const TYPES = {
    content_mismatch: '账号内容与描述不符',
    item_mismatch: '账号内容与描述不符',
    cannot_login: '无法登录',
    account_error: '账号异常',
    inspection_dispute: '验号纠纷',
    rebind_issue: '换绑问题',
    after_sale: '售后申请',
    dispute: '交易纠纷',
    feedback: '问题反馈',
    other: '其他',
  };
  const ORDER_STATUS = {
    10: '待支付', 20: '已支付待确认', 30: '验号中', 40: '交易中', 50: '换绑中',
    60: '审核中', 70: '待买家确认', 80: '已完成', 90: '纠纷中', 100: '仲裁中',
    110: '已退款', 120: '已取消', 130: '已冻结',
  };

  function formatTime(value) {
    if (!value) return '-';
    const date = new Date(value);
    return Number.isNaN(date.getTime()) ? String(value) : date.toLocaleString('zh-CN', { hour12: false });
  }

  function formatMoney(value) {
    return '¥' + Number(value || 0).toFixed(2);
  }

  function statusTag(value) {
    const item = STATUS[value] || { label: '未知状态', tone: 'neutral' };
    return <UI.AdminStatusTag tone={item.tone}>{item.label}</UI.AdminStatusTag>;
  }

  function typeLabel(value) {
    return TYPES[value] || value || '未分类';
  }

  function DetailGrid({ children }) {
    return <div className="admin-detail-grid">{children}</div>;
  }

  function DetailItem({ label, children }) {
    return <React.Fragment><span className="admin-detail-label">{label}</span><span className="admin-detail-value">{children == null || children === '' ? '-' : children}</span></React.Fragment>;
  }

  function MobileField({ label, children }) {
    return <div><span className="admin-mobile-label">{label}</span><span className="admin-mobile-value">{children == null || children === '' ? '-' : children}</span></div>;
  }

  function AdminDisputesPage({ initialEntityId, onNavigate }) {
    const [rows, setRows] = useState([]);
    const [total, setTotal] = useState(0);
    const [page, setPage] = useState(1);
    const [loading, setLoading] = useState(true);
    const [error, setError] = useState('');
    const [feedback, setFeedback] = useState('');
    const [keyword, setKeyword] = useState('');
    const [status, setStatus] = useState('');
    const [type, setType] = useState('');
    const [dateFrom, setDateFrom] = useState('');
    const [dateTo, setDateTo] = useState('');
    const [advancedOpen, setAdvancedOpen] = useState(false);
    const [detail, setDetail] = useState(null);
    const [detailLoading, setDetailLoading] = useState(false);
    const [detailError, setDetailError] = useState('');
    const [recordText, setRecordText] = useState('');
    const [actionLoading, setActionLoading] = useState(false);
    const [adminInfo, setAdminInfo] = useState(null);
    const [previewEvidence, setPreviewEvidence] = useState(null);

    function currentFilters(override) {
      return Object.assign({
        keyword: keyword.trim(), status, type, dateFrom, dateTo,
      }, override || {});
    }

    function loadList(targetPage, override) {
      const nextPage = targetPage || 1;
      const filters = currentFilters(override);
      setLoading(true); setError(''); setFeedback('');
      return NK.Api.Admin.disputes(Object.assign({ page: nextPage, pageSize: PAGE_SIZE }, filters)).then(function (response) {
        if (!response || response.code !== 0 || !response.data) throw new Error(response && response.message || '账号纠纷加载失败');
        setRows(Array.isArray(response.data.list) ? response.data.list : []);
        setTotal(Number(response.data.total || 0)); setPage(Number(response.data.page || nextPage));
      }).catch(function (requestError) {
        setRows([]); setTotal(0); setError(requestError.message || '账号纠纷加载失败');
      }).finally(function () { setLoading(false); });
    }

    function openDetail(id) {
      setDetailLoading(true); setDetailError(''); setRecordText(''); setDetail(null);
      return NK.Api.Admin.disputeDetail(id).then(function (response) {
        if (!response || response.code !== 0 || !response.data) throw new Error(response && response.message || '纠纷详情加载失败');
        setDetail(response.data);
      }).catch(function (requestError) {
        setDetailError(requestError.message || '纠纷详情加载失败');
      }).finally(function () { setDetailLoading(false); });
    }

    useEffect(function () {
      loadList(1);
      NK.Api.Admin.me().then(function (response) { if (response && response.code === 0) setAdminInfo(response.data); });
      if (initialEntityId) openDetail(initialEntityId);
    }, []);

    function resetFilters() {
      setKeyword(''); setStatus(''); setType(''); setDateFrom(''); setDateTo('');
      loadList(1, { keyword: '', status: '', type: '', dateFrom: '', dateTo: '' });
    }

    function navigate(menu, options) {
      if (typeof onNavigate === 'function') onNavigate(menu, options || {});
    }

    function entityLink(menu, id, label) {
      if (!id) return label || '-';
      return <UI.AdminEntityLink onClick={function () { navigate(menu, { entityId: id }); }}>{label || ('#' + id)}</UI.AdminEntityLink>;
    }

    function openWorkbench() {
      if (!detail || !detail.conversationId) return;
      navigate('imSupport', {
        conversationId: detail.conversationId,
        businessType: 'account_trade',
        status: 'all',
      });
    }

    function submitRecord() {
      if (!detail || actionLoading || !recordText.trim()) return;
      setActionLoading(true); setDetailError('');
      NK.Api.Admin.addDisputeRecord(detail.id, { content: recordText.trim() }).then(function (response) {
        if (!response || response.code !== 0) throw new Error(response && response.message || '处理记录保存失败');
        setFeedback('处理记录已保存'); setRecordText('');
        return openDetail(detail.id);
      }).then(function () { return loadList(page); }).catch(function (requestError) {
        setDetailError(requestError.message || '处理记录保存失败');
      }).finally(function () { setActionLoading(false); });
    }

    const canWrite = adminInfo && ['super_admin', 'admin', 'customer_service'].indexOf(adminInfo.role) >= 0;
    const filtersActive = Boolean(keyword.trim() || status !== '' || type || dateFrom || dateTo);
    const totalPages = Math.max(1, Math.ceil(total / PAGE_SIZE));
    const columns = [
      { key: 'disputeNo', label: '纠纷编号', width: 126, render: function (row) { return <UI.AdminEntityLink onClick={function () { openDetail(row.id); }}>{row.disputeNo}</UI.AdminEntityLink>; } },
      { key: 'orderNo', label: '订单号', width: 158, render: function (row) { return entityLink('orders', row.orderId, row.orderNo || ('#' + row.orderId)); } },
      { key: 'product', label: '商品', render: function (row) { return <div><span className="admin-list-primary" title={row.accountTitle}>{row.accountTitle || '-'}</span><div className="admin-table-sub">{row.accountNo || ('商品 #' + (row.accountId || '-'))}</div></div>; } },
      { key: 'parties', label: '买家 / 卖家', render: function (row) { return <div><div>{row.buyerNickname || row.buyerNo || ('UID ' + row.buyerId)}</div><div className="admin-table-sub">{row.sellerNickname || row.sellerNo || ('UID ' + row.sellerId)}</div></div>; } },
      { key: 'type', label: '纠纷类型', width: 150, render: function (row) { return typeLabel(row.disputeType); } },
      { key: 'status', label: '状态', width: 96, render: function (row) { return statusTag(row.status); } },
      { key: 'handler', label: '当前处理人', width: 112, render: function (row) { return row.handlerName || '未认领'; } },
      { key: 'time', label: '创建时间', width: 166, render: function (row) { return formatTime(row.createTime); } },
      { key: 'actions', label: '操作', action: true, width: 96, render: function (row) { return <UI.Button kind="text" onClick={function () { openDetail(row.id); }}>查看详情</UI.Button>; } },
    ];

    function mobileItem(row) {
      return <React.Fragment>
        <div className="admin-mobile-card-head"><div><div className="admin-mobile-card-title">{row.disputeNo}</div><div className="admin-table-sub">{row.orderNo || '未关联订单号'}</div></div>{statusTag(row.status)}</div>
        <div className="admin-mobile-card-grid">
          <MobileField label="商品">{row.accountTitle}</MobileField><MobileField label="纠纷类型">{typeLabel(row.disputeType)}</MobileField>
          <MobileField label="买家 / 卖家">{(row.buyerNickname || row.buyerNo || '-') + ' / ' + (row.sellerNickname || row.sellerNo || '-')}</MobileField>
          <MobileField label="当前处理人">{row.handlerName || '未认领'}</MobileField><MobileField label="创建时间">{formatTime(row.createTime)}</MobileField>
        </div>
        <div className="admin-mobile-card-actions"><UI.Button kind="text" onClick={function () { openDetail(row.id); }}>查看详情</UI.Button></div>
      </React.Fragment>;
    }

    function timelineItems() {
      if (!detail) return [];
      const items = [{ id: 'created', title: '纠纷创建', description: typeLabel(detail.disputeType), time: formatTime(detail.createTime) }];
      (detail.serviceRecords || []).forEach(function (item) {
        items.push({ id: 'service-' + item.id, title: item.action === 'remark' ? '客服处理记录' : '客服介入', description: [item.staffName, item.content].filter(Boolean).join(' · '), time: formatTime(item.createTime) });
      });
      (detail.statusLogs || []).forEach(function (item) {
        items.push({ id: 'status-' + item.id, title: '订单状态变化', description: (ORDER_STATUS[item.fromStatus] || item.fromStatus || '-') + ' → ' + (ORDER_STATUS[item.toStatus] || item.toStatus || '-') + (item.remark ? ' · ' + item.remark : ''), time: formatTime(item.createTime) });
      });
      if (detail.handledTime) items.push({ id: 'handled', title: '纠纷处理完成', description: detail.result || '', time: formatTime(detail.handledTime) });
      return items.sort(function (left, right) { return new Date(left.time).getTime() - new Date(right.time).getTime(); });
    }

    function renderDetail() {
      if (detailLoading) return <UI.LoadingState label="正在加载纠纷详情"/>;
      if (detailError) return <UI.ErrorState title="纠纷详情加载失败" description={detailError} onRetry={function () { if (initialEntityId || detail) openDetail(detail ? detail.id : initialEntityId); }}/>;
      if (!detail) return null;
      return <React.Fragment>
        <div className="admin-dispute-chain" aria-label="关联实体">
          <button type="button" onClick={function () { navigate('orders', { entityId: detail.order && detail.order.id }); }}><span>订单</span><strong>{detail.order && detail.order.orderNo || '-'}</strong></button>
          <span className="admin-dispute-chain-arrow">→</span>
          <button type="button" onClick={function () { navigate('products', { entityId: detail.product && detail.product.id }); }}><span>账号商品</span><strong>{detail.product && (detail.product.productNo || detail.product.title) || '-'}</strong></button>
          <span className="admin-dispute-chain-arrow">→</span>
          <button type="button" onClick={function () { navigate('users', { entityId: detail.initiator && detail.initiator.id }); }}><span>发起用户</span><strong>{detail.initiator && (detail.initiator.nickname || detail.initiator.userNo) || '-'}</strong></button>
          <span className="admin-dispute-chain-arrow">→</span>
          <button type="button" disabled={!detail.conversationId} onClick={openWorkbench}><span>客服工作台</span><strong>{detail.conversationId ? '进入会话' : '暂无交易会话'}</strong></button>
        </div>
        <UI.AdminDetailSection title="基础信息"><DetailGrid>
          <DetailItem label="纠纷编号">{detail.disputeNo}</DetailItem><DetailItem label="当前状态">{statusTag(detail.status)}</DetailItem>
          <DetailItem label="纠纷类型">{typeLabel(detail.disputeType)}</DetailItem><DetailItem label="当前处理人">{detail.handler ? detail.handler.username : '未认领'}</DetailItem>
          <DetailItem label="创建时间">{formatTime(detail.createTime)}</DetailItem><DetailItem label="处理时间">{formatTime(detail.handledTime)}</DetailItem>
        </DetailGrid></UI.AdminDetailSection>
        <UI.AdminDetailSection title="关联订单"><DetailGrid>
          <DetailItem label="订单号">{detail.order ? entityLink('orders', detail.order.id, detail.order.orderNo) : '-'}</DetailItem>
          <DetailItem label="订单金额">{detail.order ? formatMoney(detail.order.amount) : '-'}</DetailItem>
          <DetailItem label="交易阶段">{detail.order ? ORDER_STATUS[detail.order.status] || detail.order.status : '-'}</DetailItem>
          <DetailItem label="商品">{detail.product ? entityLink('products', detail.product.id, detail.product.title || detail.product.productNo) : '-'}</DetailItem>
          <DetailItem label="买家">{detail.buyer ? entityLink('users', detail.buyer.id, detail.buyer.nickname || detail.buyer.userNo || detail.buyer.id) : '-'}</DetailItem>
          <DetailItem label="卖家">{detail.seller ? entityLink('users', detail.seller.id, detail.seller.nickname || detail.seller.userNo || detail.seller.id) : '-'}</DetailItem>
        </DetailGrid></UI.AdminDetailSection>
        <UI.AdminDetailSection title="纠纷内容"><DetailGrid>
          <DetailItem label="发起方">{detail.initiator ? (detail.initiator.role === 'seller' ? '卖家' : '买家') + ' · ' + (detail.initiator.nickname || detail.initiator.userNo || detail.initiator.id) : '-'}</DetailItem>
          <DetailItem label="原因">{detail.reason || typeLabel(detail.disputeType)}</DetailItem>
        </DetailGrid><div className="admin-detail-lines admin-dispute-description">{detail.description || '未填写详细描述'}</div></UI.AdminDetailSection>
        <UI.AdminDetailSection title="证据材料">
          {detail.evidence && detail.evidence.length ? <div className="admin-dispute-evidence-grid">{detail.evidence.map(function (item) { return <button type="button" key={item.index} onClick={function () { setPreviewEvidence(item); }}><UI.Icon name="image" size={20}/><span>证据图片 {item.index + 1}</span><small>受控读取 · 不缓存</small></button>; })}</div> : <div className="admin-detail-muted">未提交图片证据</div>}
        </UI.AdminDetailSection>
        <UI.AdminDetailSection title="聊天与交易上下文"><div className="admin-inline-actions">
          {detail.conversationId ? <UI.Button kind="primary" onClick={openWorkbench}>进入客服工作台</UI.Button> : <UI.Button disabled>暂无交易会话</UI.Button>}
          {detail.order ? <UI.Button onClick={function () { navigate('orders', { entityId: detail.order.id }); }}>查看账号订单</UI.Button> : null}
        </div></UI.AdminDetailSection>
        <UI.AdminDetailSection title="处理时间线"><UI.AdminTimeline items={timelineItems()} emptyText="暂无处理记录"/></UI.AdminDetailSection>
        <UI.AdminDetailSection title="操作日志"><UI.AdminAuditTrail items={detail.auditTrail || []} emptyText="暂无独立审计记录"/></UI.AdminDetailSection>
        {canWrite ? <UI.AdminDetailSection title="补充处理记录"><textarea className="admin-textarea" value={recordText} onChange={function (event) { setRecordText(event.target.value); }} maxLength="2000" placeholder="记录客服核对、沟通或处理进展；不会修改订单状态或资金。"/><div className="admin-help-text">本操作只写客服处理记录和操作审计，不会完成订单、退款或调整余额。</div></UI.AdminDetailSection> : null}
      </React.Fragment>;
    }

    const footer = detail ? <React.Fragment>
      <UI.Button disabled={actionLoading} onClick={function () { setDetail(null); setDetailError(''); }}>关闭</UI.Button>
      {detail.conversationId ? <UI.Button onClick={openWorkbench}>客服工作台</UI.Button> : null}
      {canWrite ? <UI.AdminConfirmAction kind="primary" loading={actionLoading} disabled={!recordText.trim()} title="保存处理记录" description="仅保存当前客服处理说明和审计记录，不修改订单或资金状态。" confirmLabel="确认保存" onConfirm={submitRecord}>保存记录</UI.AdminConfirmAction> : null}
    </React.Fragment> : null;

    const filters = <UI.AdminFilterBar advancedOpen={advancedOpen} onAdvancedToggle={function () { setAdvancedOpen(!advancedOpen); }} advanced={<React.Fragment>
      <label className="admin-filter-field">开始日期<input className="admin-input" type="date" value={dateFrom} onChange={function (event) { setDateFrom(event.target.value); }}/></label>
      <label className="admin-filter-field">结束日期<input className="admin-input" type="date" value={dateTo} onChange={function (event) { setDateTo(event.target.value); }}/></label>
    </React.Fragment>} actions={<React.Fragment><UI.Button onClick={resetFilters}>重置</UI.Button><UI.Button kind="primary" icon="search" onClick={function () { loadList(1); }}>查询</UI.Button></React.Fragment>}>
      <label className="admin-filter-field">关键词<input className="admin-input" value={keyword} onChange={function (event) { setKeyword(event.target.value); }} onKeyDown={function (event) { if (event.key === 'Enter') loadList(1); }} placeholder="纠纷号、订单号、UID或昵称"/></label>
      <label className="admin-filter-field">状态<select className="admin-select" value={status} onChange={function (event) { setStatus(event.target.value); }}><option value="">全部状态</option>{Object.keys(STATUS).map(function (key) { return <option value={key} key={key}>{STATUS[key].label}</option>; })}</select></label>
      <label className="admin-filter-field">纠纷类型<select className="admin-select" value={type} onChange={function (event) { setType(event.target.value); }}><option value="">全部类型</option>{Object.keys(TYPES).map(function (key) { return <option value={key} key={key}>{TYPES[key]}</option>; })}</select></label>
    </UI.AdminFilterBar>;

    return <UI.AdminListPage title="账号纠纷" description="集中查看普通账号交易纠纷、证据和客服处理记录；订单与资金仍由原交易规则控制。" actions={<UI.Button icon="refresh" loading={loading} onClick={function () { loadList(page); }}>刷新</UI.Button>} filters={filters}>
      {feedback ? <div className="admin-list-feedback" role="status">{feedback}</div> : null}
      {error ? <UI.ErrorState title="账号纠纷加载失败" description={error} onRetry={function () { loadList(page); }}/> : loading && !rows.length ? <UI.LoadingState label="正在加载账号纠纷"/> : !rows.length ? <UI.EmptyState title={filtersActive ? '当前筛选无结果' : '暂无账号纠纷'} description={filtersActive ? '请调整筛选条件后重试。' : '新的普通账号交易纠纷将在这里显示。'}/> : <React.Fragment>
        <UI.AdminDataTable columns={columns} rows={rows} rowKey={function (row) { return row.id; }} minWidth={1180}/>
        <UI.AdminMobileList rows={rows} rowKey={function (row) { return row.id; }} renderItem={mobileItem}/>
        <UI.AdminPagination page={page} totalPages={totalPages} total={total} onChange={function (nextPage) { loadList(nextPage); }}/>
      </React.Fragment>}
      <UI.AdminDetailDrawer open={detailLoading || Boolean(detail) || Boolean(detailError)} title="账号纠纷详情" subtitle={detail ? detail.disputeNo : ''} wide footer={footer} onClose={function () { if (!actionLoading) { setDetail(null); setDetailError(''); setRecordText(''); } }}>{renderDetail()}</UI.AdminDetailDrawer>
      <UI.AdminSecureImageViewer open={Boolean(previewEvidence)} title={previewEvidence ? '纠纷证据 ' + (previewEvidence.index + 1) : '纠纷证据'} url={previewEvidence && previewEvidence.url} token={NK.Api.Admin.getToken()} onClose={function () { setPreviewEvidence(null); }}/>
    </UI.AdminListPage>;
  }

  window.NK = window.NK || {};
  NK.AdminDisputesPage = AdminDisputesPage;
})();
