| <img class="mask1_1" src="../../assets/vehicle/maskCompliance.jpg" alt=""> | <img class="mask1_1" src="../../assets/vehicle/maskCompliance.jpg" alt=""> | ||||
| <img @click="showMask=false" class="dele" src="../../assets/vehicle/dele.png" alt=""> | <img @click="showMask=false" class="dele" src="../../assets/vehicle/dele.png" alt=""> | ||||
| </div> | </div> | ||||
| <Sidebar></Sidebar> | |||||
| <Sidebar class="slide"></Sidebar> | |||||
| </div> | </div> | ||||
| </template> | </template> | ||||
| </script> | </script> | ||||
| <style scoped="scoped"> | <style scoped="scoped"> | ||||
| .slide{ | |||||
| position: fixed; | |||||
| top: 0.3rem; | |||||
| left: 0.3rem; | |||||
| } | |||||
| *{ | *{ | ||||
| padding: 0; | padding: 0; | ||||
| margin: 0; | margin: 0; |
| <div class="all"> | <div class="all"> | ||||
| <img class="imgBg" src="../../assets/vehicle/detailsBg1.jpg" alt=""> | <img class="imgBg" src="../../assets/vehicle/detailsBg1.jpg" alt=""> | ||||
| <img class="contImg" src="../../assets/vehicle/allDetails1.png" alt=""> | <img class="contImg" src="../../assets/vehicle/allDetails1.png" alt=""> | ||||
| <Sidebar></Sidebar> | |||||
| <Sidebar class="slide"></Sidebar> | |||||
| </div> | </div> | ||||
| </template> | </template> | ||||
| <script> | <script> | ||||
| } | } | ||||
| </script> | </script> | ||||
| <style scoped="scoped"> | <style scoped="scoped"> | ||||
| .slide{ | |||||
| position: fixed; | |||||
| top: 0.3rem; | |||||
| left: 0.3rem; | |||||
| } | |||||
| .imgBg{ | .imgBg{ | ||||
| width: 100%; | width: 100%; | ||||
| height: 24.91rem; | height: 24.91rem; |
| <img @click="showMask=false" class="dele" src="../../assets/vehicle/dele.png" alt=""> | <img @click="showMask=false" class="dele" src="../../assets/vehicle/dele.png" alt=""> | ||||
| </div> | </div> | ||||
| <Sidebar></Sidebar> | |||||
| <Sidebar class="slide"></Sidebar> | |||||
| </div> | </div> | ||||
| </template> | </template> | ||||
| </script> | </script> | ||||
| <style scoped="scoped"> | <style scoped="scoped"> | ||||
| .slide{ | |||||
| position: fixed; | |||||
| top: 0.3rem; | |||||
| left: 0.3rem; | |||||
| } | |||||
| *{ | *{ | ||||
| padding: 0; | padding: 0; | ||||
| margin: 0; | margin: 0; |
| <template> | <template> | ||||
| <div class="all"> | |||||
| <div class="all" ref="contentAll"> | |||||
| <!-- <img class="showBg" src="../../assets/vehicle/showBg.jpg" alt=""> --> | <!-- <img class="showBg" src="../../assets/vehicle/showBg.jpg" alt=""> --> | ||||
| <img class="imgBg" src="../../assets/vehicle/imgBg.jpg" alt=""> | <img class="imgBg" src="../../assets/vehicle/imgBg.jpg" alt=""> | ||||
| <div class="content"> | <div class="content"> | ||||
| <img v-if="showMaskNum==3" class="mask1_1" src="../../assets/vehicle/mask1_7.jpg" alt=""> | <img v-if="showMaskNum==3" class="mask1_1" src="../../assets/vehicle/mask1_7.jpg" alt=""> | ||||
| <img @click="showMask=false" class="dele" src="../../assets/vehicle/dele.png" alt=""> | <img @click="showMask=false" class="dele" src="../../assets/vehicle/dele.png" alt=""> | ||||
| </div> | </div> | ||||
| <Sidebar></Sidebar> | |||||
| <Sidebar class="slide"></Sidebar> | |||||
| </div> | </div> | ||||
| </template> | </template> | ||||
| return{ | return{ | ||||
| showMask:false,//弹框显示 | showMask:false,//弹框显示 | ||||
| showMaskNum:null, | showMaskNum:null, | ||||
| touchstartY:0, | |||||
| } | } | ||||
| }, | }, | ||||
| // mounted(){ | |||||
| // window.addEventListener("touchstart",this.touchstart) | |||||
| // window.addEventListener("touchend",this.touchend) | |||||
| // }, | |||||
| methods:{ | methods:{ | ||||
| showMaskfn(e){ | showMaskfn(e){ | ||||
| this.showMask = true; | this.showMask = true; | ||||
| }else{ | }else{ | ||||
| this.showMaskNum = 3; | this.showMaskNum = 3; | ||||
| } | } | ||||
| } | |||||
| }, | |||||
| touchstart(e){ | |||||
| this.touchstartY = e.changedTouches[0].clientY; | |||||
| }, | |||||
| touchend(e){ | |||||
| if(e.changedTouches[0].clientY-this.touchstartY>=50){ | |||||
| console.log("下滑") | |||||
| }else if(this.touchstartY-e.changedTouches[0].clientY>=50){ | |||||
| console.log("上滑") | |||||
| } | |||||
| }, | |||||
| } | } | ||||
| } | } | ||||
| </script> | </script> | ||||
| <style scoped="scoped"> | <style scoped="scoped"> | ||||
| .slide{ | |||||
| position: fixed; | |||||
| top: 0.3rem; | |||||
| left: 0.3rem; | |||||
| } | |||||
| *{ | *{ | ||||
| padding: 0; | padding: 0; | ||||
| margin: 0; | margin: 0; |
| <img v-if="showMaskNum==2" class="mask1_1" src="../../assets/vehicle/mask1_4.jpg" alt=""> | <img v-if="showMaskNum==2" class="mask1_1" src="../../assets/vehicle/mask1_4.jpg" alt=""> | ||||
| <img @click="showMask=false" class="dele" src="../../assets/vehicle/dele.png" alt=""> | <img @click="showMask=false" class="dele" src="../../assets/vehicle/dele.png" alt=""> | ||||
| </div> | </div> | ||||
| <Sidebar></Sidebar> | |||||
| <Sidebar class="slide"></Sidebar> | |||||
| </div> | </div> | ||||
| </template> | </template> | ||||
| </script> | </script> | ||||
| <style scoped="scoped"> | <style scoped="scoped"> | ||||
| .slide{ | |||||
| position: fixed; | |||||
| top: 0.3rem; | |||||
| left: 0.3rem; | |||||
| } | |||||
| *{ | *{ | ||||
| padding: 0; | padding: 0; | ||||
| margin: 0; | margin: 0; |
| <div class="all"> | <div class="all"> | ||||
| <img class="imgBg" src="../../assets/vehicle/detailsBg2.jpg" alt=""> | <img class="imgBg" src="../../assets/vehicle/detailsBg2.jpg" alt=""> | ||||
| <img class="contImg" src="../../assets/vehicle/allDetails2.png" alt=""> | <img class="contImg" src="../../assets/vehicle/allDetails2.png" alt=""> | ||||
| <Sidebar></Sidebar> | |||||
| <Sidebar class="slide"></Sidebar> | |||||
| </div> | </div> | ||||
| </template> | </template> | ||||
| <script> | <script> | ||||
| } | } | ||||
| </script> | </script> | ||||
| <style scoped="scoped"> | <style scoped="scoped"> | ||||
| .slide{ | |||||
| position: fixed; | |||||
| top: 0.3rem; | |||||
| left: 0.3rem; | |||||
| } | |||||
| .imgBg{ | .imgBg{ | ||||
| width: 100%; | width: 100%; | ||||
| height: 31.07rem; | height: 31.07rem; |
| <img class="mask1_1" src="../../assets/vehicle/mask2_1.jpg" alt=""> | <img class="mask1_1" src="../../assets/vehicle/mask2_1.jpg" alt=""> | ||||
| <img @click="showMask=false" class="dele" src="../../assets/vehicle/dele.png" alt=""> | <img @click="showMask=false" class="dele" src="../../assets/vehicle/dele.png" alt=""> | ||||
| </div> | </div> | ||||
| <Sidebar></Sidebar> | |||||
| <Sidebar class="slide"></Sidebar> | |||||
| </div> | </div> | ||||
| </template> | </template> | ||||
| </script> | </script> | ||||
| <style scoped="scoped"> | <style scoped="scoped"> | ||||
| .slide{ | |||||
| position: fixed; | |||||
| top: 0.3rem; | |||||
| left: 0.3rem; | |||||
| } | |||||
| *{ | *{ | ||||
| padding: 0; | padding: 0; | ||||
| margin: 0; | margin: 0; |
| <img v-if="showMaskNum==3" class="mask1_1" src="../../assets/vehicle/mask2_7.jpg" alt=""> | <img v-if="showMaskNum==3" class="mask1_1" src="../../assets/vehicle/mask2_7.jpg" alt=""> | ||||
| <img @click="showMask=false" class="dele" src="../../assets/vehicle/dele.png" alt=""> | <img @click="showMask=false" class="dele" src="../../assets/vehicle/dele.png" alt=""> | ||||
| </div> | </div> | ||||
| <Sidebar></Sidebar> | |||||
| <Sidebar class="slide"></Sidebar> | |||||
| </div> | </div> | ||||
| </template> | </template> | ||||
| </script> | </script> | ||||
| <style scoped="scoped"> | <style scoped="scoped"> | ||||
| .slide{ | |||||
| position: fixed; | |||||
| top: 0.3rem; | |||||
| left: 0.3rem; | |||||
| } | |||||
| *{ | *{ | ||||
| padding: 0; | padding: 0; | ||||
| margin: 0; | margin: 0; |
| <img v-if="showMaskNum==3" class="mask1_1" src="../../assets/vehicle/mask2_4.jpg" alt=""> | <img v-if="showMaskNum==3" class="mask1_1" src="../../assets/vehicle/mask2_4.jpg" alt=""> | ||||
| <img @click="showMask=false" class="dele" src="../../assets/vehicle/dele.png" alt=""> | <img @click="showMask=false" class="dele" src="../../assets/vehicle/dele.png" alt=""> | ||||
| </div> | </div> | ||||
| <Sidebar></Sidebar> | |||||
| <Sidebar class="slide"></Sidebar> | |||||
| </div> | </div> | ||||
| </template> | </template> | ||||
| </script> | </script> | ||||
| <style scoped="scoped"> | <style scoped="scoped"> | ||||
| .slide{ | |||||
| position: fixed; | |||||
| top: 0.3rem; | |||||
| left: 0.3rem; | |||||
| } | |||||
| *{ | *{ | ||||
| padding: 0; | padding: 0; | ||||
| margin: 0; | margin: 0; |