Merge branch 'Documents'

src/components/CementFluid.jsx

@@ -0,0 +1,106 @@
+let date = new Date().toLocaleString()
+
+export function CementFluid() {
+  return (<>
+    <table>
+      <thead style={{borderTop:"2px solid", borderLeft: "2px solid", borderRight: "2px solid", borderBottom: "2px solid", width: "800px", fontWeight: "800", textAlign: "center"}}>
+      <tr>
+        <td style={{borderTop:"2px solid", borderLeft: "2px solid", borderRight: "2px solid", borderBottom: "2px solid", width: "66px", fontWeight: "800", textAlign: "center"}}>
+          <b>Наименование</b></td>
+        <td style={{borderTop:"2px solid", borderLeft: "2px solid", borderRight: "2px solid", borderBottom: "2px solid", width: "66px", fontWeight: "800", textAlign: "center"}}>Температура, °C</td>
+        <td style={{borderTop:"2px solid", borderLeft: "2px solid", borderRight: "2px solid", borderBottom: "2px solid", width: "66px", fontWeight: "800", textAlign: "center"}}>Плотность, г/см³</td>
+        <td style={{borderTop:"2px solid", borderLeft: "2px solid", borderRight: "2px solid", borderBottom: "2px solid", width: "66px", fontWeight: "800", textAlign: "center"}}>Усл. вязкость, сек</td>
+        <td style={{borderTop:"2px solid", borderLeft: "2px solid", borderRight: "2px solid", borderBottom: "2px solid", width: "66px", fontWeight: "800", textAlign: "center"}}>R300</td>
+        <td style={{borderTop:"2px solid", borderLeft: "2px solid", borderRight: "2px solid", borderBottom: "2px solid", width: "66px", fontWeight: "800", textAlign: "center"}}>R600</td>
+        <td style={{borderTop:"2px solid", borderLeft: "2px solid", borderRight: "2px solid", borderBottom: "2px solid", width: "66px", fontWeight: "800", textAlign: "center"}}>R3/R6</td>
+        <td style={{borderTop:"2px solid", borderLeft: "2px solid", borderRight: "2px solid", borderBottom: "2px solid", width: "66px", fontWeight: "800", textAlign: "center"}}>ДНС, дПа</td>
+        <td style={{borderTop:"2px solid", borderLeft: "2px solid", borderRight: "2px solid", borderBottom: "2px solid", width: "66px", fontWeight: "800", textAlign: "center"}}>Пластич. вязкость, сПз</td>
+        <td style={{borderTop:"2px solid", borderLeft: "2px solid", borderRight: "2px solid", borderBottom: "2px solid", width: "66px", fontWeight: "800", textAlign: "center"}}>СНС, дПа</td>
+        <td style={{borderTop:"2px solid", borderLeft: "2px solid", borderRight: "2px solid", borderBottom: "2px solid", width: "66px", fontWeight: "800", textAlign: "center"}}>R3/R6 49С</td>
+        <td style={{borderTop:"2px solid", borderLeft: "2px solid", borderRight: "2px solid", borderBottom: "2px solid", width: "66px", fontWeight: "800", textAlign: "center"}}>ДНС 49С, дПа</td>
+        <td style={{borderTop:"2px solid", borderLeft: "2px solid", borderRight: "2px solid", borderBottom: "2px solid", width: "66px", fontWeight: "800", textAlign: "center"}}>Пластич. вязкость 49С, сПз</td>
+        <td style={{borderTop:"2px solid", borderLeft: "2px solid", borderRight: "2px solid", borderBottom: "2px solid", width: "66px", fontWeight: "800", textAlign: "center"}}>СНС 49С, дПа</td>
+        <td style={{borderTop:"2px solid", borderLeft: "2px solid", borderRight: "2px solid", borderBottom: "2px solid", width: "66px", fontWeight: "800", textAlign: "center"}}>МВТ, кг/м³</td>
+        <td style={{borderTop:"2px solid", borderLeft: "2px solid", borderRight: "2px solid", borderBottom: "2px solid", width: "66px", fontWeight: "800", textAlign: "center"}}>Песок, %</td>
+        <td style={{borderTop:"2px solid", borderLeft: "2px solid", borderRight: "2px solid", borderBottom: "2px solid", width: "66px", fontWeight: "800", textAlign: "center"}}>Фильтрация, см³/30мин</td>
+        <td style={{borderTop:"2px solid", borderLeft: "2px solid", borderRight: "2px solid", borderBottom: "2px solid", width: "66px", fontWeight: "800", textAlign: "center"}}>Корка, мм</td>
+        <td style={{borderTop:"2px solid", borderLeft: "2px solid", borderRight: "2px solid", borderBottom: "2px solid", width: "66px", fontWeight: "800", textAlign: "center"}}>КТК</td>
+        <td style={{borderTop:"2px solid", borderLeft: "2px solid", borderRight: "2px solid", borderBottom: "2px solid", width: "66px", fontWeight: "800", textAlign: "center"}}>рН</td>
+        <td style={{borderTop:"2px solid", borderLeft: "2px solid", borderRight: "2px solid", borderBottom: "2px solid", width: "66px", fontWeight: "800", textAlign: "center"}}>Жесткость, мг/л</td>
+        <td style={{borderTop:"2px solid", borderLeft: "2px solid", borderRight: "2px solid", borderBottom: "2px solid", width: "66px", fontWeight: "800", textAlign: "center"}}>Хлориды, мг/л</td>
+        <td style={{borderTop:"2px solid", borderLeft: "2px solid", borderRight: "2px solid", borderBottom: "2px solid", width: "66px", fontWeight: "800", textAlign: "center"}}>Pf</td>
+        <td style={{borderTop:"2px solid", borderLeft: "2px solid", borderRight: "2px solid", borderBottom: "2px solid", width: "66px", fontWeight: "800", textAlign: "center"}}>Mf</td>
+        <td style={{borderTop:"2px solid", borderLeft: "2px solid", borderRight: "2px solid", borderBottom: "2px solid", width: "66px", fontWeight: "800", textAlign: "center"}}>Pm</td>
+        <td style={{borderTop:"2px solid", borderLeft: "2px solid", borderRight: "2px solid", borderBottom: "2px solid", width: "66px", fontWeight: "800", textAlign: "center"}}>Твердая фаза раствора, %</td>
+        <td style={{borderTop:"2px solid", borderLeft: "2px solid", borderRight: "2px solid", borderBottom: "2px solid", width: "66px", fontWeight: "800", textAlign: "center"}}>Смазка, %</td>
+        <td style={{borderTop:"2px solid", borderLeft: "2px solid", borderRight: "2px solid", borderBottom: "2px solid", width: "66px", fontWeight: "800", textAlign: "center"}}>Карбонат кальция, кг/м³</td>
+      </tr>
+      </thead>
+      <tbody style={{borderTop:"2px solid", borderLeft: "2px solid", borderRight: "2px solid", borderBottom: "2px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>
+      <tr>
+        <td style={{borderTop:"2px solid", borderLeft: "2px solid", borderRight: "2px solid", borderBottom: "2px solid", width: "66px", fontWeight: "800", textAlign: "center"}}><b>План</b></td>
+        <td style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+      </tr>
+      <tr>
+        <td style={{borderTop:"2px solid", borderLeft: "2px solid", borderRight: "2px solid", borderBottom: "2px solid", width: "66px", fontWeight: "800"}}><b>Факт</b></td>
+        <td  style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td  style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td  style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td  style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td  style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td  style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td  style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td  style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td  style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td  style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td  style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td  style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td  style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td  style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td  style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td  style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td  style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td  style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td  style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td  style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td  style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td  style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td  style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td  style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td  style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td  style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+        <td  style={{borderTop:"1px solid", borderLeft: "1px solid", borderRight: "1px solid", borderBottom: "1px solid", width: "66px", fontWeight: "400", textAlign: "center"}}>&nbsp;</td>
+      </tr>
+      </tbody>
+    </table>
+      <div>&nbsp;</div>
+    <p style={{textAlign: "right"}}><b>{date}</b></p>
+    </>
+  )
+}

src/components/Disposition.jsx

@@ -0,0 +1,19 @@
+let date = new Date().toLocaleString()
+
+
+export default function Disposition() {
+  return (
+    <>
+      <h1 style={{textAlign: "center"}}>Распоряжение</h1>
+
+      <p style={{textAlign: "justify"}}>
+        Текст
+      </p>
+
+      <p style={{textAlign: "right"}}><i>Ф.И.О.</i></p>
+      <p style={{textAlign: "right"}}><i>Должность</i></p>
+      <p style={{textAlign: "right"}}><i>Компания</i></p>
+      <p style={{textAlign: "right"}}><b>{date}</b></p>
+    </>
+  )
+}

src/components/Documents.jsx

@@ -0,0 +1,230 @@
+import {Table, DatePicker, Form, Button, Upload, ConfigProvider} from 'antd'
+import { UploadOutlined } from '@ant-design/icons'
+import MenuDocuments from "./MenuDocuments"
+import { FileService } from '../services/api'
+import {useState, useEffect} from "react"
+import {useParams} from 'react-router-dom'
+import notify from './notify'
+import LoaderPortal from './LoaderPortal'
+import locale from "antd/lib/locale/ru_RU"
+import moment from 'moment'
+
+const pageSize = 12
+const {RangePicker} = DatePicker;
+
+
+export default function Documents({selectedFileCategory}) {
+  let {id} = useParams()
+
+  const [page, setPage] = useState(1)
+  const [range, setRange] = useState([])
+  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) => 
+          <a onClick={ev => handleFileNameCLick(ev, row)} download={name}>{name}</a>
+    },
+    {
+        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)
+      }
+    }
+  }
+
+  const onChangeRange = (range) => {
+    setRange(range)
+  }
+
+  const onFinish = (values, form) => {
+    var fileList = values.fileInput.fileList
+
+    if (fileList.length > 0)
+    {
+      setLoader(true)
+      const formData = new FormData();
+
+      fileList.forEach(val => {
+        formData.append('files', val.originFileObj)
+      })
+
+      fetch(`/api/files/${id}/files?idCategory=${selectedFileCategory}&idUser=${localStorage['userId']}`, {
+        headers: {
+          Authorization: 'Bearer ' + localStorage['token']
+        },
+        method: 'POST',
+        body: formData
+      })
+      .then(async (response) => {
+        setLoader(false)
+        form.resetFields()
+        setTableUpdating(true)
+      });
+    }
+  }
+
+  const onFinishFailed = (errorInfo) => {
+    notify(`Не удалось отправить файлы по скважине "${id}".`, 'error')
+  }
+
+  useEffect(() => {
+    const GetDocuments = async () => {
+      setLoader(true)
+
+      try {
+        let begin = null
+        let end = null
+        if (range?.length > 1) {
+          begin = range[0].toISOString()
+          end = range[1].toISOString()
+        }
+
+        await FileService.getFilesInfo(
+            `${id}`,
+            (page - 1) * pageSize,
+            pageSize,
+            selectedFileCategory,
+            begin,
+            end
+            ).then((paginatedFiles) => {
+                setFiles(paginatedFiles?.items.map(f => {
+                    return {
+                        key: f.id,
+                        begin: f.date,
+                        ...f
+                    }
+                }))
+
+                setPagination({
+                    total: paginatedFiles?.count,
+                    current: Math.floor(paginatedFiles?.skip / pageSize),
+                })
+
+                setTableUpdating(false)
+                setLoader(false)
+            }
+        )
+      } catch (ex) {
+        notify(`Не удалось загрузить файлы по скважине "${id}"`, 'error')
+        console.log(ex)
+      }
+    }
+    GetDocuments()
+  }, [id, range,page, selectedFileCategory, isTableUpdating])
+
+  return (
+    <div>
+      <MenuDocuments/>
+        <div className='filter-group'>
+          <h3 className='filter-group-heading'>Фильтр документов:</h3>
+          <ConfigProvider locale={locale}>
+              <RangePicker
+                  showTime
+                  onChange={onChangeRange}
+              />
+          </ConfigProvider>
+        </div>
+        <LoaderPortal show={loader}></LoaderPortal>
+        <div>&nbsp;</div>
+        <Form
+          form={form}
+          name="DocumentsUploadForm"
+          onFinish={(values) => onFinish(values, form)}
+          onFinishFailed={onFinishFailed}
+          style={{width: '300px'}}
+        >
+          <Form.Item
+            name="fileInput"
+            rules={[{ required: true, message: 'Выберите файл' }]}
+          >
+            <Upload {...submitFileFormProps}>
+              <Button icon={<UploadOutlined />}>Загрузить файл</Button>
+            </Upload>
+          </Form.Item>
+          <Form.Item>
+            <Button 
+              type="primary" 
+              htmlType="submit"
+              disabled={selectedFiles.length === 0}
+            >
+              Отправить
+            </Button>
+          </Form.Item>
+        </Form>
+      <div>&nbsp;</div>
+      <Table
+        columns={columns}
+        dataSource={files}
+        size={'small'}
+        pagination={{
+          pageSize: pageSize,
+          showSizeChanger: false,
+          total: pagination?.total,
+          current: page,
+          onChange: (page) => setPage(page)
+        }}
+        rowKey={(record) => record.id}
+      />
+    </div>);
+}

src/components/MenuDocuments.jsx

@@ -0,0 +1,50 @@
+import {Menu} from "antd";
+import {FolderOutlined} from "@ant-design/icons";
+import {Link} from "react-router-dom";
+import {useState} from "react"
+
+
+export default function MenuDocuments() {
+
+  const [selectedItem, setSelectedItem] = useState(1)
+
+  const handleClick = e => {
+    setSelectedItem({ current: e.key });
+  };
+
+  return(
+  <>
+    <Menu
+      mode="horizontal"
+      selectable={true}
+      className="well_menu"
+      onClick={handleClick} 
+      selectedKeys={[selectedItem]}
+    >
+      <Menu.Item key="1" icon={<FolderOutlined/>}>
+        <Link to='fluidService'>Растворный сервис</Link>
+      </Menu.Item>
+      <Menu.Item key="2" icon={<FolderOutlined/>}>
+        <Link to='cementing'>Цементирование</Link>
+      </Menu.Item>
+      <Menu.Item key="3" icon={<FolderOutlined/>}>
+        <Link to='nnb'>ННБ</Link>
+      </Menu.Item>
+      <Menu.Item key="4" icon={<FolderOutlined/>}>
+        <Link to='gti'>ГТИ</Link>
+      </Menu.Item>
+      <Menu.Item key="5" icon={<FolderOutlined/>}>
+        <Link to='documentsForWell'>Документы по скважине</Link>
+      </Menu.Item>
+      <Menu.Item key="6" icon={<FolderOutlined/>}>
+        <Link to='supervisor'>Супервайзер</Link>
+      </Menu.Item>
+      <Menu.Item key="7" icon={<FolderOutlined/>}>
+        <Link to='master'>Мастер</Link>
+      </Menu.Item>
+      <Menu.Item key="8" icon={<FolderOutlined/>}>
+        <Link to='lastData'>Последние данные</Link>
+      </Menu.Item>
+    </Menu>
+  </>)
+}

src/components/NnbTable.jsx

@@ -0,0 +1,250 @@
+let date = new Date().toLocaleString()
+
+export function NnbTable() {
+  return (<>
+    <table cellspacing="0" border="0">
+      <colGroup span="18" width="79"></colGroup>
+      <tr>
+        <td style={{
+          borderTop: "2px solid #000000",
+          borderBottom: "2px solid #000000",
+          borderLeft: "2px solid #000000",
+          borderRight: "1px solid #000000"
+        }} height="91" align="center" valign="middle" bgcolor="#E2F0D9" sdnum="1049;0;0,00"><font face="Tahoma"
+                                                                                                  size="2">Глубина по
+          стволу, м</font></td>
+        <td style={{
+          borderTop: "2px solid #000000",
+          borderBottom: "2px solid #000000",
+          borderLeft: "1px solid #000000",
+          borderRight: "1px solid #000000"
+        }} align="center" valign="middle" bgcolor="#E2F0D9" sdnum="1049;0;0,00"><font face="Tahoma" size="2">Зенитный
+          угол, град</font></td>
+        <td style={{
+          borderTop: "2px solid #000000",
+          borderBottom: "2px solid #000000",
+          borderLeft: "1px solid #000000",
+          borderRight: "1px solid #000000"
+        }} align="center" valign="middle" bgcolor="#E2F0D9" sdnum="1049;0;0,00"><font face="Tahoma" size="2">Азимут
+          магнитный, град</font></td>
+        <td style={{
+          borderTop: "2px solid #000000",
+          borderBottom: "2px solid #000000",
+          borderLeft: "1px solid #000000",
+          borderRight: "1px solid #000000"
+        }} align="center" valign="middle" bgcolor="#E2F0D9" sdnum="1049;0;0,00"><font face="Tahoma" size="2">Азимут
+          истинный, град</font></td>
+        <td style={{
+          borderTop: "2px solid #000000",
+          borderBottom: "2px solid #000000",
+          borderLeft: "1px solid #000000",
+          borderRight: "1px solid #000000"
+        }} align="center" valign="middle" bgcolor="#E2F0D9" sdnum="1049;0;0,00"><font face="Tahoma" size="2">Азимут
+          дирекц., град</font></td>
+        <td style={{
+          borderTop: "2px solid #000000",
+          borderBottom: "2px solid #000000",
+          borderLeft: "1px solid #000000",
+          borderRight: "1px solid #000000"
+        }} align="center" valign="middle" bgcolor="#E2F0D9" sdnum="1049;0;0,00"><font face="Tahoma" size="2">Глубина по
+          вертикали, м</font></td>
+        <td style={{
+          borderTop: "2px solid #000000",
+          borderBottom: "2px solid #000000",
+          borderLeft: "1px solid #000000",
+          borderRight: "1px solid #000000"
+        }} align="center" valign="middle" bgcolor="#E2F0D9" sdnum="1049;0;0,00"><font face="Tahoma" size="2">Абсолютная
+          отметка, м</font></td>
+        <td style={{
+          borderTop: "2px solid #000000",
+          borderBottom: "2px solid #000000",
+          borderLeft: "1px solid #000000",
+          borderRight: "1px solid #000000"
+        }} align="center" valign="middle" bgcolor="#E2F0D9" sdnum="1049;0;0,00"><font face="Tahoma" size="2">Лок.
+          смещение к северу, м</font></td>
+        <td style={{
+          borderTop: "2px solid #000000",
+          borderBottom: "2px solid #000000",
+          borderLeft: "1px solid #000000",
+          borderRight: "1px solid #000000"
+        }} align="center" valign="middle" bgcolor="#E2F0D9" sdnum="1049;0;0,00"><font face="Tahoma" size="2">Лок.
+          смещение к востоку, м</font></td>
+        <td style={{
+          borderTop: "2px solid #000000",
+          borderBottom: "2px solid #000000",
+          borderLeft: "1px solid #000000",
+          borderRight: "1px solid #000000"
+        }} align="center" valign="middle" bgcolor="#E2F0D9" sdnum="1049;0;0,00"><font face="Tahoma" size="2">Отклонение
+          от устья, м</font></td>
+        <td style={{
+          borderTop: "2px solid #000000",
+          borderBottom: "2px solid #000000",
+          borderLeft: "1px solid #000000",
+          borderRight: "1px solid #000000"
+        }} align="center" valign="middle" bgcolor="#E2F0D9" sdnum="1049;0;0,00"><font face="Tahoma" size="2">Азимут
+          смещения, град</font></td>
+        <td style={{
+          borderTop: "2px solid #000000",
+          borderBottom: "2px solid #000000",
+          borderLeft: "1px solid #000000",
+          borderRight: "1px solid #000000"
+        }} align="center" valign="middle" bgcolor="#E2F0D9" sdnum="1049;0;0,00"><font face="Tahoma" size="2">Отклонение
+          от устья, м</font></td>
+        <td style={{
+          borderTop: "2px solid #000000",
+          borderBottom: "2px solid #000000",
+          borderLeft: "1px solid #000000",
+          borderRight: "1px solid #000000"
+        }} align="center" valign="middle" bgcolor="#E2F0D9" sdnum="1049;0;0,000"><font face="Tahoma" size="2">Пространст.
+          интенсивность, град/10 м</font></td>
+        <td style={{
+          borderTop: "2px solid #000000",
+          borderBottom: "2px solid #000000",
+          borderLeft: "1px solid #000000",
+          borderRight: "1px solid #000000"
+        }} align="center" valign="middle" bgcolor="#E2F0D9" sdnum="1049;0;0,00"><font face="Tahoma" size="2">Угол
+          установки отклон., град</font></td>
+        <td style={{
+          borderTop: "2px solid #000000",
+          borderBottom: "2px solid #000000",
+          borderLeft: "1px solid #000000",
+          borderRight: "1px solid #000000"
+        }} align="center" valign="middle" bgcolor="#E2F0D9" sdnum="1049;0;0,00"><font face="Tahoma" size="2">Интенсив.
+          по зениту, град/10 м</font></td>
+        <td style={{
+          borderTop: "2px solid #000000",
+          borderBottom: "2px solid #000000",
+          borderLeft: "1px solid #000000",
+          borderRight: "1px solid #000000"
+        }} align="center" valign="middle" bgcolor="#E2F0D9" sdnum="1049;0;@"><font face="Tahoma"
+                                                                                   size="2">Комментарий</font></td>
+        <td style={{
+          borderTop: "2px solid #000000",
+          borderBottom: "2px solid #000000",
+          borderLeft: "1px solid #000000",
+          borderRight: "1px solid #000000"
+        }} align="center" valign="middle" bgcolor="#E2F0D9"><font face="Tahoma" size="2">Разница вертикальных глубин
+          между ХХХ (план) и ХХХ (факт)</font></td>
+        <td style={{
+          borderTop: "2px solid #000000",
+          borderBottom: "2px solid #000000",
+          borderLeft: "1px solid #000000",
+          borderRight: "2px solid #000000"
+        }} align="center" valign="middle" bgcolor="#E2F0D9"><font face="Tahoma" size="2">Расстояние в пространстве между
+          ХХХ (план) и ХХХ (факт)</font></td>
+      </tr>
+      <tr>
+        <td style={{
+          borderTop: "1px solid #000000",
+          borderBottom: "1px solid #000000",
+          borderLeft: "1px solid #000000",
+          borderRight: "1px solid #000000"
+        }} height="25" align="center" valign="middle" sdnum="1049;0;0,00"><font face="Tahoma" size="2"><br/></font></td>
+        <td style={{
+          borderTop: "1px solid #000000",
+          borderBottom: "1px solid #000000",
+          borderLeft: "1px solid #000000",
+          borderRight: "1px solid #000000"
+        }} align="center" valign="middle" sdnum="1049;0;0,00"><font face="Tahoma" size="2"><br/></font></td>
+        <td style={{
+          borderTop: "1px solid #000000",
+          borderBottom: "1px solid #000000",
+          borderLeft: "1px solid #000000",
+          borderRight: "1px solid #000000"
+        }} align="center" valign="middle" sdnum="1049;0;0,00"><font face="Tahoma" size="2"><br/></font></td>
+        <td style={{
+          borderTop: "1px solid #000000",
+          borderBottom: "1px solid #000000",
+          borderLeft: "1px solid #000000",
+          borderRight: "1px solid #000000"
+        }} align="center" valign="middle" sdnum="1049;0;0,00"><font face="Tahoma" size="2"><br/></font></td>
+        <td style={{
+          borderTop: "1px solid #000000",
+          borderBottom: "1px solid #000000",
+          borderLeft: "1px solid #000000",
+          borderRight: "1px solid #000000"
+        }} align="center" valign="middle" sdnum="1049;0;0,00"><font face="Tahoma" size="2"><br/></font></td>
+        <td style={{
+          borderTop: "1px solid #000000",
+          borderBottom: "1px solid #000000",
+          borderLeft: "1px solid #000000",
+          borderRight: "1px solid #000000"
+        }} align="center" valign="middle" sdnum="1049;0;0,00"><font face="Tahoma" size="2"><br/></font></td>
+        <td style={{
+          borderTop: "1px solid #000000",
+          borderBottom: "1px solid #000000",
+          borderLeft: "1px solid #000000",
+          borderRight: "1px solid #000000"
+        }} align="center" valign="middle" sdnum="1049;0;0,00"><font face="Tahoma" size="2"><br/></font></td>
+        <td style={{
+          borderTop: "1px solid #000000",
+          borderBottom: "1px solid #000000",
+          borderLeft: "1px solid #000000",
+          borderRight: "1px solid #000000"
+        }} align="center" valign="middle" sdnum="1049;0;0,00"><font face="Tahoma" size="2"><br/></font></td>
+        <td style={{
+          borderTop: "1px solid #000000",
+          borderBottom: "1px solid #000000",
+          borderLeft: "1px solid #000000",
+          borderRight: "1px solid #000000"
+        }} align="center" valign="middle" sdnum="1049;0;0,00"><font face="Tahoma" size="2"><br/></font></td>
+        <td style={{
+          borderTop: "1px solid #000000",
+          borderBottom: "1px solid #000000",
+          borderLeft: "1px solid #000000",
+          borderRight: "1px solid #000000"
+        }} align="center" valign="middle" sdnum="1049;0;0,00"><font face="Tahoma" size="2"><br/></font></td>
+        <td style={{
+          borderTop: "1px solid #000000",
+          borderBottom: "1px solid #000000",
+          borderLeft: "1px solid #000000",
+          borderRight: "1px solid #000000"
+        }} align="center" valign="middle" sdnum="1049;0;0,00"><font face="Tahoma" size="2"><br/></font></td>
+        <td style={{
+          borderTop: "1px solid #000000",
+          borderBottom: "1px solid #000000",
+          borderLeft: "1px solid #000000",
+          borderRight: "1px solid #000000"
+        }} align="center" valign="bottom"><font face="Arial Cyr"><br/></font></td>
+        <td style={{
+          borderTop: "1px solid #000000",
+          borderBottom: "1px solid #000000",
+          borderLeft: "1px solid #000000",
+          borderRight: "1px solid #000000"
+        }} align="center" valign="middle" sdnum="1049;0;0,00"><font face="Tahoma" size="2"><br/></font></td>
+        <td style={{
+          borderTop: "1px solid #000000",
+          borderBottom: "1px solid #000000",
+          borderLeft: "1px solid #000000",
+          borderRight: "1px solid #000000"
+        }} align="center" valign="middle" sdnum="1049;0;0,00"><font face="Tahoma" size="2"><br/></font></td>
+        <td style={{
+          borderTop: "1px solid #000000",
+          borderBottom: "1px solid #000000",
+          borderLeft: "1px solid #000000",
+          borderRight: "1px solid #000000"
+        }} align="center" valign="middle" sdnum="1049;0;0,00"><font face="Tahoma" size="2"><br/></font></td>
+        <td style={{
+          borderTop: "2px solid #000000",
+          borderBottom: "1px solid #000000",
+          borderLeft: "1px solid #000000",
+          borderRight: "1px solid #000000"
+        }} align="center" valign="middle"><font size="2" color="#000000"><br/></font></td>
+        <td style={{
+          borderTop: "1px solid #000000",
+          borderBottom: "1px solid #000000",
+          borderLeft: "1px solid #000000",
+          borderRight: "1px solid #000000"
+        }} align="center" valign="bottom"><font face="Tahoma" size="2"><br/></font></td>
+        <td style={{
+          borderTop: "1px solid #000000",
+          borderBottom: "1px solid #000000",
+          borderLeft: "1px solid #000000",
+          borderRight: "1px solid #000000"
+        }} align="center" valign="bottom"><font face="Tahoma" size="2"><br/></font></td>
+      </tr>
+    </table>
+    <div>&nbsp;</div>
+    <p style={{textAlign: "right"}}><b>{date}</b></p>
+  </>)
+}

src/components/Sludge.jsx

@@ -0,0 +1,383 @@
+let date = new Date().toLocaleString()
+
+export function Sludge() {
+  return (<>
+      <table cellspacing="0" border="0">
+        <colGroup span="22" width="85"></colGroup>
+        <tr>
+          <td style={{
+            borderTop: "2px solid #000000",
+            borderBottom: "1px solid #000000",
+            borderLeft: "2px solid #000000",
+            borderRight: "2px double #000000",
+            fontSize: "14",
+            fontFamily: "Tahoma, sans-serif"
+          }} rowSpan="3" height="130" align="center" valign="middle" bgcolor="#FFFF99"><b><font face="Tahoma"
+                                                                                                size="2">N пробы</font></b>
+          </td>
+          <td style={{
+            borderTop: "2px solid #000000",
+            borderLeft: "2px solid #000000",
+            borderRight: "2px double #000000",
+            fontSize: "14",
+            fontFamily: "Tahoma, sans-serif"
+          }} rowSpan="3" align="center" valign="middle" bgcolor="#FFFF99"><b><font face="Tahoma" size="2">Глубина
+            отбора пробы</font></b></td>
+          <td style={{
+            borderTop: "2px solid #000000",
+            borderLeft: "2px solid #000000",
+            borderRight: "2px double #000000",
+            fontSize: "14",
+            fontFamily: "Tahoma, sans-serif"
+          }} colSpan="9" align="center" valign="middle" bgcolor="#FFFF99"><b><font face="Tahoma"
+                                                                                   size="2">Литология</font></b></td>
+          <td style={{
+            borderTop: "2px solid #000000",
+            borderLeft: "2px solid #000000",
+            borderRight: "2px double #000000",
+            fontSize: "14",
+            fontFamily: "Tahoma, sans-serif"
+          }} rowSpan="3" align="center" valign="middle" bgcolor="#FFFF99"><b><font face="Tahoma" size="2">Краткое
+            описание</font></b></td>
+          <td style={{
+            borderTop: "2px solid #000000",
+            borderBottom: "1px solid #000000",
+            borderLeft: "2px solid #000000",
+            borderRight: "2px double #000000",
+            fontSize: "14",
+            fontFamily: "Tahoma, sans-serif"
+          }} rowSpan="3" align="center" valign="middle" bgcolor="#AFABAB"><b><font face="Tahoma" size="2">ЛБА
+            бурового раствора </font></b></td>
+          <td style={{
+            borderTop: "2px solid #000000",
+            borderLeft: "2px double #000000",
+            fontSize: "14",
+            fontFamily: "Tahoma, sans-serif"
+          }} rowSpan="3" align="center" valign="middle" bgcolor="#FFCC99"><b><font face="Tahoma" size="2">ЛБА
+            (шлама)</font></b></td>
+          <td style={{
+            borderTop: "2px solid #000000",
+            borderBottom: "2px solid #000000",
+            borderLeft: "2px solid #000000",
+            borderRight: "2px solid #000000",
+            fontSize: "14",
+            fontFamily: "Tahoma, sans-serif"
+          }} colSpan="6" align="center" valign="bottom" bgcolor="#FFFF99" sdnum="1049;0;0,000"><b><font face="Tahoma"
+                                                                                                        size="2">Газопоказания</font></b>
+          </td>
+          <td style={{
+            borderTop: "2px solid #000000",
+            borderLeft: "2px solid #000000",
+            borderRight: "2px solid #000000",
+            fontSize: "14",
+            fontFamily: "Tahoma, sans-serif"
+          }} rowSpan="3" align="center" valign="middle" bgcolor="#FFFF99" sdnum="1049;0;0,000"><b><font face="Tahoma"
+                                                                                                        size="2">Мех.
+            скорость</font></b></td>
+          <td style={{
+            borderTop: "2px solid #000000",
+            borderLeft: "1px solid #000000",
+            borderRight: "2px solid #000000",
+            fontSize: "14",
+            fontFamily: "Tahoma, sans-serif"
+          }} rowSpan="3" align="center" valign="middle" bgcolor="#FFCC99" sdnum="1049;0;0,00"><b><font
+            face="Tahoma" size="2">Предварительное заключение о насыщении по ГК</font></b></td>
+        </tr>
+        <tr>
+          <td style={{
+            borderTop: "2px solid #000000",
+            borderLeft: "2px solid #000000",
+            borderRight: "1px solid #000000",
+            fontSize: "14",
+            fontFamily: "Tahoma, sans-serif"
+          }} rowSpan="2" align="center" valign="middle" bgcolor="#CCCCFF"><b><font face="Tahoma" size="2">Песчаник
+            (%) </font></b></td>
+          <td style={{
+            borderTop: "2px solid #000000",
+            borderLeft: "1px solid #000000",
+            borderRight: "1px solid #000000",
+            fontSize: "14",
+            fontFamily: "Tahoma, sans-serif"
+          }} rowSpan="2" align="center" valign="middle" bgcolor="#CCCCFF"><b><font face="Tahoma" size="2">Алевролит
+            (%)</font></b></td>
+          <td style={{
+            borderTop: "2px solid #000000",
+            borderLeft: "1px solid #000000",
+            borderRight: "1px solid #000000",
+            fontSize: "14",
+            fontFamily: "Tahoma, sans-serif"
+          }} rowSpan="2" align="center" valign="middle" bgcolor="#CCCCFF"><b><font face="Tahoma" size="2">Аргиллит
+            (%)</font></b></td>
+          <td style={{
+            borderTop: "2px solid #000000",
+            borderLeft: "1px solid #000000",
+            borderRight: "1px solid #000000",
+            fontSize: "14",
+            fontFamily: "Tahoma, sans-serif"
+          }} rowSpan="2" align="center" valign="middle" bgcolor="#CCCCFF"><b><font face="Tahoma" size="2">Аргиллит
+            бит. (%)</font></b></td>
+          <td style={{
+            borderTop: "2px solid #000000",
+            borderLeft: "1px solid #000000",
+            borderRight: "1px solid #000000",
+            fontSize: "14",
+            fontFamily: "Tahoma, sans-serif"
+          }} rowSpan="2" align="center" valign="middle" bgcolor="#CCCCFF"><b><font face="Tahoma" size="2">Уголь
+            (%)</font></b></td>
+          <td style={{
+            borderTop: "2px solid #000000",
+            borderLeft: "1px solid #000000",
+            borderRight: "1px solid #000000",
+            fontSize: "14",
+            fontFamily: "Tahoma, sans-serif"
+          }} rowSpan="2" align="center" valign="middle" bgcolor="#CCCCFF"><b><font face="Tahoma" size="2">Песок
+            (%)</font></b></td>
+          <td style={{
+            borderTop: "2px solid #000000",
+            borderLeft: "1px solid #000000",
+            borderRight: "1px solid #000000",
+            fontSize: "14",
+            fontFamily: "Tahoma, sans-serif"
+          }} rowSpan="2" align="center" valign="middle" bgcolor="#CCCCFF"><b><font face="Tahoma" size="2">Глина
+            (%)</font></b></td>
+          <td style={{
+            borderTop: "2px solid #000000",
+            borderLeft: "1px solid #000000",
+            borderRight: "1px solid #000000",
+            fontSize: "14",
+            fontFamily: "Tahoma, sans-serif"
+          }} rowSpan="2" align="center" valign="middle" bgcolor="#CCCCFF"><b><font face="Tahoma" size="2">Известняк
+            (%)</font></b></td>
+          <td style={{
+            borderTop: "2px solid #000000",
+            borderLeft: "1px solid #000000",
+            borderRight: "2px solid #000000",
+            fontSize: "14",
+            fontFamily: "Tahoma, sans-serif"
+          }} rowSpan="2" align="center" valign="middle" bgcolor="#CCCCFF"><b><font face="Tahoma" size="2">Цемент
+            (%)</font></b></td>
+          <td style={{
+            borderLeft: "2px solid #000000",
+            borderRight: "1px solid #000000",
+            fontSize: "14",
+            fontFamily: "Tahoma, sans-serif"
+          }} rowSpan="2" align="center" valign="middle" bgcolor="#CCCCFF" sdnum="1049;0;0,000"><b><font face="Tahoma"
+                                                                                                        size="2">Сумма
+            УВ мах. (абс%) </font></b></td>
+          <td style={{
+            borderLeft: "1px solid #000000",
+            borderRight: "1px solid #000000",
+            fontSize: "14",
+            fontFamily: "Tahoma, sans-serif"
+          }} rowSpan="2" align="center" valign="middle" bgcolor="#CCCCFF" sdnum="1049;0;0,000"><b><font face="Tahoma"
+                                                                                                        size="2">С1
+            метан (отн%)</font></b></td>
+          <td style={{
+            borderLeft: "1px solid #000000",
+            borderRight: "1px solid #000000",
+            fontSize: "14",
+            fontFamily: "Tahoma, sans-serif"
+          }} rowSpan="2" align="center" valign="middle" bgcolor="#CCCCFF" sdnum="1049;0;0,000"><b><font face="Tahoma"
+                                                                                                        size="2">С2 этан
+            (отн%)</font></b></td>
+          <td style={{borderRight: "1px solid #000000", fontSize: "14", fontFamily: "Tahoma, sans-serif"}} rowSpan="2"
+              align="center" valign="middle" bgcolor="#CCCCFF" sdnum="1049;0;0,000"><b><font face="Tahoma" size="2">С3
+            пропан (отн%)</font></b></td>
+          <td style={{
+            borderLeft: "1px solid #000000",
+            borderRight: "1px solid #000000",
+            fontSize: "14",
+            fontFamily: "Tahoma, sans-serif"
+          }} rowSpan="2" align="center" valign="middle" bgcolor="#CCCCFF" sdnum="1049;0;0,000"><b><font face="Tahoma"
+                                                                                                        size="2">С4
+            бутан (отн%)</font></b></td>
+          <td style={{borderLeft: "1px solid #000000", fontSize: "14", fontFamily: "Tahoma, sans-serif"}} rowSpan="2"
+              align="center" valign="middle" bgcolor="#CCCCFF" sdnum="1049;0;0,000"><b><font face="Tahoma" size="2">С5
+            пентан (отн%)</font></b></td>
+        </tr>
+        <tr>
+        </tr>
+        <tr>
+          <td style={{
+            borderTop: "1px solid #000000",
+            borderBottom: "1px solid #000000",
+            borderLeft: "1px solid #000000",
+            borderRight: "1px solid #000000",
+            fontSize: "14",
+            fontFamily: "Tahoma, sans-serif"
+          }} height="40" align="left" valign="bottom"><font size="2" color="#000000"><br/></font></td>
+          <td style={{
+            borderTop: "1px solid #000000",
+            borderBottom: "1px solid #000000",
+            borderLeft: "1px solid #000000",
+            borderRight: "1px solid #000000",
+            fontSize: "14",
+            fontFamily: "Tahoma, sans-serif"
+          }} align="left" valign="bottom"><font size="2" color="#000000"><br/></font></td>
+          <td style={{
+            borderTop: "1px solid #000000",
+            borderBottom: "1px solid #000000",
+            borderLeft: "1px solid #000000",
+            borderRight: "1px solid #000000",
+            fontSize: "14",
+            fontFamily: "Tahoma, sans-serif"
+          }} align="left" valign="bottom"><font size="2" color="#000000"><br/></font></td>
+          <td style={{
+            borderTop: "1px solid #000000",
+            borderBottom: "1px solid #000000",
+            borderLeft: "1px solid #000000",
+            borderRight: "1px solid #000000",
+            fontSize: "14",
+            fontFamily: "Tahoma, sans-serif"
+          }} align="left" valign="bottom"><font size="2" color="#000000"><br/></font></td>
+          <td style={{
+            borderTop: "1px solid #000000",
+            borderBottom: "1px solid #000000",
+            borderLeft: "1px solid #000000",
+            borderRight: "1px solid #000000",
+            fontSize: "14",
+            fontFamily: "Tahoma, sans-serif"
+          }} align="left" valign="bottom"><font size="2" color="#000000"><br/></font></td>
+          <td style={{
+            borderTop: "1px solid #000000",
+            borderBottom: "1px solid #000000",
+            borderLeft: "1px solid #000000",
+            borderRight: "1px solid #000000",
+            fontSize: "14",
+            fontFamily: "Tahoma, sans-serif"
+          }} align="left" valign="bottom"><font size="2" color="#000000"><br/></font></td>
+          <td style={{
+            borderTop: "1px solid #000000",
+            borderBottom: "1px solid #000000",
+            borderLeft: "1px solid #000000",
+            borderRight: "1px solid #000000",
+            fontSize: "14",
+            fontFamily: "Tahoma, sans-serif"
+          }} align="left" valign="bottom"><font size="2" color="#000000"><br/></font></td>
+          <td style={{
+            borderTop: "1px solid #000000",
+            borderBottom: "1px solid #000000",
+            borderLeft: "1px solid #000000",
+            borderRight: "1px solid #000000",
+            fontSize: "14",
+            fontFamily: "Tahoma, sans-serif"
+          }} align="left" valign="bottom"><font size="2" color="#000000"><br/></font></td>
+          <td style={{
+            borderTop: "1px solid #000000",
+            borderBottom: "1px solid #000000",
+            borderLeft: "1px solid #000000",
+            borderRight: "1px solid #000000",
+            fontSize: "14",
+            fontFamily: "Tahoma, sans-serif"
+          }} align="left" valign="bottom"><font size="2" color="#000000"><br/></font></td>
+          <td style={{
+            borderTop: "1px solid #000000",
+            borderBottom: "1px solid #000000",
+            borderLeft: "1px solid #000000",
+            borderRight: "1px solid #000000",
+            fontSize: "14",
+            fontFamily: "Tahoma, sans-serif"
+          }} align="left" valign="bottom"><font size="2" color="#000000"><br/></font></td>
+          <td style={{
+            borderTop: "1px solid #000000",
+            borderBottom: "1px solid #000000",
+            borderLeft: "1px solid #000000",
+            borderRight: "1px solid #000000",
+            fontSize: "14",
+            fontFamily: "Tahoma, sans-serif"
+          }} align="left" valign="bottom"><font size="2" color="#000000"><br/></font></td>
+          <td style={{
+            borderTop: "1px solid #000000",
+            borderBottom: "1px solid #000000",
+            borderLeft: "1px solid #000000",
+            borderRight: "1px solid #000000",
+            fontSize: "14",
+            fontFamily: "Tahoma, sans-serif"
+          }} align="left" valign="bottom"><font size="2" color="#000000"><br/></font></td>
+          <td style={{
+            borderTop: "1px solid #000000",
+            borderBottom: "1px solid #000000",
+            borderLeft: "1px solid #000000",
+            borderRight: "1px solid #000000",
+            fontSize: "14",
+            fontFamily: "Tahoma, sans-serif"
+          }} align="left" valign="bottom"><font size="2" color="#000000"><br/></font></td>
+          <td style={{
+            borderTop: "1px solid #000000",
+            borderBottom: "1px solid #000000",
+            borderLeft: "1px solid #000000",
+            borderRight: "1px solid #000000",
+            fontSize: "14",
+            fontFamily: "Tahoma, sans-serif"
+          }} align="left" valign="bottom"><font size="2" color="#000000"><br/></font></td>
+          <td style={{
+            borderTop: "1px solid #000000",
+            borderBottom: "1px solid #000000",
+            borderLeft: "1px solid #000000",
+            borderRight: "1px solid #000000",
+            fontSize: "14",
+            fontFamily: "Tahoma, sans-serif"
+          }} align="left" valign="bottom"><font size="2" color="#000000"><br/></font></td>
+          <td style={{
+            borderTop: "1px solid #000000",
+            borderBottom: "1px solid #000000",
+            borderLeft: "1px solid #000000",
+            borderRight: "1px solid #000000",
+            fontSize: "14",
+            fontFamily: "Tahoma, sans-serif"
+          }} align="left" valign="bottom"><font size="2" color="#000000"><br/></font></td>
+          <td style={{
+            borderTop: "1px solid #000000",
+            borderBottom: "1px solid #000000",
+            borderLeft: "1px solid #000000",
+            borderRight: "1px solid #000000",
+            fontSize: "14",
+            fontFamily: "Tahoma, sans-serif"
+          }} align="left" valign="bottom"><font size="2" color="#000000"><br/></font></td>
+          <td style={{
+            borderTop: "1px solid #000000",
+            borderBottom: "1px solid #000000",
+            borderLeft: "1px solid #000000",
+            borderRight: "1px solid #000000",
+            fontSize: "14",
+            fontFamily: "Tahoma, sans-serif"
+          }} align="left" valign="bottom"><font size="2" color="#000000"><br/></font></td>
+          <td style={{
+            borderTop: "1px solid #000000",
+            borderBottom: "1px solid #000000",
+            borderLeft: "1px solid #000000",
+            borderRight: "1px solid #000000",
+            fontSize: "14",
+            fontFamily: "Tahoma, sans-serif"
+          }} align="left" valign="bottom"><font size="2" color="#000000"><br/></font></td>
+          <td style={{
+            borderTop: "1px solid #000000",
+            borderBottom: "1px solid #000000",
+            borderLeft: "1px solid #000000",
+            borderRight: "1px solid #000000",
+            fontSize: "14",
+            fontFamily: "Tahoma, sans-serif"
+          }} align="left" valign="bottom"><font size="2" color="#000000"><br/></font></td>
+          <td style={{
+            borderTop: "1px solid #000000",
+            borderBottom: "1px solid #000000",
+            borderLeft: "1px solid #000000",
+            borderRight: "1px solid #000000",
+            fontSize: "14",
+            fontFamily: "Tahoma, sans-serif"
+          }} align="left" valign="bottom"><font size="2" color="#000000"><br/></font></td>
+          <td style={{
+            borderTop: "1px solid #000000",
+            borderBottom: "1px solid #000000",
+            borderLeft: "1px solid #000000",
+            borderRight: "1px solid #000000",
+            fontSize: "14",
+            fontFamily: "Tahoma, sans-serif"
+          }} align="left" valign="bottom"><font size="2" color="#000000"><br/></font></td>
+        </tr>
+      </table>
+      <div>&nbsp;</div>
+      <p style={{textAlign: "right"}}><b>{date}</b></p>
+    </>
+  )
+}

src/pages/FluidService.jsx

@@ -0,0 +1,8 @@
+import Documents from "../components/Documents"
+
+export default function FluidService({selectedFileCategory}) {
+
+    return(
+        <Documents selectedFileCategory={selectedFileCategory} />
+    )
+}

src/pages/LastData.jsx

@@ -0,0 +1,94 @@
+import {Button, Modal, Checkbox } from "antd";
+import {CementFluid} from "../components/CementFluid";
+import React, {useState} from "react";
+import {Sludge} from "../components/Sludge";
+import {NnbTable} from "../components/NnbTable"
+import Disposition from "../components/Disposition";
+import MenuDocuments from "../components/MenuDocuments";
+
+
+export default function LastData() {
+  const [tableVisible, setTableVisible] = useState(false)
+  const [tableSludgeVisible, setTableSludgeVisible] = useState(false)
+  const [tableNNBVisible, setTableNNBVisible] = useState(false)
+  const [dispositionVisible, setDispositionVisible] = useState(false)
+
+  return (
+    <>
+      <div>
+        <MenuDocuments/>
+      </div>
+      <div>&nbsp;</div>
+      <Button type="primary" onClick={() => setTableVisible(true)}>
+        Последний замер бурового раствора
+      </Button>
+      <Modal
+        title='Последние показатели бурового раствора'
+        centered
+        visible={tableVisible}
+        onOk={() => setTableVisible(false)}
+        onCancel={() => setTableVisible(false)}
+        width={1800}
+        okText='Ок'
+        cancelText='Отмена'
+      >
+        <CementFluid/>
+      </Modal>
+      <Button type="primary" onClick={() => setTableSludgeVisible(true)} style={{marginLeft: "5px"}}>
+        Шламограмма
+      </Button>
+      <Modal
+        title='Шламограмма'
+        centered
+        visible={tableSludgeVisible}
+        onOk={() => setTableSludgeVisible(false)}
+        onCancel={() => setTableSludgeVisible(false)}
+        width={1600}
+        okText='Ок'
+        cancelText='Отмена'
+      >
+        <Sludge/>
+      </Modal>
+      <Button type="primary" onClick={() => setTableNNBVisible(true)} style={{marginLeft: "5px"}}>
+        ННБ
+      </Button>
+      <Modal
+        title='ННБ'
+        centered
+        visible={tableNNBVisible}
+        onOk={() => setTableNNBVisible(false)}
+        onCancel={() => setTableNNBVisible(false)}
+        width={1400}
+        okText='Ок'
+        cancelText='Отмена'
+      >
+        <NnbTable/>
+      </Modal>
+      <Button type="primary" onClick={() => setDispositionVisible(true)} style={{marginLeft: "5px"}}>
+        Распоряжение
+      </Button>
+      <Modal
+        title='Распоряжение'
+        centered
+        visible={dispositionVisible}
+        onOk={() => setDispositionVisible(false)}
+        onCancel={() => setDispositionVisible(false)}
+        width={850}
+        okText='Ок'
+        cancelText='Отмена'
+        footer={[
+          <Checkbox style={{marginRight: '10px'}}>Принять распоряжение</Checkbox>,
+          <Button key="submit" type="secondary"
+                  onClick={() => setDispositionVisible(false)}>
+            Отмена
+          </Button>,
+          <Button key="submit" type="primary"
+                  onClick={() => setDispositionVisible(false)}>
+            Ок
+          </Button>
+        ]}
+      >
+        <Disposition/>
+      </Modal>
+    </>)
+}

src/pages/Login.jsx

@@ -17,6 +17,7 @@ const openNotificationError = (message, title) => {
 
 const setUser = (user) =>{  
   OpenAPI.TOKEN = user.token
+  localStorage['userId'] = user.id
   localStorage['token'] = user.token
   localStorage['login'] = user.login
 }

src/pages/Messages.jsx

@@ -110,7 +110,7 @@ export default function Messages() {
     <>
 
       <div className='filter-group'>
-        <h3 className='filter-group__heading'>Фильтр сообщений</h3>
+        <h3 className='filter-group-heading'>Фильтр сообщений</h3>
         <Select
           mode="multiple"
           allowClear

src/pages/Well.jsx

@@ -7,6 +7,8 @@ import Messages from "../pages/Messages";
 import Report from "../pages/Report";
 import Analysis from "../pages/Analysis";
 import WellAnalysis from "../pages/WellAnalysis";
+import Documents from "../components/Documents";
+import LastData from '../pages/LastData'
 import TelemetryView from "../pages/TelemetryView";
 
 const { Content } = Layout
@@ -14,6 +16,8 @@ const { Content } = Layout
 export default function Well() {
   let { id } = useParams()
 
+  const {SubMenu} = Menu
+
   return (<>
     <Layout>
       <Menu
@@ -42,6 +46,37 @@ export default function Well() {
         <Menu.Item key="7" icon={<FolderOutlined/>}>
           <Link to='archive'>Архив</Link>
         </Menu.Item>
+        <SubMenu
+            key="documentsSub"
+            title={<Link to='fluidService' className="linkDocuments">Документы</Link>}
+            icon={<FolderOutlined/>}
+            selectable={true}
+          >
+            <Menu.Item key="documentsSub1" icon={<FolderOutlined/>}>
+              <Link to='fluidService'>Растворный сервис</Link>
+            </Menu.Item>
+            <Menu.Item key="documentsSub1.1" icon={<FolderOutlined/>}>
+              <Link to='cementing'>Цементирование</Link>
+            </Menu.Item>
+            <Menu.Item key="documentsSub1.2" icon={<FolderOutlined/>}>
+              <Link to='nnb'>ННБ</Link>
+            </Menu.Item>
+            <Menu.Item key="documentsSub1.3" icon={<FolderOutlined/>}>
+              <Link to='gti'>ГТИ</Link>
+            </Menu.Item>
+            <Menu.Item key="documentsSub1.4" icon={<FolderOutlined/>}>
+              <Link to='documentsForWell'>Документы по скважине</Link>
+            </Menu.Item>
+            <Menu.Item key="documentsSub1.5" icon={<FolderOutlined/>}>
+              <Link to='supervisor'>Супервайзер</Link>
+            </Menu.Item>
+            <Menu.Item key="documentsSub1.6" icon={<FolderOutlined/>}>
+              <Link to='master'>Мастер</Link>
+            </Menu.Item>
+            <Menu.Item key="documentsSub1.7" icon={<FolderOutlined/>}>
+              <Link to='lastData'>Последние данные</Link>
+            </Menu.Item>
+          </SubMenu>
       </Menu>
 
       <Layout>
@@ -68,6 +103,33 @@ export default function Well() {
             <Route path="/well/:id/telemetry">
               <TelemetryView/>
             </Route>
+            <Route path="/well/:id/fluidService">
+              <Documents selectedFileCategory={1}/>
+            </Route>
+            <Route path="/well/:id/cementing">
+              <Documents selectedFileCategory={2}/>
+            </Route>
+            <Route path="/well/:id/nnb">
+              <Documents selectedFileCategory={3}/>
+            </Route>
+            <Route path="/well/:id/gti">
+              <Documents selectedFileCategory={4}/>
+            </Route>
+            <Route path="/well/:id/documentsForWell">
+              <Documents selectedFileCategory={5}/>
+            </Route>
+            <Route path="/well/:id/supervisor">
+              <Documents selectedFileCategory={6}/>
+            </Route>
+            <Route path="/well/:id/master">
+              <Documents selectedFileCategory={7}/>
+            </Route>
+            <Route path="/well/:id/lastData">
+              <LastData/>
+            </Route>
+            <Route path="/well/:id/documents">
+              <Documents/>
+            </Route>
             <Route path="/">
               <Redirect to={{pathname: `/well/${id}/telemetry`}}/>
             </Route>

src/pages/WellAnalysis.jsx

@@ -122,7 +122,7 @@ export default function WellAnalysis() {
 
     return(<>
         <div className='filter-group'>
-            <h3 className='filter-group__heading'>Фильтр операций</h3>
+            <h3 className='filter-group-heading'>Фильтр операций</h3>
                 <Select
                     mode="multiple"
                     allowClear
@@ -154,6 +154,6 @@ export default function WellAnalysis() {
           }}
           rowKey={(record) => record.id}
         />
-      </LoaderPortal>
+        </LoaderPortal>
     </>)
   }

src/services/api/index.ts

@@ -13,6 +13,7 @@ export type { DatesRangeDto } from './models/DatesRangeDto';
 export type { DepositDto } from './models/DepositDto';
 export type { EventDto } from './models/EventDto';
 export type { FilePropertiesDto } from './models/FilePropertiesDto';
+export type { FilePropertiesDtoPaginationContainer } from './models/FilePropertiesDtoPaginationContainer';
 export type { MessageDto } from './models/MessageDto';
 export type { MessageDtoPaginationContainer } from './models/MessageDtoPaginationContainer';
 export type { OperationDto } from './models/OperationDto';

src/services/api/models/FilePropertiesDtoPaginationContainer.ts

@@ -0,0 +1,12 @@
+/* istanbul ignore file */
+/* tslint:disable */
+/* eslint-disable */
+
+import type { FilePropertiesDto } from './FilePropertiesDto';
+
+export type FilePropertiesDtoPaginationContainer = {
+    skip?: number;
+    take?: number;
+    count?: number;
+    items?: Array<FilePropertiesDto> | null;
+}

src/services/api/services/DataService.ts

@@ -13,7 +13,7 @@ export class DataService {
      * @param wellId id скважины
      * @param begin дата начала выборки. По умолчанию: текущее время - intervalSec
      * @param intervalSec интервал времени даты начала выборки, секунды
-     * @param approxPointsCount жела<EFBFBD><EFBFBD>мое количество точек. Если в выборке точек будет больше, то выборка будет прорежена.
+     * @param approxPointsCount желаемое количество точек. Если в выборке точек будет больше, то выборка будет прорежена.
      * @returns DataSaubBaseDto Success
      * @throws ApiError
      */

src/services/api/services/FileService.ts

@@ -1,7 +1,7 @@
 /* istanbul ignore file */
 /* tslint:disable */
 /* eslint-disable */
-import type { FilePropertiesDto } from '../models/FilePropertiesDto';
+import type { FilePropertiesDtoPaginationContainer } from '../models/FilePropertiesDtoPaginationContainer';
 import { request as __request } from '../core/request';
 
 export class FileService {
@@ -36,19 +36,31 @@ requestBody?: any,
     /**
      * Возвращает информацию о файлах для скважины в выбраной категории
      * @param wellId id скважины
+     * @param skip для пагинации кол-во записей пропустить
+     * @param take для пагинации кол-во записей взять
      * @param idCategory id категории файла
-     * @returns FilePropertiesDto Success
+     * @param begin дата начала
+     * @param end дата окончания
+     * @returns FilePropertiesDtoPaginationContainer Success
      * @throws ApiError
      */
     public static async getFilesInfo(
 wellId: number,
-idCategory?: number,
+skip: number,
-): Promise<Array<FilePropertiesDto>> {
+take: number = 32,
+idCategory: number,
+begin?: string,
+end?: string,
+): Promise<FilePropertiesDtoPaginationContainer> {
         const result = await __request({
             method: 'GET',
             path: `/api/files/${wellId}/filesInfo`,
             query: {
+                'skip': skip,
+                'take': take,
                 'idCategory': idCategory,
+                'begin': begin,
+                'end': end,
             },
         });
         return result.body;
@@ -57,22 +69,17 @@ idCategory?: number,
     /**
      * Возвращает файл с диска на сервере
      * @param wellId id скважины
-     * @param fileName 
      * @param fileId id запрашиваемого файла
      * @returns string Success
      * @throws ApiError
      */
     public static async getFile(
 wellId: number,
-fileName: string,
+fileId: number,
-fileId?: number,
 ): Promise<string> {
         const result = await __request({
             method: 'GET',
-            path: `/api/files/${wellId}/${fileName}`,
+            path: `/api/files/${wellId}/${fileId}`,
-            query: {
-                'fileId': fileId,
-            },
         });
         return result.body;
     }

src/services/api/services/ReportService.ts

@@ -86,7 +86,7 @@ end?: string,
     }
 
     /**
-     * Возвр<EFBFBD><EFBFBD>щает прогнозируемое количество страниц будущего отчета
+     * Возвращает прогнозируемое количество страниц будущего отчета
      * @param wellId id скважины
      * @param stepSeconds шаг интервала
      * @param format формат отчета (0-PDF, 1-LAS)

src/styles/index.css

@@ -48,3 +48,11 @@ code {
     monospace;
 }
 
+.linkDocuments {
+  color: #000;
+}
+
+.linkDocuments:hover {
+  color: #c32828;
+}
+

src/styles/message.css

@@ -33,7 +33,7 @@
   margin: 0 0 5px 0;
 }
 
-.filter-group__heading {
+.filter-group-heading {
   margin: 5px auto;
   align-items: center;
 }