From 6e6f0d5d192712b31949ee77734ae77fc90c66c1 Mon Sep 17 00:00:00 2001 From: zhangyongtian <1181606322@qq.com> Date: Sat, 17 Aug 2024 22:58:00 +0800 Subject: [PATCH] feat: 添加申请人 --- gz-customerSystem/src/views/register/visit/component/applyDialog.jsx | 34 +++++++++++----- gz-customerSystem/src/views/register/visit/component/visitorRegister.jsx | 49 +++++++++++++----------- gz-customerSystem/src/components/personCard/index.jsx | 15 ++++--- 3 files changed, 57 insertions(+), 41 deletions(-) diff --git a/gz-customerSystem/src/components/personCard/index.jsx b/gz-customerSystem/src/components/personCard/index.jsx index 30a1438..19113f0 100644 --- a/gz-customerSystem/src/components/personCard/index.jsx +++ b/gz-customerSystem/src/components/personCard/index.jsx @@ -26,7 +26,7 @@ <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)} @@ -38,18 +38,19 @@ <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> @@ -68,9 +69,9 @@ <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> + <div className="dataSync-btnApply" style={{ backgroundColor: '#3491FA' }} onClick={() => { handleAdd(2) }}>代理人</div> </Space>)} placement={data.length !== 0 && data.length % 3 === 0 ? 'left' : "right"} color='#ffff' diff --git a/gz-customerSystem/src/views/register/visit/component/applyDialog.jsx b/gz-customerSystem/src/views/register/visit/component/applyDialog.jsx index 582ff74..57e321f 100644 --- a/gz-customerSystem/src/views/register/visit/component/applyDialog.jsx +++ b/gz-customerSystem/src/views/register/visit/component/applyDialog.jsx @@ -28,7 +28,7 @@ const formRef = useRef(); const [perClass, setPerClass] = useState('09_01001-1'); const [visible, setVisible] = useState(false); - + const personIconType = (v) => { switch (v) { @@ -69,7 +69,7 @@ <Col span={12}> <FormItem label={(<div style={{ display: 'flex' }}>姓名<div className="must">必填</div></div>)} - field='name' + field='trueName' rules={[{ required: true, message: '请输入姓名' }]} > <Input placeholder='请填写' /> @@ -78,8 +78,11 @@ <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> @@ -102,8 +105,11 @@ <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='读取卡证' @@ -207,7 +213,7 @@ <FormItem label={isLegal ? '企业名称' : '机构名称'} rules={[{ required: true }]} - field='peopleNumber' + field='trueName' > <InputSearch searchButton='选择' @@ -217,7 +223,7 @@ </FormItem> </Col> <Col span={12}> - <FormItem label='联系方式' field='money'> + <FormItem label='联系方式' field='phoneNumber'> <Input placeholder='请填写' /> </FormItem> </Col> @@ -227,12 +233,12 @@ </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> @@ -264,7 +270,13 @@ 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() }); } } diff --git a/gz-customerSystem/src/views/register/visit/component/visitorRegister.jsx b/gz-customerSystem/src/views/register/visit/component/visitorRegister.jsx index 76c0cd6..659b1fb 100644 --- a/gz-customerSystem/src/views/register/visit/component/visitorRegister.jsx +++ b/gz-customerSystem/src/views/register/visit/component/visitorRegister.jsx @@ -34,16 +34,15 @@ 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: 3, + // perClassName: '申请方当事人', + // trueName: '蓝海科技有限公司', + // mobile: '9144010188453Z', + // company: true, + // companyName: '张晓梅',//公司法人 + // partyType: 0,//申请人:0,被申请人:1 + // }, // { // id: 1, // perClassName: '申请方代理人', @@ -53,17 +52,17 @@ // 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', + // 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: '被申请方代理人', @@ -430,7 +429,11 @@ setSelectedAddress(value); }; - + //添加当事人 + const handleAddParty = (value) => { + console.log(value); + setFakeData([...fakeData, value]) + } @@ -761,7 +764,7 @@ focusLock={true} footer={null} > - <ApplyDialog /> + <ApplyDialog dialogType={dialogType} onClose={() => setAddVisabled(false)} handleAddParty={handleAddParty}/> </Modal> <Modal title={'添加代理人'} -- Gitblit v1.8.0