| | |
| | | import React, { useState, useEffect, useRef } from "react"; |
| | | import { Row, Col, Space, Tooltip, Button } from 'antd'; |
| | | import { Form, Input, Radio, Select, DatePicker, Cascader, Modal, Upload } from '@arco-design/web-react'; |
| | | import { Form, Input, Radio, Select, DatePicker, Cascader, Modal, Upload, InputNumber } from '@arco-design/web-react'; |
| | | import "@arco-design/web-react/dist/css/arco.css"; |
| | | import MyModal from '../../../../components/MyModal'; |
| | | import PersonCard from '../../../../components/personCard'; |
| | | import * as $$ from '../../../../utils/utility'; |
| | | import { |
| | | question1, image, link, |
| | | question1, |
| | | applyMaterials, |
| | | applyMaterials_active, |
| | | evidenceMaterials, |
| | |
| | | import AgentDialog from "./agentDialog"; |
| | | import DetailDialog from "./detailDialog"; |
| | | import FilesCheck from '../../../filesCheck'; |
| | | import { |
| | | IconFileAudio, |
| | | IconClose, |
| | | IconFaceFrownFill, |
| | | IconUpload, |
| | | IconLink, |
| | | } from '@arco-design/web-react/icon'; |
| | | |
| | | import NewFileCheck from '../../../filesCheck/newFileCheck'; |
| | | import { IconLink } from '@arco-design/web-react/icon'; |
| | | import MapView from './map' |
| | | |
| | | const RadioGroup = Radio.Group;// 根据调解案号获取纠纷登记信息 |
| | | const FormItem = Form.Item; |
| | |
| | | const [selectedAddress, setSelectedAddress] = useState(''); |
| | | const [fileTip, setFileTip] = useState('0'); |
| | | const [detailVisabled, setDetailVisabled] = useState(false);//查看信息弹窗控制 |
| | | const [mapView, setMapView] = useState(false); |
| | | const formRef = useRef(); |
| | | |
| | | |
| | | const addressOptions = [ |
| | | { label: '地址1', value: 'address1' }, |
| | |
| | | |
| | | const formType = (type) => { |
| | | if (type === '09_01010-1') { |
| | | //自然人 |
| | | //申请材料 |
| | | return ( |
| | | <> |
| | | <Col span={24}> |
| | |
| | | height={158} |
| | | onDrop={(e) => { |
| | | }} |
| | | onChange={(v) => { v.length > 0 && setFileTip(v.length); console.log(v, 'vvvvvvv') }} |
| | | showUploadList={{ |
| | | // Please dont remove this comment |
| | | fileIcon: <IconLink style={{ color: '#1D2129' }} />, |
| | | }} |
| | | onChange={(v) => { |
| | | setFileTip((prevLength) => { |
| | | if (v.length > 0) { |
| | | console.log(v, 'vvvvvvv'); |
| | | return v.length; |
| | | } |
| | | return v.length; |
| | | }); |
| | | }} |
| | | tip='支持png、 jpg、excel、word、pdf等格式的文件上传,每次上传大小不超过10M' |
| | | /> |
| | | |
| | | </FormItem> |
| | | {fileTip && <div style={{ position: 'absolute', top: '203px', left: '16px', color: '#86909C' }}> 申请材料累计上传:<span style={{ color: '#1A6FB8' }}>{fileTip}</span></div>} |
| | | {fileTip > 0 && <div style={{ position: 'absolute', top: '203px', left: '16px', color: '#86909C' }}> 申请材料累计上传:<span style={{ color: '#1A6FB8' }}>{fileTip}</span></div>} |
| | | </Col> |
| | | </> |
| | | ) |
| | | } |
| | | if (type === '09_01010-2') { |
| | | //证据材料 |
| | | return ( |
| | | <> |
| | | <Col span={24}> |
| | | <FormItem |
| | | field='file' |
| | | |
| | | > |
| | | <Upload |
| | | drag |
| | | multiple |
| | | accept='image/*' |
| | | action='/' |
| | | height={158} |
| | | onDrop={(e) => { |
| | | }} |
| | | showUploadList={{ |
| | | // Please dont remove this comment |
| | | fileIcon: <IconLink style={{ color: '#1D2129' }} />, |
| | | }} |
| | | onChange={(v) => { |
| | | setFileTip((prevLength) => { |
| | | if (v.length > 0) { |
| | | console.log(v, 'vvvvvvv'); |
| | | return v.length; |
| | | } |
| | | return v.length; |
| | | }); |
| | | }} |
| | | tip='支持png、 jpg、excel、word、pdf等格式的文件上传,每次上传大小不超过10M' |
| | | /> |
| | | |
| | | </FormItem> |
| | | {fileTip > 0 && <div style={{ position: 'absolute', top: '203px', left: '16px', color: '#86909C' }}> 证据材料累计上传:<span style={{ color: '#1A6FB8' }}>{fileTip}</span></div>} |
| | | </Col> |
| | | </> |
| | | ) |
| | | } |
| | | } |
| | | |
| | | const formItemLayout = { |
| | | labelCol: { |
| | | span: 4, |
| | | }, |
| | | wrapperCol: { |
| | | span: 17, |
| | | }, |
| | | }; |
| | | |
| | | const peopleMap = { |
| | | 0: '申请方', |
| | |
| | | caseNo: 'A20230101', |
| | | judicNo: '申请材料', |
| | | perClassName: '李晓明的纠纷化解申请表、身份证...', |
| | | inputUserName: '张三', |
| | | inputUserName: '0', |
| | | mediateUserName: '2024-7-12 12:00', |
| | | judgeName: '王五', |
| | | mediator: '赵六', |
| | |
| | | caseNo: 'A20230101', |
| | | judicNo: '证据材料', |
| | | perClassName: '李晓明的纠纷化解申请表、身份证...', |
| | | inputUserName: '张三', |
| | | inputUserName: '0', |
| | | mediateUserName: '2024-7-12 12:00', |
| | | judgeName: '王五', |
| | | mediator: '赵六', |
| | |
| | | title: '序号', |
| | | dataIndex: 'caseNo', |
| | | key: 'caseNo', |
| | | width: 60, |
| | | width: 100, |
| | | render: (text, record, index) => <span>{index + 1}</span>, |
| | | }, |
| | | { |
| | |
| | | dataIndex: 'inputUserName', |
| | | key: 'perClassName', |
| | | width: 180, |
| | | render: (text) => ( |
| | | <> |
| | | {text}份 |
| | | </> |
| | | ) |
| | | |
| | | |
| | | }, |
| | | { |
| | |
| | | setSelectedAddress(value); |
| | | }; |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | return ( |
| | | <div className='dataSync-page'> |
| | | |
| | | <Col span={24} style={{ display: 'flex', alignItems: 'center' }}> |
| | | <Space size='small'> |
| | | <div className='MediationInfo-subTitle' style={{ marginTop: '-9px' }}></div><h5>当事人信息</h5> |
| | |
| | | </Col> |
| | | <Col span={8}> |
| | | <FormItem label='来访人数(人)' field='visitingNumber'> |
| | | <Input placeholder='请填写' /> |
| | | <InputNumber placeholder='请填写' /> |
| | | </FormItem> |
| | | </Col> |
| | | <Col span={8}> |
| | |
| | | placeholder='选择纠纷发生地的详细地址' |
| | | searchButton='选择' |
| | | readOnly={true} // 设置为只读,防止直接编辑 |
| | | onSearch={() => setMapView(true)} |
| | | /> |
| | | </FormItem> |
| | | </Col> |
| | |
| | | </Col> |
| | | <Col span={8}> |
| | | <FormItem label='涉及人数(人)' field='peopleNumber'> |
| | | <Input placeholder='请填写' /> |
| | | <InputNumber placeholder='请填写' /> |
| | | </FormItem> |
| | | </Col> |
| | | |
| | | <Col span={8}> |
| | | <FormItem label='涉及金额(元)' field='money'> |
| | | <Input placeholder='请填写' /> |
| | | <InputNumber placeholder='请填写' /> |
| | | </FormItem> |
| | | </Col> |
| | | <Col span={24}> |
| | |
| | | > |
| | | <Upload |
| | | drag |
| | | multiple |
| | | // multiple |
| | | limit={1} |
| | | accept='image/*' |
| | | // action='/' |
| | | onDrop={(e) => { |
| | |
| | | </Modal> |
| | | <Modal style={{ width: '1200px' }} visible={filesCheck} onCancel={() => setFilesCheck(false)} footer={null} title='查看事件材料' centered> |
| | | <div className="mediationWindow-modal-main" style={{ display: 'flex' }}> |
| | | <FilesCheck /> |
| | | <NewFileCheck /> |
| | | </div> |
| | | </Modal> |
| | | <Modal |
| | |
| | | > |
| | | <DetailDialog /> |
| | | </Modal> |
| | | <Modal style={{ width: '1200px' }} visible={mapView} onCancel={() => setMapView(false)} footer={null} title='选择纠纷发生地' centered> |
| | | <Row gutter={[16, 0]}> |
| | | <Col span={16}> |
| | | <Form |
| | | ref={formRef} |
| | | requiredSymbol={false} |
| | | layout='inline' |
| | | {...formItemLayout} |
| | | style={{ marginBottom: '8px' }} |
| | | > |
| | | <FormItem |
| | | label='查询位置:' |
| | | field='name' |
| | | onChange={(e) => console.log(e.target.value, 'vvv')} |
| | | > |
| | | <Input placeholder='请输入' style={{ width: '510px' }} /> |
| | | </FormItem> |
| | | <Button style={{ marginRight: '20px' }}> |
| | | 重置 |
| | | </Button> |
| | | <Button |
| | | type="primary" |
| | | // onClick={handleSave} |
| | | > |
| | | 查询 |
| | | </Button> |
| | | </Form> |
| | | <MapView /> |
| | | </Col> |
| | | <Col span={8}> |
| | | <div style={{ color: '#86909C', marginTop: '43px' }}>附近地址</div> |
| | | </Col> |
| | | |
| | | </Row> |
| | | </Modal> |
| | | </div> |
| | | ) |
| | | } |
| | | |
| | | export default VisitorRegister; |
| | | export default VisitorRegister; |
| | | |
| | | |
| | | |
| | | |