up

src/api/task/index.js

@@ -20,5 +20,13 @@ export default {
    */
   taskList(params) {
     return fetch('/blade-project-manage-v2/task-management/v2/page', params)
+  },
+  /**
+   * 任务详情
+   * @param params
+   * @returns {Promise | Promise<unknown>}
+   */
+  taskInfo(params) {
+    return fetch('/blade-project-manage-v2/task-management/v2/detail', params)
   }
 }

src/views/task/component/task-table.vue

@@ -2,8 +2,8 @@
   <div>
     <div class="full-width flex flex-center flex-justify-start">
       <el-button type="primary" icon="el-icon-plus" @click="addTask"
-        >新增任务</el-button
-      >
+        >新增任务
+      </el-button>
     </div>
     <div class="header flex flex-justify-between full-width">
       <div
@@ -44,7 +44,7 @@
               class="full-width full-height flex flex-justify-start flex-align-center"
             >
               <div class="level" />
-              <wt-tag />
+              <wt-tag :data="data" />
               {{ row[column.prop] }}
             </div>
           </div>
@@ -114,7 +114,65 @@ export default {
   },
   data() {
     return {
-      task: null
+      task: null,
+      data: [
+        {
+          title: '待确认',
+          value: 0,
+          color: '#D7D7D7',
+          checked: true
+        },
+        {
+          title: '进行中',
+          value: 1,
+          color: '#47A6EA',
+          checked: false
+        },
+        {
+          title: '已完成',
+          value: 2,
+          color: '#80B336',
+          checked: false
+        },
+        {
+          title: '已关闭',
+          value: 3,
+          color: '#ECAB56',
+          checked: false
+        },
+        {
+          title: '已取消',
+          value: 4,
+          color: '#C72A29',
+          checked: false
+        }
+      ],
+      data1: [
+        {
+          title: 'P1',
+          value: 0,
+          color: '#C72A29',
+          checked: true
+        },
+        {
+          title: 'P2',
+          value: 1,
+          color: '#E89D42',
+          checked: false
+        },
+        {
+          title: 'P3',
+          value: 2,
+          color: '#47A6EA',
+          checked: false
+        },
+        {
+          title: 'P4',
+          value: 3,
+          color: '#A0A0A0',
+          checked: false
+        }
+      ]
     }
   },
   methods: {
@@ -144,10 +202,12 @@ export default {
   height: 60px;
   border-bottom: #f7f8fa solid 1px;
 }
+
 .row:hover {
   height: 60px;
   background-color: #f7f9fc;
 }
+
 .level {
   width: 5px;
   height: 100%;

src/views/task/component/task.vue

@@ -43,7 +43,9 @@
 
         <div class="mt-10 flex lex-align-start flex-justify-start">
           <span class="mr-10 title flex flex-justify-start">标签:</span>
-          <div><wt-label @submit="handleTags" /></div>
+          <div>
+            <wt-label @submit="handleTags" />
+          </div>
         </div>
         <div class="mt-10 flex lex-align-start flex-justify-start">
           <span class="mr-10 title flex flex-justify-start">执行者:</span>
@@ -91,8 +93,8 @@
       </div>
       <div class="flex flex-justify-end full-width">
         <el-button type="primary" plain @click="showDialog = false"
-          >取 消</el-button
-        >
+          >取 消
+        </el-button>
         <el-button type="primary" @click="submit">确 定</el-button>
       </div>
     </div>
@@ -144,7 +146,15 @@ export default {
       showDialog: false,
       fileList: [],
       form: {
-        title: ''
+        title: '',
+        taskStatus: '',
+        level: '',
+        remark: '',
+        startTime: '',
+        endTime: '',
+        executeUser: '',
+        tags: '',
+        taskProcess: ''
       },
       data: [
         {

src/views/task/index.vue

@@ -51,6 +51,7 @@ export default {
         }
       ],
       task: [],
+      taskId: '',
       option: {
         showCheckBox: false,
         folderChecked: true,
@@ -82,11 +83,24 @@ export default {
   },
   methods: {
     getTaskList() {
-      this.$api.task.taskList({ level: 1 }).then(res => {
+      this.$api.task.taskList({}).then(res => {
         if (res.code === 200) {
           this.data = res.data.records
         }
       })
+    },
+    rowClick(res) {
+      this.taskId = res.id
+      this.getTaskInfo()
+    },
+    getTaskInfo() {
+      this.$api.task.taskInfo({ id: this.taskId }).then(res => {
+        if (res.code === 200) {
+          this.task = res.data
+        } else {
+          this.$message.error(res.msg)
+        }
+      })
     }
   }
 }