diff --git a/src/assets/css/components/views/entityExplorer/entity-detail.scss b/src/assets/css/components/views/entityExplorer/entity-detail.scss index 919f32dc..d0683075 100644 --- a/src/assets/css/components/views/entityExplorer/entity-detail.scss +++ b/src/assets/css/components/views/entityExplorer/entity-detail.scss @@ -1,3 +1,57 @@ +.entity-detail { + .entity-tag { + display: flex; + height: 28px; + padding: 0 12px; + justify-content: center; + align-items: center; + font-size: 14px; + border: 1px solid; + border-radius: 2px; + + &.entity-tag--small { + height: 20px; + padding: 0 6px; + font-size: 12px; + } + $normal-color: #778391; + $normal-light-color: #F7F8F9; + $negative-color: #E26154; + $negative-light-color: #FEF6F5; + $positive-color: #749F4D; + $positive-light-color: #F7FAF5; + &.entity-tag--level-one-normal { + border-color: $normal-color; + color: white; + background-color: $normal-color; + } + &.entity-tag--level-one-negative { + border-color: $negative-color; + color: white; + background-color: $negative-color; + } + &.entity-tag--level-one-positive { + border-color: $positive-color; + color: white; + background-color: $positive-color; + } + &.entity-tag--level-two-normal { + border-color: $normal-color; + color: $normal-color; + background-color: $normal-light-color; + } + &.entity-tag--level-two-negative { + border-color: $negative-color; + color: $negative-color; + background-color: $negative-light-color; + } + &.entity-tag--level-two-positive { + border-color: $positive-color; + color: $positive-color; + background-color: $positive-light-color; + } + } +} /* .entity-detail.cn-home { .panel-chart { diff --git a/src/assets/css/font/iconfont.css b/src/assets/css/font/iconfont.css index 54542563..d1419853 100644 --- a/src/assets/css/font/iconfont.css +++ b/src/assets/css/font/iconfont.css @@ -1,8 +1,8 @@ @font-face { font-family: "cn-icon"; /* Project id 2614877 */ - src: url('iconfont.woff2?t=1683252401572') format('woff2'), - url('iconfont.woff?t=1683252401572') format('woff'), - url('iconfont.ttf?t=1683252401572') format('truetype'); + src: url('iconfont.woff2?t=1683361452726') format('woff2'), + url('iconfont.woff?t=1683361452726') format('woff'), + url('iconfont.ttf?t=1683361452726') format('truetype'); } .cn-icon { @@ -13,7 +13,27 @@ -moz-osx-font-smoothing: grayscale; } -.cn-icon-Duration:before { +.cn-icon-dns-insight:before { + content: "\e7ef"; +} + +.cn-icon-network-performance:before { + content: "\e7f0"; +} + +.cn-icon-network-overview:before { + content: "\e7f1"; +} + +.cn-icon-copy:before { + content: "\e7ee"; +} + +.cn-icon-analysis:before { + content: "\e7ed"; +} + +.cn-icon-duration:before { content: "\e7ec"; } diff --git a/src/assets/css/font/iconfont.js b/src/assets/css/font/iconfont.js index a128a46f..06fc9992 100644 --- a/src/assets/css/font/iconfont.js +++ b/src/assets/css/font/iconfont.js @@ -1 +1 @@ -window._iconfont_svg_string_2614877='',function(l){var a=(a=document.getElementsByTagName("script"))[a.length-1],c=a.getAttribute("data-injectcss"),a=a.getAttribute("data-disable-injectsvg");if(!a){var h,o,i,m,z,v=function(a,c){c.parentNode.insertBefore(a,c)};if(c&&!l.__iconfont__svg__cssinject__){l.__iconfont__svg__cssinject__=!0;try{document.write("")}catch(a){console&&console.log(a)}}h=function(){var a,c=document.createElement("div");c.innerHTML=l._iconfont_svg_string_2614877,(c=c.getElementsByTagName("svg")[0])&&(c.setAttribute("aria-hidden","true"),c.style.position="absolute",c.style.width=0,c.style.height=0,c.style.overflow="hidden",c=c,(a=document.body).firstChild?v(c,a.firstChild):a.appendChild(c))},document.addEventListener?~["complete","loaded","interactive"].indexOf(document.readyState)?setTimeout(h,0):(o=function(){document.removeEventListener("DOMContentLoaded",o,!1),h()},document.addEventListener("DOMContentLoaded",o,!1)):document.attachEvent&&(i=h,m=l.document,z=!1,n(),m.onreadystatechange=function(){"complete"==m.readyState&&(m.onreadystatechange=null,t())})}function t(){z||(z=!0,i())}function n(){try{m.documentElement.doScroll("left")}catch(a){return void setTimeout(n,50)}t()}}(window); \ No newline at end of file +window._iconfont_svg_string_2614877='',function(l){var a=(a=document.getElementsByTagName("script"))[a.length-1],c=a.getAttribute("data-injectcss"),a=a.getAttribute("data-disable-injectsvg");if(!a){var h,o,i,m,v,z=function(a,c){c.parentNode.insertBefore(a,c)};if(c&&!l.__iconfont__svg__cssinject__){l.__iconfont__svg__cssinject__=!0;try{document.write("")}catch(a){console&&console.log(a)}}h=function(){var a,c=document.createElement("div");c.innerHTML=l._iconfont_svg_string_2614877,(c=c.getElementsByTagName("svg")[0])&&(c.setAttribute("aria-hidden","true"),c.style.position="absolute",c.style.width=0,c.style.height=0,c.style.overflow="hidden",c=c,(a=document.body).firstChild?z(c,a.firstChild):a.appendChild(c))},document.addEventListener?~["complete","loaded","interactive"].indexOf(document.readyState)?setTimeout(h,0):(o=function(){document.removeEventListener("DOMContentLoaded",o,!1),h()},document.addEventListener("DOMContentLoaded",o,!1)):document.attachEvent&&(i=h,m=l.document,v=!1,n(),m.onreadystatechange=function(){"complete"==m.readyState&&(m.onreadystatechange=null,t())})}function t(){v||(v=!0,i())}function n(){try{m.documentElement.doScroll("left")}catch(a){return void setTimeout(n,50)}t()}}(window); \ No newline at end of file diff --git a/src/assets/css/font/iconfont.ttf b/src/assets/css/font/iconfont.ttf index 27d62d61..d5276429 100644 Binary files a/src/assets/css/font/iconfont.ttf and b/src/assets/css/font/iconfont.ttf differ diff --git a/src/assets/css/font/iconfont.woff b/src/assets/css/font/iconfont.woff index 80baf7fe..4d92327d 100644 Binary files a/src/assets/css/font/iconfont.woff and b/src/assets/css/font/iconfont.woff differ diff --git a/src/assets/css/font/iconfont.woff2 b/src/assets/css/font/iconfont.woff2 index 7c08b826..e92b0204 100644 Binary files a/src/assets/css/font/iconfont.woff2 and b/src/assets/css/font/iconfont.woff2 differ diff --git a/src/utils/tools.js b/src/utils/tools.js index 4ce5f31b..ca3ce7d7 100644 --- a/src/utils/tools.js +++ b/src/utils/tools.js @@ -1253,3 +1253,21 @@ export function getWidthByLanguage (language) { } } } + +export function selectElementText (el) { + const range = document.createRange() // create new range object + range.selectNodeContents(el) // set range to encompass desired element text + const selection = window.getSelection() // get Selection object from currently user selected text + selection.removeAllRanges() // unselect any user selected text (if any) + selection.addRange(range) // add range to Selection object to select it +} + +export function copySelectionText () { + let copySuccess // var to check whether execCommand successfully executed + try { + copySuccess = document.execCommand('copy') // run command to copy selected text to clipboard + } catch (e) { + copySuccess = false + } + return copySuccess +} diff --git a/src/views/charts2/charts/entityDetail/EntityDetailBasicInfo.vue b/src/views/charts2/charts/entityDetail/EntityDetailBasicInfo.vue index ca76809c..3234a846 100644 --- a/src/views/charts2/charts/entityDetail/EntityDetailBasicInfo.vue +++ b/src/views/charts2/charts/entityDetail/EntityDetailBasicInfo.vue @@ -1,12 +1,351 @@ - {{entity}} + + {{entityType[entity.entityType]}} + + + {{entity.entityName}} + + + + + {{$t('overall.analysis')}} + + + {{$t('entities.fastEntry')}} + + + + + + {{item.label}} + + + + + + + {{tag.value}} + + + + + + + + {{card.label}}: + {{card.value}} + + + + +