银豹系统商品管理加载图片辅助工具
// ==UserScript==
// @name 银豹商品图片加载工具
// @namespace https://beta59.pospal.cn/
// @version v1.0 2024-09-01
// @description 银豹系统商品管理加载图片辅助工具
// @author EBIC909
// @match https://beta59.pospal.cn/Product/Manage
// @icon https://beta59.pospal.cn/images/favicon.png
// ==/UserScript==
(function() {
'use strict';
function initBtn(){
const importButton = document.querySelector('.btnImport');
const newSpan = document.createElement('span');
newSpan.className = 'btnAddProduct btnBlue';
newSpan.textContent = '载入商品图';
newSpan.addEventListener('click', loadImages);
importButton.insertAdjacentElement('afterend', newSpan);
}
async function loadImages () {
let dataObject = getEmptyResultArr()
startLoading()
for (const id of Object.keys(dataObject)) {
dataObject[id] = await getProductImage(id);
}
stopLoading()
const rows = getTableTr();
rows.forEach(row => {
const trId = row.getAttribute('data');
let imgPath = dataObject[trId];
if (imgPath) {
let firstTd = row.querySelector('td');
let imgElement = document.createElement('img');
imgElement.src = imgPath;
imgElement.style.maxWidth = '300px';
imgElement.style.maxHeight = '300px';
imgElement.style.width = 'auto';
imgElement.style.height = 'auto';
imgElement.style.display = 'block';
imgElement.style.margin = '0 auto';
firstTd.innerHTML = '';
firstTd.appendChild(imgElement);
}
})
}
function getTableTr () {
const tbody = document.querySelector('#mainTable tbody');
const rows = tbody.querySelectorAll('tr');
return rows;
}
function getEmptyResultArr () {
const rows = getTableTr();
const dataObject = {};
rows.forEach(row => {
const dataValue = row.getAttribute('data');
if (dataValue) {
dataObject[dataValue] = "";
}
});
return dataObject;
}
async function getProductImage (productId) {
const responseInfo = await fetchProductById(productId)
if (!responseInfo.successed) {throw new Error(responseInfo)}
const productInfo = responseInfo.product
const defaultproductimage = productInfo.defaultproductimage
if (!defaultproductimage){throw new Error({productInfo, msg: "不存在商品图"})}
const path = "https://img.pospal.cn/" + defaultproductimage.path;
return path;
}
async function fetchProductById(productId) {
const url = 'https://beta59.pospal.cn/Product/FindProduct';
const postData = new URLSearchParams();
postData.append('productId', productId);
try {
const response = await fetch(url, {
method: 'POST',
headers: {
'Content-Type': 'application/x-www-form-urlencoded',
},
body: postData.toString(),
});
if (!response.ok) {
throw new Error(`HTTP error! status: ${response.status}`);
}
const jsonData = await response.json();
return jsonData;
} catch (error) {
console.error('Error fetching product:', error);
throw error;
}
}
const loadingDiv = document.createElement('div');
loadingDiv.id = 'loading';
loadingDiv.style.position = 'fixed';
loadingDiv.style.top = '0';
loadingDiv.style.left = '0';
loadingDiv.style.right = '0';
loadingDiv.style.bottom = '0';
loadingDiv.style.background = 'rgba(255, 255, 255, 0.8)';
loadingDiv.style.display = 'none';
loadingDiv.style.flexDirection = 'column';
loadingDiv.style.alignItems = 'center';
loadingDiv.style.justifyContent = 'center';
loadingDiv.style.zIndex = '1000';
const spinner = document.createElement('div');
spinner.style.border = '8px solid #f3f3f3'; // Light grey
spinner.style.borderTop = '8px solid #3498db'; // Blue
spinner.style.borderRadius = '50%';
spinner.style.width = '50px';
spinner.style.height = '50px';
spinner.style.marginTop = '10px';
spinner.style.animation = 'spin 1s linear infinite';
loadingDiv.appendChild(spinner);
loadingDiv.appendChild(document.createTextNode('加载中...'));
document.body.appendChild(loadingDiv);
const style = document.createElement('style');
style.innerHTML = `
@keyframes spin {
0% { transform: rotate(0deg); }
100% { transform: rotate(360deg); }
}
`;
document.head.appendChild(style);
function initLoad () {
initBtn()
}
function startLoading() {
loadingDiv.style.display = 'flex';
}
function stopLoading() {
loadingDiv.style.display = 'none';
}
window.addEventListener('load', function() {
initLoad()
})
})();