<!-- 保税仓业务-进仓管理-详情 -->
<template>
    <app-drawer class="g-details" title="详情" :width="960" v-model:show="show">
        <app-table-details title="发货信息" :label-width="110" :data="selectedRow" :cell-props="deliveryCells" :column="2" />
        <app-table-details title="签收信息" :label-width="110" :data="selectedRow" :cell-props="receiveCells" :column="2" />
        <app-table :data="orderDetailList" :columns="columns" :show-toolbar="false" border>
            <template #header>
                <h3 class="g-details__title">
                    商品信息
                    <el-button size="small" @click="showDownload = true">文件下载</el-button>
                </h3>
            </template>
        </app-table>
        <component :is="Download" v-bind="{ selectedRow }" @closed="showDownload = false" v-if="showDownload" />
    </app-drawer>
</template>

<script lang="ts" setup>
import { shallowRef, PropType, defineAsyncComponent } from 'vue'
import { useBScinOutOrderDetail } from '@/business/bonded'
import AppDrawer from '@pc/components/base/drawer/index.vue'
import AppTable from '@pc/components/base/table/index.vue'
import AppTableDetails from '@pc/components/base/table-details/index.vue'

const Download = defineAsyncComponent(() => import('@pc/components/modules/download/index.vue'))

const props = defineProps({
    selectedRow: {
        type: Object as PropType<Ermcp.GzbscinOutOrderRsp>,
        required: true
    },
})

const { orderDetailList, getBScinOutOrderDetail } = useBScinOutOrderDetail(props.selectedRow.orderid)
const show = shallowRef(true)
const showDownload = shallowRef(false)

const deliveryCells = [
    { prop: 'ordernum', label: '单据编号：' },
    { prop: 'applicanttime', label: '申请日期：' },
    { prop: 'username', label: '发货方：' },
    { prop: 'useraddress', label: '发货地址：' },
    { prop: 'contactname', label: '联系人：' },
    { prop: 'contactnum', label: '联系电话：' },
    { prop: 'logisticscompany', label: '物流公司：' },
    { prop: 'logisticsno', label: '托运单号：' },
]

const receiveCells = [
    { prop: 'signeename', label: '收货人：' },
    { prop: 'signeedate', label: '收货日期：' },
    { prop: 'confirmername', label: '进仓确认人：' },
    { prop: 'confirmdate', label: '确认日期：' },
    { prop: 'sealno', label: '进仓封条号：' },
    { prop: 'customsno', label: '报关单号：' },
    { prop: 'jckdate', label: '进口日期：' },
    { prop: 'checklistno', label: '核注清单号：' },
]

const columns: Ermcp.TableColumn[] = [
    { prop: 'goodsname', label: '商品名称' },
    { prop: 'goodsspec', label: '规格' },
    { prop: 'rawdetail', label: '成品对应原料明细', width: 160 },
    { prop: 'backagenum', label: '件数' },
    { prop: 'netweightct', label: '净重(克拉)' },
    { prop: 'netweightgm', label: '净重(克)' },
    { prop: 'bagweightgm', label: '连袋重(克)' },
    { prop: 'prepricegm', label: '单价(克)' },
    { prop: 'totalprice', label: '总价' },
    { prop: 'currencydes', label: '币种' },
    { prop: 'customsvalue', label: '报关总值' },
    { prop: 'origincountry', label: '原产国' },
    { prop: 'remark', label: '备注' },
]

getBScinOutOrderDetail()
</script>