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

295 lines
9.5 KiB
Python

<template>
<div class="app-container">
<el-card class="box-card">
<div slot="header" class="clearfix">
<span>生产任务列表</span>
<el-input
v-model="listQuery.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>
</div>
<el-table
:data="productionplanList.results"
border
fit
stripe
style="width: 100%"
height="300"
@row-click="tableRowClick"
>
<el-table-column type="index" width="50"/>
<el-table-column label="任务编号" prop="number" width="110">
</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.order_">
<span v-if="scope.row.order_.contract_">{{scope.row.order_.contract_.number}}</span>
</template>
</el-table-column>
<el-table-column label="产品名称" width="250">
<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="生产数量" prop="count" width="110">
</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="计划开工时间" prop="start_date" width="110">
</el-table-column>
<el-table-column label="计划完工时间" prop="end_date" width="110">
</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
align="center"
label="操作"
fixed="right"
>
<template slot-scope="scope">
<el-link
v-if="scope.row.is_planed&&checkPermission(['testitem_detail'])"
type="primary"
@click="handleselectplan(scope)"
>
详情
</el-link>
</template>
</el-table-column>
</el-table>
<pagination
v-show="productionplanList.count > 0"
:total="productionplanList.count"
:page.sync="listQuery.page"
:limit.sync="listQuery.page_size"
@pagination="getplanList"
/>
</el-card>
<el-card class="box-card">
<div style="height: 40px;line-height: 40px;background: #F5F7FA;padding-left: 20px;">甘特图</div>
<gantt
v-if="proList.length>0"
:proList="proList"
style="position: relative"
></gantt>
</el-card>
</div>
</template>
<script>
import {getPlanGantt} from "@/api/srm";
import gantt from "@/components/Gantt/index";
import {getProductionplanList} from "@/api/pm";
import checkPermission from "@/utils/permission";
import Pagination from "@/components/Pagination"; // secondary package based on el-pagination
export default {
components: {Pagination, gantt},
data() {
return {
productionplanList: {
count: 0,
},
listQuery: {
page: 1,
page_size: 20,
},
state_: {
10: "制定中",
20: "已下达",
30: "已接受",
40: "生产中",
50: "已完成",
60: "军检完成",
70: "暂停",
80: "终止"
},
listLoading: true,
proList: [],
};
},
computed: {},
watch: {},
created() {
this.getplanList();
},
methods: {
checkPermission,
//搜索生产计划
handleFilter() {
this.listQuery.page = 1;
this.getplanList();
},
resetFilter() {
this.listQuery = {
page: 1,
page_size: 20,
}
this.getplanList();
},
//生产计划列表
tableRowClick(row) {
let that = this;
getPlanGantt({}).then(res => {
if (res.code === 200) {
let arr = [], list = [];
let li = res.data.results;
li.forEach((item) => {
if (item.id === row.id) {
list.push(item)
}
});
// debugger;
// console.log(list);
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.per1 = item.count_ok;
obj.type = 1;
obj.productName = item.product_.name;
obj.productNum = item.product_.specification;
obj.isShow = true;
arr.push(obj);
} else if (item.children && item.children.length >= 1) {
let startTime = new Date(item.start_date).getTime();
let endTime = new Date(item.end_date).getTime();
let temp = [];
let parentId = item.id;
let children = item.children;
children.forEach(child => {
let start = new Date(child.start_date).getTime();
let end = new Date(child.end_date).getTime();
let objChild = new Object();
objChild.name = child.number;
objChild.id = child.id;
objChild.top = 50;
objChild.parentId = parentId;
objChild.startTime = start;
objChild.endTime = end;
objChild.planTime = [start, end];
objChild.per = child.count;
objChild.per1 = child.count_ok;
objChild.type = 1;
objChild.productName = child.product_.name;
objChild.productNum = child.product_.specification;
objChild.isShow = true;
temp.push(objChild);
});
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.per1 = item.count_ok;
obj.type = 3;
obj.productName = item.product_.name;
obj.productNum = item.product_.specification;
obj.children = temp;
obj.isShow = true;
arr.push(obj);
}
that.proList = arr;
// debugger;
// console.log(arr)
});
} else {
that.$message.error(res.msg);
}
})
},
//列表
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 = [];
debugger;
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;
});
},
//详情
handleselectplan(scope) {
this.$router.push({name: "plandetails", params: {id: scope.row.id}});
},
},
};
</script>
//样式文件
<style>
.el-table .warning-row {
background: oldlace;
}
.el-table .success-row {
background: #f0f9eb;
}
</style>