eslint

049a2228 · Sixong.Zhu · a2b13d43 · 049a2228 · 049a2228 · 049a2228
Commit 049a2228 authored Sep 09, 2021 by Sixong.Zhu
Showing with 422 additions and 153 deletions
chat.vue
components/chat-container.vue
components/chat-list-model.vue
components/chat-list.vue
components/chat-members.vue
components/chat-room.vue
components/chat-title.vue
components/create-chat.vue
components/msg-shortcut.vue
database/index.ts
store/index.ts
store/model.ts
xim/index.ts
--- a/chat.vue
+++ b/chat.vue
@@ -44,8 +44,10 @@
    </div>
 </template>
 <script lang="ts">
-import { Component, Vue, Watch, Prop } from "vue-property-decorator";
+import { Component, Prop, Vue, Watch } from "vue-property-decorator";
 import remarkList from "../components/common/remarkList.vue";
 import ChatMembers from "./components/chat-members.vue";
 import ChatRoom from "./components/chat-room.vue";
 import ChatTitle from "./components/chat-title.vue";
@@ -108,7 +110,7 @@ export default class Chat extends Vue {
        this.refreshFlag = true;
        this.$nextTick(() => {
            this.refreshFlag = false;
-        })
+        });
    }
    @Prop(String) modelName: string;

--- a/components/chat-container.vue
+++ b/components/chat-container.vue
@@ -39,9 +39,10 @@
 <script lang="ts">
 import { Component, Prop, Ref, Vue, Watch } from "vue-property-decorator";
-import ChatList from "@/customer-service/components/chat-list.vue";
-import ChatListModel from "@/customer-service/components/chat-list-model.vue";
 import chat from "@/customer-service/chat.vue";
+import ChatListModel from "@/customer-service/components/chat-list-model.vue";
+import ChatList from "@/customer-service/components/chat-list.vue";
 import { ChatStore, chatStore } from "@/customer-service/store/model";
 @Component({

--- a/components/chat-list-model.vue
+++ b/components/chat-list-model.vue
@@ -104,11 +104,13 @@
 <script lang="ts">
 import { Component, Prop, Ref, Vue } from "vue-property-decorator";
+import { parserMessage } from "./controller";
+import { EVENTS } from "@/EventConsts";
 import { chatStore, ChatStore } from "@/customer-service/store/model";
 import { formatTime, TimeFormatRule } from "@/customer-service/utils/time";
 import { Chat as ChatType } from "@/customer-service/xim/models/chat";
-import { EVENTS } from "@/EventConsts";
-import { parserMessage } from "./controller";
 interface SelectChatType extends ChatType {
    checked?: boolean;
@@ -222,7 +224,7 @@ export default class ModelChatList extends Vue {
    }
    onTransportMessage(e: any) {
-        let index = e.dataUpdates.findIndex(
+        const index = e.dataUpdates.findIndex(
            (it) =>
                it.action === "startChat" ||
                it.action === "createChat" ||
@@ -232,7 +234,7 @@ export default class ModelChatList extends Vue {
                (it.action === "sendMsg" &&
                    this.listName === "group_before_handle" &&
                    this.chatList.findIndex(
-                        (chat) => chat.id == it.selectedList[0]
+                        (chat) => chat.id === it.selectedList[0]
                    ) > -1)
        );
        if (index > -1) {
@@ -267,7 +269,7 @@ export default class ModelChatList extends Vue {
    }
    private async goToChatRoom(data: ChatType) {
-        const chatInfo = await this._createChat({
+        await this._createChat({
            modelName: data.business_data.model_name,
            selectedListId: data.business_data.obj_id,
            uids: [],
@@ -281,7 +283,7 @@ export default class ModelChatList extends Vue {
    }
    private parseMesage(data: ChatType) {
-        if (data.last_msg_sender && data.last_msg_sender != "0") {
+        if (data.last_msg_sender && data.last_msg_sender !== "0") {
            if (this.userNames[data.last_msg_sender] === undefined) {
                this.updateUserName({ id: data.last_msg_sender, name: "" });
                this.sdk
@@ -311,7 +313,7 @@ export default class ModelChatList extends Vue {
    }
    private batchStartReception() {
-        let chats = this.chatRooms.filter((chat) => chat.checked);
+        const chats = this.chatRooms.filter((chat) => chat.checked);
        if (chats.length === 0) {
            this.$message.warning("请先勾选要接待的会话");
            return;

--- a/components/chat-list.vue
+++ b/components/chat-list.vue
@@ -53,11 +53,13 @@
 <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 { ChatStore } from "@/customer-service/store/model";
 import { Chat as ChatType } from "@/customer-service/xim/models/chat";
-import { EVENTS } from "@/EventConsts";
-import Controller from "./controller/chat-list";
 @Component({ components: { avatar } })
 export default class ChatList extends Controller {

--- a/components/chat-members.vue
+++ b/components/chat-members.vue
@@ -37,26 +37,33 @@ export default class ChatMembers extends Vue {
    @chatStore.Action(ChatStore.ACTION_CHAT_REMOVE_CS)
    private readonly _getoutCs!: ChatStore.ACTION_CHAT_REMOVE_CS;
-    private async getout(item: ChatStore.GETTER_CURRENT_CHAT_PRESENT_MEMBERS[number]) {
+    private async getout(
+        item: ChatStore.GETTER_CURRENT_CHAT_PRESENT_MEMBERS[number]
+    ) {
        await this.$confirm(`确定要移除${item.name}？`, "提示", {
            confirmButtonText: "确定",
            cancelButtonText: "取消",
            type: "warning",
        });
        // xim里的eid等于uniplat里的uid
-        if (item.type == 25) { // 普通成员
+        if (item.type === 25) {
-            this._getout([item.eid])
+            // 普通成员
-        } else if (item.type == 92) { // 可否
+            this._getout([item.eid]);
-            this._getoutCs([item.eid])
+        } else if (item.type === 92) {
+            // 可否
+            this._getoutCs([item.eid]);
        }
    }
    private memberTypeStr(type: string | number) {
        if (type.toString() === "25") {
-            return ""
+            return "";
-        } else if (type.toString() === "92") {
+        }
-            return "客服"
+        if (type.toString() === "92") {
-        } else if (type.toString() === "85") {
+            return "客服";
-            return "管理员"
+        }
+        if (type.toString() === "85") {
+            return "管理员";
        }
    }
 }

--- a/components/chat-room.vue
+++ b/components/chat-room.vue
@@ -24,7 +24,7 @@
                ></div>
                <div
                    ref="bottom"
-                    class="chat-input flex-none overflow-hidden"
+                    class="chat-input flex-none overflow-hidden h-100"
                    v-if="isChatMember"
                >
                    <message-input @error="onError" />
@@ -37,10 +37,10 @@
 import {
    Component,
    Prop,
+    Provide,
    Ref,
-    Watch,
    Vue,
-    Provide,
+    Watch,
 } from "vue-property-decorator";
 import MessageInput from "@/customer-service/components/message-input.vue";
@@ -156,8 +156,9 @@ export default class ChatRoom extends Vue {
    }
    mounted() {
-        (this.refBottom as HTMLElement).style.height =
+        this.refBottom &&
-            this.chatBox.clientHeight - this.refTop.clientHeight + "px";
+            ((this.refBottom as HTMLElement).style.height =
+                this.chatBox.clientHeight - this.refTop.clientHeight + "px");
    }
 }
 </script>

--- a/components/chat-title.vue
+++ b/components/chat-title.vue
@@ -55,6 +55,7 @@
 </template>
 <script lang="ts">
 import { Component, Prop, Vue } from "vue-property-decorator";
 import ChatCreator from "@/customer-service/components/create-chat.vue";
 import { ChatStore, chatStore } from "@/customer-service/store/model";
@@ -130,7 +131,7 @@ export default class ChatTitle extends Vue {
    private async exitChat() {
        try {
-            if (this.operatorType == "25") {
+            if (this.operatorType === "25") {
                await this._userExitChat();
            } else if (+this.operatorType > 25) {
                await this._csExitChat();

--- a/components/create-chat.vue
+++ b/components/create-chat.vue
@@ -57,12 +57,13 @@
    </el-dialog>
 </template>
 <script lang="ts">
-import { ListEasy, ListTypes } from "uniplat-sdk";
+import { ListEasy, ListTypes, TagManagerTypes } from "uniplat-sdk";
 import { Component, Prop, Vue, Watch } from "vue-property-decorator";
-import GeneralTagSelectForFilter from "@/components/statistic/GeneralTagSelectForFilter.vue"
 import buttonThrottle from "../utils/button-throttle";
+import GeneralTagSelectForFilter from "@/components/statistic/GeneralTagSelectForFilter.vue";
 import avatar from "@/customer-service/components/avatar.vue";
-import { TagManagerTypes } from "uniplat-sdk"
 import chat from "@/customer-service/xim/index";
 type User = {
    id: string;
@@ -103,9 +104,9 @@ export default class ChatCreator extends Vue {
        if (this.$refs.generalTagSelect) {
            return (
                this.$refs.generalTagSelect as GeneralTagSelectForFilter
-            ).getSelectedTags()
+            ).getSelectedTags();
        }
-        return []
+        return [];
    }
    private async getUserList(searchText: string | null = null) {
@@ -127,7 +128,7 @@ export default class ChatCreator extends Vue {
        this.getList = getList;
        this.userList = this.exactUserList(pageData.rows);
        this.loading = false;
-        this.tagGroups = pageData.tagGroups || []
+        this.tagGroups = pageData.tagGroups || [];
    }
    private exactUserList(rows: any[]) {

--- a/components/msg-shortcut.vue
+++ b/components/msg-shortcut.vue
 <template>
    <div class="msg-short-cut-wrap">
        <div class="btn-group top-btn-group">
-            <el-button type="text" @click="replyInputVisible = true" v-if="!replyInputVisible">添加</el-button>
+            <el-button
-            <el-button v-show="replyInputVisible" @click="addReply" size="small" type="text">提交</el-button>
+                type="text"
-            <el-button v-show="replyInputVisible" @click="hideReplyInput" size="small" type="text">取消</el-button>
+                @click="replyInputVisible = true"
-            <br>
+                v-if="!replyInputVisible"
-            <el-input class="remark-input" type="textarea" v-show="replyInputVisible" v-model="addReplyStr" maxlength="200" minlength="2" :show-word-limit="true"></el-input>
+                >添加</el-button
+            >
+            <el-button
+                v-show="replyInputVisible"
+                @click="addReply"
+                size="small"
+                type="text"
+                >提交</el-button
+            >
+            <el-button
+                v-show="replyInputVisible"
+                @click="hideReplyInput"
+                size="small"
+                type="text"
+                >取消</el-button
+            >
+            <br />
+            <el-input
+                class="remark-input"
+                type="textarea"
+                v-show="replyInputVisible"
+                v-model="addReplyStr"
+                maxlength="200"
+                minlength="2"
+                :show-word-limit="true"
+            ></el-input>
        </div>
-        <div class="shortcut pointer" v-for="(reply, index) in replyList" :key="reply.id">
+        <div
-            <span class="rep-index">{{index + 1}}.</span>
+            class="shortcut pointer"
-            <span class="rep-content" v-if="!editingItem[reply.id]">{{ reply.content }}</span>
+            v-for="(reply, index) in replyList"
-            <el-input v-if="editingItem[reply.id]" class="remark-input" type="textarea" v-model="editingItemContent[reply.id]" maxlength="200" minlength="2" :show-word-limit="true"></el-input>
+            :key="reply.id"
+        >
+            <span class="rep-index">{{ index + 1 }}.</span>
+            <span class="rep-content" v-if="!editingItem[reply.id]">{{
+                reply.content
+            }}</span>
+            <el-input
+                v-if="editingItem[reply.id]"
+                class="remark-input"
+                type="textarea"
+                v-model="editingItemContent[reply.id]"
+                maxlength="200"
+                minlength="2"
+                :show-word-limit="true"
+            ></el-input>
            <div class="btn-group">
-                <el-button type="text" @click="sendMsg(reply)" v-if="!editingItem[reply.id]">发送</el-button>
+                <el-button
-                <el-button type="text" v-if="uid === reply.created_by && !editingItem[reply.id]" @click="editing(reply)">编辑</el-button>
+                    type="text"
-                <el-button type="text" v-if="uid === reply.created_by && !editingItem[reply.id]" @click="delReply(reply)">删除</el-button>
+                    @click="sendMsg(reply)"
-                <el-button v-if="editingItem[reply.id]" @click="editDone(reply)" type="text">确定</el-button>
+                    v-if="!editingItem[reply.id]"
-                <el-button v-if="editingItem[reply.id]" @click="editCancel(reply)" type="text">取消</el-button>
+                    >发送</el-button
+                >
+                <el-button
+                    type="text"
+                    v-if="uid === reply.created_by && !editingItem[reply.id]"
+                    @click="editing(reply)"
+                    >编辑</el-button
+                >
+                <el-button
+                    type="text"
+                    v-if="uid === reply.created_by && !editingItem[reply.id]"
+                    @click="delReply(reply)"
+                    >删除</el-button
+                >
+                <el-button
+                    v-if="editingItem[reply.id]"
+                    @click="editDone(reply)"
+                    type="text"
+                    >确定</el-button
+                >
+                <el-button
+                    v-if="editingItem[reply.id]"
+                    @click="editCancel(reply)"
+                    type="text"
+                    >取消</el-button
+                >
            </div>
        </div>
    </div>
 </template>
 <script lang="ts">
-import { Component, Prop, Vue } from "vue-property-decorator";
+import { Component, Vue } from "vue-property-decorator";
 import { ChatStore, chatStore } from "../store/model";
 import buttonThrottle from "../utils/button-throttle";
@@ -30,8 +95,8 @@ interface Reply {
    sort: string;
    id: string;
    content: string;
-    uniplat_version: string
+    uniplat_version: string;
-    created_by: string
+    created_by: string;
 }
 const ReplyModelName = "uniplat_chat_reply";
@@ -48,15 +113,17 @@ export default class MsgShortCut extends Vue {
    private uid = this.sdk.global.uid;
    private replyInputVisible = false;
    private addReplyStr = "";
-    private editingItem: {[key: string]: boolean} = {};
+    private editingItem: { [key: string]: boolean } = {};
-    private editingItemContent: {[key: string]: string} = {};
+    private editingItemContent: { [key: string]: string } = {};
    async mounted() {
        await this.getReplyList();
    }
    private async getReplyList() {
-        this.replyList = await this.sdk.domainService("uniplat_base", "chat.chat", "reply").request("get");
+        this.replyList = await this.sdk
+            .domainService("uniplat_base", "chat.chat", "reply")
+            .request("get");
    }
    @buttonThrottle()
@@ -73,36 +140,50 @@ export default class MsgShortCut extends Vue {
            cancelButtonText: "取消",
            type: "warning",
        }).then(() => {
-            this.sdk.model(ReplyModelName).action("delete").updateInitialParams({
+            this.sdk
-                selected_list: [{ v: +reply.uniplat_version, id: +reply.id }],
+                .model(ReplyModelName)
-            }).execute().then(() => {
+                .action("delete")
-                const index = this.replyList.findIndex(it => it === reply);
+                .updateInitialParams({
-                this.replyList.splice(index, 1);
+                    selected_list: [
-            })
+                        { v: +reply.uniplat_version, id: +reply.id },
-        })
+                    ],
+                })
+                .execute()
+                .then(() => {
+                    const index = this.replyList.findIndex(
+                        (it) => it === reply
+                    );
+                    this.replyList.splice(index, 1);
+                });
+        });
    }
    private hideReplyInput() {
        this.replyInputVisible = false;
-        this.addReplyStr = ""
+        this.addReplyStr = "";
    }
    private addReply() {
-        let addReplyStr = this.addReplyStr.trim()
+        const addReplyStr = this.addReplyStr.trim();
        if (addReplyStr.length < 2 || addReplyStr.length > 200) {
            this.$message.warning("回复在2-200个字符之间");
-            return
+            return;
        }
-        this.sdk.model(ReplyModelName).action("insert_my").addInputs_parameter({
+        this.sdk
-            category: "毕节客服工作台",
+            .model(ReplyModelName)
-            org_id: this.sdk.global.initData.orgId,
+            .action("insert_my")
-            model: ReplyModelName,
+            .addInputs_parameter({
-            content: addReplyStr,
+                category: "毕节客服工作台",
-            sort: 0
+                org_id: this.sdk.global.initData.orgId,
-        }).execute().then(() => {
+                model: ReplyModelName,
-            this.getReplyList();
+                content: addReplyStr,
-            this.hideReplyInput();
+                sort: 0,
-        });
+            })
+            .execute()
+            .then(() => {
+                this.getReplyList();
+                this.hideReplyInput();
+            });
    }
    private editing(reply: Reply) {
@@ -115,12 +196,14 @@ export default class MsgShortCut extends Vue {
    }
    private editDone(reply: Reply) {
-        let addReplyStr = this.editingItemContent[reply.id].trim();
+        const addReplyStr = this.editingItemContent[reply.id].trim();
        if (addReplyStr.length < 2 || addReplyStr.length > 200) {
            this.$message.warning("回复在2-200个字符之间");
-            return
+            return;
        }
-        this.sdk.model(ReplyModelName).action("update")
+        this.sdk
+            .model(ReplyModelName)
+            .action("update")
            .updateInitialParams({
                selected_list: [{ v: +reply.uniplat_version, id: +reply.id }],
            })
@@ -131,8 +214,10 @@ export default class MsgShortCut extends Vue {
                content: addReplyStr,
                sort: 0,
                is_enabled: 1,
-                uniplat_uid: this.sdk.global.uid
+                uniplat_uid: this.sdk.global.uid,
-            }).execute().then(() => {
+            })
+            .execute()
+            .then(() => {
                reply.content = addReplyStr;
                reply.uniplat_version = (+reply.uniplat_version + 1).toString();
                this.editCancel(reply);
@@ -143,7 +228,7 @@ export default class MsgShortCut extends Vue {
 <style lang="less" scoped>
 .shortcut {
    position: relative;
-    padding:10px 10px;
+    padding: 10px 10px;
    font-size: 14px;
    white-space: normal;
    color: #999;

--- a/database/index.ts
+++ b/database/index.ts
+import { Chat, Message } from "./../xim/models/chat";
+class ChatCacheDatabaseController {
+    private db: IDBDatabase;
+    private readonly version = new Date().valueOf();
+    private readonly chatListKey = "chat-list";
+    private readonly chatMessageKey = "chat-message";
+    public setup(uid: string) {
+        return new Promise<void>((resolve) => {
+            if (uid && indexedDB) {
+                const r = indexedDB.open(uid, this.version);
+                const that = this;
+                const setupDb = () => {
+                    if (that.db) {
+                        that.buildTables(that.db, that.chatListKey);
+                        that.buildTables(that.db, that.chatMessageKey);
+                    }
+                    resolve();
+                };
+                r.onsuccess = function (e) {
+                    that.db = (e.target as any).result;
+                };
+                r.onupgradeneeded = function (e) {
+                    that.db = (e.target as any).result;
+                    setupDb();
+                };
+            } else {
+                resolve();
+            }
+        });
+    }
+    private buildTables(database: IDBDatabase, key: string, path?: string) {
+        if (!database.objectStoreNames.contains(key)) {
+            database.createObjectStore(key, { keyPath: path });
+        }
+    }
+    private buildTransaction(key: string) {
+        return this.db.transaction(key, "readwrite");
+    }
+    private buildStore(key: string) {
+        const transaction = this.buildTransaction(key);
+        return transaction.objectStore(key);
+    }
+    public saveChatList(items: Chat[]) {
+        if (this.db) {
+            const store = this.buildStore(this.chatListKey);
+            for (const item of items) {
+                store.add(item, item.id);
+            }
+        }
+    }
+    public getChatList() {
+        return new Promise<Chat[]>((resolve) => {
+            if (!this.db) {
+                return resolve([]);
+            }
+            const store = this.buildStore(this.chatListKey);
+            const r = store.getAll();
+            r.onsuccess = (o) => {
+                resolve((o.target as any).result);
+            };
+            r.onerror = () => resolve([]);
+        });
+    }
+    public saveChatMessages(chat: number, items: Message[]) {
+        if (this.db && items) {
+            const store = this.buildStore(this.chatMessageKey);
+            store.add(items, chat);
+        }
+    }
+    public getChatMessages(chat: number) {
+        return new Promise<Message[]>((resolve) => {
+            if (!this.db) {
+                return resolve([]);
+            }
+            const store = this.buildStore(this.chatMessageKey);
+            const r = store.get(chat);
+            r.onsuccess = (o) => {
+                resolve((o.target as any).result);
+            };
+            r.onerror = () => resolve([]);
+        });
+    }
+    public appendMessages(chat: number, items: Message[]) {
+        return new Promise<void>((resolve) => {
+            if (!this.db || !items.length) {
+                return resolve();
+            }
+            const store = this.buildStore(this.chatMessageKey);
+            const r = store.get(chat);
+            r.onsuccess = (o) => {
+                const cache = (o.target as any).result as Message[];
+                for (const item of items) {
+                    if (!cache.find((i) => i.id === item.id)) {
+                        cache.push(item);
+                    }
+                }
+                const sort = cache.sort((i) => i.ts);
+                store.put(sort, chat);
+                resolve();
+            };
+            r.onerror = () => resolve();
+        });
+    }
+}
+export const dbController = new ChatCacheDatabaseController();
--- a/store/index.ts
+++ b/store/index.ts
 import { RootStoreState } from "@/store/model";
 import { Module } from "vuex";
-import Vue from "vue"
+import Vue from "vue";
 import { ChatMember } from "../model";
 import { isAccessibleUrl } from "../service/tools";
 import { unique } from "../utils";
@@ -13,6 +13,7 @@ import { Chat as ChatType, Message } from "../xim/models/chat";
 import xim, { ChatNotifyListener } from "../xim/xim";
 import { ChatStatus, ChatStore, ChatStoreState } from "./model";
+import { dbController } from "../database";
 export const ns = ChatStore.ns;
@@ -25,7 +26,7 @@ function uniqueMessages(
    messages: NonNullable<ChatStore.STATE_CHAT_MSG_HISTORY>
 ) {
    const arr = [...messages];
-    return unique(arr, function(item, all) {
+    return unique(arr, function (item, all) {
        return all.findIndex((k) => k.id === item.id);
    });
 }
@@ -50,7 +51,11 @@ async function preCacheImgs(msgs: any[]) {
                    if (!isAccessibleUrl(url)) {
                        resolve();
                    }
-                    if (url && isAccessibleUrl(url) && typeof Image !== "undefined") {
+                    if (
+                        url &&
+                        isAccessibleUrl(url) &&
+                        typeof Image !== "undefined"
+                    ) {
                        const preCache = new Image();
                        preCache.src = url;
                        preCache.onload = () => resolve();
@@ -95,7 +100,9 @@ export default {
    mutations: {
        [ChatStore.MUTATION_SHOW_CHAT](state, isSingle?: boolean) {
            state[ChatStore.STATE_CHAT_DIALOG_VISIBLE] = true;
-            isSingle ? state[ChatStore.STATE_CHAT_DIALOG_IS_SINGLE] = true : state[ChatStore.STATE_CHAT_DIALOG_IS_SINGLE] = false;
+            isSingle
+                ? (state[ChatStore.STATE_CHAT_DIALOG_IS_SINGLE] = true)
+                : (state[ChatStore.STATE_CHAT_DIALOG_IS_SINGLE] = false);
        },
        [ChatStore.MUTATION_HIDE_CHAT](state) {
            state[ChatStore.STATE_CHAT_DIALOG_VISIBLE] = false;
@@ -234,6 +241,10 @@ export default {
            ] as ChatStore.STATE_CHAT_SENDING_MESSAGE[];
            if (current) {
                current.push(payload);
+                const chat = state[
+                    ChatStore.STATE_CHAT_CURRENT_CHAT_ID
+                ] as number;
+                dbController.appendMessages(chat, [payload]);
            }
            preCacheImgs([payload]).then(() => {
                setTimeout(() => {
@@ -272,7 +283,7 @@ export default {
                state[ChatStore.STATE_CHAT_SENDING_MESSAGES] = [...current];
            }
        },
-        [ChatStore.MUTATION_SAVE_CURRENT_CHAT_INPUTING]: (function() {
+        [ChatStore.MUTATION_SAVE_CURRENT_CHAT_INPUTING]: (function () {
            const setTimeoutId: { [key: string]: number } = {};
            return (
                state: ChatStoreState,
@@ -312,7 +323,10 @@ export default {
        [ChatStore.MUTATION_CHAT_UPDATE_USER_TYPE]: (state, v: string) => {
            state[ChatStore.STATE_CHAT_CURRENT_USER_TYPE] = v;
        },
-        [ChatStore.MUTATION_SAVE_USERNAME]: (state, param: {id: string, name: string}) => {
+        [ChatStore.MUTATION_SAVE_USERNAME]: (
+            state,
+            param: { id: string; name: string }
+        ) => {
            Vue.set(state[ChatStore.STATE_CHAT_USERNAME], param.id, param.name);
        },
    },
@@ -321,27 +335,39 @@ export default {
            state,
            commit,
        }) /* ...params: Parameters<ChatStore.ACTION_GET_MY_CHAT_LIST> */ {
+            const cache = await dbController.getChatList();
+            if (cache && cache.length) {
+                commit(ChatStore.MUTATION_SAVE_CHAT_LIST, {
+                    list: cache,
+                    total: 9999,
+                });
+                return cache;
+            }
            const data = await xim.fetchChatList();
            if (data == null) return;
            const chatList = data.args[0];
-            console.log("chatList:", chatList);
+            const items = chatList.map((chat: any) => {
+                let business_data;
+                if (chat.business_data) {
+                    business_data = JSON.parse(chat.business_data);
+                }
+                if (business_data?.model_name == null) {
+                    business_data = null;
+                }
+                return {
+                    ...chat,
+                    chat_id: chat.id,
+                    business_data,
+                } as ChatType;
+            });
+            dbController.saveChatList(items);
            commit(ChatStore.MUTATION_SAVE_CHAT_LIST, {
-                list: chatList.map((chat: any) => {
+                list: items,
-                    let business_data;
-                    if (chat.business_data) {
-                        business_data = JSON.parse(chat.business_data);
-                    }
-                    if (business_data?.model_name == null) {
-                        business_data = null;
-                    }
-                    return {
-                        ...chat,
-                        chat_id: chat.id,
-                        business_data,
-                    } as ChatType;
-                }),
                total: 9999,
            });
+            return items;
        },
        // async [ChatStore.ACTION_JOIN_CHAT](
        //     { commit },
@@ -352,9 +378,21 @@ export default {
        async [ChatStore.ACTION_GET_CHAT_MESSAGES]({ state, commit }) {
            const chatId = state[ChatStore.STATE_CHAT_CURRENT_CHAT_ID];
            if (chatId == null) return;
+            let data: Message[] = [];
+            const cache = await dbController.getChatMessages(chatId);
+            if (cache && cache.length) {
+                data = cache;
+            } else {
+                data = await xim.queryLastPageMsg(
+                    chatType,
+                    chatId,
+                    20,
+                    !state[ChatStore.STATE_CHAT_CURRENT_IS_CHAT_MEMBER]
+                );
+            }
            try {
-                const data = await xim.queryLastPageMsg(chatType, chatId, 20, !state[ChatStore.STATE_CHAT_CURRENT_IS_CHAT_MEMBER]);
                commit(ChatStore.MUTATION_PUSH_CHAT_MSG_HISTORY, data);
+                dbController.saveChatMessages(chatId, data);
                await preCacheImgs(data);
                commit(ChatStore.MUTATION_SCROLL_TO_BOTTOM);
                return data;
@@ -377,6 +415,7 @@ export default {
                !state[ChatStore.STATE_CHAT_CURRENT_IS_CHAT_MEMBER]
            );
            commit(ChatStore.MUTATION_UNSHIFT_CHAT_MSG_HISTORY, data);
+            dbController.appendMessages(chatId, data);
            return data;
        },
        async [ChatStore.ACTION_GET_CHAT_MESSAGES_AFTER_SPECIFIC_ID](
@@ -393,6 +432,7 @@ export default {
                !state[ChatStore.STATE_CHAT_CURRENT_IS_CHAT_MEMBER]
            );
            commit(ChatStore.MUTATION_PUSH_CHAT_MSG_HISTORY, data);
+            dbController.appendMessages(chatId, data);
            return data;
        },
        async [ChatStore.ACTION_SEND_MESSAGE](
@@ -403,8 +443,8 @@ export default {
                state[ChatStore.STATE_CHAT_CURRENT_CHAT_UNIPLAT_ID];
            if (uniplatId == null) return;
            try {
+                const { business_data } =
-                const { business_data } = getters[ChatStore.GETTER_CURRENT_CURRENT_CHAT];
+                    getters[ChatStore.GETTER_CURRENT_CURRENT_CHAT];
                const data = await sdk()
                    .model(business_data.model_name)
                    .chat(Number(business_data.obj_id), orgId())
@@ -414,7 +454,10 @@ export default {
                return data;
            } catch (error) {
                // eslint-disable-next-line no-console
-                commit(ChatStore.MUTATION_SAVE_SEND_FAIL_MESSAGE, JSON.stringify(params))
+                commit(
+                    ChatStore.MUTATION_SAVE_SEND_FAIL_MESSAGE,
+                    JSON.stringify(params)
+                );
                console.error("testing 信息发送失败", error);
            }
        },
@@ -448,7 +491,10 @@ export default {
            const chatId = Number(imChatId);
            await dispatch(ChatStore.ACTION_GET_MY_CHAT_LIST);
            commit(ChatStore.MUTATION_SHOW_CHAT, !params.showByPage);
-            await dispatch(ChatStore.ACTION_SAVE_CURRENT_CHAT_ID_VERSION, chatId);
+            await dispatch(
+                ChatStore.ACTION_SAVE_CURRENT_CHAT_ID_VERSION,
+                chatId
+            );
        },
        async [ChatStore.ACTION_CREATE_NEW_CHAT_BY_CLIENT](
            { commit, dispatch },
@@ -460,7 +506,10 @@ export default {
                .createChat(true);
            const chatId = Number(imChatId);
            await commit(ChatStore.MUTATION_SHOW_CHAT, true);
-            await dispatch(ChatStore.ACTION_SAVE_CURRENT_CHAT_ID_VERSION, chatId);
+            await dispatch(
+                ChatStore.ACTION_SAVE_CURRENT_CHAT_ID_VERSION,
+                chatId
+            );
        },
        async [ChatStore.ACTION_REGISTER_EVENT]({ dispatch, commit, state }) {
            const onNewMsg = (e: Message) => {
@@ -527,12 +576,14 @@ export default {
            if (!chatId) {
                return;
            }
-            const chatList = state[ChatStore.STATE_MY_CHAT_ROOM_LIST]?.list ?? [];
+            const chatList =
-            let wantedChatRoom = chatList.find(
+                state[ChatStore.STATE_MY_CHAT_ROOM_LIST]?.list ?? [];
-                (k) => k.chat_id === chatId
+            let wantedChatRoom = chatList.find((k) => k.chat_id === chatId);
-            );
-            if (wantedChatRoom == null || wantedChatRoom.business_data == null) {
+            if (
+                wantedChatRoom == null ||
+                wantedChatRoom.business_data == null
+            ) {
                const data = await xim.fetchChat(chatId);
                if (!data) {
                    return;
@@ -568,16 +619,25 @@ export default {
            commit(ChatStore.MUTATION_CLEAR_CHAT_MSG_HISTORY);
            commit(ChatStore.MUTATION_SAVE_CURRENT_CHAT_ID, chatId);
-            commit(ChatStore.MUTATION_SAVE_CURRENT_CHAT_VERSION, info.uniplat_version);
+            commit(
-            commit(ChatStore.MUTATION_SAVE_CURRENT_CHAT_UNIPLAT_ID, info.uniplatId);
+                ChatStore.MUTATION_SAVE_CURRENT_CHAT_VERSION,
+                info.uniplat_version
+            );
+            commit(
+                ChatStore.MUTATION_SAVE_CURRENT_CHAT_UNIPLAT_ID,
+                info.uniplatId
+            );
            commit(ChatStore.MUTATION_INITING_CHAT);
            removeRegisterChatEvents.forEach((k) => k());
-            await dispatch(ChatStore.ACTION_GET_CHAT_MEMBERS)
+            await dispatch(ChatStore.ACTION_GET_CHAT_MEMBERS);
            await Promise.all([
                dispatch(ChatStore.ACTION_REGISTER_EVENT),
-                dispatch(ChatStore.ACTION_GET_CHAT_MESSAGES)
+                dispatch(ChatStore.ACTION_GET_CHAT_MESSAGES),
            ]);
-            commit(ChatStore.MUTATION_SAVE_CHAT_TITLE, wantedChatRoom.title || chatId);
+            commit(
+                ChatStore.MUTATION_SAVE_CHAT_TITLE,
+                wantedChatRoom.title || chatId
+            );
            commit(ChatStore.MUTATION_INITING_CHAT_DONE);
            commit(ChatStore.MUTATION_SCROLL_TO_BOTTOM);
        },
@@ -611,18 +671,22 @@ export default {
                    return result;
                })
            );
-            newChatMembers = newChatMembers.filter(it => !it.is_exited)
+            newChatMembers = newChatMembers.filter((it) => !it.is_exited);
-            const member = newChatMembers.find(it => it.eid === String(state[ChatStore.STATE_CHAT_CURRENT_USER_UID]))
+            const member = newChatMembers.find(
+                (it) =>
+                    it.eid ===
+                    String(state[ChatStore.STATE_CHAT_CURRENT_USER_UID])
+            );
            if (member) {
                commit(ChatStore.MUTATION_CHAT_UPDATE_IS_MEMBER, true);
-                commit(ChatStore.MUTATION_CHAT_UPDATE_USER_TYPE, member.type)
+                commit(ChatStore.MUTATION_CHAT_UPDATE_USER_TYPE, member.type);
            } else {
                commit(ChatStore.MUTATION_CHAT_UPDATE_IS_MEMBER, false);
-                commit(ChatStore.MUTATION_CHAT_UPDATE_USER_TYPE, "0")
+                commit(ChatStore.MUTATION_CHAT_UPDATE_USER_TYPE, "0");
            }
            commit(
                ChatStore.MUTATION_SAVE_CURRENT_CHAT_MEMBERS,
-                unique(newChatMembers, function(item, all) {
+                unique(newChatMembers, function (item, all) {
                    return all.findIndex((k) => k.eid === item.eid);
                })
            );
@@ -649,68 +713,51 @@ export default {
                firstChat.business_data.model_name,
                firstChat.business_data.obj_id
            );
-            await dispatch(ChatStore.ACTION_SAVE_CURRENT_CHAT_ID_VERSION, firstChat.chat_id);
+            await dispatch(
+                ChatStore.ACTION_SAVE_CURRENT_CHAT_ID_VERSION,
+                firstChat.chat_id
+            );
        },
-        async [ChatStore.ACTION_CHAT_START_RECEPTION](
+        async [ChatStore.ACTION_CHAT_START_RECEPTION]({ getters, dispatch }) {
-            { getters, dispatch }
-        ) {
            const currentChat = getters[ChatStore.GETTER_CURRENT_CURRENT_CHAT];
            if (currentChat == null) return;
            const { model_name, obj_id } = currentChat.business_data;
            if (model_name == null) return;
            if (obj_id == null) return;
-            await sdk()
+            await sdk().model(model_name).chat(obj_id, orgId()).startChat();
-                .model(model_name)
-                .chat(obj_id, orgId())
-                .startChat();
            await new Promise((resolve) => setTimeout(resolve, 500));
            await dispatch(ChatStore.ACTION_GET_CHAT_MEMBERS);
        },
-        async [ChatStore.ACTION_CHAT_FINISH_RECEPTION](
+        async [ChatStore.ACTION_CHAT_FINISH_RECEPTION]({ getters, dispatch }) {
-            { getters, dispatch }
-        ) {
            const currentChat = getters[ChatStore.GETTER_CURRENT_CURRENT_CHAT];
            if (currentChat == null) return;
            const { model_name, obj_id } = currentChat.business_data;
            if (model_name == null) return;
            if (obj_id == null) return;
-            await sdk()
+            await sdk().model(model_name).chat(obj_id, orgId()).finishChat();
-                .model(model_name)
-                .chat(obj_id, orgId())
-                .finishChat();
            await new Promise((resolve) => setTimeout(resolve, 500));
            await dispatch(ChatStore.ACTION_GET_CHAT_MEMBERS);
        },
-        async [ChatStore.ACTION_CHAT_USER_EXIT](
+        async [ChatStore.ACTION_CHAT_USER_EXIT]({ getters, dispatch }) {
-            { getters, dispatch }
-        ) {
            const currentChat = getters[ChatStore.GETTER_CURRENT_CURRENT_CHAT];
            if (currentChat == null) return;
            const { model_name, obj_id } = currentChat.business_data;
            if (model_name == null) return;
            if (obj_id == null) return;
-            await sdk()
+            await sdk().model(model_name).chat(obj_id, orgId()).userExitChat();
-                .model(model_name)
-                .chat(obj_id, orgId())
-                .userExitChat();
            await new Promise((resolve) => setTimeout(resolve, 500));
            await dispatch(ChatStore.ACTION_GET_CHAT_MEMBERS);
        },
-        async [ChatStore.ACTION_CHAT_CS_EXIT](
+        async [ChatStore.ACTION_CHAT_CS_EXIT]({ getters, dispatch }) {
-            { getters, dispatch }
-        ) {
            const currentChat = getters[ChatStore.GETTER_CURRENT_CURRENT_CHAT];
            if (currentChat == null) return;
            const { model_name, obj_id } = currentChat.business_data;
            if (model_name == null) return;
            if (obj_id == null) return;
-            await sdk()
+            await sdk().model(model_name).chat(obj_id, orgId()).csExitChat();
-                .model(model_name)
-                .chat(obj_id, orgId())
-                .csExitChat();
            await new Promise((resolve) => setTimeout(resolve, 500));
            await dispatch(ChatStore.ACTION_GET_CHAT_MEMBERS);
        },

--- a/store/model.ts
+++ b/store/model.ts
@@ -246,7 +246,7 @@ export namespace ChatStore {
    export const ACTION_GET_MY_CHAT_LIST = "获取我的会话列表";
    export type ACTION_GET_MY_CHAT_LIST = (
        keyword?: string
-    ) => Promise<ChatStore.STATE_MY_CHAT_ROOM_LIST>;
+    ) => Promise<ChatType[]>;
    export const ACTION_JOIN_CHAT = "加入某个会话";
    export type ACTION_JOIN_CHAT = (chatId: number) => void;

--- a/xim/index.ts
+++ b/xim/index.ts
@@ -6,6 +6,7 @@ import { ChatOption, TokenStringGetter } from "./../model";
 import { ChatLoggerService } from "./logger";
 import tokenManager from "./token";
 import xim from "./xim";
+import { dbController } from "../database";
 class Chat {
    private _sdk?: () => UniplatSdk;
@@ -30,6 +31,8 @@ class Chat {
        this._sdk = option.sdk;
        this._orgId = option.orgId;
+        dbController.setup(this._sdk().global.uid);
        this.token = async () => option.sdk().global.jwtToken;
        tokenManager.save(this.token);