pika_shangjia/machineAndCell/machineInfo/machineInfo.vue

<template>
	<view>
		<view style="padding:0 30rpx;" class="ddflex">
			<view class="cell-item" v-for="item,index in groupList" @click="jumpUrl('/machineAndCell/machineItemManage/machineItemManage?id='+item.doorId+'&devId='+id)">
				<view class="cell-item-num">{{item.doorId?item.doorId:0}}</view>
				<block v-if="item.boxEnable==0">
					<view :style="(item.boxStatus==5||item.boxStatus==6)?'margin-top: 30rpx;':'margin-top: 70rpx;'"></view>
					<view class="error-sta" v-if="item.boxStatus==5">
						异常
					</view>
					<view class="error-sta" v-else-if="item.boxStatus==6">
						电池通讯故障
					</view>
					<view class="error-sta">
						禁用
					</view>
				</block>
				<block v-else>
					<view class="error-sta" v-if="item.boxStatus==5" style="margin-top: 70rpx;">
						异常
					</view>
					<view class="error-sta" v-else-if="item.boxStatus==6" style="margin-top: 70rpx;">
						电池通讯故障
					</view>
					<block v-else>
						<view class="ddflex" v-if="item.boxStatus!=0&&item.batteryId">
							<view style="margin-right: 13rpx;">
								<cell :soc="item.soc"></cell>
							</view>
							<view class="cell-item-info fflex">
								<view class="cell-item-info-item ddflex">
									<view>机柜状态</view>
									<view>{{item.boxEnable==1?'启用':'禁用'}}</view>
								</view>
								<view class="cell-item-info-item ddflex">
									<view>柜门</view>
									<view>{{item.doorStatus==1?'开':item.doorStatus==0?'关':'-'}}</view>
								</view>
								<view class="cell-item-info-item ddflex">
									<view>型号</view>
									<view>{{item.model}}</view>
								</view>
								<view class="cell-item-info-item ddflex">
									<view>电量</view>
									<view>{{item.soc}}%</view>
								</view>
								<view class="cell-item-info-item ddflex">
									<view>电压</view>
									<view>{{item.batVol?item.batVol:'-'}}V</view>
								</view>
								<view class="cell-item-info-item ddflex">
									<view>电流</view>
									<view>{{item.chgCur?item.chgCur:'-'}}A</view>
								</view>
								<view class="cell-item-info-item ddflex">
									<view>温度</view>
									<view>{{item.batTemp?item.batTemp:'-'}}℃</view>
								</view>
							</view>
						</view>
						<view v-else class="kongcang">
							空仓
						</view>
					</block>
				</block>
				<view class="cell-item-option ddflex">
					<view class="fflex btn" style="margin-right: 10rpx;" @click.stop="boxEnableChange(item)">{{item.boxEnable==1?'禁用':'启用'}}</view>
					<view class="fflex btn" @click.stop="open(item)">开仓</view>
				</view>
			</view>
		</view>
		
		<view style="height: 165rpx;" class="savepadding"></view>
		<view class="bottom-btns savepadding">
			<view class="ddflex" style="margin: 30rpx;justify-content: space-between;">
				<view class="btn1" @click="jumpUrl('/warning/machineAlarm/machineAlarm?id='+id)">故障告警</view>
				<view class="btn1" @click="jumpUrl('/machineAndCell/machineDetail/machineDetail?id='+id)">柜体信息</view>
				<view class="btn2" @click="getDataList()">刷新</view>
			</view>
		</view>
	</view>
</template>

<script>
	const app = getApp();
	const req = require("../../utils/request.js");
	import cell from "../../components/cell/index";

	export default {
		components: {
			cell
		},
		props: {},
		data() {
			return {
				
				id:null,
				
				groupList: [],
				page: 1,
				limit: 10,
				searchValue:'',
				isQuerying:false,//正在查询数据
				
			}
		},
		onLoad(options) {
			this.id = options.id
			this.getDataList()
		},
		onShow() {
			
		},
		onReachBottom() {
			this.getDataList(true)
		},
		methods: {
			jumpUrl(url) {
				if (req.isLogins(true)) {
					uni.navigateTo({
						url: url
					})
				}
			},
			getDataList(isPage) {
				if(this.isQuerying) return
				else this.isQuerying = true
				if (!isPage) {
					this.page = 1
					uni.showLoading({
						title:'加载中'
					})
				}
				let queryParams = {
					page: this.page,
					limit: this.limit,
				}
				queryParams.devId = this.id
				req.getRequest(
					'/admin/v2/door/page',
					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
					}
				)
			},
			
			// 禁用
			boxEnableChange(item){
				let open = item.boxEnable==1?false:true
				uni.showModal({
					title:'提示',
					content:open?'确定启用该仓门？':'确定禁用该仓门？',
					success: (r) => {
						if(r.confirm){
							uni.showLoading({
								title:open?'启用中':'禁用中',
							})
							req.postRequest('/admin/v2/cab/ableDoor',{devId:this.id,doorId:item.doorId,cabEnable:open?1:0},res=>{
								uni.hideLoading()
								if(res){
									req.msg(open?'启用成功':'禁用成功')
									// if(item.boxEnable == 1){
									// 	item.boxEnable = 0
									// }else{
									// 	item.boxEnable = 1
									// }
									// this.groupList = JSON.parse(JSON.stringify(this.groupList))
								}else {
									req.msg(open?'启用失败':'禁用失败')
								}
								this.getDataList()
							})
						}
						
					}
				})
			},
			// 开仓
			open(item){
				uni.showLoading({
					title:'开门中',
				})
				req.postRequest('/admin/v2/cab/openDoor',{devId:this.id,doorId:item.doorId},res=>{
					uni.hideLoading()
					if(res){
						req.msg('操作成功')
					}else {
						req.msg('操作失败')
					}
					this.getDataList()
				})
			}
		},
		mounted() {
			
		},
		onPageScroll: function(e) {
		}
	}
</script>

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