连云港陪玩陪聊
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.
 
 
 
 
 
 
chunwan/pages/news/dingzhi.vue

112 lines
2.4 KiB

<template>
<view class="dingzhi">
<view class="dingzhi-navbar">
<u-navbar title="我的定制" title-color="#fff" back-icon-color="#fff" :background="background"></u-navbar>
</view>
<view class="dingzhi-hd">
<view class="a">
<view class="fl">游玩天数</view>
<view class="fr">
<image src="@/static/lvyou/add-02.png" @click="toNext(1)"></image>
<view class="txt">{{count}}</view>
<image src="@/static/lvyou/add-01.png" @click="toNext(2)"></image>
</view>
</view>
<view class="b" @click="toNext(3)">马上为我定制</view>
</view>
<view class="dingzhi-bd">
<image mode="widthFix" src="@/static/lvyou/dingzhi-01.png"></image>
</view>
</view>
</template>
<script>
export default {
data() {
return {
count: 1,
background: {
// 导航栏背景图
background: 'url(https://api.lyiyuan.cn/profile/upload/2024/12/27/ee5be92cf897de5d1ae2ccad385e598a.png) center top no-repeat',
// 还可以设置背景图size属性
backgroundSize: '100% auto',
},
};
},
methods: {
toNext(index){
if(index == 1){
this.count --
}else if(index == 2){
this.count ++
}else if(index == 3){
uni.navigateTo({
url: "/pages/news/mydingzhi?count="+this.count
})
}
},
}
}
</script>
<style scoped lang="scss">
.dingzhi{
background: #FFFFFF url(https://api.lyiyuan.cn/profile/upload/2024/12/27/ee5be92cf897de5d1ae2ccad385e598a.png) center top no-repeat;
background-size: 100% auto;
min-height: 100vh;
&-hd{
width: 702rpx;
height: 280rpx;
background: #FFFFFF;
border-radius: 20rpx;
margin: 0 auto;
margin-top: 400rpx;
z-index: 21;
padding: 50rpx 30rpx 30rpx;
box-sizing: border-box;
.a{
display: flex;
align-items: center;
justify-content: space-between;
.fl{
flex: 1;
font-weight: 400;
font-size: 36rpx;
color: #222222;
}
.fr{
display: flex;
align-items: center;
justify-content: center;
image{
width: 45rpx;
height: 45rpx;
}
.txt{
font-weight: 400;
width: 110rpx;
text-align: center;
font-size: 36rpx;
color: #222222;
}
}
}
.b{
width: 100%;
line-height: 90rpx;
background: #000000;
border-radius: 90rpx;
text-align: center;
font-weight: bold;
font-size: 30rpx;
color: #FFFFFF;
margin-top: 55rpx;
}
}
&-bd{
margin-top: 30rpx;
image{
width: 100%;
}
}
}
</style>