|
|
|
@ -2,29 +2,54 @@ |
|
|
|
<!-- 原材料清单组件 --> |
|
|
|
<div class="raw-material-container"> |
|
|
|
<!-- 工具栏 --> |
|
|
|
<div style="margin-bottom: 10px"> |
|
|
|
<el-button |
|
|
|
type="primary" |
|
|
|
size="small" |
|
|
|
class="add-btn" |
|
|
|
v-if="canEdit" |
|
|
|
@click="openAddDialog"> |
|
|
|
新增物料 |
|
|
|
</el-button> |
|
|
|
<el-button |
|
|
|
type="primary" |
|
|
|
size="small" |
|
|
|
class="reset-btn" |
|
|
|
v-if="canEdit" |
|
|
|
:disabled="selectedRows.length === 0" |
|
|
|
@click="batchDeleteRawMaterial"> |
|
|
|
批量删除 |
|
|
|
</el-button> |
|
|
|
<span |
|
|
|
v-if="!disabled && !canEdit" |
|
|
|
style="margin-left: 8px; color: #909399; font-size: 12px;"> |
|
|
|
仅试验负责人可维护原材料清单 |
|
|
|
</span> |
|
|
|
<div class="toolbar-row"> |
|
|
|
<div class="toolbar-left"> |
|
|
|
<el-button |
|
|
|
type="primary" |
|
|
|
size="small" |
|
|
|
class="add-btn" |
|
|
|
v-if="canEdit" |
|
|
|
@click="openAddDialog"> |
|
|
|
新增物料 |
|
|
|
</el-button> |
|
|
|
<el-button |
|
|
|
type="primary" |
|
|
|
size="small" |
|
|
|
class="reset-btn" |
|
|
|
v-if="canEdit" |
|
|
|
:disabled="selectedRows.length === 0" |
|
|
|
@click="batchDeleteRawMaterial"> |
|
|
|
批量删除 |
|
|
|
</el-button> |
|
|
|
<span |
|
|
|
v-if="!disabled && !canEdit" |
|
|
|
style="margin-left: 8px; color: #909399; font-size: 12px;"> |
|
|
|
仅试验负责人可维护原材料清单 |
|
|
|
</span> |
|
|
|
<span |
|
|
|
v-if="canEdit && shouldRecordChangeLog" |
|
|
|
style="margin-left: 8px; color: #E6A23C; font-size: 12px;"> |
|
|
|
当前为非草稿状态：原材料增删改将自动记录详细修改日志，可点击右上角“修改记录”查看 |
|
|
|
</span> |
|
|
|
</div> |
|
|
|
<div class="toolbar-right" v-if="applyNo"> |
|
|
|
<el-tooltip content="查看原材料修改记录" placement="top"> |
|
|
|
<el-badge |
|
|
|
:value="changeLogList.length" |
|
|
|
:max="99" |
|
|
|
:hidden="changeLogList.length === 0" |
|
|
|
class="change-log-badge"> |
|
|
|
<el-button |
|
|
|
type="warning" |
|
|
|
plain |
|
|
|
size="small" |
|
|
|
icon="el-icon-tickets" |
|
|
|
@click="openChangeLogDrawer"> |
|
|
|
修改记录 |
|
|
|
</el-button> |
|
|
|
</el-badge> |
|
|
|
</el-tooltip> |
|
|
|
</div> |
|
|
|
</div> |
|
|
|
|
|
|
|
<!-- 数据表格 --> |
|
|
|
@ -145,6 +170,106 @@ |
|
|
|
</el-table-column> |
|
|
|
</el-table> |
|
|
|
|
|
|
|
<!-- 原材料修改记录抽屉 --> |
|
|
|
<el-drawer |
|
|
|
title="原材料修改记录" |
|
|
|
:visible.sync="changeLogDrawerVisible" |
|
|
|
:append-to-body="true" |
|
|
|
size="55%"> |
|
|
|
<div class="change-log-drawer-body"> |
|
|
|
<div class="change-log-drawer-toolbar"> |
|
|
|
<span class="change-log-count">共 {{ changeLogList.length }} 条</span> |
|
|
|
<el-button |
|
|
|
type="text" |
|
|
|
size="small" |
|
|
|
:loading="changeLogLoading" |
|
|
|
@click="loadChangeLogList"> |
|
|
|
刷新 |
|
|
|
</el-button> |
|
|
|
</div> |
|
|
|
<el-table |
|
|
|
:data="changeLogList" |
|
|
|
v-loading="changeLogLoading" |
|
|
|
border |
|
|
|
size="small" |
|
|
|
class="change-log-table" |
|
|
|
height="68vh" |
|
|
|
style="width: 100%"> |
|
|
|
|
|
|
|
<el-table-column type="expand" width="50"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<div class="log-detail-wrapper"> |
|
|
|
<div class="log-detail-item"> |
|
|
|
<span class="log-detail-label">详细说明：</span> |
|
|
|
<pre class="log-detail-pre">{{ scope.row.detailContent || '-' }}</pre> |
|
|
|
</div> |
|
|
|
<!-- <div class="log-detail-item" v-if="scope.row.beforeContent"> |
|
|
|
<span class="log-detail-label">修改前快照：</span> |
|
|
|
<pre class="log-detail-pre">{{ scope.row.beforeContent }}</pre> |
|
|
|
</div> |
|
|
|
<div class="log-detail-item" v-if="scope.row.afterContent"> |
|
|
|
<span class="log-detail-label">修改后快照：</span> |
|
|
|
<pre class="log-detail-pre">{{ scope.row.afterContent }}</pre> |
|
|
|
</div>--> |
|
|
|
</div> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
|
|
|
|
<el-table-column |
|
|
|
prop="createdDate" |
|
|
|
label="时间" |
|
|
|
width="160" |
|
|
|
align="center" |
|
|
|
header-align="center"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
{{ formatDateTime(scope.row.createdDate) }} |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
|
|
|
|
<el-table-column |
|
|
|
prop="operationType" |
|
|
|
label="操作类型" |
|
|
|
width="90" |
|
|
|
align="center" |
|
|
|
class-name="operation-type-cell" |
|
|
|
header-align="center"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
<span |
|
|
|
:class="['operation-type-pill', getOperationTypeClass(scope.row.operationType)]"> |
|
|
|
{{ formatOperationType(scope.row.operationType) || '-' }} |
|
|
|
</span> |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
|
|
|
|
<el-table-column |
|
|
|
prop="operatorDisplayName" |
|
|
|
label="操作人" |
|
|
|
width="120" |
|
|
|
align="center" |
|
|
|
header-align="center"> |
|
|
|
<template slot-scope="scope"> |
|
|
|
{{ scope.row.operatorDisplayName || scope.row.operatorUserName || '-' }} |
|
|
|
</template> |
|
|
|
</el-table-column> |
|
|
|
|
|
|
|
<el-table-column |
|
|
|
prop="applyStatus" |
|
|
|
label="单据状态" |
|
|
|
width="90" |
|
|
|
align="center" |
|
|
|
header-align="center"> |
|
|
|
</el-table-column> |
|
|
|
|
|
|
|
<el-table-column |
|
|
|
prop="operationDesc" |
|
|
|
label="操作摘要" |
|
|
|
min-width="240" |
|
|
|
show-overflow-tooltip> |
|
|
|
</el-table-column> |
|
|
|
</el-table> |
|
|
|
</div> |
|
|
|
</el-drawer> |
|
|
|
|
|
|
|
<!-- 新增/编辑弹窗 --> |
|
|
|
<el-dialog |
|
|
|
:title="dialogTitle" |
|
|
|
@ -232,7 +357,7 @@ |
|
|
|
</template> |
|
|
|
|
|
|
|
<script> |
|
|
|
import { getRawMaterialList, saveRawMaterial, deleteRawMaterial, batchDeleteRawMaterial, getPartDescByPartNo } from '@/api/erf/erf' |
|
|
|
import { getRawMaterialList, getRawMaterialChangeLogList, saveRawMaterial, deleteRawMaterial, batchDeleteRawMaterial, getPartDescByPartNo } from '@/api/erf/erf' |
|
|
|
import { searchStandardRoutingOperationList } from '@/api/part/standardRoutingOperation' |
|
|
|
|
|
|
|
export default { |
|
|
|
@ -254,6 +379,11 @@ export default { |
|
|
|
type: String, |
|
|
|
default: '' |
|
|
|
}, |
|
|
|
// 当前申请单状态 |
|
|
|
applyStatus: { |
|
|
|
type: String, |
|
|
|
default: '' |
|
|
|
}, |
|
|
|
// 试验负责人（显示名） |
|
|
|
projectLeader: { |
|
|
|
type: String, |
|
|
|
@ -276,9 +406,18 @@ export default { |
|
|
|
// 原材料清单数据 |
|
|
|
rawMaterialList: [], |
|
|
|
|
|
|
|
// 原材料修改记录 |
|
|
|
changeLogList: [], |
|
|
|
|
|
|
|
// 表格加载状态 |
|
|
|
tableLoading: false, |
|
|
|
|
|
|
|
// 修改记录加载状态 |
|
|
|
changeLogLoading: false, |
|
|
|
|
|
|
|
// 修改记录抽屉 |
|
|
|
changeLogDrawerVisible: false, |
|
|
|
|
|
|
|
// 已选中的行 |
|
|
|
selectedRows: [], |
|
|
|
|
|
|
|
@ -315,12 +454,17 @@ export default { |
|
|
|
|
|
|
|
mounted() { |
|
|
|
this.loadRawMaterialList() |
|
|
|
this.loadChangeLogList() |
|
|
|
}, |
|
|
|
|
|
|
|
watch: { |
|
|
|
applyNo(newVal) { |
|
|
|
if (newVal) { |
|
|
|
this.loadRawMaterialList() |
|
|
|
this.loadChangeLogList() |
|
|
|
} else { |
|
|
|
this.changeLogList = [] |
|
|
|
this.changeLogDrawerVisible = false |
|
|
|
} |
|
|
|
}, |
|
|
|
buNo(newVal, oldVal) { |
|
|
|
@ -360,6 +504,12 @@ export default { |
|
|
|
} |
|
|
|
|
|
|
|
return leaderList.some(item => item === currentUserName || item === currentUserDisplay) |
|
|
|
}, |
|
|
|
/** |
|
|
|
* 非草稿状态下需记录详细修改日志 |
|
|
|
*/ |
|
|
|
shouldRecordChangeLog() { |
|
|
|
return !!this.applyStatus && this.applyStatus !== '草稿' |
|
|
|
} |
|
|
|
}, |
|
|
|
|
|
|
|
@ -388,6 +538,39 @@ export default { |
|
|
|
}) |
|
|
|
}, |
|
|
|
|
|
|
|
/** |
|
|
|
* 加载原材料修改记录 |
|
|
|
*/ |
|
|
|
loadChangeLogList() { |
|
|
|
if (!this.applyNo) { |
|
|
|
this.changeLogList = [] |
|
|
|
return |
|
|
|
} |
|
|
|
|
|
|
|
this.changeLogLoading = true |
|
|
|
getRawMaterialChangeLogList({ applyNo: this.applyNo }).then(({data}) => { |
|
|
|
this.changeLogLoading = false |
|
|
|
if (data && data.code === 0) { |
|
|
|
this.changeLogList = data.list || [] |
|
|
|
} else { |
|
|
|
this.changeLogList = [] |
|
|
|
this.$message.error(data.msg || '查询原材料修改记录失败') |
|
|
|
} |
|
|
|
}).catch(() => { |
|
|
|
this.changeLogLoading = false |
|
|
|
this.changeLogList = [] |
|
|
|
this.$message.error('查询原材料修改记录异常') |
|
|
|
}) |
|
|
|
}, |
|
|
|
|
|
|
|
/** |
|
|
|
* 打开修改记录抽屉 |
|
|
|
*/ |
|
|
|
openChangeLogDrawer() { |
|
|
|
this.changeLogDrawerVisible = true |
|
|
|
this.loadChangeLogList() |
|
|
|
}, |
|
|
|
|
|
|
|
/** |
|
|
|
* 按BU加载标准工序下拉 |
|
|
|
*/ |
|
|
|
@ -536,6 +719,7 @@ export default { |
|
|
|
this.$message.success('保存成功') |
|
|
|
this.dialogVisible = false |
|
|
|
this.loadRawMaterialList() |
|
|
|
this.loadChangeLogList() |
|
|
|
} else { |
|
|
|
this.$message.error(data.msg || '保存失败') |
|
|
|
} |
|
|
|
@ -558,6 +742,7 @@ export default { |
|
|
|
if (data && data.code === 0) { |
|
|
|
this.$message.success('删除成功') |
|
|
|
this.loadRawMaterialList() |
|
|
|
this.loadChangeLogList() |
|
|
|
} else { |
|
|
|
this.$message.error(data.msg || '删除失败') |
|
|
|
} |
|
|
|
@ -587,6 +772,7 @@ export default { |
|
|
|
if (data && data.code === 0) { |
|
|
|
this.$message.success('删除成功') |
|
|
|
this.loadRawMaterialList() |
|
|
|
this.loadChangeLogList() |
|
|
|
this.selectedRows = [] |
|
|
|
} else { |
|
|
|
this.$message.error(data.msg || '删除失败') |
|
|
|
@ -629,6 +815,49 @@ export default { |
|
|
|
*/ |
|
|
|
handleSelectionChange(selection) { |
|
|
|
this.selectedRows = selection |
|
|
|
}, |
|
|
|
|
|
|
|
/** |
|
|
|
* 格式化时间 |
|
|
|
*/ |
|
|
|
formatDateTime(dateValue) { |
|
|
|
if (!dateValue) { |
|
|
|
return '-' |
|
|
|
} |
|
|
|
if (typeof dateValue === 'string') { |
|
|
|
return dateValue |
|
|
|
} |
|
|
|
const date = new Date(dateValue) |
|
|
|
if (isNaN(date.getTime())) { |
|
|
|
return '-' |
|
|
|
} |
|
|
|
const y = date.getFullYear() |
|
|
|
const m = String(date.getMonth() + 1).padStart(2, '0') |
|
|
|
const d = String(date.getDate()).padStart(2, '0') |
|
|
|
const hh = String(date.getHours()).padStart(2, '0') |
|
|
|
const mm = String(date.getMinutes()).padStart(2, '0') |
|
|
|
const ss = String(date.getSeconds()).padStart(2, '0') |
|
|
|
return `${y}-${m}-${d} ${hh}:${mm}:${ss}` |
|
|
|
}, |
|
|
|
|
|
|
|
/** |
|
|
|
* 操作类型对应样式 |
|
|
|
*/ |
|
|
|
getOperationTypeClass(operationType) { |
|
|
|
const operation = this.formatOperationType(operationType) |
|
|
|
const classMap = { |
|
|
|
'新增': 'operation-type-add', |
|
|
|
'删除': 'operation-type-delete', |
|
|
|
'修改': 'operation-type-edit' |
|
|
|
} |
|
|
|
return classMap[operation] || 'operation-type-default' |
|
|
|
}, |
|
|
|
|
|
|
|
/** |
|
|
|
* 标准化操作类型 |
|
|
|
*/ |
|
|
|
formatOperationType(operationType) { |
|
|
|
return operationType ? String(operationType).trim() : '' |
|
|
|
} |
|
|
|
} |
|
|
|
} |
|
|
|
@ -640,6 +869,130 @@ export default { |
|
|
|
background-color: #ffffff; |
|
|
|
} |
|
|
|
|
|
|
|
.toolbar-row { |
|
|
|
margin-bottom: 10px; |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
justify-content: space-between; |
|
|
|
gap: 12px; |
|
|
|
} |
|
|
|
|
|
|
|
.toolbar-left { |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
flex-wrap: wrap; |
|
|
|
gap: 8px; |
|
|
|
min-width: 0; |
|
|
|
} |
|
|
|
|
|
|
|
.toolbar-right { |
|
|
|
display: flex; |
|
|
|
align-items: center; |
|
|
|
flex-shrink: 0; |
|
|
|
} |
|
|
|
|
|
|
|
.change-log-badge { |
|
|
|
margin-right: 2px; |
|
|
|
} |
|
|
|
|
|
|
|
.change-log-drawer-body { |
|
|
|
padding: 0 16px 12px 16px; |
|
|
|
} |
|
|
|
|
|
|
|
.change-log-drawer-toolbar { |
|
|
|
display: flex; |
|
|
|
justify-content: space-between; |
|
|
|
align-items: center; |
|
|
|
margin-bottom: 8px; |
|
|
|
} |
|
|
|
|
|
|
|
.change-log-count { |
|
|
|
color: #606266; |
|
|
|
font-size: 13px; |
|
|
|
font-weight: 600; |
|
|
|
} |
|
|
|
|
|
|
|
/* 覆盖全局 .el-table .cell 固定14px，避免操作类型被上下裁切 */ |
|
|
|
.change-log-table >>> td.operation-type-cell .cell { |
|
|
|
height: auto !important; |
|
|
|
line-height: 20px !important; |
|
|
|
overflow: visible !important; |
|
|
|
padding-top: 2px; |
|
|
|
padding-bottom: 2px; |
|
|
|
} |
|
|
|
|
|
|
|
.operation-type-pill { |
|
|
|
display: inline-flex; |
|
|
|
align-items: center; |
|
|
|
justify-content: center; |
|
|
|
min-width: 44px; |
|
|
|
min-height: 20px; |
|
|
|
line-height: 16px; |
|
|
|
padding: 0 8px; |
|
|
|
box-sizing: border-box; |
|
|
|
border-radius: 10px; |
|
|
|
font-size: 12px; |
|
|
|
font-weight: 600; |
|
|
|
} |
|
|
|
|
|
|
|
.operation-type-add { |
|
|
|
background: #f0f9eb; |
|
|
|
color: #67c23a; |
|
|
|
border: 1px solid #c2e7b0; |
|
|
|
} |
|
|
|
|
|
|
|
.operation-type-delete { |
|
|
|
background: #fef0f0; |
|
|
|
color: #f56c6c; |
|
|
|
border: 1px solid #f5bcbc; |
|
|
|
} |
|
|
|
|
|
|
|
.operation-type-edit { |
|
|
|
background: #fdf6ec; |
|
|
|
color: #e6a23c; |
|
|
|
border: 1px solid #f5dab1; |
|
|
|
} |
|
|
|
|
|
|
|
.operation-type-default { |
|
|
|
background: #f4f4f5; |
|
|
|
color: #909399; |
|
|
|
border: 1px solid #e9e9eb; |
|
|
|
} |
|
|
|
|
|
|
|
.log-detail-wrapper { |
|
|
|
padding: 8px 12px; |
|
|
|
background: #fafafa; |
|
|
|
} |
|
|
|
|
|
|
|
.log-detail-item { |
|
|
|
margin-bottom: 8px; |
|
|
|
} |
|
|
|
|
|
|
|
.log-detail-item:last-child { |
|
|
|
margin-bottom: 0; |
|
|
|
} |
|
|
|
|
|
|
|
.log-detail-label { |
|
|
|
display: inline-block; |
|
|
|
margin-bottom: 4px; |
|
|
|
color: #606266; |
|
|
|
font-size: 12px; |
|
|
|
font-weight: 600; |
|
|
|
} |
|
|
|
|
|
|
|
.log-detail-pre { |
|
|
|
margin: 0; |
|
|
|
white-space: pre-wrap; |
|
|
|
word-break: break-all; |
|
|
|
background: #fff; |
|
|
|
border: 1px solid #ebeef5; |
|
|
|
border-radius: 2px; |
|
|
|
padding: 6px 8px; |
|
|
|
color: #606266; |
|
|
|
font-size: 12px; |
|
|
|
line-height: 1.5; |
|
|
|
} |
|
|
|
|
|
|
|
/* 按钮样式 - 与附件上传保持一致 */ |
|
|
|
.add-btn { |
|
|
|
background-color: #F0F9FF; |
|
|
|
|
