Skip to content

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

修改文物布局、增加图片轮播组件

上级 b69a9b0a
全部展开 隐藏空白字符变更
内嵌 并排
正在显示 包含 895 行增加 和 174 行删除
package-lock.json
浏览文件 @ c5e54b34
...@@ -1983,29 +1983,6 @@ ...@@ -1983,29 +1983,6 @@
"webpack-merge": "^5.7.3", "webpack-merge": "^5.7.3",
"webpack-virtual-modules": "^0.4.2", "webpack-virtual-modules": "^0.4.2",
"whatwg-fetch": "^3.6.2" "whatwg-fetch": "^3.6.2"
},
"dependencies": {
"@vue/vue-loader-v15": {
"version": "npm:vue-loader@15.10.0",
"resolved": "https://registry.npmmirror.com/vue-loader/-/vue-loader-15.10.0.tgz",
"integrity": "sha512-VU6tuO8eKajrFeBzMssFUP9SvakEeeSi1BxdTH5o3+1yUyrldp8IERkSdXlMI2t4kxF2sqYUDsQY+WJBxzBmZg==",
"dev": true,
"requires": {
"@vue/component-compiler-utils": "^3.1.0",
"hash-sum": "^1.0.2",
"loader-utils": "^1.1.0",
"vue-hot-reload-api": "^2.3.0",
"vue-style-loader": "^4.1.0"
},
"dependencies": {
"hash-sum": {
"version": "1.0.2",
"resolved": "https://registry.npmmirror.com/hash-sum/-/hash-sum-1.0.2.tgz",
"integrity": "sha512-fUs4B4L+mlt8/XAtSOGMUO1TXmAelItBPtJG7CyHJfYTdDjwisntGO2JQz7oUsatOY9o68+57eziUVNw/mRHmA==",
"dev": true
}
}
}
} }
}, },
"@vue/cli-shared-utils": { "@vue/cli-shared-utils": {
...@@ -2156,6 +2133,27 @@ ...@@ -2156,6 +2133,27 @@
"eslint-import-resolver-webpack": "^0.13.1" "eslint-import-resolver-webpack": "^0.13.1"
} }
}, },
"@vue/vue-loader-v15": {
"version": "npm:vue-loader@15.10.0",
"resolved": "https://registry.npmmirror.com/vue-loader/-/vue-loader-15.10.0.tgz",
"integrity": "sha512-VU6tuO8eKajrFeBzMssFUP9SvakEeeSi1BxdTH5o3+1yUyrldp8IERkSdXlMI2t4kxF2sqYUDsQY+WJBxzBmZg==",
"dev": true,
"requires": {
"@vue/component-compiler-utils": "^3.1.0",
"hash-sum": "^1.0.2",
"loader-utils": "^1.1.0",
"vue-hot-reload-api": "^2.3.0",
"vue-style-loader": "^4.1.0"
},
"dependencies": {
"hash-sum": {
"version": "1.0.2",
"resolved": "https://registry.npmmirror.com/hash-sum/-/hash-sum-1.0.2.tgz",
"integrity": "sha512-fUs4B4L+mlt8/XAtSOGMUO1TXmAelItBPtJG7CyHJfYTdDjwisntGO2JQz7oUsatOY9o68+57eziUVNw/mRHmA==",
"dev": true
}
}
},
"@vue/web-component-wrapper": { "@vue/web-component-wrapper": {
"version": "1.3.0", "version": "1.3.0",
"resolved": "https://registry.npmmirror.com/@vue/web-component-wrapper/-/web-component-wrapper-1.3.0.tgz", "resolved": "https://registry.npmmirror.com/@vue/web-component-wrapper/-/web-component-wrapper-1.3.0.tgz",
...@@ -4106,20 +4104,11 @@ ...@@ -4106,20 +4104,11 @@
"integrity": "sha512-6QvTW9mrGeIegrFXdtQi9pk7O/nSK6lSdXW2eqUspN5LWD7UTji2Fqw5V2YLjBpHEoU9Xl/eUWNpDeZvoyOv2w==" "integrity": "sha512-6QvTW9mrGeIegrFXdtQi9pk7O/nSK6lSdXW2eqUspN5LWD7UTji2Fqw5V2YLjBpHEoU9Xl/eUWNpDeZvoyOv2w=="
}, },
"dom7": { "dom7": {
"version": "2.1.5", "version": "4.0.4",
"resolved": "https://registry.npmmirror.com/dom7/-/dom7-2.1.5.tgz", "resolved": "https://registry.npmmirror.com/dom7/-/dom7-4.0.4.tgz",
"integrity": "sha512-xnhwVgyOh3eD++/XGtH+5qBwYTgCm0aW91GFgPJ3XG+jlsRLyJivnbP0QmUBFhI+Oaz9FV0s7cxgXHezwOEBYA==", "integrity": "sha512-DSSgBzQ4rJWQp1u6o+3FVwMNnT5bzQbMb+o31TjYYeRi05uAcpF8koxdfzeoe5ElzPmua7W7N28YJhF7iEKqIw==",
"dev": true,
"requires": { "requires": {
"ssr-window": "^2.0.0" "ssr-window": "^4.0.0"
},
"dependencies": {
"ssr-window": {
"version": "2.0.0",
"resolved": "https://registry.npmmirror.com/ssr-window/-/ssr-window-2.0.0.tgz",
"integrity": "sha512-NXzN+/HPObKAx191H3zKlYomE5WrVIkoCB5IaSdvKokxTpjBdWfr0RaP+1Z5KOfDT0ZVz+2tdtiBkhsEQ9p+0A==",
"dev": true
}
} }
}, },
"domelementtype": { "domelementtype": {
...@@ -9966,10 +9955,9 @@ ...@@ -9966,10 +9955,9 @@
} }
}, },
"ssr-window": { "ssr-window": {
"version": "1.0.1", "version": "4.0.2",
"resolved": "https://registry.npmmirror.com/ssr-window/-/ssr-window-1.0.1.tgz", "resolved": "https://registry.npmmirror.com/ssr-window/-/ssr-window-4.0.2.tgz",
"integrity": "sha512-dgFqB+f00LJTEgb6UXhx0h+SrG50LJvti2yMKMqAgzfUmUXZrLSv2fjULF7AWGwK25EXu8+smLR3jYsJQChPsg==", "integrity": "sha512-ISv/Ch+ig7SOtw7G2+qkwfVASzazUnvlDTwypdLoPoySv+6MqlOV10VwPSE6EWkGjhW50lUmghPmpYZXMu/+AQ=="
"dev": true
}, },
"ssri": { "ssri": {
"version": "8.0.1", "version": "8.0.1",
...@@ -10482,13 +10470,12 @@ ...@@ -10482,13 +10470,12 @@
} }
}, },
"swiper": { "swiper": {
"version": "4.5.1", "version": "7.4.1",
"resolved": "https://registry.npmmirror.com/swiper/-/swiper-4.5.1.tgz", "resolved": "https://registry.npmmirror.com/swiper/-/swiper-7.4.1.tgz",
"integrity": "sha512-se6I7PWWu950NAMXXT+ENtF/6SVb8mPyO+bTfNxbQBILSeLqsYp3Ndap+YOA0EczOIUlea274PKejT6gKZDseA==", "integrity": "sha512-dhbL4tpYFvHug1J7GnKElfTi6EYhlZy/vNZRhHkWFyUsWZ1Vovipxj3la5gqllMogygXJMe3zvVv+f6eppvWiA==",
"dev": true,
"requires": { "requires": {
"dom7": "^2.1.3", "dom7": "^4.0.2",
"ssr-window": "^1.0.1" "ssr-window": "^4.0.2"
} }
}, },
"table": { "table": {
...@@ -11195,6 +11182,41 @@ ...@@ -11195,6 +11182,41 @@
"requires": { "requires": {
"object-assign": "^4.1.1", "object-assign": "^4.1.1",
"swiper": "^4.0.7" "swiper": "^4.0.7"
},
"dependencies": {
"dom7": {
"version": "2.1.5",
"resolved": "https://registry.npmmirror.com/dom7/-/dom7-2.1.5.tgz",
"integrity": "sha512-xnhwVgyOh3eD++/XGtH+5qBwYTgCm0aW91GFgPJ3XG+jlsRLyJivnbP0QmUBFhI+Oaz9FV0s7cxgXHezwOEBYA==",
"dev": true,
"requires": {
"ssr-window": "^2.0.0"
},
"dependencies": {
"ssr-window": {
"version": "2.0.0",
"resolved": "https://registry.npmmirror.com/ssr-window/-/ssr-window-2.0.0.tgz",
"integrity": "sha512-NXzN+/HPObKAx191H3zKlYomE5WrVIkoCB5IaSdvKokxTpjBdWfr0RaP+1Z5KOfDT0ZVz+2tdtiBkhsEQ9p+0A==",
"dev": true
}
}
},
"ssr-window": {
"version": "1.0.1",
"resolved": "https://registry.npmmirror.com/ssr-window/-/ssr-window-1.0.1.tgz",
"integrity": "sha512-dgFqB+f00LJTEgb6UXhx0h+SrG50LJvti2yMKMqAgzfUmUXZrLSv2fjULF7AWGwK25EXu8+smLR3jYsJQChPsg==",
"dev": true
},
"swiper": {
"version": "4.5.1",
"resolved": "https://registry.npmmirror.com/swiper/-/swiper-4.5.1.tgz",
"integrity": "sha512-se6I7PWWu950NAMXXT+ENtF/6SVb8mPyO+bTfNxbQBILSeLqsYp3Ndap+YOA0EczOIUlea274PKejT6gKZDseA==",
"dev": true,
"requires": {
"dom7": "^2.1.3",
"ssr-window": "^1.0.1"
}
}
} }
}, },
"vue-eslint-parser": { "vue-eslint-parser": {
......
package.json
浏览文件 @ c5e54b34
...@@ -23,6 +23,7 @@ ...@@ -23,6 +23,7 @@
"qrcodejs2": "^0.0.2", "qrcodejs2": "^0.0.2",
"sass-loader": "^13.0.2", "sass-loader": "^13.0.2",
"svgo": "^2.8.0", "svgo": "^2.8.0",
"swiper": "^7.4.1",
"vue": "^2.6.14", "vue": "^2.6.14",
"vue-router": "^3.5.1", "vue-router": "^3.5.1",
"vue-video-player": "^5.0.2", "vue-video-player": "^5.0.2",
......
src/assets/styles/index.scss
浏览文件 @ c5e54b34
...@@ -12,7 +12,8 @@ ...@@ -12,7 +12,8 @@
} }
#app { #app {
font-family: "Alibaba-PuHuiTi",Avenir, Helvetica, Arial, sans-serif; // font-family: "Alibaba-PuHuiTi",Avenir, Helvetica, Arial, sans-serif;
font-family: Avenir, Helvetica, Arial, sans-serif;
-webkit-font-smoothing: antialiased; -webkit-font-smoothing: antialiased;
-moz-osx-font-smoothing: grayscale; -moz-osx-font-smoothing: grayscale;
} }
......
src/components/ListBanner/index.vue
浏览文件 @ c5e54b34
...@@ -44,7 +44,7 @@ export default { ...@@ -44,7 +44,7 @@ export default {
} }
.text { .text {
font-size: 28px; font-size: 28px;
font-family: "Alibaba-PuHuiTi"; // font-family: "Alibaba-PuHuiTi";
font-weight: 400; font-weight: 400;
color: #2069c4; color: #2069c4;
} }
......
src/components/NavBar/index.vue
浏览文件 @ c5e54b34
...@@ -532,7 +532,7 @@ export default { ...@@ -532,7 +532,7 @@ export default {
color: #fff; color: #fff;
display: flex; display: flex;
align-items: center; align-items: center;
font-family: "Alibaba-PuHuiTi"; // font-family: "Alibaba-PuHuiTi";
position: relative; position: relative;
height: 100%; height: 100%;
text-align: center; text-align: center;
......
src/components/ReaderOperations/collect.vue 0 → 100644
浏览文件 @ c5e54b34
<template>
<span>
<span class="operations">
<span class="operation-item" @click="handleCollect" >
<svg-icon
icon-class="collect-s"
:style="{
fontSize: iconSize + 'px',
color: collectCountStatus ? selectColor : '#61666d',
}"
></svg-icon>
<span>{{
formatNum(collectCount) == 0 ? "收藏" : formatNum(collectCount)
}}</span>
</span>
</span>
<el-dialog
title="登录提示"
:visible.sync="loginDialogVisible"
width="30%"
:before-close="handleLoginClose"
append-to-body
>
<span>读者功能需登录进行使用，是否去登录？</span>
<span slot="footer" class="dialog-footer">
<el-button @click="loginDialogVisible = false">取 消</el-button>
<el-button type="primary" @click.native="handleToLogin"
>确 定</el-button
>
</span>
</el-dialog>
</span>
</template>
<script>
import { mapGetters } from "vuex";
import { debounce, formatNum } from "@/utils/index";
export default {
name: "ReaderOperations",
props: {
// 是否需要收藏，默认需要
collect: {
type: Boolean,
default: true,
},
// 收藏数量
collectCount: {
type: String,
default: "0",
},
// 收藏状态
collectCountStatus: {
type: Boolean,
default: false,
},
sourceId: {
type: String,
default: "",
},
// 来源类型 biz_cultural_relic-文物；biz_exhibition-布展；biz_elite_exhibition-精品展
sourceType: {
type: String,
default: "",
},
title: {
type: String,
default: "",
},
iconSize: {
type: [Number, String],
default: 22,
},
selectColor: {
type: String,
default: "#2069c4",
},
},
data() {
return {
loginDialogVisible: false,
};
},
computed: {
...mapGetters(["token", "showLoginDialog"]),
},
methods: {
handleCollect: debounce(function () {
if (this.token) {
const params = {
sourceId: this.sourceId,
sourceType: this.sourceType,
title: this.title,
};
this.$store.dispatch("user/toggleCollect", params).then(() => {
if (!this.collectCountStatus) {
// 点赞
this.$message.success("已收藏！");
} else {
this.$message.success("已取消收藏！");
}
this.$emit("reload");
});
} else {
this.loginDialogVisible = true;
}
}),
handleLoginClose() {
this.loginDialogVisible = false;
},
handleToLogin() {
this.loginDialogVisible = false;
if (!this.showLoginDialog) {
this.$store.commit("app/OPEN_LOGIN_DIALOG", true);
}
// this.$router.push(`/login?redirect=${this.$route.fullPath}`);
},
formatNum(num) {
return formatNum(num);
},
},
};
</script>
<style lang="scss" scoped>
.operations {
// margin-top: 22px;
display: flex;
justify-content: space-between;
.operation-item {
display: flex;
align-items: center;
// margin-right: 32px;
cursor: pointer;
font-size: 14px;
}
.svg-icon {
margin-right: 10px;
font-size: 24px;
color: #61666d;
}
.collect {
color: #831122;
}
}
.el-button--text {
color: #2069c4;
}
::v-deep .el-input-group__append {
padding: 0 40px;
}
::v-deep .dialog-footer {
.el-button {
border-radius: 0;
}
.el-button--primary {
border: none;
background-color: #2069c4;
}
}
</style>
\ No newline at end of file
src/components/ReaderOperations/index.vue
浏览文件 @ c5e54b34
<template> <template>
<div> <div class="reader-operations">
<div class="operations"> <span class="operations">
<span class="operation-item" v-if="like"> <span class="operation-item" v-if="like">
<svg-icon <svg-icon
@click="handleLike" @click="handleLike"
:icon-class="loveCountStatus ? 'mz-like-s' : 'mz-like'" icon-class="like-s"
:style="{ :style="{
fontSize: iconSize + 'px', fontSize: iconSize + 'px',
color: loveCountStatus ? selectColor : '#61666d', color: loveCountStatus ? selectColor : '#61666d',
...@@ -16,7 +16,7 @@ ...@@ -16,7 +16,7 @@
</span> </span>
<span class="operation-item" @click="handleCollect" v-if="collect"> <span class="operation-item" @click="handleCollect" v-if="collect">
<svg-icon <svg-icon
:icon-class="collectCountStatus ? 'collect-s' : 'collect'" icon-class="collect-s-2"
:style="{ :style="{
fontSize: iconSize + 'px', fontSize: iconSize + 'px',
color: collectCountStatus ? selectColor : '#61666d', color: collectCountStatus ? selectColor : '#61666d',
...@@ -28,16 +28,14 @@ ...@@ -28,16 +28,14 @@
</span> </span>
<span v-if="share" class="operation-item" @click="handleShare"> <span v-if="share" class="operation-item" @click="handleShare">
<svg-icon <svg-icon
icon-class="mz-fx" icon-class="share2"
class="collect"
:style="{ :style="{
fontSize: iconSize + 'px', fontSize: iconSize + 'px',
color: selectColor,
}" }"
></svg-icon> ></svg-icon>
<span>分享</span> <span>分享</span>
</span> </span>
</div> </span>
<el-dialog <el-dialog
title="登录提示" title="登录提示"
:visible.sync="loginDialogVisible" :visible.sync="loginDialogVisible"
...@@ -134,7 +132,7 @@ export default { ...@@ -134,7 +132,7 @@ export default {
}, },
iconSize: { iconSize: {
type: [Number, String], type: [Number, String],
default: 22, default: 28,
}, },
selectColor: { selectColor: {
type: String, type: String,
...@@ -232,8 +230,13 @@ export default { ...@@ -232,8 +230,13 @@ export default {
</script> </script>
<style lang="scss" scoped> <style lang="scss" scoped>
.reader-operations{
width: 100%;
max-width: 300px;
}
.operations { .operations {
// margin-top: 22px; // margin-top: 22px;
width: 100%;
display: flex; display: flex;
justify-content: space-between; justify-content: space-between;
.operation-item { .operation-item {
......
src/components/ReaderOperations/like.vue 0 → 100644
浏览文件 @ c5e54b34
<template>
<span>
<span class="operations">
<span class="operation-item">
<svg-icon
@click="handleLike"
:icon-class="loveCountStatus ? 'like-s' : 'like'"
:style="{
fontSize: iconSize + 'px',
color: loveCountStatus ? selectColor : '#61666d',
}"
></svg-icon>
<span>{{
formatNum(loveCount) == 0 ? "点赞" : formatNum(loveCount)
}}</span>
</span>
</span>
<el-dialog
title="登录提示"
:visible.sync="loginDialogVisible"
width="30%"
:before-close="handleLoginClose"
append-to-body
>
<span>读者功能需登录进行使用，是否去登录？</span>
<span slot="footer" class="dialog-footer">
<el-button @click="loginDialogVisible = false">取 消</el-button>
<el-button type="primary" @click.native="handleToLogin"
>确 定</el-button
>
</span>
</el-dialog>
</span>
</template>
<script>
import { mapGetters } from "vuex";
import { debounce, formatNum } from "@/utils/index";
export default {
name: "Like",
props: {
// 点赞数量
loveCount: {
type: String,
default: "0",
},
// 点赞状态
loveCountStatus: {
type: Boolean,
default: false,
},
sourceId: {
type: String,
default: "",
},
// 来源类型 biz_cultural_relic-文物；biz_exhibition-布展；biz_elite_exhibition-精品展
sourceType: {
type: String,
default: "",
},
title: {
type: String,
default: "",
},
iconSize: {
type: [Number, String],
default: 22,
},
selectColor: {
type: String,
default: "#2069c4",
},
},
data() {
return {
loginDialogVisible: false,
};
},
computed: {
...mapGetters(["token", "showLoginDialog"]),
},
methods: {
// 点赞
handleLike: debounce(function () {
if (this.token) {
const params = {
sourceId: this.sourceId,
sourceType: this.sourceType,
title: this.title,
};
this.$store.dispatch("user/toggleLike", params).then(() => {
if (!this.loveCountStatus) {
// 点赞
this.$message.success("已点赞！");
} else {
this.$message.success("已取消点赞！");
}
this.$emit("reload");
});
} else {
this.loginDialogVisible = true;
}
}, 500),
handleShare() {
this.curLink = window.location.href.toString();
this.shareDialogVisible = true;
},
handleLoginClose() {
this.loginDialogVisible = false;
},
handleToLogin() {
this.loginDialogVisible = false;
if (!this.showLoginDialog) {
this.$store.commit("app/OPEN_LOGIN_DIALOG", true);
}
// this.$router.push(`/login?redirect=${this.$route.fullPath}`);
},
formatNum(num) {
return formatNum(num);
},
},
};
</script>
<style lang="scss" scoped>
.operations {
// margin-top: 22px;
display: flex;
justify-content: space-between;
.operation-item {
display: flex;
align-items: center;
// margin-right: 32px;
cursor: pointer;
font-size: 14px;
}
.svg-icon {
margin-right: 10px;
font-size: 24px;
color: #61666d;
}
.like {
color: #831122;
}
.collect {
color: #831122;
}
}
.el-button--text {
color: #2069c4;
}
::v-deep .el-input-group__append {
padding: 0 40px;
}
::v-deep .dialog-footer {
.el-button {
border-radius: 0;
}
.el-button--primary {
border: none;
background-color: #2069c4;
}
}
</style>
\ No newline at end of file
src/components/ReaderOperations/share.vue 0 → 100644
浏览文件 @ c5e54b34
<template>
<span>
<span class="operations">
<span class="operation-item" @click="handleShare">
<svg-icon
icon-class="share2"
class="collect"
:style="{
fontSize: iconSize + 'px',
color: selectColor,
}"
></svg-icon>
<span>分享</span>
</span>
</span>
<el-dialog
title="分享给朋友"
:visible.sync="shareDialogVisible"
width="40%"
:before-close="handleShareClose"
append-to-body
>
<!-- <div class="qrcode">
</div> -->
<div class="copy">
<!-- <div class="link">{{ curLink }}</div> -->
<el-input v-model="curLink" style="width: 100%">
<template slot="append">
<el-button type="text" @click.native="copyUrl">
<svg-icon icon-class="copy"></svg-icon>
复制链接</el-button
></template
>
</el-input>
</div>
</el-dialog>
</span>
</template>
<script>
import { mapGetters } from "vuex";
import { debounce, formatNum } from "@/utils/index";
export default {
name: "Share",
props: {
sourceId: {
type: String,
default: "",
},
// 来源类型 biz_cultural_relic-文物；biz_exhibition-布展；biz_elite_exhibition-精品展
sourceType: {
type: String,
default: "",
},
title: {
type: String,
default: "",
},
iconSize: {
type: [Number, String],
default: 22,
},
selectColor: {
type: String,
default: "#2069c4",
},
},
data() {
return {
shareDialogVisible: false,
curLink: "", //当前地址栏的链接
};
},
computed: {
...mapGetters(["token", "showLoginDialog"]),
},
methods: {
handleShare() {
this.curLink = window.location.href.toString();
this.shareDialogVisible = true;
},
handleLoginClose() {
this.loginDialogVisible = false;
},
handleShareClose() {
this.shareDialogVisible = false;
},
handleToLogin() {
this.loginDialogVisible = false;
if (!this.showLoginDialog) {
this.$store.commit("app/OPEN_LOGIN_DIALOG", true);
}
// this.$router.push(`/login?redirect=${this.$route.fullPath}`);
},
copyUrl() {
let inputElement = document.createElement("input");
inputElement.value = this.curLink;
document.body.appendChild(inputElement);
inputElement.select();
document.execCommand("Copy");
inputElement.remove();
this.$message.success("已复制到剪贴板！赶快去分享吧~");
},
formatNum(num) {
return formatNum(num);
},
},
};
</script>
<style lang="scss" scoped>
.operations {
// margin-top: 22px;
display: flex;
justify-content: space-between;
.operation-item {
display: flex;
align-items: center;
// margin-right: 32px;
cursor: pointer;
font-size: 14px;
}
.svg-icon {
margin-right: 10px;
font-size: 24px;
color: #61666d;
}
}
.el-button--text {
color: #2069c4;
}
.copy {
display: flex;
align-items: center;
height: 180px;
}
.qrcode {
.img-container {
width: 200px;
height: 200px;
img {
width: 100%;
height: 100%;
}
}
}
::v-deep .el-input-group__append {
padding: 0 40px;
}
::v-deep .dialog-footer {
.el-button {
border-radius: 0;
}
.el-button--primary {
border: none;
background-color: #2069c4;
}
}
</style>
\ No newline at end of file
src/components/SlideImage/index.vue 0 → 100644
浏览文件 @ c5e54b34
<template>
<div class="firstDiv">
<div class="centerDiv">
<div class="thumb-example">
<!-- 大轮播图 -->
<swiper
class="swiper gallery-top"
:options="swiperOptionTop"
ref="swiperTop"
>
<swiper-slide
class="slide-item"
v-for="(item, index) in imgList"
:key="index"
>
<img :src="item.pressUrl" alt="" />
<div class="enlarge" @click="handelPreviewImages(imgList)">
<img src="@/assets/imgs/enlarge-s.png" alt="" />
</div>
</swiper-slide>
<!-- <div
class="swiper-button-next swiper-button-white"
slot="button-next"
></div>
<div
class="swiper-button-prev swiper-button-white"
slot="button-prev"
></div> -->
</swiper>
<!-- 小缩略图 -->
<swiper
class="swiper gallery-thumbs"
:options="swiperOptionThumbs"
ref="swiperThumbs"
>
<swiper-slide
class="slide-item"
v-for="(item, index) in imgList"
:key="index"
>
<img :src="item.pressUrl" alt="" />
</swiper-slide>
</swiper>
</div>
</div>
<el-image-viewer
v-if="imgViewerVisible"
:on-close="closeImgViewer"
:url-list="previewList"
/>
</div>
</template>
<script>
import { swiper, swiperSlide } from "vue-awesome-swiper";
//import 'swiper/css/swiper.css'
// import 'swiper/swiper-bundle.css'
import "swiper/css";
import "swiper/css/free-mode";
import "swiper/css/navigation";
import "swiper/css/thumbs";
export default {
name: "SlideImage",
components: {
swiper,
swiperSlide,
"el-image-viewer": () =>
import("element-ui/packages/image/src/image-viewer"),
},
props: {
imgKey: {
type: String,
default: "pressUrl",
},
imgList: {
type: Array,
default: () => [],
},
},
data() {
return {
swiperOptionTop: {
loop: false,
loopedSlides: 8, // looped slides should be the same
spaceBetween: 10,
navigation: {
nextEl: ".swiper-button-next",
prevEl: ".swiper-button-prev",
},
},
swiperOptionThumbs: {
loop: false,
loopedSlides: 8, // looped slides should be the same
spaceBetween: 10,
centeredSlides: true,
slidesPerView: "auto",
touchRatio: 0.2,
slideToClickedSlide: true,
},
imgViewerVisible: false,
};
},
mounted() {
this.$nextTick(() => {
const swiperTop = this.$refs.swiperTop.swiper;
const swiperThumbs = this.$refs.swiperThumbs.swiper;
console.log(this.$refs);
swiperTop.controller.control = swiperThumbs;
swiperThumbs.controller.control = swiperTop;
});
},
methods: {
handelPreviewImages(items) {
this.imgViewerVisible = true;
this.previewList = items.map((item) => this.$getFullUrl(item.url));
},
closeImgViewer() {
this.imgViewerVisible = false;
},
},
};
</script>
<style scoped lang="scss">
.firstDiv {
/* width: 1920px; */
/* height: 1080px; */
width: 100%;
height: 100%;
position: relative;
}
.centerDiv {
width: 100%;
height: 100%;
background-color: #f5f5f9;
/* width: 900px; */
/* height: 800px; */
/* position: absolute; */
/* left: 510px; */
/* top: 200px; */
}
.thumb-example {
height: 100%;
background-color: transparent;
}
.swiper-slide {
background-size: cover;
background-position: center;
}
.slide-item {
background: #f5f5f9;
position: relative;
img {
width: 100%;
height: 100%;
object-fit: contain;
}
}
.enlarge {
position: absolute;
bottom: 30px;
right: 30px;
display: flex;
z-index: 9;
background-color: #c1925b;
width: 40px;
height: 40px;
border-radius: 12px;
display: flex;
justify-content: center;
align-items: center;
margin-right: 10px;
cursor: pointer;
img {
width: 24px;
height: 24px;
}
}
.slide-1 {
background-color: #ccc;
/* background-image: url('../../../../static/img/dandan/g1.jpg'); */
}
.slide-2 {
background-color: #333;
/* background-image: url('../../../../static/img/dandan/g2.jpg'); */
}
.slide-3 {
background-color: #666;
/* background-image: url('../../../../static/img/dandan/g3.jpg'); */
}
.slide-4 {
background-color: #999;
/* background-image: url('../../../../static/img/dandan/g4.jpg'); */
}
.slide-5 {
background-color: #444;
/* background-image: url('../../../../static/img/dandan/g5.jpg'); */
}
.slide-6 {
background-color: #222;
/* background-image: url('../../../../static/img/dandan/g6.jpg'); */
}
.slide-7 {
background-color: #777;
/* background-image: url('../../../../static/img/dandan/g7.jpg'); */
}
.slide-8 {
background-color: #888;
/* background-image: url('../../../../static/img/dandan/g8.jpg'); */
}
.gallery-top {
height: 80%;
width: 100%;
}
.gallery-thumbs {
height: 20%;
box-sizing: border-box;
padding: 10px 0;
}
.gallery-thumbs .swiper-slide {
width: 20%;
height: 100%;
opacity: 0.4;
}
.gallery-thumbs .swiper-slide-active {
opacity: 1;
}
</style>
\ No newline at end of file
src/icons/svg/collect-s-2.svg 0 → 100644
浏览文件 @ c5e54b34
<?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="1667543993617" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4363" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48"><path d="M284.458667 941.397333c-36.437333 15.637333-68.48-7.68-64.896-47.168l22.613333-248.917333-164.394667-188.053333c-26.069333-29.824-13.653333-67.562667 24.789334-76.309334l243.370666-55.381333 127.786667-214.677333c20.288-34.090667 59.946667-34.069333 80.213333 0l127.786667 214.677333 243.370667 55.381333c38.656 8.789333 50.858667 46.485333 24.789333 76.309334l-164.394667 188.053333 22.741334 249.002667c3.605333 39.509333-28.458667 62.805333-64.896 47.146666l-229.504-98.517333-229.376 98.453333z" p-id="4364"></path></svg>
\ No newline at end of file
src/icons/svg/like-s.svg 0 → 100644
浏览文件 @ c5e54b34
<?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="1667525117325" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4149" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48"><path d="M736.048379 127.978498c-65.881404 0-128.494541 24.942046-176.314463 70.525785-4.644381 4.300353-28.726356 28.726356-47.30388 47.647909l-47.30388-47.131866c-47.819923-45.755753-110.605073-71.041828-177.00252-71.041828-141.223585 0-255.956996 114.905426-255.956996 255.956996 0 82.394759 41.111372 144.319839 76.546279 182.506971l316.849992 320.11826c25.11406 25.11406 52.980346 41.455401 86.695112 41.455401 33.714766 0 61.581052-16.341341 86.695112-41.455401l316.677977-319.946246 2.236183-2.408198c38.187133-47.647909 74.310096-92.715606 74.310096-180.098774C992.005375 242.883924 877.09995 127.978498 736.048379 127.978498z" p-id="4150"></path></svg>
\ No newline at end of file
src/icons/svg/like.svg
浏览文件 @ c5e54b34
<?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="1657871883846" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="13919" 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="1667525114151" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="3995" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48"><path d="M881.344 249.536a268.586667 268.586667 0 0 0-369.408-8.170667 268.586667 268.586667 0 0 0-369.429333 8.170667c-103.701333 102.784-104.810667 270.549333-2.474667 374.72l311.957333 310.506667a83.776 83.776 0 0 0 118.826667 1.066666l1.066667-1.066666 309.461333-307.733334c103.786667-102.72 105.024-270.506667 2.773333-374.72a227.178667 227.178667 0 0 0-2.773333-2.773333z m-40.064 337.536L531.84 895.082667c-10.88 11.029333-28.629333 11.093333-39.616 0.170666l-0.170667-0.170666L182.272 587.093333c-81.898667-81.194667-82.752-213.696-1.92-295.957333l1.92-1.92a211.904 211.904 0 0 1 291.562667-4.778667l38.101333 32.896 37.802667-32.896a211.904 211.904 0 0 1 291.541333 6.186667c81.536 81.578667 81.749333 214.101333 0.533333 295.957333l-0.533333 0.512z" p-id="3996"></path></svg>
</style></defs><path d="M669.781333 130.752c71.637333-11.093333 138.901333 11.477333 193.344 64.533333 55.317333 53.930667 81.834667 124.992 74.282667 199.530667-7.466667 73.642667-46.549333 146.368-112.32 210.474667-18.346667 17.898667-67.669333 66.218667-138.453333 135.637333-31.829333 31.232-65.706667 64.448-99.84 97.984L553.6 871.466667l-13.184 12.949333a40.554667 40.554667 0 0 1-56.832 0l-114.602667-112.64-24.213333-23.722667a677626.346667 677626.346667 0 0 0-145.856-142.762666C133.141333 541.184 94.08 468.48 86.613333 394.816c-7.552-74.538667 18.944-145.6 74.282667-199.530667 54.442667-53.056 121.706667-75.605333 193.344-64.533333 53.162667 8.213333 107.093333 34.688 157.781333 76.949333 50.709333-42.24 104.618667-68.736 157.781334-76.949333z" p-id="13920"></path></svg> \ No newline at end of file
\ No newline at end of file
src/icons/svg/share3.svg 0 → 100644
浏览文件 @ c5e54b34
<?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="1667525513368" class="icon" viewBox="0 0 1024 1024" version="1.1" xmlns="http://www.w3.org/2000/svg" p-id="4055" xmlns:xlink="http://www.w3.org/1999/xlink" width="48" height="48"><path d="M972.8 549.9136v294.7584A128.0768 128.0768 0 0 1 844.8 972.8H179.2a128 128 0 0 1-128-128V179.2c0-70.7328 57.1904-128 127.872-128h202.3168a25.6 25.6 0 0 0 0-51.2H179.072A179.072 179.072 0 0 0 0 179.2v665.6a179.2 179.2 0 0 0 179.2 179.2h665.6c98.944 0 179.2-80.2816 179.2-179.328V549.9136a25.6 25.6 0 0 0-51.2 0z" p-id="4056"></path><path d="M960 128c-353.4592 0-640 286.5408-640 640a25.6 25.6 0 0 0 51.2 0c0-325.1968 263.6032-588.8 588.8-588.8a25.6 25.6 0 0 0 0-51.2z" p-id="4057"></path><path d="M720.1024 62.1568l256 102.4a25.6 25.6 0 0 0 18.9952-47.5136l-256-102.4a25.6 25.6 0 0 0-18.9952 47.5136z" p-id="4058"></path><path d="M808.8064 348.4672l194.6368-189.312a25.6 25.6 0 1 0-35.6864-36.7104L773.12 311.7568a25.6 25.6 0 1 0 35.6864 36.7104z" p-id="4059"></path></svg>
\ No newline at end of file
src/views/boutique/components/SMGZ.vue
浏览文件 @ c5e54b34
...@@ -320,7 +320,11 @@ ...@@ -320,7 +320,11 @@
<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";
import "swiper/css";
import "swiper/css/free-mode";
import "swiper/css/navigation";
import "swiper/css/thumbs";
import MDialog from "@/components/MDialog"; import MDialog from "@/components/MDialog";
import videoPlayer from "@/components/VideoPlayer"; import videoPlayer from "@/components/VideoPlayer";
import { crPics } from "../data"; import { crPics } from "../data";
...@@ -414,7 +418,6 @@ export default { ...@@ -414,7 +418,6 @@ export default {
}, },
on: { on: {
sildeChage: function () { sildeChage: function () {
console.log(this.$refs.mySwiper.swiper);
//滑块改变时 //滑块改变时
//this.$refs.mySwiper.swiper里是有一个realIndex //this.$refs.mySwiper.swiper里是有一个realIndex
//不确定的可以console.log(this.$refs.mySwiper.swiper) //不确定的可以console.log(this.$refs.mySwiper.swiper)
...@@ -450,8 +453,6 @@ export default { ...@@ -450,8 +453,6 @@ export default {
handleChangeUnit(item) { handleChangeUnit(item) {
this.curentUnitPicIndex = item.index; this.curentUnitPicIndex = item.index;
this.$refs.mySwiper.swiper.realIndex = 0; this.$refs.mySwiper.swiper.realIndex = 0;
console.log("this.$refs.mySwiper.", this.$refs.mySwiper.swiper);
// this.$refs.mySwiper.swiper.slideTo(0)
}, },
handleChangeCr(item) { handleChangeCr(item) {
this.curentUnitCrIndex = item.index; this.curentUnitCrIndex = item.index;
......
src/views/boutique/data.js
浏览文件 @ c5e54b34
export var crPics = [ export var crPics = [
[ [
{
name: "梁氏关岭鱼龙（怀孕）",
crId: "e9ce56605b774c0385473cdb08edcee7",
index: "1",
url: "http://222.85.214.245:9604/files/culturalRelicImport/2022-09-28-4495f59768b14b0b843dbdab965ac34e/faceImage/21/low/20.梁氏关岭鱼龙（怀孕）.jpg",
},
{ {
name: "邓氏贵州鱼龙（模式标本）", name: "邓氏贵州鱼龙（模式标本）",
crId: "dac1984d5ca74f48b6183ff4525f180c", crId: "dac1984d5ca74f48b6183ff4525f180c",
index: "2", index: "2",
url: "http://222.85.214.245:9603/files/culturalRelicImport/2022-09-28-4495f59768b14b0b843dbdab965ac34e/faceImage/1/low/2.%E9%82%93%E6%B0%8F%E8%B4%B5%E5%B7%9E%E9%B1%BC%E9%BE%99%EF%BC%88%E6%A8%A1%E5%BC%8F%E6%A0%87%E6%9C%AC%EF%BC%89.jpg", url: "http://222.85.214.245:9603/files/culturalRelicImport/2022-09-28-4495f59768b14b0b843dbdab965ac34e/faceImage/1/low/2.%E9%82%93%E6%B0%8F%E8%B4%B5%E5%B7%9E%E9%B1%BC%E9%BE%99%EF%BC%88%E6%A8%A1%E5%BC%8F%E6%A0%87%E6%9C%AC%EF%BC%89.jpg",
}, },
{
name: "梁氏关岭鱼龙（怀孕）",
crId: "6737746fb5af4324b5f8c0017837c5d1",
index: "1",
url: "http://222.85.214.245:9604/files/culturalRelicImport/2022-09-28-4495f59768b14b0b843dbdab965ac34e/faceImage/21/low/20.梁氏关岭鱼龙（怀孕）.jpg",
},
{ {
name: "美丽瓦窑龙（模式标本）", name: "美丽瓦窑龙（模式标本）",
crId: "adabb46a077e48a98d57135f6c640d65", crId: "adabb46a077e48a98d57135f6c640d65",
......
src/views/display/components/BlueStyle.vue
浏览文件 @ c5e54b34
<template> <template>
<div class="content"> <div class="content">
<!-- 展览图片 --> <!-- 展览图片 -->
<div class="content-item display-detail_imgs" ref="imgs"> <!-- <div class="content-item display-detail_imgs" ref="imgs">
<img <img
class="animate__animated animate__fadeInDownBig" class="animate__animated animate__fadeInDownBig"
v-if="displayDetail.imagesVo && displayDetail.imagesVo.length > 0" v-if="displayDetail.imagesVo && displayDetail.imagesVo.length > 0"
...@@ -14,8 +14,8 @@ ...@@ -14,8 +14,8 @@
class="animate__animated animate__fadeInDownBig" class="animate__animated animate__fadeInDownBig"
:src="displayDetail.faceImagePressUrl" :src="displayDetail.faceImagePressUrl"
/> />
</div> </div> -->
<div class="wrapper wow animate__animated animate__fadeInUpBig"> <div class="wrapper wow animate__animated animate__fadeInUp">
<div class="inner"> <div class="inner">
<!-- 展览基本信息 --> <!-- 展览基本信息 -->
<div class="content-item display-detail_basic_info"> <div class="content-item display-detail_basic_info">
...@@ -25,7 +25,7 @@ ...@@ -25,7 +25,7 @@
class=" class="
info-container-left info-container-left
wow wow
animate__animated animate__fadeInLeft animate__animated animate__fadeInUp
" "
> >
<el-carousel> <el-carousel>
...@@ -57,7 +57,7 @@ ...@@ -57,7 +57,7 @@
class=" class="
info-container-right info-container-right
wow wow
animate__animated animate__fadeInRight animate__animated animate__fadeInUp
" "
> >
<div class="info-title"> <div class="info-title">
...@@ -142,7 +142,7 @@ ...@@ -142,7 +142,7 @@
</div> </div>
</div> </div>
<div <div
class="audio wow animate__animated animate__fadeInRight" class="audio wow animate__animated animate__fadeInUp"
:style="{ animationPlayState: audioPlaying ? 'running' : 'paused' }" :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"
...@@ -158,7 +158,7 @@ ...@@ -158,7 +158,7 @@
</div> </div>
<!-- 展览简介 --> <!-- 展览简介 -->
<div class="content-item display-detail_intro"> <div class="content-item display-detail_intro">
<div class="intro-content wow animate__animated animate__fadeInLeft"> <div class="intro-content wow animate__animated animate__fadeInUp">
<div class="intro-title"> <div class="intro-title">
<!-- <svg-icon icon-class="jianjie"></svg-icon> --> <!-- <svg-icon icon-class="jianjie"></svg-icon> -->
<i class="el-icon-tickets"></i> <i class="el-icon-tickets"></i>
...@@ -172,7 +172,7 @@ ...@@ -172,7 +172,7 @@
</div> </div>
<!-- 展览视频 --> <!-- 展览视频 -->
<div <div
class="content-item videos wow animate__animated animate__fadeInRight" class="content-item videos wow animate__animated animate__fadeInUp"
v-if="displayDetail.videosVo && displayDetail.videosVo.length > 0" v-if="displayDetail.videosVo && displayDetail.videosVo.length > 0"
> >
<div class="video-title"> <div class="video-title">
...@@ -255,7 +255,7 @@ ...@@ -255,7 +255,7 @@
class=" class="
unit-content-menu unit-content-menu
wow wow
animate__animated animate__fadeInLeft animate__animated animate__fadeInUp
" "
> >
<!-- 只能单开 unique-opened --> <!-- 只能单开 unique-opened -->
...@@ -281,7 +281,7 @@ ...@@ -281,7 +281,7 @@
</el-tree> </el-tree>
</div> </div>
<div <div
class="unit-content wow animate__animated animate__fadeInRight" class="unit-content wow animate__animated animate__fadeInUp"
> >
<div class="unit-content-title"> <div class="unit-content-title">
{{ curUnit.title }} {{ curUnit.title }}
...@@ -395,12 +395,11 @@ ...@@ -395,12 +395,11 @@
" "
> >
<div class="cr-title"> <div class="cr-title">
<i class="el-icon-orange"></i>
展览相关文物 展览相关文物
</div> </div>
<el-row :gutter="26"> <el-row :gutter="10">
<el-col <el-col
:span="index == 0 ? 12 : 4" :span="6"
v-for="(item, index) in displayDetail.culturalRelicVo" v-for="(item, index) in displayDetail.culturalRelicVo"
:key="index" :key="index"
> >
...@@ -412,10 +411,10 @@ ...@@ -412,10 +411,10 @@
:src="item.faceImagePressUrl || item.faceImageUrl" :src="item.faceImagePressUrl || item.faceImageUrl"
alt="" alt=""
/> />
<div class="cr-name-intro"> </div>
<div class="cr-name">{{ item.name }}</div> <div class="cr-name-intro">
<!-- <div class="cr-intro" v-html="item.intro"></div> --> <div class="cr-name">{{ item.name }}</div>
</div> <!-- <div class="cr-intro" v-html="item.intro"></div> -->
</div> </div>
</el-col> </el-col>
</el-row> </el-row>
...@@ -1277,104 +1276,32 @@ $themeColor: #2069c4; ...@@ -1277,104 +1276,32 @@ $themeColor: #2069c4;
} }
} }
.el-col { .el-col {
margin-bottom: 20px;
.img-container { .img-container {
width: 100%; width: 100%;
height: 460px; height: 460px;
position: relative; position: relative;
background-color: #f5f5f9; background-color: #f5f5f9;
.cr-name-intro { margin-bottom: 10px;
width: 100%; height: 214px;
height: 100%;
position: absolute;
left: 0;
top: 0;
padding: 100px 28px 50px;
// background-image: linear-gradient(
// to top,
// rgba(0, 0, 0, 0.8),
// rgba(0, 0, 0, 0.1)
// );
.cr-name {
font-size: 38px;
font-weight: bold;
color: #ffffff;
text-align: center;
margin-bottom: 40px;
transition: all 0.5s ease;
}
.cr-intro {
font-size: 16px;
font-weight: 400;
color: #ccc;
text-indent: 32px;
line-height: 40px;
overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 5;
-webkit-box-orient: vertical;
}
}
img { img {
width: 100%; width: 100%;
height: 100%; height: 100%;
object-fit: fill;
} }
} }
&:first-child {
.cr-name-intro { .cr-name-intro {
background-image: linear-gradient(
to top,
rgba(0, 0, 0, 0.8),
rgba(0, 0, 0, 0.1)
);
}
}
&:not(&:first-child) {
margin-bottom: 30px;
&:hover {
.cr-name {
opacity: 1;
}
.cr-name-intro {
background-image: linear-gradient(
to top,
rgba(0, 0, 0, 0.8),
rgba(0, 0, 0, 0.1)
);
}
}
.cr-name { .cr-name {
font-size: 18px; // font-size: 38px;
opacity: 0; font-weight: bold;
} color: #333;
.cr-intro { text-align: left;
display: none; margin-bottom: 40px;
} text-indent: 4px;
// .cr-name-intro {
// background-image: none;
// }
.img-container {
height: 214px;
}
}
}
.img-container {
width: 100%;
height: 100%;
cursor: pointer;
overflow: hidden;
&:hover {
box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
img {
transform: scale(1.1);
} }
} }
img {
width: 100%;
height: 214px;
object-fit: cover;
transition: all 0.5s ease;
}
} }
} }
......
src/views/display/components/RedStyle.vue
浏览文件 @ c5e54b34
...@@ -512,7 +512,11 @@ import Video from "@/components/Video"; ...@@ -512,7 +512,11 @@ import Video from "@/components/Video";
import { debounce, previewFile } from "@/utils/index"; import { debounce, previewFile } from "@/utils/index";
import ChStyleUnit from "./ChStyleUnit.vue"; import ChStyleUnit from "./ChStyleUnit.vue";
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";
import "swiper/css";
import "swiper/css/free-mode";
import "swiper/css/navigation";
import "swiper/css/thumbs";
import videoPlayer from "@/components/VideoPlayer"; import videoPlayer from "@/components/VideoPlayer";
export default { export default {
components: { components: {
......
Markdown 格式
0% 或
您添加了 0 人 到此讨论。请谨慎行事。
请先完成此评论的编辑！
请 注册 或者 后发表评论