qsy-zdh/pages/data/ventilation/Lane-system/Lane-system.vue

<template>
	<view class="page-body">
		<page-header :name="'220708胶带巷通风机'" :bg="'transparent'" :showLeft="true" @goBack="goBack()"></page-header>
		<view class="bg-wrap"></view>
		<view class="scroll-wrap">
			<view class="status-wrap">
				<view v-for="(item, index) in list" :key="index" class="item">
					<view class="name">{{ item.name }}</view>
					<view class="status">
						<status-tip :name="item.status.name" :status="item.status.status"
							:tip="item.status.status ? '开' : '关'"></status-tip>
					</view>
				</view>
			</view>
			<view class="info-wrap">
				<view class="title">风机参数</view>
				<view class="table-wrap">
					<simple-table :tableHead="tableHead" :list="tableList"></simple-table>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list: [{
					name: '主风机',
					status: {
						name: '风门',
						status: 1
					}
				}, {
					name: '副风机',
					status: {
						name: '风门',
						status: 0
					}
				}],
				tableHead: ['参数名称', '主风机', '副风机'],
				tableList: [{
					name: '	主风机la电流(A) ',
					params: ['14', '14']
				}, {
					name: '主风机Ib电流(A)',
					params: ['14', '14']
				}, {
					name: '主风机lc电流(A)',
					params: ['14', '14']
				}, {
					name: '主风机la电流(A)',
					params: ['18', '18']
				}, {
					name: '主风机lb电流(A)',
					params: ['18', '18']
				}, {
					name: '主风机Ic电流(A)',
					params: ['18', '18']
				}, {
					name: '工作方式',
					params: ['对旋1', '对旋1']
				}, {
					name: '控制方式',
					params: ['遥控', '遥控']
				}, {
					name: '故障状态 ',
					params: ['无故障', '无故障']
				}, {
					name: '风机电压(V)',
					params: ['1089', '1089']
				}, {
					name: '主风机la电流(A)',
					params: ['18', '18']
				}, {
					name: '主风机Ib电流(A)',
					params: ['18', '18']
				}, {
					name: '主风机Ic电流(A)',
					params: ['17', '17']
				}, {
					name: '主备选择',
					params: ['主机', '主机']
				}, {
					name: '负荷设备',
					params: ['空载', '空载']
				}, {
					name: '欠压保护',
					params: ['打开', '打开']
				}, {
					name: '过压保护',
					params: ['打开', '打开']
				}, {
					name: '主风机IA电流(A)',
					params: ['14', '14']
				}, {
					name: '主风机IB电流(A)',
					params: ['14', '14']
				}, {
					name: '主风机C电流(A)',
					params: ['14', '14']
				}, {
					name: '装置地址',
					params: ['2', '2']
				}, {
					name: '系统电压(V)',
					params: ['1140', '1140']
				}, {
					name: '欠压整定',
					params: ['65%', '65%']
				}, {
					name: '过压整定值',
					params: ['14%', '14%']
				}, {
					name: '工作方式',
					params: ['对旋1', '对旋1']
				}, {
					name: '控制方式',
					params: ['遥控', '遥控']
				}, {
					name: '故障状态',
					params: ['无故障', '无故障']
				}, {
					name: '运行选择',
					params: ['1-2号电机', '1-2号电机']
				}, {
					name: '主风机电压(V)',
					params: ['1089', '1089']
				}, {
					name: '欠压动作时间(S)',
					params: ['10', '10']
				}, {
					name: '过压动作时间(S)',
					params: ['10', '10']
				}, {
					name: '1号电机速断定值',
					params: ['8倍', '8倍']
				}, {
					name: '1号过流保护',
					params: ['打开', '打开']
				}, {
					name: '1号电机漏电闭锁',
					params: ['打开', '打开']
				}, {
					name: '1号电机过载保护',
					params: ['关闭', '关闭']
				}, {
					name: '1号电机断相保护',
					params: ['打开', '打开']
				}]
			}
		},
		onLoad(option) {},
		methods: {
			goBack() { // 返回上一頁面
				uni.navigateBack()
			}
		}
	}
</script>

<style scoped lang="scss">
	.page-body {
		position: relative;
		background-color: #f5f6f8;
		/deep/ .header-wrap {
			position: relative;
			z-index: 2;
		}

		.bg-wrap {
			position: absolute;
			z-index: 1;
			top: 0;
			width: 100vw;
			height: 670rpx;
			background: url(@/static/pg-bg-2.png);
			background-size: 100%;
		}

		.scroll-wrap {
			position: relative;
			z-index: 2;
			overflow-y: scroll;
			height: calc(100vh - 85rpx);
			padding: 60rpx 35rpx 45rpx;

			.status-wrap {
				display: flex;
				height: 167rpx;
				border-radius: 20rpx;
				margin-bottom: 60rpx;
				background: #C5EDFF;

				.item {
					flex: 1;
					justify-content: center;
					padding: 35rpx 97rpx 35rpx 97rpx;
					border-right: 1rpx dashed #fff;

					.name {
						font-size: 28rpx;
						font-weight: 700;
						text-align: center;
						margin-bottom: 25rpx;
					}

					.status {
						/deep/ .tip-wrap {
							font-size: 26rpx;

							.name {
								color: #8D8D8D;
							}

							.status-wrap {
								view:first-child {
									margin: 0 8rpx 0 30rpx;
								}
							}
						}
					}
				}

				.item:last-child {
					border: none;
				}
			}

			.info-wrap {
				.title {
					margin-bottom: 29rpx;
					font-weight: 700;
					font-size: 36rpx;
					color: #000000;
				}
				
				.table-wrap {
					overflow: hidden;
					border-radius: 20rpx;
					background-color: #fff;
					
					/deep/ .table-head {
						background-color: #F0F0F0;
					}
				}
			}
		}
	}
</style>