图片的上传与显示

components/message-input.vue

@@ -121,7 +121,7 @@ export default class MessageInput extends Vue {
           };
           };
           img.remove();
           img.remove();
         }
         }
-        uploadFile(file, this.chatId || 0, w, h)
+        uploadFile(file)
           .then((r) => {
           .then((r) => {
             if (r) {
             if (r) {
               const msg = {
               const msg = {

components/message.vue

@@ -264,10 +264,14 @@ export default class Message extends Mixins(Filters) {
         return false;
         return false;
     }
     }
 
 
-    public created() {
+    private created() {
         this.getUserName(this.data.eid);
         this.getUserName(this.data.eid);
     }
     }
 
 
+    private mounted() {
+        this.buildMessageUrl()
+    }
+
     private getUserName(eid: string) {
     private getUserName(eid: string) {
         this.senderName = this.chatMembers.find(member => member.eid === eid)?.name ?? "";
         this.senderName = this.chatMembers.find(member => member.eid === eid)?.name ?? "";
     }
     }
@@ -375,22 +379,10 @@ export default class Message extends Mixins(Filters) {
         }
         }
         const url = this.messageBody.msg.url as string;
         const url = this.messageBody.msg.url as string;
         if (url) {
         if (url) {
-            // const service = XimService.getInstance()
             if (isAccessibleUrl(url)) {
             if (isAccessibleUrl(url)) {
                 return (this.messageRealUrl = url);
                 return (this.messageRealUrl = url);
             }
             }
             this.loadingRealUrl = true;
             this.loadingRealUrl = true;
-            // service
-            //     .getFileUrlById(url, this.chatId || 0, this.isCustomer())
-            //     .then((data) => {
-            //         if (data && data.itemList) {
-            //             this.messageRealUrl = data.itemList[0].url
-            //         } else {
-            //             this.fileFailed2Load = true
-            //         }
-            //     })
-            //     .catch(() => (this.fileFailed2Load = true))
-            //     .finally(() => (this.loadingRealUrl = false))
         } else {
         } else {
             this.fileFailed2Load = true;
             this.fileFailed2Load = true;
         }
         }

hybrid-input/index.vue

@@ -15,9 +15,9 @@
       >
       >
         <img class="tool-bar-icon" src="@/customer-service/imgs/pic.png" />
         <img class="tool-bar-icon" src="@/customer-service/imgs/pic.png" />
       </label>
       </label>
-      <label for="chat-upload-file" :title="tip4File" @click="allowLoadFile">
+      <!-- <label for="chat-upload-file" :title="tip4File" @click="allowLoadFile">
         <img class="tool-bar-icon" src="@/customer-service/imgs/file.png" />
         <img class="tool-bar-icon" src="@/customer-service/imgs/file.png" />
-      </label>
+      </label> -->
 
 
       <input
       <input
         @change="onChange"
         @change="onChange"
@@ -518,8 +518,7 @@ export default class Input extends Vue {
   padding-left: 20px;
   padding-left: 20px;
 
 
   /deep/.input-el-scrollbar.el-scrollbar {
   /deep/.input-el-scrollbar.el-scrollbar {
-    // 28px : tool-bar的高度
-    height: calc(100% - 28px);
+    height: calc(100% - 35px);
 
 
     > .el-scrollbar__wrap {
     > .el-scrollbar__wrap {
       overflow-x: hidden;
       overflow-x: hidden;

service/upload.ts

-import Axios from "axios";
 import Vue from "vue";
 import Vue from "vue";
+import { UniplatSdk } from "uniplat-sdk"
 
 
-import tokenManager from "../xim/token";
-
-import { invokePost } from "./request";
 const orgId = () => Vue.prototype.global.org?.id ?? "0";
 const orgId = () => Vue.prototype.global.org?.id ?? "0";
-export async function uploadFile(
-    file: File,
-    chatId: number,
-    width?: number,
-    height?: number
-) {
-    const splits = file.name.split(".");
-    const parameter = {
-        file_name: file.name,
-        size: file.size,
-        introduction: file.name,
-        owner_type: "FILE_TYPE_CS",
-        owner_id: chatId,
-        org_id: orgId(),
-        ext_type: splits[splits.length - 1],
-    };
-    if (width && height) {
-        Object.assign(parameter, { width, height });
-    }
-    const token = await invokePost<{
-        url_id: string;
-        sign: string;
-        domain: string;
-        file_name: string;
-        id: number;
-    }>("/xchat/personal/upload_token", await tokenManager.getToken(), parameter);
 
 
-    const uri = `${token.domain}/gw/file/upload`;
-    const form = new FormData();
-    form.append("file", file);
-    form.append("fileId", token.url_id);
-    form.append("fileSize", file.size.toString());
-    form.append("orgId", orgId());
-    form.append("sign", token.sign);
-    const result = await Axios.post(uri, form, {
-        headers: { "Content-Type": "multipart/form-data" },
-    });
-    if (result && result.data && result.data.errcode === 0) {
-        return token.url_id;
-    }
-    return "";
+export async function uploadFile(file: File) {
+    let { url } = await (Vue.prototype.sdk as UniplatSdk).uploadFileV2(file)
+    const realUrl = `${Vue.prototype.sdk.global.baseUrl}${url}`;
+    return realUrl;
 }
 }