test

cuiqian2004

2025-09-12 d87c256a957a6a5c3b40eaf9c52ec68f2fc22c97

 pages/task/infos/task-item.vue

@@ -1,42 +1,54 @@
<template>
   <view class="pages-task-item">
      <view class="btn-no " :class="taskIsRun?'active':'' ">
         {{taskData.taskButton}}
      </view>
      <view class="content" @click="clickTask">
         <view class="line">
            <view class="title"> {{taskData.taskGroupName}}</view>
      <view class="item-content">
         <view class="btn-no " :class="taskIsRun?'active':'' " @click="clickButton">
            {{taskData.taskButton}}
         </view>
         <view class="line">
            {{taskListDesc}}
         <view class="content" @click="clickTask">
            <view class="line">
               <view class="title"> {{taskData.taskGroupName}}</view>
            </view>
            <view class="line">
               <view class="desc">
                  {{taskListDesc}}
               </view>
               <view class="cycle">
                  {{taskCycleTime}}
               </view>
            </view>
         </view>
      </view>
      <view class="action-button" v-if="taskIsRun">
<!--          <button type="primary" v-show="false" :plain="true" class="button" @click.stop="clickRepeatTask">
         <view class="action-button" v-if="taskIsRun">
            <!--          <button type="primary" v-show="false" :plain="true" class="button" @click.stop="clickRepeatTask">
            <text class="ico repeat" />
         </button> -->
         <button type="primary" :plain="true" class="button" @click.stop="clickSkipTask">
            <text class="ico skip-next-rounded" />
         </button>
         <button type="primary" :plain="true" class="button" @click.stop="clickStopTask">
            <text class="ico stop" />
         </button>
         <!--          <button type="primary" v-show="false" :plain="true" class="button" @click.stop="clickPauseTask">
            <button type="primary" :plain="true" class="button" @click.stop="clickSkipTask">
               <text class="ico skip-next-rounded" />
            </button>
            <button type="primary" :plain="true" class="button" @click.stop="clickStopTask">
               <text class="ico stop" />
            </button>
            <!--          <button type="primary" v-show="false" :plain="true" class="button" @click.stop="clickPauseTask">
            <text class="ico pause-rounded" />
         </button>
         <button type="primary" v-show="false" :plain="true" class="button" @click.stop="clickPlayTask">
            <text class="ico play-filled" />
         </button> -->
         </view>
         <view class="action-button" v-else>
            <button :type=" !taskCanRun ? 'default':'primary'" :plain="true" class="button" :disabled=" !taskCanRun"
               @click.stop="clickPlayTask">
               <text class="ico play-filled " :class="taskCanRun ? '':'disabled'" />
            </button>
         </view>
      </view>
      <view class="action-button" v-else>
         <button :type=" !taskCanRun ? 'default':'primary'" :plain="true" class="button" :disabled=" !taskCanRun"
            @click.stop="clickPlayTask">
            <text class="ico play-filled " :class="taskCanRun ? '':'disabled'" />
         </button>
      <view class="item-sub" v-if="showTaskRunning && taskIsRun">
         <view class="sub-item" v-for="(item,index) in taskStatusList" :key="item.taskID">
            <text class="text">{{getStatusText(item.status)}}</text>
            <text class="text">{{"目标点"+(index+ 1)}}</text>
            <text class="text">{{getDestText(item)}}</text>
            <text class="text">{{getActionText(item)}}</text>
         </view>
      </view>
      <!-- <view class="btn-del" :style="{ transform: `translateX(${deleteX || 0}px)` }" @click="clickDelete">
         删除</view> -->

   </view>

</template>
@@ -73,6 +85,13 @@
               return 0;
            }
         },
         showTaskRunning: {
            type: Boolean,
            default () {
               return false;
            }
         },

      },
      data() {
         return {}
@@ -81,7 +100,18 @@
         taskListDesc() {
            let list = this.taskData.taskList || []
            list = list.map((a) => a.dest?.name)

            return list.join("-")
         },
         taskCycleTime() {

            if (this.taskIsRun)
               return `第${this.taskStatus?.curCycleNumber || 0}/${this.taskStatus?.cycleTotleNumber || 0}次`

            else
               return `重复${this.taskData.cycleTime || 0}次`


         },
         taskIsRun() {
            if (this.taskStatus?.taskGroupID == this.taskData.taskGroupID) {
@@ -97,6 +127,16 @@
               return true
            }
         },

         taskStatusList() {
            if (this.taskIsRun) {
               let list = this.taskStatus.taskStatusList || []
               list = list.filter((a) => a.cycleNumber == this.taskStatus.curCycleNumber)
               return list
            } else {
               return []
            }
         }

      },

@@ -122,6 +162,11 @@
               });
            });
         },
         clickButton() {
            if (this.taskIsRun)
               this.$emit('click-btn', this.taskData)
         },

         clickTask() {
            this.$emit('click-item', this.taskData)
         },
@@ -151,7 +196,48 @@
            this.$emit('click-delete', this.taskData)
         },


         getStatusText(status) {
            var statusText = "未知"
            if (!status) {
               statusText = "未开始"
            } else if (status === 5) {
               statusText = "强制完成"
            } else if (status === 4) {
               statusText = "异常结束"
            } else if (status === 3) {
               statusText = "已取消"
            } else if (status === 2) {
               statusText = "已完成"
            } else if (status === 1) {
               statusText = "执行中"
            }
            return statusText
         },
         getDestText(item) {
            const index = this.taskData.taskList.findIndex((a) => a.taskID == item.taskID)
            if (index > -1) {
               return this.taskData.taskList[index]?.dest?.name || ""
            }
            return ""
         },
         getActionText(item) {
            const index = this.taskData.taskList.findIndex((a) => a.taskID == item.taskID)
            if (index > -1) {
               const task = this.taskData.taskList[index]
               var actionText = "未知"
               if (task.actionType === 1) {
                  actionText = "导航"
               } else if (task.actionType === 2) {
                  actionText = "取货"
               } else if (task.actionType === 3) {
                  actionText = `卸货 等待${taskData.taskList[index]?.wait || 0}秒`
               } else if (task.actionType === 4) {
                  actionText = "人工"
               }
               return actionText
            }
            return ""
         },

      }
   }
@@ -159,20 +245,49 @@

<style lang="scss" scoped>
   .pages-task-item {

      width: 100%;
      display: flex;
      flex-direction: row;
      position: relative;
      align-items: center;
      flex-direction: column;

      .item-content {
         width: 100%;
         display: flex;
         flex-direction: row;
         align-items: center;
      }

      .item-sub {
         display: flex;
         flex-direction: column;
         padding: 10rpx 30rpx 10rpx 50rpx;

         .sub-item {
            color: gray;
            padding: 10rpx;
            border-bottom: 1px solid #ddd;
            display: flex;
            flex-direction: row;
            .text {
               color: gray;
               padding: 10rpx;
            }
         }

         .sub-item:last-child {
            border-bottom: 0;
         }
      }

      .btn-no {
         display: flex;
         margin: 0 10rpx 0 20rpx;
         border-radius: 25rpx;
         background-color: #E6F7FF;
         color: #1890FF;
         width: 50rpx;
         height: 50rpx;
         line-height:54rpx ;
         line-height: 54rpx;
         justify-content: center;
         align-items: center;
         text-align: center;
@@ -184,7 +299,10 @@
      }

      .content {
         display: flex;
         flex-direction: column;
         flex: 1;
         min-width: 0;
         padding: 5px;

         .line {
@@ -196,15 +314,27 @@
            .title {
               font-size: 36rpx;
               font-weight: 600;
               min-width: 0;
               /* 关键：允许收缩到比内容还窄 */
               overflow: hidden;
               text-overflow: ellipsis;
               white-space: nowrap;
            }

            .text {
               padding: 0 10px;
               font-size: 14px;
               color: #1ABC9C;
            .desc {
               flex: 1;
               color: gray;
               min-width: 0;
               /* 关键：允许收缩到比内容还窄 */
               overflow: hidden;
               text-overflow: ellipsis;
               white-space: nowrap;
            }

            .cycle {
               color: gray;
               padding: 0 10rpx;
            }


         }
@@ -229,34 +359,19 @@
               color: #1890FF;

            }
            .disabled{

            .disabled {
               color: gray !important;
            }

         }
         .disabled{

         .disabled {
            color: gray;
         }


      }

      .btn-del {
         position: absolute;
         right: -80px;
         top: 0;
         padding: 0 8px;
         line-height: 100px;
         background-color: #CC001A;
         font-weight: 700;
         color: #fff;
         border: none;
         border-radius: 10px;
         border-bottom-right-radius: 0px;
         border-bottom-left-radius: 0px;
         border-top-left-radius: 0px;
         transform: translateX(100%);
         transition: transform 0.3s;
      }
   }
</style>