feat : 优化文件上传 优化一体机体验

pages/chat/components/ai-paging.vue

@@ -44,7 +44,7 @@
                                 class="msg-files btn-light"
                                 v-for="(file, vInex) in msg.files"
                                 :key="vInex"
-                                @click="jumpUrl(file)"
+                                @click="handleMsgFileClick(file)"
                             >
                                 <image class="msg-file-icon" src="/static/icon/Vector2.png"></image>
                                 <text class="msg-file-text">{{ file.name || '附件' }}</text>
@@ -216,9 +216,10 @@
                         >
                             <image
                                 class="file-iconImg"
-                                @click="jumpUrl(file)"
+                                @click="preViewImage(file)"
                                 v-if="isImage(file.type)"
                                 :src="file.url"
+                                mode="scaleToFill"
                             ></image>
                             <view class="file-doc" @click="jumpUrl(file)" v-else>
                                 <FileIcon class="doc-icon" :type="file.type"></FileIcon>
@@ -241,7 +242,7 @@
             </view>
         </view>
         <PopupFeeBack ref="feeback" @onClose="colseFeeBack" @onSend="confirmFeeBack"></PopupFeeBack>
-        <UploadQrcode ref="qrcodeRef" @onSend="handleFileSend" :sessionId="chatSessionID"></UploadQrcode>
+        <UploadQrcode ref="qrcodeRef" @onSend="handleFileSend" :leaveFileCount="leaveFileCount" :sessionId="chatSessionID"></UploadQrcode>
         <MsgTips ref="feeBackTips" content="已收到反馈，感谢您的关注" title="反馈成功" :icon="successIcon"></MsgTips>
     </view>
 </template>
@@ -341,6 +342,10 @@ const audiowaveStyle = computed(() => {
         : '#f1f1f1';
 });
 
+const leaveFileCount = computed(()=>{ //还剩多少文件可以上传 给扫码传参使用
+    return config.allowedFileNumber - filesList.value.length
+})
+
 onMounted(async () => {
     changeQueries();
     scrollToBottom();
@@ -484,11 +489,40 @@ function isFile(type) {
 
 function jumpUrl(file) {
     if (file.url) {
-        window.open(file.url);
+        if(!isMachineEnv.value)window.open(file.url);
+        else $api.msg('该文件无法预览');
     } else {
         $api.msg('文件地址丢失');
     }
 }
+function preViewImage(file) {
+    if (file.url) {
+       uni.previewImage({
+        urls: [file.url]
+       })
+    } else {
+        $api.msg('文件地址丢失');
+    }
+}
+function handleMsgFileClick(file) {
+    if(isImage(file.type)){
+        if (file.url) {
+            uni.previewImage({
+            urls: [file.url]
+            })
+        } else {
+            $api.msg('文件地址丢失');
+        }
+    }else{
+        if (file.url) {
+            if(!isMachineEnv.value)window.open(file.url);
+            else $api.msg('该文件无法预览');
+        } else {
+            $api.msg('文件地址丢失');
+        }
+    }
+}
+
 
 function VerifyNumberFiles(num) {
     if (filesList.value.length >= config.allowedFileNumber) {
@@ -535,7 +569,7 @@ function getUploadFile(type = 'camera') {
             const allowedTypes = config.allowedFileTypes || [];
             const size = $api.formatFileSize(file.size);
             if (!allowedTypes.includes(file.type)) {
-                return $api.msg('仅支持 txt md html word pdf ppt csv excel 格式类型');
+                return $api.msg('仅支持 txt md  word pdf ppt csv excel 格式类型');
             }
             // 继续上传
             $api.uploadFile(tempFilePaths[0], true).then((resData) => {
@@ -553,20 +587,19 @@ function getUploadFile(type = 'camera') {
 }
 
 const handleFileSend = (rows)=>{
-    filesList.value = []
     try {
         rows.map(item=>{
             if(isImage(item.fileSuffix)){
                 filesList.value.push({
                     url: item.fileUrl,
                     type: item.fileSuffix,
-                    name: item.fileName,
+                    name: item.originalName,
                 });
             }else{
                 filesList.value.push({
                     url: item.fileUrl,
                     type: item.fileSuffix,
-                    name: item.fileName,
+                    name: item.originalName,
                 });
             }
         })
@@ -639,8 +672,12 @@ function changeVoice() {
 
 function changeShowFile() {
     if(isMachineEnv.value){
-        qrcodeRef.value?.open()
-        return
+        if (filesList.value.length >= config.allowedFileNumber){
+            return $api.msg(`最大上传文件数量 ${config.allowedFileNumber} 个`);
+        }else{
+            qrcodeRef.value?.open()
+            return
+        }
     }
     showfile.value = !showfile.value;
 }
@@ -1118,7 +1155,7 @@ image-margin-top = 40rpx
                     color: #7B7B7B;
                     max-width: 100%
                 .file-iconImg
-                    height: 100%
+                    // height: 100%
                     width: 100%
                 .filerow
                     display: flex