页面修改

This commit is contained in:
王创世 2025-06-25 10:42:10 +08:00
parent 19f601db6e
commit 76f35dcfcb
12 changed files with 127 additions and 11 deletions

BIN
public/static/backBM.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 4.6 KiB

Binary file not shown.

Before

Width:  |  Height:  |  Size: 3.5 MiB

BIN
public/static/btn_A.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.2 KiB

View File

@ -24,7 +24,7 @@ a {
}
.container {
width: 1040px;
width: 1280px;
margin: 20px auto;
background-color: #fff;
padding: 20px;
@ -63,9 +63,9 @@ a {
/* 版面图片 */
.pic-box {
position: relative;
width: 410px;
width: 510px;
max-height: 760px;
padding: 16px 0px;
/* padding: 16px 0px; */
border: 1px solid #bbb;
}
@ -117,7 +117,7 @@ a {
/* 主体 */
.main-box {
margin-left: 435px;
margin-left: 535px;
}
.main-header {
@ -200,6 +200,39 @@ a {
box-shadow: none;
}
.hoverLi {
background: #777777;
width: 40px;
writing-mode: vertical-lr;
margin-bottom: 12px;
text-align: center;
border-bottom-left-radius: 6px;
border-top-left-radius: 6px;
font-size: 15px;
cursor: pointer;
letter-spacing: 4px;
display: inline-block;
color: #fff;
}
.hoverLi:hover {
background: #f3200f;
}
.pdfIn {
cursor: pointer;
margin-bottom: 12px;
background-color: #777777;
width: 40px;
height: 44px;
border-radius: 0px 6px 6px 0px;
display: flex;
align-items: center;
justify-content: center;
}
.pdfIn:hover {
background: #f3200f;
}
.main-layout {
overflow: hidden;
}
@ -862,6 +895,7 @@ a {
width: 100%;
}
.top_1_div:hover {
background: #c1343b;
color: #fff !important;
@ -889,6 +923,7 @@ a {
left: -14px;
top: 21px;
}
.text-ellipsis {
white-space: nowrap;
-o-text-overflow: ellipsis;

BIN
public/static/home.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 821 B

View File

@ -8,12 +8,12 @@ $(function () {
//$("#MapLeave").append('<div id="mapLeaveMask" style="width: 100%;height: 100%;position: absolute;top: 0;background: transparent;z-index:9999999999999;"></div>');
var bantu = $('#Bantu')[0] || {}
$('#Bantu').css({ opacity: 0, position: 'absolute', left: '50%', transform: 'translateX(-50%)', top: '16px', zIndex: 9 });
$('#Bantu').css({ opacity: 0, position: 'absolute', left: '50%', transform: 'translateX(-50%)', top: '0', zIndex: 9 });
var timer=setInterval(function(){
if(bantu.offsetHeight){
clearInterval(timer)
$('#Bantu').before('<img id="BantuTop" src="'+$('#Bantu').attr("src")+'" style="width:'+bantu.offsetWidth+'px;height:'+bantu.offsetHeight+'px;" />')
$('#Bantu').after('<canvas id="coorCanvas" width="'+bantu.offsetWidth+'px" height="'+bantu.offsetHeight+'px" style="position: absolute;top: 15px;left:50%;transform: translateX(-50%); opacity: 1;"></canvas>');
$('#Bantu').after('<canvas id="coorCanvas" width="'+bantu.offsetWidth+'px" height="'+bantu.offsetHeight+'px" style="position: absolute;top: 0;left:50%;transform: translateX(-50%); opacity: 1;"></canvas>');
}
},100)

BIN
public/static/next.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 989 B

BIN
public/static/pdf2.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 2.4 KiB

BIN
public/static/prev.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 977 B

BIN
public/static/voice.png Normal file

Binary file not shown.

After

Width:  |  Height:  |  Size: 5.8 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 1.8 KiB

View File

@ -70,6 +70,62 @@
</div>
</div>
</div>
<div style="position: absolute;bottom: 0px;left: -40px;">
<div class="hoverLi" style="height: 90px;display: flex;align-items: center;justify-content: center;">
<div>
<img src="/public/static/home.png" style="width: 16px;display: inline-block;">
</div>
<div style="padding-top: 10px;">首页</div>
</div>
</div>
<div style="position: absolute;bottom: 0px;right: -40px;bottom: 80px;display: flex;flex-direction: column;">
<div class="hoverLi" @click.prevent="openNext('top')"
style="width: 40px;height: 110px;border-radius: 0px 6px 6px 0px;display: flex;align-items: center;justify-content: center;">
<div>
<img src="/public/static/prev.png" style="width: 100%;display: inline-block;">
</div>
<div style="padding-top: 10px;">上一版</div>
</div>
<div class="hoverLi" @click.prevent="openNext('bottom')"
style="width: 40px;height: 110px;border-radius: 0px 6px 6px 0px;display: flex;align-items: center;justify-content: center;">
<div>下一版</div>
<div style="padding-top: 10px;">
<img src="/public/static/next.png" style="width: 100%;display: inline-block;">
</div>
</div>
</div>
<div style="position: absolute;bottom: 5px;right: -40px;">
<div class="pdfIn">
<div>
<a v-if="data[dataIndex]" :href="data[dataIndex].bm_pdf" target="_blank">
<img src="/public/static/pdf2.png" style="width: 100%;">
</a>
</div>
</div>
</div>
<div v-if="showInfo" style="position: absolute;right: -40px;;display: flex;flex-direction: column;">
<div class="hoverLi" @click="addFontSize('da')"
style="margin-bottom: 20px;width: 40px;height: 110px;border-radius: 0px 6px 6px 0px;display: flex;align-items: center;justify-content: center;">
<div>
<img src="/public/static/btn_A.png" style="width: 100%;display: inline-block;">
</div>
<div style="padding-top: 10px;">放大</div>
</div>
<div class="hoverLi" @click.prevent="goHome()"
style="margin-bottom: 20px;width: 40px;height: 50px;border-radius: 0px 6px 6px 0px;display: flex;align-items: center;justify-content: center;">
<div>
<img src="/public/static/backBM.png" style="width: 30px;display: inline-block;">
</div>
</div>
<div class="hoverLi" @click.prevent="readMp3()"
style="width: 40px;height: 50px;border-radius: 0px 6px 6px 0px;display: flex;align-items: center;justify-content: center;">
<div>
<img :src="isPlay ? '/public/static/voice_play.png' : '/public/static/voice.png'"
style="width: 30px;display: inline-block;">
</div>
</div>
</div>
<div class="page-main clearfix" v-if="data != ''">
<!-- 版面预览 -->
<div class="fl">
@ -129,7 +185,7 @@
</div>
</div> -->
<div v-if="!showInfo">
<div class="main-news">
<div class="main-news" style="height: 300px;overflow-y: scroll;">
<div class="main-news-main">
<ul class="news-list">
<li class="news-item" v-for="news in data[dataIndex].news" :key="news.new_name"
@ -143,6 +199,10 @@
</ul>
</div>
</div>
<div style="padding-top: 18px;">
<video src="https://jinrigushitwo.gushitv.com/static/video/20250625/1719466566566.mp4" controls
style="width: 100%;"></video>
</div>
</div>
<div v-if="showInfo" class="main-content-wrapper" id="news_wrapper">
<!-- <div class="main-content-header clearfix">
@ -175,8 +235,6 @@
<p class="datesource">{{ targetInfo.reporter }}</p>
<br>
<div class="info">
<div>
</div>
<div :class="'font' + fontSize" v-html="targetInfo.content"></div>
</div>
</div>
@ -247,6 +305,8 @@
</div>
</div>
<!-- <div class="footer"></div> -->
<audio ref="audioPlayer" @ended="readEnd" controls :src="'https://jinrigushitwo.gushitv.com/' + targetInfo.mp_url"
@canplaythrough="onAudioLoaded" style='width:100%;display:none;'></audio>
</div>
</template>
@ -257,6 +317,7 @@ import $ from 'jquery';
export default {
data() {
return {
isPlay: false,
iconPdf: "/dist/public/static/icon_pdf.png",
data: '',
dataIndex: 0,
@ -301,6 +362,25 @@ export default {
},
methods: {
readMp3() {
console.log(this.$refs.audioPlayer.error)
if (this.$refs.audioPlayer.error != null) {
alert('音频生成中,请稍候再试!');
return;
}
if (this.isPlay) {
this.$refs.audioPlayer.pause();
} else {
this.$refs.audioPlayer.play();
}
this.isPlay = !this.isPlay;
},
onAudioLoaded() {
console.log('Audio has been loaded and is ready to play.');
},
readEnd() {
this.isPlay = false;
},
mouseLeft(index) {
this.clearHideMenuTimer();
this.mouseIndex = index;
@ -395,6 +475,7 @@ export default {
if (type == 'da') {
if (this.fontSize == 29) {
this.fontSize = 14
return;
}
this.fontSize += 3;