ks-app-employment-service/packageB/train/index.vue

<template>
    <!-- <AppLayout title=""> -->
        <view class="tab-container">
			<image src="../../static/images/train/bj.jpg" mode=""></image>
			<view>
				<view class="btns" @click="jumps('/packageB/train/video/videoList')">
					<image src="/static/images/train/spxx-k.png" mode=""></image>
					<view>
						<text>培训视频</text>
						<view class="btn">
							<text>立即查看</text>
							<image src="/static/images/train/arrow.png" mode=""></image>
						</view>
					</view>
				</view>
				<view class="btns" @click="jumps('/packageB/train/practice/startPracticing')">
					<image src="/static/images/train/zxxl-k.png" mode=""></image>
					<view>
						<text>专项练习</text>
						<view class="btn">
							<text>立即查看</text>
							<image src="/static/images/train/arrow.png" mode=""></image>
						</view>
					</view>
					
				</view>
				<view class="btns" @click="jumps('/packageB/train/mockExam/examList')">
					<image src="/static/images/train/mnks-k.png" mode=""></image>
					<view>
						<text>模拟考试</text>
						<view class="btn">
							<text>立即查看</text>
							<image src="/static/images/train/arrow.png" mode=""></image>
						</view>
					</view>
					
				</view>
				<view class="btns" @click="jumps('')">
					<image src="/static/images/train/ctb-k.png" mode=""></image>
					<view>
						<text>错题本 </text>
						<view class="btn" style="margin-left: 13%;">
							<text>立即查看</text>
							<image src="/static/images/train/arrow.png" mode=""></image>
						</view>
					</view>
					
				</view>
			</view>
        </view>
    <!-- </AppLayout> -->
</template>

<script setup>
import { reactive, inject, watch, ref, onMounted } from 'vue';
import { onLoad, onShow } from '@dcloudio/uni-app';
const { $api, navTo, vacanciesTo, formatTotal, config } = inject('globalFunction');
import useUserStore from '@/stores/useUserStore';
import useDictStore from '@/stores/useDictStore';

function jumps(url){
	navTo(url);
}
</script>

<style lang="stylus" scoped>
.tab-container{
	height: 100vh;
	width: 100%;
	position: relative;
	// background: url('@/static/images/train/bj.jpg') center center no-repeat;
	// background-size: 100% 100%;
	image{
		position: absolute;
		width: 100%;
		height: 100%;
	}
	view{
		padding: 100rpx 28rpx 0;
		.btns{
			width: 100%
			height: 170rpx;
			border-radius: 5rpx
			padding: 20rpx;
			box-sizing: border-box
			color: #000
			text-align: center
			margin-bottom: 50rpx
			position: relative
			image{
				position: absolute;
				width: 100%;
				height: 100%;
				left: 0;
				top: 0;
			}
			view{
				padding: 0 0 0 10%;
				box-sizing: border-box;
				position: absolute
				width: 100%;
				height: 100%;
				left: 0;
				top: 0;
				z-index: 100;
				display: flex;
				align-items: center
				font-weight: bold;
				font-size: 36rpx;
				color: #595959;
				.btn{
					margin-left: 8%;
					background-color: #3A92FF;
					position: static;
					color: #fff;
					font-size: 22rpx;
					display: flex;
					align-items: center;
					justify-content: center
					width: 140rpx;
					height: 50rpx;
					border-radius: 5rpx
					font-weight: 500;
					padding: 0;
					image{
						position: static;
						width: 14rpx;
						height: 22rpx;
						margin-left: 10rpx;
					}
				}
			}
		}
	}
	
}
</style>