dingzhou-app/pages/dailyWork/dailyWork.vue

<template>
	<view style="width: 100vw;height:100vh;">
		<view style="height: calc(100% - 104rpx);">
			<swiper style="height: 100%;background-color:#F3F4F6 ;" :current="current" disable-touch
				@animationfinish="animationfinish">
				<swiper-item >
					<scroll-view scroll-y style="width: 100%;height: 100%;overflow: auto;box-sizing: border-box;" lower-threshold="10" :refresher-enabled="xlList1[0]" :refresher-triggered="xlList2[0]" @scrolltolower="lower(0)" @refresherrefresh="refresherrefresh(0)" @refresherrestore="refresherrestore(0)">
						<view style="padding: 20rpx;background-color: #fff;">
							<u-search v-model="db.title" placeholder="请输入标题" :showAction="true" actionText="搜索"
								:animation="true" @custom="dbsearch" @clear="dbsearch">
						
							</u-search>
						</view>
						<view v-for="item in dbList" :key="item.WorkID" style="padding: 20rpx 40rpx;border-bottom: 1px solid #dadada;background-color: #fff;" @click="getinfo(item)">
							<view >
								<u--text :lines="1" size="32rpx" :text="item.Title"></u--text>
							</view>
							<view style="display: flex;justify-content: space-between;margin-top: 20rpx;color:#909399;font-size: 28rpx;">
								<view>{{item.NodeName}}</view>
								<view>{{showtime(item.ADT)}}</view>
							</view>
						</view>
						<div style="padding: 10rpx 0;" v-if="dbList.length > 0">
							<u-loadmore :status="statusList[0]" />
						</div>
						<div v-if="dbList.length == 0">
							<u-empty mode="list" icon="/static/list.png" text="暂无内容" textSize="30rpx"></u-empty>
						</div>
					</scroll-view>
				</swiper-item>
				<swiper-item >
					<scroll-view scroll-y style="width: 100%;height: 100%;overflow: auto;box-sizing: border-box;" lower-threshold="0" :refresher-enabled="xlList1[1]" :refresher-triggered="xlList2[1]" @scrolltolower="lower(1)" @refresherrefresh="refresherrefresh(1)" @refresherrestore="refresherrestore(1)">
						<view style="padding: 20rpx;background-color: #fff;">
							<u-search v-model="sq.title" placeholder="请输入标题" :showAction="true" actionText="搜索"
								:animation="true" @custom="sqsearch" @clear="sqsearch">
						
							</u-search>
						</view>
						<view v-for="item in sqList" :key="item.WorkID" style="padding: 20rpx 40rpx;border-bottom: 1px solid #ceccca;background-color: #fff;" @click="getinfo(item)">
							<view >
								<u--text :lines="1" size="32rpx" :text="item.Title"></u--text>
							</view>
							<view style="display: flex;justify-content: space-between;margin-top: 20rpx;color:#909399;font-size: 28rpx;">
								<view>{{item.NodeName}}</view>
								<view>{{showtime(item.RDT)}}</view>
							</view>
						</view>
						<div style="padding: 10rpx 0;" v-if="sqList.length > 0">
							<u-loadmore :status="statusList[1]" />
						</div>
						<div v-if="sqList.length == 0">
							<u-empty mode="list" icon="/static/list.png" text="暂无内容" textSize="30rpx"></u-empty>
						</div>
					</scroll-view>
				</swiper-item>
				<swiper-item >
					<scroll-view scroll-y style="width: 100%;height: 100%;overflow: auto;box-sizing: border-box;" lower-threshold="0" :refresher-enabled="xlList1[2]" :refresher-triggered="xlList2[2]" @scrolltolower="lower(2)" @refresherrefresh="refresherrefresh(2)" @refresherrestore="refresherrestore(2)">
						<view style="padding: 20rpx;background-color: #fff;">
							<u-search v-model="yb.title" placeholder="请输入标题" :showAction="true" actionText="搜索"
								:animation="true" @custom="ybsearch" @clear="ybsearch">
						
							</u-search>
						</view>
						<view v-for="item in ybList" :key="item.WorkID" style="padding: 20rpx 40rpx;border-bottom: 1px solid #ceccca;background-color: #fff;" @click="getinfo(item)">
							<view >
								<u--text :lines="1" size="32rpx" :text="item.Title"></u--text>
							</view>
							<view style="display: flex;justify-content: space-between;margin-top: 20rpx;color:#909399;font-size: 28rpx;">
								<view>{{item.NodeName}}</view>
								<view>{{showtime(item.RDT)}}</view>
							</view>
						</view>
						<div style="padding: 10rpx 0;" v-if="ybList.length > 0">
							<u-loadmore :status="statusList[2]" />
						</div>
						<div v-if="ybList.length == 0">
							<u-empty mode="list" icon="/static/list.png" text="暂无内容" textSize="30rpx"></u-empty>
						</div>
					</scroll-view>
				</swiper-item>
			</swiper>
		</view>
		<view style="height: 100rpx;border-top: 2px solid #dadbde;box-sizing: border-box;">
			<u-grid :border="true" col="3">
				<u-grid-item @click="click(0)">
					<text class="grid-text" :class="current==0?'choose':''">待办</text>
				</u-grid-item>
				<u-grid-item @click="click(1)">
					<text class="grid-text" :class="current==1?'choose':''">我申请的</text>
				</u-grid-item>
				<u-grid-item @click="click(2)">
					<text class="grid-text" :class="current==2?'choose':''">已办</text>
				</u-grid-item>
			</u-grid>
		</view>
		<u-action-sheet :actions="morelist" :closeOnClickOverlay="true" :closeOnClickAction="true" cancelText="取消"  title="申请" :show="show"  @select="selectClick" @close="show = false"></u-action-sheet>
	</view>
</template>

<script>
	import {showtime} from "@/utils/wjw.js"
	export default {
		data() {
			return {
				//当前待办还是已办
				current:0,
				//待办相关
				db:{
					pageNum:1,
					pageSize:20,
					fkFlow:null,
					title:null,
					token:uni.getStorageSync('jtoken')
				},
				dbList:[],
				dbSearch:null,
				dbTotal:0,
				//已办相关
				yb:{
					pageNum:1,
					pageSize:20,
					fkFlow:null,
					title:null,
					token:uni.getStorageSync('jtoken')
				},
				ybList:[],
				ybSearch:null,
				ybTotal:0,
				//下拉刷新相关
				xlList1:[true,false,false],
				xlList2:[true,true,true],
				statusList:['loadmore','loadmore','loadmore'],
				//查看事件
				showtime:showtime,
				//收发文状态
				type:null,
				//我申请的相关
				sq:{
					pageNum:1,
					pageSize:20,
					fkFlow:null,
					title:null,
					token:uni.getStorageSync('jtoken')
				},
				sqList:[],
				sqSearch:null,
				sqTotal:0,
				//更多展示
				show:false,
				morelist:[
					
				],
			}
		},
		onLoad(options){
			this.db.fkFlow = options.fkFlow
			this.yb.fkFlow = options.fkFlow
			this.sq.fkFlow = options.fkFlow
			this.type = options.type
			uni.setNavigationBarTitle({
				title:options.title
			})
			this.getDbList()
			if(options.fkFlow == '006'){
				this.morelist.push({name:'中层出差申请'})
			}else if(options.fkFlow == '007'){
				this.morelist.push({name:'外出授课申请'})
			}else if(options.fkFlow == '009'){
				this.morelist.push({name:'请(休)假申请'})
			}else if(options.fkFlow == '015'){
				this.morelist.push({name:'用车申请'})
			}
		},
		onNavigationBarButtonTap(e) {
		    this.show = true
		},
		onShow(){
			getApp().globalData.peoIdList = []
			getApp().globalData.peoList = []
			getApp().globalData.peoDeptList = []
			uni.$off()
			uni.$on('query', (query) => {	
				if(query.a=='back'){
					setTimeout(()=>{
						this.db.pageNum = 1
						this.dbList = []
						this.getDbList()
						this.xlList2[this.current] = true
						this.yb.pageNum = 1
						this.ybList = []
						this.getYbList()
					},2000)
				}
			})
		},
		methods: {
			//点击已办待办
			click(i){
				if(i==0){
					this.xlList1[i] = true
					this.xlList1[this.current] = false
					this.current = i
					if(this.dbList.length == 0){
						this.getDbList()
					}
				}else if(i==1){
					this.xlList1[i] = true
					this.xlList1[this.current] = false
					this.current = i
					if(this.sqList.length == 0){
						this.getSqList()
					}
				}else if(i==2){
					this.xlList1[i] = true
					this.xlList1[this.current] = false
					this.current = i
					if(this.ybList.length == 0){
						this.getYbList()
					}
				}
			},
			//swiper切换
			animationfinish(e){
				this.current = e.detail.current;
			},
			//查询待办列表
			getDbList(){
				uni.$u.http.get('/jflow/restful/DB_Todolist_FlowNo',{params:this.db}).then(res=>{
					uni.hideLoading()
					this.dbList = [...this.dbList,...res.list]	
					if(res.total<=this.db.pageSize){
						this.statusList[0] = "nomore"
					}else{
						this.statusList[0] = "loadmore"
					}
					this.$forceUpdate()
					this.dbTotal = Math.ceil(res.total / this.db.pageSize)
				})
			},
			//查询已办列表
			getYbList(){
				uni.$u.http.get('/jflow/restful/MyJoinOneFlows',{params:this.yb}).then(res=>{
					
					uni.hideLoading()
					this.ybList = [...this.ybList,...res.list]	
					if(res.total<=this.yb.pageSize){
						this.statusList[2] = "nomore"
					}else{
						this.statusList[2] = "loadmore"
					}
					this.$forceUpdate()
					this.ybTotal = Math.ceil(res.total / this.yb.pageSize)
				})
			},
			//查询我申请的列表
			getSqList(){
				uni.$u.http.get('/jflow/restful/DB_MyStartFlowInstanceByFlow',{
						params:{...this.sq},
						header: {
							'content-Type': 'application/x-www-form-urlencoded'
						},
					}).then(res=>{
					// console.log(res)
					uni.hideLoading()
					this.sqList = [...this.sqList,...res.list]	
					if(res.total<=this.sq.pageSize){
						this.statusList[1] = "nomore"
					}else{
						this.statusList[1] = "loadmore"
					}
					this.$forceUpdate()
					this.sqTotal = Math.ceil(res.total / this.sq.pageSize)
				})
			},
			//触底加载
			lower(e){
				uni.showLoading({
					title:"加载中..."
				})
				if(e==0){
					if(this.db.pageNum != this.dbTotal){
						this.db.pageNum++
						this.getDbList()
					}else{
						uni.hideLoading()
						this.statusList[e] = "nomore"
						this.$forceUpdate()
					}
				}else if(e==1){
					if(this.sq.pageNum != this.sqTotal){
						this.sq.pageNum++
						this.getSqList()
					}else{
						uni.hideLoading()
						this.statusList[e] = "nomore"
						this.$forceUpdate()
					}
				}else if(e==2){
					if(this.yb.pageNum != this.ybTotal){
						this.yb.pageNum++
						this.getYbList()
					}else{
						uni.hideLoading()
						this.statusList[e] = "nomore"
						this.$forceUpdate()
					}
				}
				
			},
			//下拉刷新
			refresherrefresh(e){
				if(e==0){
					this.xlList2[e] = true
					this.db.pageNum = 1
					this.dbList = []
					this.getDbList()
					setTimeout(()=>{
						this.xlList2[e] = false
						this.$forceUpdate()
					},2000)
				}else if(e==1){
					this.xlList2[e] = true
					this.sq.pageNum = 1
					this.sqList = []
					this.getSqList()
					setTimeout(()=>{
						this.xlList2[e] = false
						this.$forceUpdate()
					},2000)
				}else if(e==2){
					this.xlList2[e] = true
					this.yb.pageNum = 1
					this.ybList = []
					this.getYbList()
					setTimeout(()=>{
						this.xlList2[e] = false
						this.$forceUpdate()
					},2000)
				}
			},
			refresherrestore(e){
				
			},
			//待办搜索
			dbsearch(){
				this.db.pageNum = 1
				this.dbList = []
				this.getDbList()
			},
			//已办搜索
			ybsearch(){
				this.yb.pageNum = 1
				this.ybList = []
				this.getYbList()
			},
			//申请搜索
			sqsearch(){
				this.sq.pageNum = 1
				this.sqList = []
				this.getSqList()
			},
			//查看收文发文详情
			getinfo(item){
				uni.navigateTo({
					url:"/pages/workInfo/workInfo?workid="+item.WorkID+'&type='+this.current+'&flowNo='+this.db.fkFlow+"&title="+item.Title+"&nodeName="+item.NodeName+"&nodeId="+item.FK_Node+"&fkFlow="+this.db.fkFlow
				})
			},
			//点击申请
			selectClick(){
				if(this.db.fkFlow == '006'){
					uni.navigateTo({
						url:"/pages/shenqing/shenqing?title=中层出差申请&fkFlow="+this.db.fkFlow
					})
				}else if(this.db.fkFlow == '007'){
					uni.navigateTo({
						url:"/pages/shenqing/shenqing?title=外出授课申请&fkFlow="+this.db.fkFlow
					})
				}else if(this.db.fkFlow == '009'){
					uni.navigateTo({
						url:"/pages/shenqing/shenqing?title=请(休)假申请&fkFlow="+this.db.fkFlow
					})
				}else if(this.db.fkFlow == '015'){
					uni.navigateTo({
						url:"/pages/shenqing/shenqing?title=用车申请&fkFlow="+this.db.fkFlow
					})
				}
				
			}
			
		}
	}
</script>

<style lang="scss" scoped>
	.grid-text {
		height: 100rpx;
		line-height: 100rpx;
		font-size: 36rpx;
		color: #606266;
		/* #ifndef APP-PLUS */
		box-sizing: border-box;
		/* #endif */
	}
	.choose{
		color:#409EFF
	}
</style>