fengyuan_yang
/
boying-vue
1
0
Fork 0
Code Issues Pull Requests Projects Releases Wiki Activity
Browse Source

2025-10-29 

过站采集创建分卷优化
master
fengyuan_yang 3 months ago
parent
36271f28a5
commit
7ecc0fca61
1 changed files with 262 additions and 15 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 277
      src/views/modules/yieldReport/com_separate_roll.vue

277
src/views/modules/yieldReport/com_separate_roll.vue
View File

@ -1,6 +1,6 @@
<template>
<div class="customer-css">
<el-dialog :title="titleCon" v-drag v-bind="$attrs" v-on="$listeners" width="550px" style="height: 680px;" class="customer-dialog">
<el-dialog :title="titleCon" v-drag v-bind="$attrs" v-on="$listeners" width="700px" style="height: 680px;" class="customer-dialog">
<el-form :inline="true" label-position="top" style="height: auto;">
<!-- 时间和固定载具 -->
<el-row style="margin-top: -10px;">
@ -46,10 +46,11 @@
:data="rowDataList"
border
style="width: 100%; margin-top: 10px;"
max-height="350">
max-height="350"
:span-method="objectSpanMethod">
<el-table-column prop="rowNumber" label="NO." width="50" align="center">
</el-table-column>
<el-table-column label="良品数" width="150" align="center">
<el-table-column label="良品数" width="80" align="center">
<template slot-scope="scope">
<el-input-number
:controls="false" :step="0"
@ -61,25 +62,60 @@
</el-input-number>
</template>
</el-table-column>
<el-table-column label="不良数" width="150" align="center">
<el-table-column label="面损" width="80" align="center">
<template slot-scope="scope">
<el-input-number
:controls="false" :step="0"
v-model="scope.row.defectQty"
v-model="scope.row.surfaceLossQty"
@change="handleQtyChange(scope.row)"
style="width: 100%"
class="defect-qty-input"
:style="{'color': '#f56c6c', 'font-weight': 'bold'}">
style="width: 100%">
</el-input-number>
</template>
</el-table-column>
<el-table-column label="性能不良" width="80" align="center">
<template slot-scope="scope">
<el-input-number
:controls="false" :step="0"
v-model="scope.row.poorPerformanceQty"
@change="handleQtyChange(scope.row)"
style="width: 100%">
</el-input-number>
</template>
</el-table-column>
<el-table-column label="总数" align="center">
<el-table-column label="不良数" width="80" align="right">
<template slot-scope="scope">
<div class="total-display">
<div class="defect-display" :style="{'color': '#f56c6c', 'font-weight': 'bold', 'text-align': 'right', 'padding-right': '10px'}">
{{ scope.row.defectQty }}
</div>
</template>
</el-table-column>
<el-table-column label="良率" width="80" align="center">
<template slot-scope="scope">
<div class="yield-display" :style="{'color': '#409eff', 'font-weight': 'bold'}">
{{ scope.row.yieldRate }}
</div>
</template>
</el-table-column>
<el-table-column label="总数" width="80" align="right">
<template slot-scope="scope">
<div class="total-display" :style="{'text-align': 'right', 'padding-right': '10px'}">
{{ scope.row.totalQty }}
</div>
</template>
</el-table-column>
<el-table-column label="备注" align="center" class-name="remark-column">
<template slot-scope="scope">
<div class="remark-wrapper">
<el-input
type="textarea"
v-model="scope.row.remark"
resize="none"
:autosize="false"
class="remark-textarea">
</el-input>
</div>
</template>
</el-table-column>
</el-table>
</div>
</el-form>
@ -400,8 +436,12 @@ export default {
this.rowDataList.push({
rowNumber: i,
goodQty: 0,
surfaceLossQty: 0,
poorPerformanceQty: 0,
defectQty: 0,
totalQty: 0
yieldRate: '0.00%',
totalQty: 0,
remark: ''
})
}
},
@ -414,9 +454,21 @@ export default {
this.initRowDataList()
},
// 数量变化时自动计算总数
// 数量变化时自动计算不良数、良率和总数
handleQtyChange(row) {
row.totalQty = (row.goodQty || 0) + (row.defectQty || 0)
// 计算不良数 = 面损 + 性能不良
row.defectQty = (row.surfaceLossQty || 0) + (row.poorPerformanceQty || 0)
// 计算总数 = 良品数 + 不良数
row.totalQty = (row.goodQty || 0) + row.defectQty
// 计算良率 = 良品数 / 总数 * 100%
if (row.totalQty > 0) {
const yieldValue = ((row.goodQty || 0) / row.totalQty * 100).toFixed(2)
row.yieldRate = yieldValue + '%'
} else {
row.yieldRate = '0.00%'
}
},
// 验证排数据
@ -453,6 +505,88 @@ export default {
return true
},
// 表格合并行方法（备注列根据卷数合并）
objectSpanMethod({ row, column, rowIndex, columnIndex }) {
// 只对备注列进行合并（最后一列）
if (column.label === '备注') {
// 计算每卷的排数
const rowsPerRoll = Math.floor(this.pageData.rowCount / this.pageData.rollCount)
const remainingRows = this.pageData.rowCount % this.pageData.rollCount
// 计算当前行属于第几卷
let currentRollIndex = 0
let accumulatedRows = 0
for (let i = 0; i < this.pageData.rollCount; i++) {
const currentRollRows = rowsPerRoll + (i < remainingRows ? 1 : 0)
if (rowIndex < accumulatedRows + currentRollRows) {
currentRollIndex = i
break
}
accumulatedRows += currentRollRows
}
// 计算当前卷的排数
const currentRollRows = rowsPerRoll + (currentRollIndex < remainingRows ? 1 : 0)
// 如果是当前卷的第一行，显示合并的单元格
if (rowIndex === accumulatedRows) {
return {
rowspan: currentRollRows,
colspan: 1
}
} else {
// 其他行不显示
return {
rowspan: 0,
colspan: 0
}
}
}
},
// 计算备注wrapper的样式（使用padding-top实现垂直居中）
getRemarkWrapperStyle(rowIndex) {
if (this.pageData.rowCount <= 0 || this.pageData.rollCount <= 0) {
return {}
}
// 计算每卷的排数
const rowsPerRoll = Math.floor(this.pageData.rowCount / this.pageData.rollCount)
const remainingRows = this.pageData.rowCount % this.pageData.rollCount
// 计算当前行属于第几卷
let currentRollIndex = 0
let accumulatedRows = 0
for (let i = 0; i < this.pageData.rollCount; i++) {
const currentRollRows = rowsPerRoll + (i < remainingRows ? 1 : 0)
if (rowIndex < accumulatedRows + currentRollRows) {
currentRollIndex = i
break
}
accumulatedRows += currentRollRows
}
// 计算当前卷的排数
const currentRollRows = rowsPerRoll + (currentRollIndex < remainingRows ? 1 : 0)
// 每行高度约为32px
const rowHeight = 32
const totalHeight = currentRollRows * rowHeight
// textarea的实际高度约为24px（单行）
const textareaHeight = 24
// 计算需要的padding-top来实现垂直居中
const paddingTop = (totalHeight - textareaHeight) / 2
// 返回样式对象
return {
paddingTop: paddingTop + 'px'
}
},
// ===================== 分卷优化方法结束 =====================
// 查询固定载具列表
@ -580,15 +714,27 @@ export default {
let totalDefectQty = 0
const rollRows = []
// 获取当前卷的备注（第一排的备注）
let rollRemark = ''
for (let i = 0; i < currentRollRows; i++) {
const row = this.rowDataList[currentRowIndex + i]
totalGoodQty += row.goodQty || 0
totalDefectQty += row.defectQty || 0
// 第一排的备注作为整卷的备注
if (i === 0) {
rollRemark = row.remark || ''
}
rollRows.push({
rowNumber: row.rowNumber,
goodQty: row.goodQty || 0,
surfaceLossQty: row.surfaceLossQty || 0,
poorPerformanceQty: row.poorPerformanceQty || 0,
defectQty: row.defectQty || 0,
totalQty: row.totalQty || 0
totalQty: row.totalQty || 0,
remark: row.remark || ''
})
}
@ -598,7 +744,8 @@ export default {
rollQty: totalGoodQty, // 该卷的良品总数
rollNums: 1, // 固定为1
totalDefectQty: totalDefectQty, // 该卷的不良总数
rollRows: rollRows // 该卷包含的排数据
rollRows: rollRows, // 该卷包含的排数据
remark: rollRemark // 该卷的备注
}
// 调用后端创建单个卷
@ -742,6 +889,71 @@ export default {
font-size: 12px;
}
/* 备注列单元格样式 - 使用绝对定位填满 */
.customer-dialog >>> .el-table td:last-child {
padding: 0 !important;
position: relative !important;
}
.customer-dialog /deep/ .el-table td:last-child {
padding: 0 !important;
position: relative !important;
}
/* 备注包装器 - 绝对定位填满单元格 */
.customer-dialog >>> .remark-wrapper {
position: absolute !important;
top: 0 !important;
left: 0 !important;
right: 0 !important;
bottom: 0 !important;
width: 100% !important;
height: 100% !important;
}
.customer-dialog /deep/ .remark-wrapper {
position: absolute !important;
top: 0 !important;
left: 0 !important;
right: 0 !important;
bottom: 0 !important;
width: 100% !important;
height: 100% !important;
}
/* 备注textarea */
.customer-dialog >>> .remark-textarea {
width: 100% !important;
height: 100% !important;
}
.customer-dialog >>> .remark-textarea .el-textarea__inner {
border: none !important;
padding: 8px 10px !important;
border-radius: 0 !important;
resize: none !important;
width: 100% !important;
height: 100% !important;
box-sizing: border-box !important;
overflow-y: auto !important;
}
.customer-dialog /deep/ .remark-textarea {
width: 100% !important;
height: 100% !important;
}
.customer-dialog /deep/ .remark-textarea .el-textarea__inner {
border: none !important;
padding: 8px 10px !important;
border-radius: 0 !important;
resize: none !important;
width: 100% !important;
height: 100% !important;
box-sizing: border-box !important;
overflow-y: auto !important;
}
</style>
<style lang="scss">
@ -757,4 +969,39 @@ export default {
color: #f56c6c !important;
font-size: 16px !important;
}
/* 备注列样式 - 只针对创建分卷对话框 */
.customer-css .el-table td:last-child {
padding: 0 !important;
position: relative !important;
}
/* 备注包装器 - 填满整个单元格 */
.customer-css .remark-wrapper {
position: absolute !important;
top: 0 !important;
left: 0 !important;
right: 0 !important;
bottom: 0 !important;
width: 100% !important;
height: 100% !important;
}
/* 备注textarea容器 */
.customer-css .remark-textarea {
width: 100% !important;
height: 100% !important;
}
.customer-css .remark-textarea .el-textarea__inner {
border: none !important;
padding: 8px 10px !important;
border-radius: 0 !important;
resize: none !important;
width: 100% !important;
height: 100% !important;
box-sizing: border-box !important;
overflow-y: auto !important;
}
</style>
Write Preview
Loading…
Cancel
Save