(window["webpackJsonp"]=window["webpackJsonp"]||[]).push([["chunk-289693f8","chunk-030699dc","chunk-2d22693a"],{"296d":function(e,t,r){"use strict";var o=r("037d"),a=r("eef8"),i=r("f7a3");o({target:"Array",proto:!0},{fill:a}),i("fill")},4239:function(e,t,r){"use strict";r("82b9")},"5ba5":function(e,t,r){"use strict";r.r(t);var o,a=function(){var e=this,t=e.$createElement,r=e._self._c||t;return r("div",{staticClass:"drawer_container"},["grid"===e.drawerType?r("div",[r("div",{staticClass:"drawer_title"},[e._v("画布背景设置")]),r("div",{staticClass:"drawer_wrap"},[r("el-form",{attrs:{"label-position":"left","label-width":"85px"}},[r("el-form-item",{attrs:{label:"是否显示网格","label-width":"100px"}},[r("el-switch",{on:{change:e.changeGrid},model:{value:e.showGrid,callback:function(t){e.showGrid=t},expression:"showGrid"}})],1),r("div",{directives:[{name:"show",rawName:"v-show",value:e.showGrid,expression:"showGrid"}]},[r("el-form-item",{attrs:{label:"网格类型"}},[r("el-radio-group",{on:{change:e.changeGridcardtype},model:{value:e.grid.type,callback:function(t){e.$set(e.grid,"type",t)},expression:"grid.type"}},e._l(e.gridcardtypeList,(function(t){return r("el-radio",{key:t.value,attrs:{label:t.value}},[r("span",[e._v(e._s(t.label))])])})),1)],1),r("el-form-item",{attrs:{"label-width":"70px",label:"网格大小"}},[r("el-slider",{attrs:{min:0,max:30},on:{change:e.changeGrid},model:{value:e.grid.size,callback:function(t){e.$set(e.grid,"size",t)},expression:"grid.size"}})],1),r("el-form-item",{attrs:{label:"网格颜色"}},[r("el-color-picker",{on:{change:e.changeGrid},model:{value:e.grid.args.color,callback:function(t){e.$set(e.grid.args,"color",t)},expression:"grid.args.color"}})],1),r("el-form-item",{attrs:{"label-width":"85px",label:"网格线宽度"}},[r("el-slider",{attrs:{min:0,max:20},on:{change:e.changeGrid},model:{value:e.grid.args.thickness,callback:function(t){e.$set(e.grid.args,"thickness",t)},expression:"grid.args.thickness"}})],1)],1)],1)],1)]):e._e(),"node"===e.drawerType?r("div",[r("div",{staticClass:"drawer_title"},[e._v("任务节点设置")]),r("div",{staticClass:"drawer_wrap"},[r("el-form",{attrs:{"label-position":"left","label-width":"80px"}},[r("el-form-item",{attrs:{label:"任务名称"}},[r("el-input",{on:{change:e.changeNodeText},model:{value:e.drawerNode.nodeText,callback:function(t){e.$set(e.drawerNode,"nodeText",t)},expression:"drawerNode.nodeText"}})],1),r("el-form-item",{attrs:{label:"任务执行人","label-width":"80px"}},[r("el-input",{on:{change:e.changeNodeText},model:{value:e.drawerNode.nodeText,callback:function(t){e.$set(e.drawerNode,"nodeText",t)},expression:"drawerNode.nodeText"}})],1),r("el-form-item",{attrs:{label:"节点背景"}},[r("el-color-picker",{on:{change:e.changeFill},model:{value:e.drawerNode.fill,callback:function(t){e.$set(e.drawerNode,"fill",t)},expression:"drawerNode.fill"}})],1),r("el-form-item",{attrs:{"label-width":"70px",label:"字体大小"}},[r("el-slider",{attrs:{min:10,max:20},on:{change:e.changefontSize},model:{value:e.drawerNode.fontSize,callback:function(t){e.$set(e.drawerNode,"fontSize",t)},expression:"drawerNode.fontSize"}})],1),r("el-form-item",{attrs:{label:"字体颜色"}},[r("el-color-picker",{on:{change:e.changeFontFill},model:{value:e.drawerNode.fontFill,callback:function(t){e.$set(e.drawerNode,"fontFill",t)},expression:"drawerNode.fontFill"}})],1),r("el-form-item",{attrs:{"label-width":"70px",label:"边框宽度"}},[r("el-slider",{attrs:{min:0,max:10},on:{change:e.changeStrokeWidth},model:{value:e.drawerNode.strokeWidth,callback:function(t){e.$set(e.drawerNode,"strokeWidth",t)},expression:"drawerNode.strokeWidth"}})],1),r("el-form-item",{attrs:{label:"边框颜色"}},[r("el-color-picker",{on:{change:e.changeStroke},model:{value:e.drawerNode.stroke,callback:function(t){e.$set(e.drawerNode,"stroke",t)},expression:"drawerNode.stroke"}})],1),r("el-form-item",{attrs:{label:"功能"}},[r("el-button",{attrs:{type:"primary",icon:"el-icon-upload"},on:{click:e.toTopZIndex}},[e._v("置顶")]),r("el-button",{staticClass:"margin-left-10",attrs:{type:"danger",icon:"el-icon-delete"},on:{click:e.deleteNode}},[e._v("删除")])],1)],1),r("el-button",{staticClass:"margin-left-10",attrs:{type:"success",icon:"el-icon-download"},on:{click:e.exportData}},[e._v("保存")])],1)]):e._e(),"edge"===e.drawerType?r("div",[r("div",{staticClass:"drawer_title"},[e._v("线条设置")]),r("div",{staticClass:"drawer_wrap"},[r("el-form",{attrs:{"label-position":"left","label-width":"80px"}},[r("el-form-item",{attrs:{label:"线条文本"}},[r("el-input",{on:{change:e.changeEdgeText},model:{value:e.drawerEdge.EdgeText,callback:function(t){e.$set(e.drawerEdge,"EdgeText",t)},expression:"drawerEdge.EdgeText"}})],1),r("el-form-item",{attrs:{label:"线条宽度","label-width":"80px"}},[r("el-slider",{attrs:{min:1,max:10},on:{change:e.changeEdgeWidth},model:{value:e.drawerEdge.edgeWidth,callback:function(t){e.$set(e.drawerEdge,"edgeWidth",t)},expression:"drawerEdge.edgeWidth"}})],1),r("el-form-item",{attrs:{label:"线条颜色"}},[r("el-color-picker",{on:{change:e.changeEdgeColor},model:{value:e.drawerEdge.edgeColor,callback:function(t){e.$set(e.drawerEdge,"edgeColor",t)},expression:"drawerEdge.edgeColor"}})],1),r("el-form-item",{attrs:{label:"功能"}},[r("el-button",{attrs:{type:"primary",icon:"el-icon-upload"},on:{click:e.toTopZIndex}},[e._v("置顶")]),r("el-button",{staticClass:"margin-left-10",attrs:{type:"danger",icon:"el-icon-delete"},on:{click:e.deleteNode}},[e._v("删除")])],1)],1),r("el-button",{staticClass:"margin-left-10",attrs:{type:"success",icon:"el-icon-download"},on:{click:e.exportData}},[e._v("保存")])],1)]):e._e()])},i=[],n=r("b3d7"),s=r("025b"),l=(r("296d"),r("4a55"),{name:"RightDrawer",data:function(){return{gridcardtypeList:[{label:"四边网格",value:"mesh"},{label:"点状网格",value:"dot"}],baseData:"",showGrid:!0,drawerNode:{fill:"",nodeText:"",fontSize:null,fontFill:"",strokeWidth:null,stroke:""},drawerEdge:{EdgeText:"",edgeWidth:null,edgeColor:""}}},props:{drawerType:{type:String},selectCell:{type:String|Object},graph:{type:String|Object},grid:{type:Object}},created:function(){},mounted:function(){},watch:{selectCell:{handler:function(e){e&&(e.isNode()?(this.drawerNode.fill=e.store.data.attrs.body.fill,this.drawerNode.nodeText=e.store.data.attrs.label.text,this.drawerNode.fontFill=e.store.data.attrs.label.fill,this.drawerNode.fontSize=Number(e.store.data.attrs.label.fontSize),this.drawerNode.strokeWidth=Number(e.store.data.attrs.body.strokeWidth),this.drawerNode.stroke=e.store.data.attrs.body.stroke):(this.drawerEdge.EdgeText=e.store.data.labels?e.store.data.labels[0].text:"",this.drawerEdge.edgeWidth=Number(e.store.data.attrs.line.strokeWidth),this.drawerEdge.edgeColor=e.store.data.attrs.line.stroke))},immediate:!0,deep:!1}},methods:(o={changeGrid:function(){this.showGrid?this.graph.showGrid():this.graph.hideGrid()},changeGridcardtype:function(e){this.grid.type=e,this.changeGrid()}},Object(n["a"])(Object(n["a"])(Object(n["a"])(Object(n["a"])(Object(n["a"])(Object(n["a"])(Object(n["a"])(Object(n["a"])(Object(n["a"])(Object(n["a"])(o,"changeGrid",(function(){this.graph.drawGrid(Object(s["a"])({},this.grid))})),"changeStrokeWidth",(function(e){this.selectCell.attr("body/strokeWidth",e)})),"changefontSize",(function(e){this.selectCell.attr("label/fontSize",e)})),"changeNodeText",(function(){this.selectCell.attr("label/text",this.drawerNode.nodeText)})),"changeStroke",(function(e){this.drawerNode.stroke=e,this.selectCell.attr("body/stroke",this.drawerNode.stroke)})),"changeFontFill",(function(e){this.drawerNode.fontFill=e,this.selectCell.attr("label/fill",this.drawerNode.fontFill)})),"changeFill",(function(e){this.drawerNode.fill=e,this.selectCell.attr("body/fill",e)})),"changeEdgeText",(function(){console.log(this.drawerEdge.EdgeText),this.selectCell.setLabels([{attrs:{label:{text:this.drawerEdge.EdgeText}}}])})),"changeEdgeWidth",(function(e){this.drawerEdge.edgeWidth=e,this.selectCell.attr("line/strokeWidth",this.drawerEdge.edgeWidth)})),"changeEdgeColor",(function(e){this.drawerEdge.stroke=e,this.selectCell.attr("line/stroke",this.drawerEdge.stroke)})),Object(n["a"])(Object(n["a"])(Object(n["a"])(Object(n["a"])(o,"toTopZIndex",(function(){this.selectCell.toFront()})),"deleteNode",(function(){this.$emit("deleteNode")})),"exportData",(function(){this.baseData=this.graph.toJSON(),console.log(this.baseData)})),"importData",(function(){this.graph.fromJSON(this.baseData)})))}),d=l,c=(r("4239"),r("1805")),h=Object(c["a"])(d,a,i,!1,null,"7138a8a0",null);t["default"]=h.exports},"6b73":function(e,t){var r=[],o=[],a="insert-css: You need to provide a CSS string. Usage: insertCss(cssString[, options]).";function i(e,t){if(t=t||{},void 0===e)throw new Error(a);var i,s=!0===t.prepend?"prepend":"append",l=void 0!==t.container?t.container:document.querySelector("head"),d=r.indexOf(l);return-1===d&&(d=r.push(l)-1,o[d]={}),void 0!==o[d]&&void 0!==o[d][s]?i=o[d][s]:(i=o[d][s]=n(),"prepend"===s?l.insertBefore(i,l.childNodes[0]):l.appendChild(i)),65279===e.charCodeAt(0)&&(e=e.substr(1,e.length)),i.styleSheet?i.styleSheet.cssText+=e:i.textContent+=e,i}function n(){var e=document.createElement("style");return e.setAttribute("type","text/css"),e}e.exports=i,e.exports.insertCss=i},"82b9":function(e,t,r){},b9f5:function(e,t,r){"use strict";r.r(t);var o=function(){var e=this,t=e.$createElement,r=e._self._c||t;return r("div",{staticClass:"container_warp"},[r("div",{attrs:{id:"containerChart"}}),r("RightDrawer",{staticClass:"right_drawer",attrs:{drawerType:e.type,selectCell:e.selectCell,graph:e.graph,grid:e.grid},on:{deleteNode:e.deleteNode}}),r("div",{staticClass:"operating"},[r("div",{staticClass:"btn-group"},[r("div",{staticClass:"btn",attrs:{title:"圆形节点"},on:{mousedown:function(t){return e.startDrag("Circle",t)}}},[r("i",{staticClass:"iconfont icon-circle"})]),r("div",{staticClass:"btn",attrs:{title:"正方形节点"},on:{mousedown:function(t){return e.startDrag("Rect",t)}}},[r("i",{staticClass:"iconfont icon-square"})]),r("div",{staticClass:"btn",attrs:{title:"条件节点"}},[r("i",{staticClass:"iconfont icon-square rotate-square",on:{mousedown:function(t){return e.startDrag("polygon",t)}}})]),e.showTips?r("div",{staticClass:"btn-group_tips"},[e._v(" 拖拽生成"),r("br"),e._v("资产拓扑图形 ")]):e._e()]),r("div",{staticClass:"btn-group"},[r("el-tooltip",{attrs:{content:"直线箭头",placement:"bottom"}},[r("div",{class:["btn",1===e.currentArrow?"currentArrow":""],on:{click:function(t){return e.changeEdgeType("normal")}}},[r("i",{staticClass:"iconfont icon-ai28"})])]),r("el-tooltip",{attrs:{content:"曲线箭头",placement:"bottom"}},[r("div",{class:["btn",2===e.currentArrow?"currentArrow":""],on:{click:function(t){return e.changeEdgeType("smooth")}}},[r("i",{staticClass:"iconfont icon-Down-Right"})])]),r("el-tooltip",{attrs:{content:"直角箭头",placement:"bottom"}},[r("div",{class:["btn",3===e.currentArrow?"currentArrow":""],on:{click:function(t){return e.changeEdgeType()}}},[r("i",{staticClass:"iconfont icon-jiantou"})])])],1),r("div",{staticClass:"btn-group"},[r("el-tooltip",{attrs:{content:"删除",placement:"bottom"}},[r("div",{staticClass:"btn",staticStyle:{"margin-top":"5px"},on:{click:function(t){return e.deleteNode()}}},[r("i",{staticClass:"iconfont icon-shanchu"})])]),r("el-tooltip",{attrs:{content:"保存PNG",placement:"bottom"}},[r("div",{staticClass:"btn",attrs:{title:"保存"},on:{click:function(t){return e.saveToPNG()}}},[r("i",{staticClass:"iconfont icon-baocun"})])])],1)])],1)},a=[],i=(r("e4d7"),r("6e70"),r("c33f"),r("cfee"),r("aad4"),r("9514"),r("3522")),n=r("5ba5"),s=r("6b73"),l=r.n(s),d=r("e8f7"),c={},h={data:function(){return{graph:"",value1:!0,type:"grid",selectCell:"",connectEdgeType:{connector:"normal",router:{name:""}},showTips:!1,currentArrow:1,grid:{size:20,visible:!0,type:"mesh",args:{color:"#D0D0D0",thickness:1,factor:10}}}},components:{RightDrawer:n["default"]},methods:{initX6:function(){var e=this,t=this;this.graph=new i["d"]({container:document.getElementById("containerChart"),width:1700,height:"100%",grid:t.grid,resizing:{enabled:!0,orthogonal:!1},selecting:!0,snapline:!0,interacting:{edgeLabelMovable:!0},connecting:{anchor:"center",connectionPoint:"anchor",allowBlank:!1,snap:!0,createEdge:function(){return new i["k"].Edge({attrs:{line:{stroke:"#1890ff",strokeWidth:1,targetMarker:{name:"classic",size:8},strokeDasharray:0,style:{animation:"ant-line 30s infinite linear"}}},label:{text:""},connector:t.connectEdgeType.connector,router:{name:t.connectEdgeType.router.name||""},zIndex:0})}},highlighting:{magnetAvailable:{name:"stroke",args:{padding:4,attrs:{strokeWidth:4,stroke:"#6a6c8a"}}}}}),l()("\n @keyframes ant-line {\n to {\n stroke-dashoffset: -1000\n }\n }\n "),this.graph.fromJSON(c),this.graph.history.redo(),this.graph.history.undo(),this.graph.on("node:mouseenter",i["c"].debounce((function(){var t=document.getElementById("containerChart"),r=t.querySelectorAll(".x6-port-body");e.showPorts(r,!0)})),500),this.graph.on("node:mouseleave",(function(){var t=document.getElementById("containerChart"),r=t.querySelectorAll(".x6-port-body");e.showPorts(r,!1)})),this.graph.on("blank:click",(function(){e.type="grid"})),this.graph.on("cell:click",(function(t){var r=t.cell;e.type=r.isNode()?"node":"edge"})),this.graph.on("selection:changed",(function(t){t.added.forEach((function(t){e.selectCell=t,t.isEdge()&&(t.isEdge()&&t.attr("line/strokeDasharray",5),t.addTools([{name:"vertices",args:{padding:4,attrs:{strokeWidth:.1,stroke:"#2d8cf0",fill:"#ffffff"}}}]))})),t.removed.forEach((function(e){e.isEdge()&&e.attr("line/strokeDasharray",0),e.removeTools()}))}))},showPorts:function(e,t){for(var r=0,o=e.length;r<o;r+=1)e[r].style.visibility=t?"visible":"hidden"},startDrag:function(e,t){Object(d["startDragToGraph"])(this.graph,e,t)},deleteNode:function(){var e=this.graph.getSelectedCells();this.graph.removeCells(e),this.type="grid"},saveToPNG:function(){var e=this;this.$nextTick((function(){e.graph.toPNG((function(e){i["b"].downloadDataUri(e,"资产拓扑图.png")}),{backgroundColor:"white",padding:{top:50,right:50,bottom:50,left:50},quality:1,copyStyles:!1})}))},changeEdgeType:function(e){"normal"===e?(this.connectEdgeType={connector:"normal",router:{name:""}},this.currentArrow=1):"smooth"===e?(this.connectEdgeType={connector:"smooth",router:{name:""}},this.currentArrow=2):(this.connectEdgeType={connector:"normal",router:{name:"manhattan"}},this.currentArrow=3)}},mounted:function(){var e=this;this.initX6(),setTimeout((function(){e.showTips=!0}),1e3),setTimeout((function(){e.showTips=!1}),5e3)}},g=h,f=(r("def6"),r("1805")),u=Object(f["a"])(g,o,a,!1,null,null,null);t["default"]=u.exports},def6:function(e,t,r){"use strict";r("f33b")},e8f7:function(e,t,r){"use strict";r.r(t),r.d(t,"startDragToGraph",(function(){return a}));r("9514");var o=r("3522"),a=function(e,t,r){var a="Rect"===t?e.createNode({width:100,height:60,attrs:{label:{text:"正方形节点",fill:"#000000",fontSize:14,textWrap:{width:-10,height:-10,ellipsis:!0}},body:{stroke:"#000000",strokeWidth:1,fill:"#ffffff"}},ports:i}):"Circle"===t?e.createNode({shape:"ellipse",width:100,height:100,attrs:{label:{text:"圆形节点",fill:"#000000",fontSize:14,textWrap:{width:-20,height:-10,ellipsis:!0}},body:{stroke:"#000000",strokeWidth:1,fill:"#ffffff"}},ports:i}):e.createNode({shape:"polygon",x:40,y:40,width:120,height:120,attrs:{label:{text:"条件节点",fill:"#000000",fontSize:14,textWrap:{width:-50,height:"70%",ellipsis:!0}},body:{fill:"#ffffff",stroke:"#000000",refPoints:"0,10 10,0 20,10 10,20",strokeWidth:1}},ports:i}),n=new o["a"].Dnd({target:e});n.start(a,r)},i={groups:{top:{position:"top",attrs:{circle:{r:4,magnet:!0,stroke:"#2D8CF0",strokeWidth:2,fill:"#fff"}}},bottom:{position:"bottom",attrs:{circle:{r:4,magnet:!0,stroke:"#2D8CF0",strokeWidth:2,fill:"#fff"}}},left:{position:"left",attrs:{circle:{r:4,magnet:!0,stroke:"#2D8CF0",strokeWidth:2,fill:"#fff"}}},right:{position:"right",attrs:{circle:{r:4,magnet:!0,stroke:"#2D8CF0",strokeWidth:2,fill:"#fff"}}}},items:[{id:"port1",group:"top"},{id:"port2",group:"bottom"},{id:"port3",group:"left"},{id:"port4",group:"right"}]}},eef8:function(e,t,r){"use strict";var o=r("ba03"),a=r("1d9b"),i=r("4e61");e.exports=function(e){var t=o(this),r=i(t),n=arguments.length,s=a(n>1?arguments[1]:void 0,r),l=n>2?arguments[2]:void 0,d=void 0===l?r:a(l,r);while(d>s)t[s++]=e;return t}},f33b:function(e,t,r){}}]);
|
