| | |
| | | </div> |
| | | </div> |
| | | </div> |
| | | |
| | | <el-dialog :visible.sync="dialogVisible" width="60vw" top="2vh" append-to-body lock-scroll :show-close="false" |
| | | class="custom-dialog"> |
| | | <div slot="title" class="header_title"> |
| | | <span>{{ pdfTitle }}</span> |
| | | <span @click="closeDialog"> x </span> |
| | | </div> |
| | | <div class="pdfModal" v-if="dialogVisible"> |
| | | <preView :isClear="dialogVisible" :md5="p_md5"></preView> |
| | | </div> |
| | | </el-dialog> |
| | | |
| | | |
| | | |
| | | |
| | | |
| | | </div> |
| | | </template> |
| | | |
| | | <script> |
| | | |
| | | |
| | | import preView from "@/components/pdfview/index.vue" |
| | | import { getResourcePath } from '@/assets/methods/resources' |
| | | export default { |
| | | name: 'chapter008-page', |
| | |
| | | default: false, |
| | | }, |
| | | }, |
| | | components: {}, |
| | | components: { |
| | | preView, |
| | | }, |
| | | data() { |
| | | return { |
| | | pdfTitle: "", |
| | | p_md5: "", |
| | | dialogVisible: false, |
| | | isShowXyx01: false, |
| | | isShowXyx02: false, |
| | | isShowXyx03: false, |
| | |
| | | computed: {}, |
| | | watch: {}, |
| | | created() { |
| | | |
| | | const localData = JSON.parse(localStorage.getItem('chapter008')) |
| | | |
| | | if (localData) { |
| | | this.chapter008 = { ...Object.assign(this.chapter008, localData) } |
| | | } |
| | |
| | | }, |
| | | mounted() { }, |
| | | methods: { |
| | | |
| | | async getVideo(md5, val) { |
| | | const data = await getResourcePath(md5) |
| | | // console.log(data); |
| | | |
| | | this.chapter008.videoUrl[val] = data |
| | | }, |
| | | closeDialog() { |
| | | this.dialogVisible = false; |
| | | }, |
| | | |
| | | toUrl(val) { |
| | | if (val) { |
| | | const obj = { |
| | | type: 'pdf', |
| | | data: { |
| | | md5: this.chapter008.pdfMd5[val].md5, |
| | | title: this.chapter008.pdfMd5[val].name, |
| | | }, |
| | | } |
| | | this.$emit('openPDFChange', obj) |
| | | this.dialogVisible = true; |
| | | this.p_md5 = this.chapter008.pdfMd5[val].md5; |
| | | this.pdfTitle = this.chapter008.pdfMd5[val].name; |
| | | } |
| | | }, |
| | | |
| | |
| | | } |
| | | </script> |
| | | |
| | | <style lang="less" scoped></style> |
| | | |
| | | <style lang="less"> |
| | | .pdfModal { |
| | | width: 100%; |
| | | height: 90vh; |
| | | } |
| | | |
| | | .custom-dialog { |
| | | overflow: hidden !important; |
| | | |
| | | /deep/ .el-dialog__body { |
| | | padding: 0; |
| | | } |
| | | |
| | | /deep/ .el-dialog__header { |
| | | background-color: rgba(0, 0, 0, 0.8); |
| | | |
| | | .header_title { |
| | | display: flex; |
| | | justify-content: space-between; |
| | | align-items: center; |
| | | color: #fff; |
| | | font-weight: 900; |
| | | font-size: 16px; |
| | | font-family: "FZLTXIHJW"; |
| | | |
| | | span:nth-child(2):hover { |
| | | cursor: pointer; |
| | | } |
| | | } |
| | | |
| | | /deep/.el-dialog__title, |
| | | /deep/ .el-dialog__headerbtn .el-dialog__close { |
| | | color: #fff; |
| | | font-weight: 900; |
| | | font-size: 16px; |
| | | font-family: "FZLTXIHJW"; |
| | | } |
| | | } |
| | | } |
| | | |
| | | @media screen and (max-width: 1024px) { |
| | | .pdfModal { |
| | | width: 100%; |
| | | height: 80vh; |
| | | } |
| | | |
| | | .custom-dialog { |
| | | /deep/ .el-dialog { |
| | | width: 90vw !important; |
| | | } |
| | | } |
| | | } |
| | | |
| | | @media screen and (max-width: 800px) { |
| | | .pdfModal { |
| | | width: 100%; |
| | | height: 60vh; |
| | | } |
| | | |
| | | .custom-dialog { |
| | | /deep/ .el-dialog { |
| | | width: 90vw !important; |
| | | } |
| | | } |
| | | } |
| | | </style> |