uni-zhihuikuangshan/pages/production/zidonghua/zidonghua.vue

<template>
	<view>
		<!-- 头图 -->
		<view class="top_img">
			<!-- 通风管理 -->
			<view v-if="zdhxt == 'tfgl'">
				<image src="./img/tfgl.jpg" mode=""></image>
			</view>
			<!-- 压风制氮 -->
			<view v-if="zdhxt == 'yfzd'">
				<image src="./img/yfzd.jpg" mode=""></image>
			</view>
			<!-- 排水系统 -->
			<view v-if="zdhxt == 'psxt'">
				<image src="./img/psxt.jpg" mode=""></image>
			</view>
			<!-- 主运输 -->
			<view v-if="zdhxt == 'zys'">
				<image src="./img/zys.jpg" mode=""></image>
			</view>
			<!-- 巷道图 -->
			<view v-if="zdhxt == 'xdt'">
				<image src="./img/xdt.jpg" mode=""></image>
			</view>
			<!-- 矿压监测 -->
			<view v-if="zdhxt == 'kyjc'">
				<image src="./img/kyjc.jpg" mode=""></image>
			</view>
		</view>
		
		<!-- 列表 -->
		<view class="list">
			<!-- 通风管理 -->
			<view v-if="zdhxt == 'tfgl'">
				<view class="item" v-for="(item,index) in data_tfgl" :key="index">
					<view class="title" @click="item_active(index)">
						<view class="left">
							<view class="icon"></view>
							<view class="name">
								{{item.name}}
							</view>
						</view>
						<view class="right" v-if="index != active">
							<uni-icons type="arrowright"></uni-icons>
						</view>
						<view class="right" v-if="index == active">
							<uni-icons type="arrowdown"></uni-icons>
						</view>
					</view>
					<view class="inner_list" v-if="active == index">
						<view class="inner_item" v-for="(item_2,index_2) in item.list" :key="index_2" @click="inner_item_active(item_2)">
							<view class="inner_icon"></view>
							<view class="inner_name">{{item_2.name}}</view>
						</view>
					</view>
				</view>
				
			</view>
			<!-- 压风制氮 -->
			<view v-if="zdhxt == 'yfzd'">
				<view class="item" v-for="(item,index) in data_yfzd" :key="index">
					<view class="title" @click="item_active(index)">
						<view class="left">
							<view class="icon"></view>
							<view class="name">
								{{item.name}}
							</view>
						</view>
						<view class="right" v-if="index != active">
							<uni-icons type="arrowright"></uni-icons>
						</view>
						<view class="right" v-if="index == active">
							<uni-icons type="arrowdown"></uni-icons>
						</view>
					</view>
					<view class="inner_list" v-if="active == index">
						<view class="inner_item" v-for="(item_2,index_2) in item.list" :key="index_2" @click="inner_item_active(item_2)">
							<view class="inner_icon"></view>
							<view class="inner_name">{{item_2.name}}</view>
						</view>
					</view>
				</view>
				
			</view>
			<!-- 排水系统 -->
			<view v-if="zdhxt == 'psxt'">
				<view class="item" v-for="(item,index) in data_psxt" :key="index">
					<view class="title" @click="item_active(index)">
						<view class="left">
							<view class="icon"></view>
							<view class="name">
								{{item.name}}
							</view>
						</view>
						<view class="right" v-if="index != active">
							<uni-icons type="arrowright"></uni-icons>
						</view>
						<view class="right" v-if="index == active">
							<uni-icons type="arrowdown"></uni-icons>
						</view>
					</view>
					<view class="inner_list" v-if="active == index">
						<view class="inner_item" v-for="(item_2,index_2) in item.list" :key="index_2" @click="inner_item_active(item_2)">
							<view class="inner_icon"></view>
							<view class="inner_name">{{item_2.name}}</view>
						</view>
					</view>
				</view>
				
			</view>
			<!-- 主运输 -->
			<view v-if="zdhxt == 'zys'">
				<view class="item" v-for="(item,index) in data_zys" :key="index">
					<view class="title" @click="item_active(index)">
						<view class="left">
							<view class="icon"></view>
							<view class="name">
								{{item.name}}
							</view>
						</view>
						<view class="right" v-if="index != active">
							<uni-icons type="arrowright"></uni-icons>
						</view>
						<view class="right" v-if="index == active">
							<uni-icons type="arrowdown"></uni-icons>
						</view>
					</view>
					<view class="inner_list" v-if="active == index">
						<view class="inner_item" v-for="(item_2,index_2) in item.list" :key="index_2" @click="inner_item_active(item_2)">
							<view class="inner_icon"></view>
							<view class="inner_name">{{item_2.name}}</view>
						</view>
					</view>
				</view>
				
			</view>
			<!-- 巷道图 -->
			<view v-if="zdhxt == 'xdt'">
				<view class="item" v-for="(item,index) in data_xdt" :key="index">
					<view class="title" @click="item_active(index)">
						<view class="left">
							<view class="icon"></view>
							<view class="name">
								{{item.name}}
							</view>
						</view>
						<view class="right" v-if="index != active">
							<uni-icons type="arrowright"></uni-icons>
						</view>
						<view class="right" v-if="index == active">
							<uni-icons type="arrowdown"></uni-icons>
						</view>
					</view>
					<view class="inner_list" v-if="active == index">
						<view class="inner_item" v-for="(item_2,index_2) in item.list" :key="index_2" @click="inner_item_active(item_2)">
							<view class="inner_icon"></view>
							<view class="inner_name">{{item_2.name}}</view>
						</view>
					</view>
				</view>
				
			</view>
			
			<!-- 矿压监测 -->
			<view v-if="zdhxt == 'kyjc'">
				<view class="item" v-for="(item,index) in data_kyjc" :key="index">
					<view class="title" @click="item_active(index)">
						<view class="left">
							<view class="icon"></view>
							<view class="name">
								{{item.name}}
							</view>
						</view>
						<view class="right" v-if="index != active">
							<uni-icons type="arrowright"></uni-icons>
						</view>
						<view class="right" v-if="index == active">
							<uni-icons type="arrowdown"></uni-icons>
						</view>
					</view>
					<view class="inner_list" v-if="active == index">
						<view class="inner_item" v-for="(item_2,index_2) in item.list" :key="index_2" @click="inner_item_active(item_2)">
							<view class="inner_icon"></view>
							<view class="inner_name">{{item_2.name}}</view>
						</view>
					</view>
				</view>
				
			</view>
			
			
			
		</view>
	
	
	
	</view>
</template>

<script>
	export default {
		data() {
			return {
				zdhxt:"",
				active:9999,
				
				
				// 通风管理
				data_tfgl:[
					{
						name:"枣泉煤矿",
						list:[
							{
								name:"东井通风",
								url:"http://webdevelop.nxjiewei.com/assets/html/zaoquan/djtf/#/"
							},
							{
								name:"西井通风",
								url:"http://webdevelop.nxjiewei.com/assets/html/zaoquan/xjtf/#/"
							}
						]
					},
					{
						name:"梅花井煤矿",
						list:[
							{
								name:"斜井通风",
								url:"http://webdevelop.nxjiewei.com/assets/html/meihuajing/xjtf/#/"
							},
							{
								name:"立井通风",
								url:"http://webdevelop.nxjiewei.com/assets/html/meihuajing/ljtf/#/"
							}
						]
					},
					{
						name:"清水营煤矿",
						list:[
							{
								name:"通风系统",
								url:"http://webdevelop.nxjiewei.com/assets/html/qingshuiying/zidonghua_app/#/pages/index/ztfxt/ztfxt"
							}
						]
					}
				],
				// 压风制氮
				data_yfzd:[
					{
						name:"梅花井煤矿",
						list:[
							{
								name:"压风系统",
								url:"http://webdevelop.nxjiewei.com/assets/html/meihuajing/yf/#/"
							},
							{
								name:"制氮系统",
								url:"http://webdevelop.nxjiewei.com/assets/html/meihuajing/zd/#/"
							}
						]
					}
				],
				// 排水系统
				data_psxt:[
					{
						name:"枣泉煤矿",
						list:[
							{
								name:"720泵房",
								url:"http://webdevelop.nxjiewei.com/assets/html/zaoquan/720bf/#/"
							},
							{
								name:"880泵房",
								url:"http://webdevelop.nxjiewei.com/assets/html/zaoquan/880bf/#/"
							},
							{
								name:"929泵房",
								url:"http://webdevelop.nxjiewei.com/assets/html/zaoquan/929bf/#/"
							},
							{
								name:"950泵房",
								url:"http://webdevelop.nxjiewei.com/assets/html/zaoquan/950bf/#/"
							},
							{
								name:"980泵房",
								url:"http://webdevelop.nxjiewei.com/assets/html/zaoquan/980bf/#/"
							},
						]
					},
					{
						name:"梅花井煤矿",
						list:[
							{
								name:"850泵房",
								url:"http://webdevelop.nxjiewei.com/assets/html/meihuajing/850bf/#/"
							},
							{
								name:"697泵房",
								url:"http://webdevelop.nxjiewei.com/assets/html/meihuajing/697bf/#/"
							},
						]
					},
					{
						name:"清水营煤矿",
						list:[
							{
								name:"主排水泵房786",
								url:"http://webdevelop.nxjiewei.com/assets/html/qingshuiying/zidonghua_app/#/pages/index/786bf/786bf"
							},
							{
								name:"主排水泵房11",
								url:"http://webdevelop.nxjiewei.com/assets/html/qingshuiying/zidonghua_app/#/pages/index/11bf/11bf"
							}
						]
					}
				],
				
				// 主运输
				data_zys:[
					{
						name:"梅花井煤矿",
						list:[
							{
								name:"地面煤流",
								url:"http://webdevelop.nxjiewei.com/assets/html/meihuajing/dmml/#/"
							}
						]
					}
				],
				
				// 巷道图
				data_xdt:[
					{
						name:"梅花井煤矿",
						list:[
							{
								name:"巷道图",
								url:"http://webdevelop.nxjiewei.com/assets/html/meihuajing/zongtu/#/"
							}
						]
					}
				],
				
				// 矿压监测
				data_kyjc:[
					{
						name:"金家渠煤矿",
						list:[
							{
								name:"矿压监测",
								url:"http://webdevelop.nxjiewei.com/assets/html/zhks-quankuang/zidonghua/#/pages/jinjiaqu/kuang_ya_jian_ce/kuang_ya_jian_ce"
							}
						]
					}
				],
				
			
			}
		},
		onLoad(option) {
			this.zdhxt = option.zdhxt
			
			if(this.zdhxt == 'tfgl'){
				uni.setNavigationBarTitle({
					title:"通风管理"
				})
			}else if(this.zdhxt == 'psxt'){
				uni.setNavigationBarTitle({
					title:"排水系统"
				})
			}else if(this.zdhxt == 'yfzd'){
				uni.setNavigationBarTitle({
					title:"压风制氮"
				})
			}else if(this.zdhxt == 'zys'){
				uni.setNavigationBarTitle({
					title:"主运输"
				})
			}else if(this.zdhxt == 'xdt'){
				uni.setNavigationBarTitle({
					title:"巷道图"
				})
			}else if(this.zdhxt == 'kyjc'){
				uni.setNavigationBarTitle({
					title:"矿压监测"
				})
			}
		},
		methods: {
			item_active(index){
				console.log(index)
				
				if(index != this.active){
					this.active = index
				}else{
					this.active = 9999
				}
			},
			inner_item_active(item_2){
				// console.log(item_2)
				uni.navigateTo({
					url:"./detail/detail?url=" + item_2.url + "&name=" + item_2.name
				})
			}
		}
	}
</script>

<style lang="scss">
	page{
		background-color: #F7F7F7;
	}
	
	.top_img{
		image{
			width: 750rpx;
			height: 360rpx;
		}
	}
	
	.list{
		padding-top: 20rpx;
		.item{
			background-color: #FFFFFF;
			margin-bottom: 20rpx;
			
			box-sizing: border-box;
			padding: 0 35rpx;
			
			.title{
				display: flex;
				justify-content: space-between;
				align-items: center;
				
				height: 90rpx;
				border-bottom: 1rpx solid #f7f7f7;
				.left{
					display: flex;
					align-items: center;
					.icon{
						width: 31rpx;
						height: 27rpx;
						
						background-image: url(img/icon.png);
						background-size: cover;
						background-repeat: no-repeat;
					}
					.name{
						margin-left: 26rpx;
						font-size: 32rpx;
					}
				}
				.right{
					
				}
			}
			.inner_list{
				.inner_item{
					display: flex;
					align-items: center;
					
					height: 80rpx;
					border-bottom: 1rpx solid #f7f7f7;
					
					padding-left: 96rpx;
					.inner_icon{
						width: 10rpx;
						height: 10rpx;
						background-color: #0992E5;
						border-radius: 50%;
					}
					.inner_name{
						margin-left: 29rpx;
						font-size: 28rpx;
						color: #8a8a8a;
					}
				}
			}
		}
		
	}
</style>