chore(api): 适配“图片上传和获取”接口

src/views/components/FileProps.vue

@@ -45,7 +45,7 @@
           </div>
           <div class="form-item">
             <label>{{$t('背景图片')}}</label>
-            <t-upload class="ml-8" v-model="data.background" action="/api/image/upload" theme="image" accept="image/*" :headers="headers" :data="updataData" :auto-upload="true" :before-upload="beforeUpload" :upload-all-files-in-one-request="false" @success="fileSuccessed" @remove="fileRemoved"></t-upload>
+            <t-upload class="ml-8" v-model="data.background" :action="`${axios.defaults.baseURL}/api/image/upload`" theme="image" accept="image/*" :headers="headers" :data="updataData" :auto-upload="true" :before-upload="beforeUpload" :upload-all-files-in-one-request="false" @success="fileSuccessed" @remove="fileRemoved"></t-upload>
           </div>
           <div class="form-item">
             <label>{{$t('主题')}}</label>
@@ -205,6 +205,7 @@
 
 <script lang="ts" setup>
 import { onMounted, reactive, onUnmounted, getCurrentInstance } from 'vue';
+import axios from 'axios';
 import { useUser } from '@/services/user';
 // import { getCookie } from '@/services/cookie';
 // import ElementTree from './ElementTree.vue';
@@ -226,7 +227,8 @@ const { extendData, setExtendData } = useExtendData();
 const { proxy } = getCurrentInstance();
 const $t = proxy.$t
 const headers = {
-  Authorization: 'Bearer ' + (getToken() || ''),
+  // Authorization: 'Bearer ' + (getToken() || ''),
+  Authorization: 'Bearer ' + import.meta.env.VITE_TEMP_TOKEN,
 };
 const updataData = { directory: '/大屏/图片/默认' };
 
@@ -382,7 +384,7 @@ const beforeUpload = (file: any) => {
 
 const fileSuccessed = async (content: any) => {
   // meta2d.store.patchFlagsBackground = true;
-  meta2d.setBackgroundImage(content.response.url);
+  meta2d.setBackgroundImage(content.response.data?.url);
   setTimeout(() => {
     // meta2d.store.patchFlagsBackground = true;
     meta2d.render();

src/views/components/Graphics.vue

@@ -118,7 +118,7 @@
                 <t-space size="small" @click.stop tabindex="0">
                   <t-upload
                     v-if="item.canEdited && activedGroup === '图片'"
-                    action="/api/image/upload"
+                    :action="`${axios.defaults.baseURL}/api/image/upload`"
                     accept="image/*"
                     :headers="headers"
                     :data="{
@@ -178,7 +178,7 @@
                 <!-- img 路径这样拼凑避免更新后路径一致图片使用缓存不更新 -->
                   <t-image
                     v-if="!elem.svg && elem.image"
-                    :src="elem.image +(activeAssets === 'user'?'':('?' + Math.random()))"
+                    :src="getImgSrc(elem)"
                     :lazy="true"
                     fit="contain"
                     @load="loadImage(elem)"
@@ -636,7 +636,8 @@ const search = ref('');
 const loading = ref(false);
 
 const headers = {
-  Authorization: 'Bearer ' + (getToken() || ''),
+  // Authorization: 'Bearer ' + (getToken() || ''),
+  Authorization: 'Bearer ' + import.meta.env.VITE_TEMP_TOKEN,
 };
 const updataData = { directory: '/大屏/默认' };
 let lastName = '方案';
@@ -942,14 +943,14 @@ const getCollectionImageList = async (name?: string, collection?: string, system
 };
 
 const getImageList = async () => {
-  let ret: { list: any[] } = await axios.post('/api/directory/list', {
+  let ret: any[] = await axios.post('/api/directory/list', {
     fullpath: '/大屏/图片',
   });
   if (!ret) {
     return [];
   }
   let list = [];
-  for (let i of ret.list) {
+  for (let i of ret) {
     if (i.fullpath.split('/').length === 4) {
       //不取当前文件夹
       list.push(i);
@@ -958,20 +959,22 @@ const getImageList = async () => {
   return await Promise.all(
     list.map(async (item) => {
       let secondDir = item.fullpath.split('/');
-      const _ret: { list: any[]; total: number } = await axios.post(
-        '/api/file/list',
+      const _ret: { records: any[]; total: number } = await axios.post(
+        '/api/image/list',
         {
-          type: '图片',
+          type: 1, // 1 表示 图片
           directory: item.fullpath,
+          pageIndex: 1,
+          pageSize: 100,
         },
         {
-          params: {
-            current: 1,
-            pageSize: 100,
-          },
+          // params: {
+          //   current: 1,
+          //   pageSize: 100,
+          // },
         }
       );
-      let list = _ret.list.map((_item) => {
+      let list = _ret.records.map((_item) => {
         return {
           ..._item,
           image: _item.url || `/file${_item.filename}`,
@@ -2225,6 +2228,10 @@ const onFold = () => {
   }
 };
 
+const getImgSrc = (elem) => {
+  return import.meta.env.VITE_IMG_API + '/' + elem.image + (activeAssets.value === 'user' ? '' : ('?' + Math.random()))
+}
+
 const loadImage = (elem: any) => {
   if (elem.isSvg) {
     makeSvg(elem);
@@ -2309,13 +2316,13 @@ const fileSuccessed = async (content: any) => {
   //   uploadGroup.list.push(c);
   // } else if (activedGroup.value === '图片') {
     uploadGroup.list.push({
-      ...content.response,
+      ...content.response.data,
       image:
-        content.response.url ||
-        content.response.metadata.url ||
+        content.response.data?.url ||
+        content.response.metadata?.url ||
         `/file${content.response.filename}`,
       visible: true,
-      folder: content.response.directory || content.response.metadata.directory,
+      folder: content.response.data?.directory || content.response.metadata?.directory,
     });
   // }
   MessagePlugin.success('上传成功');

src/views/components/PenProps.vue

@@ -176,7 +176,7 @@
                 <t-upload
                   ref="childUploadRef"
                   v-model="data.childImages"
-                  action="/api/image/upload"
+                  :action="`${axios.defaults.baseURL}/api/image/upload`"
                   theme="image"
                   accept="image/*"
                   :headers="headers"
@@ -947,7 +947,7 @@
                   <t-upload
                     ref="uploadRef"
                     v-model="data.images"
-                    action="/api/image/upload"
+                    :action="`${axios.defaults.baseURL}/api/image/upload`"
                     theme="image"
                     accept="image/*"
                     :headers="headers"
@@ -1272,6 +1272,7 @@
 
 <script lang="ts" setup>
 import { onBeforeMount, onUnmounted, reactive, ref, watch, computed, getCurrentInstance } from 'vue';
+import axios from 'axios';
 
 import CodeEditor from './common/CodeEditor.vue';
 import Iconfonts from './common/Iconfonts.vue';
@@ -1297,7 +1298,8 @@ import { getToken  } from '@le5le/auth-token';
 
 const { user } = useUser();
 const headers = {
-  Authorization: 'Bearer ' + (getToken() || ''),
+  // Authorization: 'Bearer ' + (getToken() || ''),
+  Authorization: 'Bearer ' + import.meta.env.VITE_TEMP_TOKEN,
 };
 const updataData = { 
   directory: '/大屏/图片/默认' ,
@@ -1649,7 +1651,7 @@ const fileSuccessed = async (content: any) => {
   // meta2d.store.patchFlagsBackground = true;
   // meta2d.setBackgroundImage(content.response.url);
   // meta2d.store.patchFlagsBackground = true;
-  data.pen.image = content.response.url || `/file${content.response.filename}`;
+  data.pen.image = content.response.data?.url || `/file${content.response.filename}`;
   updatePen(data.pen, 'image');
   meta2d.canvas.canvasImage.init();
   meta2d.canvas.canvasImageBottom.init();
@@ -1666,7 +1668,7 @@ const fileRemoved = () => {
 };
 
 const fileChildSuccessed = async (content: any) => {
-  data.childPen.image = content.response.url || `/file${content.response.filename}`;
+  data.childPen.image = content.response.data?.url || `/file${content.response.filename}`;
   updatePen(data.childPen, 'image');
   meta2d.canvas.canvasImage.init();
   meta2d.canvas.canvasImageBottom.init();