CMXX - Products_media

This commit is contained in:
“VeLiTi”
2025-02-06 18:46:33 +01:00
parent 07b5578895
commit 2072250072
6 changed files with 379 additions and 2 deletions

View File

@@ -31,6 +31,7 @@ $update_allowed = isAllowed($page ,$_SESSION['profile'],$_SESSION['permission'],
$update_allowed_edit = isAllowed($page_manage ,$_SESSION['profile'],$_SESSION['permission'],'U');
$delete_allowed = isAllowed($page_manage ,$_SESSION['profile'],$_SESSION['permission'],'D');
$create_allowed = isAllowed($page_manage ,$_SESSION['profile'],$_SESSION['permission'],'C');
$media_update = isAllowed('products_media' ,$_SESSION['profile'],$_SESSION['permission'],'U');
//GET Details from URL
$GET_VALUES = urlGETdetails($_GET) ?? '';
@@ -74,6 +75,58 @@ $product['categories'] = ioServer($api_url,'');
//Decode Payload
if (!empty($product['categories'] )){$product['categories'] = json_decode($product['categories'] ,true);}else{$product['categories'] = null;}
//GET RELATED MEDIA
$api_url = '/v2/products_media/product_id='.$_GET['rowID'];
$products_media = ioServer($api_url,'');
//Decode Payload
if (!empty($products_media)){$products_media = json_decode($products_media ,true);}else{$products_media = null;}
if ($media_update == 1){
//GET ALL MEDIA
$api_url = '/v2/media/';
$media_responses_all = ioServer($api_url,'');
//Decode Payload
if (!empty($media_responses_all)){$media_responses_all = json_decode($media_responses_all,true);}else{$media_responses_all = null;}
}
if ($media_update == 1 && (isset($_POST['media']) || isset($_POST['delete']))){
//CHECK IF MEDIA IS AN ARRAY
if (isset($_POST['media']) && is_array($_POST['media'])){
foreach($_POST['media'] as $p_media){
//GET ALL POST DATA
$payload = json_encode(array("product_id" => $_POST['product_id'], "media_id" => $p_media), JSON_UNESCAPED_UNICODE);
//API call
$responses = ioServer('/v2/products_media', $payload);
}
if ($responses === 'NOK'){
} else {
header('Location: index.php?page=product&success_msg=2&rowID='.$_GET['rowID'].'');
exit;
}
}
if (isset($_POST['delete'])){
//GET ALL POST DATA
$payload = json_encode($_POST, JSON_UNESCAPED_UNICODE);
//API call
$responses = ioServer('/v2/products_media', $payload);
// Redirect and delete product
if ($responses === 'NOK'){
} else {
header('Location: index.php?page=product&success_msg=2&rowID='.$_GET['rowID'].'');
exit;
}
}
}
//------------------------------
// Variables
//------------------------------
@@ -352,6 +405,111 @@ $view .= '<div class="content-block">
</div>
';
$view .= '
<div class="content-block">
<h2 class="responsive-width-100">'.($products_media_header ?? 'Product media').' <button class="btn2" onClick="openDialog()" > + </button><input form="pictures" class="btn2" type="submit" name="update" value="Save" class="btn"></h2>
<div id="selectedImages">';
if(!empty($products_media)){
foreach ($products_media as $prod_media){
$view .= '
<div class="image-container" style="display: inline-block; position: relative; margin: 5px;">
<img src="'.$prod_media['full_path'].'" style="max-width: 100px; margin: 5px;">
<form method="POST" action="" style="position: absolute; top: 0; right: 0;">
<input type="hidden" name="rowID" value="'.$prod_media['rowID'].'">
<input type="hidden" name="product_id" value="'.$_GET['rowID'].'">
<input type="hidden" name="delete" value="delete">
<button type="submit" style="background-color: red; color: white; border: none; border-radius: 50%; width: 20px; height: 20px; padding: 0; font-size: 12px; cursor: pointer;">×</button>
</form>
</div>';
}
}
$view .='</div>
<form action="" id="pictures" method="post">
<input type="hidden" form="pictures" name="product_id" value="'.$_GET['rowID'].'">
<div id="selectedImagesID"></div>
</form>
<div id="selectedImagesPreview"></div>
</div>
</div>
<dialog id="imageSelector">
<h3>'.(isset($image_select) ? ${$image_select} : 'Select Images').'</h3>
<div id="imageGrid">';
if ($media_update == 1){
foreach ($media_responses_all as $media_response){
$view .= '
<img src="'.$media_response['full_path'].'" id="'.$media_response['rowID'].'" onclick="toggleImage(this)" style="width: 25%;cursor: pointer">
';
}
}
$view .= '
</div>
<br>
<button onclick="confirmSelection()">Confirm Selection</button>
<button onclick="closeImageSelector()">Cancel</button>
</dialog>
<script>
const dialog = document.getElementById(\'imageSelector\');
const openButton = document.getElementById(\'openSelectorBtn\');
const imageArrayInput = document.getElementById(\'imageArray\');
const previewContainer = document.getElementById(\'selectedImagesPreview\');
const previewID = document.getElementById(\'selectedImagesID\');
function openDialog(){
dialog.showModal();
document.querySelectorAll(\'#imageGrid img\').forEach(img => {img.style.border = \'none\';});
}
function toggleImage(img) {
if (img.style.border === \'2px solid blue\') {
img.style.border = \'none\';
} else {
img.style.border = \'2px solid blue\';
}
}
function confirmSelection() {
// Get all selected images with their details
const selectedImages = Array.from(document.querySelectorAll(\'#imageGrid img[style*="blue"]\'))
.map(img => ({
id: img.id,
src: img.src
}));
// Update preview
let preview = \'\';
previewContainer.innerHTML = \'\';
selectedImages.forEach(image => {
const previewImg = document.createElement(\'img\');
previewImg.src = image.src;
previewImg.id = image.id;
previewImg.style.maxWidth = \'100px\';
previewImg.style.margin = \'5px\';
previewContainer.appendChild(previewImg);
preview += \'<input name="media[]" form="pictures" type="hidden" value="\'+image.id+\'">\';
});
previewID.innerHTML = preview;
dialog.close();
}
function closeImageSelector() {
dialog.close();
}
</script>
';
$view .= '<div class="content-block">
<div class="block-header">
<i class="fa-solid fa-bars fa-sm"></i>'.$tab3.'