Merge branch 'master' of http://120.79.193.119:9090/r/gzzfw/frontEnd/gzDyh into master
| | |
| | | * handleDeleteParty, // 删除当事人 |
| | | */ |
| | | const PersonCard = ({ isCheck, data, handleCheckParty, handleDeleteParty, handleAdd }) => { |
| | | |
| | | let isAgent = false |
| | | const typeList = data.map(item => { |
| | | return item.partyType |
| | | })//获取有多少申请人和被申请人 |
| | | if (typeList.indexOf(0) != -1 && typeList.indexOf(1) != -1) { |
| | | isAgent = true |
| | | } |
| | | return ( |
| | | <Row gutter={[24, 16]}> |
| | | {data.map((x, t) => ( |
| | | <Col span={7} key={t}> |
| | | <div className="public-personCard" style={{ cursor: 'pointer' }}> |
| | | <div |
| | | className={`public-personCard-card public-personCard-card-${x.partyType === 'applicant' ? 'blue' : 'orange'}`} |
| | | className={`public-personCard-card public-personCard-card-${x.partyType === 0 ? '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> |
| | | <Text ellipsis={{ tooltip: x.perClassName }} className={`public-personCard-tag public-personCard-tag-${x.partyType === 'applicant' ? 'blue' : 'orange'}`}> |
| | | <Text ellipsis={{ tooltip: x.perClassName }} className={`public-personCard-tag public-personCard-tag-${x.partyType === 0 ? 'blue' : 'orange'}`}> |
| | | {x.perClassName} |
| | | </Text> |
| | | </div> |
| | | { |
| | | x.person && |
| | | x.perClass === '09_01001-1' && |
| | | <> |
| | | <div>证件号码:{x.mobile}</div> |
| | | <div>联系方式:{x.personNumber}</div> |
| | | </> |
| | | } |
| | | {x.company && |
| | | { |
| | | x.perClass === '09_01001-2' && |
| | | <> |
| | | <div>统一社会信用代码:{x.mobile}</div> |
| | | <div>法定代表人:{x.companyName}</div> |
| | | </> |
| | | } |
| | | { |
| | | x.perClass === '09_01001-3' && |
| | | <> |
| | | <div>组织机构代码:{x.mobile}</div> |
| | | <div>机构代表人:{x.companyName}</div> |
| | | </> |
| | | } |
| | | <Space style={{ display: 'flex', flexWrap: 'wrap' }}> |
| | |
| | | <div className="dataSync-addBtn"> |
| | | <Tooltip |
| | | title={(<Space direction='vertical '> |
| | | <div className="dataSync-btnApply" style={{ backgroundColor: '#1A6FB8' }} onClick={() => {handleAdd(0)}}>申请方</div> |
| | | <div className="dataSync-btnApply" style={{ backgroundColor: '#FA8C16' }} onClick={() => {handleAdd(1)}}>被申请方</div> |
| | | <div className="dataSync-btnApply" style={{ backgroundColor: '#3491FA' }} onClick={() => {handleAdd(2)}}>代理人</div> |
| | | <div className="dataSync-btnApply" style={{ backgroundColor: '#1A6FB8' }} onClick={() => { handleAdd(0) }}>申请方</div> |
| | | <div className="dataSync-btnApply" style={{ backgroundColor: '#FA8C16' }} onClick={() => { handleAdd(1) }}>被申请方</div> |
| | | {isAgent && <div className="dataSync-btnApply" style={{ backgroundColor: '#3491FA' }} onClick={() => { handleAdd(2) }}>代理人</div>} |
| | | </Space>)} |
| | | placement={data.length !== 0 && data.length % 3 === 0 ? 'left' : "right"} |
| | | color='#ffff' |
| | |
| | | const CheckboxGroup = Checkbox.Group; |
| | | |
| | | export default function AgentDialog(props) { |
| | | const formRef = useRef(); |
| | | |
| | | //保存信息 |
| | | const handleSave = () => { |
| | | if (formRef.current) { |
| | | formRef.current.validate(undefined, (errors, values) => { |
| | | props.handleAddParty({ |
| | | ...values, |
| | | // partyType: props.dialogType, |
| | | // perClass: perClass, |
| | | // perClassName: props.dialogType === 0 ? '申请方代理人' : '被申请方当事人' |
| | | }) |
| | | props.onClose() |
| | | }); |
| | | } |
| | | } |
| | | return ( |
| | | <div className="applyDialog"> |
| | | <div style={{ height: '590px', overflowY: 'scroll' }}> |
| | | <Row gutter={[16, 16]} style={{ margin: '0 2px 0 0' }}> |
| | | <Col span={24}> |
| | | <Form |
| | | ref={props.formRef} |
| | | ref={formRef} |
| | | layout='vertical' |
| | | requiredSymbol={false} |
| | | initialValues={{ |
| | |
| | | <Col span={12}> |
| | | <FormItem |
| | | label={(<div style={{ display: 'flex' }}>姓名<div className="must">必填</div></div>)} |
| | | field='name' |
| | | field='trueName' |
| | | rules={[{ required: true, message: '请输入姓名' }]} |
| | | > |
| | | <Input placeholder='请填写' /> |
| | | </FormItem> |
| | |
| | | <Col span={12}> |
| | | <FormItem |
| | | label={(<div style={{ display: 'flex' }}>联系方式<div className="must">必填</div></div>)} |
| | | field='phone' |
| | | field='personNumber' |
| | | rules={[ |
| | | { required: true, message: '请输入联系方式' }, |
| | | { match: /^\+?(\d{1,3})?[-. (]*(\d{3})[-. )]*(\d{3})[-. ]*(\d{4})$/, message: '请输入正确的电话号码' }, |
| | | ]} |
| | | > |
| | | <Input placeholder='请填写' /> |
| | | </FormItem> |
| | |
| | | <Col span={12}> |
| | | <FormItem |
| | | label={(<div style={{ display: 'flex' }}>证件类型<div className="must">必填</div></div>)} |
| | | field='zhengjian' |
| | | field='docType' |
| | | rules={[{ required: true, message: '请选择证件类型' }]} |
| | | > |
| | | <Select placeholder='请选择' allowClear> |
| | | {['居民身份证',].map((option, index) => ( |
| | |
| | | <Col span={12}> |
| | | <FormItem |
| | | label={(<div style={{ display: 'flex' }}>证件号码<div className="must">必填</div></div>)} |
| | | rules={[{ required: true }]} |
| | | field='peopleNumber' |
| | | rules={[ |
| | | { required: true, message: '请输入证件号码' }, |
| | | { match: /^[1-9]\d{5}(19|20)\d{2}(0[1-9]|1[0-2])(0[1-9]|[12][0-9]|3[01])\d{3}(\d|X)$/, message: '请输入正确的证件号码' } |
| | | ]} |
| | | field='mobile' |
| | | > |
| | | <InputSearch |
| | | searchButton='读取卡证' |
| | |
| | | rules={[{ required: true }]} |
| | | field='dailimap' |
| | | > |
| | | <CheckboxGroup direction='vertical' options={['张三丰', '广东好又多贸易有限公司', '广东科贸创意有限公司']} /> |
| | | <CheckboxGroup |
| | | direction='vertical' |
| | | options={props.fakeData.map(x => ({ |
| | | label: <span>{x.trueName} <span style={{ color: '#86909c' }}>({x.perClassName})</span></span>, |
| | | value: x.id, |
| | | }))} |
| | | > |
| | | </CheckboxGroup> |
| | | </FormItem> |
| | | </Col> |
| | | </Row> |
| | |
| | | <Button |
| | | type="primary" |
| | | className="dialogPrimary" |
| | | // onClick={handleSave} |
| | | onClick={handleSave} |
| | | > |
| | | 保存信息 |
| | | </Button> |
| | |
| | | const formRef = useRef(); |
| | | const [perClass, setPerClass] = useState('09_01001-1'); |
| | | const [visible, setVisible] = useState(false); |
| | | |
| | | |
| | | |
| | | const personIconType = (v) => { |
| | | switch (v) { |
| | |
| | | <Col span={12}> |
| | | <FormItem |
| | | label={(<div style={{ display: 'flex' }}>姓名<div className="must">必填</div></div>)} |
| | | field='name' |
| | | field='trueName' |
| | | rules={[{ required: true, message: '请输入姓名' }]} |
| | | > |
| | | <Input placeholder='请填写' /> |
| | |
| | | <Col span={12}> |
| | | <FormItem |
| | | label={(<div style={{ display: 'flex' }}>联系方式<div className="must">必填</div></div>)} |
| | | field='phone' |
| | | rules={[{ required: true, message: '请输入联系方式' }]} |
| | | field='personNumber' |
| | | rules={[ |
| | | { required: true, message: '请输入联系方式' }, |
| | | { match: /^\+?(\d{1,3})?[-. (]*(\d{3})[-. )]*(\d{3})[-. ]*(\d{4})$/, message: '请输入正确的电话号码' }, |
| | | ]} |
| | | > |
| | | <Input placeholder='请填写' /> |
| | | </FormItem> |
| | |
| | | <Col span={12}> |
| | | <FormItem |
| | | label={(<div style={{ display: 'flex' }}>证件号码<div className="must">必填</div></div>)} |
| | | rules={[{ required: true, message: '请输入证件号码' }]} |
| | | field='peopleNumber' |
| | | rules={[ |
| | | { required: true, message: '请输入证件号码' }, |
| | | { match: /^[1-9]\d{5}(19|20)\d{2}(0[1-9]|1[0-2])(0[1-9]|[12][0-9]|3[01])\d{3}(\d|X)$/, message: '请输入正确的证件号码' } |
| | | ]} |
| | | field='mobile' |
| | | > |
| | | <InputSearch |
| | | searchButton='读取卡证' |
| | |
| | | <FormItem |
| | | label={isLegal ? '企业名称' : '机构名称'} |
| | | rules={[{ required: true }]} |
| | | field='peopleNumber' |
| | | field='trueName' |
| | | > |
| | | <InputSearch |
| | | searchButton='选择' |
| | |
| | | </FormItem> |
| | | </Col> |
| | | <Col span={12}> |
| | | <FormItem label='联系方式' field='money'> |
| | | <FormItem label='联系方式' field='phoneNumber'> |
| | | <Input placeholder='请填写' /> |
| | | </FormItem> |
| | | </Col> |
| | |
| | | </FormItem> |
| | | </Col> |
| | | <Col span={12}> |
| | | <FormItem label={isLegal ? '统一社会信用代码' : '组织机构代码'} field='money'> |
| | | <FormItem label={isLegal ? '统一社会信用代码' : '组织机构代码'} field='mobile'> |
| | | <Input placeholder='请填写' /> |
| | | </FormItem> |
| | | </Col> |
| | | <Col span={12}> |
| | | <FormItem label={isLegal ? '法定代表人' : '机构代表人'} field='money'> |
| | | <FormItem label={isLegal ? '法定代表人' : '机构代表人'} field='companyName'> |
| | | <Input placeholder='请填写' /> |
| | | </FormItem> |
| | | </Col> |
| | |
| | | const handleSave = () => { |
| | | if (formRef.current) { |
| | | formRef.current.validate(undefined, (errors, values) => { |
| | | console.log(errors, values); |
| | | props.handleAddParty({ |
| | | ...values, |
| | | partyType: props.dialogType, |
| | | perClass: perClass, |
| | | perClassName: props.dialogType === 0 ? '申请方当事人' : '被申请方当事人' |
| | | }) |
| | | props.onClose() |
| | | }); |
| | | } |
| | | } |
| | |
| | | const VisitorRegister = (props) => { |
| | | const [dialogType, setDialogType] = useState(0);//添加当事人的类型 |
| | | const [addVisabled, setAddVisabled] = useState(false);//添加当事人弹窗控制 |
| | | const [fakeData, setFakeData] = useState([ |
| | | { |
| | | id: 3, |
| | | perClassName: '申请方当事人', |
| | | trueName: '蓝海科技有限公司', |
| | | mobile: '9144010188453Z', |
| | | company: true, |
| | | companyName: '张晓梅',//公司法人 |
| | | partyType: 'applicant',//申请人 |
| | | type: 0,//申请人: 0、被申请人: 1、代理人: 2 |
| | | }, |
| | | // { |
| | | // id: 1, |
| | | // perClassName: '申请方代理人', |
| | | // trueName: '王小明', |
| | | // mobile: '410106198802121125', |
| | | // person: true, |
| | | // personNumber: '13388888888',//联系方式 |
| | | // partyType: 'applicant', |
| | | // }, |
| | | { |
| | | id: 2, |
| | | perClassName: '被申请方当事人', |
| | | trueName: '大海科技有限公司', |
| | | mobile: '13800000002', |
| | | company: true, |
| | | companyName: '郭小聪',//公司法人 |
| | | partyType: 'respondent',//被申请方 |
| | | type: 1, |
| | | 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' }] |
| | | }, |
| | | // { |
| | | // id: 2, |
| | | // perClassName: '被申请方代理人', |
| | | // trueName: '张三', |
| | | // mobile: '13800000002', |
| | | // person: true, |
| | | // personNumber: '13399999999',//联系方式 |
| | | // partyType: 'respondent', |
| | | // remark: [{ label: '精神障碍', color: '#C64FBE' }] |
| | | // }, |
| | | // { |
| | | // id: 2, |
| | | // perClassName: '被申请方代理人', |
| | | // trueName: '张三', |
| | | // mobile: '13800000002', |
| | | // person: true, |
| | | // personNumber: '13399999999',//联系方式 |
| | | // partyType: 'respondent', |
| | | // remark: [{ label: '精神障碍', color: '#C64FBE' }] |
| | | // }, |
| | | // { |
| | | // id: 2, |
| | | // perClassName: '被申请方代理人', |
| | | // trueName: '张三', |
| | | // mobile: '13800000002', |
| | | // person: true, |
| | | // personNumber: '13399999999',//联系方式 |
| | | // partyType: 'respondent', |
| | | // remark: [{ label: '精神障碍', color: '#C64FBE' }] |
| | | // }, |
| | | ]);//当事人信息数据 |
| | | const [fakeData, setFakeData] = useState([]);//当事人信息数据 |
| | | const [scanFile, setScanFile] = useState(false); |
| | | const [filesList, setFilesList] = useState([]); |
| | | const [scanImage, setScanImage] = useState(false); |
| | |
| | | const [fileTip, setFileTip] = useState('0'); |
| | | const [detailVisabled, setDetailVisabled] = useState(false);//查看信息弹窗控制 |
| | | const [mapView, setMapView] = useState(false); |
| | | const [flagId, setFlagId] = useState(0);//赋予当事人唯一id,用于删除 |
| | | const formRef = useRef(); |
| | | |
| | | |
| | |
| | | return [evidenceMaterials, evidenceMaterials_active]; |
| | | } |
| | | } |
| | | |
| | | |
| | | |
| | | |
| | | const formType = (type) => { |
| | | if (type === '09_01010-1') { |
| | |
| | | //查看 |
| | | const handleCheckParty = (value) => { |
| | | console.log(value); |
| | | setDialogType(value.type) |
| | | setDialogType(value.partyType) |
| | | setDetailVisabled(true) |
| | | } |
| | | |
| | |
| | | setSelectedAddress(value); |
| | | }; |
| | | |
| | | //添加当事人 |
| | | const handleAddParty = (value) => { |
| | | console.log(value); |
| | | setFakeData([...fakeData, { |
| | | ...value, |
| | | id: flagId |
| | | }]) |
| | | setFlagId(flagId + 1) |
| | | } |
| | | |
| | | |
| | | //删除当事人 |
| | | const handleDeleteParty = (event, value) => { |
| | | event.stopPropagation(); |
| | | const filterData = fakeData.filter(item => item.id !== value.id) |
| | | setFakeData(filterData) |
| | | } |
| | | |
| | | |
| | | return ( |
| | |
| | | data={fakeData} |
| | | handleCheckParty={handleCheckParty} |
| | | handleAdd={handleAdd} |
| | | handleDeleteParty={handleDeleteParty} |
| | | /> |
| | | </div> |
| | | <Col span={24} style={{ display: 'flex', alignItems: 'center', marginBottom: '8px' }}> |
| | |
| | | focusLock={true} |
| | | footer={null} |
| | | > |
| | | <ApplyDialog /> |
| | | <ApplyDialog |
| | | dialogType={dialogType} |
| | | onClose={() => setAddVisabled(false)} |
| | | handleAddParty={handleAddParty} |
| | | /> |
| | | </Modal> |
| | | <Modal |
| | | title={'添加代理人'} |
| | |
| | | focusLock={true} |
| | | footer={null} |
| | | > |
| | | <AgentDialog /> |
| | | <AgentDialog |
| | | handleAddParty={handleAddParty} |
| | | onClose={() => setAgentVisible(false)} |
| | | fakeData={fakeData} |
| | | /> |
| | | </Modal> |
| | | <Modal |
| | | title={'查看' + peopleMap[dialogType]} |