第二名图标

src/assets/iconfont/demo_index.html

@@ -54,6 +54,54 @@
       <div class="content unicode" style="display: block;">
           <ul class="icon_lists dib-box">
           
+            <li class="dib">
+              <span class="icon iconfont">&#xe636;</span>
+                <div class="name">no.2</div>
+                <div class="code-name">&amp;#xe636;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe637;</span>
+                <div class="name">2</div>
+                <div class="code-name">&amp;#xe637;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe634;</span>
+                <div class="name">键盘</div>
+                <div class="code-name">&amp;#xe634;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe630;</span>
+                <div class="name">关闭</div>
+                <div class="code-name">&amp;#xe630;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe631;</span>
+                <div class="name">左</div>
+                <div class="code-name">&amp;#xe631;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe632;</span>
+                <div class="name">本架图书</div>
+                <div class="code-name">&amp;#xe632;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe633;</span>
+                <div class="name">热门</div>
+                <div class="code-name">&amp;#xe633;</div>
+              </li>
+          
+            <li class="dib">
+              <span class="icon iconfont">&#xe62f;</span>
+                <div class="name">右</div>
+                <div class="code-name">&amp;#xe62f;</div>
+              </li>
+          
             <li class="dib">
               <span class="icon iconfont">&#xe628;</span>
                 <div class="name">通知</div>
@@ -66,24 +114,12 @@
                 <div class="code-name">&amp;#xe629;</div>
               </li>
           
-            <li class="dib">
-              <span class="icon iconfont">&#xe62a;</span>
-                <div class="name">no.2</div>
-                <div class="code-name">&amp;#xe62a;</div>
-              </li>
-          
             <li class="dib">
               <span class="icon iconfont">&#xe62b;</span>
                 <div class="name">no.1</div>
                 <div class="code-name">&amp;#xe62b;</div>
               </li>
           
-            <li class="dib">
-              <span class="icon iconfont">&#xe62c;</span>
-                <div class="name">2</div>
-                <div class="code-name">&amp;#xe62c;</div>
-              </li>
-          
             <li class="dib">
               <span class="icon iconfont">&#xe62d;</span>
                 <div class="name">3</div>
@@ -114,10 +150,10 @@
 <pre><code class="language-css"
 >@font-face {
   font-family: 'iconfont';
-  src: url('iconfont.woff2?t=1663123643053') format('woff2'),
-       url('iconfont.woff?t=1663123643053') format('woff'),
-       url('iconfont.ttf?t=1663123643053') format('truetype'),
-       url('iconfont.svg?t=1663123643053#iconfont') format('svg');
+  src: url('iconfont.woff2?t=1663379994606') format('woff2'),
+       url('iconfont.woff?t=1663379994606') format('woff'),
+       url('iconfont.ttf?t=1663379994606') format('truetype'),
+       url('iconfont.svg?t=1663379994606#iconfont') format('svg');
 }
 </code></pre>
           <h3 id="-iconfont-">第二步：定义使用 iconfont 的样式</h3>
@@ -144,47 +180,101 @@
         <ul class="icon_lists dib-box">
           
           <li class="dib">
-            <span class="icon iconfont icon-tongzhi"></span>
+            <span class="icon iconfont icon-a-no21"></span>
             <div class="name">
-              通知
+              no.2
             </div>
-            <div class="code-name">.icon-tongzhi
+            <div class="code-name">.icon-a-no21
             </div>
           </li>
           
           <li class="dib">
-            <span class="icon iconfont icon-a-no3"></span>
+            <span class="icon iconfont icon-a-21"></span>
             <div class="name">
-              no.3
+              2
             </div>
-            <div class="code-name">.icon-a-no3
+            <div class="code-name">.icon-a-21
             </div>
           </li>
           
           <li class="dib">
-            <span class="icon iconfont icon-a-no2"></span>
+            <span class="icon iconfont icon-jianpan"></span>
             <div class="name">
-              no.2
+              键盘
             </div>
-            <div class="code-name">.icon-a-no2
+            <div class="code-name">.icon-jianpan
             </div>
           </li>
           
           <li class="dib">
-            <span class="icon iconfont icon-a-no1"></span>
+            <span class="icon iconfont icon-guanbi"></span>
             <div class="name">
-              no.1
+              关闭
             </div>
-            <div class="code-name">.icon-a-no1
+            <div class="code-name">.icon-guanbi
             </div>
           </li>
           
           <li class="dib">
-            <span class="icon iconfont icon-a-2"></span>
+            <span class="icon iconfont icon-zuo"></span>
             <div class="name">
-              2
+              左
+            </div>
+            <div class="code-name">.icon-zuo
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-benjiatushu"></span>
+            <div class="name">
+              本架图书
+            </div>
+            <div class="code-name">.icon-benjiatushu
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-remen"></span>
+            <div class="name">
+              热门
+            </div>
+            <div class="code-name">.icon-remen
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-you"></span>
+            <div class="name">
+              右
+            </div>
+            <div class="code-name">.icon-you
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-tongzhi"></span>
+            <div class="name">
+              通知
+            </div>
+            <div class="code-name">.icon-tongzhi
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-a-no3"></span>
+            <div class="name">
+              no.3
+            </div>
+            <div class="code-name">.icon-a-no3
+            </div>
+          </li>
+          
+          <li class="dib">
+            <span class="icon iconfont icon-a-no1"></span>
+            <div class="name">
+              no.1
             </div>
-            <div class="code-name">.icon-a-2
+            <div class="code-name">.icon-a-no1
             </div>
           </li>
           
@@ -235,42 +325,90 @@
           
             <li class="dib">
                 <svg class="icon svg-icon" aria-hidden="true">
-                  <use xlink:href="#icon-tongzhi"></use>
+                  <use xlink:href="#icon-a-no21"></use>
                 </svg>
-                <div class="name">通知</div>
-                <div class="code-name">#icon-tongzhi</div>
+                <div class="name">no.2</div>
+                <div class="code-name">#icon-a-no21</div>
             </li>
           
             <li class="dib">
                 <svg class="icon svg-icon" aria-hidden="true">
-                  <use xlink:href="#icon-a-no3"></use>
+                  <use xlink:href="#icon-a-21"></use>
                 </svg>
-                <div class="name">no.3</div>
-                <div class="code-name">#icon-a-no3</div>
+                <div class="name">2</div>
+                <div class="code-name">#icon-a-21</div>
             </li>
           
             <li class="dib">
                 <svg class="icon svg-icon" aria-hidden="true">
-                  <use xlink:href="#icon-a-no2"></use>
+                  <use xlink:href="#icon-jianpan"></use>
                 </svg>
-                <div class="name">no.2</div>
-                <div class="code-name">#icon-a-no2</div>
+                <div class="name">键盘</div>
+                <div class="code-name">#icon-jianpan</div>
             </li>
           
             <li class="dib">
                 <svg class="icon svg-icon" aria-hidden="true">
-                  <use xlink:href="#icon-a-no1"></use>
+                  <use xlink:href="#icon-guanbi"></use>
                 </svg>
-                <div class="name">no.1</div>
-                <div class="code-name">#icon-a-no1</div>
+                <div class="name">关闭</div>
+                <div class="code-name">#icon-guanbi</div>
             </li>
           
             <li class="dib">
                 <svg class="icon svg-icon" aria-hidden="true">
-                  <use xlink:href="#icon-a-2"></use>
+                  <use xlink:href="#icon-zuo"></use>
                 </svg>
-                <div class="name">2</div>
-                <div class="code-name">#icon-a-2</div>
+                <div class="name">左</div>
+                <div class="code-name">#icon-zuo</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-benjiatushu"></use>
+                </svg>
+                <div class="name">本架图书</div>
+                <div class="code-name">#icon-benjiatushu</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-remen"></use>
+                </svg>
+                <div class="name">热门</div>
+                <div class="code-name">#icon-remen</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-you"></use>
+                </svg>
+                <div class="name">右</div>
+                <div class="code-name">#icon-you</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-tongzhi"></use>
+                </svg>
+                <div class="name">通知</div>
+                <div class="code-name">#icon-tongzhi</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-a-no3"></use>
+                </svg>
+                <div class="name">no.3</div>
+                <div class="code-name">#icon-a-no3</div>
+            </li>
+          
+            <li class="dib">
+                <svg class="icon svg-icon" aria-hidden="true">
+                  <use xlink:href="#icon-a-no1"></use>
+                </svg>
+                <div class="name">no.1</div>
+                <div class="code-name">#icon-a-no1</div>
             </li>
           
             <li class="dib">

src/assets/iconfont/iconfont.css

@@ -1,9 +1,9 @@
 @font-face {
   font-family: "iconfont"; /* Project id 3646564 */
-  src: url('iconfont.woff2?t=1663123643053') format('woff2'),
-       url('iconfont.woff?t=1663123643053') format('woff'),
-       url('iconfont.ttf?t=1663123643053') format('truetype'),
-       url('iconfont.svg?t=1663123643053#iconfont') format('svg');
+  src: url('iconfont.woff2?t=1663379994606') format('woff2'),
+       url('iconfont.woff?t=1663379994606') format('woff'),
+       url('iconfont.ttf?t=1663379994606') format('truetype'),
+       url('iconfont.svg?t=1663379994606#iconfont') format('svg');
 }
 
 .iconfont {
@@ -14,6 +14,38 @@
   -moz-osx-font-smoothing: grayscale;
 }
 
+.icon-a-no21:before {
+  content: "\e636";
+}
+
+.icon-a-21:before {
+  content: "\e637";
+}
+
+.icon-jianpan:before {
+  content: "\e634";
+}
+
+.icon-guanbi:before {
+  content: "\e630";
+}
+
+.icon-zuo:before {
+  content: "\e631";
+}
+
+.icon-benjiatushu:before {
+  content: "\e632";
+}
+
+.icon-remen:before {
+  content: "\e633";
+}
+
+.icon-you:before {
+  content: "\e62f";
+}
+
 .icon-tongzhi:before {
   content: "\e628";
 }
@@ -22,18 +54,10 @@
   content: "\e629";
 }
 
-.icon-a-no2:before {
-  content: "\e62a";
-}
-
 .icon-a-no1:before {
   content: "\e62b";
 }
 
-.icon-a-2:before {
-  content: "\e62c";
-}
-
 .icon-a-3:before {
   content: "\e62d";
 }

src/assets/iconfont/iconfont.json

@@ -5,6 +5,62 @@
   "css_prefix_text": "icon-",
   "description": "",
   "glyphs": [
+    {
+      "icon_id": "31879702",
+      "name": "no.2",
+      "font_class": "a-no21",
+      "unicode": "e636",
+      "unicode_decimal": 58934
+    },
+    {
+      "icon_id": "31879708",
+      "name": "2",
+      "font_class": "a-21",
+      "unicode": "e637",
+      "unicode_decimal": 58935
+    },
+    {
+      "icon_id": "31879044",
+      "name": "键盘",
+      "font_class": "jianpan",
+      "unicode": "e634",
+      "unicode_decimal": 58932
+    },
+    {
+      "icon_id": "31859389",
+      "name": "关闭",
+      "font_class": "guanbi",
+      "unicode": "e630",
+      "unicode_decimal": 58928
+    },
+    {
+      "icon_id": "31859390",
+      "name": "左",
+      "font_class": "zuo",
+      "unicode": "e631",
+      "unicode_decimal": 58929
+    },
+    {
+      "icon_id": "31859393",
+      "name": "本架图书",
+      "font_class": "benjiatushu",
+      "unicode": "e632",
+      "unicode_decimal": 58930
+    },
+    {
+      "icon_id": "31859394",
+      "name": "热门",
+      "font_class": "remen",
+      "unicode": "e633",
+      "unicode_decimal": 58931
+    },
+    {
+      "icon_id": "31859388",
+      "name": "右",
+      "font_class": "you",
+      "unicode": "e62f",
+      "unicode_decimal": 58927
+    },
     {
       "icon_id": "31804863",
       "name": "通知",
@@ -19,13 +75,6 @@
       "unicode": "e629",
       "unicode_decimal": 58921
     },
-    {
-      "icon_id": "31804865",
-      "name": "no.2",
-      "font_class": "a-no2",
-      "unicode": "e62a",
-      "unicode_decimal": 58922
-    },
     {
       "icon_id": "31804866",
       "name": "no.1",
@@ -33,13 +82,6 @@
       "unicode": "e62b",
       "unicode_decimal": 58923
     },
-    {
-      "icon_id": "31804867",
-      "name": "2",
-      "font_class": "a-2",
-      "unicode": "e62c",
-      "unicode_decimal": 58924
-    },
     {
       "icon_id": "31804868",
       "name": "3",

src/views/lengingRanking.vue

@@ -14,7 +14,7 @@
             <use xlink:href="#icon-a-no1" />
           </svg>
           <svg v-if="item.ranking === 2" class="icon" aria-hidden="true">
-            <use xlink:href="#icon-a-no2" />
+            <use xlink:href="#icon-a-no21" />
           </svg>
           <svg v-if="item.ranking === 3" class="icon" aria-hidden="true">
             <use xlink:href="#icon-a-no3" />

src/views/readStar.vue

@@ -8,7 +8,7 @@
           <use xlink:href="#icon-a-1" />
         </svg>
         <svg v-else-if="item.ranking === 2" class="icon icon-star-2" aria-hidden="true">
-          <use xlink:href="#icon-a-2" />
+          <use xlink:href="#icon-a-21" />
         </svg>
         <svg v-else-if="item.ranking === 3" class="icon icon-star-3" aria-hidden="true">
           <use xlink:href="#icon-a-3" />

src/views/totalLending.vue

@@ -52,10 +52,10 @@ export default {
     },
     toOrderNum(num) {
       num = num.toString() // 数字变成字符串
-      if (num.length < 6) { // 如未满位数，添加"0"补位
+      if (num.length < 9) { // 如未满位数，添加"0"补位
         num = '0' + num
         this.toOrderNum(num) // 递归添加"0"补位
-      } else if (num.length === 6) { // 数中加入逗号
+      } else if (num.length === 9) { // 数中加入逗号
         this.chartNum = num.split('') // 将其便变成数据
       } else {
         alert('显示异常')