后端更改存储结构前端数据处理进行修改

app/src/App.vue

@@ -269,10 +269,10 @@
       <el-input v-model="search" style="width: 150px; margin-right: 10px" placeholder="请输入文件名" clearable></el-input>
       <el-button type="primary" :icon="Search" @click="searchTemplate" plain>搜索</el-button>
       <div class="demo-image">
-        <div v-for="name in names" :key="name.id" class="block">
-          <span class="demonstration">{{ name[1].id }}</span>
-          <el-image style="width: 100px; height: 100px" :src="name[1].url" @click="importFromJsonServer(name[1].id)" />
-          <el-button type="danger" @click="DeleteeFromJsonServer(name[1].id)" plain>删除</el-button>
+        <div v-for="name in names" :key="name" class="block">
+          <span class="demonstration">{{ name[0] }}</span>
+          <el-image style="width: 100px; height: 100px" :src="name[1]" @click="importFromJsonServer(name[0])" />
+          <el-button type="danger" @click="DeleteeFromJsonServer(name[0])" plain>删除</el-button>
         </div>
       </div>
     </el-dialog>
@@ -550,13 +550,14 @@ const importFromJsonServer = async (itemId) => {
         'Content-Type': 'application/json'
       }
     })
-    if (!response.ok) throw new Error('Failed to fetch JSON data')
-    const jsonData = await response.json()
-    const jsonObject = JSON.parse(jsonData.data)
-    console.log(jsonObject.data)
-    app.setData(jsonObject.data)
-    filelist.value = false
-    ElNotification.success('导入成功')
+    if (response.ok) {
+      const jsonData = await response.json()
+      // const jsonObject = JSON.parse(jsonData.data)
+      console.log(jsonData.data.data)
+      app.setData(jsonData.data.data)
+      filelist.value = false
+      ElNotification.success('导入成功')
+    }
   } catch (error) {
     ElNotification.success('导入失败')
     console.log(error)
@@ -577,16 +578,17 @@ const searchTemplate = async () => {
       const jsonData = await response.json()
       if (jsonData.code === 200) {
         names.clear()
-        for (const [key, value] of Object.entries(jsonData.data)) {
-          const json = JSON.parse(value).data.elements;
-
-          const url = json.length === 2 && json[0].url ? json[0].url : defaultUrl;
-
-          names.set(key, { id: key, url });
+        const defaultUrl = 'https://erp.baozhida.cn/assets/icon-91f5d92f.png';
+        for (let index = 0; index < jsonData.data.length; index++) {
+          if (jsonData.data[index].data.elements.length === 2) {
+            names.set(jsonData.data[index].name, jsonData.data[index].data.elements[0].url)
+          } else {
+            names.set(jsonData.data[index].name, defaultUrl)
+          }
         }
         ElNotification.success('搜索成功')
-        search.value=null
-      }else{
+        search.value = null
+      } else {
         ElNotification.warning('文件不存在')
       }
     }
@@ -694,18 +696,23 @@ const templateItems = async () => {
     });
 
     if (response.ok) {
-      const jsonData = await response.json();
-
-      for (const [key, value] of Object.entries(jsonData.data)) {
-        const json = JSON.parse(value).data.elements;
-
-        const url = json.length === 2 && json[0].url ? json[0].url : defaultUrl;
-
-        names.set(key, { id: key, url });
+      const jsonData = await response.json()
+      if (jsonData.code === 200) {
+        names.clear()
+        const defaultUrl = 'https://erp.baozhida.cn/assets/icon-91f5d92f.png';
+        for (let index = 0; index < jsonData.data.length; index++) {
+          if (jsonData.data[index].data.elements.length === 2) {
+            names.set(jsonData.data[index].name, jsonData.data[index].data.elements[0].url)
+          } else {
+            names.set(jsonData.data[index].name, defaultUrl)
+          }
+        }
+        ElNotification.success('获取成功')
+        search.value = null
+      } else {
+        ElNotification.warning('文件不存在')
       }
-      // console.log([...names.values()]); // 打印Map的值列表以查看结果
     }
-    ElNotification.success('获取成功')
   } catch (error) {
     ElNotification.warning('获取失败')
     console.log(error);