仓库质检数据看板

This commit is contained in:
2024-08-14 14:58:07 +08:00
parent abdb4bc3fb
commit 78b2e0a335
3 changed files with 339 additions and 7 deletions

View File

@@ -0,0 +1,323 @@
<template>
<div class="main-box">
<div class="box-left box-column">
<el-card class="card-type-2">
<div class="card-header">数据统计</div>
<div class="box-column">
<span class="left-span-header">产线</span>
<div class="left-span">
<span class="span-text-1">产线上件总数</span>
<span class="span-num-1">{{ boardData.productRequireTotal }}</span>
</div>
<span class="left-span-header">抛光仓库</span>
<div class="left-span">
<span class="span-text-1">抛光仓库零件数</span>
<span class="span-num-1">{{ boardData.polishWarehouseTotal }}</span>
</div>
<div class="left-span">
<span class="span-text-1">抛光投入总数</span>
<span class="span-num-1">{{ boardData.polishRequireTotal }}</span>
</div>
<div class="left-span">
<span class="span-text-1">后道检验投入总数</span>
<span class="span-num-1">{{ boardData.afterPolishRequireTotal }}</span>
</div>
<span class="left-span-header">一次合格品仓库</span>
<div class="left-span">
<span class="span-text-1">一次合格品仓库零件数</span>
<span class="span-num-1">{{ boardData.oneTimeWarehouseTotal }}</span>
</div>
<div class="left-span">
<span class="span-text-1">GP12检测投入数</span>
<span class="span-num-1">{{ boardData.gP12RequireTotal }}</span>
</div>
<span class="left-span-header">成品仓库</span>
<div class="left-span">
<span class="span-text-1">成品仓库零件数</span>
<span class="span-num-1">{{ boardData.finishProductPartTotal }}</span>
</div>
<div class="left-span">
<span class="span-text-1">成品仓库箱数</span>
<span class="span-num-1">{{ boardData.finishProductPackageTotal }}</span>
</div>
<div class="left-span">
<span class="span-text-1">成品仓库出库零件数</span>
<span class="span-num-1">{{ boardData.finishProductPartOutTotal }}</span>
</div>
<div class="left-span">
<span class="span-text-1">成品仓库出库箱数</span>
<span class="span-num-1">{{ boardData.finishProductPackageOutTotal }}</span>
</div>
</div>
</el-card>
</div>
<div class="box-right box-column">
<div class="box-row">
<el-card class="card-type-1">
<div>
<span class="span-text-1">全部打磨总数</span>
<span class="span-num-1">{{ boardData.sandingTotal }}</span>
</div>
</el-card>
<el-card class="card-type-1">
<div>
<span class="span-text-1">全部报废总数</span>
<span class="span-num-1 color-red">{{ boardData.discardTotal }}</span>
</div>
</el-card>
</div>
<el-card class="card-type-3">
<div class="card-header">产线检验</div>
<div class="right-text-box">
<div>
<span class="span-text-1">合格总数</span>
<span class="span-num-1">{{ boardData.productQualifiedTotal }}</span>
</div>
<div>
<span class="span-text-1">抛光总数</span>
<span class="span-num-1">{{ boardData.productPolishTotal }}</span>
</div>
<div>
<span class="span-text-1">打磨总数</span>
<span class="span-num-1">{{ boardData.productSandingTotal }}</span>
</div>
<div>
<span class="span-text-1">报废总数</span>
<span class="span-num-1">{{ boardData.productDiscardTotal }}</span>
</div>
</div>
</el-card>
<el-card class="card-type-3">
<div class="card-header">抛光操作</div>
<div class="right-text-box">
<div>
<span class="span-text-1">合格总数</span>
<span class="span-num-1">{{ boardData.polishQualifiedTotal }}</span>
</div>
<div>
<span class="span-text-1">打磨总数</span>
<span class="span-num-1">{{ boardData.polishSandingTotal }}</span>
</div>
<div>
<span class="span-text-1">报废总数</span>
<span class="span-num-1">{{ boardData.polishDiscardTotal }}</span>
</div>
</div>
</el-card>
<el-card class="card-type-3">
<div class="card-header">后道检验</div>
<div class="right-text-box">
<div>
<span class="span-text-1">合格总数</span>
<span class="span-num-1">{{ boardData.afterPolishQualifiedTotal }}</span>
</div>
<div>
<span class="span-text-1">抛光总数</span>
<span class="span-num-1">{{ boardData.afterPolishPolishTotal }}</span>
</div>
<div>
<span class="span-text-1">打磨总数</span>
<span class="span-num-1">{{ boardData.afterPolishSandingTotal }}</span>
</div>
<div>
<span class="span-text-1">报废总数</span>
<span class="span-num-1">{{ boardData.afterPolishDiscardTotal }}</span>
</div>
</div>
</el-card>
<el-card class="card-type-3">
<div class="card-header">GP12检验</div>
<div class="right-text-box">
<div>
<span class="span-text-1">合格总数</span>
<span class="span-num-1">{{ boardData.gP12QualifiedTotal }}</span>
</div>
<div>
<span class="span-text-1">抛光总数</span>
<span class="span-num-1">{{ boardData.gP12PolishTotal }}</span>
</div>
<div>
<span class="span-text-1">打磨总数</span>
<span class="span-num-1">{{ boardData.gP12SandingTotal }}</span>
</div>
<div>
<span class="span-text-1">报废总数</span>
<span class="span-num-1">{{ boardData.gP12DiscardTotal }}</span>
</div>
</div>
</el-card>
</div>
</div>
</template>
<script>
import { GetProductAndPolishAndOneTimeFqcBoardData } from '@/api/qualityManagement/commonFQC.js'
export default {
name: 'FqcWarehouseBoard',
data() {
return {
loading: false,
timer1: null,
boardData: {
sandingTotal: 0,
discardTotal: 0,
productRequireTotal: 0,
productQualifiedTotal: 0,
productPolishTotal: 0,
productSandingTotal: 0,
productDiscardTotal: 0,
polishWarehouseTotal: 0,
polishRequireTotal: 0,
polishQualifiedTotal: 0,
polishSandingTotal: 0,
polishDiscardTotal: 0,
afterPolishRequireTotal: 0,
afterPolishQualifiedTotal: 0,
afterPolishPolishTotal: 0,
afterPolishSandingTotal: 0,
afterPolishDiscardTotal: 0,
oneTimeWarehouseTotal: 0,
gP12RequireTotal: 0,
gP12QualifiedTotal: 0,
gP12PolishTotal: 0,
gP12SandingTotal: 0,
gP12DiscardTotal: 0,
finishProductPartTotal: 0,
finishProductPackageTotal: 0,
finishProductPartOutTotal: 0,
finishProductPackageOutTotal: 0,
remark: '',
updatedTime: '',
},
}
},
created() {
// 列表数据查询
this.getList()
},
mounted() {
this.createTimer()
},
unmounted() {
this.clearTimer()
},
methods: {
// 查询数据
getList() {
this.loading = true
GetProductAndPolishAndOneTimeFqcBoardData().then((res) => {
if (res.code == 200) {
this.boardData = res.data
}
})
},
// 自动获取数据
clearTimer() {
clearInterval(this.timer1)
this.timer1 = null
},
createTimer() {
this.clearTimer()
this.timer1 = setInterval(() => {
getList()
}, 1000 * 60 * 10)
},
},
}
</script>
<style scoped>
.color-red {
color: #f56c6c;
}
.color-green {
color: #67c23a;
}
.main-box {
width: 100%;
height: 100vh - 60px;
display: flex;
flex-direction: row;
background-color: #e6e8eb;
}
.box-left {
width: 30%;
height: 100vh - 60px;
}
.box-right {
width: 70%;
height: 100%;
}
.card-header {
width: 100%;
font-size: 20px;
font-weight: bold;
margin-bottom: 20px;
}
.box-row {
display: flex;
flex-direction: row;
}
.box-column {
display: flex;
flex-direction: column;
}
.card-type-1 {
width: 50%;
height: 80px;
margin: 10px;
display: flex;
align-items: center;
justify-content: center;
}
.card-type-2 {
height: 100%;
margin: 10px;
display: flex;
flex-direction: column;
}
.card-type-3 {
height: 120px;
margin: 10px;
display: flex;
flex-direction: column;
}
.span-text-1 {
font-size: 16px;
color: #909399;
}
.span-num-1 {
font-size: 24px;
color: #303133;
margin-left: 10px;
}
.right-text-box {
width: 100%;
display: grid;
grid-template-columns: repeat(4, 1fr); /* 创建4个等宽的列 */
gap: 10px; /* 列之间的间隔 */
}
@media (max-width: 900px) {
.right-text-box {
width: 100%;
display: grid;
grid-template-columns: repeat(2, 1fr); /* 创建4个等宽的列 */
gap: 10px; /* 列之间的间隔 */
}
}
.left-span-header {
font-size: 18px;
margin-top: 10px;
margin-bottom: 10px;
}
.left-span {
display: flex;
flex-direction: row;
align-items: center;
justify-content: space-between;
}
.border {
border: 1px solid #000000;
}
</style>

View File

@@ -37,9 +37,9 @@
<el-form-item label="创建人" prop="createBy">
<el-input v-model.trim="queryParams.createBy" placeholder="请输入创建人" clearable />
</el-form-item>
<el-form-item label="班组" prop="team">
<!-- <el-form-item label="班组" prop="team">
<el-input v-model.trim="queryParams.team" placeholder="请输入班组" clearable />
</el-form-item>
</el-form-item> -->
<el-form-item>
<el-button type="primary" icon="el-icon-search" size="mini" @click="handleQuery">搜索</el-button>
<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
@@ -87,7 +87,7 @@
<el-table-column prop="description" label="描述" min-width="200" align="center" :show-overflow-tooltip="true" />
<el-table-column prop="specification" label="规格" align="center" :show-overflow-tooltip="true" />
<el-table-column prop="color" label="颜色" align="center" :show-overflow-tooltip="true" />
<el-table-column prop="team" label="班组" align="center" :show-overflow-tooltip="true" />
<!-- <el-table-column prop="team" label="班组" align="center" :show-overflow-tooltip="true" /> -->
<el-table-column prop="requireNumber" label="投入数" align="center" />
<el-table-column prop="qualifiedNumber" label="合格数" align="center" />
<el-table-column prop="qualifiedRateStr" label="合格率" align="center" />
@@ -150,9 +150,9 @@
<el-form-item label="零件号" prop="partnumber">
<el-input v-model="form.partnumber" placeholder="请输入零件号" />
</el-form-item>
<el-form-item label="班组" prop="team">
<!-- <el-form-item label="班组" prop="team">
<el-input v-model.trim="form.team" placeholder="请输入班组" />
</el-form-item>
</el-form-item> -->
<el-form-item label="是否为返工件" prop="isReturnWorkpiece">
<el-switch v-model="form.isReturnWorkpiece" active-color="#13ce66"> </el-switch>
</el-form-item>
@@ -273,7 +273,7 @@ export default {
{ index: 1, key: 'workorderId', label: `工单号`, checked: true },
{ index: 2, key: 'partnumber', label: `零件号`, checked: true },
{ index: 3, key: 'requireNumber', label: `抛光投入数`, checked: true },
{ index: 4, key: 'team', label: `班组`, checked: true },
// { index: 4, key: 'team', label: `班组`, checked: true },
{ index: 5, key: 'qualifiedNumber', label: `合格数`, checked: true },
{ index: 6, key: 'qualifiedRate', label: `合格率`, checked: true },
{ index: 7, key: 'paoguangTotal', label: `抛光总数`, checked: true },
@@ -367,7 +367,7 @@ export default {
workorderId: undefined,
partnumber: undefined,
requireNumber: 0,
team: 'A',
team: 'GP12',
isReturnWorkpiece: false,
qualifiedNumber: 0,
qualifiedRate: 0,