Initial commit with Email Import Wizard and Task Processor updates

2026-05-04 08:02:11 +02:00
commit effdc5d59f
170 changed files with 67739 additions and 0 deletions
@@ -0,0 +1,144 @@
+import { useEffect, useState } from 'react';
+import { Table, Popover, Image, Button, Space, message, ConfigProvider, Tooltip } from 'antd';
+import { ReloadOutlined } from '@ant-design/icons';
+import dayjs from 'dayjs';
+import { posteingangApi } from '../api/posteingang';
+import type { PosteingangDocument } from '../api/posteingang';
+import DocumentEditModal from '../components/DocumentEditModal';
+import { getEnv } from '../utils/env';
+
+export default function PosteingangPage() {
+  const [data, setData] = useState<PosteingangDocument[]>([]);
+  const [loading, setLoading] = useState(false);
+  const [editModalOpen, setEditModalOpen] = useState(false);
+  const [selectedDoc, setSelectedDoc] = useState<PosteingangDocument | null>(null);
+
+  const fetchData = async () => {
+    setLoading(true);
+    try {
+      const docs = await posteingangApi.getList();
+      setData(docs || []);
+    } catch (e) {
+      message.error("Posteingang konnte nicht geladen werden.");
+    } finally {
+      setLoading(false);
+    }
+  };
+
+  useEffect(() => {
+    fetchData();
+    // Refresh interval every 30 seconds
+    const interval = setInterval(() => {
+      fetchData();
+    }, 30000);
+    return () => clearInterval(interval);
+  }, []);
+
+  const handleEdit = (doc: PosteingangDocument) => {
+    setSelectedDoc(doc);
+    setEditModalOpen(true);
+  };
+
+  const handleCloseModal = (openNext?: boolean) => {
+    setEditModalOpen(false);
+    if (openNext && data.length > 0) {
+      const currentIndex = data.findIndex(d => d.id === selectedDoc?.id);
+      const nextIndex = currentIndex !== -1 && currentIndex + 1 < data.length ? currentIndex + 1 : 0;
+      const nextDoc = data[nextIndex];
+      setTimeout(() => {
+        setSelectedDoc(nextDoc);
+        setEditModalOpen(true);
+      }, 300);
+    } else {
+        setSelectedDoc(null);
+    }
+  };
+
+  const popoverContent = (id: number) => (
+    <Image 
+       src={`${getEnv('VITE_API_URL')}/api/paperless/inbox/preview/${id}`} 
+       width={400} 
+       preview={false} 
+    />
+  );
+
+  const columns = [
+    {
+      title: 'Vorschau',
+      key: 'preview',
+      width: 150,
+      render: (_: any, record: PosteingangDocument) => (
+        <Popover content={popoverContent(record.id)} placement="right" trigger="hover">
+          <Image 
+            src={`${getEnv('VITE_API_URL')}/api/paperless/inbox/preview/${record.id}`} 
+            width={100}
+            preview={false}
+            style={{ border: '1px solid #d9d9d9', objectFit: 'contain' }}
+          />
+        </Popover>
+      ),
+    },
+    {
+      title: 'Titel',
+      dataIndex: 'title',
+      key: 'title',
+      width: '35%',
+    },
+    {
+      title: 'Eingangsdatum',
+      key: 'eingangsdatum',
+      render: (_: any, record: PosteingangDocument) => {
+        const cf = record.customFields?.find((f) => f.field === 9);
+        return cf?.value ? dayjs(cf.value).format('DD.MM.YYYY') : '-';
+      }
+    },
+    {
+      title: 'Importiert am',
+      dataIndex: 'added',
+      key: 'added',
+      render: (text: string) => dayjs(text).format('DD.MM.YYYY HH:mm'),
+    },
+    {
+      title: 'Aktion',
+      key: 'action',
+      width: 150,
+      render: (_: any, record: PosteingangDocument) => (
+        <Button type="primary" onClick={() => handleEdit(record)}>
+          Bearbeiten
+        </Button>
+      ),
+    },
+  ];
+
+  return (
+    <ConfigProvider>
+      <div style={{ padding: '0 24px 24px' }}>
+        <div style={{ display: 'flex', justifyContent: 'space-between', alignItems: 'center', marginBottom: 16 }}>
+            <h2>Posteingang</h2>
+            <Space>
+                <Tooltip title="Manuell aktualisieren">
+                    <Button icon={<ReloadOutlined />} onClick={fetchData} loading={loading} />
+                </Tooltip>
+            </Space>
+        </div>
+        <Table 
+          columns={columns} 
+          dataSource={data} 
+          rowKey="id" 
+          loading={loading}
+          pagination={{ pageSize: 20 }}
+        />
+        
+        <DocumentEditModal
+            documentId={selectedDoc?.id || null}
+            document={selectedDoc}
+            open={editModalOpen}
+            onClose={handleCloseModal}
+            onSave={fetchData}
+            isPosteingang={true}
+            hasNextDocument={data.length > 1}
+        />
+      </div>
+    </ConfigProvider>
+  );
+}