hberp/hb_client/src/views/pm/plan.vue

431 lines
14 KiB
Python

<template>
<div class="app-container">
<el-card class="box-card">
<div slot="header" class="clearfix">
<span>生产任务列表</span>
</div>
<el-input
v-model="listQuery1.search"
placeholder="任务编号/订单编号/合同编号/产品名称"
style="width: 300px"
class="filter-item"
@keyup.enter.native="handleFilter"
/>
<el-button
class="filter-item"
type="primary"
icon="el-icon-search"
@click="handleFilter"
>搜索
</el-button>
<el-button
class="filter-item"
type="primary"
icon="el-icon-refresh-left"
@click="resetFilter"
>重置
</el-button>
<el-table
:data="productionplanList.results"
border
fit
stripe
style="width: 100%"
height="300"
>
<el-table-column type="index" width="50"/>
<el-table-column label="任务编号" width="110">
<template slot-scope="scope">{{ scope.row.number }}</template>
</el-table-column>
<el-table-column label="订单编号" width="110">
<template slot-scope="scope">{{ scope.row.order_.number }}</template>
</el-table-column>
<el-table-column label="合同编号" width="110">
<template slot-scope="scope" v-if="scope.row.contract">{{ scope.row.order_.contract_.number }}</template>
</el-table-column>
<el-table-column label="产品名称" width="150" show-overflow-tooltip>
<template slot-scope="scope">{{ scope.row.product_.name }}</template>
</el-table-column>
<el-table-column label="产品型号" width="110">
<template slot-scope="scope">{{ scope.row.product_.specification }}</template>
</el-table-column>
<el-table-column label="产品单位" width="110">
<template slot-scope="scope">{{ scope.row.product_.unit }}</template>
</el-table-column>
<el-table-column label="生产数量" width="110">
<template slot-scope="scope">{{ scope.row.count }}</template>
</el-table-column>
<el-table-column label="状态" width="110">
<template slot-scope="scope">{{ state_[scope.row.state] }}</template>
</el-table-column>
<el-table-column label="计划开工时间" width="110">
<template slot-scope="scope">{{ scope.row.start_date }}</template>
</el-table-column>
<el-table-column label="计划完工时间" width="110">
<template slot-scope="scope">{{ scope.row.end_date }}</template>
</el-table-column>
<el-table-column label="交货日期" width="110">
<template slot-scope="scope">{{ scope.row.order_.delivery_date }}</template>
</el-table-column>
<el-table-column label="是否生成子计划" width="120">
<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="创建时间" width="160">
<template slot-scope="scope">{{ scope.row.create_time }}</template>
</el-table-column>
<el-table-column
align="center"
label="操作"
fixed="right"
width="100px"
>
<template slot-scope="scope">
<el-link type="primary"
v-if="scope.row.is_planed"
@click="handleselectplan(scope)"
>查看子计划
</el-link>
<el-link type="primary"
v-else
@click="handleWork(scope)"
>生成子计划
</el-link>
</template>
</el-table-column>
</el-table>
<pagination
v-show="productionplanList.count > 0"
:total="productionplanList.count"
:page.sync="listQuery1.page"
:limit.sync="listQuery1.page_size"
@pagination="getplanList"
/>
</el-card>
<el-tabs class="overFlowShow" type="border-card" v-model="activeName" @tab-click="activeNameClick">
<el-tab-pane label="订单排产" name="订单排产">
<el-table
:data="orderList.results"
border
fit
stripe
style="width: 100%"
height="250"
>
<el-table-column type="index" width="50"/>
<el-table-column label="订单编号" width="110">
<template slot-scope="scope">{{ scope.row.number }}</template>
</el-table-column>
<el-table-column label="客户名称" width="110">
<template slot-scope="scope" show-overflow-tooltip>{{ scope.row.customer_.name }}</template>
</el-table-column>
<el-table-column label="合同编号" width="110">
<template slot-scope="scope" v-if="scope.row.contract">{{ scope.row.contract_.number }}</template>
</el-table-column>
<el-table-column label="合同名称" show-overflow-tooltip width="110">
<template slot-scope="scope" v-if="scope.row.contract">{{ scope.row.contract_.name }}</template>
</el-table-column>
<el-table-column label="所需产品" show-overflow-tooltip width="150">
<template slot-scope="scope">{{ scope.row.product_.name }}</template>
</el-table-column>
<el-table-column label="产品型号" width="110">
<template slot-scope="scope">{{ scope.row.product_.specification }}</template>
</el-table-column>
<el-table-column label="产品数量" width="110">
<template slot-scope="scope">{{ scope.row.count }}</template>
</el-table-column>
<el-table-column label="已派数量" width="110">
<template slot-scope="scope">{{ scope.row.planed_count }}</template>
</el-table-column>
<el-table-column label="交货日期" width="110">
<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-column
align="center"
label="操作"
fixed="right"
width="100px"
>
<template slot-scope="scope">
<el-link type="primary"
v-if="checkPermission(['warehouse_update'])"
@click="handleclick(scope)"
>排产
</el-link
>
</template>
</el-table-column>
</el-table>
<pagination
v-show="orderList.count > 0"
:total="orderList.count"
:page.sync="listQuery.page"
:limit.sync="listQuery.page_size"
@pagination="getorderList"
/>
<el-dialog
:visible.sync="dialogVisible"
:close-on-click-modal="false"
:title="'排产计划'"
>
<el-form
ref="Form"
:model="orderplan"
label-width="120px"
label-position="right"
:rules="rule1"
>
<el-form-item label="排产数量" prop="count">
<el-input-number v-model="orderplan.count" :min="0"></el-input-number>
</el-form-item>
<el-form-item label="计划排产时间" prop="value1">
<el-date-picker
v-model="value1"
type="daterange"
start-placeholder="计划开始日期"
end-placeholder="计划结束日期"
format="yyyy 年 MM 月 dd 日"
value-format="yyyy-MM-dd"
>
</el-date-picker>
</el-form-item>
</el-form>
<div style="text-align: right">
<el-button type="danger" @click="dialogVisible = false">取消</el-button>
<el-button type="primary" @click="confirm('Form')">确认</el-button>
</div>
</el-dialog>
</el-tab-pane>
<el-tab-pane label="甘特图" name="甘特图">
<gantt
v-if="ganttShow"
:proList="proList"
></gantt>
</el-tab-pane>
</el-tabs>
</div>
</template>
<script>
import gantt from "@/components/Gantt/index";
import {getordertoplan} from "@/api/sam";
import {createProductionplan, getProductionplanList, createsubplan} from "@/api/pm";
import {getMaterialList} from "@/api/mtm";
import checkPermission from "@/utils/permission";
import {genTree} from "@/utils";
import Pagination from "@/components/Pagination"; // secondary package based on el-pagination
const defaulteorderplan = {};
export default {
components: {Pagination, gantt},
data() {
return {
orderplan: defaulteorderplan,
orderList: {
count: 0,
},
state_: {
10: '制定中',
20: '已下达',
30: '已接受',
40: '生产中',
50: '已完成',
60: '军检完成'
},
listQuery: {
page: 1,
page_size: 20,
},
productionplanList: {
count: 0,
},
listQuery1: {
page: 1,
page_size: 20,
},
value1: '',
listLoading: true,
ganttShow: false,
dialogVisible: false,
dialogType: "new",
activeName: "订单排产",
rule1: {
number: [{required: true, message: "请输入", trigger: "blur"}],
},
proList: [],
};
},
computed: {},
watch: {},
created() {
this.getorderList();
this.getplanList();
},
methods: {
checkPermission,
//订单列表
getorderList() {
this.listLoading = true;
getordertoplan(this.listQuery).then((response) => {
if (response.data) {
this.orderList = response.data;
}
this.listLoading = false;
});
},
//生产计划列表
//列表
getplanList() {
let that = this;
this.listLoading = true;
getProductionplanList(this.listQuery1).then((response) => {
if (response.data) {
this.productionplanList = response.data;
let list = response.data.results;
let arr = [];
list.forEach(item => {
if (!item.children || item.children.length < 1) {
let startTime = new Date(item.start_date).getTime();
let endTime = new Date(item.end_date).getTime();
let obj = new Object();
obj.name = item.number;
obj.id = item.id;
obj.top = 20;
obj.startTime = startTime;
obj.endTime = endTime;
obj.planTime = [startTime, endTime];
obj.per = item.count;
obj.type = 1;
obj.productName = item.product_.name;
obj.productNum = item.product_.specification;
obj.isShow = true;
arr.push(obj);
}
that.proList = arr;
});
}
this.listLoading = false;
});
},
//搜索生产计划
handleFilter() {
this.listQuery1.page = 1;
this.getplanList();
},
resetFilter() {
this.listQuery1 = {
page: 1,
page_size: 20,
}
this.getplanList();
},
handleclick(scope) {
this.orderID = scope.row.id;
this.countsx = scope.row.count;
this.planed_count = scope.row.planed_count;
this.delivery_date = scope.row.delivery_date;
this.dialogVisible = true;
this.$nextTick(() => {
this.$refs["Form"].resetFields();
this.value1="";
});
},
async confirm(form) {
this.orderplan.start_date = this.value1[0];
if (this.delivery_date >= this.value1[1]) {
this.orderplan.end_date = this.value1[1];
} else {
this.$message.error("计划完成时间超过订单交付日期,请从新选择日期!");
}
this.orderplan.order = this.orderID
if (this.orderplan.count <= (this.countsx - this.planed_count)) {
createProductionplan(this.orderplan).then((res) => {
if (res.code >= 200) {
this.getorderList();
this.getplanList();
this.dialogVisible = false;
this.$message.success("成功");
}
});
} else {
this.$message.error("排产数超过所需数,请合理排产!");
}
},
handleWork(scope) {
this.$confirm("确认生成子计划?", "提醒", {
confirmButtonText: "确认",
cancelButtonText: "取消",
type: "error",
})
.then(async () => {
await createsubplan(scope.row.id).then((res) => {
if (res.code >= 200) {
this.$message.success("生成子计划成功!");
this.$router.push({name: "work", params: {id: scope.row.id},})
this.getplanList()
}
});
})
.catch((err) => {
console.error(err);
});
},
activeNameClick(tab, event) {
debugger;
console.log(tab, event);
if (tab.label === '甘特图') {
this.ganttShow = true;
} else {
this.ganttShow = false;
}
},
//查看子计划
handleselectplan(scope) {
this.$router.push({name: "work", params: {id: scope.row.id},})
}
},
};
</script>
<style>
.el-table .warning-row {
background: oldlace;
}
.el-table .success-row {
background: #f0f9eb;
}
</style>