2022-05-31 派工单颜色显示

src/views/modules/schedule/order_schedule.vue

@@ -1,7 +1,7 @@
 <template>
   <div class="customer-css" >
     <!--  菜单按钮区域  -->
-    <fieldset class="customer-field" style="width: 612px; padding: 0.35em 0.35em 0.35em;" >
+    <fieldset class="customer-field" style="margin-top: -3px; width: 612px; padding: 0.35em 0.35em 0.35em;" >
       <legend>菜单</legend>
       <el-form :inline="true" label-position="top" label-width="100px" style="margin-top: -5px;" >
       <el-form-item :label="''" style="margin-left: 30px;">
@@ -16,7 +16,7 @@
       </el-form>
     </fieldset>
     <!--  排序规则  -->
-    <fieldset class="customer-field" style="margin-left: 640px; margin-top: -45px; width: 135px;" >
+    <fieldset class="customer-field" style="margin-left: 640px; margin-top: -41px; width: 135px;" >
       <legend>排序</legend><br>
       <el-form :inline="true" style="margin-top: -10px; margin-bottom: 10px;" label-position="top" label-width="100px" >
         <el-form-item :label="''" style="margin-bottom: 10px;">
@@ -29,7 +29,7 @@
       </el-form>
     </fieldset>
     <!--  查询时间和产品  -->
-    <el-form :inline="true" label-position="top" label-width="100px" style="margin-top: -25px;" >
+    <el-form :inline="true" label-position="top" label-width="100px" style="margin-top: -32px;" >
       <el-form-item :label="'录入日期:'">
         <el-date-picker class="el-time-width"
                         style=""
@@ -68,7 +68,7 @@
     <fieldset class="customer-field" style="margin-top: 0px; width: 612px; padding: 0.125em;" >
       <legend>排产信息</legend>
       <!--  排产日期  -->
-      <el-form :inline="true" label-position="top" label-width="100px"  style="margin-top: 5px;">
+      <el-form :inline="true" label-position="top" label-width="100px"  style="margin-top: -5px;">
         <el-form-item :label="'排产日期:'">
           <el-date-picker class="el-time-width"
                           style=""
@@ -90,7 +90,7 @@
           <el-checkbox style="margin-top: 28px;" label="仅查看前道工序已排产的工序" name="type"></el-checkbox>
         </el-form-item>
       </el-form>
-      <el-form :inline="true" label-position="top" label-width="100px" style="margin-top: 10px;">
+      <el-form :inline="true" label-position="top" label-width="100px" style="margin-top: 5px;">
         <el-form-item :label="'工厂编号:'">
           <el-input v-model="pageData.site" style="width: 85px"></el-input>
         </el-form-item>
@@ -134,9 +134,9 @@
 
     </fieldset >
     <!--  机台班次信息  -->
-    <el-main style="margin-left: 770px; margin-top: -235px; width: 452px;">
+    <el-main style="margin-left: 770px; margin-top: -215px; width: 452px;">
       <el-table
-        height="215"
+        height="192"
         :data="resourceShiftList"
         border
         v-loading="dataListLoading"
@@ -195,7 +195,7 @@
         </el-dropdown>
       </el-form>
       <el-table
-        :height="height"
+        :height="height - 50"
         :data="shopOrderList"
         border
         ref="routingTable"
@@ -252,12 +252,13 @@
         </el-dropdown>
       </el-form>
       <el-table
-        :height="height"
+        :height="height + 50"
         :data="orderScheduleList"
         border
         highlight-current-row
         ref="scheduleTable"
         :row-class-name="scheduleRowClassName"
+        :row-style="controlRowStyle"
         @row-click="setCurrentSchedulingRow"
         @current-change="currentSchedulingRow"
         @row-dblclick="warnCancelScheduleConfirm"
@@ -1862,7 +1863,7 @@ export default {
 
   mounted() {
     this.$nextTick(() => {
-      this.height = (window.innerHeight - 360) / 2;
+      this.height = (window.innerHeight - 340) / 2;
     })
   },
   methods: {
@@ -2586,6 +2587,19 @@ export default {
       this.getShopOrderList();
     },
 
+    /*控制单行的背景颜色*/
+    controlRowStyle({row, rowIndex}){
+      let colorStyle = row.colorStyle;
+      //区分不同的样式对应不同的颜色
+      if(colorStyle == 'firstColor'){
+        return "background-color: #FF00FF";
+      }else if(colorStyle == 'secondColor'){
+        return "background-color: #0000CD";
+      }else if(colorStyle == 'thirdColor'){
+        return "background-color: #FFD700";
+      }
+    },
+
 
   },
   created() {