|
@@ -23,9 +23,7 @@
|
|
|
:key="item.id"
|
|
|
:class="`HD1_3 HD1_3_${index + 1} ${
|
|
|
pageLev === item.id ? 'HD1_3Ac' : ''
|
|
|
- } ${pageShow && pageLev > item.id ? 'HD1_3HideLeft' : ''} ${
|
|
|
- pageShow && pageLev < item.id ? 'HD1_3HideRight' : ''
|
|
|
- } ${pageShow ? 'HD1_3AcBottom' : ''}
|
|
|
+ } ${imgBottomLoc(pageLev,item.id)} ${pageShow ? 'HD1_3AcBottom' : ''}
|
|
|
`"
|
|
|
@click="ImgClick(item)"
|
|
|
>
|
|
@@ -158,23 +156,25 @@ const swChange = ref(true)
|
|
|
|
|
|
// 左滑右滑
|
|
|
const onSwipeChange = (num, index) => {
|
|
|
+ isShowOperationTip.value = false
|
|
|
+ let newItem = imgList[index + num]
|
|
|
|
|
|
if (index === 0 && num === -1) {
|
|
|
// 第一 还向左滑
|
|
|
- // newItem = imgList[imgList.length - 1]
|
|
|
- txtTit.value = true
|
|
|
- setTimeout(() => {
|
|
|
- txtTit.value = false
|
|
|
- }, 1000)
|
|
|
- return
|
|
|
+ newItem = imgList[imgList.length - 1]
|
|
|
+ // txtTit.value = true
|
|
|
+ // setTimeout(() => {
|
|
|
+ // txtTit.value = false
|
|
|
+ // }, 1000)
|
|
|
+ // return
|
|
|
}
|
|
|
if (index === imgList.length - 1 && num === 1) {
|
|
|
- // newItem = imgList[0]
|
|
|
- txtTit.value = true
|
|
|
- setTimeout(() => {
|
|
|
- txtTit.value = false
|
|
|
- }, 1000)
|
|
|
- return
|
|
|
+ newItem = imgList[0]
|
|
|
+ // txtTit.value = true
|
|
|
+ // setTimeout(() => {
|
|
|
+ // txtTit.value = false
|
|
|
+ // }, 1000)
|
|
|
+ // return
|
|
|
}
|
|
|
|
|
|
if (swChange.value) {
|
|
@@ -184,7 +184,7 @@ const onSwipeChange = (num, index) => {
|
|
|
}, 600)
|
|
|
}
|
|
|
|
|
|
- let newItem = imgList[index + num]
|
|
|
+
|
|
|
|
|
|
pageLev.value = newItem.id
|
|
|
|
|
@@ -195,6 +195,32 @@ const onSwipeChange = (num, index) => {
|
|
|
}
|
|
|
}, 500)
|
|
|
}
|
|
|
+
|
|
|
+// 判断画轴的位置 在 左边还是右边
|
|
|
+const imgBottomLoc = (nowId, itemId)=>{
|
|
|
+ // nowId:当前id
|
|
|
+ // itemId 11 12 13
|
|
|
+ // nowId 11的时候 itemId 12在右边 itemId 13在左边
|
|
|
+ // nowId 12的时候 itemId 11在左边 itemId 13在右边
|
|
|
+ // nowId 13的时候 itemId 11在右边 itemId 12在左边
|
|
|
+ const obj = {
|
|
|
+ 11: {
|
|
|
+ 12: 'HD1_3HideRight',
|
|
|
+ 13: 'HD1_3HideLeft'
|
|
|
+ },
|
|
|
+ 12: {
|
|
|
+ 13: 'HD1_3HideRight',
|
|
|
+ 11: 'HD1_3HideLeft'
|
|
|
+ },
|
|
|
+ 13: {
|
|
|
+ 11: 'HD1_3HideRight',
|
|
|
+ 12: 'HD1_3HideLeft'
|
|
|
+ },
|
|
|
+ }
|
|
|
+ return pageShow.value ? obj[nowId][itemId] : ''
|
|
|
+
|
|
|
+}
|
|
|
+
|
|
|
</script>
|
|
|
|
|
|
<style lang="less" scoped>
|
|
@@ -206,6 +232,7 @@ const onSwipeChange = (num, index) => {
|
|
|
height: 100%;
|
|
|
background-image: url("../assets/images/HD1/bg_caizhi.jpg");
|
|
|
background-size: 100% 100%;
|
|
|
+ background-color: #b6bfb3;
|
|
|
transition: all 1s;
|
|
|
.btn-back {
|
|
|
z-index: 20;
|