Skip to content

A
apaas-ui
Commit d41440c1 authored by 刘殿昕's avatar 刘殿昕
Browse files
Options

菜单管理16位，流程设计

parent 96aedb2b
Hide whitespace changes
Inline Side-by-side
Showing with 300 additions and 28 deletions
src/assets/css/index.css
View file @ d41440c1
......@@ -198,8 +198,18 @@ div {
font-size: 16px;
font-weight: 700;
color: #1d1e20;
border-left: 4px solid #0367f6;
padding-left: 8px;
position: relative;
}
.el-dialog__title::before {
content: "";
position: absolute;
width: 4px;
height: 16px;
border-radius: 2px;
background-color: #515fe7;
left: 0;
top: 2px;
}
.el-dialog__body {
font-size: 18px;
......
src/components/work-flow/super-flow.vue
View file @ d41440c1
......@@ -37,25 +37,64 @@
>
<template v-slot:node="{meta}">
<div
:class="{'flow-node-begin': meta.type == 0, 'flow-node-end': meta.type == 1, 'flow-node-default': meta.type == 2}"
:class="{'flow-node-begin': nodeParams(meta.id).type == 0, 'flow-node-end': nodeParams(meta.id).type == 1, 'flow-node-default': nodeParams(meta.id).type == 2 && meta.id != nodeItem.id, 'flow-node-default-active': nodeParams(meta.id).type == 2 && meta.id == nodeItem.id }"
:id="meta.id"
>
<div class="node_span" @click="clickItem(meta)">{{meta.name}}</div>
<div
class="node_span"
@click="clickItem(meta.id)"
@blur="blurItem"
>{{nodeParams(meta.id).name}}</div>
</div>
</template>
</super-flow>
</div>
<div class="flow_options">
<p class="options_head">操作</p>
<div class="options_item">
<div class="options_item" @click="generalSettings">
<img :src="require('@/assets/imgs/lcsj_ic_set.png')" class="options_img" />
<p class="options_text">常规设置</p>
</div>
<div class="options_item">
<div class="options_item_1">
<img :src="require('@/assets/imgs/lcsj_ic_chajian.png')" class="options_img" />
<p class="options_text">插件设置</p>
<div class="options_pop">
<div class="options_pop_item">
<img :src="require('@/assets/imgs/lcsj_ic_jiekou.png')" class="options_item_img" />
<p class="options_item_text">接口插件</p>
</div>
<div class="options_pop_item">
<img :src="require('@/assets/imgs/lcsj_ic_liucheng.png')" class="options_item_img" />
<p class="options_item_text">流程服务</p>
</div>
<div class="options_pop_item">
<img :src="require('@/assets/imgs/lcsj_ic_chaoshi.png')" class="options_item_img" />
<p class="options_item_text">超时管理</p>
</div>
</div>
</div>
</div>
<el-dialog
:visible.sync="dialog_general"
top="25vh"
width="420px"
:modal-append-to-body="false"
title="常规设置"
:close-on-click-modal="false"
>
<div class="general_settings">
<p class="general_title">节点编号：</p>
<p class="general_val">WF0000000101</p>
<p class="general_title">节点名称：</p>
<p class="general_input">
<el-input v-model="node_name" placeholder="请输入节点名称"></el-input>
</p>
<div class="dia_footer">
<el-button class="cancel" @click="generalCancel">取消</el-button>
<el-button class="submit" @click="generalSubmit">确定</el-button>
</div>
</div>
</el-dialog>
</div>
</template>
......@@ -161,6 +200,7 @@ export default {
},
},
],
nodeParamsList: [],
linkMenu: [
[
{
......@@ -172,6 +212,13 @@ export default {
},
],
],
dialog_general: false,
nodeItem: {
id: "",
name: "",
},
node_name: "",
show_options_pop: false,
};
},
mounted() {
......@@ -230,10 +277,53 @@ export default {
clientY - conf.offsetTop
);
// 添加节点
let query = { width: 120, height: 48, meta: {} };
if (conf.info.meta.type == 0) {
query.meta.type == 0;
} else if (conf.info.meta.type == 1) {
query.meta.type == 1;
} else if (conf.info.meta.type == 2) {
query.meta.type == 2;
}
if (!conf.info.meta.id) {
query.meta.id = parseInt(Math.random() * 1000 * 1000);
}
console.log(query);
this.$refs.superFlow.addNode({
coordinate,
...conf.info,
...query,
});
if (
this.nodeParamsList.findIndex((item) => {
return item.id == query.meta.id;
}) == -1
) {
let obj = {};
if (conf.info.meta.type == 0) {
obj = {
label: "开始",
name: "开始",
type: 0,
id: query.meta.id,
};
} else if (conf.info.meta.type == 1) {
obj = {
label: "结束",
name: "结束",
type: 1,
id: query.meta.id,
};
} else if (conf.info.meta.type == 2) {
obj = {
label: "普通节点",
name: "普通节点",
type: 2,
id: query.meta.id,
};
}
this.nodeParamsList.push(obj);
console.log(this.nodeParamsList);
}
conf.isMove = false;
}
if (conf.ele) {
......@@ -242,7 +332,6 @@ export default {
}
},
nodeItemMouseDown(evt, info) {
info.meta.id = parseInt(Math.random() * 1000 * 1000);
const { clientX, clientY, currentTarget } = evt;
const { top, left } = evt.currentTarget.getBoundingClientRect();
const conf = this.dragConf;
......@@ -262,13 +351,76 @@ export default {
ele.style.left = clientX - conf.offsetLeft + "px";
this.$el.appendChild(this.dragConf.ele);
},
clickItem(item) {
clickItem(index) {
let item = this.nodeParams(index);
this.nodeItem = item;
console.log(item);
},
blurItem() {
this.nodeItem = {
id: "",
};
console.log(this.nodeItem);
},
getData() {
return this.$refs.superFlow.toJSON();
return {
obj: this.$refs.superFlow.toJSON(),
params: this.nodeParamsList,
};
},
handleChange() {},
generalSettings() {
let self = this;
if (self.nodeItem.id && self.nodeItem.id != "") {
if (self.nodeItem.type == 2) {
self.node_name = self.nodeParamsList.find((item) => {
return item.id == self.nodeItem.id;
}).name;
self.dialog_general = true;
} else {
self.$message({
message: "开始和结束节点不可被编辑",
type: "warning",
});
}
} else {
self.$message({
message: "请选择节点",
type: "warning",
});
}
},
nodeParams(id) {
let index = this.nodeParamsList.findIndex((item) => {
return item.id == id;
});
if (index != -1) {
return this.nodeParamsList[index];
} else {
return {};
}
},
generalCancel() {
this.dialog_general = false;
},
generalSubmit() {
let self = this;
if (self.nodeItem.type == 2) {
let index = self.nodeParamsList.findIndex((item) => {
return item.id == self.nodeItem.id;
});
if (index != -1) {
self.nodeParamsList[index].name = self.node_name;
} else {
self.$message({
message: "修改失败",
type: "error",
});
}
}
self.dialog_general = false;
},
},
};
</script>
......@@ -305,7 +457,7 @@ export default {
text-align: center;
.options_head {
color: #242c43;
font-size: 14px;
font-size: 12px;
font-weight: bold;
margin-top: 30px;
}
......@@ -321,6 +473,53 @@ export default {
height: 40px;
}
}
.options_item_1 {
margin-top: 20px;
cursor: pointer;
color: #242c43;
position: relative;
.options_img {
width: 40px;
height: 40px;
}
.options_pop {
display: none;
}
&:hover .options_pop {
position: absolute;
width: 250px;
height: 82px;
background-color: #0d1847;
border-radius: 10px;
z-index: 2;
top: 0;
right: 0;
animation: myfirst 1s;
display: flex;
overflow: hidden;
justify-content: space-around;
color: #ffffff;
font-size: 12px;
.options_pop_item {
padding-top: 10px;
.options_item_img {
width: 40px;
height: 40px;
}
.options_item_text {
white-space: nowrap;
}
}
}
@keyframes myfirst {
from {
width: 0;
}
to {
width: 250px;
}
}
}
}
}
.node-item {
......@@ -409,11 +608,6 @@ export default {
background-color: transparent;
border-radius: 8px;
font-size: 16px;
&:focus {
box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.8);
background-color: #515fe7;
color: #fff;
}
/deep/ .node_span {
text-align: center;
overflow: hidden;
......@@ -441,16 +635,77 @@ export default {
color: #ffffff;
}
.flow-node-default {
width: 100%;
height: 100%;
line-height: 42px;
padding: 0 6px;
border-radius: 8px;
background-color: #fff;
border: solid 3px #b4c6f5;
}
.flow-node-default-active {
width: 100%;
height: 100%;
line-height: 42px;
padding: 0 6px;
border-radius: 8px;
border: solid 3px #b4c6f5;
box-shadow: 1px 1px 8px rgba(0, 0, 0, 0.8);
background-color: #515fe7;
color: #fff;
}
}
}
.super-flow__menu-container .super-flow__menu {
width: 120px;
}
.super-flow-demo1 .el-dialog__wrapper {
padding-left: 180px;
}
.super-flow-demo1 .el-dialog__body {
padding: 20px;
}
.super-flow-demo1 >  .v-modal {
position: absolute;
border-radius: 8px;
width: calc(100% + 40px);
height: calc(100% + 230px);
top: -160px;
left: -20px;
}
.general_settings {
font-size: 14px;
text-align: left;
.general_title {
margin-bottom: 20px;
padding-left: 10px;
}
.general_val {
margin-bottom: 30px;
padding-left: 10px;
}
.general_input {
margin-bottom: 50px;
}
}
.dia_footer {
font-size: 14px;
text-align: center;
display: flex;
justify-content: flex-end;
.cancel {
background-color: #c3caf8;
color: #0f2683;
width: 90px;
height: 34px;
padding: 0 20px;
}
.submit {
background-color: #0f2683;
color: #f8f9fd;
width: 90px;
height: 34px;
padding: 0 20px;
}
}
</style>
\ No newline at end of file
src/pages/authority/menu/menus.vue
View file @ d41440c1
......@@ -143,7 +143,7 @@ export default {
rules: {
menu_name: [
{ required: true, message: "请填写菜单名称", trigger: "blur" },
{ min: 0, max: 8, message: "菜单名称不超过8位", trigger: "blur" }
{ min: 0, max: 16, message: "菜单名称不超过16位", trigger: "blur" }
],
visit_url: [
{ required: true, message: "请填写菜单访问地址", trigger: "blur" },
......
src/pages/data-analysis/data-analysis.vue
View file @ d41440c1
......@@ -48,13 +48,13 @@ export default {
path: `/data_analysis/service_control`,
},
],
userNav1: [],
userNav2: [],
navList: [],
}),
watch: {
"$route.fullPath"(path) {
this.initNavList();
},
// "$route.fullPath"(path) {
// this.initNavList();
// },
},
methods: {
initNavList() {
......@@ -65,6 +65,7 @@ export default {
this.navList = this.userNav;
} else if (this.$store.state.userInfo.is_admin == 2) {
this.navList = this.userNav1;
this.$router.push({ name: "orgServiceDataAnalysis" });
} else if (this.$store.state.userInfo.is_admin == 1) {
this.navList = this.userNav2;
}
......
src/pages/workbench/component-center/process-management/process-design/index.vue
View file @ d41440c1
......@@ -127,8 +127,7 @@ export default {
methods: {
verification() {
let self = this;
let data = self.$refs.workFlow.getData();
console.log(data);
let data = JSON.parse(JSON.stringify(self.$refs.workFlow.getData()));
let start_num = 0;
let end_num = 0;
let start_id = "";
......@@ -137,7 +136,13 @@ export default {
let end_after = 0;
let in_edge = 0;
let out_edge = 0;
data.nodeList.forEach((item) => {
let datas = { ...data.obj };
console.log(data);
datas.nodeList.forEach((item) => {
let da = data.params.find((nodep) => {
return nodep.id == item.meta.id;
});
item.meta = da;
if (item.meta.type == 0) {
start_num++;
start_id = item.id;
......@@ -147,14 +152,14 @@ export default {
end_id = item.id;
}
if (
data.linkList.findIndex((el) => {
datas.linkList.findIndex((el) => {
return el.startId == item.id;
}) == -1 &&
item.id != end_id
) {
in_edge++;
} else if (
data.linkList.findIndex((el) => {
datas.linkList.findIndex((el) => {
return el.endId == item.id;
}) == -1 &&
item.id != start_id
......@@ -162,7 +167,7 @@ export default {
out_edge++;
}
});
data.linkList.forEach((item) => {
datas.linkList.forEach((item) => {
if (start_id == item.endId) {
start_before++;
}
......@@ -191,6 +196,7 @@ export default {
type: "warning",
});
}
console.log(datas);
},
backToList() {
this.$router.push("/message/directed_push");
......@@ -250,11 +256,11 @@ export default {
<style>
.block_item .el-textarea__inner {
border-radius: 8px;
background-color: #e3e5ef;
background-color: #f7f8f9;
border: solid 1px #e3e5ef;
}
.block_item .el-input__inner {
background-color: #e3e5ef;
background-color: #f7f8f9;
border: solid 1px #e3e5ef;
}
.block_item .el-select {
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment