From 421682641d0bdf37c722c0abf894b1bdb71f54a2 Mon Sep 17 00:00:00 2001 From: zhangyongtian <1181606322@qq.com> Date: Thu, 15 Aug 2024 18:12:15 +0800 Subject: [PATCH] feat:添加申请方弹窗静态 --- gz-customerSystem/src/views/register/visit/component/visitorRegister.jsx | 71 +++++++++++++++++++++++++++++++---- 1 files changed, 62 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..313efeb 100644 --- a/gz-customerSystem/src/views/register/visit/component/visitorRegister.jsx +++ b/gz-customerSystem/src/views/register/visit/component/visitorRegister.jsx @@ -1,9 +1,12 @@ import React, { useState, useEffect, useRef } from "react"; +import { Row, Col, Space, Tooltip, Button } from 'antd'; +import { Form, Input, Radio, Select, DatePicker, Cascader,Modal } from '@arco-design/web-react'; +import "@arco-design/web-react/dist/css/arco.css"; +import MyModal from '../../../../components/MyModal'; +import MyUpload from '../../../../components/MyUpload'; 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 } from '../../../../assets/images'; import "@arco-design/web-react/dist/css/arco.css"; import TableView from '../../../../components/TableView'; import '../../index.less'; @@ -16,6 +19,8 @@ const VisitorRegister = (props) => { + const [dialogType, setDialogType] = useState(0);//添加当事人的类型 + const [addVisabled, setAddVisabled] = useState(false);//添加当事人弹窗控制 const [fakeData, setFakeData] = useState([ // { // id: 3, @@ -76,9 +81,11 @@ // 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 peopleMap = { 0: '申请方', 1: '被申请方', @@ -148,7 +155,7 @@ <div>查看</div> <div>删除</div> <div>下载</div> - <div>上传</div> + <div onClick={() => setUpLoad(true)}>上传</div> </div> ) }, @@ -211,6 +218,10 @@ setDialogType(type) setAddVisabled(true) } + + function handleChangeFile() { + } + return ( <div className='dataSync-page'> @@ -342,7 +353,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 +375,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 +414,48 @@ bordered={true} style={{ marginBottom: '60px' }} /> + + <MyModal width={1200} visible={scanFile} onCancel={() => setScanFile(false)} footer={false} title='识别上传材料'> + <div style={{ marginTop: '20px', marginBottom: '8px' }}>选择图片</div> + <MyUpload + ledgerType={true} + fileId={'10001'} + handleChangeFile={(type, info, apiResult) => { + handleChangeFile(type, info, apiResult); + }} + accept="XLS、XLSX" + formatType='格式支持XLS、XLSX' + fileType="22_00018-504" + fileList={filesList} + fileIcon={true} + /> + + </MyModal> + <MyModal width={944} visible={scanImage} onCancel={() => setScanImage(false)} footer={false} title='选择识别范围'> + <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='识别上传材料'> + <div style={{ marginTop: '20px', marginBottom: '8px' }}>识别内容</div> + <Input.TextArea + showWordLimit + rows={5} + placeholder='' + wrapperStyle={{ width: '100%' }} + /> + <div style={{ marginTop: '24px' }}><Button type="primary" onClick={() => setScaned(true)}>使用文字</Button></div> + </MyModal> + <MyModal width={1200} visible={upload} onCancel={() => setUpLoad(false)} footer={false} title='识别上传材料'> + <div style={{ marginTop: '20px', marginBottom: '8px' }}>识别内容</div> + <Input.TextArea + showWordLimit + rows={5} + placeholder='' + wrapperStyle={{ width: '100%' }} + /> + <div style={{ marginTop: '24px' }}><Button type="primary" onClick={() => setScaned(true)}>上传完成</Button></div> + </MyModal> + <Modal title={'添加' + peopleMap[dialogType]} visible={addVisabled} -- Gitblit v1.8.0