fix: 修复单条数据不显示表格的问题,优化弹窗UI布局

- 修复数组解构错误导致单条数据时不显示表格
- 优化DetailsDialog弹窗布局,内容过多时按钮始终可见
This commit is contained in:
xiongxiao
2026-03-13 05:23:05 +08:00
committed by cnb
parent 52fa9c5b42
commit 3269b2eef3
2 changed files with 7 additions and 7 deletions

View File

@@ -539,12 +539,12 @@ export const DetailsDialog = () => {
</DialogContent> </DialogContent>
</Dialog> </Dialog>
<Dialog open={queryViewStore.showDetailsDialog} onOpenChange={queryViewStore.setShowDetailsDialog}> <Dialog open={queryViewStore.showDetailsDialog} onOpenChange={queryViewStore.setShowDetailsDialog}>
<DialogContent className={`max-h-[80vh] overflow-hidden ${isFullscreen ? 'w-screen! h-screen! max-w-screen! max-h-screen! ' : 'max-w-3xl! '}`}> <DialogContent className={`flex flex-col max-h-[85vh] ${isFullscreen ? 'w-screen! h-screen! max-w-screen! max-h-screen! ' : 'max-w-4xl! '}`}>
<DialogHeader> <DialogHeader className="flex-shrink-0">
<DialogTitle></DialogTitle> <DialogTitle></DialogTitle>
</DialogHeader> </DialogHeader>
<div className="flex gap-2 border-b border-gray-200"> <div className="flex gap-2 border-b border-gray-200 flex-shrink-0">
{queryViewStore.allDetailsTabs.map((tab) => ( {queryViewStore.allDetailsTabs.map((tab) => (
<button <button
key={tab.key} key={tab.key}
@@ -559,7 +559,7 @@ export const DetailsDialog = () => {
))} ))}
</div> </div>
<div className="mt-4 h-[calc(80vh-200px)] overflow-auto scrollbar px-2"> <div className="flex-1 overflow-auto scrollbar px-2 min-h-0">
{/* 第一个标签页:详情信息 */} {/* 第一个标签页:详情信息 */}
{queryViewStore.detailsActiveTab === 'details' && ( {queryViewStore.detailsActiveTab === 'details' && (
<DetailsInfoPanel detailsData={queryViewStore.detailsData} /> <DetailsInfoPanel detailsData={queryViewStore.detailsData} />
@@ -575,9 +575,9 @@ export const DetailsDialog = () => {
<RouterInfoPanel routeInfo={routeInfo} /> <RouterInfoPanel routeInfo={routeInfo} />
)} )}
{/* 第个标签页:响应 */} {/* 第个标签页:响应 */}
{queryViewStore.detailsActiveTab === 'response' && ( {queryViewStore.detailsActiveTab === 'response' && (
<div className="space-y-4"> <div className="space-y-4 h-full">
<QueryView viewData={queryViewStore.detailsData} type={'message'} setIsFullscreen={setIsFullscreen} /> <QueryView viewData={queryViewStore.detailsData} type={'message'} setIsFullscreen={setIsFullscreen} />
</div> </div>
)} )}

View File

@@ -67,7 +67,7 @@ export const QueryView = (props: Props) => {
setIsList(true); setIsList(true);
} }
setData(response.data.list) setData(response.data.list)
const [_, firstItem] = response.data.list || [] const [firstItem] = response.data.list || []
if (firstItem) { if (firstItem) {
const cols: ColumnDef<any>[] = Object.keys(firstItem).map(key => ({ const cols: ColumnDef<any>[] = Object.keys(firstItem).map(key => ({
accessorKey: key, accessorKey: key,