style: 调整样式问题

src/packages/task-recored/src/main.vue

@@ -4,104 +4,104 @@
 -->
 <template>
   <div>
-    <div class="task-log-pdf-title" style="font-size: 29px">
+    <div class='task-log-pdf-title' style='font-size: 29px'>
       {{ executorName }} -- 任务记录
     </div>
-    <div style="padding:0 29px 29px;background:#fff;">
-      <BiTitle index="1" name="任务基础信息"></BiTitle>
-      <div style="display: block;overflow: hidden">
-        <div class="panel-row">
-          <div class="panel-cell">
-            <span class="panel-cell-label" style="">项目执行人:</span>
-            <span class="panel-cell-ctx">{{ baseInfo.fullName }}</span>
+    <div style='padding:0 29px 29px;background:#fff;'>
+      <BiTitle index='1' name='任务基础信息'></BiTitle>
+      <div style='display: block;overflow: hidden'>
+        <div class='panel-row'>
+          <div class='panel-cell'>
+            <span class='panel-cell-label' style=''>项目执行人:</span>
+            <span class='panel-cell-ctx'>{{ baseInfo.fullName }}</span>
           </div>
-          <div class="panel-cell">
-            <span class="panel-cell-label" style="">项目名称:</span>
-            <span class="panel-cell-ctx">{{ baseInfo.projectName }}</span>
+          <div class='panel-cell'>
+            <span class='panel-cell-label' style=''>项目名称:</span>
+            <span class='panel-cell-ctx'>{{ baseInfo.projectName }}</span>
           </div>
-          <div class="panel-cell">
-            <span class="panel-cell-label" style="">电话:</span>
-            <span class="panel-cell-ctx">{{ baseInfo.phone }}</span>
+          <div class='panel-cell'>
+            <span class='panel-cell-label' style=''>电话:</span>
+            <span class='panel-cell-ctx'>{{ baseInfo.phone }}</span>
           </div>
         </div>
 
-        <div class="panel-row">
-          <div class="panel-cell">
-            <span class="panel-cell-label" style="">发行单位:</span>
-            <span class="panel-cell-ctx">
+        <div class='panel-row'>
+          <div class='panel-cell'>
+            <span class='panel-cell-label' style=''>发行单位:</span>
+            <span class='panel-cell-ctx'>
               {{ baseInfo.industryEnterpriseName }}
             </span>
           </div>
-          <div class="panel-cell">
-            <span class="panel-cell-label" style="">服务商:</span>
-            <span class="panel-cell-ctx">{{ baseInfo.enterpriseName }}</span>
+          <div class='panel-cell'>
+            <span class='panel-cell-label' style=''>服务商:</span>
+            <span class='panel-cell-ctx'>{{ baseInfo.enterpriseName }}</span>
           </div>
-          <div class="panel-cell">
-            <span class="panel-cell-label" style="">任务提交时间:</span>
-            <span class="panel-cell-ctx">{{ baseInfo.createDt }}</span>
+          <div class='panel-cell'>
+            <span class='panel-cell-label' style=''>任务提交时间:</span>
+            <span class='panel-cell-ctx'>{{ baseInfo.createDt }}</span>
           </div>
         </div>
       </div>
     </div>
 
-    <div style="padding:0 29px 29px;background:#fff;margin-top: 20px">
-      <BiTitle index="2" name="任务内容信息"></BiTitle>
+    <div style='padding:0 29px 29px;background:#fff;margin-top: 20px'>
+      <BiTitle index='2' name='任务内容信息'></BiTitle>
       <div>
         <div
-          style="display: inline-block;width: 33%;height: 50px;line-height: 50px;color:#9aa2b2"
-          v-for="(item, k) in ctxInfo"
-          :key="k"
+          style='display: inline-block;width: 33%;height: 50px;line-height: 50px;color:#9aa2b2'
+          v-for='(item, k) in ctxInfo'
+          :key='k'
         >
-          <span class="panel-cell-label" style="">{{ item.label }}:</span>
-          <span class="panel-cell-ctx">{{ item.value }}</span>
+          <span class='panel-cell-label' style=''>{{ item.label }}:</span>
+          <span class='panel-cell-ctx'>{{ item.value }}</span>
         </div>
         <!-- 拜访信息 -->
         <div>
           <div
-            style="display: inline-block;width: 100%;height: 50px;line-height: 50px;color:#9aa2b2"
+            style='display: inline-block;width: 100%;height: 50px;line-height: 50px;color:#9aa2b2'
           >
-            <span class="panel-cell-label">拜访信息 ：</span>
-            <span style="color:#2d2d2d">{{ visitPlanInformation }}</span>
+            <span class='panel-cell-label'>拜访信息 ：</span>
+            <span style='color:#2d2d2d'>{{ visitPlanInformation }}</span>
           </div>
         </div>
         <!-- 传递信息 -->
         <div>
           <div
-            style="display: inline-block;width: 100%;height: 50px;line-height: 50px;color:#9aa2b2"
+            style='display: inline-block;width: 100%;height: 50px;line-height: 50px;color:#9aa2b2'
           >
-            <p class="panel-cell-label" style="">传递信息 ：</p>
+            <p class='panel-cell-label' style=''>传递信息 ：</p>
             <div
-              style="color: #2d2d2d;text-indent: 2em;list-style: circle"
-              v-for="(item, k) in cdInfo"
-              :key="k"
+              style='color: #2d2d2d;text-indent: 2em;list-style: circle'
+              v-for='(item, k) in cdInfo'
+              :key='k'
             >
               {{ item.informationName }}
             </div>
           </div>
         </div>
         <!-- 图片-->
-        <div style=" display: flex;background:#fffoverflow: hidden">
+        <div style=' display: flex;background:#fffoverflow: hidden'>
           <div
-            style="display: inline-block;width: 33%;line-height: 50px;color:#9aa2b2"
+            style='display: inline-block;width: 33%;line-height: 50px;color:#9aa2b2'
           >
-            <p class="panel-cell-label" style="">信息反馈记录:</p>
-            <div style="color: #2d2d2d;padding:20px 20px 0 0">
-              <img style="width: 100%;" :src="feedBackUrl" alt="" />
+            <p class='panel-cell-label' style=''>信息反馈记录:</p>
+            <div style='color: #2d2d2d;padding:20px 20px 0 0'>
+              <img style='width: 100%;' :src='feedBackUrl' alt='' />
             </div>
           </div>
           <div
-            style="display: inline-block;width: 33%;line-height: 50px;color:#9aa2b2"
+            style='display: inline-block;width: 33%;line-height: 50px;color:#9aa2b2'
           >
-            <p class="panel-cell-label" style="">信息转发记录:</p>
-            <div style="color: #2d2d2d;padding:20px 20px 0 0">
-              <img style="width: 100%;" :src="forwardUrl" alt="" />
+            <p class='panel-cell-label' style=''>信息转发记录:</p>
+            <div style='color: #2d2d2d;padding:20px 20px 0 0'>
+              <img style='width: 100%;' :src='forwardUrl' alt='' />
             </div>
           </div>
         </div>
       </div>
     </div>
 
-    <bi-cover-end title="信息披露"></bi-cover-end>
+    <bi-cover-end title='信息披露'></bi-cover-end>
   </div>
 </template>
 <script>
@@ -119,11 +119,13 @@ export default {
   props: {
     getBaseInfo: {
       type: Function,
-      default: () => {}
+      default: () => {
+      }
     },
     getCtxInfo: {
       type: Function,
-      default: () => {}
+      default: () => {
+      }
     }
   },
   data() {
@@ -175,9 +177,14 @@ export default {
 };
 </script>
 <style scoped>
-.panel-row{
+.panel-row {
+  margin-top: 30px;
+}
+
+.panel-row:not(:last-child) {
   border-bottom: 1px solid #f4f4f4;
 }
+
 .panel-cell {
   display: inline-flex;
   min-height: 70px;