commit task-fix-template

This commit is contained in:
phaichayon
2026-06-27 19:44:56 +07:00
parent 3fdd681dd0
commit 1c019d12f3
3 changed files with 703 additions and 31 deletions

View File

@@ -18,6 +18,7 @@ import { Input } from '@/components/ui/input';
import { Switch } from '@/components/ui/switch';
import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs';
import { Textarea } from '@/components/ui/textarea';
import { TemplateJsonSheet } from './template-json-sheet';
import {
createDocumentTemplateMappingMutation,
createDocumentTemplateMutation,
@@ -182,6 +183,10 @@ function Field({
);
}
function getTableColumnCount(version: DocumentTemplateVersionDetail) {
return version.mappings.reduce((total, mapping) => total + mapping.columns.length, 0);
}
function TemplateDialog({
open,
onOpenChange,
@@ -574,40 +579,61 @@ function TemplateDetailCard({ templateId }: { templateId: string }) {
No versions created yet.
</div>
) : null}
{template.versions.map((version) => (
<TabsContent key={version.id} value={version.id} className='space-y-4'>
<div className='rounded-lg border p-4'>
<div className='flex flex-wrap items-center justify-between gap-3'>
<div>
<div className='font-medium'>Version {version.version}</div>
<div className='text-muted-foreground text-sm'>
{version.filePath || 'No file path set'}{version.previewImageUrl ? `${version.previewImageUrl}` : ''}
{template.versions.map((version) => (
<TabsContent key={version.id} value={version.id} className='space-y-4'>
<div className='rounded-lg border p-4'>
<div className='flex flex-wrap items-start justify-between gap-3'>
<div className='min-w-0 flex-1 space-y-3'>
<div className='font-medium'>Version {version.version}</div>
<div className='grid gap-3 sm:grid-cols-2 xl:grid-cols-4'>
<div className='rounded-lg bg-muted/40 p-3'>
<div className='text-muted-foreground text-xs'>File Path</div>
<div className='mt-1 break-all text-sm font-medium'>
{version.filePath || 'No file path set'}
</div>
</div>
<div className='rounded-lg bg-muted/40 p-3'>
<div className='text-muted-foreground text-xs'>Mappings</div>
<div className='mt-1 text-sm font-medium'>{version.mappings.length}</div>
</div>
<div className='rounded-lg bg-muted/40 p-3'>
<div className='text-muted-foreground text-xs'>Table Columns</div>
<div className='mt-1 text-sm font-medium'>{getTableColumnCount(version)}</div>
</div>
<div className='rounded-lg bg-muted/40 p-3'>
<div className='text-muted-foreground text-xs'>Preview Image</div>
<div className='mt-1 break-all text-sm font-medium'>
{version.previewImageUrl || '-'}
</div>
</div>
</div>
</div>
<div className='flex flex-wrap items-center gap-2'>
<Badge variant={version.isActive ? 'secondary' : 'outline'}>
{version.isActive ? 'Active' : 'Inactive'}
</Badge>
<TemplateJsonSheet
version={version.version}
filePath={version.filePath}
schemaJson={version.schemaJson}
/>
<Button variant='outline' onClick={() => setVersionDialogOpen(true)}>
Edit Version
</Button>
<Button
onClick={() =>
setMappingDialogState({
open: true,
version
})
}
>
<Icons.add className='mr-2 h-4 w-4' />
Add Mapping
</Button>
</div>
</div>
<div className='flex items-center gap-2'>
<Badge variant={version.isActive ? 'secondary' : 'outline'}>
{version.isActive ? 'Active' : 'Inactive'}
</Badge>
<Button variant='outline' onClick={() => setVersionDialogOpen(true)}>
Edit Version
</Button>
<Button
onClick={() =>
setMappingDialogState({
open: true,
version
})
}
>
<Icons.add className='mr-2 h-4 w-4' />
Add Mapping
</Button>
</div>
</div>
<pre className='bg-muted mt-4 max-h-72 overflow-auto rounded-lg p-4 text-xs'>
{JSON.stringify(version.schemaJson, null, 2)}
</pre>
</div>
<div className='space-y-3'>
{version.mappings.map((mapping) => (
<div key={mapping.id} className='rounded-lg border p-4'>