feat: 支持图片上传并显示

be/app/api/v1/anno.py

@@ -7,7 +7,7 @@ import json
 import os
 import zipfile
 
-from ...libs.tools import read_txt_file, write_json, read_json_file, make_dir
+from ...libs.tools import read_file, write_json, read_json_file, make_dir
 
 api = RedPrint('anno')
 
@@ -59,7 +59,7 @@ def query_anno():
         file_name = request.args.get("fileName").strip()
 
         file_path = PROJECTS + '/' + project_name + '/' + file_name
-        file_content = read_txt_file(file_path)
+        file_content = read_file(file_path)
 
         anno_output_path = ANNO_OUTPUT_PATH.format(project_name)
         output_anno = OutputAnno()

be/app/api/v1/project.py

@@ -53,7 +53,7 @@ def get_zipped_data():
             folder_path = target_path + '/' + item
             if os.path.isdir(folder_path):
                 for file in os.listdir(folder_path):
-                    if file.split('.')[-1] == 'txt':
+                    if file.split('.')[-1] in ['txt', 'jpg', 'png']:
                         shutil.copy(folder_path + '/' + file, folder_path + '/../')
                         # Here  to deal with chinese encode in module zipfile and rarfile
                         if file_type == 'zip':

be/app/libs/tools.py

@@ -8,6 +8,7 @@ import tarfile
 from os import rename
 from os import listdir
 from shutil import move
+import base64
 
 
 def make_dir(path):
@@ -29,6 +30,20 @@ def read_json_file(json_file_name):
         data = json.load(f)
     return data
 
+# 自适配读取文件
+def read_file(file_path):
+    ext = file_path.split('.')[-1]
+    if ext in ['jpg', 'png']:
+        return read_img_file(file_path)
+    elif ext in ['txt']:
+        return read_txt_file(file_path)
+    return ''
+
+# 读取img文件
+def read_img_file(file_path):
+    with open(file_path, 'rb') as f:
+        data = f.read()
+    return base64.b64encode(data).decode("ascii")
 
 # 读取txt文件
 def read_txt_file(file_path):

fe/config/index.js

@@ -12,8 +12,8 @@ module.exports = {
     assetsPublicPath: '/',
     proxyTable: {
       '/v1/': {
-        // target: 'http://localhost:9060/',
+        target: 'http://localhost:9060/',
-        target: 'https://tekii.cn/',
+        // target: 'https://tekii.cn/',
       }
     },
 

fe/src/components/NER/index.vue

@@ -106,6 +106,9 @@
               <br v-if="word === '\n'" :key="idx"/>
             </template>
           </div>
+          <div v-if="projectType === '图片点标注'">
+            <img :src="nowText" class="anno-img">
+          </div>
         </div>
         <div class="page-btn-box">
           <button class="page-btn" @click="changeIdx(-1, $event)" @mouseover="setFocus('page-up')" @mouseleave="setFocus('')">上一个 {{ fastTypeKey['page-up'] ? `【${fastTypeKey['page-up']}】` : '' }}</button>
@@ -337,6 +340,9 @@ export default {
             that.$set(that.nersCache, that.nowFile, [...that.ners])
             that.flushWordsType()
           }
+          if (info.fileContent[0] !== 'd') {
+            info.fileContent = 'data:image/jpeg;base64,' + info.fileContent
+          }
           // 更新文件的文本信息
           that.$set(that.textDic, newFile, info.fileContent)
           that.nowText = that.textDic[newFile]
@@ -1048,6 +1054,9 @@ export default {
   top: -9px;
   right: -9px;
 }
+.anno-img {
+  width: 100%;
+}
 @media only screen and (max-width: 800px) {
   .out-title {
     text-align: right !important;

fe/src/components/home/index.vue

@@ -27,6 +27,7 @@
           <select class="type-input" name="type" @change="setType" :value="projectType">
             <option value ="命名实体识别">命名实体识别</option>
             <option value ="文本分类">文本分类</option>
+            <option value ="图片点标注">图片点标注</option>
           </select>
         </p>
         <div class="title">