优化逻辑bug
This commit is contained in:
@ -2,17 +2,27 @@
|
||||
<div class="p-5">
|
||||
<!-- 主要内容区 -->
|
||||
<el-card class="mb-5">
|
||||
<el-button icon="Refresh" @click="refreshData" class="transition-all duration-200 hover:shadow-md">
|
||||
<el-button
|
||||
icon="Refresh"
|
||||
v-hasPermi="['cailiaoshebei:physicalsupply:list']"
|
||||
@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
|
||||
<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">
|
||||
:row-class-name="tableRowClassName"
|
||||
>
|
||||
<el-table-column prop="id" label="ID" width="180" 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>
|
||||
@ -39,12 +49,27 @@
|
||||
<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>
|
||||
<el-button
|
||||
size="small"
|
||||
v-hasPermi="['cailiaoshebei:physicalsupply:edit']"
|
||||
icon="Edit"
|
||||
@click="handleEdit(scope.row)"
|
||||
class="text-blue-600 hover:text-blue-800 transition-colors"
|
||||
></el-button>
|
||||
<el-button
|
||||
size="small"
|
||||
v-hasPermi="['cailiaoshebei:physicalsupplySon:list']"
|
||||
icon="View"
|
||||
@click="jumpRouter(scope.row)"
|
||||
class="text-blue-600 hover:text-blue-800 transition-colors"
|
||||
></el-button>
|
||||
<el-button
|
||||
size="small"
|
||||
v-hasPermi="['cailiaoshebei:physicalsupply:remove']"
|
||||
icon="Delete"
|
||||
@click="handleDelete(scope.row)"
|
||||
class="text-red-600 hover:text-red-800 transition-colors"
|
||||
></el-button>
|
||||
</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
@ -52,18 +77,27 @@
|
||||
<!-- 分页 -->
|
||||
<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)
|
||||
}} 条
|
||||
共 {{ 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>
|
||||
<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>
|
||||
<!-- 新增/编辑对话框 -->
|
||||
<el-dialog v-model="dialogVisible" :title="dialogType === 'add' ? '新增记录' : '编辑记录'" :width="dialogWidth"
|
||||
:fullscreen="isFullscreen" :before-close="handleDialogClose">
|
||||
<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">
|
||||
@ -107,8 +141,12 @@
|
||||
<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-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">
|
||||
@ -137,9 +175,7 @@
|
||||
<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>
|
||||
<el-button type="primary" @click="handleSave" :loading="saveLoading"> 保存 </el-button>
|
||||
</div>
|
||||
</template>
|
||||
</el-dialog>
|
||||
@ -154,7 +190,7 @@ import { useRouter } from 'vue-router';
|
||||
const userStore = useUserStoreHook();
|
||||
const router = useRouter();
|
||||
const currentProject = computed(() => userStore.selectedProject);
|
||||
import { useMaterialsQueryList, newMaterialsAdd, materialsEdit, materialsDel, queryMaterialsInfo } from "@/api/materials/usageMaterials/index";
|
||||
import { useMaterialsQueryList, newMaterialsAdd, materialsEdit, materialsDel, queryMaterialsInfo } from '@/api/materials/usageMaterials/index';
|
||||
// 表格数据相关
|
||||
const tableData = ref([]);
|
||||
const total = ref(0);
|
||||
@ -208,25 +244,23 @@ const formRules = reactive({
|
||||
{ required: true, message: '请输入供应商', trigger: 'blur' },
|
||||
{ max: 100, message: '供应商名称不能超过100个字符', trigger: 'blur' }
|
||||
],
|
||||
findType: [
|
||||
{ required: true, message: '请选择类型', trigger: 'change' }
|
||||
]
|
||||
findType: [{ required: true, message: '请选择类型', trigger: 'change' }]
|
||||
});
|
||||
|
||||
|
||||
|
||||
// 格式化日期
|
||||
const formatDate = (dateString) => {
|
||||
if (!dateString) return '-';
|
||||
const date = new Date(dateString);
|
||||
return date.toLocaleString('zh-CN', {
|
||||
year: 'numeric',
|
||||
month: '2-digit',
|
||||
day: '2-digit',
|
||||
hour: '2-digit',
|
||||
minute: '2-digit',
|
||||
second: '2-digit'
|
||||
}).replace(',', ' ');
|
||||
return date
|
||||
.toLocaleString('zh-CN', {
|
||||
year: 'numeric',
|
||||
month: '2-digit',
|
||||
day: '2-digit',
|
||||
hour: '2-digit',
|
||||
minute: '2-digit',
|
||||
second: '2-digit'
|
||||
})
|
||||
.replace(',', ' ');
|
||||
};
|
||||
|
||||
// 表格行样式
|
||||
@ -293,7 +327,7 @@ const handleEdit = (row) => {
|
||||
resetForm();
|
||||
|
||||
// 填充表单数据
|
||||
Object.keys(formData).forEach(key => {
|
||||
Object.keys(formData).forEach((key) => {
|
||||
if (row.hasOwnProperty(key)) {
|
||||
formData[key] = row[key];
|
||||
}
|
||||
@ -302,55 +336,49 @@ const handleEdit = (row) => {
|
||||
dialogVisible.value = true;
|
||||
};
|
||||
const handleAddSon = (row) => {
|
||||
ElMessageBox.confirm(
|
||||
'确认提交',
|
||||
'Warning',
|
||||
{
|
||||
confirmButtonText: '确认',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning',
|
||||
}
|
||||
).then(() => {
|
||||
materialsEdit(formData).then(res => {
|
||||
let { code } = res
|
||||
if (code === 200) {
|
||||
ElMessage({
|
||||
type: 'success',
|
||||
message: '提交成功',
|
||||
})
|
||||
}
|
||||
})
|
||||
}).catch(() => {
|
||||
ElMessage({
|
||||
type: 'info',
|
||||
message: '已取消提交',
|
||||
})
|
||||
ElMessageBox.confirm('确认提交', 'Warning', {
|
||||
confirmButtonText: '确认',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
})
|
||||
.then(() => {
|
||||
materialsEdit(formData).then((res) => {
|
||||
let { code } = res;
|
||||
if (code === 200) {
|
||||
ElMessage({
|
||||
type: 'success',
|
||||
message: '提交成功'
|
||||
});
|
||||
}
|
||||
});
|
||||
})
|
||||
.catch(() => {
|
||||
ElMessage({
|
||||
type: 'info',
|
||||
message: '已取消提交'
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
// 删除
|
||||
const handleDelete = (row) => {
|
||||
currentRow.value = row;
|
||||
ElMessageBox.confirm(
|
||||
'确定要删除这条记录吗?此操作不可撤销,请谨慎操作',
|
||||
'提示',
|
||||
{
|
||||
confirmButtonText: '确认',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning',
|
||||
}
|
||||
).then(() => {
|
||||
confirmDelete();
|
||||
}).catch(() => {
|
||||
ElMessage({
|
||||
type: 'info',
|
||||
message: '已取消删除',
|
||||
})
|
||||
ElMessageBox.confirm('确定要删除这条记录吗?此操作不可撤销,请谨慎操作', '提示', {
|
||||
confirmButtonText: '确认',
|
||||
cancelButtonText: '取消',
|
||||
type: 'warning'
|
||||
})
|
||||
.then(() => {
|
||||
confirmDelete();
|
||||
})
|
||||
.catch(() => {
|
||||
ElMessage({
|
||||
type: 'info',
|
||||
message: '已取消删除'
|
||||
});
|
||||
});
|
||||
};
|
||||
|
||||
|
||||
// 确认删除
|
||||
const confirmDelete = async () => {
|
||||
if (!currentRow.value) return;
|
||||
@ -358,7 +386,7 @@ const confirmDelete = async () => {
|
||||
deleteLoading.value = true;
|
||||
try {
|
||||
// 模拟API请求
|
||||
const res = await materialsDel(currentRow.value.id)
|
||||
const res = await materialsDel(currentRow.value.id);
|
||||
const { code } = res;
|
||||
if (code === 200) {
|
||||
ElMessage.success('删除成功');
|
||||
@ -374,9 +402,7 @@ const confirmDelete = async () => {
|
||||
deleteLoading.value = false;
|
||||
}
|
||||
};
|
||||
//
|
||||
|
||||
|
||||
//
|
||||
|
||||
// 保存
|
||||
const handleSave = async () => {
|
||||
@ -390,16 +416,16 @@ const handleSave = async () => {
|
||||
if (dialogType.value === 'add') {
|
||||
// 新增
|
||||
formData.projectId = currentProject.value?.id;
|
||||
const res = await newMaterialsAdd(formData)
|
||||
let { code } = res
|
||||
const res = await newMaterialsAdd(formData);
|
||||
let { code } = res;
|
||||
if (code === 200) {
|
||||
ElMessage.success('新增成功');
|
||||
fetchData();
|
||||
}
|
||||
} else {
|
||||
// 编辑
|
||||
const res = await materialsEdit(formData)
|
||||
let { code } = res
|
||||
const res = await materialsEdit(formData);
|
||||
let { code } = res;
|
||||
if (code === 200) {
|
||||
ElMessage.success('保存成功');
|
||||
fetchData();
|
||||
@ -422,7 +448,7 @@ const resetForm = () => {
|
||||
}
|
||||
|
||||
// 重置表单数据
|
||||
Object.keys(formData).forEach(key => {
|
||||
Object.keys(formData).forEach((key) => {
|
||||
formData[key] = '';
|
||||
});
|
||||
|
||||
@ -451,8 +477,6 @@ const jumpRouter = (row) => {
|
||||
onMounted(() => {
|
||||
fetchData();
|
||||
});
|
||||
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
</style>
|
||||
<style scoped></style>
|
||||
|
Reference in New Issue
Block a user