55

src/views/produce/components/feeding/components/workOrderBom.vue

@@ -75,6 +75,125 @@
 <style scoped lang="scss">
   .material {
     margin-top: 6px;
+    .content_table {
+    width: 100%;
+    border: 1px solid #e3e5e5;
+    position: relative;
 
+    .item {
+      display: flex;
+      border-bottom: 1px solid #e3e5e5;
+
+      .lable {
+        width: 72px;
+        text-align: center;
+        background-color: #f7f9fa;
+        font-size: 12px;
+        border-right: 1px solid #e3e5e5;
+        flex-shrink: 0;
+      }
+
+      .lable80 {
+        width: 80px !important;
+        font-size: 12px;
+      }
+
+      .lable90 {
+        width: 90px !important;
+      }
+
+      .lable100 {
+        width: 100px !important;
+      }
+
+
+      .ww60 {
+        width: 60px;
+      }
+
+      .content {
+        width: 250px;
+        min-height: 32px;
+        font-size: 14px;
+        line-height: 14px;
+        font-style: normal;
+        font-weight: 400;
+        padding: 9px 4px;
+        box-sizing: border-box;
+        word-wrap: break-word;
+        flex-grow: 1 !important;
+
+        .unit {
+          padding: 0 2px;
+          font-size: 12px;
+          color: #404446;
+        }
+      }
+
+      .content_num {
+        display: flex;
+        align-items: center;
+        padding: 2px;
+        --input-background-color: #f0f8f2;
+      }
+
+      .pd2 {
+        padding: 2px 4px;
+      }
+
+      &:last-child {
+        border-bottom: none;
+      }
+    }
+
+    .ww55 {
+      width: 55%;
+    }
+
+    .ww50 {
+      width: 50%;
+    }
+
+    .ww45 {
+      width: 45%;
+    }
+
+    .ww40 {
+      width: 40%;
+    }
+
+    .ww30 {
+      width: 30%;
+    }
+
+    .ww33 {
+      width: 33.33%;
+    }
+
+    .ww20 {
+      width: 20%;
+    }
+
+    .del_box {
+      position: absolute;
+      right: 2px;
+      top: 2px;
+    }
+
+    .sort_index {
+      position: absolute;
+      left: 2px;
+      top: 2px;
+      width: 14px;
+      height: 14px;
+      line-height: 14px;
+      text-align: center;
+      color: #fff;
+      font-size: 12px;
+      border-radius: 50%;
+      background: rgb(21, 122, 44);
+    }
+  }
+    
   }
 </style>

src/views/produce/components/jobBooking/components/jobBom.vue

@@ -288,4 +288,125 @@ export default {
   color: #fff;
   cursor: pointer;
 }
+
+
+.content_table {
+    width: 100%;
+    border: 1px solid #e3e5e5;
+    position: relative;
+
+    .item {
+      display: flex;
+      border-bottom: 1px solid #e3e5e5;
+
+      .lable {
+        width: 72px;
+        text-align: center;
+        background-color: #f7f9fa;
+        font-size: 12px;
+        border-right: 1px solid #e3e5e5;
+        flex-shrink: 0;
+      }
+
+      .lable80 {
+        width: 80px !important;
+        font-size: 12px;
+      }
+
+      .lable90 {
+        width: 90px !important;
+      }
+
+      .lable100 {
+        width: 100px !important;
+      }
+
+
+      .ww60 {
+        width: 60px;
+      }
+
+      .content {
+        width: 250px;
+        min-height: 32px;
+        font-size: 14px;
+        line-height: 14px;
+        font-style: normal;
+        font-weight: 400;
+        padding: 9px 4px;
+        box-sizing: border-box;
+        word-wrap: break-word;
+        flex-grow: 1 !important;
+
+        .unit {
+          padding: 0 2px;
+          font-size: 12px;
+          color: #404446;
+        }
+      }
+
+      .content_num {
+        display: flex;
+        align-items: center;
+        padding: 2px;
+        --input-background-color: #f0f8f2;
+      }
+
+      .pd2 {
+        padding: 2px 4px;
+      }
+
+      &:last-child {
+        border-bottom: none;
+      }
+    }
+
+    .ww55 {
+      width: 55%;
+    }
+
+    .ww50 {
+      width: 50%;
+    }
+
+    .ww45 {
+      width: 45%;
+    }
+
+    .ww40 {
+      width: 40%;
+    }
+
+    .ww30 {
+      width: 30%;
+    }
+
+    .ww33 {
+      width: 33.33%;
+    }
+
+    .ww20 {
+      width: 20%;
+    }
+
+    .del_box {
+      position: absolute;
+      right: 2px;
+      top: 2px;
+    }
+
+    .sort_index {
+      position: absolute;
+      left: 2px;
+      top: 2px;
+      width: 14px;
+      height: 14px;
+      line-height: 14px;
+      text-align: center;
+      color: #fff;
+      font-size: 12px;
+      border-radius: 50%;
+      background: rgb(21, 122, 44);
+    }
+  }
 </style>

src/views/produceOrder/components/details/index.vue

@@ -57,6 +57,10 @@
               :curTaskObj="curTaskObj"
             ></jobDetails>
           </el-tab-pane>
+
+          <el-tab-pane label="退料详情">
+          </el-tab-pane>
+
         </el-tabs>
       </div>
     </el-drawer>