Add marks and action_confirms to drilling program page.

This commit is contained in:
Фролов 2021-11-09 18:01:00 +05:00
parent a6d330e276
commit 497d106a9d
3 changed files with 87 additions and 20 deletions

25
src/components/Mark.jsx Normal file
View File

@ -0,0 +1,25 @@
import {Tooltip, Tag, Typography, Popconfirm, Button } from 'antd'
import {UserView} from './UserView'
const markTypes = {
0 : {color:"orange", text : "неизвестно"},
1 : {color:"green", text : "согласовано"},
}
const {Text} = Typography
export const Mark = ({mark, onDelete}) => {
const markType = markTypes[mark.idMarkType]??markTypes[0]
return <Tooltip title={<UserView user={mark.user}/>}>
<Tag color={markType.color}>
<Text delete={mark?.isDeleted}>
{`${markType.text} ${new Date(mark.dateCreated).toLocaleString()}`}
</Text>
{(!mark?.isDeleted)&&
<Popconfirm title="Отозвать согласование?" onConfirm={onDelete}>
<Button type="link">x</Button>
</Popconfirm>
}
</Tag >
</Tooltip>
}

View File

@ -17,7 +17,7 @@ const pageSize = 12
const { RangePicker } = DatePicker
const { Search } = Input
export default function DocumentsTemplate({ idCategory, idWell, accept, headerChild, onChange }) {
export default function DocumentsTemplate({ idCategory, idWell, accept, headerChild, customColumns, onChange}) {
const [page, setPage] = useState(1)
const [filterDataRange, setFilterDataRange] = useState([])
const [filterCompanyName, setFilterCompanyName] = useState([])
@ -79,6 +79,7 @@ export default function DocumentsTemplate({ idCategory, idWell, accept, headerCh
key: "company",
render: (_, record) => <CompanyView company={record?.author?.company}/>
},
...(customColumns??[])
]
const update = () => {

View File

@ -1,4 +1,4 @@
import {Button, Tooltip} from 'antd'
import {Popconfirm, Button, Tooltip} from 'antd'
import { FileExcelOutlined } from '@ant-design/icons'
import { useEffect, useState } from "react"
import {invokeWebApiWrapperAsync, download} from '../../components/factory'
@ -6,6 +6,7 @@ import DocumentsTemplate from './DocumentsTemplate'
import LoaderPortal from '../../components/LoaderPortal'
import { Flex } from '../../components/Grid'
import {DrillingProgramService, WellService} from '../../services/api'
import {Mark} from '../../components/Mark'
const idFileCategoryDrillingProgramItems = 13;
@ -14,6 +15,7 @@ export default function DrillingProgram({idWell}) {
const [showLoader, setShowLoader] = useState(false)
const [tooltip, setTooltip] = useState('нет файлов для формирования')
const [wellLabel, setWellLabel] = useState(`${idWell}`)
const [childKey, setChildKey] = useState();
useEffect(() => invokeWebApiWrapperAsync(
async () => {
@ -33,8 +35,11 @@ export default function DrillingProgram({idWell}) {
"Не удалось загрузить программу бурения")
const openProgramPreview = () => invokeWebApiWrapperAsync(async()=>{
const filWebUrl = await DrillingProgramService.getFileWebLink(idWell)
window.open(filWebUrl, '_blank')
const filWebUrl = await DrillingProgramService.getOrCreateSharedUrl(idWell)
if(filWebUrl && filWebUrl.length > 0)
window.open(filWebUrl, '_blank');
else
throw new Error("Сервер вернул плохую ссылку")
},
setShowLoader,
"Не удалось создать быстрый просмотр программы")
@ -46,7 +51,10 @@ export default function DrillingProgram({idWell}) {
return
}
if(files.every(fileInfo => fileInfo?.name.toLowerCase().endsWith('.xlsx'))){
const isAllFilesAreExcel = files.every(fileInfo => fileInfo?.name.toLowerCase().endsWith('.xlsx'))
const isAnyFileMarked = files.some(file => file?.fileMarks.some(m => m?.idMarkType === 1 && !m?.isDeleted))
if(isAllFilesAreExcel && isAnyFileMarked){
setTooltip('Программа доступна для скачивания')
selDownloadButtonEnabled(true)
}
@ -55,6 +63,41 @@ export default function DrillingProgram({idWell}) {
}
}
const customColumns = [
{
title: "Метки",
key: "fileMarks",
render: (_, record) => renderMarksColumn(record?.id, record?.fileMarks)
},
]
const renderMarksColumn=(idFile, marks)=>{
const validMarks = marks?.filter(m => !(m?.isDeleted))
if(validMarks?.length)
return validMarks.map(mark => <Mark mark = {mark} onDelete={() => deleteMark(mark.id)}/>)
return true &&
<Popconfirm title="Согласовать файл?" onConfirm={() => addMarkToFile(idFile)}>
<Button type="link">Согласовать</Button>
</Popconfirm>
}
const addMarkToFile = async (idFile) => {
const mark = {
idFile: idFile,
idMarkType: 1,
isDeleted:false,
comment: ''}
await DrillingProgramService.createFileMark(idWell, mark)
selDownloadButtonEnabled(true)
setChildKey(Date.now())
}
const deleteMark = async (idMark) => {
await DrillingProgramService.deleteFileMark(idWell, idMark)
setChildKey(Date.now())
}
const downloadButton = <div>
<span>Программа бурения</span>
<Flex>
@ -66,22 +109,18 @@ export default function DrillingProgram({idWell}) {
Сформировать и скачать
</Button>
</Tooltip>
<Tooltip title={tooltip}>
<Button
type="link"
onClick={downloadProgram}
<Tooltip title="Просмотреть через GoogleDrive">
<Popconfirm
title="Загрузить файл на GoogleDrive для просмотра?"
onConfirm={openProgramPreview}
disabled={!downloadButtonEnabled}>
<FileExcelOutlined />
Программа бурения {wellLabel}.xlsx
</Button>
</Tooltip>
<Tooltip title="Перед просмотром программы бурения сначала сформируйте ее.">
<Button
type="primary"
onClick={openProgramPreview}
<Button
type="link"
disabled={!downloadButtonEnabled}>
Сформировать и просмотреть
</Button>
<FileExcelOutlined />
Программа бурения {wellLabel}.xlsx
</Button>
</Popconfirm>
</Tooltip>
</Flex>
</div>
@ -92,6 +131,8 @@ export default function DrillingProgram({idWell}) {
idCategory={idFileCategoryDrillingProgramItems}
accept='.xlsx'
headerChild={downloadButton}
onChange={filesUpdated} />
onChange={filesUpdated}
customColumns = {customColumns}
key = {childKey}/>
</LoaderPortal>)
}