CMXX - Products_media
This commit is contained in:
158
product.php
158
product.php
@@ -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.'
|
||||
|
||||
Reference in New Issue
Block a user