chengmw
9 days ago 96f4f1ea3a088d315a60c65bae50b5074441bf4c
web-app/src/components/dashboard/PartyInfoCard.jsx
@@ -4,11 +4,15 @@
 */
import React, { useState, useEffect, useCallback } from 'react';
import { Avatar, Tag } from 'antd';
import { UserOutlined, TeamOutlined } from '@ant-design/icons';
import { Tag } from 'antd';
import { useCaseData } from '../../contexts/CaseDataContext';
import MediationTimelineAPIService from '../../services/MediationTimelineAPIService';
import './PartyInfoCard.css';
// 申请人头像图片
const APPLICANT_AVATAR = '/in_person.png';
// 被申请人头像图片
const RESPONDENT_AVATAR = '/to_person.png';
@@ -41,8 +45,7 @@
 * 当事人信息卡片
 */
const PartyCard = ({ person, isApplicantSide }) => {
  const avatarIcon = isApplicantSide ? <UserOutlined /> : <TeamOutlined />;
  const avatarBg = isApplicantSide ? '#1a6fb8' : '#faad14';
  const avatarSrc = isApplicantSide ? APPLICANT_AVATAR : RESPONDENT_AVATAR;
  return (
    <div className={`party-card ${isApplicantSide ? 'applicant' : 'respondent'}`}>
@@ -54,11 +57,10 @@
      )}
      
      {/* 头像 */}
      <Avatar
        size={48}
        icon={avatarIcon}
        style={{ backgroundColor: avatarBg }}
        className="party-avatar"
      <img
        src={avatarSrc}
        alt={isApplicantSide ? '申请人' : '被申请人'}
        className="party-avatar-img"
      />
      
      {/* 角色标签 */}
@@ -72,12 +74,17 @@
  );
};
// VS分隔符图片
const VS_ICON = '/join.png';
/**
 * VS分隔符
 */
const VSSeparator = () => (
  <div className="vs-separator">
    <span className="vs-icon">⚖</span>
    <div className="vs-line vs-line-left"></div>
    <img src={VS_ICON} alt="VS" className="vs-icon-img" />
    <div className="vs-line vs-line-right"></div>
  </div>
);