msg

components/message-list.vue

@@ -198,7 +198,7 @@ export default class MessageList extends Vue {
         this.saveScrollToBottomFunc(this.scrollToNewMsg);
         this.scrollToNewMsg();
         setTimeout(() => this.scroll2End(200));
-        setTimeout(() => this.scroll2End(1000));
+        setTimeout(() => this.scroll2End(1000), 200);
     }
 
     public beforeDestroy() {

components/msg-shortcut.vue

@@ -36,6 +36,7 @@
             class="shortcut pointer"
             v-for="(reply, index) in replyList"
             :key="reply.id"
+            @dblclick="goEdit(reply)"
         >
             <span class="rep-index">{{ index + 1 }}.</span>
             <span class="rep-content" v-if="!editingItem[reply.id]">{{
@@ -49,6 +50,8 @@
                 maxlength="200"
                 minlength="2"
                 :show-word-limit="true"
+                :ref="`input-item-${reply.id}`"
+                :rows="buildRows(editingItemContent[reply.id])"
             ></el-input>
             <div class="btn-group">
                 <el-button
@@ -99,7 +102,7 @@
 </template>
 
 <script lang="ts">
-import { Component, Vue } from "vue-property-decorator";
+import { Component, Ref, Vue } from "vue-property-decorator";
 import { MessageType } from "../model";
 
 import { ChatStore, chatStore } from "../store/model";
@@ -126,6 +129,9 @@ export default class MsgShortCut extends Vue {
     @chatStore.State(ChatStore.STATE_CHAT_CURRENT_IS_CHAT_MEMBER)
     private readonly isChatMember!: ChatStore.STATE_CHAT_CURRENT_IS_CHAT_MEMBER;
 
+    @chatStore.Action(ChatStore.ACTION_GET_MY_CHAT_LIST)
+    protected readonly getMyChatList!: ChatStore.ACTION_GET_MY_CHAT_LIST;
+
     private replyList: Reply[] = [];
     private uid = this.sdk.global.uid;
     private replyInputVisible = false;
@@ -148,7 +154,7 @@ export default class MsgShortCut extends Vue {
         return this._sendMsg({
             msgType: MessageType.Text,
             msg: JSON.stringify({ text: reply.content, source: this.source }),
-        });
+        }).then(() => this.getMyChatList());
     }
 
     private delReply(reply: Reply) {
@@ -240,6 +246,22 @@ export default class MsgShortCut extends Vue {
                 this.editCancel(reply);
             });
     }
+
+    private goEdit(reply: Reply) {
+        this.editing(reply);
+        this.$nextTick(() => {
+            const e = (this.$refs as any)[`input-item-${reply.id}`] as {
+                focus: () => void;
+            }[];
+            if (e && e.length) {
+                e[0].focus();
+            }
+        });
+    }
+
+    private buildRows(content: string) {
+        return Math.round(content.length / 18);
+    }
 }
 </script>
 <style lang="less" scoped>