feat(projects): 首页主备优化
This commit is contained in:
@@ -1,223 +1,19 @@
|
||||
<template>
|
||||
<view>
|
||||
<view :style="{ marginTop: BarHeight + 'px' }"></view>
|
||||
<view class="local">
|
||||
<view class="iconfont icon-dizhi" style="font-size: 20px"></view>
|
||||
<text class="text-[28px]">{{ address }}</text>
|
||||
</view>
|
||||
<view class="search">
|
||||
<view
|
||||
class="iconfont icon-sousuo"
|
||||
style="color: #8f8f8f; margin-right: 8px"></view>
|
||||
<input placeholder="请输入商家名称搜索" v-model="searchVal" />
|
||||
<view class="search-btn" @click="clickSearch">搜索</view>
|
||||
</view>
|
||||
<view class="banner">
|
||||
<!-- <view
|
||||
class="title"
|
||||
:style="{
|
||||
backgroundImage: `url('${titleImgPath}')`,
|
||||
}"></view> -->
|
||||
<image class="title" :src="titleImgPath"></image>
|
||||
<view class="jf-btn" hover-class="none"></view>
|
||||
<!-- <view class="footer">
|
||||
<navigator
|
||||
hover-class="none"
|
||||
class="btn-1"
|
||||
url="/pages/fastBuy/index?type=1"></navigator>
|
||||
<navigator
|
||||
hover-class="none"
|
||||
openType="switchTab"
|
||||
url="/pages/game/gamehome/index"
|
||||
class="btn-2"></navigator>
|
||||
<navigator
|
||||
hover-class="none"
|
||||
class="btn-3"
|
||||
url="/pages/fastBuy/index?type=2"></navigator>
|
||||
</view> -->
|
||||
</view>
|
||||
<view class="navigation">
|
||||
<view
|
||||
class="item"
|
||||
v-for="(item, index) in navigationList"
|
||||
:key="index"
|
||||
@click="toPage(item)">
|
||||
<image class="icon" :src="item.icon" />
|
||||
<view class="text">{{ item.name }}</view>
|
||||
</view>
|
||||
</view>
|
||||
<!-- <navigator
|
||||
class="ad"
|
||||
url="/pages/marketing/yq/index"
|
||||
open-type="navigate"
|
||||
hover-class="none">
|
||||
</navigator> -->
|
||||
<MerList :get-user-location="getUserLocal" />
|
||||
<Popup :imgArr="imgList" />
|
||||
<HomeNew v-if="isNewHome" />
|
||||
<HomeOld v-else />
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script setup lang="ts">
|
||||
import Taro from '@tarojs/taro';
|
||||
import { ref } from 'vue';
|
||||
import { getHomeList } from '@/api/home';
|
||||
import MerList from '@/components/MerList.vue';
|
||||
import Popup from '@/components/Popup.vue';
|
||||
import HomeOld from './components/HomeOld.vue';
|
||||
import HomeNew from './components/HomeNew.vue';
|
||||
|
||||
const statusBarHeight = Taro.getSystemInfoSync().statusBarHeight;
|
||||
const BarHeight = ref((statusBarHeight as number) + 7);
|
||||
const isNewHome = ref(process.env.TARO_APP_SHOW_NEW_HOME === 'yes');
|
||||
|
||||
const titleImgPath = require(process.env.TARO_APP_TITLE_IMG as string);
|
||||
|
||||
interface navigationType {
|
||||
ID?: number;
|
||||
type: number;
|
||||
icon: string;
|
||||
name: string;
|
||||
url: string;
|
||||
}
|
||||
|
||||
const navigationList = ref<Array<navigationType>>([]);
|
||||
|
||||
const imgList = ref([
|
||||
// require('../../static/popTip-1.png'),
|
||||
// require('../../static/popTip.png'),
|
||||
require('../../static/zhenggai.png'),
|
||||
]);
|
||||
|
||||
Taro.useShareAppMessage(() => ({
|
||||
title: '捷兑通',
|
||||
path: `/pages/index/index?scene=${Taro.getStorageSync('token')}`,
|
||||
imageUrl: 'https://upload.jdt168.com/1714375021923881119_Share.jpg',
|
||||
}));
|
||||
|
||||
const searchVal = ref('');
|
||||
|
||||
const clickSearch = () => {
|
||||
if (!searchVal.value)
|
||||
return Taro.showToast({
|
||||
title: '请输入商家名称再搜索',
|
||||
icon: 'none',
|
||||
});
|
||||
Taro.navigateTo({
|
||||
url: `/pages/search/index?name=${searchVal.value}`,
|
||||
});
|
||||
searchVal.value = '';
|
||||
};
|
||||
|
||||
Taro.useLoad(() => {
|
||||
Taro.getPrivacySetting({
|
||||
success: res => {
|
||||
if (res.needAuthorization) {
|
||||
Taro.requirePrivacyAuthorize({
|
||||
success: () => {
|
||||
console.log('用户同意授权');
|
||||
},
|
||||
fail: () => {
|
||||
console.log('用户拒绝授权');
|
||||
Taro.exitMiniProgram();
|
||||
},
|
||||
});
|
||||
}
|
||||
},
|
||||
});
|
||||
getNavLists();
|
||||
getUserLocal();
|
||||
});
|
||||
|
||||
const address = ref('获取位置中......');
|
||||
|
||||
const getUserLocal = async () => {
|
||||
Taro.getLocation({
|
||||
type: 'wgs84',
|
||||
success: res => {
|
||||
// Taro.request({
|
||||
// url: `https://apis.map.qq.com/ws/geocoder/v1/?location=${res.latitude},${res.longitude}&key=4EJBZ-TZXCV-IHUPX-UMI2L-MK3N3-37FSQ&get_poi=1`,
|
||||
// method: 'GET',
|
||||
// success: res => {
|
||||
// switch (res.data.status) {
|
||||
// case 121:
|
||||
// Taro.showToast({
|
||||
// title: res.data.message,
|
||||
// icon: 'none',
|
||||
// });
|
||||
// break;
|
||||
// default:
|
||||
// const data = res.data.result.address_component;
|
||||
// address.value = `${data.district}${data.street_number}`;
|
||||
// break;
|
||||
// }
|
||||
// },
|
||||
// });
|
||||
Taro.request({
|
||||
url: `https://api.tianditu.gov.cn/geocoder?postStr={'lon':${res.longitude},'lat':${res.latitude},'ver':1}&type=geocode&tk=42db4f3dfd1a18d31e73ee90aa2ce054`,
|
||||
method: 'GET',
|
||||
success: res => {
|
||||
const { msg, result } = res.data;
|
||||
if (msg === 'ok') {
|
||||
address.value = `${result.addressComponent.county}${result.addressComponent.town}${result.addressComponent.address}`;
|
||||
} else {
|
||||
Taro.showToast({
|
||||
title: msg,
|
||||
icon: 'none',
|
||||
});
|
||||
}
|
||||
},
|
||||
});
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
const getNavLists = async () => {
|
||||
navigationList.value = [
|
||||
// {
|
||||
// type: 1,
|
||||
// icon: '//p0.meituan.net/csc/5c770748f0028c63741c5ec14df3cc386715.png',
|
||||
// url: '',
|
||||
// name: '活动商家',
|
||||
// },
|
||||
// {
|
||||
// type: 1,
|
||||
// icon: '//p0.meituan.net/csc/4868c06b99008ff7d5f81e6514858c8a7950.png',
|
||||
// url: '',
|
||||
// name: '兑换商家',
|
||||
// },
|
||||
{
|
||||
type: 1,
|
||||
icon: '//p0.meituan.net/csc/f33ad2443a67e9f3474a1d5fd9d529db7504.png',
|
||||
url: '/pages/users/settled_mer/index',
|
||||
name: '商户入驻',
|
||||
},
|
||||
{
|
||||
type: 1,
|
||||
icon: '//p0.meituan.net/csc/0403cf37dd14a6b44b22ffccaa2878f95703.png',
|
||||
url: '/pages/allClassList/index',
|
||||
name: '全部服务',
|
||||
},
|
||||
];
|
||||
const res = await getHomeList();
|
||||
res.data.data.forEach(item => {
|
||||
navigationList.value.unshift({
|
||||
ID: item.ID,
|
||||
type: 2,
|
||||
icon: item.icon,
|
||||
url: item.url,
|
||||
name: item.name,
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
const toPage = item => {
|
||||
item.type !== 1
|
||||
? Taro.navigateTo({
|
||||
url: `/pages/search/index?id=${item.ID}&name=${item.name}`,
|
||||
})
|
||||
: Taro.navigateTo({
|
||||
url: item.url as string,
|
||||
});
|
||||
};
|
||||
console.log(process.env.TARO_APP_SHOW_NEW_HOME);
|
||||
console.log(isNewHome.value);
|
||||
</script>
|
||||
|
||||
<style lang="scss">
|
||||
@import './index.scss';
|
||||
</style>
|
||||
<style lang="scss" scoped></style>
|
||||
|
||||
Reference in New Issue
Block a user