This commit is contained in:
shijing 2021-12-27 17:09:56 +08:00
parent ce635ff949
commit 90f02fd7bb
6 changed files with 246 additions and 225 deletions

View File

@ -240,3 +240,10 @@ export function getCodes() {
method: 'get'
})
}
//工单详情
export function getWorkflowInit(id) {
return request({
url: `/wf/workflow/${id}/init/`,
method: 'get'
})
}

View File

@ -201,14 +201,6 @@
width: item.widthMe + 'px',
top: item.top + 'px'
}"
@mouseover="
lineMouseover(
`line${item.id}`,
$event,
item.id,
item.parentId,
index
)"
@mouseleave="lineMouseleave"
@mouseenter="
lineMouseenter(
@ -303,6 +295,8 @@
},
data() {
return {
windowWidth:0,
windowHeight:0,
leftYear:2021,
timeRange: [],
disable: true,
@ -374,6 +368,13 @@
};
},
mounted(){
if(window.innerHeight){
this.windowWidth = window.innerWidth;
this.windowHeight = window.innerHeight;
}else{
this.windowHeight=document.body.clientHeight?document.body.clientHeight:document.documentElement.clientHeight;
this.windowWidth=document.body.clientWidth?document.body.clientWidth:document.documentElement.clientWidth;
}
let currentYear = new Date().getFullYear();
this.timeRange = [currentYear+'-01',currentYear+'-12'];
this.list = [...this.proList];
@ -518,10 +519,8 @@
},
//修改后续高度
resetTop(zindex, reduce, isexpand) {
// console.log(zindex, reduce, isexpand);
let num = reduce ? -40 : 40;
if (!reduce && !isexpand) {
// console.log(2);
this.list.forEach((item, index) => {
if (index > zindex) {
item.top = item.top + 40;
@ -533,7 +532,6 @@
}
});
} else {
// console.log(1);
this.list.forEach((item, index) => {
if (index > zindex) {
item.top = item.top + num * this.list[zindex].children.length;
@ -584,7 +582,6 @@
let widthMe = width - left;
parent.widthMe = parent.widthChild = widthMe;
parent.left = left;
// return parent;
},
// 转为分组
handlerGroup(row) {
@ -658,10 +655,8 @@
let index = this.list.findIndex(k => {
return k.id == parentId;
});
// console.log(parentId);
this.list.forEach(item => {
if (item.id == parentId) {
// console.log(item, this.list);
item.children.forEach(k => {
if (k.id == id) {
k.per = per;
@ -813,6 +808,17 @@
Math.round(end / this.currentDaySize.value) *
this.currentDaySize.value -
this.currentDaySize.value;
let infoDomX=0,infoDomY = 0;
if(this.windowWidth-e.clientX>230){
infoDomX = e.clientX;
}else{
infoDomX = this.windowWidth-230;
}
if(this.windowHeight-e.clientY>200){
infoDomY = e.clientY;
}else{
infoDomY = this.windowHeight-200;
}
this.currentProjectMsg = {
name: this.computedList[index].name,
allTime: (end - start) / this.currentDaySize.value + 1,
@ -820,8 +826,8 @@
per1: this.computedList[index].per1,
startTime: this.computedWithTime(start),
endTime: this.computedWithTime(end),
left: e.clientX,
top: e.clientY + 20
left:infoDomX ,
top: infoDomY
};
/*
* left:
@ -848,7 +854,6 @@
left: 0,
top: 0
};
// this.handlerSelect();
return;
}
this.currentLineDay = {
@ -1029,7 +1034,6 @@
});
}
},
beforeDestroy() {
window.removeEventListener("scroll", this.handleScroll);
document.onmousemove = document.onmouseup = null;
@ -1107,6 +1111,7 @@
box-shadow: 0 2px 12px 0 rgba(0, 0, 0, 0.1);
border-radius: 4px;
border: 1px solid #ebeef5;
pointer-events: none;
.lineMsg {
margin-bottom: 10px;

View File

@ -185,14 +185,6 @@ export const asyncRoutes = [
component: () => import('@/views/pm/management'),
meta: { title: '生产任务管理', icon: 'example', perms: ['pm_resources'] }
}
,
{
path: 'gantt',
name: 'gantt',
component: () => import('@/views/pm/gantt'),
meta: { title: '甘特图', icon: 'example',perms: ['vendor_manage'] },
// hidden: true
}
]
}
,

View File

@ -300,6 +300,8 @@
},
data() {
return {
windowWidth:0,
windowHeight:0,
timeRange:[],
disable: true,
//当前项是否是子集
@ -499,11 +501,6 @@
TableScrollTop(val) {
let lineBG = this.$refs.lineBG;
lineBG.scrollTo(0, val);
// lineBG.scrollTo({
// top: val,
// left: 0,
// behavior: "smooth"
// });
},
handlerBGScroll(e) {
this.BGScrollTop = this.$refs.chart.scrollTop;
@ -862,15 +859,9 @@
) *
this.currentDaySize.value +
this.currentDaySize.value;
let end =
parseInt(this.$refs[dom][0].style.left) +
parseInt(this.$refs[dom][0].style.width);
end =
Math.round(end / this.currentDaySize.value) * this.currentDaySize.value;
this.currentLineDay = {
start,
end
};
let end = parseInt(this.$refs[dom][0].style.left) + parseInt(this.$refs[dom][0].style.width);
end = Math.round(end / this.currentDaySize.value) * this.currentDaySize.value;
this.currentLineDay = { start, end };
this.isHover = true;
this.handlerSelect(this.computedList[index]);
this.lineMouseenter(dom, e, id, parentId, index);
@ -888,13 +879,21 @@
Math.round(
parseInt(this.$refs[dom][0].style.left) / this.currentDaySize.value
) * this.currentDaySize.value;
let end =
parseInt(this.$refs[dom][0].style.left) +
parseInt(this.$refs[dom][0].style.width);
end =
Math.round(end / this.currentDaySize.value) *
this.currentDaySize.value -
this.currentDaySize.value;
let end = parseInt(this.$refs[dom][0].style.left) + parseInt(this.$refs[dom][0].style.width);
end = Math.round(end / this.currentDaySize.value) * this.currentDaySize.value - this.currentDaySize.value;
debugger;
let infoDomX=0,infoDomY = 0;
if(this.windowWidth-e.clientX>230){
infoDomX = e.clientX;
}else{
infoDomX = this.windowWidth-230;
}
if(this.windowHeight-e.clientY>200){
infoDomY = e.clientY;
}else{
infoDomY = this.windowHeight-200;
}
// if(){}else{}
this.currentProjectMsg = {
name: this.computedList[index].name,
allTime: (end - start) / this.currentDaySize.value + 1,
@ -902,8 +901,8 @@
per1: this.computedList[index].per1,
startTime: this.computedWithTime(start),
endTime: this.computedWithTime(end),
left: e.clientX ,
top: e.clientY + 20
left:infoDomX ,
top: infoDomY
};
/*
* left:
@ -1095,6 +1094,10 @@
}
},
watch: {
detailInfo(e,data) {
showDiv.style.left = (event.pageX - 300) + 'px';
showDiv.style.top = (event.pageY - 120) + 'px';
},
currentDaySize(newValue, oldValue) {
this.list.forEach(item => {
item.left = (item.left / oldValue.value) * newValue.value;
@ -1111,6 +1114,13 @@
}
},
mounted() {
if(window.innerHeight){
this.windowWidth = window.innerWidth;
this.windowHeight = window.innerHeight;
}else{
this.windowHeight=document.body.clientHeight?document.body.clientHeight:document.documentElement.clientHeight;
this.windowWidth=document.body.clientWidth?document.body.clientWidth:document.documentElement.clientWidth;
}
document.addEventListener("scroll", this.handleScroll);
this.getDay();
this.setStoneLine();

View File

@ -35,7 +35,7 @@
</el-form-item>
</el-col>
<el-row style="display: flex;flex-wrap: wrap;width:100%;">
<el-col v-for="item in ticketDetail.ticket_data_" :key="item.id" :span="12">
<el-col v-for="item in ticketDetail.ticket_data_" :key="item.id" :span="12" v-show="!item.is_hidden">
<el-form-item :label="item.field_name" v-if="item.field_state==='1'">
<span>{{ticketDetail.ticket_data[item.field_key]}}</span>
</el-form-item>
@ -73,9 +73,9 @@
<el-select style="width: 100%" v-model="ticketDetail.ticket_data[item.field_key]" placeholder="请选择">
<el-option
v-for="item1 in item.field_choice"
:key="item1"
:label="item1"
:value="item1"
:key="item1.id"
:label="item1.name"
:value="item1.id"
>
</el-option>
</el-select>
@ -84,9 +84,9 @@
<el-select style="width: 100%" multiple v-model="ticketDetail.ticket_data[item.field_key]" placeholder="请选择">
<el-option
v-for="item1 in item.field_choice"
:key="item1"
:label="item1"
:value="item1"
:key="item1.id"
:label="item1.name"
:value="item1.id"
>
</el-option>
</el-select>
@ -205,6 +205,7 @@
</template>
<script src="https://d3js.org/d3.v4.min.js"></script>
<script>
import { getOrgAll } from "@/api/org";
import { upUrl, upHeaders } from "@/api/file";
import { getUserList } from "@/api/user";
import {getWorkflowList,getWfCustomfieldList,getWfStateList,getWfTransitionList,ticketHandle
@ -247,6 +248,7 @@
watchedName:'',
watchedCreateTime:'',
logs:[],
orgList:[],
staffs:[],
edges: [],
nodes: [],
@ -288,157 +290,173 @@
getTicketTransitions(ticketId).then(res=>{
this.operationBtn = res.data;
})
getWfFlowSteps( ticketId).then((res)=>{
if(res.data){
//流程步骤数组
that.flowSteps = res.data;
getTicketDetail( ticketId).then((res)=>{
if(res.data){
that.tooltip = that.createTooltip();
that.ticketDetail = res.data;
console.log(that.ticketDetail.state_.enable_retreat);
debugger;
let state = res.data.state;
let dat = that.flowSteps.filter((item)=>{
return item.id==state;
})
that.sort = dat[0].sort;
that.actives = that.flowSteps.indexOf(dat[0]);
if( that.flowSteps.length-that.actives >1){}else{
that.actives =that.flowSteps.length;
}
var g = new dagreD3.graphlib.Graph().setGraph({
rankdir: 'DL',
nodesep: 100,
edgesep: 10,//两条线之间的距离
ranksep: 50,//节点之间的距离
marginx: 60,
marginy: 20,
});
//获取state得到节点
getWfStateList(workflow).then((response) => {
if (response.data) {
let nodes = response.data;
// 添加节点
nodes.forEach((item) => {
if(item.sort==that.sort){
g.setNode(item.id, {
// 节点标签
label: item.name,
// 节点形状
shape: 'rect',
toolText: item.name,
//节点样式
style: "fill:#409EFF;stroke:#000",
labelStyle: "fill:#000;",
rx :5,//矩形节点圆角度
ry :5
});
}else{
g.setNode(item.id, {
// 节点标签
label: item.name,
// 节点形状
shape: 'rect',
toolText: item.name,
//节点样式
style: "fill:#fff;stroke:#000",
labelStyle: "fill:#000;",
rx :5,//矩形节点圆角度
ry :5
});
getOrgAll().then((orgRes) => {
that.orgList = orgRes.data;
getUserList({page:0}).then(userRes=>{
if(userRes.data){
that.staffs = userRes.data;
getWfFlowSteps( ticketId).then((res)=>{
if(res.data){
//流程步骤数组
that.flowSteps = res.data;
getTicketDetail( ticketId).then((res)=>{
if(res.data){
that.tooltip = that.createTooltip();
that.ticketDetail = res.data;
for (let i=0;i<that.ticketDetail.ticket_data_.length;i++) {
if(that.ticketDetail.ticket_data_[i].label==="sys_user"){
that.ticketDetail.ticket_data_[i].field_choice = that.staffs;
}
if(that.ticketDetail.ticket_data_[i].label==="deptSelect"){
that.ticketDetail.ticket_data_[i].field_choice = that.orgList;
}
}
});
g.nodes().forEach(function (v) {
console.log("Node " + v + ": " + JSON.stringify(g.node(v)));
});
//获取流转得到线 链接关系
getWfTransitionList(workflow).then((res)=>{
if(res.data){
let transitionList = res.data;
transitionList.forEach((transitions)=>{
let transition0 = transitions;
if (transition0.condition_expression.length>0){
g.setNode(transition0.source_state_.id+100000, {label: "条件表达式", style: "fill: #a4d088", shape: "diamond"});
g.setEdge(transition0.source_state_.id, transition0.source_state_.id+100000, {
// 边标签
label: transition0.name,
style: "fill:#ffffff;stroke:#c0c1c3;stroke-width:1.5px"
});
let condition_expression = transition0.condition_expression;
condition_expression.forEach(condition_expression0=>{
g.setEdge(transition0.source_state_.id+100000, condition_expression0.target_state, {
label: condition_expression0.label,
style: "fill:#ffffff;stroke:#c0c1c3;stroke-width:1.5px"
})
})
}else{
g.setEdge(transition0.source_state_.id, transition0.destination_state_.id, {
// 边标签
label: transition0.name,
// 边样式
style: "fill:#ffffff;stroke:#c0c1c3;stroke-width:1.5px" // 根据后台数据来改变连线的颜色
});
}
})
g.nodes().length-1
g.nodes().forEach(function (v) {
console.log("Node " + v + ": " + JSON.stringify(g.node(v)));
});
// 创建渲染器
let render = new dagreD3.render();
// 选择 svg 并添加一个g元素作为绘图容器.
let svg = d3.select('#mySvg');
let svgGroup = svg.append('g');
let zoom = d3.zoom()
.on("zoom", function() {
svgGroup.attr("transform", d3.event.transform);
});
svg.call(zoom);
// 在绘图容器上运行渲染器生成流程图.
render(d3.select("svg g"), g);
// this.getTicketFlowlogs(ticketId);
getTicketFlowlog(ticketId).then(res=>{
if(res.data){
that.logs = res.data;
svgGroup
.selectAll('g.node')
.on('mouseover', (v) => {
// 假如当前toolText为"",则不展示
//这里就是自定义tooltip的内容
let filList = [], strList = [];
filList = nodes.filter((ii) => {
return ii.name === g.node(v).label
})
if (!filList.length) {
return
}
filList.map((k) => {
let filte = that.logs.filter(item=>{
return item.state == k.id;
})
//每个
let str = '处理人:'+filte[0].participant_.name;
strList.push(str)
})
that.tipVisible(strList)
})
.on('mouseout', () => {
this.tipHidden()
})
}
})
console.log(that.ticketDetail.state_.enable_retreat);
let state = res.data.state;
let dat = that.flowSteps.filter((item)=>{
return item.id==state;
})
that.sort = dat[0].sort;
that.actives = that.flowSteps.indexOf(dat[0]);
if( that.flowSteps.length-that.actives >1){}else{
that.actives =that.flowSteps.length;
}
var g = new dagreD3.graphlib.Graph().setGraph({
rankdir: 'DL',
nodesep: 100,
edgesep: 10,//两条线之间的距离
ranksep: 50,//节点之间的距离
marginx: 60,
marginy: 20,
});
//获取state得到节点
getWfStateList(workflow).then((response) => {
if (response.data) {
let nodes = response.data;
// 添加节点
nodes.forEach((item) => {
if(item.sort==that.sort){
g.setNode(item.id, {
// 节点标签
label: item.name,
// 节点形状
shape: 'rect',
toolText: item.name,
//节点样式
style: "fill:#409EFF;stroke:#000",
labelStyle: "fill:#000;",
rx :5,//矩形节点圆角度
ry :5
});
}else{}
});
}
});
}
});
}
}else{
g.setNode(item.id, {
// 节点标签
label: item.name,
// 节点形状
shape: 'rect',
toolText: item.name,
//节点样式
style: "fill:#fff;stroke:#000",
labelStyle: "fill:#000;",
rx :5,//矩形节点圆角度
ry :5
});
}
});
g.nodes().forEach(function (v) {
console.log("Node " + v + ": " + JSON.stringify(g.node(v)));
});
//获取流转得到线 链接关系
getWfTransitionList(workflow).then((res)=>{
if(res.data){
let transitionList = res.data;
transitionList.forEach((transitions)=>{
let transition0 = transitions;
if (transition0.condition_expression.length>0){
g.setNode(transition0.source_state_.id+100000, {label: "条件表达式", style: "fill: #a4d088", shape: "diamond"});
g.setEdge(transition0.source_state_.id, transition0.source_state_.id+100000, {
// 边标签
label: transition0.name,
style: "fill:#ffffff;stroke:#c0c1c3;stroke-width:1.5px"
});
let condition_expression = transition0.condition_expression;
condition_expression.forEach(condition_expression0=>{
g.setEdge(transition0.source_state_.id+100000, condition_expression0.target_state, {
label: condition_expression0.label,
style: "fill:#ffffff;stroke:#c0c1c3;stroke-width:1.5px"
})
})
}else{
g.setEdge(transition0.source_state_.id, transition0.destination_state_.id, {
// 边标签
label: transition0.name,
// 边样式
style: "fill:#ffffff;stroke:#c0c1c3;stroke-width:1.5px" // 根据后台数据来改变连线的颜色
});
}
})
g.nodes().length-1
g.nodes().forEach(function (v) {
console.log("Node " + v + ": " + JSON.stringify(g.node(v)));
});
// 创建渲染器
let render = new dagreD3.render();
// 选择 svg 并添加一个g元素作为绘图容器.
let svg = d3.select('#mySvg');
let svgGroup = svg.append('g');
let zoom = d3.zoom()
.on("zoom", function() {
svgGroup.attr("transform", d3.event.transform);
});
svg.call(zoom);
// 在绘图容器上运行渲染器生成流程图.
render(d3.select("svg g"), g);
// this.getTicketFlowlogs(ticketId);
getTicketFlowlog(ticketId).then(res=>{
if(res.data){
that.logs = res.data;
svgGroup
.selectAll('g.node')
.on('mouseover', (v) => {
// 假如当前toolText为"",则不展示
//这里就是自定义tooltip的内容
let filList = [], strList = [];
filList = nodes.filter((ii) => {
return ii.name === g.node(v).label
})
if (!filList.length) {
return
}
filList.map((k) => {
let filte = that.logs.filter(item=>{
return item.state == k.id;
})
//每个
let str = '处理人:'+filte[0].participant_.name;
strList.push(str)
})
that.tipVisible(strList)
})
.on('mouseout', () => {
this.tipHidden()
})
}
})
}else{}
});
}
});
}
});
}
});
}
})
});
},
activated(){
},

View File

@ -247,6 +247,7 @@
>报废
</el-link>
<el-link type="primary"
v-if="!scope.row.ticket"
@click="handleRetrial(scope)"
>重审
</el-link>
@ -595,7 +596,7 @@
import checkPermission from "@/utils/permission";
import customForm from '@/components/customForm/index';
import reviewForm from '@/components/customForm/review';
import {getWfCustomfieldList,createTicket} from "@/api/workflow";
import {getWfCustomfieldList,createTicket ,getWorkflowInit} from "@/api/workflow";
import {getMaterialList, getrecordformList, getrffieldList} from "@/api/mtm";
import {getwproductList, wproductTest, wproductPutin, createputins,testInit,scrap,getRetrial} from "@/api/wpm";
import {getTestRecord,getTestRecordItem,putTestRecordItem,delTestRecordItem,subTestRecordItem} from "@/api/qm";
@ -681,6 +682,7 @@
{ lable: "其他", value: 40 },
],
recordList: [],
transitions: null,
options: [],
listLoading: true,
fieldList: [],
@ -719,7 +721,7 @@
//复检表单
retrialForm: {
title:'',
transition:'',
transition:null,
workflow:'',
ticket_data:{},
},
@ -823,9 +825,12 @@
console.log(this.retrialItem);
getRetrial(scope.row.id).then(res=>{
that.retrialResponse = res.data;
getWfCustomfieldList(res.data.workflow).then((response) => {
getWorkflowInit(res.data.workflow).then((response) => {
if (response.data) {
that.customfieldList = response.data;
debugger;
console.log(response.data);
that.retrialForm.transition = response.data.transitions[0].id;
that.customfieldList = response.data.field_list;
for (let i=0;i<that.customfieldList.length;i++) {
if(that.customfieldList[i].field_key==="wproduct"){
that.customfieldList[i].default_value = that.retrialResponse.exist_data.wproduct;
@ -865,13 +870,10 @@
}
this.retrialForm.ticket_data = obj;
this.retrialForm.workflow = that.retrialResponse.workflow;
this.retrialForm.transition = 20;
this.retrialForm.title = that.retrialResponse.exist_data.wproduct_name+'的重审';
debugger;
console.log(this.retrialForm);
createTicket(this.retrialForm).then((res) => {
if (res.code >= 200) {
// this.getList();
this.getList4();
this.limitedRetrial = false;
this.$message.success("成功");
}
@ -925,7 +927,6 @@
//点击检验:如果有一个直接进入如果有多个表再进行选择
handleInspection(scope,index) {
//调该物料对应的检查表
// debugger;
let that = this;
this.innerIndex = index;
// this.outerVisible = true;
@ -935,7 +936,6 @@
this.recordform = null;
getrecordformList(this.listQueryrecordform).then((response) => {
if (response.data) {
debugger;
this.recordformList = response.data;
if(response.data.length===1){
that.recordform = response.data[0].id;
@ -966,7 +966,6 @@
that.limitedCheckRecord = true;
getTestRecord({wproduct:scope.row.id}).then(res=>{
if(res.code==200){
debugger;
that.recordList = res.data.results;
}else{
this.$message.error(res.msg);
@ -975,7 +974,6 @@
},
//点击记录里的检验
handleInspectionRecord(scope){
// debugger;
let that =this;
that.recordVisible = false;
that.recordId = scope.row.id;
@ -994,7 +992,6 @@
that.hasPicture = true;
}
getTestRecordItem(scope.row.id).then((res) => {
// debugger;
let arr = [];
let fieldList = res.data.record_data;
for(let i=0;i<that.fieldList.length;i++){
@ -1017,7 +1014,6 @@
}
});
}else if(that.innerIndex==='2'){//复检
debugger;
getTestRecordItem(scope.row.id).then((res) => {
if (res.data) {
that.hasPicture = false;
@ -1040,8 +1036,6 @@
}
that.fieldList.push(obj)
}
debugger;
console.log(that.fieldList)
// that.fieldList = [...fieldList];
let arr = fieldList.filter(item => {
return item.field_type === 'draw'
@ -1060,11 +1054,9 @@
},
//半产品复检
handleReview() {
// debugger;
let that = this;
testInit({ wproduct: this.wproduct,form: that.recordform}).then((response) => {
if (response.data) {
debugger;
that.hasPicture = false;
that.recordId = response.data.id;
that.formName = response.data.form_.name;
@ -1099,7 +1091,6 @@
//根据选择的表渲染检查项目
submitrecordform(index) {
// debugger;
let that = this;
this.outerVisible = false;
if (that.recordform != "") {
@ -1125,7 +1116,6 @@
}
});
}else if(index==='2'){//复检
// debugger;
that.handleReview();
}
} else this.$message.error("请选择检查表!");
@ -1190,7 +1180,6 @@
params.record_data = value.record_data;
params.is_testok = value.is_testok;
putTestRecordItem(id,params).then((res) => {
// debugger;
if (res.code >= 200) {
that.recordVisible = false;
that.limitedReview = false;