弹窗

dminyi

2024-08-15 ae22a9f162196c6c7ba2085c3e246dc9101c48e4

弹窗

 gz-customerSystem/src/api/appUrl.js

@@ -2,20 +2,20 @@
 * @Company: hugeInfo
 * @Author: ldh
 * @Date: 2022-02-16 11:25:57
 * @LastEditTime: 2024-08-15 09:36:44
 * @LastEditTime: 2024-08-15 14:23:32
 * @LastEditors: dminyi 1301963064@qq.com
 * @Version: 1.0.0
 * @Description: api地址
 */
export const debug = {
    // web服务
    // baseUrl: 'http://gz.hugeinfo.com.cn',
    baseUrl: 'http://192.168.3.108:9002',
    baseUrl: 'http://gz.hugeinfo.com.cn',
    // baseUrl: 'http://192.168.3.108:9002',
    // baseUrl: 'http://mdqgnh.natappfree.cc',

    // 附件服务
    fileUrl: 'http://192.168.3.108:9002',
    // fileUrl: 'http://gz.hugeinfo.com.cn',
    // fileUrl: 'http://192.168.3.108:9002',
    fileUrl: 'http://gz.hugeinfo.com.cn',


    // 文件查看url 后面接附件编号

 gz-customerSystem/src/assets/images/applyMaterials.png

 gz-customerSystem/src/assets/images/applyMaterials_active.png

 gz-customerSystem/src/assets/images/evidenceMaterials.png

 gz-customerSystem/src/assets/images/evidenceMaterials_active.png

 gz-customerSystem/src/assets/images/index.js

@@ -2,7 +2,7 @@
 * @Company: hugeInfo
 * @Author: lwh
 * @Date: 2023-04-24 16:12:00
 * @LastEditTime: 2024-08-14 10:28:30
 * @LastEditTime: 2024-08-15 14:37:33
 * @LastEditors: dminyi 1301963064@qq.com
 * @Version: 1.0.0
 * @Description:
@@ -36,7 +36,11 @@
import person from "./person.png";
import link from "./link.png";
import check from "./check.png";
import image from './image.png'
import image from './image.png';
import applyMaterials from './applyMaterials.png';
import applyMaterials_active from './applyMaterials_active.png';
import evidenceMaterials from './evidenceMaterials.png';
import evidenceMaterials_active from './evidenceMaterials_active.png';

export {
  ledger_1,
@@ -68,5 +72,9 @@
  person,
  link,
  check,
  image
  image,
  applyMaterials,
  applyMaterials_active,
  evidenceMaterials,
  evidenceMaterials_active
};

 gz-customerSystem/src/components/MyUpload/index.jsx

@@ -2,7 +2,7 @@
 * @Company: hugeInfo
 * @Author: ldh
 * @Date: 2022-03-05 17:14:00
 * @LastEditTime: 2024-08-15 09:56:54
 * @LastEditTime: 2024-08-15 16:28:01
 * @LastEditors: dminyi 1301963064@qq.com
 * @Version: 1.0.0
 * @Description: 公共上传组件
@@ -164,7 +164,7 @@
      ) : (
        <Dragger {...props}>
          <p className="ant-upload-drag-icon">
            {fileIcon ? <PlusOutlined style={{ color: 'rgba(0, 0, 0, 0.65)' }} /> :
            {fileIcon ? <PlusOutlined style={{ color: 'rgba(0, 0, 0, 0.65)' ,width:'24px'}} /> :
              <CloudUploadOutlined />}
          </p>
          <p style={{ fontSize: '14px' }}>点击上传图标或拖拽文件至此区域上传</p>

 gz-customerSystem/src/utils/selectOption.js

@@ -72,6 +72,18 @@
    label: '非法人组织',
  },
];

//上传材料类型
const sourceType = [
  {
    value: '09_01010-1',
    label: '申请材料',
  },
  {
    value: '09_01010-2',
    label: '证据材料',
  },
];
// 性别
const sex = [
  {
@@ -1003,6 +1015,7 @@
  mediateType,
  personType,
  personClass,
  sourceType,
  sex,
  agentClass,
  cardType,

 gz-customerSystem/src/views/register/visit/component/visitorRegister.jsx

@@ -1,16 +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 } from '@arco-design/web-react';
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 MyUpload from '../../../../components/MyUpload';
import PersonCard from '../../../../components/personCard';
import * as $$ from '../../../../utils/utility';
import { question1,image } from '../../../../assets/images';
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;
@@ -31,6 +47,47 @@
  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 fakeData = [
    {
      id: 3,
@@ -157,7 +214,7 @@
      width: 120,
      render: (text) => (
        <div style={{ display: 'flex', color: '#1A6FB8', gap: '16px' }}>
          <div>查看</div>
          <div onClick={() => setFilesCheck(true)}>查看</div>
          <div>删除</div>
          <div>下载</div>
          <div onClick={() => setUpLoad(true)}>上传</div>
@@ -420,27 +477,41 @@
        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 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='选择识别范围'>
      <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='识别上传材料'>
      <MyModal width={1200} visible={scaned} onCancel={() => setScaned(false)} footer={false} title='识别上传材料' centered>
        <div style={{ marginTop: '20px', marginBottom: '8px' }}>识别内容</div>
        <Input.TextArea
          showWordLimit
@@ -450,17 +521,50 @@
        />
        <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 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}