Skip to content
Projects
Groups
Snippets
Help
Loading...
Help
Submit feedback
Contribute to GitLab
Sign in
Toggle navigation
M
million
Project
Project
Details
Activity
Releases
Cycle Analytics
Repository
Repository
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Issues
0
Issues
0
List
Board
Labels
Milestones
Merge Requests
0
Merge Requests
0
CI / CD
CI / CD
Pipelines
Jobs
Schedules
Charts
Wiki
Wiki
Snippets
Snippets
Members
Members
Collapse sidebar
Close sidebar
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Open sidebar
viitto
million
Commits
1df18cf4
Commit
1df18cf4
authored
Dec 04, 2024
by
youjie
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
no message
parent
bd5570e2
Hide whitespace changes
Inline
Side-by-side
Showing
9 changed files
with
349 additions
and
72 deletions
+349
-72
App.vue
src/App.vue
+3
-3
home.css
src/assets/css/home.css
+2
-2
indexNav.vue
src/components/home/indexNav.vue
+88
-31
indexRoll1.vue
src/components/home/indexRoll1.vue
+82
-8
indexRoll2.vue
src/components/home/indexRoll2.vue
+94
-9
indexSlider.vue
src/components/home/indexSlider.vue
+73
-16
city-category.vue
src/components/navs/city-category.vue
+4
-1
hor-big-one.vue
src/components/navs/hor-big-one.vue
+2
-2
HomeLayout.vue
src/layouts/HomeLayout.vue
+1
-0
No files found.
src/App.vue
View file @
1df18cf4
...
...
@@ -9,13 +9,13 @@ export default {
name
:
"App"
,
methods
:
{
disableZoom
(
event
){
if
(
event
.
ctrlKey
&&
(
event
.
key
===
'+'
||
event
.
key
===
'-'
||
event
.
key
===
'='
))
{
if
(
(
event
.
metaKey
||
event
.
ctrlKey
)
&&
(
event
.
key
===
'+'
||
event
.
key
===
'-'
||
event
.
key
===
'='
))
{
event
.
preventDefault
();
// 阻止默认行为
console
.
log
(
'缩放功能已禁用'
);
}
},
disableZoomByWheel
(
event
)
{
if
(
event
.
ctrlKey
)
{
if
(
event
.
metaKey
||
event
.
ctrlKey
)
{
event
.
preventDefault
();
// 阻止缩放
console
.
log
(
'鼠标滚轮缩放功能已禁用'
);
}
...
...
@@ -23,7 +23,7 @@ export default {
adjustZoom
()
{
console
.
log
(
'execute...'
)
if
(
window
.
innerWidth
>
768
){
const
scale
=
window
.
devicePixelRatio
;
// 获取用户的系统缩放比例
const
scale
=
this
.
$q
.
platform
.
is
.
win
?
window
.
devicePixelRatio
:
1
;
// 获取用户的系统缩放比例
document
.
body
.
style
.
zoom
=
1
/
scale
;
// 设置缩放以抵消系统缩放
// 获取实际视口高度和宽度
...
...
src/assets/css/home.css
View file @
1df18cf4
...
...
@@ -45,10 +45,10 @@ ul,li{
}
.remTetil
{
font-size
:
1
8
px
;
font-size
:
1
6
px
;
}
.remText
{
font-size
:
1
6
px
;
font-size
:
1
1
px
;
}
.remSubText
{
...
...
src/components/home/indexNav.vue
View file @
1df18cf4
...
...
@@ -87,13 +87,19 @@
<div
class=
"carousel1-right overflow-hidden relative"
:class=
"[$q.platform.is.desktop?'col':'col-12']"
@
mouseenter
.
stop
.
prevent=
"ClearData"
>
<
template
v-if=
"windowWidth>=768"
>
<q-img
v-if=
"ImgObj.FileType!=2"
class=
"carousel1-rightImg"
@
mouseenter
.
stop
.
prevent=
"ClearData"
<template
v-if=
"FileUrlList[slide-1]&&FileUrlList[slide-1].FileType"
>
<q-img
v-show=
"FileUrlList[slide-1].FileType==1"
class=
"carousel1-rightImg"
@
mouseenter
.
stop
.
prevent=
"ClearData"
:class=
"[oldCoverImg!=coverImg?'active':'']"
:src=
"coverImg"
fill=
"contain"
/>
<q-img
v-else
alt=
""
:ratio=
"16/9"
fill=
"cover"
>
<q-video
class=
"carousel1-rightImg"
style=
"width: 100%;"
:src=
"coverImg"
frameborder=
"0"
allowfullscreen
@
mouseenter=
"ClearData"
/>
</q-img>
:src=
"FileUrlList[slide-1].FileUrl"
fill=
"contain"
/>
<div
v-show=
"FileUrlList[slide-1].FileType==2"
class=
"carousel1-rightImg carousel1-rightV relative"
:class=
"[oldCoverImg!=coverImg?'active':'']"
>
<!-- :autoplay="PlayBack" -->
<video
:src=
"FileUrlList[slide-1].FileUrl"
muted
controls
ref=
"videoPlayer"
@
timeupdate=
"(event)=>handleTimeUpdate(event,`videoPlayer`)"
@
ended=
"(event)=>handleEnded(event,`videoPlayer`)"
></video>
</div>
</
template
>
</template>
<
template
v-else
>
<q-carousel
...
...
@@ -104,7 +110,7 @@
style=
"height: 100%;"
>
<template
v-for=
"(item,index) in FileUrlList"
>
<q-carousel-slide
:name=
"index+1"
:img-src=
"item"
/>
<q-carousel-slide
:name=
"index+1"
:img-src=
"item
.FileUrl
"
/>
</
template
>
</q-carousel>
<div
class=
"MBgColorBox column justify-center items-center"
>
...
...
@@ -112,6 +118,8 @@
<p
class=
"font-serifEn fz20 q-pt-lg text-white opacity-80"
>
{{plugData.SubTitle}}
</p>
</div>
</template>
<div
class=
"absolute indexNavxcText cursor-pointer"
:class=
"[$q.platform.is.desktop?'':'writing-modes-vertical active']"
@
click=
"isMenu=true"
>
...
...
@@ -319,6 +327,7 @@ export default {
type1
:
''
,
type2
:
''
,
LinkUrl
:
''
,
PlayBack
:
true
}
},
watch
:
{
...
...
@@ -332,42 +341,84 @@ export default {
},
mounted
()
{
this
.
ImgObj
=
this
.
plugData
.
MenuList
[
0
]
this
.
coverImg
=
this
.
plugData
.
MenuList
[
0
].
FileUrl
let
arrList
=
function
(
list
){
list
.
forEach
(
x
=>
{
x
.
currentTime
=
0
})
}
arrList
(
this
.
plugData
.
MenuList
)
this
.
plugData
.
MenuList
.
forEach
(
x
=>
{
if
(
x
.
FileUrl
){
this
.
FileUrlList
.
push
(
x
.
FileUrl
)
this
.
FileUrlList
.
push
(
x
)
}
})
this
.
ImgObj
=
this
.
plugData
.
MenuList
[
0
]
this
.
coverImg
=
this
.
plugData
.
MenuList
[
0
].
FileUrl
if
(
localStorage
.
baseifo
)
{
var
jObj
=
JSON
.
parse
(
window
.
localStorage
.
getItem
(
'baseifo'
))
this
.
CategoryList
=
jObj
.
CategoryList
this
.
CategoryList
.
splice
(
0
,
1
)
}
setTimeout
(()
=>
{
if
(
this
.
FileUrlList
[
this
.
slide
-
1
].
FileType
==
2
){
this
.
playVideo
(
'videoPlayer'
)
}
},
500
)
},
methods
:
{
// 监听视频播放进度的回调
handleTimeUpdate
(
event
,
formName
)
{
const
audio
=
event
.
target
;
if
(
!
audio
.
duration
)
return
;
let
video
=
this
.
$refs
[
formName
]
if
(
video
&&!
video
.
paused
){
this
.
FileUrlList
[
this
.
slide
-
1
].
currentTime
=
audio
.
currentTime
}
},
// 视频播放结束调用的回调
handleEnded
(
event
,
formName
)
{
if
(
this
.
FileUrlList
[
this
.
slide
-
1
].
currentTime
)
this
.
FileUrlList
[
this
.
slide
-
1
].
currentTime
=
0
},
playVideo
(
formName
){
let
i
=
this
.
slide
-
1
// console.log(this.FileUrlList[i],'----')
// return
if
(
this
.
FileUrlList
[
i
].
FileType
==
2
){
let
video
=
this
.
$refs
[
formName
]
if
(
video
){
if
(
video
.
paused
)
{
if
(
this
.
FileUrlList
[
i
].
currentTime
){
video
.
currentTime
=
this
.
FileUrlList
[
i
].
currentTime
}
// console.log('继续播放')
video
.
play
()
}
else
{
// console.log('暂停')
video
.
pause
()
}
}
}
},
goUrl
(){
let
URL
=
''
if
(
this
.
LinkUrl
)
{
URL
=
`
${
this
.
LinkUrl
.
indexOf
(
'/#/searchProduct'
)
!=-
1
?
this
.
LinkUrl
:
this
.
LinkUrl
+
'?'
}${
this
.
searchKey
?
'&qsearchKey='
+
this
.
searchKey
:
''
}${
this
.
searchDate
?
'&qsearchDate='
+
this
.
searchDate
:
''
}${
this
.
searchEndDate
?
'&qsearchEndDate='
+
this
.
searchEndDate
:
''
}${
this
.
type1
&&
this
.
type2
?
'&categoryId='
+
this
.
type2
:
this
.
type1
&&!
this
.
type2
?
'&categoryId='
+
this
.
type1
:
''
}
`
console
.
log
(
URL
,
'----'
)
//
console.log(URL,'----')
this
.
OpenNewUrl
(
URL
)
}
else
{
this
.
OpenNewUrl
(
'http://www.oytour.com/#/searchProduct'
)
// this.CommonJump('/searchProduct',{})
// setTimeout(()=>{
// window.location.reload()
// },300)
}
},
getType2
(
e
){
console
.
log
(
this
.
type2
,
'----type2222222'
)
//
console.log(this.type2,'----type2222222')
},
getType1
(
e
){
this
.
optionsList
=
[]
console
.
log
(
this
.
type1
,
'----type111111'
)
//
console.log(this.type1,'----type111111')
let
list
=
this
.
CategoryList
.
filter
(
x
=>
{
if
(
x
.
Id
==
e
){
this
.
lineUrl
=
x
.
LinkUrl
...
...
@@ -455,14 +506,16 @@ export default {
this
.
oldCoverImg
=
JSON
.
parse
(
JSON
.
stringify
(
this
.
coverImg
))
if
(
this
.
CurrentIndex
==
index
)
return
else
if
(
index
>=
0
)
{
this
.
ImgObj
=
{}
this
.
CurrentIndex
=
null
setTimeout
(()
=>
{
this
.
CurrentIndex
=
index
if
(
this
.
plugData
.
MenuList
[
index
].
FileUrl
)
{
this
.
coverImg
=
this
.
plugData
.
MenuList
[
index
].
FileUrl
this
.
ImgObj
=
this
.
plugData
.
MenuList
[
index
]
}
this
.
slide
=
index
+
1
this
.
coverImg
=
this
.
FileUrlList
[
index
].
FileUrl
setTimeout
(()
=>
{
if
(
this
.
FileUrlList
[
index
].
FileType
==
2
){
this
.
playVideo
(
'videoPlayer'
)
}
},
500
)
},
300
)
}
},
...
...
@@ -472,7 +525,7 @@ export default {
}
}
</
script
>
<
style
scoped
>
<
style
lang=
"scss"
scoped
>
::v-deep
.indexNavxcBoxS
.q-field__control
{
height
:
45px
;
}
...
...
@@ -482,15 +535,18 @@ export default {
::v-deep
.indexNavxcBoxS
.q-field--auto-height
.q-field__control
{
min-height
:
45px
;
}
/* ::v-deep .indexNavxcBoxS.active .q-field__control
{
height:40px
;
.carousel1-rightV
{
background-color
:
$primary
;
}
::v-deep .indexNavxcBoxS.active .q-field--auto-height .q-field__native{
min-height: 40px;
.carousel1-rightV
video
{
width
:
100%
;
height
:
100%
;
position
:
absolute
;
top
:
0
;
left
:
0
;
right
:
0
;
bottom
:
0
;
}
::v-deep .indexNavxcBoxS.active .q-field--auto-height .q-field__control{
min-height: 40px;
} */
</
style
>
<
style
lang=
"scss"
>
.indexNavxcBoxCenter
{
...
...
@@ -677,6 +733,7 @@ export default {
.carousel1-rightImg.active
{
transform
:
scale
(
1
);
}
.MBgColorBox
{
position
:
absolute
;
top
:
0
;
...
...
src/components/home/indexRoll1.vue
View file @
1df18cf4
...
...
@@ -44,9 +44,13 @@
</
template
>
</q-img>
</template>
<q-img
v-else
alt=
""
:ratio=
"16/9"
fill=
"cover"
>
<q-video
class=
""
style=
"width: 100%;"
:src=
"item.FileUrl"
frameborder=
"0"
allowfullscreen
@
click
.
stop=
"OpenUrl(item.LinkUrl,index)"
/>
<q-img
v-if=
"item.FileType==2"
:ratio=
"16/9"
class=
"carousel1-rightV"
@
click
.
stop=
"OpenUrl(item.LinkUrl,index)"
>
<!-- autoplay -->
<video
:src=
"item.FileUrl"
muted
:ref=
"`videoPlayerRoll1${index}`"
@
timeupdate=
"(event)=>handleTimeUpdate(event,`videoPlayerRoll1${index}`,index)"
@
ended=
"(event)=>handleEnded(event,`videoPlayerRoll1${index}`,index)"
></video>
</q-img>
<div
class=
"swipercomSubEnLen absolute bg-white row items-center justify-center"
>
<div
class=
"swipercomSubEnNum row"
v-if=
"windowWidth>=992"
>
...
...
@@ -142,7 +146,7 @@
//设置能够同时显示的数量(可设置 auto)
speed
:
1000
,
autoplay
:
{
delay
:
6000
,
delay
:
6000
0000
,
stopOnLastSlide
:
false
,
disableOnInteraction
:
false
},
...
...
@@ -175,6 +179,7 @@
swiper
:
null
,
swiper2
:
null
,
activeIndex
:
0
,
realIndex
:
1
,
}
},
watch
:
{
...
...
@@ -182,10 +187,24 @@
handler
(
val
,
oldval
)
{
}
},
realIndex
:{
handler
(
val
,
oldval
)
{
setTimeout
(()
=>
{
this
.
playVideo
(
`videoPlayerRoll1
${
val
}
`
)
},
500
)
},
immediate
:
false
}
},
created
()
{
let
arrList
=
function
(
list
){
list
.
forEach
(
x
=>
{
x
.
currentTime
=
0
})
}
arrList
(
this
.
plugData
.
NavList
)
this
.
plugData
.
NavList
.
forEach
(
x
=>
{
if
(
x
.
FileUrl
){
this
.
FileUrlList
.
push
(
x
)
...
...
@@ -193,15 +212,55 @@
})
},
mounted
()
{
setTimeout
(()
=>
{
this
.
swiper
=
this
.
$refs
.
mySwiper
.
swiper
let
swiperInstance
=
this
.
$refs
.
mySwiper
.
swiper
swiperInstance
.
loopedSlides
=
this
.
FileUrlList
.
length
swiperInstance
.
update
()
this
.
playVideo
(
`videoPlayerRoll1
${
this
.
realIndex
}
`
)
},
500
);
},
methods
:
{
// 监听视频播放进度的回调
handleTimeUpdate
(
event
,
formName
,
index
)
{
const
audio
=
event
.
target
;
if
(
!
audio
.
duration
)
return
;
let
video
=
this
.
$refs
[
formName
]
if
(
video
&&
video
[
0
]
&&!
video
[
0
].
paused
){
this
.
FileUrlList
[
index
].
currentTime
=
audio
.
currentTime
}
},
// 视频播放结束调用的回调
handleEnded
(
event
,
formName
,
index
)
{
if
(
this
.
FileUrlList
[
index
].
currentTime
)
this
.
FileUrlList
[
index
].
currentTime
=
0
},
playVideo
(
formName
){
for
(
let
i
=
0
;
i
<
this
.
FileUrlList
.
length
;
i
++
){
if
(
this
.
FileUrlList
[
i
].
FileType
==
2
){
let
video
=
this
.
$refs
[
`videoPlayerRoll1
${
i
}
`
]
if
(
video
&&
video
[
0
]
&&!
video
[
0
].
paused
){
video
[
0
].
pause
()
}
}
}
let
i
=
this
.
realIndex
if
(
this
.
FileUrlList
[
i
].
FileType
==
2
){
let
video
=
this
.
$refs
[
formName
]
if
(
video
&&
video
[
0
]){
if
(
video
[
0
].
paused
)
{
if
(
this
.
FileUrlList
[
i
].
currentTime
){
video
[
0
].
currentTime
=
this
.
FileUrlList
[
i
].
currentTime
}
// console.log('继续播放')
video
[
0
].
play
()
}
else
{
// console.log('暂停')
video
[
0
].
pause
()
}
}
}
},
OpenUrl
(
URL
,
index
)
{
if
(
index
!=
this
.
slide
)
return
this
.
carousel
(
this
.
Current
)
this
.
OpenNewUrl
(
URL
)
...
...
@@ -211,9 +270,15 @@
},
onSlideChange
(){
// 获取当前索引
const
swiper
=
this
.
$refs
.
mySwiper
.
swiper
const
activeIndex
=
this
.
$refs
.
mySwiper
.
swiper
.
activeIndex
;
this
.
slide
=
activeIndex
this
.
realIndex
=
swiper
.
realIndex
console
.
log
(
swiper
.
realIndex
,
'----'
)
// console.log('当前索引:', activeIndex);
setTimeout
(()
=>
{
this
.
playVideo
(
`videoPlayerRoll1
${
swiper
.
realIndex
+
1
}
`
)
},
500
)
},
carousel
(
text
){
if
(
this
.
windowWidth
<
768
)
return
...
...
@@ -252,12 +317,21 @@
}
}
</
script
>
<
style
scoped
>
<
style
lang=
"scss"
scoped
>
.activeL
{
cursor
:
url('../../assets/svg/left.svg')
,
auto
;
cursor
:
url('../../assets/svg/left.svg')
35
35
,
auto
;
}
.activeR
{
cursor
:
url('../../assets/svg/right.svg')
,
auto
;
cursor
:
url('../../assets/svg/right.svg')
35
35
,
auto
;
}
.carousel1-rightV
{
width
:
100%
;
height
:
100%
;
background-color
:
$primary
;
}
.carousel1-rightV
video
{
width
:
100%
;
height
:
100%
;
}
</
style
>
<
style
lang=
"scss"
>
...
...
src/components/home/indexRoll2.vue
View file @
1df18cf4
...
...
@@ -45,12 +45,19 @@
</
template
>
</q-img>
</template>
<q-img
v-else
alt=
""
:ratio=
"0.64"
fill=
"cover"
>
<q-video
class=
"cursor-pointer"
style=
"width: 100%;"
:src=
"item.FileUrl"
frameborder=
"0"
allowfullscreen
@
click
.
stop=
"OpenNewUrl(item.LinkUrl)"
/>
</q-img>
<div
class=
"carousel1-rightV"
>
<q-img
v-show=
"item.FileType==2"
:ratio=
"0.64"
>
<!-- autoplay controls-->
<video
:src=
"item.FileUrl"
muted
:ref=
"`videoPlayerRoll2${index}`"
@
timeupdate=
"(event)=>handleTimeUpdate(event,`videoPlayerSli${index}`,index)"
@
ended=
"(event)=>handleEnded(event,`videoPlayerSli${index}`,index)"
@
play=
"item.videoPlaying = true"
@
pause=
"item.videoPlaying = false"
></video>
</q-img>
</div>
<div
class=
"swipercomTvR2BjBox"
>
<div
class=
"swipercomTvR2BjBox"
@
click
.
stop=
"item.FileType==2?playVideo(`videoPlayerRoll2${index}`):''"
>
<div
class=
"swipercomTvR2Bj absolute"
>
</div>
<div
class=
"swipercomTvR2 absolute"
>
<div
class=
"h100 column justify-end text-left"
>
...
...
@@ -96,11 +103,11 @@
<
script
>
import
{
swiper
,
swiperSlide
}
from
"vue-awesome-swiper"
;
import
"swiper/dist/css/swiper.css"
;
const
scale
=
1
/
window
.
devicePixelRatio
;
export
default
{
components
:
{
swiper
,
swiperSlide
},
props
:
[
'plugData'
,
'windowWidth'
,
'top'
,
'currentHeight'
],
data
()
{
const
scale
=
1
/
this
.
$q
.
platform
.
is
.
win
?
window
.
devicePixelRatio
:
1
;
return
{
slide
:
1
,
FileUrlList
:
[],
...
...
@@ -157,6 +164,7 @@
},
swiper
:
null
,
activeIndex
:
0
,
realIndex
:
0
,
}
},
watch
:
{
...
...
@@ -164,10 +172,26 @@
handler
(
val
,
oldval
)
{
}
},
realIndex
:{
handler
(
val
,
oldval
)
{
setTimeout
(()
=>
{
this
.
playVideo
(
`videoPlayerRoll1
${
val
}
`
)
},
500
)
},
immediate
:
false
}
},
created
()
{
let
arrList
=
function
(
list
){
list
.
forEach
(
x
=>
{
x
.
currentTime
=
0
x
.
videoPlaying
=
false
x
.
videoPlaying
=
false
})
}
arrList
(
this
.
plugData
.
NavList
)
this
.
plugData
.
NavList
.
forEach
(
x
=>
{
if
(
x
.
FileUrl
){
this
.
FileUrlList
.
push
(
x
)
...
...
@@ -176,17 +200,65 @@
},
mounted
()
{
setTimeout
(()
=>
{
this
.
swiper
=
this
.
$refs
.
mySwiper2
.
swiper
;
if
(
this
.
windowWidth
<=
768
)
this
.
swiper
.
slidesPerView
=
1
else
this
.
swiper
.
slidesPerView
=
1.5
// this.swiper = this.$refs.mySwiper2.swiper;
// if(this.windowWidth
<=
768
)
this
.
swiper
.
slidesPerView
=
1
// else this.swiper.slidesPerView = 1.5
this
.
playVideo
(
`videoPlayerRoll2
${
this
.
realIndex
}
`
)
},
500
);
},
methods
:
{
// 监听视频播放进度的回调
handleTimeUpdate
(
event
,
formName
,
index
)
{
const
audio
=
event
.
target
;
if
(
!
audio
.
duration
)
return
;
let
video
=
this
.
$refs
[
formName
]
if
(
video
&&
video
[
0
]
&&!
video
[
0
].
paused
){
this
.
FileUrlList
[
index
].
currentTime
=
audio
.
currentTime
}
},
// 视频播放结束调用的回调
handleEnded
(
event
,
formName
,
index
)
{
if
(
this
.
FileUrlList
[
index
].
currentTime
)
this
.
FileUrlList
[
index
].
currentTime
=
0
},
playVideo
(
formName
){
for
(
let
i
=
0
;
i
<
this
.
FileUrlList
.
length
;
i
++
){
if
(
this
.
FileUrlList
[
i
].
FileType
==
2
){
let
video
=
this
.
$refs
[
`videoPlayerRoll2
${
i
}
`
]
if
(
video
&&
video
[
0
]
&&!
video
[
0
].
paused
){
video
[
0
].
pause
()
}
}
}
let
i
=
this
.
realIndex
if
(
this
.
FileUrlList
[
i
].
FileType
==
2
){
let
video
=
this
.
$refs
[
formName
]
if
(
video
&&
video
[
0
]){
if
(
video
[
0
].
paused
&&
this
.
FileUrlList
[
i
].
videoPlaying
==
false
)
{
if
(
this
.
FileUrlList
[
i
].
currentTime
){
video
[
0
].
currentTime
=
this
.
FileUrlList
[
i
].
currentTime
}
// console.log('继续播放')
this
.
FileUrlList
[
i
].
videoPlaying
=
true
video
[
0
].
play
()
}
else
{
// console.log('暂停')
this
.
FileUrlList
[
i
].
videoPlaying
=
false
video
[
0
].
pause
()
}
}
}
},
onSlideChange
(){
// 获取当前索引
const
swiper
=
this
.
$refs
.
mySwiper2
.
swiper
const
activeIndex
=
this
.
$refs
.
mySwiper2
.
swiper
.
activeIndex
;
this
.
slide
=
activeIndex
this
.
realIndex
=
swiper
.
realIndex
// console.log('当前索引:', activeIndex);
setTimeout
(()
=>
{
this
.
playVideo
(
`videoPlayerRoll2
${
swiper
.
realIndex
+
1
}
`
)
},
500
)
},
carousel
(
text
){
if
(
this
.
windowWidth
<
768
)
return
...
...
@@ -222,6 +294,19 @@
}
}
</
script
>
<
style
lang=
"scss"
scoped
>
.carousel1-rightV
{
width
:
100%
;
height
:
100%
;
padding
:
0
;
border-radius
:
10px
;
background
:
$primary
;
}
.carousel1-rightV
video
{
width
:
100%
;
height
:
100%
;
}
</
style
>
<
style
lang=
"scss"
>
.indexRoll2Box
{
overflow
:
hidden
;
...
...
src/components/home/indexSlider.vue
View file @
1df18cf4
...
...
@@ -49,8 +49,12 @@
</div>
</
template
>
</q-img>
<q-img
v-else
:ratio=
"16/9"
>
<q-video
class=
"cursor-pointer"
style=
"width: 100%;"
:src=
"item.FileUrl"
frameborder=
"0"
allowfullscreen
@
click
.
stop=
"OpenNewUrl(item.LinkUrl)"
/>
<q-img
v-show=
"item.FileType==2"
:ratio=
"16/9"
class=
"cursor-pointer carousel1-rightV"
>
<video
:src=
"item.FileUrl"
muted
controls
:ref=
"`videoPlayerSli${index+1}`"
@
timeupdate=
"(event)=>handleTimeUpdate(event,`videoPlayerSli${index+1}`,index)"
@
ended=
"(event)=>handleEnded(event,`videoPlayerSli${index+1}`,index)"
></video>
</q-img>
<div
class=
"inSliSubNameBox absolute cursor-pointer"
:style=
"{'background-color':windowWidth>=992?plugData.BgColor:''}"
...
...
@@ -67,7 +71,7 @@
<div
class=
"inSliSubEnNameBox absolute cursor-pointer"
>
<p
class=
"text-secondary font-serifEn"
>
{{item.SubEnName}}
</p>
</div>
<div
class=
"inSliSubDescribeBox
no-wrap justify-between cursor-default"
<div
class=
"inSliSubDescribeBox no-wrap justify-between cursor-default"
:style=
"{'background-color':plugData.BgColor}"
:class=
"[windowWidth>=992?'absolute row':' column']"
>
<p
class=
"text-center font-serifEn
...
...
@@ -123,20 +127,29 @@ export default {
X
:
0
,
Y
:
0
,
Current
:
null
,
slide
:
2
,
autoplay
:
40000
000
,
slide
:
1
,
autoplay
:
5
000
,
FileUrlList
:
[],
isRight
:
false
,
cursorUrlL
:
require
(
'../../assets/svg/left.svg'
),
cursorUrlR
:
require
(
'../../assets/svg/right.svg'
),
cursorSize
:
16
,
videoList
:
[],
// 视频列表数据
videoUpdateTime
:
[],
// 记录video播放的时长
}
},
watch
:
{
windowWidth
:
{
handler
:
function
(
val
,
oldval
)
{
handler
(
val
,
oldval
)
{
}
},
slide
:{
handler
(
val
,
oldval
)
{
setTimeout
(()
=>
{
this
.
playVideo
(
`videoPlayerSli
${
val
}
`
)
},
500
)
},
immediate
:
false
}
},
...
...
@@ -147,6 +160,7 @@ export default {
let
arrList
=
function
(
list
){
list
.
forEach
(
x
=>
{
x
.
SubDescribe2
=
''
x
.
currentTime
=
0
})
}
arrList
(
this
.
plugData
.
NavList
)
...
...
@@ -157,8 +171,45 @@ export default {
this
.
FileUrlList
.
push
(
x
)
}
})
setTimeout
(()
=>
{
if
(
this
.
FileUrlList
[
this
.
slide
-
1
].
FileType
==
2
){
this
.
playVideo
(
`videoPlayerSli
${
this
.
slide
}
`
)
}
},
500
)
},
methods
:
{
// 监听视频播放进度的回调
handleTimeUpdate
(
event
,
formName
,
index
)
{
const
audio
=
event
.
target
;
if
(
!
audio
.
duration
)
return
;
let
video
=
this
.
$refs
[
formName
]
if
(
video
&&
video
[
0
]
&&!
video
[
0
].
paused
){
this
.
FileUrlList
[
index
].
currentTime
=
audio
.
currentTime
}
},
// 视频播放结束调用的回调
handleEnded
(
event
,
formName
,
index
)
{
if
(
this
.
FileUrlList
[
index
].
currentTime
)
this
.
FileUrlList
[
index
].
currentTime
=
0
},
playVideo
(
formName
){
let
i
=
this
.
slide
-
1
if
(
this
.
FileUrlList
[
i
].
FileType
==
2
){
let
video
=
this
.
$refs
[
formName
]
if
(
video
&&
video
[
0
]){
if
(
video
[
0
].
paused
)
{
if
(
this
.
FileUrlList
[
i
].
currentTime
){
video
[
0
].
currentTime
=
this
.
FileUrlList
[
i
].
currentTime
}
// console.log('继续播放')
video
[
0
].
play
()
}
else
{
// console.log('暂停')
video
[
0
].
pause
()
}
}
}
},
carouselIndex
(
index
){
this
.
slide
=
index
+
1
},
...
...
@@ -175,21 +226,18 @@ export default {
}
},
handleMouseMove
(
el
)
{
console
.
log
(
el
.
clientX
,
'-------------'
)
if
(
this
.
windowWidth
<
768
)
return
this
.
Current
=
null
if
(
!
this
.
isRight
)
this
.
isRight
=
true
let
width
=
this
.
windowWidth
/
2
if
(
el
.
x
<
width
){
this
.
Current
=
'left'
this
.
X
=
el
.
x
+
50
//
this.X = el.x+50
}
else
if
(
el
.
x
>
width
)
{
this
.
Current
=
'right'
this
.
X
=
el
.
x
-
50
//
this.X = el.x-50
}
this
.
Y
=
el
.
y
+
(
document
.
documentElement
.
scrollTop
||
document
.
body
.
scrollTop
)
// this.X = el.clientX
// this.Y = el.clientY
// this.Y = el.y+(document.documentElement.scrollTop || document.body.scrollTop)
},
handleMouseLeave
(){
this
.
isRight
=
false
...
...
@@ -197,12 +245,21 @@ export default {
}
}
</
script
>
<
style
scoped
>
<
style
lang=
"scss"
scoped
>
.activeL
{
cursor
:
url('../../assets/svg/left.svg')
,
auto
;
cursor
:
url('../../assets/svg/left.svg')
35
35
,
auto
;
}
.activeR
{
cursor
:
url('../../assets/svg/right.svg')
,
auto
;
cursor
:
url('../../assets/svg/right.svg')
35
35
,
auto
;
}
.carousel1-rightV
{
width
:
100%
;
height
:
100%
;
background-color
:
$primary
;
}
.carousel1-rightV
video
{
width
:
100%
;
height
:
100%
;
}
</
style
>
<
style
lang=
"scss"
>
...
...
src/components/navs/city-category.vue
View file @
1df18cf4
...
...
@@ -184,7 +184,8 @@
<q-separator
color=
"grey-2"
v-if=
"isHome"
/>
<div
class=
"header-box flex q-py-sm"
v-if=
"isHome"
>
<q-tabs
align=
"center"
shrink
>
<div
<template
v-if=
"false"
>
<div
flat
unelevated
class=
"address-btn"
...
...
@@ -284,6 +285,8 @@
</q-menu>
</div>
<q-separator
style=
"height: 16px; margin: auto 0"
vertical
/>
</
template
>
<div
class=
"all-type category-btn"
flat
...
...
src/components/navs/hor-big-one.vue
View file @
1df18cf4
...
...
@@ -199,7 +199,7 @@
<!-- pc -->
<div
v-if=
"$q.platform.is.desktop"
>
<q-btn
label=
"繁體中文"
flat
>
<
!--
<
q-btn
label=
"繁體中文"
flat
>
<q-menu>
<q-list>
<q-item
clickable
v-close-popup
>
...
...
@@ -208,7 +208,7 @@
</q-list>
</q-menu>
</q-btn>
<q-btn
label=
"帮助中心"
flat
></q-btn>
<q-btn
label=
"帮助中心"
flat
></q-btn>
-->
<q-btn
v-if=
"LoginUser.id
<
=
0
"
label=
"注册"
flat
></q-btn>
<template
v-if=
"LoginUser.token"
>
<q-btn-dropdown
...
...
src/layouts/HomeLayout.vue
View file @
1df18cf4
...
...
@@ -92,6 +92,7 @@ import Navs from 'src/pages/usercenter/components/navs.vue';
watch
:
{
'$route'
:
function
()
{
this
.
showUserInfo
=
Boolean
(
this
.
$route
.
meta
.
isUserCenter
)
this
.
isSearch
=
this
.
$router
.
history
.
current
.
path
!=
"/"
&&
this
.
$router
.
history
.
current
.
path
!=
"/index"
}
},
destroyed
()
{
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment