<template>
|
<div class="barcode-detail">
|
<el-dialog
|
:visible.sync="dialogVisible"
|
title="条码出入库记录表"
|
width="90%"
|
top="5vh"
|
:close-on-click-modal="false"
|
@closed="handleClosed"
|
>
|
<el-card>
|
<div class="dialog-content">
|
<el-form :model="formData" label-width="100px" class="form-container">
|
<el-row :gutter="20">
|
<el-col :span="8">
|
<el-form-item label="单据内码">
|
<el-input v-model="formData.HInterID" disabled />
|
</el-form-item>
|
</el-col>
|
<el-col :span="8">
|
<el-form-item label="单据号">
|
<el-input v-model="formData.HBillNo" disabled />
|
</el-form-item>
|
</el-col>
|
<el-col :span="8">
|
<el-form-item label="单据类型">
|
<el-input v-model="formData.HBillType" disabled />
|
</el-form-item>
|
</el-col>
|
</el-row>
|
</el-form>
|
|
<div class="table-toolbar">
|
<el-button size="mini" @click="handlePreview">
|
<i class="el-icon-view"></i> 预览
|
</el-button>
|
<el-button size="mini" @click="handlePrint">
|
<i class="el-icon-printer"></i> 打印
|
</el-button>
|
<el-button size="mini" @click="handleSave">
|
<i class="el-icon-document"></i> 保存
|
</el-button>
|
<el-button size="mini" @click="handleColumnSetting">
|
<i class="el-icon-setting"></i> 列设置
|
</el-button>
|
</div>
|
|
<el-table
|
ref="mainTable"
|
:data="tableData"
|
border
|
stripe
|
style="width: 100%"
|
:loading="loading"
|
@selection-change="handleSelectionChange"
|
show-summary
|
:summary-method="getSummaries"
|
>
|
<el-table-column type="selection" width="55" fixed="left" />
|
<el-table-column
|
v-for="column in tableColumns"
|
:key="column.field"
|
:prop="column.field"
|
:label="column.title"
|
:width="column.width"
|
:align="column.align"
|
:fixed="column.fixed"
|
:sortable="column.sortable"
|
:show-overflow-tooltip="true"
|
>
|
<template v-if="column.editable" #default="scope">
|
<el-input
|
v-model="scope.row[column.field]"
|
size="mini"
|
@blur="handleCellEdit(scope.row, column.field, scope.row[column.field])"
|
/>
|
</template>
|
</el-table-column>
|
</el-table>
|
</div>
|
</el-card>
|
</el-dialog>
|
|
<el-dialog
|
:visible.sync="columnDialogVisible"
|
title="隐藏列设置"
|
width="50%"
|
>
|
<div class="column-setting">
|
<el-checkbox-group v-model="selectedColumns">
|
<el-checkbox
|
v-for="column in allColumns"
|
:key="column.field"
|
:label="column.field"
|
>
|
{{ column.title }}
|
</el-checkbox>
|
</el-checkbox-group>
|
</div>
|
<div slot="footer">
|
<el-button @click="columnDialogVisible = false">取消</el-button>
|
<el-button type="primary" @click="applyColumnSettings">确定</el-button>
|
</div>
|
</el-dialog>
|
</div>
|
</template>
|
|
<script>
|
import axios from 'axios'
|
|
export default {
|
name: 'BarCodeDetail',
|
data() {
|
return {
|
dialogVisible: false,
|
columnDialogVisible: false,
|
loading: false,
|
formData: {
|
HInterID: '',
|
HBillNo: '',
|
HBillType: ''
|
},
|
tableData: [],
|
tableColumns: [],
|
allColumns: [],
|
selectedColumns: [],
|
selectedRows: [],
|
baseURL: process.env.VUE_APP_BASE_API || "http://47.96.97.237/API/"
|
}
|
},
|
methods: {
|
|
open(record) {
|
if (!record) {
|
this.$message.warning('请选择要查看条码明细的单据')
|
return
|
}
|
|
const hmainid = record.hmainid || record.HInterID
|
const billNo = record.单据号 || record.HBillNo
|
|
|
let billTypeDesc = ''
|
switch (record.单据类型 || '') {
|
case '1201': billTypeDesc = '外购入库单'; break
|
case '1202': billTypeDesc = '产品入库单'; break
|
case '1203': billTypeDesc = '其它入库单'; break
|
case '1204': billTypeDesc = '生产领料'; break
|
case '1205': billTypeDesc = '销售出库'; break
|
case '1206': billTypeDesc = '其它出库单'; break
|
case '1207': billTypeDesc = '直接调拨单'; break
|
case '1210': billTypeDesc = '委外加工入库单'; break
|
case '1211': billTypeDesc = '委外加工出库单'; break
|
default: billTypeDesc = record.单据类型 || ''
|
}
|
|
this.formData = {
|
HInterID: hmainid,
|
HBillNo: billNo,
|
HBillType: billTypeDesc
|
}
|
|
this.dialogVisible = true
|
this.$nextTick(() => {
|
this.loadData(hmainid, record.单据类型 || '', billNo)
|
})
|
},
|
|
async loadData(HInterID, HBillType, HBillNo) {
|
this.loading = true
|
try {
|
const sWhere = `${HInterID},'${HBillType}','${HBillNo}'`
|
|
const url = `${this.baseURL}/Kf_ICStockInOutBill/Kf_BarCodeDetailQuery`
|
const params = { sWhere }
|
|
const response = await axios.get(url, { params })
|
const data = response.data
|
|
if (data && data.list) {
|
this.generateTableColumns(data.list)
|
this.tableData = data.data || []
|
this.applyColumnSettingsFromStorage()
|
} else {
|
this.$message.error('获取条码明细数据失败')
|
}
|
} catch (error) {
|
console.error('加载条码明细失败:', error)
|
this.$message.error('加载条码明细失败')
|
} finally {
|
this.loading = false
|
}
|
},
|
|
generateTableColumns(columnList) {
|
const columns = []
|
const allColumns = []
|
|
|
columns.push({
|
type: 'selection',
|
width: 55,
|
fixed: 'left'
|
})
|
|
columnList.forEach((item, index) => {
|
const colName = item.ColmCols
|
let columnConfig = {
|
field: colName,
|
title: colName,
|
width: 200,
|
align: 'center',
|
sortable: true
|
}
|
|
|
switch (colName) {
|
case 'HItemID':
|
columnConfig.hide = true
|
break
|
case 'HMaterialJQty':
|
columnConfig.title = '重量维护'
|
columnConfig.editable = true
|
break
|
case 'HWeight_TL':
|
columnConfig.title = '投料克重维护'
|
columnConfig.editable = true
|
break
|
case 'HWeight_CP':
|
columnConfig.title = '实际克重维护'
|
columnConfig.editable = true
|
break
|
case '数量':
|
columnConfig.total = true
|
break
|
}
|
|
columns.push(columnConfig)
|
allColumns.push({ ...columnConfig })
|
})
|
|
this.tableColumns = columns
|
this.allColumns = allColumns
|
this.selectedColumns = allColumns.map(col => col.field)
|
},
|
|
|
handleCellEdit(row, field, value) {
|
const ref = /^\d+(\.\d+)?$/
|
|
switch (field) {
|
case 'HMaterialJQty':
|
if (!ref.test(value)) {
|
this.$message.warning('重量维护请输入不小于0的数字!')
|
this.$set(row, field, '')
|
}
|
break
|
case 'HWeight_TL':
|
if (!ref.test(value) || value == 0) {
|
this.$message.warning('投料克重维护请输入大于0的数字!')
|
this.$set(row, field, '')
|
}
|
break
|
case 'HWeight_CP':
|
if (!ref.test(value)) {
|
this.$message.warning('实际克重维护请输入不小于0的数字!')
|
this.$set(row, field, '')
|
}
|
break
|
}
|
},
|
|
|
handleSelectionChange(selection) {
|
this.selectedRows = selection
|
},
|
|
// 预览 todo
|
handlePreview() {
|
this.$message.info('预览功能待实现')
|
},
|
|
// 打印
|
async handlePrint() {
|
if (this.selectedRows.length === 0) {
|
this.$message.warning('请选择要打印的数据!')
|
return
|
}
|
|
const HBarCodeStrList = this.selectedRows.map(row => `''${row.条码}''`).join(',')
|
const sWhere_Temp = `${this.formData.HInterID},'${this.formData.HBillType}','${this.formData.HBillNo}',' and 条码 in (${HBarCodeStrList})'`
|
|
window.open(`../../BaseSet/SRM_OpenTmpList.html?sWhere=${sWhere_Temp}&MyMsg=${sWhere_Temp}&Type=Kf_BarCodeDetailQuery`, '_blank')
|
},
|
|
// 保存
|
async handleSave() {
|
if (!this.validateData()) {
|
return
|
}
|
|
const saveData = this.tableData.map(item => ({
|
...item,
|
HInterID: this.formData.HInterID,
|
HBillNo: this.formData.HBillNo,
|
HBillType: this.formData.HBillType,
|
HBarCode: item.条码
|
}))
|
|
try {
|
const sSubStr = JSON.stringify(saveData)
|
const sMainSub = `${sSubStr};${sessionStorage['HUserName'] || 'admin'}`
|
|
const url = `${this.baseURL}/Kf_ICStockInOutBill/Kf_BarCodeDetailQuery_saveData`
|
const response = await axios.post(url, { msg: sMainSub })
|
|
if (response.data.count === 1) {
|
this.$message.success(response.data.Message || '保存成功')
|
} else {
|
this.$message.error(response.data.Message || '保存失败')
|
}
|
} catch (error) {
|
console.error('保存失败:', error)
|
this.$message.error('保存失败')
|
}
|
},
|
|
|
validateData() {
|
const ref = /^\d+(\.\d+)?$/
|
|
for (let i = 0; i < this.tableData.length; i++) {
|
const row = this.tableData[i]
|
|
|
const weight = row.HMaterialJQty + ''
|
if (!ref.test(weight)) {
|
this.$message.warning(`第${i + 1}行：重量维护请输入不小于0的数字！`)
|
return false
|
}
|
|
|
const actualWeight = row.HWeight_CP + ''
|
if (!ref.test(actualWeight)) {
|
this.$message.warning(`第${i + 1}行：实际克重维护请输入不小于0的数字！`)
|
return false
|
}
|
|
|
const feedWeight = row.HWeight_TL + ''
|
if (!ref.test(feedWeight)) {
|
this.$message.warning(`第${i + 1}行：投料克重维护请输入大于0的数字！`)
|
return false
|
}
|
}
|
|
return true
|
},
|
|
|
handleColumnSetting() {
|
this.columnDialogVisible = true
|
},
|
|
|
applyColumnSettings() {
|
this.tableColumns = [
|
this.tableColumns[0],
|
...this.allColumns.filter(col => this.selectedColumns.includes(col.field))
|
]
|
this.columnDialogVisible = false
|
|
|
this.saveColumnSettings()
|
},
|
|
applyColumnSettingsFromStorage() {
|
|
},
|
|
|
saveColumnSettings() {
|
|
},
|
|
// 合计行计算
|
getSummaries(param) {
|
const { columns, data } = param
|
const sums = []
|
|
columns.forEach((column, index) => {
|
if (index === 0) {
|
sums[index] = '合计'
|
return
|
}
|
|
const values = data.map(item => Number(item[column.property]))
|
if (!values.every(value => isNaN(value))) {
|
sums[index] = values.reduce((prev, curr) => {
|
const value = Number(curr)
|
if (!isNaN(value)) {
|
return prev + curr
|
} else {
|
return prev
|
}
|
}, 0)
|
} else {
|
sums[index] = ''
|
}
|
})
|
|
return sums
|
},
|
|
|
handleClosed() {
|
this.tableData = []
|
this.tableColumns = []
|
this.selectedRows = []
|
}
|
}
|
}
|
</script>
|
|
<style scoped>
|
.barcode-detail {
|
font-family: "Microsoft YaHei", sans-serif;
|
}
|
|
.form-container {
|
margin-bottom: 16px;
|
}
|
|
.table-toolbar {
|
margin-bottom: 12px;
|
}
|
|
.column-setting {
|
max-height: 400px;
|
overflow-y: auto;
|
}
|
|
.column-setting .el-checkbox {
|
display: block;
|
margin-bottom: 8px;
|
}
|
|
:deep(.el-dialog__body) {
|
padding: 10px 20px;
|
}
|
|
:deep(.el-card__body) {
|
padding: 12px;
|
}
|
</style>
|
