Merge pull request #643 from veops/dev_ui_dcim

Dev UI dcim
veops · Nov 27, 2024 · 9c4cc20 · 9c4cc20
2 parents e22b0c5 + c3c8602
commit 9c4cc20
Show file tree

Hide file tree

Showing 50 changed files with 5,293 additions and 24 deletions.
diff --git a/cmdb-ui/public/iconfont/demo_index.html b/cmdb-ui/public/iconfont/demo_index.html
@@ -54,6 +54,66 @@ <h1 class="logo"><a href="https://www.iconfont.cn/" title="iconfont 首页" targ
       <div class="content unicode" style="display: block;">
           <ul class="icon_lists dib-box">
 
+            <li class="dib">
+              <span class="icon iconfont">&#xea02;</span>
+                <div class="name">veops-rear</div>
+                <div class="code-name">&amp;#xea02;</div>
+              </li>
+
+            <li class="dib">
+              <span class="icon iconfont">&#xea03;</span>
+                <div class="name">veops-front</div>
+                <div class="code-name">&amp;#xea03;</div>
+              </li>
+
+            <li class="dib">
+              <span class="icon iconfont">&#xea01;</span>
+                <div class="name">veops-xianggang</div>
+                <div class="code-name">&amp;#xea01;</div>
+              </li>
+
+            <li class="dib">
+              <span class="icon iconfont">&#xea00;</span>
+                <div class="name">veops-device (2)</div>
+                <div class="code-name">&amp;#xea00;</div>
+              </li>
+
+            <li class="dib">
+              <span class="icon iconfont">&#xe9ff;</span>
+                <div class="name">veops-room (1)</div>
+                <div class="code-name">&amp;#xe9ff;</div>
+              </li>
+
+            <li class="dib">
+              <span class="icon iconfont">&#xe9fe;</span>
+                <div class="name">veops-IDC</div>
+                <div class="code-name">&amp;#xe9fe;</div>
+              </li>
+
+            <li class="dib">
+              <span class="icon iconfont">&#xe9fd;</span>
+                <div class="name">veops-region</div>
+                <div class="code-name">&amp;#xe9fd;</div>
+              </li>
+
+            <li class="dib">
+              <span class="icon iconfont">&#xe9fb;</span>
+                <div class="name">veops-device</div>
+                <div class="code-name">&amp;#xe9fb;</div>
+              </li>
+
+            <li class="dib">
+              <span class="icon iconfont">&#xe9fc;</span>
+                <div class="name">veops-cabinet</div>
+                <div class="code-name">&amp;#xe9fc;</div>
+              </li>
+
+            <li class="dib">
+              <span class="icon iconfont">&#xe9f9;</span>
+                <div class="name">veops-data_center</div>
+                <div class="code-name">&amp;#xe9f9;</div>
+              </li>
+
             <li class="dib">
               <span class="icon iconfont">&#xe9fa;</span>
                 <div class="name">ops-setting-holiday_management-copy</div>
@@ -6102,9 +6162,9 @@ <h3 id="-font-face">第一步：拷贝项目下面生成的 <code>@font-face</co
 <pre><code class="language-css"
 >@font-face {
   font-family: 'iconfont';
-  src: url('iconfont.woff2?t=1731312848138') format('woff2'),
-       url('iconfont.woff?t=1731312848138') format('woff'),
-       url('iconfont.ttf?t=1731312848138') format('truetype');
+  src: url('iconfont.woff2?t=1732673294759') format('woff2'),
+       url('iconfont.woff?t=1732673294759') format('woff'),
+       url('iconfont.ttf?t=1732673294759') format('truetype');
 }
 </code></pre>
           <h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
@@ -6130,6 +6190,96 @@ <h3 id="-">第三步：挑选相应图标并获取字体编码，应用于页面
       <div class="content font-class">
         <ul class="icon_lists dib-box">
 
+          <li class="dib">
+            <span class="icon iconfont veops-rear"></span>
+            <div class="name">
+              veops-rear
+            </div>
+            <div class="code-name">.veops-rear
+            </div>
+          </li>
+
+          <li class="dib">
+            <span class="icon iconfont veops-front"></span>
+            <div class="name">
+              veops-front
+            </div>
+            <div class="code-name">.veops-front
+            </div>
+          </li>
+
+          <li class="dib">
+            <span class="icon iconfont veops-xianggang"></span>
+            <div class="name">
+              veops-xianggang
+            </div>
+            <div class="code-name">.veops-xianggang
+            </div>
+          </li>
+
+          <li class="dib">
+            <span class="icon iconfont a-veops-device2"></span>
+            <div class="name">
+              veops-device (2)
+            </div>
+            <div class="code-name">.a-veops-device2
+            </div>
+          </li>
+
+          <li class="dib">
+            <span class="icon iconfont a-veops-room1"></span>
+            <div class="name">
+              veops-room (1)
+            </div>
+            <div class="code-name">.a-veops-room1
+            </div>
+          </li>
+
+          <li class="dib">
+            <span class="icon iconfont veops-IDC"></span>
+            <div class="name">
+              veops-IDC
+            </div>
+            <div class="code-name">.veops-IDC
+            </div>
+          </li>
+
+          <li class="dib">
+            <span class="icon iconfont veops-region"></span>
+            <div class="name">
+              veops-region
+            </div>
+            <div class="code-name">.veops-region
+            </div>
+          </li>
+
+          <li class="dib">
+            <span class="icon iconfont veops-device"></span>
+            <div class="name">
+              veops-device
+            </div>
+            <div class="code-name">.veops-device
+            </div>
+          </li>
+
+          <li class="dib">
+            <span class="icon iconfont veops-cabinet"></span>
+            <div class="name">
+              veops-cabinet
+            </div>
+            <div class="code-name">.veops-cabinet
+            </div>
+          </li>
+
+          <li class="dib">
+            <span class="icon iconfont veops-data_center"></span>
+            <div class="name">
+              veops-data_center
+            </div>
+            <div class="code-name">.veops-data_center
+            </div>
+          </li>
+
           <li class="dib">
             <span class="icon iconfont ops-setting-holidays"></span>
             <div class="name">
@@ -15202,6 +15352,86 @@ <h3 id="-">第二步：挑选相应图标并获取类名，应用于页面：</h
       <div class="content symbol">
           <ul class="icon_lists dib-box">
 
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#veops-rear"></use>
+                </svg>
+                <div class="name">veops-rear</div>
+                <div class="code-name">#veops-rear</div>
+            </li>
+
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#veops-front"></use>
+                </svg>
+                <div class="name">veops-front</div>
+                <div class="code-name">#veops-front</div>
+            </li>
+
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#veops-xianggang"></use>
+                </svg>
+                <div class="name">veops-xianggang</div>
+                <div class="code-name">#veops-xianggang</div>
+            </li>
+
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#a-veops-device2"></use>
+                </svg>
+                <div class="name">veops-device (2)</div>
+                <div class="code-name">#a-veops-device2</div>
+            </li>
+
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#a-veops-room1"></use>
+                </svg>
+                <div class="name">veops-room (1)</div>
+                <div class="code-name">#a-veops-room1</div>
+            </li>
+
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#veops-IDC"></use>
+                </svg>
+                <div class="name">veops-IDC</div>
+                <div class="code-name">#veops-IDC</div>
+            </li>
+
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#veops-region"></use>
+                </svg>
+                <div class="name">veops-region</div>
+                <div class="code-name">#veops-region</div>
+            </li>
+
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#veops-device"></use>
+                </svg>
+                <div class="name">veops-device</div>
+                <div class="code-name">#veops-device</div>
+            </li>
+
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#veops-cabinet"></use>
+                </svg>
+                <div class="name">veops-cabinet</div>
+                <div class="code-name">#veops-cabinet</div>
+            </li>
+
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#veops-data_center"></use>
+                </svg>
+                <div class="name">veops-data_center</div>
+                <div class="code-name">#veops-data_center</div>
+            </li>
+
             <li class="dib">
                 <svg class="icon svg-icon" aria-hidden="true">
                   <use xlink:href="#ops-setting-holidays"></use>

diff --git a/cmdb-ui/public/iconfont/iconfont.css b/cmdb-ui/public/iconfont/iconfont.css
@@ -1,8 +1,8 @@
 @font-face {
   font-family: "iconfont"; /* Project id 3857903 */
-  src: url('iconfont.woff2?t=1731312848138') format('woff2'),
-       url('iconfont.woff?t=1731312848138') format('woff'),
-       url('iconfont.ttf?t=1731312848138') format('truetype');
+  src: url('iconfont.woff2?t=1732673294759') format('woff2'),
+       url('iconfont.woff?t=1732673294759') format('woff'),
+       url('iconfont.ttf?t=1732673294759') format('truetype');
 }
 
 .iconfont {
@@ -13,6 +13,46 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
+.veops-rear:before {
+  content: "\ea02";
+}
+
+.veops-front:before {
+  content: "\ea03";
+}
+
+.veops-xianggang:before {
+  content: "\ea01";
+}
+
+.a-veops-device2:before {
+  content: "\ea00";
+}
+
+.a-veops-room1:before {
+  content: "\e9ff";
+}
+
+.veops-IDC:before {
+  content: "\e9fe";
+}
+
+.veops-region:before {
+  content: "\e9fd";
+}
+
+.veops-device:before {
+  content: "\e9fb";
+}
+
+.veops-cabinet:before {
+  content: "\e9fc";
+}
+
+.veops-data_center:before {
+  content: "\e9f9";
+}
+
 .ops-setting-holidays:before {
   content: "\e9fa";
 }

diff --git a/cmdb-ui/public/iconfont/iconfont.js b/cmdb-ui/public/iconfont/iconfont.js
diff --git a/cmdb-ui/public/iconfont/iconfont.json b/cmdb-ui/public/iconfont/iconfont.json
@@ -5,6 +5,76 @@
   "css_prefix_text": "",
   "description": "",
   "glyphs": [
+    {
+      "icon_id": "42510712",
+      "name": "veops-rear",
+      "font_class": "veops-rear",
+      "unicode": "ea02",
+      "unicode_decimal": 59906
+    },
+    {
+      "icon_id": "42510708",
+      "name": "veops-front",
+      "font_class": "veops-front",
+      "unicode": "ea03",
+      "unicode_decimal": 59907
+    },
+    {
+      "icon_id": "42497603",
+      "name": "veops-xianggang",
+      "font_class": "veops-xianggang",
+      "unicode": "ea01",
+      "unicode_decimal": 59905
+    },
+    {
+      "icon_id": "42485038",
+      "name": "veops-device (2)",
+      "font_class": "a-veops-device2",
+      "unicode": "ea00",
+      "unicode_decimal": 59904
+    },
+    {
+      "icon_id": "42455620",
+      "name": "veops-room (1)",
+      "font_class": "a-veops-room1",
+      "unicode": "e9ff",
+      "unicode_decimal": 59903
+    },
+    {
+      "icon_id": "42455607",
+      "name": "veops-IDC",
+      "font_class": "veops-IDC",
+      "unicode": "e9fe",
+      "unicode_decimal": 59902
+    },
+    {
+      "icon_id": "42455609",
+      "name": "veops-region",
+      "font_class": "veops-region",
+      "unicode": "e9fd",
+      "unicode_decimal": 59901
+    },
+    {
+      "icon_id": "42448953",
+      "name": "veops-device",
+      "font_class": "veops-device",
+      "unicode": "e9fb",
+      "unicode_decimal": 59899
+    },
+    {
+      "icon_id": "42448948",
+      "name": "veops-cabinet",
+      "font_class": "veops-cabinet",
+      "unicode": "e9fc",
+      "unicode_decimal": 59900
+    },
+    {
+      "icon_id": "42433324",
+      "name": "veops-data_center",
+      "font_class": "veops-data_center",
+      "unicode": "e9f9",
+      "unicode_decimal": 59897
+    },
     {
       "icon_id": "42337844",
       "name": "ops-setting-holiday_management-copy",

diff --git a/cmdb-ui/public/iconfont/iconfont.ttf b/cmdb-ui/public/iconfont/iconfont.ttf
diff --git a/cmdb-ui/public/iconfont/iconfont.woff b/cmdb-ui/public/iconfont/iconfont.woff
diff --git a/cmdb-ui/public/iconfont/iconfont.woff2 b/cmdb-ui/public/iconfont/iconfont.woff2