feat:增加组织树及学员搜索

src/components/drawers/StuAdd.vue

@@ -84,6 +84,12 @@
                         :tree-data="treeData"
                         @select="departmentSelect"
                         v-model:selectedKeys="selectedKeys"
+                        :fieldNames="{
+                          children: 'treeChildList',
+                          key: 'id',
+                          title: 'name',
+                          value: 'name',
+                        }"
                       >
                         <template #suffixIcon></template>
                       </a-tree>
@@ -529,16 +535,27 @@
 </template>
 
 <script>
-import { reactive, toRefs, onMounted, onUnmounted, watch } from "vue";
+import {
+  reactive,
+  toRefs,
+  onMounted,
+  onUnmounted,
+  // watch
+} from "vue";
 import elementResizeDetectorMaker from "element-resize-detector";
 import { message } from "ant-design-vue";
 // import { toDate } from "../../api/method";
+// import * as api from '../../api/indexStu'
 import {
   getAudienceInfoApi,
   getMemberInfoApi,
   getOrgInfoApi,
 } from "@/api/indexStu";
-import { traverseArr, deepClone, batchLoadList } from "../../utils/utils";
+import {
+  traverseArr,
+  // deepClone,
+  batchLoadList,
+} from "../../utils/utils";
 
 export default {
   name: "StuAdd",
@@ -551,9 +568,12 @@ export default {
   setup(props, ctx) {
     const state = reactive({
       screenHeight: document.body.clientHeight, // 屏幕高度
-      pageSize: 9999999,
+      pageSize: 10,
       currentPage: 1,
       tableDataTotal: 0,
+      selectOrgId: null, //选中的组织id
+      selectOrgName: null, //选中的组织
+
       pageSize2: 10,
       currentPage2: 1,
       tableDataTotal2: 0,
@@ -1049,18 +1069,19 @@ export default {
       selectedRowKeys2: [], //表格选中的key
       //受众关联-------------------------------------
     });
+
     const closeDrawer = () => {
       state.activeKey = "1";
       ctx.emit("update:Stuvisible", false);
     };
 
-    watch(
-      () => props.Stuvisible,
-      (newVal) => {
-        console.log(newVal);
-        getComOnce();
-      }
-    );
+    // watch(
+    //   () => props.Stuvisible,
+    //   (newVal) => {
+    //     console.log("watch", newVal);
+    //     getComOnce();
+    //   }
+    // );
 
     const handleClose = () => {
       deleteAll();
@@ -1112,59 +1133,100 @@ export default {
         }
       );
     };
-    const getComOnce = async () => {
-      const item1 = await getOrgInfoApi({
-        pageNo: state.currentPage,
-        pageSize: state.pageSize,
-        id: 0,
-        keyWord: state.com,
-      }).then((res) => {
-        // console.log("res", res);
-        if (res.data.code === 200) return res.data.data.rows;
-      });
-      state.treeData = [];
-      const arr = traverseArr(item1, {
-        title: "name",
-        value: "id",
-        children: "children",
-      });
-      batchLoadList(
-        arr,
-        arr.length,
-        undefined,
-        (data) => {
-          data.forEach((item) => {
-            state.treeData.push(item);
-          });
-        },
-        () => {
-          console.log("完成");
-        }
-      );
 
-      state.copyTreeData = deepClone(arr);
+    // const getComOnce = async () => {
+    //   const item1 = await getOrgInfoApi({
+    //     pageNo: 1,
+    //     pageSize: 20,
+    //     id: -1,
+    //     keyWord: "",
+    //   })
+    //     .then((res) => {
+    //       console.log("res", res);
+    //       if (res.data.code === 200) return res.data.data;
+    //     })
+    //     .catch((err) => {
+    //       console.log("获取失败", err);
+    //     });
+    //   state.treeData = [];
+    //   const arr = traverseArr(item1, {
+    //     title: "name",
+    //     value: "id",
+    //     children: "treeChildList",
+    //   });
+    //   batchLoadList(
+    //     arr,
+    //     arr.length,
+    //     undefined,
+    //     (data) => {
+    //       data.forEach((item) => {
+    //         state.treeData.push(item);
+    //       });
+    //     },
+    //     () => {
+    //       console.log("完成");
+    //     }
+    //   );
+
+    //   state.copyTreeData = deepClone(arr);
+    // };
+    //获取组织树
+    const getTree = () => {
+      let obj = {
+        keyWord: "",
+        id: -1,
+        pageNo: 1,
+        pageSize: 20,
+      };
+      getOrgInfoApi(obj)
+        .then((res) => {
+          console.log("组织树获取成功", res);
+          if (res.data.code === 200) {
+            state.treeData = res.data.data;
+          }
+        })
+        .catch((err) => {
+          console.log("组织树获取失败", err);
+        });
     };
+    //获取学员
     const getMember = async (org) => {
-      if (!state.nameSearch && org === 0) {
+      if (!state.nameSearch && !org) {
         return false;
       }
+      console.log("org", org);
       const item1 = await getMemberInfoApi({
         pageNo: state.currentPage,
         pageSize: state.pageSize,
         keyWord: state.nameSearch,
-        org,
+        org: state.nameSearch ? null : org,
       }).then((res) => {
-        if (res.data.code === 200) return res.data.data.rows;
+        if (res.data.code === 200) {
+          console.log("获取学员", res.data);
+          state.tableDataTotal = res.data.data.total;
+          return res.data.data.rows;
+        }
       });
+
       state.tabledata = traverseArr(item1, {
         key: "id",
         name: "realName",
-        bum: "id",
-        numb: "depName",
+        bum: "depName",
+        numb: "id",
         guishu: "orgName",
       });
     };
-    getMember(0);
+    //分页获取学员
+    const changePagination = (page) => {
+      state.currentPage = page;
+      getMember(state.selectOrgId);
+    };
+    //搜索学员
+    const handleSearchStu = () => {
+      deleteDepSelect();
+      getMember(state.selectOrgId);
+    };
+
     const getShouzong = async () => {
       if (!state.nameaddd) {
         return false;
@@ -1186,9 +1248,6 @@ export default {
     };
     getShouzong();
 
-    const handleSearchStu = () => {
-      getMember(0);
-    };
     const handleSearchRest = () => {
       state.nameSearch = "";
       state.tabledata = [];
@@ -1209,6 +1268,10 @@ export default {
 
     const afterVisibleChange = (bool) => {
       console.log("state", bool);
+      if (bool) {
+        // getComOnce();
+        getTree();
+      }
     };
     const getClientHeight = () => {
       state.screenHeight = document.body.clientHeight;
@@ -1232,9 +1295,19 @@ export default {
     // 开始 快速选人------------------------------------------------------------------
     //选中部门
     const departmentSelect = (e, k) => {
-      console.log("选中的部门", e, k);
-      state.selectedKeys = [k.node.key];
-      getMember(k.selectedNodes[0].value);
+      if (!k.node.treeChildList) {
+        console.log("选中的部门", e, k);
+        state.selectedKeys = [k.node.key];
+        state.selectOrgId = k.selectedNodes[0].id;
+        state.selectOrgName = k.selectedNodes[0].name;
+        getMember(k.selectedNodes[0].id);
+      }
+    };
+    //清空选择部门信息
+    const deleteDepSelect = () => {
+      state.selectedKeys = null;
+      state.selectOrgId = null;
+      state.selectOrgName = null;
     };
     //快速选人 选中的数组
     const onSelectChange = (selectedRowKeys, item) => {
@@ -1592,6 +1665,7 @@ export default {
       deleteAll,
 
       searchOrg,
+      changePagination,
     };
   },
 };