feat: 优化招生官页面样式和功能
- 新增H5页面相关文件 - 调整CSS样式，修复移动端适配问题 - 优化宣讲会列表显示和时间格式化 - 改进视频播放器交互逻辑 - 修复课程标签显示问题
This commit is contained in:
DESKTOP-RQ919RC\Pc
5
1.svg
5
1.svg
@@ -1,5 +0,0 @@
|
|||||||
<svg class="svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" version="1.1" width="100px" height="28px" fill="#016436">
|
|
||||||
<g transform="matrix(1 0 0 1 -910 -1138 )">
|
|
||||||
<path d="M 910 1166 L 918.4 1138 L 1010 1138 L 1001.6 1166 L 910 1166 Z " fill-rule="nonzero" stroke="none" />
|
|
||||||
</g>
|
|
||||||
</svg>
|
|
||||||
|
Before Width: | Height: | Size: 340 B |
39
H5/h5.css
Normal file
39
H5/h5.css
Normal file
@@ -0,0 +1,39 @@
|
|||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
background-color: #f6f6f6;
|
||||||
|
}
|
||||||
|
.admission-officer {
|
||||||
|
min-height: 100vh;
|
||||||
|
background-color: #f6f6f6;
|
||||||
|
}
|
||||||
|
.admission-officer * {
|
||||||
|
padding: 0;
|
||||||
|
margin: 0;
|
||||||
|
box-sizing: border-box;
|
||||||
|
scroll-behavior: smooth;
|
||||||
|
}
|
||||||
|
.admission-officer .flexflex {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
.admission-officer .flexcenter {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.admission-officer .flexacenter {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
.admission-officer .flex1 {
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
.admission-officer img {
|
||||||
|
object-fit: cover;
|
||||||
|
}
|
||||||
|
.admission-officer a {
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
.admission-officer .aaaa {
|
||||||
|
width: 10rem;
|
||||||
|
height: 6.25rem;
|
||||||
|
}
|
||||||
38
H5/h5.html
Normal file
38
H5/h5.html
Normal file
@@ -0,0 +1,38 @@
|
|||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en">
|
||||||
|
<head>
|
||||||
|
<meta charset="UTF-8" />
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
||||||
|
<title>Document</title>
|
||||||
|
<link rel="stylesheet" href="./h5.css" />
|
||||||
|
</head>
|
||||||
|
<body>
|
||||||
|
<script>
|
||||||
|
(function (doc, win) {
|
||||||
|
var docEl = doc.documentElement,
|
||||||
|
resizeEvt = "orientationchange" in window ? "orientationchange" : "resize",
|
||||||
|
recalc = function () {
|
||||||
|
var clientWidth = docEl.clientWidth;
|
||||||
|
if (!clientWidth) return;
|
||||||
|
if (clientWidth >= 750) {
|
||||||
|
docEl.style.fontSize = "100px";
|
||||||
|
} else {
|
||||||
|
docEl.style.fontSize = 100 * (clientWidth / 750) + "px";
|
||||||
|
}
|
||||||
|
};
|
||||||
|
if (!doc.addEventListener) return;
|
||||||
|
win.addEventListener(resizeEvt, recalc, false);
|
||||||
|
doc.addEventListener("DOMContentLoaded", recalc, false);
|
||||||
|
})(document, window);
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<div id="admission-officer" class="admission-officer" v-cloak>
|
||||||
|
|
||||||
|
<div class="aaaa"></div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<!-- 引入了 vue3 js 创建 vue3 实例 -->
|
||||||
|
<script src="../js/vue.global.min.js"></script>
|
||||||
|
<script src="../js/artplayer.js"></script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
47
H5/h5.less
Normal file
47
H5/h5.less
Normal file
@@ -0,0 +1,47 @@
|
|||||||
|
body {
|
||||||
|
margin: 0;
|
||||||
|
background-color: rgba(246, 246, 246, 1);
|
||||||
|
}
|
||||||
|
.admission-officer {
|
||||||
|
min-height: 100vh;
|
||||||
|
background-color: rgba(246, 246, 246, 1);
|
||||||
|
|
||||||
|
* {
|
||||||
|
padding: 0;
|
||||||
|
margin: 0;
|
||||||
|
box-sizing: border-box;
|
||||||
|
scroll-behavior: smooth;
|
||||||
|
}
|
||||||
|
|
||||||
|
.flexflex {
|
||||||
|
display: flex;
|
||||||
|
}
|
||||||
|
|
||||||
|
.flexcenter {
|
||||||
|
display: flex;
|
||||||
|
justify-content: center;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.flexacenter {
|
||||||
|
display: flex;
|
||||||
|
align-items: center;
|
||||||
|
}
|
||||||
|
|
||||||
|
.flex1 {
|
||||||
|
flex: 1;
|
||||||
|
}
|
||||||
|
|
||||||
|
img {
|
||||||
|
object-fit: cover;
|
||||||
|
}
|
||||||
|
|
||||||
|
a {
|
||||||
|
text-decoration: none;
|
||||||
|
}
|
||||||
|
|
||||||
|
.aaaa {
|
||||||
|
width: 10rem;
|
||||||
|
height: 6.25rem;
|
||||||
|
}
|
||||||
|
}
|
||||||
@@ -1,12 +1,17 @@
|
|||||||
* {
|
body {
|
||||||
padding: 0;
|
|
||||||
margin: 0;
|
margin: 0;
|
||||||
box-sizing: border-box;
|
background-color: #f6f6f6;
|
||||||
scroll-behavior: smooth;
|
|
||||||
}
|
}
|
||||||
.admission-officer {
|
.admission-officer {
|
||||||
min-height: 100vh;
|
min-height: 100vh;
|
||||||
background-color: #f6f6f6;
|
background-color: #f6f6f6;
|
||||||
|
min-width: 1200px;
|
||||||
|
}
|
||||||
|
.admission-officer * {
|
||||||
|
padding: 0;
|
||||||
|
margin: 0;
|
||||||
|
box-sizing: border-box;
|
||||||
|
scroll-behavior: smooth;
|
||||||
}
|
}
|
||||||
.admission-officer .flexflex {
|
.admission-officer .flexflex {
|
||||||
display: flex;
|
display: flex;
|
||||||
@@ -23,6 +28,9 @@
|
|||||||
.admission-officer .flex1 {
|
.admission-officer .flex1 {
|
||||||
flex: 1;
|
flex: 1;
|
||||||
}
|
}
|
||||||
|
.admission-officer img {
|
||||||
|
object-fit: cover;
|
||||||
|
}
|
||||||
.admission-officer a {
|
.admission-officer a {
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
}
|
}
|
||||||
@@ -42,6 +50,11 @@
|
|||||||
top: 60px;
|
top: 60px;
|
||||||
left: calc((100vw - 1200px) / 2);
|
left: calc((100vw - 1200px) / 2);
|
||||||
}
|
}
|
||||||
|
@media screen and (max-width: 1200px) {
|
||||||
|
.admission-officer .admission-head .admission-head-logo {
|
||||||
|
left: 0;
|
||||||
|
}
|
||||||
|
}
|
||||||
.admission-officer .admission-head .admission-head-box {
|
.admission-officer .admission-head .admission-head-box {
|
||||||
min-width: 1200px;
|
min-width: 1200px;
|
||||||
height: 216px;
|
height: 216px;
|
||||||
@@ -678,9 +691,6 @@
|
|||||||
.admission-officer .admission-body .school-list .school-item .right .content .year .item.more.unfold {
|
.admission-officer .admission-body .school-list .school-item .right .content .year .item.more.unfold {
|
||||||
color: #fff;
|
color: #fff;
|
||||||
}
|
}
|
||||||
.admission-officer .admission-body .school-list .school-item .right .content .year .item.more.unfold .svg {
|
|
||||||
fill: #76c45e !important;
|
|
||||||
}
|
|
||||||
.admission-officer .admission-body .school-list .school-item .right .content .year .item.more.unfold .arrows {
|
.admission-officer .admission-body .school-list .school-item .right .content .year .item.more.unfold .arrows {
|
||||||
fill: #fff;
|
fill: #fff;
|
||||||
transform: translateY(-50%) rotate(180deg);
|
transform: translateY(-50%) rotate(180deg);
|
||||||
@@ -754,6 +764,10 @@
|
|||||||
color: #333333;
|
color: #333333;
|
||||||
margin-bottom: 8px;
|
margin-bottom: 8px;
|
||||||
}
|
}
|
||||||
|
.admission-officer .admission-body .school-list .school-item .right .content .course-list .item .name .text {
|
||||||
|
line-height: 28px;
|
||||||
|
display: inline;
|
||||||
|
}
|
||||||
.admission-officer .admission-body .school-list .school-item .right .content .course-list .item .name .label {
|
.admission-officer .admission-body .school-list .school-item .right .content .course-list .item .name .label {
|
||||||
height: 26px;
|
height: 26px;
|
||||||
line-height: 26px;
|
line-height: 26px;
|
||||||
@@ -765,6 +779,7 @@
|
|||||||
font-family: "ArialMT", "Arial", sans-serif;
|
font-family: "ArialMT", "Arial", sans-serif;
|
||||||
padding: 0 6px;
|
padding: 0 6px;
|
||||||
margin-left: 12px;
|
margin-left: 12px;
|
||||||
|
display: inline-flex;
|
||||||
}
|
}
|
||||||
.admission-officer .admission-body .school-list .school-item .right .content .course-list .item .name .label .arrows {
|
.admission-officer .admission-body .school-list .school-item .right .content .course-list .item .name .label .arrows {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
|||||||
@@ -1,12 +1,18 @@
|
|||||||
* {
|
body {
|
||||||
padding: 0;
|
|
||||||
margin: 0;
|
margin: 0;
|
||||||
box-sizing: border-box;
|
background-color: rgba(246, 246, 246, 1);
|
||||||
scroll-behavior: smooth;
|
|
||||||
}
|
}
|
||||||
|
|
||||||
.admission-officer {
|
.admission-officer {
|
||||||
min-height: 100vh;
|
min-height: 100vh;
|
||||||
background-color: rgba(246, 246, 246, 1);
|
background-color: rgba(246, 246, 246, 1);
|
||||||
|
min-width: 1200px;
|
||||||
|
* {
|
||||||
|
padding: 0;
|
||||||
|
margin: 0;
|
||||||
|
box-sizing: border-box;
|
||||||
|
scroll-behavior: smooth;
|
||||||
|
}
|
||||||
.flexflex {
|
.flexflex {
|
||||||
display: flex;
|
display: flex;
|
||||||
}
|
}
|
||||||
@@ -26,6 +32,10 @@
|
|||||||
flex: 1;
|
flex: 1;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
img {
|
||||||
|
object-fit: cover;
|
||||||
|
}
|
||||||
|
|
||||||
a {
|
a {
|
||||||
text-decoration: none;
|
text-decoration: none;
|
||||||
&:hover {
|
&:hover {
|
||||||
@@ -45,6 +55,9 @@
|
|||||||
position: absolute;
|
position: absolute;
|
||||||
top: 60px;
|
top: 60px;
|
||||||
left: calc((100vw - 1200px) / 2);
|
left: calc((100vw - 1200px) / 2);
|
||||||
|
@media screen and (max-width: 1200px) {
|
||||||
|
left: 0;
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
.admission-head-box {
|
.admission-head-box {
|
||||||
@@ -759,7 +772,7 @@
|
|||||||
&.unfold {
|
&.unfold {
|
||||||
color: #fff;
|
color: #fff;
|
||||||
.svg {
|
.svg {
|
||||||
fill: #76c45e !important;
|
// fill: #76c45e !important;
|
||||||
}
|
}
|
||||||
.arrows {
|
.arrows {
|
||||||
fill: #fff;
|
fill: #fff;
|
||||||
@@ -844,6 +857,12 @@
|
|||||||
font-size: 16px;
|
font-size: 16px;
|
||||||
color: #333333;
|
color: #333333;
|
||||||
margin-bottom: 8px;
|
margin-bottom: 8px;
|
||||||
|
|
||||||
|
.text {
|
||||||
|
line-height: 28px;
|
||||||
|
display: inline;
|
||||||
|
}
|
||||||
|
|
||||||
.label {
|
.label {
|
||||||
height: 26px;
|
height: 26px;
|
||||||
line-height: 26px;
|
line-height: 26px;
|
||||||
@@ -855,6 +874,7 @@
|
|||||||
font-family: "ArialMT", "Arial", sans-serif;
|
font-family: "ArialMT", "Arial", sans-serif;
|
||||||
padding: 0 6px;
|
padding: 0 6px;
|
||||||
margin-left: 12px;
|
margin-left: 12px;
|
||||||
|
display: inline-flex;
|
||||||
|
|
||||||
.arrows {
|
.arrows {
|
||||||
position: absolute;
|
position: absolute;
|
||||||
|
|||||||
73
index.html
73
index.html
@@ -87,8 +87,8 @@
|
|||||||
<div class="list">
|
<div class="list">
|
||||||
<div class="item flexacenter" :class="[{'pitch': preachI == index},{'pitch-last': preachI - 1 == index}]" v-for="(item, index) in preachList[preachIndex]" @click="preachI = index">
|
<div class="item flexacenter" :class="[{'pitch': preachI == index},{'pitch-last': preachI - 1 == index}]" v-for="(item, index) in preachList[preachIndex]" @click="preachI = index">
|
||||||
<div class="info flex1">
|
<div class="info flex1">
|
||||||
<div class="name">{{ item.title }}{{ item.id }}</div>
|
<div class="name">{{ item.title }}</div>
|
||||||
<div class="time">{{ item.lecture_time }}</div>
|
<div class="time">{{ item.lecture_time || '长期答疑' }}</div>
|
||||||
</div>
|
</div>
|
||||||
<img class="icon" src="./img/arrows-full-circle-white.svg" />
|
<img class="icon" src="./img/arrows-full-circle-white.svg" />
|
||||||
</div>
|
</div>
|
||||||
@@ -122,7 +122,7 @@
|
|||||||
</div>
|
</div>
|
||||||
<div class="swiper flexacenter" ref="swiperRef">
|
<div class="swiper flexacenter" ref="swiperRef">
|
||||||
<div class="swiper-item" v-for="item in interviewList" @click="getVideoUrl(item.token)">
|
<div class="swiper-item" v-for="item in interviewList" @click="getVideoUrl(item.token)">
|
||||||
<img class="img" src="https://axure-file.lanhuapp.com/md5__d360c330dfaa81d2fad4ef78a5e74bb1.svg" />
|
<img class="img" :src="item.video_cover" />
|
||||||
<div class="bottom">
|
<div class="bottom">
|
||||||
<div class="title">{{ item.title }}</div>
|
<div class="title">{{ item.title }}</div>
|
||||||
<div class="subtitle">{{ item.subtitle }}</div>
|
<div class="subtitle">{{ item.subtitle }}</div>
|
||||||
@@ -174,22 +174,24 @@
|
|||||||
<g transform="matrix(1 0 0 1 -1370 -1149 )"><path d="M 8.8330078125 0.164930555555556 C 8.9443359375 0.274884259259259 9 0.405092592592591 9 0.555555555555556 C 9 0.706018518518518 8.9443359375 0.836226851851851 8.8330078125 0.946180555555556 L 4.8955078125 4.83506944444444 C 4.7841796875 4.94502314814815 4.65234375 5 4.5 5 C 4.34765625 5 4.2158203125 4.94502314814815 4.1044921875 4.83506944444444 L 0.1669921875 0.946180555555556 C 0.0556640625 0.836226851851851 0 0.706018518518518 0 0.555555555555556 C 0 0.405092592592591 0.0556640625 0.274884259259259 0.1669921875 0.164930555555556 C 0.2783203125 0.0549768518518512 0.41015625 0 0.5625 0 L 8.4375 0 C 8.58984375 0 8.7216796875 0.0549768518518512 8.8330078125 0.164930555555556 Z " fill-rule="nonzero" stroke="none" transform="matrix(1 0 0 1 1370 1149 )" /></g>
|
<g transform="matrix(1 0 0 1 -1370 -1149 )"><path d="M 8.8330078125 0.164930555555556 C 8.9443359375 0.274884259259259 9 0.405092592592591 9 0.555555555555556 C 9 0.706018518518518 8.9443359375 0.836226851851851 8.8330078125 0.946180555555556 L 4.8955078125 4.83506944444444 C 4.7841796875 4.94502314814815 4.65234375 5 4.5 5 C 4.34765625 5 4.2158203125 4.94502314814815 4.1044921875 4.83506944444444 L 0.1669921875 0.946180555555556 C 0.0556640625 0.836226851851851 0 0.706018518518518 0 0.555555555555556 C 0 0.405092592592591 0.0556640625 0.274884259259259 0.1669921875 0.164930555555556 C 0.2783203125 0.0549768518518512 0.41015625 0 0.5625 0 L 8.4375 0 C 8.58984375 0 8.7216796875 0.0549768518518512 8.8330078125 0.164930555555556 Z " fill-rule="nonzero" stroke="none" transform="matrix(1 0 0 1 1370 1149 )" /></g>
|
||||||
</svg>
|
</svg>
|
||||||
<div class="more-mask" @click.stop="closeSchoolYearState(index)"></div>
|
<div class="more-mask" @click.stop="closeSchoolYearState(index)"></div>
|
||||||
<div class="more-box">
|
<div class="more-box" :style="{ backgroundColor: item.color }">
|
||||||
<div class="more-item" v-for="it in item.yListMore" @click.stop="selectSchoolYearState(index, it)">{{ it }}季</div>
|
<div class="more-item" v-for="it in item.yListMore" @click.stop="selectSchoolYearState(index, it)">{{ it }}季1</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<div class="course-list">
|
<div class="course-list">
|
||||||
<div class="item" v-for="it in item.list[item.pitch]">
|
<div class="item" v-for="it in item.list[item.pitch]">
|
||||||
<div class="name flexacenter">
|
<div class="name flexflex">
|
||||||
<div class="icon flexcenter">
|
<div class="icon flexcenter">
|
||||||
<img class="img" src="./img/course-icon.png" />
|
<img class="img" src="./img/course-icon.png" />
|
||||||
</div>
|
</div>
|
||||||
{{ it.title }}
|
<div class="text flex1">
|
||||||
<div class="label" v-if="it.tag">
|
{{ it.title }}
|
||||||
<img class="arrows" src="./img/arrows-triangle-blue.svg" />
|
<div class="label" v-if="it.tag">
|
||||||
{{ it.tag }}
|
<img class="arrows" src="./img/arrows-triangle-blue.svg" />
|
||||||
|
{{ it.tag }}
|
||||||
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
<div class="bottom flexacenter">
|
<div class="bottom flexacenter">
|
||||||
@@ -227,7 +229,7 @@
|
|||||||
</svg>
|
</svg>
|
||||||
{{ it }}季
|
{{ it }}季
|
||||||
</div>
|
</div>
|
||||||
<div class="year-item" v-if=" item.year.length > 4">
|
<div class="year-item" v-if="item.year.length > 4">
|
||||||
<svg class="svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" version="1.1" width="80px" height="24px">
|
<svg class="svg" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg" version="1.1" width="80px" height="24px">
|
||||||
<g transform="matrix(1 0 0 1 -841 -2919 )"><path d="M 841 2943 L 848.2 2919 L 921 2919 L 913.8 2943 L 841 2943 Z " fill-rule="nonzero" fill="#ffffff" stroke="none" /></g>
|
<g transform="matrix(1 0 0 1 -841 -2919 )"><path d="M 841 2943 L 848.2 2919 L 921 2919 L 913.8 2943 L 841 2943 Z " fill-rule="nonzero" fill="#ffffff" stroke="none" /></g>
|
||||||
</svg>
|
</svg>
|
||||||
@@ -295,7 +297,7 @@
|
|||||||
<div class="icon flexcenter">
|
<div class="icon flexcenter">
|
||||||
<img class="img" src="./img/time-icon.png" />
|
<img class="img" src="./img/time-icon.png" />
|
||||||
</div>
|
</div>
|
||||||
长期答疑
|
{{ item.date || '长期答疑'}}
|
||||||
</div>
|
</div>
|
||||||
<a class="btn flexcenter" :href="item.url" target="_blank">
|
<a class="btn flexcenter" :href="item.url" target="_blank">
|
||||||
了解详情
|
了解详情
|
||||||
@@ -312,7 +314,6 @@
|
|||||||
<div class="paly-box">
|
<div class="paly-box">
|
||||||
<img class="close" src="./img/cross-white.svg" @click="closePalyState" />
|
<img class="close" src="./img/cross-white.svg" @click="closePalyState" />
|
||||||
<div class="paly-video"></div>
|
<div class="paly-video"></div>
|
||||||
<!-- <video src="https://cdnfhnfile.115cdn.net/6870d9500edfa26822026f57689fdaa03fc219f0/%E5%B2%AD%E5%8D%97%E5%A4%A7%E5%AD%A6%E4%BF%9D%E9%99%A9.mp4?t=1752554944&u=100031698&s=524288000&d=vip-3070654841-cg2ys1g7vy7k4dxg0-1-0&c=2&f=1&k=c82d0e21cd73d578a6881d6386bdeb4d&us=5242880000&uc=10&v=1"></video> -->
|
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
@@ -325,7 +326,7 @@
|
|||||||
<script>
|
<script>
|
||||||
// 创建Vue3实例
|
// 创建Vue3实例
|
||||||
const { createApp, onMounted, ref, onUnmounted } = Vue;
|
const { createApp, onMounted, ref, onUnmounted } = Vue;
|
||||||
const app = createApp({
|
const admissionApp = createApp({
|
||||||
setup() {
|
setup() {
|
||||||
const isPlaying = ref(false);
|
const isPlaying = ref(false);
|
||||||
const swiperRef = ref(null);
|
const swiperRef = ref(null);
|
||||||
@@ -358,15 +359,14 @@
|
|||||||
};
|
};
|
||||||
|
|
||||||
const scrollRight = () => {
|
const scrollRight = () => {
|
||||||
if (swiperRef.value) {
|
if (!swiperRef.value) return;
|
||||||
swiperRef.value.scrollTo({
|
swiperRef.value.scrollTo({
|
||||||
left: swiperRef.value.scrollLeft + 366,
|
left: swiperRef.value.scrollLeft + 366,
|
||||||
behavior: "smooth",
|
behavior: "smooth",
|
||||||
});
|
});
|
||||||
}
|
|
||||||
};
|
};
|
||||||
|
|
||||||
const theme = ref(1); // 主题 1 2
|
const theme = ref(2); // 主题 1 2
|
||||||
|
|
||||||
onMounted(() => {
|
onMounted(() => {
|
||||||
init();
|
init();
|
||||||
@@ -381,16 +381,13 @@
|
|||||||
const init = () => {
|
const init = () => {
|
||||||
fetchData("/v1/admissionsOfficer/interview").then((res) => {
|
fetchData("/v1/admissionsOfficer/interview").then((res) => {
|
||||||
if (res.code != 200) return;
|
if (res.code != 200) return;
|
||||||
|
|
||||||
let data = res.data || [];
|
let data = res.data || [];
|
||||||
|
|
||||||
data.forEach((element) => (element.focus_of_this_issue = element.focus_of_this_issue.split(/\r?\n/)));
|
data.forEach((element) => (element.focus_of_this_issue = element.focus_of_this_issue.split(/\r?\n/)));
|
||||||
|
|
||||||
if (theme.value == 1) {
|
if (theme.value == 1) {
|
||||||
let target = null;
|
let target = null;
|
||||||
const topItems = data.filter((item) => item.istop === 1);
|
const topItems = data.filter((item) => item.istop === 1);
|
||||||
if (topItems.length > 0) target = topItems[Math.floor(Math.random() * topItems.length)];
|
if (topItems.length > 0) target = topItems[Math.floor(Math.random() * topItems.length)];
|
||||||
data = data.filter((item) => !(item.istop === 1 && item.id === target.id));
|
data = data.filter((item) => item.id !== target.id);
|
||||||
interviewData.value = target;
|
interviewData.value = target;
|
||||||
}
|
}
|
||||||
|
|
||||||
@@ -412,10 +409,6 @@
|
|||||||
fetchData(`/v1/admissionsOfficer/videoUrl?token=${token}`).then((res) => {
|
fetchData(`/v1/admissionsOfficer/videoUrl?token=${token}`).then((res) => {
|
||||||
console.log("res", res);
|
console.log("res", res);
|
||||||
palyState.value = true;
|
palyState.value = true;
|
||||||
// res.data.url = "https://dl1-v6.aliyundrive.cloud/dC9ELbBd%2F988690082%2F6870d948ef3b30d87fa84bc3a32fd16370f37c2e%2F6870d948f17001272f7c4c17b11d759a137ca234?ap=b8c990e60b18446eb07f5dca30398e8a&callback=eyJjYWxsYmFja1VybCI6Imh0dHA6Ly9iajI5LmFwaS1ocC5hbGl5dW5wZHMuY29tL3YyL2ZpbGUvZG93bmxvYWRfY2FsbGJhY2siLCJjYWxsYmFja0JvZHkiOiJodHRwSGVhZGVyLnJhbmdlPSR7aHR0cEhlYWRlci5yYW5nZX1cdTAwMjZidWNrZXQ9JHtidWNrZXR9XHUwMDI2b2JqZWN0PSR7b2JqZWN0fVx1MDAyNmRvbWFpbl9pZD0ke3g6ZG9tYWluX2lkfVx1MDAyNnVzZXJfaWQ9JHt4OnVzZXJfaWR9XHUwMDI2ZHJpdmVfaWQ9JHt4OmRyaXZlX2lkfVx1MDAyNmZpbGVfaWQ9JHt4OmZpbGVfaWR9XHUwMDI2cGRzX3BhcmFtcz0ke3g6cGRzX3BhcmFtc31cdTAwMjZ2ZXJzaW9uPSR7eDp2ZXJzaW9ufSIsImNhbGxiYWNrQm9keVR5cGUiOiJhcHBsaWNhdGlvbi94LXd3dy1mb3JtLXVybGVuY29kZWQiLCJjYWxsYmFja1N0YWdlIjoiYmVmb3JlLWV4ZWN1dGUiLCJjYWxsYmFja0ZhaWx1cmVBY3Rpb24iOiJpZ25vcmUifQ%3D%3D&callback-var=eyJ4OmRvbWFpbl9pZCI6ImJqMjkiLCJ4OnVzZXJfaWQiOiI3MDg3MzAwYmU2ZDM0OGMwODliOTU4NDM1MDVlN2U3MiIsIng6ZHJpdmVfaWQiOiI5ODg2OTAwODIiLCJ4OmZpbGVfaWQiOiI2ODcwZGViOTI4MTdiODljNGFmOTQyM2E5NWY0ZGU1MmY2YjA0N2M1IiwieDpwZHNfcGFyYW1zIjoie1wiYXBcIjpcImI4Yzk5MGU2MGIxODQ0NmViMDdmNWRjYTMwMzk4ZThhXCJ9IiwieDp2ZXJzaW9uIjoidjMifQ%3D%3D&di=bj29&dr=988690082&f=6870deb92817b89c4af9423a95f4de52f6b047c5&op=d&pds-params=%7B%22ap%22%3A%22b8c990e60b18446eb07f5dca30398e8a%22%7D&response-content-disposition=attachment%3B%20filename%2A%3DUTF-8%27%27%25E5%25B2%25AD%25E5%258D%2597%25E5%25A4%25A7%25E5%25AD%25A6%25E4%25BF%259D%25E9%2599%25A9.mp4&security-token=CAISvgJ1q6Ft5B2yfSjIr5nDE%2FfhmY5U8Kbeb0DZi1A7WMdt2fOZrjz2IHhMf3NpBOkZvvQ1lGlU6%2Fcalq5rR4QAXlDfNVT2OWG%2BqlHPWZHInuDox55m4cTXNAr%2BIhr%2F29CoEIedZdjBe%2FCrRknZnytou9XTfimjWFrXWv%2Fgy%2BQQDLItUxK%2FcCBNCfpPOwJms7V6D3bKMuu3OROY6Qi5TmgQ41Uh1jgjtPzkkpfFtkGF1GeXkLFF%2B97DRbG%2FdNRpMZtFVNO44fd7bKKp0lQLs0ARrv4r1fMUqW2X543AUgFLhy2KKMPY99xpFgh9a7j0iCbSGyUu%2FhcRm5sw9%2Byfo34lVYnewzJcyhXOy4IClLcc%2BmqdsRIvJzWstJ7Gf9LWqChvSgk4TxhhcNFKSTQrInFCB0%2BcRObJl16iK%2BF7UPXtuMkagAFphP8r3Ae8eUgHGTFSUZ16y1LK9OcgxB5wF%2B1Y%2F2WkLq22JaopX124joWne0xEWtK%2BD3nQ57EtFJXAH5XFVSpL8ey6q7%2B0SYYKfnDvV4AlMij6c73j2p%2BFZfWoqOtRPih9DHBr8rG%2FGUthBwtO1PmFMMhnhUaPX0LH3mDT7kxj4yAA&u=7087300be6d348c089b95843505e7e72&x-oss-access-key-id=STS.NZvXMUtQuGd5mfhoPnTHA662L&x-oss-expires=1752561724&x-oss-signature=%2FVN5mf0vGLN3W4Sothr0YCBJ1gs1pWpKt2zZE0Vw9v8%3D&x-oss-signature-version=OSS2"
|
|
||||||
// res.data.url = "https://cdnfhnfile.115cdn.net/6870d9500edfa26822026f57689fdaa03fc219f0/%E5%B2%AD%E5%8D%97%E5%A4%A7%E5%AD%A6%E4%BF%9D%E9%99%A9.mp4?t=1752560553&u=100031698&s=524288000&d=vip-3070654841-cg2ys1g7vy7k4dxg0-1-0&c=2&f=1&k=4c18afc0b99a18676660772f1dbcb9a3&us=5242880000&uc=10&v=1";
|
|
||||||
// res.data.url = "https://cdnfhnfile.115cdn.net/6870d9500edfa26822026f57689fdaa03fc219f0/%E5%B2%AD%E5%8D%97%E5%A4%A7%E5%AD%A6%E4%BF%9D%E9%99%A9.mp4?t=1752561030&u=100031698&s=524288000&d=vip-3070654841-cg2ys1g7vy7k4dxg0-1-0&c=2&f=1&k=badb58d16389675c2bf6170d319cc39e&us=5242880000&uc=10&v=1"
|
|
||||||
// res.data.url = "https://media-sxty-fy-person01.sx3oss.ctyunxs.cn/PERSONCLOUD/ee46316a-1dd0-48f0-9387-d8f985051a55.mp4?x-amz-CLIENTTYPEIN=PC&AWSAccessKeyId=0Lg7dAq3ZfHvePP8DKEU&x-amz-userLevel=0&x-amz-limitrate=51200&response-content-type=video/mp4&x-amz-UID=290668618&response-content-disposition=attachment%3Bfilename%3D%22%E5%B2%AD%E5%8D%97%E5%A4%A7%E5%AD%A6%E4%BF%9D%E9%99%A9.mp4%22%3Bfilename*%3DUTF-8%27%27%25E5%25B2%25AD%25E5%258D%2597%25E5%25A4%25A7%25E5%25AD%25A6%25E4%25BF%259D%25E9%2599%25A9.mp4&x-amz-CLIENTNETWORK=UNKNOWN&x-amz-CLOUDTYPEIN=PERSON&Signature=6cJ2bBQlhBvZbBpGIv2MHQT6wA0%3D&Expires=1752563182&x-amz-FSIZE=157484787&x-amz-UFID=924511202880537274"
|
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
art = new Artplayer({
|
art = new Artplayer({
|
||||||
container: ".paly-box-mask .paly-box .paly-video",
|
container: ".paly-box-mask .paly-box .paly-video",
|
||||||
@@ -427,10 +420,7 @@
|
|||||||
};
|
};
|
||||||
|
|
||||||
const closePalyState = () => {
|
const closePalyState = () => {
|
||||||
// 暂停播放
|
|
||||||
art.pause();
|
art.pause();
|
||||||
|
|
||||||
// 释放播放器资源（重要！）
|
|
||||||
art.destroy();
|
art.destroy();
|
||||||
palyState.value = false;
|
palyState.value = false;
|
||||||
};
|
};
|
||||||
@@ -571,6 +561,7 @@
|
|||||||
|
|
||||||
const data = res.data;
|
const data = res.data;
|
||||||
data.forEach((element, index) => (element["id"] = index + 1));
|
data.forEach((element, index) => (element["id"] = index + 1));
|
||||||
|
data.forEach((element) => (element["lecture_time"] = timeformat(element["lecture_time"])));
|
||||||
|
|
||||||
let target = [];
|
let target = [];
|
||||||
for (let i = 0; i < data.length; i += preachInterval) {
|
for (let i = 0; i < data.length; i += preachInterval) {
|
||||||
@@ -585,6 +576,20 @@
|
|||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
|
||||||
|
const timeformat = (time) => {
|
||||||
|
time = time.replaceAll("-", "/"); // 修改格式
|
||||||
|
let result = "";
|
||||||
|
var datetime = new Date(time);
|
||||||
|
var Nyear = datetime.getFullYear();
|
||||||
|
var Nmonth = datetime.getMonth() + 1 < 10 ? "0" + (datetime.getMonth() + 1) : datetime.getMonth() + 1;
|
||||||
|
var Ndate = datetime.getDate() < 10 ? "0" + datetime.getDate() : datetime.getDate();
|
||||||
|
var Nhour = datetime.getHours() < 10 ? "0" + datetime.getHours() : datetime.getHours();
|
||||||
|
var Nmin = datetime.getMinutes() < 10 ? "0" + datetime.getMinutes() : datetime.getMinutes();
|
||||||
|
result = `${Nyear}年${Nmonth}月${Ndate}日 ${Nhour}:${Nmin}`;
|
||||||
|
|
||||||
|
return result;
|
||||||
|
};
|
||||||
|
|
||||||
const rightImgBox = ref(null);
|
const rightImgBox = ref(null);
|
||||||
|
|
||||||
// 宣讲会 轮播图 的 定时器
|
// 宣讲会 轮播图 的 定时器
|
||||||
@@ -611,7 +616,7 @@
|
|||||||
behavior: "smooth",
|
behavior: "smooth",
|
||||||
});
|
});
|
||||||
}, 100);
|
}, 100);
|
||||||
}, 1000);
|
}, 2000);
|
||||||
};
|
};
|
||||||
|
|
||||||
// 鼠标 移入 轮播图
|
// 鼠标 移入 轮播图
|
||||||
@@ -659,7 +664,7 @@
|
|||||||
},
|
},
|
||||||
});
|
});
|
||||||
// 挂载到页面中的#app元素
|
// 挂载到页面中的#app元素
|
||||||
app.mount("#admission-officer");
|
admissionApp.mount("#admission-officer");
|
||||||
</script>
|
</script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
|||||||
Reference in New Issue
Block a user