import wixData from 'wix-data'; import wixLocation from 'wix-location'; import wixUsers from 'wix-users'; import {uploadFile} from 'wix-storage'; $w.onReady(function () { // 获取当前产品ID const productId = wixLocation.query.productId; if (productId) { loadProductImages(productId); setupUploadButton(productId); } }); // 加载产品相关图片 function loadProductImages(productId) { $w("#imageRepeater").data = []; // 清空重复器 wixData.query("ProductImages") .eq("productId", productId) .ascending("order") .find() .then(results => { if (results.items.length > 0) { $w("#imageRepeater").data = results.items; $w("#imageRepeater").forEachItem(($item, itemData) => { $item("#imageComponent").src = itemData.image; $item("#captionText").text = itemData.caption; }); } else { $w("#noImagesMessage").show(); } }) .catch(error => { console.error("Error loading images:", error); $w("#errorMessage").show(); }); } // 设置上传按钮功能 function setupUploadButton(productId) { // 检查用户是否已登录(只有管理员才能上传) wixUsers.currentUser.getRoles() .then(roles => { const isAdmin = roles.some(role => role.name === "Admin"); if (isAdmin) { $w("#uploadButton").show(); $w("#uploadButton").onClick(() => { uploadNewImage(productId); }); } }); } // 处理图片上传 async function uploadNewImage(productId) { try { // 打开文件选择对话框 const file = await uploadFile({ mediaType: "image", multiple: false, maxSize: 10 // MB }); if (file) { // 获取图片描述 const caption = await prompt("请输入图片描述:"); // 保存到数据库 const newImageData = { productId: productId, image: file.url, caption: caption, order: 0 // 默认排序 }; await wixData.insert("ProductImages", newImageData); loadProductImages(productId); // 重新加载图片 $w("#successMessage").show().then(() => setTimeout(() => $w("#successMessage").hide(), 3000)); } } catch (error) { console.error("Upload error:", error); $w("#uploadError").show(); } } // 辅助函数: 提示用户输入 function prompt(message) { return new Promise((resolve) => { $w("#promptDialog").show(); $w("#promptMessage").text = message; $w("#promptConfirm").onClick(() => { resolve($w("#promptInput").value); $w("#promptDialog").hide(); }); $w("#promptCancel").onClick(() => { resolve(null); $w("#promptDialog").hide(); }); }); }

top of page

アカウント

コレクション

ギャラリー