forked from gzzfw/frontEnd/gzDyh

zhangyongtian
2024-08-17 2ef19aff2a07ec697c1f1c672fbb2bf82cafacc0
gz-customerSystem/src/views/register/visit/component/visitorRegister.jsx
@@ -1,12 +1,11 @@
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,
@@ -21,14 +20,9 @@
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;
@@ -112,6 +106,9 @@
  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' },
@@ -136,7 +133,7 @@
  const formType = (type) => {
    if (type === '09_01010-1') {
      //自然人
      //申请材料
      return (
        <>
          <Col span={24}>
@@ -152,17 +149,77 @@
                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: '申请方',
@@ -176,7 +233,7 @@
      caseNo: 'A20230101',
      judicNo: '申请材料',
      perClassName: '李晓明的纠纷化解申请表、身份证...',
      inputUserName: '张三',
      inputUserName: '0',
      mediateUserName: '2024-7-12 12:00',
      judgeName: '王五',
      mediator: '赵六',
@@ -197,7 +254,7 @@
      caseNo: 'A20230101',
      judicNo: '证据材料',
      perClassName: '李晓明的纠纷化解申请表、身份证...',
      inputUserName: '张三',
      inputUserName: '0',
      mediateUserName: '2024-7-12 12:00',
      judgeName: '王五',
      mediator: '赵六',
@@ -223,7 +280,7 @@
      title: '序号',
      dataIndex: 'caseNo',
      key: 'caseNo',
      width: 60,
      width: 100,
      render: (text, record, index) => <span>{index + 1}</span>,
    },
    {
@@ -238,6 +295,12 @@
      dataIndex: 'inputUserName',
      key: 'perClassName',
      width: 180,
      render: (text) => (
        <>
          {text}份
        </>
      )
    },
    {
@@ -367,8 +430,13 @@
    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>
@@ -422,7 +490,7 @@
          </Col>
          <Col span={8}>
            <FormItem label='来访人数(人)' field='visitingNumber'>
              <Input placeholder='请填写' />
              <InputNumber placeholder='请填写' />
            </FormItem>
          </Col>
          <Col span={8}>
@@ -467,6 +535,7 @@
                placeholder='选择纠纷发生地的详细地址'
                searchButton='选择'
                readOnly={true} // 设置为只读,防止直接编辑
                onSearch={() => setMapView(true)}
              />
            </FormItem>
          </Col>
@@ -484,13 +553,13 @@
          </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}>
@@ -581,7 +650,8 @@
          >
            <Upload
              drag
              multiple
              // multiple
              limit={1}
              accept='image/*'
              // action='/'
              onDrop={(e) => {
@@ -679,7 +749,7 @@
      </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
@@ -715,8 +785,47 @@
      >
        <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;