From 77d3ba0c3bc5c8a34c5f3266bc39aba68f011446 Mon Sep 17 00:00:00 2001 From: weifashi <605403358@qq.com> Date: Fri, 4 Aug 2023 17:14:46 +0800 Subject: [PATCH] =?UTF-8?q?feat=EF=BC=9A=E5=AE=A1=E6=89=B9=E4=B8=AD?= =?UTF-8?q?=E5=BF=83=E5=88=97=E8=A1=A8=20-=20=E6=B7=BB=E5=8A=A0=E4=B8=8A?= =?UTF-8?q?=E6=8B=89=E5=8A=A0=E8=BD=BD=E5=8A=9F=E8=83=BD=EF=BC=8C=E4=BB=A5?= =?UTF-8?q?=E5=8F=8A=E4=B8=80=E4=BA=9BloadIng=E6=95=88=E6=9E=9C?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../js/pages/manage/approve/details.vue | 3 +- .../assets/js/pages/manage/approve/index.vue | 224 +++++++++++++----- resources/assets/sass/pages/page-approve.scss | 16 ++ 3 files changed, 189 insertions(+), 54 deletions(-) diff --git a/resources/assets/js/pages/manage/approve/details.vue b/resources/assets/js/pages/manage/approve/details.vue index a81e8e674..4a16f77fd 100644 --- a/resources/assets/js/pages/manage/approve/details.vue +++ b/resources/assets/js/pages/manage/approve/details.vue @@ -293,6 +293,7 @@ export default { }, // 获取详情 getInfo(isScrollToBottom = false) { + this.loadIng++; this.$store.dispatch("call", { method: 'get', url: 'approve/process/detail', @@ -388,7 +389,7 @@ export default { }, // 提交评论 confirmComment(){ - this.loadIng++; + this.loadIng = 1; this.$store.dispatch("call", { method: 'post', url: 'approve/process/addGlobalComment', diff --git a/resources/assets/js/pages/manage/approve/index.vue b/resources/assets/js/pages/manage/approve/index.vue index 05a97863c..9747d6ee7 100644 --- a/resources/assets/js/pages/manage/approve/index.vue +++ b/resources/assets/js/pages/manage/approve/index.vue @@ -13,41 +13,55 @@ -
{{$L('暂无数据')}}
-
-
-
-
- -
+
+
-
- +
+
+
{{$L('暂无数据')}}
+
+
+
+
+ +
+
+ +
+
+
+
+ +
{{$L('暂无数据')}}
-
+
-
+
+
+ +
@@ -58,20 +72,26 @@
{{$L('暂无数据')}}
-
+
-
+
+
+ +
@@ -81,22 +101,28 @@ -
{{$L('暂无数据')}}
+
{{$L('暂无数据')}}
-
+
-
+
+
+ +
@@ -195,13 +221,15 @@ export default { name: "approve", data() { return { + modalTransferIndex: window.modalTransferIndex, + minDate: new Date(2020, 0, 1), maxDate: new Date(2025, 10, 1), currentDate: new Date(2021, 0, 17), procdefList: [], page: 1, - pageSize: 250, + pageSize: 10, total: 0, noText: '', loadIng: false, @@ -224,11 +252,25 @@ export default { { value: 4, label: this.$L("已撤回") } ], // - unreadTotal: 0, unreadList: [], + unreadPage: 1, + unreadTotal: 0, + unreadLoad: false, + // doneList: [], + donePage: 1, + doneLoad: false, + doneTotal: 0, + // notifyList: [], + notifyPage: 1, + notifyLoad: false, + notifyTotal: 0, + // initiatedList: [], + initiatedPage: 1, + initiatedLoad: false, + initiatedTotal: 0, // details: {}, detailsShow: false, @@ -276,7 +318,7 @@ export default { } }, watch: { - '$route' (to, from) { + '$route' (to) { if(to.name == 'manage-approve'){ this.tabsClick() } @@ -308,6 +350,7 @@ export default { this.addData.startTime = this.addData.endTime = this.getCurrentDate(); }, methods:{ + // 获取当前时间 getCurrentDate() { const today = new Date(); const year = today.getFullYear(); @@ -315,6 +358,7 @@ export default { const date = String(today.getDate()).padStart(2, '0'); return `${year}-${month}-${date}`; }, + // tab切换事件 tabsClick(val,time= 1000){ if(!val && this.__tabsClick && time>0){ @@ -325,19 +369,35 @@ export default { this.loadIng = true; } this.tabsValue = val || this.tabsValue - if(val!=""){ + if(val){ this.approvalType = this.searchState = "all" } if(this.tabsValue == 'unread'){ + if(val === false){ + this.unreadPage = 1; + this.unreadList = []; + } this.getUnreadList(); } if(this.tabsValue == 'done'){ + if(val === false){ + this.donePage = 1; + this.doneList = []; + } this.getDoneList(); } if(this.tabsValue == 'notify'){ + if(val === false){ + this.notifyPage = 1; + this.notifyList = []; + } this.getNotifyList(); } if(this.tabsValue == 'initiated'){ + if(val === false){ + this.initiatedPage = 1; + this.initiatedList = []; + } this.getInitiatedList(); } }, @@ -363,29 +423,59 @@ export default { }) }, + // 下拉加载 + handleScroll(e){ + if (e.target.scrollTop + e.target.clientHeight >= e.target.scrollHeight) { + if(this.tabsValue == 'unread' && !this.unreadLoad && this.unreadList.length < this.unreadTotal){ + this.unreadLoad = true; + this.unreadPage = this.unreadPage + 1; + this.getUnreadList('scroll'); + } + if(this.tabsValue == 'done' && !this.doneLoad && this.doneList.length < this.doneTotal){ + this.doneLoad = true; + this.donePage = this.donePage + 1; + this.getDoneList('scroll'); + } + if(this.tabsValue == 'notify' && !this.notifyLoad && this.notifyList.length < this.notifyTotal){ + this.notifyLoad = true; + this.notifyPage = this.notifyPage + 1; + this.getNotifyList('scroll'); + } + if(this.tabsValue == 'initiated' && !this.initiatedLoad && this.initiatedList.length < this.initiatedTotal){ + this.initiatedLoad = true; + this.initiatedPage = this.initiatedPage + 1; + this.getInitiatedList('scroll'); + } + } + }, + // 获取待办列表 - getUnreadList(){ + getUnreadList(type='init'){ this.$store.dispatch("call", { method: 'get', url: 'approve/process/findTask', data: { - page:this.page, - page_size: this.pageSize, + page: type == 'scroll' ? this.unreadPage : 1, + page_size: type == 'scroll' ? this.pageSize : this.unreadPage * this.pageSize, proc_def_name: this.approvalType == 'all' ? '' : this.approvalType, } }).then(({data}) => { let activeId = 0; let activeIndex = 0; + this.unreadTotal = data.total; if( this.unreadList.length == 0 || this.unreadList.length == data.rows.length){ this.unreadList?.map((res)=>{ if(res._active) activeId = res.id }) } - this.unreadList = data.rows.map((h,index)=>{ + let lists = data.rows.map((h,index)=>{ h._active = activeId > 0 ? h.id == activeId : index == 0; if(h._active) activeIndex = index + if(type == 'scroll' && this.unreadList.map(item=>{return item.id}).indexOf(h.id) == -1 ){ + this.unreadList.push(h) + } return h; }) - if(this.approvalType == 'all'){ - this.unreadTotal = this.unreadList.length + if(type != 'scroll'){ + this.unreadList = lists; } if(this.tabsValue == 'unread'){ this.$nextTick(()=>{ @@ -396,30 +486,38 @@ export default { $A.modalError(msg); }).finally(_ => { this.loadIng = false; + this.unreadLoad = false; }); }, // 获取已办列表 - getDoneList(){ + getDoneList(type='init'){ this.$store.dispatch("call", { method: 'get', url: 'approve/procHistory/findTask', data: { - page:this.page, - page_size: this.pageSize, + page: type == 'scroll' ? this.donePage : 1, + page_size: type == 'scroll' ? this.pageSize : this.donePage * this.pageSize, proc_def_name: this.approvalType == 'all' ? '' : this.approvalType, } }).then(({data}) => { let activeId = 0; - let activeIndex = 0; - if( this.doneList.length == 0 || this.doneList.length == data.rows.length){ - this.doneList?.map((res)=>{ if(res._active) activeId = res.id }) + let activeIndex = 0; + this.doneTotal = data.total; + if( this.doneList.length == 0 || this.doneList.length == data.total){ + this.doneList?.map((res)=>{ if(res._active) activeId = res.id }) } - this.doneList = data.rows.map((h,index)=>{ + let lists = data.rows.map((h,index)=>{ h._active = activeId > 0 ? h.id == activeId : index == 0; if(h._active) activeIndex = index + if(type == 'scroll' && this.doneList.map(item=>{return item.id}).indexOf(h.id) == -1 ){ + this.doneList.push(h) + } return h; }) + if(type != 'scroll'){ + this.doneList = lists; + } if(this.tabsValue == 'done'){ this.$nextTick(()=>{ this.details = this.doneList[activeIndex] || {} @@ -429,30 +527,38 @@ export default { $A.modalError(msg); }).finally(_ => { this.loadIng = false; + this.doneLoad = false; }); }, // 获取抄送列表 - getNotifyList(){ + getNotifyList(type){ this.$store.dispatch("call", { method: 'get', url: 'approve/procHistory/findProcNotify', data: { - page:this.page, - page_size: this.pageSize, + page: type == 'scroll' ? this.notifyPage : 1, + page_size: type == 'scroll' ? this.pageSize : this.notifyPage * this.pageSize, proc_def_name: this.approvalType == 'all' ? '' : this.approvalType, } }).then(({data}) => { let activeId = 0; let activeIndex = 0; + this.notifyTotal = data.total; if( this.notifyList.length == 0 || this.notifyList.length == data.rows.length){ this.notifyList?.map((res)=>{ if(res._active) activeId = res.id }) } - this.notifyList = data.rows.map((h,index)=>{ + let lists = data.rows.map((h,index)=>{ h._active = activeId > 0 ? h.id == activeId : index == 0; if(h._active) activeIndex = index + if(type == 'scroll' && this.notifyList.map(item=>{return item.id}).indexOf(h.id) == -1 ){ + this.notifyList.push(h) + } return h; }) + if(type != 'scroll'){ + this.notifyList = lists; + } if(this.tabsValue == 'notify'){ this.$nextTick(()=>{ this.details = this.notifyList[activeIndex] || {} @@ -462,31 +568,39 @@ export default { $A.modalError(msg); }).finally(_ => { this.loadIng = false; + this.notifyLoad = false; }); }, // 获取我发起的 - getInitiatedList(){ + getInitiatedList(type){ this.$store.dispatch("call", { method: 'post', url: 'approve/process/startByMyselfAll', data: { - page: this.page, - page_size: this.pageSize, + page: type == 'scroll' ? this.initiatedPage : 1, + page_size: type == 'scroll' ? this.pageSize : this.initiatedPage * this.pageSize, proc_def_name: this.approvalType == 'all' ? '' : this.approvalType, state: this.searchState == 'all' ? '' : this.searchState } }).then(({data}) => { let activeId = 0; let activeIndex = 0; + this.initiatedTotal = data.total; if( this.initiatedList.length == 0 || this.initiatedList.length == data.rows.length){ this.initiatedList?.map((res)=>{ if(res._active) activeId = res.id }) } - this.initiatedList = data.rows.map((h,index)=>{ + let lists = data.rows.map((h,index)=>{ h._active = activeId > 0 ? h.id == activeId : index == 0; if(h._active) activeIndex = index + if(type == 'scroll' && this.initiatedList.map(item=>{return item.id}).indexOf(h.id) == -1 ){ + this.initiatedList.push(h) + } return h; }) + if(type != 'scroll'){ + this.initiatedList = lists; + } if(this.tabsValue == 'initiated'){ this.$nextTick(()=>{ this.details = this.initiatedList[activeIndex] || {} @@ -496,6 +610,7 @@ export default { $A.modalError(msg); }).finally(_ => { this.loadIng = false; + this.initiatedLoad = false; }); }, @@ -556,7 +671,10 @@ export default { $A.messageSuccess(msg); this.addShow = false; this.$refs.initiateRef.resetFields(); - this.tabsClick(); + this.tabsValue = 'initiated'; + this.$nextTick(()=>{ + this.tabsClick(); + }) }).catch(({msg}) => { $A.modalError(msg); }).finally(_ => { diff --git a/resources/assets/sass/pages/page-approve.scss b/resources/assets/sass/pages/page-approve.scss index a0b6b0449..d94fc6f7b 100644 --- a/resources/assets/sass/pages/page-approve.scss +++ b/resources/assets/sass/pages/page-approve.scss @@ -39,9 +39,21 @@ margin-bottom: 10px; > div { + display: flex; + gap: 10px; + overflow: hidden; + .ivu-select { + width: 150px; + } .ivu-dropdown { margin-right: 8px; } + .load{ + font-size: 12px; + width: 20px; + height: 32px; + overflow: hidden; + } } } @@ -70,6 +82,10 @@ max-width: 100%; } + .load{ + text-align: center; + } + .approve-main-list { display: flex; flex-direction: column;