<template>
|
<GlobalWindow
|
:title="title"
|
:visible.sync="visible"
|
width="80%"
|
:confirm-working="isWorking"
|
@confirm="confirm"
|
>
|
<div style="min-width:1150px;width:100%">
|
<div>
|
<span class="text-code">{{ form.code }}</span>
|
<span v-if="form.status==0" style="background-color: #305ED5;" class="status-log">已计划</span>
|
<span v-if="form.status==1" style="background-color: #F5A400;" class="status-log">已转出</span>
|
<span v-if="form.status==2" style="background-color: #03AF76;" class="status-log">已转入</span>
|
<span v-if="form.status==3" style="background-color: #BBBBBB;" class="status-log">已取消</span>
|
</div>
|
<div class="massage-style" style="margin-top:10px">
|
<el-form :model="form" ref="form" label-width="120px" label-suffix="：" inline>
|
<el-form-item label="单据类型" class="count-style">
|
{{ billToStr(form.type) }}
|
</el-form-item>
|
<div>
|
<el-form-item label="转出组织" class="count-style" >
|
{{ form.outDepartName }}
|
</el-form-item>
|
<el-form-item label="转出仓库" class="count-style" >
|
{{ form.outWarehouseName }}
|
</el-form-item>
|
<el-form-item label="转出仓管员" class="count-style" >
|
{{ form.outUserName }}
|
</el-form-item>
|
<el-form-item label="计划转出日期" class="count-style" >
|
{{ form.outPlandate }}
|
</el-form-item>
|
<el-form-item label="出库单号" class="count-style" >
|
<span style="color: #2e68ec; font-weight: 500;">{{ form.outBillCode }}</span>
|
</el-form-item>
|
<el-form-item label="实际转出日期" class="count-style" >
|
{{ form.outActdate }}
|
</el-form-item>
|
</div>
|
<div>
|
<el-form-item label="转入组织" class="count-style" >
|
{{ form.inDepartName }}
|
</el-form-item>
|
<el-form-item label="转入仓库" class="count-style" >
|
{{ form.inWarehouseName }}
|
</el-form-item>
|
<el-form-item label="转入仓管员" class="count-style" >
|
{{ form.inUserName }}
|
</el-form-item>
|
<el-form-item label="计划转入日期" class="count-style" >
|
{{ form.inPlandate }}
|
</el-form-item>
|
<el-form-item label="入库单号" class="count-style" >
|
<span style="color: #2e68ec; font-weight: 500;">{{ form.inBillCode }}</span>
|
</el-form-item>
|
<el-form-item label="实际转入日期" class="count-style" >
|
{{ form.inActdate }}
|
</el-form-item>
|
</div>
|
<el-form-item label="单据摘要" style="width:95%;height: 30px;display:inline;">
|
<span style="width:950px" class="long-title-style" :title="form.abstracts">{{ form.abstracts || '-' }}</span>
|
</el-form-item>
|
<div v-if="form.status == 3">
|
<el-form-item label="取消时间" class="count-style">
|
{{ form.cancelDate }}
|
</el-form-item>
|
<el-form-item label="取消人" class="count-style">
|
{{ form.cancelUserName + ' - ' + form.cancelUserMobile }}
|
</el-form-item>
|
<el-form-item label="取消原因" style="width:95%;height: 30px;display:inline;">
|
<span style="width:950px" class="long-title-style" :title="form.cancelInfo">{{ form.cancelInfo }}</span>
|
</el-form-item>
|
</div>
|
</el-form>
|
</div>
|
<!-- 列表 -->
|
<div style="margin:20px 0 10px 0">
|
<span style="font-size: 14px; font-weight: 500">转库明细</span>
|
</div>
|
<el-table :data="form.wtransferDetailList" border stripe >
|
<el-table-column align="center" prop="materialName" label="物料名称" fixed="left" min-width="100px"></el-table-column>
|
<el-table-column align="center" prop="attr" label="规格" min-width="100px"></el-table-column>
|
<el-table-column align="center" label="物料编码" min-width="160px">
|
<template slot-scope="{row}">
|
<span style="color: #2e68ec;">{{ row.materialCode }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column align="center" prop="batch" label="批次号" min-width="100px">
|
<template slot-scope="{row}">
|
{{ row.batch || '-' }}
|
</template>
|
</el-table-column>
|
<el-table-column align="center" prop="procedureName" label="工序" min-width="100px">
|
<template slot-scope="{row}">
|
<span >{{ row.procedureName || '-' }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column align="center" label="质量属性" min-width="100px">
|
<template slot-scope="{row}">
|
<span v-if="row.qualityType==0" class="valid-style">合格</span>
|
<span v-else-if="row.qualityType==1" class="unvalid-style">不良</span>
|
<span v-else-if="row.qualityType==2" class="scrap-style">报废</span>
|
<span v-else>-</span>
|
</template>
|
</el-table-column>
|
<el-table-column align="center" prop="outWarehouseName" label="转出仓库" min-width="100px"></el-table-column>
|
<el-table-column align="center" prop="outWarehouseName" label="转出货位" show-overflow-tooltip min-width="100px">
|
<template slot-scope="{row}">
|
<span class="long-title-style">{{ row.outLocationName ? row.outLocationName : '-' }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column align="center" prop="inWarehouseName" label="转入仓库" min-width="100px"></el-table-column>
|
<el-table-column align="center" prop="inLocationName" label="转入货位" show-overflow-tooltip min-width="100px">
|
<template slot-scope="{row}">
|
<span class="long-title-style">{{ row.inLocationName ? row.inLocationName : '-' }}</span>
|
</template>
|
</el-table-column>
|
<el-table-column align="center" prop="outPlannum" label="计划转库数量" min-width="100px">
|
<template slot-scope="{row}">
|
{{ row.outPlannum + row.unitName }}
|
</template>
|
</el-table-column>
|
<el-table-column align="center" prop="outActnum" label="实际转出数量" min-width="100px">
|
<template slot-scope="{row}">
|
{{ row.outActnum + row.unitName }}
|
</template>
|
</el-table-column>
|
<el-table-column align="center" prop="inActnum" fixed="right" label="实际转入数量" min-width="100px">
|
<template slot-scope="{row}">
|
{{ row.inActnum + row.unitName }}
|
</template>
|
</el-table-column>
|
</el-table>
|
</div>
|
<div slot="footer" class="window__header">
|
<el-button type="primary" @click="cancel">返回</el-button>
|
</div>
|
</GlobalWindow>
|
</template>
|
|
<script>
|
import BaseOpera from '@/components/base/BaseOpera'
|
import GlobalWindow from '@/components/common/GlobalWindow'
|
export default {
|
name: 'OperaWrollOutStoreDetail',
|
extends: BaseOpera,
|
components: { GlobalWindow },
|
data () {
|
return {
|
// 表单数据
|
form: {
|
status: 0,
|
abstracts: null, // 摘要
|
code: null, // 转库单号
|
outDepartName: null, // 转出组织名
|
outWarehouseName: null, // 转出仓库名
|
outUserName: null, // 转出仓管名
|
outPlandate: null, // 计划转出日期
|
outBillCode: null, // 出库单号
|
outActdate: null, // 实际出库日期
|
inDepartName: null, // 转入组织名
|
inWarehouseName: null, // 转入仓库名
|
inUserName: null, // 转入仓管名
|
inPlandate: null, // 计划转入日期
|
inBillCode: null, // 入库单号
|
inActdate: null, // 实际入库日期
|
cancelInfo: null, // 取消原因
|
cancelDate: null, // 取消日期
|
cancelUserName: null, // 取消日期
|
cancelUserMobile: null, // 取消日期
|
type: null,
|
wtransferDetailList: []
|
},
|
// 验证规则
|
rules: {
|
planDate: [
|
{ required: true, message: '请选择日期', trigger: 'change' }
|
],
|
outWarehouseId: [
|
{ required: true, message: '请输入转出仓库', trigger: 'blur' }
|
],
|
inWarehouseId: [
|
{ required: true, message: '请输入转入仓库', trigger: 'blur' }
|
]
|
},
|
options: [
|
{ name: '11', id: '1' },
|
{ name: '22', id: '2' }
|
],
|
defaultProps: {
|
children: 'children',
|
label: 'label'
|
},
|
list: [
|
{
|
code: 'WL0001',
|
name: '电解液',
|
specification: '1.0',
|
type: '',
|
unit: '个',
|
batch: 'PH2422222',
|
useLocation: '111',
|
num: '500'
|
}
|
],
|
statusList: [
|
{ name: '已计划', id: 0 },
|
{ name: '已转出', id: 1 },
|
{ name: '已转入', id: 2 },
|
{ name: '已取消', id: 3 }
|
],
|
billType: [
|
{ name: '车间领料', id: 1 },
|
{ name: '计划领料', id: 2 },
|
{ name: '机台备料', id: 3 },
|
{ name: '完工入库', id: 4 },
|
{ name: '车间转库', id: 5 },
|
{ name: '外协领料转库', id: 6 },
|
{ name: '外协完工转库', id: 7 },
|
{ name: '产品入库', id: 8 },
|
{ name: '产品转库', id: 9 },
|
{ name: '让步放行入库', id: 10 },
|
{ name: '让步放行转库', id: 11 },
|
{ name: '客返返修领料', id: 12 },
|
{ name: '客返返修入库', id: 13 },
|
{ name: '跨组织转库', id: 14 },
|
{ name: '工序报废', id: 15 },
|
{ name: '客退返修领料', id: 16 },
|
{ name: '客退返修入库', id: 17 },
|
{ name: '销售出库', id: 18 },
|
{ name: '让步销售', id: 19 },
|
{ name: '工单投料', id: 20 },
|
{ name: '仓库报废', id: 21 },
|
{ name: '客退检验领料', id: 22 },
|
{ name: '客返检验领料', id: 23 },
|
{ name: '工单产出', id: 24 },
|
{ name: '采购入库', id: 25 },
|
{ name: '客退检验入库', id: 26 },
|
{ name: '客返检验入库', id: 27 },
|
{ name: '库存调整', id: 28 },
|
{ name: '废品入库', id: 30 },
|
],
|
tempMaterials: [
|
{
|
code: 'WL0001',
|
name: '电解液',
|
specification: '1.0',
|
type: '1',
|
unit: '1',
|
batch: 'PH2422222',
|
useLocation: 'A货架—C1货架-B1货架',
|
num: '500'
|
}
|
],
|
selectedMaterails: []
|
}
|
},
|
created () {
|
this.config({
|
api: '/ext/bomExt',
|
'field.id': 'id'
|
})
|
},
|
methods: {
|
cancel () {
|
this.$refs.form.resetFields()
|
this.visible = false
|
// let that = this
|
},
|
billToStr (type) {
|
|
for (const item of this.billType) {
|
if (item.id === type) return item.name
|
}
|
}
|
}
|
}
|
</script>
|
|
<style lang="scss" scoped>
|
.count-style {
|
display: inline-block;
|
width: 24%;
|
height: 30px;
|
}
|
.text-code {
|
color: #2e68ec;
|
font-weight: 500;
|
padding-right: 15px;
|
font-size: 18px;
|
vertical-align:middle;
|
}
|
.status-log {
|
padding: 1px 5px;
|
border-radius: 3px;
|
font-size: 12px;
|
color:#fff;
|
vertical-align:middle;
|
}
|
.massage-style {
|
.el-form-item {
|
margin-bottom: 0px !important;
|
}
|
}
|
|
.form-detail {
|
width: 100%;
|
height: 240px;
|
margin-left: 1%;
|
.form-content {
|
width: 96%;
|
height: 80%;
|
margin-top: 30px;
|
margin-left: 2%;
|
font-size: 14px;
|
}
|
.warp {
|
width: 90%;
|
height: 80%;
|
display: flex;
|
// align-items: center;
|
// justify-content: space-between;
|
.from-warps{
|
width:300px;
|
height: 100%;
|
// display: flex;
|
}
|
.from-warp{
|
width: 300px;
|
height: 100%;
|
// display: flex;
|
margin-left: 30px;
|
}
|
}
|
.text {
|
color: #2e68ec;
|
}
|
P{
|
color: rgb(199, 199, 199);
|
width: 100%;
|
height: 20%;
|
margin-top:-3px;
|
span{
|
color: #000;
|
}
|
}
|
}
|
.toolbar {
|
border-bottom: 1px solid #eee;
|
padding-bottom: 10px;
|
}
|
.input {
|
width: 800px;
|
::v-deep.el-input__inner {
|
width: 600px;
|
}
|
}
|
</style>
|
