Add product edit auto fill

This commit is contained in:
grandeljay 2022-02-27 12:23:38 +01:00
parent ac056cd511
commit d39ebfc9f0
5 changed files with 184 additions and 45 deletions

View file

@ -1,5 +1,8 @@
RewriteEngine On
# Wish
RewriteRule ^([a-z\-]+)/(\d+)$ /?page=$1&id=$2 [QSA,L]
# Wishlists
RewriteRule ^([a-z\-]+)/(\d+)$ /?page=$1&wishlist=$2 [QSA,L]

106
src/assets/js/wish.js Normal file
View file

@ -0,0 +1,106 @@
$(function () {
/**
* Validate
*/
$(document).on('click', '.button.autofill', function () {
var modalAutoFill = $('.modal.auto-fill');
var modalValidate = $('.modal.validate');
var formWish = $('.form.wish');
var inputTitle = $('[name="wish_title"]');
var inputDescription = $('[name="wish_description"]');
var inputURL = $('[name="wish_url"]');
modalAutoFill
.modal({
onApprove: function(buttonApprove) {
formWish.addClass('loading');
fetch('/src/api/wishes.php?wish_url=' + inputURL.val(), {
method: 'GET'
})
.then(handleFetchError)
.then(handleFetchResponse)
.then(function(response) {
var info = response.info;
/**
* Title
*/
if (info.title) {
inputTitle.val(info.title);
}
/**
* Description
*/
if (info.description) {
inputDescription.val(info.description);
}
/**
* URL
*/
if (info.url && info.url !== inputURL.val()) {
var elementModalFetch = $('.modal.validate');
modalValidate.find('.primary.button').popup();
console.log(modalValidate.find('.primary.button'));
elementModalFetch.find('input.current').val(inputURL.val());
elementModalFetch.find('input.proposed').val(info.url);
elementModalFetch
.modal({
onApprove: function (buttonFetch) {
var formData = new URLSearchParams();
formData.append('wish_url_current', inputURL.val());
formData.append('wish_url_proposed', info.url);
buttonFetch.addClass('loading');
fetch('/src/api/wishes.php', {
method: 'PUT',
body: formData
})
.then(response => response.json())
.then(response => {
if (response.success) {
inputURL.val(info.url);
elementModalFetch.modal('hide');
$('body').toast({
class: 'success',
showIcon: 'check',
title: 'Success',
message: 'Wish information updated.'
});
}
buttonFetch.removeClass('loading');
});
return false;
},
onHide: function() {
formWish.removeClass('loading');
}
})
.modal('show');
} else {
formWish.removeClass('loading');
}
})
.catch(function(error) {
console.log(error);
});
}
})
.modal('show');
});
});

View file

@ -213,6 +213,7 @@ $(function () {
$('body').toast({
class: 'success',
showIcon: 'check',
title: 'Success',
message: 'Wishlist successfully deleted.'
});
@ -277,6 +278,7 @@ $(function () {
$('body').toast({
class: 'success',
showIcon: 'check',
title: 'Success',
message: 'Wish successfully deleted.'
});
@ -324,6 +326,7 @@ $(function () {
$('body').toast({
class: 'success',
showIcon: 'check',
title: 'Success',
message: 'Wish successfully added.'
});
@ -464,6 +467,7 @@ $(function () {
$('body').toast({
class: 'success',
showIcon: 'check',
title: 'Success',
message: 'Wishlist successfully created.'
});

View file

@ -48,7 +48,7 @@ $referer = '/?page=wishlists&wishlist=' . $wish->wishlist;
<?= $page->messages($messages) ?>
<div class="ui segment">
<form class="ui form" method="POST">
<form class="ui form wish" method="POST">
<input type="hidden" name="wish_id" value="<?= $_GET['id'] ?>">
<div class="ui two column grid">
@ -67,6 +67,13 @@ $referer = '/?page=wishlists&wishlist=' . $wish->wishlist;
<i class="external icon"></i>
Visit
</a>
<button class="ui labeled icon button autofill"
type="button"
>
<i class="redo icon"></i>
Auto-fill
</button>
</div>
</div>
@ -81,6 +88,7 @@ $referer = '/?page=wishlists&wishlist=' . $wish->wishlist;
name="wish_title"
placeholder="<?= $wish->title ?>"
value="<?= $wish->title ?>"
maxlength="128"
/>
</div>
</div>
@ -95,18 +103,17 @@ $referer = '/?page=wishlists&wishlist=' . $wish->wishlist;
<div class="field">
<label>URL</label>
<div class="ui input">
<input type="url"
name="wish_url"
placeholder="<?= $wish->url ?>"
value="<?= $wish->url ?>"
maxlength="255"
/>
</div>
</div>
<input class="ui primary button" type="submit" value="Save" />
<input class="ui button" type="reset" value="Reset" />
<a class="ui secondary button" href="<?= $referer ?>">Cancel</a>
<a class="ui secondary button" href="<?= $referer ?>">Back</a>
</div>
</div>
@ -118,6 +125,58 @@ $referer = '/?page=wishlists&wishlist=' . $wish->wishlist;
</div>
</main>
<!-- Auto-fill -->
<div class="ui small modal auto-fill">
<div class="header">
Warning
</div>
<div class="content">
<p>This action will potentially overwrite all fields in this wish.</p>
<p>Would you like to continue?</p>
</div>
<div class="actions">
<div class="ui primary approve button">
Yes, overwrite
</div>
<div class="ui deny button">
No
</div>
</div>
</div>
<!-- Validate -->
<div class="ui small modal validate">
<div class="header">
Incorrect URL
</div>
<div class="content">
<div class="description">
<div class="ui header">Wish URLs</div>
<p>The URL you have entered does not seem quite right. Would you like to update it with the one I found?</p>
<div class="ui form urls">
<div class="field">
<label>Current</label>
<input class="current" type="url" readonly />
</div>
<div class="field">
<label>Proposed</label>
<input class="proposed" type="url" />
</div>
</div>
</div>
</div>
<div class="actions">
<div class="ui primary approve button" data-title="Recommended action" data-content="If you don't have a specific reason to not, click this." >
Yes, update
</div>
<div class="ui deny button">
No, leave it
</div>
</div>
</div>
<?php
$page->footer();
?>

View file

@ -172,38 +172,5 @@ $page->navigation();
</div>
</div>
<!-- Wishlist: Add a wish (fetch) -->
<div class="ui small modal wishlist-wish-fetch">
<div class="header">
Incorrect URL
</div>
<div class="content">
<div class="description">
<div class="ui header">Wish URLs</div>
<p>The URL you have entered does not seem quite right. Would you like to update it with the one I found?</p>
<div class="ui form urls">
<div class="field">
<label>Current</label>
<input class="current" type="url" readonly />
</div>
<div class="field">
<label>Proposed</label>
<input class="proposed" type="url" />
</div>
</div>
</div>
</div>
<div class="actions">
<div class="ui primary approve button">
Yes, update
</div>
<div class="ui deny button">
No, leave it
</div>
</div>
</div>
<?php
$page->footer();