From 5eded739533191485abb54ff8306c0b422693de5 Mon Sep 17 00:00:00 2001
From: xiangxy <shione_xxy@163.com>
Date: Fri, 17 Nov 2023 10:43:59 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BB=BB=E5=8A=A1?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/pages/modules/taskmanage/TaskLists.vue | 285 +++++++++++++--------
 1 file changed, 179 insertions(+), 106 deletions(-)

diff --git a/src/pages/modules/taskmanage/TaskLists.vue b/src/pages/modules/taskmanage/TaskLists.vue
index 841dcf6..e0fb36e 100644
--- a/src/pages/modules/taskmanage/TaskLists.vue
+++ b/src/pages/modules/taskmanage/TaskLists.vue
@@ -2,6 +2,42 @@
 <div class="main-container">
   <div class="right_side">
     <div class="content_wrap">
+      <div class="title_wrap">
+        <h2>任务管理</h2>
+      </div>
+      <div class="page_container">
+        <div class="grid_wrapper">
+          <table>
+            <tr>
+              <th>选中</th>
+              <th>序号</th>
+              <th>任务号</th>
+              <th>目标站点</th>
+              <th>任务状态</th>
+              <th>生成时间</th>
+            </tr>
+            <tr v-for="(e, i) in dataList" :key="i"  @click="toRadio(e, i)">
+              <!-- <td>
+                <div class="radio__input icon_radio_checked"><i class="icon_radio"></i></div>
+              </td> -->
+              <td><div class="selbox radio_uncheck" :class="{'radio_checked': pkId === e.task_uuid}"></div></td>
+              <td>{{i+1}}</td>
+              <td>{{e.task_code}}</td>
+              <td>{{e.next_point_code}}</td>
+              <td><span class="icon" :class="{bgred: e.task_status_name ==='生成未执行', bgyellow: (e.task_status_name ==='执行中' || e.task_status_name ==='完成')}"></span>{{e.task_status_name}}</td>
+              <td>{{e.create_time}}</td>
+            </tr>
+          </table>
+        </div>
+        <div class="buttons_wrapper">
+          <button class="button_control button_control_disabled" @click="toUp(dataList, selectIndex)"><p>任务上移</p></button>
+          <button class="button_control button_control_disabled" @click="toDown(dataList, selectIndex)"><p>任务下移</p></button>
+          <button class="button_control button_control_disabled" @click="toDel(selectIndex)"><p>任务取消</p></button>
+          <button class="button_control" @click="updateTask"><p>任务提交</p></button>
+        </div>
+      </div>
+    </div>
+    <!-- <div class="content_wrap">
       <div class="title_wrap">
         <h2>任务管理</h2>
       </div>
@@ -25,44 +61,15 @@
           </tr>
         </table>
         <div class="subbar">
+          <button class="btn btn01" @click="toUp(dataList, selectIndex)">任务上移</button>
+          <button class="btn btn02" @click="toDown(dataList, selectIndex)">任务下移</button>
           <button class="btn btn1" @click="toDel(selectIndex)">任务取消</button>
           <button class="btn btn2" @click="updateTask">任务提交</button>
         </div>
       </div>
-    </div>
+    </div> -->
   </div>
 </div>
-<!-- <div class="main-container">
-  <div class="box0">
-    <div class="title">任务管理</div>
-  </div>
-  <div class="tasklist">
-    <div class="con1 grid_wrapper">
-      <table>
-        <tr class="t-head">
-          <th><div class="selbox"></div></th>
-          <th>序号</th>
-          <th>任务号</th>
-          <th>目标站点</th>
-          <th>任务状态</th>
-          <th>生成时间</th>
-        </tr>
-        <tr v-for="(e,index) in dataList" :key="e.task_uuid"  @click="toRadio(e, index)">
-          <td><div class="selbox radio_uncheck" :class="{'radio_checked': pkId === e.task_uuid}"></div></td>
-          <td>{{index+1}}</td>
-          <td>{{e.task_num}}</td>
-          <td>{{e.target_point}}</td>
-          <td><span class="icon" :class="{bgred: e.task_status_name ==='生成未执行', bgyellow: (e.task_status_name ==='执行中' || e.task_status_name ==='完成')}"></span>{{e.task_status_name}}</td>
-          <td>{{e.create_time}}</td>
-        </tr>
-      </table>
-      <div class="subbar">
-        <button class="btn btn1" @click="toDel(selectIndex)">任务取消</button>
-        <button class="btn btn2" @click="updateTask">任务提交</button>
-      </div>
-    </div>
-  </div>
-</div> -->
 </template>
 
 <script>
@@ -71,9 +78,55 @@ export default {
   name: 'TaskLists',
   data () {
     return {
-      pkId: '',
+      selectObj: {},
       selectIndex: '',
+      pkId: '',
+      pwd: '',
+      up: false,
+      down: false,
+      del: false,
       dataList: []
+      // dataList: [
+      //   {
+      //     task_uuid: '01'
+      //   },
+      //   {
+      //     task_uuid: '02'
+      //   },
+      //   {
+      //     task_uuid: '03'
+      //   },
+      //   {
+      //     task_uuid: '04'
+      //   },
+      //   {
+      //     task_uuid: '05'
+      //   },
+      //   {
+      //     task_uuid: '06'
+      //   },
+      //   {
+      //     task_uuid: '07'
+      //   },
+      //   {
+      //     task_uuid: '08'
+      //   },
+      //   {
+      //     task_uuid: '09'
+      //   },
+      //   {
+      //     task_uuid: '10'
+      //   },
+      //   {
+      //     task_uuid: '11'
+      //   },
+      //   {
+      //     task_uuid: '12'
+      //   },
+      //   {
+      //     task_uuid: '13'
+      //   }
+      // ]
     }
   },
   created () {
@@ -88,31 +141,114 @@ export default {
         this.toast(res.desc)
       }
     },
-    toRadio (e, index) {
-      this.selectIndex = index
-      this.pkId = this.pkId === e.task_uuid ? '' : e.task_uuid
-    },
-    toDel (index) {
-      if (this.pkId) {
-        this.dataList.splice(index, 1)
-        this.pkId = ''
-      }
-    },
     async updateTask () {
       let res = await updateTask(this.dataList)
       if (res.code === '1') {
         this.toast(res.desc)
         this.pkId = ''
+        this.selectObj = {}
         this.initData()
       } else {
         this.toast(res.desc)
       }
+    },
+    toRadio (e, index) {
+      this.selectObj = this.selectObj === e ? {} : e
+      this.selectIndex = index
+      this.pkId = this.pkId === e.task_uuid ? '' : e.task_uuid
+      if (this.pkId) {
+        this.up = true
+        this.down = true
+        this.del = true
+      } else {
+        this.up = false
+        this.down = false
+        this.del = false
+      }
+      this.checkUpDown()
+    },
+    checkUpDown () {
+      // 最后一条不能下移
+      if (this.selectIndex === this.dataList.length - 1) {
+        this.down = false
+      }
+      if (this.dataList[0].task_status === '00') {
+        if (this.selectIndex === 0) {
+          this.up = false
+        }
+      } else {
+        if (this.selectIndex === 0) {
+          this.up = false
+          this.down = false
+        }
+        if (this.selectIndex === 1) {
+          this.up = false
+        }
+      }
+    },
+    swapItems (arr, index1, index2) {
+      arr[index1] = arr.splice(index2, 1, arr[index1])[0]
+      return arr
+    },
+    toUp (arr) {
+      if (!this.up) {
+        return
+      }
+      if (this.pkId) {
+        if (arr.length > 1 && this.selectIndex !== 0) {
+          this.dataList = this.swapItems(arr, this.selectIndex, this.selectIndex - 1)
+          // this.pkId = ''
+          this.selectIndex = this.selectIndex - 1
+          if (this.selectIndex === 0) {
+            this.up = false
+            this.down = true
+          } else {
+            this.up = true
+            this.down = true
+            this.checkUpDown()
+          }
+        }
+      }
+    },
+    toDown (arr) {
+      if (!this.down) {
+        return
+      }
+      if (this.pkId) {
+        if (arr.length > 1 && this.selectIndex !== (arr.length - 1)) {
+          this.dataList = this.swapItems(arr, this.selectIndex, this.selectIndex + 1)
+          // this.pkId = ''
+          this.selectIndex = this.selectIndex + 1
+          if (this.selectIndex === this.dataList.length - 1) {
+            this.up = true
+            this.down = false
+          } else {
+            this.up = true
+            this.down = true
+            this.checkUpDown()
+          }
+        }
+      }
+    },
+    toDel (index) {
+      if (this.pkId) {
+        this.dataList.splice(index, 1)
+        this.pkId = ''
+        this.up = false
+        this.down = false
+        this.del = false
+      }
     }
   }
 }
 </script>
 
 <style lang="stylus" scoped>
+.page_container
+  padding 31px 31px 31px 45px
+.grid_wrapper
+  height calc(100% - 122px)
+  overflow-y auto
 .selbox
   width 40px
   height 40px
@@ -131,67 +267,4 @@ export default {
   background center / 100% 100% url(../../../images/new/icon-error1.png) no-repeat
 .bgred
   background center / 100% 100% url(../../../images/new/icon-error2.png) no-repeat
-.t-head
-  height 80px
-  line-height 80px
-  background center / 1499px 100% url(../../../images/new/bg-head-tb-in.png) no-repeat
-.main-container
-  // padding-left 41px
-.box0
-  width 1580px
-  height 102px
-  background center / 100% 100% url(../../../images/new/bg-title-l.png) no-repeat
-  .title
-    font-size 36px
-    color #F6F9FE
-    padding-left 40px
-    padding-top 53px
-.con1
-  // width 1580px
-  // height 819px
-  height 800px
-  // background center / 100% 100% url(../../../images/new/bg-con-l.png) no-repeat
-  background center / 100% 100% url(../../../images/new/bg-task-r2.png) no-repeat
-  float left
-  box-sizing border-box
-  padding 40px
-  position relative
-.status-box
-  display inline-block
-  width .4rem
-  height .4rem
-  border-radius .2rem
-.grid_wrapper table th
-  color #ffffff
-  font-size 30px
-  background rgba(31,46,73,0.5)
-  line-height 80px
-  border-right none
-  padding 0
-  padding-left 30px
-  text-align left
-.grid_wrapper table td
-  color #ffffff
-  font-size 30px
-  background rgba(31,46,73,0.5)
-  line-height 80px
-  border-bottom 1px solid #20395D
-  border-right none
-  padding 0
-  padding-left 30px
-  text-align left
-.btn
-  width 335px
-  height 91px
-  font-size 36px
-  margin-left 167px
-  position absolute
-  bottom 28px
-  color #f6f9fe
-.btn1
-  left 306px
-  background center / 100% 100% url(../../../images/new/btn-red.png) no-repeat
-.btn2
-  left 668px
-  background center / 100% 100% url(../../../images/new/btn-blue.png) no-repeat
 </style>