feat: 输入框简单支持

apps/bigmember_pc/src/views/search/bidding/index.vue

@@ -9,7 +9,8 @@ import {
   SearchBidBaseSchema,
   SearchBidMoreSchema
 } from '@/views/search/composables/constant/search-filters'
-import { reactive, ref } from 'vue'
+import { computed, reactive, ref } from 'vue'
+import Adsense from '@/views/order/components/adsense/index.vue'
 
 const filterModel = reactive({
   publishtime: 'fiveyear',
@@ -17,6 +18,34 @@ const filterModel = reactive({
   subtype: ''
 })
 
+const activeTab = ref('all')
+const Tabs = [
+  {
+    label: '全部',
+    key: 'all'
+  },
+  {
+    label: '招标采购公告',
+    key: 'bid'
+  },
+  {
+    label: '超前项目',
+    badge: '推荐',
+    key: 'project'
+  }
+]
+const searchTabs = computed(() => {
+  return Tabs.map((v) => {
+    v.active = activeTab.value === v.key
+    return v
+  })
+})
+
+const searchState = ref({
+  input: '',
+  matchKeys: []
+})
+
 const {
   listState,
   activeItemStyleType,
@@ -33,12 +62,28 @@ const {
 doQuery()
 
 function doChangeFilter() {}
+
+function doChangeTab(tab) {
+  activeTab.value = tab.key
+}
+
+function doSearch(val) {
+  doQuery({
+    searchvalue: val
+  }).then((res) => {
+    searchState.value.matchKeys = res.origin?.keywords?.split('') || [val]
+  })
+}
 </script>
 
 <template>
   <div class="search-bidding-page">
     <search-header-card
       class="search-bidding-header-container b-rd-8px m-t-24px"
+      v-model="searchState.input"
+      :tabs="searchTabs"
+      @change-tab="doChangeTab"
+      @search="doSearch"
     >
       <div slot="input-suffix" class="aaa">
         <el-badge value="限免" type="danger" class="publish-button">
@@ -71,6 +116,7 @@ function doChangeFilter() {}
             class="list-item"
             :model="activeItemStyleType"
             :class="{ visited: item.visited || item.ca_isvisit }"
+            :match-keys="searchState.matchKeys"
             :article="item"
             :index="index"
             :config="{
@@ -91,6 +137,7 @@ function doChangeFilter() {}
         </div>
       </template>
     </search-list>
+    <adsense class="footer-look-container" code="jy-pcsearch-bottom"></adsense>
   </div>
 </template>
 
@@ -110,5 +157,14 @@ function doChangeFilter() {}
 
   .search-bidding-list-container {
   }
+  .footer-look-container.adsense {
+    padding: 0;
+    padding-bottom: 16px;
+    ::v-deep {
+      .content {
+        border: none;
+      }
+    }
+  }
 }
 </style>

apps/bigmember_pc/src/views/search/components/search-header-card.vue

@@ -1,15 +1,50 @@
 <script setup>
 import SearchHeader from '@/views/search/components/SearchHeader.vue'
+import { ref, watch } from 'vue'
+
+const props = defineProps({
+  tabs: {
+    type: Array,
+    default: () => []
+  },
+  value: {
+    type: String,
+    default: ''
+  }
+})
+
+const emit = defineEmits(['change-tab', 'input'])
+
+const searchContent = ref('')
+
+watch(searchContent, () => {
+  emit('input', searchContent.value)
+})
 </script>
 
 <template>
   <div class="search-header-card">
     <div class="tab-header">
-      <span class="tab-header-item active">全部</span>
-      <span class="tab-header-item">招标采购公告</span>
-      <span class="tab-header-item">超前项目</span>
+      <el-badge
+        v-for="(tab, index) in tabs"
+        :key="index"
+        :value="tab.badge"
+        type="danger"
+        class="publish-button"
+      >
+        <span
+          class="tab-header-item"
+          :class="{ active: tab.active }"
+          @click="$emit('change-tab', tab)"
+        >
+          {{ tab.label }}
+        </span>
+      </el-badge>
     </div>
-    <search-header>
+    <search-header
+      v-model="searchContent"
+      @onSearch="$emit('search', searchContent)"
+    >
       <div slot="input-suffix" class="aaa">
         <el-badge value="限免" type="danger" class="publish-button">
           <el-button type="primary" round>信息发布</el-button>

data/data-models/modules/quick-search/plugins/base.js

@@ -11,14 +11,16 @@ class SearchListApiBase {
 
   /**
    * 统一查询 API 入口
+   * @param params - 请求参数
    * @returns {Promise<{success: boolean, total: number, list: []}>}
    */
 
-  async runQuery() {
+  async runQuery(params) {
     this.loading = true
     this.finished = false
     this.list = []
-    const result = await this.ajaxQuery(this._getParams())
+    const query = Object.assign({}, params, this._getParams(params))
+    const result = await this.ajaxQuery(query)
     if (result.success) {
       this.list = result.list
       this.total = result.total