liangxin/xdd-uniapp-new
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Task：指引页/ 图片定位完成

Browse Source
This commit is contained in:
linxi
2025-01-18 16:45:06 +08:00
parent ec33f6f4c0
commit 85854ea2f6
9 changed files with 880 additions and 48 deletions
Download Patch File Download Diff File Expand all files Collapse all files
pkg_product/views/famousList.vue
+134 -5
View File
@@ -25,7 +25,7 @@
class="img"
mode="widthFix"
/>
<view v-if="list.length > 0" class="province-wrap">
<view v-if="list.length > 0" class="province-wrap" id="province-wrap">
<view
:class="toggleStatus ? 'isopen' : ''"
class="list"
@@ -85,7 +85,7 @@
{{ item.intro }}
</view>
<view class="pic-wrap">
<view v-if="item.countyTotal < 7" class="one-list">
<view v-if="item.countyTotal < 7" class="one-list" :id="'more-list-wrap' + index">
<view
v-for="(county) in item.county"
:key="county.id"
@@ -107,7 +107,7 @@
</view>
</view>
</view>
<view v-else class="more-list-wrap">
<view v-else class="more-list-wrap" :id="'more-list-wrap' + index">
<view class="more-list">
<view
v-for="(county) in item.oddList"
@@ -174,6 +174,7 @@
:show-avatar="false"
/>
</view>
<FunctionGuide :maxStep="2" :guideData="functionGuideData" ref="FunctionGuide"></FunctionGuide>
</view>
</template>
@@ -188,10 +189,14 @@ import cookie from '@/utils/store/cookie'
import { userBindParent } from '@/api/user'
import { getUrlParam } from '@/utils/common.js'
import { pageListenMixins } from '@/mixins/pageListenMixins'
import FunctionGuide from '@/components/FunctionGuide'
import GuideMixins from '@/mixins/GuideMixins'
export default {
name: 'FamousList',
mixins: [pageListenMixins],
components: {
FunctionGuide
},
mixins: [pageListenMixins, GuideMixins],
data() {
return {
webUrl: this.$VUE_APP_RESOURCES_URL,
@@ -231,6 +236,130 @@ export default {
this.init()
},
methods: {
showFunctionGuide() {
if(this._step == this.functionGuideData.step) return
if(this.functionGuideData.step == 1) {
this._step = this.functionGuideData.step
this.getElementData('#province-wrap', res=>{
const imgs = [
{
url: this.webUrl + '/引导页素材/千县名品/Group 1/Group 1-1.png',
style: {
position: 'absolute',
zIndex: 99,
width: '406rpx',
top: 280*2+'rpx',
left: 75*2+'rpx',
height: '218rpx',
/* px: ; */
},
isBtn: false
},
{
url: this.webUrl + '/引导页素材/千县名品/Group 1/Group 1-2.png',
style: {
position: 'absolute',
zIndex: 99,
width: '117rpx',
top: 390*2+'rpx',
left: -140*2+'rpx',
right: 0,
margin: 'auto',
height: '46rpx',
},
isBtn: 'jump'
},
{
url: this.webUrl + '/引导页素材/千县名品/Group 1/Group 1-3.png',
style: {
position: 'absolute',
zIndex: 99,
width: '117rpx',
top: 390*2+'rpx',
left: 180*2+'rpx',
height: '46rpx',
},
isBtn: 'next'
},
]
this.setFunctionGuideData({
imgs: imgs,
tipsPosition: '420rpx',
btnGroupPosition: '',
position: {
top: res.top*2 + 'rpx',
left: res.left*2 + 'rpx',
width: `${res.width*2}rpx`,
height: `${res.height*2}rpx`,
}
})
})
return
} else {
// more-list-wrap
if(this.functionGuideData.step == 2) {
this._step = this.functionGuideData.step
this.getElementData('#more-list-wrap0', res=>{
const imgs = [
{
url: this.webUrl + '/引导页素材/千县名品/Group 2/Group 2-1.png',
style: {
position: 'absolute',
zIndex: 99,
width: '406rpx',
top: 280*2+'rpx',
left: 75*2+'rpx',
height: '218rpx',
/* px: ; */
},
isBtn: false
},
{
url: this.webUrl + '/引导页素材/千县名品/Group 2/Group 2-2.png',
style: {
position: 'absolute',
zIndex: 99,
width: '117rpx',
top: 250*2+'rpx',
left: -40*2+'rpx',
right: 0,
margin: 'auto',
height: '46rpx',
},
isBtn: 'jump'
},
{
url: this.webUrl + '/引导页素材/千县名品/Group 2/Group 2-3.png',
style: {
position: 'absolute',
zIndex: 99,
width: '117rpx',
top: 250*2+'rpx',
left: 210*2+'rpx',
height: '46rpx',
},
isBtn: 'next'
},
]
this.setFunctionGuideData({
imgs: imgs,
tipsPosition: '420rpx',
btnGroupPosition: '',
position: {
top: res.top*2 + 'rpx',
left: res.left*2 + 'rpx',
width: `${res.width*2}rpx`,
height: `${res.height*2}rpx`,
}
})
})
return
}
return
}
},
handlerSearch() {
if(this.keyword) {
this.searchEvent = true