fix: complete October 22 workflow feedback and request failure recovery
This commit is contained in:
@@ -9,9 +9,9 @@ import DataTable, { type DataTableColumn } from '@/components/common/DataTable.v
|
||||
import QueryToolbar, { type QueryField, type QueryModel } from '@/components/common/QueryToolbar.vue'
|
||||
import type { TableAction } from '@/components/common/tableActions'
|
||||
import ProcurementDetailPanel from '../components/ProcurementDetailPanel.vue'
|
||||
import { createProcurement, getProcurement, listProcurements, type ProcurementCreate, type ProcurementDetail, type ProcurementSummary } from '../api/procurement'
|
||||
import { createProcurement, getProcurement, listProcurements, type ProcurementDetail, type ProcurementSummary } from '../api/procurement'
|
||||
import { buildProcurementCreate, dateTime, draftBudgetTotal, emptyProcurementDraft, money, procurementStatuses, statusLabel, statusTone } from '../procurementPresentation'
|
||||
import { definitelyRejected, procurementRequestKey, restoreProcurementSubmission } from '../procurementSubmission'
|
||||
import { procurementRequestKey } from '../procurementSubmission'
|
||||
|
||||
const props = withDefaults(defineProps<{ createPage?: boolean; detailPage?: boolean }>(), { createPage: false, detailPage: false })
|
||||
const auth = useAuthStore(), route = useRoute(), router = useRouter()
|
||||
@@ -20,11 +20,9 @@ const orderNo = computed(() => typeof route.params.orderNo === 'string' ? route.
|
||||
const canCreate = computed(() => auth.hasPermission('merchant:cross-border:procurement:create'))
|
||||
const canList = computed(() => auth.hasPermission('merchant:cross-border:procurement:list'))
|
||||
const identity = computed(() => auth.token ? accessTokenIdentity(auth.token) : null)
|
||||
const storageKey = computed(() => identity.value ? `cc-procurement-submit:${encodeURIComponent(identity.value)}` : null)
|
||||
const companyName = computed(() => auth.profile.tenantName || (auth.user?.tenantName && !/^企业租户 \d+$/.test(auth.user.tenantName) ? auth.user.tenantName : ''))
|
||||
const form = reactive(emptyProcurementDraft())
|
||||
const pending = shallowRef<ProcurementCreate | null>(null)
|
||||
const recoveryError = ref(''), submitError = ref(''), submittedOrder = ref('')
|
||||
const submitError = ref(''), submittedOrder = ref('')
|
||||
const submitting = ref(false), loading = ref(false), error = ref('')
|
||||
const detail = shallowRef<ProcurementDetail | null>(null)
|
||||
const rows = ref<ProcurementSummary[]>([]), total = ref(0)
|
||||
@@ -74,43 +72,22 @@ async function loadDetail() {
|
||||
}
|
||||
function search() { if (query.page === 1) void loadList(); else query.page = 1 }
|
||||
function resetQuery() { const reload = query.page === 1; Object.assign(query, { page: 1, orderNo: '', purchaseCategory: '', productName: '', status: '' }); if (reload) void loadList() }
|
||||
function populate(payload: ProcurementCreate) {
|
||||
Object.assign(form, { purchaseCategory: payload.purchaseCategory, productName: payload.productName, productSpecification: payload.productSpecification || '', productUrl: payload.productUrl || '',
|
||||
purchaseQuantity: String(payload.purchaseQuantity), budgetUnitPrice: String(payload.budgetUnitPrice), currency: payload.currency, receivingAddress: payload.receivingAddress,
|
||||
contactName: payload.contactName, contactPhone: payload.contactPhone, remark: payload.remark || '' })
|
||||
}
|
||||
function restorePending() {
|
||||
pending.value = null; recoveryError.value = ''; submitError.value = ''; submittedOrder.value = ''; Object.assign(form, emptyProcurementDraft())
|
||||
if (!storageKey.value) return
|
||||
try { const saved = sessionStorage.getItem(storageKey.value); if (saved) { pending.value = Object.freeze(restoreProcurementSubmission(saved)); populate(pending.value) } }
|
||||
catch { recoveryError.value = '上次提交记录暂无法恢复,请先在订单列表或通过客服核对提交结果,避免重复下单。' }
|
||||
}
|
||||
function resetForm() { submitError.value = ''; submittedOrder.value = ''; Object.assign(form, emptyProcurementDraft()) }
|
||||
async function submit() {
|
||||
if (submitting.value || !canCreate.value || recoveryError.value || !storageKey.value) return
|
||||
submitError.value = ''; const owner = identity.value, key = storageKey.value; const resuming = Boolean(pending.value)
|
||||
let started = false
|
||||
if (submitting.value || !canCreate.value || !identity.value || submittedOrder.value) return
|
||||
const owner = identity.value; submitting.value = true; submitError.value = ''
|
||||
try {
|
||||
if (!pending.value) {
|
||||
const payload = buildProcurementCreate(form, companyName.value, procurementRequestKey())
|
||||
try { sessionStorage.setItem(key, JSON.stringify(payload)) } catch { throw new Error('浏览器暂无法保留提交信息,请允许会话存储后重试') }
|
||||
pending.value = Object.freeze(payload)
|
||||
}
|
||||
submitting.value = true; started = true
|
||||
const result = await createProcurement(pending.value)
|
||||
sessionStorage.removeItem(key)
|
||||
const result = await createProcurement(buildProcurementCreate(form, companyName.value, procurementRequestKey()))
|
||||
if (!active || owner !== identity.value) return
|
||||
pending.value = null; submittedOrder.value = result.order.orderNo; ElMessage.success('采购订单已提交')
|
||||
submittedOrder.value = result.order.orderNo; ElMessage.success('采购订单已提交')
|
||||
if (canList.value) await router.push({ name: 'cross-border-procurement-detail', params: { orderNo: result.order.orderNo } })
|
||||
} catch (cause) {
|
||||
if (!active || owner !== identity.value) return
|
||||
if (!resuming && cause instanceof ApiError && definitelyRejected(cause)) { sessionStorage.removeItem(key); pending.value = null }
|
||||
submitError.value = started && pending.value ? `${message(cause)}。提交结果尚未确认,请再次确认上次提交结果。` : message(cause)
|
||||
} finally { submitting.value = false }
|
||||
} catch (cause) { if (active && owner === identity.value) submitError.value = message(cause) }
|
||||
finally { submitting.value = false }
|
||||
}
|
||||
watch(() => [mode.value, orderNo.value, query.page, query.size, identity.value], (values, previous) => {
|
||||
if (values[4] !== previous?.[4]) { rows.value = []; total.value = 0 }
|
||||
++requestSequence; inFlight = ''; loading.value = false; error.value = ''; detail.value = null
|
||||
if (mode.value === 'create') restorePending()
|
||||
if (mode.value === 'create') resetForm()
|
||||
else if (mode.value === 'detail') void loadDetail()
|
||||
else void loadList()
|
||||
}, { immediate: true })
|
||||
@@ -140,12 +117,10 @@ onBeforeUnmount(() => { active = false; ++requestSequence })
|
||||
<section v-else class="procurement-create" aria-label="采购下单">
|
||||
<header class="procurement-heading"><div><h2>海外采购下单</h2><p>一单一个商品及规格;预算仅授权样品货款,运费及关税另行核定。</p></div><el-button v-if="canList" @click="returnToList">返回列表</el-button></header>
|
||||
<el-result v-if="!canCreate" icon="warning" title="没有采购下单权限" sub-title="请联系企业管理员配置权限" />
|
||||
<el-result v-else-if="submittedOrder" icon="success" title="采购订单已提交" :sub-title="submittedOrder"><template #extra><el-button @click="restorePending">新建另一单</el-button></template></el-result>
|
||||
<el-result v-else-if="submittedOrder" icon="success" title="采购订单已提交" :sub-title="submittedOrder"><template #extra><el-button @click="resetForm">新建另一单</el-button></template></el-result>
|
||||
<template v-else>
|
||||
<el-alert v-if="recoveryError" :title="recoveryError" type="error" :closable="false" />
|
||||
<el-alert v-else-if="pending" title="已保留本次提交内容。请再次确认上次提交结果,确认前不修改订单信息。" type="warning" :closable="false" />
|
||||
<el-alert v-if="submitError" class="submit-error" :title="submitError" type="error" :closable="false" />
|
||||
<el-form :model="form" label-position="top" :disabled="submitting || Boolean(pending) || Boolean(recoveryError)" @submit.prevent="submit">
|
||||
<el-form :model="form" label-position="top" :disabled="submitting" @submit.prevent="submit">
|
||||
<h3>商品与预算</h3><div class="procurement-form-grid">
|
||||
<el-form-item label="采购品类"><el-input v-model.trim="form.purchaseCategory" maxlength="128" placeholder="" /></el-form-item>
|
||||
<el-form-item label="商品名称" required><el-input v-model.trim="form.productName" maxlength="255" placeholder="" /></el-form-item>
|
||||
@@ -162,7 +137,7 @@ onBeforeUnmount(() => { active = false; ++requestSequence })
|
||||
<el-form-item class="full" label="采购要求"><el-input v-model="form.remark" type="textarea" :rows="3" maxlength="1000" show-word-limit placeholder="" /></el-form-item>
|
||||
</div>
|
||||
</el-form>
|
||||
<footer class="procurement-form-actions"><el-button type="primary" :loading="submitting" :disabled="Boolean(recoveryError) || (!pending && !companyName) || !identity" @click="submit">{{ pending ? '确认上次提交结果' : '提交采购订单' }}</el-button></footer>
|
||||
<footer class="procurement-form-actions"><el-button type="primary" :loading="submitting" :disabled="!companyName || !identity" @click="submit">提交采购订单</el-button></footer>
|
||||
</template>
|
||||
</section>
|
||||
</section>
|
||||
|
||||
Reference in New Issue
Block a user