功能:新增托盘业务报表页面
This commit is contained in:
@@ -0,0 +1,179 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<el-form ref="queryRef" :model="queryParams" :inline="true" label-width="76px">
|
||||
<el-form-item label="更新时间">
|
||||
<el-date-picker
|
||||
v-model="dateRange"
|
||||
type="daterange"
|
||||
value-format="YYYY-MM-DD"
|
||||
range-separator="-"
|
||||
start-placeholder="开始日期"
|
||||
end-placeholder="结束日期"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="托盘编号" prop="palletCode">
|
||||
<el-input v-model="queryParams.palletCode" placeholder="请输入托盘编号" clearable maxlength="64" @keyup.enter="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item label="流转状态" prop="flowState">
|
||||
<el-select v-model="queryParams.flowState" placeholder="请选择状态" clearable style="width: 190px">
|
||||
<el-option v-for="option in flowStateOptions" :key="option.value" :label="option.label" :value="option.value" />
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="仓库ID" prop="warehouseId">
|
||||
<el-input-number v-model="queryParams.warehouseId" :min="1" :controls="false" placeholder="请输入仓库ID" />
|
||||
</el-form-item>
|
||||
<el-form-item label="现场ID" prop="siteId">
|
||||
<el-input-number v-model="queryParams.siteId" :min="1" :controls="false" placeholder="请输入现场ID" />
|
||||
</el-form-item>
|
||||
<el-form-item label="产线ID" prop="lineId">
|
||||
<el-input-number v-model="queryParams.lineId" :min="1" :controls="false" placeholder="请输入产线ID" />
|
||||
</el-form-item>
|
||||
<el-form-item label="菌种ID" prop="strainId">
|
||||
<el-input-number v-model="queryParams.strainId" :min="1" :controls="false" placeholder="请输入菌种ID" />
|
||||
</el-form-item>
|
||||
<el-form-item label="生产批次" prop="batchNo">
|
||||
<el-input v-model="queryParams.batchNo" placeholder="请输入生产批次" clearable maxlength="64" @keyup.enter="handleQuery" />
|
||||
</el-form-item>
|
||||
<el-form-item>
|
||||
<el-button type="primary" icon="Search" @click="handleQuery" v-hasPermi="['report:palletinventory:list']">搜索</el-button>
|
||||
<el-button icon="Refresh" @click="resetQuery" v-hasPermi="['report:palletinventory:list']">重置</el-button>
|
||||
</el-form-item>
|
||||
</el-form>
|
||||
|
||||
<el-alert v-if="loadError" :title="loadError" type="error" :closable="false" show-icon class="mb8" />
|
||||
<el-table v-loading="loading" :data="reportList">
|
||||
<template #empty><el-empty description="暂无托盘库存数据" /></template>
|
||||
<el-table-column label="托盘编号" prop="palletCode" min-width="140" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="状态" prop="flowState" min-width="150">
|
||||
<template #default="scope">{{ flowStateLabel(scope.row.flowState) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="当前位置" min-width="180" :show-overflow-tooltip="true">
|
||||
<template #default="scope">{{ currentLocation(scope.row) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="菌种" min-width="160" :show-overflow-tooltip="true">
|
||||
<template #default="scope">{{ scope.row.strainName || scope.row.strainCode || idFallback(scope.row.strainId) }}</template>
|
||||
</el-table-column>
|
||||
<el-table-column label="生产批次" prop="batchNo" min-width="130" :show-overflow-tooltip="true" />
|
||||
<el-table-column label="初始包数" prop="initialPackages" width="100" align="right" />
|
||||
<el-table-column label="剩余包数" prop="remainingPackages" width="100" align="right" />
|
||||
<el-table-column label="更新时间" prop="updatedAt" width="180">
|
||||
<template #default="scope">{{ parseTime(scope.row.updatedAt) }}</template>
|
||||
</el-table-column>
|
||||
</el-table>
|
||||
|
||||
<pagination
|
||||
v-show="total > 0"
|
||||
:total="total"
|
||||
:page="queryParams.pageNum"
|
||||
:limit="queryParams.pageSize"
|
||||
@update:page="handleCurrentChange"
|
||||
@update:limit="handleSizeChange"
|
||||
@pagination="getList"
|
||||
/>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script setup name="ReportPalletInventory">
|
||||
import { listPalletInventory } from '@/api/report/palletInventory'
|
||||
|
||||
const { proxy } = getCurrentInstance()
|
||||
const reportList = ref([])
|
||||
const loading = ref(false)
|
||||
const loadError = ref('')
|
||||
const total = ref(0)
|
||||
const dateRange = ref([])
|
||||
const queryParams = ref({
|
||||
pageNum: 1,
|
||||
pageSize: 10,
|
||||
beginTime: undefined,
|
||||
endTime: undefined,
|
||||
palletCode: undefined,
|
||||
flowState: undefined,
|
||||
warehouseId: undefined,
|
||||
siteId: undefined,
|
||||
lineId: undefined,
|
||||
strainId: undefined,
|
||||
batchNo: undefined
|
||||
})
|
||||
const flowStateOptions = [
|
||||
{ value: 'UNSTOCKED', label: '未入库' },
|
||||
{ value: 'EMPTY_IN_WAREHOUSE', label: '仓库空托盘' },
|
||||
{ value: 'FILLED_IN_WAREHOUSE', label: '仓库有料' },
|
||||
{ value: 'AT_SITE_UNUSED', label: '现场未使用' },
|
||||
{ value: 'AT_SITE_PARTIAL', label: '现场部分使用' },
|
||||
{ value: 'AT_SITE_EMPTY', label: '现场空托盘' },
|
||||
{ value: 'RETURNING', label: '退回中' }
|
||||
]
|
||||
let listGeneration = 0
|
||||
|
||||
function idFallback(id) {
|
||||
return id ? `#${id}` : '—'
|
||||
}
|
||||
|
||||
function flowStateLabel(value) {
|
||||
return flowStateOptions.find((option) => option.value === value)?.label || value || '—'
|
||||
}
|
||||
|
||||
function currentLocation(row) {
|
||||
return row.lineName || row.siteName || row.warehouseName ||
|
||||
idFallback(row.lineId || row.siteId || row.warehouseId)
|
||||
}
|
||||
|
||||
function invalidateListRequest() {
|
||||
listGeneration += 1
|
||||
loading.value = false
|
||||
}
|
||||
|
||||
function isCurrentListRequest(listContext) {
|
||||
return listContext.generation === listGeneration
|
||||
}
|
||||
|
||||
function getList() {
|
||||
const listContext = {
|
||||
generation: ++listGeneration,
|
||||
query: proxy.addDateRange({ ...queryParams.value }, dateRange.value)
|
||||
}
|
||||
loading.value = true
|
||||
loadError.value = ''
|
||||
listPalletInventory(listContext.query).then((response) => {
|
||||
if (!isCurrentListRequest(listContext)) return
|
||||
reportList.value = Array.isArray(response.rows) ? response.rows : []
|
||||
total.value = response.total
|
||||
}).catch(() => {
|
||||
if (!isCurrentListRequest(listContext)) return
|
||||
reportList.value = []
|
||||
total.value = 0
|
||||
loadError.value = '托盘库存报表加载失败,请稍后重试'
|
||||
}).finally(() => {
|
||||
if (!isCurrentListRequest(listContext)) return
|
||||
loading.value = false
|
||||
})
|
||||
}
|
||||
|
||||
function handleQuery() {
|
||||
queryParams.value.pageNum = 1
|
||||
getList()
|
||||
}
|
||||
|
||||
function resetQuery() {
|
||||
dateRange.value = []
|
||||
proxy.resetForm('queryRef')
|
||||
queryParams.value.pageNum = 1
|
||||
getList()
|
||||
}
|
||||
|
||||
function handleSizeChange(pageSize) {
|
||||
queryParams.value.pageSize = pageSize
|
||||
queryParams.value.pageNum = 1
|
||||
}
|
||||
|
||||
function handleCurrentChange(pageNum) {
|
||||
queryParams.value.pageNum = pageNum
|
||||
}
|
||||
|
||||
onBeforeUnmount(() => {
|
||||
invalidateListRequest()
|
||||
})
|
||||
|
||||
getList()
|
||||
</script>
|
||||
Reference in New Issue
Block a user