perf: 审批消息预览图片

app/Http/Controllers/Api/ApproveController.php

@@ -985,6 +985,20 @@ class ApproveController extends AbstractController
             'comment_content' => $process['comment_contents']['content'] ?? '',
             'comment_pictures' => $process['comment_contents']['pictures'] ?? []
         ];
+        $thumb = null;
+        if ($type === 'approve_reviewer') {
+            $thumb = $process['var']['other'];
+        } elseif ($type === 'approve_comment_notifier') {
+            $thumb = $data['comment_pictures'] ? $data['comment_pictures'][0] : null;
+        }
+        if ($thumb && file_exists(public_path($thumb))) {
+            $imageSize = getimagesize(public_path($thumb));
+            $data['thumb'] = [
+                'url' => $thumb,
+                'width' => $imageSize[0],
+                'height' => $imageSize[1]
+            ];
+        }
         $msgAction = null;
         $msgData = [
             'type' => $type,

app/Models/WebSocketDialogMsg.php

@@ -149,11 +149,14 @@ class WebSocketDialogMsg extends AbstractModel
         if (!is_array($msg)) {
             $msg = Base::json2array($msg);
         }
-        if ($type === 'file') {
+        switch ($type) {
+            case 'file':
                 $msg['type'] = in_array($msg['ext'], ['jpg', 'jpeg', 'webp', 'png', 'gif']) ? 'img' : 'file';
                 $msg['path'] = Base::fillUrl($msg['path']);
                 $msg['thumb'] = Base::fillUrl($msg['thumb'] ?: Base::extIcon($msg['ext']));
-        } else if ($type === 'record') {
+                break;
+
+            case 'record':
                 $msg['path'] = Base::fillUrl($msg['path']);
                 $textUserid = is_array($msg['text_userid']) ? $msg['text_userid'] : [];
                 if (isset($msg['text_userid'])) {
@@ -162,6 +165,13 @@ class WebSocketDialogMsg extends AbstractModel
                 if ($msg['text'] && !in_array(Doo::userId(), $textUserid)) {
                     $msg['text'] = "";
                 }
+                break;
+
+            case 'template':
+                if ($msg['data']['thumb']) {
+                    $msg['data']['thumb']['url'] = Base::fillUrl($msg['data']['thumb']['url']);
+                }
+                break;
         }
         return $msg;
     }

resources/assets/js/pages/manage/components/DialogView/template/approve-comment-notifier.vue

@@ -5,7 +5,7 @@
             <p>{{$L('申请人')}}：<span class="mark-color">@{{ msg.data.nickname }}</span> {{ msg.data.department }}</p>
             <b>{{$L('评论内容')}}</b>
             <p>{{ msg.data.comment_content }}</p>
-            <p v-if="isPicture">[{{$L('图片')}}]</p>
+            <p v-if="msg.data.thumb" v-html="imageHtml(msg.data.thumb)"></p>
         </div>
         <div class="btn-raw no-dark-content">
             <button class="ivu-btn ivu-btn-grey">{{$L('查看详情')}}</button>
@@ -21,13 +21,18 @@ export default {
     data() {
         return {};
     },
-    computed: {
+    methods: {
-        isPicture() {
+        imageHtml(info) {
-            const {comment_pictures} = this.msg.data
+            const data = $A.imageRatioHandle({
-            return $A.isArray(comment_pictures) && comment_pictures.length > 0
+                src: info.url,
+                width: info.width,
+                height: info.height,
+                crops: {ratio: 3, percentage: '320x0'},
+                scaleSize: 220,
+            })
+            return `<img src="${data.src}" width="${data.width}" height="${data.height}" />`
+        }
     },
-    },
-    methods: {},
 }
 </script>
 

resources/assets/js/pages/manage/components/DialogView/template/approve-reviewer.vue

@@ -8,6 +8,7 @@
             <p>{{$L("开始时间")}}：{{ msg.data.start_time }} ({{ msg.data.start_day_of_week }})</p>
             <p>{{$L("结束时间")}}：{{ msg.data.end_time }} ({{ msg.data.end_day_of_week }})</p>
             <p>{{$L("事由")}}：{{ msg.data.description }}</p>
+            <p v-if="msg.data.thumb" v-html="imageHtml(msg.data.thumb)"></p>
         </div>
         <div class="btn-raw no-dark-content">
             <button v-if="msg.action === 'pass'" class="ivu-btn ivu-btn-grey">{{$L("已同意")}}</button>
@@ -29,7 +30,17 @@ export default {
     data() {
         return {};
     },
-    computed: {},
+    methods: {
-    methods: {},
+        imageHtml(info) {
+            const data = $A.imageRatioHandle({
+                src: info.url,
+                width: info.width,
+                height: info.height,
+                crops: {ratio: 3, percentage: '320x0'},
+                scaleSize: 220,
+            })
+            return `<img src="${data.src}" width="${data.width}" height="${data.height}" />`
+        }
+    },
 }
 </script>