forked from drone/command-center-dashboard

张含笑
2025-04-19 bdbef0fbde20317d19bfc6d3473dabb10fb3fb3b
src/components/CurrentTaskDetails/TaskDetailsRight.vue
@@ -1,6 +1,6 @@
<template>
   <div class="task-details-right-container">
      <div  class="titleImg">
      <div class="titleImg">
         <img :src="droneImg" alt="" />
      </div>
@@ -11,7 +11,7 @@
         </div>
      </div>
      <BaseControl v-if="taskDetails.workspace_id"/>
      <BaseControl v-if="taskDetails.workspace_id" />
   </div>
</template>
<script setup>
@@ -19,12 +19,6 @@
import BaseControl from '@/components/CurrentTaskDetails/ControlPanel/BaseControl.vue'
const taskDetails = inject('taskDetails')
watch(taskDetails, () => {
   list.value.forEach(item => {
      item.value = taskDetails?.value?.[item.field] || ''
   })
})
const list = ref([
   { name: '任务编号', value: '', field: 'job_info_num' },
@@ -37,6 +31,23 @@
   { name: '关联算法', value: '', field: 'ai_type_str' },
   { name: '任务描述', value: '', field: 'remark' },
])
watch(
   taskDetails,
   () => {
      list.value.forEach(item => {
         item.value = taskDetails?.value?.[item.field] || ''
         if (item.name === '任务频次') {
            const { rep_rule_type = '', rep_rule_val = '' } = taskDetails?.value || {}
            item.value = rep_rule_type + ' -- ' + rep_rule_val
         }
      })
   },
   {
      immediate: true,
      deep: true,
   }
)
</script>
<style scoped lang="scss">
@@ -48,13 +59,14 @@
   width: 297px;
   height: 1002px;
   background: rgba(31, 31, 31, 0.15);
   backdrop-filter: blur(0.5rem);
   border-radius: 0px 40px 40px 0px;
   display: flex;
   flex-direction: column;
   gap: 25px 0;
   align-items: center;
   .manualControl{
   .manualControl {
      background: transparent !important;
   }
@@ -68,7 +80,8 @@
      display: flex;
      align-items: center;
      justify-content: center;
      img{
      img {
         width: 100px;
         height: 68px;
      }
@@ -86,16 +99,19 @@
         display: flex;
         font-family: Segoe UI, Segoe UI;
         font-size: 14px;
         .itemName {
            flex-shrink: 0;
            font-weight: 400;
            color: #D3D3D3;
            color: #d3d3d3;
         }
         .itemValue {
            font-weight: bold;
            color: #ffffff;
            word-break: break-all;     /* 强制在任意字符断行 */
            white-space: normal;       /* 允许正常换行 */
         }
      }
   }