From e4a96c9f1d07f283c0205f8306ccdf892bddf9e8 Mon Sep 17 00:00:00 2001 From: dminyi <1301963064@qq.com> Date: Fri, 16 Aug 2024 09:56:12 +0800 Subject: [PATCH] Merge branch 'master' of http://120.79.193.119:9090/r/gzzfw/frontEnd/gzDyh into master --- gz-customerSystem/src/views/register/visit/component/visitorRegister.jsx | 176 +++++++++++++++++++++++++++++++++++++++++++++++++++++++--- 1 files changed, 167 insertions(+), 9 deletions(-) diff --git a/gz-customerSystem/src/views/register/visit/component/visitorRegister.jsx b/gz-customerSystem/src/views/register/visit/component/visitorRegister.jsx index a4be24d..eca3244 100644 --- a/gz-customerSystem/src/views/register/visit/component/visitorRegister.jsx +++ b/gz-customerSystem/src/views/register/visit/component/visitorRegister.jsx @@ -1,13 +1,32 @@ 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 "@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 } from '../../../../assets/images'; -import { Row, Col, Space, Tooltip } from 'antd'; -import { Form, Input, Button, Radio, Select, DatePicker, Cascader, Modal } from '@arco-design/web-react'; +import { + question1, image, link, + applyMaterials, + applyMaterials_active, + evidenceMaterials, + evidenceMaterials_active, + +} from '../../../../assets/images'; +import { CheckOutlined, } from '@ant-design/icons'; import "@arco-design/web-react/dist/css/arco.css"; import TableView from '../../../../components/TableView'; import '../../index.less'; import ApplyDialog from "./applyDialog"; +import FilesCheck from '../../../filesCheck'; +import { + IconFileAudio, + IconClose, + IconFaceFrownFill, + IconUpload, + IconLink, +} from '@arco-design/web-react/icon'; + const RadioGroup = Radio.Group;// 根据调解案号获取纠纷登记信息 const FormItem = Form.Item; @@ -16,6 +35,8 @@ const VisitorRegister = (props) => { + const [dialogType, setDialogType] = useState(0);//添加当事人的类型 + const [addVisabled, setAddVisabled] = useState(false);//添加当事人弹窗控制 const [fakeData, setFakeData] = useState([ // { // id: 3, @@ -76,8 +97,51 @@ // remark: [{ label: '精神障碍', color: '#C64FBE' }] // }, ]);//当事人信息数据 - const [dialogType, setDialogType] = useState(0);//添加当事人的类型 - const [addVisabled, setAddVisabled] = useState(false);//添加当事人弹窗控制 + const [scanFile, setScanFile] = useState(false); + const [filesList, setFilesList] = useState([]); + const [scanImage, setScanImage] = useState(false); + const [scaned, setScaned] = useState(false); + const [upload, setUpLoad] = useState(false); + const [sourceType, setSourceType] = useState('09_01010-1'); + const [filesCheck, setFilesCheck] = useState(false); + + const personIconType = (v) => { + switch (v) { + case '09_01010-1': + return [applyMaterials, applyMaterials_active, + ]; + case '09_01010-2': + return [evidenceMaterials, evidenceMaterials_active]; + } + } + + const formType = (type) => { + if (type === '09_01010-1') { + //自然人 + return ( + <> + <Col span={24}> + <FormItem + field='file' + > + <Upload + drag + multiple + accept='image/*' + action='/' + height={158} + onDrop={(e) => { + }} + tip='支持png、 jpg、excel、word、pdf等格式的文件上传,每次上传大小不超过10M' + /> + + + </FormItem> + </Col> + </> + ) + } + } const peopleMap = { 0: '申请方', @@ -145,10 +209,10 @@ width: 120, render: (text) => ( <div style={{ display: 'flex', color: '#1A6FB8', gap: '16px' }}> - <div>查看</div> + <div onClick={() => setFilesCheck(true)}>查看</div> <div>删除</div> <div>下载</div> - <div>上传</div> + <div onClick={() => setUpLoad(true)}>上传</div> </div> ) }, @@ -211,6 +275,10 @@ setDialogType(type) setAddVisabled(true) } + + function handleChangeFile() { + } + return ( <div className='dataSync-page'> @@ -342,7 +410,7 @@ <img src={question1} alt="" style={{ width: '13px', height: '13px', marginTop: '4px', marginLeft: '4px' }} /> </Tooltip> <div className="must">必填</div> - <div style={{ marginLeft: '8px', color: '#1A6FB8', fontSize: '14px', cursor: 'pointer' }}>识别上传材料</div> + <div style={{ marginLeft: '8px', color: '#1A6FB8', fontSize: '14px', cursor: 'pointer' }} onClick={() => setScanFile(true)}>识别上传材料</div> </div> } field='summarize' @@ -364,7 +432,7 @@ <img src={question1} alt="" style={{ width: '13px', height: '13px', marginTop: '4px', marginLeft: '4px' }} /> </Tooltip> <div className="must">必填</div> - <div style={{ marginLeft: '8px', color: '#1A6FB8', fontSize: '14px', cursor: 'pointer' }}>识别上传材料</div> + <div style={{ marginLeft: '8px', color: '#1A6FB8', fontSize: '14px', cursor: 'pointer' }} onClick={() => setScanImage(true)}>识别上传材料</div> </div> } field='apply' @@ -403,6 +471,96 @@ bordered={true} style={{ marginBottom: '60px' }} /> + + <MyModal width={1200} visible={scanFile} onCancel={() => setScanFile(false)} footer={false} title='识别上传材料' centered> + <Form + ref={props.formRef} + layout='vertical' + requiredSymbol={false} + style={{ marginTop: '20px' }} + initialValues={{ + }}//默认值 + > + <FormItem + label='选择图片' + field='file' + > + <Upload + drag + multiple + accept='image/*' + action='/' + onDrop={(e) => { + }} + tip='支持png、 jpg、pdf等格式文件上传,每次上传大小不超过10M' + showUploadList={{ + // Please dont remove this comment + fileIcon: <IconLink />, + }} + /> + </FormItem> + </Form> + + </MyModal> + <MyModal width={944} visible={scanImage} onCancel={() => setScanImage(false)} footer={false} title='选择识别范围' centered> + <img src={image} alt="" style={{ margin: '20px 0px' }} /> + <div><Button type="primary" onClick={() => setScaned(true)}>开始识别</Button></div> + </MyModal> + <MyModal width={1200} visible={scaned} onCancel={() => setScaned(false)} footer={false} title='识别上传材料' centered> + <div style={{ marginTop: '20px', marginBottom: '8px' }}>识别内容</div> + <Input.TextArea + showWordLimit + rows={5} + placeholder='' + wrapperStyle={{ width: '100%' }} + defaultValue='识别内容' + /> + <div style={{ marginTop: '24px' }}><Button type="primary" onClick={() => setScaned(true)}>使用文字</Button></div> + </MyModal> + <MyModal width={512} visible={upload} onCancel={() => setUpLoad(false)} footer={false} title='上传材料' centered> + <div style={{ paddingTop: '24px' }}> + <Row gutter={[30, 24]} style={{ margin: '0 2px 0 0' }}> + {$$.options.sourceType.map((x, t) => { + return ( + <Col span={12} key={t}> + <div + onClick={() => { setSourceType(x.value) }} + className={`casePerfection-cardTab-tab ${x.value === sourceType && 'casePerfection-cardTab-tabActive'}`} + > + <img src={x.value === sourceType ? personIconType(x.value)?.[1] : personIconType(x.value)?.[0]} alt="" style={{ width: '40px', height: '40px' }} /> + <div className="casePerfection-cardTab-tab-name">{x.label}</div> + {x.value === sourceType && ( + <> + <div className="casePerfection-cardTab-tab-triangle" /> + <CheckOutlined className="casePerfection-cardTab-tab-check" /> + </> + )} + </div> + </Col> + ); + })} + <Col span={24}> + <Form + ref={props.formRef} + layout='vertical' + requiredSymbol={false} + initialValues={{ + }}//默认值 + > + <Row gutter={[32, 0]}>{formType(sourceType)}</Row> + </Form> + </Col> + <Button type="primary">上传完成</Button> + + </Row> + </div> + + </MyModal> + <MyModal width={1200} visible={filesCheck} onCancel={() => setFilesCheck(false)} footer={false} title='查看事件材料' centered> + <div className="mediationWindow-modal-main" style={{ display: 'flex' }}> + <FilesCheck /> + </div> + </MyModal> <Modal title={'添加' + peopleMap[dialogType]} visible={addVisabled} -- Gitblit v1.8.0