feat: dev

src/components/Upload/Img.vue

@@ -15,7 +15,7 @@
       :accept="fileType.join(',')"
     >
       <template v-if="imageUrl">
-        <img :src="imageUrl" class="upload-image" />
+        <img :src="'/api' + imageUrl" class="upload-image" />
         <div class="upload-handle" @click.stop>
           <div v-if="!self_disabled" class="handle-icon" @click="editImg">
             <el-icon><Edit /></el-icon>
@@ -43,7 +43,7 @@
     <div class="el-upload__tip">
       <slot name="tip"></slot>
     </div>
-    <el-image-viewer v-if="imgViewVisible" :url-list="[imageUrl]" @close="imgViewVisible = false" />
+    <el-image-viewer v-if="imgViewVisible" :url-list="['/api' + imageUrl]" @close="imgViewVisible = false" />
   </div>
 </template>
 

src/views/demo/data/index.vue

@@ -2,7 +2,7 @@
   <div class="table-box">
     <ProTable ref="proTable" :columns="columns" row-key="id" :request-api="listDataApi" :init-param="initParam">
       <template #yuan="scope">
-        <el-image style="width: 100px" :src="getImageUrl(scope.row.url)" @click="markImg(scope.row)" />
+        <el-image style="width: 100px" :src="'/api' + scope.row.url" @click="markImg(scope.row)" />
       </template>
       <!-- 表格 header 按钮 -->
       <template #tableHeader="scope">
@@ -69,9 +69,9 @@ const { area, width, height, cover } = toRefs(state)
 
 // ProTable 实例
 const proTable = ref<ProTableInstance>()
-const getImageUrl = name => {
-  return new URL(name, import.meta.url).href
-}
+// const getImageUrl = name => {
+//   return new URL(name, import.meta.url).href
+// }
 
 const initParam = reactive({ type: 1 })
 // 删除数据管理信息
@@ -82,7 +82,7 @@ const deleteData = async (params: any) => {
 
 // 标注图片
 const markImg = data => {
-  state.cover = data.url
+  state.cover = '/api' + data.url
   // area 代表后端的传来的标注数据
   const area = []
   if (state.cover != '') {