Skip to content

E
exhibition_page
提交 b42f6f89 authored 作者: 龙菲's avatar 龙菲
浏览文件
操作

修改navbar及布展详情

上级 dfb9e560
全部展开 隐藏空白字符变更
内嵌 并排
正在显示 包含 154 行增加 和 73 行删除
package-lock.json
浏览文件 @ b42f6f89
......@@ -25,7 +25,8 @@
"vue": "^2.6.14",
"vue-awesome-swiper": "^3.1.3",
"vue-router": "^3.5.1",
"vuex": "^3.6.2"
"vuex": "^3.6.2",
"wowjs": "^1.1.3"
},
"devDependencies": {
"@babel/core": "^7.12.16",
......@@ -44,8 +45,7 @@
"sass": "^1.32.7",
"svg-sprite-loader": "^6.0.11",
"terser-webpack-plugin": "^5.3.3",
"vue-template-compiler": "^2.6.14",
"wowjs": "^1.1.3"
"vue-template-compiler": "^2.6.14"
}
},
"node_modules/@achrinza/node-ipc": {
......@@ -14706,7 +14706,6 @@
"version": "1.1.3",
"resolved": "https://registry.npmmirror.com/wowjs/-/wowjs-1.1.3.tgz",
"integrity": "sha512-HQp1gi56wYmjOYYOMZ08TnDGpT+AO21RJVa0t1NJ3jU8l3dMyP+sY7TO/lilzVp4JFjW88bBY87RnpxdpSKofA==",
"dev": true,
"dependencies": {
"animate.css": "latest"
}
......@@ -26451,7 +26450,6 @@
"version": "1.1.3",
"resolved": "https://registry.npmmirror.com/wowjs/-/wowjs-1.1.3.tgz",
"integrity": "sha512-HQp1gi56wYmjOYYOMZ08TnDGpT+AO21RJVa0t1NJ3jU8l3dMyP+sY7TO/lilzVp4JFjW88bBY87RnpxdpSKofA==",
"dev": true,
"requires": {
"animate.css": "latest"
}
package.json
浏览文件 @ b42f6f89
......@@ -26,7 +26,8 @@
"vue": "^2.6.14",
"vue-awesome-swiper": "^3.1.3",
"vue-router": "^3.5.1",
"vuex": "^3.6.2"
"vuex": "^3.6.2",
"wowjs": "^1.1.3"
},
"devDependencies": {
"@babel/core": "^7.12.16",
......@@ -45,8 +46,7 @@
"sass": "^1.32.7",
"svg-sprite-loader": "^6.0.11",
"terser-webpack-plugin": "^5.3.3",
"vue-template-compiler": "^2.6.14",
"wowjs": "^1.1.3"
"vue-template-compiler": "^2.6.14"
},
"eslintConfig": {
"root": true,
......
src/App.vue
浏览文件 @ b42f6f89
......@@ -29,8 +29,8 @@ export default {
},
mounted() {
this.$nextTick(() => {
let wow = this.$wow;
wow.init();
let wow = this.$wow
wow.init()
});
},
};
......
src/components/NavBar/index.vue
浏览文件 @ b42f6f89
<template>
<div class="nav">
<div class="container">
<div class="logo-container wow animate__animated animate__fadeInLeft">
<div class="logo-container wow animate__animated animate__fadeInLeft">
<img src="@/assets/imgs/home/logo.png" />
</div>
<div class="right ">
<div class="right">
<div class="tabs wow animate__animated animate__fadeInUp">
<div
class="tab-item"
......@@ -85,7 +85,7 @@ import { mapGetters } from "vuex";
export default {
name: "NavBar",
computed: {
...mapGetters(["token", "userInfo"]),
...mapGetters(["token", "userInfo", "curPath"]),
hasToken() {
return this.token;
},
......@@ -126,7 +126,36 @@ export default {
},
};
},
watch: {
curPath: {
handler: function (value) {
this.currentTab = {
name: value.name,
path: value.path,
};
if (value.name.indexOf("display") != -1) {
this.currentTab = {
name: "展览",
path: "/display",
};
}
if (value.name.indexOf("culturalRelic") != -1) {
this.currentTab = {
name: "文物展",
path: "/culturalRelic",
};
}
if (value.name.indexOf("museum") != -1) {
this.currentTab = {
name: "博物馆",
path: "/museum",
};
}
},
immediate: true,
},
},
methods: {
handleToLogin() {
this.$router.push("/login?redirect=" + this.$route.fullPath);
......
src/components/ReaderOperations/index.vue
浏览文件 @ b42f6f89
......@@ -24,6 +24,7 @@
:visible.sync="loginDialogVisible"
width="30%"
:before-close="handleLoginClose"
:modal="false"
>
<span>读者功能需登录进行使用，是否去登录？</span>
<span slot="footer" class="dialog-footer">
......@@ -37,6 +38,7 @@
:visible.sync="shareDialogVisible"
width="40%"
:before-close="handleShareClose"
:modal="false"
>
<div class="qrcode">
<div>
......@@ -191,7 +193,7 @@ export default {
inputElement.select();
document.execCommand("Copy");
inputElement.remove();
this.$message.success('复制成功！赶快去分享吧~')
this.$message.success("复制成功！赶快去分享吧~");
},
},
};
......@@ -220,9 +222,10 @@ export default {
color: #2069c4;
}
}
.qrcode,.copy {
.qrcode,
.copy {
display: flex;
// justify-content: space-between;
// justify-content: space-between;
align-items: center;
}
</style>
\ No newline at end of file
src/main.js
浏览文件 @ b42f6f89
......@@ -17,6 +17,7 @@ import {
import {
getFullUrl
} from '@/utils/index'
import './permission'
// import '@/rem'
Vue.config.productionTip = false
......
src/permission.js
浏览文件 @ b42f6f89
import router from './router'
import {
getToken
} from '@/utils/auth' // get token from cookie
import store from './store/index'
router.beforeEach(async (to, from, next) => {
console.log(from,to);
const hasToken = getToken()
if (!hasToken) {
if (to.path === '/personal') {
next({
path: '/'
})
} else {
next()
}
} else {
next()
}
router.beforeEach((to, from, next) => {
// 监听path 确定navbar下标
store.commit('app/SET_NAV_BAR', to)
next()
})
src/store/getters.js
浏览文件 @ b42f6f89
......@@ -4,6 +4,7 @@ const getters = {
avatar: state => state.user.avatar,
name: state => state.user.name,
dicts: state => state.dict.dicts,
museumTree: state => state.org.museumTree
museumTree: state => state.org.museumTree,
curPath: state => state.app.curPath
}
export default getters
src/store/index.js
浏览文件 @ b42f6f89
......@@ -4,6 +4,7 @@ import getters from './getters'
import user from './modules/user'
import dict from './modules/dict'
import org from './modules/org'
import app from './modules/app'
Vue.use(Vuex)
......@@ -11,7 +12,8 @@ const store = new Vuex.Store({
modules: {
user,
dict,
org
org,
app
},
getters
})
......
src/store/modules/app.js 0 → 100644
浏览文件 @ b42f6f89
// import {
// getToken,
// } from '@/utils/auth'
const getDefaultState = () => {
return {
curPath:null,
}
}
const state = getDefaultState()
const mutations = {
RESET_STATE: (state) => {
Object.assign(state, getDefaultState())
},
SET_NAV_BAR: (state, path) => {
state.curPath = path
},
}
const actions = {
}
export default {
namespaced: true,
state,
mutations,
actions
}
src/views/culturalRelic/index.vue
浏览文件 @ b42f6f89
......@@ -69,7 +69,7 @@
>
<div
class="container wow animate__animated animate__fadeInUp"
v-if="$getFullUrl(item.faceImagePressUrl)"
v-if="$getFullUrl(item.faceImagePressUrl) ||$getFullUrl(item.faceImageUrl)"
>
<div class="img">
<img
......@@ -79,6 +79,13 @@
class="img"
lazy
/>
<img
v-else-if="$getFullUrl(item.faceImageUrl)"
:src="$getFullUrl(item.faceImageUrl)"
width="100%"
height="100%"
class="img"
/>
<img
v-else
src="@/assets/404_images/no-pic.png"
......@@ -100,6 +107,7 @@
</div>
</el-col>
</el-row>
<el-empty description="暂无数据" v-if="list.records.length==0"></el-empty>
<div class="pagination">
<el-pagination
@size-change="handleSizeChange"
......@@ -117,10 +125,6 @@
</el-row>
</div>
</div>
<!-- <el-dialog :visible="show3dDialog">
</el-dialog> -->
<!-- <Footer /> -->
</div>
</template>
......
src/views/display/Detail-old.vue deleted 100644 → 0
浏览文件 @ dfb9e560
差异被折叠。
src/views/display/Detail.vue
浏览文件 @ b42f6f89
......@@ -2,7 +2,11 @@
<div class="display-detail">
<div class="empty-space"></div>
<div class="content" id="content">
<div class="content-item sliders" ref="imgs">
<div
class="content-item sliders"
ref="imgs"
v-if="displayDetail.imagesVo && displayDetail.imagesVo.length > 0"
>
<div class="view-box">
<div
class="slide-group"
......@@ -79,7 +83,14 @@
<div class="divider"></div>
<div class="intro-and-video">
<el-row :gutter="70">
<el-col class="intro-container" :span="12">
<el-col
class="intro-container"
:span="
displayDetail.videosVo && displayDetail.videosVo.length > 0
? 12
: 24
"
>
<div class="intro-title">展览简介</div>
<div class="intro-content">
{{ displayDetail.intro }}
......@@ -103,13 +114,16 @@
</el-col>
</el-row>
</div>
<div class="audio wow animate__animated animate__fadeRight" @click="handleClickAudio" >
<div
class="audio wow animate__animated animate__fadeRight"
@click="handleClickAudio"
v-if="displayDetail.audiosVo && displayDetail.audiosVo.length > 0"
>
<img src="@/assets/imgs/display/audio.png" alt="" />
<AudioPlayer
style="display: none"
:url="$getFullUrl(displayDetail.audiosVo[0].url)"
ref="AudioPlayer"
v-if="displayDetail.audiosVo && displayDetail.audiosVo.length > 0"
/>
</div>
</div>
......@@ -300,19 +314,30 @@ export default {
}
this.$nextTick(() => {
this.loadWidth();
this.$message.info("正在播放当前文物讲解音频，点击按钮可关闭");
this.$refs.AudioPlayer.play();
if (
this.displayDetail.videosVo &&
this.displayDetail.videosVo.length > 0
) {
this.$message.info("正在播放当前文物讲解音频，点击按钮可关闭");
this.$refs.AudioPlayer.play();
}
});
}
}
},
loadWidth() {
let slideImage = document.getElementsByClassName("slide-item")[0];
this.slideImageWidth = slideImage.offsetWidth;
this.sildeGroupWidth =
this.slideImageWidth * this.displayDetail.imagesVo.length;
this.slideGroupleft = -3 * this.slideImageWidth;
if (
this.displayDetail.imagesVo &&
this.displayDetail.imagesVo.length > 0
) {
let slideImage = document.getElementsByClassName("slide-item")[0];
this.slideImageWidth = slideImage.offsetWidth;
this.sildeGroupWidth =
this.slideImageWidth * this.displayDetail.imagesVo.length;
this.slideGroupleft = -3 * this.slideImageWidth;
}
},
handleImgsSlide(e) {
......@@ -462,6 +487,7 @@ export default {
overflow-x: hidden;
.content {
width: 100%;
overflow-y: hidden;
.content-item {
width: 100%;
}
......@@ -469,7 +495,8 @@ export default {
/**轮播图 */
.sliders {
height: 434px;
margin: 52px 0 84px 0;
// margin: 52px 0 84px 0;
margin-top: 52px;
display: flex;
justify-content: center;
position: relative;
......@@ -508,12 +535,13 @@ export default {
width: 1200px;
transform: translateY(-25px);
position: relative;
filter:drop-shadow(2px 4px 6px #f8f8f8);
filter: drop-shadow(2px 4px 6px #f8f8f8);
img {
transform: translateX(-10px);
}
}
.left-layer,.right-layer {
.left-layer,
.right-layer {
flex: 1;
height: 100%;
background-color: rgba(#f8f8f8, 0.8);
......@@ -523,7 +551,7 @@ export default {
/**展览信息 */
.intro {
margin-bottom: 96px;
margin-top: 84px;
display: flex;
justify-content: center;
......@@ -623,11 +651,15 @@ export default {
border: 1px solid #892325;
border-radius: 50%;
// padding: 10px;
width: 90px;
height: 90px;
width: 60px;
height: 60px;
display: flex;
justify-content: center;
align-items: center;
img {
width: 28px;
height: 28px;
}
}
}
}
......@@ -657,7 +689,7 @@ export default {
/**展览单元 */
.units {
margin-bottom: 100px;
margin-top: 94px;
display: flex;
flex-direction: column;
align-items: center;
......@@ -701,6 +733,7 @@ export default {
display: flex;
flex-direction: column;
align-items: center;
margin-top: 100px;
.lts-content {
display: flex;
justify-content: center;
......
src/views/display/detail/ChStyle.vue 0 → 100644
浏览文件 @ b42f6f89
差异被折叠。
src/views/display/index.vue
浏览文件 @ b42f6f89
......@@ -49,6 +49,7 @@
filterable
@change="handleRegionChange"
clearable
ref="region"
>
</el-cascader>
......@@ -89,6 +90,7 @@
</div>
</el-col>
</el-row>
<el-empty description="暂无数据" v-if="list.records.length==0"></el-empty>
<div class="pagination">
<el-pagination
@size-change="handleSizeChange"
......@@ -106,10 +108,6 @@
</el-row>
</div>
</div>
<!-- <el-dialog :visible="show3dDialog">
</el-dialog> -->
<!-- <Footer /> -->
</div>
</template>
......@@ -216,9 +214,8 @@ export default {
},
handleRegionChange(value) {
console.log(value);
console.log(value[value.length - 1]);
this.regionCode = value;
// this.$refs.region
this.loadData();
},
......
src/views/museum/index.vue
浏览文件 @ b42f6f89
......@@ -89,10 +89,6 @@
</el-row>
</div>
</div>
<!-- <el-dialog :visible="show3dDialog">
</el-dialog> -->
<!-- <Footer /> -->
</div>
</template>
......
src/views/personal/components/Info.vue
浏览文件 @ b42f6f89
......@@ -16,6 +16,7 @@
title="修改个人信息"
:visible.sync="dialogFormVisible"
width="400px"
:modal="false"
>
<el-form
:model="infoData"
......
src/views/virtual/index.vue
浏览文件 @ b42f6f89
......@@ -89,10 +89,6 @@
</el-row>
</div>
</div>
<!-- <el-dialog :visible="show3dDialog">
</el-dialog> -->
<!-- <Footer /> -->
</div>
</template>
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论