fix: 修改预览的文件回显bug

zhangyongtian

2024-09-13 42ad61a075d8a3c32949d83bf40acc53b2da25b1

fix: 修改预览的文件回显bug

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

@@ -326,14 +326,19 @@
          return {
            ...res,
            value: <>
              {data[res.field]?.map(item => {
                console.log(item);
                if(item.response) {
              {data[res.field]?.map((item, index) => {
                if (item.response) {
                  //新上传的，前端数据
                  const data = item.response.data[0]
                  return <PreviewImage name={data.name} src={data.showUrl} />
                  const newData = item.response.data[0]
                  return <div style={{ display: 'inline-block' }}>
                    <PreviewImage name={newData.name} src={newData.showUrl} />
                    {index !== data[res.field].length - 1 && <>，</>}
                  </div>
                } else {
                  return <PreviewImage name={item.name} src={item.showUrl} />
                  return <div style={{ display: 'inline-block' }}>
                    <PreviewImage name={item.name} src={item.showUrl} />
                    {index !== data[res.field].length - 1 && <>，</>}
                  </div>
                }
              })}
            </>

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

@@ -35,10 +35,10 @@
  const typeList = data?.map(item => {
    return item.perType
  })//获取有多少申请人和被申请人
  if (typeList.indexOf('15_020008-1') != -1) {
  if (typeList?.indexOf('15_020008-1') != -1) {
    isAgent = true
  }
  if (typeList.indexOf('15_020008-2') != -1) {
  if (typeList?.indexOf('15_020008-2') != -1) {
    isAgentFor = true
  }

@@ -51,7 +51,7 @@
  return (
    <Fragment>
      <Row gutter={[24, 16]}>
        {data.map((x, t) => (
        {data?.map((x, t) => (
          <Col span={7} key={t}>
            <div className="public-personCard" style={{ cursor: 'pointer' }}>
              <div

 gz-customerSystem/src/views/register/matterDetail/FileTable.jsx

@@ -152,7 +152,6 @@
  ]

  useEffect(() => {
    console.log(props.fileInfoList);
    if (props.fileInfoList && props.fileInfoList.length != 0) {
      //证明材料
      const applyFile = props.fileInfoList.find(item => item.ownerType == "22_00018-101")

 gz-customerSystem/src/views/register/matterDetail/NewFileCheck.jsx

@@ -123,7 +123,7 @@
                                title={item.ownerTypeName + `（${item.fileList && item.fileList.length || 0}）`}
                            >
                                {item.fileList?.map(res => {
                                    return <MenuItem key={res.id} onClick={() => { clickItem(res) }}>{res.trueName}</MenuItem>
                                    return <MenuItem key={res.id} onClick={() => { clickItem(res) }}>{res.name}</MenuItem>
                                })}
                            </SubMenu>
                        })}
@@ -133,7 +133,7 @@
                    {
                        itemData ? <Fragment>
                            <div style={{ background: '#e8f3ff', color: '#1A6FB8', padding: '5px 10px', marginBottom: '16px' }}>
                                <span>材料名称：{itemData.trueName}</span>&nbsp;&nbsp;|&nbsp;&nbsp;
                                <span>材料名称：{itemData.name}</span>&nbsp;&nbsp;|&nbsp;&nbsp;
                                <span>上传时间：{itemData.updateTime}</span>&nbsp;&nbsp;|&nbsp;&nbsp;
                                <span>上传人：{itemData.uploaderName} {itemData.uploaderType && <span>（{peopleTypeMap[itemData.uploaderType]}）</span>}</span>
                            </div>

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

@@ -6,6 +6,7 @@


const ApplyDialog = ({ applyDialog }) => {
  console.log(applyDialog, 'applyDialog');
  return (
    <>
      {
@@ -49,14 +50,19 @@
              <th bgcolor="#F7F8FA" className="table-title">身份证明材料</th>
              <td>
                {
                  item.fileInfoList?.map(res => {
                    if (res.ownerType == "22_00018-202") {
                      return res.fileList.map((result, resIndex) => {
                        return <div style={{display: 'inline-block'}}>
                          <PreviewImage name={result.name} src={result.showUrl} />
                          {resIndex !== res.fileList.length - 1 && <>，</>}
                        </div>
                      })
                  item.file?.map((result, resIndex) => {
                    if (result.response) {
                      //新上传的，前端数据
                      const newData = result.response.data[0]
                      return <div style={{ display: 'inline-block' }}>
                        <PreviewImage name={newData.name} src={newData.showUrl} />
                        {resIndex !== item.file?.length - 1 && <>，</>}
                      </div>
                    } else {
                      return <div style={{ display: 'inline-block' }}>
                        <PreviewImage name={result.name} src={result.showUrl} />
                        {resIndex !== item.file?.length - 1 && <>，</>}
                      </div>
                    }
                  })
                }
@@ -74,6 +80,7 @@
}

const AgentDialog = ({ agentDialog }) => {
  console.log(agentDialog, 'agentDialog');
  return (
    <>
      {agentDialog?.map((item, index) => (
@@ -119,14 +126,19 @@
            <th bgcolor="#F7F8FA" className="table-title">身份证明材料</th>
            <td>
              {
                item.fileInfoList?.map(res => {
                  if (res.ownerType == "22_00018-202") {
                    return res.fileList?.map((result, resIndex) => {
                      return <a href="your-link-here.html" target="_blank">
                        <img src={link} alt="" className="title-file" />{result.trueName}
                        {resIndex !== res.fileList.length - 1 && <>，</>}
                      </a>
                    })
                item.file?.map((result, resIndex) => {
                  if (result.response) {
                    //新上传的，前端数据
                    const newData = result.response.data[0]
                    return <div style={{ display: 'inline-block' }}>
                      <PreviewImage name={newData.name} src={newData.showUrl} />
                      {resIndex !== item.file?.length - 1 && <>，</>}
                    </div>
                  } else {
                    return <div style={{ display: 'inline-block' }}>
                      <PreviewImage name={result.name} src={result.showUrl} />
                      {resIndex !== item.file?.length - 1 && <>，</>}
                    </div>
                  }
                })
              }
@@ -134,28 +146,32 @@
            <th bgcolor="#F7F8FA" className="table-title">代理人授权委托书</th>
            <td>
              {
                item.fileInfoList?.map(res => {
                  if (res.ownerType == '22_00018-207') {
                    return res.fileList.map((result, resIndex) => {
                      return <a href="your-link-here.html" target="_blank">
                        <img src={link} alt="" className="title-file" />{result.trueName}
                        {resIndex !== res.fileList.length - 1 && <>，</>}
                      </a>
                    })
                item.file1?.map((result, resIndex) => {
                  if (result.response) {
                    //新上传的，前端数据
                    const newData = result.response.data[0]
                    return <div style={{ display: 'inline-block' }}>
                      <PreviewImage name={newData.name} src={newData.showUrl} />
                      {resIndex !== item.file?.length - 1 && <>，</>}
                    </div>
                  } else {
                    return <div style={{ display: 'inline-block' }}>
                      <PreviewImage name={result.name} src={result.showUrl} />
                      {resIndex !== item.file?.length - 1 && <>，</>}
                    </div>
                  }
                })
              }
            </td>
          </tr>

        </table>

      ))}
    </>
  )
}

const Respondent = ({ respondent }) => {
  console.log(respondent, 'respondent');
  return (
    <>
      {respondent?.map((item, index) => (
@@ -182,14 +198,19 @@
            <th bgcolor="#F7F8FA" className="table-title">企业登记材料</th>
            <td>
              {
                item.fileInfoList?.map(res => {
                  if (res.ownerType == '22_00018-203') {
                    return res.fileList.map((result, resIndex) => {
                      return <a href="your-link-here.html" target="_blank">
                        <img src={link} alt="" className="title-file" />{result.trueName}
                        {resIndex !== res.fileList.length - 1 && <>，</>}
                      </a>
                    })
                item.file?.map((result, resIndex) => {
                  if (result.response) {
                    //新上传的，前端数据
                    const newData = result.response.data[0]
                    return <div style={{ display: 'inline-block' }}>
                      <PreviewImage name={newData.name} src={newData.showUrl} />
                      {resIndex !== item.file?.length - 1 && <>，</>}
                    </div>
                  } else {
                    return <div style={{ display: 'inline-block' }}>
                      <PreviewImage name={result.name} src={result.showUrl} />
                      {resIndex !== item.file?.length - 1 && <>，</>}
                    </div>
                  }
                })
              }
@@ -197,14 +218,19 @@
            <th bgcolor="#F7F8FA" className="table-title" >法定代表人身份证明材料</th>
            <td>
              {
                item.fileInfoList?.map(res => {
                  if (res.ownerType == '22_00018-204') {
                    return res.fileList.map((result, resIndex) => {
                      return <a href="your-link-here.html" target="_blank">
                        <img src={link} alt="" className="title-file" />{result.trueName}
                        {resIndex !== res.fileList.length - 1 && <>，</>}
                      </a>
                    })
                item.file1?.map((result, resIndex) => {
                  if (result.response) {
                    //新上传的，前端数据
                    const newData = result.response.data[0]
                    return <div style={{ display: 'inline-block' }}>
                      <PreviewImage name={newData.name} src={newData.showUrl} />
                      {resIndex !== item.file?.length - 1 && <>，</>}
                    </div>
                  } else {
                    return <div style={{ display: 'inline-block' }}>
                      <PreviewImage name={result.name} src={result.showUrl} />
                      {resIndex !== item.file?.length - 1 && <>，</>}
                    </div>
                  }
                })
              }
@@ -220,6 +246,7 @@
}

const Company = ({ company }) => {
  console.log(company, 'company');
  return (
    <>
      {company?.map((item, index) => (
@@ -246,14 +273,19 @@
            <th bgcolor="#F7F8FA" className="table-title">机构登记材料</th>
            <td>
              {
                item.fileInfoList?.map(res => {
                  if (res.ownerType == '22_00018-203') {
                    return res.fileList.map((result, resIndex) => {
                      return <a href="your-link-here.html" target="_blank">
                        <img src={link} alt="" className="title-file" />{result.trueName}
                        {resIndex !== res.fileList.length - 1 && <>，</>}
                      </a>
                    })
                item.file?.map((result, resIndex) => {
                  if (result.response) {
                    //新上传的，前端数据
                    const newData = result.response.data[0]
                    return <div style={{ display: 'inline-block' }}>
                      <PreviewImage name={newData.name} src={newData.showUrl} />
                      {resIndex !== item.file?.length - 1 && <>，</>}
                    </div>
                  } else {
                    return <div style={{ display: 'inline-block' }}>
                      <PreviewImage name={result.name} src={result.showUrl} />
                      {resIndex !== item.file?.length - 1 && <>，</>}
                    </div>
                  }
                })
              }
@@ -261,14 +293,19 @@
            <th bgcolor="#F7F8FA" className="table-title" >机构代表人身份证明材料</th>
            <td>
              {
                item.fileInfoList?.map(res => {
                  if (res.ownerType == '22_00018-204') {
                    return res.fileList.map((result, resIndex) => {
                      return <a href="your-link-here.html" target="_blank">
                        <img src={link} alt="" className="title-file" />{result.trueName}
                        {resIndex !== res.fileList.length - 1 && <>，</>}
                      </a>
                    })
                item.file1?.map((result, resIndex) => {
                  if (result.response) {
                    //新上传的，前端数据
                    const newData = result.response.data[0]
                    return <div style={{ display: 'inline-block' }}>
                      <PreviewImage name={newData.name} src={newData.showUrl} />
                      {resIndex !== item.file?.length - 1 && <>，</>}
                    </div>
                  } else {
                    return <div style={{ display: 'inline-block' }}>
                      <PreviewImage name={result.name} src={result.showUrl} />
                      {resIndex !== item.file?.length - 1 && <>，</>}
                    </div>
                  }
                })
              }

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

@@ -50,32 +50,7 @@
  }, [fakeData])

  useEffect(() => {
    setFakeData(props.partyList?.map(item => {
      const fileInfoList = item.fileInfoList
      let file = [];//身份证明材料、企业登记材料
      let file1 = [];//法人、机构身份证明材料、代理人授权委托书
      if (fileInfoList && fileInfoList.length != 0) {
        fileInfoList.forEach(item => {
          if (item.ownerType == '22_00018-202' || item.ownerType == '22_00018-203') {
            file.push({
              ...item.fileList[0],
              uid: item.fileList[0].id,
            })
          }
          if (item.ownerType == '22_00018-204' || item.ownerType == '22_00018-207') {
            file1.push({
              ...item.fileList[0],
              uid: item.fileList[0].id,
            })
          }
        })
      }
      return {
        ...item,
        file,
        file1
      }
    }) || [])
    setFakeData(props.partyList || [])
  }, [props.partyList])

  //获取当前时间

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

@@ -21,19 +21,19 @@
const Step = Steps.Step;

function saveDispute(data) {
  return $$.ax.request({ url: `casedraftInfo/caseDraftRegister`, type: 'post', service: 'mediate', data });
    return $$.ax.request({ url: `casedraftInfo/caseDraftRegister`, type: 'post', service: 'mediate', data });
}

function getId() {
  return $$.ax.request({ url: `caseUtils/getNewTimeCaseId`, type: 'get', service: 'utils' });
    return $$.ax.request({ url: `caseUtils/getNewTimeCaseId`, type: 'get', service: 'utils' });
}

function submitDispute(data) {
  return $$.ax.request({ url: `caseInfo/caseRegister`, type: 'post', service: 'mediate', data });
    return $$.ax.request({ url: `caseInfo/caseRegister`, type: 'post', service: 'mediate', data });
}

function getDetailData(id) {
  return $$.ax.request({ url: `casedraftInfo/getCasedraftInfo?id=${id}`, type: 'get', service: 'mediate' });
    return $$.ax.request({ url: `casedraftInfo/getCasedraftInfo?id=${id}`, type: 'get', service: 'mediate' });
}


@@ -62,9 +62,39 @@
        if (res.type) {
            const { agentList, personList, ...rest } = res.data
            const parList = agentList.concat(personList)
            const newParList = parList?.map(item => {
                const fileInfoList = item.fileInfoList
                let file = [];//身份证明材料、企业登记材料
                let file1 = [];//法人、机构身份证明材料、代理人授权委托书
                if (fileInfoList && fileInfoList.length != 0) {
                    fileInfoList.forEach(item => {
                        if (item.ownerType == '22_00018-202' || item.ownerType == '22_00018-203') {
                            item.fileList.forEach(res => {
                                file.push({
                                    ...res,
                                    uid: res.id,
                                })
                            })
                        }
                        if (item.ownerType == '22_00018-204' || item.ownerType == '22_00018-207') {
                            item.fileList.forEach(res => {
                                file1.push({
                                    ...res,
                                    uid: res.id,
                                })
                            })
                        }
                    })
                }
                return {
                    ...item,
                    file,
                    file1
                }
            }) || []
            const obj = {
                ...rest,
                fakeData: parList,
                fakeData: newParList,
                myCaseType: [rest.caseTypeFirst, rest.caseType],
                myQuesAddress: rest.queRoad ? [rest.queProv, rest.queCity, rest.queArea, rest.queRoad] : undefined
            }
@@ -89,18 +119,18 @@
                    const { myCaseType, myQuesAddress, ...rest } = formRef.current.getFields()
                    const params = handleData(rest)
                    $$.modalInfo({
            title: '提醒',
            content: '确定提交吗？',
            cancelText: '我再想想',
            onOk: () => {
              reauestSubmit({
                ...params,
                isSelfAccept: 0,
                isDraft: 0,
                operateType: 0,
              })
            },
          });
                        title: '提醒',
                        content: '确定提交吗？',
                        cancelText: '我再想想',
                        onOk: () => {
                            reauestSubmit({
                                ...params,
                                isSelfAccept: 0,
                                isDraft: 0,
                                operateType: 0,
                            })
                        },
                    });
                }
            });
        }
@@ -198,7 +228,7 @@
                            <Step title='结案归档' disabled />
                        </Steps>
                    </div>
                    <div style={{ backgroundColor: '#ffff', margin: '8px 8px 0px 16px', padding: '12px 18px 82px 16px', height: 'calc(100vh - 228px)', overflowY: 'scroll', display: isReview ? '' : 'none' }}>
                    <div style={{ backgroundColor: '#ffff', margin: '8px 8px 0px 16px', padding: '12px 18px 82px 16px', height: 'calc(100vh - 231px)', overflowY: 'scroll', display: isReview ? '' : 'none' }}>
                        <Preview style={{ display: isReview ? '' : 'none' }} data={formRef?.current?.getFields()} mainId={id} />
                    </div>
                    <VisitorRegister