From 817328ee8f401e22508ac4404a20270abc17b192 Mon Sep 17 00:00:00 2001
From: wanghong1314 <498213175@qq.com>
Date: Wed, 31 Mar 2021 20:50:12 +0800
Subject: [PATCH] [Improvement-5172][UI]process list add Timing state add
 online/offline marking color (#5190)

Co-authored-by: wanghong <wanghong1@xunlei.com>
---
 .../definition/pages/list/_source/list.vue     | 18 ++++++++++++++++--
 1 file changed, 16 insertions(+), 2 deletions(-)

diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/definition/pages/list/_source/list.vue b/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/definition/pages/list/_source/list.vue
index 882bd67ddd..435942da5c 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/definition/pages/list/_source/list.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/projects/pages/definition/pages/list/_source/list.vue
@@ -55,8 +55,8 @@
         <el-table-column prop="modifyBy" :label="$t('Modify User')"></el-table-column>
         <el-table-column :label="$t('Timing state')">
           <template slot-scope="scope">
-            <span v-if="scope.row.scheduleReleaseState === 'OFFLINE'">{{$t('offline')}}</span>
-            <span v-if="scope.row.scheduleReleaseState === 'ONLINE'">{{$t('online')}}</span>
+            <span v-if="scope.row.scheduleReleaseState === 'OFFLINE'" class="time_offline">{{$t('offline')}}</span>
+            <span v-if="scope.row.scheduleReleaseState === 'ONLINE'" class="time_online">{{$t('online')}}</span>
             <span v-if="!scope.row.scheduleReleaseState">-</span>
           </template>
         </el-table-column>
@@ -522,3 +522,17 @@
     components: { mVersions, mStart, mTiming, mRelatedItems }
   }
 </script>
+
+<style lang="scss" rel="stylesheet/scss">
+
+  .time_online {
+    background-color: #5cb85c;
+    color: #fff;
+    padding: 3px;
+  }
+  .time_offline {
+    background-color: #ffc107;
+    color: #fff;
+    padding: 3px;
+  }
+</style>