You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
yanzong_qianduan/pages/news/park/index.vue

140 lines
3.2 KiB

<template>
<view class="park">
<view class="park-navbar">
<u-navbar title="停车指引" :border-bottom="false" :background="background"></u-navbar>
</view>
<view class="park-hd">
<view class="a">昆明湖店·YN_k121</view>
<view class="b"><u-icon name="map" style="margin-right: 10rpx;"></u-icon>2线2600m</view>
</view>
<view class="park-bd">
<view class="a">停车攻略</view>
<view class="b">
<view class="store">昆明湖店广场地下停车场<text>推荐</text></view>
<view class="btn">导航</view>
</view>
<view class="c">
<view class="p"><text>价格:</text>购物免费停车2小时超出部份收取3元/小时</view>
<view class="p"><text>特点:</text>长时间停留推荐相对安全可享免费停车两小时</view>
<view class="p"><text>详细:</text>佰腾数码广场楼下有地下停车场停车场车位不少且出门即可乘坐电梯至门店但节假日等高峰期车位较为紧张</view>
</view>
</view>
</view>
</template>
<script>
10 months ago
// import img from "@/static/news/login-bg.png"
export default {
data() {
return {
currentIndex: 0,
background: {
10 months ago
background: `url(${this.$picUrl}/static/news/login-bg.png) center top no-repeat`,
// background: 'url('+ img+') center top no-repeat',
backgroundSize: '100%',
},
}
},
methods: {
}
}
</script>
<style lang="scss" scoped>
.park{
width: 100%;
10 months ago
background: url(https://www.saas.njrenzhou.com/static/news/login-bg.png) center 0 no-repeat;
background-size: 100% auto;
min-height: 100vh;
&-hd{
width: 698rpx;
height: 184rpx;
background: #FFFFFF;
border-radius: 8rpx;
margin: 0 auto;
margin-top: 60rpx;
padding: 40rpx 50rpx;
box-sizing: border-box;
.a{
font-size: 28rpx;
font-weight: 500;
color: #000000;
}
.b{
display: flex;
align-items: center;
font-size: 28rpx;
font-weight: 400;
color: #818181;
margin-top: 20rpx;
}
}
&-bd{
width: 698rpx;
background: #FFFFFF;
border-radius: 8rpx;
margin: 0 auto;
margin-top: 20rpx;
padding: 30rpx 30rpx;
box-sizing: border-box;
overflow: hidden;
.a{
font-size: 32rpx;
font-weight: 500;
color: #000000;
}
.b{
display: flex;
align-items: center;
justify-content: space-between;
font-size: 28rpx;
font-weight: 400;
color: #818181;
margin-top: 20rpx;
.store{
display: flex;
align-items: center;
text{
width: 96rpx;
height: 40rpx;
background: #FF5F5F;
border-radius: 10rpx;
text-align: center;
line-height: 40rpx;
font-size: 28rpx;
font-weight: 500;
color: #FFFFFF;
display: block;
margin-left: 5rpx;
}
}
.btn{
width: 138rpx;
text-align: center;
line-height: 53rpx;
background: #FFFFFF;
border-radius: 53rpx;
opacity: 1;
border: 1px solid #E9E9E9;
font-size: 28rpx;
font-weight: 400;
color: #535353;
}
}
.c{
padding: 30rpx 0;
.p{
line-height: 50rpx;
font-size: 28rpx;
color: #666;
text{
color: #999;
margin-right: 20rpx;
}
}
}
}
}
</style>