<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 v-if="zdhxt == 'tsj'">
				<image src="./img/tsj.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 v-if="zdhxt == 'tsj'">
				<view class="item" v-for="(item,index) in data_tsj" :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"
						}]
					},
					{
						name: "金家渠煤矿",
						list: [{
								name: "中部主通风机监测系统",
								url: "../unified_automation_system/ventilation/ventilation?system_type=ventilation_zb&mine_code=jinjiaqu"
							},
							{
								name: "北部主通风机监测系统",
								url: "../unified_automation_system/ventilation/ventilation?system_type=ventilation_bb&mine_code=jinjiaqu"
							}
						]
					}
				],
				// 压风制氮
				data_yfzd: [{
					name: "梅花井煤矿",
					list: [{
							name: "压风系统",
							url: "http://webdevelop.nxjiewei.com/assets/html/meihuajing/yf/#/"
						},
						{
							name: "制氮系统",
							url: "http://webdevelop.nxjiewei.com/assets/html/meihuajing/zd/#/"
						}
					]
				},
				{
					name: "金家渠煤矿",
					list: [{
							name: "空气压缩机集控系统",
							url: "../unified_automation_system/compressed_air/compressed_air?system_type=compressed_air&mine_code=jinjiaqu"
						}
					]
				}],
				// 排水系统
				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"
							}
						]
					},
					{
						name: "金家渠煤矿",
						list: [{
								name: "中央水泵排水系统",
								url: "../unified_automation_system/drainage/drainage?system_type=pump_zy&mine_code=jinjiaqu"
							},
							{
								name: "690水泵排水系统",
								url: "../unified_automation_system/drainage/drainage?system_type=pump_690&mine_code=jinjiaqu"
							}
						]
					}
				],

				// 主运输
				data_zys: [{
					name: "梅花井煤矿",
					list: [{
						name: "地面煤流",
						url: "http://webdevelop.nxjiewei.com/assets/html/meihuajing/dmml/#/"
					}]
				},
				{
					name: "金家渠煤矿",
					list: [{
						name: "胶带运输机系统",
						url: "../unified_automation_system/belt_conveyor/belt_conveyor?system_type=belt_13&mine_code=jinjiaqu"
					}]
				}],

				// 巷道图
				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"
					}]
				}],
				
				// 提升机
				data_tsj: [{
					name: "金家渠煤矿",
					list: [{
						name: "中部副立井提升机系统",
						url: "../unified_automation_system/hoist/hoist?system_type=hoist&mine_code=jinjiaqu"
					}]
				}],


			}
		},
		onLoad(option) {
			this.zdhxt = option.zdhxt

			if (this.zdhxt == 'tfgl') {
				uni.setNavigationBarTitle({
					title: "通风管理"
				})
			}
			if (this.zdhxt == 'psxt') {
				uni.setNavigationBarTitle({
					title: "排水系统"
				})
			}
			if (this.zdhxt == 'yfzd') {
				uni.setNavigationBarTitle({
					title: "压风制氮"
				})
			}
			if (this.zdhxt == 'zys') {
				uni.setNavigationBarTitle({
					title: "主运输"
				})
			}
			if (this.zdhxt == 'xdt') {
				uni.setNavigationBarTitle({
					title: "巷道图"
				})
			}
			if (this.zdhxt == 'kyjc') {
				uni.setNavigationBarTitle({
					title: "矿压监测"
				})
			}
			if (this.zdhxt == 'tsj') {
				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)

				if (item_2.url.indexOf('unified_automation_system') != -1) {
					uni.navigateTo({
						url: item_2.url + "&name=" + item_2.name
					})
				} else {
					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>
