提交

src/components/growthpath/GrowthCommonStudent.vue

@@ -78,26 +78,41 @@
                 class="chooseLeft"
                 style="display: grid; grid-template-columns: 250px auto"
               >
-                <div style="border: 1px solid #f0f0f0">
-                  <div class="tree" style="margin: 10px 4px 0 10px">
-                    <a-tree
-                      allow-clear
-                      tree-default-expand-all
-                      :tree-data="treeData"
-                      :load-data="onLoadData"
-                      v-model:selectedKeys="stuTreeSelectKeys"
-                      v-model:expandedKeys="stuTreeExpandedKeys"
-                      :fieldNames="{
-                        children: 'treeChildList',
-                        key: 'id',
-                        title: 'name',
-                        value: 'name',
-                      }"
-                      @select="stuStuOrgSelect"
-                    >
-                    </a-tree>
+                <a-spin :spinning="treeSpin">
+                  <div
+                    style="border: 1px solid #f0f0f0"
+                    :style="{
+                      height: screenHeight - 180 + 'px',
+                      overflowY: 'auto',
+                    }"
+                  >
+                    <a-input-search
+                      v-model:value="nameSearch.departName"
+                      placeholder="请输入部门名称"
+                      @search="getOrgList"
+                    />
+
+                    <div class="tree" style="margin: 10px 4px 0 10px">
+                      <a-tree
+                        allow-clear
+                        tree-default-expand-all
+                        :tree-data="treeData"
+                        :load-data="onLoadData"
+                        v-model:selectedKeys="stuTreeSelectKeys"
+                        v-model:expandedKeys="stuTreeExpandedKeys"
+                        :fieldNames="{
+                          children: 'treeChildList',
+                          key: 'id',
+                          title: 'name',
+                          value: 'name',
+                        }"
+                        @select="stuStuOrgSelect"
+                      >
+                      </a-tree>
+                    </div>
                   </div>
-                </div>
+                </a-spin>
+
                 <div
                   class="tableBox tabb"
                   style="margin: 0px 4px 0 10px; border: 1px solid #f0f0f0"
@@ -271,18 +286,28 @@ const activeKey = ref(1);
 
 const nameSearch = ref({
   keyword: "",
-  departId: "",
+  departName: "",
 });
 const stuTreeSelectKeys = ref([]);
 const stuTreeExpandedKeys = ref([]);
 
 const treeData = ref([]);
-request(ORG_LIST, {
-  keyword: "",
-}).then((res) => {
-  treeData.value = res.data;
-});
 
+const treeSpin = ref(false);
+const getOrgList = () => {
+  treeSpin.value = true;
+  request(ORG_LIST, {
+    keyword: nameSearch.value.departName,
+  })
+    .then((res) => {
+      treeData.value = res.data;
+    })
+    .finally(() => {
+      treeSpin.value = false;
+    });
+};
+
+getOrgList();
 const stuColumns = ref([
   {
     title: "姓名",
@@ -350,7 +375,9 @@ function stuStuOrgSelect(e) {
 
 const resetStu = () => {
   nameSearch.value.keyword = "";
-  stuTableRef.value.reset({ keyword: "", departId: "" });
+  nameSearch.value.departName = "";
+  stuTableRef.value.reset({ keyword: "", departId: "", departName: "" });
+  getOrgList();
 };
 //清空选择部门信息
 const deleteDepSelect = () => {
@@ -360,13 +387,13 @@ const deleteDepSelect = () => {
 
 //确定添加授权
 const confirm = () => {
-  if(!stuSelectRows.value.length && !projectSelectRows.value.length){
-    message.warning('请选择学员')
-    return
+  if (!stuSelectRows.value.length && !projectSelectRows.value.length) {
+    message.warning("请选择学员");
+    return;
   }
   visiable.value = false;
   emit("confirm", stuSelectRows.value, projectSelectRows.value);
-  closeDrawer()
+  closeDrawer();
 };
 
 onMounted(() => {
@@ -395,7 +422,7 @@ onMounted(() => {
   margin-left: 24px;
 }
 .CommonStudent {
-  .ant-form-item{
+  .ant-form-item {
     display: flex;
     align-items: center;
   }