no message

components/bussiness/status-bar.vue

@@ -12,7 +12,11 @@
             <span class="score-text">勤奋值</span>
           </div>
           <div v-for="(item, index) in statusTextList" :key="index">
-            <span class="circle" :class="{'active': activeNum >= (index + 1)}"></span>
+            <span v-if="activeNum < (index + 1)" class="circle" :class="{'active': activeNum >= (index + 1)}"></span>
+            <div v-if="activeNum >= (index + 1)" >
+              <span class="active-circle"></span>
+              <span class="active-circle-active"></span>
+            </div>
             <span class="score" :class="{'active': activeNum >= (index + 1)}">{{item}}</span>
           </div>
         </div>
@@ -89,7 +93,11 @@ export default {
       if(activeWidth >= 100) {
         activeWidth = 100;
       }
-      this.activeWidth = activeWidth + '%';
+      if(minValue == 100 || minValue == 200 || minValue >= 300) {
+        this.activeWidth = activeWidth - 3 + '%';
+      } else {
+        this.activeWidth = activeWidth + '%';
+      }
       this.htmlText = htmlText;
     }
   },
@@ -176,17 +184,42 @@ export default {
               &.active {
                 color: #730F21;   
                 background: linear-gradient(360deg,rgba(255,160,33,1) 0%,rgba(255,232,165,1) 100%);
+                // background: rgba(255, 232, 165, 0.3);
                 border: none;
                 font-weight: 700;
               }
             }
           }
           .circle.active {
-            border: 4px solid #FFE8A5;
+            border: 4px solid rgba(255, 232, 165, 1);
+            // background: rgba(255, 232, 165, 0.3);
             // background: rgba(255, 200, 100, 1);
             background: linear-gradient(360deg,rgba(255,160,33,1) 0%,rgba(255,232,165,1) 100%);
           }
         }
+        .active-circle {
+          display: block;
+          position: relative;
+          top: 1px !important;
+          z-index: 100;
+          left: 0px;
+          width: 16px;
+          height: 16px;
+          background: #FFE8A5;
+          opacity: 0.3;
+          border-radius: 8px;
+          
+        }
+        .active-circle-active {
+          position: relative;
+          top: -12px;
+          display: block;
+          width: 10px;
+          height: 10px;
+          left: 3px;
+          background:linear-gradient(360deg,rgba(255,160,33,1) 0%,rgba(255,232,165,1) 100%);
+          border-radius: 10px;
+        }
       }
     }
   }

package-lock.json

@@ -5523,8 +5523,7 @@
         },
         "ansi-regex": {
           "version": "2.1.1",
-          "bundled": true,
-          "optional": true
+          "bundled": true
         },
         "aproba": {
           "version": "1.2.0",
@@ -5542,13 +5541,11 @@
         },
         "balanced-match": {
           "version": "1.0.0",
-          "bundled": true,
-          "optional": true
+          "bundled": true
         },
         "brace-expansion": {
           "version": "1.1.11",
           "bundled": true,
-          "optional": true,
           "requires": {
             "balanced-match": "^1.0.0",
             "concat-map": "0.0.1"
@@ -5561,18 +5558,15 @@
         },
         "code-point-at": {
           "version": "1.1.0",
-          "bundled": true,
-          "optional": true
+          "bundled": true
         },
         "concat-map": {
           "version": "0.0.1",
-          "bundled": true,
-          "optional": true
+          "bundled": true
         },
         "console-control-strings": {
           "version": "1.1.0",
-          "bundled": true,
-          "optional": true
+          "bundled": true
         },
         "core-util-is": {
           "version": "1.0.2",
@@ -5675,8 +5669,7 @@
         },
         "inherits": {
           "version": "2.0.4",
-          "bundled": true,
-          "optional": true
+          "bundled": true
         },
         "ini": {
           "version": "1.3.5",
@@ -5686,7 +5679,6 @@
         "is-fullwidth-code-point": {
           "version": "1.0.0",
           "bundled": true,
-          "optional": true,
           "requires": {
             "number-is-nan": "^1.0.0"
           }
@@ -5699,20 +5691,17 @@
         "minimatch": {
           "version": "3.0.4",
           "bundled": true,
-          "optional": true,
           "requires": {
             "brace-expansion": "^1.1.7"
           }
         },
         "minimist": {
           "version": "0.0.8",
-          "bundled": true,
-          "optional": true
+          "bundled": true
         },
         "minipass": {
           "version": "2.9.0",
           "bundled": true,
-          "optional": true,
           "requires": {
             "safe-buffer": "^5.1.2",
             "yallist": "^3.0.0"
@@ -5729,7 +5718,6 @@
         "mkdirp": {
           "version": "0.5.1",
           "bundled": true,
-          "optional": true,
           "requires": {
             "minimist": "0.0.8"
           }
@@ -5810,8 +5798,7 @@
         },
         "number-is-nan": {
           "version": "1.0.1",
-          "bundled": true,
-          "optional": true
+          "bundled": true
         },
         "object-assign": {
           "version": "4.1.1",
@@ -5821,7 +5808,6 @@
         "once": {
           "version": "1.4.0",
           "bundled": true,
-          "optional": true,
           "requires": {
             "wrappy": "1"
           }
@@ -5897,8 +5883,7 @@
         },
         "safe-buffer": {
           "version": "5.1.2",
-          "bundled": true,
-          "optional": true
+          "bundled": true
         },
         "safer-buffer": {
           "version": "2.1.2",
@@ -5928,7 +5913,6 @@
         "string-width": {
           "version": "1.0.2",
           "bundled": true,
-          "optional": true,
           "requires": {
             "code-point-at": "^1.0.0",
             "is-fullwidth-code-point": "^1.0.0",
@@ -5946,7 +5930,6 @@
         "strip-ansi": {
           "version": "3.0.1",
           "bundled": true,
-          "optional": true,
           "requires": {
             "ansi-regex": "^2.0.0"
           }
@@ -5985,13 +5968,11 @@
         },
         "wrappy": {
           "version": "1.0.2",
-          "bundled": true,
-          "optional": true
+          "bundled": true
         },
         "yallist": {
           "version": "3.1.1",
-          "bundled": true,
-          "optional": true
+          "bundled": true
         }
       }
     },