feat(ContactEdit): show error message in field (#5437)

src/contact-edit/index.js

@@ -1,7 +1,6 @@
 import { createNamespace } from '../utils';
 import Button from '../button';
 import Field from '../field';
-import Toast from '../toast';
 import Dialog from '../dialog';
 import Switch from '../switch';
 import Cell from '../cell';
@@ -38,8 +37,8 @@ export default createComponent({
         ...this.contactInfo
       },
       errorInfo: {
-        name: false,
-        tel: false
+        name: '',
+        tel: ''
       }
     };
   },
@@ -55,14 +54,14 @@ export default createComponent({
 
   methods: {
     onFocus(key) {
-      this.errorInfo[key] = false;
+      this.errorInfo[key] = '';
     },
 
     getErrorMessageByKey(key) {
       const value = this.data[key].trim();
       switch (key) {
         case 'name':
-          return value ? '' : t('nameEmpty');
+          return value ? '' : t('nameInvalid');
         case 'tel':
           return this.telValidator(value) ? '' : t('telInvalid');
       }
@@ -72,8 +71,7 @@ export default createComponent({
       const isValid = ['name', 'tel'].every(item => {
         const msg = this.getErrorMessageByKey(item);
         if (msg) {
-          this.errorInfo[item] = true;
-          Toast(msg);
+          this.errorInfo[item] = msg;
         }
         return !msg;
       });
@@ -105,7 +103,7 @@ export default createComponent({
             maxlength="30"
             label={t('name')}
             placeholder={t('nameEmpty')}
-            error={errorInfo.name}
+            errorMessage={errorInfo.name}
             onFocus={onFocus('name')}
           />
           <Field
@@ -114,7 +112,7 @@ export default createComponent({
             type="tel"
             label={t('tel')}
             placeholder={t('telEmpty')}
-            error={errorInfo.tel}
+            errorMessage={errorInfo.tel}
             onFocus={onFocus('tel')}
           />
         </div>

src/locale/lang/en-US.ts

@@ -9,6 +9,7 @@ export default {
   loading: 'Loading...',
   telEmpty: 'Please fill in the tel',
   nameEmpty: 'Please fill in the name',
+  nameInvalid: 'Malformed name',
   confirmDelete: 'Are you sure you want to delete?',
   telInvalid: 'Malformed phone number',
   vanCalendar: {

src/locale/lang/es-ES.ts

@@ -9,6 +9,7 @@ export default {
   loading: 'Cargando...',
   telEmpty: 'Por favor rellena el teléfono',
   nameEmpty: 'Por favor rellena el nombre',
+  nameInvalid: 'nombre inválido',
   confirmDelete: 'Estás seguro de eliminarlo?',
   telInvalid: 'Teléfono inválido',
   vanCalendar: {

src/locale/lang/tr-TR.ts

@@ -9,6 +9,7 @@ export default {
   loading: 'Yükleniyor...',
   telEmpty: 'Lütfen tel. no giriniz',
   nameEmpty: 'Lütfen isim giriniz',
+  nameInvalid: 'Geçersiz isim',
   confirmDelete: 'Silmek istediğinize emin misiniz?',
   telInvalid: 'Geçersiz tel. numarası',
   vanCalendar: {

src/locale/lang/zh-CN.ts

@@ -9,8 +9,9 @@ export default {
   loading: '加载中...',
   telEmpty: '请填写电话',
   nameEmpty: '请填写姓名',
+  nameInvalid: '请输入正确的姓名',
   confirmDelete: '确定要删除么',
-  telInvalid: '请填写正确的电话',
+  telInvalid: '请输入正确的手机号',
   vanCalendar: {
     end: '结束',
     start: '开始',

src/locale/lang/zh-HK.ts

@@ -9,6 +9,7 @@ export default {
   loading: '加載中...',
   telEmpty: '請填寫電話',
   nameEmpty: '請填寫姓名',
+  nameInvalid: '請輸入正確的姓名',
   confirmDelete: '確定要刪除麽',
   telInvalid: '請填寫正確的電話',
   vanCalendar: {

src/locale/lang/zh-TW.ts

@@ -9,6 +9,7 @@ export default {
   loading: '載入中...',
   telEmpty: '請填寫電話',
   nameEmpty: '請填寫姓名',
+  nameInvalid: '請輸入正確的姓名',
   confirmDelete: '確定要刪除嗎',
   telInvalid: '請填寫正確的電話',
   vanCalendar: {