feat : 审批记录打印

src/views/workflow/common/OperationRender.vue

@@ -1,6 +1,6 @@
 <template>
   <div>
-    <el-button v-print="print"> 打印</el-button>
+    <el-button v-print="print" color="#ded0b2" icon="Printer"> 打印</el-button>
   </div>
   <div style="margin: 10px" id="printBox">
     <el-timeline>
@@ -10,6 +10,14 @@
                         :color="operation.color"
                         size="large"
                         placement="top">
+        <template #dot>
+<!--          :style="{backgroundColor:operation.color}"-->
+          <div style="background-color:#fff;width: 16px; height: 16px">
+            <el-icon :color="operation.color" size="16px">
+              <component :is="operation.icon"></component>
+            </el-icon>
+          </div>
+        </template>
         <el-card>
           <div>
             当前节点: {{ operation.operationName }}
@@ -50,6 +58,13 @@
         </el-card>
       </el-timeline-item>
       <el-timeline-item :color="timeline.color" :icon="timeline.icon" size="large">
+        <template #dot>
+          <div style="background-color:#fff;width: 16px; height: 16px">
+            <el-icon :color="timeline.color" size="16px">
+              <component :is="timeline.icon"></component>
+            </el-icon>
+          </div>
+        </template>
         <el-card style="font-size: 16px;font-weight: bold;">
           {{ timeline.context }}
         </el-card>
@@ -319,6 +334,9 @@ init()
 </script>
 
 <style lang="scss" scoped>
+:deep(.el-timeline-item__dot) {
+  margin-left: -3px;
+}
 :deep .el-card__body, .el-main {
   padding: 10px;
 }
@@ -399,8 +417,8 @@ init()
 }
 
 @media print {
-  :deep .el-timeline-item__node--large > .el-icon {
-    color: rgba(0, 0, 0, 1) !important;
-  }
+  //:deep .el-timeline-item__node--large > .el-icon {
+  //  color: $iconColor !important;
+  //}
 }
 </style>