<template>
	<view class="page">
		<u-navbar title="设备管理" :border-bottom="false" :background="bgc" title-color='#000' title-size='36'
			height='58'></u-navbar>
		<view class="box">
			<view class="title">
				全部设备
			</view>
			<view class="device">
				<view class="shuju">
					<view class="ddje">
						<view class="shu">
							设备总数
						</view>
						<view class="sb">
							50
						</view>
					</view>
					<text style="width: 1px;height: 60rpx;background: #979797;margin-top: 24rpx;"></text>
					<view class="ddje">
						<view class="shu">
							未上机数
						</view>
						<view class="sb">
							0
						</view>
					</view>
					<text style="width: 1px;height: 60rpx;background: #979797;margin-top: 24rpx;"></text>
					<view class="ddje">
						<view class="shu">
							在线数
						</view>
						<view class="sb">
							42
						</view>
					</view>
					<text style="width: 1px;height: 60rpx;background: #979797;margin-top: 24rpx;"></text>
					<view class="ddje">
						<view class="shu">
							离线数
						</view>
						<view class="sb">
							8
						</view>
					</view>
				</view>
			</view>
			<view class="title">
				我的设备
			</view>
			<view class="device">
				<view class="shuju">
					<view class="ddje">
						<view class="shu">
							设备总数
						</view>
						<view class="sb">
							50
						</view>
					</view>
					<text style="width: 1px;height: 60rpx;background: #979797;margin-top: 24rpx;"></text>
					<view class="ddje">
						<view class="shu">
							未上机数
						</view>
						<view class="sb">
							0
						</view>
					</view>
					<text style="width: 1px;height: 60rpx;background: #979797;margin-top: 24rpx;"></text>
					<view class="ddje">
						<view class="shu">
							在线数
						</view>
						<view class="sb">
							42
						</view>
					</view>
					<text style="width: 1px;height: 60rpx;background: #979797;margin-top: 24rpx;"></text>
					<view class="ddje">
						<view class="shu">
							离线数
						</view>
						<view class="sb">
							8
						</view>
					</view>
				</view>
			</view>
			<view class="title">
				下级设备
			</view>
			<view class="device">
				<view class="shuju">
					<view class="ddje">
						<view class="shu">
							设备总数
						</view>
						<view class="sb">
							0
						</view>
					</view>
					<text style="width: 1px;height: 60rpx;background: #979797;margin-top: 24rpx;"></text>
					<view class="ddje">
						<view class="shu">
							未上机数
						</view>
						<view class="sb">
							0
						</view>
					</view>
					<text style="width: 1px;height: 60rpx;background: #979797;margin-top: 24rpx;"></text>
					<view class="ddje">
						<view class="shu">
							在线数
						</view>
						<view class="sb">
							0
						</view>
					</view>
					<text style="width: 1px;height: 60rpx;background: #979797;margin-top: 24rpx;"></text>
					<view class="ddje">
						<view class="shu">
							离线数
						</view>
						<view class="sb">
							0
						</view>
					</view>
				</view>
			</view>

			<view class="title">
				设备数据
			</view>
			<view class="device">
				<view class="iconlist">
					<image src="../../../static/dlimage/dlwdsb.png" mode="" @click="btnpage(0)"></image>
					<image src="../../../static/dlimage/dlxjsb.png" mode="" @click="btnpage(1)"></image>
				</view>
			</view>
			<view class="title">
				设备维护
			</view>
			<view class="device">
				<view class="iconlist">
					<!-- <image src="../../../static/dlimage/dlsmwh.png" mode="" @click="btnpage(3)"></image> -->
					<image src="../../../static/dlimage/sbgz.png" mode="" @click="btnpage(4)"></image>
					<image src="../../../static/dlimage/dlwxsb.png" mode="" @click="btnpage(5)"></image>
				</view>
			</view>
			<view class="title">
				设备撤机
			</view>
			<view class="device">
				<view class="iconlist">
					<image src="../../../static/dlimage/dlsmcj.png" mode="" @click="btnpage(6)"></image>
					<image src="../../../static/dlimage/dlszjl.png" mode="" @click="btnpage(7)"></image>
				</view>
			</view>
		</view>


	</view>
</template>

<script>
	export default {
		data() {
			return {

			}
		},
		methods: {
            btnpage(num){
				if(num == 0){
					uni.navigateTo({
						url:'/pages/agentpages/devicemanagement/chargepallist/index'
					})
				}else if(num == 1){
					uni.navigateTo({
						url:'/pages/agentpages/devicemanagement/xiajilist/index'
					})
				}else if(num == 3){
					uni.scanCode({
						onlyFromCamera: true,
						scanType: ['qrCode'],
						success: res => {
							console.log('扫描结果：', res);
						},
						fail: err => {
							console.error('扫描失败：', err);
							uni.showToast({
								title: '扫描失败',
								icon: 'none'
							});
						}
					});
				} else if(num == 4){
					uni.navigateTo({
						url:'/pages/agentpages/devicemanagement/failure/index'
					})
				}else if(num == 5){
					uni.navigateTo({
						url:'/pages/agentpages/devicemanagement/repairapplication/index'
					})
				}else if(num == 6){
					uni.scanCode({
						onlyFromCamera: true,
						scanType: ['qrCode'],
						success: res => {
							console.log('扫描结果：', res);
							this.$u.put(`/agent/cabinet/${res.result}/unbindStore`).then(res=>{
								if(res.code == 200){
									uni.showToast({
										title: '撤机成功',
										icon: 'success',
										duration: 2000
									})
								}
							})
						},
						fail: err => {
							console.error('扫描失败：', err);
							uni.showToast({
								title: '扫描失败',
								icon: 'none'
							});
						}
					});
				} else if(num == 7){
					uni.navigateTo({
						url:'/pages/agentpages/devicemanagement/lnstallation/index'
					})
				}
			}
		}
	}
</script>

<style lang="scss">
	/deep/ .u-title,
	/deep/ .uicon-nav-back {
		padding-bottom: 40rpx;
	}
	
	page {
		background: linear-gradient(180deg, #25CE88 0%, rgba(255, 255, 255, 0) 100%);
		// background-color: #eee;
	}

	.page {
		width: 750rpx;
		padding-left: 34rpx;
		padding-right: 34rpx;
		padding-bottom: 60rpx;
		box-sizing: border-box;
		position: fixed;
		top: 0;
		left: 0;
		.box {
			overflow: hidden;
			overflow-y: scroll;
			width: 100%;
			position: fixed;
			height: 1400rpx;
			padding-bottom: 400rpx;
		}

		.title {
			font-weight: 600;
			font-size: 28rpx;
			color: #3D3D3D;
			margin-top: 34rpx;
		}

		.device {
			.iconlist {
				display: flex;
				padding: 0 40rpx;
				box-sizing: border-box;
				margin-top: 24rpx;
				width: 680rpx;
				height: 180rpx;
				background: #FFFFFF;
				border-radius: 24rpx 24rpx 24rpx 24rpx;
				padding-top: 38rpx;

				image {
					width: 96rpx;
					height: 98rpx;
					margin-right: 66rpx;
				}
			}

			.shuju {
				display: flex;
				justify-content: space-between;
				padding: 0 40rpx;
				box-sizing: border-box;
				margin-top: 24rpx;
				width: 680rpx;
				height: 180rpx;
				background: #FFFFFF;
				border-radius: 24rpx 24rpx 24rpx 24rpx;
				padding-top: 38rpx;

				.ddje {
					text-align: center;

					.shu {
						font-weight: 500;
						font-size: 24rpx;
						color: #3D3D3D;
					}

					.sb {
						margin-top: 20rpx;
						font-weight: 500;
						font-size: 40rpx;
						color: #3D3D3D;
					}
				}
			}
		}
	}
</style>