新增物资管理和出库记录的文件导入功能

This commit is contained in:
HashMap 2025-08-06 21:12:31 +08:00
parent 89a9107e9c
commit 69198e1731
3 changed files with 317 additions and 228 deletions

View File

@ -172,18 +172,18 @@
}
/**文件上传中处理 */
const handleFileUploadProgress = (event, file, fileList) => {
upload.isUploading = true
}
const handleFileUploadProgress = (event, file, fileList) => {
upload.isUploading = true
}
/** 文件上传成功处理 */
const handleFileSuccess = (response, file, fileList) => {
upload.open = false
upload.isUploading = false
proxy.$refs["uploadRef"].handleRemove(file)
proxy.$alert("<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" + response.msg + "</div>", "导入结果", { dangerouslyUseHTMLString: true })
getList()
}
/** 文件上传成功处理 */
const handleFileSuccess = (response, file, fileList) => {
upload.open = false
upload.isUploading = false
proxy.$refs["uploadRef"].handleRemove(file)
proxy.$alert("<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" + response.msg + "</div>", "导入结果", { dangerouslyUseHTMLString: true })
getList()
}
const { queryParams, form, rules } = toRefs(data)

View File

@ -62,6 +62,9 @@
v-hasPermi="['stock:management:export']"
>导出</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="info" plain icon="Upload" @click="handleImport" v-hasPermi="['stock:management:import']">导入</el-button>
</el-col>
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
@ -105,12 +108,35 @@
</div>
</template>
</el-dialog>
<!-- 物资管理记录导入对话框 -->
<el-dialog :title="upload.title" v-model="upload.open" width="400px" append-to-body>
<el-upload ref="uploadRef" :limit="1" accept=".xlsx, .xls" :headers="upload.headers"
:action="upload.url + '?updateSupport=' + upload.updateSupport" :disabled="upload.isUploading"
:on-progress="handleFileUploadProgress" :on-success="handleFileSuccess" :auto-upload="false" drag>
<el-icon class="el-icon--upload"><upload-filled /></el-icon>
<div class="el-upload__text">将文件拖到此处<em>点击上传</em></div>
<template #tip>
<div class="el-upload__tip text-center">
<span>仅允许导入xlsxlsx格式文件</span>
<el-link type="primary" :underline="false" style="font-size: 12px; vertical-align: baseline"
@click="importTemplate">下载模板</el-link>
</div>
</template>
</el-upload>
<template #footer>
<div class="dialog-footer">
<el-button type="primary" @click="submitFileForm"> </el-button>
<el-button @click="upload.open = false"> </el-button>
</div>
</template>
</el-dialog>
</div>
</template>
<script setup name="Management">
import { listManagement, getManagement, delManagement, addManagement, updateManagement } from "@/api/stock/management"
import { getToken } from "@/utils/auth"
const { proxy } = getCurrentInstance()
const managementList = ref([])
@ -141,6 +167,45 @@ const data = reactive({
}
})
/*** 用户导入参数 */
const upload = reactive({
//
open: false,
//
title: "",
//
isUploading: false,
//
updateSupport: 0,
//
headers: { Authorization: "Bearer " + getToken() },
//
url: import.meta.env.VITE_APP_BASE_API + "/stock/management/importData"
})
/** 导入按钮操作 */
function handleImport() {
upload.title = "物资记录导入"
upload.open = true
}
/** 提交上传文件 */
function submitFileForm() {
proxy.$refs["uploadRef"].submit()
}
/**文件上传中处理 */
const handleFileUploadProgress = (event, file, fileList) => {
upload.isUploading = true
}
/** 文件上传成功处理 */
const handleFileSuccess = (response, file, fileList) => {
upload.open = false
upload.isUploading = false
proxy.$refs["uploadRef"].handleRemove(file)
proxy.$alert("<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" + response.msg + "</div>", "导入结果", { dangerouslyUseHTMLString: true })
getList()
}
const { queryParams, form, rules } = toRefs(data)
/** 查询物资管理列表 */

View File

@ -2,36 +2,16 @@
<div class="app-container">
<el-form :model="queryParams" ref="queryRef" :inline="true" v-show="showSearch" label-width="68px">
<el-form-item label="仓库名称" prop="repositoryName">
<el-input
v-model="queryParams.repositoryName"
placeholder="请输入仓库名称"
clearable
@keyup.enter="handleQuery"
/>
<el-input v-model="queryParams.repositoryName" placeholder="请输入仓库名称" clearable @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item label="项目" prop="projectName">
<el-input
v-model="queryParams.projectName"
placeholder="请输入项目"
clearable
@keyup.enter="handleQuery"
/>
<el-input v-model="queryParams.projectName" placeholder="请输入项目" clearable @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item label="生产车间" prop="departmentName">
<el-input
v-model="queryParams.departmentName"
placeholder="请输入生产车间"
clearable
@keyup.enter="handleQuery"
/>
<el-input v-model="queryParams.departmentName" placeholder="请输入生产车间" clearable @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item label="材料名称" prop="materialName">
<el-input
v-model="queryParams.materialName"
placeholder="请输入材料名称"
clearable
@keyup.enter="handleQuery"
/>
<el-input v-model="queryParams.materialName" placeholder="请输入材料名称" clearable @keyup.enter="handleQuery" />
</el-form-item>
<el-form-item>
<el-button type="primary" icon="Search" @click="handleQuery">搜索</el-button>
@ -41,42 +21,22 @@
<el-row :gutter="10" class="mb8">
<el-col :span="1.5">
<el-button
type="primary"
plain
icon="Plus"
@click="handleAdd"
v-hasPermi="['stock:out:add']"
>新增</el-button>
<el-button type="primary" plain icon="Plus" @click="handleAdd" v-hasPermi="['stock:out:add']">新增</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="success"
plain
icon="Edit"
:disabled="single"
@click="handleUpdate"
v-hasPermi="['stock:out:edit']"
>修改</el-button>
<el-button type="success" plain icon="Edit" :disabled="single" @click="handleUpdate"
v-hasPermi="['stock:out:edit']">修改</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="danger"
plain
icon="Delete"
:disabled="multiple"
@click="handleDelete"
v-hasPermi="['stock:out:remove']"
>删除</el-button>
<el-button type="danger" plain icon="Delete" :disabled="multiple" @click="handleDelete"
v-hasPermi="['stock:out:remove']">删除</el-button>
</el-col>
<el-col :span="1.5">
<el-button
type="warning"
plain
icon="Download"
@click="handleExport"
v-hasPermi="['stock:out:export']"
>导出</el-button>
<el-button type="warning" plain icon="Download" @click="handleExport"
v-hasPermi="['stock:out:export']">导出</el-button>
</el-col>
<el-col :span="1.5">
<el-button type="info" plain icon="Upload" @click="handleImport" v-hasPermi="['stock:out:import']">导入</el-button>
</el-col>
<right-toolbar v-model:showSearch="showSearch" @queryTable="getList"></right-toolbar>
</el-row>
@ -95,6 +55,7 @@
<el-table-column label="项目" align="center" prop="projectName" />
<el-table-column label="生产车间编码" align="center" prop="departmentId" />
<el-table-column label="生产车间" align="center" prop="departmentName" />
<el-table-column label="领用人编码" align="center" prop="receiverId" />
<el-table-column label="领用人" align="center" prop="receiver" />
<el-table-column label="制单人" align="center" prop="single" />
<el-table-column label="审核人" align="center" prop="reviewer" />
@ -102,6 +63,7 @@
<el-table-column label="修改人" align="center" prop="modifier" />
<el-table-column label="材料分类编码" align="center" prop="materialClassId" />
<el-table-column label="材料分类" align="center" prop="materialClassName" />
<el-table-column label="材料编码" align="center" prop="materialId" />
<el-table-column label="材料名称" align="center" prop="materialName" />
<el-table-column label="材料规格" align="center" prop="materialSpecification" />
<el-table-column label="计量单位" align="center" prop="materialUnit" />
@ -114,19 +76,16 @@
<el-table-column label="代理人" align="center" prop="agent" />
<el-table-column label="操作" align="center" class-name="small-padding fixed-width">
<template #default="scope">
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)" v-hasPermi="['stock:out:edit']">修改</el-button>
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)" v-hasPermi="['stock:out:remove']">删除</el-button>
<el-button link type="primary" icon="Edit" @click="handleUpdate(scope.row)"
v-hasPermi="['stock:out:edit']">修改</el-button>
<el-button link type="primary" icon="Delete" @click="handleDelete(scope.row)"
v-hasPermi="['stock:out:remove']">删除</el-button>
</template>
</el-table-column>
</el-table>
<pagination
v-show="total>0"
:total="total"
v-model:page="queryParams.pageNum"
v-model:limit="queryParams.pageSize"
@pagination="getList"
/>
<pagination v-show="total > 0" :total="total" v-model:page="queryParams.pageNum" v-model:limit="queryParams.pageSize"
@pagination="getList" />
<!-- 添加或修改出库记录对话框 -->
<el-dialog :title="title" v-model="open" width="500px" append-to-body>
@ -139,168 +98,233 @@
</div>
</template>
</el-dialog>
<!-- 入库记录导入对话框 -->
<el-dialog :title="upload.title" v-model="upload.open" width="400px" append-to-body>
<el-upload ref="uploadRef" :limit="1" accept=".xlsx, .xls" :headers="upload.headers"
:action="upload.url + '?updateSupport=' + upload.updateSupport" :disabled="upload.isUploading"
:on-progress="handleFileUploadProgress" :on-success="handleFileSuccess" :auto-upload="false" drag>
<el-icon class="el-icon--upload"><upload-filled /></el-icon>
<div class="el-upload__text">将文件拖到此处<em>点击上传</em></div>
<template #tip>
<div class="el-upload__tip text-center">
<span>仅允许导入xlsxlsx格式文件</span>
<el-link type="primary" :underline="false" style="font-size: 12px; vertical-align: baseline"
@click="importTemplate">下载模板</el-link>
</div>
</template>
</el-upload>
<template #footer>
<div class="dialog-footer">
<el-button type="primary" @click="submitFileForm"> </el-button>
<el-button @click="upload.open = false"> </el-button>
</div>
</template>
</el-dialog>
</div>
</template>
<script setup name="Out">
import { listOut, getOut, delOut, addOut, updateOut } from "@/api/stock/out"
import { listOut, getOut, delOut, addOut, updateOut } from "@/api/stock/out"
import { getToken } from "@/utils/auth"
const { proxy } = getCurrentInstance()
const { proxy } = getCurrentInstance()
const outList = ref([])
const open = ref(false)
const loading = ref(true)
const showSearch = ref(true)
const ids = ref([])
const single = ref(true)
const multiple = ref(true)
const total = ref(0)
const title = ref("")
const outList = ref([])
const open = ref(false)
const loading = ref(true)
const showSearch = ref(true)
const ids = ref([])
const single = ref(true)
const multiple = ref(true)
const total = ref(0)
const title = ref("")
const data = reactive({
form: {},
queryParams: {
pageNum: 1,
pageSize: 10,
businessType: null,
repositoryName: null,
projectName: null,
departmentName: null,
materialName: null,
},
rules: {
}
})
const { queryParams, form, rules } = toRefs(data)
/** 查询出库记录列表 */
function getList() {
loading.value = true
listOut(queryParams.value).then(response => {
outList.value = response.rows
total.value = response.total
loading.value = false
})
}
//
function cancel() {
open.value = false
reset()
}
//
function reset() {
form.value = {
stockOutCode: null,
docDate: null,
createDate: null,
docId: null,
businessType: null,
repositoryId: null,
repositoryName: null,
projectClassification: null,
projectId: null,
projectName: null,
departmentId: null,
departmentName: null,
receiver: null,
single: null,
reviewer: null,
reviewDate: null,
modifier: null,
materialClassId: null,
materialClassName: null,
materialName: null,
materialSpecification: null,
materialUnit: null,
count: null,
batchId: null,
productionDate: null,
shelfLife: null,
shelfLifeUnit: null,
expirationDate: null,
agent: null
}
proxy.resetForm("outRef")
}
/** 搜索按钮操作 */
function handleQuery() {
queryParams.value.pageNum = 1
getList()
}
/** 重置按钮操作 */
function resetQuery() {
proxy.resetForm("queryRef")
handleQuery()
}
//
function handleSelectionChange(selection) {
ids.value = selection.map(item => item.stockOutCode)
single.value = selection.length != 1
multiple.value = !selection.length
}
/** 新增按钮操作 */
function handleAdd() {
reset()
open.value = true
title.value = "添加出库记录"
}
/** 修改按钮操作 */
function handleUpdate(row) {
reset()
const _stockOutCode = row.stockOutCode || ids.value
getOut(_stockOutCode).then(response => {
form.value = response.data
open.value = true
title.value = "修改出库记录"
})
}
/** 提交按钮 */
function submitForm() {
proxy.$refs["outRef"].validate(valid => {
if (valid) {
if (form.value.stockOutCode != null) {
updateOut(form.value).then(response => {
proxy.$modal.msgSuccess("修改成功")
open.value = false
getList()
})
} else {
addOut(form.value).then(response => {
proxy.$modal.msgSuccess("新增成功")
open.value = false
getList()
})
}
const data = reactive({
form: {},
queryParams: {
pageNum: 1,
pageSize: 10,
businessType: null,
repositoryName: null,
projectName: null,
departmentName: null,
materialName: null,
},
rules: {
}
})
}
/*** 用户导入参数 */
const upload = reactive({
//
open: false,
//
title: "",
//
isUploading: false,
//
updateSupport: 0,
//
headers: { Authorization: "Bearer " + getToken() },
//
url: import.meta.env.VITE_APP_BASE_API + "/stock/out/importData"
})
/** 删除按钮操作 */
function handleDelete(row) {
const _stockOutCodes = row.stockOutCode || ids.value
proxy.$modal.confirm('是否确认删除出库记录编号为"' + _stockOutCodes + '"的数据项?').then(function() {
return delOut(_stockOutCodes)
}).then(() => {
/** 导入按钮操作 */
function handleImport() {
upload.title = "出库记录导入"
upload.open = true
}
/** 提交上传文件 */
function submitFileForm() {
proxy.$refs["uploadRef"].submit()
}
/**文件上传中处理 */
const handleFileUploadProgress = (event, file, fileList) => {
upload.isUploading = true
}
/** 文件上传成功处理 */
const handleFileSuccess = (response, file, fileList) => {
upload.open = false
upload.isUploading = false
proxy.$refs["uploadRef"].handleRemove(file)
proxy.$alert("<div style='overflow: auto;overflow-x: hidden;max-height: 70vh;padding: 10px 20px 0;'>" + response.msg + "</div>", "导入结果", { dangerouslyUseHTMLString: true })
getList()
proxy.$modal.msgSuccess("删除成功")
}).catch(() => {})
}
}
/** 导出按钮操作 */
function handleExport() {
proxy.download('stock/out/export', {
...queryParams.value
}, `out_${new Date().getTime()}.xlsx`)
}
getList()
const { queryParams, form, rules } = toRefs(data)
/** 查询出库记录列表 */
function getList() {
loading.value = true
listOut(queryParams.value).then(response => {
outList.value = response.rows
total.value = response.total
loading.value = false
})
}
//
function cancel() {
open.value = false
reset()
}
//
function reset() {
form.value = {
stockOutCode: null,
docDate: null,
createDate: null,
docId: null,
businessType: null,
repositoryId: null,
repositoryName: null,
projectClassification: null,
projectId: null,
projectName: null,
departmentId: null,
departmentName: null,
receiverId: null,
receiver: null,
single: null,
reviewer: null,
reviewDate: null,
modifier: null,
materialClassId: null,
materialId: null,
materialClassName: null,
materialName: null,
materialSpecification: null,
materialUnit: null,
count: null,
batchId: null,
productionDate: null,
shelfLife: null,
shelfLifeUnit: null,
expirationDate: null,
agent: null
}
proxy.resetForm("outRef")
}
/** 搜索按钮操作 */
function handleQuery() {
queryParams.value.pageNum = 1
getList()
}
/** 重置按钮操作 */
function resetQuery() {
proxy.resetForm("queryRef")
handleQuery()
}
//
function handleSelectionChange(selection) {
ids.value = selection.map(item => item.stockOutCode)
single.value = selection.length != 1
multiple.value = !selection.length
}
/** 新增按钮操作 */
function handleAdd() {
reset()
open.value = true
title.value = "添加出库记录"
}
/** 修改按钮操作 */
function handleUpdate(row) {
reset()
const _stockOutCode = row.stockOutCode || ids.value
getOut(_stockOutCode).then(response => {
form.value = response.data
open.value = true
title.value = "修改出库记录"
})
}
/** 提交按钮 */
function submitForm() {
proxy.$refs["outRef"].validate(valid => {
if (valid) {
if (form.value.stockOutCode != null) {
updateOut(form.value).then(response => {
proxy.$modal.msgSuccess("修改成功")
open.value = false
getList()
})
} else {
addOut(form.value).then(response => {
proxy.$modal.msgSuccess("新增成功")
open.value = false
getList()
})
}
}
})
}
/** 删除按钮操作 */
function handleDelete(row) {
const _stockOutCodes = row.stockOutCode || ids.value
proxy.$modal.confirm('是否确认删除出库记录编号为"' + _stockOutCodes + '"的数据项?').then(function () {
return delOut(_stockOutCodes)
}).then(() => {
getList()
proxy.$modal.msgSuccess("删除成功")
}).catch(() => { })
}
/** 导出按钮操作 */
function handleExport() {
proxy.download('stock/out/export', {
...queryParams.value
}, `out_${new Date().getTime()}.xlsx`)
}
getList()
</script>