update fix-bug

src/components/add-update-banner/index.vue

@@ -57,6 +57,7 @@
                   <q-card @click="uploadAvatar">
                     <div align="center" class="flex flex-center q-py-xs">
                       <q-icon
+                        style="color: #5d319e"
                         name="mdi-plus-circle-outline"
                         :size="'xs'"
                       ></q-icon>

src/components/add-update-post/index.vue

@@ -57,6 +57,7 @@
                   <q-card @click="uploadAvatar">
                     <div align="center" class="flex flex-center q-py-xs">
                       <q-icon
+                        style="color: #5d319e"
                         name="mdi-plus-circle-outline"
                         :size="'xs'"
                       ></q-icon>

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

@@ -212,7 +212,11 @@
               align="center"
               class="flex flex-center q-py-xs"
             >
-              <q-icon name="mdi-plus-circle-outline" size="xl"></q-icon>
+              <q-icon
+                style="color: #5d319e"
+                name="mdi-plus-circle-outline"
+                size="xl"
+              ></q-icon>
               <div class="q-mt-xs">{{ $t('uploadImage.uploadEmbed') }}</div>
             </div>
           </q-card>
@@ -227,7 +231,7 @@
               @click="$emit('click:openAddStoryDialog')"
               flat
               round
-              color="primary"
+              style="color: #5d319e"
               icon="mdi-plus-circle-outline"
               class="q-mr-md"
             >
@@ -245,7 +249,11 @@
               align="center"
               class="flex flex-center q-py-xs"
             >
-              <q-icon name="mdi-plus-circle-outline" size="xl"></q-icon>
+              <q-icon
+                style="color: #5d319e"
+                name="mdi-plus-circle-outline"
+                size="xl"
+              ></q-icon>
               <div class="q-mt-xs">{{ $t('uploadImage.uploadStory') }}</div>
             </div>
           </q-card>

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

@@ -21,6 +21,8 @@ export default defineComponent({
     artistLevel: { type: Number, required: true },
     phoneNumber: { type: String, required: true },
     email: { type: String, required: true },
+    phoneNumberAdminister: { type: String, required: true },
+    emailAdminister: { type: String, required: true },
     facebook: { type: String, required: true },
     facebookMessage: { type: String, required: true },
     instagram: { type: String, required: true },
@@ -36,6 +38,8 @@ export default defineComponent({
     artistNameRules: { type: Boolean, required: true },
     birthdayRules: { type: Boolean, required: true },
     emailRules: { type: Boolean, required: true },
+    emailAdministerRules: { type: Boolean, required: true },
+    phoneNumberAdministerRules: { type: Boolean, required: true },
     addressRules: { type: Boolean, required: true },
     phoneNumberRules: { type: Boolean, required: true },
     sexRules: { type: Boolean, required: true },
@@ -46,6 +50,8 @@ export default defineComponent({
     artistLevelRules: { type: Boolean, required: true },
     errorMessPhoneNumber: { type: String, required: true },
     errorMessEmail: { type: String, required: true },
+    errorMessPhoneNumberAdminister: { type: String, required: true },
+    errorMessEmailAdminister: { type: String, required: true },
   },
   components: {
     UploadImage,
@@ -144,6 +150,8 @@ export default defineComponent({
     };
   },
   emits: [
+    'update:emailAdminister',
+    'update:phoneNumberAdminister',
     'update:artistCode',
     'update:fullName',
     'update:avatar',

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

@@ -9,8 +9,8 @@
         <div class="col-3 text-weight-medium"></div>
         <div class="col-8 flex flex-center">
           <div>
-            <q-card style="margin-bottom: 8px" v-if="avatar !== null">
-              <q-img :src="avatar" style="height: 180px; width: 135px"></q-img>
+            <q-card class="q-mb-sm" v-if="avatar !== null">
+              <q-img :src="avatar" style="height: 240px; width: 185px"></q-img>
               <q-icon
                 name="mdi-close-circle"
                 color="red"
@@ -18,15 +18,19 @@
                 @click="deleteAvatar"
               ></q-icon>
             </q-card>
-            <q-card v-else style="margin-bottom: 8px">
+            <q-card v-else class="q-mb-sm">
               <q-img
                 src="~/assets/noavatar.png"
-                style="height: 180px; width: 135px"
+                style="height: 240px; width: 185px"
               ></q-img>
             </q-card>
             <q-card @click="uploadBanner">
               <div align="center" class="flex flex-center q-py-xs">
-                <q-icon name="mdi-plus-circle-outline" :size="'xs'"></q-icon>
+                <q-icon
+                  style="color: #5d319e"
+                  name="mdi-plus-circle-outline"
+                  :size="'xs'"
+                ></q-icon>
                 <div class="q-mt-xs">{{ $t('uploadImage.uploadBanner') }}</div>
               </div>
               <input
@@ -337,6 +341,45 @@
           ></q-input>
         </div>
       </div>
+
+      <div class="row q-mt-sm flex-center">
+        <div class="col-3 text-weight-medium">
+          {{
+            $t('artist.artistInformation.titleDataField.phoneNumberAdminister')
+          }}
+          <span style="color: red">*</span>
+        </div>
+        <div class="col-8">
+          <q-input
+            :model-value="phoneNumberAdminister"
+            @update:model-value="$emit('update:phoneNumberAdminister', $event)"
+            :error="phoneNumberAdministerRules"
+            :error-message="errorMessPhoneNumberAdminister"
+            mask="##########"
+            outlined
+            dense
+            hide-bottom-space
+          ></q-input>
+        </div>
+      </div>
+      <div class="row q-mt-md flex-center">
+        <div class="col-3 text-weight-medium">
+          {{ $t('artist.artistInformation.titleDataField.emailAdminister') }}
+          <span style="color: red">*</span>
+        </div>
+        <div class="col-8">
+          <q-input
+            :model-value="emailAdminister"
+            @update:model-value="$emit('update:emailAdminister', $event)"
+            :error="emailAdministerRules"
+            :error-message="errorMessEmailAdminister"
+            outlined
+            dense
+            hide-bottom-space
+          ></q-input>
+        </div>
+      </div>
+
       <div class="row q-mt-md flex-center">
         <div class="col-3 text-weight-medium">
           {{ $t('artist.artistInformation.titleDataField.facebook') }}

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

@@ -42,7 +42,6 @@
                     </q-img>
                     <q-icon
                       name="mdi-close-circle"
-                      color="red"
                       style="position: absolute; right: 0; font-size: 18px"
                       @click="deleteAvatar"
                     ></q-icon>
@@ -57,6 +56,7 @@
                   <q-card @click="uploadAvatar">
                     <div align="center" class="flex flex-center q-py-xs">
                       <q-icon
+                        style="color: #5d319e"
                         name="mdi-plus-circle-outline"
                         :size="'xs'"
                       ></q-icon>

src/components/upload-image/index.vue

@@ -13,6 +13,7 @@
       }"
     >
       <q-icon
+        style="color: #5d319e"
         name="mdi-plus-circle-outline"
         :size="isBtn ? 'sm' : 'xl'"
       ></q-icon>

src/i18n/vi/index.ts

@@ -482,8 +482,13 @@ export default {
         facebookMessage: 'FB Message',
         instagram: 'Instagram',
         whatsapp: 'Whatsapp',
+        phoneNumberAdminister: 'Số điện thoại quản lý',
+        emailAdminister: 'Email quản lý',
       },
       validateMessages: {
+        requireEmailAdminister: 'Vui lòng nhập Email người quản lý',
+        requirePhoneNumberAdminister:
+          'Vui lòng nhập Số điện thoại người quản lý',
         requireProducCode: 'Vui lòng nhập Mã sản phẩm',
         requireUrlembed: 'Vui lòng nhập Url Embed',
         requireArtistCode: 'Vui lòng nhập Mã nghệ sỹ',

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

 <template>
   <div class="q-mt-sm row q-col-gutter-sm">
     <div class="col-12" width="100%">
-      <q-card>
       <q-tabs
         v-model="tab"
         dense
@@ -56,12 +55,16 @@
             v-model:artist-level="artistLevel"
             v-model:phone-number="phoneNumber"
             v-model:email="email"
+            v-model:phone-number-administer="phoneNumberAdminister"
+            v-model:email-administer="emailAdminister"
             v-model:facebook="facebook"
             v-model:facebook-message="facebookMessage"
             v-model:instagram="instagram"
             v-model:whatsapp="whatsapp"
             :errorMessPhoneNumber="errorMessPhoneNumber"
             :errorMessEmail="errorMessEmail"
+            :errorMessPhoneNumberAdminister="errorMessPhoneNumberAdminister"
+            :errorMessEmailAdminister="errorMessEmailAdminister"
             :artistCodeRules="artistCodeRules"
             :fullNameRules="fullNameRules"
             :artistNameRules="artistNameRules"
@@ -69,6 +72,8 @@
             :emailRules="emailRules"
             :addressRules="addressRules"
             :phoneNumberRules="phoneNumberRules"
+            :emailAdministerRules="emailAdministerRules"
+            :phoneNumberAdministerRules="phoneNumberAdministerRules"
             :sexRules="sexRules"
             :nationalityRules="nationalityRules"
             :fieldRules="fieldRules"
@@ -125,7 +130,6 @@
           ></HotProduct>
         </q-tab-panel>
       </q-tab-panels>
-      </q-card>
     </div>
     <AddNewBankAccountDialog
       v-model:is-open-add-account-bank-dialog="isOpenAddAccountBankDialog"
@@ -183,7 +187,7 @@
             :label="$t('crudActions.back')"
           ></q-btn>
         </div>
-        <div class="col-auto q-mx-md">
+        <div class="col-auto q-mr-lg q-ml-sm">
           <q-btn
             color="primary"
             no-caps

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

@@ -113,6 +113,8 @@ export default defineComponent({
     const works: Ref<WorkType[]> = ref([]);
     const phoneNumber: Ref<string | null> = ref(null);
     const email: Ref<string | null> = ref(null);
+    const emailAdminister: Ref<string | null> = ref(null);
+    const phoneNumberAdminister: Ref<string | null> = ref(null);
     const facebook: Ref<string | null> = ref(null);
     const facebookMessage: Ref<string | null | undefined> = ref();
     const instagram: Ref<string | null | undefined> = ref();
@@ -145,6 +147,8 @@ export default defineComponent({
     const emailRules = ref(false);
     const addressRules = ref(false);
     const phoneNumberRules = ref(false);
+    const phoneNumberAdministerRules = ref(false);
+    const emailAdministerRules = ref(false);
     const sexRules = ref(false);
     const nationalityRules = ref(false);
     const fieldRules = ref(false);
@@ -159,6 +163,16 @@ export default defineComponent({
         'artist.artistInformation.validateMessages.requirePhoneNumber'
       )
     );
+    const errorMessEmailAdminister = ref(
+      i18n.global.t(
+        'artist.artistInformation.validateMessages.requireEmailAdminister'
+      )
+    );
+    const errorMessPhoneNumberAdminister = ref(
+      i18n.global.t(
+        'artist.artistInformation.validateMessages.requirePhoneNumberAdminister'
+      )
+    );
     watch(
       () => fields.value,
       (value) => {
@@ -231,6 +245,22 @@ export default defineComponent({
         }
       }
     );
+    watch(
+      () => phoneNumberAdminister.value,
+      (value) => {
+        if (value) {
+          phoneNumberAdministerRules.value = false;
+        }
+      }
+    );
+    watch(
+      () => emailAdminister.value,
+      (value) => {
+        if (value) {
+          emailAdministerRules.value = false;
+        }
+      }
+    );
     watch(
       () => sex.value,
       (value) => {
@@ -307,6 +337,8 @@ export default defineComponent({
       status.value = ArtistInformation.status;
       phoneNumber.value = ArtistInformation.phoneNumber;
       email.value = ArtistInformation.email;
+      // phoneNumberAdminister.value = ArtistInformation.phoneNumberAdminister;
+      // emailAdminister.value = ArtistInformation.emailAdminister;
       facebook.value = ArtistInformation.facebook;
       facebookMessage.value = ArtistInformation.facebookMessage;
       instagram.value = ArtistInformation.instagram;
@@ -675,6 +707,23 @@ export default defineComponent({
       //     'artist.artistInformation.validateMessages.isEmail'
       //   );
       // }
+      if (
+        !phoneNumberAdminister.value ||
+        !phoneNumberAdminister.value?.trim().length
+      ) {
+        hasError = true;
+        phoneNumberAdministerRules.value = true;
+        errorMessPhoneNumberAdminister.value = i18n.global.t(
+          'artist.artistInformation.validateMessages.requirePhoneNumberAdminister'
+        );
+      }
+      if (!emailAdminister.value || !emailAdminister.value?.trim().length) {
+        hasError = true;
+        emailAdministerRules.value = true;
+        errorMessEmailAdminister.value = i18n.global.t(
+          'artist.artistInformation.validateMessages.requireEmailAdminister'
+        );
+      }
 
       if (artistLevel.value === null) {
         hasError = true;
@@ -744,6 +793,8 @@ export default defineComponent({
             address: address.value,
             phoneNumber: phoneNumber.value,
             email: email.value,
+            // phoneNumberAdminister: phoneNumberAdminister.value,
+            // emailAdminister: emailAdminister.value,
             facebook: facebook.value,
             facebookMessage: facebookMessage.value,
             instagram: instagram.value,
@@ -900,6 +951,12 @@ export default defineComponent({
       errorMessEmail,
       errorMessPhoneNumber,
       confirmChangeIsDefault,
+      phoneNumberAdminister,
+      phoneNumberAdministerRules,
+      emailAdminister,
+      emailAdministerRules,
+      errorMessEmailAdminister,
+      errorMessPhoneNumberAdminister,
     };
   },
 });

src/pages/login/Login.ts

@@ -51,6 +51,7 @@ export const Login = defineComponent({
     };
 
     return {
+      isPwd: ref(true),
       usernameInputRules,
       passwordInputRules,
       user_name,

src/pages/login/index.vue

 <template>
   <q-page class="row items-center justify-evenly">
     <q-card class="login-card">
-      <q-card-section class="text-h5 text-center">{{
-        $t('loginPage.pageTitle')
-      }}</q-card-section>
+      <q-card-section class="text-center"
+        ><img src="icons/logo_cms_2.png" />
+      </q-card-section>
+      <q-separator inset />
       <q-card-section>
         <q-form autofocus @submit="onSubmit" @reset="resetForm">
           <q-input
@@ -14,18 +15,33 @@
             :rules="usernameInputRules"
             class="q-my-sm"
             :disable="loggingIn"
-          />
+          >
+            <template v-slot:prepend>
+              <q-icon name="mdi-account" />
+            </template>
+          </q-input>
 
           <q-input
             filled
-            type="password"
             v-model="password"
             :label="`${$t('loginPage.passwordInputLabel')} *`"
             lazy-rules
             :rules="passwordInputRules"
             class="q-my-sm"
+            :type="isPwd ? 'password' : 'text'"
             :disable="loggingIn"
+          >
+            <template v-slot:append>
+              <q-icon
+                :name="isPwd ? 'visibility_off' : 'visibility'"
+                class="cursor-pointer"
+                @click="isPwd = !isPwd"
               />
+            </template>
+            <template v-slot:prepend>
+              <q-icon name="mdi-lock" />
+            </template>
+          </q-input>
 
           <div>
             <q-btn

src/pages/nghe-sy/index.vue

@@ -89,9 +89,9 @@
           </q-td>
         </template>
         <template v-slot:body-cell-avatar="avatar">
-          <q-td style="padding: 0; height: 100%; text-align: center">
+          <q-td style="padding: auto; height: 100%; text-align: center">
             <q-img
-              style="width: 7rem; height: 5rem"
+              style="width: 9rem"
               fit="contain"
               :ratio="16 / 9"
               :src="

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

@@ -111,6 +111,8 @@ export default defineComponent({
     const works: Ref<WorkType[]> = ref([]);
     const phoneNumber: Ref<string | null> = ref(null);
     const email: Ref<string | null> = ref(null);
+    const emailAdminister: Ref<string | null> = ref(null);
+    const phoneNumberAdminister: Ref<string | null> = ref(null);
     const facebook: Ref<string | null> = ref(null);
     const facebookMessage: Ref<string | null | undefined> = ref();
     const instagram: Ref<string | null | undefined> = ref();
@@ -143,6 +145,8 @@ export default defineComponent({
     const emailRules = ref(false);
     const addressRules = ref(false);
     const phoneNumberRules = ref(false);
+    const phoneNumberAdministerRules = ref(false);
+    const emailAdministerRules = ref(false);
     const sexRules = ref(false);
     const nationalityRules = ref(false);
     const fieldRules = ref(false);
@@ -157,6 +161,16 @@ export default defineComponent({
         'artist.artistInformation.validateMessages.requirePhoneNumber'
       )
     );
+    const errorMessEmailAdminister = ref(
+      i18n.global.t(
+        'artist.artistInformation.validateMessages.requireEmailAdminister'
+      )
+    );
+    const errorMessPhoneNumberAdminister = ref(
+      i18n.global.t(
+        'artist.artistInformation.validateMessages.requirePhoneNumberAdminister'
+      )
+    );
     watch(
       () => fields.value,
       (value) => {
@@ -225,6 +239,22 @@ export default defineComponent({
         }
       }
     );
+    watch(
+      () => phoneNumberAdminister.value,
+      (value) => {
+        if (value) {
+          phoneNumberAdministerRules.value = false;
+        }
+      }
+    );
+    watch(
+      () => emailAdminister.value,
+      (value) => {
+        if (value) {
+          emailAdministerRules.value = false;
+        }
+      }
+    );
     watch(
       () => sex.value,
       (value) => {
@@ -613,6 +643,23 @@ export default defineComponent({
       //     'artist.artistInformation.validateMessages.isEmail'
       //   );
       // }
+      if (
+        !phoneNumberAdminister.value ||
+        !phoneNumberAdminister.value?.trim().length
+      ) {
+        hasError = true;
+        phoneNumberAdministerRules.value = true;
+        errorMessPhoneNumberAdminister.value = i18n.global.t(
+          'artist.artistInformation.validateMessages.requirePhoneNumberAdminister'
+        );
+      }
+      if (!emailAdminister.value || !emailAdminister.value?.trim().length) {
+        hasError = true;
+        emailAdministerRules.value = true;
+        errorMessEmailAdminister.value = i18n.global.t(
+          'artist.artistInformation.validateMessages.requireEmailAdminister'
+        );
+      }
 
       if (artistLevel.value === null) {
         hasError = true;
@@ -677,6 +724,8 @@ export default defineComponent({
             address: address.value,
             phoneNumber: phoneNumber.value,
             email: email.value,
+            // phoneNumberAdminister: phoneNumberAdminister.value,
+            // emailAdminister: emailAdminister.value,
             facebook: facebook.value,
             facebookMessage: facebookMessage.value,
             instagram: instagram.value,
@@ -827,6 +876,12 @@ export default defineComponent({
       errorMessEmail,
       errorMessPhoneNumber,
       confirmChangeIsDefault,
+      phoneNumberAdminister,
+      phoneNumberAdministerRules,
+      emailAdminister,
+      emailAdministerRules,
+      errorMessEmailAdminister,
+      errorMessPhoneNumberAdminister,
     };
   },
 });

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

 <template>
   <div class="q-mt-sm row q-col-gutter-sm">
     <div class="col-12" width="100%">
-      <q-card>
       <q-tabs
         v-model="tab"
         dense
@@ -56,12 +55,16 @@
             v-model:artist-level="artistLevel"
             v-model:phone-number="phoneNumber"
             v-model:email="email"
+            v-model:phone-number-administer="phoneNumberAdminister"
+            v-model:email-administer="emailAdminister"
             v-model:facebook="facebook"
             v-model:facebook-message="facebookMessage"
             v-model:instagram="instagram"
             v-model:whatsapp="whatsapp"
             :errorMessPhoneNumber="errorMessPhoneNumber"
             :errorMessEmail="errorMessEmail"
+            :errorMessPhoneNumberAdminister="errorMessPhoneNumberAdminister"
+            :errorMessEmailAdminister="errorMessEmailAdminister"
             :artistCodeRules="artistCodeRules"
             :fullNameRules="fullNameRules"
             :artistNameRules="artistNameRules"
@@ -69,6 +72,8 @@
             :emailRules="emailRules"
             :addressRules="addressRules"
             :phoneNumberRules="phoneNumberRules"
+            :emailAdministerRules="emailAdministerRules"
+            :phoneNumberAdministerRules="phoneNumberAdministerRules"
             :sexRules="sexRules"
             :nationalityRules="nationalityRules"
             :fieldRules="fieldRules"
@@ -125,7 +130,6 @@
           ></HotProduct>
         </q-tab-panel>
       </q-tab-panels>
-      </q-card>
     </div>
     <AddNewBankAccountDialog
       v-model:is-open-add-account-bank-dialog="isOpenAddAccountBankDialog"
@@ -183,7 +187,7 @@
             :label="$t('crudActions.back')"
           ></q-btn>
         </div>
-        <div class="col-auto q-mx-md">
+        <div class="col-auto q-mr-lg q-ml-sm">
           <q-btn
             color="primary"
             no-caps