7x31
/
cmdb
mirror of https://github.com/veops/cmdb.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #611 from veops/dev_ui_240903 

feat: update icon select
This commit is contained in:
Leo Song 2024-09-03 16:41:18 +08:00 committed by GitHub
parent ade4fc72e3 5487d07b53
commit 478e9519e8
8 changed files with 463 additions and 13 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -54,6 +54,78 @@
<div class="content unicode" style="display: block;">
<ul class="icon_lists dib-box">
<li class="dib">
<span class="icon iconfont">&#xe9c2;</span>
<div class="name">caise-websphere</div>
<div class="code-name">&amp;#xe9c2;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe9c1;</span>
<div class="name">caise-vps</div>
<div class="code-name">&amp;#xe9c1;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe9c0;</span>
<div class="name">caise-F5</div>
<div class="code-name">&amp;#xe9c0;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe9bf;</span>
<div class="name">caise-HAProxy</div>
<div class="code-name">&amp;#xe9bf;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe9be;</span>
<div class="name">caise-JBoss</div>
<div class="code-name">&amp;#xe9be;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe9bd;</span>
<div class="name">caise-dongfangtong</div>
<div class="code-name">&amp;#xe9bd;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe9b7;</span>
<div class="name">caise-kafka</div>
<div class="code-name">&amp;#xe9b7;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe9b8;</span>
<div class="name">caise-weblogic</div>
<div class="code-name">&amp;#xe9b8;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe9b9;</span>
<div class="name">caise-TDSQL</div>
<div class="code-name">&amp;#xe9b9;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe9ba;</span>
<div class="name">caise-kingbase</div>
<div class="code-name">&amp;#xe9ba;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe9bb;</span>
<div class="name">达梦</div>
<div class="code-name">&amp;#xe9bb;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe9bc;</span>
<div class="name">caise-TIDB</div>
<div class="code-name">&amp;#xe9bc;</div>
</li>
<li class="dib">
<span class="icon iconfont">&#xe9b6;</span>
<div class="name">veops-expand</div>
@ -5700,9 +5772,9 @@
<pre><code class="language-css"
>@font-face {
font-family: 'iconfont';
src: url('iconfont.woff2?t=1725331691589') format('woff2'),
url('iconfont.woff?t=1725331691589') format('woff'),
url('iconfont.ttf?t=1725331691589') format('truetype');
src: url('iconfont.woff2?t=1725351982733') format('woff2'),
url('iconfont.woff?t=1725351982733') format('woff'),
url('iconfont.ttf?t=1725351982733') format('truetype');
}
</code></pre>
<h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
@ -5728,6 +5800,114 @@
<div class="content font-class">
<ul class="icon_lists dib-box">
<li class="dib">
<span class="icon iconfont caise-websphere"></span>
<div class="name">
caise-websphere
</div>
<div class="code-name">.caise-websphere
</div>
</li>
<li class="dib">
<span class="icon iconfont caise-vps"></span>
<div class="name">
caise-vps
</div>
<div class="code-name">.caise-vps
</div>
</li>
<li class="dib">
<span class="icon iconfont caise-F5"></span>
<div class="name">
caise-F5
</div>
<div class="code-name">.caise-F5
</div>
</li>
<li class="dib">
<span class="icon iconfont caise-HAProxy"></span>
<div class="name">
caise-HAProxy
</div>
<div class="code-name">.caise-HAProxy
</div>
</li>
<li class="dib">
<span class="icon iconfont caise-JBoss"></span>
<div class="name">
caise-JBoss
</div>
<div class="code-name">.caise-JBoss
</div>
</li>
<li class="dib">
<span class="icon iconfont caise-dongfangtong"></span>
<div class="name">
caise-dongfangtong
</div>
<div class="code-name">.caise-dongfangtong
</div>
</li>
<li class="dib">
<span class="icon iconfont caise-kafka"></span>
<div class="name">
caise-kafka
</div>
<div class="code-name">.caise-kafka
</div>
</li>
<li class="dib">
<span class="icon iconfont caise-weblogic"></span>
<div class="name">
caise-weblogic
</div>
<div class="code-name">.caise-weblogic
</div>
</li>
<li class="dib">
<span class="icon iconfont caise-TDSQL"></span>
<div class="name">
caise-TDSQL
</div>
<div class="code-name">.caise-TDSQL
</div>
</li>
<li class="dib">
<span class="icon iconfont caise-kingbase"></span>
<div class="name">
caise-kingbase
</div>
<div class="code-name">.caise-kingbase
</div>
</li>
<li class="dib">
<span class="icon iconfont caise-dameng"></span>
<div class="name">
达梦
</div>
<div class="code-name">.caise-dameng
</div>
</li>
<li class="dib">
<span class="icon iconfont caise-TIDB"></span>
<div class="name">
caise-TIDB
</div>
<div class="code-name">.caise-TIDB
</div>
</li>
<li class="dib">
<span class="icon iconfont veops-expand"></span>
<div class="name">
@ -14197,6 +14377,102 @@
<div class="content symbol">
<ul class="icon_lists dib-box">
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#caise-websphere"></use>
</svg>
<div class="name">caise-websphere</div>
<div class="code-name">#caise-websphere</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#caise-vps"></use>
</svg>
<div class="name">caise-vps</div>
<div class="code-name">#caise-vps</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#caise-F5"></use>
</svg>
<div class="name">caise-F5</div>
<div class="code-name">#caise-F5</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#caise-HAProxy"></use>
</svg>
<div class="name">caise-HAProxy</div>
<div class="code-name">#caise-HAProxy</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#caise-JBoss"></use>
</svg>
<div class="name">caise-JBoss</div>
<div class="code-name">#caise-JBoss</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#caise-dongfangtong"></use>
</svg>
<div class="name">caise-dongfangtong</div>
<div class="code-name">#caise-dongfangtong</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#caise-kafka"></use>
</svg>
<div class="name">caise-kafka</div>
<div class="code-name">#caise-kafka</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#caise-weblogic"></use>
</svg>
<div class="name">caise-weblogic</div>
<div class="code-name">#caise-weblogic</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#caise-TDSQL"></use>
</svg>
<div class="name">caise-TDSQL</div>
<div class="code-name">#caise-TDSQL</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#caise-kingbase"></use>
</svg>
<div class="name">caise-kingbase</div>
<div class="code-name">#caise-kingbase</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#caise-dameng"></use>
</svg>
<div class="name">达梦</div>
<div class="code-name">#caise-dameng</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#caise-TIDB"></use>
</svg>
<div class="name">caise-TIDB</div>
<div class="code-name">#caise-TIDB</div>
</li>
<li class="dib">
<svg class="icon svg-icon" aria-hidden="true">
<use xlink:href="#veops-expand"></use>

54
cmdb-ui/public/iconfont/iconfont.css
View File

@ -1,8 +1,8 @@
@font-face {
font-family: "iconfont"; /* Project id 3857903 */
src: url('iconfont.woff2?t=1725331691589') format('woff2'),
url('iconfont.woff?t=1725331691589') format('woff'),
url('iconfont.ttf?t=1725331691589') format('truetype');
src: url('iconfont.woff2?t=1725351982733') format('woff2'),
url('iconfont.woff?t=1725351982733') format('woff'),
url('iconfont.ttf?t=1725351982733') format('truetype');
}
.iconfont {
@ -13,6 +13,54 @@
-moz-osx-font-smoothing: grayscale;
}
.caise-websphere:before {
content: "\e9c2";
}
.caise-vps:before {
content: "\e9c1";
}
.caise-F5:before {
content: "\e9c0";
}
.caise-HAProxy:before {
content: "\e9bf";
}
.caise-JBoss:before {
content: "\e9be";
}
.caise-dongfangtong:before {
content: "\e9bd";
}
.caise-kafka:before {
content: "\e9b7";
}
.caise-weblogic:before {
content: "\e9b8";
}
.caise-TDSQL:before {
content: "\e9b9";
}
.caise-kingbase:before {
content: "\e9ba";
}
.caise-dameng:before {
content: "\e9bb";
}
.caise-TIDB:before {
content: "\e9bc";
}
.veops-expand:before {
content: "\e9b6";
}

2
cmdb-ui/public/iconfont/iconfont.js
View File

File diff suppressed because one or more lines are too long

84
cmdb-ui/public/iconfont/iconfont.json
View File

@ -5,6 +5,90 @@
"css_prefix_text": "",
"description": "",
"glyphs": [
{
"icon_id": "41724497",
"name": "caise-websphere",
"font_class": "caise-websphere",
"unicode": "e9c2",
"unicode_decimal": 59842
},
{
"icon_id": "41724575",
"name": "caise-vps",
"font_class": "caise-vps",
"unicode": "e9c1",
"unicode_decimal": 59841
},
{
"icon_id": "41724631",
"name": "caise-F5",
"font_class": "caise-F5",
"unicode": "e9c0",
"unicode_decimal": 59840
},
{
"icon_id": "41724653",
"name": "caise-HAProxy",
"font_class": "caise-HAProxy",
"unicode": "e9bf",
"unicode_decimal": 59839
},
{
"icon_id": "41722953",
"name": "caise-JBoss",
"font_class": "caise-JBoss",
"unicode": "e9be",
"unicode_decimal": 59838
},
{
"icon_id": "41722960",
"name": "caise-dongfangtong",
"font_class": "caise-dongfangtong",
"unicode": "e9bd",
"unicode_decimal": 59837
},
{
"icon_id": "41722681",
"name": "caise-kafka",
"font_class": "caise-kafka",
"unicode": "e9b7",
"unicode_decimal": 59831
},
{
"icon_id": "41722680",
"name": "caise-weblogic",
"font_class": "caise-weblogic",
"unicode": "e9b8",
"unicode_decimal": 59832
},
{
"icon_id": "41722679",
"name": "caise-TDSQL",
"font_class": "caise-TDSQL",
"unicode": "e9b9",
"unicode_decimal": 59833
},
{
"icon_id": "41722678",
"name": "caise-kingbase",
"font_class": "caise-kingbase",
"unicode": "e9ba",
"unicode_decimal": 59834
},
{
"icon_id": "41722677",
"name": "达梦",
"font_class": "caise-dameng",
"unicode": "e9bb",
"unicode_decimal": 59835
},
{
"icon_id": "41722675",
"name": "caise-TIDB",
"font_class": "caise-TIDB",
"unicode": "e9bc",
"unicode_decimal": 59836
},
{
"icon_id": "41681675",
"name": "veops-expand",

BIN
cmdb-ui/public/iconfont/iconfont.ttf
View File

Binary file not shown.

BIN
cmdb-ui/public/iconfont/iconfont.woff
View File

Binary file not shown.

BIN
cmdb-ui/public/iconfont/iconfont.woff2
View File

Binary file not shown.

54
cmdb-ui/src/components/CustomIconSelect/constants.js
View File

@ -177,7 +177,7 @@ export const linearIconList = [
}]
}, {
value: 'icon-xianxing-application',
label: '应用',
label: '常用组件',
list: [{
value: 'icon-xianxing-yilianjie',
label: '已连接'
@ -517,7 +517,7 @@ export const fillIconList = [
}]
}, {
value: 'icon-shidi-application',
label: '应用',
label: '常用组件',
list: [{
value: 'icon-shidi-yilianjie',
label: '已连接'
@ -729,6 +729,18 @@ export const multicolorIconList = [
value: 'database',
label: '数据库',
list: [{
value: 'caise-TIDB',
label: 'TIDB'
}, {
value: 'caise-dameng',
label: '达梦'
}, {
value: 'caise-kingbase',
label: 'KingBase'
}, {
value: 'caise-TDSQL',
label: 'TDSQL'
}, {
value: 'caise-DB2',
label: 'DB2'
}, {
@ -809,6 +821,9 @@ export const multicolorIconList = [
value: 'system',
label: '操作系统',
list: [{
value: 'ciase-aix',
label: 'aix'
}, {
value: 'caise-Windows',
label: 'Windows'
}, {
@ -903,8 +918,38 @@ export const multicolorIconList = [
}]
}, {
value: 'caise-application',
label: '应用',
label: '常用组件',
list: [{
value: 'caise-websphere',
label: 'WebSphere'
}, {
value: 'caise-vps',
label: 'VPS'
}, {
value: 'caise-F5',
label: 'F5'
}, {
value: 'caise-HAProxy',
label: 'HAProxy'
}, {
value: 'caise-kafka',
label: 'kafka'
}, {
value: 'caise-dongfangtong',
label: '东方通'
}, {
value: 'cmdb-vcenter',
label: 'VCenter'
}, {
value: 'ops-KVM',
label: 'KVM'
}, {
value: 'caise-JBoss',
label: 'JBoss'
}, {
value: 'caise-weblogic',
label: 'WebLogic'
}, {
value: 'caise-disk_array',
label: '磁盘阵列'
}, {
@ -928,9 +973,6 @@ export const multicolorIconList = [
}, {
value: 'caise_pool',
label: 'ip池'
}, {
value: 'ciase-aix',
label: 'aix'
}, {
value: 'caise-storage_volume1',
label: '存储卷'