广州市综治平台前端
liuwh
4 days ago 2f8556d0741d07761c34d05d728e8d807260779b
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
/*
 * @Author: dminyi 1301963064@qq.com
 * @Date: 2024-09-06 09:40:00
 * @LastEditors: lwh
 * @LastEditTime: 2025-01-02 14:48:46
 * @FilePath: \gzDyh\gz-customerSystem\src\views\register\matterDetail\HandleRecord.jsx
 * @Description: 办理记录
 */
import React, { useState, useEffect } from 'react';
import { Empty } from '@arco-design/web-react';
import { fold, down, empty, edit } from '@/assets/images';
import NameCard2 from '@/components/NameCard2';
import { Image } from 'antd';
import { link } from '@/assets/images';
import * as $$ from '@/utils/utility';
import PersonCard from './personCard';
 
export default function HandleRecord(props) {
  const appUrl = $$.appUrl;
  const [list, setList] = useState([]);
  const [imgVisible, setImgVisible] = useState({ visible: false, src: '' });
  const [personView, setPersonView] = useState(false)
  const [personId, setPersonId] = useState('')
 
  useEffect(() => {
    setList(props.data)
  }, [props.data])
 
  const toggleView = (id) => {
    setList(list.map(record => {
      if (record.id === id) {
        return {
          ...record,
          showView: !record.showView,
        };
      }
      return record;
    }));
  };
 
 
  const handlePersonDetail = (id) => {
    setPersonView(!personView)
    setPersonId(id)
  }
 
  const handleEdit = (record, index) => {
    props.handleEdit(record, index)
  }
 
  function handleOpenFiles(record) {
    if (record.cat === '22_00017-3') {
      setImgVisible({ visible: true, src: `${appUrl.fileUrl}/${appUrl.sys}${record.showUrl}` });
    } else if (record.cat === '22_00017-6' || record.cat === '22_00017-1' || record.cat === '22_00017-2') {
      window.open(`${appUrl.fileUrl}${appUrl.fileShowUrl}${record.id}`);
    } else {
      $$.info({ type: 'warning', content: '抱歉,暂不支持在线查看,已下载请查看' });
      window.open(`${appUrl.fileUrl}${appUrl.fileDownUrl}${record.id}`);
    }
  }
 
 
  return (
    <div>
      {list?.length > 0 ?
        <div>
          {list?.map((record, index) => (
            <div key={record.id} className='container-bottom-left-record'>
              <div className='container-bottom-left-record-top' style={{ borderBottom: record.showView ? '1px solid #d9d9d9' : null }}>
                {
                  record.showView ? (
                    <img src={down} alt='' style={{ width: '18px', marginRight: '6px', cursor: 'pointer' }} onClick={() => toggleView(record.id)} />
                  ) : (
                    <img src={fold} alt='' className='container-bottom-left-record-top-icon' onClick={() => toggleView(record.id)} />
                  )
                }
                <div>{`${record.createTime} ${record.handleUnitName}`}</div>
                <div className={`container-bottom-left-record-top-${record.handleType === '2' ? 'remark' : 'hostOrg'}`}>{record.handleType === 2 ? '配合部门' : '承办部门'}</div>
                {!props.isReview && !props.noEdit && <div><img src={edit} alt='' className='container-bottom-left-record-top-edit' onClick={() => handleEdit(record, index)} /></div>}
              </div>
              <div className='container-bottom-left-record-bottom' style={{ display: record.showView ? 'block' : 'none' }}>
                <table border="1" cellpadding="8" className='container-bottom-left-record-bottom-table'>
                  <tr>
                    <th bgcolor="#F7F8FA" className="table-title" width="120">操作人</th>
                    <td>
                      <NameCard2 name={record.handleUserName} userId={record.handleUserId} />
                    </td>
                  </tr>
                  <tr>
                    <th bgcolor="#F7F8FA" className="table-title" width="120">办理意见</th>
                    <td>{record.handleContent || '-'}</td>
                  </tr>
                  <tr>
                    <th bgcolor="#F7F8FA" className="table-title" width="120">办理附件</th>
                    <div style={{ display: 'none' }}>
                      <Image
                        // src={imgVisible.src}
                        preview={{
                          visible: imgVisible.visible,
                          src: imgVisible.src,
                          onVisibleChange: (value) => setImgVisible({ visible: false }),
                        }}
                      />
                    </div>
                    <td>
                      {record?.fileInfoList?.length > 0 ?
                        <div style={{ display: 'flex', alignItems: 'center', gap: '4px', color: '#1A6FB8' }}>
                          <img src={link} alt='' style={{ width: '14px', height: '14px' }} />
                          <div>
                            {record?.fileInfoList?.map((item, index) =>
                              <div key={index} onClick={() => handleOpenFiles(item)} style={{ cursor: 'pointer' }}>{item.name || '-'}{index === record.fileInfoList.length - 1 ? '' : ','}</div>
                            )}
                          </div>
                        </div> : '-'
                      }
 
                    </td>
                  </tr>
                </table>
              </div>
            </div>
          ))}
        </div>
        : null
      }
 
      <PersonCard personView={personView} handleCancel={() => setPersonView(false)} personId={personId} />
 
    </div>
  )
}