Task:指引功能
This commit is contained in:
+109
-58
@@ -452,9 +452,9 @@ export default {
|
||||
onscroll(e) {
|
||||
this.scrollViewWidth = e.detail.scrollWidth
|
||||
const imgs = []
|
||||
this.getElementData(`#${scrollView}`, res=>{
|
||||
this.getElementData(`#${this.scrollView}`, res=>{
|
||||
this.setFunctionGuideData({
|
||||
imgs: imgs,
|
||||
imgs: this.imgs,
|
||||
btnGroupPosition: '20rpx',
|
||||
tipsPosition: '',
|
||||
position: {
|
||||
@@ -663,7 +663,7 @@ export default {
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '578rpx',
|
||||
top: '140rpx',
|
||||
top: '180rpx',
|
||||
left: '150rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
@@ -823,7 +823,7 @@ export default {
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '438rpx',
|
||||
top: 170*2+'rpx',
|
||||
top: 140*2+'rpx',
|
||||
left: -164*2+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
@@ -858,7 +858,7 @@ export default {
|
||||
zIndex: 99,
|
||||
width: '574rpx',
|
||||
top: 170*2+'rpx',
|
||||
left: -164*2+'rpx',
|
||||
left: -0+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '238rpx',
|
||||
@@ -872,7 +872,7 @@ export default {
|
||||
zIndex: 99,
|
||||
width: '118rpx',
|
||||
top: 315*2+'rpx',
|
||||
left: 0+'rpx',
|
||||
left: -290*2+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '46rpx',
|
||||
@@ -886,7 +886,7 @@ export default {
|
||||
zIndex: 99,
|
||||
width: '118rpx',
|
||||
top: 315*2+'rpx',
|
||||
left: 140*2+'rpx',
|
||||
left: -(290-130)*2+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '46rpx',
|
||||
@@ -904,12 +904,12 @@ export default {
|
||||
style:{
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '574rpx',
|
||||
top: 170*2+'rpx',
|
||||
left: -164*2+'rpx',
|
||||
width: '444rpx',
|
||||
top: 310*2+'rpx',
|
||||
left: 144*2+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '238rpx',
|
||||
height: '252rpx',
|
||||
},
|
||||
isBtn: false
|
||||
},
|
||||
@@ -919,8 +919,8 @@ export default {
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '118rpx',
|
||||
top: 315*2+'rpx',
|
||||
left: 0+'rpx',
|
||||
top: 435*2+'rpx',
|
||||
left: -235*2+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '46rpx',
|
||||
@@ -933,8 +933,8 @@ export default {
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '118rpx',
|
||||
top: 315*2+'rpx',
|
||||
left: 140*2+'rpx',
|
||||
top: 435*2+'rpx',
|
||||
left: -90*2+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '46rpx',
|
||||
@@ -953,12 +953,12 @@ export default {
|
||||
style:{
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '574rpx',
|
||||
top: 170*2+'rpx',
|
||||
left: -164*2+'rpx',
|
||||
width: '489rpx',
|
||||
top: 580*2+'rpx',
|
||||
left: 0+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '238rpx',
|
||||
height: '267rpx',
|
||||
},
|
||||
isBtn: false
|
||||
},
|
||||
@@ -968,7 +968,7 @@ export default {
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '118rpx',
|
||||
top: 315*2+'rpx',
|
||||
top: 555*2+'rpx',
|
||||
left: 0+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
@@ -982,7 +982,7 @@ export default {
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '118rpx',
|
||||
top: 315*2+'rpx',
|
||||
top: 555*2+'rpx',
|
||||
left: 140*2+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
@@ -1011,12 +1011,12 @@ export default {
|
||||
style:{
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '574rpx',
|
||||
top: 170*2+'rpx',
|
||||
left: -164*2+'rpx',
|
||||
width: '450rpx',
|
||||
top: 465*2+'rpx',
|
||||
left: 120*2+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '238rpx',
|
||||
height: '218rpx',
|
||||
},
|
||||
isBtn: false
|
||||
},
|
||||
@@ -1026,8 +1026,8 @@ export default {
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '118rpx',
|
||||
top: 315*2+'rpx',
|
||||
left: 0+'rpx',
|
||||
top: 575*2+'rpx',
|
||||
left: -210*2+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '46rpx',
|
||||
@@ -1040,8 +1040,8 @@ export default {
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '118rpx',
|
||||
top: 315*2+'rpx',
|
||||
left: 140*2+'rpx',
|
||||
top: 575*2+'rpx',
|
||||
left: -70*2+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '46rpx',
|
||||
@@ -1060,12 +1060,12 @@ export default {
|
||||
style:{
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '574rpx',
|
||||
top: 170*2+'rpx',
|
||||
left: -164*2+'rpx',
|
||||
width: '479rpx',
|
||||
top: 665*2+'rpx',
|
||||
left: 40*2+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '238rpx',
|
||||
height: '180rpx',
|
||||
},
|
||||
isBtn: false
|
||||
},
|
||||
@@ -1075,22 +1075,8 @@ export default {
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '118rpx',
|
||||
top: 315*2+'rpx',
|
||||
left: 0+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '46rpx',
|
||||
},
|
||||
isBtn: 'jump'
|
||||
},
|
||||
{
|
||||
url: this.webUrl + '/引导页素材/首页引导/Group12/Group 12-3.png',
|
||||
style:{
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '118rpx',
|
||||
top: 315*2+'rpx',
|
||||
left: 140*2+'rpx',
|
||||
top: 750*2+'rpx',
|
||||
left: 40*2+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '46rpx',
|
||||
@@ -1098,7 +1084,17 @@ export default {
|
||||
isBtn: 'next'
|
||||
}
|
||||
]
|
||||
this.toEle('xpsx', imgs)
|
||||
this.setFunctionGuideData({
|
||||
imgs: imgs,
|
||||
btnGroupPosition: '',
|
||||
tipsPosition: '',
|
||||
position: {
|
||||
top: this.messageIcon.top + 'px',
|
||||
left: this.messageIcon.left + 'px',
|
||||
width: `${this.messageIcon.width}px`,
|
||||
height: `${this.messageIcon.height}px`,
|
||||
}
|
||||
})
|
||||
return
|
||||
}
|
||||
if(this.functionGuideData.step == 13) {
|
||||
@@ -1113,12 +1109,12 @@ export default {
|
||||
style:{
|
||||
position: 'absolute',
|
||||
zIndex: 99,
|
||||
width: '534rpx',
|
||||
top: '140rpx',
|
||||
left: '230rpx',
|
||||
width: 291.5*2+'rpx',
|
||||
top: 280*2+'rpx',
|
||||
left: 10*2+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '280rpx',
|
||||
height: 116.5*2+'rpx',
|
||||
},
|
||||
isBtn: false
|
||||
},
|
||||
@@ -1129,7 +1125,7 @@ export default {
|
||||
zIndex: 99,
|
||||
width: '117rpx',
|
||||
top: 213*2+'rpx',
|
||||
left: -20*2+'rpx',
|
||||
left: -280*2+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '46rpx',
|
||||
@@ -1143,7 +1139,7 @@ export default {
|
||||
zIndex: 99,
|
||||
width: '117rpx',
|
||||
top: 213*2+'rpx',
|
||||
left: 140*2+'rpx',
|
||||
left: -150*2+'rpx',
|
||||
right: 0,
|
||||
margin: 'auto',
|
||||
height: '46rpx',
|
||||
@@ -1156,7 +1152,61 @@ export default {
|
||||
}
|
||||
return
|
||||
}
|
||||
|
||||
if(this.functionGuideData.step == 14) {
|
||||
if(menusUrl.indexOf(urls[14]) < 0) {
|
||||
this.$refs.FunctionGuide.next()
|
||||
return
|
||||
}
|
||||
if(menusUrl.indexOf(urls[14]) > -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: 'jump'
|
||||
},
|
||||
{
|
||||
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: 'next'
|
||||
},
|
||||
]
|
||||
const index = menusUrl.indexOf(urls[14])
|
||||
this.toEle('box-item' + index, imgs)
|
||||
}
|
||||
return
|
||||
}
|
||||
|
||||
}
|
||||
},
|
||||
@@ -1165,6 +1215,7 @@ export default {
|
||||
if(res.left + res.width / 2 > this.screenWidth) {
|
||||
this.$nextTick(()=> {
|
||||
this.scrollView = id
|
||||
this.imgs = imgs
|
||||
})
|
||||
return
|
||||
}
|
||||
@@ -1548,7 +1599,7 @@ export default {
|
||||
position: absolute;
|
||||
top: 0;
|
||||
left: -21rpx;
|
||||
z-index: 2;
|
||||
z-index: -1;
|
||||
width: calc(100% + 40rpx);
|
||||
height: 180rpx;
|
||||
background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, #F0F0F0 40%, #F0F0F0 100%);
|
||||
|
||||
Reference in New Issue
Block a user