| | |
| | | <JobRelatedEvents v-if="isShow" /> |
| | | <el-divider content-position="left">任务成果 xxx个</el-divider> |
| | | <div class="imgListBox"> |
| | | <div v-for="item in imgList" class="imgItem">xxx图片</div> |
| | | <el-image |
| | | class="imgItem" |
| | | v-for="(item, index) in achievementList" |
| | | :src="item.url" |
| | | :preview-src-list="achievementList.map(i => i.url)" |
| | | show-progress |
| | | preview-teleported |
| | | :initial-index="index" |
| | | fit="cover" |
| | | /> |
| | | </div> |
| | | </div> |
| | | <div class="contentRight">map</div> |
| | | <DeviceJobDetailsMap class="contentRight" :detailsData="detailsData"/> |
| | | </div> |
| | | </el-dialog> |
| | | </template> |
| | |
| | | <script setup> |
| | | import { pxToRem } from '@/utils/rem' |
| | | import JobRelatedEvents from './JobRelatedEvents.vue' |
| | | import { getJobDetails, getJobInfoFiles } from '@/api/home/task' |
| | | import DeviceJobDetailsMap from './DeviceJobDetailsMap.vue' |
| | | |
| | | const isShow = defineModel('show') |
| | | |
| | | |
| | | const imgList = ref([ |
| | | { name: '图片1', url: 'xxx' }, |
| | | { name: '图片1', url: 'xxx' }, |
| | | { name: '图片1', url: 'xxx' }, |
| | | { name: '图片1', url: 'xxx' }, |
| | | ]) |
| | | |
| | | const infoList = ref([ |
| | | { name: '任务编号', value: 'xxx' }, |
| | | { name: '任务所属机巢', value: 'xxx' }, |
| | | { name: '关联算法', value: 'xxx' }, |
| | | { name: '任务名称', value: 'xxx' }, |
| | | { name: '所属单位', value: 'xxx' }, |
| | | { name: '任务类型', value: 'xxx' }, |
| | | { name: '任务周期', value: 'xxx' }, |
| | | { name: '飞行事件', value: 'xxx' }, |
| | | { name: '任务频次', value: 'xxx' }, |
| | | { name: '任务描述', value: 'xxx' }, |
| | | { name: '任务编号', value: '', field: 'id' }, |
| | | { 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: 'event_number' }, |
| | | { name: '任务周期', value: '', field: 'rep_rule_val' }, |
| | | { name: '任务频次', value: '', field: 'rep_fre_val' }, |
| | | { name: '任务描述', value: '', field: 'remark' }, |
| | | ]) |
| | | |
| | | onMounted(() => {}) |
| | | const detailsData = ref({ |
| | | id: null, |
| | | remark: null, |
| | | is_monitoring: null, |
| | | industry_type_str: null, |
| | | area_code: null, |
| | | ai_type_str: null, |
| | | begin_time: null, |
| | | end_time: null, |
| | | device_names: null, |
| | | create_time: null, |
| | | name: null, |
| | | event_number: null, |
| | | creator_name: null, |
| | | way_lines: [], |
| | | }) |
| | | |
| | | const achievementList = ref([]) |
| | | |
| | | const wayLineJodInfoId = inject('wayLineJodInfoId') |
| | | const getAchievement = () => { |
| | | getJobInfoFiles({ jobInfoId: wayLineJodInfoId.value }).then(res => { |
| | | achievementList.value = res.data.data |
| | | }) |
| | | } |
| | | const getDetails = () => { |
| | | getJobDetails({ wayLineJobInfoId: wayLineJodInfoId.value }).then(res => { |
| | | console.log(res.data.data, 666) |
| | | detailsData.value = res.data.data |
| | | infoList.value.forEach(item => { |
| | | item.value = detailsData.value?.[item.field] || '' |
| | | }) |
| | | }) |
| | | } |
| | | |
| | | watch(isShow, (newValue, oldValue) => { |
| | | if (newValue) { |
| | | getDetails() |
| | | getAchievement() |
| | | } |
| | | }) |
| | | </script> |
| | | |
| | | <style lang="scss"> |
| | |
| | | |
| | | .imgListBox { |
| | | display: flex; |
| | | flex-wrap: wrap; |
| | | gap: 0 10px; |
| | | |
| | | .imgItem { |
| | | width: 200px; |