优化

src/views/home/index.vue

@@ -48,6 +48,8 @@
     </div>
     <!-- <advert v-if="procureList.length > 0" :row="{ navlList: procureList, styleType: 1, aspectRatio: 393 / 220 }"></advert> -->
 
+    <el-image class="img-advertisement" :src="advertisement.url" @click="onPath(advertisement.path)" />
+
     <!-- 循环-商品楼层 -->
     <div v-for="(item1, index1) in homeList" :key="index1">
       <discover :row="item1" :datas="item1.shopList"></discover>
@@ -113,6 +115,7 @@ const bigbrandTitle = ref<any>('');
 const bigbrandList = ref<any>([]);
 const bigbrandOne = ref<any>({});
 const homeList = ref<any>([]);
+const advertisement = ref<any>({});
 
 onMounted(() => {
   document.documentElement.style.setProperty('--hover-color', '#E7000B');
@@ -464,5 +467,16 @@ getProjectCaseList({}).then((res) => {
       }
     }
   }
+
+  .img-advertisement {
+    display: flex;
+    width: 100%;
+    max-width: 1500px;
+    min-width: 1200px;
+    margin: 10px auto 0 auto;
+    aspect-ratio: 1200 / 120;
+    border-radius: 5px;
+    cursor: pointer;
+  }
 }
 </style>

src/views/home/pccomponents/pages/goods.vue

@@ -35,9 +35,16 @@
       </div>
     </div>
     <div v-else :style="boxCss">
-      <el-carousel height="384px" arrow="always" autoplay>
+      <el-carousel :height="carouselHeight" arrow="always" autoplay>
         <el-carousel-item v-for="(item1, index1) in dataList" :key="index1" class="w100% h100%">
-          <div class="goods-bos">
+          <div
+            class="goods-bos"
+            :ref="
+              (el) => {
+                if (el) goodsBoxRefs[index1] = el;
+              }
+            "
+          >
             <div
               v-for="(item, index) in item1"
               :key="index"
@@ -88,14 +95,32 @@ const props = defineProps<{
 }>();
 const componentData = props.row || {};
 const original = ref<any>([{}, {}, {}, {}, {}]);
+const carouselHeight = ref('384px');
+const goodsBoxRefs = ref({});
 
 onMounted(() => {
   if (props.datas) {
   } else {
     getDataList();
   }
+  window.addEventListener('resize', calcCarouselHeight);
 });
 
+onBeforeUnmount(() => {
+  window.removeEventListener('resize', calcCarouselHeight);
+});
+
+// 计算高度的函数
+const calcCarouselHeight = () => {
+  nextTick(() => {
+    const el = goodsBoxRefs.value[0];
+    if (el) {
+      // 获取真实渲染高度并赋值给轮播图
+      carouselHeight.value = el.offsetHeight + 'px';
+    }
+  });
+};
+
 const getDataList = () => {
   original.value = [{}, {}, {}, {}, {}];
   const apiFunc = componentData.clientId && componentData.clientId !== 'undefined' ? getCustomerProductPage : getDiyProductPage;

src/views/search/brand.vue

@@ -1,5 +1,10 @@
 <template>
   <div class="search-pages">
+    <div class="nav-bos">
+      <div v-for="(item, index) in navList" :key="index" class="data-list" @click="onPath(item.url)">
+        <el-image class="img" :src="item.imageUrl" />
+      </div>
+    </div>
     <!-- 筛选 -->
     <div class="search-head">
       <div class="head-bos">
@@ -63,6 +68,7 @@ import { Search } from '@element-plus/icons-vue';
 const total = ref(0);
 const dataList = ref<any>([]);
 const classifyList = ref<any>([]);
+const navList = ref<any>([{}, {}, {}, {}, {}]);
 
 const httpObj = ref<any>({
   categoryId: '',
@@ -145,6 +151,29 @@ onMounted(() => {
   margin: 15px auto 0 auto;
   padding-bottom: 20px;
 
+  .nav-bos {
+    display: flex;
+    gap: 0 10px;
+    width: 100%;
+    overflow: hidden;
+    margin-bottom: 10px;
+    .data-list {
+      width: 0;
+      border-radius: 5px;
+      overflow: hidden;
+      cursor: pointer;
+      flex: 0 0 calc((100% - 30px) / 4);
+      @media (min-width: 1320px) {
+        flex: 0 0 calc((100% - 40px) / 5);
+      }
+
+      .img {
+        width: 100%;
+        aspect-ratio: 232 / 300;
+      }
+    }
+  }
+
   // 筛选
   .search-head {
     width: 100%;