修改 备货单 详情

This commit is contained in:
浅念
2025-09-11 17:44:37 +08:00
parent 853e9591b3
commit da690dfa06
21 changed files with 1490 additions and 1444 deletions
+31 -377
View File
@@ -1,259 +1,13 @@
<template>
<div class="stocking-show-page">
<div class="header boxshadow">
<div class="header-left">
<div class="title">合塑实业·汽车事业部-备货单(客户下定)</div>
<div class="sub">
<span class="mr40">备货单编号:{{ header.order_no }}</span>
<span>业务员:{{ header.salesman }}</span>
</div>
</div>
<!-- <ElButton type="primary" plain @click="printCurrent">打印整单</ElButton> -->
</div>
<!-- 基础信息 -->
<div class="boxshadow">
<div class="form-title"><span class="border"></span><span class="title">基础信息</span></div>
<ElRow :gutter="12">
<ElCol :span="5">
<ElFormItem label="阿里订单号/PN号">
<ElInput v-model="base.pn_no" disabled />
</ElFormItem>
</ElCol>
<ElCol :span="4">
<ElFormItem label="日期">
<ElInput v-model="base.date" disabled />
</ElFormItem>
</ElCol>
<ElCol :span="4">
<ElFormItem label="清关目的国">
<ElInput v-model="base.close_date" disabled />
</ElFormItem>
</ElCol>
<ElCol :span="3">
<ElFormItem label="客户来源">
<ElInput v-model="base.channel" disabled />
</ElFormItem>
</ElCol>
<ElCol :span="4">
<ElFormItem label="客户名称">
<ElInput v-model="base.customer_name" disabled />
</ElFormItem>
</ElCol>
<ElCol :span="4">
<ElFormItem label="客户所在国">
<ElInput v-model="base.client_country" disabled />
</ElFormItem>
</ElCol>
</ElRow>
</div>
<!-- 订单详情 -->
<div class="boxshadow">
<div class="form-title"><span class="border"></span><span class="title">订单详情</span></div>
<div class="items-wrap">
<div class="item-row" v-for="(item, idx) in items" :key="idx">
<ElRow :gutter="12">
<ElCol :span="8">
<ElFormItem label="车型" label-width="64px">
<ElInput v-model="item.model" disabled />
</ElFormItem>
</ElCol>
<ElCol :span="4">
<ElFormItem label="颜色/外" label-width="72px">
<ElInput v-model="item.color_out" disabled />
</ElFormItem>
</ElCol>
<ElCol :span="4">
<ElFormItem label="内饰" label-width="52px">
<ElInput v-model="item.color_in" disabled />
</ElFormItem>
</ElCol>
<ElCol :span="8">
<ElFormItem label="改装" label-width="52px">
<ElInput v-model="item.modify" disabled />
</ElFormItem>
</ElCol>
</ElRow>
<ElRow :gutter="12">
<ElCol :span="4">
<ElFormItem label="单价" label-width="52px">
<ElInput v-model="item.unit_price" disabled>
<template #append>{{ item.unit_price_currency }}</template>
</ElInput>
</ElFormItem>
</ElCol>
<ElCol :span="4">
<ElFormItem label="总价" label-width="52px">
<ElInput v-model="item.total_price" disabled>
<template #append>{{ item.total_price_currency }}</template>
</ElInput>
</ElFormItem>
</ElCol>
<ElCol :span="4">
<ElFormItem label="改装费" label-width="60px">
<ElInput v-model="item.modify_fee" disabled>
<template #append>{{ item.modify_fee_currency }}</template>
</ElInput>
</ElFormItem>
</ElCol>
<ElCol :span="4">
<ElFormItem label="FOB段运费" label-width="84px">
<ElInput v-model="item.fob_fee" disabled>
<template #append>{{ item.fob_fee_currency }}</template>
</ElInput>
</ElFormItem>
</ElCol>
<ElCol :span="4">
<ElFormItem label="手续费" label-width="60px">
<ElInput v-model="item.helper_fee" disabled>
<template #append>{{ item.helper_fee_currency }}</template>
</ElInput>
</ElFormItem>
</ElCol>
<ElCol :span="4">
<ElFormItem label="港杂费" label-width="60px">
<ElInput v-model="item.port_fee" disabled>
<template #append>{{ item.port_fee_currency }}</template>
</ElInput>
</ElFormItem>
</ElCol>
</ElRow>
<ElRow :gutter="12">
<ElCol :span="4">
<ElFormItem label="里程" label-width="52px">
<ElInput v-model="item.mileage" disabled />
</ElFormItem>
</ElCol>
<template v-if="(item.mileage ?? 0) <= 0">
<ElCol :span="4">
<ElFormItem label="官方指导价" label-width="85px">
<ElInput v-model="item.guide_price" disabled>
<template #append>{{ item.guide_price_currency }}</template>
</ElInput>
</ElFormItem>
</ElCol>
<ElCol :span="4">
<ElFormItem label="优惠" label-width="52px">
<ElInput v-model="item.discount" disabled>
<template #append>{{ item.discount_currency }}</template>
</ElInput>
</ElFormItem>
</ElCol>
</template>
<template v-else>
<ElCol :span="4">
<ElFormItem label="挂牌价" label-width="55px">
<ElInput v-model="item.listing_price" disabled>
<template #append>{{ item.listing_price_currency }}</template>
</ElInput>
</ElFormItem>
</ElCol>
<ElCol :span="4">
<ElFormItem label="二手减价" label-width="72px">
<ElInput v-model="item.reduction_price" disabled>
<template #append>{{ item.reduction_price_currency }}</template>
</ElInput>
</ElFormItem>
</ElCol>
</template>
<ElCol :span="8">
<ElFormItem label="利润" label-width="52px">
<ElInput v-model="item.profit" disabled>
<template #append>{{ item.profit_currency }}</template>
</ElInput>
</ElFormItem>
</ElCol>
<ElCol :span="8">
<ElFormItem label="车架号" label-width="70px">
<ElInput v-model.number="item.vin" disabled />
</ElFormItem>
</ElCol>
</ElRow>
</div>
<ElRow :gutter="12">
<ElCol :span="5">
<ElFormItem label="合计到岸价" label-width="85px">
<ElInput v-model="base.total_cif" disabled>
<template #append>{{ base.total_cif_currency }}</template>
</ElInput>
</ElFormItem>
</ElCol>
<ElCol :span="4">
<ElFormItem label="合同汇率" label-width="70px">
<ElInput v-model="base.contract_rate" disabled />
</ElFormItem>
</ElCol>
</ElRow>
</div>
</div>
<!-- 运输详情 -->
<div class="boxshadow">
<div class="form-title"><span class="border"></span><span class="title">运输详情</span></div>
<ElRow :gutter="12">
<ElCol :span="4"
><ElFormItem label="清关人"><ElInput v-model="ship.customs" disabled /></ElFormItem
></ElCol>
<ElCol :span="4"
><ElFormItem label="预计发送日"><ElInput v-model="ship.plan" disabled /></ElFormItem
></ElCol>
<ElCol :span="4"
><ElFormItem label="运输方式"><ElInput v-model="ship.method" disabled /></ElFormItem
></ElCol>
<ElCol :span="4"
><ElFormItem label="国内收货港"
><ElInput v-model="ship.domestic_port" disabled /></ElFormItem
></ElCol>
<ElCol :span="8"
><ElFormItem label="贸易条款/清关目的港"
><ElInput v-model="ship.terms" disabled /></ElFormItem
></ElCol>
</ElRow>
<ElRow :gutter="12">
<ElCol :span="6"
><ElFormItem label="最迟到港时间"
><ElInput v-model="ship.latest_arrival" disabled /></ElFormItem
></ElCol>
</ElRow>
</div>
<!-- 计划收款信息 -->
<div class="boxshadow">
<div class="form-title"
><span class="border"></span><span class="title">计划收款信息</span></div
>
<div v-for="(p, idx) in payments" :key="idx">
<ElRow :gutter="12">
<ElCol :span="4"
><ElFormItem label="汇款国"><ElInput v-model="p.remit_country" disabled /></ElFormItem
></ElCol>
<ElCol :span="4"
><ElFormItem label="日期"><ElInput v-model="p.date" disabled /></ElFormItem
></ElCol>
<ElCol :span="4"
><ElFormItem label="币种"><ElInput v-model="p.currency" disabled /></ElFormItem
></ElCol>
<ElCol :span="4"
><ElFormItem label="账户"><ElInput v-model="p.account" disabled /></ElFormItem
></ElCol>
<ElCol :span="4"
><ElFormItem label="汇款人"><ElInput v-model="p.payer" disabled /></ElFormItem
></ElCol>
<ElCol :span="4"
><ElFormItem label="金额"><ElInput v-model="p.amount" disabled /></ElFormItem
></ElCol>
</ElRow>
</div>
<OrderDetailContent :orderData="orderDialog.orderData" />
</div>
<!-- 上传合同 -->
<div class="boxshadow">
<div class="form-title">
<span class="border"></span>
<span class="title">上传合同</span>
<span class="title">合同</span>
</div>
<div class="file-preview">
<div v-if="contractFile" class="contract-file">
@@ -322,19 +76,7 @@
</div>
<div class="">
<ElRow :gutter="12">
<ElCol :span="12">
<ElFormItem label="审批操作:">
<el-select v-model="approvalAction" placeholder="请选择审批操作">
<el-option
v-for="item in getDictItemSelectlist"
:key="item.item_value"
:label="item.item_label"
:value="item.item_value"
/>
</el-select>
</ElFormItem>
</ElCol>
<ElCol :span="12">
<ElCol :span="24">
<ElFormItem label="备注:">
<el-input
v-model="approvalNotes"
@@ -351,8 +93,11 @@
<div class="form-card" v-if="status == 'pending'">
<!-- 底部信息 -->
<div class="submit-wrap">
<ElButton type="primary" size="large" class="submit-btn" @click="handleSubmit"
>提交</ElButton
<ElButton type="primary" plain size="large" class="submit-btn" @click="handleSubmit('reject')"
>驳回</ElButton
>
<ElButton type="primary" size="large" class="submit-btn" @click="handleSubmit('approve')"
>同意</ElButton
>
</div>
</div>
@@ -388,8 +133,13 @@
import { ElMessage } from 'element-plus'
import { usePdfPreview } from '@/composables/usePdfPreview'
import { router } from '@/router'
import OrderDetailContent from '@/components/custom/OrderDetailContent.vue'
import type { OrderData } from '@/composables/useOrderDetailDialog'
const { pdf, frameRef, download } = usePdfPreview()
const route = useRoute()
const orderDialog = reactive({
orderData: {} as OrderData
})
// const approval_id = route.query.id
const status = route.query.status
const stocking_id = route.query.biz_id
@@ -397,12 +147,12 @@
const stockingInfo = ref<any>({})
const approvalNotes = ref('')
const approvalAction = ref('')
const handleSubmit = async () => {
const handleSubmit = async (approvalAction: string) => {
try {
// 这里调用审批API
const { message } = await CrmService.stockapprovalpass({
instance_id: instance_id,
action: approvalAction.value,
action: approvalAction,
comment: approvalNotes.value
})
router.push('/crmpc/approval/stocking_auth')
@@ -411,29 +161,6 @@
ElMessage.error('提交失败')
}
}
// 回显视图模型,字段与模板一致
const header = reactive({ order_no: '', salesman: '' })
const base = reactive({
pn_no: '',
date: '',
close_date: '',
channel: '',
customer_name: '',
client_country: '',
total_cif: '',
total_cif_currency: '',
contract_rate: ''
})
const items = ref<any[]>([])
const ship = reactive({
customs: '',
plan: '',
method: '',
domestic_port: '',
terms: '',
latest_arrival: ''
})
const payments = ref<any[]>([])
// 审批记录(先填充假数据展示)
const approvalRecords = ref<any[]>([])
const getDictItemSelectlist = ref<any[]>([])
@@ -445,99 +172,13 @@
// 合同文件
const contractFile = ref<{ name: string; url: string; file_name: string } | null>(null)
const toMoneyView = (m: any) => ({
amount: m?.amount ?? '',
currency: m?.currency ?? ''
})
//获取详情并映射到回显模型
const getdetilfn = async () => {
const res = await CrmService.getStockDetail({ id: stocking_id })
const res = await CrmService.checkStock({ id: stocking_id })
const orderData: OrderData = res
orderDialog.orderData = orderData
stockingInfo.value = res
// 头部
header.order_no = res?.order_no || res?.pi_no || ''
header.salesman =
res?.salesperson_snapshot || res?.salesman || res?.salesman_name || res?.user?.name || ''
// 基础信息
base.pn_no = res?.pi_no || ''
base.date = res?.biz_date || ''
base.close_date = res?.clearance_country_snapshot || ''
base.channel = res?.customer_source_snapshot || res?.customer_source || ''
base.customer_name = res?.customer_snapshot || res?.customer_name || ''
base.client_country = res?.customer_country_snapshot || res?.customer_country || ''
// 订单明细
const list = Array.isArray(res?.veh_list) ? res.veh_list : []
items.value = list.map((it: any) => {
const unit = toMoneyView(it?.unit_price)
const total = toMoneyView(it?.total_price)
const guide = toMoneyView(it?.official_price)
const discount = toMoneyView(it?.discount_price)
const listing = toMoneyView(it?.listing_price)
const reduction = toMoneyView(it?.reduction_price)
const helper = toMoneyView(it?.handling_fee)
const fob = toMoneyView(it?.fob_transport_fee)
const port = toMoneyView(it?.port_misc_fee)
const profit = toMoneyView(it?.profit)
return {
model: it?.model_snapshot || '',
mileage: it?.mileage ?? 0,
vin: it?.vin || '',
color_out: it?.color_exterior_snapshot || '',
color_in: it?.color_interior_snapshot || '',
modify: (Array.isArray(it?.modify_list) ? it.modify_list : [])
.map((m: any) => m?.option_name_snapshot)
.filter(Boolean)
.join('、'),
modify_fee: it?.retrofit_fee?.amount ?? '',
modify_fee_currency: it?.retrofit_fee?.currency ?? '',
fob_fee: fob.amount,
fob_fee_currency: fob.currency,
unit_price: unit.amount,
unit_price_currency: unit.currency,
total_price: total.amount,
total_price_currency: total.currency,
guide_price: guide.amount,
guide_price_currency: guide.currency,
discount: discount.amount,
discount_currency: discount.currency,
listing_price: listing.amount,
listing_price_currency: listing.currency,
reduction_price: reduction.amount,
reduction_price_currency: reduction.currency,
helper_fee: helper.amount,
helper_fee_currency: helper.currency,
domestic_freight: it?.domestic_freight?.amount ?? '',
domestic_freight_currency: it?.domestic_freight?.currency ?? '',
port_fee: port.amount,
port_fee_currency: port.currency,
profit: profit.amount,
profit_currency: profit.currency
}
})
// 运输详情
ship.customs = res?.declarant_name || ''
ship.plan = res?.eta_ship_date || ''
ship.method = res?.shipping_method_snapshot || ''
ship.domestic_port = res?.domestic_port_snapshot || ''
ship.terms =
`${res?.trade_term_snapshot || ''} / ${res?.clearance_port_snapshot || ''}`.replace(
/^\s*\/\s*$/,
''
)
ship.latest_arrival = res?.latest_arrival_date || ''
// 合计与汇率
base.total_cif = res?.cif_total_amount?.amount ?? ''
base.total_cif_currency = res?.cif_total_amount?.currency || ''
base.contract_rate = res?.contract_exchange_rate || res?.contract_rate || ''
// 计划收款(全部展示)
payments.value = (Array.isArray(res?.account_list) ? res.account_list : []).map((p: any) => ({
remit_country: p?.remit_country_name_snapshot || '',
date: p?.remit_date || '',
currency: p?.currency_name_snapshot || p?.currency_code || '',
account: p?.account_name_snapshot || '',
payer: p?.remitter_name || '',
amount: p?.amount ?? ''
}))
// 合同文件
if (res?.contract) {
contractFile.value = {
@@ -894,4 +535,17 @@
color: #999;
padding: 8px 0 4px 4px;
}
.submit-wrap {
display: flex;
justify-content: space-around;
padding: 24px 0 8px;
width: 500px;
margin: auto;
}
.submit-btn {
width: 100px;
height: 44px;
font-size: 16px;
}
</style>