From ad4b69c442d124df9d3e9752247e884f3435c8c4 Mon Sep 17 00:00:00 2001 From: zhangyu Date: Wed, 19 Aug 2020 11:44:26 +0800 Subject: [PATCH] =?UTF-8?q?=E9=87=8D=E6=9E=84projec=E9=A1=B5=E9=9D=A2?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../src/components/charts/chart-list.vue | 38 +- .../src/components/common/project/a.png | Bin 0 -> 618 bytes .../src/components/common/project/a.svg | 11 + .../src/components/common/project/addLine.vue | 302 ++++++++ .../src/components/common/project/addNode.vue | 472 +++++++++++++ .../src/components/common/project/b.png | Bin 0 -> 825 bytes .../src/components/common/project/c.png | Bin 0 -> 1094 bytes .../src/components/common/project/chart.scss | 597 ++++++++++++++++ .../src/components/common/project/d.png | Bin 0 -> 551 bytes .../src/components/common/project/e.png | Bin 0 -> 817 bytes .../src/components/common/project/f.png | Bin 0 -> 858 bytes .../common/project/projectFacade.vue | 143 ++++ .../components/common/project/topology.vue | 668 ++++++++++++++++++ .../components/common/project/visNetwork.vue | 418 +++++++++++ .../src/components/page/project/project.vue | 8 +- 15 files changed, 2635 insertions(+), 22 deletions(-) create mode 100644 nezha-fronted/src/components/common/project/a.png create mode 100644 nezha-fronted/src/components/common/project/a.svg create mode 100644 nezha-fronted/src/components/common/project/addLine.vue create mode 100644 nezha-fronted/src/components/common/project/addNode.vue create mode 100644 nezha-fronted/src/components/common/project/b.png create mode 100644 nezha-fronted/src/components/common/project/c.png create mode 100644 nezha-fronted/src/components/common/project/chart.scss create mode 100644 nezha-fronted/src/components/common/project/d.png create mode 100644 nezha-fronted/src/components/common/project/e.png create mode 100644 nezha-fronted/src/components/common/project/f.png create mode 100644 nezha-fronted/src/components/common/project/projectFacade.vue create mode 100644 nezha-fronted/src/components/common/project/topology.vue create mode 100644 nezha-fronted/src/components/common/project/visNetwork.vue diff --git a/nezha-fronted/src/components/charts/chart-list.vue b/nezha-fronted/src/components/charts/chart-list.vue index 7b57b1101..948a2375a 100644 --- a/nezha-fronted/src/components/charts/chart-list.vue +++ b/nezha-fronted/src/components/charts/chart-list.vue @@ -153,7 +153,7 @@ import draggable from 'vuedraggable' import chartDataFormat from "./chartDataFormat"; import chartAlertList from './chart-alert-list' - import visNetwork from './visNetwork' + // import visNetwork from './visNetwork' export default { name: 'chartList', props: { @@ -170,7 +170,7 @@ chartUrl, chartSingleStat, draggable, - visNetwork, + // visNetwork, }, data() { return { @@ -655,23 +655,23 @@ } this.dataList = [...this.dataTotalList]; - this.dataList.push({ // 拓扑图 - id: -10, - panelId: 0, - title: this.$t("alert.config.chart.alertNumTrend"), - span: 8, - height: 800, - type: "topology", - prev: -11, - next: -1, - unit: 1, - buildIn: 1, - elements: [{ - id: '', - expression: `nz_alert_nums{id="${3333}"}`, - type: '' - }] - }); + // this.dataList.push({ // 拓扑图 + // id: -10, + // panelId: 0, + // title: this.$t("alert.config.chart.alertNumTrend"), + // span: 8, + // height: 800, + // type: "topology", + // prev: -11, + // next: -1, + // unit: 1, + // buildIn: 1, + // elements: [{ + // id: '', + // expression: `nz_alert_nums{id="${3333}"}`, + // type: '' + // }] + // }); this.$nextTick(() => { if (this.dataList.length > 0 ) { this.dataList.forEach((item,index) => { diff --git a/nezha-fronted/src/components/common/project/a.png b/nezha-fronted/src/components/common/project/a.png new file mode 100644 index 0000000000000000000000000000000000000000..d6afeee6166cf05e32e4cce8f9f6dd9d2df6586f GIT binary patch literal 618 zcmV-w0+s!VP)P000{Z1^@s6i6JCt00001b5ch_0Itp) z=>Px#1ZP1_K>z@;j|==^1poj532;bRa{vGmbN~PnbOGLGA9w%&0sl!vK~zXf?Uw6v znm`oA{r~@?Hq&&bP2zMKHSrN*ix{kch>0&$-lzBSNYJc+$>dw^%=rN9J-^+<%A_t2SUVxTk3gR*l@P+_eh|fGY-%h#=sEH8l%QKL1hGnM50cD0 z!eSd>LbJ{ri^MQqp-U6u-eVO*cz{O(XLb-rA~Gxz_dHQ=cqGEw)+2MyThM%}7{)1t z2g|C72ESJvwN3vsL)ET(3WnxNIQVUHp;|WX)oC1G4EcJ|#MxyFjXMSE)P^>91&!t6 zzLB*?Z#Y3))^Yn+dx3oU*#L`S-|Dw$NJIRaZ7RdGxdWAw=qfMfnO;HiuMaRpWFRumt15(dfj^@uo>m(=3{%L?@t|rZu9|o8ZY%<@ z${-yw@6+~f&24youy;bH$8QA3^&qP{E*m`|>=-05H!*o!(dB~Rm>2q5m4gdfE07*qoM6N<$ Ef|P>`V*mgE literal 0 HcmV?d00001 diff --git a/nezha-fronted/src/components/common/project/a.svg b/nezha-fronted/src/components/common/project/a.svg new file mode 100644 index 000000000..d3b3479ba --- /dev/null +++ b/nezha-fronted/src/components/common/project/a.svg @@ -0,0 +1,11 @@ + + + + 矩形 + Created with Sketch. + + + + + + \ No newline at end of file diff --git a/nezha-fronted/src/components/common/project/addLine.vue b/nezha-fronted/src/components/common/project/addLine.vue new file mode 100644 index 000000000..749d907f1 --- /dev/null +++ b/nezha-fronted/src/components/common/project/addLine.vue @@ -0,0 +1,302 @@ + + + + + + + + diff --git a/nezha-fronted/src/components/common/project/addNode.vue b/nezha-fronted/src/components/common/project/addNode.vue new file mode 100644 index 000000000..aaab2e100 --- /dev/null +++ b/nezha-fronted/src/components/common/project/addNode.vue @@ -0,0 +1,472 @@ + + + + + + + diff --git a/nezha-fronted/src/components/common/project/b.png b/nezha-fronted/src/components/common/project/b.png new file mode 100644 index 0000000000000000000000000000000000000000..df64d235f6d01ca20ba74faf3e5da077170b553c GIT binary patch literal 825 zcmV-91IGM`P)Px#1ZP1_K>z@;j|==^1poj532;bRa{vGmbN~PnbOGLGA9w%&0?tW9K~zXf?Ur|Q z+CUJ+^Zmb3T;qZ(Re-QCMHC5vMDNWn`)&{cTV@P)oPV-2Z$>)p?(cR_chV1hll@!J zVzI<@Hiz5pBU^HiF4!y8R+8(y4a0O$^Sa7+E-^2w_#oQ?&E^Y~ofe)-b)@n&rQ}Mf zf&;x+hi*31wLh+&i82B$S}w-Z*(%$%twF=_R5>SeGFwTQvpX;w1C*O%R9h1zt36fn z?9*jy8N$CP(;zkvZ0y(`+ybn6NjpOHaR5{(mvxq*GRfQi>%qZhd%i-)!!;$2m zc7v`WYti}SCXVy_BrYD)xD4yKj%1WBBf1*nGfs@YuVX(9`i%aA);gBJ<4{!AM8ml( z_(>=h=;!Mo(5bu-g-Q*LW(WP@7=zImtxg~J2}8kyV)h0x;6XF6TrO2|%_t&~DZp+t zF&s^B8_T?j@#FRav1K{aMsF}u6|p*wpUErT=?!37b*buY8xI0qg;NMc(keL<_|NoQ z8IIc$_!oe<=#JM$$!=_ovoao8=XZ&~b=tooNs@jpVItp{i-)92zzW<}SABP?jwh$b z7gR)XoNGj7q+O}339sE%UtzXyvz@*U0#U5Ss(Tp8$C1_5rJb341)-=O=zlPXVjH<; z6t9`=D8P^U6lfpq1hMz;?eu*_NI02&AH-iKE-ovhb5N39VjKAe#^vPTsqxy@AliJf zP;V3$n#T(_DTBFjH{ndmF|HRU#tqGmIBr{h+2*Tk+qMPrZMl5GOe*a5hp=R?)EtWskvx(2dWzjIS+SPAn0${H-UiPbAuHUOT5I}00000NkvXXu0mjf D98Gyi literal 0 HcmV?d00001 diff --git a/nezha-fronted/src/components/common/project/c.png b/nezha-fronted/src/components/common/project/c.png new file mode 100644 index 0000000000000000000000000000000000000000..45912e1d3f0c355f480d33e52210a7342e61dbc0 GIT binary patch literal 1094 zcmV-M1iAZ(P)X1^@s6BEU{300001b5ch_0Itp) z=>Px#1ZP1_K>z@;j|==^1poj532;bRa{vGmbN~PnbOGLGA9w%&1KUYNK~zXfy;g^E z;y?_&|No=Qg*0jaV@xjw(~E)76M_LnZJEgocq)@6vMzJXh zb6A<>^G5U=O91X!g8q0;`T9WgCSywmo+tYv`?sg@Y~{0npVJ$2OkaRC+!b}6HdNsK zpRh@H@f;-!4Ur4JMQ0#D1>la8CGvGjS315lZ~~)RXCzDwin=d>^*s*}7mO>|A(t}z z4kin<^>z}_bXQe#N9?wH!cDRo)STqwgO zr$lQcAdmY^G)=#Q23>_x6o_UhlCJobsw4o!w4$E~hRp8M(q|4|6#JO1(S0H>NT{4) zqabjkq^xbNJ)oOdM%;uG3;{u-ND1x*5?K`q43;(z)sUwcU;s*$S`=k<^c=WeGm$V4 zQO})fJ>(7gfuxC?BZ2^?2L|}Rc&_fttqedRvn1K*KrACvg1=doeMIa09tL8TkU}L& zqS0KL4h%yg{2#UKGuaf-?YqJNbRU;~ryeq(N*ah-6gJCba^;GFl1e3hZ-~WkU`SNK zDE{^_OIJae_c~(IRsrHzn0fotB=O^MfuVA+QpKU_5ce2Gp|`j~Mii~*f+}UFd)`AF zOjLNs^i@I__F#wOf`kBuT#!6{lnn<{%+e^f z{McYh7A<46gO47D4ODsx1_=6rK$v=J=paahgb_YEA|u9%ZyZ!c&HSrty2&2 za9;Bhz253m#N?`uNfCen2yvy7wUiNsKypZ>nu=mfHOhC396iQ2KLZlI0pxT5F}9%$(EtDd M07*qoM6N<$f*KXz{{R30 literal 0 HcmV?d00001 diff --git a/nezha-fronted/src/components/common/project/chart.scss b/nezha-fronted/src/components/common/project/chart.scss new file mode 100644 index 000000000..53104c9ab --- /dev/null +++ b/nezha-fronted/src/components/common/project/chart.scss @@ -0,0 +1,597 @@ +.clearfix:after{ + display: block; + content: ""; + clear: both; +} +.clearfix{ + margin-bottom: 0px; +} +.hidden{ + visibility: hidden; +} +.visible{ + visibility: visible; +} +.legend-shape{ + display:inline-block; + margin-right:5px; + border-radius:10px; + width:15px; + height:5px; + vertical-align: middle; +} +.ft-gr{ + color:lightgray; +} +.legend-container{ + width: calc(100% - 30px); + max-height:80px; + min-height:25px; + font-size:12px; + text-align:left; + left: 10px; + bottom: 0px; + line-height: 18px; + position: absolute; + padding-bottom:3px; +} +.nz-icon-warning{ + color: #e6a23c; +} +.legend-container-screen.legend-container { + max-height: 80px; + min-height:25px; +} +.legend-item{ + text-overflow:ellipsis; + white-space:nowrap; + /*width:100%;*/ + margin-right:10px; + overflow-x:hidden; + cursor:pointer; + display:inline-block; + float:left; + line-height: 20px; +} +.nz-chart-dropdown { + height: 180px; + li { + padding-left:15px !important; + padding-right:0px !important; + width:140px; + text-align: left; + i { + margin-right: 10px; + } + } +} +.nz-chart-dropdown-one { + height: 36px; + li { + padding-left:15px !important; + padding-right:0px !important; + width:140px; + text-align: left; + i { + margin-right: 10px; + } + } +} +.panel-info-corner { + color: #767980; + cursor: pointer; + position: absolute; + display: none; + left: 0; + width: 28px; + height: 28px; + z-index: 2; + top: 0; +} +.panel-info-corner--error { + display: block; + color: #fff; +} +.panel-info-corner .fa { + position: relative; + top: -6px; + left: -6px; + font-size: 75%; + z-index: 3; +} +.panel-info-corner .fa-model { + position: relative; + top: -3px; + left: 4px; + font-size: 75%; + z-index: 3; +} +.fa, .fa-model{ + display: inline-block; + text-rendering: auto; + -webkit-font-smoothing: antialiased; +} + +.panel-info-corner--error .panel-info-corner-inner { + border-left: 28px solid #e02f44; + border-right: none; + border-bottom: 28px solid rgba(0,0,0,0); + } +.panel-info-corner-inner { + width: 0; + height: 0; + position: absolute; + left: 0; + bottom: 0; +} +.chart-error-popper[x-placement^=top] .popper__arrow::after { + border-top-color: #e02f44; + bottom:0px; +} +.chart-error-popper[x-placement^=bottom] .popper__arrow::after { + border-bottom-color: #e02f44; +} +.popper__arrow::after{ + border:solid 3px yellow +} +.chart-error-popper{ + background-color:#e02f44; + color:#FFF; + word-wrap:break-word; + word-break:break-word; + max-width:280px; + border: 1px solid #e02f44; +} +.chart-warring-popper[x-placement^=top] .popper__arrow::after { + border-top-color: #e6a23c; + bottom:0px; +} +.chart-warring-popper[x-placement^=bottom] .popper__arrow::after { + border-bottom-color: #e6a23c; +} +.popper__arrow::after{ + border:solid 3px yellow +} +.chart-warring-popper{ + background-color:#e6a23c; + color:#FFF; + word-wrap:break-word; + word-break:break-word; + max-width:280px; + border: 1px solid #e6a23c; +} +.moreTitle{ + .panel-info-corner--error .panel-info-corner-inner { + border-left: 28px solid #e6a23c; + border-right: none; + border-bottom: 28px solid rgba(0,0,0,0); + } + .panel-info-corner-inner { + width: 0; + height: 0; + position: absolute; + left: 0; + bottom: 0; + } + .nz-icon-warning:before { + color: #fff; + } +} +.nz-chart-resize { + height: 100%; + width: 100%; + position: relative; +} +.resize-box { + border: 1px solid #d8dce1; + position: absolute; + box-sizing: border-box; + width: 100%; + height: 100%; + top: 0; + left: 0; +} +.resize-shadow { + height: 100%; + width: 100%; + position: absolute; + box-sizing: border-box; +} +.resize-shadow-active { + background-color: #f5f9ff; + border: 1px solid #b7d0f7; + box-shadow: 1px 1px 1px #d3e1f8; +} +.drag-disabled .el-dropdown-link { + cursor: default !important; +} +.resize-box { + .pagination { + padding-top: 0; + } + .success { + background-color: #50d050; + color: white; + padding: 2px 5px; + border-radius: 4px; + } + .danger { + background-color: #d64f40; + color: white; + padding:2px 5px; + border-radius: 4px; + } + .chart-table, .chart-alert-info { + width: 100%; + .table-container { + padding: 0 6px; + box-sizing: border-box; + .nz-table { + margin-top: 6px; + box-sizing: border-box; + } + } + } + .chart-single-stat { + width: 100%; + .single-stat-container { + padding-left: 8px; + padding-right: 8px; + display: table; + text-align: center; + width: calc(100% - 16px); + .single-stat-content{ + text-align:center; + vertical-align: middle; + display:table-cell; + font-size:30px; + } + } + } + .chart-container.chart-detail { + height: 100%; + position: relative; + background-color: white; + .chart-title:hover { + background-color:#d8dce1; + } + .chart-title:not(.drag-disabled) { + cursor: move; + } + .chart-title { + text-align: center; + width: 100%; + line-height: 30px; + padding: 1px 3px 0 3px; + box-sizing: border-box; + .nz-chart-top{ + width:100%; + } + .el-dropdown-link { + cursor: move; + } + .el-icon-arrow-down { + font-size: 12px; + } + .chart-title-text { + font-size: 16px; + line-height: 26px; + color: #52545c; + display:flex; + justify-content:center; + align-items:center; + max-width:calc(100% - 20px); + text-overflow: ellipsis; + overflow: hidden; + white-space: nowrap; + .chart-title-icon{ + display: inline-block; + cursor: pointer; + } + } + } + .chart-info { + padding-top: 6px; + width: 100%; + height: calc(100% - 34px); + } + .active-icon { + margin: 0; + } + .chart-sub { + padding: 0 15px; + margin-bottom: 5px; + :last-of-type { + margin-bottom: 0; + } + } + .chart-sub-title { + background-color: #efefef; + font-size: 13px; + color: #505255; + padding-left: 2px; + height: 25px; + line-height: 25px; + user-select: none; + } + .chart-sub-content, .chart-third-content, .chart-forth-content { + width: 100%; + box-sizing: border-box; + >.content-item>.item-tip { + display: inline-block; + box-sizing: border-box; + } + >.content-item>.item-tip:not(.content-item-value-muti) { + padding: 0 3px 0 13px; + } + >.content-item { + font-size: 13px; + line-height: 26px; + border-top: 1px solid rgb(235, 238, 245); + display: flex; + position: relative; + flex-wrap: wrap; + .item-tip> { + .item-tip-hide { + display: none; + position: absolute; + bottom: 34px; + min-width: 50px; + white-space: normal; + } + .item-tip-key { + left: 17%; + transform: translateX(-50%); + width: 33%; + } + .item-tip-value { + left: 67%; + width: 63%; + transform: translateX(-50%); + } + .item-tip-hide::after { + content: ''; + display: block; + width:0; + height:0; + overflow: hidden; + font-size: 0; + line-height: 0; + border: 5px; + border-style: dashed dashed solid dashed; + border-color: white transparent transparent transparent; + position: absolute; + left: 50%; + bottom: 0; + transform: translate(-50%, 10px); + } + } + .item-tip:hover>.item-tip-show { + display: block; + } + .item-tip.deep { + padding-left: 26px; + box-sizing: border-box; + height: 26px; + } + .item-tip.deepp { + padding-left: 39px; + box-sizing: border-box; + height: 26px; + } + .item-tip.deep:nth-of-type(2) { + padding-left: 13px; + box-sizing: border-box; + height: 26px; + } + .item-tip.deepp:last-of-type { + padding-left: 13px; + box-sizing: border-box; + height: 26px; + } + .tag-value:hover .item-tip-show { + display: block; + } + .tag-value { + text-overflow: ellipsis; + overflow: hidden; + white-space: nowrap; + } + .content-item-key { + color: #666; + width: 35%; + height: 26px; + text-overflow: ellipsis; + overflow: hidden; + white-space: nowrap; + } + .content-item-key .no-overflow, .content-item-value .no-overflow { + text-overflow: unset; + white-space: normal; + } + .content-item-value { + .item-value-sub { + padding: 0 3px 0 13px; + box-sizing: border-box; + } + .item-value-sub:not(:last-of-type) { + border-bottom: 1px solid rgb(235, 238, 245); + } + .nz-table { + th .cell { + height: 25px; + line-height: 25px; + } + td .cell { + min-height: 26px; + line-height: 26px; + } + .el-table__body { + background-color: white; + } + .el-table__body tr:last-of-type td { + border: none; + } + .el-table__body tr td { + background-color: white; + } + .el-table__body tr:hover>td { + background-color: white; + } + } + text-overflow: ellipsis; + overflow: hidden; + white-space: nowrap; + border-left: 1px solid rgb(235, 238, 245); + color: #1a1a1a; + width: 65%; + height: 99%; + } + } + } + .chart-sub-content { + >.content-item:first-of-type { + border-top: none; + } + >.content-item:last-of-type { + border-bottom: 1px solid rgb(235, 238, 245); + } + } + } + .chart-url { + .url-container { + padding: 0 8px 8px 8px; + box-sizing: border-box; + } + } + .line-chart-block, .chart-table, .chart-single-stat, .chart-url, .chart-asset-info, .chart-alert-info, .chart-project-info, .chart-alert-rule-info ,.vis-network{ + height: 100%; + position: relative; + background-color: white; + .chartTitle:hover { + background-color:#d8dce1; + } + .chartTitle { + text-align: center; + width: 100%; + line-height: 30px; + height: 28px; + padding: 1px 3px 0 3px; + box-sizing: border-box; + .nz-chart-top{ + width:100%; + } + .el-dropdown-link { + cursor: move; + } + .el-icon-arrow-down { + font-size: 12px; + } + .chart-title { + font-size: 16px; + line-height: 26px; + color: #52545c; + display:flex; + justify-content:center; + align-items:center; + .chart-title-text{ + max-width:calc(100% - 20px); + text-overflow: ellipsis; + overflow: hidden; + white-space: nowrap; + cursor: pointer; + } + .chart-title-icon{ + display: inline-block; + cursor: pointer; + } + } + } + + .line-area { + box-sizing: border-box; + background: #FFF; + min-height: 95px; + padding-left:8px; + padding-right:8px; + } + .button-panel-height{ + height:26px; + } + .button-panel-height button{ + height:26px; + } + .edit { + position: absolute; + right: 20px; + top: 17px; + z-index: 10; + + } + .chart-select { + position: absolute; + left: 40px; + top: 25px; + z-index: 10; + font-size: 14px; + .chart-select-btn { + margin-right: 10px; + cursor: pointer; + &.active { + color: #5aacff; + } + } + } + /*没有数据显示*/ + .null { + position: absolute; + top: 50%; + width: 100%; + text-align: center; + font-size: 24px; + font-weight: 600; + } + } +} +.dialog-tool { + margin-right: 40px; +} +.line-chart-block-modal { + .el-dialog{ + height: 80%; + } + .line-area { + box-sizing: border-box; + background: #FFF; + height: 100%; + span.highcharts-title {/*针对highcharts设置的样式，echarts需要修改？？*/ + display: block !important; + width: 50%; + font-size: 14px !important; + overflow: hidden; + word-wrap: break-word !important; + white-space: pre-wrap !important; + } + } + .element-top-border { + padding-bottom: 5px; + border-top: 1px solid #dfe7f2; + margin-top:-25px; + } + + .element-bottom-border { + border-bottom: 1px solid #dfe7f2; + margin-bottom:-20px; + } + .pt10{ + padding-top:10px; + } + .el-dialog__body { + height: calc(100% - 80px); + } + + .el-dialog__header{ + padding: 20px 20px 0px; + } + +} diff --git a/nezha-fronted/src/components/common/project/d.png b/nezha-fronted/src/components/common/project/d.png new file mode 100644 index 0000000000000000000000000000000000000000..6f03544971e36c1fd0b9a530032ac5fb7071a3ea GIT binary patch literal 551 zcmV+?0@(eDP)Px#1ZP1_K>z@;j|==^1poj532;bRa{vGmbN~PnbOGLGA9w%&0lY~>K~zXf?UsE{ zf>0R6`~Kf3?PW827cm4i0TJJjq-aFu3wYvQE+v6WnX9ch+u0a!&hNR;U-tk%q#Tr4 zzYp>}AG7%amhC|6k0HrA_=bu~y$w#3>2p)*K_8m19T)S(629-VbW#Zr3G|H#cu7I& zR>bjT4M*oZ3gs#aXB-Zh$#XGyN4}i||CBiiLaPJQva$3$*7m6w$Z@B^#4-&>g}b;= z=5TybgK)3WZLI49v|6ojBedz{X(hY3cwR;QzRQ|J#Xw}5v|tvOZba4`Dh9d|ls%n@ z2jA+k=1?(^AP;dXX*j*EX9AK;snS5D(S_JCSaYZZ=#H6d>bSgH|bHoh>M=9{iYAu#H7^1l@STVi~^)#Xv;M;668bcF`GHXli2` zBw#^FmXgWIH?s0p*F@KNg#9vwmvX;LfFk++icaOc&R{+{=#6a(SNaobZS)wd=NS+7 p3*5Ik9ndHH-=K}4ee17*fOqN4+9+sXZ|VR5002ovPDHLkV1nPK@^AnE literal 0 HcmV?d00001 diff --git a/nezha-fronted/src/components/common/project/e.png b/nezha-fronted/src/components/common/project/e.png new file mode 100644 index 0000000000000000000000000000000000000000..3019f7707c328b47283861508b457bbcfd77716d GIT binary patch literal 817 zcmV-11J3-3P)Px#1ZP1_K>z@;j|==^1poj532;bRa{vGmbN~PnbOGLGA9w%&0>(*1K~zXf?N(`X z+CU8L|NlqL)wBgthHzto0b@>M?lTb1S3PmeFoqxu%UiViYSew$sMsWqy*}L)sZUZz_=lmODVDGexa8Q+4|Dqq_4GTX2UO z%N*^&c$@W5JfumhhIp=~!LJdWQpT_Y%#qC3wpkCwLmG&gh?*6o3NGyC2$k;pE3I~4 zwC#*#jzBEC&3Y&v(%V1`cfS${8MX!{@($9)7IIEsDj1{Go@g7XT+>D$F~l+^l(sd; zO(43>dMF-J0>AzYtKP^4z6F!;MKTB`Ej*@+h-Au|n94P6^btcWWA^d>50GA}pQQgM z>9qv%i)Mm-GQr$F#Bk+{>@l?Mp7*$ONv}jBMjoBs5dGm8PNSpbxnfP9hhsT9ZcAL)Q`6KDeNUvqrt?obvc-F2Vl`SHa$YQ=&s=e$q)n^u}uq!TJW^)ANnafDoDyv-A zWaG(Ht0~nQSgqCwr*gOtCa@IJkyK3khSa>A)E_pq!r6QwH_u!ut}2mPs3;;j`FMLkx7`g9=BuSA*C#2 z)HOTu3nEh}AoG;Rg>7dCIFt7TqO{RR46*#08Ot1}Px#1ZP1_K>z@;j|==^1poj532;bRa{vGmbN~PnbOGLGA9w%&0`EygK~zXfa{ylRKA%66-^*etaU36J0nv&a*ttKRqT=^p zmD@197IfE#=J?3j&3E8^K4(9Z{L2*gIGkY4q4kE;Vi-Saw zga*^8!gA|~r46{X7VJusI?LfSmW4;_lW3aGOz|=88nUK~+pHy5U-j={*j4IIJx=6Q zecYtzohZ<&x6tYK;dgpcfJzC=jW+I7OZF~=JR^zId0UDZjwcewogO917!DMz1g%h} zifd@JA5d*}Hr>&@P*ShnhD!y-Go~ajkYCR7aHHfg7(IzE7jTg1TG2OwbpZ#emW!*T zE(OFWF(=@p(Uc)qy6vV|Zb)&wXF4^x0nW8Mv;on5Z-6LO!<}tg|13C;-}0J@thXM* z=ZJN!SnZIM_(&Tx3slt^Junk3e#pQCw(8k%W#r&H1tnaeN~0Qis~{f#qvpDPko^ z>K;-?g{tRH>XIY?t$Cm2DoMJ=N)e&A;rQ*F9VOaDF#R9Eek|j|L|?^!LUg_n!rujc zw@{*j*AUe`^spZVt2-;XRxF3l(Q>syw?86Pa74>kt2p2+P=(izVStS~@HzXjKP$hY zm(YHA#FG9+?OH&zHLimH4NYfr^oL_KT3u0YR`WcGs9vhjZ$;MpSz%4<4Mv!f +
+
+ +
+
+
+
123
+
456
+
+ + +
+
+ + + + + diff --git a/nezha-fronted/src/components/common/project/topology.vue b/nezha-fronted/src/components/common/project/topology.vue new file mode 100644 index 000000000..7de15c150 --- /dev/null +++ b/nezha-fronted/src/components/common/project/topology.vue @@ -0,0 +1,668 @@ + + + + + diff --git a/nezha-fronted/src/components/common/project/visNetwork.vue b/nezha-fronted/src/components/common/project/visNetwork.vue new file mode 100644 index 000000000..58b635b9d --- /dev/null +++ b/nezha-fronted/src/components/common/project/visNetwork.vue @@ -0,0 +1,418 @@ + + + + + diff --git a/nezha-fronted/src/components/page/project/project.vue b/nezha-fronted/src/components/page/project/project.vue index 7a605ae9a..f69db5c7a 100644 --- a/nezha-fronted/src/components/page/project/project.vue +++ b/nezha-fronted/src/components/page/project/project.vue @@ -125,7 +125,8 @@ @@ -147,13 +148,14 @@ import loading from "../../common/loading"; import panelTab from '../../common/bottomBox/tabs/panelTab' import bus from '../../../libs/bus' - + import facade from '@/components/common/project/projectFacade' export default { name: "project2", components: { 'export-excel':exportXLSX, 'loading': loading, - 'panel-tab': panelTab + 'panel-tab': panelTab, + facade, }, data() { return {