uni-zhihuikuangshan/components/t-p-meihuajing/t-p-meihuajing.vue

<template>
	<view class="content">
		<view class="item_box" style="background-color: #214269;"
			@click="go_zdhxt('http://anstatic.nxmy.com:8011/assets/html/meihuajing/zongtu','梅花井总图')">
			<view class="img">
				<image src="../t-p-icon/icon_10.png" mode=""></image>
			</view>
			<view class="text">
				<view class="name">梅花井巷道图</view>
				<view class="num"></view>
			</view>
		</view>
		<view class="item_box" style="background-color: #638BD5;" @click="go_production_report()">
			<view class="img">
				<image src="../t-p-icon/icon_2.png" mode=""></image>
			</view>
			<view class="text">
				<view class="name">生产报表</view>
				<view class="tip">当日产量{{days_output}}吨</view>
			</view>
		</view>
		<view class="item_box" style="background-color: #A3A2E4;" @click="go_personnel_orientation()">
			<view class="img">
				<image src="../t-p-icon/icon_3.png" mode=""></image>
			</view>
			<view class="text">
				<view class="name">人员定位</view>
				<view class="tip">井下人数{{mineall_people}}人</view>
			</view>
		</view>
		<view class="item_box" style="background-color: #8BC8DA;" @click="go_safety_monitoring()">
			<view class="img">
				<image src="../t-p-icon/icon_4.png" mode=""></image>
			</view>
			<view class="text">
				<view class="name">安全监测</view>
				<!-- <view class="tip">6268监测点</view> -->
			</view>
		</view>
		<view class="item_box" style="background-color: #FBB47B;" @click="go_video_monitor()">
			<view class="img">
				<image src="../t-p-icon/icon_6.png" mode=""></image>
			</view>
			<view class="text">
				<view class="name">视频监控</view>
				<view class="tip">工业视频</view>
			</view>
		</view>
		<view class="item_box" style="background-color: #9CE2A6;" @click="go_zdhxt('http://anstatic.nxmy.com:8011/assets/html/meihuajing-pc/xjtf_/')">
			<view class="img">
				<image src="../t-p-icon/icon_10.png" mode=""></image>
			</view>
			<view class="text">
				<view class="name">通风管理</view>
				<view class="tip">斜井通风</view>
			</view>
		</view>
		<view class="item_box" style="background-color: #9CE2A6;" @click="go_zdhxt('http://anstatic.nxmy.com:8011/assets/html/meihuajing-pc/ljtf_/')">
			<view class="img">
				<image src="../t-p-icon/icon_10.png" mode=""></image>
			</view>
			<view class="text">
				<view class="name">通风管理</view>
				<view class="tip">立井通风</view>
			</view>
		</view>
		<view class="item_box" style="background-color: #2C3E50;" @click="go_zdhxt('http://anstatic.nxmy.com:8011/assets/html/meihuajing-pc/dmml/')">
			<view class="img">
				<image src="../t-p-icon/icon_8.png" mode=""></image>
			</view>
			<view class="text">
				<view class="name">主运输系统</view>
				<view class="tip">地面煤流</view>
			</view>
		</view>
		<view class="item_box" style="background-color: #9FD4FF;" @click="go_zdhxt('http://anstatic.nxmy.com:8011/assets/html/meihuajing-pc/850bf/')">
			<view class="img">
				<image src="../t-p-icon/icon_9.png" mode=""></image>
			</view>
			<view class="text">
				<view class="name">排水系统</view>
				<view class="tip">850泵房</view>
			</view>
		</view>
		<view class="item_box" style="background-color: #2873FF;" @click="go_zdhxt('http://anstatic.nxmy.com:8011/assets/html/meihuajing-pc/697bf/')">
			<view class="img">
				<image src="../t-p-icon/icon_9.png" mode=""></image>
			</view>
			<view class="text">
				<view class="name">排水系统</view>
				<view class="tip">697泵房</view>
			</view>
		</view>
		<view class="item_box" style="background-color: #2873FF;"
			@click="go_zdhxt('http://anstatic.nxmy.com:8011/assets/html/meihuajing/11bf','MeiHuaJing_11BengFang')">
			<view class="img">
				<image src="../t-p-icon/icon_9.png" mode=""></image>
			</view>
			<view class="text">
				<view class="name">排水系统</view>
				<view class="tip">11泵房</view>
			</view>
		</view>
		
		<view class="item_box" style="background-color: #8BC8DA;"
			@click="go_zdhxt('http://anstatic.nxmy.com:8011/assets/html/meihuajing/yf','MeiHuaJing_YaFengXiTong')">
			<view class="img">
				<image src="../t-p-icon/icon_9.png" mode=""></image>
			</view>
			<view class="text">
				<view class="name">压风制氮</view>
				<view class="tip">压风系统</view>
			</view>
		</view>
		<view class="item_box" style="background-color: #8BC8DA;"
			@click="go_zdhxt('http://anstatic.nxmy.com:8011/assets/html/meihuajing/zd','MeiHuaJing_ZhiDanXiTong')">
			<view class="img">
				<image src="../t-p-icon/icon_9.png" mode=""></image>
			</view>
			<view class="text">
				<view class="name">压风制氮</view>
				<view class="tip">制氮系统</view>
			</view>
		</view>
		<view class="item_box" style="background-color: #D3D5D8;"
			@click="go_zdhxt('http://anstatic.nxmy.com:8011/assets/html/meihuajing/dljc','MeiHuaJing_DianLiJianCe')">
			<view class="img">
				<image src="../t-p-icon/icon_6.png" mode=""></image>
			</view>
			<view class="text">
				<view class="name">电力监控</view>
				<view class="tip">供电系统总图</view>
			</view>
		</view>
		<view class="item_box" style="background-color: #9FD4FF;"
			@click="go_zdhxt('http://anstatic.nxmy.com:8011/assets/html/meihuajing/hxsc','MeiHuaJing_HuanXingShuiCang')">
			<view class="img">
				<image src="../t-p-icon/icon_11.png" mode=""></image>
			</view>
			<view class="text">
				<view class="name">环形水仓</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		name: "t-p-meihuajing",
		data() {
			return {
				mine:"640181B0011010027175",
				org_num:"1019",
				mine_code:"meihuajing",
				
				mineall_people: "",
				days_output: ""
			};
		},
		created() {
			// 井下人数
			this.$p_api.personnel_people_now({
				mine: this.mine
			}).then((res) => {
				this.mineall_people = res.data.data.people_total
			})
		
			// 当日生产
			this.$p_api.coalmine_days_output({
				mine: this.mine,
				org_num: this.org_num
			}).then((res) => {
				this.days_output = res.data.data[0].total
			})
			
			
			
		},
		methods: {
			// 自动化统计列表
			go_zdhxt(zdhxt){
				uni.navigateTo({
					url:"../../production/zidonghua/zidonghua?url=" + zdhxt
				})
			},
			// 生产报表
			go_production_report() {
				uni.navigateTo({
					url: "../../production/production_report/production_report?mine=" + this.mine + "&org_num=" + this.org_num,
				})
			},
			// 安全监测
			go_safety_monitoring() {
				uni.navigateTo({
					url: "../../production/safety_monitoring/safety_monitoring?mine=" + this.mine
				})
			},
			//人员定位
			go_personnel_orientation() {
				uni.navigateTo({
					url:"../../production/personnel_orientation/personnel_orientation?mine=" + this.mine
				})
			},
			// 视频监控
			go_video_monitor(){
				uni.navigateTo({
					url:"../../production/video_monitor/video_monitor?mine_code=" + this.mine_code
				})
			}
		}
	}
</script>

<style lang="scss">
	.content {
		box-sizing: border-box;
		padding: 20rpx 25rpx 0;
		margin-bottom: 100rpx;

		
		overflow: hidden;
		.item_box {
			float: left;
			

			width: 220rpx;
			height: 280rpx;
			
			margin-right: 20rpx;
			margin-bottom: 20rpx;
			border-radius: 16rpx;

			.img {
				box-sizing: border-box;
				padding-top: 40rpx;
				text-align: center;

				image {
					width: 140rpx;
					height: 140rpx;
				}
			}

			.text {
				text-align: center;
				color: #FFFFFF;
				line-height: 40rpx;

				.name {
					font-size: 28rpx;
				}

				.tip {
					font-size: 24rpx;
					white-space: nowrap;
					overflow: hidden;
					text-overflow: ellipsis;
				}
			}
		}

		.item_box:nth-child(3n) {
			margin-right: 0;
		}

	}
</style>