7x31/cmdb
1
0
Fork 0
mirror of https://github.com/veops/cmdb.git synced 2025-08-07 12:40:13 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat(ui): update common settings btn

Browse Source
This commit is contained in:
songlh
2024-08-07 14:40:54 +08:00
parent f280603d00
commit 95506e6f4e
11 changed files with 1095 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

719
cmdb-ui/public/iconfont/demo_index.html
View File

@@ -54,6 +54,192 @@
<div class="content unicode" style="display: block;">
<ul class="icon_lists dib-box">
<li class="dib">
<span class="icon iconfont">&#xe995;</span>
<div class="name">duose-quote</div>
<div class="code-name">&amp;#xe995;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe996;</span>
<div class="name">duose-boole</div>
<div class="code-name">&amp;#xe996;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe994;</span>
<div class="name">veops-rule1</div>
<div class="code-name">&amp;#xe994;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe993;</span>
<div class="name">veops-operation_report</div>
<div class="code-name">&amp;#xe993;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe992;</span>
<div class="name">veops-ranking1</div>
<div class="code-name">&amp;#xe992;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe98f;</span>
<div class="name">veops-ranking2</div>
<div class="code-name">&amp;#xe98f;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe990;</span>
<div class="name">veops-ranking3</div>
<div class="code-name">&amp;#xe990;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe991;</span>
<div class="name">veops-ranking4</div>
<div class="code-name">&amp;#xe991;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe98d;</span>
<div class="name">veops-title5</div>
<div class="code-name">&amp;#xe98d;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe98e;</span>
<div class="name">veops-repair (1)</div>
<div class="code-name">&amp;#xe98e;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe988;</span>
<div class="name">veops-ticket</div>
<div class="code-name">&amp;#xe988;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe989;</span>
<div class="name">veops-model4</div>
<div class="code-name">&amp;#xe989;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe98a;</span>
<div class="name">veops-resource2 (1)</div>
<div class="code-name">&amp;#xe98a;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe98b;</span>
<div class="name">veops-relationship3</div>
<div class="code-name">&amp;#xe98b;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe98c;</span>
<div class="name">veops-title6</div>
<div class="code-name">&amp;#xe98c;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe97a;</span>
<div class="name">veops-resource1 (1)</div>
<div class="code-name">&amp;#xe97a;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe97b;</span>
<div class="name">veops-model1 (1)</div>
<div class="code-name">&amp;#xe97b;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe97c;</span>
<div class="name">veops-relationship1</div>
<div class="code-name">&amp;#xe97c;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe97d;</span>
<div class="name">veops-title1</div>
<div class="code-name">&amp;#xe97d;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe97e;</span>
<div class="name">veops-title2</div>
<div class="code-name">&amp;#xe97e;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe97f;</span>
<div class="name">veops-model2</div>
<div class="code-name">&amp;#xe97f;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe980;</span>
<div class="name">veops-resource2</div>
<div class="code-name">&amp;#xe980;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe981;</span>
<div class="name">veops-warehousing</div>
<div class="code-name">&amp;#xe981;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe982;</span>
<div class="name">veops-relationship2</div>
<div class="code-name">&amp;#xe982;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe983;</span>
<div class="name">veops-title3</div>
<div class="code-name">&amp;#xe983;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe984;</span>
<div class="name">veops-rule2</div>
<div class="code-name">&amp;#xe984;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe985;</span>
<div class="name">veops-model3</div>
<div class="code-name">&amp;#xe985;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe986;</span>
<div class="name">veops-title4</div>
<div class="code-name">&amp;#xe986;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe987;</span>
<div class="name">veops-rule3</div>
<div class="code-name">&amp;#xe987;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe978;</span>
<div class="name">veops-decline</div>
<div class="code-name">&amp;#xe978;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe979;</span>
<div class="name">veops-rise</div>
<div class="code-name">&amp;#xe979;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe96f;</span>
<div class="name">caise-数据中心</div>
@@ -5322,9 +5508,9 @@
<pre><code class="language-css"
>@font-face {
font-family: 'iconfont';
src: url('iconfont.woff2?t=1721959219377') format('woff2'),
url('iconfont.woff?t=1721959219377') format('woff'),
url('iconfont.ttf?t=1721959219377') format('truetype');
src: url('iconfont.woff2?t=1723012344599') format('woff2'),
url('iconfont.woff?t=1723012344599') format('woff'),
url('iconfont.ttf?t=1723012344599') format('truetype');
}
</code></pre>
<h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
@@ -5350,6 +5536,285 @@
<div class="content font-class">
<ul class="icon_lists dib-box">
<li class="dib">
<span class="icon iconfont duose-quote"></span>
<div class="name">
duose-quote
</div>
<div class="code-name">.duose-quote
</div>
</li>
<li class="dib">
<span class="icon iconfont duose-boole"></span>
<div class="name">
duose-boole
</div>
<div class="code-name">.duose-boole
</div>
</li>
<li class="dib">
<span class="icon iconfont veops-rule1"></span>
<div class="name">
veops-rule1
</div>
<div class="code-name">.veops-rule1
</div>
</li>
<li class="dib">
<span class="icon iconfont veops-operation_report"></span>
<div class="name">
veops-operation_report
</div>
<div class="code-name">.veops-operation_report
</div>
</li>
<li class="dib">
<span class="icon iconfont veops-ranking1"></span>
<div class="name">
veops-ranking1
</div>
<div class="code-name">.veops-ranking1
</div>
</li>
<li class="dib">
<span class="icon iconfont veops-ranking2"></span>
<div class="name">
veops-ranking2
</div>
<div class="code-name">.veops-ranking2
</div>
</li>
<li class="dib">
<span class="icon iconfont veops-ranking3"></span>
<div class="name">
veops-ranking3
</div>
<div class="code-name">.veops-ranking3
</div>
</li>
<li class="dib">
<span class="icon iconfont veops-ranking4"></span>
<div class="name">
veops-ranking4
</div>
<div class="code-name">.veops-ranking4
</div>
</li>
<li class="dib">
<span class="icon iconfont veops-title5"></span>
<div class="name">
veops-title5
</div>
<div class="code-name">.veops-title5
</div>
</li>
<li class="dib">
<span class="icon iconfont veops-repair1"></span>
<div class="name">
veops-repair (1)
</div>
<div class="code-name">.veops-repair1
</div>
</li>
<li class="dib">
<span class="icon iconfont veops-ticket"></span>
<div class="name">
veops-ticket
</div>
<div class="code-name">.veops-ticket
</div>
</li>
<li class="dib">
<span class="icon iconfont veops-model4"></span>
<div class="name">
veops-model4
</div>
<div class="code-name">.veops-model4
</div>
</li>
<li class="dib">
<span class="icon iconfont veops-resource21"></span>
<div class="name">
veops-resource2 (1)
</div>
<div class="code-name">.veops-resource21
</div>
</li>
<li class="dib">
<span class="icon iconfont veops-relationship3"></span>
<div class="name">
veops-relationship3
</div>
<div class="code-name">.veops-relationship3
</div>
</li>
<li class="dib">
<span class="icon iconfont veops-title6"></span>
<div class="name">
veops-title6
</div>
<div class="code-name">.veops-title6
</div>
</li>
<li class="dib">
<span class="icon iconfont veops-resource11"></span>
<div class="name">
veops-resource1 (1)
</div>
<div class="code-name">.veops-resource11
</div>
</li>
<li class="dib">
<span class="icon iconfont veops-model11"></span>
<div class="name">
veops-model1 (1)
</div>
<div class="code-name">.veops-model11
</div>
</li>
<li class="dib">
<span class="icon iconfont veops-relationship1"></span>
<div class="name">
veops-relationship1
</div>
<div class="code-name">.veops-relationship1
</div>
</li>
<li class="dib">
<span class="icon iconfont veops-title1"></span>
<div class="name">
veops-title1
</div>
<div class="code-name">.veops-title1
</div>
</li>
<li class="dib">
<span class="icon iconfont veops-title2"></span>
<div class="name">
veops-title2
</div>
<div class="code-name">.veops-title2
</div>
</li>
<li class="dib">
<span class="icon iconfont veops-model2"></span>
<div class="name">
veops-model2
</div>
<div class="code-name">.veops-model2
</div>
</li>
<li class="dib">
<span class="icon iconfont veops-resource2"></span>
<div class="name">
veops-resource2
</div>
<div class="code-name">.veops-resource2
</div>
</li>
<li class="dib">
<span class="icon iconfont veops-warehousing"></span>
<div class="name">
veops-warehousing
</div>
<div class="code-name">.veops-warehousing
</div>
</li>
<li class="dib">
<span class="icon iconfont veops-relationship2"></span>
<div class="name">
veops-relationship2
</div>
<div class="code-name">.veops-relationship2
</div>
</li>
<li class="dib">
<span class="icon iconfont veops-title3"></span>
<div class="name">
veops-title3
</div>
<div class="code-name">.veops-title3
</div>
</li>
<li class="dib">
<span class="icon iconfont veops-rule2"></span>
<div class="name">
veops-rule2
</div>
<div class="code-name">.veops-rule2
</div>
</li>
<li class="dib">
<span class="icon iconfont veops-model3"></span>
<div class="name">
veops-model3
</div>
<div class="code-name">.veops-model3
</div>
</li>
<li class="dib">
<span class="icon iconfont veops-title4"></span>
<div class="name">
veops-title4
</div>
<div class="code-name">.veops-title4
</div>
</li>
<li class="dib">
<span class="icon iconfont veops-rule3"></span>
<div class="name">
veops-rule3
</div>
<div class="code-name">.veops-rule3
</div>
</li>
<li class="dib">
<span class="icon iconfont veops-decline"></span>
<div class="name">
veops-decline
</div>
<div class="code-name">.veops-decline
</div>
</li>
<li class="dib">
<span class="icon iconfont veops-rise"></span>
<div class="name">
veops-rise
</div>
<div class="code-name">.veops-rise
</div>
</li>
<li class="dib">
<span class="icon iconfont caise-data_center"></span>
<div class="name">
@@ -13252,6 +13717,254 @@
<div class="content symbol">
<ul class="icon_lists dib-box">
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#duose-quote"></use>
</svg>
<div class="name">duose-quote</div>
<div class="code-name">#duose-quote</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#duose-boole"></use>
</svg>
<div class="name">duose-boole</div>
<div class="code-name">#duose-boole</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#veops-rule1"></use>
</svg>
<div class="name">veops-rule1</div>
<div class="code-name">#veops-rule1</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#veops-operation_report"></use>
</svg>
<div class="name">veops-operation_report</div>
<div class="code-name">#veops-operation_report</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#veops-ranking1"></use>
</svg>
<div class="name">veops-ranking1</div>
<div class="code-name">#veops-ranking1</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#veops-ranking2"></use>
</svg>
<div class="name">veops-ranking2</div>
<div class="code-name">#veops-ranking2</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#veops-ranking3"></use>
</svg>
<div class="name">veops-ranking3</div>
<div class="code-name">#veops-ranking3</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#veops-ranking4"></use>
</svg>
<div class="name">veops-ranking4</div>
<div class="code-name">#veops-ranking4</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#veops-title5"></use>
</svg>
<div class="name">veops-title5</div>
<div class="code-name">#veops-title5</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#veops-repair1"></use>
</svg>
<div class="name">veops-repair (1)</div>
<div class="code-name">#veops-repair1</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#veops-ticket"></use>
</svg>
<div class="name">veops-ticket</div>
<div class="code-name">#veops-ticket</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#veops-model4"></use>
</svg>
<div class="name">veops-model4</div>
<div class="code-name">#veops-model4</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#veops-resource21"></use>
</svg>
<div class="name">veops-resource2 (1)</div>
<div class="code-name">#veops-resource21</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#veops-relationship3"></use>
</svg>
<div class="name">veops-relationship3</div>
<div class="code-name">#veops-relationship3</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#veops-title6"></use>
</svg>
<div class="name">veops-title6</div>
<div class="code-name">#veops-title6</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#veops-resource11"></use>
</svg>
<div class="name">veops-resource1 (1)</div>
<div class="code-name">#veops-resource11</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#veops-model11"></use>
</svg>
<div class="name">veops-model1 (1)</div>
<div class="code-name">#veops-model11</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#veops-relationship1"></use>
</svg>
<div class="name">veops-relationship1</div>
<div class="code-name">#veops-relationship1</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#veops-title1"></use>
</svg>
<div class="name">veops-title1</div>
<div class="code-name">#veops-title1</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#veops-title2"></use>
</svg>
<div class="name">veops-title2</div>
<div class="code-name">#veops-title2</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#veops-model2"></use>
</svg>
<div class="name">veops-model2</div>
<div class="code-name">#veops-model2</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#veops-resource2"></use>
</svg>
<div class="name">veops-resource2</div>
<div class="code-name">#veops-resource2</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#veops-warehousing"></use>
</svg>
<div class="name">veops-warehousing</div>
<div class="code-name">#veops-warehousing</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#veops-relationship2"></use>
</svg>
<div class="name">veops-relationship2</div>
<div class="code-name">#veops-relationship2</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#veops-title3"></use>
</svg>
<div class="name">veops-title3</div>
<div class="code-name">#veops-title3</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#veops-rule2"></use>
</svg>
<div class="name">veops-rule2</div>
<div class="code-name">#veops-rule2</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#veops-model3"></use>
</svg>
<div class="name">veops-model3</div>
<div class="code-name">#veops-model3</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#veops-title4"></use>
</svg>
<div class="name">veops-title4</div>
<div class="code-name">#veops-title4</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#veops-rule3"></use>
</svg>
<div class="name">veops-rule3</div>
<div class="code-name">#veops-rule3</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#veops-decline"></use>
</svg>
<div class="name">veops-decline</div>
<div class="code-name">#veops-decline</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#veops-rise"></use>
</svg>
<div class="name">veops-rise</div>
<div class="code-name">#veops-rise</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#caise-data_center"></use>