FE-lab-xcx/pages_hazardousWasteRecycling/views/home/home.vue

<template>
	<view id="hazardousWasteRecyclingHome">
		<view class="max-big-button-box">
			<img class="left-box" :src="imagesUrl('hazardousWasteRecycling/wfhs_hsbb.png')">
			<view class="right-box">
				<view>回收报备</view>
				<view>可在回收日前填写报备单</view>
			</view>
		</view>
		<view class="max-big-button-box">
			<img class="left-box" :src="imagesUrl('hazardousWasteRecycling/wfhs_czdj.png')">
			<view class="right-box">
				<view>登记称重</view>
				<view>请在回收日等待回收,完成称重登记</view>
			</view>
		</view>
		<view class="max-big-button-box">
			<img class="left-box" :src="imagesUrl('hazardousWasteRecycling/wfhs_lsjl.png')">
			<view class="right-box">
				<view>历史记录</view>
				<view>查看我的危废回收记录</view>
			</view>
		</view>
		<view class="max-big-button-box">
			<img class="left-box" :src="imagesUrl('hazardousWasteRecycling/wfhs_qxsq.png')">
			<view class="right-box">
				<view>权限申请</view>
				<view>查看我的申请，提交新申请</view>
			</view>
		</view>
	</view>
</template>

<script>
	import {
		demo1,
		demo2
	} from '@/pages_hazardousWasteRecycling/api/index.js'
	export default {
		data() {
			return {
				
			}
		},
		onLoad(option) {
			
		},
		onShow() {

		},
		mounted() {
			
		},
		methods: {
			
		},
	}
</script>

<style lang="stylus" scoped>
	#hazardousWasteRecyclingHome {
		height: 100%;
		display flex;
		flex-direction column;
		.max-big-button-box{
			background-color: #fff;
			border-radius:20rpx;
			margin:40rpx 40rpx 0;
			display: flex;
			.left-box{
				margin:40rpx 40rpx 40rpx 60rpx;
				width:160rpx;
				height:160rpx;
				border-radius:20rpx;
			}
			.right-box{
				view:nth-child(1){
					font-size:28rpx;
					color:#333;
					margin-top:70rpx;
				}
				view:nth-child(2){
					font-size:22rpx;
					color:#999;
					margin-top:20rpx;
				}
			}
		}
	}
</style>