refactor(biz): 优化采购订单界面布局和字段配置

This commit is contained in:
zxy 2026-05-19 11:08:05 +08:00
parent cd99537ba5
commit e2b337a7d0
8 changed files with 147 additions and 91 deletions

View File

@ -39,7 +39,7 @@ public class PurOrderSaveReqVO {
private String purDeptName;
@Schema(description = "部门id", example = "4640")
private String purDeptId;
private Integer purDeptId;
@Schema(description = "申请类型(1 原材料 2 辅料 3设备)", example = "1")
private String applyType;
@ -48,7 +48,7 @@ public class PurOrderSaveReqVO {
private String purEmpName;
@Schema(description = "采购人id", example = "5929")
private String purEmpId;
private Integer purEmpId;
@Schema(description = "验收方式(1 数量验收 2金额验收)")
private String acceptMeth;

View File

@ -1,14 +1,13 @@
package com.ningxia.yunxi.chemmes.module.biz.dal.dataobject.purorder;
import com.baomidou.mybatisplus.annotation.KeySequence;
import com.baomidou.mybatisplus.annotation.TableId;
import com.baomidou.mybatisplus.annotation.TableName;
import com.ningxia.yunxi.chemmes.framework.mybatis.core.dataobject.BaseDO;
import lombok.*;
import java.time.LocalDate;
import java.util.*;
import java.time.LocalDateTime;
import java.time.LocalDateTime;
import java.time.LocalDateTime;
import com.baomidou.mybatisplus.annotation.*;
import com.ningxia.yunxi.chemmes.framework.mybatis.core.dataobject.BaseDO;
/**
* 采购订单主 DO

View File

@ -14,7 +14,7 @@ const appStore = useAppStore()
const title = computed(() => appStore.getTitle)
</script>
<template>
<!-- <template>
<div
:class="prefixCls"
class="h-[var(--app-footer-height)] bg-[var(--app-content-bg-color)] text-center text-[var(--el-text-color-placeholder)] dark:bg-[var(--el-bg-color)]"
@ -33,4 +33,4 @@ const title = computed(() => appStore.getTitle)
</el-row>
<span class="text-14px"></span>
</div>
</template>
</template> -->

View File

@ -3,62 +3,68 @@
<el-form
ref="formRef"
:model="formData"
label-width="100px"
label-width="120px"
v-loading="formLoading"
>
<!-- 基础信息 -->
<el-card class="mb-4">
<template #header>
<span>信息</span>
<span>信息</span>
</template>
<!-- 第一行单据类型申请类型采购日期 -->
<el-row :gutter="20">
<el-col :span="6">
<el-form-item label="采购单号">
<el-input v-model="formData.purOrdNo" disabled />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="订单日期">
<el-input v-model="formData.purDate" disabled />
</el-form-item>
</el-col>
<el-col :span="6">
<el-col :span="8">
<el-form-item label="单据类型">
<el-input :value="formData.billType === '1' ? '标准采购申请' : '设备采购申请'" disabled />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="单据状态">
<el-input v-model="formData.purStatus" disabled :value="formData.purStatus === '1' ? '已创建' : formData.purStatus === '2' ? '已确认' : formData.purStatus === '3' ? '已审批' : '已驳回'" />
<el-col :span="8">
<el-form-item label="申请类型">
<el-input :value="formData.applyType === '1' ? '采购申请' : '紧急采购'" disabled />
</el-form-item>
</el-col>
<el-col :span="8">
<el-form-item label="采购日期">
<el-input v-model="formData.purDate" disabled />
</el-form-item>
</el-col>
</el-row>
<!-- 第二行采购部门采购人员单据状态 -->
<el-row :gutter="20" class="mt-4">
<el-col :span="6">
<el-form-item label="供应商">
<el-input v-model="formData.supplierName" disabled />
</el-form-item>
</el-col>
<el-col :span="6">
<el-col :span="8">
<el-form-item label="采购部门">
<el-input v-model="formData.purDeptName" disabled />
</el-form-item>
</el-col>
<el-col :span="6">
<el-col :span="8">
<el-form-item label="采购人员">
<el-input v-model="formData.purEmpName" disabled />
</el-form-item>
</el-col>
<el-col :span="6">
<el-form-item label="验收方式">
<el-input :value="formData.acceptMeth === '1' ? '数量验收' : '金额验收'" disabled />
<el-col :span="8">
<el-form-item label="单据状态">
<el-input :value="formData.purStatus === '1' ? '已创建' : formData.purStatus === '2' ? '已确认' : formData.purStatus === '3' ? '已审批' : '已驳回'" disabled />
</el-form-item>
</el-col>
</el-row>
<!-- 第三行供应商名称备注 -->
<el-row :gutter="20" class="mt-4">
<el-col :span="24">
<el-col :span="12">
<el-form-item label="供应商名称">
<el-input v-model="formData.supplierName" disabled />
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="备注">
<el-input v-model="formData.remark" type="textarea" :rows="2" disabled />
<el-input v-model="formData.remark" type="textarea" :rows="1" disabled />
</el-form-item>
</el-col>
</el-row>
<!-- 第四行验收方式 -->
<el-row :gutter="20" class="mt-4">
<el-col :span="8">
<el-form-item label="验收方式">
<el-input :value="formData.acceptMeth === '1' ? '数量验收' : '金额验收'" disabled />
</el-form-item>
</el-col>
</el-row>
@ -73,27 +79,22 @@
<el-table-column label="序号" type="index" width="60px" align="center" />
<el-table-column label="物料编码" prop="materialCode" align="center" />
<el-table-column label="物料名称" prop="materialName" align="center" />
<el-table-column label="收货状态" prop="acceptStatus" align="center">
<template #default="scope">
{{ scope.row.acceptStatus === '1' ? '已收货' : '未收货' }}
</template>
</el-table-column>
<el-table-column label="收货数量" prop="acceptQty" align="center" />
<el-table-column label="单位" prop="unit" align="center" />
<el-table-column label="规格型号" prop="spec" align="center" />
<el-table-column label="单位" prop="unit" align="center" />
<el-table-column label="采购数量" prop="purQty" align="center" />
<el-table-column label="要求货日期" prop="reqDeliveryDate" align="center" />
<el-table-column label="采购单价" prop="priceTax" align="center">
<el-table-column label="要求到货日期" prop="reqDeliveryDate" align="center" />
<el-table-column label="含税单价" prop="priceTax" align="center">
<template #default="scope">
<span style="color: #409EFF;">{{ scope.row.priceTax }}</span>
</template>
</el-table-column>
<el-table-column label="采购总价" prop="totalPrice" align="center" />
<el-table-column label="税率" prop="taxRatio" align="center">
<template #default="scope">
{{ scope.row.taxRatio }}%
</template>
</el-table-column>
<el-table-column label="含税总价" prop="totalPrice" align="center" />
<el-table-column label="备注" prop="remark" align="center" />
</el-table>
</el-card>
</el-form>
@ -119,6 +120,7 @@ const formData = reactive({
purOrdNo: undefined,
purDate: undefined,
billType: undefined,
applyType: undefined,
purStatus: undefined,
supplierName: undefined,
purDeptName: undefined,

View File

@ -16,7 +16,7 @@
<el-row :gutter="20">
<el-col :span="8">
<el-form-item label="单据类型" prop="billType" >
<el-select v-model="formData.billType" placeholder="请选择" style="width: 100%">
<el-select v-model="formData.billType" placeholder="请选择" style="width: 100%" disabled>
<el-option label="标准采购申请" value="1" />
<el-option label="设备采购申请" value="2" />
</el-select>
@ -24,7 +24,7 @@
</el-col>
<el-col :span="8">
<el-form-item label="申请类型" prop="applyType">
<el-select v-model="formData.applyType" placeholder="请选择" style="width: 100%">
<el-select v-model="formData.applyType" placeholder="请选择" style="width: 100%" disabled>
<el-option label="采购申请" value="1" />
<el-option label="紧急采购" value="2" />
</el-select>
@ -53,7 +53,7 @@
placeholder="请选择采购部门"
filterable
check-strictly
style="width: 100%"
class="w-full"
@change="handleDeptChange"
/>
</el-form-item>
@ -68,8 +68,8 @@
reserve-keyword
:remote-method="searchUsers"
:loading="userSelectLoading"
style="width: 100%"
@change="handleUserChange"
style="width: 100%"
>
<el-option
v-for="user in userList"
@ -199,17 +199,34 @@
:decimal-places="2"
:allow-negative="false"
:show-prefix="false"
/>
</template>
</el-table-column>
<el-table-column label="税率" prop="taxRatio" width="95px" align="center">
<template #default="scope">
<MoneyInput
v-model="scope.row.taxRatio"
:decimal-places="2"
:allow-negative="false"
:show-prefix="false"
placeholder="请输入"
@change="() => calculateTotal(scope.row)"
/>
</template>
</el-table-column>
<el-table-column label="含税总价" prop="totalPrice" width="150px" align="center">
<template #default="scope">
<el-input :model-value="formatTotalPrice(scope.row)" placeholder="自动计算" readonly />
<MoneyInput
v-model="scope.row.totalPrice"
:decimal-places="2"
:allow-negative="false"
:show-prefix="false"
placeholder="请输入"
@change="() => calculatePrice(scope.row)"
/>
</template>
</el-table-column>
<el-table-column label="单位" prop="unit" width="80px" align="center">
<el-table-column label="单位" prop="unit" width="70px" align="center">
<template #default="scope">
{{ getUnitName(scope.row.unit) }}
</template>
@ -219,7 +236,7 @@
<el-input v-model="scope.row.remark" placeholder="请输入" />
</template>
</el-table-column>
<el-table-column label="操作" width="80px" align="center">
<el-table-column label="操作" width="70px" align="center">
<template #default="scope" >
<el-button link type="danger" @click="removeItem(scope.$index)" >删除</el-button>
</template>
@ -420,17 +437,23 @@ const open = async (type: string, id?: number) => {
if (type === 'update' && id) {
formLoading.value = true
try {
const data = await PurOrderApi.getPurOrder(id)
const response = await PurOrderApi.getPurOrder(id)
// responseCommonResultdata
const data = response.data || response
//
if (!data || typeof data !== 'object') {
console.error('API响应数据格式异常:', response)
return
}
//
if (data.purDeptId) {
await searchUsers('')
} else {
await searchUsers('')
}
//
if (data.purEmpId && !userList.value.find((u: any) => u.id === data.purEmpId)) {
if (data.purEmpId) {
if (!userList.value.find((u: any) => u.id === data.purEmpId)) {
try {
const user = await UserApi.getUser(data.purEmpId)
if (user) {
@ -440,12 +463,30 @@ const open = async (type: string, id?: number) => {
console.error('加载当前采购人员失败', e)
}
}
}
//
Object.assign(formData, data)
//
if (formData.purDeptId) {
try {
const deptName = await getDeptSimpleName(formData.purDeptId)
formData.purDeptName = deptName
} catch (e) {
console.error('获取部门名称失败', e)
}
}
//
if (formData.purEmpId) {
try {
formData.purEmpName = await getUserNameById(formData.purEmpId)
} catch (e) {
console.error('获取采购人员名称失败', e)
}
}
//
const itemData = data.itemList
console.log('明细数据:', itemData)
@ -552,7 +593,7 @@ const removeItem = (index: number) => {
itemList.value.splice(index, 1)
}
//
//
const calculateTotal = (row: any) => {
if (!row) return
const qty = Number(row.purQty) || 0
@ -561,6 +602,18 @@ const calculateTotal = (row: any) => {
row.totalPrice = total > 0 ? total.toFixed(2) : '0.00'
}
//
const calculatePrice = (row: any) => {
if (!row) return
const total = Number(row.totalPrice) || 0
const qty = Number(row.purQty) || 0
// 0
if (qty > 0) {
const price = total / qty
row.priceTax = price > 0 ? price.toFixed(2) : '0.00'
}
}
//
const formatTotalPrice = (row: any) => {
if (!row) return ''

View File

@ -82,9 +82,9 @@
</ContentWrap>
<!-- 采购单信息 -->
<ContentWrap>
<ContentWrap style="height: calc(50vh - 150px);">
<div style="font-weight: bold; margin-bottom: 8px;">采购单信息</div>
<div style="display: flex; gap: 16px;">
<div style="display: flex; gap: 16px; height: calc(100% - 32px);">
<!-- 主表 -->
<div style="flex: 1;">
<el-table
@ -95,6 +95,7 @@
highlight-current-row
@row-click="handleRowClick"
@selection-change="handleSelectionChange"
max-height="100%"
>
<el-table-column type="selection" width="50px" align="center" />
<el-table-column label="序号" align="center" type="index" width="60px" />
@ -133,7 +134,7 @@
<el-button
link
type="danger"
v-if="scope.row.purStatus === '1'"
v-if="scope.row.purStatus === '1' || scope.row.purStatus === '4'"
@click.stop="handleDelete(scope.row.id)"
v-hasPermi="['biz:pur-order:delete']"
>
@ -162,7 +163,7 @@
</ContentWrap>
<!-- 采购物料信息 -->
<ContentWrap>
<ContentWrap style="height: calc(50vh - 100px);">
<div style="font-weight: bold; margin-bottom: 8px;">采购物料信息</div>
<el-table
v-loading="itemLoading"
@ -398,7 +399,7 @@ const getItemSummary = (param: any) => {
/** 初始化 */
onMounted(() => {
getList()
// getList()
})
</script>

View File

@ -71,9 +71,9 @@
</el-form>
</ContentWrap>
<!-- 表格区域主列表 + 明细表格上下各占一半 -->
<ContentWrap class="!p-15px">
<div style="display: flex; flex-direction: column; height: calc(100vh - 280px);">
<!-- 表格区域主列表 -->
<ContentWrap class="!p-15px" style="height: calc(50vh - 150px);">
<div style="display: flex; flex-direction: column; ">
<!-- 主列表 -->
<div style="flex: 1; min-height: 0;">
<div style="font-weight: bold; margin-bottom: 8px;">出库单列表</div>
@ -150,7 +150,9 @@
style="margin-top: 8px;"
/>
</div>
</div>
</ContentWrap>
<ContentWrap class="!p-15px" style="height: calc(50vh - 100px);">
<!-- 明细表格 -->
<div style="flex: 1; min-height: 0;" >
<div style="font-weight: bold; margin-bottom: 8px;">出库单明细</div>
@ -171,7 +173,6 @@
<el-table-column label="备注" align="center" prop="remark" />
</el-table>
</div>
</div>
</ContentWrap>
<!-- 表单弹窗添加/修改 -->
@ -332,6 +333,6 @@ const viewDetail = async (row: any) => {
/** 初始化 **/
onMounted(() => {
getList()
// getList()
})
</script>

View File

@ -102,7 +102,7 @@
</ContentWrap>
<!-- 列表 -->
<ContentWrap>
<ContentWrap style="height: calc(100vh - 240px);">
<el-table v-loading="loading" :data="list" :stripe="true" :show-overflow-tooltip="true" border @selection-change="handleSelectionChange">
<el-table-column type="selection" width="55px" />
<el-table-column label="序号" align="center" type="index" width="60px" fixed="left" />