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

389 lines
12 KiB
Python

<template>
<div class="app-container">
<el-card class="box-card">
<div slot="header" class="clearfix">
<span>生产任务列表</span>
</div>
<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">{{ 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">{{ 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 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">{{ scope.row.contract_.number }}</template>
</el-table-column>
<el-table-column label="合同名称" show-overflow-tooltip width="110">
<template slot-scope="scope">{{ 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="操作"
width="220px"
>
<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,
},
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.listQuery).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.isShow = true;
arr.push(obj);
}
that.proList = arr;
});
}
this.listLoading = false;
});
},
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"].clearValidate();
});
},
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>