Teams/shanghaigangxiangtuzhuangVUE
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(质量报表): 实现合格率报表功能并优化表格展示

Browse Source 
- 新增合格率报表API文件及接口调用
- 替换原有模拟数据为真实接口调用
- 调整表格列展示，增加一次合格率统计
- 优化数据获取逻辑和错误处理
This commit is contained in:
赵正易
2025-10-17 17:13:40 +08:00
parent 401cf32a13
commit c8038484cf
4 changed files with 104 additions and 92 deletions
Download Patch File Download Diff File Expand all files Collapse all files

20
src/api/qualityManagement/defectReport/defectReport.js Normal file
View File

@@ -0,0 +1,20 @@
import request from '@/utils/request'
import { downFile } from '@/utils/request'
// 分页获取合格率报表数据
export function GetQualificationRateReport(data) {
return request({
url: '/mes/qc/FQC/QualificationRateReport/GetQualificationRateReport',
method: 'post',
data: data,
})
}
// 获取合格率Echarts数据
export function GetQualificationRateEcharts(data) {
return request({
url: '/mes/qc/FQC/QualificationRateEcharts/GetQualificationRateEcharts',
method: 'post',
data: data,
})
}

20
src/api/qualityManagement/qualificationRateReport/qualificationRateReport.js Normal file
View File

@@ -0,0 +1,20 @@
import request from '@/utils/request'
import { downFile } from '@/utils/request'
// 分页获取合格率报表数据
export function GetQualificationRateReport(data) {
return request({
url: '/mes/qc/FQC/QualificationRateReport/GetQualificationRateReport',
method: 'post',
data: data,
})
}
// 获取合格率Echarts数据
export function GetQualificationRateEcharts(data) {
return request({
url: '/mes/qc/FQC/QualificationRateEcharts/GetQualificationRateEcharts',
method: 'post',
data: data,
})
}

37
src/views/qualityManagement/FQC/qualificationRateReport/components/qualificationRateOverview.vue
View File

@@ -86,7 +86,7 @@
<script> <script>
import * as echarts from 'echarts' import * as echarts from 'echarts'
import { GetProductAndPolishAndOneTimeFqcBoardData } from '@/api/qualityManagement/commonFQC.js' import { GetQualificationRateEcharts } from '@/api/qualityManagement/qualificationRateReport/qualificationRateReport.js'
import { debounce } from '@/utils' import { debounce } from '@/utils'
export default { export default {
@@ -168,27 +168,26 @@ export default {
async getOverviewData() { async getOverviewData() {
this.loading = true this.loading = true
try { try {
// 注释接口调用，直接使用测试数据 const params = {
// const params = { startTime: this.timeRange.startTime,
// startTime: this.timeRange.startTime, endTime: this.timeRange.endTime,
// endTime: this.timeRange.endTime, ...this.queryParams
// ...this.queryParams }
// }
// // 调用API获取数据 // 调用API获取数据
// const res = await GetProductAndPolishAndOneTimeFqcBoardData(params) const res = await GetQualificationRateEcharts(params)
// if (res.code === 200 && res.data) { // 打印返回值
// this.updateStatData(res.data) console.log('接口返回数据:', res)
// this.updateTrendChart(res.data.trendData)
// this.updateDefectChart(res.data.defectData)
// } else {
// this.$message.error('获取数据失败')
// this.useMockData()
// }
// 直接使用模拟数据 if (res.code === 200 && res.data) {
this.useMockData() this.updateStatData(res.data)
this.updateTrendChart(res.data.trendData || { categories: [], series: [] })
this.updateDefectChart(res.data.defectData || [])
} else {
this.$message.error('获取数据失败')
this.useMockData()
}
} catch (error) { } catch (error) {
this.$message.error('获取数据异常') this.$message.error('获取数据异常')
console.error('获取合格率概览数据异常:', error) console.error('获取合格率概览数据异常:', error)

119
src/views/qualityManagement/FQC/qualificationRateReport/components/qualificationRateTable.vue
View File

@@ -8,70 +8,44 @@
</el-button> </el-button>
</el-col> </el-col>
</el-row> </el-row>
<!-- 表格 --> <!-- 表格 -->
<el-table <el-table v-loading="loading" :data="dataList" border fit highlight-current-row style="width: 100%">
v-loading="loading"
:data="dataList"
border
fit
highlight-current-row
style="width: 100%"
>
<el-table-column type="index" width="50" label="序号" /> <el-table-column type="index" width="50" label="序号" />
<el-table-column prop="partNumber" label="物料号" width="120" /> <el-table-column prop="partNumber" label="物料号" width="120" />
<el-table-column prop="description" label="产品描述" min-width="150" /> <el-table-column prop="description" label="产品描述" min-width="150" />
<el-table-column prop="specification" label="规格" width="100" /> <el-table-column prop="specification" label="规格" width="100" />
<el-table-column prop="color" label="颜色" width="80" /> <el-table-column prop="color" label="颜色" width="80" />
<el-table-column prop="siteNo" label="站点" width="80" /> <el-table-column prop="allRequireNumber" label="总投入数" width="80" align="right" />
<el-table-column prop="team" label="班组" width="80" /> <el-table-column prop="allQualifiedNumber" label="总合格数" width="80" align="right" />
<el-table-column prop="requireNumber" label="投入数" width="80" align="right" /> <el-table-column prop="qualifiedRate" label="总合格率" width="90" align="right">
<el-table-column prop="qualifiedNumber" label="合格数" width="80" align="right" />
<el-table-column prop="qualifiedRate" label="合格率" width="90" align="right">
<template slot-scope="scope"> <template slot-scope="scope">
<span :class="getRateClass(scope.row.qualifiedRate)">{{ scope.row.qualifiedRate }}%</span> <span :class="getRateClass(scope.row.qualifiedRate)">{{ scope.row.qualifiedRate }}%</span>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="polishNumber" label="抛光数" width="80" align="right" /> <el-table-column prop="firstRequireNumber" label="一次投入数" width="80" align="right" />
<el-table-column prop="damoNumber" label="打磨数" width="80" align="right" /> <el-table-column prop="firstQualifiedNumber" label="一次合格数" width="80" align="right" />
<el-table-column prop="baofeiNumber" label="报废数" width="80" align="right" /> <el-table-column prop="qualifiedRate" label="一次合格率" width="90" align="right">
<el-table-column prop="isOnetime" label="一次合格" width="90" align="center">
<template slot-scope="scope"> <template slot-scope="scope">
<el-tag :type="scope.row.isOnetime === 1 ? 'success' : 'info'"> <span :class="getRateClass(scope.row.qualifiedRate)">{{ scope.row.qualifiedRate }}%</span>
{{ scope.row.isOnetime === 1 ? '是' : '否' }}
</el-tag>
</template>
</el-table-column>
<el-table-column prop="isBack" label="返工件" width="90" align="center">
<template slot-scope="scope">
<el-tag :type="scope.row.isBack === 1 ? 'warning' : 'info'">
{{ scope.row.isBack === 1 ? '是' : '否' }}
</el-tag>
</template> </template>
</el-table-column> </el-table-column>
<el-table-column prop="startTime" label="开始时间" width="150" /> <el-table-column prop="startTime" label="开始时间" width="150" />
<el-table-column prop="endTime" label="结束时间" width="150" /> <el-table-column prop="endTime" label="结束时间" width="150" />
<el-table-column prop="workOrder" label="工单号" width="120" /> <el-table-column prop="workOrder" label="工单号" width="120" />
</el-table> </el-table>
<!-- 分页 --> <!-- 分页 -->
<div class="pagination-container"> <div class="pagination-container">
<el-pagination <el-pagination background :current-page="queryParams.pageNum" :page-size="queryParams.pageSize"
background :page-sizes="[10, 20, 50, 100]" layout="total, sizes, prev, pager, next, jumper" :total="total"
:current-page="queryParams.pageNum" @size-change="handleSizeChange" @current-change="handleCurrentChange" />
:page-size="queryParams.pageSize"
:page-sizes="[10, 20, 50, 100]"
layout="total, sizes, prev, pager, next, jumper"
:total="total"
@size-change="handleSizeChange"
@current-change="handleCurrentChange"
/>
</div> </div>
</div> </div>
</template> </template>
<script> <script>
import { GetWorkOrderFqcTableData } from '@/api/qualityManagement/commonFQC.js' import { GetQualificationRateReport } from '@/api/qualityManagement/qualificationRateReport/qualificationRateReport.js'
export default { export default {
name: 'QualificationRateTable', name: 'QualificationRateTable',
@@ -111,28 +85,27 @@ export default {
async getTableData() { async getTableData() {
this.loading = true this.loading = true
try { try {
// 注释接口调用，直接使用测试数据 const params = {
// const params = { startTime: this.timeRange.startTime,
// startTime: this.timeRange.startTime, endTime: this.timeRange.endTime,
// endTime: this.timeRange.endTime, ...this.queryParams,
// ...this.queryParams, ...this.tableQueryParams
// ...this.tableQueryParams }
// }
// 调用API获取数据
// // 调用API获取数据 const res = await GetQualificationRateReport(params)
// const res = await GetWorkOrderFqcTableData(params)
// 打印返回值
// if (res.code === 200 && res.data) { console.log('接口返回数据:', res)
// this.dataList = res.data.result || []
// this.total = res.data.totalNum || 0 if (res.code === 200 && res.data) {
// } else { this.dataList = res.data.result || []
// this.$message.error('获取数据失败') this.total = res.data.totalNum || 0
// // 使用模拟数据 } else {
// this.useMockData() this.$message.error('获取数据失败')
// } // 使用模拟数据
this.useMockData()
// 直接使用模拟数据 }
this.useMockData()
} catch (error) { } catch (error) {
this.$message.error('获取数据异常') this.$message.error('获取数据异常')
console.error('获取合格率报表数据异常:', error) console.error('获取合格率报表数据异常:', error)
@@ -142,7 +115,7 @@ export default {
this.loading = false this.loading = false
} }
}, },
// 使用模拟数据 // 使用模拟数据
useMockData() { useMockData() {
const mockData = [] const mockData = []
@@ -152,7 +125,7 @@ export default {
const colors = ['黑色', '白色', '银色', '蓝色', '红色'] const colors = ['黑色', '白色', '银色', '蓝色', '红色']
const sites = ['FQC-1', 'FQC-2', 'FQC-3', 'FQC-4', 'FQC-5'] const sites = ['FQC-1', 'FQC-2', 'FQC-3', 'FQC-4', 'FQC-5']
const teams = ['一班', '二班', '三班'] const teams = ['一班', '二班', '三班']
// 生成20条模拟数据 // 生成20条模拟数据
for (let i = 1; i <= 20; i++) { for (let i = 1; i <= 20; i++) {
const index = i % 5 const index = i % 5
@@ -162,7 +135,7 @@ export default {
const polishNumber = Math.floor((requireNumber - qualifiedNumber) * 0.7) const polishNumber = Math.floor((requireNumber - qualifiedNumber) * 0.7)
const damoNumber = Math.floor((requireNumber - qualifiedNumber - polishNumber) * 0.8) const damoNumber = Math.floor((requireNumber - qualifiedNumber - polishNumber) * 0.8)
const baofeiNumber = requireNumber - qualifiedNumber - polishNumber - damoNumber const baofeiNumber = requireNumber - qualifiedNumber - polishNumber - damoNumber
// 生成随机日期 // 生成随机日期
const date = new Date() const date = new Date()
date.setDate(date.getDate() - Math.floor(Math.random() * 7)) date.setDate(date.getDate() - Math.floor(Math.random() * 7))
@@ -170,7 +143,7 @@ export default {
startTime.setHours(Math.floor(Math.random() * 8) + 8, Math.floor(Math.random() * 60)) startTime.setHours(Math.floor(Math.random() * 8) + 8, Math.floor(Math.random() * 60))
const endTime = new Date(startTime) const endTime = new Date(startTime)
endTime.setHours(startTime.getHours() + 4 + Math.floor(Math.random() * 4)) endTime.setHours(startTime.getHours() + 4 + Math.floor(Math.random() * 4))
mockData.push({ mockData.push({
id: i, id: i,
partNumber: partNumbers[index], partNumber: partNumbers[index],
@@ -194,11 +167,11 @@ export default {
workOrder: `WO-${date.getFullYear()}${String(date.getMonth() + 1).padStart(2, '0')}${String(date.getDate()).padStart(2, '0')}-${String(i).padStart(3, '0')}` workOrder: `WO-${date.getFullYear()}${String(date.getMonth() + 1).padStart(2, '0')}${String(date.getDate()).padStart(2, '0')}-${String(i).padStart(3, '0')}`
}) })
} }
this.dataList = mockData this.dataList = mockData
this.total = 100 // 模拟总记录数 this.total = 100 // 模拟总记录数
}, },
// 获取合格率样式类 // 获取合格率样式类
getRateClass(rate) { getRateClass(rate) {
const rateValue = parseFloat(rate) const rateValue = parseFloat(rate)
@@ -210,25 +183,25 @@ export default {
return 'rate-low' return 'rate-low'
} }
}, },
// 处理导出 // 处理导出
handleExport() { handleExport() {
this.$message.success('导出功能待实现') this.$message.success('导出功能待实现')
// 实际项目中应调用导出API // 实际项目中应调用导出API
}, },
// 处理页码变化 // 处理页码变化
handleSizeChange(pageSize) { handleSizeChange(pageSize) {
this.tableQueryParams.pageSize = pageSize this.tableQueryParams.pageSize = pageSize
this.getTableData() this.getTableData()
}, },
// 处理页数变化 // 处理页数变化
handleCurrentChange(pageNum) { handleCurrentChange(pageNum) {
this.tableQueryParams.pageNum = pageNum this.tableQueryParams.pageNum = pageNum
this.getTableData() this.getTableData()
}, },
// 刷新数据 // 刷新数据
refresh() { refresh() {
this.tableQueryParams.pageNum = 1 this.tableQueryParams.pageNum = 1
@@ -244,7 +217,7 @@ export default {
}, },
deep: true deep: true
}, },
// 监听时间范围变化 // 监听时间范围变化
timeRange: { timeRange: {
handler() { handler() {