update

src/components/artist-information/personal-information/PersonalInformation.ts

 import { defineComponent, ref, Ref } from 'vue';
 import { i18n } from 'src/boot/i18n';
-import { isEmail } from '../../../boot/functions';
-import { isMobilePhone } from '../../../boot/functions';
 import UploadImage from '../../upload-image/index.vue';
 import moment from 'moment';
 export default defineComponent({
@@ -45,6 +43,8 @@ export default defineComponent({
     workRules: { type: Boolean, required: true },
     qualificationRules: { type: Boolean, required: true },
     artistLevelRules: { type: Boolean, required: true },
+    errorMessPhoneNumber: { type: String, required: true },
+    errorMessEmail: { type: String, required: true },
   },
   components: {
     UploadImage,
@@ -121,12 +121,6 @@ export default defineComponent({
     const errorMessArtistLevel = i18n.global.t(
       'artist.artistInformation.validateMessages.requireArtistLevel'
     );
-    const errorMessPhoneNumber = i18n.global.t(
-      'artist.artistInformation.validateMessages.requirePhoneNumber'
-    );
-    const errorMessEmail = i18n.global.t(
-      'artist.artistInformation.validateMessages.requireEmail'
-    );
 
     return {
       upload,
@@ -150,8 +144,6 @@ export default defineComponent({
       errorMessWorks,
       errorMessQualification,
       errorMessArtistLevel,
-      errorMessPhoneNumber,
-      errorMessEmail,
     };
   },
   emits: [

src/pages/cap-nhat-thong-tin-nghe-sy/index.vue

@@ -14,7 +14,15 @@
           <q-tab
             name="information"
             :label="$t('artist.artistInformation.tabLabel.personalInformation')"
-          />
+          >
+            <!-- <template v-slot:default>
+              <q-icon
+                style="position: absolute; top: 5px; right: -16px"
+                name="mdi-alert"
+                color="red"
+              ></q-icon>
+            </template> -->
+          </q-tab>
           <q-tab
             name="vabAccount"
             :label="$t('artist.artistInformation.tabLabel.vabAccout')"
@@ -52,6 +60,8 @@
               v-model:facebook-message="facebookMessage"
               v-model:instagram="instagram"
               v-model:whatsapp="whatsapp"
+              :errorMessPhoneNumber="errorMessPhoneNumber"
+              :errorMessEmail="errorMessEmail"
               :artistCodeRules="artistCodeRules"
               :fullNameRules="fullNameRules"
               :artistNameRules="artistNameRules"

src/pages/cap-nhat-thong-tin-nghe-sy/updateInformationArtist.ts

@@ -36,14 +36,13 @@ import {
   TypeCardType,
   FileUploadType,
 } from 'src/assets/type';
+import { isEmail } from '../../boot/functions';
+import { isMobilePhone } from '../../boot/functions';
 
 export type AvatarType = {
   file?: File;
   url?: string | null;
 };
-// export type Story = {
-//   story?:object |
-// };
 export default defineComponent({
   components: {
     PersonalInformation,
@@ -141,6 +140,14 @@ export default defineComponent({
     const workRules = ref(false);
     const qualificationRules = ref(false);
     const artistLevelRules = ref(false);
+    const errorMessEmail = ref(
+      i18n.global.t('artist.artistInformation.validateMessages.requireEmail')
+    );
+    const errorMessPhoneNumber = ref(
+      i18n.global.t(
+        'artist.artistInformation.validateMessages.requirePhoneNumber'
+      )
+    );
     watch(
       () => artistCode.value,
       (value) => {
@@ -286,7 +293,6 @@ export default defineComponent({
       schedules.value = ArtistInformation.schedules;
       for (let index = 0; index < schedules.value.length; index++) {
         const element = schedules.value[index];
-
         formatSchedules.value.push(
           moment(element.scheduleTime, 'DD/MM/YYYY HH:mm:ss').format(
             'YYYY/MM/DD'
@@ -611,11 +617,33 @@ export default defineComponent({
       if (!phoneNumber.value || !phoneNumber.value?.trim().length) {
         hasError = true;
         phoneNumberRules.value = true;
+        errorMessPhoneNumber.value = i18n.global.t(
+          'artist.artistInformation.validateMessages.requirePhoneNumber'
+        );
+      }
+
+      if (!isMobilePhone(phoneNumber.value as string)) {
+        hasError = true;
+        phoneNumberRules.value = true;
+        errorMessPhoneNumber.value = i18n.global.t(
+          'artist.artistInformation.validateMessages.isPhone'
+        );
       }
       if (!email.value || !email.value?.trim().length) {
         hasError = true;
         emailRules.value = true;
+        errorMessEmail.value = i18n.global.t(
+          'artist.artistInformation.validateMessages.requireEmail'
+        );
       }
+      if (!isEmail(email.value as string)) {
+        hasError = true;
+        emailRules.value = true;
+        errorMessEmail.value = i18n.global.t(
+          'artist.artistInformation.validateMessages.isEmail'
+        );
+      }
+
       if (artistLevel.value === null) {
         hasError = true;
         artistLevelRules.value = true;
@@ -818,6 +846,8 @@ export default defineComponent({
       workRules,
       qualificationRules,
       artistLevelRules,
+      errorMessEmail,
+      errorMessPhoneNumber,
     };
   },
 });

src/pages/nghe-sy/artist.ts

@@ -14,6 +14,7 @@ import Pagination from 'components/pagination/index.vue';
 import { api, BaseResponseBody } from 'src/boot/axios';
 import { API_PATHS, config } from 'src/assets/configurations';
 import { AxiosResponse } from 'axios';
+
 export default defineComponent({
   components: {
     Pagination,
@@ -170,28 +171,7 @@ export default defineComponent({
           console.log(response.data.data);
         }
       } catch (error) {}
-      // userTableRowsArtist.value = fakeData;
     };
-    // const filterListArtist = async () => {
-    //   try {
-    //     const response = (await api({
-    //       url: API_PATHS.getListArtists,
-    //       method: 'GET',
-    //       params: {
-    //         pageIndex: pageIndex.value,
-    //         pageSize: pageSize.value,
-    //         name: fullNameKeyword.value,
-
-    //       },
-    //     })) as AxiosResponse<
-    //       BaseResponseBody<PaginationResponse<ArtistInfoType>>
-    //     >;
-    //     if (response.data.error.code === config.API_RES_CODE.OK.code) {
-    //       userTableRowsArtist.value = response.data.data.data;
-    //       totalPage.value = response.data.data.totalPages;
-    //     }
-    //   } catch (error) {}
-    // };
     const changePageSize = () => {
       pageIndex.value = 1;
       void getListArtists();
@@ -317,7 +297,6 @@ export default defineComponent({
       instagram,
       whatsapp,
       sexOptions,
-      // filterListArtist,
       totalPage,
       changePageSize,
       fullNameKeyword,