|
|
|
@ -130,32 +130,34 @@ |
|
|
|
<a-tab-pane key="3" tab="流程信息"> |
|
|
|
<div style="margin-left: 20px"> |
|
|
|
<a-timeline> |
|
|
|
<a-timeline-item v-for="(item, index) in progress" :key="index" > |
|
|
|
<template #dot><span class="stage">{{ item.stage }}</span></template> |
|
|
|
<a-timeline-item v-for="(item, index) in progress" :key="index"> |
|
|
|
<template #dot |
|
|
|
><span class="stage">{{ item.stage }}</span></template |
|
|
|
> |
|
|
|
<div class="timeText" |
|
|
|
><span class="person">{{ item.operator }}</span |
|
|
|
>{{item.description}}</div |
|
|
|
>{{ item.description }}</div |
|
|
|
> |
|
|
|
<div class="timeText">{{ item.feedback }}</div> |
|
|
|
<div class="operationTime">{{ item.operationTime }}</div> |
|
|
|
<div class="duration" v-if="item.duration"> <Icon icon="ant-design:dashboard-outlined" />用时{{item.duration}}</div> |
|
|
|
<div class="duration" v-if="item.duration"> |
|
|
|
<Icon icon="ant-design:dashboard-outlined" />用时{{ item.duration }}</div |
|
|
|
> |
|
|
|
<a-divider></a-divider> |
|
|
|
</a-timeline-item> |
|
|
|
|
|
|
|
</a-timeline> |
|
|
|
</div> |
|
|
|
</a-tab-pane> |
|
|
|
<a-tab-pane key="4" tab="历史信息"> |
|
|
|
<a-table :dataSource="progress" :columns="historyColumns" bordered> |
|
|
|
</a-table> |
|
|
|
<a-table :dataSource="progress" :columns="historyColumns" bordered> </a-table> |
|
|
|
</a-tab-pane> |
|
|
|
<a-tab-pane key="5" tab="延期信息"> |
|
|
|
<a-table :dataSource="delayInfo" :columns="delayColumns" bordered> |
|
|
|
<template #bodyCell="{ column }"> |
|
|
|
<!-- <template #bodyCell="{ column }"> |
|
|
|
<template v-if="column.key === 'action'"> |
|
|
|
<a-button type="link">查看</a-button> |
|
|
|
</template> |
|
|
|
</template> |
|
|
|
</template> --> |
|
|
|
</a-table> |
|
|
|
</a-tab-pane> |
|
|
|
</a-tabs> |
|
|
|
@ -164,12 +166,12 @@ |
|
|
|
</template> |
|
|
|
|
|
|
|
<script> |
|
|
|
import { reactive, ref,defineComponent } from 'vue'; |
|
|
|
import { getInfo,dealInfo, queryProcess } from './api'; |
|
|
|
import { reactive, ref, defineComponent } from 'vue'; |
|
|
|
import { getInfo, dealInfo, queryProcess, getOrderDelayHistory } from './api'; |
|
|
|
import AMapLoader from '@amap/amap-jsapi-loader'; |
|
|
|
import Icon from '@/components/Icon/Icon.vue'; |
|
|
|
export default defineComponent({ |
|
|
|
components:{Icon}, |
|
|
|
components: { Icon }, |
|
|
|
setup(props, { emit }) { |
|
|
|
//抽屉详情 |
|
|
|
let detail = reactive({ |
|
|
|
@ -217,6 +219,10 @@ |
|
|
|
label: '处理中(已延期)', |
|
|
|
value: 7, |
|
|
|
}, |
|
|
|
{ |
|
|
|
label: '作废', |
|
|
|
value: 8, |
|
|
|
}, |
|
|
|
{ |
|
|
|
label: '运维单位处理时回退至派遣', |
|
|
|
value: 3, |
|
|
|
@ -240,7 +246,7 @@ |
|
|
|
})?.label; |
|
|
|
}; |
|
|
|
const historyColumns = [ |
|
|
|
{ |
|
|
|
{ |
|
|
|
title: '环节', |
|
|
|
dataIndex: 'stage', |
|
|
|
key: 'stage', |
|
|
|
@ -263,25 +269,25 @@ |
|
|
|
]; |
|
|
|
const delayInfo = ref([]); |
|
|
|
const delayColumns = [ |
|
|
|
{ |
|
|
|
title: '环节', |
|
|
|
dataIndex: 'stage', |
|
|
|
key: 'stage', |
|
|
|
{ |
|
|
|
title: '申请时间', |
|
|
|
dataIndex: 'createTime', |
|
|
|
key: 'createTime', |
|
|
|
}, |
|
|
|
{ |
|
|
|
title: '操作', |
|
|
|
dataIndex: 'operationName', |
|
|
|
key: 'operationName', |
|
|
|
title: '申请原因', |
|
|
|
dataIndex: 'delayReason', |
|
|
|
key: 'delayReason', |
|
|
|
}, |
|
|
|
{ |
|
|
|
title: '操作人', |
|
|
|
dataIndex: 'operator', |
|
|
|
key: 'operator', |
|
|
|
title: '延期时间', |
|
|
|
dataIndex: 'afterDelayTime', |
|
|
|
key: 'afterDelayTime', |
|
|
|
}, |
|
|
|
{ |
|
|
|
title: '操作时间', |
|
|
|
dataIndex: 'operationTime', |
|
|
|
key: 'operationTime ', |
|
|
|
title: '详细信息', |
|
|
|
dataIndex: 'handleResult', |
|
|
|
key: 'handleResult ', |
|
|
|
}, |
|
|
|
]; |
|
|
|
|
|
|
|
@ -297,8 +303,14 @@ |
|
|
|
progress.value = progressLine; |
|
|
|
console.log(progress.value); |
|
|
|
const data1 = await dealInfo(id); |
|
|
|
for (let i in dealDetail) { |
|
|
|
dealDetail[i] = data1[i]; |
|
|
|
if (data1) { |
|
|
|
for (let i in dealDetail) { |
|
|
|
dealDetail[i] = data1[i]; |
|
|
|
} |
|
|
|
} |
|
|
|
const data2 = await getOrderDelayHistory(id); |
|
|
|
if (data2) { |
|
|
|
delayInfo.value = data2; |
|
|
|
} |
|
|
|
initMap(detail.longitude, detail.latitude, detail.faultLocation); |
|
|
|
}; |
|
|
|
@ -306,8 +318,8 @@ |
|
|
|
// 关闭抽屉的方法 |
|
|
|
const onClose = () => { |
|
|
|
visible.value = false; |
|
|
|
for(let i in dealDetail){ |
|
|
|
dealDetail[i] = '' |
|
|
|
for (let i in dealDetail) { |
|
|
|
dealDetail[i] = ''; |
|
|
|
} |
|
|
|
map.value?.destroy(); |
|
|
|
}; |
|
|
|
@ -370,7 +382,7 @@ |
|
|
|
div { |
|
|
|
margin-bottom: 1%; |
|
|
|
} |
|
|
|
.stage{ |
|
|
|
.stage { |
|
|
|
font-weight: 600; |
|
|
|
} |
|
|
|
.timeText { |
|
|
|
@ -383,13 +395,13 @@ |
|
|
|
.operationTime { |
|
|
|
color: gray; |
|
|
|
font-weight: 550; |
|
|
|
margin-left:80% |
|
|
|
margin-left: 80%; |
|
|
|
} |
|
|
|
.duration { |
|
|
|
color: #00bbff; |
|
|
|
position: absolute; |
|
|
|
font-weight: 550; |
|
|
|
margin-left:80%; |
|
|
|
margin-left: 80%; |
|
|
|
top: 0.1%; |
|
|
|
} |
|
|
|
.titleLabel { |
|
|
|
|
wbc
2 months ago