筛选图片-添加

enum/institutionalStructure.js

@@ -1,7 +1,7 @@
 export const tilesImageEnum = {
 
     TILE: "https://api.ccttiot.com/image-1753750309203.png", // 瓦片图片
-
+    FILTER:"https://api.ccttiot.com/image-1753954149098.png" //筛选图片
 };
 
 export default tilesImageEnum;

pages/institutionalStructure/donationRecord.vue

@@ -10,6 +10,14 @@
           loading-text="加载中..."
       />
       <!-- 捐款记录内容将在这里添加 -->
+      <search-box
+          v-model="searchKeyword"
+          :width="'100%'"
+          :search-icon="CommonEnum.SEARCH"
+          placeholder="请输入搜索关键词"
+          btn-text="搜索"
+          @search="onSearch"
+      />
     </view>
 
   </view>
@@ -21,18 +29,21 @@ import CustomNavbar from "../../components/custom-navbar/custom-navbar.vue";
 import TileGrid from "../../components/tile-grid/tile-grid.vue";
 import CommonEnum from "../../enum/common";
 import StatusDisplay from "../../components/status-display/status-display.vue";
+import SearchBox from "../../components/search-box/search-box.vue";
 
 export default {
   components: {
     CustomNavbar,
     TileGrid,
-    StatusDisplay
+    StatusDisplay,
+    SearchBox
   },
   data() {
     return {
       CommonEnum,
       tilesImageEnum,
-      loading: false
+      loading: false,
+      searchKeyword: ''
     }
   },
   onLoad() {
@@ -40,6 +51,11 @@ export default {
     this.loadDonationRecords()
   },
   methods: {
+    onSearch(val) {
+      // 这里写你的搜索逻辑，比如重新请求数据
+      console.log('搜索内容：', val)
+      // this.loadDonationRecords(val)  // 你可以根据 val 过滤数据
+    },
     // 加载捐款记录
     async loadDonationRecords() {
       this.loading = true