animeic-cloud 1 月之前
父節點
當前提交
8c2a562565
共有 1 個文件被更改,包括 19 次插入37 次删除
  1. 19 37
      sku3d/sku3d/test/index.html

+ 19 - 37
sku3d/sku3d/test/index.html

@@ -42,8 +42,8 @@
             </div>
             <div class="card-body">
                 <div class="mb-3">
-                    <label for="imageUpload" class="form-label">选择图片</label>
-                    <input type="file" class="form-control" id="imageUpload" accept="image/*">
+                    <label for="imageUrl" class="form-label">图片URL</label>
+                    <input type="text" class="form-control" id="imageUrl" placeholder="输入图片URL">
                 </div>
                 <div class="mb-3">
                     <label for="nameCn" class="form-label">中文名称</label>
@@ -61,8 +61,8 @@
             </div>
             <div class="card-body">
                 <div class="mb-3">
-                    <label for="searchImageUpload" class="form-label">选择搜索图片</label>
-                    <input type="file" class="form-control" id="searchImageUpload" accept="image/*">
+                    <label for="searchImageUrl" class="form-label">搜索图片URL</label>
+                    <input type="text" class="form-control" id="searchImageUrl" placeholder="输入搜索图片URL">
                 </div>
                 <div id="searchPreview"></div>
                 <button class="btn btn-primary" onclick="searchImage()">搜索</button>
@@ -83,36 +83,25 @@
     <script>
         const baseUrl = 'http://47.96.90.34:18081/website';
 
-        // 预览上传图片
-        document.getElementById('imageUpload').addEventListener('change', function(e) {
-            previewImage(e.target.files[0], 'uploadPreview');
+        // 预览URL图片
+        document.getElementById('imageUrl').addEventListener('change', function(e) {
+            previewImageUrl(this.value, 'uploadPreview');
         });
 
-        document.getElementById('searchImageUpload').addEventListener('change', function(e) {
-            previewImage(e.target.files[0], 'searchPreview');
+        document.getElementById('searchImageUrl').addEventListener('change', function(e) {
+            previewImageUrl(this.value, 'searchPreview');
         });
 
-        function previewImage(file, previewId) {
-            if (!file) return;
-            
-            const reader = new FileReader();
-            reader.onload = function(e) {
-                const previewDiv = document.getElementById(previewId);
-                previewDiv.innerHTML = `<img src="${e.target.result}" class="preview-image">`;
-            }
-            reader.readAsDataURL(file);
-        }
-
-        async function uploadToServer(file) {
-            // 这里应该是上传到您的服务器或者华为云OBS的逻辑
-            // 为了演示,这里假设直接返回一个测试URL
-            return "https://sku3d-test.obs.cn-east-3.myhuaweicloud.com/tmp/a3.png";
+        function previewImageUrl(url, previewId) {
+            if (!url) return;
+            const previewDiv = document.getElementById(previewId);
+            previewDiv.innerHTML = `<img src="${url}" class="preview-image" onerror="this.style.display='none'">`;
         }
 
         async function uploadImage() {
-            const file = document.getElementById('imageUpload').files[0];
-            if (!file) {
-                alert('请选择图片');
+            const imageUrl = document.getElementById('imageUrl').value;
+            if (!imageUrl) {
+                alert('请输入图片URL');
                 return;
             }
 
@@ -123,10 +112,6 @@
             }
 
             try {
-                // 先上传图片到服务器获取URL
-                const imageUrl = await uploadToServer(file);
-                
-                // 创建图片记录
                 const response = await fetch(`${baseUrl}/image/create`, {
                     method: 'POST',
                     headers: {
@@ -151,9 +136,9 @@
         }
 
         async function searchImage() {
-            const file = document.getElementById('searchImageUpload').files[0];
-            if (!file) {
-                alert('请选择搜索图片');
+            const imageUrl = document.getElementById('searchImageUrl').value;
+            if (!imageUrl) {
+                alert('请输入搜索图片URL');
                 return;
             }
 
@@ -164,9 +149,6 @@
             }
 
             try {
-                // 先上传搜索图片获取URL
-                const imageUrl = await uploadToServer(file);
-
                 const response = await fetch(`${baseUrl}/image/fassi/list`, {
                     method: 'GET',
                     headers: {