|
|
@@ -29,17 +29,18 @@
|
|
|
padding-bottom: 10px;
|
|
|
">{{ endTxt }}</h1>
|
|
|
<div style="height: calc(100vh - 520px);">
|
|
|
- <div v-for="(item, index) in outList" :id="item.id">
|
|
|
+ <!-- <div v-for="(item, index) in outList" :id="item.id">
|
|
|
<el-checkbox-group v-model="checkList" @change="checkChange">
|
|
|
<el-checkbox :label="item.id" :key="item.id">
|
|
|
{{ item.fcda_name }}
|
|
|
</el-checkbox>
|
|
|
</el-checkbox-group>
|
|
|
- </div>
|
|
|
- <!-- <div style="margin-bottom: 10px;" v-for="(item, index) in outList" @click="setIndex(item, index)" :id="item.id">
|
|
|
- <span class="result">{{ index + 1 }}</span>
|
|
|
- <span class="results">{{ item.fcda_name }}</span>
|
|
|
</div> -->
|
|
|
+ <div v-for="(item, index) in outList" :id="item.id">
|
|
|
+ <el-radio-group v-model="checkList" @change="checkChange">
|
|
|
+ <el-radio :label="item.id" :key="item.id"> {{ item.fcda_name }}</el-radio>
|
|
|
+ </el-radio-group>
|
|
|
+ </div>
|
|
|
</div>
|
|
|
</div>
|
|
|
<div id="wrapper"></div>
|
|
|
@@ -163,34 +164,41 @@ export default {
|
|
|
in_or_out: "接收"
|
|
|
}).then(res => {
|
|
|
if (res.code == 0) {
|
|
|
- outList.value = res.data
|
|
|
+ outList.value = res.data;
|
|
|
+ // 将 setTimeout 移动到 then 方法中
|
|
|
setTimeout(() => {
|
|
|
- res.data.map((item, index) => {
|
|
|
+ res.data.forEach((item, index) => {
|
|
|
let line = {
|
|
|
start: item.from_fcda_id,
|
|
|
- ending: item.id
|
|
|
+ end: item.id
|
|
|
+ };
|
|
|
+ let starts = document.getElementById(line.start);
|
|
|
+ let ends = document.getElementById(line.end);
|
|
|
+ // 检查 starts 和 ends 是否存在
|
|
|
+ if (starts && ends) {
|
|
|
+ leaderLineList.value.push(new LeaderLine(starts, ends, {
|
|
|
+ color: "black",
|
|
|
+ size: 2,
|
|
|
+ path: "straight",
|
|
|
+ startSocket: "right",
|
|
|
+ endSocket: "left",
|
|
|
+ endPlug: 'arrow3',
|
|
|
+ endPlugSize: 2
|
|
|
+ }));
|
|
|
+ hiddenLine();
|
|
|
+ } else {
|
|
|
+ console.error(`Element with ID ${line.start} or ${line.end} not found.`);
|
|
|
}
|
|
|
- let starts = document.getElementById(line.start)
|
|
|
- let ends = document.getElementById(line.ending)
|
|
|
- leaderLineList.value.push(new LeaderLine(starts, ends, {
|
|
|
- color: "black",//连接线颜色
|
|
|
- size: 2,//连接线宽度
|
|
|
- path: "straight",//连接线样式
|
|
|
- startSocket: "right",//开始链接元素位置
|
|
|
- endSocket: "left",//结束链接元素位置
|
|
|
- endPlug: 'arrow3',//结束箭头
|
|
|
- endPlugSize: 2,//结束箭头size
|
|
|
- }))
|
|
|
- hiddenLine()
|
|
|
- })
|
|
|
- }, 1000)
|
|
|
+ });
|
|
|
+ }, 1000);
|
|
|
} else {
|
|
|
ElMessage({
|
|
|
message: res.msg,
|
|
|
type: "error"
|
|
|
- })
|
|
|
+ });
|
|
|
}
|
|
|
- })
|
|
|
+ });
|
|
|
+
|
|
|
}
|
|
|
// 关闭模态框
|
|
|
function closeModal() {
|
|
|
@@ -263,10 +271,8 @@ export default {
|
|
|
}).then(res => {
|
|
|
if (res.data != null) {
|
|
|
together.value = res.data
|
|
|
- checkList.value = together.value.map(item => item.to_fcda_id);
|
|
|
- fcdaIds.value = res.data.map(item => {
|
|
|
- return item.to_fcda_id
|
|
|
- }).join(",")
|
|
|
+ checkList.value = together.value[0].to_fcda_id
|
|
|
+ fcdaIds.value = res.data[0].to_fcda_id
|
|
|
loading.value = false
|
|
|
} else {
|
|
|
together.value = []
|
|
|
@@ -283,11 +289,10 @@ export default {
|
|
|
from_fcda_id: curList.value[0].id - 0
|
|
|
}).then(res => {
|
|
|
if (res.data != null) {
|
|
|
+ console.log(res.data, '初始选择');
|
|
|
together.value = res.data
|
|
|
- checkList.value = together.value.map(item => item.to_fcda_id);
|
|
|
- fcdaIds.value = res.data.map(item => {
|
|
|
- return item.to_fcda_id
|
|
|
- }).join(",")
|
|
|
+ checkList.value = together.value[0].to_fcda_id
|
|
|
+ fcdaIds.value = res.data[0].to_fcda_id
|
|
|
loading.value = false
|
|
|
} else {
|
|
|
together.value = []
|
|
|
@@ -303,44 +308,9 @@ export default {
|
|
|
loading.value = false
|
|
|
}
|
|
|
}
|
|
|
- // 循环curList获取应该链接的元素
|
|
|
- // for (let index = 0; index < curList.value.length; index++) {
|
|
|
- // flow.getModelOn({
|
|
|
- // model_id: modelIds.value - 0,
|
|
|
- // from_fcda_id: curList.value[index].id - 0
|
|
|
- // }).then(res => {
|
|
|
- // if (res.data != null) {
|
|
|
- // // 连线出发元素
|
|
|
- // let startCire = res.data[0].from_fcda_id
|
|
|
- // // 获取连线开始元素节点
|
|
|
- // let startTime = document.getElementById(startCire)
|
|
|
- // // 连线结束元素
|
|
|
- // let endCire = res.data.map(item => {
|
|
|
- // return item.to_fcda_id
|
|
|
- // })
|
|
|
- // // 获取连接结束元素节点
|
|
|
- // const divElements = endCire.map(id => document.getElementById(id))
|
|
|
- // if (divElements.length > 1) {
|
|
|
- // divElements.map((item, index) => {
|
|
|
- // leaderLineList.value.push(new LeaderLine(startTime, divElements[index], {
|
|
|
- // color: "black",//连接线颜色
|
|
|
- // size: 2,//连接线宽度
|
|
|
- // path: "straight",//连接线样式
|
|
|
- // startSocket: "right",//开始链接元素位置
|
|
|
- // endSocket: "left",//结束链接元素位置
|
|
|
- // endPlug: 'arrow3',//结束箭头
|
|
|
- // endPlugSize: 2,//结束箭头size
|
|
|
- // }))
|
|
|
- // hiddenLine()
|
|
|
- // })
|
|
|
- // }
|
|
|
-
|
|
|
- // }
|
|
|
- // })
|
|
|
- // }
|
|
|
}
|
|
|
function checkChange(e) {
|
|
|
- fcdaIds.value = e.join(",")
|
|
|
+ fcdaIds.value = e
|
|
|
}
|
|
|
//弹窗打开后使得线条在指定区域中
|
|
|
function hiddenLine() {
|
|
|
@@ -550,4 +520,20 @@ export default {
|
|
|
position: relative;
|
|
|
/* Origin of coordinates for lines, and scrolled content (i.e. not `absolute`) */
|
|
|
}
|
|
|
+
|
|
|
+:deep(.el-radio__inner) {
|
|
|
+ width: 40px;
|
|
|
+ height: 40px;
|
|
|
+}
|
|
|
+
|
|
|
+:deep(.el-radio__input.is-checked .el-radio__inner::after) {
|
|
|
+ width: 15px;
|
|
|
+ height: 15px;
|
|
|
+}
|
|
|
+
|
|
|
+:deep(.el-radio-group) {
|
|
|
+ width: 200px;
|
|
|
+ justify-content: space-between;
|
|
|
+ margin: 8px;
|
|
|
+}
|
|
|
</style>
|
liyangzheng