|
|
|
@ -1,11 +1,16 @@ |
|
|
|
import {getDetailList, delDetail, getDetail, getPointByUuid} from '../../../services/measure/analysis' |
|
|
|
import { useState, useEffect } from 'react' |
|
|
|
import { useState, useEffect, useRef } from 'react' |
|
|
|
import {message, Button, type TableColumnsType, type TableProps, Modal, Table, Pagination, Input } from 'antd'; |
|
|
|
|
|
|
|
import { useNavigate } from 'react-router-dom'; |
|
|
|
import type { DetailTable, SearchParams } from "../../../services/measure/type"; |
|
|
|
import type { AnalysisReport, AnalysisResults, DetailTable, SearchParams } from "../../../services/measure/type"; |
|
|
|
import { ExclamationCircleFilled } from '@ant-design/icons'; |
|
|
|
|
|
|
|
import { AnalysisData, BenchmarkShape, MeasurementCanvasRef } from './konva/MeasurementCanvas'; |
|
|
|
import MeasurementCanvas from "./konva/MeasurementCanvas"; |
|
|
|
import { |
|
|
|
getBaseRecordPointSetByCode, |
|
|
|
getReport |
|
|
|
} from "../../../services/measure/analysis"; |
|
|
|
export default function MeasureDetail() { |
|
|
|
const navigate = useNavigate(); |
|
|
|
const { Search } = Input; |
|
|
|
@ -79,21 +84,19 @@ export default function MeasureDetail() { |
|
|
|
title: '时间', |
|
|
|
dataIndex: 'createTime', |
|
|
|
}, |
|
|
|
// {
|
|
|
|
// title: '操作',
|
|
|
|
// dataIndex: 'op',
|
|
|
|
// width:180,
|
|
|
|
// align:'center',
|
|
|
|
// render:(_, record)=>{
|
|
|
|
// return <div>
|
|
|
|
// <Button type="link" onClick={()=>onDel(record)}>删除</Button>
|
|
|
|
// <br/>
|
|
|
|
// <Button type="link" onClick={()=>onShowDetail(record)}>导出测量数据</Button>
|
|
|
|
// <br/>
|
|
|
|
// <Button type="link" onClick={()=>onDetaiResult(record)}>导出分析结果</Button>
|
|
|
|
// </div>
|
|
|
|
// }
|
|
|
|
// },
|
|
|
|
{ |
|
|
|
title: '操作', |
|
|
|
dataIndex: 'op', |
|
|
|
width:180, |
|
|
|
align:'center', |
|
|
|
render:(_, record)=>{ |
|
|
|
return <div> |
|
|
|
<Button type="link" onClick={()=>onDel(record)}>删除</Button> |
|
|
|
<br/> |
|
|
|
<Button type="link" onClick={()=>onShowDetail(record)}>查看分析结果</Button> |
|
|
|
</div> |
|
|
|
} |
|
|
|
}, |
|
|
|
]; |
|
|
|
|
|
|
|
const [tableData, setTableData] = useState<DetailTable[]>([]) |
|
|
|
@ -152,25 +155,58 @@ export default function MeasureDetail() { |
|
|
|
} |
|
|
|
|
|
|
|
const onShowDetail = (item:DetailTable)=> { |
|
|
|
message.warning('正在开发中') |
|
|
|
return; |
|
|
|
//获取基线
|
|
|
|
getBaseRecordPointSetByCode("6001").then(res => { |
|
|
|
if (res.success) { |
|
|
|
const benchmarkShapes = JSON.parse(res.data.points) as BenchmarkShape[]; |
|
|
|
if (canvasRef.current) { |
|
|
|
console.log("解析后的基础图形数据：", benchmarkShapes); |
|
|
|
canvasRef.current.setBenchmarkData(benchmarkShapes); |
|
|
|
} |
|
|
|
} |
|
|
|
}); |
|
|
|
getDetail({id:item.id}).then(res=>{ |
|
|
|
console.log('res==测量记录详情=', res) |
|
|
|
if(res){ |
|
|
|
setIsModalOpen(true) |
|
|
|
//@ts-ignore
|
|
|
|
getRecordByUuid(res.data.uuid) |
|
|
|
//@ts-ignore
|
|
|
|
onDetaiResult(res.data.uuid) |
|
|
|
} |
|
|
|
}) |
|
|
|
} |
|
|
|
|
|
|
|
const onDetaiResult = (item:DetailTable) => { |
|
|
|
message.warning('正在开发中') |
|
|
|
return; |
|
|
|
//法线
|
|
|
|
const onDetaiResult = (uuid:string) => { |
|
|
|
getReport(uuid,'6001').then(res=> { |
|
|
|
if (res.success) { |
|
|
|
const report: AnalysisReport = res.data; |
|
|
|
console.log(report); |
|
|
|
// 更新 canvas 的分析数据
|
|
|
|
if (report && report.angleAnalysisList) { |
|
|
|
// 先过滤掉 distance 为 null 的数据
|
|
|
|
const validItems = report.angleAnalysisList.filter(item => item.distance !== null); |
|
|
|
const analysisData: AnalysisData[] = validItems.map(item => ({ |
|
|
|
pointA: { x: parseFloat(item.pointA.x), y: parseFloat(item.pointA.y) }, |
|
|
|
pointB: { x: parseFloat(item.pointB.x), y: parseFloat(item.pointB.y) }, |
|
|
|
base: { x: parseFloat(item.pointA.x), y: parseFloat(item.pointA.y) }, |
|
|
|
measure: { x: parseFloat(item.pointB.x), y: parseFloat(item.pointB.y) }, |
|
|
|
distance: parseFloat(item.distance), |
|
|
|
describe: item.describe, |
|
|
|
})); |
|
|
|
canvasRef.current?.setAnalysisData(analysisData); |
|
|
|
} |
|
|
|
} else { |
|
|
|
message.error("分析报告请求失败: " + res.data.info); |
|
|
|
} |
|
|
|
}) |
|
|
|
|
|
|
|
} |
|
|
|
|
|
|
|
const getRecordByUuid = (uuid:string) => { |
|
|
|
getPointByUuid({uuid}).then(res=>{ |
|
|
|
console.log('=========================', res) |
|
|
|
canvasRef.current?.setMeasurementData(res.data.points); |
|
|
|
}) |
|
|
|
} |
|
|
|
|
|
|
|
@ -243,6 +279,17 @@ export default function MeasureDetail() { |
|
|
|
getDetailDataList(searchParams) |
|
|
|
} |
|
|
|
let [loading, setLoading] = useState(false) |
|
|
|
let [isModalOpen, setIsModalOpen] = useState(false) |
|
|
|
const canvasRef = useRef<MeasurementCanvasRef>(null); |
|
|
|
const [showGrid, setShowGrid] = useState(true); |
|
|
|
const [showStandard, setShowStandard] = useState(true); |
|
|
|
const [showMark, setShowMark] = useState(true); |
|
|
|
const handleOk = () => { |
|
|
|
|
|
|
|
} |
|
|
|
const handleCancel = () => { |
|
|
|
setIsModalOpen(false) |
|
|
|
} |
|
|
|
return ( |
|
|
|
<div> |
|
|
|
<div className="p-[15px]"> |
|
|
|
@ -267,7 +314,7 @@ export default function MeasureDetail() { |
|
|
|
rowKey="id" |
|
|
|
dataSource={tableData && tableData.map(item => ({ ...item, key: item.name }))} |
|
|
|
pagination={false} |
|
|
|
scroll={{ y: 550 }} |
|
|
|
scroll={{ y: 500 }} |
|
|
|
|
|
|
|
/> |
|
|
|
<div className="float-right"> |
|
|
|
@ -275,6 +322,36 @@ export default function MeasureDetail() { |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<Modal |
|
|
|
title="测量记录详情" |
|
|
|
open={isModalOpen} |
|
|
|
width={{ xl: '60%'}} |
|
|
|
style={{ top: 20 }} |
|
|
|
closable={false} |
|
|
|
footer={[ |
|
|
|
<Button key="cancel" onClick={handleCancel}> |
|
|
|
取消 |
|
|
|
</Button>]} |
|
|
|
> |
|
|
|
<div className="flex justify-center"> |
|
|
|
<MeasurementCanvas |
|
|
|
width={800} |
|
|
|
height={600} |
|
|
|
logicalExtent={{ minX: -50, maxX: 50, minY: -20, maxY: 60 }} |
|
|
|
gridStep={1} |
|
|
|
origin={{ x: 0, y: 20 }} |
|
|
|
pixelPerMm={8} |
|
|
|
maxZoom={10} |
|
|
|
showGrid={showGrid} |
|
|
|
showBenchmark={showStandard} |
|
|
|
showAnalysis={showMark} |
|
|
|
showScale={false} |
|
|
|
scaleInterval={1} |
|
|
|
showCoordinates={true} |
|
|
|
ref={canvasRef} |
|
|
|
/> |
|
|
|
</div> |
|
|
|
</Modal> |
|
|
|
</div> |
|
|
|
); |
|
|
|
} |
LiLongLong
5 months ago
