添加动态数据下拉框，可以通过下拉框筛选获取后台数据；

未实现滚动分页；

Yi.Abp.Net8/framework/Yi.Framework.Ddd.Application/YiCrudAppService.cs

@@ -11,12 +11,12 @@ namespace Yi.Framework.Ddd.Application
     /// <summary>
     /// CRUD应用服务基类 - 基础版本
     /// </summary>
-    public abstract class YiCrudAppService<TEntity, TEntityDto, TKey> 
+    public abstract class YiCrudAppService<TEntity, TEntityDto, TKey>
         : YiCrudAppService<TEntity, TEntityDto, TKey, PagedAndSortedResultRequestDto>
         where TEntity : class, IEntity<TKey>
         where TEntityDto : IEntityDto<TKey>
     {
-        protected YiCrudAppService(IRepository<TEntity, TKey> repository) 
+        protected YiCrudAppService(IRepository<TEntity, TKey> repository)
             : base(repository)
         {
         }
@@ -30,7 +30,7 @@ namespace Yi.Framework.Ddd.Application
         where TEntity : class, IEntity<TKey>
         where TEntityDto : IEntityDto<TKey>
     {
-        protected YiCrudAppService(IRepository<TEntity, TKey> repository) 
+        protected YiCrudAppService(IRepository<TEntity, TKey> repository)
             : base(repository)
         {
         }
@@ -44,7 +44,7 @@ namespace Yi.Framework.Ddd.Application
         where TEntity : class, IEntity<TKey>
         where TEntityDto : IEntityDto<TKey>
     {
-        protected YiCrudAppService(IRepository<TEntity, TKey> repository) 
+        protected YiCrudAppService(IRepository<TEntity, TKey> repository)
             : base(repository)
         {
         }
@@ -58,7 +58,7 @@ namespace Yi.Framework.Ddd.Application
         where TEntity : class, IEntity<TKey>
         where TEntityDto : IEntityDto<TKey>
     {
-        protected YiCrudAppService(IRepository<TEntity, TKey> repository) 
+        protected YiCrudAppService(IRepository<TEntity, TKey> repository)
             : base(repository)
         {
         }
@@ -78,7 +78,7 @@ namespace Yi.Framework.Ddd.Application
         /// </summary>
         private const string TempFilePath = "/wwwroot/temp";
 
-        protected YiCrudAppService(IRepository<TEntity, TKey> repository) 
+        protected YiCrudAppService(IRepository<TEntity, TKey> repository)
             : base(repository)
         {
         }
@@ -96,7 +96,7 @@ namespace Yi.Framework.Ddd.Application
 
             // 获取并验证实体
             var entity = await GetEntityByIdAsync(id);
-            
+
             // 检查更新输入
             await CheckUpdateInputDtoAsync(entity, input);
 
@@ -124,10 +124,10 @@ namespace Yi.Framework.Ddd.Application
         {
             // 检查创建权限
             await CheckCreatePolicyAsync();
-            
+
             // 检查创建输入
             await CheckCreateInputDtoAsync(input);
-            
+
             // 映射到实体
             var entity = await MapToEntityAsync(input);
 
@@ -156,13 +156,13 @@ namespace Yi.Framework.Ddd.Application
         public override async Task<PagedResultDto<TGetListOutputDto>> GetListAsync(TGetListInput input)
         {
             List<TEntity> entities;
-            
+
             // 根据输入类型决定查询方式
             if (input is IPagedResultRequest pagedInput)
             {
                 // 分页查询
                 entities = await Repository.GetPagedListAsync(
-                    pagedInput.SkipCount, 
+                    pagedInput.SkipCount,
                     pagedInput.MaxResultCount,
                     string.Empty
                 );
@@ -176,7 +176,23 @@ namespace Yi.Framework.Ddd.Application
             // 获取总数并映射结果
             var totalCount = await Repository.GetCountAsync();
             var dtos = await MapToGetListOutputDtosAsync(entities);
-            
+
+            return new PagedResultDto<TGetListOutputDto>(totalCount, dtos);
+        }
+
+        /// <summary>
+        /// 获取实体动态下拉框列表，子类重写该方法，通过 keywords 进行筛选
+        /// </summary>
+        /// <param name="keywords">查询关键字</param>
+        /// <returns></returns>
+        public virtual async Task<PagedResultDto<TGetListOutputDto>> GetSelectDataListAsync(string? keywords = null)
+        {
+            List<TEntity> entities = await Repository.GetListAsync();
+
+            // 获取总数并映射结果
+            var totalCount = entities.Count;
+            var dtos = await MapToGetListOutputDtosAsync(entities);
+
             return new PagedResultDto<TGetListOutputDto>(totalCount, dtos);
         }
 

Yi.RuoYi.Vue3/src/components/SelectDataTag/index.vue

@@ -0,0 +1,83 @@
+<template>
+  <!-- 动态数据下拉选择框 -->
+  <el-select v-model="value" :value-key="servicekey" filterable remote clearable :placeholder="placeholder"
+    :loading="loading" :style="{ width: width + '%' }" :remote-method="remoteMethod" @change="handleChange"
+    @clear="handleClear">
+    <el-option v-for="item in options" :key="item[servicekey]" :label="item[servicelabel]" :value="item" />
+  </el-select>
+</template>
+
+<script setup name="SelectDataTag">
+import { ref } from 'vue';
+import request from '@/utils/request.js'
+
+const props = defineProps({
+  placeholder: {
+    type: String,
+    default: '请输入关键字',
+  },
+  width: {
+    type: [String, Number],
+    default: 100,
+  },
+  /** 动态服务名称 */
+  servicename: {
+    type: String,
+    required: true,
+  },
+  /** 指定响应数据的key */
+  servicekey: {
+    type: String,
+    required: true,
+  },
+  /** 指定响应数据的label */
+  servicelabel: {
+    type: String,
+    required: true,
+  },
+  /** 记录表格渲染行索引 */
+  index: {
+    type: [String, Number],
+    default: 0,
+  }
+});
+
+const emits = defineEmits(["change", "clear"]);
+
+const list = ref([]);
+const options = ref([]);
+const value = ref([]);
+const loading = ref(false);
+
+function getSelectDataList(query) {
+  return request({
+    url: '/' + props.servicename + '/select-data-list?keywords=' + query,
+    method: 'get',
+  });
+}
+
+function remoteMethod(query) {
+  options.value = [];
+  if (query) {
+    loading.value = true;
+
+    getSelectDataList(query).then(
+      (response) => {
+        list.value = response.data.items;
+        options.value = list.value;
+
+        loading.value = false;
+      }
+    );
+  }
+}
+
+function handleChange(data) {
+  emits("change", data || [], props.index);
+}
+
+function handleClear() {
+  emits("clear");
+}
+
+</script>

Yi.RuoYi.Vue3/src/main.js

@@ -43,6 +43,8 @@ import ImagePreview from "@/components/ImagePreview"
 import TreeSelect from '@/components/TreeSelect'
 // 字典标签组件
 import DictTag from '@/components/DictTag'
+// 动态数据下拉选择框组件
+import SelectDataTag from '@/components/SelectDataTag'
 
 const app = createApp(App)
 
@@ -57,6 +59,7 @@ app.config.globalProperties.selectDictLabel = selectDictLabel
 app.config.globalProperties.selectDictLabels = selectDictLabels
 
 // 全局组件挂载
+app.component('SelectDataTag', SelectDataTag)
 app.component('DictTag', DictTag)
 app.component('Pagination', Pagination)
 app.component('TreeSelect', TreeSelect)