mirror of https://github.com/veops/cmdb.git
feat(ui): topology view (#525)
This commit is contained in:
pycook
GitHub
parent
2d3a290aa3
commit
729a616282
|
|
@ -54,6 +54,252 @@
|
||||||
<div class="content unicode" style="display: block;">
|
<div class="content unicode" style="display: block;">
|
||||||
<ul class="icon_lists dib-box">
|
<ul class="icon_lists dib-box">
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">ops-topology_view</div>
|
||||||
|
<div class="code-name">&#xe92b;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">monitor-host_analysis</div>
|
||||||
|
<div class="code-name">&#xe92a;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">monitor-add2</div>
|
||||||
|
<div class="code-name">&#xe929;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">monitor-native</div>
|
||||||
|
<div class="code-name">&#xe928;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">veops-filter2</div>
|
||||||
|
<div class="code-name">&#xe927;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">ops-cmdb-data_companies-selected</div>
|
||||||
|
<div class="code-name">&#xe601;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">ops-cmdb-data_companies</div>
|
||||||
|
<div class="code-name">&#xe926;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">monitor-threshold_value</div>
|
||||||
|
<div class="code-name">&#xe921;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">monitor-disposition</div>
|
||||||
|
<div class="code-name">&#xe922;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">monitor-automatic_discovery</div>
|
||||||
|
<div class="code-name">&#xe923;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">monitor-grouping_list</div>
|
||||||
|
<div class="code-name">&#xe924;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">monitor-node_list</div>
|
||||||
|
<div class="code-name">&#xe925;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">monitor-general_view</div>
|
||||||
|
<div class="code-name">&#xe920;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">monitor-network_topology</div>
|
||||||
|
<div class="code-name">&#xe91b;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">monitor-node_management</div>
|
||||||
|
<div class="code-name">&#xe91c;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">monitor-alarm_policy</div>
|
||||||
|
<div class="code-name">&#xe91d;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">monitor-alarm</div>
|
||||||
|
<div class="code-name">&#xe91e;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">monitor-healing</div>
|
||||||
|
<div class="code-name">&#xe91f;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">monitor-data_acquisition</div>
|
||||||
|
<div class="code-name">&#xe8d4;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">monitor-analysis</div>
|
||||||
|
<div class="code-name">&#xe91a;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">monitor-index</div>
|
||||||
|
<div class="code-name">&#xe89b;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">monitor-user_defined</div>
|
||||||
|
<div class="code-name">&#xe867;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">monitor-database</div>
|
||||||
|
<div class="code-name">&#xe861;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">monitor-common</div>
|
||||||
|
<div class="code-name">&#xe865;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">veops-edit</div>
|
||||||
|
<div class="code-name">&#xe866;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">veops-empower</div>
|
||||||
|
<div class="code-name">&#xe863;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">veops-share</div>
|
||||||
|
<div class="code-name">&#xe864;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">veops-export</div>
|
||||||
|
<div class="code-name">&#xe862;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">veops-import</div>
|
||||||
|
<div class="code-name">&#xe860;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">monitor-ip (1)</div>
|
||||||
|
<div class="code-name">&#xe807;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">monitor-director</div>
|
||||||
|
<div class="code-name">&#xe803;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">monitor-host</div>
|
||||||
|
<div class="code-name">&#xe804;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">cmdb-log</div>
|
||||||
|
<div class="code-name">&#xe802;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">monitor-add</div>
|
||||||
|
<div class="code-name">&#xe7ff;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">monitor-down</div>
|
||||||
|
<div class="code-name">&#xe7fc;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">monitor-up</div>
|
||||||
|
<div class="code-name">&#xe7fd;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">itsm-unfold</div>
|
||||||
|
<div class="code-name">&#xe7f9;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">itsm-shrink</div>
|
||||||
|
<div class="code-name">&#xe7f8;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">monitor-data_comaparison2</div>
|
||||||
|
<div class="code-name">&#xe7a1;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">monitor-data_comaparison1</div>
|
||||||
|
<div class="code-name">&#xe7f7;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont"></span>
|
||||||
|
<div class="name">monitor-online</div>
|
||||||
|
<div class="code-name">&#xe7a0;</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
<li class="dib">
|
<li class="dib">
|
||||||
<span class="icon iconfont"></span>
|
<span class="icon iconfont"></span>
|
||||||
<div class="name">ops-setting-application-selected</div>
|
<div class="name">ops-setting-application-selected</div>
|
||||||
|
|
@ -4620,9 +4866,9 @@
|
||||||
<pre><code class="language-css"
|
<pre><code class="language-css"
|
||||||
>@font-face {
|
>@font-face {
|
||||||
font-family: 'iconfont';
|
font-family: 'iconfont';
|
||||||
src: url('iconfont.woff2?t=1713840593232') format('woff2'),
|
src: url('iconfont.woff2?t=1716896994700') format('woff2'),
|
||||||
url('iconfont.woff?t=1713840593232') format('woff'),
|
url('iconfont.woff?t=1716896994700') format('woff'),
|
||||||
url('iconfont.ttf?t=1713840593232') format('truetype');
|
url('iconfont.ttf?t=1716896994700') format('truetype');
|
||||||
}
|
}
|
||||||
</code></pre>
|
</code></pre>
|
||||||
<h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
|
<h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
|
||||||
|
|
@ -4648,6 +4894,375 @@
|
||||||
<div class="content font-class">
|
<div class="content font-class">
|
||||||
<ul class="icon_lists dib-box">
|
<ul class="icon_lists dib-box">
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont ops-topology_view"></span>
|
||||||
|
<div class="name">
|
||||||
|
ops-topology_view
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.ops-topology_view
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont monitor-host_analysis"></span>
|
||||||
|
<div class="name">
|
||||||
|
monitor-host_analysis
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.monitor-host_analysis
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont a-Group427319324"></span>
|
||||||
|
<div class="name">
|
||||||
|
monitor-add2
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.a-Group427319324
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont monitor-native"></span>
|
||||||
|
<div class="name">
|
||||||
|
monitor-native
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.monitor-native
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont veops-filter2"></span>
|
||||||
|
<div class="name">
|
||||||
|
veops-filter2
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.veops-filter2
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont ops-cmdb-data_companies-selected"></span>
|
||||||
|
<div class="name">
|
||||||
|
ops-cmdb-data_companies-selected
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.ops-cmdb-data_companies-selected
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont ops-cmdb-data_companies"></span>
|
||||||
|
<div class="name">
|
||||||
|
ops-cmdb-data_companies
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.ops-cmdb-data_companies
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont monitor-threshold_value"></span>
|
||||||
|
<div class="name">
|
||||||
|
monitor-threshold_value
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.monitor-threshold_value
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont monitor-disposition"></span>
|
||||||
|
<div class="name">
|
||||||
|
monitor-disposition
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.monitor-disposition
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont monitor-automatic_discovery"></span>
|
||||||
|
<div class="name">
|
||||||
|
monitor-automatic_discovery
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.monitor-automatic_discovery
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont monitor-grouping_list"></span>
|
||||||
|
<div class="name">
|
||||||
|
monitor-grouping_list
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.monitor-grouping_list
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont monitor-node_list"></span>
|
||||||
|
<div class="name">
|
||||||
|
monitor-node_list
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.monitor-node_list
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont monitor-general_view"></span>
|
||||||
|
<div class="name">
|
||||||
|
monitor-general_view
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.monitor-general_view
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont monitor-network_topology"></span>
|
||||||
|
<div class="name">
|
||||||
|
monitor-network_topology
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.monitor-network_topology
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont monitor-node_management"></span>
|
||||||
|
<div class="name">
|
||||||
|
monitor-node_management
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.monitor-node_management
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont monitor-alarm_policy"></span>
|
||||||
|
<div class="name">
|
||||||
|
monitor-alarm_policy
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.monitor-alarm_policy
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont monitor-alarm"></span>
|
||||||
|
<div class="name">
|
||||||
|
monitor-alarm
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.monitor-alarm
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont monitor-healing"></span>
|
||||||
|
<div class="name">
|
||||||
|
monitor-healing
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.monitor-healing
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont monitor-data_acquisition"></span>
|
||||||
|
<div class="name">
|
||||||
|
monitor-data_acquisition
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.monitor-data_acquisition
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont monitor-analysis"></span>
|
||||||
|
<div class="name">
|
||||||
|
monitor-analysis
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.monitor-analysis
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont monitor-index"></span>
|
||||||
|
<div class="name">
|
||||||
|
monitor-index
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.monitor-index
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont monitor-user_defined"></span>
|
||||||
|
<div class="name">
|
||||||
|
monitor-user_defined
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.monitor-user_defined
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont monitor-database"></span>
|
||||||
|
<div class="name">
|
||||||
|
monitor-database
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.monitor-database
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont monitor-common"></span>
|
||||||
|
<div class="name">
|
||||||
|
monitor-common
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.monitor-common
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont veops-edit"></span>
|
||||||
|
<div class="name">
|
||||||
|
veops-edit
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.veops-edit
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont veops-empower"></span>
|
||||||
|
<div class="name">
|
||||||
|
veops-empower
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.veops-empower
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont veops-share"></span>
|
||||||
|
<div class="name">
|
||||||
|
veops-share
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.veops-share
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont veops-export"></span>
|
||||||
|
<div class="name">
|
||||||
|
veops-export
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.veops-export
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont a-veops-import1"></span>
|
||||||
|
<div class="name">
|
||||||
|
veops-import
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.a-veops-import1
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont monitor-ip"></span>
|
||||||
|
<div class="name">
|
||||||
|
monitor-ip (1)
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.monitor-ip
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont monitor-director"></span>
|
||||||
|
<div class="name">
|
||||||
|
monitor-director
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.monitor-director
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont monitor-host"></span>
|
||||||
|
<div class="name">
|
||||||
|
monitor-host
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.monitor-host
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont a-cmdb-log1"></span>
|
||||||
|
<div class="name">
|
||||||
|
cmdb-log
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.a-cmdb-log1
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont monitor-add"></span>
|
||||||
|
<div class="name">
|
||||||
|
monitor-add
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.monitor-add
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont monitor-down"></span>
|
||||||
|
<div class="name">
|
||||||
|
monitor-down
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.monitor-down
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont monitor-up"></span>
|
||||||
|
<div class="name">
|
||||||
|
monitor-up
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.monitor-up
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont itsm-unfold"></span>
|
||||||
|
<div class="name">
|
||||||
|
itsm-unfold
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.itsm-unfold
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont itsm-stretch"></span>
|
||||||
|
<div class="name">
|
||||||
|
itsm-shrink
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.itsm-stretch
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont monitor-data_comaparison2"></span>
|
||||||
|
<div class="name">
|
||||||
|
monitor-data_comaparison2
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.monitor-data_comaparison2
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont monitor-data_comaparison1"></span>
|
||||||
|
<div class="name">
|
||||||
|
monitor-data_comaparison1
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.monitor-data_comaparison1
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<span class="icon iconfont a-monitor-online1"></span>
|
||||||
|
<div class="name">
|
||||||
|
monitor-online
|
||||||
|
</div>
|
||||||
|
<div class="code-name">.a-monitor-online1
|
||||||
|
</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
<li class="dib">
|
<li class="dib">
|
||||||
<span class="icon iconfont ops-setting-application-selected"></span>
|
<span class="icon iconfont ops-setting-application-selected"></span>
|
||||||
<div class="name">
|
<div class="name">
|
||||||
|
|
@ -11497,6 +12112,334 @@
|
||||||
<div class="content symbol">
|
<div class="content symbol">
|
||||||
<ul class="icon_lists dib-box">
|
<ul class="icon_lists dib-box">
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#ops-topology_view"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">ops-topology_view</div>
|
||||||
|
<div class="code-name">#ops-topology_view</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#monitor-host_analysis"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">monitor-host_analysis</div>
|
||||||
|
<div class="code-name">#monitor-host_analysis</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#a-Group427319324"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">monitor-add2</div>
|
||||||
|
<div class="code-name">#a-Group427319324</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#monitor-native"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">monitor-native</div>
|
||||||
|
<div class="code-name">#monitor-native</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#veops-filter2"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">veops-filter2</div>
|
||||||
|
<div class="code-name">#veops-filter2</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#ops-cmdb-data_companies-selected"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">ops-cmdb-data_companies-selected</div>
|
||||||
|
<div class="code-name">#ops-cmdb-data_companies-selected</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#ops-cmdb-data_companies"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">ops-cmdb-data_companies</div>
|
||||||
|
<div class="code-name">#ops-cmdb-data_companies</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#monitor-threshold_value"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">monitor-threshold_value</div>
|
||||||
|
<div class="code-name">#monitor-threshold_value</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#monitor-disposition"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">monitor-disposition</div>
|
||||||
|
<div class="code-name">#monitor-disposition</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#monitor-automatic_discovery"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">monitor-automatic_discovery</div>
|
||||||
|
<div class="code-name">#monitor-automatic_discovery</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#monitor-grouping_list"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">monitor-grouping_list</div>
|
||||||
|
<div class="code-name">#monitor-grouping_list</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#monitor-node_list"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">monitor-node_list</div>
|
||||||
|
<div class="code-name">#monitor-node_list</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#monitor-general_view"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">monitor-general_view</div>
|
||||||
|
<div class="code-name">#monitor-general_view</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#monitor-network_topology"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">monitor-network_topology</div>
|
||||||
|
<div class="code-name">#monitor-network_topology</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#monitor-node_management"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">monitor-node_management</div>
|
||||||
|
<div class="code-name">#monitor-node_management</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#monitor-alarm_policy"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">monitor-alarm_policy</div>
|
||||||
|
<div class="code-name">#monitor-alarm_policy</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#monitor-alarm"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">monitor-alarm</div>
|
||||||
|
<div class="code-name">#monitor-alarm</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#monitor-healing"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">monitor-healing</div>
|
||||||
|
<div class="code-name">#monitor-healing</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#monitor-data_acquisition"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">monitor-data_acquisition</div>
|
||||||
|
<div class="code-name">#monitor-data_acquisition</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#monitor-analysis"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">monitor-analysis</div>
|
||||||
|
<div class="code-name">#monitor-analysis</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#monitor-index"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">monitor-index</div>
|
||||||
|
<div class="code-name">#monitor-index</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#monitor-user_defined"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">monitor-user_defined</div>
|
||||||
|
<div class="code-name">#monitor-user_defined</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#monitor-database"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">monitor-database</div>
|
||||||
|
<div class="code-name">#monitor-database</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#monitor-common"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">monitor-common</div>
|
||||||
|
<div class="code-name">#monitor-common</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#veops-edit"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">veops-edit</div>
|
||||||
|
<div class="code-name">#veops-edit</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#veops-empower"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">veops-empower</div>
|
||||||
|
<div class="code-name">#veops-empower</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#veops-share"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">veops-share</div>
|
||||||
|
<div class="code-name">#veops-share</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#veops-export"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">veops-export</div>
|
||||||
|
<div class="code-name">#veops-export</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#a-veops-import1"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">veops-import</div>
|
||||||
|
<div class="code-name">#a-veops-import1</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#monitor-ip"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">monitor-ip (1)</div>
|
||||||
|
<div class="code-name">#monitor-ip</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#monitor-director"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">monitor-director</div>
|
||||||
|
<div class="code-name">#monitor-director</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#monitor-host"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">monitor-host</div>
|
||||||
|
<div class="code-name">#monitor-host</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#a-cmdb-log1"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">cmdb-log</div>
|
||||||
|
<div class="code-name">#a-cmdb-log1</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#monitor-add"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">monitor-add</div>
|
||||||
|
<div class="code-name">#monitor-add</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#monitor-down"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">monitor-down</div>
|
||||||
|
<div class="code-name">#monitor-down</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#monitor-up"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">monitor-up</div>
|
||||||
|
<div class="code-name">#monitor-up</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#itsm-unfold"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">itsm-unfold</div>
|
||||||
|
<div class="code-name">#itsm-unfold</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#itsm-stretch"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">itsm-shrink</div>
|
||||||
|
<div class="code-name">#itsm-stretch</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#monitor-data_comaparison2"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">monitor-data_comaparison2</div>
|
||||||
|
<div class="code-name">#monitor-data_comaparison2</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#monitor-data_comaparison1"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">monitor-data_comaparison1</div>
|
||||||
|
<div class="code-name">#monitor-data_comaparison1</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
|
<li class="dib">
|
||||||
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
|
<use xlink:href="#a-monitor-online1"></use>
|
||||||
|
</svg>
|
||||||
|
<div class="name">monitor-online</div>
|
||||||
|
<div class="code-name">#a-monitor-online1</div>
|
||||||
|
</li>
|
||||||
|
|
||||||
<li class="dib">
|
<li class="dib">
|
||||||
<svg class="icon svg-icon" aria-hidden="true">
|
<svg class="icon svg-icon" aria-hidden="true">
|
||||||
<use xlink:href="#ops-setting-application-selected"></use>
|
<use xlink:href="#ops-setting-application-selected"></use>
|
||||||
|
|
|
||||||
|
|
@ -1,8 +1,8 @@
|
||||||
@font-face {
|
@font-face {
|
||||||
font-family: "iconfont"; /* Project id 3857903 */
|
font-family: "iconfont"; /* Project id 3857903 */
|
||||||
src: url('iconfont.woff2?t=1713840593232') format('woff2'),
|
src: url('iconfont.woff2?t=1716896994700') format('woff2'),
|
||||||
url('iconfont.woff?t=1713840593232') format('woff'),
|
url('iconfont.woff?t=1716896994700') format('woff'),
|
||||||
url('iconfont.ttf?t=1713840593232') format('truetype');
|
url('iconfont.ttf?t=1716896994700') format('truetype');
|
||||||
}
|
}
|
||||||
|
|
||||||
.iconfont {
|
.iconfont {
|
||||||
|
|
@ -13,6 +13,170 @@
|
||||||
-moz-osx-font-smoothing: grayscale;
|
-moz-osx-font-smoothing: grayscale;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
.ops-topology_view:before {
|
||||||
|
content: "\e92b";
|
||||||
|
}
|
||||||
|
|
||||||
|
.monitor-host_analysis:before {
|
||||||
|
content: "\e92a";
|
||||||
|
}
|
||||||
|
|
||||||
|
.a-Group427319324:before {
|
||||||
|
content: "\e929";
|
||||||
|
}
|
||||||
|
|
||||||
|
.monitor-native:before {
|
||||||
|
content: "\e928";
|
||||||
|
}
|
||||||
|
|
||||||
|
.veops-filter2:before {
|
||||||
|
content: "\e927";
|
||||||
|
}
|
||||||
|
|
||||||
|
.ops-cmdb-data_companies-selected:before {
|
||||||
|
content: "\e601";
|
||||||
|
}
|
||||||
|
|
||||||
|
.ops-cmdb-data_companies:before {
|
||||||
|
content: "\e926";
|
||||||
|
}
|
||||||
|
|
||||||
|
.monitor-threshold_value:before {
|
||||||
|
content: "\e921";
|
||||||
|
}
|
||||||
|
|
||||||
|
.monitor-disposition:before {
|
||||||
|
content: "\e922";
|
||||||
|
}
|
||||||
|
|
||||||
|
.monitor-automatic_discovery:before {
|
||||||
|
content: "\e923";
|
||||||
|
}
|
||||||
|
|
||||||
|
.monitor-grouping_list:before {
|
||||||
|
content: "\e924";
|
||||||
|
}
|
||||||
|
|
||||||
|
.monitor-node_list:before {
|
||||||
|
content: "\e925";
|
||||||
|
}
|
||||||
|
|
||||||
|
.monitor-general_view:before {
|
||||||
|
content: "\e920";
|
||||||
|
}
|
||||||
|
|
||||||
|
.monitor-network_topology:before {
|
||||||
|
content: "\e91b";
|
||||||
|
}
|
||||||
|
|
||||||
|
.monitor-node_management:before {
|
||||||
|
content: "\e91c";
|
||||||
|
}
|
||||||
|
|
||||||
|
.monitor-alarm_policy:before {
|
||||||
|
content: "\e91d";
|
||||||
|
}
|
||||||
|
|
||||||
|
.monitor-alarm:before {
|
||||||
|
content: "\e91e";
|
||||||
|
}
|
||||||
|
|
||||||
|
.monitor-healing:before {
|
||||||
|
content: "\e91f";
|
||||||
|
}
|
||||||
|
|
||||||
|
.monitor-data_acquisition:before {
|
||||||
|
content: "\e8d4";
|
||||||
|
}
|
||||||
|
|
||||||
|
.monitor-analysis:before {
|
||||||
|
content: "\e91a";
|
||||||
|
}
|
||||||
|
|
||||||
|
.monitor-index:before {
|
||||||
|
content: "\e89b";
|
||||||
|
}
|
||||||
|
|
||||||
|
.monitor-user_defined:before {
|
||||||
|
content: "\e867";
|
||||||
|
}
|
||||||
|
|
||||||
|
.monitor-database:before {
|
||||||
|
content: "\e861";
|
||||||
|
}
|
||||||
|
|
||||||
|
.monitor-common:before {
|
||||||
|
content: "\e865";
|
||||||
|
}
|
||||||
|
|
||||||
|
.veops-edit:before {
|
||||||
|
content: "\e866";
|
||||||
|
}
|
||||||
|
|
||||||
|
.veops-empower:before {
|
||||||
|
content: "\e863";
|
||||||
|
}
|
||||||
|
|
||||||
|
.veops-share:before {
|
||||||
|
content: "\e864";
|
||||||
|
}
|
||||||
|
|
||||||
|
.veops-export:before {
|
||||||
|
content: "\e862";
|
||||||
|
}
|
||||||
|
|
||||||
|
.a-veops-import1:before {
|
||||||
|
content: "\e860";
|
||||||
|
}
|
||||||
|
|
||||||
|
.monitor-ip:before {
|
||||||
|
content: "\e807";
|
||||||
|
}
|
||||||
|
|
||||||
|
.monitor-director:before {
|
||||||
|
content: "\e803";
|
||||||
|
}
|
||||||
|
|
||||||
|
.monitor-host:before {
|
||||||
|
content: "\e804";
|
||||||
|
}
|
||||||
|
|
||||||
|
.a-cmdb-log1:before {
|
||||||
|
content: "\e802";
|
||||||
|
}
|
||||||
|
|
||||||
|
.monitor-add:before {
|
||||||
|
content: "\e7ff";
|
||||||
|
}
|
||||||
|
|
||||||
|
.monitor-down:before {
|
||||||
|
content: "\e7fc";
|
||||||
|
}
|
||||||
|
|
||||||
|
.monitor-up:before {
|
||||||
|
content: "\e7fd";
|
||||||
|
}
|
||||||
|
|
||||||
|
.itsm-unfold:before {
|
||||||
|
content: "\e7f9";
|
||||||
|
}
|
||||||
|
|
||||||
|
.itsm-stretch:before {
|
||||||
|
content: "\e7f8";
|
||||||
|
}
|
||||||
|
|
||||||
|
.monitor-data_comaparison2:before {
|
||||||
|
content: "\e7a1";
|
||||||
|
}
|
||||||
|
|
||||||
|
.monitor-data_comaparison1:before {
|
||||||
|
content: "\e7f7";
|
||||||
|
}
|
||||||
|
|
||||||
|
.a-monitor-online1:before {
|
||||||
|
content: "\e7a0";
|
||||||
|
}
|
||||||
|
|
||||||
.ops-setting-application-selected:before {
|
.ops-setting-application-selected:before {
|
||||||
content: "\e919";
|
content: "\e919";
|
||||||
}
|
}
|
||||||
|
|
|
||||||
File diff suppressed because one or more lines are too long
|
|
@ -5,6 +5,293 @@
|
||||||
"css_prefix_text": "",
|
"css_prefix_text": "",
|
||||||
"description": "",
|
"description": "",
|
||||||
"glyphs": [
|
"glyphs": [
|
||||||
|
{
|
||||||
|
"icon_id": "40499246",
|
||||||
|
"name": "ops-topology_view",
|
||||||
|
"font_class": "ops-topology_view",
|
||||||
|
"unicode": "e92b",
|
||||||
|
"unicode_decimal": 59691
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "40411336",
|
||||||
|
"name": "monitor-host_analysis",
|
||||||
|
"font_class": "monitor-host_analysis",
|
||||||
|
"unicode": "e92a",
|
||||||
|
"unicode_decimal": 59690
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "40372105",
|
||||||
|
"name": "monitor-add2",
|
||||||
|
"font_class": "a-Group427319324",
|
||||||
|
"unicode": "e929",
|
||||||
|
"unicode_decimal": 59689
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "40368097",
|
||||||
|
"name": "monitor-native",
|
||||||
|
"font_class": "monitor-native",
|
||||||
|
"unicode": "e928",
|
||||||
|
"unicode_decimal": 59688
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "40357355",
|
||||||
|
"name": "veops-filter2",
|
||||||
|
"font_class": "veops-filter2",
|
||||||
|
"unicode": "e927",
|
||||||
|
"unicode_decimal": 59687
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "40356229",
|
||||||
|
"name": "ops-cmdb-data_companies-selected",
|
||||||
|
"font_class": "ops-cmdb-data_companies-selected",
|
||||||
|
"unicode": "e601",
|
||||||
|
"unicode_decimal": 58881
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "40343814",
|
||||||
|
"name": "ops-cmdb-data_companies",
|
||||||
|
"font_class": "ops-cmdb-data_companies",
|
||||||
|
"unicode": "e926",
|
||||||
|
"unicode_decimal": 59686
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "40326916",
|
||||||
|
"name": "monitor-threshold_value",
|
||||||
|
"font_class": "monitor-threshold_value",
|
||||||
|
"unicode": "e921",
|
||||||
|
"unicode_decimal": 59681
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "40326913",
|
||||||
|
"name": "monitor-disposition",
|
||||||
|
"font_class": "monitor-disposition",
|
||||||
|
"unicode": "e922",
|
||||||
|
"unicode_decimal": 59682
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "40326911",
|
||||||
|
"name": "monitor-automatic_discovery",
|
||||||
|
"font_class": "monitor-automatic_discovery",
|
||||||
|
"unicode": "e923",
|
||||||
|
"unicode_decimal": 59683
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "40326907",
|
||||||
|
"name": "monitor-grouping_list",
|
||||||
|
"font_class": "monitor-grouping_list",
|
||||||
|
"unicode": "e924",
|
||||||
|
"unicode_decimal": 59684
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "40326906",
|
||||||
|
"name": "monitor-node_list",
|
||||||
|
"font_class": "monitor-node_list",
|
||||||
|
"unicode": "e925",
|
||||||
|
"unicode_decimal": 59685
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "40326667",
|
||||||
|
"name": "monitor-general_view",
|
||||||
|
"font_class": "monitor-general_view",
|
||||||
|
"unicode": "e920",
|
||||||
|
"unicode_decimal": 59680
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "40326683",
|
||||||
|
"name": "monitor-network_topology",
|
||||||
|
"font_class": "monitor-network_topology",
|
||||||
|
"unicode": "e91b",
|
||||||
|
"unicode_decimal": 59675
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "40326682",
|
||||||
|
"name": "monitor-node_management",
|
||||||
|
"font_class": "monitor-node_management",
|
||||||
|
"unicode": "e91c",
|
||||||
|
"unicode_decimal": 59676
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "40326681",
|
||||||
|
"name": "monitor-alarm_policy",
|
||||||
|
"font_class": "monitor-alarm_policy",
|
||||||
|
"unicode": "e91d",
|
||||||
|
"unicode_decimal": 59677
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "40326680",
|
||||||
|
"name": "monitor-alarm",
|
||||||
|
"font_class": "monitor-alarm",
|
||||||
|
"unicode": "e91e",
|
||||||
|
"unicode_decimal": 59678
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "40326679",
|
||||||
|
"name": "monitor-healing",
|
||||||
|
"font_class": "monitor-healing",
|
||||||
|
"unicode": "e91f",
|
||||||
|
"unicode_decimal": 59679
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "40326685",
|
||||||
|
"name": "monitor-data_acquisition",
|
||||||
|
"font_class": "monitor-data_acquisition",
|
||||||
|
"unicode": "e8d4",
|
||||||
|
"unicode_decimal": 59604
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "40326684",
|
||||||
|
"name": "monitor-analysis",
|
||||||
|
"font_class": "monitor-analysis",
|
||||||
|
"unicode": "e91a",
|
||||||
|
"unicode_decimal": 59674
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "40308359",
|
||||||
|
"name": "monitor-index",
|
||||||
|
"font_class": "monitor-index",
|
||||||
|
"unicode": "e89b",
|
||||||
|
"unicode_decimal": 59547
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "40307829",
|
||||||
|
"name": "monitor-user_defined",
|
||||||
|
"font_class": "monitor-user_defined",
|
||||||
|
"unicode": "e867",
|
||||||
|
"unicode_decimal": 59495
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "40307835",
|
||||||
|
"name": "monitor-database",
|
||||||
|
"font_class": "monitor-database",
|
||||||
|
"unicode": "e861",
|
||||||
|
"unicode_decimal": 59489
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "40307833",
|
||||||
|
"name": "monitor-common",
|
||||||
|
"font_class": "monitor-common",
|
||||||
|
"unicode": "e865",
|
||||||
|
"unicode_decimal": 59493
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "40307035",
|
||||||
|
"name": "veops-edit",
|
||||||
|
"font_class": "veops-edit",
|
||||||
|
"unicode": "e866",
|
||||||
|
"unicode_decimal": 59494
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "40307027",
|
||||||
|
"name": "veops-empower",
|
||||||
|
"font_class": "veops-empower",
|
||||||
|
"unicode": "e863",
|
||||||
|
"unicode_decimal": 59491
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "40307026",
|
||||||
|
"name": "veops-share",
|
||||||
|
"font_class": "veops-share",
|
||||||
|
"unicode": "e864",
|
||||||
|
"unicode_decimal": 59492
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "40306997",
|
||||||
|
"name": "veops-export",
|
||||||
|
"font_class": "veops-export",
|
||||||
|
"unicode": "e862",
|
||||||
|
"unicode_decimal": 59490
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "40306881",
|
||||||
|
"name": "veops-import",
|
||||||
|
"font_class": "a-veops-import1",
|
||||||
|
"unicode": "e860",
|
||||||
|
"unicode_decimal": 59488
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "40262335",
|
||||||
|
"name": "monitor-ip (1)",
|
||||||
|
"font_class": "monitor-ip",
|
||||||
|
"unicode": "e807",
|
||||||
|
"unicode_decimal": 59399
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "40262337",
|
||||||
|
"name": "monitor-director",
|
||||||
|
"font_class": "monitor-director",
|
||||||
|
"unicode": "e803",
|
||||||
|
"unicode_decimal": 59395
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "40262336",
|
||||||
|
"name": "monitor-host",
|
||||||
|
"font_class": "monitor-host",
|
||||||
|
"unicode": "e804",
|
||||||
|
"unicode_decimal": 59396
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "40262216",
|
||||||
|
"name": "cmdb-log",
|
||||||
|
"font_class": "a-cmdb-log1",
|
||||||
|
"unicode": "e802",
|
||||||
|
"unicode_decimal": 59394
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "40261712",
|
||||||
|
"name": "monitor-add",
|
||||||
|
"font_class": "monitor-add",
|
||||||
|
"unicode": "e7ff",
|
||||||
|
"unicode_decimal": 59391
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "40248186",
|
||||||
|
"name": "monitor-down",
|
||||||
|
"font_class": "monitor-down",
|
||||||
|
"unicode": "e7fc",
|
||||||
|
"unicode_decimal": 59388
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "40248184",
|
||||||
|
"name": "monitor-up",
|
||||||
|
"font_class": "monitor-up",
|
||||||
|
"unicode": "e7fd",
|
||||||
|
"unicode_decimal": 59389
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "40235502",
|
||||||
|
"name": "itsm-unfold",
|
||||||
|
"font_class": "itsm-unfold",
|
||||||
|
"unicode": "e7f9",
|
||||||
|
"unicode_decimal": 59385
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "40235453",
|
||||||
|
"name": "itsm-shrink",
|
||||||
|
"font_class": "itsm-stretch",
|
||||||
|
"unicode": "e7f8",
|
||||||
|
"unicode_decimal": 59384
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "40217123",
|
||||||
|
"name": "monitor-data_comaparison2",
|
||||||
|
"font_class": "monitor-data_comaparison2",
|
||||||
|
"unicode": "e7a1",
|
||||||
|
"unicode_decimal": 59297
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "40217122",
|
||||||
|
"name": "monitor-data_comaparison1",
|
||||||
|
"font_class": "monitor-data_comaparison1",
|
||||||
|
"unicode": "e7f7",
|
||||||
|
"unicode_decimal": 59383
|
||||||
|
},
|
||||||
|
{
|
||||||
|
"icon_id": "40176936",
|
||||||
|
"name": "monitor-online",
|
||||||
|
"font_class": "a-monitor-online1",
|
||||||
|
"unicode": "e7a0",
|
||||||
|
"unicode_decimal": 59296
|
||||||
|
},
|
||||||
{
|
{
|
||||||
"icon_id": "40043662",
|
"icon_id": "40043662",
|
||||||
"name": "ops-setting-application-selected",
|
"name": "ops-setting-application-selected",
|
||||||
|
|
|
||||||
Binary file not shown.
Binary file not shown.
Binary file not shown.
|
|
@ -2,11 +2,12 @@ import { axios } from '@/utils/request'
|
||||||
|
|
||||||
const urlPrefix = '/v0.1'
|
const urlPrefix = '/v0.1'
|
||||||
|
|
||||||
export function searchCI(params) {
|
export function searchCI(params, isShowMessage = true) {
|
||||||
return axios({
|
return axios({
|
||||||
url: urlPrefix + `/ci/s`,
|
url: urlPrefix + `/ci/s`,
|
||||||
method: 'GET',
|
method: 'GET',
|
||||||
params: params
|
params: params,
|
||||||
|
isShowMessage
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,110 @@
|
||||||
|
import { axios } from '@/utils/request'
|
||||||
|
|
||||||
|
const urlPrefix = '/v0.1'
|
||||||
|
|
||||||
|
export function getTopoGroups() {
|
||||||
|
return axios({
|
||||||
|
url: `${urlPrefix}/topology_views`,
|
||||||
|
method: 'GET',
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export function getTopoView(_id) {
|
||||||
|
return axios({
|
||||||
|
url: `${urlPrefix}/topology_views/${_id}`,
|
||||||
|
method: 'GET',
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export function postTopoGroup(data) {
|
||||||
|
return axios({
|
||||||
|
url: `${urlPrefix}/topology_views/groups`,
|
||||||
|
method: 'POST',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export function putTopoGroupByGId(gid, data) {
|
||||||
|
return axios({
|
||||||
|
url: `${urlPrefix}/topology_views/groups/${gid}`,
|
||||||
|
method: 'PUT',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export function putTopoGroupsOrder(data) {
|
||||||
|
return axios({
|
||||||
|
url: `${urlPrefix}/topology_views/groups/order`,
|
||||||
|
method: 'PUT',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export function deleteTopoGroup(gid, data) {
|
||||||
|
return axios({
|
||||||
|
url: `${urlPrefix}/topology_views/groups/${gid}`,
|
||||||
|
method: 'DELETE',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export function addTopoView(data) {
|
||||||
|
return axios({
|
||||||
|
url: `${urlPrefix}/topology_views`,
|
||||||
|
method: 'POST',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export function updateTopoView(_id, data) {
|
||||||
|
return axios({
|
||||||
|
url: `${urlPrefix}/topology_views/${_id}`,
|
||||||
|
method: 'PUT',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export function deleteTopoView(_id) {
|
||||||
|
return axios({
|
||||||
|
url: `${urlPrefix}/topology_views/${_id}`,
|
||||||
|
method: 'DELETE',
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export function getRelationsByTypeId(_id) {
|
||||||
|
return axios({
|
||||||
|
url: `${urlPrefix}/topology_views/relations/ci_types/${_id}`,
|
||||||
|
method: 'GET',
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export function previewTopoView(params) {
|
||||||
|
return axios({
|
||||||
|
url: `${urlPrefix}/topology_views/preview`,
|
||||||
|
method: 'POST',
|
||||||
|
data: params,
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export function showTopoView(_id) {
|
||||||
|
return axios({
|
||||||
|
url: `${urlPrefix}/topology_views/${_id}/view`,
|
||||||
|
method: 'GET',
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export function grantTopologyView(viewId, rid, data) {
|
||||||
|
return axios({
|
||||||
|
url: `/v0.1/topology_views/${viewId}/roles/${rid}/grant`,
|
||||||
|
method: 'POST',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
||||||
|
export function revokeTopologyView(viewId, rid, data) {
|
||||||
|
return axios({
|
||||||
|
url: `/v0.1/topology_views/${viewId}/roles/${rid}/revoke`,
|
||||||
|
method: 'POST',
|
||||||
|
data: data
|
||||||
|
})
|
||||||
|
}
|
||||||
|
|
@ -57,6 +57,20 @@
|
||||||
:addedRids="addedRids"
|
:addedRids="addedRids"
|
||||||
/>
|
/>
|
||||||
</template>
|
</template>
|
||||||
|
<template v-if="cmdbGrantType.includes('TopologyView')">
|
||||||
|
<div class="cmdb-grant-title">{{ resourceTypeName }}{{ $t('cmdb.components.perm') }}</div>
|
||||||
|
<TopologyViewGrant
|
||||||
|
:resourceTypeName="resourceTypeName"
|
||||||
|
:tableData="tableData"
|
||||||
|
:viewId="CITypeId"
|
||||||
|
grantType="TopologyView"
|
||||||
|
@grantDepart="grantDepart"
|
||||||
|
@grantRole="grantRole"
|
||||||
|
@getTableData="getTableData"
|
||||||
|
ref="grantTopologyView"
|
||||||
|
:addedRids="addedRids"
|
||||||
|
/>
|
||||||
|
</template>
|
||||||
|
|
||||||
<GrantModal ref="grantModal" @handleOk="handleOk" />
|
<GrantModal ref="grantModal" @handleOk="handleOk" />
|
||||||
<ReadGrantModal ref="readGrantModal" :CITypeId="CITypeId" @updateTableDataRead="updateTableDataRead" />
|
<ReadGrantModal ref="readGrantModal" :CITypeId="CITypeId" @updateTableDataRead="updateTableDataRead" />
|
||||||
|
|
@ -72,11 +86,12 @@ import { getResourcePerms } from '@/modules/acl/api/permission'
|
||||||
import GrantModal from './grantModal.vue'
|
import GrantModal from './grantModal.vue'
|
||||||
import ReadGrantModal from './readGrantModal'
|
import ReadGrantModal from './readGrantModal'
|
||||||
import RelationViewGrant from './relationViewGrant.vue'
|
import RelationViewGrant from './relationViewGrant.vue'
|
||||||
|
import TopologyViewGrant from './topologyViewGrant.vue'
|
||||||
import { getCITypeGroupById, ciTypeFilterPermissions } from '../../api/CIType'
|
import { getCITypeGroupById, ciTypeFilterPermissions } from '../../api/CIType'
|
||||||
|
|
||||||
export default {
|
export default {
|
||||||
name: 'GrantComp',
|
name: 'GrantComp',
|
||||||
components: { CiTypeGrant, TypeRelationGrant, RelationViewGrant, GrantModal, ReadGrantModal },
|
components: { CiTypeGrant, TypeRelationGrant, RelationViewGrant, TopologyViewGrant, GrantModal, ReadGrantModal },
|
||||||
props: {
|
props: {
|
||||||
CITypeId: {
|
CITypeId: {
|
||||||
type: Number,
|
type: Number,
|
||||||
|
|
@ -291,6 +306,20 @@ export default {
|
||||||
})
|
})
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
|
if (grantType === 'TopologyView') {
|
||||||
|
this.tableData.unshift(
|
||||||
|
...rids.map(({ rid, name }) => {
|
||||||
|
return {
|
||||||
|
rid,
|
||||||
|
name,
|
||||||
|
read: false,
|
||||||
|
update: false,
|
||||||
|
delete: false,
|
||||||
|
grant: false,
|
||||||
|
}
|
||||||
|
})
|
||||||
|
)
|
||||||
|
}
|
||||||
this.addedRids = rids
|
this.addedRids = rids
|
||||||
this.$nextTick(() => {
|
this.$nextTick(() => {
|
||||||
setTimeout(() => {
|
setTimeout(() => {
|
||||||
|
|
|
||||||
|
|
@ -0,0 +1,102 @@
|
||||||
|
<template>
|
||||||
|
<div class="topology-view-grant">
|
||||||
|
<vxe-table
|
||||||
|
ref="xTable"
|
||||||
|
size="mini"
|
||||||
|
stripe
|
||||||
|
class="ops-stripe-table"
|
||||||
|
:data="tableData"
|
||||||
|
:max-height="`${tableHeight}px`"
|
||||||
|
:scroll-y="{enabled: true}"
|
||||||
|
:row-style="(params) => getCurrentRowStyle(params, addedRids)"
|
||||||
|
>
|
||||||
|
<vxe-column field="name"></vxe-column>
|
||||||
|
<vxe-column v-for="col in columns" :key="col" :field="col" :title="permMap[col]">
|
||||||
|
<template #default="{row}">
|
||||||
|
<a-checkbox @change="(e) => handleChange(e, col, row)" v-model="row[col]"></a-checkbox>
|
||||||
|
</template>
|
||||||
|
</vxe-column>
|
||||||
|
</vxe-table>
|
||||||
|
<a-space>
|
||||||
|
<span class="grant-button" @click="grantDepart">{{ $t('cmdb.components.grantUser') }}</span>
|
||||||
|
<span class="grant-button" @click="grantRole">{{ $t('cmdb.components.grantRole') }}</span>
|
||||||
|
</a-space>
|
||||||
|
</div>
|
||||||
|
</template>
|
||||||
|
|
||||||
|
<script>
|
||||||
|
import { permMap } from './constants.js'
|
||||||
|
import { grantTopologyView, revokeTopologyView } from '@/modules/cmdb/api/topology.js'
|
||||||
|
import { getCurrentRowStyle } from './utils'
|
||||||
|
export default {
|
||||||
|
name: 'TopologyViewGrant',
|
||||||
|
inject: ['loading', 'isModal'],
|
||||||
|
props: {
|
||||||
|
viewId: {
|
||||||
|
type: Number,
|
||||||
|
default: null,
|
||||||
|
},
|
||||||
|
resourceTypeName: {
|
||||||
|
type: String,
|
||||||
|
default: '',
|
||||||
|
},
|
||||||
|
tableData: {
|
||||||
|
type: Array,
|
||||||
|
default: () => [],
|
||||||
|
},
|
||||||
|
grantType: {
|
||||||
|
type: String,
|
||||||
|
default: 'relation_view',
|
||||||
|
},
|
||||||
|
addedRids: {
|
||||||
|
type: Array,
|
||||||
|
default: () => [],
|
||||||
|
},
|
||||||
|
},
|
||||||
|
data() {
|
||||||
|
return {
|
||||||
|
columns: ['read', 'update', 'delete', 'grant'],
|
||||||
|
}
|
||||||
|
},
|
||||||
|
computed: {
|
||||||
|
windowHeight() {
|
||||||
|
return this.$store.state.windowHeight
|
||||||
|
},
|
||||||
|
tableHeight() {
|
||||||
|
if (this.isModal) {
|
||||||
|
return (this.windowHeight - 104) / 2
|
||||||
|
}
|
||||||
|
return (this.windowHeight - 104) / 2 - 116
|
||||||
|
},
|
||||||
|
permMap() {
|
||||||
|
return permMap()
|
||||||
|
}
|
||||||
|
},
|
||||||
|
methods: {
|
||||||
|
getCurrentRowStyle,
|
||||||
|
grantDepart() {
|
||||||
|
this.$emit('grantDepart', this.grantType)
|
||||||
|
},
|
||||||
|
grantRole() {
|
||||||
|
this.$emit('grantRole', this.grantType)
|
||||||
|
},
|
||||||
|
handleChange(e, col, row) {
|
||||||
|
if (e.target.checked) {
|
||||||
|
grantTopologyView(this.viewId, row.rid, { perms: [col], name: this.resourceTypeName }).catch(() => {
|
||||||
|
this.$emit('getTableData')
|
||||||
|
})
|
||||||
|
} else {
|
||||||
|
revokeTopologyView(this.viewId, row.rid, { perms: [col], name: this.resourceTypeName }).catch(() => {
|
||||||
|
this.$emit('getTableData')
|
||||||
|
})
|
||||||
|
}
|
||||||
|
},
|
||||||
|
},
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<style lang="less" scoped>
|
||||||
|
.topology-view-grant {
|
||||||
|
padding: 10px 0;
|
||||||
|
}
|
||||||
|
</style>
|
||||||
|
|
@ -4,6 +4,7 @@ const cmdb_en = {
|
||||||
configTable: 'Config Table',
|
configTable: 'Config Table',
|
||||||
menu: {
|
menu: {
|
||||||
views: 'Views',
|
views: 'Views',
|
||||||
|
topologyView: 'Topology Views',
|
||||||
resources: 'Resources',
|
resources: 'Resources',
|
||||||
config: 'Configuration',
|
config: 'Configuration',
|
||||||
backend: 'Management',
|
backend: 'Management',
|
||||||
|
|
@ -563,6 +564,30 @@ if __name__ == "__main__":
|
||||||
tree: {
|
tree: {
|
||||||
tips1: 'Please go to Preference page first to complete your subscription!',
|
tips1: 'Please go to Preference page first to complete your subscription!',
|
||||||
subSettings: 'Settings',
|
subSettings: 'Settings',
|
||||||
}
|
},
|
||||||
|
topo: {
|
||||||
|
addTopoView: 'Add Topology View',
|
||||||
|
editTopoView: 'Edit Topology View',
|
||||||
|
addTopoViewInGroup: 'Define topology view under grouping',
|
||||||
|
groupRequired: 'Please select a group first or create a group',
|
||||||
|
viewName: 'Title',
|
||||||
|
viewNamePlaceholder: 'Please enter a title for the topology view',
|
||||||
|
inputNameTips: 'Title is required',
|
||||||
|
centralNodeType: 'Central Node Model',
|
||||||
|
filterInstances: 'Central Node Instances',
|
||||||
|
typeRequired: 'Central Node Model is required',
|
||||||
|
instancesRequired: 'instances are required',
|
||||||
|
path: 'Path',
|
||||||
|
aggregationCount: 'Aggregation Count',
|
||||||
|
aggreationCountTip: 'When the number of child nodes > the number of aggregations, paging display',
|
||||||
|
preview: 'Preivew',
|
||||||
|
noData: 'No data',
|
||||||
|
edit: 'Edit',
|
||||||
|
delete: 'Delete',
|
||||||
|
searchPlaceholder: 'Search topology view',
|
||||||
|
confirmDeleteView: 'Are you sure you want to delete this view ?',
|
||||||
|
noInstancePerm: 'You do not have read permissions for this instance',
|
||||||
|
noPreferenceAttributes: 'This instance has no subscription attributes or no default displayed attributes',
|
||||||
|
},
|
||||||
}
|
}
|
||||||
export default cmdb_en
|
export default cmdb_en
|
||||||
|
|
|
||||||
|
|
@ -4,6 +4,7 @@ const cmdb_zh = {
|
||||||
configTable: '配置表格',
|
configTable: '配置表格',
|
||||||
menu: {
|
menu: {
|
||||||
views: '视图',
|
views: '视图',
|
||||||
|
topologyView: '拓扑视图',
|
||||||
resources: '资源',
|
resources: '资源',
|
||||||
config: '配置',
|
config: '配置',
|
||||||
backend: '管理',
|
backend: '管理',
|
||||||
|
|
@ -563,6 +564,30 @@ if __name__ == "__main__":
|
||||||
tree: {
|
tree: {
|
||||||
tips1: '请先到 我的订阅 页面完成订阅!',
|
tips1: '请先到 我的订阅 页面完成订阅!',
|
||||||
subSettings: '订阅设置',
|
subSettings: '订阅设置',
|
||||||
}
|
},
|
||||||
|
topo: {
|
||||||
|
addTopoView: '新增拓扑视图',
|
||||||
|
editTopoView: '编辑拓扑视图',
|
||||||
|
addTopoViewInGroup: '在分组下定义拓扑视图',
|
||||||
|
groupRequired: '请先选择分组或者创建分组',
|
||||||
|
viewName: '标题',
|
||||||
|
viewNamePlaceholder: '请输入拓扑视图的标题',
|
||||||
|
inputNameTips: '必须输入标题',
|
||||||
|
centralNodeType: '中心节点模型',
|
||||||
|
filterInstances: '中心节点实例',
|
||||||
|
typeRequired: '必须要选择中心节点模型',
|
||||||
|
instancesRequired: '实例必须要选择',
|
||||||
|
path: '路径选择',
|
||||||
|
aggregationCount: '聚合数',
|
||||||
|
aggreationCountTip: '当子节点数 > 聚合数 则进行分页展示',
|
||||||
|
preview: '预览',
|
||||||
|
noData: '没有数据',
|
||||||
|
edit: '编辑',
|
||||||
|
delete: '删除',
|
||||||
|
searchPlaceholder: '搜索拓扑视图',
|
||||||
|
confirmDeleteView: '您确定要删除该视图吗?',
|
||||||
|
noInstancePerm: '您没有该实例的查看权限',
|
||||||
|
noPreferenceAttributes: '该实例没有订阅属性或者没有默认展示的属性',
|
||||||
|
},
|
||||||
}
|
}
|
||||||
export default cmdb_zh
|
export default cmdb_zh
|
||||||
|
|
|
||||||
|
|
@ -16,6 +16,12 @@ const genCmdbRoutes = async () => {
|
||||||
meta: { title: 'dashboard', icon: 'ops-cmdb-dashboard', selectedIcon: 'ops-cmdb-dashboard', keepAlive: false },
|
meta: { title: 'dashboard', icon: 'ops-cmdb-dashboard', selectedIcon: 'ops-cmdb-dashboard', keepAlive: false },
|
||||||
component: () => import('../views/dashboard/index_v2.vue')
|
component: () => import('../views/dashboard/index_v2.vue')
|
||||||
},
|
},
|
||||||
|
{
|
||||||
|
path: '/cmdb/topoviews',
|
||||||
|
name: 'cmdb_topology_views',
|
||||||
|
meta: { title: 'cmdb.menu.topologyView', appName: 'cmdb', icon: 'ops-topology_view', selectedIcon: 'ops-topology_view', keepAlive: false },
|
||||||
|
component: () => import('../views/topology_view/index.vue')
|
||||||
|
},
|
||||||
{
|
{
|
||||||
path: '/cmdb/disabled1',
|
path: '/cmdb/disabled1',
|
||||||
name: 'cmdb_disabled1',
|
name: 'cmdb_disabled1',
|
||||||
|
|
|
||||||
|
|
@ -689,7 +689,7 @@ export default {
|
||||||
content: that.$t('cmdb.ciType.confirmDeleteGroup', { groupName: `${g.name}` }),
|
content: that.$t('cmdb.ciType.confirmDeleteGroup', { groupName: `${g.name}` }),
|
||||||
onOk() {
|
onOk() {
|
||||||
deleteCITypeGroup(g.id).then((res) => {
|
deleteCITypeGroup(g.id).then((res) => {
|
||||||
that.$message.info(that.$t('deleteSuccess'))
|
that.$message.success(that.$t('deleteSuccess'))
|
||||||
that.loadCITypes(true)
|
that.loadCITypes(true)
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
|
|
||||||
|
|
@ -274,8 +274,8 @@ export default {
|
||||||
this.ciTypes = res.ci_types
|
this.ciTypes = res.ci_types
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
getCIType(typeId) {
|
async getCIType(typeId) {
|
||||||
getCIType(typeId).then((res) => {
|
await getCIType(typeId).then((res) => {
|
||||||
this.ciTypes = res.ci_types
|
this.ciTypes = res.ci_types
|
||||||
})
|
})
|
||||||
},
|
},
|
||||||
|
|
|
||||||
File diff suppressed because it is too large
Load Diff
Loading…
Reference in New Issue