rev:库存分析
This commit is contained in:
345
lms/nladmin-ui/src/views/wms/statement/outsideivt/index.vue
Normal file
345
lms/nladmin-ui/src/views/wms/statement/outsideivt/index.vue
Normal file
@@ -0,0 +1,345 @@
|
||||
<template>
|
||||
<div class="app-container">
|
||||
<!--工具栏-->
|
||||
<div class="head-container">
|
||||
<div class="summary-container">
|
||||
<div class="summary-card">
|
||||
<div class="summary-label">总库存</div>
|
||||
<div class="summary-value">{{ formatNum(summary.total_qty) }} <span class="summary-unit">KG</span></div>
|
||||
<div class="summary-section">
|
||||
<div class="summary-list">
|
||||
<div class="summary-list-header">
|
||||
<span class="summary-list-head">区域</span>
|
||||
<span class="summary-list-head">总量</span>
|
||||
<span class="summary-list-head">折钨</span>
|
||||
</div>
|
||||
<div v-for="item in displayRegionTotalList" :key="item.region_code || item.region_name" class="summary-list-row">
|
||||
<span class="summary-list-name">{{ item.region_name }}</span>
|
||||
<span class="summary-list-value">{{ formatNum(item.value) }} <span class="summary-unit">KG</span></span>
|
||||
<span class="summary-list-value">{{ formatNum(getEquivalentWeight(item)) }} <span class="summary-unit">KG</span></span>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="crud.props.searchToggle">
|
||||
<!-- 搜索 -->
|
||||
<el-form
|
||||
:inline="true"
|
||||
class="demo-form-inline"
|
||||
label-position="right"
|
||||
label-width="90px"
|
||||
label-suffix=":"
|
||||
>
|
||||
<el-form-item label="区域">
|
||||
<el-select
|
||||
v-model="query.region_code"
|
||||
clearable
|
||||
filterable
|
||||
size="mini"
|
||||
placeholder="区域类型"
|
||||
class="filter-item"
|
||||
style="width: 200px;"
|
||||
@clear="handleClear"
|
||||
@change="hand"
|
||||
>
|
||||
<el-option
|
||||
v-for="item in regionList"
|
||||
:key="item.region_code"
|
||||
:label="item.region_name"
|
||||
:value="item.region_code"
|
||||
/>
|
||||
</el-select>
|
||||
</el-form-item>
|
||||
<el-form-item label="点位搜索">
|
||||
<el-input
|
||||
v-model="query.point_code"
|
||||
clearable
|
||||
size="small"
|
||||
placeholder="点位编码或名称"
|
||||
style="width: 200px;"
|
||||
class="filter-item"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="物料搜索">
|
||||
<el-input
|
||||
v-model="query.material_code"
|
||||
clearable
|
||||
size="small"
|
||||
placeholder="物料编码、名称或规格"
|
||||
style="width: 200px;"
|
||||
class="filter-item"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="批次号">
|
||||
<el-input
|
||||
v-model="query.pcsn"
|
||||
clearable
|
||||
size="small"
|
||||
placeholder="批次号"
|
||||
style="width: 200px;"
|
||||
class="filter-item"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="载具号">
|
||||
<el-input
|
||||
v-model="query.storagevehicle_code"
|
||||
clearable
|
||||
size="small"
|
||||
placeholder="载具号"
|
||||
style="width: 200px;"
|
||||
class="filter-item"
|
||||
/>
|
||||
</el-form-item>
|
||||
<rrOperation :crud="crud" />
|
||||
</el-form>
|
||||
</div>
|
||||
<crudOperation :permission="permission">
|
||||
<el-button
|
||||
slot="right"
|
||||
class="filter-item"
|
||||
type="success"
|
||||
icon="el-icon-download"
|
||||
size="mini"
|
||||
:loading="exportLoading"
|
||||
@click="downdtl"
|
||||
>
|
||||
导出
|
||||
</el-button>
|
||||
</crudOperation>
|
||||
<el-table
|
||||
ref="table"
|
||||
v-loading="crud.loading"
|
||||
:data="crud.data"
|
||||
size="mini"
|
||||
style="width: 100%;"
|
||||
@selection-change="crud.selectionChangeHandler"
|
||||
>
|
||||
<el-table-column prop="point_code" label="点位编码" :min-width="flexWidth('point_code',crud.data,'点位编码')" />
|
||||
<el-table-column prop="point_name" label="点位名称" :min-width="flexWidth('point_name',crud.data,'点位名称')" />
|
||||
<el-table-column prop="region_name" label="区域" :min-width="flexWidth('region_name',crud.data,'区域')" />
|
||||
<el-table-column prop="material_code" label="物料编码" :min-width="flexWidth('material_code',crud.data,'物料编码')" />
|
||||
<el-table-column prop="material_name" label="物料名称" :min-width="flexWidth('material_name',crud.data,'物料名称')" />
|
||||
<el-table-column prop="batch_no" label="批次" :min-width="flexWidth('batch_no',crud.data,'批次')" />
|
||||
<el-table-column prop="storagevehicle_code" label="载具号" :min-width="flexWidth('storagevehicle_code',crud.data,'载具号')" />
|
||||
<el-table-column prop="weight" label="重量" :formatter="crud.formatNum3" :min-width="100" />
|
||||
<el-table-column prop="qty_unit_name" label="计量单位" :min-width="flexWidth('qty_unit_name',crud.data,'计量单位')" />
|
||||
</el-table>
|
||||
<pagination />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
|
||||
<script>
|
||||
import crudOutsideivt from '@/views/wms/statement/outsideivt/outsideivt'
|
||||
import CRUD, { presenter, header, crud } from '@crud/crud'
|
||||
import rrOperation from '@crud/RR.operation'
|
||||
import crudOperation from '@crud/CRUD.operation'
|
||||
import pagination from '@crud/Pagination'
|
||||
import crudSchBaseRegion from '@/views/wms/sch/region/schBaseRegion'
|
||||
import { download } from '@/api/data'
|
||||
import { downloadFile } from '@/utils'
|
||||
|
||||
export default {
|
||||
name: 'Outsideivt',
|
||||
components: { pagination, crudOperation, rrOperation },
|
||||
mixins: [presenter(), header(), crud()],
|
||||
cruds() {
|
||||
return CRUD({
|
||||
title: '库外库存', url: 'api/outsideivt', idField: 'storagevehicleext_id', sort: 'storagevehicleext_id,desc',
|
||||
optShow: {
|
||||
add: false,
|
||||
edit: false,
|
||||
showDtlLoading: false,
|
||||
del: false,
|
||||
download: false,
|
||||
reset: true
|
||||
},
|
||||
crudMethod: { ...crudOutsideivt }
|
||||
})
|
||||
},
|
||||
data() {
|
||||
return {
|
||||
regionList: [],
|
||||
permission: {},
|
||||
rules: {},
|
||||
exportLoading: false,
|
||||
summary: {
|
||||
total_qty: 0,
|
||||
available_qty: 0,
|
||||
frozen_qty: 0,
|
||||
vehicle_count: 0,
|
||||
material_count: 0,
|
||||
region_total_list: []
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
this.getRegionList()
|
||||
},
|
||||
computed: {
|
||||
displayRegionTotalList() {
|
||||
if (this.summary.region_total_list && this.summary.region_total_list.length) {
|
||||
return this.summary.region_total_list
|
||||
}
|
||||
const regionCode = this.query && this.query.region_code
|
||||
if (regionCode) {
|
||||
const region = this.regionList.find(item => item.region_code === regionCode)
|
||||
return [{
|
||||
region_code: regionCode,
|
||||
region_name: region ? region.region_name : regionCode,
|
||||
value: 0
|
||||
}]
|
||||
}
|
||||
return [{
|
||||
region_code: 'empty',
|
||||
region_name: '全部区域',
|
||||
value: 0
|
||||
}]
|
||||
}
|
||||
},
|
||||
methods: {
|
||||
[CRUD.HOOK.beforeRefresh]() {
|
||||
this.fetchSummary()
|
||||
return true
|
||||
},
|
||||
formatNum(value) {
|
||||
const num = Number(value || 0)
|
||||
return num.toFixed(3).replace(/\.?0+$/, '')
|
||||
},
|
||||
getEquivalentWeight(item) {
|
||||
const qty = Number(item && item.value ? item.value : 0)
|
||||
const regionName = item && item.region_name ? item.region_name : ''
|
||||
return qty * this.getEquivalentWeightFactor(regionName)
|
||||
},
|
||||
getEquivalentWeightFactor(regionName) {
|
||||
if (!regionName) {
|
||||
return 1
|
||||
}
|
||||
if (regionName.includes('超细还原炉') || regionName.includes('中粗还原炉')) {
|
||||
return 0.793
|
||||
}
|
||||
return 1
|
||||
},
|
||||
fetchSummary() {
|
||||
crudOutsideivt.getSummary(this.query).then(res => {
|
||||
this.summary = Object.assign({}, this.summary, res || {})
|
||||
}).catch(() => {
|
||||
this.summary = {
|
||||
total_qty: 0,
|
||||
available_qty: 0,
|
||||
frozen_qty: 0,
|
||||
vehicle_count: 0,
|
||||
material_count: 0,
|
||||
region_total_list: []
|
||||
}
|
||||
})
|
||||
},
|
||||
hand(value) {
|
||||
this.crud.toQuery()
|
||||
},
|
||||
getRegionList() {
|
||||
crudSchBaseRegion.getRegionList().then(res => {
|
||||
this.regionList = res
|
||||
})
|
||||
},
|
||||
handleClear() {
|
||||
this.crud.query.region_code = null
|
||||
this.hand()
|
||||
},
|
||||
querytable() {
|
||||
this.crud.toQuery()
|
||||
},
|
||||
downdtl() {
|
||||
this.exportLoading = true
|
||||
download('/api/outsideivt/download', this.crud.query).then(result => {
|
||||
downloadFile(result, '库外库存', 'xlsx')
|
||||
this.exportLoading = false
|
||||
}).catch(() => {
|
||||
this.exportLoading = false
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.summary-container {
|
||||
display: flex;
|
||||
justify-content: center;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.summary-card {
|
||||
padding: 14px 16px;
|
||||
border: 1px solid #ebeef5;
|
||||
border-radius: 4px;
|
||||
background: #fff;
|
||||
width: 100%;
|
||||
max-width: 760px;
|
||||
}
|
||||
|
||||
.summary-section {
|
||||
margin-top: 16px;
|
||||
}
|
||||
|
||||
.summary-label {
|
||||
margin-bottom: 8px;
|
||||
color: #909399;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.summary-value {
|
||||
color: #303133;
|
||||
font-size: 24px;
|
||||
font-weight: 600;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
.summary-list {
|
||||
display: flex;
|
||||
flex-direction: column;
|
||||
gap: 8px;
|
||||
}
|
||||
|
||||
.summary-list-header,
|
||||
.summary-list-row {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, minmax(0, 1fr));
|
||||
align-items: baseline;
|
||||
column-gap: 12px;
|
||||
}
|
||||
|
||||
.summary-list-header {
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
.summary-list-head {
|
||||
color: #606266;
|
||||
}
|
||||
|
||||
.summary-list-name {
|
||||
color: #606266;
|
||||
font-size: 14px;
|
||||
}
|
||||
|
||||
.summary-list-value {
|
||||
color: #303133;
|
||||
font-size: 18px;
|
||||
font-weight: 600;
|
||||
}
|
||||
|
||||
.summary-unit {
|
||||
margin-left: 4px;
|
||||
color: #606266;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.summary-container {
|
||||
display: block;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
@@ -0,0 +1,34 @@
|
||||
import request from '@/utils/request'
|
||||
|
||||
export function getSummary(params) {
|
||||
return request({
|
||||
url: 'api/outsideivt/summary',
|
||||
method: 'get',
|
||||
params
|
||||
})
|
||||
}
|
||||
|
||||
export default {
|
||||
add(data) {
|
||||
return request({
|
||||
url: 'api/outsideivt',
|
||||
method: 'post',
|
||||
data
|
||||
})
|
||||
},
|
||||
edit(data) {
|
||||
return request({
|
||||
url: 'api/outsideivt',
|
||||
method: 'put',
|
||||
data
|
||||
})
|
||||
},
|
||||
del(ids) {
|
||||
return request({
|
||||
url: 'api/outsideivt/',
|
||||
method: 'delete',
|
||||
data: ids
|
||||
})
|
||||
},
|
||||
getSummary
|
||||
}
|
||||
@@ -2,6 +2,20 @@
|
||||
<div class="app-container">
|
||||
<!--工具栏-->
|
||||
<div class="head-container">
|
||||
<div class="summary-container">
|
||||
<div class="summary-card">
|
||||
<div class="summary-label">总库存</div>
|
||||
<div class="summary-value">{{ formatNum(summary.total_qty) }} <span class="summary-unit">KG</span></div>
|
||||
</div>
|
||||
<div class="summary-card">
|
||||
<div class="summary-label">可用库存</div>
|
||||
<div class="summary-value">{{ formatNum(summary.available_qty) }} <span class="summary-unit">KG</span></div>
|
||||
</div>
|
||||
<div class="summary-card">
|
||||
<div class="summary-label">冻结库存</div>
|
||||
<div class="summary-value">{{ formatNum(summary.frozen_qty) }} <span class="summary-unit">KG</span></div>
|
||||
</div>
|
||||
</div>
|
||||
<div v-if="crud.props.searchToggle">
|
||||
<!-- 搜索 -->
|
||||
<el-form
|
||||
@@ -52,22 +66,32 @@
|
||||
class="filter-item"
|
||||
/>
|
||||
</el-form-item>
|
||||
<el-form-item label="载具号">
|
||||
<el-input
|
||||
v-model="query.storagevehicle_code"
|
||||
clearable
|
||||
size="small"
|
||||
placeholder="载具号"
|
||||
style="width: 200px;"
|
||||
class="filter-item"
|
||||
/>
|
||||
</el-form-item>
|
||||
<rrOperation :crud="crud" />
|
||||
</el-form>
|
||||
</div>
|
||||
<!--如果想在工具栏加入更多按钮，可以使用插槽方式， slot = 'left' or 'right'-->
|
||||
<crudOperation :permission="permission">
|
||||
<!-- <el-button
|
||||
<el-button
|
||||
slot="right"
|
||||
class="filter-item"
|
||||
type="success"
|
||||
icon="el-icon-check"
|
||||
icon="el-icon-download"
|
||||
size="mini"
|
||||
:loading="showDtlLoading"
|
||||
:loading="exportLoading"
|
||||
@click="downdtl"
|
||||
>
|
||||
导出Excel
|
||||
</el-button>-->
|
||||
导出
|
||||
</el-button>
|
||||
</crudOperation>
|
||||
<!--表格渲染-->
|
||||
<el-table
|
||||
@@ -95,7 +119,7 @@
|
||||
<el-table-column prop="frozen_qty" label="冻结数" :formatter="crud.formatNum3" :min-width="100" />
|
||||
<el-table-column prop="qty_unit_name" label="计量单位" :min-width="flexWidth('qty_unit_name',crud.data,'计量单位')" />
|
||||
<el-table-column prop="remark" label="备注" :min-width="flexWidth('remark',crud.data,'备注')" />
|
||||
<el-table-column prop="create_time" label="入库时间" :min-width="flexWidth('insert_time',crud.data,'入库时间')" />
|
||||
<el-table-column prop="create_time" label="入库时间" width="170" />
|
||||
<el-table-column prop="supp_code" label="供应商编码" :min-width="flexWidth('supp_code',crud.data,'供应商编码')" />
|
||||
<el-table-column prop="supp_name" label="供应商名称" :min-width="flexWidth('supp_name',crud.data,'供应商名称')" />
|
||||
</el-table>
|
||||
@@ -137,7 +161,15 @@ export default {
|
||||
return {
|
||||
sects: [],
|
||||
permission: {},
|
||||
rules: {}
|
||||
rules: {},
|
||||
exportLoading: false,
|
||||
summary: {
|
||||
total_qty: 0,
|
||||
available_qty: 0,
|
||||
frozen_qty: 0,
|
||||
vehicle_count: 0,
|
||||
material_count: 0
|
||||
}
|
||||
}
|
||||
},
|
||||
created() {
|
||||
@@ -148,8 +180,26 @@ export default {
|
||||
methods: {
|
||||
// 钩子：在获取表格数据之前执行，false 则代表不获取数据
|
||||
[CRUD.HOOK.beforeRefresh]() {
|
||||
this.fetchSummary()
|
||||
return true
|
||||
},
|
||||
formatNum(value) {
|
||||
const num = Number(value || 0)
|
||||
return num.toFixed(3).replace(/\.?0+$/, '')
|
||||
},
|
||||
fetchSummary() {
|
||||
crudStructivt.getSummary(this.query).then(res => {
|
||||
this.summary = Object.assign({}, this.summary, res || {})
|
||||
}).catch(() => {
|
||||
this.summary = {
|
||||
total_qty: 0,
|
||||
available_qty: 0,
|
||||
frozen_qty: 0,
|
||||
vehicle_count: 0,
|
||||
material_count: 0
|
||||
}
|
||||
})
|
||||
},
|
||||
hand(value) {
|
||||
this.crud.toQuery()
|
||||
},
|
||||
@@ -172,20 +222,62 @@ export default {
|
||||
this.crud.toQuery()
|
||||
},
|
||||
downdtl() {
|
||||
if (this.currentRow !== null) {
|
||||
this.showDtlLoading = true
|
||||
download('/api/structivt/download', this.crud.query).then(result => {
|
||||
downloadFile(result, '成品库存', 'xlsx')
|
||||
this.showDtlLoading = false
|
||||
}).catch(() => {
|
||||
this.showDtlLoading = false
|
||||
})
|
||||
}
|
||||
this.exportLoading = true
|
||||
download('/api/structivt/download', this.crud.query).then(result => {
|
||||
downloadFile(result, '库内库存', 'xlsx')
|
||||
this.exportLoading = false
|
||||
}).catch(() => {
|
||||
this.exportLoading = false
|
||||
})
|
||||
}
|
||||
}
|
||||
}
|
||||
</script>
|
||||
|
||||
<style scoped>
|
||||
.summary-container {
|
||||
display: grid;
|
||||
grid-template-columns: repeat(3, minmax(220px, 1fr));
|
||||
gap: 12px;
|
||||
margin-bottom: 16px;
|
||||
}
|
||||
|
||||
.summary-card {
|
||||
padding: 14px 16px;
|
||||
border: 1px solid #ebeef5;
|
||||
border-radius: 4px;
|
||||
background: #fff;
|
||||
}
|
||||
|
||||
.summary-label {
|
||||
margin-bottom: 8px;
|
||||
color: #909399;
|
||||
font-size: 13px;
|
||||
}
|
||||
|
||||
.summary-value {
|
||||
color: #303133;
|
||||
font-size: 24px;
|
||||
font-weight: 600;
|
||||
line-height: 1.2;
|
||||
}
|
||||
|
||||
.summary-unit {
|
||||
margin-left: 4px;
|
||||
color: #606266;
|
||||
font-size: 14px;
|
||||
font-weight: 500;
|
||||
}
|
||||
|
||||
@media (max-width: 1200px) {
|
||||
.summary-container {
|
||||
grid-template-columns: repeat(2, minmax(180px, 1fr));
|
||||
}
|
||||
}
|
||||
|
||||
@media (max-width: 768px) {
|
||||
.summary-container {
|
||||
grid-template-columns: 1fr;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
|
||||
@@ -62,4 +62,12 @@ export function excelImport(data) {
|
||||
})
|
||||
}
|
||||
|
||||
export default { add, edit, del, getStruct, getStructById, getUnits, save, excelImport }
|
||||
export function getSummary(params) {
|
||||
return request({
|
||||
url: 'api/structivt/summary',
|
||||
method: 'get',
|
||||
params
|
||||
})
|
||||
}
|
||||
|
||||
export default { add, edit, del, getStruct, getStructById, getUnits, save, excelImport, getSummary }
|
||||
|
||||
Reference in New Issue
Block a user