任务管理研发

dbswitch-admin-ui/src/views/task/assignment.vue

@@ -1,23 +1,33 @@
 <template>
   <div>
     <el-card>
+      <el-row>
+        <el-button size="mini" icon="el-icon-switch-button" :disabled=false plain>启动</el-button>
+        <el-button size="mini" icon="el-icon-video-pause" :disabled=true plain>停止</el-button>
+        <span style="color:#e9e9f3;">&nbsp;&nbsp;|&nbsp;&nbsp;</span>
+        <el-button size="mini" plain>导入任务</el-button>
+        <el-button size="mini" :disabled=true plain>导出任务</el-button>
+<!--        <div class="right-add-button-group">-->
+          <el-button class="right-add-button-group" type="primary"
+                     size="mini"
+                     icon="el-icon-document-add"
+                     @click="handleCreate">创建任务
+          </el-button>
+<!--        </div>-->
+      </el-row>
       <div class="assignment-list-top">
         <div class="left-search-input-group">
           <div class="left-search-input">
-            <el-input placeholder="请输入任务名称关键字搜索"
+            <el-input size="mini" placeholder="请输入任务名称关键字搜索"
                       v-model="keyword"
                       :clearable=true
                       @change="searchByKeyword"
-                      style="width:300px">
+                      style="width:100%">
+              <el-button @click="searchByKeyword" slot="append" icon="el-icon-search"></el-button>
             </el-input>
           </div>
         </div>
-        <div class="right-add-button-group">
+
-          <el-button type="primary"
-                     size="mini"
-                     icon="el-icon-document-add"
-                     @click="handleCreate">添加</el-button>
-        </div>
       </div>
 
       <el-table :header-cell-style="{background:'#eef1f6',color:'#606266'}"
@@ -62,10 +72,20 @@
             </el-popover>
           </template>
         </el-table-column>
-        <el-table-column prop="runStatus"
+
+        <el-table-column
             label="运行状态"
             show-overflow-tooltip
-                         min-width="10%"></el-table-column>
+            min-width="10%">
+          <template slot-scope="scope">
+            <el-icon class="el-icon-success color-success" v-if="scope.row.runStatus == '执行成功'"></el-icon>
+            <el-icon class="el-icon-error color-error" v-if="scope.row.runStatus == '执行异常'"></el-icon>
+            <el-icon class="el-icon-remove color-cancel" v-if="scope.row.runStatus == '任务取消'"></el-icon>
+            <el-icon class="el-icon-loading color-running" v-if="scope.row.runStatus == '执行中'"></el-icon>
+            <span>{{ scope.row.runStatus }}</span>
+          </template>
+        </el-table-column>
+
         <el-table-column prop="isPublished"
                          label="任务状态"
                          :formatter="boolFormatPublish"
@@ -82,40 +102,47 @@
                          type="primary"
                          icon="el-icon-timer"
                          @click="handlePublish(scope.$index, scope.row)"
-                         round>调度日志</el-button>
+                         round>调度日志
+              </el-button>
               <el-button size="small"
                          type="primary"
                          icon="el-icon-timer"
                          v-if="scope.row.isPublished===false"
                          @click="handlePublish(scope.$index, scope.row)"
-                         round>启动</el-button>
+                         round>启动
+              </el-button>
               <el-button size="small"
                          type="info"
                          icon="el-icon-delete-location"
                          v-if="scope.row.isPublished===true"
                          @click="handleRetireTask(scope.$index, scope.row)"
-                         round>停止</el-button>
+                         round>停止
+              </el-button>
               <el-button size="small"
                          type="danger"
                          icon="el-icon-video-play"
                          @click="handleRunTask(scope.$index, scope.row)"
-                         round>手工调度</el-button>
+                         round>手工调度
+              </el-button>
               <el-button size="small"
                          type="success"
                          icon="el-icon-document"
                          @click="handleDetail(scope.$index, scope.row)"
-                         round>详情</el-button>
+                         round>详情
+              </el-button>
               <el-button size="small"
                          type="warning"
                          icon="el-icon-edit"
                          @click="handleUpdate(scope.$index, scope.row)"
-                         round>修改</el-button>
+                         round>修改
+              </el-button>
               <el-button size="small"
                          type="danger"
                          icon="el-icon-delete"
                          v-if="scope.row.isPublished===false"
                          @click="handleDelete(scope.$index, scope.row)"
-                         round>删除</el-button>
+                         round>删除
+              </el-button>
             </el-button-group>
           </template>
         </el-table-column>
@@ -350,21 +377,43 @@ export default {
 }
 
 .left-search-input-group {
-  width: calc(100% - 100px);
+  width: 100%;
   margin-right: auto;
   display: flex;
   justify-content: space-between;
 }
+
 .left-search-input {
-  width: 300px;
+  width: 100%;
   margin-right: auto;
-  margin: 10px 5px;
+  margin: 10px 0px;
 }
+
 .right-add-button-group {
   width: 100px;
   margin-left: auto;
-  margin: 10px 5px;
+  //margin: 0px 0px;
+  float: right;
 }
 
+.color-running {
+  color: #8c85d1 !important;
+}
+
+.color-error {
+  color: #ff9c86 !important;
+}
+
+.color-cancel {
+  color: #a0a6b8 !important;
+}
+
+.color-success {
+  color: #6cdbbc !important;
+}
+
+.btn-common{
+
+}
 
 </style>