<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>
			<p class="list-item" @click="navTo('shuishen')" style="margin-top: -14rpx;">
				<image src="/static/image/paokong/water.png" alt="" />
				<span>水深版</span>
				<image class="version_bg" src="/static/image/paokong/version-bg.png" alt="" />
				<image class="version_arrow" src="/static/image/paokong/right-arow.png" alt="" />
			</p>
			<p class="list-item" @click="navTo('wendu')">
				<image src="/static/image/paokong/wendu.png" alt="" />
				<span>温度版</span>
				<image class="version_bg" src="/static/image/paokong/version-bg.png" alt="" />
				<image class="version_arrow" src="/static/image/paokong/right-arow.png" alt="" />
			</p>
			<p class="list-item" @click="navTo('wait')">
				<image src="/static/image/paokong/wait.png" alt="" />
				<span>防爆版</span>
				<image class="version_bg" src="/static/image/paokong/wait-bg.png" alt="" />
			</p>
			<p class="list-item" @click="navTo('wait')">
				<image src="/static/image/paokong/wait.png" alt="" />
				<span>敬请期待</span>
				<image class="version_bg" src="/static/image/paokong/wait-bg.png" alt="" />
			</p>
			
			<p class="list-item" @click="navTo('wait')">
				<image src="/static/image/paokong/wait.png" alt="" />
				<span>敬请期待</span>
				<image class="version_bg" src="/static/image/paokong/wait-bg.png" alt="" />
			</p>
		
			<view class="footer">
				<span>
					威海晶合数字矿山技术有限公司
				</span>
			</view>
		</view>

	</view>
</template>

<script>
	import {
		stringToBytes,
		showCustomModal,
		showCustomToast,
		commonStateCodeDeal,
		popup,
		storager,
		pager,
		blueToother
	} from "../../common/util.js"
	import * as XLSX from '@/common/excel.js'
	import {
		getExportData,
	} from '../../api/home.js'
	import {
		getDict
	} from '../../api/blueToothMeasure.js'
	
	import { BASEURL } from "../../common/config.js";
	import { mapState } from "vuex";
	console.log('mapState', mapState)

	export default {
		data() {
			return {
				deviceInfo: {},
			}
		},
		/**
		 * 生命周期函数--监听页面加载
		 */
		onLoad: function(options) {
			uni.hideLoading()
		},
		onShow() {
			uni.hideLoading()
		},
		mounted() {
			uni.hideTabBar()
		},
		computed:{
		},
		methods: {
			navTo(flag) {
				if (flag === 'wait') {
					showCustomToast({
						title: '敬请期待'
					})
					return
				}
				storager.set('version', flag)
				this.$store.commit('setVersion', flag)
				pager.navTo('/pages/home/home')
			}
		}
	}
</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 {
			width: 100%;
			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;
		padding-bottom: 20rpx;
	}

	.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;
		}
	}

	.list-item {
		width: 660rpx;
		height: 140rpx;
		// border-top: 1px solid rgba(187,187,187,1);
		background-image: url(/static/image/paokong/version-bg.png);
		display: flex;
		justify-content: flex-start;
		align-items: center;
		gap: 0px 20px;
		padding: 10px;
		background-color: #ffffff;
		border-radius: 10rpx;
		padding-left: 40rpx;
		background: linear-gradient(270deg, #E0EEFF 0%, #FFFFFF 100%);
		box-shadow: 0rpx 2rpx 47rpx 4rpx rgba(7,36,72,0.1);
		border-radius: 10rpx;
		.version_bg{
			width: 119rpx;
			height: 136rpx;
			position: absolute;
			right: 140rpx;
		}
		image:nth-child(1){
			width: 49rpx;
			height: 57rpx;
		}
		
		.version_arrow{
			width: 19rpx;
			height: 30rpx;
			margin-left: 40rpx;
		}

		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>