|
@@ -2,8 +2,8 @@
|
|
|
<view class="container">
|
|
|
<view class="container-top-box">
|
|
|
<view class="top-title">
|
|
|
- <view class="address" @click.stop="manualGetLocation">
|
|
|
- <span>{{ nowAddress }}</span>
|
|
|
+ <view class="address" @click.stop="$u.route('/pagesHome/homeAddress/index')">
|
|
|
+ <view>{{ location.district.name || nowAddress }}</view>
|
|
|
<u-icon name="arrow-down-fill" color="#333333" size="10"></u-icon>
|
|
|
</view>
|
|
|
<view class="title">车旅程</view>
|
|
@@ -13,13 +13,11 @@
|
|
|
<u-search
|
|
|
placeholder="请输入搜索内容"
|
|
|
:showAction="false"
|
|
|
- v-model="keyword"
|
|
|
- @click="$Router.push('/pagesHome/homeSearch/index')"
|
|
|
+ @click="$u.route('/pagesHome/homeSearch/index')"
|
|
|
bgColor="#fff"
|
|
|
:disabled="true"
|
|
|
/>
|
|
|
</view>
|
|
|
-
|
|
|
<view class="top-swiper-box">
|
|
|
<u-swiper :list="swiperUrlList" @click="handlerSwiperSkip" indicator circular />
|
|
|
</view>
|
|
@@ -47,7 +45,7 @@
|
|
|
<view class="top-title">热门推荐</view>
|
|
|
<view
|
|
|
class="top-more"
|
|
|
- @click="$Router.push('/pagesHome/popularNearby/index?queryType=1')"
|
|
|
+ @click="$u.route('/pagesHome/popularNearby/index?queryType=1')"
|
|
|
>
|
|
|
<span>查看更多</span>
|
|
|
<u-icon name="arrow-right" color="#999999" size="14"></u-icon>
|
|
@@ -58,7 +56,7 @@
|
|
|
class="item"
|
|
|
v-for="(item, index) in homeData.recommends"
|
|
|
:key="item.id"
|
|
|
- @click="$Router.push(`/pagesHome/marketer/index?id=${item.id}`)"
|
|
|
+ @click="$u.route(`/pagesHome/marketer/index?id=${item.id}`)"
|
|
|
>
|
|
|
<home-store v-if="index < 4" :item="item" isType="hot"></home-store>
|
|
|
</view>
|
|
@@ -70,7 +68,7 @@
|
|
|
<view class="top-title">附近商家</view>
|
|
|
<view
|
|
|
class="top-more"
|
|
|
- @click="$Router.push('/pagesHome/popularNearby/index?queryType=0')"
|
|
|
+ @click="$u.route('/pagesHome/popularNearby/index?queryType=0')"
|
|
|
>
|
|
|
<span>查看更多</span>
|
|
|
<u-icon name="arrow-right" color="#999999" size="14"></u-icon>
|
|
@@ -81,7 +79,7 @@
|
|
|
class="item"
|
|
|
v-for="(item, index) in homeData.nears"
|
|
|
:key="item.id"
|
|
|
- @click="$Router.push(`/pagesHome/marketer/index?id=${item.id}`)"
|
|
|
+ @click="$u.route(`/pagesHome/marketer/index?id=${item.id}`)"
|
|
|
>
|
|
|
<home-store v-if="index < 4" :item="item" isType="near"></home-store>
|
|
|
</view>
|
|
@@ -92,15 +90,13 @@
|
|
|
</template>
|
|
|
|
|
|
<script>
|
|
|
-import { getCurrentLocation, getHomePageApi, getSwiperListApi } from '@/api/client/home';
|
|
|
+import { getHomePageApi, getSwiperListApi } from '@/api/client/home';
|
|
|
import { inviteBind } from '@/api/client/mine.js';
|
|
|
-import { mapGetters } from 'vuex';
|
|
|
export default {
|
|
|
name: 'home',
|
|
|
data() {
|
|
|
return {
|
|
|
list: [],
|
|
|
- keyword: '',
|
|
|
swiperUrlList: [], // 轮播图url列表
|
|
|
swiperList: [],
|
|
|
homeData: {
|
|
@@ -108,122 +104,104 @@ export default {
|
|
|
nears: [],
|
|
|
recommends: [],
|
|
|
},
|
|
|
- queryParams: {
|
|
|
- longitude: '',
|
|
|
- latitude: '',
|
|
|
- region: '',
|
|
|
- },
|
|
|
nowAddress: '地址', //当前地址
|
|
|
+ params: {},
|
|
|
};
|
|
|
},
|
|
|
computed: {
|
|
|
- ...mapGetters(['location', 'userId', 'invitationCode']),
|
|
|
categories() {
|
|
|
- let initData = this.homeData.categories.map(item => {
|
|
|
- if (!item.icon) {
|
|
|
- item.icon = 'level';
|
|
|
- }
|
|
|
- return item;
|
|
|
- });
|
|
|
- let result =
|
|
|
- initData.length > 14
|
|
|
- ? initData.splice(0, 14).concat([
|
|
|
- {
|
|
|
+ if (this.homeData.categories) {
|
|
|
+ let initData = this.homeData.categories.map(item => {
|
|
|
+ if (!item.icon) {
|
|
|
+ item.icon = 'level';
|
|
|
+ }
|
|
|
+ return item;
|
|
|
+ });
|
|
|
+ let result =
|
|
|
+ initData.length > 14
|
|
|
+ ? initData.splice(0, 14).concat([
|
|
|
+ {
|
|
|
+ id: 'all',
|
|
|
+ icon: '/static/pages/home/home-all.png',
|
|
|
+ name: '全部',
|
|
|
+ type: {
|
|
|
+ code: 'ALL',
|
|
|
+ description: '全部',
|
|
|
+ },
|
|
|
+ },
|
|
|
+ ])
|
|
|
+ : initData.push({
|
|
|
id: 'all',
|
|
|
icon: '/static/pages/home/home-all.png',
|
|
|
name: '全部',
|
|
|
- type: {
|
|
|
- code: 'ALL',
|
|
|
- description: '全部',
|
|
|
- },
|
|
|
- },
|
|
|
- ])
|
|
|
- : initData.push({
|
|
|
- id: 'all',
|
|
|
- icon: '/static/pages/home/home-all.png',
|
|
|
- name: '全部',
|
|
|
- });
|
|
|
- return result;
|
|
|
+ });
|
|
|
+ return result;
|
|
|
+ }
|
|
|
},
|
|
|
},
|
|
|
- onShow() {
|
|
|
- this.handleInvitationCode();
|
|
|
- },
|
|
|
mounted() {
|
|
|
+ this.handleGetLocation();
|
|
|
+
|
|
|
+ let { longitude, latitude, region } = this.location;
|
|
|
+ this.params = {
|
|
|
+ longitude,
|
|
|
+ latitude,
|
|
|
+ region,
|
|
|
+ };
|
|
|
this.getSwiperList();
|
|
|
- this.handleGetLocationNew();
|
|
|
+ this.handleInvitationCode();
|
|
|
},
|
|
|
methods: {
|
|
|
- // 获取当前编码region
|
|
|
- handlerGetRegion(longitude, latitude) {
|
|
|
- let point = `${latitude},${longitude}`;
|
|
|
- getCurrentLocation({
|
|
|
- point,
|
|
|
- }).then(res => {
|
|
|
- console.log(res.data, '获取当前经纬度');
|
|
|
- let { city, district, id } = res.data;
|
|
|
- this.queryParams.region = res.data.id;
|
|
|
- if (district) {
|
|
|
- this.nowAddress = district.name;
|
|
|
- } else if (city) {
|
|
|
- this.nowAddress = city.name;
|
|
|
- } else {
|
|
|
- this.nowAddress = '地图';
|
|
|
- }
|
|
|
- this.getHomeData(this.queryParams);
|
|
|
- this.$store.commit('SET_LOCATION', {
|
|
|
- longitude: longitude,
|
|
|
- latitude: latitude,
|
|
|
- region: res.data.id,
|
|
|
- address: res.data.name,
|
|
|
- });
|
|
|
+ // 初始化,获取定位信息
|
|
|
+ handleGetLocation() {
|
|
|
+ uni.getLocation({
|
|
|
+ type: 'gcj02',
|
|
|
+ success: res => {
|
|
|
+ let { longitude, latitude } = res;
|
|
|
+ let data = { longitude, latitude };
|
|
|
+ this.$store.dispatch('getLocationNow', data).then(() => {
|
|
|
+ this.getHomeData(this.params);
|
|
|
+ });
|
|
|
+ },
|
|
|
+ fail: err => {},
|
|
|
});
|
|
|
},
|
|
|
+
|
|
|
/* 轮播图 */
|
|
|
getSwiperList() {
|
|
|
getSwiperListApi().then(res => {
|
|
|
- this.swiperList = res.data;
|
|
|
- res.data.map(rs => {
|
|
|
- this.swiperUrlList.push(rs.viewUrl);
|
|
|
- });
|
|
|
+ let { data } = res;
|
|
|
+ this.swiperList = data;
|
|
|
+ if (data) {
|
|
|
+ data.map(rs => {
|
|
|
+ this.swiperUrlList.push(rs.viewUrl);
|
|
|
+ });
|
|
|
+ }
|
|
|
});
|
|
|
},
|
|
|
- // 获取首页数据
|
|
|
- getHomeData(location) {
|
|
|
- getHomePageApi(location).then(res => {
|
|
|
+
|
|
|
+ /* 获取首页数据 -- 热门推荐,附近商家,分类 */
|
|
|
+ getHomeData(params) {
|
|
|
+ getHomePageApi(params).then(res => {
|
|
|
this.homeData = res.data;
|
|
|
// 将分类数据做缓存处理
|
|
|
this.$store.commit('SET_CATEGORIES', this.homeData.categories);
|
|
|
});
|
|
|
},
|
|
|
- // 手动选择城市
|
|
|
- manualGetLocation() {
|
|
|
- uni.$u.route('/pagesHome/homeAddress/index');
|
|
|
- // uni.chooseLocation({
|
|
|
- // success: res => {
|
|
|
- // let { longitude, latitude } = res;
|
|
|
- // this.queryParams.longitude = longitude.toFixed(5);
|
|
|
- // this.queryParams.latitude = latitude.toFixed(5);
|
|
|
- // this.handlerGetRegion(longitude.toFixed(5), latitude.toFixed(5));
|
|
|
- // },
|
|
|
- // fail: err => {},
|
|
|
- // });
|
|
|
- },
|
|
|
- // 点击swiper跳转
|
|
|
- handlerSwiperSkip(e) {
|
|
|
- console.log('@@@swiperList', this.swiperList[e]);
|
|
|
- },
|
|
|
- // 点击菜单
|
|
|
+
|
|
|
+ /* 点击swiper跳转 */
|
|
|
+ handlerSwiperSkip(e) {},
|
|
|
+ /* 点击菜单 */
|
|
|
handleMenuClick(item) {
|
|
|
if (item.name === '全部') {
|
|
|
- this.$Router.push('/pagesHome/category/index');
|
|
|
+ uni.$u.route('/pagesHome/category/index');
|
|
|
} else {
|
|
|
uni.navigateTo({
|
|
|
- url: `/pagesHome/storeList/index?id=${item.id}&name=${item.name}`,
|
|
|
+ url: `/pagesHome/storeList/index?id=${item.id}&keyword=${item.name}`,
|
|
|
});
|
|
|
}
|
|
|
},
|
|
|
- // 如果 invitationCode 存在且不等于特殊值时执行代码
|
|
|
+ /* 如果 invitationCode 存在且不等于特殊值时执行代码 */
|
|
|
handleInvitationCode() {
|
|
|
if (this.invitationCode) {
|
|
|
let params = {
|
|
@@ -243,22 +221,6 @@ export default {
|
|
|
this.$store.commit('SET_INVITATIONCODE', '');
|
|
|
}
|
|
|
},
|
|
|
- // 页面显示时 获取当前零维度
|
|
|
- handleGetLocationNew() {
|
|
|
- uni.getLocation({
|
|
|
- type: 'gcj02',
|
|
|
- success: res => {
|
|
|
- let { longitude, latitude } = res;
|
|
|
- this.queryParams.longitude = longitude;
|
|
|
- this.queryParams.latitude = latitude;
|
|
|
- // getCurrentLocation 获取当前编码region
|
|
|
- this.handlerGetRegion(longitude, latitude);
|
|
|
- },
|
|
|
- fail: () => {
|
|
|
- this.manualGetLocation();
|
|
|
- },
|
|
|
- });
|
|
|
- },
|
|
|
},
|
|
|
};
|
|
|
</script>
|