2024-12-05

king

2024-12-05 4a356e81b1a456f0cb16f61f548c46171c26c1b6

 src/tabviews/custom/components/module/voucher/resetAttach/index.jsx

@@ -1,32 +1,237 @@
import React, {Component} from 'react'
import { fromJS } from 'immutable'
import { Button, Modal } from 'antd'
import { Button, Modal, notification, Spin } from 'antd'
import moment from 'moment'
import { DeleteOutlined } from '@ant-design/icons'
// import md5 from 'md5'

import Api from '@/api'
import AddAttach from './addAttach'
import Documents from './documents'
import './index.scss'

import wordImg from '@/assets/img/file-word-fill.png'
import excelImg from '@/assets/img/file-excel-fill.png'
import fileImg from '@/assets/img/file-fill.png'
import pdfImg from '@/assets/img/file-pdf-fill.png'
import pptImg from '@/assets/img/file-ppt-fill.png'
import picImg from '@/assets/img/picture-fill.png'
import rarImg from '@/assets/img/rar.png'

class ResetAttach extends Component {
  state = {
    visible: false,
    list: ''
    upVisible: false,
    docVisible: false,
    files: [],
    list: [],
    documents: [],
    selectDocs: [],
    loading: false
  }

  submit = () => {
    this.setState({remark: '', visible: false})
    this.props.onChange()
    this.setState({visible: false})
    this.props.onChange(this.state.list)
  }

  trigger = () => {
    const { attachlist } = this.props
    const { voucherCode, orgcode } = this.props
    let list = fromJS(this.props.attachlist).toJS()

    this.setState({visible: true, list: fromJS(attachlist).toJS()})
    list = list.map(item => {
      item.icon = this.getIcon(item.attachments_url)
      return item
    })

    this.setState({visible: true, loading: true, list: list, files: [], documents: []})

    let param = {
      func: 's_get_fcc_voucher_attachments',
      voucher_code: voucherCode || '',
      orgcode: orgcode
    }

    Api.genericInterface(param).then(result => {
      this.setState({loading: false})

      if (!result.status) {
        notification.warning({
          top: 92,
          message: result.message,
          duration: 5
        })
        return
      }

      if (result.fcc_files) {
        let files = []
        let documents = []

        result.fcc_files.forEach(file => {
          files.push({data_code: file.data_code, data_name: file.data_name, id: file.id})

          file.attachments = file.attachments.map(item => {
            item.id = item.attach_id
            item.icon = this.getIcon(item.attachments_url)
            item.data_code = file.data_code
            item.data_name = file.data_name
            item.BID = file.id

            return item
          })

          documents.push(file)
        })

        this.setState({files, documents})
      }
    })
  }

  triggerUpload = () => {
    
  upSubmit = () => {
    const { config, orgcode } = this.props

    if (!orgcode) {
      notification.warning({
        top: 92,
        message: '公司编码不可为空！',
        duration: 5
      })
      return
    }

    let ID = (() => {
      let uuid = []
      let options = '0123456789abcdefghigklmnopqrstuv'
      for (let i = 0; i < 19; i++) {
        uuid.push(options.substr(Math.floor(Math.random() * 0x20), 1))
      }
      uuid = moment().format('YYYYMMDDHHmmssSSS') + uuid.join('')
      return uuid.toUpperCase()
    })()

    this.formRef.handleConfirm().then(res => {
      let param = {
        func: 's_fcc_voucher_attachments_addupt',
        data_code: res.data_code,
        data_name: res.data_name,
        id: ID,
        orgcode: orgcode,
        voucher_at_lp: '',
        attachments_title: res.attachments_title,
        f_method: res.f_method,
        attachments_url: res.url,
        remark: res.remark,
        status: config.wrap.attachStatus !== 10 ? 0 : 10,
        statusname: config.wrap.attachStatus !== 10 ? '待审核' : '已审核',
        typename: config.name,
        UserName: sessionStorage.getItem('User_Name') || '',
        FullName: sessionStorage.getItem('Full_Name') || '',
        BID: res.BID
      }

      Api.genericInterface(param).then(result => {
        if (!result.status) {
          notification.warning({
            top: 92,
            message: result.message,
            duration: 5
          })
          return
        }

        let list = fromJS(this.state.list).toJS()
        let item = {
          id: ID,
          data_code: res.data_code,
          data_name: res.data_name,
          attachments_title: res.attachments_title,
          attachments_url: res.url,
          BID: res.BID
        }

        item.icon = this.getIcon(res.url)

        list.push(item)

        this.setState({list: list, upVisible: false})
      })
    })
  }

  deleteFile = (id) => {
    this.setState({list: this.state.list.filter(item => item.id !== id)})
  }

  getIcon = (url) => {
    let type = 'file'

    if (/(.png|.jpg|.gif|.jpeg)$/i.test(url)) {
      type = 'pic'
    } else if (/(.doc|.docx)$/i.test(url)) {
      type = 'word'
    } else if (/(.xls|.xlsx)$/i.test(url)) {
      type = 'excel'
    } else if (/(.zip|.rar)$/i.test(url)) {
      type = 'rar'
    } else if (/.pdf$/i.test(url)) {
      type = 'pdf'
    } else if (/.pptx$/i.test(url)) {
      type = 'ppt'
    }

    let icon = fileImg
    if (type === 'excel') {
      icon = excelImg
    } else if (type === 'word') {
      icon = wordImg
    } else if (type === 'pdf') {
      icon = pdfImg
    } else if (type === 'pic') {
      icon = picImg
    } else if (type === 'ppt') {
      icon = pptImg
    } else if (type === 'rar') {
      icon = rarImg
    }

    return icon
  }

  docSubmit = () => {
    const { selectDocs, list } = this.state

    if (selectDocs.length > 0 && list.length > 0) {
      let _list = fromJS(list).toJS()
      let err = ''
      let ids = list.map(item => item.id)

      selectDocs.forEach(item => {
        if (!ids.includes(item.id)) {
          _list.push(item)
        } else {
          err += (err ? '、' : '') + item.attachments_title
        }
      })

      this.setState({list: _list, docVisible: false})

      if (err) {
        notification.warning({
          top: 92,
          message: '文件' + err + '已添加。',
          duration: 5
        })
      }
    } else {
      this.setState({list: [...list, ...selectDocs], docVisible: false})
    }
  }

  render() {
    const { visible } = this.state
    const { disabled } = this.props
    const { visible, upVisible, docVisible, files, list, documents, loading } = this.state

    return (
      <>
@@ -35,20 +240,55 @@
          title="添加附件"
          wrapClassName="voucher-attach-wrap"
          visible={visible}
          width={700}
          width={'62vw'}
          maskClosable={false}
          onOk={this.submit}
          onCancel={() => { this.setState({ visible: false })}}
          cancelText=""
          destroyOnClose
        >
          <Button type="link" className="attach-type-btn" onClick={this.triggerUpload}>上传新文件</Button>
          <Button type="link" className="attach-type-btn" onClick={this.trigger}>从会计电子档案选择</Button>
          {loading ? <Spin /> : null}
          <Button type="link" className="attach-type-btn" disabled={loading || disabled} onClick={() => this.setState({upVisible: true})}>上传新文件</Button>
          <Button type="link" className="attach-type-btn" disabled={loading || disabled} onClick={() => this.setState({docVisible: true, selectDocs: []})}>从会计电子档案选择</Button>
          <div className="attach-selected-list">


            {list.map(item => {
              return <div className="attach-item" key={item.id}>
                <img src={item.icon} alt=""/>
                <div className="attach-msg">
                  {/* <div>{item.attachments_title}</div> */}
                  <div>{item.data_name ? item.data_name + ' / ' : ''}{item.attachments_title}</div>
                </div>
                <div>
                  {!disabled ? <DeleteOutlined onClick={() => this.deleteFile(item.id)}/> : null}
                </div>
              </div>
            })}
          </div>
        </Modal>
        <Modal
          title="添加附件"
          wrapClassName="voucher-attach-add-wrap"
          visible={upVisible}
          width={'62vw'}
          maskClosable={false}
          onOk={this.upSubmit}
          onCancel={() => { this.setState({ upVisible: false })}}
          destroyOnClose
        >
          <AddAttach files={files} wrappedComponentRef={(inst) => this.formRef = inst} submit={this.upSubmit}/>
        </Modal>
        <Modal
          title="电子档案"
          wrapClassName="voucher-attach-document-wrap"
          visible={docVisible}
          width={'62vw'}
          maskClosable={false}
          onOk={this.docSubmit}
          onCancel={() => { this.setState({ docVisible: false, selectDocs: [] })}}
          destroyOnClose
        >
          {docVisible ? <Documents documents={documents} list={list} onChange={(vals) => this.setState({selectDocs: vals})}/> : null}
        </Modal>
      </>
    )
  }