From a07fd1672bf13d97aad325374763d46655846417 Mon Sep 17 00:00:00 2001
From: "wskaudh@qq.com" <root@localhost.localdomain>
Date: Thu, 30 May 2024 11:34:10 +0800
Subject: [PATCH] =?UTF-8?q?fixed=20663b502=20from=20https://gitee.com/wska?=
 =?UTF-8?q?udh/django-vue3-admin/pulls/14=20=E5=9C=A8=E9=80=89=E6=8B=A9mod?=
 =?UTF-8?q?el=E7=9A=84=E9=A1=B5=E9=9D=A2=E6=B7=BB=E5=8A=A0=E6=90=9C?=
 =?UTF-8?q?=E7=B4=A2=E6=A8=A1=E5=9E=8B=E7=9A=84=E6=90=9C=E7=B4=A2=E6=A1=86?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../menu/components/MenuFieldCom/index.vue    | 31 +++++++++++++++++--
 1 file changed, 29 insertions(+), 2 deletions(-)

diff --git a/web/src/views/system/menu/components/MenuFieldCom/index.vue b/web/src/views/system/menu/components/MenuFieldCom/index.vue
index ec3822bb..435ce3d9 100644
--- a/web/src/views/system/menu/components/MenuFieldCom/index.vue
+++ b/web/src/views/system/menu/components/MenuFieldCom/index.vue
@@ -4,8 +4,15 @@
       <div v-show="props.model">
         <el-tag>已选择:{{ props.model }}</el-tag>
       </div>
+     <!-- 搜索输入框 -->
+    <el-input
+    v-model="searchQuery"
+    placeholder="搜索模型..."
+    style="margin-bottom: 10px;"
+  ></el-input>
       <div class="model-card">
-        <div v-for="(item,index) in allModelData" :value="item.key" :key="index">
+        <!--注释编号:django-vue3-admin-index483211: 对请求回来的allModelData进行computed计算，返加搜索框匹配到的内容-->
+        <div v-for="(item,index) in filteredModelData" :value="item.key" :key="index">
           <el-text :type="modelCheckIndex===index?'primary':''" @click="onModelChecked(item,index)">
             {{ item.app + '--' + item.title + '(' + item.key + ')' }}
           </el-text>
@@ -29,7 +36,7 @@
 </template>
 
 <script lang="ts" setup>
-import {ref, onMounted, reactive} from 'vue';
+import {ref, onMounted, reactive, computed } from 'vue';
 import {useFs} from '@fast-crud/fast-crud';
 import {createCrudOptions} from './crud';
 import {getModelList} from './api'
@@ -55,6 +62,26 @@ const onModelChecked = (row, index) => {
   props.model = row.key
   props.app = row.app
 }
+
+
+// 注释编号:django-vue3-admin-index083311:代码开始行
+// 功能说明:搭配搜索的处理，返回搜索结果
+const searchQuery = ref('');
+
+const filteredModelData = computed(() => {
+      if (!searchQuery.value) {
+        return allModelData.value;
+      }
+      const query = searchQuery.value.toLowerCase();
+      return allModelData.value.filter(item =>
+        item.app.toLowerCase().includes(query) ||
+        item.title.toLowerCase().includes(query) ||
+        item.key.toLowerCase().includes(query)
+      );
+    });
+// 注释编号:django-vue3-admin-index083311:代码结束行
+
+
 /**
  * 菜单选中时,加载表格数据
  * @param record
-- 
Gitee