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.
125 lines
3.1 KiB
125 lines
3.1 KiB
2 years ago
|
<template>
|
||
|
<view>
|
||
|
<view class="width100 height120 headsbg backcorfff" @click="jumpupadess('add')">
|
||
|
<view class="height20"></view>
|
||
|
<view class="width100 fotct font18 fcor666">自助餐厅,不支持外卖</view>
|
||
|
<image src="../static/imgs/buffstu.png" mode="widthFix" class="width100"></image>
|
||
|
</view>
|
||
|
|
||
|
<view class="input-box mart20 width90">
|
||
|
<input placeholder="请输入关键字搜索" placeholder-style="color:#c0c0c0;" />
|
||
|
<view class="icon search"></view>
|
||
|
</view>
|
||
|
|
||
|
<view class="mart20 width80 alijusstart fotct marb20">
|
||
|
<view class="width50 fcor333 font16" :class="collection == 1?'colorc8':'fcor333'" @click="changestu(1)">附近餐厅
|
||
|
<text class="bufbtn" :class="collection == 1?'backgrdc8':'backcor33'">97</text>
|
||
|
</view>
|
||
|
<view class="width50 fcor333 font16" :class="collection == 2?'colorc8':'fcor333'" @click="changestu(2)">
|
||
|
收藏的餐厅
|
||
|
<text class="bufbtn" :class="collection == 2?'backgrdc8':'backcor33'">0</text>
|
||
|
</view>
|
||
|
</view>
|
||
|
|
||
|
<view class="mart10 width90 height90 borderrs backcorfff" v-for="(item,index) in kcfShopList" :key="index"
|
||
|
@click="jumpmenulist()">
|
||
|
<view class="paddtop10 width90 alijusstart">
|
||
|
<view class="width80p font16 fcor333 fontwig6">时代天街</view>
|
||
|
<view class="width20 fotrt">
|
||
|
<!-- <image mode="widthFix" class="icon20" src="../static/imgs/nocollection.png"></image> -->
|
||
|
<image mode="widthFix" class="icon20" src="../static/imgs/collection.png"></image>
|
||
|
</view>
|
||
|
</view>
|
||
|
<view class="width90 mart5 font12 fcor999">前门西大街正阳市场1号楼中部</view>
|
||
|
<view class="width90 mart5 alijusstart">
|
||
|
<image class="icon15" src="../static/imgs/location.png" mode="widthFix"></image>
|
||
|
<text class="margle font14 fcor666">0.2km</text>
|
||
|
</view>
|
||
|
</view>
|
||
|
</view>
|
||
|
</template>
|
||
|
|
||
|
<script>
|
||
|
export default {
|
||
|
data() {
|
||
|
return {
|
||
|
collection: 1, //是否收藏
|
||
|
kcfShopList: [1, 2, 3, 4, 5, 6, 7, 8, 9] //肯德基列表
|
||
|
}
|
||
|
},
|
||
|
methods: {
|
||
|
//更换状态
|
||
|
changestu(item) {
|
||
|
this.collection = item;
|
||
|
},
|
||
|
//跳转菜单
|
||
|
jumpmenulist() {
|
||
|
uni.navigateTo({
|
||
|
url: '../menu-list/menu-list'
|
||
|
})
|
||
|
}
|
||
|
}
|
||
|
}
|
||
|
</script>
|
||
|
|
||
|
<style lang="scss">
|
||
|
page {
|
||
|
background-color: #f0f0f0;
|
||
|
}
|
||
|
|
||
|
.headsbg {
|
||
|
border-radius: 0 0 30px 30px;
|
||
|
}
|
||
|
|
||
|
.colorc8 {
|
||
|
color: #c82b1f;
|
||
|
}
|
||
|
|
||
|
.backgrdc8 {
|
||
|
background-color: #c82b1f;
|
||
|
}
|
||
|
|
||
|
.borderrs {
|
||
|
border-radius: 10px;
|
||
|
}
|
||
|
|
||
|
|
||
|
.bufbtn {
|
||
|
padding-left: 7px;
|
||
|
padding-right: 7px;
|
||
|
padding-top: 1px;
|
||
|
padding-bottom: 1px;
|
||
|
font-size: 12px;
|
||
|
color: #ffffff;
|
||
|
border-radius: 15px;
|
||
|
}
|
||
|
|
||
|
.input-box {
|
||
|
height: 70rpx;
|
||
|
background-color: #ffffff;
|
||
|
border-radius: 30rpx;
|
||
|
position: relative;
|
||
|
display: flex;
|
||
|
align-items: center;
|
||
|
|
||
|
.icon {
|
||
|
display: flex;
|
||
|
align-items: center;
|
||
|
position: absolute;
|
||
|
top: 0;
|
||
|
right: 0;
|
||
|
width: 60upx;
|
||
|
height: 60upx;
|
||
|
font-size: 34upx;
|
||
|
color: #c0c0c0;
|
||
|
}
|
||
|
|
||
|
input {
|
||
|
padding-left: 28upx;
|
||
|
height: 28upx;
|
||
|
font-size: 28upx;
|
||
|
width: 100%;
|
||
|
}
|
||
|
}
|
||
|
</style>
|