perf: 审批评论优化显示缩略图

app/Http/Controllers/Api/ApproveController.php

@@ -1064,8 +1064,9 @@ class ApproveController extends AbstractController
             }
         }
         // 全局评论
+        unset($res['global_comment']);
         if (isset($res['global_comments'])) {
-            foreach ($res['global_comments'] as $k => &$globalComment) {
+            foreach ($res['global_comments'] as $k => $globalComment) {
                 $info = User::whereUserid($globalComment['user_id'])->first();
                 if (!$info) {
                     continue;
@@ -1073,6 +1074,8 @@ class ApproveController extends AbstractController
                 $res['global_comments'][$k]['userimg'] = User::getAvatar($info->userid, $info->userimg, $info->email, $info->nickname);
                 $res['global_comments'][$k]['nickname'] = $info->nickname;
             }
+        } else {
+            $res['global_comments'] = [];
         }
         $info = User::whereUserid($res['start_user_id'])->first();
         $res['userimg'] = $info ? User::getAvatar($info->userid, $info->userimg, $info->email, $info->nickname) : '';

resources/assets/js/components/ImgView.vue

@@ -1,5 +1,5 @@
 <template>
-    <img :src="srcValue" :alt="alt">
+    <img :src="srcValue" :alt="alt" @error.once="onError">
 </template>
 
 <script>
@@ -9,13 +9,20 @@ export default {
         src: {
             default: ""
         },
+        errorSrc: {
+            default: ""
+        },
         alt: {
             default: ""
         },
     },
     computed: {
-        srcValue() {
-            const {src} = this;
+        srcValue({src}) {
+            return this.toSrc(src)
+        }
+    },
+    methods: {
+        toSrc(src) {
             if (src.substring(0, 10) === "data:image" ||
                 src.substring(0, 2) === "//" ||
                 src.substring(0, 7) === "http://" ||
@@ -25,6 +32,13 @@ export default {
                 return src;
             }
             return $A.mainUrl(src)
+        },
+
+        onError(e) {
+            if (!this.errorSrc) {
+                return;
+            }
+            e.target.src = this.toSrc(this.errorSrc);
         }
     }
 }

resources/assets/js/pages/manage/approve/details.vue

@@ -143,7 +143,7 @@
                 </template>
             </Timeline>
 
-            <template v-if="datas.global_comment">
+            <template v-if="datas.global_comments">
                 <Divider/>
                 <h3 class="approve-details-subtitle">{{$L('全文评论')}}</h3>
                 <div class="approve-record-comment">
@@ -163,7 +163,7 @@
                                 </div>
                                 <div class="content" style="display: flex; gap: 10px;">
                                     <div v-for="(src,k) in getPictures(item.content)" :key="k"  @click="onViewPicture(src, item.content, 2)">
-                                        <ImgView :src="src" class="img-view"/>
+                                        <ImgView :src="getPictureThumb(src)" class="img-view"/>
                                     </div>
                                 </div>
                             </div>
@@ -478,6 +478,10 @@ export default {
                 return ''
             }
         },
+        // 获取图片缩略图
+        getPictureThumb(src) {
+            return src + '_thumb.' + src.split('.').pop()
+        },
         // 打开图片
         onViewPicture(currentUrl, datas, type) {
             if (type == 1) {