|
@@ -2,11 +2,11 @@
|
|
|
<view class="home">
|
|
|
<!-- 顶部导航 -->
|
|
|
<view class="home-header">
|
|
|
- <view class="gotoAddress" @click="gotoAddress">
|
|
|
+ <view class="goto-address" @click="$Router.push('/client/chooseCity/index')">
|
|
|
<span>地址</span>
|
|
|
- <i class="iconfont icon-sanjiaoxing1"></i>
|
|
|
+ <text class="iconfont icon-sanjiaoxing1"></text>
|
|
|
</view>
|
|
|
- <view class="searchItem" @click="gotoSearch">
|
|
|
+ <view class="search-item" @click="Router.push('/client/search/index')">
|
|
|
<u-search placeholder="请输入搜索内容" :showAction="false" v-model="keyword" />
|
|
|
</view>
|
|
|
</view>
|
|
@@ -29,60 +29,60 @@
|
|
|
|
|
|
<!-- 热门推荐 -->
|
|
|
<view class="home-hot">
|
|
|
- <view class="hotRec">
|
|
|
- <h3>热门推荐</h3>
|
|
|
- <i class="iconfont icon-youjiantou"></i>
|
|
|
+ <view class="hot-rec">
|
|
|
+ <view>热门推荐</view>
|
|
|
+ <text class="iconfont icon-youjiantou"></text>
|
|
|
</view>
|
|
|
- <div class="hotList">
|
|
|
- <view class="hotItem" @click="gotoDetail">
|
|
|
- <view class="hotImage">图片</view>
|
|
|
- <view class="hotName">商家名称</view>
|
|
|
- <view class="hotName">具体位置</view>
|
|
|
+ <view class="hotList">
|
|
|
+ <view class="hot-item" @click="$Router.push('/business/detail/index')">
|
|
|
+ <view class="hot-image">图片</view>
|
|
|
+ <view class="hot-name">商家名称</view>
|
|
|
+ <view class="hot-name">具体位置</view>
|
|
|
</view>
|
|
|
- <view class="hotItem">
|
|
|
- <view class="hotImage">图片</view>
|
|
|
- <view class="hotName">商家名称</view>
|
|
|
- <view class="hotName">具体位置</view>
|
|
|
+ <view class="hot-item">
|
|
|
+ <view class="hot-image">图片</view>
|
|
|
+ <view class="hot-name">商家名称</view>
|
|
|
+ <view class="hot-name">具体位置</view>
|
|
|
</view>
|
|
|
- <view class="hotItem">
|
|
|
- <view class="hotImage">图片</view>
|
|
|
- <view class="hotName">商家名称</view>
|
|
|
- <view class="hotName">具体位置</view>
|
|
|
+ <view class="hot-item">
|
|
|
+ <view class="hot-image">图片</view>
|
|
|
+ <view class="hot-name">商家名称</view>
|
|
|
+ <view class="hot-name">具体位置</view>
|
|
|
</view>
|
|
|
- <view class="hotItem">
|
|
|
- <view class="hotImage">图片</view>
|
|
|
- <view class="hotName">商家名称</view>
|
|
|
- <view class="hotName">具体位置</view>
|
|
|
+ <view class="hot-item">
|
|
|
+ <view class="hot-image">图片</view>
|
|
|
+ <view class="hot-name">商家名称</view>
|
|
|
+ <view class="hot-name">具体位置</view>
|
|
|
</view>
|
|
|
- </div>
|
|
|
+ </view>
|
|
|
</view>
|
|
|
<!-- 附近商家 -->
|
|
|
|
|
|
<view class="home-hot">
|
|
|
- <view class="hotRec">
|
|
|
- <h3>附近商家</h3>
|
|
|
+ <view class="hot-rec">
|
|
|
+ <view>附近商家</view>
|
|
|
<i class="iconfont icon-youjiantou"></i>
|
|
|
</view>
|
|
|
<view class="hotList">
|
|
|
- <view class="hotItem">
|
|
|
- <view class="hotImage">图片</view>
|
|
|
- <view class="hotName">商家名称</view>
|
|
|
- <view class="hotName">具体位置</view>
|
|
|
+ <view class="hot-item">
|
|
|
+ <view class="hot-image">图片</view>
|
|
|
+ <view class="hot-name">商家名称</view>
|
|
|
+ <view class="hot-name">具体位置</view>
|
|
|
</view>
|
|
|
- <view class="hotItem">
|
|
|
- <view class="hotImage">图片</view>
|
|
|
- <view class="hotName">商家名称</view>
|
|
|
- <view class="hotName">具体位置</view>
|
|
|
+ <view class="hot-item">
|
|
|
+ <view class="hot-image">图片</view>
|
|
|
+ <view class="hot-name">商家名称</view>
|
|
|
+ <view class="hot-name">具体位置</view>
|
|
|
</view>
|
|
|
- <view class="hotItem">
|
|
|
- <view class="hotImage">图片</view>
|
|
|
- <view class="hotName">商家名称</view>
|
|
|
- <view class="hotName">具体位置</view>
|
|
|
+ <view class="hot-item">
|
|
|
+ <view class="hot-image">图片</view>
|
|
|
+ <view class="hot-name">商家名称</view>
|
|
|
+ <view class="hot-name">具体位置</view>
|
|
|
</view>
|
|
|
- <view class="hotItem">
|
|
|
- <view class="hotImage">图片</view>
|
|
|
- <view class="hotName">商家名称</view>
|
|
|
- <view class="hotName">具体位置</view>
|
|
|
+ <view class="hot-item">
|
|
|
+ <view class="hot-image">图片</view>
|
|
|
+ <view class="hot-name">商家名称</view>
|
|
|
+ <view class="hot-name">具体位置</view>
|
|
|
</view>
|
|
|
</view>
|
|
|
</view>
|
|
@@ -90,9 +90,15 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
+import { getHomePage } from '@/api/home';
|
|
|
+
|
|
|
export default {
|
|
|
data() {
|
|
|
return {
|
|
|
+ location: {
|
|
|
+ longitude: 0,
|
|
|
+ latitude: 0,
|
|
|
+ },
|
|
|
keyword: '',
|
|
|
list: [
|
|
|
'https://cdn.uviewui.com/uview/swiper/swiper1.png',
|
|
@@ -124,28 +130,29 @@ export default {
|
|
|
};
|
|
|
},
|
|
|
methods: {
|
|
|
- // 跳转地址栏
|
|
|
- gotoAddress() {
|
|
|
- uni.navigateTo({
|
|
|
- url: "/client/chooseCity/index",
|
|
|
- })
|
|
|
- },
|
|
|
- // 跳转详情页
|
|
|
- gotoSearch() {
|
|
|
- uni.navigateTo({
|
|
|
- url: "/client/search/index",
|
|
|
- })
|
|
|
- },
|
|
|
- // 跳转详情页
|
|
|
- gotoDetail(){
|
|
|
- uni.navigateTo({
|
|
|
- url: "/business/detail/index",
|
|
|
- })
|
|
|
- },
|
|
|
- change() { },
|
|
|
+ change() {},
|
|
|
click(name) {
|
|
|
this.$refs.uToast.success(`点击了第${name}个`);
|
|
|
},
|
|
|
+ onShow() {
|
|
|
+ uni.getLocation({
|
|
|
+ type: 'gcj02',
|
|
|
+ success: res => {
|
|
|
+ console.log('当前位置的经度:' + res.longitude);
|
|
|
+ console.log('当前位置的纬度:' + res.latitude);
|
|
|
+ this.location.longitude = res.longitude;
|
|
|
+ this.location.latitude = res.latitude;
|
|
|
+ this.$store.commit('SET_LOCATION', { longitude: res.longitude, latitude: res.latitude });
|
|
|
+ getHomePage(this.location)
|
|
|
+ .then(res => {
|
|
|
+ console.log(res);
|
|
|
+ })
|
|
|
+ .catch(err => {
|
|
|
+ console.log(err);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ });
|
|
|
+ },
|
|
|
},
|
|
|
};
|
|
|
</script>
|
|
@@ -164,7 +171,7 @@ export default {
|
|
|
padding: 0 20rpx;
|
|
|
background-color: #347caf;
|
|
|
|
|
|
- .gotoAddress {
|
|
|
+ .goto-address {
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
|
|
@@ -173,7 +180,7 @@ export default {
|
|
|
margin: 17rpx 10rpx 0 6rpx;
|
|
|
}
|
|
|
}
|
|
|
- .searchItem{
|
|
|
+ .search-item {
|
|
|
flex: 1;
|
|
|
}
|
|
|
}
|
|
@@ -203,7 +210,7 @@ export default {
|
|
|
.home-hot {
|
|
|
margin: 20rpx;
|
|
|
|
|
|
- .hotRec {
|
|
|
+ .hot-rec {
|
|
|
margin: 25rpx 0;
|
|
|
display: flex;
|
|
|
justify-content: space-between;
|
|
@@ -220,24 +227,24 @@ export default {
|
|
|
justify-content: space-between;
|
|
|
}
|
|
|
|
|
|
- .hotItem:nth-last-child(2n + 1) {
|
|
|
+ .hot-item:nth-last-child(2n + 1) {
|
|
|
margin-right: 0;
|
|
|
}
|
|
|
|
|
|
- .hotItem {
|
|
|
+ .hot-item {
|
|
|
height: 300rpx;
|
|
|
width: calc(50% - 10rpx);
|
|
|
margin: 0 20rpx 20rpx 0;
|
|
|
background-color: #fff;
|
|
|
|
|
|
- .hotImage {
|
|
|
+ .hot-image {
|
|
|
background-color: #e8e8e8;
|
|
|
height: 200rpx;
|
|
|
line-height: 200rpx;
|
|
|
text-align: center;
|
|
|
}
|
|
|
|
|
|
- .hotName {
|
|
|
+ .hot-name {
|
|
|
font-size: 24rpx;
|
|
|
}
|
|
|
}
|