update

src/assets/configurations.example.ts

@@ -20,6 +20,7 @@ export const config = {
 
 export enum API_PATHS {
   login = '/user/login',
+  
   getUserGroups = '/group/get_list',
   getListPages = '/user/page/list',
   getListGroupUsers = '/user/group/list',
@@ -38,6 +39,7 @@ export enum API_PATHS {
   getFieldOptions = '/field',
   getNationalityOptions = '/nationality',
   getProvinceOptions = '/common/province',
+  getMusicTypeOptions= '/common/musicType',
   getArtistLevelOptions = '/artistLevel',
   getQualificationOptions = '/qualification',
   getWorkOptions = '/work',

src/assets/type.ts

+import { type } from "os";
+
 export type PaginationResponse<DataType> = {
   pageIndex: null | number;
   pageSize: null | number;
@@ -76,11 +78,19 @@ export type ArtistInfoType = {
   favoriteScore: number;
 };
  export type ProvinceType = {
-    nam: string,
+    name: string,
     fullname: string,
     code: string,
     level: string,
  };
+
+ export type MusicType = {
+     id:number,
+     name: string,
+     status: number,
+     code: string,
+     numIndex: number,
+ };
 export type FieldType = {
   id: number;
   name: string;

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

@@ -23,8 +23,9 @@ export default defineComponent({
     sex: { type: Number, required: true },
     nationality: { type: Object as PropType<NationalityType>, required: true },
     status: { type: Number, required: true },
-    address: { type: String, required: true },
+    address: { type: String ,required: true },
     fields: { type: Object as PropType<FieldType>, required: true },
+    musics: {type: String, required: true },
     works: { type: Number, required: true },
     qualification: { type: Number, required: true },
     artistLevel: { type: Number, required: true },
@@ -43,6 +44,7 @@ export default defineComponent({
     professionOptions: { type: Array, required: true },
     artistLevelOptions: { type: Array, required: true },
     workOptions: { type: Array, required: true },
+    musicOptions: { type:Array, required: true},
     favoriteScore: { type: Number, required: true },
     artistCodeRules: { type: Boolean, required: true },
     fullNameRules: { type: Boolean, required: true },
@@ -56,6 +58,7 @@ export default defineComponent({
     sexRules: { type: Boolean, required: true },
     nationalityRules: { type: Boolean, required: true },
     fieldRules: { type: Boolean, required: true },
+    musicsRules: { type: Boolean, required: true },
     workRules: { type: Boolean, required: true },
     qualificationRules: { type: Boolean, required: true },
     artistLevelRules: { type: Boolean, required: true },
@@ -207,6 +210,7 @@ export default defineComponent({
     'update:mnFbmess',
     'update:mnIns',
     'update:mnWhatsapp',
+    'update:musics',
     'addNewArtist',
     'SetAvatar',
     'deleteAvatar',

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

@@ -282,16 +282,21 @@
           {{ $t('artist.artistInformation.titleDataField.type') }}
           <span style="color: red">*</span>
         </div>
-           <!-- :model-value="types"
-            @update:model-value="$emit('update:types', $event)"
-            :error="typeRules"
-            :error-message="errorMessTypes"
-            :options="typeOptions" -->
+          
+            <!-- :error="musicsRules"
+            :error-message="errorMessTypes" -->
+          
+            
         <div class="col-8">
           <q-select
+           :model-value="musics"
+            @update:model-value="$emit('update:musics', $event)"
+            :options="musicOptions"
+            multiple
             map-options
             option-value="id"
             option-label="name"
+            type="text"
             class="q-my-sm"
             outlined
             hide-bottom-space

src/pages/nghe-sy/index.vue

@@ -35,18 +35,18 @@
         clearable
       ></q-select>
     </div>
-    <!-- <div class="col-2" dense outlined>
+    <div class="col-2" dense outlined>
       <q-select
-        v-model="artistLevelSelected"
-        :options="artistLevelOptions"
-        option-label="name"
-        option-value="id"
+        v-model="provinceSelected"
+        :options="provinceOptions"
+        option-label="fullName"
+        option-value="name"
         dense
         outlined
-        label="Xếp hạng"
+        label="Địa chỉ"
         clearable
       ></q-select>
-    </div> -->
+    </div>
     <div class="col-auto">
       <q-btn
         color="primary"
@@ -191,6 +191,8 @@ import {
   ArtistLevelType,
   QualificationType,
   WorkType,
+  ProvinceType,
+  MusicType
   
 } from 'src/assets/type';
 import Pagination from 'components/pagination/index.vue';
@@ -319,10 +321,13 @@ export default defineComponent({
     const nationalityOptions: Ref<NationalityType[]> = ref([]);
     const professionOptions: Ref<QualificationType[]> = ref([]);
     const artistLevelOptions: Ref<ArtistLevelType[]> = ref([]);
+    const provinceOptions: Ref<ProvinceType[]> = ref([]);
+    const musicOptions: Ref<MusicType[]> = ref([]);
     const workOptions: Ref<WorkType[]> = ref([]);
     const fieldSelected: Ref<FieldType | null> = ref(null);
     const professionSelected: Ref<QualificationType | null> = ref(null);
     const artistLevelSelected: Ref<ArtistLevelType | null> = ref(null);
+    const provinceSelected: Ref<ProvinceType | null> = ref(null);
     const isOpenNewArtistDialog = ref(false);
     const id: Ref<number> = ref(0);
     const artistCode: Ref<string> = ref('');
@@ -364,7 +369,7 @@ export default defineComponent({
             name: fullNameKeyword.value,
             field: fieldSelected.value?.id,
             qualification: professionSelected.value?.id,
-            artistLevel: artistLevelSelected.value?.id,
+            address: provinceSelected.value?.name
           },
         })) as AxiosResponse<
           BaseResponseBody<PaginationResponse<ArtistInfoType>>
@@ -400,7 +405,8 @@ export default defineComponent({
       }
     };
 
- 
+   /// xếp hạng
+
     const getArtistLevelOptions = async () => {
       const response = (await api({
         url: API_PATHS.getArtistLevelOptions,
@@ -411,6 +417,34 @@ export default defineComponent({
         artistLevelOptions.value = response.data.data;
       }
     };
+      
+      // thể loại
+      const getMusicTypeOptions = async () => {
+       const response = (await api ({
+         url: API_PATHS.getMusicTypeOptions,
+         method: 'GET',
+         params: {},
+       })) as AxiosResponse<BaseResponseBody<MusicType[]>>;
+       if(response.data.error.code === config.API_RES_CODE.OK.code) {
+         musicOptions.value = response.data.data
+       }
+
+      };
+     
+      const getProvinceOptions = async () => {
+      const response = (await api ({
+        url : API_PATHS.getProvinceOptions,
+        method: 'GET',
+        params: {},
+      })) as AxiosResponse<BaseResponseBody<ProvinceType[]>>;
+      if(response.data.error.code === config.API_RES_CODE.OK.code){
+ 
+        provinceOptions.value = response.data.data
+      }
+   } 
+
+     
+
     const getQualificationOptions = async () => {
       const response = (await api({
         url: API_PATHS.getQualificationOptions,
@@ -475,6 +509,8 @@ export default defineComponent({
       void getArtistLevelOptions();
       void getQualificationOptions();
       void getWorkOptions();
+      void getProvinceOptions();
+      void getMusicTypeOptions();
     
     });
     return {
@@ -521,11 +557,16 @@ export default defineComponent({
       professionSelected,
       professionOptions,
       artistLevelSelected,
+      provinceSelected,
       artistLevelOptions,
+      provinceOptions,
+      getProvinceOptions,
+      getMusicTypeOptions,
       getFieldOptions,
       nationalityOptions,
       getNationalityOptions,
       workOptions,
+       musicOptions,
       getArtistLevelOptions,
       getQualificationOptions,
       getWorkOptions,

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

@@ -26,6 +26,7 @@ import {
   ArtistLevelType,
   QualificationType,
   WorkType,
+  MusicType,
   BankAccountType,
   ProductType,
   BannerType,
@@ -34,7 +35,7 @@ import {
   CardBankType,
   TypeCardType,
   FileUploadType,
-  ProvinceType
+  ProvinceType,
 } from 'src/assets/type';
 
 export type AvatarType = {
@@ -81,6 +82,7 @@ export default defineComponent({
     const cardBankOptions: Ref<CardBankType[]> = ref([]);
     const typeBankOptions: Ref<TypeCardType[]> = ref([]);
     const workOptions: Ref<WorkType[]> = ref([]);
+    const musicOptions: Ref<MusicType[]>= ref([]);
     const provinceOptions:Ref<ProvinceType[]> = ref([]);
     const sexOptions = ref([
       { id: 1, name: 'Nam' },
@@ -111,9 +113,10 @@ export default defineComponent({
     const mnEmail: Ref<string | null> = ref(null);
     const qualification: Ref<QualificationType | null> = ref(null);
     const artistLevel: Ref<ArtistLevelType | null> = ref(null);
-    const address: Ref<string | null> = ref(null);
+    const address: Ref<ProvinceType | null> = ref(null);
     const status: Ref<number> = ref(1);
     const fields: Ref<FieldType | null> = ref(null);
+    const musics: Ref<MusicType | null> = ref(null);
     const works: Ref<WorkType[]> = ref([]);
     const phoneNumber: Ref<string | null> = ref(null);
     const email: Ref<string | null> = ref(null);
@@ -162,6 +165,7 @@ export default defineComponent({
     const nationalityRules = ref(false);
     const fieldRules = ref(false);
     const workRules = ref(false);
+    const musicRules = ref(false);
     const qualificationRules = ref(false);
     const artistLevelRules = ref(false);
     const errorMessEmail = ref(
@@ -235,7 +239,7 @@ export default defineComponent({
       }
     );
     watch(
-      () => address.value,
+      () => address,
       (value) => {
         if (value) {
           addressRules.value = false;
@@ -298,6 +302,14 @@ export default defineComponent({
         }
       }
     );
+    watch(
+     () => musics.value,
+      (value) => {
+        if(value) {
+          musicRules.value = false;
+        }
+      }
+    );
     watch(
       () => qualification.value,
       (value) => {
@@ -344,7 +356,6 @@ export default defineComponent({
         params: {},
       })) as AxiosResponse<BaseResponseBody<ProvinceType[]>>;
       if(response.data.error.code === config.API_RES_CODE.OK.code){
- 
         provinceOptions.value = response.data.data
       }
    } 
@@ -381,6 +392,20 @@ export default defineComponent({
         workOptions.value = response.data.data;
       }
     };
+
+     // thể loại
+     const getMusicTypeOptions = async () => {
+      const response = (await api ({
+        url: API_PATHS.getMusicTypeOptions,
+        method: 'GET',
+        params: {},
+      })) as AxiosResponse<BaseResponseBody<MusicType[]>>;
+      if(response.data.error.code === config.API_RES_CODE.OK.code) {
+        musicOptions.value = response.data.data
+      }
+
+     };
+
     const getBankOptions = async () => {
       const response = (await api({
         url: API_PATHS.bankOptions,
@@ -765,14 +790,15 @@ export default defineComponent({
           url: API_PATHS.addArtist,
           method: 'POST',
           data: {
+            musicTypeDto:musics.value  ,
             id: route.params.id,
             avatar: avatarUploaded.value,
             artistCode: artistCode.value,
             artistName: artistName.value,
             // eslint-disable-next-line @typescript-eslint/restrict-plus-operands
-            birthday: birthday.value + ' 00:00:00',
+            birthday: birthday.value + '00:00:00',
             sex: sex.value,
-            address: address.value,
+            address: address.value?.name,
             phoneNumber: phoneNumber.value,
             email: email.value,
             facebook: facebook.value,
@@ -841,6 +867,7 @@ export default defineComponent({
       void getBankOptions();
       void getTypeCardOptions();
       void getProvinceOptions();
+      void getMusicTypeOptions()
     });
     return {
       hidden_img,
@@ -857,6 +884,8 @@ export default defineComponent({
       status,
       fields,
       works,
+     musics,
+
       qualification,
       artistLevel,
       phoneNumber,
@@ -884,6 +913,8 @@ export default defineComponent({
       professionOptions,
       artistLevelOptions,
       workOptions,
+      musicOptions,
+    
       getFieldOptions,
       getNationalityOptions,
       getArtistLevelOptions,
@@ -947,6 +978,7 @@ export default defineComponent({
       nationalityRules,
       fieldRules,
       workRules,
+      musicRules,
       qualificationRules,
       artistLevelRules,
       errorMessEmail,
@@ -956,6 +988,7 @@ export default defineComponent({
       check_infoBooking,
       getProvinceOptions,
       provinceOptions,
+      getMusicTypeOptions,
     };
   },
 });

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

@@ -43,6 +43,7 @@
             v-model:status="status"
             v-model:address="address"
             v-model:fields="fields"
+            v-model:musics="musics"
             v-model:works="works"
             v-model:qualification="qualification"
             v-model:artist-level="artistLevel"
@@ -89,6 +90,7 @@
             :profession-options="professionOptions"
             :artist-level-options="artistLevelOptions"
             :work-options="workOptions"
+            :music-options="musicOptions"
             @SetAvatar="setAvatar($event)"
             @deleteAvatar="deleteAvatar"
             @UpdateBirtday="UpdateBirtday($event)"

src/router/routes.ts

@@ -7,10 +7,12 @@ export enum Pages {
   cmsUser = 'nguoi-dung',
   managingUnit = 'don-vi-chu-quan',
   artist = 'nghe-sy',
+
   informationArtist = 'cap-nhat-thong-tin-nghe-sy',
   customer = 'khach-hang',
   addArtist = 'them-nghe-sy',
   customerRank = 'xep-hang-khach-hang',
+  artistRank = 'Xep-hang-nghi-sy',
   field = 'linh-vuc-hoat-dong',
   post = 'bai-viet',
   postCategory = 'danh-muc-bai-viet',
@@ -70,6 +72,11 @@ const routes: RouteRecordRaw[] = [
         component: () => import('pages/them-nghe-sy/index.vue'),
         name: Pages.addArtist,
       },
+      {
+        path: '/xep-hang-nghe-sy',
+        component: () => import('pages/xep-hang-nghe-sy/index.vue'),
+        name:Pages.artistRank
+      },
       {
         path: '/khach-hang',
         component: () => import('pages/khach-hang/index.vue'),