Kaynağa Gözat

pdf预览功能添加5

zhangyujun 3 yıl önce
ebeveyn
işleme
4c19eaab6a
1 değiştirilmiş dosya ile 30 ekleme ve 30 silme
  1. 30 30
      src/views/pdf/preview.vue

+ 30 - 30
src/views/pdf/preview.vue

@@ -2,11 +2,15 @@
   <div class="head">
     <van-popup round v-model:show="sendEamilVisible">
       <div class="email">
-        <div @click="()=>{
-          sendEamilVisible=false
-
-        }" class="email-close">
-          <img  class="" src="@/assets/img/close_gray.png"/>
+        <div
+          @tap="
+            () => {
+              sendEamilVisible = false;
+            }
+          "
+          class="email-close"
+        >
+          <img class="" src="@/assets/img/close_gray.png" />
         </div>
         <img class="email-letter" src="@/assets/img/letter.png" />
         <div class="email-text1">
@@ -21,7 +25,7 @@
             <img src="@/assets/img/email-icon.png" />
           </div>
         </div>
-        <div @click="send" class="email-buttons">
+        <div @tap="send" class="email-buttons">
           <div class="email-buttons-sure">确认</div>
         </div>
       </div>
@@ -37,7 +41,7 @@
         下载到本地
       </a>
       <div
-        @click="
+        @tap="
           () => {
             sendEamilVisible = true;
           }
@@ -70,21 +74,16 @@ export default defineComponent({
       readerpdfDoc: null,
       sendEamilVisible: false,
       pdfUrl: '',
-      emailAddress:""
+      emailAddress: '',
     };
   },
   methods: {
-    send(){
-      let reg = /^[a-zA-Z0-9_-]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/
-      if( reg.test(this.emailAddress)){
-
-      }
-      else{
+    send() {
+      let reg = /^[a-zA-Z0-9_-]+@[a-zA-Z0-9_-]+(\.[a-zA-Z0-9_-]+)+$/;
+      if (reg.test(this.emailAddress)) {
+      } else {
         this.$notify('邮箱格式错误');
-
       }
-     
-
     },
     getPdf(url: string) {
       let that = this;
@@ -211,11 +210,11 @@ export default defineComponent({
 .email {
   position: relative;
   width: 580px;
-  .email-close{
+  .email-close {
     position: absolute;
     top: 48px;
     right: 28px;
-    >img{
+    > img {
       width: 32px;
       height: 32px;
     }
@@ -229,17 +228,17 @@ export default defineComponent({
     padding-bottom: 40px;
     font-weight: 600;
   }
-  .email-text2{
+  .email-text2 {
     font-size: 26px;
-    color: #5C6066;
+    color: #5c6066;
     margin-bottom: 30px;
   }
-  .email-buttons{
+  .email-buttons {
     padding-top: 40px;
     padding-bottom: 52px;
     display: flex;
     justify-content: center;
-    .email-buttons-sure{
+    .email-buttons-sure {
       width: 200px;
       font-size: 26px;
       height: 60px;
@@ -248,27 +247,26 @@ export default defineComponent({
       color: #fff;
       border-radius: 30px;
       overflow: hidden;
-
     }
   }
-  .email-filed{
+  .email-filed {
     width: 100%;
     display: flex;
     justify-content: center;
     position: relative;
-    .email-filed-icon{
+    .email-filed-icon {
       position: absolute;
       left: 50px;
       top: 12px;
-      >img{
+      > img {
         width: 29px;
         height: 22px;
       }
     }
-    .email-filed-text{
+    .email-filed-text {
       width: 500px;
-      background: #F2F3F5;
-      border: 2px solid #E8E8E8;
+      background: #f2f3f5;
+      border: 2px solid #e8e8e8;
       border-radius: 16px;
       overflow: hidden;
       color: #6f747c;
@@ -307,6 +305,7 @@ export default defineComponent({
       align-content: center;
       align-items: center;
       justify-content: center;
+      cursor: pointer;
     }
     .head-button-send {
       background: #498ef5;
@@ -320,6 +319,7 @@ export default defineComponent({
       align-content: center;
       align-items: center;
       justify-content: center;
+      cursor: pointer;
     }
   }
 }