考场

src/pages/xdjx/kcpzgl/kcpz/detail/index.vue

@@ -127,46 +127,55 @@ const handlePrint = async (
       printable: "print-part",
       type: "html",
       style: `
-#print-part {
-      print-color-adjust: exact
-}
-.flex_center {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-.flex {
-  display: flex;
-}
-.flex-1 {
-  flex: 1; 
-}
-.space-x-4 > :not([hidden]) ~ :not([hidden]) {
-  --tw-space-x-reverse: 0;
-  margin-right: calc(1rem * var(--tw-space-x-reverse));
-  margin-left: calc(1rem * calc(1 - var(--tw-space-x-reverse)));
-}
-.h-100px {
-  height: 100px;
-}
-.h-150px {
-  height: 150px;
-}
-.ysyl {
-  border: 1px solid #aaa;
-  width: 100%;
-}
-.line {
-  border: 1px solid #ccc;
-  border-top: none;
-}
-.padding10 {
-  padding: 10px;
-}
-.tip {
-  color: #ccc;
-}
-`,
+        #print-part {
+          print-color-adjust: exact
+        }
+        #print-part div {
+          box-sizing: border-box;
+        }
+        .flex_center {
+          display: flex;
+          justify-content: center;
+          align-items: center;
+        }
+        .flex {
+          display: flex;
+        }
+        .flex-1 {
+          flex: 1; 
+        }
+        .w-full {
+          width: 100%;
+        }
+        .h-100px {
+          height: 100px;
+        }
+        .h-150px {
+          height: 150px;
+        }
+        .ml-30px {
+          margin-left: 30px;
+        }
+        .ysyl {
+          border: 1px solid #aaa;
+          width: 100%;
+          margin: auto;
+        }
+        .line {
+          border: 1px solid #ccc;
+          border-top: none;
+        }
+        .padding10 {
+          padding: 10px;
+        }
+        .tip {
+          color: #ccc;
+        }
+        .nowrap {
+          white-space: nowrap;
+          padding-right: 20px;
+        }
+      `,
     });
   }
 };
@@ -219,7 +228,7 @@ const handlePrint = async (
       </div>
     </template>
 
-    <el-dialog title="考场情况登记表" v-model="dialogVisible_audit" append-to-body destroy-on-close>
+    <el-dialog width="700px" title="考场情况登记表" v-model="dialogVisible_audit" append-to-body destroy-on-close>
       <el-form :model="dialogForm_Data" ref="dialogForm_Ref_audit" :rules="dialogForm_Rules_audit" label-width="80px">
         <el-form-item label="考试科目" prop="kskm">
           <el-select value-key="kskm" v-model="dialogForm_Data.kskm" @change="handleKskmChange" class="w-full">
@@ -237,10 +246,10 @@ const handlePrint = async (
               <div class="flex-1 padding10">{{ dialogForm_Data.dydx }}</div>
               <div class="flex-1 padding10">{{ detail_Data.xkk_name }}考场情况登记表</div>
             </div>
-            <div class="flex padding10 space-x-4">
-              <div>{{ dialogForm_Data.kskm }}</div>
-              <div>{{ dialogForm_Data.kssj }}</div>
-              <div>{{ dialogForm_Data.jkls }}</div>
+            <div class="flex padding10">
+              <div class="nowrap">{{ dialogForm_Data.kskm }}</div>
+              <div class="nowrap">{{ dialogForm_Data.kssj }}</div>
+              <div class="nowrap ml-30px">{{ dialogForm_Data.jkls }}</div>
             </div>
             <div class="line"></div>
             <div class="flex">
@@ -282,4 +291,8 @@ const handlePrint = async (
 .tip {
   color: #ccc;
 }
+.nowrap {
+  white-space: nowrap;
+  padding-right: 30px;
+}
 </style>

src/pages/xdjx/kcpzgl/kcpz/detail/kslb/index.vue

@@ -310,79 +310,85 @@ const handlePrint = () => {
     printable: "print-part",
     type: "html",
     style: `
-#print-part {
-      print-color-adjust: exact
-}
-.flex_center {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
-.flex {
-  display: flex;
-}
-
-.flex-col {
-  flex-direction: column;
-}
-
-.flex-row {
-  flex-direction: row;
-}
-
-.py-3 {
-  padding-top: 0.75rem;
-  padding-bottom: 0.75rem;
-}
-
-.py-2 {
-  padding-top: 0.5rem;
-  padding-bottom: 0.5rem;
-}
-
-.py-8 {
-  padding-top: 2rem;
-  padding-bottom: 2rem;
-}
-
-.px-3 {
-  padding-left: 0.75rem;
-  padding-right: 0.75rem;
-}
-
-.px-6 {
-  padding-left: 2rem;
-  padding-right: 2rem;
-}
-
-.text-2xl {
-  font-size: 1.5rem;
-  line-height: 2rem;
-}
-
-.pre::before {
-  background-color: rgba(96, 165, 250, 1);
-  display: inline-block;
-  height: 100%;
-  margin-right: 6px;
-  color: #60A5FA;
-  content: "|";
-  width: 4px;
-}
-
-.table-item {
-  width: 400px;margin: auto;border: 1px solid #aaa;padding: 20px;font-size: 20px;line-height: 30px;margin-bottom: 30px;
-}
-.justify-between {
-  justify-content: space-between;
-}
-.font30 {
-  font-size: 30px;
-}
-.font12 {
-  font-size: 12px;
-}
-`,
+      #print-part {
+        print-color-adjust: exact
+      }
+      #print-part div {
+        box-sizing: border-box;
+      }
+      .flex_center {
+        display: flex;
+        justify-content: center;
+        align-items: center;
+      }
+      .flex {
+        display: flex;
+      }
+
+      .flex-col {
+        flex-direction: column;
+      }
+
+      .flex-row {
+        flex-direction: row;
+      }
+
+      .py-3 {
+        padding-top: 0.75rem;
+        padding-bottom: 0.75rem;
+      }
+
+      .py-2 {
+        padding-top: 0.5rem;
+        padding-bottom: 0.5rem;
+      }
+
+      .py-8 {
+        padding-top: 2rem;
+        padding-bottom: 2rem;
+      }
+
+      .px-3 {
+        padding-left: 0.75rem;
+        padding-right: 0.75rem;
+      }
+
+      .px-6 {
+        padding-left: 2rem;
+        padding-right: 2rem;
+      }
+
+      .text-2xl {
+        font-size: 1.5rem;
+        line-height: 2rem;
+      }
+
+      .pre::before {
+        background-color: rgba(96, 165, 250, 1);
+        display: inline-block;
+        height: 100%;
+        margin-right: 6px;
+        color: #60A5FA;
+        content: "|";
+        width: 4px;
+      }
+
+      .table-item {
+        display: inline-block;
+        vertical-align: top;
+        margin: 0 20px;
+        width: calc(50% - 40px);border: 1px solid #aaa;padding: 20px;font-size: 20px;line-height: 30px;margin-bottom: 30px;
+      }
+      .justify-between {
+        justify-content: space-between;
+      }
+      .font30 {
+        font-size: 30px;
+      }
+      .font12 {
+        font-size: 12px;
+      }
+    `,
   });
 };
 </script>
@@ -518,7 +524,7 @@ const handlePrint = () => {
   </el-dialog>
 
 
-  <el-dialog v-model="zkdDialog" append-to-body destroy-on-close>
+  <el-dialog width="800px" v-model="zkdDialog" append-to-body destroy-on-close>
     <div v-if="ksxx.xkk_kslx_option_k==1" id="print-part" style="height: 500px;color: #000;overflow: auto;">
       <div v-for="(item, index) in tableData" :key="index" class="table-item">
         <div class="flex justify-between">
@@ -564,7 +570,10 @@ const handlePrint = () => {
 
 <style lang="scss" scoped>
 .table-item {
-  width: 400px;margin: auto;border: 1px solid #aaa;padding: 20px;font-size: 20px;line-height: 30px;margin-bottom: 30px;
+  display: inline-block;
+  vertical-align: top;
+  margin: 0 20px;
+  width: calc(50% - 40px);border: 1px solid #aaa;padding: 20px;font-size: 20px;line-height: 30px;margin-bottom: 30px;
 }
 .font30 {
   font-size: 30px;