high-mini-manage/pages/user/shift-management/shift-management.vue

<template>
	<view>
		<view class="width94 mart20 height80">
			<view class="width46 fcor333 font16 flleft backcor9 fotct paddtop10 paddbotm10">
				<view class="width100 fcor666">当前班次</view>
				<view class="width100 mart15 font14">
					<text class="font24" v-if="currentClassGroup.classNum">{{currentClassGroup.classNum}}</text>
					<text class="font24" v-else>无</text>班次
				</view>
			</view>
			<view class="width46 fcor333 font16 flright backcor9 fotct paddtop10 paddbotm10">
				<view class="width100 fcor666">加油总金额</view>
				<view class="width100 mart15 font14"><text class="font24">{{currentClassGroup.refuelPrice}}</text>元
				</view>
			</view>
		</view>
		<view class="width94 mart20 height80">
			<view class="width46 fcor333 font16 flleft backcor9 fotct paddtop10 paddbotm10">
				<view class="width100 fcor666">加油总笔数</view>
				<view class="width100 mart15 font14"><text class="font24">{{currentClassGroup.refuelNum}}</text>笔</view>
			</view>
			<view class="width46 fcor333 font16 flright backcor9 fotct paddtop10 paddbotm10">
				<view class="width100 fcor666">加油总升数</view>
				<view class="width100 mart15 font14"><text class="font24">{{currentClassGroup.refuelLiters}}</text>升
				</view>
			</view>
		</view>
		<view class="width94 mart20 height80">
			<view class="width46 fcor333 font16 flleft backcor9 fotct paddtop10 paddbotm10">
				<view class="width100 fcor666">退款总金额</view>
				<view class="width100 mart15 font14"><text class="font24">{{currentClassGroup.refundPrice}}</text>元
				</view>
			</view>
			<view class="width46 fcor333 font16 flright backcor9 fotct paddtop10 paddbotm10">
				<view class="width100 fcor666">退款总笔数</view>
				<view class="width100 mart15 font14"><text class="font24">{{currentClassGroup.refundNum}}</text>笔</view>
			</view>
		</view>

		<view class="width94 mart40 alijusstart marb20">
			<view class="width40 height40 backcor008 border-r font14 fotct fcorfff" style="margin-left: 5%;"
				@click="startGroupTask(1)">
				交接班组
			</view>
			<view class="width40 height40 backcor008 border-r font14 fotct fcorfff" v-if="currentClassGroup.status == 0"
				style="margin-left: 10%;" @click="startGroupTask(2)">
				开始班次
			</view>
			<view class="width40 height40 backcolor72 border-r font14 fotct fcorfff"
				v-if="currentClassGroup.status == 1" style="margin-left: 10%;" @click="endGroupTask()">
				结束班次
			</view>
		</view>
		<!-- //历史班次 -->
		<view class="fcor333 width94 fontwig6 font15 mart20">历史班次、共计{{listcount}}条数据</view>
		
		<view v-if="classGroupTaskList == '' " class="mart20 fotct font14 fcor666">
			<image mode="widthFix" style="width: 70vw;" :src="imagewxUrl+imgadres"></image>
		</view>
		<view class="width94 backcorfff headcont mart20 border-r" style="box-shadow: 0px 0px 6px #999999;"
			v-for="(item,index) in classGroupTaskList" :key="index">
			<view class="alijusstart width94 height30 fcor333 paddtop5">
				<view class="width50 font14 fcor666 ">班次: <text class="font16 fcor333">{{item.classNum}}</text>班</view>
				<view class="width50 font14 fcor666 fotrt">状态:
					<text class="font16 fcor089" v-if="item.status == 1"> 进行中</text>
					<text class="font16 fcoreb5" v-if="item.status == 2"> 已结束</text>
				</view>
			</view>
			<view class="line1 width94"></view>
			<view class="width94 mart5">
				<view class="width100 height25 font14 fcor666">
					班组名称: {{item.gasClassGroupName}}
				</view>
				<view class="width100 height25  font14 fcor666 ">
					开始时间: {{item.startTime | timeFormat('yyyy-mm-dd hh:mm:ss')}}
				</view>
				<view class="width100 height25  font14 fcor666 " v-if="item.endTime">
					结束时间: {{item.endTime | timeFormat('yyyy-mm-dd hh:mm:ss')}}
				</view>
				<view class="width100 height25  font14 fcor666 " v-else>
					结束时间: 未结束
				</view>
			</view>
			<view class="line1 width94 mart5"></view>
			<view class="height30 backcor008 margle10 border-r font14 fotct fcorfff mart10 paddleft10 paddtright10"
				style="width: 60px;" v-if="item.status == 2" @click="jumpSummary(item.id)">
				班次汇总
			</view>
			<view class="height10" v-if="item.status == 2"></view>
		</view>
		<view class="height40p"></view>
	</view>
</template>

<script>
	import {
		getCurrentClassGroupTask,
		endGroupTask,
		getClassGroupTaskList
	} from '../../../Utils/Api.js';
	let app = getApp();
	export default {
		data() {
			return {
				userinfo: '', //用户信息
				currentClassGroup: '', //当前班次
				pageNum: 1,
				pagesize: 10,
				isLoadMore: false, //是否加载中
				classGroupTaskList: [], //历史数据
				listcount: '' ,//总条数
				imgadres: 'noorder.png',
				imagewxUrl: app.globalData.imageWxImg,
			}
		},
		onLoad() {
			this.userinfo = app.globalData.userInfo;

		},
		onShow() {
			this.isLoadMore = true;
			this.classGroupTaskList = [];
			this.pageNum = 1;
			this.getCurrentClassGroupTask();
			this.getClassGroupTaskList();
		},
		onReachBottom() { //上拉触底函数
			if (!this.isLoadMore) { //此处判断，上锁，防止重复请求
				this.isLoadMore = true
				this.pageNum += 1
				this.getClassGroupTaskList()
			}
		},
		methods: {
			//查询当前班次
			getCurrentClassGroupTask() {
				uni.showLoading({
					title: '加载中...'
				})
				let datas = {
					gasId: this.userinfo.merchantStore.id
				}
				getCurrentClassGroupTask(datas).then(res => {
					uni.hideLoading();
					if (res.return_code == '000000') {
						this.currentClassGroup = res.return_data;
					}
				})
			},
			//开启班次
			startGroupTask(item) {
				uni.navigateTo({
					url: '../select-team/select-team?typeid=' + item
				})
			},
			//结束班次
			endGroupTask() {
				let that = this;
				uni.showModal({
					title: '结束班次',
					content: '是否结束当前班次？',
					success: function(res) {
						if (res.confirm) {
							uni.showLoading({
								title: '操作中'
							})
							let datas = {
								gasId: that.userinfo.merchantStore.id
							}
							endGroupTask(datas).then(res => {
								uni.hideLoading();
								if (res.return_code == '000000') {
									uni.showToast({
										title: '操作成功',
										icon: 'none',
										duration: 2000
									})
									that.pageNum = 1;
									that.isLoadMore = true
									that.classGroupTaskList = [];
									that.getCurrentClassGroupTask();
									that.getClassGroupTaskList();
								}
							})
						}
					}
				})
			},
			//历史班次
			getClassGroupTaskList() {
				uni.showLoading({
					title: '加载中'
				})
				let datas = {
					pageNum: this.pageNum,
					pageSize: this.pagesize,
				}
				getClassGroupTaskList(datas).then(res => {
					uni.hideLoading();
					if (res.return_code == '000000' && res.return_data.list != '') {
						this.listcount = res.return_data.total;
						this.classGroupTaskList = this.classGroupTaskList.concat(res.return_data.list);
						if (res.return_data.pages == this.pageNum) {
							this.isLoadMore = true;
						} else {
							this.isLoadMore = false
						}
					} else {
						this.listcount = 0;
						this.classGroupTaskList = [];
						this.isLoadMore = true
					}
				});
			},
			//跳转到汇总
			jumpSummary(item) {
				uni.navigateTo({
					url: '../shift-summary/shift-summary?id=' + item
				})
			}
		}
	}
</script>

<style lang="scss">

</style>