调整日记评论面板跟随键盘并保留输入草稿

weapp/pages/diary_detail/diary_detail.js

@@ -12,6 +12,12 @@ Page(withDataCache({
     hasMoreComments: true,
     showCommentInput: false,
     commentText: '',
+    commentInitialText: '',
+    commentLength: 0,
+    commentFocus: false,
+    commentKeyboardHeight: 0,
+    commentEditorHeight: 56,
+    commentSending: false,
     replyTo: null,
     coverSwiperIndex: 0,
     previewImages: [],
@@ -119,28 +125,49 @@ Page(withDataCache({
   onPreviewSwiperChange: function(e) { this.setData({ previewIndex: e.detail.current }); },
 
   onCommentTap: function() {
-    this.setData({ showCommentInput: true, replyTo: null, commentText: '' });
+    this.openComment(null);
   },
   onReplyTap: function(e) {
     var item = e.currentTarget.dataset.item;
-    this.setData({
-      showCommentInput: true,
-      replyTo: { id: item.id, user_id: item.user_id, nickname: item.nickname },
-      commentText: ''
-    });
+    this.openComment({ id: item.id, user_id: item.user_id, nickname: item.nickname });
+  },
+  openComment: function(replyTo) {
+    var sameTarget = (!replyTo && !this.data.replyTo) ||
+      (replyTo && this.data.replyTo && replyTo.id === this.data.replyTo.id);
+    var text = sameTarget ? this.data.commentText : '';
+    this.setData({ showCommentInput: true, replyTo: replyTo, commentText: text,
+      commentInitialText: text, commentLength: text.length, commentFocus: true,
+      commentKeyboardHeight: 0, commentEditorHeight: 56 });
   },
-
   onCommentInput: function(e) {
-    this.setData({ commentText: e.detail.value });
+    // 不把正文反复写回原生输入框，避免中文输入时光标跳动。
+    this.data.commentText = e.detail.value || '';
+    this.setData({ commentLength: this.data.commentText.length });
+  },
+  onCommentKeyboardHeight: function(e) {
+    var height = Math.max(0, Number(e.detail.height) || 0);
+    if (this.data.showCommentInput) this.setData({ commentKeyboardHeight: height });
+  },
+  onCommentLineChange: function(e) {
+    this.setData({ commentEditorHeight: Math.min(160, Math.max(56, Number(e.detail.height) || 56)) });
+  },
+  onCommentBlur: function() {
+    this.setData({ commentFocus: false });
   },
-
   cancelComment: function() {
-    this.setData({ showCommentInput: false, replyTo: null, commentText: '' });
+    if (this.data.commentSending) return;
+    this.setData({ showCommentInput: false, commentFocus: false, commentKeyboardHeight: 0 });
+    wx.hideKeyboard();
+  },
+  onHide: function() {
+    this.setData({ showCommentInput: false, commentFocus: false, commentKeyboardHeight: 0 });
   },
 
   submitComment: async function() {
+    if (this.data.commentSending) return;
     var text = this.data.commentText.trim();
     if (!text) { wx.showToast({ title: '请输入评论内容', icon: 'none' }); return; }
+    this.setData({ commentSending: true });
     try {
       var params = { diary_id: this.data.diaryId, content: text };
       if (this.data.replyTo) {
@@ -166,12 +193,19 @@ Page(withDataCache({
           showCommentInput: false,
           replyTo: null,
           commentText: '',
+          commentInitialText: '',
+          commentLength: 0,
+          commentFocus: false,
+          commentKeyboardHeight: 0,
           'diary.comment_count': (this.data.diary.comment_count || 0) + 1
         });
+        wx.hideKeyboard();
         wx.showToast({ title: '评论成功', icon: 'success' });
       }
     } catch (e) {
       wx.showToast({ title: e.error || '评论失败', icon: 'none' });
+    } finally {
+      this.setData({ commentSending: false });
     }
   },