Ver código fonte

显示条件

natasha 1 ano atrás
pai
commit
a3d419c22b

+ 3 - 3
src/views/wordcard/printNew.vue

@@ -76,11 +76,11 @@
           <div
             class="definition-box"
             :style="{
-              width: !(data.right.collocation && data.right.exampleSent) ? data.right.hz_info.length * 98 + 'px' : '',
-              margin: !(data.right.collocation && data.right.exampleSent) ? '16px auto 0 auto' : '',
+              width: !(data.right.collocation || data.right.exampleSent) ? data.right.hz_info.length * 98 + 'px' : '',
+              margin: !(data.right.collocation || data.right.exampleSent) ? '16px auto 0 auto' : '',
             }"
           >
-            <template v-if="!(data.right.collocation && data.right.exampleSent)">
+            <template v-if="!(data.right.collocation || data.right.exampleSent)">
               <div v-if="data.right.cixing">
                 <label class="card-label">词性:</label>
                 <p>{{ data.right.cixing }}</p>

+ 12 - 6
src/views/wordcard/writeTableNew.vue

@@ -146,11 +146,11 @@
           <div
             class="definition-box"
             :style="{
-              width: !(data.right.collocation && data.right.exampleSent) ? data.right.hz_info.length * 98 + 'px' : '',
-              margin: !(data.right.collocation && data.right.exampleSent) ? '16px auto 0 auto' : '',
+              width: !(data.right.collocation || data.right.exampleSent) ? data.right.hz_info.length * 98 + 'px' : '',
+              margin: !(data.right.collocation || data.right.exampleSent) ? '16px auto 0 auto' : '',
             }"
           >
-            <template v-if="!(data.right.collocation && data.right.exampleSent)">
+            <template v-if="!(data.right.collocation || data.right.exampleSent)">
               <div v-if="data.right.cixing">
                 <label class="card-label">词性:</label>
                 <p>{{ data.right.cixing }}</p>
@@ -361,6 +361,7 @@ export default {
   margin: 0 auto 19px auto;
   // height: 842px;
   box-sizing: border-box;
+  perspective: 1000px;
   &-preview {
     width: 600px;
   }
@@ -369,7 +370,10 @@ export default {
     display: flex;
     column-gap: 8px;
     perspective: 1000px;
-    transition: transform 0.6s ease;
+    transition: 0.6s;
+    transform-style: preserve-3d;
+
+    position: relative;
     .left,
     .right {
       width: 600px;
@@ -405,6 +409,8 @@ export default {
     .left-preview {
       padding-top: 40px;
       padding-bottom: 32px;
+      // position: absolute;
+      backface-visibility: hidden;
     }
     .header-info-preview {
       position: absolute;
@@ -567,7 +573,7 @@ export default {
       }
     }
     .right-preview-rota {
-      transform: rotateY(-180deg);
+      transform: rotateY(180deg);
     }
     .item-image {
       position: relative;
@@ -760,7 +766,7 @@ export default {
     transform: rotateY(180deg);
   }
   .flipped-back {
-    transform: rotateY(0deg);
+    transform: rotateY(180deg);
   }
 }
 </style>