Refactor:分包
This commit is contained in:
lifizer
+3
-768
@@ -429,7 +429,6 @@ import { pageListenMixins } from '@/mixins/pageListenMixins'
|
||||
import ProductWindow from '@/components/ProductWindow'
|
||||
import goCartMixin from '@/mixins/goCartMixins'
|
||||
import FunctionGuide from '@/components/FunctionGuide'
|
||||
import GuideMixins from '@/mixins/GuideMixins'
|
||||
import AiEntrance from '@/components/aiChat/entrance'
|
||||
import {
|
||||
getSearchPageConfig
|
||||
@@ -451,7 +450,7 @@ export default {
|
||||
FunctionGuide,
|
||||
AiEntrance
|
||||
},
|
||||
mixins: [pageListenMixins, goCartMixin, GuideMixins],
|
||||
mixins: [pageListenMixins, goCartMixin],
|
||||
data() {
|
||||
return {
|
||||
isFirstLoad: true,
|
||||
@@ -522,8 +521,7 @@ export default {
|
||||
// uni.hideTabBar()
|
||||
const _this = this
|
||||
_this.init()
|
||||
_this.queryGuide('index')
|
||||
this.getSearch()
|
||||
_this.getSearch()
|
||||
uni.getSystemInfo({
|
||||
success: (e) => {
|
||||
let statusBar = 0
|
||||
@@ -539,7 +537,7 @@ export default {
|
||||
getWeixinShareConfig().then(res => {
|
||||
const { success, data } = res
|
||||
if (success) {
|
||||
this.shareData = data
|
||||
_this.shareData = data
|
||||
}
|
||||
})
|
||||
},
|
||||
@@ -653,769 +651,6 @@ export default {
|
||||
})
|
||||
})
|
||||
},
|
||||
showFunctionGuide() {
|
||||
if(this._step == this.functionGuideData.step) return
|
||||
this._step = this.functionGuideData.step
|
||||
if(this.functionGuideData.step == 1) {
|
||||
const imgs = [
|
||||
{
|
||||
url: this.webUrl + '/引导页素材/首页引导/Group1/Group 1-1.png',
|
||||
style: {
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '474rpx',
|
||||
top: '100rpx',
|
||||
left: '-110rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '289rpx',
|
||||
/* px: ; */
|
||||
},
|
||||
isBtn: false
|
||||
},
|
||||
{
|
||||
url: this.webUrl + '/引导页素材/首页引导/Group1/Group 1-2.png',
|
||||
style: {
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '186rpx',
|
||||
top: '350rpx',
|
||||
left: '240rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '46rpx',
|
||||
},
|
||||
isBtn: 'next'
|
||||
},
|
||||
{
|
||||
url: this.webUrl + '/引导页素材/首页引导/Group1/Group 1-3.png',
|
||||
style: {
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '173rpx',
|
||||
top: '180rpx',
|
||||
right: '100rpx',
|
||||
height: '248rpx',
|
||||
},
|
||||
isBtn: false
|
||||
},
|
||||
]
|
||||
this.getElementData('#step1', res=>{
|
||||
this.screenWidth = res.width - 20
|
||||
this.setFunctionGuideData({
|
||||
imgs: imgs,
|
||||
btnGroupPosition: {
|
||||
top: 510 - 100 + 'rpx',
|
||||
},
|
||||
tipsPosition: '420rpx',
|
||||
position: {
|
||||
top: 510 - 100 + 'rpx',
|
||||
left: res.left + 10 + 'px',
|
||||
width: `${res.width - 20}px`,
|
||||
height: `${160 + 228 + 16 + 514 + 16}rpx`,
|
||||
}
|
||||
})
|
||||
})
|
||||
}else {
|
||||
const menusUrl = this.menus.map(item => item.uniapp_url)
|
||||
const urls = {
|
||||
2: '/pages/chose-city/chose-city?type=0',
|
||||
3: '/pages/chose-city/chose-city?type=1',
|
||||
4: '/pkg_product/views/healthList',
|
||||
5: '/pkg_product/views/giftList',
|
||||
6: '/pkg_product/views/heritage',
|
||||
7: '/pkg_join/views/index',
|
||||
8: '/v4/views/attract/attract'
|
||||
}
|
||||
if(this.functionGuideData.step == 2) {
|
||||
if(menusUrl.indexOf(urls[2]) < 0) {
|
||||
this.$refs.FunctionGuide.next()
|
||||
return
|
||||
}
|
||||
if(menusUrl.indexOf(urls[2]) > -1) {
|
||||
const index = menusUrl.indexOf(urls[2])
|
||||
const imgs = [
|
||||
{
|
||||
url: this.webUrl + '/引导页素材/首页引导/Group2/Group 2-1.png',
|
||||
style:{
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '454rpx',
|
||||
top: '140rpx',
|
||||
left: '-130rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '258rpx',
|
||||
},
|
||||
isBtn: false
|
||||
},
|
||||
{
|
||||
url: this.webUrl + '/引导页素材/首页引导/Group2/Group 2-2.png',
|
||||
style:{
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '117rpx',
|
||||
top: 213*2+'rpx',
|
||||
left: '-110rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '46rpx',
|
||||
},
|
||||
isBtn: 'jump'
|
||||
},
|
||||
{
|
||||
url: this.webUrl + '/引导页素材/首页引导/Group2/Group 2-3.png',
|
||||
style:{
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '117rpx',
|
||||
top: 213*2+'rpx',
|
||||
left: '200rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '46rpx',
|
||||
},
|
||||
isBtn: 'next'
|
||||
},
|
||||
]
|
||||
this.toEle('box-item' + index, imgs)
|
||||
}
|
||||
return
|
||||
}
|
||||
if(this.functionGuideData.step == 3) {
|
||||
if(menusUrl.indexOf(urls[3]) < 0) {
|
||||
this.$refs.FunctionGuide.next()
|
||||
return
|
||||
}
|
||||
if(menusUrl.indexOf(urls[3]) > -1) {
|
||||
const imgs = [
|
||||
{
|
||||
url: this.webUrl + '/引导页素材/首页引导/Group3/Group 3-1.png',
|
||||
style:{
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '620rpx',
|
||||
top: '540rpx',
|
||||
left: '-50rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '254rpx',
|
||||
},
|
||||
isBtn: false
|
||||
},
|
||||
{
|
||||
url: this.webUrl + '/引导页素材/首页引导/Group3/Group 3-2.png',
|
||||
style:{
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '117rpx',
|
||||
top: '530rpx',
|
||||
left: '110rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '46rpx',
|
||||
},
|
||||
isBtn: 'jump'
|
||||
},
|
||||
{
|
||||
url: this.webUrl + '/引导页素材/首页引导/Group3/Group 3-3.png',
|
||||
style:{
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '117rpx',
|
||||
top: '530rpx',
|
||||
left: '410rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '46rpx',
|
||||
},
|
||||
isBtn: 'next'
|
||||
},
|
||||
]
|
||||
const index = menusUrl.indexOf(urls[3])
|
||||
this.toEle('box-item' + index, imgs)
|
||||
}
|
||||
return
|
||||
}
|
||||
if(this.functionGuideData.step == 4) {
|
||||
if(menusUrl.indexOf(urls[4]) < 0) {
|
||||
this.$refs.FunctionGuide.next()
|
||||
return
|
||||
}
|
||||
if(menusUrl.indexOf(urls[4]) > -1) {
|
||||
const imgs = [
|
||||
{
|
||||
url: this.webUrl + '/引导页素材/首页引导/Group4/Group 4-1.png',
|
||||
style:{
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '578rpx',
|
||||
top: '180rpx',
|
||||
left: '150rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '226rpx',
|
||||
},
|
||||
isBtn: false
|
||||
},
|
||||
{
|
||||
url: this.webUrl + '/引导页素材/首页引导/Group4/Group 4-2.png',
|
||||
style:{
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '117rpx',
|
||||
top: 213*2+'rpx',
|
||||
left: '340rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '46rpx',
|
||||
},
|
||||
isBtn: 'jump'
|
||||
},
|
||||
{
|
||||
url: this.webUrl + '/引导页素材/首页引导/Group4/Group 4-3.png',
|
||||
style:{
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '117rpx',
|
||||
top: 213*2+'rpx',
|
||||
left: '610rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '46rpx',
|
||||
},
|
||||
isBtn: 'next'
|
||||
},
|
||||
]
|
||||
const index = menusUrl.indexOf(urls[4])
|
||||
this.toEle('box-item' + index, imgs)
|
||||
}
|
||||
return
|
||||
}
|
||||
if(this.functionGuideData.step == 5) {
|
||||
if(menusUrl.indexOf(urls[5]) < 0) {
|
||||
this.$refs.FunctionGuide.next()
|
||||
return
|
||||
}
|
||||
if(menusUrl.indexOf(urls[5]) > -1) {
|
||||
const imgs = [
|
||||
{
|
||||
url: this.webUrl + '/引导页素材/首页引导/Group5/Group 5-1.png',
|
||||
style:{
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '495rpx',
|
||||
top: '540rpx',
|
||||
left: '230rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '267rpx',
|
||||
},
|
||||
isBtn: false
|
||||
},
|
||||
{
|
||||
url: this.webUrl + '/引导页素材/首页引导/Group5/Group 5-2.png',
|
||||
style:{
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '117rpx',
|
||||
top: 265*2+'rpx',
|
||||
left: -120*2+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '46rpx',
|
||||
},
|
||||
isBtn: 'jump'
|
||||
},
|
||||
{
|
||||
url: this.webUrl + '/引导页素材/首页引导/Group5/Group 5-3.png',
|
||||
style:{
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '117rpx',
|
||||
top: 265*2+'rpx',
|
||||
left: 20*2+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '46rpx',
|
||||
},
|
||||
isBtn: 'next'
|
||||
},
|
||||
]
|
||||
const index = menusUrl.indexOf(urls[5])
|
||||
this.toEle('box-item' + index, imgs)
|
||||
}
|
||||
return
|
||||
}
|
||||
if(this.functionGuideData.step == 6) {
|
||||
if(menusUrl.indexOf(urls[6]) < 0) {
|
||||
this.$refs.FunctionGuide.next()
|
||||
return
|
||||
}
|
||||
if(menusUrl.indexOf(urls[6]) > -1) {
|
||||
const imgs = [
|
||||
{
|
||||
url: this.webUrl + '/引导页素材/首页引导/Group6/Group 6-1.png',
|
||||
style:{
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '534rpx',
|
||||
top: '140rpx',
|
||||
left: '230rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '280rpx',
|
||||
},
|
||||
isBtn: false
|
||||
},
|
||||
{
|
||||
url: this.webUrl + '/引导页素材/首页引导/Group6/Group 6-2.png',
|
||||
style:{
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '117rpx',
|
||||
top: 213*2+'rpx',
|
||||
left: -20*2+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '46rpx',
|
||||
},
|
||||
isBtn: 'jump'
|
||||
},
|
||||
{
|
||||
url: this.webUrl + '/引导页素材/首页引导/Group6/Group 6-3.png',
|
||||
style:{
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '117rpx',
|
||||
top: 213*2+'rpx',
|
||||
left: 140*2+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '46rpx',
|
||||
},
|
||||
isBtn: 'next'
|
||||
},
|
||||
]
|
||||
const index = menusUrl.indexOf(urls[6])
|
||||
this.toEle('box-item' + index, imgs)
|
||||
}
|
||||
return
|
||||
}
|
||||
// 7 商户， 8 招商
|
||||
if(this.functionGuideData.step == 7) {
|
||||
if(menusUrl.indexOf(urls[7]) < 0) {
|
||||
this.$refs.FunctionGuide.next()
|
||||
return
|
||||
}
|
||||
if(menusUrl.indexOf(urls[7]) > -1) {
|
||||
const imgs = [
|
||||
{
|
||||
url: this.webUrl + '/引导页素材/首页引导/Group13/Group 13-1.png',
|
||||
style:{
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: 291.5*2+'rpx',
|
||||
top: 280*2+'rpx',
|
||||
left: 10*2+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: 116.5*2+'rpx',
|
||||
},
|
||||
isBtn: false
|
||||
},
|
||||
{
|
||||
url: this.webUrl + '/引导页素材/首页引导/Group13/Group 13-2.png',
|
||||
style:{
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '117rpx',
|
||||
top: 213*2+'rpx',
|
||||
left: -280*2+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '46rpx',
|
||||
},
|
||||
isBtn: 'jump'
|
||||
},
|
||||
{
|
||||
url: this.webUrl + '/引导页素材/首页引导/Group13/Group 13-3.png',
|
||||
style:{
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '117rpx',
|
||||
top: 213*2+'rpx',
|
||||
left: -150*2+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '46rpx',
|
||||
},
|
||||
isBtn: 'next'
|
||||
},
|
||||
]
|
||||
const index = menusUrl.indexOf(urls[7])
|
||||
this.toEle('box-item' + index, imgs)
|
||||
}
|
||||
return
|
||||
}
|
||||
if(this.functionGuideData.step == 8) {
|
||||
if(menusUrl.indexOf(urls[8]) < 0) {
|
||||
this.$refs.FunctionGuide.next()
|
||||
return
|
||||
}
|
||||
if(menusUrl.indexOf(urls[8]) > -1) {
|
||||
const imgs = [
|
||||
{
|
||||
url: this.webUrl + '/引导页素材/首页引导/Group14/Group 14-1.png',
|
||||
style:{
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '539rpx',
|
||||
top: 80*2+'rpx',
|
||||
left: 100*2+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '265rpx',
|
||||
},
|
||||
isBtn: false
|
||||
},
|
||||
{
|
||||
url: this.webUrl + '/引导页素材/首页引导/Group14/Group 14-2.png',
|
||||
style:{
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '117rpx',
|
||||
top: 213*2+'rpx',
|
||||
left: 150*2+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '46rpx',
|
||||
},
|
||||
isBtn: 'next'
|
||||
},
|
||||
{
|
||||
url: this.webUrl + '/引导页素材/首页引导/Group14/Group 14-3.png',
|
||||
style:{
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '117rpx',
|
||||
top: 213*2+'rpx',
|
||||
left: 10*2+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '46rpx',
|
||||
},
|
||||
isBtn: 'jump'
|
||||
},
|
||||
]
|
||||
const index = menusUrl.indexOf(urls[8])
|
||||
this.toEle('box-item' + index, imgs)
|
||||
}
|
||||
return
|
||||
}
|
||||
if (this.functionGuideData.step == 10) {
|
||||
const imgs = [
|
||||
{
|
||||
url: this.webUrl + '/引导页素材/首页引导/Group7/Group 7-1.png',
|
||||
style:{
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '438rpx',
|
||||
top: 140*2+'rpx',
|
||||
left: -164*2+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '336rpx',
|
||||
},
|
||||
isBtn: false
|
||||
},
|
||||
{
|
||||
url: this.webUrl + '/引导页素材/首页引导/Group8/Group 8-2.png',
|
||||
style:{
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '129rpx',
|
||||
top: 285*2+'rpx',
|
||||
left: 0+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '46rpx',
|
||||
},
|
||||
isBtn: 'jump'
|
||||
},
|
||||
{
|
||||
url: this.webUrl + '/引导页素材/首页引导/Group8/Group 8-3.png',
|
||||
style:{
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '129rpx',
|
||||
top: 285*2+'rpx',
|
||||
left: 139 * 2+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '46rpx',
|
||||
},
|
||||
isBtn: 'next'
|
||||
},
|
||||
]
|
||||
this.toEle('dibiao', imgs)
|
||||
return
|
||||
}
|
||||
if (this.functionGuideData.step == 9) {
|
||||
const imgs = [
|
||||
{
|
||||
url: this.webUrl + '/引导页素材/首页引导/Group8/Group 8-1.png',
|
||||
style:{
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '574rpx',
|
||||
top: 170*2+'rpx',
|
||||
left: -0+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '238rpx',
|
||||
},
|
||||
isBtn: false
|
||||
},
|
||||
{
|
||||
url: this.webUrl + '/引导页素材/首页引导/Group8/Group 8-2.png',
|
||||
style:{
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '118rpx',
|
||||
top: 285*2+'rpx',
|
||||
left: -290*2+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '46rpx',
|
||||
},
|
||||
isBtn: 'jump'
|
||||
},
|
||||
{
|
||||
url: this.webUrl + '/引导页素材/首页引导/Group8/Group 8-3.png',
|
||||
style:{
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '118rpx',
|
||||
top: 285*2+'rpx',
|
||||
left: -(290-130)*2+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '46rpx',
|
||||
},
|
||||
isBtn: 'next'
|
||||
}
|
||||
]
|
||||
this.toEle('qianxian', imgs)
|
||||
return
|
||||
}
|
||||
if (this.functionGuideData.step == 11) {
|
||||
const imgs = [
|
||||
{
|
||||
url: this.webUrl + '/引导页素材/首页引导/Group9/Group 9-1.png',
|
||||
style:{
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '444rpx',
|
||||
top: 310*2+'rpx',
|
||||
left: 144*2+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '252rpx',
|
||||
},
|
||||
isBtn: false
|
||||
},
|
||||
{
|
||||
url: this.webUrl + '/引导页素材/首页引导/Group9/Group 9-2.png',
|
||||
style:{
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '118rpx',
|
||||
top: 435*2+'rpx',
|
||||
left: -235*2+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '46rpx',
|
||||
},
|
||||
isBtn: 'jump'
|
||||
},
|
||||
{
|
||||
url: this.webUrl + '/引导页素材/首页引导/Group9/Group 9-3.png',
|
||||
style:{
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '118rpx',
|
||||
top: 435*2+'rpx',
|
||||
left: -90*2+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '46rpx',
|
||||
},
|
||||
isBtn: 'next'
|
||||
}
|
||||
]
|
||||
this.toEle('xkd', imgs)
|
||||
return
|
||||
}
|
||||
if (this.functionGuideData.step == 12) {
|
||||
const imgs = [
|
||||
{
|
||||
url: this.webUrl + '/引导页素材/首页引导/Group11/Group 11-1.png',
|
||||
style:{
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '450rpx',
|
||||
top: 465*2+'rpx',
|
||||
left: 120*2+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '218rpx',
|
||||
},
|
||||
isBtn: false
|
||||
},
|
||||
{
|
||||
url: this.webUrl + '/引导页素材/首页引导/Group11/Group 11-2.png',
|
||||
style:{
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '118rpx',
|
||||
top: 575*2+'rpx',
|
||||
left: -210*2+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '46rpx',
|
||||
},
|
||||
isBtn: 'jump'
|
||||
},
|
||||
{
|
||||
url: this.webUrl + '/引导页素材/首页引导/Group11/Group 11-3.png',
|
||||
style:{
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '118rpx',
|
||||
top: 575*2+'rpx',
|
||||
left: -70*2+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '46rpx',
|
||||
},
|
||||
isBtn: 'next'
|
||||
}
|
||||
]
|
||||
this.toEle('xpsx', imgs)
|
||||
return
|
||||
}
|
||||
// top 140, buttom: 540
|
||||
if(this.functionGuideData.step == 13) {
|
||||
const imgs = [
|
||||
{
|
||||
url: this.webUrl + '/引导页素材/首页引导/Group10/Group 10-1.png',
|
||||
style:{
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '489rpx',
|
||||
top: 580*2+'rpx',
|
||||
left: 0+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '267rpx',
|
||||
},
|
||||
isBtn: false
|
||||
},
|
||||
{
|
||||
url: this.webUrl + '/引导页素材/首页引导/Group10/Group 10-2.png',
|
||||
style:{
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '118rpx',
|
||||
top: 555*2+'rpx',
|
||||
left: 0+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '46rpx',
|
||||
},
|
||||
isBtn: 'jump'
|
||||
},
|
||||
{
|
||||
url: this.webUrl + '/引导页素材/首页引导/Group10/Group 10-3.png',
|
||||
style:{
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '118rpx',
|
||||
top: 555*2+'rpx',
|
||||
left: 140*2+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '46rpx',
|
||||
},
|
||||
isBtn: 'next'
|
||||
}
|
||||
]
|
||||
this.$nextTick(() => {
|
||||
this.setFunctionGuideData({
|
||||
imgs: imgs,
|
||||
btnGroupPosition: '',
|
||||
tipsPosition: '',
|
||||
position: {
|
||||
bottom: '10px',
|
||||
left: this.tabIconPostion.left + 'px',
|
||||
width: `${this.tabIconPostion.width}px`,
|
||||
height: `${this.tabIconPostion.height}px`,
|
||||
}
|
||||
})
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
|
||||
if (this.functionGuideData.step == 14) {
|
||||
const imgs = [
|
||||
{
|
||||
url: this.webUrl + '/引导页素材/首页引导/Group12/Group 12-1.png',
|
||||
style:{
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '479rpx',
|
||||
top: 665*2+'rpx',
|
||||
left: 40*2+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '180rpx',
|
||||
},
|
||||
isBtn: false
|
||||
},
|
||||
{
|
||||
url: this.webUrl + '/引导页素材/首页引导/Group12/Group 12-2.png',
|
||||
style:{
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '118rpx',
|
||||
top: 750*2+'rpx',
|
||||
left: 40*2+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '46rpx',
|
||||
},
|
||||
isBtn: 'next'
|
||||
}
|
||||
]
|
||||
this.setFunctionGuideData({
|
||||
imgs: imgs,
|
||||
btnGroupPosition: '',
|
||||
tipsPosition: '',
|
||||
position: {
|
||||
bottom: 10 + 'px',
|
||||
left: this.messageIcon.left + 'px',
|
||||
width: `${this.messageIcon.width}px`,
|
||||
height: `${this.messageIcon.height}px`,
|
||||
}
|
||||
})
|
||||
return
|
||||
}
|
||||
|
||||
|
||||
}
|
||||
},
|
||||
toEle(id, imgs) {
|
||||
this.getElementData(`#${id}`, res=>{
|
||||
if(res.left + res.width / 2 > this.screenWidth) {
|
||||
|
||||
File diff suppressed because it is too large
Load Diff
@@ -1,454 +0,0 @@
|
||||
<template>
|
||||
<view class="pkg-product-land-mark" v-if="mapData">
|
||||
<view class="top-box" :style="{'backgroundColor':topBoxBgColor}">
|
||||
<view class="view-box">
|
||||
<view class="search-box flex ai-center">
|
||||
<input
|
||||
v-model="keyword"
|
||||
type="text"
|
||||
placeholder="搜索商品"
|
||||
placeholder-style="color:#999"
|
||||
@confirm="search()"
|
||||
/>
|
||||
<image
|
||||
:src="webUrl+'/20231223183627184005.png'"
|
||||
mode="scaleToFill"
|
||||
style="width:30rpx;height:30rpx"
|
||||
@click="search()"
|
||||
/>
|
||||
</view>
|
||||
|
||||
<view class="map-box">
|
||||
<image class="img-map" :src="mapData.mapImage" mode="widthFix"/>
|
||||
|
||||
<view
|
||||
v-for="(item, index) in mapLocations"
|
||||
:key="index"
|
||||
class="item"
|
||||
:style="{'left':item.gx+'rpx','top':item.gy+'rpx'}"
|
||||
@click="goGoods(item.productId)"
|
||||
>
|
||||
<view class="round">
|
||||
<view class="line" :class="'line-'+directionClass[item.labelDirection]"></view>
|
||||
</view>
|
||||
<view class="label flex ai-end" :class="'label-'+directionClass[item.labelDirection]">
|
||||
<image class="cover flex-0" :src="item.mapImage" mode="scaleToFill" v-if="item.labelDirection===4"/>
|
||||
<view class="title flex ai-center">{{ item.mapTitle }}</view>
|
||||
<image class="cover flex-0" :src="item.mapImage" mode="scaleToFill" v-if="item.labelDirection!==4"/>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="nav flex">
|
||||
<view class="flex flex-0 ai-center" :class="{'active': navIndex===index}" v-for="(item,index) in navList"
|
||||
:key="index" @click="changeNav(index)">{{ item.provinceName }}
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="main-box" v-if="mapData.recommended.storeImage"
|
||||
@click="goGoods(mapData.recommended.productId)">
|
||||
<image class="bg-main" :src="mapData.recommended.storeImage" mode="scaleToFill"/>
|
||||
<view class="box-mask flex flex-col jc-end">
|
||||
<view class="one-t bold">{{ mapData.recommended.title }}</view>
|
||||
<view class="more-t">{{ mapData.recommended.description }}</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<view class="list-box flex flex-wrap">
|
||||
<view class="item" v-for="item in goods" :key="item.id" @click="goGoods(item.productId)">
|
||||
<image :src="item.storeImage" mode="scaleToFill"/>
|
||||
<view class="content flex flex-col jc-between">
|
||||
<view class="more-t bold">{{ item.title }}</view>
|
||||
<view class="flex jc-between ai-center">
|
||||
<text class="price">￥{{ item.price }}</text>
|
||||
<image class="btn" :src="webUrl+'/20231114151028082368.png'" mode="scaleToFill"/>
|
||||
<!-- <view class="btn flex jc-center ai-center">立即购买</view>-->
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
</view>
|
||||
|
||||
<image class="img-nodata" :src="webUrl+'/20231023131208675588.png'" mode="scaleToFill"
|
||||
v-if="goods.length===0"/>
|
||||
</view>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import {getProvince, getProvinceGoods, getProvinceList} from "@/api/product";
|
||||
import { pageListenMixins } from '@/mixins/pageListenMixins'
|
||||
|
||||
export default {
|
||||
name: 'LandMarkPage',
|
||||
mixins: [pageListenMixins],
|
||||
data() {
|
||||
return {
|
||||
webUrl: this.$VUE_APP_RESOURCES_URL,
|
||||
keyword: '',
|
||||
page: 1,
|
||||
navList: [],
|
||||
navIndex: 0,
|
||||
mapData: null,
|
||||
mapLocations: [],
|
||||
goods: [],
|
||||
directionClass: ['', 'up', 'right', 'down', 'left'],
|
||||
pageKeyId: Object.freeze('landmarkGoodsIndex')
|
||||
}
|
||||
},
|
||||
computed: {
|
||||
topBoxBgColor() {
|
||||
return this.navList.length > 0 ? this.navList[this.navIndex]['backgroundColor'] : '#FFFFFF';
|
||||
},
|
||||
viewBoxBgColor() {
|
||||
return this.mapData?.backgroundColor || '#FFFFFF';
|
||||
},
|
||||
scale() {
|
||||
return 718 / (this.mapData?.mapImageWidth || 1);
|
||||
}
|
||||
},
|
||||
onLoad() {
|
||||
this.getNavList();
|
||||
},
|
||||
onHide() {
|
||||
this.pageToHideHandle()
|
||||
},
|
||||
onReachBottom() {
|
||||
this.page++;
|
||||
this.fetchGoods();
|
||||
},
|
||||
methods: {
|
||||
getNavList() {
|
||||
getProvinceList().then(({data}) => {
|
||||
this.navList = data;
|
||||
this.changeNav(this.navIndex);
|
||||
});
|
||||
},
|
||||
|
||||
search() {
|
||||
this.page = 1;
|
||||
this.fetchGoods();
|
||||
},
|
||||
|
||||
changeNav(index) {
|
||||
this.navIndex = index;
|
||||
this.page = 1;
|
||||
this.getMap();
|
||||
this.fetchGoods();
|
||||
},
|
||||
|
||||
getMap() {
|
||||
const id = this.navList[this.navIndex]['id']
|
||||
getProvince(id).then(({data}) => {
|
||||
this.mapData = data;
|
||||
this.mapLocations = data.mapLocations;
|
||||
this.calcPosition();
|
||||
});
|
||||
},
|
||||
|
||||
// 计算位置
|
||||
calcPosition() {
|
||||
this.mapLocations?.forEach(item => {
|
||||
item.gx = item.x * this.scale;
|
||||
item.gy = item.y * this.scale;
|
||||
})
|
||||
},
|
||||
|
||||
fetchGoods() {
|
||||
const id = this.navList[this.navIndex]['id']
|
||||
getProvinceGoods(id, this.keyword, this.page).then(({data}) => {
|
||||
if (this.page === 1) this.goods = [];
|
||||
for (let i = 0; i < data.length; i++) {
|
||||
this.goods.push(data[i]);
|
||||
}
|
||||
})
|
||||
},
|
||||
goGoods(id) {
|
||||
uni.navigateTo({
|
||||
url: `/pages/shop/GoodsCon/index?id=${id}&from=landmark`
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped lang="less">
|
||||
.pkg-product-land-mark {
|
||||
background: #F7F3ED;
|
||||
|
||||
image {
|
||||
vertical-align: middle;
|
||||
}
|
||||
|
||||
.top-box {
|
||||
padding: 32rpx 0 20rpx;
|
||||
|
||||
.view-box {
|
||||
position: relative;
|
||||
margin: 0 16rpx;
|
||||
border-radius: 40rpx;
|
||||
overflow: hidden;
|
||||
|
||||
.search-box {
|
||||
position: absolute;
|
||||
top: 20rpx;
|
||||
left: 34rpx;
|
||||
width: 650rpx;
|
||||
height: 64rpx;
|
||||
padding: 0 32rpx;
|
||||
box-sizing: border-box;
|
||||
border-radius: 32rpx;
|
||||
background: #FFFFFF;
|
||||
z-index: 10;
|
||||
|
||||
input {
|
||||
width: 100%;
|
||||
height: 100%;
|
||||
line-height: 64rpx;
|
||||
font-size: 28rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.map-box {
|
||||
position: relative;
|
||||
width: 718rpx;
|
||||
|
||||
.img-map {
|
||||
width: 718rpx;
|
||||
height: auto;
|
||||
}
|
||||
|
||||
.item {
|
||||
position: absolute;
|
||||
|
||||
.round {
|
||||
width: 8rpx;
|
||||
height: 8rpx;
|
||||
border-radius: 50%;
|
||||
box-shadow: 0 0 0 8rpx rgba(225, 38, 65, .4);;
|
||||
background: #E12641;
|
||||
}
|
||||
|
||||
.line {
|
||||
position: relative;
|
||||
border: 2rpx solid #E12641;
|
||||
}
|
||||
|
||||
.line-up {
|
||||
left: 50%;
|
||||
transform: translate(-50%, -100%);
|
||||
width: 0;
|
||||
height: 30rpx;
|
||||
}
|
||||
|
||||
.line-right {
|
||||
top: 50%;
|
||||
transform: translate(0, -50%);
|
||||
width: 30rpx;
|
||||
height: 0;
|
||||
}
|
||||
|
||||
.line-down {
|
||||
left: 50%;
|
||||
transform: translate(-50%, 0);
|
||||
width: 0;
|
||||
height: 30rpx;
|
||||
}
|
||||
|
||||
.line-left {
|
||||
top: 50%;
|
||||
transform: translate(-100%, -50%);
|
||||
width: 30rpx;
|
||||
height: 0;
|
||||
}
|
||||
|
||||
.label {
|
||||
position: relative;
|
||||
|
||||
.cover {
|
||||
width: 60rpx;
|
||||
height: 60rpx;
|
||||
box-sizing: border-box;
|
||||
border: 6rpx solid #E12641;
|
||||
border-radius: 50%;
|
||||
z-index: 20;
|
||||
}
|
||||
|
||||
.title {
|
||||
height: 32rpx;
|
||||
box-sizing: border-box;
|
||||
margin-bottom: 10rpx;
|
||||
padding: 0 16rpx;
|
||||
background: #E12641;
|
||||
color: #FFFFFF;
|
||||
font-size: 22rpx;
|
||||
line-height: 32rpx;
|
||||
white-space: nowrap;
|
||||
z-index: 10;
|
||||
}
|
||||
}
|
||||
|
||||
.label-up {
|
||||
top: -80rpx;
|
||||
left: -50%;
|
||||
|
||||
.title {
|
||||
margin-right: -9rpx;
|
||||
border-radius: 20rpx 0 0 20rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.label-right {
|
||||
top: -40rpx;
|
||||
left: 32rpx;
|
||||
|
||||
.title {
|
||||
margin-right: -9rpx;
|
||||
border-radius: 20rpx 0 0 20rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.label-down {
|
||||
left: -50%;
|
||||
|
||||
.title {
|
||||
margin-right: -9rpx;
|
||||
border-radius: 20rpx 0 0 20rpx;
|
||||
}
|
||||
}
|
||||
|
||||
.label-left {
|
||||
left: -100%;
|
||||
transform: translate(-30rpx, -40rpx);
|
||||
|
||||
.title {
|
||||
margin-left: -9rpx;
|
||||
border-radius: 0 20rpx 20rpx 0;
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.nav {
|
||||
padding: 30rpx 20rpx 0;
|
||||
overflow-x: scroll;
|
||||
|
||||
view {
|
||||
height: 52rpx;
|
||||
box-sizing: border-box;
|
||||
padding: 0 18rpx;
|
||||
border: 4rpx solid transparent;
|
||||
color: #FFFFFF;
|
||||
font-size: 32rpx;
|
||||
}
|
||||
|
||||
.active {
|
||||
border-color: #FFFFFF;
|
||||
border-radius: 26rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.main-box {
|
||||
position: relative;
|
||||
width: 718rpx;
|
||||
height: 360rpx;
|
||||
margin: 24rpx 16rpx;
|
||||
border-radius: 16rpx;
|
||||
overflow: hidden;
|
||||
|
||||
.bg-main {
|
||||
width: 718rpx;
|
||||
height: 360rpx;
|
||||
}
|
||||
|
||||
.box-mask {
|
||||
position: absolute;
|
||||
left: 0;
|
||||
bottom: 0;
|
||||
width: 100%;
|
||||
height: 200rpx;
|
||||
box-sizing: border-box;
|
||||
padding: 20rpx 16rpx 16rpx;
|
||||
background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000000 100%);
|
||||
color: #FFFFFF;
|
||||
|
||||
.one-t {
|
||||
margin-bottom: 16rpx;
|
||||
font-size: 46rpx;
|
||||
line-height: 52rpx;
|
||||
}
|
||||
|
||||
.more-t {
|
||||
width: 100%;
|
||||
box-sizing: border-box;
|
||||
padding-top: 10rpx;
|
||||
border-top: 1rpx solid #FFFFFF;
|
||||
font-size: 28rpx;
|
||||
line-height: 32rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.list-box {
|
||||
margin-top: 24rpx;
|
||||
padding: 0 16rpx 34rpx;
|
||||
|
||||
.item {
|
||||
width: 234rpx;
|
||||
height: 380rpx;
|
||||
margin-right: 8rpx;
|
||||
margin-bottom: 24rpx;
|
||||
border-radius: 12rpx;
|
||||
background: #FFFFFF;
|
||||
overflow: hidden;
|
||||
|
||||
image {
|
||||
width: 234rpx;
|
||||
height: 234rpx;
|
||||
}
|
||||
|
||||
.content {
|
||||
height: 122rpx;
|
||||
margin: 6rpx 6rpx 18rpx;
|
||||
|
||||
.more-t {
|
||||
font-size: 28rpx;
|
||||
line-height: 36rpx;
|
||||
color: #333333;
|
||||
}
|
||||
|
||||
.price {
|
||||
font-size: 28rpx;
|
||||
line-height: 36rpx;
|
||||
color: #DC1616;
|
||||
}
|
||||
|
||||
.btn {
|
||||
width: 118rpx;
|
||||
height: 42rpx;
|
||||
//background: linear-gradient(180deg, #EFEDC7 0%, #EAC94B 100%);
|
||||
//border-radius: 4rpx;
|
||||
//color: #764A00;
|
||||
//font-size: 24rpx;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.item:nth-child(3n) {
|
||||
margin-right: 0;
|
||||
}
|
||||
}
|
||||
|
||||
.img-nodata {
|
||||
position: relative;
|
||||
top: 0;
|
||||
left: 50%;
|
||||
transform: translate(-50%, 0);
|
||||
width: 352rpx;
|
||||
height: 338rpx;
|
||||
margin-bottom: 60rpx;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
Reference in New Issue
Block a user