69 lines
1.3 KiB
Vue
69 lines
1.3 KiB
Vue
|
<template>
|
||
|
|
<view class="system">
|
||
|
|
<div class="top-img">
|
||
|
|
<u-image src="../static/images/system/top.png" width="351px" height="146px" />
|
||
|
|
</div>
|
||
|
|
<div class="cont-img">
|
||
|
|
<div class="item" @click="handleItem(1)">
|
||
|
|
<u-icon name="../static/images/system/1.png" size="38"></u-icon>
|
||
|
|
<div>就餐服务</div>
|
||
|
|
</div>
|
||
|
|
<div class="item">
|
||
|
|
<u-icon name="../static/images/system/2.png" size="38"></u-icon>
|
||
|
|
<div>志愿者服务</div>
|
||
|
|
</div>
|
||
|
|
<div class="item">
|
||
|
|
<u-icon name="../static/images/system/3.png" size="38"></u-icon>
|
||
|
|
<div>驿站服务</div>
|
||
|
|
</div>
|
||
|
|
</div>
|
||
|
|
</view>
|
||
|
|
</template>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
export default {
|
||
|
|
data() {
|
||
|
|
return {}
|
||
|
|
},
|
||
|
|
methods: {
|
||
|
|
handleItem(index) {
|
||
|
|
if (index === 1) {
|
||
|
|
this.$tab.reLaunch('/pages/index')
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
|
||
|
|
<style lang="scss">
|
||
|
|
page {
|
||
|
|
min-height: 100vh;
|
||
|
|
background-image: url("../static/images/system/bg.png");
|
||
|
|
}
|
||
|
|
.system {
|
||
|
|
padding: 18px;
|
||
|
|
.top-img {
|
||
|
|
display: flex;
|
||
|
|
justify-content: center;
|
||
|
|
}
|
||
|
|
.cont-img {
|
||
|
|
display: flex;
|
||
|
|
justify-content: space-between;
|
||
|
|
margin-top: 15px;
|
||
|
|
.item {
|
||
|
|
padding: 15px 0;
|
||
|
|
width: 109px;
|
||
|
|
display: flex;
|
||
|
|
flex-direction: column;
|
||
|
|
justify-content: center;
|
||
|
|
align-items: center;
|
||
|
|
background-color: #fff;
|
||
|
|
border-radius: 10px;
|
||
|
|
div {
|
||
|
|
margin-top: 10px;
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
}
|
||
|
|
</style>
|