新增授课记录外部讲师搜索下拉框

src/components/project/ProjectManagerOutTeacher.vue

@@ -0,0 +1,130 @@
+<template>
+  <a-select
+      :getPopupContainer="
+                          (triggerNode) => {
+                            return triggerNode.parentNode || document.body;
+                          }
+                        "
+      v-model:value="managerArray"
+      :placeholder="placeholder"
+      :filterOption="false"
+      :options="isOpen?options:selectOptions"
+      allowClear
+      showSearch
+      :disabled="disabled"
+      @popupScroll="memberScroll"
+      @search="searchMember"
+      :open="isOpen"
+      @change="change"
+      @blur="blur"
+      :show-arrow="false"
+      style="width: 100%"
+  >
+    <template v-if="loading" #notFoundContent>
+      <a-spin size="small"/>
+    </template>
+  </a-select>
+</template>
+<script setup>
+import {computed, defineEmits, defineProps, onMounted, ref, watch} from "vue";
+import {useThrottlePage} from "@/api/request";
+import { getTeacherList } from "@/api/Lecturer";
+const props = defineProps({
+  value: {
+    type: String,
+    default: ''
+  },
+  name: {
+    type: String,
+    default: ''
+  },
+  disabled: Boolean,
+  placeholder: {
+    type: String,
+    default: "请输入搜索关键字",
+  },
+  mode: String
+})
+
+const selectOptions = ref([])
+
+const managerArray = computed(() => props.value ===  '' ? null : props.value)
+
+const emit = defineEmits({})
+
+const isOpen = ref(false)
+function debounce(func, wait) {
+  let timeout;
+  return function(...args) {
+    clearTimeout(timeout);
+    timeout = setTimeout(() => func.apply(this, args), wait);
+  };
+}
+const memberParam = ref({teacherNameOrUserNo: '', pageNo:1, pageSize: 20})
+
+const userList = ref([])
+const loading = ref(false)
+const getOutTeacher = () => {
+  getTeacherList(memberParam.value).then(res=>{
+    if(res.data.code == 200){
+      userList.value = res.data.data.records
+      loading.value = false
+    }
+  })
+}
+const options = computed(() => userList.value.map(e => ({
+  label: e.name + '(' + e.userNo + ')' + e.organizationName,
+  value: e.name,
+  ...e,
+  audienceList: null
+})))
+
+watch(props, init)
+
+function init() {
+  //第一次进来 编辑赋值
+  // if (props.value && (props.value + '') !== selectOptions.value.map(e => e.value).join(',')) {
+  //   selectOptions.value = (props.value + '').split(',').map((e, i) => ({label: props.name.split(',')[i], value: e}))
+  // }
+}
+
+onMounted(() => {
+  console.log('onMounted')
+  init()
+  getOutTeacher()
+})
+
+
+const memberScroll = ({target: {scrollHeight, scrollTop, clientHeight}}) => {
+  scrollHeight === (clientHeight + scrollTop) && memberParam.value.pageNo++
+};
+const debounceObject = debounce(getOutTeacher,1000)
+//搜索学员
+const searchMember = (keyword) => {
+  console.log('searchMember', keyword)
+  loading.value = true
+  isOpen.value = true
+  userList.value = []
+  memberParam.value.pageNo = 1
+  memberParam.value.teacherNameOrUserNo = keyword
+  console.log('searchMember', memberParam.value)
+  debounceObject()
+};
+
+function blur() {
+  isOpen.value = false
+  memberParam.value.teacherNameOrUserNo = ''
+  memberParam.value.pageNo = 1
+}
+
+function change(e, l) {
+  memberParam.value.teacherNameOrUserNo = ''
+  memberParam.value.pageNo = 1
+  isOpen.value = false
+  Array.isArray(l) && (selectOptions.value = l)
+  Array.isArray(selectOptions.value) && emit('onChange', e, l)
+    emit('update:name', l?.label)
+    emit('update:value', l?.value)
+}
+
+</script>

src/views/lecturer/ExternalTeaching.vue

@@ -114,10 +114,10 @@
         <a-row :gutter="16">
           <a-col :span="12">
             <a-form-item label="讲师名称" name="teacher">
-              <ProjectManager v-model:value="formParam.userNo" 
+              <ProjectManagerOutTeacher v-model:value="formParam.userNo" 
         v-model:name="formParam.teacher"
         placeholder="请输入工号/讲师姓名进行检索"
-                            @onChange="managerChange" mode="multiple"></ProjectManager>    </a-form-item>
+                            @onChange="managerChange"></ProjectManagerOutTeacher>    </a-form-item>
           </a-col>
           <a-col :span="12">
             <a-form-item label="内容分类" name="systypeid">
@@ -278,6 +278,7 @@ import {
 } from '@ant-design/icons-vue';
 import { message } from "ant-design-vue";
 import ProjectManager from "@/components/project/ProjectManagerNew";
+import ProjectManagerOutTeacher from "@/components/project/ProjectManagerOutTeacher";
 import dayjs from "dayjs";
 import { updateInTeacher, getTeacherExpertise } from "../../api/Lecturer";
 import { getOuterTeacherCourseList, getAddress, updateInTeacherCourse, deleteInTeacherCourse, insertOutTeaherCourse,getOuterTeacherCourseDetail } from "../../api/Teaching";
@@ -292,6 +293,7 @@ export default {
     DownloadOutlined,//图标-导入
     FolderAddOutlined,//图标--新增
     ProjectManager,
+    ProjectManagerOutTeacher,
   },
   setup() {
     const router = useRouter();