jszPhone/pages/work/jc/index.vue

<template>
	<view :style="colorStyle">
		<view class='commission-details'>
			<view class='sign-record'>
				<view class="box">
					<block v-for="(item,index) in recordList" :key="index" v-if="recordList.length>0">
						<view class='list'>
							<view class='item'>
								<view class='listn'>
									<view class='itemn1 acea-row row-between-wrapper'>
										<view class="flex-g">
											<view class='name line2'>
												{{item.mark}}
											</view>
											<view>
												<view class="">
													修改时间：{{getTimeStr( item.add_time )}}
												</view>
											</view>
										</view>
										<view class='status font-colorss'  v-if="type == 1">
											{{item.number}}
										</view>
										<view class='status font-colorss' :class="{'font-color': item.pm == 0}" v-if="type == 0">
											{{item.pm == 0? '-': '+'}}{{item.number}}
										</view>
										
									</view>
								</view>
							</view>
						</view>
					</block>
				</view>
			</view>
			<view v-if="recordList.length == 0 && !loading">
				<emptyPage title="暂无记录~"></emptyPage>
			</view>
		</view>
		<home v-if="navigation"></home>
		<!-- #ifdef MP -->
		<!-- <authorize v-if="isShowAuth" @authColse="authColse" @onLoadFun="onLoadFun"></authorize> -->
		<!-- #endif -->
	</view>
</template>

<script>
	import {
		moneyList,
		getSpreadInfo,
		getGqList,
		getStaffInfo,
		getUserInfo,
		getYjList,
		getJt,
		getTxList,
		passTx,
		errTx,
		getQzList,
		getJcList
	} from '@/api/user.js';
	import {
		toLogin
	} from '@/libs/login.js';
	import {
		mapGetters
	} from "vuex";
	import emptyPage from '@/components/emptyPage.vue'
	import home from '@/components/home';
	import colors from '@/mixins/color.js';
	import timeSlot from '@/components/timeSlot/index.vue'
	export default {
		components: {
			emptyPage,
			home,
			timeSlot
		},
		mixins: [colors],
		data() {
			return {
				txitem: {},
				mark: '',
				sevenType: 51,
				sixType: 0,
				sale_sum: 0,
				craft_sum: 0,
				timer: '',
				userInfo: {},
				staffInfo: {},
				name: '',
				keyword: '',
				type: 0,
				page: 1,
				limit: 10,
				loading: false,
				loadend: false,
				loadTitle: '加载更多',
				recordList: [],
				recordType: 0,
				recordCount: 0,
				extractCount: 0,
				times: [],
				start: 0,
				stop: 0,
				income: '',
				expend: '',
				isShowAuth: false
			};
		},
		computed: mapGetters(['isLogin']),
		onLoad(options) {
			this.type =options.type
			if(this.type == 1) {
				uni.setNavigationBarTitle({
					title:'奖池变更记录'
				})
			}
			this.getYjList('re', 0)
		},
		onShow: function(opt) {
			
		},
		methods: {
			
			
			
			getYjList(type, sixType) {
				let that = this;
				that.sixType = sixType;
				if (type == 're') {
					console.log('ze')
					that.page = 1
					that.loading = false
					that.loadend = false
					this.recordList = []
				}
				if (that.loading) return;
				if (that.loadend) return;
				let getList;
				if(that.type == 0) {
					getList = getQzList
				}else {
					getList = getJcList
				}
				getList({
					page: that.page,
					limit: that.limit,
					// status: that.sixType
				}).then(res => {
					let arr = res.data.list
					this.recordList = this.recordList.concat(arr);
					let loadend = arr.length < that.limit;
					that.loadend = loadend;
					that.loadTitle = loadend ? '没有更多内容啦~' : '加载更多';
					that.page++;
					console.log(that.page, 'that.page')
					that.loading = false;
					

				}).catch(err => {
					that.loading = false;
					that.loadTitle = '加载更多';
				})
			},
			
			navto(url) {
				uni.navigateTo({
					url
				})
			},
			onLoadFun() {
				this.isShowAuth = false
			},
			// 授权关闭
			authColse: function(e) {
				this.isShowAuth = e
			},
			getTimeStr(timestamp) {
				let date;
				if (timestamp) {
					date = new Date(timestamp * 1000);
				} else {
					date = new Date();
				}
				const year = date.getFullYear();
				const month = date.getMonth() + 1; // 月份从 0 开始，所以需要加 1
				const day = date.getDate();
				return year + '/' + (month > 9 ? month : '0' + month) + '/' + (day > 9 ? day : '0' + day)
			},
			changeTime(time) {
				console.log(time, 'time')
				if (this.recordType == 6) {
					let times = ''
					if (time.start == 0 && time.stop == 0) {
						console.log('全部')
						this.timer = '2020/01/01-' + this.getTimeStr()
					} else {
						this.timer = this.getTimeStr(time.start) + '-' + this.getTimeStr(time.stop)
					}
					console.log(this.timer, 'timer')
					this.getYjList()
				} else {
					this.start = time.start
					this.stop = time.stop
					this.page = 1;
					// this.loading = false;
					this.loadend = false;
					this.$set(this, 'recordList', []);
					this.getRecordList();
				}

			},
			getGqList() {
				let that = this;
				let page = that.page;
				let limit = that.limit;
				if (that.loading) return;
				if (that.loadend) return;
				getGqList({
					page: page,
					limit: limit,
					uid: that.userInfo.uid
				}).then(res => {
					this.recordList = this.recordList.concat(res.data.list)
					let loadend = res.data.list.length < that.limit;
					that.loadend = loadend;
					that.loadTitle = loadend ? '没有更多内容啦~' : '加载更多';
					that.page += 1;
					that.loading = false;
				}).catch(err => {
					that.loading = false;
					that.loadTitle = '加载更多';
				})
			},
			getStaffInfo() {
				let that = this
				getUserInfo().then(res => {
					that.userInfo = res.data
					if (this.recordType == 5) {
						that.getGqList();
					}
					getStaffInfo({
						uid: res.data.uid
					}).then(ress => {
						that.staffInfo = ress.data;
						if (that.recordType == 6) {
							that.getYjList()
						}
						if (that.recordType == 7) {
							that.getJt('re', 51)
						}
					})
				})

			},
			getRecordList: function() {
				let that = this;
				let page = that.page;
				let limit = that.limit;
				let recordType = that.recordType;
				if (that.loading) return;
				if (that.loadend) return;
				that.loading = true;
				that.loadTitle = '';
				moneyList({
					keyword: this.keyword,
					start: this.start,
					stop: this.stop,
					page: page,
					limit: limit
				}, recordType).then(res => {
					// this.expend = res.data.expend;
					// this.income = res.data.income;
					// for (let i = 0; i < res.data.time.length; i++) {
					// 	// if (!this.times.includes(res.data.time[i])) {
					// 	this.times.push(res.data.time[i])
					// 	this.recordList.push({
					// 		time: res.data.time[i],
					// 		child: []
					// 	})
					// 	// }
					// }
					// // for (let x = 0; x < this.times.length; x++) {
					// for (let j = 0; j < res.data.list.length; j++) {
					// 	// if (this.times[x] === res.data.list[j].time_key) {

					// 	// }
					// 	this.recordList[j].child.push(res.data.list[j])
					// }
					// // }
					// console.log()
					if (res.data.list && res.data.list.list) {
						this.recordList = this.recordList.concat(res.data.list.list)
						let loadend = res.data.list.length.length < that.limit;
						that.loadend = loadend;
						that.loadTitle = loadend ? '没有更多内容啦~' : '加载更多';
						that.page += 1;
					}

					that.loading = false;
				}).catch(err => {
					that.loading = false;
					that.loadTitle = '加载更多';
				})
			},
			getRecordListCount: function() {
				let that = this;
				getSpreadInfo().then(res => {
					that.recordCount = res.data.commissionCount;
					that.extractCount = res.data.extractCount;
				});
			}
		},
		onReachBottom: function() {
			this.getYjList('', this.sixType)
		}
	}
</script>

<style scoped lang="scss">
	.commission-details .search {
		width: 100%;
		background-color: var(--view-theme);
		border-bottom: 1px solid #f2f2f2;
		height: 86rpx;
		padding: 0 30rpx;
		box-sizing: border-box;

		.input {
			width: 100%;
			height: 60rpx;
			border-radius: 50rpx;
			background-color: #f5f5f5;
			position: relative;

			input {
				height: 100%;
				font-size: 26rpx;
				width: 100%;
				padding-left: 60rpx;
			}

			.placeholder {
				color: #bbb;
			}

			.iconfont {
				position: absolute;
				left: 28rpx;
				color: #999;
				font-size: 28rpx;
				top: 50%;
				transform: translateY(-50%);
			}

		}
	}

	.box {
		border-radius: 14rpx;
		margin: 0 30rpx;
		overflow: hidden;
	}

	.sign-record {
		// margin-top: 20rpx;
	}

	.commission-details {
		.promoterHeader {
			.headerCon {
				.money {
					font-size: 36rpx;

					.num {
						font-family: 'Guildford Pro';
					}
				}
			}
		}

	}

	.top_num {
		padding: 30rpx;
		font-size: 26rpx;
		color: #666;
	}

	.top_num_2 {
		display: flex;
		justify-content: space-around;
		position: sticky;
		top: 0;
		background-color: rgba(245, 245, 245, 1);
	}

	.tx {
		background-color: #1890FF;
		color: #fff;
		position: fixed;
		bottom: 0;
		left: 0;
		right: 0;
		text-align: center;
		line-height: 80rpx;
		font-size: $uni-font-size-lg;
	}

	.radius15 {
		border-radius: 14rpx 14rpx 0 0;
	}

	.sign-record {
		.list {
			.item {
				.listn {
					.itemn1 {
						border-bottom: 1rpx solid #eee;
						padding: 22rpx 24rpx;
						flex-wrap: nowrap;

						.flex-g {
							flex-grow: 1;
							padding-right: 30rpx;

							.status {
								font-size: 28rpx;
							}
						}

						.name {
							font-size: 28rpx;
							color: #282828;
							margin-bottom: 10rpx;
						}

						.num {
							font-size: 36rpx;
							font-family: 'Guildford Pro';
							color: #16ac57;


						}
					}
				}
			}
		}
	}

	.mark {
		margin-bottom: 10rpx;
	}

	.status_badge {
		display: inline-block;
		height: 30rpx;
		border-radius: 4rpx;
		font-size: 20rpx;
		line-height: 30rpx;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		margin-left: 12rpx;
		padding: 0 6rpx 0;
	}

	.success {
		background: rgba(24, 144, 255, .1);
		color: #1890FF;
	}

	.default {
		background: #f5f5f5;
		color: #282828;
		;
	}

	.error {
		background: rgba(233, 51, 35, .1);
		color: #E93323;
	}

	.nav {
		display: flex;
		justify-content: space-evenly;
		position: fixed;
		top: 0;
		width: 750rpx;

		.nav-item {
			width: 50%;
			line-height: 60rpx;
			text-align: center;
			color: #1890FF;
			border: 1px solid #1890FF;
			font-size: 28rpx;
			background-color: #fff;
		}

		.action {
			background-color: #1890FF;
			color: #fff;
			font-weight: bold;
		}
	}

	.font-color {
		color: #e93323 !important;
	}

	.font-colors {
		color: #16ac57 !important;
	}

	.font-colorss {
		color: #1890FF ;
	}

	.ds-wrap {
		width: 623rpx;
		height: 334rpx;
		border-radius: 20rpx;
		background-color: #fff;
		display: flex;
		justify-content: space-around;
		align-items: center;
		flex-direction: column;

		input {
			width: 575rpx;
			height: 73rpx;
			background-color: #f5f5f5;
			color: #000;
			padding-left: 20rpx;
		}

		.btn-wrap {
			width: 575rpx;
			display: flex;
			justify-content: space-between;
			align-items: center;

			.btn {
				width: 277rpx;
				height: 82rpx;
				// background-color: ;
				color: #000;
				display: flex;
				justify-content: center;
				align-items: center;
				background-color: #f5f5f5;
				border-radius: 15rpx;
			}

			.s-btn {
				color: #fff;
				background-color: #16ac57
			}
		}
	}
</style>