11

src/views/home/jdcomponents/JDHeader.vue

@@ -45,7 +45,14 @@
         <div class="search-box-wrap flex-1">
           <div class="search-bar flex" :style="{ borderColor: config.themeColor }">
             <div class="input-group flex-1 flex">
-              <input v-model="input" type="text" :placeholder="config.placeholderText" />
+              <input v-model="input" type="text" />
+              <div class="carousel-bos">
+                <el-carousel height="34px" direction="vertical" autoplay>
+                  <el-carousel-item v-for="item in placeholderList" :key="item">
+                    <div class="carousel-word">{{ item }}</div>
+                  </el-carousel-item>
+                </el-carousel>
+              </div>
             </div>
             <button class="search-btn" :style="{ backgroundColor: config.themeColor }" @click="onPath('/search?type=1&input=' + input)">搜 索</button>
           </div>
@@ -72,6 +79,7 @@ import { getPlatformConfigList } from '@/api/breg/index';
 import { onPath } from '@/utils/siteConfig';
 const input = ref<any>('');
 const servicePhone = ref<any>('');
+const placeholderList = ref<any>([]);
 const config = ref<any>({
   hotWordList: []
 });
@@ -79,6 +87,10 @@ const config = ref<any>({
 currentSearchConfig({}).then((res) => {
   if (res.code == 200) {
     config.value = res.data;
+    if (res.data.placeholderText) {
+      placeholderList.value = res.data.placeholderText.split(',');
+      console.log(placeholderList.value, '77777777777777');
+    }
   }
 });
 
@@ -219,6 +231,20 @@ onUnmounted(() => {
   padding: 0 15px;
   align-items: center;
   height: 100%;
+  position: relative;
+  .carousel-bos {
+    position: absolute;
+    top: 0;
+    left: 0;
+    height: 34px;
+    width: 100%;
+    z-index: 1;
+    .carousel-word {
+      line-height: 34px;
+      color: #999;
+      padding-left: 15px;
+    }
+  }
 }
 .input-group input {
   width: 100%;