home.vue

<template>
	<view class="wrapper">
		<view class="body-wrapper">
			<view class="logo-wrapper">
				<image class="logoImg" src="/static/image/home/logo.png" alt="" />
				<h3>露天炮孔验收仪</h3>
			</view>
			
			<view class="link-info-wrapper"  @click="navTo('login')">
				<div class="left">
					<image src="/static/image/paokong/linkY.png" mode=""></image>
					<view class="link-status">
						蓝牙已连接
					</view>
				</div>
				<div class="right">
					<h2>设备参数</h2>
					<p>设备名称：露天炮孔验收仪</p>
					<p>设备型号：MYSM-OH-01</p>
				</div>
			</view>
			<p class="list-item">
				<image src="/static/image/home/icon1.png" alt="" />
				<span>炮孔设计数据导入</span>
				<!-- <button size="mini" class="funcBtn" type="primary" @click="navTo('import')">导入导出</button> -->
			</p>
			<p class="list-item" @click="navTo('link')">
				<image src="/static/image/paokong/link.png" alt="" />
				<span>连接露天炮孔验收仪</span>
				<!-- <button size="mini" class="funcBtn" type="primary">连接</button> -->
			</p>
			<!-- <p class="list-item">
				<image src="/static/image/paokong/measure.png" alt="" />
				<span>设备测试</span>
				<button size="mini" class="funcBtn" type="primary" @click="navTo('measureTest')">测量</button>
			</p> -->
			<p class="list-item">  
				<image src="/static/image/paokong/measure.png" alt="" />
				<span>炮孔测量</span>
				<!-- <button size="mini" class="funcBtn" type="primary" @click="navTo('measure')">测量</button> -->
			</p>
			<p class="list-item">
				<image src="/static/image/home/icon1.png" alt="" />
				<span>炮孔测量数据导出</span>
				<!-- <button size="mini" class="funcBtn" type="primary" @click="navTo('export')">导出</button> -->
			</p>
			<p class="list-item">
				<image src="/static/image/paokong/operatelog.png" alt="" />
				<span>操作日志</span>
				<!-- <button size="mini" class="funcBtn" type="primary" @click="navTo('export')">导出</button> -->
			</p>
			<!-- <p class="list-item">
				<image src="/static/image/home/5.png" alt="" />
				<span>导入数据预览</span>
				<button size="mini" class="funcBtn" type="primary" @click="navTo('importFileDataPreview')">进入</button>
			</p>
			<p class="list-item">
				<image src="/static/image/home/5.png" alt="" />
				<span>炮孔测量</span>
				<button size="mini" class="funcBtn" type="primary" @click="navTo('paokongceliang')">进入</button>
			</p> -->
			<view class="footer">
				<span>
					威海晶合数字矿山技术有限公司
				</span>
			</view>
		</view>
		
	</view>
</template>

<script>
	import CustomNavbar from '@/pages/component/CustomNavbar.vue';
    import {formatNumber,formatDateThis,getUnixTime} from "../../common/dateUtil.js"
	import {showCustomModal, showCustomToast} from "../../common/util.js"
	export default {
		onBackPress(options) {
			// showCustomToast({
			// 	title: '当前页为最后一页，不能继续返回了'
			// })
			// return true
		},
		components: {
		    CustomNavbar,
		  },
		data() {
			return {
				
			}
		},
		onShow() {
			uni.hideLoading()
		}, 
		mounted() {
			uni.hideTabBar()
		},
		methods: {
			navTo(flag){
				if(flag === 'export'){
					this.exportData2Excel()
					return
				}
				let url = ''
				if(flag === 'login'){
					// url = 'test'
					url = '/pages/user/login'
				}else if(flag === 'import'){
					url = '/pages/home/importFile'
				}else if(flag === 'measureTest'){
					url = '/pages/home/blueTest'
				}else if(flag === 'measure'){
					url = '/pages/home/blueMeasure'
				}else if(flag === 'link'){
					url = '/pages/home/blueSearch'
				}else if(flag === 'importFileDataPreview'){
					url = '/pages/home/importFileDataPreview'
				}else if(flag === 'paokongceliang'){
					url = '/pages/home/paokongceliang'
				}
				
				uni.navigateTo({
					url
				})
			}
		}
	}
</script>
<style lang="scss">
.wrapper{
	width: 100vw;
	height: calc(100vh-55rpx);
	padding-top: 55rpx;
	background: linear-gradient(180deg, #007AFF 0%, #419AFF 16%, #EFF1F4 43%);
	position: relative;
	.footer{
		// position: absolute;
		// bottom: 10rpx;
		width: 100%;
		// padding-top: 200rpx;
		// height: 10rpx;
		// height: 120rpx;
		// line-height: 120rpx;
		text-align: center;
		span{
			font-weight: 400;
			font-size: 27rpx;
			color: #A0A7AE;
		}
	}
}
.body-wrapper{
	display: flex;
	justify-content: center;
	flex-direction: column;
	align-items: center;
	gap: 20rpx;
	background-color: linear-gradient(180deg, #007AFF 0%, #419AFF 16%, #EFF1F4 43%);
	padding-top: 50rpx;
}
.logo-wrapper{
	position: relative;
	height: 300rpx;
	display: flex;
	justify-content: center;
	flex-direction: column;
	align-items: center;
	gap: 50rpx;
	font-family: Source Han Sans SC;
	.logoImg{
		width: 454rpx;
		height: 98rpx;
	}
	h3{
		color: #ffffff;
		font-size: 37rpx;
		font-weight: bold;
	}
}

.link-info-wrapper{
	
	width: 646rpx;
	height: 300rpx;
	background: linear-gradient(-90deg, #F6F9FF 31%, #E4EFFF 100%);
	box-shadow: 0rpx 2rpx 24rpx 0rpx rgba(7,36,72,0.11);
	border-radius: 10rpx;
	border: 2px solid #FFFFFF;
	display: flex;
	align-items: center;
	gap: 47rpx;
	padding-left: 49rpx;
	.left{
		image{
			width: 136rpx;
			height: 136rpx;
		}
		.link-status{
			font-family: Source Han Sans SC;
			font-weight: bold;
			font-size: 30rpx;
			color: #007AFF;
			::before{
				content: '';
				width: 12rpx;
				height: 12rpx;
				background: #007AFF;
				border-radius: 50%;
			}
		}
	}
	.right{
		h2{
			font-size: 34rpx;
			font-weight: bold;
		}
		p{
			font-size: 30rpx;
			// font-weight: bold;
			color: #848484;
			margin-top: 20rpx;
		}
	}
}


.list-item{
	width: 660rpx;
	height: 140rpx;
	// border-top: 1px solid rgba(187,187,187,1);
	display: flex;
	justify-content: flex-start;
	align-items: center;
	gap: 0px 30px;
	padding: 10px;
	background-color: #ffffff;
	border-radius: 10rpx;
	image{
		width: 102rpx;
		height: 102rpx;
	}
	span{
		display: inline-block;
		width: 420rpx;
		font-family: PingFangSC-regular;
		color: rgba(0,0,0,1);
		font-size: 18px;
		font-weight: bold;
	}
	.funcBtn{
		width: 120rpx;
		height: 62rpx;
		line-height: 62rpx;
		background: #FFFFFF;
		border-radius: 36rpx;
		border: 2rpx solid #007AFF;
		color: #007AFF;
		padding: 0;
		// font-size: 27rp;
		font-family: Source Han Sans SC;
		font-weight: bold;
		
	}
}
</style>