|
|
@@ -31,7 +31,8 @@
|
|
|
loading: false,
|
|
|
itemId: '',
|
|
|
visible: false,
|
|
|
- isUpdate: false
|
|
|
+ isUpdate: false,
|
|
|
+ childList: []
|
|
|
}
|
|
|
},
|
|
|
mounted() {
|
|
|
@@ -49,6 +50,7 @@
|
|
|
initSuccess(res) {
|
|
|
if (res.state) {
|
|
|
this.list = res.data;
|
|
|
+ this.updateParentStatus(this.list);
|
|
|
}
|
|
|
this.loading = false;
|
|
|
},
|
|
|
@@ -94,26 +96,37 @@
|
|
|
}
|
|
|
},
|
|
|
//状态:0-未开始 1-进行中 2-进行中-提交 3-通过 4-不通过
|
|
|
- initStatus() {
|
|
|
- let arr = this.getFirstNode(this.list).map(node => node.id);
|
|
|
- if (arr.length === 0) return;
|
|
|
- updateProcessStatus(1, arr.join(',')).then(res => {
|
|
|
+ initStatus(num) {
|
|
|
+ let len = num || 0;
|
|
|
+ if (this.childList.length === 0) return;
|
|
|
+ let arr = this.childList[num];
|
|
|
+ updateProcessStatus(1, arr.id).then(res => {
|
|
|
if (res.state) {
|
|
|
this.init();
|
|
|
}
|
|
|
})
|
|
|
},
|
|
|
- getFirstNode(data) {
|
|
|
- const result = [];
|
|
|
- let current = data;
|
|
|
- while (current && Array.isArray(current)) {
|
|
|
- if (current.length === 0) break; // 空数组则终止
|
|
|
- const firstElement = current[0];
|
|
|
- result.push(firstElement);
|
|
|
- // 检查是否包含子数组（根据 children 字段）
|
|
|
- current = firstElement.children && Array.isArray(firstElement.children) ? firstElement.children : null;
|
|
|
- }
|
|
|
- return result;
|
|
|
+ updateParentStatus(nodes) {
|
|
|
+ nodes.forEach(node => {
|
|
|
+ // 递归处理子节点
|
|
|
+ if (node.children && node.children.length > 0) {
|
|
|
+ this.updateParentStatus(node.children); // 先处理子节点
|
|
|
+ // 获取所有子节点的 status
|
|
|
+ const childStatusList = node.children.map(child => child.status);
|
|
|
+ // 判断条件优先级：4 > 1/2 > 3
|
|
|
+ if (childStatusList.some(status => status === 4)) {
|
|
|
+ node.status = 4;
|
|
|
+ } else if (childStatusList.some(status => status === 1 || status === 2)) {
|
|
|
+ node.status = 1;
|
|
|
+ } else if (childStatusList.every(status => status === 3)) {
|
|
|
+ node.status = 3;
|
|
|
+ } else if (childStatusList.some(status => status === 3)) {
|
|
|
+ node.status = 1;
|
|
|
+ }
|
|
|
+ } else {
|
|
|
+ this.childList.push(node);
|
|
|
+ }
|
|
|
+ });
|
|
|
},
|
|
|
getNextNode() {
|
|
|
|
|
|
@@ -128,7 +141,24 @@
|
|
|
},
|
|
|
watch: {
|
|
|
processSet() {
|
|
|
- if (this.operationType === 'edit') this.edit();
|
|
|
+ if (this.operationType === 'edit') {
|
|
|
+ this.edit();
|
|
|
+ } else {
|
|
|
+ let data = this.$store.getters.processSet;
|
|
|
+ console.log(data);
|
|
|
+ if (data.type === 'reload') {
|
|
|
+ if (!data.id) {
|
|
|
+ this.init();
|
|
|
+ } else {
|
|
|
+ let index = this.childList.findIndex(node => node.id == data.id);
|
|
|
+ if (index === -1 || index === (this.childList.length - 1)) {
|
|
|
+ this.init();
|
|
|
+ } else {
|
|
|
+ this.initStatus(index + 1);
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
},
|
|
|
}
|
|
|
@@ -207,6 +237,54 @@
|
|
|
display: flex;
|
|
|
align-items: center;
|
|
|
justify-content: center;
|
|
|
+
|
|
|
+ &.info {
|
|
|
+ background: rgba(144, 157, 143, 0.4);
|
|
|
+
|
|
|
+ .process-set-state-1 {
|
|
|
+ background: rgba(144, 157, 143, 1);
|
|
|
+ }
|
|
|
+
|
|
|
+ .process-set-state-2 {
|
|
|
+ background: rgba(144, 157, 143, 0.6);
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ &.waiting {
|
|
|
+ background: rgba(255, 125, 0, 0.4);
|
|
|
+
|
|
|
+ .process-set-state-1 {
|
|
|
+ background: rgba(255, 125, 0, 1);
|
|
|
+ }
|
|
|
+
|
|
|
+ .process-set-state-2 {
|
|
|
+ background: rgba(255, 125, 0, 0.6);
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ &.success {
|
|
|
+ background: rgba(0, 180, 42, 0.4);
|
|
|
+
|
|
|
+ .process-set-state-1 {
|
|
|
+ background: rgba(0, 180, 42, 1);
|
|
|
+ }
|
|
|
+
|
|
|
+ .process-set-state-2 {
|
|
|
+ background: rgba(0, 180, 42, 0.6);
|
|
|
+ }
|
|
|
+ }
|
|
|
+
|
|
|
+ &.error {
|
|
|
+ background: rgba(245, 63, 63, 0.4);
|
|
|
+
|
|
|
+ .process-set-state-1 {
|
|
|
+ background: rgba(245, 63, 63, 1);
|
|
|
+ }
|
|
|
+
|
|
|
+ .process-set-state-2 {
|
|
|
+ background: rgba(245, 63, 63, 0.6);
|
|
|
+ }
|
|
|
+ }
|
|
|
}
|
|
|
|
|
|
.process-set-state-1 {
|
|
|
@@ -228,81 +306,32 @@
|
|
|
position: absolute;
|
|
|
left: 16px;
|
|
|
width: 2px;
|
|
|
- }
|
|
|
-
|
|
|
- .line-top {
|
|
|
- top: 0;
|
|
|
- height: 6px;
|
|
|
- }
|
|
|
-
|
|
|
- .line-bottom {
|
|
|
- top: 26px;
|
|
|
- bottom: 0;
|
|
|
- }
|
|
|
-
|
|
|
- .success {
|
|
|
|
|
|
- .process-set-state,
|
|
|
- .line {
|
|
|
- background: rgba(0, 180, 42, 0.4);
|
|
|
+ &.info {
|
|
|
+ background: rgba(144, 157, 143, 0.4);
|
|
|
}
|
|
|
|
|
|
- .process-set-state-1 {
|
|
|
- background: rgba(0, 180, 42, 1);
|
|
|
+ &.waiting {
|
|
|
+ background: rgba(255, 125, 0, 0.4);
|
|
|
}
|
|
|
|
|
|
- .process-set-state-2 {
|
|
|
- background: rgba(0, 180, 42, 0.6);
|
|
|
+ &.success {
|
|
|
+ background: rgba(0, 180, 42, 0.4);
|
|
|
}
|
|
|
|
|
|
- }
|
|
|
-
|
|
|
- .error {
|
|
|
-
|
|
|
- .process-set-state,
|
|
|
- .line {
|
|
|
+ &.error {
|
|
|
background: rgba(245, 63, 63, 0.4);
|
|
|
}
|
|
|
-
|
|
|
- .process-set-state-1 {
|
|
|
- background: rgba(245, 63, 63, 1);
|
|
|
- }
|
|
|
-
|
|
|
- .process-set-state-2 {
|
|
|
- background: rgba(245, 63, 63, 0.6);
|
|
|
- }
|
|
|
}
|
|
|
|
|
|
- .waiting {
|
|
|
-
|
|
|
- .process-set-state,
|
|
|
- .line {
|
|
|
- background: rgba(255, 125, 0, 0.4);
|
|
|
- }
|
|
|
-
|
|
|
- .process-set-state-1 {
|
|
|
- background: rgba(255, 125, 0, 1);
|
|
|
- }
|
|
|
-
|
|
|
- .process-set-state-2 {
|
|
|
- background: rgba(255, 125, 0, 0.6);
|
|
|
- }
|
|
|
+ .line-top {
|
|
|
+ top: 0;
|
|
|
+ height: 6px;
|
|
|
}
|
|
|
|
|
|
- .info {
|
|
|
-
|
|
|
- .process-set-state,
|
|
|
- .line {
|
|
|
- background: rgba(144, 157, 143, 0.4);
|
|
|
- }
|
|
|
-
|
|
|
- .process-set-state-1 {
|
|
|
- background: rgba(144, 157, 143, 1);
|
|
|
- }
|
|
|
-
|
|
|
- .process-set-state-2 {
|
|
|
- background: rgba(144, 157, 143, 0.6);
|
|
|
- }
|
|
|
+ .line-bottom {
|
|
|
+ top: 26px;
|
|
|
+ bottom: 0;
|
|
|
}
|
|
|
}
|
|
|
</style>
|
