public/NotifyIfAvail
2
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

make button with email-field work

Browse Source 
//TODO make plugin work completely, with all features and fix bugs
This commit is contained in:
Nils 2025-03-07 15:52:18 +01:00
parent 0aaa34f504
commit a84436c2eb
Signed by: slinicraftet204
GPG Key ID: 78E12696BAFC2A4B
6 changed files with 70 additions and 64 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

2
composer.json
View File

@ -1,7 +1,7 @@
{
"name": "slinicraftet204/notifyifavail",
"description": "benachrichtigt Kunden, sobald ein Produkt wieder verfügbar ist",
"version": "0.1.492",
"version": "0.1.499",
"type": "shopware-platform-plugin",
"license": "MIT",
"authors": [

5
src/Resources/app/storefront/src/main.js
View File

@ -1 +1,4 @@
import './js/notify-me.js';
import PluginManager from 'src/plugin-system/plugin.manager';
import NotifyMe from './plugin/notify-me.plugin';
PluginManager.register('NotifyMe', NotifyMe, '[data-notify-me]');

58
src/Resources/public/js/notify-me.js
View File

@ -1,58 +0,0 @@
document.addEventListener('DOMContentLoaded', function () {
console.log("✅ NotifyMe Script geladen");
const notifyContainer = document.getElementById('notify-me-container');
if (!notifyContainer) {
console.error("❌ NotifyMe: Container nicht gefunden!");
return;
}
console.log("✅ NotifyMe: Container gefunden");
const notifyButton = document.querySelector('.notify-me-button');
const submitButton = document.querySelector('.notify-me-submit');
const emailInput = document.querySelector('.notify-me-email');
if (notifyButton) {
console.log("✅ NotifyMe: Button gefunden");
notifyButton.addEventListener('click', function () {
const email = this.dataset.customerEmail;
const productId = this.dataset.productId;
sendNotificationRequest(email, productId);
});
} else {
console.error("❌ NotifyMe: Button nicht gefunden!");
}
if (submitButton) {
console.log("✅ NotifyMe: Submit-Button gefunden");
submitButton.addEventListener('click', function () {
const email = emailInput.value;
const productId = this.dataset.productId;
if (!email) {
alert("Bitte geben Sie eine gültige E-Mail-Adresse ein.");
return;
}
sendNotificationRequest(email, productId);
});
} else {
console.error("❌ NotifyMe: Submit-Button nicht gefunden!");
}
function sendNotificationRequest(email, productId) {
console.log(`📩 Anfrage für Produkt: ${productId}, Email: ${email}`);
fetch('/notification/subscribe', {
method: 'POST',
headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
body: `email=${encodeURIComponent(email)}&productId=${encodeURIComponent(productId)}`
})
.then(response => response.json())
.then(data => {
alert(data.message);
})
.catch(error => console.error('❌ Fehler:', error));
}
});

50
src/Resources/public/js/notify-me.plugin.js Normal file
View File

@ -0,0 +1,50 @@
import Plugin from 'src/plugin-system/plugin.class';
export default class NotifyMePlugin extends Plugin {
init() {
this.notifyButton = document.getElementById('notify-me-button');
this.emailInput = document.getElementById('notify-me-email');
this.submitButton = document.getElementById('submit-notify');
this.registerEvents();
}
registerEvents() {
if (this.notifyButton) {
this.notifyButton.addEventListener('click', () => this.submitForm(true));
}
if (this.submitButton) {
this.submitButton.addEventListener('click', () => this.submitForm(false));
}
}
submitForm(isLoggedIn) {
let email;
const productId = this.notifyButton?.dataset.productId || this.submitButton?.dataset.productId;
if (isLoggedIn) {
email = this.notifyButton.dataset.customerEmail;
} else {
email = this.emailInput.value.trim();
if (!this.validateEmail(email)) {
alert("Bitte geben Sie eine gültige E-Mail-Adresse ein.");
return;
}
}
fetch('/notification/subscribe', {
method: 'POST',
headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
body: `email=${encodeURIComponent(email)}&productId=${encodeURIComponent(productId)}`
})
.then(response => response.json())
.then(data => alert(data.message))
.catch(error => console.error('Error:', error));
}
validateEmail(email) {
const emailPattern = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
return emailPattern.test(email);
}
}

6
src/Resources/theme.json Normal file
View File

@ -0,0 +1,6 @@
{
"views": [
"@Storefront",
"@NotifyIfAvail"
]
}

13
src/Resources/views/storefront/page/product-detail/buy-widget.html.twig → src/Resources/views/storefront/component/buy-widget/buy-widget.html.twig
View File

@ -1,6 +1,6 @@
{% sw_extends '@Storefront/storefront/page/product-detail/buy-widget.html.twig' %}
{% sw_extends '@Storefront/storefront/component/buy-widget/buy-widget.html.twig' %}
{% block page_product_detail_price %}
{% block buy_widget_price %}
{{ parent() }}
{% if not product.available or product.stock <= 0 %}
@ -8,13 +8,18 @@
<h3>{{ "NotifyIfAvail.notify_me"|trans }}</h3>
{% if app.customer %}
<button class="btn btn-primary w-100" id="notify-me-button" data-product-id="{{ product.id }}" data-customer-email="{{ app.customer.email }}">
<!-- Eingeloggter Benutzer: Nur Button anzeigen -->
<button class="btn btn-primary w-100" id="notify-me-button"
data-product-id="{{ product.id }}"
data-customer-email="{{ app.customer.email }}">
{{ "NotifyIfAvail.notify_me"|trans }}
</button>
{% else %}
<!-- Gast: Nur Eingabefeld + Button anzeigen -->
<input type="email" id="notify-me-email" class="form-control mb-2"
placeholder="{{ 'NotifyIfAvail.email_placeholder'|trans }}" required>
<button class="btn btn-primary w-100" id="submit-notify" data-product-id="{{ product.id }}">
<button class="btn btn-primary w-100" id="submit-notify"
data-product-id="{{ product.id }}">
{{ "NotifyIfAvail.notify_me"|trans }}
</button>
{% endif %}