Erweiterungen
This commit is contained in:
Binary file not shown.
@@ -166,6 +166,19 @@ window.initProfileInvoiceGenerator = function() {
|
|||||||
ctx.lineTo(x + w, y);
|
ctx.lineTo(x + w, y);
|
||||||
ctx.stroke();
|
ctx.stroke();
|
||||||
} else if (el.type === 'image') {
|
} else if (el.type === 'image') {
|
||||||
|
if (el.imageData) {
|
||||||
|
// Draw the uploaded image
|
||||||
|
var img = new Image();
|
||||||
|
img.onload = function() {
|
||||||
|
ctx.drawImage(img, x, y, w, h);
|
||||||
|
// Redraw selection if this element is selected
|
||||||
|
if (selectedElement && selectedElement.id === el.id) {
|
||||||
|
drawSelection(el);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
img.src = el.imageData;
|
||||||
|
} else {
|
||||||
|
// Draw placeholder
|
||||||
ctx.fillStyle = '#f0f0f0';
|
ctx.fillStyle = '#f0f0f0';
|
||||||
ctx.fillRect(x, y, w, h);
|
ctx.fillRect(x, y, w, h);
|
||||||
ctx.strokeStyle = '#999999';
|
ctx.strokeStyle = '#999999';
|
||||||
@@ -175,6 +188,7 @@ window.initProfileInvoiceGenerator = function() {
|
|||||||
ctx.textAlign = 'center';
|
ctx.textAlign = 'center';
|
||||||
ctx.textBaseline = 'middle';
|
ctx.textBaseline = 'middle';
|
||||||
ctx.fillText('Bild', x + w / 2, y + h / 2);
|
ctx.fillText('Bild', x + w / 2, y + h / 2);
|
||||||
|
}
|
||||||
} else {
|
} else {
|
||||||
// Text elements
|
// Text elements
|
||||||
ctx.font = (el.fontStyle || '') + ' ' + fontSize + 'px Arial';
|
ctx.font = (el.fontStyle || '') + ' ' + fontSize + 'px Arial';
|
||||||
@@ -567,6 +581,15 @@ window.initProfileInvoiceGenerator = function() {
|
|||||||
}
|
}
|
||||||
};
|
};
|
||||||
|
|
||||||
|
window.updateProfileElementImage = function(id, imageData) {
|
||||||
|
var el = elements.find(function(e) { return e.id === id; });
|
||||||
|
if (el) {
|
||||||
|
el.imageData = imageData;
|
||||||
|
el.text = 'Bild';
|
||||||
|
draw();
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
window.deleteProfileElement = function(id) {
|
window.deleteProfileElement = function(id) {
|
||||||
var index = elements.findIndex(function(e) { return e.id === id; });
|
var index = elements.findIndex(function(e) { return e.id === id; });
|
||||||
if (index > -1) {
|
if (index > -1) {
|
||||||
|
|||||||
@@ -25,6 +25,8 @@ import java.util.List;
|
|||||||
|
|
||||||
import com.vaadin.flow.component.textfield.TextArea;
|
import com.vaadin.flow.component.textfield.TextArea;
|
||||||
import com.vaadin.flow.component.tabs.TabSheet;
|
import com.vaadin.flow.component.tabs.TabSheet;
|
||||||
|
import com.vaadin.flow.component.upload.Upload;
|
||||||
|
import com.vaadin.flow.component.upload.receivers.MemoryBuffer;
|
||||||
import com.vaadin.flow.data.binder.Binder;
|
import com.vaadin.flow.data.binder.Binder;
|
||||||
import com.vaadin.flow.data.validator.EmailValidator;
|
import com.vaadin.flow.data.validator.EmailValidator;
|
||||||
import com.vaadin.flow.router.PageTitle;
|
import com.vaadin.flow.router.PageTitle;
|
||||||
@@ -1037,6 +1039,41 @@ public class EditProfileView extends HorizontalLayout {
|
|||||||
|
|
||||||
propertiesPanelProfile.add(header, typeLabel);
|
propertiesPanelProfile.add(header, typeLabel);
|
||||||
|
|
||||||
|
// Für Bildelemente: Upload-Button anzeigen
|
||||||
|
if ("image".equals(elementType)) {
|
||||||
|
MemoryBuffer buffer = new MemoryBuffer();
|
||||||
|
Upload upload = new Upload(buffer);
|
||||||
|
upload.setAcceptedFileTypes("image/png", "image/jpeg", "image/jpg", "image/gif", "image/webp");
|
||||||
|
upload.setMaxFileSize(5 * 1024 * 1024); // 5 MB
|
||||||
|
upload.setDropLabel(new Span("Bild hierher ziehen oder klicken"));
|
||||||
|
upload.setWidthFull();
|
||||||
|
|
||||||
|
upload.addSucceededListener(event -> {
|
||||||
|
try {
|
||||||
|
// Bild als Base64 kodieren
|
||||||
|
byte[] bytes = buffer.getInputStream().readAllBytes();
|
||||||
|
String base64 = java.util.Base64.getEncoder().encodeToString(bytes);
|
||||||
|
String mimeType = event.getMIMEType();
|
||||||
|
String dataUrl = "data:" + mimeType + ";base64," + base64;
|
||||||
|
|
||||||
|
// An JavaScript übergeben
|
||||||
|
getElement().executeJs(
|
||||||
|
"if (window.updateProfileElementImage) { window.updateProfileElementImage('"
|
||||||
|
+ elementId + "', $0); }",
|
||||||
|
dataUrl);
|
||||||
|
Notification.show("Bild erfolgreich hochgeladen", 3000, Notification.Position.BOTTOM_CENTER);
|
||||||
|
} catch (Exception ex) {
|
||||||
|
Notification.show("Fehler beim Hochladen: " + ex.getMessage(), 3000, Notification.Position.BOTTOM_CENTER);
|
||||||
|
}
|
||||||
|
});
|
||||||
|
|
||||||
|
upload.addFileRejectedListener(event -> {
|
||||||
|
Notification.show("Datei abgelehnt: " + event.getErrorMessage(), 3000, Notification.Position.BOTTOM_CENTER);
|
||||||
|
});
|
||||||
|
|
||||||
|
propertiesPanelProfile.add(upload);
|
||||||
|
}
|
||||||
|
|
||||||
// Text Feld (nur für Text-Elemente)
|
// Text Feld (nur für Text-Elemente)
|
||||||
if (!"line".equals(elementType) && !"image".equals(elementType)) {
|
if (!"line".equals(elementType) && !"image".equals(elementType)) {
|
||||||
TextField textField = new TextField("Text");
|
TextField textField = new TextField("Text");
|
||||||
|
|||||||
Reference in New Issue
Block a user