редактор секций скважины

This commit is contained in:
Фролов 2021-08-12 15:43:03 +05:00
parent 07dea346dc
commit 5a9f28740a
6 changed files with 153 additions and 79 deletions

View File

@ -5,10 +5,11 @@ export const RegExpIsFloat = /^[-+]?\d+\.?\d?$/
поддерживаются все базовые свойства из описания https://ant.design/components/table/#Column
плю дополнительные для колонок EditableTable:
editable - редактируемая колонка, bool
input - react компонента редактора (<Inpet/>, <InpetNumber/>, <DatePicker/>...)
input - react компонента редактора (<Input/>, <InputNumber/>, <DatePicker/>...)
isRequired - значение может быть пустым,
formItemClass - css класс для <FormItem/>, если требуется
formItemRules - массив правил валидации значений https://ant.design/components/form/#Rule,
initialValue - дефолтное значение при добавлении новой строки
*/
export const makeColumn = (title:string, key:string, other?:any) => ({
title: title,
@ -44,4 +45,14 @@ export const makeColumnsPlanFact = (title:string, key:string|string[], columsOth
makeColumn('факт', keyFactLocal, columsOtherLoacl[1]),
]
}
}
}
// const makePaginationObject = (paginationContainer, ...other) =>{
// let page = 1 + Math.floor(paginationContainer.skip/paginationContainer.take);
// return {
// ...other,
// pageSize: paginationContainer.take,
// total: paginationContainer.total,
// current: page,
// }
// }

View File

@ -52,13 +52,11 @@ export default function Deposit() {
<Overlay
width={32}
anchor={[cluster.latitude, cluster.longitude]}
key={`${cluster.latitude} ${cluster.longitude}`}
>
key={`${cluster.latitude} ${cluster.longitude}`}>
<Link to={`/cluster/${cluster.id}`}>
<img width={40} src={pointer} alt="+"/>
<span>{cluster.caption}</span>
</Link>
</Overlay >)
return (

View File

@ -4,78 +4,126 @@ import {makeColumn, makeColumnsPlanFact, RegExpIsFloat} from '../components/fact
import {WellSectionService} from '../services/api'
import notify from '../components/notify'
import { EditableTable } from '../components/EditableTable';
import { Input } from 'antd'
const columns = [
makeColumn('Конструкция секции', 'sectionType', {editable:true}),
makeColumnsPlanFact('Глубина, м', 'wellDepth', {editable:true, formItemRules:[
const TypeSelector = <Input list={'sectionTypeList'}/>
const DataListSectionTypes = <datalist id="sectionTypeList">
<option value="Пилотный ствол">Пилотный ствол</option>
<option value="Направление">Направление</option>
<option value="Кондуктор">Кондуктор</option>
<option value="Эксплуатационная колонна">Эксплуатационная колонна</option>
<option value="Транспортный ствол">Транспортный ствол</option>
<option value="Хвостовик">Хвостовик</option>
</datalist>
const numericColumnOptions = {
editable: true,
initialValue: 0,
formItemRules: [
{
required: true,
message: `Введите число`,
pattern: RegExpIsFloat
}]}),
makeColumnsPlanFact('Период, д', 'buildDays', {editable:true}),
makeColumnsPlanFact('Механическая скорость проходки, м/час', 'rateOfPenetration', {editable:true}),
makeColumnsPlanFact('Рейсовая скорость, м/час', 'routeSpeed', {editable:true}),
makeColumnsPlanFact('Скорость подъема КНБК', 'bhaUpSpeed', {editable:true}),
makeColumnsPlanFact('Скорость спуска КНБК', 'bhaDownSpeed', {editable:true}),
makeColumnsPlanFact('Скорость спуска обсадной колонны', 'casingDownSpeed', {editable:true}),
pattern: RegExpIsFloat,
},
],
};
const columns = [
makeColumn('Конструкция секции', 'sectionType', {editable:true, input:TypeSelector}),
makeColumnsPlanFact('Глубина, м', 'wellDepth', numericColumnOptions),
makeColumnsPlanFact('Период, д', 'buildDays', numericColumnOptions),
makeColumnsPlanFact('Механическая скорость проходки, м/час', 'rateOfPenetration', numericColumnOptions),
makeColumnsPlanFact('Рейсовая скорость, м/час', 'routeSpeed', numericColumnOptions),
makeColumnsPlanFact('Скорость подъема КНБК', 'bhaUpSpeed', numericColumnOptions),
makeColumnsPlanFact('Скорость спуска КНБК', 'bhaDownSpeed', numericColumnOptions),
makeColumnsPlanFact('Скорость спуска обсадной колонны', 'casingDownSpeed', numericColumnOptions),
]
// const data = [{
// key:1,
// sectionType: 'загагулина',
// wellDepthPlan: 1,
// wellDepthFact: 1,
// buildDaysPlan: 1,
// buildDaysFact: 1,
// rateOfPenetrationPlan: 4,
// rateOfPenetrationFact: 3,
// routeSpeedPlan: 2,
// routeSpeedFact: 1,
// bhaUpSpeedPlan: 1,
// bhaUpSpeedFact: 1,
// bhaDownSpeedPlan: 1,
// bhaDownSpeedFact: 1,
// casingDownSpeedPlan: 1,
// casingDownSpeedFact: 1,
// }]
const runAsyncFunc = async (funcAsync, setShowLoader, errorNotifyText) => {
if(setShowLoader)
setShowLoader(true)
try{
await funcAsync()
} catch (ex) {
if(process.env.NODE_ENV === 'development')
console.log(ex)
if(errorNotifyText)
notify(errorNotifyText, 'error')
} finally{
if(setShowLoader)
setShowLoader(false)
}
}
export default function WellStat({idWell}){
const [showLoader, setShowLoader] = useState(false)
const [data, setData] = useState({})
const [items, setItems] = useState([])
useEffect(()=>{
const update = async()=>{
setShowLoader(true)
try{
const data = await WellSectionService.getAll(idWell,0,1024)
setData(data);
} catch (ex) {
console.log(ex)
notify(`Не удалось загрузить секции по скважине "${idWell}"`, 'error')
} finally{
setShowLoader(false)
}
}
update();
const addKeysAndUpdateStateData = (items) =>{
const keyedItems = items?.map(item => ({...item, key:item.id}))??[]
setItems(keyedItems)
}
useEffect(() => {
runAsyncFunc(
async () => {
const paginationContainer = await WellSectionService.getAll(idWell, 0, 1024)
addKeysAndUpdateStateData(paginationContainer.items)
},
setShowLoader,
`Не удалось загрузить секции по скважине "${idWell}"`)
} ,[idWell])
const onChange = (newData) =>{
setData(newData)
const onAdd = (item) => {
runAsyncFunc(
async () => {
const updatedItems = await WellSectionService.insert(idWell, [item])
const newItems = [...items, ...updatedItems]
addKeysAndUpdateStateData(newItems)
},
setShowLoader,
`Не удалось добавить секцию в скважину "${idWell}"`)
}
const onEdit = (item) => {
runAsyncFunc(
async () => {
const updatedItem = await WellSectionService.update(idWell, item.id, item)
const newItems = [...items]
const index = newItems.findIndex((i) => item.key === i.key)
newItems.splice(index, 1, updatedItem)
addKeysAndUpdateStateData(newItems)
},
setShowLoader,
`Не удалось изменить секцию в скважине "${idWell}"`)
}
const onDelete = (item) =>{
runAsyncFunc(
async () => {
await WellSectionService.delete(idWell, [item.id])
const newItems = [...items]
const index = newItems.findIndex((i) => item.key === i.key)
newItems.splice(index, 1)
addKeysAndUpdateStateData(newItems)
},
setShowLoader,
`Не удалось удалить секцию из скважины "${idWell}"`)
}
return(
<LoaderPortal show={showLoader}>
<EditableTable
columns={columns}
dataSource={data.items}
dataSource={items}
size={'small'}
bordered
pagination={false}
onChange={onChange}
onRowAdd={()=>{}}
onRowEdit={()=>{}}
onRowDelete={()=>{}}
onRowAdd={onAdd}
onRowEdit={onEdit}
onRowDelete={onDelete}
/>
{DataListSectionTypes}
</LoaderPortal>)
}

View File

@ -36,7 +36,8 @@ approxPointsCount: number = 1024,
}
/**
* @param idWell
* Возвращает диапазон дат сохраненных данных.
* @param idWell id скважины
* @returns DatesRangeDto Success
* @throws ApiError
*/

View File

@ -15,11 +15,11 @@ export class MessageService {
* @param categoryids список категорий
* @param begin дата начала
* @param end окончание
* @param searchString
* @param searchString Строка поиска
* @returns MessageDtoPaginationContainer Success
* @throws ApiError
*/
public static async getMessage(
public static async getMessages(
idWell: number,
skip: number,
take: number = 32,
@ -44,7 +44,8 @@ searchString?: string,
}
/**
* @param idWell
* Выдает список сообщений по скважине
* @param idWell id скважины
* @returns DatesRangeDto Success
* @throws ApiError
*/

View File

@ -6,18 +6,33 @@ import { request as __request } from '../core/request';
export class WellSectionService {
/**
* @param idWell
* @returns string Success
* @throws ApiError
*/
public static async getTypes(
idWell: string,
): Promise<Array<string>> {
const result = await __request({
method: 'GET',
path: `/api/well/${idWell}/sections/types`,
});
return result.body;
}
/**
* @param idWell
* @param skip
* @param take
* @returns any Success
* @returns WellSectionDto Success
* @throws ApiError
*/
public static async getAll(
idWell: number,
skip: number,
take: number = 32,
): Promise<any> {
): Promise<Array<WellSectionDto>> {
const result = await __request({
method: 'GET',
path: `/api/well/${idWell}/sections`,
@ -32,13 +47,13 @@ take: number = 32,
/**
* @param idWell
* @param requestBody
* @returns any Success
* @returns WellSectionDto Success
* @throws ApiError
*/
public static async insert(
idWell: number,
requestBody?: Array<WellSectionDto>,
): Promise<any> {
): Promise<Array<WellSectionDto>> {
const result = await __request({
method: 'POST',
path: `/api/well/${idWell}/sections`,
@ -48,15 +63,15 @@ requestBody?: Array<WellSectionDto>,
}
/**
* @param idSection
* @param idWell
* @returns any Success
* @param idSection
* @returns WellSectionDto Success
* @throws ApiError
*/
public static async get(
idSection: number,
idWell: number,
): Promise<any> {
idSection: number,
): Promise<WellSectionDto> {
const result = await __request({
method: 'GET',
path: `/api/well/${idWell}/sections/${idSection}`,
@ -65,38 +80,38 @@ idWell: number,
}
/**
* @param id
* @param idWell
* @param idSection
* @param requestBody
* @returns any Success
* @returns WellSectionDto Success
* @throws ApiError
*/
public static async put(
id: number,
public static async update(
idWell: number,
idSection: number,
requestBody?: WellSectionDto,
): Promise<any> {
): Promise<WellSectionDto> {
const result = await __request({
method: 'PUT',
path: `/api/well/${idWell}/sections/${id}`,
path: `/api/well/${idWell}/sections/${idSection}`,
body: requestBody,
});
return result.body;
}
/**
* @param id
* @param idWell
* @returns any Success
* @param idSection
* @returns number Success
* @throws ApiError
*/
public static async delete(
id: number,
idWell: number,
): Promise<any> {
idSection: number,
): Promise<number> {
const result = await __request({
method: 'DELETE',
path: `/api/well/${idWell}/sections/${id}`,
path: `/api/well/${idWell}/sections/${idSection}`,
});
return result.body;
}