feat：更改当事人组件

zhangyongtian

2024-08-30 558043a024fccd7ebb86b6927ae12757922c24c8

feat：更改当事人组件

 gz-customerSystem/src/components/personCard/DetailDialog.jsx

File was renamed from gz-customerSystem/src/views/register/visit/component/detailDialog.jsx
@@ -1,5 +1,5 @@
import React, { useEffect, useState } from 'react'
import KeyVisits from "./keyVisits";
import KeyVisits from "./KeyVisits";
import { link } from '@/assets/images'

export default function DetailDialog(props) {

 gz-customerSystem/src/components/personCard/KeyVisits.jsx

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

@@ -6,20 +6,30 @@
 * @FilePath: \gzDyh\gz-customerSystem\src\components\personCard\index.jsx
 * @Description: 来访登记当事人卡片
 */
import React from 'react';
import React, { Fragment, useState } from 'react';
import PropTypes from 'prop-types';
import { Typography, Row, Col, Space, Tooltip } from 'antd';
import { Modal } from '@arco-design/web-react';
import { del, add } from '../../assets/images';
import * as $$ from '@/utils/utility';
import DetailDialog from "./DetailDialog";

const { Link, Text } = Typography;
/**
 * isCheck, // 是否无操作
 * data, // 当事人数据
 * handleCheckParty, // 点击查看详情
 * handleDeleteParty, // 删除当事人
 */
const PersonCard = ({ isCheck, data, handleCheckParty, handleDeleteParty, handleAdd, handleEdit }) => {
const PersonCard = ({ isCheck, data, handleDeleteParty, handleAdd, handleEdit }) => {
  const [editData, setEditData] = useState(null);
  const [detailVisabled, setDetailVisabled] = useState(false);//查看信息弹窗控制
  const [dialogType, setDialogType] = useState(0);//添加当事人的类型

  const peopleMap = {
    '15_020008-1': '申请方',
    '15_020008-2': '被申请方',
    '24_00006-1': '申请方代理人',
    '24_00006-2': '被申请方代理人'
  }
  let isAgent = false
  let isAgentFor = false
  const typeList = data.map(item => {
@@ -31,7 +41,15 @@
  if (typeList.indexOf('15_020008-2') != -1) {
    isAgentFor = true
  }

  const handleCheckParty = (value) => {
    setDialogType(value.perType)
    setEditData(value)
    setDetailVisabled(true)
  }

  return (
    <Fragment>
    <Row gutter={[24, 16]}>
      {data.map((x, t) => (
        <Col span={7} key={t}>
@@ -42,12 +60,12 @@
            >
              {x.trueName.substr(0, 1)}
              <div className="public-personCard-card-check">查看</div>
              <img
                {isCheck && <img
                src={del}
                alt=''
                style={{ width: '16px', height: '16px', position: 'absolute', top: '-8px', left: '56px' }}
                onClick={(event) => { handleDeleteParty(event, x) }}
              />
                />}
            </div>
            <div className="public-personCard-content">
              <div className="public-personCard-title">
@@ -88,6 +106,7 @@
          </div>
        </Col>
      ))}
        {isCheck &&
      <Col span={3}>
        <div className="dataSync-addBtn">
          <Tooltip
@@ -107,7 +126,25 @@
          </Tooltip>
        </div>
      </Col>
        }
    </Row>
      <Modal
        title={'查看' + peopleMap[dialogType]}
        visible={detailVisabled}
        onOk={() => setDetailVisabled(false)}
        onCancel={() => {
          setDetailVisabled(false)
          setEditData(null)
        }}
        autoFocus={false}
        focusLock={true}
        footer={null}
        unmountOnExit={true}
        maskClosable={false}
      >
        <DetailDialog editData={editData} />
      </Modal>
    </Fragment>
  );
};


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

@@ -182,12 +182,8 @@
            </Col>
            <div style={{ margin: '16px 0' }}>
              <PersonCard
                isCheck={true}
                partyType={'applicant'} // 这里设定为申请人
                isCheck={false}
                data={fakeData}
                handleCheckParty={handleCheckParty}
                handleAdd={handleAdd}
                handleDeleteParty={handleDeleteParty}
              />
            </div>
            <Col span={24} style={{ display: 'flex', alignItems: 'center', marginBottom: '4px' }}>
@@ -305,7 +301,7 @@
        </Typography.Paragraph>
      }
      {
        props.active === '3' && <Typography.Paragraph style={style}>
        (props.active === '3' && props.current === 3) && <Typography.Paragraph style={style}>
          <Handle />
        </Typography.Paragraph>
      }

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

@@ -1,7 +1,7 @@
import React, { useState, useEffect, useRef, Fragment } from "react";
import { Row, Col, Space } from 'antd';
import { Form, Input, Button, Radio, Select, Checkbox, Upload } from '@arco-design/web-react';
import KeyVisits from "./keyVisits";
import KeyVisits from "@/components/personCard/KeyVisits";
import {
  IconLink,
} from '@arco-design/web-react/icon';

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

@@ -13,7 +13,7 @@
  caseperfection_organize_active,
} from '@/assets/images/icon';
import { Form, Input, Button, Radio, Select, Modal, Cascader, Upload, Message } from '@arco-design/web-react';
import KeyVisits from "./keyVisits";
import KeyVisits from "@/components/personCard/KeyVisits";
import SelectUnitDialog from "./selectUnitDialog";
import {
  IconLink,

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

@@ -15,7 +15,6 @@
import '../../index.less';
import ApplyDialog from "./applyDialog";
import AgentDialog from "./agentDialog";
import DetailDialog from "./detailDialog";
import NewFileCheck from '../../../filesCheck/newFileCheck';
import { IconLink } from '@arco-design/web-react/icon';
import MapView from './map'
@@ -32,7 +31,7 @@


const VisitorRegister = (props) => {
  const [dialogType, setDialogType] = useState(0);//添加当事人的类型
  const [dialogType, setDialogType] = useState();//添加当事人的类型
  const [addVisabled, setAddVisabled] = useState(false);//添加当事人弹窗控制
  const [fakeData, setFakeData] = useState([]);//当事人信息数据
  const [scanFile, setScanFile] = useState(false);
@@ -43,7 +42,6 @@
  const [filesCheck, setFilesCheck] = useState(false);
  const [fileView, setFileView] = useState();
  const [fileTip, setFileTip] = useState('0');
  const [detailVisabled, setDetailVisabled] = useState(false);//查看信息弹窗控制
  const [mapView, setMapView] = useState(false);
  const [visible, setVisible] = useState(false);
  const [apply, setApply] = useState(false);
@@ -299,13 +297,6 @@
    }
  }

  //查看
  const handleCheckParty = (value) => {
    setDialogType(value.perType)
    setEditData(value)
    setDetailVisabled(true)
  }

  //获取当前时间
  const getFormattedDateTime = () => {
    let now = new Date();
@@ -378,7 +369,6 @@
        <PersonCard
          isCheck={true}
          data={fakeData}
          handleCheckParty={handleCheckParty}
          handleAdd={handleAdd}
          handleDeleteParty={handleDeleteParty}
          handleEdit={handleEdit}
@@ -760,22 +750,6 @@
          dialogType={dialogType}
          editData={editData}
        />
      </Modal>
      <Modal
        title={'查看' + peopleMap[dialogType]}
        visible={detailVisabled}
        onOk={() => setDetailVisabled(false)}
        onCancel={() => {
          setDetailVisabled(false)
          setEditData(null)
        }}
        autoFocus={false}
        focusLock={true}
        footer={null}
        unmountOnExit={true}
        maskClosable={false}
      >
        <DetailDialog editData={editData} />
      </Modal>
      <Modal
        style={{ width: '1200px' }}

 gz-customerSystem/src/views/register/visit/index.jsx

@@ -39,7 +39,7 @@
    const formRef = useRef();

    const [isReview, setIsReview] = useState(false);//预览页面控制
    const [current, setCurrent] = useState(1);
    const [current, setCurrent] = useState(2);
    const [tabsActive, setTabsActive] = useState('1');
    const [tabsList, setTabList] = useState([
        {
@@ -56,6 +56,7 @@
    ])
    const breadcrumbDataMap = {
        1: { breadcrumbData: [{ title: '工作台' }, { title: '来访登记' }], title: '来访登记' },
        2: { breadcrumbData: [{ title: '工作台' }, { title: '事件中心' }], title: '办理反馈' },
        3: { breadcrumbData: [{ title: '工作台' }, { title: '事件中心' }], title: '办理反馈' }
    }

@@ -192,7 +193,7 @@
                    </Fragment>
                }
                {
                    current === 3 &&
                    (current === 2 || current === 3) &&
                    <Tabs defaultActiveTab='1' onChange={(v) => setTabsActive(v)}>
                        {tabsList?.map(item => {
                            return <TabPane
@@ -216,7 +217,7 @@
                                        </Steps>
                                    </div>
                                }
                                <MattersInfo active={tabsActive} />
                                <MattersInfo active={tabsActive} current={current}/>
                            </TabPane>
                        })}
                    </Tabs>