From bcee5cd49c38973e2c6c316e1405f27ab1b74db7 Mon Sep 17 00:00:00 2001
From: yiming <m13691596795@163.com>
Date: 星期五, 16 八月 2024 15:42:55 +0800
Subject: [PATCH] 体育与健康pdf
---
src/views/readerPages/home.vue | 182 +++++++++++++++++++++++++++++----------------
1 files changed, 116 insertions(+), 66 deletions(-)
diff --git a/src/views/readerPages/home.vue b/src/views/readerPages/home.vue
index 419eadb..f42ac05 100644
--- a/src/views/readerPages/home.vue
+++ b/src/views/readerPages/home.vue
@@ -4,14 +4,8 @@
<mobileHome v-if="homeBoxHide" />
</div>
<div class="pdfDialog">
- <el-dialog
- v-model="dialogState.dialogVisible"
- width="60vw"
- top="2vh"
- lock-scroll
- :show-close="false"
- class="custom-dialog"
- >
+ <el-dialog v-model="dialogState.dialogVisible" width="60vw" top="2vh" lock-scroll :show-close="false"
+ class="custom-dialog">
<template #header>
<div class="header_title">
<span>{{ dialogState.pdfTitle }}</span>
@@ -67,77 +61,133 @@
height: 100%;
}
-.pdfDialog {
- .el-overlay {
- z-index: 2004 !important;
+
+.el-dialog {
+ padding: 0;
+}
+
+
+.el-dialog__header {
+ background-color: rgba(0, 0, 0, 0.8);
+ padding: 0;
+ padding: 10px 0;
+
+ .header_title {
+ display: flex;
+ justify-content: space-between;
+ align-items: center;
+ color: #fff;
+ font-weight: 900;
+ font-size: 16px;
+ font-family: 'FZLTXIHJW';
+ padding: 5px 20px;
+ box-sizing: border-box;
+
+ span:nth-child(2):hover {
+ cursor: pointer;
+ }
+ }
+
+ .el-dialog__title,
+ .el-dialog__headerbtn .el-dialog__close {
+ color: #fff;
+ font-weight: 900;
+ font-size: 16px;
+ font-family: 'FZLTXIHJW';
}
}
+
+
+
+
+
+
+
+
.pdfModal {
width: 100%;
height: 90vh;
-}
-.custom-dialog {
- overflow: hidden !important;
- padding: 0;
+ .pdfBox-component {
+ width: 100%;
+ height: 100%;
+ position: relative;
- .el-dialog__body {
- padding: 0;
- }
+ .preview {
+ width: 100%;
+ height: 100%;
- .el-dialog__header {
- background-color: rgba(0, 0, 0, 0.8);
- padding: 0;
- padding: 10px 0;
+ .imageBox {
+ height: calc(100% - 30px);
+ overflow-x: hidden;
+ overflow-y: auto;
+ background: #ccc;
+ box-sizing: border-box;
- .header_title {
- display: flex;
- justify-content: space-between;
- align-items: center;
- color: #fff;
- font-weight: 900;
- font-size: 16px;
- font-family: 'FZLTXIHJW';
- padding: 5px 20px;
- box-sizing: border-box;
+ img {
+ margin: 0 auto;
+ display: flex;
+ justify-content: center;
+ }
- span:nth-child(2):hover {
- cursor: pointer;
+ }
+
+ .imageBox:hover {
+ cursor: zoom-in !important;
+ }
+
+ ::v-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;
+ }
+ }
+
+ ::v-deep .el-dialog__title,
+ ::v-deep .el-dialog__headerbtn .el-dialog__close {
+ color: #fff;
+ font-weight: 900;
+ font-size: 16px;
+ font-family: 'FZLTXIHJW';
+ }
+ }
+
+ .bottom_tool {
+ height: 30px;
+ background-color: rgba(0, 0, 0, 0.8);
+ display: flex;
+ justify-content: flex-end;
+ align-items: center;
+
+ svg {
+ margin-right: 15px;
+ fill: #d1d1d1;
+ }
+
+ svg:hover {
+ fill: #fff;
+ cursor: pointer;
+ }
}
}
- .el-dialog__title,
- .el-dialog__headerbtn .el-dialog__close {
- color: #fff;
- font-weight: 900;
- font-size: 16px;
- font-family: 'FZLTXIHJW';
- }
- }
-}
-
-@media screen and (max-width: 1070px) {
- .pdfModal {
- width: 100%;
- height: 80vh;
- }
-
- .custom-dialog {
- .el-dialog {
- width: 90vw !important;
- }
- }
-}
-
-@media screen and (max-width: 800px) {
- .pdfModal {
- width: 100%;
- height: 60vh;
- }
-
- .custom-dialog {
- .el-dialog {
- width: 90vw !important;
+ .notBox {
+ position: absolute;
+ top: 0;
+ left: 0;
+ width: 100%;
+ height: calc(100% - 30px);
+ min-height: 300px;
}
}
}
--
Gitblit v1.9.1