hberp/hb_client/src/views/mtm/materialDetail.vue

232 lines
7.7 KiB
Python

<template>
<div class="app-container">
<el-card>
<el-card >
<el-descriptions title="物料基本信息" direction="vertical" :column="8" border>
<el-descriptions-item label="物料编号"> {{materialdetail.number}}</el-descriptions-item>
<el-descriptions-item label="物料名称"> {{materialdetail.name}}</el-descriptions-item>
<el-descriptions-item label="规格型号" :span="2"> {{materialdetail.specification}}</el-descriptions-item>
<el-descriptions-item label="计量单位"> {{materialdetail.unit}} </el-descriptions-item>
<el-descriptions-item label="数量"> {{materialdetail.count}}</el-descriptions-item>
</el-descriptions>
</el-card>
<el-tabs v-model="activeName" type="card" >
<el-tab-pane label="对应的批次" name="3">
<el-table
v-loading="listLoading"
:data="InventoryList"
border
fit
stripe
highlight-current-row
>
<el-table-column type="index" width="50" />
<el-table-column label="物料批次">
<template slot-scope="scope">{{ scope.row.batch }}</template>
</el-table-column>
<el-table-column label="物料名称">
<template slot-scope="scope">{{ scope.row.material_.name }}</template>
</el-table-column>
<el-table-column label="规格型号">
<template slot-scope="scope">{{ scope.row.material_.specification }}</template>
</el-table-column>
<el-table-column label="物料编号">
<template slot-scope="scope">{{
scope.row.material_.number
}}</template>
</el-table-column>
<el-table-column label="仓库名称">
<template slot-scope="scope">{{
scope.row.warehouse_.name
}}</template>
</el-table-column>
<el-table-column label="仓库编号">
<template slot-scope="scope">{{
scope.row.warehouse_.number
}}</template>
</el-table-column>
<el-table-column label="物料总存量">
<template slot-scope="scope">{{ scope.row.count }}</template>
</el-table-column>
</el-table>
</el-tab-pane>
<el-tab-pane label="关联的订单" name="1">
<el-table
v-loading="listLoading"
:data="orderlist"
border
fit
stripe
highlight-current-row
height="100"
v-el-height-adaptive-table="{bottomOffset: 50}"
>
<el-table-column type="index" width="50" />
<el-table-column label="订单编号" show-overflow-tooltip>
<template slot-scope="scope">{{ scope.row.number }}</template>
</el-table-column>
<el-table-column label="客户" show-overflow-tooltip>
<template slot-scope="scope">{{ scope.row.customer_.name }}</template>
</el-table-column>
<el-table-column label="所属合同" show-overflow-tooltip>
<template slot-scope="scope">{{ scope.row.contract_.name }}</template>
</el-table-column>
<el-table-column label="产品名称" show-overflow-tooltip>
<template slot-scope="scope">{{ scope.row.product_.name }}</template>
</el-table-column>
<el-table-column label="产品型号" show-overflow-tooltip>
<template slot-scope="scope">{{ scope.row.product_.specification }}</template>
</el-table-column>
<el-table-column label="产品数量" >
<template slot-scope="scope">{{ scope.row.count }}</template>
</el-table-column>
<el-table-column label="交货日期" >
<template slot-scope="scope">{{ scope.row.delivery_date }}</template>
</el-table-column>
<el-table-column label="创建时间" >
<template slot-scope="scope">{{ scope.row.create_time }}</template>
</el-table-column>
</el-table>
</el-tab-pane>
<el-tab-pane label="关联的计划" name="2">
<el-table
:data="productionplanList"
border
fit
stripe
style="width: 100%"
height="300"
>
<el-table-column type="index" width="50" />
<el-table-column label="任务编号" >
<template slot-scope="scope">{{ scope.row.number }}</template>
</el-table-column>
<el-table-column label="订单编号" >
<template slot-scope="scope">{{ scope.row.order_.number }}</template>
</el-table-column>
<el-table-column label="合同编号" >
<template slot-scope="scope">{{ scope.row.order_.contract_.number }}</template>
</el-table-column>
<el-table-column label="生产数量" >
<template slot-scope="scope">{{ scope.row.count }}</template>
</el-table-column>
<el-table-column label="计划开工时间">
<template slot-scope="scope">{{ scope.row.start_date }}</template>
</el-table-column>
<el-table-column label="计划完工时间" >
<template slot-scope="scope">{{ scope.row.end_date }}</template>
</el-table-column>
<el-table-column label="交付截止时间" >
<template slot-scope="scope">{{ scope.row.order_.delivery_date }}</template>
</el-table-column>
<el-table-column label="是否生成子计划" >
<template slot-scope="scope" >
<el-tag v-if="scope.row.is_planed==false"></el-tag>
<el-tag v-if="scope.row.is_planed==true"></el-tag>
</template>
</el-table-column>
<el-table-column label="创建时间">
<template slot-scope="scope">{{ scope.row.create_time }}</template>
</el-table-column>
</el-table>
</el-tab-pane>
</el-tabs>
</el-card>
</div>
</template>
<script>
import checkPermission from "@/utils/permission";
import vueJsonEditor from "vue-json-editor";
import {upUrl, upHeaders} from "@/api/file";
import {getProductionplanList } from "@/api/pm";
import {getmaterialbatchList} from "@/api/inm";
import {getOrderList } from "@/api/sam";
import {getMaterial } from "@/api/mtm";
import { upFile } from "@/api/file";
import {genTree} from "@/utils";
import Pagination from "@/components/Pagination"; // secondary package based on el-pagination
import Treeselect from '@riophae/vue-treeselect'
import '@riophae/vue-treeselect/dist/vue-treeselect.css'
export default {
components: {Pagination, vueJsonEditor, Treeselect},
data() {
return {
materialdetail:"",
orderlist:"",
productionplanList:"",
InventoryList:"",
activeName:'3',
};
},
computed: {},
watch: {},
created() {
this.material = this.$route.params.id;
this.getMaterial();
this.getOrderList();
this.getplanList();
this.getmaterialbatchList();
},
methods: {
getMaterial(){
getMaterial(this.material).then((response) => {
if (response.data) {
this.materialdetail = response.data;//物料基本信息
}
})
},
getOrderList(){
getOrderList({product:this.material,page:0}).then((response) => {
if (response.data) {
this.orderlist = response.data;//物料关联的订单
}
})
},
getplanList() {
getProductionplanList({product:this.material,page:0}).then((response) => {
if (response.data) {
this.productionplanList = response.data;//物料关联计划
}
});
},
getmaterialbatchList() {
getmaterialbatchList({material:this.material,page:0}).then((response) => {
if (response.data) {
this.InventoryList = response.data;
}
});
},
},
};
</script>