cs

components/chat-list.vue

@@ -53,23 +53,23 @@
 </template>
 
 <script lang="ts">
-import { Component, Prop, Ref, Vue } from "vue-property-decorator";
-import Controller from "./controller/chat-list";
-import { EVENTS } from "@/EventConsts";
-import avatar from "@/customer-service/components/avatar.vue";
-import { Chat as ChatType } from "@/customer-service/xim/models/chat";
-import { ServiceType } from "../model";
-import xim from "@/customer-service/xim";
-
-@Component({ components: { avatar } })
-export default class ChatList extends Controller {
+    import { Component, Prop, Ref, Vue } from "vue-property-decorator";
+    import Controller from "./controller/chat-list";
+    import { EVENTS } from "@/EventConsts";
+    import avatar from "@/customer-service/components/avatar.vue";
+    import { Chat as ChatType } from "@/customer-service/xim/models/chat";
+    import { ServiceType } from "../model";
+    import xim from "@/customer-service/xim";
+
+    @Component({ components: { avatar } })
+    export default class ChatList extends Controller {
         private searchKeyword = "";
 
         @Prop({ type: Number, default: -1 })
         private selected!: number;
 
         @Ref("scrollbar")
-    private scrollbar: Vue & { update: () => void };
+        private readonly scrollbar!: Vue & { update: () => void };
 
         private unReadMsgCount = 0;
 
@@ -140,11 +140,11 @@ export default class ChatList extends Controller {
             );
             this.close();
         }
-}
+    }
 </script>
 
 <style lang="less" scoped>
-.chat-list-con {
+    .chat-list-con {
         display: inline-block;
         width: 25%;
         box-sizing: border-box;
@@ -156,18 +156,18 @@ export default class ChatList extends Controller {
             font-size: 18px;
             border-bottom: 1px solid #e1e1e1;
         }
-}
-.chat-list {
+    }
+    .chat-list {
         text-align: center;
-}
-.chat-list-scroll {
+    }
+    .chat-list-scroll {
         height: 100%;
 
         .empty {
             margin-top: 100%;
         }
-}
-.keyword-input {
+    }
+    .keyword-input {
         width: 90%;
         margin: 15px;
         /deep/ .el-input__inner {
@@ -183,8 +183,8 @@ export default class ChatList extends Controller {
         /deep/ .el-input__icon {
             line-height: 32px;
         }
-}
-.chat-list {
+    }
+    .chat-list {
         .chat-item {
             position: relative;
             cursor: pointer;
@@ -243,8 +243,8 @@ export default class ChatList extends Controller {
                 margin-top: -15px;
             }
         }
-}
-.chat-check-detail {
+    }
+    .chat-check-detail {
         margin-left: 10px;
-}
+    }
 </style>

components/controller/chat-list.ts

@@ -3,6 +3,7 @@ import { parserMessage } from ".";
 import { chatStore, ChatStore } from "@/customer-service/store/model";
 import { formatTime, TimeFormatRule } from "@/customer-service/utils/time";
 import { Chat as ChatItem } from "@/customer-service/xim/models/chat";
+import Xim from "@/customer-service/xim";
 
 @Component({ components: {} })
 export default class ChatList extends Vue {
@@ -48,11 +49,13 @@ export default class ChatList extends Vue {
     @chatStore.Action(ChatStore.ACTION_CLEAR_CURRENT_CHAT_DATA)
     protected readonly reset!: ChatStore.ACTION_CLEAR_CURRENT_CHAT_DATA;
 
+    private readonly invoker = Xim.getSdk();
+
     protected parseMesage(data: ChatItem) {
         if (data.last_msg_sender && data.last_msg_sender !== "0") {
             if (!this.userNames[data.last_msg_sender]) {
                 this.updateUserName({ id: data.last_msg_sender, name: "" });
-                this.sdk
+                this.invoker
                     .model("user")
                     .detail(data.last_msg_sender)
                     .query()
@@ -62,7 +65,7 @@ export default class ChatList extends Vue {
                             name: userInfo.row.first_name.display as string,
                         });
                     })
-                    .catch(() => {});
+                    .catch(() => { });
             }
         }
         if (data.last_msg_content === "") {

components/message-list.vue

@@ -38,18 +38,18 @@
 </template>
 
 <script lang="ts">
-import { Component, Prop, Ref, Vue, Watch } from "vue-property-decorator";
-import { Message, MessageType } from "../model";
-import { throttle } from "../utils";
-import { formatTime } from "../utils/time";
-import ImagePreview from "./image-preview.vue";
-import message from "./message.vue";
-import VideoPreview from "./video-preview.vue";
-import { ChatStore, chatStore } from "@/customer-service/store/model";
-import { dbController } from "../database";
-
-@Component({ components: { message, ImagePreview, VideoPreview } })
-export default class MessageList extends Vue {
+    import { Component, Prop, Ref, Vue, Watch } from "vue-property-decorator";
+    import { Message, MessageType } from "../model";
+    import { throttle } from "../utils";
+    import { formatTime } from "../utils/time";
+    import ImagePreview from "./image-preview.vue";
+    import message from "./message.vue";
+    import VideoPreview from "./video-preview.vue";
+    import { ChatStore, chatStore } from "@/customer-service/store/model";
+    import { dbController } from "../database";
+
+    @Component({ components: { message, ImagePreview, VideoPreview } })
+    export default class MessageList extends Vue {
         @chatStore.Getter(ChatStore.STATE_CHAT_MSG_HISTORY)
         private readonly historyMessage!: ChatStore.STATE_CHAT_MSG_HISTORY;
 
@@ -93,7 +93,7 @@ export default class MessageList extends Vue {
             if (this.historyMessage) {
                 if (this.sendingMessages) {
                     return [...this.historyMessage, ...this.sendingMessages].filter(
-                    (i) => i.chat_id === this.chatId
+                        (i) => i.chat_id === this.chatId && i.id > 0
                     );
                 }
                 return this.historyMessage;
@@ -101,7 +101,7 @@ export default class MessageList extends Vue {
 
             if (this.sendingMessages) {
                 return this.sendingMessages.filter(
-                (i) => i.chat_id === this.chatId
+                    (i) => i.chat_id === this.chatId && i.id > 0
                 );
             }
 
@@ -375,23 +375,25 @@ export default class MessageList extends Vue {
         private refresh() {
             this.fetchNewMsg();
         }
-}
+    }
 </script>
 
 <style lang="less" scoped>
-.message-list {
+    .message-list {
         padding: 0 20px;
         padding-right: 0;
-}
+    }
 
-.loading-mask {
+    .loading-mask {
         height: 50px;
         line-height: 50px;
         text-align: center;
-}
+    }
 
-.message-template {
+    .message-template {
         &:first-child {
+            padding-top: 10px;
+
             .timestamp {
                 margin-top: 20px;
             }
@@ -405,5 +407,5 @@ export default class MessageList extends Vue {
             font-size: 12px;
             user-select: none;
         }
-}
+    }
 </style>

service/upload.ts

-import Vue from "vue";
-import { UniplatSdk } from "uniplat-sdk"
-
-const orgId = () => Vue.prototype.global.org?.id ?? "0";
+import Chat from "@/customer-service/xim";
 
 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;
+    const sdk = Chat.getSdk();
+    let { url } = await sdk.uploadFileV2(file)
+    return `${sdk.global.baseUrl}${url}`;
 }