From 33440bb15f8d7f07b68e34760129d3300cab5e88 Mon Sep 17 00:00:00 2001
From: zhangyongtian <1181606322@qq.com>
Date: Tue, 27 Aug 2024 10:57:21 +0800
Subject: [PATCH] feat:编辑当事人逻辑
---
gz-customerSystem/src/components/personCard/index.jsx | 85 ++++++++++++++++++++++++++++++------------
1 files changed, 60 insertions(+), 25 deletions(-)
diff --git a/gz-customerSystem/src/components/personCard/index.jsx b/gz-customerSystem/src/components/personCard/index.jsx
index b0fa5e3..fb4cf52 100644
--- a/gz-customerSystem/src/components/personCard/index.jsx
+++ b/gz-customerSystem/src/components/personCard/index.jsx
@@ -8,75 +8,110 @@
*/
import React from 'react';
import PropTypes from 'prop-types';
-import { Typography, Row, Col, Space } from 'antd';
-import { del } from '../../assets/images';
+import { Typography, Row, Col, Space, Tooltip } from 'antd';
+import { del, add } from '../../assets/images';
const { Link, Text } = Typography;
/**
* isCheck, // 是否无操作
- * partyType, // applicant:申请人, respondent:被申请人
* data, // 当事人数据
* handleCheckParty, // 点击查看详情
* handleDeleteParty, // 删除当事人
*/
-const PersonCard = ({ isCheck, partyType, data, handleCheckParty, handleDeleteParty }) => {
- const remark = [{ label: '精神障碍', color: '#C64FBE' }, { label: '吸毒', color: '#D8A247' }, { label: '社区矫正', color: '#B82F6E' }, { label: '刑满释放', color: '#199C8F' }, { label: '流浪', color: '#3ECB7A' }, { label: '重点青少年', color: '#117AC1' }, { label: '涉稳涉访', color: '#6865D7' }, { label: '潜在风险', color: '#2661CE' }]
-
+const PersonCard = ({ isCheck, data, handleCheckParty, handleDeleteParty, handleAdd, handleEdit }) => {
+ let isAgent = false
+ let isAgentFor = false
+ const typeList = data.map(item => {
+ return item.partyType
+ })//获取有多少申请人和被申请人
+ if (typeList.indexOf(0) != -1) {
+ isAgent = true
+ }
+ if (typeList.indexOf(1) != -1) {
+ isAgentFor = true
+ }
return (
<Row gutter={[24, 16]}>
{data.map((x, t) => (
- <Col span={8} key={t}>
+ <Col span={7} key={t}>
<div className="public-personCard" style={{ cursor: 'pointer' }}>
<div
- className={`public-personCard-card public-personCard-card-${partyType === 'applicant' ? 'blue' : 'orange'}`}
- onClick={() => handleCheckParty({ type: partyType, editType: 'check', values: x })}
+ className={`public-personCard-card public-personCard-card-${(x.partyType === 0 || x.partyType === 2) ? 'blue' : 'orange'}`}
+ onClick={() => handleCheckParty(x)}
>
{x.trueName.substr(0, 1)}
<div className="public-personCard-card-check">查看</div>
- <img src={del} alt='' style={{ width: '16px', height: '16px', position: 'absolute', top: '-8px', left: '56px' }} />
+ <img
+ src={del}
+ alt=''
+ style={{ width: '16px', height: '16px', position: 'absolute', top: '-8px', left: '56px' }}
+ onClick={(event) => { handleDeleteParty(event, x) }}
+ />
</div>
<div className="public-personCard-content">
<div className="public-personCard-title">
<Text style={{ maxWidth: '80%', paddingRight: '8px' }} ellipsis={{ tooltip: x.trueName }}>
{x.trueName}
</Text>
- <div className={`public-personCard-tag public-personCard-tag-${partyType === 'applicant' ? 'blue' : 'orange'}`}>
+ <Text onClick={() => { handleEdit(x) }} ellipsis={{ tooltip: x.perClassName }} className={`public-personCard-tag public-personCard-tag-${(x.partyType === 0 || x.partyType === 2) ? 'blue' : 'orange'}`}>
{x.perClassName}
- </div>
+ </Text>
</div>
{
- x.person &&
+ (x.perClass === '09_01001-1' || !x.perClass) &&
<>
<div>证件号码：{x.mobile}</div>
- <div>联系方式：{x.agentStatus === '2' ? '有' : '无'}</div>
+ <div>联系方式：{x.personNumber}</div>
</>
}
- {x.company &&
+ {
+ x.perClass === '09_01001-2' &&
<>
<div>统一社会信用代码：{x.mobile}</div>
- <div>法定代表人：{x.agentStatus === '2' ? '有' : '无'}</div>
+ <div>法定代表人：{x.companyName}</div>
</>
}
- {x.Respondent &&
- <Space style={{ display: 'flex', flexWrap: 'wrap' }}>
- {remark.map((item, index) => (
- <div key={index} style={{ lineHeight: '22px', padding: '0px 8px', backgroundColor: `${item.color}`, width: 'fit-content', borderRadius: '4px', marginTop: '4px' }}>{item.label}</div>
- ))}
- </Space>
+ {
+ x.perClass === '09_01001-3' &&
+ <>
+ <div>组织机构代码：{x.mobile}</div>
+ <div>机构代表人：{x.companyName}</div>
+ </>
}
-
-
+ <Space style={{ display: 'flex', flexWrap: 'wrap' }}>
+ {x.remark?.map((item, index) => (
+ <div key={index} style={{ lineHeight: '22px', padding: '0px 8px', backgroundColor: `${item.color}`, width: 'fit-content', borderRadius: '4px', marginTop: '4px', color: '#fff' }}>{item.label}</div>
+ ))}
+ </Space>
</div>
</div>
</Col>
))}
+ <Col span={3}>
+ <div className="dataSync-addBtn">
+ <Tooltip
+ title={(<Space direction='vertical '>
+ <div className="dataSync-btnApply" style={{ backgroundColor: '#1A6FB8' }} onClick={() => { handleAdd(0) }}>申请方当事人</div>
+ {isAgent && <div className="dataSync-btnApply" style={{ backgroundColor: '#3491FA' }} onClick={() => { handleAdd(2) }}>申请方代理人</div>}
+ <div className="dataSync-btnApply" style={{ backgroundColor: '#EF6C24' }} onClick={() => { handleAdd(1) }}>被申请方当事人</div>
+ {isAgentFor && <div className="dataSync-btnApply" style={{ backgroundColor: '#FA8C16' }} onClick={() => { handleAdd(3) }}>被申请方代理人</div>}
+ </Space>)}
+ placement={data.length !== 0 && data.length % 3 === 0 ? 'left' : "right"}
+ color='#ffff'
+ overlayStyle={{}}
+ >
+ <div style={{ backgroundColor: '#f2f3f5', borderRadius: '50%', width: '64px', height: '64px' }}>
+ <img src={add} alt="添加" style={{ width: '32px', margin: '16px' }} />
+ </div>
+ </Tooltip>
+ </div>
+ </Col>
</Row>
);
};
PersonCard.propTypes = {
isCheck: PropTypes.bool,
- partyType: PropTypes.string,
data: PropTypes.array,
handleCheckParty: PropTypes.func,
handleDeleteParty: PropTypes.func,
--
Gitblit v1.8.0