MessageBox: allow showInput when message is empty (#10337)

* MessageBox: should allow showInput when message is empty

* MessageBox: no confirm when inputType === 'textarea'

* MessageBox: hide status when message is empty

packages/message-box/src/main.vue

@@ -12,7 +12,7 @@
       <div class="el-message-box" :class="[customClass, center && 'el-message-box--center']">
         <div class="el-message-box__header" v-if="title !== null">
           <div class="el-message-box__title">
-            <div class="el-message-box__status" :class="[ typeClass ]" v-if="typeClass && center"></div>
+            <div class="el-message-box__status" :class="[ typeClass ]" v-if="typeClass && center && message !== ''"></div>
             <span>{{ title }}</span>
           </div>
           <button type="button"
@@ -25,9 +25,9 @@
             <i class="el-message-box__close el-icon-close"></i>
           </button>
         </div>
-        <div class="el-message-box__content" v-if="message !== ''">
+        <div class="el-message-box__content">
           <div class="el-message-box__status" :class="[ typeClass ]" v-if="typeClass && !center"></div>
-          <div class="el-message-box__message">
+          <div class="el-message-box__message" v-if="message !== ''">
             <slot>
               <p v-if="!dangerouslyUseHTMLString">{{ message }}</p>
               <p v-else v-html="message"></p>
@@ -37,7 +37,7 @@
             <el-input
               v-model="inputValue"
               :type="inputType"
-              @keydown.enter.native="handleAction('confirm')"
+              @keydown.enter.native="handleInputEnter()"
               :placeholder="inputPlaceholder"
               ref="input"></el-input>
             <div class="el-message-box__errormsg" :style="{ visibility: !!editorErrorMessage ? 'visible' : 'hidden' }">{{ editorErrorMessage }}</div>
@@ -183,6 +183,12 @@
         }
       },
 
+      handleInputEnter() {
+        if (this.inputType !== 'textarea') {
+          return this.handleAction('confirm');
+        }
+      },
+
       handleAction(action) {
         if (this.$type === 'prompt' && action === 'confirm' && !this.validate()) {
           return;