update

src/components/artist-information/browser-new-artist-dialog.vue

@@ -881,9 +881,9 @@ export default defineComponent({
     const errorMessFullName = i18n.global.t(
       'artist.artistInformation.validateMessages.requireFullName'
     );
-    // const errorMessArtistName = i18n.global.t(
-    //   'artist.artistInformation.validateMessages.requireArtistName'
-    // );
+    const errorMessArtistName = i18n.global.t(
+      'artist.artistInformation.validateMessages.requireArtistName'
+    );
     // const errorMessBirthday = i18n.global.t(
     //   'artist.artistInformation.validateMessages.requireBirthday'
     // );
@@ -928,7 +928,7 @@ export default defineComponent({
       // errorMessArtistCode,
       errorMessFullName,
       errorMessAccount,
-      // errorMessArtistName,
+      errorMessArtistName,
       // errorMessBirthday,
       // errorMessSex,
       // errorMessNationality,

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

@@ -55,7 +55,7 @@ export default defineComponent({
     favoriteScore: { type: Number, required: true },
     artistCodeRules: { type: Boolean, required: true },
     fullNameRules: { type: Boolean, required: true },
-    // artistNameRules: { type: Boolean, required: true },
+    artistNameRules: { type: Boolean, required: true },
     // birthdayRules: { type: Boolean, required: true },
     // emailRules: { type: Boolean, required: true },
     emailAdministerRules: { type: Boolean, required: true },

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

@@ -144,14 +144,17 @@
       <div class="row flex-center">
         <div class="col-3 text-weight-medium">
           {{ $t('artist.artistInformation.titleDataField.artistName') }}
-          <!-- <span style="color: red">*</span> -->
+          <span style="color: red">*</span> 
         </div>
         <div class="col-8">
           <!-- :error-message="errorMessArtistName" -->
           <!-- :error="artistNameRules" -->
+
           <q-input
             :model-value="artistName"
             @update:model-value="$emit('update:artistName', $event)"
+            :error-message="errorMessArtistName"
+            :error="artistNameRules"
             class="q-my-sm"
             outlined
             dense
@@ -260,10 +263,11 @@
           <!-- {{address}} -->
           <!-- :error="addressRules"
             :error-message="errorMessAddress" -->
+     
           <q-select
             :model-value="address"
             @update:model-value="$emit('update:address', $event)"
-            :options="provinceOptions1"
+            :options="filteredProvinceOptions"
             option-value="fullName"
             option-label="fullName"
             type="text"
@@ -764,7 +768,7 @@ export default defineComponent({
     favoriteScore: { type: Number, required: true },
     // artistCodeRules: { type: Boolean, required: true },
     fullNameRules: { type: Boolean, required: true },
-    // artistNameRules: { type: Boolean, required: true },
+    artistNameRules: { type: Boolean, required: true },
     // birthdayRules: { type: Boolean, required: true },
     // emailRules: { type: Boolean, required: true },
     emailAdministerRules: { type: Boolean, required: true },
@@ -832,7 +836,9 @@ export default defineComponent({
       fetch(urlCrop.value)
         .then((res) => res.blob())
         .then((blob) => {
-          const file = new File([blob], 'file-1678935701090.jpg', { type: blob.type });
+          const file = new File([blob], 'file-1678935701090.jpg', {
+            type: blob.type,
+          });
           fileCrop.value = file;
         });
     };
@@ -846,6 +852,7 @@ export default defineComponent({
     };
 
     const provinceOptions1: Ref<ProvinceType[]> = ref([]);
+    const filteredProvinceOptions: Ref<ProvinceType[]> = ref([]);
 
     const getProvinceOptions = async () => {
       const response = (await api({
@@ -858,19 +865,19 @@ export default defineComponent({
       }
     };
 
-    const options = ref(provinceOptions1);
-
     const filterFn = (val: string, update: (fn: () => void) => void) => {
       if (!val) {
         update(() => {
-          options.value = [...provinceOptions1.value];
+          filteredProvinceOptions.value = provinceOptions1.value;
         });
         return;
       } else {
         update(() => {
           const needle = val.toLowerCase();
-          options.value = provinceOptions1.value.filter(
-            (v: { name: string }) => v.name.toLowerCase().indexOf(needle) > 1
+          filteredProvinceOptions.value = provinceOptions1.value.filter(
+            (option) => {
+              return option.name.toLowerCase().includes(needle);
+            }
           );
         });
       }
@@ -911,9 +918,9 @@ export default defineComponent({
     const errorMessFullName = i18n.global.t(
       'artist.artistInformation.validateMessages.requireFullName'
     );
-    // const errorMessArtistName = i18n.global.t(
-    //   'artist.artistInformation.validateMessages.requireArtistName'
-    // );
+    const errorMessArtistName = i18n.global.t(
+      'artist.artistInformation.validateMessages.requireArtistName'
+    );
     // const errorMessBirthday = i18n.global.t(
     //   'artist.artistInformation.validateMessages.requireBirthday'
     // );
@@ -965,7 +972,7 @@ export default defineComponent({
       // errorMessArtistCode,
       errorMessFullName,
       errorMessAccount,
-      // errorMessArtistName,
+      errorMessArtistName,
       // errorMessBirthday,
       // errorMessSex,
       // errorMessNationality,
@@ -976,7 +983,7 @@ export default defineComponent({
       // errorMessQualification,
       errorMessArtistLevel,
       provinceOptions1,
-      options,
+      filteredProvinceOptions,
 
       // filterArrayOrganizational,
       getProvinceOptions,

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

@@ -155,7 +155,7 @@ export default defineComponent({
     const check_infoBooking = ref(false);
     // const artistCodeRules = ref(false);
     const fullNameRules = ref(false);
-    // const artistNameRules = ref(false);
+    const artistNameRules = ref(false);
     // const birthdayRules = ref(false);
     // const emailRules = ref(false);
     // const addressRules = ref(false);
@@ -230,14 +230,14 @@ export default defineComponent({
         }
       }
     );
-    // watch(
-    //   () => artistName.value,
-    //   (value) => {
-    //     if (value) {
-    //       artistNameRules.value = false;
-    //     }
-    //   }
-    // );
+    watch(
+      () => artistName.value,
+      (value) => {
+        if (value) {
+          artistNameRules.value = false;
+        }
+      }
+    );
     // watch(
     //   () => birthday.value,
     //   (value) => {
@@ -682,10 +682,10 @@ export default defineComponent({
         hasError = true;
         fullNameRules.value = true;
       }
-      // if (!artistName.value || !artistName.value?.trim().length) {
-      //   hasError = true;
-      //   artistNameRules.value = true;
-      // }
+      if (!artistName.value || !artistName.value?.trim().length) {
+        hasError = true;
+        artistNameRules.value = true;
+      }
       // if (!birthday.value || !birthday.value?.trim().length) {
       //   hasError = true;
       //   birthdayRules.value = true;
@@ -985,7 +985,7 @@ export default defineComponent({
       checkValidate,
       // artistCodeRules,
       fullNameRules,
-      // artistNameRules,
+      artistNameRules,
       // birthdayRules,
       // emailRules,
       // addressRules,

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

@@ -92,6 +92,7 @@
             @SetAvatar="setAvatar($event)"
             @deleteAvatar="deleteAvatar"
             @UpdateBirtday="UpdateBirtday($event)"
+            :artistNameRules="artistNameRules" 
            
           ></PersonalInformation>
            <!-- :addressRules="addressRules" -->