2

src/components/stuMan/subscribe/replenish.vue

@@ -20,12 +20,22 @@
                 filled
                 v-model="stuInfo"
                 stack-label
+                use-input
                 option-value="StuId"
                 option-label="StuName"
                 :options="stuOptions"
                 label="学员列表"
                 class="col-10"
-              />
+                @filter="filterStu"
+              >
+                <template v-slot:no-option>
+                  <q-item>
+                    <q-item-section class="text-grey">
+                      未找到相关数据
+                    </q-item-section>
+                  </q-item>
+                </template>
+              </q-select>
               <div class="col-2 q-pt-md">
                 <q-btn
                   size="sm"
@@ -75,6 +85,7 @@ export default {
       if (val) {
         this.getStu();
         this.stuOptions = [];
+        this.AllStuOptions = [];
       }
     }
   },
@@ -84,7 +95,8 @@ export default {
         ChapterNo: 0
       },
       stuInfo: "",
-      stuOptions: []
+      stuOptions: [],
+      AllStuOptions: []
     };
   },
   methods: {
@@ -98,7 +110,21 @@ export default {
       };
       getCanMakeupStuList(msg).then(res => {
         if (res.Code == 1) {
-          this.stuOptions = res.Data;
+          this.stuOptions = JSON.parse(JSON.stringify(res.Data));
+          this.AllStuOptions = JSON.parse(JSON.stringify(res.Data));
+        }
+      });
+    },
+    //筛选学生
+    filterStu(val, update) {
+      update(() => {
+        if (val === "") {
+          this.stuOptions = JSON.parse(JSON.stringify(this.AllStuOptions));
+        } else {
+          const needle = val.toLowerCase();
+          this.stuOptions = this.AllStuOptions.filter(
+            v => v.StuName.toLowerCase().indexOf(needle) > -1
+          );
         }
       });
     },