import React, { useState, useEffect } from 'react';
|
import { useHistory, useLocation } from 'react-router-dom';
|
import NavBarPage from '../../../components/NavBarPage';
|
import PartyInfo from './partyInfo';
|
import { Input, Button, Toast } from 'dingtalk-design-mobile';
|
import { SearchOutlined, WriteEditOutlined } from 'dd-icons';
|
import './index.less';
|
import * as $$ from '../../../utils/utility';
|
|
function getIdApi() {
|
return $$.ax.request({ url: `caseUtils/getNewTimeId`, type: 'get', service: 'utils' });
|
}
|
|
const LegalPerson = () => {
|
const history = useHistory();
|
const location = useLocation();
|
const perType = $$.getQueryString('perType');
|
const perTypeName = $$.getQueryString('perTypeName');
|
const edit = $$.getQueryString('edit');
|
|
const [isSelectPage, setIsSelectPage] = useState(false);
|
const [searchValue, setSearchValue] = useState('');
|
const [selectedType, setSelectedType] = useState('natural');
|
const [isManualInput, setIsManualInput] = useState(false);
|
const [showList, setShowList] = useState(false);
|
const [selectedCompany, setSelectedCompany] = useState(null);
|
const [searchKeyword, setSearchKeyword] = useState('');
|
const [isFromCaseDesClick, setIsFromCaseDesClick] = useState(false); // 记录是否从caseDes弹窗点击进入
|
const [newId, setNewId] = useState('');
|
// 编辑的对象
|
const [editObj, setEditObj] = useState({});
|
|
async function getId() {
|
const res = await getIdApi();
|
if (res.type) {
|
setNewId(res.data);
|
setEditObj({ id: res.data || '', perType, perTypeName });
|
}
|
}
|
|
//
|
useEffect(() => {
|
if (edit === 'false') {
|
getId();
|
} else {
|
// 获取编辑的对象
|
const newData = $$.getLocal('case_personnel_data');
|
setEditObj(newData);
|
}
|
}, []);
|
|
const handleSearch = () => {
|
setSearchKeyword(searchValue);
|
setShowList(true);
|
};
|
|
// 高亮显示搜索文本的函数
|
const highlightText = (text, keyword) => {
|
if (!keyword.trim() || !text.includes(keyword)) {
|
return <span>{text}</span>;
|
}
|
|
const parts = text.split(new RegExp(`(${keyword})`, 'gi'));
|
return (
|
<span className="text-container">
|
{parts.map((part, index) =>
|
part.toLowerCase() === keyword.toLowerCase() ? (
|
<span key={index} className="highlight-text">
|
{part}
|
</span>
|
) : (
|
<span key={index}>{part}</span>
|
)
|
)}
|
</span>
|
);
|
};
|
|
const handleBack = () => {
|
if (isManualInput) {
|
setIsManualInput(false);
|
} else {
|
history.goBack();
|
}
|
};
|
|
// 处理公司卡片点击事件
|
const handleCompanySelect = (company) => {
|
setSelectedCompany(company);
|
setIsSelectPage(false);
|
setIsManualInput(true);
|
|
// 选择公司后提示用户
|
Toast.success({
|
content: '已选择企业',
|
duration: 1,
|
});
|
};
|
|
const testSelectList = [];
|
|
return (
|
<>
|
{isSelectPage ? (
|
<>
|
<NavBarPage
|
leftContentVisible={true}
|
title={selectedType === 'legal' ? '选择企业' : '选择组织'}
|
leftContentFunc={setIsSelectPage}
|
rightContentFunc={() => {
|
setIsSelectPage(false);
|
setIsManualInput(true);
|
}}
|
rightChildren={
|
<>
|
<WriteEditOutlined />
|
手动填写
|
</>
|
}
|
/>
|
<div className="main-container">
|
<div className="search-container">
|
<div className="search-context">
|
<div className="search-icon">
|
<SearchOutlined />
|
</div>
|
<Input placeholder="企业名称/统一社会信用代码" value={searchValue} onChange={(value) => setSearchValue(value)} />
|
|
<div className="search-button" onClick={handleSearch}>
|
<p className="search-split">|</p>
|
<p className="search-text">查询</p>
|
</div>
|
</div>
|
</div>
|
{showList ? (
|
<div className="company-list">
|
{testSelectList.map((item, index) => (
|
<div key={index} className="company-item" onClick={() => handleCompanySelect(item)}>
|
<div className="company-title">{highlightText(item.title, searchKeyword)}</div>
|
<div className="company-info">
|
<div>
|
<span className="label">统一社会信用代码：</span>
|
<span className="value">{highlightText(item.creditCode, searchKeyword)}</span>
|
</div>
|
<div>
|
<span className="label">法定代表人：</span>
|
<span className="value">{highlightText(item.legalPerson, searchKeyword)}</span>
|
</div>
|
<div>
|
<span className="label">企业所在地：</span>
|
<span className="value">{highlightText(item.companyLocation, searchKeyword)}</span>
|
</div>
|
</div>
|
</div>
|
))}
|
</div>
|
) : (
|
<div className="select-none">
|
<div className="select-icon"></div>
|
<div className="select-icon-text">暂无数据</div>
|
</div>
|
)}
|
</div>
|
</>
|
) : (
|
<>
|
<NavBarPage leftContentVisible={true} title={(edit === 'true' ? '修改' : '添加') + getTitle(perType)} leftContentFunc={handleBack} />
|
<PartyInfo
|
setIsSelectPage={setIsSelectPage}
|
selectedType={selectedType}
|
setSelectedType={setSelectedType}
|
isManualInput={isManualInput}
|
setIsManualInput={setIsManualInput}
|
selectedCompany={selectedCompany}
|
role={perType} // 传递角色信息给PartyInfo组件
|
editObj={editObj}
|
isFromCaseDes={isFromCaseDesClick} // 传递是否从caseDes点击进入的标志给PartyInfo组件
|
/>
|
</>
|
)}
|
</>
|
);
|
};
|
|
// 根据角色获取标题
|
function getTitle(role) {
|
switch (role) {
|
case '15_020008-1':
|
return '申请方当事人';
|
case '24_00006-1':
|
return '申请方代理人';
|
case '15_020008-2':
|
return '被申请方当事人';
|
case '24_00006-2':
|
return '被申请方代理人';
|
default:
|
return '';
|
}
|
}
|
|
export default LegalPerson;
|
