Initial commit: 景耀JY1.0项目

This commit is contained in:
Developer
2026-05-21 09:46:02 +08:00
parent 4969870de8
commit fd70670235
90 changed files with 10278 additions and 1508 deletions

View File

@@ -0,0 +1,481 @@
<template>
<div class="app-container">
<el-card style="height: 850px">
<div style="margin-top: 20px; margin-bottom: 20px">
<h2 style="text-align: center; margin-bottom: 20px">仓储汇总</h2>
<el-row :gutter="20">
<el-col :span="8">
<el-card class="stat-card" @click.native="showDetail('待入库')">
<div class="stat-number">{{ statistics.待入库 }}</div>
<div class="stat-label">待入库</div>
</el-card>
</el-col>
<el-col :span="8">
<el-card class="stat-card" @click.native="showDetail('待出库')">
<div class="stat-number">{{ statistics.待出库 }}</div>
<div class="stat-label">待出库</div>
</el-card>
</el-col>
<el-col :span="8">
<el-card class="stat-card" @click.native="showDetail('可出库')">
<div class="stat-number">{{ statistics.可出库 }}</div>
<div class="stat-label">可出库</div>
</el-card>
</el-col>
</el-row>
<el-row :gutter="20" style="margin-top: 20px">
<el-col :span="8">
<el-card class="stat-card" @click.native="showDetail('补货中')">
<div class="stat-number">{{ statistics.补货中 }}</div>
<div class="stat-label">补货中</div>
</el-card>
</el-col>
<el-col :span="8">
<el-card class="stat-card" @click.native="showDetail('生产中')">
<div class="stat-number">{{ statistics.生产中 }}</div>
<div class="stat-label">生产中</div>
</el-card>
</el-col>
<el-col :span="8">
<el-card class="stat-card" @click.native="showDetail('待投产')">
<div class="stat-number">{{ statistics.待投产 }}</div>
<div class="stat-label">待投产</div>
</el-card>
</el-col>
</el-row>
</div>
<div style="margin-top: 20px">
<h3 style="margin-bottom: 10px">{{ currentDetail }}详情</h3>
<el-table
v-loading="loading"
:data="detailData"
highlight-current-row
border
stripe
size="small"
style="width: 100%"
height="400">
<el-table-column
v-for="(column, index) in detailColumns"
:key="index"
:width="column.width"
:label="column.label"
:align="column.align">
<template slot-scope="scope">
{{ scope.row[column.prop] }}
</template>
</el-table-column>
</el-table>
</div>
</el-card>
</div>
</template>
<script>
import { mapGetters } from 'vuex'
export default {
data() {
return {
loading: false,
statistics: {
待入库: 0,
待出库: 0,
可出库: 0,
补货中: 0,
生产中: 0,
待投产: 0
},
currentDetail: '',
detailData: [],
detailColumns: [],
领料单流水号列表: [],
statisticsTimer: null
}
},
computed: {
...mapGetters([
'id',
'token'
])
},
created() {
this.getStatistics()
// 每半小时运行一次getStatistics
this.statisticsTimer = setInterval(() => {
this.getStatistics()
console.log(1)
}, 60 * 1000) // 30分钟 = 30 * 60 * 1000 毫秒
},
beforeDestroy() {
// 清除定时器
if (this.statisticsTimer) {
clearInterval(this.statisticsTimer)
}
},
methods: {
// 获取统计数据
getStatistics() {
this.loading = true
// 待入库数据:采购合同组件中状态为为到货的订单数量
this.getPendingInStorage()
// 待出库数据:物料出库组件中所有领料单还未领的物料种类数量
this.getPendingOutStorage()
// 可出库数据:待出库数据的基础上又库存的数量
this.getAvailableOutStorage()
// 补货中数据:补货件查询组件中状态已到以外的订单数量
this.getReplenishing()
// 生产中数据:补货件查询组件中状态为加工中的订单数量
this.getInProduction()
// 待投产数据:补货件查询组件中状态为未开始的订单数量
this.getPendingProduction()
this.loading = false
},
// 获取待入库数据
getPendingInStorage() {
var param = []
var Data = this.CreateData('11', '仓储管理_补货件查询', param)
this.ExecDatabase(Data).then(response => {
let count = 0
response.data.forEach(item => {
if (item.状态 === '未到' || item.状态 === '加工中' || item.状态 === '部分到') {
count++
}
})
this.statistics.待入库 = count
})
},
// 获取待出库数据
getPendingOutStorage() {
var param = []
var Data = this.CreateData('11', '装配管理_未领完领料单_查询', param)
this.ExecDatabase(Data).then(response => {
// 获取领料单流水号
this.领料单流水号列表 = response.data.map(item => item.领料单流水号)
if (this.领料单流水号列表.length > 0) {
// 用领料单流水号查询物料明细
var param2 = []
param2[0] = ['领料单流水号列表', this.领料单流水号列表]
var Data2 = this.CreateData('11', '装配管理_领料单明细_查询_汇总', param2)
this.ExecDatabase(Data2).then(response2 => {
// 计算物料种类数量
let count = 0
response2.data.forEach(item => {
if (item.已领数 < item.申请数) {
count++
}
})
this.statistics.待出库 = count
})
} else {
this.statistics.待出库 = 0
}
})
},
// 获取可出库数据
getAvailableOutStorage() {
var param = []
var Data = this.CreateData('11', '装配管理_未领完领料单_查询', param)
this.ExecDatabase(Data).then(response => {
// 获取领料单流水号
const 领料单流水号列表 = response.data.map(item => item.领料单流水号)
if (领料单流水号列表.length > 0) {
// 用领料单流水号查询物料明细
var param2 = []
param2[0] = ['领料单流水号列表', 领料单流水号列表]
var Data2 = this.CreateData('11', '装配管理_领料单明细_查询_汇总', param2)
this.ExecDatabase(Data2).then(response2 => {
// 计算库存数不为0的物料种类数量
let count = 0
response2.data.forEach(item => {
// 假设库存数字段名为"库存"或"库存数量"
if (item.已领数 < item.申请数 && item.库存数 > 0) {
count++
}
})
this.statistics.可出库 = count
})
} else {
this.statistics.可出库 = 0
}
})
},
// 获取补货中数据
getReplenishing() {
let count = 0
var param = []
var Data = this.CreateData('11', '仓储管理_补货件查询', param)
this.ExecDatabase(Data).then(response => {
response.data.forEach(item => {
if (item.状态 !== '已到' && item.状态 !== '完成' && item.状态 !== '已完成' && item.状态 !== '入库' && item.状态 !== '已编制') {
count++
}
})
this.statistics.补货中 = count
})
},
// 获取生产中数据
getInProduction() {
var param = []
var Data = this.CreateData('11', '仓储管理_补货件查询', param)
this.ExecDatabase(Data).then(response => {
let count = 0
response.data.forEach(item => {
if (item.状态 === '加工中') {
count++
}
})
this.statistics.生产中 = count
})
},
// 获取待投产数据
getPendingProduction() {
var param = []
var Data = this.CreateData('11', '仓储管理_补货件查询', param)
this.ExecDatabase(Data).then(response => {
let count = 0
response.data.forEach(item => {
if (item.状态 === '未开始') {
count++
}
})
this.statistics.待投产 = count
})
},
// 显示详情
showDetail(type) {
this.currentDetail = type
this.loading = true
switch (type) {
case '待入库':
this.getPendingInStorageDetail()
break
case '待出库':
this.getPendingOutStorageDetail()
break
case '可出库':
this.getAvailableOutStorageDetail()
break
case '补货中':
this.getReplenishingDetail()
break
case '生产中':
this.getInProductionDetail()
break
case '待投产':
this.getPendingProductionDetail()
break
}
},
// 获取待入库详情
getPendingInStorageDetail() {
var param = []
var Data = this.CreateData('11', '仓储管理_补货件查询', param)
this.ExecDatabase(Data).then(response => {
this.detailData = response.data.filter(item => item.状态 === '未到' || item.状态 === '加工中' || item.状态 === '部分到')
this.detailColumns = [
{ prop: '补货单号', label: '补货单号', width: '150px', align: 'center' },
{ prop: '补货人', label: '补货人', width: '100px', align: 'center' },
{ prop: '状态', label: '状态', width: '120px', align: 'center' },
{ prop: '补货日期', label: '补货日期', width: '150px', align: 'center' },
{ prop: '补货期限', label: '补货期限', width: '180px', align: 'center' }
]
this.loading = false
})
},
// 获取待出库详情
getPendingOutStorageDetail() {
var param = []
param[0] = ['领料单流水号列表', this.领料单流水号列表]
var Data = this.CreateData('11', '装配管理_领料单明细_查询_汇总', param)
this.ExecDatabase(Data).then(response => {
this.detailData = response.data.filter(item => (item.已领数 || 0) < (item.申请数 || 0))
this.detailColumns = [
{ prop: '领料单号', label: '领料单号', width: '100px', align: 'center' },
{ prop: '物料名称', label: '物料名称', width: '150px', align: 'center' },
{ prop: '图号或型号', label: '图号或型号', width: '150px', align: 'center' },
{ prop: '货位名称', label: '库位', width: '180px', align: 'center' },
{ prop: '库存数', label: '库存数', width: '100px', align: 'center' },
{ prop: '申请数', label: '申请数', width: '100px', align: 'center' },
{ prop: '已领数', label: '已领数', width: '100px', align: 'center' }
]
this.loading = false
})
},
// 获取可出库详情
getAvailableOutStorageDetail() {
var param = []
param[0] = ['领料单流水号列表', this.领料单流水号列表]
var Data = this.CreateData('11', '装配管理_领料单明细_查询_汇总', param)
this.ExecDatabase(Data).then(response => {
this.detailData = response.data.filter(item => item.已领数 < item.申请数 && item.库存数 > 0)
this.detailColumns = [
{ prop: '领料单号', label: '领料单号', width: '100px', align: 'center' },
{ prop: '物料名称', label: '物料名称', width: '150px', align: 'center' },
{ prop: '图号或型号', label: '图号或型号', width: '150px', align: 'center' },
{ prop: '货位名称', label: '库位', width: '180px', align: 'center' },
{ prop: '库存数', label: '库存数', width: '100px', align: 'center' },
{ prop: '申请数', label: '申请数', width: '100px', align: 'center' },
{ prop: '已领数', label: '已领数', width: '100px', align: 'center' }
]
this.loading = false
})
},
// 获取补货中详情
getReplenishingDetail() {
var param = []
var Data = this.CreateData('11', '仓储管理_补货件查询', param)
this.ExecDatabase(Data).then(response => {
this.detailData = response.data.filter(item => item.状态 !== '已到' && item.状态 !== '完成' && item.状态 !== '已完成' && item.状态 !== '入库' && item.状态 !== '已编制')
this.detailColumns = [
{ prop: '补货单号', label: '补货单号', width: '150px', align: 'center' },
{ prop: '名称', label: '物料名称', width: '180px', align: 'center' },
{ prop: '补货数', label: '补货数量', width: '100px', align: 'center' },
{ prop: '状态', label: '状态', width: '100px', align: 'center' },
{ prop: '补货日期', label: '补货日期', width: '150px', align: 'center' },
{ prop: '补货期限', label: '补货期限', width: '150px', align: 'center' }
]
this.loading = false
})
},
// 获取生产中详情
getInProductionDetail() {
var param = []
var Data = this.CreateData('11', '仓储管理_补货件查询', param)
this.ExecDatabase(Data).then(response => {
this.detailData = response.data.filter(item => item.状态 === '加工中')
this.detailColumns = [
{ prop: '补货单号', label: '补货单号', width: '150px', align: 'center' },
{ prop: '名称', label: '物料名称', width: '180px', align: 'center' },
{ prop: '补货数', label: '补货数量', width: '100px', align: 'center' },
{ prop: '状态', label: '状态', width: '100px', align: 'center' },
{ prop: '补货日期', label: '补货日期', width: '150px', align: 'center' },
{ prop: '补货期限', label: '补货期限', width: '150px', align: 'center' }
]
this.loading = false
})
},
// 获取待投产详情
getPendingProductionDetail() {
var param = []
var Data = this.CreateData('11', '仓储管理_补货件查询', param)
this.ExecDatabase(Data).then(response => {
this.detailData = response.data.filter(item => item.状态 === '未开始')
this.detailColumns = [
{ prop: '补货单号', label: '补货单号', width: '150px', align: 'center' },
{ prop: '名称', label: '物料名称', width: '180px', align: 'center' },
{ prop: '补货数', label: '补货数量', width: '100px', align: 'center' },
{ prop: '状态', label: '状态', width: '100px', align: 'center' },
{ prop: '补货日期', label: '补货日期', width: '150px', align: 'center' },
{ prop: '补货期限', label: '补货期限', width: '150px', align: 'center' }
]
this.loading = false
})
}
}
}
</script>
<style scoped>
.stat-card {
height: 120px;
cursor: pointer;
transition: all 0.3s ease;
text-align: center;
padding: 10px 0;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
border-radius: 4px;
background-color: #fff;
}
.stat-card:hover {
transform: translateY(-5px);
box-shadow: 0 10px 20px rgba(0, 0, 0, 0.1);
}
.stat-number {
font-size: 24px;
font-weight: bold;
text-align: center;
margin-top: 15px;
color: #303133;
}
.stat-label {
font-size: 12px;
text-align: center;
margin-top: 8px;
color: #909399;
}
.summary-card {
height: 100px;
display: flex;
align-items: center;
justify-content: center;
box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
border-radius: 4px;
background-color: #fff;
}
.summary-label {
font-size: 14px;
color: #303133;
}
.el-card {
border: 1px solid #e4e7ed;
border-radius: 4px;
}
.el-card__body {
padding: 20px;
}
/* 为不同类型的卡片设置不同的颜色 */
.stat-card:nth-child(1) .stat-number {
color: #4caf50;
}
.stat-card:nth-child(2) .stat-number {
color: #ff9800;
}
.stat-card:nth-child(3) .stat-number {
color: #2196f3;
}
.stat-card:nth-child(4) .stat-number {
color: #9c27b0;
}
.stat-card:nth-child(5) .stat-number {
color: #e91e63;
}
.stat-card:nth-child(6) .stat-number {
color: #607d8b;
}
</style>