From 7c32b550c701ecd87fef77c8573a9db96e36fe26 Mon Sep 17 00:00:00 2001
From: Sirio <caoxinyu@meswork.com>
Date: Tue, 23 Apr 2019 15:15:45 +0800
Subject: [PATCH] =?UTF-8?q?=E9=A1=B9=E7=9B=AE=E8=AE=A1=E5=88=92=E7=AE=A1?=
 =?UTF-8?q?=E7=90=86=E9=A2=84=E8=AD=A6?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 .../ProjectPlanningQuery/index.vue            | 63 ++++++++++++-------
 1 file changed, 39 insertions(+), 24 deletions(-)

diff --git a/src/views/ManufacturingCenter/ProjectPlanningQuery/index.vue b/src/views/ManufacturingCenter/ProjectPlanningQuery/index.vue
index 3d4078b4..363ad391 100644
--- a/src/views/ManufacturingCenter/ProjectPlanningQuery/index.vue
+++ b/src/views/ManufacturingCenter/ProjectPlanningQuery/index.vue
@@ -91,52 +91,52 @@
             </el-table-column>
             <el-table-column label="发图" align="center" min-width="140px">
               <template slot-scope="scope">
-                <span :class="colorJudge(scope.row.机床设计完成时间)">{{ scope.row.机床设计完成时间.split(' ')[0] }}</span>
+                <span :class="colorJudge(scope.row.机床设计完成时间, scope.row.机床设计实际完成时间)">{{ scope.row.机床设计完成时间.split(' ')[0] }}</span>
               </template>
             </el-table-column>
             <el-table-column label="发图（实际）" align="center" width="140px">
               <template slot-scope="scope">
-                <div class="bold-font">{{ scope.row.机床设计实际完成时间 }}</div>
+                <span :class="colorActual(scope.row.机床设计完成时间, scope.row.机床设计实际完成时间)">{{ scope.row.机床设计实际完成时间 }}</span>
               </template>
             </el-table-column>
             <el-table-column label="采购" align="center" min-width="140px">
               <template slot-scope="scope">
-                <span :class="colorJudge(scope.row.采购完成时间)">{{ scope.row.采购完成时间.split(' ')[0] }}</span>
+                <span :class="colorJudge(scope.row.采购完成时间, scope.row.采购实际完成时间)">{{ scope.row.采购完成时间.split(' ')[0] }}</span>
               </template>
             </el-table-column>
             <el-table-column label="采购（实际）" align="center" width="140px">
               <template slot-scope="scope">
-                <div class="bold-font">{{ scope.row.采购实际完成时间 }}</div>
+                <span :class="colorActual(scope.row.采购完成时间, scope.row.采购实际完成时间)">{{ scope.row.采购实际完成时间 }}</span>
               </template>
             </el-table-column>
             <el-table-column label="备料" align="center" min-width="140px">
               <template slot-scope="scope">
-                <span :class="colorJudge(scope.row.备料完成时间)">{{ scope.row.备料完成时间.split(' ')[0] }}</span>
+                <span :class="colorJudge(scope.row.备料完成时间, scope.row.备料实际完成时间)">{{ scope.row.备料完成时间.split(' ')[0] }}</span>
               </template>
             </el-table-column>
             <el-table-column label="备料（实际）" align="center" width="140px">
               <template slot-scope="scope">
-                <div class="bold-font">{{ scope.row.备料实际完成时间 }}</div>
+                <span :class="colorActual(scope.row.备料完成时间, scope.row.备料实际完成时间)">{{ scope.row.备料实际完成时间 }}</span>
               </template>
             </el-table-column>
             <el-table-column label="制造" align="center" min-width="140px">
               <template slot-scope="scope">
-                <span :class="colorJudge(scope.row.机床生产完成时间)">{{ scope.row.机床生产完成时间.split(' ')[0] }}</span>
+                <span :class="colorJudge(scope.row.机床生产完成时间, scope.row.机床生产实际完成时间)">{{ scope.row.机床生产完成时间.split(' ')[0] }}</span>
               </template>
             </el-table-column>
             <el-table-column label="制造（实际）" align="center" width="140px">
               <template slot-scope="scope">
-                <div class="bold-font">{{ scope.row.机床生产实际完成时间 }}</div>
+                <span :class=" colorActual(scope.row.机床生产完成时间, scope.row.机床生产实际完成时间)">{{ scope.row.机床生产实际完成时间 }}</span>
               </template>
             </el-table-column>
             <el-table-column label="装配" align="center" min-width="140px">
               <template slot-scope="scope">
-                <span :class="colorJudge(scope.row.机床装配完成时间)">{{ scope.row.机床装配完成时间.split(' ')[0] }}</span>
+                <span :class="colorJudge(scope.row.机床装配完成时间, scope.row.机床装配实际完成时间)">{{ scope.row.机床装配完成时间.split(' ')[0] }}</span>
               </template>
             </el-table-column>
             <el-table-column label="装配（实际）" align="center" width="140px">
               <template slot-scope="scope">
-                <div class="bold-font">{{ scope.row.机床装配实际完成时间 }}</div>
+                <span :class="colorActual(scope.row.机床装配完成时间, scope.row.机床装配实际完成时间)">{{ scope.row.机床装配实际完成时间 }}</span>
               </template>
             </el-table-column>
           </el-table>
@@ -163,12 +163,12 @@
         </el-table-column>
         <el-table-column label="计划完成时间" align="center" min-width="100px">
           <template slot-scope="scope">
-            <span :class="colorJudge(scope.row.计划完成时间)">{{ scope.row.计划完成时间 }}</span>
+            <span :class="colorJudge(scope.row.计划完成时间, scope.row.实际完成时间)">{{ scope.row.计划完成时间 }}</span>
           </template>
         </el-table-column>
         <el-table-column label="实际完成时间" align="center" min-width="100px">
           <template slot-scope="scope">
-            {{ scope.row.实际完成时间 }}
+            <span :class="colorActual(scope.row.计划完成时间, scope.row.实际完成时间)">{{ scope.row.实际完成时间 }}</span>
           </template>
         </el-table-column>
         <el-table-column label="工期" align="center" min-width="100px">
@@ -203,12 +203,12 @@
         </el-table-column>
         <el-table-column label="计划完成时间" align="center" min-width="100px">
           <template slot-scope="scope">
-            <span :class="colorJudge(scope.row.计划完成时间)">{{ scope.row.计划完成时间 }}</span>
+            <span :class="colorJudge(scope.row.计划完成时间, scope.row.实际完成时间)">{{ scope.row.计划完成时间 }}</span>
           </template>
         </el-table-column>
         <el-table-column label="实际完成时间" align="center" min-width="100px">
           <template slot-scope="scope">
-            {{ scope.row.实际完成时间 }}
+            <span :class="colorActual(scope.row.计划完成时间, scope.row.实际完成时间)">{{ scope.row.实际完成时间 }}</span>
           </template>
         </el-table-column>
         <el-table-column label="工期" align="center" min-width="100px">
@@ -243,12 +243,12 @@
         </el-table-column>
         <el-table-column label="计划完成时间" align="center" min-width="100px">
           <template slot-scope="scope">
-            <span :class="colorJudge(scope.row.计划完成时间)">{{ scope.row.计划完成时间 }}</span>
+            <span :class="colorJudge(scope.row.计划完成时间, scope.row.实际完成时间)">{{ scope.row.计划完成时间 }}</span>
           </template>
         </el-table-column>
         <el-table-column label="实际完成时间" align="center" min-width="100px">
           <template slot-scope="scope">
-            {{ scope.row.实际完成时间 }}
+            <span :class="colorActual(scope.row.计划完成时间, scope.row.实际完成时间)">{{ scope.row.实际完成时间 }}</span>
           </template>
         </el-table-column>
         <el-table-column label="工期" align="center" min-width="100px">
@@ -283,12 +283,12 @@
         </el-table-column>
         <el-table-column label="计划完成时间" align="center" min-width="100px">
           <template slot-scope="scope">
-            <span :class="colorJudge(scope.row.计划完成时间)">{{ scope.row.计划完成时间 }}</span>
+            <span :class="colorJudge(scope.row.计划完成时间, scope.row.实际完成时间)">{{ scope.row.计划完成时间 }}</span>
           </template>
         </el-table-column>
         <el-table-column label="实际完成时间" align="center" min-width="100px">
           <template slot-scope="scope">
-            {{ scope.row.实际完成时间 }}
+            <span :class="colorActual(scope.row.计划完成时间, scope.row.实际完成时间)">{{ scope.row.实际完成时间 }}</span>
           </template>
         </el-table-column>
         <el-table-column label="工期" align="center" min-width="100px">
@@ -323,12 +323,12 @@
         </el-table-column>
         <el-table-column label="计划完成时间" align="center" min-width="100px">
           <template slot-scope="scope">
-            <span :class="colorJudge(scope.row.计划完成时间)">{{ scope.row.计划完成时间 }}</span>
+            <span :class="colorJudge(scope.row.计划完成时间, scope.row.实际完成时间)">{{ scope.row.计划完成时间 }}</span>
           </template>
         </el-table-column>
         <el-table-column label="实际完成时间" align="center" min-width="100px">
           <template slot-scope="scope">
-            {{ scope.row.实际完成时间 }}
+            <span :class="colorActual(scope.row.计划完成时间, scope.row.实际完成时间)">{{ scope.row.实际完成时间 }}</span>
           </template>
         </el-table-column>
         <el-table-column label="工期" align="center" min-width="100px">
@@ -383,10 +383,22 @@ export default {
     this.fetchData()
   },
   methods: {
-    colorJudge(time1) {
-      console.log(new Date(time1) - this.now)
-      if ((new Date(time1) - this.now) > 0 && (new Date(time1) - this.now) < (86400000 * this.warningValue)) {
-        return 'orange'
+    colorJudge(time1, time2) {
+      if(time2 === null) {
+        if ((new Date(time1) - this.now) > 0 && (new Date(time1) - this.now) < (86400000 * this.warningValue)) {
+          return 'orange'
+        } else if ((new Date(time1) - this.now) < 0) {
+          return 'red'
+        } else {
+          return 'black'
+        }
+      } else {
+        return ''
+      }
+    },
+    colorActual(time1, time2) {
+      if ((new Date(time1) - new Date(time2)) > 0) {
+        return 'green'
       } else if ((new Date(time1) - this.now) < 0) {
         return 'red'
       } else {
@@ -594,6 +606,9 @@ export default {
   .black{
     color: white;
   }
+  .green{
+    color: #63a35c;
+  }
 </style>
 <style>
   .bold-font .el-table{