Merge pull request 'mark_4' (#88) from mark_4 into main
Reviewed-on: #88
This commit is contained in:
commit
35928618e9
10
header.php
10
header.php
|
|
@ -689,11 +689,11 @@ if ($_SESSION["userId"] <> "") {
|
|||
</div>
|
||||
</div>
|
||||
<script>
|
||||
let userDataGlobal = null;
|
||||
let globalQuantity = null;
|
||||
let globalProductId = null;
|
||||
let globalProduct = null;
|
||||
document.addEventListener("DOMContentLoaded", function() {
|
||||
let userDataGlobal = null;
|
||||
let globalQuantity = null;
|
||||
let globalProductId = null;
|
||||
let globalProduct = null;
|
||||
|
||||
|
||||
let globalVariation = null;
|
||||
|
|
@ -945,7 +945,7 @@ if ($_SESSION["userId"] <> "") {
|
|||
|
||||
|
||||
const firstImageUrl = getFirstImageUrl(productData?.images);
|
||||
console.log(productData)
|
||||
// console.log(productData)
|
||||
const productCon = document.createElement('div');
|
||||
productCon.className = 'product-con-wrap';
|
||||
productCon.innerHTML =
|
||||
|
|
|
|||
|
|
@ -66,7 +66,7 @@ if (isset($_GET['id'])) {
|
|||
<meta name="msapplication-TileImage" content="assets/images/favicon/favicon.png" />
|
||||
|
||||
<!-- css Icon Font -->
|
||||
<link rel="stylesheet" href="assets/css/vendor/ecicons.min.css" />
|
||||
<link rel="stylesheet" href="assets/css/vendor/ecicons.min.css" />
|
||||
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.5.2/css/all.min.css"
|
||||
integrity="sha512-SnH5WK+bZxgPHs44uWIX+LLJAJ9/2PkPKZ5QiAj6Ta86w+fsb2TkcmfRyVX3pBnMFcV7oQPJkl9QevSCWr3W6A=="
|
||||
crossorigin="anonymous" referrerpolicy="no-referrer" />
|
||||
|
|
@ -530,6 +530,7 @@ if (isset($_GET['id'])) {
|
|||
|
||||
function selectVariation(variation) {
|
||||
globalVariation = variation;
|
||||
displayReviews();
|
||||
console.log("Variation selected: ", variation);
|
||||
|
||||
document.getElementById("productDescription").innerHTML = variation
|
||||
|
|
@ -1623,10 +1624,13 @@ if (isset($_GET['id'])) {
|
|||
.comments_wrap {
|
||||
height: 100%;
|
||||
width: 100%;
|
||||
max-height: 800px;
|
||||
overflow-y: scroll;
|
||||
border-radius: 5px;
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
align-items: center;
|
||||
flex-direction: column;
|
||||
margin: 10px;
|
||||
|
||||
}
|
||||
|
|
@ -1651,7 +1655,7 @@ if (isset($_GET['id'])) {
|
|||
|
||||
.comment_card {
|
||||
height: auto;
|
||||
width: 100%;
|
||||
width: 90%;
|
||||
border-radius: 15px;
|
||||
display: flex;
|
||||
align-items: center;
|
||||
|
|
@ -1660,7 +1664,7 @@ if (isset($_GET['id'])) {
|
|||
border-radius: 10px;
|
||||
border: 1px solid #eee;
|
||||
flex-direction: column;
|
||||
|
||||
margin-top: 5px;
|
||||
}
|
||||
|
||||
.user_info {
|
||||
|
|
@ -1669,16 +1673,19 @@ if (isset($_GET['id'])) {
|
|||
|
||||
justify-content: space-between;
|
||||
align-items: center;
|
||||
flex-direction: row;
|
||||
flex-wrap: wrap;
|
||||
padding: 10px;
|
||||
}
|
||||
|
||||
|
||||
.user_info .left {
|
||||
display: flex;
|
||||
width: 70%;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
flex-direction: row;
|
||||
min-width: 300px;
|
||||
|
||||
}
|
||||
|
||||
.user_info .right {
|
||||
|
|
@ -1686,9 +1693,22 @@ if (isset($_GET['id'])) {
|
|||
|
||||
justify-content: flex-end;
|
||||
align-items: center;
|
||||
flex-direction: row;
|
||||
|
||||
}
|
||||
|
||||
@media (min-width:768px) {
|
||||
.user_info {
|
||||
flex-direction: row;
|
||||
|
||||
}
|
||||
|
||||
.user_name {
|
||||
font-size: 16px;
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
.user_img {
|
||||
height: 30px;
|
||||
width: 30px;
|
||||
|
|
@ -1697,7 +1717,7 @@ if (isset($_GET['id'])) {
|
|||
}
|
||||
|
||||
.user_name {
|
||||
font-size: 16px;
|
||||
font-size: 13px;
|
||||
color: #000;
|
||||
font-weight: bold;
|
||||
padding: 10px;
|
||||
|
|
@ -1714,11 +1734,41 @@ if (isset($_GET['id'])) {
|
|||
padding: 10px;
|
||||
}
|
||||
|
||||
.comment_details {}
|
||||
.comment_details {
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
.comment_text {}
|
||||
.comment_text {
|
||||
text-align: left;
|
||||
width: 100%;
|
||||
padding: 0px 10px;
|
||||
}
|
||||
|
||||
.comment_media {}
|
||||
.comment_media {
|
||||
display: flex;
|
||||
width: 100%;
|
||||
justify-content: flex-start;
|
||||
align-items: center;
|
||||
/* flex-direction: row;*/
|
||||
flex-wrap: wrap;
|
||||
}
|
||||
|
||||
.comment_media img {
|
||||
height: 150px;
|
||||
width: 150px;
|
||||
object-fit: cover;
|
||||
margin: 1px 2px;
|
||||
max-width: 200px;
|
||||
}
|
||||
|
||||
.comment_media video {
|
||||
height: 150px;
|
||||
width: 150px;
|
||||
object-fit: cover;
|
||||
margin: 1px 2px;
|
||||
max-width: 200px;
|
||||
|
||||
}
|
||||
|
||||
.comment_footer {
|
||||
width: 100%;
|
||||
|
|
@ -1729,11 +1779,12 @@ if (isset($_GET['id'])) {
|
|||
|
||||
<div class="rating_con">
|
||||
<div class="comments_con">
|
||||
<p class="comment_header">
|
||||
<p class="comment_header" id="comment_header">
|
||||
Total Reviews: 20
|
||||
</p>
|
||||
<ul class="comments_wrap">
|
||||
<li class="comment_card_wrap">
|
||||
<ul class="comments_wrap" id="comments_wrap">
|
||||
|
||||
<!-- <li class="comment_card_wrap">
|
||||
<div class="comment_card">
|
||||
<div class="user_info">
|
||||
<div class="left">
|
||||
|
|
@ -1776,7 +1827,7 @@ if (isset($_GET['id'])) {
|
|||
|
||||
</div>
|
||||
</div>
|
||||
</li>
|
||||
</li> -->
|
||||
</ul>
|
||||
</div>
|
||||
<!-- <div class="comment_footer">
|
||||
|
|
@ -1800,6 +1851,112 @@ if (isset($_GET['id'])) {
|
|||
|
||||
|
||||
<script>
|
||||
document.addEventListener("DOMContentLoaded", function() {
|
||||
displayReviews();
|
||||
async function fetchProductData() {
|
||||
|
||||
let response = null
|
||||
try {
|
||||
|
||||
response = await fetch(
|
||||
'https://api.obanana.shop/api/v1/products/' + globalProductId
|
||||
|
||||
);
|
||||
|
||||
|
||||
|
||||
const prodData = await response.json();
|
||||
return prodData;
|
||||
} catch (error) {
|
||||
console.error('Error fetching user data:', error);
|
||||
return null;
|
||||
}
|
||||
}
|
||||
async function displayReviews() {
|
||||
const prodData = await fetchProductData();
|
||||
const reviewList = document.getElementById('comments_wrap');
|
||||
const header = document.getElementById('comment_header');
|
||||
header.innerText = `Total Reviews: ${prodData?.ratings?.length??0}`
|
||||
|
||||
if (prodData?.ratings?.length > 0) {
|
||||
for (const rate of prodData?.ratings) {
|
||||
const li = document.createElement('li');
|
||||
li.classList.add('comment_card_wrap');
|
||||
|
||||
// Format the createdAt date
|
||||
const formattedDate = new Date(rate?.createdAt).toLocaleDateString(
|
||||
'en-US', {
|
||||
month: 'short',
|
||||
day: 'numeric',
|
||||
year: 'numeric',
|
||||
});
|
||||
|
||||
// Use customer image or fallback to vendor image
|
||||
const userImage = rate?.customer_id?.customer_image || rate?.vendor_id
|
||||
?.vendor_image || 'default-image-url.png';
|
||||
const userName = rate?.customer_id ?
|
||||
`${rate?.customer_id?.first_name} ${rate?.customer_id?.last_name}` :
|
||||
`${rate?.vendor_id?.first_name} ${rate?.vendor_id?.last_name}`;
|
||||
|
||||
// Generate media content
|
||||
let mediaContent = '';
|
||||
if (rate?.images?.length > 0) {
|
||||
for (const img of rate.images) {
|
||||
mediaContent +=
|
||||
`<img src="https://api.obanana.shop/images/storage/upload_ratings/${img}" alt=""/>`;
|
||||
}
|
||||
}
|
||||
if (rate?.videos?.length > 0) {
|
||||
for (const vid of rate.videos) {
|
||||
mediaContent +=
|
||||
`<video class="vid-prev" controls><source src="https://api.obanana.shop/images/storage/upload_ratings/${vid}" type="video/mp4"></video>`;
|
||||
}
|
||||
}
|
||||
|
||||
li.innerHTML = `
|
||||
<div class="comment_card">
|
||||
<div class="user_info">
|
||||
<div class="left">
|
||||
<img loading="lazy" class="user_img" src="${userImage}" alt="" />
|
||||
<p class="user_name">${userName}</p>
|
||||
<div class="rate_star">
|
||||
<i class="ecicon eci-star ${parseInt(rate?.rating) >= 1 ? 'fill' : ''}"></i>
|
||||
<i class="ecicon eci-star ${parseInt(rate?.rating) >= 2 ? 'fill' : ''}"></i>
|
||||
<i class="ecicon eci-star ${parseInt(rate?.rating) >= 3 ? 'fill' : ''}"></i>
|
||||
<i class="ecicon eci-star ${parseInt(rate?.rating) >= 4 ? 'fill' : ''}"></i>
|
||||
<i class="ecicon eci-star ${parseInt(rate?.rating) >= 5 ? 'fill' : ''}"></i>
|
||||
</div>
|
||||
</div>
|
||||
<div class="right">
|
||||
<p class="date_feedback">${formattedDate}</p>
|
||||
</div>
|
||||
</div>
|
||||
<div class="comment_details">
|
||||
<p class="comment_text">${rate?.comments ??''}</p>
|
||||
<div class="comment_media">
|
||||
${mediaContent}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
`;
|
||||
reviewList.appendChild(li);
|
||||
}
|
||||
} else {
|
||||
const li = document.createElement('li');
|
||||
li.classList.add('comment_card_wrap');
|
||||
|
||||
|
||||
li.innerHTML = `<p class="comment_text2">No reviews yet</p>`;
|
||||
reviewList.appendChild(li);
|
||||
|
||||
}
|
||||
}
|
||||
|
||||
})
|
||||
|
||||
|
||||
|
||||
|
||||
function openTab(tabName) {
|
||||
var i, tabContent, tabButtons;
|
||||
tabContent = document.getElementsByClassName("tab-content");
|
||||
|
|
|
|||
File diff suppressed because it is too large
Load Diff
2426
user-history.php
2426
user-history.php
File diff suppressed because it is too large
Load Diff
1544
user-profile.php
1544
user-profile.php
File diff suppressed because it is too large
Load Diff
Loading…
Reference in New Issue