call API get List Aritsts

src/assets/configurations.example.ts

@@ -33,4 +33,5 @@ export enum API_PATHS {
   getUserDetail = '/user/detail',
   updateUser = '/user/update',
   getListUnits = '/unit/list',
+  getListArtists = '/artist',
 }

src/assets/type.ts

@@ -27,3 +27,25 @@ export type UserObject = {
   updateTime: null | string;
   updateBy: null | string;
 };
+
+export type ArtistInfoType = {
+  id: number;
+  artistCode: string;
+  fullName: string;
+  artistName: string | null;
+  birthday: string | null;
+  sex: number;
+  nationality: string;
+  address: string | null;
+  status: number;
+  field: string | null;
+  work: string | null;
+  qualification: string | null;
+  artistLevel: string | null;
+  phoneNumber: string | null;
+  email: string | null;
+  facebook: string | null;
+  facebookMessage: string | null;
+  instagram: string | null;
+  whatsapp: string | null;
+};

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

@@ -4,7 +4,7 @@ export default defineComponent({
     id: { type: Number, required: true },
     artistCode: { type: String, required: true },
     fullName: { type: String, required: true },
-    stageName: { type: String, default: '' },
+    artistName: { type: String, default: '' },
     birthday: { type: String, default: '' },
     sex: { type: Number, required: true },
     nationality: { type: String, default: '' },
@@ -12,8 +12,8 @@ export default defineComponent({
     status: { type: Number, required: true },
     field: { type: String, default: '' },
     work: { type: String, default: '' },
-    professionalism: { type: String, default: '' },
-    rating: { type: String, default: '' },
+    qualification: { type: String, default: '' },
+    artistLevel: { type: String, default: '' },
     phoneNumber: { type: String, default: '' },
     email: { type: String, default: '' },
     facebook: { type: String, default: '' },
@@ -23,7 +23,7 @@ export default defineComponent({
   },
   emits: [
     'update:fullName',
-    'update:stageName',
+    'update:artistName',
     'update:birthday',
     'update:sex',
     'update:nationality',
@@ -31,8 +31,8 @@ export default defineComponent({
     'update:status',
     'update:field',
     'update:work',
-    'update:professionalism',
-    'update:rating',
+    'update:qualification',
+    'update:artistLevel',
     'update:phoneNumber',
     'update:email',
     'update:facebook',

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

@@ -29,12 +29,12 @@
       </div>
       <div class="row q-mt-md flex-center">
         <div class="col-3 text-weight-medium">
-          {{ $t('artist.artistInformation.titleDataField.stageName') }}
+          {{ $t('artist.artistInformation.titleDataField.artistName') }}
         </div>
         <div class="col-8">
           <q-input
-            :model-value="stageName"
-            @update:model-value="$emit('update:stageName', $event)"
+            :model-value="artistName"
+            @update:model-value="$emit('update:artistName', $event)"
             outlined
             dense
           ></q-input>
@@ -136,12 +136,12 @@
       </div>
       <div class="row q-mt-sm flex-center">
         <div class="col-3 text-weight-medium">
-          {{ $t('artist.artistInformation.titleDataField.professionalism') }}
+          {{ $t('artist.artistInformation.titleDataField.qualification') }}
         </div>
         <div class="col-8">
           <q-select
-            :model-value="professionalism"
-            @update:model-value="$emit('update:professionalism', $event)"
+            :model-value="qualification"
+            @update:model-value="$emit('update:qualification', $event)"
             outlined
             dense
           ></q-select>
@@ -149,12 +149,12 @@
       </div>
       <div class="row q-mt-sm flex-center">
         <div class="col-3 text-weight-medium">
-          {{ $t('artist.artistInformation.titleDataField.rating') }}
+          {{ $t('artist.artistInformation.titleDataField.artistLevel') }}
         </div>
         <div class="col-8">
           <q-select
-            :model-value="rating"
-            @update:model-value="$emit('update:rating', $event)"
+            :model-value="artistLevel"
+            @update:model-value="$emit('update:artistLevel')"
             outlined
             dense
           ></q-select>

src/i18n/vi/index.ts

@@ -225,15 +225,14 @@ export default {
 
   artist: {
     tableColumnsArtist: {
-      artistName: 'Tên nghệ sỹ',
       artistCode: 'Mã nghệ sỹ',
       fullName: 'Họ tên',
-      stageName: 'Nghệ danh',
+      artistName: 'Nghệ danh',
       avatar: 'Avatar',
-      linhvuc: 'Lĩnh vực',
+      field: 'Lĩnh vực',
       work: 'Công việc',
-      dochuyen: 'Độ chuyên',
-      ratings: 'Xếp hạng',
+      qualification: 'Độ chuyên',
+      artistLevel: 'Xếp hạng',
       action: 'Chức năng',
     },
     artistInformation: {
@@ -247,7 +246,7 @@ export default {
         id: 'ID',
         artistCode: 'Mã nghệ sỹ',
         fullName: 'Họ tên',
-        stageName: 'Nghệ danh',
+        artistName: 'Nghệ danh',
         birthday: 'Ngày sinh',
         sex: 'Giới tính',
         nationality: 'Quốc tịch',
@@ -255,8 +254,8 @@ export default {
         status: 'Trạng thái',
         field: 'Lĩnh vực',
         work: 'Công việc',
-        professionalism: 'Độ chuyên',
-        rating: 'Xếp hạng',
+        qualification: 'Độ chuyên',
+        artistLevel: 'Xếp hạng',
         phoneNumber: 'Số điện thoại',
         email: 'Email',
         facebook: 'FB Page',

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

@@ -37,7 +37,7 @@
               :id="id"
               :artist-code="artistCode"
               v-model:full-name="fullName"
-              v-model:stage-name="stageName"
+              v-model:artist-name="artistName"
               v-model:birthday="birthday"
               v-model:sex="sex"
               v-model:nationality="nationality"
@@ -45,8 +45,8 @@
               v-model:status="status"
               v-model:field="field"
               v-model:work="work"
-              v-model:professionalism="professionalism"
-              v-model:rating="rating"
+              v-model:qualification="qualification"
+              v-model:artist-level="artistLevel"
               v-model:phone-number="phoneNumber"
               v-model:email="email"
               v-model:facebook="facebook"

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

@@ -10,28 +10,6 @@ import BankAccount from '../../components/artist-information/bank-account/index.
 import HotProduct from '../../components/artist-information/hot-product/index.vue';
 import { useRoute } from 'vue-router';
 
-export type ArtistInfoType = {
-  id: number;
-  artistCode: string;
-  fullName: string;
-  stageName: string | null;
-  birthday: string | null;
-  sex: number;
-  nationality: string;
-  address: string | null;
-  status: number;
-  field: string | null;
-  work: string | null;
-  professionalism: string | null;
-  rating: string | null;
-  phoneNumber: string | null;
-  email: string | null;
-  facebook: string | null;
-  facebookMessage: string | null;
-  instagram: string | null;
-  whatsapp: string | null;
-};
-
 export default defineComponent({
   components: {
     PersonalInformation,
@@ -58,7 +36,7 @@ export default defineComponent({
     const id: Ref<number> = ref(0);
     const artistCode: Ref<string> = ref('');
     const fullName: Ref<string> = ref('');
-    const stageName: Ref<string | undefined> = ref();
+    const artistName: Ref<string | undefined> = ref();
     const birthday: Ref<string | undefined> = ref();
     const sex: Ref<number | undefined> = ref();
     const nationality: Ref<string | undefined> = ref();
@@ -66,8 +44,8 @@ export default defineComponent({
     const status: Ref<number> = ref(1);
     const field: Ref<string | undefined> = ref();
     const work: Ref<string | undefined> = ref();
-    const professionalism: Ref<string | undefined> = ref();
-    const rating: Ref<string | undefined> = ref();
+    const qualification: Ref<string | undefined> = ref();
+    const artistLevel: Ref<string | undefined> = ref();
     const phoneNumber: Ref<string | undefined> = ref();
     const email: Ref<string | undefined> = ref();
     const facebook: Ref<string | undefined> = ref();
@@ -96,8 +74,8 @@ export default defineComponent({
         status: 1,
         field: 'Âm nhạc',
         work: 'Ca sỹ',
-        professionalism: 'Chuyên nghiệp',
-        rating: 'Vip_1',
+        qualification: 'Chuyên nghiệp',
+        artistLevel: 'Vip_1',
         phoneNumber: '09999999999',
         email: 'sontung@gmail.com',
         facebook: '',
@@ -108,7 +86,7 @@ export default defineComponent({
 
       artistCode.value = fakeData.artistCode;
       fullName.value = fakeData.fullName;
-      stageName.value = fakeData.stageName;
+      artistName.value = fakeData.stageName;
       birthday.value = fakeData.birthday;
       sex.value = fakeData.sex;
       nationality.value = fakeData.nationality;
@@ -116,8 +94,8 @@ export default defineComponent({
       status.value = fakeData.status;
       field.value = fakeData.field;
       work.value = fakeData.work;
-      professionalism.value = fakeData.professionalism;
-      rating.value = fakeData.rating;
+      qualification.value = fakeData.qualification;
+      artistLevel.value = fakeData.artistLevel;
       phoneNumber.value = fakeData.phoneNumber;
       email.value = fakeData.email;
       facebook.value = fakeData.facebook;
@@ -135,7 +113,7 @@ export default defineComponent({
       id,
       artistCode,
       fullName,
-      stageName,
+      artistName,
       birthday,
       sex,
       nationality,
@@ -143,8 +121,8 @@ export default defineComponent({
       status,
       field,
       work,
-      professionalism,
-      rating,
+      qualification,
+      artistLevel,
       phoneNumber,
       email,
       facebook,

src/pages/khach-hang/customer.ts

@@ -230,11 +230,14 @@ export default defineComponent({
       //   }
       // }))
       // gọi api lấy chi tiết sau đấy gán giá trị api trả về gán cho các biến userName customerName businessName taxCode...
-      // userName.value = response.data.data.userName
+      const fakeDataDetail = {
+        userName: 'Sơn Tùng',
+      };
+      userName.value = fakeDataDetail.userName;
       // Tương tự các biến còn lại
     };
     const openUpdateCustomerDialog = (id: number) => {
-      showDialogUpdate.value = false;
+      showDialogUpdate.value = true;
       console.log(id, 'iddd');
       void getDetailCustomer(id);
     };

src/pages/nghe-sy/artist.ts

 import { i18n } from 'src/boot/i18n';
 import { defineComponent, onMounted, ref, Ref } from 'vue';
+import { PaginationResponse, ArtistInfoType } from 'src/assets/type';
 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,
@@ -33,10 +37,10 @@ export default defineComponent({
         sortable: false,
       },
       {
-        name: 'stageName',
-        field: 'stageName',
+        name: 'artistName',
+        field: 'artistName',
         required: true,
-        label: i18n.global.t('artist.tableColumnsArtist.stageName'),
+        label: i18n.global.t('artist.tableColumnsArtist.artistName'),
         headerStyle: 'text-align: center !important;',
         align: 'left',
         sortable: false,
@@ -51,10 +55,10 @@ export default defineComponent({
         sortable: false,
       },
       {
-        name: 'linhvuc',
-        field: 'linhvuc',
+        name: 'field',
+        field: 'field',
         required: true,
-        label: i18n.global.t('artist.tableColumnsArtist.linhvuc'),
+        label: i18n.global.t('artist.tableColumnsArtist.field'),
         headerStyle: 'text-align: center !important;',
         align: 'left',
         sortable: false,
@@ -69,19 +73,19 @@ export default defineComponent({
         sortable: false,
       },
       {
-        name: 'dochuyen',
-        field: 'dochuyen',
+        name: 'qualification',
+        field: 'qualification',
         required: true,
-        label: i18n.global.t('artist.tableColumnsArtist.dochuyen'),
+        label: i18n.global.t('artist.tableColumnsArtist.qualification'),
         headerStyle: 'text-align: center !important;',
         align: 'left',
         sortable: false,
       },
       {
-        name: 'ratings',
-        field: 'ratings',
+        name: 'artistLevel',
+        field: 'artistLevel',
         required: true,
-        label: i18n.global.t('artist.tableColumnsArtist.ratings'),
+        label: i18n.global.t('artist.tableColumnsArtist.artistLevel'),
         headerStyle: 'text-align: center !important;',
         align: 'left',
         sortable: false,
@@ -111,34 +115,31 @@ export default defineComponent({
       { id: 2, text: 'Nghiệp dư' },
     ]);
     const professionSelected: Ref<number | undefined> = ref();
-    const ratingOptions = ref([
+    const artistLevelOptions = ref([
       { id: 1, text: 'VIP_1' },
       { id: 2, text: 'VIP_2' },
     ]);
-    const ratingSelected: Ref<number | undefined> = ref();
-    const getListArtist = () => {
-      //   const response = (await api({
-      //     url: API_PATHS.getListArtist,
-      //     method: 'GET',
-      //     params: {
-      //       pageIndex: pageIndex.value,
-      //       pageSize: pageSize.value,
-      //     },
-      //   })) as AxiosResponse<BaseResponseBody<unknown>>;
-      const fakeData: unknown[] = [
-        {
-          id: 1,
-          artistCode: '0001',
-          fullName: 'Nguyễn Tùng Dương',
-          stageName: 'Tùng Dương',
-          avatar: '',
-          linhvuc: 'Âm nhạc',
-          work: 'Ca sĩ',
-          dochuyen: 'Chuyên nghiệp',
-          ratings: 'VIP_1',
+    const artistLevelSelected: Ref<number | undefined> = ref();
+
+    const getListArtists = async () => {
+      try {
+        const response = (await api({
+          url: API_PATHS.getListArtists,
+          method: 'GET',
+          params: {
+            pageIndex: pageIndex.value,
+            pageSize: pageSize.value,
           },
-      ];
-      userTableRowsArtist.value = fakeData;
+        })) 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;
+          console.log(response.data.data);
+        }
+      } catch (error) {}
+      // userTableRowsArtist.value = fakeData;
     };
     const filterListArtist = () => {
       //   const response = (await api({
@@ -153,15 +154,15 @@ export default defineComponent({
     };
     const changePageSize = () => {
       pageIndex.value = 1;
-      void getListArtist();
+      void getListArtists();
     };
     onMounted(() => {
-      void getListArtist();
+      void getListArtists();
     });
     return {
       userTableColumnsArtist,
       userTableRowsArtist,
-      getListArtist,
+      getListArtists,
       pageIndex,
       pageSize,
       filterListArtist,
@@ -173,8 +174,8 @@ export default defineComponent({
       fieldOptions,
       professionSelected,
       professionOptions,
-      ratingSelected,
-      ratingOptions,
+      artistLevelSelected,
+      artistLevelOptions,
     };
   },
 });

src/pages/nghe-sy/index.vue

@@ -33,8 +33,8 @@
     </div>
     <div class="col-2" dense outlined>
       <q-select
-        v-model="ratingSelected"
-        :options="ratingOptions"
+        v-model="artistLevelSelected"
+        :options="artistLevelOptions"
         option-label="text"
         option-value="id"
         dense
@@ -52,7 +52,7 @@
       </q-btn>
     </div>
     <div class="col-auto">
-      <q-btn color="primary" no-caps :label="$t('crudActions.add')"> </q-btn>
+      <q-btn color="primary" no-caps :label="$t('crudActions.add')"></q-btn>
     </div>
 
     <div class="col-12 q-mt-sm">
@@ -91,7 +91,7 @@
           v-model:pageSize="pageSize"
           :totalPage="totalPage"
           @update:pageSize="changePageSize"
-          @update:currentPage="getListArtist"
+          @update:currentPage="getListArtists"
         />
       </div>
     </div>