提交 ee7097ff authored 作者: Anix's avatar Anix

Merge branch 'master' of https://gitee.com/gzcnki/exhibition_page

...@@ -29,6 +29,10 @@ ...@@ -29,6 +29,10 @@
htmlWebpackPlugin.options.cdn&&htmlWebpackPlugin.options.cdn.js) { %> htmlWebpackPlugin.options.cdn&&htmlWebpackPlugin.options.cdn.js) { %>
<script src="<%= htmlWebpackPlugin.options.cdn.js[i] %>"></script> <script src="<%= htmlWebpackPlugin.options.cdn.js[i] %>"></script>
<% } %> --> <% } %> -->
<script type="text/javascript" src="./static/js/wow.js"></script>
<script type="text/javascript">
new WOW().init()
</script>
</body> </body>
</html> </html>
\ No newline at end of file
差异被折叠。
...@@ -21,15 +21,6 @@ export default { ...@@ -21,15 +21,6 @@ export default {
headerFixed: false, headerFixed: false,
}; };
}, },
mounted() {
this.$nextTick(() => {
let wow = this.$wow;
wow.init();
});
},
}; };
</script> </script>
<style lang="scss"> <style lang="scss">
......
...@@ -10,14 +10,6 @@ ...@@ -10,14 +10,6 @@
controls="controls" controls="controls"
></audio> ></audio>
<!-- 音频播放控件 -->
<!-- <div>-->
<!-- <el-button type="text" @click="startPlayOrPause">{{audio.playing | transPlayPause}}</el-button>-->
<!-- <el-tag type="info">{{ audio.currentTime | formatSecond}}</el-tag>-->
<!-- <el-tag type="info">{{ audio.maxTime | formatSecond}}</el-tag>-->
<!-- </div>-->
</template> </template>
<script> <script>
...@@ -81,8 +73,6 @@ export default { ...@@ -81,8 +73,6 @@ export default {
}, },
// 当timeupdate事件大概每秒一次,用来更新音频流的当前播放时间 // 当timeupdate事件大概每秒一次,用来更新音频流的当前播放时间
onTimeupdate(res) { onTimeupdate(res) {
// console.log("timeupdate");
// console.log(res);
this.audio.currentTime = res.target.currentTime; this.audio.currentTime = res.target.currentTime;
}, },
// 当加载语音流元数据完成后,会触发该事件的回调函数 // 当加载语音流元数据完成后,会触发该事件的回调函数
...@@ -93,16 +83,7 @@ export default { ...@@ -93,16 +83,7 @@ export default {
this.audio.maxTime = parseInt(res.target.duration); this.audio.maxTime = parseInt(res.target.duration);
}, },
}, },
filters: {
// 使用组件过滤器来动态改变按钮的显示
transPlayPause(value) {
return value ? "暂停" : "播放";
},
// 将整数转化成时分秒
formatSecond(second = 0) {
return realFormatSecond(second);
},
},
}; };
</script> </script>
......
...@@ -11,11 +11,15 @@ ...@@ -11,11 +11,15 @@
<div class="tabs wow animate__animated animate__fadeInUp"> <div class="tabs wow animate__animated animate__fadeInUp">
<div <div
class="tab-item" class="tab-item"
:class="{
activeHome: currentTab.name == item.name && isHome,
active: currentTab.name == item.name && !isHome,
}"
v-for="(item, index) in pages" v-for="(item, index) in pages"
:key="index" :key="index"
@click="handleClickTab(item)" @click="handleClickTab(item)"
> >
<div :class="{ active: currentTab.name == item.name }"></div> <!-- <div ></div> -->
<router-link :to="item.path">{{ item.name }} </router-link> <router-link :to="item.path">{{ item.name }} </router-link>
</div> </div>
</div> </div>
...@@ -223,6 +227,7 @@ export default { ...@@ -223,6 +227,7 @@ export default {
background-color: #2069c4 !important; background-color: #2069c4 !important;
z-index: 99; z-index: 99;
box-shadow: rgba(0, 0, 0, 0.2) 0 1px 5px 0px; box-shadow: rgba(0, 0, 0, 0.2) 0 1px 5px 0px;
top: 0;
} }
.nav { .nav {
...@@ -268,35 +273,56 @@ export default { ...@@ -268,35 +273,56 @@ export default {
// padding: 15px 50px; // padding: 15px 50px;
height: 100%; height: 100%;
text-align: center; text-align: center;
a{
a {
font-size: 18px; font-size: 18px;
white-space: nowrap; white-space: nowrap;
} transition: all 0.5s ease;
&::before {
transition: all 0.5s cubic-bezier(0.7, -0.5, 0.2, 2);
content: "";
display: inline-block;
width: 0;
height: 4px;
background: #1d549d;
position: absolute;
bottom: 24px;
left: 0;
} }
&:hover:before { &:hover {
background: #1d549d; a {
width: 100%; color: #182f68;
} }
.active {
width: 100%;
height: 4px;
background: #1d549d;
position: absolute;
bottom: 24px;
left: 0;
} }
.router-link-exact-active {
color: #182f68;
}
// .activeHome {
// a {
// color: #2069c4 !important;
// }
// }
// .active {
// a {
// color: #000 !important;
// }
// }
// &::before {
// transition: all 0.5s cubic-bezier(0.7, -0.5, 0.2, 2);
// content: "";
// display: inline-block;
// width: 0;
// height: 4px;
// background: #1d549d;
// position: absolute;
// bottom: 24px;
// left: 0;
// }
// &:hover:before {
// background: #1d549d;
// width: 38px;
// }
// .active {
// width: 38px;
// height: 4px;
// background: #1d549d;
// position: absolute;
// bottom: 24px;
// left: 0;
// }
} }
} }
} }
......
...@@ -13,7 +13,7 @@ import animated from 'animate.css'; ...@@ -13,7 +13,7 @@ import animated from 'animate.css';
// 滚动动画 wow.js // 滚动动画 wow.js
import { import {
WOW WOW
} from 'wowjs' } from '../public/static/js/wow'
import { import {
getFullUrl getFullUrl
} from '@/utils/index' } from '@/utils/index'
...@@ -25,19 +25,19 @@ Vue.use(ElementUI); ...@@ -25,19 +25,19 @@ Vue.use(ElementUI);
// 全局注册动画效果 // 全局注册动画效果
Vue.use(animated); Vue.use(animated);
Vue.prototype.$wow = new WOW({ // Vue.prototype.$wow = new WOW({
boxClass: 'wow', // default // boxClass: 'wow', // default
animateClass: 'animated', // default // animateClass: 'animated', // default
offset: 0, // default // offset: 0, // default
mobile: true, // default // mobile: true, // default
live: true, // live: true,
scrollContainer: null, // scrollContainer: null,
resetAnimation: true, // resetAnimation: true,
// live为true时,控制台会提示:MutationObserver is not supported by your browser. & WOW.js cannot detect dom mutations, please call .sync() after loading new content. // // live为true时,控制台会提示:MutationObserver is not supported by your browser. & WOW.js cannot detect dom mutations, please call .sync() after loading new content.
callback: function (box) { // callback: function (box) {
console.log("WOW: animating <" + box.tagName.toLowerCase() + ">") // console.log("WOW: animating <" + box.tagName.toLowerCase() + ">")
} // }
}) // })
Vue.prototype.$getFullUrl = getFullUrl Vue.prototype.$getFullUrl = getFullUrl
new Vue({ new Vue({
......
...@@ -2,6 +2,15 @@ import router from './router' ...@@ -2,6 +2,15 @@ import router from './router'
import store from './store/index' import store from './store/index'
router.beforeEach((to, from, next) => { router.beforeEach((to, from, next) => {
// if (to.name != 'home') {
// // chrome
// document.body.scrollTop = 0
// // firefox
// document.documentElement.scrollTop = 0
// // safari
// window.pageYOffset = 0
// }
// 监听path 确定navbar下标 // 监听path 确定navbar下标
store.commit('app/SET_NAV_BAR', to) store.commit('app/SET_NAV_BAR', to)
next() next()
......
...@@ -25,17 +25,17 @@ export function debounce(func, wait, immediate = true) { ...@@ -25,17 +25,17 @@ export function debounce(func, wait, immediate = true) {
// 获取完整的url,根据环境进行配置 // 获取完整的url,根据环境进行配置
export function getFullUrl(url) { export function getFullUrl(url) {
if (url) {
let fullUrl = '' let fullUrl = ''
if (url && url.indexOf('http') != -1 && url.indexOf('files') != -1) {
let urlArr = url.split('files') let urlArr = url.split('files')
fullUrl = '/files' + urlArr[1] fullUrl = '/files' + urlArr[1]
return fullUrl
} else { } else {
return '' fullUrl = url
} }
return fullUrl
} }
/** /**
* 预览文件 * 预览文件
* @param href 预览地址 * @param href 预览地址
......
...@@ -370,7 +370,7 @@ $text-indent: 16px; ...@@ -370,7 +370,7 @@ $text-indent: 16px;
position: absolute; position: absolute;
top: 10px; top: 10px;
right: 10px; right: 10px;
z-index: 99; z-index: 9;
// background-color: rgba(0, 0, 0, 0.1); // background-color: rgba(0, 0, 0, 0.1);
height: 28px; height: 28px;
padding: 4px; padding: 4px;
......
...@@ -114,7 +114,8 @@ ...@@ -114,7 +114,8 @@
</el-row> </el-row>
</div> </div>
<div <div
class="audio wow animate__animated animate__fadeRight" class="audio"
:style="{ animationPlayState: audioPlaying ? 'running' : 'paused' }"
@click="handleClickAudio" @click="handleClickAudio"
v-if="displayDetail.audiosVo && displayDetail.audiosVo.length > 0" v-if="displayDetail.audiosVo && displayDetail.audiosVo.length > 0"
> >
...@@ -165,7 +166,7 @@ ...@@ -165,7 +166,7 @@
</div> </div>
</div> </div>
</div> </div>
<div class="content-item lts wow animate__animated animate__fadeInUp"> <div class="content-item">
<div class="wrapper"> <div class="wrapper">
<div class="custom-title"> <div class="custom-title">
<div class="custom-title-prefix"> <div class="custom-title-prefix">
...@@ -451,6 +452,7 @@ export default { ...@@ -451,6 +452,7 @@ export default {
this.audioPlaying = !this.audioPlaying; this.audioPlaying = !this.audioPlaying;
if (this.audioPlaying) { if (this.audioPlaying) {
this.$refs["AudioPlayer"].play(); this.$refs["AudioPlayer"].play();
// console.log(this.$refs['audioContainer']);
} else { } else {
this.$refs["AudioPlayer"].pause(); this.$refs["AudioPlayer"].pause();
} }
......
...@@ -138,7 +138,6 @@ export default { ...@@ -138,7 +138,6 @@ export default {
children: "children", children: "children",
checkStrictly: true, //单选选择任意一级选项 checkStrictly: true, //单选选择任意一级选项
}, },
culturalRelicYears: [],
onlyShow3d: false, onlyShow3d: false,
keyword: "", keyword: "",
type: "", type: "",
...@@ -151,10 +150,6 @@ export default { ...@@ -151,10 +150,6 @@ export default {
}, },
async created() { async created() {
await this.$store.dispatch("dict/getDictList", ["display_type"]); await this.$store.dispatch("dict/getDictList", ["display_type"]);
let res = await this.$store.dispatch("dict/getDictTree", [
"culturalRelicYears",
]);
this.culturalRelicYears = res.culturalRelicYears;
}, },
mounted() { mounted() {
this.loadData(); this.loadData();
...@@ -353,48 +348,6 @@ $text-indent: 16px; ...@@ -353,48 +348,6 @@ $text-indent: 16px;
transition: all 0.5s ease; transition: all 0.5s ease;
flex: 1; flex: 1;
} }
.showIcon {
position: absolute;
top: 10px;
right: 10px;
z-index: 99;
background-color: rgba(0, 0, 0, 0.1);
border-radius: 4px;
height: 28px;
padding: 4px;
display: flex;
justify-content: center;
align-items: center;
transition: all 0.3s ease;
width: 28px;
white-space: nowrap;
overflow: hidden;
&:hover {
.icon {
display: none;
}
.text {
display: block;
}
width: 130px;
padding: 4px 8px;
}
.icon {
width: 20px;
display: inline-block;
}
.text {
font-size: 14px;
color: #000;
padding: 4px 8px;
cursor: pointer;
display: none;
}
img {
width: 100%;
height: 100%;
}
}
} }
} }
} }
......
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
<template> <template>
<div class="home-display"> <div class="home-display">
<div class="title wow animate__animated animate__fadeInUp">展览</div> <div class="title wow animate__animated animate__fadeInUp">展览</div>
<div class="wrapper"> <div class="wrapper wow animate__animated animate__fadeInUp">
<!-- <div <!-- <div
class="sliders" class="sliders"
:style="{ :style="{
...@@ -26,7 +26,7 @@ ...@@ -26,7 +26,7 @@
<div class="content-intro"> <div class="content-intro">
{{ item.intro ? item.intro : "" }} {{ item.intro ? item.intro : "" }}
</div> </div>
<EntranceIcon color="#fff" /> <EntranceIcon color="#fff" @click.native="handleClick(item)"/>
</div> </div>
<div class="img" @click="handleClick(item)"> <div class="img" @click="handleClick(item)">
<img <img
......
...@@ -18,7 +18,7 @@ ...@@ -18,7 +18,7 @@
<span class="entrance-text">点击进入</span> <span class="entrance-text">点击进入</span>
<img src="@/assets/imgs/home/entrance-black.png" alt="" /> <img src="@/assets/imgs/home/entrance-black.png" alt="" />
</div> --> </div> -->
<EntranceIcon color="#000" /> <EntranceIcon color="#000" @click.native="handleClick(curMuseum)"/>
</div> </div>
<div class="map wow animate__animated animate__fadeInRight"> <div class="map wow animate__animated animate__fadeInRight">
......
...@@ -10,9 +10,9 @@ ...@@ -10,9 +10,9 @@
<div class="en">Virtual Exhibition Hall</div> <div class="en">Virtual Exhibition Hall</div>
</div> </div>
<el-row class="content" :gutter="60"> <el-row class="content" :gutter="60">
<el-col :span="6"> <el-col :span="6" class=" wow animate__animated animate__fadeInLeft">
<div <div
class="intro wow animate__animated animate__fadeInLeft" class="intro"
v-if="list.length > 0" v-if="list.length > 0"
> >
<div class="name">{{ list[0].name }}</div> <div class="name">{{ list[0].name }}</div>
...@@ -20,11 +20,7 @@ ...@@ -20,11 +20,7 @@
<div class="intro-content"> <div class="intro-content">
{{ list[0].intro }} {{ list[0].intro }}
</div> </div>
<!-- <div class="entrance" @click="handleClick(list[0])"> <EntranceIcon color="#fff" @click.native="handleClick(list[0])"/>
<span class="entrance-text">点击进入</span>
<img src="@/assets/imgs/home/entrance.png" alt="" />
</div> -->
<EntranceIcon color="#fff" />
</div> </div>
</el-col> </el-col>
<el-col :span="18"> <el-col :span="18">
......
...@@ -328,48 +328,6 @@ $text-indent: 16px; ...@@ -328,48 +328,6 @@ $text-indent: 16px;
transition: all 0.5s ease; transition: all 0.5s ease;
flex: 1; flex: 1;
} }
.showIcon {
position: absolute;
top: 10px;
right: 10px;
z-index: 99;
background-color: rgba(0, 0, 0, 0.1);
border-radius: 4px;
height: 28px;
padding: 4px;
display: flex;
justify-content: center;
align-items: center;
transition: all 0.3s ease;
width: 28px;
white-space: nowrap;
overflow: hidden;
&:hover {
.icon {
display: none;
}
.text {
display: block;
}
width: 130px;
padding: 4px 8px;
}
.icon {
width: 20px;
display: inline-block;
}
.text {
font-size: 14px;
color: #000;
padding: 4px 8px;
cursor: pointer;
display: none;
}
img {
width: 100%;
height: 100%;
}
}
} }
} }
} }
......
...@@ -80,47 +80,5 @@ $blue: #2069c4; ...@@ -80,47 +80,5 @@ $blue: #2069c4;
transition: all 0.5s ease; transition: all 0.5s ease;
flex: 1; flex: 1;
} }
.showIcon {
position: absolute;
top: 10px;
right: 10px;
z-index: 99;
background-color: rgba(0, 0, 0, 0.1);
border-radius: 4px;
height: 28px;
padding: 4px;
display: flex;
justify-content: center;
align-items: center;
transition: all 0.3s ease;
width: 28px;
white-space: nowrap;
overflow: hidden;
&:hover {
.icon {
display: none;
}
.text {
display: block;
}
width: 130px;
padding: 4px 8px;
}
.icon {
width: 20px;
display: inline-block;
}
.text {
font-size: 14px;
color: #000;
padding: 4px 8px;
cursor: pointer;
display: none;
}
img {
width: 100%;
height: 100%;
}
}
} }
</style> </style>
\ No newline at end of file
...@@ -330,48 +330,6 @@ $text-indent: 16px; ...@@ -330,48 +330,6 @@ $text-indent: 16px;
transition: all 0.5s ease; transition: all 0.5s ease;
flex: 1; flex: 1;
} }
.showIcon {
position: absolute;
top: 10px;
right: 10px;
z-index: 99;
background-color: rgba(0, 0, 0, 0.1);
border-radius: 4px;
height: 28px;
padding: 4px;
display: flex;
justify-content: center;
align-items: center;
transition: all 0.3s ease;
width: 28px;
white-space: nowrap;
overflow: hidden;
&:hover {
.icon {
display: none;
}
.text {
display: block;
}
width: 130px;
padding: 4px 8px;
}
.icon {
width: 20px;
display: inline-block;
}
.text {
font-size: 14px;
color: #000;
padding: 4px 8px;
cursor: pointer;
display: none;
}
img {
width: 100%;
height: 100%;
}
}
} }
} }
} }
......
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论