Sfoglia il codice sorgente

卡管理 修改学校下拉选择
@index.vue 初始进入页面时,分配学校、注册学校、培训学校均调用获取数据。当省份对应的这个下拉变化时这3个(分配学校、注册学校、培训学校)需要把省市区的值作为参数加入重新调用接口加载数据进来。

jinxia.mo 1 settimana fa
parent
commit
7abe5b8497
2 ha cambiato i file con 19 aggiunte e 2 eliminazioni
  1. 1 0
      back-ui/src/hooks/useSchool.js
  2. 18 2
      back-ui/src/views/dz/cards/index.vue

+ 1 - 0
back-ui/src/hooks/useSchool.js

@@ -203,6 +203,7 @@ const useSchool = (options = {}) => {
     schoolList,
     selectedSchool,
     selectedAssignSchool,
+    getSchoolList,
 
     classList,
     selectedClass,

+ 18 - 2
back-ui/src/views/dz/cards/index.vue

@@ -36,7 +36,7 @@
       <el-row :gutter="20">
         <el-col :span="6">
           <el-form-item label="省份筛选" prop="provinceId">
-            <el-cascader class="w-[180px]!" :options="area.list" :props="cascaderProps" v-model="area.selected" clearable />
+            <el-cascader class="w-[180px]!" :options="area.list" :props="cascaderProps" v-model="area.selected" clearable @change="handleAreaChange" />
           </el-form-item>
         </el-col>
         <el-col :span="6">
@@ -235,6 +235,8 @@ const {
   selectedCampus,
   campusClassList,
   selectedCampusClass,
+  getSchoolList,
+  getCampusList,
 } = useSchool({ loadCampus: true, loadCampusClass: true, loadClass: true });
 const {
   exam_type,
@@ -439,8 +441,22 @@ const handleExport = () => {
 }
 
 
+// 处理省份变化
+const handleAreaChange = () => {
+  // 当省份变化时,useSchool hook 中的 watch 会自动调用 getSchoolList 和 getCampusList
+  // 这里不需要手动调用,因为 watch 已经处理了
+  // 但为了确保数据更新,我们可以显式调用(虽然 watch 已经处理了)
+  // 实际上 watch 会自动处理,所以这里可以留空或者添加其他逻辑
+}
+
 onMounted(() => {
-  handleQuery();
+  // 初始进入页面时,加载分配学校、注册学校、培训学校的数据
+  // 即使没有选择省份,也调用接口获取所有数据(areaCode 为 undefined 时接口会返回所有数据)
+  getSchoolList()
+  getCampusList()
+  
+  // 加载列表数据
+  handleQuery()
 })
 </script>
 <style lang="scss" scoped></style>