Explorar o código

完善模型图编辑
修复部分bug

liling hai 1 ano
pai
achega
eb98a62d7c

+ 53 - 39
src/pages/components/draw/DrawDesigns.vue

@@ -305,7 +305,7 @@ export default {
         }
         function listMap() {
             fun.value = props.searchModule
-            funOne.value = props.cleanAll
+            //funOne.value = props.cleanAll //触发关闭按钮事件
             coolId.value = props.needId
             coolName.value = props.needName//模型名称
             copyObj.value = props.coolObj//需要的模型信息对象
@@ -359,22 +359,26 @@ export default {
             lf.value = new LogicFlow({
                 // 通过选项指定了渲染的容器和需要显示网格
                 container: container.value,//需要显示画布的容器ref
-                // grid: {
-                //     size: 10,
-                //     visible: false,
-                //     type: "mesh",
-                //     config: {
-                //         color: "#ababab",
-                //         thickness: 1,
-                //     },
-                // },//网格,
-                grid: true,
+                isSilentMode:false, //仅浏览不可编辑模式,默认不开启
+                grid: {
+                     size: 1,//同时影响位置精确度。当前设置为1像素级
+                     visible: false,
+                     type: "mesh",
+                     config: {
+                         color: "#ededed",
+                         thickness: 1,
+                     },
+                },//网格,
+                //grid: true,
                 plugins: [DndPanel, SelectionSelect, Group, GroupNode, Menu, MiniMap, Snapshot, RectResize, NodeResize],//全局加载的组件
                 keyboard: {
                     enabled: true
                 },
                 snapline: true,//辅助线
-                edgeTextDraggable: true,//连接线文本可以拖拽
+                //edgeTextDraggable: true,//连接线文本可以拖拽
+                nodeTextEdit:false,
+                edgeTextEdit:false,
+                multipleSelectKey:"ctrl",//多选按键:meta(cmd)、shift、alt
             })
             class SvEdge extends PolylineEdge { }
             // 节点Model
@@ -579,33 +583,15 @@ export default {
                 setY.value = data.data.y
                 emit("backxy", setX.value, setY.value)
             })
-            // console.log(lf.value.graphModel,'sss');
             lf.value.on('edge:click', function (data, e, position) {//解决点击连接线问题
-                //console.log(data.data.pointsList)
                 if(delId.value!=""){
-                    //const edgeModel = lf.value.getEdgeModelById(delId.value);
                     //恢复原线宽度    
-                    //有bug,会导致连接线重新绘制,原手动调整的points会失效                 
-                    //const edge = lf.value.getEdgeModelById(delId.value);
-                    //if(edge!=null) lf.value.changeEdgeType(delId.value, edge.type.replace("2",""))
+                    lf.value.getEdgeModelById(delId.value).setStyle("strokeWidth",1)
                 }
                 delId.value = data.data.id
                 //当前点击线设置为粗线
-                //lf.value.changeEdgeType(data.data.id, data.data.type.replace("2","")+"2") //有bug,会导致连接线重新绘制,原手动调整的points会失效          
+                lf.value.getEdgeModelById(data.data.id).setStyle("strokeWidth",3)
                 nodeId.value = "" //清除选择的节点Id
-                /*
-                //根据选择的边类型,更改当前选择边的类型
-                if (copyColor.value == '#255CE7') {
-                    blue()
-                    lf.value.changeEdgeType(data.data.id, "baseEdge")
-                    lf.value.setProperties(data.data.id, { 'issv': 'GOOSE' })
-                }
-                if (copyColor.value == 'orange') {
-                    orange()
-                    lf.value.changeEdgeType(data.data.id, "svEdge")
-                    lf.value.setProperties(data.data.id, { 'issv': 'SV' })
-                }
-                */
             })
             //当将节点托入画布后触发事件
             lf.value.on('node:dnd-add', function (nodedata) {
@@ -624,6 +610,13 @@ export default {
             lf.value.on("node:resize", function (data) {
                 //if(data.oldNodeSize.type!="my-group") return;                         
             })
+            //画布点击事件
+            lf.value.on("blank:click", function (data) {
+                if(delId.value!=""){
+                    //恢复原线宽度    
+                    lf.value.getEdgeModelById(delId.value).setStyle("strokeWidth",1)
+                }                        
+            })
             lf.value.render();
             listMap()
         })
@@ -670,11 +663,11 @@ export default {
                 })
                 return
             }
-            console.log(elements.nodes)
             let calMax=function(){
-                let resultMax={"left":0,"right":0,"top":0,"bottom":0}
+                let resultMax={"left":0,"right":0,"top":0,"bottom":0,"width":0,"height":0}
                 elements.nodes.forEach(ele => {
-                    const size=ele.properties.nodeSize
+                    let size=ele.properties.nodeSize
+                    if(size==null) size={"width":100,"height":80} //默认高宽
                     if(resultMax.left==0 || ele.x<resultMax.left){
                         //获取最小的left
                         resultMax.left = ele.x
@@ -691,34 +684,55 @@ export default {
                         //获取最大的topt
                         resultMax.bottom = ele.y+size.height
                     }
-                });                
+                    if(resultMax.width==0 || size.width>resultMax.width){
+                        resultMax.width = size.width
+                    }
+                    if(resultMax.height==0 || size.height>resultMax.height){
+                        resultMax.height = size.height
+                    }
+                });
                 return resultMax
             }
             const xyz=calMax()
-            console.log(xyz)
             switch(v){
                 case "align_left":                    
                     //位置调整
                     elements.nodes.forEach(ele => {
                         const size=ele.properties.nodeSize
-                        lf.value.getNodeModelById(ele.id).moveTo(xyz.left,ele.y)
+                        //lf.value.getNodeModelById(ele.id).moveTo(xyz.left,ele.y)
+                        lf.value.graphModel.moveNode2Coordinate(ele.id,xyz.left,ele.y,false)
                     })
                     break;
                 case "align_right":
                     elements.nodes.forEach(ele => {
                         const size=ele.properties.nodeSize
-                        lf.value.getNodeModelById(ele.id).moveTo(xyz.right-size.width,ele.y)
+                        //lf.value.getNodeModelById(ele.id).moveTo(xyz.right-size.width,ele.y)
+                        lf.value.graphModel.moveNode2Coordinate(ele.id,xyz.right-size.width,ele.y,false)
                     })
                     break;
                 case "align_center":
                     break;
                 case "align_top":
+                    elements.nodes.forEach(ele => {
+                        //const size=ele.properties.nodeSize
+                        lf.value.graphModel.moveNode2Coordinate(ele.id,ele.x,xyz.top,false)
+                    })
                     break;
                 case "align_bottom":
+                    elements.nodes.forEach(ele => {
+                        const size=ele.properties.nodeSize
+                        lf.value.graphModel.moveNode2Coordinate(ele.id,ele.x,xyz.bottom-size.height,false)
+                    })
                     break;
                 case "size_samewidth":
+                    elements.nodes.forEach(ele => {
+                        lf.value.getNodeModelById(ele.id).width=xyz.width;
+                    })
                     break;
                 case "size_sameheight":
+                    elements.nodes.forEach(ele => {
+                        lf.value.getNodeModelById(ele.id).height=xyz.height;
+                    })
                     break;
                 default:
                     break;

+ 1 - 1
src/pages/components/drawModal/AbilityModal.vue

@@ -280,7 +280,7 @@ export default {
             }).then(res => {
                 if (res.code == 0) {
                     //sureClose()
-                    props.funOne()
+                    if(props.funOne!=null)props.funOne()
                     ElMessage({
                         message: "修改成功",
                         type: 'success'

+ 2 - 2
src/pages/mission/components/CreateMis.vue

@@ -32,15 +32,15 @@
                             plain><el-icon>
                                 <Coin style="color: #449DFD;" />
                             </el-icon>选择模型</el-button>
-                    </el-form-item>
+                    </el-form-item>                    
                     <el-form-item label="报告模板" prop="reportNow">
                         <el-select class="bestInput" style="width: 400px;height: 40px;" @chang="bmChange"
                             v-model="newMission.reportNow" placeholder="请选择模板" clearable>
                             <el-option v-for="(item, index) in rmList" :label="item.name" :value="item.id" />
                         </el-select>
                     </el-form-item>
+                    <el-form-item style="color:#ccc;font-size:12px">模型说明:如果更改了检查模型,保存后需要对间隔列表及装置进行"重新解析"</el-form-item>
                     <el-form-item prop="misMes">
-
                         <template #label>
                             <span style="color: red;">任务说明</span>
                         </template>

+ 1 - 1
src/pages/mission/components/HistoryMis.vue

@@ -38,7 +38,7 @@
                     <template #default="scoped">
                         <!-- <el-popconfirm title="你确定删除吗?" @confirm="sureDelMis">
                             <template #reference> -->
-                        <el-button v-if="scoped.row.state=='2'" link type="primary" size="small" @click="relady(scoped.row)">重新检测</el-button>
+                        <el-button v-if="scoped.row.state=='2'||scoped.row.state=='3'" link type="primary" size="small" @click="relady(scoped.row)">重新检测</el-button>
                         <el-button v-if="scoped.row.state!='1'" link type="danger" size="small" @click="delMis(scoped.row)">删除</el-button>
                         <!-- </template>
                         </el-popconfirm> -->

+ 9 - 4
src/pages/system/components/InsideModule.vue

@@ -34,18 +34,18 @@
                                     <span style="display: block;">删除</span>
                                 </div>
                             </div>
-                            <!--
+                            <!---->
                             <div style="display: flex;width: 15%;">
                                 <div>
                                     <span style="font-size: 14px;color: #7484AB;">对齐:</span>
                                 </div>
                                 <div>
-                                    <el-select class="coord" v-model="alignListValue" @change="onAlignChange">
+                                    <el-select :disabled="!selectModeState" style="width: 120px;" class="coord" v-model="alignListValue" @change="onAlignChange">
                                         <el-option v-for="item in alignList" :key="item.id" :label="item.name" :value="item.id"></el-option>
                                     </el-select>
                                 </div>
                             </div>
-                            -->
+                            
                             <div style="display: flex;width: 20%;">
                                 <div>
                                     <span style="font-size: 14px;color: #7484AB;">位置:</span>
@@ -149,9 +149,10 @@ export default {
         let copyType = ref(false)//copyload.vue打开或关闭
         let selectModeState = ref(false)
         let alignList = ref([
+            {id:"",name:"请选择"},
             {id:"align_left",name:"左对齐"},
             {id:"align_right",name:"右对齐"},
-            {id:"align_center",name:"水平居中"},
+            //{id:"align_center",name:"水平居中"},
             {id:"align_top",name:"顶部对齐"},
             {id:"align_bottom",name:"底部对齐"},
             {id:"size_samewidth",name:"相同宽度"},
@@ -246,6 +247,10 @@ export default {
                 return
             }
             designsRef.value.onAlignChange(alignListValue.value)
+            //处理完后将选择项清除,否则下次如果还是相同选项时,将无法触发事件
+            setTimeout(() => {
+                alignListValue.value=""
+            }, 1000);            
         }
         onMounted(() => {
             searchModule()