feat: 优化广告位显示隐藏逻辑2

apps/mobile/src/components/ad/Ad.vue

@@ -1,21 +1,27 @@
 <template>
-  <van-image
-    v-show="adShow"
+  <div
     v-if="adIfShow"
-    :id="getConfig.id"
-    class="reveal-box"
-    :class="{ radius }"
-    :src="getConfig.pic"
-    :alt="getConfig.name"
-    :style="getStyle"
-    @click.stop="openAD"
-    @load="loadSuccess"
+    class="ad-container"
+    :class="{ 'no-height-placeholder': mgb }"
   >
-    <div v-if="showTag" class="tag-text">广告</div>
-    <div v-if="showCloseIcon" class="close" @click.stop="close">
-      <van-icon name="cross" />
-    </div>
-  </van-image>
+    <van-image
+      v-show="adShow"
+      :id="getConfig.id"
+      ref="image"
+      class="reveal-box"
+      :class="{ radius }"
+      :src="getConfig.pic"
+      :alt="getConfig.name"
+      :style="getStyle"
+      @click.stop="openAD"
+      @load="loadSuccess"
+    >
+      <div v-if="showTag" class="tag-text">广告</div>
+      <div v-if="showCloseIcon" class="close" @click.stop="close">
+        <van-icon name="cross" />
+      </div>
+    </van-image>
+  </div>
 </template>
 
 <script>
@@ -76,6 +82,7 @@ export default {
     }
   },
   data: () => ({
+    mgb: false,
     loaded: false,
     destroyed: true,
     info: {}
@@ -114,7 +121,6 @@ export default {
     }
   },
   created() {
-    window.t = this
     if (this.ad) {
       this.getAD([this.ad])
     }
@@ -182,6 +188,8 @@ export default {
             console.log(`initd ${this.ad} from ajax`)
           } catch (e) {
             console.warn('获取广告位信息异常:', e)
+          } finally {
+            this.afterGetConfig()
           }
         }
       } else {
@@ -190,9 +198,26 @@ export default {
           this.info = info || {}
         } catch (e) {
           console.warn('获取广告位信息异常:', e)
+        } finally {
+          this.afterGetConfig()
         }
       }
     },
+    afterGetConfig() {
+      this.$nextTick(() => {
+        // 计算高度过小，给个占位类名
+        const image = this.$refs.image
+        if (image) {
+          const $el = image?.$el
+          if ($el) {
+            const height = $el.clientHeight
+            if (height < 10) {
+              this.mgb = true
+            }
+          }
+        }
+      })
+    },
     async getAdInfoFromRequest(codes) {
       const {
         data = {},
@@ -211,6 +236,9 @@ export default {
 </script>
 
 <style scoped lang="scss">
+.no-height-placeholder {
+  margin-bottom: 4px;
+}
 .reveal-box {
   position: relative;
   border-radius: 8px;

apps/mobile/src/views/search/result/bidding/index.vue

@@ -27,22 +27,22 @@
         </van-tab>
       </van-tabs>
     </div> -->
-    <div class="j-header linear-main-bg" v-show="tabSwitchShow">
+    <div v-show="tabSwitchShow" class="j-header linear-main-bg">
       <!-- 筛选器 -->
       <BiddingSearchFilters
-        :bidColPower="pageState.bidColPower"
+        ref="searchFilters"
+        v-model="filters"
+        :bid-col-power="pageState.bidColPower"
         class="top-radius"
         :class="{ 'loading-mask': listState.loading }"
-        ref="searchFilters"
+        :default-filter-state="noChangeDefaultFilterState"
+        :dropdown-menu-max-height="conf.maxHeight"
+        :info-type-source-conf="activeSearchGroupInfo"
+        :top-search="topSearch"
         @noPower="onNoPower"
         @confirm="onFilterConfirm"
         @reset="doSearch"
         @open="doOpen"
-        :defaultFilterState="noChangeDefaultFilterState"
-        :dropdownMenuMaxHeight="conf.maxHeight"
-        :infoTypeSourceConf="activeSearchGroupInfo"
-        :topSearch="topSearch"
-        v-model="filters"
       />
       <!-- 精简列表/详细列表/表格 -->
       <!-- <div v-if="tabSwitchShow" class="tab-switch bg-white border-line-b">
@@ -71,7 +71,7 @@
           </div>
         </div>
       </div> -->
-      <div class="flex flex-justify-between tab-saved" v-if="isLogin">
+      <div v-if="isLogin" class="flex flex-justify-between tab-saved">
         <div class="tab-saved-left ellipsis">
           <span class="tab-saved-left-label">已选：</span>
           <span class="tab-saved-left-value">{{ calcFilterText }}</span>
@@ -83,12 +83,12 @@
           <span class="save-action" @click="saveFilterToHistory">保存</span>
         </div>
       </div>
-      <div class="intercept-tip-container" v-show="interceptTipText">
+      <div v-show="interceptTipText" class="intercept-tip-container">
         <AppIcon name="tishi" /> {{ interceptTipText }}
       </div>
     </div>
-    <div class="j-main list-container" ref="listContainer">
-      <div class="tab-search-info" v-show="tabSearchInfoShow">
+    <div ref="listContainer" class="j-main list-container">
+      <div v-show="tabSearchInfoShow" class="tab-search-info">
         <div
           class="flex flex-(items-center justify-between) tab-search-info-top"
         >
@@ -101,9 +101,9 @@
               </template>
             </p>
             <div
-              class="data-export clickable"
               v-show="!inInjectBI"
               v-if="listState.total > 0"
+              class="data-export clickable"
               @click="dataExport"
             >
               <AppIcon name="shujudaochu_xiao1" />
@@ -121,11 +121,11 @@
             >
               <div class="tab-column">
                 <div
+                  v-for="(tab, index) in cardTypeTabList"
+                  :key="index"
                   class="tab-column-item"
                   :class="{ active: pageState.listTabActive === tab.name }"
-                  v-for="(tab, index) in cardTypeTabList"
                   :name="tab.name"
-                  :key="index"
                   @click.stop="onListTabClick(tab.name)"
                 >
                   {{ tab.title }}
@@ -152,8 +152,7 @@
                 class="search-mode-label-icon"
                 name="help1"
                 @click="showSearchModeHelp"
-              >
-              </AppIcon>
+              />
             </div>
             搜索模式 按照当前条件共匹配到{{ toggleBlurModeTip.count }}条公告。
             <div class="search-model-switch" @click="doToggleSearchBlurMode">
@@ -169,8 +168,8 @@
         :style="{ opacity: cardLoaded ? 'unset' : '0' }"
       >
         <RecommendCard
-          ref="recommendCardRef"
           v-if="recommendInfo.show"
+          ref="recommendCardRef"
           :key="recommendInfo.key"
           v-model="recommendInfo.showContent"
           :chart-data="recommendInfo.chart"
@@ -182,49 +181,49 @@
       </div>
       <van-list
         v-show="pageState.listTabActive !== 'table'"
+        ref="vanList"
         v-model="listState.loading"
         :finished="listState.finished"
         :offset="listState.offset"
         :finished-text="finishedText"
-        @load="getList"
         class="more-list calc-height-1px"
-        ref="vanList"
+        @load="getList"
       >
-        <div class="list-wrapper" ref="listWrapper">
+        <div ref="listWrapper" class="list-wrapper">
           <van-popup
+            v-model="showBidStatus"
             :style="popupHeight"
             get-container="body"
-            v-model="showBidStatus"
             round
             position="bottom"
           >
-            <bid-status-node
+            <BidStatusNode
+              :project-cell-info="projectCellInfo"
               @cancel-update="cancelUpdate"
               @save-success="saveSuccess"
-              :project-cell-info="projectCellInfo"
               @set-height="setHeight"
-            ></bid-status-node>
+            />
           </van-popup>
           <template v-for="(item, index) in searchList">
             <ProjectCell
               v-if="!item.ad"
+              v-visited:content="item.id"
               class="list-item"
               :class="item.className"
-              :cardType="calcProjectCardType(item)"
+              :card-type="calcProjectCardType(item)"
               :time-fmt="getTimeFmt"
-              :detailList="item.detailList"
-              @click="goToDetail(item)"
+              :detail-list="item.detailList"
+              :key="item.vKid"
               :title="item.title"
               :detail="filters.scope.includes('content') ? item.detail : null"
               :filetext_search="item.filetext_search"
               :fs_keys="item.fs_word"
               :time="item.dateTime"
-              v-visited:content="item.id"
-              :isFile="item.isFile"
+              :is-file="item.isFile"
               :keys="pageState.splitKeys"
-              :leftTopBadgeText="item.leftTopBadgeText"
+              :left-top-badge-text="item.leftTopBadgeText"
               :tags="item.tagList"
-              :key="item.vKid"
+              @click="goToDetail(item)"
             >
               <template #buyerText="{ item }">
                 <span
@@ -235,15 +234,15 @@
               </template>
               <template #winnerText="{ item }">
                 <span
+                  v-for="(winner, index) in item.children"
+                  :key="index"
                   class="winner-item highlight-text link-clickable j-splitter"
                   data-j-splitter="、"
-                  v-for="(winner, index) in item.children"
                   @click.stop="toToEntProfile(winner.id)"
-                  :key="index"
                   >{{ winner.text }}</span
                 >
               </template>
-              <template slot="icon" v-if="item.isCB.id">
+              <template v-if="item.isCB.id" slot="icon">
                 <div
                   class="right-event"
                   style="margin-right: 24px"
@@ -264,9 +263,9 @@
               </template>
               <template slot="icon">
                 <button
+                  v-if="inInjectBI"
                   class="bi-report-inject-button"
                   :disabled="computedHasAddInfoStatus(item)"
-                  v-if="inInjectBI"
                   @click.stop="doAddInfoOfBI(item)"
                 >
                   {{ computedHasAddInfoStatus(item) ? '已添加' : '添加' }}
@@ -278,7 +277,7 @@
                       'icon-star-fill': item.star,
                       'icon-star-streak': !item.star
                     }"
-                  ></span>
+                  />
                   <span>&nbsp;{{ item.star ? '已收藏' : '收藏' }}</span>
                 </div>
               </template>
@@ -290,20 +289,19 @@
               class="middle-list-container"
             >
               <AdSingle
-                v-show="item.show"
+                v-if="item.show"
+                key="ad-item"
                 :class="item.className"
                 :ad="getContentAdID"
-                :showCloseIcon="true"
-                cache
-                key="ad-item"
-                :beforeOpen="beforeOpenAd"
-                @close="onListAdClose(item)"
+                :show-close-icon="true"
+                :before-open="beforeOpenAd"
                 class="ad-container"
+                @close="onListAdClose(item)"
               />
             </div>
           </template>
         </div>
-        <div class="max-see-more" v-if="showMoreThanMaxCount">
+        <div v-if="showMoreThanMaxCount" class="max-see-more">
           <p class="m-s-content">
             <span>为您展示前{{ listState.count }}条，</span>
             <template v-if="isFree">
@@ -321,7 +319,7 @@
           </p>
         </div>
         <AppEmpty v-show="listState.list.length === 0 && listState.finished">
-          <div class="empty-text" v-html="emptyText"></div>
+          <div class="empty-text" v-html="emptyText" />
           <van-button
             v-if="!inInjectBI"
             class="feedback-button"
@@ -329,15 +327,16 @@
             size="small"
             type="primary"
             @click="feedback"
-            >意见反馈</van-button
           >
+            意见反馈
+          </van-button>
         </AppEmpty>
       </van-list>
       <div
-        class="table-container calc-height-1px"
         v-show="pageState.listTabActive === 'table'"
+        class="table-container calc-height-1px"
       >
-        <div class="scroll" v-show="listState.list.length">
+        <div v-show="listState.list.length" class="scroll">
           <table class="table">
             <tr class="table-header">
               <td v-if="containsNiJian">项目代码</td>
@@ -355,10 +354,10 @@
             </tr>
             <tr
               v-for="item in listState.list.slice(0, 20)"
-              class="table-content-tr"
+              :key="item.id"
               v-visited:content="item.id"
+              class="table-content-tr"
               @click="goToDetail(item)"
-              :key="item.id"
             >
               <!-- 项目代码 -->
               <td v-if="containsNiJian">
@@ -372,7 +371,7 @@
                     pageState.splitKeys
                   )
                 "
-              ></td>
+              />
               <!-- 公告类型 -->
               <td v-if="!containsNiJian">
                 {{ item.subtype ? `${item.subtype}公告` : '-' }}
@@ -393,7 +392,9 @@
                 {{ formatTypeofItemKey(item.budget, 'money-table') }}
               </td>
               <!-- 招标单位 -->
-              <td v-if="!containsNiJian">{{ item.buyer || '-' }}</td>
+              <td v-if="!containsNiJian">
+                {{ item.buyer || '-' }}
+              </td>
               <!-- 开标时间 -->
               <td v-if="!containsNiJian">
                 {{ formatTypeofItemKey(item.bidOpenTime, 'date') }}
@@ -420,35 +421,33 @@
           </table>
         </div>
         <div
+          v-show="listState.list.length > 20"
           class="to-look-more"
           :class="{ 'ios-look-more': $envs.inIOS }"
-          v-show="listState.list.length > 20"
         >
-          <van-button plain size="small" type="primary" @click="dataExport"
-            >查看更多</van-button
-          >
+          <van-button plain size="small" type="primary" @click="dataExport">
+            查看更多
+          </van-button>
         </div>
         <!-- 占位解决ios回弹底部遮挡 -->
-        <div
-          v-show="listState.list.length > 20 && $envs.inIOS"
-          class="seat"
-        ></div>
+        <div v-show="listState.list.length > 20 && $envs.inIOS" class="seat" />
         <AppEmpty v-show="listState.list.length === 0 && listState.finished">
-          <div class="empty-text" v-html="emptyText"></div>
+          <div class="empty-text" v-html="emptyText" />
           <van-button
             class="feedback-button"
             plain
             size="small"
             type="primary"
             @click="feedback"
-            >意见反馈</van-button
           >
+            意见反馈
+          </van-button>
         </AppEmpty>
       </div>
     </div>
     <div class="sub-position">
       <!-- 直接订阅 -->
-      <div class="sub-this-keywords" v-show="subThisNoticeShow">
+      <div v-show="subThisNoticeShow" class="sub-this-keywords">
         <AppIcon
           class="left"
           name="close_touming"
@@ -461,29 +460,27 @@
         </div>
       </div>
     </div>
-    <!--    客服-->
-    <customer-corner :scroll-status="scrollStatus" bottom-position="18%" />
+    <!--    客服 -->
+    <CustomerCorner :scroll-status="scrollStatus" bottom-position="18%" />
     <SearchFilterHistoryDialog
       v-model="pageState.saveFilterDialog"
-      :beforeClose="beforeFilterHistoryDialogClose"
+      :before-close="beforeFilterHistoryDialogClose"
       :content="pageState.calcFilterParams"
     />
     <OneKeySubscribeDialog
       v-model="pageState.oneKeySub.prompt"
       :keywords="filters.keywords"
-      :areaSet="pageState.oneKeySub.areaSet"
+      :area-set="pageState.oneKeySub.areaSet"
     />
-    <popupDataexport
-      ref="popup_dataExport"
-      @next="next_export"
-    ></popupDataexport>
+    <PopupDataexport ref="popup_dataExport" @next="next_export" />
   </div>
 </template>
 
 <script>
 import qs from 'qs'
-import { mapState, mapGetters, mapActions } from 'vuex'
-import { Cell, Tab, Tabs, List, Button, Tag, Popup, Popover, Icon } from 'vant'
+import { mapActions, mapGetters, mapState } from 'vuex'
+import { Button, Cell, Icon, List, Popover, Popup, Tab, Tabs, Tag } from 'vant'
+import { throttle } from 'lodash'
 import bidStatusNode from '@/components/bid-update/BidUpdate'
 import AdSingle from '@/components/ad/Ad'
 import BiddingSearchFilters from '@/components/search/bidding/filters'
@@ -492,52 +489,50 @@ import OneKeySubscribeDialog from '@/components/search/bidding/oneKeySubscribeDi
 import RecommendCard from '@/components/recommend/'
 import popupDataexport from '@/components/dataExport/popupDataexport.vue'
 import CustomerCorner from '@/components/customer/index'
-import { AppIcon, AppEmpty, ProjectCell } from '@/ui'
-import { setUserSubInfo, getFreeSubscribeInfo } from '@/api/modules/public'
+import { AppEmpty, AppIcon, ProjectCell } from '@/ui'
+import { getFreeSubscribeInfo, setUserSubInfo } from '@/api/modules/public'
 import { leadGetDate } from '@/api/modules/leadGeneration'
 import { LINKS } from '@/data'
 import {
-  BIDDING_SEARCH_LAST_FILTERS_CACHE_KEY,
-  BIDDING_SEARCH_GROUP_LAST_CACHE_KEY
+  BIDDING_SEARCH_GROUP_LAST_CACHE_KEY,
+  BIDDING_SEARCH_LAST_FILTERS_CACHE_KEY
 } from '@/utils/constant'
-import { throttle } from 'lodash'
 import toLogin from '@/utils/mixins/modules/to-login'
 import { mixinPoints } from '@/utils/mixins/modules/points'
 import {
-  moneyUnit,
+  FilterHistoryAjaxModel2ViewModel,
+  FilterHistoryViewModel2AjaxModel,
+  InfoTypeTransform,
+  calcNotExactTime,
+  dateFormatter,
+  deepCompareInfoType,
+  filterHistoryNotEmptyFormat,
   formatMoney,
-  getRandomString,
   getRandomNumber,
+  getRandomString,
+  moneyUnit,
   openAppOrWxPage,
-  replaceKeyword,
-  dateFormatter,
-  calcNotExactTime,
   openLinkOfOther,
-  InfoTypeTransform,
-  FilterHistoryViewModel2AjaxModel,
-  FilterHistoryAjaxModel2ViewModel,
-  filterHistoryNotEmptyFormat,
-  deepCompareInfoType
+  replaceKeyword
 } from '@/utils'
 import {
-  getBiddingSearchList,
-  freeSubscribeKeys,
-  searchIndexDataExport,
-  selectEnt,
-  getBiddingFilterList,
   addBiddingFilter,
-  freeUserNeedOneKeySubscribe,
-  getBidColPower,
-  checkBiddingFilterPass,
+  ajaxCanBiaoAction,
+  ajaxCanBiaoStatus,
   ajaxGetInfoIds,
   ajaxSetInfoId,
-  ajaxCanBiaoStatus,
-  ajaxCanBiaoAction
+  checkBiddingFilterPass,
+  freeSubscribeKeys,
+  freeUserNeedOneKeySubscribe,
+  getBidColPower,
+  getBiddingFilterList,
+  getBiddingSearchList,
+  searchIndexDataExport,
+  selectEnt
 } from '@/api/modules'
 
 export default {
   name: 'SearchResultBidding',
-  mixins: [toLogin, mixinPoints],
   components: {
     [Button.name]: Button,
     [Cell.name]: Cell,
@@ -556,10 +551,11 @@ export default {
     ProjectCell,
     AdSingle,
     RecommendCard,
-    bidStatusNode,
-    popupDataexport,
+    BidStatusNode: bidStatusNode,
+    PopupDataexport: popupDataexport,
     CustomerCorner
   },
+  mixins: [toLogin, mixinPoints],
   inject: {
     topSearch: {
       default: () => {}
@@ -965,7 +961,7 @@ export default {
     },
     // 切换模糊搜索
     toggleBlurModeTip() {
-      const isBlurMode = this.filters.searchMode.indexOf('1') !== -1
+      const isBlurMode = this.filters.searchMode.includes('1')
       let canShow = isBlurMode ? false : this.toggleSearchBlurData.show
       if (this.listState.loading) {
         canShow = false
@@ -1008,15 +1004,15 @@ export default {
     }
   },
   watch: {
-    'topSearch.input'(n, o) {
+    'topSearch.input': function (n, o) {
       if (o && o.length === 1 && !n) {
         this.clear()
       }
     },
-    'pageState.searchGroup'(n) {
+    'pageState.searchGroup': function (n) {
       this.setUrlSearchGroupQuery(n)
     },
-    'pageState.listTabActive'(n, o) {
+    'pageState.listTabActive': function (n, o) {
       if (n === 'table') {
         // toast提示
         if (this.listState.list.length) {
@@ -1474,7 +1470,7 @@ export default {
       this.getList()
     },
     // 暂未用到
-    onRefresh: function () {
+    onRefresh() {
       // 重置数据
       this.listState.pageNum = 1
       // 解除加载完成状态
@@ -1519,8 +1515,8 @@ export default {
         reqType: '', // cache:空搜索缓存数据；lastNews:最新数据
         keyWords: this.filters.keywords,
         province: area,
-        city: city,
-        district: district,
+        city,
+        district,
         subtype: infoTypeText.join(','), // 信息类型
         publishTime: FilterHistoryViewModel2AjaxModel.formatTime(
           this.filters.dateTime,
@@ -1755,7 +1751,7 @@ export default {
     },
     // 切换搜索模式：精准搜索0/模糊搜索1
     switchSearchMode(m) {
-      this.filters.searchMode = [m + '']
+      this.filters.searchMode = [`${m}`]
     },
     // 获取参标状态
     async getCanBiaoStatus(arr) {
@@ -1842,7 +1838,7 @@ export default {
       if (projectInfo) {
         Object.assign(item, projectInfo)
       }
-      const region = city ? city : area
+      const region = city || area
       const buyerClass =
         item?.buyerClass && item?.buyerClass !== '其它'
           ? item?.buyerClass
@@ -2051,7 +2047,7 @@ export default {
     // 收藏
     async doCollection(item, index) {
       if (!this.isLogin) {
-        this.pageState.cacheStar = index + ''
+        this.pageState.cacheStar = `${index}`
         this.saveState()
         return openLinkOfOther(LINKS.APP登录页.app, {
           query: {
@@ -2063,7 +2059,7 @@ export default {
         status: item.star,
         id: item.id,
         beforeRedirect: () => {
-          this.pageState.cacheStar = index + ''
+          this.pageState.cacheStar = `${index}`
           this.saveState()
         },
         complete: ({ type, message }) => {
@@ -2205,7 +2201,7 @@ export default {
         // 订阅的关键词 = 主关键词 + 多关键词
         let formatKeyword = ''
         if (tags && tags.length) {
-          formatKeyword = this.filters.keywords + ' ' + tags.join(' ')
+          formatKeyword = `${this.filters.keywords} ${tags.join(' ')}`
         } else {
           formatKeyword = this.filters.keywords
         }
@@ -2250,7 +2246,7 @@ export default {
           // 订阅的关键词 = 主关键词 + 多关键词
           let formatKeyword = ''
           if (tags && tags.length) {
-            formatKeyword = this.filters.keywords + ' ' + tags.join(' ')
+            formatKeyword = `${this.filters.keywords} ${tags.join(' ')}`
           } else {
             formatKeyword = this.filters.keywords
           }
@@ -2279,7 +2275,6 @@ export default {
                   wordsMode
                 }
               })
-              return
             }
           } else {
             this.toSetFreeKey()
@@ -2295,7 +2290,7 @@ export default {
       // 订阅的关键词 = 主关键词 + 多关键词
       let formatKeyword = ''
       if (tags && tags.length) {
-        formatKeyword = this.filters.keywords + ' ' + tags.join(' ')
+        formatKeyword = `${this.filters.keywords} ${tags.join(' ')}`
       } else {
         formatKeyword = this.filters.keywords
       }
@@ -2490,7 +2485,7 @@ export default {
       /**
        * 1.从招标采购搜索首页，点击了“超前项目”、“招标预告”、“招标公告”、“招标结果”，则已选结果此处展示点击的类型
        * 2.输入框有关键词 已选结果才展示搜索范围和搜索模式
-       * */
+       */
       let labelList = formattedList
         .filter((v) => {
           if (v.label.includes('信息类型')) {
@@ -2578,7 +2573,7 @@ export default {
     saveState() {
       const { listContainer } = this.$refs
       this.listState.scrollTop = listContainer
-        ? parseInt(listContainer.scrollTop)
+        ? Number.parseInt(listContainer.scrollTop)
         : 0
       this.$storage.set(
         this.$route.path,
@@ -2793,7 +2788,7 @@ export default {
     async getCustomReportData(keyWords) {
       const params = {
         dType: 0,
-        keyWords: keyWords
+        keyWords
       }
       try {
         const { error_code: code = 0, data } = await leadGetDate(params)
@@ -2856,7 +2851,7 @@ export default {
       return replaceKeyword(
         value,
         keyStr,
-        '<span class="highlight-text-orange-bd">' + keyStr + '</span>'
+        `<span class="highlight-text-orange-bd">${keyStr}</span>`
       )
     },
     moveRecommendCard(n) {
@@ -2895,6 +2890,7 @@ export default {
   }
 }
 </script>
+
 <style lang="scss">
 .winner-item:active {
   background: transparent;
@@ -2912,6 +2908,7 @@ export default {
   }
 }
 </style>
+
 <style lang="scss" scoped>
 .tip-toggle-search-mode-container {
   display: flex;
@@ -3123,7 +3120,7 @@ export default {
 }
 
 .ad-container {
-  margin: 12px;
+  margin: 8px;
 }
 .empty-text {
   font-size: 15px;