taoge_xiaodi/td_official
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

合并

Browse Source
This commit is contained in:
Teo
2025-08-15 16:54:09 +08:00
parent 1e87b87bb9 a7b148bc96
commit 20b5d7d685
5 changed files with 591 additions and 651 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
.env.development
View File

@ -5,7 +5,7 @@ VITE_APP_TITLE = 新能源项目管理平台
VITE_APP_ENV = 'development'
# 开发环境
VITE_APP_BASE_API = 'http://192.168.110.163:8898'
VITE_APP_BASE_API = 'http://192.168.110.159:8898'
# 无人机接口地址

158
src/views/materials/usageMaterials/material/index.vue
View File

@ -1,73 +1,66 @@
<template>
<div class="min-h-screen bg-gray-50 flex flex-col">
<div class="p-5">
<!-- 主要内容区 -->
<main class="flex-1 p-6">
<!-- 操作栏 -->
<div class="bg-white rounded-lg shadow-sm p-4 mb-6 transition-all duration-300 hover:shadow-md">
<div class="flex flex-wrap items-center justify-between gap-4">
<!-- 操作按钮 -->
<div class="flex gap-2">
<el-button icon="Refresh" @click="refreshData" class="transition-all duration-200 hover:shadow-md">
刷新
</el-button>
</div>
</div>
</div>
<el-card class="mb-5">
<el-button icon="Refresh" @click="refreshData" class="transition-all duration-200 hover:shadow-md">
刷新
</el-button>
</el-card>
<!-- 数据表格 -->
<div class="bg-white rounded-lg shadow-sm overflow-hidden transition-all duration-300 hover:shadow-md">
<el-table v-loading="loading" :data="tableData" border stripe
:header-cell-style="{ 'background-color': '#f5f7fa', 'font-weight': 'bold' }"
:row-class-name="tableRowClassName">
<el-table-column prop="id" label="ID" width="80" align="center"></el-table-column>
<el-table-column prop="name" label="材料名称" min-width="150"></el-table-column>
<el-table-column prop="specification" label="规格" min-width="120"></el-table-column>
<el-table-column prop="supplier" label="供应商" min-width="150"></el-table-column>
<el-table-column prop="findType" label="类型" width="100" align="center">
<template #default="scope">
<el-tag :type="scope.row.findType === '1' ? 'success' : 'info'">
{{ scope.row.findType === '1' ? '采购' : '材料' }}
</el-tag>
</template>
</el-table-column>
<el-table-column prop="installationQuantity" label="安装量" width="100" align="center"></el-table-column>
<el-table-column prop="contractSigning" label="合同签订时间" width="180" align="center">
<template #default="scope">
{{ formatDate(scope.row.contractSigning) }}
</template>
</el-table-column>
<el-table-column prop="createTime" label="创建时间" width="180" align="center">
<template #default="scope">
{{ formatDate(scope.row.createTime) }}
</template>
</el-table-column>
<el-table-column label="操作" width="180" align="center" fixed="right">
<template #default="scope">
<!-- <el-button size="small" icon="Plus" @click="handleAddSon(scope.row)"
<!-- 数据表格 -->
<div class="bg-white rounded-lg shadow-sm overflow-hidden transition-all duration-300 hover:shadow-md">
<el-table v-loading="loading" :data="tableData" border stripe
:header-cell-style="{ 'background-color': '#f5f7fa', 'font-weight': 'bold' }"
style="width: 100%; margin-bottom: 20px; height: calc(100vh - 305px)"
:row-class-name="tableRowClassName">
<el-table-column prop="id" label="ID" width="80" align="center"></el-table-column>
<el-table-column prop="name" label="材料名称" min-width="150"></el-table-column>
<el-table-column prop="specification" label="规格" min-width="120"></el-table-column>
<el-table-column prop="supplier" label="供应商" min-width="150"></el-table-column>
<el-table-column prop="findType" label="类型" width="100" align="center">
<template #default="scope">
<el-tag :type="scope.row.findType === '1' ? 'success' : 'info'">
{{ scope.row.findType === '1' ? '采购' : '材料' }}
</el-tag>
</template>
</el-table-column>
<el-table-column prop="installationQuantity" label="安装量" width="100" align="center"></el-table-column>
<el-table-column prop="contractSigning" label="合同签订时间" width="180" align="center">
<template #default="scope">
{{ formatDate(scope.row.contractSigning) }}
</template>
</el-table-column>
<el-table-column prop="createTime" label="创建时间" width="180" align="center">
<template #default="scope">
{{ formatDate(scope.row.createTime) }}
</template>
</el-table-column>
<el-table-column label="操作" width="180" align="center" fixed="right">
<template #default="scope">
<!-- <el-button size="small" icon="Plus" @click="handleAddSon(scope.row)"
class="text-blue-600 hover:text-blue-800 transition-colors"></el-button> -->
<el-button size="small" icon="Edit" @click="handleEdit(scope.row)"
class="text-blue-600 hover:text-blue-800 transition-colors"></el-button>
<el-button size="small" icon="View" @click="jumpRouter(scope.row)"
class="text-blue-600 hover:text-blue-800 transition-colors"></el-button>
<el-button size="small" icon="Delete" @click="handleDelete(scope.row)"
class="text-red-600 hover:text-red-800 transition-colors"></el-button>
</template>
</el-table-column>
</el-table>
<el-button size="small" icon="Edit" @click="handleEdit(scope.row)"
class="text-blue-600 hover:text-blue-800 transition-colors"></el-button>
<el-button size="small" icon="View" @click="jumpRouter(scope.row)"
class="text-blue-600 hover:text-blue-800 transition-colors"></el-button>
<el-button size="small" icon="Delete" @click="handleDelete(scope.row)"
class="text-red-600 hover:text-red-800 transition-colors"></el-button>
</template>
</el-table-column>
</el-table>
<!-- 分页 -->
<div class="flex items-center justify-between p-4 border-t">
<div class="text-gray-500 text-sm">
共 {{ total }} 条记录，当前显示第 {{ (currentPage - 1) * pageSize + 1 }} 至 {{ Math.min(currentPage *
pageSize, total)
}} 条
</div>
<el-pagination v-model:current-page="currentPage" v-model:page-size="pageSize" :page-sizes="[10, 20, 50, 100]"
:total="total" layout="prev, pager, next, jumper, sizes" @size-change="handleSizeChange"
@current-change="handleCurrentChange"></el-pagination>
<!-- 分页 -->
<div class="flex items-center justify-between p-4 border-t">
<div class="text-gray-500 text-sm">
共 {{ total }} 条记录，当前显示第 {{ (currentPage - 1) * pageSize + 1 }} 至 {{ Math.min(currentPage *
pageSize, total)
}} 条
</div>
<el-pagination v-model:current-page="currentPage" v-model:page-size="pageSize" :page-sizes="[10, 20, 50, 100]"
:total="total" layout="prev, pager, next, jumper, sizes" @size-change="handleSizeChange"
@current-change="handleCurrentChange"></el-pagination>
</div>
</main>
</div>
<!-- 新增/编辑对话框 -->
<el-dialog v-model="dialogVisible" :title="dialogType === 'add' ? '新增记录' : '编辑记录'" :width="dialogWidth"
:fullscreen="isFullscreen" :before-close="handleDialogClose">
@ -150,24 +143,6 @@
</div>
</template>
</el-dialog>
<!-- 删除确认对话框 -->
<el-dialog v-model="deleteDialogVisible" title="确认删除" width="300px" :show-close="false">
<div class="text-center py-4">
<el-icon class="text-orange-500 text-4xl mb-3">
<WarningFilled />
</el-icon>
<p>确定要删除这条记录吗？</p>
<p class="text-gray-500 text-sm mt-2">此操作不可撤销，请谨慎操作</p>
</div>
<template #footer>
<div class="flex justify-center gap-2">
<el-button @click="deleteDialogVisible = false">取消</el-button>
<el-button type="danger" @click="confirmDelete" :loading="deleteLoading">
确认删除
</el-button>
</div>
</template>
</el-dialog>
</div>
</template>
@ -180,7 +155,6 @@ import { useRouter } from 'vue-router';
const userStore = useUserStoreHook();
const router = useRouter();
const currentProject = computed(() => userStore.selectedProject);
const { proxy } = getCurrentInstance();
import { useMaterialsQueryList, newMaterialsAdd, materialsEdit, materialsDel, queryMaterialsInfo } from "@/api/materials/usageMaterials/index";
// 表格数据相关
const tableData = ref([]);
@ -195,7 +169,6 @@ const dialogType = ref('add'); // add 或 edit
const dialogWidth = ref('70%');
const isFullscreen = ref(false);
const deleteDialogVisible = ref(false);
const deleteDialogVisible2 = ref(false);
const formRef = ref(null);
const formRef2 = ref(null);
const saveLoading = ref(false);
@ -339,7 +312,7 @@ const handleAddSon = (row) => {
type: 'warning',
}
).then(() => {
materialsEdit(formData).then(res=>{
materialsEdit(formData).then(res => {
let { code } = res
if (code === 200) {
ElMessage({
@ -360,7 +333,22 @@ const handleAddSon = (row) => {
// 删除
const handleDelete = (row) => {
currentRow.value = row;
deleteDialogVisible.value = true;
ElMessageBox.confirm(
'确定要删除这条记录吗？此操作不可撤销，请谨慎操作',
'提示',
{
confirmButtonText: '确认',
cancelButtonText: '取消',
type: 'warning',
}
).then(() => {
confirmDelete();
}).catch(() => {
ElMessage({
type: 'info',
message: '已取消删除',
})
})
};

364
src/views/materials/usageMaterials/material/indexSon.vue
View File

@ -1,183 +1,165 @@
<template>
<div class="bg-white rounded-lg shadow-sm p-4 mb-6 transition-all duration-300 hover:shadow-md">
<div class="flex flex-wrap items-center justify-between gap-4">
<!-- 操作按钮 -->
<div class="flex gap-2">
<el-button type="primary" icon="Plus" @click="handleAdd"
class="transition-all duration-200 hover:shadow-md">
新增
</el-button>
<el-button icon="Refresh" @click="refreshData" class="transition-all duration-200 hover:shadow-md">
刷新
</el-button>
</div>
</div>
</div>
<!-- 数据表格 -->
<el-table v-loading="loading2" :data="tableData" stripe
:header-cell-style="{ 'background-color': '#f5f7fa', 'font-weight': 'bold' }"
:row-class-name="tableRowClassName" style="width: 100%">
<!-- 基础信息列 -->
<el-table-column prop="id" label="ID" width="80" align="center"></el-table-column>
<el-table-column prop="batch" label="批次" min-width="100"></el-table-column>
<el-table-column prop="physicalsupplyId" label="使用情况ID" width="120" align="center"></el-table-column>
<!-- 时间相关列 -->
<el-table-column prop="issuanceTime" label="联系单下达时间" min-width="160" align="center">
<template #default="scope">
{{ formatDate(scope.row.issuanceTime) }}
</template>
</el-table-column>
<el-table-column prop="requireDelivery" label="要求到货时间" min-width="160" align="center">
<template #default="scope">
{{ formatDate(scope.row.requireDelivery) }}
</template>
</el-table-column>
<el-table-column prop="scheduledDelivery" label="计划到货时间" min-width="160" align="center">
<template #default="scope">
{{ formatDate(scope.row.scheduledDelivery) }}
</template>
</el-table-column>
<el-table-column prop="actualDelivery" label="实际到货时间" min-width="160" align="center">
<template #default="scope">
{{ formatDate(scope.row.actualDelivery) }}
</template>
</el-table-column>
<el-table-column prop="acceptanceCheck" label="验收移交时间" min-width="160" align="center">
<template #default="scope">
{{ formatDate(scope.row.acceptanceCheck) }}
</template>
</el-table-column>
<!-- 数量相关列 -->
<el-table-column prop="requiredQuantity" label="要求到货数量" min-width="120" align="right"></el-table-column>
<el-table-column prop="plannedQuantity" label="计划到货数量" min-width="120" align="right"></el-table-column>
<el-table-column prop="actualAcceptance" label="实际验收数量" min-width="120" align="right"></el-table-column>
<el-table-column prop="differenceQuantity" label="差异量" min-width="100" align="right">
<template #default="scope">
<span
:class="scope.row.differenceQuantity && parseFloat(scope.row.differenceQuantity) !== 0 ? 'text-red-500' : ''">
{{ scope.row.differenceQuantity || '-' }}
</span>
</template>
</el-table-column>
<el-table-column prop="dhDifferenceQuantity" label="到货差异量" min-width="120" align="right"></el-table-column>
<!-- 金额相关列 -->
<el-table-column prop="cargoAmount" label="货物金额" min-width="120" align="right">
<template #default="scope">
{{ scope.row.cargoAmount }}
</template>
</el-table-column>
<el-table-column prop="advance" label="预付款" min-width="100" align="right">
<template #default="scope">
{{ scope.row.advance }}
</template>
</el-table-column>
<el-table-column prop="feed" label="投料款" min-width="100" align="right">
<template #default="scope">
{{ scope.row.feed }}
</template>
</el-table-column>
<el-table-column prop="acceptancePayment" label="到货验收款" min-width="120" align="right">
<template #default="scope">
{{ scope.row.acceptancePayment }}
</template>
</el-table-column>
<el-table-column prop="debugging" label="调试款" min-width="100" align="right">
<template #default="scope">
{{ scope.row.debugging }}
</template>
</el-table-column>
<el-table-column prop="qualityGuarantee" label="质保金" min-width="100" align="right">
<template #default="scope">
{{ scope.row.qualityGuarantee }}
</template>
</el-table-column>
<el-table-column prop="settlementAmount" label="结算金额" min-width="120" align="right">
<template #default="scope">
{{ scope.row.settlementAmount }}
</template>
</el-table-column>
<!-- 状态和备注列 -->
<el-table-column prop="expectedState" label="逾期状态" min-width="100" align="center">
<template #default="scope">
<!-- :type="getTagType(scope.row.expectedState)" -->
<el-tag :effect="scope.row.expectedState ? 'dark' : 'plain'">
{{ scope.row.expectedState || '-' }}
</el-tag>
</template>
</el-table-column>
<el-table-column prop="associate" label="交接方式" min-width="120"></el-table-column>
<el-table-column prop="deliveryRequirements" label="到货要求" min-width="150"></el-table-column>
<el-table-column prop="transition" label="转换为合同" min-width="120" align="center">
<!-- <template #default="scope"> -->
<!-- <el-switch v-model="scope.row.transition" active-value="是" inactive-value="否"
@change="handleTransitionChange(scope.row)"></el-switch> -->
<!-- </template> -->
</el-table-column>
<!-- 备注信息列（可展开） -->
<el-table-column label="备注信息" min-width="120">
<template #default="scope">
<el-popover placement="top" width="300" trigger="click">
<template #reference>
<el-button size="small" type="text">查看详情</el-button>
<div class="p-5">
<el-card class="mb-5">
<el-button type="primary" icon="Plus" @click="handleAdd"
class="transition-all duration-200 hover:shadow-md">
新增
</el-button>
<el-button icon="Refresh" @click="refreshData" class="transition-all duration-200 hover:shadow-md">
刷新
</el-button>
</el-card>
<div class="bg-white rounded-lg shadow-sm overflow-hidden transition-all duration-300 hover:shadow-md">
<!-- 数据表格 -->
<el-table v-loading="loading" :data="tableData" stripe
:header-cell-style="{ 'background-color': '#f5f7fa', 'font-weight': 'bold' }"
style="width: 100%; margin-bottom: 20px; height: calc(100vh - 305px)"
:row-class-name="tableRowClassName">
<!-- 基础信息列 -->
<el-table-column prop="id" label="ID" width="180" align="center"></el-table-column>
<el-table-column prop="batch" label="批次" align="center"></el-table-column>
<el-table-column prop="physicalsupplyId" label="使用情况ID" width="180" align="center"></el-table-column>
<!-- 时间相关列 -->
<el-table-column prop="issuanceTime" label="联系单下达时间" min-width="160" align="center">
<template #default="scope">
{{ formatDate(scope.row.issuanceTime) }}
</template>
<div class="space-y-2 text-sm">
<p><span class="font-medium">采购备注：</span>{{ scope.row.cgRemark || '-' }}
</p>
<p><span class="font-medium">到货备注：</span>{{ scope.row.dhRemark || '-' }}
</p>
<p><span class="font-medium">供应商备注：</span>{{ scope.row.gysRemark || '-'
}}</p>
<p><span class="font-medium">结算备注：</span>{{ scope.row.jsRemark || '-' }}
</p>
</div>
</el-popover>
</template>
</el-table-column>
</el-table-column>
<el-table-column prop="requireDelivery" label="要求到货时间" min-width="160" align="center">
<template #default="scope">
{{ formatDate(scope.row.requireDelivery) }}
</template>
</el-table-column>
<el-table-column prop="scheduledDelivery" label="计划到货时间" min-width="160" align="center">
<template #default="scope">
{{ formatDate(scope.row.scheduledDelivery) }}
</template>
</el-table-column>
<el-table-column prop="actualDelivery" label="实际到货时间" min-width="160" align="center">
<template #default="scope">
{{ formatDate(scope.row.actualDelivery) }}
</template>
</el-table-column>
<el-table-column prop="acceptanceCheck" label="验收移交时间" min-width="160" align="center">
<template #default="scope">
{{ formatDate(scope.row.acceptanceCheck) }}
</template>
</el-table-column>
<!-- 操作列 -->
<el-table-column label="操作" min-width="120" align="center" fixed="right">
<template #default="scope">
<el-button size="small" icon="Edit" @click="handleEdit2(scope.row)"
class="text-blue-600 hover:text-blue-800 transition-colors"></el-button>
<el-button size="small" icon="Delete" @click="handleDelete2(scope.row)"
class="text-red-600 hover:text-red-800 transition-colors"></el-button>
</template>
</el-table-column>
</el-table>
<!-- 数量相关列 -->
<el-table-column prop="requiredQuantity" label="要求到货数量" min-width="120" align="right"></el-table-column>
<el-table-column prop="plannedQuantity" label="计划到货数量" min-width="120" align="right"></el-table-column>
<el-table-column prop="actualAcceptance" label="实际验收数量" min-width="120" align="right"></el-table-column>
<el-table-column prop="differenceQuantity" label="差异量" min-width="100" align="right">
<template #default="scope">
<span
:class="scope.row.differenceQuantity && parseFloat(scope.row.differenceQuantity) !== 0 ? 'text-red-500' : ''">
{{ scope.row.differenceQuantity || '-' }}
</span>
</template>
</el-table-column>
<el-table-column prop="dhDifferenceQuantity" label="到货差异量" min-width="120"
align="right"></el-table-column>
<!-- 分页 -->
<div class="flex flex-wrap items-center justify-between p-4 border-t gap-4">
<div class="text-gray-500 text-sm">
共 {{ total }} 条记录，当前显示第 {{ (currentPage - 1) * pageSize + 1 }} 至 {{
Math.min(currentPage * pageSize, total)
}} 条
</div>
<el-pagination v-model:current-page="currentPage" v-model:page-size="pageSize" :page-sizes="[10, 20, 50, 100]"
:total="total" layout="prev, pager, next, jumper, sizes" @size-change="handleSizeChange"
@current-change="handleCurrentChange" small></el-pagination>
</div>
<!-- 删除确认对话框 -->
<el-dialog v-model="deleteDialogVisible2" title="确认删除" width="300px" :show-close="false">
<div class="text-center py-4">
<el-icon class="text-orange-500 text-4xl mb-3">
<WarningFilled />
</el-icon>
<p>确定要删除这条记录吗？</p>
<p class="text-gray-500 text-sm mt-2">此操作不可撤销，请谨慎操作</p>
</div>
<template #footer>
<div class="flex justify-center gap-2">
<el-button @click="deleteDialogVisible2 = false">取消</el-button>
<el-button type="danger" @click="confirmDelete2" :loading="deleteLoading">
确认删除
</el-button>
<!-- 金额相关列 -->
<el-table-column prop="cargoAmount" label="货物金额" min-width="120" align="right">
<template #default="scope">
{{ scope.row.cargoAmount }}
</template>
</el-table-column>
<el-table-column prop="advance" label="预付款" min-width="100" align="right">
<template #default="scope">
{{ scope.row.advance }}
</template>
</el-table-column>
<el-table-column prop="feed" label="投料款" min-width="100" align="right">
<template #default="scope">
{{ scope.row.feed }}
</template>
</el-table-column>
<el-table-column prop="acceptancePayment" label="到货验收款" min-width="120" align="right">
<template #default="scope">
{{ scope.row.acceptancePayment }}
</template>
</el-table-column>
<el-table-column prop="debugging" label="调试款" min-width="100" align="right">
<template #default="scope">
{{ scope.row.debugging }}
</template>
</el-table-column>
<el-table-column prop="qualityGuarantee" label="质保金" min-width="100" align="right">
<template #default="scope">
{{ scope.row.qualityGuarantee }}
</template>
</el-table-column>
<el-table-column prop="settlementAmount" label="结算金额" min-width="120" align="right">
<template #default="scope">
{{ scope.row.settlementAmount }}
</template>
</el-table-column>
<!-- 状态和备注列 -->
<el-table-column prop="expectedState" label="逾期状态" min-width="100" align="center">
<template #default="scope">
<!-- :type="getTagType(scope.row.expectedState)" -->
<el-tag :effect="scope.row.expectedState ? 'dark' : 'plain'">
{{ scope.row.expectedState || '-' }}
</el-tag>
</template>
</el-table-column>
<el-table-column prop="associate" label="交接方式" min-width="120"></el-table-column>
<el-table-column prop="deliveryRequirements" label="到货要求" min-width="150"></el-table-column>
<el-table-column prop="transition" label="转换为合同" min-width="120" align="center">
<!-- <template #default="scope"> -->
<!-- <el-switch v-model="scope.row.transition" active-value="是" inactive-value="否"
@change="handleTransitionChange(scope.row)"></el-switch> -->
<!-- </template> -->
</el-table-column>
<!-- 备注信息列（可展开） -->
<el-table-column label="备注信息" min-width="120">
<template #default="scope">
<el-popover placement="top" width="300" trigger="click">
<template #reference>
<el-button size="small" type="text">查看详情</el-button>
</template>
<div class="space-y-2 text-sm">
<p><span class="font-medium">采购备注：</span>{{ scope.row.cgRemark || '-' }}
</p>
<p><span class="font-medium">到货备注：</span>{{ scope.row.dhRemark || '-' }}
</p>
<p><span class="font-medium">供应商备注：</span>{{ scope.row.gysRemark || '-'
}}</p>
<p><span class="font-medium">结算备注：</span>{{ scope.row.jsRemark || '-' }}
</p>
</div>
</el-popover>
</template>
</el-table-column>
<!-- 操作列 -->
<el-table-column label="操作" min-width="120" align="center" fixed="right">
<template #default="scope">
<el-button size="small" icon="Edit" @click="handleEdit2(scope.row)"
class="text-blue-600 hover:text-blue-800 transition-colors"></el-button>
<el-button size="small" icon="Delete" @click="handleDelete2(scope.row)"
class="text-red-600 hover:text-red-800 transition-colors"></el-button>
</template>
</el-table-column>
</el-table>
<!-- 分页 -->
<div class="flex flex-wrap items-center justify-between p-4 border-t gap-4">
<div class="text-gray-500 text-sm">
共 {{ total }} 条记录，当前显示第 {{ (currentPage - 1) * pageSize + 1 }} 至 {{
Math.min(currentPage * pageSize, total)
}} 条
</div>
<el-pagination v-model:current-page="currentPage" v-model:page-size="pageSize"
:page-sizes="[10, 20, 50, 100]" :total="total" layout="prev, pager, next, jumper, sizes"
@size-change="handleSizeChange" @current-change="handleCurrentChange" small></el-pagination>
</div>
</template>
</el-dialog>
</div>
</div>
<el-dialog v-model="dialogVisible2" :title="dialogType2 === 'addSon' ? '新增采购信息' : '编辑采购信息'" :width="dialogWidth"
:fullscreen="isFullscreen" :close-on-click-modal="false" :before-close="handleClose" destroy-on-close>
<!-- 表单内容 -->
@ -397,7 +379,7 @@ const dialogType2 = ref('addSon'); // add 或 edit
const deleteDialogVisible2 = ref(false);
const currentRow2 = ref(null);
const tableData = ref([]);
const loading2 = ref(false);
const loading = ref(false);
const submitLoading = ref(false);
const routeParams = ref({})
const currentPage = ref(1);
@ -409,7 +391,7 @@ const tableRowClassName = ({ row, rowIndex }) => {
return rowIndex % 2 === 0 ? 'bg-white' : 'bg-gray-50';
};
const form = reactive({
id: '',
id: '',
acceptanceCheck: '',
acceptancePayment: '',
actualAcceptance: '',
@ -441,7 +423,7 @@ const form = reactive({
updateBy: null,
updateTime: ''
});
const handleAdd = ()=>{
const handleAdd = () => {
dialogVisible2.value = true;
dialogType2.value = 'addSon';
resetForm();
@ -477,9 +459,24 @@ const handleEdit2 = (row) => {
};
const handleDelete2 = (row) => {
currentRow2.value = row;
deleteDialogVisible2.value = true;
ElMessageBox.confirm(
'确定要删除这条记录吗？此操作不可撤销，请谨慎操作',
'提示',
{
confirmButtonText: '确认',
cancelButtonText: '取消',
type: 'warning',
}
).then(() => {
confirmDelete();
}).catch(() => {
ElMessage({
type: 'info',
message: '已取消删除',
})
})
};
const confirmDelete2 = async () => {
const confirmDelete = async () => {
if (!currentRow2.value) return;
deleteLoading.value = true;
@ -540,9 +537,14 @@ const handleSubmit = async () => {
}
};
const materialsUsageDetails1 = () => {
loading.value = true;
materialsUsageDetails({ physicalsupplyId: routeParams.value.id }).then(res => {
tableData.value = res.rows
})
}).catch(() => {
loading.value = false;
}).finally(() => {
loading.value = false;
})
}
// 格式化日期
const formatDate = (dateString) => {

381
src/views/materials/usageMaterials/purchase/index.vue
View File

@ -1,215 +1,157 @@
<template>
<div class="min-h-screen bg-gray-50 flex flex-col">
<!-- 主要内容区 -->
<main class="flex-1 p-6">
<!-- 操作栏 -->
<div class="bg-white rounded-lg shadow-sm p-4 mb-6 transition-all duration-300 hover:shadow-md">
<div class="flex flex-wrap items-center justify-between gap-4">
<!-- 操作按钮 -->
<div class="flex gap-2">
<el-button type="primary" icon="Plus" @click="handleAdd" class="transition-all duration-200 hover:shadow-md"> 新增 </el-button>
<el-button icon="Refresh" @click="refreshData" class="transition-all duration-200 hover:shadow-md"> 刷新 </el-button>
</div>
<div style="padding: 20px;">
<el-card class="mb-5">
<el-button type="primary" icon="Plus" @click="handleAdd" class="transition-all duration-200 hover:shadow-md">
新增
</el-button>
<el-button icon="Refresh" @click="refreshData" class="transition-all duration-200 hover:shadow-md"> 刷新
</el-button>
</el-card>
<!-- 数据表格 -->
<div class="bg-white rounded-lg shadow-sm overflow-hidden transition-all duration-300 hover:shadow-md">
<el-table v-loading="loading" :data="tableData" border stripe
style="width: 100%; margin-bottom: 20px; height: calc(100vh - 305px)"
:header-cell-style="{ 'background-color': '#f5f7fa', 'font-weight': 'bold' }"
:row-class-name="tableRowClassName">
<el-table-column prop="id" label="ID" width="180" align="center"></el-table-column>
<el-table-column prop="name" label="材料名称" align="center"></el-table-column>
<el-table-column prop="specification" label="规格" align="center"></el-table-column>
<el-table-column prop="supplier" label="供应商" align="center"></el-table-column>
<el-table-column prop="findType" label="类型" align="center">
<template #default="scope">
<el-tag :type="scope.row.findType === '1' ? 'success' : 'info'">
{{ scope.row.findType === '1' ? '采购' : '材料' }}
</el-tag>
</template>
</el-table-column>
<el-table-column prop="installationQuantity" label="安装量" align="center"></el-table-column>
<el-table-column prop="contractSigning" label="合同签订时间" width="180" align="center">
<template #default="scope">
{{ formatDate(scope.row.contractSigning) }}
</template>
</el-table-column>
<el-table-column prop="createTime" label="创建时间" width="180" align="center">
<template #default="scope">
{{ formatDate(scope.row.createTime) }}
</template>
</el-table-column>
<el-table-column label="操作" width="240" align="center" fixed="right">
<template #default="scope">
<el-button size="small" icon="Plus" @click="handleAddSon(scope.row)"
class="text-blue-600 hover:text-blue-800 transition-colors"></el-button>
<el-button size="small" icon="Edit" @click="handleEdit(scope.row)"
class="text-blue-600 hover:text-blue-800 transition-colors"></el-button>
<el-button size="small" icon="View" @click="jumpRouter(scope.row)"
class="text-blue-600 hover:text-blue-800 transition-colors"></el-button>
<el-button size="small" icon="Delete" @click="handleDelete(scope.row)"
class="text-red-600 hover:text-red-800 transition-colors"></el-button>
</template>
</el-table-column>
</el-table>
<!-- 分页 -->
<div class="flex items-center justify-between p-4 border-t">
<div class="text-gray-500 text-sm">
共 {{ total }} 条记录，当前显示第 {{ (currentPage - 1) * pageSize + 1 }} 至 {{ Math.min(currentPage * pageSize, total)
}} 条
</div>
<el-pagination v-model:current-page="currentPage" v-model:page-size="pageSize" :page-sizes="[10, 20, 50, 100]"
:total="total" layout="prev, pager, next, jumper, sizes" @size-change="handleSizeChange"
@current-change="handleCurrentChange"></el-pagination>
</div>
<!-- 数据表格 -->
<div class="bg-white rounded-lg shadow-sm overflow-hidden transition-all duration-300 hover:shadow-md">
<el-table
v-loading="loading"
:data="tableData"
border
stripe
:header-cell-style="{ 'background-color': '#f5f7fa', 'font-weight': 'bold' }"
:row-class-name="tableRowClassName"
>
<el-table-column prop="id" label="ID" width="80" align="center"></el-table-column>
<el-table-column prop="name" label="材料名称" min-width="150"></el-table-column>
<el-table-column prop="specification" label="规格" min-width="120"></el-table-column>
<el-table-column prop="supplier" label="供应商" min-width="150"></el-table-column>
<el-table-column prop="findType" label="类型" width="100" align="center">
<template #default="scope">
<el-tag :type="scope.row.findType === '1' ? 'success' : 'info'">
{{ scope.row.findType === '1' ? '采购' : '材料' }}
</el-tag>
</template>
</el-table-column>
<el-table-column prop="installationQuantity" label="安装量" width="100" align="center"></el-table-column>
<el-table-column prop="contractSigning" label="合同签订时间" width="180" align="center">
<template #default="scope">
{{ formatDate(scope.row.contractSigning) }}
</template>
</el-table-column>
<el-table-column prop="createTime" label="创建时间" width="180" align="center">
<template #default="scope">
{{ formatDate(scope.row.createTime) }}
</template>
</el-table-column>
<el-table-column label="操作" width="240" align="center" fixed="right">
<template #default="scope">
<el-button
size="small"
icon="Plus"
@click="handleAddSon(scope.row)"
class="text-blue-600 hover:text-blue-800 transition-colors"
></el-button>
<el-button
size="small"
icon="Edit"
@click="handleEdit(scope.row)"
class="text-blue-600 hover:text-blue-800 transition-colors"
></el-button>
<el-button
size="small"
icon="View"
@click="jumpRouter(scope.row)"
class="text-blue-600 hover:text-blue-800 transition-colors"
></el-button>
<el-button
size="small"
icon="Delete"
@click="handleDelete(scope.row)"
class="text-red-600 hover:text-red-800 transition-colors"
></el-button>
</template>
</el-table-column>
</el-table>
<!-- 分页 -->
<div class="flex items-center justify-between p-4 border-t">
<div class="text-gray-500 text-sm">
共 {{ total }} 条记录，当前显示第 {{ (currentPage - 1) * pageSize + 1 }} 至 {{ Math.min(currentPage * pageSize, total) }} 条
</div>
<el-pagination
v-model:current-page="currentPage"
v-model:page-size="pageSize"
:page-sizes="[10, 20, 50, 100]"
:total="total"
layout="prev, pager, next, jumper, sizes"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
></el-pagination>
</div>
</div>
</main>
<!-- 新增/编辑对话框 -->
<el-dialog
v-model="dialogVisible"
:title="dialogType === 'add' ? '新增记录' : '编辑记录'"
:width="dialogWidth"
:fullscreen="isFullscreen"
:before-close="handleDialogClose"
>
<el-form ref="formRef" :model="formData" :rules="formRules" label-width="120px" class="space-y-4">
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="材料名称" prop="name">
<el-input v-model="formData.name" placeholder="请输入材料名称"></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="规格" prop="specification">
<el-input v-model="formData.specification" placeholder="请输入规格"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="供应商" prop="supplier">
<el-input v-model="formData.supplier" placeholder="请输入供应商"></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="运算周期(天)" prop="executionCycle">
<el-input v-model.number="formData.executionCycle" placeholder="请输入运算周期" type="number"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="安装量" prop="installationQuantity">
<el-input v-model="formData.installationQuantity" placeholder="请输入安装量"></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="安装比例" prop="installationRatio">
<el-input v-model="formData.installationRatio" placeholder="请输入安装比例" suffix="%"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="合同签订时间" prop="contractSigning">
<el-date-picker
v-model="formData.contractSigning"
type="datetime"
placeholder="选择合同签订时间"
value-format="YYYY-MM-DD HH:mm:ss"
></el-date-picker>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="生产周期(天)" prop="productionPhase">
<el-input v-model.number="formData.productionPhase" placeholder="请输入生产周期" type="number"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="24">
<el-form-item label="供货要求" prop="supplyRequirements">
<el-input v-model="formData.supplyRequirements" placeholder="请输入供货要求" type="textarea" rows="3"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="24">
<el-form-item label="备注" prop="remark">
<el-input v-model="formData.remark" placeholder="请输入备注信息" type="textarea" rows="3"></el-input>
</el-form-item>
</el-col>
</el-row>
</el-form>
<template #footer>
<div class="flex justify-end gap-2">
<el-button @click="dialogVisible = false">取消</el-button>
<el-button type="primary" @click="handleSave" :loading="saveLoading"> 保存 </el-button>
</div>
</template>
</el-dialog>
<!-- 删除确认对话框 -->
<el-dialog v-model="deleteDialogVisible" title="确认删除" width="300px" :show-close="false">
<div class="text-center py-4">
<el-icon class="text-orange-500 text-4xl mb-3">
<WarningFilled />
</el-icon>
<p>确定要删除这条记录吗？</p>
<p class="text-gray-500 text-sm mt-2">此操作不可撤销，请谨慎操作</p>
</div>
<template #footer>
<div class="flex justify-center gap-2">
<el-button @click="deleteDialogVisible = false">取消</el-button>
<el-button type="danger" @click="confirmDelete" :loading="deleteLoading"> 确认删除 </el-button>
</div>
</template>
</el-dialog>
</div>
</div>
<!-- 新增/编辑对话框 -->
<el-dialog v-model="dialogVisible" :title="dialogType === 'add' ? '新增记录' : '编辑记录'" :width="dialogWidth"
:fullscreen="isFullscreen" :before-close="handleDialogClose">
<el-form ref="formRef" :model="formData" :rules="formRules" label-width="120px" class="space-y-4">
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="材料名称" prop="name">
<el-input v-model="formData.name" placeholder="请输入材料名称"></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="规格" prop="specification">
<el-input v-model="formData.specification" placeholder="请输入规格"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="供应商" prop="supplier">
<el-input v-model="formData.supplier" placeholder="请输入供应商"></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="运算周期(天)" prop="executionCycle">
<el-input v-model.number="formData.executionCycle" placeholder="请输入运算周期" type="number"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="安装量" prop="installationQuantity">
<el-input v-model="formData.installationQuantity" placeholder="请输入安装量"></el-input>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="安装比例" prop="installationRatio">
<el-input v-model="formData.installationRatio" placeholder="请输入安装比例" suffix="%"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="12">
<el-form-item label="合同签订时间" prop="contractSigning">
<el-date-picker v-model="formData.contractSigning" type="datetime" placeholder="选择合同签订时间"
value-format="YYYY-MM-DD HH:mm:ss"></el-date-picker>
</el-form-item>
</el-col>
<el-col :span="12">
<el-form-item label="生产周期(天)" prop="productionPhase">
<el-input v-model.number="formData.productionPhase" placeholder="请输入生产周期" type="number"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="24">
<el-form-item label="供货要求" prop="supplyRequirements">
<el-input v-model="formData.supplyRequirements" placeholder="请输入供货要求" type="textarea" :rows="3"></el-input>
</el-form-item>
</el-col>
</el-row>
<el-row :gutter="20">
<el-col :span="24">
<el-form-item label="备注" prop="remark">
<el-input v-model="formData.remark" placeholder="请输入备注信息" type="textarea" :rows="3"></el-input>
</el-form-item>
</el-col>
</el-row>
</el-form>
<template #footer>
<div class="flex justify-end gap-2">
<el-button @click="dialogVisible = false">取消</el-button>
<el-button type="primary" @click="handleSave" :loading="saveLoading"> 保存 </el-button>
</div>
</template>
</el-dialog>
</template>
<script setup>
import { ref, reactive, onMounted, computed, toRaw } from 'vue';
import { ElMessage, ElMessageBox } from 'element-plus';
import { WarningFilled } from '@element-plus/icons-vue';
import { useUserStoreHook } from '@/store/modules/user';
import { useRouter } from 'vue-router';
const userStore = useUserStoreHook();
const router = useRouter();
const currentProject = computed(() => userStore.selectedProject);
const { proxy } = getCurrentInstance();
import { useMaterialsQueryList, newMaterialsAdd, materialsEdit, materialsDel, queryMaterialsInfo } from '@/api/materials/usageMaterials/index';
// 表格数据相关
const tableData = ref([]);
@ -230,13 +172,9 @@ const dialogType = ref('add'); // add 或 edit
const dialogWidth = ref('70%');
const isFullscreen = ref(false);
const deleteDialogVisible = ref(false);
const deleteDialogVisible2 = ref(false);
const formRef = ref(null);
const formRef2 = ref(null);
const saveLoading = ref(false);
const deleteLoading = ref(false);
const currentRow = ref(null);
const submitLoading = ref(false);
// 表单数据
const formData = reactive({
@ -306,12 +244,11 @@ const fetchData = async () => {
tableData.value = res.rows;
total.value = res.total;
loading.value = false;
} catch (error) {
ElMessage.error('获取数据失败：' + error.message);
console.error(error);
} finally {
loading.value = false;
loading.value = false;//
}
};
@ -392,7 +329,22 @@ const handleAddSon = (row) => {
// 删除
const handleDelete = (row) => {
currentRow.value = row;
deleteDialogVisible.value = true;
ElMessageBox.confirm(
'确定要删除这条记录吗？此操作不可撤销，请谨慎操作',
'提示',
{
confirmButtonText: '确认',
cancelButtonText: '取消',
type: 'warning',
}
).then(() => {
confirmDelete();
}).catch(() => {
ElMessage({
type: 'info',
message: '已取消删除',
})
})
};
// 确认删除
@ -475,23 +427,6 @@ const resetForm = () => {
formData.findType = 1;
formData.id = '';
};
// 重置表单
const resetForm2 = () => {
if (formRef.value) {
formRef.value.resetFields();
}
// 重置表单数据
Object.keys(form).forEach((key) => {
form[key] = '';
});
// 设置默认值
form.findType = 1;
form.id = '';
};
// 提交表单
// 关闭对话框
const handleDialogClose = () => {
resetForm();
@ -516,7 +451,7 @@ onMounted(() => {
<style scoped>
/* 自定义表格行悬停样式 */
::v-deep .el-table__row:hover > td {
::v-deep .el-table__row:hover>td {
background-color: #f0f7ff !important;
}

337
src/views/materials/usageMaterials/purchase/indexSon.vue
View File

@ -1,165 +1,165 @@
<template>
<div class="bg-white rounded-lg shadow-sm p-4 mb-6 transition-all duration-300 hover:shadow-md">
<div class="flex flex-wrap items-center justify-between gap-4">
<!-- 操作按钮 -->
<div class="flex gap-2">
<el-button type="primary" icon="Plus" @click="handleAdd"
class="transition-all duration-200 hover:shadow-md">
新增
</el-button>
<el-button icon="Refresh" @click="refreshData" class="transition-all duration-200 hover:shadow-md">
刷新
</el-button>
<div class="p-5">
<el-card class="mb-5">
<el-button type="primary" icon="Plus" @click="handleAdd"
class="transition-all duration-200 hover:shadow-md">
新增
</el-button>
<el-button icon="Refresh" @click="refreshData" class="transition-all duration-200 hover:shadow-md">
刷新
</el-button>
</el-card>
<!-- 数据表格 -->
<div class="bg-white rounded-lg shadow-sm overflow-hidden transition-all duration-300 hover:shadow-md">
<el-table v-loading="loading2" :data="tableData" stripe
:header-cell-style="{ 'background-color': '#f5f7fa', 'font-weight': 'bold' }"
style="width: 100%; margin-bottom: 20px; height: calc(100vh - 305px)"
:row-class-name="tableRowClassName">
<!-- 基础信息列 -->
<el-table-column prop="id" label="ID" width="180" align="center"></el-table-column>
<el-table-column prop="batch" label="批次" align="center"></el-table-column>
<el-table-column prop="physicalsupplyId" label="使用情况ID" align="center"></el-table-column>
<!-- 时间相关列 -->
<el-table-column prop="issuanceTime" label="联系单下达时间" min-width="160" align="center">
<template #default="scope">
{{ formatDate(scope.row.issuanceTime) }}
</template>
</el-table-column>
<el-table-column prop="requireDelivery" label="要求到货时间" min-width="160" align="center">
<template #default="scope">
{{ formatDate(scope.row.requireDelivery) }}
</template>
</el-table-column>
<el-table-column prop="scheduledDelivery" label="计划到货时间" min-width="160" align="center">
<template #default="scope">
{{ formatDate(scope.row.scheduledDelivery) }}
</template>
</el-table-column>
<el-table-column prop="actualDelivery" label="实际到货时间" min-width="160" align="center">
<template #default="scope">
{{ formatDate(scope.row.actualDelivery) }}
</template>
</el-table-column>
<el-table-column prop="acceptanceCheck" label="验收移交时间" min-width="160" align="center">
<template #default="scope">
{{ formatDate(scope.row.acceptanceCheck) }}
</template>
</el-table-column>
<!-- 数量相关列 -->
<el-table-column prop="requiredQuantity" label="要求到货数量" min-width="120" align="right"></el-table-column>
<el-table-column prop="plannedQuantity" label="计划到货数量" min-width="120" align="right"></el-table-column>
<el-table-column prop="actualAcceptance" label="实际验收数量" min-width="120" align="right"></el-table-column>
<el-table-column prop="differenceQuantity" label="差异量" min-width="100" align="right">
<template #default="scope">
<span
:class="scope.row.differenceQuantity && parseFloat(scope.row.differenceQuantity) !== 0 ? 'text-red-500' : ''">
{{ scope.row.differenceQuantity || '-' }}
</span>
</template>
</el-table-column>
<el-table-column prop="dhDifferenceQuantity" label="到货差异量" min-width="120"
align="right"></el-table-column>
<!-- 金额相关列 -->
<el-table-column prop="cargoAmount" label="货物金额" min-width="120" align="right">
<template #default="scope">
{{ scope.row.cargoAmount }}
</template>
</el-table-column>
<el-table-column prop="advance" label="预付款" min-width="100" align="right">
<template #default="scope">
{{ scope.row.advance }}
</template>
</el-table-column>
<el-table-column prop="feed" label="投料款" min-width="100" align="right">
<template #default="scope">
{{ scope.row.feed }}
</template>
</el-table-column>
<el-table-column prop="acceptancePayment" label="到货验收款" min-width="120" align="right">
<template #default="scope">
{{ scope.row.acceptancePayment }}
</template>
</el-table-column>
<el-table-column prop="debugging" label="调试款" min-width="100" align="right">
<template #default="scope">
{{ scope.row.debugging }}
</template>
</el-table-column>
<el-table-column prop="qualityGuarantee" label="质保金" min-width="100" align="right">
<template #default="scope">
{{ scope.row.qualityGuarantee }}
</template>
</el-table-column>
<el-table-column prop="settlementAmount" label="结算金额" min-width="120" align="right">
<template #default="scope">
{{ scope.row.settlementAmount }}
</template>
</el-table-column>
<!-- 状态和备注列 -->
<el-table-column prop="expectedState" label="逾期状态" min-width="100" align="center">
<template #default="scope">
<!-- :type="getTagType(scope.row.expectedState)" -->
<el-tag :effect="scope.row.expectedState ? 'dark' : 'plain'">
{{ scope.row.expectedState || '-' }}
</el-tag>
</template>
</el-table-column>
<el-table-column prop="associate" label="交接方式" min-width="120"></el-table-column>
<el-table-column prop="deliveryRequirements" label="到货要求" min-width="150"></el-table-column>
<el-table-column prop="transition" label="转换为合同" min-width="120" align="center">
<!-- <template #default="scope"> -->
<!-- <el-switch v-model="scope.row.transition" active-value="是" inactive-value="否"
@change="handleTransitionChange(scope.row)"></el-switch> -->
<!-- </template> -->
</el-table-column>
<!-- 备注信息列（可展开） -->
<el-table-column label="备注信息" min-width="120">
<template #default="scope">
<el-popover placement="top" width="300" trigger="click">
<template #reference>
<el-button size="small" type="text">查看详情</el-button>
</template>
<div class="space-y-2 text-sm">
<p><span class="font-medium">采购备注：</span>{{ scope.row.cgRemark || '-' }}
</p>
<p><span class="font-medium">到货备注：</span>{{ scope.row.dhRemark || '-' }}
</p>
<p><span class="font-medium">供应商备注：</span>{{ scope.row.gysRemark || '-'
}}</p>
<p><span class="font-medium">结算备注：</span>{{ scope.row.jsRemark || '-' }}
</p>
</div>
</el-popover>
</template>
</el-table-column>
<!-- 操作列 -->
<el-table-column label="操作" min-width="120" align="center" fixed="right">
<template #default="scope">
<el-button size="small" icon="Edit" @click="handleEdit2(scope.row)"
class="text-blue-600 hover:text-blue-800 transition-colors"></el-button>
<el-button size="small" icon="Delete" @click="handleDelete2(scope.row)"
class="text-red-600 hover:text-red-800 transition-colors"></el-button>
</template>
</el-table-column>
</el-table>
<!-- 分页 -->
<div class="flex flex-wrap items-center justify-between p-4 border-t gap-4">
<div class="text-gray-500 text-sm">
共 {{ total }} 条记录，当前显示第 {{ (currentPage - 1) * pageSize + 1 }} 至 {{
Math.min(currentPage * pageSize, total)
}} 条
</div>
<el-pagination v-model:current-page="currentPage" v-model:page-size="pageSize"
:page-sizes="[10, 20, 50, 100]" :total="total" layout="prev, pager, next, jumper, sizes"
@size-change="handleSizeChange" @current-change="handleCurrentChange" small></el-pagination>
</div>
</div>
</div>
<!-- 数据表格 -->
<el-table v-loading="loading2" :data="tableData" stripe
:header-cell-style="{ 'background-color': '#f5f7fa', 'font-weight': 'bold' }"
:row-class-name="tableRowClassName" style="width: 100%">
<!-- 基础信息列 -->
<el-table-column prop="id" label="ID" width="80" align="center"></el-table-column>
<el-table-column prop="batch" label="批次" min-width="100"></el-table-column>
<el-table-column prop="physicalsupplyId" label="使用情况ID" width="120" align="center"></el-table-column>
<!-- 时间相关列 -->
<el-table-column prop="issuanceTime" label="联系单下达时间" min-width="160" align="center">
<template #default="scope">
{{ formatDate(scope.row.issuanceTime) }}
</template>
</el-table-column>
<el-table-column prop="requireDelivery" label="要求到货时间" min-width="160" align="center">
<template #default="scope">
{{ formatDate(scope.row.requireDelivery) }}
</template>
</el-table-column>
<el-table-column prop="scheduledDelivery" label="计划到货时间" min-width="160" align="center">
<template #default="scope">
{{ formatDate(scope.row.scheduledDelivery) }}
</template>
</el-table-column>
<el-table-column prop="actualDelivery" label="实际到货时间" min-width="160" align="center">
<template #default="scope">
{{ formatDate(scope.row.actualDelivery) }}
</template>
</el-table-column>
<el-table-column prop="acceptanceCheck" label="验收移交时间" min-width="160" align="center">
<template #default="scope">
{{ formatDate(scope.row.acceptanceCheck) }}
</template>
</el-table-column>
<!-- 数量相关列 -->
<el-table-column prop="requiredQuantity" label="要求到货数量" min-width="120" align="right"></el-table-column>
<el-table-column prop="plannedQuantity" label="计划到货数量" min-width="120" align="right"></el-table-column>
<el-table-column prop="actualAcceptance" label="实际验收数量" min-width="120" align="right"></el-table-column>
<el-table-column prop="differenceQuantity" label="差异量" min-width="100" align="right">
<template #default="scope">
<span
:class="scope.row.differenceQuantity && parseFloat(scope.row.differenceQuantity) !== 0 ? 'text-red-500' : ''">
{{ scope.row.differenceQuantity || '-' }}
</span>
</template>
</el-table-column>
<el-table-column prop="dhDifferenceQuantity" label="到货差异量" min-width="120" align="right"></el-table-column>
<!-- 金额相关列 -->
<el-table-column prop="cargoAmount" label="货物金额" min-width="120" align="right">
<template #default="scope">
{{ scope.row.cargoAmount }}
</template>
</el-table-column>
<el-table-column prop="advance" label="预付款" min-width="100" align="right">
<template #default="scope">
{{ scope.row.advance }}
</template>
</el-table-column>
<el-table-column prop="feed" label="投料款" min-width="100" align="right">
<template #default="scope">
{{ scope.row.feed }}
</template>
</el-table-column>
<el-table-column prop="acceptancePayment" label="到货验收款" min-width="120" align="right">
<template #default="scope">
{{ scope.row.acceptancePayment }}
</template>
</el-table-column>
<el-table-column prop="debugging" label="调试款" min-width="100" align="right">
<template #default="scope">
{{ scope.row.debugging }}
</template>
</el-table-column>
<el-table-column prop="qualityGuarantee" label="质保金" min-width="100" align="right">
<template #default="scope">
{{ scope.row.qualityGuarantee }}
</template>
</el-table-column>
<el-table-column prop="settlementAmount" label="结算金额" min-width="120" align="right">
<template #default="scope">
{{ scope.row.settlementAmount }}
</template>
</el-table-column>
<!-- 状态和备注列 -->
<el-table-column prop="expectedState" label="逾期状态" min-width="100" align="center">
<template #default="scope">
<!-- :type="getTagType(scope.row.expectedState)" -->
<el-tag :effect="scope.row.expectedState ? 'dark' : 'plain'">
{{ scope.row.expectedState || '-' }}
</el-tag>
</template>
</el-table-column>
<el-table-column prop="associate" label="交接方式" min-width="120"></el-table-column>
<el-table-column prop="deliveryRequirements" label="到货要求" min-width="150"></el-table-column>
<el-table-column prop="transition" label="转换为合同" min-width="120" align="center">
<!-- <template #default="scope"> -->
<!-- <el-switch v-model="scope.row.transition" active-value="是" inactive-value="否"
@change="handleTransitionChange(scope.row)"></el-switch> -->
<!-- </template> -->
</el-table-column>
<!-- 备注信息列（可展开） -->
<el-table-column label="备注信息" min-width="120">
<template #default="scope">
<el-popover placement="top" width="300" trigger="click">
<template #reference>
<el-button size="small" type="text">查看详情</el-button>
</template>
<div class="space-y-2 text-sm">
<p><span class="font-medium">采购备注：</span>{{ scope.row.cgRemark || '-' }}
</p>
<p><span class="font-medium">到货备注：</span>{{ scope.row.dhRemark || '-' }}
</p>
<p><span class="font-medium">供应商备注：</span>{{ scope.row.gysRemark || '-'
}}</p>
<p><span class="font-medium">结算备注：</span>{{ scope.row.jsRemark || '-' }}
</p>
</div>
</el-popover>
</template>
</el-table-column>
<!-- 操作列 -->
<el-table-column label="操作" min-width="120" align="center" fixed="right">
<template #default="scope">
<el-button size="small" icon="Edit" @click="handleEdit2(scope.row)"
class="text-blue-600 hover:text-blue-800 transition-colors"></el-button>
<el-button size="small" icon="Delete" @click="handleDelete2(scope.row)"
class="text-red-600 hover:text-red-800 transition-colors"></el-button>
</template>
</el-table-column>
</el-table>
<!-- 分页 -->
<div class="flex flex-wrap items-center justify-between p-4 border-t gap-4">
<div class="text-gray-500 text-sm">
共 {{ total }} 条记录，当前显示第 {{ (currentPage - 1) * pageSize + 1 }} 至 {{
Math.min(currentPage * pageSize, total)
}} 条
</div>
<el-pagination v-model:current-page="currentPage" v-model:page-size="pageSize" :page-sizes="[10, 20, 50, 100]"
:total="total" layout="prev, pager, next, jumper, sizes" @size-change="handleSizeChange"
@current-change="handleCurrentChange" small></el-pagination>
</div>
<!-- 删除确认对话框 -->
<el-dialog v-model="deleteDialogVisible2" title="确认删除" width="300px" :show-close="false">
<div class="text-center py-4">
@ -409,7 +409,7 @@ const tableRowClassName = ({ row, rowIndex }) => {
return rowIndex % 2 === 0 ? 'bg-white' : 'bg-gray-50';
};
const form = reactive({
id: '',
id: '',
acceptanceCheck: '',
acceptancePayment: '',
actualAcceptance: '',
@ -441,7 +441,7 @@ const form = reactive({
updateBy: null,
updateTime: ''
});
const handleAdd = ()=>{
const handleAdd = () => {
dialogVisible2.value = true;
dialogType2.value = 'addSon';
resetForm();
@ -477,7 +477,22 @@ const handleEdit2 = (row) => {
};
const handleDelete2 = (row) => {
currentRow2.value = row;
deleteDialogVisible2.value = true;
ElMessageBox.confirm(
'确定要删除这条记录吗？此操作不可撤销，请谨慎操作',
'提示',
{
confirmButtonText: '确认',
cancelButtonText: '取消',
type: 'warning',
}
).then(() => {
confirmDelete2();
}).catch(() => {
ElMessage({
type: 'info',
message: '已取消删除',
})
})
};
const confirmDelete2 = async () => {
if (!currentRow2.value) return;