<n-image class="image_size" :src="form.fileMarkerUrl" alt="" width="120" /> | <n-image class="image_size" :src="form.fileMarkerUrl" alt="" width="120" /> | ||||
</n-form-item> | </n-form-item> | ||||
</n-form> | </n-form> | ||||
<n-form | |||||
v-if="showResultForm" | |||||
:model="resultForm" | |||||
:label-width="80" | |||||
label-placement="left" | |||||
require-mark-placement="left" | |||||
> | |||||
<n-form-item label="处理状态:"> | |||||
<span>{{ resultList[resultForm.status] }}</span> | |||||
</n-form-item> | |||||
<n-form-item label="处理图片:"> | |||||
<div class="handle_image"> | |||||
<n-image | |||||
v-for="(item,index) in resultForm.images" | |||||
:key="index" | |||||
class="image_size" | |||||
:src="item" | |||||
alt="" | |||||
width="120" | |||||
/> | |||||
</div> | |||||
</n-form-item> | |||||
<n-form-item label="处理描述:"> | |||||
<span>{{ resultForm.handlerResult }}</span> | |||||
</n-form-item> | |||||
<n-form-item label="处理时间:"> | |||||
<span>{{ resultForm.handlerTime }}</span> | |||||
</n-form-item> | |||||
</n-form> | |||||
</div> | </div> | ||||
<div v-if="positionType === 'handle'" class="btn_list"> | <div v-if="positionType === 'handle'" class="btn_list"> | ||||
<n-button v-if="form.status !== 1" class="btn_item" type="primary" @click="makeSure">确定</n-button> | <n-button v-if="form.status !== 1" class="btn_item" type="primary" @click="makeSure">确定</n-button> | ||||
<script> | <script> | ||||
import { toRefs, reactive, watch, inject } from 'vue' | import { toRefs, reactive, watch, inject } from 'vue' | ||||
import { QUESTION_TYPE } from '@/utils/dictionary.js' | import { QUESTION_TYPE } from '@/utils/dictionary.js' | ||||
import { orderDetail } from '@/api/order/index.js' | |||||
export default { | export default { | ||||
name: 'OverLay', | name: 'OverLay', | ||||
props: { | props: { | ||||
type: { | type: { | ||||
type: String, | type: String, | ||||
default: '' | default: '' | ||||
}, | |||||
showResult: { | |||||
type: Boolean, | |||||
default: false | |||||
} | } | ||||
}, | }, | ||||
emits: { | emits: { | ||||
setup(props, { emit }) { | setup(props, { emit }) { | ||||
const data = reactive({ | const data = reactive({ | ||||
form: {}, | form: {}, | ||||
resultForm: {}, | |||||
resultList: { 0: '待处理', 1: '已处理' }, | |||||
showResultForm: false, | |||||
positionType: '', | positionType: '', | ||||
typeList: [] | typeList: [] | ||||
}) | }) | ||||
data.positionType = props.type | data.positionType = props.type | ||||
data.typeList = QUESTION_TYPE | data.typeList = QUESTION_TYPE | ||||
data.form = Object.assign({}, props.data) | data.form = Object.assign({}, props.data) | ||||
if (props.showResult && props.data.status === 1) { | |||||
orderDetail({ questionId: props.data.questionId }) | |||||
.then(res => { | |||||
data.showResultForm = true | |||||
data.resultForm = res.data.questionHandle | |||||
data.resultForm.images = res.data.questionHandle.handlerImage.split(',') | |||||
}) | |||||
} | |||||
}) | }) | ||||
const updateVisible = function() { | const updateVisible = function() { | ||||
emit('close') | emit('close') | ||||
} | } | ||||
margin-left: 20px; | margin-left: 20px; | ||||
} | } | ||||
.handle_image{ | |||||
display: flex; | |||||
flex-wrap: wrap; | |||||
justify-content: space-between; | |||||
.n-image{ | |||||
margin: 0 0 5px 0; | |||||
} | |||||
} | |||||
</style> | </style> |
<div class="main_container"> | <div class="main_container"> | ||||
<div id="track" ref="map" /> | <div id="track" ref="map" /> | ||||
<div id="pointOverlay" class="point_overlay"> | <div id="pointOverlay" class="point_overlay"> | ||||
<over-lay :data="problemData" :type="positionType" @close="closeOverlay" /> | |||||
<over-lay :data="problemData" :show-result="showResult" :type="positionType" @close="closeOverlay" /> | |||||
</div> | </div> | ||||
<ul v-if="showLegend" class="legend_list"> | <ul v-if="showLegend" class="legend_list"> | ||||
showLegend: { | showLegend: { | ||||
type: Boolean, | type: Boolean, | ||||
default: true | default: true | ||||
}, | |||||
showResult: { | |||||
type: Boolean, | |||||
default: false | |||||
} | } | ||||
}, | }, | ||||
emits: {}, | emits: {}, |
<template> | <template> | ||||
<n-drawer v-bind="getDrawerOptions" @update:show="handleDrawerColse"> | <n-drawer v-bind="getDrawerOptions" @update:show="handleDrawerColse"> | ||||
<n-drawer-content closable title="图片位置"> | <n-drawer-content closable title="图片位置"> | ||||
<PositionMsg :data="getPostionOptions" :show-legend="false" /> | |||||
<PositionMsg :data="getPostionOptions" show-result :show-legend="false" /> | |||||
</n-drawer-content> | </n-drawer-content> | ||||
</n-drawer> | </n-drawer> | ||||
</template> | </template> |
import { QUESTION_TYPE, QUES_STATUS } from '@/utils/dictionary.js' | |||||
import { QUES_STATUS } from '@/utils/dictionary.js' | |||||
import TableImage from '@/components/DataTable/tools/Image.vue' | import TableImage from '@/components/DataTable/tools/Image.vue' | ||||
import TableTags from '@/components/DataTable/tools/Tags.vue' | import TableTags from '@/components/DataTable/tools/Tags.vue' | ||||
import TableAction from '@/components/DataTable/tools/Action.vue' | import TableAction from '@/components/DataTable/tools/Action.vue' |
const searchParams = ref() | const searchParams = ref() | ||||
function handleSearch(params) { | function handleSearch(params) { | ||||
console.log(params) | |||||
searchParams.value = { ...params } | searchParams.value = { ...params } | ||||
if (params?.time?.length) { | if (params?.time?.length) { | ||||
searchParams.value = { | searchParams.value = { |
return { | return { | ||||
...list | ...list | ||||
} | } | ||||
} else if (props.data.status === 0) { | |||||
const list = form.formItem.filter((item) => !item.handle) | |||||
return { | |||||
...list | |||||
} | |||||
} else { | } else { | ||||
return { | return { | ||||
...form.formItem | ...form.formItem |
{ type: 'input', key: 'createTime', label: '问题发现时间', props: { disabled: true }}, | { type: 'input', key: 'createTime', label: '问题发现时间', props: { disabled: true }}, | ||||
{ type: 'image', key: 'fileMarkerUrl', label: '问题图片', props: { width: 100 }}, | { type: 'image', key: 'fileMarkerUrl', label: '问题图片', props: { width: 100 }}, | ||||
{ type: 'select', key: 'status', label: '问题状态', props: { options: QUES_STATUS, disabled: true }}, | { type: 'select', key: 'status', label: '问题状态', props: { options: QUES_STATUS, disabled: true }}, | ||||
{ type: 'oss', refIndex: 0, key: 'imageStatus', file: 'handlerImage', label: '封面', mode: true }, | |||||
{ type: 'input', key: 'handlerTime', label: '处理时间', props: { disabled: true }, mode: true, handle: true }, | |||||
{ type: 'input', key: 'handlerUserName', label: '处理人员', props: { disabled: true }, mode: true, handle: true }, | |||||
{ type: 'oss', refIndex: 0, key: 'imageStatus', file: 'handlerImage', label: '处理图片', mode: true }, | |||||
{ type: 'input', key: 'handlerResult', label: '描述', props: { type: 'textarea', maxlength: 255 }, mode: true } | { type: 'input', key: 'handlerResult', label: '描述', props: { type: 'textarea', maxlength: 255 }, mode: true } | ||||
] | ] | ||||
}) | }) |
{ type: 'input', key: 'createTime', label: '问题发现时间', props: { disabled: true }}, | { type: 'input', key: 'createTime', label: '问题发现时间', props: { disabled: true }}, | ||||
{ type: 'image', key: 'fileMarkerUrl', label: '问题图片', props: { width: 100 }}, | { type: 'image', key: 'fileMarkerUrl', label: '问题图片', props: { width: 100 }}, | ||||
{ type: 'select', key: 'status', label: '问题状态', props: { options: QUES_STATUS, disabled: true }}, | { type: 'select', key: 'status', label: '问题状态', props: { options: QUES_STATUS, disabled: true }}, | ||||
{ type: 'oss', refIndex: 0, key: 'imageStatus', file: 'handlerImage', label: '封面', mode: true }, | |||||
{ type: 'input', key: 'handlerResult', label: '描述', props: { type: 'textarea', maxlength: 255 }, mode: true } | |||||
{ type: 'oss', refIndex: 0, key: 'imageStatus', file: 'handlerImage', label: '处理结果', mode: true }, | |||||
{ type: 'input', key: 'handlerResult', label: '描述', props: { type: 'textarea', maxlength: 255 }, mode: true }, | |||||
{ type: 'input', key: 'handlerUserName', label: '处理人', mode: true } | |||||
] | ] | ||||
}) | }) | ||||
<n-gi><span>{{ item.questionDesc ? item.questionDesc : '-' }}</span></n-gi> | <n-gi><span>{{ item.questionDesc ? item.questionDesc : '-' }}</span></n-gi> | ||||
<n-gi><span>问题图片</span></n-gi> | <n-gi><span>问题图片</span></n-gi> | ||||
<n-gi><n-image :src="item.fileMarkerUrl" /></n-gi> | <n-gi><n-image :src="item.fileMarkerUrl" /></n-gi> | ||||
<n-gi v-if="type === 'result' && item.questionHandleList.length"><span>处理结果</span></n-gi> | |||||
<n-gi v-if="type === 'result' && item.questionHandleList.length"><n-image v-for="(cItem,cIndex) in item.questionHandleList" :key="cIndex" :src="cItem.handlerImage" /></n-gi> | |||||
<n-gi v-if="type === 'result' && item.list.length"><span>处理结果</span></n-gi> | |||||
<n-gi v-if="type === 'result' && item.list.length"><n-image v-for="(cItem,cIndex) in item.list" :key="cIndex" :src="cItem" /></n-gi> | |||||
</n-grid> | </n-grid> | ||||
</div> | </div> | ||||
<!-- </n-image-group> --> | <!-- </n-image-group> --> | ||||
}) | }) | ||||
data.problemsList.push(obj) | data.problemsList.push(obj) | ||||
}) | }) | ||||
data.reportDetail.questionReportList.forEach((item) => { | |||||
const list = item.questionHandleList[0]?.handlerImage.split(',') || [] | |||||
item.list = list | |||||
}) | |||||
// data.reportDetail.questionReportList.forEach((item, index) => { | // data.reportDetail.questionReportList.forEach((item, index) => { | ||||
// if (index === 0)item.fileMarkerUrl = 'https://image.t-aaron.com/XJRW20220720165837/2022-07-20-17-07-34_frame-6563-6720_type-%E6%B0%B4%E7%94%9F%E6%A4%8D%E8%A2%AB_o3MORSWHXz5pQ8F9_s-live-XJRW20220720165837-a0ec218ddd884ffcadd4f3c8fc27d825_AI.jpg' | // if (index === 0)item.fileMarkerUrl = 'https://image.t-aaron.com/XJRW20220720165837/2022-07-20-17-07-34_frame-6563-6720_type-%E6%B0%B4%E7%94%9F%E6%A4%8D%E8%A2%AB_o3MORSWHXz5pQ8F9_s-live-XJRW20220720165837-a0ec218ddd884ffcadd4f3c8fc27d825_AI.jpg' | ||||
// if (index === 1)item.fileMarkerUrl = 'https://image.t-aaron.com/XJRW20220720165837/2022-07-20-17-04-30_frame-1802-1920_type-%E6%B0%B4%E7%94%9F%E6%A4%8D%E8%A2%AB_b0N6GXoM178nUxhC_s-live-XJRW20220720165837-a0ec218ddd884ffcadd4f3c8fc27d825_AI.jpg' | // if (index === 1)item.fileMarkerUrl = 'https://image.t-aaron.com/XJRW20220720165837/2022-07-20-17-04-30_frame-1802-1920_type-%E6%B0%B4%E7%94%9F%E6%A4%8D%E8%A2%AB_b0N6GXoM178nUxhC_s-live-XJRW20220720165837-a0ec218ddd884ffcadd4f3c8fc27d825_AI.jpg' |
const tableRef = ref() | const tableRef = ref() | ||||
const searchParams = ref() | const searchParams = ref() | ||||
function handleSearch (params) { | |||||
function handleSearch(params) { | |||||
searchParams.value = { ...params } | searchParams.value = { ...params } | ||||
tableRef.value.reFetch({ searchParams }) | tableRef.value.reFetch({ searchParams }) | ||||
} | } | ||||
* @param {*} type 操作类型 create:创建,preview:预览,edit:编辑 | * @param {*} type 操作类型 create:创建,preview:预览,edit:编辑 | ||||
* @return {*} | * @return {*} | ||||
*/ | */ | ||||
function getRowData (row, type) { | |||||
function getRowData(row, type) { | |||||
data.rowData = row | data.rowData = row | ||||
data.modalType = type | data.modalType = type | ||||
data.modalShow = true | data.modalShow = true | ||||
} | } | ||||
function handleRowDelete (row) { | |||||
function handleRowDelete(row) { | |||||
taskDelete(row.id) | taskDelete(row.id) | ||||
.then(res => { | .then(res => { | ||||
if (res.code === 0) { | if (res.code === 0) { | ||||
}) | }) | ||||
} | } | ||||
function handleImplement (row) { | |||||
function handleImplement(row) { | |||||
$message.info('机场设备开始自检,请稍等') | $message.info('机场设备开始自检,请稍等') | ||||
implement(row.id) | implement(row.id) | ||||
} | } | ||||
/* 直播 */ | /* 直播 */ | ||||
function handleTaskLive (row) { | |||||
function handleTaskLive(row) { | |||||
data.rowData = row | data.rowData = row | ||||
data.liveDrawer = true | data.liveDrawer = true | ||||
} | } | ||||
/* 回放 */ | /* 回放 */ | ||||
function handleTaskDemand (row) { | |||||
function handleTaskDemand(row) { | |||||
data.rowData = row | data.rowData = row | ||||
data.demandDrawer = true | data.demandDrawer = true | ||||
} | } | ||||
/* 问题核实 */ | /* 问题核实 */ | ||||
function handleTaskVerify (row) { | |||||
function handleTaskVerify(row) { | |||||
data.rowData = row | data.rowData = row | ||||
data.verifyDrawer = true | data.verifyDrawer = true | ||||
} | } | ||||
title: '巡检方式', | title: '巡检方式', | ||||
key: 'inspectionType', | key: 'inspectionType', | ||||
align: 'center', | align: 'center', | ||||
render (row) { | |||||
render(row) { | |||||
return h(TableTags, { | return h(TableTags, { | ||||
data: row.inspectionType, | data: row.inspectionType, | ||||
filters: TASK_MODE | filters: TASK_MODE | ||||
title: '任务类型', | title: '任务类型', | ||||
key: 'type', | key: 'type', | ||||
align: 'center', | align: 'center', | ||||
render (row) { | |||||
render(row) { | |||||
return h(TableTags, { | return h(TableTags, { | ||||
data: row.type, | data: row.type, | ||||
filters: TASK_TYPE | filters: TASK_TYPE | ||||
title: '状态', | title: '状态', | ||||
key: 'status', | key: 'status', | ||||
align: 'center', | align: 'center', | ||||
render (row) { | |||||
render(row) { | |||||
return h(TableTags, { | return h(TableTags, { | ||||
data: row.status, | data: row.status, | ||||
filters: TASK_STATUS | filters: TASK_STATUS | ||||
align: 'center', | align: 'center', | ||||
width: 150, | width: 150, | ||||
fixed: 'right', | fixed: 'right', | ||||
render (row) { | |||||
render(row) { | |||||
return h(TableAction, { | return h(TableAction, { | ||||
actions: [ | actions: [ | ||||
{ | { | ||||
onClick: handleTaskVerify.bind(null, row) | onClick: handleTaskVerify.bind(null, row) | ||||
}, | }, | ||||
auth: 'basic_list', | auth: 'basic_list', | ||||
show: row.status !== 1 | |||||
show: row.status !== 1 && row.status !== 3 | |||||
} | } | ||||
], | ], | ||||
align: 'center' | align: 'center' |
import { QUESTION_STATUS, QUESTION_TYPE } from '@/utils/dictionary.js' | |||||
import { QUESTION_STATUS, QUESTION_TYPE, ORDER_STATUS } from '@/utils/dictionary.js' | |||||
import TableTags from '@/components/DataTable/tools/Tags.vue' | import TableTags from '@/components/DataTable/tools/Tags.vue' | ||||
import TableImage from '@/components/DataTable/tools/Image.vue' | import TableImage from '@/components/DataTable/tools/Image.vue' | ||||
import TableAction from '@/components/DataTable/tools/Action.vue' | import TableAction from '@/components/DataTable/tools/Action.vue' | ||||
render(row) { | render(row) { | ||||
return h(TableTags, { | return h(TableTags, { | ||||
data: row.status, | data: row.status, | ||||
filters: QUESTION_STATUS | |||||
filters: ORDER_STATUS | |||||
}) | }) | ||||
} | } | ||||
}, | }, | ||||
type: 'primary' | type: 'primary' | ||||
}, | }, | ||||
auth: 'basic_list', | auth: 'basic_list', | ||||
hidden: row.status === 2 | |||||
hidden: row.wordOrderStatus === 1 || row.status === 2 | |||||
}, | }, | ||||
{ | { | ||||
label: '确认', | label: '确认', | ||||
type: 'primary' | type: 'primary' | ||||
}, | }, | ||||
auth: 'basic_list', | auth: 'basic_list', | ||||
hidden: row.status === 1 | |||||
hidden: row.wordOrderStatus === 1 || row.status === 1 | |||||
} | } | ||||
], | ], | ||||
align: 'center' | align: 'center' |