- 新增调拨单主表和明细表相关API接口 - 新增调拨单主表和明细表前端页面 - 新增钢卷选择器组件和调拨明细表格组件 - 修改产品信息和原料信息渲染组件支持更多字段 - 修改产品选择和原料选择组件支持数值类型值 - 修改钢卷号渲染组件支持更多字段和外部数据 - 新增调拨单匹配物料接口
92 lines
2.8 KiB
Vue
92 lines
2.8 KiB
Vue
<template>
|
||
<div>
|
||
<el-popover
|
||
trigger="hover"
|
||
placement="top"
|
||
width="400"
|
||
:visible-arrow="true"
|
||
append-to-body
|
||
popper-class="product-info-popover"
|
||
>
|
||
<!-- popover 内容(原dialog中的描述列表) -->
|
||
<el-descriptions :column="2" class="popover-content">
|
||
<el-descriptions-item label="产品名称">
|
||
{{ productFull.productName || '--' }}
|
||
</el-descriptions-item>
|
||
<!-- <el-descriptions-item label="产品编码">
|
||
{{ productFull.productCode || '--' }}
|
||
</el-descriptions-item> -->
|
||
<el-descriptions-item label="规格">
|
||
{{ productFull.specification || '--' }}
|
||
</el-descriptions-item>
|
||
<el-descriptions-item label="材质">
|
||
{{ productFull.material || '--' }}
|
||
</el-descriptions-item>
|
||
<el-descriptions-item label="表面处理">
|
||
{{ productFull.surfaceTreatment || '--' }}
|
||
</el-descriptions-item>
|
||
<el-descriptions-item label="镀层质量">
|
||
{{ productFull.zincLayer || '--' }}
|
||
</el-descriptions-item>
|
||
<el-descriptions-item label="厂家">
|
||
{{ productFull.manufacturer || '--' }}
|
||
</el-descriptions-item>
|
||
</el-descriptions>
|
||
|
||
<!-- 触发元素(原产品名称文本) -->
|
||
<span slot="reference" class="product-name">
|
||
<slot name="default" :product="productFull">
|
||
{{ productFull.productName || '未知' }}[{{ productFull.specification || '无规格' }}]({{ productFull.material || '无材质' }})-{{ productFull.manufacturer || '无厂家' }}-{{ productFull.zincLayer || '无镀层' }}
|
||
</slot>
|
||
</span>
|
||
</el-popover>
|
||
</div>
|
||
</template>
|
||
|
||
<script>
|
||
export default {
|
||
name: 'ProductInfo',
|
||
props: {
|
||
product: {
|
||
type: Object,
|
||
default: () => ({})
|
||
},
|
||
},
|
||
data() {
|
||
return {
|
||
// 移除showDetail,无需弹窗控制
|
||
};
|
||
},
|
||
computed: {
|
||
productFull() {
|
||
// 完整的product, 确保每个字段都有值
|
||
if (!this.product) {
|
||
return {};
|
||
}
|
||
return {
|
||
productId: this.product.itemId || this.product.productId || '',
|
||
productName: this.product.itemName || this.product.productName || '',
|
||
// productCode: this.product.productCode || '',
|
||
specification: this.product.specification || '',
|
||
material: this.product.material || '',
|
||
surfaceTreatment: this.product.surfaceTreatmentDesc || '',
|
||
zincLayer: this.product.zincLayer || '',
|
||
manufacturer: this.product.manufacturer || '',
|
||
};
|
||
}
|
||
},
|
||
methods: {
|
||
// 移除clickHandle方法,无需点击触发
|
||
},
|
||
};
|
||
</script>
|
||
|
||
<style scoped>
|
||
.product-name {
|
||
color: #1890ff;
|
||
cursor: pointer;
|
||
text-decoration: underline;
|
||
/* 增加内边距,优化悬停触发区域 */
|
||
padding: 2px 4px;
|
||
}
|
||
</style> |