duxingchen/KCGL
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

出库进行修改，确保可以进行多个样例的出库以及出库的记录展示

Browse Source
This commit is contained in:
dxc
2026-02-05 16:54:11 +08:00
parent 3f6ab3e607
commit c1ddb8093f
6 changed files with 608 additions and 385 deletions
Download Patch File Download Diff File Expand all files Collapse all files

66
inventory-web/src/views/outbound/index.vue
View File

@ -30,7 +30,33 @@
style="width: 100%; margin-top: 20px;"
:header-cell-style="{ background: '#f5f7fa', color: '#606266' }"
>
<el-table-column prop="outbound_no" label="出库单号" min-width="180" show-overflow-tooltip />
<el-table-column type="expand">
<template #default="props">
<div style="padding: 10px 40px; background: #fafafa;">
<h4 style="margin: 0 0 10px 0; color: #409EFF;">商品明细 (按单价降序)</h4>
<el-table :data="props.row.items" border size="small">
<el-table-column prop="sku" label="SKU" width="150" />
<el-table-column prop="name" label="名称" min-width="150" show-overflow-tooltip />
<el-table-column prop="material_type" label="类型" width="120" show-overflow-tooltip />
<el-table-column prop="category" label="类别" width="120" show-overflow-tooltip />
<el-table-column prop="spec_model" label="规格型号" min-width="150" show-overflow-tooltip />
<el-table-column prop="quantity" label="数量" width="100" />
<el-table-column prop="unit_price" label="单价" width="120">
<template #default="{row}">¥{{ row.unit_price }}</template>
</el-table-column>
<el-table-column prop="subtotal" label="小计">
<template #default="{row}">
<span style="color: #F56C6C; font-weight: bold;">¥{{ row.subtotal.toFixed(2) }}</span>
</template>
</el-table-column>
</el-table>
</div>
</template>
</el-table-column>
<el-table-column prop="outbound_no" label="出库单号" min-width="200" show-overflow-tooltip />
<el-table-column prop="outbound_time" label="出库时间" width="170" align="center">
<template #default="{ row }">
@ -44,9 +70,11 @@
</template>
</el-table-column>
<el-table-column prop="sku" label="SKU" min-width="140" show-overflow-tooltip />
<el-table-column prop="quantity" label="数量" width="90" align="center" />
<el-table-column prop="total_amount" label="总金额" width="120" align="right">
<template #default="{ row }">
<span style="color: #F56C6C; font-weight: bold; font-size: 15px;">¥{{ row.total_amount }}</span>
</template>
</el-table-column>
<el-table-column prop="consumer_name" label="领用/客户" min-width="120" show-overflow-tooltip />
@ -76,18 +104,31 @@
</template>
</el-table-column>
</el-table>
<div style="margin-top: 20px; text-align: right;">
<el-pagination
background
layout="prev, pager, next"
:total="total"
:page-size="listQuery.limit"
@current-change="handlePageChange"
/>
</div>
</div>
</template>
<script setup lang="ts">
import { ref, onMounted, reactive } from 'vue'
import { getOutboundList } from '@/api/outbound'
import { Picture } from '@element-plus/icons-vue' // 引入图标用于图片加载失败显示
import { Picture } from '@element-plus/icons-vue'
const list = ref([])
const total = ref(0)
const loading = ref(false)
const listQuery = reactive({
page: 1,
limit: 10,
keyword: '',
dateRange: []
})
@ -95,8 +136,15 @@ const listQuery = reactive({
const fetchData = async () => {
loading.value = true
try {
const res = await getOutboundList(listQuery)
const params = {
...listQuery,
start_date: listQuery.dateRange && listQuery.dateRange[0] ? listQuery.dateRange[0] : null,
end_date: listQuery.dateRange && listQuery.dateRange[1] ? listQuery.dateRange[1] : null
}
const res = await getOutboundList(params)
list.value = res.data.items || []
total.value = res.data.total || 0
} catch (e) {
console.error(e)
} finally {
@ -104,6 +152,11 @@ const fetchData = async () => {
}
}
const handlePageChange = (val: number) => {
listQuery.page = val
fetchData()
}
const formatType = (type: string) => {
const map: any = {
'SALES': '销售出库',
@ -114,7 +167,6 @@ const formatType = (type: string) => {
return map[type] || type
}
// 辅助函数：根据类型返回 Tag 颜色
const getTagType = (type: string) => {
const map: any = {
'SALES': 'success',