feat : 打印

src/components/NameCircle.vue

@@ -6,9 +6,9 @@
         <Tooltip :content="user.name" placement="bottom-start" width="45px"/>
         <div v-if="user.icon"
              class="el-timeline-item__node" :style="{
-                      backgroundColor: user.color
+                      backgroundColor: '#fff'
                     }">
-          <el-icon v-if="user.icon" size="15" :class="user.class">
+          <el-icon v-if="user.icon" size="15" :color="user.color" :class="user.class">
             <component :is="user.icon"/>
           </el-icon>
         </div>
@@ -18,7 +18,6 @@
 </template>
 
 <script setup>
-import {Loading, Close, CircleCheckFilled, MoreFilled} from '@element-plus/icons-vue'
 
 const props = defineProps({
   row: {
@@ -36,7 +35,11 @@ const props = defineProps({
   mode: {
     type: String,
     default: 'design'
-  }
+  },
+  type: {
+    type: String,
+    default: ''
+  },
 })
 
 const init = () => {
@@ -49,27 +52,31 @@ const initUser = (user) => {
   let state = user.state
   //创建节点
   if (state === 'CREATE') {
-    user["icon"] = CircleCheckFilled
+    user["icon"] = 'CircleCheckFilled'
     user["color"] = "#0bbd87"
   }
   //审批通过
   if (state === 'AGREE' || state === 'AUTO_PASS') {
-    user["icon"] = CircleCheckFilled
+    user["icon"] = 'CircleCheckFilled'
     user["color"] = "#0bbd87"
   }
+  if (props.type === "CC") {
+    user["icon"] = "Promotion"
+    user["color"] = "#3395f8"
+  }
   //审批处理中
   if (state === 'RUNNING') {
-    user["icon"] = Loading
+    user["icon"] = 'Loading'
     user["color"] = "#f78f5f"
     user["class"] = 'is-loading'
   }
   //拒绝后评论
   if (state === 'REFUSE') {
-    user["icon"] = Close
+    user["icon"] = 'Close'
     user["color"] = "#f56c6c"
   }
   if (state === 'PASS') {
-    user["icon"] = MoreFilled
+    user["icon"] = 'MoreFilled'
     user["color"] = "#c0c4cc"
   }
   return user;
@@ -95,6 +102,7 @@ init()
     position: relative;
     background-color: #8a7243;
     color: #fff;
+
     .el-timeline-item__node {
       position: absolute;
       bottom: 0;
@@ -103,5 +111,19 @@ init()
   }
 
 
+}
+@media print {
+  /* 打印时应用的样式 */
+  .el-checkbox.is-checked .el-checkbox__inner .svg-icon {
+    background-color: #f5f7fa !important;
+    border-color: #409eff !important;
+  }
+  .el-checkbox__inner::after {
+    /* 设置选中的checkbox符号颜色 */
+    color: #409eff !important;
+  }
+  //.el-icon {
+  //  color: rgba(0, 0, 0, 1) !important;
+  //}
 }
 </style>