File "manual-payments.ejs"
Full Path: /home/wiomgjqe/neduas.store/v3/partials/partials/public/partials/manual-payments.ejs
File size: 11.2 KB
MIME-type: text/html
Charset: utf-8
<html>
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<script
src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/js/bootstrap.bundle.min.js"
integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz"
crossorigin="anonymous"
></script>
<link
href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.3/dist/css/bootstrap.min.css"
rel="stylesheet"
integrity="sha384-QWTKZyjpPEjISv5WaRU9OFeRpok6YctnYmDr5pNlyT2bRjXh0JMhjY6hW+ALEwIH"
crossorigin="anonymous"
/>
<script src="https://cdn.jsdelivr.net/npm/bootstrap-sweetalert@1.0.1/dist/sweetalert.min.js"></script>
<link
href="https://cdn.jsdelivr.net/npm/bootstrap-sweetalert@1.0.1/dist/sweetalert.min.css"
rel="stylesheet"
/>
<title>Manual Payments</title>
<style>
#payment-ss {
display: none;
height: auto;
width: auto;
max-height: 100%;
max-width: 100%;
}
.loader {
width: 50px;
margin: 40px auto;
aspect-ratio: 1;
display: grid;
-webkit-mask: conic-gradient(from 15deg, #0000, #000);
animation: l26 1s infinite steps(12);
}
.loader,
.loader:before,
.loader:after {
background:
radial-gradient(closest-side at 50% 12.5%, #585858 96%, #0000) 50% 0/20%
80% repeat-y,
radial-gradient(closest-side at 12.5% 50%, #585858 96%, #0000) 0 50%/80%
20% repeat-x;
}
.loader:before,
.loader:after {
content: "";
grid-area: 1/1;
transform: rotate(30deg);
}
.loader:after {
transform: rotate(60deg);
}
@keyframes l26 {
100% {
transform: rotate(1turn);
}
}
</style>
</head>
<body class="bg-light">
<!-- Credits - https://bootstrapbrain.com/component/bootstrap-table-card-example/#preview -->
<section class="py-3 py-md-5">
<div class="container">
<div class="row justify-content-center">
<div class="col-12 col-lg-9 col-xl-8">
<div class="card widget-card border-light shadow-sm">
<div class="card-body p-4">
<h5 class="card-title widget-card-title mb-4">
Manual Payments
</h5>
<% if(payments.length){ %>
<div class="table-responsive">
<table
class="table table-striped bsb-table-xl align-middle m-0"
>
<thead>
<tr>
<th>#</th>
<th>Screenshot</th>
<th>User</th>
<th>Uploaded On</th>
</tr>
</thead>
<tbody>
<% payments.forEach(function(val, i){ %>
<tr id="ss-<%= val.id %>" class="ss-data-row ss-user-<%= val.userId %>">
<td class="index-num">
</td>
<td>
<button
class="btn m-1 badge rounded-pill bg-primary"
onclick="view_image('<%= val.username %>', '<%= val.firstName %>', '<%= val.id %>', '<%= val.userId %>')"
>
Click To view
</button>
</td>
<td>
<h6 class="mb-1"><%= val.username || val.firstName %></h6>
</td>
<td>
<span class="text-secondary fs-7"><% var day = new Date(val.createdAt) %>
<%= day.toDateString() + " At " + day.toLocaleTimeString() %></span>
</td>
</tr>
<% }) %>
</tbody>
</table>
</div>
<% } else { %>
<p class="fs-6">You Don't have any manual payments yet...</p>
<% } %>
</div>
</div>
</div>
</div>
</div>
</section>
<button
id="hidden-model-button"
class="btn d-none"
data-bs-toggle="modal"
data-bs-target="#mainBsModal"
>
model
</button>
<div
class="modal fade"
id="mainBsModal"
tabindex="-1"
aria-labelledby="mainBsModalLabel"
aria-hidden="true"
>
<div class="modal-dialog modal-dialog-centered">
<div class="modal-content">
<div class="modal-header">
<h1 class="modal-title fs-5" id="mainBsModalLabel">
Payment Image
</h1>
<button
type="button"
class="btn-close"
onclick="closeModal('close')"
></button>
<button
id="close-model-btn"
class="btn d-none"
data-bs-dismiss="modal"
aria-label="Close"
></button>
</div>
<div class="modal-body">
<div id="loader" class="loader"></div>
<img id="payment-ss" alt="Screenshot" />
</div>
<div class="modal-footer d-flex">
<button
type="button"
class="btn btn-danger text-white"
onclick="closeModal('block')"
>
∅ Block
</button>
<button
type="button"
class="btn btn-warning text-white"
onclick="closeModal('reject')"
>
✖ Reject
</button>
<button
type="button"
class="btn btn-success text-white"
onclick="closeModal('accept')"
>
✔ Accept
</button>
</div>
</div>
</div>
</div>
<script>
var query = window.location.search
.substring(1)
.split("&")
.map((v) => v.split("="));
var path = {
location: window.location.origin,
query: Object.fromEntries(query)
};
var currUser = null;
window.onload = setIndexes;
function setIndexes() {
var tRows = document.querySelectorAll("tr .index-num");
tRows.forEach((el, i) => {
el.innerHTML = `<h6 class="mb-1">${i + 1}</h6>`;
});
}
function view_image(username, first_name, id, userId) {
document.querySelector("#hidden-model-button").click();
var loader = document.querySelector("#loader");
var image = document.querySelector("#payment-ss");
currUser = { username, first_name, id, userId };
fetch(`${path.location}/v2?id=${path.query.id}&q=payment-screenshot&imageId=${id}`)
.then((res) => res.json())
.then((data) => {
if (data && data.status == 1) {
loader.style.display = "none";
image.setAttribute("src", data.message);
image.style.display = "block";
} else {
swal(
{
title: "Error",
text: data.message,
imageUrl:
"https://www.freeiconspng.com/uploads/high-resolution-photo-of-the-red-exclamation-point-error-23.png"
},
function () {
closeModal("close");
}
);
}
})
.catch((err) => {
console.error(err);
swal(
{
title: "Error",
text: "An error occurred while fetching image.\nPlease try again later",
imageUrl:
"https://www.freeiconspng.com/uploads/high-resolution-photo-of-the-red-exclamation-point-error-23.png"
},
function () {
closeModal("close");
}
);
});
}
function closeModal(type) {
var loader = document.querySelector("#loader");
var image = document.querySelector("#payment-ss");
document.querySelector("#close-model-btn").click();
loader.style.display = "";
image.removeAttribute("src");
image.style.display = "none";
if (type == "block") {
swal(
{
title: "Block User ?",
text: `Are you sure you want to block this user with ${
currUser.username ? "username" : "name"
} of ${currUser.username && "@"}${
currUser?.username || currUser.first_name
}\nThis action will delete all the images uploaded by this user and this user won't be able to use your bot again`,
type: "info",
showCancelButton: true,
closeOnConfirm: false,
showLoaderOnConfirm: true
},
handleAction("block")
);
} else if (type == "reject") {
swal(
{
title: "Reject User Payment ?",
text: `Are you sure you want to reject payment of this user with ${
currUser.username ? "username" : "name"
} of ${currUser.username && "@"}${
currUser?.username || currUser.first_name
}\nThis action will delete the image uploaded by this user`,
type: "info",
showCancelButton: true,
closeOnConfirm: false,
showLoaderOnConfirm: true
},
handleAction("reject")
);
} else if (type == "accept") {
swal(
{
title: "Accept User Payment",
text: `You are accepting payment of this user with ${
currUser.username ? "username" : "name"
} of ${currUser.username && "@"}${
currUser?.username || currUser.first_name
}\nEnter the amount below to credit to user's wallet`,
type: "input",
showCancelButton: true,
closeOnConfirm: false,
inputPlaceholder: "100"
},
function (inputValue) {
if (!Number(inputValue) || inputValue.trim() == "") {
swal.showInputError("You need to Enter a valid Number!");
return false;
}
swal(
{
title: "Add User Balance ?",
text: `Are you sure you want to add ${inputValue} 💎 to this user wallet with ${
currUser.username ? "username" : "name"
} of ${currUser.username && "@"}${
currUser?.username || currUser.first_name
}`,
type: "info",
showCancelButton: true,
closeOnConfirm: false,
showLoaderOnConfirm: true
},
handleAction("accept", inputValue)
);
}
);
document
.querySelector(".sweet-alert.show-input .form-group input")
.setAttribute("type", "number");
}
}
function handleAction(type, amount) {
return () => {
fetch(`${path.location}/v2?id=${path.query.id}&page=manual_payments&imageId=${currUser.id}&userId=${currUser.userId}&type=${type}${amount ? "&amount=" + amount : ""}`, {
method: "post"
})
.then((r) => r.json())
.then((data) => {
if (data.status == 1) {
if(type == "reject" || type == "accept"){
document.querySelector(`#ss-${currUser.id}`).remove()
}
else if(type == "block"){
document.querySelectorAll(`.ss-user-${currUser.userId}`).forEach((el)=>{
el.remove()
})
}
}
swal({
title: data.status == 1 ? "Success" : "Error",
text: data.message,
imageUrl:
data.status == 1
? "https://www.freeiconspng.com/uploads/success-icon-10.png"
: "https://www.freeiconspng.com/uploads/high-resolution-photo-of-the-red-exclamation-point-error-23.png"
});
if(currUser) currUser = null;
})
.catch((err) => {
console.error(err);
swal({
title: "Error",
text: `An Error occurred while ${type}ing this user ${
type != "block" && "payment"
}`,
imageUrl:
"https://www.freeiconspng.com/uploads/high-resolution-photo-of-the-red-exclamation-point-error-23.png"
});
});
};
}
</script>
</body>
</html>