update

src/components/artist-information/VAB-account/VabAccount.ts

@@ -11,7 +11,7 @@ export default defineComponent({
 
   props: {
     id: { number: String, required: true },
-    account: { type: String, required: true },
+  
     banners: { type: Array as PropType<BannerType[]>, required: true },
     shortDescription: { type: Array, required: true },
     socialEmbedded: { type: Array, required: true },
@@ -37,13 +37,7 @@ export default defineComponent({
     const slide = ref(0);
     const slideStory = ref(0);
     const editor = ref('Customize it.');
-    const accountRules = [
-      (val?: string) =>
-        (val && val.trim().length) ||
-        i18n.global.t(
-          'artist.artistInformation.validateMessages.requireAccount'
-        ),
-    ];
+
     const uploadBanner = (value: FileList) => {
       context.emit('selectedFile', encodeImageFileAsURL(value[0]));
       Notify.create({
@@ -110,7 +104,7 @@ export default defineComponent({
       slide,
       slideStory,
       editor,
-      accountRules,
+    
       uploadBanner,
       deleteImage,
       deleteStory,
@@ -121,7 +115,7 @@ export default defineComponent({
     };
   },
   emits: [
-    'update:account',
+
     'update:shortDescription',
     'update:formatSchedules',
     'selectedFile',

src/components/artist-information/VAB-account/index.vue

@@ -3,35 +3,7 @@
     class="row q-col-gutter-sm q-mt-md"
     style="max-height: calc(100vh - 15rem)"
   >
-    <div class="col-auto flex flex-center justify-start">
-      <div>Tên đăng nhập</div>
-    </div>
-    <div class="col-2 flex flex-center">
-      <q-input
-        v-if="id"
-        :model-value="account"
-        @update:model-value="$emit('update:account', $event)"
-     
-        type="text"
-        dense
-        readonly
-        hide-bottom-space
-        outlined
-      ></q-input>
-      <q-input
-        v-else
-        :model-value="account"
-        @update:model-value="$emit('update:account', $event)"
-   
-        type="text"
-        dense
-        hide-bottom-space
-        outlined
-      ></q-input>
-    </div>
-    <div class="col-auto" style="margin-top: 2px">
-      <q-btn color="primary" no-caps label="Reset Pass"></q-btn>
-    </div>
+    
     <div class="col-12 flex q-mt-sm">
       <div class="text-uppercase text-weight-medium">Thông tin profile</div>
       <q-space />

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

@@ -53,7 +53,9 @@ export default defineComponent({
     emailRules: { type: Boolean, required: true },
     emailAdministerRules: { type: Boolean, required: true },
     phoneNumberAdministerRules: { type: Boolean, required: true },
-    // addressRules: { type: Boolean, required: true },
+    addressRules: { type: Boolean, required: true },
+    account: { type: String, required: true },
+    accountRules:{type:Boolean, required: true},
     phoneNumberRules: { type: Boolean, required: true },
     sexRules: { type: Boolean, required: true },
     nationalityRules: { type: Boolean, required: true },
@@ -68,6 +70,7 @@ export default defineComponent({
     errorMessmnBookingEmail: { type: String, required: true },
     mnBookingEmailRules: { type: Boolean, required: true },
     mnBookingPhoneRules: { type: Boolean, required: true },
+    // errorMessAccount:  { type: String, required: true },
   },
   components: {
     UploadImage,
@@ -117,7 +120,9 @@ export default defineComponent({
       openDialog.value = false;
     };
       
-
+ 
+   const errorMessAccount = i18n.global.t( 'artist.artistInformation.validateMessages.requireAccount'
+   );
     const errorMessArtistCode = i18n.global.t(
       'artist.artistInformation.validateMessages.requireArtistCode'
     );
@@ -130,15 +135,16 @@ export default defineComponent({
     const errorMessBirthday = i18n.global.t(
       'artist.artistInformation.validateMessages.requireBirthday'
     );
+  
     const errorMessSex = i18n.global.t(
       'artist.artistInformation.validateMessages.requireSex'
     );
     const errorMessNationality = i18n.global.t(
       'artist.artistInformation.validateMessages.requireNationality'
     );
-    // const errorMessAddress = i18n.global.t(
-    //   'artist.artistInformation.validateMessages.requireAddress'
-    // );
+    const errorMessAddress = i18n.global.t(
+      'artist.artistInformation.validateMessages.requireAddress'
+    );
     const errorMessFields = i18n.global.t(
       'artist.artistInformation.validateMessages.requireField'
     );
@@ -166,11 +172,13 @@ export default defineComponent({
       onCancelClick,
       errorMessArtistCode,
       errorMessFullName,
+      errorMessAccount,
       errorMessArtistName,
       errorMessBirthday,
       errorMessSex,
       errorMessNationality,
-      // errorMessAddress,
+  
+      errorMessAddress,
       errorMessFields,
       errorMessWorks,
       errorMessQualification,
@@ -211,6 +219,7 @@ export default defineComponent({
     'update:mnIns',
     'update:mnWhatsapp',
     'update:musics',
+    'update:account',
     'addNewArtist',
     'SetAvatar',
     'deleteAvatar',

src/components/artist-information/personal-information/index.vue

@@ -70,6 +70,28 @@
           </div>
         </div>
       </div>
+    <div class="row flex-center">
+     <div class="col-3 text-weight-medium" >
+      <div>Tên đăng nhập <span style="color: red">*</span></div>
+    </div>
+  <div class="col-8">
+      <q-input
+        :model-value="account"
+        @update:model-value="$emit('update:account', $event)"
+         :error="accountRules"
+        :error-message="errorMessAccount"
+         class="q-my-sm"
+        dense
+        hide-bottom-space
+       outlined
+      ></q-input>
+  </div>
+
+    </div>
+    <!-- <div class="col-auto" style="margin-top: 2px">
+      <q-btn color="primary" no-caps label="Reset Pass"></q-btn>
+    </div> -->
+
       <div class="row flex-center">
         <div class="col-3 text-weight-medium">
           {{ $t('artist.artistInformation.titleDataField.artistCode') }}
@@ -222,10 +244,11 @@
         </div>
 
         <div class="col-8">
-              <q-select
+          <q-select
             :model-value="address"
             @update:model-value="$emit('update:address', $event)"
-           
+             :error="addressRules"
+            :error-message="errorMessAddress"
             :options="provinceOptions"
             option-value="fullName"
             option-label="fullName"

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

@@ -34,6 +34,7 @@
           <PersonalInformation
            v-model:musics="musics"
             :id="id"
+           v-model:account="account"
             v-model:artist-code="artistCode"
             :avatar="avatar"
             v-model:full-name="fullName"
@@ -64,6 +65,7 @@
             v-model:mn-whatsapp="mnWhatsapp"
             v-model:favorite-score="favoriteScore"
             v-model:check_infoBooking="check_infoBooking"
+             :accountRules="accountRules"
             :errorMessmnBookingPhone="errorMessmnBookingPhone"
             :errorMessmnBookingEmail="errorMessmnBookingEmail"
             :mnBookingEmailRules="mnBookingEmailRules"
@@ -98,7 +100,7 @@
         </q-tab-panel>
         <q-tab-panel name="vabAccount">
           <VabAccount
-            v-model:account="account"
+          
             v-model:short-description="shortDescription"
             v-model:format-schedules="formatSchedules"
             :id="route.params.id"

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

@@ -170,7 +170,8 @@ export default defineComponent({
     const qualificationRules = ref(false);
     const artistLevelRules = ref(false);
     const musicRules = ref(false);
-    const errorMessEmail = ref(
+    const accountRules = ref(false);
+   const errorMessEmail = ref(
       i18n.global.t('artist.artistInformation.validateMessages.requireEmail')
     );
     const errorMessPhoneNumber = ref(
@@ -252,14 +253,22 @@ export default defineComponent({
         }
       }
     );
-    // watch(
-    //   () => address.value,
-    //   (value) => {
-    //     if (value) {
-    //       addressRules.value = false;
-    //     }
-    //   }
-    // );
+    watch(
+      () => address.value,
+      (value) => {
+        if (value) {
+          addressRules.value = false;
+        }
+      }
+    );
+    watch(
+      () => account.value,
+      (value) => {
+        if(value){
+          accountRules.value = false
+        }
+      }
+    );
     watch(
       () => phoneNumber.value,
       (value) => {
@@ -798,10 +807,14 @@ export default defineComponent({
         );
       }
 
-      // if (artistLevel.value === null) {
-      //   hasError = true;
-      //   artistLevelRules.value = true;
-      // }
+      if (!account.value === null) {
+        hasError = true;
+        accountRules.value = true;
+      }
+       if(!address.value === null){
+         hasError = true;
+         addressRules.value = true
+       }
       if (!fields.value) {
         hasError = true;
         fieldRules.value = true;
@@ -898,7 +911,7 @@ export default defineComponent({
             whatsapp: whatsapp.value,
             fullName: fullName.value,
             shortDescription: null,
-            account: null,
+            account: account.value,
             socialEmbedded: socialEmbedded.value,
             artistLevel: artistLevel.value,
             fields: [fields.value],
@@ -1066,6 +1079,7 @@ export default defineComponent({
       workRules,
       qualificationRules,
       artistLevelRules,
+      accountRules,
       errorMessEmail,
       errorMessPhoneNumber,
       confirmChangeIsDefault,

src/pages/them-nghe-sy/AddArtist.ts

@@ -101,6 +101,7 @@ export default defineComponent({
     const artistName: Ref<string | null> = ref(null);
     const birthday: Ref<string | null> = ref(null);
     const sex: Ref<number | null> = ref(null);
+   
     const nationality: Ref<NationalityType> = ref({
       id: 1,
       name: 'Việt Nam',
@@ -157,7 +158,7 @@ export default defineComponent({
     const artistNameRules = ref(false);
     const birthdayRules = ref(false);
     const emailRules = ref(false);
-    // const addressRules = ref(false);
+    const addressRules = ref(false);
     const phoneNumberRules = ref(false);
     const mnBookingEmailRules = ref(false);
     const mnBookingPhoneRules = ref(false);
@@ -168,7 +169,7 @@ export default defineComponent({
     const musicRules = ref(false);
     const qualificationRules = ref(false);
     const artistLevelRules = ref(false);
-   
+   const accountRules=ref(false)
 
     const errorMessEmail = ref( 
       i18n.global.t('artist.artistInformation.validateMessages.requireEmail')
@@ -178,11 +179,17 @@ export default defineComponent({
         'artist.artistInformation.validateMessages.requirePhoneNumber'
       )
     );
+    
     const errorMessmnBookingEmail = ref(
       i18n.global.t(
         'artist.artistInformation.validateMessages.requireEmailAdminister'
       )
     );
+    const errorMessAddress = ref(i18n.global.t('artist.artistInformation.validateMessages.requireAddress'))
+    const errorMessAccount = ref(
+      i18n.global.t(
+        'artist.artistInformation.validateMessages.requireAccount')
+    );
     const errorMessmnBookingPhone = ref(
       i18n.global.t(
         'artist.artistInformation.validateMessages.requirePhoneNumberAdminister'
@@ -208,6 +215,14 @@ export default defineComponent({
         }
       }
     );
+    watch(
+      () => account.value,
+      (value) => {
+        if(value){
+          accountRules.value = false
+        }
+      }
+    );
     watch(
       () => fullName.value,
       (value) => {
@@ -240,14 +255,14 @@ export default defineComponent({
         }
       }
     );
-    // watch(
-    //   () => address.value,
-    //   (value) => {
-    //     if (value) {
-    //       addressRules.value = false;
-    //     }
-    //   }
-    // );
+    watch(
+      () => address.value,
+      (value) => {
+        if (value) {
+          addressRules.value = false;
+        }
+      }
+    );
     watch(
       () => phoneNumber.value,
       (value) => {
@@ -698,7 +713,7 @@ export default defineComponent({
           'artist.artistInformation.validateMessages.requireEmail'
         );
       }
-
+     
       if (
         (!mnBookingPhone.value || !mnBookingPhone.value?.trim().length) &&
         check_infoBooking.value
@@ -725,6 +740,14 @@ export default defineComponent({
         hasError = true;
         fieldRules.value = true;
       }
+      if(!account.value){
+        hasError = true;
+        accountRules.value = true;
+      }
+      if(!address.value){
+        hasError = true;
+        addressRules.value = true
+      }
       if (nationality.value === null) {
         hasError = true;
         nationalityRules.value = true;
@@ -738,6 +761,7 @@ export default defineComponent({
         workRules.value = true;
       }
 
+
       if (hasError === false) {
         void addArtist();
       }
@@ -871,6 +895,7 @@ export default defineComponent({
       void getMusicTypeOptions()
     });
     return {
+
       hidden_img,
       tab,
       id,
@@ -982,9 +1007,12 @@ export default defineComponent({
       musicRules,
       qualificationRules,
       artistLevelRules,
-   errorMessEmail,
-
+      errorMessEmail,
+      accountRules,
+      addressRules,
       errorMessPhoneNumber,
+      errorMessAccount,
+      errorMessAddress,
       confirmChangeIsDefault,
       favoriteScore,
       check_infoBooking,

src/pages/them-nghe-sy/index.vue

@@ -64,6 +64,9 @@
             v-model:mn-whatsapp="mnWhatsapp"
             v-model:favorite-score="favoriteScore"
             v-model:check_infoBooking="check_infoBooking"
+             v-model:account="account"
+             :accountRules="accountRules"
+             :addressRules="addressRules"
             :errorMessmnBookingPhone="errorMessmnBookingPhone"
             :errorMessmnBookingEmail="errorMessmnBookingEmail"
             :mnBookingEmailRules="mnBookingEmailRules"
@@ -99,7 +102,7 @@
         </q-tab-panel>
         <q-tab-panel name="vabAccount">
           <VabAccount
-            v-model:account="account"
+           
             v-model:short-description="shortDescription"
             v-model:format-schedules="formatSchedules"
             :id="route.params.id"