import React, {Component} from 'react'
|
import { fromJS } from 'immutable'
|
import { Button, Modal, notification } 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,
|
upVisible: false,
|
docVisible: false,
|
files: [{data_code: 'ddd', data_name: '凭证'}],
|
list: [],
|
documents: [
|
{id: '1223', folder: '凭证附件', icon: excelImg, attachments_title: '主表20230130173553.xlsx', attachments_url: 'http://主表20230130173553.xlsx'},
|
{id: '1224', folder: '凭证附件', icon: excelImg, attachments_title: '主表2sdfsafjifjiji.xlsx', attachments_url: 'http://主表2sdfsafjifjiji.xlsx'},
|
{id: '1225', folder: '凭证附件', icon: excelImg, attachments_title: '主表20230sjiejgiej.xlsx', attachments_url: 'http://主表20230sjiejgiej.xlsx'},
|
{id: '1227', folder: '回执', icon: excelImg, attachments_title: '主表2023sdfrgtgfgd.xlsx', attachments_url: 'http://主表2023sdfrgtgfgd.xlsx'},
|
],
|
selectDocs: []
|
}
|
|
submit = () => {
|
this.setState({visible: false})
|
this.props.onChange(this.state.list)
|
}
|
|
trigger = () => {
|
const { attachlist } = this.props
|
let list = fromJS(attachlist).toJS()
|
list = list.map(item => {
|
item.icon = this.getIcon(item.attachments_url)
|
return item
|
})
|
|
this.setState({visible: true, list: list})
|
}
|
|
upSubmit = () => {
|
const { config, book, orgcode } = this.props
|
|
if (!book) {
|
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: book.id
|
}
|
|
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
|
}
|
|
item.icon = this.getIcon(res.url)
|
|
list.push(item)
|
|
this.setState({list: list})
|
})
|
})
|
}
|
|
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 = () => {
|
|
}
|
|
render() {
|
const { visible, upVisible, docVisible, files, list, documents } = this.state
|
|
return (
|
<>
|
<Button type="link" onClick={this.trigger}>附件</Button>
|
<Modal
|
title="添加附件"
|
wrapClassName="voucher-attach-wrap"
|
visible={visible}
|
width={700}
|
maskClosable={false}
|
onOk={this.submit}
|
onCancel={() => { this.setState({ visible: false })}}
|
cancelText=""
|
destroyOnClose
|
>
|
<Button type="link" className="attach-type-btn" onClick={() => this.setState({upVisible: true})}>上传新文件</Button>
|
<Button type="link" className="attach-type-btn" 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_url}</div>
|
</div>
|
<div>
|
<DeleteOutlined onClick={() => this.deleteFile(item.id)}/>
|
</div>
|
</div>
|
})}
|
</div>
|
</Modal>
|
<Modal
|
title="添加附件"
|
wrapClassName="voucher-attach-add-wrap"
|
visible={upVisible}
|
width={700}
|
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={700}
|
maskClosable={false}
|
onOk={this.docSubmit}
|
onCancel={() => { this.setState({ docVisible: false, selectDocs: [] })}}
|
destroyOnClose
|
>
|
{docVisible ? <Documents documents={documents} onChange={(vals) => this.setState({selectDocs: vals})}/> : null}
|
</Modal>
|
</>
|
)
|
}
|
}
|
|
export default ResetAttach
|
