src/App.vue

@@ -97,7 +97,7 @@ export default {
           this.$router.push({ name: this.$route.name })
         }
       }).catch(err => {
-        this.$setErrorMessage(err.response.data.msg)
+        this.$setErrorMessage(err)
         this.$router.push({ name: 'home' })
       })
     }

src/components/Discussion/CommentToolBar.vue

@@ -13,8 +13,8 @@
       <c-button v-if="isOwn" @click="handleDeleteComment" theme="red" text icon="delete">删除留言</c-button>
     </div>
     <show-transition-small>
-      <div v-if="replyInputShow && !reply" class="reply-input-wrapper vertical-center">
-        <c-input placeholder="在此输入回复内容" v-model="replyContent"></c-input>
+      <div v-show="replyInputShow && !reply" class="reply-input-wrapper vertical-center">
+        <input ref="reply" placeholder="在此输入回复内容" v-model="replyContent">
         <icon-button :size="32" @click="handleReply" theme="green">send</icon-button>
       </div>
     </show-transition-small>
@@ -24,27 +24,42 @@
 <script>
 import IconButton from '@/components/Basic/IconButton'
 import { mapState } from 'vuex'
-import CInput from '@/components/Basic/CInput'
 import CButton from '@/components/Basic/CButton'
 import ShowTransitionSmall from '@/animations/ShowTransitionSmall'
+import { FOCUS_ON_INPUT, USE_FOCUS } from '@/store/types/pdf-types'
 
 export default {
   props: {
     userId: Number,
     reply: String,
-    topNumber: Number || String,
+    topNumber: [Number, String],
     personal: Boolean
   },
-  components: { ShowTransitionSmall, CButton, CInput, IconButton },
+  components: { ShowTransitionSmall, CButton, IconButton },
   data () {
     return {
       replyInputShow: false,
       replyContent: ''
     }
   },
+  watch: {
+    replyInputShow () {
+      if (this.replyInputShow) {
+        this.$store.commit(FOCUS_ON_INPUT)
+      } else {
+        this.$store.commit(USE_FOCUS)
+      }
+    },
+    focus (newValue) {
+      if (this.replyInputShow && !newValue) {
+        this.replyInputShow = false
+      }
+    }
+  },
   computed: {
     ...mapState({
-      userInfo: state => state.main.userInfo
+      userInfo: state => state.main.userInfo,
+      focus: state => state.pdf.focus
     }),
     isOwn () {
       return this.userId === this.userInfo.id
@@ -55,6 +70,9 @@ export default {
   },
   methods: {
     handleShowHideReplyInput () {
+      setTimeout(() => {
+        this.$refs.reply.focus()
+      }, 10)
       this.replyInputShow = !this.replyInputShow
     },
     handleReply () {
@@ -100,7 +118,7 @@ export default {
 }
 
 .reply-input-wrapper {
-  .c-input {
+  input {
     background-color: rgba(255, 255, 255, 0.5);
     height: 36px;
     font-size: 14px;
@@ -111,4 +129,28 @@ export default {
     margin: 0 12px 0 8px;
   }
 }
+
+input, textarea {
+  box-sizing: border-box;
+  font-size: 16px;
+  font-weight: bold;
+  color: #3a4a5a;
+  background: $input-background-color;
+  border-radius: 8px;
+  border: none;
+  outline: none;
+  width: 100%;
+  height: 40px;
+  line-height: 1.5;
+  padding: 0 12px 0 12px;
+  transition: .2s;
+
+  &:hover {
+    background: $input-hover-background-color;
+  }
+
+  &::placeholder {
+    color: #8a9aaa;
+  }
+}
 </style>

src/components/DiscussionTab/CMessage.vue

@@ -6,11 +6,11 @@
     <div v-show="edit">
       <div class="left-content">
         <icon-button v-if="!read" theme="blue" class="archive-button"
-                     :class="toArchive ? 'archive-button--pointerActive' : ''"
+                     :class="toArchive ? 'archive-button--active' : ''"
                      title="设置为已读" @click.native.stop="handleArchiveButtonClick" :size="32">
           archive
         </icon-button>
-        <icon-button class="delete-button" theme="red" :class="toDelete ? 'delete-button--pointerActive' : ''"
+        <icon-button class="delete-button" theme="red" :class="toDelete ? 'delete-button--active' : ''"
                      title="删除" @click.native.stop="handleDeleteButtonClick" :size="32">
           delete
         </icon-button>

src/components/PDF/Pdf.vue

@@ -127,7 +127,6 @@ export default {
   direction: ltr;
   margin: 0 auto;
   background-color: white;
-
   max-width: 100vw;
   max-height: 100vh;
 }

src/views/shared/Discussion.vue

@@ -6,7 +6,7 @@
         v-if="(unreadMessage && !showRead && unreadMessage.length) || (readMessage && showRead && readMessage.length)">
         <c-button :left="8" text icon="playlist_add_check" :theme="editMode ? 'orange' : 'normal'"
                   @click="handleToggleEditMode"
-                  title="点击启动 / 关闭编辑模式">{{editMode ? '编辑模式' : '浏览模式'}}
+                  title="点击启动 / 关闭编辑模式">编辑模式
         </c-button>
       </template>
     </h1>