This commit is contained in:
zty 2024-11-01 17:11:14 +08:00
commit d190c47c3b
9 changed files with 298 additions and 199 deletions

View File

@ -49,26 +49,32 @@
></el-table-column>
<el-table-column label="批号追加设备" min-width="60">
<template #default="scope">
<el-icon
v-if="scope.row.batch_append_equip"
color="green"
>
<el-tag type="success" v-if="scope.row.batch_append_equip">
</el-tag>
<!-- <el-icon v-if="scope.row.batch_append_equip" color="green">
<CircleCheckFilled />
</el-icon>
</el-icon> -->
</template>
</el-table-column>
<el-table-column label="交接到工段" min-width="60">
<template #default="scope">
<el-icon v-if="scope.row.into_wm_mgroup" color="green">
<el-tag type="success" v-if="scope.row.into_wm_mgroup">
</el-tag>
<!-- <el-icon v-if="scope.row.into_wm_mgroup" color="green">
<CircleCheckFilled />
</el-icon>
</el-icon> -->
</template>
</el-table-column>
<el-table-column label="不合格品是否入库" min-width="60">
<template #default="scope">
<el-icon v-if="scope.row.store_notok" color="green">
<el-tag type="success" v-if="scope.row.store_notok">
</el-tag>
<!-- <el-icon v-if="scope.row.store_notok" color="green">
<CircleCheckFilled />
</el-icon>
</el-icon> -->
</template>
</el-table-column>
<el-table-column label="排序" prop="sort" min-width="60">

229
src/views/wf/degraD3.vue Normal file
View File

@ -0,0 +1,229 @@
<template>
<el-drawer
v-model="visible"
:title="workflowName"
:size="600">
<svg id="mySvg" v-if="visible"></svg>
</el-drawer>
</template>
<script>
import dagreD3 from "dagre-d3";
import * as d3 from "d3";
export default {
name: "index",
props: {
workflowName: {
type: String,
default: "",
},
workFlowId: {
type: String,
default: "",
},
},
data() {
return {
mySvgHeight: null,
visible:false,
isSaving: false,
};
},
mounted() {
// this.handleWatch();
},
methods: {
open(){
this.visible = true;
this.handleWatch();
},
handleWatch() {
let that = this;
that.limitedWatch = true;
that.$nextTick(() => {
var g = new dagreD3.graphlib.Graph().setGraph({
rankdir: "DL",
nodesep: 40,
edgesep: 25, //线
ranksep: 20, //
marginx: 80,
marginy: 10,
});
//state
that.$API.wf.workflow.states.req(that.workFlowId).then((response) => {
if (!response.err_msg) {
let nodes = response;
//
nodes.forEach((item) => {
if(item.id&&item.name){
g.setNode(item.id, {
//
label: item.name,
//
shape: "rect",
toolText: item.name,
//
style: "fill:#fff;stroke:#000",
labelStyle: "fill:#000;",
rx: 5, //
ry: 5,
});
}
});
//线
that.$API.wf.workflow.transitions.req(that.workFlowId).then((res) => {
let transitionList = res;
transitionList.forEach((transition0) => {
let condition_expression = transition0.condition_expression;
if (condition_expression.length > 0) {
let newNodeId = transition0.id
g.setNode(newNodeId, {
label: "条件流转",
style: "stroke: #000;fill: #afa",
shape: "diamond",
});
g.setEdge(
transition0.source_state,
newNodeId,
{
//
label: transition0.name,
style: "fill:#ffffff;stroke:#c0c1c3;stroke-width:1.5px",
}
);
condition_expression.forEach((condition_expression0) => {
g.setEdge(
newNodeId,
condition_expression0.target_state,
{
label: condition_expression0.label,
style:
"fill:#ffffff;stroke:#c0c1c3;stroke-width:1.5px",
}
);
});
}else {
g.setEdge(
transition0.source_state,
transition0.destination_state,
{
//
label: transition0.name,
//
style: "fill:#ffffff;stroke:#c0c1c3;stroke-width:1.5px", // 线
}
);
}
});
// g.nodes().length - 1;
//
let render = new dagreD3.render();
// svg g.
let svg = d3.select("#mySvg");
let inner = svg.append("g");
// .
render(inner, g);
let mySvgHeight =document.getElementsByClassName("nodes")[0].getBoundingClientRect().height + 50;
let mySvgWdith =document.getElementsByClassName("output")[0].getBoundingClientRect().innerwidth ;
console.log('mySvgWdith',mySvgWdith);
document.getElementById('mySvg').setAttribute("height", mySvgHeight);
document.getElementById('mySvg').setAttribute("width", mySvgWdith);
});
}
});
});
},
closeMark() {
this.limitedWatch = false;
},
scaleUp() {
var svg = document.getElementById("mySvg");
svg.style.transform = "scale(0.5)";
}
},
};
</script>
<style scoped>
.treeMain {
height: 280px;
overflow: auto;
border: 1px solid #dcdfe6;
margin-bottom: 10px;
}
::-webkit-scrollbar {
width: 10px;
}
::-webkit-scrollbar-track {
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.2);
background-color: #fefefe;
border-radius: 5px;
}
::-webkit-scrollbar-thumb {
border-radius: 5px;
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5);
background-color: #f5f5f5;
}
.svgMark {
width: 100%;
height: 100%;
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
overflow: auto;
margin: 0;
z-index: 2000;
background: rgba(0, 0, 0, 0.3);
}
.svgWrapper {
background: #fff;
width: 800px;
margin: 5vh auto;
height: 90vh;
text-align: center;
border-radius: 2px;
overflow-y: scroll;
}
.svgItem {
padding: 20px 40px 0;
font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB,
Microsoft YaHei, Arial, sans-serif;
font-size: 18px;
display: flex;
justify-content: space-between;
}
svg {
font-size: 14px;
}
.node rect {
stroke: #606266;
fill: #fff;
}
.edgePath path {
stroke: #606266;
fill: #333;
stroke-width: 1.5px;
}
g.conditions > rect {
fill: #00ffd0;
stroke: #000;
}
.el-icon-close {
cursor: pointer;
}
</style>

View File

@ -83,7 +83,7 @@
link
size="small"
type="primary"
@click="handleWatch(scope)"
@click="handleWatch(scope.row)"
>
流程图
</el-button>
@ -106,23 +106,14 @@
</scTable>
</el-main>
</el-container>
<div class="svgMark" v-if="limitedWatch" @click="closeMark">
<div class="svgWrapper">
<div class="svgItem">
工作流流程图<i
class="el-dialog__close el-icon el-icon-close"
@click="closeMark"
></i>
</div>
<div style="width: 100%; margin: auto">
<svg
:height="mySvgHeight"
id="mySvg"
style="width: 100% !important"
></svg>
</div>
</div>
</div>
<degraDialog
v-if="limitedWatch"
ref="degraDialogs"
:workflowName="workflowName"
:workFlowId="workFlowId"
@closeDialog="limitedWatch = false"
>
</degraDialog>
<el-dialog :title="titleMap[type]" v-model="limitedVisible">
<el-form
:model="addForm"
@ -181,19 +172,21 @@
</template>
<script>
import dagreD3 from "dagre-d3";
import * as d3 from "d3";
import degraDialog from "./degraD3.vue";
export default {
name: "index",
components: {
degraDialog
},
data() {
return {
workflowName:"",
workFlowId:'',
apiObj: this.$API.wf.workflow.list,
selection: [],
checkList: [],
choiceOption: [],
query: {},
mySvgHeight: null,
editId: null,
isSaving: false,
limitedVisible: false,
@ -339,128 +332,23 @@ export default {
}
},
handleWatch(scope) {
handleWatch(row) {
let that = this;
let workFlow = scope.row.id;
that.workFlowId = row.id;
that.workflowName = row.name;
that.limitedWatch = true;
that.$nextTick(() => {
var g = new dagreD3.graphlib.Graph().setGraph({
rankdir: "DL",
nodesep: 80,
edgesep: 50, //线
ranksep: 40, //
marginx: 160,
marginy: 20,
});
//state
that.$API.wf.workflow.states.req(workFlow).then((response) => {
if (!response.err_msg) {
let nodes = response;
//
nodes.forEach((item) => {
if(item.id&&item.name){
if(item.id===1548915292174946304){
debugger;
}
g.setNode(item.id, {
//
label: item.name,
//
shape: "rect",
toolText: item.name,
//
style: "fill:#fff;stroke:#000",
labelStyle: "fill:#000;",
rx: 5, //
ry: 5,
});
}
});
//线
that.$API.wf.workflow.transitions.req(workFlow).then((res) => {
if (!res.err_msg) {
let transitionList = res;
transitionList.forEach((transition0) => {
if (transition0.condition_expression.length > 0) {
g.setNode(transition0.source_state_.id + 100000, {
label: "条件表达式",
style: "stroke: #000;fill: #afa",
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", // 线
}
);
}
});
// let nodess = g._nodes;
// let newObj = {};
// for(let item in nodess){
// if(nodess[item]===undefined){
// }else{
// newObj[item] = nodess[item];
// }
// }
// debugger;
// console.log(newObj)
// // let list = Object.keys(nodess)
// // .filter((key) => nodess[key] !== null && nodess[key] !== undefined)
// // .reduce((acc, key) => ({ ...acc, [key]: nodess[key] }), {});
// // debugger;
// // console.log(list)
// g._nodes = newObj;
console.log(g)
g.nodes().length - 1;
//
let render = new dagreD3.render();
// svg g.
let svg = d3.select("#mySvg");
let svgGroup = svg.append("g");
// .
render(d3.select("svg g"), g);
that.mySvgHeight =
document
.getElementsByClassName("nodes")[0]
.getBoundingClientRect().height + 50;
}
});
}
});
});
that.$nextTick(() => {
that.$refs.degraDialogs.open();
});
},
closeMark() {
this.limitedWatch = false;
},
scaleUp() {
var svg = document.getElementById("mySvg");
svg.style.transform = "scale(0.5)";
}
},
};
</script>
@ -487,44 +375,6 @@ export default {
-webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.5);
background-color: #f5f5f5;
}
.svgMark {
width: 100%;
height: 100%;
position: fixed;
top: 0;
right: 0;
bottom: 0;
left: 0;
overflow: auto;
margin: 0;
z-index: 2000;
background: rgba(0, 0, 0, 0.3);
}
.svgWrapper {
background: #fff;
width: 800px;
margin: 5vh auto;
height: 90vh;
text-align: center;
border-radius: 2px;
overflow-y: scroll;
}
.svgItem {
padding: 20px 40px 0;
font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB,
Microsoft YaHei, Arial, sans-serif;
font-size: 18px;
display: flex;
justify-content: space-between;
}
svg {
font-size: 14px;
}
.node rect {
stroke: #606266;
fill: #fff;

View File

@ -131,8 +131,7 @@
<el-form-item label="领用数量">
<el-input-number
v-model="form.count_use"
:min="1"
:max="materialCount"
:min="0"
controls-position="right"
class="width100"
@change = "countUseChange"
@ -159,14 +158,13 @@
controls-position="right"
disabled
/>
<!-- countChanges -->
</el-form-item>
</el-col>
<el-col :md="12" :sm="24">
<el-form-item label="合格数量">
<el-input-number
v-model="form.count_ok"
:min="0"
disabled
class="width100"
controls-position="right"
/>
@ -176,9 +174,8 @@
<el-form-item label="不合格数量">
<el-input-number
v-model="form.count_notok"
:min="0"
disabled
class="width100"
@change="countChanges"
controls-position="right"
/>
</el-form-item>
@ -397,7 +394,7 @@ export default {
work_end_time:[{required: true,message: "请选择生产开始时间",trigger: "blur",},],
route: [{required: true,message: "请选择工艺路线",trigger: "blur",},]
},
materialCount:1,
materialCount:1,//
material_in:'',
material_out:'',
shiftOtions:[],
@ -475,8 +472,21 @@ export default {
let that = this;
that.materialOptions.forEach(item=>{
if(item.id == val){
that.materialCount = item.count;
that.form.count_use = item.count;
that.form.count_n_hs =
that.form.count_n_qp =
that.form.count_n_swen =
that.form.count_n_bb =
that.form.count_n_xbb =
that.form.count_n_md =
that.form.count_n_xh =
that.form.count_n_ps =
that.form.count_n_zq =
that.form.count_n_qt =
that.form.count_n_wm=0;
that.materialCount =
that.form.count_use =
that.form.count_real =
that.form.count_ok = item.count;
that.form.count_real = item.count-that.form.count_pn_jgqbl;
}
})
@ -512,9 +522,9 @@ export default {
this.form.count_n_wm;
this.form.count_ok = this.form.count_real - this.form.count_notok;
},
countChanges(){
this.form.count_ok = this.form.count_real - this.form.count_notok;
},
// countChanges(){
// this.form.count_ok = this.form.count_real - this.form.count_notok;
// },
//
submit() {
let that = this;

View File

@ -14,6 +14,7 @@
icon="el-icon-plus"
@click="table_add(20)"
v-auth="'handover.create'"
v-if="mgroupName!=='切片'"
>返工</el-button
>
<el-button

View File

@ -317,7 +317,10 @@ export default {
this.dialog.scrap = false;
this.$refs.table.refresh();
},
handleinmSuccess(){},
//
handleinmSuccess(){
this.$refs.table.refresh();
},
//
handleQuery() {
this.$refs.table.queryData(this.query);

View File

@ -2,13 +2,13 @@ import ehsUserSelect from './components/ehsSelect/userselect'
import ehsEpSelect from './components/ehsSelect/epselect'
import ehsSelect from './components/ehsSelect/select'
import ehsTableSelect from './components/ehsSelect/tableSelect'
import xSelect from './components/xSelect/index.vue'
import xtSelect from './components/xtSelect/index.vue'
export default {
install(app) {
app.component('ehsUserSelect', ehsUserSelect);
app.component('ehsEpSelect', ehsEpSelect);
app.component('ehsSelect', ehsSelect);
app.component('ehsTableSelect', ehsTableSelect);
app.component('xSelect', xSelect);
app.component('xtSelect', xtSelect);
}
}