提交 e9ae16df authored 作者: 龙菲's avatar 龙菲

修改展览主题预览模板

上级 2972f650
...@@ -86,3 +86,5 @@ export function postCheck(data) { ...@@ -86,3 +86,5 @@ export function postCheck(data) {
}) })
} }
差异被折叠。
差异被折叠。
差异被折叠。
$themeColor: #252F57;
$themeSecondaryColor:#dfab46;
$font-size-sm:14px;
$font-size-base:16px;
$font-size-lg:22px;
$nav-height: 120px;
$defaultFontFamily: Avenir, Helvetica Neue, Arial, Helvetica, sans-serif;
...@@ -14,11 +14,6 @@ export default { ...@@ -14,11 +14,6 @@ export default {
default: "标题", default: "标题",
}, },
}, },
data() {
return {};
},
mounted() {},
methods: {},
}; };
</script> </script>
......
<!-- --> <!-- -->
<template> <template>
<div class="footer" :style="{ background }"> <div :class="{
<span>贵州省文化和旅游厅博物馆处版权所有</span> footer: true,
<span>中国知网提供技术支持</span> //isHome:isHome,
isChStyle: navbarStyle == '2',
isRedStyle: navbarStyle == '3',
isSDCS: navbarStyle == '4',
isSMGZ: navbarStyle == '5',
isJYYCC: navbarStyle == '6',
isYLGDYW: navbarStyle == '7',
}">
<div class="logo">
<img src="~@/assets/imgs/display/logo3.png" alt="" />
</div>
<div class="menu">
<div class="menu-item">
<el-popover placement="top-start" width="280" trigger="hover">
<span slot="reference">网站地图</span>
<div class="map">
<div class="map-item" v-for="(item, index) in mapData" :key="index">
<div class="title" @click="handleClickItem(item)">
{{ item.title }}
</div>
<ul v-if="item.children && item.children.length > 0">
<li v-for="(v, i) in item.children" :key="i" @click="handleClickItem(v)">
{{ v.title }}
</li>
</ul>
</div>
</div>
</el-popover>
</div>
<!-- <div class="menu-item">关于我们</div> -->
<div class="menu-item">
<span>
<el-popover placement="top-start" width="280" trigger="hover">
<span slot="reference">小程序</span>
<div class="wechat-app">
<img src="~@/assets/imgs/wechat-app.jpg" alt="">
</div>
</el-popover>
</span>
</div>
</div>
<div class="copyright">
<a href="https://beian.miit.gov.cn" target="_blank"> 黔ICP备2022009785号-1 &nbsp; &nbsp;</a>
|&nbsp; &nbsp; ©2022-现在 贵州省文化和旅游厅
</div>
<div class="support">网站建设:贵州同方知网科技发展有限公司</div>
<div class="advice">
<el-tooltip placement="top-start" content="谷歌 火狐 最佳分辨率(1920 x 1080)">
<span>浏览建议</span>
</el-tooltip>
</div>
</div> </div>
</template> </template>
<script> <script>
import { mapGetters } from "vuex";
export default { export default {
name: "Footer", name: "Footer",
props: { computed: {
background: { ...mapGetters(["curPath", "navbarStyle"]),
type: String, },
default: "#2069c4", //默认为主题蓝 watch: {
curPath: {
handler: function (value) {
this.isHome = value.name == "home";
if (value.params.themeType) {
this.$store.commit("app/CHANGE_NAV_COLOR", value.params.themeType);
} else {
this.$store.commit("app/CHANGE_NAV_COLOR", "1");
}
},
immediate: true,
},
},
// curPath: {
// handler: function (value) {
// if (value.params.themeType) {
// this.$store.commit("app/CHANGE_NAV_COLOR", value.params.themeType);
// } else {
// this.$store.commit("app/CHANGE_NAV_COLOR", "1");
// }
// },
// immediate: true,
// },
data() {
return {
isHome: true,
mapData: [
{
title: "首页",
path: "/",
children: [],
},
{
title: "展览",
path: "",
children: [
{
title: "展览展示",
path: "/display",
},
],
},
{
title: "文物",
path: "",
children: [
{
title: "文物展示",
path: "/culturalRelic",
},
],
},
{
title: "博物馆",
path: "",
children: [
{
title: "博物馆",
path: "/museum",
},
],
},
{
title: "服务",
path: "",
children: [
{
title: "文创产品",
path: "/ccProduct",
},
],
},
],
};
},
methods: {
handleClickItem(item) {
// console.log(item);
if (item.path) {
const newPage = this.$router.resolve({
path: item.path,
});
window.open(newPage.href, "_blank");
}
}, },
}, },
}; };
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.footer{ .isHome {
width: 100%; background-color: #2069c4 !important;
}
.footer {
display: flex;
// height: 200px;
padding: 30px 0;
justify-content: center;
align-items: center;
background-color: $themeColor;
flex-direction: column;
color: #fefefe;
font-size: 14px;
position: relative;
.logo {
width: 60px;
height: 60px;
margin-bottom: 40px;
img {
width: 100%;
}
}
.menu {
display: flex; display: flex;
height: 200px;
padding: 0 24px; .menu-item {
justify-content: center; margin-right: 20px;
align-items: center; cursor: pointer;
background-color: #2069C4;
color: #fff;
span{ }
margin-right: 16px; }
.copyright,
.support,
.menu {
margin-bottom: 16px;
}
.advice {
border: 1px solid #fff;
padding: 6px 10px;
margin-top: 20px;
cursor: pointer;
}
.copyright {
&>a {
text-decoration: none;
color: #fff;
}
}
}
.map {
.map-item {
margin-bottom: 20px;
&:first-child {
.title {
cursor: pointer;
}
}
.title {
font-weight: bold;
} }
ul {
display: flex;
li {
margin: 0 20px 10px 0;
cursor: pointer;
}
}
}
}
.wechat-app {
width: 258px;
height: 258px;
img {
width: 100%;
height: 100%;
object-fit: contain;
}
}
.isChStyle {
background-color: #194448 !important;
position: relative;
top: -$nav-height;
}
.isRedStyle {
background-color: #813525 !important;
position: relative;
top: -$nav-height;
}
.isSDCS {
background-color: #6c0c0d !important;
}
.isSMGZ {
background-color: #00173a !important;
}
.isJYYCC {
background-color: #343b66 !important;
}
.isYLGDYW {
background-color: #212040 !important;
} }
</style> </style>
<template> <template>
<div class="reader-operations"> <div class="reader-operations">
<span class="operations"> <span class="operations" :style="{
<span class="operation-item" v-if="like"> color,
<!-- <svg-icon @click="handleLike" icon-class="like-s" :style="{ }">
<span class="operation-item">
<svg-icon icon-class="view" :style="{
fontSize: iconSize + 'px', fontSize: iconSize + 'px',
color: loveCountStatus ? selectColor : '#61666d', color,
}"></svg-icon> --> }"></svg-icon>
<span>{{ formatNum(info.browseCount) }}</span>
</span>
<span class="operation-item">
<svg-icon :icon-class="info.loveCountStatus ? 'dianzan-s' : 'dianzan'" :style="{
fontSize: iconSize + 'px',
color: info.loveCountStatus ? selectColor : color,
}"></svg-icon>
<span>{{ <span>{{
formatNum(loveCount) == 0 ? "点赞" : formatNum(loveCount) formatNum(info.loveCount) == 0 ? "点赞" : formatNum(info.loveCount)
}}</span> }}</span>
</span> </span>
<span class="operation-item" v-if="collect"> <span class="operation-item" >
<!-- <svg-icon icon-class="collect-s-2" :style="{ <svg-icon :icon-class="info.collectCountStatus ? 'collect-s' : 'collect'" :style="{
fontSize: iconSize + 'px', fontSize: iconSize + 'px',
color: collectCountStatus ? selectColor : '#61666d', color: info.collectCountStatus ? selectColor : color,
}"></svg-icon> --> }"></svg-icon>
<span>{{ <span>{{
formatNum(collectCount) == 0 ? "收藏" : formatNum(collectCount) formatNum(info.collectCount) == 0
? "收藏"
: formatNum(info.collectCount)
}}</span> }}</span>
</span> </span>
<span v-if="share" class="operation-item"> <span class="operation-item">
<!-- <svg-icon icon-class="share2" :style="{ <svg-icon icon-class="share2" :style="{
fontSize: iconSize + 'px', fontSize: iconSize + 'px',
}"></svg-icon> --> color,
}"></svg-icon>
<span>分享</span> <span>分享</span>
</span> </span>
</span> </span>
...@@ -32,65 +44,30 @@ ...@@ -32,65 +44,30 @@
<script> <script>
import { mapGetters } from "vuex"; import { mapGetters } from "vuex";
import { debounce, formatNum } from "@/utils/index"; import { formatNum } from "@/utils/index";
export default { export default {
name: "ReaderOperations", name: "ReaderOperations",
props: { props: {
// 是否需要点赞,默认需要 info: {
like: { type: Object,
type: Boolean, default: () => ({}),
default: true,
},
// 是否需要收藏,默认需要
collect: {
type: Boolean,
default: true,
},
// 是否需要分享,默认需要
share: {
type: Boolean,
default: true,
},
// 点赞数量
loveCount: {
type: String,
default: "0",
},
// 收藏数量
collectCount: {
type: String,
default: "0",
},
// 点赞状态
loveCountStatus: {
type: Boolean,
default: false,
},
// 收藏状态
collectCountStatus: {
type: Boolean,
default: false,
},
sourceId: {
type: String,
default: "",
}, },
// 来源类型 biz_cultural_relic-文物;biz_exhibition-布展;biz_elite_exhibition-精品展 // 来源类型 biz_cultural_relic-文物;biz_exhibition-布展;biz_elite_exhibition-精品展
sourceType: { sourceType: {
type: String, type: String,
default: "", default: "",
}, },
title: {
type: String,
default: "",
},
iconSize: { iconSize: {
type: [Number, String], type: [Number, String],
default: 28, default: 28,
}, },
color: {
type: String,
default: "#fff",
},
selectColor: { selectColor: {
type: String, type: String,
default: "$themeColor", default: "#fff",
}, },
}, },
data() { data() {
...@@ -105,6 +82,7 @@ export default { ...@@ -105,6 +82,7 @@ export default {
}, },
methods: { methods: {
formatNum(num) { formatNum(num) {
return formatNum(num); return formatNum(num);
}, },
...@@ -113,11 +91,9 @@ export default { ...@@ -113,11 +91,9 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
$themeColor: #132c33;
.reader-operations { .reader-operations {
width: 100%; width: 100%;
max-width: 300px; max-width: 500px;
} }
.operations { .operations {
...@@ -129,7 +105,6 @@ $themeColor: #132c33; ...@@ -129,7 +105,6 @@ $themeColor: #132c33;
.operation-item { .operation-item {
display: flex; display: flex;
align-items: center; align-items: center;
// margin-right: 32px;
cursor: pointer; cursor: pointer;
font-size: 14px; font-size: 14px;
} }
...@@ -137,7 +112,6 @@ $themeColor: #132c33; ...@@ -137,7 +112,6 @@ $themeColor: #132c33;
.svg-icon { .svg-icon {
margin-right: 10px; margin-right: 10px;
font-size: 24px; font-size: 24px;
color: #61666d;
} }
.like { .like {
......
...@@ -13,8 +13,8 @@ ...@@ -13,8 +13,8 @@
v-for="(item, index) in imgList" v-for="(item, index) in imgList"
:key="index" :key="index"
> >
<img :src="$getFullUrl(item.pressUrl)" alt="" /> <img :src="$getFullUrl(item[imgKey])" alt="" />
<div class="enlarge" @click="handelPreviewImages(imgList)"> <div class="enlarge" @click="handelPreviewImages(imgList,index)">
<img src="@/assets/imgs/enlarge-s.png" alt="" /> <img src="@/assets/imgs/enlarge-s.png" alt="" />
</div> </div>
</swiper-slide> </swiper-slide>
...@@ -48,6 +48,7 @@ ...@@ -48,6 +48,7 @@
v-if="imgViewerVisible" v-if="imgViewerVisible"
:on-close="closeImgViewer" :on-close="closeImgViewer"
:url-list="previewList" :url-list="previewList"
:initial-index="initialIndex"
/> />
</div> </div>
</template> </template>
...@@ -94,6 +95,7 @@ export default { ...@@ -94,6 +95,7 @@ export default {
slideToClickedSlide: true, slideToClickedSlide: true,
}, },
imgViewerVisible: false, imgViewerVisible: false,
initialIndex:0
}; };
}, },
...@@ -106,9 +108,10 @@ export default { ...@@ -106,9 +108,10 @@ export default {
}); });
}, },
methods: { methods: {
handelPreviewImages(items) { handelPreviewImages(items,i) {
this.imgViewerVisible = true; this.imgViewerVisible = true;
this.previewList = items.map((item) => this.$getFullUrl(item.url)); this.previewList = items.map((item) => this.$getFullUrl(item.url));
this.initialIndex = i
}, },
closeImgViewer() { closeImgViewer() {
this.imgViewerVisible = false; this.imgViewerVisible = false;
......
<template> <template>
<div class="slide-img-group"> <div class="slide-img-group">
<div class="list"> <div class="list">
<swiper <swiper class="swiper gallery-thumbs" :options="swiperOptionThumbs" ref="swiperThumbs">
class="swiper gallery-thumbs" <swiper-slide class="slide-item" v-for="(item, index) in imgList" :key="index" @click="handleClickItem(item)">
:options="swiperOptionThumbs"
ref="swiperThumbs"
>
<swiper-slide
class="slide-item"
v-for="(item, index) in imgList"
:key="index"
@click="handleClickItem(item)"
>
<!-- <img :src="item.pressUrl || item.faceImagePressUrl" alt="" /> --> <!-- <img :src="item.pressUrl || item.faceImagePressUrl" alt="" /> -->
<div class="img-container" @click="handelPreviewImages(imgList)"> <div class="img-container" @click="handelPreviewImages(imgList, index)">
<slot name="img" :item="item"></slot> <slot name="img" :item="item"></slot>
</div> </div>
<slot name="info" :item="item" /> <slot name="info" :item="item" />
...@@ -26,26 +17,25 @@ ...@@ -26,26 +17,25 @@
<span>查看大图</span> <span>查看大图</span>
</div> --> </div> -->
</swiper-slide> </swiper-slide>
<div class="swiper-pagination" slot="pagination"></div>
<div class="swiper-button-next swiper-button-white" slot="button-next">
<i class="el-icon-arrow-right"></i>
</div>
<div class="swiper-button-prev swiper-button-white" slot="button-prev">
<i class="el-icon-arrow-left"></i>
</div>
<!--分页器。如果放置在swiper外面,需要自定义样式。--> <!--分页器。如果放置在swiper外面,需要自定义样式。-->
</swiper> </swiper>
<div class="swiper-pagination" slot="pagination"></div>
<div class="swiper-button-next swiper-button-white" slot="button-next">
<i class="el-icon-arrow-right"></i>
</div>
<div class="swiper-button-prev swiper-button-white" slot="button-prev">
<i class="el-icon-arrow-left"></i>
</div>
</div> </div>
<el-image-viewer <el-image-viewer v-if="imgViewerVisible" :on-close="closeImgViewer" :url-list="previewList"
v-if="imgViewerVisible" :initial-index="initialIndex" />
:on-close="closeImgViewer"
:url-list="previewList"
/>
</div> </div>
</template> </template>
<script> <script>
import { swiper, swiperSlide } from "vue-awesome-swiper"; import { swiper, swiperSlide } from "vue-awesome-swiper";
import "swiper/dist/css/swiper.css"; import "swiper/dist/css/swiper.css";
export default { export default {
...@@ -87,14 +77,16 @@ export default { ...@@ -87,14 +77,16 @@ export default {
}, },
}, },
imgViewerVisible: false, imgViewerVisible: false,
initialIndex: 0
}; };
}, },
mounted() {}, mounted() { },
methods: { methods: {
handelPreviewImages(items) { handelPreviewImages(items, index) {
this.imgViewerVisible = true; this.imgViewerVisible = true;
this.previewList = items.map((item) => this.$getFullUrl(item.url)); this.previewList = items.map((item) => this.$getFullUrl(item.url));
this.initialIndex = index
}, },
closeImgViewer() { closeImgViewer() {
this.imgViewerVisible = false; this.imgViewerVisible = false;
...@@ -108,19 +100,26 @@ export default { ...@@ -108,19 +100,26 @@ export default {
</script> </script>
<style scoped lang="scss"> <style scoped lang="scss">
$themeColor:#132c33;
.slide-img-group { .slide-img-group {
height: 100%; // height: 100%;
height: 240px;
.list{
position: relative;
display: flex;
justify-content: center;
}
} }
.swiper-container { .swiper-container {
// padding: 0 60px; // padding: 0 60px;
width:calc(100% - 140px);
// overflow-y: auto;
::v-deep .swiper-wrapper { ::v-deep .swiper-wrapper {
display: flex; display: flex;
// justify-content: center; // justify-content: center;
} }
} }
.list, .list,
.swiper, .swiper,
.swiper-wrapper { .swiper-wrapper {
...@@ -138,12 +137,14 @@ $themeColor:#132c33; ...@@ -138,12 +137,14 @@ $themeColor:#132c33;
display: flex; display: flex;
flex-direction: column; flex-direction: column;
padding-bottom: 10px; padding-bottom: 10px;
.img-container { .img-container {
width: 100%; width: 100%;
// height: 100%; // height: 100%;
background: #f5f5f9; background: #f5f5f9;
height: 200px; height: 200px;
cursor: pointer; cursor: pointer;
img { img {
width: 100%; width: 100%;
height: 100%; height: 100%;
...@@ -151,19 +152,23 @@ $themeColor:#132c33; ...@@ -151,19 +152,23 @@ $themeColor:#132c33;
} }
} }
} }
.swiper-button-next, .swiper-button-next,
.swiper-button-prev { .swiper-button-prev {
background-image: none; background-image: none;
width: 60px;
height: 60px;
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
color: $themeColor;
font-weight: bolder; font-weight: bolder;
font-size: 28px; font-size: 32px;
width: 56px;
height: 56px;
border-radius: 50%;
background-color: rgba($themeColor,0.4);
transform: translateY(-20px); transform: translateY(-20px);
color: #333;
} }
.enlarge { .enlarge {
position: absolute; position: absolute;
bottom: 19px; bottom: 19px;
...@@ -179,6 +184,7 @@ $themeColor:#132c33; ...@@ -179,6 +184,7 @@ $themeColor:#132c33;
color: #fff; color: #fff;
font-size: 12px; font-size: 12px;
padding: 4px 8px; padding: 4px 8px;
img { img {
width: 12px; width: 12px;
height: 12px; height: 12px;
...@@ -186,8 +192,16 @@ $themeColor:#132c33; ...@@ -186,8 +192,16 @@ $themeColor:#132c33;
} }
} }
::v-deep .swiper-pagination-bullets{ ::v-deep .swiper-pagination-bullets {
bottom: 0; bottom:-10px;
.swiper-pagination-bullet{
margin-right: 10px;
width: 10px;
height: 10px;
}
.swiper-pagination-bullet-active{
background: $themeColor;
}
} }
</style> </style>
......
...@@ -57,6 +57,7 @@ export default { ...@@ -57,6 +57,7 @@ export default {
.video-container { .video-container {
position: relative; position: relative;
height: 100%; height: 100%;
background-color: #000;
.video-dom { .video-dom {
height: 100%; height: 100%;
width: 100%; width: 100%;
...@@ -79,10 +80,10 @@ export default { ...@@ -79,10 +80,10 @@ export default {
// z-index: 9; // z-index: 9;
.play-btn { .play-btn {
width: 100px; width: 80px;
height: 70px; height: 80px;
// background-color: #fff; // background-color: #fff;
border-radius: 16px; border-radius: 50%;
display: flex; display: flex;
justify-content: center; justify-content: center;
align-items: center; align-items: center;
...@@ -92,36 +93,17 @@ export default { ...@@ -92,36 +93,17 @@ export default {
top: 50%; top: 50%;
transform: translate(-50%, -50%); transform: translate(-50%, -50%);
i { i {
font-size: 70px; font-size: 50px;
z-index: 1; z-index: 1;
transform: scaleX(1.5); transform: scaleX(1.5);
} }
} }
} }
.blur {
width: 120px;
height: 84px;
background-color: #fff;
position: absolute;
left: 50%;
bottom: 50%;
transform: translate(-50%, 50%);
filter: blur(20px);
z-index: 0;
}
} }
.red { .play-btn {
.play-btn { border: 2px solid #fff;
border: 2px solid #892325; color: #fff;
color: #892325; background: $themeColor;;
} }
}
.blue {
.play-btn {
border: 2px solid #2069c4;
color: #2069c4;
}
}
</style> </style>
\ No newline at end of file
...@@ -93,6 +93,12 @@ export default { ...@@ -93,6 +93,12 @@ export default {
height: 100%; height: 100%;
.video-js { .video-js {
&:hover{
.vjs-big-play-button{
// background-color: #fff;
// color: $themeColor;
}
}
video { video {
// object-fit: fill; // object-fit: fill;
} }
...@@ -105,7 +111,13 @@ export default { ...@@ -105,7 +111,13 @@ export default {
.vjs-big-play-button { .vjs-big-play-button {
left: 50%; left: 50%;
top: 50%; top: 50%;
width: 80px;
height: 80px;
border-radius: 50%;
transform: translate(-50%, -50%); transform: translate(-50%, -50%);
font-size: 50px;
color: #fff;
background-color: $themeColor;
} }
.vjs-control-bar { .vjs-control-bar {
......
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1661508484412" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2637" xmlns:xlink="http://www.w3.org/1999/xlink" width="28" height="28"><path d="M519.2 807.2l255.2 133.6c12 6.4 25.6-4 23.2-16.8L748.8 640c-0.8-4.8 0.8-10.4 4.8-14.4L960 424.8c9.6-9.6 4-25.6-8.8-27.2l-284.8-41.6c-5.6-0.8-9.6-4-12-8.8l-128-257.6c-5.6-12-23.2-12-28.8 0L370.4 348c-2.4 4.8-7.2 8-12 8.8L73.6 398.4c-13.6 1.6-18.4 17.6-8.8 27.2l206.4 200.8c4 4 5.6 8.8 4.8 14.4l-48.8 284c-2.4 12.8 11.2 23.2 23.2 16.8L505.6 808c4-3.2 8.8-3.2 13.6-0.8z" p-id="2638"></path></svg> <?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1671607074293" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4937" xmlns:xlink="http://www.w3.org/1999/xlink" width="128" height="128"><path d="M335.008 916.629333c-35.914667 22.314667-82.88 10.773333-104.693333-25.557333a77.333333 77.333333 0 0 1-8.96-57.429333l46.485333-198.24a13.141333 13.141333 0 0 0-4.021333-12.864l-152.16-132.586667c-31.605333-27.52-35.253333-75.648-8.234667-107.733333a75.68 75.68 0 0 1 51.733333-26.752L354.848 339.2c4.352-0.362667 8.245333-3.232 10.026667-7.594667l76.938666-188.170666c16.032-39.2 60.618667-57.92 99.52-41.461334a76.309333 76.309333 0 0 1 40.832 41.461334l76.938667 188.16c1.781333 4.373333 5.674667 7.253333 10.026667 7.605333l199.712 16.277333c41.877333 3.413333 72.885333 40.458667 69.568 82.517334a76.938667 76.938667 0 0 1-26.08 51.978666l-152.16 132.586667c-3.541333 3.082667-5.141333 8.074667-4.021334 12.853333l46.485334 198.24c9.621333 41.013333-15.36 82.336-56.138667 92.224a75.285333 75.285333 0 0 1-57.525333-9.237333l-170.976-106.24a11.296 11.296 0 0 0-12.010667 0l-170.986667 106.24z" p-id="4938"></path></svg>
\ No newline at end of file \ No newline at end of file
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1661508487793" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="2779" xmlns:xlink="http://www.w3.org/1999/xlink" width="28" height="28"><path d="M946.44567 407.179676c-3.706415-11.056823-13.268188-19.154245-24.823362-20.929682l-263.117606-40.614L540.930913 93.91802c-5.108345-10.93198-16.071024-17.939581-28.155247-17.971303-0.030699 0-0.062422 0-0.062422 0-12.021801 0-22.985504 6.945179-28.155247 17.84646L365.79001 345.247138l-263.917832 39.507806c-11.399631 1.961678-20.774139 10.060123-24.355711 21.054525-3.613294 10.963703-0.778736 23.047926 7.257288 31.332612l191.202717 196.684568-45.6282 277.132808c-1.930979 11.741415 3.0208 23.608697 12.769838 30.491455 9.717316 6.882757 22.549575 7.630794 32.983205 1.868557l235.366565-129.47177 234.868215 130.282229c4.703115 2.616594 9.904581 3.924379 15.106046 3.924379 6.291287 0 12.551874-1.868557 17.877159-5.699816 9.748015-6.852058 14.763239-18.687618 12.862959-30.460756L747.488339 634.635061l191.669344-195.84341C947.286828 430.476265 950.121386 418.2365 946.44567 407.179676zM691.986257 602.337471c-6.882757 7.039323-10.060123 16.974603-8.471952 26.722618l37.000706 229.480508L526.666024 751.025908c-9.343809-5.232165-20.74344-5.232165-30.117948-0.062422L302.262138 857.856006l37.779442-229.387387c1.588171-9.717316-1.52575-19.652596-8.40953-26.754341L170.703847 436.176081l220.156142-31.686676c2.191922-0.378623 4.288676-0.980327 6.274914-1.771343 7.674796-2.63092 14.32117-8.233522 18.061354-16.156982l97.392144-206.183919 96.550986 206.712969c4.422729 9.406231 13.205766 16.008602 23.483854 17.596773l219.638349 33.886785L691.986257 602.337471z" p-id="2780"></path></svg> <?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1671607054461" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4481" xmlns:xlink="http://www.w3.org/1999/xlink" width="128" height="128"><path d="M335.008 916.629333c-35.914667 22.314667-82.88 10.773333-104.693333-25.557333a77.333333 77.333333 0 0 1-8.96-57.429333l46.485333-198.24a13.141333 13.141333 0 0 0-4.021333-12.864l-152.16-132.586667c-31.605333-27.52-35.253333-75.648-8.234667-107.733333a75.68 75.68 0 0 1 51.733333-26.752L354.848 339.2c4.352-0.362667 8.245333-3.232 10.026667-7.594667l76.938666-188.170666c16.032-39.2 60.618667-57.92 99.52-41.461334a76.309333 76.309333 0 0 1 40.832 41.461334l76.938667 188.16c1.781333 4.373333 5.674667 7.253333 10.026667 7.605333l199.712 16.277333c41.877333 3.413333 72.885333 40.458667 69.568 82.517334a76.938667 76.938667 0 0 1-26.08 51.978666l-152.16 132.586667c-3.541333 3.082667-5.141333 8.074667-4.021334 12.853333l46.485334 198.24c9.621333 41.013333-15.36 82.336-56.138667 92.224a75.285333 75.285333 0 0 1-57.525333-9.237333l-170.976-106.24a11.296 11.296 0 0 0-12.010667 0l-170.986667 106.24zM551.786667 756.032l170.976 106.24c2.624 1.621333 5.717333 2.122667 8.650666 1.408 6.410667-1.557333 10.56-8.426667 8.928-15.424l-46.485333-198.24a77.141333 77.141333 0 0 1 24.277333-75.733333L870.293333 441.706667c2.485333-2.165333 4.053333-5.312 4.330667-8.746667 0.565333-7.136-4.490667-13.173333-10.976-13.696l-199.712-16.288a75.989333 75.989333 0 0 1-64.064-47.168l-76.938667-188.16a12.309333 12.309333 0 0 0-6.538666-6.741333c-5.898667-2.496-12.725333 0.373333-15.328 6.741333l-76.949334 188.16a75.989333 75.989333 0 0 1-64.064 47.168l-199.701333 16.288a11.68 11.68 0 0 0-7.978667 4.181333 13.226667 13.226667 0 0 0 1.333334 18.261334l152.16 132.586666a77.141333 77.141333 0 0 1 24.277333 75.733334l-46.485333 198.229333a13.333333 13.333333 0 0 0 1.514666 9.877333c3.488 5.792 10.581333 7.530667 16.064 4.128l170.986667-106.229333a75.296 75.296 0 0 1 79.562667 0z" p-id="4482"></path></svg>
\ No newline at end of file \ No newline at end of file
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1671607060729" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4633" xmlns:xlink="http://www.w3.org/1999/xlink" width="128" height="128"><path d="M64 483.04V872c0 37.216 30.144 67.36 67.36 67.36H192V416.32l-60.64-0.64A67.36 67.36 0 0 0 64 483.04zM857.28 344.992l-267.808 1.696c12.576-44.256 18.944-83.584 18.944-118.208 0-78.56-68.832-155.488-137.568-145.504-60.608 8.8-67.264 61.184-67.264 126.816v59.264c0 76.064-63.84 140.864-137.856 148L256 416.96v522.4h527.552a102.72 102.72 0 0 0 100.928-83.584l73.728-388.96a102.72 102.72 0 0 0-100.928-121.824z" p-id="4634"></path></svg>
\ No newline at end of file
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1671607066277" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4785" xmlns:xlink="http://www.w3.org/1999/xlink" width="128" height="128"><path d="M857.28 344.992h-264.832c12.576-44.256 18.944-83.584 18.944-118.208 0-78.56-71.808-153.792-140.544-143.808-60.608 8.8-89.536 59.904-89.536 125.536v59.296c0 76.064-58.208 140.928-132.224 148.064l-117.728-0.192A67.36 67.36 0 0 0 64 483.04V872c0 37.216 30.144 67.36 67.36 67.36h652.192a102.72 102.72 0 0 0 100.928-83.584l73.728-388.96a102.72 102.72 0 0 0-100.928-121.824zM128 872V483.04c0-1.856 1.504-3.36 3.36-3.36H208v395.68H131.36A3.36 3.36 0 0 1 128 872z m767.328-417.088l-73.728 388.96a38.72 38.72 0 0 1-38.048 31.488H272V476.864a213.312 213.312 0 0 0 173.312-209.088V208.512c0-37.568 12.064-58.912 34.72-62.176 27.04-3.936 67.36 38.336 67.36 80.48 0 37.312-9.504 84-28.864 139.712a32 32 0 0 0 30.24 42.496h308.512a38.72 38.72 0 0 1 38.048 45.888z" p-id="4786"></path></svg>
\ No newline at end of file
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1661222710493" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="8192" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css">@font-face { font-family: feedback-iconfont; src: url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff2?t=1630033759944") format("woff2"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff?t=1630033759944") format("woff"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.ttf?t=1630033759944") format("truetype"); }
</style></defs><path d="M397.184 642.112a192 192 0 1 1-10.144-270.464L554.592 262.4a144 144 0 1 1 36.8 52.416l-165.44 107.84c14.08 26.72 22.016 57.12 22.016 89.376a191.36 191.36 0 0 1-15.808 76.384l241.056 135.584a144 144 0 1 1-28.992 57.12l-247.072-138.976z" p-id="8193"></path></svg>
\ No newline at end of file
<?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1657871877834" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="13638" xmlns:xlink="http://www.w3.org/1999/xlink" width="200" height="200"><defs><style type="text/css">@font-face { font-family: feedback-iconfont; src: url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff2?t=1630033759944") format("woff2"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.woff?t=1630033759944") format("woff"), url("//at.alicdn.com/t/font_1031158_u69w8yhxdu.ttf?t=1630033759944") format("truetype"); } <?xml version="1.0" standalone="no"?><!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd"><svg t="1671608555533" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4541" xmlns:xlink="http://www.w3.org/1999/xlink" width="128" height="128"><path d="M997 435.6c-28.2-36.7-65.4-81.4-107.4-122.2-54.6-53.2-110.5-95.6-166.1-126.3-71.2-39.2-142-59.1-210.7-59.1s-139.6 19.9-210.7 59.1c-55.5 30.7-111.4 73.1-166.1 126.3-42 40.8-79.3 85.5-107.5 122.1-34.8 45.3-34.8 107.8 0 153.1 28.2 36.7 65.4 81.4 107.4 122.2C190.5 764 246.5 806.4 302 837.1c71.2 39.2 142.1 59.1 210.7 59.1 68.7 0 139.6-19.9 210.8-59 55.5-30.7 111.4-73.1 166.1-126.3 42-40.8 79.3-85.6 107.4-122.2 34.8-45.3 34.8-107.8 0-153.1z m-37.3 99c-66.2 89-243.8 299-446.8 299-57.5 0-117.7-17.1-179-50.8-50.5-27.7-101.7-66.6-152.2-115.6-51.1-49.5-91-99.5-115.7-132.6-10-13.5-10-31.6 0-44.9 66.1-89 243.7-299 446.8-299 57.5 0 117.6 17.1 179 50.8 50.5 27.7 101.7 66.6 152.2 115.6 51.1 49.5 91 99.5 115.7 132.6 9.9 13.4 9.9 31.6 0 44.9z" p-id="4542"></path><path d="M512 321.7c-105.7 0-191.6 86-191.6 191.6 0 105.7 86 191.6 191.6 191.6s191.6-86 191.6-191.6c0-105.7-86-191.6-191.6-191.6z m0 319.2c-70.3 0-127.6-57.2-127.6-127.6S441.7 385.7 512 385.7s127.6 57.2 127.6 127.6S582.3 640.9 512 640.9z" p-id="4543"></path></svg>
</style></defs><path d="M1024 512c-93.44 180.224-287.744 303.872-512 303.872S93.44 692.224 0 512c93.44-180.224 287.744-303.872 512-303.872S930.56 331.776 1024 512zM512 698.112c110.08 0 199.168-85.248 199.168-190.464S622.08 317.184 512 317.184s-199.168 85.248-199.168 190.464S401.92 698.112 512 698.112z" p-id="13639"></path><path d="M369.664 512c0 83.2 63.744 150.784 142.336 150.784S654.336 595.2 654.336 512 590.592 361.216 512 361.216 369.664 428.8 369.664 512z" p-id="13640"></path></svg> \ No newline at end of file
\ No newline at end of file
...@@ -58,13 +58,13 @@ router.afterEach((to, from) => { ...@@ -58,13 +58,13 @@ router.afterEach((to, from) => {
function gotoRouter(to, next) { function gotoRouter(to, next) {
getMenu() // 获取动态路由的方法 getMenu() // 获取动态路由的方法
.then(res => { .then(res => {
console.log(res.data.menus);
// const asyncRouter = addRouter(res.data.menus); // 进行递归解析 const asyncRouter = addRouter(res.data.menus); // 进行递归解析
// return asyncRouter; return asyncRouter;
//TODO:前端暂时写死 //TODO:前端暂时写死
const asyncRouter = addRouter(); // 进行递归解析 // const asyncRouter = addRouter(); // 进行递归解析
return asyncRouter; // return asyncRouter;
// store.dispatch("user/setroles", res.data.permit); // store.dispatch("user/setroles", res.data.permit);
......
...@@ -152,35 +152,14 @@ export const asyncRouterMap = [ ...@@ -152,35 +152,14 @@ export const asyncRouterMap = [
} }
}, },
{ {
path: 'approval', path: 'displayApproval',
name: 'Approval', name: 'DisplayApproval',
component: () => import('@/views/approval/culturalRelic'), component: () => import('@/views/displayApproval/index.vue'),
redirect: '/crApproval',
meta: { meta: {
title: '审批管理', title: '展览审批',
icon: 'product' icon: 'approval'
}, }
children: [ },
{
path: 'crApproval',
name: 'CrApproval',
component: () => import('@/views/approval/culturalRelic.vue'),
meta: {
title: '文物',
icon: 'culturalRelic'
}
},
{
path: 'displayApproval',
name: 'DisplayApproval',
component: () => import('@/views/approval/display.vue'),
meta: {
title: '展览',
icon: 'display'
}
}
]
}
] ]
}, },
{ {
......
...@@ -4,194 +4,164 @@ import Layout from '@/layout' ...@@ -4,194 +4,164 @@ import Layout from '@/layout'
* @param {Array} routerlist 格式化路由 * @param {Array} routerlist 格式化路由
* @returns * @returns
*/ */
// export function addRouter(routerlist) { export function addRouter(routerlist) {
// const router = [] const router = []
// try { try {
// routerlist.forEach(e => { routerlist.forEach(e => {
// if (e.path && e.menuName && e.component) { if (e.path && e.menuName && e.component) {
// let e_new = { let e_new = {
// path: e.path, path: e.path,
// name: e.menuName, name: e.menuName,
// component: resolve => e.component === 'Layout' ? require([`@/layout`], resolve) : require([`@/views/${e.component}/index`], resolve) component: resolve => e.component === 'Layout' ? require([`@/layout`], resolve) : require([`@/views/${e.component}/index`], resolve)
// } }
// if (e.children) { if (e.children) {
// const children = addRouter(e.children) const children = addRouter(e.children)
// // 保存权限 // 保存权限
// e_new = { ...e_new, children: children } e_new = { ...e_new, children: children }
// } }
// if (e.redirect) { if (e.redirect) {
// e_new = { ...e_new, redirect: e.redirect } e_new = { ...e_new, redirect: e.redirect }
// } }
// // if (e.generatemenu === 0) { // if (e.generatemenu === 0) {
// // e_new = { ...e_new, hidden: true } // e_new = { ...e_new, hidden: true }
// // } // }
// if (e.icon !== '' && e.menuLabel !== '') { if (e.icon !== '' && e.menuLabel !== '') {
// e_new = { ...e_new, meta: { title: e.menuLabel, icon: e.icon } } e_new = { ...e_new, meta: { title: e.menuLabel, icon: e.icon } }
// } else if (e.menuLabel !== '' && e.icon === '') { } else if (e.menuLabel !== '' && e.icon === '') {
// e_new = { ...e_new, meta: { title: e.menuLabel } } e_new = { ...e_new, meta: { title: e.menuLabel } }
// } }
// router.push(e_new) router.push(e_new)
// } }
// }) })
// } catch (error) { } catch (error) {
// console.error(error) console.error(error)
// return [] return []
// } }
// return router return router
// } }
/** /**
* 前端测试使用,暂时写死 * 前端测试使用,暂时写死
*/ */
export function addRouter() { // export function addRouter() {
const asyncRouterMap = [ // const asyncRouterMap = [
{ // {
path: '/business', // path: '/business',
component: Layout, // component: Layout,
name: 'Business', // name: 'Business',
hidden: false, // hidden: false,
meta: { // meta: {
title: '业务管理', // title: '业务管理',
icon: 'yewu' // icon: 'yewu'
}, // },
redirect: '/culturalRelic', // redirect: '/culturalRelic',
children: [{ // children: [{
path: 'culturalRelic', // path: 'culturalRelic',
name: 'CulturalRelic', // name: 'CulturalRelic',
component: () => import('@/views/culturalRelic/index'), // component: () => import('@/views/culturalRelic/index'),
meta: { // meta: {
title: '文物管理', // title: '文物管理',
icon: 'culturalRelic' // icon: 'culturalRelic'
}, // },
}, // },
{ // {
path: 'display', // path: 'display',
name: 'Display', // name: 'Display',
component: () => import('@/views/display/index'), // component: () => import('@/views/display/index'),
meta: { // meta: {
title: '展览管理', // title: '展览管理',
icon: 'display' // icon: 'display'
} // }
}, // },
// { // {
// path: 'boutique', // path: 'museum',
// name: 'Boutique', // name: 'Museum',
// component: () => import('@/views/boutique/index'), // component: () => import('@/views/museum/index'),
// meta: { // meta: {
// title: '精品展管理', // title: '博物馆管理',
// icon: 'boutique' // icon: 'museum'
// } // }
// }, // },
{ // {
path: 'museum', // path: 'virtual',
name: 'Museum', // name: 'Virtual',
component: () => import('@/views/museum/index'), // component: () => import('@/views/virtual/index'),
meta: { // meta: {
title: '博物馆管理', // title: '虚拟展厅',
icon: 'museum' // icon: 'virtual'
} // }
}, // },
{ // {
path: 'virtual', // path: 'literature',
name: 'Virtual', // name: 'Literature',
component: () => import('@/views/virtual/index'), // component: () => import('@/views/literature/index'),
meta: { // meta: {
title: '虚拟展厅', // title: '文献管理',
icon: 'virtual' // icon: 'literature'
} // }
}, // },
{ // {
path: 'literature', // path: 'product',
name: 'Literature', // name: 'Product',
component: () => import('@/views/literature/index'), // component: () => import('@/views/product/index'),
meta: { // meta: {
title: '文献管理', // title: '文创产品管理',
icon: 'literature' // icon: 'product'
} // }
}, // },
{ // {
path: 'product', // path: 'displayApproval',
name: 'Product', // name: 'DisplayApproval',
component: () => import('@/views/product/index'), // component: () => import('@/views/displayApproval/index.vue'),
meta: { // meta: {
title: '文创产品管理', // title: '展览审批',
icon: 'product' // icon: 'approval'
} // }
}, // },
{ // ]
path: 'approval', // },
name: 'Approval', // {
component: () => import('@/views/approval/index'), // path: '/system',
// redirect: '/crApproval', // component: Layout,
meta: { // name: 'System',
title: '审批管理', // hidden: false,
icon: 'approval' // meta: {
}, // title: '系统管理',
children: [ // icon: 'xitong'
// { // },
// path: 'crApproval', // redirect: '/user',
// name: 'CrApproval', // children: [{
// component: () => import('@/views/approval/culturalRelic.vue'), // path: 'user',
// meta: { // name: 'User',
// title: '文物', // component: () => import('@/views/user/index'),
// icon: 'culturalRelic' // meta: {
// } // title: '用户管理',
// }, // icon: 'user2'
{ // }
path: 'displayApproval', // },
name: 'DisplayApproval', // {
component: () => import('@/views/approval/display.vue'), // path: 'role',
meta: { // name: 'Role',
title: '展览审批', // component: () => import('@/views/role/index'),
icon: 'display' // meta: {
} // title: '角色管理',
} // icon: 'role'
] // }
} // },
] // {
}, // path: 'log',
{ // name: 'Log',
path: '/system', // component: () => import('@/views/log/index'),
component: Layout, // meta: {
name: 'System', // title: '日志管理',
hidden: false, // icon: 'log'
meta: { // }
title: '系统管理', // },
icon: 'xitong' // ]
}, // },
redirect: '/user', // ]
children: [{
path: 'user',
name: 'User',
component: () => import('@/views/user/index'),
meta: {
title: '用户管理',
icon: 'user2'
}
},
{
path: 'role',
name: 'Role',
component: () => import('@/views/role/index'),
meta: {
title: '角色管理',
icon: 'role'
}
},
{
path: 'log',
name: 'Log',
component: () => import('@/views/log/index'),
meta: {
title: '日志管理',
icon: 'log'
}
},
]
},
]
return asyncRouterMap // return asyncRouterMap
} // }
\ No newline at end of file \ No newline at end of file
<template>
<el-dialog :visible.sync="dialogVisible" width="80%" style="height: 98%" :before-close="handleClose" top="5vh"
lock-scroll>
<div class="title" slot="title">
<div class="divider"></div>
<div class="label">{{ title }}</div>
</div>
<div class="dialog-content">
<el-descriptions class="margin-top" title="文物详情" :column="3" :size="size" border>
<template slot="extra">
<el-button type="primary" size="small">同意</el-button>
<el-button type="danger" size="small">驳回</el-button>
</template>
<el-descriptions-item>
<template slot="label">
<i class="el-icon-user"></i>
文物名称
</template>
{{crDetail.name}}
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
<i class="el-icon-mobile-phone"></i>
馆藏介绍
</template>
18100000000
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
<i class="el-icon-mobile-phone"></i>
文物封面
</template>
18100000000
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
<i class="el-icon-mobile-phone"></i>
文物图片
</template>
18100000000
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
<i class="el-icon-mobile-phone"></i>
文物视频
</template>
18100000000
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
<i class="el-icon-mobile-phone"></i>
文物音频
</template>
18100000000
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
<i class="el-icon-mobile-phone"></i>
馆藏单位
</template>
18100000000
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
<i class="el-icon-location-outline"></i>
文物类别
</template>
苏州市
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
<i class="el-icon-tickets"></i>
文物质地
</template>
<el-tag size="small">学校</el-tag>
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
<i class="el-icon-office-building"></i>
文物年代
</template>
江苏省苏州市吴中区吴中大道 1188 号
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
<i class="el-icon-office-building"></i>
文物级别
</template>
江苏省苏州市吴中区吴中大道 1188 号
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
<i class="el-icon-office-building"></i>
文物数量
</template>
江苏省苏州市吴中区吴中大道 1188 号
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
<i class="el-icon-office-building"></i>
关联文献
</template>
江苏省苏州市吴中区吴中大道 1188 号
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
<i class="el-icon-office-building"></i>
主题词
</template>
江苏省苏州市吴中区吴中大道 1188 号
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
<i class="el-icon-office-building"></i>
3durl链接
</template>
江苏省苏州市吴中区吴中大道 1188 号
</el-descriptions-item>
<el-descriptions-item>
<template slot="label">
<i class="el-icon-office-building"></i>
备注
</template>
江苏省苏州市吴中区吴中大道 1188 号
</el-descriptions-item>
</el-descriptions>
<div class="dialog-footer">
<el-button type="primary" @click="handleClose">关闭</el-button>
</div>
</div>
</el-dialog>
</template>
<script>
import { mapGetters } from "vuex";
export default {
name: "PreviewDialog",
components: {
},
props: {
visible: {
type: Boolean,
default: false,
},
crDetail: {
type: Object,
default: () => ({}),
},
},
computed: {
...mapGetters(["dicts"]),
title() {
return "预览——" + this.crDetail.name;
},
},
watch: {
visible: {
handler: function (value) {
this.dialogVisible = value;
},
immediate: true,
deep: true,
},
},
data() {
return {
dialogVisible: false,
};
},
async mounted() {
await this.$store.dispatch("dict/getDictList", [
"displayType",
"displayCharacter",
]);
},
methods: {
handleClose(done) {
this.$emit("handleClose");
},
},
};
</script>
<style lang='scss' scoped>
.title {
display: flex;
margin-bottom: 16px;
.divider {
width: 8px;
border-left: 4px solid #409eff;
margin-right: 8px;
}
.label {
font-weight: bold;
}
}
.dialog-content {
padding: 0 32px;
display: flex;
flex-direction: column;
.relate {
flex: 1;
}
.dialog-footer {
display: flex;
justify-content: flex-end;
margin-top: 40px;
}
}
.video-container {
background-color: #000;
display: flex;
justify-content: center;
}
.el-dialog__body {
padding: 0 20px 30px 20px;
}
</style>
\ No newline at end of file
<template>
<div class="app-container">
<div class="top-bar">
<SearchBar :config="searchConfig" @search="search" @reset="reset" />
<!-- <el-button
type="primary"
@click.native="handleOperation({ type: 'add' })"
icon="el-icon-plus"
>
发布</el-button
>
</div> -->
</div>
<TablePage
:data="list.records"
:tableTitle="tableTitle"
:operates="tableOperates"
>
<template v-slot:status="data">
<el-popconfirm
:title="getStatusTitle(data.scope.status)"
@confirm="handleChangeStatus(data.scope)"
>
<el-switch
slot="reference"
:value="Boolean(Number(data.scope.status))"
></el-switch>
</el-popconfirm>
</template>
<template v-slot:displayType="data">
{{ dicts.displayType[data.scope.type] }}
</template>
<template v-slot:faceImageUrl="data">
<img
:src="
$getFullUrl(data.scope.faceImagePressUrl || data.scope.faceImageUrl)
"
alt="暂无图片"
v-if="
$getFullUrl(data.scope.faceImagePressUrl || data.scope.faceImageUrl)
"
style="cursor: pointer"
width="100px"
@click="handelPreviewImages(data.scope.faceImageUrl)"
/>
</template>
<template v-slot:operates="scope">
<TableOperation
:operations="tableOperations"
:rawData="scope.scope.row"
@handleOperation="handleOperation"
></TableOperation>
</template>
</TablePage>
<el-pagination
style="margin: 16px 0"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
:current-page="Number(list.current)"
:page-sizes="[10, 20, 50, 100]"
:page-size="Number(list.size)"
layout="total, sizes, prev, pager, next, jumper"
:total="Number(list.total)"
class="pagination"
>
</el-pagination>
<PreviewCrDialog
v-if="Object.keys(curPreviewObj).length > 0"
:visible="previewDialogVisible"
:displayDetail="curPreviewObj"
@handleClose="handleClosePreviewDialog"
/>
<!-- <CopyDialog
:visible="copyDialogVisible"
@handleClose="handleCloseCopyDialog"
@handleCopySelect="handleCopySelect"
:list="list"
/> -->
<el-image-viewer
v-if="imgViewerVisible"
:on-close="closeImgViewer"
:url-list="imgList"
/>
</div>
</template>
<script>
import TablePage from "@/components/Table/TablePage.vue";
import TableOperation from "@/components/Table/TableOperation.vue";
import PreviewCrDialog from './components/PreviewCrDialog.vue'
import { crTabletitle, operates, operations } from "./config";
import {
getListPer,
getDisplayById,
editDisplay,
} from "@/api/display";
import SearchBar from "@/components/SearchBar";
import { mapGetters } from "vuex";
import { getToken } from "@/utils/auth";
import { importZip } from "@/utils/file";
export default {
components: {
TablePage,
TableOperation,
SearchBar,
PreviewCrDialog,
"el-image-viewer": () =>
import("element-ui/packages/image/src/image-viewer"),
},
data() {
let that = this;
return {
list: {
record: [],
size: 10,
current: 1,
total: 0,
},
searchForm: {
name: "",
status: "",
},
searchConfig: [
{
prop: "title",
type: "input",
label: "文物名称",
},
{
prop: "status",
type: "select",
label: "状态",
selectOptions: [
{
label: "已上线",
value: "1",
},
{
label: "已下线",
value: "0",
},
],
},
],
editDialogVisible: false,
isAdd: true,
form: {
title: "", //标题
type: "", // 类别(待定)--枚举值(社会、生活等)
displayCharacter: "1", //展览性质(精品展2、布展1、文物展3)--此处填写布展类别
keyword: "", // 关键词
deptId: "", //展览单位id--暂填入用户自己的单位
regionCode: "", // 所在地域--暂填入用户自己的地区
intro: "", //展览介绍,
themeType: "1", //模板主题--前端枚举
literature: "", //关联文献。id1,id2,id3--接口查询
remark: "", //备注
status: 1, //上下架状态(0-下架,1-上架)
faceImage: "", // 封面(图片1张)
images: "", //展览图片
videos: "", //展览视频
audios: "", //展览音频
exhibitionUnits: [], //布展单元
},
loading: false,
imgViewerVisible: false,
previewDialogVisible: false,
curPreviewObj: {}, //当前预览的对象
currentPageIds: [], //当前的id数组,用于给详情页切换用
importZipUrl: process.env.VUE_APP_BASE_API + "/bizImport/importZip",
headers: {
authorization: getToken(),
},
multiUploadVisible: false, //控制批量上传弹窗显示
importRecordVisible: false, //上传记录
filesList: [], //上传当中的文件队列
uploadCount: 0, //处于上传中的文件数量,当等于fileList的时候就关闭弹窗,请求完毕一个就++
cancelUploadArr: [], //保存每个文件上传接口对应的取消请求的函数[fn,fn,fn...]
isUpLoading: false,
};
},
computed: {
...mapGetters(["dicts"]),
tableTitle() {
return crTabletitle;
},
tableOperates() {
return operates;
},
tableOperations() {
return operations;
},
getStatusTitle(status) {
return (status) => {
if (Number(status)) {
return "是否确定要下架?";
} else {
return "是否确定要上架?";
}
};
},
},
async created() {
await this.$store.dispatch("dict/getDictList", ["displayType"]);
this.loadData();
},
//watch部分
watch: {
//监听弹窗变化
multiUploadVisible(val) {
//弹窗关闭记得清空,开启执行批量上传
if (val) {
for (let i = 0; i < this.filesList.length; i++) {
this.uploadSelf(this.filesList[i].file, i); //弹窗显示的时候,就根据文件队列的数量调用上传接口
}
} else {
//弹窗关闭,还原数据到初始位置
this.filesList = [];
this.uploadCount = 0;
this.cancelUploadArr = [];
}
},
},
methods: {
async search(form) {
var params = {
page: 1,
limit: this.list.size,
...form,
};
if (params.status == "") {
delete params.status;
}
let res = await getListPer(params);
if (res.code == 0) {
this.list = res.data;
this.currentPageIds = this.list.records.map((item) => {
return item.exhibitionId;
});
}
},
reset() {
this.loadData();
},
// 加载表格数据
async loadData() {
var params = {
page: this.list.current,
limit: this.list.size,
};
let res = await getListPer(params);
if (res.code == 0) {
this.list = res.data;
this.currentPageIds = this.list.records.map((item) => {
return item.exhibitionId;
});
}
},
async handleOperation(value, row) {
console.log(value, row);
// debugger
switch (value.type) {
case "approval":
if (row) {
this.previewDialogVisible = true;
let res = await getDisplayById({ exhibitionId: row.exhibitionId });
this.curPreviewObj = res.data;
}
break;
}
},
// 多选
handleSelectionChange(val) {
this.multipleSelection = val;
},
// 改变页容量
handleSizeChange(value) {
this.list.size = value;
this.loadData();
},
// 改变当前显示页
handleCurrentChange(value) {
this.list.current = value;
this.loadData();
},
// 关闭Dialog
handleClose() {
this.editDialogVisible = false;
this.form = {
status: 1,
faceImage: "", // 封面(图片1张)
images: "", //展览图片
videos: "", //展览视频
audios: "", //展览音频
exhibitionUnits: [], //布展单元
};
},
// 关闭预览图片
closeImgViewer() {
this.imgViewerVisible = false;
},
// 预览图片
handelPreviewImages(images) {
this.imgViewerVisible = true;
this.imgList = [images];
},
handleClosePreviewDialog() {
this.previewDialogVisible = false;
}
},
};
</script>
<style lang="scss" scoped>
.top-bar {
display: flex;
justify-content: space-between;
flex-direction: column;
height: 68px;
}
.tools {
display: flex;
align-items: center;
justify-content: space-between;
margin-bottom: 14px;
.tools-item {
display: flex;
&:last-child {
justify-content: flex-end;
}
}
.upload-button {
margin: 0 10px;
}
}
</style>
\ No newline at end of file
<template>
<router-view />
</template>
<script>
export default {
}
</script>
<style>
</style>
\ No newline at end of file
<template> <template>
<el-dialog <el-dialog
:visible.sync="dialogVisible" :visible.sync="dialogVisible"
width="90%" width="94%"
style="height: 98%" style="height: 98%"
:before-close="handleClose" :before-close="handleClose"
top="5vh" top="5vh"
...@@ -12,7 +12,8 @@ ...@@ -12,7 +12,8 @@
<div class="label">{{ title }}</div> <div class="label">{{ title }}</div>
</div> </div>
<div class="dialog-content"> <div class="dialog-content">
<BlueStyle <Navbar/>
<NormalStyle
v-if="displayDetail.themeType == '1'" v-if="displayDetail.themeType == '1'"
:displayDetail="displayDetail" :displayDetail="displayDetail"
:dicts="dicts" :dicts="dicts"
...@@ -27,6 +28,7 @@ ...@@ -27,6 +28,7 @@
:displayDetail="displayDetail" :displayDetail="displayDetail"
:dicts="dicts" :dicts="dicts"
/> />
<Footer/>
<div class="dialog-footer"> <div class="dialog-footer">
<el-button type="primary" @click="handleClose">关闭</el-button> <el-button type="primary" @click="handleClose">关闭</el-button>
</div> </div>
...@@ -35,7 +37,7 @@ ...@@ -35,7 +37,7 @@
</template> </template>
<script> <script>
import BlueStyle from "./templates/BlueStyle.vue"; import NormalStyle from "./templates/NormalStyle.vue";
// import NormalStyle from "./components/NormalStyle.vue"; // import NormalStyle from "./components/NormalStyle.vue";
import ChStyle from "./templates/ChStyle.vue"; import ChStyle from "./templates/ChStyle.vue";
import RedStyle from "./templates/RedStyle.vue"; import RedStyle from "./templates/RedStyle.vue";
...@@ -45,11 +47,12 @@ import { mapGetters } from "vuex"; ...@@ -45,11 +47,12 @@ import { mapGetters } from "vuex";
export default { export default {
name: "PreviewDialog", name: "PreviewDialog",
components: { components: {
BlueStyle, NormalStyle,
ChStyle, ChStyle,
RedStyle, RedStyle,
NavBar, NavBar,
Footer Footer,
Navbar
}, },
props: { props: {
visible: { visible: {
......
差异被折叠。
差异被折叠。
Markdown 格式
0%
您添加了 0 到此讨论。请谨慎行事。
请先完成此评论的编辑!
注册 或者 后发表评论