fix: load image

components.d.ts

@@ -1,8 +1,9 @@
 // generated by unplugin-vue-components
 // We suggest you to commit this file into source control
-// Read more: https://github.com/vuejs/vue-next/pull/3399
+// Read more: https://github.com/vuejs/core/pull/3399
+import '@vue/runtime-core'
 
-declare module 'vue' {
+declare module '@vue/runtime-core' {
   export interface GlobalComponents {
     AnswerItem: typeof import('./src/components/AnswerItem.vue')['default']
     AnswerItemNotifi: typeof import('./src/components/layouts/frag/AnswerItemNotifi.vue')['default']
@@ -14,6 +15,8 @@ declare module 'vue' {
     ElAutocomplete: typeof import('element-plus/es')['ElAutocomplete']
     ElAvatar: typeof import('element-plus/es')['ElAvatar']
     ElBadge: typeof import('element-plus/es')['ElBadge']
+    ElBreadcrumb: typeof import('element-plus/es')['ElBreadcrumb']
+    ElBreadcrumbItem: typeof import('element-plus/es')['ElBreadcrumbItem']
     ElButton: typeof import('element-plus/es')['ElButton']
     ElCard: typeof import('element-plus/es')['ElCard']
     ElCarousel: typeof import('element-plus/es')['ElCarousel']
@@ -32,6 +35,8 @@ declare module 'vue' {
     ElOption: typeof import('element-plus/es')['ElOption']
     ElPagination: typeof import('element-plus/es')['ElPagination']
     ElPopover: typeof import('element-plus/es')['ElPopover']
+    ElRadioButton: typeof import('element-plus/es')['ElRadioButton']
+    ElRadioGroup: typeof import('element-plus/es')['ElRadioGroup']
     ElRow: typeof import('element-plus/es')['ElRow']
     ElScrollbar: typeof import('element-plus/es')['ElScrollbar']
     ElSelect: typeof import('element-plus/es')['ElSelect']
@@ -67,9 +72,11 @@ declare module 'vue' {
     RelateExpert: typeof import('./src/components/ExpertDetail/RelateExpert.vue')['default']
     RequestItem: typeof import('./src/components/RequestItem.vue')['default']
     ResponseItem: typeof import('./src/components/orderExpert/responseItem.vue')['default']
+    RouterLink: typeof import('vue-router')['RouterLink']
+    RouterView: typeof import('vue-router')['RouterView']
     Search: typeof import('./src/components/Search.vue')['default']
     SearchByField: typeof import('./src/components/SearchByField.vue')['default']
   }
 }
 
-export { }
+export {}

src/components/ExpertsItem.vue

@@ -23,6 +23,12 @@
               :src="expert.img == '' || expert.img == null ? avarta : expert.img"
               alt=""
               class="h-[140px] w-[100px]"
+              @error="
+                e => {
+                  const target = e.target as HTMLImageElement
+                  target.src = userImg
+                }
+              "
             />
           </div>
         </div>
@@ -34,6 +40,7 @@
 <script setup lang="ts">
 import { Experts } from '~/models/Experts'
 import avarta from '~/assets/anhexpert.jpg'
+import userImg from '~/assets/user.png'
 defineProps<{
   expert: Experts
 }>()

src/components/HomeExpertnew.vue

@@ -23,6 +23,12 @@
                           :src="expert.img"
                           class="w-[210px] h-[300px] object-cover rounded-3xl"
                           style="height: 300px; border-radius: 10px"
+                          @error="
+                            e => {
+                              const target = e.target as HTMLImageElement
+                              target.src = userImg
+                            }
+                          "
                         />
                       </div>
                     </el-link>
@@ -34,18 +40,16 @@
                 <div class="md:flex">
                   <div class="md:shrink-0">
                     <img
-                      v-if="expert.img"
                       class="h-48 w-full object-cover md:h-full md:w-48"
                       alt="avatar"
                       style="height: 200px"
                       :src="expert.img"
-                    />
-
-                    <img
-                      v-else
-                      class="h-48 w-full object-cover md:h-full md:w-48"
-                      src="https://haycafe.vn/wp-content/uploads/2021/11/Anh-avatar-dep-chat-lam-hinh-dai-dien.jpg"
-                      alt="avatar"
+                      @error="
+                        e => {
+                          //@ts-ignore
+                          e.target.src = userImg
+                        }
+                      "
                     />
                   </div>
                   <div class="p-8">
@@ -97,6 +101,7 @@
 </template>
 
 <script setup lang="ts">
+import userImg from '~/assets/user.png'
 import { onMounted, ref } from 'vue'
 import { useStore } from '~/store/index'
 import { getHomepage } from '~/api/Homepage'

src/components/HomeFields.vue

@@ -10,6 +10,11 @@
                 :src="fields.img"
                 alt=""
                 class="inline-block w-64 h-48 lg:w-72 cover m-10 md:hover:scale-105 hover:duration-500 cursor-pointer rounded-2xl"
+                @error="
+                e => {
+                  const target = e.target as HTMLImageElement
+                  target.src = questionMark
+                }"
               />
             </el-link>
           </router-link>
@@ -31,6 +36,11 @@
                 :src="fields.img"
                 alt=""
                 class="inline-block w-64 h-48 lg:w-72 cover m-10 md:hover:scale-105 hover:duration-500 cursor-pointer rounded-2xl"
+                @error="
+                e => {
+                  const target = e.target as HTMLImageElement
+                  target.src = questionMark
+                }"
               />
             </el-link>
           </router-link>
@@ -47,6 +57,7 @@
 import { onMounted, ref } from 'vue'
 import { getField } from '~/api/Research-area'
 import { ResearchArea } from '~/models/Research-area'
+import questionMark from '~/assets/question-mark.png'
 
 const fieldsArr = ref<ResearchArea[]>()
 

src/constant.ts

@@ -1 +1 @@
-export const __baseURL = 'https://essme.luanbt.live/api'
+export const __baseURL = 'http://101.96.66.219:8010/api'

src/styles/element/index.scss

@@ -1,9 +1,9 @@
 $--colors: (
   "primary": (
-    "base": #409eff,
+    "base": #4b87c4,
   ),
   "success": (
-    "base": #21ba45,
+    "base": #228a3b,
   ),
   "warning": (
     "base": #f2711c,