update

src/components/artist-information/add-new-artist-dialog/NewArtistDialog.ts

@@ -14,110 +14,153 @@ export default defineComponent({
     artistName: { type: String, required: true },
     birthday: { type: String, required: true },
     sex: { type: Number, required: true },
-    nationality: { type: String, required: true },
+    nationality: { type: Number, required: true },
     status: { type: Number, required: true },
     address: { type: String, required: true },
-    field: { type: String, required: true },
-    work: { type: String, required: true },
-    qualification: { type: String, required: true },
-    artistLevel: { type: String, required: true },
+    field: { type: Number, required: true },
+    work: { type: Number, required: true },
+    qualification: { type: Number, required: true },
+    artistLevel: { type: Number, required: true },
     phoneNumber: { type: String, required: true },
     email: { type: String, required: true },
     facebook: { type: String, required: true },
     facebookMessage: { type: String, required: true },
     instagram: { type: String, required: true },
     whatsapp: { type: String, required: true },
+    sexOptions: { type: Array, required: true },
+    fieldOptions: { type: Array, required: true },
+    nationalityOptions: { type: Array, required: true },
+    professionOptions: { type: Array, required: true },
+    artistLevelOptions: { type: Array, required: true },
+    workOptions: { type: Array, required: true },
   },
   setup() {
-    const userNameRules = [
+    const artistCodeRules = [
       (val?: string) =>
         (val && val.trim().length) ||
-        i18n.global.t('customer.validateMessages.requireUserName'),
+        i18n.global.t(
+          'artist.artistInformation.validateMessages.requireArtistCode'
+        ),
     ];
-    const customerNameRules = [
+    const fullNameRules = [
       (val?: string) =>
         (val && val.trim().length) ||
-        i18n.global.t('customer.validateMessages.requireCustomerName'),
+        i18n.global.t(
+          'artist.artistInformation.validateMessages.requireFullName'
+        ),
     ];
-    const businessNameRules = [
+    const artistNameRules = [
       (val?: string) =>
         (val && val.trim().length) ||
-        i18n.global.t('customer.validateMessages.requireBusinessName'),
+        i18n.global.t(
+          'artist.artistInformation.validateMessages.requireArtistName'
+        ),
     ];
-    const taxCodeRules = [
-      (val?: number) =>
+    const birthdayRules = [
+      (val?: string) =>
         val !== undefined ||
-        i18n.global.t('customer.validateMessages.requireTaxCode'),
+        i18n.global.t(
+          'artist.artistInformation.validateMessages.requireBirthday'
+        ),
     ];
-    const phoneRules = [
+    const emailRules = [
       (val?: string) =>
         (val && val.trim().length) ||
-        i18n.global.t('customer.validateMessages.requirePhone'),
+        i18n.global.t('artist.artistInformation.validateMessages.requireEmail'),
       (val: string) =>
-        isMobilePhone(val) ||
-        i18n.global.t('customer.validateMessages.isPhone'),
+        isEmail(val) ||
+        i18n.global.t('artist.artistInformation.validateMessages.isEmail'),
     ];
-    const emailRules = [
+    const addressRules = [
       (val?: string) =>
         (val && val.trim().length) ||
-        i18n.global.t('customer.validateMessages.requireEmail'),
-      (val: string) =>
-        isEmail(val) || i18n.global.t('customer.validateMessages.isEmail'),
+        i18n.global.t(
+          'artist.artistInformation.validateMessages.requireAddress'
+        ),
     ];
-    const addressRules = [
+    const phoneNumberRules = [
       (val?: string) =>
         (val && val.trim().length) ||
-        i18n.global.t('customer.validateMessages.requireAddress'),
+        i18n.global.t(
+          'artist.artistInformation.validateMessages.requirePhoneNumber'
+        ),
+      (val: string) =>
+        isMobilePhone(val) ||
+        i18n.global.t('artist.artistInformation.validateMessages.isPhone'),
     ];
-    const businessTypeRules = [
+    const sexRules = [
       (val?: number) =>
         val !== undefined ||
-        i18n.global.t('customer.validateMessages.requireBusinessType'),
+        i18n.global.t('artist.artistInformation.validateMessages.requireSex'),
     ];
-    const ratingsRules = [
+    const nationalityRules = [
       (val?: number) =>
         val !== undefined ||
-        i18n.global.t('customer.validateMessages.requireRatings'),
+        i18n.global.t(
+          'artist.artistInformation.validateMessages.requireNationality'
+        ),
     ];
-    const representativeRules = [
-      (val?: string) =>
-        (val && val.trim().length) ||
-        i18n.global.t('customer.validateMessages.requireRepresentative'),
+    const fieldRules = [
+      (val?: number) =>
+        val !== undefined ||
+        i18n.global.t('artist.artistInformation.validateMessages.requireField'),
     ];
-    const positionRules = [
-      (val?: string) =>
-        (val && val.trim().length) ||
-        i18n.global.t('customer.validateMessages.requiredPosition'),
+    const workRules = [
+      (val?: number) =>
+        val !== undefined ||
+        i18n.global.t('artist.artistInformation.validateMessages.requiredWork'),
+    ];
+    const qualificationRules = [
+      (val?: number) =>
+        val !== undefined ||
+        i18n.global.t(
+          'artist.artistInformation.validateMessages.requireQualification'
+        ),
+    ];
+    const artistLevelRules = [
+      (val?: number) =>
+        val !== undefined ||
+        i18n.global.t(
+          'artist.artistInformation.validateMessages.requireArtistLevel'
+        ),
     ];
     return {
-      userNameRules,
-      customerNameRules,
-      businessNameRules,
-      taxCodeRules,
+      artistCodeRules,
+      fullNameRules,
+      artistNameRules,
+      birthdayRules,
       emailRules,
-      ratingsRules,
       addressRules,
-      businessTypeRules,
-      representativeRules,
-      positionRules,
-      phoneRules,
+      phoneNumberRules,
+      sexRules,
+      nationalityRules,
+      fieldRules,
+      workRules,
+      qualificationRules,
+      artistLevelRules,
     };
   },
   emits: [
     'update:isOpenNewArtistDialog',
     'click:CloseBtn',
-    'update:userName',
-    'update:customerName',
-    'update:businessName',
-    'update:taxCode',
+    'update:artistCode',
+    'update:fullName',
+    'update:artistName',
+    'update:birthday',
     'update:email',
-    'update:ratings',
+    'update:facebook',
+    'update:facebookMessage',
+    'update:instagram',
+    'update:whatsapp',
     'update:address',
-    'update:businessType',
-    'update:representative',
-    'update:position',
-    'update:phone',
+    'update:phoneNumber',
+    'update:sex',
+    'update:nationality',
+    'update:field',
+    'update:work',
+    'update:qualification',
+    'update:artistLevel',
     'update:status',
-    'addNewCustomer',
+    'addNewArtist',
   ],
 });

src/i18n/vi/index.ts

@@ -269,6 +269,23 @@ export default {
         instagram: 'Instagram',
         whatsapp: 'Whatsapp',
       },
+      validateMessages: {
+        requireArtistCode: 'Vui lòng nhập mã nghệ sỹ',
+        requireFullName: 'Vui lòng nhập họ tên nghệ sỹ',
+        requireArtistName: 'Vui lòng nhập nghệ danh',
+        requireBirthday: 'Vui lòng chọn ngày sinh',
+        requireEmail: 'Vui lòng nhập email',
+        isEmail: 'Email không hợp lệ',
+        requireAddress: 'Vui lòng nhập địa chỉ',
+        requirePhoneNumber: 'Vui lòng nhập số điện thoại',
+        isPhone: 'Số điện thoại không hợp lệ',
+        requireSex: 'Vui lòng chọn giới tính',
+        requireNationality: 'Vui lòng chọn quốc tịch',
+        requireField: 'Vui lòng chọn lĩnh vực',
+        requiredWork: 'Vui lòng chọn công việc',
+        requireQualification: 'Vui lòng chọn độ chuyên',
+        requireArtistLevel: 'Vui lòng chọn xếp hạng',
+      },
     },
     bankAccount: {
       tableColumnsBank: {

src/pages/nghe-sy/artist.ts

@@ -114,17 +114,17 @@ export default defineComponent({
     const pageSize = ref(20);
     const totalPage = ref(10);
     const fullNameKeyword = ref('');
+    const sexOptions = ref([
+      { id: 1, name: 'Nam' },
+      { id: 2, name: 'Nữ' },
+    ]);
     const fieldOptions: Ref<FieldType[]> = ref([]);
+    const nationalityOptions: Ref<NationalityType[]> = ref([]);
+    const professionOptions: Ref<QualificationType[]> = ref([]);
+    const artistLevelOptions: Ref<ArtistLevelType[]> = ref([]);
+    const workOptions: Ref<WorkType[]> = ref([]);
     const fieldSelected: Ref<number | undefined> = ref();
-    const professionOptions = ref([
-      { id: 1, text: 'Chuyên nghiệp' },
-      { id: 2, text: 'Nghiệp dư' },
-    ]);
     const professionSelected: Ref<number | undefined> = ref();
-    const artistLevelOptions = ref([
-      { id: 1, text: 'VIP_1' },
-      { id: 2, text: 'VIP_2' },
-    ]);
     const artistLevelSelected: Ref<number | undefined> = ref();
 
     const isOpenNewArtistDialog = ref(false);
@@ -134,13 +134,13 @@ export default defineComponent({
     const artistName: Ref<string | undefined> = ref();
     const birthday: Ref<string | undefined> = ref();
     const sex: Ref<number | undefined> = ref();
-    const nationality: Ref<string | undefined> = ref();
+    const nationality: Ref<number | undefined> = ref();
     const address: Ref<string | undefined> = ref();
     const status: Ref<number> = ref(1);
-    const field: Ref<string | undefined> = ref();
-    const work: Ref<string | undefined> = ref();
-    const qualification: Ref<string | undefined> = ref();
-    const artistLevel: Ref<string | undefined> = ref();
+    const field: Ref<number | undefined> = ref();
+    const work: Ref<number | undefined> = ref();
+    const qualification: Ref<number | undefined> = ref();
+    const artistLevel: Ref<number | undefined> = ref();
     const phoneNumber: Ref<string | undefined> = ref();
     const email: Ref<string | undefined> = ref();
     const facebook: Ref<string | undefined> = ref();
@@ -194,19 +194,53 @@ export default defineComponent({
       }
     };
 
-    // const getNationalityOptions = async () => {
-    //   const response = (await api({
-    //     url: API_PATHS.getFieldOptions,
-    //     method: 'GET',
-    //     params: {},
-    //   })) as AxiosResponse<BaseResponseBody<NationalityType[]>>;
-    //   if (response.data.error.code === config.API_RES_CODE.OK.code) {
-    //     fieldOptions.value = response.data.data;
-    //   }
-    // };
+    const getNationalityOptions = async () => {
+      const response = (await api({
+        url: API_PATHS.getNationalityOptions,
+        method: 'GET',
+        params: {},
+      })) as AxiosResponse<BaseResponseBody<NationalityType[]>>;
+      if (response.data.error.code === config.API_RES_CODE.OK.code) {
+        nationalityOptions.value = response.data.data;
+      }
+    };
+    const getArtistLevelOptions = async () => {
+      const response = (await api({
+        url: API_PATHS.getArtistLevelOptions,
+        method: 'GET',
+        params: {},
+      })) as AxiosResponse<BaseResponseBody<ArtistLevelType[]>>;
+      if (response.data.error.code === config.API_RES_CODE.OK.code) {
+        artistLevelOptions.value = response.data.data;
+      }
+    };
+    const getQualificationOptions = async () => {
+      const response = (await api({
+        url: API_PATHS.getQualificationOptions,
+        method: 'GET',
+        params: {},
+      })) as AxiosResponse<BaseResponseBody<QualificationType[]>>;
+      if (response.data.error.code === config.API_RES_CODE.OK.code) {
+        professionOptions.value = response.data.data;
+      }
+    };
+    const getWorkOptions = async () => {
+      const response = (await api({
+        url: API_PATHS.getWorkOptions,
+        method: 'GET',
+        params: {},
+      })) as AxiosResponse<BaseResponseBody<WorkType[]>>;
+      if (response.data.error.code === config.API_RES_CODE.OK.code) {
+        workOptions.value = response.data.data;
+      }
+    };
     onMounted(() => {
       void getListArtists();
       void getFieldOptions();
+      void getNationalityOptions();
+      void getArtistLevelOptions();
+      void getQualificationOptions();
+      void getWorkOptions();
     });
     return {
       userTableColumnsArtist,
@@ -234,6 +268,7 @@ export default defineComponent({
       facebookMessage,
       instagram,
       whatsapp,
+      sexOptions,
       filterListArtist,
       totalPage,
       changePageSize,
@@ -245,6 +280,12 @@ export default defineComponent({
       artistLevelSelected,
       artistLevelOptions,
       getFieldOptions,
+      nationalityOptions,
+      getNationalityOptions,
+      workOptions,
+      getArtistLevelOptions,
+      getQualificationOptions,
+      getWorkOptions,
     };
   },
 });

src/pages/nghe-sy/index.vue

@@ -24,7 +24,7 @@
       <q-select
         v-model="professionSelected"
         :options="professionOptions"
-        option-label="text"
+        option-label="name"
         option-value="id"
         dense
         outlined
@@ -35,7 +35,7 @@
       <q-select
         v-model="artistLevelSelected"
         :options="artistLevelOptions"
-        option-label="text"
+        option-label="name"
         option-value="id"
         dense
         outlined
@@ -101,6 +101,30 @@
       </div>
       <AddNewArtistDialog
         v-model:is-open-new-artist-dialog="isOpenNewArtistDialog"
+        artistCode
+        v-model:full-name="fullName"
+        v-model:artist-name="artistName"
+        v-model:birthday="birthday"
+        v-model:sex="sex"
+        v-model:nationality="nationality"
+        v-model:status="status"
+        v-model:address="address"
+        v-model:field="field"
+        v-model:work="work"
+        v-model:qualification="qualification"
+        v-model:artist-level="artistLevel"
+        v-model:phone-number="phoneNumber"
+        v-model:email="email"
+        v-model:facebook="facebook"
+        v-model:facebook-message="facebookMessage"
+        v-model:instagram="instagram"
+        v-model:whatsapp="whatsapp"
+        :sex-options="sexOptions"
+        :field-options="fieldOptions"
+        :nationality-options="nationalityOptions"
+        :profession-options="professionOptions"
+        :artist-level-options="artistLevelOptions"
+        :work-options="workOptions"
         @click:CloseBtn="isOpenNewArtistDialog = false"
       ></AddNewArtistDialog>
     </div>