1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
| <template>
| <div class="rounded-xl bg-[var(--el-fill-color-blank)] px-4 py-4">
| <div class="mb-3 flex items-center justify-between">
| <div class="text-sm font-medium text-[var(--art-gray-900)]">任务明细</div>
| <ElButton text size="small" :loading="loading" @click="loadData">刷新</ElButton>
| </div>
|
| <ArtTable
| :loading="loading"
| :data="rows"
| :columns="columns"
| empty-text="暂无任务明细"
| :empty-height="'220px'"
| />
| </div>
| </template>
|
| <script setup>
| import { onMounted, ref, watch } from 'vue'
| import { guardRequestWithMessage } from '@/utils/sys/requestGuard'
| import { fetchTaskItemPage } from '@/api/task'
| import { normalizeTaskItemRow } from '../taskPage.helpers'
|
| const props = defineProps({
| row: {
| type: Object,
| default: () => ({})
| }
| })
|
| const loading = ref(false)
| const rows = ref([])
|
| const columns = [
| {
| type: 'globalIndex',
| label: '序号',
| width: 72,
| align: 'center'
| },
| {
| prop: 'orderTypeLabel',
| label: '单据类型',
| minWidth: 120,
| showOverflowTooltip: true
| },
| {
| prop: 'wkTypeLabel',
| label: '业务类型',
| minWidth: 120,
| showOverflowTooltip: true
| },
| {
| prop: 'platWorkCode',
| label: '工单号',
| minWidth: 150,
| showOverflowTooltip: true
| },
| {
| prop: 'platItemId',
| label: '行号',
| minWidth: 100,
| showOverflowTooltip: true
| },
| {
| prop: 'matnrCode',
| label: '物料编码',
| minWidth: 150,
| showOverflowTooltip: true
| },
| {
| prop: 'maktx',
| label: '物料名称',
| minWidth: 220,
| showOverflowTooltip: true
| },
| {
| prop: 'batch',
| label: '批次',
| minWidth: 140,
| showOverflowTooltip: true
| },
| {
| prop: 'unit',
| label: '单位',
| width: 100
| },
| {
| prop: 'anfme',
| label: '数量',
| width: 100,
| align: 'right'
| },
| {
| prop: 'updateByText',
| label: '更新人',
| minWidth: 120,
| showOverflowTooltip: true
| },
| {
| prop: 'updateTimeText',
| label: '更新时间',
| minWidth: 180,
| showOverflowTooltip: true
| }
| ]
|
| async function loadData() {
| if (!props.row?.id) {
| rows.value = []
| return
| }
|
| loading.value = true
| try {
| const response = await guardRequestWithMessage(
| fetchTaskItemPage({
| taskId: props.row.id,
| current: 1,
| pageSize: 50
| }),
| { records: [] },
| { timeoutMessage: '任务明细加载超时，已停止等待' }
| )
| rows.value = Array.isArray(response?.records)
| ? response.records.map((record) => normalizeTaskItemRow(record))
| : []
| } finally {
| loading.value = false
| }
| }
|
| watch(
| () => props.row?.id,
| () => {
| void loadData()
| }
| )
|
| onMounted(() => {
| void loadData()
| })
| </script>
|
|
