@sy-common/organize-select-help 1.0.0-beta.7 → 1.0.0-beta.9

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sy-common/organize-select-help",
-  "version": "1.0.0-beta.7",
+  "version": "1.0.0-beta.9",
   "description": "",
   "main": "index.js",
   "author": "lambo",

package/src/index.vue

@@ -63,9 +63,9 @@
               </div>
             </TabPane>
             <TabPane label="选择人员" name="staff">
-              <div class="tab">
-                <Input v-model="staffSearch" @on-blur="queryAllStaffList"	 placeholder="搜索组织节点"/>
-                <div class="tree staff-content">
+              <div class="tab" style="position:relative;">
+                <Input v-model="staffSearch" @on-blur="searchStaff" @on-enter="searchStaff"		 placeholder="搜索人员"/>
+                <div class="tree staff-content" @scroll="handleScroll">
                   <div :class="['gust-item',item.checked && 'staff-active']" v-for="item in staffAllList" :key="item.id"  @click="handlestaff(item)">
                     <div class="left-panel">{{item.name && item.name.slice(0,1) || ''}}</div>
                     <div class="right-panel">
@@ -74,6 +74,8 @@
                     </div>
                     <div class="checked-icon" v-show="item.checked">✔</div>
                   </div>
+                  <p v-if="staffEnding" style="color:#CCCCCC;text-align: center">---我也是有底线的---</p>
+                  <Spin v-if="loadingStaff" size="large" fix />
                 </div>
                 <div class="bottom-select">
                   <div>当前已选择 <span class="num">{{getCheckedStaff}}</span>人</div>
@@ -173,6 +175,10 @@ export default {
       staffSearch:'',
       staffAllList:[],
       staffList:[],
+      loadingStaff:false,
+      lastLoadingTime:0,
+      offset:0,
+      staffEnding:false,
       tagList:[{
         v:'所选市公司所有部门',
         on:false,
@@ -186,7 +192,7 @@ export default {
   },
   mounted() {
     this.queryPositionList()
-    this.queryAllStaffList()
+    this.loadMore()
   },
   methods:{
     queryPositionList(){
@@ -198,15 +204,58 @@ export default {
         }
       })
     },
+    searchStaff(){
+      this.staffEnding = false;
+      this.offset = 0
+      this.staffAllList = []
+      this.loadMore()
+    },
     queryAllStaffList(){
-      ajax.get('/pub-manage-server/pub/personHelpBox/q/queryAllStaffList?search='+this.staffSearch).then((res)=>{
-        if(res.data.code === 1){
-          let staffAllList = res.data.data && res.data.data.rows || []
-          staffAllList.map((item)=>item.checked=false)
-          this.staffAllList = staffAllList
-        }
+      return new Promise((resolve,reject)=>{
+          ajax.get('/pub-manage-server/pub/personHelpBox/q/queryAllStaffList',{
+            params:{
+              search:this.staffSearch,
+              offset:this.offset,
+              limit:10,
+            }
+          }).then((res)=>{
+            if(res.data.code === 1){
+              let resp = res.data.data
+              resolve(resp)
+            }else{
+              reject(false)
+            }
+          })
       })
     },
+    handleScroll(e){
+      const { scrollTop, clientHeight, scrollHeight } = e.target;
+      if (scrollHeight - (scrollTop + clientHeight) < 50) {
+        this.loadMore();
+      }
+    },
+    async loadMore(){
+      let nowTime = Date.now()
+      if (this.loadingStaff || this.staffEnding || (nowTime - this.lastLoadingTime < 1000)) return
+      this.loadingStaff = true
+      try {
+        console.log("--触底加载---")
+        let res = await this.queryAllStaffList()
+        let list = res.rows;
+        list.map((item)=>item.checked=false)
+        this.staffAllList = this.staffAllList.concat(list)
+        this.offset += 10;
+        this.loadingStaff = false
+        this.lastLoadingTime = Date.now()
+        if(res.total===this.staffAllList.length){
+          this.staffEnding = true
+        }
+      }catch (e){
+        this.loadingStaff = false
+        this.lastLoadingTime = Date.now()
+        console.log(e)
+      }
+    },
     getOrgList(data){
       this.proOrgList = data
     },