Merge remote-tracking branch 'origin/master'

罗广辉

2025-04-14 ba2f8eae0dfd804ca422915981874c0d91965b42

 src/views/SignMachineNest/MachineRight/MachineStatus/MachineTableDetails/DeviceJob/DeviceJobDetails/DeviceJobDetails.vue

@@ -1,6 +1,7 @@
<!-- 任务详情 -->
<template>
   <el-dialog
      class="ztzf-dialog"
      append-to-body
      modal-class="detailsOfHistoricalTasks"
      v-model="isShow"
@@ -11,19 +12,35 @@
   >
      <div class="content">
         <div class="contentLeft">
            <el-divider content-position="left">详情</el-divider>
            <div class="machineTableDetailsTitle"><span>详情</span></div>
            <div class="infoBox">
               <div class="itemBox" v-for="item in infoList">
                  <div class="itemTitle">{{ item.name }}：</div>
                  <div class="itemValue">{{ item.value }}</div>
               <div class="itemBoxLeft">
                  <div v-for="(item, index) in infoList" :key="index">
                     <div class="itemBox">
                        <div class="itemTitle">{{ item.name }}：</div>
                        <div class="itemValue">{{ item.value ? item.value :''}}</div>
                     </div>
                  </div>
               </div>
               <div class="itemBoxRight">
                  <div class="itemTitle">关联算法：</div>
                  <div class="itemValue">{{ flystatus }}</div>
               </div>
            </div>
            <JobRelatedEvents v-if="isShow" />
            <el-divider content-position="left">任务成果 xxx个</el-divider>
            <div class="devicetitle" v-if="isShow">
               <p>
                  任务成果
                  <span>{{ total }}</span>
                  个
               </p>
               <p class="more">更多</p>
            </div>
            <div class="imgListBox">
               <el-image
                  class="imgItem"
                  v-for="(item, index) in achievementList"
                  :key="index"
                  :src="item.url"
                  :preview-src-list="achievementList.map(i => i.url)"
                  show-progress
@@ -33,7 +50,7 @@
               />
            </div>
         </div>
         <DeviceJobDetailsMap v-if="isShow" class="contentRight" :detailsData="detailsData"/>
         <DeviceJobDetailsMap v-if="isShow" class="contentRight" :detailsData="detailsData" />
      </div>
   </el-dialog>
</template>
@@ -43,22 +60,20 @@
import JobRelatedEvents from './JobRelatedEvents.vue'
import { getJobDetails, getJobInfoFiles } from '@/api/home/task'
import DeviceJobDetailsMap from './DeviceJobDetailsMap.vue'

const isShow = defineModel('show')

const infoList = ref([
   { name: '任务编号', value: '', field: 'id' },
   { name: '任务编号', value: '', field: 'job info num' },
   { name: '任务所属机巢', value: '', field: 'device_names' },
   { name: '关联算法', value: '', field: 'ai_type_str' },
   { name: '任务名称', value: '', field: 'name' },
   { name: '所属单位', value: '', field: 'dept_name' },
   { name: '任务类型', value: '', field: 'industry_type_str' },
   { name: '任务时间', value: '', field: 'begin_time' + ' - ' + 'end_time' },
   { name: '飞行事件', value: '', field: 'event_number' },
   { name: '任务周期', value: '', field: 'rep_rule_val' },
   { name: '任务频次', value: '', field: 'rep_fre_val' },
   { name: '任务频次', value: '', field: 'rep_rule_type' + ' - ' + 'rep_rule_val' },
   { name: '任务描述', value: '', field: 'remark' },
])

// 机巢状态
const flystatus = ref('')
const detailsData = ref({
   id: null,
   remark: null,
@@ -75,21 +90,34 @@
   creator_name: null,
   way_lines: [],
})

const total = ref(0)
const achievementList = ref([])

const wayLineJodInfoId = inject('wayLineJodInfoId')
const getAchievement = () => {
   getJobInfoFiles({ jobInfoId: wayLineJodInfoId.value }).then(res => {
      achievementList.value = res.data.data
      total.value = res.data.data.length
   })
}
const getDetails = () => {
   getJobDetails({ wayLineJobInfoId: wayLineJodInfoId.value }).then(res => {
   console.log('res',res);
	
      detailsData.value = res.data.data
      infoList.value.forEach(item => {
         item.value = detailsData.value?.[item.field] || ''
         if (item.name === '任务时间') {
            item.value = detailsData.value.begin_time.slice(0,10) + '-' + detailsData.value.end_time.slice(0,10)
				
         } 
      else if (item.name === '任务频次') {
            item.value === undefined ?'': detailsData.value.rep_rule_type + '-' + detailsData.value.rep_rule_val 
         }
         else {
            item.value = detailsData.value?.[item.field] || ''
         }
      })
      flystatus.value = res.data.data.ai_type_str
      // console.log('历史任务详情', res.data.data)
   })
}

@@ -124,32 +152,79 @@
   height: 100%;

   .contentLeft {
      margin-left: 35px;
      margin-right: 24px;
      width: 900px;
      overflow: auto;

      .infoBox {
         display: grid;
         grid-template-columns: repeat(3, 1fr);
         gap: 10px; // 列之间的间距
         padding: 10px;

         .itemBox {
            background-color: #fff;
            border: 1px solid #ddd;
            border-radius: 4px;
            padding: 15px;
            box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
            display: flex;
            align-items: center;
      .machineTableDetailsTitle {
         margin-bottom: 16px;
         background: url('/src/assets/images/signMachineNest/machineRight/detailtitle.png') no-repeat center;
         background-size: 100% 100%;
         span {
            display: inline-block;
            margin-left: 30px;
            font-size: 16px;
            color: #ddf0ff;
            line-height: 20px;
            text-align: left;
            margin-bottom: 8px;
         }

      }
      .devicetitle {
         margin-bottom: 16px;
         background: url('/src/assets/images/signMachineNest/machineRight/detailtitle.png') no-repeat center;
         background-size: 100% 100%;
         display: flex;
         justify-content: space-between;
         align-content: center;
         p {
            display: inline-block;
            margin-left: 30px;
            font-size: 16px;
            color: #ddf0ff;
            line-height: 20px;
            text-align: left;
            margin-bottom: 8px;
            span {
               font-size: 26px;
               color: #0282ff;
               font-weight: bold;
            }
         }
         .more {
            color: #2f9dff;
            font-size: 14px;
            padding-top: 5px;
            cursor: pointer;
         }
      }
      .infoBox {
         display: flex;
         justify-content: space-between;
         .itemBoxLeft {
            flex: 1;
            display: grid;
            grid-template-columns: repeat(2, 1fr);
            gap: 10px; // 列之间的间距
            padding: 10px;
            font-size: 14px;
            .itemBox {
               display: flex;
               align-items: center;
               margin-bottom: 24px;
            }
         }
         .itemTitle {
            font-weight: bold;
            color: #333;
            color: #fff;
         }

         .itemValue {
            color: #666;
            font-weight: bold;
            color: #fff;
         }
         .itemBoxRight {
            width: 262px;
            display: flex;
         }
      }

@@ -169,6 +244,7 @@
      width: 0;
      flex-grow: 1;
      background: #19ad8d;
      margin-right: 17px;
   }
}
</style>