style: 修复样式问题

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

@@ -10,15 +10,36 @@
     <div style="padding:0 29px 29px;background:#fff;">
       <BiTitle index="1" name="任务基础信息"></BiTitle>
       <div style="display: block;overflow: hidden">
-        <div
-          class="panel-cell"
-          style="transform: translateY(1px);display: inline-block;width: 33%;height: 70px;line-height: 70px;color:#9aa2b2;border-bottom:1px solid #f4f4f4"
-          v-for="(item, k) in baseInfo"
-          :key="k"
-        >
-          <span class="panel-cell-label" style="">{{ item.label }}</span>
-          :
-          <span style="color: #2d2d2d">{{ item.value }}</span>
+        <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>
+          <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">
+              {{ baseInfo.industryEnterpriseName }}
+            </span>
+          </div>
+          <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>
         </div>
       </div>
     </div>
@@ -31,9 +52,8 @@
           v-for="(item, k) in ctxInfo"
           :key="k"
         >
-          <span class="panel-cell-label" style="">{{ item.label }}</span>
-          :
-          <span style="color: #2d2d2d">{{ item.value }}</span>
+          <span class="panel-cell-label" style="">{{ item.label }}:</span>
+          <span class="panel-cell-ctx">{{ item.value }}</span>
         </div>
         <!-- 拜访信息 -->
         <div>
@@ -88,7 +108,7 @@
 /* eslint-disable */
 import BiTitle from './components/title.vue';
 import BiCoverEnd from './components/cover-end';
-import createCells from './client.js';
+import createCtxInfo from './client.js';
 
 export default {
   name: 'TaskRecord',
@@ -128,22 +148,55 @@ export default {
       this.cdInfo = data.cdInfo;
       this.feedBackUrl = data.feedBackUrl;
       this.forwardUrl = data.forwardUrl;
-      this.cdInfo = data.cdInfo;
       this.visitPlanInformation = data.visitPlanInformation;
       this.visitTatgetType = data.visitTatgetType;
-      this.ctxInfo = createCells(this.visitTatgetType, data);
+      this.ctxInfo = createCtxInfo(this.visitTatgetType, data);
+      // this.ctxInfo = data
     });
+
+    let baseInfoFields = [
+      { label: '项目执行人', key: 'fullName', value: '' },
+      { label: '项目名称', key: 'projectName', value: '' },
+      { label: '电话', key: 'phone', value: '' },
+      { label: '发行单位', key: 'industryEnterpriseName', value: '' },
+      { label: '服务商', key: 'enterpriseName', value: '' },
+      { label: '任务提交时间', key: 'createDt', value: '' }
+    ];
     this.$nextTick(() => {
       this.getBaseInfo().then(({ data: { data } }) => {
-        this.baseInfo = createCells(this.visitTatgetType, data);
+        let res = {};
+        baseInfoFields.map(i => {
+          res[i.key] = data[i.key];
+        });
+        this.baseInfo = res;
       });
     });
   }
 };
 </script>
 <style scoped>
+.panel-row{
+  border-bottom: 1px solid #f4f4f4;
+}
+.panel-cell {
+  display: inline-flex;
+  min-height: 70px;
+  line-height: 30px;
+  transform: translateY(1px);
+  width: 33%;
+  color: #9aa2b2;
+}
+
 .panel-cell-label {
   color: #a9b0bd;
+  margin-right: 0.5em;
+  min-width: 6rem;
+  text-align: right;
+}
+
+.panel-cell-ctx {
+  display: inline-block;
+  color: #2d2d2d;
 }
 
 .task-log-pdf-title {