You cannot select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

86 lines
1.5 KiB
Vue

<template>
<div class="Indexmain">
<div class="header">自助预约服务平台</div>
<div class="body1">
<div class="row">
<div class="yuyue" @click="goto('checkitemmainlist')">
<el-icon size="60" color="#fff">
<Clock/>
</el-icon>
<div> </div>
</div>
<div class="baodao">
<el-icon size="60" color="#fff">
<Coordinate/>
</el-icon>
<div> </div>
</div>
</div>
</div>
</div>
</template>
<script setup>
const goto=(url)=>{
window.location.href="./#/"+url;
}
</script>
<style scoped>
.Indexmain {
height: 100%;
display: flex;
flex-direction: column;
}
.header {
width: 100%;
background-color: #317bc8;
color: #fff;
font-size: 28px;
text-align: center;
padding: 20px;
}
.body1 {
padding: 50px;
height: 100%;
display: flex;
justify-content: center;
align-items: center;
}
.row {
display: flex;
justify-content: space-around;
width: 100%;
}
.yuyue {
background-color: #4cd07f;
width: 48%;
text-align: center;
height: 300px;
width: 500px;
color: #fff;
font-size: 20px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
.baodao {
background-color: #35a3d9;
width: 500px;
text-align: center;
color: #fff;
font-size: 20px;
height: 300px;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
}
</style>