update

src/assets/type.ts

@@ -520,6 +520,11 @@ export type VABInfoType = {
   website: string;
   phone: string;
   address: string;
+  insLink: string;
+  linked: string;
+  snapchat: string;
+  twtLink: string;
+  fbLink: string;
 };
 
 export type DetailVABInfoType = {
@@ -530,6 +535,11 @@ export type DetailVABInfoType = {
   website: string;
   phone: string;
   address: string;
+  insLink: string;
+  linked: string;
+  snapchat: string;
+  twtLink: string;
+  fbLink: string;
 };
 
 export type UpdateVABInfoType = {
@@ -540,4 +550,9 @@ export type UpdateVABInfoType = {
   website: string;
   phone: string;
   address: string;
+  insLink: string;
+  linked: string;
+  snapchat: string;
+  twtLink: string;
+  fbLink: string;
 };

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

@@ -42,7 +42,7 @@
       ></UploadImage>
     </div>
     <div class="col-12">
-      <div class="row q-col-gutter-lg">
+      <div class="row q-col-gutter-lg" style="margin-top: -30px">
         <div class="col-12">
           <q-carousel
             v-if="banners.length"
@@ -367,7 +367,7 @@
                 >
                   <q-tooltip>Xóa story</q-tooltip>
                 </q-icon>
-                <!-- <q-icon
+                <q-icon
                   v-if="stories.length"
                   style="
                     position: absolute;
@@ -379,7 +379,7 @@
                   name="mdi-pencil-circle"
                   @click="updateStory"
                   ><q-tooltip>Cập nhập story</q-tooltip>
-                </q-icon> -->
+                </q-icon>
               </div>
             </q-carousel-slide>
           </q-carousel>

src/components/update-info-vab/update-info-vab-dialog/index.vue

@@ -30,14 +30,14 @@
           style="max-height: calc(100vh - 10rem)"
         >
           <div class="row q-col-gutter-sm">
-            <div class="col-6">
+            <div class="col-6" style="margin-top: -12px">
               <div class="row flex-center">
                 <div class="q-mt-lg">
                   <q-card v-if="logo !== null">
                     <q-img
                       @click="uploadAvatar"
                       :src="logo"
-                      style="height: 390px; width: 350px; cursor: pointer"
+                      style="height: 6.8rem; width: 12.5rem; cursor: pointer"
                     ></q-img>
                     <q-icon
                       name="mdi-close-circle"
@@ -55,8 +55,8 @@
                     @click="uploadAvatar"
                     v-else
                     style="
-                      height: 390px;
-                      width: 350px;
+                      height: 6.8rem;
+                      width: 12.5rem;
                       border: 2px dashed #5d319e;
                       border-radius: 4px;
                       cursor: pointer;
@@ -64,8 +64,8 @@
                   >
                     <div
                       style="
-                        height: 390px;
-                        width: 350px;
+                        height: 6.8rem;
+                        width: 12.5rem;
                         display: flex;
                         align-items: center;
                         justify-content: center;
@@ -77,7 +77,10 @@
                         name="mdi-cloud-upload"
                         size="xl"
                       ></q-icon>
-                      Tải ảnh lên
+                      Tải lên logo
+                      <span style="font-size: 10px"
+                        >(kích cỡ: 160px x 64px)</span
+                      >
                     </div>
                   </div>
                   <div>
@@ -91,18 +94,45 @@
                   </div>
                 </div>
               </div>
-            </div>
-            <div class="col-6">
               <q-input
                 :model-value="comName"
                 @update:model-value="$emit('update:comName', $event)"
                 :label="$t('infoVAB.dialogLabel.infoVABLabels.comName')"
                 type="text"
-                class="q-my-sm q-pt-md"
+                class="q-my-sm q-pt-xl"
                 outlined
                 :rules="nameRules"
                 clearable
               ></q-input>
+              <q-input
+                :model-value="facebook"
+                @update:model-value="$emit('update:facebook', $event)"
+                :label="$t('infoVAB.dialogLabel.infoVABLabels.facebook')"
+                type="text"
+                class="q-my-sm"
+                outlined
+                clearable
+              ></q-input>
+              <q-input
+                :model-value="instagram"
+                @update:model-value="$emit('update:instagram', $event)"
+                :label="$t('infoVAB.dialogLabel.infoVABLabels.instagram')"
+                type="text"
+                class="q-my-sm"
+                outlined
+                clearable
+              ></q-input>
+              <q-input
+                :model-value="twitter"
+                @update:model-value="$emit('update:twitter', $event)"
+                :label="$t('infoVAB.dialogLabel.infoVABLabels.twitter')"
+                type="text"
+                class="q-my-sm"
+                outlined
+                clearable
+              ></q-input>
+            </div>
+            <div class="col-6">
               <q-input
                 :model-value="website"
                 @update:model-value="$emit('update:website', $event)"
@@ -142,6 +172,25 @@
                 class="q-my-sm"
                 outlined
                 clearable
+                hide-bottom-space
+              ></q-input>
+              <q-input
+                :model-value="snapchat"
+                @update:model-value="$emit('update:snapchat', $event)"
+                :label="$t('infoVAB.dialogLabel.infoVABLabels.snapchat')"
+                type="text"
+                class="q-my-sm"
+                outlined
+                clearable
+              ></q-input>
+              <q-input
+                :model-value="linkedin"
+                @update:model-value="$emit('update:linkedin', $event)"
+                :label="$t('infoVAB.dialogLabel.infoVABLabels.linkedin')"
+                type="text"
+                class="q-my-sm"
+                outlined
+                clearable
               ></q-input>
             </div>
           </div>
@@ -341,6 +390,11 @@ export default defineComponent({
     phone: { type: Number, required: true },
     email: { type: String, required: true },
     address: { type: String, required: true },
+    facebook: { type: String, required: true },
+    instagram: { type: String, required: true },
+    twitter: { type: String, required: true },
+    snapchat: { type: String, required: true },
+    linkedin: { type: String, required: true},
     bankAccountList: { type: Array as PropType<unknown[]>, required: true },
   },
   setup(_, context) {
@@ -451,6 +505,11 @@ export default defineComponent({
     'update:email',
     'update:address',
     'update:logo',
+    'update:facebook',
+    'update:instagram',
+    'update:twitter',
+    'update:snapchat',
+    'update:linkedin',
     'SetAvatar',
     'deleteAvatar',
     'saveInfoVAB',

src/i18n/vi/index.ts

@@ -841,8 +841,8 @@ export default {
 
   //thông tin chung
   infoVAB: {
-    title: 'Thông tin VAB',
-    uploadImg: 'Tải lên ảnh logo VAB',
+    title: 'Thông tin chung',
+    uploadImg: 'Tải lên ảnh logo',
     titleBankAccount: 'Danh sách tài khoản ngân hàng thụ hưởng',
     tableColumnsInfoVAB: {
       stt: 'STT',
@@ -863,7 +863,7 @@ export default {
     },
     dialogLabel: {
       title: {
-        updateInfoVAB: 'Cập nhật thông tin VAB',
+        updateInfoVAB: 'Cập nhật thông tin',
         //ngân hàng
         addBankAccount: 'Thêm ngân hàng thụ hưởng',
         updateBankAccount: 'Cập nhật ngân hàng thụ hưởng',
@@ -874,6 +874,11 @@ export default {
         phone: 'Số điện thoại *',
         email: 'Email *',
         address: 'Địa chỉ *',
+        facebook: 'Facebook',
+        instagram: 'Instagram',
+        twitter: 'Twitter',
+        snapchat: 'Snapchat',
+        linkedin: 'Linkedin',
         //ngân hàng
         cardCode: 'Số tài khoản *',
         numberCard: 'Số ghi trên thẻ *',
@@ -910,11 +915,11 @@ export default {
       confirmDeleteInfoVABTitle: 'Xác nhận',
       confirmDeleteInfoVABCancelBtnLabel: 'Huỷ',
       confirmDeleteInfoVABContent:
-        'Bạn có chắc chắn muốn xoá Thông tin VAB này không?',
+        'Bạn có chắc chắn muốn xoá Thông tin này không?',
     },
     actionMessages: {
-      deleteInfoVABAccess: 'Xoá thông tin VAB thành công',
-      updateInfoVABAccess: 'Cập nhật thông tin VAB thành công',
+      deleteInfoVABAccess: 'Xoá thông tin thành công',
+      updateInfoVABAccess: 'Cập nhật thông tin thành công',
     },
   },
 

src/pages/thong-tin-chung/index.vue

@@ -11,10 +11,6 @@
         :columns="infoVABTableColumns"
         row-key="infoVABName"
         separator="cell"
-        :rows-per-page-label="$t('recordPerPage')"
-        :pagination="{
-          rowsPerPage: 0,
-        }"
         wrap-cells
         :no-data-label="$t('emptyData')"
         hide-pagination
@@ -33,16 +29,6 @@
                 $t('infoVAB.toolTipMessage.updateInfoVAB')
               }}</q-tooltip>
             </q-btn>
-            <!-- <q-btn flat round color="primary" icon="mdi-delete-outline">
-              <q-tooltip :offset="[10, 10]">{{
-                $t('infoVAB.toolTipMessage.updateInfoVAB')
-              }}</q-tooltip>
-            </q-btn> -->
-          </q-td>
-        </template>
-        <template v-slot:body-cell-stt="item">
-          <q-td :item="item" style="text-align: center">
-            {{ 1 + item.rowIndex + pageSize * (pageIndex - 1) }}
           </q-td>
         </template>
         <template v-slot:body-cell-logo="logo">
@@ -58,16 +44,6 @@
       </q-table>
     </div>
 
-    <div class="col-12 q-mt-sm">
-      <Pagination
-        v-model:currentPage="pageIndex"
-        v-model:pageSize="pageSize"
-        :totalPage="totalPage"
-        @update:pageSize="changePageSize"
-        @update:currentPage="getListVABInfo"
-      />
-    </div>
-
     <UpdateInfoVABDialog
       v-model:isOpened="updateInfoVABDialogIsOpened"
       v-model:com-name="comName"
@@ -76,6 +52,11 @@
       v-model:phone="phone"
       v-model:email="email"
       v-model:address="address"
+      v-model:facebook="facebook"
+      v-model:twitter="twitter"
+      v-model:linkedin="linkedin"
+      v-model:instagram="instagram"
+      v-model:snapchat="snapchat"
       @SetAvatar="setAvatar($event)"
       @deleteAvatar="deleteAvatar"
       @saveInfoVAB="updateInfoVAB"
@@ -89,10 +70,8 @@ import { defineComponent, onMounted, ref, Ref } from 'vue';
 import { AxiosResponse } from 'axios';
 import { api, BaseResponseBody } from 'src/boot/axios';
 import { Notify } from 'quasar';
-import Pagination from 'components/pagination/index.vue';
 import {
   FileUploadType,
-  PaginationResponse,
   VABInfoType,
   DetailVABInfoType,
   UpdateVABInfoType,
@@ -106,19 +85,10 @@ export type AvatarType = {
 
 export default defineComponent({
   components: {
-    Pagination,
     UpdateInfoVABDialog,
   },
   setup() {
     const infoVABTableColumns = [
-      {
-        name: 'stt',
-        field: 'stt',
-        required: true,
-        label: 'STT',
-        align: 'center',
-        sortable: false,
-      },
       {
         name: 'comName',
         field: 'comName',
@@ -196,14 +166,12 @@ export default defineComponent({
     const infoVABId: Ref<number | undefined> = ref(undefined);
     const avatarFile: Ref<File | null> = ref(null);
     const avatarUploaded: Ref<string> = ref('');
-    const pageIndex = ref(1);
-    const pageSize = ref(20);
-    const totalPage = ref(1);
-    const changePageSize = () => {
-      pageIndex.value = 1;
-      void getListVABInfo();
-    };
     const VABInfoId: Ref<number | undefined> = ref(undefined);
+    const facebook: Ref<string> = ref('');
+    const twitter: Ref<string> = ref('');
+    const linkedin: Ref<string> = ref('');
+    const instagram: Ref<string> = ref('');
+    const snapchat: Ref<string> = ref('');
 
     //gọi api ds
     const getListVABInfo = async () => {
@@ -211,14 +179,10 @@ export default defineComponent({
         const response = (await api({
           url: API_PATHS.getListVABInfo,
           method: 'GET',
-          params: {
-            pageIndex: pageIndex.value,
-            pageSize: pageSize.value,
-          },
-        })) as AxiosResponse<BaseResponseBody<PaginationResponse<VABInfoType>>>;
+          params: {},
+        })) as AxiosResponse<BaseResponseBody<VABInfoType[]>>;
         if (response.data.error.code === config.API_RES_CODE.OK.code) {
-          infoVABTableRows.value = response.data.data.data;
-          totalPage.value = response.data.data.totalPages;
+          infoVABTableRows.value = response.data.data;
         }
       } catch (error) {}
     };
@@ -247,6 +211,11 @@ export default defineComponent({
           website.value = response.data.data.website;
           phone.value = response.data.data.phone;
           address.value = response.data.data.address;
+          instagram.value = response.data.data.insLink;
+          linkedin.value = response.data.data.linked;
+          snapchat.value = response.data.data.snapchat;
+          twitter.value = response.data.data.twtLink;
+          facebook.value = response.data.data.fbLink;
         }
       } catch (error) {}
     };
@@ -270,6 +239,11 @@ export default defineComponent({
         website: website.value,
         address: address.value,
         phone: phone.value,
+        insLink: instagram.value,
+        linked: linkedin.value,
+        snapchat: snapchat.value,
+        twtLink: twitter.value,
+        fbLink: facebook.value,
       };
       const response = (await api({
         url: API_PATHS.updateInfoVAB,
@@ -339,11 +313,12 @@ export default defineComponent({
       callApiUploadAvatar,
       deleteAvatar,
       configImg,
-      pageIndex,
-      pageSize,
-      totalPage,
-      changePageSize,
       VABInfoId,
+      facebook,
+      twitter,
+      linkedin,
+      instagram,
+      snapchat,
     };
   },
 });