From 842aae506eebb6350de6fa291e8f3e514c93d16b Mon Sep 17 00:00:00 2001 From: zhangyongtian <1181606322@qq.com> Date: Fri, 23 Aug 2024 14:11:30 +0800 Subject: [PATCH] Merge branch 'master' of http://120.79.193.119:9090/r/gzzfw/frontEnd/gzDyh --- gz-customerSystem/src/views/register/visit/component/visitorRegister.jsx | 640 ++++++++++++++++++++++++++++++++++++++++++++++++---------- 1 files changed, 529 insertions(+), 111 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..75e5910 100644 --- a/gz-customerSystem/src/views/register/visit/component/visitorRegister.jsx +++ b/gz-customerSystem/src/views/register/visit/component/visitorRegister.jsx @@ -1,13 +1,29 @@ import React, { useState, useEffect, useRef } from "react"; +import { Row, Col, Space, Tooltip, Button } from 'antd'; +import { Form, Input, Radio, Select, DatePicker, Cascader, Modal, Upload, InputNumber } from '@arco-design/web-react'; +import '@arco-themes/react-gzzz/index.less'; 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 "@arco-design/web-react/dist/css/arco.css"; +import { + question1, + applyMaterials, + applyMaterials_active, + evidenceMaterials, + evidenceMaterials_active, + +} from '../../../../assets/images'; +import { CheckOutlined, } from '@ant-design/icons'; import TableView from '../../../../components/TableView'; import '../../index.less'; import ApplyDialog from "./applyDialog"; +import AgentDialog from "./agentDialog"; +import DetailDialog from "./detailDialog"; +import FilesCheck from '../../../filesCheck'; +import NewFileCheck from '../../../filesCheck/newFileCheck'; +import { IconLink } from '@arco-design/web-react/icon'; +import MapView from './map' +import { scan } from '../../../../assets/images/icon' +import MyDrawer from '../../../../components/MyDrawer'; const RadioGroup = Radio.Group;// 根据调解案号获取纠纷登记信息 const FormItem = Form.Item; @@ -16,68 +32,132 @@ const VisitorRegister = (props) => { - const [fakeData, setFakeData] = useState([ - // { - // id: 3, - // perClassName: '申请方当事人', - // trueName: '蓝海科技有限公司', - // mobile: '9144010188453Z', - // company: true, - // companyName: '张晓梅',//公司法人 - // partyType: 'applicant',//申请人 - // }, - // { - // id: 1, - // perClassName: '申请方代理人', - // trueName: '王小明', - // mobile: '410106198802121125', - // person: true, - // personNumber: '13388888888',//联系方式 - // partyType: 'applicant', - // }, - // { - // id: 2, - // perClassName: '被申请方当事人', - // trueName: '大海科技有限公司', - // mobile: '13800000002', - // company: true, - // companyName: '郭小聪',//公司法人 - // partyType: 'respondent',//被申请方 - // 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 [dialogType, setDialogType] = useState(0);//添加当事人的类型 const [addVisabled, setAddVisabled] = useState(false);//添加当事人弹窗控制 + const [fakeData, setFakeData] = useState([]);//当事人信息数据 + 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 [fileView, setFileView] = useState(); + const [selectedAddress, setSelectedAddress] = useState(''); + const [fileTip, setFileTip] = useState('0'); + const [detailVisabled, setDetailVisabled] = useState(false);//查看信息弹窗控制 + const [mapView, setMapView] = useState(false); + const [flagId, setFlagId] = useState(0);//赋予当事人唯一id,用于删除 + const [visible, setVisible] = useState(false); + const [apply, setApply] = useState(false); + + const addressOptions = [ + { label: '地址1', value: 'address1' }, + { label: '地址2', value: 'address2' }, + // 更多地址... + ]; + + const [agentVisible, setAgentVisible] = 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) => { + }} + 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> + </> + ) + } + 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: '申请方', @@ -89,10 +169,10 @@ { id: 1, caseNo: 'A20230101', - judicNo: 'J20230101', - perClassName: '自然人', - inputUserName: '张三', - mediateUserName: '李四', + judicNo: '申请材料', + perClassName: '李晓明的纠纷化解申请表、身份证...', + inputUserName: '0', + mediateUserName: '2024-7-12 12:00', judgeName: '王五', mediator: '赵六', handlerUserName: '钱七', @@ -107,6 +187,28 @@ serieStatus: '1', // 1 表示非系列案,2 表示系列案 // 更多字段... }, + { + id: 2, + caseNo: 'A20230101', + judicNo: '证据材料', + perClassName: '李晓明的纠纷化解申请表、身份证...', + inputUserName: '0', + mediateUserName: '2024-7-12 12:00', + judgeName: '王五', + mediator: '赵六', + handlerUserName: '钱七', + returnUserName: '孙八', + expireTime: '2023-08-10T08:00:00.000Z', + processName: '进行中', + otherMediator: '周九', + canalName: '网络', + judicResult: '通过', + assistName: '吴十', + mediTypeName: '民事调解', + serieStatus: '1', // 1 表示非系列案,2 表示系列案 + // 更多字段... + }, + // 更多数据... ]; @@ -116,39 +218,54 @@ title: '序号', dataIndex: 'caseNo', key: 'caseNo', + width: 100, render: (text, record, index) => <span>{index + 1}</span>, }, { title: '材料类型', dataIndex: 'judicNo', key: 'judicNo', + width: 60, + }, { title: '材料数量', - dataIndex: 'perClassName', + dataIndex: 'inputUserName', key: 'perClassName', + width: 180, + render: (text) => ( + <> + {text}份 + </> + ) + + }, { title: '材料名称', dataIndex: 'perClassName', key: 'perClassName', + width: 180, + }, { - title: '上传时间', - dataIndex: 'perClassName', - key: 'perClassName', + title: '最新上传时间', + dataIndex: 'mediateUserName', + key: 'mediateUserName', + width: 180, + }, { title: '操作', dataIndex: 'perClassName', key: 'perClassName', - width: 120, + width: 200, 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> ) }, @@ -190,8 +307,38 @@ }, ]; - const handleCheckParty = () => { - console.log('check party'); + const options1 = [ + { + value: 'jingjijiufen', + label: '经济纠纷', + children: [ + { + value: 'laodongjiufen', + label: '劳动纠纷', + }, + { + value: 'laodongzhengyijiufen', + label: '劳动争议纠纷', + }, + ], + }, + { + value: 'linlijiufen', + label: '邻里纠纷', + children: [ + { + value: 'linlijiufen', + label: '邻里纠纷', + }, + ], + }, + ]; + + //查看 + const handleCheckParty = (value) => { + console.log(value); + setDialogType(value.partyType) + setDetailVisabled(true) } //获取当前时间 @@ -206,17 +353,45 @@ return `${year}-${month}-${day} ${hours}:${minutes}`; } - //添加申请人: 0、被申请人: 1、代理人: 2 + //添加申请人: 0、被申请人: 1、申请代理人: 2、被申请代理人:3 const handleAdd = (type) => { + if (type === 2 || type === 3) { + setAgentVisible(true) + } else { + setAddVisabled(true) + } setDialogType(type) - setAddVisabled(true) } + + + const handleAddressChange = (value) => { + 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 ( <div className='dataSync-page'> + <Col span={24} style={{ display: 'flex', alignItems: 'center' }}> <Space size='small'> - <div className='MediationInfo-subTitle' style={{ marginTop: '-6px' }}></div><h5>当事人信息</h5> + <div className='MediationInfo-subTitle' style={{ marginTop: '-9px' }}></div><h5>当事人信息</h5> </Space> </Col> <div style={{ margin: '16px 0' }}> @@ -226,21 +401,23 @@ data={fakeData} handleCheckParty={handleCheckParty} handleAdd={handleAdd} + handleDeleteParty={handleDeleteParty} /> </div> <Col span={24} style={{ display: 'flex', alignItems: 'center', marginBottom: '8px' }}> <Space size='small'> - <div className='MediationInfo-subTitle' style={{ marginTop: '-6px' }}></div><h5>纠纷基本情况</h5> + <div className='MediationInfo-subTitle' style={{ marginTop: '-9px' }}></div><h5>纠纷基本情况</h5> </Space> </Col> <Form ref={props.formRef} layout='vertical' requiredSymbol={false} + scrollToFirstError={true} initialValues={{ level: '三级', visitingTime: getFormattedDateTime(), - isSerious: '否' + isSerious: '否', }}//默认值 > <Row gutter={[32, 0]}> @@ -266,29 +443,32 @@ </Col> <Col span={8}> <FormItem label='来访人数(人)' field='visitingNumber'> - <Input placeholder='请填写' /> + <InputNumber placeholder='请填写' /> </FormItem> </Col> <Col span={8}> <FormItem label={(<div style={{ display: 'flex' }}>纠纷类型<div className="must">必填</div></div>)} - rules={[{ required: true }]} + rules={[{ message: '请选择纠纷类型', required: true }]} field='disputeType' > - <Select initialValue='Beijing' placeholder='请选择' allowClear> - {['邻里纠纷', '劳动争议纠纷', '劳动纠纷', '经济纠纷'].map((option, index) => ( - <Option key={option} value={option}> - {option} - </Option> - ))} - </Select> + <Cascader + placeholder='请选择' + options={options1} + onChange={(value, option) => { + console.log(value, option); + }} + // defaultValue={['shanghai', 'shanghaishi', 'huangpu']} + allowClear + /> </FormItem> </Col> <Col span={8}> <FormItem label={(<div style={{ display: 'flex' }}>纠纷发生时间<div className="must">必填</div></div>)} - rules={[{ required: true }]} + rules={[{ message: '请选择纠纷发生时间', required: true }]} field='disputeTime' + > <DatePicker style={{ width: '100%' }} @@ -301,57 +481,60 @@ <Col span={8}> <FormItem label={(<div style={{ display: 'flex' }}>纠纷发生地点<div className="must">必填</div></div>)} - rules={[{ required: true }]} + rules={[{ message: '请选择纠纷发生地点', required: true }]} field='disputeAddress' > <InputSearch - searchButton='选择' placeholder='选择纠纷发生地的详细地址' + searchButton='选择' + readOnly={true} // 设置为只读,防止直接编辑 + onSearch={() => setMapView(true)} /> </FormItem> </Col> <Col span={8}> <FormItem label='问题属地' field='quesAddress'> <Cascader - placeholder='Please select ...' + placeholder='请选择' options={options} onChange={(value, option) => { console.log(value, option); }} - defaultValue={['shanghai', 'shanghaishi', 'huangpu']} allowClear /> </FormItem> </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}> <FormItem label={<div style={{ display: 'flex' }}> 事项概况 - <Tooltip title='1111'> + <Tooltip onClick={() => setVisible(true)}> <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> + <img src={scan} alt="" style={{ marginRight: '-2px', marginLeft: '8px' }} /> + <div style={{ marginLeft: '8px', color: '#1A6FB8', fontSize: '14px', cursor: 'pointer' }} onClick={() => setScanFile(true)}>识别上传材料</div> </div> } field='summarize' + rules={[{ message: '请填写事项概况', required: true }]} > <Input.TextArea maxLength={2000} showWordLimit rows={5} - placeholder='请填写问题发生的起因、过程和结果' + placeholder='请完整描述事项概况,应具备5要素:发生时间+发生地点+人物情况+事项起因+事项经过' wrapperStyle={{ width: '100%' }} /> </FormItem> @@ -360,14 +543,17 @@ <FormItem label={<div style={{ display: 'flex' }}> 申请请求 - <Tooltip title='1111'> + <Tooltip onClick={() => setApply(true)}> <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> + <img src={scan} alt="" style={{ marginRight: '-2px', marginLeft: '8px' }} /> + <div style={{ marginLeft: '8px', color: '#1A6FB8', fontSize: '14px', cursor: 'pointer' }} onClick={() => setScanFile(true)}>识别上传材料</div> </div> } field='apply' + rules={[{ message: '请填写申请请求', required: true }]} + > <Input.TextArea maxLength={2000} @@ -378,13 +564,16 @@ /> </FormItem> </Col> - <div style={{ marginLeft: '16px', padding: '12px 16px', backgroundColor: '#EFF8FF', borderRadius: '2px' }}> + <div style={{ marginLeft: '16px', padding: '12px 16px', backgroundColor: '#F2F3F5', borderRadius: '2px', marginTop: '4px', display: 'flex', alignItems: 'center' }}> <FormItem label='是否重大矛盾纠纷' - style={{ marginBottom: '-20px' }} + style={{ width: '300px', marginBottom: 0 }} field='isSerious' + layout='horizontal' + labelCol={{ span: 11 }} + wrapperCol={{ span: 13 }} > - <RadioGroup options={['否', '是']} style={{ marginBottom: 20 }} /> + <RadioGroup options={['否', '是']} /> </FormItem> </div> </Row> @@ -392,7 +581,7 @@ </Form> <Col span={24} style={{ display: 'flex', alignItems: 'center', marginBottom: '8px', marginTop: '20px' }}> <Space size='small'> - <div className='MediationInfo-subTitle' style={{ marginTop: '-6px' }}></div><h5>事件材料</h5> + <div className='MediationInfo-subTitle' style={{ marginTop: '-9px' }}></div><h5>事件材料</h5> </Space> </Col> <TableView @@ -401,8 +590,128 @@ size="small" rowKey="id" bordered={true} - style={{ marginBottom: '60px' }} + style={{ marginBottom: '65px' }} /> + + <Modal style={{ width: '1200px' }} visible={scanFile} onCancel={() => setScanFile(false)} title='识别上传材料' centered footer={null}> + <Form + ref={props.formRef} + layout='vertical' + requiredSymbol={false} + initialValues={{ + }}//默认值 + style={{ marginTop: '4px' }} + > + <FormItem + label='选择图片' + field='file' + > + <Upload + drag + // multiple + limit={1} + accept='image/*' + // action='/' + onDrop={(e) => { + }} + tip='支持png、 jpg、pdf等格式文件上传,每次上传大小不超过10M' + showUploadList={{ + // Please dont remove this comment + fileIcon: <IconLink style={{ color: '#1D2129' }} />, + }} + onChange={(info, currentFile) => { + console.log(currentFile, info, 'info', 'currentFile') + if (info.length > 0) { + setScanImage(true); + } + setFileView({ + ...currentFile, + url: URL.createObjectURL(currentFile.originFile), + + }); + + }} + onSuccess={() => setScanImage(true)} + /> + {/* <img src={file?.url} alt=""/> */} + </FormItem> + + </Form> + + </Modal> + <Modal style={{ width: '944px' }} visible={scanImage} onCancel={() => setScanImage(false)} footer={null} title='选择识别范围' centered> + <img + src={fileView?.url} + alt="" + style={{ + display: 'block', // 确保图片在容器中居中显示 + margin: 'auto', // 居中显示 + maxWidth: '100%', // 图片最大宽度为容器宽度的100% + maxHeight: '100%', // 图片最大高度为容器高度的100% + objectFit: 'contain', // 图片缩放以适应容器,保持原图比例 + }} + /> + <div><Button type="primary" onClick={() => setScaned(true)} style={{ marginTop: '20px' }}>开始识别</Button></div> + </Modal> + <Modal style={{ width: '1200px' }} visible={scaned} onCancel={() => setScaned(false)} footer={null} title='识别上传材料' centered> + <div style={{ marginTop: '20px', marginBottom: '8px' }}>识别内容</div> + <Input.TextArea + showWordLimit + rows={5} + placeholder='' + wrapperStyle={{ width: '100%' }} + defaultValue='识别内容' + onChange={(v) => console.log(v, 'vvvvvv')} + /> + <div style={{ marginTop: '24px' }}><Button type="primary" onClick={() => { setScanFile(false); setScanImage(false); setScaned(false) }}>使用文字</Button></div> + </Modal> + <Modal style={{ width: '512px' }} visible={upload} onCancel={() => setUpLoad(false)} footer={null} title='上传材料' centered> + <div style={{ paddingTop: '8px' }}> + <Row gutter={[30, 24]}> + {$$.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={{ + }}//默认值 + style={{ position: 'relative' }} + > + + <Row gutter={[32, 0]}>{formType(sourceType)}</Row> + </Form> + </Col> + <Button type="primary" style={{ marginTop: '-20px', marginLeft: '16px' }}>上传完成</Button> + </Row> + </div> + + </Modal> + <Modal style={{ width: '1200px' }} visible={filesCheck} onCancel={() => setFilesCheck(false)} footer={null} title='查看事件材料' centered> + {/* <div className="mediationWindow-modal-main" style={{ display: 'flex' }}> */} + <div style={{ marginTop: '-16px' }}> + <NewFileCheck /> + </div> + {/* </div> */} + </Modal> <Modal title={'添加' + peopleMap[dialogType]} visible={addVisabled} @@ -411,12 +720,121 @@ autoFocus={false} focusLock={true} footer={null} - // style={{ width: '1000px' }} + unmountOnExit={true} + maskClosable={false} > - <ApplyDialog /> + <ApplyDialog + dialogType={dialogType} + onClose={() => setAddVisabled(false)} + handleAddParty={handleAddParty} + /> </Modal> + <Modal + title={'添加代理人'} + visible={agentVisible} + onOk={() => setAgentVisible(false)} + onCancel={() => setAgentVisible(false)} + autoFocus={false} + focusLock={true} + footer={null} + unmountOnExit={true} + maskClosable={false} + > + <AgentDialog + handleAddParty={handleAddParty} + onClose={() => setAgentVisible(false)} + fakeData={fakeData} + dialogType={dialogType} + /> + </Modal> + <Modal + title={'查看' + peopleMap[dialogType]} + visible={detailVisabled} + onOk={() => setDetailVisabled(false)} + onCancel={() => setDetailVisabled(false)} + autoFocus={false} + focusLock={true} + footer={null} + unmountOnExit={true} + maskClosable={false} + > + <DetailDialog /> + </Modal> + <Modal + style={{ width: '1200px' }} + visible={mapView} + onCancel={() => setMapView(false)} + footer={null} + title='选择纠纷发生地' + centered + unmountOnExit={true} + maskClosable={false} + > + <MapView /> + </Modal> + <MyDrawer + title='事项概况指南' + visible={visible} + width={1000} + style={{ position: 'absolute' }} + onClose={() => setVisible(false)} + titleBefore={true} + > + <div style={{ marginTop: '-8px' }}> + 事项简述应该填写完整,完整的事项简述应具备5要素:发生时间+发生地点+人物情况+事项起因+事项经过。<br /> + 例如:<br /> + 2024年8月13日,张某与女性好友王某在某烧烤档就餐期间发生场盾争执,报警人称女方从今年一月份开始,以各种理由让其帮忙付了外卖费,送金链等首饰,但又不确认关系,女方后期还拉黑了报警人,因此报警人认为女方涉嫌诈骗。 + </div> + </MyDrawer> + <MyDrawer + title='事件等级指南' + visible={apply} + width={1000} + style={{ position: 'absolute' }} + onClose={() => setApply(false)} + titleBefore={true} + > + <div style={{ marginTop: '-8px' }}> + <div> + <div style={{ color: '#1A6FB8', fontSize: '15px',lineHeight:'23px',marginBottom:'8px' }}>一类重点事件</div> + 1、5人(含5人)以上到非接待场所聚集、滞留、静坐、游行或准备上访;<br /> + 2、拉横幅、穿着“状衣”、呼喊口号、呼喊标语、堵塞交通非法占据公其场所、扰乱公共秩序、向他人散发传单等上访材料;<br /> + 3、拖欠工资、劳资纠纷涉及人数5人以上;<br /> + 4、拖欠工资总全额5万元以上,经济合同外涉金额20万元以上;<br /> + 5、扬言到市赴省进京越级上访; + 6、存在轻生、自残等危险行为,打砸公私财物等极端倾向;<br /> + 7、群体性民事纠纷(5人及5人以上的邻里矛盾纠纷、经济债务纠纷、家庭纠纷等可能导致“民转刑”的民事纠纷);8、存在重大安全隐患、重大不稳定因索的矛盾;9、涉及政治类,非宗教类的非访宣传(在出租屋内从事涉邪教迷信印刷、存放资料的;在公共场所粘贴类似邪教的符号、图案、标志等)10、县(市、区)职能部门、各镇(街道)分管领导根据应急情况认为有必要启动红色预警机制的其他矛盾纠纷。 + </div> + <div> + <div style={{ color: '#1A6FB8', fontSize: '15px',lineHeight:'23px',marginBottom:'8px',marginTop:'20px' }}>二类重点事件</div> + 1、5人(含5人)以上到非接待场所聚集、滞留、静坐、游行或准备上访;<br /> + 2、拉横幅、穿着“状衣”、呼喊口号、呼喊标语、堵塞交通非法占据公其场所、扰乱公共秩序、向他人散发传单等上访材料;<br /> + 3、拖欠工资、劳资纠纷涉及人数5人以上;<br /> + 4、拖欠工资总全额5万元以上,经济合同外涉金额20万元以上;<br /> + 5、扬言到市赴省进京越级上访; + 6、存在轻生、自残等危险行为,打砸公私财物等极端倾向;<br /> + 7、群体性民事纠纷(5人及5人以上的邻里矛盾纠纷、经济债务纠纷、家庭纠纷等可能导致“民转刑”的民事纠纷);8、存在重大安全隐患、重大不稳定因索的矛盾;9、涉及政治类,非宗教类的非访宣传(在出租屋内从事涉邪教迷信印刷、存放资料的;在公共场所粘贴类似邪教的符号、图案、标志等)10、县(市、区)职能部门、各镇(街道)分管领导根据应急情况认为有必要启动红色预警机制的其他矛盾纠纷。 + </div> + <div> + <div style={{ color: '#1A6FB8', fontSize: '15px',lineHeight:'23px',marginBottom:'8px',marginTop:'20px' }}>三类普通事件</div> + 1、5人(含5人)以上到非接待场所聚集、滞留、静坐、游行或准备上访;<br /> + 2、拉横幅、穿着“状衣”、呼喊口号、呼喊标语、堵塞交通非法占据公其场所、扰乱公共秩序、向他人散发传单等上访材料;<br /> + 3、拖欠工资、劳资纠纷涉及人数5人以上;<br /> + 4、拖欠工资总全额5万元以上,经济合同外涉金额20万元以上;<br /> + 5、扬言到市赴省进京越级上访; + 6、存在轻生、自残等危险行为,打砸公私财物等极端倾向;<br /> + 7、群体性民事纠纷(5人及5人以上的邻里矛盾纠纷、经济债务纠纷、家庭纠纷等可能导致“民转刑”的民事纠纷);8、存在重大安全隐患、重大不稳定因索的矛盾;9、涉及政治类,非宗教类的非访宣传(在出租屋内从事涉邪教迷信印刷、存放资料的;在公共场所粘贴类似邪教的符号、图案、标志等)10、县(市、区)职能部门、各镇(街道)分管领导根据应急情况认为有必要启动红色预警机制的其他矛盾纠纷。 + </div> + + </div> + </MyDrawer> + </div> ) } -export default VisitorRegister; \ No newline at end of file +export default VisitorRegister; + + + + -- Gitblit v1.8.0