yikangyang-hg-wx/package_sub/order/service.vue

<template>
	<view class="page">
<!-- 		<u-navbar title="新建订单" :is-back="true" back-icon-color="#fff" :background="{'background':'#1479ff'}"
			title-color="#fff" :border-bottom="false"></u-navbar> -->
		<view class="box1 box" @click="$u.throttle($u.route({
            url: '/package_sub/pages/ServiceList/ServiceList',
            params: {
              type: 1
            }
          }))">
			<image src="~@/package_sub/static/type1.png" alt="" />
			<view>
				<view>陪诊服务</view>
				<view>提供专业陪伴，协助患者就医全过程。</view>
			</view>
		</view>
		<view class="box2 box" @click="$u.throttle($u.route({
		    url: '/package_sub/pages/ServiceList/ServiceList',
		    params: {
				type:2
		    }
		  }))">
			<image src="~@/package_sub/static/type2.png" alt="" />
			<view>
				<view>居家照护</view>
				<view>快速高效准确帮助患者解答健康问题和疑难杂症。</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {

			}
		},
		methods: {

		}
	}
</script>

<style scoped lang="scss">
	.page {
		position: relative;
		// background-color: #f5efee;
		height:100vh;
	}

	.box {
		width: 695rpx;
		height: 230rpx;
		margin: 25rpx auto;
		position: relative;

		&>image {
			width: 695rpx;
			height: 230rpx;
			position: absolute;
			top: 0;
			left: 0;
		}

		&>view {
			position: absolute;
			top: 50%;
			transform: translateY(-50%);
			left: 80rpx;
			color: #fff;
			font-size: 24rpx;
			z-index: 1;
			width: 380rpx;

			&>view:first-child {
				font-size: 42rpx;
				margin-bottom: 15rpx;
			}
		}
	}
</style>