H5InfoBoard/pages/home/index.vue

<template>
	<view id="infoBoardHome">
		<view class="title-box">{{title}}</view>
		<view class="type-button-max-box" v-if="showType">
			<view class="check-button" @click="goPage('1')">
				<img src="@/static/icon_sys_aqxxp@1x.png">
				<view style="color:#00DEDE;">安全信息牌</view>
			</view>
			<view class="null-border"></view>
			<view class="check-button" @click="goPage('2')">
				<img src="@/static/icon_sys_jckz@1x.png">
				<view>监测控制</view>
			</view>
			<view class="null-border"></view>
			<view class="check-button" @click="goPage('3')">
				<img src="@/static/icon_sys_jcjl@1x.png">
				<view>进出记录</view>
			</view>
		</view>
		<view class="flex-box-page">
			<infoBoard :dataInfo="infoData" v-if="showType"></infoBoard>
		</view>
	</view>
</template>

<script>
	import {
		systemConfigInfoGetConfigByType,
		laboratoryAppletGetSubDetailNoAuth,
	} from '@/api/index.js'
	import infoBoard from '@/pages/home/infoBoard.vue'
	export default {
		name:"infoBoardHome",
		components:{
			infoBoard
		},
		data() {
			return {
				title:'实验室信息牌',
				infoData:{},
				showType:false,
			}
		},
		onLoad() {
			
		},
		onShow(){
			let url = window.location.href;
			url = url.replace(new RegExp('/', 'g'), '');
			url = url.replace(new RegExp('#', 'g'), '');
			if(url.indexOf('code') != -1&&url.indexOf('?') != -1){
				let codeData = {};
				url = url.split("?")[1];
				if(url.indexOf('&') == -1){
					codeData[url.split("=")[0]] = url.split("=")[1];
				}else{
					let list = url.split("&");
					list.forEach((item) => {
						codeData[item.split("=")[0]] = item.split("=")[1];
					})
				}
				this.laboratoryAppletGetSubDetailNoAuth(codeData.code);
			}else{
				uni.showToast({
					title: '二维码无效,请扫描实验室二维码',
					icon:'none',
					duration: 2000
				});
			}
		},
		methods: {
			goPage(type){
				if(type != '1'){
					uni.showToast({
						title: '功能暂未开通',
						icon:'none',
						duration: 2000
					});
				}
			},
			//实验室详情
			async laboratoryAppletGetSubDetailNoAuth(code) {
				let obj = {infoId:code};
				const {
					data
				} = await laboratoryAppletGetSubDetailNoAuth(obj);
				if (data.code == 200) {
					for(let i=0;i<data.data.labInfoBrandModels.length;i++){
						data.data.labInfoBrandModels[i].showType = true;
					}
					this.$set(this,'infoData',data.data);
					this.$set(this,'showType',true);
				}
			},
		}
	}
</script>

<style lang="stylus" scoped>
	#infoBoardHome {
		height: 100%;
		display: flex;
		flex-direction: column;
		overflow: hidden;
		.title-box{
			height:100rpx;
			line-height:100rpx;
			text-align: center;
			background-color: #0183FA;
			color:#fff;
			font-size:32rpx;
			display block
			overflow hidden
			text-overflow ellipsis
			white-space nowrap
		}
		.type-button-max-box{
			height:180rpx;
			display: flex;
			.check-button{
				flex:1;
				img{
					display: block;
					height:80rpx;
					width:80rpx;
					margin:16rpx auto 11rpx;
				}
				view{
					font-size:30rpx;
					text-align: center;
				}
			}
			.null-border{
				height:40rpx;
				width:2rpx;
				margin-top:74rpx;
				background-color:#D8D8D8 ;
			}
		}
		.flex-box-page{
			flex:1;
			display: flex;
			flex-direction: column;
			overflow: hidden;
		}
	}
</style>