pika_shangjia/warning/orderAlarm/orderAlarm.vue

<template>
	<view>
		<!-- tab -->
		<view class="tab-box ddflex">
			<view class="fflex ddflex">
				<view :class="'tab-item fflex '+(queryType==''?'tab-item-active':'')" @click="queryTypeChange(0)">
					<view>待处理</view>
					<image class="tab-active-icon" src="../../static/images/tab_cur.png"></image>
				</view>
				<view :class="'tab-item fflex '+(queryType==1?'tab-item-active':'')" @click="queryTypeChange(1)">
					<view>已处理</view>
					<image class="tab-active-icon" src="../../static/images/tab_cur.png"></image>
				</view>
			</view>
		</view>
		<view style="height: 110rpx;"></view>
		
		<!-- 订单 -->
		<view>
			<view class="order-item" v-for="item,index in groupList" @click="jumpUrl('/pages/orderDetail/orderDetail?id='+item)">
				<view class="ddflex order-item-header">
					<view class="order-time">类型：{{item.exceptionCause}}</view>
					<block>
						<view v-if="item.isException==0" class="order-state">待处理</view>
						<view v-else class="order-state" style="color: #0FCB27;border: 2rpx solid #0FCB27;">已处理</view>
					</block>
				</view>
				<view class="order-item-body">
					<view class="order-item-content ddflex">
						<view class="order-item-content-label">订单编号：</view>
						<view class="order-item-content-data fflex tover">{{item.orderNo}}</view>
					</view>
					<view class="order-item-content ddflex">
						<view class="order-item-content-label">订单状态：</view>
						<view class="order-item-content-data fflex tover">{{item.finishStatus==0?'未结束':item.finishStatus==1?'自动结束':'人工结束'}}</view>
					</view>
					<view class="order-item-content ddflex">
						<view class="order-item-content-label">机柜编号：</view>
						<view class="order-item-content-data fflex tover">{{item.leaseDevId}}</view>
					</view>
					<view class="order-item-content ddflex">
						<view class="order-item-content-label">电池编号：</view>
						<view class="order-item-content-data fflex tover">{{item.batteryId}}</view>
					</view>
					<view class="order-item-content ddflex">
						<view class="order-item-content-label">描述：</view>
						<view class="order-item-content-data fflex tover">{{item.exceptionCause}}</view>
					</view>
				</view>
				<view v-if="item.isException!==0" class="order-btns ddflex">
					<view class="order-btn-time">2022-12-31 17:16:37</view>
					<view style="justify-content: flex-end;" class="ddflex">
						<view class="order-btn" v-if="item.status>1" @click.stop="">退款</view>
						<view class="order-btn" v-else @click.stop="">结束订单</view>
					</view>
				</view>
			</view>
		</view>
		
	</view>
</template>

<script>
	const app = getApp();
	const req = require("../../utils/request.js");

	export default {
		components: {},
		props: {},
		data() {
			return {

				queryType: 0,
				
				groupList: [],
				page: 1,
				limit: 10,
				searchValue:'',
				isQuerying:false,//正在查询数据
			}
		},
		onLoad(options) {
			this.getMachineList()
		},
		onShow() {

		},
		onReachBottom() {
			this.getMachineList(true)
		},
		methods: {
			jumpUrl(url) {
				if (req.isLogins(true)) {
					uni.navigateTo({
						url: url
					})
				}
			},
			queryTypeChange(val) {
				if (this.queryType == val) return false
				this.queryType = val
				this.getMachineList()
			},
			
			// 获取机柜列表
			getMachineList(isPage){
				if(this.isQuerying) return
				else this.isQuerying = true
				if (!isPage) {
					this.page = 1
				}
				let queryParams = {
					page: this.page,
					limit: this.limit,
				}
				queryParams.status = this.queryType
				req.getRequest(
					'/admin/v2/alarm/exceptionOrderPage',
					queryParams,
					data => {
						if (data != null && data.list.length > 0) {
							if (!isPage) {
								this.groupList = data.list
							} else {
								this.groupList = this.groupList.concat(data.list)
							}
							this.page++
						} else {
							if (!isPage)
								this.groupList = data.list
							else {}
						}
						uni.hideLoading()
						this.isQuerying = false
					}
				)
			},
		},
		mounted() {
		},
		onPageScroll: function(e) {
		}
	}
</script>

<style>
	@import "./orderAlarm.css";
</style>