diff --git a/src/components/Documents.jsx b/src/components/Documents.jsx index c758f90..e3bbda3 100644 --- a/src/components/Documents.jsx +++ b/src/components/Documents.jsx @@ -9,27 +9,9 @@ import LoaderPortal from './LoaderPortal' import locale from "antd/lib/locale/ru_RU" import moment from 'moment' -const pageSize = 26 +const pageSize = 12 const {RangePicker} = DatePicker; -const columns = [ - { - title: 'Документ', - key: 'document', - dataIndex: 'name', - }, - { - title: 'Дата загрузки', - key: 'uploadDate', - dataIndex: 'uploadDate', - render: (item) => moment.utc(item).local().format('DD MMM YYYY, HH:mm:ss') - }, - { - title: 'Ф.И.О.', - key: 'userName', - dataIndex: 'userName', - } -]; export default function Documents({selectedFileCategory}) { let {id} = useParams() @@ -39,10 +21,71 @@ export default function Documents({selectedFileCategory}) { const [pagination, setPagination] = useState(null) const [files, setFiles] = useState([]) const [selectedFiles, setSelectedFiles] = useState([]) + const [isTableUpdating, setTableUpdating] = useState(false) const [loader, setLoader] = useState(false) + const [form] = Form.useForm(); + + const handleFileNameCLick = async (event, row) => { + const element = event.target + + if(!element.href.length) { + try { + setLoader(true) + + await fetch(`/api/files/${id}/${row.id}`, { + headers: { + Authorization: 'Bearer ' + localStorage['token'] + } + }) + .then(async (response) => { + const blob = await response.blob(); + + let reader = new FileReader(); + reader.readAsDataURL(blob); + reader.onload = function (e) { + element.href = e.target.result + element.click() + }; + setLoader(false) + }); + } catch (error) { + notify(`Не удалось скачать файл ${row}`, 'error') + console.log(error) + } + } + } + + const columns = [ + { + title: 'Документ', + key: 'document', + dataIndex: 'name', + render: (name, row) => + handleFileNameCLick(ev, row)} download={name}>{name} + }, + { + title: 'Дата загрузки', + key: 'uploadDate', + dataIndex: 'uploadDate', + render: (item) => moment.utc(item).local().format('DD MMM YYYY, HH:mm:ss') + }, + { + title: 'Ф.И.О.', + key: 'userName', + dataIndex: 'userName', + } + ]; const submitFileFormProps = { + progress: { + strokeColor: { + '0%': '#108ee9', + '100%': '#87d068', + }, + strokeWidth: 3, + format: percent => `${parseFloat(percent.toFixed(2))}%`, + }, onChange({ file, fileList }) { if (file.status !== 'uploading') { setSelectedFiles(fileList) @@ -54,11 +97,12 @@ export default function Documents({selectedFileCategory}) { setRange(range) } - const onFinish = (values) => { + const onFinish = (values, form) => { var fileList = values.fileInput.fileList if (fileList.length > 0) { + setLoader(true) const formData = new FormData(); fileList.forEach(val => { @@ -73,7 +117,9 @@ export default function Documents({selectedFileCategory}) { body: formData }) .then(async (response) => { - // refresh component to upload new files в зависимоть useEffect какую-то переменную, чтоб дергался снова запрос на всю инфу о файлах + setLoader(false) + form.resetFields() + setTableUpdating(true) }); } } @@ -93,7 +139,7 @@ export default function Documents({selectedFileCategory}) { begin = range[0].toISOString() end = range[1].toISOString() } - console.log(id) + await FileService.getFilesInfo( `${id}`, (page - 1) * pageSize, @@ -114,37 +160,40 @@ export default function Documents({selectedFileCategory}) { total: paginatedFiles?.count, current: Math.floor(paginatedFiles?.skip / pageSize), }) + + setTableUpdating(false) + setLoader(false) } ) } catch (ex) { notify(`Не удалось загрузить файлы по скважине "${id}"`, 'error') console.log(ex) } - setLoader(false) } GetDocuments() - }, [id, selectedFileCategory, range]) + }, [id, range, selectedFileCategory, isTableUpdating]) return (