Skip to content
Projects
Groups
Snippets
Help
This project
Loading...
Sign in / Register
Toggle navigation
X
xzksxt
Overview
Overview
Details
Activity
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
常超
xzksxt
Commits
74d8a8b1
Commit
74d8a8b1
authored
Jan 25, 2024
by
宋珺琪
Browse files
Options
Browse Files
Download
Email Patches
Plain Diff
修改背景、视频展示bug、答题选项图片、等
parent
7da0f74e
Hide whitespace changes
Inline
Side-by-side
Showing
12 changed files
with
276 additions
and
55 deletions
+276
-55
src/assets/img/beij2.jpg
+0
-0
src/assets/img/title2.jpg
+0
-0
src/components/student/answer.vue
+34
-24
src/components/student/index.vue
+3
-2
src/components/student/scoreDwTjTable.vue
+2
-1
src/components/student/scoreTable.vue
+2
-1
src/components/student/scoreTjTable.vue
+2
-1
src/components/teacher/addVideo.vue
+27
-16
src/components/videoList/packages/vue-mini-player/src/PlayBtn.vue
+45
-1
src/components/videoList/packages/vue-mini-player/src/VuePlayer.vue
+4
-3
src/components/videoList/packages/vue-mini-player/src/controls/Fullscreen.vue
+27
-0
src/components/videoList/videoList.vue
+130
-6
No files found.
src/assets/img/beij2.jpg
0 → 100644
View file @
74d8a8b1
431 KB
src/assets/img/title2.jpg
0 → 100644
View file @
74d8a8b1
207 KB
src/components/student/answer.vue
View file @
74d8a8b1
...
@@ -9,7 +9,8 @@
...
@@ -9,7 +9,8 @@
<li><i
class=
"iconfont icon-menufold icon20"
ref=
"toggle"
@
click=
"slider_flag = !slider_flag"
></i></li>
<li><i
class=
"iconfont icon-menufold icon20"
ref=
"toggle"
@
click=
"slider_flag = !slider_flag"
></i></li>
<div
style=
"display: flex;"
>
<div
style=
"display: flex;"
>
<img
class=
"jinhuiClass"
src=
"@/assets/img/jinhui.png"
alt=
""
/>
<img
class=
"jinhuiClass"
src=
"@/assets/img/jinhui.png"
alt=
""
/>
<li
style=
" font-family:'youshe';color: black;font-size: 45px; text-shadow: 8px 1px 1px #888888;"
>
{{
examData
.
type
}}
-
{{
examData
.
source
}}
</li>
<li
style=
" font-family:'youshe';color: white;font-size: 40px;margin-right: -15px "
>
{{
examData
.
type
}}
-
{{
examData
.
source
}}
</li>
<!-- 阴影效果 text-shadow: 8px 1px 1px #888888;color: rgba(255, 255, 0, 0.8);-->
</div>
</div>
<li>
(
{{
userInfo
.
name
}}
)
</li>
<li>
(
{{
userInfo
.
name
}}
)
</li>
<li>
<li>
...
@@ -20,14 +21,14 @@
...
@@ -20,14 +21,14 @@
cid: this.$route.query.cid,
cid: this.$route.query.cid,
cname:this.$route.query.cname,
cname:this.$route.query.cname,
role:this.$route.query.role
role:this.$route.query.role
}}" class="router1">个人统计
}}" class="router1"
target="_blank"
>个人统计
</router-link>
</router-link>
</li>
</li>
<li>
<li>
<router-link
<router-link
:to=
"
{
:to=
"
{
path: '/videoList',
path: '/videoList',
}" class="router1">视频
}" class="router1"
target="_blank"
>视频
</router-link>
</router-link>
</li>
</li>
<li><i
class=
"iconfont icon-arrLeft icon20"
></i></li>
<li><i
class=
"iconfont icon-arrLeft icon20"
></i></li>
...
@@ -120,7 +121,7 @@
...
@@ -120,7 +121,7 @@
</div>
</div>
<div
v-if=
" optionValue == '多选题'"
>
<div
v-if=
" optionValue == '多选题'"
>
<el-checkbox-group
v-model=
"checkList"
@
change=
"handleCheckboxChange"
>
<el-checkbox-group
v-model=
"checkList"
@
change=
"handleCheckboxChange"
>
<div
style=
"display: flex"
>
<!--
<div
style=
"display: flex"
>
--
>
<el-checkbox
:label=
"1"
:disabled=
'radioFlag'
<el-checkbox
:label=
"1"
:disabled=
'radioFlag'
:class=
" ischeckBox ?(this.reduceAnswer.rightAnswer.replace(/\s/g, '').split(',').includes('A') ? 'checkboxTrueStyle' : 'checkboxFlaseStyle'):'noStyle'"
>
:class=
" ischeckBox ?(this.reduceAnswer.rightAnswer.replace(/\s/g, '').split(',').includes('A') ? 'checkboxTrueStyle' : 'checkboxFlaseStyle'):'noStyle'"
>
{{
showAnswer
.
answerA
}}
{{
showAnswer
.
answerA
}}
...
@@ -129,11 +130,11 @@
...
@@ -129,11 +130,11 @@
<li
style=
"overflow: visible;display: flex"
>
<li
style=
"overflow: visible;display: flex"
>
<img
:src=
"showAnswer.Aimg"
alt=
""
<img
:src=
"showAnswer.Aimg"
alt=
""
@
click=
"magnifyPhoto(showAnswer.Aimg)"
@
click=
"magnifyPhoto(showAnswer.Aimg)"
style=
"width:
50px; height:45
px; margin-left: 10px;margin-top: 5px"
>
style=
"width:
300px; height:300
px; margin-left: 10px;margin-top: 5px"
>
</li>
</li>
</ul>
</ul>
</div
>
<!--
</div>
--
>
<div
style=
"display: flex"
>
<!--
<div
style=
"display: flex"
>
--
>
<el-checkbox
:label=
"2"
:disabled=
'radioFlag'
<el-checkbox
:label=
"2"
:disabled=
'radioFlag'
:class=
" ischeckBox ?(this.reduceAnswer.rightAnswer.replace(/\s/g, '').split(',').includes('B') ? 'checkboxTrueStyle' : 'checkboxFlaseStyle'):'noStyle'"
>
:class=
" ischeckBox ?(this.reduceAnswer.rightAnswer.replace(/\s/g, '').split(',').includes('B') ? 'checkboxTrueStyle' : 'checkboxFlaseStyle'):'noStyle'"
>
{{
showAnswer
.
answerB
}}
{{
showAnswer
.
answerB
}}
...
@@ -142,11 +143,11 @@
...
@@ -142,11 +143,11 @@
<li
style=
"overflow: visible;display: flex"
>
<li
style=
"overflow: visible;display: flex"
>
<img
:src=
"showAnswer.Bimg"
alt=
""
<img
:src=
"showAnswer.Bimg"
alt=
""
@
click=
"magnifyPhoto(showAnswer.Bimg)"
@
click=
"magnifyPhoto(showAnswer.Bimg)"
style=
"width:
50px; height:45
px; margin-left: 10px;margin-top: 5px"
>
style=
"width:
300px; height:300
px; margin-left: 10px;margin-top: 5px"
>
</li>
</li>
</ul>
</ul>
</div
>
<!--
</div>
--
>
<div
style=
"display:flex;"
>
<!--
<div
style=
"display:flex;"
>
--
>
<el-checkbox
:label=
"3"
:disabled=
'radioFlag'
<el-checkbox
:label=
"3"
:disabled=
'radioFlag'
:class=
" ischeckBox ?(this.reduceAnswer.rightAnswer.replace(/\s/g, '').split(',').includes('C') ? 'checkboxTrueStyle' : 'checkboxFlaseStyle'):'noStyle'"
>
:class=
" ischeckBox ?(this.reduceAnswer.rightAnswer.replace(/\s/g, '').split(',').includes('C') ? 'checkboxTrueStyle' : 'checkboxFlaseStyle'):'noStyle'"
>
{{
showAnswer
.
answerC
}}
{{
showAnswer
.
answerC
}}
...
@@ -155,11 +156,11 @@
...
@@ -155,11 +156,11 @@
<li
style=
"overflow: visible;display: flex"
>
<li
style=
"overflow: visible;display: flex"
>
<img
:src=
"showAnswer.Cimg"
alt=
""
<img
:src=
"showAnswer.Cimg"
alt=
""
@
click=
"magnifyPhoto(showAnswer.Cimg)"
@
click=
"magnifyPhoto(showAnswer.Cimg)"
style=
"width:
50px; height:45
px; margin-left: 10px;margin-top: 5px"
>
style=
"width:
300px; height:300
px; margin-left: 10px;margin-top: 5px"
>
</li>
</li>
</ul>
</ul>
</div
>
<!--
</div>
--
>
<div
style=
"display: flex"
>
<!--
<div
style=
"display: flex"
>
--
>
<el-checkbox
:label=
"4"
:disabled=
'radioFlag'
<el-checkbox
:label=
"4"
:disabled=
'radioFlag'
:class=
" ischeckBox ?(this.reduceAnswer.rightAnswer.replace(/\s/g, '').split(',').includes('D') ? 'checkboxTrueStyle' : 'checkboxFlaseStyle'):'noStyle'"
>
:class=
" ischeckBox ?(this.reduceAnswer.rightAnswer.replace(/\s/g, '').split(',').includes('D') ? 'checkboxTrueStyle' : 'checkboxFlaseStyle'):'noStyle'"
>
{{
showAnswer
.
answerD
}}
{{
showAnswer
.
answerD
}}
...
@@ -168,10 +169,10 @@
...
@@ -168,10 +169,10 @@
<li
style=
"overflow: visible;display: flex"
>
<li
style=
"overflow: visible;display: flex"
>
<img
:src=
"showAnswer.Dimg"
alt=
""
<img
:src=
"showAnswer.Dimg"
alt=
""
@
click=
"magnifyPhoto(showAnswer.Dimg)"
@
click=
"magnifyPhoto(showAnswer.Dimg)"
style=
"width:
50px; height:45
px; margin-left: 10px;margin-top: 5px"
>
style=
"width:
300px; height:300
px; margin-left: 10px;margin-top: 5px"
>
</li>
</li>
</ul>
</ul>
</div
>
<!--
</div>
--
>
</el-checkbox-group>
</el-checkbox-group>
<el-button
class=
"submitAnswerClass"
type=
"primary"
plain
v-show=
"isOptionSelected"
@
click=
"submitAnswer"
>
提交
</el-button>
<el-button
class=
"submitAnswerClass"
type=
"primary"
plain
v-show=
"isOptionSelected"
@
click=
"submitAnswer"
>
提交
</el-button>
...
@@ -337,9 +338,13 @@ export default {
...
@@ -337,9 +338,13 @@ export default {
this
.
optionValue
=
"多选题"
this
.
optionValue
=
"多选题"
this
.
showAnswer
=
{
this
.
showAnswer
=
{
answerA
:
reduceAnswer
.
answerA
,
answerA
:
reduceAnswer
.
answerA
,
Aimg
:
reduceAnswer
.
aimg
,
answerB
:
reduceAnswer
.
answerB
,
answerB
:
reduceAnswer
.
answerB
,
Bimg
:
reduceAnswer
.
bimg
,
answerC
:
reduceAnswer
.
answerC
,
answerC
:
reduceAnswer
.
answerC
,
Cimg
:
reduceAnswer
.
cimg
,
answerD
:
reduceAnswer
.
answerD
,
answerD
:
reduceAnswer
.
answerD
,
Dimg
:
reduceAnswer
.
dimg
,
}
}
}
else
if
(
!
reduceAnswer
.
oneOrMore
)
{
}
else
if
(
!
reduceAnswer
.
oneOrMore
)
{
reduceAnswer
.
oneOrMore
=
'3'
reduceAnswer
.
oneOrMore
=
'3'
...
@@ -583,9 +588,9 @@ export default {
...
@@ -583,9 +588,9 @@ export default {
<
style
lang=
"less"
>
<
style
lang=
"less"
>
.jinhuiClass
{
.jinhuiClass
{
height
:
80px
;
height
:
80px
;
margin-right
:
5px
;
margin-top
:
-15px
;
margin-top
:
-15px
;
margin-bottom
:
-15px
margin-bottom
:
-15px
;
margin-left
:
-15px
;
}
}
@font-face
{
@font-face
{
font-family
:
"youshe"
;
font-family
:
"youshe"
;
...
@@ -1019,14 +1024,18 @@ export default {
...
@@ -1019,14 +1024,18 @@ export default {
border
:
1px
solid
#FF90AA
;
border
:
1px
solid
#FF90AA
;
}
}
#answer
.top
{
#answer
.top
{
background-color
:
rgb
(
39
,
118
,
223
);
/*background-color: rgb(39, 118, 223);*/
/*background-color: #dc4b4b;*/
background
:
url('../../assets/img/title2.jpg')
left
/
cover
no-repeat
;
background-size
:
100%
;
position
:
fixed
;
position
:
fixed
;
width
:
100%
;
width
:
100%
;
}
}
#answer
.item
{
#answer
.item
{
display
:
flex
;
display
:
flex
;
padding
:
20px
;
padding-bottom
:
20px
;
font-size
:
26px
;
padding-top
:
20px
;
font-size
:
23px
;
letter-spacing
:
1px
;
letter-spacing
:
1px
;
}
}
#answer
.top
.item
li
:nth-child
(
1
)
{
#answer
.top
.item
li
:nth-child
(
1
)
{
...
@@ -1039,6 +1048,7 @@ export default {
...
@@ -1039,6 +1048,7 @@ export default {
font-weight
:
bold
;
font-weight
:
bold
;
display
:
flex
;
display
:
flex
;
align-items
:
center
;
align-items
:
center
;
color
:
white
;
}
}
//
个人统计
//
个人统计
#answer
.top
.item
li
:nth-child
(
4
)
{
#answer
.top
.item
li
:nth-child
(
4
)
{
...
@@ -1077,9 +1087,10 @@ export default {
...
@@ -1077,9 +1087,10 @@ export default {
text-align
:
left
;
text-align
:
left
;
}
}
.router1
{
.router1
{
color
:
black
;
color
:
white
;
font-weight
:
bold
;
font-weight
:
bold
;
border
:
2px
solid
black
;
margin-right
:
5px
;
border
:
2px
solid
white
;
border-radius
:
10px
;
border-radius
:
10px
;
}
}
//
背景
//
背景
...
@@ -1089,8 +1100,7 @@ export default {
...
@@ -1089,8 +1100,7 @@ export default {
left
:
0
;
left
:
0
;
width
:
100%
;
width
:
100%
;
height
:
100%
;
height
:
100%
;
background
:
url('../../assets/img/beijing111.jpg')
center
top
/
cover
no-repeat
;
background
:
url('../../assets/img/beij2.jpg')
center
top
/
cover
no-repeat
;
background-color
:
#b6bccd
d1
!important
;
background-size
:
100%
100%
;
background-size
:
100%
100%
;
max-height
:
100%
;
/* 设置固定高度,根据需要调整 */
max-height
:
100%
;
/* 设置固定高度,根据需要调整 */
overflow
:
auto
;
/* 添加滚动条 */
overflow
:
auto
;
/* 添加滚动条 */
...
...
src/components/student/index.vue
View file @
74d8a8b1
...
@@ -119,7 +119,8 @@ export default {
...
@@ -119,7 +119,8 @@ export default {
}
}
.list
a
{
.list
a
{
text-decoration
:
none
;
text-decoration
:
none
;
color
:
#fff
;
color
:
black
;
font-weight
:
bold
;
}
}
li
{
li
{
list-style
:
none
;
list-style
:
none
;
...
@@ -181,7 +182,7 @@ li {
...
@@ -181,7 +182,7 @@ li {
width
:
100%
;
width
:
100%
;
overflow-y
:
auto
;
overflow-y
:
auto
;
height
:
100%
;
height
:
100%
;
background
:
url('../../assets/img/
dtbj.pn
g')
center
top
/
cover
no-repeat
;
background
:
url('../../assets/img/
beij2.jp
g')
center
top
/
cover
no-repeat
;
background-color
:
#b6bccd
d1
!important
;
background-color
:
#b6bccd
d1
!important
;
}
}
.final
{
.final
{
...
...
src/components/student/scoreDwTjTable.vue
View file @
74d8a8b1
...
@@ -188,7 +188,8 @@ export default {
...
@@ -188,7 +188,8 @@ export default {
margin
:
0
auto
;
margin
:
0
auto
;
.title
{
.title
{
margin
:
20px
;
margin
:
20px
;
color
:
#fff
;
color
:
black
;
font-weight
:
bold
;
}
}
.content-el
{
.content-el
{
background-color
:
#fff
;
background-color
:
#fff
;
...
...
src/components/student/scoreTable.vue
View file @
74d8a8b1
...
@@ -119,7 +119,8 @@ export default {
...
@@ -119,7 +119,8 @@ export default {
margin
:
0
auto
;
margin
:
0
auto
;
.title
{
.title
{
margin
:
20px
;
margin
:
20px
;
color
:
#fff
;
color
:
black
;
font-weight
:
bold
;
}
}
.content-el
{
.content-el
{
background-color
:
#fff
;
background-color
:
#fff
;
...
...
src/components/student/scoreTjTable.vue
View file @
74d8a8b1
...
@@ -90,7 +90,8 @@ export default {
...
@@ -90,7 +90,8 @@ export default {
margin
:
0
auto
;
margin
:
0
auto
;
.title
{
.title
{
margin
:
20px
;
margin
:
20px
;
color
:
#fff
;
color
:
black
;
font-weight
:
bold
;
}
}
.content-el
{
.content-el
{
background-color
:
#fff
;
background-color
:
#fff
;
...
...
src/components/teacher/addVideo.vue
View file @
74d8a8b1
...
@@ -44,7 +44,11 @@
...
@@ -44,7 +44,11 @@
accept=
"video/*"
accept=
"video/*"
:on-change=
"handlePhotoChange"
:on-change=
"handlePhotoChange"
:limit=
"1"
:limit=
"1"
ref=
"uploadRef"
element-loading-text=
"正在上传"
element-loading-spinner=
"el-icon-loading"
element-loading-background=
"rgba(0, 0, 0, 0.8)"
v-loading
.
fullscreen
.
lock=
"fullscreenLoading"
ref=
"uploadRef"
:show-file-list=
"false"
>
:show-file-list=
"false"
>
<el-button
slot=
"trigger"
type=
"primary"
style=
"margin-left: 10px;"
title=
"只能上传视频文件"
>
上传视频
</el-button>
<el-button
slot=
"trigger"
type=
"primary"
style=
"margin-left: 10px;"
title=
"只能上传视频文件"
>
上传视频
</el-button>
</el-upload>
</el-upload>
...
@@ -64,15 +68,18 @@
...
@@ -64,15 +68,18 @@
<video
controls
width=
"100%"
>
<video
controls
width=
"100%"
>
<source
:src=
o.video
type=
"video/mp4"
>
<source
:src=
o.video
type=
"video/mp4"
>
</video>
</video>
<div
style=
"padding: 14px;"
>
<div
style=
"padding: 14px; display: flex; align-items: center;"
>
<span>
{{
o
.
videoName
}}
</span>
<span
class=
"searchListSpan"
v-bind:title=
"o.videoName"
style=
"flex: 1;"
>
{{
o
.
videoName
}}
</span>
<el-button
class=
"searchListButton"
type=
"success"
style=
"margin-left: 10px"
@
click=
"open(o)"
>
<div
style=
"display: flex;"
>
编辑
<el-button
class=
"searchListButton"
type=
"success"
style=
"margin-left: 10px;"
@
click=
"open(o)"
>
</el-button>
编辑
<el-button
class=
"searchListButton"
type=
"success"
style=
"margin-left: 10px"
@
click=
"deleteVideo(o.videoId)"
>
</el-button>
删除
<el-button
class=
"searchListButton"
type=
"success"
style=
"margin-left: 10px;"
@
click=
"deleteVideo(o.videoId)"
>
</el-button>
删除
</el-button>
</div>
</div>
</div>
</el-card>
</el-card>
</el-col>
</el-col>
</el-row>
</el-row>
...
@@ -88,6 +95,7 @@
...
@@ -88,6 +95,7 @@
name
:
"addVideo"
,
name
:
"addVideo"
,
data
()
{
data
()
{
return
{
return
{
fullscreenLoading
:
false
,
searchForm
:
{
searchForm
:
{
videoNmae
:
''
,
videoNmae
:
''
,
uploadTime
:
[],
uploadTime
:
[],
...
@@ -171,16 +179,11 @@
...
@@ -171,16 +179,11 @@
//提交
//提交
submitForm
()
{
submitForm
()
{
this
.
fullscreenLoading
=
true
console
.
log
(
this
.
video
)
console
.
log
(
this
.
video
)
if
(
!
this
.
video
)
{
if
(
!
this
.
video
)
{
return
;
return
;
console
.
log
(
111111111111111
)
}
const
isLt10M
=
this
.
video
.
size
/
1024
/
1024
<
10
;
if
(
!
isLt10M
)
{
this
.
$message
.
error
(
'上传视频文件不能超过10MB!'
);
}
}
console
.
log
(
isLt10M
);
let
date
=
new
Date
()
let
date
=
new
Date
()
let
params
=
new
FormData
();
let
params
=
new
FormData
();
...
@@ -196,6 +199,7 @@
...
@@ -196,6 +199,7 @@
if
(
res
.
data
.
code
==
200
)
{
if
(
res
.
data
.
code
==
200
)
{
this
.
fileList
=
[]
this
.
fileList
=
[]
this
.
video
=
''
this
.
video
=
''
this
.
fullscreenLoading
=
false
this
.
$message
.
success
(
'添加成功'
);
this
.
$message
.
success
(
'添加成功'
);
this
.
videoList
();
this
.
videoList
();
// 重置上传组件
// 重置上传组件
...
@@ -232,7 +236,7 @@
...
@@ -232,7 +236,7 @@
}).
then
(
res
=>
{
}).
then
(
res
=>
{
if
(
res
.
data
.
code
==
200
)
{
if
(
res
.
data
.
code
==
200
)
{
this
.
videoLists
=
res
.
data
.
data
this
.
videoLists
=
res
.
data
.
data
this
.
$message
.
success
(
'
模糊
查询成功'
);
this
.
$message
.
success
(
'查询成功'
);
}
}
})
})
}
}
...
@@ -245,6 +249,13 @@
...
@@ -245,6 +249,13 @@
</
script
>
</
script
>
<
style
lang=
"scss"
scoped
>
<
style
lang=
"scss"
scoped
>
.searchListSpan
{
display
:
flex
;
align-items
:
center
;
white-space
:
nowrap
;
/* 不换行 */
overflow
:
hidden
;
/* 隐藏溢出部分 */
text-overflow
:
ellipsis
;
/* 显示省略号 */
}
.el-col-6
{
.el-col-6
{
display
:
flex
;
display
:
flex
;
}
}
...
...
src/components/videoList/packages/vue-mini-player/src/PlayBtn.vue
View file @
74d8a8b1
...
@@ -63,8 +63,52 @@ export default {
...
@@ -63,8 +63,52 @@ export default {
methods
:
{
methods
:
{
handleClick
()
{
handleClick
()
{
this
.
$emit
(
'update:isPlaying'
,
!
this
.
isPlaying
);
this
.
$emit
(
'update:isPlaying'
,
!
this
.
isPlaying
);
if
(
!
this
.
isPlaying
)
{
//点击播放自动全屏
console
.
log
(
"进来了"
)
const
baseControlsEl
=
this
.
$parent
.
$container
;
console
.
log
(
baseControlsEl
)
this
.
reqFullScreen
(
baseControlsEl
);
}
},
reqFullScreen
(
element
)
{
console
.
log
(
'进入全屏'
);
if
(
element
.
requestFullscreen
)
{
element
.
requestFullscreen
();
}
else
if
(
element
.
mozRequestFullScreen
)
{
element
.
mozRequestFullScreen
();
}
else
if
(
element
.
webkitRequestFullScreen
)
{
element
.
webkitRequestFullScreen
();
}
else
if
(
element
.
webkitEnterFullscreen
)
{
element
.
webkitEnterFullscreen
();
}
else
if
(
this
.
$video
.
webkitEnterFullscreen
)
{
this
.
$video
.
webkitEnterFullscreen
();
}
else
if
(
element
.
msRequestFullscreen
)
{
element
.
msRequestFullscreen
();
}
else
{
console
.
log
(
'进入全屏失败'
);
}
},
},
/* mounted() {
const controlsElement = document.querySelectorAll('.qun-base-controls');
console.log(controlsElement)
if (controlsElement) {
controlsElement.forEach(e=>{
e.style.display = 'none';
})
}
}
}
const controlsElement1 = document.querySelectorAll('._play-btn');
console.log(controlsElement1)
if (controlsElement1) {
controlsElement1.forEach(e=>{
e.style.display = 'none';
})
}
}*/
};
};
</
script
>
</
script
>
...
...
src/components/videoList/packages/vue-mini-player/src/VuePlayer.vue
View file @
74d8a8b1
...
@@ -78,7 +78,7 @@ export default {
...
@@ -78,7 +78,7 @@ export default {
clearModeTimer
:
null
,
clearModeTimer
:
null
,
isStart
:
true
,
isStart
:
true
,
isPlaying
:
false
,
isPlaying
:
false
,
isClearMode
:
false
isClearMode
:
true
//默认是否展示播放和进度条
};
};
},
},
watch
:
{
watch
:
{
...
@@ -166,7 +166,7 @@ export default {
...
@@ -166,7 +166,7 @@ export default {
this
.
isClearMode
=
true
;
this
.
isClearMode
=
true
;
this
.
clearModeTimer
=
null
this
.
clearModeTimer
=
null
this
.
$emit
(
'clearMode'
);
this
.
$emit
(
'clearMode'
);
},
3
000
);
},
2
000
);
},
},
pauseAllVideo
()
{
pauseAllVideo
()
{
if
(
this
.
mutex
)
{
if
(
this
.
mutex
)
{
...
@@ -222,7 +222,8 @@ export default {
...
@@ -222,7 +222,8 @@ export default {
</
script
>
</
script
>
<
style
lang=
"scss"
scoped
>
<
style
lang=
"scss"
scoped
>
.vm-player
{
.vm-player
{
width
:
100%
;
margin
:
5px
;
/*width: 100%;*/
height
:
100%
;
height
:
100%
;
min-height
:
10em
;
min-height
:
10em
;
position
:
relative
;
position
:
relative
;
...
...
src/components/videoList/packages/vue-mini-player/src/controls/Fullscreen.vue
View file @
74d8a8b1
...
@@ -55,6 +55,31 @@ export default {
...
@@ -55,6 +55,31 @@ export default {
const
fullEle
=
const
fullEle
=
document
.
fullscreenElement
||
document
.
mozFullScreenElement
||
document
.
msFullscreenElement
||
document
.
webkitFullscreenElement
;
document
.
fullscreenElement
||
document
.
mozFullScreenElement
||
document
.
msFullscreenElement
||
document
.
webkitFullscreenElement
;
this
.
$emit
(
'update:isFullscreen'
,
!!
fullEle
);
this
.
$emit
(
'update:isFullscreen'
,
!!
fullEle
);
if
(
this
.
isFullscreen
)
{
// 退出全屏停止播放视频
const
videoElements
=
document
.
querySelectorAll
(
"._video-ref"
)
console
.
log
(
videoElements
)
for
(
let
i
=
0
;
i
<
videoElements
.
length
;
i
++
)
{
videoElements
[
i
].
pause
();
}
const
controlsElement
=
document
.
querySelectorAll
(
'.qun-base-controls'
);
console
.
log
(
controlsElement
)
if
(
controlsElement
)
{
controlsElement
.
forEach
(
e
=>
{
e
.
style
.
display
=
'none'
;
})
}
const
controlsElement1
=
document
.
querySelectorAll
(
'._play-btn'
);
console
.
log
(
controlsElement1
)
if
(
controlsElement1
)
{
controlsElement1
.
forEach
(
e
=>
{
e
.
style
.
display
=
'none'
;
})
}
}
},
},
reqFullScreen
(
element
)
{
reqFullScreen
(
element
)
{
if
(
element
.
requestFullscreen
)
{
if
(
element
.
requestFullscreen
)
{
...
@@ -86,6 +111,8 @@ export default {
...
@@ -86,6 +111,8 @@ export default {
}
else
if
(
document
.
webkitCancelFullScreen
)
{
}
else
if
(
document
.
webkitCancelFullScreen
)
{
document
.
webkitCancelFullScreen
();
document
.
webkitCancelFullScreen
();
}
}
},
},
docfullscreenchange
()
{
docfullscreenchange
()
{
this
.
setFullscreenState
();
this
.
setFullscreenState
();
...
...
src/components/videoList/videoList.vue
View file @
74d8a8b1
...
@@ -4,14 +4,55 @@
...
@@ -4,14 +4,55 @@
<ul
class=
"item"
>
<ul
class=
"item"
>
<div
style=
"display: flex;"
>
<div
style=
"display: flex;"
>
<img
class=
"jinhuiClass"
src=
"@/assets/img/jinhui.png"
alt=
""
/>
<img
class=
"jinhuiClass"
src=
"@/assets/img/jinhui.png"
alt=
""
/>
<li
style=
" font-family:'youshe';color:
black;font-size: 45px; text-shadow: 8px 1px 1px #888888;"
>
计算机计算机-{source}}
</li>
<li
style=
" font-family:'youshe';color:
white;font-size: 45px;"
>
刑侦百科-线上视频学习
</li>
</div>
</div>
</ul>
</ul>
</div>
</div>
<div>
<div>
<div
class=
"tabs"
>
<el-form
ref=
"searchForm"
:model=
"searchForm"
>
<el-row>
<el-col
:span=
"6"
>
<el-form-item
label=
"文件名称 :"
style=
"display: flex;font-weight: bold"
>
<el-input
v-model=
"searchForm.videoNmae"
clearable
placeholder=
"请输入文件名称检索"
></el-input>
</el-form-item>
</el-col>
<!--
<el-col
:span=
"9"
>
<el-form-item
label=
"创建时间"
>
<el-date-picker
v-model=
"searchForm.uploadTime"
value-format=
"yyyy-MM-dd"
type=
"daterange"
range-separator=
"至"
start-placeholder=
"开始日期"
end-placeholder=
"结束日期"
>
</el-date-picker>
</el-form-item>
</el-col>
-->
<el-col
:span=
"6"
>
<el-button
class=
"toEmptyButton"
@
click=
"toEmpty"
>
<span
class=
"skyp icon-sousuo"
></span>
清空
</el-button>
<el-button
class=
"searchListButton"
@
click=
"searchList()"
>
<span
class=
"skyp icon-sousuo"
></span>
查询
</el-button>
<!--
<el-button
class=
"searchListButton"
type=
"success"
style=
"margin-left: 10px"
>
当前视频总数
{{
this
.
videoLists
.
length
}}
</el-button>
-->
</el-col>
</el-row>
</el-form>
</div>
<section
class=
"main"
v-for=
"(o, index) in videoLists"
:key=
"o.videoId"
>
<section
class=
"main"
v-for=
"(o, index) in videoLists"
:key=
"o.videoId"
>
<div
class=
"videoBox"
>
<div
class=
"videoBox"
>
<p
class=
"videoTitle"
>
{{
o
.
videoName
}}
</p>
<p
class=
"videoTitle"
v-bind:title=
"o.videoName"
style=
"flex: 1;"
>
{{
o
.
videoName
}}
</p>
<QunVideo
:url=
o.video
/>
<QunVideo
:url=
o.video
/>
</div>
</div>
</section>
</section>
...
@@ -31,7 +72,10 @@
...
@@ -31,7 +72,10 @@
data
()
{
data
()
{
return
{
return
{
videoLists
:
[],
//视频列表
videoLists
:
[],
//视频列表
searchForm
:
{
videoNmae
:
''
,
uploadTime
:
[],
},
};
};
},
},
methods
:
{
methods
:
{
...
@@ -49,8 +93,61 @@
...
@@ -49,8 +93,61 @@
this
.
videoLists
=
res
.
data
.
data
this
.
videoLists
=
res
.
data
.
data
}
}
})
})
}
},
//删除
deleteVideo
(
videoId
){
let
params
=
new
FormData
();
params
.
append
(
"id"
,
videoId
)
this
.
$axios
({
url
:
'/api/deleteVideo'
,
method
:
'post'
,
data
:
params
}).
then
(
res
=>
{
if
(
res
.
data
.
code
==
200
)
{
this
.
$message
.
success
(
'删除成功'
);
this
.
videoList
()
}
})
},
//清空
toEmpty
()
{
this
.
searchForm
=
{
videoNmae
:
''
,
uploadTime
:
[],
}
this
.
videoList
()
},
//添加照片
handlePhotoChange
(
file
)
{
console
.
log
(
"添加照片"
)
this
.
video
=
file
.
raw
this
.
videoName
=
file
.
name
this
.
fileList
.
push
(
file
.
raw
);
this
.
submitForm
();
},
//模糊查询
searchList
()
{
console
.
log
(
this
.
searchForm
.
uploadTime
)
let
params
=
new
FormData
();
params
.
append
(
"name"
,
this
.
searchForm
.
videoNmae
)
if
(
this
.
searchForm
.
uploadTime
[
0
]){
params
.
append
(
"startTime"
,
this
.
searchForm
.
uploadTime
[
0
])
}
if
(
this
.
searchForm
.
uploadTime
[
1
]){
params
.
append
(
"endTime"
,
this
.
searchForm
.
uploadTime
[
1
])
}
this
.
$axios
({
url
:
'/api/selectVideoByNameOrTime'
,
method
:
'post'
,
data
:
params
}).
then
(
res
=>
{
if
(
res
.
data
.
code
==
200
)
{
this
.
videoLists
=
res
.
data
.
data
this
.
$message
.
success
(
'模糊查询成功'
);
}
})
}
},
},
created
()
{
created
()
{
this
.
videoList
()
this
.
videoList
()
...
@@ -59,6 +156,27 @@
...
@@ -59,6 +156,27 @@
</
script
>
</
script
>
<
style
lang=
"scss"
scoped
>
<
style
lang=
"scss"
scoped
>
.el-col-6
{
width
:
auto
;
margin-right
:
20px
;
}
.el-form-item
{
font-size
:
18px
!important
;
margin-bottom
:
0px
;
}
/*清空和查询*/
.toEmptyButton
,
.searchListButton
{
font-weight
:
bold
;
font-size
:
18px
;
}
.tabs
{
margin-top
:
15px
;
margin-left
:
15px
;
}
@font-face
{
font-family
:
"youshe"
;
src
:
url("../../assets/fonts/YouSheBiaoTiHei-2.ttf")
;
}
.jinhuiClass
{
.jinhuiClass
{
height
:
80px
;
height
:
80px
;
margin-right
:
5px
;
margin-right
:
5px
;
...
@@ -66,7 +184,7 @@
...
@@ -66,7 +184,7 @@
margin-bottom
:
-15px
margin-bottom
:
-15px
}
}
.top
{
.top
{
background
-color
:
rgb
(
39
,
118
,
223
)
;
background
:
url('../../assets/img/title2.jpg')
left
/
cover
no-repeat
;
}
}
.item
{
.item
{
display
:
flex
;
display
:
flex
;
...
@@ -88,7 +206,7 @@
...
@@ -88,7 +206,7 @@
-moz-osx-font-smoothing
:
grayscale
;
-moz-osx-font-smoothing
:
grayscale
;
color
:
#2c3e50
;
color
:
#2c3e50
;
height
:
100%
;
height
:
100%
;
background
:
url(
"../../assets/img/beijing111.jpg")
no-repeat
;
background
:
url(
'../../assets/img/beij2.jpg')
left
/
cover
no-repeat
;
background-size
:
100%
100%
;
background-size
:
100%
100%
;
max-height
:
100%
;
/* 设置固定高度,根据需要调整 */
max-height
:
100%
;
/* 设置固定高度,根据需要调整 */
overflow
:
auto
;
/* 添加滚动条 */
overflow
:
auto
;
/* 添加滚动条 */
...
@@ -121,6 +239,12 @@
...
@@ -121,6 +239,12 @@
margin-right
:
15px
;
margin-right
:
15px
;
margin-top
:
15px
;
margin-top
:
15px
;
.videoTitle
{
.videoTitle
{
width
:
200px
;
display
:
flex
;
align-items
:
center
;
white-space
:
nowrap
;
/* 不换行 */
overflow
:
hidden
;
/* 隐藏溢出部分 */
text-overflow
:
ellipsis
;
/* 显示省略号 */
color
:
#fff
;
color
:
#fff
;
font-weight
:
600
;
font-weight
:
600
;
line-height
:
30px
;
line-height
:
30px
;
...
...
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