#
zhou zhou
11 分钟以前 dec8eed333ab29efe5bddef6be866d0af69073fd
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
<template>
  <ElDrawer
    :model-value="visible"
    :title="t('pages.orders.transfer.detail.title')"
    size="1200px"
    destroy-on-close
    @update:model-value="handleVisibleChange"
  >
    <ElScrollbar class="h-[calc(100vh-180px)] pr-1">
      <div v-if="loading" class="py-6">
        <ElSkeleton :rows="12" animated />
      </div>
      <div v-else class="space-y-4">
        <ElDescriptions :title="t('pages.orders.transfer.detail.baseInfo')" :column="2" border>
          <ElDescriptionsItem :label="t('pages.orders.transfer.detail.code')">{{ detail.code || '--' }}</ElDescriptionsItem>
          <ElDescriptionsItem :label="t('pages.orders.transfer.detail.type')">{{ detail.typeLabel || '--' }}</ElDescriptionsItem>
          <ElDescriptionsItem :label="t('pages.orders.transfer.detail.source')">
            <ElTag :type="detail.sourceTagType || 'info'" effect="light">
              {{ detail.sourceText || '--' }}
            </ElTag>
          </ElDescriptionsItem>
          <ElDescriptionsItem :label="t('pages.orders.transfer.detail.exceStatus')">
            <ElTag :type="detail.exceStatusTagType || 'info'" effect="light">
              {{ detail.exceStatusText || '--' }}
            </ElTag>
          </ElDescriptionsItem>
          <ElDescriptionsItem :label="t('pages.orders.transfer.detail.orgWareName')">{{ detail.orgWareName || '--' }}</ElDescriptionsItem>
          <ElDescriptionsItem :label="t('pages.orders.transfer.detail.tarWareName')">{{ detail.tarWareName || '--' }}</ElDescriptionsItem>
          <ElDescriptionsItem :label="t('pages.orders.transfer.detail.orgAreaName')">{{ detail.orgAreaName || '--' }}</ElDescriptionsItem>
          <ElDescriptionsItem :label="t('pages.orders.transfer.detail.tarAreaName')">{{ detail.tarAreaName || '--' }}</ElDescriptionsItem>
          <ElDescriptionsItem :label="t('pages.orders.transfer.detail.status')">
            <ElTag :type="detail.statusType || 'info'" effect="light">
              {{ detail.statusText || '--' }}
            </ElTag>
          </ElDescriptionsItem>
          <ElDescriptionsItem :label="t('pages.orders.transfer.detail.memo')" :span="2">{{ detail.memo || '--' }}</ElDescriptionsItem>
        </ElDescriptions>
 
        <ElDescriptions :title="t('pages.orders.transfer.detail.auditInfo')" :column="2" border>
          <ElDescriptionsItem :label="t('pages.orders.transfer.detail.createBy')">{{ detail.createByText || '--' }}</ElDescriptionsItem>
          <ElDescriptionsItem :label="t('pages.orders.transfer.detail.createTime')">{{ detail.createTimeText || '--' }}</ElDescriptionsItem>
          <ElDescriptionsItem :label="t('pages.orders.transfer.detail.updateBy')">{{ detail.updateByText || '--' }}</ElDescriptionsItem>
          <ElDescriptionsItem :label="t('pages.orders.transfer.detail.updateTime')">{{ detail.updateTimeText || '--' }}</ElDescriptionsItem>
        </ElDescriptions>
 
        <div class="space-y-3">
          <div class="flex items-center justify-between">
            <div class="text-sm font-medium text-[var(--art-gray-900)]">{{ t('pages.orders.transfer.detail.relatedOrders') }}</div>
            <ElTag effect="plain">{{ t('common.count', { count: orderRows.length }) }}</ElTag>
          </div>
          <ArtTable
            :loading="ordersLoading"
            :data="orderRows"
            :columns="orderColumns"
            :pagination="orderPagination"
            @pagination:size-change="$emit('size-change', $event)"
            @pagination:current-change="$emit('current-change', $event)"
          />
        </div>
      </div>
    </ElScrollbar>
  </ElDrawer>
</template>
 
<script setup>
  import { computed } from 'vue'
  import { useI18n } from 'vue-i18n'
  import ArtTable from '@/components/core/tables/art-table/index.vue'
  import { createTransferOrderTableColumns } from '../transferTable.columns.js'
 
  defineOptions({ name: 'TransferDetailDrawer' })
 
  const props = defineProps({
    visible: { type: Boolean, default: false },
    loading: { type: Boolean, default: false },
    ordersLoading: { type: Boolean, default: false },
    detail: { type: Object, default: () => ({}) },
    orderRows: { type: Array, default: () => [] },
    orderPagination: { type: Object, default: () => ({ current: 1, size: 20, total: 0 }) }
  })
 
  const emit = defineEmits(['update:visible', 'size-change', 'current-change'])
  const { t } = useI18n()
 
  const orderColumns = createTransferOrderTableColumns()
 
  const visible = computed({
    get: () => props.visible,
    set: (value) => emit('update:visible', value)
  })
 
  function handleVisibleChange(value) {
    visible.value = value
  }
</script>